/* ============= Responsive Adjustments ============= */
/* Organized from smallest to largest screen sizes */

/********** Landscape Phone (576px and below) **********/
@media (min-width: 0px) and (max-width: 450px) {
    .vertical-spacing-s {
        height: 80px;
    }

    .vertical-spacing {
        height: 100px;
    }

    /* Navigation */
    .navigation-bar-links-container {
        display: none;
    }
    
    .navigation-bar-hamburger-button {
        display: block;
    }
    
    .navigation-bar-right-side-icons {
        gap: 15px;
    }
    
    .nav-links {
        position: fixed;
        top: 80px;
        left: -100%;
        width: 100%;
        height: calc(100vh - 80px);
        background: var(--primary);
        flex-direction: column;
        align-items: center;
        justify-content: flex-start;
        padding-top: 40px;
    }
    
    .nav-links.active {
        left: 0;
    }
    
    .nav-links li {
        margin: 15px 0;
    }
    
    .hamburger {
        display: block;
    }

    .stats .container {
        display: flex;
        flex-direction: column;
    }
    
    /* Dropdown */
    .dropdown-menu {
        position: static;
        box-shadow: none;
        opacity: 1;
        visibility: visible;
        transform: none;
        display: none;
    }
    
    .dropdown-container:hover .dropdown-menu {
        display: block;
    }

    #index-landing-page-main {
        position: relative;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        height: fit-content;
        background-size: 270%;
        margin-bottom: -130px;
    }

    #contact-us-landing-section, 
    .contact-us-landing-section {
        position: relative;
        padding: 30px 5%;
        width: 100%;
    }
    

    .dynamic-vertical-spacing {
        display: none;
        position: relative;
        height: 10vh;
    }

    .landing-page-info-container {
        position: relative;
        top: -80px;
        width: 100%;
        border-radius: 0;
        padding: 50px 0;
    }

    .landing-page-info-container-right {
        position: relative;
        padding: 30px 10%;
        border-radius: 0px;
        bottom: -20px;
        width: 100vw;
    }

    .landing-page-info-container-left {
        justify-content: center;
        padding: 50px 10% 30px 10%;
        border-radius: 0px;
        width: 100vw;
    }

    .landing-page-buttons-container {
        width: 100%;
        display: flex;
        justify-content: center;
        flex-wrap: wrap-reverse;
    }


    /* index page - newsletter section */
    /* .index-news-snippet-title {
    font-size: 5vw;
} */

    /* rugby achievements container */
    #rugby-achievements-achieved-container {
        flex-direction: column;
    }


    /* facebook section */
    #facebook-posts-main-container {
        width: 100%;
        border-radius: 0;

        .facebook-posts-title-badge-container img {
            height: 15px;
            width: 15px;
        }
    }

    .navigation-bar-main-container {
        padding: 0 20px;
    }
    
    .stat-item {
        min-width: 150px;
    }
    
    .stat-number {
        font-size: 2.5rem;
    }
    
    .footer-content {
        grid-template-columns: 1fr;
    }
    
    .footer-bottom {
        flex-direction: column;
        gap: 10px;
    }

    .footer-links-container {
        display: flex;
        justify-content: center;
    }

    /* events-calendar */
    #events-calendar-main-container {
        gap: 85px 20px;
        padding: 0 7%;
    }

    .events-calendar-container {
        width: 130px;
    }

    .events-calendar-container .events-calendar-date {
        font-size: 6rem;
        top: -65px;
    }

    .events-calendar-list-container h2 {
        font-size: clamp(1.2rem, 1.3rem, 3vw);
    }

    .events-calendar-list-container li {
        list-style: none;
        font-size: 0.75rem;
    }

    .contact-us-exco-intro-paragraph {
        padding: 0;
    }

    /* match day documents */
    .match-day-duties-documents-container {
        left: 50%;
        transform: translateX(-50%);
        width: 100vw;
        border-radius: 0;
    }

    .match-day-duties-documents-header-container {
        width: 100vw;
        border-radius: 0;
    }

    #virtual-meetings-latest-video-main-container {
        width: 100%;
        border-radius: 0;
        padding: 30px 10%;
    }

    /* our history */
    .societies-included-with-photo-container {
        width: 100vw;
        border-radius: 0;
        padding: 20px 11%;
    }

    .societies-included-with-photo-container .first-wprrs-exco-1992-img {
        width: 10vw;
    }

    .first-wprrs-exco-1992-text {
        ul li {
            position: relative;
            margin-left: 0px;
        }
    }

    /* boksmart */
    .boksmart-img-container .boksmart-img {
        width: 65vw;
    }

    .boksmart-text-container {
        width: 100vw;
        border-radius: 0;
    }

    .my-boksmart-img-text-container {
        width: 100vw;
        border-radius: 0;

        img {
            position: relative;
            width: 70%;
            left: 50%;
            transform: translateX(-50%);
        }

        div {
            position: relative;
            width: 80%;
            left: 50%;
            transform: translateX(-50%);
        }
    }

    /* junior/senior application */
    #junior-application-form,
    #senior-application-form {
        width:  100vw;
        padding: 0 0px 10px 0px;
        border-radius: 0px;
    }

    .application-form-main-title {
        width: 80%;
    }

    #senior-application-form .step-label {
        display: none;
    }

    .align-divs-horizontally input,
    .align-divs-horizontally select {
        flex-grow: 1;
        width: 100px;
        max-width: auto;
        height: 30px;
        align-items: center;
        padding: 0px 10px;
        border: 1px solid black;
        border-radius: 10px;
        font-family: 'Comfortaa';
        font-size: 0.85rem;
    }

    /* sponsors page */
    #sponsors .subsidiary-sponsor-card img {
      position: relative;
      height: 50px;
      width: auto;
      flex-grow: 1;
    }
}




