/**
Liste des Z-index :
jgroud_input_info : 20
diapo : 400
diapo_data : 401
Header fixed , header_menu_2 : 500
Sous-menus : 505
input_color : 520
input_ville : 520
Overlay : 600
jgroud_image_zoom : 650
menuMobile : 675
connexion : 680
popup : 700
overlay_noscript : 800
noscript : 900
**/
/** -------------- Polices de caract?s -------------- **/
/*@font-face {
font-family: "Cantarell";
src: url(police/cantarell/Cantarell-Regular.ttf) format("truetype");
}
@font-face {
font-family: "OldStandard";
src: url(police/OldStandard/OldStandard-Regular.ttf) format("truetype");
}
@font-face {
font-family: "Lato";
src: url(police/Lato/Lato-Regular.ttf) format("truetype");
}
@font-face {
font-family: "Gentium";
src: url(police/Gentium/GenR102.TTF) format("truetype");
}*/
/** -------------- Fin des Polices de caract?s -------------- **/
/** -------------- Disposition G?rale -------------- **/
/*html{
position : relative;
left : -8px;
overflow-x : hidden;
}
body {
padding-bottom: 0px;
min-height: 100%;
/*font-family: "Helvetica Neue";*//*
}
#body {
width : 100%;
height : 100%;
padding : 0px;
}*/
#header {
width : 100%;
height : auto;
position : relative;
margin-top : -8px;
padding-right : 0px;
}
#content {
width : 100%;
height : auto;
position : relative;
left : 0px;
margin-top : 0px;
padding-top : 0px;
}
.mini_contenu {
width : 94%;
padding-top : 30px;
padding-bottom : 30px;
padding-left : 3%;
padding-right : 3%;
}
/** -------------- Fin des Disposition G?rale -------------- **/
/** -------------- Titres -------------- **/
.h1 {
/*font-family: "Cantarell";*/
}
.h2, .h3, .h4 {
/*font-family: "Lato";*/
}
.citation {
/*font-family: "Gentium";*/
font-style : italic;
}
/** -------------- Fin Titres -------------- **/
/** -------------- Header 1 -------------- **/
#header_menu1{
min-height : 20px;
width : 100%;
}
#header_menu1.header_fixed {
position : fixed;
z-index : 500;
width: 100%;
height : auto;
padding-left : 10px;
}
#header_menu1_table {
width : 100%;
min-height : 20px;
overflow : visible;
white-space : normal;
border-collapse: collapse;
}
#header_menu1_tr {
width : 100%;
}
#header_menu1_td_gauche{
text-align : left;
white-space: nowrap;
}
#header_menu1_td_centre{
text-align : center;
}
#header_menu1_td_droit{
text-align : right;
}
.header_menu1_span{
text-align : center;
font-size: 14px;
/*font-family: "Helvetica Neue";*/
display: inline-block;
margin-left : 0px;
margin-right : 0px;
padding-bottom: 5px;
padding-top : 3px;
padding-right : 13px;
padding-left : 13px;
color : white;
white-space: nowrap;
border-left : 1px solid rgba(0,0,0,0);
border-right : 1px solid rgba(0,0,0,0);
}
.header_menu1_span:hover {
cursor : pointer;
background-color : inherit;
border-left : 1px solid rgb(80,80,80);
border-right : 1px solid rgb(80,80,80);
}
/** -------------- Fin du Header1 -------------- **/
/** -------------- Header2 -------------- **/
#header_menu2{
width : 65%;
min-height : 20px;
left : 0px;
right : 0px;
margin : auto;
position : absolute;
z-index : 500;
margin-top : 30px;
padding-left : 20px;
padding-right : 20px;
border-radius : 6px;
opacity: 0.5;
}
#header_menu2.header_fixed {
position : fixed;
margin-top : 38px;
}
#header_menu2_table {
width : 100%;
min-height : 20px;
overflow : visible;
white-space : normal;
border-collapse: collapse;
}
#header_menu2_tr {
width : 100%;
}
#header_menu2_td_gauche{
text-align : left;
white-space: nowrap;
}
#header_menu2_td_centre{
text-align : center;
}
#header_menu2_td_droit{
text-align : right;
}
.header_menu2_span{
text-align : center;
font-size: 14px;
/*font-family: "Helvetica Neue";*/
display: inline-block;
margin-left : 0px;
margin-right : 0px;
padding-bottom: 11px;
padding-top : 9px;
padding-right : 13px;
padding-left : 13px;
color : white;
white-space: nowrap;
}
.header_menu2_span:hover {
cursor : pointer;
text-decoration : underline;
opacity : 1;
}
.header_menu2_span_active {
}
/** -------------- Fin du Header2 -------------- **/
/** -------------- Header3 -------------- **/
#header_menu3{
min-height : 5px;
width : 100%;
}
#header_menu3.header_fixed {
position : fixed;
z-index : 500;
left: 0%;
width: 100%;
height : auto;
}
#header_menu3_table {
width : 99%;
margin-left : 1%;
min-height : 5px;
white-space : normal;
border-collapse: collapse;
height : inherit;
}
#header_menu3_tr {
width : 100%;
height : inherit;
}
#header_menu3_td_gauche{
text-align : left;
white-space: nowrap;
height : inherit;
}
#header_menu3_td_centre{
text-align : center;
height : inherit;
}
#header_menu3_td_droit , #header_menu3_td_droit_mobile{
text-align : right;
padding-right : 10px;
height : inherit;
}
#header_menu3_td_droit_mobile {
display : none;
}
#header_menu3_td_droit_mobile > .img_menu{
max-width : 100%;
max-height : 100%;
}
.header_menu3_span{
text-align : center;
display: inline-block;
margin-left : 0px;
margin-right : 0px;
padding-bottom: 5px;
background-color : inherit;
white-space: nowrap;
position : relative;
}
.header_menu3_span:hover {
cursor : pointer;
text-decoration : underline;
}
.header_menu_3_logo {
height : inherit;
}
.header_sous_menu3_span {
position : absolute;
display : none;
color : inherit;
background-color : white;
text-align : center;
white-space: nowrap;
padding : 10px;
padding-left : 20px;
padding-right : 20px;
margin-left : -25px;
}
.header_sous_menu3_span:hover {
display : block;
}
.header_menu3_span:hover .header_sous_menu3_span{
display : block;
}
#menuMobile {
display : none ;
width : 100%;
height : auto;
padding-bottom : 20px;
left : 0px;
overflow : auto;
z-index : 675;
position : abosulte;
}
/** -------------- Fin du Header3 -------------- **/
/** -------------- Action sur Header -------------- **/
.header_transparent {
opacity : 0.8;
}
/** -------------- Fin des Action sur Header -------------- **/
/** -------------- Header Image -------------- **/
#header_div_image {
width : 100%;
overflow : hidden;
position : relative;
}
#header_image {
width : 100%;
height: auto;
}
#header_image_voile9 , #header_image_voile8 , #header_image_voile7 , #header_image_voile6 , #header_image_voile5 , #header_image_voile4 , #header_image_voile3 , #header_image_voile2 , #header_image_voile1 {
width : inherit;
height : 100%;
position : absolute;
top : 0px;
left : 0px;
z-index : 90;
}
#header_image_voile9 {
background-color : rgba(0,0,0,0.9);
}
#header_image_voile8 {
background-color : rgba(0,0,0,0.8);
}
#header_image_voile7 {
background-color : rgba(0,0,0,0.7);
}
#header_image_voile6 {
background-color : rgba(0,0,0,0.6);
}
#header_image_voile5 {
background-color : rgba(0,0,0,0.5);
}
#header_image_voile4{
background-color : rgba(0,0,0,0.4);
}
#header_image_voile3 {
background-color : rgba(0,0,0,0.3);
}
#header_image_voile2 {
background-color : rgba(0,0,0,0.2);
}
#header_image_voile1 {
background-color : rgba(0,0,0,0.1);
}
#header_image_texte {
position : absolute;
bottom : 15%;
}
.header_image_texte_gauche {
left : 5%;
}
.header_image_texte_droit {
right : 5%
}
/** -------------- Fin du Header Image -------------- **/
/** -------------- Footer -------------- **/
#footer {
width : 100%;
height : auto;
position : relative;
bottom : -8px;
min-height : 5px;
margin-top : -8px;
}
/** -------------- Fin du Footer -------------- **/
/** -------------- Boutons -------------- **/
.bouton {
padding-left : 10px;
padding-right : 10px;
padding-top : 8px;
padding-bottom : 8px;
border-radius : 4px;
color : white;
border : none;
height : auto;
width : auto;
-moz-box-shadow: 0px 0px 5px 0px #656565;
-webkit-box-shadow: 0px 0px 5px 0px #656565;
-o-box-shadow: 0px 0px 5px 0px #656565;
box-shadow: 0px 0px 5px 0px #656565;
}
.bouton:hover {
opacity : 0.8;
cursor: pointer;
}
.bouton_desactive , .bouton_desactive:hover{
opacity: 0.3;
cursor: default;
}
.bouton_petit{
padding : 2px;
font-size : 12px;
}
.bouton_gros{
padding-left : 15px;
padding-right : 15px;
padding-top : 13px;
padding-bottom : 13px;
font-size : 18px;
}
.bouton_tres_gros{
padding-left : 20px;
padding-right : 20px;
padding-top : 17px;
padding-bottom : 17px;
font-size : 22px;
}
/** -------------- Fin des Boutons -------------- **/
/** -------------- Textes-couleurs -------------- **/
.texte_couleur_gris {
color : rgb(180,180,180);
}
.texte_couleur_gris_claire {
color : rgb(220,220,220);
}
.texte_couleur_gris_fonce {
color : rgb(120,120,120);
}
.texte_couleur_gris_tres_fonce {
color : rgb(80,80,80);
}
.texte_couleur_bleu {
color : rgb(67,116,224);
}
.texte_couleur_bleu_claire {
color : rgb(24,167,255);
}
.texte_couleur_bleu_fonce {
color : rgb(40,62,251);
}
.texte_couleur_vert {
color : rgb(71,175,41);
}
.texte_couleur_vert_claire {
color : rgb(20,205,34);
}
.texte_couleur_vert_fonce {
color : rgb(61,122,46);
}
.texte_couleur_rouge {
color : rgb(255,28,28);
}
.texte_couleur_rouge_claire {
color : rgb(255,0,0);
}
.texte_couleur_rouge_fonce {
color : rgb(145,0,0);
}
.texte_couleur_noir {
color : rgb(0,0,0);
}
.texte_couleur_blanc {
color : rgb(255,255,255);
}
.texte_couleur_orange {
color : rgb(237,79,42);
}
.texte_couleur_rose {
color : rgb(255,128,192);
}
.texte_couleur_jaune {
color : rgb(255,255,0);
}
/** -------------- Fin des Textes-couleurs -------------- **/
/** -------------- Fonds-couleurs -------------- **/
/*
.fond_gris {
background-color : rgb(180,180,180);
}
.fond_gris_claire {
background-color : rgb(220,220,220);
}
.fond_gris_fonce {
background-color : rgb(120,120,120);
}
.fond_bleu {
background-color : rgb(67,116,224);
}
.fond_bleu_claire {
background-color : rgb(24,167,255);
}
.fond_bleu_fonce {
background-color : rgb(40,62,251);
}
.fond_vert {
background-color : rgb(71,175,41);
}
.fond_vert_claire {
background-color : rgb(20,205,34);
}
.fond_vert_fonce {
background-color : rgb(61,122,46);
}
.fond_rouge {
background-color : rgb(255,28,28);
}
.fond_rouge_claire {
background-color : rgb(255,0,0);
}
.fond_rouge_fonce {
background-color : rgb(201,5,24);
}
.fond_noir {
background-color : rgb(0,0,0);
}
.fond_blanc {
background-color : rgb(255,255,255);
}
.fond_orange {
background-color : rgb(237,79,42);
}
.fond_rose {
background-color : rgb(255,128,192);
}
.fond_jaune {
background-color : rgb(255,255,0);
}
*/
/*
:root {
* Rouge : *
--rouge_pale : rgb(255,50,50);
--rouge_claire : rgb(255,0,0);
--rouge_normal : rgb(200,0,0);
--rouge_fonce : rgb(150,0,0);
--rouge_tres_fonce : rgb(100,0,0);
* Vert : *
--vert_pale : rgb(153,255,50);
--vert_claire : rgb(0,255,0);
--vert_normal : rgb(0,150,0);
--vert_fonce : rgb(0,100,0);
--vert_tres_fonce : rgb(0,50,0);
* Bleu : *
--bleu_pale : rgb(150,255,255);
--bleu_claire : rgb(24,167,255);
--bleu_normal : rgb(0,127,255);
--bleu_fonce : rgb(50,50,150);
--bleu_tres_fonce : rgb(0,20,100);
* Jaune : *
--jaune_pale : rgb(255,236,139);
--jaune_claire : rgb(255,255,0);
--jaune_normal : rgb(255,215,0);
--jaune_fonce : rgb(238,201,0);
--jaune_tres_fonce : rgb(205,173,0);
* Orange : *
--orange_pale : rgb(255,127,36);
--orange_claire : rgb(255,140,0);
--orange_normal : rgb(255,127,0);
--orange_fonce : rgb(255,127,0);
--orange_tres_fonce : rgb(238,118,0);
* Gris : *
--gris_pale : rgb(195,195,195);
--gris_claire : rgb(170,170,170);
--gris_normal : rgb(140,140,140);
--gris_fonce : rgb( 110,110,110);
--gris_tres_fonce : rgb(65,65,65);
* Noir : *
--noir_pale : rgb(60,60,60);
--noir_claire : rgb(50,50,50);
--noir_normal : rgb(40,40,40);
--noir_fonce : rgb(20,20,20);
--noir_tres_fonce : rgb(0,0,0);
* Voilet : *
--violet_pale : rgb(255,70,255);
--violet_claire : rgb(204,0,204);
--violet_normal : rgb(127,0,255);
--violet_fonce : rgb(50,0,100);
--violet_tres_fonce : rgb(50,0,50);
* Rose : *
--rose_pale : rgb(255,225,255);
--rose_claire : rgb(238,130,238);
--rose_normal : rgb(255,131,250);
--rose_fonce : rgb(238,122,233);
--rose_tres_fonce : rgb(238,48,167);
* Marron : *
--marron_pale : rgb(255,178,102);
--marron_claire : rgb(204,102,0);
--marron_normal : rgb(150,73,0);
--marron_fonce : rgb(100,50,0);
--marron_tres_fonce : rgb(51,25,0);
}
*/
.fond_blanc {
background-color : rgb(255,255,255);
}
.fond_marron_tres_fonce {
background-color: rgb(51,25,0);
}
.fond_marron_fonce {
background-color: rgb(100,50,0);
}
.fond_marron_normal {
background-color: rgb(150,73,0);
}
.fond_marron_claire {
background-color: rgb(204,102,0);
}
.fond_marron_pale {
background-color: rgb(255,178,102);
}
.fond_marron {
background-color: rgb(150,73,0);
}
.fond_bleu_tres_fonce {
background-color: rgb(0,20,100);
}
.fond_bleu_fonce {
background-color: rgb(50,50,150);
}
.fond_bleu_normal {
background-color: rgb(0,127,255);
}
.fond_bleu_claire {
background-color: rgb(24,167,255);
}
.fond_bleu_pale {
background-color: rgb(150,255,255);
}
.fond_bleu {
background-color: rgb(67,116,224);
}
.fond_vert_tres_fonce {
background-color: rgb(0,50,0);
}
.fond_vert_fonce {
background-color: rgb(0,100,0);
}
.fond_vert_normal {
background-color: rgb(0,150,0);
}
.fond_vert_claire {
background-color: rgb(0,255,0);
}
.fond_vert_pale {
background-color: rgb(153,255,50);
}
.fond_vert {
background-color : rgb(71,175,41);
}
.fond_orange_tres_fonce {
background-color: rgb(204,85,0);
}
.fond_orange_fonce {
background-color: rgb(255,109,20);
}
.fond_orange_normal {
background-color: rgb(255,127,0);
}
.fond_orange_claire {
background-color: rgb(237,127,16);
}
.fond_orange_pale {
background-color: rgb(255,111,125);
}
.fond_orange {
background-color: rgb(237,79,42);
}
.fond_noir_tres_fonce {
background-color: rgb(0,0,0);
}
.fond_noir_fonce {
background-color: rgb(20,20,20);
}
.fond_noir_normal {
background-color: rgb(40,40,40);
}
.fond_noir_claire {
background-color: rgb(50,50,50);
}
.fond_noir_pale {
background-color: rgb(60,60,60);
}
.fond_noir {
background-color: rgb(0,0,0);
}
.fond_jaune_tres_fonce {
background-color: rgb(205,173,0);
}
.fond_jaune_fonce {
background-color: rgb(238,201,0);
}
.fond_jaune_normal {
background-color: rgb(250,240,0);
}
.fond_jaune_claire {
background-color: rgb(255,255,0);
}
.fond_jaune_pale {
background-color: rgb(255,236,139);
}
.fond_jaune {
background-color: rgb(255,255,0);
}
.fond_rouge_tres_fonce {
background-color: rgb(100,0,0);
}
.fond_rouge_fonce {
background-color: rgb(150,0,0);
}
.fond_rouge_normal {
background-color: rgb(200,0,0);
}
.fond_rouge_claire {
background-color: rgb(255,0,0);
}
.fond_rouge_pale {
background-color: rgb(255,50,50);
}
.fond_rouge {
background-color: rgb(255,28,28);
}
.fond_violet_tres_fonce {
background-color: rgb(50,0,50);
}
.fond_violet_fonce {
background-color: rgb(50,0,100);
}
.fond_violet_normal {
background-color: rgb(127,0,255);
}
.fond_violet_claire {
background-color: rgb(204,0,204);
}
.fond_violet_pale {
background-color: rgb(255,70,255);
}
.fond_violet {
background-color: rgb(127,0,255);
}
.fond_gris_tres_fonce {
background-color: rgb(65,65,65);
}
.fond_gris_fonce {
background-color: rgb( 110,110,110);
}
.fond_gris_normal {
background-color: rgb(140,140,140);
}
.fond_gris_claire {
background-color: rgb(170,170,170);
}
.fond_gris_pale {
background-color: rgb(195,195,195);
}
.fond_gris {
background-color: rgb(180,180,180);
}
.fond_rose_tres_fonce {
background-color: rgb(238,48,167);
}
.fond_rose_fonce {
background-color: rgb(238,122,233);
}
.fond_rose_normal {
background-color: rgb(255,131,250);
}
.fond_rose_claire {
background-color: rgb(238,130,238);
}
.fond_rose_pale {
background-color: rgb(255,225,255);
}
.fond_rose {
background-color: rgb(255,128,192);
}
/** -------------- Fin des Fonds-couleurs -------------- **/
/** -------------- Formes -------------- **/
.forme_rond {
border-radius : 500px;
}
.forme_rond_mini {
height : 20px;
width : 20px;
border-radius : 500px;
padding : 0px;
}
.forme_carre_mini {
height : 20px;
width : 20px;
padding : 0px;
}
.forme_rectangle_mini {
height : 20px;
width : 30px;
padding : 0px;
}
/** -------------- Fin des Formes -------------- **/
/** -------------- table -------------- **/
.container_table {
height : auto;
overflow : auto;
}
.table {
position : relative;
width : 100%;
max-width : 100%;
left : 0px;
right : 0px;
margin : auto;
border-collapse: collapse;
overflow : visible;
white-space : normal;
}
.table>tbody{
overflow : auto;
}
.table>thead{
background: rgb(240,240,240);
}
.table_bordure>tbody>tr>td , .table_bordure>thead>tr>th {
border : 1px solid rgb(160,160,160);
}
.table>thead>tr>th{
border-bottom : 3px solid rgb(24,167,255);
}
.table>tbody>tr>td, .table>thead>tr>th{
padding : 5px;
text-align : center;
word-wrap: break-word;
max-width : 100px;
/*font-family: "Helvetica Neue";*/
}
.table>tbody>tr:hover{
background-color : rgba(24,167,255,0.3);
}
.table>tbody>tr{
border-bottom : 1px solid rgb(150,150,150);
}
.table>tbody>.active{
background-color: rgba(255,229,44,0.4);
}
.table>tbody>.succes{
background-color : rgba(20,205,34,0.3);
}
.table>tbody>.erreur{
background-color : rgba(255,0,0,0.3);
}
.table>tbody>.alerte{
background-color: rgba(255, 157, 55, 0.3);
}
.table>tbody>.desactive{
color : rgb(150,150,150);
background-color : rgb(230,230,230);
}
.table>tbody>tr>.active{
background-color: rgba(255,229,44,0.4);
}
.table>tbody>tr>.succes{
background-color : rgba(20,205,34,0.3);
}
.table>tbody>tr>.erreur{
background-color : rgba(255,0,0,0.3);
}
.table>tbody>tr>.alerte{
background-color: rgba(255, 157, 55, 0.3);
}
.table>tbody>tr>.desactive{
color : rgb(150,150,150);
background-color : rgb(230,230,230);
}
.td_gauche {
text-align : left;
}
.td_droit {
text-align : right;
}
.td_centre{
text-align : center;
}
/** -------------- Fin des table -------------- **/
/** -------------- texte_align -------------- **/
.texte_align_gauche{
text-align : left;
}
.texte_align_droite{
text-align : right;
}
.texte_align_centre{
text-align : center;
}
/** -------------- Fin des texte_align -------------- **/
/** -------------- texte_taille -------------- **/
.texte_taille_petit{
font-size : 14px;
}
.texte_taille_moyen{
font-size : 18px;
}
.texte_taille_gros{
font-size : 21px;
}
.texte_taille_tres_gros{
font-size : 26px;
}
.texte_taille_enorme {
font-size : 35px;
}
/** -------------- Fin des text_texte_taille -------------- **/
/** -------------- texte_type -------------- **/
.texte_italic, .texte_italique{
font-style: italic;
}
.texte_normal{
font-weight: normal;
}
.texte_gras , .texte_bold{
font-weight: bold;
}
.texte_souligne, .texte_underline{
text-decoration: underline;
}
.texte_surligne, .texte_line_through{
text-decoration: line-through;
}
/** -------------- Fin des texte_type -------------- **/
/** -------------- Liens -------------- **/
.lien , .lien:hover , .lien:link , .lien:active , .lien:visited {
text-decoration : none;
font-family: inherit;
color : inherit;
border : none;
}
a img {
border: 0;
}
/** -------------- Fin des Liens -------------- **/
/** -------------- Popup -------------- **/
#overlay {
display: none;
z-index: 600;
background: rgba(0,0,0,0.5);
position: fixed;
width: 100%;
height: 100%;
top: 0px;
left: 0px;
text-align: center;
}
#popup {
display : none;
position : fixed;
width : 60%;
height : auto;
top : 100px;
z-index : 700;
right : 0px;
left : 0px;
margin : auto;
padding : 30px;
border-radius : 10px;
color : white;
text-align : center;
}
#jgroud_fonction_confirm {
display : none;
}
#jgroud_image_zoom{
max-width : 80%;
max-height : 80%;
position : fixed;
top : 50px;
left : 0px;
right : 0px;
margin : auto;
display : none;
z-index: 650;
}
#jgroud_connexion {
display : none;
position : absolute;
left : 0;
right : 0;
margin : auto;
width : 40%;
padding : 10px;
background-color : rgb(71,175,41);
border-radius : 6px;
border : 1px solid green;
z-index : 680;
top : 30px;
color : white;
text-align : center;
}
/** -------------- Fin des Popup -------------- **/
/** -------------- Taille des Divs -------------- **/
.div100 , .div90 , .div80 , .div70 , .div60 , .div58 , .div56 , .div54 , .div50 , .div40 , .div30 , .div25 , .div20 , .div15 , .div10 , .div95 {
left : 0px;
right : 0px;
margin : auto;
}
.div90_mobile , .div80_mobile , .div70_mobile , .div60_mobile , .div50_mobile , .div40_mobile , .div30_mobile , .div25_mobile , .div20_mobile , .div15_mobile , .div10_mobile , .div95_mobile {
width : 95%;
left : 0px;
right : 0px;
margin : auto;
}
.div100 , .width100 {
width : 100%;
}
.div95 , .width95 {
width : 95%;
}
.div90 , .width90 {
width : 90%;
}
.div80 , .width80 {
width : 80%;
}
.div70 , .width70 {
width : 70%;
}
.div60 , .width60 {
width : 60%;
}
.div58 , .width58 {
width : 58%;
}
.div56 , .width56 {
width : 56%;
}
.div54 , .width54 {
width : 54%;
}
.div50 , .width50 {
width : 50%;
}
.div40 , .width40 {
width : 40%;
}
.div30 , .width30 {
width : 30%;
}
.div25 , .width25 {
width : 25%;
}
.div20 , .width20 {
width : 20%;
}
.div15 , .width15 {
width : 15%
}
.div10 , .width10 {
width : 10%;
}
.width70x {
width : 70px;
}
.width80x {
width : 80px;
}
.width90x {
width : 90px;
}
.width100x {
width : 100px;
}
.width110x {
width : 110px;
}
.width120x {
width : 120px;
}
.width130x {
width : 130px;
}
.width140x {
width : 140px;
}
.width150x {
width : 150px;
}
.width160x {
width : 160px;
}
.width170x {
width : 170px;
}
.width180x {
width : 180px;
}
.width190x {
width : 190px;
}
.width200x {
width : 200px;
}
.width250x {
width : 250px;
}
.width300x {
width : 300px;
}
.width350x {
width : 350px;
}
/** -------------- Fin des Taille des Divs -------------- **/
/** -------------- Margins -------------- **/
.margin_left0 {
margin-left : 0px;
}
.margin_left5 {
margin-left : 5px;
}
.margin_left10 {
margin-left : 10px;
}
.margin_left15 {
margin-left : 15px;
}
.margin_left20 {
margin-left : 20px;
}
.margin_left25 {
margin-left : 25px;
}
.margin_left30 {
margin-left : 30px;
}
.margin_left35 {
margin-left : 35px;
}
.margin_left40 {
margin-left : 40px;
}
.margin_left45 {
margin-left : 45px;
}
.margin_left50 {
margin-left : 50px;
}
.margin_left60 {
margin-left : 60px;
}
.margin_left70 {
margin-left : 70px;
}
.margin_left80 {
margin-left : 80px;
}
.margin_left90 {
margin-left : 90px;
}
.margin_left100 {
margin-left : 100px;
}
.margin_left200 {
margin-left : 200px;
}
.margin_right0 {
margin-right : 0px;
}
.margin_right5 {
margin-right : 5px;
}
.margin_right10 {
margin-right : 10px;
}
.margin_right15 {
margin-right : 15px;
}
.margin_right20 {
margin-right : 20px;
}
.margin_right25 {
margin-right : 25px;
}
.margin_right30 {
margin-right : 30px;
}
.margin_right35 {
margin-right : 35px;
}
.margin_right40 {
margin-right : 40px;
}
.margin_right45 {
margin-right : 45px;
}
.margin_right50 {
margin-right : 50px;
}
.margin_right60 {
margin-right : 60px;
}
.margin_right70 {
margin-right : 70px;
}
.margin_right80 {
margin-right : 80px;
}
.margin_right90 {
margin-right : 90px;
}
.margin_right100 {
margin-right : 100px;
}
.margin_right200 {
margin-right : 100px;
}
.margin_top0 {
margin-top : 0px;
}
.margin_top5 {
margin-top : 5px;
}
.margin_top10 {
margin-top : 10px;
}
.margin_top15 {
margin-top : 15px;
}
.margin_top20 {
margin-top : 20px;
}
.margin_top25 {
margin-top : 25px;
}
.margin_top30 {
margin-top : 30px;
}
.margin_top35 {
margin-top : 35px;
}
.margin_top40 {
margin-top : 40px;
}
.margin_top45 {
margin-top : 45px;
}
.margin_top50 {
margin-top : 50px;
}
.margin_top60 {
margin-top : 60px;
}
.margin_top70 {
margin-top : 70px;
}
.margin_top80 {
margin-top : 80px;
}
.margin_top90 {
margin-top : 90px;
}
.margin_top100 {
margin-top : 100px;
}
.margin_bottom0 {
margin-bottom : 0px;
}
.margin_bottom5 {
margin-bottom : 5px;
}
.margin_bottom10 {
margin-bottom : 10px;
}
.margin_bottom15 {
margin-bottom : 15px;
}
.margin_bottom20 {
margin-bottom : 20px;
}
.margin_bottom25 {
margin-bottom : 25px;
}
.margin_bottom30 {
margin-bottom : 30px;
}
.margin_bottom35 {
margin-bottom : 35px;
}
.margin_bottom40 {
margin-bottom : 40px;
}
.margin_bottom45 {
margin-bottom : 45px;
}
.margin_bottom50 {
margin-bottom : 50px;
}
.margin_bottom60 {
margin-bottom : 60px;
}
.margin_bottom70 {
margin-bottom : 70px;
}
.margin_bottom80 {
margin-bottom : 80px;
}
.margin_bottom90 {
margin-bottom : 90px;
}
.margin_bottom100 {
margin-bottom : 100px;
}
/** -------------- Fin des Margins -------------- **/
/** -------------- Paddings -------------- **/
.padding5 {
padding : 5px;
}
.padding10 {
padding : 10px;
}
.padding15 {
padding : 15px;
}
.padding20 {
padding : 20px;
}
.padding25 {
padding : 25px;
}
.padding30 {
padding : 30px;
}
.padding35 {
padding : 35px;
}
.padding40 {
padding : 40px;
}
.padding45 {
padding : 45px;
}
.padding50 {
padding : 50px;
}
.padding60 {
padding : 60px;
}
.padding70 {
padding : 70px;
}
.padding80 {
padding : 80px;
}
.paddingt90 {
padding : 90px;
}
.padding100 {
padding : 100px;
}
.padding_left0 {
padding-left : 0px;
}
.padding_left5 {
padding-left : 5px;
}
.padding_left10 {
padding-left : 10px;
}
.padding_left15 {
padding-left : 15px;
}
.padding_left20 {
padding-left : 20px;
}
.padding_left25 {
padding-left : 25px;
}
.padding_left30 {
padding-left : 30px;
}
.padding_left35 {
padding-left : 35px;
}
.padding_left40 {
padding-left : 40px;
}
.padding_left45 {
padding-left : 45px;
}
.padding_left50 {
padding-left : 50px;
}
.padding_left60 {
padding-left : 60px;
}
.padding_left70 {
padding-left : 70px;
}
.padding_left80 {
padding-left : 80px;
}
.padding_left90 {
padding-left : 90px;
}
.padding_left100 {
padding-left : 100px;
}
.padding_right0 {
padding-right : 0px;
}
.padding_right5 {
padding-right : 5px;
}
.padding_right10 {
padding-right : 10px;
}
.padding_right15 {
padding-right : 15px;
}
.padding_right20 {
padding-right : 20px;
}
.padding_right25 {
padding-right : 25px;
}
.padding_right30 {
padding-right : 30px;
}
.padding_right35 {
padding-right : 35px;
}
.padding_right40 {
padding-right : 40px;
}
.padding_right45 {
padding-right : 45px;
}
.padding_right50 {
padding-right : 50px;
}
.padding_right60 {
padding-right : 60px;
}
.padding_right70 {
padding-right : 70px;
}
.padding_right80 {
padding-right : 80px;
}
.padding_right90 {
padding-right : 90px;
}
.padding_right100 {
padding-right : 100px;
}
.padding_top5 {
padding-top : 5px;
}
.padding_top10 {
padding-top : 10px;
}
.padding_top15 {
padding-top : 15px;
}
.padding_top20 {
padding-top : 20px;
}
.padding_top25 {
padding-top : 25px;
}
.padding_top30 {
padding-top : 30px;
}
.padding_top35 {
padding-top : 35px;
}
.padding_top40 {
padding-top : 40px;
}
.padding_top45 {
padding-top : 45px;
}
.padding_top50 {
padding-top : 50px;
}
.padding_top60 {
padding-top : 60px;
}
.padding_top70 {
padding-top : 70px;
}
.padding_top80 {
padding-top : 80px;
}
.padding_top90 {
padding-top : 90px;
}
.padding_top100 {
padding-top : 100px;
}
.padding_bottom5 {
padding-bottom : 5px;
}
.padding_bottom10 {
padding-bottom : 10px;
}
.padding_bottom15 {
padding-bottom : 15px;
}
.padding_bottom20 {
padding-bottom : 20px;
}
.padding_bottom25 {
padding-bottom : 25px;
}
.padding_bottom30 {
padding-bottom : 30px;
}
.padding_bottom35 {
padding-bottom : 35px;
}
.padding_bottom40 {
padding-bottom : 40px;
}
.padding_bottom45 {
padding-bottom : 45px;
}
.padding_bottom50 {
padding-bottom : 50px;
}
.padding_bottom60 {
padding-bottom : 60px;
}
.padding_bottom70 {
padding-bottom : 70px;
}
.padding_bottom80 {
padding-bottom : 80px;
}
.padding_bottom90 {
padding-bottom : 90px;
}
.padding_bottom100 {
padding-bottom : 100px;
}
.padding_left1p {
padding-left : 1%;
}
.padding_left2p {
padding-left : 2%;
}
.padding_left3p {
padding-left : 3%;
}
.padding_left4p {
padding-left : 4%;
}
.padding_left5p {
padding-left : 5%;
}
.padding_left6p {
padding-left : 6%;
}
.padding_left7p {
padding-left : 7%;
}
.padding_left8p {
padding-left : 8%;
}
.padding_left9p {
padding-left : 9%;
}
.padding_left10p {
padding-left : 10%;
}
.padding_left15p {
padding-left : 15%;
}
.padding_left20p {
padding-left : 20%;
}
.padding_left25p {
padding-left : 25%;
}
.padding_left30p {
padding-left : 30%;
}
.padding_left40p {
padding-left : 40%;
}
.padding_left50p {
padding-left : 50%;
}
.padding_right1p {
padding-right : 1%;
}
.padding_right2p {
padding-right : 2%;
}
.padding_right3p {
padding-right : 3%;
}
.padding_right4p {
padding-right : 4%;
}
.padding_right5p {
padding-right : 5%;
}
.padding_right6p {
padding-right : 6%;
}
.padding_right7p {
padding-right : 7%;
}
.padding_right8p {
padding-right : 8%;
}
.padding_right9p {
padding-right : 9%;
}
.padding_right10p {
padding-right : 10%;
}
.padding_right15p {
padding-right : 15%;
}
.padding_right20p {
padding-right : 20%;
}
.padding_right25p {
padding-right : 25%;
}
.padding_right30p {
padding-right : 30%;
}
.padding_right40p {
padding-right : 40%;
}
.padding_right50p {
padding-right : 50%;
}
.margin_left1p {
margin-left : 1%;
}
.margin_left2p {
margin-left : 2%;
}
.margin_left3p {
margin-left : 3%;
}
.margin_left4p {
margin-left : 4%;
}
.margin_left5p {
margin-left : 5%;
}
.margin_left6p {
margin-left : 6%;
}
.margin_left7p {
margin-left : 7%;
}
.margin_left8p {
margin-left : 8%;
}
.margin_left9p {
margin-left : 9%;
}
.margin_left10p {
margin-left : 10%;
}
.margin_left15p {
margin-left : 15%;
}
.margin_left20p {
margin-left : 20%;
}
.margin_left25p {
margin-left : 25%;
}
.margin_left30p {
margin-left : 30%;
}
.margin_left40p {
margin-left : 40%;
}
.margin_left50p {
margin-left : 50%;
}
.margin_left55p {
margin-left : 55%;
}
.margin_left60p {
margin-left : 60%;
}
.margin_left70p {
margin-left : 70%;
}
.margin_left80p {
margin-left : 80%;
}
.margin_left90p {
margin-left : 90%;
}
.margin_left95p {
margin-left : 95%;
}
.margin_right1p {
margin-right : 1%;
}
.margin_right2p {
margin-right : 2%;
}
.margin_right3p {
margin-right : 3%;
}
.margin_right4p {
margin-right : 4%;
}
.margin_right5p {
margin-right : 5%;
}
.margin_right6p {
margin-right : 6%;
}
.margin_right7p {
margin-right : 7%;
}
.margin_right8p {
margin-right : 8%;
}
.margin_right9p {
margin-right : 9%;
}
.margin_right10p {
margin-right : 10%;
}
.margin_right15p {
margin-right : 15%;
}
.margin_right20p {
margin-right : 20%;
}
.margin_right25p {
margin-right : 25%;
}
.margin_right30p {
margin-right : 30%;
}
.margin_right40p {
margin-right : 40%;
}
.margin_right50p {
margin-right : 50%;
}
/** -------------- Fin des Paddings -------------- **/
/** -------------- Tailles du texte -------------- **/
.texte_tres_petit {
font-size : 10px;
}
.texte_petit {
font-size: 12px;
}
.texte_grand {
font-size: 16px;
}
.texte_tres_grand{
font-size: 20px;
}
/** -------------- Fin des Tailles du texte -------------- **/
/** -------------- Position du texte -------------- **/
.texte_droit {
text-align: right;
}
.texte_centre, .texte_centre_mobile {
text-align: center;
}
.texte_gauche {
text-align: left;
}
/** -------------- Fin des Position du texte -------------- **/
/** -------------- Inputs -------------- **/
.input_div , .textearea{
border : 1px solid rgb(170,170,170);
padding-top : 3px;
padding-bottom : 3px;
padding-left : 5px;
padding-right : 5px;
background-color : white;
border-radius : 3px;
height : auto;
width : auto;
display : inline-block;
box-sizing: border-box;
}
.textearea {
border : 1px solid rgb(120,120,120);
max-width : 100%;
min-width : 100%;
min-height : 100px;
max-height : 300px;
}
.input_div:link{
border : 1px solid rgb(120,120,120);
}
.input_div>.input , .input_div>label>.input {
border : none;
width : 80%;
}
.input_div>.input_image , .input_div>label>.input_image {
display : inline-block;
width : 10px;
height : 10px;
max-width : 10%;
max-height : 80%;
position : relative;
margin-left : 10px;
}
.input_div_moyen {
padding-top : 5px;
padding-bottom : 5px;
padding-left : 8px;
padding-right : 8px;
}
.input_div_moyen>.input , .input_div_moyen>label>.input {
font-size : 20px
}
.input_div_grand {
padding-top : 8px;
padding-bottom : 8px;
padding-left : 12px;
padding-right : 12px;
}
.input_div_grand>.input , .input_div_grand>label>.input {
font-size : 26px;
}
.input_div_grand>.input_image , .input_div_grand>label>.input_image {
width : 26px;
height : 26px;
display : inline-block;
}
.input_div100 {
width : 100%;
}
.input_div99 {
width : 99%;
}
.input_div90 {
width : 90%;
}
.input_div80 {
width : 80%;
}
.input_div50 {
width : 50%
}
.input_div44 {
width : 44%
}
.input_div40 {
width : 40%
}
.input_div_erreur {
border-color : rgb(255,28,28);
}
.input_div_valide {
border-color : rgb(71,175,41);;
}
.input_div_bleu {
border-color : rgb(24,167,255);
}
.input_image_valider_vert , .input_image_croix_rouge {
background-repeat:no-repeat;
background-size : contain;
top : 2px;
}
.input_div_moyen>.input_image {
width : 20px;
height : 20px;
display : inline-block;
}
.input_image_valider_vert {
background-image:url(../images/icones/valider_vert.jpg);
}
.input_image_croix_rouge {
background-image:url(../images/icones/croix_rouge.jpg);
}
.delete , .add , .moins{
width : 10px;
height : 10px;
display : inline-block;
background-repeat:no-repeat;
background-size : contain;
position : relative;
}
.delete {
background-image:url(../images/icones/delete.png);
}
.add {
background-image:url(../images/icones/add.png);
}
.moins {
background-image:url(../images/icones/moins.png);
}
.table_input_color tr td {
width : 20px;
height : 20px;
}
.input_color {
width : 20px;
height : 20px;
border : 1px solid rgb(180,180,180);
background-color : rgb(110,110,110);
right : 0px;
}
.input_color:hover , .input_date:hover {
cursor : pointer;
}
.input_color , .input_date {
cursor : pointer;
display : inline-block;
}
.input_date {
background-color : white;
padding-left : 10px;
padding-right : 10px;
padding-top : 1px;
padding-bottom : 1px;
border : 1px solid rgb(150,150,150);
}
.div_input_date {
padding : 4px;
width : 300px;
position : absolute;
border : 1px solid black;
z-index : 520;
background-color : white;
}
.div_input_color {
width : 400px;
height : 224px;
padding : 4px;
position : absolute;
z-index : 520;
background-color : white;
border-radius : 4px;
}
.table_input_color{
border-collapse : collapse;
width : auto;
height : auto;
margin-left : 10px;
}
.progress_bar {
width : 200px;
height : 15px;
max-width : 210px;
min-width : 0px;
}
.progress_bar_debut , .progress_bar_fin {
border : 1px solid rgb(190,190,190);
border-radius : 6px;
height : 10px;
display : inline-block;
max-width : inherit;
min-width : inherit;
}
.progress_bar_debut {
width : 14px;
background-color : green;
border-right : none;
}
.progress_bar_fin {
width : 184px;
background-color : white;
border-left : none;
}
.progress_bar_cursor {
height : 16px;
width : 7px;
border-radius : 6px;
background-color : white;
position : absolute;
border : 1px solid rgb(100,100,100);
}
.progress_bar_cursor:hover {
cursor : pointer;
}
.progress_bar_nombre {
display : inline-block;
position : absolute;
}
.jgroud_input_info {
position : absolute;
border-radius : 2px;
-moz-box-shadow: 0px 0px 5px 0px #656565;
-webkit-box-shadow: 0px 0px 5px 0px #656565;
-o-box-shadow: 0px 0px 5px 0px #656565;
box-shadow: 0px 0px 5px 0px #656565;
z-index: 20;
}
.jgroud_input_info_relatif {
width : 100%;
height : 100%;
position : relative;
}
.jgroud_input_info_texte {
padding-left : 13px;
padding-right : 13px;
padding-top : 7px;
padding-bottom : 7px;
}
.input_code_postale {
width : 70px;
text-align : center;
}
.input_ville {
width : 300px;
text-align : center;
}
.input_ville_list_code_postale, .input_ville_list_villes {
border-radius : 3px;
border : 1px solid rgb(150,150,150);
}
.input_ville_list_code_postale>.hover:hover , .input_ville_list_villes >.hover:hover {
text-decoration : underline;
}
.input_ville_list_code_postale, .input_ville_list_villes{
position : absolute;
z-index : 520;
padding : 10px;
max-height : 250px;
overflow : auto;
}
.input_nb {
Border-radius : 5px;
padding : 3px;
line-height: 15px;
text-align : center;
}
.input_nb , .input_nb_plus , .input_nb_val , .input_nb_moins {
display : inline-block;
background-color : white;
}
.input_nb_plus , .input_nb_moins {
width : 22px;
height : 10px;
background-size: 100%;
background-repeat: no-repeat;
background-position : 0px;
}
.input_nb_plus:hover , .input_nb_moins:hover {
cursor:pointer;
}
.input_nb_plus {
background-image : url(../images/icones/up.png);
}
.input_nb_moins {
background-image : url(../images/icones/down.png);
}
/** -------------- Fin des Inputs -------------- **/
/** -------------- Fl?es -------------- **/
.fleche_haut , .fleche_bas , .fleche_droite , .fleche_gauche {
width: 0;
height: 0;
border-left: 7px solid transparent;
border-right: 7px solid transparent;
border-bottom: 7px solid transparent;
border-top: 7px solid transparent;
position : absolute;
}
.fleche_haut , .fleche_bas {
left : 0px;
right : 0px;
margin : auto;
}
.fleche_droite , .fleche_gauche {
top : 0px;
bottom : 0px;
margin : auto;
}
.fleche_haut {
border-top : none;
top : -7px;
border-bottom : 7px solid black;
border-bottom-color : inherit;
}
.fleche_bas {
border-bottom : none;
top : 100%;
margin-bottom : -7px;
border-top : 7px solid black;
border-top-color : inherit;
}
.fleche_droite {
border-right : none;
left : 100%;
margin-right : -7px;
border-left : 7px solid black;
border-left-color : inherit;
}
.fleche_gauche {
border-left : none;
left : -7px;
border-right : 7px solid black;
border-right-color : inherit;
}
/** -------------- Fin des Fl?es -------------- **/
/** -------------- Colonnes -------------- **/
.jgroud_menu_application {
padding: 10px;
height : 100%;
width : 100%;
box-sizing: border-box;
}
.div_apres_table , .clear_both {
clear: both;
}
.colonne_2 , .colonne_3 , .colonne_4 , .colonne_5 , .colonne_6 , .colonne_7 , .colonne_8 , .colonne_9 , .colonne_10 , .colonne_11 , .colonne_12 , .colonne_13 , .colonne_14 , .colonne_15 , .colonne_taille90 , .colonne_taille80 , .colonne_taille70 , .colonne_taille60 , .colonne_taille50 , .colonne_taille40 , .colonne_taille30 , .colonne_taille20 , .colonne_taille10 , .colonne_taille5 {
float : left;
word-wrap:break-word;
}
.colonne_2_mobile , .colonne_3_mobile , .colonne_4_mobile , .colonne_5_mobile , .colonne_6_mobile , .colonne_7_mobile , .colonne_8_mobile , .colonne_9_mobile , .colonne_10_mobile , .colonne_11_mobile , .colonne_12_mobile , .colonne_13_mobile , .colonne_14_mobile , .colonne_15_mobile {
word-wrap:break-word;
width : 90%;
margin : auto;
float : none;
margin-top : 50px;
}
.colonne_2 {
width : 50%;
max-width : 50%;
}
.colonne_3 {
width : 33.333333%;
}
.colonne_4 {
width : 25%;
}
.colonne_5 {
width : 20%;
}
.colonne_6 {
width : 16.666666%;
}
.colonne_7 {
width : 14.28571428%;
}
.colonne_8 {
width : 12.5%;
}
.colonne_9 {
width : 11.1111111%;
}
.colonne_10 {
width : 10%;
}
.colonne_11 {
width : 9.0909090909%;
}
.colonne_12 {
width : 8.333333%;
}
.colonne_13 {
width : 7.6923076923%;
}
.colonne_14 {
width : 7.14285%;
}
.colonne_15 {
width : 6.666666%;
}
.colonne_taille90 {
width : 90%;
}
.colonne_taille80 {
width : 80%;
}
.colonne_taille70 {
width : 70%;
}
.colonne_taille60 {
width : 60%;
}
.colonne_taille50 {
width : 50%;
}
.colonne_taille45 {
width : 45%;
}
.colonne_taille40 {
width : 40%;
}
.colonne_taille30 {
width : 30%;
}
.colonne_taille20 {
width : 20%;
}
.colonne_taille10 {
width : 10%;
}
.colonne_taille5 {
width : 5%;
}
/** -------------- Fin des Colonnes -------------- **/
/** -------------- S?ations HR -------------- **/
.hr_petit {
height : 1px;
}
.hr {
margin : 0px;
padding : 0px;
border : none;
}
.hr_grand {
height : 4px;
}
/** -------------- Fin des S?ations HR -------------- **/
/** -------------- Bordures position -------------- **/
.bordure {
border : 1px solid rgb(180,180,180);
}
.bordure_gauche {
border-left : 1px solid rgb(180,180,180);
}
.bordure_droite {
border-right : 1px solid rgb(180,180,180);
}
.bordure_haut {
border-top : 1px solid rgb(180,180,180);
}
.bordure_bas {
border-bottom : 1px solid rgb(180,180,180);
}
/** -------------- Fin des Bordures position -------------- **/
/** -------------- Bordures taille -------------- **/
.bordure {
border-width : 1px;
}
.bordure_moyenne {
border-width : 2px;
}
.bordure_grande {
border-width : 4px;
}
/** -------------- Fin des Bordures taille -------------- **/
/** -------------- Couleurs des bordures -------------- **/
.bordure_gris {
border-color : rgb(180,180,180);
}
.bordure_gris_claire {
border-color : rgb(220,220,220);
}
.bordure_gris_fonce {
border-color : rgb(120,120,120);
}
.bordure_bleu {
border-color : rgb(67,116,224);
}
.bordure_bleu_claire {
border-color : rgb(24,167,255);
}
.bordure_bleu_fonce {
border-color : rgb(40,62,251);
}
.bordure_vert {
border-color : rgb(71,175,41);
}
.bordure_vert_claire {
border-color : rgb(20,205,34);
}
.bordure_vert_fonce {
border-color : rgb(61,122,46);
}
.bordure_rouge {
border-color : rgb(255,28,28);
}
.bordure_rouge_claire {
border-color : rgb(255,0,0);
}
.bordure_rouge_fonce {
border-color : rgb(201,5,24);
}
.bordure_noir {
border-color : rgb(0,0,0);
}
.bordure_blanc {
border-color : rgb(255,255,255);
}
.bordure_orange {
border-color : rgb(237,79,42);
}
.bordure_rose {
border-color : rgb(255,128,192);
}
.bordure_jaune {
border-color : rgb(255,255,0);
}
/** -------------- Fin des couleurs de bordures -------------- **/
/** -------------- Logos r?aux sociaux -------------- **/
.img_logo_rsociaux {
max-height : 30px;
}
.img_logo_rsociaux_moyen {
max-height : 50px;
}
.img_logo_rsociaux_grand {
max-height : 80px;
}
.div_logo_rsociaux {
height : 40px;
width : 50px;
padding-top : 10px;
border-radius : 50000px;
display : inline-block;
position : relative;
}
.div_logo_rsociaux>.img_logo_rsociaux {
position : absolute;
right : 0px;
left : 0px;
margin : auto;
}
.div_logo_rsociaux_grand {
height : 70px;
width : 90px;
padding-top : 20px;
border-radius : 50000px;
display : inline-block;
position : relative;
}
.div_logo_rsociaux_grand>.img_logo_rsociaux {
position : absolute;
right : 0px;
left : 0px;
margin : auto;
max-height : 50px;
}
.div_logo_rsociaux_petit {
height : 25px;
width : 30px;
padding-top : 6px;
border-radius : 50000px;
display : inline-block;
position : relative;
}
.div_logo_rsociaux_petit>.img_logo_rsociaux {
position : absolute;
right : 0px;
left : 0px;
margin : auto;
max-height : 18px;
}
/** -------------- Fin des Logos réseaux sociaux -------------- **/
/** -------------- Float -------------- **/
.float_left {
float : left;
}
.float_right {
float : right;
}
/** -------------- Fin des Floats-------------- **/
/** -------------- Opacity -------------- **/
.opacity1 {
opacity : 1;
}
.opacity09 {
opacity : 0.9;
}
.opacity08 {
opacity : 0.8;
}
.opacity07 {
opacity : 0.7;
}
.opacity06 {
opacity : 0.6;
}
.opacity05 {
opacity : 0.5;
}
.opacity04 {
opacity : 0.4;
}
.opacity03 {
opacity : 0.3;
}
.opacity02 {
opacity : 0.2;
}
.opacity01 {
opacity : 0.1;
}
.opacity0 {
opacity : 0;
}
/** -------------- Fin des Opacity -------------- **/
/** -------------- Balise Noscript -------------- **/
#noscript_fond {
display: block;
z-index: 800;
background: rgba(0,0,0,0.5);
position: fixed;
width: 100%;
height: 100%;
top: 0px;
left: 0px;
text-align: center;
}
#noscript {
position : fixed;
width : 60%;
height : auto;
top : 100px;
z-index : 900;
right : 0px;
left : 0px;
margin : auto;
padding : 30px;
border-radius : 10px;
color : white;
text-align : center;
}
#noscript_boutton:hover noscript{
display : none;
}
/** -------------- Fin de La Balise Noscript -------------- **/
/** -------------- Calendrier -------------- **/
.div_jgroud_calendar {
width : 98%;
background-color : white;
padding-left : 1%;
padding-right : 1%;
padding-top : 15px;
padding-bottom : 15px;
}
.div_jgroud_calendar_mini {
width : 98%;
background-color : white;
padding-left : 1%;
padding-right : 1%;
padding-bottom : 2px;
padding-top : 3px;
}
.table_jgroud_calendar , .table_jgroud_calendar_mini{
width : 100%;
border-collapse : collapse;
background-color : white;
color black;
}
.table_jgroud_calendar_mini {
margin-top : 6px;
border : 1px solid rgb(24,167,255);
}
.table_jgroud_calendar_mini>thead>tr>th {
background-color : rgb(240,240,240);
padding-bottom : 3px;
padding-top : 3px;
border-bottom : 1px solid rgb(180,180,180);
}
.table_jgroud_calendar>thead>tr>th , .table_jgroud_calendar_mini>thead>tr>th {
width : 14.28571428%;
font-weight : normal;
}
.table_jgroud_calendar>tbody>tr {
height : 72px;
}
.table_jgroud_calendar>tbody>tr>td {
vertical-align: top;
text-align : right;
height : 72px;
border : 1px solid rgb(150,150,150);
width : 14.28571428%;
position : relative;
z-index : 2;
padding : 0px;
}
.table_jgroud_calendar_mini>tbody>tr>td:hover {
background-color : rgba(24,167,255,0.2);
}
.table_menu_jgroud_calendar {
width : 100%;
border-collapse : collapse;
}
.table_menu_jgroud_calendar>tr>td {
width : 33.333333333%;
}
.jgroud_calendar_fleche {
padding-top : 0px;
padding-bottom : 1px;
padding-left : 8px;
padding-right : 8px;
background-color : white;
border-radius : 2px;
border : 1px solid #9b9b9b;
}
.jgroud_calendar_fleche:hover{
-moz-box-shadow: 0px 0px 5px 0px #9b9b9b;
-webkit-box-shadow: 0px 0px 5px 0px #9b9b9b;
-o-box-shadow: 0px 0px 5px 0px #9b9b9b;
box-shadow: 0px 0px 5px 0px #9b9b9b;
filter:progid:DXImageTransform.Microsoft.Shadow(color=#9b9b9b, Direction=NaN, Strength=5);
border : 1px solid transparent;
}
#jgroud_calendar_table_td_gauche{
text-align : left;
white-space: nowrap;
width : 33.333333333%;
}
#jgroud_calendar_table_td_centre{
text-align : center;
width : 33.333333333%;
}
#jgroud_calendar_table_td_droit{
text-align : right;
padding-right : 10px;
width : 33.333333333%;
}
#jgroud_calendar_table_td_gauche_mini{
text-align : left;
white-space: nowrap;
width : 15%;
}
#jgroud_calendar_table_td_centre_mini{
text-align : center;
width : 70%;
}
#jgroud_calendar_table_td_droit_mini{
text-align : right;
padding-right : 5px;
width : 15%;
}
.table_jgroud_calendar > tbody > tr > td.table_jgroud_calendar_jours_avant,
.table_jgroud_calendar > tbody > tr > td.table_jgroud_calendar_jours_apres,
.table_jgroud_calendar > tbody > tr > td.jgroud_calendar_day_off{
color : rgb(140,140,140);
}
.table_jgroud_calendar_jours_avant:hover , .table_jgroud_calendar_jours_apres:hover , .jgroud_calendar_day_off:hover {
cursor : default;
}
.table_jgroud_calendar_mini>tbody>tr>td {
padding : 2px;
text-align : center;
}
.jgroud_calendrier_typeAnnee td:hover{
-moz-box-shadow: 0px 0px 5px 0px #656565;
-webkit-box-shadow: 0px 0px 5px 0px #656565;
-o-box-shadow: 0px 0px 5px 0px #656565;
box-shadow: 0px 0px 5px 0px #656565;
cursor : pointer;
}
.table_jgroud_calendar_semaine .table_jgroud_calendar_semaine_heure{
text-align : center;
}
.table_jgroud_calendar_semaine > tbody > tr > td {
border-top : none;
border-bottom : none;
border-right: 1px solid rgb(150,150,150);
border-left: 1px solid rgb(150,150,150);
text-align : center;
}
.table_jgroud_calendar_semaine > tbody > tr > td:first-child{
border: 1px solid rgb(150,150,150);
}
.table_jgroud_calendar_semaine > tbody > tr {
border : none;
border-right : 1px solid rgb(150,150,150);
}
.table_jgroud_calendar_semaine > tbody > tr:first-child {
border-top: 1px solid rgb(150,150,150) !important;
}
.table_jgroud_calendar_semaine > tbody > tr:last-child {
border-bottom: 1px solid rgb(150,150,150) !important ;
}
.jgroudCalendarEvent {
position:absolute;
z-index:-1;
width:100%;
left:-1px;
text-align:center;
font-size : 14px;
line-height : 18px;
vertical-align : middle;
}
.table_jgroud_calendar > tbody > tr > td.joursActuel {
color : rgb(24,167,255);
font-weight : bold;
background-color: rgba(24,167,255,0.2);
}
.table_jgroud_calendar > tbody > tr > td.joursActuel > div.jgroudCalendarEvent {
border : 2px solid rgb(24,167,255);
}
/** -------------- Fin du Calendrier -------------- **/
/** -------------- Radius -------------- **/
.radius1 {
border-radius : 1px;
}
.radius2 {
border-radius : 2px;
}
.radius3 {
border-radius : 3px;
}
.radius4 {
border-radius : 4px;
}
.radius5 {
border-radius : 5px;
}
.radius6 {
border-radius : 6px;
}
.radius7 {
border-radius : 7px;
}
.radius8 {
border-radius : 8px;
}
.radius9 {
border-radius : 9px;
}
.radius10 {
border-radius : 10px;
}
/** -------------- Fin des Radius -------------- **/
/** -------------- Diapo -------------- **/
.diapo {
width : 100%;
height : 300px;
border : none;
overflow : hidden;
border-radius : 4px;
position : relative;
}
.diapo_image {
background: url('') no-repeat center;
width : 100%;
-moz-background-size: cover;
-webkit-background-size: cover;
-o-background-size: cover;
background-size: cover;
height : 100%;
display : none;
position : absolute;
z-index : 400;
}
.diapo_suivant {
position : absolute;
right : 0%;
width : 20%;
height : 100%;
background-color : rgba(0,0,0,0);
text-align : center;
color : white;
z-index : 401;
}
.diapo_precedent {
position : absolute;
left : 0%;
width : 20%;
height : 100%;
background-color : rgba(0,0,0,0);
text-align : center;
color : white;
z-index : 401;
}
.diapo_precedent:hover {
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,45484d+100&0.58+0,0+85 */
background: -moz-linear-gradient(left, rgba(0,0,0,0.58) 0%, rgba(59,61,65,0) 85%, rgba(69,72,77,0) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(0,0,0,0.58)), color-stop(85%,rgba(59,61,65,0)), color-stop(100%,rgba(69,72,77,0))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(left, rgba(0,0,0,0.58) 0%,rgba(59,61,65,0) 85%,rgba(69,72,77,0) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(left, rgba(0,0,0,0.58) 0%,rgba(59,61,65,0) 85%,rgba(69,72,77,0) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(left, rgba(0,0,0,0.58) 0%,rgba(59,61,65,0) 85%,rgba(69,72,77,0) 100%); /* IE10+ */
background: linear-gradient(to right, rgba(0,0,0,0.58) 0%,rgba(59,61,65,0) 85%,rgba(69,72,77,0) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#94000000', endColorstr='#0045484d',GradientType=1 ); /* IE6-9 */
}
.diapo_suivant:hover {
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#45484d+0,000000+100&0+15,0.58+100 */
background: -moz-linear-gradient(left, rgba(69,72,77,0) 0%, rgba(59,61,65,0) 15%, rgba(0,0,0,0.58) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(69,72,77,0)), color-stop(15%,rgba(59,61,65,0)), color-stop(100%,rgba(0,0,0,0.58))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(left, rgba(69,72,77,0) 0%,rgba(59,61,65,0) 15%,rgba(0,0,0,0.58) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(left, rgba(69,72,77,0) 0%,rgba(59,61,65,0) 15%,rgba(0,0,0,0.58) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(left, rgba(69,72,77,0) 0%,rgba(59,61,65,0) 15%,rgba(0,0,0,0.58) 100%); /* IE10+ */
background: linear-gradient(to right, rgba(69,72,77,0) 0%,rgba(59,61,65,0) 15%,rgba(0,0,0,0.58) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0045484d', endColorstr='#94000000',GradientType=1 ); /* IE6-9 */
}
.diapo_precedent .diapo_span_texte{
padding-right : 30%
}
.diapo_suivant .diapo_span_texte{
padding-left : 30%
}
.diapo_span_texte{
height : 20px;
vertical-align:middle;
}
.diapo_span_texte:hover{
cursor : pointer;
}
.num_diapo {
position : absolute;
left : 0px;
right : 0px;
margin : auto;
bottom : 10%;
text-align : center;
z-index : 401;
}
.num_diapo>.forme_rond_mini{
border : 1px solid white;
}
.fond_transparent {
background-color : rgba( 0,0,0,0 );
}
/** -------------- Fin des Diapo -------------- **/
/** -------------- Balises sp?ales -------------- **/
.codesource{
background-color : white;
border : 1px solid rgb(100,100,100);
border-radius : 3px;
overflow : auto;
}
/** -------------- Fin des Balises sp?ales -------------- **/
/** -------------- Sous-menus -------------- **/
.jgroud_menu {
position : relative;
}
.jgroud_sous_menu{
position : absolute;
background : inherit;
color : inherit;
font-size : inherit;
z-index : 505;
padding-left : 5px;
padding-right : 5px;
padding-top : 3px;
padding-bottom : 3px;
left : 0px;
right : 0px;
margin : auto;
opacity : 0;
visibility:hidden;
opacity:0;
}
.jgroud_menu:hover .jgroud_sous_menu{
visibility:visible;
opacity:1;
}
.jgroud_sous_menu_transition{
transition:visibility 0s linear 0.5s,opacity 0.5s linear;
}
.jgroud_menu:hover .jgroud_sous_menu_transition{
transition-delay:0s;
}
/** -------------- Fin des Sous-menus -------------- **/
/** -------------- Texte Editeur -------------- **/
.editeur {
width : 100%;
margin : auto;
left : 0px;
right : 0px;
border : 1px solid rgb(150,150,150);
background-color : #FBFBFB;
}
.editeur>.editeur_content {
width : 96%;
padding : 2%;
border-top : 1px solid rgb(150,150,150);
background-color : white;
min-height : 50px;
}
.editeur>.editeur_table{
background-color : #FBFBFB;
padding-top : 7px;
padding-bottom : 7px;
padding-left : 20px;
}
.editeur>.editeur_table tr td {
border : 1px solid rgb(150,150,150);
background-color : white;
text-align : center;
padding-right : 10px;
padding-left : 10px;
border-radius : 2px;
}
.editeur>.editeur_table tr td:hover{
background-color : #E6E6E6;
cursor : pointer;
}
/** -------------- Fin du texte editeur -------------- **/
/** -------------- Polices -------------- **/
/*.texte_police_cantarell {
font-family: "Cantarell";
}
.texte_police_oldStandard {
font-family: "OldStandard";
}
.texte_police_lato {
font-family: "Lato";
}
.texte_police_gentium {
font-family: "Gentium";
}*/
/** -------------- Fin des polices -------------- **/
/** -------------- Positionnement -------------- **/
.position_relative {
position : relative;
}
.position_absolute {
position : absolute;
}
.centrer {
left : 0px;
right : 0px;
margin : auto;
}
/** -------------- Positionnement -------------- **/
/** -------------- G?rale -------------- **/
.display_none , .hidden {
display : none;
}
.display_block {
display : block;
}
.display_inline_block {
display : inline-block;
}
.hover:hover , .objet_cliquable:hover {
cursor : pointer;
}
.hover_surligne:hover {
text-decoration : underline;
}
/** -------------- Fin des G?rale -------------- **/
#cursor_wait_full_screen {
display: block;
position: absolute;
height: 100%;
width: 100%;
background-color: red;
z-index: 1000;
cursor: wait;
opacity: 0;
}
/**
x - Faire les inputs :
x - large
x - small
x - normal
x - activ? desactiv? - input personalis?e connexion / d'erreur / de warnings etc
x - buton switch
- texte ?tors
x
- Faire les div menus ou on choisit l'onglet
x
x - Faire le header
x - gros header avec logo
x - petit header
x - header transparant
x - fixed
x - menu responsive
http://getbootstrap.com/examples/carousel/#
x
x - Faire le g?ral
x - HTML
x - header
x - body
x - id = body
x - id = header
x - id = header_menu
X - id = header_carousel
x - id = header_image
x - id = header_image_texte
x - id = content
- id = menu gauche
x - id = contenu
x - id = footer
x
- Faire les text ar?x
- Faire les icones
x
- Faire les widgets ?
x
- Faire les barres de progr?ions
x
x - Faire les tableaux
x - tr active/desactive erreur/ok/danger
x - td active/desactive erreur/ok/danger
x
X - Faire un calendrier
x
x - Faire le footer
x - footer en barre
x - footer en block
x
X - Faire les affichages d'alertes
X - Message d'erreurs
x - Popup
x - balise noscript
x
x - Tableaux
x - Tableaux responsive
x - Ent?
- Syst? de recherche en jquery
x
x - Faire le contenu
x - Faire des divs float : left qu'on peut mettre l'un ?ot?de l'autre avec 1,2,3,4,5,6,7,8,9,10,11,12,13,14,15 colonnes
x - Faire des boxes qu'on peut mettre l'un en dessous de l'autre de width 100%
- Faire des box avec une image et du texte ?cot?x
x - textes
x - mise en page des liens autos
x - Création de classe .h1 , .h2 , .h3 , .h4
x
x - Création des icones sociaux
x - Facebook
x - Twitter
x - tumblr
x - Linkedin
x - Viadéo
x - Google+
- Youtube
- Daylimotion
- Wat.tv
- Skype
- Mail
- Pinterest
x
x Rajouter des couleurs :
x - violet
x - marron
x
x fonction javascipt :
x - altert
x - confirm
x - rotate
x - scroolTo() // ou on peut choisir ) quelle distance on s'arr?
un moyen d'afficher une image en grand lorsqu'on clique dessus pour qu'elle soit en pleine ?an
Incorpor?e mini menu ?aille personalisable comme sur la page tools
**/
/*
.progress {
-webkit-border-radius: 3px;
-webkit-background-clip: padding-box;
-moz-border-radius: 3px;
-moz-background-clip: padding;
border-radius: 3px;
background-clip: padding-box;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
background: #e5e5e5;
height: 18px;
position: relative;
}
.progress:before {
display: inline-block;
content: "";
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
background-image: 8121991;
background-image: -webkit-radial-gradient(9px 9px 0, circle cover, #00ffff 0, rgba(0, 0, 255, 0) 100%, #0000ff 95%);
background-image: -moz-radial-gradient(9px 9px 0, circle cover, #00ffff 0, rgba(0, 0, 255, 0) 100%, #0000ff 95%);
background-image: -o-radial-gradient(9px 9px 0, circle cover, #00ffff 0, rgba(0, 0, 255, 0) 100%, #0000ff 95%);
background-image: radial-gradient(9px 9px 0, circle cover, #00ffff 0, rgba(0, 0, 255, 0) 100%, #0000ff 95%);
}
.progress .progress-bar {
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
line-height: 18px;
}
.progress.progress-xlg {
height: 26px;
}
.progress.progress-xlg .progress-bar {
line-height: 25px;
}
.progress.progress-lg {
height: 22px;
}
.progress.progress-lg .progress-bar {
line-height: 21px;
}
.progress.progress-sm {
height: 12px;
}
.progress.progress-sm .progress-bar {
line-height: 10px;
font-size: 11px;
}
.progress.progress-xs {
height: 9px;
}
.progress.progress-xs .progress-bar {
line-height: 8px;
font-size: 11px;
}
.progress.progress-xxs {
height: 4px;
}
.progress.progress-xxs .progress-bar {
line-height: 4px;
font-size: 0;
}
.progress.progress-right .progress-bar {
float: right;
}
.progress.progress-shadowed {
-webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
-moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
}
.progress.progress-no-radius {
-webkit-border-radius: 0 !important;
-webkit-background-clip: padding-box !important;
-moz-border-radius: 0 !important;
-moz-background-clip: padding !important;
border-radius: 0 !important;
background-clip: padding-box !important;
}
.progress.progress-vertical {
width: 25px;
height: 100%;
min-height: 150px;
margin-right: 20px;
display: inline-block;
margin-bottom: 0;
}
.progress.progress-vertical .progress-bar {
position: absolute;
width: 25px;
overflow: hidden;
line-height: 20px;
height: 0;
-webkit-transition: height 0.5s ease;
-moz-transition: height 0.5s ease;
-o-transition: height 0.5s ease;
transition: height 0.5s ease;
}
.progress.progress-vertical .progress-bar span {
width: 100%;
font-size: 12px;
text-align: center;
}
.progress.progress-vertical.progress-bottom {
position: relative;
}
.progress.progress-vertical.progress-bottom .progress-bar {
position: absolute;
bottom: 0;
}
.progress.progress-vertical.progress-bottom .progress-bar span {
position: absolute;
left: 0;
bottom: 0;
}
.progress.progress-vertical.progress-xlg {
width: 40px;
}
.progress.progress-vertical.progress-xlg .progress-bar {
width: 40px;
}
.progress.progress-vertical.progress-lg {
width: 30px;
}
.progress.progress-vertical.progress-lg .progress-bar {
width: 30px;
}
.progress.progress-vertical.progress-sm {
width: 20px;
}
.progress.progress-vertical.progress-sm .progress-bar {
width: 20px;
}
.progress.progress-vertical.progress-sm .progress-bar span {
font-size: 8px;
}
.progress.progress-vertical.progress-xs {
width: 10px;
}
.progress.progress-vertical.progress-xs .progress-bar {
width: 10px;
}
.progress.progress-vertical.progress-xs .progress-bar span {
font-size: 0;
}
.progress.progress-vertical.progress-xxs {
width: 5px;
}
.progress.progress-vertical.progress-xxs .progress-bar {
width: 5px;
}
.progress.progress-vertical.progress-xxs .progress-bar span {
font-size: 0;
}
.progress.progress-vertical.progress-bordered {
width: 31px;
}
.progress.progress-vertical.progress-bordered.progress-bottom .progress-bar {
bottom: 3px;
}
.progress.progress-vertical.progress-bordered.progress-xlg {
width: 48px;
}
.progress.progress-vertical.progress-bordered.progress-lg {
width: 38px;
}
.progress.progress-vertical.progress-bordered.progress-sm {
width: 28px;
}
.progress.progress-vertical.progress-bordered.progress-xs {
width: 18px;
}
.progress.progress-vertical.progress-bordered.progress-xxs {
width: 13px;
}
.progress.progress-bordered {
border: 1px solid rgba(0, 0, 0, 0.1);
background-color: #ffffff;
padding: 3px;
height: 24px;
}
.progress.progress-bordered.progress-xlg {
height: 32px;
}
.progress.progress-bordered.progress-lg {
height: 28px;
}
.progress.progress-bordered.progress-sm {
height: 18px;
}
.progress.progress-bordered.progress-xs {
height: 15px;
}
.progress.progress-bordered.progress-xxs {
height: 10px;
}
.progress-bar {
background-color: #2dc3e8;
}
.progress-bar-danger {
background-color: #d73d32 !important;
}
.progress-bar-success {
background-color: #53a93f !important;
}
.progress-bar-warning {
background-color: #f4b400 !important;
}
.progress-bar-silver {
background-color: #777777 !important;
}
.progress-bar-inverse {
background-color: #444444 !important;
}
.progress-bar-blue {
background-color: #5db2ff !important;
}
.progress-bar-info {
background-color: #57b5e3 !important;
}
.progress-bar-azure {
background-color: #2dc3e8 !important;
}
.progress-bar-sky {
background-color: #11a9cc !important;
}
.progress-bar-blueberry {
background-color: #6f85bf !important;
}
.progress-bar-palegreen {
background-color: #a0d468 !important;
}
.progress-bar-orange {
background-color: #fb6e52 !important;
}
.progress-bar-darkorange {
background-color: #ed4e2a !important;
}
.progress-bar-magenta {
background-color: #bc5679 !important;
}
.progress-bar-purple {
background-color: #7e3794 !important;
}
.progress-bar-maroon {
background-color: #981b48 !important;
}
.progress-striped .progress-bar {
background-image: 8121991;
background-image: -webkit-linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
background-image: -moz-linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
background-image: -o-linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
background-image: linear-gradient(135deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
}*/
/*#endregion Progress Bar*/
.bouton_choix{
opacity: 0;
position: absolute;
left: -9999px;
z-index: 12;
width: 30px;
height: 18px;
cursor: pointer;
}
.bouton_choix:checked,
.bouton_choix:focus {
outline: none;
}
.bouton_choix:checked + .text:before {
display: inline-block;
content: '\f00c';
background-color: #f5f8fc;
-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0 -15px 10px -12px rgba(0, 0, 0, 0.05), inset 15px 10px -12px rgba(255, 255, 255, 0.1);
-moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0 -15px 10px -12px rgba(0, 0, 0, 0.05), inset 15px 10px -12px rgba(255, 255, 255, 0.1);
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0 -15px 10px -12px rgba(0, 0, 0, 0.05), inset 15px 10px -12px rgba(255, 255, 255, 0.1);
border-color: #333333;
}
.bouton_choix:active + .text :before{
-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0 1px 3px rgba(0, 0, 0, 0.1);
-moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0 1px 3px rgba(0, 0, 0, 0.1);
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0 1px 3px rgba(0, 0, 0, 0.1);
}
.bouton_choix + .text{
position: relative;
z-index: 11;
display: inline-block;
margin: 0;
line-height: 20px;
min-height: 18px;
min-width: 30px;
font-weight: normal;
}
.bouton_choix + .text:before {
font-family: fontAwesome;
font-weight: bold;
font-size: 13px;
color: #333333;
content: "\a0";
background-color: #fafafa;
border: 1px solid #c8c8c8;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
border-radius: 0;
display: inline-block;
text-align: right;
vertical-align: middle;
height: 18px;
line-height: 16px;
min-width: 30px;
margin-right: 0px;
margin-bottom: 2px;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.bouton_choix.bouton_choix + .text {
margin: 0 4px;
min-height: 24px;
}
/* G?r le texte */
.bouton_choix.bouton_choix + .text:before {
font-family: 'Open Sans', 'Segoe UI' /*rtl:prepend:"Droid Arabic Kufi", "WYekan"*/;
content: "ON\a0\a0\a0\a0\a0\a0 OFF";
background-color: white;
color: rgb(140,140,140);
font-weight: 300;
font-size: 10px;
line-height: 18px;
height: 20px;
overflow: hidden;
border-radius: 50rem;
border: 1px solid #cccccc;
text-align: center;
float: left;
padding: 0;
width: 45px;
text-indent: -15px;
padding-right: 5px;
padding-left : 5px;
-webkit-transition: all 0.3s ease 0s;
-moz-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
/*G?r le bouton qui se d?le */
.bouton_choix.bouton_choix + .text:after {
font-family: 'Open Sans', 'Segoe UI' /*rtl:prepend:"Droid Arabic Kufi", "WYekan"*/;
content: '';
background-color: white;
border: 5px solid #444444;
border-radius: 100%;
width: 18px;
height: 18px;
position: absolute;
top: -2px;
left: -2px;
-webkit-box-shadow: 0 1px 1px 1px rgba(0, 0, 0, 0.3);
-moz-box-shadow: 0 1px 1px 1px rgba(0, 0, 0, 0.3);
box-shadow: 0 1px 1px 1px rgba(0, 0, 0, 0.3);
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.bouton_choix.bouton_choix_content_hf + .text:before {
content: "H\a0\a0\a0\a0 F";
width: 40px;
padding-right: 8px;
padding-left: 8px;
font-size : 14px;
}
.bouton_choix.bouton_choix_content_fh + .text:before {
content: "F\a0\a0\a0\a0\a0\a0 H";
width: 40px;
padding-right: 8px;
padding-left: 8px;
font-size : 14px;
}
.bouton_choix.bouton_choix_content_ouinon + .text:before {
content: "Oui\a0\a0\a0\a0\a0\a0 Non";
width: 48px;
padding-right: 5px;
font-size : 12px;
}
.bouton_choix.bouton_choix_content_nonoui + .text:before {
content: "Non\a0\a0\a0\a0\a0\a0 Oui";
width: 48px;
padding-right: 5px;
font-size : 12px;
}
.bouton_choix.bouton_choix_content_facedos + .text:before {
content: "Face\a0\a0\a0\a0\a0\a0 Dos";
width: 55px;
padding-right: 5px;
font-size : 12px;
}
.bouton_choix.bouton_choix.bouton_choix_content_facedos + .text:after {
width: 20px;
height: 20px;
position: absolute;
top: -5px;
left: 0px;
}
.bouton_choix.bouton_choix.bouton_choix_content_facedos:checked + .text:after{
margin-left : 5px;
}
.bouton_choix.bouton_choix_content_dosface + .text:before {
content: "Dos\a0\a0\a0\a0\a0\a0 Face";
width: 55px;
padding-right: 5px;
font-size : 12px;
}
.bouton_choix.bouton_choix.bouton_choix_content_dosface + .text:after {
width: 20px;
height: 20px;
position: absolute;
top: -5px;
left: 0px;
}
.bouton_choix.bouton_choix.bouton_choix_content_dosface:checked + .text:after{
margin-left : 5px;
}
.bouton_choix.bouton_choix_content_hommefemme + .text:before {
content: "Homme\a0\a0\a0 Femme";
width: 90px;
padding-right: -3px;
padding-left: 3px;
font-size : 12px;
}
.bouton_choix.bouton_choix.bouton_choix_content_hommefemme + .text:after {
width: 31px;
height: 31px;
position: absolute;
top: -9px;
left: 0px;
}
.bouton_choix.bouton_choix.bouton_choix_content_hommefemme:checked + .text:after{
margin-left : 25px;
}
.bouton_choix.bouton_choix_content_femmehomme + .text:before {
content: "Femme\a0\a0\a0 Homme";
width: 86px;
padding-right: -3px;
padding-left: 3px;
font-size : 12px;
}
.bouton_choix.bouton_choix.bouton_choix_content_femmehomme + .text:after {
width: 31px;
height: 31px;
position: absolute;
top: -9px;
left: -5px;
}
.bouton_choix.bouton_choix.bouton_choix_content_femmehomme:checked + .text:after{
margin-left : 22px;
}
.bouton_choix.bouton_choix_content_activedesactive + .text:before {
content: "\a0\a0\a0 Activé\a0\a0\a0\a0 Désactivé";
width: 90px;
padding-right: -3px;
padding-left: 3px;
font-size : 12px;
}
.bouton_choix.bouton_choix.bouton_choix_content_activedesactive + .text:after {
width: 31px;
height: 31px;
position: absolute;
top: -9px;
left: 0px;
}
.bouton_choix.bouton_choix.bouton_choix_content_activedesactive:checked + .text:after {
margin-left : 25px;
}
.bouton_choix.bouton_choix_content_ouvertfermer + .text:before {
content: "Ouvert\a0\a0\a0\a0\a0\a0 Fermé";
width: 85px;
padding-right: -3px;
padding-left: 3px;
font-size : 12px;
}
.bouton_choix.bouton_choix.bouton_choix_content_ouvertfermer + .text:after {
width: 31px;
height: 31px;
position: absolute;
top: -9px;
left: 0px;
}
.bouton_choix.bouton_choix.bouton_choix_content_ouvertfermer:checked + .text:after{
margin-left : 20px;
}
.bouton_choix.bouton_choix_content_allumereteint + .text:before {
content: "Allumé\a0\a0\a0\a0\a0\a0 Eteint";
width: 85px;
padding-right: -3px;
padding-left: 3px;
font-size : 12px;
}
.bouton_choix.bouton_choix.bouton_choix_content_allumereteint + .text:after {
width: 31px;
height: 31px;
position: absolute;
top: -9px;
left: 0px;
}
.bouton_choix.bouton_choix.bouton_choix_content_allumereteint:checked + .text:after{
margin-left : 20px;
}
.bouton_choix.bouton_choix:checked + .text:before {
text-indent: 5px;
background-color: #444444;
border-color: #444444;
color: white;
}
.bouton_choix.bouton_choix:checked + .text:after {
left: 34px;
background-color: #444444;
border: 5px solid white;
}
/* Les couleurs */
.bouton_choix.bouton_choix.bouton_choix_gris + .text:after {
border-color : rgb(180,180,180);
}
.bouton_choix.bouton_choix.bouton_choix_gris:checked + .text:before {
background-color : rgb(180,180,180);
border-color : rgb(180,180,180);
}
.bouton_choix.bouton_choix.bouton_choix_gris:checked + .text:after {
background-color : rgb(180,180,180);
border-color: white;
}
.bouton_choix.bouton_choix.bouton_choix_gris_claire + .text:after {
border-color : rgb(220,220,220);
}
.bouton_choix.bouton_choix.bouton_choix_gris_claire:checked + .text:before {
background-color : rgb(220,220,220);
border-color : rgb(180,180,180);
}
.bouton_choix.bouton_choix.bouton_choix_gris_claire:checked + .text:after {
background-color : rgb(220,220,220);
border-color: white;
}
.bouton_choix.bouton_choix.bouton_choix_gris_fonce + .text:after {
border-color : rgb(120,120,120);
}
.bouton_choix.bouton_choix.bouton_choix_gris_fonce:checked + .text:before {
background-color : rgb(120,120,120);
border-color : rgb(180,180,180);
}
.bouton_choix.bouton_choix.bouton_choix_gris_fonce:checked + .text:after {
background-color : rgb(120,120,120);
border-color: white;
}
.bouton_choix.bouton_choix.bouton_choix_bleu + .text:after {
border-color : rgb(67,116,224);
}
.bouton_choix.bouton_choix.bouton_choix_bleu:checked + .text:before {
background-color : rgb(67,116,224);
border-color : rgb(180,180,180);
}
.bouton_choix.bouton_choix.bouton_choix_bleu:checked + .text:after {
background-color : rgb(67,116,224);
border-color: white;
}
.bouton_choix.bouton_choix.bouton_choix_bleu_claire + .text:after {
border-color : rgb(24,167,255);
}
.bouton_choix.bouton_choix.bouton_choix_bleu_claire:checked + .text:before {
background-color : rgb(24,167,255);
border-color : rgb(180,180,180);
}
.bouton_choix.bouton_choix.bouton_choix_bleu_claire:checked + .text:after {
background-color : rgb(24,167,255);
border-color: white;
}
.bouton_choix.bouton_choix.bouton_choix_bleu_fonce + .text:after {
border-color : rgb(40,62,251);
}
.bouton_choix.bouton_choix.bouton_choix_bleu_fonce:checked + .text:before {
background-color : rgb(40,62,251);
border-color : rgb(180,180,180);
}
.bouton_choix.bouton_choix.bouton_choix_bleu_fonce:checked + .text:after {
background-color : rgb(40,62,251);
border-color: white;
}
.bouton_choix.bouton_choix.bouton_choix_vert + .text:after {
border-color : rgb(71,175,41);
}
.bouton_choix.bouton_choix.bouton_choix_vert:checked + .text:before {
background-color : rgb(71,175,41);
border-color : rgb(180,180,180);
}
.bouton_choix.bouton_choix.bouton_choix_vert:checked + .text:after {
background-color : rgb(71,175,41);
border-color: white;
}
.bouton_choix.bouton_choix.bouton_choix_vert_claire + .text:after {
border-color: rgb(20,205,34);
}
.bouton_choix.bouton_choix.bouton_choix_vert_claire:checked + .text:before {
background-color : rgb(20,205,34);
border-color : rgb(180,180,180);
}
.bouton_choix.bouton_choix.bouton_choix_vert_claire:checked + .text:after {
background-color : rgb(20,205,34);
border-color: white;
}
.bouton_choix.bouton_choix.bouton_choix_vert_fonce + .text:after {
border-color : rgb(61,122,46);
}
.bouton_choix.bouton_choix.bouton_choix_vert_fonce:checked + .text:before {
background-color : rgb(61,122,46);
border-color : rgb(180,180,180);
}
.bouton_choix.bouton_choix.bouton_choix_vert_fonce:checked + .text:after {
background-color : rgb(61,122,46);
border-color: white;
}
.bouton_choix.bouton_choix.bouton_choix_rouge + .text:after {
border-color : rgb(255,28,28);
}
.bouton_choix.bouton_choix.bouton_choix_rouge:checked + .text:before {
background-color : rgb(255,28,28);
border-color : rgb(180,180,180);
}
.bouton_choix.bouton_choix.bouton_choix_rouge:checked + .text:after {
background-color : rgb(255,28,28);
border-color: white;
}
.bouton_choix.bouton_choix.bouton_choix_rouge_claire + .text:after {
border-color: rgb(255,0,0);
}
.bouton_choix.bouton_choix.bouton_choix_rouge_claire:checked + .text:before {
background-color : rgb(255,0,0);
border-color : rgb(180,180,180);
}
.bouton_choix.bouton_choix.bouton_choix_rouge_claire:checked + .text:after {
background-color : rgb(255,0,0);
border-color: white;
}
.bouton_choix.bouton_choix.bouton_choix_rouge_fonce + .text:after {
border-color : rgb(201,5,24);
}
.bouton_choix.bouton_choix.bouton_choix_rouge_fonce:checked + .text:before {
background-color : rgb(201,5,24);
border-color : rgb(180,180,180);
}
.bouton_choix.bouton_choix.bouton_choix_rouge_fonce:checked + .text:after {
background-color : rgb(201,5,24);
border-color: white;
}
.bouton_choix.bouton_choix.bouton_choix_noir + .text:after {
border-color : rgb(0,0,0);
}
.bouton_choix.bouton_choix.bouton_choix_noir:checked + .text:before {
background-color : rgb(0,0,0);
border-color : rgb(180,180,180);
}
.bouton_choix.bouton_choix.bouton_choix_noir:checked + .text:after {
background-color : rgb(0,0,0);
border-color: white;
}
.bouton_choix.bouton_choix.bouton_choix_blanc + .text:after {
border-color : rgb(255,255,255);
}
.bouton_choix.bouton_choix.bouton_choix_blanc:checked + .text:before {
background-color : rgb(255,255,255);
border-color : rgb(180,180,180);
}
.bouton_choix.bouton_choix.bouton_choix_blanc:checked + .text:after {
background-color : rgb(255,255,255);
border-color: white;
}
.bouton_choix.bouton_choix.bouton_choix_orange + .text:after {
border-color : rgb(237,79,42);
}
.bouton_choix.bouton_choix.bouton_choix_orange:checked + .text:before {
background-color : rgb(237,79,42);
border-color : rgb(180,180,180);
}
.bouton_choix.bouton_choix.bouton_choix_orange:checked + .text:after {
background-color : rgb(237,79,42);
border-color: white;
}
.bouton_choix.bouton_choix.bouton_choix_rose + .text:after {
border-color : rgb(255,128,192);
}
.bouton_choix.bouton_choix.bouton_choix_rose:checked + .text:before {
background-color : rgb(255,128,192);
border-color : rgb(180,180,180);
}
.bouton_choix.bouton_choix.bouton_choix_rose:checked + .text:after {
background-color : rgb(255,128,192);
border-color: white;
}
.bouton_choix.bouton_choix.bouton_choix_jaune + .text:after {
border-color : rgb(255,255,0);
}
.bouton_choix.bouton_choix.bouton_choix_jaune:checked + .text:before {
background-color : rgb(255,255,0);
border-color : rgb(180,180,180);
}
.bouton_choix.bouton_choix.bouton_choix_jaune:checked + .text:after {
background-color : rgb(255,255,0);
border-color: white;
}