/* ========================================================================== Custom styles ========================================================================== */
 html, body {
     background-color: #ffffff;
     font-size: 16px;
     color:#6B6B6B;
     width: 100%;
     padding: 0;
     margin-left: 0;
     margin-right: 0;
     font-family: 'Heebo';
     font-weight: 400;
}
 p, h4 {
     letter-spacing: 1px;
}
.transparent {
     background-color: transparent !important;
}

/*========================================== FLOATING "BACK TO TOP" BUTTON ==========================================*/
.scroll-top {
    position:fixed;
    right:10px;
    bottom:10px;
    cursor:pointer;
    width:50px;
    height:50px;
    background-color:#35332e;
    text-indent:-9999px;
    display:none;
    -webkit-border-radius:60px;
    -moz-border-radius:60px;
    border-radius:60px
}
.scroll-top span {
    position:absolute;
    top:50%;
    left:50%;
    margin-left:-8px;
    margin-top:-12px;
    height:0;
    width:0;
    border:8px solid transparent;
    border-bottom-color:#ffffff;
}
.scroll-top:hover {
    background-color: #504c42;
    opacity:1;filter:"alpha(opacity=100)";
    -ms-filter:"alpha(opacity=100)";
}

    
/*========================================== PRE LOADER ==========================================*/
 .preloader {
     position: fixed;
     top: 0;
     left: 0;
     right: 0;
     bottom: 0;
     background-color: #fefefe;
     z-index: 99999;
     height: 100%;
     width: 100%;
     overflow: hidden !important;
}
 .loaded {
     width: 60px;
     height: 60px;
     position: absolute;
     left: 50%;
     top: 50%;
     background-image: url(../images/preloading.gif);
     background-repeat: no-repeat;
     background-position: center;
     -moz-background-size: cover;
     background-size: cover;
     margin: -20px 0 0 -20px;
}
 img {
     -moz-user-select: none;
     -webkit-user-select: none;
     -ms-user-select: none;
     user-select: none;
     -webkit-user-drag: none;
     user-drag: none;
}
 a:hover, a:active, a:focus {
     text-decoration: none;
     outline: none;
     color: #504b4b;
}
 a{
     text-decoration:none;
     cursor:pointer;
     color: #909090;
}
 a, button, a span {
     -webkit-transition: 0.2s ease-in-out;
     -o-transition: 0.2s ease-in-out;
     transition: 0.2s ease-in-out;
}
 .btn.extra-width {
     padding: 13px 40px;
}
 .btn:focus, .btn:active {
     outline: inherit;
}
 *, *:before, *:after {
     -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
     box-sizing: border-box;
    /* direction: rtl;
     */
}
 p {
     margin: 0 0 30px;
     color: #909090;
}
.main-footer > p {
    margin: 0 0 12px;
    font-size: 11px;
}
 p {
    color: #a09b96;
    font-family: 'Heebo', sans-serif;
    font-size: 15px;
    line-height: 20px;
    font-weight: 300;
}
 .clear {
     clear: both;
}
 ol, ul {
     list-style: none;
     padding: 0;
}
 img {
     max-width: 100%;
}
 .space-box{
    width: 5px; 
    display: inline-block;
 }
button.btn-booking {
    background-color: #ffffff42 !important;
    border-color: #967f39 !important;
    color: #bb8d00 !important;
	font-family: 'Playfair Display', sans-serif;
	font-weight: 300;
	letter-spacing: 3px;
	text-transform: uppercase;
	min-width: 120px;
}
button.btn-booking:hover {
    color: #eeb50a !important;
    background-color: #524d4dc4 !important;
}
.btn-booking.active.focus, .btn-booking.active:focus, .btn-booking.active:hover, .btn-booking:active.focus, .btn-booking:active:focus, .btn-booking:active:hover, .open > .dropdown-toggle.btn-booking.focus, .open > .dropdown-toggle.btn-booking:focus, .open > .dropdown-toggle.btn-booking:hover, .btn-booking.focus, .btn-booking:focus, .btn-booking.disabled, .btn-booking.disabled:hover {
    background-color: transparent !important;
    border-color: #967f39 !important;
	color: #967f39 ;
}

 textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], .uneditable-input {
     outline: none;
}
 .form-control {
     border: 1px solid rgba(0, 0, 0, 0.08);
     font-size: 16px;
     height: 45px;
}
 .form-control:focus {
     border-color: #fff;
}

