/*------------------ font ---------------------*/
@font-face {
	font-family: 'dakota';
	src:
		url('../../resources/css/fonts/font-awesome-4.2.0/fonts/handwriting-dakota.eot');
	src:
		url('../../resources/css/fonts/font-awesome-4.2.0/fonts/handwriting-dakota.eot?#iefix')
		format('embedded-opentype'),
		url('../../resources/css/fonts/font-awesome-4.2.0/fonts/handwriting-dakota.woff')
		format('woff'),
		url('../../resources/css/fonts/font-awesome-4.2.0/fonts/handwriting-dakota.ttf')
		format('truetype'),
		url('../../resources/css/fonts/font-awesome-4.2.0/fonts/handwriting-dakota.svg')
		format('svg');
}

@font-face {
	font-family: 'gothic';
	src:
		url('../../resources/css/fonts/font-awesome-4.2.0/fonts/bradley.eot');
	src:
		url('../../resources/css/fonts/font-awesome-4.2.0/fonts/bradley.eot?#iefix')
		format('embedded-opentype'),
		url('../../resources/css/fonts/font-awesome-4.2.0/fonts/bradley.woff')
		format('woff'),
		url('../../resources/css/fonts/font-awesome-4.2.0/fonts/bradley.ttf')
		format('truetype'),
		url('../../resources/css/fonts/font-awesome-4.2.0/fonts/bradley.svg')
		format('svg');
}

@font-face {
	font-family: gothic;
	src: url(../../resources/css/fonts/font-awesome-4.2.0/fonts/gothic.woff);
}

/*------------------ reset ---------------------*/
html, body {
	margin: 0;
	padding: 0;
	font-family: 'gothic';
	min-height: 100%;
	width: 100%;
	background: -webkit-gradient(top left, white, #1A3755);
	background: -webkit-linear-gradient(top left, white, #1A3755);
	background: -moz-linear-gradient(top left, white, #1A3755);
	background: -o-linear-gradient(top left, white, #1A3755);
	background: -ms-linear-gradient(top left, white, #1A3755);
	background: linear-gradient(top left, white, #1A3755);
	background-repeat: no
}

::-webkit-input-placeholder   {
    color: gray !important;
}

:-ms-input-placeholder {
    color: gray !important;	
}

::-moz-placeholder {
    color: gray !important;		
}

:-moz-placeholder {
    color: gray !important;	
}

/*------------------ style de la page de login -----------------------------------*/

/*---------------     Titre    --------------*/
h1 {
	text-align: center;
	margin: auto;
	padding-top: 10vw;
	color: red;
	font-family: 'dakota';
	font-size: 5vw;
}

.login-title {
	letter-spacing: -50px;
}

.login-title span:nth-of-type(2) {
	font-family: 'gothic';
	color: #254061;
	letter-spacing: 2px;
}

.login-title span:nth-of-type(1), h1 span:nth-of-type(3) {
    letter-spacing: 10px;
}

a {
	text-decoration: none;
}


.login-title span:nth-of-type(2) {
	font-family: 'gothic';
	color: #254061;
	letter-spacing: 2px;
}

.login-title span:nth-of-type(1), h1 span:nth-of-type(3) {
    letter-spacing: 10px;
}


.globeTitre {
	background-image: url("../../resources/images/optemar-logo.png");
	background-repeat: no-repeat;
	background-size: cover;
	display: inline-block;
	width: 8%;
	margin: auto;
	vertical-align: middle;
	width: 6%;
    margin-top: -2%;
    background-size: contain;
    padding: 0;
}

@media screen and (max-width: 425px) {
	.login-title {
		letter-spacing: -5px;
	}
	
	.login-title span:nth-of-type(1), h1 span:nth-of-type(3) {
	    letter-spacing: 5px;
	}

}

.globeTitre {
	background-image: url("../../resources/images/optemar-logo.png");
	background-repeat: no-repeat;
	background-size: cover;
	display: inline-block;
	width: 8%;
	margin: auto;
	vertical-align: middle;
	width: 6%;
    margin-top: -2%;
    background-size: contain;
    padding: 0;
}

.globeTitre::before {
	content: "";
	display: block;
	padding-top: 100%;
}

.globeTitre1 {
	background-image: url("../../resources/images/optemar-logo.png");
	background-repeat: no-repeat;
	background-size: cover;
	display: inline-block;
	width: 16%;
	margin: auto;
	vertical-align: middle;
	width: 4vw;
    margin-top: -2.5vw;
    background-size: contain;
    padding: 0;
}

.globeTitre1::before {
	content: "";
	display: block;
	padding-top: 100%;
}




/*---------------     formulaire     --------------*/
.loginpage form {
	padding-top: 6vw;
	text-align: center;
	margin: auto;
	height: 30%;
}

.loginpage>form input[type=text],.loginpage>form input[type=password] {
	vertical-align: middle;
    margin: auto;
    display: inline-block;
    font-family: 'gothic';
    width: 20%;
    min-height: 2.5vw;
    height: 2.5vw;
    text-align: center;
    line-height: 2.5vw;
    margin-left: 5vw;
    font-size: 1.2vw;
}


input[type="checkbox"] {
    -ms-transform: scale(3);
    -moz-transform: scale(3);
    -webkit-transform: scale(3);
    -o-transform: scale(3);
    transform: scale(3);
}

.loginpage input::-webkit-input-placeholder {
	color: white;
	font-size: 1.2vw;
}


.loginpage input[placeholder=Passwor]::-webkit-input-placeholder:after {
	color: red;
	content: "d";
	opacity: 1
}

.loginpage input[placeholder=Logi]::-webkit-input-placeholder:after {
	color: red;
	content: "n";
	opacity: 1;
}

.loginpage input[type=button] {
	vertical-align: middle;
	margin: auto;
	display: inline-block;
	font-family: 'dakota';
	font-size: 1.8vw;
	color: #444;
	width: 12%;
	height: 35%;
	border-radius: 20%;
	border: 1px solid #254061;
	background-color: #EBEBEB;
	text-align: center;
	box-shadow: -5px -5px 2px rgba(0, 0, 0, 0.5) inset, 5px 5px 2px
		rgba(255, 255, 255, 0.6) inset;
	line-height: 2.5vw;
	margin-left: 5vw;
	float: none;
	padding: 1.5vw;
}


.loginpage input[type=submit] {
	vertical-align: middle;
	margin: auto;
	display: inline-block;
	font-family: 'dakota';
	font-size: 1.8vw;
	color: #444;
	width: 12%;
	height: 35%;
	border-radius: 20%;
	border: 1px solid #254061;
	background-color: #EBEBEB;
	text-align: center;
	box-shadow: -5px -5px 2px rgba(0, 0, 0, 0.5) inset, 5px 5px 2px
		rgba(255, 255, 255, 0.6) inset;
	line-height: 2.5vw;
	margin-left: 5vw;
	float: none;
	padding: 1.5vw;
}


.toCenter {
	position: absolute;
	bottom: 2%; /*30px;*/
	left: 0;
	width: 100%;
	text-align: center;
	vertical-align: middle;
	margin: auto;
}

.optemar {
	text-align: center;
	vertical-align: middle;
	margin: auto;
	display: inline-block;
	background-image: url("../../resources/images/optemar-logo-complet.png");
	width: 15%;
	background-repeat: no-repeat;
	background-size: cover;
	margin-right: 4vw;
}

.dreyfus {
	text-align: center;
	vertical-align: middle;
	margin: auto;
	display: inline-block;
	background-image: url("../../resources/images/dreyfus.png");
	width: 15%;
	background-repeat: no-repeat;
	background-size: cover;
}

.dreyfus::before {
	content: "";
	display: block;
	padding-top: 55%
}

.optemar::before {
	content: "";
	display: block;
	padding-top: 38%;
}

/*------------------ style des messages d'alerte ------------------*/

.alertmessage {
	font-family: 'dakota';
	font-size: 1.6vw;
	color: #FDEE00;
	display: inline-flex;
	justify-content: center;
	align-items: center;
	background-color: black;
	padding-left: 1vw;
	padding-right: 1vw;
	border: 1px solid yellow;
	height: 4vw;
}

.alertmessage img {
	padding-right: 30px;
}


/*------------------ style des rectangles et des lettres rouges  ---------------------*/
.rectangle {
	width: 50%;
	height: 50%;
	float: left;
	background-color: #7A8C9D;
	box-sizing: border-box;
	border-bottom: 2px solid #3B526B;
	text-align: center;
	vertical-align: middle;
	margin: auto;
}

#rect2 {
	background-color: #455D75;
	vertical-align: middle;
	margin: auto;
}

#rect3 {
	background-image: url("../../resources/images/boat.jpg");
	background-size: cover;
	background-position: center;
}

#rect4 {
	padding-top: 8%;
	font-family: 'dakota';
}



.redLetter {
	color: red;
	font-family: 'dakota';
}

/*------------------ style du button   ---------------------*/
#rect1 .main_button {
	vertical-align: middle;
	margin: auto;
	width: 65%;
	height: 25%;
	background-color: #D5D5D5;
	margin-top: 20%;
	border-radius: 15px;
	padding-top: 3vw;
	box-shadow: -5px -5px 2px rgba(0, 0, 0, 0.5) inset, 5px 5px 2px
		rgba(255, 255, 255, 0.6) inset;
}

#rect1 .main_button:hover {
	cursor: pointer;
	box-shadow: 5px 5px 2px rgba(0, 0, 0, 0.5) inset, -5px -5px 2px
		rgba(255, 255, 255, 0.6) inset;
}

#rect1 .main_buton:active {
	box-shadow: 5px 5px 2px rgba(0, 0, 0, 0.5) inset, -5px -5px 2px
		rgba(255, 255, 255, 0.6) inset;
}

#rect1 a {
	vertical-align: middle;
	margin: auto;
	text-decoration: none;
	font-size: 3vw;
	color: #17375E;
}

#rect1 a:active {
	color: #17375E;
}

#rect1 .globe {
	background-image: url("../../resources/images/optemar-logo.png");
	background-repeat: no-repeat;
	background-size: cover;
	width: 15%;
	display: inline-block;
	vertical-align: middle;
	margin: auto;
	margin-right: 0;
}

#rect1 .globe::before {
	content: "";
	display: block;
	padding-top: 100%;
}

/*------------------ style du rectangle haut droit   ---------------------*/
#rect2 p {
	color: white;
	vertical-align: middle;
	font-size: 3vw;
	margin: auto;
	margin-top: 22%;
}

/*------------------ style du rectangle bas droit   ---------------------*/
#rect4 p {
	color: white;
	vertical-align: middle;
	font-size: 2vw;
	margin: auto;
	line-height: 6vw;
}

#rect4 .care {
	font-size: 2.5vw;
	font-family: 'gothic';
}

/* --------------------- Style du Header -------------------  */
header {
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
	background-color: #11314F;
	box-shadow: 1px 1px 3px 3px rgba(0, 0, 0, 0.5);
	vertical-align: middle;
	font-family: 'dakota';
	color: white;
	text-align: center;
	border: 1px solid #5B92C7;
	box-sizing: border-box;
}

header .logo_opt {
	background-image: url("../../resources/images/optemar-logo.png");
	background-repeat: no-repeat;
	background-size: cover;
	display: inline-block;
	width: 5%;
	margin: auto;
	vertical-align: middle;
	float: left;
	margin-top: 2vw;
	margin-left: 30px;
}

header .logo_opt::before {
	content: "";
	display: block;
	padding-top: 100%;
}

header p {
	display: inline-block;
	font-size: 2.5vw;
	margin-left: 30px;
	margin-right: 30px;
}

header .care {
	font-family: 'gothic';
	font-size: 3vw;
}

header .previous {
	display: inline-block;
	vertical-align: middle;
	margin: auto;
	box-shadow: 0 0px 0px #ccc, 0 -1px 1px #666, inset 0 -3px 2px
		rgba(0, 0, 0, 0.5), inset 0 3px 3px rgba(255, 255, 255, 0.8);
	background-color: #87739D;
	color: black;
	font-size: 1vw;
	font-family: 'gothic';
	font-weight: bold;
	line-height: 0.9vw;
	width: 6%;
	padding-top: 5px;
	padding-bottom: 5px;
	border-radius: 10%;
	text-shadow: center;
	float: right;
	margin-top: 4vw;
	margin-right: 30px;
}

header .previous:hover {
	background-color: #BBAAD2;
	cursor: pointer;
}

header .previous1 {
	display: inline-block;
	vertical-align: middle;
	width: 5vw;
	height: 5vw;
	padding-top: 0;
	padding-bottom: 0;
	border-radius: 50%;
	text-shadow: center;
	float: right;
	margin-top: 2vw;
	margin-right: 30px;
}

header .previous1:hover {
	cursor: pointer;
}

header div .power_off {
	background-color: red;
	border-radius: 50%;
	display: inline-block;
	width: 3.3vw;
	padding: 0.5vw;
	box-shadow: 0 0px 0px #ccc, 0 -1px 1px #666, inset 0 -3px 2px
		rgba(0, 0, 0, 0.5), inset 0 3px 3px rgba(255, 255, 255, 0.8);
	float: right;
	margin-top: 3vw;
	margin-right: 30px;
}

header div .power_off:hover {
	background-color: #F05D44;
	cursor: pointer;
}

header a .fa {
	color: white;
	font-size: 3vw;
}



/* -------------------- Style des tableaux -------------------- */
.sectab {
	background: #11314F;
	max-width: 100%;
	overflow: auto;
	font-size: 1em;
	border-top: 1px solid #FFF;
	border-right: 1px solid #FFF;
}

.sectab1 {
	background: #11314F;
	max-width: 100%;
	overflow: auto;
	font-size: 1em;
	border-top: 1px solid #FFF;
	border-right: 1px solid #FFF;
}



#tablecrew {
	border-spacing: 0px;
	border-bottom:  1px solid #FFF;
}

#tablecrew th {
	border-left: 1px solid #FFF;
	border-bottom: 1px solid #FFF;
	color: #FFF;
	height: 40px;
	font-size: 1.2vw;
}

#tablecrew th:last-child {
	border-right: 1px solid #FFF;
}

#tablecrew tbody
{
	display: block;
	height: 522px;
	overflow-y: scroll;
}

#tablecrew tbody tr {
	height: 40px;
	display:table;
    width:100%;
    table-layout:fixed;
}

#tablecrew tbody td {
	border-left: 1px solid #FFF;
	border-right: 0px;
	border-bottom: 1px solid #FFF;
	font-size: 1vw;
}

#tablecrew thead {
	display:table;
	table-layout:fixed;
	width: calc( 100% - 12px );
}

#destinataires {
	margin-top: 1vw;
	display: flex;
	justify-content: space-between;
	line-height: 2vw;
	font-size: 1.2vw; 
}

#destinataires span {
	width: 22%;
}

#destinataires div {
	width: 75%;
}

#addressees {
	width: 100%;
	font-size: 1.2vw; 
	height: 2.0vw; 
	text-align-last: center; 
	border-radius: 0; 
	background-color: white;
}

#addressees option {
	font-size: 1vw;
}

#doctitle {
	box-sizing: border-box;
	width: 100%;
	height: 100%;
	font-size: 1.2vw;
	text-align: center;
	margin: auto;
}

#buttonbar {
	display: flex;
	justify-content: space-between;
	margin-top: 2vw;
}

#buttonbar input {
	width: 45%;
}

#msgicone {
	position: relative;
}

#msgicone div:nth-child(2) {
	 position: absolute;
	 z-index:1;	
}

#msgicone div:nth-child(2) {
	position: absolute;
	z-index:2;
	top:1.3vw;
	left: 2vw;
	background-color: red;
	width: 1.5vw;
	text-align: center;
	line-height: 1.5vw;
	border: 2px solid #FFF;
	border-radius: 50%;
	/* Clignotement */
	box-shadow:0px 0px 25px red;
	-webkit-animation-name: clignote; /*on affecte l'animation clignote à notre bouton*/
	-webkit-animation-duration: 1s; /*on définit la durée de l'animation à 1s*/
	-webkit-animation-iteration-count:infinite; /*on dit que l'animation se répétera à l'infini.*/	 
}

#msgicone div:nth-child(2) a {
	 font-size: 0.8vw;
	 font-weight: bold;
	 color: #FFF;
}

@-webkit-keyframes clignote {
	0%{box-shadow:0px 0px 25px red;}
	50%{box-shadow:0px 0px 0px red;}
	100%{box-shadow:0px 0px 25px red;}
}


/***** TABLE DOCUMENTS *****/

#tabledocuments {
	border-collapse: collapse;
	width: 96%;
	margin-left: 2%;
	margin-right: 2%;
	font-size: 1vw; 
}

#tabledocuments img {
	width: 35%;
}

#tabledocuments th {
	border: 1px solid #11314F;
	height: 7vh;
} 

#tabledocuments th:nth-child(1), #tabledocuments th:nth-child(7),
#tabledocuments th:nth-child(3), #tabledocuments th:nth-child(9),
#tabledocuments th:nth-child(4), #tabledocuments th:nth-child(10) {
	width: 7%;
}

#tabledocuments th:nth-child(2), #tabledocuments th:nth-child(8) {
	width: 28%;
}

#tabledocuments th:nth-child(8) {
	width: 28%;
}

#tabledocuments th:nth-child(6) {
	border-top: none;
	border-bottom: none;
}

#tabledocuments th:nth-child(5) {
	display: none;
}

#tabledocuments th:nth-child(11) {
	display: none;
}

.dochead {
	background-color: #008080;
	color: #FFF;
}

.docbody {
	background-color: lightgrey;
}

#divdefilement {
	display: inline-flex;
	justify-content: space-around;
	width: 100%;
}

#divdefilement img {
	width: 3%;
}

#divdefilement input {
	width: 3%;
}

#divdefilement input[type=image]:disabled {
	opacity: 0.3;
}



/*****  ****/

:root {
  --scrollbarWidth: '12px';
}

::-webkit-scrollbar {
	width: 12px;
	border: 1px;
	background-color: lightgrey;
}

::-webkit-scrollbar-thumb {								
	border: solid 1px #FFF;
	-webkit-border-radius: 5px;
	background-color: darkgray;
}


.table_container {
  background: #11314F;
  max-width: 100%;
  overflow: hidden;
  font-size: 1em;
  border: 1px solid #FFF;
  box-sizing: border-box;
}

