@font-face {
font-family:'PT Sans';
src:url('/.s/t/1322/fonts/PTS55F_W.eot');
src:url('/.s/t/1322/fonts/PTS55F_W.eot?#iefix') format('embedded-opentype'),
url('/.s/t/1322/fonts/PTS55F_W.woff') format('woff'),
url('/.s/t/1322/fonts/PTS55F_W.ttf') format('truetype'),
url('/.s/t/1322/fonts/PTS55F_W.svg#webfont') format('svg');
font-weight: normal;
font-style: normal;
}

*{
 margin:0 auto;
 outline:none;
}

a{
 text-decoration:none;
 color:#006ab3;
}

html{
 background:#cbe2f2;
 width:100%;
 min-height:100% !important;
 text-decoration:none;
}

body{
 background:#fff;
 width:800px;
 text-decoration:none;
 clear:both;
}

.header{
 height:200px;
 background:url("/bg_header.png");
 clear:both;
}

.content{
 background:url("/bg3.jpg") 0 0 repeat-y;
 height:auto !important;
 margin:0 auto;
 font-family:'PT Sans';
 font-size:14px;
 font-weight: normal;
 font-style: normal;
 text-decoration:none;
}

.content::after{
 content: " ";
 display:block;
 clear:both;
}

/*Заголовок*/

.logo{
 background:url("/logo.png") no-repeat;
 text-decoration:none;
 height:200px;
 width:200px;
 float:left;
}
.logo:hover{
 background-position:0 -200px;
}

.main-menu{
 height:200px;
 width:600px;
 float:right;
}

.logos{
 height:100px;
 width:600px;
}

.main-menu-logo{
 background:url("/main-menu-logo.png") no-repeat;
 height:100px;
 width:381px;
 float:left;
}

.contacts{
 background:url("/contacts.png") 0 -103px no-repeat;
 height:100px;
 width:219px;
 float:right;
}

.menu{
 height:100px;
 width:600px;
 float:bottom;
}

.menu-option{
 height:100px;
 width:100px;
 float:left;
}

.option-game{
 background:url("/option-game.png");
 text-decoration:none;
 line-height:100px;
 width:100px;
 display:inline-block;
}
.option-game:hover{
 background-position:0 -100px;
}

.option-dev{
 background:url("/option-dev.png");
 text-decoration:none;
 line-height:100px;
 width:100px;
 margin:0;
 display:block;
}
.option-dev:hover{
 background-position:0 -100px;
}

.option-photo{
 background:url("/option-photo.png");
 text-decoration:none;
 line-height:100px;
 width:100px;
 margin:0;
 display:block;
}
.option-photo:hover{
 background-position:0 -100px;
}

.option-video{
 background:url("/option-video.png");
 text-decoration:none;
 line-height:100px;
 width:100px;
 margin:0px;
 display:block;
}
.option-video:hover{
 background-position:0 -100px;
}

.option-school{
 background:url("/option-school.png");
 text-decoration:none;
 line-height:100px;
 width:100px;
 margin:0px;
 display:block;
}
.option-school:hover{
 background-position:0 -100px;
}

.option-about{
 background:url("/option-register.png");
 text-decoration:none;
 line-height:100px;
 width:100px;
 margin:0px;
 display:block;
}

.option-about:hover{
 background-position:0 -100px;
}

.option {
 background:url("/menugif.png");
 background-position:0 -40px;
 text-decoration:none;
 line-height:40px;
 width:120px;
 margin:3px;
 text-indent:5px;
 display:block;
}

.option:hover {
 background-position:0 -40px;
}

.albumrow{
 width:90%;
 height:160px;
 display:block;
}

.album-text{
 text-align:center;
 top:40px;
 color:black; 
 font-family: Garamond; 
 font-size:16px; 
 z-index:1 
}

