:root {
--vert-clair : #1ABB9C;
--vert-fonce : #00878F;
--rouge : #DD4B39;
--orange : #E47128;
--jaune : #E5AD24;
--brun : #8C7965;
--blanc : #FFFFFF;
--noir : #1F1F1F;
--noir-clair : #262626;
--gris-fonce : #444444;
--gris-moyen : #777777;
--gris-clair : #EEEEEE;
--default : #646464;
--alert-success : #28D278;
--alert-info : #5AB9f0;
--alert-primary : #1E87CD;
--alert-warning : #FAAF0A;
--alert-danger : #FF5055;
--badge-default : #646464;
--badge-success : #00A65A;
--badge-info : #64AAC3;
--badge-primary : #3C8DBC;
--badge-warning : #F39C12;
--badge-danger : #DD4B39;

@import url('https://fonts.googleapis.com/css2?family=Oswald&family=Roboto&display=swap');		


}
body {
margin : 0;
font-size : 13px;
font-family : "Open Sans", sans-serif;
color : var(--gris-fonce);
background : #EEEEEE;
overflow-x : hidden;
}
body button {
font-family : "system", sans-serif;
}
.link {
color : var(--vert-fonce);
text-decoration : none;
}
.link:hover {
color : var(--vert-fonce);
text-decoration : overline underline;
}
.link:visited {
color : var(--vert-fonce);
text-decoration : none;
}
.link:active {
color : var(--vert-fonce);
text-decoration : none;
}
.link:disabled {
color : var(--gris-fonce);
text-decoration : none;
}
.row {
display : flex;
flex-wrap : wrap;
margin-right : -15px;
margin-left : -15px;
}
.no-gutters {
margin-right : 0;
margin-left : 0;
}
.no-gutters > .col, .no-gutters > [class*="col-"] {
padding-right : 0;
padding-left : 0;
}
.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, .col, .col-auto, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm, .col-sm-auto, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-md, .col-md-auto, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg, .col-lg-auto, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl, .col-xl-auto {
position : relative;
width : 100%;
min-height : 1px;
padding-right : 15px;
padding-left : 15px;
}
.col {
flex-basis : 0;
flex-grow : 1;
max-width : 100%;
}
.col-auto {
flex : 0 0 auto;
width : auto;
max-width : none;
}
.col-1 {
flex : 0 0 8.33333%;
max-width : 8.33333%;
}
.col-2 {
flex : 0 0 16.66667%;
max-width : 16.66667%;
}
.col-3 {
flex : 0 0 25%;
max-width : 25%;
}
.col-4 {
flex : 0 0 33.33333%;
max-width : 33.33333%;
}
.col-5 {
flex : 0 0 41.66667%;
max-width : 41.66667%;
}
.col-6 {
flex : 0 0 50%;
max-width : 50%;
}
.col-7 {
flex : 0 0 58.33333%;
max-width : 58.33333%;
}
.col-8 {
flex : 0 0 66.66667%;
max-width : 66.66667%;
}
.col-9 {
flex : 0 0 75%;
max-width : 75%;
}
.col-10 {
flex : 0 0 83.33333%;
max-width : 83.33333%;
}
.col-11 {
flex : 0 0 91.66667%;
max-width : 91.66667%;
}
.col-12 {
flex : 0 0 100%;
max-width : 100%;
}
.order-first {
order : -1;
}
.order-last {
order : 13;
}
.order-0 {
order : 0;
}
.order-1 {
order : 1;
}
.order-2 {
order : 2;
}
.order-3 {
order : 3;
}
.order-4 {
order : 4;
}
.order-5 {
order : 5;
}
.order-6 {
order : 6;
}
.order-7 {
order : 7;
}
.order-8 {
order : 8;
}
.order-9 {
order : 9;
}
.order-10 {
order : 10;
}
.order-11 {
order : 11;
}
.order-12 {
order : 12;
}
.offset-1 {
margin-left : 8.33333%;
}
.offset-2 {
margin-left : 16.66667%;
}
.offset-3 {
margin-left : 25%;
}
.offset-4 {
margin-left : 33.33333%;
}
.offset-5 {
margin-left : 41.66667%;
}
.offset-6 {
margin-left : 50%;
}
.offset-7 {
margin-left : 58.33333%;
}
.offset-8 {
margin-left : 66.66667%;
}
.offset-9 {
margin-left : 75%;
}
.offset-10 {
margin-left : 83.33333%;
}
.offset-11 {
margin-left : 91.66667%;
}
@media (min-width: 576px) {
.col-sm {
flex-basis : 0;
flex-grow : 1;
max-width : 100%;
}
.col-sm-auto {
flex : 0 0 auto;
width : auto;
max-width : none;
}
.col-sm-1 {
flex : 0 0 8.33333%;
max-width : 8.33333%;
}
.col-sm-2 {
flex : 0 0 16.66667%;
max-width : 16.66667%;
}
.col-sm-3 {
flex : 0 0 25%;
max-width : 25%;
}
.col-sm-4 {
flex : 0 0 33.33333%;
max-width : 33.33333%;
}
.col-sm-5 {
flex : 0 0 41.66667%;
max-width : 41.66667%;
}
.col-sm-6 {
flex : 0 0 50%;
max-width : 50%;
}
.col-sm-7 {
flex : 0 0 58.33333%;
max-width : 58.33333%;
}
.col-sm-8 {
flex : 0 0 66.66667%;
max-width : 66.66667%;
}
.col-sm-9 {
flex : 0 0 75%;
max-width : 75%;
}
.col-sm-10 {
flex : 0 0 83.33333%;
max-width : 83.33333%;
}
.col-sm-11 {
flex : 0 0 91.66667%;
max-width : 91.66667%;
}
.col-sm-12 {
flex : 0 0 100%;
max-width : 100%;
}
.order-sm-first {
order : -1;
}
.order-sm-last {
order : 13;
}
.order-sm-0 {
order : 0;
}
.order-sm-1 {
order : 1;
}
.order-sm-2 {
order : 2;
}
.order-sm-3 {
order : 3;
}
.order-sm-4 {
order : 4;
}
.order-sm-5 {
order : 5;
}
.order-sm-6 {
order : 6;
}
.order-sm-7 {
order : 7;
}
.order-sm-8 {
order : 8;
}
.order-sm-9 {
order : 9;
}
.order-sm-10 {
order : 10;
}
.order-sm-11 {
order : 11;
}
.order-sm-12 {
order : 12;
}
.offset-sm-0 {
margin-left : 0;
}
.offset-sm-1 {
margin-left : 8.33333%;
}
.offset-sm-2 {
margin-left : 16.66667%;
}
.offset-sm-3 {
margin-left : 25%;
}
.offset-sm-4 {
margin-left : 33.33333%;
}
.offset-sm-5 {
margin-left : 41.66667%;
}
.offset-sm-6 {
margin-left : 50%;
}
.offset-sm-7 {
margin-left : 58.33333%;
}
.offset-sm-8 {
margin-left : 66.66667%;
}
.offset-sm-9 {
margin-left : 75%;
}
.offset-sm-10 {
margin-left : 83.33333%;
}
.offset-sm-11 {
margin-left : 91.66667%;
}
}
@media (min-width: 768px) {
.col-md {
flex-basis : 0;
flex-grow : 1;
max-width : 100%;
}
.col-md-auto {
flex : 0 0 auto;
width : auto;
max-width : none;
}
.col-md-1 {
flex : 0 0 8.33333%;
max-width : 8.33333%;
}
.col-md-2 {
flex : 0 0 16.66667%;
max-width : 16.66667%;
}
.col-md-3 {
flex : 0 0 25%;
max-width : 25%;
}
.col-md-4 {
flex : 0 0 33.33333%;
max-width : 33.33333%;
}
.col-md-5 {
flex : 0 0 41.66667%;
max-width : 41.66667%;
}
.col-md-6 {
flex : 0 0 50%;
max-width : 50%;
}
.col-md-7 {
flex : 0 0 58.33333%;
max-width : 58.33333%;
}
.col-md-8 {
flex : 0 0 66.66667%;
max-width : 66.66667%;
}
.col-md-9 {
flex : 0 0 75%;
max-width : 75%;
}
.col-md-10 {
flex : 0 0 83.33333%;
max-width : 83.33333%;
}
.col-md-11 {
flex : 0 0 91.66667%;
max-width : 91.66667%;
}
.col-md-12 {
flex : 0 0 100%;
max-width : 100%;
}
.order-md-first {
order : -1;
}
.order-md-last {
order : 13;
}
.order-md-0 {
order : 0;
}
.order-md-1 {
order : 1;
}
.order-md-2 {
order : 2;
}
.order-md-3 {
order : 3;
}
.order-md-4 {
order : 4;
}
.order-md-5 {
order : 5;
}
.order-md-6 {
order : 6;
}
.order-md-7 {
order : 7;
}
.order-md-8 {
order : 8;
}
.order-md-9 {
order : 9;
}
.order-md-10 {
order : 10;
}
.order-md-11 {
order : 11;
}
.order-md-12 {
order : 12;
}
.offset-md-0 {
margin-left : 0;
}
.offset-md-1 {
margin-left : 8.33333%;
}
.offset-md-2 {
margin-left : 16.66667%;
}
.offset-md-3 {
margin-left : 25%;
}
.offset-md-4 {
margin-left : 33.33333%;
}
.offset-md-5 {
margin-left : 41.66667%;
}
.offset-md-6 {
margin-left : 50%;
}
.offset-md-7 {
margin-left : 58.33333%;
}
.offset-md-8 {
margin-left : 66.66667%;
}
.offset-md-9 {
margin-left : 75%;
}
.offset-md-10 {
margin-left : 83.33333%;
}
.offset-md-11 {
margin-left : 91.66667%;
}
}
@media (min-width: 992px) {
.col-lg {
flex-basis : 0;
flex-grow : 1;
max-width : 100%;
}
.col-lg-auto {
flex : 0 0 auto;
width : auto;
max-width : none;
}
.col-lg-1 {
flex : 0 0 8.33333%;
max-width : 8.33333%;
}
.col-lg-2 {
flex : 0 0 16.66667%;
max-width : 16.66667%;
}
.col-lg-3 {
flex : 0 0 25%;
max-width : 25%;
}
.col-lg-4 {
flex : 0 0 33.33333%;
max-width : 33.33333%;
}
.col-lg-5 {
flex : 0 0 41.66667%;
max-width : 41.66667%;
}
.col-lg-6 {
flex : 0 0 50%;
max-width : 50%;
}
.col-lg-7 {
flex : 0 0 58.33333%;
max-width : 58.33333%;
}
.col-lg-8 {
flex : 0 0 66.66667%;
max-width : 66.66667%;
}
.col-lg-9 {
flex : 0 0 75%;
max-width : 75%;
}
.col-lg-10 {
flex : 0 0 83.33333%;
max-width : 83.33333%;
}
.col-lg-11 {
flex : 0 0 91.66667%;
max-width : 91.66667%;
}
.col-lg-12 {
flex : 0 0 100%;
max-width : 100%;
}
.order-lg-first {
order : -1;
}
.order-lg-last {
order : 13;
}
.order-lg-0 {
order : 0;
}
.order-lg-1 {
order : 1;
}
.order-lg-2 {
order : 2;
}
.order-lg-3 {
order : 3;
}
.order-lg-4 {
order : 4;
}
.order-lg-5 {
order : 5;
}
.order-lg-6 {
order : 6;
}
.order-lg-7 {
order : 7;
}
.order-lg-8 {
order : 8;
}
.order-lg-9 {
order : 9;
}
.order-lg-10 {
order : 10;
}
.order-lg-11 {
order : 11;
}
.order-lg-12 {
order : 12;
}
.offset-lg-0 {
margin-left : 0;
}
.offset-lg-1 {
margin-left : 8.33333%;
}
.offset-lg-2 {
margin-left : 16.66667%;
}
.offset-lg-3 {
margin-left : 25%;
}
.offset-lg-4 {
margin-left : 33.33333%;
}
.offset-lg-5 {
margin-left : 41.66667%;
}
.offset-lg-6 {
margin-left : 50%;
}
.offset-lg-7 {
margin-left : 58.33333%;
}
.offset-lg-8 {
margin-left : 66.66667%;
}
.offset-lg-9 {
margin-left : 75%;
}
.offset-lg-10 {
margin-left : 83.33333%;
}
.offset-lg-11 {
margin-left : 91.66667%;
}
}
@media (min-width: 1200px) {
.col-xl {
flex-basis : 0;
flex-grow : 1;
max-width : 100%;
}
.col-xl-auto {
flex : 0 0 auto;
width : auto;
max-width : none;
}
.col-xl-1 {
flex : 0 0 8.33333%;
max-width : 8.33333%;
}
.col-xl-2 {
flex : 0 0 16.66667%;
max-width : 16.66667%;
}
.col-xl-3 {
flex : 0 0 25%;
max-width : 25%;
}
.col-xl-4 {
flex : 0 0 33.33333%;
max-width : 33.33333%;
}
.col-xl-5 {
flex : 0 0 41.66667%;
max-width : 41.66667%;
}
.col-xl-6 {
flex : 0 0 50%;
max-width : 50%;
}
.col-xl-7 {
flex : 0 0 58.33333%;
max-width : 58.33333%;
}
.col-xl-8 {
flex : 0 0 66.66667%;
max-width : 66.66667%;
}
.col-xl-9 {
flex : 0 0 75%;
max-width : 75%;
}
.col-xl-10 {
flex : 0 0 83.33333%;
max-width : 83.33333%;
}
.col-xl-11 {
flex : 0 0 91.66667%;
max-width : 91.66667%;
}
.col-xl-12 {
flex : 0 0 100%;
max-width : 100%;
}
.order-xl-first {
order : -1;
}
.order-xl-last {
order : 13;
}
.order-xl-0 {
order : 0;
}
.order-xl-1 {
order : 1;
}
.order-xl-2 {
order : 2;
}
.order-xl-3 {
order : 3;
}
.order-xl-4 {
order : 4;
}
.order-xl-5 {
order : 5;
}
.order-xl-6 {
order : 6;
}
.order-xl-7 {
order : 7;
}
.order-xl-8 {
order : 8;
}
.order-xl-9 {
order : 9;
}
.order-xl-10 {
order : 10;
}
.order-xl-11 {
order : 11;
}
.order-xl-12 {
order : 12;
}
.offset-xl-0 {
margin-left : 0;
}
.offset-xl-1 {
margin-left : 8.33333%;
}
.offset-xl-2 {
margin-left : 16.66667%;
}
.offset-xl-3 {
margin-left : 25%;
}
.offset-xl-4 {
margin-left : 33.33333%;
}
.offset-xl-5 {
margin-left : 41.66667%;
}
.offset-xl-6 {
margin-left : 50%;
}
.offset-xl-7 {
margin-left : 58.33333%;
}
.offset-xl-8 {
margin-left : 66.66667%;
}
.offset-xl-9 {
margin-left : 75%;
}
.offset-xl-10 {
margin-left : 83.33333%;
}
.offset-xl-11 {
margin-left : 91.66667%;
}
}
.d-none {
display : none !important ;
}
.d-inline {
display : inline !important ;
}
.d-inline-block {
display : inline-block !important ;
}
.d-block {
display : block !important ;
}
.d-table {
display : table !important ;
}
.d-table-row {
display : table-row !important ;
}
.d-table-cell {
display : table-cell !important ;
}
.d-flex {
display : flex !important ;
}
.d-inline-flex {
display : inline-flex !important ;
}
@media (min-width: 576px) {
.d-sm-none {
display : none !important ;
}
.d-sm-inline {
display : inline !important ;
}
.d-sm-inline-block {
display : inline-block !important ;
}
.d-sm-block {
display : block !important ;
}
.d-sm-table {
display : table !important ;
}
.d-sm-table-row {
display : table-row !important ;
}
.d-sm-table-cell {
display : table-cell !important ;
}
.d-sm-flex {
display : flex !important ;
}
.d-sm-inline-flex {
display : inline-flex !important ;
}
}
@media (min-width: 768px) {
.d-md-none {
display : none !important ;
}
.d-md-inline {
display : inline !important ;
}
.d-md-inline-block {
display : inline-block !important ;
}
.d-md-block {
display : block !important ;
}
.d-md-table {
display : table !important ;
}
.d-md-table-row {
display : table-row !important ;
}
.d-md-table-cell {
display : table-cell !important ;
}
.d-md-flex {
display : flex !important ;
}
.d-md-inline-flex {
display : inline-flex !important ;
}
}
@media (min-width: 992px) {
.d-lg-none {
display : none !important ;
}
.d-lg-inline {
display : inline !important ;
}
.d-lg-inline-block {
display : inline-block !important ;
}
.d-lg-block {
display : block !important ;
}
.d-lg-table {
display : table !important ;
}
.d-lg-table-row {
display : table-row !important ;
}
.d-lg-table-cell {
display : table-cell !important ;
}
.d-lg-flex {
display : flex !important ;
}
.d-lg-inline-flex {
display : inline-flex !important ;
}
}
@media (min-width: 1200px) {
.d-xl-none {
display : none !important ;
}
.d-xl-inline {
display : inline !important ;
}
.d-xl-inline-block {
display : inline-block !important ;
}
.d-xl-block {
display : block !important ;
}
.d-xl-table {
display : table !important ;
}
.d-xl-table-row {
display : table-row !important ;
}
.d-xl-table-cell {
display : table-cell !important ;
}
.d-xl-flex {
display : flex !important ;
}
.d-xl-inline-flex {
display : inline-flex !important ;
}
}
@media print {
.d-print-none {
display : none !important ;
}
.d-print-inline {
display : inline !important ;
}
.d-print-inline-block {
display : inline-block !important ;
}
.d-print-block {
display : block !important ;
}
.d-print-table {
display : table !important ;
}
.d-print-table-row {
display : table-row !important ;
}
.d-print-table-cell {
display : table-cell !important ;
}
.d-print-flex {
display : flex !important ;
}
.d-print-inline-flex {
display : inline-flex !important ;
}
}
.flex-row {
flex-direction : row !important ;
}
.flex-column {
flex-direction : column !important ;
}
.flex-row-reverse {
flex-direction : row-reverse !important ;
}
.flex-column-reverse {
flex-direction : column-reverse !important ;
}
.flex-wrap {
flex-wrap : wrap !important ;
}
.flex-nowrap {
flex-wrap : nowrap !important ;
}
.flex-wrap-reverse {
flex-wrap : wrap-reverse !important ;
}
.flex-fill {
flex : 1 1 auto !important ;
}
.flex-grow-0 {
flex-grow : 0 !important ;
}
.flex-grow-1 {
flex-grow : 1 !important ;
}
.flex-shrink-0 {
flex-shrink : 0 !important ;
}
.flex-shrink-1 {
flex-shrink : 1 !important ;
}
.justify-content-start {
justify-content : flex-start !important ;
}
.justify-content-end {
justify-content : flex-end !important ;
}
.justify-content-center {
justify-content : center !important ;
}
.justify-content-between {
justify-content : space-between !important ;
}
.justify-content-around {
justify-content : space-around !important ;
}
.align-items-start {
align-items : flex-start !important ;
}
.align-items-end {
align-items : flex-end !important ;
}
.align-items-center {
align-items : center !important ;
}
.align-items-baseline {
align-items : baseline !important ;
}
.align-items-stretch {
align-items : stretch !important ;
}
.align-content-start {
align-content : flex-start !important ;
}
.align-content-end {
align-content : flex-end !important ;
}
.align-content-center {
align-content : center !important ;
}
.align-content-between {
align-content : space-between !important ;
}
.align-content-around {
align-content : space-around !important ;
}
.align-content-stretch {
align-content : stretch !important ;
}
.align-self-auto {
align-self : auto !important ;
}
.align-self-start {
align-self : flex-start !important ;
}
.align-self-end {
align-self : flex-end !important ;
}
.align-self-center {
align-self : center !important ;
}
.align-self-baseline {
align-self : baseline !important ;
}
.align-self-stretch {
align-self : stretch !important ;
}
@media (min-width: 576px) {
.flex-sm-row {
flex-direction : row !important ;
}
.flex-sm-column {
flex-direction : column !important ;
}
.flex-sm-row-reverse {
flex-direction : row-reverse !important ;
}
.flex-sm-column-reverse {
flex-direction : column-reverse !important ;
}
.flex-sm-wrap {
flex-wrap : wrap !important ;
}
.flex-sm-nowrap {
flex-wrap : nowrap !important ;
}
.flex-sm-wrap-reverse {
flex-wrap : wrap-reverse !important ;
}
.flex-sm-fill {
flex : 1 1 auto !important ;
}
.flex-sm-grow-0 {
flex-grow : 0 !important ;
}
.flex-sm-grow-1 {
flex-grow : 1 !important ;
}
.flex-sm-shrink-0 {
flex-shrink : 0 !important ;
}
.flex-sm-shrink-1 {
flex-shrink : 1 !important ;
}
.justify-content-sm-start {
justify-content : flex-start !important ;
}
.justify-content-sm-end {
justify-content : flex-end !important ;
}
.justify-content-sm-center {
justify-content : center !important ;
}
.justify-content-sm-between {
justify-content : space-between !important ;
}
.justify-content-sm-around {
justify-content : space-around !important ;
}
.align-items-sm-start {
align-items : flex-start !important ;
}
.align-items-sm-end {
align-items : flex-end !important ;
}
.align-items-sm-center {
align-items : center !important ;
}
.align-items-sm-baseline {
align-items : baseline !important ;
}
.align-items-sm-stretch {
align-items : stretch !important ;
}
.align-content-sm-start {
align-content : flex-start !important ;
}
.align-content-sm-end {
align-content : flex-end !important ;
}
.align-content-sm-center {
align-content : center !important ;
}
.align-content-sm-between {
align-content : space-between !important ;
}
.align-content-sm-around {
align-content : space-around !important ;
}
.align-content-sm-stretch {
align-content : stretch !important ;
}
.align-self-sm-auto {
align-self : auto !important ;
}
.align-self-sm-start {
align-self : flex-start !important ;
}
.align-self-sm-end {
align-self : flex-end !important ;
}
.align-self-sm-center {
align-self : center !important ;
}
.align-self-sm-baseline {
align-self : baseline !important ;
}
.align-self-sm-stretch {
align-self : stretch !important ;
}
}
@media (min-width: 768px) {
.flex-md-row {
flex-direction : row !important ;
}
.flex-md-column {
flex-direction : column !important ;
}
.flex-md-row-reverse {
flex-direction : row-reverse !important ;
}
.flex-md-column-reverse {
flex-direction : column-reverse !important ;
}
.flex-md-wrap {
flex-wrap : wrap !important ;
}
.flex-md-nowrap {
flex-wrap : nowrap !important ;
}
.flex-md-wrap-reverse {
flex-wrap : wrap-reverse !important ;
}
.flex-md-fill {
flex : 1 1 auto !important ;
}
.flex-md-grow-0 {
flex-grow : 0 !important ;
}
.flex-md-grow-1 {
flex-grow : 1 !important ;
}
.flex-md-shrink-0 {
flex-shrink : 0 !important ;
}
.flex-md-shrink-1 {
flex-shrink : 1 !important ;
}
.justify-content-md-start {
justify-content : flex-start !important ;
}
.justify-content-md-end {
justify-content : flex-end !important ;
}
.justify-content-md-center {
justify-content : center !important ;
}
.justify-content-md-between {
justify-content : space-between !important ;
}
.justify-content-md-around {
justify-content : space-around !important ;
}
.align-items-md-start {
align-items : flex-start !important ;
}
.align-items-md-end {
align-items : flex-end !important ;
}
.align-items-md-center {
align-items : center !important ;
}
.align-items-md-baseline {
align-items : baseline !important ;
}
.align-items-md-stretch {
align-items : stretch !important ;
}
.align-content-md-start {
align-content : flex-start !important ;
}
.align-content-md-end {
align-content : flex-end !important ;
}
.align-content-md-center {
align-content : center !important ;
}
.align-content-md-between {
align-content : space-between !important ;
}
.align-content-md-around {
align-content : space-around !important ;
}
.align-content-md-stretch {
align-content : stretch !important ;
}
.align-self-md-auto {
align-self : auto !important ;
}
.align-self-md-start {
align-self : flex-start !important ;
}
.align-self-md-end {
align-self : flex-end !important ;
}
.align-self-md-center {
align-self : center !important ;
}
.align-self-md-baseline {
align-self : baseline !important ;
}
.align-self-md-stretch {
align-self : stretch !important ;
}
}
@media (min-width: 992px) {
.flex-lg-row {
flex-direction : row !important ;
}
.flex-lg-column {
flex-direction : column !important ;
}
.flex-lg-row-reverse {
flex-direction : row-reverse !important ;
}
.flex-lg-column-reverse {
flex-direction : column-reverse !important ;
}
.flex-lg-wrap {
flex-wrap : wrap !important ;
}
.flex-lg-nowrap {
flex-wrap : nowrap !important ;
}
.flex-lg-wrap-reverse {
flex-wrap : wrap-reverse !important ;
}
.flex-lg-fill {
flex : 1 1 auto !important ;
}
.flex-lg-grow-0 {
flex-grow : 0 !important ;
}
.flex-lg-grow-1 {
flex-grow : 1 !important ;
}
.flex-lg-shrink-0 {
flex-shrink : 0 !important ;
}
.flex-lg-shrink-1 {
flex-shrink : 1 !important ;
}
.justify-content-lg-start {
justify-content : flex-start !important ;
}
.justify-content-lg-end {
justify-content : flex-end !important ;
}
.justify-content-lg-center {
justify-content : center !important ;
}
.justify-content-lg-between {
justify-content : space-between !important ;
}
.justify-content-lg-around {
justify-content : space-around !important ;
}
.align-items-lg-start {
align-items : flex-start !important ;
}
.align-items-lg-end {
align-items : flex-end !important ;
}
.align-items-lg-center {
align-items : center !important ;
}
.align-items-lg-baseline {
align-items : baseline !important ;
}
.align-items-lg-stretch {
align-items : stretch !important ;
}
.align-content-lg-start {
align-content : flex-start !important ;
}
.align-content-lg-end {
align-content : flex-end !important ;
}
.align-content-lg-center {
align-content : center !important ;
}
.align-content-lg-between {
align-content : space-between !important ;
}
.align-content-lg-around {
align-content : space-around !important ;
}
.align-content-lg-stretch {
align-content : stretch !important ;
}
.align-self-lg-auto {
align-self : auto !important ;
}
.align-self-lg-start {
align-self : flex-start !important ;
}
.align-self-lg-end {
align-self : flex-end !important ;
}
.align-self-lg-center {
align-self : center !important ;
}
.align-self-lg-baseline {
align-self : baseline !important ;
}
.align-self-lg-stretch {
align-self : stretch !important ;
}
}
@media (min-width: 1200px) {
.flex-xl-row {
flex-direction : row !important ;
}
.flex-xl-column {
flex-direction : column !important ;
}
.flex-xl-row-reverse {
flex-direction : row-reverse !important ;
}
.flex-xl-column-reverse {
flex-direction : column-reverse !important ;
}
.flex-xl-wrap {
flex-wrap : wrap !important ;
}
.flex-xl-nowrap {
flex-wrap : nowrap !important ;
}
.flex-xl-wrap-reverse {
flex-wrap : wrap-reverse !important ;
}
.flex-xl-fill {
flex : 1 1 auto !important ;
}
.flex-xl-grow-0 {
flex-grow : 0 !important ;
}
.flex-xl-grow-1 {
flex-grow : 1 !important ;
}
.flex-xl-shrink-0 {
flex-shrink : 0 !important ;
}
.flex-xl-shrink-1 {
flex-shrink : 1 !important ;
}
.justify-content-xl-start {
justify-content : flex-start !important ;
}
.justify-content-xl-end {
justify-content : flex-end !important ;
}
.justify-content-xl-center {
justify-content : center !important ;
}
.justify-content-xl-between {
justify-content : space-between !important ;
}
.justify-content-xl-around {
justify-content : space-around !important ;
}
.align-items-xl-start {
align-items : flex-start !important ;
}
.align-items-xl-end {
align-items : flex-end !important ;
}
.align-items-xl-center {
align-items : center !important ;
}
.align-items-xl-baseline {
align-items : baseline !important ;
}
.align-items-xl-stretch {
align-items : stretch !important ;
}
.align-content-xl-start {
align-content : flex-start !important ;
}
.align-content-xl-end {
align-content : flex-end !important ;
}
.align-content-xl-center {
align-content : center !important ;
}
.align-content-xl-between {
align-content : space-between !important ;
}
.align-content-xl-around {
align-content : space-around !important ;
}
.align-content-xl-stretch {
align-content : stretch !important ;
}
.align-self-xl-auto {
align-self : auto !important ;
}
.align-self-xl-start {
align-self : flex-start !important ;
}
.align-self-xl-end {
align-self : flex-end !important ;
}
.align-self-xl-center {
align-self : center !important ;
}
.align-self-xl-baseline {
align-self : baseline !important ;
}
.align-self-xl-stretch {
align-self : stretch !important ;
}
}
*, *::before, *::after {
box-sizing : border-box;
}
div, header, nav, main, footer, section, article, aside {
position : relative;
}
@font-face {
font-family : "Open Sans";
font-style : normal;
font-weight : 300;
}
input:not([type="range"]), select {
appearance : none;
border : none;
border-radius : 0;
padding : 0;
margin : 0;
box-shadow : none;
}
i.material-icons {
font-size : inherit;
margin-right : 0.1em;
}
.material-icons {
vertical-align : middle;
}
.material-icons > * {
font-family : "system", sans-serif;
}
hr {
height : 1px;
background : linear-gradient(to right, transparent, lightgray 15%, lightgray 85%, transparent);
border : none;
}
img {
user-select : none;
}



