BODY {
 margin: 120px 0;
 background-color: #222222;
 font-family: Montserrat;
 color: #ffffff;
 font-size: 1em;
 text-align: center;
}

.anchor {
 position: relative;
 top: -120px;
}

IFRAME {
 border: 0;
}

BODY.iframe {
 margin: 0;
}

H2 {
 text-shadow: 2px 2px #000;
}

DIV, TABLE, TD, INPUT {
 box-sizing: border-box;
}

PRE {
 text-align: left;
}

TH, TD {
 vertical-align: top;
}

FORM.discreet {
 margin: 0;
 display: inline;
}

INPUT, TEXTAREA {
 border: 0;
 background-color: rgba(238,238,238,0.4);
 color: #ffffff;
 padding: 10px 18px;
 font-size: 1em;
 font-family: Montserrat;
}
INPUT.neg {
 background-color: rgba(34,34,34,0.6);
}

INPUT.checkbox {
 transform: scale(2);
}
INPUT.smallCheckbox {

}

SELECT {
 background-color: #555555;
 color: #ffffff;
 font-family: Montserrat;
 border: 0;
 padding: 5px 7px;
}

A,
A:visited {
 color: #ffffff;
 text-decoration: underline;
}
A:hover,
A:active {
 color: #aaaaaa;
 text-decoration: none;
}

A.butt,
A.butt:visited,
INPUT.butt {
 width: auto;
 margin: auto 10px;
 background-color: #870000;
 /* background-color: rgba(204,0,0,1); couleur remplacee 16.01.2026 (2.2.02) initiative Seb */
 text-decoration: none;
 color: #ffffff;
 padding: 10px 18px;
 font-size: 1em;
 transition: background-color 1s;
 white-space: nowrap;
 cursor: pointer;
 border-radius: 3px;
 box-shadow: 1px 1px #000;
}
A.butt {
 line-height: 3em;
}
A.butt:hover,
A.butt:active,
INPUT.butt:hover,
INPUT.butt:active {
 background-color: #333;
 /* background-color: rgba(204,0,0,0.3); couleur remplacee 16.01.2026 (2.2.02) initiative Seb */
}

A.addButt,
A.addButt:visited {
 width: auto;
 margin: auto 10px;
 background-color: rgba(204,0,0,1);
 text-decoration: none;
 color: #ffffff;
 padding: 0px 10px;
 font-size: 2em;
 transition: background-color 1s;
}
A.addButt:hover,
A.addButt:active {
 background-color: rgba(204,0,0,0.3);
}

A#addButt,
A#addButt:visited {
 position: fixed;
 right: 50px;
 bottom: 50px;
 z-index: 2;
 font-size: 3em;
 font-weight: lighter;
 text-align: center;
 border-radius: 2em;
 background-color: rgba(204,0,0,1);
 color: #ffffff;
 text-decoration: none;
 padding: 7px 20px;
 transition-property: background-color;
 transition-duration: 1s;
 line-height: 1.1em;
}
A#addButt:hover,
A#addButt:active {
 background-color: rgba(204,0,0,0.3);
}
 
A.sortButt,
A.sortButt:visited {
 width: auto;
 background-color: transparent;
 text-decoration: none;
 color: #ffffff;
 padding: 0px 10px;
 font-size: 1em;
 transition: background-color 1s;
}
A.sortButt:hover,
A.sortButt:active {
 background-color: rgba(204,0,0,1);
}

A.sortButt-active,
A.sortButt-active:visited {
 width: auto;
 background-color: rgba(204,0,0,1);
 text-decoration: none;
 color: #ffffff;
 padding: 0px 10px;
 font-size: 1em;
 transition: background-color 1s;
}
A.sortButt-active:hover,
A.sortButt-active:active {
 background-color: rgba(204,0,0,0.3);
}

A.roundButt,
A.roundButt:visited {
 border-radius: 15px;
 background-color: rgba(204,0,0,1);
 text-decoration: none;
 color: #ffffff;
 padding: 5px 10px;
 font-size: 1em;
 transition: background-color 1s;
}
A.roundButt:hover,
A.roundButt:active {
 background-color: rgba(204,0,0,0.3);
}

.transport {
 z-index: 5;
 overflow: hidden;
 position: absolute;
 top: 100px;
 right: 10px;
 background-color: rgba(51,51,51,0.95);
 width: 440px;
}

.errorMsg {
 background-color: rgba(204,0,0,0.7);
 color: #ffffff;
 text-align: center;
 padding: 5px;
}

