@font-face { font-family: 'Open Sans', sans-serif; font-weight: normal; font-style: normal; } body { margin: 0px; padding: 0px; font: 16px 'Open Sans', sans-serif; background: #6c303c url(../images/bg.png); color: white; text-align:center; } a { color: white; text-decoration: none; opacity:0.7; -webkit-transition: 0.2s ease-in-out; -moz-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out; } a:hover{ opacity:1; } .norm a { opacity:1 !important; } ul{ margin:0px; padding:0px; } #main{ margin:45px; background:black url(../images/background.jpg) 100% top repeat-y; border:5px black solid; padding:50px; overflow:hidden; } #content{ max-width:940px; margin:auto; } #content p{ text-align: left; } h1, h2, h3{ margin:0px; padding:0px; } h1 img{ width:100%; height:auto; } h2{ font-family: 'Passion One', cursive; text-transform:uppercase; font-weight:normal; font-size:3em; letter-spacing:1px; margin:30px 0px; clear:both; } h3{ text-transform:uppercase; font-weight:bold; font-size:1.2em; letter-spacing:1px; margin-bottom:30px; } h5{ text-transform:uppercase; font-weight:bold; font-size:1.6em; letter-spacing:1px; } #nav { margin: 0px; padding: 0px; list-style: none; letter-spacing: 1px; height:20px; } #nav li{ text-transform: uppercase; font-size: 1.2em; font-weight: bold; display: inline; padding: 0 5px; } #nav li.selected a{ display: inline-block; } .preorder a{ text-align:center; font-weight: bold; font-size: 1.5em; border: 1px solid #fff; width: 200px; padding: 5px; background: #000; } hr { color: #6c303c; margin: 50px} #tourdates{ margin:30px 0px; } #tourdates ul{ list-style:none; } #tourdates h3{ margin-top:30px; } #music p{ text-align: center; } #music h3{ text-align: center; margin: 3px 0; } #music h4{ text-transform:uppercase; font-weight:bold; font-size:1.1em; letter-spacing:1px; } .musicImg a { opacity:1; } .single_center{ width:47%; margin: 0 auto; padding: 10px; } .single_left{ width:47%; float:left; margin:10px 0px 30px; position:relative; padding: 10px; } .single_left iframe{ width:100%; height:300px; } .single_right{ width:47%; float:right; margin:10px 0px 30px; position:relative; padding: 10px; } .single_right iframe{ width:100%; height:300px; } .single_overlay{ position:absolute; width:100%; height:100%; background:black; top:0px; left:0px; overflow:hidden; } .single_overlay img{ width:100%; height:auto; position:absolute; top:0px; left:0px; } .merch { margin: 5px 0 30px; text-align: center; border: 1px groove #999; padding: 20px; background: rgb(54, 25, 25); /* Fall-back for browsers that don't support rgba */ background: rgba(54, 25, 25, .5); } .merch p { text-align: center !important; } .merch form { text-align: center !important; } .merch table { text-align: center !important; margin: 15px auto; } .merchFloat { margin-bottom: 20px; padding: 10px; border: 1px groove #999; background: rgb(54, 25, 25); /* Fall-back for browsers that don't support rgba */ background: rgba(54, 25, 25, .5); } .merchLeft { float: left; width: 50%; } .merchRight{ float: right; width: 45%; padding: 20px; } .merchTable { text-align: center!important; width: 100%; margin-bottom: 5px; } .WebCredit { width: 200px; margin: 10px auto; text-align: center; font-size: .8em; } .clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; } .clearfix { display: inline-block; } /* start commented backslash hack \*/ * html .clearfix { height: 1%; } .clearfix { display: block; } /* close commented backslash hack */ @media screen and (max-width: 860px) { #main{ margin:20px; background:black; border:10px white solid; padding:35px; } img{ width:100%; } #disc{ width:100%; height:auto; } h3{ font-size:16px; letter-spacing:1px; margin-top:0px; margin-bottom:30px; } #nav { height:auto; } #single_left iframe{ height:200px; } #single_right iframe{ height:200px; } #single_center{ width: 95%; border:white 5px solid; } #single_left{ width: 95%; border:white 5px solid; } #single_right{ width: 95%; border:white 5px solid; } .WebCredit img { width: 20%;} .preorder a { display: block; margin: 10px auto; } } @media screen and (max-width: 700px) { .merchLeft { float: none; width: 100%; } .merchRight{ float: none; width: 80%; padding: 20px; } .merchTable { text-align: center!important; width: 100%; margin-bottom: 5px; } .preorder a { display: block; margin: 10px auto; } } @media screen and (max-width: 500px) { #single_center{ width:80%; float:none; margin:10px 0px; } #single_left{ width:80%; float:none; margin:10px 0px; } #single_right{ width:80%; float:none; margin:10px 0px; } .WebCredit img { width: 20%; } h2 { font-size: 2.3em; } .merchLeft { float: none; width: 100%; } .merchRight{ float: none; width: 80%; padding: 20px; } .merchTable { text-align: center!important; width: 100%; margin-bottom: 5px; } .preorder a { display: block; margin: 10px auto; } }