.mytable_header {
	width: calc( 100% - var(--scrollbarWidth) );
	display: table;
  	table-layout: fixed;
  	color: #FFF;
	border: 0;
	/*border-left: 1px solid #FFF;*/
	border-right: 1px solid #FFF;
	box-sizing: border-box;
	border-spacing: 0;
}

.mytable_header tr th {
	height: 46px;
	box-sizing: border-box;
	border-left: 1px solid #FFF;
	border-bottom: 1px solid #FFF;
}

.mytable_body {
	width: 100%;
	display: table;
  	table-layout: fixed;
  	color: #000;
	background: #11314F;
	border: 0;
	border-bottom: 1px solid #FFF;
	border-right: 1px solid #FFF;
	box-sizing: border-box;
	border-spacing: 0;
}

.mytable_body tr td {
	height: 46px;
	box-sizing: border-box;
	border-left: 1px solid #FFF;
	border-bottom: 1px solid #FFF;
	text-align: center;
}

.mytable_body tr:nth-child(odd) td {
	background-color: #CCFFFF;
}

.mytable_body tr:nth-child(even) td {
	background-color: #CC99FF;
}

.mytable_body img {
	cursor: pointer;
}

.bodyscroll {
	height: 460px;
	overflow-y: scroll;
}



/*****  Table fleetpage.php  *****/

#tablefleet_head tr:first-child th:nth-child(1) {
  width: 28%;
}

#tablefleet_head tr:first-child th:nth-child(2),
#tablefleet_head tr:first-child th:nth-child(5) {
	width: 9%;
}

#tablefleet_head tr:first-child th:nth-child(3),
#tablefleet_head tr:first-child th:nth-child(4),
#tablefleet_head tr:first-child th:nth-child(6) {
  	width: calc((100% - 46%) / 3);
}

#tablefleet_head tr:nth-child(2) th {
  	width: calc((100% - 28%) / 10);
}

#tablefleet_body tr td:nth-child(1) {
  	width: 28%;
}

#tablefleet_body tr td:nth-child(2),
#tablefleet_body tr td:nth-child(7) {
	width: 9%;
}

#tablefleet_body tr td:nth-child(3),
#tablefleet_body tr td:nth-child(4),
#tablefleet_body tr td:nth-child(5),
#tablefleet_body tr td:nth-child(6),
#tablefleet_body tr td:nth-child(8),
#tablefleet_body tr td:nth-child(9) {
	width: calc((100% - 46%) / 6);
}


/*****  Table adminpage.php  *****/

#tablecustomer_head tr th:nth-child(1),
#tablecustomer_head tr th:nth-child(3),
#tablecustomer_body tr td:nth-child(1),
#tablecustomer_body tr td:nth-child(3) {
	width: 30%;
}

#tablecustomer_head tr th:nth-child(2),
#tablecustomer_body tr td:nth-child(2) {
	width: 20%;
}

#tablecustomer_head tr th:nth-child(5),
#tablecustomer_head tr th:nth-child(6),
#tablecustomer_body tr td:nth-child(5),
#tablecustomer_body tr td:nth-child(6) {
	display: none;
}

#tablecustomer_body img {
	width: 18%;
}


/*****  Table grouppage.php  *****/

#tablegroup_container {
	max-width: 40%;
	height: 506px;
	margin-top: 0.5em;
}

#tablegroup_body tr td {
	background-color: transparent;
}


/*****  Table crewpage.php  *****/

#tablecrew_container {
	max-width: 65%;
	height: 506px;
	font-size: 1.0vw;
}

#tablecrew_head tr th:nth-child(1),
#tablecrew_body tr td:nth-child(1) {
	width: 30%;
}

#tablecrew_head tr th:nth-child(2),
#tablecrew_body tr td:nth-child(2) {
	width: 20%;
}

#tablecrew_head tr th:nth-child(3),
#tablecrew_body tr td:nth-child(3) {
	width: 25%;
}

#tablecrew_head tr th:nth-child(5),
#tablecrew_body tr td:nth-child(5) {
	display: none;
}

#tablecrew_body tbody tr td {
	background-color: unset;
}


/*****  Table config1.php  ****/

#tableciiref_container {
	max-width: 60%;
	height: 506px;
}

#tableciiref_body tr:nth-child(odd) td {
	background-color: #D5DBDB;
}

#tableciiref_body tr:nth-child(even) td {
	background-color: #A9CCE3;
}

#tableciiref_head tr th:nth-child(1),
#tableciiref_body tr td:nth-child(1){
	width: 5%;
}

#tableciiref_head tr th:nth-child(2),
#tableciiref_body tr td:nth-child(2){
	width: 36%;
}

#tableciiref_head tr th:nth-child(3),
#tableciiref_body tr td:nth-child(3){
	width: 20%;
}

#tableciiref_head tr th:nth-child(4),
#tableciiref_body tr td:nth-child(4){
	width: 13%;
}

#tableciiref_head tr th:nth-child(5),
#tableciiref_body tr td:nth-child(5){
	width: 16%;
}

#tableciiref_head tr th:nth-child(7),
#tableciiref_body tr td:nth-child(7){
	display: none;
}

/*****  Table config2.php  ****/

#tablefueltype_container {
	max-width: 54%;
	height: 506px;
}

#tablefueltype_head thead tr:nth-child(1) th {
	font-size: 1.2vw;
}

#tablefueltype_head thead tr:nth-child(2) th {
	font-size: 0.8vw;
}

#tablefueltype_body tr:nth-child(odd) td {
	background-color: #D5DBDB;
}

#tablefueltype_body tr:nth-child(even) td {
	background-color: #A9CCE3;
}

#tablefueltype_body tr td:nth-child(1),
#tablefueltype_head thead tr:nth-child(1) th:nth-child(1){
	width: 35%;
}

#tablefueltype_body td:nth-child(2),
#tablefueltype_head thead tr:nth-child(1) th:nth-child(2){
	width: 50%;
}

#tablefueltype_body td:nth-child(3){
	border-right: 1px solid #FFF;
}

#tablefueltype_body td:nth-child(4),
#tablefueltype_body td:nth-child(5), 
#tablefueltype_head tr:nth-child(1) th:nth-child(4),
#tablefueltype_head tr:nth-child(1) th:nth-child(5),  
#tablefueltype_head tr:nth-child(2) th:nth-child(2){
	display: none;
}


/*****  Table config3.php  ****/

#tableciiredfactor_container{
	width: 20%;
}

#tableciiredfactor_head thead tr:nth-child(1) th:nth-child(2) {
	vertical-align: bottom;
	border-bottom: 0px;
}

#tableciiredfactor_head thead tr:nth-child(2) th:nth-child(1) {
	vertical-align: top;
	border-top: 0px;
}

#tableciiredfactor_body tr:nth-child(odd) td {
	background-color: #D5DBDB;
}

#tableciiredfactor_body tr:nth-child(even) td {
	background-color: #A9CCE3;
}

#tableciiredfactor_body td:nth-child(1),
#tableciiredfactor_head tr:nth-child(1) th:nth-child(1){
	width: 45%;
}

#tableciiredfactor_body td:nth-child(2),
#tableciiredfactor_head tr:nth-child(1) th:nth-child(2){
	width: 55%;
}

#tableciiredfactor_body td:nth-child(3),
#tableciiredfactor_head tr:nth-child(1) th:nth-child(3){
	display: none;
}


/*****  Table config4.php  ****/

#tableciilimit_container{
	width: 88%;
}

#tableciilimit_body tr:nth-child(odd) td {
	background-color: #D5DBDB;
}

#tableciilimit_body tr:nth-child(even) td {
	background-color: #A9CCE3;
}

#tableciilimit_body td:nth-child(1),
#tableciilimit_head th:nth-child(1){
	width: 5%;
}

#tableciilimit_body td:nth-child(2),
#tableciilimit_head th:nth-child(2){
	width: 36%;
}

#tableciilimit_body td:nth-child(4),
#tableciilimit_head th:nth-child(4),
#tableciilimit_body td:nth-child(5),
#tableciilimit_head th:nth-child(5),
#tableciilimit_body td:nth-child(6),
#tableciilimit_head th:nth-child(6),
#tableciilimit_body td:nth-child(7),
#tableciilimit_head th:nth-child(7){
	width: 8%;
}

#tableciilimit_body td:nth-child(8),
#tableciilimit_head th:nth-child(8){
	display: none;
}


/*****  Table courrieradmin.php  ****/

#tablecourrier_head th:nth-child(1),
#tablecourrier_body td:nth-child(1) {
	width: 12%;
}

#tablecourrier_head th:nth-child(2),
#tablecourrier_body td:nth-child(2) {
	width: 22%;
}

#tablecourrier_head th:nth-child(3),
#tablecourrier_body td:nth-child(3) {
	width: 52%;
}

#tablecourrier_head th:nth-child(5),
#tablecourrier_body td:nth-child(5) {
	display: none;
}

#tablecourrier_body td:nth-child(4) img{
	width: 18%; 
}

#tablecourrier_body img:hover {
	cursor: pointer;
}

#tablecourrier_body tr:nth-child(odd) td {
	background-color: #CCFFFF;
}

#tablecourrier_body tr:nth-child(even) td {
	background-color: #CC99FF;
}


/*****  Table mobeviships.php  ****/

#tableevi_container {
	width: 80%;
	height: 506px;
	font-size: 1vw;
}

#tableevi_bodyscroll {
	height: 368px;
}

#tableevi_head tr:first-child th:first-child,
#tableevi_body tr:first-child td:first-child {
	width: 24%;
}

#tableevi_head tr:first-child th:nth-child(2) {
	width: 66%;
}

#tableevi_head tr:nth-child(2) th,
#tableevi_body tr td {
	width: 11%;
}

#tableevi_head tr:first-child th:last-child,
#tableevi_body tr:first-child td:last-child {
	width: 10%;
}

#tableevi_body tr td:nth-child(3) img,
#tableevi_body tr td:nth-child(4) img,
#tableevi_body tr td:nth-child(5) img {
	width: 15%;
}

#evizoom {
	width: 25%;
}

#evizoom:hover {
	cursor: pointer;
}


/*****  Table mobshipspage.php  ****/
/*****  Table shipspage.php  ****/

#tableship_container {
	width: 50%;
	height: 506px;
	font-size: 1vw;
}

#tableship_body tr:nth-child(odd) td {
	background-color: #CCFFFF;
}

#tableship_body tr:nth-child(even) td {
	background-color: #CC99FF;
}

#tableship_head tr th:first-child,
#tableship_body tr td:first-child {
	width: 41%;
}

#tableship_head tr th:nth-child(2),
#tableship_head tr th:nth-child(4),
#tableship_body tr td:nth-child(2),
#tableship_body tr td:nth-child(4) {
	width: 19%;
}

#tableship_body tr td:nth-child(2) img,
#tableship_body tr td:nth-child(3) img{
	width: 17%;
	display: inline-flex;
	vertical-align: middle;
}

#tableship_body tr td:nth-child(4) img {
	width: 19%;
	display: inline-flex;
	vertical-align: middle;
}


/*****  Table mobconfig.php  ****/

#tablemobconfig_container {
	width: 100%;
	height: 506px;
	font-size: 1vw;
}

#tablemobconfig_head tr {
	height: 54px;
}

#tablemobconfig_body {
	color: #FFF;
}

#tablemobconfig_body img:hover {
	cursor: pointer;
}

#tablemobconfig_body td input {
	width: calc( 100% - 50px );
	height: 30px;
	text-align: center;
	font-size: 1.0vw;
}

#tablemobconfig_body input[type=date] {
	width: calc(100% - 50px);
	height: 30px;
	min-width: 80px;
}

#tablemobconfig_body select {
	width: 86%;
	background-color: white;
	border-radius: 4px;
	border: 1px solid #254061;
	font-size: 1.0vw;
	padding: 0;
	text-align: center;
	height: 36px;
}


#tablemobconfig_body input[type=radio] {
	display: none;
}


#tablemobconfig_body label:before {
  	content: "";
 	display: inline-block;
 
	width: 0.4vw;
	height: 0.4vw;
	border: 0.15vw solid #FFF;

	background-color: #FFF; 
	margin-right: 0px;
	position: relative;
	left: -0.35vw;
	  
	box-shadow: inset 0px 2px 3px 0px rgba(0, 0, 0, .3), 0px 1px 0px 0px rgba(255, 255, 255, .8);
}

#tablemobconfig_body input[type=radio]:checked + label:before {
    background-color: #000;
}

#tablemobconfig_body tbody tr#configME td {
	background-color: #4863A0;
}

#tablemobconfig_body tbody tr#configAE td {
	border-top: 1px solid #FFF;
	border-bottom: 0px;
}

#tablemobconfig_body tbody tr#configAE td {
	background-color: #848482;
}

#tablemobconfig_head tr th:nth-child(1),
#tablemobconfig_head tr th:nth-child(2),
#tablemobconfig_body tr td:nth-child(1),
#tablemobconfig_body tr td:nth-child(2) {
	width: 15%;
}

#tablemobconfig_head tr th:nth-child(3),
#tablemobconfig_body tr td:nth-child(3) {
	width: 11%;
}

#tablemobconfig_head tr th:nth-child(4),
#tablemobconfig_body tr td:nth-child(4) {
	width: 8%;
}

#tablemobconfig_head tr th:nth-child(5),
#tablemobconfig_head tr th:nth-child(6),
#tablemobconfig_head tr th:nth-child(7),
#tablemobconfig_head tr th:nth-child(10),
#tablemobconfig_body tr td:nth-child(5),
#tablemobconfig_body tr td:nth-child(6),
#tablemobconfig_body tr td:nth-child(7),
#tablemobconfig_body tr td:nth-child(10) {
	width: 6%;
}

#tablemobconfig_head tr th:nth-child(8),
#tablemobconfig_head tr th:nth-child(9),
#tablemobconfig_body tr td:nth-child(8),
#tablemobconfig_body tr td:nth-child(9) {
	width: 7%;
}

#tablemobconfig_head tr th:nth-child(12),
#tablemobconfig_body tr td:nth-child(12) {
	display: none;
}

.radioconfigME {
	font-size: 1vw;
	font-weight: bold;
	border-width: 1px;
	width: 62%;
	display: inline;
	background-color: #4863A0;
	align-items: center;
	justify-content: space-around;
}

.radioconfigAE {
	font-size: 1vw;
	font-weight: bold;
	border-width: 1px;
	width: 62%;
	display: inline;
	background-color: #848482;
	align-items: center;
}

.divmobconfig {
	width: 10%;
}

.divmobconfig input {
	width: 100%;
	margin-top: 2vh;
	font-size: 1vw; 
}


/*****  Table injconfig.php  ****/
/*****  Table pumpconfig.php  ****/
/*****  Table cylheadconfig.php  ****/
/*****  Table cyllinerconfig.php  ****/

#tablemobeltconfig_container {
	width: 88%;
	height: 550px;
	font-size: 1vw;
}

#tablemobeltconfig_container tr {
	height: 50px;
}

#tablemobeltconfig_bodyscroll{
	height: 500px;
}

#tablemobeltconfig_head tr th:nth-child(1),
#tablemobeltconfig_head tr th:nth-child(2),
#tablemobeltconfig_head tr th:nth-child(3),
#tablemobeltconfig_body tr td:nth-child(1),
#tablemobeltconfig_body tr td:nth-child(2),
#tablemobeltconfig_body tr td:nth-child(3) {
	width: 16%;
}

#tablemobeltconfig_head tr th:nth-child(4),
#tablemobeltconfig_head tr th:nth-child(5),
#tablemobeltconfig_body tr td:nth-child(4),
#tablemobeltconfig_body tr td:nth-child(5) {
	width: 10%;
}

#tablemobeltconfig_head tr th:nth-child(6),
#tablemobeltconfig_body tr td:nth-child(6) {
	width: 13%; 
	min-width: 80px;
}

#tablemobeltconfig_head tr th:nth-child(8),
#tablemobeltconfig_head tr th:nth-child(9),
#tablemobeltconfig_body tr td:nth-child(8),
#tablemobeltconfig_body tr td:nth-child(9) {
	display: none;
}

#tablemobeltconfig_body tbody tr td {
	background-color: unset;
}

#tablemobeltconfig_body tbody tr td input {
	width: calc( 100% - 50px );
	text-align: center;
	font-family: 'arial';
	font-size: 1.0vW;
	height: 30px;
}

#tablemobeltconfig_body tbody tr td select{
 	width: 86%;
	background-color: white;
	border-radius: 4px;
	border: 1px solid #254061;
	font-family: 'arial';
	font-size: 1.0vw;
	text-align: center;
	text-align-last: center;
	padding: 0;
	height: 36px;
}

#tablemobeltconfig_body tbody tr td img{
	width: 12%;
	margin-left: 5%;
	margin-right: 5%;
}

#tablemobeltconfig_body tbody tr td a#lienHisto img{
	margin-left: 0;
	margin-right: 0;
}


/*****  Table selectshippage.php  ****/

#tableselectship_container{
	width: 30%;
	margin: auto;
	font-size: 1.2vw;
}

#tableselectship_bodyscroll{
	height: 276px;
}


/*****  Table promotionpage.php  *****/

#tablepromotion_container{
	width: 40%;
}

#tablepromotion_head tr th:nth-child(1),
#tablepromotion_body tr td:nth-child(1) {
	width: 70%;
}


/*****  Table performancepage.php  *****/

#tableperformance_container{
	width: 70%;
	font-size: 1.2vw;
}

#tableperformance_head tr th:nth-child(1),
#tableperformance_body tr td:nth-child(1){
	width: 40%;
}

#tableperformance_head tr th:nth-child(2),
#tableperformance_body tr td:nth-child(2){
	width: 80%;
}

#selectedyear{
	border-radius: 0px;
	width: 60%;
	height: 40px;
	font-size: 1.2vw;
	text-align: center;
	text-align-last: center;
	padding: 0;
}

#selectedyear option{
	height: 40px;
}


/*****  Table datapage.php  *****/

#tablemaindata_container{
	overflow-x: auto;
	font-size: 0.9em;
}

#tablemaindata_head,
#tablemaindata_body,
#tablemaindata_foot{
	table-layout: auto;
	overflow-x: hidden;
}

#tablemaindata_body{
	overflow-y: scroll;
	max-height: 241px;
	display: inline-block;
	width: 100%;
	box-sizing: border-box;
}

#tablemaindata_head th{
	width: auto;
	min-width: 110px;
	height: 30px;
	word-break: break-word;
}

