/* General definitions ====================================== */

* { margin: 0; padding: 0; }

html, body { font-family: 'TTChocolates', Georgia, 'Segoe UI', Arial, sans-serif; font-size: 20px; color: #888888; background: #0a0a0a; }

.clearbox { clear: both; height: 1px; }
.clearleft { clear: left; height: 1px; }
.clearright { clear: right; height: 1px; }

a, img { outline: 0; }
textarea { resize: none; }

.gLnk:link, .gLnk:visited, .gLnk:active { color: #909090; text-decoration: none; font-weight: bold; }
.gLnk:hover { color: #c0c0c0; text-decoration: none; }

.gLnk2:link, .gLnk2:visited, .gLnk2:active { color: #fe1f2d; text-decoration: none; font-weight: bold; }
.gLnk2:hover { color: #c0c0c0; text-decoration: none; }

.mybtn { display: inline-block; padding: 8px 10px; background: #030303; color:#888888; border: solid 1px #202020; text-decoration: none; font-size: 16px; margin: 15px 0 10px 0; }
.mybtn:hover { background: #0c0c0c; color: #888888; text-decoration: none; }

/* General layout =========================================== */

.toparea { background: #000000; padding-bottom: 20px; }

.logo { max-width: 900px; margin: 0 auto; padding: 50px 0 30px 0; }
.logo, .logo img { width: 100%; }

.menuL { font-size: 34px; margin-left: -12px; }
.menuR { float: right; width: 346px; height: 44px; margin-top: 32px; }

.mLnk:link, .mLnk:visited, .mLnk:active { color: #888888; text-decoration: none; font-weight: normal; display: inline-block; padding: 30px 12px 30px 12px; }
.mLnk:hover { color: #c0c0c0; text-decoration: none; }
.mLnk:last-child { padding: 30px 0 30px 12px; }

.icon-fb, .icon-tw, .icon-inst, .icon-yt, .icon-sp { float: left; height: 43px; display: block; background: url("images/social.png"); margin-left: 25px; }

.icon-fb { width: 43px; background-position: 0px 0px; }
.icon-tw { width: 45px; background-position: -43px 0px; }
.icon-inst { width: 44px; background-position: -88px 0px; }
.icon-yt { width: 45px; background-position: -132px 0px; }
.icon-sp { width: 44px; background-position: -177px 0px; }

.icon-fb:hover { width: 43px; background-position: 0px 43px; }
.icon-tw:hover { width: 45px; background-position: -43px 43px; }
.icon-inst:hover { width: 44px; background-position: -88px 43px; }
.icon-yt:hover { width: 45px; background-position: -132px 43px; }
.icon-sp:hover { width: 44px; background-position: -177px 43px; }

.logo-f-gap { height: 100px; }

.logo-f1, .logo-f2, .logo-f3 { float: left; width: 33.3333%; }
.logo-f1 { text-align: left; }
.logo-f2 { text-align: center; }
.logo-f3 { text-align: right; margin-top: -7px; }
.logo-f3 span { font-weight: bold; }

.logo-f1 img { width: 60%; }
.logo-f2 img { width: 22%; }

.artbnr { max-width: 700px; margin: 40px auto 60px; background: #000000; }
.artbnr, .artbnr img { width: 100%; }

.contentarea { padding: 60px 0 90px 0; }

.fgapC { height: 80px; }
.fgapD { height: 50px; }
.fgapE { height: 30px; }
.fgapF { height: 46px; }
.fgapG { height: 22px; }
.fgapH { height: 10px; }

h2 { font-size: 34px; font-weight: lighter; margin: 0 0 10px 0; }
h3 { font-size: 30px; font-weight: normal; margin: 0 0 10px 0; color: #cccccc; }
h4 { font-size: 24px; font-weight: normal; margin: 0 0 20px 0; color: #cccccc; }

p { line-height: 1.34; padding: 20px 0 0 0; }
p.shows { line-height: 1.34; padding: 10px 0 0 0; }
p.albm-title { line-height: 1.34; padding: 0 0 0 0; color: #cccccc; }
.altclr { color: #888888; }

table.shows { border: 0; padding: 0; margin-top: 2em; width: 100%; }
table.shows td { padding: 1em; border: solid 1px #202020; }
.no-shows { border: solid 1px #1a1a1a; text-align: center; padding: 45px 15px; margin-top: 20px; }

.albm-cover img { width: 100%; border: solid 1px #000000; background: #000000; }
.albm-title { font-size: 30px; }
.dt { color: #888888; font-size: 18px; }

.videoL { float: left; width: 50%; padding-right: 10px; }
.videoR { float: right; width: 50%; padding-left: 10px; }

.video-container {
	position:relative;
	padding-bottom:56.25%;
	padding-top:30px;
    height:0;
    border: solid 1px #000000;
	overflow:hidden;
}

.video-container iframe, .video-container object, .video-container embed {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}

@media (max-width: 1200px) {

    .logo { padding: 70px 0 50px 0; }

    .mLnk:link, .mLnk:visited, .mLnk:active, .mLnk:hover { padding: 10px 10px 10px 10px; display: inline-block; text-align: center; }
    .mLnk:last-child { padding: 10px 0 10px 10px; }
    .menuL { float: none; margin-left: 0; text-align: center; font-size: 22px; }
    .menuR { float: none; margin: 30px auto; }

    .artbnr { margin: 50px auto 100px; }
    
    .videoL { float: none; width: 100%; padding: 0 0 20px 0; }
    .videoR { float: none; width: 100%; padding: 0 0 0 0; }

    .logo-f1 img { width: 66%; }
    .logo-f2 img { width: 24%; }
    .logo-f3 { font-size: 16px; }
}

@media (max-width: 768px) {

    .artbnr { margin: 40px auto 60px; }

    .fgapC { height: 30px; }
    .fgapD { height: 30px; }

    .no-shows { padding: 30px 15px; }
    .albm-title { margin-top: 20px; }

    h2 { font-size: 34px; font-weight: normal; margin: 0 0 30px 0; }
    h3 { font-size: 30px; font-weight: normal; margin: 0 0 10px 0; }

    .logo-f-gap { height: 60px; }

    .logo-f1 img { width: 80%; }
    .logo-f2 img { width: 30%; }    
}

@media (max-width: 636px) {

    html, body { font-size: 18px; }

    .logo { padding: 50px 0 20px 0; }

    .mLnk:link, .mLnk:visited, .mLnk:active, .mLnk:hover { padding: 20px 5px 20px 5px; }
    .mLnk:last-child { padding: 20px 0 20px 5px; }
    .menuL { font-size: 17px; }

    .artbnr { margin: 40px auto 60px; }

    .menuR { width: 220px; height: 32px; margin-top: 20px; }
    .icon-fb, .icon-tw, .icon-inst, .icon-yt, .icon-sp { float: left; height: 31px; display: block; background: url("images/social-small.png"); }
    .icon-fb { margin-left: 0; }
    .icon-tw, .icon-inst, .icon-yt, .icon-sp { margin-left: 15px; }
    
    .icon-fb { width: 32px; background-position: 0px 0px; }
    .icon-tw { width: 32px; background-position: -32px 0px; }
    .icon-inst { width: 32px; background-position: -64px 0px; }
    .icon-yt { width: 33px; background-position: -96px 0px; }
    .icon-sp { width: 31px; background-position: -129px 0px; }

    .icon-fb:hover { width: 32px; background-position: 0px 31px; }
    .icon-tw:hover { width: 32px; background-position: -32px 31px; }
    .icon-inst:hover { width: 32px; background-position: -64px 31px; }
    .icon-yt:hover { width: 33px; background-position: -96px 31px; }
    .icon-sp:hover { width: 31px; background-position: -129px 31px; }

    .albm-title { margin-top: 20px; font-size: 22px; }
    
    h2 { font-size: 26px; font-weight: normal; margin: 0 0 30px 0; }
    h3 { font-size: 22px; font-weight: normal; margin: 0 0 10px 0; } 
    h4 { font-size: 19px; }

    table.shows td { padding: 0.5em; font-size: 16px; }
}

@media (max-width: 440px) { .logo-f3 { font-size: 14px; } }

/* homepage horizontal hero content */

.hero-bnr { max-width: 1170px; margin: 40px auto 60px; background: #000000; }
.hero-bnr, .hero-bnr img { width: 100%; }

@media (max-width: 1200px) { .hero-bnr { margin: 50px auto 70px; } }
@media (max-width: 768px) { .hero-bnr { margin: 40px auto; } }