* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
    font-family: Ariaal, sans-serif;
}

body {
    background-color: #ffffff;
    overflow-x: hidden;
}

:root {
    --accent-color: #32B4B4;
    --gray-color: rgb(0, 0, 0, 0.6);
    --light-black-color: rgb(255, 255, 255, 0.7);
    --main-color-start: #3B8989;
    --main-color-end: #2E6C6C;
    --main-grey: #5C7070;
    --secondary-grey: #6D7878;

    --heading2-font: bold 32px 'Arial', ui-sans-serif;
    --heading3-font: bold 24px 'Arial', ui-sans-serif;
    --heading4-font: bold 18px 'Arial', ui-sans-serif;
}

.default-appearance {
    opacity: 1 !important;
    translate: 0 0 !important;
    transition: opacity 0.5s, translate 0.5s;
}

.opacity-appearance {
    opacity: 1 !important;
    transition: opacity 0.5s;
}

.header {
    display: flex;
    align-items: center;
    padding: 0.75rem 5vw;
    background-color: #fff;
    position: sticky;
    top: 0;
    z-index: 2;
}

.header-shadow {
    box-shadow: 0 0 10px #000000;
}

.main_logo {
    height: 3rem;
    margin-right: 10rem;
    object-fit: cover;
}

.burger_menu_open_btn, .burger_menu_close_btn {
    outline: none;
    background-color: transparent;
    border: none;
    cursor: pointer;
    width: 2rem;
    height: 2rem;
    padding: 0.5rem;
    display: none;
}

.butger_menu_icon {
    width: 100%;
    height: 100%;
}

.nav_cont {
    display: flex;
    width: 100%;
    justify-content: space-between;
}

.nav_list, .address_list {
    list-style-type: none;
    display: flex;
}

.nav-link, .address_link {
    text-decoration: none;
    color: var(--main-grey);
    padding: 1rem;
    display: inline-block;
    width: 100%;
}

.address_link {
    color: var(--accent-color);
    font-style: normal;
}

.gradient-hr {
    background: linear-gradient(to right, #fff, var(--main-color-end));
    height: 1px;
    border: none;
}

.reverse {
    rotate: 180deg;
}


/* FOOTER */
footer {
    padding: 5rem 10vw 1rem;
    background-color: #fff;
}

.footer_paragraph {
    color: rgb(0, 0, 0, 0.6);
    margin-bottom: 1rem;
    font-size: 0.825rem;
}

@media screen and (max-width: 960px) {
    .header {
        justify-content: space-between;
    }

    .main_logo {
        margin: unset;
    }

    .burger_menu_open_btn, .burger_menu_close_btn {
        display: inline-block;
    }

    .nav_cont {
        position: fixed;
        top: 0;
        bottom: 0;
        right: 0;
        width: 80vw;
        background-color: #fff;
        padding: 5rem 1rem;
        flex-direction: column;
        transform: translateX(100%);
        transition: all 0.1s ease-in-out;
        z-index: 2;
    }

    .nav_cont[class~="opened"] {
        transform: translateX(0);
        box-shadow: -2px 0rem 8px;
    }

    .burger_menu_close_btn {
        position: absolute;
        top: 1rem;
        right: 1rem;
    }

    .close_icon {
        width: 100%;
        height: 100%;
    }

    .nav_list, .address_list {
        flex-direction: column;
        font-size: 1.25rem;
    }

    /* FOOTER */
    footer {
        padding: 5rem 5vw 1rem;
    }

    .footer_paragraph {
        font-size: 0.625rem;
    }
}