/*STYLE.CSS*/ /*-------------------------------------------------------------------------------------------------------------------------------*/ /*This is main CSS file that contains custom style rules used in this template*/ /*-------------------------------------------------------------------------------------------------------------------------------*/ /* Template Name: E+P-CCD*/ /* Version: 1.0 Initial Release*/ /* Build Date: 10-12-2015*/ /* Author: CC-DESIGN*/ /* Website: http://www.cc-design.com/ /* Copyright: (C) 2015 */ /*-------------------------------------------------------------------------------------------------------------------------------*/ /*--------------------------------------------------------*/ /* TABLE OF CONTENTS: */ /*--------------------------------------------------------*/ /* 00 - LAYOUT INITIALIZATION & COLOR PRESETS */ /*-------------------------------------------------------------------------------------------------------------------------------*/ /* 01 - ONEPAGE and MULTIPAGE */ /*-------------------------------------------------------------------------------------------------------------------------------*/ /* 01-01 - HEADER */ /* 01-02 - HOME */ /* 01-03 - FEATURED */ /* 01-04 - ABOUT */ /* 01-05 - NEWS */ /* 01-06 - CONTACT */ /* 01-07 - PORTFOLIO */ /* 01-08 - PRICE */ /*-------------------------------------------------------------------------------------------------------------------------------*/ /* 02 - VERS.1 - TOP MENU */ /*-------------------------------------------------------------------------------------------------------------------------------*/ /* 02-01 - HEADER */ /* 02-02 - HOME */ /* 02-03 - FEATURED */ /* 02-04 - ABOUT */ /* 02-05 - NEWS */ /* 02-06 - CONTACT */ /* 02-07 - PORTFOLIO */ /*-------------------------------------------------------------------------------------------------------------------------------*/ /* 03 - VERS.2 - RIGHT MENU */ /*-------------------------------------------------------------------------------------------------------------------------------*/ /* 03-01 - HEADER RIGHT */ /* 03-02 - WORKS */ /* 03-03 - ABOUT */ /* 03-04 - CONTACT */ /*-------------------------------------------------------------------------------------------------------------------------------*/ /* 00 - LAYOUT INITIALIZATION & COLOR PRESETS */ /*-------------------------------------------------------------------------------------------------------------------------------*/ @import url(http://fonts.googleapis.com/css?family=Roboto:400,200,300,500,600,700,900,800); @import url(http://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,400,300,600,700); @import url(http://fonts.googleapis.com/css?family=Lobster+Two:400,700); .preload {position: fixed; left: 0; top: 0px; width: 100%; height: 100%; background: #FFFFFF; z-index: 1000;} .loader{position:fixed;margin:0 auto;left:0;right:0;top:50%;margin-top:-30px;width:60px;height:60px;list-style:none;} .loader li{background-color:#CC6600;width:10px;height:10px;float:left;margin-right:5px;box-shadow: 0px 0px 0px rgba(0,0,0,0.2);} @keyframes laadbalk { 0%{height: 10px;margin-top: 25px;} 50%{height:50px;margin-top: 0px;} 100%{height: 10px;margin-top: 25px;} } @-webkit-keyframes laadbalk { 0%{height: 10px;margin-top: 25px;} 50%{height:50px;margin-top: 0px;} 100%{height: 10px;margin-top: 25px;} } @-moz-keyframes laadbalk { 0%{height: 10px;margin-top: 25px;} 50%{height:50px;margin-top: 0px;} 100%{height: 10px;margin-top: 25px;} } @-ms-keyframes laadbalk { 0%{height: 10px;margin-top: 25px;} 50%{height:50px;margin-top: 0px;} 100%{height: 10px;margin-top: 25px;} } @-o-keyframes laadbalk { 0%{height: 10px;margin-top: 25px;} 50%{height:50px;margin-top: 0px;} 100%{height: 10px;margin-top: 25px;} } .loader li:nth-child(1){-webkit-animation: laadbalk 0.6s ease-in-out infinite;animation: laadbalk 0.6s ease-in-out infinite;-moz-animation: laadbalk 0.6s ease-in-out infinite; -ms-animation: laadbalk 0.6s ease-in-out infinite;-o-animation: laadbalk 0.6s ease-in-out infinite;} .loader li:nth-child(2){-webkit-animation: laadbalk 0.6s ease-in-out infinite -0.2s;animation: laadbalk 0.6s ease-in-out infinite -0.2s;-moz-animation: laadbalk 0.6s ease-in-out infinite -0.2s;-ms-animation: laadbalk 0.6s ease-in-out infinite -0.2s;-o-animation: laadbalk 0.6s ease-in-out infinite -0.2s;} .loader li:nth-child(3){-webkit-animation: laadbalk 0.6s ease-in-out infinite -0.4s;animation: laadbalk 0.6s ease-in-out infinite -0.4s;-moz-animation: laadbalk 0.6s ease-in-out infinite -0.4s;-ms-animation: laadbalk 0.6s ease-in-out infinite -0.4s;-o-animation: laadbalk 0.6s ease-in-out infinite -0.4s;} html {margin:0px; padding:0px; height:100%;} body {margin:0px; padding:0px; font-size:100%; height:100%; width:100%; font-family: dosis,sans-serif; font-size:18px; letter-spacing:1px; color:#262626; background-color: #F2F2F0; } a {transition: all 0.1s ease-in; -moz-transition: all 0.1s ease-in;-o-transition: all 0.1s ease-in;-webkit-transition: all 0.1s ease-in;-ms-transition: all 0.1s ease-in; text-decoration: none;} a {text-decoration:none; outline:none; cursor: pointer;} a:hover {text-decoration: underline;color:#CC6600;} a img{border: 0px none;} a:hover {outline: none;} a:active {outline: none; text-decoration: none;color:#CC6600;} a:focus {outline: none; outline-offset: 0px; text-decoration: none;color:#CC6600;} .clear{clear:both; overflow:hidden; height:0px; font-size:0px;} .clear_l{clear:both;} ul{padding:0px; margin:0px; list-style:none;} input:focus, select:focus, textarea:focus, button:focus{outline:none;} ::-webkit-input-placeholder {color:#fff;} ::-moz-placeholder {color:#fff;} :-moz-placeholder {color:#fff;} :-ms-input-placeholder {color:#fff;} h1, h2, h3, h4, h5, h6, p{margin:0px; padding:0px;} article, section, footer, header, figure, aside, hgroup, nav{display:block;} header,nav,article,footer,section,aside,figure,figcaption{display:block} button {outline: none; border: none; box-shadow: none;} h1 {font-size: 52px;letter-spacing: 2px;color: #FFF;line-height: 62px; font-weight: 500;} h2 {font-size: 24px;line-height: 30px;font-weight: 500;letter-spacing: 1px;color: #262626;} h3 {font-size: 22px;line-height: 27px;font-weight: 500;letter-spacing: 1px;text-transform: uppercase; color: #262626;} h4 {font-size: 18px;color: #262626;letter-spacing: 1px;line-height: 22px; font-weight: 500;} h5 {font-size: 16px;letter-spacing: 1px;color: #262626;font-weight: 500; line-height: 21px;} h6 {font-size: 12px;color: #FFFFFF;letter-spacing: 1px;line-height: 14px;font-weight: 500;} p {font-size: 14px;line-height: 20px;letter-spacing: 1px;font-weight: 400;} h2 a {color: #FFFFFF} h2 a:hover {color: #262626;text-decoration:none;} h2 a:visited {text-decoration:none} h2 a:active {text-decoration:none} p a {color: #CC6600} p a:hover {color: #CC6600;text-decoration:underline;} p a:visited {text-decoration:none} p a:active {text-decoration:none} i {font-family: 'Open Sans', sans-serif;font-weight: 300;font-style: italic; font-size: 13px; line-height: 21px;} ::-webkit-input-placeholder {color:#696969; opacity: 1;} ::-moz-placeholder {color:#696969; opacity: 1;} :-moz-placeholder {color:#696969; opacity: 1;} :-ms-input-placeholder {color:#696969; opacity: 1;} .vc_row.wpb_row.vc_inner.vc_row-fluid {margin-bottom: 0;} .swiper-container{margin:0 auto;position:relative;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-ms-backface-visibility:hidden;-o-backface-visibility:hidden;backface-visibility:hidden; overflow: hidden;}.swiper-wrapper{position:relative;width:100%; -webkit-transition-property:-webkit-transform,left,top;-webkit-transition-duration:0s;-webkit-transform:translate3d(0px,0,0);-webkit-transition-timing-function:ease;-moz-transition-property:-moz-transform,left,top;-moz-transition-duration:0s;-moz-transform:translate3d(0px,0,0);-moz-transition-timing-function:ease;-o-transition-property:-o-transform,left,top;-o-transition-duration:0s;-o-transform:translate3d(0px,0,0);-o-transition-timing-function:ease;-o-transform:translate(0px,0px);-ms-transition-property:-ms-transform,left,top;-ms-transition-duration:0s;-ms-transform:translate3d(0px,0,0);-ms-transition-timing-function:ease;transition-property:transform,left,top;transition-duration:0s;transform:translate3d(0px,0,0);transition-timing-function:ease;}.swiper-free-mode>.swiper-wrapper{-webkit-transition-timing-function:ease-out;-moz-transition-timing-function:ease-out;-ms-transition-timing-function:ease-out;-o-transition-timing-function:ease-out;transition-timing-function:ease-out;margin:0 auto;}.swiper-wp8-horizontal{-ms-touch-action:pan-y;}.swiper-wp8-vertical{-ms-touch-action:pan-x;} .swiper-container {height:100%;} .swiper-slide {position:relative; float:left; overflow:hidden;} .display-table {display: table; width: 100%;} .display-row {display: table-row;} .display-cell {position: relative; width: 100%;} .bg {position:absolute; left:0px; top:0px; width:100%; height:100%; overflow:hidden;background-size: cover;background-position: center center;} .bg img{position:absolute;} .bg video{position:absolute;} .bg-bg{background-position: 50% 0px; background-repeat: no-repeat; -webkit-background-size: cover;-moz-background-size: cover; -o-background-size: cover; background-size: cover;} .bg-bg-chrome{background-position: 50% 0px; background-repeat: no-repeat; background-attachment: scroll; -webkit-background-size: cover;-moz-background-size: cover; -o-background-size: cover; background-size: cover; position:fixed;} .clip{clip: rect(auto, auto, auto, auto); height: 100%; position: absolute; width: 100%;} .color-orange {color:#CC6600;} .bg-grey {background: #ECECEA;} .bg-white {background: #fff;} .bg-grey-l {background: #F8F8F8;} .full-width{position:relative; float:left; width:100%; height: 100%;} .wpb_column.vc_column_container.bg-fixed {background-attachment: fixed !important;position: static;} .error404 .element {background: #fff;padding: 50px;} /*-------------------------------------------------------------------------------------------------------------------------------*/ /*-------------------------------------------------------------------------------------------------------------------------------*/ /*-------------------------------------------------------------------------------------------------------------------------------*/ /* 01 - ONEPAGE and MULTIPAGE */ /*-------------------------------------------------------------------------------------------------------------------------------*/ /*-------------------------------------------------------------------------------------------------------------------------------*/ /*-------------------------------------------------------------------------------------------------------------------------------*/ /*-------------------------------------------------------------------------------------------------------------------------------*/ /* 01-01 - HEADER */ /*-------------------------------------------------------------------------------------------------------------------------------*/ .style3 header {width: 100%; height: 100px; position: fixed; z-index: 500; background: #fff; left: 0px; top: 0px;} .style3 .header {position: relative; float: left; width: 100%;} .style3 .logo {position: relative; float: left; padding-top: 30px; z-index: 5;} .style3 .logo a {font-size: 30px;color: #CC6600;text-align: center;letter-spacing: 4px;font-family: roboto, sans-serif;font-weight: 700;} .style3 .logo a:hover {color: #CC6600;} .style3 .navigation {position: absolute; width: 100%; height: 100px; background: #FFFFFF; left: -15px; top: 0px; text-align: center; display: block; padding-top: 45px; display: block; opacity: 1;} .style3 .navigation nav {position: relative; float: right; display: inline-block; padding-top: 0px;} .style3 .navigation nav a {float: left; position: relative; margin-left: 40px; font-size: 15px; color: #262626; text-align: left;letter-spacing: 2px;line-height: 15px;font-family: roboto, sans-serif;font-weight: 500; text-decoration: none;} .style3 .close-menu {display: none;position: relative; float: none; padding-bottom: 20px; font-size: 30px; cursor: pointer; transition: all 0.3s ease-in;-moz-transition: all 0.3s ease-in;-webkit-transition: all 0.3s ease-in;-o-transition: all 0.3s ease-in;-ms-transition: all 0.3s ease-in;} .style3 .navigation nav .close-menu:hover {color: #CC6600;} .style3 .navigation a:hover {color: #CC6600;} .mobile-menu {position: relative; float: right; margin-top: 40px; cursor: pointer; display: none;} .mobile-menu img {width: 25px; height: 20px;} @media screen and (max-width: 1200px) { .style3 nav a {margin-left: 30px;} } @media screen and (max-width: 992px) { .style3 .navigation nav a {margin-left: 0px;} .style3 nav {text-align: left;} .style3 nav .close-menu {display:inline-block;} .style3 .close-menu span {font-size: 30px; padding-top: 30px; color: #262626;} .style3 .navigation {display:none; width: 100%; position: fixed; background: #FFFF00; left: 50%; top: 0px; width: 50%; height: 100%; padding-left: 20px; z-index: 5000; transform: translateY(-120%); -moz-transform: translateY(-120%);-webkit-transform: translateY(-120%);-o-transform: translateY(-120%);-ms-transform: translateY(-120%);transition: all 0.3s ease-in;-moz-transition: all 0.3s ease-in;-webkit-transition: all 0.3s ease-in;-o-transition: all 0.3s ease-in;-ms-transition: all 0.3s ease-in;} .style3 .navigation.slide {transform: translateY(0%); -moz-transform: translateY(0%);-webkit-transform: translateY(0%);-o-transform: translateY(0%);-ms-transform: translateY(0%);} .style3 .mobile-menu {display: none;} .style3 .navigation a {float: left; width: 100%; margin: 10px 0px;} .style3 .navigation nav {padding-top: 25px; width: 100%;} } @media screen and (max-width: 768px) { .style3 .mobile-menu {padding-right: 15px;} } /*-------------------------------------------------------------------------------------------------------------------------------*/ /* 01-02 - HOME */ /*-------------------------------------------------------------------------------------------------------------------------------*/ .one {padding-top: 100px;} .one-page {padding-top: 100px; position: relative;} .home-page .scrollto {padding-top: 0px;} .scrollto {position: relative; float: left; width: 100%;} .main-baner {position: relative; float: left; width: 100%; height: 600px;} .main-baner img {width: 100%; height: auto;} .main-caption {position: absolute; top: 50%; left: 50%;-moz-transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); -o-transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); transform:translate(-50%,-50%); text-align: center;} .main-wpapper {position: relative; padding-bottom: 140px;} .main-caption span {font-size: 14px;font-weight: 700;letter-spacing: 6px;color: #FFF; text-align: center; text-transform: uppercase;} .style3 .wrap-min {height: 360px;} .about-story.text-left p {text-align: left;} .about-story.text-left h4 {text-align: left;} .style3 .wrap-max {height: 530px;} .creative {position: relative; float: left; width: 100%; background: #ECECEA;} .col-50 {position: relative; float: left; width: 50%; overflow: hidden;} .col-50 img {width: 100%; height: auto;} .portfolio-baner {position: relative; float: left; width: 100%; height: 420px;} .agency-block {position: relative; float: left; width: 100%; text-align: right; padding: 45px 60px 35px 45px;} .agency-block p {font-size: 13px;color: #9C9C9C;letter-spacing: 1px;line-height: 21px;font-family: roboto,sans-serif;font-weight: 400; padding-top: 30px;} .agency-block h6 {padding: 40px 0px 13px;} .agency-block span {color: #9C9C9C;letter-spacing: 2px;line-height: 24px;font-family: roboto,sans-serif;font-weight: 400;font-size: 12px;} .agency-block span i {color:#CC6600;} .wpb_wrapper:after {content: '';display: table;} footer {position: relative; float: left; width: 100%; background: #fff; text-align: center;} .button-top {position: relative; float: left; width: 100%;} .button-totop {text-align: center; position: absolute; right: 0px; top: -62px; z-index: 50; width: 40px; height: 42px; background: #9E9E9E; cursor: pointer;transition: all 0.3s ease-in; -moz-transition: all 0.3s ease-in;-o-transition: all 0.3s ease-in;-webkit-transition: all 0.3s ease-in;-ms-transition: all 0.3s ease-in;} .button-totop span {color:#fff; transform: rotate(90deg);-moz-transform: rotate(90deg);-o-transform: rotate(90deg);-ms-transform: rotate(90deg);-webkit-transform: rotate(90deg); display: block; position: relative; font-size: 24px; line-height: 29px; text-align: center; font-weight: 200;font-family: roboto,sans-serif;padding: 0px 6px 5px 14px;} .button-totop:hover span {font-weight: 400;} .footer-logo {position: relative; float: left; padding: 40px 0px 10px; width: 100%;} .footer-logo a {font-size: 28px;letter-spacing: 5px;line-height: 34px;color: #9C9C9C;font-family: roboto,sans-serif; font-weight: 700; text-transform: uppercase;} .footer-logo span {line-height: 12px;font-size: 10px;color: #9C9C9C;text-align: center;font-family: roboto,sans-serif;font-weight: 700;letter-spacing: 3px; text-transform: uppercase; position: relative; float: left; width: 100%;} .copyright {padding-top: 95px;} .copyright span {font-size: 11px;color: #9C9C9C;letter-spacing: 2px;line-height: 13px;font-family: roboto,sans-serif;font-weight: 400; text-transform: none; padding-bottom: 20px;} .copyright a {font-size: 10px;color: #CC6600;letter-spacing: 3px;line-height: 12px;font-family: roboto,sans-serif;font-weight: 400; margin-top: 0px;} .footer-share {position: relative; float: left; width: 100%; text-align: center; padding-top: 20px;} .footer-share .fa {color: #9C9C9C; font-size: 18px; line-height: 22px; position: relative; float: none; margin: 0px 5px; display: inline-block;} .footer-share a i:after {width: 0px; content: ''; height: 0px;} .footer-share .fa:hover {color:#CC6600;} body .content-wrap-in {position: static;} @media screen and (max-width: 1200px) { .clients img {margin: 0px 15px;} .muse-template p {padding: 0px 127px 90px;} } @media screen and (max-width: 992px) { .style3 .wrap-min {height: auto;} .style3 .wrap-max {height: auto;} .clients img {margin: 0px 40px;} .muse-template p {padding: 0px 65px 90px;} .col-50 {width: 100%; height: auto;} .agency-block {height: auto;} .style3 .top-row .display-cell:first-child {display: table-footer-group; width: 100%;} .style3 .top-row .display-cell:last-child {display: table-header-group; width: 100%;} } @media screen and (max-width: 768px) { .main-wpapper {padding-bottom: 100px;} .logo {padding-left: 35px;} } @media screen and (max-width: 560px) { .agency-block {padding: 80px 40px 60px 40px; text-align: center;} } @media screen and (max-width: 480px) { .muse-template p {padding: 0px 25px 90px;} } /*-------------------------------------------------------------------------------------------------------------------------------*/ /* 01-03 - FEATURED */ /*-------------------------------------------------------------------------------------------------------------------------------*/ .futured-half {position: relative; float: left; width: 50%;} .featured-baner {position: relative; float: left; width: 100%; height: 100%; overflow:hidden;} .bottom-desc {position: relative; float: left; width: 100%;} .number-slide {position: absolute; left: 30px; top: 30px; font-size: 12px; font-weight: 400; color:#262626;} .featured-img {position: relative; float: left; width: 100%;} .featured-text {position: relative; float: left; width: 100%; padding: 30px 50px 50px 90px;} .featured-text h4 {padding-bottom: 27px;} .featured-text h5 {font-size: 15px; padding-bottom: 15px;} .featured-text p {color: #9C9C9C;} .style3 .preview-hover {position: absolute; bottom: 20px; top: auto; left: 0px; width: 100%; text-align: center;} .style3 .preview-hover img {margin-left: 15px; cursor: pointer;} .hide-text {display: none;} .style3 .slide-next {position: absolute; top: 50%; margin-top: -22px; right: 0px; width: 35px; height: 45px; background: #fff; color: #999; z-index: 50; text-align: center; line-height: 20px; font-size: 14px; padding-top: 11px; cursor: pointer;transition: all 0.3s ease-in; -moz-transition: all 0.3s ease-in;-o-transition: all 0.3s ease-in;-webkit-transition: all 0.3s ease-in;-ms-transition: all 0.3s ease-in;} .style3 .slide-next:hover {background: #262626; color:#fff;} .style3 .slide-prev {position: absolute; top: 50%; margin-top: -22px; left: 0px; width: 35px; height: 45px; background: #fff; color: #999; z-index: 50; line-height: 20px; text-align: center; font-size: 14px; padding-top: 11px; cursor: pointer;transition: all 0.3s ease-in; -moz-transition: all 0.3s ease-in;-o-transition: all 0.3s ease-in;-webkit-transition: all 0.3s ease-in;-ms-transition: all 0.3s ease-in;} .style3 .slide-prev:hover {background: #262626; color:#fff;} @media screen and (max-width: 992px) { .featured-text {padding: 25px 90px 30px 90px;} .futured-half {width: 100%;} .featured-text {height: auto; } } @media screen and (max-width: 768px) { .featured-text {padding: 25px 20px 30px 80px;} } @media screen and (max-width: 480px) { .preview-hover {display: none;} } /*-------------------------------------------------------------------------------------------------------------------------------*/ /* 01-04 - ABOUT */ /*-------------------------------------------------------------------------------------------------------------------------------*/ .main-container {position: relative; float: left; width: 100%; padding: 100px 0px 190px;} .second-title {position: relative; float: left; width: 100%; padding: 98px 0px; text-align: center;} .second-title h2 {padding-bottom: 28px;} .second-title p {font-size: 15px;color: #9C9C9C;letter-spacing: 1px;line-height: 24px; max-width: 720px; margin: 0 auto;} .about-50-img {position: relative; float: left; width: 100%;} .about-50-img img {width: 100%; height: auto;} .main-container .col-50 {background: #fff; height: auto;} .main-container .col-50 p {color: #9C9C9C;} .col-50-text {position: relative; float: left; width: 100%; padding-bottom: 21px;} .col-50-title {position: relative; float: left; width: 100%; padding: 58px 50px 80px 43px;} .col-50-title h4 {padding-bottom: 16px;} .col-50-title p {color: #9C9C9C;} .block-half {position: relative; float: left; padding-left: 90px; width: 45%; padding-bottom: 50px;} .block-half h6 {font-weight: 700; letter-spacing: 2px; padding-bottom: 7px;} .block-half p {line-height: 26px; letter-spacing: 0px; padding-right: 20px; color: #9C9C9C;} .about-story {position: relative; float: left; text-align: right; padding-right: 43px; padding-top: 100px; padding: 100px 43px 90px 45px;} .about-story h4 {padding-bottom: 15px;} .about-story h6 {font-size: 13px; padding-top: 29px;} .about-story span {color: #9C9C9C;letter-spacing: 2px;line-height: 24px; font-weight: 400;font-size: 12px;} .about-story span i {color:#CC6600;} .about-story p {color: #9C9C9C;} .testimonial-baner {position: relative; float: left; width: 100%; text-align: left; overflow:hidden;} .testimonial-baner h4 {letter-spacing: 2px; padding: 75px 0px 35px 85px;} .review-block {position: relative; float: left; width: 100%; padding: 0px 70px 95px 85px;} .review-block p {font-size: 18px;line-height: 29px;letter-spacing: 1px;color: #8F8F8F;font-weight: 100;font-style: italic; padding-bottom: 20px; font-family: 'Open Sans', sans-serif; color: #8F8F8F;} .review-block span {font-size: 13px;line-height: 21px;color: #3C3C3C; font-weight: 600;} .review-block i {color: #8F8F8F;} .review-block i span {color: #CC6600;} .pagination {text-align: center; position: absolute; left:85px; bottom: 60px; width: 100%; margin: 0px; } .swiper-pagination-switch {display: inline-block; float: left; position: relative; width: 10px; height: 10px; cursor: pointer; border: 1px solid #D4D4D4; background:none; margin-right: 10px; transition: all 0.3s ease-in;-webkit-transition: all 0.3s ease-in;-moz-transition: all 0.3s ease-in;-o-transition: all 0.3s ease-in;-ms-transition: all 0.3s ease-in;} .swiper-active-switch {width: 10px; height: 10px; position: relative; background: #D4D4D4; cursor: pointer;} .team-wraper {position: relative; float: left; width: 100%; padding-top: 80px;} .wraper-sub-title {position: relative; float: left; width: 100%;} .team-block {position: relative;} .team-block:last-child {margin-right: 0%;} .team-block img {width: 100%; height: auto;} .layer-image {position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(255,255,255,0.5); opacity: 0;transition: all 0.3s ease-in;-webkit-transition: all 0.3s ease-in;-moz-transition: all 0.3s ease-in;-o-transition: all 0.3s ease-in;-ms-transition: all 0.3s ease-in;} .team-title {position: absolute; width: 100%; text-align: center; bottom: 100px; left: 0px; opacity: 0;transition: all 0.3s ease-out;-webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out;-ms-transition: all 0.3s ease-out;} .team-title span {color: #CC6600;font-size: 14px;font-weight: 700;} .team-title p {letter-spacing: 2px;color: #373737;font-weight: 500; line-height: 16px;} .team-title h4 {color: #373737; letter-spacing: 4px;} .team-block:hover .layer-image {opacity: 1;} .team-block:hover .team-title {opacity: 1; bottom: 63px;} .sub-title {text-align: center; position: relative; width: 100%;} .sub-title span {width: 30px; height: 2px; background: #9C9C9C; position: relative; float: none; display: inline-block; margin: 40px 0px 12px;} .sub-title p {padding: 0px 15px; letter-spacing: 1px; line-height: 21px; color: #696969;} .fix-bg {position: relative; width: 100%; float: left;} .number-block {position: relative; text-align: center;} .number-block h2 {font-size: 38px;color: #FFF;letter-spacing: 2px;line-height: 46px;font-weight: 400;} .number-block h6 {color:#fff; padding-top: 20px; white-space: nowrap;} .dark-layer {position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(55, 55, 55, 0.6);} .comments-block {position: relative; width: 100%; text-align: center; float: left; padding: 40px 0 10px;} .comments-block .quote {line-height: 30px;font-size: 100px;color: #CC6600;font-family: 'Lobster Two', cursive;font-weight: 700; text-align: center;} .comments-block i {font-size: 14px;color: #9C9C9C;letter-spacing: 2px;line-height: 22px;font-family: 'Open Sans', sans-serif;font-weight: 300;font-style: italic; position: relative;} .comments-block p {font-size: 12px;color: #9C9C9C;letter-spacing: 2px;line-height: 24px; padding-top: 20px;} .comments-block p span {color: #CC6600;} @media screen and (max-width: 1200px) { .about-50-img .col-50-title {padding: 58px 50px 30px 43px;} .testimonial-baner {height: auto;} .block-half {padding-bottom: 28px;} .main-container .col-50.wrap-max img {min-height: 527px; width: 100%;} .main-container .col-50.wrap-min img {min-height: 376px; width: 100%;} } @media screen and (max-width: 990px) { .main-container .col-50.wrap-max img {min-height: auto; width: 100%;} .main-container .col-50.wrap-min img {min-height: auto; width: 100%;} .comments-block {padding: 98px 100px 88px;} .nav-menu-icon {margin-top: 64px;} .main-container .top-row .display-cell:last-child {display: table-header-group;} .main-container .top-row .display-cell:first-child {display: table-footer-group;} } @media screen and (max-width: 768px) { .main-container {padding: 100px 0px;} .team-block {width: 80%; margin: 0% 10%; padding-bottom: 60px;} .number-block {padding: 90px 0px 60px;} .comments-block {padding: 65px 60px 65px;} .about-story {padding: 50px 43px 50px 45px;} } @media screen and (max-width: 550px) { .team-wraper {padding-top: 0px;} .block-half {padding-left: 43px;} } @media screen and (max-width: 480px) { .about-story {padding: 60px 43px 60px 45px;} .testimonial-baner h4 {padding-left: 15px;} .review-block {padding: 0px 40px 95px 15px;} .team-block {width: 100%; margin: 0 auto;} .number-block {padding: 60px 0px 60px;} .comments-block {padding: 65px 20px;} .main-container .col-50 p {padding-left: 0px;} .block-half {width: 50%; padding-left: 15px;} .col-50-title {padding: 58px 20px 30px 15px;} .logo {padding-left: 15px;} } @media screen and (max-width: 360px) { .block-half {width: 100%;} } /*-------------------------------------------------------------------------------------------------------------------------------*/ /* 01-05 - NEWS */ /*-------------------------------------------------------------------------------------------------------------------------------*/ .main-container.news-wrap {padding: 100px 0px;} .news-item {position: relative; float: left; width: 30%; margin-bottom: 90px;} .news-item:nth-child(3n) {margin-right: 0;} .news-block {position: relative; float: left; width: 100%; overflow: hidden;} .news-block img {width: 100%; height: auto;} .news-desc {position: relative; float: left; width: 100%; padding: 25px 40px 25px 30px;} .news-desc h6 {letter-spacing: 2px;line-height: 16px;font-weight: 500;font-size: 13px;color: #262626;} .news-desc p {color: #9C9C9C;} .news-desc h4 {padding: 20px 0px 10px;transition: all 0.3s ease-in; -moz-transition: all 0.3s ease-in;-o-transition: all 0.3s ease-in;-webkit-transition: all 0.3s ease-in;-ms-transition: all 0.3s ease-in;} .news-desc a h4:hover {color: #CC6600;} .news-desc span {letter-spacing: 2px;line-height: 24px;font-weight: 400;color: #9C9C9C; font-size:12px;} .news-desc span i {color: #CC6600;} .container-masonry {position: relative;} .container-masonry .gutter-sizer { width: 5%;} .hover-img {position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; opacity: 0; background: rgba(255,255,255,0.6);transition: all 0.3s ease-in; -moz-transition: all 0.3s ease-in;-o-transition: all 0.3s ease-in;-webkit-transition: all 0.3s ease-in;-ms-transition: all 0.3s ease-in;} .news-layer {text-align: center; position: relative; float: left; width: 100%;} .news-layer .plus {width: 80px; height: 80px; position: absolute; top: -50%; margin-top: -40px; left: 50%; margin-left: -40px; z-index: 50; -webkit-transition: all 500ms cubic-bezier(0.42, 0, 0.365, 1.47); -moz-transition: all 500ms cubic-bezier(0.42, 0, 0.365, 1.47); -o-transition: all 500ms cubic-bezier(0.42, 0, 0.365, 1.47); transition: all 500ms cubic-bezier(0.42, 0, 0.365, 1.47);} .news-item:hover .hover-img {opacity: 1;} .news-item:hover .news-layer .plus {top: 50%;} .news-post .news-left-desc {min-height: 350px; position: relative; float: left; padding: 56px 60px 30px 40px;} .news-post .news-desc h4 {padding: 30px 0px 10px;} .news-left-desc .back {line-height: 22px;font-size: 18px;color: #262626;text-align: left;font-weight: 700; letter-spacing: 2px; text-transform: uppercase; padding-top: 80px; position: relative; float: left;} .news-left-desc .back:hover {color:#CC6600;} .news-right-desc {position: relative; float: right;} .news-right-desc img {width: 100%; height: auto; min-height: 350px;} .news-text {text-align: left; width: 100%; position: relative; float: left; padding: 60px 160px 120px;} .news-text h3 {padding-bottom: 33px;} .news-text p {color: #696969;text-align: justify;letter-spacing: 1px; padding-bottom: 20px;} .paragraph {padding-top: 35px; position: relative; float: left;} .paragraph p {font-size: 16px;color: #9C9C9C;text-align: justify;letter-spacing: 1px;line-height: 26px;} .paragraph i {color:#CC6600; font-size: 16px;position: relative; float: left;} .news-text h5 {padding: 30px 0px; position: relative; float: left;} .news-comments {position: relative; float: left; width: 100%; padding: 33px 60px 35px 30px;} .news-comments img {width: 80px; height: 80px; position: absolute; left: 33px; top: 33px;} .com-text {position: relative; float: left; margin-left: 115px;} .com-info h6 {font-weight: 600; letter-spacing: 2px; position: relative; float: left; padding-right: 5px;} .com-text p {width: 100%; position: relative; float: left; color: #9E9E9E;text-align: justify; padding-top: 10px; padding-bottom: 12px;} .com-info {position: relative; float: left; width: 100%; display: inline;} .date-coment {position: relative; float: left;} .date-coment span {padding-top: 0px; color:#CC6600; line-height: 18px; font-size: 14px;} .date-coment i {padding-bottom: 0px;font-size: 12px;color: #9C9C9C;font-weight: 400;line-height: 19px; letter-spacing: 2px; font-style: normal; padding-left: 5px;} .com-text small {font-family: open-sans,sans-serif;font-weight: 300;font-style: italic;line-height: 18px;font-size: 11px;color: #9C9C9C;} @media screen and (max-width: 990px) { .news-item {width: 47.5%; margin-bottom: 60px;} .news-item:nth-child(3n) {margin-right: auto;} .news-text {padding: 60px 60px 120px;} .news-right-desc img {min-height: auto;} } @media screen and (max-width: 600px) { .news-item {width: 100%;} .container-masonry .gutter-sizer { width: 0%;} .com-text {margin-left: 0px;} .com-info {padding-left: 115px;} .date-coment {float: none; width: 100%;} .date-coment i {position: relative; width: 100%; float: left; padding-left: 0px; padding-top: 10px;} .date-coment span {display: none;} .com-text p {padding-top: 50px;} } @media screen and (max-width: 480px) { .news-text {padding: 60px 15px 60px;} .news-comments {padding: 33px 30px 35px 30px;} .news-post .news-left-desc {padding: 56px 15px 30px 15px;} .news-right-desc img {min-height: 100%;} } @media screen and (max-width: 400px) { .com-info {padding-left: 100px;} .news-comments {padding: 30px 15px 35px;} .news-comments img {left: 15px; top: 15px;} .date-coment i {letter-spacing: 1px;} } /*-------------------------------------------------------------------------------------------------------------------------------*/ /* 01-06 - CONTACT */ /*-------------------------------------------------------------------------------------------------------------------------------*/ #contact {position: relative; float: left; width: 100%; margin-top: -40px;} form {position: relative; float: left; width: 100%; margin: 0px;} .style3 .input-field {position: relative; float: left; width: 100%; padding-right: 30px; margin-left: 15px; padding-top: 10px;} .style3 .input-field label {width: 100%; position: relative; float: left;font-size: 13px;color: #262626;letter-spacing: 1px;line-height: 16px;font-weight: 400; padding-bottom: 5px;} .style3 .input-field input {width: 100%; height: 40px; background: #fff;padding: 6px;line-height: 28px;font-size: 11px;color: #696969; text-align: left;font-family: 'Open Sans', sans-serif;font-weight: 400; border: 1px solid #9C9C9C;} .style3 .input-field textarea {width: 100%;height: 160px; background: #fff;padding: 6px;line-height: 28px;font-size: 11px;color: #696969; text-align: left;font-family: 'Open Sans', sans-serif;font-weight: 400; border: 1px solid #9C9C9C;} .style3 .send-button {position: relative; float: left; width: 100%; text-align: center;} .style3 .send-button .send {background: #262626; width: 130px; height: 50px; position: relative; float: none; display: inline-block; color: #fff; font-size: 16px; font-weight: 600; border: none; outline: none; margin: 50px 0px;transition: all 0.3s ease-in; -moz-transition: all 0.3s ease-in;-o-transition: all 0.3s ease-in;-webkit-transition: all 0.3s ease-in;-ms-transition: all 0.3s ease-in;} .style3 .send-button .send:hover {background: #CC6600;} .style3 .adress {position: relative; float: left; width: 100%; padding: 115px 0px 85px;} .style3 .adress-row {position: relative; float: left; width: 100%; text-align: left; padding: 0 0 0 80px;} .adress-row h5 {font-size: 15px;line-height: 18px; padding-bottom: 10px;} .adress-row a {font-size: 13px;color: #9C9C9C;line-height: 21px;font-family: 'Open Sans', sans-serif;font-weight: 300;font-style: italic;} .adress-row a:hover {color: #CC6600;} .adress-row i {font-size: 13px;color: #9C9C9C;line-height: 21px;font-family: 'Open Sans', sans-serif;font-weight: 300;font-style: italic;} .site-map {position: relative; float: left; width: 100%; height: 250px;} .site-map iframe {width: 100%; height: 250px; border: 0px none; outline: none;} @media screen and (max-width: 1200px) { .style3 .adress-row {padding-left: 0px; text-align: center;} } @media screen and (max-width: 990px) { .input-field {padding-right: 0px; margin-left: 0px;} } @media screen and (max-width: 768px) { .style3 .adress-row {padding-bottom: 40px;} .adress {padding: 115px 0px 45px;} } /*-------------------------------------------------------------------------------------------------------------------------------*/ /* 01-07 - PORTFOLIO */ /*-------------------------------------------------------------------------------------------------------------------------------*/ .work {position: relative; float: left; width: 100%;} .portfolio {position: relative; float: left; width: 100%;} .portfolio .news-item {width: 33.3333%; margin: 0px; padding: 0px;} .container-masonry.portfolio .gutter-sizer { width: 0%;} .work-title {position: relative; float: left; width: 100%; text-align: center; padding: 40px 0px 36px;} .work-title h5 {font-size: 15px; line-height: 18px; font-weight: 600; padding-bottom: 20px;} .work-title h6 {font-size: 12px; color: #9E9E9E; letter-spacing: 1px; text-transform: uppercase;} .work-block {position: relative; float: left; width: 100%; overflow: hidden;} .work-block img {width: 100%; height: auto;} .work-detail {position: relative; float: left; width: 100%;} .work-detail img {width: 100%; height: auto;} .portfolio-text {position: relative; float: left; width: 100%; padding: 30px;} .work-detail-title {position: relative; float: left;} .work-detail-title h4 {letter-spacing: 2px;} .back-button a {position: absolute; right: 30px; top: 30px; line-height: 22px;font-size: 18px;color: #262626;font-weight: 700; text-align: right; z-index: 10;} .back-button a:hover {color: #CC6600;} .work-detail-text {position: relative; float: left; width: 100%;padding: 20px 160px 30px 0px;color: #9C9C9C;} .work-detail-category{position: relative; float: left; width: 100%;} .work-detail-category h6 {font-size: 13px; padding-bottom: 5px;} .work-detail-category p {color: #9E9E9E; font-size: 12px;} .sub-category {position: relative; float: right; text-align: right;} .sub-company {position: relative; float: left;} .page-navigation {position: relative;clear: both;box-sizing: border-box;padding: 50px 25px 0 25px;} .page-navigation.blog-nav{padding-top:0;} .nav-links a {font-size: 13px;line-height: 21px;color: #3C3C3C;font-weight: 600;} .nav-links a:hover {color: #CC6600;} .nav-previous {float: left;} .nav-next {float: right;} @media screen and (max-width: 990px) { .portfolio .news-item {width: 50%;} #contact { margin-top: 0px;} } @media screen and (max-width: 600px) { .portfolio .news-item {width: 100%;} } @media screen and (max-width: 480px) { .work-detail-text {padding-right: 0px;} .sub-category {float: left;text-align: left;width: 100%;padding-top: 20px;} .work-detail-title a {font-size: 14px;} .back-button a {bottom: 30px; top: auto;} } /*-------------------------------------------------------------------------------------------------------------------------------*/ /* 01-08 - PRICE */ /*-------------------------------------------------------------------------------------------------------------------------------*/ .price-block {position: relative; float: left; width: 100%; text-align: center; background: #fff; color:#373737; border-radius: 3px; margin: 85px 0px 95px;} .main-container .wpb_column > .wpb_wrapper > .price-block {margin-bottom: 80px;} .price-block.profession {margin-top: 70px;} .price-block.profession a {background: #CC6600;} .price-list-wrapp {position: relative; float: left; width: 100%;} .price-price {position: relative; padding: 24px 0px 0px;} .price-price h3 {letter-spacing: 3px; font-size: 22px; text-transform: uppercase;} .price-price span {font-size: 10px;color: #CC6600;line-height: 14px;letter-spacing: 3px;font-weight: 500;} .price-title {border-bottom: 1px solid #ECECEA; position: relative; width: auto; display: inline-block; float: none;} .price-title sup {font-size: 18px; line-height: 25px; top: -25px;} .price-title span {font-size: 58px;} .price-title sub {font-size: 13px; line-height: 18px; color: #9C9C9C;} .price-block ul {padding: 10px 0px;} .price-block ul li {font-size: 13px;color: #9C9C9C;line-height: 18px;letter-spacing: 2px;font-weight: 400; padding: 15px 0px;} .price-button {position: relative; float: left; width: 100%; padding: 23px 0px; border-top: 1px solid #ECECEA; text-align: center;} .price-button a {position: relative; float: none; display: inline-block; width: 110px; height: 41px; background: #373737; color: #fff; text-transform: uppercase; font-size: 12px;line-height: 19px;letter-spacing: 3px;font-weight: 500; padding-top: 12px; border-radius: 3px;transition: all 0.3s ease-in; -moz-transition: all 0.3s ease-in;-o-transition: all 0.3s ease-in;-webkit-transition: all 0.3s ease-in;-ms-transition: all 0.3s ease-in;} .price-button a:hover {background: #555;} .price-list {position: relative; padding: 65px 65px 0px 85px;} .price-list.text-right {text-align: right; padding: 65px 85px 0px 50px;} .price-list h4 {padding-bottom: 25px;} .price-list p {color: #9C9C9C; padding-bottom: 35px;} .price-list h6 {font-size: 13px; text-transform: uppercase;} .price-list span {font-size: 12px; line-height: 24px; color:#9C9C9C; letter-spacing: 2px; font-weight: 400; padding: 10px 0px 45px; position: relative; float: right;} .price-list span i {color: #CC6600;} @media screen and (max-width: 990px) { .price-block {margin: 0px 0px 40px;} .price-block.profession {margin-top: 0px;} .price-list.text-right {padding: 32px 45px 0px 50px;} .price-list {padding: 32px 65px 0px 45px;} } @media screen and (max-width: 768px) { #pricing .price-block {width: 300px; position: relative; display: inline-block; float: none;} #pricing {text-align: center;} } @media screen and (min-width: 770px) { .style1 .navigation ul.sub-menu li a, .style3 .navigation ul.sub-menu li a {font-size: 12px; text-align: left; clear: both; width: 100%; display: block;} .style1 .navigation ul.sub-menu, .style3 .navigation ul.sub-menu {background: #fff;} } /*-------------------------------------------------------------------------------------------------------------------------------*/ /*-------------------------------------------------------------------------------------------------------------------------------*/ /*-------------------------------------------------------------------------------------------------------------------------------*/ /* 02 - VERS.1 - TOP MENU */ /*-------------------------------------------------------------------------------------------------------------------------------*/ /*-------------------------------------------------------------------------------------------------------------------------------*/ /*-------------------------------------------------------------------------------------------------------------------------------*/ /*-------------------------------------------------------------------------------------------------------------------------------*/ /* 02-01 - HEADER */ /*-------------------------------------------------------------------------------------------------------------------------------*/ .main-home-page {position: relative; float: left; width: 100%; max-height: 600px; overflow: hidden;} .main-home-page img {width: 100%; height: auto;} body .main-caption h1 {color: #fff;} .main-wpapper {position: relative; padding-bottom: 190px;} .main-caption span {font-size: 14px;font-weight: 700;letter-spacing: 6px;color: #FFF; text-align: center; text-transform: uppercase;} .navigation {position: absolute; width: 100%; height: 600px; background: rgba(255,255,255,0.9); left: 0px; top: 100px; text-align: center; display: none; opacity: 0;transition: all 0.3s ease-in; -moz-transition: all 0.3s ease-in;-o-transition: all 0.3s ease-in;-webkit-transition: all 0.3s ease-in;-ms-transition: all 0.3s ease-in;} .navigation a {float: left; position: relative; margin-left: 50px; font-size: 18px;color: #262626;text-align: center;letter-spacing: 2px;line-height: 22px;font-family: roboto, sans-serif;font-weight: 700;text-transform: uppercase;} .navigation nav {position: relative; float: none; display: inline-block; padding-top: 95px;} .navigation.slide {display: block; opacity: 1;} .navigation a:hover {color: #CC6600;} .navigation li{float:left; position:relative;} .navigation li.current-menu-item > a, .style3 .navigation nav .current_page_parent > a, .style1 .navigation nav .current_page_parent > a{color:#CC6600;} .nav>li>a:hover, .nav>li>a:focus{background-color:transparent;} .style1 .navigation ul.sub-menu li, .style3 .navigation ul.sub-menu li {margin-bottom: 10px;} .style1 .navigation ul.sub-menu, .style3 .navigation ul.sub-menu {position: absolute;margin-top: 17px;z-index: 999;display: none;padding-top: 20px;text-align: left;} .style1 .navigation li:hover > ul.sub-menu, .style3 .navigation li:hover > ul.sub-menu{display:none;} .style3 .navigation ul.sub-menu {margin-top:12px; background:#fff; padding-right:40px;} .sub-menu .sub-menu{display: none!important;} header {width: 100%; height: 100px; position: fixed; z-index: 500; background: #fff;} .logo {position: relative; float: left; padding-top: 40px;padding-left: 15px;} .logo a {font-size: 30px;color: #262626;text-align: center;letter-spacing: 4px;font-family: roboto, sans-serif;font-weight: 700;} .logo a:hover {color: #CC6600;} .nav-menu-icon {position: relative; float: right; margin-top: 50px; margin-right: 15px;} .header-share {position: relative; float: left; width: 100%; padding-top: 80px; text-align: center; } .header-share a {position: relative;color: #262626; font-size: 18px; line-height: 22px; position: relative; float: none; margin: 0px 5px; display: inline-block; transition: all 0.3s ease-in; -moz-transition: all 0.3s ease-in;-o-transition: all 0.3s ease-in;-webkit-transition: all 0.3s ease-in;-ms-transition: all 0.3s ease-in;} .header-share a i:after {width: 0px; content: ''; height: 0px;} .header-share a:hover {color:#CC6600;} .header-right .logo.img-logo{padding-top:23px;} .header-logo{display: inline-block;} /*-------------------------------------------------------------------------------------------------------------------------------*/ /* 02-02 - HOME */ /*-------------------------------------------------------------------------------------------------------------------------------*/ .muse-template {position: relative; width: 100%; text-align: center; } .muse-template p {padding:40px 0; font-size: 16px;color: #9C9C9C;text-align: center;letter-spacing: 1px;line-height: 26px;font-family: roboto,sans-serif;font-weight: 400;} .col-50 {position: relative; float: left; width: 50%; height: 420px; overflow: hidden;} .col-50 img {width: 100%; height: auto;} .portfolio-baner {position: relative; float: left; width: 100%; overflow:hidden} .vc_empty_space {clear: both;display: block;width: 100%;} .clients {position: relative; float: left; width: 100%; text-align: center;} .clients h3 {padding-bottom: 60px;} .clients img {margin: 0px 33px;} footer {position: relative; float: left; width: 100%; background: #fff; text-align: center;} .button-top {position: relative; float: left; width: 100%;} .button-totop {text-align: center; position: absolute; right: 15px; top: -62px; z-index: 50; width: 40px; height: 42px; background: #CC6600; cursor: pointer;transition: all 0.3s ease-in; -moz-transition: all 0.3s ease-in;-o-transition: all 0.3s ease-in;-webkit-transition: all 0.3s ease-in;-ms-transition: all 0.3s ease-in;} .button-totop span {color:#fff; transform: rotate(90deg);-moz-transform: rotate(90deg);-o-transform: rotate(90deg);-ms-transform: rotate(90deg);-webkit-transform: rotate(90deg); display: block; position: relative; font-size: 24px; line-height: 29px; text-align: center; font-weight: 300;font-family: roboto,sans-serif;padding: 5px 5px 5px 8px;} .button-totop:hover {background: #9E9E9E; color:#262626;} .footer-logo {position: relative; float: left; padding: 50px 15px 20px; width: 100%; text-align:left;} .footer-logo a {font-size: 11px;letter-spacing: 2px;line-height: 15px;color: #9C9C9C;font-family: roboto,sans-serif;font-weight: 500; text-transform: uppercase;} .footer-logo span {line-height: 12px;font-size: 10px;color: #9C9C9C;text-align: center;font-family: roboto,sans-serif;font-weight: 700;letter-spacing: 3px; text-transform: uppercase; position: relative; float: left; width: 100%;} .copyright {width: 50%; padding-top: 10px;} .copyright span {font-size: 11px;color: #9C9C9C;letter-spacing: 1px;line-height: 13px;font-family: roboto,sans-serif;font-weight: 400; text-transform: none; text-align:left; padding-bottom: 20px;} .copyright a {font-size: 10px;color: #CC6600;letter-spacing: 2px;line-height: 12px;font-family: roboto,sans-serif;font-weight: 400; margin-top: 0px;} .flogo{display:inline-block;} .footer-share {position: relative; float: right; width: 50%; text-align: right; padding-top: 25px;} .footer-share .fa {color: #9C9C9C; font-size: 18px; line-height: 22px; position: relative; float: none; margin: 0px 0px; display: inline-block;} .footer-share a i:after {width: 0px; content: ''; height: 0px;} .footer-share .fa:hover {color:#CC6600;} .nav-menu-icon a {display: inline-block;width:24px;height:24px;cursor: pointer;text-decoration: none;} .nav-menu-icon a i {position: relative;display: inline-block;width: 24px;height: 4px;color:#262626;font:bold 14px/.4 Helvetica;text-transform: uppercase;text-indent:-55px;background: #262626;transition:all .2s ease-out;} .nav-menu-icon a i::before, a i::after {content:'';width: 24px;height: 4px;background: #262626;position: absolute;left:0;transition:all .2s ease-out;} .nav-menu-icon a i::before {top: -7px;} .nav-menu-icon a i::after {bottom: -7px;} .nav-menu-icon a:hover i::before {top: -10px;} .nav-menu-icon a:hover i::after {bottom: -10px;} .nav-menu-icon a.active i {background: #fff;} .nav-menu-icon a.active i::before { top:0; -webkit-transform: rotateZ(45deg); -moz-transform: rotateZ(45deg); -ms-transform: rotateZ(45deg); -o-transform: rotateZ(45deg); transform: rotateZ(45deg); } .nav-menu-icon a.active i::after { bottom:0; -webkit-transform: rotateZ(-45deg); -moz-transform: rotateZ(-45deg); -ms-transform: rotateZ(-45deg); -o-transform: rotateZ(-45deg); transform: rotateZ(-45deg); } .nav-menu-icon a {position: absolute;left:50%;margin-left:-9px;top:50%;margin-top:-9px;} @media screen and (max-width: 1200px) { .clients img {margin: 0px 15px;} .muse-template p {padding: 0px 127px 90px;} } @media screen and (max-width: 992px) { .clients img {margin: 0px 40px;} .muse-template p {padding: 0px 65px 90px;} .col-50 {width: 100%; height: auto;} .agency-block {height: auto;} .top-row .display-cell:first-child {display: table-header-group; width: 100%;} .top-row .display-cell:last-child {display: table-footer-group; width: 100%;} .style3 .navigation ul.sub-menu {position: relative;display: block;padding: 0;margin: 0;} } @media screen and (max-width: 768px) { .main-wpapper {padding-bottom: 100px;} .logo {padding-left: 35px;} .nav-menu-icon {margin-right: 50px;} .navigation a {float: left; width: 100%; margin: 10px 0px;} .navigation li {width: 100%;} .style1 .navigation ul.sub-menu{position:relative; margin-top:auto; display:inline-block; padding-top:inherit; text-align:center;} .style1 .navigation ul.sub-menu li {margin-bottom: auto;} .style1 .navigation li:hover > ul.sub-menu{display: inline-block;} .navigation nav {padding-top: 25px;} .header-share {padding: 40px 0px 40px;} .header-share a {float: none; width: auto; margin: 0px 5px;} } @media screen and (max-width: 560px) { .agency-block {padding: 80px 40px 60px 40px; text-align: center;} } @media screen and (max-width: 480px) { .muse-template p {padding: 0px 25px 90px;} } /*-------------------------------------------------------------------------------------------------------------------------------*/ /* 02-03 - FEATURED */ /*-------------------------------------------------------------------------------------------------------------------------------*/ .style1 .featured-baner {position: relative; float: left; width: 100%; height: 100%;} .featured-img {position: relative; float: left; width: 100%;} .featured-img img {width: 100%; height: auto;} .bottom-desc {position: relative; float: left; width: 100%; background: #fff;} .number-slide {position: absolute; left: 30px; top: 30px; font-size: 12px; font-weight: 400; color:#262626;} .featured-img {position: relative; float: left; width: 100%;} .style1 .featured-text {position: relative; float: left; width: 100%; background: #fff; padding: 25px 50px 30px 90px; margin-top: -10px; height: auto;} .featured-text h4 {padding-bottom: 27px;} .featured-text h5 {font-size: 15px; padding-bottom: 15px;} .featured-text p {color: #9C9C9C;} .preview-hover {position: absolute; top: 80%; width: 100%; text-align: center;} .preview-hover img {margin-left: 15px; cursor: pointer;} .hide-text {display: none;} .slide-next {position: absolute; top: 40%; margin-top: -22px; right: 0px; width: 35px; height: 45px; background: #fff; color: #999; z-index: 50; text-align: center; line-height: 20px; font-size: 14px; padding-top: 11px; cursor: pointer;transition: all 0.3s ease-in; -moz-transition: all 0.3s ease-in;-o-transition: all 0.3s ease-in;-webkit-transition: all 0.3s ease-in;-ms-transition: all 0.3s ease-in;} .slide-next:hover {background: #262626; color:#fff;} .slide-prev {position: absolute; top: 40%; margin-top: -22px; left: 0px; width: 35px; height: 45px; background: #fff; color: #999; z-index: 50; line-height: 20px; text-align: center; font-size: 14px; padding-top: 11px; cursor: pointer;transition: all 0.3s ease-in; -moz-transition: all 0.3s ease-in;-o-transition: all 0.3s ease-in;-webkit-transition: all 0.3s ease-in;-ms-transition: all 0.3s ease-in;} .slide-prev:hover {background: #262626; color:#fff;} @media screen and (max-width: 992px) { .style1 .featured-text {padding: 25px 80px 30px 90px;} } @media screen and (max-width: 480px) { .slide-next {top: 20%;} .slide-prev {top: 20%;} .preview-hover {display: none;} } /*-------------------------------------------------------------------------------------------------------------------------------*/ /* 02-04 - ABOUT */ /*-------------------------------------------------------------------------------------------------------------------------------*/ .main-container {position: relative; float: left; width: 100%; padding: 100px 0px 80px;} .second-title {position: relative; float: left; width: 100%; padding: 98px 20px; text-align: center;} .second-title h2 {padding-bottom: 28px;} .second-title p {font-size: 15px;color: #9C9C9C;letter-spacing: 1px;line-height: 24px;} .main-container .col-50 {background: #fff; height: auto;} .main-container .col-50 p {color: #9C9C9C;} .col-50-text {position: relative; float: left; width: 100%; padding-bottom: 21px;} .col-50-title {position: relative; float: left; width: 100%; padding: 58px 50px 80px 43px;} .col-50-title h4 {padding-bottom: 16px;} .about-story {position: relative; float: left; text-align: right; padding-right: 43px; padding-top: 100px; padding: 100px 43px 90px 45px;} .about-story h4 {padding-bottom: 15px;} .about-story h6 {font-size: 13px; padding-top: 29px;} .about-story span {color: #9C9C9C;letter-spacing: 2px;line-height: 24px; font-weight: 400;font-size: 12px;} .about-story span i {color:#CC6600;} @media screen and (max-width: 1200px) { .col-50-title {padding: 58px 50px 30px 43px;} .testimonial-baner {height: 100%;} .block-half {padding-bottom: 28px;} .main-container .col-50.wrap-max img {min-height: 527px; width: 100%;} .main-container .col-50.wrap-min img {min-height: 376px; width: 100%;} } @media screen and (max-width: 990px) { .main-container .col-50.wrap-max img {min-height: auto; width: 100%;} .main-container .col-50.wrap-min img {min-height: auto; width: 100%;} .comments-block {padding: 98px 100px 88px;} .nav-menu-icon {margin-top: 64px;} .main-container .top-row .display-cell:last-child {display: table-header-group;} .main-container .top-row .display-cell:first-child {display: table-footer-group;} } @media screen and (max-width: 768px) { .main-container {padding: 100px 0px 80px;} .team-block {width: 80%; margin: 0% 10%; padding-bottom: 60px;} .number-block {padding: 90px 0px 60px;} .comments-block {padding: 65px 60px 65px;} } @media screen and (max-width: 550px) { .block-half {padding-left: 43px;} } @media screen and (max-width: 480px) { .about-story {padding: 60px 43px 60px 45px;} .testimonial-baner h4 {padding-left: 15px;} .review-block {padding: 0px 40px 95px 15px;} .team-block {width: 100%; margin: 0 auto;} .number-block {padding: 60px 0px 60px;} .comments-block {padding: 65px 20px;} .main-container .col-50 p {padding-left: 0px;} .block-half {width: 50%; padding-left: 15px;} .col-50-title {padding: 58px 20px 30px 15px;} .logo {padding-left: 15px;} } @media screen and (max-width: 360px) { .block-half {width: 100%;} } /*-------------------------------------------------------------------------------------------------------------------------------*/ /* 02-05 - NEWS */ /*-------------------------------------------------------------------------------------------------------------------------------*/ .main-container.news-wrap {padding: 100px 0px;} .news-item {position: relative; float: left; width: 30%; margin-bottom: 90px;} .news-item:nth-child(3n) {margin-right: 0;} .news-block {position: relative; float: left; width: 100%; overflow: hidden;} .news-block img {width: 100%; height: auto;} .news-desc {position: relative; float: left; width: 100%; padding: 25px 40px 25px 30px;} .news-desc h6 {letter-spacing: 2px;line-height: 16px;font-weight: 500;font-size: 13px;color: #262626;} .news-desc p {color: #9C9C9C;} .news-desc h4 {padding: 20px 0px 10px;transition: all 0.3s ease-in; -moz-transition: all 0.3s ease-in;-o-transition: all 0.3s ease-in;-webkit-transition: all 0.3s ease-in;-ms-transition: all 0.3s ease-in; text-transform:uppercase;} .news-desc a h4:hover {color: #CC6600;} .news-desc span {letter-spacing: 2px;line-height: 24px;font-weight: 400;color: #9C9C9C; font-size:12px;} .news-desc span i {color: #CC6600;} .container-masonry {position: relative;} .container-masonry .gutter-sizer { width: 5%;} .hover-img {position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; opacity: 0; background: rgba(255,255,255,0.6);transition: all 0.3s ease-in; -moz-transition: all 0.3s ease-in;-o-transition: all 0.3s ease-in;-webkit-transition: all 0.3s ease-in;-ms-transition: all 0.3s ease-in;} .news-layer {text-align: center; position: relative; float: left; width: 100%;} .news-layer .plus {width: 80px; height: 80px; position: absolute; top: -50%; margin-top: -40px; left: 50%; margin-left: -40px; z-index: 50; -webkit-transition: all 500ms cubic-bezier(0.42, 0, 0.365, 1.47); -moz-transition: all 500ms cubic-bezier(0.42, 0, 0.365, 1.47); -o-transition: all 500ms cubic-bezier(0.42, 0, 0.365, 1.47); transition: all 500ms cubic-bezier(0.42, 0, 0.365, 1.47);} .news-item:hover .hover-img {opacity: 1;} .news-item:hover .news-layer .plus {top: 50%;} .news-post .news-left-desc {min-height: 350px; position: relative; float: left; padding: 56px 60px 30px 40px;} .news-post .news-desc h4 {padding: 30px 0px 10px; text-transform:uppercase;} .news-left-desc .back {line-height: 22px;font-size: 18px;color: #262626;text-align: left;font-weight: 700; letter-spacing: 2px; text-transform: uppercase; padding-top: 80px; position: relative; float: left;} .news-left-desc .back:hover {color:#CC6600;} .news-right-desc {position: relative; float: right;} .news-text {text-align: left; width: 100%; position: relative; float: left; padding: 60px 160px 120px;} .news-text h3 {padding-bottom: 33px;text-transform:uppercase;} .news-text p {color: #696969;text-align: justify;letter-spacing: 1px; padding-bottom: 20px;} .paragraph {padding-top: 35px; position: relative; float: left;} .paragraph p {font-size: 16px;color: #9C9C9C;text-align: justify;letter-spacing: 1px;line-height: 26px;} .paragraph i {color:#CC6600; font-size: 16px;position: relative; float: left;} .news-text h5 {padding: 30px 0px; position: relative; float: left;} .com-text {position: relative; float: left; margin-left: 115px; min-height:80px;} .com-text p {width: 100%; position: relative; float: left; color: #9E9E9E;text-align: justify; padding-top: 10px; padding-bottom: 12px;} .com-info {position: relative; float: left; width: 100%; display: inline;} .date-coment {position: relative; float: left;} .date-coment span {padding-top: 0px; color:#CC6600; line-height: 18px; font-size: 14px;} .date-coment i {padding-bottom: 0px;font-size: 12px;color: #9C9C9C;font-weight: 400;line-height: 19px; letter-spacing: 2px; font-style: normal; padding-left: 5px;} .com-text small {font-family: open-sans,sans-serif;font-weight: 300;font-style: italic;line-height: 18px;font-size: 11px;color: #9C9C9C;} @media screen and (max-width: 990px) { .news-item {width: 47.5%; margin-bottom: 60px;} .news-item:nth-child(3n) {margin-right: auto;} .news-text {padding: 60px 60px 120px;} .news-right-desc img {min-height: 100%;} } @media screen and (max-width: 600px) { .news-item {width: 100%;} .container-masonry .gutter-sizer { width: 0%;} .com-text {margin-left: 0px;} .com-info {padding-left: 115px;} .date-coment {float: none; width: 100%;} .date-coment i {position: relative; width: 100%; float: left; padding-left: 0px; padding-top: 10px;} .date-coment span {display: none;} .com-text p {padding-top: 50px;} } @media screen and (max-width: 480px) { .news-text {padding: 60px 15px 60px;} .news-comments {padding: 33px 30px 35px 30px;} .news-post .news-left-desc {padding: 56px 15px 30px 15px;} } @media screen and (max-width: 400px) { .com-info {padding-left: 100px;} .news-comments {padding: 30px 15px 35px;} .news-comments img {left: 15px; top: 15px;} .date-coment i {letter-spacing: 1px;} } /*-------------------------------------------------------------------------------------------------------------------------------*/ /* 02-06 - CONTACT */ /*-------------------------------------------------------------------------------------------------------------------------------*/ .input-field {position: relative; float: left; width: 100%; padding-right: 30px; margin-left: 15px; padding-top: 10px;} .input-field label {width: 100%; position: relative; float: left;font-size: 13px;color: #262626;letter-spacing: 1px;line-height: 16px;font-weight: 400; padding-bottom: 5px; text-align:left;} .style1 .input-field input {width: 100%; height: 40px; background: #fff;padding: 6px;line-height: 28px;font-size: 11px;color: #696969; text-align: left;font-family: open-sans,sans-serif;font-weight: 400; border: 1px solid #9C9C9C;} .style1 .input-field textarea {width: 100%;height: 160px; background: #fff;padding: 6px;line-height: 28px;font-size: 11px;color: #696969; text-align: left;font-family: open-sans,sans-serif;font-weight: 400; border: 1px solid #9C9C9C;} .style1 .send-button {position: relative; float: left; width: 100%; text-align: center;} .style1 .send-button .send, .wpcf7-submit {background: #262626; width: 130px; height: 50px; position: relative; float: none; display: inline-block; color: #fff; font-size: 16px; font-weight: 600; border: none; outline: none; margin: 50px 0px;transition: all 0.3s ease-in; -moz-transition: all 0.3s ease-in;-o-transition: all 0.3s ease-in;-webkit-transition: all 0.3s ease-in;-ms-transition: all 0.3s ease-in;} .style1 .send-button .send:hover, .wpcf7-submit:hover {background: #CC6600;} .wpcf7-form {text-align: center;} .adress {position: relative; float: left; width: 100%; padding: 115px 0px 85px;} .adress-row {position: relative; float: left; width: 100%; text-align: left; padding-left: 80px;} .adress-row h5 {font-size: 15px;line-height: 18px; padding-bottom: 10px;} .adress-row a {font-size: 13px;color: #9C9C9C;line-height: 21px;font-family: open-sans,sans-serif;font-weight: 300;font-style: italic;} .adress-row a:hover {color: #CC6600;} .adress-row i {font-size: 13px;color: #9C9C9C;line-height: 21px;font-family: open-sans,sans-serif;font-weight: 300;font-style: italic;} .site-map {position: relative; float: left; width: 100%; height: 250px;} .site-map iframe {width: 100%; height: 250px; border: 0px none; outline: none;} .contactform.style2 input{width: 100%;height: 40px;background: #fff;padding: 6px;line-height: 28px;font-size: 11px;color: #696969;text-align: left;font-family: open-sans,sans-serif;font-weight: 400;border: 0px none;margin-top: 25px;} .contactform.style2 textarea {width: 100%;height: 160px;background: #fff;padding: 6px;line-height: 28px;font-size: 11px;color: #696969;text-align: left;font-family: open-sans,sans-serif;font-weight: 400;border: 0px none;margin-top: 25px;} .contactform.style2 input[type=submit] {background: #262626;width: 130px;height: 50px;position: relative;float: left;display: inline-block;color: #fff;font-size: 16px;font-weight: 600;border: none;outline: none;text-transform:uppercase;margin: 20px 0;line-height: 1em;text-align:center;transition: all 0.3s ease-in;-moz-transition: all 0.3s ease-in;-o-transition: all 0.3s ease-in;-webkit-transition: all 0.3s ease-in;-ms-transition: all 0.3s ease-in;} .contactform.style2 input[type=submit]:hover {background: #CC6600;} @media screen and (max-width: 1200px) { .adress-row {padding-left: 0px; text-align: center;} } @media screen and (max-width: 990px) { .style1 .input-field {padding-right: 0px; margin-left: 0px;} } @media screen and (max-width: 768px) { .adress-row {padding-bottom: 40px;} .adress {padding: 115px 0px 45px;} } /*-------------------------------------------------------------------------------------------------------------------------------*/ /* 02-07 - PORTFOLIO */ /*-------------------------------------------------------------------------------------------------------------------------------*/ .work {position: relative; float: left; width: 100%;} .portfolio {position: relative; float: left; width: 100%;} .portfolio .news-item {width: 33.3333333%; margin: 0px; padding: 0px;} .container-masonry.portfolio .gutter-sizer { width: 0%;} .work-title {position: relative; float: left; width: 100%; text-align: center; padding: 40px 0px 36px;} .work-title h5 {font-size: 15px; line-height: 18px; font-weight: 600; padding-bottom: 20px;} .work-title h6 {font-size: 12px; color: #9E9E9E; letter-spacing: 1px; text-transform: uppercase;} .work-block {position: relative; float: left; width: 100%; overflow: hidden;} .work-block img {width: 100%; height: auto;} .work-detail {position: relative; float: left; width: 100%;} .work-detail img {width: 100%; height: auto;} .portfolio-text {position: relative; float: left; width: 100%; padding: 30px;} .work-detail-title {position: relative; float: left;} .work-detail-title h4 {letter-spacing: 2px;} .back-button a {position: absolute; right: 30px; top: 30px; line-height: 22px;font-size: 18px;color: #262626;font-weight: 700; text-align: right; z-index: 10;} .back-button a:hover {color: #CC6600;} .work-detail-text {position: relative; float: left; width: 100%;padding: 20px 160px 30px 0px;color: #9C9C9C;} .work-detail-category{position: relative; float: left; width: 100%;} .work-detail-category h6 {font-size: 13px; padding-bottom: 5px;} .work-detail-category p {color: #9E9E9E; font-size: 12px;} .sub-category {position: relative; float: right; text-align: right;} .sub-company {position: relative; float: left;} @media screen and (max-width: 990px) { .portfolio .news-item {width: 50%;} } @media screen and (max-width: 600px) { .portfolio .news-item {width: 100%;} } @media screen and (max-width: 480px) { .work-detail-text {padding-right: 0px;} .sub-category {float: left;text-align: left;width: 100%;padding-top: 20px;} .work-detail-title a {font-size: 14px;} .back-button a {bottom: 30px; top: auto;} } /*-------------------------------------------------------------------------------------------------------------------------------*/ /*-------------------------------------------------------------------------------------------------------------------------------*/ /*-------------------------------------------------------------------------------------------------------------------------------*/ /* 03 - VERS.2 - RIGHT MENU */ /*-------------------------------------------------------------------------------------------------------------------------------*/ /*-------------------------------------------------------------------------------------------------------------------------------*/ /*-------------------------------------------------------------------------------------------------------------------------------*/ /*-------------------------------------------------------------------------------------------------------------------------------*/ /* 03-01 - HEADER RIGHT */ /*-------------------------------------------------------------------------------------------------------------------------------*/ .style2 h1, body .main-slider h1 {font-size: 48px;color: #262626;line-height: 85px;letter-spacing: 5px;text-align: center;font-weight: 700;text-transform: uppercase;} .main-slider{overflow:hidden;} .style2 .nav-menu-icon {margin-top: 0px;} .nav-menu-icon a {display: inline-block;width:24px;height:24px;cursor: pointer;text-decoration: none;} .nav-menu-icon a i {position: relative;display: inline-block;width: 24px;height: 3px;color:#262626;font:bold 14px/.4 Helvetica;text-transform: uppercase;text-indent:-55px;background: #262626;transition:all .2s ease-out;} .nav-menu-icon a i::before, a i::after {content:'';width: 24px;height: 3px;background: #262626;position: absolute;left:0;transition:all .2s ease-out;} .nav-menu-icon a i::before {top: -7px;} .nav-menu-icon a i::after {bottom: -7px;} .nav-menu-icon a:hover i::before {top: -10px;} .nav-menu-icon a:hover i::after {bottom: -10px;} .nav-menu-icon a.active i {background: none;} .nav-menu-icon a.active i::before { top:0; -webkit-transform: rotateZ(45deg); -moz-transform: rotateZ(45deg); -ms-transform: rotateZ(45deg); -o-transform: rotateZ(45deg); transform: rotateZ(45deg); } .nav-menu-icon a.active i::after { bottom:0; -webkit-transform: rotateZ(-45deg); -moz-transform: rotateZ(-45deg); -ms-transform: rotateZ(-45deg); -o-transform: rotateZ(-45deg); transform: rotateZ(-45deg); } .header-right {position: fixed; top: 0px; left:0px; background: none; height: 100px; z-index: 5000; width: 100%;} .header-right .header {position: relative; float: left; width: 100%;} .header-right .mobile-icon {position: fixed; margin-top: 40px; right: 110px; top: 0px; z-index: 8000;} .header-right .main-slider {position: relative;} .header-right .logo {position: absolute; left: 110px; padding-top: 40px;} .header-right .logo a {font-size: 30px;color: #262626;letter-spacing: 4px;text-align: center;font-weight: 700; line-height: 10px;} .header-right .logo h6 {font-size: 8px;color: #262626;line-height: 18px;letter-spacing: 4px;text-align: center;font-weight: 400;text-transform: uppercase;} .header-right .navigation {position: fixed; padding-top: 0px; z-index: 6000; width: 244px; opacity: 0; height: 100%; background: #262626; right: 0%; left: auto; top: 0px;transition: all 0.3s ease-in; -moz-transition: all 0.3s ease-in;-o-transition: all 0.3s ease-in;-webkit-transition: all 0.3s ease-in;-ms-transition: all 0.3s ease-in;visibility: hidden; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; backface-visibility: hidden; -webkit-transform: rotateY(90deg) translateX(100%); -moz-transform: rotateY(90deg) translateX(100%); -ms-transform: rotateY(90deg) translateX(100%); transform: rotateY(90deg) translateX(100%);} .header-right .navigation nav {position: relative; float: left; width: 100%; text-align: left; padding-left: 40px; padding-top: 120px;} .header-right .navigation nav a {font-size: 15px;color: #FFFFFF;line-height: 18px;letter-spacing: 5px;font-weight: 600; position: relative; float: left; display: block; width: 100%; margin: 22px 0px; text-align: left;} .header-right .navigation nav a.active {color: #CC6600;} .header-right .navigation nav a:hover {color: #CC6600;} .header-right .navigation.slide {visibility: visible; -webkit-backface-visibility: visible; -moz-backface-visibility: visible; backface-visibility: visible; -webkit-transform: rotateY(0deg) translateX(0%); -moz-transform: rotateY(0deg) translateX(0%); -ms-transform: rotateY(0deg) translateX(0%); transform: rotateY(0deg) translateX(0%); opacity: 1;} .center-mail-title {position: absolute; left: 0%; top: 50%; text-align: center; z-index: 500; width: 100%; margin-top: -65px;} .center-mail-title h5 {line-height: 35px;letter-spacing: 6px;font-weight: 400;} .center-mail-title span {font-size: 24px;color: #373737;line-height: 40px;letter-spacing: 3px;font-family: 'Dawning of a New Day', cursive;font-weight: 400; font-style: normal;} .main-slider .slide-next {top: auto; bottom: 20%;} .main-slider .slide-prev {top: auto; bottom: 20%;} .header-title {text-align: center; position: absolute; left: 0px; top: 0px; width: 100%;} .header-title h4 {font-weight: 600; padding-top: 42px; text-transform: uppercase;} body.style3 .main-slider .slide-prev, body.style3 .main-slider .slide-next {bottom: inherit;top: 50%;margin-top: -22px;} body.style3 .main-slider h1{font-size: 52px;letter-spacing: 7px;color: #FFF;line-height: 62px;font-weight: 700;} body.style3 .main-slider h5{font-size: 14px;font-weight: 700;letter-spacing: 6px;color: #FFF;text-align: center;text-transform: uppercase;} body.style3 .main-slider span{color:#fff;} .header-right .header-share {position: relative; float: left; width: 100%; padding-top: 60px; text-align: center; } .header-right .header-share a {position: relative;color: #fff; font-size: 18px; line-height: 22px; position: relative; float: none; margin: 0px 5px; display: inline-block; transition: all 0.3s ease-in; -moz-transition: all 0.3s ease-in;-o-transition: all 0.3s ease-in;-webkit-transition: all 0.3s ease-in;-ms-transition: all 0.3s ease-in;} .header-right .header-share a i:after {width: 0px; content: ''; height: 0px;} .header-right .header-share a:hover {color:#CC6600;} .header-white {background: #fff; border-bottom: 1px solid #EDEDED;} .nav-menu-icon a i.icon-color {background: #262626;} .nav-menu-icon a i.icon-color::before {background: #fff;} .nav-menu-icon a i.icon-color::after {background: #fff;} .style2 .navigation li {float: none;} .style2 li.current_page_item > a {color:#CC6600;} .style2 ul.sub-menu {padding-left: 19px;} @media screen and (max-width: 768px) { .header-right .mobile-icon {right: 40px;} .header-right .logo {left: 40px;} } @media screen and (max-width: 480px) { .header-right .mobile-icon {right: 20px;} .header-right .logo {left: 20px;} } .style2 .button-top {position: relative; float: left; width: 100%;} .style2 .button-totop {text-align: center; position: absolute; top: -80px; z-index: 50; left: 50%; margin-left: -20px; width: 40px; height: 42px; background: #9E9E9E; cursor: p ointer;transition: all 0.3s ease-in; -moz-transition: all 0.3s ease-in;-o-transition: all 0.3s ease-in;-webkit-transition: all 0.3s ease-in;-ms-transition: all 0.3s ease-in;} .style2 .button-totop span {color:#fff; transform: rotate(90deg);-moz-transform: rotate(90deg);-o-transform: rotate(90deg);-ms-transform: rotate(90deg);-webkit-transform: rotate(90deg); display: block; position: relative; font-size: 24px; line-height: 29px; text-align: center; font-weight: 200;font-family: roboto,sans-serif;padding: 0px 6px 5px 14px;} .style2 .button-totop:hover {background: #CC6600; color:#262626;} /*-------------------------------------------------------------------------------------------------------------------------------*/ /* 03-02 - WORKS */ /*-------------------------------------------------------------------------------------------------------------------------------*/ .main-wrapper {position: relative; padding: 150px 0px 160px; background: #fff;} .container-masonry {position: relative;} .item {position: relative; float: left; width: 25%; padding: 5px;} .item img {width: 100%; height: auto;} .work-layer {position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; background: rgba(255,255,255,0.4); z-index: 15; opacity: 0;transition: all 0.35s ease-out 0.1s; -moz-transition: all 0.35s ease-out 0.1s;-o-transition: all 0.35s ease-out 0.1s;-webkit-transition: all 0.35s ease-out 0.1s;-ms-transition: all 0.35s ease-out 0.1s;} .item:hover .work-layer {opacity: 1;} .fancybox-opened .fancybox-skin {box-shadow: none;} .fancybox-skin {background: none;} .fancybox-overlay {background: rgba(255,255,255,0.9);} .fancy-title {position: relative; float: left; background: #fff; width: 100%; text-align: right;} .fancybox-title .count {line-height: 17px;font-size: 12px;color: #373737;font-weight: 400; position: relative; float: right; padding-right: 10px;} .fancybox-title p {font-size: 11px;color: #373737;line-height: 20px;letter-spacing: 4px;text-align: left;font-weight: 400;text-transform: uppercase; position: relative; float: left;} .fancybox-title {background: #fff; height: 35px; padding-left: 10px;} .fancybox-prev span {background: url('../img/prev-button.png') no-repeat; position: absolute; left: -80px; top: 50%; z-index: 50; height: 40px; width: 40px; visibility: visible;} .fancybox-next span {background: url('../img/next-button.png') no-repeat; position: absolute; right: -80px; top: 50%; z-index: 50; height: 40px; width: 40px; visibility: visible;} @media screen and (max-width:990px) { .item {width: 33.3333%;} } @media screen and (max-width: 768px) { .item {width: 50%;} .fancybox-title p {letter-spacing: 1px;} } @media screen and (max-width: 480px) { .item {width: 100%;} .fancybox-next span {display: none;} .fancybox-prev span {display: none;} } /*-------------------------------------------------------------------------------------------------------------------------------*/ /* 03-03 - ABOUT */ /*-------------------------------------------------------------------------------------------------------------------------------*/ .about.main-wrapper {padding-top: 100px;} .clients h4 {padding-bottom: 60px; font-weight: 600;} .clients img {margin: 0px 33px;} .about-image {position: relative; width: 100%; float: left;} .about-image img {width: 100%; height: auto;} .about-text {padding: 45px 30px;} .about-text h4 {padding-bottom: 5px; } .about-text p {color: #9C9C9C; padding: 24px 0px 0px;} .about-left-text {position: relative; float: left; width: 100%; text-align: left;} .about-left-text i {font-size: 13px;color: #9C9C9C;line-height: 21px;font-family: open-sans,sans-serif;font-weight: 400;font-style: italic; padding-top: 40px; position: relative; float: left;} .about-right-text {position: relative; float: left; width: 100%; text-align: right;} .about-right-text p {padding-left: 110px;} .agency-block span.signin {font-size: 32px;color: #373737;line-height: 38px;letter-spacing: 3px;font-family: 'Dawning of a New Day', cursive; padding-top: 45px; position: relative; float: right;} @media screen and (max-width:1200px) { .about-right-text p {padding-left: 85px;} .clients img {margin: 0px 15px;} .style2 .adress-row {text-align: left;} } @media screen and (max-width: 992px) { .clients img {margin: 0px 40px;} .about-right-text p {padding-left: 0px;} .about-text {padding: 25px 30px;} } @media screen and (max-width: 768px) { .about-right-text {text-align: left;} } @media screen and (max-width: 480px) { .header-title h4 {font-size: 16px;} .logo a {font-size: 24px;} .logo h6 {font-size: 6px;} .clients {padding-bottom: 0px;} .about-text {padding: 25px 0px;} } /*-------------------------------------------------------------------------------------------------------------------------------*/ /* 03-04 - CONTACT */ /*-------------------------------------------------------------------------------------------------------------------------------*/ .left-contact-block {position: relative; float: left; width: 100%; padding-top: 90px; padding-left: 40px;} .left-contact-block h4 {padding-bottom: 20px;} .left-contact-block p {color: #9C9C9C; padding-bottom: 20px; padding-right: 80px;} .left-contact-block i {letter-spacing: 1px;color: #9C9C9C;font-family: open-sans,sans-serif;padding-bottom: 40px; position: relative; float: left;} .adress-row {position: relative; float: left; width: 100%;padding: 15px 0px 20px 50px;} .adress-row i {padding-bottom: 0px;} .adress-row h5 {font-size: 15px; padding-bottom: 10px;} .adress-row a {font-size: 13px;color: #9C9C9C;line-height: 21px;font-family: open-sans,sans-serif;font-weight: 300;font-style: italic;} .adress-row a:hover {color: #CC6600;} .right-contact-block {position: relative; float: left; width: 100%; padding-top: 90px; padding-left: 40px;} .right-contact-block h3 {text-align: right; letter-spacing: 2px; padding-right: 40px; padding-bottom: 20px;} .style2 .input-field {position: relative; float: left; width: 100%; padding-right: 40px; padding-top: 25px; margin-left: 0px;} .style2 form {padding-top: 0px;} .input-field input {width: 100%; height: 40px; background: #fff;padding: 6px;line-height: 28px;font-size: 11px;color: #696969; text-align: left;font-family: open-sans,sans-serif;font-weight: 400; border: 0px none;} .input-field textarea {width: 100%;height: 160px; background: #fff;padding: 6px;line-height: 28px;font-size: 11px;color: #696969; text-align: left;font-family: open-sans,sans-serif;font-weight: 400; border: 0px none;} .send-button {position: relative; float: left; width: 100%; text-align: center;} .send-button .send {background: #262626; width: 130px; height: 50px; position: relative; float: left; display: inline-block; color: #fff; font-size: 16px; font-weight: 600; border: none; outline: none; margin: 40px 0px 85px 0px;transition: all 0.3s ease-in; -moz-transition: all 0.3s ease-in;-o-transition: all 0.3s ease-in;-webkit-transition: all 0.3s ease-in;-ms-transition: all 0.3s ease-in;} .send-button .send:hover {background: #CC6600;} .site-map {position: relative; float: left; width: 100%; height: 250px; margin-bottom: 20px;} .site-map iframe {width: 100%; height: 250px; border: 0px none; outline: none;} div.wpcf7-validation-errors {clear: both;border: 1px solid red;padding: 10px;box-sizing: border-box;} div.wpcf7-mail-sent-ok {clear: both;padding: 10px;border: 1px solid #398f14;} .align-left{text-align:left;} .align-right{text-align:right;} .align-center{text-align:center;} body .wpb_gmaps_widget .wpb_wrapper{padding:0; border:none;} .contactform {position: relative;clear: both;float: left;width: 100%;} .contactform h1, .contactform h2, .contactform h3, .contactform h4, .contactform h5, .contactform h6 {margin-bottom: 30px;} .vc_col-sm-12:before, .vc_col-sm-12:after {content: '';display: table;width: 100%;clear: both;position: relative;} @media screen and (max-width: 992px) { .left-contact-block {padding-top: 40px;} .right-contact-block {padding-top: 40px;} } @media screen and (max-width: 768px) { .adress-row {padding-left: 0px;} } @media screen and (max-width: 480px) { .left-contact-block {padding-left: 0px;} .right-contact-block {padding-left: 0px;} .style2 .input-field {padding-right: 0px;} .right-contact-block h3 {padding-right: 0px;} .send-button .send {float: none;} } /* Logged user */ .logged-in .header-right, .logged-in.style2 .nav-menu-icon, .logged-in.style3 header{margin-top:32px;}