@charset "utf-8";
/* CSS Document */

/***** Grids *****/

/* Photo Gallery Page */

.GridGallery {display: grid; grid-auto-rows: minmax(100px, auto); grid-template-columns: repeat(5, 1fr); grid-gap: 12px;}
.GridGallery::after {content: ""; clear: both; display: block;}
.GridGallery div{text-align:center;}
.GridGallery p{font-size:90%;}


/* News Items Page */
.GridNews {display: grid; grid-auto-rows: minmax(100px, auto); grid-template-columns: repeat(3, 1fr); grid-gap: 12px;}
.GridNews::after {content: ""; clear: both; display: block;}


/* Admin Home Page */
.GridAdminHome {display: grid; grid-auto-rows: minmax(100px, auto); grid-template-columns: repeat(3, 1fr); grid-gap: 12px;}

.GridAdminHome div{position:relative; text-align:center; border:2px solid #1133aa; padding:2% 2% 30px; border-radius:8px; box-shadow:2px 2px 6px #999;}
.GridAdminHome div.NoBottomSpace{padding-bottom:4px;}
.GridAdminHome h2{font-size:1.1em; margin:2px 0px 8px; padding:0px;}
.GridAdminHome p{font-size:90%;}
.GridAdminHome ul{font-size:90%; text-align:left;}
.GridAdminHome li{margin-top:4px;}
.GridAdminHome .StandAloneButtonSmall{position:absolute; bottom:6%; margin:0px 2%; width:92%;}
.GridAdminHome .InlineButton{position:relative !important; bottom:0%; margin:8px 2%; width:92%;}


/* Fixture Team Selection Page AND Team Display page */
.GridTeamWrapper{display: grid; grid-template-rows: minmax(150px, auto) minmax(150px, auto) minmax(150px, auto); grid-auto-rows minmax(50px, auto); grid-template-columns: repeat(3, 1fr); grid-gap: 12px;}
/* First 3 rows set to 150px or auto and 4th row onwards set to 50px or auto */
.PlayerSelection{grid-row: 1 / 4;}
.TeamContainer{position:relative; text-align:center; border:2px solid #1133aa; padding:2%; border-radius:8px; box-shadow:2px 2px 6px #999;}

/* Admin Key Data */
.GridKeyData {display: grid; grid-template-rows: minmax(100px, auto); grid-template-columns: repeat(3, 1fr); grid-gap: 12px;}
.GridKeyData .GroupCell{position:relative; text-align:left; border:2px solid #1133aa; padding:2%; border-radius:8px; box-shadow:2px 2px 6px #999;}
.GridKeyData h2{font-size:1.1em; margin:2px 0px 8px; padding:0px; text-align:center;}
.GridKeyData [class*="col-"] {padding:4px;}


/* Rink Booking Page */
#DayWrapper{position:relative; display:grid; grid-template-rows: 30px; grid-auto-rows: minmax(50px, auto); grid-template-columns: 80px repeat(6, 1fr); grid-gap: 0px; border:1px solid #1133aa; padding:0px;}
.TimeSlotBox{position:relative; border:1px solid #1133aa; padding:0px; text-align:center; background-color:#EEF;}
.EmptySlot{background-color:#FFF;}
.TimeSlotHeader{position:relative; border:1px solid #1133aa; padding:2%; text-align:center;}
.TimeSlotBox h2{font-size:0.8em; margin:0px 0px 4px; padding:0px 1px 1px; color:#6699dd; font-weight:normal;}
.TimeSlotBox h3{font-size:1em; margin:0px; padding:0px 0px 4px;}
.TimeSlotBox p{font-size:0.8em; margin:0px 0px 4px; padding:0px;}
.TimeSlotBox .ProvisionalBooking{color:#BBE; position:absolute; bottom:0px; left:0px; display:block; text-align:center; width:100%;}
.CanChangeThis{cursor:pointer;}


/* Leagues Page */
#GridLeagues{position:relative; display:grid; grid-template-columns: repeat(4, 1fr); grid-gap: 12px; padding:0px;}
#GridLeagues .LeagueHolder{position:relative; border:2px solid #1133aa; padding:4% 4% 30px; border-radius:8px; box-shadow:2px 2px 6px #999; text-align:center;}
#GridLeagues .LeagueHolder h2{font-size:1.3em; padding:0px; margin:0px 0px 4px;}
#GridLeagues .LeagueHolder h3{font-size:1.1em; padding:0px; margin:0px 0px 8px;}
#GridLeagues .LeagueHolder p{padding:0px; margin:1px 0px;}
#GridLeagues .LeagueLinks{position:absolute; bottom:2px; left:0px; text-align:center; width:100%; display:block; font-size:80%;}
#GridLeagues::after {content: ""; clear: both; display: block;}


/* Officers Admin Page */
#OfficersGrid{position:relative; display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 18px;}
#OfficersGrid .OfficerContainer{position:relative; border:solid 1px #CCF; box-shadow:2px 2px 6px #999; text-align:center; padding:4% 4% 70px; background-color:#FFF; border-radius:8px;}

@media screen and (max-width: 700px) {
.GridOfficers {grid-template-columns: 1fr;}
.GridGallery {grid-template-columns: repeat(2, 1fr);}
.GridAdminHome {grid-template-columns: 1fr;}
.GridNews {grid-template-columns: 1fr;}
}