/*------R E S E T-------*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video, a {
  margin: 0;
  text-decoration: none;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;}
body {
  line-height: 1;}
ol, ul {
  list-style: none;}
blockquote, q {
  quotes: none;}
blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;}
table {
  border-collapse: collapse;
  border-spacing: 0;}
  
  
 body{
	 background: #272727;
 }
 
 table th{
	padding-right: 18px;
	text-align: left;
 }
 
 table td{
	 padding-top: 6px;
	 padding-right: 14px;
 }
 
 .limited{
	 height: 50px;
	 overflow-y: hidden;
	 opacity: 0.5;
}
 
 .limited:hover{
	 cursor: pointer;
	 opacity: 0.65;
 }

.open{
	 padding-bottom: 18px;
	 height: auto !important;
	 opacity: 1 !important;
}
 
.st-start{
	color: #969696 !important;
	font-style: italic !important;
}
 
.mess img{
	width: 18px !important;
	height: 18px !important;
	margin-left: 6px;
}



.mess a{
	border-bottom: none !important;
}
.st-normal{
	color: #1d68d9 !important;
	font-style: italic !important;
}

.st-loading{
	color: #e8ae10 !important;
	font-style: italic !important;
}

.st-done{
	color: #15d933 !important;
	font-style: italic !important;
}

.st-rejected{
	color: #d91515 !important;
	font-style: italic !important;
}

  

/* FONTS */

h1{ /* Big header */
	font-family: "Helvetica Neue";
	font-size: 42px;
	font-weight: bold;
	letter-spacing: 0.7px;
	margin-bottom: 16px;
	line-height: 50px;
	color: #272727;
}

h2{ /* Main header */
	font-family: "Helvetica Neue";
	font-size: 24px;
	font-weight: bold;
	margin-bottom: 6px;
	line-height: 28px;
	color: #272727;
}

h3{ /* Smally Main header */
	font-family: "Helvetica Neue";
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 6px;
	line-height: 22px;
	color: #272727;
}

h4{ /* Rightblock grey header */
	font-family: "Helvetica Neue";
	font-size: 14px;
	font-weight: bold;
	font-style: italic;
	margin-bottom: 4px;
	line-height: 17px;
	color: #717171;
}

h5{ /* Category name, small header */
	font-family: "Helvetica Neue";
	font-size: 14px;
	font-weight: bold;
	margin-bottom: 2px;
	line-height: 17px;
	color: #272727;
}

h6{ /* Kitty font in footer */
	font-family: "Calibri";
	font-size: 14px;
	line-height: 11px;
	color: #717171;
}

p{ 	/* Main text */
	font-family: "Calibri";
	font-size: 16px;
	line-height: 21px;
	color: #272727;
}

a{	/* Url */
	font-family: "Calibri";
	font-size: 16px;
	line-height: 18px;
	padding-bottom: 1px;
	text-decoration: none;
	transition: all 0.1s ease-in;
	border-bottom: solid 1px #3254EF;
	color: #3254EF;
}
a:hover{
	cursor: pointer;
	text-decoration: none;
	transition: all 0.1s ease-out;
	border-bottom: solid 1px #eb5b13;
	color: #eb5b13;
}

.a-dash{	/* Url */
	font-family: "Calibri";
	font-size: 16px;
	line-height: 18px;
	padding-bottom: 1px;
	text-decoration: none;
	transition: all 0.1s ease-in;
	border-bottom: dashed 1px #3254EF;
	color: #3254EF;
}
.a-dash:hover{
	cursor: pointer;
	text-decoration: none;
	transition: all 0.1s ease-out;
	border-bottom: dashed 1px #eb5b13;
	color: #eb5b13;
}


/* INPUTS */

/* Buttons */

.b-button{ /* Blue accent button */
	height: 30px;
	padding: 0 24px 3px;
	border-radius: 30px;
	background: #3254EF;
	border: none;
	font-family: "Helvetica Neue";
	font-size: 14px;
	font-weight: bold;
	margin-bottom: 10px;
	letter-spacing: 0.5px;
	transition: all 0.2s ease-in;
	color: #ffffff;
	line-height: 30px !important;
}
.b-button:hover{
	background: #1839cf;
	transition: all 0.2s ease-out;
}

.g-button{ /* Green accent button */
	height: 30px;
	padding: 0 24px 3px;
	border-radius: 30px;
	background: #32c21f;
	border: none;
	font-family: "Helvetica Neue";
	font-size: 14px;
	font-weight: bold;
	margin-bottom: 10px;
	letter-spacing: 0.5px;
	transition: all 0.2s ease-in;
	color: #ffffff;
	box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.13);
}
.g-button:hover{
	background: #35e23e;
	transition: all 0.2s ease-out;
	box-shadow: 0 5px 4px 0 rgba(0, 0, 0, 0.13);
}

