@media screen and (max-width: 1020px) {
    .content2 h1 {
        font-size: 6em;
    }

    .content2 {
        margin-right: 20px;
        margin-left: 20px;
    }
}

@media screen and (max-width: 835px) {
    .content2 h1 {
        font-size: 5em;
    }

    .content2 {
        margin-right: 20px;
        margin-left: 20px;
    }
}


@media screen and (max-width: 689px) {
    .content2 h1 {
        font-size: 5em;
        margin-top: 1.2em;
    }

    .content2 {
        margin-right: 20px;
        margin-left: 20px;
    }
}


@media (max-width: 686px) {

    .content1 {
        position: absolute;
        top: 7em;
        margin-right: 2em;
        margin-left: 2em;
    }

    .content2 {
        position: absolute;
        top: 7em;
    }
}

@media (max-width: 403px) {
    .content1 h2 {
        font-size: 1.6em;
    }

    .content2 h1 {
        font-size: 4em;
        margin-top: 1em;
    }
}

@media (max-width: 462px) {
    .content1 h2 {
        font-size: 1.4em;
        padding-top: 10px;
    }

    .content2 h1 {
        font-size: 4em;
        margin-top: 1.4em;
    }
}

@media (max-width: 352px) {
    #background {
        height: 90vh;
        margin-bottom: 2em;
    }

    .content2 h1 {
        font-size: 3em;
        margin-top: 2.2em;
    }

    .content3 {
        margin-left: 20px;
        margin-right: 20px;
        margin-top: 17em;
    }

    .content3 button {
        padding: 20px 90px;
    }
}

/* ================  experiences  =========== */

@media (max-width: 620px) {
    #experience {
        height: auto;
        margin-bottom: 3em;
    }

    .exp_header h1 {
        overflow: hidden;
        text-align: center;
        padding-top: 1em;
        font-family: 'Oswald', sans-serif;
        font-size: 2em;
    }

    img {
        height: auto;
        max-width: 100%;
        object-fit: cover;
        vertical-align: middle;
    }

    .card_title {
        font-size: 2rem;
    }

    .card_text {
        font-size: 1.4rem;
    }
}

@media (max-width: 377px) {
    .exp_signup button {
        padding: 10px 20px;
        text-decoration: none;
        color: #fff;
        font-size: 12px;
    }
}

/* ====================== */

@media (max-width: 767px) {
    .container {
        display: block;
    }

    .container .bg1,
    .container .bg2,
    .container .bg3,
    .container .bg4,
    .container .bg5,
    .container .bg6,
    .container .bg7,
    .container .bg8 {
        margin-top: 2em;
    }
}

@media (max-width: 720px) {
    .text-highlight h1 {
        font-size: 2.5em;
    }
}

@media (max-width: 430px) {
    .text-highlight h1 {
        font-size: 2em;
    }
}

@media (max-width: 1064px) {

    .grid_content {
        display: block;
        width: 31em;
    }
}

@media (max-width: 510px) {
    .grid_content {
        display: block;
        width: 26em;
    }

    .content-aboutjt1 {
        height: auto;
        margin-bottom: 2em;
    }
}

@media (max-width: 530px) {
    .content-aboutjt1 {
        height: auto;
        margin-bottom: 2em;
        text-align: center;
    }

    .content-aboutjt1 h1 {
        font-family: 'Oswald', sans-serif;
        overflow: hidden;
        font-size: 3em;
        padding-bottom: 10px;
    }
}

@media (max-width: 1064px) {
    .content-aboutjt1 {
        height: auto;
        margin-bottom: 2em;
    }
}

@media (max-width: 445px) {
    .grid_content {
        display: block;
        width: auto;
    }
}

@media (max-width: 590px) {
    .others-header h1 {
        font-family: 'Oswald', sans-serif;
        padding-top: 1.4em;
        font-size: 2em;
        text-align: center;
        padding-bottom: 1em;
    }
}

@media (max-width: 514px) {
    .gridFooter {
        display: grid;
        grid-template-columns: repeat(3, 4.7em);
    }

    .footerIcon1 {
        margin: 4px;
    }
}

@media (max-width: 480px) {
    .content-aboutjt2 {
        display: none;
    }
}

/* ===================== */

@media (max-width: 1360px) {

    #container,
    #container_two {
        width: 65vw;
        height: auto;
        margin: 0 auto;
        display: block;
        grid-auto-flow: column;
    }

    .one_highs,
    .two_highs,
    .three_highs,
    .five_highs,
    .high_one,
    .high_two,
    .high_three,
    .high_four {
        height: 10em;
    }
}

@media (max-width: 570px) {

    #container,
    #container_two {
        width: 65vw;
        height: auto;
        margin: 0 auto;
        display: block;
        grid-auto-flow: column;
    }

    .one_highs,
    .two_highs,
    .three_highs,
    .five_highs,
    .high_one,
    .high_two,
    .high_three,
    .high_four {
        height: 7em;
    }
}


@media (max-width: 450px) {

    .one_highs,
    .two_highs,
    .three_highs,
    .four_highs,
    .high_one,
    .high_two,
    .high_three,
    .high_four {
        height: 5em;
    }

    .highlight_text {
        line-height: 25px;
    }

    .highlight_text span {
        font-size: 16px;
    }
}