/*==========  Desktop First Method  ==========*/

/* Large Devices, Wide Screens */
@media only screen and (max-width : 1200px) {
	header nav {
		position: fixed; 
		right: 0;
		top: 80px;
		background: #dc0f0f none repeat scroll 0 0;
    	bottom: 0;
    	width: 320px;
		-webkit-transform: translate3d(320px,0,0);
		transform: translate3d(320px,0,0);
		transition: .5s;
	}
	button {
		z-index: 200
	}
	header nav.active {
		-webkit-transform: translate3d(0,0,0);
		transform: translate3d(0,0,0);
	}
	header nav ul li {
		display: block;
		padding-bottom: 5px; 
		font-size: 16px;
	}
	header nav ul li.social-nav {
		left: 0; 
		bottom: 0;
		border-radius: 0!important; 
		padding: 8px 6px 15px; 
		position: absolute; 
		margin: 0; 
		width: 100%;
	}
	header nav ul li.social-nav .social-icons {
		width: 100%
	}
	header nav ul li.social-nav a {
		height: 19px; 
		margin: 0 2px;
		width: 24px;
	}
	header nav ul li.ent-reg {
	    padding-left: 50px;
	    padding-top: 30px;
	    position: relative;
	    width: 100px;
	}
	header nav ul li.ent-reg a:hover::after {
		-webkit-transform: scale(0,0); 
		transform: scale(0,0); 
	}
	header nav ul li.ent-reg::before {
	    background: rgba(0, 0, 0, 0) url("../img/icon-sub-menu.png") no-repeat scroll 0 0 / 500% auto;
	    content: "";
	    height: 50px;
	    left: 0;
	    position: absolute;
	    top: 30%;
	    width: 36px;
	}
	header nav ul li.lang-selector #current-lang {
		display: none;
	}
	header nav ul li.lang-selector .mob-lang-options {
		display: block;
		margin-top: 30px;
	}
	header nav ul li.lang-selector::after {
		background: none;
	}
	.layout {
		transition: .5s;
	}
	.layout.active {
		-webkit-transform: translate3d(-220px,0,0);
		transform: translate3d(-220px,0,0);
		opacity: 0.3
	}
	.s-refill .refill-item {
		width: 40%; 
		margin-bottom: 100px;
	}
	.s-refill .refill-item:last-child {
		margin-bottom: 20px;
	}
	.s-refill .refill-item:nth-child(1),
	.s-refill .refill-item:nth-child(3),
	.s-refill .refill-item:nth-child(5) {
	    margin-left: 12%;
	}
	.s-refill .refill-item:nth-child(2),
	.s-refill .refill-item:nth-child(4) {
	    margin-left: 0;
	    transform: translate3d(-50px,75px, 0);
	}
	footer .footer-social {
		margin: 50px 0 0 80px; 
	}

	.s-single-game {
		padding-top: 300px; 
	}
	.s-about-principles .princip-icons {
		height: 200px;
	}
	.s-contacts-office .cont-office-item p {
		font-size: 14px; 
	}
}

/* Medium Devices, Desktops */
@media only screen and (max-width : 992px) {
	.s-refill .refill-item {
		width: 100%; 
		margin-bottom: 10px;
	}

	.s-refill .refill-item:nth-child(1),
	.s-refill .refill-item:nth-child(3),
	.s-refill .refill-item:nth-child(5) {
	    margin-left: 10%;
	}
	.s-refill .refill-item:nth-child(2),
	.s-refill .refill-item:nth-child(4) {
	    margin-left: 40%;
	    transform: none;
	}
	.games-slider .game-slider-cont .game-slider-links a {
		display: block;
	}
	.games-slider .game-slider-cont a:first-child {
		margin-right: -30px;
	}
	.games-slider .game-slider-cont:hover a:first-child {
		border-right: 0 none; 
		margin-right: 0;
	}
	.s-news .list-arrows {
		margin: 20px 10px 0 10px; 
		float: left; 
	}
	.s-news #player {
		width: 100%;
		height: 400px;
	}
	.s-news .video-block  .list #video-list {
		width: 60%; 
		margin-top: 10px; 
	}
	footer {
		background: #1a1a1a; 
	}
	footer .footer-social {
		display: none
	}

	.s-single-game {
		padding-top: 250px; 
	}
	.s-single-game .game-content h2 {
		font-size: 36px; 
	}
	.s-about-banner {
		height: 400px
	}
	.s-about-banner .s-about-header h1 {
		font-size: 120px
	}
	.s-about-principles .princip-icons {
		height: 150px;
	}
	.s-contacts-banner {
		height: 400px; 
	}
	.s-contacts-office .cont-office-item {
		max-height: 152px; 
	}
	.s-partners-merchant .merch-desc {
		padding-left: 15px
	}
	.s-blog-post {
		padding-top: 200px; 
	}
	.s-blog-post .section-header {
		padding-bottom: 100px; 
		font-size: 50px; 
	}
	.s-blog-post aside .col-md-12 {
		padding: 0 10px
	}
	.register-descr {
		margin: 15px;
	}
	.cat-inner-wrap .cat-inner-descr .cat-inner-centered h1 {
		font-size: 40px;
	}

	
}

