@import url('https://fonts.googleapis.com/css2?family=Poppins&display=swap');
*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Poppins', sans-serif;
}
nav{
    display: flex;
    justify-content: space-around;
    align-items: center;
    padding: 1em;
}
.hero{
    height: 100vh;
    background-image: url(https://th.bing.com/th/id/OIP.u2vjKZq1LW-N2vvHLbLKlgAAAA?pid=ImgDet&rs=1);
}
.logo{
    color: white; 
}
span{
    
    color: red;
}
ul{
    display: flex;
    justify-content: space-between;
    align-items: center;
    list-style: none;
    width: 50%;
}
ul li a{
    text-decoration: none;
    margin-top:4em ;
    color:white ;
   
}
.btn{
    background-color: red;
    color: white;
    padding: 1em 3em;
    outline: none;
    border: none;
    border-radius: 20px;
}
.infos h1,h2 p, button{
color: white;
margin-bottom: 0,5cm;
}
.infos{
    position: absolute;
    top: 50%;
    left: 18%;
}
.infos h1{
    font-size: 50px;

}
.infos h2{
    color: white;

}
.infos p{
    width: 40%;
    color: white;
}
.infos button{
    background-color: red;
    color: white;
    padding: 1em 3em;
    outline: none;
    border: none;
    border-radius: 20px;
}
.aboutme{
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 50%;
    margin: auto;
}
li a{
    color: red;
}
.lo{
    margin-left: 15%;
   
   margin-top:50%;
}
.lo img{
    width: 225px;
    border: solid white 2px;
}
.kk h1{
    color: brown;
   margin-left: 40%;
   margin-top: -25%;
}
.kk p{
    color: white;
    margin-left: 40%;
    margin-top: %;
}
.nn h1{
    color: white;
    margin-left: 20%;
    margin-top: 15%;
}
 .aa section{
    background-color: blueviolet;
    width: 15%;
   
    }


.aa h2{
    color: brown;
    margin-left: 30%;
}
.zz section {
        background-color:royalblue;
        width: 25%;
       margin-left: 25%;
       margin-top: -22%;
        }
.zz h2{
 color: brown;
 margin-left: 30%;
}
.VV section {
    background-color:white;
    width: 25%;
   margin-left: 55%;
   margin-top: -22%;
    }
    .VV h2{
        color: brown;
        margin-left: 28%;
      
       }
       footer{
        background-color: green;
       }
       .xx p{
        color: white;
       }
       .xx u{
        color: white;
        font-size: 12px;
       }
       .qq p{
        color: white; margin-left: 25%;
        margin-top: -10%;
       }
       .qq u{
        color: white;
        margin-left: 25%;
        margin-top: -15%;
        font-size: 12px;
       }
       .ff u{
        color: white;
        margin-left: 45%;
        margin-top: -15%;
        font-size: 12px;
    }
    .ff p{
        color: white;
        margin-top: -9%;
        margin-left: 45%;
    } 
    .HH u{
        color: white;
        margin-left: 65%;
        margin-top: -15%;
        font-size: 12px;
    }
    .HH p{
        color: white;
        margin-top: -12%;
        margin-left: 65%;
    } 
    

    .tt img{
        width: 80px;
        border-radius: 75%;
        margin-left: 30%;
    
    }
    .ut img{
        width: 80px;
        border-radius: 75%;
        margin-left: 40%;
        margin-top: -25%;
    }
    .Pt img{
        width: 80px;
        border-radius: 75%;
        margin-left: 60%;
        margin-top: -19%;
    
    }