﻿/**
*
* @package olympus Arcade
* @version $Id: olympus_arcade.css 228 2014-03-01 15:31:48Z Zelenka $ 
* @copyright (c) 2011-2014 Michel http://mods-services.fr/
* @copyright (c) 2013-2014 Zelenka  http://sons-of-games.fr/
* @license http://opensource.org/licenses/gpl-2.0.php GNU General Public License v2
*
*/
.rtl .icon-arcade {
    background-position : 100% 50%;
    padding             : 1px 17px 0 0;
    }
.icon-arcade {
    background-image : url(images/icon_arcade.gif);
    }
/*
* Jeu du jour / images des jeux
*/
#day img {
    border         : 4px double rgba(181, 107, 60, 0.8);
    border-radius  : 10px;
    height         : 40px;
    margin         : 5px;
    transition     : all 2s ease 0s;
    vertical-align : middle;
    width          : 40px;
    }
#day img:hover {
    border     : 4px double rgba(185, 185, 145, 0.8);
    margin     : 5px;
    transform  : rotate(45deg);
    transition : all 2s ease-in-out 0s;
    }
/*
* Vignettes Derniers jeux installés
*/
#thumb img {
    border             : 1px solid rgba(181, 107, 60, 0.8);
    border-radius      : 50px 50px 50px 50px;
    height             : 40px;
    padding            : 2px;
    -moz-transition    : All 2s ease 0s;
    -o-transition      : All 2s ease 0s;
    -webkit-transition : All 2s ease 0s;
    transition         : all 2s ease 0s;
    vertical-align     : middle;
    width              : 40px;
    }
#thumb img:hover {
    border             : 1px solid rgba(185, 185, 145, 0.8);
    -moz-transform     : rotate(45deg);
    -ms-transform      : rotate(45deg);
    -o-transform       : rotate(45deg);
    -webkit-transform  : rotate(45deg);
    transform          : rotate(45deg);
    -moz-transition    : all 2s ease-in-out 0s;
    -o-transition      : all 2s ease-in-out 0s;
    -webkit-transition : all 2s ease-in-out 0s;
    transition         : all 2s ease-in-out 0s;
    }
/*
* Vignettes sur le podium
*/
#thumbOA img {
    border             : 1px solid rgba(181, 107, 60, 0.8);
    border-radius      : 50px 50px 50px 50px;
    height             : 20px;
    padding            : 2px;
    -moz-transition    : All 2s ease 0s;
    -o-transition      : All 2s ease 0s;
    -webkit-transition : All 2s ease 0s;
    transition         : all 2s ease 0s;
    vertical-align     : middle;
    width              : 20px;
    }
#thumbOA img:hover {
    border             : 1px solid rgba(185, 185, 145, 0.8);
    -moz-transform     : rotate(45deg);
    -ms-transform      : rotate(45deg);
    -o-transform       : rotate(45deg);
    -webkit-transform  : rotate(45deg);
    transform          : rotate(45deg);
    -moz-transition    : all 2s ease-in-out 0s;
    -o-transition      : all 2s ease-in-out 0s;
    -webkit-transition : all 2s ease-in-out 0s;
    transition         : all 2s ease-in-out 0s;
    }
/*
* Images catégories
*/
#picture img {
    border             : 4px double rgba(181, 107, 60, 0.8);
    border-radius      : 10px 10px 10px 10px;
    height             : 60px;
    margin             : 5px;
    -moz-transition    : All 2s ease 0s;
    -o-transition      : All 2s ease 0s;
    -webkit-transition : All 2s ease 0s;
    transition         : all 2s ease 0s;
    vertical-align     : middle;
    width              : 60px;
    }
#picture img:hover {
    border             : 4px double rgba(185, 185, 145, 0.8);
    margin             : 5px;
    -moz-transform     : rotate(45deg);
    -ms-transform      : rotate(45deg);
    -o-transform       : rotate(45deg);
    -webkit-transform  : rotate(45deg);
    transform          : rotate(45deg);
    -moz-transition    : all 2s ease-in-out 0s;
    -o-transition      : all 2s ease-in-out 0s;
    -webkit-transition : all 2s ease-in-out 0s;
    transition         : all 2s ease-in-out 0s;
    }
