
.flxInitFrame>.flxMenu ul{
background-color: white;
}

.menuSlider{
background-color: white;
}
.menuTrigger ul{
background-color: rgb(63, 75, 105);

}

.exmp1NavBar
  {
    transform:matrix(1,0,0,1,0,0);
    font-family: 'PT Sans';
    font-size:20px;
    z-index:10;
  }

#Footer a,
.menuTrigger>a,
.flxMenu li>a{
color: #dbdbe5;
text-decoration: none;
}

.menuTrigger>a:hover,
.flxMenu li>a:hover{
color: white;
}
.menuTrigger>a:focus,
.flxMenu li>a:focus{
color: white;
text-decoration: underline;
outline: none;
}
#exmp1NavBar, #Footer{
background-color:#4990E2;
}

/************* adjust max-width as needed *****************/
@media(min-width: 801px){
  .menuTrigger{display: none;}

}
@media(max-width: 800px){
	.menuTrigger{display: block;}

}

.flxMenu li
{
	 list-style: none;
}
.flxMenu li>a{
	display: block;
}

/*//////////////////////// Desktop state /////////////////////////////*/

.flxInitFrame ul,
.flxInitFrame li{
	position: relative;
}

/************ nav bar horizontal **************/
.flxInitFrame>ul>li{
	float: left;
	border-width: 0 1px 0 0;
}

ul#menuExmp1 li ul li
  {
    width:200px;
  }

/******* level2 ****************/
.flxInitFrame>ul>li>ul{
	left: 0;
	height: 0;
	min-width: 100%;
	overflow: hidden;
	position: absolute;
	/*z-index: 200;*/
	margin: 0;
	padding: 0;
	box-shadow: 2px 2px 6px 0px rgba(0,0,0,0.2);
}
.flxInitFrame>ul>li ul>li{
	position: relative;
}

/******* level 3 ****************/
.flxInitFrame>ul>li ul ul{
	position: absolute;
	left: 100%;
	width: 140px;
	margin: 0;
	padding: 0;
	top: 0;
	z-index: 210;
	box-shadow: 2px 2px 6px 0px rgba(0,0,0,0.2);
	height: 0;
	overflow: hidden;
}

/************ nav bar vertical **************/
.flxInitFrame.flx-vertical{
	width: 200px;
}
.flxInitFrame.flx-vertical>ul>li{
	float: none;
	display: block;
	border-width: 0 0 1px;

}
.flxInitFrame.flx-vertical>ul>li>ul{
	left: 100%;
	top:0;
	min-width: 140px;
}

/*//////////////////////// mobile state //////////////////////////*/
.menuTrigger{
	position: absolute;
	display: block;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	padding: 4px;
}
.menuTrigger.flx-left{
	position: relative;
	float: left;
	right: auto;
	bottom: auto;
}
.menuTrigger.flx-right{
	float: right;
	position: relative;
	right: auto;
	bottom: auto;
}


.flxMenuToggle>ul.menuSymbol,
.flxMenuOpen>ul.menuSymbol{
	position: relative;
	border: 1px solid white;
	border-color: white gray gray white;
	border-radius: 5px;
	padding: 3px 5px;
	margin: 0;
}
.flxMenuToggle>ul.menuSymbol>li,
.flxMenuOpen>ul.menuSymbol>li{
	list-style: none;
	display: block;
	float: none;
	height: 3px;
	margin: 3px auto;
	background-color: #4990E2;
	border-radius: 2px;
	width: 20px;
}
.flxMenuToggle:hover>ul.menuSymbol>li,
.flxMenuOpen:hover>ul.menuSymbol>li{
	background-color: white;
}

/******* panel *********************/
.menuTrigger>.menuFrame{
	display: none;
	position: absolute;
  	top: 0;
	z-index: 800;

}
.menuSlider{
	position: absolute;
	overflow: hidden;
	top: 0;
	background-color: #50cfff;
	box-shadow: 2px 2px 4px gray;
}
.menuTrigger.flx-right .menuSlider{
	box-shadow: -2px 2px 4px gray;
}


.menuFrame ul,
.menuFrame li{
	float: none !important;
	display: block !important;
	position: relative;
}

/******* close button *********************/
.menuFrame a.menuClose {
		display: block;
		padding: 4px 8px;
		text-align: right;
		text-decoration: none;
		font-weight: bold;
		background-color: #0099d3;
		color: white !important;
}
.menuFrame a.menuClose:hover{
	color: black !important;
}
.menuFrame a.menuClose:after{
	content: "\2716";
}
/*********** items first level ***************/

.menuSlider>ul{
		display: block !important;
		padding: 0 !important;
		margin: 0 !important;
		min-width: 200px;
}
.menuSlider>ul li{
		border-top: 1px solid white;
		padding: 0 !important;
		background: transparent;
		width: auto;
	 float: none !important;

}
.menuSlider>ul li>a {
		display: block;
		margin: 0;
		padding: 6px;
		text-align: left;
	}

.menuTrigger .menuFrame .ltxCreateNewElement{
	display: none !important;
}

/*********************** items second level**********************/
.menuFrame li ul{
	display: block;
	position: relative;
	margin: 0 0 0 20px;
	/*! width: 100%; */
	padding: 0;
	overflow: hidden;
}

