/*
* COLOR
* -----------------------------
* bleu-foncé : #004f92
*
*/

@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Roboto+Condensed:300,300i,400,400i,700,700i');
@import url('https://fonts.googleapis.com/css?family=Playball');

/* Admin Babylone */
body#art {
	background-image: none;
	background-color: #FFFFFF;
	color: #000000;
	font-size: 16px;
	padding: 15px !important;
}

body#art a {
	color: #4488CC;
}

body#art p,
body#art ul,
body#art h1,
body#art h2,
body#art h3,
body#art h4 {
	margin-bottom: 10px;
}

body#art ul {
	list-style-type: square;
	margin-left: 15px;
}

/* header */
header {
	position: absolute;
	top: 0;
	width: 100%;
}

/* Form */
.bab-form {
	width: inherit;
}

.bab-form,
.bab-form td {
	border: 0px;
}

.bab-form-colonne-gauche {
	width: 25%;
}

.bab-form-submit {
	padding: 5px;
	background-color: #aaa;
}

.bab-form input,
.bab-form textarea {
	padding: 3px;
	background-color: #eee;
	border: 1px solid #bbb
}

.bab-form-erreur {
	color: #F00;
}

.confirmation-mail {
	display: none;
}

/* Message de notification bootstrap3 */
.alert {
	padding: 15px;
	margin-bottom: 20px;
	border: 1px solid transparent;
	border-radius: 4px;
}

.alert-success {
	color: #3c763d;
	background-color: #dff0d8;
	border-color: #d6e9c6;
}

.alert-success hr {
	border-top-color: #c9e2b3;
}

.alert-success .alert-link {
	color: #2b542c;
}

.alert-info {
	color: #31708f;
	background-color: #d9edf7;
	border-color: #bce8f1;
}

.alert-info hr {
	border-top-color: #a6e1ec;
}

.alert-info .alert-link {
	color: #245269;
}

.alert-warning {
	color: #8a6d3b;
	background-color: #fcf8e3;
	border-color: #faebcc;
}

.alert-warning hr {
	border-top-color: #f7e1b5;
}

.alert-warning .alert-link {
	color: #66512c;
}

.alert-danger {
	color: #a94442;
	background-color: #f2dede;
	border-color: #ebccd1;
}

.alert-danger hr {
	border-top-color: #e4b9c0;
}

.alert-danger .alert-link {
	color: #843534;
}

/* Flex */
/*-- Container */
.flex-justify-start {
	-webkit-box-pack: start;
	justify-content: flex-start;
	-webkit-justify-content: flex-start;
	-ms-flex-pack: flex-start;
}

.flex-justify-end {
	-webkit-box-pack: end;
	justify-content: flex-end;
	-webkit-justify-content: flex-end;
	-ms-flex-pack: flex-end;
}

.flex-justify-center {
	-webkit-box-pack: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}

.flex-justify-spacea {
	justify-content: space-around;
	-webkit-justify-content: space-around;
	-ms-flex-pack: space-around;
}

.flex-justify-spaceb {
	-webkit-box-pack: justify;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
}

.flex-align-start {
	-webkit-box-align: start;
	-ms-flex-align: start;
	align-items: flex-start;
	-webkit-align-items: flex-start;
}

.flex-align-end {
	-webkit-box-align: end;
	-ms-flex-align: end;
	align-items: flex-end;
	-webkit-align-items: flex-end;
}

.flex-align-center {
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-align-items: center;
}

.stretch {
	-ms-flex-line-pack: stretch;
	align-content: stretch;
	-webkit-align-content: stretch;
}

.align-content-spaceb {
	-ms-flex-line-pack: justify;
	align-content: space-between;
	-webkit-align-content: space-between;
}

/*-- Items --*/
.item-align-center {
	-ms-flex-item-align: center;
	align-self: center;
	-webkit-align-self: center;
}