.album {
 margin:10px;
 border-color: #006ab3;
 border-width: 2px;
 display:inline-block;
 -moz-filter: grayscale(100%);
 -webkit-filter: grayscale(100%);
 -o-filter: grayscale(100%);
 filter: grayscale(100%);
}

.album:hover{
 filter: grayscale(0%);
}

.album1 {
 — moz-transition: all 1s ease;
 — webkit-transition: all 1s ease;
 — o-transition: all 1s ease;
 transition: all 1s ease;
}

.album1:hover {
 — moz-transform: scale (1.5);
 — webkit-transform: scale (1.5);
 — o-transform: scale (1.5);
 — ms-transform: scale (1.5);
 transform: scale (1.5);
}

.game-menu{
 width:140px;
 float:left;
}

.game{
 width:560px;
 margin:0 auto;
}

.game-info{
 margin-bottom: 20px;
 width:560px;
 height:100%;
}

.game-infobox{
 background:#fff;
 width:280px;
 float:left;
}

.game-infobox>h1{
 font-variant: small-caps;
 font-size: 20px;
 text-align: center;
}

h1{
 font-family:Garamond;
 font-variant: small-caps;
 font-weight:bold;
 font-size: 20px;
 text-align: center;
 padding-bottom:10px;
}

.game-infobox>table{
 padding:3px;
 font-size: 16px;
 text-valign: top;
 word-break:keep-all;
}

.game-infobox>td{
 width:140px;
}

.bold{
 font-weight:bold
}

.game-image{
 max-width:280px;
 — moz-transition: all 1s ease;
 — webkit-transition: all 1s ease;
 — o-transition: all 1s ease;
 transition: all 1s ease;
}

.game-image:hover{
 — moz-transform: scale (1.5);
 — webkit-transform: scale (1.5);
 — o-transform: scale (1.5);
 — ms-transform: scale (1.5);
 transform: scale (1.5);
}

.game-description{
 float:left;
 width:560px;
 position:relative;
}

.game-description>p{
 margin-bottom:10px;
}

.game-description>p:first-letter{
 font: bold 18px Garamond;
}

ul.game-menu-top, .submenu>ul, .game-menu-option-submenu>ul{
 list-style:none;
 margin:0;
 padding:0;
}

.game-menu-top>li, .submenu>li, .game-menu-option-submenu>li{
 list-style:none;
 margin:0;
 padding:0;
 line-height:1;
}

.game-menu-top>li{
 position:relative;
 margin-left:0px;
 margin-right:-4px;
 display:inline-block;
}

.submenu{
 text-align:center;
 min-width:100px;
 position:absolute;
 top:100%;
 -webkit-transition: 0.5s ease-in-out;
 -moz-transition: 0.5s ease-in-out;
 -o-transition: 0.5s ease-in-out;
 transition: 0.5s ease-in-out;
 z-index:10;
}

.one .submenu{
 display:none;
}

.one ul li:hover .submenu{
 display:block;
}

.game-menu-option{
 text-align:center;
 position:relative;
 display:inline-block;
 height:50px;
 width:50px;
 float:left;
}

.game-menu-option-submenu{
 background:#8cc9f3;
 text-align:center;
 position:absolute;
 top:100%;
 left:-25px;
 width:100px;
 -webkit-transition: 0.5s ease-in-out;
 -moz-transition: 0.5s ease-in-out;
 -o-transition: 0.5s ease-in-out;
 transition: 0.5s ease-in-out;
 z-index:40;
 padding:6px;
}

.menu-option .game-menu-option-submenu{
 display:none;
}

.menu-option ul li:hover .game-menu-option-submenu{
 display:block;
}

.game-menu-option{
 background:#8cc9f3;
 text-decoration:none;
 line-height:50px;
 width:50px;
 margin:0;
 display:block;
}

.description{
 float:left;
 width:750px;
 margin:15px;
 padding:10px;
 text-align:justify;
 position:relative;
}

.description>p{
 margin-bottom:10px;
}

