*{
    margin: 0;
    box-sizing: border-box;
}
header{
    background-color: rgb(212, 56, 56);
    /* height: 60px; */
    min-height: 60px;
    height: auto;
      background-color: #669ac7;
      margin: 0 30px 20px;
      border-radius: 0px 0px 10px 10px;
}
header #navgtion{
    padding-top: 20px;
}
header #navgtion ul {
    padding-right: 0px;
  display: flex; 
  flex-direction: row;
justify-content: space-evenly;
flex-wrap: wrap;
}
header #navgtion ul li{
    list-style: none;
font-size: 20px;
}
header #navgtion ul li a{
color: rgb(0, 0, 0);
text-decoration: none;
}
header #navgtion ul li a:hover{
color: rgb(255, 197, 91);
}
.welcome{
    height:30vh ;
    background-color: #0074d9;
    margin-bottom: 50px;
}

.welcome .welcome_word h2,
.welcome .welcome_word h3{
    color: white;
}
.welcome .welcome_word h2{
    font-size: 50px;
    margin-bottom: 20px;
}
.welcome .welcome_word h3{
    font-size: 25px;
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
}
.welcome .welcome_word{
    padding-top:35px ;
    text-align: center;
}
.benfit{
    background-color: white;
    min-height: 500px;
    height: auto;
    margin: 0 30px;
    box-shadow: 10px 10px 10px 10px rgba(0, 0, 0, 0.1);
    border-radius: 10px;
    margin-bottom: 30px;
    padding-top: 10px;
}
.benfit h2{
    text-align: center;
    font-size: xx-large;
font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
}
.benfit_display{
    display: flex;
    justify-content: space-evenly;
    padding-top: 100px;

}
.benfit_box{
    height: 300px;
    width: 400px;
    background-color: rgb(224, 243, 255);
    text-align: center;
    border-radius: 10px;
    padding-top: 10px;
}
.benfit_box:hover{
  transform: translateY(-5px);
}
.benfit_box h2,h3{
    margin-top: 10px;
}
.benfit_display h2{
    color: #0074d9;
}
.benfit_display h3{
    color: black;
font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;

}
.benfit_display img{
height: 130px;
width: 130px;
}
.teacher{
    background-color: white;
    /* height: 380px; */
 min-height: 380px;
 height: auto;
    margin: 30px 30px;
    box-shadow: 10px 10px 10px 10px rgba(0, 0, 0, 0.1);
    border-radius: 10px;
}
.teacher h2{
    display: flex;
    justify-content: center;
   padding-top: 40px;
   font-size: xx-large;
   font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
}
.teacher_group{
display: flex;
justify-content: space-evenly;
margin-top: 60px;
}
.teachers{
display: flex;
   height: 120px;
    width: 250px;
    border-radius: 10px;
justify-content: center;
align-items: center;
}
#teachers1{
    background-color: rgb(15, 15, 15,0.2);
}
#teachers2{
    background-color: rgba(43, 1, 230, 0.2);
}
#teachers3{
    background-color: rgba(6, 243, 223, 0.1);
}
.teachers img{
height: 100px;
width: 110px;
margin-left: 15px;
}
.teachers_info{
}
.teachers_info h3{
color: black;
font-size: x-large;
font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
}
.teachers_info h5{
/* font-size: x-large; */
font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
margin-top: 5px;
}
.teacher_button_flex{
    display: flex;
    justify-content: end;
    margin: 30px 0px 0px 40px;
}
.teacher_button{
    height: 50px;
    width: 50px;
    background-color: #0074d9;
    border-radius: 20px;
    cursor: pointer;
}
.teacher_button img{
    height: 40px;
    width: 40px;
    margin-top: 7px;
    margin-right: 5px;
}
.teacher_discreption_big{
display: none;
}
.teacher_discreption{
    min-height: 270px;
    height: auto;
    width: 79.5%;
    background-color: #0074d9;
 margin-right: 130px;
 border-radius: 10px;
 display: flex;
justify-content: space-around;
}
.teacher_discreption_word{
margin-right: 30px;
margin-top: 50px;
}
.teacher_discreption_word h4{
font-size: xx-large;
color: white;
}
.teacher_discreption_word p{
width: 70%;
font-size: large;
color: white;
}
.teacher_discreption_link{
    margin-left: 50px;
    margin-top: 130px;
}
.teacher_discreption_link button{
    height: 40px;
    width: 210px;
       background-color: #0074d9;
border:1px solid gold;
border-radius: 10px;
color: gold;
font-size: large;
cursor: pointer;
}
.teacher_discreption_link button:hover{
background-color: gold;
color: black;
transition-duration:1s ;
transition-timing-function: ease-in-out;
}

