﻿body {
    margin: 0px;
}

.environment-label {
    color: white;
    position: absolute;
    top: 6rem;
    right: 1rem;
}
.skip-link {
    background-color: white;
    color: #1e3a62;
    padding: 5px;
    position: absolute;
    top: 0;
    left: -1000px;
}
.skip-link:focus{
    left: 0;
}

@media (min-width: 576px) {
    .environment-label {
        color: white;
        position: absolute;
        top: 4.5rem;
        right: 1rem;
    }
}
@media (max-width: 575.98px) {
    .environment-label {
        color: white;
        position: absolute;
        top: 7.2rem;
        right: 1rem;
        font-size: x-large;
    }
}

#header-region {
    background: linear-gradient(to bottom, #3a5170 0%, #3a5170 24%, #1e3a62 100%);
    min-height: 130px;
    width: 100%;
}

.navbar-dese-custom {
    padding: 0px;
    min-height: 42px;
    background-color: #b2def5;
    background: url("diag_pat_trans.png"), -webkit-linear-gradient(top, #b2def5 0%, #477d9a 4%, #4d88a8 100%);
    background: url("diag_pat_trans.png"), -o-linear-gradient(top, #b2def5 0%, #477d9a 4%, #4d88a8 100%);
    background: url("diag_pat_trans.png"), -ms-linear-gradient(top, #b2def5 0%, #477d9a 4%, #4d88a8 100%);
    background: url("diag_pat_trans.png"), -moz-linear-gradient(top, #b2def5 0%, #477d9a 4%, #4d88a8 100%);
    background: url("diag_pat_trans.png"), linear-gradient(top, #b2def5 0%, #477d9a 4%, #4d88a8 100%);
}

span.dese-navbar-toggler-icon.navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(255, 255, 255, 1)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

.navbar-dese-custom li {
    margin-top: -4px;
    margin-bottom: -4px;
}

    .navbar-dese-custom li > a {
        color: white;
    }

    .navbar-dese-custom li:hover {
        background-color: rgba(74, 121, 147, .5);
    }

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {
    #header-region {
        background: linear-gradient(to bottom, #3a5170 0%, #3a5170 24%, #1e3a62 100%);
        min-height: 130px;
        width: 100%;
    }
}

/* Medium devices (tablets, 768px and up) The navbar toggle appears at this breakpoint */
@media (min-width: 768px) {
    #header-region {
        background: linear-gradient(to bottom, #3a5170 0%, #3a5170 24%, #1e3a62 100%);
        min-height: 130px;
        width: 100%;
    }
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
    #header-region {
        background: linear-gradient(to bottom, #3a5170 0%, #3a5170 24%, #1e3a62 100%);
        min-height: 130px;
        width: 100%;
    }


    .navbar-dese-custom li {
        margin-top: -6px;
        margin-bottom: -6px;
    }
}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
    #header-region {
        background: linear-gradient(to bottom, #3a5170 0%, #3a5170 24%, #1e3a62 100%);
        min-height: 130px;
        width: 100%;
    }


    .navbar-dese-custom li {
        margin-top: -7px;
        margin-bottom: -7px;
    }
}

@media print {
    header {
        display: none
    }
}
