@import url('https://fonts.googleapis.com/css2?family=Sen:wght@400;700&display=swap');

body, p, img, table, ul, li, div, a, dl, dt, dd, form, fieldset, h1, h2, h3, h4 {
margin: 0;
padding: 0;
color: #000000;
font-family:'Sen';
}

ul {
margin-left : 15px;
}

h1 {
margin-top: 10px;
color : #000000;
font-size : 22px;
margin-bottom : 10px;
text-align: center !important;
background-color: none;
padding : 5px;
border-bottom: 1px solid #e16512;
}

h2 {
color : #000000;
font-size : 2.1em;
margin-bottom : 30px;
}

table {
border-collapse : collapse;
}


body {
/*background : url('https://helium-connect.fr/customers_data/576bef53441eec5082000005/images/bg-enquete-bleu.jpg') no-repeat 50% top fixed;   
min-width: 320px;*/
}


p {
margin-bottom : 0px !important;
  line-height:20px;
}

a, a:hover{
  color:#e16512 !important ;
}

#form_zone {
width : 100%;
/*max-width : 750px;
margin : 20px auto;

-webkit-box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.3);
box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.3);*/
/*padding: 0 10px;*/
background-color: #ffffff;
margin: 0 auto;
  padding: 5px;
}

#form_zone_inside {
margin : 0;
}

img.header{
margin-top:30px;
}

#header {
padding: 5px;
background-color: none;
}




#footer {
width: 100%;
background-color : #000000;
border-top : 1px solid #dddddd;
padding: 20px 0 20px 0;
margin-top:20px;
}

#footer p {
color : #ffffff;
margin-bottom:0;
}

#footer a {
text-decoration: none;
color : #80A031;
}

div.intro {
background-color : #ffffff;
width : 100%;
}

div.field {
/*margin : 10px auto;*/
padding : 5px 10px;
text-align : left;
}
label{
font-weight:400 !important;
}
div.field label {
margin-top: 0;
}

/* Style pour affichage de l'étoile "Obligatoire" à droite du dernier mot de la question */
div .field label.mandatory-label {
  display: block;
}

div .field label.mandatory-label span.mandatory-tag {
  display: inline;
  position: relative;
}

div.field.img-radio .input_zone {
text-align: center
}
div.field.text-input label p {
float: left;
padding-right: 15px;
}
div.field.text-input .input_zone input {
width: 200px;
}
div.field.select-input label {
float: left;
padding-right: 15px;
}
div.field.with-title label {
float: none !important;
padding-right: 0;
}
div.field.with-title label h1 {
margin-bottom: 20px;
}
div.field.with-title label p {
float: left;
padding-right: 15px;
}
div.field.select-input .select2 {
width: 200px !important;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
}
.select2-container .select2-selection--single,
.select2-container--default .select2-selection--single .select2-selection__arrow {
height: 20px !important;
}
div.field.textarea-input textarea {
width: 100%;
box-sizing: border-box;
padding: 5px;
max-width: 100%;
height: auto;
border: 1px solid #e16512;
margin-top: 15px;
}
div.field.centered label,
div.field.centered .input_zone {
text-align: center !important;
}
label {
color: #666;
position: relative;
display: block;
margin-bottom:0 !important;
font-size : 1.1em;
background-color : none;
text-align : left;
max-width: 100%;
  font-weight: 700 !important;
}

.question-apparente > label {
display : block;
padding : 5px 10px 0 10px;
position : relative;
font-size : 1.05em;	
border-radius : 0;
-moz-border-radius : 0; 
background-color : transparent;
min-width : 130px;
text-align : center;
color : #dddddd;
margin: 5px auto;
}
.question-apparente label p {
color : #666;
font-size: 1.1em;
line-height : 1.5;
}

.question-apparente:nth-last-child(1) div.input_zone {
display: inline-block;
width: auto;
}
.question-apparente:nth-last-child(2) div.input_zone {
display: inline-block;
width: auto;
}

label a {
/*color : #ffffff;
font:1.1em 'Helvetica Neue',Helvetica,Arial,sans-serif;
line-height : 1.5;*/
}


label * {

}

label p {
color : #333;
font-size: 13px;

}


/* labels associes aux boutons radios et check */

label.label-after-radio {
display : inline-block;
border : none;
color : #000000;	
cursor : pointer;
margin : 0;
padding : 5px 10px;
float : none;
background: none;
transition: background .3s;
font-size : 1em;
margin-left: 25px;
margin-top: -4px !important;
}

