/*STYLE.CSS*/
/*-------------------------------------------------------------------------------------------------------------------------------*/
/*This is main CSS file that contains custom style rules used in this template*/
/*-------------------------------------------------------------------------------------------------------------------------------*/
/* Template Name: Vor.*/
/* Version: 1.0 Initial Release*/
/* Build Date: 22-12-2014*/
/* Author: Unbranded.*/
/* Website: http://moonart.net.ua/vor/ 
/* Copyright: (C) 2014 */
/*-------------------------------------------------------------------------------------------------------------------------------*/
/*--------------------------------------------------------*/
/* TABLE OF CONTENTS: */
/*--------------------------------------------------------*/
/* 01 - LAYOUT INITIALIZATION & COLOR PRESETS */
/* 02 - MAIN */
/* 03 - ABOUT */
/* 04 - SERVICE*/
/* 05 - BLOG*/
/* 06 - POST*/
/* 07 - CONTACT*/
/* 08 - PORTFOLIO*/
/* 09 - GALLERY*/
/* 10 - FOOTER */
/* 11 - LAYOUT INITIALIZATION & COLOR PRESETS */
/*-------------------------------------------------------------------------------------------------------------------------------*/
@import url(http://fonts.googleapis.com/css?family=PT+Sans:400,700,400italic,700italic);
@font-face {
    font-family: 'baron_neue_boldbold';
    src: url('../fonts/baron_neue_bold-webfont.eot');
    src: url('../fonts/baron_neue_bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/baron_neue_bold-webfont.woff2') format('woff2'),
         url('../fonts/baron_neue_bold-webfont.woff') format('woff'),
         url('../fonts/baron_neue_bold-webfont.ttf') format('truetype'),
         url('../fonts/baron_neue_bold-webfont.svg#baron_neue_boldbold') format('svg');
    font-weight: normal;
    font-style: normal;
}

html {margin:0px; padding:0px; height:100%;}
body {margin:0px; padding:0px; font-size:100%; height:100%; width:100%; font-family: 'PT Sans', sans-serif; color:#222; background-color: #fff;}
.onload{opacity:0; -webkit-transition:All 300ms ease-in; -moz-transition:All 300ms ease-in;  -o-transition:All 300ms ease-in; -ms-transition:All 300ms ease-in; transition:All 300ms ease-in;}
.onload.loaded{opacity:1;}
.loader {position:fixed; left:0px; top:0px; width:100%; height:100%; z-index:6000; background:#fff; text-align: center;}
.animation-stop{-webkit-transition:none !important; -moz-transition:none !important;  -o-transition:none !important; -ms-transition:none !important; transition:none !important;}
.loader img {position: absolute; top: 50%; left: 50%; width: 150px; height: 135px; margin-top: -68px; margin-left: -75px;}
a {text-decoration:none; outline:none; 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;}
a:hover {text-decoration: none;}
a img{border: 0px none;}
a:hover {outline: none;}
a:active {outline: none; text-decoration: none;}
a:focus {outline: none; outline-offset: 0px; text-decoration: none;}
.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:#222;}
::-moz-placeholder          {color:#222;}
:-moz-placeholder           {color:#222;}
:-ms-input-placeholder      {color:#222;}
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;}
/*------------------------------------------------------*/
/*----------------------BACKGROUND----------------------*/
.bg{position:absolute; left:0px; top:0px; width:100%; height:100%; overflow:hidden;}
.bg img{position:absolute;}
.bg video{position:absolute;}
.bg-bg{background-position: 50% 0px; background-repeat: no-repeat; background-attachment: fixed; -webkit-background-size: cover;-moz-background-size: cover; -o-background-size: cover; background-size: cover; transition-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1);}
.bg-bg-bag {background-attachment: scroll;background-origin: initial;background-clip: initial;background-size: cover;background-repeat:no-repeat;background-position:50% 0;position:relative;}
.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:relative;}
.bg-bg-chrome.act{position: absolute;}
.clip{clip: rect(auto, auto, auto, auto); height: 100%; position: absolute; width: 100%;}
/*-----------------------------------------------------*/
.full-width {position:relative; float:left; width:100%;}
.full-height {height:100vmin; position:relative; float:left;}
.vertical-center{-webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%);}
.vertical-align{-webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); top:50%;}
.center_img{position: absolute;}
.swiper-container{margin:0 auto;position:relative;overflow:hidden;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-ms-backface-visibility:hidden;-o-backface-visibility:hidden;backface-visibility:hidden;z-index:1;}.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;}

