/* GAMECARDS */

.gameCardListHomePage {
    display: inline-block;
    width: 42.5em; /* 680px/16 = 42.5em */
    height: 44em; /* 704px/16 = 44em */
    background-color: #f0efeb;
    border-style: solid;
    border-width: 0.062em; /* 1px/16 = 0.062em */
    border-color: #afaeaa;
    border-radius: 0.938em; /* 15px/16 = 0.938em */
    -moz-border-radius: 0.938em; /* Old Firefox (3.6 to 15) */
    box-shadow: 0 0 0.25em #888888; /* 4px/16 = 0.25em */
    padding-top: 0.625em; /* 10px/16 = 0.625em */
    padding-left: 1.063em; /* 17px/16 = 1.063em */
    text-align: left;
    margin-bottom: 0.625em; /* 10px/16 = 0.625em */
    overflow: hidden;
}

.gameCardList {
    display: inline-block;
    width: 54.75em; /* 876px/16 = 54.75em */
    background-color: #eeede9;
    border-style: solid;
    border-width: 0.062em; /* 1px/16 = 0.062em */
    border-color: #c6c6c6;
    border-radius: 1.5em; /* 24px/16 = 1.5em */
    -moz-border-radius: 1.5em; /* Old Firefox (3.6 to 15) */
    box-shadow: 0 0 0.25em #888888; /* 4px/16 = 0.25em */
    vertical-align: bottom;
    margin-bottom: 2.25em; /* 36px/16 = 1.25em */
}

.gameCardListHeader {
    position: relative;
    height: 12.938em; /* 207px/16 = 12.938em */
    background-image: url('../img/web/common/gameCardListHeadBar.png');
    background-repeat: repeat-x;
    background-position: left bottom;
}

.gameCardListTitle {
    display: block;
    width: 11.8em; /* 177px/15 = 11.8em */
    height: 3.8em; /* 57px/15 = 3.8em */
    position: absolute;
    top: 1.333em; /* 20px/15 = 1.333em */
    left: -1.467em; /* -22px/15 = -1.467em */ 
    background-image: url('../img/web/common/gameCardListHeadTitle.png');
    background-repeat: no-repeat;
    text-transform: uppercase;
    font-family: futura_md_btmedium, Arial, Helvetica, sans-serif;
    font-size: 0.938em;
    font-weight: normal;
    color: #ffffff;
    padding-top: 0.45em;
}

.gameCardListCategories {
    display: inline-block;
    width: 32.813em; /* 525px/16 = 32.813em */
    padding-top: 2.438em; /* 39px/16 = 2.438em */
}

.gameCardListCategory {
    display: block;
    width: 20em; /* 300px/15 = 20em */
    position: absolute;
    bottom: 2.333em; /* 35px/15 = 2.333em */
    left: 2em; /* 30px/15 = 2em */
    text-transform: uppercase;
    font-family: futura_md_btmedium, Arial, Helvetica, sans-serif;
    font-size: 0.938em;
    color: #bac1c7;
    text-align: left;
}

.gameCardListHostess {
    display: block;
    width: 14.875em; /* 238px/16 = 14.875em */
    height: 10.438em; /* 167px/16 = 10.438em */
    position: absolute;
    right: -2.875em; /* -46px/16 = -2.875em */
    bottom: 2.5em; /* 40px/16 = 2.5em */
}

.gameCardListContent {
    position: relative;
    min-height: 24.563em; /* 393px/16 = 24.563em */
}

.gameCardListFooter {
    display: block;
    width: 19.25em; /* 308px/16 = 19.25em */
    height: 24.563em; /* 393px/16 = 24.563em */
    background-image: url('../img/web/common/gameCardListFooter.png');
    background-repeat: no-repeat;
    position: absolute;
    left: 37.5em; /* 600px/16 = 37.5em */
    bottom: 0em;
}

.gameCardListItems {
    position: relative;
    min-height: 24.563em; /* 393px/16 = 24.563em */
}

.gameCardListHomePage .gameCardLisScrollPane {
    width: 41.438em; /* 663px/16 = 41.438em */
    height: 42.625em; /* 682px/16 = 42.625em */
}

.card {
    display: inline-block;
    text-align: center;
}

.gameCardListHomePage .card {
    height: 10.25em; /* 164px/16 = 10.25em */
    margin-top: 1.5em; /* 24px/16 = 1.5em */
    margin-bottom: 0.625em; /* 10px/16 = 0.625em */
    margin-right: 0.75em; /* 12px/16 = 0.75em */
    width: 8.875em; /* 142px/16 = 8.875em */
    vertical-align: top;
}

