.desktopHide {
    display: none;
}

/*CSS Homepage Responsive*/
/*CSS kicks in when the device is 3840 and above*/
@media only screen and (min-width: 3840px) {
    .hero {
        margin: 8vh auto 0 auto;
    }

    /* Four Student Types and Four Colleges */
    .row .column, .service-wrapper {
        height: 25vh;
        width: calc(24% - 1rem);
    }
}

/*CSS kicks in when the device is 2560 and above*/
@media only screen and (min-width: 2560px) {
    #main-uhv-search {
        max-width: 90rem;
        width: 85rem;
    }

    /* Four Student Types and Four Colleges */
    .row .column, .service-wrapper {
        height: 25vh;
        width: calc(24% - 1rem);
    }

    .button-red-1 {
        min-height: unset;
    }
}

/*CSS kicks in when the device is 2560 and below*/
@media only screen and (max-width: 2560px) {
    .row .column, .service-wrapper {
        height: 48vh;
    }
}


/*CSS kicks in when the device is 1600 and below*/
@media only screen and (max-width: 1600px) {
    /* Majors and Degrees */
    .homepage-search-bar {
        width: 80%;
    }

    #main-uhv-search {
        max-width: unset;
        top: 0;
        width: 100%;
    }

    .button-1 {
        max-width: 30vw;
    }

    /* Numbers */
    .grid2x2 > div {
        flex-basis: calc(42% - 10px);
    }

    .jaguarHead {
        width: 18%;
    }

    /* Four Student Types */
    .row {
        gap: 2rem;
        width: 100%;
    }

        .row .column, .service-wrapper {
            height: 40vh;
            width: calc(23% - 0rem);
        }

    /* Information Slider */
    .splide {
        padding-bottom: 3rem;
    }

    ul.splide__pagination.splide__pagination--custom {
        right: calc(50% - 500px);
    }

    /* Four Colleges */
    .colleges {
        gap: 2rem;
        width: 100%;
    }

    .service-wrapper-inner {
        top: 65%;
    }
}

/*CSS kicks in when the device is 1470 and below*/
@media only screen and (max-width: 1470px) {
    .row .column, .service-wrapper {
        height: 48vh;
        width: calc(24% - 1rem);
    }
}

/*CSS kicks in when the device is 1366 and below*/
@media only screen and (max-width: 1366px) and (orientation: landscape) {
    /* Four Student Types and Four Colleges */
    .row .column, .service-wrapper {
        height: 40vh;
    }

    .service-wrapper-inner h2 {
        font-size: 1.6rem;
    }

    .effect4v2 .overlay > h2 {
        font-size: 1.75rem;
    }
}

/*CSS kicks in when the device is 1175 and below*/
@media only screen and (max-width: 1175px) {
    .hero {
        margin: 15vh auto 0 auto;
    }
}

/*CSS kicks in when the device is 1080 and below*/
@media only screen and (max-width: 1080px) and (orientation: landscape) {
    .effect4v2 .overlay > h2 {
        font-size: 1.35rem;
    }
}

/*CSS kicks in when the device is 1024 and below*/
/*@media only screen and (max-width: 1024px) and (orientation: landscape) {
    .hero {
        margin: 16vh auto 0 auto;
    }
}*/

/*CSS kicks in when the device is 1024 and below*/
/* Small devices such as phones (1024px or lesser) */
@media only screen and (max-width: 1024px) {
    .hero {
        margin: 3vh auto 0 auto;
        max-height: 100vh;
    }

    .homepage-search-bar {
        width: 80%;
    }

    #main-uhv-search {
        max-width: unset;
        top: 0;
        width: 100%;
    }

    .button-1 {
        min-width: 38vw;
    }

    .grid2x2 {
        flex-direction: column;
        flex-wrap: nowrap;
    }

        .grid2x2 > .box:first-of-type {
            margin: 1rem 4rem 1rem 1rem;
        }

    .jaguarHead {
        width: 15%;
    }

    .row {
        gap: 1rem;
        width: 100%;
    }

        .row .column, .service-wrapper {
            height: 30vh;
            max-height: 70vh;
            width: 42%;
            width: calc(48% - 5px);
        }

    .effect4v2 .overlay > h2 {
        height: auto;
    }

    ul.splide__pagination.splide__pagination--custom {
        position: relative;
    }

    /*Four Colleges*/
    .colleges {
        gap: 2rem;
        width: 100%;
    }

    .service-wrapper-inner {
        display: none;
    }

    .fade-overlay {
        opacity: 1;
    }

    .service-wrapper > a > div > img.college-logo {
        height: auto;
        margin: 1vh auto;
        width: auto;
    }

    .profileCards > .column {
        flex: 1 0 calc(50% - 1rem);
    }

    .CTA-heading {
        margin-top: 1rem;
    }

    .container h1 {
        font-size: 2.5rem;
        line-height: 1;
        margin-bottom: 0.5rem;
    }
}

