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

@font-face { 
    font-family: 'Din-Bold';
    src: url('../fonts/DINBold.eot');
    src: url('../fonts/DINBold.eot?#iefix') format('embedded-opentype'),
         url('../fonts/DINBold.ttf') format('truetype'),
		 url('../fonts/DINBold.woff') format('woff'),
         url('../fonts/DINBold.svg#') format('svg');
    font-weight: bold;
    font-style: normal;
}

@font-face { 
    font-family: 'Din';
    src: url('../fonts/DIN-Regular.eot');
    src: url('../fonts/DIN-Regular.eot?#iefix') format('embedded-opentype'),
         url('../fonts/DIN-Regular.ttf') format('truetype'),
		 url('../fonts/DIN-Regular.woff') format('woff'),
         url('../fonts/DIN-Regular.svg#') format('svg');
    font-weight: normal;
    font-style: normal;
}

body {
	background-color:#EDEDED;
	margin:0;
	padding:0;
}

img {
	max-width: 100%;
	height: auto;
}

nav {
	width:25%;
	height:100vh;
	background-color:#FFF;
	display:block;
	position:fixed;
	z-index:200;
	/*-moz-box-shadow: 0px 0px 9px 0px #c0c0c0;
	-webkit-box-shadow: 0px 0px 9px 0px #c0c0c0;
	-o-box-shadow: 0px 0px 9px 0px #c0c0c0;
	box-shadow: 0px 0px 9px 0px #c0c0c0;
	filter:progid:DXImageTransform.Microsoft.Shadow(color=#c0c0c0, Direction=NaN, Strength=9);*/
}

#social-in {
	width:41px;
	display:block;
	margin:auto;
}

.fb {
	background:url('../img/facebook.png') no-repeat;
	width:41px;
	height:48px;
	display:inline-block;
	margin-top:50px;
}

.tw {
	background:url('../img/twitter.png') no-repeat;
	width:41px;
	height:48px;
	display:inline-block;
	margin-top:50px;
	margin-left:10px;
}

.fb:hover {
	background:url('../img/facebook-on.png') no-repeat;
}

.tw:hover {
	background:url('../img/twitter-on.png') no-repeat;
}

ul.breadcrumb {
	font-family:'Din';
	font-size:13px;
	color:#9d9d9c;
	margin-top:49px;
	margin-left:0;
	padding-left:0;
}

ul.breadcrumb li {
	display:inline-block;
	list-style-type:none;
}

ul.breadcrumb li:first-child {
	color:#ce217c;
}

ul.breadcrumb li a {
	font-size:13px;
	color:#9d9d9c;
	text-decoration:none;
}

span.divider {
	background:url('../img/fleche-ariane.png') no-repeat 0 2px;
	height:14px !important;
	width:14px !important;
	display:inline-block;
}

span.divider img {
	display:none;
}

#ariane h3 {
	display:none;
}

#menu {
	width:100%;
	display:block;
	background:url('../img/border-gris.jpg') repeat-x;
	height:auto;
	margin-top:40px;
}

#jawnav > ul > li {
	width:100%;
	font-weight:normal;
	font-family:'Din';
	height:52px;
}

#jawnav {
	background:none !important;
	border:0 !important;
	box-shadow:none !important;
}

nav#jawnav.jaw_98 {
	height:313px;
	padding-top:5px;
}

#jawnav ul ul {
	margin-left:100% !important;
	margin-top:-58px !important;
	padding:0 !important;
}

#jawnav > ul > li > a {
	border-right:0 !important;
	font-size:17px !important;
	line-height:17px !important;
	padding:0 !important;
	padding-left:20px !important;
	padding-right:20px !important;
	margin-top:17px !important;
	margin-bottom:23px !important;
}

#jawnav span.inner {
	border:0 !important;
	border-radius:0 !important;
	box-shadow:none !important;
	padding:0 !important;
}

li.item-101 {
	display:none !important;
}

li.item-108 a {
	color:#ce217c !important;
	border-left:solid 6px #ce217c !important;
	margin-left:25px !important;
}

li.item-109 a {
	color:#3aaa35 !important;
	border-left:solid 6px #3aaa35 !important;
	margin-left:25px !important;
}

li.item-110  a {
	color:#51337c !important;
	border-left:solid 6px #51337c !important;
	margin-left:25px !important;
}

