:root {
	--black: #000000;
	--white: #ffffff;
	--bleu-legacy: #030f40;
	--vert-legacy: #aadc14;
	--jaune: #ffc229;
	--bleu: #77b7fc;
	--orange: #f67536;
}

@font-face {
	font-family:			'DINProBold';
	font-style:				normal;
	font-weight:			bold;
	src:					url('../../Content/Font/DINPro-Bold_13934.ttf');
}

@font-face {
	font-family:			'DINPro';
	font-style:				normal;
	font-weight:			lighter;
	src:					url('../../Content/Font/dinpro-regular.otf');
}


.top_line {
    background-color: #1a1e3a;
}

.banniere{
	background-size:		100% auto !important;
}
#out_container > header .banniere div.logo{
	width : 50% !important;
}

.aideenligne .logo {
	margin: 0;
}

/*Enleve le contour */
#out_container {box-shadow:none !important;}

/*****Police par d�faut ****/
body {
	font-family:			'DINPro' !important;
	background-color:		#fff;
	overflow-x:				hidden;
	font-size : 16px !important;
}
p {
	font-size:				16px !important;
	font-family:			'DINPro' !important;
}

/*** Titre ***/
 h3 .strong {
	color : #202f86; 
}

h1 {
	color : var(--bleu-legacy);
	font-size: x-large;
}

h1, h2, h3 {
	font-family:			'DINProBold';
}

h1, h2 {
    text-transform: uppercase;
}

h2, h3 {
	color :  var(--bleu-legacy) !important;
}
label{
	font-size:				16px !important;
	font-family:			'DINPro' !important;
}

/*.main-content, */
/*.banniere, */
.footer-wrapper .main-block, 
.footer-bottom .main-block {
	position:				relative;
	width:					98%;/*1170px;*/
	margin:					auto;
}
/*Menu principal */
.navbar .nav {
	list-style-type: none;
    display: flex;
    justify-content: center;	
	float : none;
	margin: 15px;
}
.navbar .nav>li {
	border-right: 0px;
    margin: 0 10px 0 10px;
}
.navbar .nav>li a {
	font-size : 16px !important;
	color: #1a1e3a !important; /*bleu fonc�*/
}
.navbar .nav>li a i{
	font-size : 14px !important;
	
}

.navbar .nav .active>a{
	color: #4CAEDC; /* bleu */
	font-size : 16px;
}


 .navbar .nav li:hover>a {
    border-top: 3px solid #1a1e3a;}
	
.navbar .nav .active>a, .navbar .nav .active>a:hover, .navbar .nav .active a>i, .navbar .nav .active a>i:hover {
    color: #1a1e3a; /*noir bleu fonc�*/
	font-size : 16px !important;
}
/* PIED DE PAGE */
/*Couleur police pour pied de page*/
#footerUsager h1, #footerUsager h2, 
#footerUsager h3, #footerUsager p, 
#footerUsager strong{
 color: #fff !important;
}


/* Couleur Fond Bleu d'eau #0C86B9 #018DCA */
.footer-top {
height: 20px;
background-color: #1a1e3a !important ;
}

/* Couleur Fond Bleu d'eau */
.footer-wrapper {
	height: 30px;
background-color: #1a1e3a !important ;
}
/* Couleur Fond Bleu outremer(#2d2e7e) 
suite mail Madame Landon 14/11/23 => #2B2E83 */
.footer-bottom {
background-color: #1a1e3a !important ;
}
/*---liste factures bullet d'extension si plus d'information--*/
/* d�ploiement*/
table.dataTable.dtr-inline.collapsed>tbody>tr>td:first-child:before{
	background-color : #ABC22B; /*vert*/
}
/* replis*/
table.dataTable.dtr-inline.collapsed>tbody>tr.parent>td:first-child:before{
	background-color : #4CAEDC; /*bleu*/
}

/* R�duction de la taille de police du tableau de factures */
#tableFactures {
	font-size: 14px;
}

/* Couleur par d�faut : Bleu noir */
.icon-medium, .icon-large {
	color: #1a1e3a !important;
}
/* Couleur Fond Bleu outremer(#2d2e7e) 
suite mail Madame Landon 14/11/23 => #2B2E83  */
a.active {
background-color: #2B2E83 !important;
}

/* Les boutons */
/* Couleur par d�faut : Bleu  */
.btn {
	border:					1px solid #4CAEDC !important;
	background-color:		#4CAEDC !important;
	background-image:		none !important;
	text-shadow:			none !important;
	color:					#1a1e3a ;
	border-radius:			.25rem !important;
}

.btn span {
	color:					#1a1e3a !important;
}

