/*
#breadcrumb {
	position: relative;
}

#breadcrumb .container:after, h2.title:after, h3.title:after, h4.title:after, h5.title:after, h6.title:after {
    border: 2px solid #CBBD9A;
    border-radius: 2px;
    position: absolute;
    content: "";
    display: block;
    margin: 0 auto;
    top: -26px;
    left: 0;
    right: 0;
    height: 80px;
    width: 80px;
    margin: 18px auto 18px auto;
}

#breadcrumb .container:after, h2.title.line:after, h3.title.line:after, h4.title.line:after, h5.title.line:after, h6.title.line:after {
    height: 60px;
    width: 2px;
    background-color: #777777;
    border-radius: 0;
    border: none;
    top: -60px;
}
*/



/*  TODO : A déplacer dans le fichier de style principal */

.carousel-inner img {
    width: 100%; /* Simulation d'image pleine page */
}
#fullpage_banner img { /* bandeau page standard */
	width: 100vw; /* Simulation d'image pleine page */
}



header{
	background: white;

}
header > nav {
    box-shadow: 1px 2px 2px #17171729;
}
header #upper-header {
    position:relative;
}

/* surcharge boostrap */
.navbar {
    border-radius: 0;
    border: 0;
	min-height: 40px;
	margin-bottom: 0;
}

#logo{
	position:absolute;
	z-index:1001; /* au dessus du menu */
	top:0;
	left: -180px;  /*calc(13vw - 150px);*/
}
#megamenu {
    margin-left: -30px;
}


@media (max-width: 1380px) { 
	#logo {
		left: -95px;
	}
	#megamenu {
	    margin-left: 40px;
	}
}



#megamenu ul {
	transition: all 0.35s ease-out;
	-webkit-transition: all 0.35s ease-out;
	-moz-transition: all 0.35s ease-out;
	-o-transition:  all 0.35s ease-out;
}


/* Affix : Activation des effets  */
@media ( min-width : 768px) {
	header.affix {
		z-index : 100;
		top: 0;
		width: 100%;
	}
}
@media (min-width: 1380px) { /* eviter les colissions */
	header.affix #megamenu {
		/* transition : 2nd position au retour */ /* encore utile ? */
		transition: all 0.35s ease-out 0.15s;
		-webkit-transition: all 0.35s ease-out 0.15s;
		-moz-transition: all 0.35s ease-out 0.15s;
		-o-transition:  all 0.35s ease-out 0.15s;
	}
}
/* move upper-header */
header #upper-header {
	height: 25px;
	margin-bottom: 5px;
	-ms-transition: margin 0.6s ease;
	-o-transition:  margin 0.6s ease;
	-webkit-transition: margin 0.6s ease;
	-moz-transition: margin 0.6s ease; /
	transition: margin 0.6s ease;
}
/* Disparition du upperheader : on supprime cet effet 
height 25px + margin-bottom 5px
header.affix #upper-header {
	margin-top: -30px; 
} */






/* surcharge de dropdown boostrap */
header .dropdown-menu>li>a { 
    font-weight: 300;
}
header .dropdown-menu>li>a:hover { 
   text-decoration: underline;
}
header .dropdown-menu {
	border: none;
}

/**
* Style du titre du site dans barre de nav
**/



/* NEW UPPER-HEADER */
#upper-header > ul > li > a {
	font-size: 0.7em;
    font-weight: 500;
	text-transform: uppercase;  
}
@media ( max-width : 1200px) {
	#upper-header > ul > li > a {
		font-size: 0.6em;
	}
}
#upper-header .navbar-nav > li > a {
	padding: 2px 10px;
}
#upper-header .navbar {
    min-height: auto;
}
#upper-header .navbar-nav a:focus {
    color: black;
 }
#upper-header #megamenu2 {
	margin-right: 8px;
}
/* Margin megamenu upperheaer */
#upper-header .yamm .yamm-content {
    padding: 10px 15px;
}
#upper-header .niv3 > li > a {
	font-weight: 500;
}
/* Margin entre blocs de niveau 3 */
#upper-header ul.niv4  {
	margin-bottom: 10px;
}
/*#upper-header  ul.niv4:last-of-type  {
	margin-bottom: 0;
}*/

