/*CSS document */
@charset "UTF-8";

/****************************************************************************/
/*							SURCHARGE DU CSS DE BASE						*/
/****************************************************************************/

html {font-size: 10pt;}
body {font-size: 1em}

#header > .nav > ul > li {
	font-size: 1.1em;
}
.vert {color:#33b23a;}
.rouge{color:#C00}
#main table {display: table; table-layout: auto; border-collapse: collapse; vertical-align: top; }
	#main .table {width: 100%; margin: 10px 0; caption-side: top;}
	#main .table caption {padding: 10px 0px; color: #555; font-style: normal; font-size:1.6em; text-align: left;}
	#main .table tbody,
	#main .table thead,
	#main .table tfoot {border: 1px solid #ccc;}
	#main .table tbody tr:nth-child(odd),
	#main .table tbody tr.grey {background: #eee;}
	#main .table tbody tr:nth-child(even),
	#main .table tbody tr.white {background: #ffffff;}
	#main .table thead tr > * + *,
	#main .table tbody tr > * + *,
	#main .table tfoot tr > * + * {border-left: 1px solid #b8b8b8;}
	#main .table tr > :last-child {text-align: left;}

	#main .table tr {
	-webkit-transition: all 0.25s 0 linear;
       -moz-transition: all 0.25s 0 linear;
        -ms-transition: all 0.25s 0 linear;
         -o-transition: all 0.25s 0 linear;
            transition: all 0.25s 0 linear;
    }
	#main .table tbody tr:hover {background: #e7e7e7; cursor: pointer;}
	#main .table th {background-color: #ffffff; color:#000000; font-size: 1em; font-weight:bold;}
	#main .table th,
	#main .table td {padding: 5px 5px; text-align: left; border-bottom: 1px solid #ccc;}
	#main .table td {color: #555;}
	#main .table td.archive{text-decoration: line-through; }

input[type="color"],
input[type="date"],
input[type="datetime"],
input[type="datetime-local"],
input[type="email"],
input[type="month"],
input[type="number"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="text"],
input[type="time"],
input[type="url"],
input[type="week"],
select,
textarea,
button,
input[type="reset"] {min-width: auto;}
.input-mini {
  width: 60px;
}
.input-small {
  width: 90px;
}
.input-medium {
  width: 150px;
}
.input-large {
  width: 210px;
}
.input-xlarge {
  width: 270px;
}
.input-xxlarge {
  width: 530px;
}
.input-total {
  width: 100%;
}
.input-texte{
	-webkit-box-shadow:none !important;
	border:none !important;
	background:none !important;
}


.mw1200p {max-width: 1200px;}
#content {width: 1200px;}

/****************************************************************************/
/*								CSS SPECIFIQUE								*/
/****************************************************************************/

/* Les boîtes de dialogue */

.dialog-box {
	display: none;
	border: 1px #333 solid;
	/*background: #5c5c5c url(/js/jui/images/ui-bg_flat_30_aaa_40x100.png) 50% 50% repeat;*/
	background-color: #5E5E5E;
	/* opacity: .90; */
	/* filter: Alpha(Opacity=90); */
	position: absolute;
	min-width: 500px;
	min-height: 100px;
	z-index: 9997;
	box-shadow: 0 0 10px #000;
	padding: 15px;
	overflow: hidden;
	color: #fff;
	border-radius: 5px
}

.dialog-box .header {
	padding: 0px 0px 10px 0px;
}
.dialog-box #title {
	color: #27B9D9;
    font-size: 1.8571em;
    font-weight: 700;
    line-height: 1.6154em;
    text-transform: uppercase;
}

.dialog-box div.button-bar {
	display: block;
	margin-top: 20px;
	text-align: right;
	width: 100%;
}

.dialog-box div.content-container {
	display: block;
	padding: 0;
	text-align: left;
	border: none;
	width: 100%;
	vertical-align: top;
}

.dialog-box div.message-container {
	height: 20px;
}

.dialog-box div.message-container #message {
	color: white;
}

.dialog-box button {
	margin-left: 10px;
}

.dialog-box th {
	color: white;
	font-weight: normal;
	padding-right: 20px;
}

.dialog-box td {
	color: white;
}

/* Formulaires */

form {
	border: 0px solid black;
	margin: 0px;
	padding: 0px;
}

/* XXXXXXXX */

#main table.not-today {
	display: none;
}

#main table.not-today * {
	color: #BABABA;
}

#main .table tbody tr.selectionne {
	background-color: lightblue;
}

form > table > thead > tr > th, form > table > tbody > tr > td {
	padding-right: 40px;
	vertical-align: top;
	padding-bottom: 10px;
	text-align: left;
}

button {
	min-width: auto;
}

#content > #main {
	min-height: 500px;
}