.w-button{ /* Grey accent button */
	height: 30px;
	padding: 0 24px 3px;
	border-radius: 30px;
	background: #e3e3e3;
	border: none;
	font-family: "Helvetica Neue";
	font-size: 14px;
	font-weight: bold;
	margin-bottom: 10px;
	letter-spacing: 0.5px;
	transition: all 0.2s ease-in;
	color: #717171;
}
.w-button:hover{
	background: #efefef;
	transition: all 0.2s ease-out;
}

/* Text and input */

.l-text{
	width: 360px;
	outline: none;
	font-family: "Calibri";
	font-size: 16px;
	line-height: 21px;
	color: #272727;
	border: solid 1.5px #a3a3a3;
	border-radius: 5px;
	padding: 2px 4px;
	text-align: center;
}

.m-text{
	width: 165px;
	outline: none;
	font-family: "Calibri";
	font-size: 16px;
	line-height: 21px;
	color: #272727;
	border: solid 1.5px #a3a3a3;
	border-radius: 5px;
	padding: 2px 4px;
	text-align: center;
}
.sm-text{
	width: 126px;
	outline: none;
	font-family: "Calibri";
	font-size: 16px;
	line-height: 21px;
	color: #272727;
	border: solid 1.5px #a3a3a3;
	border-radius: 5px;
	padding: 2px 4px;
	text-align: center;
}

.s-text{
	width: 68px;
	outline: none;
	font-family: "Calibri";
	font-size: 16px;
	line-height: 21px;
	color: #272727;
	border: solid 1.5px #a3a3a3;
	border-radius: 5px;
	padding: 2px 4px;
	text-align: center;
}

.l-select{
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	width: 360px;
	cursor: pointer;
	font-family: "Calibri";
	font-size: 16px;
	line-height: 21px;
	color: #272727;
	border: none;
	border-radius: 5px;
	padding: 2px 14px;
	text-align: center;
	position: relative;
	background: -webkit-linear-gradient(#f5f5f5 0%, #c4c4c4 100%) !important;
	text-align: center;
}

.m-select{
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	width: 165px;
	cursor: pointer;
	font-family: "Calibri";
	font-size: 16px;
	line-height: 21px;
	color: #272727;
	border: none;
	border-radius: 5px;
	padding: 2px 14px;
	text-align: center;
	background: -webkit-linear-gradient(#f5f5f5 0%, #c4c4c4 100%) !important;
}

.s-select{
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	width: 68px;
	cursor: pointer;
	font-family: "Calibri";
	font-size: 16px;
	line-height: 21px;
	color: #272727;
	border: none;
	border-radius: 5px;
	padding: 2px 4px;
	text-align: center;
	background: -webkit-linear-gradient(#f5f5f5 0%, #c4c4c4 100%) !important;
	text-align: center;
}

select{
	background-color: #ededed;
	outline: none;
}
.text-area{
	width: 360px;
	max-width: 360px;
	min-height: 136px;
	max-height: 300px;
	font-family: "Calibri";
	font-size: 16px;
	line-height: 21px;
	color: #272727;
	outline: none;
	border: solid 1.5px #a3a3a3;
	border-radius: 5px;
	padding:  12px;
	text-align: left;
}

.search{
	width: 164px;
	height: 30px;
	outline: none;
	font-family: "Calibri";
	font-style: italic;
	font-size: 16px;
	line-height: 21px;
	color: #272727;
	border: none;
	border-radius: 30px;
	padding: 2px 4px;
	text-align: center;
	background: url(../images/search.svg) no-repeat;
	background-position: right center;
	background-position-x: 134px;
	background-color: white;
}

input[type=checkbox]{
	margin: 0 10px 5px 0;
}



/* Rating - stars */

.stars-line{
	width: 90px;
	overflow: hidden;
	height: 14px;
}

.star{
	width: 14px;
	height: 14px;
	display: inline-block;
	background: url(../images/star-g.svg) no-repeat;
}

.star-y{
	background: url(../images/star-y.svg) no-repeat !important;
}

.profile-info{
	display: inline-block;
}

.s-profile img{
	margin-right: 9px;
}

.s-profile{
	display: inline-block;
}

.s-profile p{
	position: relative;
	bottom: 4px;
	font-style: italic;
}

.main-text{
	padding: 29px 36px 16px;
}

.text-with-hr{
	padding: 6px 36px;
	font-style: italic;
}


/* HR */

.header-hr{
    position: relative;
}

.hr{
	width: 100%;
	margin: 0;
	border-top: 1px solid #e3e3e3;
}

.header-hr h5{
    position: absolute;
    top: -10px;
    background: #fff;
    padding-right: 10px;
}

.header-hr h3{
    position: absolute;
    top: -13px;
    background: #fff;
    padding-right: 10px;
}

/* Avatar */

.l-avatar{
	position: relative;
	width: 81px;
	height: 81px;
	border-radius: 100px;
	background: green;
	display: inline-block;
}

.m-avatar{
	position: relative;
	width: 49px;
	height: 49px;
	border-radius: 100px;
	background: green;
	display: inline-block;
}

.s-avatar{
	position: relative;
	width: 31px;
	height: 31px;
	border-radius: 100px;
	background: green;
	display: inline-block;
}

.l-online{
	position: absolute;
	bottom: 3px;
	right: 3px;
	background: #2ed555;
	border: 3px solid white;
	width: 18px;
	height: 18px;
	border-radius: 100px;
}

.m-online{
	position: absolute;
	bottom: 0px;
	right: 0px;
	background: #2ed555;
	border: 3px solid white;
	width: 16px;
	height: 16px;
	border-radius: 100px;
}

.s-online{
	position: absolute;
	bottom: -1px;
	right: -1px;
	background: #2ed555;
	border: 2px solid white;
	width: 12px;
	height: 12px;
	border-radius: 100px;
}






/* Support */

.inline{
	display: inline-block;
}

.block{
	display: block;
}


/* MAIN*/

/* Header */

.header{
	background: white;
	top: 0;
	width: 100%;
	height: 64px;
	box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.03);
	text-align: center;
	line-height: 64px;
	position: fixed;
	z-index: 9998;
}

#menu img{
	width: 28px;
	height: 28px;
	position: relative;
	top: 18px;
	float: right;
	margin: 0 14px 0 0;
}

.header-center{
	display: block;
	margin: auto;
	width: 90%;
	max-width: 940px;
	height: 100%;
}

#reg3{
	display: inline-block;
	float: right;
	position: relative;
	top: 16px;
}