/*
* Avatar game body
*/
#avataroa img {
    border         : 4px double rgba(181, 107, 60, 0.8);
    border-radius  : 50px;
    height         : 90px;
    margin         : 5px;
    transition     : all 2s ease 0s;
    vertical-align : middle;
    width          : 90px
    }
#avataroa img:hover {
    border     : 4px double rgba(185, 185, 145, 0.8);
    margin     : 5px;
    transform  : rotate(45deg);
    transition : all 2s ease-in-out 0s;
    }
/*
*  Texte record ultime
*/
.title_text_oa { /*Texte game_body*/
    color          : #FFFFFF;
    font-family    : Verdana, Helvetica, Arial, sans-serif;
    font-size      : 18px;
    font-weight    : bold;
    padding-top    : 7px;
    text-transform : uppercase;
    }
.hro { /*separation game_body code pour IE Chrome Mozilla Prosilver */
    border-bottom             : none;
    -moz-border-bottom-colors : none;
    border-color              : #ABABAB;
    border-image              : none;
    border-left               : transparent;
    -moz-border-left-colors   : transparent;
    border-right              : transparent;
    -moz-border-right-colors  : transparent;
    border-style              : outset ! important;
    border-top                : none;
    -moz-border-top-colors    : none;
    border-width              : 3px solid;
    color                     : #979797;
    }
.green-shadow {
    text-shadow : 0 0 1em #65FF49, 0 0 1em #65FF49, 0 0 1.2em #65FF49;
    }
/*
*  Cadre au tour du jeu
*/
.olympus {
    border        : 6px solid rgba(210, 183, 115, 0.7);
    border-radius : 5px 5px 5px 5px;
    position      : relative;
    z-index       : 1000;
    }
.olympus:hover {
    border             : 4px solid rgba(210, 183, 115, 0.9);
    border-radius      : 5px 5px 5px 5px;
    -moz-box-shadow    : 0 0 6px 3px rgba(210, 183, 115, 0.8);
    -webkit-box-shadow : 0 0 6px 3px rgba(210, 183, 115, 0.8);
    box-shadow         : 0 0 6px 3px rgba(4210, 183, 115, 0.8);
    position           : relative;
    z-index            : 1000;
    }
.copyOA {
    background    : none repeat scroll 0 0 rgba(0, 0, 0, 0.8);
    border        : 2px solid #7A0000;
    border-radius : 2px 2px 2px 2px;
    box-shadow    : 0 0 2px inset;
    color         : #FD9000;
    margin        : auto;
    padding       : 5px;
    text-align    : center;
    width         : 25%;
    }
.copyOA:hover {
    background    : none repeat scroll 0 0 rgba(0, 0, 0, 0.8);
    border        : 2px solid #7A0000;
    border-radius : 2px 2px 2px 2px;
    }
/*
*  Popup catégories
*/
a.bulle {
    background-color : rgba(29, 85, 98, 0.8);
    border           : 2px solid #005562;
    border-radius    : 2px;
    position         : relative;
    text-decoration  : none;
    }
a.bulle span {
    background      : none repeat scroll 0 0 rgba(29, 85, 98, 0.8);
    border          : 2px solid #005562;
    cursor          : pointer;
    font-weight     : bold;
    height          : 1px;
    left            : 50px;
    overflow        : auto;
    position        : absolute;
    text-decoration : none;
    transition      : all 0.5s ease 0s;
    visibility      : hidden;
    width           : 1px;
    }
a.bulle:hover span {
    background    : none repeat scroll 0 0 rgba(76, 72, 64, 0.8);
    border        : 2px solid #2D1B19;
    border-radius : 5px;
    height        : 90px;
    left          : 50px;
    position      : absolute;
    top           : -10px;
    transition    : all 1s ease-in-out 0s;
    visibility    : visible;
    width         : 250px;
    z-index       : 500;
    }
a.bulle:hover {
    z-index : 1;
    }
/*
*  Popup Page Games_body
*/
a.bullebis {
    background-color : rgba(76, 72, 64, 0.8);
    border           : 2px solid #2D1B19;
    border-radius    : 2px 2px 2px 2px;
    position         : relative;
    text-decoration  : none;
    }