.field-radio label.label-after-radio {
margin-top: 0px !important;
}



label.label-after-check {
display : inline-block;
border : none;
color : #000000;	
cursor : pointer;
margin : 0 0 0 5px;
padding : 5px 10px;
float : none;
background: none;
transition: background .3s;
font-size : 12px;
text-align: justify;
}


div.input_zone {
position : relative;
width : 100%;
text-align : left;

}

span.mandatory-tag {
display : block;	
position : absolute;
right : -12px;
top : 2px;
font-size : 18px;
color : #ff0000;
display:none !important;
}

.mandatory-label p::after{
	content:"*";
	width:10px;
	left:10px;
	margin-left:10px;
	color : #ff0000;
}


div.field_info {
color : #777777;
margin-left : 230px;
font-size : 0.7em;
clear : left;
}


.spacer_right {
margin-right : 20px;
}


div#notice, .notice {
color : #c1cf0e;
display : inline-block;
margin : 10px 0;
font-weight : bold;
}

div#error, .error {
color : #ffffff;
text-align: center;
border: 1px solid #ff0000;
margin : 10px 0;
font-weight : bold;
background-color : #ff0000;
padding: 5px;
bottom : 8px;
font-size : 15px;
display:none;
}


div#alert, .alert {
color : #b00f43;
display : inline-block;
margin : 10px 0;
font-weight : bold;
}

div.field_errors {
position:absolute;
color : #f00;
font-size : 15px;
z-index: 100;
}




div.question-apparente:last-child div.field_errors {
width: 200px;
top: -14px;
background-color : #ffffff;
left: 0;
right: 0;
margin: 0 auto;
}

div.question-apparente div.field_errors {
top: -30px;
bottom: auto;
}

div.field_with_errors input, input.field_with_errors {
background-color : #d97272; 
/*  color : #ffffff; */
}


.error {
color : #85102B;
}


div.field_info {
color : #777777;
margin-left : 250px;
font-size : 0.7em;
clear : left;
}


div.tooltip_zone {
position : relative;
}


div.tooltip_text {
position : absolute;
z-index:9999;
display : none;
left : 50px;
color:#fff;
background-color : #444444;
padding : 8px;
opacity:0.85;
border-radius : 3px;
-moz-border-radius : 3px; 
}


div.input_zone > input {
height : 20px;
vertical-align : middle;
font-size : 12px;
padding: 0 0 0 10px;
outline: none;
color: #333;
border: 1px solid #CCC;
border-radius: 3px;
transition: all 150ms ease-in-out 0s;
width:97%;

}

input[type="text"],
input[type="email"],
input[type="password"] {
background-color : #fff;
box-sizing: border-box;
}
input.check_input {
width: auto;
}
input[type="text"] {
transition: box-shadow .3s;
}
input[type="text"]:hover, 
input[type="text"]:focus {
background-color: #ffffff;
}


input[type="text"]:focus {
box-shadow: 0 0 1px #222;
background-color: #ffffff;
}


textarea {
width : 50%;
height : 100%;
vertical-align : middle;
background-color : #ffffff;
border: 1px solid #CCC;
border-radius: 3px;
transition: all 150ms ease-in-out 0s;
}

textarea.txt_input {
	width : 100%;
	padding : 1%;
	resize: none;
	background-color: transparent;
  border: 2px solid #e16512;
  margin-top: 5px;
  max-height:70px;
}
textarea.txt_input:focus-visible {
  outline:  1px solid #e16512;
}


button, .button {
border : none;
background : none;
cursor : pointer;
  border:2px solid #e16512 ;
color : #333333;
padding : 15px 30px; 
text-decoration : none;
height : auto;
transition: background-color .3s;
-webkit-appearance: none;
border-radius : 3px;
font-weight: 300;
text-transform : uppercase;
font-size : 14px;
  margin:30px 0;
}

button:hover, .button:hover {
opacity:0.8;
}


button.previous-question {
display : inline-block;
position : relative;
background : none;
margin : 18px auto;
font-size : 1em;
text-align : center;
border: none;
cursor: pointer;
color: #666666;
padding: 15px 30px;
text-decoration: none;
height: auto;
transition: background-color .3s;
-webkit-appearance: none;
border-radius: 3px;
font-weight: 300;
width: 70%;
max-width: 200px;
}