.Statistics{
           background-color: rgb(224, 243, 255);

    max-height: 150px;
    height: auto;

    margin: 30px 70px;
border-radius: 10px;
    box-shadow: 10px 10px 10px 10px rgba(0, 0, 0, 0.1);
display: flex;
justify-content: space-evenly;
justify-items: center;
}
.Statistics img{
max-height: 100%;
height: auto;
width:300px ;
}
.Statistics_word{
    margin-top: 30px;
    margin-left: 5px;
}
.Statistics h3{
color: rgb(255, 66, 66);
font-size: xx-large;
margin-right: 13px;
}
.Statistics h5{
  color: rgb(255, 66, 66);
font-size: large;
}
.teacher_discreption_flex{
       display: flex;
    justify-content: end;
    margin: 30px 0px 0px 40px; 
    display: none;
}
.discreption_button{
       height: 50px;
    width: 50px;
    background-color: #0074d9;
    border-radius: 20px;
    cursor: pointer;
}
.teacher_discreption_flex img{
        height: 40px;
    width: 40px;
    margin-right: 5px;
    transform: rotate(180deg);
}
.Advertisements{
    background-color: rgb(252, 252, 252);
    min-height: 250px;
    height: auto;
        margin: 30px 30px;
box-shadow:10px 10px 10px 10px  rgb(0, 0, 0,0.2) ;
border-radius: 10px ;
}
.Advertisements_display{
    display: flex;
    margin-right: 60px;
   padding-top: 10px;
    gap: 15px;
  font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
}
.Advertisements .Advertisements_image img{
    height: 70px;
    width: 70px;
        animation-name:gobig ;
    animation-duration: 1s;
    animation-iteration-count: infinite;
} 
.Advertisements_word h2{
    font-size: 40px;
    margin-top: 15px;
}
.Advertisements_took_display_all{
    display: flex;
    margin-top: 25px;
    
}
.Advertisements_took_display{
    display: flex;
    gap: 10px;
    margin-right: 70px;
}
.Advertisements_took_img{
    transform: rotate(90deg);

}
.Advertisements_took_img img{
height: 30px;
width: 30px;
transform: rotate(90);
}
.Advertisements_took  a  {
text-decoration: none;
color: black;
}
.Advertisements_took  a:hover  {
color: rgb(255, 197, 91);
}
.Advertisements_took p{
font-size: x-large;
}
.footed{
    background-color: silver;
    /* height: 50px; */
    min-height: 50px;
    height: auto;
text-align: center;
font-size:   x-large;
padding-top: 10px;
}

@keyframes gobig {
    0%{
transform: scale(0.5);
    }
    50%{
transform: scale(1.1);


    }
    100%{
transform: scale(1);

  

    }

}
#rtlanimation{
animation-name: slowlyapper  ;
animation-timeline: view();
 animation-fill-mode: both;
 animation-range: entry 30% cover 50%;

}
@keyframes slowlyapper {
    from{
opacity: 0;
transform:translateX(100px) ;    
}

    to{
opacity: 1;
transform: translateX(0);
    }
}
#ltranimation{
animation-name: slowlyapper2  ;
animation-timeline: view();
 animation-fill-mode: both;
 animation-range: entry 30% cover 50%;

}
@keyframes slowlyapper2 {
    from{
opacity: 0;
transform:translateX(-20px) ;    
}

    to{
opacity: 1;
transform: translateX(0);
    }
}
#dtuanimation{
animation-name: slowlyapper3  ;
animation-timeline: view();
 animation-fill-mode: both;
 animation-range: entry 30% cover 50%;

}
@keyframes slowlyapper3 {
    from{
opacity: 0;
transform:translateY(-100px) ;    
}

    to{
opacity: 1;
transform:translateY(0) ;    

    }
}