a.bullebis span {
    background      : none repeat scroll 0 0 rgba(76, 72, 64, 0.8);
    border          : 2px solid #2D1B19;
    cursor          : pointer;
    font-weight     : bold;
    height          : 1px;
    left            : 50px;
    overflow        : auto;
    position        : absolute;
    text-decoration : none;
    transition      : all 0.5s ease 0s;
    visibility      : hidden;
    width           : 1px;
    }
a.bullebis:hover span {
    background    : none repeat scroll 0 0 rgba(76, 72, 64, 0.8);
    border        : 2px solid #2D1B19;
    border-radius : 5px 5px 5px 5px;
    height        : 65px;
    left          : -80px;
    position      : absolute;
    top           : -10px;
    transition    : all 1s ease-in-out 0s;
    visibility    : visible;
    width         : 150px;
    z-index       : 2;
    }
a.bullebis:hover {
    z-index : 1;
    }
/* Ajax User-Info cadre profil */
.Mchatshutbis {
    background-image    : url("http://mdr-relax-arcade.fr/styles/xtreammicro-s3/theme/images/MchatBarre.gif");
    background-repeat   : repeat-x;
    background-repeat   : no-repeat;
    border              : 1px double #804001;
    border-radius       : 9px 9px 0 0;
    box-shadow          : 0 0 18px rgba(255, 255, 255, 0.3) inset;
    color               : #FF9000 !important;
    font-weight         : bold;
    margin              : auto;
    opacity             : 1;
    text-align          : center;
    transition-duration : 2s;
    transition-property : opacity;
    width               : 35%;
    }
.Mchatshutbis:hover {
    box-shadow : none;
    /*opacity: 0.4;*/
    }
/* cadre profil partage-dons*/
.chover * {
    -moz-box-sizing : border-box;
    }
.chover {
    box-shadow : 0 2px 3px rgba(0, 0, 0, 0.3);
    display    : inline-block;
    }
.chover a {
    text-decoration : none;
    }
.shadow-14 img {
    float : left;
    }
.shadow-14 {
    transform : perspective(1000px);
    }
.shadow-14:hover {
    transform : perspective(1200px) rotateY(-25deg) rotateX(15deg);
    }
.shadow-14:after {
    bottom     : 10px;
    box-shadow : 8px 12px 10px rgba(0, 0, 0, 0.7);
    content    : "";
    height     : 80%;
    left       : 30px;
    position   : absolute;
    transform  : rotate(5deg) skew(10deg);
    z-index    : -1;
    }
.shadow-14:hover:after {
    box-shadow : 8px 8px 8px 8px rgba(255, 226, 0, 0.9);
    }
.shadow-14, .shadow-14:after {
    transition : all 0.4s ease-in-out 0s;
    }
.shadow-14:hover, .shadow-14:hover:after {
    transition : all 0.4s ease-in-out 0s;
    }
.shadow-13 img {
    float : left;
    }
.shadow-13 {
    transform : perspective(1000px);
    }
.shadow-13:hover {
    transform : perspective(1200px) rotateY(25deg) rotateX(15deg);
    }
.shadow-13:after {
    bottom     : 10px;
    box-shadow : 8px 12px 10px rgba(0, 0, 0, 0.7);
    content    : "";
    height     : 80%;
    left       : 30px;
    position   : absolute;
    transform  : rotate(5deg) skew(10deg);
    z-index    : -1;
    }
.shadow-13:hover:after {
    box-shadow : 8px 8px 8px 8px rgba(255, 226, 0, 0.9);
    }
.shadow-13, .shadow-14:after {
    transition : all 0.4s ease-in-out 0s;
    }
.shadow-13:hover, .shadow-14:hover:after {
    transition : all 0.4s ease-in-out 0s;
    }
/* Affichage de la vignette du jeu au survol*/
a.oalastgame {
    color           : #5DDAB4;
    position        : relative;
    text-decoration : none;
    }
a.oalastgame span {
    display    : none;
    visibility : hidden;
    }
a.oalastgame:hover {
    background : none repeat scroll 0 0 rgba(0, 0, 0, 0);
    z-index    : 1;
    }
