/* FULL PAGE NOTICE STYLES */
.notice-grid {
	display: grid;
	grid-template-columns: repeat(5, min(125px, 10vw));
	grid-template-rows: min(10px, max(75px, 5vh)) min(175px,max(100px, 10vh))repeat(4, min(50px, max(75px, 8vh)))  min(10px, max(75px, 5vh));
	grid-gap: 1.0em 1.5em;
	background-color: #DA291c;
}


.notice-top {
	grid-column: 2 / span 3;
	grid-row: 2 / span 1;
	text-align: center;
	align-items: center;
	background-size: contain;
	background-position-x: center;
	background-image: url('/custom/shaw/images/logo_rogers.png');
	background-color: #DA291c;
	background-position-y: center;
	background-repeat: no-repeat no-repeat;
	color: #DA291c;

}

.notice-middle {
	background-color: #DA291c;
	color: #FFF;
	font-size: min(max(1.5vw, 12px), 16px);
	text-align: center;
	justify-content: right;
	align-items: center;
}

.notice-regular-text {
	font-family: TedNext-Regular;
}

.notice-bold-text {
	font-family: TedNext-Bold;
}

.notice-middle-header {
	grid-column: 1 / span 5;
	grid-row: 3 / span 1;
	text-align: center;
	font-size: min(max(1.5vw, 12px), 20px);
}

.notice-middle-header-info {
	grid-column: 1 / span 5;
	grid-row: 3 / span 1;
	text-align: center;
	font-size: min(max(1.5vw, 16px), 20px);
}

.notice-countdown-time {
	grid-column: 1 / span 5;
	grid-row: 4 / span 1;
	font-size: min(max(1.5vw, 16px), 20px);
	font-family: TedNext-Regular;
}

.notice-countdown-time-info {
	grid-column: 1 / span 5;
	grid-row: 5 / span 1;
	font-size: min(max(1.5vw, 16px), 20px);
}


.notice-middle-text {
	text-align: center;
	grid-column: 2 / span 3;
	grid-row: 5 / span 1;
	font-family: TedNext-Regular;
}

.notice-middle-text-info {
	text-align: center;
	align-items: top;
	grid-column: 1 / span 5;
	grid-row: 4 / span 1;
	font-size: min(max(1.5vw, 12px), 16px);
	margin: 0.5em;
}

.notice-middle-text-link {
	font-size: 1.0em;
	font-family: TedNext-Bold;
	text-decoration: underline;
	text-decoration-color: #FFFFFF;
}

.notice-middle-text-link:hover {
	text-decoration-color: rgba(256, 256, 256, 0.7);
	color: rgba(256, 256, 256, 0.7);
}

.notice-lower {
	grid-column: 2 / span 3;
	grid-row: 6 / span 1;
	margin: min(150px, max(25px, 4vh));
	color: #FFFFFF;
}


.notice-button {
	padding: min(75px, max(25px, 4vh));
	margin: 0.1em 0.1em;
	color: #000;
	background-color: rgba(256, 256, 256, 1);
	border-style: none;
	text-align: center;
	justify-content: center;
	align-items: center;
	font-size: min(max(1.5vw, 12px), 18px);
	font-family: TedNext-Regular;
	text-decoration: none;
	min-width: 100px;
	display: flex;
}



.notice-button:hover {
	background-color: rgba(256, 256, 256, 0.7);
}



.notice-banner-small-text-styles {
	text-align: center;
	color: #FFFFFF;
	font-family: TedNext-Regular;
	font-size: min(14px, max(0.6vw, 10px));
}


@media screen and (801px <=width <=1000px) {

	.notice-grid {
		grid-template-columns: repeat(5, min(100px, 15vw));
		grid-template-rows: min(10px, max(60px, 10vh)) min(150px, max(75px, 5vh)) min(50px, max(75px, 25vh)) repeat(4, min(100px, max(50px, 5vh)));
	}

}

@media screen and (0px <=width <=800px) {

	.notice-grid {
		grid-template-columns: repeat(5, min(100px, 15vw));
		grid-template-rows: min(10px, max(60px, 10vh)) min(45px, max(25px, 5vh)) min(50px, max(75px, 25vh)) repeat(4, min(100px, max(50px, 5vh)));
	}


}
