/*
Theme Name: Beaver Builder Child Theme
Theme URI: https://www.wpbeaverbuilder.com
Version: 1.0
Description: An example child theme that can be used as a starting point for custom development.
Author: The Beaver Builder Team
Author URI: https://www.fastlinemedia.com
template: bb-theme
*/

/* Add your custom styles here...Remember to change the Version number above! */  
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');

.fl-menu #menu-main-menu.menu { position: relative; top: auto; right: auto; text-align: left;}
.slidemenu-right .fl-menu-mobile-toggle {background:#42593a url(images/menu.png) no-repeat right 22px center; font-weight:400; border-radius:50px; color:#fff; width: 120px!important; padding:12px 50px 12px 15px!important; background-size: 22px; font-family: "Montserrat", sans-serif; text-transform: uppercase !important;}   


#header{position: absolute; width: 100%; z-index: 100; top: 0px;} 
.slidemenu-right .fl-menu-mobile-flyout{background-color:#2c2c2c; padding:20px 50px;} 
.slidemenu-right  .fl-flyout-right .fl-menu-mobile-close {float: right; color:#fff; font-weight:normal; font-size:28px;     z-index: 9999; position: relative; cursor: pointer;}  

.fl-menu-mobile-flyout .menu { counter-reset: menu-item;}

.fl-menu-mobile-flyout .menu li { counter-increment: menu-item; padding-left: 40px; position: relative;}
.fl-menu-mobile-flyout .menu li a::before { content: "0" counter(menu-item); position: absolute; left: 25px; font-size: 14px; top:20px; opacity: .6;}
	
	
/* Counter numbers */
.fl-menu-mobile-flyout .menu { counter-reset: menu-item;}

.fl-menu-mobile-flyout .menu li { counter-increment: menu-item; position: relative;}

.fl-menu-mobile-flyout .menu li a:hover {color: #d39c2f;}

.fl-menu-mobile-flyout .menu li a::after {  content: ""; position: absolute; height: 2px;  width: 0; background: #d39c2f;
    top: 50%;  margin-left: 20px; transition: width 0.3s ease;}
.fl-menu-mobile-flyout .menu li a:hover::after { width: 300px;}

.tyton-text span.top-heading{font-size:16px; font-weight:400; font-family: Montserrat, sans-serif; text-transform:uppercase;}
.tyton-text span{display:block; font-size:18px; line-height:1.7; opacity:0.1; color:#000; font-family: Montserrat, sans-serif;     font-weight: 500;} 
.tyton-text h2 span{font-family: "Host Grotesk", sans-serif; font-size: 42px; line-height: 1.2;}  
.tyton-text h2{margin:20px 0;}

.learnmore{color:#ab7313; font-size:16px; text-decoration: underline; text-decoration-style: dotted; text-decoration-offset: 5px;
    text-transform: uppercase; font-weight: 600; letter-spacing: 0.5px; display: inline-block;  margin-top: 30px;}

.copyrightmenu a{display:inline; padding:0 10px; border-right:1px solid rgb(47, 39, 39); line-height: 1;}
.copyrightmenu a:last-child{border-right:0;} 

.services-section{display:flex; position:relative;} 
.services-section .left{width:50%; padding-right:60px; position:relative; overflow:hidden; /}
.services-section .title{padding-bottom:40px; font-size:52px; color:#bd5e1c;}

.services-section .title-mask{position:sticky; top:100px; height:200px; background:#fff; z-index:20; display:flex; align-items:flex-end; overflow:hidden;}

.service{margin-bottom:250px; padding-top:100px; position:relative; z-index:1;}

.service h3{font-size:32px; margin-bottom:20px; color:#000;}
.service p{font-size:18px; line-height:1.6; max-width:420px; font-family: "Montserrat", sans-serif; font-weight:400; color:#000} 

.services-section .right{width:50%; position:relative;}
.services-section .image-stack{position:sticky; top:120px; height:600px; overflow:hidden;}

.services-section .right{width:50%;}
.services-section .image-stack .img{position:absolute; width:100%; height:100%; top:0; left:0;}
.services-section .img img{width:100%; height:100%; object-fit:cover;}
.services-wrapper{overflow:hidden; padding-top:40px; position:relative; height:100%;}
 
.list-style ul, .list-style{margin:20px 0; padding: 0 0 0 30px;}
.list-style li{padding:3px 0;}
ul.list-style li, ol.list-style li{padding:7px 0; line-height:1.6;}
ul.list-style li strong, ol.list-style li strong{color:#bd5e1c}
.services-main {overflow: visible!important;}
.testimonials-sub p{background-color:#28282c; padding: 5px 15px; border-radius:40px; display:inline-block;}
.borderimg .fl-photo-content, .video .video_box .fl-video-poster{position:relative;}

.services-section .image-stack .img:after, .borderimg .fl-photo-content:after, .video .video_box .fl-video-poster:after{content:""; position:absolute; top:25px; left:25px; right:25px; bottom:25px; border:1px solid rgba(255,255,255,0.5); pointer-events:none;}
.video .video_box .fl-wp-video{padding-bottom: 100%;}
.video .video_box .fl-video-poster:after{background:url(images/play-button.png) no-repeat center center;}
.fl-accordion-button .fl-accordion-button-icon:focus, .fl-accordion-button .fl-accordion-button-icon:active, a:focus{outline:none!important}
.dashicons-arrow-down-alt2:before{color: #bd5e1c;}   


.video_box .fl-video,
.video_box .fl-video-poster { aspect-ratio: 1 / 1; width: 100%; overflow: hidden;}
.video_box img {width: 100%; height: 100%; object-fit: cover;}

.contactform .nf-before-form-content,.contactform  .nf-field-label, .projectForm .nf-before-form-content, .projectForm .nf-field-label{display:none;} 
.contactform input, .contactform textarea, .projectForm input, .projectForm textarea{background-color:rgb(230, 230, 230); border:1px solid #d7d7d7; color:rgb(43, 43, 43); font-size:15px; font-family: "Montserrat", sans-serif; border-radius:0; padding:12px 18px; font-weight: 500; text-transform: uppercase;} 
.contactform  input[type="submit"], .projectForm input[type="submit"]{background-color:#2b2b2b; width: 100%; opacity: 1; will-change: transform; cursor: pointer; flex-flow: row; place-content: center; align-items: center; gap: 8px; height: min-content; padding: 16px; display: flex;  position: relative; overflow: visible; line-height: 1.5; color:#fff; padding: 16px 30px;} 
.contactform input[type="submit"]:hover, .projectForm input[type="submit"]:hover{background-color:#bd5e1c;} 

.banner_gradient .fl-row-content-wrap:after{background: linear-gradient(360deg,rgba(255, 255, 255, 0) 0%, rgba(0, 0, 0, 0.84) 84%)!important;}


.card {position: sticky; top: 30px;}

.card__inner {will-change: transform; background: #f7f7f7; border-radius: 0px; display: flex; overflow: hidden;  transform-origin: center top;}
.cards {width: 100%; max-width: 100%; margin: 0 auto; display: grid; grid-template-rows: repeat(var(--cards-count), var(--card-height)); gap: 40px 0; box-shadow: 0 5px 10px -12px hsla(265.3, 20%, 10%, 35%);} 
.card__image-container {display: flex; width: 40%; flex-shrink: 0;}
.card__image {width: 100%; height: 100%; object-fit: cover; aspect-ratio: 1;} 
.card__content {padding: 150px 60px 0; display: flex; flex-direction: column;}
.card__title {padding: 0; margin: 0 0 20px; font-size: 32px; margin-bottom: 20px; color: #000;}
.card__description { line-height: 1.6; font-size: 16px; color: #16263a; font-family: "Montserrat", sans-serif;} 
.fl-node-s79i8j5tzf2e .fl-post-carousel-content :not(.fl-post-carousel-more){margin-bottom:20px; margin-top: 20px;}

.fl-post-carousel-title{margin-top:15px;}
.foogallery.fg-dark.fg-shadow-medium .fg-item-inner, .foogallery.fg-light.fg-shadow-medium .fg-item-inner{box-shadow:none!important;}
.foogallery {margin-top: 50px;}
.project-content{font-size: 16px; line-height: 1.7; color: #000; font-family: Montserrat, sans-serif;} 
.project-content li{line-height:1.6; padding:5px 0;}
.nav-links{margin-top:20px;}
.nav-links a{font-size: 14px; line-height: 1.7; font-family: Montserrat, sans-serif; font-weight:bold;}

@media (max-width: 767px) { 
.slidemenu-right .fl-menu-mobile-flyout{width: 100% !important;}
.services-section .left {width: 100%; padding-right: 0;}
.service {margin-bottom: 60px; padding-top: 0;} 
.services-section .right {width: 100%;}
.services-section .image-stack{height: 340px;}
.fl-builder-content .fl-node-lwde5y1o4xu2{width:auto!important;}
.services-section .title-mask{top: 0; height: auto;}
.tyton-text h2 span{font-size: 28px;}
.tyton-text span{font-size:16px;}
.learnmore{font-size:14px;}
.services-section .title{font-size:46px; padding-bottom: 0;}
.service h3 {font-size: 28px;}
.service p {font-size: 16px;} 
.copyrightmenu a{padding: 0 8px;}
}

@media (max-width: 600px) {
  .card__inner {
    flex-direction: column;
  }

  .card__image-container {
    width: 100%;
  }

  .card__image {
    aspect-ratio: 16 / 9;
  }

  .card__title {
    font-size: 32px;
  }

  .card__description {
    font-size: 16px;
  }

  .card__content {
    padding: 30px 20px;
  }
}



/* RESPONSIVE */

@media(max-width:900px){

.services-section{
flex-direction:column;
}

.left,.right{
width:100%;
}

.image-stack{
margin-top:60px;
}

}