#header .subnav li.current a {
	color: #27B9D9;
}

#main .subnav2 {
	padding: 0px 0px 20px 0px;
	margin: 0px;
}

#main .subnav2 > * {
	padding-right: 40px;
}

#main .subnav2 > li {
	display: inline;
	list-style-type: none;
}

.detail_operation {
	width: 100%;
	margin-bottom: 40px;
}

.detail_operation thead th {
	font-size: 1.2em;
	vertical-align: top;
	text-align: left;
	font-weight: normal;
}

.detail_operation tbody td {
	font-size: 1.8em;
	vertical-align: top;
}

#main > div.button-bar, #main > div > div.button-bar {
	display: block;
	margin-top: 20px;
	text-align: center;
	width: 100%;
}

.tabs-container .tabs-content > table > tbody tr > td,
.tabs-container .tabs-content > form > table > tbody tr > td {
	padding-bottom: 20px;
}

.tabs-container .tabs-content > table > tbody > tr > td > table > tbody > tr > td,
.tabs-container .tabs-content > form > table > tbody > tr > td > table > tbody > tr > td {
	padding: 5px 0px;
}

.tabs-container .tabs-content table caption,
.tabs-container .tabs-content > table > tbody > tr > td > label,
.tabs-container .tabs-content > form > table > tbody > tr > td > label {
	text-align: left;
	font-weight: bold;
}

.tabs-container .tabs-content > table > tbody > tr > td,
.tabs-container .tabs-content > form > table > tbody > tr > td {
	vertical-align: top;
}

.tabs-container .tabs-content > table > tbody > tr > td > table > tbody > td > td > label,
.tabs-container .tabs-content > form > table > tbody > tr > td > table > tbody > tr > td > label {
	font-weight: normal;
}

.tabs-container .tabs-content input[type="radio"],
.tabs-container .tabs-content input[type="checkbox"] {
	margin-right: 15px;
}

span > a {
	font-size: 1.2em;
}

#main .table td.numeric-value {
	text-align: right;
}

#visualisation-operation > #information-annulation {
	margin-bottom: 20px;
}

#visualisation-operation > #information-annulation > .titre {
	color: red;
	font-weight: bold;
}

#visualisation-operation > #information-annulation > .raison {
	color: red;
}

#main .table tr.old-version > td {
	color: #AAAAAA;
}

#main .table td.number {
	text-align: right;
}

#resultat > table > tbody > tr > td {
	text-align: center;
	font-size: 18px;
}
#resultat > table > tbody > tr > td > span {
	font-weight: bold;
	font-size: 24px;
}
/*
#resultat #nombre-operations, #resultat #nombre-jours, #resultat #total, #resultat #volume-reel, #resultat #volume-tarife, #resultat #theta, #resultat #nombre-operations-nuit, #resultat #nombre-operations-minimum-facturation{
	font-size: 2.5em;
}
*/

.total > td {
	font-weight: bold;
}

#operations-a-facturer #content tr.action_commerciale > td > a {font-weight: bold; color:blue;}

#operations-a-facturer tr.action_commerciale > td > a.ajouter-action-co {display:none;}
#operations-a-facturer tr.action_commerciale > td > a.enlever-action-co {display:inline;}

#operations-a-facturer tr.ligne-operation:not(.action_commerciale) > td > a.ajouter-action-co {display:inline;}
#operations-a-facturer tr.ligne-operation:not(.action_commerciale) > td > a.enlever-action-co {display:none;}


#operations-a-facturer form#operations-form > * { display: inline-block; margin-right: 20px; }
#operations-a-facturer .resume { width: 100%; margin-top: 30px; padding-top: 20px; border-top: 1px solid #CDCDCD; }
#operations-a-facturer .resume > tbody > tr > td { vertical-align: top; width: 16%; }
#operations-a-facturer .resume > tbody > tr > td > span { font-size: 2em; }

#loader {
	display: none;
	text-align: center;
	border: 1px solid #CDCDCD;
	border-radius: 5px;
	background:#FFFFFF url(/images/ajax_loader.gif) no-repeat center center;
	background-size : 100px 100px;
	height: 200px;
	width: 200px;
	position: fixed;
	z-index: 1000;
	left: 50%;
	top: 50%;
	margin-top: -64px;
	margin-left: -64px;
}

#changer-consignataire-confirm-box #message {
	color: white;
}



#header > .nav > ul > li > img {
    margin: 10px 0 0;
}

#header > .nav > ul > li > span {
	display: block;
	margin: 5px 0 0;
}

.sortable {
	cursor: pointer;
}

