@font-face{

font-family: 'SegoeUI';

src:local(SegoeUIBold), url('../fonts/SegoeUIBold/SegoeUIBold.ttf');
src:local(SegoeUIBold), url('../fonts/SegoeUIBold/SegoeUIBold.woff');
src:local(SegoeUIBold), url('../fonts/SegoeUIBold/SegoeUIBold.eot');

font-weight: 700;

font-style: normal;
}
@font-face{

font-family: 'SegoeUI';

src:local(SegoeUIItalic), url('../fonts/SegoeUIItalic/SegoeUIItalic.ttf');
src:local(SegoeUIItalic), url('../fonts/SegoeUIItalic/SegoeUIItalic.woff');
src:local(SegoeUIItalic), url('../fonts/SegoeUIItalic/SegoeUIItalic.eot');

font-weight: normal;

font-style: italic;
}
@font-face{

font-family: 'SegoeUI';

src:local(SegoeUILight), url('../fonts/SegoeUILight/SegoeUILight.ttf');
src:local(SegoeUILight), url('../fonts/SegoeUILight/SegoeUILight.woff');
src:local(SegoeUILight), url('../fonts/SegoeUILight/SegoeUILight.eot');

font-weight: 300;

font-style: normal;
}
@font-face{

font-family: 'SegoeUI';

src:local(SegoeUIRegular), url('../fonts/SegoeUIRegular/SegoeUIRegular.ttf');
src:local(SegoeUIRegular), url('../fonts/SegoeUIRegular/SegoeUIRegular.woff');
src:local(SegoeUIRegular), url('../fonts/SegoeUIRegular/SegoeUIRegular.eot');

font-weight: 400;

font-style: normal;
}
@font-face{

font-family: 'SegoeUI';

src:local(SegoeUISemiBold), url('../fonts/SegoeUISemiBold/SegoeUISemiBold.ttf');
src:local(SegoeUISemiBold), url('../fonts/SegoeUISemiBold/SegoeUISemiBold.woff');
src:local(SegoeUISemiBold), url('../fonts/SegoeUISemiBold/SegoeUISemiBold.eot');

font-weight: 600;

font-style: normal;
}
body{
	font-family: 'SegoeUI',arial;
	background:#edeef0;
}
.container-header{
	width:1340px;
	margin:0 auto;
	display:block;
}
.container{
	width:1260px;
	margin:0 auto;
	display:block;
}
/*
	======================
			headers
	======================
*/
h1,h2{
	font-size:28px;
	line-height:34px;
	font-weight:500;
	margin-bottom:40px;
}
h2{
	margin-bottom:22px;
	text-align:left;
}
/*
	==================
		header
	==================
*/
header{
	background:#fff;
	position:relative;
	z-index:10;
	min-height:300px;
	background:url('../img/header-bg.jpg') 0 0 no-repeat;
	background-size:cover;
}
header .table,
header .table-cell{
	height:80px;
}
.logo{
	float:left;
	margin-top:10px;
}
.nav{
	float:right;
	margin-right:128px;
}
.nav li:last-child{
	margin-right:0;
}
.nav li{
	display:inline-block;
	line-height:80px;
	margin-right:88px;
	position:relative;
}
.nav a{
	text-transform:uppercase;
	color:#000;
	font-size:15px;
}
.nav a:after,
.nav a:before{
	content:'';
	display:inline-block;
	width:0;
	height:2px;
	background:#000;
	transition:0.3s;
	position:absolute;
}
.nav a:before{
	top:15px;
	left:0;
}
.nav a:after{
	bottom:15px;
	right:0;
}
.nav a:hover:after,
.nav a:hover:before{
	width:100%;
}
.lang-top{
	float:right;
	display:inline-block;
	position:relative;
}
.lang-top ul{
	position:absolute;
	top:71.5px;
	display:none;
}
/*
.lang-top ul:before{
	content:'';
	position:absolute;
	right:-10px;
	top:0;
	display:block;
	width:calc(100% + 20px);
	height:100%;
	background:#fff;
	z-index:-1;
	border-radius:10px;
}
*/
.lang-top li{
	display:block;
	margin-bottom:15px;
}

