



/********************** DEFAULT STYLES **********************/



* { margin:0; padding:0; }



.carousel-control-prev-icon {

	background-image: url('../images/arrowLeft.svg') !important;

}



.carousel-control-next-icon {

	background-image: url('../images/arrowRight.svg') !important;

}



/************************************************************/



@media screen and (min-width: 320px)  {



	.container-01 {

		width: 100%;

		height: auto;

		background-color: #fff;

		padding: 15px 10px;

	}



		.breadcrumbNav {

			display: inline-block;

			width: 60%;

			height: auto;

			font-family: 'Lato', sans-serif;

			font-weight: 400;

			text-transform: uppercase;

			font-size: 0.7em;

			margin: auto;

		}



		.bannerImage {

			display: none;

		}



		.mainHeading {

			/*display: inline-block;)*/

			font-family: 'Poppins', sans-serif;

			font-weight: 900;

			font-size: 2.5em;

			line-height: 0.8em;

			text-transform: uppercase;

			letter-spacing: 1px;

			padding: 1px 0 1px 20px;

			margin: 30px 0 30px 0px;

			border-left: 10px solid #0468B0;

			width: auto;

		}



		.presentedBy {

			width: auto;

			height: auto;

			display: inline-block;

			float: right;

			margin: auto;

		}



			.presentedBy p {

				text-align: center;

				font-family: 'Lato', sans-serif;

				font-weight: 400;

				text-transform: uppercase;

				font-size: 0.6em;

				margin: auto auto -2px auto;

			}



			.presentedBy img {

				width: 125px;

				height: auto;

				margin: auto;

				margin-top: 10px;

			}



			.presentedBy img {

				width: 70px;

				height: auto;

				margin: auto;

			}





		.gridSection {

			width: 100%;

			height: auto;

		}



			.gridCard {

				float: none;

				display: inline-block;

				width: 100%;

				height: auto;

				margin: auto auto 35px auto;

				transition: 0.3s !important;

			}



			.gridImage {

				width: 100%;

				height: 200px;

				background-position: 50% 50%;

				float: none;

				transition: 0.3s !important;

				background-repeat: no-repeat;

			}



				a #grid01 {

					background-image: url('../images_promos/streetbanners_2023_card.jpg');

					background-size: auto 100%;

				}



				a #grid02 {

					background-image: url('../images_visit/promotions_grid_02.jpg');

					background-size: auto 100%;

				}



				a #grid03 {

					background-image: url('../images_visit/promotions_grid_03.jpg');

					background-size: auto 100%;

				}



				a #grid04 {

					background-image: url('../images_visit/promotions_grid_04.jpg');

					background-size: auto 100%;

				}



				a #grid05 {

					background-image: url('../images_visit/promotions_grid_05.jpg');

					background-size: auto 100%;

				}



				a #grid06 {

					background-image: url('../images_visit/promotions_grid_06.jpg');

					background-size: auto 100%;

				}

				

				a #grid07 {

					background-image: url('../images_induction/grid_induction2022landing_03.jpg');

					background-size: auto 100%;

				}



				a #grid08 {

					background-image: url('../images_visit/promotions_grid_HHoF-Weekend-Card.jpg');

					background-size: auto 100%;

				}





				a #grid09 {

					background-image: url('../images_visit/promotions_grid_VIP-IND-Card.jpg');

					background-size: auto 100%;

				}



				a #grid10 {

					background-image: url('../images_visit/esso_promocard.jpg');

					background-size: auto 100%;

				}



				a #grid11 {

					background-image: url('../images_promos/mb23_promo_card.jpg');

					background-size: auto 100%;

				}

				

				a #grid12 {

					background-image: url('../images_promos/sweepstakes_promocard.jpg');

					background-size: auto 100%;

				}

				

				a #grid13 {

					background-image: url('../images_promos/promo_CanlanLvlup_card.png');

					background-size: auto 100%;

				}





				a #grid14 {

					background-image: url('../images_promos/xmovement_card.jpg');

					background-size: 100%;

				}



				a #grid15 {

					background-image: url('../images_promos/summitseries_card.jpg');

					background-size: 100%;

				}



				a #grid16 {

					background-image: url('../images_promos/sundiscount_card.jpg');

					background-size: 100%;

				}



				a #grid17 {

					background-image: url('../images_promos/nftcard_promo.png');

					background-size: 100%;

				}

	

				a #grid18 {

					background-image: url('../images_promos/familyday2024_pomocard_800x450.jpg');

					background-size: 100%;

				}



				a #gridLC24 {

					background-image: url('../images_promos/card_LegendsClassic24.jpg');

					background-size: 105%;

				}

	

				a #gridUDno1 {

					background-image: url('../images_promos/Upper-Deck-Promotions-No1-Draft-Pick.jpg');

					background-size: 100%;

				}



				a #gridInd24Cele{

					background-image: url('../images_promos/card_Induction2024.jpg');

					background-size: 100%;

				}



 				a #gridSun01 {

    				background-image: url('../images_promos/HHOF25 Sub Ads-Digital R2-800x450.jpg');

    				background-size: 100%;

  				}



	 			a #gridUDGretzky40 {

    				background-image: url('../images_promos/2024-Gretzky-Anniversary-Banner-Landing.jpg');

    				background-size: 100%;

  				}



		 		a #gridFamily {

    				background-image: url('../images_promos/family-day-2025.jpg');

    				background-size: 100%;

  				}



    				a #gridMarchBreak25 {

        			background-image: url(../images_promos/promotions-grid_March-Break-25.jpg);

        			background-size: 100%;

    				}



		 		a #grid4Nations{

    				background-image: url('../images_promos/4nations-cup-photo.jpg');

    				background-size: 100%;

  				}



		 		a #gridNHCD{

    				background-image: url('../images_promos/2025-NHCD-Announcement-Banner-9cardsheets.jpg');

    				background-size: 100%;

  				}



		 		a #gridPhil{

    				background-image: url('../images_promos/Banner-KeeperCon.jpg');

    				background-size: 100%;

  				}



		 		a #FujifilmPrintlife{

    				background-image: url('../images_promos/Fujifilm-Printlife_card.jpg');

    				background-size: 100%;

  				}



  				a #gridIND25{

    				background-image: url('../images_promos/grid_ring25.jpg');

    				background-size: 100%;

  				}



  				a #gridLBS{

    				background-image: url('../images_promos/grid-lbs.jpg');

    				background-size: 100%;

  				}



				

  				a #gridOlympics{

						background-image: url(../images/olympics26.jpg);

						background-size: 100%;

					}	





				a #gridInd26a{

					background-image: url(../images/index_news_IND26-First-Year-Eligible.jpg);

					background-size: 100%;

				}	





				a #gridPantherRing25{

						background-image: url(../images/index_news_Panthers-Ring25.jpg);

						background-size: 100%;

				}





  				a #gridtriple{

    				background-image: url(../images/TripleCentennial_News.jpg);

    				background-size: 100%;

  				}



  				 a #gridpanthersx2{

    				background-image: url(../images/index_PanthersX2_News-Card.jpg);

    				background-size: 100%;

  				}



  				 a #gridpanthers{

    				background-image: url(../images/index_spotlight_Panthers-Ring.jpg);

    				background-size: 100%;

  				}



  				a #grid4NationsNew{

						background-image: url(../images/index_spotlight_4-Nations-Cup-Showcase.jpg);

						background-size: 100%;

					}



				a #gridPWHL{

						background-image: url(../images/womenshockey_spotlight.jpg);

						background-size: 100%;

					}



				a #gridfund{

						background-image: url(../images/index_news_fund.jpg);

						background-size: 100%;

					}



				a #gridMedia26{

						background-image: url(../images/index_news_media26.jpg);

						background-size: 100%;

					}



				a #gridCliff{

						background-image: url(../images/index_news_cliff.jpg);

						background-size: 100%;

					}



				a #imageannday{

						background-image: url(../images/index_news_annday.jpg);

						background-size: 100%;

					}





				a #imageSCDisplay26{

						background-image: url(../images/index_news_sc26carolina.jpg);

						background-size: 100%;

					}



				a #gridMatt{

						background-image: url(../images/index_news_matt.jpg);

						background-size: 100%;

					}

				a #gridUDGretzky{

						background-image: url(../images_news/index_news_UDGretzky.jpg);

						background-size: 100%;

					}



			.gridContent {

				display: inline-block;

				width: 100%;

				height: auto;

				float: none;

			}



				.gridHeading {

					font-family: 'Poppins', sans-serif;

					font-weight: 900;

					background-color: #fff;

					color: #000;

					font-size: 1.5em;

					margin: 15px auto 0px auto;

					height: auto;

				}



				.gridHeadingSMALL {

					font-family: 'Poppins', sans-serif;

					font-weight: 900;

					background-color: #fff;

					color: #000;

					font-size: 1.5em;

					margin: 15px auto 0px auto;

					height: auto;

				}



				.gridCopy {

					font-family: 'Poppins', sans-serif;

					font-weight: 500;

					background-color: #fff;

					color: #000;

					font-size: 0.75em;

					margin: 5px auto 5px auto;

					height: auto;

				}



				.gridButton {

					display: inline-block;

					font-family: 'Lato', sans-serif;

					font-weight: 400;

					background-color: #0468B0;

					color: #fff;

					text-transform: uppercase;

					border-radius: 4px;

					padding: 4px 15px;

					font-size: 0.85em;

					height: auto;

					transition: 0.3s;

				}



					.gridButton:hover {

						background-color: lightgrey;

						color: #0468B0;

						text-decoration: none;

					}



					.gridButton:active {

						background-color: lightgrey;

						color: #0468B0;

						text-decoration: none;

					}



					.gridCard:hover > a .gridImage {

						background-size: auto 110% !important;

					}



}



