/*
This CSS file contains the CSS needed for the core Hopp GWALIA Match Centre experience;

@package Hopp GWALIA Match Centre
@since 1.0.0
@version 1.0.10

*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
Hub (H)
	H - Live Mode
	H - Hero
	H - Team Info
		H_T - Responsive
		H_T - New Design (Removing Rough Texture)
		H_T - Match Theme
	H - Line-up
	H - Comp Table
	H - Match Info
	H - Preloaders
	H - Notice
	H - Dashboard
	H - FacetWP
		H_F - Results/Fixures
			H_F_RF - Dark Theme
		H_F - Search
		H_F - Radio
		H_F - fSelect
		H_F - Carousel
			H_F_C - Initial Select (Separation Between Fixtures and Results)
			H_F_C - Links (incl. Buttons)
			H_F_C - Match Cards
		H_F - Reset
			H_F_R - Responsive
Plyr (PL)
Bootstrap (BO)
	BO - Float
	BO - Overflow

--------------------------------------------------------------*/
/*--------------------------------------------------------------
Hub (H)
--------------------------------------------------------------*/
/*--------------------------------------------------------------
H - Live Mode
--------------------------------------------------------------*/
#entry-content .gwalia-live-indicator {
	position: absolute;
	top: 0;
	right: 1.5rem;
	bottom: 0;
	margin: auto;
	padding: 0;
	width: 2rem;
	height: 2rem;
}

.gwalia-live-indicator:before,
.gwalia-live-indicator:after {
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	width: 2rem;
	height: 2rem;
	border-radius: 50%;
}

.gwalia-live-indicator:before {
    -webkit-animation: gwalia-pulse 1.7s ease infinite;
    		animation: gwalia-pulse 1.7s ease infinite;
    background: radial-gradient(circle,#fff 37%,hsla(0,0%,100%,.5) 37.5%,transparent 38%);
}

.gwalia-live-indicator:after {
	background: radial-gradient(circle,transparent 53%,hsla(0,0%,100%,.5) 53.5%,#fff 54%);
}

.is-live .gwalia-lf-title {
	position: relative;
	padding-right: 4.2rem;
	position: relative;
}

#entry-content .gwalia-lf-title__is-live,
.is-live #entry-content .gwalia-lf-title__not-live {
	display: none;
}

.is-live #entry-content .gwalia-lf-title__is-live {
	display: block;
}

@-webkit-keyframes gwalia-pulse {
	0% {
		opacity:1
	}
	50% {
		opacity:.3
	}
	to {
		opacity:1
	}
}

@keyframes gwalia-pulse {
	0% {
		opacity:1
	}
	50% {
		opacity:.3
	}
	to {
		opacity:1
	}
}

/*--------------------------------------------------------------
H - Hero
--------------------------------------------------------------*/
.entry-content--hp_gwalia_match_h .wp-block-cover, 
.entry-content--hp_gwalia_match_h .wp-block-cover-image,
.entry-content--dashboard .wp-block-cover, 
.entry-content--dashboard .wp-block-cover-image  {
	min-height: calc(100vh - 94px);
	overflow: hidden;
	padding: 0;
}

@media (min-width: 2500px) {
	.entry-content--hp_gwalia_match_h .wp-block-cover, 
	.entry-content--hp_gwalia_match_h .wp-block-cover-image {
		min-height: 85rem;
	}
}

/*--------------------------------------------------------------
H - Team Info
--------------------------------------------------------------*/
#match-team-logos img {
	max-width: 4.5rem;
	max-height: 4.5rem;
}

#match-team-logos img:first-child {
	margin-right: 1.5rem;
}

#match-meta {
	display: none;
}

#team-info {
	position: relative;
}

.match-hero .wp-block-cover__inner-container {
	margin-top: auto;
	margin-bottom: 4vh;
}

#team-info h2,
#team-info p,
#team-info li {
	color: #fff;
	margin: 0;
}

#home-scorers, 
#away-scorers {
	list-style: none;
	margin: 0;
	padding: 0;
	margin-top: auto;
}

#home-scorers > div, 
#away-scorers > div {
	display: inline-block;
	margin-top: .5rem;
	margin-right: 1.5rem;
}

#match-tournament {
	font-weight: 600;
}

#team-info:before {
	content: "";
    position: absolute;
    width: 167%;
    height: 155%;
    top: -30%;
    right: -70%;
    left: -3rem;
    background-image: url(../img/brush-stroke.svg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: right;
}

#match-time__wrapper {
	display: none;
}

#match-time__wrapper {
	display: none;
}

.is-live #match-time__wrapper {
	display: block;
}

#team-info #match-live-time:not(.preloader--order-3) {
	padding: 0.5rem 1rem;
	background: #FFFFFF;
	border-radius: 1.5rem;
	color: #E31517;
	font-weight: 600;
	position: relative;
}

#team-info #match-live-time .live-text {
	padding-left: 3rem;
	padding-right: 1rem;
}

#team-info #match-live-time:not(.preloader--order-3)::before {
	position: absolute;
	content: "";
	top: calc(50% - 1rem);
	bottom: 0;
	left: 1rem;
	width: 2rem;
	height: 2rem;
	border: 0.3rem solid #E31517;
	border-radius: 999rem;
}