.item-align-start {
	-ms-flex-item-align: start;
	align-self: flex-start;
	-webkit-align-self: flex-start;
}

.item-align-end {
	-ms-flex-item-align: end;
	align-self: flex-end;
	-webkit-align-self: flex-end;
}

/* General */
html,
body {
	height: 100%;
}

body {
	font-family: "Roboto Condensed", sans-serif;
}

.disabled {
	display: none !important;
}

#form_wrapper input[type="submit"] {
	background-color: rgba(0, 79, 146, 1) !important;
	border: 0 !important;
	color: #FFF;
}

a {
	text-decoration: none;
}

.disScroll {
	overflow: hidden;
	position: fixed;
	width: 100%;
}

.bg-noir {
	background-color: #000;
}
.bg-bleu-europe {
	background-color: #00349a;
}

.bg-jaune {
	background-color: #ffcb00
}

.bg-alpha {
	background-color: rgba(255, 255, 255, 0.8)
}

.bg-bleu {
	/*background-image:url('/upload/bg-site.jpg');*/
	background-repeat: no-repeat;
	background-position: center center;
	position: relative;
	background-size: cover;
	z-index: 0;
}

.bg-bleu:after {
	background-color: rgba(0, 79, 146, 0.85);
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
	content: "";
}

.cd-btn,
.cd-panel {
	display: none;
}

.mailto span {
	display: none;
}

.button {
	background-color: #004f92;
	color: #fff !important;
	text-transform: uppercase;
	padding: 0.5em 1.5em 0.5em 2.5em;
	display: inline-block;
	font-size: 0.9em;
	background-image: url(/theme/geographe/img/chevron-right.png);
	background-position: 1em center;
	background-repeat: no-repeat;
	background-size: 20px;
}

.content-button {
	background-color: #dfdfdf;
	padding: 0 0.2em;
	display: inline-block;
	border-radius: 3px;
}
.block-button {
	background-color: #004f92;
	color: #fff !important;
	padding: 0.5em 1em;
	display: inline-block;
	font-size: 1em;
	display: block;
  	width: fit-content;
  	margin: 30px auto;
}
.block-button a {
	color: white !important;
}
.prev {
	background-image: url(/theme/geographe/img/chevron-left.png);
}

.button:hover {
	color: #FFF
}

#button-actu {
	position: relative;
	z-index: 9;
	background-color: #fff;
	color: #004f92;
	text-transform: uppercase;
	padding: 0.8em 1.5em 0.8em 1.5em;
	display: inline-block;
	font-size: 1em;
	font-weight: 500;
}
.col2 {
	-webkit-column-count: 2;
	column-count: 2;

	-webkit-column-gap: 60px;
	column-gap: 60px;
}

.pam.bg-alpha.entete.mtl.mbl.center {
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	padding-left: 50px;
	padding-right: 50px;
}

.txtcenter.chemindefer a {
	color: #004f92;
	font-size: 16px;
	font-style: italic;
}

/* Layout */
#langues {
	position: absolute;
	/* background-color: rgba(0, 0, 0, 0.4); */
	background-color: rgba(0, 52, 154, 0.6);
	top: 0;
	left: 50%;
	padding: 0.2em 0.7em;
}

#langues>a {
	color: #FFF;
}

#langues>a:nth-of-type(1) {
	display: inline-block;
	padding-right: 0.5em;
	border-right: 1px solid #fff
}

#langues>a:nth-of-type(2) {
	padding-left: 0.5em;
}

#main,
#int {

	position: relative;
}

#int {
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	height: 400px;
}

#main #animate, #int #animate {
	position: relative;
	top: 0;
	height: 100vh;
	width: 100%;
	left: 0;
	z-index: -1;
}

#homeSlider {
	height: 100%;
}
#swiper {
	height: 500px;
	margin: 30px 0;
}

#homeSlider span, #swiper span {
	display: block;
	height: 100%;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
}
.container-band {
	height: 100%;
}

