@charset "utf-8";

/* @import url(https://weloveiconfonts.com/api/?family=fontawesome); */

/* @import url(https://meyerweb.com/eric/tools/css/reset/reset.css); */

@import url(https://fonts.googleapis.com/css?family=Economica);
@import url(http://fonts.googleapis.com/css?family=Economica);


/* ---------- GENERAL ---------- */
body {
	background-color: #f7f7f7;
	color: #333;
	font-family: sans-serif;
	line-height: 1.5em;
	margin: 0px;
}

header {
	width: 100%;
	font-size: 18px;
	font-weight: bold;
	line-height: 25px;
	z-index: 9999;
	margin: auto;
}

header .logo{
	margin-left: 2px;
	margin-right: 15px;
	margin-top: 2px;
}

/*user menu*/
header .userMenu{
	color: white;
	line-height: 53px;
	min-height: 53px;
	float: right;
	padding-right: 20px;
	padding-left: 5px;
	cursor: pointer;
	text-decoration: none;
}

header *::-moz-selection {
  background: transparent;
}

header *::selection {
  background: transparent;
}


header .userImg{
	margin-top: 12px; 
	margin-left: 10px;
	height: 25px;
}

header .userMenu:HOVER{
	color: rgba(255,255,255,.7);
/* 	background-color: rgba(0,0,0,.3); */
}


.navigation_user_check {
  display: none;
}


.navigation_user {
	overflow: hidden;
	max-height: 0;
	color: #444;
	-webkit-transition: max-height 0.5s ease-in-out;
	transition: max-height 0.5s ease-in-out;
	background-color: rgba(255,255,255,.9);
	-webkit-box-shadow: 0 2px 2px 0 #7D7D7D;
	box-shadow: 0 2px 2px 0 #7D7D7D;
	width: auto;
	display: inline-block;
	padding: 0 6px;
	position: absolute;
	right: 5px;
}


.navigation_user_check:checked ~ .navigation_user {
	max-height: 500px;
	-webkit-transition: max-height 0.5s ease-in-out;
	transition: max-height 0.5s ease-in-out;
}

ul {
	margin: 0;
	padding: 0;
}

.navigation_user li {
	list-style: none;
	font-size: 14px;
	padding: 5px 15px;
	border-bottom: 1px solid #ccc;
	cursor: pointer;
}

.navigation_user li:hover{
	text-decoration: underline;
	color: #222;
}

.navigation_user li a {
	text-decoration: none;
	color: #444;
	cursor: pointer;
}
.navigation_user li a:hover {
	text-decoration: underline;
	color: #222;
}
/*fin user menu*/


header img{
	float: left;
}

header *{
	display: inline-flex;
}


.horisontal_main_menu{
    list-style-type: none;
	margin: 0;
    padding: 0;
    line-height: 53px;
	min-height: 53px;
    margin: 0 auto;
    padding: 0;
/*     top: 0px; */
/*     margin-top: -50px; */
    
/*     display: table-cell; */
}

.horisontal_main_menu a{
	color: white;
	text-decoration: none;
}

.horisontal_main_menu li{
	display: inline;	
    padding: 0px 10px;
    color: #F2F1EF;
    border-left: 1px solid rgba(0,0,0,.2);
    border-right: 1px solid rgba(255,255,255,.3);
}
.horisontal_main_menu li:hover{
    cursor: pointer;
    background-color: rgba(255,255,255,.3);
}

.horisontal_main_menu li ul{
    display: none;
    position: absolute;
    top: 46px;
    margin-left: -18px;
    margin-right: -18px;
    padding: 0;
    width: 100%;
}
.horisontal_main_menu ul:hover .horisontal_main_menu ul li ul{
    display: block;
}
.horisontal_main_menu ul li a{
    background-color:#444;
    width: 150px;
    position: relative;
}
.sub-dropdown ul.sub-dropdown-list{
    display: none;
    position: absolute;
    top: 0;
    left: 204px;
    width: 100%;
}

.sub-dropdown:hover ul{
    display: block;
}
.sub-dropdown-list li{
    background-color: #eee;;
}



footer{
	position: fixed;
	bottom: 0px;
	width: 100%;
	text-align: center;
	font-style: italic;
	margin: auto;
}

.error{
    color: red;
    text-align: center;
    margin-top: 0px;
    padding-top: 0px;
}

.succes{
	color: green;
    text-align: center;
    margin-top: 0px;
    padding-top: 0px;
}

/**containers**/
.body_container{
    margin: auto !important;	
}

.content{
    margin: 5px;
    padding: 5px;
    background: #fefefe;
    vertical-align: top;
    display: inline-table;
}

.content2{
    margin: 10px auto;
    padding: 8px;
    background: #fefefe;
    border-radius: 5px;
    display: inline-table;
}

.content3{
	display: inline-table;
	vertical-align: top;
	margin: 0;
	margin-bottom: 2px;
}

.content_transparent{
    margin: 2px;
    margin: 10px auto;
    padding: 8px;
    border-radius: 5px;
    /*display: inline-table;*/
}

.padding0{padding: 0;}
.margin0{margin: 0;}
.pointer{cursor:pointer;}

/* ---------- WIDTH ---------- */
.width_fit_content{width:fit-content !important;}
.width100{width:100%;}
.width90{width:90%; min-width:90%;}
.width80{width:80%; min-width:80%;}
.width70{width:70%; min-width:70%;}
.width60{width:60%; min-width:60%;}
.width50{width:50%; min-width:50%;}
.width40{width:40%; min-width:40%;}
.width30{width:30%; min-width:30%;}
.width20{width:20%; min-width:20%;}
.width10{width:10%; min-width:10%;}
.width1_1{width:calc(100% - 24px); width: -moz-calc(100% - 24px); width:-webkit-calc(100% - 24px);}
.width2_1{width:calc(50% - 24px);}
.width3_1{width:calc((100%/3) - 24px);}
.width3_2{width:calc((100%/3)*2 - 24px);}
.width4_1{width:calc(25% - 24px); width: -moz-calc(25% - 24px); width:-webkit-calc(25% - 24px);}
.width4_3{width:calc(75% - 24px); width: -moz-calc(75% - 24px); width:-webkit-calc(75% - 24px);}
.width5_1{width:calc(20% - 24px); width: -moz-calc(20% - 24px); width:-webkit-calc(20% - 24px);}
.width5_3{width:calc(60% - 24px); width: -moz-calc(60% - 24px); width:-webkit-calc(60% - 24px);}
.width5_4{width:calc(80% - 24px); width: -moz-calc(80% - 24px); width:-webkit-calc(80% - 24px);}

/* ---------- TITRES ---------- */
h1{font-size:35px; line-height: 35px; margin: 23px auto; width: fit-content; width: -moz-fit-content; font-weight: bold;}
h2{font-size:30px; line-height: 30px; margin: 20px auto; width: fit-content; width: -moz-fit-content; font-weight: bold;}
h3{font-size:25px; line-height: 25px; margin: 18px auto; width: fit-content; width: -moz-fit-content; font-weight: bold;}
h4{font-size:20px; line-height: 20px; margin: 12px auto; width: fit-content; width: -moz-fit-content; font-weight: bold;}
h5{font-size:20px; line-height: 20px; margin: 8px auto; width: fit-content; width: -moz-fit-content;}


.rtl{
	direction: rtl;
}


/* ---------- EFFECTS ---------- */
.box_shadow{
  -webkit-box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.25);
  box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.25);
}