.menu-blocks{
	height: 64px;
	float: right;
}

.main-block{
	position: relative;
	top: 64px;
	padding: 0 0 128px 128px;
}

.logo{
	position: relative;
	display: inline-block;
	margin: auto;	
	float: left;
	margin-right: 64px;
	bottom: 2px;
}

.logo img{
	width: 100px;
	height: 18px;
	top: 24px;
	position: relative;
}

.logo2 img{
	width: 100px;
	height: 18px;
	position: relative;
}

.logo:hover{
	opacity: 0.75;
}



.top-menu{
	display: inline-block;
	width: auto;
}

.top-menu li{
	display: inline-block;
	margin: 0 4px;
}

.top-menu h5{
	transition: all 0.3s ease-in;
	font-size: 16px;
	letter-spacing: 0.5px;
}

.top-menu h5:hover{
	cursor: pointer;
	color: #3254EF;
	transition: all 0.3s ease-out;
}

.top-menu-actived{
	opacity: 0.5;
}

/* Start */

.land{
	padding-top: 64px;
	background: url(../images/land_background.jpg) no-repeat;
	background-size: cover;
	background-attachment: fixed;
	overflow-x: hidden;

}

.land-hello{
	padding-top: 62px;
	text-align: center;
	overflow-y: hidden;	
	height: auto;
	padding-bottom: 42px;
}

.land-hello h1{
	color: white;
}

.land-hello p{
	margin-bottom: 24px;
	color: white;
}

#mac-photo{
	position: relative;
	top: 55px;
	width: 100%;
	transform: scale(1.1);	
}

.stat{
	background: white;
	text-align: center;
	padding-top: 120px;
	padding-bottom: 78px;
}

.stat h1{
	margin-bottom: 4px;
	line-height: 40px;
}

.thing-group{
	padding: 55px 0;
	background: #f6f6f6;
}

.thing-left, .thing-right{
	padding: 70px 0;
}

.thing-left h2, .thing-left p{
	padding-left: 30px;
}

.thing-right h2, .thing-right p{
	padding-right: 30px;
}

.final{
	text-align: center;
	padding: 115px 0 103px 0;
	background: url(../images/land_f_background.jpg) no-repeat;
	background-size: cover;
	background-attachment: fixed;
}

.final input[type=button]{
	display: block;
	margin: auto;
}

.final h1{
	color: white;
}

.final p{
	margin-bottom: 18px;
	color: white;
}

.footer{
	background: #272727;
	padding: 41px 0 29px 0;
}

.footer img{
	display: block;
	margin: auto;
	margin-bottom: 24px;
}

.footer p{
	color: white;
}

.footer li{
	display: inline-block;
	margin: 0 12px;
}

.footer ul{
	display: block;
	margin: auto;
	text-align: center;
	margin-bottom: 24px;
}

.underfooter{
	background: #272727 ;
	height: 29px;
	border-left:  1px solid #535353;
	border-top: 1px solid #535353;
	border-bottom: 1px solid #535353;
	line-height: 30px;
}

