@charset "UTF-8";
/* GAMESROOM V1 CSS */
/* Author: Max van Doorn */

#container__2020 h1 {
	width:90%;
	margin:auto;
	text-align:center;
}

#container__2020 .games-grid {
    box-sizing:border-box;
    width:100%;
    height:auto;
    border-image-source:url(../common/frame-gamesroom.jpg);
    border-image-slice:31 40 47 40 fill;
    border-image-width:20px 20px 20px 20px;
    border-image-outset:0px 0px 0px 0px;
    border-image-repeat:repeat stretch;
    display:grid;
    grid-template-rows:auto;
	grid-gap: 20px;
    padding:20px;
}

/* Formula to calculate breakpoints:
(262 * number of columns)+(number of gutters * grid-gap size)
*/
@media screen and (max-width:330px) { /* 1 Column */
	#container__2020 .games-grid {
		grid-template-columns: repeat(1, minmax(0, 1fr));
    }
	#container__2020 .classic-banner {
		grid-column: span 1;
		padding-bottom: 60%;
		background-size: contain;
	}
	#container__2020 .classic-banner .classic-text {
		width: 60%;
		padding-top: 30.45%;
		right: 5% !important;
	}
    #container__2020 .games-grid .acTeamLabel {

    }
    #container__2020 .games-grid .acTeamInput {

    }
    #container__2020 .games-grid .acOpponentLabel {

    }
    #container__2020 .games-grid .acOpponentInput {

    }
}
@media screen and (min-width:331px) and (max-width:534px) { /* 2 Columns */
	#container__2020 .games-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
    }
	#container__2020 .classic-banner {
		grid-column: span 2;
		padding-bottom: 35%;
		background-size: contain;
	}
	#container__2020 .classic-banner .classic-text {
		width: 40%;
		padding-top: 20.45%;
	}
    #container__2020 .games-grid .acTeamLabel {
        grid-column:1/2;
    }
    #container__2020 .games-grid .acTeamInput {
        grid-column:2/3;
    }
    #container__2020 .games-grid .acOpponentLabel {
        grid-column:1/2;
    }
    #container__2020 .games-grid .acOpponentInput {
        grid-column:2/3;
    }
}
@media screen and (min-width:535px) and (max-width:806px) { /* 3 Columns */
	#container__2020 .games-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
    }
	#container__2020 .classic-banner {
		grid-column: span 3;
		padding-bottom: 30%;
		background-size: contain;
	}
	#container__2020 .classic-banner .classic-text {
		width: 35%;
		padding-top: 16.45%;
	}
    #container__2020 .games-grid .acTeamLabel {
        grid-column:1/2;
    }
    #container__2020 .games-grid .acTeamInput {
        grid-column:2/4;
    }
    #container__2020 .games-grid .acOpponentLabel {
        grid-column:1/2;
    }
    #container__2020 .games-grid .acOpponentInput {
        grid-column:2/4;
    }
}
@media screen and (min-width:807px) { /* 4 Columns */
	#container__2020 .games-grid {
		grid-template-columns: repeat(4, minmax(0, 1fr));
    }
	#container__2020 .classic-banner {
		grid-column: span 4;
		background-size: 100%;
		padding-bottom: 23%;
	}
	#container__2020 .classic-banner .classic-text {
		width: 30%;
		padding-top: 16.45%;
	}
    #container__2020 .games-grid .acTeamLabel {
        grid-column:1/2;
    }
    #container__2020 .games-grid .acTeamInput {
        grid-column:2/3;
    }
    #container__2020 .games-grid .acOpponentLabel {
        grid-column:3/4;
    }
    #container__2020 .games-grid .acOpponentInput {
        grid-column:4/5;
    }
}

#container__2020 .games-grid h4 {
    text-align:center;
    margin:auto;
    font-family: "MuseoSansRounded700", 'Arial', sans-serif;
    color: #6B94C2;
}
#container__2020 .games-grid a {
    text-decoration:none;
    outline:none;
}

/* Classic Games Banner - 2023.07.10 */
#container__2020 .classic-banner {
	position: relative;
	background: url(/games/h5/ruffle/games-room-ruffle-banner-bg.png?v=2) top left no-repeat;
	width: 100%;
	height: 0;
	border-radius:15px;
    -webkit-box-shadow: 0 0 5px 2px rgba(0,0,0,0.35);
    -moz-box-shadow: 0 0 5px 2px rgba(0,0,0,0.35);
    box-shadow: 0 0 5px 2px rgba(0,0,0,0.35);
	cursor:pointer;
	box-sizing:border-box;
}

#container__2020 .classic-banner .classic-icon {
	position: absolute;
	top: 10%;
	left: 10%;
	background: url(/games/h5/ruffle/games-room-ruffle-banner-joysticks.png) top left / 100% no-repeat;
	width: 30%;
	padding-top: 20.9%;
}