/************************************************************/



@media screen and (min-width: 375px)  {



	.breadcrumbNav {

		width: 60%;

	}



	.presentedBy {

		margin-top: -32px;

	}



}



/************************************************************/



@media only screen 

    and (device-width : 375px) 

    and (device-height : 812px) 

    and (-webkit-device-pixel-ratio : 3) {





}



/************************************************************/



@media screen and (min-width: 414px)  {



	.container-01 {

	}



		.gridSection {

		}



			.gridImage {

				height: 250px;

				background-repeat: no-repeat;

			}



			.gridContent {

			}



				.gridHeading {

					font-size: 1.75em;

					margin: 15px auto 0px auto;

				}



				.gridHeadingSMALL {

					font-size: 1.75em;

					margin: 15px auto 0px auto;

				}



				.gridCopy {

					font-family: 'Poppins', sans-serif;

					font-weight: 500;

					background-color: #fff;

					color: #000;

					font-size: 0.75em;

					margin: 5px auto 5px auto;

				}



				.gridButton {

					display: inline-block;

					font-family: 'Lato', sans-serif;

					font-weight: 400;

					background-color: #0468B0;

					color: #fff;

					text-transform: uppercase;

					border-radius: 4px;

					padding: 4px 15px;

					font-size: 0.85em;

					clear: both;

				}

	

			.presentedBy {

				margin-top: -16px;

			}



}