.header {
	background : #00888f;
	display : flex;
	flex-wrap : wrap;
}

.header-button {
	font-size : 14px;
	line-height : 16px;
	padding : 17px 15px;
	text-decoration : none;
	color : white;
	position : relative;
	background-color : transparent;
	border : none;
	cursor : pointer;
	outline : none;
}

.header-button.material-icons {
	padding : 0;
	width : 51px;
	text-align : center;
	line-height : 51px !important ;
	font-size : 18px;
	z-index: 10;
}

.header-button:hover, .header-button:active, .header-button:focus {
	background : #00878F;
}
.main-button {
	background : #00878F;
	width : 230px;
	text-align : center;
	font-size : 20px;
	line-height : 20px;
	padding : 15px;
	margin-right : auto;
}

@media (max-width: 900px) {
	.main-button {
		width : 100%;
	}
}

.menu-toggle {
	margin-right : auto;
	font-size : 24px !important ;
}

@media (min-width: 901px) {
	.menu-toggle {
		display : none !important ;
	}
}

.header-button-label-red, .header-button-label-green, .header-button-label-yellow {
	position : absolute;
	display : block;
	left : calc(100% - 20px);
	top : 7px;
	font-size : 9px;
	line-height : 9px;
	padding : 2px;
	border-radius : 3px;
}

