body { 
	margin: 0 auto;
	width: 100%;
	position: fixed;
	top: 0px;
}

a {
	text-decoration: none;
	color: #FFF;
}

a:hover {
	color: var(--red);
}

.homeheader {
	position: relative;
	width: 100%;
	height: 500px;
	padding: 0px;
	background-color: var(--blue);
	background-image: url("../images/home_banner.jpg");
	background-position: center;
}

.contentheader {
	position: relative;
	width: 100%;
	padding: 0px;
	margin-top: 40px;
	background-color: var(--blue);
}

.contentheader2 {
	position: relative;
	width: 100%;
	padding: 0px;
	margin-top: 16px;
	background-color: var(--blue);
}

.contentheadercontent {
	display: flex;
	justify-content: space-between;
	margin: 0 auto;
	position: relative;
	max-width: var(--contentWidth);
	height: 48px;
	align-items: center;
	
	color: #FFF;
	text-decoration: none;
	font-family: 'Acme', Verdana;
}

.contentheadercontent .headerlabel {
	padding: 0px 20px;
	text-align: left;
	font-size: 26px;
}

.contentheadercontent .contentheaderselectcontainer {
	padding: 0px 20px;
	text-align: center;
	font-size: 20px;
}

.contentheadercontent select {
	height: 28px;
	background-color: var(--blue);
	border: 0;
	outline: none;
	
	text-align: center;
	text-align-last:center;
	color: #FFF;
	text-decoration: none;
	font-family: 'Acme', Verdana;
	font-size: 20px;
	text-decoration: underline;
	text-underline-position: under;
	text-decoration-thickness: 2px;
}

.select-selected:after {
	position: absolute;
	content: "";
	top: 14px;
	right: 10px;
	width: 0;
	height: 0;
	border: 6px solid transparent;
	border-color: #fff transparent transparent transparent;
}

.content {
	margin: 0 auto;
	max-width: var(--contentWidth);
	height: auto;
	padding: 0px;
		
	text-align: left;
	color: var(--bgNavyDark);
	text-decoration: none;
	font-family: 'Acme', Verdana;
	font-size: 16px;
}

.content .header1{
	padding: 8px 0px;
	
	font-family: 'Acme', Verdana;
	font-size: 32px;
	text-align: center;
	text-decoration: underline;
}

.content .header2{
	padding: 8px 0px;
	
	font-family: 'Acme', Verdana;
	font-size: 22px;
	text-align: center;
	text-decoration: underline;
}

.content .header3{
	text-align: center;
}

.content .header4{
	padding: 8px 0px;
	
	font-family: 'Acme', Verdana;
	font-size: 22px;
	text-align: center;
}

.content .header5{
	padding: 4px 0px;
	
	font-family: 'Acme', Verdana;
	font-size: 18px;
	text-align: center;
	text-transform: uppercase;
}

.content .headerbar{
	margin: 0 auto;
	width: 100%;
	padding: 0px;
	height: 23px;
	
	background-color: #FFF;
}

.content .headerbartext{
	padding: 0px 8px;
	padding-top: 3px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	text-align: center;
	text-transform: uppercase;
	color: var(--red);
	font-size: 16px;
}

.content .text{
	margin: 0px;
	padding: 8px 0px;
			
	font-family: 'Open Sans', Verdana;
	font-size: 14px;
	color: #FFF;
	text-align: left;
}

.content .photo{
	margin: 0 auto;
	width: auto;
	max-width: 800px;
	padding: 8px 0px;
}

.content .photo img{
	width: 100%;
}

.content .photobar{
	padding-top: 2px;
	height: 20px;
	background-color: var(--blue);
	color: #FFF;
}

.content .content-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 16px;
	grid-auto-rows: minmax(16px, auto);
	
	margin: 0px 16px;
	padding: 0px;
}

.content .content-grid.grid4 {
	grid-template-columns: repeat(4, 1fr);
	
	margin: 16px 16px;
}

.content .content-grid.newsarchive {
	grid-template-columns: repeat(2, 1fr);
}

.content .content-grid a {
	text-decoration: none;
}