/************************************************************/



@media screen and (min-width: 480px)  {



			.presentedBy p {

				font-size: 0.6em;

			}

				

			.presentedBy {

					margin-top: -16px;

			}



}



/************************************************************/



@media screen and (min-width: 568px) {



	.container-01 {

		padding: 20px 10px;

	}



		.breadcrumbNav {

			margin: auto 10px;

			width: 60%;

		}



		.mainHeading {

			margin: 30px 0 30px 10px;

			width: 60%;

		}



		.presentedBy {

			margin: 30px 10px auto auto;

		}





		.gridSection {

		}



			.gridCard {

				float: left;

				width: 46.5%;

				height: auto;

				margin: auto 1.75% 35px 1.75%;

			}



			.gridImage {

				width: 100%;

				height: 125px;

				background-position: 50% 50%;

				float: none;

				background-repeat: no-repeat;

			}



				a #grid01 {

					background-size: 100% auto;

				}



				a #grid02 {

					background-size: 100% auto;

				}



				a #grid03 {

					background-size: 100% auto;

				}



				a #grid04 {

					background-size: 100% auto;

				}



				a #grid05 {

					background-size: 100% auto;

				}



				a #grid06 {

					background-size: 100% auto;

				}



				a #grid07 {

					background-size: 100% auto;

				}



				a #grid08 {

					background-size: 100% auto;

				}



				a #grid09 {

					background-size: 100% auto;

				}

				

				a #grid10 {

					background-size: 100% auto;

				}



				a #grid11 {

					background-size: 100% auto;

				}



				a #grid12 {

					background-size: 100% auto;

				}



				a #grid13 {

					background-size: 100% auto;

				}



				a #grid14 {

					background-size: 100% auto;

				}



				a #grid15 {

					background-size: 100% auto;

				}



				a #grid16 {

					background-size: 100% auto;

				}



				a #grid17 {

					background-size: 100% auto;

				}



				a #gridLC24 {

					background-size: 100% auto;

				}

	

				a #gridUDno1 {

					background-size: 100% auto;

				}



				a #gridSun01 {

					background-size: 100% auto;

				}





				a #gridInd24Cele{

					background-size: 100% auto;

				}



				a #gridUDGretzky40{

					background-size: 100% auto;

				}

	

				a #gridFamily {

					background-size: 100% auto;

				}



				a #grid4Nations{

					background-size: 100% auto;

				}



				a #gridNHCD{

					background-size: 100% auto;

				}



				a #gridPhil{

					background-size: 100% auto;

				}



				a #FujifilmPrintlife{

					background-size: 100% auto;

				}



				a #gridMatt{

					background-size: 100% auto;

				}


				a #gridUDGretzky{

					background-size: 100% auto;

				}

			.gridContent {

				width: 100%;

				height: auto;

				float: none;

			}



				.gridHeading {

					font-size: 1em;

					margin: 15px auto 0px auto;

				}



				.gridHeadingSMALL {

					font-size: 1em;

					margin: 15px auto 0px auto;

				}



				.gridCopy {

					font-size: 0.65em;

					margin: 5px auto 10px auto;

					height: 40px;

				}



				.gridButton {

				}



				.gridCard:hover > a .gridImage {

						background-size: 110% auto !important;

					}



}



