/* @override
	http://drup.fgfc.ch/themes/bs_subtheme/css/style.css?otlc7u
	http://fgfc.drup.ch/themes/bs_subtheme/css/style.css?*
*/
 
 @font-face {
  font-family: "DinBold";
  src: url("fonts/D-DIN-Bold.woff2") format("woff2"),
         url("fonts/D-DIN-Bold.woff") format("woff"),
         url("fonts/D-DIN-Bold.ttf") format("ttf"),
         url("fonts/D-DIN-Bold.otf") format("otf");
 }
 @font-face {
  font-family: "DinReg";
  src: url("fonts/D-DIN.woff2") format("woff2"),
         url("fonts/D-DIN.woff") format("woff"),
         url("fonts/D-DIN.ttf") format("ttf"),
         url("fonts/D-DIN.otf") format("otf");
 }
 
 body {
 	font-family: 'DinReg', sans-serif;
 	letter-spacing: .01em;

 	font-variant-numeric: linear-nums;
 	  -moz-font-feature-settings: "lnum" 1;
 	  -webkit-font-feature-settings: "lnum" 1;
 	  -ms-font-feature-settings: "lnum" 1;
 	  font-feature-settings: "lnum" 1;
 	margin: 0;
 	  
 	font-weight: 400;
 	background-color: #FFF;
 	
 	font-size: 18px;
 	font-size: 21px;
 	line-height: 1.33;
 	color: #333;
 	
 	
 	-webkit-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 	text-rendering: optimizeLegibility;
 }
 
 .user-login-form {
 	max-width: 500px;
 	margin: 3em auto 2em;
 } 
 
 

 

 
 /* @group TYPO & HELPERS */
 
 h1, h2, h3, h4 {
 	font-weight: 400;
 }
 h1 {
 	font-size: 2.5em;
 	padding-top: 16px;
 	color: #eb2730;
 }
 
 h2 {
 	font-size: 1.75em;
 	color: #eb2730;
 	margin: 0 0 .75em;
 }
 h3 {
 	margin: 0 0 .5em;
 }
 p {
 	margin-bottom: 1em;
 }
 strong, bold, b {
 	font-family: DinBold;
 	font-weight: 400;
 }
 a {
 	-webkit-transition: all .25s ease;
 	-moz-transition: all .25s ease;
 	-ms-transition: all .25s ease;
 	-o-transition: all .25s ease;
 	transition: all .25s ease;
 	
 	color: #eb2730;
 }
 a:hover {
 	color: #000;
 }
 .p0 {
 	padding-left: 0!important;
 	padding-right: 0!important;
 }
 h1 span {
 	background-color: #FFF;
 	padding-left: 1px;
 }
 p.chapeau {
 	font-size: 1.25em;
 	margin-bottom: 1em;
 	/*color: #EB2730;*/
 	/*font-family: 'DinBold';*/
 }
 p.exergue {
 	font-size: 1.25em;
 	background: #FFF;
 	padding: 1em;
 	border: 7px solid #FFF126;
 }
 .center-text {
 	text-align: center;
 }
 .encadre {
 	border: 10px solid #FFF126;
 	padding: 15px;
 }
 .field ul {
 	 position: relative;
 	 	list-style-type: none;
 	 	margin-left: 0;
 	 	padding-left: 1.75em;
 }
 .field ul li {
 	margin-bottom: 1em;
 	max-width: 500px;
 }
 .field ul li:before {
 	content: "\279E";
 	position: absolute;
 	color: #EB2730;
 	left: 0;
 }
 
 .bg-gris {
 	background-color: #EFEFEF;
 	padding-bottom: 5em;
 }
 /* Formulaires */
 .form-control {
 	border-radius: 0;
 	border: 1px solid #999;
 }
 
 /* BS colors */
 .select-wrapper:after {
 	color: #eb2730;
 }
 .btn {
 	padding: .33em 1.2em;
 	font-family: 'DinBold', sans-serif;
 	font-size: 1em;
 	background-color: #eb2730;
 	color: #FFF;
 }
 .btn-default, .btn-primary {
 	/*background: -webkit-linear-gradient(left, #f9bb28 0%, #f1672c 100%) #fff126;
	background: -moz-linear-gradient(left, #f9bb28 0%, #f1672c 100%) #fff126;
 	background: linear-gradient(to right, #f9bb28 0%, #f1672c 100%) #fff126;
 	border: 0;*/
 	background-color: #eb2730;
 	border: 0;
 }
 .btn-default:hover,
 .btn-primary:hover,
 .btn-primary:focus,
 .btn-primary.focus {
 	/*background: -webkit-linear-gradient(left, #f1672c 0%, #f9bb28 100%) #fff126;
 	background: -moz-linear-gradient(left, #f1672c 0%, #f9bb28 100%) #fff126;
 		background: linear-gradient(to right, #f1672c 0%, #f9bb28 100%) #fff126;*/
 }
 .btn-download,
 .btn-arrow {
 	padding-left: 1em;
 }
 .btn:before {
 	font-family: 'Glyphicons Halflings';
 }
 .btn-download:before {
 	content: '\e022';
 	display: inline-block;
 	margin-right: .5em;
 	
 }
 .btn-arrow:before {
 	content: '\e080';
 	margin-right: .5em;
 }

 
 /* @end */
 
 /* @group STRUCTURE */
 #navbar .region-navigation,
 .region-footer,
 .max-width,
 h1.page-header {
 	overflow: hidden;
 	padding-left: 15px;
 	padding-right: 15px;
 	max-width: 1320px;
 	margin: auto;
 	position: relative;
 }
 h1.page-header {
 	padding: 1em 15px 0;
 	border: 0;
 }
 .main-container {
 	padding-top: 90px;
 	background: #FFF;
 }
 
 
 .block-views,
 .region-blocks,
 .page-node-type-article article {
 	padding-top: 3em;
 	padding-bottom: 5em;
 }
 h2.block-title {
 	text-align: center;
 }
 .region-blocks .block {
 	margin-bottom: 4em;
 }
 .page-banner {
 	border: 0;
 	margin: 0 auto 0;
 	background-color: #FFF !important;
 	height: 50vh;
 	position: relative;
 }
 .page-banner h1 {
 	margin-top: 25vh;
 }

 .banner-img {
 	width: 50%;
 	float: right;
 }
 
 /* @end */
 
 /* @group NAVBAR Desktop */
 
 #navbar {
 	border: 0;
 	background: #FFF;
 	position: relative;
 	position: fixed;
 	z-index: 20;
 	width: 100%;
 	height: 90px;
 	border-radius: 0;
 	top: 0;
 	padding-left: 0;
 	padding-right: 0;
 	padding-top: 12px;
 	max-width: none;
 }
 
 .navbar-header {
 	width: 100%;
 }
 header.navbar {
 	position: relative;
 }
 #navbar:after,
 .footer:before{
 	content: '';
 	width: 100%;
 	height: 5px;
 	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#fff126+0,eb2730+100 */
 	background: #fff126; /* Old browsers */
 	background: -moz-linear-gradient(left,  #fff126 0%, #eb2730 100%); /* FF3.6-15 */
 	background: -webkit-linear-gradient(left,  #fff126 0%,#eb2730 100%); /* Chrome10-25,Safari5.1-6 */
 	background: linear-gradient(to right,  #fff126 0%,#eb2730 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
 	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fff126', endColorstr='#eb2730',GradientType=1 ); /* IE6-9 */
 	position: absolute;
 	bottom: 0;
 }
 .degrade:before {
 	background: #eb2730;
 	top: 0;
 	bottom: inherit;
 	margin-left: -1em;
 }

 .navbar-default .logo {
 	position: static;
 	float: left;
 	width: 320px;
 	
 }
 .logo img {
 	width: 100%;
 }
 .menu-main {
 	overflow: hidden;
 	position: absolute;
 	right: 0;
 	top: 34px;
 }
 .navbar-nav > li {
 }
 .menu-main ul.menu > li a {
 	padding: 5px ;
 	margin: 5px 10px;
 	text-transform: uppercase;
 	color: #666;
 	background-color: none;
 }
 .menu-main ul.menu li a.is-active,
 .menu-main ul.menu li a:hover,
 .navbar-default .navbar-nav > .active > a,
 .navbar-default .navbar-nav > .active > a:hover,
 .navbar-default .navbar-nav > .active > a:focus {
 	color: #EB2730;
 	background-color: transparent!important;
 }
 
 /* @end */
 
 
 
 /* @end */
 
 /* @group OFF CANVAS */
 
 /* @group OFF CANVAS */
 
 #offCanvas {
   background-color: rgba(255,255,255,.95);
   transition: all .3s ease-out;
   position: fixed;
   top: 0;
   right: -110%;
   z-index: 10;
   width: 100%;
   height: 100%;
   text-align:center;
   opacity: 0;
 }
 #offCanvas.open {
   top: 0;
   right: 0;
   opacity: 1;
 }
 #offCanvas ul {
   text-align: center;
   padding: 0;
   margin: 0;
 }
 #offCanvas .region-offcanvas {
   width: 80%;
   max-width: 300px;;
   margin: 120px auto 0 0;
   transition: all 1s ease-in-out .3s;
 }
 #offCanvas.open .region-offcanvas {
 }
 #offCanvas a {
   color: #454545;
   text-transform: uppercase;
   font-weight: 500;
   text-shadow: 1px 1px 0 rgba(255,255,255,.3);
 }
 #offCanvas .menu-type {
 	display: block;
 }
 #offCanvas .menu-type a {
 	color: #FFF;
 }
 a.menu_icon {
   padding-left: 24px;
 }
 #offCanvas a:hover,
 #offCanvas a.active {
   color: #FFF;
   background-color: #666;
   text-shadow: none;
 }
 #offCanvas .block-menu-block ul li {
   display: block;
   list-style-image: none;
   list-style-type: none;
   margin: 0 2px;
   padding: 0;
 }
 #offCanvas .dropdown-menu {
 	position: static;
 	display: block;
 	background: none;
 	box-shadow: none;
 	border: 0;
 	width: 100%;
 }
 #offCanvas .dropdown-menu li {
 	background: transparent;
 }
 #offCanvas .dropdown-menu a,
 #offCanvas .menu-mobile a {
 	padding: 10px;
 	background-color: #DDD;
 }
 #offCanvas .dropdown-menu a.active,
 #offCanvas .dropdown-menu a:hover {
 	background: #666;
 }
 #offCanvas .dropdown-toggle {
 	font-weight: bold;
 }
 #offCanvas .menu-mobile .dropdown-toggle {
 	background-color: transparent;
 }
 #offCanvas .dropdown-toggle span {
 	display: none;
 }
 /* @end */
 
 /* @group BTN MENU */
 
 /*a#offCanvas-switch {
  	display: none;
 }*/
 a#offCanvas-switch {
   text-indent: -500px;
   position: fixed;
   top: 15px;
   right: 10px;
   display: none;
   width: 36px;
   height: 36px;
   z-index: 23;
 }
 #offCanvas-switch span,
 #offCanvas-switch span:before,
 #offCanvas-switch span:after {
   cursor: pointer;
   border-radius: 1px;
   height: 2px;
   width: 36px;
   background: #eb2730;
   position: absolute;
   display: block;
   content: '';  
 }
 #offCanvas-switch span:before {
   top: 22px;
 }
 #offCanvas-switch span:after {
   bottom: -11px; 
 }
 #offCanvas-switch span, #offCanvas-switch span:before, #offCanvas-switch span:after {
   transition: all 300ms ease-in-out;
 }
 #offCanvas-switch.active span {
   background-color: transparent;
   box-shadow: none;
 }
 #offCanvas-switch.active span:before, #offCanvas-switch.active span:after {
   top: 11px;
   background-color: #eb2730;
 }
 #offCanvas-switch.active span:before {
   transform: rotate(45deg);
   -webkit-transform: rotate(45deg);
 }
 #offCanvas-switch.active span:after {
   transform: rotate(-45deg);
   -webkit-transform: rotate(-45deg);
 }
 
 /* @end */
 
 
 
 /* @end */
 
 
 /* @group NODES & PARAGRAPHS */
 .container {
 	
 }
 article a,
 article a:hover {
 	color: #eb2730;
 }

