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

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

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

body{
	font-family: Roboto, sans-serif;
	font-size: 16px;
	color: #333;
	min-width: 320px;
	background: #f0f2f7;
}

a{
	color: #000;
	text-decoration: none;
}

a:hover{
	text-decoration: underline;
}

.main-header{
	background: #262626;
}

.main-header__container{
	margin: auto;
	max-width: 1180px;
	display: flex;
	justify-content: space-between;
	-ms-align-items: center;
	align-items: center;
	min-height: 50px;
}


.main-header__logo a{
	color: #fff;
	text-decoration: none;
	font-family: Bold, sans-serif;;
	display: flex;
	align-items: center;
}

.main-header__logo a img{
	width: 40px;
	margin-right: 5px;
}

.main-header__nav ul{
	list-style: none;
}


.main-header__nav ul a{
	text-decoration: none;
}

.header-mnu{
	display: flex;
	justify-content: space-between;
	margin: 0;
}

.header-mnu__item{
	margin: 0 0 0 20px;
	padding: 25px 0;
	border-bottom: 4px solid transparent;
}

.header-mnu__link{
	color: #6BA229;
}

.header-mnu__item:hover{
	border-color: #fff;
}

.header-mnu__item a:hover{
	color: #FC5F3F;
}

.header-mnu__link:hover{
	text-decoration: none;
}

.header-submnu{
	display: none;
	position: absolute;
	background: #fff;
	border: 1px solid #2876E2;
	margin-top: 29px;
	padding: 5px 0;
	min-width: 200px;
}

.header-submnu__item{
	font-size: 14px;
	padding: 5px 10px;
}

.header-submnu__link{
	color: #333;
}

.header-mnu__item:hover .header-submnu, .header-submnu:hover{
	display: block;
}

.cheesburger{
	width: 35px;
	height: 20px;
	flex-direction: column;
	justify-content: space-between;
	position: relative;
	display: none;
	cursor: pointer;
}

.cheesburger span{
	background: #fff;
	height: 4px;
	border-radius: 10em;
	width: 100%;
}

.cheesburger.active span{
	position: absolute;
	top: 6px;
	transition: all 0.3s ease;
}

.cheesburger.active span:nth-child(2){
	display: none;
}

.cheesburger.active span:nth-child(1){
	transform: rotate(45deg);
}

.cheesburger.active span:nth-child(3){
	transform: rotate(-45deg);
}


.wrapper{
	margin: auto;
	max-width: 1180px;
	width: calc(100% - 20px);
	display: flex;
	justify-content: space-between;
	margin-top: 30px;
}

.wrapper .content-box{
	background: #FFF;
	width: calc(100% - 350px);
	min-height: 700px;
}

.wrapper .content-box .content{
	padding: 20px;
}

.wrapper .content-box .content img{
	max-width: 100%;
}

.pokie-home-img{
	float: right;
	width: 400px;
}



.casinos-list{
	border: 1px solid #ccc;
	display: flex;
	flex-direction: column;
}

.casino-item{
	display: flex;
	padding: 15px;
	align-items: center;
	justify-content: flex-start;
	border-bottom: 1px solid #ccc;
}

.casino-item-img{
	width: 120px;
	border: 1px solid #ccc;
	box-sizing: border-box;
}	

.casino-item-bonus{
	display: flex;
	flex-direction: column;
	font-size: 14px;
	text-align: center;
	width: 140px;
	margin-left: 15px;
	margin-right: 15px;
}

.casino-item-bonus span{
	font-size: 34px;
	color: #6BA229;
}

.casino-item-rating{
 width: 50px;
}

.casino-item-advantages{
	width: calc(100% - 470px);
	margin-right: 10px;
}

.casino-item-claim{
	width: 130px;
}
 
.casino-item-claim a{
	background: #2ECC71;
	background: linear-gradient(to bottom, #2ECC71, #27AE60);
	border: 1px solid #0E544D;
	text-decoration: none;
	padding: 5px 15px;
	font-family: Bold, sans-serif;
	color: #fff;
	border-radius: 12px;
}

.casino-item-claim a:hover{
	background: linear-gradient(to bottom, #27AE60, #2ECC71);
}

.wrapper .sidebar{
	background: #FFF;
	width: 320px;
}

.wrapper .sidebar h2{
	background: #262626;
	margin: 0;
	color: #fff;
	text-align: center;
	padding: 15px 0;
}

.wrapper .sidebar .widget-block ul{
	margin: 0;
	padding: 0;
	list-style: none;
}

.wrapper .sidebar .widget-block ul li{
	border-bottom: 1px solid #CCC;
	padding: 15px;
}

.wrapper .sidebar .widget-block ul li a{
	text-decoration: none;
}

.wrapper .sidebar .widget-block ul li a:hover{
color: #FC5F3F;
}

.footer{
	text-align: center;
	padding: 20px;
	background: #FFF;
	margin-top: 20px;
}


@media screen and (max-width: 1100px) {
	.wrapper{
		flex-direction: column;
		align-items: flex-start;
		justify-content: flex-start;
	}
	.wrapper .content-box{
		width: 100%;
	}
	.wrapper .sidebar{
		width: 100%;
		margin-top: 15px;
		height: auto;
	}
}


@media screen and (max-width: 980px) {
	.cheesburger{
		display: flex;
	}

	.header-mnu{
		display: flex;
		position: fixed;
		flex-direction: column;
		justify-content: flex-start;
		width: 240px;
		height: 100%;
		right: -100%;
		background: #262626;
		top: 0;
 		padding-top: 50px;
		transition: all .5s ease;
	}

	.header-mnu.active{
		right: 0;
	}

	.header-mnu__item{
		margin: 0 0 15px 20px;
		padding: 0 0 10px 0;
		border-bottom: 1px solid #CCC;
	}

	.header-mnu.active .header-submnu{
		display: block;
		position: relative;
		border: none;
		min-width: auto;
		padding: 0;
		margin: 5px 0 0 0;
		display: flex;
		flex-wrap: wrap;
		background: #262626;
	}
	.header-submnu__item{
		padding: 0;
		margin: 7px 7px 0 0;
	}
	.main-header__container, .container{
		width: calc(100% - 20px);
		padding: 0 10px;
	}

	.header-submnu__link{
		color: rgba(255,255,255,.8);
	}
}

@media screen and (max-width: 780px) {
	.casino-item{
		flex-direction: column;
	}
	.casino-item-bonus, .casino-item-advantages, .casino-item-claim{
		width: 100%;
	}
	.casino-item-rating{
		display: none;
	}
	.casino-item-advantages{
		display: flex;
		justify-content: center;
		margin-bottom: 20px;
	}
	.casino-item-advantages ul{
		margin: 0;
		margin-top: 10px;
		font-size: 18px;
	}
	.casino-item-claim{
		display: flex;
		justify-content: center;
	}
	.casino-item-claim a{
		min-width: 190px;
		padding: 15px;
		text-align: center;
	}
	.pokie-home-img{
		float: none;
		width: 100%;
	}
}