
:root {
	--colorBlack: rgba(0, 0, 0, 1);
	--colorWhite: rgba(255, 255, 255, 1);
	--colorGold: rgba(255, 215, 0, 1);
	--colorCrimson: crimson;
	--colorSilver: rgba(192, 192, 192, 1);
	--colorPurple: indigo;
}


body {
	background-color: black;
	background-image:url('../images/backgrounds/NFL.jpg');
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-position: left 50px;
	background-size: auto 80vh;
	font-family: 'Ubuntu', Verdana, Helvetica, sans-serif;
	font-size: 1em;
}

.mainContent{
	margin: 60px 0px 100px 0px;

}

@media (max-width: 767px) {
	.xsHeader {
		display: inline;
	}
	.smHeader {
		display: none;
	}
	.lgHeader {
		display: none;
	}
	.xsBody {
		display: inline;
	}
	.smBody {
		display: none;
	}
}

@media (min-width: 768px) and (max-width: 1199px) {
	.xsHeader {
		display: none;
	}
	.smHeader {
		display: inline;
	}
	.lgHeader {
		display: none;
	}
	.xsBody {
		display: none;
	}
	.smBody {
		display: inline;
	}
}


@media (min-width: 1200px) {
	body {
		background-size: 1200px auto;
	}
	.xsHeader {
		display: none;
	}
	.smHeader {
		display: none;
	}
	.lgHeader {
		display: inline;
	}
	.xsBody {
		display: none;
	}
	.smBody {
		display: inline;
	}
}

a {
	text-decoration: none;
}

a.white {
	color: #fff;
}

a:hover {
	text-decoration: none;
}

a img {
	border: none;
}

a.nav-link.dropdown-toggle:active, a.nav-link.dropdown-toggle:focus {
   outline: 0;
}

.form-switch .form-check-input {
	background-color: white;
	border-color: #d50a0a;
	background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23d50a0a'/></svg>");
}

.form-switch .form-check-input:checked {
	background-color: #;
	border-color: #d50a0a;
	background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23d50a0a'/></svg>");
}

.form-switch .form-check-input:focus, .form-switch .form-check-input:active {
	border-color: #d50a0a;
	outline: 0;
	box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
}

.footer {
	background-color: black;
	color: white;
}

.navbar .dropdown-menu .dropdown-item:hover {
	background-color: gray;
	color: white;
}

.navbar .dropdown-item, #loginForm, #loginForm a {
	color: white;
}

.card {
	background-color: gainsboro;
	border-radius: 10px;
	border-width: 2px;
	border-color: #d50a0a;
	color: black;
}

.card-header, .entryTeamHeader {
	background-image: linear-gradient(# 80%, #d50a0a);
	color: white;
}

.card .card-header .cardHeaderImg {
	max-height: 35px;
	max-width: 35px;
}

#weekWinsCard h5, #howToPlayAccordionSmall h5, #commentsAccordionSmall h5, #leaderboardCard h5, #newsAccordionSmall h5 {
	line-height: 35px;
}

.newsDate {
	font-size: 0.8em;
}

.newsRow {
	font-size: 0.8em;
}

.newsRow:nth-child(odd) {
	background-color: darkgray;
}

#indexDisplay {
	color: white;
	font-size: 1em;
}

#scheduleDisplay .gameRow {
	height: 75px;
	margin: 0px 0px 3px;
	padding: 0px;
}

.gameRow {
	background-color: gainsboro;
}




.awayTeamCol {
	margin: 0px;
	padding: 0px 0px 0px 50px;
}

.homeTeamCol {
	margin: 0px;
	padding: 0px 50px 0px 0px;
}

.entryFavoritesRow {
	font-size: 1.2em;
}

.redHeart {
}

.redHeart svg {
	stroke-width: 40px;
	stroke: var(--colorWhite);
	fill: var(--colorCrimson);
	color: var(--colorCrimson);
}

#entryForm {
	color: white;
	margin: 0px;
	padding: 0px;
}

#entryForm input[type=radio] {
	display: none;
}

#entryForm label {
}

#entryForm .awayChecked:checked + label {
	background-image: radial-gradient(farthest-side at 0% 0%, rgba(192,192,192,1) 35%, rgba(0,0,0,0));
}

#entryForm .homeChecked:checked + label {
	background-image: radial-gradient(farthest-side at 100% 0%, rgba(192,192,192,1) 35%, rgba(0,0,0,0));
}

#entryForm .awayChecked:disabled + label {
	
}

#entryForm .homeChecked:disabled + label {
	
}

#entryForm h6 {
	margin: 0px;
	padding: 0px;
}

#entryForm .venueRow {
	margin: 0px;
	padding: 0px;
}

