.row {
padding-right: 0px;
margin-right: 0px;
}

.top-row{
background-image: url("../img/blue-background.jpg");
background-repeat: repeat;
}

.title{
color: white;
}

.title h3{
font-size: 3.25em;
-webkit-text-stroke: 1.25px black;
margin-top: 10px;
font-family: cooper-black-std, serif;
font-weight: 400;
font-style: normal;
}

.socials{
padding-top: 23px;
}

.social-thumbnail-top{
width: 25px; 
height: 25px; 
display: inline-block;
margin-left: 5px;
}

.socials a{
text-decoration: none;
}

.socials-mobile{
display: inline-block; 
margin-top: 10px; 
margin-left: 5px;
}

.socials-mobile a{
text-decoration: none;
}

hr {
border: 0;
border-top: 3px solid black;
margin: 0;
}

.content-area{
text-align: center; 
margin-top: 15px; 
margin-bottom: 15px;
border-radius: 10px;
background-image: url("../img/blue-background.jpg");
background-repeat: repeat;
}

.category-headline{
font-size: 3.5em;
-webkit-text-stroke: 1.5px black;
color: white;
font-family: cooper-black-std, serif;
font-weight: 400;
font-style: normal;
}

.album{
border: 4px solid black;
background-color: white; 
padding: 5px; 
margin-bottom: 20px; 
display: inline-block;
}

.album-container{
border: 4px solid black;
background-color: white; 
padding: 5px; 
margin-bottom: 20px; 
display: inline-block;
}

.release-headline{
font-family: 'Timmana', sans-serif;
font-size: 1.5em;
}

.album-cover{
display: inline-block; 
max-width: 300px; 
max-height: 300px;  
padding: 5px; 
vertical-align: top;
}

.album-info h3{
font-family: 'Timmana', sans-serif;
}

.album-info p{
font-family: 'Didact Gothic', sans-serif;
}

.button-area{
display: inline-block; 
margin-top: 10px; 
width: 300px; 
padding: 5px; 
vertical-align: top;
}

.dropdown button{
font-family: 'Timmana', sans-serif;
font-size: 1.25em;
}

.custom-button{
border: 2px solid black !important;
background-color: white !important;
color: black;
}

.custom-button:hover{
background-color: white;
color: #BE0026;
transition: .4s;
border: 2px solid black;
}

.btn-default.active, .btn-default:active, .open>.dropdown-toggle.btn-default {
background-color: #BE0026;
transition: .4s;
border: 2px solid black;
}

.btn-default.active.focus, .btn-default.active:focus, .btn-default.active:hover, .btn-default:active.focus, .btn-default:active:focus, .btn-default:active:hover, .open>.dropdown-toggle.btn-default.focus, .open>.dropdown-toggle.btn-default:focus, .open>.dropdown-toggle.btn-default:hover {
background-color: white;
color: #BE0026;
transition: .4s;
border: 2px solid black;
outline:none;
}

.dropdown-menu{
max-width: 125px;
min-width: 125px;
text-align: center;
box-shadow: none;
border: 2px solid black;
background-color: white;
color: black;
font-family: 'Didact Gothic', sans-serif;
font-size: 1.25em;
}

.dropdown-menu li a:hover{
background-color: white;
color: #BE0026;
transition: .4s;
}

.video-area{
font-family: 'Timmana', sans-serif;
}

.videoWrapper {
position: relative;
padding-bottom: 56.25%; /* 16:9 */
padding-top: 25px;
height: 0;
}
.videoWrapper iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}


footer{
background-image: url("../img/blue-background.jpg");
background-repeat: repeat;
color: black;
margin-bottom: 0px;
padding: 20px 0px 10px 0px;
font-family: 'Didact Gothic', sans-serif;
}

footer a{
text-decoration: none;
color: black;
}

footer a:hover{
color: white;
}


/*MEDIA QUERY SECTION*/

/*Desktop*/

