html { -webkit-text-size-adjust: none; }

body {
  font: 10pt Arial, sans-serif;
  text-align: left;
  background-image: url('/images/bg.jpg');
  background-repeat: no-repeat;
  xbackground-attachment: fixed;
  background-position: center top;
}

td {
  vertical-align: top;
}

#heading {
  margin: 10px auto 10px auto;
  padding: 10px 0 10px 0;
  max-width: 550px;
  background-color: white;
  font: 32pt Arial, sans-serif;
  text-align: center;
  border: solid 5px red;
  border-radius: 15px;
  box-shadow: 5px 5px 10px #888888;
}
#heading-sub {
  font: 20pt Arial, sans-serif;
}
#heading-sub-sub {
  font: 11pt Arial, sans-serif;
}
#heading-sub2 {
  font: 20pt Arial, sans-serif;
}
#heading-sub-sub2 {
  font: 11pt Arial, sans-serif;
}
#heading-back {
  font: italic bold 16pt Arial, sans-serif;
  color: red;
}
#heading-est {
  font: 8pt Arial, sans-serif;
}

#info {
  margin: 10px auto 10px auto;
  padding: 15px 10px 15px 20px;
  max-width: 700px;
  background-color: white;
  font: 11pt Arial, sans-serif;
  border: solid 5px red;
  border-radius: 15px;
  box-shadow: 5px 5px 10px #888888;
  vertical-align: top;
  text-align: left;
}

#info2 {
  margin: 10px auto 10px auto;
  padding: 15px 10px 15px 20px;
  max-width: 450px;
  background-color: white;
  font: 11pt Arial, sans-serif;
  border: solid 5px red;
  border-radius: 15px;
  box-shadow: 5px 5px 10px #888888;
  vertical-align: top;
  text-align: center;
}

#countdown {
}

#mobticket {
  display: none;
}

#midbit {
  margin: 10px auto 10px auto;
  vertical-align: middle;
  text-align: center;
}

#bands {
  display: inline-block;
  margin: 10px 20px 10px 20px;
  padding: 15px 10px 15px 20px;
  max-width: 400px;
  background-color: white;
  font: 11pt Arial, sans-serif;
  border: solid 5px red;
  border-radius: 15px;
  box-shadow: 5px 5px 10px #888888;
  vertical-align: top;
  text-align: left;
}

#beers {
  display: inline-block;
  margin: 10px 20px 10px 20px;
  padding: 15px 10px 15px 20px;
  max-width: 400px;
  background-color: white;
  font: 11pt Arial, sans-serif;
  border: solid 5px red;
  border-radius: 15px;
  box-shadow: 5px 5px 10px #888888;
  vertical-align: top;
  text-align: left;
}

#copy {
  margin: 10px auto 10px auto;
  padding: 20px 0px 35px 0px;
  max-width: 400px;
  text-align: center;
  font: 8pt Arial, sans-serif;
}

#bandimages {
  vertical-align: middle;
  text-align: center;
}

#bandimage1 {
  max-width: 366px;
  vertical-align: middle;
  text-align: center;
  display: inline-block;
  margin: 10px 20px 10px 20px;
}
#bandimage1 img {
  border: 5px solid white;
  border-radius: 15px;
  position: relative;
  box-shadow: 5px 5px 10px #888888;
}

#bandimage2 {
  max-width: 366px;
  vertical-align: middle;
  display: inline-block;
  text-align: center;
  margin: 10px 20px 10px 20px;
}
#bandimage2 img {
  border: 5px solid black;
  border-radius: 15px;
  position: relative;
  box-shadow: 5px 5px 10px #888888;
}

#bandnoimage {
  margin: 55px auto;
  padding: 15px 10px 15px 10px;
  font: italic bold 20pt Arial, sans-serif;
  color: #eeeeee;
}

#bandtba {
  font: italic bold 20pt Arial, sans-serif;
  padding-top: 50px;
  color: gray;
}

#ticket {
  border: 5px solid white;
  border-radius: 15px;
  position: relative;
  box-shadow: 5px 5px 10px #888888;
  padding: 15px 10px 15px 10px;
  background-color: black;
  vertical-align: middle;
  text-align: center;
  width: 180px;
  height: 173px;
}
#ticketlink {
  margin: 55px auto;
  padding: 15px 10px 15px 10px;
  font: italic bold 20pt Arial, sans-serif;
}
#ticketlink a:link { color: #ffffff; text-decoration: none; }
#ticketlink a:visited { color: #ffffff; text-decoration: none; }
#ticketlink a:hover { color: #ccccff; text-decoration: none; }
#ticketlink a:active { color: #ccccff; text-decoration: none; }