@media (max-width: 500px) {

    #our-history-portfolios-main-container .honorary-achievements-column-container {
        position: relative;
        padding: 0;

        .honorary-achievements-chairmen-info {
            position: relative;
            width: 100%;
            margin: 0;
        }

        .honorary-achievements-chairmen-info p {
            font-size: 0.85rem;
        }
    }
}




@media (max-width: 633px) {
    * {
        p, a, li {
            font-size: 0.9rem;
        }
    }

    /* index page - newsletter section */
    /* .index-news-snippet-title {
        font-size: 5vw;
    } */

    #useful-links-main-container {
        column-gap: 50px;
    }

    .useful-links-left-container {
        flex-direction: row;
        column-gap: 20px;
        margin-bottom: 15px;
        

        .useful-link-text-1 {
            font-size: 6vw;
        }

        .useful-link-text-2 {
            font-size: 6vw;
        }
    }

    /* useful links */
    .useful-link-div {
        column-gap: 10px;
        margin-bottom: -5px;

        svg {
            width: 30px;
        }

        a {
            font-size: 0.9rem;
        }
    }

    .useful-links-right-container {
        left: 0px;
    }

    /* facebook */
    .facebook-posts-profile-card-container {
        background-color: transparent;
        padding: 0;
    }

    /* sponsors page */
    .hero-cta {
        position: relative;
        flex-direction: column;
        gap: 15px;
        width: 80%;
        left: 50%;
        transform: translateX(-50%);
    }
}




/********** Small Tablet (695px and below) **********/
@media (max-width: 695px) {
    /* Navigation */
    .navigation-bar-links-container {
        display: none;
    }
    
    .navigation-bar-hamburger-button {
        display: block;
    }
    
    .navigation-bar-right-side-icons {
        gap: 15px;
    }
    
    .nav-links {
        position: fixed;
        top: 80px;
        left: -100%;
        width: 100%;
        height: calc(100vh - 80px);
        background: var(--primary);
        flex-direction: column;
        align-items: center;
        justify-content: flex-start;
        padding-top: 40px;
    }
    
    .nav-links.active {
        left: 0;
    }
    
    .nav-links li {
        margin: 15px 0;
    }
    
    .hamburger {
        display: block;
    }
    
    /* Dropdown */
    .dropdown-menu {
        position: static;
        box-shadow: none;
        opacity: 1;
        visibility: visible;
        transform: none;
        display: none;
    }
    
    .dropdown-container:hover .dropdown-menu {
        display: block;
    }

    .footer-links-container {
        justify-content: space-evenly;
    }
    
    .footer-contact-numbers, 
    .footer-email-addresses, 
    .footer-about-container {
        text-align: center;
        justify-content: center;
    }

    #index-landing-page-main {
        height: fit-content;
    }

   .landing-page-info-container {
        position: relative;
    }

    .dynamic-vertical-spacing {
        position: relative;
        height: 10vh;
    }
 
    /* #honorary-achievement-landing-section, */
    #contact-us-landing-section, 
    #honorary-achievement-landing-section,
    #our-history-landing-section {
        padding: 30px 5%;
        width: 80%;
    }

    .contact-us-exco-intro-paragraph {
        padding: 0 10%;
    }

    /* sponsors page */
    .subsidiary-sponsor-card img {
      position: relative;
      height: 80px;
      width: auto;
      flex-grow: 1;
    }
}