.entryTeamHeader, .resultsHeader, .standingsHeader, .indexWeekWinsHeader {
	border-radius: 4px;
	border-width: 2px;
	border-color: #d50a0a;
	background-image: linear-gradient(# 80%, #d50a0a);
	color: white;
}

.entrySubmit {
	background-color: #;
	background-image: linear-gradient(# 80%, #d50a0a);
	border-radius: 10px;
	border-width: 2px;
	border-color: #d50a0a;
	color: white;
}

.entrySubmit a {
	color: white;
}

#entryForm input[type=number]::-webkit-inner-spin-button {
  -webkit-appearance: none;
}

.gameOverlay {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	background-color: rgba(0,0,0,0.5);
}

.gameOverlayText {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 100%;
	text-align: center;
	font-size: 3em;
	color: rgba(255,255,255,1);
}



.resultsRow {
	background-color: gainsboro;
	font-size: 0.8em;
}

.standingsRow {
	background-color: gainsboro;
	font-size: 1em;
}

.resultsRow img, .standingsRow img {
	float: right;
	height: 100%;
	max-height: 35px;
	margin: 0px;
	padding: 0px;
}

.oddResultsRow {
	background-color: silver;
}

.goldCrown {
	stroke-width: 20px;
	stroke: indigo;
	fill: gold;
	color: gold;
	font-size: 1.5em;
}

.resultGamesRow, .scrollRow {
	overflow-x: auto;
	overflow-y: hidden;
}

.resultGamesCol {
	min-width: 38px;
	max-width: 40px;
	height: 40px;
	line-height: 40px;
}

.resultsRow .resultGamesCol {
	border: 1px solid gainsboro;
}

.oddResultsRow .resultGamesCol {
	border: 1px solid silver;
}

.resultsPlayerSpan {
}

.resultGamesColWin {
	/*border: 2px solid limegreen !important;*/
}

.resultGamesColTie {
	/*border: 2px solid cornflowerblue !important;*/
}

.resultGamesColLoss {
	/*border: 2px solid red !important;*/
}

.resultsPlayerName {
	background-color: ghostwhite;
}

.resultsPlayersCol {
	background-image: linear-gradient(to right, rgba(0,0,0,0), rgba(0,0,0,0) 50%, # 80%, black);

}

.resultsPlayersCol, .resultsPicksCol, .resultsScoresCol {
	height: 40px;
	line-height: 40px;
	font-size: 1.2em;
}

.standingsCol {

}

.standingsCol img {
	height: 100%;
	max-height: 35px;
}

.standingsSpan {
}

.resultsTeamName {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 100%;
	text-align: center;
	font-size: 1em;
	color: black;
}

.resultsTeamNameWin {
	font-weight: bold;
}

.resultsTeamLossOverlay {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	background-color: rgba(0,0,0,0.4);
}

.winTrophy {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	font-size: 1.8em;
	overflow: hidden;
}

.winTrophy svg {
	stroke-width: 10px;
	stroke: indigo;
	fill: gold;
	color: gold;
}

#svg-lombardi {
	stroke-width: 10px;
	stroke: var(--colorPurple);
	fill: var(--colorSilver);
	color: var(--colorSilver);
	height: 80%;
	width: 80%
}

.resultsWinnerText {
	color: var(--colorGold);
	font-size: 2em;
	font-weight: bold;
	text-shadow: black 0px 0px 1px, black 0px 0px 1px, black 0px 0px 1px, black 0px 0px 1px, black 0px 0px 1px, black 0px 0px 1px, black 0px 0px 1px, black 0px 0px 1px, black 0px 0px 1px, black 0px 0px 1px, black 0px 0px 1px, black 0px 0px 1px, black 0px 0px 1px, black 0px 0px 1px, black 0px 0px 1px, black 0px 0px 1px;
}






.editUserThemeRow {
	line-height: 35px;
}

 .editUserThemeRow img {
	 height: 30px;
	 width: auto;
 }






/*Start Week Number Links*/
a.week_numbers {  
   border-radius: 7px; 
   color: white;
   float: left; 
   margin: 5px 8px 5px 0; 
   padding: 5px;
   text-decoration: none;
}

a.current_week_number {
   background: -webkit-gradient(linear, left top, left bottom, from(#7a7a7a), to(#636363));   
   border-radius: 7px; 
   color: white;
   float: left; 
   margin: 5px 8px 5px 0; 
   padding: 5px;
   text-decoration: none;
}

a.week_numbers:hover {
   background: gainsboro;
}

/*End Week Number Links*/

.pm_notification {
	padding: 15px;
	color: #000;
	font-size: 16px;
	border: 1px dashed green;
	background-color: #f3f3f3;
}

.notice {
z-index: 15;
margin-top: -20px;
margin-bottom: 5px;
margin-left: auto;
margin-right: auto;
width: 745px;
height: 100%;
padding: 15px;
background-color: #ccc;
border-bottom-left-radius: 20px;
border-bottom-right-radius: 20px;
color: #000;
font-family: 'Ubuntu';
text-align: center;
}

.alert {
z-index: 15;
margin-top: -20px;
margin-bottom: 5px;
margin-left: auto;
margin-right: auto;
width: 745px;
height: 100%;
padding: 15px;
background-color: #ccc;
border-bottom-left-radius: 20px;
border-bottom-right-radius: 20px;
color: #000;
font-family: 'Ubuntu';
text-align: center;
}

#highlight-row {
background: rgba(0, 0, 0, .1);
}

/* Sortable tables */
table.sortable thead {
	cursor: pointer;
}


td.fieldLabel {
	font-weight: bold
}

table.table1 {
	position: relative;
	border-collapse: separate;
	border-spacing: 2px;
	font-size: 13px;
}

table.table1 th {
	background-color: #636363;
	background: -webkit-gradient(linear, left top, left bottom, from(#7a7a7a), to(#636363));
	color: #FFF;
	padding: 7px;
}

table.table1 tr {
	background-color: #636363;
	background: -webkit-gradient(linear, left top, left bottom, from(#7a7a7a), to(#636363));	
	
}

table.table1 tr td.lighter {
	background-color: #eee;
	color: #000;
}

table.table1 tr.altrow {
	background-color: #d50a0a;
	background: -webkit-gradient(linear, left bottom, left top, from(#d50a0a), to(#));
	background: linear-gradient(# 80%, #d50a0a);
}

table.table1 tr.hiddenrow {
	visibility: hidden;	
}

table.table1 tr.highlight-row {
	background: -webkit-gradient(linear, left top, left bottom, from(#bababa), to(#a0a0a0));	
}

table.table1 tr.tiebreaker {
	background: -webkit-gradient(linear, left top, left bottom, from(#bababa), to(#a0a0a0));	
}

table.table1 tr.altrow td.lighter {
	background-color: #ccc;
}

table.table1 tr.subheader {
	background-color: gray;
	color: #000;
	font-weight: bold;
}

table.table1 td {
	color: #FFF;
	padding: 5px
}

table.table1 tr.over td, table.table1 tr.overPerm td {
	background: #eee;
	color: #000;
}

table.nostyle, table.nostyle tr, table.nostyle td {
	background-color: #fff;
	border: none;
	color: #000;
}

.tiny {
	font-size: 10px;
}

caption {
  text-align:left;
}

fieldset {
	display: inline;
}

label {
	cursor: pointer;
}

.infoFlag {
	cursor: pointer;
}

.required {
	color: red;
	font-weight: bold;
}

#errors {
	margin-top: 10px;
	padding: 6px;
	border: 1px solid #000;
	background-color: #eee;
	color: red;
	font-weight: bold;
	line-height: 1.5em;
}

.warning {
	padding: 20px;
	color: red;
	font-size: 16px;
	font-weight: bold;
	border: 1px dashed red;
	background-color: #f3f3f3;
	margin-bottom: 10px;
}

#comments {
	padding: 5px;
	background-color: #696969;
}

.standings {
	background-color: #eee;
	padding: 5px;
	margin-bottom: 10px;
	width: 611px;
}

.time {
	background-color: #696969;
	font-size: 11px;
	padding: 4px;
	margin-bottom: 10px;
	float: right;
	position: relative;
	right: 3px;
	width: 233px;
	text-align: left;
}

.responseError {
	font-size: 12px;
	padding: 15px;
	border: 2px solid #F00;
	background-color: #F1F1F1;
	width: 360px;
}
.responseOk {
	line-height: 18px;
	font-size: 12px;
	padding: 15px;
	border: 1px solid #999;
	background-color: #F1F1F1;
}

.winner {
	border: 2px solid lime;
	padding: 1px;
}

.loser {
	border: 2px solid red;
	padding: 1px;
}

.tie {
	border: 2px solid blue;
	padding: 1px;
}

div.fieldLoaded,
input.fieldLoaded {
	background-color: #f0e0d0;
	border: 1px solid #a06020;
	padding: 2px 1px;
}

div.fieldLoaded {
	padding: 0px;
}

#warnings {
	background: #eee;
	border: 1px solid #000;
	margin-bottom: 10px;
	padding: 10px;
	color: red;
	font-weight: bold;
}



/* Team Navigation Colors */

.navbar, .dropdown-menu, a.week_numbers {
	background-color: #;
	background: linear-gradient(# 80%, #d50a0a);
}

#comments, #pageContent, .leaders, .time, .notice, .alert {
	border-color: #d50a0a;
	border-radius: 10px;
	border-style: solid;
	border-width: 2px;
}



/* Set the height of the editor */

.ck-editor__editable_inline {
	min-height: 100px;
	max-height: 200px;
}

.commentResponse{

}

.commentsDisplay {
	max-height: 250px;
	overflow-y: scroll;
}

.commentRow:nth-child(odd) {
	background-color: silver;
}



/*  Admin update users picks form    */

#picksForm input[type=radio] {
	display: none;
}

#picksForm .awayChecked:checked + label {
	background: lightgreen;
}

#picksForm .homeChecked:checked + label {
	background: lightgreen;
}

.picksFormCol {
	
}

/* Admin update users form */

.updateUsersCard {
}

.updateUsersForm {
	max-height: 50vh;
	max-width: 100vw;
	overflow-y: auto;
	overflow-x: auto;
}

.updateUsersFormCol {
	width: 150px;
	min-width: 150px;
	max-width: 150px;
 }

.updateUsersFormColBig {
	width: 250px;
	min-width: 250px;
	max-width: 250px;
 }

.updateUsersFormColSmall {
	width: 75px;
	min-width: 75px;
	max-width: 75px;
 }

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}