#team-info #match-live-time:not(.preloader--order-3)::after {
	position: absolute;
	content: "";
	top: calc(50% - 0.5rem);
	bottom: 0;
	left: 1.5rem;
	width: 1rem;
	height: 1rem;
	background: #E31517;
	border-radius: 999rem;
	-webkit-animation: gwalia-pulse 1.7s ease infinite;
    		animation: gwalia-pulse 1.7s ease infinite;
}
/*--------------------------------------------------------------
H_T - Responsive
--------------------------------------------------------------*/
@media screen and (min-width: 576px) {
	#team-info:before {
		height: 175%;
		top: -40%;
		left: -14rem;
	}
}

@media (min-width: 768px) {
	.match-hero .wp-block-cover__inner-container {
		margin: 0;
	}
}

@media (min-width: 900px) {
	#team-info:before {
		left: -18rem;
	}
}

@media (min-width: 1200px) {
	#team-info:before {
		left: -25rem;
	}
}

@media screen and (min-width: 2500px) {
	#team-info:before {
		width: 179%;
		left: -35rem;
		background-image: url(../img/brush-stroke-xxl.svg);
	}
}

/*--------------------------------------------------------------
H_T - New Design (Removing Rough Texture)
--------------------------------------------------------------*/
#team-info:before {
	content: none;
}

#team-info > .row {
	min-height: 100% !important; /* Override inline style */
	background: #2C2C2C;
	border-radius: 1rem;
	margin: 0;
}

#team-info > .row > .col {
	padding: 3rem 3rem 1.5rem;
}

/*--------------------------------------------------------------
H_T - Match Theme
--------------------------------------------------------------*/
.is-theme-w #match-h-acc-2 {
	display: none;
}

/*--------------------------------------------------------------
H_T_M - Responsive
--------------------------------------------------------------*/
@media screen and (min-width: 768px) {
	.is-theme-w #team-info > .row > .col {
		padding: 4rem 4rem 2.5rem;
	}
}

/*--------------------------------------------------------------
H - Line-up
--------------------------------------------------------------*/
.match-h-tabs .js-tablist {
	margin: 0;
	padding: 0;
}

.match-h-tabs .js-tablist .col-6 {
	padding-left: .75rem;
}

.match-h-tabs .js-tablist .col-6:first-child {
	padding-right: .75rem;
	padding-left: 1.5rem;
}

.match-h-tabs .js-tablist .js-tablist__link {
	display: block;
	padding: 0.5rem 1.5rem;
	font-weight: 600;
	background: #fff;
	border-radius: 0.8rem 0.8rem 0 0;
	cursor: pointer;
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
}

.match-h-tabs .js-tablist .js-tablist__link[aria-selected=false] {
	background: #E5E5E5;
	color: #2C2C2C;
}

.match-h-tabs .js-tablist .js-tablist__link[aria-selected=false]:hover {
	background: #F0F0F0;
}

.match-h-tabs .js-tablist .js-tablist__link[aria-selected=true] {
	background-image: linear-gradient(90deg, #FFFFFF 0%, #D92E22 49%, #FFFFFF 100%);
	background-repeat: no-repeat;
	background-size: 90% 0.1rem;
	background-position: 50% 100%;
}

.match-h-tabs .js-tabcontent {
	background: #fff;
	border-radius: 0 0 .5rem .5rem;
	padding: 0 1.5rem;
}

#lineups ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

#lineups ul li:not(.js-tablist__item.tabs__item){
	position: relative;
	padding-left: 2.2rem;
}

#lineups ul li span{
	position: absolute;
	left:0;
}

.js-tabcontent[aria-hidden=true] {
	display: none;
}

@media screen and (max-width: 1600px) {
	
	.match-h-tabs .tabs__content .col-xl-6 {
		-ms-flex: 0 0 100%;
		flex: 0 0 100%;
		max-width: 100%;
	}

}


/*--------------------------------------------------------------
H - Comp Table
--------------------------------------------------------------*/
#comp-group-table .col-12 .row {
	margin: 0;
	border-bottom: 0.1rem solid #2C2C2C;
	padding: 0.75rem 0;
}

#comp-group-table .col-12 .row .col-6,
#dashboard-group-table .col-12 .row .col-6,
#dashboard-group-table--headings .col-12 .row .col-6 {
	display: flex;
}

#comp-group-table .col-12 .row .col-6 span,
#dashboard-group-table .col-12 .row .col-6 span,
#dashboard-group-table--headings .col-12 .row .col-6 span {
	overflow: hidden;
	text-overflow: ellipsis;
}

#comp-group-table .col-12 .row > *,
#dashboard-group-table .col-12 .row > *,
#dashboard-group-table--headings .col-12 .row > * {
	padding: 0;
}

#comp-group-table .col-12:first-child .row,
#dashboard-group-table--headings .col-12 .row {
	border-bottom: none;
	font-weight: 600;
	padding-top: 0;
}

#comp-group-table .col-12:last-child .row,
#dashboard-group-table .col-12:last-child .row {
	border-bottom: none;
	padding-bottom: 0;
}

#comp-group-table img,
#dashboard-group-table img {
	max-height: 2rem;
	margin: auto 1rem auto 0;

}

#dashboard-group-table .col-12 .row,
#dashboard-group-table--headings .col-12 .row {
	margin: 0;
	border-bottom: 0.1rem solid #C6C6C6;
	padding: 0.75rem 0;
}


/*--------------------------------------------------------------
H - Match Info
--------------------------------------------------------------*/
#match-info h4,
#match-info p {
	margin-bottom: 1rem;
}