/* Small Devices, Tablets */
@media only screen and (max-width : 768px) {
	.s-search form {
		width: 200px; 
	}
	.s-category {
		height: 1000px; 
	}
	.s-category .cat-wrapper {
		display: table;
		min-height: 200px; 
		height: 20%;
		margin: 0 auto;
		max-width: 500px;
		width: auto;
	}
	.s-category .cat-wrapper .cat-content {
		height: inherit; 
		position: relative;
		display: table-cell;
	}
	.s-category .cat-wrapper .cat-content .cat-bar {
		bottom: 0;
		position: absolute;
		left: 0;
		right: 0;
		margin: 0; 
	}
	.s-category .cat-wrapper .cat-content .cat-bar h3 {
		padding: 0
	}
	.s-category .cat-wrapper:hover {
		min-height: 300px
	}
	.s-category .cat-wrapper .cat-content .cat-descr {
		margin: 130px 0 0
	}

	.s-refill .refill-item:nth-child(2),
	.s-refill .refill-item:nth-child(4) {
	    margin-left: 25%;
	}
	.s-news .news-wrapper .news-item {
		max-width: 500px; 
		margin: 0 auto; 
	}
	.s-news .news-wrapper .news-item div {
		width: 50%
	}
	.s-popular .controls {
    	left: 50%;
    	margin-left: -28px;
    	top: 25px; 
    }
    .s-slider .controls {
    	display: block; 
    }
    .games-slider-wrap .item {
    	height: 140px;
    }
    .games-slider .pop-slider-cont .pop-slider-lins a {
    	font-size: 14px; 
    	margin-top: 10px;
    }
    .refill-form label {
    	width: 100%
    }
    .s-refill-inner .s-refill-content:nth-child(2n-1) {
	    padding: 60px 30% 60px 15%;
	}
    .s-news #player {
		height: 350px;
	}
	.s-info h2 {
		font-size: 32px;
	}
	.s-info h2 span {
		padding: 5px 20px; 
	}
	.s-info h2 span::after{
		right: -10px; 
	 	border-top: 40px solid #dc0f0f;
	 	border-right: 10px solid transparent; 
	}
	footer {
		padding: 20px 0 30px
	}
	.xs-hide {
		display: none; 
	}
	.s-single-game {
		padding-top: 200px; 
	}
	.s-about-banner .s-about-header h1 {
		font-size: 80px
	}
	.s-about-principles .princip-icons {
		width: 240px;
		height: 220px; 
	}
	.s-about-principles .row {
		width: 500px;
		display: block;
		margin: 0 auto; 
	}
	.s-about-principles .princip-icons:nth-child(2) {
		margin-right: 0; 
	}
	.s-about-principles .princip-icons:nth-child(4) {
		margin-right: 0; 
	}
	.s-about-news .about-news-wrap {
		padding-bottom: 50px; 
	}
	.s-contform .contact-form form {
		padding: 5px 5px 70px; 
	}
	.s-contform .contact-form label {
	    display: block;
	    margin-top: 30px!important;
	}
	.s-contform .contact-form label.error {
		top: -46px;
		left: 90px; 
		width: 180px; 
	}
	.s-contacts-banner {
		height: 300px; 
	}
	.s-blog-post {
		padding-top: 100px; 
	}
	.s-blog-post .section-header {
		padding-bottom: 30px; 
		font-size: 30px; 
	}
	.s-blog-post .post-meta .post-author,
	.s-blog-post .post-meta .post-meta-date {
		margin-left: 15px; 
	}
	.s-blog-post .post-meta .post-meta-comment-count {
		padding: 0 15px;
	}
	.s-blog-post .post-meta .post-meta-info {
		display: table;

	}
	.s-blog-post .post-meta .post-meta-info > div {
		padding: 0 auto;
		width: auto;
	}
	.s-blog-post .post-meta .post-meta-info,
	.s-blog-post .post-meta .post-meta-share {
		text-align: left;
	}
	.s-blog-post .comments-area > form > div {
		padding-right: 0; 
	}
	.s-blog-post .comments-respond {
		padding-left: 50px; 
	}
	.s-login-register form {
		height: auto; 
	}
	.s-login-register form label {
		padding: 0; 
	}
	.s-login-register form label #addphoto {
	    bottom: 0;
	    left: 80px;
	    right: auto;
	    width: 200px;
	}
	.s-refill-title,
	.cat-inner-wrap {
		height: 400px
	}
}
@media only screen and (max-width : 540px) {
    .s-refill .instant-refill {
    	font-size: 15px;
    	width: 240px;
    	margin: 0 auto;
    }
	.section-header {
		font-size: 24px; 
	}
	.s-news .news-wrapper .news-item .news-content {
		min-height: 220px;
		width: 100%;
		float: left;
	}
	.s-news .news-wrapper .news-item .news-img {
		display: none;
	}
	.s-news #player {
		height: 300px;
	}
	.games-slider-wrap .item {
		width: 100%
	}
	.s-info h2 {
		font-size: 26px;
	}
	.s-info h2 span {
		padding: 5px 10px; 
		margin-right: 20px; 
	}
	.s-single-game {
		padding-top: 150px; 
	}
	.box-modal {
		width: 300px
	}
	.s-about-banner {
		height: 300px;
	}
	.s-about-banner .s-about-header h1 {
		font-size: 60px
	}
	.s-about-service .service-thumb:nth-child(2), 
	.s-about-service .service-thumb:nth-child(3) {
		margin-right: auto;
	}
	.s-about-service .service-thumb {
		display: block; 
		float: none; 
		margin: 0 auto;
		width: 220px
	}

	.s-about-principles .princip-icons {
		width: 180px;
		height: 170px; 
	}
	.s-about-principles .row {
		width: 400px;
		display: block;
		margin: 0 auto; 
	}

	.faq-toggle .title {
		font-size: 16px;
	}
	.tabs > div .services ul li {
		width: 98%;
	}
	.s-refill-title,
	.cat-inner-wrap {
		height: 300px
	}
	.cat-inner-wrap .cat-inner-descr .cat-inner-centered h1 {
		font-size: 30px;
	}

}


