body {
	font-weight: 300;
}

.site-header {
	pointer-events: none;
	background: $red;
	padding-top: 0;
	padding-bottom: 0;
	height: 0;
	@media screen and (max-width: $nav-mobile-limit) {
		height: auto;
		padding-top: 0px;
	}
	#logo {
		a {
			box-sizing: content-box;
			pointer-events: auto;
			background: url(/assets/header:logo) 0px 7px no-repeat;
			background-size: 180px;
			display: inline-block;
			padding-top: 15px;
			width: 180px;
			height: 40px;
			text-indent: -10000px;
			@media screen and (max-width: $nav-mobile-limit) {
				height: 55px;
			}
		}
		@media screen and (max-width: $nav-mobile-limit) {
			padding-top: 40px;
			padding-left: 0;
			a {
				padding-top: 0px;
				padding-left: 10px;
				background-position: top center;
				width: 100%;
			}
		}

	}
	a {
		color: white;
	}
	#toplinks {
		pointer-events: auto;
		padding-top: 15px;
		border: none;
		background: none;
		box-shadow: none;
		@media screen and (max-width: $nav-mobile-limit) {
			padding-top: 2px;
		}
	}
}

div#page div#main-content-wrapper {
	margin-top: 1rem;
}

footer {
	#footer a {
		color: white;
	}
	#fleche-haut {
		font-size: 1.111rem;
		position: absolute;
		right: 0;
		top: 10px;
		a {
			background: $red;
			color: white;
			display: block;
			height: 60px;
			line-height: 60px;
			width: 60px;
			text-align: center;
			color: white;
		}
	}
}

.site-nav ul {
	margin: 0 auto;
	text-align: center;
}

body.has-picture .site-nav::after {
	top: 0;
}

div.cell,
div.comment-field {
	&.fond-bleu, &.fond-rouge {
		&.comment-field {
			padding: 0.5rem 0.5rem;
		}
		padding-bottom: 0.5rem;
		color: white;
		h2:first-child, h3:first-child {
			margin-top: 0;
			color: white;
			font-weight: normal;
		}
	}
	&.fond-rouge {
		background: $red;
	}
	&.fond-bleu {
		background: $blue;
	}
}

#encart-bandeau {
	position: absolute;
	top: -300px;
	left: 130px;
	width: 480px;
	background: rgba(231, 39, 32, 0.8);
	padding: 0.5rem 2rem;
	color: white;
	@media screen and (max-width: $nav-mobile-limit) {
		padding: 0.5rem 0.5rem;
		position: static;
		width: auto;
	}
	h2 {
		font-size: 2rem;
		color: white;
		@media screen and (max-width: $nav-mobile-limit) {
			font-size: 1.333rem;
		}
	}
}

#content .linkcell.puce,
#content .wcsformsofcategorycell {
	picture {
		display: block;
		text-align: center;
		+ h2 {
			margin-top: 0;
			padding-top: 0;
			color: $red2;
		}
	}
	a {
		color: $font-color;
	}
	.add-more-items--button {
		font-weight: bold;
	}
}

.form-content--title,
div#rub_service h2 {
	text-align: left;
	color: #1c1c1c;
	font-size: 1.556rem;
}

div#tracking-code h3 {
	background: $red;
	color: white;
	padding: 0.5rem 1rem;
	text-transform: uppercase;
}

div.buttons button {
	text-transform: uppercase;
}

div#gauche {
	width: 15%;
	text-align: center;
	@media screen and (max-width: $nav-mobile-limit) {
		width: auto;
		margin-top: 0;
	}
}

// Steps
.wcs-steps {
	&--list {
		justify-content: center;
	}
}
@media ($mq-min--wcs-steps-horizontal-layout) {
	.wcs-step--label {
		text-align: center;
	}
}
@include desktop-vertical-steps() {
	.wcs-step {
		flex-direction: column;
		align-items: center;
		margin-bottom: $wcs-steps-spacing * 3;

		&--label {
			margin-top: $wcs-steps-spacing;
		}
	}
}

div.dataview {
	span.label {
		color: #545454;
	}
}

%button {
	@extend %button;
	box-shadow: none;
	border: 1px solid #373737;
}

div.cancel-button {
	float: right;
	button {
		background: white;
		color: $font-color;
	}
}

@media screen and (max-width: $nav-mobile-limit) {
	body.has-picture .site-nav::after {
		height: 200px;
	}
}
