@font-face {
    font-family: 'bebas_neuebold';
    src: url('/fonts/bebasneue_bold-webfont.eot');
    src: url('/fonts/bebasneue_bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('/fonts/bebasneue_bold-webfont.woff2') format('woff2'),
         url('/fonts/bebasneue_bold-webfont.woff') format('woff'),
         url('/fonts/bebasneue_bold-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'bebas_neue_regularregular';
    src: url('/fonts/bebasneue_regular-webfont.eot');
    src: url('/fonts/bebasneue_regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('/fonts/bebasneue_regular-webfont.woff2') format('woff2'),
         url('/fonts/bebasneue_regular-webfont.woff') format('woff'),
         url('/fonts/bebasneue_regular-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
  font-family: 'Roboto Condensed';
  font-style: normal;
  font-weight: 400;
  src: local('Roboto Condensed'), local('RobotoCondensed-Regular'), url(https://fonts.gstatic.com/s/robotocondensed/v13/Zd2E9abXLFGSr9G3YK2MsDAdhzWOYhqHvOZMRGaEyPo.woff2) format('woff2');
}
@font-face {
  font-family: 'Roboto Condensed';
  font-style: normal;
  font-weight: 700;
  src: local('Roboto Condensed Bold'), local('RobotoCondensed-Bold'), url(https://fonts.gstatic.com/s/robotocondensed/v13/b9QBgL0iMZfDSpmcXcE8nHm2hrkyco9jQ3NKMXpgOBg.woff2) format('woff2');
}

input, a:hover, a:focus, li, li:hover, li:focus{outline:0}
header{background-color:#000;background-image:url(/img/home_header_1.jpg);background-position:top right;height:113px;position:relative;overflow:hidden;background-repeat:no-repeat}
header h2,header h1{color:#FF8400;position:absolute;/*left:160px*/left:147px;top:30px;font-size:50px}
header h1, header h1 a, header h1 a:hover {color:#FFF}
.search{position:absolute;right:10px;top:20px}
.search input[type=text]{background:none;border:none;border-bottom:3px #fff solid;color:#fff;text-align:left;font-size:20px}
.search input[type=text]:focus {text-align:left}
.search input { vertical-align: bottom; }
.search .placeholder { position: absolute; font-family:'bebas_neuebold'; right: 44px; top: 0px; color: #fff; font-size: 30px; }
#search_icon { width: 38px; }
.desktop{display:initial}
.mobile{display:none}

a.logo{position:absolute;/*left:29px;*/top:20px;width:110px;height:80px;display:block;border-right:2px solid #fff}
a.logo img{height:77px}
body{font-family:'Roboto Condensed',Helvetica,Arial,sans-serif;font-size:14px;background:#F1F1F1;color:#666}
a{color:#666}
a:hover{color:#FF8400;text-decoration:none}
h1,h2,h3,h4,h5,h6,footer{font-family:'bebas_neuebold',sans-serif;font-weight: normal}
footer,.home-games h3{font-family:'bebas_neue_regularregular',sans-serif;font-weight: normal}
ul.orange{list-style:none;margin:0;padding:0}
ul.orange li{background:url(/img/punktor_orange.png) 0 8px no-repeat;margin:0;padding:1px 0 1px 15px}
.content { background: #fff; padding: 20px 30px; min-height: 70vh; margin: 20px 0}
.content p{text-align:justify; }
.content p:after {display:table;content:" "; clear:both;}

.choose-bar{background:#fff}
.choose-bar h4{color:#aaa;padding:5px 0}
.choose-bar ul{list-style-type:none;padding:0 0 10px}
.choose-bar ul li{display:inline-block;padding:0 20px;border-left:1px #D3D3D3 solid; border-right:1px #fff solid;}
.choose-bar ul li.active+li,.choose-bar ul li:first-child{border-left:1px #fff solid}
.choose-bar ul li.active{border:1px #FF8400 solid;background:#fff;box-shadow:1px 1px 5px #ccc;line-height:14px}
.choose-bar ul li a{display:inline-block;font-size:12px;color:#999;background-position:center left;background-repeat:no-repeat;padding:10px 0 10px 30px;opacity:.5}
.choose-bar ul li.active a,.choose-bar ul li:hover a{opacity:1;text-decoration:none}
.choose-bar ul li.unactive a,.choose-bar ul li.unactive:hover a{ opacity:0.3; cursor: default; }



.level-back { text-indent: 1000px; position: absolute;  bottom: 0px;  display: inline-block; width: 28px; border-top-left-radius: 5px; border-top-right-radius: 5px; overflow: hidden; background: #fff url(/img/arrow_back.png) no-repeat 4px 1px; opacity: 1; height: 18px; vertical-align: top;};
.level-back:hover { opacity: 0.8; }

.choose-bar .mobile li a{font-size:15px;opacity:1; white-space: nowrap; }
.choose-bar .mobile li.active{box-shadow:1px 1px 10px #ccc;padding-top:5px;padding-bottom:5px}
.choose-bar .mobile ul>li.active{display:none}
.choose-bar ul.platforms li a{padding-left:38px}
.choose-bar ul.languages li a{padding-left:30px}
/*.container{width:1230px}*/
.home-games h3{font-size:40px;color:#7F7F7F}
/*
.home-games img{vertical-align:top;float:left}
.home-games img[class*="size-"]{width:50%}
.home-games img.size-2x2{padding-right:10px}
.home-games img.size-2x1{margin-bottom:10px}
.home-games img.size-1x1{padding-right:10px;width:25%}
.home-games a:last-child img{padding:0}
*/
.home-topics{padding:20px 0}
footer{background:#E0E0E0;color:#939393;padding:15px 0}
footer a{color:#939393}
footer ul{list-style-type:none;display:inline;margin:0;padding:0 0 0 10px; white-space: nowrap;}
footer ul li{display:inline;padding:0 7px}
footer .menu,footer .copyright{display:inline-block}
.games{height:470px}
.games [class*="size-"]{width:49%;height:98%;display:block;float:left; margin: 0.5% 0.5%;}
.games [class*="size-"] a{width:100%;height:100%;display:block;overflow:hidden}
.games .size-2x2{border-left:none;height:100%}
.games .size-2x1 {height:49%;}
.games .size-1x1 {width:24%;height:49%}
.games .size-2x2 img{width:98%}
.games .size-2x1 img{width:98%}
.games .size-1x1 img{height:98%}
#htitle h2{margin-top:22px}
.rowinside{margin-left:-30px;margin-right:-30px}
img.mobile{display:none}
img.desktop{display:block}

.no-gutter > [class*=col-] {
    padding-right: 0;
    padding-left: 0;
}

.game-support .box{background-color:#fff; min-height: 206px; position: relative; }
.game-support .box{border-right:10px solid #f1f1f1; padding: 1px 15px; margin-bottom: 10px;}
.game-support .box-column:last-child .box{border-right:none}
.content-in-box h2 { font-size: 20px; }

.game-support h2, .game-support h2 a {color: #FF8400}
.game-support h2+h3{font-size:1.5rem;letter-spacing:1px;margin-top:-1rem}
.game-support .boxes{border-bottom:10px solid #f1f1f1}
.seeall, .btn-in-box {background-color:#FF8400;padding:5px 15px;display:inline-block; position: absolute; right: 0; bottom: 0; font-size:1.5rem;cursor:pointer}
.seeall a, .btn-in-box a{color:#fff;text-decoration:none!important}
/* .seeall a:before,.box h2:after,.game h1:after{content:"";display:inline-block;position:relative} */
.seeall a:before{background:url(/img/punktor_white.png) 0 0 no-repeat;width:11px;height:7px;top:-2px;text-decoration:none!important}
.box h2:after{background:url(/img/select_right_orange.png) 0 0 no-repeat;width:6px;height:11px;top:-5px;right:-15px}
.seeall:hover{background-color:#000;text-decoration:none!important;border:0}
.seeall:hover a{text-decoration:none!important;border:0}
.seeall{line-height:2rem}

header.game{height:245px; background-image: none; background-position: top center;}
.game h1{font-size:6rem;margin-top:12px}
.game .h1,.game h2{font-size: 3rem}
.game h2{top:0;margin-top:15px}
.game h1:after{background:url(/img/select_down_white.png) 0 0 no-repeat;width:11px;height:6px;top:-18px;right:-15px}
#cta{margin:4px 0 12px;float:right}
.cta h3, #cta,.score h3{display:inline-block}
.last-mod { text-align: right!important; font-size:11px}
.score { padding: 20px 0; vertical-align:middle}
.score h3 { line-height: 40px; }
.helpful img { opacity: 0.4; vertical-align: top; margin-left: 10px; height: 32px; }
a.helpful img:hover, .helpful.selected img { opacity: 1; }
.hf-no img {    -ms-transform: rotate(180deg); /* IE 9 */
    -webkit-transform: rotate(180deg); /* Safari */
    transform: rotate(180deg);}

input[type="submit"].seeall{border:0!important;color:#fff}
select[name="category"]{height:4rem}

.btn-primary {
    color: #FFF;
    background-color: #FF8400;
    border-color: #FF8400;
}

.btn-primary:hover {
    color: #FFF;
    background-color: #000;
    border-color: #000;
}

table.data{border-spacing:0;border-collapse:collapse;color:#333;text-shadow:1px 1px 0 #fff;background:#eaebec;border-bottom:#ccc 1px solid;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;margin-bottom:10px;width:100%}
table.piece-list{width:200px}
table.data th{padding:5px;border-top:1px solid #fafafa;border-bottom:1px solid #e0e0e0;background:#ededed;background:-webkit-gradient(linear,left top,left bottom,from(#ededed),to(#ebebeb));background:-moz-linear-gradient(top,#ededed,#ebebeb)}
table.data th:first-child{text-align:left;padding-left:10px}
table.data tr:first-child th:first-child{-moz-border-radius-topleft:3px;-webkit-border-top-left-radius:3px;border-top-left-radius:3px}
table.data tr:first-child th:last-child{-moz-border-radius-topright:3px;-webkit-border-top-right-radius:3px;border-top-right-radius:3px}
table.data tr{padding-left:10px}
table.data td:first-child{text-align:left;padding-left:10px;border-left:0}
table.data td{padding:5px;border-top:1px solid #fff;border-bottom:1px solid #e0e0e0;border-left:0 solid #e0e0e0;background:#fff}
table.data tr.even td{background:#fff}
table.data tr:last-child td{border-bottom:0}
table.data tr:last-child td:first-child{-moz-border-radius-bottomleft:3px;-webkit-border-bottom-left-radius:3px;border-bottom-left-radius:3px}
table.data tr:last-child td:last-child{-moz-border-radius-bottomright:3px;-webkit-border-bottom-right-radius:3px;border-bottom-right-radius:3px}
table.data tr:hover td{background:#f2f2f2}


/* .content>p:not([class*="last-mod"]),.content>p>img{display:table} */
.content>p>img{float:left;margin-right:2rem; max-width: 50%; }

.feedback{text-transform: uppercase;
    padding: 1rem 2rem;
    border: 1px solid #FF8400;
    width: auto;
    display: inline-block;}

.form-control:focus {
    border-color: #FF8400;
    box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.075) inset, 0px 0px 8px rgba(255, 132, 0, 0.3);
}

/* ---- grid ---- */

.grid {
 margin: 0 -4px;

}

/* clear fix */
.grid:after {
  content: '';
  display: block;
  clear: both;
}

/* ---- .element-item ---- */

/* 5 columns, percentage width */
.grid-item,
.grid-sizer {
  width: 25%;
}

.grid-item {
  float: left;
  height: 230px;
  border: 4px solid #F1F1F1;
}

.grid-item--width2 { width: 50%; }
.grid-item--height2 { height: 460px; }


.grid-item img{width:100%; height: 100%;}
.grid img:hover{opacity:0.8}


select[name="category"]
{-webkit-border-radius:0;-moz-border-radius:0;border-radius:0}


/*
	Animations
*/
.grid img {
  object-fit: cover;
}
.grid img,.choose-bar ul.platforms li a
{-webkit-transition: opacity 0.4s ease-out 0.1s;-moz-transition: opacity 0.4s ease-out 0.1s;transition: opacity 0.4s ease-out 0.1s}
.seeall
{-webkit-transition: background-color 0.2s ease-in-out 0s;-moz-transition: background-color 0.2s ease-in-out 0s;transition: background-color 0.2s ease-in-out 0s}
a, li a, a.more
{-webkit-transition: color 0.2s ease 0.1s;-moz-transition: color 0.2s ease 0.1s;transition: color 0.2s ease 0.1s}

/*
	Responisive settings
*/
/* XS */
@media (max-width: 767px){

.desktop{display:none}
.mobile{display:initial}
.games{margin:0 -15px}
.games [class*="size-"]{width:100%;border-left:none;border-bottom:10px solid #F1F1F1}
.games [class*="size-"] img{width:100%;height:auto}
.games{height:100%}
img.mobile{display:block}
img.desktop{display:none}
/*
.content>p:not([class*="last-mod"]),.content>p>img{display:block;width:100%}
.content>p>img{float:none;margin:3rem 0 1rem 0}
*/

.platforms .dropdown-menu > li > a:focus, .platforms  .dropdown-menu > li > a:hover { background-color: #fff; }
.languages .dropdown-menu > li > a:focus, .languages  .dropdown-menu > li > a:hover { background-color: #fff; } 
.choose-bar .mobile li.active.dropdown-toggle a:after {
content: ' ';
width: 18px;
height: 10px;
background: url(/img/drop_pointer.png) center right no-repeat;
display: inline-block;
}

.grid-item { position: static !important; width: 100%; height:auto; }

header:not([class]){background-position:25% 0}
header.game .container { height: 100%; background: rgba(0,0,0,0.4); }
footer ul li .fa:before{font-size:26px}
footer ul li .fa{margin-left:16px}
footer .menu, footer .copyright{font-size:18px}
/* .orange li a{font-size:22px} */
/*.game-support .box,.game-support .boxes{border:none;border-bottom:30px solid #f1f1f1}*/
.game-support .box { padding-bottom: 35px; height: auto; min-height:initial}
.game-support .box:last-child{border:none}
.mobile .search{right:15px;top:-55px;position:absolute}
.search{top:40px}
a.logo{width:80px;height: 60px;}
a.logo img{height:55px}
header h2, header h1{left:110px;top:25px;font-size:35px}
.game #htitle .h1{font-size:2.25rem}
.game #htitle h1{font-size:4rem;margin-top:14px}
.game #htitle h2{margin-top:10px}
#htitle h2{margin-top:18px}
header.game{height:115px;background-size:cover}

}
/* SM */
@media (min-width: 768px) and (max-width: 991px){
.games{height:300px}
.choose-bar .mobile{display:initial}
.choose-bar .desktop{display:none}
header:not([class]){background-position: 25% 0}
}
/* MD */
@media (min-width: 992px) and (max-width: 1199px){
.games{height:390px}
header:not([class]){background-position: 0 0}
}
/* LG */
@media (min-width: 1200px){

}
/* HG */
@media (min-width: 2550px){

}
/* X3 4" */
@media (max-width: 480px){
#cta {float: none; }
.game h1 { font-size: 46px; }
#search_query, .placeholder { display: none; }
.search input[type="text"] { width: 190px; }


}
/* X2 3.5" */
@media (max-width: 360px){
footer ul li .fa{margin-left:4px}
footer ul li .fa:before{font-size:22px}
.score h3{font-size:2rem}
.content h1 {font-size: 2.75rem}
.cta h3, #cta, .score h3 {display:block}
#cta{margin:0}

footer .menu span{display:none}

}
/* X1 3" */
@media (max-width: 320px){
footer ul li .fa{margin-left:0;margin-right:-8px}
.game h1 { font-size: 38px; }
header h2, header h1,  header h2 a.h1 { font-size: 30px; }
#htitle h2 {  margin-top: 24px; }
.game h2 { font-size: 26px; }
.game #htitle h2 {
    margin-top: 14px;
}


.search input[type="text"] { width: 160px; }
}