.questionario_linguas{ float:right; text-align:right; padding-right:20px}
.questionario_linguas li{ text-align:center; list-style-type:none; background:#f4f4f4; padding:5px; margin:2px; display:inline-block; width:35px; }

.lingua_selecionada{ background:#dddddd; border:1px solid #C3C3C3}


#questionnaire{ margin:0 auto; width:99%; max-width:1024px; min-height:800px;}
#questionnaire .sucesso{ max-width:600px; padding:5px; margin:5px; background:#EDF3DD;}




#questionnaire h1 { font-size:2.0em; color:#003b5c}
#questionnaire .end { margin-top:50px  !important; padding:20px; font-size:1.5em; color:#333; line-height:2.em;  margin:0 auto; border:1px solid #f1f1f1}

#questionnaire .botoes { margin:10px 0 20px 0; border-top:1px solid #dddddd;}
#questionnaire tbody { }
#questionnaire .linha {   border-bottom:1px solid #cccccc; }
#questionnaire td { padding:5px }

#questionnaire select,
textarea,
input[type=text],
input[type=email],
input[type=date],
input[type=number],
input[type=password],
input[type=file] {
	border: 1px solid #ddd;
	padding: 5px;
	background-color: #ffffff;
	width:500px;
	
}


#questionnaire input[type=text]:focus,
input[type=email]:focus,
input[type=date]:focus,
input[type=number]:focus,
input[type=password]:focus,
input[type=file]:focus,
select:focus, 
textarea:focus {
	background: #fff;
	border: 1px solid #C5C5C5;
	box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
}


#questionnaire .btn_submit{ padding:10px; background:#d3832b; font-size:1.2em; min-width:140px;}
#questionnaire .btn_submit:hover{ background:#314B6A;}
#questionnaire .btn_cancel{ padding:10px; background:#cccccc; font-size:1.2em; border-radius:5px; min-width:130px}
#questionnaire .btn_cancel:hover{ background:#d3832b;}




.FormOptionChecked {
  display: block;
  position: relative;
  padding-left: 30px;
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 14px; font-weight: normal;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default checkbox */
.FormOptionChecked input[type=checkbox]{
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom checkbox */
.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 22px;
  width: 22px;
  background-color: #eee; border:1px solid #ccc;
}

/* On mouse-over, add a grey background color */
.FormOptionChecked:hover input ~ .checkmark {
  background-color: #ccc;
}

/* When the checkbox is checked, add a white background */
.FormOptionChecked input:checked ~ .checkmark {
  background-color: #fff;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.FormOptionChecked input:checked ~ .checkmark:after {
  display: block; 
}

/* Style the checkmark/indicator */
.FormOptionChecked .checkmark:after {
  left: 8px;
  top: 2px;
  width: 6px;
  height: 12px;
  border: 1px solid #000;
  border-width: 0 2px 2px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}
	
/*Radio button*/

.FormOptionChecked input[type=radio]{display: none;}
.radiomark {
  position: absolute;
  top: 0;
  left: 0;
  height: 22px;
  width: 22px;
  background-color: #eee; border:1px solid #ccc; border-radius: 50%;
}

/* On mouse-over, add a grey background color */
.FormOptionChecked:hover input ~ .radiomark {
  background-color: #ccc;
}

/* When the checkbox is checked, add a white background */
.FormOptionChecked input:checked ~ .radiomark {
  background-color: #fff;
}

/* Create the checkmark/indicator (hidden when not checked) */
.radiomark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.FormOptionChecked input:checked ~ .radiomark:after {
  display: block; 
}

/* Style the checkmark/indicator */
.FormOptionChecked .radiomark:after {
  left: 4px;
  top: 4px;
  width: 12px;
  height: 12px;
  line-height: 12px;
  background: #000;
  border-radius: 50%;
}

/********/

/* Barra progresso do questionario  */
.bara_progresso{ background:#ffffff; font-size:0.66em}
.progresso_bloco_seleted{ background-color:#d3832b; margin:5px; color:#ffffff; text-align:center; max-width:80px; float:left; height:100px; padding:2px;}
.progresso_bloco{ background-color:#939393; margin:5px; color:#ffffff; text-align:center; max-width:90px; float:left; height:100px; padding:2px;}


@media screen and (max-width: 1000px) {
.bara_progresso{font-size:0.59em;}
.progresso_bloco_seleted{ width:100%; max-width:45%; float:left;  height:50px;}
.progresso_bloco{ width:100%; max-width:45%; float:left; height:50px;}
	}