button.previous-question:hover {
color : #141c33;
}

button.next-question {
margin:20px 0;
}



div#progression {
/*margin : 0 auto;
text-align : center;*/
margin-top : 12px;
padding : 12px 0;
background-color: #ffffff;
vertical-align : center;
position: absolute;
left: -2px;
top: 10px;
 display:none !important;
}

div#progression-maxi {
text-align : center;
}

div#progression-maxi span.todo {
      background-color: none;
    color: #92c020;
}

span.progression-item {
display : inline-block;
margin-left: 3px;
margin-right : 3px;
width : 20px;
height : 20px;
border-radius: 50%;
text-align : center;
color : rgba(0, 0, 255, 0);
border : none;
margin-bottom: 10px;
}
span.progression-item .chiffre {
display: block;
padding-top: 5px;
}
.progression-item.current .chiffre{
padding-top: 0;
height: 30px;
width: 30px;
border-radius: 50%;
color : #ffffff;
background-color : #e16512;
font-weight: bold;
}


span.progression-item.todo .chiffre,
span.progression-item.done .chiffre {
height: 20px;
width: 20px;
color : #e16512;
font-size:15px;
}
span.progression-item.todo .chiffre,
span.progression-item.current .chiffre {
line-height: 30px;
font-size:15px;
}
span.progression-item.todo .chiffre button,
span.progression-item.current .chiffre button,
span.progression-item.done .chiffre button {
display: block;
width: 100%;
height: 100%;
border-radius: 50%;
padding: 0;
font-size: .3em;
}

.progression-item.current .progression-label {
    padding-top: 0;
    height: 30px;
    width: 30px;
    border-radius: 50%;
    color: #ffffff;
    background-color: #e16512;
    font-weight: bold;
  	display: block;
}
span.progression-item.current .progression-label {
    line-height: 30px;
    font-size: 15px;
}
span.progression-item {
    display: inline-block;
    margin-left: 3px;
    margin-right: 3px;
    width: 30px;
    height: 20px;
    border-radius: 50%;
    text-align: center;
    color: rgba(0, 0, 255, 0);
    border: none;
    margin-bottom: 10px;
}
span.progression-item.todo {
    display: none !important;
}
.progression-item.done{
  display: none;
}

p.clear-util {
clear : both;
}


div.smart_option {
display : inline-block;
} 

div.nps .smart_option_block {
		border: 0;
		opacity: 0.7;
}

div.nps .smart_option_block:hover {
    border: 0;
    opacity: 0.9;
}

div.nps .smart_option_block:selected {
    border: 0;
    opacity: 1;
}

div.nps div.smart_option div.selected {
    border: 0;
    opacity: 1;
}

div.nps div.smart_option div.selected p {
  position: relative;
  top: -4px;
  -moz-box-shadow: 0px 4px 4px #333; 
  -webkit-box-shadow: 0px 4px 4px #333; 
  box-shadow: 0px 4px 4px #333; 
}

div.nps .smart_option_block p {
		font-size: 15px;
		line-height: normal;
		color: #fff;
		border: none !important;
		margin: 0px !important;
		padding-top: 15px !important;
		padding-bottom: 15px !important;
		text-align: center;
}

div.nps .smart_option_block {
		margin-right: 0;
		padding: 0;
}

div.nps .note {
		display: flex;
		flex-direction: row;
		justify-content: start;
		margin-top: 15px;
}

div.nps .note p {
		font-size: 11px;
		margin: 0;
}

div.nps .note p:last-child {
		margin-left: auto;
}

div.nps .smart_option {
		flex:1;
}

div.nps .smart_one {
		display: flex;
		flex-direction: row;
}

.zero {
		background-color: #e04056;
		margin-left: 0;
		-webkit-border-top-left-radius: 4px;
		-moz-border-radius-topleft: 4px;
		border-top-left-radius: 4px;
		-webkit-border-bottom-left-radius: 4px;
		-moz-border-radius-bottomleft: 4px;
		border-bottom-left-radius: 4px;
}

.un {
		background-color: #e64b61;
}

.deux {
		background-color: #e96359;
}

.trois {
		background-color: #ec7a50;;
}

.quatre {
		background-color: #ef8f45;
}

.cinq {
		background-color: #f2a841;
}

.six {
		background-color: #ddad44;
}

.sept {
		background-color: #c7b24e;
}