.content .entry-grid {
	padding: 0px;
	height: 256px;
	display: grid; 
    grid-template-columns: auto;
	
	background-color: var(--blue);
	box-shadow: 0px 2px 6px var(--shadow);
	
	border: 3px;
	border-color: #FFF;
	border-style: none none solid none;
}

.content .entry-grid.small{
	height: auto;
	background-color: #FFF;
	color: var(--red);
	border-style: none;
}

.content .entry-grid .read-more{
	grid-column: 2;
	position: relative;
	height: 20px;
	width: 72px;
	top: -20px;
	padding: 0px 8px;
	margin-left: auto; 
	margin-right: 0;
	
	background-color: #FFF;
	font-family: 'Open Sans', Verdana;
	font-size: 14px;
	color: var(--red);
}

.content .entry-grid:hover .read-more{
	background-color: var(--red);
	color: #FFF;
}

.content .entry-news {
	grid-column: 1 / 3;
}

.content .entry-league {
	grid-row: 1 / 3;
	grid-column: 3 / 3;
	height: 534px;
}

.content .entry-grid .title{
	height: 20px;
	margin: auto;
	padding: 4px 8px 8px 8px;
	margin-left: auto;
			
	font-size: 20px;
	color: #FFF;
	
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.content .entry-grid .note{
	padding: 8px 0px 8px 0px;
	
	font-family: 'Acme', Verdana;
	font-size: 18px;
	text-align: center;
	
	color: #FFF;
}

.content .entry-grid .result{
	margin: 0px 0px;
	height: 196px;
	padding: 0px 8px;
	overflow-y: hidden;	
	
	background-color: var(--bgNavy);	
	color: #FFF;
	text-align: center;
}

.content .entry-grid .fixture{
	margin: 0px 0px;
	height: 196px;
	padding: 0px 8px;
	overflow-y: hidden;	
	
	background-color: var(--bgNavy);
	color: #FFF;
	text-align: center;
}

.content .entry-grid .league{
	margin: 0px 0px 0px 0px;
	height: 502px;
	padding: 0px 8px;
		
	background-color: var(--bgNavy);
	font-size: 14px;
	color: #FFF;
	text-align: left;
	overflow: hidden;
}

.content .entry-grid .news{
	margin: 0px;
	margin-top: 0px;
	height: 196px;
	padding: 0px;
	
	display: grid;
	gap: 0px;
	grid-template-columns: 320px auto;
		
	background-color: var(--bgNavy);
	font-family: 'Open Sans', Verdana;
	font-size: 14px;
	color: #FFF;
	text-align: left;
	overflow: hidden;
}

.content .entry-grid .news .news-photo{
	grid-column: 1;
	margin: 0px;
	height: 196px;
	
	background-size: cover;
	background-repeat: no-repeat;
    background-position: center top;
}

.content .entry-grid .news .news-container{
	grid-column: 2;
	height: 194px;
	margin: 0px;
	padding: 0px 8px;
		
	-webkit-mask-image: -webkit-gradient(
        linear,
        left 88%,
        left 99%,
        from(rgba(0,0,0,1)),
        to(rgba(0,0,0,0))
    );
}


.content .entry-grid .news .read-more{
	grid-column: 2;
}


.content .entry-grid .match{
	padding: 0px;
	width: 100%;
	max-width: 320px;
		
	color: #FFF;
	font-size: 26px;
	text-transform: uppercase; 
	
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.content .entry-grid .match .team{
	max-width: 0;
	padding: 0px 8px;
	height: 48px;
	
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	text-align: center;
	
	background-color: var(--blue);
}

.content .entry-grid .match .score{
	padding: 4px;
	width: 40px;
	height: 48px;
	
	background: none;
	background-color: #FFF;
	color: var(--red);
	font-size: 32px;
}

.content .entry-grid .match .versus{
	padding: 2px;
	height: 100%;
	width: 40px;
	
	background: none;
	background-color: #FFF;
	color: var(--red);
	font-size: 20px;
	text-align: center;
}

.content .entry-grid .league-header{
	padding: 0px;
	width: 100%;
	max-width: 360px;
		
	font-size: 14px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	
	background-color: #FFF;
	color: var(--red);
}

.content .entry-grid .league-header .team{
	max-width: 0;
	padding: 0px 4px;
	
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	text-align: left;
}

.content .entry-grid .league-header .data{
	width: 28px;
	padding: 0px 4px;
	
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	text-align: center;
	
}

.content .entry-grid .league-table{
	padding: 0px;
	width: 100%;
	max-width: 360px;
		
	color: #FFF;
	font-size: 18px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.content .entry-grid .league-table .team{
	max-width: 0;
	padding: 0px 4px;
	height: 28px;
	
	text-align: left;
}

.content .entry-grid .league-table .data{
	width: 28px;
	padding: 0px 4px;
	
	text-align: center;
}

.content .entry-grid .league-table .evenrow{
	background-color: var(--bgBlue);
}

.content .entry-grid .league-table .oddrow{
	/*background-color: #0002;*/
	background-color: var(--bgBlue);
}

.content .entry-grid .league-table .cullenrow{
	background-color: var(--blue);
}

.content .entry-grid .league-table .keycell{
	width: 28px;
	padding: 0px 4px;
	
	text-align: center;
	
	background-color: #FFF;
	color: var(--red);
}

.content .entry-grid .league-table .line{
	width: 100%;
	padding: 0px;
	height: 2px;
	
	border: 3px;
	border-color: #FFF;
	border-style: none none solid none;
	
	background-color: var(--red);
}

.content .entry-grid .date{
	padding: 5px 8px;
	height: 18px;
		
	font-size: 16px;
	text-transform: uppercase; 	
	background-color: #FFF;
	color: var(--red);
	
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.content .entry-grid .comittee{
	margin: 0px 0px;
	height: 42px;
	padding: 0px 8px;
	overflow-y: hidden;	
	
	background-color: var(--blue);	
	color: #FFF;
	text-align: center;
}

.content .entry-grid.hover:hover {
	background-color: var(--red);
	border-color: var(--red);
}

.content .entry {
	padding: 8px 8px 8px 8px;
	background-color: #FFF;
	background-color: var(--bgNavy);
	color: #FFF;
	
	border: 4px;
	border-color: #FFF;
	border-style: none none solid none;
}

.content .entry-content {
	padding: 0px;
}

.content .map {
	width: 100%;
	max-width: 800px;
	height: 400px;
	margin-bottom: 16px;
}

.content .buttons {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	padding: 8px;
}

.content .buttons .button {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 80px;
	height: 40px;
	background-color: var(--blue);
	color: #FFF;
	margin: 8px;
}

.content .buttons .button:hover {
	background-color: #FFF;
	color: var(--red);
}

.content .buttons .disabled,
.content .buttons .disabled:hover {
	background-color: #777;
	color: #FFF;
}

@media screen and (max-width: 1280px)
{
	.content .content-grid,
	.content .content-grid.newsarchive {
		grid-template-columns: repeat(2, 1fr);
	}
		
	.content .entry-league {
		display: none;
	}
}


@media screen and (max-width: 846px)
{
	.contentheader {
		margin-top: 8px;
	}

	.contentheadercontent {
		height: 40px;
	}
	
	.contentheadercontent .headerlabel {
		font-size: 20px;
	}
	
	.content .content-grid,
	.content .content-grid.newsarchive {
		grid-template-columns: repeat(1, 1fr);
		margin: 0px 8px;
	}
		
	.content .entry-news {
		grid-column: 1 / 1;
	}
}

@media screen and (max-width: 600px)
{
	.content .entry-news {
		height: 440px;
	}
	
	.content .entry-grid .news{
		display: block;
		height: 380px; 
	}
	
	.content .entry-grid .news .news-photo{
		width: 100%;
	}

	.content .entry-grid .news-container{
		height: 184px;
		max-height: 184px;
	}
	
	.content .entry-grid .news .news-more{
		grid-column: 1;
		top: -20px;
	}
	
	.content .header1{
		font-size: 22px;
	}
}

@media screen and (max-width: 1100px)
{
	.content .content-grid.grid4 {
		grid-template-columns: repeat(3, 1fr);
	}
}

@media screen and (max-width: 820px)
{
	.content .content-grid.grid4 {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media screen and (max-width: 550px)
{
	.content .content-grid.grid4 {
		grid-template-columns: repeat(1, 1fr);
	}
}