/* groupe boutons dropdown */
#upper-header #megamenu2.navbar-nav > li > a {
	font-weight: 700;
	margin-right: 3px;
}
#upper-header #megamenu2.navbar-nav > li.active > a {
	color: #E41600;
}
 
#upper-header #megamenu2.navbar-nav > li > ul {
	border:none;
	margin-top: 3px;
}
#upper-header #megamenu2.navbar-nav > li > a,
#upper-header #megamenu2.navbar-nav > li > ul {
	background: #eee;
}
#upper-header #megamenu2.navbar-nav> li.open >a,
#upper-header #megamenu2.navbar-nav> li.open >ul {
	background: #ccc;
}
#upper-header #megamenu2.navbar-nav> li.open >a { /* relier bouton et dropdown-menu */
    padding-bottom: 5px;
    margin-bottom: -4px;
}

#upper-header #megamenu2.navbar-nav > li > a[title="Covid-19"],
#upper-header #megamenu2.navbar-nav > li > a[title="Covid-19"] + ul {
  background: #2864a3;
  color: white;
}
/*
#upper-header #megamenu2.navbar-nav > li:nth-of-type(2) > a,
#upper-header #megamenu2.navbar-nav > li:nth-of-type(2) > ul 
*/
#upper-header #megamenu2.navbar-nav > li > a[title="Formations"],
#upper-header #megamenu2.navbar-nav > li > a[title="Formations"] + ul {
  background: #fec900;
}

#upper-header #megamenu2.navbar-nav > li > a[title="OFELIF"] {
    background: #13304d;
    color: white
}

#upper-header #megamenu2.navbar-nav > li:last-of-type > a {
	margin-right: 0;
}
#upper-header .navbar-nav > .open > a,
#upper-header .navbar-nav > .open > a:hover,
#upper-header .navbar-nav > .open > a:focus {
    color: black;
 }

/* navtool + social-network menu */
#upper-header #navtool a,
#upper-header #navtool a:hover,
#upper-header #navtool a:focus  {
    text-decoration: none;
    background: none;
}
#upper-header #navtool a {
    color: #E41600;
}
#upper-header ul#navtool ul a { /* SB 11/23 La nouvelle règle pour fontawesome 6 */
    font-family: "Font Awesome 6 Brands", "Font Awesome\ 6 Free";
}

#upper-header #navtool a i {
    margin-right: 5px;
}
#upper-header #navtool li.panel {
	margin-bottom: 0;
    border: none;
    box-shadow: none;
}
#upper-header #navtool li.slash:before {
	float: right;
	line-height: 20px;
	margin-left: -5px;
	content: "|";
	color: #E41600;
}
/* TEST navigation horizontale */
#upper-header #navtool li ul.list-inline {
    margin: 0 5px;
    font-size: 0.85em;
}
/* TEST navigation horizontale (type accordéon) */
#upper-header #navtool ul.collapsewidth.collapsing,
#upper-header #navtool ul.collapsewidth.collapse.in {
    display: inline;
}
#upper-header #navtool ul.collapsewidth {
	white-space: nowrap; /* pas de passage é la ligne */
/*	width: 0;
	overflow: hidden;
    -webkit-transition: all 2s ease;
    -moz-transition: all 2s ease;
    -o-transition: all 2s ease;
    transition: all 2s ease;*/
}
#upper-header #navtool ul.collapsewidth li  {
    margin-left: 6px;
}
#upper-header #navtool a[data-toggle="collapse"] {
	display: inline-block;
}
/* Collapse width : utilisé pour les boutons de #social-network : collapse horizontal
.collapse.collapse-width {
	display: inline-block;
    height: auto;
    -webkit-transition: width 2s ease;
    -moz-transition: width 2s ease;
    -o-transition: width 2s ease;
    transition: width 2s ease;
}
#upper-header #navtool .collapse-width {
	display: inline-block;
}
 */