@media (max-width: 700px) {
    /* Navigation */
    .navigation-bar-links-container {
        display: none;
    }
    
    .navigation-bar-hamburger-button {
        display: block;
    }
    
    .navigation-bar-right-side-icons {
        gap: 15px;
    }
    
    .nav-links {
        position: fixed;
        top: 80px;
        left: -100%;
        width: 100%;
        height: calc(100vh - 80px);
        background: var(--primary);
        flex-direction: column;
        align-items: center;
        justify-content: flex-start;
        padding-top: 40px;
    }
    
    .nav-links.active {
        left: 0;
    }
    
    .nav-links li {
        margin: 15px 0;
    }
    
    .hamburger {
        display: block;
    }
    
    /* Dropdown */
    .dropdown-menu {
        position: static;
        box-shadow: none;
        opacity: 1;
        visibility: visible;
        transform: none;
        display: none;
    }
    
    .dropdown-container:hover .dropdown-menu {
        display: block;
    }

    #rugby-achievements-achieved-container .rugby-achievements-divider {
        position: absolute;
        display: none;
    }

    .footer-links-container {
        justify-content: space-evenly;
    }
}




/********** Tablet (768px and below) **********/
@media (max-width: 768px) {
    #rugby-achievements-achieved-container .rugby-achievements-divider {
        position: absolute;
        display: none;
    }

    /* Navigation */
    .navigation-bar-links-container {
        display: none;
    }
    
    .navigation-bar-hamburger-button {
        display: block;
    }
    
    .navigation-bar-right-side-icons {
        gap: 15px;
    }
    
    .nav-links {
        position: fixed;
        top: 80px;
        left: -100%;
        width: 100%;
        height: calc(100vh - 80px);
        background: var(--primary);
        flex-direction: column;
        align-items: center;
        justify-content: flex-start;
        padding-top: 40px;
    }
    
    .nav-links.active {
        left: 0;
    }
    
    .nav-links li {
        margin: 15px 0;
    }
    
    .hamburger {
        display: block;
    }
    
    /* Dropdown */
    .dropdown-menu {
        position: static;
        box-shadow: none;
        opacity: 1;
        visibility: visible;
        transform: none;
        display: none;
    }
    
    .dropdown-container:hover .dropdown-menu {
        display: block;
    }
    
    /* Hero */
    .hero-title {
        font-size: 2.5rem;
    }
    
    /* .hero-cta {
        flex-direction: column;
        gap: 15px;
    } */
    
    /* Forms */
    .form-group {
        grid-template-columns: 1fr;
    }

    .footer-links-container {
        justify-content: space-evenly;
    }
}

/********** Custom Breakpoint (941px and below) **********/
@media (max-width: 941px) {


    .whos-the-ref-btn-img-full {
        display: none;
    }

    .whos-the-ref-btn-img-small {
        position: relative;
        display: block;
    }


    #rugby-achievements-achieved-container .rugby-achievements-divider {
        position: absolute;
        display: none;
    }

    .footer-container-bottom {
        justify-content: center;
    }
    
    .footer-contact-number-info svg {
        display: none;
    }

    .slider-wrapper .slide, 
    .slider-wrapper .slide-last {
        border-radius: 10px;
        padding: 10px;
        width: 200px;
        height: 250px;
    }
}

/********** Desktop (992px and below) **********/
@media (max-width: 992px) {


    .navigation-bar-links-container {
        gap: 25px;
    }
    
    .contact-container {
        grid-template-columns: 1fr;
    }
    
    .contact-info {
        text-align: center;
    }
    
    .contact-details {
        justify-content: center;
    }
}

/********** Custom Breakpoint (1137px and below) **********/
@media (max-width: 1199px) {


    .footer-container-top {
        justify-content: center;
        margin-top: 100px;
    }
    
    .footer-logo-main {
        margin-bottom: 20px;
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        top: -80px;
        background-color: rgb(100, 110, 130);
        padding: 20px;
        height: 170px;
        width: 170px;
        border-radius: 10px;
    }
    
    .footer-links-container {
        background-color: rgb(100, 110, 130);
        padding: 15px 20px;
        border-radius: 10px;
    }
}

/********** Large Desktop (1200px and below) **********/
@media (max-width: 1200px) {

    .navigation-bar-main-container {
        padding: 0 5%;
    }
}