/*
Theme Name: MusicGrid Widget
Theme URI: http://musicgrid.me
Version: 2.0
Description: Custom theme for MusicGrid.me widgets.
Author: MusicGrid.me
Author URI: http://musicgrid.me
License: GTFO
Template: archetype
*/

/* Global */

body {
    background: black;
    font-family: "Open Sans",Calibri,Candara,Arial,sans-serif;
	font-size: 14px;
	line-height: 18px;
    color: white;
}

iframe {
    max-width: 100%;
    margin: 10px 0;
}

.post {
    margin-top: 50px;
}

.post, #comments, #pings, #no-comments, #respond {
	background: transparent;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
    margin-bottom: 0;
}

#main {
    margin-bottom: 80px;
    padding: 0;
}

.clearall {
	clear: both;
}

#wrapper {
	padding: 0;
}

.row {
    margin: 0;
}

/* Typography */

h1, h2, h3, h4 {
    font-family: "Bree Serif", "Open Sans",Calibri,Candara,Arial,sans-serif;
}

h2 {
    font-size: 16px;
    line-height: 20px;
}

.post-title {
    font-size: 22px;
    line-height: 26px;
    color: white;
    text-overflow: ellipsis;
    margin-bottom: 0;
}

h2.post-cat {
    font-size: 18px;
    line-height: 22px;
    color: whitesmoke;
    margin: 5px 0;
}

.post-header-meta {
    color: #e5e5e5;
}

img.alignleft {
    margin: 5px 5px 5px 0;
}

.thumbnail {
    border: none;
}

.btn-block {
    margin: 5px 0;
}

h2.rating, .widget h4.widget-title {
    font-family: "Open Sans",Calibri,Candara,Arial,sans-serif;
}

a, a:hover {
	color: #db0a0a;
}

a:hover {
	opacity: 0.8;
	font-weight: inherit;
	text-decoration: none;
}

li {
	line-height: inherit;
}

textarea {
    color: black;
}

/* Helpers */

.text-right {
    text-align: right;
}

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

.pad-md-sides {
    padding-top: 20px;
    padding-bottom: 20px;
}

/* Menu */

#wrapper #main .navbar {
    width: inherit;
}

.navbar .nav {
	margin: 0;
    width: 100%;
}

/* Fixed Nav */

.navbar.navbar-inverse {
    -moz-box-shadow: -2px 2px 3px 0px black;
    -webkit-box-shadow: -2px 2px 3px 0px black;
    box-shadow: -2px 2px 3px 0px black;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=93)";
    opacity: 0.93;
}

.navbar .navbar-inner .brand {
    padding: 5px;
}

.navbar .brand img {
    height: 40px;
}

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

.navbar .nav > li > a {
    font-size: 26px;
}

#albumwrap {
    margin-top: 55px;
    margin-bottom: 55px;
    padding: 0 10px;
}

.single #albumwrap {
    margin-top: 65px;
    padding: 0;
}

.navbar .gridnav > .active > a, .navbar .gridnav > .active > a:hover {
    background: #222;
    border: none;
    color: #DB0A0A;
}

.navbar .navbar-search {
    padding-right: 50px;
}

.navbar .navsearch {
    background: transparent;
    color: white;
    border: none;
    border-bottom: 1px solid white;
}

.navbar #searchsubmit {
    background: transparent;
    color: white;
    font-size: 20px;
    margin-left: 0;
}

.navbar p {
    line-height: 50px;
    margin-right: 15px;
    margin-bottom: 0;
}

.navbar .btn {
    margin-top: 0;
    margin-left: 10px;
}

.navbar .btn-group {
    margin-top: 12px;
}

.navbar .dropdown-menu {
    min-width: 0;
    text-align: center;
    font-size: 12px;
}

.navbar p img {
    margin: 0 5px 0 0;
    max-height: 50px;
}

.widget ul.gridnav li {
	float: left;
	margin-right: 5px;
}

.widget ul.gridnav > li > a, .widget ul.gridnav li a {
	background-color: #9c9c9c;
	color: white;
}

.widget ul.gridnav > li > a:hover {
	opacity: 0.9;
}

.widget ul.gridnav li.active a, .widget ul.gridnav li a:hover, .gridnav > .active > a, .gridnav > .active > a:hover {
	color: white;
	background-color: #DB0A0A;
	opacity: 1;
}

.widget ul.gridnav li a:hover {
	cursor: auto;
}

.widget ul.gridnav li.active a:hover {
	cursor: default;
}

/* Main View */

