/* CSS Document */

.zone {
	display: table;
	display: block;
	margin-top: 1px;
	/*width: 120px;*/
	height: 20px;/*background-color: #ddd;*/
	/*text-align: center;*/
	/*border: 1px solid #ddd;*/
}



.cadre {
	border: 1px solid #ccc;
	background-color: #eee;
	min-height:30px;
}

.cadre_select {
	background-color:#eef5fc;
	/*border-color: #28a745;*/
	border: 1px solid #0069d9;
}


.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
	/*font-family: 'Quicksand';*/
}


.table.table_custom.spacing2 {
	border-spacing: 0 2px !important
}



.breadcrumb {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding: .25rem 1rem !important;
    margin-bottom: 0.25rem;
    list-style: none;
    background-color: #e9ecef;
    border-radius: .25rem;
	font-size:13px !important;
}

.breadcrumb-item+.breadcrumb-item::before {
    display: inline-block;
    padding-right: .5rem;
    color: #6c757d;
    content: "/";
	
}






.w_social_state2 .icon_rond{
    border-radius:50%;
}

.riva {
	background: #c2b58b
}
.riva2 {
	background: #156568
}

.ethi {
	background: #0069d9;
}

.ethi_sup {
	background: #000;	
}

/************************************* couleur unie ***************/
/* dans main.css

.w_social_state2 .icon.facebook {
	background: #3b5998
}
.w_social_state2 .icon.twitter {
	background: #1da1f2
}
.w_social_state2 .icon.instagram {
	background: #e4405f
}
.w_social_state2 .icon.google {
	background: #dc4e41
}
.w_social_state2 .icon.linkedin {
	background: #0077b5
}
.w_social_state2 .icon.behance {
	background: #053eff
}

*/

.vert_uni {
	background: #81dc41;
}

.fushiat_uni {
	background: #d81df2;
}

.marinet_uni {
	background: #053eff;
}
.roset_uni {
	background: #ff05ba;	
}

