/* MAIN */
html, body {
    height:100%;
    color: #a8a8a8;
    min-width:1000px;
    max-width:100%;
    font-family:  Tahoma, sans-serif;
    font-size: 13px;
    margin: 0;
    padding: 0;
}

a:link, a:visited {
    color: #4a4a4a; 
    text-decoration: underline;
}

a:hover, a:active, a:focus {
    color: #6a6a6a; 
    text-decoration: none;
}

audio {
    display:none;
}

div {
    margin: 0 auto;
}

/*MAIN*/
#background {
    width: 100%;
    min-height: 100%;
    overflow: hidden;
    position: absolute;
    z-index: 9;
    background-color: #000;
    opacity: 1;
    transition-duration: 1000ms;
}

#background:empty {
    z-index: 0;
    opacity: 0;
}

#wrapper {
    min-height: 100%;
    overflow: hidden;
    position: relative;
    background: url(../img/bg.jpg) top center;
}

#topbar {
    height:60px;
    background-color: rgba(0, 0, 0, 0.7);
    margin-bottom:20px;
    text-align:center;
    font-weight:bold;
    font-size:25px;
    color:#ff0000;
    line-height: 60px;
}

#content {
    width:800px;
    padding:10px;
    background:#000;
    background-color: rgba(0, 0, 0, 0.9);
    filter: alpha(opacity=90);
    border:5px solid #000;
    margin-bottom:40px;
}

.info {
    width:700px;
    height:20px;
    padding:10px;
    text-align:center;
    font-size:14px;
    color:#8a8a8a;
    border:1px dotted #4a4a4a;
    margin-bottom:10px;
}

#counter-bar {
    width:100%;
    position:absolute;
    left:0;
    top:0;
    z-index:998;
}

/*LOADING*/
#loading {
    width:700px;
    height:20px;
    border:1px solid #202020;
}

#loading-bar {
    width:0px;
    height:20px;
    background:#1b1b1b;
    float:left;
}
 
/*PUZZLE*/
#puzzle-frame {
    width:300px;
}

.puzzle-img {
    width: 300px;
    height: 300px;
}

/*NYANMUMINKI*/
.img-corner-nyan {
    width:270px;
    height:247px;
    z-index:9999;
    background:url(../img/characters/buka.png) no-repeat;
    position: absolute;
}

.img-corner-nyan.img2 {
    background:url(../img/characters/bobek.png) no-repeat;
}

.img-corner-nyan.type1 {
    transform:rotate(135deg); 
    -webkit-transform:rotate(135deg); 
    -moz-transform:rotate(135deg); 
    -o-transform:rotate(135deg); 
    top:-300px;
    left:-300px;
}

.img-corner-nyan.type2 {
    transform:rotate(225deg); 
    -webkit-transform:rotate(225deg); 
    -moz-transform:rotate(225deg); 
    -o-transform:rotate(225deg); 
    top:-300px;
    right:-300px;
}

.img-corner-nyan.type3 {
    transform:rotate(315deg); 
    -webkit-transform:rotate(315deg); 
    -moz-transform:rotate(315deg); 
    -o-transform:rotate(315deg); 
    bottom:-300px;
    right:-300px;
}

.img-corner-nyan.type4 {
    transform:rotate(45deg); 
    -webkit-transform:rotate(45deg); 
    -moz-transform:rotate(45deg); 
    -o-transform:rotate(45deg); 
    bottom:-300px;
    left:-300px;
}

.img-nyan {
    position: absolute;
    z-index: 9999;
}

.img-nyan.type1 {
    background:url(../img/nyan1.gif) no-repeat;
    background-size:cover;
}

.img-nyan.type1b {
    background:url(../img/nyan1b.gif) no-repeat;
    background-size:cover;
}

.img-nyan.type2 {
    background:url(../img/nyan2.gif) no-repeat;
    background-size:cover;
}

.img-nyan.type2b {
    background:url(../img/nyan2b.gif) no-repeat;
    background-size:cover;
}

.img-nyan.type3 {
    background:url(../img/nyan3.gif) no-repeat;
    background-size:cover;
}

.img-nyan.type3b {
    background:url(../img/nyan3b.gif) no-repeat;
    background-size:cover;
}

.img-nyan.type4 {
    background:url(../img/nyan4.gif) no-repeat;
    background-size:cover;
}

.img-nyan.type4b {
    background:url(../img/nyan4b.gif) no-repeat;
    background-size:cover;
}

.img-nyan.type5 {
    background:url(../img/nyan5.gif) no-repeat;
    background-size:cover;
}

.img-nyan.type5b {
    background:url(../img/nyan5b.gif) no-repeat;
    background-size:cover;
}

.img-nyan.type6 {
    background:url(../img/nyan6.gif) no-repeat;
    background-size:cover;
}

.img-nyan.type6b {
    background:url(../img/nyan6b.gif) no-repeat;
    background-size:cover;
}

.img-nyan.type7 {
    background:url(../img/nyan7.gif) no-repeat;
    background-size:cover;
}

.img-nyan.type7b {
    background:url(../img/nyan7b.gif) no-repeat;
    background-size:cover;
}

.counter-frame {
    padding: 5px;
    font-size: 30px;
    color: #8a8a8a;
    background-color: rgba(0, 0, 0, 0.6);
}

#counter-frame {
    margin: 10px 0px 0 100px;
    float: left;
}

#counter-time-frame {
    margin: 10px 100px 0 0px;;
    float: right;
}

.counter {
    font-weight: bold;
}