#tablemaindata_body tbody{
	width: 100%;
	display: table;
	box-sizing: border-box;
}

#tablemaindata_body tbody tr{
	box-sizing: border-box;
}


#tablemaindata_head tr:nth-child(5) th,
#tablemaindata_body tbody tr td{
	width: auto;
	min-width: 110px;
	height: 30px;
}

#tablemaindata_foot{
	border 1px solid #FFF;
	box-sizing: border-box;
	border-spacing: 0;
}

#tablemaindata_foot tr td{
	width: auto;
	min-width: 110px;
	height: 54px;
	box-sizing: border-box;
	border-left: 1px solid #FFF;
	border-bottom: 1px solid #FFF;
}


#tablemaindata_bodyscroll{
	height: 240px;
	overflow-x: hidden;
	display: table;
	width: 100%;
	box-sizing: border-box;
}

#tablemaindata_body td{
	border-color: #11314F;
	background-color: #FFFFCC;
}

#tablemaindata_foot td{
	border: 1px solid #FFF;
	border-left: 0;
}

#tablemaindata_foot td input{
	font-family: 'gothic';
}

#tablemaindata_foot td:last-child{
	border-right: 0;
}

#saisiedata input{
	width: 80%;
	height: 18px;
	text-align: center;
	font-size: 1em;
}


/*****  Table shipparam.php  *****/

#tableparam_container{
	max-width: 70%;
	height: 598px;
}

#tableparam_bodyscroll{
	height: 552px;
	box-sizing: border-box;
}

#tableparam_head tr th:nth-child(1),
#tableparam_head tr th:nth-child(8),
#tableparam_body tr td:nth-child(1),
#tableparam_body tr td:nth-child(8){
	width: 4%;
}

#tableparam_head tr th:nth-child(2),
#tableparam_head tr th:nth-child(3),
#tableparam_head tr th:nth-child(4),
#tableparam_body tr td:nth-child(2),
#tableparam_body tr td:nth-child(3),
#tableparam_body tr td:nth-child(4){
	width: 13%;
}

#tableparam_head tr th:nth-child(5),
#tableparam_body tr td:nth-child(5){
	width: 12%;
}

#tableparam_head tr th:nth-child(6),
#tableparam_head tr th:nth-child(7),
#tableparam_body tr td:nth-child(6),
#tableparam_body tr td:nth-child(7){
	width: 10%;
}

#tableparam_head tr th:nth-child(10),
#tableparam_body tr td:nth-child(10){
	width: 8%;
}

#tableparam_head tr th:nth-child(11),
#tableparam_head tr th:nth-child(12),
#tableparam_head tr th:nth-child(13),
#tableparam_body tr td:nth-child(11),
#tableparam_body tr td:nth-child(12),
#tableparam_body tr td:nth-child(13){
	display: none;
}


/*****  Table exportselect.php  *****/

#dataselect{
	color: #FFF;
	font-size: 1.2vw;
	width: 100%;
	border-spacing: 0px;
	height: 300px;
	display: block;
}

#dataselect tbody{
	display: block;
	height: 548px;
	overflow-y: scroll;
	font-size: 1vw;
	border-bottom: 1px solid #FFF;
}

#dataselect tr{
	width: 100%;
}

#dataselect td{
    padding-right: 10px;
    padding-left: 10px;
    height: 40px;
    background: #11314F;
    width: 20%;
    border: 1px solid #FFF;
}

#dataselect tbody td:nth-child(1), tbody td:nth-child(2){
	width:30%;
}

#dataselect input[type=checkbox]{
	-ms-transform: scale(1.5);
	-moz-transform: scale(1.5);
	-webkit-transform: scale(1.5);
	-o-transform: scale(1.5);
	transform: scale(1.5);
}

#exportselect tr td{
	border: 1px solid #FFF;
}


/*****  Table graphselect.php  *****/

#tablegraphsel_container{
	width: 70%;
}

#tablegraphsel_head thead tr:first-child th:first-child{
	font-size: calc(20px + 0.5vw);
}

#tablegraphsel_head thead tr:first-child th:nth-child(2){
	width: 140px;
}

#tablegraphsel_body{
	table-layout: fixed;
}

#tablegraphsel_body td:nth-child(1),
#tablegraphsel_body td:nth-child(2){
	width: 25%;
}

#tablegraphsel_body td:nth-child(3),
#tablegraphsel_body td:nth-child(4),
#tablegraphsel_body td:nth-child(5){
	min-width: 15%;
}

#tablegraphsel_body td:nth-child(6),
#tablegraphsel_body td:nth-child(7),
#tablegraphsel_body td:nth-child(8){
	width: 70px;
	min-width: 51px;	
}

#tablegraphsel_body td:nth-child(1),
#tablegraphsel_body td:nth-child(2),
#tablegraphsel_body td:nth-child(3),
#tablegraphsel_body td:nth-child(4),
#tablegraphsel_body td:nth-child(5){
	background-color: #11314F;
	color: #FFF;
}

#tablegraphsel_body input[type=checkbox]{
	-ms-transform: scale(1.4);
	-moz-transform: scale(1.4);
	-webkit-transform: scale(1.4);
	-o-transform: scale(1.4);
	transform: scale(1.4);
}

#graphselect{
	width: 100%;
	text-align: center;
}

#graphselect tr td{
	border: 1px solid #FFF;
}


/*****  Table mopbunkering.php  *****/

#tablebunker_head thead {
	border: 0px;
	border-bottom: 1px solid #FFF;
	display:table;
	table-layout:fixed;
	width: 100%;
}

#tablebunker_head thead tr th {
	color: #FFF;
	height: 26px;
	border: 0px;
	border-right: 1px solid #FFF;
}

#tablebunker_body tbody {
	display: block;
	height: 459px;
	min-width: 800px;
	text-align: center;
}

#tablebunker_body tbody tr {
	display:table;
    width:100%;
    table-layout:fixed;
    border: 0px;	
}

#tablebunker_body tbody tr td {
	border: 0px;
	border-right: 1px solid #FFF;
	border-top: 1px solid #FFF;
}

#tablebunker_body tbody tr:first-child td {
	border-top: 0px;
}

#tablebunker_head thead tr th:nth-child(8),
#tablebunker_body tbody tr td:nth-child(8){
	border-right: 0px;
}

#tablebunker_head thead tr th:nth-child(1),
#tablebunker_body tbody tr td:nth-child(1){
	width:12%;
}

#tablebunker_head thead tr th:nth-child(2),
#tablebunker_body tbody tr td:nth-child(2){
	width:19%;
}

#tablebunker_head thead tr th:nth-child(3),
#tablebunker_body tbody tr td:nth-child(3){
	width:17%;
}

#tablebunker_head thead tr th:nth-child(4),
#tablebunker_body tbody tr td:nth-child(4){
	width:11%;
}

#tablebunker_head thead tr th:nth-child(5),
#tablebunker_body tbody tr td:nth-child(5){
	width:12%;
}

#tablebunker_head thead tr th:nth-child(7),
#tablebunker_body tbody tr td:nth-child(7),
#tablebunker_head thead tr th:nth-child(8),
#tablebunker_body tbody tr td:nth-child(8){
	width:8%;
}

#tablebunker_head thead th:nth-child(9),
#tablebunker_body tbody td:nth-child(9),
#tablebunker_head thead th:nth-child(10),
#tablebunker_body tbody td:nth-child(10),
#tablebunker_head thead th:nth-child(11),
#tablebunker_body tbody td:nth-child(11),
#tablebunker_head thead th:nth-child(12),
#tablebunker_body tbody td:nth-child(12),
#tablebunker_head thead th:nth-child(13),
#tablebunker_body tbody td:nth-child(13),
#tablebunker_head thead th:nth-child(14),
#tablebunker_body tbody td:nth-child(14),
#tablebunker_head thead th:nth-child(15),
#tablebunker_body tbody td:nth-child(15){
	display: none;
}

#tablebunker_body tbody img {
	width: 30%;
}

#bunkerdiv {
	height: 50vh;
	min-width: 350px;
}

#bunkerdiv div {
	font-size: 1vw;
	margin-top: 0.8vh;
}

#bunkerdiv select {
	height: 3.5vh;
	border-radius: 5px;
	-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    font-size: 1vw;
    width: 60%;
}

#bunkerdiv option {
	font-size: 1vw;
}

#bunkerdiv input {
	border-radius: 5px;
	-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    font-size: 1vw;
}

#bunkerquality {
	display: none;
}

#bunkerbutton {
	 display: flex; 
	 justify-content: space-between; 
}

#bunkerbutton input {
	width: 30%;
}


/*****  Table mopshipspage.php  *****/

#tablemopships_container{
	border-spacing: 0px;
	border: 1px solid #FFF;
	background-color: #11314F;
	width: 60%;
	font-size: 1vw;
}

#tablemopships_head thead{
	border: 0px;
	border-bottom: 1px solid #FFF;
	display:table;
	table-layout:fixed;
	width: 100%;
}

#tablemopships_body tbody{
	text-align: center;
}

#tablemopships_head tbody td{
	box-sizing: border-box;
}

#tablemopships_head thead tr th:nth-child(1),
#tablemopships_body tbody tr td:nth-child(1){
	width: 40%;
}

#tablemopships_head thead tr:nth-child(1) th:nth-child(2){
	width: 32%;
}

#tablemopships_body tbody tr td:nth-child(2),
#tablemopships_body tbody tr td:nth-child(3){
	width: 16%;
}

#tablemopships_head tr th{
	color: #FFF;
	height: 34px;
	border: 0px;
	border-right: 1px solid #FFF;
	box-sizing: border-box;
}

#tablemopships_body tr td{
	border: 0px;
	border-right: 1px solid #FFF;
	box-sizing: border-box;
}

#tablemopships_head tr th:last-child,
#tablemopships_body tr td:last-child{
	border-right: 0px;
}

#tablemopships_head thead tr:nth-child(1) th:nth-child(2){
	border-bottom: 1px solid #FFF;
}

#tablemopships_head thead tr:nth-child(2) th:nth-child(1),
#tablemopships_head thead tr:nth-child(2) th:nth-child(2){
	vertical-align: bottom;
}

#tablemopships_head thead tr:nth-child(3) th:nth-child(1),
#tablemopships_head thead tr:nth-child(3) th:nth-child(2){
	vertical-align: top;
}

#tablemopships_head thead tr:nth-child(1) th:nth-child(4){
	vertical-align: bottom;
} 

#tablemopships_head thead tr:nth-child(3) th:nth-child(3){
	vertical-align: top;
}

#tablemopships_body tbody tr:nth-child(odd) td{
	background-color: #D5DBDB;
}

#tablemopships_body tbody tr:nth-child(even) td{
	background-color: #A9CCE3;
}


/*****  Table moprob.php  *****/

#tablerob_container{
	border-spacing: 0px;
	border: 1px solid #FFF;
	background-color: #11314F;
	width: 100%;
	font-size: 1vw;
	height: 506px;
}

#tablerob_head thead {
	border: 0px;
	border-bottom: 1px solid #FFF;
	display:table;
	table-layout:fixed;
	width: 100%;
}

#tablerob_body tbody{
	border: 0px;
	text-align: center;
}

#tablerob_head thead tr th,
#tablerob_body tbody tr td{
	border: 0px;
	border-right: 1px solid #FFF;
	height: 46px;
}

#tablerob_body tbody tr:first-child td {
	border-top: 0px;
}

#tablerob_head thead tr th:nth-child(6),
#tablerob_body tbody tr td:nth-child(6){
	border-right: 0px;
}

#tablerob_body tbody tr td{
	box-sizing: border-box;
	border-top: 1px solid #FFF;
}

#tablerob_head thead th:nth-child(1),
#tablerob_body tbody td:nth-child(1){
	width:12%;
}

#tablerob_head thead th:nth-child(2),
#tablerob_body tbody td:nth-child(2){
	width:19%;
}

#tablerob_head thead th:nth-child(3),
#tablerob_body tbody td:nth-child(3),
#tablerob_head thead th:nth-child(4),
#tablerob_body tbody td:nth-child(4){
	width:14%;
}

#tablerob_head thead th:nth-child(5),
#tablerob_body tbody td:nth-child(5){
	width:30%;
}

#tablerob_head thead th:nth-child(7),
#tablerob_body tbody td:nth-child(7),
#tablerob_head thead th:nth-child(8),
#tablerob_body tbody td:nth-child(8),
#tablerob_head thead th:nth-child(9),
#tablerob_body tbody td:nth-child(9),
#tablerob_head thead th:nth-child(10),
#tablerob_body tbody td:nth-child(10){
	display: none;
}

#robdiv {
	display: flex;
	justify-content: space-between;
}

#robdiv div:first-child {
	width:36%;
}

#robdiv div:nth-child(3) {
	width:56%;
}

#robdiv p {
	margin: 0;
}

#robdiv input {
	width: 100%;
	height: 4vh;
}

#roblist {
	border-top: 1px solid #FFF;
	border-left: 1px solid #FFF;
	border-radius: 5px;
	border-spacing: 0px;
	background-color: #D5DBDB;
	margin-top: 2vh;
	font-size: 0.8vw;
	width: 100%;
}

#roblist thead {
	background-color: #A9CCE3;
}

#roblist thead tr:first-child{
	font-size: 1vw;
}

#roblist thead tr:last-child th:nth-child(4),
#roblist thead tr:last-child th:nth-child(5) {
	display: none;
}

#roblist tbody tr td:nth-child(4),
#roblist tbody tr td:nth-child(5) {
	display: none;
}

#roblist th, #roblist td {
	height: 4vh;
	border: 0px;
	border-bottom: 1px solid #FFF;
	border-right: 1px solid #FFF;
}

#roblist td input {
	width: 80%;
	height: 3.6vh;
}

#roblist td input::placeholder {
	font-size: 0.8vw;
}

#roblist th:first-child {
	width: 24%;
}

#roblist th:nth-child(2) {
	width: 52%;
}


/*****  Table mopvoyage.php  *****/

#tablevoyage_container{
	height: 494px;
}

#tablevoyage_bodyscroll{
	height: 415px;
}

#tablevoyage_head thead,
#tablevoyage_body tbody{
	border: 0px;
	display:table;
	table-layout:fixed;
	width: 100%;
}

#tablevoyage_head thead tr:first-child th:nth-child(1),
#tablevoyage_head thead tr:first-child th:nth-child(3),
#tablevoyage_body tbody tr td:nth-child(1),
#tablevoyage_body tbody tr td:nth-child(3){
	width: 17%;
}

#tablevoyage_head thead tr:first-child th:nth-child(2),
#tablevoyage_head thead tr:first-child th:nth-child(4),
#tablevoyage_body tbody tr td:nth-child(2),
#tablevoyage_body tbody tr td:nth-child(4){
	width: 21%;
}

#tablevoyage_head thead tr th{
	height: 40px;
	border: 0px;
	border-right: 1px solid #FFF;
	border-bottom: 1px solid #FFF;
}

#tablevoyage_head thead tr:nth-child(2) th:nth-child(4),
#tablevoyage_head thead tr:nth-child(3) th:nth-child(6){
	border-right: 0px;
}

#tablevoyage_head thead tr:nth-child(2) th:nth-child(3),
#tablevoyage_head thead tr:nth-child(2) th:nth-child(4){
	border-bottom: 0px;
	vertical-align: bottom;
}

#tablevoyage_head thead tr:nth-child(3) th:nth-child(5),
#tablevoyage_head thead tr:nth-child(3) th:nth-child(6){
	vertical-align: top;
}

#tablevoyage_head thead tr:first-child th{
	height: 0px;
	padding: 0px;
	border: 0px;
}

#tablevoyage_head thead tr th:last-child,
#tablevoyage_body tbody tr td:last-child{
	display: none;
}

#tablevoyage_body tbody tr:nth-child(odd) td {
	background-color: #D5DBDB;
}

#tablevoyage_body tbody tr:nth-child(even) td {
	background-color: #A9CCE3;
}

#tablevoyage_body tbody tr td{
	border: 0px;
	border-bottom: 1px solid #FFF;
	border-right: 1px solid #FFF;
}

#tablevoyage_body tbody tr td:nth-child(6){
	border-right: 0px;
}

#tablevoyage_body tbody tr:last-child td{
	border-bottom: 0px;
}

.mopnrline{
	width: 60%;
	min-width: 800px;
	font-size: 1vw;
}

.mopnrline div input{
	width: 5%;
	min-width: 18px;
	height: 25px;
	margin-bottom: 2vh;
	font-size: 1vw;
}

#voyagediv {
	height: 50vh;
	min-width: 350px;
}

#voyagediv input {
	border-radius: 5px;
	-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    font-size: 1vw;
}


.voyagedivlvl1 {
	border: 1px solid lightcyan; 
	display: flex;
	margin-bottom: 5px;
	padding-top: 10px;
	padding-bottom: 10px;
}

.voyagedivlvl1>div:first-child {
	margin: auto;
	color: lightgray;
	font-size: 1vw;
	font-weight: bold;
	padding-left: 8px;
}

.voyagedivlvl1 div:nth-child(2) {
	width: 75%;
}

.voyagedivlvl1 div input {
	width: 80%;
	height: 3.5vh;
	margin-bottom: 5px;
}

#voyagebutton {
	margin-top: 2vh;
	display: flex; 
	justify-content: space-between; 
}

#voyagebutton input {
	width: 30%;
}



/******* ??? *******//

#tablevessel {
	border-spacing: 0px;
	border-bottom:  1px solid #FFF;
}

#tablevessel th {
	border-left: 1px solid #FFF;
	border-bottom: 1px solid #FFF;
	color: #FFF;
	height: 40px;
	font-size: 1.2vw;
}

#tablevessel th:nth-child(4) {
	border-right: 1px solid #FFF;
}

#tablevessel tbody
{
	display: block;
	height: 518px;
	overflow-y: scroll;
}

#tablevessel tbody tr {
	height: 40px;
	display:table;
    width:100%;
    table-layout:fixed;
}

#tablevessel tbody td {
	border-left: 1px solid #FFF;
	border-bottom: 1px solid #FFF;
	font-size: 1vw;
}

#tablevessel tbody tr:first-child {
	border-top: 1px solid #FFF;	
}

#tablevessel tbody td:last-child {
	border-right: 1px solid #FFF;
}

#tablevessel tbody td:nth-child(1), #tablevessel tbody td:nth-child(2) {
	width: 39.9%;
}

#tablevessel thead {
	display:table;
	table-layout:fixed;
	width: calc( 100% - 14px );
}