/*--------------------------------------------------------------
H - Preloaders
--------------------------------------------------------------*/
.preloader--order-0 *:not(.preloader),
.preloader--order-1 *:not(.preloader),
.preloader--order-2 *:not(.preloader),
.preloader--order-3 *:not(.preloader) {
	display: none;
}

.preloader--order-0 .preloader,
.preloader--order-1 .preloader,
.preloader--order-2 .preloader,
.preloader--order-3 .preloader {
	display: block;
}

#team-info .preloader--order-0 .preloader.preloader-image,
#team-info #match-live-time.preloader--order-3 .preloader {
	display: inline-block;
}

.preloader--order-1 .preloader * {
	display: block;
}

.preloader {
	position: relative;
	overflow: hidden;
	display: none;
	color: transparent !important;
}

#team-info .preloader.preloader-image {
	width: 4.5rem;
	height: 4.5rem;
	display: none;
	margin-right: 1.5rem;
}

ul.preloader {
	margin: 0;
	padding: 0;
	list-style: none;
}

ul.preloader li {
	color: transparent !important;
}

.preloader:before {
	position: absolute;
	content: "";
	width: 100%;
	height: 90%;
	background: #eee;
	top: 5%;
	left: 0;
	border-radius: 0.3rem;
}

.preloader:after {
	position: absolute;
	content: "";
	width: 10%;
	height: 90%;
	background: linear-gradient(90deg, #eee, #f4f4f4, #eee);
	top: 5%;
	left: 0;
	animation: gwalia-preloader-gradient 1s infinite ease-in-out;
	border-radius: 0.3rem;
}

.preloader.tournament {
	width: 25rem;
}

.preloader.time {
	width: 17rem;
}

.preloader__heading,
.preloader__sub-heading,
.preloader__content {
	margin: 0 1.5rem 1.5rem;
}

.preloader__heading {
	height: 7rem;
	width: 75%;
}

.preloader__sub-heading {
	height: 5rem;
	width: 50%;
}

.preloader__content {
	height: 40rem;
	margin-bottom: 0;
}

.preloader__heading:before,
.preloader__sub-heading:before,
.preloader__content:before,
.preloader__heading:after,
.preloader__sub-heading:after,
.preloader__content:after {
	height: 100%;
	top: 0;
}

#lineups.preloading *:not(.preloader),
#comp-group-table.preloading *:not(.preloader),
#match-info.preloading *:not(.preloader) {
	display: none;
}

#lineups.preloading .preloader,
#comp-group-table.preloading .preloader,
#match-info.preloading .preloader {
	display: block;
}

#comp-group-table .preloader__heading,
#comp-group-table .preloader__sub-heading,
#comp-group-table .preloader__content {
	margin: 0 3rem 1.5rem;
}

#comp-group-table .preloader__content,
#match-info .preloader__content {
	width: 100%;
	margin-bottom: 0;
}

@keyframes gwalia-preloader-gradient {
	0% {
		transform: translateX(0%);
	}
	100% {
		transform: translateX(90%);
	}
}

/*--------------------------------------------------------------
H - Notice
--------------------------------------------------------------*/
.gwalia-notice {
	background: #F5F5F5;
	padding: 2rem 3rem 3rem 1.5rem;
	border-radius: 1rem;
	font-weight: 600;
}

.gwalia-notice__text {
	position: relative;
	padding-left: 3rem;
}

.gwalia-notice__icon {
	width: 2rem;
	height: 2rem;
}

#gwalia-lf .gwalia-notice {
	display: none;
}

#gwalia-lf li:first-child .gwalia-notice {
	display: block;
}

/*--------------------------------------------------------------
H - Dashboard
--------------------------------------------------------------*/
.dashboard #future-matches p,
.dashboard #future-matches h4,
.dashboard #past-matches p,
.dashboard #past-matches h4 {
	margin: 0;
}


/* #future-matches .match-wrapper__middle-row img,
#past-matches .match-wrapper__middle-row img { 
match-wrapper__middle-row img is super specific, why would we need the id? */

.match-wrapper__middle-row img,
.match-wrapper__middle-row img {
	max-width: 3rem;
	max-height: 3.4rem;
	margin: auto;
}

#future-load-more,
#past-load-more {
	display: none;
}

.match-wrapper {
	padding: 2rem;
	margin: 0 0 3rem 0;
	background: #fff;
}

/* Makes positioning "match-wrapper__img" relative to match-wrapper easier. */
.match-wrapper .col-12 {
	position: static;
}

.match-wrapper__img {
	position: absolute;
	top: 0;
	bottom: 0;
	left: -2rem;
	margin: auto;
	width: 10rem;
	/* height: 100%; */
	display: block;
	max-width: 100%;
	z-index: -1;
	opacity: .2;
	filter: grayscale(100%);
	-webkit-transition: .6s -webkit-filter linear;
	   -moz-transition: .6s -moz-filter linear;
	   -moz-transition: .6s filter linear;
		-ms-transition: .6s -ms-filter linear;
		 -o-transition: .6s -o-filter linear;
			transition: .6s filter linear, .6s -webkit-filter linear;
}

a:hover + .match-wrapper__img,
a:active + .match-wrapper__img,
a:focus + .match-wrapper__img {
	filter: grayscale(0);
}

/* Makes positioning "match-wrapper__img" relative to match-wrapper easier. */
.match-wrapper .col-12 {
	position: static;
}

