@import url('https://fonts.googleapis.com/css2?family=Lato&family=Roboto:wght@400;500;700&display=swap');
body{
    overflow: hidden;
    overflow-y: auto;
    overflow-x: visible;
    max-width: 100vw;
}
#footer{
    /* font-family: 'Lato', sans-serif; */
    font-family: 'Roboto', sans-serif;

}

.footer-right{
    display: flex;
    flex-wrap: wrap;
    align-items: top;
    justify-content: space-around;
}

#footer .footerContent .footerText {
    padding: 0px 90px 25px 0;
    padding-bottom: 0;
    max-width: 700px;
}
@media (max-width: 992px){
    #footer .footer-right{
        margin-top: 40px;
        justify-content: center;
        gap: 20px;
    }
    #footer .row .col-md-6 .footerContent > div{
        text-align: center;
        justify-content: center;
        padding: 0;
    }
    #footer .footerContent .footerText {
        padding: 0px 90px 0px 0;
        max-width: 700px;
    }
}
#footer .links ul li{
    display: flex;
    align-items: center;
    gap: 5px;
}
#footer .links ul li:hover >a ,#footer .links ul li:hover >i{
    color: #ffcb09;
}
#footer .links ul a{
    text-decoration: none;
    font-size: 16px;
    font-weight: 400;
    color: #e3e3e3;
}

#footer .links ul i{
    font-size: 16px;
    font-weight: 400;
    color: #e3e3e3;
}
#footer .footerContent .socialLinks .link a{
    color: #e3e3e3;
    text-decoration: none;
}
#footer .footerContent .socialLinks .link:hover{
    border: 2px solid #ffcb09;
}
#footer .footerContent .socialLinks .link:hover >a{
    color: #ffcb09;
}
#footer .addressSection .details .contactNumber,
#footer .addressSection .details .emailAddress{
    display: flex;
    align-items: center;
    gap: 5px;
    margin-bottom: 10px;
    cursor: pointer;
}
#footer .addressSection .details .contactNumber a,
#footer .addressSection .details .emailAddress a{
    text-decoration: none;
    color: #e3e3e3;
}
#footer .addressSection .details .contactNumber:hover >i,
#footer .addressSection .details .contactNumber:hover >a,
#footer .addressSection .details .emailAddress:hover > i,
#footer .addressSection .details .emailAddress:hover > a{
    color: #ffcb09;
    border-color: #ffcb09;
}
#footer .addressSection .details i{
    font-size: 20px;
    font-weight: 400;
    color: #e3e3e3;
    border: 2px solid #e3e3e3;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
}
#footer h5{
    border-bottom: 2px solid rgba(255, 202, 9, 0.432);
    padding-bottom: 7px;
}
@media (max-width: 992px){
    #footer .row .col-md-6 .footerContent > div {
        text-align: center;
        justify-content: center;
        padding: 0;
        width: 250px;
        margin: auto;
    }
}
@media (max-width:507px){
    #footer .addressSection .details .contactNumber, 
    #footer .addressSection .details .emailAddress{
        justify-content: center !important;
        align-items: center !important;
        flex-direction: column !important;
    }
    #footer .addressSection h5 {
        text-align: center;
    }
    #footer .links h5 {
        text-align: center;
    }
}
@media (max-width: 385px){
    #footer {
        padding-left: 55px;
    }
}
@media (max-width:300px){
    html{
      overflow:clip;
      overflow-y: auto;
    }
    #similarCourses .row .sameCourse{
      max-height: 400px;
    }
    #footer {
      padding-left: 26px !important;
  }
  #footer .addressSection , #footer .links{
    transform: translateX(10%);
  }
  }