#engineselect {
	font-size: 1.2vw;
	border: 1px solid #6495ED;
	margin-top: 1vh;
	height: 5vh;
	line-height: 5vh;
	padding-left: 2vw;
	padding-right: 1vw;
	background-color: #E6E6FA;
}
 #engineselect>label {
 	margin-right: 1vw;
 }


#myChart_1 {
	width: 95%;
	height: auto;
}


.graph_1 label {
	font-size: 1.0vw;
	margin: auto;
}

.graph_1 p{
	font-size: 1.0vw;
	margin: auto;	
}

.graph_1 section {
	width: 50%;
}

.graph_1 select {
	text-align: center;
	/*text-align-last: center; */
	border-radius: 5px;
	font-weight: bold; 
	font-size: 1.0vw;
	width: 100%; 
	margin-top: 5px; 
	margin-bottom: 0px
}

.graph_1_div_period {
	border-left: solid 1px red; 
	border-right: solid 1px red; 
	margin: 10px;
} 


/***** Personnalisation input type 'file' *****/
.label-file {
    cursor: pointer;
    /*color: #00b1ca;*/
    font-weight: bold;

	text-align: center;
	margin: auto;
	font-family: 'dakota';
	color: #444;
	font-size: 1.2vw;
	font-weight: bold;
	border-radius: 10px;
	padding-top: 0.8vw;
	padding-bottom: 0.8vw;
	width: 20%;
	border: 1px solid #778A9D;
	box-shadow: -5px -5px 2px rgba(0, 0, 0, 0.5) inset, 5px 5px 2px
		rgba(255, 255, 255, 0.6) inset;
	position: relative;
	display: inline-block;
}

.label-file:hover {
  	cursor: pointer;
	box-shadow: 5px 5px 2px rgba(0, 0, 0, 0.5) inset, -5px -5px 2px
		rgba(255, 255, 255, 0.6) inset;
}

.input-file {
    display: none;
}


.radiocrewpage
{
	font-size: 1.0vw;
	border-width: 1px;
	border-color: lightgrey; 
	border-style: solid;
	border-radius: 2px;
	width: 62%;
	display: inline-flex;
	background-color: white;
	height: 1.8vw;
	align-items: center;
	justify-content: space-around;
}

.h5crewpage
{
	margin-top: 0px;
	margin-bottom: 16px;
}

.crewpage input[type=password], input[type=text] {
	margin: auto;
	font-size: 1.2vw;
	text-align: left;
	height: 1.6vw;	
}



#rect_ok {
	width: 60%;
	height: 20%;
	background-color: transparent; /*#C4FFC6;*/
}

#rect_1 {
	width: 60%;
	height: 20%;
	background-color: transparent; /*#FFD500;*/
}

#rect_notok {
	width: 60%;
	height: 20%;
	background-color: transparent; /*red;*/
}


.bar { width: 97%; border: 1px solid black; margin: auto; display: inline-flex; text-align: left;}

.percentage1 { background: #B0F2B6;}

.percentage2 { background: #FAA401; border-left: 1px solid black;}

.percentage3 { background: #EB0000; border-left: 1px solid black}


input:disabled{
	color: grey;
	opacity: 0.7;
}




/* --------------------- Style des boutons rectangulaires -------------------  */
section .wrapper {
	width: 24,8%;
	height: 100%;
	float: left;
	text-align: center;
	padding-top: 10vw;
}

.main_dashboard {
	min-height: 45vh;
	padding-bottom: 5vw;
}

.button0 {
	text-align: center;
	margin: 0;
	font-family: 'dakota';
	color: #444;
	font-size: 0.8vw;
	font-weight: bold;
	border-radius: 4px;
	padding-top: 0;
	padding-bottom: 0;
	/*width: 20%;*/
	border: 1px solid #778A9D;
	box-shadow: -5px -5px 2px rgba(0, 0, 0, 0.5) inset, 5px 5px 2px
		rgba(255, 255, 255, 0.6) inset;
	position: relative;
	display: inline-block;
}

.button0:hover {
	cursor: pointer;
	box-shadow: 5px 5px 2px rgba(0, 0, 0, 0.5) inset, -5px -5px 2px
		rgba(255, 255, 255, 0.6) inset;
}


.button1 {
	text-align: center;
	margin: auto;
	font-family: 'dakota';
	color: #444;
	font-size: 1.2vw;
	font-weight: bold;
	border-radius: 10px;
	padding-top: 0.8vw;
	padding-bottom: 0.8vw;
	width: 20%;
	border: 1px solid #778A9D;
	box-shadow: -5px -5px 2px rgba(0, 0, 0, 0.5) inset, 5px 5px 2px
		rgba(255, 255, 255, 0.6) inset;
	position: relative;
	display: inline-block;
}

.button1:hover {
	cursor: pointer;
	box-shadow: 5px 5px 2px rgba(0, 0, 0, 0.5) inset, -5px -5px 2px
		rgba(255, 255, 255, 0.6) inset;
}

.button2 {
	text-align: center;
	margin: auto;
	font-family: 'gothic';
	color: #444;
	font-size: 1.0vw;
	font-weight: bold;
	border-radius: 10px;
	padding-top: 0.8vw;
	padding-bottom: 0.8vw;
	width: 80px;
	border: 1px solid #778A9D;
	box-shadow: -5px -5px 2px rgba(0, 0, 0, 0.5) inset, 5px 5px 2px
		rgba(255, 255, 255, 0.6) inset;
	position: relative;
	display: inline-block;
}


.button3 {
	text-align: center;
	margin: auto;
	margin-bottom: 10px;
	font-family: 'dakota';
	color: #444;
	font-size: 1.4vw;
	font-weight: bold;
	border-radius: 10px;
	padding-top: 1.5vw;
	padding-bottom: 1.5vw;
	width: 20%;
	border: 1px solid #778A9D;
	box-shadow: -5px -5px 2px rgba(0, 0, 0, 0.5) inset, 5px 5px 2px
		rgba(255, 255, 255, 0.6) inset;
	position: relative;
	display: inline-block;
	background-color: lightgrey;
}

.button3:hover {
	cursor: pointer;
	background-color: silver;
	box-shadow: 5px 5px 2px rgba(0, 0, 0, 0.5) inset, -5px -5px 2px
		rgba(255, 255, 255, 0.6) inset;
}

.button3  img {
	position: absolute;
	left: 4%;
	top: 15%;
}


.button4 {
	text-align: center;
	margin: auto;
	margin-top: 5px;
	font-family: 'dakota';
	color: #444;
	font-size: 1vw;
	font-weight: bold;
	border-radius: 10px;
	padding-top: 0.5vw;
	padding-bottom: 0.5vw;
	border: 1px solid #778A9D;
	box-shadow: -5px -5px 2px rgba(0, 0, 0, 0.5) inset, 5px 5px 2px
		rgba(255, 255, 255, 0.6) inset;
	position: relative;
	display: inline-block;
	background-color: #74D0F1;
	width: 100%;
}

.button4:hover {
	cursor: pointer;
	background-color: #58ACFA;
	box-shadow: 5px 5px 2px rgba(0, 0, 0, 0.5) inset, -5px -5px 2px
		rgba(255, 255, 255, 0.6) inset;
}


.button5 {
	vertical-align: middle;
	margin: auto;
	display: inline-block;
	font-family: 'dakota';
	font-size: 1.8vw;
	color: #444;
	width: 12%;
	height: 35%;
	border-radius: 20%;
	border: 1px solid #254061;
	background-color: lightgrey;
	text-align: center;
	box-shadow: -5px -5px 2px rgba(0, 0, 0, 0.5) inset, 5px 5px 2px
		rgba(255, 255, 255, 0.6) inset;
	line-height: 2.5vw;
	margin-left: 5vw;
	float: none;
	padding: 1.5vw;	
}

.button5:hover {
	cursor: pointer;
	background-color: silver;
	box-shadow: 5px 5px 2px rgba(0, 0, 0, 0.5) inset, -5px -5px 2px
		rgba(255, 255, 255, 0.6) inset;
}

.button6 {
	text-align: center;
	margin: auto;
	margin-left: 15%;
	font-family: 'gothic';
	color: #444;
	font-size: 1.0vw;
	font-weight: bold;
	border-radius: 10px;
	padding-top: 0.8vw;
	padding-bottom: 0.8vw;
	width: 12vw;
	border: 1px solid #778A9D;
	box-shadow: -5px -5px 2px rgba(0, 0, 0, 0.5) inset, 5px 5px 2px
		rgba(255, 255, 255, 0.6) inset;
	position: relative;
	display: inline-block;
	background-color: #74D0F1;
}

.button7 {
	text-align: center;
	margin-left: 4%;
	width: 12%;
	font-family: 'gothic';
	color: #FFF;
	background-color: #79018F;
	font-size: 1.0vw;
	font-weight: bold;
	border-radius: 10px;
	padding-top: 0.8vw;
	padding-bottom: 0.8vw;
	border: 1px solid #778A9D;
	box-shadow: -5px -5px 2px rgba(0, 0, 0, 0.5) inset, 5px 5px 2px
		rgba(255, 255, 255, 0.6) inset;
	position: relative;
	display: inline-block;
}

.button7:hover {
	cursor: pointer;
}

.button_main {
	text-align: center;
	font-family: 'dakota';
	color: #444;
	font-size: 1.6vw;
	font-weight: bold;
	background-color: lightgrey;
	border-radius: 10px;
	padding-top: 1vw;
	padding-bottom: 1vw;
	padding-right: 2vw;
	padding-left: 2vw;
	/*width: 100%;*/
	border: 1px solid #778A9D;
	box-shadow: -5px -5px 2px rgba(0, 0, 0, 0.5) inset, 5px 5px 2px
		rgba(255, 255, 255, 0.6) inset;
	/*position: relative;*/
	display: inline-flex;
	margin: 10px;
}

.button_main:hover {
	cursor: pointer;
	box-shadow: 5px 5px 2px rgba(0, 0, 0, 0.5) inset, -5px -5px 2px
		rgba(255, 255, 255, 0.6) inset;
}

.button_mainYellow {
	text-align: center;
	font-family: 'dakota';
	color: #444;
	font-size: 1.6vw;
	font-weight: bold;
	background-color: yellow;
	border-radius: 10px;
	padding-top: 1vw;
	padding-bottom: 1vw;
	padding-right: 2vw;
	padding-left: 2vw;
	/*width: 100%;*/
	border: 1px solid #778A9D;
	box-shadow: -5px -5px 2px rgba(0, 0, 0, 0.5) inset, 5px 5px 2px
		rgba(255, 255, 255, 0.6) inset;
	/*position: relative;*/
	display: inline-flex;
	margin: 10px;
	width: 30%;
}

.button_mainYellow:hover {
	cursor: pointer;
	box-shadow: 5px 5px 2px rgba(0, 0, 0, 0.5) inset, -5px -5px 2px
		rgba(255, 255, 255, 0.6) inset;
}

.button_small1 {
	margin: auto;
	margin-top: 2vh;
	font-family: 'gothic';
	font-size: 1vw;
	font-weight: bold;
	padding: 0.5vw;
	width: 50%;
	background-color: lightgrey;
	border-radius: 2px;
	border: 1px solid #778A9D;
	box-shadow: -5px -5px 2px rgba(0, 0, 0, 0.5) inset, 5px 5px 2px
		rgba(255, 255, 255, 0.6) inset;
}

.button_small1:hover {
	cursor: pointer;
	box-shadow: 5px 5px 2px rgba(0, 0, 0, 0.5) inset, -5px -5px 2px
		rgba(255, 255, 255, 0.6) inset;
}


.button_small {
	text-align: center;
	margin: auto;
	font-family: 'gothic';
	color: #444;
	font-size: 0.8em;
	padding: 5px 10px;
	font-weight: bold;
	background-color: yellow;
	border-radius: 2px;
	width: 82%;
	border: 1px solid #778A9D;
	box-shadow: -5px -5px 2px rgba(0, 0, 0, 0.5) inset, 5px 5px 2px
		rgba(255, 255, 255, 0.6) inset;
	display: block;
}


.button_blue {
	background-color: #A5C0DC;
	width: 86%;
}

.button {
	text-align: center;
	margin: auto;
	font-family: 'dakota';
	color: #444;
	font-size: 1.2vw;
	font-weight: bold;
	border-radius: 10px;
	padding-top: .6vw;
	padding-bottom: .6vw;
	width: 20%;
	border: 1px solid #778A9D;
	box-shadow: -5px -5px 2px rgba(0, 0, 0, 0.5) inset, 5px 5px 2px
		rgba(255, 255, 255, 0.6) inset;
	position: relative;
	display: inline-block;

	white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
}

.button:hover {
	cursor: pointer;
	box-shadow: 5px 5px 2px rgba(0, 0, 0, 0.5) inset, -5px -5px 2px
		rgba(255, 255, 255, 0.6) inset;
}


/*-------------------------  Style du texte     ------------------------------*/
section .wrapper p {
	width: 65%;
	text-align: center;
	margin: auto;
	margin-top: 4vw;
	font-size: 1.5vw;
}

.personal {
	color: red;
}

/* --------------------- Style du footer -------------------  */
footer {
	clear: both;
	position: relative;
	margin-top: -4vw;
	bottom: 0;
	border-top: solid 2px #09229F;
	-webkit-box-shadow: inset 0 5px 6px -5px rgba(0, 0, 0, 0.6);
	-moz-box-shadow: inset 0 5px 6px -5px rgba(0, 0, 0, 0.6);
	box-shadow: inset 0 5px 6px -5px rgba(0, 0, 0, 0.6);
	height: 15%;
	min-height: 125px;
	width: 100%;
	vertical-align: middle;
	text-align: center;
}

footer .button {
	display: inline-block;
	width: 60%;
	margin-right: 3%;
	margin-top: 3vw;
	margin-top: 30px;
}

footer .button_blue {
	width: 21%;
	background-color: #A5C0DC;
}

/*
* Section interne
*/
section {
	text-align: center; 
	padding-bottom: 10vw;
}

section p {
	font-size: 2vw;
	width: 70%;
	margin: auto;
	margin-top: 4vw;
}

/*-------------------------- STYLE DES BOUTONS PARTI MESSAGE ONE TO ONE--------*/
section[class=center] {
	min-height: 45vh;
	padding-bottom: 5vw;
	text-align: center;
}

.button_center a {
	color: #444;
	text-decoration: none;
}

.main_button8weeks {
	text-align: center;
	margin: auto;
	font-family: 'dakota';
	font-size: 2.6vw;
	font-weight: bold;
	background-color: #EBEBEB;
	border-radius: 15px;
	padding-top: 1.5vw;
	padding-bottom: 1.5vw;
	width: 25%;
	border: 1px solid #778A9D;
	box-shadow: -8px -8px 3px rgba(0, 0, 0, 0.5) inset, 10px 10px 4px
		rgba(255, 255, 255, 0.6) inset;
	margin-top: 2.5vw;
}

.main_buttonsub_left {
	float: left;
	margin: auto;
	font-family: 'dakota';
	font-size: 2.6vw;
	font-weight: bold;
	background-color: #EBEBEB;
	border-radius: 15px;
	padding-top: 1.5vw;
	padding-bottom: 1.5vw;
	width: 35%;
	border: 1px solid #778A9D;
	box-shadow: -8px -8px 3px rgba(0, 0, 0, 0.5) inset, 10px 10px 4px
		rgba(255, 255, 255, 0.6) inset;
	margin-top: 2.5vw;
	margin: auto;
}

.main_buttonsub_right {
	float: right;
	margin: auto;
	font-family: 'dakota';
	font-size: 2.6vw;
	font-weight: bold;
	background-color: #EBEBEB;
	border-radius: 15px;
	padding-top: 1.5vw;
	padding-bottom: 1.5vw;
	width: 35%;
	border: 1px solid #778A9D;
	box-shadow: -8px -8px 3px rgba(0, 0, 0, 0.5) inset, 10px 10px 4px
		rgba(255, 255, 255, 0.6) inset;
	margin-top: 2.5vw;
	margin: auto;
}

.main_buttonsub_right:hover {
	cursor: pointer;
	box-shadow: 5px 5px 2px rgba(0, 0, 0, 0.5) inset, -5px -5px 2px
		rgba(255, 255, 255, 0.6) inset;
}

.main_buttonsub_left:hover {
	cursor: pointer;
	box-shadow: 5px 5px 2px rgba(0, 0, 0, 0.5) inset, -5px -5px 2px
		rgba(255, 255, 255, 0.6) inset;
}

.main_button8weeks:hover {
	cursor: pointer;
	box-shadow: 5px 5px 2px rgba(0, 0, 0, 0.5) inset, -5px -5px 2px
		rgba(255, 255, 255, 0.6) inset;
}

.main_button8weeks a {
	color: #444;
	text-decoration: none;
}

.main_button8weeks .huit {
	font-family: 'goth';
	font-size: 3.5vw
}

.main_button8weeks .redLetter {
	font-size: 3.5vw
}

.main_button8weeks .redLetter_gothic {
	font-size: 3.5vw
}

/*----------------------création de messages -------------------*/
.list_message {
	border: none;
	width: 80%;
	margin-left: auto;
	margin-right: auto;
}

.list_message th, .list_message td {
	border: 2px white solid;
	height: 50px
}

table.list_message tr:nth-child(odd) td {
	background-color: #EDF1F6;
}

table.list_message tr:nth-child(even) td {
	background-color: #D9E0ED;
}

.list_message th {
	background-color: #6095C9;
	text-align: center;
	color: #fff;
}

.formBlockMessage {
	text-align: center;
	margin-bottom: 2vw;
	overflow: hidden;
	vertical-align: center;
	display: inline-block;
	text-align: left;
	width: 70%;
	font-size: 1vw;
	margin-left: auto;
	margin-right: auto;
}

.formBlockMessage h5, .comment h5 {
	text-align: center;
	font-size: 1.5vw;
}

.formBlockMessage input {
	font-size: 1.1vw;
	display: block;
	text-align: left;
	width: 100%;
	border-radius: 10%;
	line-height: 25px;
	padding-bottom: 15px;
	display: block;
}

.formBlockMessage textarea {
	font-size: 1.1vw;
	resize: none;
	min-height: 250px;
	min-width: 180px
}

.formBlockMessage button {
	margin-left: 20px;
}
.writeMsg.formBlockMessage {
	width: 100%;
}
.formHistory {
	width: 100%;
	text-align: center;
}

.formHistory>div {
	display: inline-block;
}

.formHistory>div>span {
	width: 15%;
}

.formHistory h5, .comment h5 {
	text-align: center;
	font-size: 1.5vw;
}

.formSelectReport {
	margin-bottom: 2vw;
	overflow: hidden;
	vertical-align: center;
	display: inline-block;
	text-align: left;
	width: 70%;
	font-size: 1.2vw;
	margin-left: auto;
	margin-right: auto;
}

.formSelectReport h5, .comment h5 {
	margin-bottom: 1vw;
	text-align: left;
	font-size: 1.5vw;
}

.formSelectReport input {
	margin-top: 0.5vw;
	margin-bottom: 0.5vw;
	display: block;
	text-align: left;
	font-family: 'gothic';
}

.formSelectReport input[type="date"] {
	cursor: pointer;
}

.formSelectReport>select {
	margin-top: 0.5vw;
	margin-bottom: 0.5vw;
	display: block;
	text-align: left;
	width: 50%;
	height: 20px;
	border-radius: 0%;
	line-height: normal;
	padding-left: 1px;
	font-family: 'gothic';
}

/*------------------------table message---------------------------*/
.edit_message {
	width: 70%;
	margin-left: auto;
	margin-right: auto;
}

.edit_message th, .list_message td {
	border: 2px white solid;
	height: 50px
}

table.edit_message tr:nth-child(odd) td {
	background-color: #EDF1F6;
}

table.edit_message tr:nth-child(even) td {
	background-color: #D9E0ED;
}

.edit_message th {
	background-color: #6095C9;
	text-align: left;
	color: #fff;
}

.button_message {
	text-align: center;
	margin: auto;
	font-family: 'dakota';
	color: #444;
	font-size: 1.6vw;
	font-weight: bold;
	background-color: #EBEBEB;
	border-radius: 10px;
	padding-top: 0.7vw;
	padding-bottom: 0.7vw;
	padding-left: 0.7vw;
	padding-right: 0.7vw;
	width: 82%;
	border: 1px solid #778A9D;
	box-shadow: -5px -5px 2px rgba(0, 0, 0, 0.5) inset, 5px 5px 2px
		rgba(255, 255, 255, 0.6) inset;
}

.button_message_chat {
	background-color: yellow;
}

.button_message_sentfiles {
	background-color: #DFFEE0;
}

.button_message_receivedfiles {
	background-color: #A5C0DC;
}

.chat_message {
	display: inline-block;
}

/*-------------------------- Style du button ME--------*/
.button_purple {
	font-family: 'dakota';
	font-size: 1.5vw;
	text-align: center;
	color: black;
	/* 	display: inline-block; */
	background-color: #87739D;
	padding-top: 2.5vw;
	padding-bottom: 2.5vw;
	padding-left: 2.2vw;
	padding-right: 2.5vw;
	border-radius: 10px;
	box-shadow: -5px -5px 2px rgba(0, 0, 0, 0.5) inset, 5px 5px 2px
		rgba(255, 255, 255, 0.6) inset;
	font-weight: bold;
}

.button_purple a {
	text-decoration: none;
}

.button_purple:hover {
	cursor: pointer;
	box-shadow: 5px 5px 2px rgba(0, 0, 0, 0.5) inset, -5px -5px 2px
		rgba(255, 255, 255, 0.6) inset;
}

.button_green {
	text-align: center;
	margin-top: 10vw;
	margin-left: 0.7vw;
	font-family: 'dakota';
	color: #444;
	font-size: 1.6vw;
	font-weight: bold;
	border-radius: 10px;
	padding-top: 0.9vw;
	padding-bottom: 0.7vw;
	padding-left: 1vw;
	padding-right: 1.8vw;
	width: 82%;
	border: 1px solid #778A9D;
	box-shadow: -5px -5px 2px rgba(0, 0, 0, 0.5) inset, 5px 5px 2px
		rgba(255, 255, 255, 0.6) inset;
	padding-bottom: 1.2vw;
	background-color: #DFFEE0;
	padding: 1.5vw;
}

/* -------------- Style spécifique au bouton de cette page ------------------- */
.top_button {
	text-align: center;
	margin: auto;
}

.button_step {
	text-align: center;
	width: auto;
	display: inline-block;
	font-family: 'gothic';
	line-height: 0.3vw;
	margin: 2vw;
	padding-left: 1.2vw;
	padding-right: 1.2vw;
}

.button_step a {
	text-decoration: none;
	color: #444;
}

.button_off p {
	color: #999;
}

.button_off .redLetter {
	color: pink;
}


.boutonJaune{	
  position: absolute;
  top: 40px;
  left: 80%;
  border-radius: 50%;
  width: 1.6vw;
  height: 1.6vw;
  background-color: red;
  border: 1px solid #5b92C7;
  text-align: center;
  vertical-align: middle;
  box-shadow: 1px 1px 4px black;
  font-family: gothic;
  font-size: 1.4vw; 
}

.boutonJaune p {
  padding: auto;
  margin: -0.1vw;
 }


/* -------------- Style du formulaire ------------------- */
.formulaire>div {
	/*display: block;*/
	text-align: left;
	padding-right: 1vw;
}

.formulaire label {
	font-size: 1.2vw;
	font-weight: bold;
}

.formulaire input[type=text], input[type=password], input[type=email] {
	height: 1.6vw;
	font-size: 1.0vw;
	width: 94%;
	text-align: center;
	margin: auto;
}

.formulaire1>div {
	/*display: block;*/
	text-align: left;
	padding-right: 1vw;
}

.formulaire1 label {
	font-size: 1vw;
	font-weight: bold;
}

.formulaire1 input[type=text], input[type=password], input[type=email] {
	height: 1.8vw;
	font-size: 1.0vw;
	width: 94%;
	text-align: center;
	margin: auto;
}

.formulaire1 textarea {
	min-height: 1.8vw;
	max-height: 1.8vw;
	min-width: 100%;
	max-width: 100%;
	font-size: 1vw;
	white-space: nowrap;
	overflow: hidden;
	text-align: center;
	padding: 0;
	line-height: 1.6vw;
	vertical-align: middle;
}

#imagediv {
	border: 1px solid white;
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
	background-color: black;
	height: 100%
}


.divAction {
	margin-left: 0.7vw;
}

textarea {
	width: 100%;
	height: 200px;
	margin: 0;
	border: 1px solid #ccc;
	padding: 5px;
	vertical-align: middle;
	font-family: inherit;
	font-size: 0.9em;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	-moz-box-shadow: inset 0 0 6px #ccc;
	-webkit-box-shadow: inset 0 1px 6px #ccc;
	box-shadow: inset 0 1px 6px #ccc;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

td {
	/*border: 1px solid white;*/
}






.buttonold {
	text-align: center;
	margin-left: 0.7vw;
	font-family: 'dakota';
	color: #444;
	font-size: 1.6vw;
	font-weight: bold;
	background-color: #EBEBEB;
	border-radius: 10px;
	padding-top: 0.9vw;
	padding-bottom: 1.2vw;
	padding-left: 1vw;
	padding-right: 1.8vw;
	border: 1px solid #778A9D;
	box-shadow: -5px -5px 2px rgba(0, 0, 0, 0.5) inset, 5px 5px 2px
		rgba(255, 255, 255, 0.6) inset;
	border: 1px solid #778A9D;
	width: 82%;
	padding-right: 1.8vw;
	padding-left: 1vw;
}

.buttonLongLabel {
	text-align: center;
	margin-left: 0.5vw;
	font-family: 'dakota';
	color: #444;
	font-size: 1vw;
	font-weight: bold;
	background-color: #EBEBEB;
	border-radius: 10px;
	padding-top: 0.9vw;
	padding-bottom: 0.6vw;
	padding-left: 0.4vw;
	padding-right: 1vw;
	width: 100%;
	border: 1px solid #778A9D;
	box-shadow: -5px -5px 2px rgba(0, 0, 0, 0.5) inset, 5px 5px 2px
		rgba(255, 255, 255, 0.6) inset;
}

.button_history {
	width : 25%;
	display : inline-block;
}


.history {
	width: 100%;
	padding-right: 2.7vw;
}

.formVertical>.smallLabel {
	width: 25%;
	padding: 0.2vw;
}

.formVertical>.H5History {
	margin-top: 1vw;
	margin-bottom: 1vw;
	text-align: left;
	font-size: 1.5vw;
	margin-left: 20px;
}

.formVertical>.H5Evidence {
	margin-top: 1vw;
	margin-bottom: 1vw;
	margin-left: 0vw;
	text-align: center;
	font-size: 1.5vw;
}

.evidence {
	font-size: 1vw;
}

.formVertical>.longLabel {
	width: 50%;
	padding: 0.2vw;
}

.outputHistory {
	display: inline-block;
	background-color: #E6F7F7;
	text-align: center;
	min-width: 40%;
	min-height: 1.05vw;
	border-radius: 10%;
	border: 1px solid #778A9D;
	padding-left: 0.2vw;
	padding-right: 0.2vw;
	padding-bottom: 0.2vw;
	padding-top: 0.1vw;
	margin-top: 0.3vw;
}

.outputFactoHistory {
	min-width: 15%;
}

.titleMeasure {
	font-size: 2vw;
	text-align: left;
	padding-top: 0vw;
}

.button_reset {
	background-color: #E35757;
	font-family: 'gothic';
	padding-top: 1.2vw;
	padding-bottom: 1.2vw;
	padding-left: 2.2vw;
	padding-right: 2.5vw;
	margin-left: 0.3vw;
}

#table_action {
	margin-top: 50px;
	width: 90%;
	text-align: center;
}

#table_previous_measures {
	width: 90%;
	text-align: center;
}

#table_one {
	table-layout: fixed;
	width: 100%;
	margin-top: 1vw;
	text-align: center;
}