li.item-111  a {
	color:#ffb31a !important;
	border-left:solid 6px #ffb31a !important;
	margin-left:25px !important;
}

li.item-112  a {
	color:#18bae5 !important;
	border-left:solid 6px #18bae5 !important;
	margin-left:25px !important;
}

li.item-139  a {
	color:#9d9d9c !important;
	border-left:solid 6px #9d9d9c !important;
	margin-left:25px !important;
}

#jawnav ul li.item-108 ul .inner {
	background:#ce217c !important;
}

#jawnav ul li ul .inner a {
	color:#FFF !important;
	text-transform:uppercase;
	font-weight:normal;
	font-size:17px !important;
	line-height:17px !important;
	background:url('../img/border-noir.png') repeat-x bottom;
	padding-top:20px;
	padding-bottom:21px;
	transition:none;
	margin-left:0 !important;
	border-left:0 !important;
}

#jawnav ul li ul .inner li:last-child a {
	background:none;
}


#jawnav ul li.item-109 ul .inner {
	background:#3aaa35 !important;
}

#jawnav ul li.item-111 ul .inner {
	background:#ffb31a !important;
}

#jawnav ul li.item-108 ul .inner li:hover {
	background:#fff !important;
}

#jawnav ul li.item-108 ul .inner li:hover a {
	background:none;
	color:#ce217c !important;
}

#jawnav ul li.item-109 ul .inner li:hover {
	background:#fff !important;
}

#jawnav ul li.item-109 ul .inner li:hover a {
	background:none;
	color:#3aaa35 !important;
}
	
#jawnav ul li.item-111 ul .inner li:hover {
	background:#fff !important;
}

#jawnav ul li.item-112 ul .inner {
	background:#18bae5 !important;
}

#jawnav ul li.item-112 ul .inner li:hover {
	background:#fff !important;
}

#jawnav ul li.item-111 ul .inner li:hover a {
	background:none;
	color:#ffb31a !important;
}

#jawnav ul li.item-112 ul .inner li:hover a {
	background:none;
	color:#18bae5 !important;
}

#jawnav > ul > li.has-sub > a::after {
	display:none;
}

#jawnav > ul > li.item-108.has-sub {
	background:url('../img/fleche-rose.png') no-repeat right center !important;
}

#jawnav > ul > li.item-109.has-sub {
	background:url('../img/fleche-verte.png') no-repeat right center !important;
}

#jawnav > ul > li.item-111.has-sub {
	background:url('../img/fleche-orange.png') no-repeat right center !important;
}

#jawnav > ul > li:hover > a, #jawnav > ul > li.active > a, #jawnav > ul > li:hover > a, #jawnav > ul > li > a:hover {
	background:none !important;
}

#jawnav > ul > li:hover, #jawnav > ul > li.active, #jawnav > ul > li.has-sub.parent:hover, #jawnav > ul > li.has-sub.parent.active {
	background-color:#f5f5f5 !important;
}

#jawnav > ul > li.item-112.has-sub {
	background:url('https://maisonhabitat.orleans-metropole.fr/images/fleche-bleue.png') no-repeat right center !important;
}

#social {
	width:100%;
	display:block;
	margin:auto;
	background:url('../img/border-gris.jpg') repeat-x;
	height:200px;
}

img.logo {
	max-width:286px;
	width:80%;
	margin:auto;
	display:block;
	margin-top:40px;
}

article {
	width:75%;
	height:auto;
	margin-left:25%;
	background-color:#EDEDED;
	background-image:url('../img/shadow.png');
	background-repeat:repeat-y;
}

aside {
	display:inline-block;
	width:37%;
	height:auto;
	/*background-color:#EDEDED;*/
	padding-bottom:85px;
	vertical-align:top;
}

aside.first {
	margin-left:25%;
	background-image:url('../img/shadow.png');
	background-repeat:repeat-y;
}

#top {
	width:100%;
	height:110px;
}

#top-container {
	width:85%;
	display:block;
	margin:auto;
}

#ariane {
	width:60%;
	height:110px;
	display:inline-block;
}

#top-boutons {
	width:40%;
	height:110px;
	display:inline-block;
	vertical-align:top;
}