.paragraph {
	margin-bottom: 1em;
	/*opacity: 0;*/
	overflow: hidden;
	
	-webkit-transition: all 1s ease;
	-moz-transition: all .5s ease;
	-ms-transition: all .5s ease;
	-o-transition: all .5s ease;
	transition: all 1s ease;
}
.paragraph.visible {
	opacity: 1;
}

 .paragraph--type--section-de-page {
 	padding: 10vh 0;
 }
 .paragraph--type--section-de-page:nth-child(odd) {
 	background-color: #EFEFEF;
 }
 .path-frontpage .paragraph--type--section-de-page:nth-child(odd) {
 	background-color: #FFF;
 }

 .paragraph--type--section-de-page:nth-child(odd) .col-md-6,
 .paragraph--type--section-de-page:nth-child(odd) .col-md-7 {
 	float: right!important;
 }
 .paragraph--type--section-de-page:nth-child(odd) .col-md-5,
 .paragraph--type--section-de-page:nth-child(odd) .col-md-4 {
 	margin-left: 0!important;
 }
 
 /* front */
 /*.paragraph--id--7 .col-md-7 {
 	float: right!important;
 	font-size: 1.25em;
 }
 .paragraph--id--7 .col-md-7 .section-txt { 
 	margin: 15px;
 	border: 15px solid #FFF126;
 	padding: 1em;
 }
 .paragraph--id--8 {
		
 }
 .path-frontpage .paragraph--type--section-de-page:nth-child(even) .col-md-5,
 .path-frontpage .paragraph--type--section-de-page:nth-child(even) .col-md-4 {
 	margin-left: 0!important;
 }
 
 .paragraph--id--7 .col-md-7 {
 	background
 }*/
 
 /* @group ACCORDEON */
 
 .paragraph--type--accordeon {
 	margin-bottom: 1em;
 	clear: both;
 }
 .acc-title {
 	background-color: #eb2730;
 	cursor: pointer;
 	color: #FFF;
 	padding: 10px 20px;
 	margin: 0;
 }
 .acc-title:hover {
 	opacity: .9;
 }
 .acc-title:before {
 	font-family: arial;
 	display: block;
 	float: right;
 	content: "+";
 	font-size: 30px;
 	line-height: 28px;
 }
 .acc-title.active:before {
 	content: "–";
 }
 
 .acc-body {
 	padding: 20px 20px 30px;
 	background-color: #F0F0F0;
 }
 
 /* @end */
 
 
 
 /* @end */
 .path-frontpage article {
 	padding: 4vh 0 30vh;
 	
 }
 .path-frontpage .region-blocks .block {
 	
 }
 .field img {
 	max-width: 100%;
 	height: auto;
 }
 .region-blocks .home-emplois,
 .region-blocks .home-missions {
 	margin-bottom: 8em;
 }
 .home-schema {
 	text-align: center;
 }
 .home-schema img {
 	width: 100%;
 }
 .home-missions > .field {
 	border: 14px solid #FFF126;
 	padding: 15px;
 }
 .home-missions > .field ul {
		font-size: 1.25em;
}
 
 .view-communication {
 	padding-top: 3em;
 }
 .article-item {
 	margin-bottom: 2em;
 	overflow: hidden;
 	position: relative;
 }
 
