body {
    font: 14px/20px 'Open Sans', serif;
}

h1{font-size: 1.2em; color: #03AC06; text-align: center;}
code{display: inline-block; background-color: #FFFFF3; border-radius: 4px; padding: 0 3px;}
#conteiner{
    display: block; width: calc(100wv - 5px);
    max-width: 850px; margin: auto; border: 1px solid #A1B5FB; text-align: center; padding: 5px; border-radius: 4px; background-color: #DDDDDD;}
.noselect {
	color: #555;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
/* BIGIN CSS title */
.jn-tooltip {
	display: inline;
	position: relative;
}
.jn-tooltip:hover:after {
	content: attr(data-title);
	z-index: 999;
	position: absolute;
	top: 26px;
	left: 5%;
	width: 195px;
	padding: 7px 15px 10px 15px;
	font-size: 13px;
	font-weight: 300;
	color: #fff;
	background-color: #444;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	-o-border-radius: 3px;
	-ms-border-radius: 3px;
	border-radius: 3px;
}
.jn-tooltip:hover:before {
	content: "";
	z-index: 1000;
	position: absolute;
	top: 21px;
	left: 50%;
	border-style: solid;
	border-width: 0px 6px 5px 6px;
	border-color: #444 transparent;
}
/* END title */
.contbloc{
    position: relative;
    display: block; 
     text-align: center;
    max-width: 240px;
    padding-bottom: 3px;
}
.chapkatext{display: inline;
  font-size: 1.4em;
  color: #F6B901;
  text-shadow: 1px 1px #707070, 1px 2px #707070, 1px -1px #707070, -1px 1px #707070, -1px -1px #707070, 3px 3px 6px rgba(0,0,0,.8);
  font-family: Georgia, serif;
  letter-spacing: 0.2em;
  -ms-user-select: none;
  -moz-user-select: none;
  -khtml-user-select: none;
  -webkit-user-select: none;
  font-weight:  bold;
  overflow:auto;
}
.chapkatext:hover{color: red;}
a{
    color: red; font-size: 1.1em; cursor: pointer;
}
.button{
    display:inline-block;
    position: relative;
    margin: auto;
    padding: .375rem .75rem;
    font-size: 1rem;
    line-height: 1.5;
    border-radius: .25rem;
    text-align: center;
    background-color: transparent;
    box-shadow:
  0 0 40px rgba(0, 0, 0, .2) inset,
  -1px 0px rgb(170,170,170), -1px 1px rgb(180,180,180),
  -2px 1px rgb(169,169,169), -2px 2px rgb(179,179,179),
  -3px 2px rgb(168,168,168), -3px 3px rgb(178,178,178),
  -4px 3px rgb(167,167,167), -4px 4px rgb(177,177,177),
  -5px 4px rgb(166,166,166), -5px 5px rgb(176,176,176);
  background: linear-gradient(-45deg, #FEE864, #F5965E);
  color: white;
  text-shadow: 1px 1px #372911, 1px 2px #372911, 1px -1px #372911, -1px 1px #372911, -1px -1px #372911, 3px 3px 6px rgba(0,0,0,.5);
  font-family: Times, Times New Roman, Georgia, serif;
  letter-spacing: 0.05em;
  -ms-user-select: none;
  -moz-user-select: none;
  -khtml-user-select: none;
  -webkit-user-select: none;
  font-weight: bolder;
  overflow:auto;
  text-overflow: ellipsis;
  cursor: pointer;
}
.button:hover{
    background: linear-gradient(45deg, #FEE864, #F5965E);
}
.button:active{
    margin: 5px 10px 5px 5px;
    box-shadow:
   -1px 0px rgb(170,170,170), -1px 1px rgb(180,180,180),
   -2px 1px rgb(169,169,169), -2px 2px rgb(179,179,179);
}
.primer{
    display: block; min-height: 90px; margin-bottom: 10px; border: 0px dashed #767171; border-radius: 3px;
}
.inputurl{width: 90%; margin: 5px;}
.blokrez, .bloktema{display: inline-block; text-align: center; min-height: 35px; width: 40%; vertical-align: top; font-size: 1.2em; padding: 3px; border: 1px solid blue;}
#rez td{border: 1px dashed #767171;width: 40%;text-align: center; background-color: #FFFDDC;}

/* Основные стили комментариев */
#com_cont, .com_rez{
    display: block; border: 1px solid #ACACAC; border-radius: 5px; padding: 5px; height: 100%; min-height: 100px; text-align: left;
}
.com_nick, .com_mail{
     font-size: 1em; border: 1px solid #ACACAC; padding: 3px; border-radius: 5px; min-width: 125px; width: calc( 50%  - 11px);
}
.commInp:active, .commInp:hover, .commInp:focus{outline: 0; outline-offset: 0;}
.com_text{font-size: 1em; border: 1px solid #ACACAC; margin-top: 3px; padding: 3px; border-radius: 5px; width: calc( 100% - 10px); min-height: 100px;}
.com_rez h1{color: black; text-align: left; font-size: 1.2rem;}
.com_rez pre{color: #0117FE; text-align: left; font-size: 1rem; display: block; background-color: #FFFFED;padding: 3px; overflow: auto; border-radius: 4px;}
#com_blok{
    display: block;
    text-align: left;
    padding: 5px 10px;
    border: 0px solid #B7FBB4;
}
.com_content{display: block; padding: 0 5px; font: 1rem "Helvetica", Sans-serif;}
.box_comment{
    display: block;
	width: calc( 100%  - 5px);
	border: 1px solid #ddd;
	min-height: 75px;
	position: relative;
	margin: 0 auto;

	background: #efefef;
}

 .box_com_otv{
    display: block;
	width: calc( 100%  - 17px);
	border: 1px solid #ddd;
	min-height: 100px;
	position: relative;
	margin: 3px;
    margin-left: 13px;
	background: #efefef;
}
.ribbon {
	display: block;
	width: calc(100% + 22px);
	min-height: 26px;
	line-height: 26px;
	text-align: center;
	margin-left: -11px;
	margin-right: -11px;
	font-size: 1.0rem;
	position: relative;
	top: 6px;
    box-shadow: 1px 1px 3px #878787;
}
.ribbon_com{color: #fff; background: #50d056;}
.ribbon_com:before {
	content: "";
	position: absolute;
	height: 0;
	width: 0;
	bottom: -10px;
	left: 0;
	border-top: 10px solid #317316;
	border-left: 10px solid transparent;
}
.ribbon_com:after {
	content: "";
	position: absolute;
	height: 0;
	width: 0;
	right: 0;
	bottom: -10px;
	border-top: 10px solid #317316;
	border-right: 10px solid transparent;
}
.ribbon_otv{color: #F7FF06; background: #6D85FE;}
.ribbon_otv:before {
	content: "";
    transform: rotate(90deg);
	position: absolute;
	height: 0;
	width: 0;
	top: -8px;
	left: 3px;
	border-top: 10px solid #0110B1;
	border-left: 6px solid transparent;
}
.ribbon_otv:after {
	content: "";
	position: absolute;
	height: 0;
	width: 0;
	right: 0;
	bottom: -10px;
	border-top: 10px solid #0110B1;
	border-right: 10px solid transparent;
}
.ribbon_otv img{position: relative; height: 28px; border: 0px solid yellow; margin-bottom: -8px;}
.com_func_block{display: block; margin: 3px; padding: 2px; border-radius: 5px; border: 0px solid wheat;min-height: 26px;}
.com_mark{display: inline-block; min-width: 40px; height: 20px; text-align: center; line-height: 20px; position: relative;
     padding: 2px; margin: 1px 2px 3px 0 ; border: 0px solid #DEDBFF; border-radius: 3px; cursor: pointer;
     box-shadow: 0 0 0 1px rgba(0,0,0,.2), 0 1px 2px rgba(0,0,0,.2), inset 0 1px 2px rgba(255,255,255,.7); background-image: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,.1));}
.com_mark span{ white-space: nowrap; overflow: hidden; vertical-align: top;}
.plus{color: green;}
.plus:hover{background-color: #CEFFB6;}
.minus{color: red;}
.minus:hover{background-color: #FDC6C6;}
.com_func_block img{height: 18px; margin-right: 2px;}
.com_otv_kn{
    display: inline-block; height: 20px; padding: 2px 4px; margin: 1px 0 3px 0 ; border: 0px solid #DEDBFF; border-radius: 3px; cursor: pointer; vertical-align: 4px;
    background-image: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,.1));
    font: 1.1em Georgia, serif;font-weight: 700; color: rgba(0,0,0,.6);text-shadow: 0 1px 1px rgba(255,255,255,.7);
    box-shadow: 0 0 0 1px rgba(0,0,0,.2), 0 1px 2px rgba(0,0,0,.2), inset 0 1px 2px rgba(255,255,255,.7);
    }
.com_otv_kn:hover{background-color: #A6A6A6; color: white;text-shadow: 0 1px 1px rgba(0,0,0,.7);}
.com_date{display: block; color: #6C6C6C; font-family: sans-serif serif; font-size: 0.7rem; text-align: right; white-space: nowrap; margin: 1px 5px 6px 5px;padding: 2px 10px; border-bottom: 1px solid #AFAFAF;}
.comInfo{display: block; text-align: center; color: red; font-size: 1.2rem; margin-bottom: 5px;}
.cursorDoubleClick{cursor: url('../images/icon-double-click-25.png'), auto;}
#savecom {
        text-align:center;
        font: 1.1em Georgia, serif;
        text-decoration: none;
        font-weight: 700;
        padding: 3px 6px;
        background: #eaeef1;
        display:block;
        width:120px;
        margin: 7px auto;
        background-image: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,.1));
        border-radius: 3px;
        color: rgba(0,0,0,.6);
        text-shadow: 0 1px 1px rgba(255,255,255,.7);
        box-shadow: 0 0 0 1px rgba(0,0,0,.2), 0 1px 2px rgba(0,0,0,.2), inset 0 1px 2px rgba(255,255,255,.7);
        cursor: pointer;
}
#savecom:hover, #savecom.hover {background: #fff;}
#savecom:active, #savecom.active {
        background: #d0d3d6;
        background-image: linear-gradient(rgba(0,0,0,.1), rgba(0,0,0,0));
        box-shadow: inset 0 0 2px rgba(0,0,0,.2), inset 0 2px 5px rgba(0,0,0,.2), 0 1px rgba(255,255,255,.2);
}
.admNik{color: red; font-weight: 900; -webkit-text-stroke: 1px #fefa86;}
.imgCom{width: calc(100% - 1px);}
.cutDown{display: block; margin: 1px 10px; padding: 2px; text-align: center; font-size: 1.2em; color: #6E82FF; cursor: pointer; background-color: #FFFFD8; border: 1px solid yellow; border-radius: 7px;}
.timer{
    font-family: "Times New Roman"; color: #FC6262; font-weight: 700;
     display: inline-block; min-width: 30px; height: 20px; text-align: center; line-height: 20px; position: relative; top: -4px;
     padding: 2px; margin: 1px 4px 3px 2px; border: 0px solid #DEDBFF; border-radius: 3px;
     box-shadow: 0 0 0 1px rgba(0,0,0,.2), 0 1px 2px rgba(0,0,0,.2), inset 0 1px 2px rgba(255,255,255,.7); background-image: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,.1));}