/* Large devices (laptops/desktops, 992px and up) */
@media (min-width: 992px) and (max-width: 1199.99px){

    /********************************************************/
    /***************** Home Page Start Here *****************/
    /********************************************************/
    
    /************** hero section code start **************/
    .hero {
        padding: 5rem 0;
    }
    /************** hero section code end **************/

    /************** about section code start **************/
    .about {
        padding: 4rem 0;
    }
    .about-content__text {
        padding-right: 0;
    }
    /************** about section code end **************/

    /************** teacher section code start **************/
    .teacher {
        padding: 4rem 0 5rem;
    }
    .teacher-content {
        margin-bottom: 2rem;
    }
    .teacher__card-title {
        position: unset;
    }
    .carousel-control-prev-icon, .carousel-control-next-icon {
        width: 2rem !important;
    }
    .carousel-indicators [data-bs-target] {
        width: .8rem !important;
        height: .8rem !important;
    }
    /************** teacher section code end **************/

    /************** how it works section code start **************/
    .how-it-works {
        padding: 4rem 0;
    }
    .hiw-content__title {
        margin: 0 0 4rem 0;
    }
    .how-it-works-inner-content__text {
        padding-right: 0;
        margin-bottom: 0;
    }
    /************** how it works section code end **************/

    /************** testimonial section code start **************/
    .testimonial {
        padding: 4rem 0 5rem;
    }
    /************** testimonial section code end **************/

    /************** subscribe section code start **************/
    .subscribe-content {
        padding: 3rem 0;
        margin-bottom: 4rem;
    }
    /************** subscribe section code end **************/

    /********************************************************/
    /****************** Home Page End Here ******************/
    /********************************************************/

    /********************************************************/
    /****************** Teacher Info Page Start Here ******************/
    /********************************************************/
    .first-card-blue {
        padding: 3rem 0;
    }
    .other-card-blue {
        padding: 0 0 3rem;
    }
    .back-to-btn {
        margin-bottom: 3rem;
    }
    /********************************************************/
    /****************** Teacher Info Page End Here ******************/
    /********************************************************/

    /********************************************************/
    /****************** Messenger Page Start Here ******************/
    /********************************************************/
    .message-body-inner-input {
        padding: 1rem;
    }
    .messenger-chat-btn {
        padding: 0.625rem 1rem;
    }
    .messenger-chat-content {
        height: 54vh !important;
        overflow: auto !important;
    }
    .chat-box-body {
        height: 44.3vh !important;
        font-size: 13px !important;
        padding: 10px 30px !important;
        overflow: auto !important;
    }
    /********************************************************/
    /****************** Messenger Page End Here ******************/
    /********************************************************/
}