/*CSS kicks in when the device is 926 and below*/
/* Small devices such as phones (926px or lesser) */
@media only screen and (max-width: 926px) {
    .tamuv-ctas_actions {
        display: none;
    }

    .row .column, .service-wrapper {
        height: 50vh;
        max-height: 80vh;
        width: 45%;
    }

    .profileCards > .column {
        flex: 1 0 calc(50% - 1rem);
    }

    .am-stickers.four {
        width: 12%;
        z-index: 1;
    }

    .container h1 {
        font-size: 2.35rem;
        line-height: 1;
        margin-bottom: 0.5rem;
    }
}


/*CSS kicks in when the device is 852 and below*/
/* Small devices such as phones (852px or lesser) */
@media only screen and (max-width: 852px) and (orientation: portrait) {
    .hero {
        margin: 5vh auto 0 auto;
        max-height: 100vh;
    }

    /* Student Types */
    .row .column {
        height: 40vh;
        max-height: 80vh;
        width: 45%;
    }

    /* Four Colleges */
    .service-wrapper {
        height: 25vh;
        max-height: 50vh;
        width: 45%;
    }

        .service-wrapper > a > div > img.college-logo {
            height: auto;
            margin: 0 auto;
            width: 100%;
        }

    .container {
        padding-left: 2.5rem;
        padding-right: 2.5rem;
    }

    .container h1 {
        font-size: 1.85rem;
        line-height: 1;
        margin-bottom: 0.5rem;
    }
}

/*CSS kicks in when the device is 852 and below*/
/* Small devices such as phones (852px or lesser) */
@media only screen and (max-width: 852px) and (orientation: landscape) {
    .hero {
        margin: 18vh auto 0 auto;
    }

    /* Four Student Types */
    .row .column {
        height: 80vh;
        max-height: 80vh;
        width: 45%;
    }

    /* Information Slider */
    .wp-block-columns.ba-banner-columns {
        width: 100%;
    }

    /* Four Colleges */
    .service-wrapper {
        height: 80vh;
        max-height: 80vh;
        width: calc(48% - 5px);
    }
}

/*CSS kicks in when the device is 768 and below*/
/* Small devices such as phones (768px or lesser) */
@media only screen and (max-width: 768px) {
    .mobileHide {
        display: none;
    }

    .mobileShow {
        display: block;
    }

    /* Hero image */
    .hero {
        display: flex;
        flex-direction: column;
    }

    .hero_image-wrapper {
        display: block;
        height: 100%;
        margin-top: 11vh;
        position: unset;
        width: 100%;
    }

    /* Majors and degrees */
    .homepage-search-bar {
        display: block;
        margin: 0;
        position: relative;
        top: -4vh;
    }

    #main-uhv-search input {
        border: 1px solid var(--eerie-black);
    }

    .majors-buttons {
        display: flex;
        justify-content: center;
        margin-top: 0;
        width: 100%;
    }

    #main-uhv-search {
        top: 0;
        width: 100%;
    }


    .columns-btn {
        margin-bottom: 0;
        width: 100%;
    }

    .button-1 {
        font-size: 1rem;
        max-width: unset;
        padding: 10px 16px;
    }

    /* Numbers */
    .grid2x2 > div {
        flex-basis: 80%;
        flex-direction: column;
    }

    .red-number {
        justify-content: unset;
        width: 100%;
    }

    .text-content {
        width: 100%;
    }

    .am-stickers {
        display: none;
    }

    /* Six Student Types */
    #student-images {
        background-color: var(--white);
        padding: 1rem;
    }

        #student-images .row {
            max-height: unset;
        }

    .row {
        gap: 0.5rem;
        justify-content: space-around;
        width: 100%;
    }

        .row .column {
            flex: 1 0 45%;
            height: 35vh;
            margin-bottom: 1.5rem;
            width: 100%;
        }

    .effect4v2 .overlay > h2 {
        font-size: 1.2rem;
        padding: 1rem 0 1.5rem 0;
    }

    /* Information Slider */
    ul.splide__pagination.splide__pagination--custom {
        position: relative;
        left: 0;
        width: 90%;
        color: #fff;
        flex-direction: column;
        margin: 0;
        padding: 15px;
    }

    .splide__track--fade > .splide__list > .splide__slide {
        padding: 0 1rem;
    }

    .wp-block-columns.ba-banner-columns {
        display: block;
        width: 100%;
    }

    .splide__toggle {
        bottom: 5px;
        width: auto;
    }

    .splide__toggle {
        right: 5px;
        padding: 5px 10px;
    }

    /* Four Colleges */
    #four-colleges {
        background: none;
        display: block;
        padding: 1rem 0;
        width: 100%;
    }

    .colleges {
        gap: 1rem;
        width: 95%;
    }

    .service-wrapper {
        height: 35vh;
    }

    .service-wrapper-inner, .service-wrapper-inner-1 {
        top: 55%;
    }

        .service-wrapper-inner h2, .service-wrapper-inner-1 h2 {
            font-size: 1rem;
        }

    /* Our Leaders */
    #leaders h2, .profiles h2 {
        font-size: 3rem;
        margin: 0 auto 4vh auto;
        text-align: center;
        line-height: normal;
    }

    #leaders, .profiles {
        padding: 2rem;
    }

        #leaders .columns-4 {
            justify-content: center;
            width: 100%;
        }

    .profileCards > .column {
        flex: 0 0 calc(50% - 1rem);
    }

    .container {
        padding-left: 0;
        padding-right: 0;
    }

        .container h1 {
            font-size: 1.85rem;
            line-height: 1;
            margin-bottom: 1rem;
            margin-top: 2rem;
        }

    .button-red-1 {
        margin: 0 auto;
        max-width: unset;
        min-height: unset;
        min-width: unset;
        width: 90%;
    }
}