/* Couleur : Vert */
.btn.active, 
.btn:hover ,
.btn:focus{
	background-color:		#ABC22B !important;
	border:					1px solid #ABC22B !important;
	color:					#1a1e3a ;
}
.btn-assistant {
	font-size : 14px!important;
	font-family:			'DINProBold';
	margin : 4px auto;
}

.btn-mini{
	border-radius:			3rem !important;
	font-size :inherit;
}
.btn-mini span {
	color:					#fff !important;
}

/* Couleur : noir bleu fon�� */
.btn-mini.active, 
.btn-mini:hover ,
.btn-mini:focus{
	background-color:		#1a1e3a !important;
	border:					1px solid #1a1e3a !important;
	color: #fff;
}

/* Bloc page accueil */
.grey-box {
	background-color : #fff;
	box-shadow :none;
	border: 3px solid #ABC22B; /*vert*/
}

/*Menu Synthese abonnement*/
/*------------------------*/
/* Couleur par d�faut : Bleu  texte noir bleu fon��*/
 .incruste{
	box-shadow : none; /*pas de d�grad�*/
	border : 3px solid #ABC22B; /* contour vert*/
}
#synthese #menuAbonnementSynthese .title {
	position:				relative;
	display:				block;
	background:				#4CAEDC !important;
	color:					#1a1e3a !important;
	-webkit-transition:		background .25s ease-out;
	transition:				background .25s ease-out;
}
/* Couleur : Vert 
- survol 
- actif
- a le focus */
#synthese #menuAbonnementSynthese .title.active,
#synthese #menuAbonnementSynthese .title:hover,
#synthese #menuAbonnementSynthese .title:focus {
	background:				#ABC22B!important;
}

/*Titre noir bleu fon�� */
#synthese #menuAbonnementSynthese .title h3,
#synthese #menuAbonnementSynthese .title.active h3 {
	background:				none !important;
	color:					#1a1e3a !important;
	font-weight:			bold;
	text-align:				center;
	text-transform: uppercase;
}

/*couleur icone */
#synthese #menuAbonnementSynthese .icon-medium {
	color:					#1a1e3a !important;
}

/* agrandissement icone mode de paiement */
img[src="/Portail/Content/Images/Theme/itembkg_facture_paiement.png"] {
	top: -15px;
    width: 180%;
    max-width: none;
    left: -15px;
    position: relative;
}

/* agrandissement icone adresse de branchement */
img[src="/Portail/Content/Images/Theme/itembkg_abonne_info.png"] {
	top: -15px;
    width: 150%;
    max-width: none;
    left: -15px;
    position: relative;
}

/* Etape d'une demande */
.bwizard-steps li{
	background-color : #4CAEDC; /*bleu*/
	
}


.bwizard-steps .active{
	background-color : #ABC22B; /*vert*/
	color : #000
}

.bwizard-steps .active:after{
	border-left-color: #ABC22B; /*vert*/
}

.bwizard-steps li:after {
    position: absolute;
    right: -20px;
    top: 0;
    height: 0;
    width: 0;
    border-bottom: 20px inset transparent;
    border-left: 20px solid #4CAEDC; /*bleu*/
    border-top: 20px inset transparent;
    content: "";
    z-index: 2;
}
.label-inverse, .badge-inverse {
    background-color: #1a1e3a; /* bleu fonc�*/
}

img.visible-desktop[src="/Portail/Content/Images/Theme/itembkg_synthese_demandes.png"] {
	width: 9%;
}

/* Personnalisation de l'image d'aide au rattachement d'un abonnement 
*********************************************************************
Pr�requis : 
cr�er un document dans l'administration de l'AEL avec l'image souhait�e ayant 
pour code : aide_attacher_abo */
#demoFacture {
	background-image:	url("/Portail/fr-FR/Document/AfficherImage/?code=aide_attacher_abo") !important; 
	height: 300px;
	background-size: contain;
    background-repeat: no-repeat;
   
}
/* Zoom lors du survol de l'image d'aide au rattachement d'un abonnement*/
#demoFacture:hover {
	-webkit-transform:	scale(1.7);
	transform:			scale(1.7);
}

/* Mise en page demande d'auto rel�ve */
form[action="/Portail/fr-FR/Usager/DemandeAutoReleve/CreateAutoReleve"]>.main-block>h4,
form[action="/Portail/fr-FR/Usager/DemandeAutoReleve/CreateAutoReleve"]>.main-block>.row-fluid>.span12>h4 {
	margin-top: 10px;
}

form[action="/Portail/fr-FR/Usager/DemandeAutoReleve/CreateAutoReleve"]>.main-block .span4>h5 {
	margin-bottom: 5px;
}

/* Retrait de l'onglet prelevements dans Factures et prelevements" */
#tabFacturesPrelevement #liPrelevement {
	display: none;
}