/* Medium devices (landscape tablets, 768px and up) */
@media (min-width: 768px) and (max-width: 991.99px){

    /************** Global Css Start **************/
    html{
        font-size: 14px;
    }
    /************** Global Css end **************/

    /********************************************************/
    /***************** Home Page Start Here *****************/
    /********************************************************/

    /************** Nav Bar Css start **************/
    .navbar-toggler{
        color: var(--white) !important;
        border: 1px solid var(--white) !important;
    }
    .navbar-toggler-icon {
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='white' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important;
    }
    /************** Nav Bar Css end **************/

    /************** hero section code start **************/
    .hero {
        padding: 3rem 0;
    }
    /************** hero section code end **************/

    /************** about section code start **************/
    .about {
        padding: 3rem 0;
    }
    .about-content__text {
        padding-right: 0;
        margin-bottom: 2rem;
    }
    /************** about section code end **************/

    /************** teacher section code start **************/
    .teacher {
        padding: 3rem 0 1rem;
    }
    .teacher-content {
        margin-bottom: 2rem;
    }
    .teacher__card-title {
        position: unset;
    }
    .owl-theme .owl-nav {
        margin-top: 0 !important;
    }
    .owl-carousel .nav-btn {
        height: 1.5rem;
        width: 1.5rem;
        top: 35% !important;
    }
    .prev-slide{
        left: -2rem;
        background-size: 1.5rem 1.5rem;
    }
    .next-slide{
        right: -2rem;
        background-size: 1.5rem 1.5rem;
    }
    /************** teacher section code end **************/

    /************** how it works section code start **************/
    .how-it-works {
        padding: 3rem 0;
    }
    .hiw-content__title {
        margin: 0 0 2rem 0;
    }
    .how-it-works-inner-content {
        margin-bottom: 4rem;
    }
    .how-it-works-inner-content__text {
        padding-right: 0;
        margin-bottom: 0;
    }
    /************** how it works section code end **************/

    /************** testimonial section code start **************/
    .testimonial {
        padding: 3rem 0 1rem;
    }
    /************** testimonial section code end **************/

    /************** subscribe section code start **************/
    .subscribe-content {
        padding: 3rem 0;
        margin-bottom: 4rem;
    }
    /************** subscribe section code end **************/

    /********************************************************/
    /****************** Home Page End Here ******************/
    /********************************************************/

    /********************************************************/
    /****************** Student Page Start Here ******************/
    /********************************************************/
    .all-student__filter {
        margin-bottom: 2rem;
    }
    /********************************************************/
    /****************** Student Page End Here ******************/
    /********************************************************/

    /********************************************************/
    /****************** Teacher Info Page Start Here ******************/
    /********************************************************/
    .first-card-blue {
        padding: 3rem 0;
    }
    .other-card-blue {
        padding: 0 0 3rem;
    }
    .back-to-btn {
        margin-bottom: 3rem;
    }
    .back-to-btn--yellow {
        padding: .8rem 1.5rem !important;
    }
    /********************************************************/
    /****************** Teacher Info Page End Here ******************/
    /********************************************************/

    /********************************************************/
    /****************** Messenger Page Start Here ******************/
    /********************************************************/
    .message-body-inner-input {
        padding: 1rem;
    }
    .messenger-chat-btn {
        padding: 0.625rem 1rem;
    }
    .messenger-chat-content {
        height: 56vh !important;
        overflow: auto !important;
    }
    .chat-box-body {
        height: 44.4vh !important;
        font-size: 13px !important;
        padding: 10px 30px !important;
        overflow: auto !important;
    }
    /********************************************************/
    /****************** Messenger Page End Here ******************/
    /********************************************************/
}