#main {
	height: 70vh;
}

#bandeau {
	background-color: rgba(255, 255, 255, 0.8);
	margin-top: 4em;
}

/* #bandeau #logo {position:absolute;top:-4em;left:0;max-width:200px;} */
#bandeau #logo img {
	position: absolute;
	top: -70%;
	left: 0;
	width: 440px;
}

#bandeau #logo p {
	/* position: absolute;
	top: -97px;
	top : -65px;
	left: 0; */
	padding: 24px 40px;
	font-size: 5rem;
	color: white;
	margin-top: -1.5em;
	background-color: rgb(0, 0, 0);
}

#main header {
	/*margin-bottom:20em;*/
}

/* #news {margin-bottom:35%;} */
.bg-bleu #news {
	margin-bottom: 0;
}

.entete h1 {
	/* font-family: "Playball", sans-serif; */
	font-size: 3.5em;
	margin-bottom: 0;
	font-weight: 500;
	text-align: center;
}

.news-top {
	position: absolute;
	bottom: 5%;
	left: 50%;
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
	transform: translateX(-50%);
}

.news-footer {
	z-index: 1030;
	position: relative;
}

/* Menus - fonts - colors */
nav>ul {
	position: relative;
	z-index: 2;
}
nav>ul>li {
	display: inline-block;
}

nav>ul>li>a {
	text-transform: uppercase;
	padding: 0.8em;
	display: inline-block;
	font-size: 1.1em;
	font-weight: 600;
}

nav>ul>li>a:hover {
	background-color: #004f92;
	color: #FFF;
	-webkit-transition: all 100ms ease-in-out;
	transition: all 100ms ease-in-out;
}

nav>ul>li.hasSub>ul {
	position: absolute;
	max-height: 0;
	overflow: hidden;
	width: 15em;
	padding: 0;
	list-style-type: none;
	background-color: #004f92;

	-webkit-transition: all 300ms ease-in-out;
	transition: all 300ms ease-in-out;
}

nav>ul>li.hasSub>ul>li>a {
	display: inline-block;
	padding: 0.6em 1em;
	color: #FFF;
}

nav>ul>li.hasSub>ul>li>a:hover {
	color: #e5bc4d
}

nav>ul>li.hasSub:hover>ul {
	max-height: 25em;
	-webkit-transition: all 300ms ease-in-out;
	transition: all 300ms ease-in-out;
}
/* commanter Style produit  */

/* nav>ul>li:last-child {
	background-color: #004f92;
	margin-left: 0.5em;
}

nav>ul>li:last-child>a {
	color: #FFF;
	padding: 0.8em 1em;
}

nav>ul>li:last-child>a:before {
	content: "";
	font-family: FontAwesome;
	color: #1784e3;
	margin-right: 0.3em;
	font-weight: 300
} */

/* Spécifique homepage */
.news .flex-container {
	background-color: rgba(255, 255, 255, 0.7)
}
.news .news-image {
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	height: 300px;
	width: 100%;
}
.fils .news-image {
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	width: 30%;
}

.news .news-content {
	padding: 3em;
}

.news .news-content h2 {
	margin-bottom: 0.5em;
	font-size: 1.2em;
	text-transform: uppercase;
}

#news .pagination {
	text-align: center;
	margin: 30px;
}

#news .swiper-pagination-bullet {
	width: 20px;
	height: 20px;
	margin: 0 0.2em;
	background-color: rgba(0, 79, 146, 1);
}

#news .inside-pagination .swiper-pagination-bullet {
	background-color: rgba(255, 255, 255, 1);
}

#circles {
	position: relative;
	bottom: 9em;
	margin-bottom: -7em;
}

#circles>a {
	display: block;
	padding: 1em;
	width: 25%;
	text-align: center
}

