@charset "utf-8";
/* CSS Document */
html {scroll-behavior:smooth;}
body {font-family: 'lemon_milkregular', sans-serif; font-size:1.176vw; color:#000000; text-transform:uppercase; position:relative; overflow-x:hidden !important; background:#fff;}
* {margin:0; padding:0; transition:all .5s;}
a {text-decoration:none; color:#34b8c0; transition:all .5s;}
a:hover {color:#e54e35; text-decoration:none;}
b, strong {font-weight:600;}
ul, ol {list-style:none; margin:0;}
img {height:auto; width:auto; max-width:100%; width:100%}
img, a {outline:none; box-shadow:none; border:0;}

.center {text-align:center;}
.band {position:relative;}
.band::before { content: "";
    position: absolute;
    width: 50%;
    height: 7.8%;
    background: #d6e040;
    z-index: 0;
    top: 52%;
    left: -49%;}
	
.band::after { content: "";
    position: absolute;
    width: 50%;
    height: 7.8%;
    background: #d6e040;
    z-index: 0;
    top: 52%;
    right: -49%;}
	
	
.band1 {position:relative;}
.band1::before { content: "";
    position: absolute;
    width: 50%;
    height: 7.8%;
    background: #d6e040;
    z-index: 0;
    top: 12.3%;
    left: -49%;}
	
.band1::after { content: "";
    position: absolute;
    width: 50%;
    height: 7.8%;
    background: #d6e040;
    z-index: 0;
    top: 12.3%;
    right: -49%;}

.color {
    width: 14.2%;
	margin-top:165px; margin-bottom:90px;
}
.color img {padding: 0px 0px 20px 0px;}

.color p {
	font-size: 15px !important;
    font-weight: 400 !important;
	padding-left:15px;
	margin-bottom: 0px !important;}
	
.color li {font-size: 14px;
    color: rgb( 0, 0, 0 );
    font-weight: 300;
    line-height: 1.4;
    text-align: left;
	padding-left:15px}
	
/* Works on Firefox */
* {scrollbar-width:thin/*none*/; scrollbar-color:#000000 #eee;}
/* Works on Chrome, Edge, and Safari */
*::-webkit-scrollbar {width:8px/*0*/;}
*::-webkit-scrollbar-track {background:#eee;}
*::-webkit-scrollbar-thumb {background-color:#000000; border-radius:0px; border:0px solid orange;}

@font-face {font-family: 'lemon_milkregular';
    src: url('../fonts/lemonmilk-regular-webfont.eot');
    src: url('../fonts/lemonmilk-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/lemonmilk-regular-webfont.woff2') format('woff2'),
         url('../fonts/lemonmilk-regular-webfont.woff') format('woff'),
         url('../fonts/lemonmilk-regular-webfont.ttf') format('truetype'),
         url('../fonts/lemonmilk-regular-webfont.svg#lemon_milkregular') format('svg');
    font-weight: normal; font-style: normal;}
@font-face {font-family: 'lemon_milkmedium';
    src: url('../fonts/lemonmilk-medium-webfont.eot');
    src: url('../fonts/lemonmilk-medium-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/lemonmilk-medium-webfont.woff2') format('woff2'),
         url('../fonts/lemonmilk-medium-webfont.woff') format('woff'),
         url('../fonts/lemonmilk-medium-webfont.ttf') format('truetype'),
         url('../fonts/lemonmilk-medium-webfont.svg#lemon_milkmedium') format('svg');
    font-weight: normal; font-style: normal;}
	
@font-face {font-family: 'lemon_milklight';
    src: url('../fonts/lemonmilk-light-webfont.eot');
    src: url('../fonts/lemonmilk-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/lemonmilk-light-webfont.woff2') format('woff2'),
         url('../fonts/lemonmilk-light-webfont.woff') format('woff'),
         url('../fonts/lemonmilk-light-webfont.ttf') format('truetype'),
         url('../fonts/lemonmilk-light-webfont.svg#lemon_milklight') format('svg');
    font-weight: normal; font-style: normal;}

@font-face {font-family: 'lemon_milkbold';
    src: url('../fonts/lemonmilk-bold-webfont.eot');
    src: url('../fonts/lemonmilk-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/lemonmilk-bold-webfont.woff2') format('woff2'),
         url('../fonts/lemonmilk-bold-webfont.woff') format('woff'),
         url('../fonts/lemonmilk-bold-webfont.ttf') format('truetype'),
         url('../fonts/lemonmilk-bold-webfont.svg#lemon_milkbold') format('svg');
    font-weight: normal; font-style: normal;}
	
@font-face {
    font-family: 'gothamLight';
    src: url('../fonts/gothamLight.eot');
    src: url('../fonts/gothamLight.eot') format('embedded-opentype'),
         url('../fonts/gothamLight.woff2') format('woff2'),
         url('../fonts/gothamLight.woff') format('woff'),
         url('../fonts/gothamLight.ttf') format('truetype'),
         url('../fonts/gothamLight.svg#gothamLight') format('svg');
}

@font-face {
    font-family: 'GothamBold';
    src: url('../fonts/GothamBold.eot');
    src: url('../fonts/GothamBold.eot') format('embedded-opentype'),
         url('../fonts/GothamBold.woff2') format('woff2'),
         url('../fonts/GothamBold.woff') format('woff'),
         url('../fonts/GothamBold.ttf') format('truetype'),
         url('../fonts/GothamBold.svg#GothamBold') format('svg');
}
	
	
	
 /*video {object-fit:cover; position:relative; top:0; left:0;}*/
video::-webkit-media-controls-panel {background-image: linear-gradient(transparent, transparent) !important;}
 
.preloader {position:fixed; top:0; left:0; width:100%; height:100%; z-index:9999; background-image: url('../images/loading.gif'); background-repeat: no-repeat; background-color:#FFF; background-position:center center; display:none;}

#wrapper {margin:0;}

header {width:100%; position:fixed; left:0; top:0; z-index:20; transition:all .5s; top:0; padding:40px 60px;}
header .logo {float:left; margin:18.5px 0 0 0;}
header .logo h2 {font-family:'lemon_milkbold'; font-size:16px; color:#fff; font-weight:400; letter-spacing:1rem; margin-bottom:0;}
header .logo h2 a{color:#fff;}
header .logo h2:hover a{color:#d6e040;}
header .logo h2 span {color:#d6e040;}
header .logo h2:hover span {color:#ffffff !important;}
header .menu {float:right; margin:11px 0 0 0; position:relative; z-index:5; }
header .menu a.mbut {width:32px; height:32px; border:6px solid #fff; display:inline-block; border-radius:50%;}
header .menu a.mbut:hover {border-color:#d6e040;}
header .menu a.active {border-color:#d6e040 !important;}

header .m-menu {float:right; margin:11px 0 0 0; position:relative; z-index:5; display:none;}
header .m-menu a.m-mbut {width:32px; height:32px; border:6px solid #fff; display:inline-block; border-radius:50%;}
header .m-menu a.m-mbut:hover {border-color:#d6e040;}
header .m-menu a.active {border-color:#d6e040 !important;}

.submenu {position:absolute; z-index:1; right:60px; top:37px; height:64px; padding:0 45px; display:none;}
.submenu ul li {margin:0; display:inline-block;}
.submenu ul li a {color:#fff; font-family: 'lemon_milkregular'; font-size:13px; padding:0 15px; line-height:64px;}
.submenu ul li:hover a {color:#d6e040 !important;}

.submenumobile {position:absolute; z-index:1; right:0px; top:0px; height:auto; padding:6px 45px 6px 0px; display:none; background:#000; width:100%;}
.submenumobile ul li {margin:0; display:inline-block;}
.submenumobile ul li a {color:#fff; font-family: 'lemon_milkregular'; font-size:12px; padding:8px 15px; line-height:1.2; display:inline-block;}
.submenumobile ul li:hover a {color:#d6e040 !important;}

.mobmenucont {position:fixed; top:0px; left:-85%; width:85%; z-index:99999; height:100%; background:#000; overflow-y:auto;}
.bgm {position:fixed; top:0px; left:0px; width:100%; min-height:100%; height:100%; background:rgba(0,0,0,0.7); z-index:9999; display:none; background-image:url(../images/close.png); background-repeat:no-repeat; background-position:94.5% 17px; background-size:30px;}
.mobilemenucontent {margin:0; padding:30px 0px 30px 30px;}
.mobilemenucontent ul li {margin:0; display:block;}
.mobilemenucontent ul li a {color:#fff; font-family: 'lemon_milkregular'; font-size:13px; padding:15px 0; line-height:normal; display:block;}
.mobilemenucontent ul li:hover a {color:#d6e040 !important;}
.mobilemenucontent h2 {font-family:'lemon_milkbold'; font-size:16px; color:#fff; font-weight:400; letter-spacing:0.25rem; margin-bottom:15px;}
.mobilemenucontent h2 a{color:#fff;}
.mobilemenucontent h2:hover a{color:#d6e040;}
.mobilemenucontent h2 span {color:#d6e040;}
.mobilemenucontent h2:hover span {color:#ffffff !important;}
.closemmenu {cursor:pointer;}

.socialcopy {margin-top:30px;}
.socialcopy ul li {display:inline-block; margin:0 10px 0 0;}
.socialcopy ul li a {width:35px; height:35px; display:inline-block; background:url('../images/socials.gif') no-repeat 0 0;}
.socialcopy ul li a.instagram {background-position:0 0;}
.socialcopy ul li a.instagram:hover {background-position:0 -35px;}
.socialcopy ul li a.youtube {background-position:-46px 0;}
.socialcopy ul li a.youtube:hover {background-position:-46px -35px;}
.socialcopy ul li a.behance {background-position:-91px 0;}
.socialcopy ul li a.behance:hover {background-position:-91px -35px;}
.socialcopy ul li a.wa {width:35px; height:35px; display:inline-block; background:url('../images/m-icon-whatsapp.png') no-repeat 0 0;}
.socialcopy ul li a.wa:hover {background-position:0 -35px;}
.socialcopy p.copy {font-family:'lemon_milklight'; font-size:11px; line-height:1.7; color:#fff; font-weight:400; margin:15px 0 0px 0; letter-spacing:0.2rem}

/*///////////////////// -------- Home Banner Start Here -------- /////////////////////*/
.homevideo {margin:0; padding:0; background-color:#000; position:relative; width:100%; top:0px; left:0; z-index:1;}
.homevideo video {object-fit:cover; width:100vw; height:100vh; position:relative; top:0; left:0;}
.homevideo .playbut {position:absolute; right:45px; bottom:40px; width:40px; height:47px; background:url('../images/play-but.png') no-repeat -40px; display:inline-block; background-size:cover;}
.homevideo .playbut:hover {background:url('../images/play-but.png') no-repeat 0 0; background-size:cover;}
.homevideo .bgvideo {position:relative; right:0; bottom:0; min-width:100%; min-height:100%;}

.mfame {display:none;}

.fullvideo {margin:0; padding:0; background-color:#000; position:fixed; width:100vw; height:100vh; top:0px; left:0; z-index:30; display:none;}
.fullvideo .close-video {border:0px solid #fff; border-radius:50px; width:36px; height:36px; padding: 3px; color:#fff; font-family: 'lemon_milklight'; border: 0px solid #fff; position:absolute; z-index:32; right:30px; top:20px; text-align:center; font-size:16px; cursor:pointer;}
.fullvideo .convideo {width:100%; height:100vh; text-align:center; display:flex; align-items:center; justify-content:center;}
.fullvideo .convideo video {object-fit:cover; width:100vw; height:100vh; position:relative; top:0; left:0;}
.fullvideo .convideo video::-webkit-media-controls-panel {display: flex !important; opacity: 1 !important;}


.fullvideo1 {margin:0; padding:0; background-color:#000; position:fixed; width:100vw; height:100vh; top:0px; left:0; z-index:30; display:none;}
.fullvideo1 .close-video1 {border:0px solid #fff; border-radius:50px; width:36px; height:36px; line-height:30px; color:#fff; font-family: 'lemon_milklight'; border: 0px solid #fff; position:absolute; z-index:32; right:30px; top:20px; text-align:center; font-size:16px; cursor:pointer;}
.fullvideo1 .convideo1 {width:100%; height:100vh; text-align:center; display:flex; align-items:center; justify-content:center;}
.fullvideo1 .convideo1 video {object-fit:cover; width:100vw; height:100vh; position:relative; top:0; left:0;}
.fullvideo1 .convideo1 video::-webkit-media-controls-panel {display: flex !important; opacity: 1 !important;}


.fullvideo2 {margin:0; padding:0; background-color:#000; position:fixed; width:100vw; height:100vh; top:0px; left:0; z-index:30; display:none;}
.fullvideo2 .close-video2 {border:0px solid #fff; border-radius:50px; width:36px; height:36px; line-height:30px; color:#fff; font-family: 'lemon_milklight'; border: 0px solid #fff; position:absolute; z-index:32; right:30px; top:20px; text-align:center; font-size:16px; cursor:pointer;}
.fullvideo2 .convideo2 {width:100%; height:100vh; text-align:center; display:flex; align-items:center; justify-content:center;}
.fullvideo2 .convideo2 video {object-fit:cover; width:100vw; height:100vh; position:relative; top:0; left:0;}
.fullvideo2 .convideo2 video::-webkit-media-controls-panel {display: flex !important; opacity: 1 !important;}


.fullvideo3 {margin:0; padding:0; background-color:#000; position:fixed; width:100vw; height:100vh; top:0px; left:0; z-index:30; display:none;}
.fullvideo3 .close-video3 {border:0px solid #fff; border-radius:50px; width:36px; height:36px; line-height:30px; color:#fff; font-family: 'lemon_milklight'; border: 0px solid #fff; position:absolute; z-index:32; right:30px; top:20px; text-align:center; font-size:16px; cursor:pointer;}
.fullvideo3 .convideo3 {width:100%; height:100vh; text-align:center; display:flex; align-items:center; justify-content:center;}
.fullvideo3 .convideo3 video {object-fit:cover; width:100vw; height:100vh; position:relative; top:0; left:0;}
.fullvideo3 .convideo3 video::-webkit-media-controls-panel {display: flex !important; opacity: 1 !important;}

.fullvideo4 {margin:0; padding:0; background-color:#000; position:fixed; width:100vw; height:100vh; top:0px; left:0; z-index:30; display:none;}
.fullvideo4 .close-video4 {border:0px solid #fff; border-radius:50px; width:36px; height:36px; line-height:30px; color:#fff; font-family: 'lemon_milklight'; border: 0px solid #fff; position:absolute; z-index:32; right:30px; top:20px; text-align:center; font-size:16px; cursor:pointer;}
.fullvideo4 .convideo4 {width:100%; height:100vh; text-align:center; display:flex; align-items:center; justify-content:center;}
.fullvideo4 .convideo4 video {object-fit:cover; width:100vw; height:100vh; position:relative; top:0; left:0;}
.fullvideo4 .convideo4 video::-webkit-media-controls-panel {display: flex !important; opacity: 1 !important;}

.fullvideo5 {margin:0; padding:0; background-color:#000; position:fixed; width:100vw; height:100vh; top:0px; left:0; z-index:30; display:none;}
.fullvideo5 .close-video5 {border:0px solid #fff; border-radius:50px; width:36px; height:36px; line-height:30px; color:#fff; font-family: 'lemon_milklight'; border: 0px solid #fff; position:absolute; z-index:32; right:30px; top:20px; text-align:center; font-size:16px; cursor:pointer;}
.fullvideo5 .convideo5 {width:100%; height:100vh; text-align:center; display:flex; align-items:center; justify-content:center;}
.fullvideo5 .convideo5 video {object-fit:cover; width:100vw; height:100vh; position:relative; top:0; left:0;}
.fullvideo5 .convideo5 video::-webkit-media-controls-panel {display: flex !important; opacity: 1 !important;}

.fullvideo6 {margin:0; padding:0; background-color:#000; position:fixed; width:100vw; height:100vh; top:0px; left:0; z-index:30; display:none;}
.fullvideo6 .close-video6 {border:0px solid #fff; border-radius:50px; width:36px; height:36px; line-height:30px; color:#fff; font-family: 'lemon_milklight'; border: 0px solid #fff; position:absolute; z-index:32; right:30px; top:20px; text-align:center; font-size:16px; cursor:pointer;}
.fullvideo6 .convideo6 {width:100%; height:100vh; text-align:center; display:flex; align-items:center; justify-content:center;}
.fullvideo6 .convideo6 video {object-fit:cover; width:100vw; height:100vh; position:relative; top:0; left:0;}
.fullvideo6 .convideo6 video::-webkit-media-controls-panel {display: flex !important; opacity: 1 !important;}

.fullvideo7 {margin:0; padding:0; background-color:#000; position:fixed; width:100vw; height:100vh; top:0px; left:0; z-index:30; display:none;}
.fullvideo7 .close-video7 {border:0px solid #fff; border-radius:50px; width:36px; height:36px; line-height:30px; color:#fff; font-family: 'lemon_milklight'; border: 0px solid #fff; position:absolute; z-index:32; right:30px; top:20px; text-align:center; font-size:16px; cursor:pointer;}
.fullvideo7 .convideo7 {width:100%; height:100vh; text-align:center; display:flex; align-items:center; justify-content:center;}
.fullvideo7 .convideo7 video {object-fit:cover; width:100vw; height:100vh; position:relative; top:0; left:0;}
.fullvideo7 .convideo7 video::-webkit-media-controls-panel {display: flex !important; opacity: 1 !important;}

.fullvideo8 {margin:0; padding:0; background-color:#000; position:fixed; width:100vw; height:100vh; top:0px; left:0; z-index:30; display:none;}
.fullvideo8 .close-video8 {border:0px solid #fff; border-radius:50px; width:36px; height:36px; line-height:30px; color:#fff; font-family: 'lemon_milklight'; border: 0px solid #fff; position:absolute; z-index:32; right:30px; top:20px; text-align:center; font-size:16px; cursor:pointer;}
.fullvideo8 .convideo8 {width:100%; height:100vh; text-align:center; display:flex; align-items:center; justify-content:center;}
.fullvideo8 .convideo8 video {object-fit:cover; width:100vw; height:100vh; position:relative; top:0; left:0;}
.fullvideo8 .convideo8 video::-webkit-media-controls-panel {display: flex !important; opacity: 1 !important;}

.fullvideo9 {margin:0; padding:0; background-color:#000; position:fixed; width:100vw; height:100vh; top:0px; left:0; z-index:30; display:none;}
.fullvideo9 .close-video9 {border:0px solid #fff; border-radius:50px; width:36px; height:36px; line-height:30px; color:#fff; font-family: 'lemon_milklight'; border: 0px solid #fff; position:absolute; z-index:32; right:30px; top:20px; text-align:center; font-size:16px; cursor:pointer;}
.fullvideo9 .convideo9 {width:100%; height:100vh; text-align:center; display:flex; align-items:center; justify-content:center;}
.fullvideo9 .convideo9 video {object-fit:cover; width:100vw; height:100vh; position:relative; top:0; left:0;}
.fullvideo9 .convideo9 video::-webkit-media-controls-panel {display: flex !important; opacity: 1 !important;}

/*///////////////////// -------- Inner Banner Start Here -------- /////////////////////*/
.innerbanner {margin:0; padding:0; background-color:#fff; position:relative; width:100%; top:0px; left:0; z-index:0;}
.innerbanner .cover {width:100%; height:100%; position:absolute; top:0; left:0px; margin:0; display:table;}
.innerbanner .coverbg1 {background:url('../images/bg-brand-identity.jpg') no-repeat center center; background-size:cover;}
.innerbanner .coverbg2 {background:url('../images/bg-work1.jpg') no-repeat center center; background-size:cover;}
.innerbanner .coverbg3 {background:url('../images/bg-visual-strategy.jpg') no-repeat center center; background-size:cover;}
.innerbanner .coverbg4 {background:url('../images/bg-digital.jpg') no-repeat center center; background-size:cover;}
.innerbanner .coverbg5 {background:url('../images/bg-illustration.jpg') no-repeat center center; background-size:cover;}
.innerbanner .cover .heading {height:100%; max-width:100%; text-align:center; vertical-align:middle; display:table-cell; font-family:'lemon_milkbold'; font-size:5vw; color:#fff; font-weight:400; letter-spacing:2rem; padding-left:2vw; padding-top:7.5px;}
.innerbanner .cover .heading1 {height:100%; max-width:100%; text-align:center; vertical-align:middle; display:table-cell; font-family:'lemon_milkbold'; font-size:5vw; color:#000; font-weight:400; letter-spacing:2rem; padding-left:2vw; padding-top:7.5px;}

/*///////////////////// -------- About Section Start Here -------- /////////////////////*/
.aboutsec {background:#fff; padding:150px 0; position:relative;}
.aboutsec .intro {margin:0 auto; padding:0;}
.aboutsec .intro p {font-family:'gothamLight'; font-size:15px; color:#000; font-weight:400; line-height:1.7; margin-bottom:0; }
.aboutsec .intro h2 {font-family:'lemon_milkbold'; font-size:3.5vw; color:#000; font-weight:400; letter-spacing: -0.1rem; margin-bottom:0;}
.aboutsec .introhead {text-align:center; display:flex; align-items:center; justify-content:flex-end;}
/*///////////////////// -------- Work Section Start Here -------- /////////////////////*/
.worksec {padding:30px 0 15vh 0;}
.worksec .container {max-width:100%; padding:0;}
.worksec .container .row {margin-left:0; margin-right:0;}
.worksec .container h2 {text-align:center; font-family:'lemon_milkbold'; font-size:10vw; color:#000; font-weight:400; letter-spacing: -0.4rem; margin-bottom:5rem;}
.worksec .container .work {position:relative; /*padding-left:0; padding-right:0;*/}
.worksec .container .work p {position:absolute; left:15px; bottom:10px; font-family:'lemon_milkbold'; font-size:2vw; line-height:normal; color:#000; font-weight:400; margin-bottom:0;}
.worksec .container .work:hover p.w-col {color:#fff;}
.w1mart {top:-2rem}
.w2mart {top:-5rem;}
.w3mart {top:-4rem}
.w4mart {top:-3rem}
.w5mart {top:-2rem}
.workpic1 {background:url('../images/w-pic1.jpg') no-repeat 0 0; background-size:cover; transition:all 1s}
.workpic1:hover {background-position:0 100%;}
.workpic2 {background:url('../images/w-pic2.jpg') no-repeat 0 0; background-size:cover; transition:all 1.2s}
.workpic2:hover {background-position:0 100%;}
.workpic3 {background:url('../images/w-pic3.jpg') no-repeat 0 0; background-size:cover; transition:all 1.3s}
.workpic3:hover {background-position:0 100%;}
.workpic4 {background:url('../images/w-pic4.jpg') no-repeat 0 0; background-size:cover; transition:all 1.4s}
.workpic4:hover {background-position:0 100%;}
.workpic5 {background:url('../images/w-pic5.jpg') no-repeat 0 0; background-size:cover; transition:all 1.5s}
.workpic5:hover {background-position:0 100%;}

/*.rollover:hover .workpic1 {background-position:0 100%;}
.rollover:hover .workpic2 {background-position:0 100%;}
.rollover:hover .workpic3 {background-position:0 100%;}
.rollover:hover .workpic4 {background-position:0 100%;}
.rollover:hover .workpic5 {background-position:0 100%;}
.rollover:hover .work p.w-col {color:#fff;}*/

/*///////////////////// -------- Services Section Start Here -------- /////////////////////*/
.services {padding:30px 0 30vh 0; background:#ffffff; position:relative; text-align:center;}
.services .container {max-width:100%; padding:0 6vw;}
.services .container p {font-family:'lemon_milkbold'; line-height:1; font-size:3.5vw; color:#000; font-weight:400; letter-spacing: -0.1rem; margin-bottom:0; padding-top:8vh;}
.services .container .ser {padding-left:0; padding-right:0; background-size:cover !important; background-position:0 0; background-repeat:no-repeat; transition:none; position:relative;}
.services .container .ser .cover {width:100%; height:100%; position:absolute; left:0; top:0; background-position:0 0; background-repeat:no-repeat; background-size:cover !important; z-index:2;}

.services .container .srv1 {background-image:url('../images/s-pic1.png');}
.services .container .srv2 {background-image:url('../images/s-pic2.png'); margin-left:-25px;}
.services .container .srv3 {background-image:url('../images/s-pic3.png'); margin-left:-25px;}
.services .container .srv4 {background-image:url('../images/s-pic4.png'); margin-left:-30px;}
.services .container .srv5 {background-image:url('../images/s-pic5.png'); margin-left:-35px;}
.services .container .srv6 {background-image:url('../images/s-pic6.png'); margin-left:-35px;}
.services .container .srv7 {background-image:url('../images/s-pic7.png'); margin-left:-35px;}
.services .container .srv8 {background-image:url('../images/s-pic8.png'); margin-left:-40px;}

.services .container .srv1 .cover {opacity:1; background-image:url('../images/s-pic1-hover.png');}
.services .container .srv2 .cover {opacity:1; background-image:url('../images/s-pic2-hover.png');}
.services .container .srv3 .cover {opacity:1; background-image:url('../images/s-pic3-hover.png');}
.services .container .srv4 .cover {opacity:1; background-image:url('../images/s-pic4-hover.png');}
.services .container .srv5 .cover {opacity:1; background-image:url('../images/s-pic5-hover.png');}
.services .container .srv6 .cover {opacity:1; background-image:url('../images/s-pic6-hover.png');}
.services .container .srv7 .cover {opacity:1; background-image:url('../images/s-pic7-hover.png');}
.services .container .srv8 .cover {opacity:1; background-image:url('../images/s-pic8-hover.png');}

.services .container .srv1:hover .cover {opacity:1; background-image:url('../images/s-pic1-hover.png');}
.services .container .srv2:hover .cover {opacity:1; background-image:url('../images/s-pic2-hover.png');}
.services .container .srv3:hover .cover {opacity:1; background-image:url('../images/s-pic3-hover.png');}
.services .container .srv4:hover .cover {opacity:1; background-image:url('../images/s-pic4-hover.png');}
.services .container .srv5:hover .cover {opacity:1; background-image:url('../images/s-pic5-hover.png');}
.services .container .srv6:hover .cover {opacity:1; background-image:url('../images/s-pic6-hover.png');}
.services .container .srv7:hover .cover {opacity:1; background-image:url('../images/s-pic7-hover.png');}
.services .container .srv8:hover .cover {opacity:1; background-image:url('../images/s-pic8-hover.png');}


/*.services .container .srv1:hover {background-image:url('../images/s-pic1-hover.png');}
.services .container .srv2:hover {background-image:url('../images/s-pic2-hover.png')}
.services .container .srv3:hover {background-image:url('../images/s-pic3-hover.png')}
.services .container .srv4:hover {background-image:url('../images/s-pic4-hover.png')}
.services .container .srv5:hover {background-image:url('../images/s-pic5-hover.png')}
.services .container .srv6:hover {background-image:url('../images/s-pic6-hover.png')}
.services .container .srv7:hover {background-image:url('../images/s-pic7-hover.png')}
.services .container .srv8:hover {background-image:url('../images/s-pic8-hover.png')}*/

.blink {
  animation: blink-animation 1s steps(4, start) infinite;
  -webkit-animation: blink-animation 1s steps(4, start) infinite;
}
@keyframes blink-animation {
  to {
    visibility: hidden;
  }
}
@-webkit-keyframes blink-animation {
  to {
    visibility: hidden;
  }
}

.blinking {
    -webkit-animation: 3s blink ease infinite;
    -moz-animation: 3s blink ease infinite;
    -ms-animation: 3s blink ease infinite;
    -o-animation: 3s blink ease infinite;
    animation: 3s blink ease infinite;
  }

  @keyframes "blink" {

    from,
    to {
      opacity: 0;
    }

    50% {
      opacity: 1;
    }
  }

  @-moz-keyframes blink {

    from,
    to {
      opacity: 0;
    }

    50% {
      opacity: 1;
    }
  }

  @-webkit-keyframes "blink" {

    from,
    to {
      opacity: 0;
    }

    50% {
      opacity: 1;
    }
  }

  @-ms-keyframes "blink" {

    from,
    to {
      opacity: 0;
    }

    50% {
      opacity: 1;
    }
  }

  @-o-keyframes "blink" {

    from,
    to {
      opacity: 0;
    }

    50% {
      opacity: 1;
    }
  }
  
.blinking1 {
    -webkit-animation: 3.5s blink ease infinite;
    -moz-animation: 3.5s blink ease infinite;
    -ms-animation: 3.5s blink ease infinite;
    -o-animation: 3.5s blink ease infinite;
    animation: 3.5s blink ease infinite;
  }

  @keyframes "blink" {

    from,
    to {
      opacity: 0;
    }

    50% {
      opacity: 1;
    }
  }

  @-moz-keyframes blink {

    from,
    to {
      opacity: 0;
    }

    50% {
      opacity: 1;
    }
  }

  @-webkit-keyframes "blink" {

    from,
    to {
      opacity: 0;
    }

    50% {
      opacity: 1;
    }
  }

  @-ms-keyframes "blink" {

    from,
    to {
      opacity: 0;
    }

    50% {
      opacity: 1;
    }
  }

  @-o-keyframes "blink" {

    from,
    to {
      opacity: 0;
    }

    50% {
      opacity: 1;
    }
  }

.blinking2 {
    -webkit-animation: 4s blink ease infinite;
    -moz-animation: 4s blink ease infinite;
    -ms-animation: 4s blink ease infinite;
    -o-animation: 4s blink ease infinite;
    animation: 4s blink ease infinite;
  }

  @keyframes "blink" {

    from,
    to {
      opacity: 0;
    }

    50% {
      opacity: 1;
    }
  }

  @-moz-keyframes blink {

    from,
    to {
      opacity: 0;
    }

    50% {
      opacity: 1;
    }
  }

  @-webkit-keyframes "blink" {

    from,
    to {
      opacity: 0;
    }

    50% {
      opacity: 1;
    }
  }

  @-ms-keyframes "blink" {

    from,
    to {
      opacity: 0;
    }

    50% {
      opacity: 1;
    }
  }

  @-o-keyframes "blink" {

    from,
    to {
      opacity: 0;
    }

    50% {
      opacity: 1;
    }
  }
  
  .blinking3 {
    -webkit-animation: 4.5s blink ease infinite;
    -moz-animation: 4.5s blink ease infinite;
    -ms-animation: 4.5s blink ease infinite;
    -o-animation: 4.5s blink ease infinite;
    animation: 4.5s blink ease infinite;
  }

  @keyframes "blink" {

    from,
    to {
      opacity: 0;
    }

    50% {
      opacity: 1;
    }
  }

  @-moz-keyframes blink {

    from,
    to {
      opacity: 0;
    }

    50% {
      opacity: 1;
    }
  }

  @-webkit-keyframes "blink" {

    from,
    to {
      opacity: 0;
    }

    50% {
      opacity: 1;
    }
  }

  @-ms-keyframes "blink" {

    from,
    to {
      opacity: 0;
    }

    50% {
      opacity: 1;
    }
  }

  @-o-keyframes "blink" {

    from,
    to {
      opacity: 0;
    }

    50% {
      opacity: 1;
    }
  }



/*///////////////////// -------- Brands Section Start Here -------- /////////////////////*/
.brandsec {padding:0 0 20vh 0;}
.brandsec .container {max-width:97.45%; padding:0;/*max-width:100%; padding:0 8vw;*/}
.brandsec .container .head {text-align:center; font-family:'lemon_milkbold'; font-size:10vw; color:#000; font-weight:400; margin-bottom:0; letter-spacing: -0.6rem; position:relative; z-index:1;}
.brandsec .container .brand {position:relative; padding-left:0; padding-right:0;}
.brandsec .container .brand p {position:absolute; left:15px; bottom:10px; font-family:'lemon_milkbold'; font-size:2.5vw; line-height:normal; color:#000; font-weight:400; margin-bottom:0;}
.brandsec .container .brand .htext {opacity:0; position:absolute; top:0; left:0; width:100%; height:100%; text-align:center; display:flex; align-items:center; justify-content:center; z-index:5; font-family:'lemon_milkbold'; font-size:1.6vw; color:#fff; line-height:1.2; letter-spacing:0.1rem;}
/*.brandsec .container .brand .htext table {width:100%; height:100%;}
.brandsec .container .brand .htext table td {font-family:'lemon_milkbold'; font-size:1.8vw; color:#fff; text-align:center; line-height:1.2; vertical-align:middle; height:100%; letter-spacing:0.1rem;}*/
.brandsec .container .brand img {filter:grayscale(100%);}
.brandsec .container .brand:hover img {filter:grayscale(0);}
.brandsec .container .brand:hover .htext {opacity:1;}
/*.brandsec .container .brand:hover .effect {position:absolute; left:0; top:0; width:100%; height:100%; background:#d6e040; mix-blend-mode: darken;}*/

.b1mart {top:0}
.b2mart {top:2rem;}
.b3mart {top:0}
.b4mart {top:0.5rem}
.b5mart {top:-0.5rem}
.b6mart {top:2rem}
.b7mart {top:0}
/*.owl-carousel .owl-stage-outer {overflow:scroll !important;}*/


/*///////////////////// -------- Clients Section Start Here -------- /////////////////////*/
.dcenter {max-width: 1100px; margin: 0 auto;}
.clientsec {padding:230px 0 65vh 0; background: rgb(255,255,255);
background: -moz-linear-gradient(top,  rgba(255,255,255,1) 50%, rgba(214,224,64,1) 50%);
background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 50%,rgba(214,224,64,1) 50%);
background: linear-gradient(to bottom,  rgba(255,255,255,1) 50%,rgba(214,224,64,1) 50%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#d6e040',GradientType=0 );}
.clientsec .container {max-width:100%; padding:0 7.3vw;}
.clientsec .container h2 {text-align:center; font-family:'lemon_milkbold'; font-size:3.5vw; color:#000; font-weight:400; letter-spacing: -0.2rem; margin-bottom:1rem;}
.clientsec .container .cldiv {background:#000; padding:3vw; margin:0 10px; width: 100%; max-width: 33.333%;}
.clientsec .container .cldiv p {font-family:'gothamLight'; font-size:15px; color:#fff; font-weight:400;  margin-bottom:2rem; text-transform: initial;}
.clientsec .container .cldiv p.cname {font-family:'lemon_milkbold'; text-transform: uppercase; font-size:16px; color:#fff; margin-bottom:0; line-height:1.3;}

.clientsec .container .cldiv1::before {content:""; background:url(../images/bg-q1.png) no-repeat 0 0; width:100%; height:22vw; position:absolute; left:0; top:-22vw; background-size:cover;}
.clientsec .container .cldiv2::after {content:""; background:url(../images/bg-q2.png) no-repeat 0 0; width:100%; height:22vw; position:absolute; right:0;bottom:-22vw; background-size:100%;}
.clientsec .container .cldiv3::after {content:""; background:url(../images/bg-q3.png) no-repeat 0 0; width:100%; height:22vw; position:absolute; right:0;bottom:-22vw; background-size:100%;}
.clientsec .container .marl{margin-left:16.666%}
/*///////////////////// -------- Media Section Start Here -------- /////////////////////*/
.mediasec {padding:30px 0 17vh 0; background:#d6e040;}
.mediasec .container {max-width:100%; padding:0 8vw;}
.mediasec .container h2 {text-align:center; font-family:'lemon_milkbold'; font-size:4.5vw; color:#000; font-weight:400; letter-spacing: -0.2rem; margin-bottom:1rem;}
.mediasec .container .media {position:relative; padding-left:0; padding-right:0;}
.mediasec .container .media p {font-family:'lemon_milklight'; font-size:14px; color:#000; font-weight:400;  margin-bottom:0; padding:10px 10px 0 10px;}
.mediasec .container .media p strong {font-family:'lemon_milkbold';}
.mediasec .container .media p i {font-family:'lemon_milkbold'; font-style:normal; font-size:14px; color:#fff; font-weight:400; padding:0; display:block;}
.mediasec .container .media:hover {z-index:2;}
.mediasec .container .media:hover img {-moz-transform:scale(1.1);-webkit-transform:scale(1.1);transform:scale(1.1);}
.mediasec .container .media:hover p {padding-top:35px}
.m1mart {top:0;}
.m2mart {top:1rem;}
.m3mart {top:0;}
.m4mart {top:2rem;}
.m5mart {top:0;}
.m6mart {top:2rem;}

.mediasec table {width:100%; display:none;}
.mediasec table td p {font-family:'lemon_milklight'; font-size:9px; color:#000; font-weight:400; margin-bottom:0;}
.mediasec table td p strong {font-family:'lemon_milkbold';}
.mediasec table td p i {font-family:'lemon_milkbold'; font-style:normal; font-size:9px; color:#fff; font-weight:400; display:block;}

/*///////////////////// -------- Get In Touch Section Start Here -------- /////////////////////*/
.getintouch {padding:30px 0 64px 0; background:#d6e040; position:relative;text-align:center;}
.getintouch .container {position:relative; z-index:2;}
.getintouch .container .gform p.head {font-family:'lemon_milkbold'; font-size:25px; color:#000; font-weight:400; margin-bottom:15px; }
.getintouch .container .gform p.head span {color:#fff;}
.getintouch .container .gform .form {max-width:750px; margin:0 auto;}
.getintouch .container .gform .form input[type=text], .getintouch .container .gform .form input[type=tel], .getintouch .container .gform .form input[type=email], .getintouch .container .gform .form select {height:calc(2em + .75rem + 16px); padding:.375rem 1.3rem; border:0; outline:0; background:#fff; font-family:'gothamLight'; font-size:14px; color:#000; font-weight:500;}
.getintouch .container .gform .form textarea {line-height:1.2; padding:1.375rem 1.3rem; border:0; outline:0; background:#fff; font-family:'gothamLight'; font-size:14px; color:#000; font-weight:400;}
.getintouch .container .gform .form select {line-height:1.2; padding:.375rem 1.3rem .375rem 1rem; width:100%;}

/*///////////////////// -------- Footer Section Start Here -------- /////////////////////*/
footer {background:#000; padding:50px 0 128px 0; position:relative; text-align:center;}
footer p.head {font-family:'lemon_milkbold'; font-size:16px; color:#fff; font-weight:400; margin-bottom:23px; letter-spacing:1rem}
footer p.head span {color:#d6e040;}
footer p.email {font-family:'lemon_milklight'; font-size:11px; color:#fff; font-weight:400; margin-bottom:50px; letter-spacing:0.3rem}
footer p.email a {color:#fff;}
footer p.email a:hover {color:#d6e040;}
footer ul li {display:inline-block; margin:0 10px;}
footer ul li a {width:35px; height:35px; display:inline-block; background:url('../images/socials.gif') no-repeat 0 0;}
footer ul li a.instagram {background-position:0 0;}
footer ul li a.instagram:hover {background-position:0 -35px;}
footer ul li a.youtube {background-position:-46px 0;}
footer ul li a.youtube:hover {background-position:-46px -35px;}
footer ul li a.behance {background-position:-91px 0;}
footer ul li a.behance:hover {background-position:-91px -35px;}
footer p.copy {font-family:'lemon_milklight'; font-size:11px; color:#fff; font-weight:400; margin:15px 0 0px 0; letter-spacing:0.3rem}
footer .topdiv {position:fixed; right:10px; bottom:0px; z-index:9; display:none;}
footer .topdiv .top {width:56px; height:66px; background:url('../images/top.png') no-repeat 0 0; display:inline-block;}
footer .topdiv .top:hover {background:url('../images/top.png') no-repeat 0 -66px;}
footer .topdiv .wa {width:56px; height:66px; background:url('../images/icon-wa.png') no-repeat 0 0; display:inline-block;}
footer .topdiv .wa:hover {background:url('../images/icon-wa.png') no-repeat 0 -66px;}


/*///////////////////// -------- Inner Pages End Here -------- /////////////////////*/
.innercont {background:#fff; padding:0 0 20vh 0; position:relative;}
/*.innercont .container {max-width:1140px; padding:0;}*/
.innercont .container .title {font-family:'lemon_milkbold'; font-size:14px; color:#000; font-weight:400; letter-spacing:1px; margin-bottom:10px; padding-top:19vh;}
.innercont .container .title_sub {font-family:'lemon_milkbold'; font-size:14px; color:#000; font-weight:400; letter-spacing:1px; margin-bottom:10px; padding-top:3vh;}
.innercont .container .showcase {position:relative; overflow:hidden; text-align:center}

/*.innercont .container .showcase:hover {box-shadow:0 0px 50px 0 rgba(214,224,64,1); -moz-box-shadow:0 0px 50px 0 rgba(214,224,64,1); -webkit-box-shadow:0 0px 50px 0 rgba(214,224,64,1);}
.innercont .container .showcase:hover img {-moz-transform:scale(1.05);-webkit-transform:scale(1.05);transform:scale(1.05); outline:2px solid rgba(214,224,64,1); outline-offset:-60px;}*/
.innercont .container p {
  font-size: 14px;
  font-family: 'lemon_milkbold';
  color: rgb( 0, 0, 0 );
  line-height: 1.6;
  text-align: left;
  word-spacing: 3px;
  margin-bottom: 25px;}

.innercont .container .cap {max-width:1000px; margin:0 auto; text-align: center;}
.innercont .container .cap p{font-size: 14px;
  font-family: "gothamLight";
  color: rgb( 0, 0, 0 );
  line-height: 1.44;
  text-align: center;
  word-spacing: .5px;
  margin-bottom: 25px;
  text-transform: initial;}
  
.innercont .container .cap1 {max-width:660px; margin:0 auto;}
.innercont .container .cap1 p{font-size: 14px;
  font-family: "gothamLight";
  color: rgb( 0, 0, 0 );
  line-height: 1.44;
  text-align: center;
  word-spacing: .5px;
  margin-bottom: 25px;
  text-transform: initial;}
    
.innercont .container .box850 {max-width:850px; margin:0 auto; position:relative;}

.innercont .container .box8501 {max-width:850px; margin:0 auto; position:relative; height: 568px;}
.innercont .container .box8501 .code-left {position:absolute; left:0; top:0;}
.innercont .container .box8501 .code-right {position:absolute; right:0; top:0;}


input, textarea, select, button {outline:none !important; box-shadow:none; border:0; border-radius:0px !important; border:0px solid #ccc !important;}
label {display:inline-block; margin-bottom:.5rem; font-weight:500; font-size:13px; color:#333;}
.inputbtn {margin-bottom:10px; border:0; outline:0; padding:0 25px; line-height:60px; font-family:'lemon_milkbold'; font-size:16px; color:#000; font-weight:400; text-transform:uppercase;}
.inputbtn:hover {color:#fff;}

.tabs {padding-top: 20vh; text-align: center;}
.tabs ul li {display:inline-block; font-size: 15px;}
.tabs ul li a {display:inline-block; line-height:normal; font-family:'lemon_milklight'; font-size: 15px; color:#000; font-weight:400; letter-spacing:0.1rem;}
.tabs ul li a:hover, .tabs ul li a.active {color:#d6e040;}

/********  Custom CSS start here ********/
.disonmob {display:none;}
.blackq {padding:0; margin:0 10px; display:none;}
.blackq img {width:65%;}
.whiteq {padding:0; margin:-20px 10px 0 10px; text-align:right; display:none;}
.whiteq img {width:65%;}
.smallt {font-size:15px !important;}
.spacer {padding-top:30vh;}
.headcolor {background:#000; padding:5px 30px 3px 30px; height:64px;}
.menu-s {margin-top:11px !important;}
.submenupad {top:2px; right:30px;}
/*.mbut-s {width:40px !important; height:40px !important; border:8px solid #fff !important;}*/
.padrgt10p {padding-right:20% !important;}
.padrgt4p {padding-right:4% !important;}
.gcolor {color:#d6e040; text-transform: uppercase;}
.wcolor {color:#ffffff !important;}
.bcolor {color:#000000 !important;}
.wbgcolor {background:#ffffff !important;}
.gbgcolor {background:#d6e040 !important;}
.marl0 {margin-left:0 !important; margin-right:0 !important;}
.mart6Brands {margin-top:-6vh !important; margin-left:16%; margin-right:16%;}
.pad0 {padding:0 !important}
.padbot15 {padding-bottom:15px !important}
.marbot30 {margin-bottom:30px;}
.marbot36 {margin-bottom:36px;}
.marbot60 {margin-bottom:60px;}
.marbot17 {margin-bottom:17px;}
.marbot19 {margin-bottom:19px;}
.marbot23 {margin-bottom:23px;}
.marbot27 {margin-bottom:27px;}
.marbot20 {margin-bottom:1vw;}
.marbot15 {margin-bottom:15px;}
.marbot10 {margin-bottom:10px;}
.marbot90 {margin-bottom:90px;}
.marbot119 {margin-bottom:119px;}
.marbot105 {margin-bottom:105px;}
.marbot150 {margin-bottom:150px;}
.marbot225 {margin-bottom:225px;}
.marbot50 {margin-bottom:50px;}

.martop50 {margin-top:50px;}
.martop100 {margin-top:100px;}
.martop150 {margin-top:150px;}
.martop145 {margin-top:145px;}
.martop175 {margin-top:175px;}
.martop200 {margin-top:200px;}
.martop185 {margin-top:120px;}
.martop225 {margin-top:225px;}
.paddingt{ padding-top:140px;}
.bserbox {display:none;}

.disc{display:contents;}
table{border-collapse:collapse;border-spacing:0;}
.txtright {text-align:right !important;}
.txtcenter {text-align:center !important;}

.q1, .q3 {display:none;}
::-webkit-input-placeholder {color:#000}
:-ms-input-placeholder {color:#000}
::placeholder {color:#000}

.mdis {display:none;}

/* The device with borders */
.smartphone {position: relative; width: 80%; border: 16px black solid; border-top-width: 60px; border-bottom-width: 60px; border-radius:36px;-webkit-box-shadow:90px 0px 90px -60px rgba(0,0,0,0.16); -moz-box-shadow:90px 0px 90px -60px rgba(0,0,0,0.16); box-shadow:90px 0px 90px -60px rgba(0,0,0,0.16);}
.smartphone:before {content: ''; display: block; width: 60px; height: 5px; position: absolute; top: -30px; left: 50%; transform: translate(-50%, -50%); background: #333; border-radius: 10px;}
.smartphone:after {content: '';display: block; width: 35px; height: 35px; position: absolute; left: 50%; bottom: -65px; transform: translate(-50%, -50%);background: #333; border-radius: 50%;}
.smartphone .content {width:100%; background:#000;}

.smartphone1 {width: 91%; border-radius:70px; -webkit-box-shadow:90px 40px 30px -60px rgb(0 0 0 / 16%); -moz-box-shadow:90px 40px 30px -60px rgb(0 0 0 / 16%); box-shadow:90px 40px 30px -60px rgb(0 0 0 / 16%);}
.smartphone1 img {width:100%; border-radius:70px;}


/********  Responsive CSS start here ********/
@media (max-width:1600px){
	.owl-theme .owl-nav.disabled+.owl-dots{bottom:-60% !important;}
	
}

@media (max-width:1366px){
.innercont .container {max-width: 100%; padding: 0 6vw;}
.owl-theme .owl-nav.disabled+.owl-dots{bottom:-58% !important;}

}


@media (max-width:1179px){
	header {padding-left:30px; padding-right:30px;}
	.aboutsec .container {max-width:100%;}
	.padrgt10p {padding-right: 20% !important;}
	
	.aboutsec .introhead {text-align:center;align-items: center; justify-content: center; padding-right: 0 !important; max-width: 100% !important;
    flex:100%; text-align: center !important;}
	.aboutsec .intro {margin: 0 auto; padding: 0 45px 20px 45px !important; flex: 100%; max-width: 100%;}
	.aboutsec .intro p {text-align:center; font-size:13px; line-height: 1.4; margin-bottom:0;}
	.aboutsec .intro h2 {font-size:30px; letter-spacing: -0.01rem;}   
	.nobr {display:none;}
	
	.worksec .container h2 {font-size:4rem; letter-spacing:-0.2rem;}
	.worksec .container .work p {left:5px; font-size:3vw; font-size:2.1vw; line-height:1.4;}
	
	.services .container p {font-size:30px; letter-spacing: -0.01rem;}
	
	.brandsec .container .head {font-size:4rem; letter-spacing:-0.2rem; line-height:1;}
	.mart6Brands {margin-top:-15px !important; margin-left: 0; margin-right: 0; position:relative; z-index:1;}
	
	.clientsec .container {padding-top:0vh;}
	.clientsec .container h2 {font-size:30px; letter-spacing:-0.01rem;}
	.clientsec .container .cldiv p {font-size:13px; line-height:1.2;}
	.clientsec .container .cldiv p.cname {font-size:12px;}
	
	
	.mediasec .container h2 {font-size:30px; letter-spacing: -0.01rem;}
	.mediasec .container .media p {font-size:12px;}
	.mediasec .container .media i {font-size:12px;}
	.owl-theme .owl-nav.disabled+.owl-dots {display:none;}
	
	.aboutsec {padding:60px 0 40px 0;}
	.worksec {padding:30px 0 40px 0;}
	.services {padding:30px 0 60px 0;}
	.brandsec {padding:0 0 5vh 0;}
	.clientsec {padding:160px 0 200px 0;}
	.mediasec {padding: 30px 0 60px 0;}
	
	
}
@media (max-width:1040px){
	.homevideo video {object-fit:contain;}
	/*.homevideo {height:280px !important;}*/
	.homevideo video {height:auto;}
	.fullvideo .convideo video {object-fit:contain;}
}

@media (max-width:1023px){
	header .menu {display:none;}
	header .m-menu {display:block;}
	.submenu {display:none;}
	.headcolor {padding:5px 15px 3px 15px;}
	header {padding-left:15px; padding-right:15px;}
	
	.headcolor {height:56px;}
	header {padding-top:5px; padding-bottom:10px;}
	header .logo {margin-top:18px;}
	header .logo h2 {letter-spacing:0.45rem !important; font-size:13px !important;}
	header .m-menu a.m-mbut {width:24px; height:24px; border:4px solid #fff;}
	
	.homevideo {height:auto !important; background:none;}
	.homevideo .bgvideo {display:none;}
	.mfame {display:block;}
	.innerbanner {height:310px !important;}
	.innerbanner .cover .heading {letter-spacing:1rem;}
	.innercont .container {padding:0 60px;}
	.nodisp {display:none;}
	.innercont {padding-bottom:50px;}
	.innercont .container .title {font-size:12px; padding-top:70px; text-align:left;}
	.innercont .container .cap p, .innercont .container .cap1 p {font-size:13px; text-align: left; line-height:1.3;}

	.mobtitle {padding: 70px 85px 0 85px !important}
	.innercont .container .cap1 {padding:0 85px;}
	.innercont .container .cap1 p {text}
	
	.innercont .container .title_sub {text-align:left;}
	.tabs {padding-top:50px;}
	.dispmenu {display:block;}
	.homevideo .playbut {right:15px; bottom:15px; width:24px; height:28px; background: url(../images/play-but.png) no-repeat -24px; display:inline-block;
    background-size:cover;}
	.aboutsec .intro p {font-size:12px; line-height: 1.2;}
	
	
}

@media (max-width:767px){
	
	.aboutsec {padding:70px 0 0px 0;}
	.worksec {padding:70px 0 0px 0;}
	.services {padding:70px 0 60px 0;}
	.brandsec {padding:0 0 0px 0;}
	.clientsec {padding:70px 0 40px 0}
	.getintouch {padding:70px 45px 0px 45px;}
	.mediasec {padding:70px 0 0 0;}
	
	.noserbox {display:none;}
	.bserbox {display:block;}
	
	.pt100 {width:100% !important;}
	
	.services .container .srv5 {margin-left:10px;}
	.services .container .srv8 {margin-left: -30px;}
	.brandsec .container .brand .htext {font-size:13px; letter-spacing:0.05rem;}
	
	.clientsec {background:none !important;}
	.clientsec .container {padding:0 40px 1vh 40px; background:#fff !important;}
	.clientsec .container .cldiv {max-width:100%; flex-basis:auto; margin-bottom:15px; padding:30px;}
	.clientsec .container .cldiv2::after {display:none;}
	.clientsec .container .cldiv1::before {background-size:contain; display:none;}
	.clientsec .container .cldiv3::after {background-size:contain; background-position:100% 0; display:none;}
	
	.clientsec .container h2 {color:#fff;}
	.mdis {display:block;}
	.hidehead {display:none;}
	.clientsec .container .cldiv1-m {background: url(../images/q1-bg.png) no-repeat 0 0 !important; background-size:cover !important;}
	.clientsec .container .cldiv2-m {padding-top:30px; background:#d6e040 !important}
	.clientsec .container .cldiv2-m p {color:#000 !important;}
	.clientsec .container .cldiv2-m p span.gcolor {color:#fff !important;}
	.clientsec .container .cldiv3-m {background:#000 !important; margin-bottom:0;}
	.clientsec .container .cldiv3-m p {color:#fff !important;}
	.q1, .q3 {padding:0 10px; display:block;}
	
	.clientsec .container h2 {text-align:left;}
	
	.blackq {display:block;}
	.whiteq {display:block;}

	.mediasec .container {padding: 0 45px;}
	.mediasec .container .media {flex-basis:auto; padding-left:3px; padding-right:3px; margin-bottom:0px; position:relative; overflow:hidden;}
	.mediasec .container .media div {width:50%; float:left;}
	.m2mart {top:0;}
	.m4mart {top:0;}
	.m6mart {top:0;}
	.mediasec .container .media p {position:relative; z-index:2; background: rgba(214,224,64,0.9); padding:0px 10px 0 10px !important; margin:0; line-height:1.2; min-height:auto; width:50%; float:right; text-align:center;}

	.mediasec .container .media p i {font-size:12px; padding-bottom:0;}
	.mediasec .container .media:hover img {-moz-transform:scale(1);-webkit-transform:scale(1);transform:scale(1);}
	
	.m2mart div, .m4mart div {float:right !important;}
	.m2mart p, .m4mart p {float:left !important; padding-left:0 !important;}
	
	
	footer {padding:40px 0 70px 0;}
	footer p.head {letter-spacing:0.3rem; font-size:15px;}
	footer p.email {letter-spacing:0.08rem; line-height:22px; margin-bottom:26px;}
	footer p.copy {letter-spacing:0.08rem; font-size:9px;}
	.innerbanner .cover .heading {letter-spacing:0.6rem;}
	.innerbanner .cover .heading1 {letter-spacing:0.6rem;}
	.color {margin-top:60px; margin-bottom:50px;}
	.color p {font-size:6px !important; line-height:1.1 !important; padding:0 0 8px 5px;}
	.color li {font-size:8px; padding-left:5px;}
	
	footer .topdiv .wa {width:40px; height:47px; background-size:cover !important;}
	footer .topdiv .wa:hover {background-position:0 -47px;}
	footer .topdiv .top {width:40px; height:47px; background-size:cover !important;}
	footer .topdiv .top:hover {background-position:0 -47px;}
	
	.b1mart {top:0}
	.b2mart {top:15px;}
	.b3mart {top:0}
	.b4mart {top:10px}
	.b5mart {top:-10px}
	.b6mart {top:15px}
	.b7mart {top:0}
	
	.tabs ul li a {font-size:13px;}
	.martop185 {margin-top:50px;}
	
	.wtxt {color:#fff !important;}
	
	.mobtitle {padding:50px 45px 0 45px !important; position:relative; z-index: 5;}
	.innercont .container .cap1 {padding:0 45px; position:relative; z-index:5;}
	
	.innerbanner .coverbg1 {background: url(../images/bg-brand-identity-m.jpg) no-repeat center center;}
	.innerbanner .coverbg2 {background: url(../images/bg-work1-m.jpg) no-repeat center center;}
	.innerbanner .coverbg3 {background: url(../images/bg-visual-strategy-m.jpg) no-repeat center center;}
	.innerbanner .coverbg4 {background: url(../images/bg-digital-m.jpg) no-repeat center center;}
	.innerbanner .coverbg5 {background: url(../images/bg-illustration-m.jpg) no-repeat center center;}
	
	.smartphone1 {width:100%; border-radius:0; -webkit-box-shadow: 90px 40px 30px -60px rgb(0 0 0 / 0%); -moz-box-shadow: 90px 40px 30px -60px rgb(0 0 0 / 0%); box-shadow: 90px 40px 30px -60px rgb(0 0 0 / 0%);}
	.smartphone1 img {border-radius:0;}
	
	.innercont .container .cap p, .innercont .container .cap1 p {margin-bottom:0;}
	.marbot14 {margin-bottom:14px !important;}
	.nobrac {display:none;}
	.disonmob {display:block;}
	.marbot60 {margin-bottom:1vw;}
	.m1mart,.m2mart,.m3mart,.m4mart,.m5mart {display:none;}
	
	.mediasec table {display:block;}
	.marbot20 {margin-bottom:10px;}
	
}
@media (max-width:600px){
	.tabs ul li span {display:none;}
	.tabs ul li {display:block;}
	.tabs ul li a {padding:10px 0;}
}

@media (max-width:414px){
	.owl-carousel .owl-stage-outer {height:150px;}
}
@media (max-width:515px){
	
	footer p.email span {display:block;}
	footer p.email span.spaceb {display:none;}
	footer p.copy {line-height:26px;}
	footer p.copy span {display:block;}
	footer p.copy span.spaceb {display:none;}
}
@media (max-width:375px){

	.owl-carousel .owl-stage-outer {height:121px;}
	


}

@media (max-width:374px){
	.mediasec .container .media p {font-size:9px;}
	.mediasec .container .media p i {font-size:9px;}
}