#ticketblob {
  vertical-align: middle;
  text-align: center;
}

#tickets {
  max-width: 600px;
  display: inline-block;
  margin: 10px auto 10px auto;
  padding: 15px 10px 15px 20px;
  background-color: black;
  font: 11pt Arial, sans-serif;
  border: solid 5px white;
  border-radius: 15px;
  box-shadow: 5px 5px 10px #888888;
  vertical-align: top;
  text-align: left;
}

#drslogo {
  left: 0px;
  top: 0px;
}
#sslogo {
  left: 0px;
  top: 0px;
}
#evologo {
  left: 0px;
  top: 0px;
}
#pfjlogo {
  left: 0px;
  top: 0px;
}
#dbaglogo {
  left: 0px;
  top: 0px;
}
#asplogo {
  left: 0px;
  top: 0px;
}
#heplogo {
  left: 0px;
  top: 0px;
}
#cnclogo {
  left: 0px;
  top: 0px;
}
#brlpic {
  left: 0px;
  top: 0px;
}
#barpic {
  left: 0px;
  top: 0px;
}
#drspic {
  left: 0px;
  top: 0px;
  Xmargin: 50px 89px 0px 89px;
}

#sponsors {
  margin: 10px auto 10px auto;
  vertical-align: middle;
  text-align: center;
}

#mullie {
  background: url("/images/Mullie.jpg") no-repeat 0px 0px rgb(165, 52, 54);
  margin: 10px 10px 10px 10px;
  padding: 0px 0px 0px 0px;
  display: inline-block;
  width: 230px;
  height: 105px;
  border: 5px solid white;
  border-radius: 15px;
  position: relative;
  box-shadow: 5px 5px 10px #888888;
}
#mullie a {
  display: block;
  width: 230px;
  height: 105px;
}
#mullie span {
  display: block;
  width: 0px;
  height: 0px;
  text-indent: -9999px;
}

#davistate {
  background: url("/images/DavisTate.png") no-repeat 20px 30px rgb(153, 51, 153);
  margin: 10px 10px 10px 10px;
  padding: 0px 0px 0px 0px;
  display: inline-block;
  width: 230px;
  height: 105px;
  border: 5px solid white;
  border-radius: 15px;
  position: relative;
  box-shadow: 5px 5px 10px #888888;
}
#davistate a {
  display: block;
  width: 230px;
  height: 105px;
}
#davistate span {
  display: block;
  width: 0px;
  height: 0px;
  text-indent: -9999px;
}

#jts {
  background: url("/images/JTS.png") no-repeat 0px 8px rgb(27, 84, 154);
  margin: 10px 10px 10px 10px;
  padding: 0px 0px 0px 0px;
  display: inline-block;
  width: 230px;
  height: 105px;
  border: 5px solid white;
  border-radius: 15px;
  position: relative;
  box-shadow: 5px 5px 10px #888888;
}
#jts a {
  display: block;
  width: 230px;
  height: 105px;
}
#jts span {
  display: block;
  width: 0px;
  height: 0px;
  text-indent: -9999px;
}

#rgb {
  background: url("/images/rgb.jpg") no-repeat 30px 13px rgb(255, 255, 255);
  margin: 10px 10px 10px 10px;
  padding: 0px 0px 0px 0px;
  display: inline-block;
  width: 230px;
  height: 105px;
  border: 5px solid red;
  border-radius: 15px;
  position: relative;
  box-shadow: 5px 5px 10px #888888;
}
#rgb a {
  display: block;
  width: 230px;
  height: 105px;
}
#rgb span {
  display: block;
  width: 0px;
  height: 0px;
  text-indent: -9999px;
}

#autotech {
  background: url("/images/AutoTechnic.png") no-repeat 1px 22px rgb(255, 255, 255);
  margin: 10px 10px 10px 10px;
  padding: 0px 0px 0px 0px;
  display: inline-block;
  width: 230px;
  height: 105px;
  border: 5px solid red;
  border-radius: 15px;
  position: relative;
  box-shadow: 5px 5px 10px #888888;
}
#autotech a {
  display: block;
  width: 230px;
  height: 105px;
}
#autotech span {
  display: block;
  width: 0px;
  height: 0px;
  text-indent: -9999px;
}

