@import url(https://fonts.googleapis.com/css?family=Slabo+27px);
*{ outline:none !important;}
body{ margin:0; padding:0; font-family: 'Slabo 27px', sans-serif; color:#000; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;	-moz-osx-font-smoothing: grayscale; overflow-x:hidden;}
body, html{ height:100%;}


/* LINKS */
a{color:#a81916;}
a{-webkit-transition: .25s ease-in-out;-moz-transition: .25s ease-in-out;-ms-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out;}
a *{-webkit-transition: .25s ease-in-out;-moz-transition: .25s ease-in-out;-ms-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out;}
a:hover{ text-decoration:none; color:#000}
a:focus{ text-decoration:none; color:#222;}


/* HTML ELEMENTS */
ul{ margin:0; padding:0;}
ul li{ margin:0; padding:0; list-style:none;}
p{ line-height:22px; margin-bottom:15px;}
b{ font-weight:700;}
strong{ font-weight:700;}
img{ max-width:100%; height:auto;}



/* TABLE MIDDLE */
.table{ width:100%; height:100%; display:table; margin:0; position:relative; z-index:2;}
.table .inner{ display:table-cell; vertical-align:middle;}




/* FORM ELEMENTS */
button[type="button"]{ border:none;}
button[type="submit"]{ border:none;}



/* SECTIONS */
main{ width:100%; float:left; padding:0 104px; margin-top: 150px;}
section{ position:relative;}
header{ position:relative;}
footer{ position:relative;}
.container{ max-width:100%;}
.relative{ position:relative;}



/* PAGINATION */
.pagination{ width:100%; float:left;}
.pagination li{ border:none;}
.pagination li a{ border:none; color:#abacb6; font-size:16px; font-weight:600;}
.pagination li a:hover{ background:none; color:#a81916;}
.pagination li.active{ float:left;}
.pagination li.active a{ background:none; color:#05062f;}
.pagination li.active a:hover{ background:none; color:#05062f;}



/* SIDE TITLE */
.side-title{ width:360px; height:100px; float:left; position:absolute; right:-258px; bottom:50%; margin-bottom:-280px; z-index:2; -moz-transform: rotate(-90deg);-ms-transform: rotate(-90deg);-webkit-transform: rotate(-90deg);transform: rotate(-90deg);-moz-transform-origin: 0 0;-ms-transform-origin: 0 0;-webkit-transform-origin: 0 0;transform-origin: 0 0; text-align:center;}
.side-title .center-text{ display:inline-block;}
.side-title .center-text h2{ margin:0;}

.side-title b{ float:left; font-size:17px; font-weight:700; margin-top:40px; margin-right:10px;}
.side-title span{ float:left; font-size:79px; font-weight:700; color:#dad9e0; position:relative; margin-left:115px;}
.side-title span:after{ content:''; width:130px; height:5px; background:#f1f2f4; position:absolute; left:-112px; top:46px; z-index:-1;}
main .side-title{ right:-354px;}




/* HEADER */
header{ width:100%; position:fixed; top:0; left:0; z-index:9; padding:0 104px; background:#fff;}
header *{-webkit-transition: .25s ease-in-out;-moz-transition: .25s ease-in-out;-ms-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out;}
header .inner{ width:100%; height:104px; float:left;}
.navbar-default{ min-height:inherit; border-radius:0; background:none; border:none; margin-top:43px;}
.navbar-default .container-fluid{ padding:0;}
.navbar-default .navbar-brand{ height:auto; padding:0; margin-left:0 !important;}
.navbar-default .navbar-nav>li{ padding:0 15px;}
.navbar-default .navbar-nav>li>a{color:#06032f; padding:0 5px; font-size:19px; font-weight:700; position:relative;}
.navbar-default .navbar-nav>li>a span{ width:1px; height:10px; background:#fff; position:absolute; left:0; bottom:0; z-index:-1;}
.navbar-default .navbar-nav>li>a:hover{ color:#06032f;}
.navbar-default .navbar-nav>li>a:hover span{width:100%; background:#00e3ff;}
.navbar-default .navbar-right{ margin-right:-35px;}
.navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:focus, .navbar-default .navbar-nav>.open>a:hover{ color:#06032f; background:none;}

.navbar-nav>li>.dropdown-menu{ border-radius:0; background:#fff; box-shadow:none; left:0; top:30px; right:auto;}
.dropdown-menu>li>a{ padding:6px 20px; font-weight:600;}
.dropdown-menu>li>a:hover{ background:none; color:#a81916;}

.navbar-default .navbar-header address,
.navbar-default .navbar-header p {
	float: left;
	margin: 0 0 0 80px;
    line-height: 22px;
}


/* NAVIGATION */
.navigation{ width:100%; height:100%; position:fixed; left:0; top:0; background:#fff; opacity:0; visibility:hidden; z-index:5;}
.navigation{-webkit-transition: .25s ease-in-out;-moz-transition: .25s ease-in-out;-ms-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out;}
.navigation.show-me{ opacity:1; visibility:visible;}
.navigation ul{ width:100%; float:left; margin-top:150px;}
.navigation ul li{ width:100%; float:left; text-align:center; margin:10px 0; position:relative;}
.navigation ul li a{ display:inline-block; color:#787787; font-weight:700; font-size:32px; text-transform:uppercase; letter-spacing:5px;}
.navigation ul li ul{ margin:0; background:#eee; border:none; box-shadow:none; position:static;}
.navigation ul li ul li{ float:left; margin:5px;}
.navigation ul li ul li a{ font-size:20px; letter-spacing:0;}




/* MAIN HERO */
.main-hero{ width:100%; height:100%; float:left; padding:0 104px;}
.main-hero .hero{ width:100%; height:100%; float:left; padding:104px 0; overflow:hidden !important;}
.main-hero .hero .inner{ width:100%; height:100%; float:left; overflow:hidden;}
.main-hero .hero .rev_slider_wrapper{background-color:#fff;padding:0px;}
.main-hero .hero .video{ width:100%; height:100%; float:left; position:relative;}
.main-hero .hero .video video{ width:100%; min-height:100%; position:absolute; left:0; top:0;}
.main-hero .hero .video .video-inner{ width:100%; height:100%; position:absolute; left:0; top:0; text-align:center; background:url(../images/video-pattern.png) center no-repeat;}
.main-hero .hero .video .video-inner h2{ font-size:135px; font-weight:700; color:#fff; margin-top:200px;}
.main-hero .hero .video .video-inner h5{ font-size:40px; font-weight:400; color:#fff; margin-bottom:50px; }
.main-hero .hero .slider{ width:100%; height:100%; float:left; position:relative;}
.main-hero .hero a{ display:inline-block; background:#fb37bf; color:#fff; line-height:60px; font-size:25px; padding:0 30px; 
border-radius:60px; position:relative; font-weight:600;}
.main-hero .hero a span{ width:100%; height:60px; border:3px solid #fb37bf; position:absolute; left:0; top:0; border-radius:60px;}
.main-hero .hero a:hover span{border:3px solid #transparent; left:6px; top:8px;}
.main-hero .tp-bullet:hover{border:2px solid #fb37bf;}
.main-hero .tp-bullet{ border-radius:50%; background:none; border:2px solid #00e3ff;}
.main-hero .tp-bullet.selected{ background:#00e3ff;}
.main-hero .tp-bullet.selected:hover{ border:2px solid #00e3ff;}


/* INTERNAL HEADER*/
.int-header{ width:100%; float:left; margin-bottom:104px; padding:0 104px; padding-top:104px;}
.int-header .hero{ width:100%; height:498px; float:left; position:relative;}
.int-header .hero.bg-1{background:url(../images/hero2.jpg) top center no-repeat;}
.int-header .hero.bg-2{background:url(../images/hero3.jpg) top center no-repeat;}
.int-header .hero.bg-3{background:url(../images/hero4.jpg) top center no-repeat;}
.int-header .hero.bg-4{background:url(../images/hero5.jpg) top center no-repeat;}
.int-header .hero .page-name{font-size:50px; font-weight:700; color:#fff; margin-bottom:30px;}
.int-header .hero .breadcrumb{ padding:0; margin:0; padding-left:80px; background:none; position:relative;}
.int-header .hero .breadcrumb:before{content:''; width:184px; height:14px; background:#3e05c3; position:absolute; left:0; top:10px; z-index:-1;}
.int-header .hero .breadcrumb li{ float:left;}
.int-header .hero .breadcrumb li a{ color:#fff; font-weight:600;}
.int-header .hero .breadcrumb li:first-child a{color:#00e5ff;}
.int-header .hero .shapes{ width:100%; height:100%; position:absolute; left:0; top:0; z-index:0; background:url(../images/int-header-shapes.png) center no-repeat;}


/* HOME SERVICES */
.home-services{ width:100%; float:left; position:relative; padding-top:60px;}
.home-services *{-webkit-transition: .25s ease-in-out;-moz-transition: .25s ease-in-out;-ms-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out;}
.home-services .intro{ width:100%; float:left; margin-bottom:100px; padding-left:38px; position:relative;}
.home-services .intro .title{ font-size:45px; margin-top:0; font-weight:700; margin-left:-38px; position:relative;}
.home-services .intro .title:after{content:''; width:3px; height:85px; background:#dad9e0; position:absolute; left:17px; top:23px; z-index:-1;}
.home-services .intro p{ font-size:17px; line-height:27px; color:#787787; font-weight:600; margin-bottom:30px;}
.home-services .intro a{ float:left; font-size:16px; font-weight:700; color:#06032f; position:relative;}
.home-services .intro a span{ width:100%; height:6px; float:left; background:#fff; margin-top:-11px;}
.home-services .intro a:hover span{background:#00e3ff;}
.home-services .service-box{ width:97%; float:left; margin-bottom:110px; position:relative;}
.home-services .service-box.pattern1{ float:left;}
.home-services .service-box.pattern1:before{content:''; width:267px; height:140px; position:absolute; left:-22px; top:-22px; background:url(../images/pattern1.png) no-repeat; z-index:-1;}
.home-services .service-box.pattern2{ float:left;}
.home-services .service-box.pattern2:before{content:''; width:57px; height:60px; position:absolute; right:-28px; top:180px; background:url(../images/pattern2.png) no-repeat; z-index:2;}
.home-services .service-box.pattern3{ float:left;}
.home-services .service-box.pattern3:before{content:''; width:118px; height:90px; position:absolute; right:-58px; top:290px; background:url(../images/pattern3.png) no-repeat; z-index:-1;}
.home-services .service-box.pattern4{ float:left;}
.home-services .service-box.pattern4:before{content:''; width:109px; height:184px; position:absolute; right:-24px; bottom:116px; background:url(../images/pattern4.png) no-repeat; z-index:-1;}
.home-services .service-box figure{ width:100%; float:left;}
.home-services .service-box figure img{ width:100%; display:block;}
.home-services .service-box figure figcaption{ width:100%; float:left; padding-left:75px; margin-top:-50px; position:relative; z-index:2;}
.home-services .service-box figure figcaption .title{ display:block; font-size:59px; font-weight:700;}
.home-services .service-box figure figcaption ul{ width:100%; float:left; padding-left:110px; position:relative;}
.home-services .service-box figure figcaption ul:after{content:''; width:85px; height:3px; background:#dad9e0; position:absolute; left:0; top:4px;}
.home-services .service-box figure figcaption ul li{ width:100%; float:left; font-size:17px; font-weight:600; color:#787787;}
.home-services .service-box figure:hover ul:after{ background:#a81916;}
.home-services .service-box figure:hover img{ box-shadow:15px 15px 35px rgba(0,0,0,0.15);}





/* RECENT WORK */
.recent-work{ width:100%; float:left; margin-bottom:200px; background:#f1f2f4; padding:150px 0;}
.recent-work *{-webkit-transition: .25s ease-in-out;-moz-transition: .25s ease-in-out;-ms-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out;}
.recent-work .intro{ width:100%; float:left; padding-left:38px;}
.recent-work .intro .title{ margin-top:0; font-size:15px; font-weight:700; color:#a81916; margin-left:-38px;}
.recent-work .intro .project-title{margin-left:-38px; font-size:53px; font-weight:700; position:relative; z-index:2;}
.recent-work .intro .project-title:after{content:''; width:3px; height:85px; background:#dad9e0; position:absolute; left:17px; top:23px; z-index:-1;}
.recent-work .intro p{ font-size:17px; line-height:27px; color:#787787; font-weight:600; margin-bottom:30px;}
.recent-work .intro a{ float:right; font-size:16px; font-weight:700; color:#06032f; position:relative;}
.recent-work .intro a span{ width:100%; height:6px; float:left; background:#f1f2f4; margin-top:-11px;}
.recent-work .intro a:hover span{background:#00e3ff;}
.recent-work .work1{ float:right; margin-top:-260px; position:relative; z-index:2;}
.recent-work .work1:after{content:''; width:170px; height:350px; background:#a81916; position:absolute; bottom:-100px; right:-38px; z-index:0;}
.recent-work .work1 img{ display:block; z-index:2; position:relative;}
.recent-work .work1 figcaption{ width:300px; float:left; font-size:12px; font-weight:700; color:#787787; text-transform:uppercase; position:absolute; left:-25px; top:100%; z-index:2; -moz-transform: rotate(-90deg);-ms-transform: rotate(-90deg);-webkit-transform: rotate(-90deg);transform: rotate(-90deg);-moz-transform-origin: 0 0;-ms-transform-origin: 0 0;-webkit-transform-origin: 0 0;transform-origin: 0 0;}
.recent-work .work1:hover img{ box-shadow:15px 15px 35px rgba(0,0,0,0.15);}
.recent-work .work2{ margin-top:80px; margin-bottom:-260px;}
.recent-work .work2:hover img{ box-shadow:15px 15px 35px rgba(0,0,0,0.15);}




/* HELLO */
.hello{ width:100%; float:left; padding:100px 0;}
.hello .title{ margin-top:0; margin-bottom:25px; font-size:45px; font-weight:700;}
.hello p{ padding:0 16%; margin-bottom:30px; font-size:17px; font-weight:600; color:#787787;}
.hello a{ display:inline-block; background:#fb37bf; color:#fff; line-height:60px; font-size:25px; padding:0 30px; 
border-radius:60px; position:relative;}
.hello a span{ width:100%; height:60px; border:3px solid #fb37bf; position:absolute; left:0; top:0; border-radius:60px;}
.hello a:hover span{border:3px solid #transparent; left:6px; top:8px;}


/* OUR TEAM */
.our-team { width:100%; float:left; margin-top:50px;}
.our-team .purple-box{ width:100%; height:415px; float:left; background:url(../images/pattern5.png) no-repeat center bottom #a81916; background-position-x:40%; margin-bottom:-900px; margin-top:200px; position:relative;}
.our-team .purple-box:after{content:''; width:50%; height:100%; background:#fff; position:absolute; right:0; top:0;}
.our-team .intro{ width:100%; float:left; margin-bottom:100px; padding-left:38px; position:relative;}
.our-team .intro .title{ font-size:45px; margin-top:0; font-weight:700; margin-left:-38px; position:relative;}
.our-team .intro .title:after{content:''; width:3px; height:85px; background:#dad9e0; position:absolute; left:17px; top:23px; z-index:-1;}
.our-team .intro p{ font-size:17px; line-height:27px; color:#787787; font-weight:600; margin-bottom:30px;}
.our-team .intro a{ float:left; font-size:16px; font-weight:700; color:#06032f; position:relative;}
.our-team .intro a span{ width:100%; height:6px; float:left; background:#fff; margin-top:-11px;}
.our-team .intro a:hover span{background:#00e3ff;}
.our-team .member{ float:left; position:relative; margin-bottom:60px;}
.our-team .member *{-webkit-transition: .25s ease-in-out;-moz-transition: .25s ease-in-out;-ms-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out;}
.our-team .member img{ display:block; margin-bottom:20px;}
.our-team .member ul{ position:absolute; left:10px; top:15px; opacity:0;}
.our-team .member ul li{ width:20px; display:block; text-align:center;}
.our-team .member ul li a{ display:inline-block; color:#a81916;}
.our-team .member ul li a:hover{ color:#06032f;}
.our-team .member figcaption{ width:100%; float:left; padding-left:54px; position:relative; opacity:0;}
.our-team .member figcaption:after{content:''; width:3px; height:60px; background:transparent; position:absolute; left:34px; top:-20px;}
.our-team .member figcaption.custom{ float:left;}
.our-team .member figcaption.custom .name{ color:#fff;}
.our-team .member figcaption .name{ font-size:24px; font-weight:700; margin-bottom:5px;}
.our-team .member figcaption .job-title{ color:#787787; font-weight:700; font-size:11px; text-transform:uppercase;}
.our-team .member:hover img{ box-shadow:15px 15px 35px rgba(0,0,0,0.15);}
.our-team .member:hover ul{ opacity:1;}
.our-team .member:hover figcaption{ opacity:1;}
.our-team .member:hover figcaption:after{background:#4a07e3;}
.our-team .member:hover figcaption.custom:after{background:#00d0ec;}
.our-team .member:hover figcaption.custom .job-title{color:#00d0ec;}



/* MEET THE TEAM */
.meet-the-team{ width:100%; float:left; margin-bottom:-100px;}
.meet-the-team .gray-bg{ width:100%; height:450px; float:left; background:#f1f2f4; position:absolute; left:0; top:250px;}
.meet-the-team .gray-bg:after{content:''; left: -webkit-calc(100% - 0px); left: calc(100% - 0px);width: -webkit-calc((100vw - 1280px) / 2 + 104px); width: calc((100vw - 1280px) / 2 + 104px);  height:100%; background:#f1f2f4; position:absolute; right:0; top:0; z-index:-1;}
.meet-the-team .purple-bg{ width:100%; height:500px; background:url(../images/pattern14.png) left center no-repeat #4e07eb; position:absolute; left:0; bottom:240px; z-index:-1;}
.meet-the-team .purple-bg:after{content:''; width:50%; height:100%; position:absolute; top:0; right:0; background:#fff;}
.meet-the-team .intro{ width:100%; float:left; margin-bottom:60px; padding-left:38px; position:relative;}
.meet-the-team .intro .title{ font-size:45px; margin-top:0; font-weight:700; margin-left:-38px; position:relative;}
.meet-the-team .intro .title:after{content:''; width:3px; height:85px; background:#dad9e0; position:absolute; left:17px; top:23px; z-index:-1;}
.meet-the-team .intro p{ max-width:470px; font-size:17px; line-height:27px; color:#787787; font-weight:600; margin-bottom:30px;}
.meet-the-team .member{ float:left; position:relative; margin-bottom:130px;}
.meet-the-team .member.moveup{ margin-top:-180px;}
.meet-the-team .member.movedown{ margin-top:95px;}
.meet-the-team .member *{-webkit-transition: .25s ease-in-out;-moz-transition: .25s ease-in-out;-ms-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out;}
.meet-the-team .member img{ display:block; margin-bottom:20px;}
.meet-the-team .member ul{ position:absolute; left:10px; top:15px; opacity:0;}
.meet-the-team .member ul li{ width:20px; display:block; text-align:center;}
.meet-the-team .member ul li a{ display:inline-block; color:#a81916;}
.meet-the-team .member ul li a:hover{ color:#06032f;}
.meet-the-team .member figcaption{ width:100%; float:left; padding-left:54px; position:relative;}
.meet-the-team .member figcaption:after{content:''; width:3px; height:60px; background:#4a07e3; position:absolute; left:34px; top:-20px;}
.meet-the-team .member figcaption .name{ font-size:24px; font-weight:700; margin-bottom:5px;}
.meet-the-team .member figcaption .job-title{ color:#787787; font-weight:700; font-size:11px; text-transform:uppercase;}
.meet-the-team .member:hover img{ box-shadow:15px 15px 35px rgba(0,0,0,0.15);}
.meet-the-team .member:hover ul{ opacity:1;}
.meet-the-team .member:hover .job-title{ color:#4a07e3;}
.meet-the-team .hire-us{ width:100%; float:left; text-align:center; margin-top:100px;}
.meet-the-team .hire-us h3{ font-size:27px; font-weight:700; color:#fff; margin-bottom:25px;}
.meet-the-team .hire-us a{ display:inline-block; color:#00efff; font-size:16px; font-weight:600;}
.meet-the-team .hire-us a span{ width:100%; height:6px; background:#3e05c3; float:left; margin-top:-10px;}


/* OUR SHORT STORY */
.our-short-story{ width:100%; float:left;}
.our-short-story .story-content{ width:100%; float:left; margin-bottom:100px; padding-left:38px; position:relative;}
.our-short-story .story-content .title{ font-size:45px; margin-top:0; font-weight:700; margin-left:-38px; position:relative;}
.our-short-story .story-content .title:after{content:''; width:3px; height:85px; background:#dad9e0; position:absolute; left:17px; top:23px; z-index:-1;}
.our-short-story .story-content p{ font-size:17px; line-height:27px; color:#787787; font-weight:600; margin-bottom:30px;}





/* FUNF FACTS */
.fun-facts{ width:100%; float:left; padding:130px 0;}
.fun-facts span{ font-weight:700; font-size:74px;}
.fun-facts h5{ margin-top:-10px; position:relative; padding-left:55px; color:#787787; font-size:16px;}
.fun-facts h5:before{content:''; width:40px; height:3px; position:absolute; left:0; top:6px; background:#dbdae0;}



/* STUDIO */
.studio{ width:100%; float:left; padding:100px 0; text-align:center;}
.studio .intro{ width:100%; float:left; margin-bottom:30px; padding-left:38px; position:relative; text-align:left;}
.studio .intro .title{ font-size:45px; margin-top:0; font-weight:700; margin-left:-38px; position:relative;}
.studio .intro .title:after{content:''; width:3px; height:85px; background:#dad9e0; position:absolute; left:17px; top:23px; z-index:-1;}
.studio .intro p{ max-width:500px; font-size:17px; line-height:27px; color:#787787; font-weight:600; margin-bottom:30px;}
.studio .center{ position:relative; padding-top:40px; background:url(../images/pattern1.png) no-repeat top center;}
.studio .center *{-webkit-transition: .25s ease-in-out;-moz-transition: .25s ease-in-out;-ms-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out;}
.studio .center:after{content:''; width:3px; height:50px; background:#a81916; position:absolute; left:50%; bottom:-20px; }
.studio .slick-track{ padding-top:30px;}
.studio .slick-slide{ opacity:0.25;}
.studio .slick-center{box-shadow:0 0 35px rgba(0,0,0,0.15); margin-top:-30px; position:relative; z-index:9999; opacity:1;}
.studio .slick-prev{ width:18px; height:28px; background:url(../images/left-arrow.png) no-repeat; position:absolute; left:50%; bottom:-70px; margin-left:-50px; text-indent:-99999px;}
.studio .slick-prev:hover{ background:url(../images/left-arrow-hover.png) no-repeat;}
.studio .slick-next{ width:18px; height:28px; background:url(../images/right-arrow.png) no-repeat; position:absolute; right:50%; bottom:-70px; margin-right:-50px; text-indent:-9999px;}
.studio .slick-next:hover{background:url(../images/right-arrow-hover.png) no-repeat;}



/* CLIENTS */
.clients{ width:100%; float:left; padding:100px 0;}
.clients .title{ margin-top:0; margin-bottom:90px; font-size:45px; font-weight:700; text-align:center;}
.clients .testimonials-container{ width:100%; max-width:840px; margin:0 auto;}
.clients .testimonials-box{ width:100%; float:left; background:#f1f2f4; padding:60px 0; position:relative;}
.clients .testimonials-box:after{content:''; left: -webkit-calc(100% - 0px); left: calc(100% - 0px);width: -webkit-calc((100vw - 1280px) / 2 + 104px); width: calc((100vw - 1280px) / 2 + 104px);  height:100%; background:#f1f2f4; position:absolute; right:0; top:0; z-index:-1;}
.clients .testimonials-box:before{content:''; width:42px; height:100%; position:absolute; left:0; top:0; background:#fff;}
.clients .testimonials-box .bottom-white{ width:10000px; height:150px; position:absolute; left:0; bottom:0; background:#fff;}
.clients .client-says{ width:100%; float:left;}
.clients .client-says .testimonials-title{ float:left; margin-top:0; margin-bottom:50px; font-size:32px; font-weight:700;}
.clients .client-says .testimonials-title span{ width:100%; height:21px; float:left; background:#00e3ff; margin-top:-21px;}
.clients .client-says p{ width:100%; float:left; font-size:23px; line-height:30px; font-weight:700; font-style:italic; padding-left:110px; position:relative; color:#59586b;}
.clients .client-says p:before{content:''; width:85px; height:3px; background:#dad9e0; position:absolute; left:0; top:10px;}
.clients .client-says figure{ float:right; margin-bottom:30px; margin-right:30px; position:relative;}
.clients .client-says figure:before{content:''; width:109px; height:184px; background:url(../images/pattern6.png) no-repeat; position:absolute; right:-26px; bottom:-24px; z-index:1;}
.clients .client-says figure img{ float:right; position:relative; z-index:2;}
.clients .client-says figure figcaption{ float:left; text-align:right; padding-top:50px; padding-right:20px;}
.clients .client-says figure figcaption .name{ display:block; font-size:24px; font-weight:700;}
.clients .client-says figure figcaption  .job-title{ font-size:18px; font-weight:600; color:#00e3ff;}
.clients .slick-prev{ width:18px; height:28px; background:url(../images/left-arrow.png) no-repeat; position:absolute; right:30%; bottom:30px; margin-left:-50px; text-indent:-99999px; z-index:3;}
.clients .slick-prev:hover{ background:url(../images/left-arrow-hover.png) no-repeat;}
.clients .slick-next{ width:18px; height:28px; background:url(../images/right-arrow.png) no-repeat; position:absolute; right:0; bottom:30px; margin-right:-40px; text-indent:-9999px;}
.clients .slick-next:hover{background:url(../images/right-arrow-hover.png) no-repeat;}




/* PORTFOLIO */
.portfolio{ width:100%; float:left;}
.portfolio *{-webkit-transition: .25s ease-in-out;-moz-transition: .25s ease-in-out;-ms-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out;}
.portfolio .portfolio-list{ width:100%; float:left;}
.portfolio .portfolio-list li{ width:50%; float:left; padding-right:5%; padding-left:30px;}
.portfolio .work{ width:100%; float:left; position:relative; margin-bottom:90px;}
.portfolio .work img{ margin-bottom:21px;}
.portfolio .work .tags{ width:400px; float:left; font-size:12px; font-weight:700; text-align:right; color:#787787; text-transform:uppercase; position:absolute; left:-25px; top:400px; z-index:2; -moz-transform: rotate(-90deg);-ms-transform: rotate(-90deg);-webkit-transform: rotate(-90deg);transform: rotate(-90deg);-moz-transform-origin: 0 0;-ms-transform-origin: 0 0;-webkit-transform-origin: 0 0;transform-origin: 0 0;}
.portfolio .work figcaption{ font-size:28px; font-weight:700; margin-bottom:5px; padding-left:54px; position:relative;}
.portfolio .work figcaption:after{content:''; width:3px; height:60px; background:#dcdbe1; position:absolute; left:34px; top:-20px;}
.portfolio .work:hover img{box-shadow:15px 15px 35px rgba(0,0,0,0.15);}
.portfolio .work:hover figcaption:after{ background:#440ce9;}




/* PROJECT DETAIL */
.project-detail{ width:100%; float:left;}
.project-detail .project-tags{ width:100%; float:left; font-size:12px; color:#787787; font-weight:600;}
.project-detail .project-name{ font-size:52px; font-weight:700; margin-bottom:25px;}
.project-detail .info-text{ font-size:17px; font-weight:600; color:#787787; line-height:27px; margin-bottom:30px;}
.project-detail .project-image{ width:100%; float:left; position:relative; margin-bottom:50px;}
.project-detail .project-image:after{content:''; width:341px; height:375px; background:url(../images/pattern12.png) no-repeat; position:absolute; right:-40px; top:-100px; z-index:-1;}
.project-detail .project-title{ font-size:52px; font-weight:700; margin-bottom:25px;}
.project-detail .project-infos{ width:100%; float:left;}
.project-detail .project-infos li{ width:100%; float:left; margin-bottom:20px; font-size:17px; font-weight:700;}
.project-detail .project-infos li span{ width:100%; float:left; color:#787787; font-style:italic;}
.project-detail .gray-bg{ width:100%; height:500px; background:#f1f2f4; position:absolute; left:0; top:0;} 


.project-detail .project-share{ width:100%; float:left; margin-bottom:50px;}
.project-detail .project-share .title{ width:100%; float:left; font-size:18px; font-weight:700; color:#787787; margin-bottom:10px;}
.project-detail .project-share a{ float:left; font-size:17px; font-weight:600; margin-right:25px;}
.project-detail .project-share a span{ width:100%; height:8px; float:left; background:#00e5ff; margin-top:-10px;}
.project-detail .project-share a:hover{ color:#06032f;}
.project-detail .project-share a:hover span{ height:3px; margin-top:-3px;}

.project-detail .project-navigation{ width:100%; float:left; margin-bottom:100px; padding:76px 0; background:#f1f2f4; position:relative;}
.project-detail .project-navigation:before{content:''; width:calc((100vw - 100px) / 2 - 0px); height:100%; background:#f1f2f4; position:absolute; left:calc(-1 * (100vw - 100px) / 2); right:0; top:0;}
.project-detail .project-navigation:after{content:''; width:341px; height:285px; position:absolute; right:100px; top:-40px; z-index:-1; background:url(../images/pattern9.png) no-repeat;}
.project-detail .project-navigation .left-arrow{ width:31px; height:48px; float:left; margin-top:5px; margin-right:20px; background:url(../images/left-arrow-big.png) no-repeat; text-indent:-9999px;}
.project-detail .project-navigation .left-arrow:hover{ background:url(../images/left-arrow-big-hover.png) no-repeat;}
.project-detail .project-navigation .right-arrow{ width:31px; height:48px; float:right; margin-top:5px; margin-left:20px; background:url(../images/right-arrow-big.png) no-repeat; text-indent:9999px;}
.project-detail .project-navigation .right-arrow:hover{ background:url(../images/right-arrow-big-hover.png) no-repeat;}
.project-detail .project-navigation .back{ display:inline-block; font-size:16px; font-weight:700; margin-top:20px;}
.project-detail .project-navigation .back span{ width:100%; height:6px; background:#00e3ff; float:left; margin-top:-10px;}
.project-detail .project-navigation .back:hover{ color:#06032f;}
.project-detail .project-navigation .back:hover span{ background:transparent;}
.project-detail .project-navigation .post-title{ display:inline-block; font-size:26px; font-weight:700;}
.project-detail .project-navigation .post-title span{ width:100%; display:block; font-size:15px; font-weight:600; color:#787787;}

.project-detail .related-projects{ width:100%; float:left;}
.project-detail .related-projects .title{ width:100%; float:left; font-size:30px; font-weight:700; color:#787787; margin-bottom:20px;}
.project-detail .related-projects .work{ width:100%; float:left; position:relative; margin-bottom:90px;}
.project-detail .related-projects .work img{ margin-bottom:21px;}
.project-detail .related-projects .work .tags{ width:400px; float:left; font-size:12px; font-weight:700; text-align:right; color:#787787; text-transform:uppercase; position:absolute; left:-25px; top:400px; z-index:2; -moz-transform: rotate(-90deg);-ms-transform: rotate(-90deg);-webkit-transform: rotate(-90deg);transform: rotate(-90deg);-moz-transform-origin: 0 0;-ms-transform-origin: 0 0;-webkit-transform-origin: 0 0;transform-origin: 0 0;}
.project-detail .related-projects .work figcaption{ font-size:28px; font-weight:700; margin-bottom:5px; padding-left:54px; position:relative;}
.project-detail .related-projects .work figcaption:after{content:''; width:3px; height:60px; background:#dcdbe1; position:absolute; left:34px; top:-20px;}
.project-detail .related-projects .work:hover img{box-shadow:15px 15px 35px rgba(0,0,0,0.15);}
.project-detail .related-projects .work:hover figcaption:after{ background:#440ce9;}


/* OUR BLOG */
.our-blog{ width:100%; float:left; padding-top:100px; background:url(../images/pattern7.png) left center no-repeat; position:relative;}
.our-blog .intro{ width:100%; float:left; margin-bottom:100px; padding-left:120px; position:relative;}
.our-blog .intro .title{ font-size:45px; margin-top:0; font-weight:700; margin-left:-38px; position:relative;}
.our-blog .intro .title:after{content:''; width:3px; height:85px; background:#dad9e0; position:absolute; left:17px; top:23px; z-index:-1;}
.our-blog .intro p{ font-size:17px; line-height:27px; color:#787787; font-weight:600; margin-bottom:30px;}
.our-blog .intro a{ float:left; font-size:16px; font-weight:700; color:#06032f; position:relative;}
.our-blog .intro a span{ width:100%; height:6px; float:left; background:#fff; margin-top:-11px;}
.our-blog .intro a:hover span{background:#00e3ff;}
.our-blog .blog-post{ width:100%; float:left; margin-bottom:100px;}
.our-blog .blog-post *{-webkit-transition: .25s ease-in-out;-moz-transition: .25s ease-in-out;-ms-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out;}
.our-blog .blog-post.small{ max-width:317px;}
.our-blog .blog-post figure{ float:left; position:relative;}
.our-blog .blog-post figure .date{ width:300px; float:left; font-size:12px; font-weight:700; color:#787787; text-transform:uppercase; text-align:right; position:absolute; left:-25px; top:300px; z-index:2; -moz-transform: rotate(-90deg);-ms-transform: rotate(-90deg);-webkit-transform: rotate(-90deg);transform: rotate(-90deg);-moz-transform-origin: 0 0;-ms-transform-origin: 0 0;-webkit-transform-origin: 0 0;transform-origin: 0 0;}
.our-blog .blog-post figure img{ display:block; margin-bottom:24px;}
.our-blog .blog-post figure figcaption{ float:left; text-align:left; padding-left:58px; position:relative;}
.our-blog .blog-post figure figcaption:before{content:''; width:3px; height:93px; background:#a81916; position:absolute; left:34px; top:0;}
.our-blog .blog-post figure figcaption .post-title{ margin-top:36px; font-size:20px; font-weight:700;}
.our-blog .blog-post figure figcaption p{ font-size:17px; font-weight:600; color:#787787;}
.our-blog .gray-bg{ width:100%; height:420px; background:url(../images/pattern8.png) left no-repeat #f1f2f4;  background-position-x:10%; position:absolute; left:0; bottom:170px; z-index:-1;}





/* BLOG */
.blog{ width:100%; float:left;}
.blog  a *{-webkit-transition: .25s ease-in-out;-moz-transition: .25s ease-in-out;-ms-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out;}
.blog .blog-post{ width:100%; float:left; margin-bottom:100px;}
.blog .blog-post figure{ float:left; position:relative;}
.blog .blog-post figure .date{ width:300px; float:left; text-align:right; font-size:12px; font-weight:700; color:#787787; text-transform:uppercase; position:absolute; left:-25px; top:300px; z-index:2; -moz-transform: rotate(-90deg);-ms-transform: rotate(-90deg);-webkit-transform: rotate(-90deg);transform: rotate(-90deg);-moz-transform-origin: 0 0;-ms-transform-origin: 0 0;-webkit-transform-origin: 0 0;transform-origin: 0 0;}
.blog .blog-post figure img{ display:block; margin-bottom:24px;}
.blog .blog-post figure figcaption{ float:left; text-align:left; padding-left:58px; position:relative;}
.blog .blog-post figure figcaption:before{content:''; width:3px; height:93px; background:#a81916; position:absolute; left:34px; top:0;}
.blog .blog-post figure figcaption .post-title{ margin-top:36px; font-size:20px; font-weight:700;}
.blog .blog-post figure figcaption p{ font-size:17px; font-weight:600; color:#787787;}
.blog .blog-post figure figcaption a{ float:right; font-size:16px; font-weight:700; color:#06032f; position:relative; opacity:0;}
.blog .blog-post figure figcaption a span{ width:100%; height:6px; float:left; background:#74ffff; margin-top:-11px;}
.blog .blog-post figure:hover a{ opacity:1;}
.blog .blog-post figure:hover figcaption:before{background:#74ffff;}
.blog .blog-post figure:hover img{ box-shadow:15px 15px 35px rgba(0,0,0,0.15);}
.blog .blog-single-post{ width:100%; float:left;}
.blog .blog-single-post .post-image{ width:100%; float:left;}
.blog .blog-single-post .post-image img{ width:100%;}
.blog .blog-single-post .post-header{ width:100%; float:left; text-align:center; margin:50px 0;}
.blog .blog-single-post .post-header .post-date{ font-size:16px; font-weight:700;}
.blog .blog-single-post .post-header .post-title{ font-size:54px; font-weight:700;}
.blog .blog-single-post .post-header .author-comment{ font-size:17px; color:#95949c; font-style:italic;}
.blog .blog-single-post .post-header .author-comment a{ color:#5103ec;}
.blog .blog-single-post .post-content{ width:100%; float:left;}
.blog .blog-single-post .post-content p{ font-size:17px; line-height:27px; color:#787787; font-weight:600; margin-bottom:30px;}
.blog .blog-single-post .post-content .sub-title{ font-size:30px; font-weight:700; margin-bottom:30px;}
.blog .blog-single-post .post-content .colored{ color:#4e07eb;}
.blog .blog-single-post .post-content blockquote{ width:100%; float:left; margin-bottom:50px; padding:60px 30px; background:url(../images/pattern10.png) right no-repeat #f1f2f4; position:relative; border:none;}
.blog .blog-single-post .post-content blockquote:before{content:''; width:85px; height:3px; background:#5103ec; position:absolute; left:-74px; top:70px;}
.blog .blog-single-post .post-content blockquote:after{content:''; left: -webkit-calc(100% - 0px); left: calc(100% - 0px);width: -webkit-calc((100vw - 1280px) / 2 + 104px); width: calc((100vw - 1280px) / 2 + 104px);  height:100%; background:#f1f2f4; position:absolute; right:0; top:0; z-index:-1;}
.blog .blog-single-post .post-content blockquote p{ max-width:570px; font-size:24px; margin:0; color:#06032f; font-size:italic}
.blog .blog-single-post .post-content blockquote p .author{ float:right; margin-top:20px; color:#787787; font-style:inherit; font-size:19px;}
.blog .blog-single-post .post-content .custom-list{ width:100%; float:left; padding-left:30px; margin-bottom:50px;}
.blog .blog-single-post .post-content .custom-list li{ width:100%; float:left; margin:6px 0; font-size:17px; color:#787787; font-weight:600; position:relative; padding-left:32px;}
.blog .blog-single-post .post-content .custom-list li:before{content:''; width:12px; height:3px; background:#dad9de; position:absolute; left:0; top:9px;}
.blog .blog-single-post .post-footer{ width:100%; float:left; margin:50px 0; border-top:3px solid #ebeaef; padding-top:50px;}
.blog .blog-single-post .post-footer .tags{ width:100%; float:left; margin-bottom:20px;}
.blog .blog-single-post .post-footer .tags .title{ float:left; font-size:18px; font-weight:700; color:#787787; margin:3px 0; margin-right:10px;}
.blog .blog-single-post .post-footer .tags a{ float:left; font-size:17px; font-weight:600; margin-right:10px;}
.blog .blog-single-post .post-footer .tags a:hover{color:#787787;}
.blog .blog-single-post .post-footer .share{ width:100%; float:left;}
.blog .blog-single-post .post-footer .share .title{ float:left; font-size:18px; font-weight:700; color:#787787; margin:3px 0; margin-right:10px;}
.blog .blog-single-post .post-footer .share a{ float:left; font-size:17px; font-weight:600; margin-right:25px;}
.blog .blog-single-post .post-footer .share a span{ width:100%; height:8px; float:left; background:#00e5ff; margin-top:-10px;}
.blog .blog-single-post .post-footer .share a:hover{ color:#06032f;}
.blog .blog-single-post .post-footer .share a:hover span{ height:3px; margin-top:-3px;}
.blog .blog-single-post .post-navigation{ width:100%; float:left; margin-bottom:100px; padding:76px 0; background:#f1f2f4; position:relative;}
.blog .blog-single-post .post-navigation:before{content:''; width:calc((100vw - 100px) / 2 - 0px); height:100%; background:#f1f2f4; position:absolute; left:calc(-1 * (100vw - 100px) / 2); right:0; top:0;}
.blog .blog-single-post .post-navigation:after{content:''; width:341px; height:285px; position:absolute; right:100px; top:-40px; z-index:-1; background:url(../images/pattern9.png) no-repeat;}
.blog .blog-single-post .post-navigation .left-arrow{ width:31px; height:48px; float:left; margin-top:5px; margin-right:20px; background:url(../images/left-arrow-big.png) no-repeat; text-indent:-9999px;}
.blog .blog-single-post .post-navigation .left-arrow:hover{ background:url(../images/left-arrow-big-hover.png) no-repeat;}
.blog .blog-single-post .post-navigation .right-arrow{ width:31px; height:48px; float:right; margin-top:5px; margin-left:20px; background:url(../images/right-arrow-big.png) no-repeat; text-indent:9999px;}
.blog .blog-single-post .post-navigation .right-arrow:hover{ background:url(../images/right-arrow-big-hover.png) no-repeat;}
.blog .blog-single-post .post-navigation .back{ display:inline-block; font-size:16px; font-weight:700; margin-top:20px;}
.blog .blog-single-post .post-navigation .back span{ width:100%; height:6px; background:#00e3ff; float:left; margin-top:-10px;}
.blog .blog-single-post .post-navigation .back:hover{ color:#06032f;}
.blog .blog-single-post .post-navigation .back:hover span{ background:transparent;}
.blog .blog-single-post .post-navigation .post-title{ display:inline-block; font-size:26px; font-weight:700;}
.blog .blog-single-post .post-navigation .post-title span{ width:100%; display:block; font-size:15px; font-weight:600; color:#787787;}
.blog .all-comments{ width:100%; float:left;}
.blog .all-comments .pattern{ width:100%; float:left; position:relative;}
.blog .all-comments .pattern:after{content:''; width:267px; height:223px; position:absolute; right:-50px; bottom:0; z-index:2; background:url(../images/pattern11.png) no-repeat;}
.blog .all-comments .comment-box{ width:96%; float:left; margin-bottom:30px; padding:37px 0; padding-right:190px; background:#f1f2f4; position:relative; z-index:8;}
.blog .all-comments .comment-box.reply{ background:#fff; width:85%; margin-left:15%;}
.blog .all-comments .comment-box figure{ float:left; margin-left:-40px; margin-right:45px; margin-bottom:45px;}
.blog .all-comments .comment-box .comment-date{ display:block; font-size:18px; font-weight:700; color:#787787;}
.blog .all-comments .comment-box .comment-user{ font-size:30px; font-weight:700;}
.blog .all-comments .comment-box .comment-text{font-size:17px; font-weight:600; color:#787787;}
.blog .all-comments .comment-box a{ float:left; font-size:16px; font-weight:700; color:#06032f; position:relative;}
.blog .all-comments .comment-box a span{ width:100%; height:6px; float:left; background:transparent; margin-top:-11px;}
.blog .all-comments .comment-box a:hover span{background:#00e3ff;}
.blog .section-title{ font-size:35px; font-weight:700; margin-bottom:30px;}
.blog .reply-box{ width:100%; float:left; background:#4e07eb; padding:0 30px; padding-top:100px; margin-bottom:260px;}
.blog .reply-box h3{color:#fff; font-size:36px; font-weight:700; margin-top:0; margin-bottom:60px;}
.blog .reply-box form{ width:100%; float:left; margin-bottom:-190px;}
.blog .reply-box input[type="text"]{ width:49%; height:64px; float:left; padding:0 15px; background:#3e05c3; border:3px solid #300495; font-size:21px; font-weight:600; color:#fff;} 
.blog .reply-box input[type="text"]:focus{ border:3px solid #11d8ff;}
.blog .reply-box input[type="text"]::-webkit-input-placeholder {   color: #fff;}
.blog .reply-box input[type="text"]:-moz-placeholder { /* Firefox 18- */   color: #fff;  }
.blog .reply-box input[type="text"]::-moz-placeholder {  /* Firefox 19+ */   color: #fff;  }
.blog .reply-box input[type="text"]:-ms-input-placeholder {     color: #fff;  }
.blog .reply-box textarea{ width:100%; height:164px; float:left; padding:15px; background:#3e05c3; border:3px solid #300495; font-size:21px; font-weight:600; color:#fff;} 
.blog .reply-box textarea:focus{ border:3px solid #11d8ff;}
.blog .reply-box textarea::-webkit-input-placeholder {   color: #fff;}
.blog .reply-box textarea:-moz-placeholder { /* Firefox 18- */   color: #fff;  }
.blog .reply-box textarea::-moz-placeholder {  /* Firefox 19+ */   color: #fff;  }
.blog .reply-box textarea:-ms-input-placeholder {     color: #fff;  }
.blog .reply-box button{ float:right; background:#fb37bf; color:#fff; line-height:60px; font-size:25px; padding:0 30px; border-radius:60px; border:none; position:relative;}
.blog .reply-box button span{ width:100%; height:60px; border:3px solid #fb37bf; position:absolute; left:0; top:0; border-radius:60px;}
.blog .reply-box button span{-webkit-transition: .25s ease-in-out;-moz-transition: .25s ease-in-out;-ms-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out;}
.blog .reply-box button:hover span{border:3px solid #transparent; left:6px; top:8px;}
.blog .reply-box .form-group{ width:100%; float:left;}




/* LETS TALK */
.lets-talk{ width:100%; float:left; z-index:2; margin-top:50px;}
.lets-talk .contact-form{ width:100%; max-height:976px; margin:0 auto; padding:0; position:relative;}
.lets-talk .contact-form .inner{ width:100%; float:left; text-align:center; background:#a81916; margin-bottom:-100px; padding:100px 15%;}
.lets-talk .contact-form .shape{content:''; width:350px; height:225px; border:14px solid #00e3ff; position:absolute; right:-30px; bottom:-130px; z-index:-1;}
.lets-talk .contact-form .title{ font-size:45px; margin-top:0; font-weight:700; color:#fff;}
.lets-talk .contact-form p{ font-size:17px; font-weight:600; color:#fff; opacity:0.7;}
.lets-talk .contact-form form{ width:100%; float:left; margin-top:30px;}
.lets-talk .contact-form .form-group{ width:100%; float:left; margin-bottom:40px;}
.lets-talk .contact-form input[type="text"]{ width:100%; height:64px; float:left; background:#3e06c2; border:3px solid #300596; padding:0 20px; font-size:21px; font-weight:600; color:#fff;}
.lets-talk .contact-form input[type="text"]:focus{ border:3px solid #00e3ff;}
.lets-talk .contact-form input[type="text"]::-webkit-input-placeholder {   color: #fff;}
.lets-talk .contact-form input[type="text"]:-moz-placeholder { /* Firefox 18- */   color: #fff;  }
.lets-talk .contact-form input[type="text"]::-moz-placeholder {  /* Firefox 19+ */   color: #fff;  }
.lets-talk .contact-form input[type="text"]:-ms-input-placeholder {     color: #fff;  }
.lets-talk .contact-form textarea{ width:100%; height:164px; float:left; background:#3e06c2; border:3px solid #300596; padding:20px; font-size:21px; font-weight:600; color:#fff;}
.lets-talk .contact-form textarea:focus{ border:3px solid #00e3ff;}
.lets-talk .contact-form textarea::-webkit-input-placeholder {   color: #fff;}
.lets-talk .contact-form textarea:-moz-placeholder { /* Firefox 18- */   color: #fff;  }
.lets-talk .contact-form textarea::-moz-placeholder {  /* Firefox 19+ */   color: #fff;  }
.lets-talk .contact-form textarea:-ms-input-placeholder {     color: #fff;  }
.lets-talk .contact-form button{display:inline-block; background:#fb37bf; color:#fff; line-height:60px; font-size:25px; padding:0 30px; border-radius:60px; border:none; position:relative;}
.lets-talk .contact-form button span{ width:100%; height:60px; border:3px solid #fb37bf; position:absolute; left:0; top:0; border-radius:60px;}
.lets-talk .contact-form button span{-webkit-transition: .25s ease-in-out;-moz-transition: .25s ease-in-out;-ms-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out;}
.lets-talk .contact-form button:hover span{border:3px solid #transparent; left:6px; top:8px;}



/* CONTACT US */
.contact-us{ width:100%; float:left; z-index:2;}
.contact-us #map{ width:100%; height:600px; float:left; background:#4e07eb;}
.contact-us address{ width:100%; float:left;}
.contact-us address .title{ font-size:20px; font-weight:700; color:#c0bec9;}
.contact-us address  span{ width:100%; float:left; padding-left:46px; font-size:17px; font-weight:600; position:relative;}
.contact-us address  span:before{content:''; width:26px; height:3px; background:#dcdbe1; position:absolute; left:0; top:10px;}
.contact-us address  span a{ text-decoration:underline;}
.contact-us address  span a:hover{ text-decoration:none; color:#f93ac8;}
.contact-us .social-media{ width:100%; float:left; margin-top:60px;}
.contact-us .social-media li{ float:left; margin-right:40px;}
.contact-us .social-media li a{ float:left; font-size:30px; }
.contact-us .social-media li a:hover{color:#4600df;}
.contact-form{ width:100%; float:left; margin-top:-64px; padding-top:216px;}
.contact-form .purple-bg{ width:100%; height:450px; position:absolute; left:0; top:0; background:#4e07eb;}
.contact-form .purple-bg:after{content:''; width:30%; height:100%; position:absolute; right:0; top:0; background:#fff;}
.contact-form .intro{ width:100%; float:left;}
.contact-form .intro .title{ font-size:40px; font-weight:700; color:#fff; margin-top:0; margin-bottom:32px;}
.contact-form .intro p{ max-width:350px; font-size:17px; font-weight:600; color:#fff; opacity:0.7;}
.contact-form .alert{ width:100%;}
.contact-form #success, #error {display:none}
.contact-form #success p, #error p { float:left;}
.contact-form #contact .error{ width:100%; color:red;}
.contact-form #error p {color:#c0392b}	
.contact-form #contact{ width:100%; float:left;}
.contact-form #contact .form-group{ width:100%; float:left; margin-bottom:40px;}
.contact-form #contact input[type="text"]{ width:100%; height:64px; float:left; font-size:21px; font-weight:600; background:#f1f2ed; border:2px solid #e0dae4; padding:0 15px;}
.contact-form #contact input[type="text"]:focus{border:2px solid #02e1ff;}
.contact-form #contact textarea{ width:100%; height:168px; float:left; font-size:21px; font-weight:600; background:#f1f2ed; border:2px solid #e0dae4; padding:15px;}
.contact-form #contact textarea:focus{border:2px solid #02e1ff;}
.contact-form #contact button{ float:right; background:#fb37bf; color:#fff; line-height:60px; font-size:25px; padding:0 30px; border-radius:60px; border:none; position:relative; font-weight:600;}
.contact-form #contact button span{ width:100%; height:60px; border:3px solid #fb37bf; position:absolute; left:0; top:0; border-radius:60px;}
.contact-form #contact button span{-webkit-transition: .25s ease-in-out;-moz-transition: .25s ease-in-out;-ms-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out;}
.contact-form #contact button:hover span{border:3px solid #transparent; left:6px; top:8px;}




/* FOOTER */
footer{ width:100%; float:left; margin-bottom:104px; padding-top:200px; padding-bottom:50px; background:url(../images/pattern-footer.png) right center no-repeat #f1f2f4; background-position-x:96%;}
footer .logo{ margin-bottom:26px;}
footer .social-media{ width:100%; float:left; margin-bottom:50px;}
footer .social-media li{ float:left; margin-right:20px;}
footer .social-media li a{ font-size:20px; color:#c1c0cb;}
footer .social-media li a:hover{ color:#a81916;}
footer .copyright{ display:block; color:#c1c0cb; font-size:16px; font-style:italic;}
footer .contact-box{ width:100%; float:left; padding-left:45px; margin-bottom:50px; font-size:18px; font-weight:700;}
footer .contact-box .title{ margin-left:-45px; margin-top:0; margin-bottom:5px; font-size:20px; font-weight:700; color:#c1c0cb; position:relative;}
footer .contact-box .title:after{content:''; width:26px; height:3px; background:#c1c0cb; position:absolute; left:0; bottom:-22px;}
footer .contact-box a{ float:left;}
footer .contact-box a:hover{ color:#a81916;}




.menu-btn {
	position: absolute;
	top: -14px;
	right:0;
	width: 49px;
	height: 49px;
	cursor: pointer;
}
.menu-btn .menu-circle-wrap {
	position: absolute;
	width: 49px;
	height: 49px;
	left: 0;
	top: 0;
	transition: all 0.3s;
}
.menu-btn .menu-circle {
	position: absolute;
	width: 49px;
	height: 49px;
	left: 0;
	top: 0;
	transition: all 0.6s;
}
.menu-btn .menu-circle path {
	fill: none;
	stroke-width: 2px;
	stroke: #dad9e0;
	stroke-dashoffset: 157;
	stroke-dasharray: 157;
	transition: all 0.6s;
}
.menu-btn.active .menu-circle {
	-ms-transform: rotate(-135deg);
	transform: rotate(-135deg);
}
.menu-btn.active .menu-circle path {
	stroke-dashoffset: 0;
}
.menu-btn.active:hover .menu-circle-wrap {
	-ms-transform: scale(0.95);
	transform: scale(0.95);
}
.menu-btn .menu-circle-wrap .wave {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0px;
	top: 0px;
	border-radius: 50%;
	-ms-transform: scale(1);
	transform: scale(1);
	box-shadow: 0px 0px 0px 0px #5f6a72;
	opacity: 0;
}

.menu-btn .bars {
	position: absolute;
	width: 30px;
	height: 24px;
	left: 0;
	top: 0px;
	right: 0;
	bottom: 0;
	margin: auto;
}
.menu-btn .bar {
	position: absolute;
	width: 100%;
	height: 2px;
	background: #30373c;
	transition: background 0.2s;
}
.menu-btn .b1 {
	top: 2px;
}
.menu-btn .b2 {
	top: 11px;
}
.menu-btn .b3 {
	top: 20px;
}
.menu-btn .b1, header .menu-btn .b3 {
	transition: all 0.2s;
}
.menu-btn.active .b1.rotated {
	-ms-transform: translateY(9px) rotate(-135deg);
	transform: translateY(9px) rotate(-135deg);
}
.menu-btn.active .b2 {
	opacity: 0;
}
.menu-btn.active .b3.rotated {
	-ms-transform: translateY(-9px) rotate(-225deg);
	transform: translateY(-9px) rotate(-225deg);
}


/* RESPONSIVE FIXES */



@media only screen and (max-width:1199px), only screen and (max-device-width: 1199px) {


header{ padding:0 70px;}
main{ padding:0 70px;}
footer{ margin-bottom:70px;}
.main-hero{ padding:0 70px;}
.side-title{ right:-276px;}
.int-header{ padding:0 70px;}

}

@media only screen and (max-width:991px), only screen and (max-device-width: 991px) {
.navbar-default{ margin-top:26px;}
.navbar-default .navbar-right{ margin-right:0;}
.navbar-default .navbar-nav>li{ padding:0 13px;}
.navbar-header{ width:100%; float:left;}
.home-services .service-box figure figcaption{ padding-left:25px;}
.home-services .service-box figure figcaption .title{ font-size:40px;}
.recent-work .work1{ margin-top:30px; float:left;}
.our-short-story figure{ margin-bottom:30px;}
.fun-facts span{ font-size:50px;}
.fun-facts h5{ padding-left:0;}
.fun-facts h5:before{ top:30px;}
.contact-us #map{ margin-bottom:60px;}
.contact-form{ margin-top:30px;}
.contact-form .purple-bg{ height:100%;}
.contact-form .purple-bg:after{ display:none;}
}

@media only screen and (max-width:767px), only screen and (max-device-width: 767px) {
.side-title{ display:none;}
.main-hero{ padding:0 20px;}
.main-hero .hero{ padding-top:75px; padding-bottom:20px;}
.main-hero .hero .video video{ width:auto;}
.navbar-default .navbar-brand{ display:block; float:none; margin-bottom:10px;}
main{ padding:0 20px;}
header{ position: static; padding:0 20px;}
header .inner{ height:auto;}
.navbar-header{ margin:0 !important;}
.navbar-default .navbar-toggle{ float:right; padding:0; margin:4px 0;}
.navbar-default .navbar-nav>li>a{ padding:10px 0;}
.navbar-default .navbar-nav>li>a span{ display:none;}
.navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover{ background:none;}
.our-blog .intro{ padding-left:20px;}
.home-services .intro{ padding-left:20px;}
footer{ margin-bottom:20px;}

.navbar-default .navbar-header address,
.navbar-default .navbar-header p {
	float: none;
	display: block;
	margin: 10px 0 0 0;
}
}