*{
    padding:0;
    margin:0;



}



body {

    margin: 0px;
    padding: 0px;
    

}

p {


    font-family:'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
    color:rgb(40, 42, 62);
}


h2, h1, h3, h4 {

    font-family:'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
    font-weight:1600;
     color:rgb(40, 42, 62);
    
    }




   .shortinfomenu {
    
    
        display:flex;
        align-items: center;
        justify-content: space-between;
        background: linear-gradient(90deg, hsla(157, 77%, 57%, 1) 22%, hsla(214, 88%, 61%, 1) 100%);
        height: 40px;
        color:white;
        padding-top: 10px;
        padding-left: 20px;
        padding-right: 20px;
    
    }


       .shortinfomenu  p         {


                    color: white;

                }
    


    ul li:hover {

            background-color: rgb(45, 200, 135);
            border-radius: 5px;
    }

    .topinfo {

        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;

    }


    .topinforight {

        display: flex;
        flex-direction: row;
        justify-content: space-between;


    }



    .menu {
    
    
    display:flex;
    justify-content: space-between;
    background-color:white;
    color:white;
    height: 100px;
    align-items: center;
    padding-left: 20px;
    padding-right: 20px;
    }
    


    .ullist li {


        display: inline-block;
        text-decoration: none;
       margin-left: 10px;
       color:rgb(40, 42, 62);
       height: 40px;
       width: 110px;
       text-align: center;
        padding-top: 10px;
        font-family:'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
        cursor: pointer;
        
    }


 
 
    .banner {

      
        height:55vh;
        display: flex;
        flex-direction: column;
        justify-content: center;
        overflow: hidden;
    }



 


    .imgs {
	
        width: 100%;
        height: 100%;
       
        
    }
    
    
    .content {
    
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 0px;
    padding: 0px;
    left:0;
    background-color: aqua;
    }


  
   .about {

        display:inline-flex;
        flex-direction: column;
        
        align-items: center;
        padding-top: 50px;
        background-color: rgb(240, 238, 238);
        padding-bottom: 20px;
    }


    .about h2 {

        font-size:3vw;

    }

    .pannels {

        display: flex;
        flex-direction: row;
        justify-content: center;
        margin-top: 20px;
        margin-bottom: 30px;
        flex-wrap: wrap;
    }


    .pannelcard {


        background-color: white;
        height: 30vh;
        margin-left: 20px;
        display: flex;
        flex-direction: column;
        align-items: center;
        padding:15px;
        
    }


    .pannelcard h4 {


        color:rgb(40, 42, 62);


    }



    .pannelimg {


            width: 90px;
            height: 90px;
            border-radius: 45px;




    }

    .pannelcard p {

        margin-top: 30px;


    }

    .h3research {
        margin-top:40px;
        margin-bottom: 40px;
            display: flex;
            justify-content: center;
            align-items: center;
    }

    .research {

        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        flex-wrap: wrap;
        height: auto;
        background-color:rgb(40, 42, 62);
       



    }


    .researchcard {


        
        height: 30vh;
        display: flex;
        flex-direction: column;
        align-items: center;
        padding-left: 20px;
        padding-right: 20px;
       color: rgb(45, 200, 135);
       

    }

    .researchcard > * {

            margin-bottom: 40px;
            
    }


    .researchcard p, h4  {

            color:white;
           

    }

    .research h2 {

        font-size: 3vw;
        color:rgb(45, 200, 135);
        margin-bottom: 20px;
    }


    .infobanner {


        height: 100px;
        background: linear-gradient(90deg, hsla(157, 77%, 57%, 1) 22%, hsla(214, 88%, 61%, 1) 100%);
        display: flex;
        flex-direction: row;
        justify-content:space-around;
        align-items: center;
        
    }

    .contactbtn {


        width: 200px;
        border: 0;
        background-color:rgb(40, 42, 62) ;
        color:white;
        font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
        height: 50px;

    }

    .windows {

        background-color: rgb(240, 238, 238);
        height: auto;
        display: flex;
        flex-wrap: wrap;
        


    }


    .reviews {

        display: flex;
        flex-direction: row;
        overflow: hidden;
        align-items: center;
        



    }


    .reviewcard {

        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        background-color: rgb(235, 235, 255);
        height: 400px;
        padding: 30px;
        margin-right: 10px;
        
    
    
    }   


    .reviewimg {


        width: 80px;
        height: 80px;
        border-radius: 40px;


    }

    .h3window {

        color: white;
        font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
        font-size: 2vw;


    }

    .reviewsp {

        color:white;
        font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
        font-size:20px ;

    }


    .stars   {



        width: 120px;
        height: 20px;


    }



    #reviewbtn {

        margin-top: 50px;
        height: 40px;
        background-color: rgb(45, 200, 135);
        color:rgb(40, 42, 62);
        border: none;
        font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;


    }


    .leftwindow {

        height: 800px;
       align-items: center;
        background-color: rgb(63, 84, 243);
        display: flex;
        flex-direction: column;
        padding: 30px;
        overflow: hidden;


    }



    .rightwindow {


        height: 800px;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;

    }

    .smallwindow {

        height: 400px;
        background-color: aqua;


    }


    .smwindow1 {

            background-color: rgb(40, 42, 62);
            background-image: url(images/image2.jpg);
            background-position: cover;
            position: relative;
    }

    .overlayp {



        color:white;
    }