a.oalastgame:hover span {
    background    : none repeat scroll 0 0 #3EA436;
    border-radius : 4px;
    display       : block;
    height        : 40px;
    left          : 78px;
    padding       : 2px;
    position      : absolute;
    top           : -60px;
    visibility    : visible;
    white-space   : nowrap;
    z-index       : 500;
    }
a.oalastgame img {
    height : 40px;
    width  : 40px;
    }
/* Avatar menu perso*/
#avatarindex img {
    border             : 1px solid rgba(181, 107, 60, 0.8);
    border-radius      : 50px;
    height             : 90px;
    -moz-transition    : All 2s ease 0s;
    -o-transition      : All 2s ease 0s;
    -webkit-transition : All 2s ease 0s;
    transition         : all 2s ease 0s;
    width              : 90px;
    }
#avatarindex img:hover {
    border             : 1px solid rgba(185, 185, 145, 0.8);
    -moz-transform     : rotate(45deg);
    -ms-transform      : rotate(45deg);
    -o-transform       : rotate(45deg);
    -webkit-transform  : rotate(45deg);
    transform          : rotate(45deg);
    -moz-transition    : all 2s ease-in-out 0s;
    -o-transition      : all 2s ease-in-out 0s;
    -webkit-transition : all 2s ease-in-out 0s;
    transition         : all 2s ease-in-out 0s;
    }
.bigavatar img {
    height             : 25px;
    position           : relative;
    -moz-transition    : -moz-transform 0.3s ease-out; /* FF3.5+ */
    -o-transition      : -o-transform 0.3s ease-out; /* Opera */
    -webkit-transition : -webkit-transform 0.3s ease-out; /* Saf3.1+, Chrome */
    transition         : transform 0.3s ease-out;
    width              : 25px;
    z-index            : 500;
    }
.bigavatar img:hover {
    -moz-transform    : scale(1.8); /* FF3.5+ */
    -ms-transform     : scale(1.8); /* IE9+ */
    -o-transform      : scale(1.8); /* Opera */
    -webkit-transform : scale(1.8); /* Saf3.1+, Chrome */
    transform         : scale(1.8);
    }
/* Emoticons panel for OA */
#smiley-box-oa {
    background-color : transparent;
    border           : 2px outset #D3AC6B;
    border-radius    : 5px;
    margin-left      : 33%;
    overflow         : hidden;
    padding          : 3px 3px 3px 3px;
    width            : 33%;
    }
#smiley-box-oa:hover {
    background-color : transparent;
    border           : 2px solid #D3AC6B;
    box-shadow       : 0 0 0.6em 0.1em rgba(144, 172, 111, 0.6);
    margin-left      : 33%;
    overflow         : hidden;
    padding          : 3px 3px 3px 3px;
    width            : 33%;
    }
#smiley-box img {
    margin : 3px;
    }
#smiley-cross-bar {
    height   : 200px;
    overflow : auto;
    }
#smiley-box {
    float : right;
    width : 18%;
    }
#smiley-box img {
    margin : 3px;
    }
/* table_arcadeoa */
.newarcadeoa.cats {
    display         : flex;
    flex-flow       : row wrap;
    justify-content : center;
    list-style      : none;
    margin          : 0;
    padding         : 0;
    text-align      : center;
    }
.newarcadeoa.cats > li {
    background    : #1a212a;
    border-radius : 4px;
    margin        : 11px;
    width         : 290px;
    }
.newarcadeoa.cats > li > div {
    padding : 10px;
    }
.newarcadeoa.cats > li > div + div {
    border-top : 1px dashed #000;
    }
.newarcadeoa.cats > li > h2 {
   background-image  : url('images/bg_list.gif');
    background-repeat : repeat-x;
    box-sizing        : border-box;
    font-size         : 16px;
    margin            : 0;
    padding           : 7px;
    position          : relative;
    }
.newarcadeoa.cats > li > h2 i {
    cursor   : pointer;
    position : absolute;
    right    : 10px;
    }
.newarcadeoa.cats > li > h2 ul {
    background    : #11161c;
    border        : 1px solid #2A394E;
    border-radius : 0 0 0 4px;
    display       : none;
    list-style    : none;
    max-height    : 200px;
    min-width     : 150px;
    overflow      : auto;
    position      : absolute;
    right         : 1px;
    top           : 33px;
    z-index       : 11;
    }