#circles .thumb,
#assoc .thumb {
	display: inline-block;
	height: 16em;
	width: 16em;
	margin: 0 auto;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: auto 160px;
	background-color: #FFF;
	border: 5px solid #004f92;
	border-radius: 150px;
}

#circles .name,
#assoc .name {
	display: inline-block;
	text-transform: uppercase;
	font-size: 1.3em;
	font-weight: 600;
	margin-top: 0.5em;
}

#assoc {
	margin-top: -5em;
	position: relative;
	bottom: 5em;
	position: relative;
	z-index: 2;
}

#assoc .name {
	color: #FFF;
}



#assoc2 {
	margin: 4rem auto 4rem auto;
	width: 100%;
}

#assoc2 .w33 {
	padding: 10px;
}

#assoc2 a {
	position: relative;
  	/* height: 300px; */
	aspect-ratio: 1.1 / 1;
}

#assoc2 .thumb{
	display: block;
	height: 100%;
	width: 100%;
	margin: 0 auto;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	background-color: #FFF;
	border: 1px solid #eee;
}

#assoc2 .name {
	position: absolute;
  bottom: 0;
  left: 0;
  padding: 10px;
  font-size: .9em;
  text-shadow: .1em .1em .2em #000;
  background-color: rgba(0,0,0,.8);
  color: white;
  font-size: 1.2em;
}

#content-home {
	margin: 4rem 0;

}

#content-home h1 {
	margin-bottom: 1em;
	text-align: center;
	font-weight: 400
}

#content-home p {
	font-size: 1.2em;
	padding-bottom: 0.5em
}



.sub-summary-list {
	display: none;
	margin-left: 1rem;
}

.sub-summary-list.open {
	display: block;
}

.summary-toggle {
	cursor: pointer;
	font-weight: bold;
	margin-right: 6px;
	user-select: none;
}

.summary-toggle.hidden {
	display: none;
}

.h3-item {
	font-size: 0.8em;
}


/* Contenu */
.content p,
.contenu ul,
.contenu p {
	margin: 0;
	padding-bottom: 1em;
	font-size: 1.2em;
}
.chapeau {
	font-weight: 600;
	margin-bottom: 50px;
  	position: relative;
}

.chapeau::after {
	content: "";
	width: 30%;
	height: 2px;
	position: absolute;
	bottom: -15px;
	left: 50%;
	transform: translateX(-50%);
	background-color: #d3d3d3;
  }

.contenu p {
	padding-bottom: 1em;
	text-align: justify;
}

.contenu ul {
	padding-left: 1em
}

.contenu h2 {
	font-weight: 400;
	border-bottom: 1px solid rgba(0, 0, 0, 0.2)
}
.contenu h3 {
	font-size: 2.3rem;
    font-weight: 400;
}

.contenu a {
	color: rgba(0, 79, 146, 1);
}

.contenu .vignette {
	/* float: left; */
	display: block;
	margin: 20px 0;
}
.fils {
	background: #f9f9f9;
  	margin: 10px;
}
.fils .vignette {
	height: 200px;
	width: auto;
	display: block;
	overflow: hidden;
} 
.fils .vignette img{
	height: 100%;
	width: 100%;
	object-fit: cover;
}
.h3-title {
	font-size: 1.3em;
    font-weight: 600;
}

.fils h3 {
	text-align: center;
	font-size: 2rem;
}
.fils .chapeau {
	text-align: left;
	padding: 10px;
	font-weight: unset;
}

.fils .suite {
	padding: 10px;
  display: inline-block;
  background: rgba(0, 79, 146, 1);
  margin: 10px auto 10px auto;

}
.fils .suite a{
	color: #fff;
}

.contenu table,
.contenu table td {
	border: 1px solid rgba(0, 0, 0, 0.1)
}

.img-pdt {
	/*background-image:url('/theme/geographe/img/fond-produits.jpg');
	background-repeat;no-repeat;
	background-position:center center;
	background-size:cover;
	height:682px;*/
	margin-bottom: 15em;
	position: relative;
	z-index: 1;
}

