.sportGroup
{
	position:relative;
	user-select:none;
	-webkit-tap-highlight-color:rgba(0, 0, 0, 0);
}

.sportGroup .divSportGroupIcon
{
	background-position:center left;
	background-repeat:no-repeat;
	background-size:30px 30px;
	float:left;
	height:40px;
	line-height:40px;
	margin-right:5px;
	position:absolute;
	width:36px;
}

.sportGroup .h3SportGroupLabel
{
	height:40px;
	left:40px;
	line-height:40px;
	position:absolute;
}

.sportGroup .divButtonBar
{
	position:absolute;
	right:0px;
	top:0px;
	z-index:1;
}

.sportGroup .btnPrevious, .sportGroup .btnNext
{
	background-color:#292a2f;
    border:2px solid #3f4656;
    border-radius:50%;
	color:#888b90;
    cursor:pointer;
    float:left;
    height:36px;
	line-height:36px;
    margin-right:15px;
	text-align:center;
    transition:border 0.25s, box-shadow 0.25s, color 0.25s;
    width:36px;
}

.sportGroup .btnPrevious:hover, .sportGroup .btnPrevious:focus, .sportGroup .btnNext:hover, .sportGroup .btnNext:focus
{
	border:2px solid #cffdff;
    box-shadow:inset 0px 0px 5px #01eff9, 0px 0px 5px #01eff9;
	color:#ffffff;
}

.sportGroup .divSportContainer
{
	left:-30px;
	padding-top:20px;
	position:relative;
	width:calc(100% + 60px);
}

.sportGroup .divSportContainer:before
{
	background-color:#1b1c20;
	bottom:10px;
	box-shadow:0px 0px 15px 10px #1b1c20;
	content:"";
	display:block;
	left:0px;
	position:absolute;
	top:30px;
	width:20px;
	z-index:1;
}

.sportGroup .divSportContainer:after
{
	background-color:#1b1c20;
	bottom:10px;
	box-shadow:0px 0px 10px 10px #1b1c20;
	content:"";
	display:block;
	position:absolute;
	right:0px;
	top:30px;
	width:20px;
	z-index:1;
}

.sportGroup .divSportScroller
{
	overflow-x:scroll;
	overflow-y:hidden;
	padding:0px 30px;
	position:relative;
	scroll-behavior:smooth;
	-webkit-overflow-scrolling:touch;
}

.sportGroup .divSportScroller::-webkit-scrollbar
{
	background:transparent;
	height:0px;
	width:0px;
}

.sportGroup .divSportRow
{
	font-size:0px;
	white-space:nowrap;
}

.sportGroup .divSportRow.auto
{
	display:grid;
	gap:20px;
	grid-template-columns:repeat(10, 1fr);
	white-space:normal;
}

.sportGroup .divSportRow:first-child
{
	margin-top:40px;
}

.sportGroup .divSportRow:after
{
	clear:both;
	content:"";
	display:block;
}

.sportGroup .divSportTile
{
	background-color:#292a2f;
	border-radius:10px;
	contain:layout style paint;
	cursor:pointer;
	display:inline-block;
	margin:0px 20px 20px 0px;
	overflow:hidden;
	position:relative;
	transition:transform 0.25s;
	width:calc((100% - 180px) / 10);
}

.sportGroup .auto .divSportTile
{
	margin:0px;
	width:auto;
}

.sportGroup .divSportTile:last-child
{
	margin-right:50px;
}

.sportGroup .auto .divSportTile:last-child
{
	margin-right:0;
}

.sportGroup .divSportTile:hover, .sportGroup .divSportTile:focus
{
	transform:scale(1.05);
	z-index:2;
}

.sportGroup .divSportTile:after
{
	box-shadow:inset 0px 20px 10px -20px rgba(255, 255, 255, 0.75), inset 0px -20px 10px -20px rgba(0, 0, 0, 0.75);
	content:"";
	display:block;
	height:100%;
	left:0px;
	position:absolute;
	top:0px;
	width:100%;
}

.sportGroup .imgTile
{
	aspect-ratio:2 / 3;
	object-fit:cover;
	width:100%;
}

.sportGroup .divTileOverlay
{
	background-color:rgba(0, 0, 0, 0.85);
	bottom:0px;
	left:0px;
	opacity:0;
	position:absolute;
	right:0px;
	top:0px;
	transition:opacity 0.25s;
}

.sportGroup .divSportTile:hover .divTileOverlay, .sportGroup .divSportTile:focus .divTileOverlay
{
	opacity:1;
}

