body, header, section, div, span, ul, ol, li, form, fieldset, label, input, select {margin: 0; padding: 0;}
a {color: #03DAC5; background: none; text-decoration: none; padding: 1px;}
body {background: #333333; color: white; font-family: "Abel", sans-serif; font-size: 1em; line-height: 1em;}
img {vertical-align: middle; margin: 2px;}
ul, ol {list-style: none;}
ol {counter-reset: li;}
h1, h2 {font-family: Tahoma, sans-serif; padding: 6px;}
h1 {background: #33414e; color: white; border-left: 6px solid #006e82; line-height: 28px; text-align: left; font-size: 1.2em; border-radius: 0.15em;}
h2 {font-size: 1.1em;}
table {border: none; border-spacing: 0; width: 100%;}
table td {padding: 2px;}
input, textarea, select {background: #33414e; color: white; margin: 5px 0; padding: 2px 4px; border: 1px solid #3d4e5d; border-radius: 0.4em;}
input, textarea {width: 180px;}

input:focus, select:focus, textarea:focus {outline: none; border: 1px solid #006e82;}
textarea {height: 100px; resize: none;}
label {display: block; height: 25px; float: left; margin: 8px 2px; line-height: 26px; font-size: 0.8em;}
input {height: 25px;}
select, button {height: 34px;}
button {min-width: 30px; background: #33414e; color: white; margin: 4px; padding: 4px; border: 1px solid #3d4e5d; border-radius: 0.4em;}
button:hover, button:active {border: 1px solid #006e82; text-shadow: 2px 1px 0 black;}
fieldset {padding: 8px 4px 16px; border: none; border-top: 1px solid #515151; border-bottom: 1px solid black;}

#logo {width: 100%; height: 40px; background: #006e82;}
#logo > div {width: 320px; height: 40px; margin-left: auto; margin-right: auto; background: #333333;}
#logo > div > a {display: block; color: white; padding: 0;}
#logo_left {width: 168px; height: 40px; float: left; background: #006e82; line-height: 38px; text-align: right;}
#logo_left_arr {width: 0; height: 0; float: left; border-top: 20px solid transparent; border-bottom: 20px solid transparent; border-left: 10px solid #006e82;}
#logo_left > span {padding: 4px; font-family: 'Tomorrow', sans-serif; font-size: 2em; font-weight: bold;}
#logo_img {width: 12px; height: 40px; float: left; background: #333333 url("/img/sablier.png") no-repeat center;}
#logo_right {width: 120px; height: 40px; float: left; background: #006e82; line-height: 38px; text-align: left;}
#logo_right_arr {width: 0; height: 0; float: left; border-top: 20px solid transparent; border-bottom: 20px solid transparent; border-right: 10px solid #006e82;}
#logo_right > span {padding: 4px; font-family: 'Tomorrow', sans-serif; font-size: 2em; font-weight: bold;}
#ch_sl {width: 320px; margin-left: auto; margin-right: auto;}
#ch_sl > div {padding: 6px 30px 2px; line-height: 22px; font-size: 1.2em; text-shadow: 1px -2px black;}
#nav_bar {width: 100%; height: 50px; margin: 20px 0 40px;}
#nav_bar_c {width: 100%; margin-left: auto; margin-right: auto; border-top: 1px solid #515151; border-bottom: 1px solid black; text-align: center;}
#nav_bar_c > div {width: 100px; display: inline-block; color: grey; line-height: 47px; padding: 2px; text-align: center; font-size: 0.9em; font-weight: bold;}
#nav_bar_c > div > a {display: block; color: white;}
#nav_bar_c > div:hover, #nav_bar_c > div:active {margin-top: -1px; border-top: 1px solid #006e82; border-bottom: 1px solid #006e82; box-shadow: 0 0 3px #006e82;}
#corps {width: 304px; margin-left: auto; margin-right: auto; margin-top: 24px; margin-bottom: 24px; padding: 8px;}
#cnx_bar {height: 32px; clear: left; float: right; background: url("/img/ico_mb24b.png") no-repeat center left+2px; line-height: 41px;}
#cnx_bar > a, #cnx_bar > span {display: block; padding: 0 2px 2px 26px; text-align: center; vertical-align: bottom; color: white; font-family: 'Tomorrow', sans-serif;}
#cnx_bar > a {font-size: 1.15em;}
#cnx_bar > span {font-size: 0.9em;}
#cnx_bar:hover, #cnx_bar:active {border-bottom: 4px solid #006e82;}
#mb_create, #mb_connect {margin-bottom: 100px;}
#fs_mb > div, #fs_mb2 > div {height: 40px; line-height: 40px; text-align: center; font-family: 'Tomorrow', sans-serif;}
#fs_mb > label, #fs_mb2 > label, #fs_date > label, #fs_sub > label, #fs_sub2 > label {width: 95px;}
#fs_mb > label > img {vertical-align: bottom;}
#fs_date > select {width: 190px;}
#dateJ_div input, #dateH_div input {text-align: center;}
#d_jr_0, #d_mo_1, #d_hr_3, #d_mn_4, #d_sec_5 {width: 40px;}
#d_an_2 {width: 53px;}
#clr_sel {float: left; width: 188px; height: 28px; background: #33414e; margin: 5px 0; border: 1px solid #3d4e5d; text-align: center;}
#clr_sel > li {display: inline-block; width: 26px; height: 24px; margin: 1px 2px;}
#clr_filt {display: inline-block; width: 172px; height: 28px; background: #33414e; margin-top: -1px; padding: 3px 1px 1px; border: 1px solid #3d4e5d; border-radius: 0.4em; vertical-align: middle; text-align: center;}
#clr_filt > li {display: inline-block; width: 26px; height: 24px; margin: 1px;}
#clr_filt:hover, #clr_filt:active {border: 1px solid #006e82;}
#evmt_pan {margin-bottom: 10px; text-align: center;}
#evmt_cont {width: 320px; margin-left: auto; margin-right: auto;}
#evmt_cont > div {width: 152px; height: 134px; float: left; margin: 4px 0 0 4px; background: #33414e; color: white; text-align: center; border-top: 1px solid #3d4e5d; border-right: 1px solid black; border-bottom: 1px solid black; border-left: 1px solid #3d4e5d; border-radius: 6px;}
#evmt_cont > div:last-of-type {margin-bottom: 4px;}
#form_date {margin-bottom: 25px;}
#d_filt {width: 140px; text-align: center;}
#d_time {width: 170px; text-align: center;}
#d_filt:hover, #d_filt:active {border: 1px solid #006e82; text-shadow: 2px 1px 0 black;}
#d_tri, #d_precis {width: 136px;}
#anL {display: none;}
#svg_eye, #svg_eye2 {vertical-align: middle; cursor: pointer; margin-left: -26px;}
#svg_eye > path, #svg_eye2 > path {fill: white;}
#aj_rep {display: none;}
#new_anc, #cnx_anc {height: 40px; line-height: 40px; background: #33414e;}
#new_anc > div, #cnx_anc > div {display: inline-block; width: 0; height: 0; border-top: 20px solid transparent; border-bottom: 20px solid transparent; border-left: 10px solid #006e82; margin: 0 6px 0 0; vertical-align: middle;}
#new_anc > button, #cnx_anc > button {border: 1px solid #006e82;}
#new_anc > button:hover, #new_anc > button:active, #cnx_anc > button:hover, #cnx_anc > button:active {background: #006e82; text-shadow: none;}
#new_anc {margin-bottom: 12px;}
#cnx_anc {margin-bottom: 50px;}
#main {color: whitesmoke; font-size: 1.08em; line-height: 24px; text-align: center;}
#main b {color: teal;}
#main > h1 {margin-top: 48px;}
#main > h1 > span {white-space: nowrap;}
#main > div {margin: 0 10px; text-align: left; color: #adb7b5;}
#main > div > ul {margin: 24px 0 48px;}
#main > div > ul > li {display: inline-flex; align-items: center; margin: 24px 0; text-align: left;}
#main > div > ul > li .bullet::before {content: "\2022"; color: #006e82; margin-right: 8px; font-size: 1.2em;}
#main > div > ul > li .text {display: inline;}
#main > div > ul > li > span > span {background: rgba(0, 128, 128, 0.2); padding: 2px; border-radius: 0.3rem; white-space: nowrap;}
#a_cpt {display: inline-block; margin: 40px 8px;}
#copyr {margin: 48px 12px 12px; text-shadow: 1px 1px 6px whitesmoke;}

div.b_act {border-bottom: 1px solid #006e82;}
span.bd {display: block;}
span.s_pref {font-size: 0.85em;}
.no_disp {display: none;}
.clear {clear: left;}
.gras {font-weight: bold;}
.nowr {white-space: nowrap;}
.btn {min-width: 60px; height: 30px; padding: 2px;}
.envoi {margin: 4px 0;}
.ul_ev {margin: 4px;}
.ul_ev li {line-height: 20px; text-align: left; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 1.05em;}
.ev_an {display: inline-block; min-width: 42px; padding: 2px 4px; border-radius: 0.2em 0.6em; text-align: center; text-shadow: 1px 1px 3px #333;}
.ev_dt {display: inline-block; vertical-align: middle; border-top: 7px solid transparent; border-bottom: 7px solid transparent;}
.ul_ev > li:last-of-type, li.pad {padding: 0 4px;}
.ev_time, .ev_timeJ {margin-top: 6px; background: #006e82;}
.ev_time tr td, .ev_timeJ tr td {font-family: Arial, Helvetica, sans-serif; font-weight: bold; text-shadow: 2px 1px 0 #333333;}
.ev_time tr:first-child {line-height: 24px; font-size: 1.5em;}
.ev_time tr:last-child {line-height: 20px; font-size: 1.1em;}
.ev_time tr td:first-of-type {width: 45%; text-align: right;}
.ev_time tr td:last-of-type {text-align: left;}
.ev_timeJ tr:first-child {line-height: 20px;}
.ev_timeJ tr:last-child {line-height: 22px;}
.ev_timeJ tr td {text-align: center;}
.ev_timeJ tr:first-child td {padding: 4px 0 0; font-size: 1.25em;}
.ev_timeJ tr td img {margin: 0 0 2px;}
.ev_date {line-height: 24px;}
.b_sub {width: 190px; background: #006e82; border: none;}
.b_sub:hover {box-shadow: 0 0 2px #99ecff;}
.green_out, .orange_out, .red_out {height: auto; margin: 5px; padding: 7px 5px; background: white; color: black;} 
.green_out {border-left: 8px solid #11f20c;}
.orange_out {border-left: 8px solid #ffa500;}
.red_out {border-left: 8px solid #ff3c00;}
.msg_top {margin-bottom: 20px; text-align: justify;}
.psd_wh {color: #47afc6; font-weight: bold;}
.outBis {text-align: center;} .outBis2 {text-align: justify;}
.clr1 {background: linear-gradient(to top, #3eb7eb, #159bd5, #3eb7eb 85%);} .clr2 {background: linear-gradient(to top, #f9ca48, #f8b70a, #f9ca48 85%);} .clr3 {background: linear-gradient(to top, #3eebb7, #15d59b, #3eebb7 85%);} .clr4 {background: linear-gradient(to top, #b43eeb, #9715d5, #b43eeb 85%);} .clr5 {background: linear-gradient(to top, #eb3eba, #d5159f, #eb3eba 85%);} .clr6 {background: linear-gradient(to top, #eb3e5d, #d51537, #eb3e5d 85%);}
.clrB1, .clrB2, .clrB3, .clrB4, .clrB5, .clrB6 {border-width: 0; border-left: 4px solid;}
.clrB1 {border-image: linear-gradient(#3eb7eb, #159bd5, #33414e) 0 100%;} .clrB2 {border-image: linear-gradient(#f9ca48, #f8b70a, #33414e) 0 100%;} .clrB3 {border-image: linear-gradient(#3eebb7, #15d59b, #33414e) 0 100%;} .clrB4 {border-image: linear-gradient(#b43eeb, #9715d5, #33414e) 0 100%;} .clrB5 {border-image: linear-gradient(#eb3eba, #d5159f, #33414e) 0 100%;} .clrB6 {border-image: linear-gradient(#eb3e5d, #d51537, #33414e) 0 100%;}
.clrA {border: 1px solid yellow;}
.ut1 {font-size: 1.2em;} .ut1w {font-size: 0.95em;}
.ut2 {font-size: 0.9em;} .ut2w {font-size: 0.7em;}
.add_ico {display: inline-block; width: 12px; height: 12px; border-radius: 50px; color: #333333; margin-right: 2px; padding: 2px; line-height: 12px; vertical-align: middle; font-family: Arial, Helvetica, sans-serif; font-size: 1.2em;}
.add_ico_bg0 {background: grey;} 
.add_ico_bg1 {background: white;} 
.nav_css0, .nav_css1  {margin-top: 64px;}
.cnx_css0, .cnx_css1 {margin: 6px 0;} 
.cnx_bordG {border-bottom: 4px solid grey;}
.cnx_bordV {border-bottom: 4px solid #006e82;}

@media all and (min-width: 360px) {
input, textarea, select {width: 220px;}
#ch_sl, #corps {width: 344px;}
#ch_sl > div {padding: 6px 50px 2px;}
#nav_bar_c > div {width: 108px;}
#fs_date > label, #fs_sub > label, #fs_sub2 > label, #fs_mb > label, #fs_mb2 > label {width: 100px;}
#fs_date > select {width: 230px;}
#evmt_cont {width: 360px;}
#evmt_cont > div {width: 172px;}
#d_filt {width: 142px;}
#d_time {width: 172px;}
#main {font-size: 1.15em;}
.b_sub {width: 230px;}
}

@media all and (min-width: 410px) {
input, textarea, select {width: 220px;}
#ch_sl, #corps {width: 394px;}
#ch_sl > div {padding: 6px 50px 2px;}
#nav_bar_c > div {width: 124px;}
#fs_date > label, #fs_sub > label, #fs_sub2 > label, #fs_mb > label, #fs_mb2 > label {width: 100px;}
#fs_date > select {width: 230px;}
#evmt_cont {width: 410px;}
#evmt_cont > div {width: 196px;}
#d_filt {width: 162px;}
#d_time {width: 192px;}
#main {font-size: 1.15em;}
.b_sub {width: 230px;}
}

@media all and (min-width: 640px) {
label {font-size: 0.9em;}
h1 {font-size: 1.3em; line-height: 36px;}
#ch_sl, #corps {width: 624px;}
#ch_sl > div {padding: 6px 2px; text-align: center;}
#cnx_bar > a, #cnx_bar > span {padding: 0 8px 2px 26px;}
#nav_bar_c > div {width: 198px;}
#fs_date > label, #fs_sub > label, #fs_sub2 > label, #fs_mb > label, #fs_mb2 > label {width: 150px;}
#evmt_cont {width: 640px;}
#evmt_cont > div {width: 153px;}
#d_time {width: 160px;}
#anC {display: none;}
#anL {display: inline;}
div.nb_bord2 {height: 48px; line-height: 48px; padding: 2px;}
span.bd {display: inline;}
}

@media all and (min-width: 960px) {
#corps {width: 944px;}
#evmt_cont {width: 958px;}
#d_time {width: 198px;}
#mb_create, #mb_connect {width: 414px; float: left;}
#fs_mb2 {height: 204px;}
#new_anc, #cnx_anc {display: none;}
#main {font-size: 1.2em;}
#main > div {text-align: justify;}
.nav_css0 {margin-top: 36px;}
.cnx_css0 {margin: -28px 0;}
}