.successMsg {
 background-color: rgba(0,204,12,0.7);
 color: #ffffff;
 text-align: center;
 padding: 5px;
}

.errorTD {
 background-color: rgba(204,0,0,0.7);
}

#topbar {
 margin: 0;
 width: 100%;
 position: fixed;
 top: 0;
 left: 0;
 background-color: #222222;
 z-index: 9;
}
#topbar TABLE {
 width: 100%;
 border-spacing: 0;
}
#topbar TABLE TD {
 text-align: left;
}
#topbar TABLE:first-child TD:nth-child(2) {
 text-align: center;
 padding: 10px;
}
INPUT.searchField {
 width: 30vw;
 border: 1px solid #aaaaaa;
 background-color: transparent;
 padding: 5px 10px;
}
#topbar TABLE:first-child TD:last-child {
 font-size: 0.8em;
 text-align: right;
 padding-right: 25px;
 vertical-align: middle;
}
#topbar TABLE:nth-child(2) TD {
 border-right: 1px solid #cccccc;
 border-bottom: 1px solid #cccccc;
 padding: 10px 1px 10px;
 text-align: center;
 vertical-align: top;
 transition: background-color 1s;
 cursor: pointer;
}
#topbar TABLE:nth-child(2) TD:hover {
 background-color: rgba(204,0,0,0.5);
}
#topbar TABLE:nth-child(2) TD:last-child {
 border-right: 0;
}
#topbar H1 {
 margin: 0 20px;
 padding: 0;
}
#systemVersion {
 margin: -8px 25px 10px;
 font-size: 0.6em;
 color: #aaaaaa;
}

#topbar A {
 text-decoration: none;
}

A#settingsButt,
A#settingsButt:visited {
 font-size: 3em;
 margin-right: 5px;
 vertical-align: middle;
}

.active {
 border-bottom: 0 !important;
 border-top: 1px solid #cccccc;
}

#subMenu, .subMenu {
 width: 100%;
 text-align: center;
 margin: 10px 0 35px;
}
#subMenu A, .subMenu A,
#subMenu A:visited, .subMenu A:visited {
 padding: 5px 12px;
 text-decoration: none;
 border-right: 1px solid #ffffff;
 transition: background-color 1s;
}
#subMenu A:hover, .subMenu A:hover,
#subMenu A:active, .subMenu A:active {
 color: #ffffff;
 background-color: rgba(204,0,0,0.5);
}
#subMenu A:last-of-type, .subMenu A:last-of-type {
 border-right: 0;
}
#subMenu A.active, .subMenu A.active {
 border-top: 0;
 background-color: rgba(204,0,0,0.5);
}


.reduceButton {
 width: 100%;
 text-align: right;
 color: #dddddd;
 text-decoration: none;
 font-size: 2em;
 transition: color 1s;
 padding: 0 10px;
}
.reduceButton SPAN {
 float: left;
 font-size: 0.6em;
 padding-top: 0.4em;
}


.symbolMenu {
 margin: 15px auto;
}
.symbolMenu TD {
 padding: 20px;
 transition: background-color 1s;
}
.symbolMenu TD:hover {
 background-color: #ffffff;
}

TABLE.form {
 margin: 0 auto;
 border: 1px solid #dddddd;
 border-spacing: 0;
}
TABLE.form TH {
 background-color: #dddddd;
 color: #222222;
 font-size: 1.1em;
 font-variant: small-caps;
 padding: 15px;
}
TABLE.form TD {
 padding: 25px;
}
TABLE.form TD:first-child {
 text-align: left;
}

TABLE.doubleEntry {
 margin: 0 auto;
 border: 1px solid #dddddd;
 border-spacing: 5px;
}
TABLE.doubleEntry TH {
 background-color: #333333;
 font-weight: normal;
}
TABLE.doubleEntry TH,
TABLE.doubleEntry TD {
 padding: 5px 7px;
}

DIV.widget {
 border: 1px solid #dddddd;
 width: 29%;
 float: left;
 margin: 10px;
 padding: 10px;
 box-shadow: 3px 3px 5px #000000;
}

DIV.widgetFullWidth {
 border: 1px solid #dddddd;
 width: calc(100% - 20px);
 float: left;
 margin: 10px;
 padding: 10px 0;
 box-shadow: 3px 3px 5px #000000;
}

P.evidence {
 margin: 15px;
 padding: 15px;
 background-color: #555555;
}

TABLE.list {
 border-spacing: 0;
 width: auto;
 margin: 5px auto;
}
TABLE.list TH,
TABLE.list TD {
 border: 0;
 padding: 10px 25px;
 text-align: left;
}