/* DINAMIC STYLE */
 h1, .h1, .title h1 {
     color: #797166;
     font-family: 'Playfair Display', sans-serif;
     font-size: 28px;
     font-weight: 300;
     letter-spacing: 5px;
}
 h2, .h2, h2 a{
     color: #797166;
     font-family: 'Playfair Display', sans-serif;
     font-size: 28px;
     font-weight: 300;
     letter-spacing: 5px;
}
 h3, .h3, h3 a{
     color: #595653;
     font-family: 'Playfair Display', sans-serif;
     font-size: 26px;
     font-weight: 300;
     letter-spacing: 5px;
}
 h4, .h4, h4 a{
     color: #595653;
     font-family: 'Heebo', sans-serif;
    /*font-size: 14px;
     */
     font-weight: 300;
     letter-spacing: 2px;
}
 h5, .h5, h5 a, .q_icon_with_title .icon_text_holder h5.icon_title{
     color: #9e968e;
     font-family: 'Playfair Display', sans-serif;
     font-size: 12px;
     font-weight: 100;
     letter-spacing: 5px;
}
 h6, .h6, h6 a {
     color: #595653;
     font-family: 'Heebo', sans-serif;
     font-weight: 100;
}

 span.signature {
     font-family: 'Playfair Display', sans-serif;
     font-size: 20px;
     line-height: 20px;
     font-weight: 300;
	 color: #67615a;
}