.underfooter h6{
	line-height: 26px;
	vertical-align: middle;
	border-left:  1px solid #434343;
	border-right:  1px solid #434343;
	text-align: center;
	transition: all 0.2s ease-in;
}

.underfooter h6:hover{
	background: #353535;
	cursor: pointer;
	transition: all 0.2s ease-out;
}

.underfooter p{
	font-size: 10px;
	line-height: 14px;
	vertical-align: middle;
	border-left:  1px solid #535353;
	border-right:  1px solid #535353;
	text-align: left;
	color: #535353;
	padding-left: 14px;
}

.over-dragon input[type=button]{
	float: left;
	margin-right: 14px;
}

.over-dragon input[type=text]{
	float: right;
}

.over-dragon a{
	border: none;
	color: #ffffff;
	opacity: 0.75;
	font-style: italic;
	float: left;
	line-height: 30px;
	vertical-align: middle;
	padding: 0 3px;
}

.over-dragon a:hover{
	opacity: 1;

}

.background{
	position: absolute;
	background: #3172bb;
	height: 60px;
	width: 100%;
}


.main{
	text-align: center;
	padding-top: 120px;
	padding-bottom: 0px;
	background: #3172bb;
}

.main h1{
	margin-bottom: 16px;
	line-height: 40px;
	color: white;
}

.main p{
	margin-bottom: 22px;
	color: white;
	max-width: 500px;
	display: block;
	margin: auto;
}

.main li{
	display: inline-block;
}

.main-2{
	text-align: center;
	padding-top: 120px;
	padding-bottom: 54px;
	background: #efefef;
}

.main-2 h1{
	margin-bottom: 16px;
	line-height: 40px;
}

.main-2 p{
	margin-bottom: 54px;
	max-width: 500px;
	display: block;
	margin: auto;
}

.main-2 li{
	display: inline-block;
}

.slide-button-group{
	display: block;
	margin: auto;
	padding-top: 6px;
	margin-bottom: 36px;
}

.slide-button{
	background: white;
	width: 8px;
	height: 8px;
	border-radius: 50px;
}

.sb-active{
	background: #2240c7;
}



.dragon{
	background: #f0f0f0;
}

.father{
	overflow: hidden;
	border-radius: 10px;
	box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.18);
	background: #f6f6f6;
}

.left-block{
	background: white;
	display: inline-block;
	float: left;
	width: 70%;
	padding-bottom: 14px;
}

.center-block{
	background: white;
	display: block;
	padding-bottom: 14px;
}

.right-block{
	background: #f6f6f6;
	display: inline-block;
	float: right;
	width: 30%;
}

.right-small{
	padding: 6px 14px;
}

.right-main{
	padding: 18px 14px;
}

.right-main select{
	margin-top: 4px;
}


.right-main select{
	width: 90%;
	margin-bottom: 18px;	
}

.right-main input[type=button]{
	display: block;
	margin: auto;
}


.empty
{
	height: 57px;
	width: 100%;
	display: block;
	background: #f0f0f0;
}

.say{
	padding: 29px 36px 16px;
}

.say h3{
	width: 90%;
	text-align: left;
	display: inline-block;
}

.say h2{
	width: 90%;
	text-align: left;
	display: inline-block;
}

.say-info{
	display: inline-block;
	float: right;
	width: 10%;
	height: 40px;
}

.say-info p{
	text-align: right;
}



.down-say a{
	float: left;
	padding-top: 6px;
	margin-right: 11px;
}

.ver-hr{
	height: 28px;
	background: #e3e3e3;
	width: 1px;
	display: inline-block;
	margin-right: 8px;
}

.tag{
	border: 1.5px solid #272727;
	border-radius: 5px;
	display: inline-block;
	float: right;
	padding: 1px 6px;
	margin: 0 4px;
	font-style: italic;
	color: #272727;
	cursor: pointer;
	transition: all 0.2s ease-in;
}

.tag:hover{
	transition: all 0.2s ease-out;
}


.tender{
	border: 1.5px solid #3254ef;
	color: #3254ef;
}
.tender:hover{
	background: #3254ef;
	color: white;
}

.safe{
	border: 1.5px solid #18bc22;
	color: #18bc22;
}
.safe:hover{
	background: #18bc22;
	color: white;
}

.ground{
	border: 1.5px solid #28c1c7;
	color: #28c1c7;
}
.ground:hover{
	background: #28c1c7;
	color: white;
}

.down-say-right{
	display: inline-block;
	float: right;
	padding-top: 6px;
}

.left{
	float: left;
}

.right{
	float: right;
}

.support-zone{
	padding: 12px 36px;
}


.red{
	color: red;
}

.no-dec h3{
	transition: all 0.1s ease-in;
}

.no-dec h3:hover{
	color: #595959;
	transition: all 0.1s ease-in;
}
.no-dec{
	text-decoration: none;
	border: none;
	cursor: pointer;
}