#vernon {
  background: url("/images/Vernon.png") no-repeat 25px 5px rgb(255, 255, 255);
  margin: 10px 10px 10px 10px;
  padding: 0px 0px 0px 0px;
  display: inline-block;
  width: 230px;
  height: 105px;
  border: 5px solid red;
  border-radius: 15px;
  position: relative;
  box-shadow: 5px 5px 10px #888888;
}
#vernon a {
  display: block;
  width: 230px;
  height: 105px;
}
#vernon span {
  display: block;
  width: 0px;
  height: 0px;
  text-indent: -9999px;
}

#a1loo {
  background: url("/images/A1loohire.png") no-repeat 0px 15px rgb(146, 148, 151);
  margin: 10px 10px 10px 10px;
  padding: 0px 0px 0px 0px;
  display: inline-block;
  width: 230px;
  height: 105px;
  border: 5px solid white;
  border-radius: 15px;
  position: relative;
  box-shadow: 5px 5px 10px #888888;
}
#a1loo a {
  display: block;
  width: 230px;
  height: 105px;
}
#a1loo span {
  display: block;
  width: 0px;
  height: 0px;
  text-indent: -9999px;
}

#a1 {
  background: url("/images/A1.png") no-repeat 55px 10px rgb(255, 255, 255);
  margin: 10px 10px 10px 10px;
  padding: 0px 0px 0px 0px;
  display: inline-block;
  width: 230px;
  height: 105px;
  border: 5px solid red;
  border-radius: 15px;
  position: relative;
  box-shadow: 5px 5px 10px #888888;
}
#a1 a {
  display: block;
  width: 230px;
  height: 105px;
}
#a1 span {
  display: block;
  width: 0px;
  height: 0px;
  text-indent: -9999px;
}

#fabulous {
  background: url("/images/fabulous.png") no-repeat 25px 25px rgb(255, 255, 255);
  margin: 10px 10px 10px 10px;
  padding: 0px 0px 0px 0px;
  display: inline-block;
  width: 230px;
  height: 105px;
  border: 5px solid red;
  border-radius: 15px;
  position: relative;
  box-shadow: 5px 5px 10px #888888;
}
#fabulous a {
  display: block;
  width: 230px;
  height: 105px;
}
#fabulous span {
  display: block;
  width: 0px;
  height: 0px;
  text-indent: -9999px;
}

#countymarquees {
  background: url("/images/CountyMarquees.png") no-repeat 25px 13px rgb(255, 255, 255);
  margin: 10px 10px 10px 10px;
  padding: 0px 0px 0px 0px;
  display: inline-block;
  width: 230px;
  height: 105px;
  border: 5px solid red;
  border-radius: 15px;
  position: relative;
  box-shadow: 5px 5px 10px #888888;
}
#countymarquees a {
  display: block;
  width: 230px;
  height: 105px;
}
#countymarquees span {
  display: block;
  width: 0px;
  height: 0px;
  text-indent: -9999px;
}

#onlochire {
  background: url("/images/OnLocationHire.png") no-repeat 45px 10px rgb(0, 0, 0);
  margin: 10px 10px 10px 10px;
  padding: 0px 0px 0px 0px;
  display: inline-block;
  width: 230px;
  height: 105px;
  border: 5px solid white;
  border-radius: 15px;
  position: relative;
  box-shadow: 5px 5px 10px #888888;
}
#onlochire a {
  display: block;
  width: 230px;
  height: 105px;
}
#onlochire span {
  display: block;
  width: 0px;
  height: 0px;
  text-indent: -9999px;
}

#vintagehogroast {
  background: url("/images/VintageHogRoast.png") no-repeat 20px 10px rgb(39, 37, 37);
  margin: 10px 10px 10px 10px;
  padding: 0px 0px 0px 0px;
  display: inline-block;
  width: 230px;
  height: 105px;
  border: 5px solid white;
  border-radius: 15px;
  position: relative;
  box-shadow: 5px 5px 10px #888888;
}
#vintagehogroast a {
  display: block;
  width: 230px;
  height: 105px;
}
#vintagehogroast span {
  display: block;
  width: 0px;
  height: 0px;
  text-indent: -9999px;
}