.bouton {
	height:38px;
	background-color:#601142;
	display:inline-block;
	padding-left:10px;
	padding-right:20px;
	margin-left:10px;
	color:#FFF;
	font-family:'Din';
	text-transform:uppercase;
	font-size:15px;
	line-height:36px;
	margin-top:33px;
	float:right;
}

.bouton img {
	vertical-align:middle;
	margin-top:-4px;
}

.bouton:hover {
	background-color:#F92BA1;
}

#bloc-clip {
	width:80%;
	background-color:#FFF;
	height:auto;
	display:block;
	margin-left:15%;
	-moz-box-shadow: 0px 0px 9px 0px #c0c0c0;
	-webkit-box-shadow: 0px 0px 9px 0px #c0c0c0;
	-o-box-shadow: 0px 0px 9px 0px #c0c0c0;
	box-shadow: 0px 0px 9px 0px #c0c0c0;
	filter:progid:DXImageTransform.Microsoft.Shadow(color=#c0c0c0, Direction=NaN, Strength=9);
}

#bloc-clip2 {
	width:80%;
	background-color:#FFF;
	height:auto;
	display:block;
	margin-left:7%;
	-moz-box-shadow: 0px 0px 9px 0px #c0c0c0;
	-webkit-box-shadow: 0px 0px 9px 0px #c0c0c0;
	-o-box-shadow: 0px 0px 9px 0px #c0c0c0;
	box-shadow: 0px 0px 9px 0px #c0c0c0;
	filter:progid:DXImageTransform.Microsoft.Shadow(color=#c0c0c0, Direction=NaN, Strength=9);
}

#bloc-clip .titre, #bloc-clip2 .titre {
	height:70px;
	width:100%;
	background-color:#CE217C;
	padding-top:20px;
}

#actus {
	width:80%;
	background-color:#FFF;
	height:auto;
	display:block;
	margin-left:15%;
	-moz-box-shadow: 0px 0px 9px 0px #c0c0c0;
	-webkit-box-shadow: 0px 0px 9px 0px #c0c0c0;
	-o-box-shadow: 0px 0px 9px 0px #c0c0c0;
	box-shadow: 0px 0px 9px 0px #c0c0c0;
	filter:progid:DXImageTransform.Microsoft.Shadow(color=#c0c0c0, Direction=NaN, Strength=9);
}

#actus .titre {
	height:57px;
	width:100%;
	background-color:#51337C;
	padding-top:33px;
}

div.ns2-inner {
	margin-top:-21px;
	height:auto;
	padding-bottom:90px;
}

div.ns2-inner img {
	margin-bottom:25px !important;
}