.huit {
		background-color: #b3b656;
}

.neuf {
		background-color: #9dbb5c;
}

.dix {
		background-color: #87bf64;
		-webkit-border-top-right-radius: 4px;
		-moz-border-radius-topright: 4px;
		border-top-right-radius: 4px;
		-webkit-border-bottom-right-radius: 4px;
		-moz-border-radius-bottomright: 4px;
		border-bottom-right-radius: 4px;
}


div.smart_option_block {
    border: 3px solid #ffffff;
    margin-right: 9px;
    padding: 3px;
    cursor: pointer;
}

div.smart_option_block p {
    margin-bottom: 0;
}

div.smart_option_block:hover {
    border: 3px solid #dddddd;
}

div.smart_option_block:selected {
    border: 3px solid #008C0C;
}

div.smart_multi_option_block {
    border: 3px solid #ffffff;
    padding: 14px;
    cursor: pointer;
}

div.smart_multi_option_block:hover {
    background-color: #dddddd;
}

div.smart_option div.selected {
    border: 3px solid #008C0C;
}



div.smart_option_block {

border : 3px solid transparent;
margin-right : 9px; 
padding : 7px;
cursor : pointer;
}
div.smart_option_block p {
margin: 0;
}

div.smart_option_block:hover {
border : 3px solid #dddddd;
}


div.smart_multi_option_block {

border : 3px solid #ffffff;
margin-right : 30px; 
padding : 14px;
cursor : pointer;
} 

div.smart_multi_option_block:hover {
background-color : #dddddd;
} 


div.smart_option div.selected {
border : 3px solid #e16512; 
} 


iframe {
border: none;
}

div.ui-slider-horizontal {
width : 490px;
height : 6px; 
margin-left : 40px;
margin-bottom: 30px;
}

div.slider_options {
width : 585px;
margin-bottom : 15px;
}

div.slider_option {
display : inline-block;
margin : 10px 0 0 0;
padding : 0px 2px;
vertical-align : top;
height : 30px;
}

div.slider_options div.selected {
font-weight : bold;
color : #00699e;

}

div.ui-slider-range {
background-image : none !important;
background-color : red !important;
}

a.ui-slider-handle {
background : url('images/curseur.png') no-repeat 1px -1px !important;
width : 21px !important;
height : 26px !important;
top : -11px !important;
left : -10px;
border : none !important;
}

a.ui-slider-handle:hover {
background : url('images/curseur.png') no-repeat 1px -1px !important;
border : none !important;
}


.field.slider-layout .input_zone {
float: none;
margin: 0 auto;
text-align: center;
width: 95%;
max-width: 550px;
}
.field.slider-layout .input_zone input {
width: auto;
}

.irs-line-mid, .irs-line-left, .irs-line-right, .irs-bar, .irs-bar-edge, .irs-slider {
background-color: #e16512;
background-image: none;
}

.irs-line-left, .irs-line-mid, .irs-line-right {
background-color: #E1E4E9;
}

.irs-from::after, .irs-to::after, .irs-single::after {
border-color: #e16512 transparent transparent;
}

.irs-from, .irs-to, .irs-single {
background-color: #e16512;
}

div.field.table-input table.grid_one {
margin-top: 0;
margin-left: 0;
width: 100%;
}
div.field.table-input table.grid_one div.radio_option {
width: auto;
margin: 0;
}
div.field.table-input table.grid_one th {
padding: 10px 0 5px 0;
}
div.field.table-input table.grid_one td.grid_option {
border-bottom: 1px solid #F2EFE9;
}
div.field.table-input table.grid_one td.grid_label {
width: 200px;
}

div.field.table-input table.grid_one td {
padding : 13px 0;
}

table.grid_one {
margin-top : 10px;
margin-left : 0px;
width : 98%;
}

table.grid_one th {
padding : 0 2% 2% 2%;
text-align : center;
color : #e16512;
font-size: 0.85em;
}

table.grid_one tr {
border-bottom: 2px solid #cccccc;
}

td.grid_option {
text-align : center;
}

/*td.grid_option:hover {
	background-color : #efefef;
}*/

td.grid_label {
	max-width: 165px;
	padding: 15px 8px;
	text-align : left;
	border-bottom : 1px solid #cccccc;
	font-size: 0.9em;
}

div.radio_option {
text-align : left;
margin: 5px 10px;
display: inline-block;
position: relative;
/**width: 46%;**/
}

