
*{
    margin: 0%;
    padding: 0%;
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    box-sizing: border-box;
}

.nav{
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: rgb(240, 234, 234);
    padding: 0px 30px ;
    height: 80px;
    width: 100%;
    position: fixed;
}
.nav .img{
    width: 300px;
    align-items: center;   
}
.nav .memubar ul{
    display: flex;
    list-style: none;
    justify-content: space-evenly;
    align-items: center;
    width: 700px;
}
.nav .memubar a:hover{
    color: #4c08f8;
    
}
.nav .memubar a{
    text-decoration: none;
    color: black;
    font-size: large;
}
.nav .btns{
    width: 300px; 
    display: flex;
    justify-content: space-evenly;
    align-items: center;
}
.nav .btns button:hover{
	cursor: pointer;
	background: #4c08f868;
	border: none;	
}
.nav .btns button{
    cursor:pointer;
    background-color: #4c08f8;
    color: white;
    border: 1px solid #4c08f8;
    padding: 10px 10px;
    border-radius: 20px;
    transition: 3s;
}

.home{
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    width: 100%;
    height: 100vh;
}

.home .homeleft{
    width: 40%;
    height: 100vh;
    margin-top: 20%;
}
.home .homeleft h1{
    margin-left: 5%;
    font-size:50px;
}
.home .homeleft p{
    margin-left: 10%;
}
.home .homeleft img{
    margin-left: 10%;
}
.home .homeleft .google p{
    margin-left: 120px;
    font-size: large;
}
.home .homeleft .google .g1{
    margin-left: 130px;
    color: goldenrod;
    font-size: large;
}


.home .homeright{
    width: 60%;
    background-color: rgb(254, 253, 249);
    height: 100vh;
    display: flex;
    justify-content: space-evenly;
}

.home .homeright .hr1{
    width: 20%;
    border: 1px solid black;
    border-radius: 10%;
    font-size: smaller;
    margin-top: 15%;
    width: 350px;
    height: 470px;
    
}
.home .homeright .hr1:hover{
    box-shadow: 4px 4px 2px 2px rgb(43, 41, 41);
    cursor: pointer;
}
.home .homeright .hr1 img{
    margin: 0px 2px;
}
.home .homeright .hr1 p{
    font-size: larger;
    margin-left: 10px;
}
.home .homeright .hr1 .hr11 button{
    background-color: #4c08f8;
    color: #fff;
    margin:10px 10px;
    width: 200px; 
    padding: 10px 10px;
    border-radius: 20px; 
    border: #4c08f8;
}
.home .homeright .hr1 .hr11 button:hover{
    cursor: pointer;
	background: #4c08f868;
	border: none;

}

.home .homeright .hr1 .hr11 p{
    font-size: larger;
}

.home .homeright .hr2{
    width: 20%;
    border: 1px solid black;
    border-radius: 10%;
    font-size: smaller;
    margin-top: 15%;
    width: 350px;
    height: 470px;   
}
.home .homeright .hr2:hover{
    box-shadow: 4px 4px 2px 2px rgb(43, 41, 41);
    cursor: pointer;
}
.home .homeright .hr2 img{
    margin: 0px 2px;
}
.home .homeright .hr2 p{
    font-size: larger;
    margin-left: 10px;
}
.home .homeright .hr2 .hr22 button{
    background-color: #4c08f8;
    color: #fff;
    margin:10px 10px;
    width: 200px; 
    padding: 10px 10px;
    border-radius: 20px; 
    border: #4c08f8;
}
.home .homeright .hr2 .hr22 button:hover{
    cursor: pointer;
	background: #4c08f868;
	border: none;
	

}
.home .homeright .hr2 .hr22 p{
    font-size: larger;
}

.homemiddle h1{
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: xx-large;
    text-decoration: underline;
    text-decoration-style:dotted;
}

.homemiddle img{
    display: flex;
    justify-content: center;
    align-items: center;
}

.popularcourses{
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    width: 100%;
    height: 100vh;
}


.h1class{
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 10px 0px -70px 0px;
}
.popularcourses .pcbox1{
    width: 100%;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    margin: 0px 20px 0px 20px;
    border: 0px solid black;
}

.popularcourses{
    width: 1200px;
    margin-left: 50px;
}
.popularcourses2{
    width: 1200px;
    margin-left: 50px;
}

.popularcourses .pcbox1 .box{
    border: 10px solid rgb(250, 248, 248);   
    border-radius: 10%;
    width: 270px;
    
}
.popularcourses .pcbox1 .box:hover{
    cursor: pointer;
}