.row .col-md-6.albumgrid {
    margin: 5px 0;
}

.albumgrid h2, .albumgrid p {
    margin: 0;
}

#ie8 #albumwrap .albumgrid {
    clear: both;
}

@media (max-width: 990px) {
    .col-xs-12.albumgrid {
        clear: both;
        padding: 0;
    }
}

/* Social Login */

.social-login {
    padding: 20px;
}

.social-login .fbLoginButton {
    height: 60px;
}

.social-login .fbLoginButton img {
    max-width: 100%;
}

.social-recommendations {
    margin-bottom: 20px;
}

@media ( max-width: 991px ) {
    .social-recommendations .col-md-3:nth-child(odd) {
        clear: both;
    }
}

@media ( min-width: 992px ) {
    .social-recommendations .col-md-3:nth-child(4n+5) {
        clear: both;
    }
}

/* Grid Fadein */

#main[data-liffect="fadeIn"] .albumgrid {
    opacity: 0;
    position: relative;
    -webkit-animation: fadeIn 1000ms ease both;
    -webkit-animation-play-state: paused;
    -moz-animation: fadeIn 1000ms ease both;
    -moz-animation-play-state: paused;
    -o-animation: fadeIn 1000ms ease both;
    -o-animation-play-state: paused;
    animation: fadeIn 1000ms ease both;
    animation-play-state: paused;
}

#main[data-liffect="fadeIn"].play .albumgrid {
    -webkit-animation-play-state: running;
    -moz-animation-play-state: running;
    -o-animation-play-state: running;
    animation-play-state: running;
}

.single #main[data-liffect="fadeIn"] #albumwrap {
    opacity: 0;
    position: relative;
    -webkit-animation: fadeIn 1000ms ease both;
    -webkit-animation-play-state: paused;
    -moz-animation: fadeIn 1000ms ease both;
    -moz-animation-play-state: paused;
    -o-animation: fadeIn 1000ms ease both;
    -o-animation-play-state: paused;
    animation: fadeIn 1000ms ease both;
    animation-play-state: paused;
}

.single #main[data-liffect="fadeIn"].play #albumwrap {
    -webkit-animation-play-state: running;
    -moz-animation-play-state: running;
    -o-animation-play-state: running;
    animation-play-state: running;
}

@-webkit-keyframes fadeIn {
    0% { opacity: 0; }
    100% { opacity: 1; }
}

@-moz-keyframes fadeIn {
    0% { opacity: 0; }
    100% { opacity: 1; }
}

@-o-keyframes fadeIn {
    0% { opacity: 0; }
    100% { opacity: 1; }
}

@keyframes fadeIn {
    0% { opacity: 0; }
    100% { opacity: 1; }
}

#ie8 #main[data-liffect="fadeIn"] .albumgrid, #ie9 #main[data-liffect="fadeIn"] .albumgrid, #ie8 .single #main[data-liffect="fadeIn"] #albumwrap, #ie9 .single #main[data-liffect="fadeIn"] #albumwrap {
    opacity: 1;
}

/* =WordPress Core
-------------------------------------------------------------- */
.alignnone {
    margin: 5px 20px 20px 0;
}

.aligncenter,
div.aligncenter {
    display: block;
    margin: 5px auto 5px auto;
}

.alignright {
    float:right;
    margin: 5px 0 5px 5px;
}

.alignleft {
    float: left;
    margin: 5px 5px 5px 0;
}

.aligncenter {
    display: block;
    margin: 5px auto 5px auto;
}

a img.alignright {
    float: right;
    margin: 5px 0 5px 5px;
}

a img.alignnone {
    margin: 5px 5px 5px 0;
}

a img.alignleft {
    float: left;
    margin: 5px 5px 5px 0;
}

a img.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto
}

.wp-caption {
    background: #fff;
    border: 1px solid #f0f0f0;
    max-width: 96%; /* Image does not overflow the content area */
    padding: 5px 3px 10px;
    text-align: center;
}

.wp-caption.alignnone {
    margin: 5px 20px 20px 0;
}

.wp-caption.alignleft {
    margin: 5px 20px 20px 0;
}

.wp-caption.alignright {
    margin: 5px 0 20px 20px;
}

.wp-caption img {
    border: 0 none;
    height: auto;
    margin: 0;
    max-width: 98.5%;
    padding: 0;
    width: auto;
}

.wp-caption p.wp-caption-text {
    font-size: 11px;
    line-height: 17px;
    margin: 0;
    padding: 0 4px 5px;
}