/* NEW MEGA */
#megamenu .yamm .yamm-content {
	padding: 0 10px;
}
@media ( min-width : 768px) {
	#megamenu  .dropdown.yamm-fw .dropdown-menu {
		box-shadow: none;
		padding: 0;
		border: none;
		border-radius: 0;
		background: #f5f5f2;
	}
	#megamenu .dropdown-menu {
		font-size: 15px;
		background: #f5f5f2;
		border-radius: 0;
	}
}

/* Niveaux de lien */
/* Barre de navigation haute */
#megamenu  .navbar-nav > li > a {
	font-family: "Roboto Condensed", sans-serif;
	font-weight: 500;
	text-transform : uppercase;
    font-size: 1.4em;
    padding-top: 19px; /* 15px par defaut + 4px pour accent */
}
@media ( max-width : 1200px) {
	#megamenu  .navbar-nav > li/*.dropdown*/ > a {
		font-size: 1.1em;
	}
}

#megamenu .navbar-nav a, 
#megamenu .navbar-nav a:hover, 
#megamenu .navbar-nav a:focus {
    color: black;
    background: none;
}
#megamenu .navbar-nav ul li {
    margin-top: 13px;
    margin-bottom: 13px;
}
#megamenu .col-lg-1,
#megamenu .col-lg-10, 
#megamenu .col-lg-11, 
#megamenu .col-lg-12, 
#megamenu .col-lg-2, 
#megamenu .col-lg-3, 
#megamenu .col-lg-4, 
#megamenu .col-lg-5, 
#megamenu .col-lg-6, 
#megamenu .col-lg-7, 
#megamenu .col-lg-8, 
#megamenu .col-lg-9, 
#megamenu .col-md-1, 
#megamenu .col-md-10, 
#megamenu .col-md-11, 
#megamenu .col-md-12, 
#megamenu .col-md-2, 
#megamenu .col-md-3, 
#megamenu .col-md-4, 
#megamenu .col-md-5, 
#megamenu .col-md-6, 
#megamenu .col-md-7, 
#megamenu .col-md-8, 
#megamenu .col-md-9, 
#megamenu .col-sm-1, 
#megamenu .col-sm-10, 
#megamenu .col-sm-11, 
#megamenu .col-sm-12, 
#megamenu .col-sm-2, 
#megamenu .col-sm-3, 
#megamenu .col-sm-4, 
#megamenu .col-sm-5, 
#megamenu .col-sm-6, 
#megamenu .col-sm-7, 
#megamenu .col-sm-8, 
#megamenu .col-sm-9, 
#megamenu .col-xs-1, 
#megamenu .col-xs-10, 
#megamenu .col-xs-11, 
#megamenu .col-xs-12, 
#megamenu .col-xs-2, 
#megamenu .col-xs-3, 
#megamenu .col-xs-4, 
#megamenu .col-xs-5, 
#megamenu .col-xs-6, 
#megamenu .col-xs-7, 
#megamenu .col-xs-8, 
#megamenu .col-xs-9 {
    padding-right: 10px;
    padding-left: 10px;
}
#megamenu .navbar-nav > .active > a {
    color: #E41600;
}

/* Plus precis sur le style
#megamenu .navbar-nav >.active > a, 
#megamenu .navbar-nav >.active > a:hover, 
#megamenu .navbar-nav >.active > a:focus {
    color: black;
}
#megamenu .navbar-nav > .open > a, 
#megamenu .navbar-nav > .open > a:hover, 
#megamenu .navbar-nav > .open > a:focus {
    color: black;
 }
 */


/*MAGICLINE*/
#magic-line {
  position: absolute;
  bottom: 2px;
  left: 0;
  width: 0;
  height: 3px;
  background: #E41600;
  transition: all 0.3s;
}

#megamenu .niv3 > li > a {
	font-weight: 500;
	text-transform: uppercase;
}
/* Custom link megamenu principal  */
#megamenu .navbar-nav .niv3 > li  {
	margin-bottom: 26px;
}
#megamenu .navbar-nav .niv4 > li  {
	/*font-family: Roboto Condensed; */
	/*font-weight: 400;*/
}