/* Small devices (portrait tablets and large phones, 576px and up) */
@media (min-width: 576px) and (max-width: 767.99px){

    /************** Global Css Start **************/
    html{
        font-size: 14px;
    }
    h1{
        font-size: 2rem !important;
    }
    h2{
        font-size: 1.85rem !important;
    }
    h3{
        font-size: 1.71rem !important;
    }
    h4{
        font-size: 1.57rem !important;
    }
    h5{
        font-size: 1.42rem !important;
    }
    h6{
        font-size: 1.28rem !important;
    }
    /************** Global Css end **************/

    /********************************************************/
    /***************** Home Page Start Here *****************/
    /********************************************************/

    /************** Nav Bar Css start **************/
    .navbar-toggler{
        color: var(--white) !important;
        border: 1px solid var(--white) !important;
    }
    .navbar-toggler-icon {
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='white' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important;
    }
    /************** Nav Bar Css end **************/

    /************** hero section code start **************/
    .hero {
        padding: 3rem 0;
    }
    .hero-content--text {
        font-size: 1rem;
        line-height: 1.5rem;
    }
    .hero-content--btn {
        padding: 1rem 1.5rem !important;
    }
    /************** hero section code end **************/

    /************** about section code start **************/
    .about {
        padding: 3rem 0;
    }
    .about-content__title {
        margin: 0 0 1rem 0;
    }
    .about-content__text {
        line-height: 1.5rem;
        padding-right: 0;
        margin-bottom: 2rem;
    }
    /************** about section code end **************/

    /************** teacher section code start **************/
    .teacher {
        padding: 3rem 0 1rem;
    }
    .teacher-content {
        margin-bottom: 2rem;
    }
    .teacher__card-title {
        position: unset;
    }
    .owl-theme .owl-nav {
        margin-top: 0 !important;
    }
    .owl-carousel .nav-btn {
        height: 1.5rem;
        width: 1.5rem;
        top: 35% !important;
    }
    .prev-slide{
        left: -2rem;
        background-size: 1.5rem 1.5rem;
    }
    .next-slide{
        right: -2rem;
        background-size: 1.5rem 1.5rem;
    }
    /************** teacher section code end **************/

    /************** how it works section code start **************/
    .how-it-works {
        padding: 3rem 0;
    }
    .hiw-content__title {
        margin: 0 0 1rem 0;
    }
    .how-it-works-inner-content {
        margin-bottom: 4rem;
    }
    .how-it-works-inner-content__text {
        padding-right: 0;
        margin-bottom: 0;
    }
    /************** how it works section code end **************/

    /************** testimonial section code start **************/
    .testimonial {
        padding: 3rem 0 1rem;
    }
    .testimonial-content {
        margin-bottom: 2rem;
    }
    .testimonial-content__title {
        margin: 0;
    }
    /************** testimonial section code end **************/

    /************** subscribe section code start **************/
    .subscribe-content {
        padding: 3rem 0;
        margin-bottom: 3rem;
    }
    .subscribe-content__text {
        margin-bottom: 1.5rem;
    }
    .subscribe-content__input {
        padding: 1rem;
    }
    .subscribe-content__btn {
        top: 0.45rem;
        right: 0.45rem;
    }
    /************** subscribe section code end **************/

    /************** footer section code start **************/
    .footer-main {
        padding: 2rem 0 1rem;
    }
    .footer__widget {
        margin: .5rem 0;
    }
    .footer__widget--link {
        margin-top: 5px;
    }
    .footer__widget--social {
        width: 24px;
        height: 24px;
        margin: 0px 8px 0 0;
    }
    .footer__copyright {
        padding: 1rem 0;
    }
    /************** footer section code end **************/

    /********************************************************/
    /****************** Home Page End Here ******************/
    /********************************************************/

    /********************************************************/
    /****************** Student Page Start Here ******************/
    /********************************************************/
    .all-student__filter {
        margin-bottom: 2rem;
    }
    .card-column {
        width: 100% !important;
    }
    /********************************************************/
    /****************** Student Page End Here ******************/
    /********************************************************/

    /********************************************************/
    /****************** Teacher Info Page Start Here ******************/
    /********************************************************/
    .teacher-profile-content__btn {
        padding: 0.25rem .5rem !important;
    }
    .first-card-blue {
        padding: 3rem 0;
    }
    .other-card-blue {
        padding: 0 0 3rem;
    }
    .back-to-btn {
        margin-bottom: 3rem;
    }
    .back-to-btn--yellow {
        padding: .8rem 1.5rem !important;
    }
    /********************************************************/
    /****************** Teacher Info Page End Here ******************/
    /********************************************************/

    /********************************************************/
    /****************** Messenger Page Start Here ******************/
    /********************************************************/
    .message-option {
        padding: .5rem 1rem;
    }
    .message-body-inner {
        padding: 1rem;
    }
    .message-body-inner-input {
        padding: 1rem;
    }
    .messenger-chat-btn {
        padding: 0.625rem 1rem;
    }
    .messenger-chat-content {
        height: 55vh !important;
        overflow: auto !important;
    }
    .chat-box-body {
        height: 43.2vh !important;
        font-size: 13px !important;
        padding: 10px 30px !important;
        overflow: auto !important;
    }
    /********************************************************/
    /****************** Messenger Page End Here ******************/
    /********************************************************/
}