div.radio_option input {
position : relative;
top : -2px;
cursor : pointer;
}

div.check_option {
text-align : left;
margin: 0 10px;
/*display: inline-block;*/
/*width: 210px;*/
}



table.results ul { 
list-style-type: none; 
margin-left: 6px;
margin-top : 12px;
}

table.results td {
padding : 8px;
border : 1px solid #d7d1c5;
}


li {
padding-left : 18px;
}

li.choosen {
background : url('images/coche-mini.png') no-repeat left 3px; 

}

span.expected_answer {
font-weight : bold;
color : #87ad29;
}

span.unexpected_answer {
color : #b00f43;
}


div.quiz_option_result {
display : inline-block;
padding : 2px;
margin-right : 10px;
}

div.expected_answer {
border : 1px solid #87ad29; 
}

div.choosen {
background : url('../images/coche-mini.png') no-repeat 4px 4px;
padding-left : 12px; 
}



div.answer_ok {
float : left;
margin-left : 10px;
width : 42px;
height : 60px;
background : url('images/coche.png') no-repeat left top; 
}

div.answer_not_ok {
float : left;
margin-left : 10px;
width : 42px;
height : 60px;
background : url('images/croix.png') no-repeat left top; 
}

div.answer {
margin-left : 80px;
}

div.submit_zone {
width : 100%;
clear : both;
/*margin : 40px auto;
padding-bottom: 40px;*/
text-align : center;
}

a.clue {
display : inline-block;
margin-top : 20px;
background : #95bf2d;
border-radius : 4px;
-moz-border-radius : 4px; 
padding : 4px;  
cursor : pointer;
border : none;
text-decoration : none;

}

a.clue:hover {
background : #927557;
color : #ffffff;
}


div.clue, div.confirm {
margin-top : 10px;
margin-bottom : 10px;
padding : 10px;
font-size : 1em;
background-color : #f5f1ee;
border-radius : 8px;
-moz-border-radius : 8px;   
}


div#score { 
font-size : 2em;
color : #87ad29;
}

span.chiffre {
color: #ffffff;
font-size : 1.7em;
vertical-align : center;

}


/* report */


table.report-listing, table.report-detail {
border-collapse : collapse;
margin-bottom : 20px;
}

table.report-listing tn, table.report-detail th {
font-weight : normal;
background-color : #00699e;
color : #ffffff;
background-image: linear-gradient(bottom, rgb(43,137,184) 9%, rgb(0,105,158) 55%);
background-image: -o-linear-gradient(bottom, rgb(43,137,184) 9%, rgb(0,105,158) 55%);
background-image: -moz-linear-gradient(bottom, rgb(43,137,184) 9%, rgb(0,105,158) 55%);
background-image: -webkit-linear-gradient(bottom, rgb(43,137,184) 9%, rgb(0,105,158) 55%);
background-image: -ms-linear-gradient(bottom, rgb(43,137,184) 9%, rgb(0,105,158) 55%);

background-image: -webkit-gradient(
linear,
left bottom,
left top,
color-stop(0.09, rgb(43,137,184)),
color-stop(0.55, rgb(0,105,158))
)


}

table.report-listing * {
font-size : 16px;
}


table.report-detail td {
border : 1px solid #e5e5e5;
}


table.report-detail td, table.report-detail th {
padding : 4px 8px;
vertical-align : middle;
}

table.report-detail td.label, table.report-listing td.label {
width : 400px;
}

table.report-listing th {
text-align : center;
}

table.report-listing tr {
border-bottom : 1px solid #e5e5e5;
}


table.report-listing td, table.report-listing th {
padding : 4px 8px;
vertical-align : middle;
border : 1px solid #e5e5e5;
}

table.report-listing td.action {
text-align : center;
}

table.report-listing td div.data {
position : relative;
height : 30px;
}

table.report-listing td.synthese {
font-weight : bold;
}

table.report-listing td.vide {
/*	background-color : #e5e5e5; */
}


table.report-listing th * {
color : #ffffff;	
}

table.report-listing th a {
border-radius: 5px; 
-moz-border-radius: 5px; 
-webkit-border-radius: 5px; 
font-size : 10px;
color : #00699e;
text-decoration : none;
display : inline-block;
background-color : #ffffff;
border : 1px solid #ffffff;
margin-top : 10px;
padding : 2px 4px;
transition: all 0.2s ease-in-out;

}