.popularcourses .pcbox1 .box img{
    width: 250px;
    height: 230px;   
    border-radius: 10%;
}
.popularcourses .pcbox1 .box h1{
    width: 300px;
    font-size: large;
}

.popularcourses2 .pcbox2{
    width: 100%;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    border: 0px solid black;
    margin-top: -5%;
}
.popularcourses2 .pcbox2 .box{
    border: 10px solid rgb(250, 248, 248);
    border-radius: 10%;
    margin: 10px 5px 10px 5px;
    width: 270px;
    
}
.popularcourses2 .pcbox2 .box:hover{
    cursor: pointer;
}

.popularcourses2 .pcbox2 .box img{
    width: 250px;
    height: 230px;
    border-radius: 10%;   
}
.popularcourses2 .pcbox2 .box h1{
    width: 300px;
    font-size: large;
}

.btns2{
    color: #fff;
}
.btns2 button{
    width: 300px; 
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    background-color: #4c08f8;
    border: 1px solid #4c08f8;
    padding: 10px 10px;
    border-radius: 20px;
}
.btns2 a{
    color: #fff;
    font-size: 20px;
    text-decoration: none;
}
.btns2 button:hover{
	cursor: pointer;
	background: #4c08f868;
	border: none;	
}
.updates{
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 40px;
}
.updates2{
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    width: 100%;
}
.updates2 .updatesimg img{
    display: flex;
    justify-content: end;
    border-radius: 10%;
}

.updates2 .updatescontent{
    margin-left: 1%;
}
.footer{
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    width: 100%;
    background-color: black;
    color: #fff;
    padding: 30px ;
}
.footer .f1{
    width: 20%;
}
.footer2{
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: black;
    color: #fff;
}

.content{
    padding-top: 5%;
    display: inline-flex;
    justify-content: center;
    width: 100%;
  
}


.content .contleft1{
    width: 35%;
}
.content .contright{
    width: 70%;
    
}
.content .contright h6{
    font-size: larger;
    color: #7d4cf9;
}
.content .contright h3{
    font-size: xx-large;
}
.content .contright p{
    font-size: medium;
    color: gray;
}

.content .contright .contright1 h5{
    display: inline-block;
    justify-content: space-between;
    align-items: center;
    padding-right: 35px;
    font-size: larger;
    color: rgb(61, 57, 57);
}
.content .contright .contright2 h5{
    display: inline-block;
    justify-content: space-between;
    align-items: center;
    padding-right: 35px;
    font-size: larger;
    color: rgb(61, 57, 57);
}

.testimonials{
    background-color: whitesmoke;
    height: 80px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.ttbtns1{
    width: 800px;
    margin-left: 20%;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    
}
.ttbtns1 button{
    
    background-color: #4c08f8;
    border: #4c08f8;
    color: #fff;
    border-radius: 10%;
    height: 30px;
    font-size: large;
    margin:10px 10px;
    margin-top: 20px;
    width: 200px; 
    padding: 20px 10px;
    border-radius: 20px; 
    display: flex;
    justify-content: center;
    align-items: center;
}
.ttbtns2{
    width: 800px;
    margin-left: 20%;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    
}
.ttbtns2 button{
    
    background-color: #4c08f8;
    border: #4c08f8;
    color: #fff;
    border-radius: 10%;
    height: 30px;
    font-size: large;
    margin:10px 10px;
    width: 200px; 
    padding: 20px 10px;
    border-radius: 20px; 
    display: flex;
    justify-content: center;
    align-items: center;
}
.ttbtns3{
    width: 800px;
    margin: 0% 20%;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    
}
.ttbtns3 button{
    
    background-color: #4c08f8;
    border: #4c08f8;
    color: #fff;
    border-radius: 10%;
    height: 30px;
    font-size: large;
    margin:20px 10px;
    width: 200px; 
    padding: 10px 5px;
    border-radius: 20px; 
    display: flex;
    justify-content: center;
    align-items: center;
}
.contactus1{
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: whitesmoke;
    height: 80px;
}
.contactus2{
    width: 100%;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
}
.contactus2 .contactusleft{
    width: 45%;
}

.contactus2 .contactusleft .culeft1 #p1{
    color: #4c08f8;
}
.contactus2 .contactusleft .ctleft2{
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 30px;
}
.contactus2 .contactusleft .ctleft3{
    display: flex;
    align-items: center;
    gap: 30px;
}
.contactus2 .contactusleft .ctleft4{
    display: flex;
    align-items: center;
    gap: 30px;
}
.contactus2 .contactusright{
    display: inline;
    justify-content: center;
    align-items: center ;
    border-radius: 10%;  
    background-color: rgb(239, 83, 83);
    width: 45%;
    color: white;
}
.contactus2 .contactusright h1{

}
