@media screen and (max-width: 1199px){
    .event-wrap{
        padding-left: 79.5px;
    }
    .event-date-wrap, .event-date, .event-thumb, .event-thumb img{
        width: 72px;
        height: 72px;
    }
    .event-date-wrap{
        top: 18.75px;
    }
    .event-date{
        font-size: 26px;
        line-height: 26px;
        padding-top: 13px;
    }
    .event-title{
        padding-left: 20px;
        padding-right: 32px;
        font-size: 15px;
    }
    .event-time, .event-location{
        font-size: 13px;
    }
    .event-time, .event-location{
        padding-left: 49px;
    }
    .event-time::before, .event-location::before{
        left: 16px;
    }
    .contact-wrap .contact-info ul{
        padding: 46px 20px;
    }
    .contact-wrap .contact-info ul li .icon{
        display: none;
    }
}
@media screen and (max-width: 991px){
    .logo{
        text-align: center;
    }
    #top-nav ul.top-nav-menu{
        float: none;
        overflow: hidden;
        margin: 0 auto;
        padding: 20px 0;
    }
    #top-info-boxes .top-info-box{
        display: block;
    }
    #top-info-boxes .top-info-box .icon,
    #top-info-boxes .top-info-box .text{
        display: block;
        float: none;
    }
    .featured-col .icon-box .icon{
        display: none;
    }
    .icon-box h4{
        font-size: 16px;
    }
    .icon-box p{
        font-size: 14px;
    }
    .about-us .about-detail{
        padding-top: 10px;
        padding-bottom: 20px;
    }
    .about-us .title{
        font-size: 22px;
        letter-spacing: 1px;
        margin: 9px 0 28px;
        padding-bottom: 14px;
    }
    .about-us .desc{
        font-size: 14px;
        letter-spacing: 0.5px;
    }
    .section{
        padding-top: 48px;
        padding-bottom: 32px;
    }
    .section-title{
        font-size: 26px;
    }
    .section-content{
        padding-bottom: 24px;
    }
    .section-bottom .button{
        letter-spacing: 1px;
        font-size: 12px;
        line-height: 16px;
        padding: 14px 28px;
    }

    .course-item-title{
        font-size: 14px;
        line-height: 20px;
        height: auto;
        padding-bottom: 15px;
    }
    .course-item-info .more-info{
        padding: 10px 15px 9px;
    }
    .course-item-price{
        font-size: 14px;
    }

    .event-wrap{
        padding: 16px 16px 16px 71px;
        flex-wrap: wrap;
    }
    .event-date-wrap, .event-date, .event-thumb, .event-thumb img{
        height: 64px;
        width: 64px;
    }
    .event-date-wrap{
        line-height: 64px;
        top: 16.75px;
    }
    .event-date{
        padding-top: 8px;
        font-size: 24px;
    }
    .event-date .month > span{
        display: none;
        visibility: hidden;
    }
    .event-title-wrap{
        width: 85%;
        height: 52px;
    }
    .event-title{
        font-size: 14px;
    }
    .event-title a{
        white-space: normal;
    }
    .event-time-wrap, .event-location-wrap{
        width: 100%;
        display: block;
        margin-left: 87px;
        height: 52px;
    }
    .event-time, .event-location{
        font-size: 11px;
    }
    .event-time span{
        white-space: nowrap;
    }
    .contact-wrap .contact-info ul{
        padding: 46px 15px;
    }
}