/* Most of the Smartphones Mobiles(portrait phones, 320px and up) */
@media (min-width: 320px) and (max-width: 575.99px){

    /************** Global Css Start **************/
    html{
        font-size: 12px;
    }
    h1{
        font-size: 2rem !important;
    }
    h2{
        font-size: 1.83rem !important;
    }
    h3{
        font-size: 1.67rem !important;
    }
    h4{
        font-size: 1.5rem !important;
    }
    h5{
        font-size: 1.3rem !important;
    }
    h6{
        font-size: 1.2rem !important;
    }
    /************** Global Css end **************/

    /********************************************************/
    /***************** Home Page Start Here *****************/
    /********************************************************/

    /************** Nav Bar Css start **************/
    .navbar-toggler{
        color: var(--white) !important;
        border: 1px solid var(--white) !important;
    }
    .navbar-toggler-icon {
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='white' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important;
    }
    /************** Nav Bar Css end **************/

    /************** hero section code start **************/
    .hero {
        padding: 2rem 0;
    }
    .hero-content {
        text-align: center;
    }
    .hero-content--title {
        margin: 0 0 1rem 0;
    }
    .hero-content--text {
        line-height: 1.5rem;
        margin: 0 0 1rem 0;
    }
    .hero-content--btn {
        padding: .5rem 1rem !important;
    }
    /************** hero section code end **************/

    /************** about section code start **************/
    .about {
        padding: 3rem 0;
    }
    .about-content__title {
        margin: 0 0 1rem 0;
        text-align: center;
    }
    .about-content__text {
        line-height: 1.4rem;
        padding-right: 0;
        margin-bottom: 2rem;
    }
    /************** about section code end **************/

    /************** teacher section code start **************/
    .teacher {
        padding: 2rem 0 1rem;
    }
    .teacher-content {
        margin-bottom: 2rem;
    }
    .teacher__card-title {
        position: unset;
    }
    .owl-theme .owl-nav {
        margin-top: 0 !important;
    }
    .owl-carousel .nav-btn {
        height: 1.5rem;
        width: 1.5rem;
        top: 35% !important;
    }
    .prev-slide{
        left: -3rem;
        background-size: 1.5rem 1.5rem;
    }
    .next-slide{
        right: -3rem;
        background-size: 1.5rem 1.5rem;
    }
    /************** teacher section code end **************/

    /************** how it works section code start **************/
    .how-it-works {
        padding: 2rem 0;
    }
    .hiw-content__title {
        margin: 0 0 1rem 0;
    }
    .how-it-works-inner-content {
        margin-bottom: 3rem;
    }
    .how-it-works-inner-content__text {
        padding-right: 0;
        margin-bottom: 0;
    }
    .hiw-item__video {
        width: 94%;
        height: 100%;
    }
    .hiw-item__bg {
        height: 14.5rem;
        top: -1rem;
        right: 0;
    }
    /************** how it works section code end **************/

    /************** testimonial section code start **************/
    .testimonial {
        padding: 2rem 0 1rem;
    }
    .testimonial-content {
        margin-bottom: 1rem;
    }
    .testimonial-content__title {
        margin: 0;
    }
    /************** testimonial section code end **************/

    /************** subscribe section code start **************/
    .subscribe-content {
        padding: 2rem 1rem;
        margin-bottom: 2rem;
    }
    .subscribe-content__text {
        margin-bottom: 1.5rem;
    }
    .subscribe-content__input {
        width: 20rem;
        padding: 1rem;
    }
    .subscribe-content__btn {
        top: 0.45rem;
        right: 0.45rem;
    }
    /************** subscribe section code end **************/

    /************** footer section code start **************/
    .footer-main {
        padding: 1rem 0;
    }
    .footer__widget {
        margin: .5rem 0;
    }
    .footer__widget--link {
        margin-top: 5px;
    }
    .footer__widget--social {
        width: 24px;
        height: 24px;
        margin: 0px 8px 0 0;
    }
    .footer__copyright {
        padding: 1rem 0;
    }
    /************** footer section code end **************/

    /********************************************************/
    /****************** Home Page End Here ******************/
    /********************************************************/

    /********************************************************/
    /****************** Student Page Start Here ******************/
    /********************************************************/
    .all-student__filter {
        margin-bottom: 2rem;
    }
    .card-column {
        width: 100% !important;
    }
    .sort-btn-yellow svg{
        width: 1.5rem;
        height: 1.5rem;
    }
    /********************************************************/
    /****************** Student Page End Here ******************/
    /********************************************************/

    /********************************************************/
    /****************** Teacher Info Page Start Here ******************/
    /********************************************************/
    .teacher-profile-content-sm{
        flex-direction: column;
        gap: 1rem;
    }
    .teacher-profile-content__btn {
        padding: 0.25rem .5rem !important;
    }
    .teacher-profile-content-other-btn-sm {
        /*flex-direction: row;*/
        position: absolute;
        top: 70px;
        right: 25px;
    }
    .first-card-blue {
        padding: 2rem 0;
    }
    .other-card-blue {
        padding: 0 0 2rem;
    }
    .back-to-btn {
        margin-bottom: 2rem;
    }
    .back-to-btn--yellow {
        padding: .8rem 1.5rem !important;
    }
    /********************************************************/
    /****************** Teacher Info Page End Here ******************/
    /********************************************************/

    /********************************************************/
    /****************** Messenger Page Start Here ******************/
    /********************************************************/
    .message-option {
        padding: .5rem 1rem;
    }
    .message-body-inner {
        padding: 1rem;
    }
    .message-body-inner-input {
        padding: 1rem;
    }
    .messenger-chat-btn {
        padding: 0.625rem 1rem;
    }
    .messenger-chat-content {
        height: 56vh !important;
        overflow: auto !important;
    }
    .chat-box-body {
        height: 44vh !important;
        font-size: 13px !important;
        padding: 10px 30px !important;
        overflow: auto !important;
    }
    /********************************************************/
    /****************** Messenger Page End Here ******************/
    /********************************************************/
}
