.header{
	/*border-bottom: 1px solid grey;*/
	background-color: rgb(3,102,203);
}

.navbar{
	text-align: center;
	border-radius: 0px;
	margin: 0, 0, 80px, 0;
}

.navbar-header{
	display: none;
}

.navbar-brand{
	display: inline-block;
}

.navbar-logo{
	vertical-align: middle;
	display: inline-block;
	overflow: hidden;
	margin: 0 80px;
}

.navbar-logo img{
	display: block;
	margin: auto;
}

.navbar-titre{
	font-family: 'Lobster', cursive !important;
	font-size:1.5em;
	font-weight:bold;
	color: rgb(255,199,0);
	line-height: 23px;
	text-decoration: none;
}


.navbar-center{
	display: block;
	vertical-align: middle;
	margin: auto 0;
}


.navbar-cadre-recherche{
	display: inline-block;
	background-color: none;
	border-radius: 2px;
	max-width: 500px;
	padding: 12px;
	vertical-align: middle;
	border: 2px solid rgb(255,199,0);
	color: white;
}

.navbar-cadre-recherche .form-group label{
	font-weight: normal;
}

.navbar-cadre-recherche .btn-primary{
	background-color: rgb(255,199,0);
}

.navbar-cadre-recherche .btn-primary:hover{
	background-color: rgb(166,211,244);
}

.navbar-links{
	display: inline-block;
	vertical-align: middle;
}

.navbar-links a{
	display: block;
	border: none;
}

.navbar-services{
	list-style: none;
	margin: 18px;
	padding: 0;
}

.navbar-links a{
	color: rgb(255,199,0);
	font-size: 16px;
}

.check-square-o:before{
	content:"\f046";
	color: white;
	margin-right: 8px;
}


.navbar-links a:hover .check-square-o:before{
	color: rgb(255,199,0);
}

.navbar-brand{
	color: rgb(255,199,0);
}

.cadre-annuaire-inverse, .cadre-identifier-numero{
	background-color: rgb(3,102,203);
}

.cadre-identifier-numero li{
	color: white;
	font-style: normal;
	font-weight: initial;
}

.cadre-annuaire-portable{
	background-color: rgb(166,211,244);
}

.btn-rechercher-jaune{
	background-color: rgb(255,199,0);
}

.btn-rechercher-jaune:hover{
	background-color: rgb(166,211,244);
}

.btn-rechercher-bleu{
	background-color: rgb(3,102,203);
}

.btn-rechercher-bleu:hover{
	background-color: rgb(255,199,0);
}

.titre-page h1, h2{
	text-align: center;
	margin-bottom: 40px;
	font-size: 26px;
	margin: 5px;
}

.menu-navbar{
	margin: 0;
	text-align: center;
	background-color: rgb(166,211,244);
}

.menu-navbar ul{
	margin: 0;
}

.menu-navbar ul li{
	display: inline-block;
	text-align:center;
	vertical-align:middle;
	cursor:pointer;
	white-space:nowrap;

	vertical-align:middle;
	font-weight:700;
	text-align:left;
	font-size: 16px;
	border-right: 1px solid white;

}

.menu-navbar ul li a{
	position: relative;
	color: rgb(3,102,203);
	display: block;
	border: none;
	font-size: 16px;
	padding:12px 22px;
}

.menu-navbar ul li:first-child{
	border-left: 1px solid white;
}

.menu-navbar ul{
	content: "";
	white-space: 0;
	font-size:0;
}

.menu-navbar ul li a:hover{
	background-color: rgb(3,102,203);
	color: white;
}

.menu-navbar a:hover .check-square-o:before{
	color: rgb(255,199,0);
}

.header a:hover, a{
	text-decoration: none;
}

.header a:focus{
	background-color: inherit;
	text-decoration: none;
}

.menu-navbar ul li a[data-badge]:after {
	content:attr(data-badge);
	position:absolute;
	top:-12px;

	font-size:.7em;
	background:rgb(255,199,0);
	color:rgb(3,102,203);
	text-align:center;
	line-height:18px;
	border-radius:4px;
	padding: 2px 4px;
	box-shadow:0 0 1px #333;
	right: 10px;
	
	/*centrer
	left: 50%;
	transform: translate(-50%, 0);
	*/
}

