:root {
    --main-bg:#e4e2e7;
    --primary:#FF4500;
    --primary-button-text:#FFE5D1;
    --navigation-text:#A7A7A7;
    --title-text:#777777;
}

body {
    overflow-x: hidden;
    margin: 0;
    background: var(--main-bg);
}

input:focus, textarea:focus, select:focus{
    outline: none;
}

.responsive-invisible {
    display: block;
}

.responsive-visible {
    display: none;
}

.mobile-menu-icon {
    display: none;
}

.mobile-menu-container {
    display: none;
}

.hamburger-menu-icon {
    z-index: 22;
    top: 20px;
    right: 20px;
    position: fixed;
    width: 40px;
    height: 40px;
    -webkit-filter: drop-shadow( 3px 3px 2px rgba(0, 0, 0, .7));
    filter: drop-shadow( 3px 3px 2px rgba(0, 0, 0, .7));
}


.background {
    position: absolute;
    width: 100%;
}

.content-container {
    position: relative;
    height: 6000px;
}

.content {
    z-index: 10;
    margin: auto;
    right: 0;
    left: 0;
    position: absolute;
    width: 80%;
    display: flex;
    flex-flow: column;
    align-items: center;
}

.full-width-page {
    display: flex;
    justify-content: center;
    width: 100%;
    height: 100vh;
}

.flex-filler {
    flex-grow: 1;
}


.green-parrot-logo {
    width: 181px;
    height: 181px;
    position: absolute;
    left: -57px;
    /* left: 8%; */
    top: 30px;
    background-size: contain;
    background-repeat: no-repeat;
    background-image: url('../assets/img/logo_green_parrot.png');
}

.main-menu-container {
    padding-left: 120px;
    margin: auto;
    position: absolute;
    box-sizing: border-box;
    top: 70px;
    height: 70px;
    width: 100%;
    background: white;
    box-shadow: 0 3px 30px #5F9C080D;
    border-radius: 4px;
    display: flex;
    align-items: center;
}

.palm-1 {
    position: absolute;
    left: -867px;
    width: 1310px;
    height: 1371px;
    background-repeat: no-repeat;
    background-position: right;
    background-size: contain;
    background-image: url('../assets/img/palm_1.svg');
}

.palm-2 {
    position: absolute;
    top: -200px;
    right: -767px;
    width: 1308px;
    height: 1590px;
    background-repeat: no-repeat;
    background-position: left;
    background-size: contain;
    background-image: url('../assets/img/palm_2.svg');
}

.palm-3 {
    z-index: 3;
    position: absolute;
    left: -1183px;
    top: 1371px;
    width: 1758px;
    height: 1810px;
    background-repeat: no-repeat;
    background-position: right;
    background-size: cover;
    background-image: url('../assets/img/palm_3.svg');
}

.palm-4 {
    position: absolute;
    top: 1590px;
    right: -500px;
    width: 851px;
    height: 1632px;
    background-repeat: no-repeat;
    background-position: left;
    background-size: contain;
    background-image: url('../assets/img/palm_4.svg');
}

.fruits_and_palm {
    position: absolute;
    left: 0;
    top: 3200px;
    width: 100%;
    height: 2800px;
    background-repeat: no-repeat;
    background-position: right;
    background-size: cover;
    background-image: url('../assets/img/fruits_and_palm.jpg');
}

.parrot {
    object-fit: cover;
    position: absolute;
    top: 4354px;
    right: 0;
    width: 17%;
    height: 652px;
}

.navigation-item {
    margin-right: 20px;
    height: 20px;
    text-align: left;
    font: normal normal bold 15px/20px Roboto Slab;
    letter-spacing: 0;
    color: var(--navigation-text);
}

.main-button {
    box-sizing: border-box;
    padding: 8px 16px;
    text-align: center;
    font: normal normal bold 14px/20px Roboto Slab;
    letter-spacing: 0;
    height: 36px;
    color: var(--primary-button-text);
    background: var(--primary) 0 0% no-repeat padding-box;
    box-shadow: 0 3px 6px #FF45094D;
    border-radius: 4px;
    opacity: 1;
}

.secondary-button {
    box-sizing: border-box;
    padding: 8px 16px;
    text-align: center;
    font: normal normal bold 14px/20px Roboto Slab;
    letter-spacing: 0;
    height: 36px;
    color: var(--primary);
    background: var(--primary-button-text) 0 0% no-repeat padding-box;
    box-shadow: 0 3px 6px #0000000D;
    border-radius: 4px;
    opacity: 1;
}

.title-large {
    text-align: left;
    font: normal normal bold 79px/104px Roboto Slab;
    letter-spacing: 0;
    color: var(--title-text);
}

.home-2-text-container {
    margin-left: 28%;
    display: flex;
    flex-flow: column;
    justify-content: center
}

.green-parrot-logo-menu {
    width: 181px;
    height: 181px;
}

.media-body h4 {
    font-size: 2.6rem;
    margin-bottom: 1.4rem;
}

.media-body h5 {
    font-size: 1.6rem;
    margin-top: 0rem;
}

@media (max-width: 1366px) {
    .content-container {
        position: relative;
        height: 5700px;
    }

    .fruits_and_palm {
        position: absolute;
        left: 0;
        top: 3200px;
        width: 100%;
        height: 2500px;
        background-repeat: no-repeat;
        background-position: right;
        background-size: cover;
        background-image: url('../assets/img/fruits_and_palm.jpg');
    }
}

@media (max-width: 1245px) {
    .responsive-invisible {
        display: none;
    }

    .responsive-visible {
        display: block;
    }

    .mobile-menu-icon {
        display: block;
    }

    .navigation-container {
        display: none;
    }

    .navigation-items-container {
        display: flex;
        align-items: center;
    }

    .mobile-menu-container {
        overflow: auto;
        height: 100%;
        width: 100%;
        background-color: white;
        display: flex;
        flex-flow: column;
        position: fixed;
        z-index: 21;
        justify-content: center;
        align-items: center;
    }

    .mobile-menu-container-inner {
        height: 100%;
        display: flex;
        flex-flow: column;
        align-items: center;
    }

    .mobile-menu-container a {
        height: 30px;
        margin-bottom: 20px;
    }

    .mobile-menu-container ul {
        list-style-type: none;
    }

    .navigation-option-container {
        margin-right: 0px;
        margin-top: 20px;
        height: 80px;
    }

    .navigation-option {
        font: normal normal 500 24px/15px Montserrat;
        letter-spacing: 0;
        color: var(--primary);
    }

    .navigation-option-selected {
        font: normal normal 700 24px/15px Montserrat;
    }
}

@media (max-width: 986px) {

    .content-container {
        position: relative;
        height: 4350px;
    }

    .background {
        display: none;
    }

    .main-menu-container {
        display: none;
    }

    .content {
        right: unset;
        left: unset;
        position: absolute;
        width: 100%;
    }

    .green-parrot-logo {
        width: 241px;
        height: 251px;
        left: 0;
        right: 0;
        margin: auto;
        top: -10px;
    }

    .title-large {
        font: normal normal bold 45px/70px Roboto Slab;
    }
}