.header-button-label-green {
	background-color : #1ABB9C;
}
.header-button-label-red {
	background-color : #DD4B39;
}
.header-button-label-yellow {
	background-color : #E5AD24;
}
.header-pane {
	display : inline-block;
}

.header-pane > .header-button::before, .header-pane > .header-button::after {
	pointer-events : none;
	opacity : 0;
	content : '';
	display : block;
	position : absolute;
	left : calc(50% - 4px);
	bottom : -3px;
	z-index : 50;
	border-top : 0 solid transparent;
	border-left : 4px solid transparent;
	border-right : 4px solid transparent;
	border-bottom : 8px solid white;
}

.header-pane > .header-button::before {
border-bottom-color : lightgray;
bottom : -1px;
filter : drop-shadow(2px 0 2px rgb(0, 0, 0, 0.5));
}
.header-pane:hover > .header-button::after, .header-pane:hover > .header-button::before, .header-pane > .header-button:focus::after, .header-pane > .header-button:focus::before, .header-pane > .header-button:hover::after, .header-pane > .header-button:hover::before {
transition : opacity 0.5s;
opacity : 1;
pointer-events : auto;
}
.header-pane:hover > .header-button + .header-pane-popup, .header-pane > .header-button:focus + .header-pane-popup, .header-pane > .header-button:hover + .header-pane-popup {
transition : opacity 0.5s;
user-select : auto;
pointer-events : auto;
opacity : 1;
}
.header-pane-popup {
opacity : 0;
pointer-events : none;
user-select : none;
position : absolute;
z-index : 10;
right : 0;
width : 300px;
background-color : white;
border : lightgray solid 1px;
border-radius : 5px;
margin-top : 2px;
box-shadow : 2px 2px 10px rgb(0, 0, 0, 0.5);
overflow : hidden;
}
@media (max-width: 500px) {
.header-pane-popup {
position : fixed;
left : 10px;
right : 10px;
width : auto;
}
}
.header-pane-header {
border-bottom : 1px solid lightgray;
padding : 10px;
font-size : 16px;
color : #323232;
}
.header-pane-header > .material-icons {
margin-top : -4px;
font-size : 20px;
}
.header-pane-body {
padding : 10px;
max-height : 400px;
overflow-y : auto;
}
@media (max-height: 600px) {
.header-pane-body {
max-height : calc(100vh - 200px);
}
}
.header-pane-footer {
border-top : 1px solid lightgray;
padding : 5px;
}
.header-notification-title {
margin-bottom : 5px;
}
.header-notification-description {
font-size : 13px;
color : #1e1e1e;
}