table.report-listing th a:hover {
background-color : #00699e;
color : #ffffff;
}

table.report-listing tr.alternate td, table.report-detail tr.alternate td {
background-color : #f5f5f5;
}

table.report-listing tr:hover td, table.report-detail tr:hover td {
background-color : #eeeeee;	
transition: all 0.2s ease-in-out;
}

table.report-listing td, table.report-detail td {
padding : 20px 14px;
}



table.report-listing div.percent {
position : absolute;
right : 0;
bottom : 0;
font-size : 9px;
}

div.percent.more {
color : green;

}

div.percent.less {
color : red;
}


td.currency {
text-align : right;
}

td.label, td.label p  {
color : #00699e !important;
}

td.std, td.std {
text-align : center;
}


table.report-detail td img, table.report-listing td img {
height : 40px;
width : auto;
}



/* commentaires */

div.comment {
margin-top : 14px;
}

div.comment-head {
color : #ffffff;
background-color : #00699e;
height : 21px;
padding : 4px 4px;
position : relative;
}

div.comment-buttons {
position : absolute;
right : 2px;
top : 0px;
}

div.comment-body {
border : 1px solid #e5e5e5;
padding : 2px 4px;
min-height : 80px;
}

img.user-photo {
display : block;
float : left;
height : 80px;
margin-right : 10px;
margin-bottom : 4px;
margin-left : 4px;
margin-top : 4px;
}



div.legend{
color: #444444;
text-align: justify;
padding: 5px;
margin: 15px 0;
line-height: 1.5;
font: 14px/16px Arial,'Open Sans',Helvetica,sans-serif;
}


div.field-footer {
margin : 4px 0;
clear : both;

}
.field.nps label{
width:100%;
}

.field.overflow {
    overflow-y: auto;
    position: relative;
}


/* VOTES */


div.poll span.mandatory-tag {
display : none;
}


h3.poll-result-title {
margin-top : 10px;
color : #95bf2d;
font-size : 16px;
}

table.poll-result td {
padding : 1px 4px;
}

table.poll-result td.poll-result-label {
font-size : 11px;
width : 150px;
}

table.poll-result td.poll-result-count {
font-size : 11px;
width : 50px;
text-align : right;
}

table.poll-result td.poll-result-graph {
width : 100px;
}

div.graph-bar {
height : 10px;
background-color : #95bf2d;
border-radius : 2px;
-moz-border-radius : 2px; 
}

div.poll div.submit_zone {
/*  margin : 10px 0 0 260px; */
margin : 10px 0 0 0;
text-align : center;
}
div.poll .button {
border-radius : 5px;
-moz-border-radius : 5px; 
padding : 2px; 
font-size : 12px;
}

div.poll label {
margin-bottom : 10px;
}

div.poll label.label-after-radio {
margin-bottom : 0;
}

div.poll div#error {
display : none;
}

div.poll div.field_errors {
font-size : 10px;
font-weight : normal;
}


table.score-result td {
padding : 1px 4px;
border-bottom : 1px solid #aaaaaa; 
}

table.score-result th {
background-color : #aaaaaa;
}

table.score-result td.score-result-label {
width : 300px;
}

table.score-result td.score-result-count {
width : 50px;
text-align : right;
}

table.score-result td.score-result-graph {
width : 100px;
}
table.output tr {
border : 1px solid #aaaaaa;
}

table.output td {
padding : 2px 6px 2px 6px;
}

td.question p {
margin-top : 6px;
}

td.question {
padding-right : 60px;
}


div.x-vml-base {
overflow: visible !important;
}

div.x-surface {
margin : 20px 0 40px 0;
}

div.x-surface svg {
padding : 20px;
overflow : visible;
}



.tableau .field-header {
height : 70px;
}

.tableau2 .field-header {
height : 115px;
}


div.tlabel {
width : 180px;
float : left;
}


.tableau2 div.tlabel {
width : 335px;
}

div.after-tlabel {
margin-left : 180px;
width : 570px;
padding : 0;

}



.tableau2 div.after-tlabel {
margin-left : 335px;
width : 415px;
}

div.tcol {
width : 90px;
padding : 0;
margin : 0;
float : left;
text-align : center;
font-size : 0.9em;
}

.tableau2 div.tcol {
width : 90px;
}

div.field.tableau {
border-top : 1px solid #aaaaaa;
}