.newarcadeoa.cats > li > h2 ul li {
    border-bottom : 1px solid #2A394E;
    padding       : 5px;
    }
.newarcadeoa.cats > li > h2 ul li a {
    font-size : 13px;
    }
.newarcadeoa.cats > li > div > dl > dd {
    display        : inline-block;
    vertical-align : middle;
    }
.newarcadeoa.cats > li > div > dl > dd:first-child {
    width : 180px;
    }
.olympusstats {
    width : 100%;
    }
.olympusstats > h2 {
   background-image  : url('images/bg_list.gif');
    font-size        : 13px;
    font-weight      : normal;
    padding          : 7px 0;
    text-align       : center;
    }
.olympusstats > div {
    background    : #11161c;
    border-radius : 0 0 4px 4px;
    line-height   : 16px;
    padding       : 10px;
    }
.olympustopbox_header {
    list-style : none;
    margin     : 20px 0 0 0;
    padding    : 0;
    }
.olympustopbox_header > li {
   background-image  : url('images/bg_list.gif');
    font-size        : 16px;
    padding          : 5px 0 9px 0;
    }
.olympustopbox_header > li > dl {
    display    : flex;
    margin     : 0;
    padding    : 0;
    text-align : center;
    }
.olympustopbox_header > li > dl > dd:nth-child(1), .olympustopbox_header > li > dl > dd:nth-child(3) {
    width : 25%;
    }
.olympustopbox_header > li > dl > dd:nth-child(2) {
    width : 50%;
    }
.olympustopbox_content {
    list-style : none;
    margin     : 0;
    padding    : 0;
    }
.olympustopbox_content > li {
    background : #11161c;
    }
.olympustopbox_content > li > dl {
    display    : flex;
    margin     : 0;
    padding    : 0;
    text-align : center;
    }
.olympustopbox_content > li > dl > dd:nth-child(1), .olympustopbox_content > li > dl > dd:nth-child(3) {
    width : 25%;
    }
.olympustopbox_content > li > dl > dd:nth-child(2) {
    width : 50%;
    }
.olympustopbox_content > li > dl > dd > ul {
    list-style : none;
    margin     : 5px;
    padding    : 0 10px;
    }
.olympustopbox_content > li > dl > dd > ul > li {
    border  : 1px solid #2A394E;
    padding : 5px;
    }
.olympustopbox_content > li > dl > dd > ul > li:first-child {
     background-image  : url('images/bg_list.gif');
    border-radius : 8px 8px 0 0;
    border-top    : 1px solid #2A394E;
    }
.olympustopbox_content > li > dl > dd > ul > li:last-child {
    border-radius : 0 0 8px 8px;
    }
.olympustopbox_content > li > dl > dd > ul > li > dl {
    align-items : center;
    display     : flex;
    }
.olympustopbox_content > li > dl > dd .oa_titel {
    font-weight : bold;
    }
.olympustopbox_content > li > dl > dd:nth-child(2) > ul > li:first-child > dl > dd:nth-child(1) {
    border-right : 0;
    font-weight  : bold;
    width        : 15%;
    }
.olympustopbox_content > li > dl > dd > ul > li > dl > dd:nth-child(1) {
    border-right : 1px solid black;
    width        : 25%;
    }
.olympustopbox_content > li > dl > dd > ul > li > dl > dd:nth-child(2) {
    border-right : 1px solid black;
    width        : 60%;
    }
.olympustopbox_content > li > dl > dd > ul.oa_winners > li > dl > dd:nth-child(1) {
    width : 10%;
    }
.olympustopbox_content > li > dl > dd > ul.oa_winners > li > dl > dd:nth-child(2) {
    width : 20%;
    }
.olympustopbox_content > li > dl > dd > ul.oa_winners > li > dl > dd:nth-child(3) {
    border-right : 1px solid black;
    width        : 50%;
    }
.olympustopbox_content > li > dl > dd > ul.oa_winners > li > dl > dd:nth-child(4) {
    width : 20%;
    }