.smwindowoverlay {

    background-color: rgb(40, 42, 62, .9);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding-left: 30px;
    padding-top: 30px;

}


.smwindowoverlay button {

    border: none;
    background-color: rgb(63, 84, 243);
    width: 200px;
    font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
    color: white;
}

.smwindowoverlay2 {

    background-color: rgba(45, 200, 135, 0.9);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding-left: 30px;
    padding-top: 30px;

}


.smwindowoverlay2 button {

    border: none;
    background-color: rgb(63, 84, 243);
    width: 200px;
    font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
    color: white;
}


    .smwindow2 {

        background-color: rgb(236, 237, 243);
        background-image: url(images/image5.jpg);
        background-position: cover;
        position: relative;
    }


    .smwindow3 {

    background-color:white;
    background-image: url(images/image7.jpg);
    background-position: cover;
    position: relative;
    }


    .smwindow4 {

    background-color: rgb(40, 42, 62);
    background-image: url(images/image6.jpg);
    background-position: cover;
    position: relative;
    }




.quote {
        
        display: flex;
        flex-direction: column;
        justify-content:space-between;
        align-items: center;
        height: auto;
        padding: 50px;
        background-color: rgb(240, 238, 238);
       

}



.quoteh2 {

    font-family:'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
    font-size: 3vw;
    color: rgb(45, 200, 135);


}

.quoteform {

        display: flex;
        height: auto;
       background-color: white;
       padding: 50px;

}


form {

    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
 
}

.input {


  padding: 10px;
  
}

.message {

    height: auto;
    margin-top: 10px;
    margin-bottom: 10px;
}

.name {

    margin-top: 10px;
    margin-bottom: 10px;
   
}

.lastname {

    margin-top: 10px;
    margin-bottom: 10px;

}

.footer {


height: 400px;
background-color: rgb(40, 42, 62);
display: flex;
flex-wrap: wrap;
justify-content: space-around;
padding-top: 50px;

}



.footerh2 {


 color:white;


}


footer p {


    color:white;
}

footer li {

    color:white;
    text-decoration: none;
    display: flex;

}


.footerul {


    text-decoration: none;
    display: flex;
    flex-direction: column;
}






@media (max-width: 576px) { 



        .banner {

            height:35vh;
        }

        .pannelcard {

            height:18vh;
            margin-bottom: 10px;

        }


        .leftwindow {

            height: 600px;
        }

        .h3window {

            font-size: 5vw;

        }

        .reviewcard {

            height: 25vh;
          

        }

























 }     
 
 
 
 
 
 @media (min-width: 576px) and (max-width: 767.98px) { 



            .reviewcard {

                height: 25vh;
              
    
            }



            .pannelcard {

                margin-bottom: 10px;
                height: 20vh;

        }
    





         }



 @media (min-width: 768px) and (max-width: 991.98px) { 



        .pannelcard {

                margin-bottom: 10px;
                height: 20vh;
        }

    .reviewcard {

        height: 25vh;
      

    }




  }



  @media (min-width: 992px) and (max-width: 1199.98px) { 



    .pannelcard {

        margin-bottom: 10px;
        height: 20vh;
}


    .reviewcard {

        height: 25vh;
      

    }




}