.match-wrapper__img {
	position: absolute;
	top: 0;
	bottom: 0;
	left: -2rem;
	margin: auto;
	width: 10rem;
	/* height: 100%; */
	display: block;
	max-width: 100%;
	z-index: -1;
	opacity: .2;
	filter: grayscale(100%);
	-webkit-transition: .6s -webkit-filter linear;
	   -moz-transition: .6s -moz-filter linear;
	   -moz-transition: .6s filter linear;
		-ms-transition: .6s -ms-filter linear;
		 -o-transition: .6s -o-filter linear;
			transition: .6s filter linear, .6s -webkit-filter linear;
}

a:hover + .match-wrapper__img,
a:active + .match-wrapper__img,
a:focus + .match-wrapper__img {
	filter: grayscale(0);
}

.match-wrapper h4 {
	font-weight: 400;
	font-size: 1.4rem;
}

.has-black-grey-background-color .gwalia-results-fixtures > .row > div h3 {
	color: #fff;
	font-size: 2.4rem;
}

.dashboard-table-wrapper {
	padding: 3rem;
	background: #F7F7F7;
	box-shadow: 0 0 0.5rem #00000029;
}

.team-info--dashboard__link {
	background: #0F0B0C;
	border: 2px solid #FFFFFF;
	border-radius: 0.5rem;
	padding: 1rem 2rem;
	color: #fff;
	font-weight: 600;
}

.team-info--dashboard__link:hover,
.team-info--dashboard__link:active,
.team-info--dashboard__link:focus {
	color: #0F0B0C;
	background: #fff;
}

.cta__wrapper {
	position: relative;
	overflow: hidden;
	box-shadow: 0 0 0.5rem #00000029;
	border-radius: 0.5rem;
	padding: 1.5rem;
}

.match-wrapper__middle-row > .col {
	-ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
}

.match-wrapper p.is-style-gwalia-h6 {
    overflow: hidden;
    text-overflow: ellipsis;
}

.form--email__wrapper {
	box-shadow: 0 0 0.5rem #00000029;
	border-radius: 0.5rem;
	padding: 2rem;
	background-image: url(../img/background-dragon.svg);
    background-size: 120%;
    background-repeat: no-repeat;
    background-position: 30px 0;
}

input[type="email"].dashboard__email {
	box-shadow: 0 0 0.5rem #00000029;
	border-radius: 0.5rem;
}

@media screen and (max-width: 330px) {
	.match-wrapper__middle-row > .col {
		text-align: center !important;
	}

	.match-wrapper__middle-row > .col,
	.match-wrapper__middle-row > .col-auto {
		margin-bottom: 1.5rem;
		padding: 0;
	}

	.match-wrapper__middle-row > .col.text-left {
		margin: 0;
	}
}

@media screen and (min-width: 331px) {
	.match-wrapper__middle-row > .col {
		-ms-flex-preferred-size: 0;
		flex-basis: 0;
		-ms-flex-positive: 1;
		flex-grow: 1;
		max-width: 100%;
	}
}

@media screen and (min-width: 768px) {
	.form--email__wrapper,
	.cta__wrapper {
		padding: 3rem;
	}

	.has-black-grey-background-color .gwalia-results-fixtures > .row > div h3 {
		font-size: 3.5rem;
	}
}

/*--------------------------------------------------------------
H - FacetWP
--------------------------------------------------------------*/
#gwalia-match-grid {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	margin-right: -15px;
	margin-left: -15px;
}

.is-grid .gwalia-res__sidebar {
	top: 0;
	z-index: 999;
	background: #fff;
}

.facetwp-facet {
	margin-bottom: 0 !important;
}

.heading-fixture ~ .heading-fixture,
.heading-result ~ .heading-result,
.facetwp-selections [data-facet="gwalia_results_fixtures"] {
	display: none;
}

/* Replicating h2 styles */
.facetwp-facet-gwalia_results_fixtures .fs-label-wrap,
.facetwp-facet-gwalia_results_fixtures.facetwp-type-radio .facetwp-radio {
	font-family: ff-good-headline-web-pro, sans-serif;
	font-weight: 400;
	font-style: normal;
	margin-bottom: 0;
    border: 0;
}

/*--------------------------------------------------------------
H_F - Results/Fixures
--------------------------------------------------------------*/
#gwalia-match-carousel {
    opacity: 0;
	transition: all 0.2s;
	max-height: 33rem;
}

#gwalia-match-carousel.flickity-enabled {
	opacity: 1;
	height: auto;
}

/* Needed delay on animation, as it still took a while to select after loading */
#gwalia-results-fixtures.is-grid .gwalia-res__sidebar,
#gwalia-results-fixtures.is-grid .facetwp-template {
	opacity: 0;
	transition: all 0.2s 0.6s;
}

#gwalia-results-fixtures.is-grid.show .gwalia-res__sidebar,
#gwalia-results-fixtures.is-grid.show .facetwp-template {
	opacity: 1;
}

#gwalia-results-fixtures .facetwp-load-more:before,
#gwalia-results-fixtures .facetwp-load-more:after {
	content: none;
}

/* Year facet not needed when showing fixtures */
.is-fixtures + #gwalia-year-facet__col {
	display: none;
}

#gwalia-results-fixtures .is-live .match-wrapper::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 0.75rem;
	background: #D92E22;
}

#gwalia-results-fixtures .is-live h4.is-style-gwalia-h6 span {
	opacity: 1;
	color: #D92E22;
	transition: opacity 0.2s ease-in-out;
	position: relative;
}

#gwalia-results-fixtures .is-live h4.is-style-gwalia-h6 span.getting-live-time {
	opacity: 0;
}