.text_shadow{}

.text_border{
	text-shadow: 1px 0 0 #444, -1px 0 0 #444, 0 1px 0 #444, 0 -1px 0 #444, 1px 1px #444, -1px -1px 0 #444, 1px -1px 0 #444, -1px 1px 0 #444;
}
.bold_text{font-weight: bold;}

.no_border{border:0;}
.border1{border:1px solid;}
.border2{border:2px solid;}
.border3{border:3px solid;}
.border4{border:4px solid;}
.border7{border:7px solid;}
.border20{border:20px solid;}
.dashed_border{border:2px dashed;}
.border_top{border-bottom:0; border-left:0; border-right:0;}
.border_bottom{border-top:0; border-left:0; border-right:0;}
.border_left{border-top:0; border-bottom:0; border-right:0;}
.border_right{border-top:0; border-left:0; border-bottom:0;}

.text_left{text-align: left !important;}
.text_right{text-align: right !important;}
.text_center{text-align: center !important;}

.center{margin: auto;display: table;}

/* ---------- COLORS ---------- */
.noselect {
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Chrome/Safari/Opera */
     -khtml-user-select: none; /* Konqueror */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  not supported by any browser */
}
.red{background-color: #da181f !important;}
.red_border{border-color: #da181f !important;}
.red_text{color: #da181f !important;}

.blue{background-color: #2196F3 !important;}
.blue_border{border-color: #2196F3 !important;}
.blue_text{color: #2196F3 !important;}

.darkBlue{background-color: #16137b !important;}
.darkBlue_border{border-color: #16137b !important;}
.darkBlue_text{color: #16137b !important;}

.ciel{background-color: #34aed7 !important;}
.ciel_border{border-color: #34aed7 !important;}
.ciel_text{color: #34aed7 !important;}

.ciel2{background-color: #79d1fa !important;}
.ciel2_border{border-color: #79d1fa !important;}
.ciel2_text{color: #79d1fa !important;}

.orange{background-color: #efa100 !important;}
.orange_border{border-color: #efa100 !important;}
.orange_text{color: #efa100 !important;}

.orange2{background-color: #fcce6d !important;}
.orange2_border{border-color: #fcce6d !important;}
.orange2_text{color: #fcce6d !important;}

.black{background-color: #111 !important;}
.black_border{border-color: #111 !important;}
.black_text{color: #111 !important;}

.dark{background-color: #444 !important;}
.dark_border{border-color: #333 !important;}
.dark_text{color: #333 !important;}

.grey{background-color: #eee !important;}
.grey_border{border-color: #eee !important;}
.grey_text{color: #eee !important;}

.grey2{background-color: #ccc !important;}
.grey2_border{border-color: #ccc !important;}
.grey2_text{color: #ccc !important;}

.white{background-color: #fff !important;}
.white_border{border-color: #fff !important;}
.white_text{color: #fff !important;}

.gold{background-color: #e3b756 !important; color: white;}
.golden_border{border-color: #e3b756 !important;}
.golden_text{color: #e3b756 !important;}

.CRE{background-color: #116d6e !important; color: white;}
.CRE_border{border-color: #116d6e !important;}
.CRE_text{color: #116d6e !important;}

.white_transparent{background-color: rgba(255,255,255,.8) !important;}
.black_transparent{background-color: rgba(0,0,0,.5) !important; -webkit-box-shadow:inset 0 0 8px 0 #0D0D0D; box-shadow:inset 0 0 8px 0 #0D0D0D !important;}

.transparent{background-color: transparent !important;}
.transparent_border{background-color: transparent !important;}


/*---------TABLEAUX---------*/
.tab_container{max-height: 400px; min-height: 400px; padding-top:-20px; overflow-x: auto; overflow-y: auto;}
.tab_liste{margin: 20px auto; border-spacing: 0; border-collapse: collapse; border: 1px solid #ccc; font-size: 14px;}
.tab_liste input{height: 30px;}
.tab_liste td{text-align: center; border-bottom: 1px solid #ccc; color: #444; padding: 7px 1px;}
.tab_liste th{background-color: #3b9fd3; color: white; text-align: center; padding: 4px 1px;}
.tab_liste row_donnee{border-top: 1px solid #aaa;}
.tab_liste tr:nth-child(odd){background-color: #fefefe;} /*Toutes les lignes impaires */
.tab_liste tr:nth-child(even){background-color: #eee;} /*Toutes les lignes paires */
.tab_liste td img{cursor: pointer; margin-top: 3px; margin-bottom: -3px;}
.tab_liste tr:HOVER{background-color: #cbcbcb}

.tab_pages{list-style: none; display: inline-block; padding: 0; margin-top: -10px;}
.tab_pages li{cursor: pointer; display: inline; text-align: center;}
.tab_pages a{float: left; display: block; font-size: 14px; text-decoration: none; margin-left: 3px; width: 30px;
    height: 30px; line-height: 30px; -moz-border-radius: 100%; -webkit-border-radius: 100%; border-radius: 100%; cursor: pointer;}
.tab_pages .active a{cursor: default;}
.tab_pages a:active{outline: none;}
.tab_pages .active, .tab_pages .active:hover{background-color: rgba(0, 0, 0, .4); color: #eee; cursor: default;}
.tab_pages a:hover{background-color: rgba(255, 255, 255, .2); color: #eee; text-decoration: none;}


/********* Pictos ***********/
.btn_go{
	padding-right: 32px !important;
    padding-left: 7px;
	background-image: url('jz_pictos/buttons/go.png');
    background-repeat: no-repeat;
    background-position: right 2px;
}

.btn_like{
	padding-right: 29px !important;
    padding-left: 7px;
	background-image: url('jz_pictos/buttons/like.png');
    background-repeat: no-repeat;
    background-position: right 2px;
}

.btn_cancel{
	padding-right: 28px !important;
    padding-left: 7px;
	background-image: url('jz_pictos/buttons/cancel.png');
    background-repeat: no-repeat;
    background-position: right 2px;
}


/*--------MENU MOBILE --------*/
.menu_mobile_button {
    margin-right: 5px;
    margin-top: 4px;
    color: white;
    float: right;
    text-align: center;
    cursor:pointer;
    font-family: 'entypo', sans-serif;
    padding: 0 5px;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
}
.menu_mobile_button:before{
    content: "\2630";
    font-size:30px;
    vertical-align:middle;
}

/* .visible_desktop{display: none;} */
.visible_tablet, #visible_tablet{display: none;}
.visible_mobile, #visible_mobile{display: none;}

    
/*---------SMALL SCREEN---------*/
@media screen and (max-width:1200px)
{
    .body_container{
        width:calc(100% - 24px); width: -moz-calc(100% - 24px); width:-webkit-calc(100% - 24px);
    }
    
}

/* ---------- TABLET ---------- */
@media screen and (max-width:900px)
{
    .visible_tablet, #visible_tablet{display: initial}
    .visible_desktop, #visible_desktop{display: none;}
    .invisible_tablet, #invisible_tablet{display: none !important;}
    
    .width90{width:calc(100% - 24px); width: -moz-calc(100% - 24px); width:-webkit-calc(100% - 24px);}
    .width80{width:calc(100% - 24px); width: -moz-calc(100% - 24px); width:-webkit-calc(100% - 24px);}
    .width60{width:calc(100% - 24px); width: -moz-calc(100% - 24px); width:-webkit-calc(100% - 24px);}
    .width50{width:calc(100% - 24px); width: -moz-calc(100% - 24px); width:-webkit-calc(100% - 24px);}
    .width40{width:calc(100% - 24px); width: -moz-calc(100% - 24px); width:-webkit-calc(100% - 24px);}
    .width20{width:calc(100% - 24px); width: -moz-calc(100% - 24px); width:-webkit-calc(100% - 24px);}
    .width10{width:calc(100% - 24px); width: -moz-calc(100% - 24px); width:-webkit-calc(100% - 24px);}
    .width1_1{width:calc(100% - 24px); width: -moz-calc(100% - 24px); width:-webkit-calc(100% - 24px);}
    .width2_1{width:calc(100% - 24px); width: -moz-calc(100% - 24px); width:-webkit-calc(100% - 24px);}
    .width3_1{width:calc(100% - 24px); width: -moz-calc(100% - 24px); width:-webkit-calc(100% - 24px);}
    .width3_2{width:calc(100% - 24px); width: -moz-calc(100% - 24px); width:-webkit-calc(100% - 24px);}
    .width4_1{width:calc(100% - 24px); width: -moz-calc(100% - 24px); width:-webkit-calc(100% - 24px);}
    .width4_3{width:calc(100% - 24px); width: -moz-calc(100% - 24px); width:-webkit-calc(100% - 24px);}
    .width5_1{width:calc(100% - 24px); width: -moz-calc(100% - 24px); width:-webkit-calc(100% - 24px);}
    .width5_3{width:calc(100% - 24px); width: -moz-calc(100% - 24px); width:-webkit-calc(100% - 24px);}
    .width5_4{width:calc(100% - 24px); width: -moz-calc(100% - 24px); width:-webkit-calc(100% - 24px);}
	
}

/* ---------- MOBILE ---------- */
@media screen and (max-width:600px)
{
	.visible_mobile,#visible_mobile{display: initial;}
	.invisible_mobile, #invisible_mobile{display: none !important;}
	
    .body_container{
        width:calc(100% - 24px); width: -moz-calc(100% - 24px); width:-webkit-calc(100% - 24px);
    }
    
    h1{font-size:25px; line-height: 27px;}
    h2{font-size:20px; line-height: 22px;}
    h3{font-size:16px; line-height: 20px;}
    h4{font-size:14px; line-height: 18px;}
    h5{font-size:13px; line-height: 16px;}
}