﻿

/* Navigation Bar Styles 
---------------------------------------- */
/*
#header {
    transition: 0.2s all ease;
    background-color: #008d96;
}
*/
/*.header-scroller {
    background-color: #008d96;
    border-bottom: 1px transparent;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.2);
}*/
/*
@media only screen and (max-device-width: 768px) {
    header {
        background: #008d96;
        border-bottom: 1px transparent;
        box-shadow: 0 4px 30px rgba(0, 0, 0, 0.2);
    }
}*/

.nav-item {
    margin: 0.5em;
}

.nav-link {
    font-weight: 100 !important;
    color: white !important;
}

        .nav-link:hover > svg {
            animation: flipper 1s normal infinite;
        }

        @keyframes flipper {
            0% {
                transform: scaleX(1);
                color: orange;
            }
            50% {
                transform: scaleX(-1);
                color: white;
            }
            100% {
                transform: scaleX(1);
                color: orange;
            }
        }

.nav-link > .nav-link-text {
    margin-left: 0.5em;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .05em;
    transition: 0.2s all;
}

@media (max-width: 991px){
    .nav-link {
        padding-top: 0.1rem !important;
        padding-bottom: 0.1rem !important;
    }
}

@media (min-width: 992px) {
    .nav-link {
        padding-left: 0.25rem !important;
        padding-right: 0.25rem !important;
    }

    .nav-link > .nav-link-text {
        font-size: 12px;
        margin-left: 0.1em;
    }
}

@media (min-width: 1200px) {
    .nav-link {
        padding-left: 0.5rem !important;
        padding-right: 0.5rem !important;
    }

    .nav-link > .nav-link-text {
        font-size: 14px;
        margin-left: 0.5em;
    }
}

.navbar-toggler {
    border: none !important;
}

.navbar-toggler-icon {
    color: red !important;
}

.dropdown-item-icon {
    width: 20px; /* Adjust width to fit the largest icon */
    text-align: center;
    display: inline-block;
}