.vibg{
    background-image: url(../img/index/vi-bg.jpg);
    width: 100%;
    height: 100%;
    background-size:cover ;
    background-position: center top;
    position: fixed;
    z-index: 0;

}
.vibg2{
    width: 100%;
    height: 100%;
    z-index: 2 !important;
    position: fixed;
    background-color: rgba(0,0,0,0.3);   
}
.vi-sand{
    width: 90vw;
    position: fixed;
    z-index:4;
   left: 50%;
   top:-5%;
   margin-left: -45vw;
}
@media screen and (min-width: 768px) {
    .vi-sand{
        width: 70vw;
    left: 50%;
    top:-15%;
    margin-left: -35vw;
    }
}

/*wrapper-boat------------------------------
------------------------------------*/
.section-boat{
    position: absolute;
    z-index: 0;
    width: 60%;
    top:0;
    left: 0;
}
.section-boat img{
    margin-left: -11%;
    margin-top: -8%;
    width: 100%;
}
.textboat2{
    position: absolute;
    z-index: 1;
    left:0%;
    bottom: 10%;
}
@media screen and (min-width: 768px) {
.section-boat{
    width: 35%;
}
}
/*section------------------------------
------------------------------------*/
.p201p{display: block;border-radius: 20px;width: 100%;margin-top: 1rem;}
@media screen and (min-width: 768px) {
    .section2 {
    background: 
        linear-gradient(to right, rgba(1,106,184,1) 20%, rgba(1,106,184,0) 100%),
        url(../img/underwater/bg1.jpg);
    background-size:auto 100% ;
    background-position:right center ;
    background-color:#016ab8;
    background-repeat:no-repeat;
    padding: 2.5rem;
    border-radius: 20px;
    }
    .w201,.p201{
        flex:0 0 auto;
        width: 60%;
    }
    .text201{margin-left: 40%;}
    .p201p{display: none;}
}

/*wrappertools------------------------------
------------------------------------*/
.wrappertools{
    margin-top: 1.5rem;
}
.wrappertools article{
    padding: 1rem;;
}
.col-3p{
    flex:0 0 auto;
    width: 30%;
}
.col-3w{
    flex:0 0 auto;
    width: 70%;
    font-size: 0.9rem;
    border-left: 1px solid rgba(255,255,255,0.3);
    padding-left: 1rem;

}
.boxw__T{
    font-size: 1.2rem;
    font-weight: bold;
    margin-bottom: 0.5rem;
}
.figure3{
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}
.bg-sec5{
    position: absolute;
    z-index: 0;
    right: -10%;
    top: -5%;
    width:50%;
    opacity: 0.8;
}
.vi-bg3{
    position: fixed;
    z-index: 1;
    left: -17%;
    bottom: 0%;
    width: 50%;
    opacity: 0;
}
.vi-bg4{
    position: fixed;
    z-index: 1;
    right: -5%;
    bottom: 0%;
    width: 30%;
    opacity: 0;
}
@media screen and (min-width: 768px) {
    .bg-sec5{
          top: -13%;
       }
       .vi-bg3{
        bottom: -20%;
        opacity: 0;
    }
    .vi-bg4{
         bottom: -15%;
        opacity: 0;
    }
}