.olympustopbox_content > li > dl > dd > ul > li > dl > dd img {
    display        : inline-block;
    margin-top     : -3px;
    max-height     : 30px;
    max-width      : 30px;
    vertical-align : middle;
    }
.olympustopbox_content > li > dl > dd > ul > li > dl > dd:nth-child(3) {
    width : 25%;
    }
.olympustopbox_content > li > dl > dd > ul.oa_records > li > dl > dd:nth-child(1) {
    width : 10%;
    }
.olympustopbox_content > li > dl > dd > ul.oa_records > li > dl > dd:nth-child(2) {
    width : 20%;
    }
.olympustopbox_content > li > dl > dd > ul.oa_records > li > dl > dd:nth-child(3) {
    border-right : 1px solid black;
    width        : 50%;
    }
.olympustopbox_content > li > dl > dd > ul.oa_records > li > dl > dd:nth-child(4) {
    width : 20%;
    }
.maintablewrapper {
    backface-visibility : hidden;
    border-bottom       : 2px solid #2A394E;
    border-left         : 1px solid #2A394E;
    border-radius       : 6px;
    border-right        : 1px solid #2A394E;
    margin              : 20px 0;
    overflow            : hidden;
    width               : 100%;
    }
.gotpng{
       width:35px;
       height:40px;
       position:relative;
       margin:0 auto;
       background-size:100% !important;
   }
.gotpng > span{
color:black;
font-weight:bold;
position:absolute;
top:6px;
left:13px;
  }
.champ_oa_catline > div > a {
    display:         inline-flex;
    font-size:       20px;
    justify-content: center;
    border-bottom:   1px solid #2A394E;
    padding-bottom:  10px;
    align-items:     center;
    margin-bottom:   5px;
    }
.champ_oa_catline > div > a img {
    width:        40px;
    margin-right: 10px;
    }
.champ_oa_catline > div > span {
    display:     block;
    font-size:   16px;
    line-height: 30px;
    }
.champround_container {
    display:         flex;
    justify-content: center;
    }
.champround_container > div {
    padding:       5px 10px;
    border:        1px solid #2A394E;
    margin:        0 5px;
    border-radius: 4px;
    }
.champround_container > div > h4 {
    margin:      0 0 5px 0;
    text-shadow: 0 1px 1px black;
    }
.champround_container > div > span {
    line-height: 20px;
    }
.champround_container > div > span > small {
    font-size:  12px;
    display:    block;
    margin-top: 5px;
    color:      darkgoldenrod;
    }
.champround_container > div > span > small.finish {
    color: greenyellow;
    }
.oacup {
    color:          darkgoldenrod;
    text-shadow:    0 1px 1px black;
    font-size:      20px;
    display:        inline-block;
    vertical-align: middle;
    cursor:         pointer;
    }
.oachart {
    font-size: 20px;
    color:     darkgoldenrod;
    cursor:    pointer;
    }
.oa_table {
    background      : #11161c;
    border-collapse : collapse !important;
    border-spacing  : 0;
    border-style    : hidden;
    table-layout    : fixed;
    text-align      : center;
    width           : 100%;
    }
.oa_table > thead {
     background-image  : url('images/bg_list.gif');
    background-size  : contain;
    }
.oa_table > thead th {
    box-sizing : border-box;
    font-size  : 14px;
    padding    : 5px 0 9px 0;
    }
.oa_table > tbody td {
    border-top     : 1px solid #2A394E;
    padding        : 10px;
    vertical-align : top;
    }
.oa_table.in > tbody td {
    border         : 1px solid #2A394E;
    vertical-align : middle;
    }
.oa_table.nopad > tbody td {
    padding : 0;
    }
.oa_table.border > tbody td {
    border : 1px solid #2A394E;
    }
.oa_table > tbody td select, .oa_table > tbody td input {
    border : 1px solid #2A394E !important;
    }
.tablewrapper {
    border-bottom : 1px solid #2A394E;
    border-left   : 1px solid #2A394E;
    border-radius : 6px;
    border-right  : 1px solid #2A394E;
    border-top    : 1px solid #2A394E;
    margin-top    : 1px;
    overflow      : hidden;
    width         : 100%;
    }