/* END */
/*.home-wrap h1,*/
 .home-wrap h2, .home-wrap h3, .home-wrap h4, .home-wrap h5, .home-wrap p {
     color: #ffffff;
}
 .text {
     color: #333333;
}
 .colorstext {
     color: #f56363;
}
 .coloricon i {
     color: #f56363;
}
 .colorsbg {
     background: #f56363;
     color: #ffffff;
}
 .lightbg {
     background-color: #dddfeb;
}
 .transition {
     -webkit-transition: all 300ms linear;
     -moz-transition: all 300ms linear;
     -o-transition: all 300ms linear;
     -ms-transition: all 300ms linear;
     transition: all 300ms linear;
}
/* Section */
 .sections {
     padding-top: 100px;
     padding-bottom: 100px;
     position: relative;
     overflow: hidden;
}
 .sections2{
     padding-top:350px;
     padding-bottom:350px;
     position: relative;
     overflow: hidden;
     color:#fff;
}
 .sections3{
     padding-top: 50px;
     padding-bottom: 50px;
    /* padding-top: 100px;
     padding-bottom: 100px;
     */
     position: relative;
     overflow: hidden;
}
 .sections4{
     padding-top:5px;
     position: relative;
     overflow: hidden;
}
 .footer {
     padding-top:40px;
     padding-bottom:40px;
     color:#fff;
     background:#222222;
}
 section .subtitle h5 {
     margin-top: 10px;
     font-size: 1.3rem;
     font-family: 'Heebo', sans-serif;
}
 .parallax-section {
     max-width: 100%;
     color: #ffffff;
}
 section .title-half h2 {
     font-size: 3rem;
     line-height: 4rem;
     font-weight: 300;
     margin-bottom: 1.4rem;
}
 section .subtitle-half h5 {
     font-weight: 100;
     font-size: 17px;
}
 .heading {
     margin-bottom: 4rem;
}
 .overlay {
     background-color: rgba(0, 0, 0, .45);
     width: 100%;
     overflow:hidden;
    /* min-height:1200px;
     min-height:800px;
    
     min-height: 100%;
	  */
	  min-height:800px;
}
/* .overlay-parallax {
     min-height:800px! important;
}
 */
 .overlay-fluid-block {
     background-color: rgba(0, 0, 0, 0.5);
     width: 100%;
}
 .home-overlay-fluid {
     background-color: rgba(41, 41, 41, 0.68);
     width: 80%;
     margin: auto;
}
 .overlay-img {
     background: rgba(0, 0, 0, 0.3);
     width: 100%;
     padding-top: 100px;
     padding-bottom: 100px;
     color: #ffffff;
}
 .no-padding {
     padding: 0 !important;
}
 .fluid-blocks-col {
     padding: 70px 40px 0 80px;
}
 .fluid-blocks-col-right {
     padding: 70px 80px 0 40px;
}
/* Separator */
 .separator {
     height: 1px;
     width: 150px;
     margin: auto;
     background: #f56363;
}
/* Button */
 .btn-primary.active.focus, .btn-primary.active:focus, .btn-primary.active:hover, .btn-primary:active.focus, .btn-primary:active:focus, .btn-primary:active:hover, .open > .dropdown-toggle.btn-primary.focus, .open > .dropdown-toggle.btn-primary:focus, .open > .dropdown-toggle.btn-primary:hover, .btn-primary.focus, .btn-primary:focus, .btn-primary.disabled, .btn-primary.disabled:hover {
     color: #ffffff;
     background-color: #f56363;
     border-color: #f56363;
}
/* Extra height css */
 .margin-top-20 {
     margin-top: 20px;
}
 .margin-bottom-20 {
     margin-bottom: 20px;
}
 .margin-top-40 {
     margin-top: 40px;
}
 .margin-bottom-40 {
     margin-bottom: 40px;
}
 .margin-top-60 {
     margin-top: 60px;
}
 .margin-80 {
     margin-top: 80px;
     margin-bottom: 80px;
}
 .margin-bottom-60 {
     margin-bottom: 60px;
}
 .margin-top-80 {
     margin-top: 80px;
}
 .margin-bottom-80 {
     margin-bottom: 80px;
}
 .padding-top-20 {
     padding-top: 1.33rem;
}
 .padding-bottom-20 {
     padding-bottom: 1.33rem;
}
 .padding-top-40 {
     padding-top: 2.66rem;
}
 .padding-bottom-40 {
     padding-bottom: 2.66rem;
}
 .padding-top-60 {
     padding-top: 5rem;
}
 .padding-bottom-60 {
     padding-bottom: 5rem;
}
 .padding-bottom-0 {
     padding-bottom: 0;
}
/*padding*/
 .padding-twenty {
     padding: 10px 0;
}
 .padding-fourty {
     padding: 20px 0;
}
 .padding-sixty {
     padding: 30px 0;
}
 .padding-eighty {
     padding: 40px 0;
}
 h1 span {
     color: #f56363;
     font-weight: 400;
}
/*for placeholder changes*/
 input::-webkit-input-placeholder {
     color: #c3bec2;
     font-size: 12px;
}
 input::-moz-placeholder {
     color: #c3bec2;
     font-size: 12px;
}
 input:-ms-input-placeholder {
     color: #c3bec2;
     font-size: 12px;
}
 textarea::-webkit-input-placeholder {
     color: #c3bec2;
     font-size: 12px;
}
 textarea::-moz-input-placeholder {
     color: #c3bec2;
     font-size: 12px;
}
 textarea::-ms-input-placeholder {
     color: #c3bec2;
     font-size: 12px;
}
/*For Our Global Section*/
 .heading-content{
     margin-bottom: 2rem;
}
 .btn-default {
     color: #fff;
     background-color: #ff2b4a;
     border-color: transparent;
     border-radius: 0;
     padding: 10px 60px;
     font-size: 16px;
     transition:.3s ease-in-out;
}
 .btn-default:active, .btn-default:hover {
     background:#002453;
     color:#fff;
}
/*For Menu Section*/
 section.parallax_section_holder {
     position: static;
     padding: 0;
     background-repeat: no-repeat;
     background-color: transparent;
     background-attachment: fixed;
     background-size: cover;
     -moz-background-size: cover;
     -webkit-background-size: cover;
     -o-background-size: cover;
     width: 100%;
     overflow: hidden;
}
 @media only screen and (min-width: 480px) and (max-width: 768px){
     section.parallax_section_holder{
         height: auto !important;
         min-height: 560px;
    }
}
 @media only screen and (max-width: 480px){
     section.parallax_section_holder {
         height: auto !important;
         min-height: 560px;
    }
}
/*For Home Section */
 .home {
     background-image: url(../images/header-bg.jpg);
     background-position: center top;
  /*   background: url(../images/header-bg.jpg) no-repeat center top fixed;
     background-size: cover;
     -moz-background-size: cover;
     -webkit-background-size: cover;
     -o-background-size: cover;
     background-attachment: fixed;
     width: 100%;
     overflow: hidden;
     */
}
 @media only screen and (max-width: 768px){
     .home {
         background: url(../images/foto_portrait_sfumata.png) no-repeat center top !important;
		 background-color: rgba(0, 0, 0, 0.98) !important;
    }
     .experience{
         background: url(../images/fuji_mount_portrait_sfumata.png) no-repeat center top !important;
		 background-color: rgba(0, 0, 0, 0.98) !important;
    }
	.castello{
         background: url(../images/castello.jpg) no-repeat center top !important;
		 background-color: rgba(0, 0, 0, 0.98) !important;
    }
     .contact{
         background: url(../images/contact_bg.jpg) no-repeat center center !important;
		 /* background-color: #bea241 !important;
         */
    }
	.overlay {
		min-height: 500px;
	}
}
 .home-wrapper {
     margin-top: 240px;
     color:#fff;
}
 .home-content h1{
     font-size:65px;
     text-transform:uppercase;
     color:#fff;
     font-weight:900;
     font-family: "Playfair Display";
     letter-spacing:12px;
     border-top:2px solid #ecf0f2;
     border-bottom:2px solid #ecf0f2;
     padding:20px 0;
}
 .home-content p{
     font-size:25px;
     margin-top:20px;
     color:#ecf0f2;
}
/*For About Us Section */
 .about-content{
     margin-top:70px;
}
/* .about-content h4{
     font-size:18px;
     font-family: 'Heebo';
}
 */
 .about-content a{
     margin-top:40px;
}
/*For Features Section*/
 .features-bg{
     background:#10c6fc;
     color:#fff;
     height: 270px;
     width: 283px;
     margin-bottom:20px;
}
 .features-item{
     padding-top: 84px;
}
 .features-item i{
     font-size:40px;
}
 .features-item h6{
     padding-top:35px;
}
 .features-item h6 a{
     font-size: 18px;
     text-transform: uppercase;
     color:#fff;
}
 .features-item h6 a:hover{
     color:#ff2b4a;
}
 .features-bg.design{
     background:#10c6fc;
     transition:.3s ease-in-out;
     -webkit-transition:.3s ease-in-out;
     -moz-transition:.3s ease-in-out;
     -ms-transition:.3s ease-in-out;
     -o-transition:.3s ease-in-out;
}
 .features-bg.design:hover{
     background:#2d6879;
}
 .features-bg.development{
     background:#835aeb;
     transition:.3s ease-in-out;
     -webkit-transition:.3s ease-in-out;
     -moz-transition:.3s ease-in-out;
     -ms-transition:.3s ease-in-out;
     -o-transition:.3s ease-in-out;
}
 .features-bg.development:hover{
     background:#6b647c;
}
 .features-bg.testing{
     background:#002453;
     transition:.3s ease-in-out;
     -webkit-transition:.3s ease-in-out;
     -moz-transition:.3s ease-in-out;
     -ms-transition:.3s ease-in-out;
     -o-transition:.3s ease-in-out;
}
 .features-bg.testing:hover{
     background:#64cbc0;
}
 .features-bg.launch{
     background:#ff2b4a;
     transition:.3s ease-in-out;
     -webkit-transition:.3s ease-in-out;
     -moz-transition:.3s ease-in-out;
     -ms-transition:.3s ease-in-out;
     -o-transition:.3s ease-in-out;
}
 .features-bg.launch:hover{
     background:#222222;
}
/*For Experience Section*/
 .experience{
     background: url(../images/fuji-mount.jpg);
    /* background: url(../images/fuji-mount.jpg) no-repeat center top fixed;
     background-size: cover;
     -moz-background-size: cover;
     -webkit-background-size: cover;
     -o-background-size: cover;
     width: 100%;
     overflow: hidden;
     */
}
 .experience-wrapper{
     margin-top:30px;
}
 .experience-content{
     background: rgba(79, 50, 68, .7);
     padding:30px 30px;
     color:#fff;
     margin-bottom: 50px;
}
 .experience-content h4{
     color:#fff;
     text-transform:uppercase;
     font-size:26px;
     font-family: "Playfair Display";
     font-weight:600;
     margin-bottom:50px;
}
 .experience-content .content-details h5{
     color:#fff;
     font-size:18px;
}
 .experience-content .content-details h6{
     color:#ecf0f2;
     font-size:16px;
}
 .experience-content .content-details p{
     color:#ecf0f2;
}
 .experience-content .content-details.content-border{
     border-bottom:1px solid #dadada;
     padding-bottom: 30px;
     margin-bottom: 30px;
}