.tableau label {
width : 180px;
float : left;
background : none;
height : 20px;
margin : 0;
font-size : 0.9em;
padding : 10px 0;
text-align : left;
}

.tableau.tableau2 label {
width : 335px;
height : 38px;
}

.tableau label p {
color : #1C91CC;
}

.tableau div.input_zone {
margin : 0;
padding : 0;
margin-left : 180px;
width : 570px;
}

.tableau.tableau2 div.input_zone {
width : 415px;
margin-left : 345px;
}

.tableau .radio_option {
float : left;
width : 90px;
padding : 0;
margin : 0;
text-align : center;
margin-top : 14px;
}

.tableau.tableau2 .radio_option {
width : 90px;
}

.tableau label.label-after-radio {
display : none;
}


.gd label {
float : left;
width : 50%;	
}


.gd div.input_zone {
width : 35%;
margin-left : 55%;
}

.gd .radio_option {
float : none;
text-align : left;
}

.gd label.label-after-radio {
display : inline-block;
border : none;
color : #636362;	
cursor : pointer;
margin : 0;
padding : 5px 4px;
float : none;
background: none;
}

div.field.noborder {
border-top : none;
}

a.nh_auto_click {
display: none;
}

.select2-container--default .select2-selection--single .select2-selection__arrow b {
border-color: #e16512 transparent transparent transparent;
border-style: solid;
border-width: 5px 4px 0 4px;
height: 0;
left: 50%;
margin-left: -4px;
margin-top: -2px;
position: absolute;
top: 50%;
width: 0;
}

.select2-container--default .select2-selection--single {
background-color: #fff;
border: none;
border-radius: 0;
border-bottom: 2px solid #e16512;
}
.select2-container--default .select2-selection--single .select2-selection__rendered, .select2-container--default .select2-selection--single .select2-selection__rendered {
  line-height: inherit !important;
}
.number {
position: absolute;
padding: 8px 15px;
background-color: #414042;
color: #ffffff;
display: inline-block;
margin-left: 12px;
}

.number + p {
display: inline-block;
margin-left: 80px;
}
.field-txt {
position: relative;
overflow: auto;
}
.field-txt .input_zone {
position: relative;
width: 100%;
float: none;
}
.field-txt .input-background {
background-color: #ffffff;
height: 36px;
border-radius: 3px;
position: absolute;
right: 5px;
width: 100%;
max-width: 250px;
z-index: 5;
}
.field-txt label {
float: left;
margin-bottom: 0;
}
div.field.field-txt label p {
line-height: 36px;
}
.field-txt input {
float: right;
margin-right: 5px;
width: 100%;
max-width: 250px;
background-color: transparent !important;
position: relative !important;
z-index: 10 !important;
}
.field-txt div.field_errors {
position: absolute;
z-index: 7;
margin-top: 0;
color: #ff0000;
background-color: transparent;
top: 4px;
right: 23px;
bottom: auto;
border: none;
font-size: 12px;
}
.field-radio .iradio_square {
position: absolute;
top: 5px;
}
.grid_option .iradio_square {
position: relative;
}
.iradio_square {
position: absolute;
}

.pays-larg .input_zone .select2.select2-container{
max-width: 300px;
width: 100% !important;
}


.field-radio .radio_option label {
margin-left: 27px;
}
.field-radio .field_errors {
width: auto !important;
}
.field-checkbox .check_option {
position: relative;
vertical-align: top;
}
.field-checkbox .icheckbox_square {
position: absolute;
top: 5px;
}
.icheckbox_square{
position:absolute;
}
.label-after-check{
left: 20px;
top: -5px;
}

.field-checkbox label {
margin-left: 27px;
}

.checkbox-field{
    position:relative;
    clear:both;
}
.checkbox-field div.input_zone{
    position: absolute;
    top: 12px;
}

.title{
font-size:30px;
line-height: 1.1em;
margin-bottom: 25px;
}
.oblig{
margin-top: 10px;
color: #db4437;
}

 div.input_zone > input{
border-radius:0;
border:none;
border-bottom:2px solid #e16512
}
div.input_zone > input:focus {
border-radius:0;
border:none;
border-bottom:2px solid #e16512;
background:transparent;
transition: width .250s ease-in, border-bottom .250s ease-in ;

}
input[type="text"]:focus{
box-shadow: none;
}

.confirm-form-zone #header{
 display:none;
}