#gwalia-results-fixtures .is-live h4.is-style-gwalia-h6 span::before {
	position: absolute;
    content: "";
    top: calc(50% - 0.8rem);
    bottom: 0;
    left: -2.5rem;
    width: 1.6rem;
    height: 1.6rem;
    border: 0.2rem solid #E31517;
    border-radius: 999rem;
}

#gwalia-results-fixtures .is-live h4.is-style-gwalia-h6 span::after {
	position: absolute;
    content: "";
    top: calc(50% - 0.4rem);
    bottom: 0;
    left: -2.1rem;
    width: 0.8rem;
    height: 0.8rem;
    background: #E31517;
    border-radius: 999rem;
	-webkit-animation: gwalia-pulse 1.7s ease infinite;
    		animation: gwalia-pulse 1.7s ease infinite;
}

@media screen and (min-width: 331px) {
	#gwalia-match-carousel {
		opacity: 0;
		transition: all 0.2s;
		max-height: 26rem;
	}
}

@media screen and (min-width: 331px) {
	#gwalia-match-carousel {
		opacity: 0;
		transition: all 0.2s;
		max-height: 26rem;
	}
}

@media screen and (max-width: 340px) {
	/* No need for padding because counter is hidden */
	.facetwp-facet-gwalia_results_fixtures span.facetwp-display-value {
		padding-right: 0;
	}

	.facetwp-facet-gwalia_results_fixtures .facetwp-counter {
		display: none;
	}
}

@media (min-width: 1200px) {
	#gwalia-comp-facet__col.is-fixtures {
		-ms-flex: 0 0 41.666667%;
		flex: 0 0 41.666667%;
		max-width: 41.666667%;
	}
}

/*--------------------------------------------------------------
H_F_RF - Dark Theme
--------------------------------------------------------------*/
.gwalia-results-fixtures--dark h3,
.gwalia-results-fixtures--dark h2,
.gwalia-results-fixtures--dark .carousel-heading {
	color: #fff;
}

.gwalia-results-fixtures--dark .carousel-heading .flickity-icon {
	fill: #fff;
}


/*--------------------------------------------------------------
H_F - Search
--------------------------------------------------------------*/
.gwalia-results-fixtures .facetwp-facet input.facetwp-search {
	border-radius: 0.5rem;
    border: 0;
    background-color: #F1F1F1;
	padding: 1rem 8rem 1rem 2rem;
	line-height: normal;
	background: #FFFFFF 0% 0% no-repeat padding-box;
	box-shadow: 0px 0px 5px #00000029;
}

.gwalia-results-fixtures .facetwp-facet.facetwp-type-search .facetwp-icon {
	height: 100%;
    width: 4rem;
    position: absolute;
    border: 0;
    border-radius: 0 0.5rem 0.5rem 0 ;
    background: none;
	opacity: 1;
	right: 0.3rem;
	transition: opacity 0.1s ease-in-out;
}

.gwalia-results-fixtures .facetwp-facet.facetwp-type-search .facetwp-input-wrap {
	margin: 0;
}

.gwalia-results-fixtures .facetwp-facet.facetwp-type-search .facetwp-icon::before {
	width: 4rem;
	background-size: 1.6rem 1.6rem;
}

.gwalia-results-fixtures .facetwp-facet.facetwp-type-search .facetwp-icon:not(.f-loading):before {
	background-image: url(../img/search-icon.svg);
}

#facetwp-search-clear {
	position: absolute;
	top: -0.1rem;
	bottom: 0;
	right: 3rem;
	margin: auto;
	border: 0;
	text-indent: -999rem;
	background: none;
	width: 1.4rem;
	height: 1.4rem;
	opacity: 0;
	transition: opacity 0.1s ease-in-out;
	visibility: hidden;
}

.facetwp-type-search.is-searching ~ #facetwp-search-clear {
	visibility: visible;
	opacity: 1;
}

.facetwp-type-search.is-searching .facetwp-icon {
	opacity: 0;
	visibility: hidden;
}

#facetwp-search-clear svg {
	position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    pointer-events: none;
	width: 1.2rem;
	height: 1.2rem;
}


/*--------------------------------------------------------------
H_F - Radio
--------------------------------------------------------------*/
.gwalia-res__tabs__wrapper {
	background: #EAEAEA;
	border-radius: 0.5rem;
	overflow: hidden;
}

.facetwp-facet-gwalia_results_fixtures.facetwp-type-radio .facetwp-radio {
	display: inline-block;
	margin: 0.3rem 0 0.3rem 0.3rem;
	padding: 0.2rem 0;
	font-size: 1.8rem;
	background: none;
	position: relative;
	width: calc(50% - 0.3rem);
	text-align: center;
	border-radius: 0.3rem;
}

.facetwp-facet-gwalia_results_fixtures.facetwp-type-radio .facetwp-radio:last-child {
	margin: 0.3rem 0.3rem 0.3rem 0;
}

.facetwp-facet-gwalia_results_fixtures.facetwp-type-radio .facetwp-radio .facetwp-counter {
	display: none;
}

.facetwp-facet-gwalia_results_fixtures.facetwp-type-radio .facetwp-radio.checked {
	color: #D92E22;
	background: #fff;
	font-weight: 600;
	pointer-events: none;
}

/*--------------------------------------------------------------
H_F - fSelect
--------------------------------------------------------------*/
.gwalia-results-fixtures .fs-wrap {
	width: 100%;
	text-overflow: ellipsis;
}

.gwalia-results-fixtures .facetwp-type-fselect .fs-label-wrap {
	cursor: pointer;
}

