body {
    font-family: "Roboto", "Helvetica Neue", Helvetica, sans-serif;
}

h1.title,
h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: "Roboto", "Helvetica Neue", Helvetica, sans-serif;
}

h2,
.h2 {
    line-height: 32px;
}

h3,
.h3 {
    line-height: 32px;
}

a:hover {
    color: #C00;
}

p,
blockquote,
hr,
pre,
ol,
ul,
dl,
table,
fieldset,
figure,
address,
form {
    margin-bottom: 24px;
}

.primary-nav .active > a,
.primary-nav ul li a:hover {
    border-bottom: 4px solid #c00;
}

.nav .active > a,
.nav ul li a:hover {
    color: #c00;
}


.intro {
    background-color: #C00;
    height: 240px;
}

.intro-text span {
    font-size: 40px;
    line-height: 48px;

}

.intro-text {
    line-height: 24px;
    font-size: 23px;
}

.card {
    padding: 24px;
}

.card .actions {
    margin-top: -1px;
    padding: 18px 0;
}

.card .actions a {
    text-decoration: none;
    background: #C00;
    padding: 0.25rem 0.5rem;
    color: #FFF;
    border-radius: 3px;
    border: 2px solid #C00;
    font-weight: bold;
}

.card .actions a:hover {
    background: #FFF;
    color: #C00;
}

article header {
    margin-bottom: 24px;
}

article header h1 {
    line-height: 48px;
}

audio {
	width:100%;
}

@media (min-width: 768px) {
    .body-nav-fix {
        padding-top: 72px;
    }

    .nav-header {
        height: 72px;
    }

    .content {
        padding: 0;
    }

    .intro-text {
        font-size: 27px;
    }
}