/*CSS kicks in when the device is 768 and below while in landscape orientation*/
/* Small devices such as phones (768px or lesser and in landscape) */
@media only screen and (max-width: 768px) and (orientation: landscape) {
    .hero {
        margin: 18vh auto 0 auto;
    }

    .hero_image-wrapper {
        height: auto;
        margin-top: 0;
        position: absolute;
        width: 100%;
    }

    /* Four Student Types */
    .row .column {
        height: 80vh;
        max-height: 80vh;
        width: 45%;
    }

    .effect4v2 .overlay > h2 {
        font-size: 1.9rem;
    }

    /* Information Slider */
    .wp-block-columns.ba-banner-columns {
        width: 100%;
    }

    /* Four Colleges */
    .service-wrapper {
        height: 85vh;
        max-height: 90vh;
        width: calc(48% - 5px);
    }

    .profileCards > .column {
        flex: 0 0 calc(48% - 0rem);
    }
}

/*CSS kicks in when the device is 926 and below*/
/* Small devices such as phones (926px or lesser and in landscape) */
@media only screen and (max-width: 926px) and (orientation: landscape) {
    .row .column, .service-wrapper {
        height: 80vh;
        max-height: 80vh;
        width: 45%;
    }

    .profileCards > .column {
        flex: 1 0 calc(50% - 1rem);
    }

    .am-stickers.four {
        width: 12%;
        z-index: 1;
    }

    ul.splide__pagination.splide__pagination--custom {
        right: unset;
        position: absolute;
        top: 30%;
    }
}

/*CSS kicks in when the device is 740 and below*/
/* Small devices such as phones (740px or lesser) */
@media only screen and (max-width: 740px) and (orientation: landscape) {
    .homepage-search-bar {
        position: relative;
        top: 30vh;
    }

    .majors-buttons {
        flex-direction: row;
    }
}

/*CSS kicks in when the device is 428 and below while in portrait orientation*/
/* Small devices such as phones (428px or lesser and in portrait) */
@media only screen and (max-width: 428px) and (orientation: portrait) {
    .row .column {
        height: 28vh;
    }

    .service-wrapper {
        height: 20vh;
    }

    .majors-buttons {
        flex-direction: column;
    }

    .columns-btn {
        padding: 0.25rem;
    }

    .profileCards > .column {
        flex: 0 0 calc(100% - 1rem);
    }
}

/*CSS kicks in when the device is 415 and below while in landscape orientation*/
/* Small devices such as phones (415px) */
@media only screen and (max-width: 415px) {
    /* Four Student Types */
    .row .column {
        height: 28vh;
        max-height: 80vh;
        width: 45%;
    }

    .effect4v2 .overlay > h2 {
        font-size: 1rem;
    }

    /* Information Slider */
    .wp-block-columns.ba-banner-columns {
        width: 100%;
    }

    /* Four Colleges */
    .service-wrapper {
        height: 23vh;
        max-height: 90vh;
        width: calc(48% - 5px);
    }

        .service-wrapper > a > div > img.college-logo {
            height: auto;
            margin: 0 auto;
        }

    /* Sticker Content Type */
    .grid2x2 > div {
        align-items: center;
        justify-content: center;
    }

    .grid2x2 > .box {
        margin: 1rem;
    }

    .profileCards > .column {
        flex: 0 0 calc(100% - 0rem);
    }
}