@charset "UTF-8";
/* CSS Document */

/* SFP CLUB / SQUAD STATS */

.sfp-page-wrap-dark-cards {
	display: flex;		
	flex-direction: column;
	max-width: 100%;
	align-items: left;
	color: #f0e8e3;
	background-color:#0A0B60; 
	overflow:visible;
	padding: 0px 0px 20px;
	border-radius: 10px;
	border: 0px solid #6EEAE7;
	margin: 20px 0px;
}
.sfp-page-wrap-transparent-cards {
	display: flex;		
	flex-direction: row;
	max-width: 100%;
	align-items: center;
	color: #f0e8e3;
	background-color:none; 
	overflow:visible;
	padding: 15px;
	padding-bottom: 15px;
	border-radius: 10px;
	border: 0px solid #6EEAE7;
	margin: 20px 0px;
}

.sfp-page-wrap-dark {
    display: flex;
	max-width: 950px;
    align-items: center;
    color: #f0e8e3;
	background-color:#0A0B60; 
	overflow:auto; 
    padding: 15px;
    border-radius: 10px;
    margin: 20px 0px;
	}
.sfp-page-wrap-light-row {
    display: flex;
	flex-direction: row;
	justify-content: center;
	max-width: 950px;
    align-items: center;
    color: #0D3BFF;
	background-color:#fff; 
	overflow:auto; 
    padding: 15px;
    border-radius: 10px;
    margin: 20px 0px;
	}
/* sfp stats trumps*/

.sfp-squad-stats-header {
	font-family: getvoip_grotesqueregular;
	text-transform: uppercase;
	text-align: center;
	color: #9190B8;
	margin-bottom: 10px;
	}
.sfp-container-squad-stats-row {
	display: flex;
	justify-content: center;
	width: 100%;
	flex-direction: row;
	text-align: center;
	background-color: none;
}
.squad-stat-block-left {
	display: flex;
	flex-direction: row;
	width: 60%;
	background-color: none;
}
.squad-stat-block-right {
	display: flex;
	flex-direction: row;
	width: 40%;
	color: #FF01FE;
	background-color: none;
}
.sfp-container-squad-stats {
	display: flex;
	justify-content: center;
	flex-direction: column;
	text-align: center;
	align-self: stretch;
	width: 50%;
	padding: 10px;
	margin: 2px;
	border-radius: 0px;
	font-weight: 700;
	line-height: 19px;
	background-color: none;
}
.sfp-container-squad-stats-percentage {
	display: flex;
	justify-content: center!important;
	flex-direction: column;
	text-align: center!important;
	align-self: stretch;
	width: 33%;
	padding: 10px;
	margin: 2px;
	border-radius: 0px;
	color: #0D3BFF;
	font-weight: 700;
	line-height: 19px;
	background-color: none;
}
.percentage-circle-center {
	align-self: center;	
	}	
.animated-number-counter, .non-animated-number-counter {
	color: #0D3BFF;
	font-weight: 700;
	font-size: 60px;
	padding: 25px;
	margin: auto;
	background-color: none;
}

	
/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 990px) {
.sfp-container-squad-stats-row {
	flex-direction: column;
}
.sfp-container-squad-stats-percentage {
	width: 93%;
}
.squad-stat-block-left {
	width: 100%;
}
.squad-stat-block-right {
	width: 100%;
}
}
/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
.squad-stat-block-left {
	flex-direction: column;
}
.sfp-container-squad-stats-percentage {
	width: 95%;
}
.animated-number-counter, .non-animated-number-counter {
	font-size: 40px;
	padding: 25px;
	margin: auto;
	background-color: none;
}
}

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {...}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {...}

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {...}

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {...}


/* STATS Days Since Top */
	.sfp-days-since-top {
		padding: 60px 0px 80px 0px;
		display: flex;
		flex-direction: column;
		align-items: center;
		text-align: center;
		font-family: "PT Sans", sans-serif;
		color: #fff;
		text-transform: uppercase;
		font-size: 36px;
		line-height: 40px;
		letter-spacing: 2px;
	}
	.sfp-days-counter {
		padding-bottom: 30px;
		font-family: "PT Sans", sans-serif;
		color: #fff;
		text-transform: uppercase;
		font-size: 100px;
		line-height: 100px;
		letter-spacing: 2px;
	}