#ajouter-operation-form-new input[type="text"] {width: 300px !important; height: 30px;}
#ajouter-operation-form-new select {width: 300px !important;height: 30px;}
#ajouter-operation-form-new label {display:block;}
#modifier-operation-form-new input[type="text"] {width: 300px !important; height: 30px;}
#modifier-operation-form-new input[type="datetime-local"] {width: 300px !important; height: 30px;}
#modifier-operation-form-new select {width: 300px !important;height: 30px;}
#modifier-operation-form-new label {display:block;}

#modifier-discordance-form{height: 600px;}
#modifier-discordance-form input[type="text"] {width: 300px !important; height: 30px;}
#modifier-discordance-form select {width: 300px !important;height: 30px;}
#modifier-discordance-form label {display:block;}

#modification-bon input {width: 100% !important; height: 30px;}
#modification-bon select {width: 100% !important;height: 30px;}
#modification-bon textarea {width: 100% !important;height: 80px;}
#modification-bon label {display:block;}

#voir-bon p {width: 100% !important; height: 30px; background-color: #F7F7F7; border: 1px solid #999; border-radius: 0.375rem;padding-left: 5px;padding-bottom:5px;font-size: 14px;line-height: 15px;}

.signature {position: relative; width:360px; height: 180px; background-color: #F7F7F7; }
.signature .efface {position: absolute; background-color: #999; right: 0; top: 0; border-radius: 0 4px 0 0; width: 25px; height: 25px; text-align: center; color: white;}
.signature canvas {position: absolute; left: 0; top: 0; width:360px; height:180px; } 
.signature.large {position: relative; width: 100%; height: 150px}
.signature.large canvas {width: 100%; height: 150px;}
#signature.border {border: 1px solid #999; border-radius: 0.375rem;}

@media only screen and (max-width: 900px) {
	#content.mobile {width: 100%;}
}



.btn_menu {display: none; padding: 10px; border: 0; background: white; border-radius: 0; appearance: none; -webkit-appearance: none;}
.blocDateCDV .blocDateCDV-options a {margin-right: 20px;}
.operationRenseigner {float: right;}

.flex-column {display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between;}
.flexBtn_action {display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between;}
.flex-column.patronSuite .patronSuite-33 {width: 30%;}

.login {}
.login #content {max-width: 500px; width: auto; margin: 50px auto;}
.login #content > #main {min-height: auto;}

/* iPad */
@media only screen and (max-width: 900px) {
	#content.mobile {width: 100%;}
	.btn_menu {display: block; float: right; margin: 0 20px;}
	.header_alert {background: white; padding: 8px 20px; font-weight: bold;}
	#header > .header-top {padding: 5px 20px;}
	#header {height: auto;}
	#header > .nav {height: 55px;}
	#header > .nav.patron {height: 85px;}
	#header > .nav.patron > ul {display: block;}
	#header > .nav > ul {display: none;}
	#header > .nav.active > ul {display: block; position: absolute; top: 90px; left: 0; right: 0; background: #184570; border-top: 1px solid white; padding: 20px;}
	#header > .nav > ul > li {width: 90px;}
	#header > .nav > ul > li.current > .arrow, #header > .nav > ul > li:hover > .arrow {display: none;}
	.notification_alert {top: 0; right: 5px;}
	
	#header > .subnav {overflow: hidden; overflow-x: hidden; overflow-x: scroll;}
	#header > .subnav > ul {width: 1000px;}

	table.modeResponsive {border: 0;}
	#main .table.modeResponsive tbody tr > * + * {border-left: 0;}
	table.modeResponsive .table-header-2 {display: none;}
	table.modeResponsive thead {border: none; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px;}
	table.modeResponsive tr {border-bottom: 3px solid #000; display: block; margin-bottom: 0;}
	table.modeResponsive tr.probleme {display: none;}
	table.modeResponsive td { border-bottom: 1px solid #ddd;display: block;  font-size: .9em; text-align: right !important;}
	table.modeResponsive td::before {/* * aria-label has no advantage, it won't be read inside a table content: attr(aria-label);*/
		content: attr(data-label); float: left; font-weight: bold; text-transform: uppercase;}
	table.modeResponsive td:last-child {border-bottom: 0;}

	#main .subnav2 > * {padding-right: 10px !important;}
	
	.operationRenseigner {float: none; display: block !important; margin-top: 10px !important;}
	.blocDateCDV .blocDateCDV-titre {display: block; }
	.blocDateCDV .blocDateCDV-options {display: block; margin-left: 0!important;}
		.blocDateCDV .blocDateCDV-options a {display: block; margin-left: 0!important;}

	#modifier-operation-form-new select, #modifier-operation-form-new input[type="text"] {width: 90% !important;}


	.flex-column.patronSuite .patronSuite-33 {width: 100%;}
}

/* iPhone */
@media only screen and (max-width: 767px) {
	.flex-column > div {width: 100%;}
	.flexBtn_action > * {width: 100%; text-align: center; margin-bottom: .2rem;}
}