.menu {
	width : 230px;
}
@media (min-width: 900px) {
	.menu {
		background : #1e1e1e;
	}
}
@media (max-width: 900px) {
	.menu {
		margin-top : -100px;
		padding-top : 100px;
		width : 50vw;
		left : -50vw;
		position : absolute;
		transition : transform 0.5s;
	}
	.menu:target {
		transform : translateX(50vw);
	}
}
@media (max-width: 500px) {
	.menu {
		width : 100vw;
		left : -100vw;
	}
		.menu:target {
		transform : translateX(100vw);
	}
}
.search {
background : #1F1F1F;
width : 100%;
padding : 10px;
display : flex;
}
.search-input {
width : calc(100% - 36px) !important ;
height : 36px;
padding : 0 10px !important ;
background : #444444 !important ;
border : none !important ;
border-radius : 5px 0 0 5px !important ;
color : var(--gris-clair);
outline : none;
}
.search-input::-webkit-input-placeholder {
color : var(--gris-clair);
}
.search-input::-moz-placeholder {
color : var(--gris-clair);
}
.search-input:-ms-input-placeholder {
color : var(--gris-clair);
}
.search-input::-ms-input-placeholder {
color : var(--gris-clair);
}
.search-input::placeholder {
color : var(--gris-clair);
}
.search-input:focus {
background : #FFFFFF !important ;
color : var(--gris-fonce);
}
.search-submit {
width : 36px;
height : 36px;
background : #444444;
border : none;
border-radius : 0 5px 5px 0;
color : var(--gris-clair);
cursor : pointer;
}
.search-input:focus + .search-submit {
background : #FFFFFF;
color : var(--gris-fonce);
}
.menu-link {
position : relative;
background-color : #1F1F1F;
display : block;
/* padding : 12px 15px; */
padding : 7px 10px;
border-left : 3px solid transparent;
font-size : 14px;
line-height : 20px;
color : var(--gris-clair);
text-decoration : none;
transition : background-color 0.2s;
}

