html{
    scroll-snap-type: y mandatory;
    scroll-padding-top: 6vw;

}

section{
    scroll-snap-align: start;
}

@media (max-width:800px){
    html{
            scroll-snap-type:inline;
                scroll-padding-top: 0;

    }
}

.bg{
    display: flex; 
    /*background-image: url(/green/assets/img/boat.png);*/
    background-image:url('/green/assets/img/hero-bg.webp');
    /*background-image:url('green/assets/img/hero-bg.jpg'); hero-bg.webp*/
     background-repeat: no-repeat;  
 background-size: cover;background-position: center center;
 background-color: rgba(0, 0, 0, 0.2);
 /*background-blend-mode: multiply;*/
   object-fit: fill;   height: 463px;

   
   /*background-image: url('/green/assets/img/footer_bg.jpg');*/
   background-color: rgba(4, 64, 60, 0.83);
}

/*.box-text2{*/
/*    width: 55%;*/
/*    margin-left: 3vw;*/
/*height: 36.5vw;*/
/*}*/

/*.box-text{*/
/*    width: 55%;*/
/*    height: 36.5vw;*/
/*    margin-left: 10%;*/
/*    margin-left: 9vw;*/
/*    display: flex; align-content: center; align-items: start;justify-content: start;*/
   
/*flex-direction: column;*/
/*margin-top: 6vw;*/
/*text-align: start;*/

/*}*/

/*.h2-header{*/
/*    color: #FFF;*/
/*margin-bottom: 0;*/
/*font-size: 4.1vw;*/
/*font-style: normal;text-align: start;*/
/*font-weight: 600;*/
/*line-height: 3.8vw;*/
/*}*/

/*.p-header{*/
/*    padding: 1vw;*/
/*    flex-shrink: 0;*/
/*    color: #FFF;*/
    
/*    text-align: justify;*/
    
/*    font-size: 1.9vw;*/
/*    font-style: normal;*/
/*    font-weight: 500;*/
/*    padding-left: 0;*/
/*    line-height: 1.3; margin-bottom: 0.2vw;*/
/*}*/

/*.btn-readmore{*/
/*    width:8vw;*/
/*height: 3vw;*/

/*align-content: center;*/
/*border-radius: .3vw;*/
/*background: #02C652;  */

/*margin: 0;*/
/*padding: 0;*/
/*color: #011E19;*/
/*font-size: 1vw;*/
/*font-style: normal;*/
/*font-weight: 700;text-align: center;*/
/*border-color: transparent;*/
/*transition:width  2s;*/

/*align-items: center;*/
/*justify-content: center;*/

/*display: flex;*/
/*flex-direction: column;*/
/*display: inline;*/
/*padding: auto;*/

/*    line-height: normal;*/


/*}*/


/*.btn-readmore:hover{*/
/*    background-color: #D1FDF5;*/
/*    color: black;*/
/*    width: 100%;*/
   
/*}*/

/*.video-box{*/
/*    width: 45%;*/
/*    height: 36.5vw;*/
    
/*    align-items: end;display: flex; justify-content: start;*/
/*    flex-direction: column;*/
/*}*/


/*.video{*/
    /*background-color: rgba(0, 0, 0, 0.7);opacity: 0.80;*/
          
/*            width: 33vw;height: 37vw;*/
/*  object-fit: cover;*/
/*}*/





/*.text-btn{*/
/*    font-style: normal;*/
/*font-weight: 400;*/
/*margin: 0;*/
/*padding: 0;*/
/*color: #011E19;*/
/*font-size: 1vw;*/
/*font-style: normal;*/
/*font-weight: 700;text-align: center;*/
/*}*/


.box-text{
    width: 55%;
    /* height: 36.5vw; */
    height: 463px;
        height: 490px;
    /* margin-left: 10%;
    margin-left: 9vw; */
    margin-left: 120px;
    display: flex; align-content: center; align-items: start;justify-content: start;
   
flex-direction: column;
/* margin-top: 6vw; */
margin-top: 70px;
margin-top: 110px;


text-align: start;

}

.h2-header{
    color: #FFF;
margin-bottom: 0;
/* font-size: 4.1vw; */
font-size: 55px;
font-style: normal;text-align: start;
font-weight: 600;
/* line-height: 3.8vw; */
line-height: 55px;
/*margin-top:20px;*/

}

.p-header{
    padding: 1vw;
    flex-shrink: 0;
    color: #FFF;
    
    text-align: justify;
    
    /* font-size: 1.9vw; */
    font-size:24px;
    font-style: normal;
    font-weight: 500;
    padding-left: 0;
    /* line-height: 1.3;  */
    line-height: 30px; 
    margin-bottom: 10px;
}

.btn-readmore{
    /* width:8vw;
height: 3vw; */

width: 117px;
height: 44px;

align-content: center;
border-radius: 5px;
background: #02C652;  text-align: center; 

font-style: normal;
font-weight: 400;
margin: 0;
padding: 0;
color: #011E19;
font-size: 14px;
font-style: normal;
font-weight: 700;text-align: center;
border-color: transparent;
transition:width  0.5s;
/*2s */
align-items: center;
justify-content: center;

display: flex;
flex-direction:column;
padding: auto;
/* flex-direction: column; */

    line-height: normal;
    
  
}


.btn-readmore:hover{
    background-color: #D1FDF5;
    color: black;
    width: 100%;
   
}