.gwalia-results-fixtures .facetwp-type-fselect {
	line-height: 1;
}

.gwalia-results-fixtures .fs-label-wrap .fs-label {
	padding: 0 3rem 0 0;
}

.gwalia-results-fixtures .facetwp-type-fselect .fs-wrap .fs-search input {
	padding-left: 0.2rem;
	line-height: normal;
}

.gwalia-results-fixtures .facetwp-type-fselect .fs-options {
	margin-top: 1.5rem;
}

.gwalia-results-fixtures .facetwp-type-fselect .fs-option,
.gwalia-results-fixtures .facetwp-type-fselect .fs-no-results,
.gwalia-results-fixtures .facetwp-type-fselect .fs-search {
	padding: 1.5rem;
}

.gwalia-results-fixtures .facetwp-type-fselect .fs-search {
	border-radius: 0.4rem;
	margin: 0 1.5rem;
}

.gwalia-results-fixtures .facetwp-type-fselect .fs-option:hover,
.gwalia-results-fixtures .facetwp-type-fselect .fs-option:active,
.gwalia-results-fixtures .facetwp-type-fselect .fs-option:focus {
	background: #EAEAEA;
}

.gwalia-results-fixtures .facetwp-type-fselect .fs-wrap.single .fs-option.selected {
	color: #fff;
	background: #e5231b;
}

.gwalia-results-fixtures .fs-dropdown {
	padding-top: 1.5rem;
	border-radius: 1rem;
	box-shadow: 0px 0px 0.5rem #00000029;
	width: 30rem;
}

.gwalia-results-fixtures .fs-label-wrap,
.gwalia-results-fixtures .fs-dropdown {
	background: #FFFFFF 0% 0% no-repeat padding-box;
	box-shadow: 0px 0px 5px #00000029;
	border-radius: 5px;
	border: 0;
}

.gwalia-results-fixtures .fs-label-wrap .fs-label {
	padding: 1rem 3rem 1rem 2rem;
}

.gwalia-results-fixtures.is-carousel .fs-label-wrap .fs-label {
	padding: 1.1rem 3rem 1.2rem 2rem;
}

.gwalia-results-fixtures .fs-dropdown {
	width: 100%;
	top: 145%;
}

.gwalia-results-fixtures .fs-arrow {
	background-image: url(../img/dropdown-arrow.svg);
    background-size: cover;
    background-repeat: no-repeat;
	border: none;
	width: 1.8rem;
	height: 1.8rem;
	right: 2rem;
	transition: none;
}

.gwalia-results-fixtures .facetwp-type-fselect.is-loading .fs-arrow {
	background-image: none;
}

.gwalia-results-fixtures .facetwp-type-fselect.is-loading .fs-arrow::after,
.gwalia-results-fixtures .facetwp-facet.facetwp-type-search .facetwp-icon.f-loading::before {
	content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    width: 2rem;
    height: 2rem;
    background: none;
    border: solid 0.2rem transparent;
    border-top-color: currentColor;
    border-left-color: currentColor;
    border-radius: 999rem;
    opacity: 1;
    transition: opacity 0.2s ease-in-out;
    animation: posts-loading 400ms linear infinite;
}

.gwalia-results-fixtures .facetwp-type-fselect .fs-option:last-child {
	margin-bottom: 1.5rem;
}

@media screen and (max-width: 991px) and (min-width: 576px) {

	#gwalia-results-fixtures .facetwp-type-fselect .fs-wrap,
	#gwalia-results-fixtures .fselect-col,
	#gwalia-results-fixtures .facetwp-type-fselect {
		position: unset;
	}

	#gwalia-results-fixtures .fs-dropdown {
		width: calc( 100% - 3rem );
		left: 1.5rem;
		top: 50%;
	}

}

@media screen and (min-width: 576px) and (max-width: 1200px) {

	#gwalia-results-fixtures #gwalia-team-facet__col {
		padding-right: 0.75rem !important;
	}

	#gwalia-results-fixtures #gwalia-comp-facet__col {
		padding-left: 0.75rem !important;
	}
	
}

@media screen and (min-width: 1200px) {

	.gwalia-results-fixtures .fs-dropdown {
		width: 35rem;
	}

}

/*--------------------------------------------------------------
H_F - Carousel
--------------------------------------------------------------*/
#gwalia-match-carousel {
	padding-bottom: 6rem;
}

.is-carousel .flickity-enabled {
	padding: 0;
}

.is-carousel .carousel-cell {
	animation: gwalia-search-slide-in .5s both;
}

div.is-carousel .carousel-cell > div { /* div.is-carousel used to override inline style */
	margin: 0;
}

.is-carousel .is-load-more + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) {
	animation-delay: .15s;
}

.is-carousel .is-load-more + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) {
	animation-delay: .3s;
}

.is-carousel .is-load-more + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) {
	animation-delay: .45s;
}

.is-carousel .is-load-more + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) {
	animation-delay: .6s;
}

.is-carousel .is-load-more + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) {
	animation-delay: .75s;
}

.is-carousel .is-load-more + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) {
	animation-delay: .9s;
}

.is-carousel .is-load-more + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) {
	animation-delay: 1.05s;
}

.is-carousel .is-load-more + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) {
	animation-delay: 1.2s;
}

.is-carousel .is-load-more + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) {
	animation-delay: 1.35s;
}

.is-carousel .is-load-more + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) + .carousel-cell:not(.is-load-more) {
	animation-delay: 1.5s;
}