.no-dec:hover{
	text-decoration: none;
	border: none;
}

.retry{
	padding: 12px 36px;
}

.retry h5{
	margin-bottom: 2px;
}

.inline{
	display: inline-block;
	margin-right: 14px;
}

.block{
	display: block;
}

.comment{
	padding: 26px 36px;
}

.comment-profile-info{
	display: inline-block;
	position: relative;
	bottom: 0px;
}

.comment-profile-info a{
	position: relative;
	top: 4px;
}

.comment-up-left img{
	margin-right: 14px;
}

.comment-up-right{
	display: inline-block;
	width: 124px;
	float: right;
}



.comment-up-left{
	display: inline-block;
	width: 300px;
	float: left;
}

.money-time{
	padding: 4px 16px 3px;
	background: #f0f0f0;
	border-radius: 5px;
}

.status{
	font-style: italic;
	color:  #c1c1c1;
	font-size: 14px;
	text-align: center;
}



.comment-down p{
	display: inline-block;
	float: right;
	font-style: italic;
	opacity: 0.75;
}

.comment-down a{
	margin: 0 4px 6px;
}

.new-quest{
	background: white;
	border-radius: 10px;
	box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.05);
	padding: 45px 0px;
}

.m-b{
	padding-bottom: 14px;
}

.grey{
	color: #959595;
}

.new-quest-center{
	width: 360px;
	display: block;
	margin: auto;
}

.new-quest-center h5{
	margin-bottom: 8px;
}

.line{
	width: 180px;
	display: inline-block;
	padding: 18px 18px 26px 24px;
	margin-right: 32px;
}

.italic{
	font-style: italic;
}
.clear { clear: both; display: block; height: 0; line-height: 0; overflow: hidden; font-size: 0; }

.center{
	display: block;
	margin: auto;
}

.comment-profile-info p{
	opacity: 0.6;
}

.functional{
	width: 100%;
	display: block;
	padding: 0 16px;
}

.functional a{
	margin: 0 4px;
	display: inline-block;
	margin-bottom: 6px;
}

.prof-main{
	padding: 26px 
}


.m-r{
	margin-right: 14px;
}

.m-b{
	margin-bottom: 4px;
}

.green{
	color: #3add1d;
}

.reg-wrapper-group{
	width: 100%;
	height: 100%;
	position: fixed;
	background: rgba(0, 0, 0, 0.20);
	z-index: 600;
}

.wr-background{
	z-index: 599;
	background: rgba(0,  0,  0, 0.5);
	width: 100%;
	height: 100%;
	position: fixed;
	top: 10%;
}

.reg-wrapper{
	width: 360px;
	background: white;
	z-index: 600;
	box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.15);
	display: block;
	margin: auto;
	border-radius: 10px;
	position: relative;
	top: 5%;
	padding: 32px 40px;
	overflow: hidden;
	height: 430px;
}

.toggle{
	background: #e3e3e3;
	font-family: "Calibri";
	font-size: 16px;
	line-height: 21px;
	color: #272727;
	border: none;
	padding: 8px 14px;
	display: inline-block;
	float: left;
}

.toggle-left{
	border-radius: 5px 0px 0px 5px;
}
.toggle-right{
	border-radius: 0px 5px 5px 0px;
}

.toggle-actived{
	background: #717171;
	color: #ffffff;
	cursor: auto;
}

.wrapper-toggle{
	display: block;
	margin: auto;
	width: 180px;
}



.log-info{
	width: 166px;
	display: block;
	margin: auto;
	padding: 18px 0 0 0;
	position: relative;
	right: 400px;
}

.log-info h5{
	padding-bottom: 4px;
}

.log-info input[type=email]{
	margin-bottom: 10px;
}

.log-info input[type=password]{
	margin-bottom: 20px;
}

.reg-info{
	position: relative;
	bottom: 199px;
	left: 400px;
}
	
.log-info a{
	position: relative;
	width: 111px;
	display: block;
	margin: auto;
}

.reg-info-wide{
	width: 50%;
	display: inline-block;
	float: left;
}


.reg-info input[type=radio]{
	margin-right: 10px;
}

input[type=radio]{
	margin-right: 10px;
}

.reg-info-center{
	width: 165px;
	display: block;
	margin: auto;
}

.reg-info-center input{
	margin-bottom: 10px;
}

.reg-info-center h5{
	margin-bottom: 4px;
}

.setup-dragon{
	background: white;
	border-radius: 5px;
	box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.15);
	position: relative;
	padding: 25px 60px ;
}

.wrapper-toggle-setup{
	display: block;
	margin: auto;
	width: 207px;
}

.toggle-setup{
	background: #e3e3e3;
	font-family: "Calibri";
	font-size: 16px;
	line-height: 21px;
	color: #272727;
	border: none;
	padding: 8px 14px;
	display: inline-block;
	float: left;
	cursor: pointer;
}