@media only screen and (min-width: 768px){

    .socials-mobile{
        display: none;
    }

    .header-mobile{
        display: none;
    }

    .navbar{
        border: none;
        border-radius: 0px;
        margin-bottom: 0px;
    }

    .navbar-default{
        background-image: url("../img/blue-background.jpg");
        background-repeat: repeat;
    }

    .navbar-default .navbar-nav>li>a {
        color: black;
        font-size: 2.25em;
        padding-left: 10px;
        padding-right: 10px;
        padding-top: 25px;
        padding-bottom: 5px;
        font-family: 'Timmana', sans-serif;
    }

    .navbar-default .navbar-nav>li>a:hover {
        color: #BE0026;
        transition: .45s;
    }

    .navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:focus, .navbar-default .navbar-nav>.active>a:hover {
        color: white;
        background-color: transparent;
    }

    .navbar-collapse.collapse {
        text-align: center; 
        display: block !important;
        height: auto !important;
        padding-bottom: 0;
        overflow: visible !important;
    }

    .navbar-nav {
        display: inline-block;
        float: none;
        margin: 0;
    }

    .album-area-mobile{
        display: none;
    }

    .dropdown button{
        padding-top: 12px;
    }

    .button-area-secondary{
        display: block;
    }

    .album-info-secondary{
        display: block;
        font-family: 'Didact Gothic', sans-serif;
    }

    .album-info-secondary p{
        margin-top: 5px;
    }

    .release-headline h2{
        font-size: 35px;
        margin-bottom: 0px;
    }

    .video-area{
        background-color: white; 
        padding: 30px; 
        margin: 0px 35px 0px 35px; 
        border: 5px solid black;
    }

    .tour-widget-area{
        background-color: #49A1D9; 
        padding: 30px; 
        margin: 0px 35px 0px 35px; 
        border: 5px solid black;
    }

    .about-area{
        background-color: white; 
        color: black;
        padding: 40px; 
        margin: 0px 35px 0px 35px; 
        border: 5px solid black;
        font-family: 'Didact Gothic', sans-serif;
    }

    .about-area p{
        font-size: 1.4em;
    }

    .about-area p a{
        text-decoration: none;
        color: black;
    }
}

/*Mobile*/

@media only screen and (max-width: 767px){

    .header-desktop{
        display: none;
    }

    hr {
        border: 0;
        border-top: 1px solid black;
        margin: 0;
    }

    .navbar-default{
        background-image: url("../img/blue-background.jpg");
        background-repeat: repeat;
        margin-bottom: 0px;
        border: none;
        font-family: 'Didact Gothic', sans-serif;
        letter-spacing: 2px;
    }

    .navbar-collapse{
        border: none;
    }

    .navbar-nav{
        text-align: center;
    }

    .navbar-nav li a{
        padding: 5px 0px 5px 0px;
    }

    .navbar-default .navbar-nav>li>a {
        color: black;
    }

    .navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:focus, .navbar-default .navbar-nav>.active>a:hover {
        color: white;
        background-color: #49A1D9;
    }

    .navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover {
        background-color: #49A1D9;
    }

    .navbar-default .navbar-toggle {
        border-color: black;
    }

    .navbar-default .navbar-toggle .icon-bar {
        background-color: black;
    }

    .title h3{
        font-size: 2em;
        -webkit-text-stroke: 1px black;
    }

    .socials{
        display: none;
    }

    .album-area-desktop{
        display: none;
    }

    .album-area-mobile{
        padding-left: 12px;
        padding-right: 12px;
    }

    .content-area{
        background-color: black;
        margin-top: 20px;
    }

    .category-headline{
        font-size: 2.5em;
        margin: 0px;
    }

    .album-container{
        border: none;
        border-radius: 10px;
    }

    .release-headline h2{
        margin-top: 10px;
    }

    .album-info h3{
        margin-top: 0px;
    }

    .album-info p{
        margin-bottom: 0px;
        font-size: 1.1em;
    }

    .button-area{
        margin-bottom: 10px;
    }

    .video-area{ 
        padding: 0px; 
        margin: 0px; 
    }

    .tour-widget-area{ 
        padding: 0px; 
        margin: 0px; 
    }

    .about-area{ 
        padding: 10px; 
        margin: 0px; 
        color: white;
        font-family: 'Didact Gothic', sans-serif;
    }

    .about-area p{
        font-size: 1.4em;
    }

    .about-area p a{
        text-decoration: none;
        color: white;
    }

    .video-area h2{
        color: white;
    }

    #dropdownMenu1{
        padding-top: 13px;
    }
}