html{

color: #000000 ;
background-color: #F4F4F4;

}

.brand-title {

font-family: 'stefont';

}

@media screen and (min-width: 30em) {

.brand-title {
    font-size: 4rem;
}

}

@media screen and (max-width: 30em) {

.brand-title {
    font-size: 2.3rem;
}

}

.montserrat {

font-family: 'Montserrat', sans-serif;

}

.chivo {

font-family: 'Chivo', sans-serif;

}

.playfair {

font-family: 'Playfair Display', serif;
font-style: italic;

}

.sketch {

font-family: 'sketch';

}

.wrap-about p {

letter-spacing: 1px;

}

.wrap-excerpt p {

font-weight: 100;
color: rgba($color: #000000, $alpha: 0.7);

}

table {

border-collapse: collapse;
border-spacing: 0;
border-style: solid;
border-width: 1px;
border-color: rgba(0,0,0,.1);
border-radius: .25rem;
font-family: 'Baskerville', sans-serif;

}

thead tr {

background-color: #eee;

}

tbody tr {

text-align: center;

}

a {

font-size: 1.25rem;
opacity: 1;
transition: opacity .15s ease-in;
color: #000;
text-decoration: none;
font-weight: 600;

}

a:hover, a:focus {

opacity: .5;
transition: opacity .15s ease-in;

}

a:active {

opacity: .8;
transition: opacity .15s ease-out;

}

.pagination {

text-align: center;

a, span {
    padding: 7px 18px;
    margin-left: -2px;
    margin-right: -2px;
    display: inline-block;
}

a {
    &:hover {
        color: #333;
    }
}

}