.sportGroup .divTileOverlay:after
{
	aspect-ratio:1 / 1;
	background-image:url('../../images/iconNeon.webp');
	background-position:center;
	background-repeat:no-repeat;
	background-size:1% 1%;
	content:"";
	display:block;
	left:12%;
	position:absolute;
	top:10%;
	transform:rotate(0deg);
	transition:background-size 0.25s, transform 0.25s;
	width:80%;
}

.sportGroup .divSportTile:hover .divTileOverlay:after, .sportGroup .divSportTile:focus .divTileOverlay:after
{
	background-size:100% 100%;
	transform:rotate(360deg);
}

.sportGroup .divOverlayLabel
{
	border-top:1px solid #cffdff;
	color:#cffdff;
	filter:drop-shadow(0px 0px 5px #01eff9);
	font-size:16px;
	left:20px;
	line-height:18px;
	max-height:54px;
	overflow:hidden;
	padding-top:8%;
	position:absolute;
	right:20px;
	text-align:center;
	top:68%;
	white-space:normal;
}

.sportGroup .btnShowMore
{
	display:none;
	left:50%;
	position:relative;
	transform:translateX(-50%);
}

.sportGroup .btnShowMore.show
{
	display:inline-block;
}

/* MEDIA QUERIES */
@media (max-width: 1920px)
{
	.sportGroup .divSportRow.auto
	{
		grid-template-columns:repeat(8, 1fr);
	}

	.sportGroup .divSportTile
	{
		width:calc((100% - 140px) / 8);
	}
}

@media (max-width: 1800px)
{
	.sportGroup .divSportRow.auto
	{
		grid-template-columns:repeat(7, 1fr);
	}

	.sportGroup .divSportTile
	{
		width:calc((100% - 120px) / 7);
	}

	.sportGroup .divOverlayLabel
	{
		font-size:14px;
		left:15px;
		line-height:16px;
		max-height:48px;
		right:15px;
	}
}

@media (max-width: 1400px)
{
	.sportGroup .divSportRow.auto
	{
		grid-template-columns:repeat(6, 1fr);
	}
	
	.sportGroup .divSportTile
	{
		width:calc((100% - 100px) / 6);
	}

	.sportGroup .divOverlayLabel
	{
		border-top:0px;
		font-size:13px;
		left:10px;
		line-height:15px;
		max-height:45px;
		padding-top:0px;
		right:10px;
	}
}

@media (max-width: 1200px)
{
	.sportGroup .divSportRow.auto
	{
		grid-template-columns:repeat(7, 1fr);
	}

	.sportGroup .divSportTile
	{
		width:calc((100% - 120px) / 7);
	}
}

@media (max-width: 1000px)
{
	.sportGroup .divSportRow.auto
	{
		gap:15px;
		grid-template-columns:repeat(6, 1fr);
	}

	.sportGroup .divSportTile
	{
		margin:0px 15px 15px 0px;
		width:calc((100% - 75px) / 6);
	}
}

@media (max-width: 800px)
{
	.sportGroup .divSportContainer
	{
		left:-20px;
		width:calc(100% + 40px);
	}

	.sportGroup .divSportContainer:before, .sportGroup .divSportContainer:after
	{
		width:10px;
	}

	.sportGroup .divSportScroller
	{
		padding:0px 20px;
	}

	.sportGroup .divSportRow.auto
	{
		gap:10px;
		grid-template-columns:repeat(5, 1fr);
	}

	.sportGroup .divSportTile
	{
		margin:0px 10px 10px 0px;
		width:calc((100% - 40px) / 5);
	}

	.sportGroup .divOverlayLabel
	{
		font-size:12px;
		line-height:14px;
		max-height:42px;
	}
}

@media (max-width: 600px)
{
	.sportGroup .btnPrevious, .sportGroup .btnNext
	{
		display:none;
	}

	.sportGroup .divSportContainer
	{
		left:-15px;
		width:calc(100% + 30px);
	}

	.sportGroup .divSportContainer:before, .sportGroup .divSportContainer:after
	{
		width:5px;
	}

	.sportGroup .divSportScroller
	{
		padding:0px 15px;
	}

	.sportGroup .divSportRow:first-child
	{
		margin-top:30px;
	}

	.sportGroup .divTileOverlay
	{
		display:none;
	}
}

@media (max-width: 500px)
{
	.sportGroup .divSportRow.auto
	{
		grid-template-columns:repeat(4, 1fr);
	}
	
	.sportGroup .divSportTile
	{
		width:calc((100% - 30px) / 4);
	}
}

@media (max-width: 420px)
{
	.sportGroup .divSportTile
	{
		width:100px;
	}
}

@media (max-width: 380px)
{
	.sportGroup .divSportRow.auto
	{
		grid-template-columns:repeat(3, 1fr);
	}
	
	.sportGroup .divSportTile
	{
		width:90px;
	}
}