.is-carousel .facetwp-type-pager {
	display: none;
}

.is-carousel .carousel-cell.is-load-more {
	display: none !important;
}

.is-carousel .carousel-cell.is-load-more:last-child {
	display: flex !important;
}

.is-load-more .carousel-cell__wrap__padding-offset {
	position: relative;
}

.is-load-more-wrap {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	height: 100%;
	text-align:center;
}

.is-load-more-wrap:before {
    content: '';
    display: inline-block;
    height: 100%;
    vertical-align: middle;
}

.carousel-pseudo-load {
    display: inline-block;
    vertical-align: middle;
}

.carousel-pseudo-load:before {
	position: absolute;
	content: '';
	width: 100%;
	height: 100%;
	transform: none;
	top: 0;
	left: 0;
}

.is-load-more {
	height: 100%;
}

.is-load-more .preloader,
.carousel-placeholder .preloader,
.grid-placeholder .preloader {
	display: block;
}

.container-carousel-inner {
	position: relative;
}

.grid-placeholder {
	position: absolute;
	width: 100%;
	top: 9rem;
}

.is-load-more .match-wrapper p.is-style-gwalia-h6,
.carousel-placeholder .match-wrapper p.is-style-gwalia-h6,
.grid-placeholder .match-wrapper p.is-style-gwalia-h6 {
	color: #eee;
}

#gwalia-results-fixtures.is-grid .grid-placeholder {
	opacity: 1;
	transition: all 0.2s 0.6s;
}

#gwalia-results-fixtures.is-grid.show .grid-placeholder {
	opacity: 0;
	z-index: -1;
}

.is-load-more .is-duplicate {
	position: absolute;
	top: 0;
	width: 100%;
	height: 100%;
	left: calc(-100% + -1.5rem);
	opacity: .8;
}

.is-load-more .is-duplicate + .is-duplicate {
	left: calc(-200% + -4.5rem);
	opacity: .6;
}

.is-load-more .is-duplicate + .is-duplicate + .is-duplicate {
	left: calc(-300% + -7.5rem);
	opacity: .4;
}

.is-load-more .is-duplicate + .is-duplicate + .is-duplicate + .is-duplicate {
	left: calc(-400% + -10.5rem);
	opacity: .2;
}

.is-load-more--fixtures .is-duplicate {
	left: calc(100% + 1.5rem);
}

.is-load-more--fixtures .is-duplicate + .is-duplicate {
	left: calc(200% + 4.5rem);
}

.is-load-more--fixtures .is-duplicate + .is-duplicate + .is-duplicate {
	left: calc(300% + 7.5rem);
}

.is-load-more--fixtures .is-duplicate + .is-duplicate + .is-duplicate + .is-duplicate {
	left: calc(400% + 10.5rem);
}

.is-carousel .flickity-button {
	transform: none;
}

.carousel-placeholder {
	position: absolute;
    min-height: 27rem;
    width: 100%;
    top: 0;
	opacity: 1;
	transition: all 0.2s;
}

.carousel-placeholder > .row > div {
	min-height: 27rem;
	padding-bottom: 6rem;
} 

#gwalia-match-carousel.flickity-enabled + .carousel-placeholder {
	opacity: 0;
	z-index: -1;
}

.carousel-placeholder [data-match-id] {
	position: absolute;
    left: -100%;
    max-width: 100%;
	height: 100%;
	padding-bottom: 6rem;
}

.carousel-placeholder [data-match-id] + [data-match-id] {
	left: 0;
}

.carousel-placeholder [data-match-id] + [data-match-id] + [data-match-id] {
	left: 100%;
}

.carousel-placeholder [data-match-id] + [data-match-id] + [data-match-id] + [data-match-id] {
	left: 200%;
}

.carousel-placeholder [data-match-id] + [data-match-id] + [data-match-id] + [data-match-id] + [data-match-id] {
	left: 300%;
}

.carousel-placeholder [data-match-id] + [data-match-id] + [data-match-id] + [data-match-id] + [data-match-id] + [data-match-id] {
	left: 400%;
}

#gwalia-results-fixtures .hopp-blocks-main-carousel.carousel-3-cards .flickity-slider > div {
	width: 75%;
}

@media screen and (min-width: 331px) {

	#gwalia-results-fixtures .hopp-blocks-main-carousel.carousel-3-cards .flickity-slider > div {
		width: 95%;
	}

}

@media screen and (min-width: 440px) {

	#gwalia-results-fixtures .hopp-blocks-main-carousel.carousel-3-cards .flickity-slider > div {
		width: 75%;
	}

}

@media screen and (min-width: 768px) {

	#gwalia-results-fixtures .hopp-blocks-main-carousel.carousel-3-cards .flickity-slider > div {
		width: 50%;
	}

}

@media screen and (min-width: 1200px) {

	#gwalia-results-fixtures .hopp-blocks-main-carousel.carousel-3-cards .flickity-slider > div {
		width: 33.3%;
	}

}

/*--------------------------------------------------------------
H_F_C - Initial Select (Separation Between Fixtures and Results)
--------------------------------------------------------------*/
.carousel-cell + .is-initial-select {
	margin-right: 3rem;
}

.is-initial-select ~ .is-initial-select {
	margin-right: 0;
}

.carousel-cell + .is-initial-select:before {
	content: '';
	position: absolute;
	top: 0;
	bottom: 6rem;
	right: -1.5rem;
	margin: auto;
	width: 0.1rem;
	height: 40%;
	border: 0.1rem solid #ccc;
}