.gameCardList .card {
    width: 13.333em; /* 160px/12 = 13.333em */
    height: 12.75em; /* 153px/12 = 12.75em */
    background-color: #FFFFFF;
    border-style: solid;
    border-width: 0.083em; /* 1px/12 = 0.083em */
    border-color: #c6c6c6;
    border-radius: 0.5em; /* 6px/12 = 0.5em */
    -moz-border-radius: 0.5em; /* Old Firefox (3.6 to 15) */
    box-shadow: 0 0.25em 0.333em #888888; /* 3px/12 = 0.25em  4px/12 = 0.333em */
    margin-bottom: 2.5em; /* 30px/12 = 2.5em */
    margin-left: 1.833em; /* 22px/12 = 1.833em */
    margin-right: 1.833em; /* 22px/12 = 1.833em */
    font-family: futura_md_btmedium, Arial, Helvetica, sans-serif;
    color: #8D8D8D;
    font-size: 0.75em;
    text-transform: uppercase;
}

.gameCardNewBand {
    display: inline-block;
    float: left;
    position: relative;
    top: -10.813em; /* -173px/16 = -10.813em */
    left: -0.125em; /* -2px/16 = -0.125em */
    width: 5.688em; /* 91px/16 = 5.688em */
    height: 5.625em; /* 90px/16 = 5.625em */
}

.gameCardNewBand a {
    outline: none;
}

.gameCardNewBand img {
    width: 5.688em; /* 91px/16 = 5.688em */
    height: 5.625em; /* 90px/16 = 5.625em */
}