/* Extra Small Devices, Phones */
@media only screen and (max-width : 480px) {
	.s-refill .refill-item:nth-child(n){
	    margin-left: 5%;
	}
	.s-refill .refill-item .item-image {
		height: 86px;
    	width: 100px;
	}
	.s-refill .refill-item .item-content {
		font-size: 14px;
	}
	.s-category .cat-wrapper .cat-content .cat-descr {
		margin: 100px 0 0; 
		padding-bottom: 20px; 
	}
	.s-news #player {
		height: 250px;
	}
	.s-info h2 span::after{
	 	border-top: 34px solid #dc0f0f;
	 }
	.s-search .scroll {
		color: transparent; 
		width: 0;
	}
	.s-refill #instant-refill {
		font-size: 14px; 
		width: 260px; 
	}
	.refill-form {
		padding: 60px 20px 90px; 
	}

	.s-single-game {
		padding-top: 100px; 
	}
	.s-about-principles .princip-icons {
		width: 240px;
		height: 220px; 
	}
	.s-about-principles .row {
		width: 240px;
	}
	.s-about-principles .princip-icons:nth-child(1) {
		margin: 0;
	}
	.s-about-principles .princip-icons:nth-child(3) {
		margin: 0;
	}
	.s-about-banner .s-about-header h1 {
		font-size: 50px
	}
	.s-refill-title,
	.cat-inner-wrap {
		height: 200px
	}
	.s-refill-inner .s-refill-content:nth-child(n) {
		padding: 35px 15px 15px 60px
	}
	.s-refill-inner .s-refill-content::after {
		background-image: none;
	}

}

/* Custom, iPhone Retina */
@media only screen and (max-width : 320px) {

}


/*==========  Mobile First Method  ==========*/

/* Custom, iPhone Retina */
@media only screen and (min-width : 320px) {

}

/* Extra Small Devices, Phones */
@media only screen and (min-width : 480px) {

}

/* Small Devices, Tablets */
@media only screen and (min-width : 768px) {
	.s-category .cat-wrapper:hover{
		border: 2px solid #dc0f0f;
		width: 43%;
		box-shadow: inset 0 0 0 1000px rgba(0,0,0,.4);	
	}
}

/* Medium Devices, Desktops */
@media only screen and (min-width : 992px) {
	
}

/* Large Devices, Wide Screens */
@media only screen and (min-width : 1200px) {

}