.is-initial-select ~ .is-initial-select:before {
	content: none;
}

.flickity-icon {
	width: 2rem;
}

.carousel-heading {
	position: absolute;
	z-index: 99;
	bottom: 100%;
	right: -13rem;
	display: none;
}

.carousel-cell + .carousel-cell .carousel-heading {
	display: flex;
}

.is-initial-select ~ .is-initial-select .carousel-heading {
	display: none;
}

.gwalia-results-fixtures.is-carousel {
	overflow: hidden;
}

.gwalia-results-fixtures .hopp-blocks-main-carousel {
	overflow: visible;
}

.gwalia-results-fixtures .hopp-blocks-main-carousel .container {
	position: relative;
}

/*--------------------------------------------------------------
H_F_C - Links (incl. Buttons)
--------------------------------------------------------------*/
.gwalia-results-fixtures .hopp-blocks-main-carousel .flickity-prev-next-button {
    margin-left: auto;
    margin-right: 12rem;
}

.gwalia-results-fixtures .hopp-blocks-main-carousel .flickity-prev-next-button.previous {
    margin-left: auto;
    margin-right: 0;
}

/*--------------------------------------------------------------
H_F_C - Match Cards
--------------------------------------------------------------*/
#gwalia-match-carousel.flickity-enabled .flickity-slider > div {
	min-width: 24rem;
	display: flex; /* @link https://github.com/metafizzy/flickity/issues/534#issuecomment-645257493 */
	align-items: stretch;
	min-height: 33rem;
	padding-bottom: 6rem;
}

.is-carousel .carousel-cell__wrap__padding-offset {
	height: 100%;
}

.is-carousel .carousel-cell__wrap [data-match-id] {
	padding: 0;
	width: 100%;
	display: block;
	max-width: 100%;
	height: 100%;
}

.is-carousel .match-wrapper {
	margin: 0;
	height: 100%;
	-ms-flex-align: center !important;
		align-items: center !important;
}

@media screen and (min-width: 331px) {

	#gwalia-match-carousel.flickity-enabled .flickity-slider > div {
		min-height: 26rem;
	}

}

/*--------------------------------------------------------------
H_F - Reset
--------------------------------------------------------------*/
#gwalia-reset-facet__col {
	display: none;
}

#gwalia-vid-search ~ * #gwalia-reset-facet__col {
	display: block;
}

#gwalia-vid-search ~ * #gwalia-search-facet__col {
	-ms-flex: 0 0 75%;
    flex: 0 0 75%;
    max-width: 75%;
}

#gwalia-reset-facet__col button {
	position: relative;
	height: 3.8rem;
	width: 100%;
	box-shadow: 0 0 0.5rem #00000029;
	padding: 0;
}

#gwalia-reset-facet__col button svg {
	position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    pointer-events: none;
    width: 2.5rem;
    height: 2.5rem;
	fill: currentColor;
	transform: rotate(-45deg);
	transition: transform 0.2s ease;
}

#gwalia-reset-facet__col button:hover svg,
#gwalia-reset-facet__col button:active svg,
#gwalia-reset-facet__col button:focus svg {
	transform: rotate(145deg);
}

/*--------------------------------------------------------------
H_F_R - Responsive
--------------------------------------------------------------*/
/* Adjust Search columns so it grows/shrinks depending of it there's a reset button */
@media screen and (min-width: 576px) {
	#gwalia-vid-search ~ * #gwalia-search-facet__col {
		-ms-flex: 0 0 83.333333%;
		flex: 0 0 83.333333%;
		max-width: 83.333333%;
	}
}

@media screen and (min-width: 1200px) {
	#gwalia-vid-search ~ * #gwalia-search-facet__col {
		-ms-flex: 0 0 33.333333%;
		flex: 0 0 33.333333%;
		max-width: 33.333333%;
	}
}

/*--------------------------------------------------------------
Plyr (PL)
--------------------------------------------------------------*/
.plyr {
	--plyr-color-main: #f4241d;
	--plyr-badge-background: #fff;
	--plyr-video-control-color-hover: #fff;
}

.player .vp-controls .play {
	color: #F4241D;
}

.plyr input[type="range"]:focus {
	color: #fff;
}

/*--------------------------------------------------------------
Bootstrap (BO)
--------------------------------------------------------------*/
/*--------------------------------------------------------------
BO - Float
--------------------------------------------------------------*/
.float-left {
	float: left !important;
}

.float-right {
	float: right !important;
}

/*--------------------------------------------------------------
BO - Overflow
--------------------------------------------------------------*/
.overflow-hidden {
	overflow: hidden !important;
}

.overflow-visible {
	overflow: visible !important;
}
  
@media (min-width: 576px) {
	.overflow-sm-hidden {
		overflow: hidden !important;
	}
	.overflow-sm-visible {
		overflow: visible !important;
	}
}
  
@media (min-width: 768px) {
	.overflow-md-hidden {
		overflow: hidden !important;
	}
	.overflow-md-visible {
		overflow: visible !important;
	}
	.overflow-md-center {
		text-align: center !important;
	}
}
  
@media (min-width: 992px) {
	.overflow-lg-hidden {
		overflow: hidden !important;
	}
	.overflow-lg-visible {
		overflow: visible !important;
	}
}
  
@media (min-width: 1200px) {
	.overflow-xl-hidden {
		overflow: hidden !important;
	}
	.overflow-xl-visible {
		overflow: visible !important;
	}
}