h1 {font-weight: 700; font-size: 72px; line-height:80px; color:#101012; border-radius: 20px; font-family: 'baron_neue_boldbold'; text-transform: uppercase; text-align: center;}
h2 {font-size: 24px; line-height: 36px; text-transform: uppercase; font-weight: 700; font-family: 'baron_neue_boldbold';}
h3 {font-size: 15px; line-height: 24px; color:#101012; text-transform: uppercase; font-weight: 700;}
h4 {font-size: 14px; line-height: 30px; text-transform: uppercase; font-weight: 700;}
h5 {font-size: 13px; line-height: 24px; text-transform: uppercase; font-weight: 700;}
h6 {font-size: 12px; line-height: 26px; text-transform: uppercase; font-weight: 400;}
i {font-weight: 400; font-size: 13px; line-height: 60px; text-transform: uppercase; font-style: normal;}
p {font-weight: 400; font-size: 15px; line-height: 24px; color:#101012;}
b {font-weight: 700; text-transform: uppercase;}
ul {color: #101012; font-size: 14px; line-height: 26px;}
ul li a:hover {text-decoration: none; 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;}
small {font-weight: 400; font-size: 12px; line-height: 28px; color:#fff;}
q {font-size: 18px; line-height: 28px; font-weight: 700;}
input {background: none; border: none; font-size: 13px; line-height: 24px; font-weight: 700; text-transform: uppercase;}
textarea {background: none; resize: none; border: none; font-size: 13px; line-height: 24px; color:#101012; font-weight: 700; text-transform: uppercase;}
iframe {border: none;}
.white-color {color: #fff;}
.main-color {color: #6cd5cc;}
textarea::-moz-placeholder {opacity: 1!important; color:#101012;}
textarea::-webkit-placeholder {opacity: 1!important; color:#101012;}
input:invalid {border:none; outline: none; box-shadow:none;}
/*------------------------------------------------------*/
/*-----------------------button-------------------------------*/
.main-button {height: 89px; text-align: center; position: relative; width: auto; float: left; margin-right: 30px;}
.main-button img {position: relative; width: 89px; height: 89px; float: left; margin: 0px 30px 0px 0px; transition: all 0.3s ease-in 0.1s; -moz-transition: all 0.3s ease-in 0.1s;-o-transition: all 0.3s ease-in 0.1s;-webkit-transition: all 0.3s ease-in 0.1s;-ms-transition: all 0.3s ease-in 0.1s;}
.button-one {background: #fff; border: 1px solid #101012; border-radius: 20px; height: 40px; top: 24px; position: absolute; width: 100%; transition: all 0.3s ease-in 0.1s; -moz-transition: all 0.3s ease-in 0.1s;-o-transition: all 0.3s ease-in 0.1s;-webkit-transition: all 0.3s ease-in 0.1s;-ms-transition: all 0.3s ease-in 0.1s;}
.button-one a {line-height: 40px; padding: 0px 15px; font-size: 13px; text-transform: uppercase; font-weight: 700; color:#101012; transition: all 0.3s ease-in 0.1s; -moz-transition: all 0.3s ease-in 0.1s;-o-transition: all 0.3s ease-in 0.1s;-webkit-transition: all 0.3s ease-in 0.1s;-ms-transition: all 0.3s ease-in 0.1s;}
.main-button:hover .button-one {background: #7bd9d1; border: 1px solid #7bd9d1;}
.main-button:hover .button-one a {color:#fff;}
.main-button:hover img {transform: rotate(-90deg);-webkit-transform: rotate(-90deg);-moz-transform: rotate(-90deg);-o-transform: rotate(-90deg);-ms-transform: rotate(-90deg);}
/*------------------------------------------------------*/
/*-----------------------header#1-------------------------------*/
.menu-mobile-icon {position: relative; width: 100%; float: left; display: none; text-align: center; padding-top:0px; background: #7bd9d1; width: 100%; height: 81px; padding-top: 30px; 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;}
.menu-mobile-icon .slide-icon {position: absolute; right: 20px; top:85px; z-index: 8; 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;}
.close-menu {font-size: 46px; color:#fff; position: relative; cursor: pointer; display: none!important;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 {position: absolute; width: 100%; margin: 0px auto; text-align: center; top: 0px; left: 0px; z-index: 5000;}
.header .navigation {position: relative; height: 190px; margin: 0 auto; float: none; display: inline-block; width: 100%; max-width: 1170px;}
.nav-link {position: relative; float: left; margin-right: 45px;}
.logo {position: relative; float: left; width: 72px; padding-top: 40px; margin-left: 20px;}
nav {position: relative; float: right; padding-top: 50px;}
nav a {font-size: 17px; line-height: 27px; color: #fff; position: relative; float: left;}
.main-link {margin: 5px 30px;}
.header-opacity.header nav .main-link {color:#fff; background: none; border-bottom: 2px solid rgba(255,255,255,0); transition:all 0.35s ease-in;-webkit-transition:all 0.35s ease-in;-moz-transition:all 0.35s ease-in;-o-transition:all 0.35s ease-in;-ms-transition:all 0.53s ease-in;}
.header-opacity.header nav .main-link:hover {border-bottom: 2px solid #6cd5cc; color: #6cd5cc;}

.wrap-menu-fix {position: absolute; top:0; margin-top: 30px; margin-bottom: 30px; bottom: 0px; width: 100%; overflow:auto; -webkit-overflow-scrolling: touch; -moz-overflow-scrolling: touch; -o-overflow-scrolling: touch;-ms-overflow-scrolling: touch; overflow-scrolling: touch;}

.down-arrow.act {color:#fff;}

.home-option {position: relative; display: block; float: left;}
.drop-span-home {position: absolute; left: 0px; top: 30px; opacity: 0; display: none; width: 120px;padding: 10px 0px; text-align: center; z-index: 500;}
.drop-span-home a {position: relative; float: none; display: inline-block; padding: 5px 0px; color: #fff; width: 100%; font-size: 15px;}
.drop-span-home a:hover {color:#6cd5cc;}
.home-option:hover .down-arrow{color: #6cd5cc;}
.drop-span-home.slide-submenu {opacity: 1; display: block;}

.down-arrow {font-size: 27px; color:#fff; position: absolute; top:2px; right: -28px; cursor: pointer; transition:all 0.35s ease-in;-webkit-transition:all 0.35s ease-in;-moz-transition:all 0.35s ease-in;-o-transition:all 0.35s ease-in;-ms-transition:all 0.53s ease-in;}
.portfolio-option {position: relative; display: block; float: left;}
.drop-span-portfolio {position: absolute; left: 10px; top: 30px; opacity: 0; display: none; width: 120px; padding: 10px 0px; text-align: center; z-index: 500;}
.drop-span-portfolio a {position: relative; float: none; display: inline-block; padding: 5px 0px; color: #fff; width: 100%;}
.drop-span-portfolio a:hover {color:#6cd5cc;}
.portfolio-option:hover .down-arrow {color: #6cd5cc;}
.drop-span-portfolio.slide-submenu {opacity: 1; display: block;}

.pages-option {position: relative; display: block; float: left;}
.drop-span-pages {position: absolute; left: 0px; top: 30px; opacity: 0; display: none; width: 120px;padding: 10px 0px; text-align: center; z-index: 500;}
.drop-span-pages a {position: relative; float: none; display: inline-block; padding: 5px 0px; color: #fff; width: 100%; font-size: 15px;}
.drop-span-pages a:hover {color:#6cd5cc;}
.pages-option:hover .down-arrow{color: #6cd5cc;}
.drop-span-pages.slide-submenu {opacity: 1; display: block;}

.share {float: right; position: relative; margin-top: -20px; margin-right: 25px;}
.share a {position: relative; float: left;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;}
.share a:nth-child(2n+1) {margin-left: -34px; z-index: 5;}
.share a:nth-child(2n) {margin-left: -34px; z-index: 5;}
.share a:nth-child(2n+1):hover {transform: scale(1.1) translateY(5px);}
.share a:nth-child(2n):hover {transform: scale(1.1) translateY(-5px);}

.header-color.header nav .main-link.hover {border-bottom: 2px solid #fff; color:#fff;}
.header-color.header nav .down-arrow.hover {color:#6cd5cc;}
.header-opacity.header nav .main-link.hover {border-bottom: 2px solid #6cd5cc; color:#6cd5cc;}
.header-opacity.header nav .down-arrow.hover {color:#6cd5cc;}
.drop-span-pages .main-link.hover {border-bottom: 2px solid #fff; color:#fff;}

/*color header*/

.header-color.header {background: #6cd5cc; position: relative;}
.header-color.header nav .main-link {color:#fff; background: none; border-radius: 0px; border-bottom:2px solid rgba(255,255,255,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;}
.header-color.header nav .main-link:hover {border-bottom: 2px solid #fff;}

.header-color .home-option:hover .down-arrow {color: #fff;}
.header-color .drop-span-home {background: #6cd5cc; top: 40px;}
.header-color .drop-span-home a:hover {color:#168b81;}

.header-color .portfolio-option:hover .down-arrow {color: #fff;}
.header-color .drop-span-portfolio {background: #6cd5cc; top: 40px;}
.header-color .drop-span-portfolio a:hover {color:#168b81;}

.header-color .pages-option:hover .down-arrow{color: #fff;}
.header-color .drop-span-pages {background: #6cd5cc; top: 40px; width: 105px;}
.header-color .drop-span-pages a:hover {color:#168b81;}

.header-color.orange .home-option:hover .down-arrow {color: #fff;}
.header-color.orange .drop-span-home {background: #fc8353; top: 40px;}
.header-color.orange .drop-span-home a:hover {color:#c74b1a;}

.header-color.orange .portfolio-option:hover .down-arrow {color: #fff;}
.header-color.orange .drop-span-portfolio {background: #fc8353; top: 40px;}
.header-color.orange .drop-span-portfolio a:hover {color:#c74b1a;}

.header-color.orange .pages-option:hover .down-arrow{color: #fff;}
.header-color.orange .drop-span-pages {background: #fc8353; top: 40px; width: 105px;}
.header-color.orange .drop-span-pages a:hover {color:#c74b1a;}

/*------------------------------------------------------*/
@media screen and (max-width: 990px) {
    .nav-link {float: none; margin-right: 0px;}
    .nav-link a {padding: 15px 0px;}
    .logo {position: absolute; top: 20px; left: 20px; padding-top: 0px;}
    .menu-mobile-icon .menu-hide {display: block;}
    .menu-mobile-icon .slide-icon {top:32px;}
     nav {position: fixed; left: 0px; top: 0px; padding-top: 30px;  width: 100%; background: #7bd9d1; transform: translateY(-100%); -moz-transform: translateY(-100%);-webkit-transform: translateY(-100%);-o-transform: translateY(-100%);-ms-transform: translateY(-100%);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;}
     nav.active {transform: translateY(0px); -moz-transform: translateY(0px); -webkit-transform: translateY(0px); -o-transform: translateY(0px); -ms-transform: translateY(0px);z-index: 5; height: 100%; width: 100%;}
     nav a {display: block;text-align: center;float: none;}
    .menu-hide {display: block;}
    .menu-show {display: none;}
    .share a {float: left;}
    .header .navigation {width: 100%; max-width: 100%; text-align: center;position: fixed; left: 0; top: 0; height: 81px;}
    .share {float: none; display: inline-block; position: relative; padding-top: 50px; padding-left: 40px; margin-right: 0px;}
    .close-menu {display: inline-block!important;}
    .header-color.header nav .main-link.hover {border: 0px none; color:#fff;}
    .header-opacity.header nav .main-link.hover {border: 0px none; color:#168b81;}  
    .header-color.header nav .main-link:hover {border: 0px none;}
    
    .portfolio-menu nav {transform: translateY(0px); -moz-transform: translateY(0px); background: none;}
    .portfolio-menu .portfolio-option {max-width: 100%; display: block;}
    .portfolio-menu .pages-option {max-width: 100%; display: block;}
    .portfolio-menu .home-option {max-width: 100%; display: block;}
    .portfolio-menu .pages-option .pg-arrow {margin-left: 0px;}
    .portfolio-menu .home-option .h-arrow {margin-left: 0px;}
    .portfolio-menu .portfolio-option .p-arrow {margin-left: 0px;}
    .portfolio-menu .share {padding-top: 0px; padding-left: 0px;}
    
    .header-style-2 nav {transform: translateY(0px); -moz-transform: translateY(0px); background: none;}
    .header-style-2 .portfolio-option {max-width: 100%; display: block;}
    .header-style-2 .pages-option {max-width: 100%; display: block;}
    .header-style-2 .home-option {max-width: 100%; display: block;}
    .header-style-2 .pages-option .pg-arrow {margin-left: 0px;}
    .header-style-2 .home-option .h-arrow {margin-left: 0px;}
    .header-style-2 .portfolio-option .p-arrow {margin-left: 0px;}
    .header-style-2 .share {padding-top: 0px; padding-left: 0px;}
    
    .down-arrow {right: auto; top: 15px;}
    
    .home-option {float: none; max-width: 120px; display: inline;}
    .drop-span-home {position: relative; float: none; border: 0px none; top: 0px; left: 4px; padding: 0px;}
    .drop-span-home a {color:#fff; font-size: 14px;}
    .drop-span-home a:hover {color: #168b81;}
    .home-option:hover .down-arrow {color:#168b81;}
    .home-option .p-arrow  {top: 15px; right: auto;}
    
    .pages-option {float: none; display: inline;}
    .drop-span-pages {position: relative; float: none;border: 0px none; top: 0px; left: 4px;}
    .drop-span-pages a {color:#fff; font-size: 14px;}
    .drop-span-pages a:hover {color: #168b81;}
    .pages-option:hover .down-arrow {color:#168b81;}
    .pages-option .pg-arrow {top: 15px; right: auto;margin-left: 39px;}
    
    .portfolio-option {float: none; max-width: 120px; display: inline;}
    .drop-span-portfolio {position: relative; float: none; border: 0px none; top: 0px; left: 4px; padding: 0px;}
    .drop-span-portfolio a {color:#fff; font-size: 14px;}
    .drop-span-portfolio a:hover {color: #168b81;}
    .portfolio-option:hover .down-arrow {color:#168b81;}
    .portfolio-option .p-arrow  {top: 15px; right: auto;}
    
    .header-color .home-option:hover .down-arrow{color: #168b81;}
    .header-color .drop-span-home {background: none; top: 0px; width: 120px; left: 4px;}
    .header-color .drop-span-home a {color:#fff;}
    .header-color .drop-span-home a:hover {color:#168b81;}
    
    .header-color .portfolio-option:hover .down-arrow {color: #168b81;}
    .header-color .drop-span-portfolio {background: none; top: 0px; left: 4px;}
    .header-color .drop-span-portfolio a {color:#fff;}
    .header-color .drop-span-portfolio a:hover {color:#168b81;}

    .header-color .pages-option:hover .down-arrow{color: #168b81;}
    .header-color .drop-span-pages {background: none; top: 0px; width: 120px; left: 4px;}
    .header-color .drop-span-pages a {color:#fff;}
    .header-color .drop-span-pages a:hover {color:#168b81;}
    
    .header-color.orange .home-option:hover .down-arrow {color: #c74b1a;}
    .header-color.orange .drop-span-home {background: none; top: 0px; left: 4px;}
    
    .header-color.orange .portfolio-option:hover .down-arrow {color: #c74b1a;}
    .header-color.orange .drop-span-portfolio {background: none; top: 0px; left: 4px;}

    .header-color.orange .pages-option:hover .down-arrow{color: #c74b1a;}
    .header-color.orange .drop-span-pages {background: none; top: 0px; width: 105px; left: 4px;}
    .header-opacity.header nav .down-arrow.hover {color: #fff;}
}
/*------------------------------------------------------*/
/*-----------------------header#2-------------------------------*/

.header-style-2 nav {position: relative; float: none; width: 100%; height: 100%;}
.header-style-2 .menu-popup .nav-link {display: inline-block; width: 100%; float: none; position: relative; margin-right:0px; top: 50px; padding-bottom: 100px;}
.header-style-2 .menu-popup nav a {color:#101012; font-size: 20px;}
.header-style-2 .header {height: 100%; background: rgba(255,255,255,0.9);} 
.header-style-2 .share {position: relative; float: none; display: inline-block;margin-left: 80px; margin-right: 0px;}
.header-style-2 .home-option {width: 100%;}
.header-style-2 .pages-option{width: 100%;}
.header-style-2 .close-menu {display: none!important;}
.header-style-2 .portfolio-option{width: 100%;}
.header-style-2 .portfolio-top-baner {position: absolute; top: 0; left: 0;}
.header-style-2 .header-color.header nav .main-link {border: 0px none; color:#101012; font-size: 26px; padding: 15px 0px;}
.header-style-2 .header-color.header nav .main-link:hover {color: #6cd5cc;}
.header-style-2 .top-close {font-size: 90px; color:#101012; position: relative; float: right; cursor: pointer; width: 90px; height: 90px; z-index: 555; margin-top: -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;}
.header-style-2 .top-close:hover {color:#6cd5cc;}
.header-style-2 .drop-span-portfolio {position: relative; float: none; border: 0px none; top: 0px; left: 25px; font-size: 32px; background: none; padding: 0px;}
.header-style-2 .drop-span-portfolio a {padding: 15px 0px;}
.header-style-2 .drop-span-pages {position: relative; float: none; border: 0px none; top: 0px; left: 25px; font-size: 32px; background: none; padding: 0px;}
.header-style-2 .drop-span-pages a {padding: 15px 0px;}
.header-style-2 .drop-span-home {position: relative; float: none; border: 0px none; top: 0px; left: 25px; font-size: 32px; background: none; padding: 0px;}
.header-style-2 .drop-span-home a {padding: 15px 0px;}
.header-style-2 .down-arrow {color:#101012; position: absolute; width: 30px; height: 30px; font-size: 26px; font-weight: 700; top: 18px; right: -30px;}
.header-style-2 .down-arrow:hover {color:#6cd5cc;}
.header-style-2 .header-color .home-option:hover .down-arrow {color:#6cd5cc;}
.header-style-2 .header-color .pages-option:hover .down-arrow {color:#6cd5cc;}
.header-style-2 .header-color .portfolio-option:hover .down-arrow {color:#6cd5cc;}

.menu-popup {position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; z-index: 500;-webkit-transform: translateY(100%);-moz-transform: translateY(100%);-ms-transform: translateY(100%);transform: translateY(100%);
opacity: 0; transition:all 0.4s ease-in;-webkit-transition:all 0.4s ease-in;-moz-transition:all 0.4s ease-in;-o-transition:all 0.4s ease-in;-ms-transition:all 0.4s ease-in;}

.menu-popup.act {opacity: 1;-webkit-transform: translateY(0%);-moz-transform: translateY(0%);-ms-transform: translateY(0%);transform: translateY(0%);}
.header-style-2 .menu-drop {position: absolute; right: 70px; top: 30px; z-index: 100000;}

.header-style-2 .wraper-link {position: relative; width: 100%; text-align: center; float: left;}
.header-style-2 .wraper-link .main-link {position: relative; float: none; display: inline-block; left: 20px;}

.header-container {margin:0 auto;position:absolute;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-ms-backface-visibility:hidden;-o-backface-visibility:hidden;backface-visibility:hidden; text-align: center; width: 100%; height: 450px; top: 50%; transform: translateY(-50%); text-align: center; margin-top: 81px;}

.top-baner-slide {position: relative; float: left; width: 100%; text-align: center;}
.top-baner-slide .main-button {position: relative; float: none; display: inline-block;}
.top-baner-slide h1 {color:#fff; font-size: 90px; text-transform: uppercase; line-height: 80px;}
.top-baner-slide p {color:#fff; padding: 15px 0px 45px;}
.top-baner-slide .button-one {border: 1px solid #fff;} 

/*-----------------------header#3-------------------------------*/
.top-baner-title {position: absolute; top: 50%; transform:translateY(-50%); width: 100%; height: 150px; margin-top: 46px;}
.top-baner-title h1 {font-size: 90px; line-height: 80px; color:#101012;}
.header-style-3 .header {background: #fff; height: 96px;}
.header-style-3 .header-opacity.header nav .main-link {color:#101012;}
.header-style-3 .header-opacity.header nav .main-link:hover {border: 0px none; color:#6cd5cc;}
.header-style-3 nav {padding-top: 28px;}
.header-style-3 .share {margin-top:-10px;}
.header-style-3 .header-color.header nav .main-link.hover {border: 0px none;}
.header-style-3 .header-opacity.header nav .main-link.hover {border: 0px none; border-bottom: 2px solid #101012;}
.header-style-3 .drop-span-pages .main-link.hover {border: 0px none;}
.header-style-3 .header-opacity.header nav .main-link {border: 0px none;}
.header-style-3 .header-opacity.header nav .main-link:hover {border: 0px none; border-bottom: 2px solid #6cd5cc;}
.header-style-3 .down-arrow {color:#101012;}
.header-style-3 .logo {margin-top: -10px;}
.header-style-3 .drop-span-pages {background: #fff;top: 35px;}
.header-style-3 .drop-span-pages a {color:#101012; padding:8px 0px;}
.header-style-3 .drop-span-pages a:hover {color:#6cd5cc;}
.header-style-3 .drop-span-portfolio {left: 10px; background: #fff; top: 35px;}
.header-style-3 .drop-span-portfolio a {color:#101012;padding:8px 0px;}
.header-style-3 .drop-span-portfolio a:hover {color:#6cd5cc;}
.header-style-3 .drop-span-home {background: #fff;top: 35px;}
.header-style-3 .drop-span-home a {color:#101012;padding:8px 0px;}
.header-style-3 .drop-span-home a:hover {color:#6cd5cc;}
.header-style-3 .menu-mobile-icon {background: #fff;}
@media screen and (max-width: 990px) {
   .header-style-3 .logo {margin-top: 10px;} 
   .header-style-3 .menu-mobile-icon .slide-icon {top: 39px;}
   .header-style-3  nav {background: #fff;}
   .header-style-3 .close-menu {color:#101012;}
}
/*------------------------------------------------------*/
/*-----------------------pagination-------------------------------*/
.pagination {text-align: center; position: absolute; left:0; top: 0px; width: 100%; z-index: 120;}
.swiper-pagination-switch {cursor: pointer; width: 10px; height: 10px; border: 1px solid #b8b8b8; border-radius: 5px; position: relative; float: none; display: inline-block; margin: 0px 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: 11px; height: 10px; background: url(../img/x.png) no-repeat; border: none;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;}
/*------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------------------------------------------*/
/* 02 - MAIN */
/*-------------------------------------------------------------------------------------------------------------------------------*/
.main-baner {position: relative; float: left; width: 100%; overflow: hidden; height: 100%;}

.crafter {text-align: center;}
.crafter h1 {padding: 103px 0px 68px;}
.crafter p {max-width: 750px; margin: 0px auto;}

.crafter-wrap {position: relative; width: 100%; height: 100%; overflow: hidden;}
.crafter-wrap a {position:absolute; width: 100%; height: 100%; z-index: 5;}

.slider-craft {width: 100%; position: relative; float: left; margin-top: 115px; overflow: hidden;}
.crafter-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; text-align: center; width: 100%; height: 450px;}
.crafter-container .swiper-slide img {width: 150%; height: auto;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;}
.crafter-container .swiper-slide:hover img {margin-left:-35%;}
.crafter-container .swiper-slide, .crafter-container .swiper-wrapper {height: auto!important;}
.crafter-container .swiper-wrapper {overflow: hidden;}

.skew-top {position: absolute; top: 0px; left: 0px; z-index: 100; width: 100%;}
.skew-top img {width: 100%; height: auto;}
.skew-bottom {position: absolute; bottom: 0px; left: 0px; z-index: 100; width: 100%;}
.skew-bottom img {width: 100%; height: auto;}

.service {position: relative; float: left; width: 100%; overflow: hidden; padding-bottom: 100px;}
.service h1 {text-align: center; padding-bottom: 70px; margin-top: 105px;}
.some-text {position: relative; width: 100%;  border-bottom: 1px solid #e4e4e4; padding-bottom: 27px;}
.some-text p {padding-bottom: 27px;}
.more-info {position: relative; width: 100%;  border-bottom: 1px solid #e4e4e4; padding: 15px 0px 22px;}
.more-info a {color:#101012; }
.more-info h4 {padding-top: 6px;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;}
.more-info .arrow-next {float: right; font-size: 24px; margin-top: -27px; font-weight: 700; 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;}
.more-info:hover .arrow-next{color: #6cd5cc; margin-right: 5px;} 
.more-info:hover a {color:#6cd5cc;}
.more-info:hover .icon-font {color: #6cd5cc; margin-left: 3px;}
.icon-font {font-size: 42px; float: left; margin-right: 30px; 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;}
.theme-buy {position: relative; float: left; width: 100%; margin-top: 30px;}


.block-service {position: relative; float: left; width: 100%; margin-left: 50px; margin-bottom: 50px;}
.block-service h3 {padding: 15px 0px;}
.block-service p {padding-right: 20px;}

.romb-number {position: absolute; top: 12px; left: -50px; width: 36px; height: 36px; background: #fff; border:1px solid #101012; transform: rotate(45deg);-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);-o-transform: rotate(45deg);-ms-transform: rotate(45deg);}
.romb-number span {font-size: 14px; font-weight: 700; color:#101012; position: absolute; left: 8px; top: 8px;transform: rotate(-45deg);-webkit-transform: rotate(-45deg);-moz-transform: rotate(-45deg);-o-transform: rotate(-45deg);-ms-transform: rotate(-45deg);}
.journal {position: relative; float: left; width: 100%; background: #6cd5cc; overflow: hidden;}
.journal h1 {padding-top: 175px;}
.journal .skew-bottom {bottom: 0px;}

.filter-button {position: relative; width: 100%; height: 55px; text-align: center; margin: 45px 0px 90px;}
.filter-button a {float: none; color:#fff; text-transform: uppercase; text-shadow: 1px 2px 2px rgba(0,0,0,0.13); font-size: 13px; line-height: 24px; margin: 0px 30px; font-weight: 700;border-bottom: 2px solid rgba(255,255,255,0);border-top: 2px solid rgba(255,255,255,0); padding-top: 8px; padding-bottom: 3px;}
.filter-button a:hover {border-bottom: 2px solid #fff; border-top: 2px solid #fff; padding-top: 3px;}
.filter-button a.active {border-bottom: 2px solid #fff;}
.container-mix {z-index: 2000;}
.container-mix .mix {display: none;}

.drop {float: none; position: relative; display: none; margin-bottom:30px; margin-top: 40px; height: 40px; z-index:3000; width: 100%;}
.drop input[type="text"] {position:relative; width: 100%; height: 45px; background: #fff; padding-left: 15px; border: none; font-size: 13px; cursor: pointer; color: #101012; text-transform: uppercase; font-weight: 700;}
.drop .drop-list {position: absolute; right: 7px;top: 4px;font-size: 40px;color:#101012;}
.drop span {position:absolute; left:0px; top:0px; width:100%; display: none; z-index: 5000; background: #fff;}
.drop span a {color: #101012; background: #fff; font-size: 13px; font-weight: 700; float: left; position: relative; width: 100%;  height: 45px; text-decoration: none; text-align: left; padding: 13px 0 0 15px; 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; z-index: 4000; text-transform: uppercase;}
.drop span a:hover {background: #000; color:#fff;}

.bottom-points {position: absolute; left: 0; bottom: 32px; width: 100%; border: 1px solid #FFF;}
.romb-number-white {position: absolute; top: -21px; left: 50%; margin-left: -20px; width: 42px; height: 42px; background: #6cd5cc; border: 1px solid #fff; transform: rotate(45deg);-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);-o-transform: rotate(45deg);-ms-transform: rotate(45deg);}
.romb-number-white span {font-size: 14px; font-weight: 700; color:#fff; position: absolute; left: 13px; top: 12px;transform: rotate(-45deg);-webkit-transform: rotate(-45deg);-moz-transform: rotate(-45deg);-o-transform: rotate(-45deg);-ms-transform: rotate(-45deg);} 

.journal-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; padding-bottom: 110px;}
.journal-container .swiper-wrapper {height: 680px!important;}
.wrapper-jor {position: relative; float: left; height: 680px!important;}
.journal-block {position: relative; float: left; margin: 0px 15px; background: #fff;}
.blog-image {position: relative; width: 100%; overflow: hidden;}
.journal-block img {width: 100%; height: auto; transform: scale(1.1);-webkit-transform: scale(1.1); -moz-transform: scale(1.1);-o-transform: scale(1.1);-ms-transform: scale(1.1);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;}
.journal-block img:hover{transform: scale(1);-webkit-transform: scale(1); -moz-transform: scale(1);-o-transform: scale(1);-ms-transform: scale(1);}
.journal-block h3 {padding: 25px 40px 15px 30px;}
.journal-block p {padding: 0px 30px 15px 30px;}
.journal-block a {color:#101012;}
.journal-block a:hover {color:#6cd5cc;}
.journal-block .more {text-transform: uppercase; font-size: 13px; line-height: 24px; color: #b9b9b9; padding: 0px 0px 25px 30px; position: relative; float: left;}
.journal-block iframe {width: 100%; height: auto;}

.slider-prev {position: absolute; left: -30px; top: 50%; cursor: pointer; border: 1px solid #fff; width: 40px; height: 40px; background: none; background:#fff; box-shadow: 2px 2px 2px rgba(0,0,0,0.4); transform: rotate(45deg);-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);-o-transform: rotate(45deg);-ms-transform: rotate(45deg);}
.slider-prev span {font-size: 30px; font-weight: 700;  color:#101012; position: absolute; left: 3px; top:6px; transform: rotate(-45deg);-webkit-transform: rotate(-45deg);-moz-transform: rotate(-45deg);-o-transform: rotate(-45deg);-ms-transform: rotate(-45deg); 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;}
.slider-prev:hover {background: none;}
.slider-prev:hover span {color:#fff;}
.slider-next {position: absolute; right: -30px; top: 50%; cursor: pointer; border: 1px solid #fff; width: 40px; height: 40px; background: none; background:#fff; box-shadow: 2px 2px 2px rgba(0,0,0,0.4); transform: rotate(45deg);-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);-o-transform: rotate(45deg);-ms-transform: rotate(45deg);}
.slider-next span {font-size: 30px; font-weight: 700;  color:#101012; position: absolute; left: 3px; top:6px; transform: rotate(-45deg);-webkit-transform: rotate(-45deg);-moz-transform: rotate(-45deg);-o-transform: rotate(-45deg);-ms-transform: rotate(-45deg); 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;}
.slider-next:hover {background: none;}
.slider-next:hover span {color:#fff;}

.awards {position: relative; float: left; width: 100%; padding-bottom: 160px;}
.awards h1 {padding: 107px 0px 90px;}
.logo-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;}
.wrap-logo {text-align: center;}

.wrap-logo img {width: 100%; height: auto; 
-webkit-transition: all 1500ms cubic-bezier(0.320, 0, 0.000, 1); 
-webkit-transition: all 1500ms cubic-bezier(0.320, -0.600, 0.000, 1.650); 
   -moz-transition: all 1500ms cubic-bezier(0.320, -0.600, 0.000, 1.650); 
     -o-transition: all 1500ms cubic-bezier(0.320, -0.600, 0.000, 1.650); 
        transition: all 1500ms cubic-bezier(0.320, -0.600, 0.000, 1.650);

-webkit-transition-timing-function: cubic-bezier(0.320, 0, 0.000, 1);
-webkit-transition-timing-function: cubic-bezier(0.320, -0.600, 0.000, 1.650); 
   -moz-transition-timing-function: cubic-bezier(0.320, -0.600, 0.000, 1.650); 
     -o-transition-timing-function: cubic-bezier(0.320, -0.600, 0.000, 1.650); 
        transition-timing-function: cubic-bezier(0.320, -0.600, 0.000, 1.650);}
.wrap-logo h3 {padding-top: 25px;}
.wrap-logo a {font-size: 13px; line-height: 24px; text-transform: lowercase; color:#b9b9b9;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;}
.wrap-logo a:hover {color:#939393;}
.logo-container img.active {transform: rotateY(180deg);}

/*-------------------------------------------------------------------------------------------------------------------------------*/
/* 03 - ABOUT */
/*-------------------------------------------------------------------------------------------------------------------------------*/
.about-baner {position: relative; float: left; width: 100%; padding-bottom: 100px;}
.about-baner h1 {padding: 107px 0px 8px;}
.about-baner h3 {text-transform: capitalize; font-weight: 400; text-align: center;padding-bottom: 84px;}
.about-text {border-bottom: 1px solid #e4e4e4; padding-bottom: 115px;}
.about-text p {padding: 0px 5px 25px 0px;}
.about-text img {float: right; padding-top:23px; max-width: 100%; height: auto;}
.about-img {text-align: center; padding-bottom: 50px;}
.about-img img {max-width: 100%; height: auto;}
.info-list {position: relative; float: left; width: 100%; text-align: left;}
.info-list h3 {padding-bottom: 15px; text-align: left; text-transform: uppercase; font-weight: 700; padding-top: 53px;}
.info-list ul li {color: #101012; font-size: 14px; line-height: 26px;}
.gear-list {position: relative; float: left; width: 50%;}
.awards-list {position: relative; float: left; width: 50%;}
/*-------------------------------------------------------------------------------------------------------------------------------*/
/* 04 - SERVICE*/
/*-------------------------------------------------------------------------------------------------------------------------------*/
.services-baner {position: relative; float: left; width: 100%; padding-bottom: 146px;}
.services-baner h1 {padding: 107px 0px 77px; }
.services-baner .serv-icon {font-size: 60px; position: absolute; left: 0px; top: 30px;}
.services-info {position: relative; float: left; border-top: 1px solid #e4e4e4; border-bottom: 1px solid #e4e4e4; padding: 30px 0px; width: 100%;}
.services-info h4 {position: relative; float: left; padding-left: 80px;}
.services-text {position: relative; float: left; width: 100%; border-bottom: 1px solid #e4e4e4;  padding: 30px 0px 25px 80px;}
.step-by {position: relative; float: left; width: 100%;}
.step-by h2 {text-align: center; padding: 81px 0px 50px;}
.step .romb-number {position: absolute; left: 0px; top: 0px;}
.step h3 {padding-left: 45px; padding-top: 17px;}
.step p {padding-left: 45px; padding-top: 20px;}
/*-------------------------------------------------------------------------------------------------------------------------------*/
/* 05 - BLOG*/
/*-------------------------------------------------------------------------------------------------------------------------------*/
.blog-baner {position: relative; float: left; width: 100%; padding-bottom: 146px; text-align: center;}
.blog-baner .drop input[type="text"] {background: #6cd5cc; color:#fff;}
.blog-baner .drop .drop-list {color:#fff;}
.blog-baner h1 {padding: 107px 0px 37px;}
.filter-categories {position: relative; width: 100%; padding-bottom: 35px;}
.filter-categories a {color: #080808; font-size: 13px; line-height: 24px; font-weight: 700; text-transform: uppercase; margin: 0px 30px; padding-bottom: 3px;border-bottom: 2px solid rgba(255,255,255,0);border-top: 2px solid rgba(255,255,255,0); padding-top: 8px;}
.filter-categories a:hover {border-bottom: 2px solid #6cd5cc; border-top: 2px solid #6cd5cc; padding-top: 3px; color:#6cd5cc;}
.filter-categories a.active {border-bottom: 2px solid #6cd5cc; color:#6cd5cc;}

.blog-image {position: relative; width: 100%; height: 100%; overflow: hidden;}
.blog-block {position: relative; float: left; width: 100%; text-align: left; padding: 30px 0px 25px; border-bottom: 1px solid #e4e4e4; max-height: 800px; height: auto;}
.blog-block h2 {padding: 20px 0px 15px;}
.blog-block a {color: #101012;}
.blog-block a:hover {color:#6cd5cc;}
.blog-block img {width: 100%; height: auto; transform: scale(1.1);-webkit-transform: scale(1.1);-o-transform: scale(1.1);-ms-transform: scale(1.1);-moz-transform: scale(1.1);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;}
.blog-block:hover img{transform: scale(1);-webkit-transform: scale(1);-moz-transform: scale(1);-o-transform: scale(1);-ms-transform: scale(1);}
.layer {position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(108,2013,204,0.4); z-index: 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;}
.blog-block:hover .layer {opacity: 1;}

.info-line {position: relative; float: left; width: 100%; padding-top: 20px;}
.info-line h6 {padding-right: 15px; font-weight: 700;}
.date-info {float: left;}
.date-info h6:after {content: '/'; padding-left: 15px; color: #c6c6c6;}
.tags-info {float: left;}
.tags-info h6:after {content: '/'; padding-left: 15px; color: #c6c6c6;}
.author-info {float: left;}
.container-blog-mix {z-index: 2000;}
.container-blog-mix .mix {display: none;}
/*-------------------------------------------------------------------------------------------------------------------------------*/
/* 06 - POST*/
/*-------------------------------------------------------------------------------------------------------------------------------*/
.post-baner {position: relative; float: left; width: 100%; padding-bottom: 146px; text-align: center;}
.post-baner h1 {padding: 107px 0px 0px;}
.post-baner .info-line {position: relative; float: none; display: inline-block; text-align: center; width: auto; padding-top: 5px; padding-bottom: 50px;}
.post-baner .info-line a {color: #101012;}
.post-baner a:hover {color:#6cd5cc;}
.main-post {position: relative; float: left;}
.main-post img {width: 100%; height: auto;}
.post-text {position: relative; float: left; width: 100%; border-bottom: 1px solid #e4e4e4; padding: 35px 0px 40px;}
.post-text p {font-size: 14px; line-height: 22px; padding: 10px 0px; text-align: left;}

.comments-wrap {position: relative; float: left; width: 100%; text-align: left; padding-top: 50px;}
.comments-wrap h2 {padding-bottom: 10px;}
.comments {position: relative; float: left; padding: 30px 0px 30px 100px; border-bottom: 1px solid #e4e4e4;}
.comments img {position: absolute; left: 0px;}
.comments p {font-size: 14px; line-height: 22px; padding-top: 5px;}
.name-wrap {position: relative; float: left; width: 100%; padding-bottom: 3px;} 
.name-wrap h4 {float: left;}
.name-wrap .reply {position: relative; float: right;}
.reply h6 {font-weight: 700;}
.reply a {color: #101012;}
.reply a:before {content: '/'; color:#c7c7c7; padding: 0px 15px;}

.form-wrap {position: relative; float: left; width: 100%; text-align: left; padding-top: 50px;}
.form-wrap input[type="email"], .form-wrap input[type="text"]  {border-bottom: 1px solid #27272b; padding-bottom: 20px; padding-top: 20px; color: #101012; width: 100%;}
.form-wrap textarea {border-bottom: 1px solid #27272b; padding-bottom: 20px; color:#101012; width: 100%; padding-top: 23px;}
.form-wrap .send-button {color: #101012;}
.form-wrap .send-button:hover {background: #101012; color:#fff; border: 1px solid rgba(255,255,255,0.1);}
.form-wrap h2 {padding-bottom: 20px;}
.form-post ::-webkit-input-placeholder{opacity: 1!important; color:#000;}
.form-post :-moz-placeholder{opacity: 1!important; color:#000;}
.form-post ::-moz-placeholder{opacity: 1!important; color:#000;}
.form-post :-ms-input-placeholder{opacity: 1!important; color:#000;} 
/*-------------------------------------------------------------------------------------------------------------------------------*/
/* 07 - CONTACT*/
/*-------------------------------------------------------------------------------------------------------------------------------*/
.contact-baner {position: relative; float: left; width: 100%; padding-bottom: 146px;} 
.contact-baner h1 {padding: 107px 0px 0px;}
.contact-baner .form-wrap {padding-top: 24px;}
.adress {position: relative; width: 100%; float: left; padding: 70px 0px 120px;}
.adress ul {position: relative; float: left; text-align: center; width: 50%;}
.adress ul li{font-size: 15px; line-height: 24px;}
.adress ul li a {color: #101012; border-bottom: 1px solid rgba(255,255,255,0); padding-bottom: 3px; 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;}
.adress ul li a:hover {border-bottom: 1px solid #6cd5cc; color: #6cd5cc;}
.map-canvas {position: relative; float: left; width: 100%; height: 422px;}
.form-wrap ::-webkit-input-placeholder{opacity: 1!important; color:#000;}
.form-wrap :-moz-placeholder{opacity: 1!important; color:#000;}
.form-wrap ::-moz-placeholder{opacity: 1!important; color:#000;}
.form-wrap :-ms-input-placeholder{opacity: 1!important; color:#000;} 
/*-------------------------------------------------------------------------------------------------------------------------------*/
/* 08 - PORTFOLIO*/
/*-------------------------------------------------------------------------------------------------------------------------------*/
.orange .menu-mobile-icon {background: #fc8353;}
.orange nav {background: #fc8353;}
.orange.header {background: #fc8353;}
.portfolio-baner {padding-bottom: 146px;}
.portfolio-baner .drop {margin-top: 140px;}
.portfolio-baner .drop input[type="text"]{background: #fc8353; color:#fff;}
.portfolio-baner .drop .drop-list {color:#fff;}

.portfolio-button {margin: 60px 0px 45px; position: relative; width: 100%; height: 55px; text-align: center;}
.portfolio-button a {color: #080808;border-bottom: rgba(255,255,255,0);border-top: rgba(255,255,255,0); padding: 8px 0px 3px;font-size: 13px; line-height: 24px; font-weight: 700; text-transform: uppercase; margin: 0px 30px;}
.portfolio-button a:hover {border-bottom: 2px solid #fc8353; border-top: 2px solid #fc8353; padding-top: 3px; color:#fc8353;}
.portfolio-button a.active {border-bottom: 2px solid #fc8353; color: #fc8353;}

.gallery {position: relative; width: 100%;}
.container-portfolio-mix {z-index: 2000;}
.container-portfolio-mix .mix {display: none;}
.work-wrap {position: relative; float: left; width: 100%; background: #fff; overflow: hidden;height: 100%; margin: 15px 0px;}
.work-wrap h2 {position: absolute; left: 20px; bottom: 10px; color:#fff; z-index: 555;transition: all 0.25s ease 0.05s;-webkit-transition: all 0.25s ease 0.05s;-moz-transition: all 0.25s ease 0.05s;-o-transition: all 0.25s ease 0.05s;-ms-transition: all 0.25s ease 0.05s;}
.work-wrap:hover h2{left: 40px;}
.work-wrap img {width: 100%; height: auto;transform: scale(1.1) translateX(10px);-webkit-transform: scale(1.1) translateX(10px);-moz-transform: scale(1.1) translateX(10px);-o-transform: scale(1.1) translateX(10px); transition: all 0.35s ease 0.15s;-webkit-transition: all 0.35s ease 0.15s;-moz-transition: all 0.35s ease 0.15s;-o-transition: all 0.35s ease 0.15s;-ms-transition: all 0.35s ease 0.15s;}
.work-wrap:hover img{transform: scale(1) translateX(0px);-webkit-transform: scale(1) translateX(0px);-moz-transform: scale(1) translateX(0px);-o-transform: scale(1) translateX(0px);-ms-transform: scale(1) translateX(0px);}
.work-wrap:hover .work:before {-webkit-transform: translate3d(0,0%,0);transform: translate3d(0,0%,0);-moz-transform: translate3d(0,0%,0);-o-transform: translate3d(0,0%,0);-ms-transform: translate3d(0,0%,0); opacity: 1; z-index: 1;}
.work {position: absolute;top: 0;left: 0;width: 100%;height: 100%; cursor: pointer;}
.work:before {position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: -webkit-linear-gradient(top, rgba(72,76,97,0) 0%, rgba(72,76,97,0.8) 75%);background: linear-gradient(to bottom, rgba(72,76,97,0) 0%, rgba(72,76,97,0.8) 75%);content: '';opacity: 0;
-webkit-transform: translateY(50%);transform: translateY(50%); -moz-transform: translateY(50%);-o-transform: translateY(50%);-ms-transform: translateY(50%);transition: all 0.35s ease 0.15s;-webkit-transition: all 0.35s ease 0.15s;-moz-transition: all 0.35s ease 0.15s;-o-transition: all 0.35s ease 0.15s;-ms-transition: all 0.35s ease 0.15s;}
.fancybox {position: relative; float: left; width: 100%; height: 100%; z-index: 5;}


.two_column_blog .gallery {overflow:hidden; width:100%;}
.two_column_blog .gallery .item {width: 50%; float: left; padding: 0px 15px;}
.two_column_blog .gallery .item img {max-width:100%; max-height:100%; display:block;}

.three_column_blog .gallery {overflow:hidden; width:100%;}
.three_column_blog .gallery .item {width: 33.3%; position: relative; float: left; padding: 0px 15px;}
.three_column_blog .gallery .item img {max-width:100%; max-height:100%; display:block;}

.four_column_blog .gallery {overflow:hidden; width:100%;}
.four_column_blog .gallery .item {width: 25%; position: relative; float: left; padding: 0px 15px;}
.four_column_blog .gallery .item img {max-width:100%; max-height:100%; display:block;}

/*================portfolio whith left menu==================================*/
.portfolio-menu .portfolio-top-baner {width: 100%; height: 96px; background: #fc8353;}
.portfolio-menu .menu-drop {position: absolute; top: 20px; right: 20px; cursor: pointer; width: 80px; height: 60px; z-index: 5000;}
.portfolio-menu .portfolio-top-baner .logo {margin-top: -10px;}
.portfolio-menu .portfolio-baner {padding-top: 110px;}
.portfolio-menu .filter-push img {display: none;}
.portfolio-menu .filter-push a {text-align: left; float: left;}
.portfolio-menu .filter-push {position: relative; float: left; width: 100%; margin: 10px 0px;}
.portfolio-menu .portfolio-button {margin: 0px 0px 45px; height:auto;}
.portfolio-menu .portfolio-button a {padding: 5px 0px 0px; margin: 0px 20px; border-bottom: 2px solid rgba(255,255,255,0);}
.portfolio-menu .portfolio-button a.active {border-bottom: 2px solid #fc8353; color: #fc8353;}
.portfolio-menu .portfolio-button a:hover {padding: 5px 0px 0px; border-top: 0px none; border-bottom: 2px solid #fc8353;}

.portfolio-menu .close-menu {display: none!important;}
.portfolio-menu nav {position: relative; float: none; width: 100%; height: 100%;}
.portfolio-menu .menu-popup .nav-link {display: inline-block; width: 100%; float: none; position: relative; margin-right:0px; top: 50px; padding-bottom: 100px;}
.portfolio-menu .menu-popup {z-index: 5000;}
.portfolio-menu .menu-popup nav a {color:#101012; font-size: 20px;}
.portfolio-menu .menu-popup nav a:hover {color:#fc8353;}
.portfolio-menu .header {height: 100%; background: rgba(255,255,255,0.9);} 
.portfolio-menu .share {position: relative; float: none; display: inline-block;margin-left: 40px; margin-right: 0px;}
.portfolio-menu .home-option {width: 100%; float: none; display: inline-block; position: relative;}
.portfolio-menu .pages-option {width: 100%; float: none; display: inline-block; position: relative;}
.portfolio-menu .portfolio-option{width: 100%; float: none; display: inline-block; position: relative;}
.portfolio-menu .header-color.header nav .main-link {border: 0px none; color:#101012; font-size: 26px; padding: 15px 0px;}
.portfolio-menu .header-color.header nav .main-link:hover {color: #fc8353;}
.portfolio-menu .top-close {font-size: 90px; color:#101012; position: relative; float: right; cursor: pointer; width: 90px; height: 90px; z-index: 555; margin-top: -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;}
.portfolio-menu .top-close:hover {color:#fc8353;}
.portfolio-menu .drop-span-portfolio {position: relative; float: none; border: 0px none; top: 0px; left: 10px; font-size: 32px; background: none; padding: 0px;}
.portfolio-menu .drop-span-portfolio a {padding: 15px 0px;}
.portfolio-menu .drop-span-pages {position: relative; float: none; border: 0px none; top: 0px; left: 10px; font-size: 32px; background: none; padding: 0px;}
.portfolio-menu .drop-span-pages a {padding: 15px 0px;}
.portfolio-menu .drop-span-home {position: relative; float: none; border: 0px none; top: 0px; left: 10px; font-size: 32px; background: none; padding: 0px;}
.portfolio-menu .drop-span-home a {padding: 15px 0px;}
.portfolio-menu .down-arrow {color:#101012; position: absolute; width: 30px; height: 30px; font-size: 26px; font-weight: 700;  right: -30px; top: 18px;}
.portfolio-menu .down-arrow:hover {color:#fc8353;}
.portfolio-menu .header-color .home-option:hover .down-arrow {color:#fc8353;}
.portfolio-menu .header-color .pages-option:hover .down-arrow {color:#fc8353;}
.portfolio-menu .header-color .portfolio-option:hover .down-arrow {color:#fc8353;}
.portfolio-menu .wraper-link {position: relative; width: 100%; text-align: center; float: left;}
.portfolio-menu .wraper-link .main-link {position: relative; float: none; display: inline-block; left: 0px;}

.hidden-title {display: none;}
.fancybox-title {position: absolute; left: 0px; bottom: -20px; padding: 20px 10px;}
.fancybox-title h3 {color: #fff; font-size:26px; line-height: 24px; padding-bottom: 10px; text-align: left; font-family: 'baron_neue_boldbold';}
.fancybox-title p {color: #fff; font-size: 16px; line-height: 24px; text-align: left; padding-bottom: 40px;}

/*-------------------------------------------------------------------------------------------------------------------------------*/
/* 09 - GALLERY*/
/*-------------------------------------------------------------------------------------------------------------------------------*/
.half-baner {position: relative; float: left; width: 50%; z-index: 5; height: 450px;}
.half-baner img {width:150%!important; height: auto!important; overflow: hidden;}
.half-image {position: relative; top: -15%;}

.half-image .half-baner:first-child {transform: skewY(6deg); transform-origin: 0% 50%; height: 450px;}
.half-image .half-baner:first-child img{transform: skewY(-6deg); margin-top: -15%;}
.half-image .half-baner:last-child {transform: skewY(-6deg); transform-origin: 100% 50%; height: 450px;}
.half-image .half-baner:last-child img {transform: skewY(6deg); margin-top: -15%;}

.full-image {margin-top: -14%;}
.full-baner {position: relative; width: 100%; overflow: hidden;}
.full-baner.top {margin-top: 0;}
.full-baner img {width: 100%; height: auto;}

.work a {position: relative; width: 100%; height: 100%; float: left; z-index: 5555;}

.half-baner .work:before {z-index: 555; top: -20%;}
.half-baner:hover .work:before {opacity: 1; cursor: default;}
.full-baner:hover .work:before {opacity: 1; cursor: default;} 
.top:hover .work:before {opacity: 1; cursor: default;}

.about-us {position: relative; text-align: center; float: left;}
.about-us h1 {padding: 85px 0px 65px;}
.about-us p {padding-bottom: 55px;}
.about-us .main-button {position: relative; float: none; display: inline-block; padding-bottom: 220px;}
.main-button:last-child {margin-right: 0px;}
.gallery-footer {padding-top: 70px;}
.skew-top .copyright {color:#878787; position: absolute; top: 0px; z-index: 110;}
/*-------------------------------------------------------------------------------------------------------------------------------*/
/* 10 - FOOTER*/
/*-------------------------------------------------------------------------------------------------------------------------------*/
footer {background: #101012; position: relative; float: left; padding-top: 95px; width: 100%; overflow: hidden;}
.footer-about {position: relative; float: left; width: 100%; background: #101012; border: 1px solid #27272b; padding: 30px; left: -35px; margin-top: -410px; max-height: 342px; }
.footer-about h2 {color:#fff; padding-bottom: 34px;} 
.footer-about p {color:#fff;}
.footer-about a {text-transform: uppercase; font-size: 13px; line-height: 24px; color: #b9b9b9; position: relative; float: left; margin: 20px 0px 0px -10px; border: 1px solid rgba(0,0,0,0); border-radius: 20px; padding: 5px 10px 3px;}
.footer-about a:hover {border: 1px solid #fff; color:#fff;}

.footer-contact {position: relative; float: left; width: 100%; background: #101012; border: 1px solid #27272b; padding: 30px; left: 35px; margin-top: -410px;}
.footer-contact h2 {color:#fff; padding-bottom: 17px;}
.footer-contact input[type="email"] {background: none; border: none; border-bottom: 1px solid #27272b; padding-bottom: 20px; padding-top: 20px; font-size: 13px; line-height: 24px; color:#fff; font-weight: 700; text-transform: uppercase; width: 100%;}
.send-button {position: relative; float: left; text-align: center; border: 1px solid #27272b; color:#fff; border-radius: 20px; height: 40px;background: none; padding: 0px 15px;text-transform: uppercase; margin-top: 30px; font-weight: 700; 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;}
.send-button:hover {background: #fff; color:#101012; border: 1px solid #fff;}
.footer-contact textarea {background: none; resize: none; border: none; border-bottom: 1px solid #27272b; padding-bottom: 20px; font-size: 13px; line-height: 24px; color:#fff; font-weight: 700; text-transform: uppercase; width: 100%; padding-top: 23px;}

::-webkit-input-placeholder{opacity: 1!important; color:#fff;}
:-moz-placeholder{opacity: 1!important; color:#fff;}
::-moz-placeholder{opacity: 1!important; color:#fff;}
:-ms-input-placeholder{opacity: 1!important; color:#fff;}

.right-line {margin-left: 100px;}
.copyright {position: relative; width: 100%; text-align: center; top: -25px; font-size: 13px; line-height: 24px; color: #878787;}

.th-popup {position: fixed; left: 0; width: 100%; height: 100%; z-index: 8000; background: rgba(16,16,18,0.9); opacity: 0; bottom: -200%;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;}
.th-popup.act {opacity: 1; bottom: 0;}
.massage-th {position: absolute; height: auto; width: 400px; left: 50%; top:50%; margin-top:-200px; margin-left: -200px; border: 1px solid #fff; text-align: center; padding: 30px; background: #101012; max-width: 100%;}
.massage-th h1 {color:#fff; padding-bottom: 15px;}
.massage-th p {color:#fff;}

/*-------------------------------------------------------------------------------------------------------------------------------*/
/* 11 -MEDIA QUERIES*/
/*-------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width: 1160px) {
    .half-image .half-baner:last-child {height: 40vmin; margin-top: -5%;}
    .half-image .half-baner:first-child {height: 40vmin; margin-top: -5%;}
    .half-image .half-baner:last-child img {margin-top:-13%;}
    .half-image .half-baner:first-child img {margin-top:-13%;}
    .half-image {top: 0px;}
}
@media screen and (max-width: 1170px) {
    .footer-about {left: 0px;}
    .footer-contact {left: 0px;}
    .right-line {margin-left: 0px; }
}
@media screen and (max-width: 1035px) {
    .portfolio-button a {font-size: 13px; margin: 0px 17px;}        }
}
@media screen and (max-width: 842px) { 
    .slider-prev {left: -20px}
    .slider-next {right: -20px;}
}
@media screen and (max-width: 990px) {
    .theme-buy {padding-bottom: 60px;}
    .header-color.header nav .main-link {color:#fff; background: none; border-radius: 0px; border: 0px none; 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;}
    .header-color.header nav .main-link:hover {border: 0px none; color:#168b81;}
    .orange.header nav .main-link:hover {box-shadow: none; color: #c74b1a;}
    .header-opacity.header nav .main-link {color:#fff; background: none;  border-radius: 0px; border: 0px none; 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;}
    .header-opacity.header nav .main-link:hover {border: 0px none; color:#168b81;}
    
    .about-baner h1 {padding: 187px 0px 8px;}
    .services-baner h1 {padding-top: 187px;}
    .blog-baner h1 {padding-top: 187px;}
    .post-baner h1 {padding: 187px 0px 0px;}
    .contact-baner h1 {padding: 187px 0px 0px;}
    
    .portfolio-button {margin: 140px 0px 45px;}
    .full-baner.top {margin-top: 81px;}
    .three_column_blog .gallery .item {width: 50%;}
    .four_column_blog .gallery .item {width: 50%;}
    
    .services-baner .serv-icon {top: 15px;}
    .services-text {padding-left: 0px; padding-bottom: 50px; border-bottom: none;}
    .services-info h4 {white-space: nowrap;}
    .step-by h2 {padding: 5px 0px 50px;}  
    
    .map-canvas {margin-bottom: 80px;}
    .contact-baner .form-wrap {padding-top: 0px;}
    
    .footer-about {margin-top: -345px;}
    .footer-contact {margin-top: -390px;}      
    
    .header-style-3 .header-opacity.header nav .main-link {border: 0px none;}
    .header-style-3 .header-opacity.header nav .main-link:hover {border: 0px none; border-bottom: 0px none;}
    .header-style-3 .header-opacity.header nav .main-link.hover {border: 0px none; border-bottom: 0px none;}
    .header-style-3 .drop-span-portfolio {top: 0px;}
    .header-style-3 .drop-span-home {top: 0px;}
    .header-style-3 .drop-span-pages {top: 0px;}
    .header-style-3 .header-opacity.header nav .main-link:hover .down-arrow {color: #6cd5cc;}
    
    .portfolio-menu .portfolio-top-baner .logo {margin-top: 10px;}
}
@media screen and (max-width: 768px) {
    .crafter h1 {padding: 53px 0px 32px;}
    .slider-craft {padding-top: 93px; margin-top: 0px;}
    .pagination {top: -20px;}
    .service h1 {padding-bottom: 30px; margin-top: 56px;}
    .service {padding-bottom: 50px;}
    .journal h1 {padding-top: 96px;}
    .awards h1 {padding: 57px 0px 38px;}
    .awards {padding-bottom: 100px;}
    .slider-prev {display: none;}
    .slider-next {display: none;}
    .block-service {padding-right: 20px;}
    
    .about-baner h1 {padding: 137px 0px 8px;}
    .about-baner h3 {padding-bottom: 47px;}

    .services-baner {padding-bottom: 100px;}
    .services-baner h1 {padding: 137px 0px 36px;}
    .services-info h4 {white-space: normal;}
    .step .romb-number {left: 10px;}
    
    .portfolio-baner {padding-bottom: 100px;}
    .portfolio-button {display: none;}
    
    .two_column_blog .gallery .item {width: 100%;}
    .three_column_blog .gallery .item {width: 100%;}
    .four_column_blog .gallery .item {width: 100%;}
    .portfolio-menu .portfolio-baner {padding-top: 0px;}
    .portfolio-menu .portfolio-baner {margin-top: -100px;}
    
    .blog-baner {padding-bottom: 100px;}
    .blog-baner h1 {padding-top: 137px;}
    .filter-categories a {margin: 0px 20px;}
    
    .post-baner {padding-bottom: 100px;}
    .post-baner h1 {padding: 137px 0px 0px;}
    
    .contact-baner {padding-bottom: 100px;}
    .contact-baner h1 {padding: 137px 0px 0px;}
    
    .about-us .main-button {padding-bottom: 180px;}
    
    .left-line {display: none;}
    .right-line {display: none;}
    .footer-about {margin-top: 20px;}
    .footer-contact {margin-top: 40px;}
    .copyright {padding-bottom: 60px; top: 35px;}
    .gallery-footer .skew-top img {display: none;}
    
    .filter-button a {margin:0px;}
    .drop {display: block;}
    .filter-button {display: none;}
    .filter-categories {display: none;}
    .blog-baner h1 {padding-bottom: 0px;}
    .filter-button a:hover {border-bottom: 0px none; border-top: 0px none; padding-top: 0px;}
    .filter-button a.active {border-bottom: 0px none;}
}
@media screen and (max-width: 720px) {
    .crafter-container .skew-bottom {display: none;}
    .slider-craft .skew-top {display: none;}
    .pagination.crafter-points {top: -50px;}
}
@media screen and (max-width: 600px) {
    h1 {font-size: 50px; line-height: 50px;}
}

@media screen and (max-width: 490px) {
    .footer-about {max-height: 460px;}
}
@media screen and (max-width: 480px) {
    .crafter-container .swiper-slide img {width: 100%;}
    
    .gallery .col-xs-6,  .gallery .col-xs-8,  .gallery .col-xs-4 {width: 100%!important;}
    .two_column_blog .gallery .item {width: 100%; float: left; padding: 0px 15px;}
    
    .half-image .half-baner:first-child {transform: skewY(0deg); transform-origin: 0% 0%; height: 100%; margin-top:0px;}
    .half-image .half-baner:first-child img{transform: skewY(0deg); margin-top: 0%;width: 100%!important; height: auto!important; position: relative; }
    .half-image .half-baner:last-child {transform: skewY(0deg); transform-origin: 0% 0%; height: 100%;margin-top:0px;}
    .half-image .half-baner:last-child img {transform: skewY(0deg); margin-top: 0%;width: 100%!important; height: auto!important; position: relative; }
    .half-baner {width: 100%;}
    .full-image {margin-top:0px;}
    .half-baner img {width: 100%!important; height: auto!important;}
    .img-rotate.bg {position: relative; overflow: visible;}
    .img-rotate .work {display: none;}
    
    .top-baner-title h1 {font-size: 70px;}
    
    .header-style-2 .menu-popup .nav-link {left:-30px;}
    .header-style-2 .share {margin-left: 10px;}
    .header-style-2 .menu-drop {right: 30px;}

}
@media screen and (max-width: 415px) {
    
    .awards-list {width: 100%;}
    .gear-list {width: 100%;}
    .info-list {text-align: center;}
    .info-list h3 {padding-bottom: 15px; text-align: center;}
    .info-list ul {text-align: center;}
    
    .comments {padding-left: 20px;}
    .comments img {display: none;}
    .name-wrap .reply {float: left; width: 100%;}
    
    .adress {padding: 31px 0px 70px;}
    .adress ul {width: 100%; padding: 15px 0px;}
}
@media screen and (max-width: 376px) {
    h1 {font-size: 36px;}
    .more-info h4 {font-size: 12px;}
    .icon-font {font-size: 36px;}
    .more-info .arrow-next {font-size: 20px;}
    .theme-buy {text-align: center;}
    .theme-buy .main-button {position: relative; float: none; display: inline-block;}
    .block-service {text-align: center; margin-left: 0px; padding-right: 0px;}
    .romb-number {position: relative; float: none; display: inline-block; left: 0px;}
    .skew-top {top: -1px;}
    
    .step {text-align: center;}
    .step .romb-number {position: relative; float: none; display: inline-block; margin-top: 30px; left: 0px;}
    .step h3 {padding-left: 0px;}
    .step p {padding-left: 0px;}
    .step-by h2 {padding: 5px 0px 0px;}
}