.menu-link > .material-icons {
font-size : 18px;
display : inline-block;
margin-top : -5px;
margin-right : 5px;
}
.menu-link:hover {
background : var(--gris-fonce);
border-left-color : #00878F;
}
.menu-submenu > .menu-link {
background-color : #EEEEEE;
color : var(--gris-fonce);
transition : background-color 0.2s, color 0.2s;
}
.menu-submenu > .menu-link:hover {
background-color : #444444;
color : var(--gris-clair);
}
.menu-submenu-indicator {
display : inline-block;
position : absolute;
right : 0;
padding : 0;
}
.menu-submenu {
display : block;
}
.menu-submenu.active, .menu-link:hover + .menu-submenu, .menu-submenu:hover {
display : block;
}
.menu-active {
color : var(--blanc);
/*
background : #262626;
border-left-color : #1ABB9C;
*/
background : var(--vert-fonce);
border-left-color : #1ABB9C;
}
.menu-close {
position : absolute;
margin-top : -51px;
padding : 0;
line-height : 51px !important ;
width : 51px;
text-align : center;
font-size : 24px !important ;
}
@media (min-width: 900px) {
.menu-close {
display : none !important ;
}
}
.container {
display : flex;
align-items : stretch;
min-height : calc(100vh - 50px);
}
.content {
padding : 5px 10px;
width : calc(100% - 230px);
}
@media (max-width: 900px) {
.content {
width : 100%;
position : absolute;
transition : transform 0.5s;
}
.menu:target ~ .content {
transform : translateX(50vw);
}
}
@media (max-width: 500px) {
.menu:target ~ .content {
transform : translateX(100vw);
}
}
.content-title {
margin : 7px 0;
font-size : 25px;
font-weight : normal;
}
.content-title > .material-icons {
margin-top : -5px;
margin-right : 5px;
}
.alert-success, .alert-info, .alert-primary, .alert-warning, .alert-danger {
padding : 15px;
border-radius : 10px;
margin : 5px 0;
color : var(--blanc);
text-shadow : 0 0 10px rgb(0, 0, 0, 0.3);
}
.alert-dismiss:checked + .alert-success, .alert-dismiss:checked + .alert-info, .alert-dismiss:checked + .alert-primary, .alert-dismiss:checked + .alert-warning, .alert-dismiss:checked + .alert-danger {
display : none;
}
.alert-success {
background-color : #28D278;
}
.alert-info {
background-color : #5AB9f0;
}
.alert-primary {
background-color : #1E87CD;
}
.alert-warning {
background-color : #FAAF0A;
}
.alert-danger {
background-color : #FF5055;
}
.alert-dismiss {
display : none !important ;
}
.badge-default, .badge-success, .badge-info, .badge-primary, .badge-warning, .badge-danger {
padding : 0 10px;
display : inline-block;
margin : 2px;
color : var(--blanc);
text-shadow : 0 0 10px rgb(0, 0, 0, 0.3);
border-radius : 10px;
line-height : 20px;
font-size : 11px;
box-shadow : -1px -1px 0 rgb(0, 0, 0, 0.2) inset, 1px 1px 1px rgb(0, 0, 0, 0.2);
white-space : nowrap;
}
.badge-default {
background-color : #646464;
}
.badge-success {
background-color : #00A65A;
}
.badge-info {
background-color : #64AAC3;
}
.badge-primary {
background-color : #3C8DBC;
}
.badge-warning {
background-color : #F39C12;
}
.badge-danger {
background-color : #DD4B39;
}
.box {
background : #FFFFFF;
border-radius : 3px;
box-shadow : 0 0 5px #EEEEEE;
border-top : 3px solid var(--vert-fonce);
margin-bottom : 10px;
}
.box-header {
border-bottom : 1px solid var(--gris-clair);
font-size : 18px;
padding : 0 5px;
color : var(--gris-fonce);
font-weight : normal;
margin : 0;
line-height : 30px;
}
.box-header .btn-default, .box-header .btn-default, .box-header .btn-info, .box-header .btn-primary, .box-header .btn-warning, .box-header .btn-danger {
vertical-align : baseline;
}
.box-footer {
border-top : 1px solid var(--gris-clair);
padding : 5px 5px 3px 5px;
color : var(--gris-fonce);
font-weight : normal;
margin : 0;
}
.box-body {
padding : 5px 15px;
}
.btn-default, .btn-success, .btn-info, .btn-primary, .btn-warning, .btn-danger {
font-weight : normal;
position : relative;
display : inline-block;
padding : 10px 15px 8px 15px;
margin : 2px;
color : var(--blanc);
text-shadow : 0 0 10px rgb(0, 0, 0, 0.3);
font-size : 15px;
border-radius : 3px;
cursor : pointer;
transition-property : background-color, box-shadow;
transition-duration : 0.1s;
text-decoration : none;
line-height : 17px;
outline : none;
border : none;
box-shadow : -1px -1px 0 rgb(0, 0, 0, 0.2) inset, 1px 1px 1px rgb(0, 0, 0, 0.2);
vertical-align : top;
user-select : none;
}
.btn-default > .material-icons, .btn-success > .material-icons, .btn-info > .material-icons, .btn-primary > .material-icons, .btn-warning > .material-icons, .btn-danger > .material-icons {
font-size : 1.2em;
margin-top : -0.1em;
}
.btn-default:hover, .btn-default:focus, .btn-success:hover, .btn-success:focus, .btn-info:hover, .btn-info:focus, .btn-primary:hover, .btn-primary:focus, .btn-warning:hover, .btn-warning:focus, .btn-danger:hover, .btn-danger:focus {
transition-duration : 0.4s;
box-shadow : none;
}
.btn-default:active, .btn-success:active, .btn-info:active, .btn-primary:active, .btn-warning:active, .btn-danger:active {
box-shadow : 2px 2px 1px rgb(0, 0, 0, 0.2) inset;
}
.btn-default[disabled], .btn-default.disabled, .btn-success[disabled], .btn-success.disabled, .btn-info[disabled], .btn-info.disabled, .btn-primary[disabled], .btn-primary.disabled, .btn-warning[disabled], .btn-warning.disabled, .btn-danger[disabled], .btn-danger.disabled {
cursor : not-allowed;
box-shadow : none;
}
.btn-default {
color : #646464;
text-shadow : none;
border : lightgray solid 1px;
margin : 1px;
background-color : #fff;
}
.btn-default:hover, .btn-default:focus {
background-color : #f2f2f2;
}
.btn-default:active {
background-color : #d9d9d9;
}
.btn-default[disabled], .btn-default.disabled {
background-color : #e9e9e9;
}
.btn-success {
background-color : #00a65a;
}
.btn-success:hover, .btn-success:focus {
background-color : #008d4c;
}
.btn-success:active {
background-color : #005a31;
}
.btn-success[disabled], .btn-success.disabled {
background-color : #6abd97;
}
.btn-info {
background-color : #64aac3;
}
.btn-info:hover, .btn-info:focus {
background-color : #52a0bc;
}
.btn-info:active {
background-color : #3d849e;
}
.btn-info[disabled], .btn-info.disabled {
background-color : #9cbfcb;
}
.btn-primary {
background-color : #3c8dbc;
}
.btn-primary:hover, .btn-primary:focus {
background-color : #367fa9;
}
.btn-primary:active {
background-color : #296282;
}
.btn-primary[disabled], .btn-primary.disabled {
background-color : #88b0c8;
}
.btn-warning {
background-color : #f39c12;
}
.btn-warning:hover, .btn-warning:focus {
background-color : #e08e0b;
}
.btn-warning:active {
background-color : #b06f09;
}
.btn-warning[disabled], .btn-warning.disabled {
background-color : #e3b873;
}
.btn-danger {
background-color : #dd4b39;
}
.btn-danger:hover, .btn-danger:focus {
background-color : #d73925;
}
.btn-danger:active {
background-color : #ac2d1e;
}
.btn-danger[disabled], .btn-danger.disabled {
background-color : #d88f86;
}
.btn-xs {
font-size : 13px;
padding : 3px 5px 1px 5px;
box-shadow : -1px -1px 0 rgb(0, 0, 0, 0.2) inset;
}
.btn-xs:hover, .btn-xs:focus {
box-shadow : 1px 1px 0 rgb(0, 0, 0, 0.2) inset;
}
.btn-sm {
font-size : 13px;
padding : 7px 10px 5px 10px;
}
.btn-lg {
font-size : 20px;
padding : 15px 20px 13px 20px;
}
@media (pointer: fine) {
.btn-color-trigger:not(:hover):not(:focus):not(focus-within) .btn-default:not(:hover):not(:focus), .btn-color-trigger:not(:hover):not(:focus):not(focus-within) .btn-success:not(:hover):not(:focus), .btn-color-trigger:not(:hover):not(:focus):not(focus-within) .btn-info:not(:hover):not(:focus), .btn-color-trigger:not(:hover):not(:focus):not(focus-within) .btn-primary:not(:hover):not(:focus), .btn-color-trigger:not(:hover):not(:focus):not(focus-within) .btn-warning:not(:hover):not(:focus), .btn-color-trigger:not(:hover):not(:focus):not(focus-within) .btn-danger:not(:hover):not(:focus) {
background-color : transparent;
border-color : lightgray;
color : var(--default);
text-shadow : none;
}
.btn-color-trigger .btn-default, .btn-color-trigger .btn-success, .btn-color-trigger .btn-info, .btn-color-trigger .btn-primary, .btn-color-trigger .btn-warning, .btn-color-trigger .btn-danger {
font-weight : bold;
border : transparent solid 1px;
}
}
.disable-pointer {
/* 	pointer-events : none; */
	cursor: not-allowed;
	opacity: 0.5;
}
.combo-menu {
user-select : none;
pointer-events : none;
opacity : 0;
position : absolute;
background-color : #FFFFFF;
box-shadow : 2px 2px 2px rgb(0, 0, 0, 0.3);
border-radius : 5px;
border : lightgray solid 1px;
z-index : 5;
padding : 0 1px;
transition : opacity 0.3s;
}
.combo-menu::before, .combo-menu::after {
content : "";
display : block;
position : absolute;
border-top : 0 solid transparent;
border-left : 6px solid transparent;
border-right : 6px solid transparent;
border-bottom : 10px solid;
left : 10px;
}
.combo-menu::before {
bottom : 100%;
border-bottom-color : lightgray;
filter : drop-shadow(2px 0 rgb(0, 0, 0, 0.3));
}
.combo-menu::after {
bottom : calc(100% - 1px);
border-bottom-color : #FFFFFF;
}
.combo-right > .combo-menu {
right : 0;
}
.combo-right > .combo-menu::before, .combo-right > .combo-menu::after {
left : auto;
right : 10px;
}
.combo-top > .combo-menu {
bottom : calc(100% + 1px);
}
.combo-top > .combo-menu::before, .combo-top > .combo-menu::after {
transform : rotateX(180deg);
bottom : auto;
}
.combo-top > .combo-menu::before {
top : 100%;
}
.combo-top > .combo-menu::after {
top : calc(100% - 1px);
}
.combo-item {
display : block;
position : relative;
padding : 7px 15px;
margin : 3px 0;
min-width : 170px;
transition : background-color 0.2s;
cursor : pointer;
text-decoration : none;
color : var(--noir);
}
.combo-item:first-child {
margin-top : 5px;
}
.combo-item:last-child {
margin-bottom : 5px;
}
.combo-item:hover {
background-color : lightgray;
}
.combo-item::before {
content : "";
display : block;
position : absolute;
height : 1px;
background-color : lightgray;
top : -2px;
left : 5px;
right : 5px;
}
.combo-item:first-child::before {
display : none;
}
.combo {
position : relative;
display : inline-block;
}
.combo:hover > .combo-menu {
opacity : 1;
user-select : auto;
pointer-events : auto;
}
.combo-trigger:focus + .combo-menu, .combo-trigger:hover + .combo-menu, .combo-trigger:active + .combo-menu {
opacity : 1;
user-select : auto;
pointer-events : auto;
}
form {
counter-reset : invalid-fields valid-fields;
}
.input {
display : flex;
flex-direction : column;
}
.input > label {
order : -1;
}
.mark-required .input > input:required + label::after, .mark-required .input > select:required + label::after, .mark-required .input > textarea:required + label::after {
content : " *";
color : red;
font-size : 0.9em;
font-weight : bold;
}
label {
padding : 3px 0;
display : inline-block;
font-weight : bold;
color : #333;
}
label .material-icons {
font-size : 18px;
margin-top : -2px;
}
input:not([type="checkbox"]):not([type="radio"]), select, textarea {
width : 100%;
padding : 8px;
line-height : 17px;
margin-bottom : 5px;
border : lightgray solid 1px;
border-bottom-width : 2px;
outline : none;
background : white;
transition : border-bottom-color 0.5s, color 0.5s;
}
input:not([type="checkbox"]):not([type="radio"]):focus, select:focus, textarea:focus {
border-bottom-color : #00878F;
}
input:not([type="checkbox"]):not([type="radio"]):focus:invalid, select:focus:invalid, textarea:focus:invalid {
border-bottom-color : #E47128;
}
input:not([type="checkbox"]):not([type="radio"]):invalid, select:invalid, textarea:invalid {
box-shadow : none;
}
input:not([type="checkbox"]):not([type="radio"]), select {
height : 36px;
}
input[type="checkbox"], input[type="radio"] {
position : relative;
display : inline-block;
appearance : none;
width : 20px;
height : 20px;
background-color : #FFFFFF;
border : var(--vert-fonce) solid 1px;
outline : none;
margin : 5px 5px -5px 0;
}
input[type="checkbox"]::before, input[type="checkbox"]::after, input[type="radio"]::before, input[type="radio"]::after {
content : "";
display : block;
position : absolute;
background-color : #00878F;
opacity : 0;
transition : opacity 0.1s;
}
input[type="checkbox"]:checked::before, input[type="checkbox"]:checked::after, input[type="radio"]:checked::before, input[type="radio"]:checked::after {
opacity : 1;
}
label:hover > input[type="checkbox"], label:focus > input[type="checkbox"], input[type="checkbox"]:hover, input[type="checkbox"]:focus, label:hover > input[type="radio"], label:focus > input[type="radio"], input[type="radio"]:hover, input[type="radio"]:focus {
border-width : 2px;
}
input[type="checkbox"] {
position : relative;
}
input[type="checkbox"]::before {
width : 5px;
height : 2px;
transform : rotateZ(50deg);
left : 4px;
top : 10px;
}
input[type="checkbox"]::after {
width : 12px;
height : 2px;
transform : rotateZ(-55deg);
left : 5px;
top : 8px;
}
label:hover > input[type="checkbox"]::before, label:focus > input[type="checkbox"]::before, input[type="checkbox"]:hover::before, input[type="checkbox"]:focus::before {
left : 3px;
top : 9px;
}
label:hover > input[type="checkbox"]::after, label:focus > input[type="checkbox"]::after, input[type="checkbox"]:hover::after, input[type="checkbox"]:focus::after {
left : 4px;
top : 7px;
}
input[type="radio"] {
border-radius : 10px;
}
input[type="radio"]::before {
height : 10px;
width : 10px;
border-radius : 5px;
margin : 4px;
}
label:hover > input[type="radio"]::before, label:focus > input[type="radio"]::before, input[type="radio"]:hover::before, input[type="radio"]:focus::before {
margin : 3px;
}
.btn-success > input[type="file"], .btn-info > input[type="file"], .btn-primary > input[type="file"], .btn-warning > input[type="file"], .btn-danger > input[type="file"] {
padding : 0;
height : auto;
border : 0;
margin : 2px 0 0 -3px;
background-color : transparent;
pointer-events : none;
font-family : arial, sans-serif;
font-size : 13px;
}
.btn-success > input[type="file"]::-webkit-file-upload-button, .btn-info > input[type="file"]::-webkit-file-upload-button, .btn-primary > input[type="file"]::-webkit-file-upload-button, .btn-warning > input[type="file"]::-webkit-file-upload-button, .btn-danger > input[type="file"]::-webkit-file-upload-button {
width : 0;
height : 0;
padding : 0;
border : none;
}
.hidden {
display : none;
}
select {
appearance : none;
background-position : calc(100% - 10px) center;
}
.resize-h {
resize : horizontal;
}
.resize-v {
resize : vertical;
}
.no-resize {
resize : none;
}
.resize-both {
resize : both;
}
#form-valid-support-helper {
display : none;
}
.form-valid, .form-invalid {
display : none;
}
form:valid .form-valid, form:invalid .form-invalid {
display : initial;
}
.form-valid-supported {
display : none;
}
form:valid .form-valid-supported, form:invalid .form-valid-supported, form:valid ~ .form-valid-supported, form:invalid ~ .form-valid-supported, form:valid ~ * .form-valid-supported, form:invalid ~ * .form-valid-supported {
display : initial;
}
.form-valid-unsupported {
display : initial;
}
form:valid .form-valid-unsupported, form:invalid .form-valid-unsupported, form:valid ~ .form-valid-unsupported, form:invalid ~ .form-valid-unsupported, form:valid ~ * .form-valid-unsupported, form:invalid ~ * .form-valid-unsupported {
display : none;
}
input:invalid, select:invalid, textarea:invalid {
counter-increment : invalid-fields;
}
input:valid, select:valid, textarea:valid {
counter-increment : valid-fields;
}
.counter-invalid-fields::after {
content : counter(invalid-fields);
}
.counter-valid-fields::after {
content : counter(valid-fields);
}
fieldset {
border : gray solid 1px;
}
fieldset > legend {
padding : 5px;
font-size : 16px;
}
.pull-right {
float : right;
}
.no-link {
color : inherit;
text-decoration : none;
}
.no-margin {
margin : 0 !important ;
}
.margin-h-0 {
margin-top : 0;
margin-bottom : 0;
}
.margin-h-5 {
margin-top : 5px;
margin-bottom : 5px;
}
.margin-h-10 {
margin-top : 10px;
margin-bottom : 10px;
}
.margin-h-15 {
margin-top : 15px;
margin-bottom : 15px;
}
.margin-w-0 {
margin-left : 0;
margin-right : 0;
}
.margin-w-5 {
margin-left : 5px;
margin-right : 5px;
}
.margin-w-10 {
margin-left : 10px;
margin-right : 10px;
}
.margin-w-15 {
margin-left : 15px;
margin-right : 15px;
}