.lang-top li a{
	float:none;
}
.lang-top a img{
	width:50px;
	height:30px;
	float: left;
	border:1px solid #3d3e3f;
}
.lang-top a{
	text-transform:uppercase;
	color:#fff;
	font-size:15px;
	font-weight:700;
	line-height: 30px;
	display:inline-block;
}
.langBtn span,
.langBtn{
	float:right;
	cursor:pointer;
}
.l-arrow{
	margin-top:10px;
	margin-left:10px;
}
.l-arrow img{
	transition:0.3s;
}
.lang-top.activ ul{
	display:block;
}
.lang-top.activ .l-arrow img{
	transform:scaleY(-1);
}
.menuBtn{
	float:right;
	margin-top:30px;
	width:40px;
	height:40px;
	border-radius:40px;
	border:1px solid #383838;
	cursor:pointer;
	padding-top:3.5px;
	display:none;
	position:fixed;
	right:18px;
}
.menuBtn span{
	display:block;
	width:18px;
	height:3px;
	border-radius:3px;
	margin:0 auto 4px;
	background:#383838;
	position:relative;
	transition:0.3s;
}
/*
	================
		main
	================
*/
main{
	margin-top:30px;
	display:block;
}
.mainTop{
	display:none;
	background:#fff;
	padding:46px 30px 42px;
	font-size:16px;
	line-height:20px;
}
.mainTop-header{
	font-size:28px;
	margin-bottom:20px;
}
/*
	================
		brandList
	================
*/
.brandList{
	width:845px;
	display:inline-block;
	float:left;
}
.brand{
	background:#fff;
	font-weight:500;
	margin-bottom:20px;
	box-shadow: 0 3px 10px rgba(0,0,0,0.1);
	transition:0.3s;
	cursor:pointer;
}
.brand:hover{
	background:#fbfafa;
}
.brand:last-child{
	margin-bottom:0;
}
.brand .table,
.brand .table-cell{
	height:142px;
}
.brand-bTotal,
.brand-bonus,
.brand-num,
.brand-img{
	float:left;
}
.brand-num{
	width:47px;
	margin-right:17px;
	text-align:right;
	line-height:142px;
	display:inline-block;
	color:#FF0938;
	font-size:22px;
}
.brand-img{
	margin-right:20px;
}
.brand-img img{
	width:145px;
}
.brand-bonus{
	width:380px;
	color:#2C2C2C;
	font-size:16px;
}
.brand-bText{
	display:block;
	padding-bottom:14px;
	border-bottom:1px solid #eae8e8;
}
.brand-bTotal{
	padding-top:14px;
}
.brand-bTotal li{
	display:inline-block;
}
.brand-bTotal span{
	color:#FF0031;
}
.brand-bTotal li:first-child{
	margin-right:45px;
}
.brand-play{
	float:right;
	margin-right:24px;
}
.brand-play a{
	display:inline-block;
	color:#fff;
	text-align:center;
	width:167px;
	background:#159b72;
	font-size:18px;
	line-height:48px;
	border-radius:5px;
	transition:0.3s;
}
.brand-play a:hover{
	background:#1e8e52;
}
/*
	================
		aside
	================
*/
aside{
	width:394px;
	display:inline-block;
	float:right;
}
.asideWidget{
	padding:44px 30px 34px;
	color:#2C2C2C;
	margin-bottom:20px;
	background:#fff;
}
.asideWidget:last-child{
	margin-bottom:0;
}
.asideWidget p{
	font-size:16px;
	line-height:20px;
}
.asideWidget-ul{
	line-height:60px;
	font-size:22px;
}
.asideWidget-ul li{
	margin-bottom:15px;
}
.asideWidget-ul li:last-child{
	margin-bottom:0;
}
.asideWidget-ul img{
	float:left;
	margin-right:25px;
}
.asideWidget-pay {
	text-align:center;
	margin-bottom:-12px;
}
.asideWidget-pay img{
	display:inline-block;
	margin: 0 6px 12px;
}
/*
	===================
		footer
	===================
*/
footer{
	margin-top:68px;
	background:#323a4a;
}
footer .table,
footer .table-cell{
	width:100%;
	height:120px;
	text-align:center;
}
/*
	===================
		media
	===================
*/
@media(max-width:1400px){
	.container,
	.container-header{
		width:100%;
		max-width:1260px;
	}
	.container-header{
		padding-left:30px;
		padding-right:30px;
	}
}
@media(max-width:1300px){
	.container{
		padding-left:30px;
		padding-right:30px;
	}
	main {
		margin-top: 20px;
	}
	.mainTop{
		display:block;
	}
	aside,
	.brandList{
		float:none;
		display:block;
		margin-left:auto;
		margin-right:auto;
		width:845px;
		margin-top:20px;
	}
	.asideWidget:first-child{
		display:none;
	}
	.asideWidget{
		width:412.5px;
		display:inline-block
	}
	.asideWidget:nth-child(2){
		float:left;
		margin-right:20px;
	}
}
@media(max-width:1100px){
	header{
		min-height:194px;
	}
	.lang-top,
	.nav{
		position:fixed;
		right:0;
		margin:0;
	}
	.nav{
		padding: 85px 20px 20px 0;
		background: #fff;
		text-align:right;
		left:100%;
		width:240px;
		transition:0.5s;
	}
	.lang-top{
		top:170px;
		right: 100%;
		top: 13px;
		margin-right:0;
		margin-top:0;
		z-index: 1;
		opacity:0;
		transition: opacity 0.5s;
	}
	.lang-top ul{
		top:68px;
	}
	.nav li{
		display:block;
		margin:0;
		line-height:35px;
		opacity:0;
	}
	.nav a{
		transition:0.2s;
	}
	.nav a:hover{
		color:#45796d;
	}
	.nav a:after,
	.nav a:before{
		display:none;
	}
	.menuBtn{
		display:block;
	}
	.activMenu .menuBtn{
		border:1px solid #fff;
	}
	.activMenu .nav li{
		opacity:1
	}
	.activMenu .menuBtn span:first-child{
		top: 7px;
	}
	.activMenu .menuBtn span:nth-child(2),
	.activMenu .menuBtn span:first-child{
		transform:rotate(45deg);
	}
	.activMenu .menuBtn span:last-child{
		top:-7px;
		transform:rotate(-45deg);
	}
	.activMenu .lang-top{
		opacity:1;
		right: 135px;
	}
	.activMenu .nav{
		margin-left:-240px;
	}
}
@media(max-width:980px){
	.brandList{
		width:100%;
		max-width:845px;
	}
	.brand{
		position:relative;
	}
	.brand .table, .brand .table-cell{
		height:135px;
	}
	.brand-img{
		width:166px;
		margin-left:8px;
		margin-right:0;
		text-align:center;
	}
	.brand-img img{
		width:124px;
	}
	.brand-num{
		position:absolute;
		line-height:normal;
		top:18px;
	}
	.brand-bonus{
		width:326px;
	}
	.brand-bText{
		min-height:53px;
		padding:0;
	}
	aside{
		width:710px;
		text-align:center;
	}
	.asideWidget{
		width:345px;
		display:inline-block;
		padding-top:38px;
		padding-bottom:58px;
	}
	.asideWidget-ul{
		font-size:20px;
		text-align:left;
	}
	.asideWidget-ul img{
		margin-right:20px;
	}
	.asideWidget-pay img{
		width:82px;
		margin:0 4px 8px;
	}
	.asideWidget-pay{
		margin-bottom:-8px;
	}
}
@media(max-width:768px){
	header{
		min-height:156px;
	}
	header .table, header .table-cell{
		height:auto;
	}
	.container,
	.container-header{
		padding-left:18px;
		padding-right:18px;
	}
	.logo img{
		width:128px;
	}
	.menuBtn{
		margin-top:14px;
	}
	.lang-top{
		top:18px;
	}
	.activMenu .nav{
		padding-top:65px;
	}
	.nav li{
		line-height:28px; 
	}
	.nav a{
		font-size: 14px;
	}
	.lang-top ul{
		top:45px;
	}
	main{
		margin-top:18px;
	}
	.mainTop{
		display:none;
	}
	.brandList{
		margin-top:0;
		text-align:center;
	}
	.brand{
		margin-bottom:16px;
		width:290px;
		display:inline-block;
		text-align:left;
	}
	.brand:nth-child(2n){
		margin-left:16px;
	}
	.brand .table, .brand .table-cell{
		width:100%;
		height:100px;
		margin-left:0;
		margin-right:0;
	}
	.brand-num{
		top:35px;
	}
	.brand-bonus{
		padding:0 18px;
		font-size:14px;
	}
	.brand-bText{
		min-height:46px;
	}
	.brand-bTotal{
		font-size:12px;
	}
	.brand-bTotal li:first-child{
		margin-right:34px;
	}
	.table.brand-play{
		text-align:center;
		height:auto;
		margin:10px 0 26px;
	}
	.table.brand-play .table-cell{
		height:auto;
	}
	aside{
		margin-top:16px;
		width:290px;
	}
	h2{
		font-size:24px;
	}
	.asideWidget{
		width:100%;
		padding:25px 18px 30px;
	}
	.asideWidget-ul{
		font-size: 18px;
		line-height:52px;
	}
	.asideWidget-ul img{
		width:52px;
	}
	.asideWidget-pay img{
		width:72px;
	}
	footer{
		margin-top:86px;
	}
}
@media(max-width:660px){
	.brandList{
		width:290px;
	}
	.brand:nth-child(2n){
		margin-left:0;
	}
}