TABLE.grid {
 margin: 5px auto;
}
TABLE.grid TD {
 padding: 3px 12px;
}
TABLE.grid TR:first-child TD {
 background-color: #555555;
}
TABLE.grid TD:first-child {
 background-color: #555555;
 text-align: left;
}
TABLE.grid TR:first-child TD:first-child {
 background: transparent;
}

IFRAME.quickSearch {
 width: 400px;
 height: 50vh;
}
INPUT.quickSearchField {
 width: 300px;
}

IFRAME.hiddenFrame {
 width: 0;
 height: 0;
}
 
TABLE.results {
 margin: 0 auto;
 width: 300px;
}
TABLE.results TD, A.result {
 background-color: rgba(238,238,238,0.4);
 padding: 3px 5px;
 border-bottom: 1px solid #222222;
} 
A.result,
A.result:visited {
 display: block;
 text-decoration: none;
}

.hoverable, .hoverableGrey {
 transition: background-color 500ms;
}
.hoverable:hover {
 background-color: #333;
 /* background-color: rgba(204,0,0,0.9); couleur remplacee 16.01.2026 (2.2.02) initiative Seb */
}
.hoverableGrey:hover {
 background-color: #333333;
}

.spoiler {
 opacity: 0;
 display: none;
 transition: opacity 1s;
}
.commentSpoiler {
 overflow: hidden;
 background-color: rgba(51,51,51,0.95);
 padding: 7px;
}

TD.icon {
 padding-left: 2px !important;
 padding-right: 2px !important;
}

.small {
 font-size: 0.8em;
}

.number {
 text-align: right !important;
}

.title {
 font-size: 1.5em;
 text-align: center !important;
}

SPAN.tag {
 margin: 0 5px;
 padding: 3px 10px;
 color: #ffffff;
 border-radius: 3px;
 white-space: nowrap;
}

TABLE.headerBox {
 border:1px solid #dddddd;
 margin:50px auto;
 border-spacing:0;
}
TABLE.headerBox TH {
 background-color:#dddddd;
 color:#222222;
 padding: 4px 9px;
}
TABLE.headerBox TD {
 padding: 5px 12px;
}

TABLE.displayParams {
 margin: 15px auto;
}
TABLE.displayParams TH,
TABLE.displayParams TD {
 padding: 7px 15px;
}

TABLE.billing {
 width: 100%;
}
TABLE.billing TD:nth-child(1) {
 text-align: left;
}
TABLE.billing TD:nth-child(2) {
 text-align: right;
}


.mediumWidth {
 width: 300px;
}
.largeWidth {
 width: 600px;
}
.showOnlyOnMobile {
 display: none;
}

DIV.graph {
 overflow: auto;
 padding: 25px;
}
DIV.graph TABLE {
 border-spacing: 0;
 outline: 1px solid #cccccc;
 padding: 20px;
}
TD.graphData {
 padding: 0;
 vertical-align: bottom;
}
TD.graphData DIV {
 border-top: 5px solid #ffcc00;
 min-width: 5px;
}
TD.graphLabel {
 padding: 0;
 vertical-align: top;
 padding-top: 10px;
 width: 15px;
 overflow: hidden;
 text-align: left;
}
TD.graphLabel SPAN {
 writing-mode: vertical-lr;
}

INPUT.read {
 border: 0;
 background: transparent;
}
INPUT.edit {
 transition: background-color, 1s;
}
INPUT.edit:hover {
 background-color: rgba(238,238,238,0.4);
}
INPUT.edit:focus {
 background-color: rgba(238,238,238,0.4);
}

TR.separ TD {
 border-bottom: 1px solid #888888;
}

DIV#contextMenu {
 display: none;
 position: fixed;
 width: 250px;
 height: 1px;
 transition: height 1s;
 background-color: #222222;
 overflow: auto;
 border: 1px solid #cccccc;
 z-index: 5;
}
DIV#contextMenu A,
DIV#contextMenu A:visited {
 display: block;
 border-top: 1px solid #aaaaaa;
 text-decoration: none;
 padding: 5px 0;
}
DIV#contextMenu A:hover,
DIV#contextMenu A:active {
 background-color: #cccccc;
}

DIV#eventSelector {
 width: 100%;
 overflow: auto;
 white-space: nowrap;
}
A.eventSelectorButt,
A.eventSelectorButt:visited {
 background-color: #555555;
 color: #ffffff;
 text-decoration: none;
 border-radius: 5px;
 padding: 5px 10px;
 line-height: 2em;
 white-space: nowrap;
}