/* GAME LIST */

.profileGamesList {
    display: inline-block;
    position: relative;
    width: 55.625em; /* 890px/16 = 55.625em */
    height: 29.563em; /* 473px/16 = 29.563em */
    padding-left: 1.875em; /* 30px/16 = 1.875em */
    overflow: hidden;
}

.gameListHeader {
    position: relative;
    margin-top: 1.875em; /* 30px/16 = 1.875em */
    height: 2.313em; /* 37px/16 = 2.313em */
    padding-left: 1.063em; /* 17px/16 = 1.063em */
}

.gameListTitle {
    float: left;
    font-family: futura_md_btmedium, Arial, Helvetica, sans-serif;
    color: #a69984;
    font-size: 1em; /* 16px/16 = 1em */
    text-transform: uppercase;
    padding-left: 0.5em; /* 8px/16 = 0.5em */
}

.noGames span {
    display: inline-block;
    position: relative;
    height: 2.2em; /* 33px/15 = 2.2em */
    font-family: futura_md_btmedium, Arial, Helvetica, sans-serif;
    color: #969696;
    font-size: 0.938em; /* 15px/16 = 0.938em */
    padding-left: 0.938em; /* 15px/16 = 0.938em */
}

.gameListContainer {
    overflow: hidden;
    height: 25.375em; /* 406px/16 = 25.375em */
}

.gameListScrollPane {
    display: block;
    width: 53.875em; /* 862px/16 = 53.875em */
    height: 25.375em; /* 406px/16 = 25.375em */
    padding-left: 0.625em; /* 10px/16 = 0.625em */
    overflow: hidden;
}

.gameItem {
    display: inline-block;
    position: relative;
    float: left;
    width: 15.313em; /* 245px/16 = 15.313em */
    height: 8.875em; /* 142px/16 = 8.875em */
    background: #ffffff;
    border-style: solid;
    border-width: 0.063em; /* 1px/16 = 0.063em */
    border-color: #c6c6c6;
    border-radius: 0.625em; /* 10px/16 = 0.625em */
    -moz-border-radius: 0.625em; /* Old Firefox (3.6 to 15) */
    box-shadow: 0 0.313em 0.125em -0.313em #888888; /* 5px/16 = 0.313em  2px/16 = 0.125em */
    text-align: center;
    padding-top: 0.625em; /* 10px/16 = 0.625em */
    padding-bottom: 0.625em; /* 10px/16 = 0.625em */
    margin-right: 1.875em; /* 30px/16 = 1.875em */
    margin-bottom: 1.25em; /* 20px/16 = 1.25em */
}

.gameItemPicture a {
    outline: none;
}

.gameItemPicture img {
    width: 14.188em; /* 227px/16 = 14.188em */
    height: 5.625em; /* 90px/16 = 5.625em */
    border-style: solid;
    border-width: 0.063em; /* 1px/16 = 0.063em */
    border-color: #999999;
    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) */
    border-bottom-left-radius: 0.188em; /* 3px/16 = 0.188em */
    border-bottom-right-radius: 0.188em;
    -moz-border-bottom-left-radius: 0.188em; /* Old Firefox (3.6 to 15) */
    -moz-border-bottom-right-radius: 0.188em; /* Old Firefox (3.6 to 15) */
    box-shadow: 0 0 0.063em 0.063em #888888; /* 1px/16 = 0.063em */
}

.gameItemStats {
    display: inline-block;
    position: relative;
    width: 13.846em; /* 180px/13 = 13.846em */
    margin-top: 2.692em; /* 35px/13 = 2.692em */
    text-align: left;
    font-family: futura_md_btmedium, Arial, Helvetica, sans-serif;
    color: #666666;
    font-size: 0.813em; /* 13px/16 = 0.813em */
}

.gameItemStats .won {
    position: absolute;
    left: -0.923em; /* -12px/13 = -0.923em */
    text-align: center;
    width: 3.846em; /* 50px/13 = 3.846em */
}

.gameItemStats .lost {
    position: absolute;
    left: 3em; /* 39px/13 = 3em */
    text-align: center;
    width: 3.846em; /* 50px/13 = 3.846em */
}

.gameItemStats .tied {
    position: absolute;
    left: 6.923em; /* 90px/13 = 6.923em */
    text-align: center;
    width: 3.846em; /* 50px/13 = 3.846em */
}

.gameItemStats .rank {
    position: absolute;
    left: 10.769em; /* 140px/13 = 10.769em */
    text-align: center;
    width: 3.846em; /* 50px/13 = 3.846em */
}

.gameStatsHeader {
    display: inline-block;
    position: relative;
    bottom: 2.385em; /* 31px/13 = 2.385em */
    left: -0.385em; /* -5px/13 = -0.385em */
    width: 19.615em; /* 255px/13 = 19.615em */
    height: 1.769em; /* 23px/13 = 1.769em */
    background-image: url('../img/web/common/gameStatsHeader.png');
    background-repeat: no-repeat;
    text-align: left;
    font-family: futura_md_btmedium, Arial, Helvetica, sans-serif;
    color: #726652;
    font-size: 0.813em; /* 13px/16 = 0.813em */
    text-transform: uppercase;
}

.gameStatsHeader .won {
    position: absolute;
    left: 1.923em; /* 25px/13 = 1.923em */
    text-align: center;
    width: 3.846em; /* 50px/13 = 3.846em */
}

