/* imports */
/* -------------------------------------------------------------------------------------------------------------------- */

@font-face {
	font-family: Roboto;
	src: url(../fonts/Roboto-Regular.ttf);
}

@font-face {
	font-family: Roboto Light;
	src: url(../fonts/Roboto-Light.ttf);
}

@font-face {
	font-family: Roboto Bold;
	src: url(../fonts/Roboto-Bold.ttf);
}

@font-face {
	font-family: Beaufort;
	src: url(../fonts/Beaufort.otf);
}

@font-face {
	font-family: Beaufort Bold;
	src: url(../fonts/Beaufort-Bold.ttf);
}

/* settings */
/* -------------------------------------------------------------------------------------------------------------------- */

html, body, header, nav, section, aside, article, footer, div,
span, applet, object, iframe, p, blockquote, pre, a, abbr, acronym,
address, big, cite, code, del, dfn, img, ins, kbd, q, s, samp, small,
strike, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form,
label, legend, table, caption, tbody, tfoot, thead, tr, th, td{
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: Roboto;
	color: #5f554c;
}

*{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

a{
	text-decoration: none;
	color: #6193ec;
}

/* inputs */
/* -------------------------------------------------------------------------------------------------------------------- */

input, button, select, textarea {outline: none;}

::-webkit-input-placeholder       {opacity: 1; transition: opacity 0.3s ease;color: #8a7f7f;}
::-moz-placeholder                {opacity: 1; transition: opacity 0.3s ease;color: #8a7f7f;}
:-moz-placeholder                 {opacity: 1; transition: opacity 0.3s ease;color: #8a7f7f;}
:-ms-input-placeholder            {opacity: 1; transition: opacity 0.3s ease;color: #8a7f7f;}
:focus::-webkit-input-placeholder {opacity: 0; transition: opacity 0.3s ease;}
:focus::-moz-placeholder          {opacity: 0; transition: opacity 0.3s ease;}
:focus:-moz-placeholder           {opacity: 0; transition: opacity 0.3s ease;}
:focus:-ms-input-placeholder      {opacity: 0; transition: opacity 0.3s ease;}


.input{
	width: 100%;
	height: 50px;
	position: relative;
	border-radius: 500px;
	overflow: hidden;
	border: 1px solid #e5e5e5;
	background: #f4f4f4;
}

.input-other-account{
	width: 100%;
	height: 50px;
	position: relative;
	border-radius: 500px;
	overflow: hidden;
	border: 1px solid #e5e5e5;
	background: #f4f4f4;
}

.input > .icon{
	width: 50px;
	height: 50px;
	position: absolute;
	left: 0px;
	top: 0px;
	z-index: 2;
	pointer-events: none;
}

.input-other-account > .icon{
	width: 50px;
	height: 50px;
	position: absolute;
	left: 0px;
	top: 0px;
	z-index: 2;
	pointer-events: none;
}

.input > input{
	display: block;
	width: 100%;
	height: 100%;
	background: rgba(255,255,255,0);
	text-align: center;
	border: none;
	font-family: Beaufort;
	font-size: 16px;
	color: #8a7f7f;
	z-index: 1;
}

.input-other-account > input{
	display: block;
	width: 100%;
	height: 100%;
	background: rgba(255,255,255,0);
	text-align: center;
	border: none;
	font-family: Beaufort;
	font-size: 16px;
	color: #8a7f7f;
	z-index: 1;
}

.select{
	width: 100%;
	height: 50px;
	position: relative;
	border-radius: 500px;
	border: 1px solid #e5e5e5;
	background: #f4f4f4;
}

.select > .icon{
	width: 50px;
	height: 50px;
	position: absolute;
	left: 0px;
	top: 0px;
	z-index: 2;
	pointer-events: none;
}

.select > select{
	display: none;
}

.select > .select-selected {
	width: 100%;
	height: 100%;
	
	font-family: Beaufort;
	font-size: 16px;

	overflow: hidden;
	white-space: nowrap;
    text-overflow: ellipsis;
    padding: 0px 50px;
    padding-top: 14px;
    text-align: center;
}

.select > .select-selected:after{
	position: absolute;
	content: "";
	top: calc( 50% - 4px );
	right: 20px;
	width: 13px;
	height: 8px;
	background: url(../images/icon/select_arrow.png) center center;
	opacity: 0.7;
	transition: all .2s ease-in-out;
}

.select > .select-selected.select-arrow-active:after {
	opacity: 1;
}

.select > .select-items div{
	color: #8a7f7f;
	padding: 10px 20px;
	cursor: pointer;
	user-select: none;
	font-size: 14px;
	transition: all .2s ease-in-out;
}

.select > .select-selected {
	color: #8a7f7f;
	cursor: pointer;
	user-select: none;
}

.select > .select-items {
	position: absolute;
	background-color: #ffffff;
	top: calc( 100% + 5px );
	left: 0;
	right: 0;
	z-index: 99;
	border-radius: 10px;
	overflow: hidden;
	box-shadow: 0px 10px 30px rgba(0,0,0,0.1);
}

.select > .select-hide {
	display: none;
}

.select > .select-items div:hover,
.select > .select-items > .same-as-selected {
	background-color: rgba(0, 0, 0, 0.1);
}

.select:hover .item-desc{
	opacity: 1;
	transform: translateY(0px) scale(1, 1) rotate(0deg);
}

.select > .item-desc{
	position: absolute;
	width: 250px;
	background: #fff;
	box-shadow: 0px 5px 30px rgba(0,0,0,0.2);
	border-radius: 5px;
	border-bottom: 2px solid #eca500;
	left: 50px;
	bottom: calc( 100% + 15px );
	padding: 10px;
	pointer-events: none;
	font-size: 12px;
	line-height: 16px;
	color: #8a807f;
	opacity: 0;
	transition: all .5s ease-in-out;
	transform: translateY(-50px) scale(0.6, 0.6) rotate(20deg);
	text-align: center;
}

.select > .item-desc:after{
	content: '';
	width: 26px;
	height: 9px;
	position: absolute;
	bottom: -11px;
	left: calc( 50% - 13px );
	background: url(../images/icon/arrow_bottom_yellow.png);
}

/* flex */
/* -------------------------------------------------------------------------------------------------------------------- */

.flex-sbc{display: flex;flex-wrap: wrap;justify-content: space-between;align-items: center;}
.flex-sbs{display: flex;flex-wrap: wrap;justify-content: space-between;align-items: flex-start;}
.flex-sbe{display: flex;flex-wrap: wrap;justify-content: space-between;align-items: flex-end;}

.flex-cc{display: flex;flex-wrap: wrap;justify-content: center;align-items: center;}
.flex-cs{display: flex;flex-wrap: wrap;justify-content: center;align-items: flex-start;}
.flex-ce{display: flex;flex-wrap: wrap;justify-content: center;align-items: flex-end;}

.flex-sc{display: flex;flex-wrap: wrap;justify-content: flex-start;align-items: center;}
.flex-ss{display: flex;flex-wrap: wrap;justify-content: flex-start;align-items: flex-start;}
.flex-se{display: flex;flex-wrap: wrap;justify-content: flex-start;align-items: flex-end;}

.flex-ec{display: flex;flex-wrap: wrap;justify-content: flex-end;align-items: center;}
.flex-es{display: flex;flex-wrap: wrap;justify-content: flex-end;align-items: flex-start;}
.flex-ee{display: flex;flex-wrap: wrap;justify-content: flex-end;align-items: flex-end;}

/* defoult elements */
/* -------------------------------------------------------------------------------------------------------------------- */

.yellow-grad{
	background: linear-gradient(to top, #ff9500, #feb900);
}

.yellow-grad-text{
	font-family: Beaufort Bold;
	font-size: 20px;
	color: #562200;
	text-shadow: 0px -1px 0px #ffcc75;
}

.yellow-grad-text > span{
	font-family: Beaufort Bold;
	font-size: 20px;
	color: #82330d;
	text-shadow: 0px -1px 0px #ffcc75;
	padding: 0px 6px;
}

.hover-effect:hover{
	filter: brightness(120%);
}

.button{
	height: 46px;
	border-radius: 200px;
	box-shadow: 0px 0px 10px rgba(254,169,0,0.5);
	border: none;
	outline: none;
	cursor: pointer;
	transition: all .2s ease-in-out;
}


/* structure */
/* -------------------------------------------------------------------------------------------------------------------- */

body{
	background: #ececec;
}

.wrapper{
	width: 100%;
	max-width: 1920px;
	min-height: 100vh;
	background: url(../images/bg/bg.webp) top center no-repeat;
	margin: 0 auto;
	overflow-x: hidden;
}

.nav-bg{
	width: 100%;
	margin: 0 auto;
	position: relative;
	z-index: 3;
	background: #ffffff;
}

.nav-bg:before{
	content: '';
	width: 123px;
	height: 90px;
	background: url(../images/bg/nav_front_left.webp);
	position: absolute;
	top: 0px;
	left: calc( 50% - 61.5px - 771px );
	pointer-events: none;
}

.nav-bg:after{
	content: '';
	width: 158px;
	height: 149px;
/*	background: url(../images/bg/nav_front_right.webp); */
	position: absolute;
	top: 10px;
	left: calc( 50% - 79px + 610px );
	pointer-events: none;
}

.header-bg{
	width: 100%;
	margin: 0 auto;
	position: relative;
	z-index: 2;
}

.content{
	width: 1240px;
	position: relative;
	z-index: 2;
	margin: 0 auto;
}

/* navigation */
/* -------------------------------------------------------------------------------------------------------------------- */

nav{
	width: 1240px;
	height: 90px;
	position: relative;
	z-index: 2;
	margin: 0 auto;
}

nav > .logo{
	width: 171px;
	height: 50px;
	transition: all .2s ease-in-out;
}

nav > .logo:hover{
	filter: brightness(120%);
}

nav > .nav-links{
	width: calc( 100% - 171px );
}

nav > .nav-links > .links{
	width: calc( 100% - 300px )
}

nav > .nav-links > .links > .link,
nav > .nav-links > .links > .link > .open-dropbox{
	font-family: Roboto Bold;
	color: #51423d;
	font-size: 16px;
	transition: all .2s ease-in-out;
	position: relative;
	cursor: pointer;
}

nav > .nav-links > .links > .link{
}

nav > .nav-links > .links > .link > .open-dropbox{
}

nav > .nav-links > .links > .link:hover,
nav > .nav-links > .links > .link > .open-dropbox:hover{
	color: #ff5f00;
}

nav > .nav-links > .links > .link:not(:last-child){
	margin-right: 45px;
}

nav > .nav-links > .links > .link > .open-dropbox > i{
	font-size: 10px;
	margin-left: 5px;
}

nav > .nav-links > .links > .link > .drop-box{
	width: 250px;
	background: #efece9;
	position: absolute;
	pointer-events: none;
	opacity: 0;
	left: 0px;
	top: -30px;
	transition: all .2s ease-in-out;
	transform: scale(0.8,0.8);
	border-top: 2px solid #ff5f00;
	box-shadow: 0px 10px 30px rgba(0,0,0,0.1)
}

nav > .nav-links > .links > .link > .active{
	display: block;
	opacity: 1;
	top: calc( 100% + 35px );
	pointer-events: auto;
	transform: scale(1,1);
}

nav > .nav-links > .links > .link > .drop-box > a{
	width: 100%;
	padding: 15px 20px;
	font-family: Roboto Bold;
	color: #5d483a;
	font-size: 14px;
	text-transform: uppercase;
	background: rgba(0,0,0,0);
	transition: all .2s ease-in-out;
}

nav > .nav-links > .links > .link > .drop-box > a:hover{
	background: #fcf8f4;
	color: #ff5f00;
}

nav > .nav-links > .links > .link > .drop-box > #arrow {
	content: "";
	width: 0; 
	height: 0;
	position: absolute; 
	top: -12px; 
	left: 25px;
	border-left: 12px solid transparent;
	border-bottom: 12px solid #ff5f00;
	border-right: 12px solid transparent;
}

nav > .nav-links > .cp-button{
	width: 270px;
}

nav > .nav-links > .cp-button > span{
}

nav > .open-nav-button{
	width: 50px;
    height: 50px;
    color: #621c00;
    font-size: 30px;
    border: 1px solid #ffd2ba;
    border-radius: 50px;
    transition: all .2s ease-in-out;
    cursor: pointer;
    background: rgba(255,255,255,0);
    display: none;
}

nav > .open-nav-button > i{
	width: 100%;
	height: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
}

nav > .open-nav-button:hover{
	color: #ffb203;
    border: 1px solid #621c00;
    background: rgb(98, 28, 0);
}

/* user */

nav > .nav-links > .user{
	width: 300px;
	position: relative;
}

nav > .nav-links > .user > .name{
	width: calc( 100% - 90px );
	height: 46px;
	border-radius: 500px;
	position: relative;
	z-index: 2;
}

nav > .nav-links > .user > .name > .text{
	width: calc( 100% - 40px );
	height: 100%;
	padding-left: 15px;
	text-transform: uppercase;
	overflow: hidden;
	white-space: nowrap;
    text-overflow: ellipsis;
    padding-top: 10px;
    transition: all .2s ease-in-out;
}

nav > .nav-links > .user > .name > .text:hover{
	color: #bd1f00;
}

nav > .nav-links > .user > .name > .closed-button{
	width: 46px;
	height: 46px;
	font-size: 30px;
	color: #fff;
	position: absolute;
	right: 0px;
	top: 0px;
	transition: all .2s ease-in-out;
}

nav > .nav-links > .user > .name > .closed-button:hover{
	color: #bd1f00;
}

nav > .nav-links > .user > .balance{
	width: 130px;
	height: 46px;
	background: #eeeeee;
	border-radius: 500px;
	position: absolute;
	z-index: 1;
	top: 0px;
	right: 0px;
	padding-left: 35px;
	font-family: Beaufort Bold;
	font-size: 20px;
	color: #ff7200;
}

nav > .nav-links > .user > .balance > img{
	margin-right: 8px;
}

nav > .nav-links > .user > .balance > span{
	display: none;
	font-family: Beaufort Bold;
	font-size: 20px;
	color: #ff7200;
	margin-left: 5px;
}

/* header */
/* -------------------------------------------------------------------------------------------------------------------- */

header{
	width: 1240px;
	position: relative;
	z-index: 2;
	margin: 0 auto;
}

header > .status-server{
	width: 100%;
	margin-top: 35px;
	margin-bottom: 25px;
}

header > .status-server > .icon{
	width: 179px;
	height: 173px;
	margin: 0 auto;
}

header > .status-server > .icon > img{
	width: 100%;
	height: 100%;
}

header > .status-server > .status{
	width: 100%;
	text-align: center;
	font-family: Beaufort;
	font-size: 24px;
	color: #a22400;
	margin-top: 10px;
}

header > .status-server > .status > span{
	font-family: Beaufort;
	font-size: 24px;
	color: #fda301;
}

header > .status-server > .timer{
	width: 100%;
	text-align: center;
	font-family: Beaufort Bold;
	font-size: 46px;
	color: #562200;
	margin-top: -5px;
}

header > .buttons{
	width: 100%;
	margin-bottom: 40px;
}

header > .buttons > .start-button{
	height: 56px;
	padding: 0px 35px;
	font-size: 24px;
	margin-left: 8px;
	margin-right: 8px;
	margin-bottom: 14px;
}

header > .buttons > .reg-button{
	height: 57px;
	padding: 0px 20px;
	font-size: 24px;
	margin-top: -4px;
	margin-left: 8px;
	margin-right: 8px;
	margin-bottom: 10px;
	font-family: Beaufort;
	color: #562200;
	border: 2px solid #ff9500;
}

header > .buttons > .reg-button:hover{
	color: #ad2f02;
	border: 2px solid #ff6666;
}

/* content */
/* -------------------------------------------------------------------------------------------------------------------- */

.slider{
	width: 100%;
	height: 220px;
	background: #4c2916;
	border-radius: 5px;
	border-bottom: 3px solid #ff9c00;
	box-shadow: 0px 0px 30px rgba(0,0,0,0.1);
}

.slider-block{
	width: 100%;
	height: 100%;
	overflow: hidden;
	position: relative;
}

.slider-block .slider-line{
	display: flex;
	width: initial;
	height: 100%;
}

.slider-block .slider-line .slider-slide{
	height: 100%;
	align-self: stretch;
	padding: 30px;
	border-radius: 5px;
}

.slider-block .slider-nav{
	width: 100%;
	display: flex;
	flex-wrap: nowrap;
	justify-content: flex-start;
	align-items: center;
	position: absolute;
	bottom: 15px;
	padding-left: 19px;
}

.slider-block .slider-nav .perv{
	width: 20px;
	color: #fff;
	font-size: 20px;
	cursor: pointer;
	margin: 5px;
	display: flex;
	flex-wrap: nowrap;
	justify-content: center;
	align-items: center;
	opacity: 0.4;
}

.slider-block .slider-nav .perv:hover{
	opacity: 1;
	color: #fcbe00;
}

.slider-block .slider-nav .next{
	width: 20px;
	color: #fff;
	font-size: 20px;
	cursor: pointer;
	margin: 5px;
	display: flex;
	flex-wrap: nowrap;
	justify-content: center;
	align-items: center;
	opacity: 0.4;
}

.slider-block .slider-nav .next:hover{
	opacity: 1;
	color: #fcbe00;
}

.slider-block .slider-nav .markers{
	display: flex;
	flex-wrap: nowrap;
	justify-content: center;
	align-items: center;
}

.slider-block .slider-nav .markers .marker{
	width: 7px;
	height: 7px;
	background: #fff;
	cursor: pointer;
	margin: 5px;
	margin-left: 8px;
	margin-right: 8px;
	border-radius: 12px;
	opacity: 0.3;
}

.slider-block .slider-nav .markers .m_active{
	opacity: 1;
	background: #fcbe00;
}

.slider-title{
	width: 50%;
	margin-top: 5px;
	font-family: Beaufort Bold;
	font-size: 38px;
	color: #ffffff;
	text-transform: uppercase;
	text-shadow: 0px -1px 1px #000;
}

.slider-text{
	width: 50%;
	margin-top: 10px;
	color: #dfdfdf;
	font-size: 16px;
	line-height: 24px;
	text-shadow: 0px -1px 1px #000;
}

/* news */
/* -------------------------------------------------------------------------------------------------------------------- */

.news-blcok{
	width: calc( 100% - 350px );
	position: relative;
	margin-top: 45px;
	margin-bottom: -20px;
}

.news-blcok > .title{
	width: 100%;
	font-family: Beaufort Bold;
	text-transform: uppercase;
	font-size: 30px;
	color: #562200;
	margin-bottom: 20px;
	height: 40px;
}

.news-blcok > .title > .more-news{
	width: 185px;
	height: 34px;
	font-size: 15px;
	margin-left: 20px;
}

.news{
	width: 100%;
	position: relative;
}

.news > article:nth-child(1){
	width: calc( 46% - 5px );
	height: calc( 100% - 20px );
	position: absolute;
	top: 0px;
	left: 0px;
	bottom: 0px;
	margin-left: 0px;
	box-shadow: 0px 0px 30px rgba(0,0,0,0.08);
}

.news > article:nth-child(1) > .img{
	width: 100%;
	height: 100%;
	z-index: 1;
	position: absolute;
	left: 0px;
	top: 0px;
	overflow: hidden;
	align-items: center;
}

.news > article:nth-child(1) > .img:after{
	content: '';
	position: absolute;
	z-index: 2;
	width: calc(100% + 10px);
	height: calc(100% + 10px);
	background: linear-gradient(to top, rgba(255, 255, 255,1) 0%, rgba(255, 255, 255,1) 50%, rgba(255, 255, 255,0.1) 80%, rgba(255, 255, 255,0) 100%);
}

.news > article:nth-child(1) > .img > img{
	width: 100%;
	height: auto;
	position: absolute;
	top: 0;
	z-index: 1;
}

.news > article:nth-child(1) > .news-area{
	width: calc( 100% - 60px );
	position: absolute;
	z-index: 2;
	bottom: 30px;
	left: 30px;
}

.news > article:nth-child(1) > .news-area > .title > a{
	width: 100%;
	height: calc( 28px * 2.1);
	font-family: Beaufort Bold;
	font-size: 30px;
	line-height: 28px;
	color: #3f312c;
	transition: all .2s ease-in-out;

	overflow: hidden;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	display: -moz-box;
	-moz-line-clamp: 2;
	-moz-box-orient: vertical;
}

.news > article:nth-child(1) > .news-area > .title > a:hover{
	color: #a22400;
}

.news > article:nth-child(1) > .news-area > .text{
	width: 100%;
	height: calc( 22px * 3 );
	font-size: 14px;
	color: #8d807c;
	margin-top: 20px;
	margin-bottom: 20px;

	overflow: hidden;
	line-height: 22px;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	display: -moz-box;
	-moz-line-clamp: 3;
	-moz-box-orient: vertical;
	position: relative;
}

.news > article:nth-child(1) > .news-area > .text > a{
	display: block;
	position: absolute;
	right: 0px;
	bottom: 0px;
	font-size: 14px;
	color: #fd963a;
	text-decoration: underline;
	line-height: 22px;
	background: #fff;
	transition: all .2s ease-in-out;
}

.news > article:nth-child(1) > .news-area > .text > a:hover{
	color: #ca2b00;
}

.news > article:nth-child(1) > .news-area > .text > a:before{
	content: '';
	width: 100px;
	height: 100%;
	background: linear-gradient(to left, rgba(255, 255, 255,1) 0%, rgba(255, 255, 255,0.5) 60%, rgba(255, 255, 255,0.1) 80%, rgba(255, 255, 255,0) 100%);
	position: absolute;
	left: -100px;
	top: 0px;
	pointer-events: none;
}

.news > article:nth-child(1) > .news-area > .info > .date{
	font-size: 12px;
	color: #635b58;
	opacity: 0.4;
}

.news > article:nth-child(1) > .news-area > .info > .date > i{
	font-size: 16px;
	margin-right: 5px;
	margin-top: -1px;
}

.news > article:nth-child(1) > .news-area > .info > a{
	font-family: Roboto Bold;
	font-size: 14px;
	color: #635b58;
	transition: all .2s ease-in-out;
	margin-right: 0px;
	margin-left: 15px;
}

.news > article:nth-child(1) > .news-area > .info > a > span{
	font-family: Roboto Bold;
	font-size: 14px;
	color: #635b58;
	transition: all .2s ease-in-out;
	display: block;
}

.news > article:nth-child(1) > .news-area > .info > a > img{
	padding: -6px;
}

.news > article:nth-child(1) > .news-area > .info > a:hover span{
	color: #ff9e00;
}

.news > article{
	width: calc( 54% - 15px );
	height: 143px;
	margin-bottom: 20px;
	position: relative;
	margin-left: 5%;
	border-radius: 5px;
	overflow: hidden;
}

.news > article > .img{
	width: 213px;
	height: 143px;
	z-index: 1;
	position: relative;
	left: 0px;
	top: 0px;
	overflow: hidden;
	border-radius: 5px;
	box-shadow: 0px 0px 30px rgba(0,0,0,0.08);
	align-items: flex-start;
}

.news > article > .img > img{
	position: absolute;
	z-index: 1;
	height: 143px;
	object-fit: fill;
}

.news > article > .news-area{
	width: calc( 100% - 230px );
	position: relative;
	z-index: 2;
	bottom: none;
	left: none;
}

.news > article > .news-area > .title > a{
	width: 100%;
	height: calc( 22px * 2);
	font-family: Beaufort Bold;
	font-size: 20px;
	line-height: 22px;
	color: #3f312c;
	transition: all .2s ease-in-out;

	overflow: hidden;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	display: -moz-box;
	-moz-line-clamp: 2;
	-moz-box-orient: vertical;
}

.news > article > .news-area > .title > a:hover{
	color: #a22400;
}

.news > article > .news-area > .text{
	width: 100%;
	height: calc( 18px * 3 );
	font-size: 14px;
	color: #8d807c;
	margin-top: 9px;
	margin-bottom: 6px;

	overflow: hidden;
	line-height: 18px;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	display: -moz-box;
	-moz-line-clamp: 3;
	-moz-box-orient: vertical;
	position: relative;
}

.news > article > .news-area > .text > a{
	display: block;
	position: absolute;
	right: 0px;
	bottom: 0px;
	font-size: 14px;
	color: #fd963a;
	text-decoration: underline;
	line-height: 18px;
	background: rgb(236, 236, 236);
	transition: all .2s ease-in-out;
}

.news > article > .news-area > .text > a:hover{
	color: #ca2b00;
}

.news > article > .news-area > .text > a:before{
	content: '';
	width: 100px;
	height: 100%;
	background: linear-gradient(to left, rgba(236, 236, 236,1) 0%, rgba(236, 236, 236,0.5) 60%, rgba(236, 236, 236,0.1) 80%, rgba(236, 236, 236,0) 100%);
	position: absolute;
	left: -100px;
	top: 0px;
	pointer-events: none;
}

.news > article > .news-area > .info > .date{
	font-size: 12px;
	color: #635b58;
	opacity: 0.4;
}

.news > article > .news-area > .info > .date > i{
	font-size: 16px;
	margin-right: 5px;
	margin-top: -1px;
}

.news > article > .news-area > .info > a{
	font-family: Roboto Bold;
	font-size: 14px;
	color: #635b58;
	transition: all .2s ease-in-out;
	margin-right: auto;
	margin-left: 15px;
}

.news > article > .news-area > .info > a > span{
	font-family: Roboto Bold;
	font-size: 14px;
	color: #635b58;
	transition: all .2s ease-in-out;
	display: none;
}

.news > article > .news-area > .info > a > img{
	padding: -6px;
}

/* widget */
/* -------------------------------------------------------------------------------------------------------------------- */

.widget-block{
	width: 300px;
	margin-top: 45px;
}

.widget-block > .title{
	width: 100%;
	font-family: Beaufort Bold;
	text-transform: uppercase;
	font-size: 30px;
	color: #562200;
	margin-bottom: 20px;
	height: 40px;
}

.widget{
	width: 100%;
	height: 470px;
	background: #fff;
	border-radius: 5px;
	overflow: hidden;
	box-shadow: 0px 0px 30px rgba(0,0,0,0.04);
}

/* footer */
/* -------------------------------------------------------------------------------------------------------------------- */

.inner-page{
	width: 100%;
	height: auto;
	background: #f8f8f8;
	padding-bottom: 55px;
	border-radius: 5px;
}

.switch{
	width: 100%;
}

.switch > .switch-button{
	width: 50%;
	height: 85px;
	font-family: Beaufort;
	text-transform: uppercase;
	font-size: 24px;
	color: #655a5a;
	background: #ebebeb;
	border-bottom: 1px solid #dddddd;
	cursor: pointer;
	position: relative;
	transition: all .2s ease-in-out;
	border-radius: 5px;
}

.switch > .switch-button:hover{
	background: #f6f6f6;
	color: #562200;
}

.switch > .switch-button:hover span{
	color: #562200;
}

.switch > .switch-button > span{
	margin-left: 5px;
	font-family: Beaufort;
	text-transform: uppercase;
	font-size: 24px;
	color: #655a5a;
	transition: all .2s ease-in-out;
}

.switch > .switch-button:after{
	content: '';
	width: 100%;
	height: 23px;
	background: url(../images/bg/border-bottom.png) top center;
	bottom: -17px;
	left: 0px;
	position: absolute;
	opacity: 0;
	transition: all .2s ease-in-out;
}

.switch > .active{
	background: #fff;
	color: #562200;
	border-bottom: 1px solid rgba(0,0,0,0);
	cursor: default;
	pointer-events: none;
}

.switch > .active:after{
	opacity: 1;
}

.switch > .active > span{
	color: #562200;
}

.switch-items{
	width: 750px;
	position: relative;
	margin: 0 auto;
	margin-top: 45px;
}

.switch-items > .item{
	width: 100%;
	height: auto;
	position: relative;
	top: 0px;
	left: 0px;
	display: none;
}

.switch-items > .active{
	display: block;
}

.switch-items > .item > .title{
	width: 100%;
	height: auto;
	font-family: Beaufort Bold;
	text-transform: uppercase;
	font-size: 30px;
	color: #562200;
	text-align: center;
	margin-bottom: 10px;
}

.switch-items > .item > .title > span{
	display: block;
	width: 100%;
	height: auto;
	font-family: Roboto;
	text-transform: none;
	font-size: 16px;
	color: #655a5a;
	text-align: center;
	margin-top: 5px;
}

form{
	display: block;
	width: 100%;
}

form > .items{
	width: 100%;
}


.log-reg-form > .items > .item:nth-child(1){
}
.log-reg-form > .items > .item:nth-child(2){
}
.log-reg-form > .items > .item:nth-child(3){
}
.log-reg-form > .items > .item:nth-child(4){
}
.log-reg-form > .items > .item:nth-child(5){
}
.log-reg-form > .items > .item:nth-child(6){
}
.log-reg-form > .items > .item:nth-child(7){
}
.log-reg-form > .items > .item:nth-child(8){
}

.log-reg-form > .items > .item{
	width: calc( 50% - 15px );
	margin-top: 30px;
	order: initial;
}

.login-form > .items > .item{
	width: 100%;
}

.log-reg-form > .items > .input > input{
}

.log-reg-form > .items > .select > .select-selected{
}

.log-reg-form > .items > .item > .icon{
}

.log-reg-form > .items > .box{
	background: #edecec;
	padding: 20px;
	border-radius: 5px;
	text-align: center;
	align-self: stretch;
}

.log-reg-form > .items > .box > .text{
	width: 100%;
	text-align: center;
	font-size: 12px;
	color: #959595;
	margin-top: 10px;
}

.log-reg-form > .items > .box > .text > a{
	color: #575252;
	transition: all .2s ease-in-out;
}

.log-reg-form > .items > .box > .text > a:hover{
	color: #a51f00;
}

.log-reg-form > .items > .captcha{
}

.log-reg-form > .items > .box > .checkbox {
	position: absolute;
	z-index: -1;
	opacity: 0;
}

.log-reg-form > .items > .box > .checkbox + label {
	position: relative;
	padding: 0 0 0 36px;
	cursor: pointer;
}

.log-reg-form > .items > .box > .checkbox + label:before {
	content: '';
	position: absolute;
	top: -4px;
	left: 0;
	width: 35px;
	height: 20px;
	border-radius: 13px;
	background: #dbd9d9;
	transition: .2s;
}

.log-reg-form > .items > .box > .checkbox + label:after {
	content: '';
	position: absolute;
	top: -2px;
	left: 2px;
	width: 16px;
	height: 16px;
	border-radius: 10px;
	background: #655a5a;
	transition: .2s;
}

.log-reg-form > .items > .box > .checkbox:checked + label:before {
	background: #dbd9d9;
}

.log-reg-form > .items > .box > .checkbox:checked + label:after {
	left: 17px;
	background: #ffa114;
}

.log-reg-form > .form-button{
	width: 238px;
	height: 40px;
	margin: 0 auto;
	margin-top: 30px;
	font-size: 22px;
}

.switch-items > .item > .vk-button{
	width: 198px;
	height: 40px;
	margin: 0 auto;
	margin-top: 10px;
	font-size: 16px;
	background: linear-gradient(to bottom, #66aef0, #3d7cb2) !important;	
	color: #194266;
	text-shadow: 0px -1px 0px #6bafed;
	box-shadow: 0px 0px 10px rgba(81,184,208,0.3);
	text-align: center;
}

.switch-items > .item > .vk-button > i{
	font-size: 25px;
	margin-right: 7px;
	margin-top: 0px;
}

.tg-button{
	margin-top: 10px;
	text-align: center;
}

.link-restore-pass{
	margin: 0 auto;
	margin-top: 20px;
	font-family: Beaufort Bold;
	text-transform: uppercase;
	font-size: 16px;
	color: #534c4c;
	text-align: center;
	display: block;
	/*width: 160px;*/
	text-decoration: underline;
	transition: all .2s ease-in-out;
}

.link-restore-pass:hover{
	color: #a52b00;
}

/* download */
/* -------------------------------------------------------------------------------------------------------------------- */

.inner-page > .top-title{
	width: 100%;
	font-family: Beaufort Bold;
	text-transform: uppercase;
	font-size: 30px;
	color: #562200;
	text-align: center;
	padding-top: 30px;
	padding-bottom: 34px;
	position: relative;
	margin-bottom: 40px;
}

.inner-page > .top-title:after{
	content: '';
	position: absolute;
	width: 100%;
	height: 23px;
	background: url(../images/bg/border-bottom.png) top center;
	left: 0px;
	bottom: -16px;
	pointer-events: none;
}

.start-game-guide-box{
	width: 100%;
	position: relative;
}

.start-game-guide-box:nth-child(n+3){
	padding-top: 45px;
}

.start-game-guide-box:not(:last-child){
	padding-bottom: 55px;
}

.start-game-guide-box:not(:last-child):after{
	content: '';
	position: absolute;
	width: 100%;
	height: 23px;
	background: url(../images/bg/border-bottom.png) top center;
	left: 0px;
	bottom: -16px;
	pointer-events: none;
}

.start-game-guide-box > .step{
	width: 83px;
	height: 83px;
	margin: 0 auto;
	background: url(../images/icon/step_icon.png) center center;
	background-size: 100% 100%;
	font-family: Beaufort Bold;
	text-transform: uppercase;
	font-size: 30px;
	color: #562200;
	text-align: center;
	text-shadow: 0px -1px 0px #ffc057;
	padding-top: 10px;
}

.start-game-guide-box > .step > span{
	display: block;
	width: 100%;
	font-family: Beaufort Bold;
	text-transform: uppercase;
	font-size: 16px;
	color: #562200;
	text-align: center;
	text-shadow: 0px -1px 0px #ffc057;
	margin-top: -5px;
}

.start-game-guide-box > .title{
	width: 100%;
	font-family: Beaufort Bold;
	text-transform: uppercase;
	font-size: 24px;
	color: #55433d;
	text-align: center;
	margin-top: 20px;
}

.start-game-guide-box > .text{
	width: 720px;
	margin: 0 auto;
	margin-top: 10px;
	font-family: Roboto;
	font-size: 18px;
	color: #75655f;
	text-align: center;
	margin-bottom: 30px;
	line-height: 24px;
}

.start-game-guide-box > .text2{
	width: 720px;
	margin: 0 auto;
	font-family: Roboto;
	font-size: 18px;
	color: #75655f;
	text-align: center;
	margin-bottom: 30px;
}

.start-game-guide-box > .text2 > span{
	font-family: Roboto Bold;
	font-size: 18px;
	color: #ef230e;
}

.start-game-guide-box > .reg-button{
	width: 280px;
	height: 56px;
	margin: 0 auto;
	display: flex;
	font-size: 24px;
}

.start-game-guide-box > .buttons{
	width: calc( 100% - 80px );
	margin: 0 auto;
	border-bottom: 1px solid rgba(0,0,0,0.05);
	padding-bottom: 40px;
	margin-bottom: 20px;
}

.start-game-guide-box > .success-reg-buttons{
	border-bottom: none;
	padding-bottom: 0px;
	margin-bottom: 0px;
}

.start-game-guide-box > .success-reg-text{
	width: 100%;
	border-bottom: none;
	padding-bottom: 0px;
	margin-bottom: 0px;
	color: #736054;
	font-size: 16px;
	line-height: 24px;
}

.start-game-guide-box > .buttons > .gd-button,
.start-game-guide-box > .buttons > .ut-button,
.start-game-guide-box > .buttons > .yd-button,
.start-game-guide-box > .buttons > .mg-button{
	width: 250px;
	height: 56px;
	margin-left: 10px;
	margin-right: 10px;
	margin-bottom: 15px;
}

.start-game-guide-box > .buttons > .gd-button{
	background: linear-gradient(to top, #004aad, #0095fe);
	box-shadow: 0px 0px 10px rgba(0,120,222,0.5);
}

.start-game-guide-box > .buttons > .ut-button{
	background: linear-gradient(to top, #498543, #76e73f);
	box-shadow: 0px 0px 10px rgba(85, 241, 60, 0.5);
}

.start-game-guide-box > .buttons > .mg-button{
	background: linear-gradient(to top, #e16968, #fb9468);
	box-shadow: 0px 0px 10px rgba(231,113,104,0.5);
}

.start-game-guide-box > .buttons > .gd-button > img,
.start-game-guide-box > .buttons > .ut-button > img,
.start-game-guide-box > .buttons > .yd-button > img,
.start-game-guide-box > .buttons > .mg-button > img{
	margin-left: 15px;
}

.start-game-guide-box > .buttons > .gd-button > .info,
.start-game-guide-box > .buttons > .ut-button > .info,
.start-game-guide-box > .buttons > .yd-button > .info,
.start-game-guide-box > .buttons > .mg-button > .info{
	margin-left: 10px;
}

.start-game-guide-box > .buttons > .gd-button > .info > .name,
.start-game-guide-box > .buttons > .ut-button > .info > .name,
.start-game-guide-box > .buttons > .yd-button > .info > .name,
.start-game-guide-box > .buttons > .mg-button > .info > .name{
	font-family: Beaufort Bold;
	text-transform: uppercase;
	font-size: 20px;
	text-shadow: 0px -1px 0px rgba(255,255,255,0.3);
}

.start-game-guide-box > .buttons > .gd-button > .info > .name,
.start-game-guide-box > .buttons > .gd-button > .info > .desc{
	color: #1c2441;
}

.start-game-guide-box > .buttons > .ut-button > .info > .name,
.start-game-guide-box > .buttons > .ut-button > .info > .desc{
	color: #114905;
}

.start-game-guide-box > .buttons > .yd-button > .info > .name,
.start-game-guide-box > .buttons > .yd-button > .info > .desc{
	color: #562200;
}

.start-game-guide-box > .buttons > .mg-button > .info > .name,
.start-game-guide-box > .buttons > .mg-button > .info > .desc{
	color: #74271a;
}

.start-game-guide-box > .buttons > .gd-button > .info > .desc,
.start-game-guide-box > .buttons > .ut-button > .info > .desc,
.start-game-guide-box > .buttons > .yd-button > .info > .desc,
.start-game-guide-box > .buttons > .mg-button > .info > .desc{
	font-family: Beaufort Bold;
	font-size: 14px;
	text-shadow: 0px -1px 0px rgba(255,255,255,0.3);
	margin-top: -3px;
}

.start-game-guide-box > .title-mini{
	width: 100%;
	font-family: Beaufort;
	text-transform: uppercase;
	font-size: 24px;
	color: #55433d;
	text-align: center;
}

.start-game-guide-box > .recomend-block{
	width: calc( 100% - 80px );
	margin: 0 auto;
}

.start-game-guide-box > .recomend-block > .box{
	width: calc( 50% - 20px );
	align-self: stretch;
	padding: 30px 30px 10px 30px;
	background: #fff;
	box-shadow: 0px 10px 30px rgba(0,0,0,0.1);
	border-radius: 5px;
	margin-top: 30px;
}

.start-game-guide-box > .recomend-block > .box > .title{
	width: 100%;
	font-family: Beaufort;
	text-transform: uppercase;
	font-size: 20px;
	color: #55433d;
	text-align: center;
	margin-bottom: 20px;
}

.start-game-guide-box > .recomend-block > .box > .text{
	width: 100%;
	font-family: Roboto;
	font-size: 14px;
	color: #55433d;
	text-align: center;
	margin-bottom: 20px;
}

.start-game-guide-box > .buttons2{
	width: calc( 100% - 80px );
	margin: 0 auto;
}

.start-game-guide-box > .buttons2 > a{
	width: 250px;
	height: 56px;
	margin-left: 10px;
	margin-right: 10px;
	margin-bottom: 15px;
}

.start-game-guide-box > .buttons2 > a > .info{
	width: 100%;
}

.start-game-guide-box > .buttons2 > a > .info > .name{
	width: 100%;
	text-align: center;
	font-family: Beaufort Bold;
	font-size: 20px;
	color: #562200;
	text-shadow: 0px -1px 0px #ffcc75;
	text-transform: uppercase;
}

.start-game-guide-box > .buttons2 > a > .info > .desc{
	width: 100%;
	text-align: center;
	font-family: Beaufort Bold;
	font-size: 14px;
	color: #562200;
	text-shadow: 0px -1px 0px #ffcc75;
	margin-top: -3px;
}

.start-game-guide-box > .drop-box{
	width: 860px;
	margin: 0 auto;
	margin-top: -20px;
}

.start-game-guide-box > .drop-box > .title{
	width: 100%;
	font-family: Roboto Bold;
	font-size: 18px;
	color: #55433d;
	padding: 20px 0px;
	cursor: pointer;
	transition: all .2s ease-in-out;
	text-align: center;
}

.start-game-guide-box > .drop-box > .title:hover{
	color: #bf1f00;
}

.start-game-guide-box > .drop-box > .title > i{
	font-size: 12px;
	margin-left: 5px;
}

.start-game-guide-box > .drop-box > .box{
	width: 100%;
	padding: 20px;
	border-radius: 5px;
	border: 1px solid rgba(0,0,0,0.1);
	display: none;
	font-size: 14px;
	color: #857873;
	line-height: 20px;
}

.start-game-guide-box > .drop-box > .box > span{
	color: #cd7e0d;
	transition: all .2s ease-in-out;
	text-decoration: underline;
	cursor: pointer;
}

.start-game-guide-box > .drop-box > .box > span:hover{
	color: #bf1f00;
}

.start-game-guide-box > .drop-box > .box > .top-text{
	margin-bottom: 20px;
	color: #55433d;
}

.start-game-guide-box > .drop-box > .box > .screenshot{
	width: 100%;
	margin-top: 20px;
	display: none;
}

.start-game-guide-box > .drop-box > .box > .screenshot > a{
	display: block;
}

.start-game-guide-box > .drop-box > .box > .screenshot > a > img{
	width: 100%;
}

.start-game-guide-box > a > .newbie-box{
	width: 280px;
	border: 1px solid rgba(0,0,0,0.1);
	padding: 20px;
	border-radius: 5px;
	margin: 0 auto;
}

.start-game-guide-box > a > .newbie-box > img{
	margin-top: -20px;
}

.start-game-guide-box > a > .newbie-box > .name{
	width: 100%;
	font-family: Beaufort;
	text-transform: uppercase;
	font-size: 20px;
	color: #55433d;
	text-align: center;
	margin-top: 20px;
}

/* settings */
/* -------------------------------------------------------------------------------------------------------------------- */

.chars-nav{
	width: calc( 100% - 80px );
	margin: 0 auto;
	background: #ebebec;
	border-radius: 5px;
}

.chars-nav > .chars-button{
	width: calc( 100% / 10 );
	padding-top: 25px;
	padding-bottom: 25px;
	cursor: pointer;
	transition: all .2s ease-in-out;
	background: rgba(0,0,0,0);
	position: relative;
	border-radius: 5px;
}

.chars-nav > .chars-button:hover{
	background: #f5f5f5;
}

.chars-nav > .chars-button > img{
	display: block;
	margin: 0 auto;
}

.chars-nav > .chars-button > .name{
	width: 100%;
	font-family: Beaufort Bold;
	text-transform: uppercase;
	font-size: 19px;
	color: #562200;
	text-align: center;
	margin-top: 15px;
}

.chars-nav > .chars-button:after{
	content: '';
	width: 100%;
	height: 23px;
	background: url(../images/bg/border-bottom.png) top left;
	position: absolute;
	left: 0px;
	bottom: -17px;
	opacity: 1;
	transition: all .2s ease-in-out;
}

.chars-nav > .chars-button:before{
	content: '';
	width: 100%;
	height: 23px;
	background: url(../images/bg/border-bottom.png) top center;
	position: absolute;
	left: 0px;
	bottom: -17px;
	opacity: 0;
	transition: all .2s ease-in-out;
}
.chars-nav > .active{background: #fff;pointer-events: none;}
.chars-nav > .active:after{
	opacity: 0;
}
.chars-nav > .active:before{
	opacity: 1;
}

.chars-block{
	width: calc( 100% - 80px );
	margin: 0 auto;
	margin-top: 45px;
	position: relative;
}

.chars-block > .char{
	width: 100%;
	opacity: 1;
	transition: all .3s ease-in-out;
	position: absolute;
	top: 0px;
	left: 0px;
	opacity: 0;
	pointer-events: none;
}

.chars-block > .active{
	position: relative;
	opacity: 1;
	pointer-events: auto;
}

.chars-block > .char > .img{
	width: 320px;
	height: 420px;
	position: relative;
}

.chars-block > .char > .img > img{
	position: absolute;
	pointer-events: none;
}

.chars-block > .char > .info{
	width: calc( 100% - 370px );
}

.chars-block > .char > .info > .name{
	width: 100%;
	font-family: Beaufort Bold;
	text-transform: uppercase;
	font-size: 30px;
	color: #562200;
	text-align: left;
	padding-top: 15px;
}

.chars-block > .char > .info > .desc{
	width: 100%;
	font-family: Roboto;
	font-size: 16px;
	color: #897f7c;
	line-height: 24px;
	margin-top: 15px;
	margin-bottom: 20px;
}

.chars-block > .char > .info > .perv{
	width: 300px;
	box-shadow: 0px 10px 30px rgba(0,0,0,0.3);
}

/* game-feature */
/* -------------------------------------------------------------------------------------------------------------------- */

.ft-slider-bg{
	width: calc( 100% - 80px );
	height: auto;
	position: relative;
	margin: 0 auto;
}

.ft-slider-bg > .left_button{
	width: 40px;
	height: 60px;
	position: absolute;
	top: calc( 50% - 30px );
	left: -8px;
	cursor: pointer;
	transition: all .2s ease-in-out;
	font-size: 60px;
	color: #000000;
	opacity: 0.25;
}

.ft-slider-bg > .right_button{
	width: 40px;
	height: 60px;
	position: absolute;
	top: calc( 50% - 30px );
	right: -8px;
	cursor: pointer;
	transition: all .2s ease-in-out;
	font-size: 60px;
	color: #000000;
	opacity: 0.25;
}

.ft-slider-bg > .left_button > i,
.ft-slider-bg > .right_button > i{
	position: absolute;
}

.ft-slider-bg > .left_button:hover,
.ft-slider-bg > .right_button:hover{
	color: #a62902;
	opacity: 1;
}

.ft-slider-bg > .ft-slider{
	width: calc( 100% - 100px );
	height: 100%;
	overflow: hidden;
	margin: 0 auto;
}

.ft-slider-bg > .ft-slider > .slider_line{
	height: 100%;
	display: flex;
	flex-wrap: nowrap;
	justify-content: flex-start;
	align-items: flex-start;
	margin-left: -7.5px;
	transition: transform .5s ease-in-out;
}

.ft-slider-bg > .ft-slider > .slider_line > .slider_item{
	height: auto;
	border-radius: 5px;
	overflow: hidden;
	margin-right: 7.5px;
	margin-left: 7.5px;
	position: relative;
	cursor: pointer;
	border-bottom: 2px solid #ff9700;
	transition: background .2s ease-in-out;
	align-self: stretch;
	padding: 20px;
	background: #eaeaea;
}

.ft-slider-bg > .ft-slider > .slider_line > .slider_item:hover{
	border-bottom: 2px solid #f8bea6;
	background: #f5f5f5;
}

.ft-slider-bg > .ft-slider > .slider_line > .active{
	background: #fff;
	box-shadow: 0px 10px 30px rgba(0,0,0,0.1);
	border-bottom: 2px solid #e32a11;
}

.ft-slider-bg > .ft-slider > .slider_line > .slider_item > .icon{
	width: 100px;
	height: 60px;
	margin: 0 auto;
}

.ft-slider-bg > .ft-slider > .slider_line > .slider_item > .name{
	width: 100%;
	font-family: Beaufort Bold;
	font-size: 20px;
	color: #562200;
	text-align: center;
	text-transform: uppercase;
	margin-top: 15px;
}

.slider_info{
	width: calc( 100% - 80px - 100px );
	margin: 0 auto;
	margin-top: 45px;
	position: relative;
}

.slider_info > .slider_info_item{
	width: 100%;
	transition: all .3s ease-in-out;
	position: absolute;
	top: 0px;
	left: 0px;
	opacity: 0;
	pointer-events: none;
}

.slider_info > .active{
	opacity: 1;
	position: relative;
	pointer-events: auto;
}

.slider_info > .slider_info_item > .title{
	width: 100%;
	font-family: Beaufort Bold;
	font-size: 24px;
	color: #52443a;
	text-align: center;
	text-transform: uppercase;

}

.slider_info > .slider_info_item > .title > .icon{
	width: 40px;
	height: 20px;
	position: relative;
	margin-right: 20px;
}

.slider_info > .slider_info_item > .title > .icon > img{
	position: absolute;
	height: 180%;
}

.slider_info > .slider_info_item > .text{
	width: 100%;
    color: #52443a;
    font-size: 16px;
    line-height: 28px;
    margin-top: 20px;
}

/* calendar */
/* -------------------------------------------------------------------------------------------------------------------- */

.calendar-events{
	width: calc( 100% - 80px );
	margin: 0 auto;
	position: relative;
}

.calendar-events > .image{
	width: 288px;
	height: auto;
	border-radius: 5px;
	overflow: hidden;
}

.calendar-events > .image > img{
	width: 100%;
}

.calendar-events > .events-content{
	width: calc( 100% - 288px - 30px );
	height: auto;
	margin-left: auto;
}

.calendar-events > .events-content > .title{
	width: 100%;
	font-family: Roboto Bold;
	font-size: 20px;
	color: #562200;
}

.calendar-events > .events-content > .text{
	width: 100%;
	margin-top: 10px;
	font-family: Roboto;
	font-size: 16px;
	color: #736054;
	line-height: 25px;
}

.calendar-events > .events-content > .events{
	width: 100%;
	margin-top: 15px;
}

.calendar-events > .events-content > .events > .event{
	width: 100%;
	padding: 15px 0px;
	border-bottom: 1px solid rgba(0,0,0,0.05);
	line-height: 30px;
}

.calendar-events > .events-content > .events > .event > .date{
	font-size: 14px;
	height: 26px;
	padding: 3px 10px;
	margin-right: 5px;
	border-radius: 20px;
	width: auto;
}

.calendar-events > .events-content > .events > .event > .name{
	font-family: Roboto;
	font-size: 20px;
	color: #562200;
	line-height: 20px;
}

/* description */
/* -------------------------------------------------------------------------------------------------------------------- */

.game-desc{
	width: calc( 100% - 80px );
	margin: 0 auto;
	position: relative;
}

.game-desc > .images{
	width: 288px;
	height: auto;
}

.game-desc > .images > .img{
	width: 100%;
	height: auto;
	border-radius: 5px;
	overflow: hidden;
	box-shadow: 0px 10px 30px rgba(0,0,0,0.3);
}

.game-desc > .images > .img:not(:last-child){
	margin-bottom: 35px;
}

.game-desc > .images > .img > img{
	width: 100%;
	margin-bottom: -10px;
}

.game-desc > .game-desc-content{
	width: calc( 100% - 288px - 30px );
	height: auto;
	margin-left: auto;
}

.game-desc > .game-desc-content > .block{
	width: 100%;
}

.game-desc > .game-desc-content > .block:not(:first-child){
	margin-top: 40px;
}

.game-desc > .game-desc-content > .block > .title{
	font-family: Roboto Bold;
	font-size: 25px;
	color: #562200;
}

.game-desc > .game-desc-content > .block > .text{
	font-family: Roboto;
	font-size: 16px;
	color: #796963;
	line-height: 26px;
	margin-top: 15px;
}

.game-desc > .game-desc-content > .block > .text > a{
	font-family: Roboto Bold;
	font-size: unset;
	color: #f37e00;
	transition: all .2s ease-in-out;
	text-decoration: underline;
}

.game-desc > .game-desc-content > .block > .text > a:hover{
	color: #f33900;
}

.game-desc > .game-desc-content > .block > .start-button{
	width: 250px;
	height: 56px;
	margin-top: 20px;
	font-size: 24px;
}

/* text-page */
/* -------------------------------------------------------------------------------------------------------------------- */

.text-content{
	width: calc( 100% - 80px );
	margin: 0 auto;
	position: relative;
}

.text-content *:last-child{
	margin-bottom: 0px !important;
}

.text-content > p > a{
	text-decoration: underline;
	color: #f37e00;
}

ul{
	margin: 25px 0px;
	margin-left: 18px;	
}

ul li{
	color: #4a4646;
	line-height: 24px;
}

p{
	color: #827979;
	line-height: 24px;
	margin: 25px 0px;
}

h1, h2, h3, h4, h5, h6{
	font-family: Beaufort Bold;
	color: #4a4646;
	margin: 25px 0px;
}

table{
	width: 100%;
	margin: 25px 0px;
	border: 1px solid #d5d2d0;
}

table tr{
	width: 100%;
}

table tr:nth-child(1) td{
	background: #ffffff;
	color: #4a4646;
	font-family: Roboto Bold;
}

table tr td{
	padding: 15px 0px;
	text-align: center;
	background: #f8f8f8;
	color: #827e7e;
}

table tr:not(:last-child) td{
	border-bottom: 1px solid #d5d2d0;
}

table tr td:not(:last-child){
	border-right: 1px solid #d5d2d0;
}

table tr:nth-child(n+2):nth-child(odd) td{
	background: #f3efed;
}

/* prmotions */
/* -------------------------------------------------------------------------------------------------------------------- */

.promotions{
	width: calc( 100% - 80px );
	margin: 0 auto;
	position: relative;
}

.promotions:not(:nth-child(2)){
	margin-top: 40px;
	padding-top: 40px;
	border-top: 1px solid rgba(0,0,0,0.05);
}

.promotions > .image{
	width: 220px;
	height: 220px;
	position: relative;
	border-radius: 5px;
	overflow: hidden;
	box-shadow: 0px 10px 30px rgba(0,0,0,0.3);
}

.promotions > .image > img{
	width: 100%;
	position: absolute;
}

.promotions > .promo-content{
	width: calc( 100% - 220px - 20px );
}

.promotions > .promo-content > .title{
	font-family: Beaufort Bold;
	font-size: 24px;
	color: #562200;
	text-transform: uppercase;
}

.promotions > .promo-content > .title > .text{
	font-family: Beaufort Bold;
	font-size: 24px;
	color: #562200;
	text-transform: uppercase;
	margin-right: 20px;
}

.promotions > .promo-content > .title > .period{
	font-size: 18px;
	height: 30px;
	padding: 3px 10px;
	border-radius: 20px;
	margin: 10px 0px;
}

.promotions > .promo-content > .text{
	width: 100%;
	height: calc( 30px * 4 );
	font-family: Roboto;
	font-size: 16px;
	color: #5f554c;
	line-height: 30px;
	margin-top: 5px;

	overflow: hidden;
	display: -webkit-box;
	-webkit-line-clamp: 4;
	-webkit-box-orient: vertical;
	display: -moz-box;
	-moz-line-clamp: 4;
	-moz-box-orient: vertical;

}

.promotions > .promo-content > .info{
	width: 100%;
	margin-top: 15px;
}

.promotions > .promo-content > .info > .date{
	font-size: 12px;
	color: #635b58;
	opacity: 0.4;
}

.promotions > .promo-content > .info > .date > i{
	font-size: 16px;
	margin-right: 5px;
	margin-top: -1px;
}

.promotions > .promo-content > .info > a{
	font-family: Roboto Bold;
	font-size: 14px;
	color: #635b58;
	transition: all .2s ease-in-out;
	margin-right: auto;
	margin-left: 15px;
}	

.promotions > .promo-content > .info > a > span{
	font-family: Roboto Bold;
	font-size: 14px;
	color: #635b58;
	transition: all .2s ease-in-out;
}

.promotions > .promo-content > .info > a:hover span{
	color: #ff9e00;
}

.pagination{
	width: calc( 100% - 80px );
	margin: 0 auto;
	position: relative;
	padding-top: 40px;
	margin-top: 40px;
	border-top: 1px solid rgba(0,0,0,0.05);
}

.pagination > a{
	width: 40px;
	height: 40px;
	background: #e4deda;
	margin: 0px 7px;
	border-radius: 40px;
	font-family: Beaufort Bold;
	font-size: 20px;
	color: #75665c;
	line-height: 20px;
	transition: all .2s ease-in-out;
}

.pagination > a:hover{
	background: #f3dbcb;
}

.pagination > .active{
	background: linear-gradient(to top, #ff9500, #feb900);
	font-size: 20px;
	color: #82330d;
	text-shadow: 0px -1px 0px #ffcc75;
}

.pagination > .active:hover{
	background: linear-gradient(to top, #ff9500, #feb900);
}

/* votes */
/* -------------------------------------------------------------------------------------------------------------------- */

.votes{
	width: calc( 100% - 80px );
	margin: 0 auto;
	position: relative;
}

.votes > .block{
	width: calc( 50% - 15px );
}

.votes > .block > .text{
	width: 100%;
	font-family: Roboto;
	font-size: 16px;
	color: #562200;
	line-height: 30px;
	text-align: center;
	margin-top: 20px;
}

.votes > .block > .title{
	width: 100%;
	font-family: Beaufort Bold;
	font-size: 22px;
	color: #562200;
	line-height: 30px;
	text-align: center;
	margin-top: 40px;
	margin-bottom: 30px;
}

.votes > .block > .table{
	width: 100%;
}

.votes > .block > .table > .line{
	width: 100%;
	background: #e9e9e9;
	border-radius: 20px;
	padding: 15px;
	font-family: Roboto Bold;
	font-size: 16px;
	color: #635553;
	margin-top: 5px;
}

.votes > .block > .table > .line > img{
	margin-right: 5px;
}

.votes > .block > .table > .line > span{
	font-family: unset;
	font-size: unset;
	color: #c65646;
	margin: 0px 5px;
}

.votes > .block > .table > .line > .golden{
	color: #ff8300;
}

.votes > .block > .text2{
	width: 100%;
	font-family: Roboto;
	font-size: 14px;
	color: #8a807f;
	line-height: 30px;
	text-align: center;
	margin-top: 30px;
}

.votes > .block > .right-info{
	width: 100%;
	padding: 30px;
	background: #fff;
	box-shadow: 0px 10px 30px rgba(0,0,0,0.1);
	border-radius: 20px;
	position: relative;
}

.votes > .block > .right-info > img{
	margin-top: -20px;
}

.votes > .block > .right-info > .title{
	width: 100%;
	text-align: center;
	font-family: Beaufort Bold;
	font-size: 20px;
	color: #562200;
	line-height: 30px;
	text-transform: uppercase;
	margin-top: -20px;
}

.votes > .block > .right-info > .title > span{
	display: block;
	width: 100%;
	font-family: Beaufort Bold;
	font-size: 28px;
	color: #e52407;
	line-height: 30px;
	text-align: center;
}

.votes > .block > .right-info > .vote-button{
	width: 250px;
	height: 56px;
	font-size: 24px;
	margin-top: 20px;
}

.votes > .block > .right-info > .mini-title{
	font-family: Roboto Bold;
	font-size: 14px;
	color: #562200;
	line-height: 20px;
	text-align: center;
	margin-top: 40px;
}

.votes > .block > .right-info > .items{
	width: calc( 100% - 40px );
	margin-top: 20px;
	margin-bottom: 20px;
}

.votes > .block > .right-info > .items > .block{
	width: calc( 50% - 30px );
	position: relative;
	z-index: 1;
}

.votes > .block > .right-info > .items > .block:hover{
	z-index: 2;
}

.votes > .block > .right-info > .items > .block > .item{
	width: auto;
	font-family: Roboto;
	font-size: 12px;
	color: #8a807f;
	line-height: 20px;
	margin-top: 5px 0px;
	position: relative;
	cursor: pointer;
	z-index: 1;
}

.votes > .block > .right-info > .items > .block > .item:hover{
	color: #562200;
	z-index: 2;
}

.votes > .block > .right-info > .items > .block > .item:hover .item-desc{
	opacity: 1;
	transform: translateY(0px) scale(1, 1) rotate(0deg);
}

.votes > .block > .right-info > .items > .block > .item > .item-desc{
	position: absolute;
	width: 250px;
	background: #fff;
	box-shadow: 0px 5px 30px rgba(0,0,0,0.2);
	border-radius: 5px;
	border-bottom: 2px solid #eca500;
	left: 0px;
	bottom: 25px;
	padding: 10px;
	pointer-events: none;
	font-size: 12px;
	line-height: 16px;
	color: #8a807f;
	opacity: 0;
	transition: all .5s ease-in-out;
	transform: translateY(-50px) scale(0.6, 0.6) rotate(20deg);
}

.votes > .block > .right-info > .items > .block > .item > .item-desc:after{
	content: '';
	width: 26px;
	height: 9px;
	position: absolute;
	bottom: -11px;
	left: 20px;
	background: url(../images/icon/arrow_bottom_yellow.png);
}

/* newbie-box */
/* -------------------------------------------------------------------------------------------------------------------- */

.newbie-box-info{
	width: calc( 100% - 80px );
	margin: 0 auto;
	position: relative;
	padding-bottom: 35px;
}

.newbie-registration-box-info{
	width: calc( 100% - 80px );
	margin: 0 auto;
	position: relative;
	padding-bottom: 35px;
}

.newbie-registration-box-info a{
	color: #f37e00;
	text-decoration: underline;
}

.newbie-registration-box-info:after {
	content: '';
	position: absolute;
	width: calc( 100% + 80px );
	height: 23px;
	background: url(../images/bg/border-bottom.png) top center;
	left: -40px;
	bottom: -16px;
	pointer-events: none;
}

.newbie-box-info > .image{
	width: 200px;
	height: 175px;
	position: relative;
}

.newbie-box-info > .image > img{
	position: absolute;
	transform: translateY(-22px);
	pointer-events: none;
}

.newbie-box-info > .newbie-box-content{
	width: calc( 100% - 200px - 40px );
}

.newbie-box-info > .newbie-box-content > .text{
	width: 100%;
	font-family: Roboto;
	font-size: 16px;
	color: #5f554c;
	line-height: 28px;
}

.newbie-registration-box-info > .newbie-box-content > .text{
	width: 100%;
	font-family: Roboto;
	font-size: 16px;
	color: #5f554c;
	line-height: 28px;
}

.newbie-box-info > .newbie-box-content > .newbie-button{
	width: 300px;
	height: 56px;
	font-size: 24px;
	margin-top: 20px;
}

.newbie-box-rewards{
	width: calc( 100% - 80px );
	margin: 0 auto;
	position: relative;
	margin-top: 35px;
}

.newbie-registration-box-rewards{
	width: 100%;
	margin: 0 auto;
	position: relative;
	margin-top: 10px;
}

.newbie-box-rewards > .title{
	 width: 100%;
	 font-family: Beaufort Bold;
	 font-size: 22px;
	 color: #562200;
	 line-height: 30px;
	 text-align: center;
	 text-transform: uppercase;
	 margin-bottom: 30px;
 }

.newbie-box-info > .title{
	width: 100%;
	font-family: Beaufort Bold;
	font-size: 22px;
	color: #562200;
	line-height: 30px;
	text-align: center;
	text-transform: uppercase;
	margin-bottom: 30px;
	margin-top: 40px;
}

.newbie-registration-box-info > .title{
	width: 100%;
	font-family: Beaufort Bold;
	font-size: 22px;
	color: #562200;
	line-height: 30px;
	text-align: center;
	text-transform: uppercase;
	margin-bottom: 30px;
}

.newbie-box-rewards > .newbie-drop-box{
	width: 100%;
	margin-top: 8px;
}

.newbie-box-rewards > .newbie-drop-box > .title{
	width: 100%;
	height: 50px;
	border-radius: 50px;
	background: #e8e8e8;
	cursor: pointer;
	transition: all .2s ease-in-out;
	box-shadow: 0px 0px 0px rgba(0,0,0,0);
}

.newbie-box-rewards > .newbie-drop-box > .title:hover{
	background: #fff;
	box-shadow: 0px 5px 15px rgba(0,0,0,0.1);
}

.newbie-box-rewards > .newbie-drop-box > .title > .icon{
	width: 28px;
	height: 28px;
	overflow: hidden;
	position: relative;
	margin-left: 10px;
}

.newbie-box-rewards > .newbie-drop-box > .title > .icon > img{
	position: absolute;
	display: block;
	border-radius: 50%;
	width: 100%;
	height: 100%;
}

.newbie-box-rewards > .newbie-drop-box > .title > .text{
	font-family: Beaufort Bold;
	font-size: 18px;
	color: #58524f;
	text-transform: uppercase;
	margin-left: 10px;
}

.newbie-box-rewards > .newbie-drop-box > .title > .arrow{
	margin-left: auto;
	margin-right: 15px;
}

.newbie-box-rewards > .newbie-drop-box > .title > .arrow > span{
	font-family: Beaufort Bold;
	font-size: 14px;
	color: #afadac;
	text-transform: uppercase;
	margin-right: 8px;
}

.newbie-box-rewards > .newbie-drop-box > .title > .arrow > i{
	font-size: 18px;
	color: #8e8785;
}

.newbie-box-rewards > .newbie-drop-box > .box{
	width: 100%;
	padding-left: 43px;
	padding-top: 20px;
	padding-bottom: 20px;
	padding-right: 20px;
	border: 1px solid rgba(0,0,0,0.08);
	border-radius: 20px;
	margin-top: 3px;
	display: none;
}

.newbie-box-rewards > .newbie-drop-box > .box > .item{
	font-family: Roboto;
	font-size: 14px;
	color: #58524f;
	line-height: 30px;
	position: relative;
	cursor: pointer;
}

.newbie-box-rewards > .newbie-drop-box > .box > .item:hover{
	color: #9e4c03;
}

.newbie-box-rewards > .newbie-drop-box > .box > .item:hover .item-desc{
	opacity: 1;
	transform: translateY(0px) scale(1, 1) rotate(0deg);
}

.newbie-box-rewards > .newbie-drop-box > .box > .item > .item-desc{
	position: absolute;
	width: 250px;
	background: #fff;
	box-shadow: 0px 5px 30px rgba(0,0,0,0.2);
	border-radius: 5px;
	border-bottom: 2px solid #eca500;
	left: 0px;
	bottom: calc( 100% + 5px );
	padding: 10px;
	pointer-events: none;
	font-size: 12px;
	line-height: 16px;
	color: #8a807f;
	opacity: 0;
	transition: all .5s ease-in-out;
	transform: translateY(-50px) scale(0.6, 0.6) rotate(20deg);
}

.newbie-box-rewards > .newbie-drop-box > .box > .item > .item-desc:after{
	content: '';
	width: 26px;
	height: 9px;
	position: absolute;
	bottom: -11px;
	left: 20px;
	background: url(../images/icon/arrow_bottom_yellow.png);
}

.newbie-registration-box-rewards > .newbie-drop-box{
	width: 100%;
	margin-top: 8px;
}

.newbie-registration-box-rewards > .newbie-drop-box > .title{
	width: 100%;
	height: 50px;
	border-radius: 50px;
	background: #e8e8e8;
	cursor: pointer;
	transition: all .2s ease-in-out;
	box-shadow: 0px 0px 0px rgba(0,0,0,0);
}

.newbie-registration-box-rewards > .newbie-drop-box > .title:hover{
	background: #fff;
	box-shadow: 0px 5px 15px rgba(0,0,0,0.1);
}

.newbie-registration-box-rewards > .newbie-drop-box > .title > .icon{
	width: 28px;
	height: 28px;
	overflow: hidden;
	position: relative;
	margin-left: 10px;
}

.newbie-registration-box-rewards > .newbie-drop-box > .title > .icon > img{
	position: absolute;
	display: block;
	border-radius: 50%;
	width: 100%;
	height: 100%;
}

.newbie-registration-box-rewards > .newbie-drop-box > .title > .text{
	font-family: Beaufort Bold;
	font-size: 18px;
	color: #58524f;
	text-transform: uppercase;
	margin-left: 10px;
}

.newbie-registration-box-rewards > .newbie-drop-box > .title > .arrow{
	margin-left: auto;
	margin-right: 15px;
}

.newbie-registration-box-rewards > .newbie-drop-box > .title > .arrow > span{
	font-family: Beaufort Bold;
	font-size: 14px;
	color: #afadac;
	text-transform: uppercase;
	margin-right: 8px;
}

.newbie-registration-box-rewards > .newbie-drop-box > .title > .arrow > i{
	font-size: 18px;
	color: #8e8785;
}

.newbie-registration-box-rewards > .newbie-drop-box > .box{
	width: 100%;
	padding-left: 43px;
	padding-top: 20px;
	padding-bottom: 20px;
	padding-right: 20px;
	border: 1px solid rgba(0,0,0,0.08);
	border-radius: 20px;
	margin-top: 3px;
	display: none;
}

.newbie-registration-box-rewards > .newbie-drop-box > .box > .item{
	font-family: Roboto;
	font-size: 14px;
	color: #58524f;
	line-height: 30px;
	position: relative;
	cursor: pointer;
}

.newbie-registration-box-rewards > .newbie-drop-box > .box > .item:hover{
	color: #9e4c03;
}

.newbie-registration-box-rewards > .newbie-drop-box > .box > .item:hover .item-desc{
	opacity: 1;
	transform: translateY(0px) scale(1, 1) rotate(0deg);
}

.newbie-registration-box-rewards > .newbie-drop-box > .box > .item > .item-desc{
	position: absolute;
	width: 250px;
	background: #fff;
	box-shadow: 0px 5px 30px rgba(0,0,0,0.2);
	border-radius: 5px;
	border-bottom: 2px solid #eca500;
	left: 0px;
	bottom: calc( 100% + 5px );
	padding: 10px;
	pointer-events: none;
	font-size: 12px;
	line-height: 16px;
	color: #8a807f;
	opacity: 0;
	transition: all .5s ease-in-out;
	transform: translateY(-50px) scale(0.6, 0.6) rotate(20deg);
}

.newbie-registration-box-rewards > .newbie-drop-box > .box > .item > .item-desc:after{
	content: '';
	width: 26px;
	height: 9px;
	position: absolute;
	bottom: -11px;
	left: 20px;
	background: url(../images/icon/arrow_bottom_yellow.png);
}

/* ref-system */
/* -------------------------------------------------------------------------------------------------------------------- */

.ref-system{
	width: calc( 100% - 80px );
	margin: 0 auto;
	position: relative;
}

.ref-system > .text{
	width: 100%;
	border-radius: 20px;
	font-family: Roboto;
	font-size: 16px;
	color: #5f554c;
	line-height: 30px;
	text-align: center;
}

.ref-system > .block{
	width: calc( 50% - 15px );
	margin-top: 40px;
}

.ref-system > .block > .title{
	width: 80%;
	font-family: Beaufort Bold;
	font-size: 22px;
	color: #562200;
	text-transform: uppercase;
	padding-bottom: 25px;
	text-align: center;
	margin: 0 auto;
}

.ref-system > .block > .line{
	width: 100%;
	padding: 10px 10px;
	background: #e9e9e9;
	border-radius: 30px;
	margin-top: 3px;
}

.ref-system > .block > .line > .left,
.ref-system > .block > .line > .right{
	width: 100px;
	text-align: center;
	font-family: Beaufort Bold;
	font-size: 14px;
	color: #564f4f;
}

.ref-system > .block > .line > .center{
	width: calc( 100% - 200px );
	text-align: center;
	font-family: Roboto;
	font-size: 14px;
	color: #564f4f;
	position: relative;
	cursor: pointer;
	transition: all .2s ease-in-out;
}

.ref-system > .block > .line > .center:hover .item-desc{
	opacity: 1;
	transform: translateY(0px) scale(1, 1) rotate(0deg);
}

.ref-system > .block > .line > .center:hover {
	color: #9e4c03;
}

.ref-system > .block > .line-title{
	background: #f7e4c9;
}

.ref-system > .block > .line-title > .center{
	text-align: center;
	font-family: Beaufort Bold;
	font-size: 14px;
	color: #9e4c03;
}

.ref-system > .block > .line-title > .left,
.ref-system > .block > .line-title > .right{
	width: 100px;
	text-align: center;
	font-family: Beaufort Bold;
	font-size: 14px;
	color: #9e4c03;
}

.ref-system > .block > .line-title > .left > span,
.ref-system > .block > .line-title > .right > span{
	width: 100%;
	text-align: center;
	font-family: Beaufort Bold;
	font-size: 14px;
	color: #9e4c03;
	display: block;
}

.ref-system > .block > .line-title > .left > span:first-child,
.ref-system > .block > .line-title > .right > span:first-child{
	display: block;
}

.ref-system > .block > .line-title > .left > span:last-child,
.ref-system > .block > .line-title > .right > span:last-child{
	display: none;
}

.ref-system > .block > .line > .center > .item-desc{
	position: absolute;
	width: 250px;
	background: #fff;
	box-shadow: 0px 5px 30px rgba(0,0,0,0.2);
	border-radius: 5px;
	border-bottom: 2px solid #eca500;
	left: calc(50% - 125px);
	bottom: calc( 100% + 5px );
	padding: 10px;
	pointer-events: none;
	font-size: 12px;
	line-height: 16px;
	color: #8a807f;
	opacity: 0;
	transition: all .5s ease-in-out;
	transform: translateY(-50px) scale(0.6, 0.6) rotate(20deg);
}

.ref-system > .block > .line > .center > .item-desc:after{
	content: '';
	width: 26px;
	height: 9px;
	position: absolute;
	bottom: -11px;
	left: calc( 50% - 13px );
	background: url(../images/icon/arrow_bottom_yellow.png);
}

/* calculator */
/* -------------------------------------------------------------------------------------------------------------------- */

.calculator{
	width: calc( 100% - 80px );
	margin: 0 auto;
	position: relative;
}

.scroll-block{
	width: 100%;
	height: auto;
}

/* resource map */
/* -------------------------------------------------------------------------------------------------------------------- */

.resource-map{
	width: calc( 100% - 80px );
	margin: 0 auto;
	position: relative;
}

.resource-map > .text{
	width: 100%;
	margin-bottom: 35px;
	font-family: Roboto;
	font-size: 16px;
	color: #5f554c;
	line-height: 30px;
	text-align: center;
}

.resource-map > .text-bottom{
	width: 100%;
	margin-top: 35px;
	font-family: Roboto;
	font-size: 16px;
	color: #5f554c;
	line-height: 30px;
	text-align: center;
}

/* cp status server */
/* -------------------------------------------------------------------------------------------------------------------- */

.cp-head-block{
	width: calc( 100% - 355px );
	height: 265px;
	margin-left: auto;
}

.cp-status-server{
	width: 280px;
}

.cp-status-server > .icon{
	width: 75px;
	height: 75px;
	position: relative;
}

.cp-status-server > .icon > img{
	position: absolute;
	width: 100px;
}

.cp-status-server > .info{
	width: calc( 100% - 85px );
}

.cp-status-server > .info > .status{
	width: 100%;
    text-align: center;
    font-family: Beaufort;
    font-size: 24px;
    color: #a22400;
}

.cp-status-server > .info > .status > span{
	font-family: Beaufort;
    font-size: 24px;
    color: #fda301;
}

.cp-status-server > .info > .timer{
	width: 100%;
    text-align: center;
    font-family: Beaufort Bold;
    font-size: 46px;
    color: #562200;
    margin-top: -7px;
}

/* cp structure*/
/* -------------------------------------------------------------------------------------------------------------------- */

.cp-layout{
	width: 100%;
}

.cp-layout > .cp-aside{
	width: 325px;
	align-self: stretch;
}

.cp-layout > .cp-content{
	width: calc( 100% - 355px );
	align-self: stretch;
	background: #fff;
	border-radius: 5px;
	padding-bottom: 30px;
}

.cp-layout > .cp-aside > .cp-user{
	width: 100%;
	height: 185px;
	background: #fff;
	border-radius: 5px;
	margin-bottom: 30px;
	padding: 30px;
}

.cp-layout > .cp-aside > .cp-navigation{
	width: 100%;
	min-height: calc( 100% - 185px - 30px);
	background: #fff;
	border-radius: 5px;
}

.cp-layout > .cp-content > .cp-top-title{
	width: 100%;
	font-family: Beaufort Bold;
	text-transform: uppercase;
	font-size: 24px;
	color: #562200;
	text-align: center;
	padding-top: 23px;
	padding-bottom: 28px;
	position: relative;
	margin-bottom: 30px;
}

.cp-layout > .cp-content > .cp-top-title:after{
	content: '';
	position: absolute;
	width: 100%;
	height: 23px;
	background: url(../images/bg/border-bottom.png) top center;
	left: 0px;
	bottom: -16px;
	pointer-events: none;
}

.cp-layout > .cp-content > .cp-center{
	width: 100%;
	padding: 0px 30px;
}

.cp-layout > .cp-content > .cp-center > .half-block{
	width: calc( 50% - 15px );
}

.cp-layout > .cp-content > .cp-center > *:last-child{
	padding-bottom: 0px !important;
}

.cp-block-title{
	width: 100%;
	padding-bottom: 20px;
	font-family: Beaufort Bold;
	text-transform: uppercase;
	font-size: 20px;
	color: #562200;
	text-align: center;
}

.cp-table{
	width: 100%;
}

.cp-table > .tr{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	position: relative;
	padding: 10px 15px;
	background: #eeeeee;
	border-radius: 20px;
	margin-top: 4px;
}

.cp-table > .tr:nth-child(1){
	background: #fae5cd;
}

.cp-table > .tr:nth-child(1) > .td{
	font-family: Beaufort Bold;
	font-size: 16px;
	color: #634934;
}

.cp-table > .tr > .td{
	position: relative;
	font-family: Roboto;
	font-size: 14px;
	color: #635a52;
}

.cp-table > .tr:nth-child(n+3):nth-child(odd){
	background: #f9f9f9;;
}

.cp-table > .tr > .td:before{
	content: attr(data-label);
	display: none;
}

.cp-pagination{
	width: calc( 100% - 80px );
	margin: 0 auto;
	position: relative;
	margin-top: 20px;
}

.cp-pagination > a{
	width: 30px;
	height: 30px;
	background: #e4deda;
	margin: 0px 3px;
	border-radius: 40px;
	font-family: Beaufort Bold;
	font-size: 16px;
	color: #75665c;
	line-height: 20px;
	transition: all .2s ease-in-out;
}

.cp-pagination > a:hover{
	background: #f3dbcb;
}

.cp-pagination > .active{
	background: linear-gradient(to top, #ff9500, #feb900);
	font-size: 16px;
	color: #82330d;
	text-shadow: 0px -1px 0px #ffcc75;
}

.cp-pagination > .active:hover{
	background: linear-gradient(to top, #ff9500, #feb900);
}

/* cp user*/
/* -------------------------------------------------------------------------------------------------------------------- */

.cp-user > img{
	display: block;
	margin: 0 auto;
}

.cp-user > .desc{
	width: 100%;
	text-align: center;
    font-family: Beaufort Bold;
    font-size: 14px;
    color: #88776d;
    text-transform: uppercase;
    margin-top: 15px;
}

.cp-user > .name{
	width: 100%;
	text-align: center;
    font-family: Beaufort Bold;
    font-size: 22px;
    color: #562200;
    text-transform: uppercase;
	overflow: hidden;
	white-space: nowrap;
    text-overflow: ellipsis;
}

.cp-user > a{
	width: 100px;
	display: block;
	padding: 5px 7px 5px 10px;
	text-align: center;
    font-family: Beaufort;
    font-size: 17px;
    color: #e04141;
    background: rgba(255,255,255,0);
    border-radius: 4px;
    margin: 0 auto;
    transition: all .2s ease-in-out;
}

.cp-user > a:hover{
	background: #f7d9d9;
}

.cp-open-nav{
	width: 100%;
}

/* cp navigation*/
/* -------------------------------------------------------------------------------------------------------------------- */

.cp-navigation > .cp-open-nav{
	width: 100%;
	padding: 25px 25px;
	border-bottom: 1px solid #ededed;
	cursor: pointer;
	background: rgba(255,255,255,0);
	transition: all .2s ease-in-out;
	border-radius: 5px;
	display: none;
}

.cp-navigation > .cp-open-nav:hover{
	background: #faf3ec;
}

.cp-navigation > .cp-open-nav:hover .arrow{
	opacity: 1;
}

.cp-navigation > .cp-open-nav > .icon{
	width: 20px;
	height: 20px;
	position: relative;
}

.cp-navigation > .cp-open-nav > .icon > i{
	position: absolute;
}

.cp-navigation > .cp-open-nav > .text{
	width: calc( 100% - 40px - 32px );
	font-family: Beaufort Bold;
    font-size: 18px;
    color: #4e4139;
    text-transform: uppercase;
    position: relative;
}

.cp-navigation > .cp-open-nav > .arrow{
	width: 20px;
	height: 20px;
	position: relative;
	opacity: 0.4;
	transition: all .2s ease-in-out;
}

.cp-navigation > .cp-open-nav > .arrow > i{
	position: absolute;
}

.cp-navigation > .links{
	width: 100%;
	display: block;
}

.cp-navigation > .links > a{
	width: 100%;
	padding: 25px 25px;
	position: relative;
	background: rgba(255,255,255,0);
	transition: all .2s ease-in-out;
	border-radius: 5px;
}

.cp-navigation > .links > a:not(:last-child){
	border-bottom: 1px solid #ededed;
}

.cp-navigation > .links > a:hover{
	background: #f9f0e5;
}

.cp-navigation > .links > a:hover .text{
	color: #86360b;
}

.cp-navigation > .links > .active{
	background: #fff !important;
}

.cp-navigation > .links > .active:before{
	content: '';
	width: 18px;
	height: 100%;
	position: absolute;
	top: 0px;
	right: -16px;
	background: url(../images/bg/border_right_cp_button.png) center center;
}

.cp-navigation > .links > .active > .text{
	color: #e03503 !important;
}

.cp-navigation > .links > a > .icon{
	width: 20px;
	height: 20px;
	position: relative;
}

.cp-navigation > .links > a > .icon > img{
	position: absolute;
}

.cp-navigation > .links > a > .icon_b{
	width: calc(100% - 170px);
}

.cp-navigation > .links > a > .icon_b > img{
	left: -45px;
}

.cp-navigation > .links > a > .text{
	width: calc( 100% - 20px - 16px );
	font-family: Beaufort Bold;
    font-size: 18px;
    color: #4e4139;
    text-transform: uppercase;
    position: relative;
}

.cp-navigation > .links > a > .text_b{
	/*width: calc( 100% - 20px - 16px - 36px );*/
	width: 75px;
	left: -24px;
	font-family: Beaufort Bold;
	font-size: 18px;
	color: #4e4139;
	text-transform: uppercase;
	position: relative;
}

.cp-navigation > .links > a > .balance{
	position: absolute;
	height: 26px;
	padding: 0px 10px;
	border-radius: 50px;
	right: 20px;
	top: calc( 50% - 13px );
	font-family: Beaufort Bold;
    font-size: 16px;
    color: #fff;
    background: #ff8f00;
}

.cp-navigation > .links > a > .balance2{
	position: absolute;
	height: 26px;
	padding: 0px 10px;
	border-radius: 50px;
	right: 20px;
	top: calc( 50% - 13px );
	font-family: Beaufort Bold;
    font-size: 16px;
    color: #615649;
    background: #eeeeee;
}

/* cp home */
/* -------------------------------------------------------------------------------------------------------------------- */

.cp-user-information{
	width: 100%;
	margin-bottom: 15px;
	padding-bottom: 28px;
	border-bottom: 1px solid #ededed;
}

.cp-user-information > .line{
	width: 100%;
	text-align: center;
	font-size: 16px;
	color: #634934;
	margin-bottom: 10px;
}

.cp-user-information > .line > span{
	font-family: Roboto Bold;
	color: #634934;
	font-size: unset;
}

.cp-user-information > .line.balance{
	font-family: Roboto Bold;
	color: #ff7f00;
}

.cp-user-information > .line > a{
	color: #796963;
	text-decoration: underline;
	transition: all .2s ease-in-out;
	font-size: unset;
}

.cp-user-information > .line > a:hover{
	color: #ff7f00;
}

/* - */

.cp-character-list{
	width: 100%;
}

.cp-character-list > .cp-table > .tr > .td:nth-child(1){
	width: 50%;
	text-align: left;
}

.cp-character-list > .cp-table > .tr:nth-child(n+2) > .td:nth-child(1){
	font-family: Roboto Bold;
}

.cp-character-list > .cp-table > .tr > .td:nth-child(2){
	width: 150px;
	text-align: center;
}

.cp-character-list > .cp-table > .tr > .td:nth-child(2) > i{
	margin-right: 5px;
}

.cp-character-list > .cp-table > .tr:nth-child(1){
}

.cp-character-list > .cp-table > .tr{
}

.cp-character-list > .cp-table > .tr > .td{
}

.cp-character-list > .cp-table > .tr > .td:before{
}

/* - */

.cp-login-history{
	width: 100%;
}

.cp-login-history > .cp-table > .tr > .td:nth-child(1){
	width: 30px;
	text-align: center;
}

.cp-login-history > .cp-table > .tr > .td:nth-child(2){
	width: 50%;
	text-align: left;
}

.cp-login-history > .cp-table > .tr > .td:nth-child(3){
	width: calc( 40% - 30px );
	text-align: left;
}

.cp-login-history > .cp-table > .tr:nth-child(1){
}

.cp-login-history > .cp-table > .tr{
}

.cp-login-history > .cp-table > .tr > .td{
}

.cp-login-history > .cp-table > .tr > .td:before{
}

/* cp action top */
/* -------------------------------------------------------------------------------------------------------------------- */

.action-cp-top{
	width: 100%;
	margin-bottom: 10px;
	/*justify-content: normal;*/
	flex-wrap: nowrap;
}

.action-cp-top > .select-block{
	color: #51423d;
	font-family: Roboto Bold;
	font-size: 16px;
}

.action-cp-top > .select-block > .select{
	width: 55px;
	height: 30px;
	margin: 0px 10px;
}

.action-cp-top > .select-block > .select > .select-selected{
	padding: 0px 5px;
	padding-top: 4px;
	padding-right: 10px;
}

.action-cp-top > .select-block > .select > .select-selected:after{
	right: 4px;
	transform: scale(0.6,0.6);
}

.action-cp-top > .select{
	width: 55px;
	height: 30px;
	margin: 0px 10px;
}

.action-cp-top > .select > .select-selected{
	padding: 0px 5px;
	padding-top: 4px;
	padding-right: 10px;
}

.action-cp-top > .select > .select-selected:after{
	right: 4px;
	transform: scale(0.6,0.6);
}


/* - */

.action-cp-top > .cp-search-block{
	width: auto;
	color: #51423d;
	font-family: Roboto Bold;
	font-size: 16px;
	margin-right: 20px;
}

.action-cp-top > .cp-search-block > input{
	width: 120px;
	height: 30px;
	border-radius: 50px;
	border: 1px solid #e5e5e5;
    background: #f4f4f4;
    text-align: center;
    margin-left: 10px;
    color: #51423d;
    font-size: 16px;
    font-family: Beaufort Bold;

}


.cp-table.action-history{
	width: 100%;
}

.cp-table.action-history > .tr > .td:nth-child(1){
	width: 60px;
	text-align: center;
	font-family: Roboto Bold;
}

.cp-table.action-history > .tr > .td:nth-child(2){
	width: 140px;
	text-align: center;
}

.cp-table.action-history > .tr > .td:nth-child(3){
	width: calc( ( 100% - 300px ) / 4 );
	overflow: hidden;
	position: relative;
	text-align: center;
	cursor: pointer;
}

.cp-table.action-history > .tr > .td:nth-child(3) > span{
	display: block;
	text-align: center;
	white-space: nowrap;
	transition: transform 8s;
	transform: translateX(0px);
}

.cp-table.action-history > .tr > .td:nth-child(3):hover span{
	transform: translateX(-100%);
}

.cp-table.action-history > .tr > .td:nth-child(4){
	width: calc( ( 100% - 300px ) / 5 );
	text-align: center;
}

.cp-table.action-history > .tr:not(:first-child) > .td:nth-child(4){
	color: #a52701;
}

.cp-table.action-history > .tr > .td:nth-child(5){
	width: calc( ( 100% - 300px ) / 5 );
	text-align: center;
}

.cp-table.action-history > .tr:not(:first-child) > .td:nth-child(5){
	color: #f5870a;
}

.cp-table.action-history > .tr > .td:nth-child(6){
	width: calc( ( 100% - 300px ) / 2 );
	overflow: hidden;
	position: relative;
	text-align: center;
	cursor: pointer;
}
.cp-table.action-history > .tr > .td:nth-child(6) > span{
	display: block;
	text-align: center;
	white-space: nowrap;
	transition: transform 8s;
	transform: translateX(0px);
}

.cp-table.action-history > .tr > .td:nth-child(6):hover span{
	transform: translateX(-100%);
}

.cp-table.action-history > .tr:nth-child(1){
}

.cp-table.action-history > .tr{
}

.cp-table.action-history > .tr > .td{
}

.cp-table.action-history > .tr > .td:before{
}

.cp-table.action-history > .tr > .td > input{
	width: 100%;
	height: 24px;
	text-align: center;
	border-radius: 50px;
	border: 1px solid #dcdcdc;
	font-size: 11px;
}

/* cp for action-history2 table */
.cp-table.action-history2{
	width: 100%;
}

.cp-table.action-history2 > .tr > .td:nth-child(1){
	width: 60px;
	text-align: center;
	font-family: Roboto Bold;
}

.cp-table.action-history2 > .tr > .td:nth-child(2){
	width: 140px;
	text-align: center;
}

.cp-table.action-history2 > .tr > .td:nth-child(3){
	width: calc( ( 100% - 300px ) / 5 );
	overflow: hidden;
	position: relative;
	text-align: center;
	cursor: pointer;
}

.cp-table.action-history2 > .tr > .td:nth-child(3) > span{
	display: block;
	text-align: center;
	white-space: nowrap;
	transition: transform 8s;
	transform: translateX(0px);
}

.cp-table.action-history2 > .tr > .td:nth-child(3):hover span{
	transform: translateX(-100%);
}

.cp-table.action-history2 > .tr > .td:nth-child(4){
	width: calc( ( 100% - 300px ) / 6 );
	text-align: center;
}

.cp-table.action-history2 > .tr:not(:first-child) > .td:nth-child(4){
	color: #a52701;
}

.cp-table.action-history2 > .tr > .td:nth-child(5){
	width: calc( ( 100% - 300px ) / 6 );
	text-align: center;
}

.cp-table.action-history2 > .tr:not(:first-child) > .td:nth-child(5){
	color: #f5870a;
}

.cp-table.action-history2 > .tr > .td:nth-child(6){
	width: calc( ( 100% - 300px ) / 6 );
	text-align: center;
}

.cp-table.action-history2 > .tr > .td:nth-child(7){
	width: calc( ( 100% - 300px ) / 3 );
	overflow: hidden;
	position: relative;
	text-align: center;
	cursor: pointer;
}
.cp-table.action-history2 > .tr > .td:nth-child(7) > span{
	display: block;
	text-align: center;
	white-space: nowrap;
	transition: transform 8s;
	transform: translateX(0px);
}

.cp-table.action-history2 > .tr > .td:nth-child(7):hover span{
	transform: translateX(-100%);
}

.cp-table.action-history2 > .tr:nth-child(1){
}

.cp-table.action-history2 > .tr{
}

.cp-table.action-history2 > .tr > .td{
}

.cp-table.action-history2 > .tr > .td:before{
}

.cp-table.action-history2 > .tr > .td > input{
	width: 100%;
	height: 24px;
	text-align: center;
	border-radius: 50px;
	border: 1px solid #dcdcdc;
	font-size: 11px;
}

/* cp settings */
/* -------------------------------------------------------------------------------------------------------------------- */

.ip-defence{
	width: 100%;
	margin-bottom: 30px;
	padding-bottom: 25px;
	border-bottom: 1px solid #ededed;
}

.ip-defence > .text{
	width: 100%;
	font-family: Roboto;
	font-size: 14px;
	color: #7d7670;
	text-align: center;
	line-height: 26px;
}

.ip-defence > .my-ip{
	width: 100%;
	font-family: Beaufort Bold;
    font-size: 22px;
    color: #562200;
    text-transform: uppercase;
    text-align: center;
    margin-top: 20px;
}

.ip-defence > .my-ip > span{
	font-size: unset;
	font-family: unset;
	color: #ff7800;
}

.ip-defence > .stroke-ip{
	width: 100%;
}

.ip-defence > .stroke-ip > .title{
	width: 100%;
	font-family: Beaufort Bold;
    font-size: 16px;
    color: #562200;
    text-transform: uppercase;
    text-align: center;
    margin-top: 20px;
    margin-bottom: 10px;
}

.ip-defence > .stroke-ip > .ip{
	display: inline-block;
	padding: 3px 6px;
	background: #f6f6f6;
	border-radius: 3px;
	font-family: Beaufort Bold;
    font-size: 16px;
    color: #635a52;
    text-transform: uppercase;
    text-align: center;
    margin: 2px;
}

.ip-defence > .stroke-ip > .ip > a{
	color: #ff7800;
	transition: all .2s ease-in-out;
}

.ip-defence > .stroke-ip > .ip > a:hover{
	color: #ff4800;
}

.ip-defence > .insert-ip{
	width: 100%;
	margin-top: 25px;
}

.ip-defence > .insert-ip > form > input{
	width: 250px;
	height: 40px;
	position: relative;
    border-radius: 500px;
    border: 1px solid #e5e5e5;
    background: #f4f4f4;
    text-align: center;
    font-family: Beaufort;
    color: #635a52;
}


.ip-defence > .insert-ip > form > .button{
	width: 200px;
	height: 40px;
	font-size: 16px;
	margin: 5px;
}

/* - */

.cp-change-password{
	width: 100%;
}

.cp-rechange-password-form{
	width: 100%;
}

.cp-rechange-password-form > .items > .input{
	height: 44px;
	margin-top: 0px;
	margin-bottom: 5px;
	overflow: visible;
}

.cp-rechange-password-form > .items > .input > input{
}

.cp-rechange-password-form > .items > .input > .icon{
	width: 43px;
	height: 42px;
	pointer-events: auto;
}

.cp-rechange-password-form > .items > .line{
	width: 100%;
	text-align: center;
	font-family: Roboto;
	font-size: 14px;
	color: #7d7670;
	text-align: center;
	margin: 10px 0px;
}

.cp-rechange-password-form > .items > .input > .icon:hover .item-desc{
	opacity: 1;
	transform: translateY(0px) scale(1, 1) rotate(0deg);
}

.cp-rechange-password-form > .items > .input > .icon > .item-desc{
	position: absolute;
	width: 250px;
	background: #fff;
	box-shadow: 0px 5px 30px rgba(0,0,0,0.2);
	border-radius: 5px;
	border-bottom: 2px solid #eca500;
	left: 0px;
	bottom: calc( 100% + 10px );
	padding: 10px;
	pointer-events: none;
	font-size: 12px;
	line-height: 16px;
	color: #8a807f;
	opacity: 0;
	transition: all .5s ease-in-out;
	transform: translateY(-50px) scale(0.6, 0.6) rotate(20deg);
}

.cp-rechange-password-form > .items > .input > .icon > .item-desc:after{
	content: '';
	width: 26px;
	height: 9px;
	position: absolute;
	bottom: -11px;
	left: 10px;
	background: url(../images/icon/arrow_bottom_yellow.png);
}

.cp-rechange-password-form > .form-button{
	width: 240px;
	height: 45px;
	font-size: 18px;
	margin: 0 auto;
	margin-top: 20px;
}

/* - */

.add-vk-account{
	width: 100%;
}

.add-vk-account > .text{
	width: 100%;
	width: 100%;
	font-family: Roboto;
	font-size: 14px;
	color: #635a52;
	text-align: center;
	line-height: 22px;
}

.add-vk-account > .form-button{
	width: 240px;
	height: 45px;
	font-size: 18px;
	margin: 0 auto;
	margin-top: 20px;
}

.add-tg-account{
	width: 100%;
	margin-top: 10px;
}

.add-tg-account > .text{
	width: 100%;
	width: 100%;
	font-family: Roboto;
	font-size: 14px;
	color: #635a52;
	text-align: center;
	line-height: 22px;
}

.add-tg-account > .form-button{
	width: 240px;
	height: 45px;
	font-size: 18px;
	margin: 0 auto;
	margin-top: 20px;
}

/* cp donate history */
/* -------------------------------------------------------------------------------------------------------------------- */

.cp-table.donate-history{
	width: 100%;
	flex-wrap: nowrap !important;
}

.cp-table.donate-history > .tr > .td:nth-child(1){
	width: 30px;
	text-align: center;
	font-family: Roboto Bold;
}

.cp-table.donate-history > .tr > .td:nth-child(2){
	width: 90px;
	text-align: center;
}

.cp-table.donate-history > .tr:not(:first-child) > .td:nth-child(2){
	color: #ff5f00;
	font-family: Roboto Bold;
}

.cp-table.donate-history > .tr > .td:nth-child(3){
	width: 130px;
	text-align: center;
}

.cp-table.donate-history > .tr > .td:nth-child(4){
	width: 100px;
	text-align: center;
}

.cp-table.donate-history > .tr:not(:first-child) > .td:nth-child(4){
	color: #1678cc;
	font-family: Roboto Bold;
}

.cp-table.donate-history > .tr > .td:nth-child(5){
	width: 140px;
	text-align: center;
}

.cp-table.donate-history > .tr:not(:first-child) > .td:nth-child(5){
	font-family: Roboto Bold;
}

.cp-table.donate-history > .tr > .td:nth-child(6){
	width: 110px;
	text-align: center;
}

.cp-table.donate-history > .tr:not(:first-child) > .td:nth-child(6){
	color: #48aa00;
	font-family: Roboto Bold;
}

.cp-table.donate-history > .tr:nth-child(1){
}

.cp-table.donate-history > .tr{
}

.cp-table.donate-history > .tr > .td{
}

.cp-table.donate-history > .tr > .td:before{
}

/* cp transfer history */
/* -------------------------------------------------------------------------------------------------------------------- */

.cp-table.transfer-history{
	width: 100%;
	flex-wrap: nowrap !important;
}

.cp-table.transfer-history > .tr > .td:nth-child(1){
	width: 30px;
	text-align: center;
	font-family: Roboto Bold;
}


.cp-table.transfer-history > .tr > .td:nth-child(2){
	width: 130px;
	text-align: center;
}


.cp-table.transfer-history > .tr > .td:nth-child(3){
	width: 90px;
	text-align: center;
}

.cp-table.transfer-history > .tr:not(:first-child) > .td:nth-child(3){
	color: #ff5f00;
	font-family: Roboto Bold;
}

.cp-table.transfer-history > .tr > .td:nth-child(4){
	width: 100px;
	text-align: center;
}

.cp-table.transfer-history > .tr:not(:first-child) > .td:nth-child(4){
	color: #285f00;
	font-family: Roboto Bold;
}

.cp-table.transfer-history > .tr > .td:nth-child(5){
	width: 140px;
	text-align: center;
}

.cp-table.transfer-history > .tr:not(:first-child) > .td:nth-child(5){
	font-family: Roboto Bold;
}

.cp-table.transfer-history > .tr:nth-child(1){
}

.cp-table.transfer-history > .tr{
}

.cp-table.transfer-history > .tr > .td{
}

.cp-table.transfer-history > .tr > .td:before{
}

/* cp-balance */
/* -------------------------------------------------------------------------------------------------------------------- */

.cp-banace-info{
	width: 100%;
	text-align: center;
	position: relative;
	padding-bottom: 50px;
}

.cp-banace-info > .balance{
	width: 100%;
	font-family: Beaufort Bold;
    font-size: 22px;
    color: #533724;
    text-transform: uppercase;
    text-align: center;
    margin-top: 10px;
    margin-bottom: 5px;
}

.cp-banace-info > .balance > span{
	font-size: unset;
	font-family: unset;
	color: #ff7800;
}

.cp-banace-info > a{
	color: #796963;
	text-decoration: underline;
	transition: all .2s ease-in-out;
	font-size: #959595;
}

.cp-banace-info > a:hover{
	color: #ff7f00;
}

.cp-banace-info:after {
    content: '';
    position: absolute;
    width: calc( 100% + 60px );
    height: 23px;
    background: url(../images/bg/border-bottom.png) top center;
    left: -30px;
    bottom: -16px;
    pointer-events: none;
}

.cp-balance-other-account {
	width: 100%;
	text-align: center;
	position: relative;
	padding-bottom: 10px;
	padding-top: 10px;
}

.cp-balance-other-account span {
	color: #796963;
	text-decoration: underline;
	transition: all .2s ease-in-out;
	cursor: pointer;
}

/* - */

.cp-add-balance{
	width: 100%;
	margin-top: 50px;
}

.cp-add-balance > .cp-balance-progress{
	width: 100%;
	height: 6px;
	background: #e3e3e3;
	border-radius: 20px;
	position: relative;
	margin-bottom: 38px;
	z-index: 2;
}

.cp-add-balance > .cp-balance-progress > .bonus{
	width: 36px;
	height: 36px;
	border-radius: 50px;
	background: #e3e3e3;
	position: relative;
	margin-top: -15px;
	z-index: 2;
	cursor: pointer;
}

.cp-add-balance > .cp-balance-progress > .bonus:hover{
	z-index: 2;
}

.cp-add-balance > .cp-balance-progress > .bonus.active{
	z-index: 2;
}

.cp-add-balance > .cp-balance-progress > .bonus:hover .item-desc{
	opacity: 1;
}

.cp-add-balance > .cp-balance-progress > .bonus > img{
	position: absolute;
	top: 8px;
	opacity: 0.4;
	transition: all .2s ease-in-out;
}

.cp-add-balance > .cp-balance-progress > .bonus > .count{
	position: absolute;
	top: calc( 100% + 10px );
	font-family: Roboto Bold;
	font-size: 12px;
	color: #868686;
}

.cp-add-balance > .cp-balance-progress > .active > .count{
	color: #ff7200;
}

.cp-add-balance > .cp-balance-progress > .active > img{
	opacity: 1;
}

.cp-add-balance > .cp-balance-progress > .active.bonus > .item-desc{
	opacity: 1;
}

.cp-add-balance > .cp-balance-progress > .bonus > .item-desc{
	width: 160px;
	height: auto;
	padding-bottom: 10px;
	background: #fff;
	border-radius: 5px;
	padding: 10px;
	position: absolute;
	font-size: 12px;
	top: calc( 100% + 10px );
	border-top: 2px solid #feb700;
    box-shadow: 0px 10px 30px rgba(0,0,0,0.1);
    opacity: 0;
    pointer-events: none;
    transition: all .2s ease-in-out;
}

.cp-add-balance > .cp-balance-progress > .bonus > .item-desc:before{
	content: '';
	width: 26px;
	height: 9px;
	position: absolute;
	top: -9px;
	left: calc( 50% - 13px );
	background: url(../images/icon/arrow_bottom_yellow.png) center center;
	transform: scale(1, -1);
}

.cp-add-balance > .cp-balance-progress > .bar{
	width: 0%;
	height: 6px;
	background: linear-gradient(to top, #ea3f00, #ffbc00);
	border-radius: 20px;
	position: absolute;
	left: 0px;
	top: 0px;
	z-index: 1;
	transition: all .2s ease-in-out;
}

/* - */

.cp-donate-form{
	display: block;
	width: 400px;
	margin: 0 auto;
	padding-top: 40px;
	position: relative;
	z-index: 1;
}

.cp-donate-form > .items > .input{
	height: 44px;
	margin-top: 0px;
	margin-bottom: 5px;
	overflow: visible;
}

.cp-donate-form > .items > .input-other-account{
	height: 44px;
	margin-top: 0px;
	margin-bottom: 5px;
	overflow: visible;
}

.cp-donate-form > .items > .input > input{
}

.cp-donate-form > .items > .input-other-account > input{
}

.cp-donate-form> .items > .input > .icon{
	width: 43px;
	height: 42px;
	pointer-events: auto;
}

.cp-donate-form> .items > .input-other-account > .icon{
	width: 43px;
	height: 42px;
	pointer-events: auto;
}

.cp-donate-form> .items > .line{
	width: 100%;
	text-align: center;
	font-family: Beaufort;
    color: #533724;
    font-size: 16px;
    margin-top: 15px;
}

.cp-donate-form > .form-button{
	width: 240px;
	height: 45px;
	font-size: 18px;
	margin: 0 auto;
	margin-top: 20px;
}

.balance-drop-box{
	margin-top: 40px !important;
}

.cp-drop-box{
	width: 100%;
	margin-top: 8px;
}

.cp-drop-box > .title{
	width: 100%;
	height: 50px;
	border-radius: 70px;
	background: #e8e8e8;
	cursor: pointer;
	transition: all .2s ease-in-out;
	box-shadow: 0px 0px 0px rgba(0,0,0,0);
	padding-left: 10px;
	position: relative;
}

.cp-drop-box > .title:hover{
	background: #fff;
	box-shadow: 0px 5px 15px rgba(0,0,0,0.1);
}

.cp-drop-box > .title > .text{
	font-family: Beaufort Bold;
	font-size: 18px;
	color: #58524f;
	text-transform: uppercase;
	margin-left: 10px;
}

.cp-drop-box > .title > .arrow{
	margin-left: auto;
	margin-right: 15px;
}

.cp-drop-box > .title > .arrow > span{
	font-family: Beaufort Bold;
	font-size: 14px;
	color: #afadac;
	text-transform: uppercase;
	margin-right: 8px;
}

.cp-drop-box > .title > .arrow > i{
	font-size: 18px;
	color: #8e8785;
}

.cp-drop-box > .box{
	width: 100%;
	padding-left: 20px;
	padding-top: 20px;
	padding-bottom: 20px;
	padding-right: 20px;
	border: 1px solid rgba(0,0,0,0.08);
	border-radius: 20px;
	margin-top: 3px;
	display: none;
	font-size: 14px;
	line-height: 22px;
	color: #58524f;
}

/* cp alteans to eira */
/* -------------------------------------------------------------------------------------------------------------------- */

.cp-alteans-to-eira{
	width: 100%;
	margin-top: 40px;
}

.cp-alteans-to-eira > .cp-donate-form{
	padding-top: 0px;
}

/* cp insert code */
/* -------------------------------------------------------------------------------------------------------------------- */

.cp-insert-code{
	width: 100%;
	margin-top: 0px;
}

.cp-insert-code > .cp-donate-form{
	padding-top: 0px;
}

/* cp achievement code */
/* -------------------------------------------------------------------------------------------------------------------- */

.cp-achievement-info {
	width: 100%;
	margin-top: 0px;
	position: relative;
}

.cp-achievement-info > .text{
	width: 100%;
	font-family: Roboto;
	font-size: 14px;
	color: #5F554C;
	text-align: center;
	padding-bottom: 10px;
	line-height: 26px;
}

.cp-achievement-info > .text > span {
	color: #f37e00;
}

.cp-achievement-info > .text > a {
	text-decoration: underline;
	color: #f37e00;
}

.cp-achievement-info > .text:last-child {
	margin-bottom: 25px;
}

.cp-achievement-info:after{
	content: '';
	position: absolute;
	width: calc( 100% + 60px );
	height: 23px;
	background: url(../images/bg/border-bottom.png) top center;
	left: -30px;
	bottom: -16px;
	pointer-events: none;
}

.cp-no-achievement{
	opacity: 0.3;
}

.cp-achievement{
	width: 100%;
	margin-top: 25px;
}

.cp-achievement-list {
	width: 100%;
	margin-top: 15px;
}

.cp-achievement-list > .cp-achievement-box {
	margin-bottom: 10px;
}

.cp-achievement-list > .cp-achievement-box > .achievement-icon {
	width: 90px;
	height: 75px;
	padding: 8px;
	border-radius: 5px;
	background: #f7f7f7;
	border: 1px solid #eaeaea;
	position: relative;
	transition: all .2s ease-in-out;
	display: flex;
	justify-content: center;
	align-items: center;
}

.cp-achievement-list > .cp-achievement-box > .achievement {
	width: calc( 100% - 96px );
	height: 75px;
	padding: 15px 18px;
	border-radius: 5px;
	background: #f7f7f7;
	border: 1px solid #eaeaea;
	position: relative;
	transition: all .2s ease-in-out;
}

.cp-achievement-list > .cp-achievement-box > .achievement-icon > .icon {
	/*width: 38px;
	height: 38px;
	border-radius: 5px;*/
}

.cp-achievement-list > .cp-achievement-box > .info {
	/*width: calc( 100% - 50px );
	margin-top: -3px;*/
}

.cp-achievement-list > .cp-achievement-box > .info > .top {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
}

.cp-achievement-list > .cp-achievement-box > .info > .top > .name {
	width: auto;
	font-family: Beaufort Bold;
	font-size: 18px;
	color: #51423d;
	margin-right: 20px;
}

.cp-achievement-list > .cp-achievement-box > .info > .top > .desc {
	width: auto;
	font-family: Roboto Bold;
	font-size: 12px;
	color: #76706f;
	margin-top: 5px;
	background-image: url(../img/slivercoin.svg);
	background-position: center left;
	background-repeat: no-repeat;
	height: 14px;
	padding-left: 17px;
}

.cp-achievement-list > .cp-achievement-box > .info > .bottom {
	width: 100%;
	margin-top: 6px;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
}

.cp-achievement-list > .cp-achievement-box > .info > .bottom > .desc {
	width: auto;
	font-family: Roboto;
	font-size: 12px;
	color: #76706f;
	margin-right: 20px;
}

.cp-achievement-list > .cp-achievement-box > .info > .bottom > .status {
	width: auto;
	font-family: Roboto;
	font-size: 12px;
	color: #76706f;
}

/* cp referal system */
/* -------------------------------------------------------------------------------------------------------------------- */

.cp-ref-info{
	width: 100%;
	position: relative;
	padding-bottom: 40px;
}

.cp-ref-info:after {
    content: '';
    position: absolute;
    width: calc( 100% + 60px );
    height: 23px;
    background: url(../images/bg/border-bottom.png) top center;
    left: -30px;
    bottom: -16px;
    pointer-events: none;
}

.cp-ref-info > .count{
	width: 97px;
	height: 97px;
	background: url(../images/bg/ref_circle_bg.png) center center;
	font-family: Beaufort Bold;
	font-size: 37px;
	color: #562200;
	text-transform: uppercase;
	text-align: center;
	padding-top: 13px;
}

.cp-ref-info > .count > span{
	width: 100%;
	font-size: 12px;
	text-align: center;
	font-family: unset;
	color: unset;
	display: block;
	margin-top: -5px;
}

.cp-ref-info > .info{
	width: calc( 100% - 20px - 97px );
}

.cp-ref-info > .info > .text{
	width: 100%;
	font-family: Roboto;
	font-size: 14px;
	color: #562200;
	text-align: left;
}

.cp-ref-info > .info > .form{
	width: 100%;
	margin-top: 10px;
}

.cp-ref-info > .info > .form > .desc{
	width: 100%;
	font-family: Roboto;
	font-size: 14px;
	color: #817269;
	text-align: left;
	margin-bottom: 5px;
}

.cp-ref-info > .info > .form > input{
	width: 310px;
	height: 36px;
	border: 1px solid #e5e5e5;
    background: #f4f4f4;
    border-radius: 50px;
    color: #76675d;
    font-size: 14px;
    padding: 0px 10px;
}

.cp-ref-info > .info > .form > .copy-button {
	width: 140px;
	height: 36px;
	font-size: 14px;
	margin-left: 10px;
}

/* - */

.cp-referals{
	width: 100%;
	margin-top: 40px;
	position: relative;
	padding-bottom: 40px;
}

.cp-referals:after {
    content: '';
    position: absolute;
    width: calc( 100% + 60px );
    height: 23px;
    background: url(../images/bg/border-bottom.png) top center;
    left: -30px;
    bottom: -16px;
    pointer-events: none;
}

.cp-table.cp-ref-table{
	width: 100%;
}

.cp-table.cp-ref-table > .tr > .td{
	width: 25%;
	text-align: center;
}

.cp-table.cp-ref-table > .tr > .td:nth-child(1){
	width: 70px;
	text-align: center;
}

.cp-table.cp-ref-table > .tr > .td:nth-child(2){
	width: 150px;
	text-align: center;
}

.cp-table.cp-ref-table > .tr:not(:first-child) > .td:nth-child(2){
	font-family: Roboto Bold;
}

.cp-table.cp-ref-table > .tr > .td:nth-child(3){
	width: 150px;
	text-align: center;
}

.cp-table.cp-ref-table > .tr > .td:nth-child(4){
	width: 100px;
	text-align: center;
}

.cp-table.cp-ref-table > .tr:not(:first-child) > .td:nth-child(4){
	font-family: Roboto Bold;
}

.cp-table.cp-ref-table > .tr:nth-child(1){
}

.cp-table.cp-ref-table > .tr{
}

.cp-table.cp-ref-table > .tr > .td{
}

.cp-table.cp-ref-table > .tr > .td:before{
}

/* - */

.ref-description{
	width: 100%;
	font-family: Roboto;
	font-size: 14px;
	color: #5f554c;
	text-align: center;
	margin-top: 40px;
	line-height: 24px;
	margin-bottom: 30px;
}

/* - */

.ref-bonus-block{
	width: 100%;
	margin-bottom: 30px;
}

.cp-table.cp-ref-bonus-table{
	width: 100%;
}

.cp-table.cp-ref-bonus-table > .tr > .td{
	width: 25%;
	text-align: center;
}

.cp-table.cp-ref-bonus-table > .tr > .td:nth-child(1){
	width: 50px;
	text-align: center;
}


.cp-table.cp-ref-bonus-table > .tr > .td:nth-child(2){
	width: calc( 100% - 120px );
	text-align: center;
	cursor: pointer;
}

.cp-table.cp-ref-bonus-table > .tr:not(:first-child) > .td:nth-child(2){
	font-family: Roboto Bold;
}

.cp-table.cp-ref-bonus-table > .tr > .td:nth-child(3){
	width: 70px;
	text-align: center;
}


.cp-table.cp-ref-bonus-table > .tr:nth-child(1){
}

.cp-table.cp-ref-bonus-table > .tr{
}

.cp-table.cp-ref-bonus-table > .tr > .td{
}


.cp-table.cp-ref-bonus-table > .tr > .td:before{
}

.cp-table.cp-ref-bonus-table > .tr > .td:nth-child(2):hover .item-desc{
	opacity: 1;
	transform: translateY(0px) scale(1, 1) rotate(0deg);
}

.cp-table.cp-ref-bonus-table > .tr > .td > .item-desc{
	position: absolute;
	width: 250px;
	background: #fff;
	box-shadow: 0px 5px 30px rgba(0,0,0,0.2);
	border-radius: 5px;
	border-bottom: 2px solid #eca500;
	left: 0px;
	bottom: calc( 100% + 15px );
	padding: 10px;
	pointer-events: none;
	font-size: 12px;
	line-height: 16px;
	color: #8a807f;
	opacity: 0;
	transition: all .5s ease-in-out;
	transform: translateY(-50px) scale(0.6, 0.6) rotate(20deg);
}

.cp-table.cp-ref-bonus-table > .tr > .td > .item-desc:after{
	content: '';
	width: 26px;
	height: 9px;
	position: absolute;
	bottom: -11px;
	left: calc( 50% - 13px );
	background: url(../images/icon/arrow_bottom_yellow.png);
}

.cp-table.cp-auth-history-table > .tr > .td:hover .item-desc{
	opacity: 1;
	transform: translateY(0px) scale(1, 1) rotate(0deg);
}

.cp-table.cp-auth-history-table > .tr > .td > .item-desc{
	position: absolute;
	width: 250px;
	background: #fff;
	box-shadow: 0px 5px 30px rgba(0,0,0,0.2);
	border-radius: 5px;
	border-bottom: 2px solid #eca500;
	left: -50px;
	bottom: calc( 100% + 15px );
	padding: 10px;
	pointer-events: none;
	font-size: 12px;
	line-height: 16px;
	color: #8a807f;
	opacity: 0;
	transition: all .5s ease-in-out;
	transform: translateY(-50px) scale(0.6, 0.6) rotate(20deg);
	text-align: center;
}

.cp-table.cp-auth-history-table > .tr > .td > .item-desc:after{
	content: '';
	width: 26px;
	height: 9px;
	position: absolute;
	bottom: -11px;
	left: calc( 50% - 13px );
	background: url(../images/icon/arrow_bottom_yellow.png);
}

.cp-table.cp-ref-table > .tr > .td:hover .item-desc{
	opacity: 1;
	transform: translateY(0px) scale(1, 1) rotate(0deg);
}

.cp-table.cp-ref-table > .tr > .td > .item-desc{
	position: absolute;
	width: 250px;
	background: #fff;
	box-shadow: 0px 5px 30px rgba(0,0,0,0.2);
	border-radius: 5px;
	border-bottom: 2px solid #eca500;
	left: -50px;
	bottom: calc( 100% + 15px );
	padding: 10px;
	pointer-events: none;
	font-size: 12px;
	line-height: 16px;
	color: #8a807f;
	opacity: 0;
	transition: all .5s ease-in-out;
	transform: translateY(-50px) scale(0.6, 0.6) rotate(20deg);
	text-align: center;
}

.cp-table.cp-ref-table > .tr > .td > .item-desc:after{
	content: '';
	width: 26px;
	height: 9px;
	position: absolute;
	bottom: -11px;
	left: calc( 50% - 13px );
	background: url(../images/icon/arrow_bottom_yellow.png);
}

/* inventory bonus blocks */
/* -------------------------------------------------------------------------------------------------------------------- */

.cp-inv-bonus{
	width: 100%;
	border-radius: 5px;
	background: #f7f7f7;
	border: 1px solid #eaeaea;
	padding: 20px 25px;
	position: relative;
	margin-bottom: 30px;
}

.cp-inv-bonus:before{
	content: '';
	width: 66px;
	height: 66px;
	background: url(../images/bonus_flag.png);
	position: absolute;
	top: -1px;
	right: -1px;
}

/* inventory bonus items */
/* -------------------------------------------------------------------------------------------------------------------- */
.live-date-expired1{
	background: rgba(144, 0, 32, 0.2) !important;
}

.live-date-expired2{
	background: rgba(166, 51, 77, 0.2) !important;
}

.live-date-expired3{
	background: rgba(188, 102, 121, 0.2) !important;
}

.live-date-expired4{
	background: rgba(211, 153, 166, 0.2) !important;
}

.live-date-expired5{
	background: rgba(233, 204, 210, 0.2) !important;
}

.cp-bonus-items > .title{
	width: 100%;
	font-family: Beaufort Bold;
	font-size: 20px;
	color: #562200;
	text-transform: uppercase;
}

.cp-bonus-items > .item-list{
	width: 100%;
	margin-top: 20px;
}

.cp-bonus-items > .item-list > .item{
	width: 100%;
	padding: 3px 9px;
	background: #ececec;
	border: 1px solid #d8d8d8;
	border-radius: 3px;
	margin-bottom: 5px;
	position: relative;
	cursor: pointer;
	transition: all .2s ease-in-out;
}

.cp-bonus-items > .item-list > .item:hover{
	border: 1px solid #b5adad;
}

.cp-bonus-items > .item-list > .item > .check{
	width: 12px;
	height: 12px;
	border-radius: 12px;
	background: #c8c8c8;
	top: 10px;
	right: 10px;
	position: absolute;
}

.cp-bonus-items > .item-list > .item > .check > .marker{
	width: 6px;
	height: 6px;
	background: #f5870a;
	margin: 0 auto;
	margin-top: 3px;
	border-radius: 6px;
	opacity: 0;
}

.cp-bonus-items > .item-list > .item > .icon{
	width: 18px;
	height: 18px;
	border-radius: 3px;
}

.cp-bonus-items > .item-list > .item > .name{
	font-family: Roboto Bold;
	font-size: 14px;
	color: #51423d;
	margin-left: 6px;
	margin-top: 5px;
	margin-bottom: 5px;
}

.cp-bonus-items > .item-list > .item > .count{
	font-family: Roboto Bold;
	font-size: 12px;
	color: #f5870a;
	margin-left: 24px;
	margin-top: 5px;
	margin-bottom: 5px;
}

.cp-bonus-items > .item-list > .item > .select-date,
.cp-bonus-items > .item-list > .item > .live-date{
	font-family: Roboto;
	font-size: 12px;
	color: #76706f;
	margin-left: 24px;
	margin-top: 5px;
	margin-bottom: 5px;
}

.cp-bonus-items > .item-list > .item > .desc{
	font-family: Roboto;
	font-size: 12px;
	color: #76706f;
	margin-left: 24px;
	margin-top: 5px;
	margin-bottom: 5px;
}

.cp-bonus-items > .item-list > .selected{
	background: #f2e8da;
	border: 1px solid #ead2ad;
}

.cp-bonus-items > .item-list > .selected:hover{
	border: 1px solid #f7bf68;
}

.cp-bonus-items > .item-list > .selected > .check > .marker{
	opacity: 1;
}

.cp-bonus-items > .item-list > .button{
	width: 220px;
	height: 34px;
	font-size: 16px;
	margin-top: 20px;
}

/* inventory bonus title */
/* -------------------------------------------------------------------------------------------------------------------- */

.cp-bonus-title > .title{
	width: 100%;
}

.cp-bonus-title > .title > .text{
	font-family: Beaufort Bold;
	font-size: 20px;
	color: #562200;
	text-transform: uppercase;
	margin-right: 24px;
}

.cp-bonus-title > .title > .select-date,
.cp-bonus-title > .title > .live-date{
	font-family: Roboto;
	font-size: 12px;
	color: #76706f;
	margin-right: 24px;
	margin-top: 5px;
	margin-bottom: 5px;
}

.cp-bonus-title > .title-settings{
	width: 100%;
}

.cp-bonus-title > .title-settings > .input-title{
	width: auto;
	margin-right: 30px;
	margin-top: 20px;
}

.cp-bonus-title > .title-settings > .input-title > input{
	width: 520px;
	height: 36px;
	border: 1px solid #cfcfcf;
    background: #e7e7e7;
    border-radius: 50px;
    color: #76675d;
    font-size: 14px;
    padding: 0px 10px;
    text-align: center;
}

.cp-bonus-title > .title-settings > .input-title > .confirm-button{
	width: 175px;
	height: 36px;
	margin-left: 5px;
}

.cp-bonus-title > .title-settings > .title-colors{
	width: 100%;
	margin-right: 30px;
	margin-top: 20px;
}

.cp-bonus-title > .title-settings > .title-colors > .letter-block{
	width: auto;
	height: 36px;
	padding: 4px;
	background: rgba(255,255,255,0);
	cursor: pointer;
	border-radius: 3px;
	transition: all .2s ease-in-out;
}


.cp-bonus-title > .title-settings > .title-colors > .letter-block:hover{
	background: #e7e7e7;
}

.cp-bonus-title > .title-settings > .title-colors > .letter-block > .letter{
	width: 100%;
	font-family: Roboto Bold;
	font-size: 16px;
	margin-bottom: 2px;
	white-space: nowrap;
}

.make-top0 {
	padding-top: 0;
}


.cp-bonus-title > .title-settings > .title-colors > .letter-block > .color{
	width: 8px;
	height: 8px;
	margin: 0 auto;
	border-radius: 20px;
}

.cp-bonus-title > .title-settings > .button{
	width: 180px;
	height: 36px;
	font-size: 16px;
	margin-top: 20px;

}

/* cp inventory */
/* -------------------------------------------------------------------------------------------------------------------- */

.cp-inventory-info {
	width: 100%;
	margin-top: 0px;
	position: relative;
	margin-bottom: 30px;
}

.cp-inventory-info > .text{
	width: 100%;
	font-family: Roboto;
	font-size: 14px;
	color: #5F554C;
	text-align: center;
	padding-bottom: 10px;
	line-height: 26px;
}

.cp-inventory-info > .text > span {
	color: #e04141;
}

.cp-inventory-info > .text > a {
	text-decoration: underline;
	color: #f37e00;
}

.cp-inventory-info > .text:last-child {
	margin-bottom: 25px;
}

.cp-inventory-info:after{
	content: '';
	position: absolute;
	width: calc( 100% + 60px );
	height: 23px;
	background: url(../images/bg/border-bottom.png) top center;
	left: -30px;
	bottom: -16px;
	pointer-events: none;
}

.select-character-block{
	z-index: 3;
}

.select-character{
	width: 150px !important;
	/*transform: translateX(-25px);*/
}

.cp-item-list{
	width: 100%;
	margin-top: 15px;
}

.cp-item-list > .item{
	width: 100%;
	padding: 15px 18px;
	width: 100%;
	border-radius: 5px;
	background: #f7f7f7;
	border: 1px solid #eaeaea;
	position: relative;
	margin-bottom: 10px;
	cursor: pointer;
	transition: all .2s ease-in-out;
}

.cp-item-list > .item:hover{
	border: 1px solid #e8e8e8;
    background: #ffffff;
}

.cp-item-list > .item > .icon{
	width: 38px;
	height: 38px;
	border-radius: 5px;
}

.cp-item-list > .item > .info{
	width: calc( 100% - 50px );
	margin-top: -3px;
}

.cp-item-list > .item  > .info > .top{
	width: 100%;
}

.cp-item-list > .item  > .info > .top > .name{
	width: auto;
	font-family: Beaufort Bold;
	font-size: 18px;
	color: #51423d;
	margin-right: 20px;
}

.cp-item-list > .item  > .info > .top > .desc{
	width: auto;
	font-family: Roboto;
	font-size: 12px;
	color: #76706f;
	margin-top: 5px;
}

.cp-item-list > .item  > .info > .bottom{
	width: 100%;
	margin-top: 6px;
}

.cp-item-list > .item  > .info > .bottom > .count{
	width: auto;
	font-family: Roboto;
	font-size: 12px;
	color: #76706f;
	margin-right: 20px;
}

.cp-item-list > .item  > .info > .bottom > .count > span{
	font-family: Roboto Bold;
	font-size: 12px;
	color: #f5780a;
}

.cp-item-list > .item  > .info > .bottom > .select-date,
.cp-item-list > .item  > .info > .bottom > .live-date{
	width: auto;
	font-family: Roboto;
	font-size: 12px;
	color: #76706f;
	margin-right: 20px;
}

.cp-item-list > .item > .select-status{
	width: 30px;
	height: 30px;
	background: #eaeaea;
	position: absolute;
	top: 20px;
	right: 20px;
	overflow: hidden;
	border-radius: 30px;
}

.cp-item-list > .item > .select-status > .check-icon{
	width: 30px;
	height: 30px;
	border-radius: 30px;
	background: #d7d6d6;
	color: #c6c4c4;
	position: absolute;
	z-index: 2;
	top: 0px;
	right: 0px;
}

#itemslist.cp-item-list > .item > .select-status > .check-icon{
	background: #f5870a;
	color: #fff;
}
#itemslist a {
	font-family: Beaufort Bold;
	font-size: 12px;
	color: #562200;
	text-shadow: 0 -1px 0 #ffcc75;
	width: calc( 100% - 40px );
	height: 100%;
	text-transform: uppercase;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	padding-top: 10px;
	transition: all .2s ease-in-out;
}

.cp-restoreitem-info{
	width: 100%;
	text-align: center;
	position: relative;
	padding-bottom: 30px;
}

.cp-restoreitem-info > .cost{
	width: 100%;
	font-family: Beaufort Bold;
	font-size: 22px;
	color: #533724;
	text-transform: uppercase;
	text-align: center;
	margin-top: 10px;
	margin-bottom: 5px;
}

.cp-restoreitem-info > .cost > span{
	font-size: unset;
	font-family: unset;
	color: #ff7800;
}

.cp-restoreitem-info > a{
	color: #796963;
	text-decoration: underline;
	transition: all .2s ease-in-out;
	font-size: #959595;
}

.cp-restoreitem-info > a:hover{
	color: #ff7f00;
}

.cp-restoreitem-info:after {
	content: '';
	position: absolute;
	width: calc( 100% + 60px );
	height: 23px;
	background: url(../images/bg/border-bottom.png) top center;
	left: -30px;
	bottom: -16px;
	pointer-events: none;
}

/*----select all ----*/
.cp-search-block > .select-all-status{
	width: 30px;
	height: 30px;
	border-radius: 50px;
	background: #eaeaea;
	/*position: absolute;*/
	margin-left: 10px;
	top: 20px;
	right: 20px;
	overflow: hidden;
	border-radius: 30px;
}

.cp-search-block > .select-all-status > .check-all-icon{
	width: 30px;
	height: 30px;
	border-radius: 30px;
	background: #d7d6d6;
	color: #c6c4c4;
	/*position: absolute;
	z-index: 2;*/
	top: 0px;
	right: 0px;
}

.cp-search-block.selected > .select-all-status > .check-all-icon{
	background: #f5870a;
	color: #fff;
}
/*-------------------*/

.cp-item-list > .item > .select-status > input{
	width: 100%;
	height: 100%;
	padding-right: 25px;
	display: block;
	z-index: 1;
	border: 1px solid #c3c1c1;
	border-radius: 30px;
	background: none;
	text-align: center;
}

.cp-item-list > .selected{
	border: 1px solid #ffdeb9;
	background: #fff8ef;
	transition: 0s;
}

.cp-item-list > .selected:hover{
	border: 1px solid #ffdeb9;
	background: #fff8ef;
}

/*.cp-item-list > .selected > .select-status{
	width: 100px;
}*/

.cp-item-list > .selected > .select-status > .check-icon{
	background: #f5870a;
	color: #fff;
}


.cp-item-list > .item > .desc-item{
	width: 200px;
	position: absolute;
	width: 250px;
	background: #fff;
	box-shadow: 0px 5px 30px rgba(0,0,0,0.2);
	border-radius: 5px;
	padding: 10px;
	pointer-events: none;
	font-size: 12px;
	line-height: 16px;
	color: #8a807f;
	opacity: 0;
	z-index: 3;
}

.cp-item-list > .item > .desc-item > .icon{
	width: 38px;
	height: 38px;
	border-radius: 5px;
}

.cp-item-list > .item > .desc-item > .info{
	width: calc( 100% - 45px );
}

.cp-item-list > .item > .desc-item > .info > * > font{
	font-family: Roboto Bold;
}

.cp-item-list > .item > .desc-item > .info > .name{
	width: auto;
	font-family: Beaufort Bold;
	font-size: 18px;
	color: #51423d;
	margin-right: 20px;
	margin-top: 2px;
}

.cp-item-list > .item > .desc-item > .info > .type{
	width: 100%;
	margin-top: 15px;
}

.cp-item-list > .item > .desc-item > .info > .lvl{
	width: 100%;
	margin-top: 5px;
}

.cp-item-list > .item > .desc-item > .info > .class{
	width: 100%;
	margin-top: 5px;
}

.cp-item-list > .item > .desc-item > .info > .desc{
	width: auto;
	font-family: Roboto;
	font-size: 12px;
	color: #76706f;
	margin-top: 10px;
}

.cp-inventory-bottom{
	width: 100%;
	height: 30px;
	margin-top: 10px;
	position: relative;
}

.cp-inventory-bottom > .cp-pagination{
	margin-top: 0px;
	z-index: 1;
}

.cp-inventory-bottom > .send-button{
	width: 115px;
	height: 30px;
	font-size: 16px;
	position: absolute;
	right: 0px;
	top: 0px;
	display: none;
	z-index: 2;
}

/* cp shop filters */
/* -------------------------------------------------------------------------------------------------------------------- */

.cp-shop-filters{
	width: 100%;
	margin-bottom: 18px;
}

.cp-shop-filters > .line{
	width: 100%;
	position: relative;
}

.cp-shop-filters > .line > .button{
	width: auto;
	height: 32px;
	text-transform: uppercase;
	padding: 0px 10px;
	font-size: 14px;
	margin: 5px;
	position: relative;
	z-index: 1;
	background: linear-gradient(to top, #ecdcc5, #f0e3c3);
	color: #a25830;
	box-shadow: none;
}

.cp-shop-filters > .line > .button:hover{
	filter: brightness(110%);
}

.cp-shop-filters > .line > .active{
	background: linear-gradient(to top, #ff9500, #feb900);
	color: #562200;
	text-shadow: 0px -1px 0px #ffcc75;
}

.cp-search-shop{
	width: 32px;
	height: 32px;
	position: relative;
	z-index: 2;
}

.cp-search-shop > .open-button{
	width: 100%;
	height: 100%;
	border-radius: 50px;
	background: #dfdede;
	position: relative;
	font-size: 16px;
	color: #562200;
	cursor: pointer;
	transition: all .2s ease-in-out;
}

.cp-search-shop > .open-button:hover{
	filter: brightness(110%);
}

.cp-search-shop > .open-button > i{
	position: absolute;
	display: none;
}


.cp-search-shop > .search-input{
	width: 120px;
	height: 100%;
	position: absolute;
	right: -125px;
	top: 0px;
	display: none;
}

.cp-search-shop > .search-input > input{
	width: 100%;
	height: 100%;
	border: 1px solid #cfcfcf;
    background: #e7e7e7;
    border-radius: 50px;
    color: #76675d;
    font-size: 14px;
    padding: 0px 10px;
    text-align: center;
}

.cp-search-shop > .open-button > .active{
	display: block;
}

.cp-search-shop > .active{
	display: flex !important;
}

/* - */

.cp-shop-item-list{
	width: calc( 100% + 30px );
	margin-left: -15px;
	margin-right: -15px;
	position: relative;
}

#show_discount.item:before{
	content: '';
	width: 66px;
	height: 66px;
	background: url(../images/discount.svg);
	position: absolute;
	top: -1px;
	right: -1px;
}

#show_discount.item:after{
	content: attr(data-after-content);
	color: white;
	width: 66px;
	height: 66px;
	position: absolute;
	top: -1px;
	right: -1px;
	font-size: 12px;
	padding-left: 9px;
	text-align: center;
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
}

.cp-shop-item-list > .item{
	width: calc( ( 100% - 120px ) / 4 );
	margin: 15px;
	padding: 15px;
	background: #f7f7f7;
	border: 1px solid #eaeaea;
	border-radius: 5px;
	align-self: stretch;
	position: relative;
	z-index: 1;
	cursor: default;
}

.cp-shop-item-list > .item:hover{
	z-index: 2;
}

.cp-shop-item-list > .item > .icon{
	width: 38px;
	height: 38px;
	border-radius: 5px;
	margin: 0 auto;
	margin-top: 10px;
	display: block;
}

.cp-shop-item-list > .item > .name{
	width: 100%;
	font-family: Beaufort Bold;
	font-size: 18px;
	color: #51423d;
	text-align: center;
	line-height: 20px;
	margin-top: 15px;
	height: 60px;
}

.cp-shop-item-list > .item > .price{
	width: 100%;
	font-family: Roboto Bold;
	font-size: 14px;
	color: #5f554c;
	text-align: center;
	margin-top: 10px;
}

.cp-shop-item-list > .item > .price > .button {
	height: 15px;
	width: 15px;
	display: inline-block;
	font-size: 12px;
}

.cp-shop-item-list > .item > .button{
	width: 100%;
	height: 32px;
	text-transform: uppercase;
	padding: 0px 10px;
	font-size: 14px;
	margin-top: 15px;
	margin-bottom: 5px;
}

.cp-shop-item-list > .item > .desc-item{
	width: 200px;
	position: absolute;
	width: 250px;
	background: #fff;
	box-shadow: 0px 5px 30px rgba(0,0,0,0.2);
	border-radius: 5px;
	padding: 10px;
	pointer-events: none;
	font-size: 12px;
	line-height: 16px;
	color: #8a807f;
	opacity: 0;
	z-index: 3;
}

.cp-shop-item-list > .item > .desc-item > .icon{
	width: 38px;
	height: 38px;
	border-radius: 5px;
}

.cp-shop-item-list > .item > .desc-item > .info{
	width: calc( 100% - 45px );
}

.cp-shop-item-list > .item > .desc-item > .info > * > font{
	font-family: Roboto Bold;
}

.cp-shop-item-list > .item > .desc-item > .info > .name{
	width: auto;
	font-family: Beaufort Bold;
	font-size: 18px;
	color: #51423d;
	margin-right: 20px;
	margin-top: 2px;
}

.cp-shop-item-list > .item > .desc-item > .info > .type{
	width: 100%;
	margin-top: 15px;
}

.cp-shop-item-list > .item > .desc-item > .info > .lvl{
	width: 100%;
	margin-top: 5px;
}

.cp-shop-item-list > .item > .desc-item > .info > .class{
	width: 100%;
	margin-top: 5px;
}

.cp-shop-item-list > .item > .desc-item > .info > .desc{
	width: auto;
	font-family: Roboto;
	font-size: 12px;
	color: #76706f;
	margin-top: 10px;
}

/* shop wnd */
/* -------------------------------------------------------------------------------------------------------------------- */

.wnd-bg{
	width: 100%;
	height: 100vh;
	position: fixed;
	top: 0px;
	left: 0px;
	z-index: 100;
	background: rgba(255,255,255,0.8);
	display: none;
}

.wnd-buy-item{
	width: 470px;
	height: 200px;
	background: #fff;
	border-radius: 5px;
	box-shadow: 0px 0px 50px rgba(0,0,0,0.3);
	position: fixed;
	top: calc( 50vh - 100px );
	left: calc( 50% - 235px );
	z-index: 101;
	padding: 30px;
	display: none;
}

.wnd-buy-item > .icon{
	width: 38px;
	height: 38px;
	display: block;
}

.wnd-buy-item > .info{
	width: calc( 100% - 50px );
}

.wnd-buy-item > .info > .name{
	width: 100%;
	font-family: Beaufort Bold;
	font-size: 18px;
	color: #51423d;
	margin-top: -3px;
}

.wnd-buy-item > .info > .price{
	width: 100%;
	font-family: Roboto Bold;
	font-size: 14px;
	color: #f5870a;
}

.wnd-buy-item > .info > .setting{
	width: 100%;
	margin-top: 15px;
}

.wnd-buy-item > .info > .setting > .block{
	width: 50%;
	padding-right: 20px;
	align-self: stretch;
	font-family: Roboto;
	font-size: 14px;
	color: #a19a98;
}

.wnd-buy-item > .info > .setting > .block:nth-child(1){
}

.wnd-buy-item > .info > .setting > .block > input{
	width: 100%;
	height: 32px;
	border: 1px solid #cfcfcf;
    background: #e7e7e7;
    border-radius: 50px;
    color: #76675d;
    font-size: 14px;
    padding: 0px 10px;
    text-align: center;
}

.wnd-buy-item > .info > .setting > .block > .button{
	width: 120px;
	height: 36px;
	font-size: 16px;
}

.wnd-buy-item > .info > .setting > .block > span{
	font-family: Roboto Bold;
	font-size: 14px;
	color: #f5870a;
	margin-left: 5px;
}

.close-wnd{
	width: 20px;
	height: 20px;
	font-size: 20px;
	color: #9e9e9e;
	position: absolute;
	top: 15px;
	right: 15px;
	cursor: pointer;
	transition: all .2s ease-in-out;
}

.close-wnd:hover{
	color: #d02c00;
}

/* cp stat */
/* -------------------------------------------------------------------------------------------------------------------- */

.cp-switch-stat{
	width: 100%;
	border-bottom: 1px solid #eceae3;
	padding-bottom: 25px;
	margin-bottom: 30px;
}

.cp-switch-stat > .button{
	width: auto;
	height: 32px;
	text-transform: uppercase;
	padding: 0px 20px;
	font-size: 14px;
	margin: 5px;
	position: relative;
	z-index: 1;
	background: linear-gradient(to top, #ecdcc5, #f0e3c3);
	color: #a25830;
	box-shadow: none;
}

.cp-switch-stat > .button:hover{
	filter: brightness(110%);
}

.cp-switch-stat > .active{
	background: linear-gradient(to top, #ff9500, #feb900);
	color: #562200;
	text-shadow: 0px -1px 0px #ffcc75;
}

.cp-stat-tables{
	width: 100%;
	position: relative;
}

.cp-stat-tables > .table{
	width: 100%;
	transition: all .3s ease-in-out;
    position: absolute;
    top: 0px;
    left: 0px;
    opacity: 0;
    pointer-events: none;
}

.cp-stat-tables > .active{
	opacity: 1;
    position: relative;
    pointer-events: auto;
}

.cp-stat-tables > .table > .action-cp-top > .cp-stat-pages-info{
	text-align: center;
	font-size: 14px;
}

/* cp stat lvl */

.cp-table.cp-top-lvl{
	width: 100%;
}

.cp-table.cp-top-lvl > .tr > .td{
	text-align: center;
}

.cp-table.cp-top-lvl > .tr > .td:nth-child(1){
	width: 40px;
	text-align: center;
	font-family: Roboto Bold;
}

.cp-table.cp-top-lvl > .tr > .td:nth-child(2){
	width: 25%;
	text-align: left;
}


.cp-table.cp-top-lvl > .tr > .td:nth-child(3){
	width: 50%;
	text-align: center;
}

.cp-table.cp-top-lvl > .tr > .td:nth-child(4){
	width: 70px;
	text-align: center;
}

.cp-table.cp-top-lvl > .tr:not(:first-child) > .td:nth-child(4){
	font-family: Roboto Bold;
	color: #547300;
}

.cp-table.cp-top-lvl > .tr:not(:first-child) > .td:nth-child(4){
	font-family: Roboto Bold;
}

.cp-table.cp-top-lvl > .tr:nth-child(1){
}

.cp-table.cp-top-lvl > .tr{
}

.cp-table.cp-top-lvl > .tr > .td{
}

.cp-table.cp-top-lvl > .tr > .td:before{
}

/* cp stat lvl */

.cp-table.cp-top-online{
	width: 100%;
}

.cp-table.cp-top-online > .tr > .td{
	text-align: center;
}

.cp-table.cp-top-online > .tr > .td:nth-child(1){
	width: 40px;
	text-align: center;
	font-family: Roboto Bold;
}

.cp-table.cp-top-online > .tr > .td:nth-child(2){
	width: 25%;
	text-align: left;
}


.cp-table.cp-top-online > .tr > .td:nth-child(3){
	width: 25%;
	text-align: center;
}

.cp-table.cp-top-online > .tr > .td:nth-child(4){
	width: 25%;
	text-align: center;
}

.cp-table.cp-top-online > .tr:not(:first-child) > .td:nth-child(4){
	font-family: Roboto Bold;
	color: #547300;
}

.cp-table.cp-top-online > .tr:not(:first-child) > .td:nth-child(4){
	font-family: Roboto Bold;
}

.cp-table.cp-top-online > .tr:nth-child(1){
}

.cp-table.cp-top-online > .tr{
}

.cp-table.cp-top-online > .tr > .td{
}

.cp-table.cp-top-online > .tr > .td:before{
}

/* cp stat pk */

.cp-table.cp-top-pk{
	width: 100%;
}

.cp-table.cp-top-pk > .tr > .td{
	text-align: center;
}

.cp-table.cp-top-pk > .tr > .td:nth-child(1){
	width: 40px;
	text-align: center;
	font-family: Roboto Bold;
}

.cp-table.cp-top-pk > .tr > .td:nth-child(2){
	width: 25%;
	text-align: left;
}

.cp-table.cp-top-pk > .tr > .td:nth-child(3){
	width: 25%;
	text-align: center;
}

.cp-table.cp-top-pk > .tr > .td:nth-child(4){
	width: 25%;
	text-align: center;
}

.cp-table.cp-top-pk > .tr:not(:first-child) > .td:nth-child(4){
	font-family: Roboto Bold;
	color: #ff3636;
}

.cp-table.cp-top-pk > .tr:not(:first-child) > .td:nth-child(4){
	font-family: Roboto Bold;
}

.cp-table.cp-top-pk > .tr:nth-child(1){
}

.cp-table.cp-top-pk > .tr{
}

.cp-table.cp-top-pk > .tr > .td{
}

.cp-table.cp-top-pk > .tr > .td:before{
}

/* cp stat guilds */

.cp-table.cp-top-guilds{
	width: 100%;
}

.cp-table.cp-top-guilds > .tr > .td{
	text-align: center;
}

.cp-table.cp-top-guilds > .tr > .td:nth-child(1){
	width: 40px;
	text-align: center;
	font-family: Roboto Bold;
}

.cp-table.cp-top-guilds > .tr > .td:nth-child(2){
	width: 16%;
	text-align: left;
}

.cp-table.cp-top-guilds > .tr > .td:nth-child(3){
	width: 20%;
	text-align: center;
}

.cp-table.cp-top-guilds > .tr > .td:nth-child(4){
	width: 80px;
	text-align: center;
}

.cp-table.cp-top-guilds > .tr > .td:nth-child(5){
	width: 80px;
	text-align: center;
}

.cp-table.cp-top-guilds > .tr > .td:nth-child(6){
	width: 80px;
	text-align: center;
}

.cp-table.cp-top-guilds > .tr > .td:nth-child(7){
	width: 80px;
	text-align: center;
}


.cp-table.cp-top-guilds > .tr:nth-child(1){
}

.cp-table.cp-top-guilds > .tr{
}

.cp-table.cp-top-guilds > .tr > .td{
}

.cp-table.cp-top-guilds > .tr > .td:before{
}

/* cp silver */
/* -------------------------------------------------------------------------------------------------------------------- */

.silver-text{
	width: 100%;
	text-align: center;
	margin-top: 40px;
	font-size: 14px;
	line-height: 26px;
}

.silver-text > a {
	text-decoration: underline;
	color: #f37e00;
}

/* footer */
/* -------------------------------------------------------------------------------------------------------------------- */

footer{
	width: 100%;
	position: relative;
	z-index: 1;
	margin: 0 auto;
	margin-top: 60px;
	background: url(../images/bg/footer_bg.webp) top center no-repeat #dcd8d9;
}

footer > .footer-content{
	width: 1240px;
	position: relative;
	z-index: 1;
	margin: 0 auto;
}

footer > .footer-content > .top{
	width: 100%;
	padding-bottom: 40px;
	padding-top: 40px;
	border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

footer > .footer-content > .top > .cpr{
	width: 400px;
}

footer > .footer-content > .top > .cpr > .logo{
	opacity: 0.7;
}

footer > .footer-content > .top > .cpr > .title{
	width: 100%;
	font-family: Roboto Bold;
	font-size: 12px;
	color: #897f7c;
	margin-top: 20px;
}

footer > .footer-content > .top > .cpr > .text{
	width: 100%;
	font-family: Roboto;
	font-size: 12px;
	color: #bbb3b0;
	margin-top: 12px;
}

footer > .footer-content > .top > .cpr > .text > a{
	color: #bbb3b0;
}

footer > .footer-content > .top > .cpr > .text > a:hover{
	color: #d34e1f;
}

footer > .footer-content > .top > .cpr > .unsimple{
	width: 152px;
	opacity: 0.4;
	display: block;
	margin-top: 20px;
	transition: all .2s ease-in-out;
}

footer > .footer-content > .top > .nav-block{
	width: auto;
}

footer > .footer-content > .top > .nav-block:not(:last-child){
}

footer > .footer-content > .top > .nav-block:nth-child(3){
}

footer > .footer-content > .top > .nav-block:nth-child(2){
}

footer > .footer-content > .top > .nav-block:nth-child(2),
footer > .footer-content > .top > .nav-block:nth-child(3){
}

footer > .footer-content > .top > .nav-block:nth-child(4),
footer > .footer-content > .top > .nav-block:nth-child(5){
}

footer > .footer-content > .top > .nav-block > .title{
	width: 100%;
	font-family: Roboto Bold;
	font-size: 18px;
	color: #947764;
}

footer > .footer-content > .top > .nav-block > .items{
	width: auto;
	line-height: 28px;
	padding-top: 8px;
}

footer > .footer-content > .top > .nav-block > .items > a{
	width: auto;
	font-family: Roboto;
	font-size: 13px;
	color: #a19591;
	text-transform: uppercase;
	transition: all .2s ease-in-out;
}

footer > .footer-content > .top > .nav-block > .items > a:hover{
	color: #d34e1f;
}

footer > .footer-content > .top > .cpr > .unsimple:hover{
	opacity: 1;
}

footer > .footer-content > .payments{
	width: calc( 100% + 40px );
	margin-left: -20px;
	margin-top: 20px;
	padding-bottom: 30px;
}

footer > .footer-content > .payments > img{
	margin: 20px;
	transition: all .2s ease-in-out;
}

footer > .footer-content > .payments > img:hover{
	filter: brightness(80%);
}

#promo_code {
	text-transform: uppercase;
}

.silver {
	background-image: url(../img/slivercoin.svg);
	background-position: center left;
	background-repeat: no-repeat;
	height:14px;
	padding-left:17px;
}

.gold {
	height:14px;
	font-size: 15px;
	padding-left:15px;
	color: #f3ac4d;
}

.vk-title {
	width: 100%;
	font-family: Beaufort Bold;
	font-size: 16px;
	color: #562200;
	text-transform: uppercase;
	text-align: center;
	margin-top: 15px;
	margin-bottom: 15px;
}

.tg-title {
	width: 100%;
	font-family: Beaufort Bold;
	font-size: 16px;
	color: #562200;
	text-transform: uppercase;
	text-align: center;
	margin-top: 15px;
	margin-bottom: 15px;
}

.pay-type-group{
	position: relative;
	width: 100%;
	text-align: center;
}

.pay-type-group > .pay-btn {
	display: inline-block;
	margin-left: 20px;
	margin-top: 10px;
}

.payment-text {
	width: 100%;
	font-family: Beaufort Bold;
	font-size: 22px;
	color: #533724;
	text-transform: uppercase;
	text-align: center;
	margin-top: 10px;
	margin-bottom: 10px;
}

.select-pay-type {
	width: 100%;
	font-family: Beaufort Bold;
	font-size: 20px;
	color: #533724;
	text-transform: uppercase;
	text-align: center;
	margin-top: 30px;
	margin-bottom: 10px;
}
.cp-banace-info-result {
	width: 100%;
	text-align: center;
	position: relative;
}

.balance-success {
	color: #6db123;
	width: 100%;
	font-family: Beaufort Bold;
	font-size: 22px;
	text-transform: uppercase;
	text-align: center;
	margin-top: 10px;
	margin-bottom: 5px;
}

.balance-fail {
	color: #ec2720;
	width: 100%;
	font-family: Beaufort Bold;
	font-size: 22px;
	text-transform: uppercase;
	text-align: center;
	margin-top: 10px;
	margin-bottom: 5px;
}

.balance-presents {
	width: 100%;
	font-family: Beaufort Bold;
	font-size: 22px;
	color: #533724;
	text-transform: uppercase;
	text-align: center;
	margin-top: 20px;
	margin-bottom: 10px;
}

.balance-presents > a {
	font-size: 22px;
	font-family: Beaufort Bold;
	text-decoration: underline;
	color: #f37e00;
}

.pay-type-group > .pay-btn > .check{
	width: 18px;
	height: 18px;
	border-radius: 12px;
	background: #c8c8c8;
	top: 10px;
	right: 10px;
	display: inline-block;
	vertical-align: middle;
}

.pay-type-group > .pay-btn > .check > .marker{
	width: 12px;
	height: 12px;
	background: #f5870a;
	margin: 0 auto;
	margin-top: 3px;
	border-radius: 6px;
	opacity: 0;
}

.pay-type-group > .selected > .check > .marker{
	opacity: 1;
}

.pay-type-group > .pay-btn > .text {
	display: inline-block;
	text-align: center;
	font-family: Beaufort;
	color: #533724;
	font-size: 16px;
}

.gradient {
	background: linear-gradient(to right, #562200, #ff9500);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

.roulette-text {
	width: 100%;
	font-family: Beaufort Bold;
	font-size: 22px;
	color: #533724;
	text-transform: uppercase;
	text-align: center;
	margin-bottom: 10px;
}

.roulette-bottom-border {
	border-top: 1px solid #ededed;
	padding-top: 15px;
}

.cp-roulette-item-list {
	width: calc( 100% + 30px );
	margin-left: 15px;
	margin-right: 15px;
	position: relative;
}

.cp-roulette-item-list > .item {
	width: calc( ( 100% - 120px ) / 6 );
	margin: 5px;
	padding: 5px;
	background: #f7f7f7;
	border: 1px solid #eaeaea;
	border-radius: 5px;
	align-self: stretch;
	position: relative;
	z-index: 1;
	cursor: default;
}

.cp-roulette-item-list > .item > .icon {
	width: 38px;
	height: 38px;
	border-radius: 5px;
	margin: 0 auto;
	margin-top: 10px;
	display: block;
}

.cp-roulette-item-list > .item > .name {
	width: 100%;
	font-family: Beaufort Bold;
	font-size: 16px;
	color: #51423d;
	text-align: center;
	line-height: 18px;
	margin-top: 10px;
	margin-bottom: 10px;
}

.roulette-box {
	overflow: hidden;
	height: 140px;
	width: 100%;
	border: 1px solid #ededed;
	/*margin: 15px;*/
	position: relative;
}

.roulette-box > .boxes {
	width: 1000%;
	height: 100px;
	margin: 20px 0;

	list-style: none;
	display: inline-block;
	content: "";
}

.roulette-box > .boxes > .tape {
	position: relative;
	right: 75px;
	height: 100px;
	width: 100px;
	border: 1px solid #ededed;
	margin-right: 5px;

	list-style: none;
	display: inline-block;
	content: "";
}

.roulette-box > .win {
	position: absolute;
	top: 10px;
	left: 49.5%;
	border-left: 3px solid #ff8f00;
	height: 120px;
	box-shadow: 0 0 1px 1px rgba(255,143,0,0.3);
}

.roulette-box > .boxes > .tape > .tape-img {
	margin: 0px;
	padding: 0px;
	width: 100px;
	height: 100px;
	position: relative;
	outline: none;
}

.roulette-button {
	width: 260px;
	margin: 20px;
}

.text-content-404 {
	width: calc( 100% - 80px );
	margin: 0 auto;
	position: relative;
	text-align: center;
}

.text-content-404 > .text-404 {
	font-family: Beaufort Bold;
	color: #562200;
	margin-top: -45px;
	font-size: 200px;
}

.buttons-404 {
	margin-top: 20px;
}

.buttons-404 > a {
	padding: 0px 35px;
}

.action-description {
	text-align: center;
	margin-bottom: 55px;
	font-family: Beaufort Bold;
	color: #4a4646;
	font-size: 20px;
}

.action-description > span {
	font-family: Beaufort Bold;
	color: #2FBC23;
	font-size: 20px;
}

.xmasbtn {
	background: url(../images/xmas/button.png) top center no-repeat;
	position: fixed;
	top: 105px;
	left: 0;
	height: 303px;
	width: 118px;
	display: block;
	text-decoration: none;
	background-size: contain;
	cursor:pointer;
	z-index: 3;
}

.summerbtn {
	background: url(../images/summer/button.png) top center no-repeat;
	position: fixed;
	top: 105px;
	left: -4px;
	height: 303px;
	width: 118px;
	display: block;
	text-decoration: none;
	background-size: contain;
	cursor:pointer;
	z-index: 3;
}

.valentine_btn {
	background: url(../images/valentines_day/button.png) top center no-repeat;
	position: fixed;
	top: 105px;
	left: -4px;
	height: 303px;
	width: 118px;
	display: block;
	text-decoration: none;
	background-size: contain;
	cursor:pointer;
	z-index: 3;
}

/* donate-bonuse new style */
/* -------------------------------------------------------------------------------------------------------------------- */

.donate-bonuse{
	width: 100%;
	margin-top: 40px;
}

.donate-bonuse > .title{
	width: 100%;
	padding: 12px;
	padding-top: 14px;
	background: #f7f0e8;
	border-bottom: 2px solid #fea900;
	border-radius: 4px;
	font-family: Beaufort Bold;
	text-align: center;
	font-size: 18px;
	color: #ce2f00;
	line-height: 18px;
}

.donate-bonuse > .title span{
	font-family: unset;
	font-size: unset;
	color: #3d5203;
}

.donate-bonuse > .bonuses{
	width: 100%;
	margin-top: 10px;
	position: relative;
}

.donate-bonuse > .bonuses > .items{
	width: 100%;
	position: relative;
	padding: 2px;
}

.donate-bonuse > .bonuses > .items > .item{
	width: 66px;
	height: 280px;
	position: relative;
	z-index: 1;
	transition: all .5s ease-in-out;
}

.donate-bonuse > .bonuses > .items > .item:nth-child(6),
.donate-bonuse > .bonuses > .items > .item:nth-child(7),
.donate-bonuse > .bonuses > .items > .item:nth-child(8),
.donate-bonuse > .bonuses > .items > .item:nth-child(9){
}

.donate-bonuse > .bonuses > .items > .item.disable{
	filter: grayscale(100%);
	opacity: 0.5;
}

.donate-bonuse > .bonuses > .items > .item.disable > .status{
	opacity: 1;
}

.donate-bonuse > .bonuses > .items > .item:hover{
	z-index: 2;
	opacity: 1;
}

.donate-bonuse > .bonuses > .items > .item > .status{
	width: 100%;
	font-family: Roboto;
	font-size: 12px;
	color: #c0c0c0;
	text-align: center;
	opacity: 0;
	pointer-events: none;
}

.donate-bonuse > .bonuses > .items > .item > img{
	position: absolute;
	bottom: 0px;
}

.donate-bonuse > .bonuses > .items > .item > .i_block{
	width: 190px;
	width: 100%;
	min-height: 237px;
	position: absolute;
	background: #f4f4f4;
	border-radius: 4px;
	border: 1px solid #d8d8d8;
	box-shadow: 0px 2px 0px #cf6101, 0px 0px 10px rgba(255, 82, 0, 0.0);
	transform: translateY(-24px);
	bottom: 0px;
	padding: 12px calc( ( 100% - 40px ) / 2 );
	overflow: hidden;
	transition: all .5s ease-in-out;
}

.donate-bonuse > .bonuses > .items > .item.active .i_block{
	transform: translateY(-40px);
	background: #fff;
	box-shadow: 0px 2px 0px #cf6101, 0px 0px 10px rgba(255, 82, 0, 0.29);
}

.donate-bonuse > .bonuses > .items > .item > .i_block:hover{

	width: 190px;
	padding: 12px 12px;
}

.donate-bonuse > .bonuses > .items > .item > .i_block:hover .i_items{
	max-height: 500px;
	height: auto;
}

.donate-bonuse > .bonuses > .items > .item > .i_block > .info{
	width: 100%;
	font-family: Beaufort Bold;
	font-size: 16px;
	color: #a32500;
	text-align: center;
	transition: all .3s ease-in-out;
}

.donate-bonuse > .bonuses > .items > .item > .i_block > .info > i{
	color: #cc695f;
	font-size: 15px;
}

.donate-bonuse > .bonuses > .items > .item > .i_block > .i_items{
	max-height: 159px;
	width: 100%;
	overflow: hidden;
	transition: all .5s ease-in-out;
}

.donate-bonuse > .bonuses > .items > .item > .i_block > .i_items > .i_item{
	width: 162px;
	margin-top: 13px;
	position: relative;
}

.donate-bonuse > .bonuses > .items > .item > .i_block > .i_items > .i_item > img{
	width: 40px;
	height: 40px;
}

.donate-bonuse > .bonuses > .items > .item > .i_block > .i_items > .i_item > .name{
	width: 115px;
	font-family: Roboto;
	font-size: 12px;
	color: #939393;
	padding-left: 13px;
}

.donate-bonuse > .bonuses > .items > .item > .i_block > .price_count{
	width: calc( 100% + 12px );
	padding: 3px 0px;
	margin-left: -6px;
	margin-right: -6px;
	margin-bottom: -6px;
	background: linear-gradient( to top, #ff9800, #feb700);
	font-family: Beaufort Bold;
	font-size: 14px;
	color: #562200;
	text-shadow: 0px 1px 0px rgba(255,255,255,0.3);
	border-radius: 3px;
	text-align: center;
	margin-top: 13px;
}

.bonus_progress{
	width: 100%;
	height: 24px;
	background: #f4f4f4;
	border: 1px solid #d8d8d8;
	border-radius: 4px;
	padding: 2px;
}

.bonus_progress_bar{
	width: 0%;
	height: 100%;
	background: #f4f4f4;
	border-radius: 3px;
	background: linear-gradient( to top, #be2502, #feb700);
	transition: all .3s ease-in-out;
}

.donate-bonuse-first{
	width: 100%;
	margin-top: 40px;
}

.donate-bonuse-first > .title{
	width: 100%;
	padding: 12px;
	padding-top: 14px;
	background: #f7f0e8;
	border-bottom: 2px solid #fea900;
	border-radius: 4px;
	font-family: Beaufort Bold;
	text-align: center;
	font-size: 18px;
	color: #ce2f00;
	line-height: 18px;
}

.donate-bonuse-first > .title span{
	font-family: unset;
	font-size: unset;
	color: #3d5203;
}

.donate-bonuse-first > .bonuses{
	width: 100%;
	margin-top: 10px;
	position: relative;
}

.donate-bonuse-first > .bonuses > .items{
	width: 100%;
	position: relative;
	padding: 2px;
}

.donate-bonuse-first > .bonuses > .items > .item{
	width: calc( ( 100% - 20px ) / 5);
	height: 130px;
	position: relative;
	z-index: 1;
	transition: all .5s ease-in-out;
}

.donate-bonuse-first > .bonuses > .items > .item:nth-child(4),
.donate-bonuse-first > .bonuses > .items > .item:nth-child(5){
}

.donate-bonuse-first > .bonuses > .items > .item.disable{
	filter: grayscale(100%);
	opacity: 0.5;
}

.donate-bonuse-first > .bonuses > .items > .item.disable > .status{
	opacity: 1;
}

.donate-bonuse-first > .bonuses > .items > .item:hover{
	z-index: 2;
	opacity: 1;
}

.donate-bonuse-first > .bonuses > .items > .item > .status{
	width: 100%;
	font-family: Roboto;
	font-size: 12px;
	color: #c0c0c0;
	text-align: center;
	opacity: 0;
	pointer-events: none;
}

.donate-bonuse-first > .bonuses > .items > .item > img{
	position: absolute;
	bottom: 0px;
}

.donate-bonuse-first > .bonuses > .items > .item > .i_block{
	width: 190px;
	width: 100%;
	min-height: 87px;
	position: absolute;
	background: #f4f4f4;
	border-radius: 4px;
	border: 1px solid #d8d8d8;
	box-shadow: 0px 2px 0px #cf6101, 0px 0px 10px rgba(255, 82, 0, 0.0);
	transform: translateY(-24px);
	bottom: 0px;
	padding: 0px 12px;
	overflow: hidden;
	transition: all .5s ease-in-out;
}

.donate-bonuse-first > .bonuses > .items > .item.active .i_block{
	transform: translateY(-40px);
	background: #fff;
	box-shadow: 0px 2px 0px #cf6101, 0px 0px 10px rgba(255, 82, 0, 0.29);
}

.donate-bonuse-first > .bonuses > .items > .item > .i_block:hover{
}

.donate-bonuse-first > .bonuses > .items > .item > .i_block:hover .i_items{
	max-height: 500px;
	height: auto;
}

.donate-bonuse-first > .bonuses > .items > .item > .i_block > .info{
	width: 100%;
	font-family: Beaufort Bold;
	font-size: 16px;
	color: #a32500;
	text-align: center;
	transition: all .3s ease-in-out;
}

.donate-bonuse-first > .bonuses > .items > .item > .i_block > .info > i{
	color: #cc695f;
	font-size: 15px;
}

.donate-bonuse-first > .bonuses > .items > .item > .i_block > .i_items{
	max-height: 159px;
	width: 100%;
	overflow: hidden;
	transition: all .5s ease-in-out;
}

.donate-bonuse-first > .bonuses > .items > .item > .i_block > .i_items > .i_item{
	width: 100%;
	margin-top: 13px;
	position: relative;
}

.donate-bonuse-first > .bonuses > .items > .item > .i_block > .i_items > .i_item > img{
	width: 30px;
	height: 30px;
}

.donate-bonuse-first > .bonuses > .items > .item > .i_block > .i_items > .i_item > .name{
	width: calc( 100% - 30px );
	font-family: Roboto;
	font-size: 12px;
	color: #939393;
	padding-left: 10px;

	height: calc( 14px * 2);
	line-height: 14px;

	overflow: hidden;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}

.donate-bonuse-first > .bonuses > .items > .item > .i_block > .price_count{
	width: calc( 100% + 12px );
	padding: 3px 0px;
	margin-left: -6px;
	margin-right: -6px;
	margin-bottom: -6px;
	background: linear-gradient( to top, #ff9800, #feb700);
	font-family: Beaufort Bold;
	font-size: 14px;
	color: #562200;
	text-shadow: 0px 1px 0px rgba(255,255,255,0.3);
	border-radius: 3px;
	text-align: center;
	margin-top: 13px;
}

.donate-bonuse-first > .bonuses > .items > .item > .i_block > .price_count > span{
	font-family: Beaufort Bold;
	font-size: 14px;
	color: #562200;
	text-shadow: 0px 1px 0px rgba(255,255,255,0.3);
}

.progress-first{
}

/* new description style */
.game-desc > article {
	width: 100%;
	height: auto;
	margin-bottom: 20px;
	position: relative;
	overflow: hidden;
}

.game-desc > article > .img {
	width: 288px;
	height: 186px;
	z-index: 1;
	position: relative;
	left: 0;
	top: 0;
	overflow: hidden;
	border-radius: 5px;
	/*box-shadow: 0 0 30px rgba(0,0,0,.08);*/
	align-items: flex-start;
}

.game-desc > article > .img > img {
	position: absolute;
	z-index: 1;
	object-fit: fill;
}

.game-desc > article > .block {
	width: calc( 100% - 288px - 30px);
	position: relative;
	z-index: 2;
}

.game-desc > article > .block > .title {
	font-family: Roboto Bold;
	font-size: 25px;
	color: #562200;
}

.game-desc > article > .block > .text {
	font-family: Roboto;
	font-size: 16px;
	color: #796963;
	line-height: 26px;
	margin-top: 15px;
}

.game-desc > article > .block > .text > a {
	font-family: Roboto Bold;
	font-size: unset;
	color: #f37e00;
	transition: all .2s ease-in-out;
	text-decoration: underline;
}

.game-desc > article > .block > .start-button {
	width: 250px;
	height: 56px;
	margin-top: 20px;
	font-size: 24px;
}

/* UPDATE (NEW VIDEO BLOCK) */
/* -------------------------------------------------------------------------------------------------------------------- */

.start-game-guide-box.video{
	padding: 0px;
	padding-bottom: 55px;
}

.promo-video{
	width: 100%;
	height: 550px;
	margin: -25px 0px -50px;
	background: url(../images/promo_video_bg.png) center center;
	background-size: cover;
	display: flex;
	align-items: center;
	justify-content: center;
}

.promo-video__video_bg{
	width: 522px;
	height: 299px;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 3px solid #ff9800;
	margin-bottom: 30px;
	box-shadow: 0px 0px 20px #fff,  0px 0px 50px #fff;
}

.promo-video__video{
	width: calc( 100% - 10px );
	height: calc( 100% - 10px );
	background: url(../images/video_bg.png) center center;
	background-size: cover;
}
/*--two factor auth switch btn--*/
.switch-btn {
	margin-top: 20px;
	display: inline-block;
	width: 72px; /* ширина */
	height: 38px; /* высота */
	border-radius: 19px;
	background: #bfbfbf; /* цвет фона */
	z-index: 0;
	padding: 0;
	border: none;
	cursor: pointer;
	position: relative;
	transition-duration: 300ms; /* анимация */
}
.switch-btn::after {
	content: "";
	height: 32px; /* высота кнопки */
	width: 32px; /* ширина кнопки */
	background: #fff; /* цвет кнопки */
	border-radius: 17px;
	top: 3px; /* положение кнопки по вертикали относительно основы */
	left: 3px; /* положение кнопки по горизонтали относительно основы */
	transition-duration: 300ms; /* анимация */
	position: absolute;
	z-index: 1;
}
.switch-on {
	background: #ff9800;
}
.switch-on::after {
	left: 37px;
}

.tf-auth {
	width: 100%;
	margin-top: 20px;
	display: grid;
}

/* paypal */
.paypal-panel {
	width: 100%;
	padding-top: 40px;
}

.paypal-panel > .panel-body {
	margin: 0 auto;
	width: 400px;
}
/*
Плашка о cookie
*/
    #cookie-notice {
        position: fixed;
        z-index: 99999;
        bottom: 0;
        left: 0;
        width: 100%;
        padding: 15px;
        display: none; 
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    }

    #cookie-notice.is-visible {
        display: block;
    }

    .cookie-notice__content {
        background: white;
        color: #212731;
        max-width: 600px;
        margin: 0 auto 0 0;
        padding: 20px;
        border-radius: 10px;
        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
        text-align: left;
    }

    .cookie-notice__heading {
        margin: 0 0 10px 0;
        font-size: 18px;
        line-height: 1.2;
    }

    .cookie-notice__text {
        margin: 0 0 20px 0;
        font-size: 14px;
        line-height: 1.5;
    }

    .cookie-notice__buttons {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 10px;
    }

    .cookie-notice__button {
        display: inline-block;
        padding: 10px 20px;
        border-radius: 6px;
        font-size: 14px;
        font-weight: 500;
        text-decoration: none;
        cursor: pointer;
        transition: background-color 0.3s, color 0.3s, border-color 0.3s;
        border: 1px solid transparent;
    }

    .cookie-notice__button--primary {
        background-color: #F2994A;
        color: #fff;
        margin-left: auto;
    }

    .cookie-notice__button--primary:hover {
        background-color: #E67E22;
    }

    .cookie-notice__button--secondary {
        border-color: #E67E22;
        color: #E67E22;
        background-color: transparent;
    }

    .cookie-notice__button--secondary:hover {
        background-color: #E67E22;
        color: #fff;
    }

    @media (max-width: 768px) {
        #cookie-notice {
            padding: 10px;
        }
        .cookie-notice__content {
            margin: 0 auto;
            max-width: 100%;
        }
        .cookie-notice__button--primary {
            margin-left: 0;
        }
    }