@import url("global_vars.css");

@media screen and ( max-width: 820px ) {


    .footer-bar{
        height: 200px;
        font-size: 30px;
        display:block;
    }
    .footer-bar li{
        padding-top: 0;
    }
}

@media screen and ( min-width: 821px ) {
    .footer-bar{
        height: var(--footer-height);
        font-size: 30px;
        display:flex; 
        align-items: center;
    }
        .footer-bar li{
        padding-top: 15px;
    }
}

@media screen and (orientation:landscape) {
    .footer-bar{
        height: var(--footer-height);
        font-size: 30px;
        display:flex;
        align-items: center;
    }
    .footer-bar li{
        padding-top: 15px;
    }
}


@media screen and (orientation:portrait) {
    .footer-bar{
        height: 200px;
        font-size: 30px;
        display:block;
    }
    .footer-bar li{
        padding-top: 0;
    }
}

#footerNav{
    width: 100%;
    background: #333;
    display: block;
    align-items: center;
    justify-content: center;
    bottom: 0;
}

/* Menu Text and overall styling */
.footer-bar {
    padding: 0px;
    list-style-type: none;
    font-family: "Heebo", Arial, sans-serif;
    font-weight: 500;
    margin-bottom:5px;
    margin-top: 0;
}

.footer-bar li{
    position: relative;
    padding-top: 15px;
}



.footer-bar li:first-child a{
    padding-left: 0;
}

.footer-bar li a{
    padding: 0rem 0.5vw;
    color:white;
    transition: all 0.5s ease-in-out;
    text-decoration: none;
}

.footer-bar li a:hover{
    color: #EC7D76;
}


.menu-item{
    word-break: normal !important;
}

.social-bar-full-width{
    width: 100%;
    background: #111;
}

.social-bar{
    right: 0;
    height: 70px;
    margin: 0;
    padding: 0px;
    list-style-type: none;
    /* display: flex; */
    font-family: "Heebo", Arial, sans-serif;
    font-weight: 500;
}


.social-bar li{
    position: relative;
    padding-top: 15px;
}



.social-bar li:first-child a{
    padding-left: 0;
}

.social-bar li a{
    padding: 0rem 0.5vw;
    color:rgb(180, 0, 0);
    transition: all 0.5s ease-in-out;
    text-decoration: none;
}

.social-bar li a:hover{
    color: #EC7D76;
}

.footer-icons{
    font-size: 50px;
}