.gameCardTablets {
    display: inline-block;
    float: left;
    position: relative;
    bottom: 6.563em; /* 105px/16 = 6.563em */
    left: 1.5em; /* 24px/16 = 1.5em */
    width: 6.625em; /* 106px/16 = 6.625em */
    height: 1.688em; /* 27px/16 = 1.688em */
    background: #e3e2dd; /* Non-CSS3 browsers */
    background-image: -moz-linear-gradient(top, #e3e2dd, #b6b5b3); /* OLD Firefox (3.6 to 15) */
    background-image: -ms-linear-gradient(top, #e3e2dd, #b6b5b3); /* For pre-releases of IE 10 */
    background-image: -webkit-linear-gradient(top, #e3e2dd, #b6b5b3); /* Webkit browsers (Chrome and Safari) */
    background-image: -o-linear-gradient(top, #e3e2dd, #b6b5b3); /* OLD Opera (11.1 to 12.0) */
    background-image: linear-gradient(to bottom, #e3e2dd, #b6b5b3);
    border-radius: 0.313em; /* 5px/16 = 0.313em */
    -moz-border-radius: 0.313em; /* Old Firefox (3.6 to 15) */
    box-shadow: 0 0.125em 0.25em #888888; /* 2px/16 = 0.125em  4px/16 = 0.25em */
}

.gameCardTablets span {
    font-family: futura_md_btmedium, Arial, Helvetica, sans-serif;
    font-size: 0.75em;
    color: #8d8d8d;
    margin-right: 0.417em; /* 5px/12 = 0.417em */
}

.gameCardHomePage {
    /* display: inline-block; */
    width: 8.875em; /* 142px/16 = 8.875em */
    height: 10.25em; /* 164px/16 = 10.25em */
    background-color: #f0efeb;
    border-style: solid;
    border-width: 0.063em; /* 1px/16 = 0.063em */
    border-color: #afaeaa;
    border-radius: 0.938em; /* 15px/16 = 0.938em */
    -moz-border-radius: 0.938em; /* Old Firefox (3.6 to 15) */
    box-shadow: 0 0 0.25em #888888; /* 4px/16 = 0.25em */
    margin-left: 0.313em; /* 5px/16 = 0.313em */
    margin-right: 0.313em; /* 5px/16 = 0.313em */
}

.gameCardHomePage .gameCardPicture {
    margin-top: 0.313em; /* 5px/16 = 0.313em */
    margin-bottom: 0.5em; /* 8px/16 = 0.5em */
}

.gameCardList .card .gameCardPicture {
    margin-top: 0.417em; /* 5px/12 = 0.417em */
    margin-bottom: 0.833em; /* 10px/12 = 0.833em */
}

.gameCardPicture a {
    outline: none;
}

.gameCardHomePage .gameCardPicture img {
    width: 8.125em; /* 130px/16 = 8.125em */
    height: 5.438em; /* 87px/16 = 5.438em */
    border-top-left-radius: 0.938em; /* 15px/16 = 0.938em */
    border-top-right-radius: 0.938em;
    -moz-border-top-left-radius: 0.938em; /* Old Firefox (3.6 to 15) */
    -moz-border-top-right-radius: 0.938em; /* Old Firefox (3.6 to 15) */
}

.gameCardList .card .gameCardPicture img {
    width: 12.583em; /* 151px/12 = 12.583em */
    height: 9.583em; /* 115px/12 = 9.583em */
    border-radius: 1.25em; /* 15px/12 = 1.25em */
    -moz-border-radius: 1.25em; /* Old Firefox (3.6 to 15) */
}

.gameCardText div.gameCardCounter {
    float: right;
    margin-right: 0.375em; /* 6px/16 = 0.375em */
    margin-left: 0.188em; /* 3px/16 = 0.188em */
    width: 2.063em; /* 33px/16 = 2.063em */
    height: 1.938em; /* 31px/16 = 1.938em */
    background: #FFA41D; /* Non-CSS3 browsers  */
    background-image: -moz-linear-gradient(top, #FFA41D, #EA8C00); /* Old Firefox (3.6 to 15) */
    background-image: -ms-linear-gradient(top, #FFA41D, #EA8C00); /* For pre-releases of IE 10 */
    background-image: -webkit-linear-gradient(top, #FFA41D, #EA8C00); /* Webkit browsers (Chrome and Safari) */
    background-image: -o-linear-gradient(top, #FFA41D, #EA8C00); /* OLD Opera (11.1 to 12.0) */
    background-image: linear-gradient(to bottom, #FFA41D, #EA8C00);
    border-radius: 0.313em; /* 5px/16 = 0.313em */
    -moz-border-radius: 0.313em; /* Old Firefox (3.6 to 15) */
    box-shadow: 0 0 0.125em #888888; /* 2px/16 = 0.125em */
}

.gameCardText {
    font-family: futura_md_btmedium, Arial, Helvetica, sans-serif; /* font-family: futura_icg_bookregular, Arial, Helvetica, sans-serif; */
    color: #8D8D8D;
}

.gameCardCounter span {
    display: block;
    font-size: 0.75em; /* 12px/16 = 0.75em */
    color: #FFFFFF;
    margin-top: 0.6em;
}

.gameCardText span.gameCardTitle {
    display: block;
    margin-left: 0.727em; /* 8px/11 = 0.727em */
    font-size: 0.688em; /* 11px/16 = 0.688em */
    text-align: left;
    text-transform: uppercase;
    color: #535252;
    margin-bottom: 0.091em; /* 1px/11 = 0.091em */;
}

.gameCardText span.gameCardTitle.reduced {
    font-size: 0.625em; /* 10px/16 = 0.625em */
}

.gameCardText span.gameCardCategory {
    display: block;
    margin-left: 0.727em; /* 8px/11 = 0.727em */
    font-size: 0.688em; /* 11px/16 = 0.688em */
    text-align: left;
}

/* jScrollPane */

.jspScrollable {
    overflow: visible !important;
}
 
.jspContainer {
    /* overflow: hidden; */
    position: relative;
}

.jspPane {
    position: absolute;
}

.jspVerticalBar {
    position: absolute;
    top: 0;
    right: 0;
    width: 1em; /* 16px/16 = 1em */
    height: 100%;
    background: red;
}

.jspHorizontalBar {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 1em; /* 16px/16 = 1em */
    background: red;
}

.jspVerticalBar *, .jspHorizontalBar * {
    margin: 0;
    padding: 0;
}

.jspCap {
    display: none;
}

.jspHorizontalBar .jspCap {
    float: left;
}

.jspTrack {
    background: #dde;
    position: relative;
}

.jspDrag {
    background: #bbd;
    position: relative;
    top: 0;
    left: 0;
    cursor: pointer;
}

.jspHorizontalBar .jspTrack, .jspHorizontalBar .jspDrag {
    float: left;
    height: 100%;
}

.jspArrow {
    background: #50506d;
    text-indent: -1250em; /* -20000px/16 = -1250em */
    display: block;
    cursor: pointer;
}

.jspArrow.jspDisabled {
    cursor: default;
    background: #80808d;
}

.jspVerticalBar .jspArrow {
    height: 1em; /* 16px/16 = 1em */
}

.jspHorizontalBar .jspArrow {
    width: 1em; /* 16px/16 = 1em */
    float: left;
    height: 100%;
}

.jspVerticalBar .jspArrow:focus {
    outline: none;
}

.jspCorner {
    background: #eeeef4;
    float: left;
    height: 100%;
}

/* Yuk! CSS Hack for IE6 3 pixel bug :( */
* html .jspCorner {
    margin: 0 -0.188em 0 0; /* -3px/16 = -0.188em */
}


/* jScrollPane - lozenge theme */

.jspHorizontalBar, .jspVerticalBar, .jspTrack {
    background: #eeeef4;
}

.jspVerticalBar {
    border-style: solid;
    border-width: 0.063em; /* 1px/16 = 0.063em */
    border-color: #afaeaa;
    border-radius: 0.938em; /* 15px/16 = 0.938em */
    -moz-border-radius: 0.938em; /* Old Firefox (3.6 to 15) */
    padding: 0.313em; /* 5px/16 = 0.313em */
    box-shadow: 0 0 0.25em #888888; /* 4px/16 = 0.25em */
}

.jspDrag {
    background:  #cccccc;
    -moz-border-radius: 0.625em; /* 10px/16 = 0.625em */
    -webkit-border-radius: 0.625em;
    border-radius: 0.625em;
}

.jspTrack .jspActive, .jspTrack .jspHover, .jspDrag:hover {
    background: #a6a6a6; /* #8B8B9F; */
}


.jspArrow {
    background: url(../img/web/addons/jScrollPane/ui-icons_222222_256x240.png) no-repeat;
    -moz-border-radius: 0.625em; /* 10px/16 = 0.625em */
    -webkit-border-radius: 0.625em;
    border-radius: 0.625em;
}

.jspVerticalBar>.jspActive, .jspArrow:hover {
    background-image: url('../img/web/addons/jScrollPane/ui-icons_cd0a0a_256x240.png');
}

.jspVerticalBar>.jspDisabled, .jspVerticalBar>.jspDisabled:hover, .jspHorizontalBar>.jspDisabled, .jspHorizontalBar>.jspDisabled:hover {
    background-color: transparent;
    background-image: url('../img/web/addons/jScrollPane/ui-icons_888888_256x240.png');
}

.jspVerticalBar .jspArrow {
    height: 1.063em; /* 17px/16 = 1.063em */
}

.jspHorizontalBar .jspArrow {
    width: 0.938em; /* 15px/16 = 0.938em */
}

.jspArrowUp {
    /* background-position: 0 0; */
    background-position: -6em -13em !important; /* -96px/16 = -6em  -208px/16 = -13em */
}

.jspArrowDown {
    /* background-position: -64px 0 !important; */
    background-position: -7em -13em !important; /* -112px/16 = -7em  -208px/16 = -13em */
}

.jspArrowLeft {
    background-position: -6em 0 !important; /* -96px/16 = -6em */
}

.jspArrowRight {
    background-position: -2em 0 !important; /* -32px/16 = -2em */
}

@media all and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
    /* iPad portrait */
    .gameCardListHomePage {
        height: 100%;
    }
    
    .gameCardListHomePage .gameCardLisScrollPane {
        height: 100%;
        padding-bottom: 1.875em; /* 30px/16 = 1.875em */
        width: 42.188em; /* 675px/16 = 42.188em */
    }
    
    .gameCardListCategories {
        width: 33.438em; /* 535px/16 = 33.438em */
    }
    
    .gameCardListContent {
        min-height: 29.375em; /* 470px/16 = 29.375em */
    }
    
    .gameCardListHomePage .card {
        margin-right: 1.438em; /* 23px/16 = 1.438em */
    }
}

@media all and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
    /* iPad landscape */
    .gameCardListHomePage {
        height: 100%;
    }
    
    .gameCardListHomePage .gameCardLisScrollPane {
        height: 100%;
        padding-bottom: 1.875em; /* 30px/16 = 1.875em */
        width: 42.188em; /* 675px/16 = 42.188em */
    }
    
    .gameCardListCategories {
        width: 33.438em; /* 535px/16 = 33.438em */
    }
    
    .gameCardListHomePage .card {
        margin-right: 1.438em; /* 23px/16 = 1.438em */
    }
}

@media all and (min-device-width: 1536px) and (max-device-width: 2048px) and (-webkit-min-device-pixel-ratio: 2) {
    /* iPad 3 */
    .gameCardListHomePage {
        height: 100%;
    }
    
    .gameCardListHomePage .gameCardLisScrollPane {
        height: 100%;
        padding-bottom: 1.875em; /* 30px/16 = 1.875em */
        width: 42.188em; /* 675px/16 = 42.188em */
    }
    
    .gameCardListCategories {
        width: 33.438em; /* 535px/16 = 33.438em */
    }
    
    .gameCardListHomePage .card {
        margin-right: 1.438em; /* 23px/16 = 1.438em */
    }
}