.img-pdt:after {
	position: absolute;
	top: 30%;
	left: 0;
	background-color: #ddd;
	width: 100%;
	height: 40%;
	content: "";
	z-index: -1;
}

/* Forms */

/* Gallery */
.bg-img_fancy3col {
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	width: 100%;
	height: 200px;
  }
/* Footer */
footer,
footer a {
	color: #FFF;
}

footer a:hover {
	color: #FFF;
}


.navbar-rom {
	width: 70% !important;
}
.btn-slideDown.js-scrollTo {
	background-color: #e5bc4d;
	color: #111;
	text-transform: uppercase;
	padding: 7px 15px;
	font-weight: 700;
	display: flex;
	align-items: center;
}
.btn-slideDown.js-scrollTo .fa.fa-caret-down {
	margin-right: 5px;
	font-size: 17px;
}



/* section-video --------------- */
.video-wrapper {
	position: relative;
	overflow: hidden;
}
.container-video {
	height: 100vh;
	position: relative;
	width: 100%;
	margin: auto;
	display: block;
}
.btn-play {
	width: 100px;
	height: 100px;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
.btn-play, .btn-pause {
	position: absolute;
	z-index: 11;
	border-radius: 50%;
	background-color: rgba(0, 0, 0, .5);
	border: 0;
	display: flex;
	align-items: center;
	justify-content: center;
}
.btn-pause .fa, .btn-play .fa {
	color: #fff;
}
.btn-play .fa {
	font-size: 44px;
	padding-left: 7px;
}
.btn-pause {
	font-size: 25px;
}
.btn-pause {
	width: 50px;
	height: 50px;
	bottom: 30px;
	left: 30px;
}
#homeVideo {
	position: absolute;
	left: 50%;
	top: 50%;
	min-width: 100%;
	min-height: 100%;
	display: block;
	width: 100%;
	height: auto;
	transform: translate(-50%, -50%);
}
.mob-acces-video a {
	background-color: #e5bc4d;
	padding: 25px 40px;
	font-weight: 700;
	text-transform: uppercase;
	margin-bottom: 4em;
}


/* ************************** */

#summary {
	background: #f9f9f9;
	border: 1px solid #aaa;
	border-radius: 4px;
	-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
	box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
	display: table;
	margin: 1em 0;
	padding: 10px 20px 10px 10px;
	position: relative;
	width: auto;
  }

.hide {
	display: none !important;
}

#search {
	border: 1px solid #333;
	padding: 10px;
	letter-spacing: 0.75px;
	color: #333;
	width: 100%;
}
.tag {
	padding: 10px;
  margin: 5px;
  background: #eee;
  overflow: hidden;
  display: inline-block;
}
/* SweetAlert */
.large-swal {
	font-size: 20px !important;
}
.large-swal input {
	width: 100%;
  	margin: 20px 0;
	  font-size: 16px;
}
#copy-btn {
	background-color: #0d4a80;
}

#tarteaucitronIcon {
	display: none !important;
}

/* --- Responsive -------------------------------------------------------- */
@media screen and (max-width: 1600px ) {
	.navbar-rom {
		width: 90% !important;
	}
}

@media (max-width: 1300px) {

	/*#main header {margin-bottom:10em;}*/
	#news {
		width: 65%;
	}


	#news {
		bottom: 22%;
	}

	.bg-bleu #news {
		margin: 1em auto;
		width: 85%;
	}

	#content-home {
		width: 75%;
	}
}