.menu-navbar ul li ul{
	display: none;
	position: relative;
	padding: 0;

}

.menu-navbar ul li:hover ul{
	display: block;
}


.menu-navbar ul li ul li{
	width: 100%;
	text-align: center;
	position: absolute;
	background-color: rgb(166,211,244);
}

.menu-navbar ul li ul li a[data-badge]:after {
	top:0px;
	right: -40%;
}












.rep-player-cmd{
	background-color: rgb(166, 211, 244);
}

.rep-player-cmd .btn-sound-play{
	background-color: rgb(255, 199, 0);
}

.rep-player .rep-player-title{
	background-color: rgb(166, 211, 244);
	color: rgb(85, 85, 85);
	font-weight: 500;
}

.cadre-identifier-numero{
	padding: 0;
	box-shadow: rgba(0, 0, 0, 0.4) 8px 8px 8px 0px;
}

.cadre-identifier-numero .header{
	padding: 0;
	font-family: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

.cadre-identifier-numero .title{
	/*background-color: rgb(166,211,244);*/
	background-color: rgb(255, 199, 0);
	color: rgb(62, 63, 58);
	font-size: 42px;
	font-weight: 400;
	text-shadow: rgba(100, 100, 100, 0.5) 2px 2px 3px;
	font-family: 'Roboto','Helvetica Neue',Helvetica,Arial,sans-serif;
}

.cadre-identifier-numero h3{
	line-height: 40px;
	color: white;
	font-size: 32.2px;
	margin: 16px 0;
}

.cadre-identifier-numero h4{
	color: white;
}

.cadre-identifier-numero p{
	color: white;
}

.cadre-identifier-numero .fa-check-square{
	color: rgb(255, 199, 0);
}




.menu-navbar .menu_toggle{
	display: none;
	position: absolute;
	top: 3.2rem;
	right: 1rem;
	transform: translate(0, -50%);
}

.menu-navbar input{
	display: block;
	width: 53px;
	height: 52px;
	margin: -2px -10px;
	position: absolute;

	cursor: pointer;

	opacity: 0; /* hide this */
	z-index: 2; /* and place it over the hamburger */

	-webkit-touch-callout: none;
}

.menu-navbar span{
	display: block;
	width: 33px;
	height: 4px;
	margin-bottom: 5px;
	position: relative;

	background: #cdcdcd;
	border-radius: 3px;

	z-index: 1;

	transform-origin: 4px 0px;

	transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
	          background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
	          opacity 0.55s ease;
}

.menu-navbar input:checked ~ ul{
	opacity: 1;
	height: auto;
	background: rgb(166,211,244);
	position: relative;
}

#menu-navbar.collapse.in{
	opacity: 1;
	height: auto;
	background: rgb(166,211,244);
	position: relative;
}


button.navbar-menu-deroulant{
	background: none;
	border: none;
	font-size: 3rem;
	display: none;
	margin: auto;
	background-color: rgb(166,211,244);
	width: 100%;
	padding: 10px;
}


/* POUR LES PETIS ECRANS */
@media (max-width: 640px) {

	.a-qui-est-ce-numero{
		width: 60px;
		vertical-align: middle;
	}


	button.navbar-menu-deroulant{
		display: block;
	}

	.navbar-logo{
		margin: 0 0;
	}


	.menu-navbar ul{
		opacity: 0;
		position: absolute;
		margin: 0 auto;
		width: 100%;
		float: left;
		left: 0;
		transform: translate(0,0);
		z-index: 8000;

		transition: all 1s ease-out;
	}

	.menu-navbar ul li{
		text-align: center;
		display: block;
		position: relative;
		width: 100%;
		padding: 1rem 0;
		border: none !important;
	}

	.menu-navbar .menu_toggle{
		display: block;
	}

	.menu-navbar ul li a[data-badge]:after{
		top: initial;
		right: 40px;
		position: initial;
	}


}