/* BANNER > fantasy LNH */
.banner-fantasy {
	width: 100%;
	max-width: 995px;
	margin: 0 auto;
	display: flex;
	flex-flow: row nowrap;
	justify-content: flex-start;
	height: 72px;
	background: #f2f2f2;
	border-radius: 34px 34px 0px 0px;
	overflow: hidden;
}
	.banner-fantasy .col-label {
		margin: auto 0;
		width: calc(100% - 154px);
		font-weight: 500;
		font-size: 16px;
		line-height: 1.1;
		text-align: center;
		color: #000;
	}
		.banner-fantasy .col-label span {
			color: #DB3137;
			text-transform: uppercase;
			font-weight: bold;
		}
	.banner-fantasy .col-icon {
		width: 154px;
		height: 72px;
		line-height: 72px;
		background: #38b5c7;
		font-weight: 900;
		font-size: 15px;
		letter-spacing: 0.04em;
		text-align: center;
		color: #fff;
		text-transform: uppercase;
	}
/* alt et hover */
.banner-fantasy.invert {
	border-radius: 0 0 34px 34px;
}
.banner-fantasy:hover {
	text-decoration: none;
}

/* USERS > logged toolbar / club favoris en home */
.user-toolbar {
	width: 100%;
	display: flex;
	flex-flow: row nowrap;
	justify-content: flex-start;
	height: 72px;
	background: #f2f2f2;
	border-radius: 34px 0px 0px 0px;
	overflow: hidden;
}
	.user-toolbar .col-icon {
		width: 154px;
		height: 72px;
		line-height: 72px;
		border-radius: 30px 0px 0px 0px;
		background: #38b5c7;
		font-weight: bold;
		font-size: 16px;
		letter-spacing: 0.04em;
		text-align: center;
		color: #fff;
		text-transform: uppercase;
	}
		.user-toolbar .col-icon i {
			margin-right: 7px;
			font-size: 18px;
			color: #FFF;
		}
	.user-toolbar .col-label {
		margin: auto 0;
		margin-left: 30px;
		font-weight: bold;
		font-size: 14px;
		line-height: 1.1;
		text-align: left;
		color: #000;
	}
		.user-toolbar .col-label span {
			color: #38B5C7;
			text-transform: uppercase;
		}
		.user-toolbar .col-label .team {
			display: flex;
			flex-flow: row wrap;
			justify-content: flex-start;
		}
			.user-toolbar .col-label .team .logo {
				margin: auto 0;
			}
				.user-toolbar .col-label .team .logo img {
					height: 50px;
					width: auto;
				}
			.user-toolbar .col-label .team .name {
				margin: auto 15px;
				font-weight: 500;
				font-size: 18px;
				letter-spacing: 0.02em;
				line-height: 1.1;
				color: #000;
			}
	.user-toolbar .col-bts {
		margin: auto 0;
		margin-left: auto;
	}
		.user-toolbar .col-bts a {
			font-weight: 900;
			text-decoration: underline;
			font-size: 14px;
			letter-spacing: 0.08em;
			text-align: left;
			color: #3a478a;
			text-transform: uppercase;
		}
		.user-toolbar .col-bts a span {
			text-decoration: none;
		}
	.user-toolbar .col-toggle {
		margin: auto 0;
		margin-left: 20px;
		margin-right: 25px;
		font-size: 18px;
		text-align: left;
		color: #3a478a;
	}
		.user-toolbar .col-toggle.active {
		    transition: all 0.5s ease-in-out;
			transform: rotate(90deg);
		}

/* USERS > clubs favoris */
.favoris-team-dashboard {
	padding-top: 30px;
}
	.favoris-team-calendars {
		justify-content: flex-start;
	}
		.favoris-team-calendars .title {
			font-weight: 900;
			font-size: 16px;
			letter-spacing: 0.02em;
			line-height: 24px;
			text-align: center;
			color: #3455a3;
			text-transform: uppercase;
			margin-bottom: 10px;			
		}
			.favoris-team-calendars .title.next {
				margin-top: 40px;
			}
		.favoris-team-calendars .calendars-listing-item {
			width: 100%;
			margin-left: 0;
		}


/* USERS > Mon compte > raccourcis */
.users-shortcuts {
	width: 100%;
	display: flex;
	flex-flow: row wrap;
	justify-content: flex-start;
}
	.users-shortcut {
		height: 200px;
		display: flex;
		flex-flow: column;
		justify-content: center;
		border-radius: 20px;
		padding: 30px;
		text-decoration: none;
		margin-right: 30px;
	}
	.shortcuts-style1 { /* style1 = bt admin et bt medias */
		width: 200px;
	}
		.shortcuts-style1 .icon {
			font-size: 25px;
			color: #FFF;
			text-align: center;
			margin-bottom: 8px;			
		}
		.shortcuts-style1 .label {
			font-weight: bold;
			font-size: 16px;
			line-height: 20px;
			text-align: center;
			color: #fff;
		}
	.shortcuts-style2 { /* style2 = handTV */
		width: 200px;
	}
		.shortcuts-style2 .icon {
			font-size: 25px;
			color: #FFF;
			text-align: center;
		}
	.shortcuts-style3 {
		width: auto;
		min-width: 300px;
		padding-left: 50px;
		padding-right: 70px;
		justify-content: flex-start;
	}
		.shortcuts-style3 a {
			display: block;
			width: 100%;
			font-weight: bold;
			font-size: 16px;
			line-height: 36px;
			text-align: left;
			color: #fff;
		}
			.shortcuts-style3 a span {
				color: #40C0DA;
			}