@media (max-width: 1200px) {

	.bloc-960 {
		display: block !important;
	}

	.no-960 {
		display: none;
	}

	.navbar-rom {
		align-items: center;
	}

	.news-image,
	#langues {
		display: none;
	}

	#bandeau {
		position: initial;
		margin-top: 0;
		background-color: #0d4a80;
	}
	#bandeau #logo img {
		position: inherit;
		width: 300px;
	}

	.article-content {
		width: 70% !important;
	}
	.sidebar {
		width: 25% !important;
	}

	#circles .thumb,
	#assoc .thumb {
		width: 10em;
		height: 10em;
	}

	#langues-mob {
		padding: 0 1em;
	}

	#langues-mob>a {
		font-size: 1.2em;
		color: #FFF;
		margin: 0 0.2em;
		padding: 0.3em;
		border: 1px solid rgba(255, 255, 255, 0.5);
	}



	.entete {
		margin-top: 8em !important;
	}

	.cd-btn {
		color: #0d4a80;
		display: inline-block;
		padding: 0.5em 0.8em;
		position: relative;
		-webkit-transition: all 0.2s ease 0s;
		transition: all 0.2s ease 0s;
		/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/rgba(0,79,146,1)+0,2b2e83+100 */
		background: rgba(255, 255, 255, 1);
		/* background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 79, 146, 1)), to(rgba(0, 79, 146, 1)));
		background: linear-gradient(to bottom, rgba(0, 79, 146, 1) 0%, rgba(0, 79, 146, 1) 100%); */
		/* W3C */
		filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='rgba(0,79,146,1)', endColorstr='rgba(0,79,146,1)', GradientType=0);
		/* IE6-9 */
	}

	.cd-panel {
		display: block;
		height: 100%;
		left: 0;
		position: fixed;
		top: 0;
		-webkit-transition: visibility 0s ease 0.6s;
		transition: visibility 0s ease 0.6s;
		visibility: hidden;
		width: 100%;
		z-index: 999;
	}

	.cd-panel::after {
		background: transparent none repeat scroll 0 0;
		cursor: pointer;
		height: 100%;
		left: 0;
		position: absolute;
		top: 0;
		-webkit-transition: background 0.3s ease 0.3s;
		transition: background 0.3s ease 0.3s;
		width: 100%;
	}

	.cd-panel.is-visible {
		-webkit-transition: visibility 0s ease 0s;
		transition: visibility 0s ease 0s;
		visibility: visible;
	}

	.cd-panel.is-visible::after {
		background: rgba(0, 0, 0, 0.6) none repeat scroll 0 0;
		-webkit-transition: background 0.3s ease 0s;
		transition: background 0.3s ease 0s;
	}

	.cd-panel.is-visible .cd-panel-close::before {
		-webkit-animation: 0.6s ease 0.3s normal none 1 running cd-close-1;
		animation: 0.6s ease 0.3s normal none 1 running cd-close-1;
	}

	.cd-panel.is-visible .cd-panel-close::after {
		-webkit-animation: 0.6s ease 0.3s normal none 1 running cd-close-2;
		animation: 0.6s ease 0.3s normal none 1 running cd-close-2;
	}

	.cd-panel-header {
		-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.08);
		box-shadow: 0 1px 1px rgba(0, 0, 0, 0.08);
		height: 50px;
		line-height: 50px;
		position: fixed;
		-webkit-transition: top 0.3s ease 0s;
		transition: top 0.3s ease 0s;
		width: 70%;
		z-index: 1001;
		/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/rgba(0,79,146,1)+0,2b2e83+100 */
		background: rgba(0, 79, 146, 1);
		/* Old browsers */
		/* FF3.6+ */
		/* Chrome,Safari4+ */
		/* Chrome10+,Safari5.1+ */
		/* Opera 11.10+ */
		/* IE10+ */
		background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 79, 146, 1)), to(rgba(0, 79, 146, 1)));
		background: linear-gradient(to bottom, rgba(0, 79, 146, 1) 0%, rgba(0, 79, 146, 1) 100%);
		/* W3C */
		filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='rgba(0,79,146,1)', endColorstr='rgba(0,79,146,1)', GradientType=0);
		/* IE6-9 */
	}

	.from-right .cd-panel-header,
	.from-left .cd-panel-header {
		top: -50px;
	}

	.from-right .cd-panel-header {
		right: 0;
	}

	.from-left .cd-panel-header {
		left: 0;
	}

	.is-visible .cd-panel-header {
		top: 0;
		-webkit-transition: top 0.3s ease 0.3s;
		transition: top 0.3s ease 0.3s;
	}

	.cd-panel-close {
		display: inline-block;
		height: 100%;
		overflow: hidden;
		position: absolute;
		right: 0;
		/*text-indent: 100%;*/
		text-align: center;
		top: 4px;
		white-space: nowrap;
		width: 60px;
		color: #FFF;
	}

	.cd-panel-container {
		background: rgba(255, 255, 255, 1) none repeat scroll 0 0;
		height: 100%;
		position: fixed;
		top: 0;
		-webkit-transition-delay: 0.3s;
		transition-delay: 0.3s;
		-webkit-transition-duration: 0.3s;
		transition-duration: 0.3s;
		-webkit-transition-property: -webkit-transform;
		transition-property: -webkit-transform;
		transition-property: transform;
		transition-property: transform, -webkit-transform;
		width: 70%;
		z-index: 1000;
	}

	.from-right .cd-panel-container {
		right: 0;
		-webkit-transform: translate3d(100%, 0px, 0px);
		transform: translate3d(100%, 0px, 0px);
	}

	.from-left .cd-panel-container {
		left: 0;
		-webkit-transform: translate3d(-100%, 0px, 0px);
		transform: translate3d(-100%, 0px, 0px);
	}

	.is-visible .cd-panel-container {
		-webkit-transform: translate3d(0px, 0px, 0px);
		transform: translate3d(0px, 0px, 0px);
		-webkit-transition-delay: 0s;
		transition-delay: 0s;
	}

	.cd-panel-content {
		height: 100%;
		left: 0;
		overflow: auto;
		position: absolute;
		top: 50px;
		width: 100%;

	}

	.cd-panel-content.limitSize {
		overflow: scroll;
	}

	.cd-panel-content>ul>li>a {
		display: block;
		padding: 0.3em 0.6em;
		font-size: 1.3em;
		border-bottom: 1px solid rgba(0, 0, 0, 0.1);
	}

	.cd-panel-content>ul>li>a:hover {
		background-color: rgba(0, 0, 0, 0.1);
	}

	.cd-panel-content>ul>li.hasSub>ul {
		padding: 0;
		list-style-type: none;
	}

	.cd-panel-content>ul>li.hasSub>ul>li>a {
		display: block;
		padding: 0.5em 0.8em;
		background-color: rgba(0, 0, 0, 0.2);
	}

}

@media (max-width: 768px) {

	.pam.bg-alpha.entete.mtl.mbl.center {
		padding-left: 10px;
		padding-right: 10px;
		bottom: 10%;
		left: 50%;
		transform: translate(-50%, -10%);
		width: 90%;
	}
	.pam.bg-alpha.entete.mtl.mbl.center h1{
		font-size: 3em;
	} 
	#circles>a {
		width: 50%;
	}

	#circles .name,
	#assoc .name {
		font-size: 0.9em;
	}

	.small-pas {
		padding: 1em !important;
	}

	#circles {
		bottom: 6em;
	}

	.contenu img {
		float: none;
		width: 100%;
		margin-bottom: 2em;
	}
	.article-content {
		width: 100% !important;
		padding: 20px 10px !important;
	}
	.sidebar {
		width: 100% !important;
	}
	.fils {
		width: 100% !important;
	}
}

@media (max-width: 576px) {

	#int {
		height: 100vh;
	}
	/* .contenu .vignette {
		float: none;
		margin: 0;
	} */
	.swiper-slide {
		width: 100% !important;
	}

}

@media (max-width: 400px) {
	#bandeau #logo img {
		width: 250px;
	}
}