/*grid*/
.grid {
	max-width: 1220px;
	margin: 0 auto;
	padding: 0 2em;
}

.grid.flex {
	width: 100%;
	max-width: 100%;
	padding: 0 2%;
	padding: 2em;
}

.row {
	display: block;
	overflow: hidden;
	clear: both;
}

*[class*="col_"].alpha {
	margin-left: 0;
}

*[class*="col_"].omega {
	margin-right: 0;
}

.col_0 {
	width: 3%;
}

.col_1 {
	width: 6.6666666666667%;
}

.col_2 {
	width: 15%;
}

.col_3 {
	width: 23.333333333333%;
}

.col_3_1 {
	width: 28.333333333333%;
}

.col_4 {
	width: 31.666666666667%;
}

.col_4_1 {
	width: 36%;
}

.col_5 {
	width: 40%;
}

.col_6 {
	width: 48.333333333333%;
}

.col_7 {
	width: 56.666666666667%;
}

.col_8 {
	width: 65%;
}

.col_9 {
	width: 73.333333333333%;
}

.col_10 {
	width: 81.666666666667%;
}

.col_11 {
	width: 90%;
}

.col_12 {
	width: 98.333333333333%;
}

*[class*="col_"] {
	margin-left: 0.83333333333333%;
	margin-right: 0.83333333333333%;
	margin-top: 0.5em;
	margin-bottom: 0.5em;
	float: left;
	display: block;
}

.grid img {
	max-width: 100%;
	height: auto;
}

.clear {
	clear: both;
	display: block;
	overflow: hidden;
	visibility: hidden;
	width: 0;
	height: 0
}

.clearfix::before,
.clearfix::after {
    content: " ";
    display: table;
}

.clearfix::after {
    clear: both;
}

.clearfix {
    *zoom: 1; /* Pour les anciennes versions d'IE */
    transform: scale(1); /* Pour les autres navigateurs modernes */
    transform-origin: 0 0; /* Définir l'origine de la transformation */
}


/* Viewable Grids 
	To view your grids, add the class .visible to any grid container.
	This will add a background color so you can see the layout of your grids. 
*/
*[class*="col_"].visible {
	background: #eee;
	border: 1px dotted #ccc;
}

/*---------------------------------
	Responsive Grid Media Queries - 1280, 1024, 768, 480
	1280-1024 	- desktop (default grid)
	1024-768 	- tablet landscape
	768-480 	- tablet 
	480-less 	- phone landscape & smaller
-----------------------------------*/
@media all and (min-width: 1024px) and (max-width: 1280px) {
	.grid *[class*="col_"] {
		
	}
	.grid {
		max-width: 1024px;
	}
	.show-desktop {
		display: block;
	}
	.hide-desktop {
		display: none;
	}
	.show-tablet {
		display: none;
	}
	.hide-tablet {
		display: block;
	}
	.show-phone {
		display: none;
	}
	.hide-phone {
		display: block;
	}
}

@media all and (min-width: 768px) and (max-width: 1024px) {
	.grid *[class*="col_"] {
		
	}
	.grid {
		max-width: 768px;
	}
	.show-desktop {
		display: none;
	}
	.hide-desktop {
		display: block;
	}
	.show-tablet {
		display: block;
	}
	.hide-tablet {
		display: none;
	}
	.show-phone {
		display: none;
	}
	.hide-phone {
		display: block;
	}
}

@media all and (min-width: 480px) and (max-width: 768px) {
	.grid *[class*="col_"] {
		float: none;
		width: auto;
		clear: both;
		display: block;
	}

	/* columns inside of columns */
	.grid *[class*="col_"] [class*="col_"] {
		margin-left: 0;
		margin-right: 0;
		width: 100%;
	}
	.grid {
		max-width: 480px;
	}
	.show-desktop {
		display: none;
	}
	.hide-desktop {
		display: block;
	}
	.show-tablet {
		display: block;
	}
	.hide-tablet {
		display: none;
	}
	.show-phone {
		display: none;
	}
	.hide-phone {
		display: block;
	}
}

#everyone {
    display: inline-block;
    width: 20%;
}

@media all and (max-width: 480px) {
	.grid *[class*="col_"] {
		float: none;
		width: auto;
		clear: both;
		display: block;
	}

	/* columns inside of columns */
	.grid *[class*="col_"] [class*="col_"] {
		margin-left: 0;
		margin-right: 0;
		width: 100%;
	}
	.grid {
		max-width: 100%; /*320*/
	}
	.show-desktop {
		display: none;
	}
	.hide-desktop {
		display: block;
	}
	.show-tablet {
		display: none;
	}
	.hide-tablet {
		display: block;
	}
	.show-phone {
		display: block;
	}
	.hide-phone {
		display: none;
	}
}

table#table_previous_measures tr:nth-child(odd) td {
	background-color: #CCFFFF;
}

table#table_previous_measures tr:nth-child(even) td {
	background-color: #CC99FF;
}

table#table_action tr:nth-child(odd) td {
	background-color: #CCFFFF;
}

table#table_action tr:nth-child(even) td {
	background-color: #CC99FF;
}

select {
	height: 30px;
	border-radius: 10%;
	line-height: 25px;
	padding-left: 20px;
	font-family: 'gothic';
}

.marge {
	padding: 20px;
}

/*----------------------Les class en plus a mettre en dessous des class de base -------------------*/
.wrapperButtonTwelve {
	width: 15%;
	display: inline-block;
}

.buttonTwelve {
	font-family: 'gothic';
	padding: 1vw;
	margin: 20px;
}

.wrapperChart {
	background-color: white;
	height: 40vw;
	width: 60%;
	display: inline-block;
	vertical-align: middle;
	margin-left: 20px;
	margin-top: 30px;
}

/*---------------------- pagination ----------------------*/
.pagination {
	text-align: center;
	display: block;
	margin-left: 27px;
	padding: 0;
	padding-top: 10px;
	display: block;
}

.pagination li {
	color: #666;
	display: inline;
	font-size: 1vw;
	padding: 7px 16px 7px 19px;
	/* 	position: relative; */
	text-decoration: none;
	border: 1px solid #d9d9d9;
	border-right-width: 0px;
	background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0.45, rgb(241
		, 241, 241)), color-stop(0.73, rgb(245, 245, 245)));
	background-image: -moz-linear-gradient(center bottom, rgb(241, 241, 241)
		45%, rgb(245, 245, 245) 73%);
	/* For Internet Explorer 5.5 - 7 */
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#f1f1f1,
		endColorstr=#f5f5f5);
	/* For Internet Explorer 8 */
	-ms-filter:
		"progid:DXImageTransform.Microsoft.gradient(startColorstr=#f1f1f1, endColorstr=#f5f5f5)";
}
 

.pagination li a, .pagination li a:link, .pagination li a:visited {
	color: #666;
	display: inline;
	font-size: 1vw;
	padding: 7px 16px 7px 19px;
	position: relative;
	border: 1px solid #d9d9d9;
	border-right-width: 0px;
}

.pagination li a span, .pagination li a:link span, .pagination li a:visited span
	{
	text-decoration: underline;
}

/*---------------------- breadcrumbs----------------------*/
.crumbs {
	display: block;
	margin-left: 27px;
	padding: 0;
	padding-top: 10px;
}

.crumbs li {
	display: inline;
	color: #666;
	font-size: 1vw;
	/* 	padding: 7px 16px 7px 19px; */
	position: relative;
	text-decoration: none;
}

.crumbs li a, .crumbs li a:link, .crumbs li a:visited {
	color: #666;
	display: inline;
	font-size: 1vw;
	padding: 7px 16px 7px 19px;
	position: relative;
	text-decoration: none;
	border: 1px solid #d9d9d9;
}

.crumbs li a {
	background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0.45, rgb(241
		, 241, 241)), color-stop(0.73, rgb(245, 245, 245)));
	background-image: -moz-linear-gradient(center bottom, rgb(241, 241, 241)
		45%, rgb(245, 245, 245) 73%);
	/* For Internet Explorer 5.5 - 7 */
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#f1f1f1,
		endColorstr=#f5f5f5);
	/* For Internet Explorer 8 */
	-ms-filter:
		"progid:DXImageTransform.Microsoft.gradient(startColorstr=#f1f1f1, endColorstr=#f5f5f5)";
}

.crumbs li.first a {
	border-top-left-radius: 5px;
	-moz-border-radius-topleft: 5px;
	-webkit-border-top-left-radius: 5px;
}

.crumbs li.last a {
	border-right-width: 1px;
	border-bottom-right-radius: 5px;
	-moz-border-radius-bottomright: 5px;
	-webkit-border-bottom-right-radius: 5px;
}