.toggle-left{
	border-radius: 5px 0px 0px 5px;
}
.toggle-right{
	border-radius: 0px 5px 5px 0px;
}

.toggle-actived-setup{
	background: #717171;
	color: #ffffff;
	cursor: auto;
}

.reg-wrapper{
	top: 92px;
}

.file-left{
	width: 81px;
	display: inline-block;
	margin-right: 15px;
}

.file-right{
	width: 60%;
	display: inline-block;
}

.file-right input{
	position: relative;
	bottom: 38px;
	font-family: "Calibri";
	font-size: 16px;
	line-height: 21px;
	color: #272727;
}

.blue h5{
	color: #3254ef;
}

.retry h5{
	margin-bottom: 5px;
}

.low{
	margin: 10px 0 20px !important;
}

.b-info{
	display: none;
	width: 450px;
	margin: auto;
}

.c-info{
	display: block;
	width: 450px;
	margin: auto;
}

.notif-group{
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.26);
	position: fixed;
	z-index: 700;
}

.notif{
	width: 360px;
	background: white;
	height: 80%;
	overflow-y: scroll;
	position: relative;
	border-radius: 10px;
	display: block;
	margin: auto;
	top: 92px;
}

.notif h2{
	padding: 11px 16px;
	text-align: left;
}

.notif-up{
	width: 100%;
	display: block;
}

.notif-down{
	width: 100%;
	display: block;
}

.notif-block{
	padding: 14px 16px;
}

.notif-down p{
	text-align: right;
}

.notif-down a{
	float: left;
}

.more-notif{
	width: 97px;
	display: block;
	margin: auto;
}

.chat-zone{
	position: fixed;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.20);
	z-index: 700;
}

.chat{
	height: 564px;
	width: 750px;
	display: block;
	margin: auto;
	border-radius: 10px;
	overflow: hidden;
	position: relative;
	top: 92px;
}

.chat-left{
	background: white;
	height: 100%;
	width: 262px;
	display: inline-block;
	float: left;
	overflow-y: scroll;
}

.chat-right{
	background: grey;
	height: 100%;
	width: 488px;
	display: inline-block;	
}

.chat h2 {
	padding: 4px 27px;
}

.chat-left img{
	position: relative;
	top: 6px;
}

.prof-main-2{
	padding: 11px 27px; 
	transition: all 0.05s ease-in;
}

.prof-main-2:hover{
	background: rgba(0, 0, 0, 0.08);
	transition: all 0.01s ease-in-out;
	cursor: pointer;
}

.chosen{
	background: rgba(0, 0, 0, 0.05);
	cursor: auto;
}


.chat-up{
	overflow-y: scroll;
	max-height: 435px;
}

.left-message{
	width: 80%;
	display: block;
	float: left;
	margin-bottom: 10px;
	background: white;
	padding: 16px 10px;
	border-radius: 10px 10px 10px 0px;
	position: relative;
	left: 14px;
}


.left-message h6{
	text-align: right;
}

.right-message h6{
	text-align: right;
}

.right-message{
	width: 80%;
	display: block;
	float: right;
	margin-bottom: 10px;
	background: #f0ffd0;
	padding: 16px 10px;
	text-align: left;
	border-radius: 10px 10px 0px 10px;
	position: relative;
	right: 14px;
}

.chat-right{
	background: url(../images/pattern.png);
	background-repeat: repeat;
}

.chat-down{
	height: 160px; 
	width: 488px;;
	background: #f0f0f0;
	vertical-align: bottom;
	position: relative;
	bottom: 150px;
	float: right;
	box-shadow: 6px 0px 5px rgba(0, 0, 0, 0.15);
	padding: 15px 18px;
}

.chat-down textarea{
	background: white;
	width: 85%;
	border: none;
	border-radius: 10px;
	display: inline-block;
	padding: 12px 12px;
	max-width: 85%;
	min-width: 85%;
	min-height: 100px;
	max-height: 100px;
	display: inline-block;
	float: left;
	margin-right: 20px;
}

.chat-down img:hover{
	position: relative;
	opacity: 0.8;	
	cursor: pointer;
}

.chat-down img{
	position: relative;
	cursor: pointer;
	position: relative;
	top: 24px;
}

.bon-func{
	height: 24px;
	width: 100%;	
}

.bon-func select{
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	width: 80%;
	cursor: pointer;
	font-family: "Calibri";
	font-size: 14px;
	line-height: 21px;
	color: #272727;
	border: none;
	border-radius: 5px;
	padding: 2px 4px;
	text-align: center;
	position: relative;
	background: none;
}

.small-profile{
	width: 151px;
	padding: 12px 14px 0;
	display: block;
	overflow: hidden;
	height: 64px;

}

.small-profile img{
	display: inline-block;
}