/*For Castello Section*/
 .castello{
     background: url(../images/castello.jpg);
}
 .castello-wrapper{
     margin-top:30px;
}
 .castello-content{
     background: rgba(79, 50, 68, .7);
     padding:30px 30px;
     color:#fff;
     margin-bottom: 50px;
}
 .castello-content h4{
     color:#fff;
     text-transform:uppercase;
     font-size:26px;
     font-family: "Playfair Display";
     font-weight:600;
     margin-bottom:50px;
}
 .castello-content .content-details h5{
     color:#fff;
     font-size:18px;
}
 .castello-content .content-details h6{
     color:#ecf0f2;
     font-size:16px;
}
 .castello-content .content-details p{
     color:#ecf0f2;
}
 .castello-content .content-details.content-border{
     border-bottom:1px solid #dadada;
     padding-bottom: 30px;
     margin-bottom: 30px;
}

/* For Portfolio Section*/
 .portfolio-item {
	 margin-bottom: 20px;
}
 .portfolio-wrapper{
	 padding: 10px;
}
 @media only screen and (min-width: 480px) and (max-width: 768px){
      .portfolio-wrapper{
			padding: 0px 10px 0px 10px;
		}
}
 .portfolio-wrapper2 .portfolio-item.width-img{
     width:100%;
     overflow:hidden;
     height:243px;
}
 .portfolio-wrapper2 .portfolio-item.width-img img{
     width:100%;
}
/* For Testimonial Section*/
 .testimonial-content{
     margin-top:150px;
}
 .testimonial-content .testimonial-quote i{
     font-size:60px;
     margin-bottom:40px;
     color:#6d809e;
}
 .testimonial-content .testimonial-quote p{
     font-size:16px;
}
 .testimonial-content .singnature{
     width:100%;
     display:block;
     overflow:hidden;
     margin:50px 0 30px 0;
}
 .testimonial-content .regards-by h5{
     margin-bottom:5px;
}
 .profile-photo{
     height:650px;
}
/*For Contact Section*/
 .contact{
     background: url(../images/contact_bg.jpg);
    /* background: url(../images/contact_bg.jpg) no-repeat center top fixed;
     background-size: cover;
     -moz-background-size: cover;
     -webkit-background-size: cover;
     -o-background-size: cover;
     width: 100%;
     overflow: hidden;
     */
}
 .contact-area{
     background: rgba(79, 50, 68, .7);
     padding:60px 40px 147px 40px;
     color:#fff;
}
 .contact-wrapper h4{
     color:#fff;
     text-transform:uppercase;
     font-size:26px;
     font-family: "Playfair Display";
     font-weight:600;
     margin-bottom:50px;
}
 .form-control {
     border: 1px solid #c3bec2;
     font-size: 16px;
     height: 50px;
     background: transparent;
     border-radius: 0;
     margin-bottom:30px;
}
 .contact-area form a{
     float:right;
     margin-top:20px;
}
 .contact-details{
     background: rgba(55, 38, 57, 0.64);
     padding:60px 40px;
     color:#fff;
     margin-bottom:20px;
}
 .contact-details h4{
     margin-bottom:25px;
}
 .contact-details p{
     margin: 0 0 10px;
     color:#c3bec2;
}
 .box-area{
    /* background: rgba(79, 50, 68, .7);
     */
    /* padding:60px 40px 147px 40px;
     */
     color:#fff;
}
 .box-details{
    /* background: rgba(55, 38, 57, 0.64);
     */
     padding:10px 10px;
     color:#fff;
     margin-bottom:20px;
}
 .box-details h3 {
     position: relative;
     margin-bottom: 40px;
     letter-spacing: 1px;
     text-transform: uppercase;
}
 .box-details h4 {
     position: relative;
     margin-bottom: 10px;
}
 .box-details p{
     margin: 0 0 10px;
}

  .footer-social ul.social {
    list-style-type: none;
    }
    .footer-social ul.social li {
      display: inline;
      margin-right: 30px;
      margin-left: 30px; }
      .footer-social ul.social li a {
        opacity: 0.7;
        filter: alpha(opacity=70);
        -webkit-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out; }
        .footer-social ul.social li a:hover {
          opacity: 1;
          filter: alpha(opacity=100); }