/*---------------------- POP-UP-------------------*/
#dialogConfirm {
	background: #E6F7F7;
	margin: 30px auto 0;
	position: fixed;
	top: 50%;
	left: 50%;
	width: 20vw;
	height: 12vw;
	margin-left: -15vw;
	margin-top: -10vw;
	border: 1px solid #000;
}

#dialogConfirm p {
	font-size: 1.0vw;
	font-weight: bold;
	text-align: center;
	margin: 0.7vw;
}

#dialogImage {
	background: #E6F7F7;
	margin: 30px auto 0;
	position: fixed;
	top: 50%;
	left: 50%;
	width: 25vw;
	height: 20vw;
	margin-left: -15vw;
	margin-top: -10vw;
	border: 1px solid #000;
}

#dialogImage p {
	font-size: 1.5vw;
	font-weight: bold;
	margin: 0.7vw;
	text-align: center;
}

#dialogUpdateTime {
	text-align: center;
	background: #E6F7F7;
	margin: 30px auto 0;
	position: fixed;
	top: 50%;
	left: 50%;
	width: 25vw;
	height: 10vw;
	margin-left: -15vw;
	margin-top: -10vw;
	border: 1px solid #000;
}

#dialogUpdateTime p {
	font-size: 1.5vw;
	font-weight: bold;
	margin: 0.7vw;
	text-align: center;
}



.button_send {
	background-color: yellow;
	font-size: 0.8vw;
	font-weight: bold;
	font-family: 'dakota';
	text-align: center;
	width: 82%;
	border-radius: 10px;
	border: 1px solid #778A9D;
	box-shadow: -5px -5px 2px rgba(0, 0, 0, 0.5) inset, 5px 5px 2px
		rgba(255, 255, 255, 0.6) inset;
	padding-top: 0.9vw;
	padding-bottom: 0.7vw;
	padding-left: 1vw;
	padding-right: 1.8vw;
	padding-bottom: 1.2vw;
	margin-left: 0.7vw;
	text-align: center;
}

.popup-header {
	max-height: 2vw;
	width: 100%;
	background: #479BF5;
	text-align: center;
	display: inline;
	margin: 0vw;
	width: 100%;
}

.button_cancel {
	background-color: #A5C0DC;
	color: black;
	font-size: 0.8vw;
	font-weight: bold;
	font-family: 'dakota';
	text-align: center;
	width: 82%;
	border-radius: 10px;
	border: 1px solid #778A9D;
	box-shadow: -5px -5px 2px rgba(0, 0, 0, 0.5) inset, 5px 5px 2px
		rgba(255, 255, 255, 0.6) inset;
	padding-bottom: 1.2vw;
	padding-top: 0.9vw;
	padding-bottom: 0.7vw;
	padding-left: 1.0vw;
	padding-right: 1.0vw;
	padding-bottom: 1.2vw;
	margin-top: 1vw;
	margin-left: 0.7vw;
	text-align: center;
}

.centrage_button {
	width: 55%;
	display: inline-block;
	vertical-align: middle;
	margin: auto;
}

.button_confirm {
	background-color: yellow;
	font-size: 0.8vw;
	font-weight: bold;
	font-family: 'dakota';
	text-align: center;
	width: 82%;
	border-radius: 10px;
	border: 1px solid #778A9D;
	box-shadow: -5px -5px 2px rgba(0, 0, 0, 0.5) inset, 5px 5px 2px
		rgba(255, 255, 255, 0.6) inset;
	padding-bottom: 1.2vw;
	padding-top: 0.9vw;
	padding-bottom: 0.7vw;
	padding-left: 1vw;
	padding-right: 1.8vw;
	padding-bottom: 1.2vw;
	margin-top: 1vw;
	margin-left: 0.7vw;
	text-align: center;
}

.closeButton {
	background-color: #A5C0DC;
}

.iconWarning{
	width: 25px;
}

#environment, #mechanical{
	cursor: pointer;
}


.title1 {
	text-align: center;
	font-family: 'dakota';
	color: red;
	font-size: 3vw;
	font-weight: bold;
	margin-top: 0.5vw;
	padding-left: 3%;
	padding-right: 3%;
}

.title1 span:nth-of-type(2) {
	font-family: 'gothic';
	color: #254061;
}


.fleetboard {
	display: inline-flex;
	align-items: center;
	vertical-align: middle;
	justify-content: space-around;
	width: 100%;
	height: 65%;
}

.title_buttons {
	display: inline-flex;
	justify-content: space-around;
	width: 100%;
}



.ship0 {
	height: 80%;
	width:30%;
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
}


.main_button25 {
	text-align: center;
	margin: auto;
	font-family: 'dakota';
	font-size: 1.6vw;
	font-weight: bold;
	background-color: #EBEBEB;
	border-radius: 10px;
	padding-top: 1vw;
	padding-bottom: 1vw;
	width: 25%;
	border: 1px solid #778A9D;
	box-shadow: -8px -8px 3px rgba(0, 0, 0, 0.5) inset, 10px 10px 4px
		rgba(255, 255, 255, 0.6) inset;
	margin-top: 0.5vw;
}

.main_button25:hover {
	cursor: pointer;
	box-shadow: 5px 5px 2px rgba(0, 0, 0, 0.5) inset, -5px -5px 2px
		rgba(255, 255, 255, 0.6) inset;
}

.main_button25 a {
	color: #444;
	text-decoration: none;
}

.main_button100 {
	text-align: center;
	margin: auto;
	font-family: 'dakota';
	font-size: 1.6vw;
	font-weight: bold;
	background-color: #EBEBEB;
	border-radius: 10px;
	padding-top: 1vw;
	padding-bottom: 1vw;
	width: 100%;
	border: 1px solid #778A9D;
	box-shadow: -8px -8px 3px rgba(0, 0, 0, 0.5) inset, 10px 10px 4px
		rgba(255, 255, 255, 0.6) inset;
	margin-top: 0.5vw;
	color: #444;
}

.main_button100:hover {
	cursor: pointer;
	box-shadow: 5px 5px 2px rgba(0, 0, 0, 0.5) inset, -5px -5px 2px
		rgba(255, 255, 255, 0.6) inset;
}

.main_button100 a {
	color: #444;
	text-decoration: none;
}

.accesMOB_MOL {
	font-size: 1vw;
	font-weight: bold;
	width: 46%;
	margin: 0;
	text-align: left;
}

.accesMOB_MOL div {
	padding-top: 0.2vw;
	padding-bottom: 0.6vw;
}

.accesMOB_MOL input[type=checkbox] {
	-ms-transform: scale(1.5);
	-moz-transform: scale(1.5);
	-webkit-transform: scale(1.5);
	-o-transform: scale(1.5);
	transform: scale(1.5);
}

.buttonMOLMOB {
	width: 85%;
	height: 30vh;
	padding-top: auto; 
	padding-bottom: auto; 
	box-shadow: -8px -8px 3px rgba(0, 0, 0, 0.5) inset, 10px 10px 4px 
		rgba(255, 255, 255, 0.6) inset;
	background-color: #EBEBEB;
	border: 1px solid #778A9D;
	border-radius: 15px; 

}

.buttonMOLMOB:hover {
	cursor: pointer;
	box-shadow: 5px 5px 2px rgba(0, 0, 0, 0.5) inset, -5px -5px 2px
		rgba(255, 255, 255, 0.6) inset;
}

.divbuttonMOLMOB {
	width: 100%;
	display: inline-block;
	text-align: center;
	padding-top: 5vh;
	padding-bottom: 0.5vh;
}

.divbuttonMOP {
	width: 100%;
	display: flex;
	justify-content: space-around;
	text-align: center;
	padding-top: 20vh;
	padding-bottom: 0.5vh;
}

.divbuttonMOP button {
	width: 28%;
	height: 20vh;
}

.divbuttonMOP span {
	font-family: 'gothic';
	font-size: 3vw;
	color: #254061;
	font-weight: bold;
	letter-spacing: 2px;
}

.divbuttonMOP button span:first-child,
.divbuttonMOP button span:last-child {
	font-family: 'dakota';
	font-size: 4vw;
	color: red;
}



.divmanualMOLMOB {
	display: flex;
	font-size: 1.2vw;
	font-family: 'gothic';
	font-weight: bold;
	color: #254061;
	align-items: center;
	justify-content: center;
}

.companyprofil input[type=password], input[type=text] {
	margin: auto;
	/*font-size: 1.2vw;*/
	width: 60%;
	text-align: center;
	height: 2.0vw;	
}

#engines {
	display: inline-flex;
	justify-content: space-around;
}

#engines div {
	text-align: center;
	font-size: 1.5vw;
	font-weight: bold;
	font-family: 'dakota';
}

#engines span {
	display: block;
	margin: 20px;
}

#engines input {
	padding-top: 3vh;
	padding-bottom: 3vh;
}

.subtitle {
 	font-size: 2vw; 
 	font-weight: bold; 
 	font-family: 'dakota'; 
 	text-align: center;
 }

 .enginesec1 {
  	 display: inline-block;
  	 padding-top: 5vh;
  	 padding-bottom: 5vh;
 	 align-items: center;
 	 justify-content: center;
 	 width: 100%;
 }

 .enginesec1 label {
 	font-weight: bold;
 	font-size: 1.5vw;
 	margin-left: 5%;
 	margin-right: 1%;
 	width: 20%;
 }

 .enginesec1 input {
 	font-size: 1.5vw;
 	text-align: center;
 	border: 1px solid grey;
 	opacity: 1;
 	width: 10%;
 	border-radius: 5px;
 	margin-right: 5%;
 }

 .enginesec1 input:disabled {
 	background-color: white;
 	color: black;
 	width: 20%;
 }

.enginediv {
 	width: 98.333333333333%;
 	margin: auto;
 	display: inline-flex;
 	justify-content: center;
 	text-align: center;
}

.enginediv div {
	width: 5%;
}


.campaignsec0 {
	width:25%;
	padding-bottom: 0.5vh;
}

.campaignsec0 input[type=text] {
	margin-bottom: 1vh;
	border: 1px solid grey;
 	opacity: 1;
 	border-radius: 5px;
	width: 80%;
}

.campaignsec0 input[type=text]:disabled {
	background-color: white;
 	color: black;
}

.campaignsec0 label {
	font-size: 1.2vw;
	font-weight: bold;
	margin-right: 0.6vw;
}

.campaignsec0 input[type=radio] {
	-ms-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -webkit-transform: scale(1.2);
    -o-transform: scale(1.2);
    transform: scale(1.2);
    margin-left: 0.6vw;
}

.campaignsec0 p {
	font-weight: bold;
	font-size: 1.2vw;
	margin: auto;
	margin-top: 0.5vh;
	margin-bottom: 0.5vh;

}

.campaignsec0 textarea {
	max-width: 80%;
	min-width: 80%;
	max-height: 20vh;
	margin-bottom: 1.2vh;
}

#campaign0buttons input[type=button] {
	width: 27%;
	margin-top: 3vh;
	margin-right: 0.5vw;
	margin-left: 0.5vw;
}

.campaignsec1 {
	width: 75%;
	padding-bottom: 1vh;
	padding-top: 5vh;
	display: none;
}

.campaignsec1 img {
	width: 15%;
	margin-left: 15%;
	margin-right: 1%
}

.campaignsec1 span {
	font-size: 2vw;
	margin-right: 15%;
}

.campaignsec1 div {
	display: flex;
	justify-content: center;
	align-items: center;
}


.campaignsec2 {
	width: 75%;
	padding-bottom: 1vh;
	padding-top: 5vh;
}

.campaignsec2 img {
	width: 12%;
	margin-left: 15%;
	margin-right: 1%
}

.campaignsec2 span {
	font-size: 2vw;
	margin-right: 15%;
}

.campaignsec2 div {
	display: flex;
	justify-content: center;
	align-items: center;
}


.campaignsec3 {
	width: 75%;
	padding-bottom: 1vh;
	display: none;
}

.campaignsec3 form {
	width: 100%;
	display: flex;
}


.enginesec2 {
	display: block;
	width: 27%;
	font-weight: bold;
	padding: 2vh;
}

.enginesec2 p {
	margin-top: 0;
	margin-bottom: 2vh;
}

.enginesec2 input[type=button] {
	width: 80%;
	padding: 2vh;
}



.campaignsec3 div:first-child {
	width: 55%;
}


.campaignsec3 div:last-child {
	width: 45%;
}

.campaignsec3 textarea {
	min-width: 80%;
	max-width: 80%;
	font-size: 1vw;
	margin: 0;
	margin-top: 4px;
	border: 2px solid #FFF;
	min-height: 10vh;
	max-height: 40vh;
}

.campaignsec3 table {
	margin: auto;
	width: 100%;
}

.campaignsec3 p {
	margin: auto;
	padding: 0;
	padding-top: 1vh;
	padding-bottom: 1vh;
	width: 80%;
	border: 2px solid #FFF;
	font-size: 1.2vw;
	font-weight: bold;
	background-color: blue;
	color: #FFF;
}


#tabcampsec3 th, #tabcampsec3 td {
	border: 2px solid #FFF;
	font-size: 1.2vw;
	padding: 0;
}


#tabcampsec3 th {
	background-color: blue;
	color: #FFF;
	font-size: 1.2vw;
	padding: 0;
	padding-top: 1vh;
	padding-bottom: 1vh;
}

#tabcampsec3 td {
	padding-top: 0.8vh;
	padding-bottom: 0.8vh;
	font-weight: bold;
	font-size: 1.0vw;
}

#tabcampsec3 input[type="checkbox"] {
    -ms-transform: scale(1.5);
    -moz-transform: scale(1.5);
    -webkit-transform: scale(1.5);
    -o-transform: scale(1.5);
    transform: scale(1.5);
}

#divadjust {
	width: 80%; 
	margin: auto; 
	height: 62vh; 
	overflow-y: auto;
}

.campaignsec4 {
	display: none;
	width: 75%;
	padding: 0;
	/*border: 1px solid #FFF;*/
	height: 62vh;
	max-height: 62vh;
}

.campaignsec4 input[type=text] {
	margin-bottom: 1vh;
	border: 1px solid grey;
 	opacity: 1;
 	border-radius: 5px;
}


.campaignsec4 input[type=text]:disabled {
 	color: black;
 	background-color: white;
}


.campaignsec4 div {
	margin: auto;
	padding: auto;
}

.campaignheader {
	display: flex;
	justify-content: center;
	border: 1px solid #FFF;
	background-color: #11314F;
	padding: 1vh;
	font-size: 1.2vw;
	font-weight: bold;
	color: #FFF;
	align-items: center;
	margin: 0;
	height:9%;
}

.campaignheader img {
	display: none;
	width: 7%;
	vertical-align: middle;
}

.campaignheader div {
	margin: 0;
}

.campaignheader div:first-child {
	text-align: right;
	width: 25%;
}

.campaignheader div:nth-child(2) {
	width: 40%;
	text-align: left;
	padding-left: 1vw;
}

.campaignheaderdiv:last-child {
	text-align: left;
	width: 25%;
}

.campaignheader div:first-child>input {
	width: 17%;
}

.campaignheader div:last-child>input {
	width: 30%;
}

#campaignbody {
	display: inline-flex;
	width: 100%;
}

.vcampaign1 {
	width: 30%;
	border: 1px solid #FFF;
	max-height: 62vh;
}

.vcampaign1 p {
	font-size: 1.2vw;
	font-weight: bold;
	margin: auto;
	padding-top: 1vh;
	padding-bottom: 1vh;
}

.vcampaign1>div {
	overflow-y: scroll;
	background-color: lightgrey;
	font-size: 1.2vw;
	max-height: 62vh;
}

.vcampaign1 input {
	width: 28%;
}

.vcampline {
	display: flex;
	justify-content: space-between;
	width: 100%;
	padding: auto;
}

.vcampline label {
	display: flex;
	margin: auto 0;
	margin-left: 1vw;
	margin-bottom: 1.8vh;
}

.vcampline input {
	display: flex;
	margin-bottom: 0;
	margin-right: 1vw;
}

.vcampline select {
	margin-bottom: 0;
	margin-right: 1vw;
	width: 29%;
	background-color: #FFF;
	border-style: groove;
	border-radius: 5px;
	height: 2vw;
	padding: 0;
	font-size: 1vw;
	font-weight: bold;
	text-align: center;
}

.vcampline input[type="radio"] {
    margin: auto 0;
    margin-right: 0.3vw;
    margin-bottom: 0.8vh;
    width: 5%;
	-ms-transform: scale(1.3);
    -moz-transform: scale(1.3);
    -webkit-transform: scale(1.3);
    -o-transform: scale(1.3);
    transform: scale(1.3);
}

.vcampline input[type=text]:disabled {
	background-color: #EDEDED;
}

.imgplusright {
	width: 8%;
	float: right;
	margin-right: 1.2vw;
	margin-top: 0.6vh;
}

.imgplusright:hover {
	cursor: pointer;
}

.separationline {
	margin: auto;
	width: 94%;
	border-bottom: 1px solid #FFF;
	border-top: 1px solid #FFF;
	margin-top: 0.6vh;
	height: 3px;
}

.separationline1 {
	margin: auto;
	width: 80%;
	border-bottom: 1px solid #FFF;
	margin-top: 0.6vh;
}

.separationline2 {
	color: #FFF;
	margin: 1vh;
}

.vcampaign2 {
	width: 70%;
	border: 1px solid #FFF;
	height: 62vh;
	max-height: 62vh;

}

.vcampaign2 table {
	width: 100%;
	max-height: 62vh;
}

.vcampaign2 th {
	border: 1px solid #FFF;
	background-color: blue;
	color: #FFF;
	word-wrap: normal;
	height: 50px;
	max-height: 50px;
}

.vcampaign2 tr {
	height: 20px;
}

.vcampaign2 input {
	font-size: 1vw;
	margin: auto;
	/*height: 30px;*/
}

.vcampaign2 thead {
	display: block;
	overflow-y: scroll;
	font-size: 1vw;
}

.vcampaign2 tbody {
	display: block;
	overflow-y: scroll;
	max-height: calc(62vh - 62px);
}

.vcampaign2 tbody td{
	border: 1px solid #FFF;
}

.vcampaign2 p {
	font-size: 1.2vw;
	font-weight: bold;
	margin-top: 0;
}

#filetable {
	margin: auto;
	width: 90%;
	border: 1px solid grey;
	background-color: #FFF;
	margin-bottom: 3vh;
}

#filetable tr {
	height: 3vh;
	text-align: left;
}

#filetable td:first-child {
	font-size: 1vw;
	width: 92%;
}