.small-profile h5{
	display: inline-block;
	vertical-align: middle;
	position: relative;
	bottom: 10px;
	cursor: auto;
	max-width: 86px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;

}

.small-profile:hover{
	background: #f0f0f0;
}


.long-menu{
	width: 151px;
	background: #ffffff;
	position: relative;
	box-shadow: 0px 10px 10px rgba(0, 0, 0, 0.15);
}

.long-menu a{
	color: #333;
	border: none;
}

.long-menu p{
	border: none;
	color: #333;
	padding: 7px 14px;
	cursor: pointer;
	text-align: left;
}


.long-menu p:hover{
	background: #f0f0f0;
}

.ver-menu{
	overflow: hidden;
	height: 64px;
}

.ver-menu:hover{
	overflow: visible;
}

.new-message{
	display: inline-block;
	height: 64px;
	width: 40px;
	position: relative;
	float: right;
	margin: 0 24px 0 0;
}

.new-message img{
	position: relative;
	top: 5px;

}

.new-message img:hover{
	opacity: 0.7;
	cursor: pointer;
}

.preview{
	width: 165px;
	height: 165px;
}

.pc_hidden{
	display: none !;
}

#menu{
	display: none;
	transition: all ease-out 0.1s;

}

#mobilemenu{
	padding-top: 20%;
	display: block;
	margin: auto;
	position: fixed;
	width: 100%;
	height: 100%;
	z-index: 49;
	background: -webkit-linear-gradient(#0e7adf 0%, #1696e4 100%);
	display: none;
	top: 64px;
}

.mobilemenu-center{
	width: 80%;
	height: auto;
	display: block;
	margin: auto;
	max-width: 800px;
}

#mobilemenu a{
	font-family: "Helvetica Neue";
	font-size: 20px;
	font-weight: bold;
	margin-bottom: 6px;
	line-height: 22px;
	color: #ffffff;
	border: none;
	display: inline-block;
	float: left;
	margin-right: 14px;
	letter-spacing: 1px;
}

.big a{
	font-family: "Helvetica Neue" !important;
	font-size: 4em !important;
	font-weight: bold !important;
	letter-spacing: 0.7px !important;
	margin-bottom: 16px !important;
	line-height: 0.8em !important;
	color: #ffffff !important;
	border: none;
	display: block;
}





.nohide{
	display: block !important;
}

.rot{
	position: relative;
	transition: all ease-in 0.1s;
	opacity: 0.25;
}

#closy img{
	position: fixed;
	display: block;
	width: 10%;
	height: 10%;
	min-width: 64px;
	min-height: 64px;
	margin: auto;
	top: 15%;
	z-index: 10000;
	right: -25%;
	transition: all ease-out 0.2s;
}

.showclosy img{
	right: 5% !important;
	transition: all ease-in 0.2s;
}


#userschat img{
	position: fixed;
	display: block;
	width: 10%;
	height: 10%;
	min-width: 64px;
	min-height: 64px;
	margin: auto;
	top: 15%;
	z-index: 10000;
	left: -25%;
	transition: all ease-out 0.2s;
}

.showusers img{
	left: 5% !important;
	transition: all ease-in 0.2s;
}


@media screen and (max-width: 1200px) {



.underfooter{
	background: #272727;
	height: auto;
	border: none !important;
	line-height: 30px;
}

.underfooter h6{
border: none;
}

.underfooter p{
	border: none;
}

.underfooter p{
	text-align: center;
	padding-top: 24px;
}

}

@media screen and (max-width: 980px) {
	
.b-button{
	display: none !important;
}

.reg-info{
	padding-top: 32px;
}

#menu{
	display: inline-block;
	float: right;
}

.mob_hidden{
	display: none;	
}

.top-menu{
	display: none;
}

.stat{
	background: white;
	text-align: center;
	padding-top: 24px !important;
	padding-bottom: 24px !important;
}

.stat ul{
	margin-bottom: 14px;
}

.land-hello p{
	width: 70%;
	display: block;
	margin: auto;
	margin-bottom: 32px;
}

.preview{
	width: 165px;
	height: 165px;
	display: block;
	margin: auto;
	margin-bottom: 24px;
}

.thing-group{
	padding: 42px !important;
}

.thing-group{
	padding: 10px 0;
	background: #f6f6f6;
}

.thing-left, .thing-right{
	padding: 10px 0;
	display: block;
}

.thing-left h2, .thing-left p{
	padding-left: 0px;
}

.thing-right h2, .thing-right p{
	padding-right: 0px;
}

.thing-group img{
	display: none;
}

.left-block{
	background: white;
	display: inline-block;
	float: none;
	width: 100%;
	padding-bottom: 14px;
}

.l-text, .m-text{
	width: 100% !important;
}