a.ns2-readmore {
	width: 64px;
	height: 64px;
	background-color: #51337C;
	border-radius: 35px;
	-moz-box-shadow: 0px 0px 9px 0px #c0c0c0;
	-webkit-box-shadow: 0px 0px 9px 0px #c0c0c0;
	-o-box-shadow: 0px 0px 9px 0px #c0c0c0;
	box-shadow: 0px 0px 9px 0px #c0c0c0;
	filter: progid: DXImageTransform.Microsoft.Shadow(color=#c0c0c0, Direction=NaN, Strength=9);
	margin-top: 5px;
	margin-left: 22vw;
	position: absolute;
	font-size:0;
	background-image:url('../img/plus.png');
	background-repeat:no-repeat;
	background-size:35px 35px;
	background-position:13px 14px;
}

a.ns2-readmore:hover {
	background-color:#F92BA1;
	-moz-box-shadow: 0px 0px 9px 0px #c0c0c0;
	-webkit-box-shadow: 0px 0px 9px 0px #c0c0c0;
	-o-box-shadow: 0px 0px 9px 0px #c0c0c0;
	box-shadow: 0px 0px 9px 0px #c0c0c0;
	filter:progid:DXImageTransform.Microsoft.Shadow(color=#c0c0c0, Direction=NaN, Strength=9);
}

div.nssp2-default .ns2-art-controllers {
	float:left !important;
	width:250px;
	margin-top:-72px;
	margin-left:25px;
	position:absolute;
	z-index:100;
}

a.ns2-art-prev {
	width:46px !important;
	height:46px !important;
	background-image:url('../img/fleche-blanche-left.png') !important;
	background-position:7px 9px !important;
	background-color: #b2b2b2;
	border-radius: 35px;
	-moz-box-shadow: 0px 0px 9px 0px #c0c0c0;
	-webkit-box-shadow: 0px 0px 9px 0px #c0c0c0;
	-o-box-shadow: 0px 0px 9px 0px #c0c0c0;
	box-shadow: 0px 0px 9px 0px #c0c0c0;
	filter: progid: DXImageTransform.Microsoft.Shadow(color=#c0c0c0, Direction=NaN, Strength=9);
}

a.ns2-art-next {
	width:46px !important;
	height:46px !important;
	background-color: #b2b2b2;
	background-image:url('../img/fleche-blanche-right.png') !important;
	background-position:7px 9px !important;
	border-radius: 35px;
	-moz-box-shadow: 0px 0px 9px 0px #c0c0c0;
	-webkit-box-shadow: 0px 0px 9px 0px #c0c0c0;
	-o-box-shadow: 0px 0px 9px 0px #c0c0c0;
	box-shadow: 0px 0px 9px 0px #c0c0c0;
	filter: progid: DXImageTransform.Microsoft.Shadow(color=#c0c0c0, Direction=NaN, Strength=9);
	margin-left:130px !important;
}

a.ns2-art-prev:hover, a.ns2-art-next:hover {
	background-color: #f92ba1;
}

div.ns2-art-pagination.nssp2-controllers span {
	width:14px !important;
	height:14px !important;
	background-image:none !important;
	background-color: #b2b2b2;
	border-radius: 35px;
	margin-right:15px !important;
}

div.ns2-art-pagination.nssp2-controllers span.active, div.ns2-art-pagination.nssp2-controllers span:hover {
	background-color: #51337C;
}

div.ns2-art-pagination.nssp2-controllers {
	margin-left:-155px !important;
	margin-top:15px !important;
	float:none !important;
}

h4.ns2-title a {
	font-weight: normal !important;
	font-family: 'Din';
	text-transform: uppercase;
	font-size: 30px !important;
	line-height: 32px !important;
	color: #51337C;
	padding-left: 25px;
	padding-right: 25px;
	margin: 0;
	text-decoration:none !important;
	display:block;
}

#cohab {
	width:80%;
	background-color:#FFF;
	height:auto;
	display:block;
	margin-left:7%;
	padding-bottom:90px;
	-moz-box-shadow: 0px 0px 9px 0px #c0c0c0;
	-webkit-box-shadow: 0px 0px 9px 0px #c0c0c0;
	-o-box-shadow: 0px 0px 9px 0px #c0c0c0;
	box-shadow: 0px 0px 9px 0px #c0c0c0;
	filter:progid:DXImageTransform.Microsoft.Shadow(color=#c0c0c0, Direction=NaN, Strength=9);
}

#cohab .titre {
	height:70px;
	width:100%;
	background-color:#FFB31A;
	padding-top:20px;
}

.cohab {
	height:225px;
	width:100%;
	background-image:url('https://maisonhabitat.orleans-metropole.fr/images/Photos/inter.jpg');
	background-size:100% auto;
}

h1 {
	font-weight:normal;
	font-family:'Din';
	text-transform:uppercase;
	font-size:24px;
	line-height:26px;
	color:#FFF;
	padding-left:15px;
	padding-right:15px;
	display:block;
	margin:0;
	margin-left:25px;
	border-left:solid 7px #FFF;
}


h2 {
	font-weight:normal;
	font-family:'Din';
	text-transform:uppercase;
	font-size:30px;
	line-height:32px;
	color:#FFB31A;
	padding-left:25px;
	padding-right:25px;
	margin:0;
	margin-top:25px;
}

p {
	padding-left:25px;
	padding-right:25px;
	font-family:'Arial';
	font-size:15px;
	line-height:22px;
	color:#878787;
}

.bouton-plus {
	width:64px;
	height:64px;
	background-color:#FFB31A;
	border-radius:35px;
	-moz-box-shadow: 0px 0px 9px 0px #c0c0c0;
	-webkit-box-shadow: 0px 0px 9px 0px #c0c0c0;
	-o-box-shadow: 0px 0px 9px 0px #c0c0c0;
	box-shadow: 0px 0px 9px 0px #c0c0c0;
	filter:progid:DXImageTransform.Microsoft.Shadow(color=#c0c0c0, Direction=NaN, Strength=9);
	margin-top:5px;
	margin-left:22vw;
	position:absolute;
}

.bouton-plus img {
	width:35px;
	margin-top:13px;
	margin-left:14px;
}

.bouton-plus:hover {
	background-color:#F92BA1;
	-moz-box-shadow: 0px 0px 9px 0px #c0c0c0;
	-webkit-box-shadow: 0px 0px 9px 0px #c0c0c0;
	-o-box-shadow: 0px 0px 9px 0px #c0c0c0;
	box-shadow: 0px 0px 9px 0px #c0c0c0;
	filter:progid:DXImageTransform.Microsoft.Shadow(color=#c0c0c0, Direction=NaN, Strength=9);
}

footer {
	width:75%;
	height:284px;
	background-color:#601142;
	margin-left:25%;
	background-image:url('../img/shadow-footer.jpg');
	background-repeat:repeat-y;
}

#bottom1 {
	display:inline-block;
	width:35%;
	text-align:center;
	margin-left:8%;
	margin-top:50px;
	background:url('../img/border.png') no-repeat right;
	vertical-align:top;
}

#bottom2 {
	display:inline-block;
	width:29%;
	margin-top:30px;
	background:url('../img/border.png') no-repeat right 20px;
	margin-left:2%;
	vertical-align:top;
}

#bottom3 {
	display:inline-block;
	width:10%;
	margin-top:50px;
	margin-left:5%;
	vertical-align:top;
}

h3 {
	color:#f92ba1;
	font-family:'Din';
	font-weight:normal;
	font-size:17px;
}

#bottom2 p {
	font-family:'Din';
	color:#FFF;
	font-size:14px;
	line-height:14px;
	padding-left:0;
}

#bottom2 p.tel {
	display:block;
	color:#f92ba1;
	background:url('../img/tel.png') no-repeat 0 -5px;
	height:25px;
	padding-top:5px;
	padding-left:30px;
}

