:root{ 	
	--left1:460px; 
	--left1b:calc(var(--left1) + 50px);
	--top1:40px; 	
	
	--left2:calc(var(--left1));
	--left2b:calc(var(--left1) + 50px);
	--top2:calc(var(--top1) + 65px);	
	
	--left4:455px; 
	--top4:160px; 

}

/* -------------------------------- */

.confirmarBtn {
	position:absolute;
	width:90px;
	height:25px;		
	border-radius: 5px;
	color:white;
	font-size: 13px;	
	font-family: Helvetica, Arial, sans-serif;
}

.confirmarBtn:hover {
	cursor: pointer;
	color:#2c3e50;
	background: white;
	outline: none;
}

/* -------------------------------- */

.btnVariar {
	position:absolute;
	width:35px;
	height:35px;		
	border-radius: 5px;
	color:#34495e;
	font-size: 25px;	
	font-family: Helvetica, Arial, sans-serif;
	font-weight:700;
}

.btnVariar:hover {
	cursor: pointer;
	color:#34495e;
	background: white;
	outline: none;
}

.btnVariar:active { 
  outline: none;
  color:red;
}

.resposta {         
	margin-top:0px;
	width:70px;
	color:rgb(0,0,100);
	background-color:rgba(200,200,255,0.1);	
	padding:3px;
	font-weight:bold;
	font-size: 15px;
	text-align:center;
}	

/* -------------------------------- */

.btnVideo {
  -webkit-transition: all 150ms ease-out;
          transition: all 150ms ease-out;
  display: inline-block;
  padding: 7px 10px;
  background: white;
  border-radius: 2px;
  margin: 5px;
  outline: none;
  font-family: "Open Sans", sans-serif;
  cursor: pointer;
  font-size: 10px;
  font-weight: 700;
  color: rgba(0, 0, 0, 0.7);
  border: 1px solid #5A5858;
}

.btnVideo:hover {
	cursor: pointer;
	color:#2c3e50;
	background: #ecf0f1;
	outline: none;
}

/* -------------------------------- */

.checkbox{
	position:absolute;		 
	padding: 8px 10px 10px 30px;	
	text-align:left;
	color: #2c3e50;
	letter-spacing: 2px;
	text-indent: 0px;
	font-family: "verdana";
	font-size: 11px;
	font-weight: bold;
}

.checkbox input {
  position: absolute;
  top:3px;
  left:0px;
  opacity: 0.7;  
  cursor: pointer;
  height: 20px;
  width: 20px; 
}

/* ------------------------------- */

.slider1 {
  position:absolute;		
  -webkit-appearance: none;
  width: 100%;
  height: 15px;
  background: #dfe4ea;
  outline: none;
  opacity: 0.9;
  -webkit-transition: .2s;
  transition: opacity .2s;
}

.slider1:hover {
  opacity: 0.8;
}

.slider1::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 15px;
  height: 25px;
  background: #2e86de;  
  cursor: pointer;
}

.slider1::-moz-range-thumb {
  width: 25px;
  height: 25px;
  background: #4CAF50;
  cursor: pointer;
}

/* ------------------------------- */

.imagem {
  display: block;
  margin: 0px auto;
  max-width: calc(100% - 30px);
  padding: 5px;  
}

.sombra {  
  box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.25);
}

.borda {
	width:500px;	
	height:280px;
	border-bottom: 10px solid #2e86de;
}

/* ------------------------------- */

.cor1{
	border: 2px solid #2e86de;
	background-color:white;
}

.cor2{
	border: 2px solid #e84118;
	background-color:white;
}

.blue{
	border: 2px solid #2980b9;
	background-color:white;
}

.orange{
	border: 2px solid #d35400;
	background-color:white;
}

.orange2{
	border: 2px solid #d35400;
	background-color:#d35400;
}

.green {
	border: 2px solid #16a085;
	background-color:white;
}

.green2 {
	border: 2px solid #16a085;
	background-color:#16a085;
}