.video-box{
    width: 45%;
    /* height: 36.5vw; */
    height: 463px;
    
    align-items: end;display: flex; justify-content: start;
    flex-direction: column;
}


.video{
    /* background-color: rgba(0, 0, 0, 0.7);opacity: 0.80; */
          
            width: 33vw;height: 37vw;
  object-fit: cover;

  width: 400px;
    height: 463px;
}





/* .text-btn{
    font-style: normal;
font-weight: 400;
margin: 0;
padding: 0;
color: #011E19;
font-size: 1vw;
font-style: normal;
font-weight: 700;text-align: center;
} */

@media(max-width:820px){
    .h2-header{    
    font-size: 55px;
    line-height: 30px;
    margin-bottom: 10px;
    }
    
    .p-header{
        font-size: 19px;
        line-height: 20px;
        margin: auto;
        padding: 10px;
        margin-bottom: 20px;
    }

    .box-text{
        padding: 10px;

        width: 100%;
        margin-left:10px;
        /*align-items: center;*/
/* background-color: gray; */
    }

    .video{
              
                width: 0;height:0;
    }
    .video-box{
        width:0%;
    }

    .btn-readmore{

align-self: flex-start;  

width: 90px;
height: 30px;
font-size: 12px;

}
    
    
}

@media(max-width:1065px){
    .box-text{
    
        margin-left:30px;
        
    }
    .video{
              
        width: 300px;
        /* height: 463px; */
    }

}
@media(max-width: 951px){
    .h2-header{    
        font-size:30px;
        line-height: 30px;
        margin-bottom: 10px;
        }
        
        .p-header{
            /* font-size: 22px; */
            line-height: 20px;
            margin: auto;
            padding: 10px;
            margin-bottom: 20px;
            font-size: 20px;
            padding-left: 0;
        }
}


@media(max-width:970px){
    .h2-header{    
    font-size: 50px;
    line-height: 50px;
    margin-bottom: 10px;
    }
    
    .p-header{
        /* font-size: 22px; */
        line-height: 25px;
        margin: auto;
        padding: 10px;
        margin-bottom: 20px;
        font-size: 20px;
        padding-left: 0;
    }

    .box-text{
        /* padding: 10px; */

        /* width: 70%; */
        margin-left:30px;
        /* align-items: center; */
/* background-color: gray; */
    }

    .video{
              
        width: 300px;
        /* height: 463px; */
    }
    /* .video-box{
        width:30%;
    } */

    .btn-readmore{

align-self: flex-start;  

width: 90px;
height: 30px;
font-size: 12px;

}
    
    
}

@media(max-width:871px){
    .h2-header{    
    font-size: 47px;
    line-height: 40px;
    margin-bottom: 10px;
    }
    
    .p-header{
        line-height: 25px;
        margin: auto;
        padding: 10px;
        margin-bottom: 20px;
        font-size: 20px;
        padding-left: 0;
    }

    .box-text{
    
        margin-left:30px;
    }

    .video{
              
        width: 300px;
    }


    .btn-readmore{

align-self: flex-start;  

width: 90px;
height: 30px;
font-size: 12px;

}
    }
    
    
}

   .br{
    height:10px;    
    }

/* @media(max-width:427px){ */
    @media(max-width:493px){
         .br{
    height:0; 
    display:none;
    }

    .h2-header{    
        font-size: 35px;
        line-height: 35px;
        margin-bottom: 10px;
        /*text-align:left;*/
        }
        
        .p-header{
            /* font-size: 22px; */
            line-height: 25px;
            margin: auto;
            padding: 10px;
            margin-bottom: 20px;
            font-size: 18px;
            padding-left: 0;
        }
        
        .box-text{
        /*padding: 10px;*/

        /*width: 100%;*/
        margin-left:0px;
        align-items: start;
 /*background-color: gray; */
    }
    

}

.top-video{
display:none;  
/*background-color:green;*/
height:200px;width:100%
}

@media(max-width:489px){

        
         .h2-header{    
        font-size: 35px;
        }
        
        .p-header{
            line-height: 25px;
           
            font-size: 20px;
                        /*font-size: 15px;*/
            padding-left: 0;
        }
        
        .box-text{
        padding: 0px;
        padding-left:10px;

        /*width: 100%;*/
        margin-left:0px;
        align-items: start;
 /*background-color: gray; */
    }
        
}


@media(max-width:415px){
.top-video{
            display:flex;
        }  
        
         .h2-header{    
        font-size: 40px;
        line-height: 35px;
        /*margin-bottom: 10px;*/
        }
        
        .p-header{
            /* font-size: 22px; */
            line-height: 25px;
            /*margin: auto;*/
            /*padding: 10px;*/
            /*margin-bottom: 20px;*/
            font-size: 16px;
                        font-size: 15px;
            padding-left: 0;
        }
        
        .box-text{
        padding: 0px;
        padding-left:10px;

        /*width: 100%;*/
        margin-left:0px;
        align-items: start;
 /*background-color: gray; */
    }
        
}

@media(max-width:327px){
    .h2-header{    
        font-size: 30px;
        line-height: 25px;
        margin-bottom: 10px;
        }
        
        .p-header{
            /* font-size: 22px; */
            line-height: 25px;
            margin: auto;
            padding: 10px;
            margin-bottom: 20px;
            font-size: 16px;
                        font-size: 15px;
            padding-left: 0;
        }
        
        
    

}