#bottom2 p.adresse {
	display:block;
	color:#FFF;
	background:url('../img/adresse.png') no-repeat 0 -1px;
	height:auto;
	padding-top:5px;
	line-height:16px;
	padding-left:30px;
}

#bottom2 img {
	vertical-align:middle;
}

#bottom3 a {
	font-family:'Din';
	color:#FFF;
	font-size:14px;
	line-height:20px;
	display:block;
	text-decoration:none;
}

#bottom3 a:hover {
	color:#f92ba1;
}

img.ns2-image {
	width:100% !important;
	height: auto !important;
}

@media all and (min-width: 1510px) {
	a.ns2-readmore {
		margin-left:24.5vw;
	}

	.bouton-plus {
		margin-left:24.5vw;
	}
}

@media all and (min-width: 1024px) and (max-width: 1510px) {
	#jawnav ul li ul .inner a {
		font-size: 14px !important;
		line-height: 14px !important;
	}

	.ctc {
		margin-top:10px;
	}
	
	#top {
		height:160px;
	}
	
	#bottom1 {
		margin-left:4%;
	}

	#bottom2 {
		margin-left:4%;
		padding-right:25px;
	}

	#bottom3 {
		margin-left:5%;
	}

	#bottom1 img {
		width:75%;
		max-width:240px;
	}

	#bottom3 {
		width:15%;
	}

	footer {
		height:324px;
	}
}

@media all and (min-width: 1200px) and (max-width: 1510px) {

	#jawnav > ul > li a {
		padding-right:30% !important;
	}

	#jawnav > ul > li.item-110 a {
		padding-right:16% !important;
	}

	#jawnav > ul > li.item-108 a {
		padding-right:45% !important;
	}

	#jawnav > ul > li.item-112 a {
		padding-right:40% !important;
	}

	#jawnav > ul > li {
		height:65px !important;
	}

	#jawnav ul ul {
		margin-top:-74px !important;
	}

	nav#jawnav.jaw_98 {
		height:391px;
	}

	#jawnav > ul > li.item-108.has-sub {
		background:url('../img/fleche-rose.png') no-repeat right 17px !important;
	}

	#jawnav > ul > li.item-109.has-sub {
		background:url('../img/fleche-verte.png') no-repeat right 17px !important;
	}

	#jawnav > ul > li.item-111.has-sub {
		background:url('../img/fleche-orange.png') no-repeat right 17px !important;
	}
}