/* variations */
.users-shortcut:hover {
	text-decoration: none;
}
.users-shortcut.blue {
	background: #33b8d6;
}
.users-shortcut.blue-dark {
	background: #2a4b9a;
}
.users-shortcut.yellow {
	background: #f9ac02;
}
.users-shortcut.red {
	background: #ea0101;
}

/* SHOP > blocks */
.shop-home {
	width: 390px;
	margin: 0 auto;
}
.shop-title {
	font-family: Roboto;
	font-weight: 900;
	font-size: 16px;
	letter-spacing: 0.02em;
	line-height: 24px;
	text-align: left;
	color: #3455a3;
	text-transform: uppercase;
	margin-bottom: 15px;
}
/* SHOP > item */
.shop-listing-item {
	height: 265px;
	background: #fff;
	border: 1px solid #40c0da;
	padding: 15px;
	display: flex;
	flex-flow: column;
	justify-content: flex-start;
}
	.shop-listing-item .picture {
		width: 138px;
		height: 138px;
		overflow: hidden;
		margin:0 auto;
	}
		.shop-listing-item .picture img {
			height: 100%;
			width: auto;
		}
	.shop-listing-item .name {
		margin: 20px 0 18px;
		font-weight: 500;
		font-size: 14px;
		line-height: 1.2;
		text-align: left;
		color: #000000;
		text-transform: capitalize;
	}

	.shop-listing-item .price {
		font-weight: bold;
		font-size: 18px;
		line-height: 1.2;
		text-align: left;
		color: #40c0da;
	}
/* hover */
.shop-listing-item:hover {
	text-decoration: none;
}

/* NEWS / VIDEOS > item */
.news-item,
.videos-item {
	width: 100%;
	display: flex;
	flex-flow: column;
	justify-content: flex-start;
}
	.news-item .picture,
	.videos-item .picture {
		width: 100%;
		position: relative;
		z-index: 2;
		height: 182px;
		overflow: hidden;
		text-align: center;
		background-position: center;
		background-size: cover;
	}
		.news-item .picture img,
		.videos-item .picture img {
			width: 100%;
			height: auto;
		}

	.news-item .border,
	.videos-item .border {
		position: relative;
		z-index: 2;
		width: 100%;
		height: 10px;
		overflow: hidden;
	}
		.news-item .border img,
		.videos-item .border img {
			width: 100%;
			vertical-align: top;
		}
	.news-item .date,
	.videos-item .date {
		width: 100%;
		font-weight: bold;
		font-size: 12px;
		letter-spacing: 0.1em;
		line-height: 1.1;
		text-align: left;
		color: #333333;
		padding: 11px 0 7px;
		text-transform: uppercase;
	}
	.news-item .row-infos,
	.videos-item .row-infos {
		padding: 0;
		width: 100%;
		display: flex;
		flex-flow: row nowrap;
		font-size: 13px;
		line-height: 1.3;
		text-align: left;
		color: #666;
		margin: auto 0;
	}
	.news-item .row-infos .logo,
	.videos-item .row-infos .logo {
		margin: auto 10px auto 0;
	}
		.news-item .row-infos .logo img,
		.videos-item .row-infos .logo img {
			height: 24px;
			width: auto;					
		}
	.news-item .row-infos .datetime,
	.videos-item .row-infos .datetime {
		margin: auto 0;
	}

	.news-item .title,
	.videos-item .title {
		padding: 10px 0 5px;
		width: 100%;
		font-weight: 500;
		font-size: 20px;
		line-height: 1.2;
		text-align: left;
		color: #2A4B9A;	
	}

/* small */
.news-item.small .picture img,
.videos-item.small .picture img {
	width: auto;
	height: 155px;
}

/* medium */
.news-item.medium .picture,
.videos-item.medium .picture {
	height: 215px;
}

/* large */
.news-item.large .picture,
.videos-item.large .picture {
	width: 100%;
	height: auto;
	min-height: 500px;
	position: relative;
	z-index: 2;
}
	.news-item.large .picture img,
	.videos-item.large .picture img {
		width: auto;
		height: auto;
		min-width: 100%;
		min-height: 100%;
	}

/* videos */
.videos-item .picture img.picto {
	width: 57px;
	height: 56px;
	position: absolute;
	z-index: 3;
	top: 50%;
	left: 50%;
	margin-top: -27px;
	margin-left: -27px;
}

/* hover */
.news-item:hover,
.videos-item:hover {
	text-decoration: none;
}

/* VIDEOS > handball tv */
.handballtv {
	padding: 70px 0 40px;
	position: relative;
}
	.handballtv .videos-item {
		width: 290px;
		margin: 0 auto 20px;
	}
.handballtv-logo {
	position: absolute;
	top: -38px;
	left: 0;
	width: 100%;
	text-align: center;
	z-index: 10;
}
	.handballtv-logo img {
		height: auto;
		width: 250px;
	}