@media (max-width: 500px) {
    nav .opener #white-hamburger {
        display: none;
    }
  
    nav .opener #green-hamburger {
          display: block;
    }

    header .left-side {
        height: 50%;
    }

    header .right-side {
        height: 50%;
    }

    header .topic-full {
        height: 100%;
    }

    header .topic-full h4 {
        top: 50%;
    }

    header .topic-half {
        height: 50%;
    }


    /* TEACHING */
    .teaching {
        padding-top: 15%;
    }

    .teaching .call-to-action {
        width: 100%;
    }

    .teaching .list-container h2 {
        font-size: 2em;
    }

    .teaching .list-container i {
        font-size: 1em;
    }

    .teaching .list-container .to-hidden {
        display: none;
    }

    .teaching .list-container .hidden-not {
        display: block;
        padding-bottom: 8%;
    }

    .teaching .list-container p {
        font-size: 0.9em;
    }

    .teaching .lesson-content-alt .left-side {
        padding: 20% 0;
    }

    .teaching .lesson-content-alt .content-container {
        width: 80%;
    }

    .teaching .lesson-content-alt .first {
        margin-left: 10%;
    }

    .teaching .lesson-content-alt .content-container p {
        text-align: justify;
    }

    .teaching .lesson-content-alt .second {
        display: none;
    }

    .teaching .lesson-content-alt .display-none {
        display: block;
        height: 80vh;
        width: 100vw;
    }

    .teaching .goal {
        padding: 20% 0;
    }

    .teaching .goal .title-container p {
        width: 90%;
        margin-left: 5%;
        font-size: 0.9em;
        text-align: justify;
    }

    .teaching .goal .col-sm {
        margin-top: 5%;
    }

    .teaching .goal .content-container {
        width: 80%;
    }

    .teaching .goal .container-1 {
        margin-left: 10%;
    }
      
    .teaching .goal .container-2 {
        margin-left: 10%;
    }
      
    .teaching .goal .container-3 {
        margin-left: 10%;
    }

    .teaching .pricing .background-img {
        height: 80vh;
        width: 100vw;
    }

    .teaching .pricing .content-container {
        width: 90%;
    }

    .teaching .pricing .content-container h4 {
        text-align: center;
    }

    .teaching .pricing .content-container p {
        text-align: justify;
    }


    /* EDUCATION */
    .education {
        padding-top: 15%;
    }
    
    .education .list-container h2 {
        font-size: 2em;
    }

    .education .list-container p {
        font-size: 0.9em;
    }

    .education .beginning .left-side .background-img {
        background-position: center;
        height: 80vh;
    }

    .education .right-side {
        padding: 20% 0;
    }

    .education .beginning .right-side .display-display {
        display: none;
      }
      
      .education .beginning .right-side .display-none {
        display: block;
      }

    .education .beginning .right-side .content-container {
        margin-left: 10%;
    }

    .education .beginning .right-side .content-container h4, h5 {
        text-align: center;
    }

    .education .videos-alt {
        padding: 20% 10%;
    }

    .education .videos-alt h5 {
        font-size: 1.5em;
        padding: 0;
    }

    .education .videos-alt p {
        font-size: 0.9em;
        padding-bottom: 10%;
    }

    .education .videos-alt b {
        font-size: 1em;
        line-height: 1.5em;
    }

    .education .videos-alt ul {
        margin-top: 5%;
    }

    .education .videos-alt li {
        font-size: 0.92em;
    }


    /* COMPETITIONS */
    .competitions {
        padding-top: 15%;
    }

    .list-container {
        text-align: center;
    }

    .list-container h2 {
        font-size: 2em;
    }

    .list-container p {
        font-size: 0.9em;
    }

    .event-list-container {
        margin-top: 12%;
    }

    .event-list-container h2 {
        font-size: 1.3em;
        text-align: center;
    }

    .dropdown-container h3 {
        font-size: 1.2em;
    }

    .list .article-inner p {
        font-size: 0.9em;
    }
}