body {
	// workaround bad/missing hints in font
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

//
//	HEADER
//

#logo.has-logo a {
	text-indent: -10000px;
	min-width: 360px;
	min-height: 120px;
	@media screen and (max-width: $mobile-limit) {
		margin-top: .2em;
		min-width: 240px;
	}
}

#toplinks {
	box-shadow: none;
	text-transform: uppercase;
	a {
		color: $tertiary-color;
		font-weight: bold;
	}
}


//
//	NAV
//

div#nav {
	& > ul {
		margin-top: 0px;
	}
	font-family: 'Poppins', sans-serif;
	& > ul > li {
			& > a {
			text-transform: uppercase;
			font-weight: 400;
			@media (min-width: $mobile-limit + 1) {
				&::after {
					font-family: FontAwesome;
					content: "\f13a";
					margin-left: .5em;
				}
			}
		}
		@media (min-width: $mobile-limit + 1) {
			 & > a { padding-top: 8px; }
			 & > a { padding-bottom: 5px; }
			border-bottom: 3px solid $secondary-color;
			&:hover {
				border-bottom: 3px solid #b53845;
			}
			& > ul {
				margin-top: 3px;
				border-radius: 0 0 10px 10px;
				box-shadow: 0px 5px rgba(0,0,0,0.6);
			}
		}
		& > ul > li a {
			text-transform: none;
			font-weight: 450;
			&:hover {
				text-decoration: underline;
			}
			&::before {
				font-family: FontAwesome;
				content: "\f105";
				margin-right: .5em;
			}
		}
	}
	@media screen and (max-width: $mobile-limit) {
		padding-top: 10px;
		button.gru-nav-button, ul.menu, ul.menu:before {
			background: $secondary-color;
		}
		.icon-bar {
			background-color: white;
		}
		ul li {
			border-bottom: 2px solid #9bd600;
		}
		ul li > a {
			color: white;
			&:hover { color: $tertiary-color; }
		}
		ul li.selected > a {
			background: $tertiary-color;
			&:hover { color: white; }
		}
	}
}

//
//	MAIN CONTENT
//

%button {
	text-transform: uppercase;
	font-weight: bold;
	box-shadow: none;
	&:hover {
		border: 3px solid #6598cd;
		box-shadow: none;
	}
}

div.cell.pk-error {
	border-left: 4px solid rgba(10,10,10,.32);
	border-right: 4px solid rgba(10,10,10,.32);
}

#messages {
	li.success::before,
	li.info::before,
	li.warning::before,
	li.error::before {
		top: 0em;
	}
}

main {
	.three-cols-column {
		margin-left: 1em;
		margin-right: 1em;
	}
	@media (min-width: $mobile-limit + 1) {
		#left-content { margin-left: 0px; }
		#right-content { margin-right: 0px; }
	}
}

.page-title, .gru-content .page-title {
	border: none;
	background-color: transparent;
	h2 {
		font-size: $title-font-size;
		text-transform: $title-transform;
		font-weight: $title-weight;
		color: $title-color;
	}
}

.gru-content {
	margin-top: 30px;
	margin-bottom: 30px;
}

div.searchcell form input {
	margin-right: 0px;
	border-radius: 5px;
}

button.combo-search--button {
	background-color: #e8b200;
	border: 3px solid #e8b200;
	border-radius: 10px 0px 10px 0px;
	&:hover {
		background-color: #e8b200;
		border: 3px solid #fbe7a6;
	}
}

div.wcsformsofcategorycell {
	picture img {
		width: 100%;
	}
	ul > li {
		line-height: 1;
		&:not(:last-child) {
			border: 1px dotted #e2e1e0;
		}
	}
	&.has-asset-picture > div picture img {
		border-radius: 15px 0px 0px 0px;
	}
}


div.wcs-form-cell {
	padding: 1em;
}

div#rub_service {
	border-radius: $cell-border-radius;
	h3 { color: $primary-color; }
	&.form-content--body {
		border: 1px solid #e2e1e0;
		h3 {
			text-transform: uppercase;
		}
		span.required {
			color: $tertiary-color;
		}
		div.hint {
			font-style: italic;
		}
		button.form-previous, button.form-next, button.form-submit {
			background: $tertiary-color;
			border: 3px solid $tertiary-color;
			&:hover {
				border: 3px solid #b76d74;
			}
		}
	}
}

div#rub_service div.timetable-widget {
	div.head {
		font-weight: bold;
	}
	span.timetable-cell {
		border-radius: 5px;
	}
	button.next {
		background: $tertiary-color;
		border: 3px solid $tertiary-color;
		&:hover {
			border: 3px solid #b76d74;
			box-shadow: none;
		}
	}
}

.form-content--title {
	font-size: 25px;
}

div#tracking-code h3 {
	font-size: 130%;
	text-transform: uppercase;
	color: $secondary-color;
}

div.wcs-tracking-code-input button {
	background: $tertiary-color;
	border: 3px solid $tertiary-color;
	&:hover {
		background: $tertiary-color;
		border: 3px solid #b76d74;
	}
}

.pwa-navigation div > ul li a,
.pwa-navigation div#nav ul li a {
	& > span {
		font-size: 1em;
	}
	color: white;
	background: $secondary-color;
	width: 100%;
	height: 100%;
}

.wcs-step.current {
	border-bottom: 2px solid $primary-color;
}

@media (min-width: $mobile-limit + 1) {
	div.form-content--sidebox div#side header#steps ol li:first-child {
		border-radius: 15px 0px 0px 0px;
	}
	div.form-content--sidebox div#side header#steps ol li:last-child {
		border-radius: 0px 0px 15px 0px;
	}
}

//
//	FOOTER
//

#footer-wrapper {
	.site-info__image {
		background: url(/assets/footer:logo) top left no-repeat;
		background-size: contain;
		text-indent: -10000px;
		display: block;
		min-height: 90px;
		margin-top: 1em;
		margin-left: 1em;
	}
	.site-info__address {
		margin-left: 15px;
		 h1 {
			font-size: 130%;
		}
	}
	.site-info__listitems {
		ul { list-style: none; }
		li {
			margin-top: .3em;
			margin-bottom: .3em;
		}
		li:before {
			font-family: FontAwesome;
			content: "\f138";
			padding-right: 5px;
		}
	}
	.site-info__references {
		ul {
			list-style: none;
			li:nth-child(1) {
				background-image: url('img/logo-sud-est-avenir.png');
			}
			li:nth-child(2) {
				background-image: url('img/logo-val-de-marne.png');
			}
			li:nth-child(3) {
				background-image: url('img/logo-ile-de-france.png');
			}
			li:nth-child(4) {
				background-image: url('img/logo-mgp.png');
			}
			li {
				text-indent: -10000px;
				background-size: contain;
				min-width: 60px;
				min-height: 40px;
				background-repeat: no-repeat;
				margin-top: .7em;
				margin-bottom: .7em;
			}
		}
	}
}
