@import '../includes/fonts/bitter';
@import '../includes/fonts/worksans';

body.has-header-background .site-header {
	background-attachment: fixed;
}

div#header-wrapper {
	height: 295px;
	#logo {
		padding-top: 80px;
		a {
			display: block;
			height: 120px;
			background-position-x: center;
			text-indent: -1000px;
			overflow: hidden;
		}
	}
}

div.gru-nav {
	ul > li a {
		font-family: "Work Sans", sans-serif;
		font-size: 1.188rem;
		font-weight: 600;
		padding: 0.75em 15px 0.75em 15px;
	}
	li:before {
		display: block;
		content: "";
		border: $nav-item-border;
		border-top-style: none;
		border-right-style: none;
		border-left-style: none;
		transform: scaleX(0);
		transition: transform .2s ease-in-out;
	}
	li.selected:before {
		transform: scaleX(1);
	}
	li:hover:before {
		transform: scaleX(1);
	}
}

div#nav {
	padding: 1px 0px 5px 0px;
	margin-bottom: 1px;
	text-align: center;
	& > ul {
		text-align: left;
		background: url(img/ville-sens-blason.svg) top left no-repeat;
		margin: 10px 0px 5px 10px;
		padding-left: 50px;
	}
	@media screen and ($max-mobile-viewport) {
		text-align: left;
		& > ul {
			background: $tertiary-color;
		}
	}
}

#toplinks {
	background: $primary-color;
	border: none;
	box-shadow: none;
	border-radius: 0;
	a {
		display: inline-block;
		color: white;
		font-weight: bold;
		padding: 10px 10px 15px 10px;
	}
}

div.title {
	font-weight: 600;
}

span.required {
	margin-left: 4px;
	color: #790000
}

div#footer-wrapper {
	margin-top: 30px;
	background: $tertiary-color;
	div[class*=grid-] {
		padding-right: 0px;
	}
	div.textcell p {
		margin: 12px 0px 12px 0px;
	}
	div.textcell a {
		color: white;
		text-decoration: underline;
	}
	div.textcell a:hover {
		text-decoration: none;
	}
	div a.yellow-btn {
		font-family: $title-font-family;
		font-size: 1.062rem;
		font-weight: 500;
		color: black;
		text-transform: uppercase;
		text-decoration: none;
		background: $secondary-color;
		padding: 15px 20px 15px 20px;
		border: transparent 1px solid;
		transition: background 0.2s linear;
	}
	div a.yellow-btn:hover {
		background: white;
		border: black 1px solid;
	}
	p.widget-title {
		font-size: 1.188rem;
		font-weight: bold;
	}
	li a {
		display: block;
		padding: 0.3125em 0;
	}
	ul {
		list-style: none;
		margin-left: -40px;
	}
	img {
		width: 137px;
		margin-top: -66px;
		margin-left: -8px;
	}
	@media screen and ($max-mobile-viewport) {
		padding-left: 10px;
		img {
			width: 72px;
			margin-top: -46px;
			margin-left: -1px;
		}
	}
}
