


/* Phone: Portrait */ @media (max-width: 768px) and (orientation: portrait) {
    /* General Styles */
  
    
    span {
 
        display: block;
        text-align: center;
            font-size: 15pt;
        
    }

    /* Footer Styles */
    footer {
        box-sizing: border-box;
        text-align: center;
        background: #3f3f3f;
        height: 500px; /* Adjusted for flexibility */
        width: 100%;
        padding: 0;
        align-items: center;
        
        
    }

    /* Footer Container */
    .footer-container {
        width: 100%;
        height: auto;
        text-align: center;
        display: flex;
        flex-direction: column;
        align-items: center;
        
    }

    /* Footer Sections */
    .foot-left, .foot-right {
        width: 100%;
        height: auto;
        margin: 0;
        padding: 0;
        padding-top: 25px;
        padding-bottom: 25px;

    }

    /* Reordering the Sections */
    .logo-foot-container {
        order: 2; /* Moves logo to the top */
        padding: 0;
    }

    .foot-left {
        order: 1; /* Places 'Always Be Curious' in the middle */
    }

    .foot-right {
        order: 3; /* Moves social icons to the bottom */
    
    }

    /* Links */
    .foot-left a, .foot-right a {
        display: block;
        color: #ebebeb;
        padding: 0;
        padding-top: 25px;
        padding-bottom: 25px;


    }

  

    /* Logo */
    .logo-foot-container {
        width: 100%;
        height: 100px;
        text-align: center;
        margin: 0;
        padding-top: 0;
        padding-bottom: 0;
    }

    .logo-foot {
        height: 100px;


    }


}





/* Phone: Landscape */ @media (max-width: 932px) and (orientation: landscape) {

    /* Footer Styles */
    footer {
        position: inline-block;
        height: 75px; /* Match desktop version */
        display: flex;
        align-items: center;
        justify-content: center;
        
    }

    /* Footer Container */
    .footer-container {
        width: 100%;
        display: flex;
        flex-direction: row; /* Keep it in a row layout */
        justify-content: space-between;
        align-items: center;
        padding: 0 20px; /* Adjust spacing */
    }

    /* Footer Sections */
    .foot-left, .foot-right {
        flex: 1;
        text-align: center;
        padding-top: 0;
        width: 22px;
    }

    /* Ensuring links appear in a row */
    .foot-left a, .foot-right a {
        display: inline-block;
        color: #ebebeb;
        font-size: 13pt; /* Match desktop version */
        padding: 0 10px;
    }

    /* Logo */
    .logo-foot-container {
        flex: 0 0 100px;
        display: flex;
        justify-content: center;
        height: 50px;
        padding-top: 0;
    }

    .logo-foot {
        height: 50px; /* Keep logo size consistent */
    }
}