.description>h1{
 margin-bottom:10px;
 font-family: Segoe Print;
 text-align: center;
}

.description>p:first-letter{
 font: bold 18px Verdana;
}

/*табы*/

.tabs-buttons{
 width:560px;
 margin-top:10px;
 display:block;
}

.tabs-buttons>a{
 background: #8cc9f3;
 padding:4px;
 border-radius:5px 5px 0px 0px;
 text-decoration:none;
 color:black;
}

.tabs-buttons-pics>{
 width:560px;
 margin-top:10px;
}

.tabs-buttons-pics>a>img{
 float:left;
 display:block;
}

.tabs-body {
 width:560px;
 word-wrap: normal;
 margin:10px 0px 10px 0px;
}

.tab-sheets{
 text-align:justify;
 padding-top:10px;
}

.tabs-sheet{
 background:#8cc9f3;
 border:solid 0px #006ab3;
 padding:10px;
 margin-top:5px;
 width:560px;
 float:left;
 display:none;
}

.tabs-sheet:target{
 display:block;
}

/*footer*/

.footer{
 height:50px;
 bottom:0px;
 left:0px;
}

.footer-left{
 background:url("/footer-left.png") no-repeat;
 height:50px;
 width:100px;
 float:left;
 clear:both;
}

.footer-center{
 background:#006ab3;
 height:50px;
 width:800px;
 float:left;
}

.footer-right{
 background:url("/footer-right.png") no-repeat;
 height:50px;
 width:100px;
 float:left;
}

/*Главная*/
.new{
 width:570px;
 margin:5px 0px 0px 12px;
 padding:5px;
 text-align:center;
}
.announce{
 text-align:center;
 background:#006ab3;
 color:#fff;
 width:180px;
 margin:5px 7px 0px 0px;
 padding:5px;
 line-height:25px;
}

.announce>h1{
 font-size:20px;
 font-style:bold;
 margin-bottom:5px;
}

.announce>div>a{
 font:Times New Roman 14px bold;
 margin-top:5px;
 text-decoration:none;
 color:black;
 background:#fff;
}

.archive{
 width:180px;
 background:#006ab3;
 color:#fff;
 margin:5px 7px 0px 0px;
 padding:5px;
}

.dif-light{
 background:url("/difficulty.png") 0 -40px;
 float:left;
 width:120px;
 height:20px;
}

.dif-mid{
 background:url("/difficulty.png") 0 -20px;
 float:left;
 width:120px;
 height:20px;
}

.dif-hard{
 background:url("/difficulty.png") 0 0px;
 float:left;
 width:120px;
 height:20px;
}

.gif {
 margin-left:5px;
 border:#006ab3 solid 5px;
 border-radius:100%;
 display:block;
}
.gif:hover{
 background-position:0 -100px;
}

/*Слайдер*/
.frame{
 width:600px;
 height:auto;
 margin-left:90px;
 margin-bottom:10px;
 padding:10px;
}

.frame input{
 display:none;
}

#overflow{
 width:100%;
 overflow:hidden;
}

#slide1:checked ~ #slides .inner{margin-left:0;}
#slide2:checked ~ #slides .inner{margin-left:-100%;}
#slide3:checked ~ #slides .inner{margin-left:-200%;}
#slide4:checked ~ #slides .inner{margin-left:-300%;}
#slide5:checked ~ #slides .inner{margin-left:-400%;}
#slide6:checked ~ #slides .inner{margin-left:-500%;}
#slide7:checked ~ #slides .inner{margin-left:-600%;}
#slide8:checked ~ #slides .inner{margin-left:-700%;}
#slide9:checked ~ #slides .inner{margin-left:-800%;}
#slide10:checked ~ #slides .inner{margin-left:-900%;}

#slides .inner{
 width:1000%;
 line-height:0;
}

#slides article{
 width:10%;
 height:350px;
 float:left;
}

article img{
 width:100%;
}