.article-item:before {
	
}
.article-inner {
		padding: 1em 1em 2em;
		background-color: #FFF;
		border-top: 3px solid #eb2730;
}
.article-body {
	
}
.page-node-type-article article {
	/*max-width: 720px;*/
}

/* membres */
.picto {
	width: 60px;
}
.view-membres .group-wrapper {
	overflow: hidden;
}
.view-membres .group-content {
	overflow: hidden;
	margin-left: 15px;
	margin-right: 15px;
}
.membre-item {
	margin-bottom: 3em;
	font-size: .875em;
	padding-left: 15px;
	border-left: 1px solid #EB2730;
}
.membre-item strong {
}
.view-membres .group-title {
	margin-left: 15px;
	margin-right: 15px;
	/*border-bottom: 1px solid #CCC;*/
	margin-bottom: 1em;
}

 
 /* @group Footer */
 .footer {
 	background-color: #FFF;
 	position: relative;
 	font-size: .875em;
 	margin: 0;
 }
 .footer:before {
 	top: 0;
 	bottom: inherit;
 }
 .footer-contact {
 	padding-top: 1em;
 	padding-bottom: 1em;
 }
 .footer-contact table {
 	width: 100%;
 }
 .footer-contact td {
 	vertical-align: top;
 }
 .footer-contact td:last-child {
 }
 /* @end */
 
 
 #block-custommap {
 	height: 10%;
 	padding-bottom: 40%;
 	min-height: 360px;
 	width: 100%;
 }
 
 
 
 /* @group CONTACT */

 
 
 /* @end */
  @media (max-aspect-ratio: 1/1) {
 	.overhead .group-banner,
 	.group-banner {
 		padding-bottom: 50%;
 		overflow: hidden;
 	}
 	.overhead .group-banner img,
 	.group-banner img.img-responsive {
		width: 180%;
		margin-left: -40%;
		height: auto;
		max-width: none;
 	}
 	
 }
 
 
 @media (max-width:1024px) {
 	.overhead {
 		margin-top: 60px;
 	}
 .menu-main {
 		display: none;
 		/*position: fixed;
 		right: -320px;
 		max-width: 400px;
 		top: 70px;
 		transition: all .3s ease-out;
 		z-index: 30;
 		opacity: 0;*/
 	}
 	
 	.navbar-nav {
 		float: none;
 	}
 	.navbar-nav > li {
 		float: none;
 		text-align: center;
 		max-width: none;
 	}
 	.navbar-nav > li > a {
 		font-size: 1.4em;
 		line-height: 180%;
 		display: block;
 	}
 	 a#offCanvas-switch {
 	 	display: block;
 	 }
 	 #navbar {
 	 	border: 0;
 	 	background: #FFF;
 	 	position: fixed;
 	 	top: 0;
 	 	width: 100%;
 	 	height: 60px;
 	 	z-index: 20;
 	 	padding-top: 0;
 	 }
 	 .navbar-default .navbar-brand {
 	 	font-size: 1.3em;
 	 	margin-bottom: 0;
 	 	line-height: 1;
 	 }
 	 .navbar-default .navbar-text {
 	 	font-size: .9em;
 	 	line-height: 100%;
 	 }
 	 
 	 .main-container {
 	 	padding-top: 0em;
 	 }
 }
 
 @media (max-width:600px) {
 	.group-banner {
 		background-attachment: scroll!important;
 	}
 	.paragraph {
 		padding-left: 0!important;
 		padding-right: 0;
 	}
 	.paragraph--type--galerie {
 		margin: 0 ;
 	}
 	.paragraph--type--galerie .col-md-12 {
 		padding: 0;
 	}
 	.main-slogan {
 		top: 20px;
 		width: 95%;
 	}
 	
 	.main-slogan h3 {
 		font-size: 1.3em;
 	}
 	/*.logo,
 	 #node_4 .field--name-body img {
 		width: 80px;
 	}*/

 }