.comparisonsec0 {
	width: 48%;
	padding: 0;
	margin-left: 1%;
}

.comparisonsec1 {
	width: 48%;
	margin-right: 1%;
	padding: 0;
}

.compsecheader {
	display: flex;
	justify-content: space-around;
	border: 1px solid #FFF;
	background-color: #11314F;
	padding-top: 1vh;
	padding-bottom: 1vh;
	font-size: 1vw;
	font-weight: bold;
	color: #FFF;
	align-items: center;
	margin: 0;
	height:5vh;
}

.compsecheader select {
	padding-left: 0.3vw;
	padding-right: 0.3vw;
	font-weight: bold;
	font-size: 1vw;
	height: 2vw;
	text-align: center;
}

.compsecheader img {
	width: 8%;
	float: right;
}

.compsecheader div {
	width: 20%;
}

.compsecheader div:nth-child(2) {
	width: 48%;
}

.compsecheader div:nth-child(2)>select {
	width: 40%;
	border-radius: 5px;
}

.compsecheader input:disabled {
	border: 1px solid grey;
 	opacity: 1;
 	border-radius: 5px;
	width: 30%;
	background-color: #FFF;
	color: #000;
	height: 1.8vw;
	font-size: 1vw;
}

#print_performance0 {
	width: 6%;
	text-align: center;
}

#print_performance0 img {
	width: 70%;
	float: none;
}

#print_performance0 img:hover {
	cursor: pointer;
}

.vdatadivmain {
	display: flex;
	border: 1px solid #FFF;
	border-top: none;
	height: 62vh;
	max-height: 62vh;
	margin: 0;
}

.vdatadiv0 {
	width: 20%;
	overflow-y: scroll;
	background-color: lightgrey;
	border-right: 1px solid #FFF;
	font-size: 1vw;
	max-height: 62vh;
	margin: 0;
}

.vdatadiv0 p {
	font-size: 0.8vw;
	font-weight: bold;
	margin: auto;
	text-align: center;
	padding-top: 0.5vh;
	padding-bottom: 0.2vh;
}

.vdatadiv0 label {
	font-size: 0.8vw;
	margin: auto;
}

.vdatadiv0 input:disabled {
	border: 1px solid grey;
 	opacity: 1;
 	border-radius: 5px;
	width: 80%;
	background-color: #FFF;
	color: #000;
	height: 1.2vw;
	font-size: 0.8vw;
}

.vdatadiv0 input:last-child {
	margin-bottom: 0.5vh;
}

.vdatadiv0 span {
	font-size: 0.8vw;
}

.vdatadiv1 {
	width: 80%;
	overflow-y: scroll;
	max-height: 62vh;
}

.vdatadiv1 table {
	width: 100%;
	font-size: 0.8vw;
}

.vdatadiv1 th {
	border: 1px solid #FFF;
	background-color: blue;
	color: #FFF;
	font-size: 0.8vw;
}

.vdatadiv1 td {
	width: 15%;
	border: 1px solid #FFF;
	padding-top: 0.5vh;
	padding-bottom: 0.5vh;
	background-color: silver;
}

.vdatadiv1 td:first-child {
	width: 10%;
}

.vdatadiv1 p {
	margin: 0;
	padding: 0;
	font-size: 0.8vw;
	width: 100%;
}

.divtable0 {
	min-width: 45%;
	max-width: 45%;
	text-align: center;
}

.divtable0 textarea {
	min-width: 100%;
	max-width: 100%;
	min-height: 15vh;
	max-height: 30vh;
	border: 1px solid #FFF;
	margin-top: 2px;
	opacity: 1;
	color: black;
}

.divtable0 p {
	border: 1px solid #FFF;
	background-color: blue;
	color: #FFF;
	font-size: 0.8vw;
	font-weight: bold;
	padding: 0.1vh;
	margin-top: 2px;
	width: 98.8%;
}

.tbodytab0 td:first-child {
	width: 20%;
}

.tbodytab0 td:nth-child(2), .tbodytab0 td:last-child {
	width: 40%;
}

.tbodytab0 img {
   	width:20%;
}

.divtargetresult {
	display: flex;
	justify-content: space-around;
	margin-top: 0.8vh;
}

.divtargetresult table {
	width: 40%;
}

#tablefile0 {
	width: 60%;
	margin: auto;
	margin-top: 0.8vh;
	margin-bottom: 1.6vh;
}

#tablefile0 tr {
	height: 3vh;
	text-align: left;
}

#tablefile0 td {
	padding-right: 0.3vw;
	padding-left: 0.3vw;
	background-color: #FFF;
}

#tablefile0 img {
	width: 5%;
	float: right;
}

#tablefile1 {
	width: 60%;
	margin: auto;
	margin-top: 0.8vh;
	margin-bottom: 1.6vh;
}

#tablefile1 tr {
	height: 3vh;
	text-align: left;
}

#tablefile1 td {
	padding-right: 0.3vw;
	padding-left: 0.3vw;
	background-color: #FFF;
}

#tablefile1 img {
	width: 5%;
	float: right;
}

#comment0 {
	min-width: 60%;
	max-width: 60%;
	min-height: 15vh;
	max-height: 30vh;
	border: 1px solid #FFF;
	margin-top: 0.8vh;
	opacity: 1;
	color: black;
}

#comment1 {
	min-width: 60%;
	max-width: 60%;
	min-height: 15vh;
	max-height: 30vh;
	border: 1px solid #FFF;
	margin-top: 0.8vh;
	opacity: 1;
	color: black;
}

#divdata {
	display: flex;
	width: 70%;
}

#divdata input {
	margin-left: 5%;
}

#divdata div {
	display: flex;
	align-items: center;
	margin-left: 5%;
	font-size: 1vw;
	font-weight: bold;
}

#divdata select {
	font-size: 1vw;
	border-radius: 5px;
	padding: 0;
	padding-right:1%;
	height: 4.4vh;
	margin-left: 5%;
	text-align: center;	
}

#divselectdata {
	width: 55%;
}

#divselectfuel {
	width: 28%;
}

#fueltype {
	width: 50%;
}


#divdata input:nth-child(2), #divdata input:nth-child(3) {
	padding-left: 1vw;
	padding-right: 1vw;
}

#divdata input:nth-child(2), #divdata input:nth-child(3) {
	padding-left: 1vw;
	padding-right: 1vw;
}

#divdata input:nth-child(3):hover {
	cursor: pointer;
}

#div0modifmeasure {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	width: 80%;
}

#div0modifmeasure span {
	font-size: 1.2vw;
	font-weight: bold;
}

#div0modifmeasure select {
	width: 50%;
	border-radius: 5px;
	padding: 2px;
	font-size: 1vw;
	margin: 0;
	margin-left: 1%;
	height: 4vh;
	text-align: center;
}

#div0modifmeasure div {
	display: inline-flex;
	justify-content: flex-end;
	width: 38%;
	align-items: center;
	margin-left: 5%;
}

#div0modifmeasure input {
	margin: 0;
	margin-left: 5%;
}

#div1modifmeasure {
	display: flex;
	justify-content: space-around;
	width: 100%;
}

#div1modifmeasure div {
	width: 50%;
	margin: 0;
	text-align: center;
}

#div1modifmeasure div>div {
	width: 100%;
	border: 1px solid #FFF;
	background-color: #79018F;
	text-align: center;
	font-size: 1.2vw;
	font-weight: bold;
	color: #FFF;
	margin-top: 2px;
	padding-top: 1vh;
	padding-bottom: 1vh;
}

#div1modifmeasure textarea {
	min-width: 100%;
	max-width: 100%;
	font-size: 1vw;
	margin: 0;
	margin-top: 4px;
	border: 2px solid #FFF;
	min-height: 10vh;
	max-height: 40vh;
}


#div1modifmeasure input[type=checkbox] {
	-ms-transform: scale(1.3);
    -moz-transform: scale(1.3);
    -webkit-transform: scale(1.3);
    -o-transform: scale(1.3);
    transform: scale(1.3);
    margin-top: 1vh;
    margin-bottom: 1vh;
}

#div1modifmeasure table {
	width: 20%;

	background-color: silver;
	margin-bottom: 4px;
} 

#div1modifmeasure thead {
	overflow-y: hidden;
}

#div1modifmeasure tbody{
	overflow-y: hidden;
	width: 100%;
	display: table;
}

#div1modifmeasure tr {
	height: 3.5vh;
}

#div1modifmeasure th {
	background-color: #79018F;
}

#div1modifmeasure th, #div1modifmeasure td {
	width: 35%;
	font-size: 0.8vw;
}

#div1modifmeasure th:first-child, #div1modifmeasure td:first-child {
	width: 30%;
}

#tabledataref {
	width: 100%;
	border-spacing: 0;
	font-size: 0.9vw;
}

#tabledataref thead {
	color: #FFF;
	border: 1px solid #FFF;
	background-color: #11314F;
 
}

#tabledataref tbody td,
#tabledata tbody td {
	border: 1px solid #FFF;
}

#tabledataref th {
	border: 1px solid #FFF;
	padding-top: 5px;
	padding-bottom: 5px;
}
 
#tabledataref td {
	text-align: center;
	padding-top: 5px;
	padding-bottom: 5px;
}

#tabledataref td {
	background-color: silver;
}

#tabledataref td:first-child {
	background-color: #11314F;
	color: #FFF;
}

#tabledataref td:nth-child(2) {
	font-weight: bold;
	background-color: #A1A8AE;
}

#tabledata {
	width: 100%;
	border-spacing: 0;
	font-size: 0.9vw;
}

#tabledata thead {
	color: #FFF;
	border: 1px solid #FFF;
	background-color: #11314F;
 
}
#tabledata th {
	border: 1px solid #FFF;
	padding-top: 5px;
	padding-bottom: 5px;	
}

#tabledata td {
	width: 6.67%;
	padding-top: 5px;
	padding-bottom: 5px;	
	text-align: center;
	background-color: #A9BCF5;
}

#tabledata td:nth-child(4), #tabledata td:nth-child(5), #tabledata td:nth-child(6),
#tabledata td:nth-child(10), #tabledata td:nth-child(11), #tabledata td:nth-child(12) {
	background-color: silver;
}

#tabledata td:nth-child(4), #tabledata td:nth-child(10) {
	font-weight: bold;
	background-color: #A1A8AE;
}

#tabledata td:nth-child(1), #tabledata td:nth-child(7), #tabledata td:nth-child(13) {
	font-weight: bold;
	background-color: #81B7E9;
}

.tabledataload {
	text-align: right;
}

.tabledataloadmeas {
	text-align: left;
	padding-left: 5px;
}

#imgdatarefleft {
	float: left;
	width: 6%;
	margin-left: 4%;
}

#imgdatarefright {
	float: right;
	width: 6%;
	margin-right: 4%;
}

#imgdatarefleft:hover, #imgdatarefright:hover {
	cursor: pointer;
}

#imgdatameasleft {
	float: left;
	width: 1.22%;
	margin-left: 0.8%;
}

#imgdatameasright {
	float: right;
	width: 1.22%;
	margin-right: 0.8%;
}

#imgdatameasleft:hover, #imgdatameasright:hover {
	cursor: pointer;
}



/********** Message graph_1 ************/
#modalContainer {
	background-color:rgba(0, 0, 0, 0.3);
	position:absolute;
	width:100%;
	height:100%;
	top:0px;
	left:0px;
	z-index:10000;
	background-image:url(tp.png); /* required by MSIE to prevent actions on lower z-index elements */
}

#alertBox {
	position:relative;
	width:350px;
	min-height:100px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    margin: 0;
	border:2px solid #188BD0;
	border-radius: 10px;
	background-color:#FFF;
	background-repeat:no-repeat;
	background-position:12px 68px;
	background-image: url('../images/info.png');
}

/*
#modalContainer > #alertBox {
	position:fixed;
}
*/

#alertBox h1 {
	margin:0px;
	/*font:bold 1.2em verdana,arial;*/
	font-family: dakota, verdana, sans-serif;
	font-size: 1.2em;
	background-color: #188BD0;
	color:#FFF;
	border-bottom:1px solid #000;
	border-radius: 10px 10px 0 0;
	padding:5px 0 5px 5px;
}

#alertBox p {
	font:1.2em gothic, verdana, arial;
	height:50px;
	padding-top: 18px;
	padding-left:6px;
	padding-right: 6px;
	margin-left:78px;
	text-align: center;
}

#alertBox #closeBtn {
	display:block;
	position:relative;
	margin:5px auto;
	padding:7px;
	border:1px solid #003399;
	width:70px;
	font-family: dakota, sans-serif;
	font-size: 1em;
	font-weight: bold;
	text-transform:uppercase;
	text-align:center;
	color:#FFF;
	background-color:#188BD0;
	border-radius: 3px;
	text-decoration:none;
}


#alertBox1 {
	position:relative;
	width:350px;
	min-height:100px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    margin: 0;
	border:2px solid #F9B40E;
	border-radius: 10px;
	background-color:#FFF;
	background-repeat:no-repeat;
	background-position:12px 56px;
	background-image: url('../images/warning_64.png');
}

/*
#modalContainer > #alertBox1 {
	position:fixed;
}
*/
#alertBox1 h1 {
	margin:0px;
	/*font:bold 1.2em verdana,arial;*/
	font-family: dakota, verdana, sans-serif;
	font-size: 1.2em;
	background-color: #F9B40E;
	color:#FFF;
	border-bottom:1px solid #000;
	border-radius: 10px 10px 0 0;
	padding:5px 0 5px 5px;
}

#alertBox1 p {
	font:1.2em gothic, verdana, arial;
	height:50px;
	padding-top: 18px;
	padding-left:6px;
	padding-right: 6px;
	margin-left:78px;
	text-align: center;
}

#alertBox1 #closeBtn {
	display:block;
	position:relative;
	margin:5px auto;
	padding:7px;
	border:1px solid #7D3F07;
	width:70px;
	/*font:0.7em verdana,arial;*/
	font-family: dakota, sans-serif;
	font-size: 1em;
	font-weight: bold;
	text-transform:uppercase;
	text-align:center;
	color:#FFF;
	background-color: #F9B40E; /*#74D0F1;*/
	border-radius: 3px;
	text-decoration:none;
}

#msgbtnok {
	border-radius: 7px;
	width: 70px;
	margin-right: 7px;
	margin-bottom: 10px;
}

#msgbtnok:hover {
	cursor: pointer;
	background: silver;
}

#msgbtnok0 {
	border-radius: 7px;
	width: 70px;
	margin-right: 7px;
	margin-bottom: 10px;
}

#msgbtnok0:hover {
	cursor: pointer;
	background: silver;
}

#msgbtnok1 {
	border-radius: 7px;
	width: 70px;
	margin-right: 7px;
	margin-bottom: 10px;
}

#msgbtnok1:hover {
	cursor: pointer;
	background: silver;
}


/********** Message graph_1 (fin) ************/



#evichart {
	background-color: #EFF2FB;
	border: 1px solid grey;
	max-width: 60%;
	margin-right: 6%;
	margin-left: 6%;
}

.imgEvi {
	width: 4%;
	margin-left: 0.5%;
	margin-right: 0.5%;
}

.imgEvi:hover {
	cursor: pointer;
}


#legende {
	text-align: center; 
	font-size: 0.8vw; 
	font-weight: bold;
	visibility: hidden;
}

#legende>span {
	border: 1px solid grey; 
	padding-top: 5px; 
	padding-bottom: 5px; 
	padding-left: 20px; 
	padding-right: 20px; 
	background-color: #EFF2FB;
	display: inline-flex; 
	align-items: center;
}

#legende img {
	width: 1vw;
}


#carvariables {
	display: flex;
	justify-content: center;
}

#carvariables>div {
	width:570px;
	border: 2px solid blue;
	padding: 10px;
	background-color: silver;
}

#carvariables>div div {
	display: inline-flex;
}

#carvariables input {
	width: 15%;
}
#carvariables p {
	width: 500px;
	font-size: 1.2em;
}

#carvariables>div>p {
	font-weight: bold;
	font-size: 1.4em;
	margin: 0px;
}

#carvariables>div div:last-child {
	width: 100%;
	justify-content: center;
	margin-top: 10px;
}

#mobshiplegenddiv {
	width: 18%;
	margin-left: 8vw
}

.mobshiplegend {
	background-color: #EFF2FB;
	border-spacing: 0;
	margin-bottom: 1vw;
	width: 100%;
	font-size: 1vw;
}

.mobshiplegend img {
	width: 8%;
}

.mobshiplegend td {
	border: 1px solid grey;
	padding-top: 2px;
	padding-bottom: 2px;
}

.mobshiplegend tr td {
	width: 50%;
}

.mobshiplegend tr:first-child td {
	background-color: #EFF2FB;
	padding-top: 5px;
}


#mobevishipslegend {
	background-color: #EFF2FB;
	border-spacing: 0;
	width: 50%;
	font-size: 0.8vw;
}

#mobevishipslegend tr td {
	border: 1px solid grey;
	width: 15%;
	padding-top: 4px;
	padding-bottom: 4px;
}

#mobevishipslegend tr td:first-child {
	width: 25%;
}

#mobevishipslegend img {
	margin-top: 2px;
	margin-bottom: -2px;
	width: 10%;
}

#divgraph {
	background-color: #EFF2FB;
	width: 60%;
	border-right: 1px solid #EFF2FB;
	font-family: arial;
	font-weight: bold;
}

#savgraph {
	background-color: #EFF2FB;
/*	border: 1px solid grey;
	width: 100%;*/
}


#savingsleft {
	width: 15%;
}

#globalsavings {
	border-radius: 1vw;
	border: 4px solid cyan;
	background-color: #11314F;
	color: #FFF;
}

#globalsavings p {
	font-size: 1.4vw;
	font-weight: bold;
	margin-bottom: 0;
}

#globalsavings input {
	background-color: transparent;
	border-style: none;
	color: #FFF;
	font-size: 1.2vw;
	width: 100%
}

#globalsavings p>span {
	font-size: 0.8vw;
}

#selectsavings {
	width: 15%;
	border: 2px solid cyan;
	border-radius: 10px;
	text-align: left;
	overflow-y: auto;
	background-color: #11314F;
}

#selectsavings label {
    margin-left: 1vw;
    font-size: 1vw;
}

#selectsavings div {
    margin-top: 1.2vh;
    margin-bottom: 1.2vh;
}

#selectsavings input[type=checkbox] {
	display: none;

}