/*Кнопки*/
#controls{
 margin:-35% 0 0 0;
 width:100%;
 height:50px;
}
#controls label{
 display:none;
 width:50px;
 height:50px;
 opacity:0.5;
}
#active{
 margin:23% 0 0;
 text-align:center;
}
#active label{
 border-radius:5px;
 display:inline-block;
 width:10px;
 height:10px;
 background:#bbb;
}
#active label:hover{
 background:#ccc;
 border-color:#777 !inportant;
}

#controls label:hover{
 opacity:1;
}
#slide1:checked ~ #controls label:nth-child(2), #slide2:checked ~ #controls label:nth-child(3),
#slide3:checked ~ #controls label:nth-child(4), #slide4:checked ~ #controls label:nth-child(5),
#slide5:checked ~ #controls label:nth-child(6), #slide6:checked ~ #controls label:nth-child(7),
#slide7:checked ~ #controls label:nth-child(8), #slide8:checked ~ #controls label:nth-child(9),
#slide9:checked ~ #controls label:nth-child(10), #slide10:checked ~ #controls label:nth-child(1){
 background:url("/next.png") no-repeat;
 float:right;
 margin:0 -60px 0 0;
 display:block;
}
#slide1:checked ~ #controls label:nth-child(10), #slide2:checked ~ #controls label:nth-child(1),
#slide3:checked ~ #controls label:nth-child(2), #slide4:checked ~ #controls label:nth-child(3),
#slide5:checked ~ #controls label:nth-child(4), #slide6:checked ~ #controls label:nth-child(5),
#slide7:checked ~ #controls label:nth-child(6), #slide8:checked ~ #controls label:nth-child(7),
#slide9:checked ~ #controls label:nth-child(8), #slide10:checked ~ #controls label:nth-child(9){
 background:url("/prev.png") no-repeat;
 float:left;
 margin:0 0 0 -35px;
 display:block;
}

.quote-left{
 margin-top:10px;
 font-style:italic;
 width:70%;
 margin-left:20px;
}
.quote-right{
 margin-top:10px;
 font-style:italic;
 float:right;
 width:70%;
 margin-right:20px;
 text-align:right;
}

.quote-right .quote-left p{
 padding:5px; 
}

.sign{
 font-weight:bold;
 font:16px;
 margin:10px;
}
.mspic{
 position:relative;
 float:left;
 width:393px;
 height:393px;
 margin:10px 0 0px 0;
}

.mspic img.first, img.second {
 position:absolute;
 left:0;
 top:0;
}
.mspic img.first { /* первая картинка полностью прозрачная */

 opacity:0;

 filter:alpha (opacity=0);

}

.mspic:hover img.first { /* при наведении курсора первая картинка становится не прозрачной */

 opacity:1;

 filter:alpha (opacity=100);

}

.mspic:hover img.second, .mspic img.second:hover { /* а вторая при наведении курсора становится прозрачной */

 opacity:0;

 filter:alpha (opacity=0);

}

.mspic-text{
 display:none;
 opacity:0;
 text-align:center;
 z-index:1;
}

.mspic:hover .mspic-text{
 display:block;
 opacity:0.7;
 z-index:1;
}

.game-main-side{
 background: url("http://roleclub.ucoz.org/bg5.png"); width: 100px;
}

.game-main-side-down{
 background-image: url("/bg6.png"); width:100px; height:20px;
}

.back-button{
 background:url("http://roleclub.ucoz.org/back-button.png") no-repeat;
 height:50px;
 width:70px;
 float:left;
}
.back-button:hover{
 background-position:0 -50px;
}

/*Служебные*/

.block-undercon{
 width:500px;
 height:300px;
 font-family:Garamond;
 font-size:40px;
 text-align:center;
 background:#88c9f3;
 color:Black;
 margin:0 auto;
 margin-bottom:30px;
}

p.block-undercon:first-letter{
 font:bold 40px;
}