/*!
 * 
 * Default Css
 *  
 */
/*Web Font*/
@font-face {
    font-family: 'computerfontregular';
    src: url('../font/computerfont-webfont.eot');
    src: url('../font/computerfont-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/computerfont-webfont.woff2') format('woff2'),
         url('../font/computerfont-webfont.woff') format('woff'),
         url('../font/computerfont-webfont.svg#computerfontregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
*{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box; font-family: 'computerfontregular';}
html{font-family:sans-serif;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}
body{margin:0; font-family: 'computerfontregular';}
article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}
audio,canvas,progress,video{display:inline-block;vertical-align:baseline}
ul { margin:0; padding:0; list-style:none;}
h6 {margin:0; color:#010101; font-weight:400;}
a,img {outline:0!important; text-decoration:none;}
a:hover {text-decoration:none;}
a, button {border:0; transition: all 0.5s ease; }
figure {margin:0;}
input {line-height:1; outline:0; border-radius:0; transition:all .5s ease-in-out; -webkit-transition:all .5s ease-in-out; -moz-transition:all .5s ease-in-out; -ms-transition: all .5s ease-in-out;}
ul {padding:0; margin:0; list-style:none;}
img {max-width:100%;}
/*!
 * Custom Css
*/
.container { max-width:1360px; margin:0 auto;}

/**header**/
.logo {text-align:center; padding:3.8rem 0;}
.logo a { display: block; color:#010101; font-size:7.8rem; line-height:3.8rem;}
.logo img{width:88%;}
.navigation {background:#010101; width:100%; float:left;}
.navigation ul li {float:left; width:25%; text-align:center;} 
.navigation ul li a{display:block; color:#fff; text-transform:lowercase; border-right:4px solid #fff; font-size:1.6rem; padding:1.25rem .5rem;} 
.navigation ul li:last-child a{border:0;} 
/*Home_Wrap*/
.content_main {padding:60px 0 20px; width:100%; float:left;}
/*.trailer_box {min-height:350px; border:3px solid #010101;}*/
.home_wrap { padding:20px 0; width:100%; float:left;}
.h_col_1 {width:38%; float:left;}
.h_col_1 h4 {font-size:2.6rem; text-align:center; margin:0;}
.trailer_box img {width:100%;}
.h_col_2 {float:right; width:60%;}
.h_col_lft {width:40%; float: left; padding:0 30px; text-align:center;}
.h_col_lft img{width:92%; vertical-align:top;}
.h_col_rht{width:59%; float: left; text-align:center;}
.h_col_rht h3{font-size:3.4rem; line-height:3.6rem; text-align:center; margin:10px 0 0;}
.app_link a {border:3px solid #010101; color:#010101; font-size:2.6rem; min-width:200px; line-height:3.90rem; display:inline-block; margin:1.875rem 0; padding:.5rem 0rem .2rem;}
.app_link a:hover {background:#010101; color:#fff;}
/*Download*/
.main_wrap{padding:1rem 0; width:100%; float:left;}
.download_wrap li { width:22%; float:left; margin:0 1.5%;}
.download_wrap li h6 { margin: 5px 0; font-size: 1.6rem; text-align: center; color:#010101; line-height: 1.7rem;}
.download_wrap li:hover h6,.download_wrap ul li:hover h6 a { color:#ce0d0e;}
.download_wrap li h6 a{ font-size: 1.6rem; text-align: center; color:#010101; line-height:1.7rem;}
/*HighScores*/
.score-boxes {background-color:#fff; border:8px solid #010101; width:30.333%; float:left; margin:0 1.5%; padding:20px 2rem; background-repeat:no-repeat; background-position:center; background-size:62%;}
.box-1 {background-image:url(../img/score-bg1.jpg);}
.box-2 {background-image:url(../img/score-bg2.jpg);}
.box-3 {background-image:url(../img/score-bg3.jpg);}
.score-boxes h6 {font-size:1.6rem; line-height:1.7rem; text-align:center; font-weight:600; margin-bottom:15px; min-height: 54px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; width: 100%; justify-content: center; align-items: center; }
.score-table {width:100%;font-size: 1.758rem;}
.score-table th, .score-table td{text-align:left; color:#f90000; font-size:inherit; line-height:30px;}
.score-table th span { border-bottom: 2px solid #f90000; display: inline-block; margin-bottom:7px;}
.score-table tr th:nth-child(2) { min-width:100px;}
.score-table tr th:nth-child(3), .score-table tr td:nth-child(3) { text-align:right;}
.score-table tr td:nth-child(2) {padding-left:14px;}

.no-score { display: flex;  display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; justify-content: center; align-items: center; min-height: 336px; font-size: 1.6rem; color:#f90000}


/**********/
/**Media**/
/********/
@media (max-width:1440px){
.container { max-width:1170px;}
.logo a {font-size:6rem; line-height:5.8rem;}
.score-table { font-size: 1.558rem;}
.score-boxes {min-height: 537px;}
.score-boxes h6 {min-height: 82px;}
}

@media (max-width:1200px){
.container { max-width:970px;}
/**Header**/
.logo {padding:3rem 0;}
.logo a {font-size:6rem; line-height:5.8rem;}
/**Home**/
.h_col_rht h3 {font-size:3rem; line-height:3rem;}
.app_link a {font-size:2rem; margin: 1.375rem 0;}
/**Download*/
.download_wrap li { width:23%; float:left; margin:0 1%;}
/**HighScores*/
.main_wrap {padding:0;}
.score-boxes {width:31.33%; padding:20px 1.5rem;}
.score-boxes:first-child {margin-left:0;}
.score-boxes:nth-child(3n),.score-boxes:last-child {margin-right:0;}
.score-table, .no-score {font-size: 1.5rem;}
.score-boxes h6 {font-size:1.4rem; min-height: 81px;}
.score-table tr td:nth-child(2) {padding-left: 10px;}
}

@media (max-width:991px){
.container { max-width:750px;}
/**Header**/
.logo {padding:2rem 0;}
.logo a {font-size:4rem; line-height:3.8rem;}
/**Home**/
.h_col_1, .h_col_2 {width:100%;}
.h_col_2 {width:100%; margin:3rem 0 0;}
.scores_div {text-align:center;}
.score-boxes {width:47%; margin-left:0; margin-right:2%; margin-bottom:2.5%; float:none; display:inline-block; vertical-align:top;}
/**highScores*/
.score-boxes h6 {min-height: 54px;}
/**Download**/
.download_wrap li {width:44%; margin:0 3% 3%;}
.download_wrap li:nth-child(2n+1) {clear:both;}
.download_wrap li h6 {font-size: 1.5rem; line-height:1.5rem;}
.score-boxes { min-height:237px;}
}

@media (max-width:767px){
.container { max-width:90%; }
/**header**/
.logo {padding:2rem 0;}
.logo a {font-size:4rem; line-height:3.4rem;}
.navigation ul li a {padding:1rem .2rem; font-size:1.4rem; border-right-width:3px;}
/**home**/
.content_main {padding: 50px 0 20px;}
.home_wrap {padding:0;}
.app_link a { font-size:1.8rem; line-height: 2.4rem; margin: 2rem 0 0; min-width: 170px;}
.h_col_rht h3 {font-size: 2.6rem;line-height:2.5rem;}
.h_col_lft {padding:2rem 30px;}
.h_col_lft img{width:100%;}
.score-boxes { width: 78%; margin-left:0; margin-right: 0;}
.score-boxes h6 {font-size: 1.8rem;}
}

@media (max-width:620px){
/**highscore**/
.score-boxes {width:100%; margin-left:0; margin-right:0;}
.score-boxes h6 {min-height:auto;}
.score-table { font-size: 1.4rem;}
.score-boxes h6 {font-size: 1.6rem;}
}
	
@media (max-width:480px){
.logo {padding:1rem 0;}
.logo a {font-size: 3rem; line-height: 2.5rem;}
.navigation ul li a{font-size: 1.2rem;}
.content_main {padding: 30px 0 10px;}
/**home**/
.h_col_2 {margin: 2rem 0 0;}
.h_col_lft{width: 46%; padding: 2rem 15px;}
.h_col_rht{width:54%;}
.h_col_rht h3 {font-size:2rem; line-height:1.6rem}
.app_link a { font-size:1.6rem; line-height: 2rem; margin:2.0rem 0 0; min-width: 150px;}
.h_col_2 {margin: 1rem 0 0;}
/**download**/
.download_wrap {text-align:center;}
.download_wrap li {width:80%; margin:0 3% 12%; float:none; display:inline-block;}
.score-table {  font-size: 1.2rem;}
}

@media (max-width:420px){
.navigation ul li a{font-size: 1.2rem;}
.navigation { display: -webkit-flex; /* Safari */ -webkit-justify-content:  space-between; /* Safari 6.1+ */ display: flex; justify-content: space-around; text-align:center;}
/**home**/
.h_col_2 {margin: 2rem 0 0;}
.h_col_lft{width: 46%; padding: 2rem 15px;}
.h_col_rht{width:54%;}
.h_col_rht h3 {font-size:1.8rem;}
.app_link a {font-size:1.4rem; line-height: 2rem; margin: 1.0rem 0 0; min-width: 140px;}
.h_col_2 {margin: 1rem 0 0;}
.score-boxes {padding: 20px 1.5rem;}
.menu { width: 100%; text-align: center;  display: flex;  justify-content: center;}
.navigation ul li a { padding: .8rem .8rem; border-right-width: 2px; font-size:1.2rem;}
.navigation ul li {width:auto;}
.app_link a:last-child { margin-top:1.9rem;}
}

@media (max-width:350px){
.menu {width:100%; text-align: center;}
.navigation ul li a {font-size:1.1rem; padding: .8rem .5rem;}
}