@media (max-width: 1199px) and (min-width: 1024px) {
}

@media (max-width: 1023px) and (min-width: 992px) {
}


@media (max-width: 991px) and (min-width: 768px) {
}

@media (max-width: 767px) and (min-width: 685px) {
}

@media (max-width: 684px) and (min-width: 568px) {
}

@media (max-width: 567px) and (min-width: 480px) {
}

@media (max-width: 479px) and (min-width: 320px) {
    .container {
      padding-left: 32px;
      padding-right: 32px;
    }
    .navbar-light .navbar-nav {
         align-items: flex-start;
    }
    .navbar-light .navbar-nav .nav-link {
        padding: 15px 0.5rem;
    }
    .section-hero{
        background: url("../img/hero-bg.jpg") no-repeat 0 0;
        background-size: cover;
        min-height: 320px;
        background-position: center;
        border-bottom-right-radius: 64px;
    }
    .section-hero img {
        display: none !important;
    }
    .hero-content {
        min-width: 320px;
        padding: 0 15px;
    }
    .hero-content p {
        font-size: 12px;
    }
    .hero-content h1 {
        font-size: 72px;
    }
    .hero-content h1 span {
        font-size: 46px;
        line-height: 60px;
    }
    .navbar-brand {
        font-size: 20px;
    }
    .section-title {
        font-size: 32px;
    }
    .circle-text{
        display: none;
    }
    .announcement-section{
        padding-bottom: 0;
    }
    .seminars-card-section{
        padding: 45px 0 40px 0;
    }
    .seminar-info-card {
        min-height: 140px;
        margin-bottom: 32px;
    }
    .seminar-info-card .info-header h2{
        font-size: 24px;
        line-height: 32px;
        margin-bottom: 8px;
    }
    .seminar-info-card .info-body{
        padding-bottom: 20px;
    }
    .section.web-seminars-section{
        padding-top: 0;
    }

    .web-seminars-section h1 {
        font-size: 28px;
    }
    .web-seminars-info-cards {
        flex-direction: column;
    }
    .web-seminars-info-cards .info-card{
        margin-bottom: 32px;
        width: 100%;
    }
    .event-card{
        flex-direction: column;
    }
    .event-card .event-date-time {
        width: 100%;
        border: 0;
        padding: 0;
        margin: 0;
    }
    .event-date-time .time,
    .event-card .event-address ul li:first-child,
    .event-card .event-date-time ul li:first-child {
        border-bottom: 1px solid #ccc;
        padding-bottom: 10px;
        margin-bottom: 10px;
    }
    .event-card .event-address {
        width: 100%;
    }
    .main-footer .footer-title {
        font-size: 28px;
    }
}

@media (min-width: 1366px){
    .container{
        max-width: 1245px;
    }
}
