/* 
    Document   : custom
    Created on : Apr 8, 2013, 2:11:28 PM
    Author     : Owner
    Description:
        Purpose of the stylesheet follows.
*/
@import url(http://fonts.googleapis.com/css?family=VT323);
root { 
    display: block;
}
#cut-screen {
    width: 800px;
    height: 800px;
    position: absolute;
    top: 800px;
    background-image: url(../img/background/duck-screen.png);
}
#the-meadow {
    width: 800px;
    height: 800px;
    border: solid 1px #000000;
    margin: 60px auto 0px auto;
    background-color: #acd4f0;
    position: relative;
    background-image: url(../img/background/background.jpg);
    cursor: url(../img/crosshair-red.png)25 25, auto;
    overflow: hidden;
}
#the-forest {
    width: 800px;
    height: 800px;
    border: solid 1px #000000;
    margin: 60px auto 0px auto;
    background-color: #984a05;
    position: relative;
    /*background-image: url(../img/background/forest-bg.jpg);*/
    cursor: url(../img/viewfinder.png)25 17, auto;
    overflow: hidden;
}
#the-grass {
    width: 800px;
    height: 172px;
    position: absolute;
    bottom: 0px;
    background-image: url(../img/background/ground.png);
}
#the-head {
    width: 75%;
    height: 35%;
    /*background-color: #000000;
    opacity:0.5;*/
}
.right #the-head {
    float: right;
}
.left #the-head {
    float: left;
}
#the-squatch {
    width: 150px;
    height: 308px;
    position: absolute;
    bottom: 0px;
    background-image: url(../img/squatch-right.gif?t=12345);
    background-size: 100%;
    background-repeat: no-repeat;
}
#the-squatch.left {
    background-image: url(../img/testwalk5-rev.gif?t=12345);
}
#the-squatch.right {
    background-image: url(../img/testwalk5.gif?t=12345);
}
#the-duck {
    width: 150px;
    height: 94px;
    position: absolute;
    background-image: url(../img/tg-duck-right.gif?t=12345);
}
#the-duck.left {
    background-image: url(../img/tg-duck-left.gif?t=12345);
}
#the-duck.right {
    background-image: url(../img/tg-duck-right.gif?t=12345);
}
#the-duck.dead {
    background-image: url(../img/duck-shot2.png) !important;
    width: 153px;
    height: 162px;
}
#ammo {
    position: absolute;
    width: 115px;
    height: 54px;
    padding: 10px;
    bottom: 0px;
    left: 0px;
}
#film {
    position: absolute;
    width: 175px;
    height: 54px;
    padding: 10px;
    bottom: 0px;
    left: 0px;
}
.bullet {
    width: 15px;
    height: 54px;
    margin: 0px 10px;
    background-image: url(../img/shell2.png);
    float: left;
}
.exposure {
    width: 51px;
    height: 54px;
    margin: 0px 2px;
    background-image: url(../img/background/film.png);
    float: left;
}
.flash {
    cursor: url(../img/blam-75.png)35 35, auto !important;
}
#score {
    position: absolute;
    width: 310px;
    height: 31px;
    padding: 10px;
    bottom: 0px;
    right: 0px;
}
.point {
    width: 31px;
    height: 31px;
    background-image: url(../img/background/duck-head.png);
    float: left;
}
#the-forest .point {
    background-image: url(../img/background/squatch-head.png);
}
.hit {
    background-image: url(../img/background/hit.png) !important;
}
.miss {
    background-image: url(../img/background/miss.png) !important;
}
#round {
    background-image: url(../img/background/round-stroke.png);
    background-repeat: no-repeat;
    position: absolute;
    width: 118px;
    top: 35px;
    right: 55px;
}
.round1 {   
    background-image: url(../img/background/round1.png);
}
.round2 {   
    background-image: url(../img/background/round2.png);
}
.round3 {   
    background-image: url(../img/background/round3.png);
}
.round4 {   
    background-image: url(../img/background/round4.png);
}
.round5 {   
    background-image: url(../img/background/round5.png);
}
#roundnum {
    margin-top: 45px;
    width: 100%;
    height: 62px;
    background-repeat: no-repeat;
    background-position: center;
}
#infobox {
    width: 397px;
    height: 204px;
    position: absolute;
    left: 330px;
    top: 235px;
    color: #ffffff;
    font-weight: bold;
    font-size: 40pt;
    line-height: 120%;
    text-align: center;
    padding: 20px;
}
.roundtxt {
    font-size: 60pt;
    line-height: 120%;
}
.biggertxt {
    font-size: 150%;
}
.intermission {
    display: none;
}
#scorebox {
    font-family: 'VT323', sans-serif;
    color: #911;
    font-size: 55pt;
    position: absolute;
    width: 150px;
    height: 20px;
    top: 0px;
    left: 0px;
    padding: 30px;
    -webkit-user-select: none; /* Chrome/Safari */        
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* IE10+ */
    /* Rules below not implemented in browsers yet */
    -o-user-select: none;
    user-select: none;
}
#start-screen {
    position: absolute;
    top:0px;
    left: 0px;
    width: 800px;
    height: 800px;
}
#scoreblock {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 150px;
    height: 20px;
    padding: 30px;
}
.startup {
    padding: 20px;
    text-align: center;
}

.reveal-if-active {
  opacity: 0;
  max-height: 0;
  overflow: hidden;
}

input[type="radio"]:checked ~ .reveal-if-active {
  opacity: 1;
  max-height: 100%;
  overflow: visible;
  padding: 20px;
}

#dataTable{
    padding-bottom: 30px;
}