@media screen and (max-width: 767px){
    #topbar .topbar-left{
        display: none;
    }
    #topbar .topbar-right .topbar-socials{
        float: left;
        border-right: 1px solid #e4e4e4;
    }
    .logo{
        text-align: left;
    }
    #menu-toggle{
        position: absolute;
        right: 0;
        top: 50%;
        margin: -17px 0 0;
        cursor: pointer;
        width: 26px;
        height: 26px;
        display: block !important;
    }
    #menu-toggle button{
        position: absolute;
        left: 0;
        top: 50%;
        background: #18afd3;
        height: 6px;
        margin: 0;
        padding: 0;
        border: none;
        width: 100%;
        outline: none !important;
        border-radius: 5px;
        -webkit-transition: 0.3s;
        transition: 0.3s;
    }
    #menu-toggle button:before{
        content: '';
        position: absolute;
        left: 0;
        top: -10px;
        width: 26px;
        height: 6px;
        background: #18afd3;
        border-radius: 5px;
        -webkit-transition: 0.3s;
        transition: 0.3s;
        -webkit-transform-origin: 1.5px center;
                transform-origin: 1.5px center;
    }
    #menu-toggle button:after{
        content: '';
        position: absolute;
        left: 0;
        bottom: -10px;
        width: 26px;
        height: 6px;
        background: #18afd3;
        border-radius: 5px;
        -webkit-transition: 0.3s;
        transition: 0.3s;
        -webkit-transform-origin: 1.5px center;
                transform-origin: 1.5px center;
    }
    #menu-toggle.open button{
        background: transparent;
    }
    #menu-toggle.open button:before{
        top: 0;
        -webkit-transform: rotate3d(0,0,1,-45deg);
                transform: rotate3d(0,0,1,-45deg);
        -webkit-transform-origin: 50% 50%;
                transform-origin: 50% 50%;
    }
    #menu-toggle.open button:after{
        bottom: 0;
        -webkit-transform: rotate3d(0,0,1,45deg);
                transform: rotate3d(0,0,1,45deg);
        -webkit-transform-origin: 50% 50%;
                transform-origin: 50% 50%;
    }
    #top-nav ul.top-nav-menu{
        display: none;
    }
    #mobile-menu > ul{
        padding: 0;
        margin: 0;
        list-style: none;
    }
    #mobile-menu > ul > li{
        position: relative;
        border-bottom: 1px solid #7ac8d8;
        background: #18afd3;
        font-size: 18px;
        font-weight: 500;
        text-transform: uppercase;
    }
    #mobile-menu > ul > li.active{
        background: #3c98ad;
        border-bottom: 1px solid #18afd3;
    }
    #mobile-menu > ul > li > a{
        display: block;
        padding: 21px 30px;
        color: #fff;
        text-decoration: none !important;
    }
    #mobile-menu > ul > li .carret-down{
        position: absolute;
        right: 0;
        top: 0;
        width: 77px;
        height: 60px;
        line-height: 60px;
        color: #fff;
        text-align: center;
    }
    #mobile-menu > ul > li .carret-down.active:before{
        content: '\f077';
    }
    #mobile-menu > ul ul{
        display: none;
        border-top: 1px solid #7ac8d8;
        background: #3c98ad;
        padding: 20px 30px;
    }
    #mobile-menu > ul ul li{
        font-size: 16px;
        font-weight: 400;
        text-transform: none;
        list-style: none;
        margin: 0;
    }
    #mobile-menu > ul ul li a{
        color: #fff;
        display: block;
        padding: 10px 0;
    }
    #top-info-boxes .text-right{
        padding-left: 0;
        padding-right: 0;
    }
    #top-info-boxes .top-info-box{
        padding: 20px 0;
        display: block;
    }
    #top-info-boxes .top-info-box .icon, #top-info-boxes .top-info-box .text{
        float: left;
    }
    #top-info-boxes .top-info-box.linked{
        padding-left: 15px;
    }
    #top-info-boxes .top-info-box .icon{
        margin-right: 20px
    }
    #top-info-boxes .top-info-box .text{
        float: none;
    }
    #top-info-boxes .top-info-box .text strong{
        line-height: 20px;
    }
    .swiper-button-next, .swiper-button-prev{
        width: 60px;
        height: 60px;
        margin-top: -30px;
        line-height: 60px;
    }
    .featured-col .col-inner{
        margin-top: 0;
    }
    .featured-col .col-inner:hover{
        top: 0;
    }
    .featured-col .icon-box .icon{
        display: table-cell;
    }
    .icon-box h4{
        font-size: 20px;
    }
    .icon-box p{
        font-size: 16px;
    }
    .about-us{
        padding-left: 53px;
        padding-right: 53px;
    }
    .about-us .title{
        margin-top: 32px;
    }
    .contact-wrap .contact-info{
        margin: 0;
        height: auto;
    }
}

@media screen and (max-width: 667px){
    #topbar .topbar-right{
        margin: 0 -15px;
    }
    #topbar .topbar-right .search-form{
        display: none;
    }
    #topbar .topbar-right > :first-child{
        border: none;
    }
    #mobile-search{
        display: block;
        border-bottom: 1px solid #e4e4ee;
        background: #fff;
    }
    #mobile-search .search-form{
        position: relative;
    }
    #mobile-search .search-form input[type="search"]{
        border: none;
        font-size: 14px;
        color: #b2b2b2;
        outline: none !important;
        padding: 17px 50px 16px 30px;
        font-weight: 300;
        width: 270px;
        line-height: 17px;
    }
    #mobile-search .search-form button{
        position: absolute;
        right: 0;
        top: 0;
        border: none;
        background: none;
        font-size: 16px;
        padding: 0;
        margin: 0;
        width: 50px;
        height: 50px;
        text-align: center;
        color: #D5D5D5;
        -webkit-transition: color 0.2s ease-out;
        transition: color 0.2s ease-out;
    }
    #mobile-search .search-form button:hover{
        color: #18afd3;
    }
    .swiper-button-next, .swiper-button-prev{
        display: none;
    }
    .about-us{
        padding-left: 33px;
        padding-right: 33px;
    }

    .event-wrap{
        padding-left: 16px;
    }
    .event-thumb-wrap{
        display: none;
    }
    .event-title-wrap{
        width: 100%;
    }
    .event-title{
        padding: 0 5px;
    }
    .event-date-wrap{
        top: 76px;
    }
    .title-wr h1{
        font-size: 30px;
        line-height: 36px;
    }
    .list-events .event-item .event-item-date{
        display: none;
    }
    .result-table{
        max-height: 500px;
    }
}

@media screen and (max-width: 576px){
    .list-events .event-item{
        display: block;
        font-size: 14px;
    }
    .list-events .event-info{
        margin-bottom: 35px;
    }
    .list-events .event-price{
        width: 100%;
        font-size: 16px;
    }
}