/* END STATS Days Since Top */


/* SFP CLUB / MANAGER STATS CARDS */
.sfp-cards-row {
	display: flex;
	flex-direction: row;
	overflow-x: auto;
	padding-left: 20px;
	}

.sfp-container-stats {
	display: flex;
	flex-direction: column;
	align-self: stretch;
	margin: 20px;
	min-width: 200px;
	padding: 20px;
	border-radius: 10px;
	font-size: 17px;
	font-weight: 200;
	line-height: 19px;
	background-color: #f3f3f3;
	box-shadow: 6px 6px 20px #00000090;
}
.sfp-container-stats-manager {
	display: flex;
	flex-direction: column;
	align-self: stretch;
	margin: 20px;
	min-width: 240px;
	padding: 20px;
	border-radius: 10px;
	font-size: 17px;
	font-weight: 200;
	line-height: 19px;
	background-color: #f3f3f3;
	box-shadow: 6px 6px 20px #00000090;
}
.sfp-container-stats::-webkit-scrollbar {
  display: none;
}
/* sfp top trumps*/
img.sfp-stats {
	border: 4px solid #fff;
}
img.sfp-stats-badge {
	width: 200px;
	align-self: center;
}
img.sfp-stats-manager {
	width: 100%;
	align-self: center;
	border: 6px solid #fff;
}
img.sfp-stats-subbuteo {
	width: 150px;
	align-self: center;
}
img.sfp-stats-badge-small {
	width: 60px;
	align-self: center;
}
img.sfp-stats-players {
	width: 250px;
	align-self: center;
	border: 6px solid #fff;
}
.rival {
	background-color: #030B80;
}
.sfp-container-stats-title {
	display: flex;
	flex-direction: column;
	color: #fff;
	padding: 4px 30px;
	border-radius: 0px 40px 40px 0px;
	margin: 10px -10px 0px -20px;
	background-image: linear-gradient(to bottom right, #050091 , #4A0187);
}
/*image only block - stretch vertically*/
.sfp-container-stats-image {
	display: flex;
	height:100%;
	align-self: stretch;
	justify-content: center;
}

.sfp-container-stats-category {
	display: flex;
	flex-direction: row;
	color: #000;
	text-transform: capitalize;
	margin: 10px -20px 0px 0px;
	border-radius: 10px 0px 0px 10px;
	background-color: #fff;
}
.sfp-stats-category-left {
	width:80%;
	padding: 4px 10px;
	text-align: left;
}
.sfp-stats-category-right {
	width:20%;
	padding: 4px 20px;
	text-align: center;
}
.sfp-container-stats-footer {
	display: flex;
	flex-direction: column;
	margin-top: 10px;
	padding: 4px 6px;
	border-radius: 20px;
	color: #000;
	text-align: center;
	font-size: 13px;
	font-weight: 500;
	line-height: 15px;
	background-color: #fff;
}
.sfp-container-stats-category-honours {
	display: flex;
	flex-direction: row;
	color: #fff;
	text-transform: capitalize;
	margin: 10px -20px 0px 0px;
	border-radius: 10px 0px 0px 10px;
	background-image: linear-gradient(to bottom right, #050091 , #4A0187);
}
/* remove-horizontal-scroll-bar-on-mobile */
::-webkit-scrollbar {
display: none;
}

@media only screen and (max-width: 960px) {
	}
@media only screen and (max-width: 640px) {
.sfp-container-stats {
	margin: 10px;
	min-width: 175px;
	padding: 10px;
	border-radius: 5px;
	font-size: 14px;
	font-weight: 200;
	line-height: 12px;
	background-color: none;
	box-shadow: 3px 3px 10px #00000090;
}
.sfp-container-stats-manager {
	margin: 10px;
	min-width: 135px;
	padding: 10px;
	border-radius: 5px;
	font-size: 10px;
	font-weight: 200;
	line-height: 11px;
	background-color: none;
	box-shadow: 3px 3px 10px #00000090;
}
.sfp-container-stats::-webkit-scrollbar {
  display: none;
}
.sfp-container-stats-title {
	padding: 3px 10px;
	border-radius: 0px 20px 20px 0px;
	margin: 5px -5px 0px -10px;
}
.sfp-container-stats-category,
.sfp-container-stats-category-honours {
	margin: 5px -10px 0px 0px;
	border-radius: 10px 0px 0px 10px;
}
.sfp-stats-category-left, .sfp-stats-category-right {
	padding: 3px 10px;
}
.sfp-container-stats-footer {
	margin-top: 8px;
	padding: 3px 3px;
	border-radius: 20px;
	font-size: 12px;
	line-height: 8px;
}
img.sfp-stats-subbuteo {
	width: 75%;
}

h3 {
	font-size: 19px;
	text-transform: uppercase!important;
	text-align: center!important;
}
}

/* HIGH CHARTS WRAPPER */

#season-progress-chart {
	padding: 60px 0px 20px;
}
#career-progress-chart {
	padding: 60px 0px 20px;
}