.text-area{
	width: 90%;
	max-width: none !important;
	min-height: none !important;
	max-height: none !important;
	min-width: none !important;
	font-family: "Calibri";
	font-size: 16px;
	line-height: 21px;
	color: #272727;
	outline: none;
	border: solid 1.5px #a3a3a3;
	border-radius: 5px;
	padding:  12px;
	text-align: left;
}



.right-block{
	background: #f6f6f6;
	display: inline-block;
	float: none;
	width: 100%;
	
}

.over-dragon input[type=button]{
	float: none;
	display: block;
	margin: auto;
	position: relative;
	bottom: 14px;
}

.father{
	margin-top: 6px;
}

.search{
	min-width: 100%;
	background: none;
	background-position: right center;
	background-position-x: 134px;
	background-color: white;
}

.comment-up-left img{
	margin-right: 0 !important;
}

.comment-up-right{
	display: inline-block;
	width: 124px;
	float: right;
}


.comment-up-left{
	display: inline-block;
	width: 170px;
	float: left;
}


.s-profile{
	width: 100%;
	float: none;
}
.down-say-right{
	width: 100%;
	float: none;
}

.say-info{
	float: none !important;
	width: 10%;
	display: block;
	height: 40px;
}

.say-info{
	display: block;
	width: 100%;
	height: auto;
}

.s-profile{
	width: auto;
	height: auto;
}

.say, .main-text, .retry, .comment{
	padding: 24px 12px;
}

.text-with-hr{
	padding: 12px;
}

.chat-left{
	position: fixed;
	z-index: 49;
	width: 100%;
	right: 0;
	display: none;
	margin: auto;
}

.chat-left-normal{
	display: block;
}

.chat-right{
	display: block;
	margin: auto;
	width: auto;
	height: 100%;
}

.s-profile br{
	display: none;
}

.chat{
	position: fixed;
	display: block;
	margin: auto;
	top: 64px;
	border-radius: 0;
	height: 90%;
	width: 100%;
	padding-bottom: 64px;
}

.chat-down{
	float: none;
	position: fixed;
	bottom: 0;
}

.chat-up{
	max-height: 90%;
}

.chat-down{
	width: 100%;
}


.say h2, .say h3{
	width: 100%;
}

.say-info p{
	display: inline-block;
}

.tag{
	float: left;
}

.line{
	width: 40% !important;
	height: auto;
	display: inline-block;
	float: none !important;
	padding: 14px 14px 24px 14px;
}



.notif-group{
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.26);
	position: fixed;
	z-index: 700;
}

.notif{
	width: 100%;
	background: white;
	height: 100%;
	overflow-y: scroll;
	position: relative;
	border-radius: 10px;
	display: block;
	margin: auto;
	top: 64px;
	border-radius: 0;
}

.notif h2{
	padding: 11px 16px;
	text-align: left;
}

.notif-up{
	width: 100%;
	display: block;
}

.notif-down{
	width: 100%;
	display: block;
}

.notif-block{
	padding: 14px 16px;
}

}

@media screen and (max-width: 400px) {
	
h1{
	font-size: 24px;
	line-height: 28px;
}
	
a{
	display: block;
    width: intrinsic;
    width:-moz-fit-content;
    width:-webkit-fit-content;
    width:fit-content;
	box-sizing: border-box;
	border: none;
}

.land-hello p{
	width: 100%;
}

a:hover{
	border: none;
}

.a-dash{
	border: none;
}



.a-dash:hover{
	border: none;
}

tr{
	width: 100%;
}


.comment-up-left{
	float: none;
	margin-bottom: 24px;
}

.chat-down textarea{
	width: 100% !important;
	max-width: 100% !important;
	min-width: 100% !important;
	float: none !important;
}

.chat-down img{
	width: 100%;
}

.inline, .m-text, .l-text{
	display: block !important;
	width: 100% !important;
	max-width: 100% !important;
	min-width: 100% !important;
}

.comment-up-left, .line{
	width: 100% !important;
	margin-bottom: 0;
	padding-bottom: 6;
}

.left-block{
	padding: 12px 0;
}

.new-quest{
	width: 100%;
}

.new-quest-center{
    width: intrinsic;
    width:-moz-fit-content;
    width:-webkit-fit-content;
    width:fit-content;
	  box-sizing: border-box;
}

h2{
	font-size: 18px;
	line-height: 22px;
}

.comment-up-left{
	margin-bottom: 24px;
}

.right-block{
	padding-bottom: 12px;	
}

.m-text{
	width: 100% !important;
}

.text-area{
	width: 100%;
}

.retry{
	width: 250px;
}

.m-b{
	margin-bottom: 0;
}

.right-main{
	padding-bottom: 0;
}

.comment-up-right{
	float: none;
}

.setup-dragon{
	padding: 12px 0;
}

.big a{
	font-size: 38px !important;
}

.reg-wrapper{
	width: 100% !important;
	top: 92px;
}

}

