body {
    font-family: sans-serif;
}

h1 {
    font-size: 1.4rem;
    font-weight: 500;
    text-decoration: underline;
}

a, a.link, a:hover, a:hover, a:focus, a:visited {
    
}

@media (min-width: 576px) {
    body {
        background: #f3f3f3;
    }
    
    h1 {
        text-decoration: none;
    }
}

@media (min-width: 991px) {
    .container {
        max-width: 1084px;
    }
    
    h1 {
        font-size: 1.8rem;
    }
}

.navbar {
    background-color: #262473;
}

.wrapper {
    background: #fff;
    border: 0.0625rem solid #e7e7e7;
}

.letter {
  font-size: 1.875rem;
}

.item {
    border: 1px solid #ccc;
    border-top-width: 0;
    text-decoration: none;
    transition: background 400ms;
}

.item:hover, .item:focus {
    background-color: #ececf9;
}

.item.first {
    border-top-width: 1px;
}

.item.inactive {
    background-color: #eee;
}

.item > span {
    display: block;
    color: #5A5A5A;
}

.item > span:first-child {
    font-size: 1.15rem;
    font-weight: 500;
    color: #262473;
}

.item.inactive > span,
.item.inactive > span:first-child {
    color: #aaa;
}