/* Background layer for AJAX */
#fullback {
	z-index: 999;
	position: fixed;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
    display: block;
	overflow: hidden;
    background: #000;
    opacity: 0.7;
	display: none;
}

/* Content layer for AJAX */
#full {
	z-index: 1000;
	position: absolute;
	top: 0px;
	width:1000px ;
	left:50%;
	margin-left:-500px;
	/*padding: 10% 0;*/
	min-height: 100px;
	display: none;
	
}
#bar {
	z-index: 1001;
	position: fixed;
	top: 20px;
	width:100px ;
	left:100vw;
	margin-left:-120px;
	/*padding: 10% 0;*/
	min-height: 100px;
}
#leftbar {
	z-index: 1001;
	position: fixed;
	top: 20px;
	width:100px ;
	left:20px;
	/*padding: 10% 0;*/
	min-height: 100px;
}
#full #bar img
{filter: invert(100%);
cursor:pointer;}
body
{
background-color:#9b7b5f;
background-size:400px auto;
background-image:url(img/wall.png);
background-repeat:repeat;}
#main 
{width:1000px;
min-height:100%;
margin: 0 auto;}
/*
.frame_small
{margin:20px;
display: inline-block;  
height: 147px;
width: 220px;
border: 30px solid #40c4c8;
border-image: url(img/frame_small.png) 25 round round;
overflow:hidden;
}

.frame
{margin:20px;
display: inline-block;  

border: 40px solid #40c4c8;
  border-image:url(img/frame.png) 74 round round;
}
*/
.frame_small
{margin:13px;
display: inline-block;  
height: 147px;
width: 220px;
border: 20px solid #40c4c8;
border-image: url(img/frame.png) 73 round round;
overflow:hidden;
}

.frame
{margin:15px;
display: inline-block;  

border: 20px solid #40c4c8;
  border-image:url(img/frame.png) 73 round round;
}
#help,#add
{display: block;
	position: fixed;
	top:calc(100vh - 150px);
	
}
#help
{left: 20px;}
#add
{left:calc(100vw - 190px);}
#footer
{min-height: 200px}
.goldtext
{
	display:inline-block;
	/*font-size: 24pt;*/
	color: silver;
	text-decoration: none;
	text-transform:uppercase;
	margin: 5px 2px;
	padding: 7px;
	background-image: url(img/wood2.jpg);
	border-radius: 5px;
	max-width: 800px;
	
	/*text-decoration: none;*/
    font-family: Verdana;
    font-size: 10px;
    font-weight: 700;
}
.selected
{	background-image: url(img/wood1.jpg);}
#main,#pagination,#list
{text-align:center;
	text-align-last:center;
}

#full td
{text-align: center;}
#full .frame_small
{margin: 3px;}
#full .frame
{width:900px;}
#full .frame_small
{width:190px;}
#full .goldtext
{
	display:inline-block;
	font-size: 24pt;
	color: silver;
	text-decoration: none;
	/*text-transform:uppercase;*/
	margin: 5px 2px;
	padding: 7px;
	background-image: url(img/wood2.jpg);
	border-radius: 5px;
	max-width: 800px;
	
	/*text-decoration: none;*/
    font-family: Verdana;
    /*font-size: 10px;*/
    font-weight: 700;
}
#full textarea
{background-color:rgba(241,196,143,0.8);}
#fullscreen
{
display:none;
z-index: 1000;
position:fixed;
left:0px;
top:0px; 
width:100vw;
height:100vh;
background-size: contain;
background-position: center center;
background-repeat: no-repeat;
}
.comdiv
{width:450px;
margin:0 auto;
background-color:rgba(255,227,200,0.3);
padding-bottom:50px;
border-radius:10px;}
.comm
{width:375px;
margin:0 auto;}
.commautor
{padding:0 20px;
display:block;
font-size:14pt;
text-align:right;
font-weight:bold;
background-color:gray;
}
.commtext
{padding:0 50px;
display:block;
font-size:14pt;
text-align:left;
}
/*
#comments  div :nth-of-type(odd)
{background-color:gray;}*/
.srate{

background-image:url(img/star2.png);
width:86px;

background-repeat:repeat-y;
display:inline-block;}
.frate{
background-image:url(img/star1.png);
height:420px;
width:86px;
background-repeat:repeat-y;
display:inline-block;
text-align:left;}


.flip-vertical{
-moz-transform: scale(1,-1);
-webkit-transform: scale(1, -1);
-o-transform: scale(1, -1);
transform: scale(1, -1);
filter: FlipV;
-ms-filter: "FlipV";
}
/*////////////////////////////////////////////////////////*/
.rating_block {
position:absolute;
top:0;
left:0;
width: 86px;
height: 420px;
opacity:0.1;
}
.rating_block:hover {
opacity:1;
}
.rating_block input[type="radio"] {
  display: none;
}
.label_rating {
  float: right;
  display: block;
  width: 86px;
  height: 84px;
  background: url(img/rating.png) no-repeat 50% -84px;
  cursor: pointer;
}
/*Пишем правила смены положения background-а*/
.rating_block .label_rating:hover, /*Правило для ховера на текущий лейбл*/
.rating_block .label_rating:hover ~ .label_rating, /*Правило для всех следующих лейблов по DOM дереву*/
.rating_block input[type="radio"]:checked ~ .label_rating /*Правило для всех следующих лейблов после выбранного инпута, чтобы звездочки как бы зафиксировались*/
{
  background-position: 50% -0;
}

.transitin
 {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.1s, visibility 0s linear 0.1s;
}
.transitout
 {
  opacity: 1;
  visibility: visible;
  transition: opacity 0.4s, visibility 0s linear 0.1s;
}