@font-face {
    font-family: 'Open Sans';
    src: local('Open Sans Light'), local('OpenSans-Light'), url('../fonts/opensanslight.woff2') format('woff2'), url('../fonts/opensanslight.woff') format('woff'), url('../fonts/opensanslight.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Open Sans';
    src: local('Open Sans Bold'), local('OpenSans-Bold'), url('../fonts/opensansbold.woff2') format('woff2'), url('../fonts/opensansbold.woff') format('woff'), url('../fonts/opensansbold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'Open Sans';
    src: local('Open Sans Semibold'), local('OpenSans-Semibold'), url('../fonts/opensanssemibold.woff2') format('woff2'), url('../fonts/opensanssemibold.woff') format('woff'), url('../fonts/opensanssemibold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'Open Sans';
    src: local('Open Sans'), local('OpenSans'), url('../fonts/opensans.woff2') format('woff2'), url('../fonts/opensans.woff') format('woff'), url('../fonts/opensans.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Exo 2';
    src: local('Exo 2 Bold'), local('Exo2-Bold'), url('../fonts/exo2bold.woff2') format('woff2'), url('../fonts/exo2bold.woff') format('woff'), url('../fonts/exo2bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
}

html, body {
	background:#a52626;
	margin:0px;
	padding:0px;
	font:300 17px 'Open Sans', Arial, Sans-seif;
	color:#ffdbd3;
}

img {
	max-width:100%;
}

b {
	font-family: "Open Sans", Arial, Sans-seif;
	font-weight:700;
}

h2 {
	font:400 25px 'Exo 2', Arial, Sans-seif;
	text-transform:uppercase;
	margin:0 0 20px;
}

.col-xs-6 {
	-ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
}

header {
	text-align:center;
}

.s1 {
	background: #992626;
	padding:30px 0;
	text-align:center;
}

.s2 {
	padding:30px 0;
	text-align:center;
}

.s1_2 {
	text-align:left;
}

.s1_2 h2 {
	text-align:center;
}

ul.styled {
	padding:0px;
	margin:0px;
	list-style:none;
	text-align:left;
}

ul.styled li {
	background:url(../img/marker.png) no-repeat;
	padding:0 0 0 60px;
	margin:0 0 20px;
}

ul.styled span {
	font:300 15px 'Open Sans', Arial, Sans-seif;
	display:block;
}

.screenshots, .games  {
	width:940px;
	margin:0 auto;
}

.games .col-md-1 {
	-ms-flex: 0 0 14.2%;
    flex: 0 0 14.2%;
    max-width: 14.2%;
}

.games img {
	margin:0 0px 15px;
}

.hidden {
	display:none;
}

footer {
	text-align:center;
	padding:40px 0;
}

.buttons {
	width:690px;
	margin:30px auto;
}

.title {
	font:700 25px 'Open Sans', Arial, Sans-seif;
	text-transform:uppercase;
}

.title:before {
	background:url(../img/fire.png) no-repeat;
	content:"";
	display:inline-block;
	width:28px;
	height:38px;
	margin:0 10px 0 0;
	vertical-align:middle;
}

.title:after {
	background:url(../img/fire.png) no-repeat;
	content:"";
	display:inline-block;
	width:28px;
	height:38px;
	margin:0 0px 0 10px;
	vertical-align:middle;
}

.logo {
	align-self:center;
	text-transform:uppercase;
	font:400 33px 'Open Sans', Arial, Sans-seif;
}


ol{
  counter-reset: myCounter;
  text-align:left;
  margin:0px;
  padding:0px;
}

ol li{
  list-style: none;
  margin: 0 0 20px 0;
}

ol li:before {
  counter-increment: myCounter;
  content: counter(myCounter);
  background: #ffdbd3;
  float:left;
  text-align: center;
  line-height: 30px;
  height: 30px;
  width: 30px;
  margin: 0 20px 0 0;
  color:#992626;
  border-radius:100%;
}

.hidden .row {
	justify-content:center;
}




@media (max-width: 1200px) {

}

@media (max-width: 992px) {
	.screenshots, .games {
		width:auto;
	}
	
	.screenshots img {
		margin:0 0 20px;
	}
	
	.screen img {
		margin:0 0 10px;
	}
	
}

@media (max-width: 768px) {
	.games .col-sm-4 {
		-ms-flex: 0 0 33.333333%;
		flex: 0 0 33.333333%;
		max-width: 33.333333%;
	}
	
	.buttons {
		width:auto;
	}
	
	.buttons img {
		margin:0 0 35px;
	}
	
	.hidden {
		display:block;
	}
	
}

@media (max-width: 576px) {
	.screenshots {
		text-align:center;
	}
	
	.title {
		font:700 25px 'Open Sans', Arial, Sans-seif;
	}
}