@media all and (min-width: 1024px) and (max-width: 1200px) {
	#jawnav > ul > li a {
		padding-right:23% !important;
	}

	#jawnav > ul > li.item-110 a {
		padding-right:5% !important;
	}

	#jawnav > ul > li.item-108 a {
		padding-right:30% !important;
	}

	#jawnav > ul > li.item-112 a {
		padding-right:30% !important;
	}

	#jawnav > ul > li {
		height:65px !important;
	}

	#jawnav ul ul {
		margin-top:-74px !important;
	}

	nav#jawnav.jaw_98 {
		height:391px;
	}
}

@media all and (min-width: 769px) and (max-width: 1024px) {

	#jawnav ul li ul .inner a {
		font-size: 14px !important;
		line-height: 14px !important;
	}
	
	#jawnav > ul > li a {
		padding-right:3% !important;
	}

	#jawnav > ul > li.item-110 a {
		padding-right:0% !important;
	}

	#jawnav > ul > li.item-108 a {
		padding-right:3% !important;
	}

	#jawnav > ul > li.item-112 a {
		padding-right:3% !important;
	}

	#jawnav > ul > li {
		height:auto !important;
		padding-bottom:0px !important;
	}

	#jawnav ul ul {
		margin-top:-74px !important;
	}

	nav#jawnav.jaw_98 {
		height:auto;
	}

	#jawnav > ul > li.item-108.has-sub,
	#jawnav > ul > li.item-109.has-sub,
	#jawnav > ul > li.item-111.has-sub,
	#jawnav > ul > li.item-112.has-sub {
		background:none !important;
	}

	li.item-108 a,
	li.item-109 a,
	li.item-110 a,
	li.item-111 a,
	li.item-112 a,
	li.item-139 a {
		margin-left:15px !important;
	}

	footer {
		height:324px;
	}
}

@media all and (max-width: 1024px) {
	#top-boutons {
		width:100%;
		margin: auto;
		display:block;
	}

	.ctc {
		margin-top:33px;
	}

	#top {
		height:110px;
	}

	div#ariane {
		display:none;
	}

	aside {
		width:75%;
		margin-left:25%;
		background:url('../img/shadow.png') repeat-y;
	}

	#bloc-clip, #bloc-clip2 {
		margin:auto;
		width:85%;
	}

	#cohab, #actus {
		margin:auto;
		width:85%;
	}

	.bouton-plus {
		margin-left:54vw;
	}

	a.ns2-readmore {
		margin-left: 54vw;
	}

	#bottom1 {
		display:none;
	}

	#bottom2 {
		width:45%;
		margin-left:13%;
	}

	#bottom3 {
		width:20%;
	}
}

@media all and (max-width: 768px) {
	nav {
		display:block;
		width:100%;
		position:relative;
		height:auto;
	}
	
	nav#jawnav.jaw_98 {
		height:auto;
	}
	
	#social {
		height:auto;
		position:absolute;
		width:auto;
		float:left;
		background:none;
		margin-left:6%;
	}
	
	.tw, .fb {
		margin-top:32px;
	}
	
	img.logo {
		margin-top:0;
		padding-top:40px;
	}
	
	article, footer {
		width:100%;
		margin-left:0;
	}
	
	aside, aside.first {
		width:100%;
		margin-left:0;
	}
	
	#top {
		width:100%;
		display:block;
		margin:auto;
	}
	
	#top-boutons {
		width:100%;
		margin: auto;
		display:block;
	}

	.bouton-plus {
		margin-left:70vw;
	}

	a.ns2-readmore {
		margin-left: 70vw;
	}

	#jawnav > ul > li > a {
		margin-bottom : 0 !important;
		padding-bottom:16px !important;
		padding-top:19px !important;
		margin-top:0 !important;
	}

	#jawnav > ul > li.has-sub > .submenu-button {
		height: 100%;
	}

	#jawnav > ul > li.has-sub > .submenu-button::before {
		top: 50%;
	}

	#jawnav > ul > li.has-sub > .submenu-opened::before {
		top: 26px;
	}

	#jawnav > ul > li.has-sub > .submenu-button::after {
		top: 50%;
		transform: translateY(-50%);
	}

	#jawnav > ul > li.has-sub > a {
		width: calc(100% - 15px);
		padding-right: 70px !important;
	}

	li.item-108 a,
	li.item-109 a,
	li.item-110 a,
	li.item-111 a,
	li.item-112 a,
	li.item-139 a {
		margin-left:15px !important;
	}

	#jawnav > ul > li.item-108.has-sub,
	#jawnav > ul > li.item-109.has-sub,
	#jawnav > ul > li.item-111.has-sub,
	#jawnav > ul > li.item-112.has-sub {
		background:none !important;
	}

	#jawnav #menu-button {
		font-family:'Din' !important;
		font-size:19px !important;
		color:#9d9d9c !important;
		padding-bottom:18px !important;
	}

	#jawnav #menu-button::before {
		border-top: 2px solid #9d9d9c !important;
		border-bottom: 2px solid #9d9d9c !important;
	}

	#jawnav #menu-button::after {
		background:#9d9d9c !important;
	}

	#jawnav ul ul {
		margin-left:0 !important;
		margin-top:0 !important;
	}

	footer {
		height:324px;
	}
}