#selectsavings label {
	color: #FFF;
	
}

#selectsavings input[type=text] {
	width: 0.6vw;
	height:0.6vw;
	margin-left: 0.6vw;
	background-color: #FFF;
}

#dummysavings {
	width: 0px;
	border: none;
	background-color: transparent;
	padding: 0;
}

#divgraphspan1 {
	width: 4%; 
	border-bottom: 3px solid black; 
	height: 2px; 
	margin-top: 4px; 
	margin-right: 1%;
}

#divgraphspan2 {
	width: 4%; 
	border-bottom: 3px dotted black; 
	height: 2px; 
	margin-top: 4px; 
	margin-right: 1%;
	margin-left: 3%;
}

#divgraph div {
	display: flex; 
	justify-content: center;
	margin-top: 0.6vh;
}

#divgraph span:hover {
	cursor: pointer;
}



#waiting {
	display: none;
	color: red;
}


#regression {
	padding: 1.5vh;
	background-color: lightgrey;
	margin-left: 10%;
	margin-right: 10%;
	margin-top: 2vh;
	border: 2px solid grey;
}

#regression input[type=checkbox] {
	-ms-transform: scale(1.3);
    -moz-transform: scale(1.3);
    -webkit-transform: scale(1.3);
    -o-transform: scale(1.3);
    transform: scale(1.3);
}


#graphFull {
	visibility: hidden;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 10;
	padding: 0px;
	margin: 0px;
	width: 99%;
	max-height: 100%;
	background-color: black;

}

#myChart3 {
	width: 100%;
	height: 100%;
	min-height: 400px;
	background-color: #000;
	margin: 0;
	padding-left: 1vw;
	padding-right: 1vw;
}

#myChart2 {
	width: 90%;
	height: 100%;
	background-color: #000;
	margin: 0;
}

#myChart1 {
	width: 100%;
	height: auto;
	background-color: #000;
	margin-left: 10px;
}

#myChart4 {
	width: 100%;
	height: 100%;
	background-color: #000;
	margin: 0;
}

#mopconfigfieldset {
	font-size: 1vw;
	padding: 0;
	padding-top: 2px;
}

#mopconfigfieldset div {
	display: flex;
	padding-top: 4px;
	padding-bottom: 4px;
	border-bottom: 1px solid #FFF;
}

#mopconfigfieldset div:last-child {
	border-bottom: 0px;
}

#mopconfigfieldset label {
	display: flex;
	text-align: left;
	width: 100%;
}

#mopconfigfieldset legend {
	font-size: 1.2vw;
}

#mopconfigfieldset label span:first-child {
	width: 62%;
}
#mopconfigfieldset label span:last-child {
	display: none;
}

#mopconfigform {
	font-size: 1.2vw;
}

#mopconfigform div {
	display: flex;
	justify-content: space-between;
	line-height: 1.8vw;
	margin-top: 2vh;
}

#mopconfigform div:first-child {
	display: block;
	margin-top: 0px;
	text-align: center;
}

#mopconfigform div:nth-child(2) {
	margin-top: 0px;
}

#mopconfigform input {
	box-sizing: border-box;
	line-height: 1.8vw;
	text-align: center;
}

#mopconfigform input:first-child {
	width: 100%;
	font-size: 1vw;
}

#mopconfigform label {
	width: 60%;
	text-align: left;
	line-height: 1.8vw;
}

#mopconfigform img {
	width: 10%;
	vertical-align: middle;
	margin-left: 0.4vw;
}

#mopconfigbuttons {
	display: flex;
	flex-direction: column;
	justify-content: center;
	width: 15%;
	height: 70vh;
}

#mopconfigbuttons input {
	display: block;
	width: 60%;
	margin-top: 2vh;
	margin-bottom: 2vh;
}

#mopconfigform a {
  	position: relative;
  	cursor: pointer;
  	border-radius: 50%;	
}

#mopconfigform a:hover:after,
#mopconfigform a:focus:after {
	content: attr(infotext); 
  	position: absolute;
  	top: -2.4em;
  	left: 50%;
	transform: translateX(-50%); 
  	z-index: 1;
  	white-space: pre;
  	padding: 5px 14px;
  	background: #413219;
  	color: #fff;
  	border-radius: 4px;
  	font-size: 1vw;
}

.text_img span {
	width: 45%;
	text-align: left;
	line-height: 1.8vw;
}

.text_img div, .text_img a {
	width: 15%;
}

.text_img img:hover {
	cursor: pointer;
}


#config1_form div {
	font-size: 1.2vw;
	padding-top: 6px;
}

#config1_form div:first-child {
	padding-top: 0px;
}

#config1_form div:nth-child(5) {
	display: flex;
	width: 80%;
	margin: auto;
	border: 1px solid red;
}

#config1_form div:first-child {
	border: 1px solid yellow;
}

.divbuttonMOPbunker {
	width: 100%;
	display: flex;
	justify-content: flex-end;
	text-align: center;
	padding-top: 6px;
}

.divbuttonMOPbunker button {
	width: 7%;
	height: 5vh;
	min-height: 30px;
	min-width: 90px;
	border-radius: 10%;
	padding-right: 0.8%;
	box-shadow: -5px -5px 2px rgba(0, 0, 0, 0.5) inset, 10px 10px 4px 
		rgba(255, 255, 255, 0.6) inset;
	margin-left: 3vw;

}

.divbuttonMOPbunker span {
	font-family: 'gothic';
	font-size: calc(8px + 0.3vw);
	color: #254061;
	font-weight: bold;
	letter-spacing: 0px;
}

.divbuttonMOPbunker div {
	width: calc(10px + 0.3vw);
	margin: 0;
	padding-bottom: 8%;
	margin-left: 0.1vw;
}

.divbuttonMOPbunker button span:first-child,
.divbuttonMOPbunker button span:last-child {
	font-family: 'dakota';
	font-size: calc(10px + 0.3vw);
	color: red;
	letter-spacing: -2px;
}

.divbuttonMOPbunker button span:last-child {
	margin-left: -4px;
}

.fleetemissions{
	display: flex;
	justify-content: space-around;
	font-size: 1.2vw;
	padding-top: 2vh;
	padding-bottom: 2vh;
}

.fleetemissions div{
	text-align: center;
}

.fleetemissions img{
	width: 6%;
	margin-left: 15px;
}

.fleetemissions>div:first-child,
.fleetemissions>div:nth-child(2),
.fleetemissions>div:nth-child(3){
	width: 25%;
}


.spemission{
	border: 2px solid gray;
	border-radius: 8px;
	background-color: #FFF;
	width: 80%;
	margin: auto;
	margin-top: 1vh;
	font-size: 1.5vw;
	font-weight: bold;
	padding-top: 1vh;
	padding-bottom: 1vh;
	position: relative;
}

.spemission a{
	position: absolute;
	height: 1.7vw;
}
.spemission a img{
	width: 40%;
}

.spemission a:hover:after,
.spemission a:focus:after {
	content: attr(infotext); 
  	position: absolute;
  	top: -2.4em;
  	left: 50%;
	transform: translateX(-50%); 
  	z-index: 1;
  	white-space: pre;
  	padding: 5px 14px;
  	background: #413219;
  	color: #fff;
  	border-radius: 4px;
  	font-size: 1vw;
}

.ratingselect{
	width: 8%; 
	color: #FFF;
	margin: auto;
	padding-bottom: 5px;
	min-width: 100px;
	border: 1px solid #FFF;
}

.ratingselect div:nth-child(2){
	margin: auto;
	margin-top: 5px;
	font-size: 1,2vw;
}

.emissionframe{
	width: 100%;
	margin: auto;
	margin-top:2vh;
	margin-bottom: 2vh;
}

.emissionframe>div:first-child{
	display: flex;
	padding: 0.5vw;
}

#undercan{ 
	 display:flex;
	 padding-left: 20%;
	 padding-right: 20%;
}

#undercan img{
	margin: auto;
	width: 20%;
}

#undercan img:hover {
	cursor: pointer;
}


.additionalemission{
	display: none;
	margin-top: -1vw;
	font-size: 1.2vw;
}


#mopindic a {
  	position: relative;
  	cursor: pointer;
  	border-radius: 50%;	
}

#mopindic a:hover:after,
#mopindic a:focus:after {
	content: attr(infotext); 
  	position: absolute;
  	top: -2.4em;
  	left: 50%;
	transform: translateX(-50%); 
  	z-index: 1;
  	white-space: pre;
  	padding: 5px 14px;
  	background: #413219;
  	color: #fff;
  	border-radius: 4px;
  	font-size: 1vw;
}

.firstline{
	display: flex; 
	justify-content: space-between;
	align-items: center;
	font-size: max(12px,1.2vw);
	margin-top: 5px;
}

.firstline a{
	 margin-left: 10px;
}

.firstline img{
	width: 8%;
}

.firstline p{
	 text-align: right; 
	 margin: 0;
}

.firstline div:first-child,
.firstline div:last-child{
	width: 23%;
}

.firstline div:nth-child(3){
	width: 19%;
	text-align: center;
}

.firstline div:nth-child(2),
.firstline div:nth-child(4){
	width: 17%;
	text-align: center;
	height: 2.2vw;
	min-height: 20px;
}

.firstline select{
	font-size: max(12px,1.2vw);
	width: 100%;
	height: 2.2vw;
	min-height: 20px;
	border-radius: 0px;
}

.firstline select:required:invalid {
  color: gray;
}

.firstline option[value=""][disabled] {
  display: none;
}

.firstline option {
  color: black;
}

#mopshipindicbutton1{
	width: 32%;
	font-family: 'dakota';
	font-size: 0.8vw;
	height: 100%;
	background-color: 'lightgrey';
}

#mopshipindicbutton1:hover{
	cursor: pointer;
}

#mopshipindicbutton2{
	width: 32%;
	font-family: 'dakota';
	font-size: 0.8vw;
	height: 100%;
	background-color: 'lightgrey';
}

#mopshipindicbutton2:hover{
	cursor: pointer;
}


#mopshipindic{
	display: flex;
	justify-content: space-between;
	padding-right: 4%;
	padding-left: 4%;
}

#mopshipindic>div:first-child{
	background-color: lightgrey;
	width: 25%;
	border: 1px solid #FFF;
	padding: 0;
}

#mopshipindic div:first-child div{
	display: flex;
	width: 100%;
	height: 8.33333%;
	font-size: max(12px,1.1vw);
	text-align: center;
}

#mopshipindic div:first-child div:nth-child(odd){
	background-color: #2E9AFE;
}

#mopshipindic div:first-child p{
	margin: auto;
	font-size: max(12px,1.1vw);
	width: 100%;	
}

#mopshipindic div:first-child span{
	width: 33.3333333%;
	margin: auto;
}

#mopshipindic>div:last-child{
	width: 70%;
}

/******************/
/* Reading Status */
/******************/

#rs_compsel, #rs_summary{
	border: 1px solid #FFF;
	background-color: lightgrey;

}

#rs_compsel>div{
	height: 50vh;
	overflow-y: scroll;	
}

#rs_compsel p, #rs_summary p{
	font-family: gothic;
	font-size: 1.2vw;
	font-weight: bold;
	text-align: center;
}

.rs_complist{
	font-size: 1vw;
	margin-bottom: 1vw;
	padding-left: 15px;
	padding-right: 15px;

}

.rs_complist input{
	border: 0px;
	width: 16px;
	height: 1.5em;
}

#rs_summary div{
	font-size: 1vw;
	display: flex;
	justify-content: center;
	margin-bottom: 4%;
}

#rs_summary span:first-child{
	width:50%;
}

#rs_summary span:last-child{
	width:10%;
	text-align: center;
}

.inputdisabled input:disabled {
	opacity: 1;
	background-color: #FFF;
}


/******************/
/* OpteLog Limits */
/******************/

.inplimit{
	width: 51.5%; 
	font-size: 1vw; display: 
	flex; 
	justify-content: space-between;
}

.inplimit input{
	width: 13%; 
	margin: 0; 
	font-size: 1vw; 
	text-align: center;
}

.inplimit input[disabled]{
	background-color: lightgrey;
	opacity: 1;
}

.divunit{
	display: flex;
	align-items: center;
	justify-content: center;
	height: 8%;
	width: 100%;
	font-size: 1.2vw;"
	border: 1px solid yellow;
}

.divunit input{
	width: 100%;
}

.interdivunit{
	height: 5.6%;
}

.emptycolumn{
	display: flex;
	flex-direction: column;
	position: absolute;
	height: 82%;
}

.bufull{
	display: flex;
	flex-direction: column;
	justify-content: center;
	font-size: 1.2vw;
	border: 2px solid darkcyan;
	background-color: lightgrey;
	padding-left: 20px;
	padding-bottom: 4vh;
	width: 30%;
	margin: auto;
}

.bufull > div {
	padding-top: 4vh;
	display: flex;
	justify-content: space-between;
	height: 40px;
	align-items: center;
}

.bufull > div div:first-child{
	width: 50%;
	padding: 0;
}

.bufull > div div:last-child{
	width: 40%;
	text-align: center;
}

#bufullbutton{
	margin-top: 2vh;
	text-align: center;
}

#bufullbutton input{
	background-color: cyan;
}

.bucommon_1{
	display: flex;
	justify-content: center;
	margin-top: 8vh;
}

.bucommon_1 > div{
	display: flex;
	flex-direction: column;
	justify-content: center;
	font-size: 1.2vw;

}

.bucommon_1 > div > div{
	display: flex;
	flex-direction: row;
	justify-content: space-between;
}

.bucommon_1 > div > div label:last-child{
	width: 35%;
}

.bucommon_1 input[type=checkbox]{
    width: 0.5vw;
    height: 0.5vw;
    vertical-align: middle;
    margin-right: 1vw;
}

.bucommon_1 > div:first-child{
	border: 2px solid darkcyan;
	background-color: lightgrey;
	padding-left: 20px;
	padding-bottom: 2vh;
	width: 40%;
}

.bucommon_1 label{
	padding-top: 2vh;
}

.bucommon_1 > div:last-child{
	width: 20%;
}

.bucommon_1 > div:last-child input{
	width: 80%;
}


.bumob{
	display: flex;
	justify-content: space-evenly;
	margin-top: 8vh;
	height: 50vh;
	max-height: 50vh;
}

.bumob p{
    display: flex;
    align-items: center;
    justify-content: center; /* Centrage horizontal */
    text-align: center; /* Au cas où */
	font-weight: bold;
	margin: 0;
	background-color:  #AEB6BF ;
	border-bottom: 2px solid darkcyan;
	height: 8vh;
}

.bumob > div:first-child,
.bumob > div:nth-child(2){
	display: flex;
	flex-direction: column;
	border: 2px solid darkcyan;
	background-color: lightgrey;
	font-size: 1.2vw;
	height: 50vh;
	max-height: 50vh;
}

.bumob > div:first-child{
	width: 27%;
}

.bumob > div:nth-child(2){
	width: 23%;
}

.bumob > div:first-child > div,
.bumob > div:nth-child(2) > div{
	padding-left: 2%;
}

.bumob > div:first-child > div,
.bumob > div:nth-child(2) > div{
	flex-grow: 1;
	overflow-y: auto;
	font-size: 1.2vw;
	max-height: calc(50vh - 8vh - 14px);
}

.bumob > div:last-child{
	display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
	width: 16%;
}

.bumob > div:last-child >div input{
	width: 100%;
}

.bumob label{
	display: inline-block;
	margin-top: 10px;
	margin-bottom: 10px;
}





.bumol{
	display: flex;
	justify-content: space-evenly;
	margin-top: 8vh;
	height: 50vh;
	max-height: 50vh;
}

.bumol p{
    display: flex;
    align-items: center;
    justify-content: center; /* Centrage horizontal */
    text-align: center; /* Au cas où */
	font-weight: bold;
	margin: 0;
	background-color:  #AEB6BF ;
	border-bottom: 2px solid darkcyan;
	height: 8vh;
}

.bumol > div:first-child,
.bumol > div:nth-child(2),
.bumol > div:nth-child(3){
	display: flex;
	flex-direction: column;
	border: 2px solid darkcyan;
	background-color: lightgrey;
	font-size: 1.2vw;
	height: 50vh;
	max-height: 50vh;
}


.bumol > div:first-child{
	width: 27%;
}


.bumol > div:nth-child(2){
	width: 23%;
}


.bumol > div:first-child > div,
.bumol > div:nth-child(2) > div{
	padding-left: 2%;
}

.bumol > div:nth-child(3){
	width: 10%;	
}

.bumol > div:first-child > div,
.bumol > div:nth-child(2) > div,
.bumol > div:nth-child(3) > div{
	flex-grow: 1;
	overflow-y: auto;
	font-size: 1.2vw;
	max-height: calc(50vh - 8vh - 14px);
}

.bumol > div:nth-child(3) > div > div{
	width: 50%;
	margin: auto;
}

.bumol > div:last-child{
	display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
	width: 16%;
}

.bumol > div:last-child >div input{
	width: 100%;
}

.bumol label{
	display: inline-block;
	margin-top: 10px;
	margin-bottom: 10px;
}


.bumop{
	display: flex;
	justify-content: space-evenly;
	margin-top: 8vh;
	height: 50vh;
	max-height: 50vh;
}

.bumop p{
    display: flex;
    align-items: center;
    justify-content: center; /* Centrage horizontal */
    text-align: center; /* Au cas où */
	font-weight: bold;
	margin: 0;
	background-color:  #AEB6BF ;
	border-bottom: 2px solid darkcyan;
	height: 8vh;
}

.bumop > div:first-child,
.bumop > div:nth-child(2){
	display: flex;
	flex-direction: column;
	border: 2px solid darkcyan;
	background-color: lightgrey;
	font-size: 1.2vw;
	height: 50vh;
	max-height: 50vh;
}

.bumop > div:first-child{
	width: 27%;
}

.bumop > div:nth-child(2){
	width: 23%;
}

.bumop > div:first-child > div,
.bumop > div:nth-child(2) > div{
	padding-left: 2%;
}

.bumop > div:first-child > div,
.bumop > div:nth-child(2) > div{
	flex-grow: 1;
	overflow-y: auto;
	font-size: 1.2vw;
	max-height: calc(50vh - 8vh - 14px);
}

.bumop > div:last-child{
	display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
	width: 16%;
}

.bumop > div:last-child >div input{
	width: 100%;
}

.bumop label{
	display: inline-block;
	margin-top: 10px;
	margin-bottom: 10px;
}