#lastfew
{
  margin: 0px auto 0px auto;
  padding: 10px 0 10px 0;
  max-width: 550px;
  background-color: white;
  text-align: center;
  border: solid 5px red;
  border-radius: 15px;
  box-shadow: 5px 5px 10px #888888;
  position: relative;
}
#lastfewtext
{
  color: red;
  font: bold italic 12pt Arial, sans-serif;
  animation: lastf 5s;
  -webkit-animation: lastf 5s 5;
}
#lasttickets a:link { color: #ffffff; text-decoration: none; }
#lasttickets a:visited { color: #ffffff; text-decoration: none; }
#lasttickets a:hover { color: #ccccff; text-decoration: none; }
#lasttickets a:active { color: #ccccff; text-decoration: none; }

#none
{
  color: black;
  font: italic 10pt Arial, sans-serif;
}

@keyframes lastf
{
}
@-webkit-keyframes lastf
{
0%   { opacity: 1.0; }
10%  { opacity: 0.2; }
20%  { opacity: 1.0; }
30%  { opacity: 0.2; }
40%  { opacity: 1.0; }
50%  { opacity: 0.2; }
60%  { opacity: 1.0; }
70%  { opacity: 0.2; }
80%  { opacity: 1.0; }
90%  { opacity: 0.2; }
100% { opacity: 1.0; }
x20%  { top: 0px; left: 0px; }
x40%  { top: 0px; left: 0px; }
x60%  { top: 0px; left: 0px; }
x80%  { top: 0px; left: 0px; }
}

@media screen and (max-width: 600px) {
  #mainblock {
    max-width: 600px;
  }
  #heading {
    max-width: 450px;
    font: 24pt Arial, sans-serif;
  }
  #heading-sub {
    font: 16pt Arial, sans-serif;
  }
  #heading-sub-sub {
    font: 10pt Arial, sans-serif;
  }
  #heading-sub2 {
    font: 14pt Arial, sans-serif;
  }
  #heading-sub-sub2 {
    font: 10pt Arial, sans-serif;
  }
  #heading-back {
    font: italic bold 12pt Arial, sans-serif;
  }
  #bandimage1, #bandimage2 {
    display: none;
  }
  #mobticket {
    display: block;
    margin: 10px auto 10px auto;
    padding: 15px 10px 15px 10px;
    width: 130px;
    background-color: black;
    font: 11pt Arial, sans-serif;
    border: solid 5px white;
    border-radius: 15px;
    box-shadow: 5px 5px 10px #888888;
    vertical-align: top;
    text-align: center;
  }
  #mobticketlink {
    font: italic bold 16pt Arial, sans-serif;
  }
  #mobticketlink a:link { color: #ffffff; text-decoration: none; }
  #mobticketlink a:visited { color: #ffffff; text-decoration: none; }
  #mobticketlink a:hover { color: #ccccff; text-decoration: none; }
  #mobticketlink a:active { color: #ccccff; text-decoration: none; }
}

@media screen and (max-width: 450px) {
  #mainblock {
    max-width: 450px;
  }
  #heading {
    max-width: 450px;
    font: 24pt Arial, sans-serif;
  }
  #heading-sub {
    font: 16pt Arial, sans-serif;
  }
  #heading-sub-sub {
    font: 10pt Arial, sans-serif;
  }
  #heading-sub2 {
    font: 12pt Arial, sans-serif;
  }
  #heading-sub-sub2 {
    font: 9pt Arial, sans-serif;
  }
  #heading-back {
    font: italic bold 12pt Arial, sans-serif;
  }
  #info {
    max-width: 450px;
  }
  #info2 {
    max-width: 450px;
  }
  #mobticket {
    display: block;
    margin: 10px auto 10px auto;
    padding: 15px 10px 15px 10px;
    width: 130px;
    background-color: black;
    font: 11pt Arial, sans-serif;
    border: solid 5px white;
    border-radius: 15px;
    box-shadow: 5px 5px 10px #888888;
    vertical-align: top;
    text-align: center;
  }
  #mobticketlink {
    font: italic bold 16pt Arial, sans-serif;
  }
  #bands {
    max-width: 400px;
  }
  #beers {
    max-width: 400px;
  }
  #bandimage1, #bandimage2 {
    display: none;
  }
  #lastfew {
    max-width: 450px;
  }
  #tickets {
    max-width: 450px;
  }
}