/* END HIGH CHARTS WRAPPER */


/* HONOURS TROPHY ICON */
img.sfp-stats-honour {
	padding: 15px 0px 0px;
	width: 40px;
	align-self: center;
}
/* END HONOURS TROPHY ICON */


/* sfp top trumps*/

.sfp-container-top-trumps {
	display: flex;
	flex-direction: column;
	align-self: stretch;
	margin: 20px;
	width: 250px;
	padding: 20px;
	border-radius: 10px;
	font-size: 17px;
	font-weight: 200;
	line-height: 19px;
	background-color: #f3f3f3;
	box-shadow: 6px 6px 20px #00000090;
}
	
img.sfp-top-trump {
	width: 250px;
	border: 4px solid #fff;
}
img.sfp-top-trump-badge {
	width: 170px;
	align-self: center;
}
.sfp-container-top-trump-title {
	display: flex;
	flex-direction: column;
	color: #fff;
	padding: 4px 30px;
	border-radius: 0px 40px 40px 0px;
	margin: 10px -10px 0px -20px;
	background-image: linear-gradient(to bottom right, #050091 , #4A0187);
}
.sfp-container-top-trump-category {
	display: flex;
	flex-direction: row;
	color: #000;
	text-transform: capitalize;
	margin: 10px -20px 0px 0px;
	border-radius: 10px 0px 0px 10px;
	background-color: #fff;
}
.sfp-top-trump-category-left {
	width:80%;
	padding: 4px 10px;
	text-align: left;
}
.sfp-top-trump-category-right {
	width:20%;
	padding: 4px 20px;
	text-align: center;
}
.sfp-container-top-trump-footer {
	display: flex;
	flex-direction: column;
	margin-top: 10px;
	padding: 4px 6px;
	border-radius: 20px;
	color: #000;
	text-align: center;
	font-size: 13px;
	font-weight: 500;
	line-height: 15px;
	background-color: #fff;
}

@media only screen and (max-width: 960px) {
	}
@media only screen and (max-width: 640px) {
.sfp-container-top-trumps {
	margin: 10px;
	width: 135px;
	padding: 10px;
	border-radius: 5px;
	font-size: 10px;
	font-weight: 200;
	line-height: 11px;
	background-color: none;
	box-shadow: 3px 3px 10px #00000090;
}
.sfp-container-top-trump-title {
	padding: 3px 10px;
	border-radius: 0px 20px 20px 0px;
	margin: 5px -5px 0px -10px;
}
.sfp-container-top-trump-category {
	margin: 5px -10px 0px 0px;
	border-radius: 10px 0px 0px 10px;
}
.sfp-top-trump-category-left, .sfp-top-trump-category-right {
	padding: 3px 10px;
}
.sfp-container-top-trump-footer {
	margin-top: 8px;
	padding: 3px 3px;
	border-radius: 20px;
	font-size: 7px;
	line-height: 8px;
}
}