table.grid_multi {
    margin-top: 10px;
    margin-left: 0px;
    width: 98%;
}
table.grid_multi th {
    text-align: center;
    color: #333333;
    font-size: 0.85em;
}

.canvas-container {
	border: 1px solid #cccccc;
}
.fieldset-footer{
	margin-top:10px;
}
.fieldset-footer{
	margin-top:10px;
}

::after, ::before {

    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;

}
élément {

    width: 172.333px;

}
.select2-container {
    width: 98% !important;

}
.no-padding{
	padding-right:0px !important;
  padding-left:0px !important;
}
.no-padding2{
	padding-right:0px !important;
  padding-left:0px !important;
}
.no-padding2 .field{
 padding: 10px 0;
	margin-left: -5px;
}

.fieldset-header{
    padding-left: 10px;
}
/******* NEW STYLE FOR CASE COCHE + MANDATORY *****/
.checkbox-field{
	position:relative;
	clear:both;
}
.checkbox-field p{
	margin-left: 30px;
	position: relative;
	z-index: 2;
	top:5px;
  font-weight: 400;
}
.checkbox-field div.input_zone{
	position: absolute;
}
.mandatory-tag{
	display: none !important;
}
.mandatory-label p::after{
	content:"*";
	width:10px;
	left:10px;
	margin-left:10px;
	color : #ff0000;
}
.checkbox-field.with-errors{
	border: 1px solid #ff0000;
}
.checkbox-field.with-errors .field_errors{
	display:none;
}

.select2-container--default .select2-results__option--highlighted[aria-selected]{

	background-color: #e16512;
}
.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
    border-color: transparent transparent #e16512 transparent;
}


@media screen and (max-width: 620px) {

}


@media screen and (max-width: 500px) {

div.field label p {
	margin-bottom: 10px;
}
div.field label {
	display: block;
}
div.field.field-radio label,
div.field.field-checkbox label {
	text-align: left !important;
}
div.field .check_option label {
	display: inline-block !important;
	margin-bottom: 2px;
}

.number {
	position: relative;
}
.number + p {
	margin-left: 0;
}
.field-txt input {
	float: none;
	margin-right: 0;
}
.field-txt div.field_errors {
	left: 0;
	right: 0;
	margin: 0 auto;
}
.field-txt .input-background {
	left: 0;
	right: 0;
	margin: 0 auto;
}
.field-radio .radio_option {
	width: auto;
}

}



@media screen and (max-width: 326px) {

div.question-apparente div.field_errors {
	top: -66px;
	bottom: auto;
}
#form_zone{
	padding:0;
}
div.field-footer {
    width: 85%;
}

div.input_zone > input{
	width:100%;
}
.text-case {
	margin-right: 0px;
}
#title-img-txt, #title-txt-img {
    padding: 10px !important;
}
#text-text {
	padding: 10px;
}

}





@media only screen and (max-width: 760px), (min-device-width: 768px) and (max-device-width: 1024px)  {
  /* Force table to not be like tables anymore */
  .gridresp .table, .gridresp thead, .gridresp tbody, .gridresp th, .gridresp td, .gridresp tr {
    display: block;
  }

  /* Hide table headers (but not display: none;, for accessibility) */
  .gridresp tr:first-child {
    position: absolute;
    top: -9999px;
    left: -9999px;
  }

  .gridresp tr {
  	border: 1px solid #ccc;
  	margin: 5px 0;
  }

  .gridresp td {
    /* Behave  like a "row" */
    border: none;
    border-bottom: 1px solid #eee;
    position: relative;
    padding-left: 50% !important;
  }

  .gridresp td:before {
    /* Now like a table header */
    position: absolute;
    /* Top/left values mimic padding */
    top: 6px;
    left: 6px;
    width: 45%;
    padding-right: 10px;
    white-space: nowrap;
  }
  
  .gridresp td.grid_label {
  	max-width: 100%;
  	text-align:center;
  	font-weight: bold;
  }

  .gridresp td:nth-of-type(1):before { content: " "; }
  .gridresp td:nth-of-type(2):before { content: "Très satisfaisant"; }
  .gridresp td:nth-of-type(3):before { content: "Satisfaisant"; }
  .gridresp td:nth-of-type(4):before { content: "Peu satisfaisant"; }
  .gridresp td:nth-of-type(5):before { content: "Insatisfaisant"; }
}