/* RECHERCHE */
#megamenu a#search {
	color: #E41600;
    padding: 0.61em 0.5em; /* AU PIF  */
}
#search-box .modal-dialog {
	top:30%;
}
/* test couleur de fond pour recherche */
.modal-backdrop{
  opacity:0; 
  transition: opacity .2s;
}
.modal-backdrop.in{
  opacity:.75;
}
#search-box .close,
#search-box .close:hover {
    font-size: 41px;
    font-weight: 300;
    color: #fbfbfb;
    text-shadow: none;
    filter: alpha(opacity=80);
    opacity: .8;	
}

#search-box input {
	color: #fff;
	height: inherit;
	font-size: 3.75rem;
	font-weight: 900;
	background: 0 0;
	border: none;
	outline: 0;
	padding: 0;
	box-shadow: none;
	caret-color: #ffc426;
	-webkit-box-shadow: 0 0 0px 1000px #0000 inset;
}
#search-box input:-webkit-autofill,
#search-box input:-webkit-autofill:hover, 
#search-box input:-webkit-autofill:focus {
	text-fill-color: white;
	-webkit-text-fill-color: white;
	transition: background-color 5000s ease-in-out 0s;
	box-shadow: 0 0 0px 1000px #000 inset;
	-webkit-box-shadow: 0 0 0px 1000px #000 inset;
}
#search-box p {
	color: #bdbdbd;
}

/* champ de recherche : version reduite */
.navbar-header .navbar-form {
	margin: 0;
}
#megamenu .form-control:focus {
    border-color: white;
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(255,255,255,.075), 0 0 8px rgba(255, 255, 255, 0.6);
    box-shadow: inset 0 1px 1px rgba(255,255,255,.075), 0 0 8px rgba(255, 255, 255, 0.6);
}
/* champ de recherche : version large */
@media ( max-width : 767px) {
	#megamenu #search-box {
		display : none;
	}
}

/** tester pour differencier les liens vers les sites des OA
#megamenu .niv3 > li > a[target="_blank"]:before {
	content:"\f35a";
	font-family: "Font Awesome\ 5 Free";
	margin-right: 3px;
	font-weight: 900;

}
#megamenu .niv4 > li > a[target="_blank"]:before {
	content:"\f35a";
	font-family: "Font Awesome\ 5 free";
	margin-right: 3px;
}
*/



/* bouton gris + dropdown-menu gris, w100%, formulaire */
/*
#megamenu #search-box .dropdown-menu {
	background: #E41600;
	width: 100%;
	border-radius: 0;
}
#megamenu #search-box .dropdown-menu:before,
#megamenu #search-box .dropdown-menu:after {
	background: none;
	height: 0;
}
#megamenu #search-box .dropdown-menu li {
	float: right;
	width: 30%;
}
@media ( max-width : 1080px) {
	#megamenu #search-box .dropdown-menu li {
		width: 50%;
	}
}
#megamenu #search-box .dropdown-menu form,
#megamenu #search-box .dropdown-menu .form-group,
#megamenu #search-box .dropdown-menu .form-control
{
	width: 100%;
}
*/

/*
#megamenu #search-box i {
	padding-top : 3px;
	padding-bottom: 3px;
}*/


 /* A completer modifier search uniquement ? */
.form-control {
	height: 30px;
	border: none;
	border-radius: 1px;
}





.navbar-toggle {
    float: left;
}
/* Surcharge >> a faire à partir de fichier Less */
@media (min-width: 768px) {
	.navbar-toggle {
	    display: block;
	}
}
@media (min-width: 1200px) {
	.navbar-toggle {
	    display: none;
	}
}


.navbar-toggle .icon-bar {
    background: black;
}

/* https://scotch.io/tutorials/off-canvas-menus-with-css3-transitions-and-transforms */
#burger-btn { /* ne pas gener l'affichage (centrage) du logo */
	position: absolute;
    left: 0;
}
#burger-menu {
  width: 340px;
  max-width: 100%;
  height: 100% !important;
  position: fixed;
  top: 0;
  right: -400px;

  background: white;
  padding: 15px;
  z-index: 1000;
  box-shadow: -2px 1px 2px #17171729;

  /* SB 11/23 pas utile : font-family: "Font Awesome\ 5 Free", "Roboto", sans-serif; */
  background-color: white;
  overflow-y: auto;
  -ms-overflow-style: none;
}