/* ------------------------------------------------------------- Google map ------------------------------------------------------------- */
 .map-section {
     position: relative;
     height: 450px;
     width: 100%;
}
 .map {
     height: 100%;
     width: 100%;
}
 .map img {
     max-width: none;
}
/* For Footer Area */
 .main-footer .social{
     margin-bottom:10px;
}
 .main-footer .social a{
     color:#c3bec2;
     font-size:15px;
}
 .main-footer .social a:hover{
     color:#bb8d00;
}
 .main-footer .social a i{
    /* 
     border-right:1px solid #c3bec2;
      */
     padding:0;
    
     font-size: 20px;
}
 .main-footer .social a i.noborder{
     border-right:0;
}
 .main-footer p{
     color:#c3bec2;
     font-size:12px;
}
/* -------------------------------- Modules - reusable parts of our design -------------------------------- */
 .cd-container {
    /* this class is used to give a max-width to the element it is applied to, and center it horizontally when it reaches that max-width */
     width: 90%;
     max-width: 768px;
     margin: 0 auto;
}
 .cd-container::after {
    /* clearfix */
     content: '';
     display: table;
     clear: both;
}
/* -------------------------------- Main components -------------------------------- */
 .home-main-content {
     position: relative;
    /* height: 100%;
     */
     overflow: hidden;
     background-color: #3a393f;
    /* slightly visible only when we resize this element box-shadow: 0 0 40px rgba(0, 0, 0, 0.8);
     */
     z-index: 1;
    /* Force Hardware Acceleration in WebKit */
     -webkit-transform: translateZ(0);
     -webkit-backface-visibility: hidden;
     transform: translateZ(0);
     backface-visibility: hidden;
     -webkit-transition-property: -webkit-transform;
     -moz-transition-property: -moz-transform;
     transition-property: transform;
     -webkit-transition-duration: 0.5s;
     -moz-transition-duration: 0.5s;
     transition-duration: 0.5s;
}
 .home-main-content.move-out {
     -webkit-transform: scale(0.6);
     -moz-transform: scale(0.6);
     -ms-transform: scale(0.6);
     -o-transform: scale(0.6);
     transform: scale(0.6);
}
 .no-js .home-main-content {
     height: auto;
     overflow-x: auto;
     overflow-y: auto;
}
 .cd-header {
     position: absolute;
     top:2%;
     left: 0;
     width: 100%;
     height: 50px;
     z-index: 2;
     -webkit-transition: background 0.2s;
     -moz-transition: background 0.2s;
     transition: background 0.2s;
}
 @media only screen and (min-width: 768px) {
     .cd-header {
         height: 80px;
    }
}
 #cd-logo {
     position: absolute;
     left: 10px;
  /*   top: 8px; */
     width: 160px;
     height: 32px;
}
 #cd-logo img {
     display: block;
}
 @media only screen and (min-width: 768px) {
     #cd-logo {
         left: 20px;
        /* top: 24px; */
    }
}
 @media only screen and (min-width: 1170px) {
     #cd-logo {
         left: 60px;
    }
}
 .cd-menu-trigger {
     display: inline-block;
     position: absolute;
     right: 0;
     top: 0;
     height: 50px;
     width: 50px;
     line-height: 50px;
     padding: 0 .8em;
     text-transform: uppercase;
     font-weight: bold;
     font-size: 14px;
     font-size: 0.875rem;
     border: 2px solid #EDEDED;
     margin-right: 5px
}
 .cd-menu-trigger span {
    /* hamburger icon */
     position: relative;
     display: inline-block;
     top: 23;
     width: 18px;
     height: 2px;
     background-color: white;
     vertical-align: middle;
     -webkit-transform: translateY(-2px);
     -moz-transform: translateY(-2px);
     -ms-transform: translateY(-2px);
     -o-transform: translateY(-2px);
     transform: translateY(-2px);
}
 .cd-menu-trigger span::before, .cd-menu-trigger span::after {
     content: '';
     display: inline-block;
     position: absolute;
     left: 0;
     width: 100%;
     height: 100%;
     background-color: inherit;
     -webkit-transition: all 0.2s;
     -moz-transition: all 0.2s;
     transition: all 0.2s;
}
 .cd-menu-trigger span::before {
     top: -6px;
}
 .cd-menu-trigger span::after {
     bottom: -6px;
}
 .no-touch .cd-menu-trigger:hover span::before {
     top: -11px;
}
 .no-touch .cd-menu-trigger:hover span::after {
     bottom: -11px;
}
 @media only screen and (min-width: 768px) {
     .cd-menu-trigger {
         top: 16px;
         right: 10px;
         font-size: 16px;
         font-size: 1rem;
    }
}
 @media only screen and (min-width: 1170px) {
     .cd-menu-trigger {
         right: 60px;
    }
}
 #main-nav {
     position: fixed;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     background: #F9F9F9;
    /* Force Hardware Acceleration in WebKit */
     -webkit-transform: translateZ(0);
     -webkit-backface-visibility: hidden;
     backface-visibility: hidden;
    /* we move this element off the canvas */
     -webkit-transform: translateY(-100%);
     -moz-transform: translateY(-100%);
     -ms-transform: translateY(-100%);
     -o-transform: translateY(-100%);
     transform: translateY(-100%);
     -webkit-transition-property: -webkit-transform;
     -moz-transition-property: -moz-transform;
     transition-property: transform;
     -webkit-transition-duration: 0.5s;
     -moz-transition-duration: 0.5s;
     transition-duration: 0.5s;
     z-index: 3;
}
 #main-nav ul {
     height: 100%;
     overflow-y: scroll;
}
 #main-nav li {
     height: 16.666%;
}
 #main-nav li a {
     position: relative;
     display: block;
     padding: 0 10%;
     height: 100%;
    /* border-bottom: 1px solid #dfdbec;
     */
     color: #3a393f;
     font-size: 20px;
     font-size: 1.25rem;
     font-weight: bold;
}
 #main-nav li a span {
     position: absolute;
     left: 50%;
     top: 50%;
     bottom: auto;
     right: auto;
     -webkit-transform: translateX(-50%) translateY(-50%);
     -moz-transform: translateX(-50%) translateY(-50%);
     -ms-transform: translateX(-50%) translateY(-50%);
     -o-transform: translateX(-50%) translateY(-50%);
     transform: translateX(-50%) translateY(-50%);
}
 .no-touch #main-nav li a:hover {
     background-color: #FFF;
}
 #main-nav li:last-child a {
     border-bottom: none;
}
 #main-nav .cd-close-menu {
     position: absolute;
     top: 0;
     right: 0;
     display: inline-block;
     width: 40px;
     height: 40px;
     background-color: rgba(51, 48, 48, 0.36);
    /* image replacement */
     overflow: hidden;
     text-indent: 100%;
     white-space: nowrap;
}
 #main-nav .cd-close-menu::before, #main-nav .cd-close-menu::after {
     content: '';
     display: inline-block;
     position: absolute;
     top: 18px;
     left: 10px;
     width: 20px;
     height: 3px;
     background-color: #FFF;
     -webkit-transition-property: -webkit-transform;
     -moz-transition-property: -moz-transform;
     transition-property: transform;
     -webkit-transition-duration: 0.3s;
     -moz-transition-duration: 0.3s;
     transition-duration: 0.3s;
}
 #main-nav .cd-close-menu::before {
     -webkit-transform: rotate(45deg);
     -moz-transform: rotate(45deg);
     -ms-transform: rotate(45deg);
     -o-transform: rotate(45deg);
     transform: rotate(45deg);
}
 #main-nav .cd-close-menu::after {
     -webkit-transform: rotate(135deg);
     -moz-transform: rotate(135deg);
     -ms-transform: rotate(135deg);
     -o-transform: rotate(135deg);
     transform: rotate(135deg);
}
 .no-touch #main-nav .cd-close-menu:hover::before {
     -webkit-transform: rotate(225deg);
     -moz-transform: rotate(225deg);
     -ms-transform: rotate(225deg);
     -o-transform: rotate(225deg);
     transform: rotate(225deg);
}
 .no-touch #main-nav .cd-close-menu:hover::after {
     -webkit-transform: rotate(315deg);
     -moz-transform: rotate(315deg);
     -ms-transform: rotate(315deg);
     -o-transform: rotate(315deg);
     transform: rotate(315deg);
}
 #main-nav.is-visible {
     box-shadow: 0 0 20px rgba(0, 0, 0, 0.4);
     -webkit-transform: translateY(0);
     -moz-transform: translateY(0);
     -ms-transform: translateY(0);
     -o-transform: translateY(0);
     transform: translateY(0);
}
 .no-js #main-nav {
     position: static;
     -webkit-transform: translateY(0);
     -moz-transform: translateY(0);
     -ms-transform: translateY(0);
     -o-transform: translateY(0);
     transform: translateY(0);
}
 .no-js #main-nav .cd-close-menu {
     display: none;
}
 .cd-shadow-layer {
     position: fixed;
     top: 0;
     left: 0;
     height: 100%;
     width: 100%;
     background: rgba(0, 0, 0, 0.4);
     z-index: 2;
     opacity: 0;
     visibility: hidden;
     -webkit-transition: visibility 0s 0.5s, opacity 0.5s 0s;
     -moz-transition: visibility 0s 0.5s, opacity 0.5s 0s;
     transition: visibility 0s 0.5s, opacity 0.5s 0s;
}
 .cd-shadow-layer.is-visible {
     opacity: 1;
     visibility: visible;
     -webkit-transition-delay: 0s;
     -moz-transition-delay: 0s;
     transition-delay: 0s;
}