@media all and (max-width:600px) {
	
	#top {
		width:85%;
		display:block;
		margin:auto;
	}
	
	#bloc-clip, #bloc-clip2 {
		width:85%;
	}
	
	#cohab, #actus {
		width:85%;
	}

	.bouton-plus {
		margin-left:70vw;
	}

	a.ns2-readmore {
		margin-left: 70vw;
	}

	#top-container {
		width:100%;
	}

	.bouton img {
		display:none;
	}

	.bouton {
		padding-left:20px;
	}

	#top-boutons .bouton {
		font-size: 12px;
		line-height: 1.2;
		height: auto;
		padding: 10px;
		margin-top: 36px;
	}

	#bottom2 {
		width: 51%;
		margin-left: 7%;
	}

	#bottom3 {
		width: 29%;
	}

	footer {
		height: unset;
		padding-bottom: 30px;
	}
}

@media all and (min-width: 769px) and (max-height: 800px) {
	#jawnav > ul > li:nth-child(3) > ul > .inner {
		display: block;
		max-height: 300px;
		overflow-x: hidden;
		overflow-y: auto;
	}
}


/* --------- POPUP COOKIES --------- */


@media (min-width: 1024px) {
	.cookies-banner {
		left: 85px;
		width: 400px;
	}
}

.cookies-banner.hide {
	opacity: 0;
	transform: translateY(1000px);
}

.cookies-banner-text-intro {
	margin: 0;
}

.cookies-banner-close {
	position: absolute;
	right: 12px;
	top: 10px;
	font-size: 25px;
	cursor: pointer;
}

.cookies-banner-detail {
	height: 0;
	max-height: 0;
	overflow: hidden;
}

.cookies-banner.active .cookies-banner-detail {
	height: auto;
	max-height: 400px;

}

.cookies-banner .link {
	text-decoration: underline;
	cursor: pointer;
}

.cookies-banner .form-label {
	margin-top: 10px;
	display: block;
}

.accept-popup-button {
	margin-top: 20px;
	font-weight: 500;
}

.popup-content #popup-text {
	margin: 10px 0;
	text-align: left;
	max-width: 60%;
}
.cookies-banner.active .cookies-banner-detail {
	height: auto;
	max-height: 400px;
	margin-top: 20px;
}

.cookies-banner {
	display: block;
	padding: 25px;
	left: 5%;
	bottom: 15px;
	width: 90%;
	z-index: 99999;
	background: #fff;
	position: fixed;
	transition: 0.125s;
	box-shadow: 0 0 30px -10px rgb(0 0 0 / 75%);
	box-sizing: border-box;
}

.cookies-banner a,
.cookies-banner a:not([href]):not([tabindex]) {
	text-decoration: underline;
	color: #ce217c;
}

.accept-popup-button {
	margin-top: 20px;
	font-weight: 500;
	color: #fff;
	border-radius: 20px;
	padding: 10px 30px 10px 46px;
	text-transform: uppercase;
	border: none;
	background: #ce217c url(../img/fleche-blanche-right.png) no-repeat 10px;
}