#burger-menu.active {
  right: 0px;
}
#burger-menu.collapse {
  right: 0px;
}
#burger-menu > ul > li > a {
  text-transform: uppercase;
  font-weight: 400;
}

#burger-menu a i {
    margin-right: 5px;
}
/* https://scotch.io/tutorials/off-canvas-menus-with-css3-transitions-and-transforms */
#burger-menu > a {
    font-size: 2em;
    margin-top: -20px;
    display: inline-block;
}

#burger-menu .panel {
    margin-bottom: 0;
    background-color: transparent;
    border-radius: 0;
    border-bottom: 1px solid grey;
    -webkit-box-shadow:  none;
    box-shadow: none;
}

#burger-menu  .list-group-item {
    background-color: transparent;
    border: none;
    border-bottom: 1px solid #ddd;
}


/* EFFET NON IMPLEMENTE > ON POUSSE LE CONTERNU DE LA PAGE */


#site-wrapper {
  position: relative;
  overflow: hidden;
  width: 100%;

  height: 5000px; /* Temp: Simulates a tall page. */
}
#site-canvas {
  width: 100%;
  height: 100%;
  position: relative;
  -webkit-transform: translateX(0);
  transform: translateX(0);
  
  -webkit-transform: translate3d(0, 0, 0); 
  transform: translate3d(0, 0, 0); 
  
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;

  padding: 1% 0; /* Temp: Just spacing. */
}
.show-nav #site-canvas {
  -webkit-transform: translateX(300px);
  transform: translateX(300px);
  transform: translate3d(300px, 0, 0);
  -webkit-transform: translate3d(300px, 0, 0);
}

.ease { -webkit-transition: 300ms ease all; transition: 300ms ease all; }
.linear { -webkit-transition: 300ms linear all; transition: 300ms linear all; }
.ease-in { -webkit-transition: 300ms ease-in all; transition: 300ms ease-in all; }
.ease-out { -webkit-transition: 300ms ease-out all; transition: 300ms ease-out all; }
.ease-in-out { -webkit-transition: 300ms ease-out all; transition: 300ms ease-out all; }
.bounce { -webkit-transition: all 300ms cubic-bezier(0.32,1.25,0.375,1.15); transition: all 300ms cubic-bezier(0.32,1.25,0.375,1.15); }
.snappy { -webkit-transition: all 300ms cubic-bezier(.694, .0482, .335, 1); transition: all 300ms cubic-bezier(.694, .0482, .335, 1); }
.out-of-orbit { -webkit-transition: all 300ms cubic-bezier(1,0,.61,.15); transition: all 300ms cubic-bezier(1,0,.61,.15); }
.fat-kid-down-slide { -webkit-transition: all 300ms cubic-bezier(.2,1,.47,0); transition: all 300ms cubic-bezier(.2,1,.47,0); }
.none { -webkit-transition: none; -webkit-transition: none; }


.boring #burger-menu {
  -webkit-transform: translateX(0);
  transform: translateX(0);
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}
.boring .show-nav #burger-menu {
  -webkit-transition: 300ms ease all; 
  transition: 300ms ease all; 
 
  -webkit-transform: translateX(300px);
  transform: translateX(300px);
  
  -webkit-transform: translate3d(300px, 0, 0);
  transform: translate3d(300px, 0, 0);
}
.boring .show-nav #site-canvas {
  -webkit-transform: translateX(0);
  transform: translateX(0);
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
} 


.extra-pop #site-canvas {
  -webkit-transition: 300ms ease all;
  transition: 300ms ease all;
}
.extra-pop #burger-menu * {
  -webkit-transition: all 750ms cubic-bezier(0.32,1.25,0.375,1.15);
  transition: all 750ms cubic-bezier(0.32,1.25,0.375,1.15);
  -webkit-transform: translateX(-100%);
  transform: translateX(-100%);
  -webkit-transform: translate3d(-100%, 0, 0);
  transform: translate3d(-100%, 0, 0);
}
.extra-pop .show-nav #burger-menu * {
  -webkit-transform: translateX(0%);
  transform: translateX(0%);
  -webkit-transform: translate3d(0%, 0, 0);
  transform: translate3d(0%, 0, 0);
}