/************************************************************/



@media screen and (min-width: 667px) {



	.gridImage {

		width: 100%;

		height: 150px;

		background-position: 50% 50%;

		float: none;

		background-repeat: no-repeat;

	}



	.gridHeading {

		font-size: 1.25em;

	}



	.gridHeadingSMALL {

		font-size: 1em;

	}



	.gridCopy {

		font-size: 0.75em;

		margin: 5px auto 10px auto;

		height: 50px;

	}



	.gridButton {

	}



}



/************************************************************/



@media screen and (min-width: 736px)  {



	.mainHeading {

		width: 50%;

	}



}



/************************************************************/



@media screen and (min-width: 768px)  {



	.container-01 {

		padding: 25px;

	}



		.breadcrumbNav {

			margin-left: 0px;

			width: 100%;

		}



		.bannerImage {

			display: inline-block;

			background-image: url('../images_visit/promotions_topBanner.jpg');

			background-size: 100% auto;

			background-position: 50% 50%;

			width: 100%;

			height: 175px;

			margin: 10px auto;

		}



		.mainHeading {

			margin-left: 0px;

			margin-top: 48px;

			margin-bottom: 12px;

			font-size: 3em;

		}



		.presentedBy {

			margin-right: 0px;

			margin-top: -10px;

		}



		.presentedBy img {

			width: 185px;

		}





		.gridSection {

			width: 103.5%;

			margin-left: -15px;

		}



	.gridSection {

		}



			.gridCard {

				float: left;

				width: 46.5%;

				height: auto;

				margin: auto 1.75% 35px 1.75%;

			}



			.gridCopy {

				font-size: 0.75em;

				margin: 5px auto 10px auto;

				height: 70px;

			}



}



/************************************************************/



@media only screen 

    and (device-width : 812px) 

    and (device-height : 375px) 

    and (-webkit-device-pixel-ratio : 3) {



    .container-01 {

		padding: 25px;

	}



		.bannerImage {

			display: inline-block;

			background-size: 100% auto;

			background-position: 50% 50%;

			width: 100%;

			height: 175px;

			margin: 10px auto;

		}



		.mainHeading {

			margin-left: 0px;

			font-size: 3em;

		}



		.presentedBy {

			margin-right: 0px;

			margin-top: 0px;

		}





		.gridSection {

			width: 103.5%;

			margin-left: -15px;

		}



	.gridSection {

		}



			.gridCard {

				float: left;

				width: 46.5%;

				height: auto;

				margin: auto 1.75% 35px 1.75%;

			}

    	

}



/************************************************************/



@media screen and (min-width: 992px)  {



	.container-01 {

		padding: 240px 40px 40px 40px;

	}



		.breadcrumbNav {

			width: 100%;

			margin-left: 0px;

		}



		.mainHeading {

			margin: 48px 0px 12px 0;

			width: 60%;

		}



		.gridSection {

			width: 103%;

			margin-left: -10px;

		}



			.gridCard {

				width: 31%;

				margin: auto 1% 40px 1%;

			}

				.gridHeading {

					font-size: 1.5em;

				}



				.gridCopy {

					height: 70px;

					font-size: 0.9em;

				}



				.gridButton {

					font-size: 0.9em;

				}



}



/************************************************************/



@media screen and (min-width: 1024px)  {



	.container-01 {

		padding: 240px 40px 0px 40px; 

	}



		.gridCard {

			height: 375px;

		}

}



/************************************************************/



@media screen and (min-width: 1266px)  {



}



/************************************************************/



@media screen and (min-width: 1280px)  {



	.container-01 {

		width: 1280px;

		margin: auto;

	}



		.mainHeading {

			font-size: 4em;

			padding: 0 0 0 20px;

			margin: 30px 0 60px 0;

		}



        .presentedBy img {

            width: 250px;

            margin-bottom: 0px;

            margin-top: 15px;

            margin-right:-10px;

        }



		.gridSection {

		}



			.gridImage {

				height: 200px;

				background-position: 50% 50%;

				background-repeat: no-repeat;

			}



			.gridCard {

				height: 400px;

			}

			

				.gridHeading {

					font-size: 1.75em;

				}



				.gridCopy {

					height: 70px;

					font-size: 1em;

				}



				.gridButton {

					font-size: 0.9em;

				}



}



/************************************************************/



@media screen and (min-width: 1281px)  {







}



/************************************************************/



@media screen and (min-width: 1366px)  {



}



/************************************************************/





@media screen and (min-width: 1600px)  {



}



/************************************************************/



@media screen and (min-width: 1920px)  {



}



/************************************************************/





























