body{
    font-family: "Optima"!important;
}
.height1{
    height: 400px!important;
}
.logo1{
    height: 80px;
    width: 260px;
  
}
.logo2{
    height: 80px;
    width: 260px;
  
}
.hf{
    font-size: 20px!important;
    font-family: "Optima"!important;
}
.text{
    text-align: center;
}
.text4{
    text-align: center;
    color: #000!important;
}
.footer1{
    align-items: center;
    justify-content: center;
}
.benfits{
    padding: 20px;
}
.fa-angles-right{
    color: #33B3EC;
    font-family: fontawesome!important;
    margin-right: 20px!important;
}
.text2{
    font-weight: 600;
    text-align: start;
}
.text2:hover{
    color: #fcc603!important;
}
.title1{
    color: blue;
}
.banner1{
    height: 95vh!important;
    position: relative;
    top: 0;
    left: 0;
    padding: 30px 0 50px!important;
}
.title2{
    color: #000!important;
    padding-top: 20px!important;
    display: flex;
    text-align: start;
}
.title3{
    font-weight: 500!important;
}
.li1{

    color: #65C6E7;
    font-size: 20px;
    font-weight: 600!important;
    padding: 10px 20px 10px;
    position: relative;
    top: 0;
    left: -100%;
}
.li2{

    color: #0177BD;
    font-size: 20px;
    font-weight: 600!important;
    padding-left: 50px;
    position: relative;
    top: 0;
    left: -100%;
}
.li3{

    color: #67A4BA;
    font-size: 20px;
    font-weight: 600!important;
    margin-bottom: 30px;
    padding-left: 50px;
    position: relative;
        top: 0;
        left: -100%;
    
}
.li4{

    color: lightblue;
    font-size: 20px;
    font-weight: 600!important;
        padding-left: 50px;
        position: relative;
        bottom: 0;
        left: -100%;
}
.li5{

    color: #379BA2;
    font-size: 20px;
    font-weight: 600!important;
    padding-left: 50px;
    position: relative;
        bottom: 0;
        left: -100%;
}
.li6{

    color: #17AFB3;
    font-size: 20px;
    font-weight: 600!important;
        padding-left: 50px;
        position: relative;
        bottom: 0;
        left: -100%;
}
.span1{
    color: #000!important;
    font-weight: 500!important;
    font-size: 16px!important;
}
.img33{
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    position: absolute;
    left: 0%;
    top: -25%;
}
.img22{
    position: relative;
}
.img22:hover .li6{
    left: 0;
    transition: all .1s;
}
.img22:hover .li5{
    left: 0;
    transition: all .2s;
}
.img22:hover .li4{
    left: 0;
    transition: all .3s;

}
.img22:hover .li3{
    left: 0;
    transition: all .4s;

}
.img22:hover .li2{
    left: 0;
    transition: all .5s;

}
.img22:hover .li1{
    left: 0;
    transition: all .6s;

}
.p1{
    height: 74vh;
}
.banner2{
    height: 65vh!important;
}
.banner3{
    padding-top: 50px;
}
.banner4{

}
.map1{
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    height: 848px;
    position: relative;
}
.point1{
    position: absolute;
    left: 52%;
    top: 23.5%;
    color: #0177BD;
    font-weight: 600;
}
.point2{
    position: absolute;
    left: 34.5%;
    top: 35%;
    color: #0177BD;
    font-weight: 600;
}
.point3{
    position: absolute;
    left: 31%;
    top: 17.8%;
    color: #0177BD;
    font-weight: 600;
}
.point4{
    position: absolute;
    left: 38%;
    top: 20%;
    color: #0177BD;
    font-weight: 600;
}
.point5{
    position: absolute;
    left: 27%;
    bottom: 18%;
    color: #0177BD;
    font-size: 15px;
    font-weight: 600;
}
.point6{
    position: absolute;
    right: 48%;
    bottom: 40%;
    color: #0177BD;
    font-weight: 600;
}
.point7{
    position: absolute;
    left: 12.5%;
    top: 47.5%;
    color: #0177BD;
    font-weight: 600;
}
.point8{
    position: absolute;
    right: 26.5%;
    top: 18%;
    color: #0177BD;
    font-weight: 600;
}
.point9{
    position: absolute;
    right: 41%;
    bottom: 48.5%;
    color: #0177BD;
    font-weight: 600;
}
.point10{
    position: absolute;
    left: 26%;
    top: 30%;
    color: #0177BD;
    font-weight: 600;
}
.point11{
    position: absolute;
    right: 47%;
    top: 45%;
    color: #0177BD;
    font-size: 15px;
    font-weight: 600;
}
.point12{
    position: absolute;
    left: 26%;
    bottom: 45%;
    color: #0177BD;
    font-weight: 600;
}
.point13{
    position: absolute;
    left: 19%;
    bottom: 43%;
    color: #0177BD;
    font-size: 15px;
    font-weight: 600;
}
.point14{
    position: absolute;
    left: 32%;
    bottom: 23%;
    color: #0177BD;
    font-size: 15px;
    font-weight: 600;
}
.point15{
    position: absolute;
    left: 28%;
    bottom: 30%;
    color: #0177BD;
    font-size: 15px;
    font-weight: 600;
}
.point16{
    position: absolute;
    left: 38%;
    bottom: 32%;
    color: #0177BD;
    font-size: 15px;
    font-weight: 600;
}
.point17{
    position: absolute;
    right: 35%;
    top: 31%;
    color: #0177BD;
    font-size: 15px;
    font-weight: 600;
}
@media screen and (max-width: 477px){
    .fa-angles-right{
        margin-right: 10px!important;
    }
    .p1{
        height: 30vh;
    }
    .logo1{
        height: 50px!important;
        width: 250px!important;
    }
      .logo1{
        height: 90px!important;
        width: 280px!important;
    }
    .text2{
 font-size: 11px!important;
 font-weight: 500!important;
}
    .banner2{
        height: 40vh!important;
    }
    .banner1{
        height: 140vh!important;
        position: relative;
        top: 0;
        left: 0;
        padding: 30px 0 50px!important;
    }
    .img22{
       position: relative;
    }
    .img33{
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        position: absolute;
        left: -10%!important;
        top: -25%;
        
    }
    .c1{
    }
    footer{
        padding-top: 150px!important;
    }

    .banner4{

    }
    .map1{
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        height: 340px;
        position: relative;
    }
    .point1{
        position: absolute;
        left: 52%;
        top: 23.5%;
        font-size: 10px;
        color: #0177BD;
        font-weight: 600;
    }
    .point2{
        position: absolute;
        left: 27%;
        top: 35%;
        font-size: 10px;
        color: #0177BD;
        font-weight: 600;
    }
    .point3{
        position: absolute;
        left: 22%;
        top: 17.8%;
        font-size: 10px;
        color: #0177BD;
        font-weight: 600;
    }
    .point4{
        position: absolute;
        left: 33%;
        top: 20%;
        font-size: 10px;
        color: #0177BD;
        font-weight: 600;
    }
    .point5{
        position: absolute;
        left: 25%;
        bottom: 10%;
        font-size: 10px!important;
        color: #0177BD;
        font-weight: 600;
    }
    .point6{
        position: absolute;
        right: 45%;
        bottom: 40%;
        font-size: 10px!important;
        color: #0177BD;
        font-weight: 600;
    }
    .point7{
        position: absolute;
        left: 0%;
        font-size: 10px;
        top: 47.5%;
        color: #0177BD;
        font-weight: 600;
    }
    .point8{
        position: absolute;
        right: 16%;
        top: 18%;
        font-size: 10px!important;
        color: #0177BD;
        font-weight: 600;
    }
    .point9{
        position: absolute;
        right: 35.8%;
        bottom: 48.5%;
        font-size: 10px;
        color: #0177BD;
        font-weight: 600;
    }
    .point10{
        position: absolute;
        left: 16%;
        top: 30%;
        font-size: 10px;
        color: #0177BD;
        font-weight: 600;
    }
    .point11{
        position: absolute;
        right: 43%;
        top: 45%;
        color: #0177BD;
        font-size: 10px!important;
        font-weight: 600;
    }
    .point12{
        position: absolute;
        left: 15%;
        bottom: 45%;
        font-size: 10px;
        color: #0177BD;
        font-weight: 600;
    }
    .point13{
        position: absolute;
        left: 5%;
        bottom: 43%;
        color: #0177BD;
        font-size: 10px!important;
        font-weight: 600;
    }
    .point14{
        position: absolute;
        left: 24%;
        bottom: 22%;
        color: #0177BD;
        font-size: 10px!important;
        font-weight: 600;
    }
    .point15{
        position: absolute;
        left: 18%;
        bottom: 30%;
        color: #0177BD;
        font-size: 10px!important;
        font-weight: 600;
    }
    .point16{
        position: absolute;
        left: 32%;
        bottom: 30%;
        color: #0177BD;
        font-size: 10px!important;
        font-weight: 600;
    }
    .point17{
        position: absolute;
        right: 26%;
        top: 31%;
        color: #0177BD;
        font-size: 10px!important;
        font-weight: 600;
        
    }

    .img22:hover .li6{
        left: 15%;
        transition: all .1s;
    }
    .img22:hover .li5{
        left: 15%;
        transition: all .2s;
    }
    .img22:hover .li4{
        left: 15%;
        transition: all .3s;
    
    }
    .img22:hover .li3{
        left: 15%;
        transition: all .4s;
    
    }
    .img22:hover .li2{
        left: 15%;
        transition: all .5s;
    
    }
    .img22:hover .li1{
        left: 15%;
        transition: all .6s;
    
    }
    .li1{
    font-size: 18px!important;
    font-weight: 500!important;
}
.li2{

    font-size: 18px!important;
    font-weight: 500!important;
}
.li3{

    font-size: 18px!important;
    font-weight: 500!important;
        margin-bottom: 25px!important;
    
}
.li4{

    font-size: 18px!important;
    font-weight: 500!important;
        margin-bottom: 40px!important;
}
.li5{

    font-size: 18px!important;
    font-weight: 500!important;
}
.li6{
    font-size: 18px!important;
    font-weight: 500!important;
}
.span1{
    font-weight: 500!important;
    font-size: 14px!important;
}
    
}
@media screen and (max-width: 358px){
    .p1{
    height: 50vh!important;
}
.banner2{
    height: 60vh!important;
}
.text2{
 font-size: 11px!important;
 font-weight: 500!important;
}
.z1{
    font-size: 14px!important;
}
 .banner1{
        height: 200vh!important;
    }
    
    .title2{
    font-size: 14px!important;
}

    
}