.gameStatsHeader .lost {
    position: absolute;
    left: 5.923em; /* 77px/13 = 5.923em */
    text-align: center;
    width: 3.846em; /* 50px/13 = 3.846em */
}

.gameStatsHeader .tied {
    position: absolute;
    left: 9.769em; /* 127px/13 = 9.769em */
    text-align: center;
    width: 3.846em; /* 50px/13 = 3.846em */
}

.gameStatsHeader .rank {
    position: absolute;
    left: 13.615em; /* 177px/13 = 13.615em */
    text-align: center;
    width: 3.846em; /* 50px/13 = 3.846em */
}

.levelGlobe {
    display: inline-block;
    position: absolute;
    right: -0.231em; /* -3px/13 = -0.231em */
    top: 0.308em; /* 4px/13 = 0.308em */
    width: 4.077em; /* 53px/13 = 4.077em */
    height: 4em; /* 52px/13 = 4em */
    background-image: url('../img/web/common/levelGlobe.png');
    background-repeat: no-repeat;
    font-family: groboldregular, Arial, Helvetica, sans-serif;
    color: #ffffff;
    font-size: 0.813em; /* 13px/16 = 0.813em */
    padding-top: 1.154em; /* 15px/13 = 1.154em */
}

.levelGlobe span {
    padding-right: 0.231em; /* 3px/13 = 0.231em */
}

/* jScrollPane for gameList */

.gameListScrollPane .jspScrollable {
    overflow: visible !important;
}

.gameListScrollPane .jspContainer {
    /* overflow: hidden; */
    position: relative;
}

.gameListScrollPane .jspPane {
    position: absolute;
}

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

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

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

.gameListScrollPane .jspCap {
    display: none;
}

.gameListScrollPane .jspHorizontalBar .jspCap {
    float: left;
}

.gameListScrollPane .jspTrack {
    background: #c6bfb0;
    position: relative;
}

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

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

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

.gameListScrollPane .jspArrow.jspDisabled {
    cursor: default;
}

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

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

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

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

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

/* jScrollPane for gameList - lozenge theme */

.gameListScrollPane .jspHorizontalBar, .gameListScrollPane .jspVerticalBar {
    background: #eeede9;
}

.gameListScrollPane .jspTrack {
    position: relative;
    background: #c6bfb0;
    width: 1.125em; /* 18px/16 = 1.125em */
    left: 50%;
    margin-left: -0.563em; /* -9px/16 = -0.563em */
    -moz-border-radius: 0.625em; /* 10px/16 = 0.625em */
    -webkit-border-radius: 0.625em;
    border-radius: 0.625em;
}

.gameListScrollPane .jspVerticalBar {
    border-style: none;
    border-width: 0;
    padding: 0;
    box-shadow: none;
    margin-right: 0.313em; /* 5px/16 = 0.313em */
}

.gameListScrollPane .jspDrag {
    position: relative;
    background: #ffffff;
    border-style: none;
    border-width: 0;
    width: 0.625em; /* 10px/16 = 0.625em */
    left: 50%;
    margin-left: -0.313em; /* -5px/16 = -0.313em */
    -moz-border-radius: 0.625em; /* 10px/16 = 0.625em */
    -webkit-border-radius: 0.625em;
    border-radius: 0.625em;
}

.gameListScrollPane .jspTrack .jspActive, .gameListScrollPane .jspTrack .jspHover, .gameListScrollPane .jspDrag:hover {
    background: #f8f6f6;
}

.gameListScrollPane .jspArrow {
    background: url(../img/web/addons/jScrollPane/ui-icons_222222_256x240.png) no-repeat;
}

.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');
}

.gameListScrollPane .jspVerticalBar .jspArrow {
    position: relative;
    height: 1.875em; /* 30px/16 = 1.875em */
    width: 1.563em; /* 25px/16 = 1.563em */
    left: 50%;
    margin-left: -0.75em; /* -12px/16 = -0.75em */
}

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

.gameListScrollPane .jspArrowUp {
    background-position: -10.063em -12.938em !important; /* -161px/16 = -10.063em  -207px/16 = -12.938em */
}

.gameListScrollPane .jspArrowDown {
    background-position: -11.688em -12.875em !important; /* -187px/16 = -11.688em  -206px/16 = -12.875em */
}

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

.gameListScrollPane .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 */
    
    .profileGamesList {
	    height: 100%;
	    padding-left: 1.75em; /* 28px/16 = 1.75em */
	}
	
	.gameListContainer {
	    height: 100%;
	}
	
	.gameListScrollPane {
	    height: 100%;
	}
}

@media all and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
    /* iPad landscape */
    
    .profileGamesList {
        height: 100%;
        padding-left: 1.75em; /* 28px/16 = 1.75em */
    }
    
    .gameListContainer {
        height: 100%;
    }
    
    .gameListScrollPane {
        height: 100%;
    }
}

@media all and (min-device-width: 1536px) and (max-device-width: 2048px) and (-webkit-min-device-pixel-ratio: 2) {
    /* iPad 3 */
    
    .profileGamesList {
        height: 100%;
        padding-left: 1.75em; /* 28px/16 = 1.75em */
    }
    
    .gameListContainer {
        height: 100%;
    }
    
    .gameListScrollPane {
        height: 100%;
    }
}