#menuExmp1{
  padding: 0;
  margin: 0;
  margin-top:60px;
  font-size:20px;
  font: Bold 16px/41px Source Sans Pro;
  letter-spacing: 0;
  color: white;
  }

#menuExmp1 li>a{
  padding: 8px;
  color:white;
}

#menuExmp1 li i{
  margin-right: 8px;
}
#exmp1Trigger #menuExmp1 li i
  {
    min-width: 18px;
  }

#menuExmp1 li{
  background: transparent no-repeat right top;
  padding-right: 10px;
}
#menuExmp1 li.hasSubmenu{
  background-image: url("_images/folded.png");
}
#menuExmp1 li.hasSubmenu.displaySubmenu{
  background-image: url("_images/unfolded.png");
}

.ImgMenuBackground
  {
    width:320px;float:left;left:10px;margin-top:-10px;
  }

@media(max-width: 800px){

  ul#menuExmp1 li ul li {
  background:transparent;
  color:black;
  border-style: solid;
  border-width: 0 0 1px 0;
  border-color: black;
  }
  ul#exmp1Trigger {background-color:black;}

}

@media(min-width: 601px){
  #exmp1Trigger{display: none;}
  ul#menuExmp1
    {
      background-color: transparent;
      color:white;
      font-family: Chivo;
    }
  .MenuConnexion {margin-top:-30px;}
}
/*
    #exmp1Trigger>.menuFrame{
      left: 0;
      right: 2px;
      width: auto !important;
    }
  */
    #exmp1Trigger .menuSlider{
      width: 240px;
    }

#exmp1NavBar{
  background-color: #4990E2;
  height:200px;
  maring:0;
  width:100%;
  z-index:1;
  position:fixed;
  padding-top:10px;
}

@media(max-width: 800px){
  #exmp1NavBar{
    height:50px;
  }
}

#Content{
  min-height: 300px;
  padding: 20px;
}
#spacerTop{
  min-height: 200px;
  padding: 20px;
}
#Content, #spacerTop{
  background-color: #96a6c8;
  color: white;
  font-family: "Arial";
  font-size: 14pt;
}
#Footer{
  background-color: #a3c9ae;
  padding: 12px;
}

/******************* MENU VERS LE HAUT *************************/
.menuBas1, .menuBas1 ul {
    right:-2%;
    bottom:10%;
    list-style: none;
}
.menuBas1 {
    position:fixed;
    width:250px;
}
.menuBas1 li {
    display:inline-block;
    vertical-align:top;
}
.menuBas1 ul li {
    display:inherit;
    background:#fff;
}
.menuBas1 ul {
    position:absolute;
    left:0;
    right:0;
    top:0;
    bottom:20px;
    max-height:0;
    overflow:hidden;
    z-index: -1;
    transition:all 0.5s;
}
.menuBas1 li:hover ul {
    max-height:15em;
    z-index: 1000;
}
.menuBas1 li:hover ul.quatreliens {
    top:-80px
}


.menuBas2, .menuBas2 ul {
    right:-2%;
    bottom:17%;
    list-style: none;
}
.menuBas2 {
    position:fixed;
    width:250px;
}
.menuBas2 li {
    display:inline-block;
    vertical-align:top;
}
.menuBas2 ul li {
    display:inherit;
    background:#fff
}
.menuBas2 ul {
    position:absolute;
    left:0;
    right:0;
    top:0;
    bottom:20px;
    max-height:0;
    overflow:hidden;
    z-index: -1;
    transition:all 0.5s;
}
.menuBas2 li:hover ul {
    max-height:15em;
    z-index: 1000;
}
.menuBas2 li:hover ul.quatreliens {
    top:-80px
}
.menuBas2 li:hover ul.cinqliens {
    top:-100px
}
/**********************************************************************************/

/*********************** SOUS MENU VERS LE BAS **********************************/
.SousMenu4, .SousMenu4 ul {
    padding: 0;
    margin: 0;
    list-style: none;
    position:fixed;
    top:10%;
    right:0%;
    width:300px;
}
.SousMenu4 li {

    display: inline-block;
}
.SousMenu4 ul li {#1FDCFF
    display: inherit;
}
.SousMenu4 a {
    text-decoration: none;
    display: block;
    color:white;
}
.SousMenu4 ul {
    position: absolute;
    left: -999em;
    text-align: left;
    z-index: 1000;
}
.SousMenu4 li:hover ul
  {
    margin-top:20px;
    left: auto;
    width:250px;
    background-color:#707070;
    padding:10px;
    border-radius:10px;
  }
/***********************************************************************************/

.MenuImgProfilsLogo
  {
    -webkit-border-radius: 50%;
		-moz-border-radius:50%;
		border-radius: 50%;
		-webkit-appearance: none;
    max-width:60px;
    max-height:60px;
    vertical-align:middle;
  }
.MenuProfilPrenom {}
.MenuProfilNom {}

.ImgSousMenu1 {width:40px;vertical-align:middle;}
.ImgSousMenu2 {width:20px;vertical-align:middle;margin-right:5px;}
