/**
 * Dropnav
 */
 .dropnav {
     position: relative;
 }

 .dropnav-toggle {
     color: #ffffff;
     text-decoration: none;
 }

 .dropnav-content {
     background-color: #ffffff;
     border-radius: 5px;
     box-shadow: 0 2px 8px #3c3c3c;
     display: none;
     width: 200px;
     padding: 15px;
     margin-top: 15px;
 }

 @media only screen and (min-width: 769px) {
     .dropnav-content {
         position: absolute;
         top: 60px;
         left: 0;
         margin-top: 0;
     }
 }

/**
 * Language selector
 */
 .language-selector .dropnav-toggle {
     position: relative;
 }

 .language-selector .dropnav-toggle:after {
     content: '';
     background-image: url('../images/caret-down.svg');
     background-repeat: no-repeat;
     background-position: center center;
     width: 16px;
     height: 16px;
     position: absolute;
     top: 0;
     right: -20px;
     filter: invert(1);
 }

 .language-selector-flag {
    width: 15px;
    margin-right: 5px;
    vertical-align: text-top;
 }

 .language-selector-list {
     list-style: none;
     margin: 0;
     padding: 0;
 }

 .language-selector-list > li:not(:last-child) .language-selector-link {
     margin-bottom: 15px;
 }

 .language-selector-link {
     color: #000000;
     display: block;
     text-decoration: none;
 }

 .language-selector-image {
     width: 35px;
     margin-right: 5px;
 }

/**
 * Links
 */
.links {
    background-color: #e1e1e1;
    box-shadow: 0 0 15px #dadada;
    display: grid;
    grid-template-columns: 1fr;
    grid-gap: 2px;
}

.links-item {
    background-color: #ffffff;
    color: #676767;
    display: block;
    text-align: center;
    text-decoration: none;
    padding: 1.5rem 1rem;
    line-height: 1;
}

.links-item:hover {
    background-color: #3f3f3f;
    color: #ffffff;
}

.links-item-title {
    font-size: 16px;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0 0 5px;
}

.links-item-bonus {
    color: #ec7219;
    font-weight: 600;
    margin-top: 5px;
}

@media only screen and (min-width: 769px) {
    .links {
        grid-template-columns: repeat(2, 1fr);
    }

    .links-item-full {
        grid-column: span 2;
    }

    .links-item-title {
        font-size: 25px;
    }
}