#container__2020 .classic-banner .classic-text {
	position: absolute;
	top: 5%;
	right: 10%;
	background: url(/games/h5/ruffle/games-room-ruffle-banner-text.png) top left / 100% no-repeat;
}

#container__2020 .classic-banner .classic-button {
	position: absolute;
	bottom: 8%;
	right: 13%;
}

@media screen and (max-width:930px) {
	#container__2020 .classic-banner .classic-text {
		top: 3%;
	}
	#container__2020 .classic-banner .classic-button {
		bottom: 5%;
		right: 10%;
	}
}

@media screen and (max-width:650px) {
	#container__2020 .classic-banner .classic-button {
		bottom: 2%;
		right: 0;
		left: 0;
		margin: 0 auto;
	}
}

@media screen and (max-width:330px) {
	#container__2020 .classic-banner .classic-button {
		bottom: 10%;
	}
}

/* Game Thumbnails */

#container__2020 .game-box {
    border-radius:15px;
    background:#fff;
    width:100%;
    height:100%;
    padding:10px;
    cursor:pointer;
    box-sizing:border-box;
    -webkit-box-shadow: 0px 0px 5px 2px rgba(0,0,0,0.35);
    -moz-box-shadow: 0px 0px 5px 2px rgba(0,0,0,0.35);
    box-shadow: 0px 0px 5px 2px rgba(0,0,0,0.35);
    outline:none;
}

#container__2020 .game-box:hover, #container__2020 .game-box:focus, #container__2020 a:focus .game-box {
    -webkit-transform:scale(1.05);
    -ms-transform:scale(1.05);
    transform:scale(1.05);
    -webkit-box-shadow: 0px 0px 8px 4px rgba(0,0,0,0.15);
    -moz-box-shadow: 0px 0px 8px 4px rgba(0,0,0,0.15);
    box-shadow: 0px 0px 8px 4px rgba(0,0,0,0.15);
}

#container__2020 .game-thumb {
	background-position:center;
	background-repeat:no-repeat;
	background-size:100%;
	margin:auto auto 10px;
    height:0;
    width:100%;
    padding-bottom:56%;
}

#container__2020 .thumb-turmac {
     background-image:url(/games/pages/icons/ctp/c-366.png);
}
#container__2020 .thumb-fashion {
     background-image:url(/games/pages/icons/ctp/c-805.png);
}
#container__2020 .thumb-hasee {
    background-image:url(/games/pages/icons/ctp/c-368.png);
}
#container__2020 .thumb-lyra {
    background-image:url(/games/h5/lyrasescape/branding/thumbnail-temp.png);
}
#container__2020 .thumb-icecream {
    background-image:url(/games/pages/icons/ctp/c-507.png);
}
#container__2020 .thumb-rinkrunner {
    background-image:url(/games/pages/icons/ctp/c-220.png);
}
#container__2020 .thumb-igloo {
    background-image:url(/games/pages/icons/ctp/c-676.png);
}
#container__2020 .thumb-kass {
    background-image:url(/games/pages/icons/ctp/c-381.png);
}
#container__2020 .thumb-meerca {
    background-image:url(/games/pages/icons/ctp/c-500.png);
}
#container__2020 .thumb-spacefungus {
    background-image:url(/games/pages/icons/ctp/c-774.png);
}
/* Batch 1 */
#container__2020 .thumb-aaarevenge {
    background-image:url(/games/h5/ctp/c-1375.png);
}
#container__2020 .thumb-adventuregenerator {
    background-image:url(/games/h5/ctp/c-240.png);
}
#container__2020 .thumb-vending {
    background-image:url(/games/h5/ctp/c-36.png);
}
#container__2020 .thumb-armada {
    background-image:url(/games/h5/ctp/c-18.png);
}
#container__2020 .thumb-betterthanyou {
    background-image:url(/games/h5/ctp/c-112.png);
}

/* id 1406 (flash 1099) */
#container__2020 .thumb-pawkeetslots {
	background-image:url(/games/h5/ctp/c-1099.png);
}
/* id 1397 (flash 1319) */
#container__2020 .thumb-destructomatch3 {
	background-image:url(/games/h5/ctp/c-1319.png);
}
/* id 1395 (flash 1327) */
#container__2020 .thumb-faeriebubbles {
	background-image:url(/games/h5/ctp/c-1327.png);
}
/* id 1396 (flash 903) */
/* Old/backup locations:/games/pages/icons/med/m-NNN.png, /games/h5/ctp/c-NNN.png */
#container__2020 .thumb-ultimatebullseye2 {
	background-image:url(/games/h5/ctp/c-903.png);
}