.oa_intable {
    background      : #11161c;
    border-collapse : collapse !important;
    border-spacing  : 0;
    border-style    : hidden;
    text-align      : center;
    width           : 100%;
    }
.oa_intable > thead {
    background    : linear-gradient(to bottom, #242d3a 0%, #181e26 100%);
    font-weight : bold;
    }
.oa_intable > thead th {
    font-size      : 11px;
    padding        : 5px 0 9px 0;
    vertical-align : middle;
    }
.oa_intable > tbody td {
    border         : 1px solid #2A394E;
    padding        : 2px;
    vertical-align : middle;
    }
.oa_intable > tbody td .avatar {
    border-radius  : 4px;
    height         : 30px;
    vertical-align : middle;
    width          : 30px;
    }
.top10rankindex {
    display         : flex;
    justify-content : space-between;
    list-style      : none;
    margin          : 0;
    padding         : 0;
    }
.top10rankindex > * {
    padding    : 0;
    text-align : center;
    width      : 170px;
    }
.top10rankindex > * img {
    border-radius : 4px;
    height        : 70px;
    width         : 70px;
    }
.oa_catin {
    display         : flex;
    flex-flow       : row wrap;
    justify-content : center;
    list-style      : none;
    margin          : 0;
    padding         : 0;
    }
.oa_catin > li {
    background    : #1a212a;
    border-radius : 4px;
    margin        : 5px;
    min-width     : 282px;
    }
.oa_catin > li > h2 {
    background-image  : url('images/bg_list.gif');
    background-size  : contain;
    font-size        : 15px;
    margin           : 0;
    padding          : 5px 10px;
    }
.oa_catin > li > .catcontent {
    padding : 10px;
    }
.oa_catin > li > .catcontent > fieldset {
    border        : 1px solid #2A394E;
    border-radius : 4px;
    margin-bottom : 5px;
    padding       : 5px;
    }
.oa_catin > li > .catcontent > fieldset:first-child {
    align-items : flex-start;
    display     : flex;
    }
.oa_catin > li > .catcontent > fieldset:first-child ul {
    flex : 1;
    }
.oa_catin > li > .catcontent > fieldset:first-child ul > li > a > i, .oa_catin > li > .catcontent > fieldset:first-child ul > li > i {
    color       : #ffffff;
    text-shadow : 0 1px 1px black;
    }
.oa_catin > li > .catcontent > fieldset > ul {
    list-style : none;
    margin     : 0;
    padding    : 0;
    }
.oa_catin > li > .catcontent > fieldset > ul > li {
    margin : 5px 0;
    }
.oa_catin > li > .catcontent > fieldset:last-child ul li {
    align-items : center;
    display     : flex;
    flex-flow   : row wrap;
    }
.oa_catin > li > .catcontent > fieldset:last-child ul li > span {
    flex : 1;
    }
.oa_catin > li > .catcontent > fieldset:last-child ul li > span + span {
    flex : none;
    }
.oa_newingame {
    list-style : none;
    margin     : 0 0 0 20px;
    padding    : 0;
    }
.oa_newingame > li > div {
    border        : 1px solid #2A394E;
    border-radius : 4px;
    margin        : 10px;
    padding       : 10px;
    }
.oa_newingame > li > h2 {
	background-image:linear-gradient(to bottom, #293341 0%, #313e4f 100%) !important;

    border-radius    : 10px;
    font-size        : 18px;
    padding          : 5px;
    }
	.arcade_topplayers {
    display:         flex;
    justify-content: center;
    list-style:      none;
    margin:          0 auto;
    padding:         0;
    text-align:      center;
        align-items: center;
        flex-flow:row wrap;
    }

.arcade_topplayers li{
    margin:10px 20px;
}

.arcade_topplayers li span {
    display: block;
    }
.arcade_topplayers li span:first-child {
    margin-top: 10px;
    }
.arcade_topplayers li span:last-child {
    margin: 10px 0;
    }
.arcade_topplayers li span:last-child img {
    width: 20px;
    }
.arcade_topplayers li span small {
    font-weight: bold;
    font-size:   12px;
    }
.arcade_topplayers li span img.avatar {
    width:         52px !important;
    height:        53px !important;
    border-radius: 100%;
    }
