/* Big tablet to 1200px (widths smaller than the 1140px row) */
@media only screen and (max-width: 1200px) {

    /* header */

    .title {
        width: 95%;
    }

    .navigation-container {
        width: 95%;
    }

    .title h1 {
        font-size: 55px;
    }

    .navigation li a:link, .navigation li a:visited {
        font-size: 70%;
    }

    .white-navigation li a:link, .white-navigation li a:visited {
        font-size: 70%;
    }

    .index-header img {
        width: 145.56px;
        height: 78.39px;
        margin-top: -8px;
    }

    .white-header img {
        width: 145.56px;
        height: 78.39px;
        margin-top: -8px;
    }

    .navigation {
        padding: 20px 20px 20px 0;
    }

    /* section options */

    #options {
        width: 90%;
    }

    #options__content {
        display: block;
        padding-top: 3em;
    }

    #options__video {
        display: -webkit-box;
        display: flex;
        -webkit-box-align: center;
                align-items: center;
        -webkit-box-pack: center;
                justify-content: center;
        padding-top: 0;
    }

    .youtube-options {
        padding-top: 36.25%;
        width: 65%;
    }

    #options__list {
        padding: 1em 5em 0 5em;
    }

    .options__point {
        font-size: 100%;
        min-height: 90px;
    }

    .options__number {
        height: 40px;
        -webkit-box-flex: 0;
                flex: 0 0 40px;
    }

    .round {
        width: 80px;
        height: 80px;
        background-color: #273381;
        border-color: #273381;
    }

    span {
        background: white;
    }

    span:first-child {
        left: 17%;
    }

    span:nth-child(3) {
        left: 18%;
    }

    #button-next-div {
        -webkit-box-flex: 1;
                flex: 1;
    }

    /* section control */

    #control {
        width: 90%;
    }

    .control__second-col {
        padding-left: 25px;
    }

    .control__second-col h5 {
        font-size: 110%;
    }

    .control__second-col p {
        font-size: 95%;
    }

    .button-next {
        background-color: #273381;
        border-color: #273381;
    }

    #button-to-videos a{
        color: white;
    }

    .videos__segment-title {
        padding-left: 10px;
    }

    .videos__column {
        padding: 0 25px;
    }

    /* section mtt */
    #mtt {
        width: 90%;
    }

    #mtt__video {
        display: -webkit-box;
        display: flex;
        -webkit-box-align: center;
                align-items: center;
        -webkit-box-pack: center;
                justify-content: center;
        padding-top: 0;
    }

    #mtt__content {
        display: block;
        padding-top: 3em;
    }

    #mtt__description {
        padding-left: 0;
        font-size: 95%;
    }
}


/* Small tablet to big tablet: from 768px to 1023px */
@media only screen and (max-width: 1023px) {

    h2{
        font-size: 175%;
    }
    
    /* header */

    .navigation {
        display: none;
    }

    .title {
        width: 90%;
    }

    .navigation-container {
        width: 90%;
    }

    .title h1 {
        font-size: 41px;
    }

    .btn:link, .btn:visited {
        padding: 18px  46px;
        font-size: 120%;
    }

    .burger-menu-header-container {
        display: -webkit-box;
        display: flex;
    }

    .burger-menu-white-container {
        display: -webkit-box;
        display: flex;
    }


    .mobile-navigation {
        line-height: 40px;
    }

    .closebtn {
        font-size: 50px !important;
    }

    .mobile-navigation li a {
        font-size: 115%;
    }

    .mobile-navigation-white {
        line-height: 40px;
    }

    .closebtn-white {
        font-size: 50px !important;
    }

    .mobile-navigation-white li a {
        font-size: 115%;
    }

    /* section options */

    .white-navigation {
        display: none;
    }

    /* section control */

    #control__first-row {
        -webkit-box-orient: vertical;
        -webkit-box-direction: reverse;
                flex-direction: column-reverse;
        -webkit-box-align: center;
                align-items: center;
    }

    .control__second-col {
        padding: 0 40px 40px 40px;
    }

    #control__second-row {
        -webkit-box-orient: vertical;
        -webkit-box-direction: reverse;
                flex-direction: column-reverse;
        -webkit-box-align: center;
                align-items: center;
    }

    .control__first-col {
        padding-bottom: 40px;
        width: 65%;
    }

    .youtube-control {
        width: 100%;
        padding-top: 56.25%;
    }

    #button-to-videos {
        padding-bottom: 40px;
    }

    footer #separate_div{
        justify-content: center;
        padding-bottom: 20px;
        padding-right: 0px;
    }
}


/* Small phones to small tablets: from 481px to 767px */
@media only screen and (max-width: 767px) {
    h2 {
        font-size: 170%;
    }

    /* header */

    .mobile-navigation {
        line-height: 35px;
    }

    .closebtn {
        font-size: 35px !important;
    }

    .mobile-navigation li a {
        font-size: 83%;
    }

    .mobile-navigation-white {
        line-height: 35px;
    }

    .closebtn-white {
        font-size: 35px !important;
    }

    .mobile-navigation-white li a {
        font-size: 83%;
    }
    /* section options */

    .youtube-options {
        padding-top: 50.25%;
        width: 90%;
    }

    #options__list {
        padding: 1em 2em 0 2em;
    }

    #options {
        padding-top: 2em;
    }

    /* section control */

    #control {
        padding-top: 2em;
    }

    .control__second-col {
        padding: 0 10px 40px 10px;
    }

    /* sekcja videos */
    
    #videos {
        padding-top: 2em;
    }

    .control__first-col {
        padding-bottom: 40px;
        width: 90%;
    }

    /* section contact */

    #contact__content {
        padding: 3em 0.4em 3em 0.4em;
    }

    #mtt {
        padding-top: 2em;
    }
}


/* Small phones: from 0 to 480px */
@media only screen and (max-width: 480px) {
    .burger-menu-header {
        width: 35px;
    }

    .burger-menu-white {
        width: 35px;
    }

    .index-header img {
        width: 133.56px;
        height: 71.94px;
    }

    .white-header img {
        width: 133.56px;
        height: 71.94px;
    }

    .title h1 {
        font-size: 28px;
    }

    .btn:link, .btn:visited {
        padding: 16px 40px;
        font-size: 90%;
    }

    h2 {
        font-size: 110%;
    }

    /* sekcja optiont */

    #options__list {
        padding: 1em 0.5em 0 0.5em;
    }

    .options__point {
        font-size: 90%;
    }

    .options__number {
        height: 35px;
        -webkit-box-flex: 0;
                flex: 0 0 35px;
    }

    .round {
        width: 70px;
        height: 70px;
    }

    /* sekcja control */

    span:first-child {
        left: 11%;
    }

    span:nth-child(3) {
        left: 11%;
    }

    span:nth-child(2) {
        left: 42%;
    }

    span:nth-child(4) {
        left: 42%;
    }

    .control__second-col p {
        font-size: 90%;
    }

    .control__second-col h5 {
        font-size: 100%;
    }

    #control__content {
        padding-top: 2em;
    }

    /* sekcja contact */

    #contact__content {
        padding: 2em 0.4em 3em 0.4em;
    }

    #contact p {
        font-size: 75%;
    }

    /* sekcja videos */

    #videos h3 {
        font-size: 100%;
    }

    #videos h4 {
        font-size: 90%;
    }

    /* sekcja mtt */
    #mtt__description {
        font-size: 90%;
    }
}