#container__2020 .thumb-grumpyoldking {
	background-image:url(/games/h5/ctp/c-218.png);
}
#container__2020 .thumb-guessthecard {
	background-image:url(/games/h5/ctp/c-14.png);
}
#container__2020 .thumb-guessmarrowweight {
	background-image:url(/games/h5/ctp/c-161.png);
}
#container__2020 .thumb-illusensglade {
	background-image:url(/games/h5/ctp/c-160.png);
}
#container__2020 .thumb-jhudorasbluff {
	background-image:url(/games/h5/ctp/c-126.png);
}


/* Altador Cup */
#container__2020 .thumb-yooyuball {
    background-image:url(/games/h5/ctp/c-1288.png);
}
#container__2020 .thumb-slushieslinger {
    background-image:url(/games/h5/ctp/c-863.png);
}
#container__2020 .thumb-shootoutshowdown {
    background-image:url(/games/h5/ctp/c-1106.png);
}
#container__2020 .thumb-makesomenoise {
    background-image:url(/games/h5/ctp/c-862.png);
}

#container__2020 .thumb-voidworks {
    background-image:url(/games/h5/ctp/c-1408.png);
}

#container__2020 .thumb-teatimewithtavi {
    background-image:url(/games/h5/ctp/c-1410.png);
}
#container__2020 .thumb-cosycampfire{
    background-image:url(/games/h5/ctp/c-1409.png);
}

#container__2020 .thumb-doglefetch{
    background-image:url(/games/h5/ctp/c-1414.png);
}

#container__2020 .thumb-litd{
    background-image:url(/games/h5/ctp/c-1415.png);
}

#container__2020 .thumb-aoa{
    background-image:url(/games/h5/ctp/c-1417.png);
}

/* Battledome */
#container__2020 .thumb-dome {
    background-image:url(/games/h5/dome/domebanner.png);
}

/* TEMP DISABLED SCORE SUBMISSION PUSHDOWN */
#container__2020 .gamesalert {
    margin:20px auto;
    width:90%;
    max-width:800px;
    height:auto;
    position:relative;
}

#container__2020 .gamesalert .exit-button {
    width: 35px !important;
    height: 35px !important;
    position: absolute !important;
    z-index:1;
    right: -5px;
    top: -5px;
    border-radius: 50% !important;
}

#container__2020 .gamesalert .gamesalert-header {
    width:100%;
    box-sizing:border-box;
    padding:5px 5px;
    border-radius: 10px 10px 0 0;
    background-color:#0fbd5d;
    /*background-color:#e56c11;*/
    text-align: center;
    font-family: "Cafeteria", 'Arial Bold', sans-serif;
    border-width: 2px 2px 1px 2px;
    border-style:solid;
    border-color:#000;
}

#container__2020 .gamesalert .gamesalert-header h2 {
    margin:auto;
}

#container__2020 .gamesalert .gamesalert-body {
    width:100%;
    box-sizing:border-box;
    border-radius: 0 0 10px 10px;
    background: #fff;
    background: -webkit-linear-gradient(#ffffff,#d4d4d4);
    background: -moz-linear-gradient(#ffffff,#d4d4d4);
    background: linear-gradient(#ffffff,#d4d4d4);
    border-width: 0 2px 2px 2px;
    border-style:solid;
    border-color:#000;
    position:relative;
}

#container__2020 .gamesalert .gamesalert-body p {
    font-family: "MuseoSansRounded500", 'Arial', sans-serif;
    margin:5px auto;
}

#container__2020 .gamesalert .gamesalert-body .gamesalert-img {
    background-repeat:no-repeat;
    background-size:100%;
    background-image:url(../common/scoresubmission.png);
    position:absolute;
    bottom:0;
    left:-12px;
    width:185px;
    height:140px;
}

/* TEMP - Altador Cup Testing Week, select team input */
#container__2020 .games-grid .acTeamLabel, #container__2020 .games-grid .acOpponentLabel {
    font-family: "MuseoSansRounded700", 'Arial', sans-serif;
}
#container__2020 .games-grid .acTeamLabel {

}
#container__2020 .games-grid .acTeamInput {

}
#container__2020 .games-grid .acOpponentLabel {

}
#container__2020 .games-grid .acOpponentInput {

}
#container__2020 .games-grid select {
    /*width:100%;
    max-width:;*/
}

/* Altador Cup Temp Additions End */

@media screen and (max-width:510px) {
    #container__2020 .gamesalert .gamesalert-body .gamesalert-img {
        display:none
    }
    #container__2020 .gamesalert .gamesalert-body {
        min-height:0px;
        padding:10px 10px 10px 10px;
    }
}
@media screen and (min-width:511px) {
    #container__2020 .gamesalert .gamesalert-body .gamesalert-img {
        left:-12px;
        width:185px;
        height:140px;
    }
    #container__2020 .gamesalert .gamesalert-body {
        min-height:120px;
        padding:10px 10px 10px 173px;
    }
}