/*--------------------------------------------------------------
# BACKGROUNDS
--------------------------------------------------------------*/

.bg-default {
  background-color	: #00878F
}

.bg-success {
  background-color	: #00a65a
}
.bg-info {
  background-color	: #64aac3

}
.bg-primary {
  background-color	: #3c8dbc
}

.bg-warning {
  background-color	: #f39c12
}

.bg-danger {
  background-color	: #dd4b39
}


.modal {
pointer-events : none;
opacity : 0;
user-select : none;
position : fixed;
top : 60px;
background-color : white;
z-index : 15;
width : 800px;
max-height : calc(100vh - 40px);
overflow-y : auto;
left : calc(50% - 400px);
}
@media (max-width: 800px) {
.modal {
width : 90%;
left : 5%;
}
}
.modal:target {
opacity : 1;
pointer-events : auto;
user-select : auto;
transition : opacity 0.3s;
}
.modal.modal-lg {
width : 1100px;
left : calc(50% - 550px);
}
@media (max-width: 1100px) {
.modal.modal-lg {
width : 90%;
left : 5%;
}
}
.modal.modal-sm {
width : 600px;
left : calc(50% - 300px);
}
@media (max-width: 600px) {
.modal.modal-sm {
width : 90%;
left : 5%;
}
}
.modal.modal-xs {
width : 400px;
left : calc(50% - 200px);
}
@media (max-width: 200px) {
.modal.modal-xs {
width : 90%;
left : 5%;
}
}
.modal.modal-success {
border : #00a65a solid 4px;
}
.modal.modal-info {
border : #64aac3 solid 4px;
}
.modal.modal-primary {
border : #3c8dbc solid 4px;
}
.modal.modal-warning {
border : #f39c12 solid 4px;
}
.modal.modal-danger {
border : #dd4b39 solid 4px;
}
.modal-header {
padding : 10px;
margin : 0;
font-size : 20px;
font-weight : normal;
color : #374850;
border-bottom : 1px solid lightgray;
position : sticky;
top : 0;
background-color : white;
z-index : 10;
}
.modal-success > .modal-header, .modal-info > .modal-header, .modal-primary > .modal-header, .modal-warning > .modal-header, .modal-danger > .modal-header {
color : white;
border : none;
}
.modal-success > .modal-header {
background-color : #00a65a;
}
.modal-info > .modal-header {
background-color : #64aac3;
}
.modal-primary > .modal-header {
background-color : #3c8dbc;
}
.modal-warning > .modal-header {
background-color : #f39c12;
}
.modal-danger > .modal-header {
background-color : #dd4b39;
}
.modal-body {
padding : 10px;
overflow : hidden;
}
.modal-footer {
border-top : 1px solid lightgray;
padding : 20px;
position : sticky;
bottom : 0;
background-color : white;
}
.modal-close {
display : block;
opacity : 0;
pointer-events : none;
background-color : rgb(0, 0, 0, 0.3);
position : fixed;
top : 0;
right : 0;
bottom : 0;
left : 0;
z-index : 9;
}
.modal:target + .modal-close {
pointer-events : auto;
transition : opacity 0.3s;
opacity : 1;
}
.notification {
width : 370px;
box-sizing : border-box;
background-color : gray;
padding : 15px;
border-radius : 3px;
color : white;
font-family : sans-serif;
font-size : 15px;
line-height : 19px;
box-shadow : 3px 3px 5px rgb(0, 0, 0, 0.7);
position : fixed;
top : 10px;
right : 10px;
animation : notification-hide 0.5s;
animation-fill-mode : both;
}
@media (max-width: 400px) {
.notification {
width : calc(100vw - 30px);
}
}
.notification-toggle:checked + .notification {
animation : notification-show 0.5s;
animation-fill-mode : both;
}
.notification-start-hidden:checked ~ .notification {
animation : notification-hide 0.5s;
animation-delay : -0.5s;
animation-fill-mode : both;
}
.notification-success {
background-color : #00a65a;
}
.notification-info {
background-color : #64aac3;
}
.notification-primary {
background-color : #3c8dbc;
}
.notification-warning {
background-color : #f39c12;
}
.notification-danger {
background-color : #dd4b39;
}
.notification-toggle {
display : none !important ;
}
.notification-dismiss {
z-index : 5;
padding : 0;
float : right;
text-shadow : 1px 1px 1px rgb(0, 0, 0, 0.5);
font-size : 15px !important ;
cursor : pointer;
user-select : none;
color : white;
font-weight : normal;
}
.notification-icon {
float : left;
margin : 5px;
margin-right : 10px;
position : relative;
line-height : 36px;
width : 36px;
text-align : center;
text-shadow : 1px 1px 1px rgb(0, 0, 0, 0.5);
user-select : none;
}
.notification-title {
pointer-events : none;
font-weight : bold;
margin-bottom : 3px;
text-shadow : 1px 1px 1px rgb(0, 0, 0, 0.5);
}
@keyframes notification-show {
from {
transform : translateX(100%) translateX(10px);
}
to {
transform : none;
}
}
@keyframes notification-hide {
from {
transform : none;
}
to {
transform : translateX(100%) translateX(10px);
}
}
.pagination > a {
display : inline-block;
background-color : white;
padding : 2px 15px 0 15px;
line-height : 30px;
text-align : center;
text-decoration : none;
font-size : 14px;
color : #646464;
border : lightgray solid 1px;
border-right-width : 0;
transition : background-color 0.1s;
}
.pagination > a:first-child {
border-radius : 5px 0 0 5px;
}
.pagination > a:last-child {
border-radius : 0 5px 5px 0;
border-right-width : 1px;
}
.pagination > a:hover, .pagination > a:focus {
background-color : #f2f2f2;
}
.pagination > a:active {
background-color : #d9d9d9;
}
progress {
position : relative;
display : block;
width : 100%;
height : 20px;
border : none;
background-color : #f5f5f5;
border-radius : 3px;
box-shadow : 2px 2px 3px rgb(0, 0, 0, 0.5) inset;
background-image : linear-gradient(-45deg, transparent 33%, rgb(0, 0, 0, 0.1) 33%, rgb(0, 0, 0, 0.1) 66%, transparent 66%);
background-size : 35px 20px;
animation-name : animate-indeterminate;
animation-duration : 0.5s;
animation-timing-function : linear;
animation-iteration-count : infinite;
margin-bottom : 10px;
}
progress:before {
content : '';
line-height : 20px;
color : black;
text-align : center;
position : relative;
display : block;
width : 100%;
height : 20px;
border : none;
background-color : #f5f5f5;
border-radius : 3px;
box-shadow : 2px 2px 3px rgb(0, 0, 0, 0.5) inset;
background-image : linear-gradient(-45deg, transparent 33%, rgb(0, 0, 0, 0.1) 33%, rgb(0, 0, 0, 0.1) 66%, transparent 66%);
background-size : 35px 20px;
animation-name : animate-indeterminate;
animation-duration : 0.5s;
animation-timing-function : linear;
animation-iteration-count : infinite;
}
progress::-webkit-progress-bar, progress::before {
display : none;
}
progress::-ms-fill {
animation-name : none;
}
progress::-webkit-progress-bar, progress::after {
position : relative;
display : block;
width : 100%;
height : 20px;
border : none;
background-color : #f5f5f5;
border-radius : 3px;
box-shadow : 2px 2px 3px rgb(0, 0, 0, 0.5) inset;
background-image : linear-gradient(-45deg, transparent 33%, rgb(0, 0, 0, 0.1) 33%, rgb(0, 0, 0, 0.1) 66%, transparent 66%);
background-size : 35px 20px;
animation-name : animate-indeterminate;
animation-duration : 0.5s;
animation-timing-function : linear;
animation-iteration-count : infinite;
content : '';
position : absolute;
top : 0;
background-color : transparent;
box-shadow : none;
}
progress::-webkit-progress-bar {
position : relative;
display : block;
width : 100%;
height : 20px;
border : none;
background-color : #f5f5f5;
border-radius : 3px;
box-shadow : 2px 2px 3px rgb(0, 0, 0, 0.5) inset;
background-image : linear-gradient(-45deg, transparent 33%, rgb(0, 0, 0, 0.1) 33%, rgb(0, 0, 0, 0.1) 66%, transparent 66%);
background-size : 35px 20px;
animation-name : animate-indeterminate;
animation-duration : 0.5s;
animation-timing-function : linear;
animation-iteration-count : infinite;
background-image : none;
}
progress::-moz-progress-bar {
position : relative;
display : block;
width : 100%;
height : 20px;
border : none;
background-color : #f5f5f5;
border-radius : 3px;
box-shadow : 2px 2px 3px rgb(0, 0, 0, 0.5) inset;
background-size : 35px 20px;
animation-name : animate-indeterminate;
animation-duration : 0.5s;
animation-timing-function : linear;
animation-iteration-count : infinite;
}
progress[value] {
background-image : none;
color : #646464;
}
progress[value]:before {
content : attr(value) " / " attr(max);
}
progress[value]::-webkit-progress-value {
background-color : #646464;
}
progress[value]::-moz-progress-bar {
background-color : #646464;
}
progress[value]::-ms-fill {
box-shadow : 2px 2px 3px rgb(0, 0, 0, 0.5) inset;
border : none;
border-radius : 3px;
}
progress[value]::-webkit-progress-bar, progress[value]::after {
background-image : none;
}
progress[value]::-webkit-progress-value {
box-shadow : 2px 2px 3px rgb(0, 0, 0, 0.5) inset;
border-radius : 3px;
}
progress[value]::-moz-progress-bar {
background-image : none;
}
progress[value].progress-success {
color : #00a65a;
}
progress[value].progress-success::-webkit-progress-value {
background-color : #00a65a;
}
progress[value].progress-success::-moz-progress-bar {
background-color : #00a65a;
}
progress[value].progress-info {
color : #64aac3;
}
progress[value].progress-info::-webkit-progress-value {
background-color : #64aac3;
}
progress[value].progress-info::-moz-progress-bar {
background-color : #64aac3;
}
progress[value].progress-primary {
color : #3c8dbc;
}
progress[value].progress-primary::-webkit-progress-value {
background-color : #3c8dbc;
}
progress[value].progress-warning {
color : #f39c12;
}
progress[value].progress-warning::-webkit-progress-value {
background-color : #f39c12;
}
progress[value].progress-warning::-moz-progress-bar {
background-color : #f39c12;
}
progress[value].progress-danger {
color : #dd4b39;
}
progress[value].progress-danger::-webkit-progress-value {
background-color : #dd4b39;
}
progress[value].progress-danger::-moz-progress-bar {
background-color : #dd4b39;
}
@keyframes animate-indeterminate {
from {
background-position-x : 0;
}
to {
background-position-x : 35px;
}
}
input[type="range"] {
appearance : none;
width : 100%;
cursor : pointer;
outline : none;
border : none !important ;
padding : 0 !important ;
}
input[type="range"]::-webkit-slider-runnable-track {
appearance : none;
outline : none;
width : 100%;
height : 9px;
box-shadow : 2px 2px 2px rgb(0, 0, 0, 0.6) inset;
border-radius : 4.5px;
}
input[type="range"]::-webkit-slider-thumb {
appearance : none;
box-shadow : 1px 1px 2px rgb(0, 0, 0, 0.6), 1px 1px 2px rgb(0, 0, 0, 0.5) inset;
border : solid 2px;
height : 20px;
width : 20px;
border-radius : 50%;
background : whitesmoke;
cursor : pointer;
box-sizing : border-box;
margin-top : -5.5px;
transition : box-shadow 0.3s, background-color 0.2s;
outline : none;
}
input[type="range"]::-moz-range-track {
appearance : none;
outline : none;
width : 100%;
height : 9px;
box-shadow : 2px 2px 2px rgb(0, 0, 0, 0.6) inset;
border-radius : 4.5px;
}
input[type="range"]::-moz-range-thumb {
appearance : none;
box-shadow : 1px 1px 2px rgb(0, 0, 0, 0.6), 1px 1px 2px rgb(0, 0, 0, 0.5) inset;
border : solid 2px;
height : 20px;
width : 20px;
border-radius : 50%;
background : whitesmoke;
cursor : pointer;
box-sizing : border-box;
margin-top : -5.5px;
transition : box-shadow 0.3s, background-color 0.2s;
outline : none;
}
input[type="range"]:hover::-moz-range-thumb {
background-color : white;
box-shadow : 2px 2px 3px rgb(0, 0, 0, 0.7);
}
input[type="range"]::-ms-track {
width : 100%;
height : 20px;
color : transparent;
background-color : transparent;
border : none;
}
input[type="range"]::-ms-fill-lower, input[type="range"]::-ms-fill-upper {
appearance : none;
outline : none;
width : 100%;
height : 9px;
box-shadow : 2px 2px 2px rgb(0, 0, 0, 0.6) inset;
border-radius : 4.5px;
}
input[type="range"]::-ms-thumb {
appearance : none;
box-shadow : 1px 1px 2px rgb(0, 0, 0, 0.6), 1px 1px 2px rgb(0, 0, 0, 0.5) inset;
border : solid 2px;
height : 20px;
width : 20px;
border-radius : 50%;
background : whitesmoke;
cursor : pointer;
box-sizing : border-box;
margin-top : -5.5px;
transition : box-shadow 0.3s, background-color 0.2s;
outline : none;
margin-top : 3px;
}
input[type="range"]:hover::-ms-thumb {
background-color : white;
box-shadow : 2px 2px 3px rgb(0, 0, 0, 0.7);
}
input[type="range"]:hover::-webkit-slider-thumb, input[type="range"]:focus::-webkit-slider-thumb {
background-color : white;
box-shadow : 2px 2px 3px rgb(0, 0, 0, 0.7);
}
input[type="range"]:hover::-moz-range-thumb, input[type="range"]:focus::-moz-range-thumb {
background-color : white;
box-shadow : 2px 2px 3px rgb(0, 0, 0, 0.7);
}
input[type="range"]:hover::-ms-thumb, input[type="range"]:focus::-ms-thumb {
background-color : white;
box-shadow : 2px 2px 3px rgb(0, 0, 0, 0.7);
}
input[type="range"]::-webkit-slider-runnable-track {
background-color : #646464;
transition : background-color 0.3s;
}
input[type="range"]:hover::-webkit-slider-runnable-track, input[type="range"]:focus::-webkit-slider-runnable-track {
background-color : #4b4b4b;
}
input[type="range"]::-webkit-slider-thumb {
border-color : #181818;
}
input[type="range"]::-moz-range-track {
background-color : #646464;
transition : background-color 0.3s;
}
input[type="range"]:hover::-moz-range-track, input[type="range"]:focus::-moz-range-track {
background-color : #4b4b4b;
}
input[type="range"]::-moz-range-thumb {
border-color : #181818;
}
input[type="range"]::-ms-fill-lower, input[type="range"]::-ms-fill-upper {
background-color : #646464;
transition : background-color 0.3s;
}
input[type="range"]:hover::-ms-fill-lower, input[type="range"]:hover::-ms-fill-upper, input[type="range"]:focus::-ms-fill-lower, input[type="range"]:focus::-ms-fill-upper {
background-color : #4b4b4b;
}
input[type="range"]::-ms-thumb {
border-color : #181818;
}
input[type="range"].range-success::-webkit-slider-runnable-track {
background-color : #00a65a;
transition : background-color 0.3s;
}
input[type="range"].range-success:hover::-webkit-slider-runnable-track, input[type="range"].range-success:focus::-webkit-slider-runnable-track {
background-color : #00733e;
}
input[type="range"].range-success::-webkit-slider-thumb {
border-color : #000d07;
}
input[type="range"].range-success::-moz-range-track {
background-color : #00a65a;
transition : background-color 0.3s;
}
input[type="range"].range-success:hover::-moz-range-track, input[type="range"].range-success:focus::-moz-range-track {
background-color : #00733e;
}
input[type="range"].range-success::-moz-range-thumb {
border-color : #000d07;
}
input[type="range"].range-success::-ms-fill-lower, input[type="range"].range-success::-ms-fill-upper {
background-color : #00a65a;
transition : background-color 0.3s;
}
input[type="range"].range-success:hover::-ms-fill-lower, input[type="range"].range-success:hover::-ms-fill-upper, input[type="range"].range-success:focus::-ms-fill-lower, input[type="range"].range-success:focus::-ms-fill-upper {
background-color : #00733e;
}
input[type="range"].range-success::-ms-thumb {
border-color : #000d07;
}
input[type="range"].range-info::-webkit-slider-runnable-track {
background-color : #64aac3;
transition : background-color 0.3s;
}
input[type="range"].range-info:hover::-webkit-slider-runnable-track, input[type="range"].range-info:focus::-webkit-slider-runnable-track {
background-color : #4494b0;
}
input[type="range"].range-info::-webkit-slider-thumb {
border-color : #285666;
}
input[type="range"].range-info::-moz-range-track {
background-color : #64aac3;
transition : background-color 0.3s;
}
input[type="range"].range-info:hover::-moz-range-track, input[type="range"].range-info:focus::-moz-range-track {
background-color : #4494b0;
}
input[type="range"].range-info::-moz-range-thumb {
border-color : #285666;
}
input[type="range"].range-info::-ms-fill-lower, input[type="range"].range-info::-ms-fill-upper {
background-color : #64aac3;
transition : background-color 0.3s;
}
input[type="range"].range-info:hover::-ms-fill-lower, input[type="range"].range-info:hover::-ms-fill-upper, input[type="range"].range-info:focus::-ms-fill-lower, input[type="range"].range-info:focus::-ms-fill-upper {
background-color : #4494b0;
}
input[type="range"].range-info::-ms-thumb {
border-color : #285666;
}
input[type="range"].range-primary::-webkit-slider-runnable-track {
background-color : #3c8dbc;
transition : background-color 0.3s;
}
input[type="range"].range-primary:hover::-webkit-slider-runnable-track, input[type="range"].range-primary:focus::-webkit-slider-runnable-track {
background-color : #307095;
}
input[type="range"].range-primary::-webkit-slider-thumb {
border-color : #173648;
}
input[type="range"].range-primary::-moz-range-track {
background-color : #3c8dbc;
transition : background-color 0.3s;
}
input[type="range"].range-primary:hover::-moz-range-track, input[type="range"].range-primary:focus::-moz-range-track {
background-color : #307095;
}
input[type="range"].range-primary::-moz-range-thumb {
border-color : #173648;
}
input[type="range"].range-primary::-ms-fill-lower, input[type="range"].range-primary::-ms-fill-upper {
background-color : #3c8dbc;
transition : background-color 0.3s;
}
input[type="range"].range-primary:hover::-ms-fill-lower, input[type="range"].range-primary:hover::-ms-fill-upper, input[type="range"].range-primary:focus::-ms-fill-lower, input[type="range"].range-primary:focus::-ms-fill-upper {
background-color : #307095;
}
input[type="range"].range-primary::-ms-thumb {
border-color : #173648;
}
input[type="range"].range-warning::-webkit-slider-runnable-track {
background-color : #f39c12;
transition : background-color 0.3s;
}
input[type="range"].range-warning:hover::-webkit-slider-runnable-track, input[type="range"].range-warning:focus::-webkit-slider-runnable-track {
background-color : #c87f0a;
}
input[type="range"].range-warning::-webkit-slider-thumb {
border-color : #674105;
}
input[type="range"].range-warning::-moz-range-track {
background-color : #f39c12;
transition : background-color 0.3s;
}
input[type="range"].range-warning:hover::-moz-range-track, input[type="range"].range-warning:focus::-moz-range-track {
background-color : #c87f0a;
}
input[type="range"].range-warning::-moz-range-thumb {
border-color : #674105;
}
input[type="range"].range-warning::-ms-fill-lower, input[type="range"].range-warning::-ms-fill-upper {
background-color : #f39c12;
transition : background-color 0.3s;
}
input[type="range"].range-warning:hover::-ms-fill-lower, input[type="range"].range-warning:hover::-ms-fill-upper, input[type="range"].range-warning:focus::-ms-fill-lower, input[type="range"].range-warning:focus::-ms-fill-upper {
background-color : #c87f0a;
}
input[type="range"].range-warning::-ms-thumb {
border-color : #674105;
}
input[type="range"].range-danger::-webkit-slider-runnable-track {
background-color : #dd4b39;
transition : background-color 0.3s;
}
input[type="range"].range-danger:hover::-webkit-slider-runnable-track, input[type="range"].range-danger:focus::-webkit-slider-runnable-track {
background-color : #c23321;
}
input[type="range"].range-danger::-webkit-slider-thumb {
border-color : #6b1c12;
}
input[type="range"].range-danger::-moz-range-track {
background-color : #dd4b39;
transition : background-color 0.3s;
}
input[type="range"].range-danger:hover::-moz-range-track, input[type="range"].range-danger:focus::-moz-range-track {
background-color : #c23321;
}
input[type="range"].range-danger::-moz-range-thumb {
border-color : #6b1c12;
}
input[type="range"].range-danger::-ms-fill-lower, input[type="range"].range-danger::-ms-fill-upper {
background-color : #dd4b39;
transition : background-color 0.3s;
}
input[type="range"].range-danger:hover::-ms-fill-lower, input[type="range"].range-danger:hover::-ms-fill-upper, input[type="range"].range-danger:focus::-ms-fill-lower, input[type="range"].range-danger:focus::-ms-fill-upper {
background-color : #c23321;
}
input[type="range"].range-danger::-ms-thumb {
border-color : #6b1c12;
}
.selection-success::-moz-selection, .selection-success *::-moz-selection, .selection-info::-moz-selection, .selection-info *::-moz-selection, .selection-primary::-moz-selection, .selection-primary *::-moz-selection, .selection-warning::-moz-selection, .selection-warning *::-moz-selection, .selection-danger::-moz-selection, .selection-danger *::-moz-selection {
color : white;
}
.selection-success::selection, .selection-success *::selection, .selection-info::selection, .selection-info *::selection, .selection-primary::selection, .selection-primary *::selection, .selection-warning::selection, .selection-warning *::selection, .selection-danger::selection, .selection-danger *::selection {
color : white;
}
.selection-success::-moz-selection, .selection-success *::-moz-selection {
background-color : #00a65b;
}
.selection-success::selection, .selection-success *::selection {
background-color : #00a65b;
}
.selection-info::-moz-selection, .selection-info *::-moz-selection {
background-color : #64aac3;
}
.selection-info::selection, .selection-info *::selection {
background-color : #64aac3;
}
.selection-primary::-moz-selection, .selection-primary *::-moz-selection {
background-color : #3c8dbc;
}
.selection-primary::selection, .selection-primary *::selection {
background-color : #3c8dbc;
}
.selection-warning::-moz-selection, .selection-warning *::-moz-selection {
background-color : #f39c12;
}
.selection-warning::selection, .selection-warning *::selection {
background-color : #f39c12;
}
.selection-danger::-moz-selection, .selection-danger *::-moz-selection {
background-color : #dd4b39;
}
.selection-danger::selection, .selection-danger *::selection {
background-color : #dd4b39;
}
.selection-none {
user-select : none;
}
.tabs {
display : flex;
flex-wrap : wrap;
}
.tabs > input {
display : none;
}
.tab {
order : 0;
border : lightgray solid 1px;
padding : 10px;
cursor : pointer;
border-right-width : 0;
background-color : #EEEEEE;
transition : background-color 0.3s, border-bottom-color 0.3s;
}
.tab:last-of-type {
border-right-width : 1px;
}
input:checked + .tab {
border-bottom-color : #FFFFFF;
/* z-index : 1; */
z-index : 0;
cursor : default;
background-color : #FFFFFF;
}
.tab-content {
display : none;
order : 1;
border : lightgray solid 1px;
margin-top : -1px;
width : 100%;
z-index : 0;
padding : 10px;
}
input:checked + * + .tab-content {
display : block;
}
table.table, .table > table {
counter-reset : table-rows;
width : 100%;
border-collapse : collapse;
margin : 10px 0;
}
table.table th, .table > table th {
text-align : left;
}
table.table th, table.table td, .table > table th, .table > table td {
padding : 10px 15px;
}
table.table tbody > tr, .table > table tbody > tr {
counter-increment : table-rows;
}
@media (pointer: fine) {
table.table tbody > tr:hover, .table > table tbody > tr:hover {
background : #f0f0f0;
}
}
table.table td, .table > table td {
border-top : 1px solid lightgray;
}
table.table tfoot, .table > table tfoot {
border-top : 2px solid gray;
}
table.table .row-counter::after, .table > table .row-counter::after {
content : counter(table-rows);
}
div.table {
overflow-x : auto;
}
table > caption {
background-color : lightgray;
padding : 7px 10px;
margin-bottom : 5px;
text-align : left;
font-style : italic;
}
table > caption.table-caption-bottom {
caption-side : bottom;
margin-bottom : 0;
margin-top : 5px;
}
.table-condensed th, .table-condensed td {
padding : 5px 10px !important ;
}
.table-comfortable th, .table-comfortable td {
padding : 15px 20px !important ;
}
h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5 {
margin : 15px 0 5px 0;
font-weight : normal;
}
h1, .h1 {
font-size : 44px;
}
h2, .h2 {
font-size : 36px;
}
h3, .h3 {
font-size : 28px;
}
h4, .h4 {
font-size : 20px;
}
h5, .h5 {
font-size : 20px;
color : #505050;
}
p {
margin : 5px 0;
font-size : 15px;
line-height : 20px;
}
ul {
margin : 5px 0 15px 0;
font-size : 14px;
padding-left : 25px;
line-height : 17px;
}
code {
display : inline-block;
background : #505050;
color : white;
font-size : 13px;
padding : 1px 4px;
margin : 1px;
}
pre {
background-color : #505050;
padding : 5px;
overflow-x : auto;
}
hr {
margin : 30px 0 15px 0;
}
blockquote {
position : relative;
background-color : lightgray;
margin : 15px;
padding : 10px 20px;
border-left : 3px solid rgb(0, 0, 0, 0.3);
font-size : 15px;
}
blockquote > p {
text-indent : 2em;
}
blockquote > p:first-of-type::before {
content : "“";
display : block;
position : absolute;
margin-left : -10px;
font-size : 20px;
}
blockquote > p:last-of-type::after {
content : " ”";
font-size : 20px;
}
blockquote > cite {
font-size : 13px;
position : relative;
width : calc(100% + 40px);
margin : 10px -20px -10px;
padding : 10px 15px 10px 18px;
font-style : italic;
display : block;
background-color : rgb(0, 0, 0, 0.3);
color : white;
}
blockquote > cite::before {
content : "― ";
}
.quote-success {
background-color : #00a65a;
color : white;
text-shadow : 0 0 10px rgb(0, 0, 0, 0.3);
}
.quote-info {
background-color : #64aac3;
color : white;
text-shadow : 0 0 10px rgb(0, 0, 0, 0.3);
}
.quote-primary {
background-color : #3c8dbc;
color : white;
text-shadow : 0 0 10px rgb(0, 0, 0, 0.3);
}
.quote-warning {
background-color : #f39c12;
color : white;
text-shadow : 0 0 10px rgb(0, 0, 0, 0.3);
}
.quote-danger {
background-color : #dd4b39;
color : white;
text-shadow : 0 0 10px rgb(0, 0, 0, 0.3);
}
.text-muted {
color : #6e6e6e;
}
.text-success {
color : #00a65a;
}
.text-info {
color : #3c8dbc;
}
.text-primary {
color : #286e96;
}
.text-warning {
color : #f39c12;
}
.text-danger {
color : #dd4b39;
}
.text-black {
color : black;
}
.text-white {
color : white;
}
.text-left {
text-align : left;
}
.text-right {
text-align : right;
}
.text-center {
text-align : center;
}
.text-justify {
text-align : justify;
}
.text-last-left {
text-align-last : left;
}
.text-last-center {
text-align-last : center;
}
.text-last-right {
text-align-last : right;
}
.text-last-justify {
text-align-last : justify;
}
.text-underlined {
text-decoration-line : underline;
}
.text-striked {
text-decoration-line : line-through;
}
.text-overlined {
text-decoration-line : overline;
}
.text-bold {
font-weight : bold;
}
.text-italic {
font-style : italic;
}
.text-lowercase {
text-transform : lowercase;
}
.text-uppercase {
text-transform : uppercase;
}
.text-capitalize {
text-transform : capitalize;
}
.text-sup {
font-variant-position : super;
vertical-align : super;
font-size : smaller;
line-height : normal;
}
.text-sub {
font-variant-position : sub;
vertical-align : sub;
font-size : smaller;
line-height : normal;
}
.no-wrap {
white-space : nowrap;
}
.text-13 {
font-size : 13px;
}
.text-15 {
font-size : 15px;
}
.text-20 {
font-size : 20px;
}
.text-25 {
font-size : 25px;
}
.text-30 {
font-size : 30px;
}
.text-35 {
font-size : 35px;
}
.text-40 {
font-size : 40px;
}
.text-50 {
font-size : 50px;
}
.text-60 {
font-size : 60px;
}
.text-80 {
font-size : 80px;
}
.tooltip {
position : relative;
outline : none;
overflow : visible;
}
.tooltip::before, .tooltip::after {
display : block;
white-space : normal;
font-family : "system", sans-serif;
position : absolute;
opacity : 0;
transition-property : opacity;
transition-duration : 0.7s;
z-index : 10;
pointer-events : none;
left : 50%;
transform : translateX(-50%);
}
.tooltip::before {
content : "";
bottom : calc(100% - 4px);
width : 0;
height : 0;
border-top : 6px solid black;
border-left : 4px solid transparent;
border-right : 4px solid transparent;
}
.tooltip::after {
content : attr(title);
background-color : black;
color : white;
bottom : calc(100% + 2px);
padding : 3px 7px;
border-radius : 4px;
max-width : 250px;
min-width : 150px;
text-align : center;
font-size : 13px;
user-select : none;
}
.tooltip[data-tooltip]::after {
content : attr(data-tooltip);
}
.tooltip:hover::before, .tooltip:hover::after, .tooltip:focus::before, .tooltip:focus::after {
opacity : 1;
}
.tooltip-left::before, .tooltip-left::after, .tooltip-right::before, .tooltip-right::after {
top : 50%;
bottom : auto;
transform : translateY(-50%);
}
.tooltip-left.tooltip-start::before, .tooltip-right.tooltip-start::before {
top : 5px;
}
.tooltip-left.tooltip-start::after, .tooltip-right.tooltip-start::after {
top : 0;
}
.tooltip-left.tooltip-end::before, .tooltip-left.tooltip-end::after, .tooltip-right.tooltip-end::before, .tooltip-right.tooltip-end::after {
top : auto;
}
.tooltip-left.tooltip-end::before, .tooltip-right.tooltip-end::before {
bottom : 5px;
}
.tooltip-left.tooltip-end::after, .tooltip-right.tooltip-end::after {
bottom : 0;
}
.tooltip-start::before, .tooltip-start::after, .tooltip-end::before, .tooltip-end::after {
transform : none;
}
.tooltip-start::before {
left : 15px;
}
.tooltip-start::after {
left : 0;
}
.tooltip-end::before, .tooltip-end::after, .tooltip-left::before, .tooltip-left::after {
left : auto;
}
.tooltip-end::before {
right : 15px;
}
.tooltip-end::after {
right : 0;
}
.tooltip-left::before {
border-top : 4px solid transparent;
border-left : 6px solid black;
border-right : none;
border-bottom : 4px solid transparent;
right : calc(100% - 2px);
}
.tooltip-left::after {
right : calc(100% + 4px);
}
.tooltip-right::before {
border-top : 4px solid transparent;
border-left : none;
border-right : 6px solid black;
border-bottom : 4px solid transparent;
left : calc(100% - 2px);
}
.tooltip-right::after {
left : calc(100% + 4px);
}
.tooltip-bottom::before, .tooltip-bottom::after {
bottom : auto;
}
.tooltip-bottom::before {
top : calc(100% - 2px);
border-top : none;
border-bottom : 6px solid black;
}
.tooltip-bottom::after {
top : calc(100% + 4px);
}