﻿.headerTop {
    background-color: rgba(255,255,255,0.85);
    height: 100px;
    position: absolute;
    z-index: 32;
    width:100%;
}
a.header :hover{
    color:#f7b830 !important;
}
.siteLogo {
    position: absolute;
    width: 130px;
    top: 50%;
    transform: translateY(-50%);
}

.topNav {
    background-color: var(--color-green);
    border-bottom: 8px solid var(--color-lightGreen);
}

    .topNav ul {
        height: 35px;
        margin-left: 9rem;
    }

        .topNav ul li i {
            color: var(--color-yellow);
        }

        .topNav ul li a span {
            color: #fff !important;
            text-transform: uppercase;
        }

        .topNav ul li:last-child {
            padding-right: 0;
        }


@media (min-width: 370px) {
    .headerTop {
        height: 113px;
    }
        .topNav ul {
        height: 42px;
    }
    .topNav ul {
        margin-left: 11rem;
    }
}

@media (min-width: 420px) {
  
    .siteLogo {
        width: 150px;
    }
}
/*/*Small devices (landscape phones, 576px and up)*/
@media (min-width: 576px) {
    .topNav ul {
        height: 42px;
    }

        .topNav ul li i {
            font-size: 1.3rem;
        }
    .topNav ul {
        margin-left: 16rem;
    }
}

/* Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) {
   
}

/*Large devices (desktops, 992px and up)*/
@media (min-width: 992px) {
    .topNav ul {
        margin-left: 28rem;
    }
}

/*X-Large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) {
    .headerTop {
        height: 120px;
    }

    .topNav ul {
        height: 43px;
        margin-left: 13.1rem;
    }

        .topNav ul li a,
        .topNav ul li i {
            font-size: 14px;
        }

        .topNav ul li i {
            padding-right: 13px;
        }
}

/* XX-Large devices (larger desktops, 1400px and up)*/
@media (min-width: 1400px) {
    .headerTop {
        height: 130px;
    }
    .topNav ul {
        margin-left: 16.1rem;
    }

        .topNav ul li a,
        .topNav ul li a i {
            font-size: 16px;
        }

            .topNav ul li a i {
                padding-right: 15px;
            }
}

@media (min-width: 1550px) {
    .headerTop {
        height: 144px;
    }
    .topNav ul {
        margin-left: 21.1rem;
    }
    .siteLogo {
        width: 175px;
    }

}