/*
.rose{
background: linear-gradient(200deg, #ff05ba 0%, #053eff 100%);
}*/
/************************************* couleur graduée ***************/
.yellow_grad {
	background: linear-gradient(180deg, #f8ff00 0%, #3ad59f 100%);
	
}
.matrice_grad {

background: rgb(58,180,66);
    background: linear-gradient(45deg, rgba(58,180,66,1) 9%, rgba(190,228,21,1) 24%, rgba(253,228,0,1) 39%, rgba(253,218,18,1) 55%, rgba(253,169,45,1) 71%, rgba(252,69,69,1) 91%);	
}

.jaune_grad {
	background: linear-gradient(200deg, #fff500 0%, #ffc22c 100%);
	
}

.vert_grad {
	background: #81dc41;
	background: linear-gradient(200deg, #81dc41 0%, #55bc3b 100%);
}

.rose_grad {
	background: #ff05ba;	
	/*background: linear-gradient(200deg, #f00ecf 0%, #d81df2 100%);*/
	background: linear-gradient(200deg, #f848c7 0%, #f00ecf 100%);
}

.fushia_grad {
	background: #d81df2;
	background: linear-gradient(200deg, #d81df2 0%, #940d92 100%);
}

.fonce_grad {
	background: #053eff;
	background: linear-gradient(200deg, #1CB5E0 0%, #000851 100%);
	
}

.marine_grad {
	background: #053eff;
	background: linear-gradient(200deg, #1CB5E0 0%, #053eff 100%);
}

.bleu_grad {
	background: #0167f7;
	background: linear-gradient(200deg, #0069d9 0%, #014ce4 100%);
}
.ciel_grad {
	background: #1da1f2;
	background: linear-gradient(200deg, #1da1f2 0%, #047ae1 100%);
}
.rouge_grad {
	background: #fc4545;
	background: linear-gradient(200deg, #fc643a 0%, #dc4e41 100%);
}

.orange_grad{
background: linear-gradient(200deg, #f8b306 0%, #ff443c 100%);
}
.or_grad {
/*background: linear-gradient(200deg, #ffcd60 0%,e6a33d #c67700 100%);*/
	background: linear-gradient(200deg, #ffcd60 0%, #c67700 100%);
}

.clair_grad {
	background: linear-gradient(200deg, #e3ffe7 0%, #d9e7ff 100%);
}
.sombre_grad {
	background: linear-gradient(200deg, #4b6cb7 0%, #182848 100%);
}
.bonbon_grad {
	background: linear-gradient(200deg, #fb82ff 0%, #35d6ff 100%);
}


/******************************* swatch*************************************/

/*** fonces *****/
.vital {
background: linear-gradient(200deg, #1CB5E0 0%, #000851 100%);
}
.fresco {
background: linear-gradient(200deg, #FDBB2D 0%, #3A1C71 100%);
}

.disco {
background: linear-gradient(200deg, #FC466B 0%, #3F5EFB 100%);
}
.aqua {
background: linear-gradient(200deg, #00d2ff 0%, #3a47d5 100%);
}
.oye {
background: linear-gradient(200deg, #0700b8 0%, #00ff88 100%);
}

/*** dégrades plat *****/
.kale {
background: linear-gradient(200deg, #00C9FF 0%, #92FE9D 100%);
}

.retro {
background: linear-gradient(200deg, #FDBB2D 0%, #22C1C3 100%);
}

.par {
background: linear-gradient(200deg, #9ebd13 0%, #008552 100%);
}

.bloomy {
background: linear-gradient(200deg, #da5188 0%, #ff443c 100%);
}
.lila {
background: linear-gradient(200deg, #be36bc 0%, #515ada 100%);
}

.mello {
background: linear-gradient(200deg, #4a94cd 0%, #01b458 100%);
}


.vital {
background: linear-gradient(200deg, #1CB5E0 0%, #ffc22c 100%);
}

/******************************** degradé ok******************************/
.rose{
background: linear-gradient(200deg, #ff05ba 0%, #0069d9 100%);
}

.orange{
background: linear-gradient(200deg, #f8b306 0%, #ff05ba 100%);
}

.rouge {
background: linear-gradient(200deg, #da5188 0%, #f8b306 100%);
}

.violet {
background: linear-gradient(200deg, #3a47d5 0%, #da5188 100%);
}
.bleu {
background: linear-gradient(200deg, #00d2ff 0%, #3a47d5 100%);
}
.vert {
background: linear-gradient(200deg, #01b458 0%, #00d2ff 100%);
}
.jaune {
background: linear-gradient(200deg, #01b458 0%, #ffc22c 100%);
}
/**************************************************/

.tag-success { /*** ade ***/
	background-color: #21ba45;
}
/*
.tag-danger { /*** ade ***/
	/*background-color: #cc0000;
}*/
.btn-danger { /*** ade ***/
	background-color: #fc0000;
}

.btn-warning { /*** ade ***/
	background-color: #ffc107;
}

.texte-danger {
	color:#fc0000;;
	}

	
.texte-success {
	color:#21ba45;;
	}
	
.bg-vert {
	background-color:#21ba45;
}
.bg-rouge {
	background-color:#cc0000;
}

.bg-orange {
	background-color:#ffcc00;
}

.bg-neutre {
	background-color:#eee;
	color:#000
}
	
.champ_err{
		color:#dc3545;
		font-size:80%;
	}

.h100{
	height:100px;
	}
	
.h_logo{
	height:70px;
	}

.table_small td { 
padding:4px 8px 4px 4px ;
font-size:12px;
text-align:left;
vertical-align:top
}



.encart{

  background-color: #fff;

  border: 1px solid rgba(0, 0, 0, 0.125);
  border-radius: 0.25rem;
}
/* pour matrice  */

    /*#parent {
        width: 200px;
        height:200px;   
		border:1px solid #999;
		/*background-color:#eee;*/
	/*	float:left;
		position:relative;
		background: rgb(58,180,66);
		background: linear-gradient(45deg, rgba(58,180,66,1) 9%, rgba(190,228,21,1) 24%, rgba(253,228,0,1) 39%, rgba(253,218,18,1) 55%, rgba(253,169,45,1) 71%, rgba(252,69,69,1) 91%);
     
	 z-index:10;
	  }
	  

      .etiquette {
        width: 100px;
        height:30px;
		line-height:30px;
		position:absolute;
		/*border:1px dashed #918DEF;*/
	/*	z-index:100;
		float:left;

      }
	  */
/* fin pour matrice  */
.avatar.avatar-red {
    background-color: rgba(232,118,159,0.1);
    color: #e8769f;
}


.avatar.avatar-green {
    background-color: #cfeab3;
    color: #21ba45;
}

.rond { /*etiquette matrice*/
	border-radius:50%; 
	width:16px; 
	height:16px; 
	line-height:16px;
	font-size: 10px;
	text-align:center;
	background-color:#F8F0F1;
}


/*
green  #cedd7a  96bd0d #708f09
indigo #e4bd51 ed7e00 #b35f00
pink #e8769f e10079 #6d0d5f
cyan #17a2b8 006ab1 #0077a8
*/





.etape1 { 	color: #99cc00 }
.etape2 {	color: #ff9933 }
.etape3 { 	color: #ff6699 }
.etape4 {	color: #3399ff }


.bg_etape1 { 	background: #99cc00 }
.bg_etape2 {	background: #ff9933 }
.bg_etape3 { 	background: #ff6699 }
.bg_etape4 {	background: #3399ff }




.ribbon .ribbon-box.etape1 {
	background: #99cc00
}
.ribbon .ribbon-box.etape1::before {
	border-color: #99cc00;
	border-right-color: transparent
}

.ribbon .ribbon-box.etape2 {
	background: #ff9933
}
.ribbon .ribbon-box.etape2::before {
	border-color: #ff9933;
	border-right-color: transparent
}

.ribbon .ribbon-box.etape3 {
	background: #ff6699
}
.ribbon .ribbon-box.etape3::before {
	border-color: #ff6699;
	border-right-color: transparent
}

.ribbon .ribbon-box.etape4 {
	background: #3399ff
}
.ribbon .ribbon-box.etape4::before {
	border-color: #3399ff;
	border-right-color: transparent
}





.btn-small, .btn-small a {
	padding: 0 0.5rem 0.25rem 0.5rem;
    font-size: 0.875rem;
    line-height: 1.5;
    border-radius: 0.2rem;
}	

 /*hightlight pour le cadre de téléchargement du box canvas en image */
 .over_box { border:0px solid #000; background-color: rgba(179, 224, 220, .2);}

/********************************** onglets fixes *************************************/
/*#page_top {
    position: fixed; z-index:9999; width: calc(100% - 70px);
}

#barre_onglet {
    z-index: 9999;
    position: fixed;
    top: 91px;
    width: calc(100% - 70px);  /* Mise en forme  comme sur main, concernant la page*/
 /*   
}*/

/**** ne sert pas sans le js ***/
/*.barre_onglet_fixe {
    z-index: 9999;
    position: fixed;
    top: 0;
   
    width: calc(100% - 70px);
}*/
/**** ne sert pas sans le js ***/
/*.barre_recherche_fixe {
    z-index: 9999;
    position: fixed;
    top: 35px;/* Mise en forme
   width: calc(100% - 70px); 
}*/

/*
#barre_page {
    padding-top:  240px;
}
.barre_entete_fixe {
    z-index: 9999;
    position: fixed;
    top: 0px;
    background-color: #fff;
    width: calc(100% - 70px);
    
  	-moz-box-shadow: 0 3px 10px rgba(41,43,48,0.25);
	-webkit-box-shadow: 0 3px 10px rgba(41,43,48,0.25);
	box-shadow: 0 3px 10px rgba(41,43,48,0.25)

}
*/
/********************************** onglets fixes *************************************/

.bigger{
	
	font-size: 1.8em;
}


.icon_nav {
    width: 36px;
    height:  40px;
	line-height:  36px;
	border-radius: 2%; /*** ade 30%;***/
	margin: auto ;
	color: #FFFFFF;
	 box-shadow: 4px 5px 3px rgba(38, 42, 55, 0.10); 
	
}


.icon_nav img {
	width: 24px;
	height:  24px;
	line-height: 24px;
	margin-bottom: 4px;
	margin-left: 1px;
}



 .icon_forme {
  /*  top: 40px;
    left: 30px;*/
	
    width: 50px;
    height: 50px;
	line-height: 50px;
    font-size: 25px;
	  
    position: absolute;
    /*border-radius: 50%;*/
	  
	border-radius: 10px;
   /*text-align: center;*/
	  
    color: var(--whiteColor);
    transition: var(--transition);
    box-shadow: 5px 15px 35px rgba(38, 42, 55, 0.12); 
    background: linear-gradient(45.24deg, #9F5FF1 5.99%, #FF54B0 91.87%); 
}

 .icon_forme:hover {
   /* border-radius: 70% 30% 30% 70% / 60% 40% 60% 40%;*/
		border-radius: 0;
		font-size: 25px !important;
}

.icon_forme img {
	width:30px;
    height:30px;
}


.bord_arrondi {
    border-radius: 20%;
	transition: var(--transition);
	text-align: center;
	box-shadow: 5px 15px 35px rgba(38, 42, 55, 0.12); 
}

.bord_arrondi:hover {
    border-radius:0%;
	 /*border-radius: 70% 30% 30% 70% / 60% 40% 60% 40%;*/
}

.bord_arrondi img {
	width:40px;
    height:40px;
}

.icon_img {
    width:30px;
    height:30px;
}

.c20 {
	width: 20px;
	height: 20px;
	line-height: 20px
}

.c15 {
	width: 15px;
	height: 15px;
	line-height: 15px
}

.c30 {
	width: 30px;
	height: 30px;
	line-height: 30px
}



.c24 {
	width: 23px;
	height: 23px;
	line-height: 23px;
		text-align: center; margin-top: 0px;
}

.c24 img {
	width:18px;
	height: 18px;
	line-height: 18px;

}



.header-action .btn i , .header-action .btn img{
   font-size: 15px; 
	vertical-align: middle !important;
}


img.icone {
height: 15px ;
	line-height:15px;

}

/*
.c39 {
	width:39px;
	height: 39px;
	line-height: 39px
}*/

.c40 {
	width:40px;
	height: 40px;
	line-height: 40px
}

.c45 {
	width: 45px;
	height: 45px;
	line-height: 45px
}
.c50 {
	width: 50px;
	height: 50px;
	line-height: 50px
}
/*
.visuel_rond {
 
    width: 20px;
    height:  20px;
    line-height:  20px;
    border-radius: 50%;
    display: inline-block;
    position: relative;
    margin: 0;
}*/



.tag_rond {
    border-radius: 50%;  
	 display: inline-block;
}


.avatar {

    background: #FFF no-repeat
}



.bg_grad_1, .bg_grad_fushia {	background: linear-gradient(45.24deg, #9F5FF1 5.99%, #FF54B0 91.87%); }/* fushia */
.bg_grad_2, .bg_grad_orange {    background: linear-gradient(44.44deg, #FF4B3F 7.79%, #FFAC30 94.18%); }/* orange */
.bg_grad_3, .bg_grad_rouge {    background: linear-gradient(45deg, #ED2775 0%, #FF7448 100%); }/* rouge */
.bg_grad_4, .bg_grad_bleu {    background: linear-gradient(44.44deg, #3F75FF 7.79%, #4ADEFF 94.18%); }/* bleu clair */
.bg_grad_5, .bg_grad_violet {    background: linear-gradient(43.32deg, #6A55F8 14.73%, #CA48F6 86.35%, #CA48F6 86.35%); }/* violet */

.bg_grad_6, .bg_grad_mauve {    background: linear-gradient(45deg, #6A55F8 0%, #EE6C74 100%); }/* violet bad */

.bg_grad_7, .bg_grad_vert {    background: linear-gradient(44.44deg, #198754 7.79%, #20c997 94.18%); }/* vert */  
.bg_grad_8 , .bg_grad_marine{    background: linear-gradient(44.44deg, #0157e0 7.79%, #2082f8 94.18%); } /* bleu marine */
.bg_grad_9 , .bg_grad_pomme{    background: linear-gradient(44.44deg, #20c997 7.79%, #9cd326 94.18%); }/* vert jaune */
.bg_grad_10 , .bg_grad_jaune {   background: linear-gradient(44.44deg, #FFAC30 7.79%, #ffc107 94.18%); }/* orange jaune */