@CHARSET "ISO-8859-1";

#operacao{
	padding: 2rem 0 1.5rem;
}
#operacao input[type="text"] {
    margin: 10px 20px;
    padding: 10px 20px;
    height: 45px;
    max-width: 88%;
    text-align: center;
    text-transform: uppercase;
    font-size: 21px;
    border-radius: 50px;
    background: #FFFFFF;
}
#operacao .text-verde{
	color: #58b467;
	padding-left: 15%;
}
#operacao .text-azul{
	color: #18549d;
	padding-left: 20%;
}

#operacao .text-verde2{
	color: #58b467;
	padding-left: 20%;
}
#operacao .text-azul2{
	color: #18549d;
	padding-left: 25%;
}

#operacao #setas{
	padding: 0 0 .5rem !important;
}
#operacao #setas #esq img{
    position: relative;
    left: 3rem;
}
#operacao #setas #dir img{
    position: relative;
    right: 3rem;
}
#initResult{
	display: none;
}
#operacao #selecionaCidade{
	padding: 0;
}
#operacao label{
	color: #58b467;
	text-transform: uppercase;
	font-weight: 600;
	cursor:default;
	/*padding-left:15px;*/
}
#operacao .has-tip{
	border: none;
    position: relative;
    left: 1%;
    top: -1px;
}

.tooltip {
  color: #344453;
  background: #dadada;
  font-size:11px;
  border-radius: 10px;
  max-width: 200px; 
  text-align:justify;
}
.tooltip .nub {
    display: block;
    position: absolute;
    width: 0;
    height: 0;
    border: solid 5px;
    border-color: transparent #dadada transparent  transparent!important;
    top: -(5px * 2);
    pointer-events: none;
}

.pLabel{
	color:#58b469;
}

.tooltip .green:hover{display:none;}
#operacao .wrap-input-cotacao {
    border-radius: 100px;
    width: 90%;
    max-width: 100%;
    padding: 3px;
    margin: 10px 20px;
    position: relative;

}
#operacao .wrap-input-cotacao.wrap-local {
    background: url(/dolar_hoje/img/icon-select.png) no-repeat 5% 50% #e6e6e6;
    border: 1px solid #e6e6e6;
	box-shadow: 0 0 0 2px white inset;
}
#operacao .wrap-input-cotacao select {
    background: url(/dolar_hoje/img/icon-select-down.png) no-repeat 93% 50% #e6e6e6;
    border: none;
    border-radius: 100px;
    outline: none;
    width: 89%;
    max-width: 100%;
    float: right;
    margin: 0;
    padding: 0 15px;
    height: 40px;
    font-size: 15px;
    font-weight: 600;
    color: #344453;
    text-transform: uppercase;
    -webkit-appearance: none;
    -moz-appearance:    none;
    appearance:         none;
}
#compare #call p{
	height: 45px;
	width: 90%;
	margin: 0 auto;
	font-size: 16px;
	padding-top: .7rem;
	color: #FFFFFF;
	background: #eb6909;
	border-radius: 50px;
	margin-bottom: .5rem;
}

#veja-mais{
	margin-top: 0.8rem;
}
#veja-mais a{
	text-transform: uppercase;
	font-size: 12px;
}
#numeros{
	padding: 2rem 0;
}
#numeros fieldset{
	border-radius: 50px;
	padding: 2rem 1rem;
	margin: 0;
	border: 1px solid #354252;
	height:392px;
}
#numeros legend{
	font-size: 18px;
	color:#18539f;
	font-weight: 600;
	padding: 0 .5rem;
	text-align: center;
}
#numeros #onde h5{
	font-weight: 600;
	font-size: 14px;
}

#numeros .wrap-input-cotacao.wrap-local {
    background: url(/dolar_hoje/img/icon-select.png) no-repeat 5% 50% #e6e6e6;
    border: 1px solid #e6e6e6;
	box-shadow: 0 0 0 2px white inset;
}
#numeros .wrap-input-cotacao select {
    background: url(/dolar_hoje/img/icon-select-down.png) no-repeat 93% 50% #e6e6e6;
    border: none;
    border-radius: 100px;
    outline: none;
    width: 89%;
    max-width: 100%;
    float: right;
    margin: 0;
    padding: 0 15px;
    height: 40px;
    font-size: 15px;
    font-weight: 600;
    color: #344453;
    text-transform: uppercase;
    -webkit-appearance: none;
    -moz-appearance:    none;
    appearance:         none;
}



#numeros #variacao .tabs {
	margin-top: 0.7rem;
}
#numeros #variacao .tabs .tab-title a{
	padding: 0 0.4rem;
	border: 1px solid #d2d2d2;
	outline: none;
}
#numeros #variacao .tabs .tab-title.active a {
	background: #58b469;
	color: #FFFFFF;
}

#numeros #variacao .wrap-input-cotacao{
	margin-bottom: 0;
	padding: 0;
	border: none;
	box-shadow: none;
}
#numeros #variacao .tabs-content{
	margin-bottom: 0!important;
}

#numeros #variacao fieldset{
	border-radius: 50px;
}

#numeros #variacao .wrap-input-cotacao.wrap-local {

    background: url(/dolar_hoje/img/icon-select-green.jpg) no-repeat 5% 50% #62b468;
}
#numeros #variacao .wrap-input-cotacao select {
    background: url(/dolar_hoje/img/icon-select-down-green.jpg) no-repeat 94% 56% #62b468;
    border: none;
    border-radius: 100px;
    outline: none;
    width: 89%;
    max-width: 100%;
    float: right;
    margin: 0;
    padding: 0 15px;
    height: 40px;
    font-size: 15px;
    font-weight: 100;
    color: #FFFFFF;
    text-transform: uppercase;
    -webkit-appearance: none;
    -moz-appearance:    none;
    appearance:         none;
}
#variacao .wrap-input-cotacao.wrap-local {
    background: url(/dolar_hoje/img/icon-select-green.jpg) no-repeat 5% 50% #62b468;
}
#variacao .wrap-input-cotacao select {
    background: url(/dolar_hoje/img/icon-select-down-green.jpg) no-repeat 90% 50% #62b468;
    border: none;
    border-radius: 100px;
    outline: none;
    width: 89%;
    max-width: 100%;
    float: right;
    margin: 0;
    padding: 0 15px;
    height: 40px;
    font-size: 15px;
    font-weight: 100;
    color: #344453;
    text-transform: uppercase;
    -webkit-appearance: none;
    -moz-appearance:    none;
    appearance:         none;
}
#numeros #variacao .tabs {
	margin-top: 0.7rem;
	width: 100%;
}
#numeros #variacao .tabs .tab-title a{
	padding: 0 0.4rem;
	border: 1px solid #d2d2d2;
	outline: none;
}
#numeros #variacao .tabs .tab-title.active a {
	background: #58b469;
	color: #FFFFFF;
}

#variacao .tabs .tab-title a{
	padding: 0 0.4rem;
	border: 1px solid #d2d2d2;
	outline: none;
}
#variacao .tabs .tab-title.active a {
	background: #58b469;
	color: #FFFFFF;
}
#faq{
	padding: 1rem 0;
}
#faq h2{
	font-size: 23px;
	font-weight: 300;
	padding-bottom: 0.5rem;
	text-align: center;
}
#faq h3{
	font-size: 18px;
	font-weight: 600;
	padding-bottom: 0.5rem;
}
#faq p{
	text-align: left;
	padding: 0 4rem;
}

.text-azul::-webkit-input-placeholder {
    color: #18549d;
    font-size: 21px;
}
.text-azul:-moz-placeholder {
    color: #18549d;
    font-size: 21px;
}
.text-azul::-moz-placeholder {
    color: #18549d;
    font-size: 21px;
}
.text-azul:-ms-input-placeholder {  
    color: #18549d;
    font-size: 21px;
}

.text-verde::-webkit-input-placeholder {
    color: #58b467;
    font-size: 21px;
}
.text-verde:-moz-placeholder {
    color: #58b467;
    font-size: 21px;
}
.text-verde::-moz-placeholder {
    color: #58b467;
    font-size: 21px;
}
.text-verde:-ms-input-placeholder {  
    color: #58b467;
    font-size: 21px;
}

#div-notas{
	 border: 1px #e9e9e9; border-style:none none solid none;
}

.containerGraphicMobile{width: 243px; height: 280px; margin: 0 auto;background:#ededed;border-radius:50px;}
.containerGraphicMobile1{width: 243px; height: 280px; margin: 0 auto;background:#ededed;border-radius:50px;}
.containerGraphicMobile2{width: 243px; height: 280px; margin: 0 auto;background:#ededed;border-radius:50px;}
.containerGraphicMobile3{width: 243px; height: 280px; margin: 0 auto;background:#ededed;border-radius:50px;}
.containerGraphicMobile4{width: 243px; height: 280px; margin: 0 auto;background:#ededed;border-radius:50px;}

@media only screen and (max-width: 62em) {
	.containerGraphic{width: 243px; height: 200px; margin: 0 auto;background:#ededed;border-radius:50px;}
	.containerGraphic1{width: 243px; height: 200px; margin: 0 auto;background:#ededed;border-radius:50px;}
	.containerGraphic2{width: 243px; height: 200px; margin: 0 auto;background:#ededed;border-radius:50px;}
	.containerGraphic3{width: 243px; height: 200px; margin: 0 auto;background:#ededed;border-radius:50px;}
	.containerGraphic4{width: 243px; height: 200px; margin: 0 auto;background:#ededed;border-radius:50px;}
	#variacao .tabs .tab-title a{
		padding: 0 .8rem;
	}

	#numeros fieldset {
	    border-radius: 50px;
	    padding: 2rem 1rem;
	    margin: 0;
	    border: 1px solid #354252;
	}
	#variacao fieldset{
		border-radius: 50px;
	    padding: 2rem 1rem;
	    margin: 0;
	    border: 1px solid #354252;
	}
	#variacao{
		background: #FFFFFF;
	}
	#variacao fieldset{
		border-radius: 50px;
	    padding: 2rem 1rem;
	    margin: 0;
	    border: 1px solid #354252;
	}
	#variacao h3{
		text-align: center;
		margin: 0;
		padding: 0;
		color: #17569d;
		font-size: 17px;
		font-weight: 800;
	}
	#faq{
		background: #f5f5f5;
		margin-top:2rem;
		padding: 2rem 0;
	}
}

@media (min-width : 21em) and (max-width: 40em) {
	.containerGraphic{width: 243px; height: 200px; margin: 0 auto;background:#ededed;border-radius:50px;}
	.containerGraphic1{width: 243px; height: 200px; margin: 0 auto;background:#ededed;border-radius:50px;}
	.containerGraphic2{width: 243px; height: 200px; margin: 0 auto;background:#ededed;border-radius:50px;}
	.containerGraphic3{width: 243px; height: 200px; margin: 0 auto;background:#ededed;border-radius:50px;}
	.containerGraphic4{width: 243px; height: 200px; margin: 0 auto;background:#ededed;border-radius:50px;}
	.intro-resultado{
		/*background: none;*/
	}
	
	#operacao input[type="text"]{
		padding: 0;
		max-width:100%;
		margin: 10px 0;
	}
	#operacao .wrap-input-cotacao{
		
		width: 100%;
		margin: 1.5rem 0 0;
	}
	#operacao .wrap-input-cotacao.wrap-local {
	    background: url(/dolar_hoje/img/icon-select.png) no-repeat 6% 50% #e6e6e6;
	}
	#operacao #selecionaCidade{
		padding-left: 0.9375em;
    	padding-right: 0.9375em;
	}
	#operacao .wrap-input-cotacao select{
		width: 83%;
		font-size: 14px;
		padding:0;
	}
	#operacao .text-verde{
		
		width: 100%;
		/*margin: 1.5rem 0 0;*/
	}
	
	#operacao label{
		color: #58b467;
		text-transform: uppercase;
		font-weight: 600;
		cursor:default;
		/*padding-left:15px;
		padding-top:10px;*/
	}
	
	#numeros{
		padding: 0;
		border: 2px #ddd; 
		border-style:solid none dashed none;
	}
	
	#numeros #variacao .pagination{
		float: none;
	    margin: 0 auto;
    	width: 40%;
	}
	
	#numeros fieldset{
		border: none;
		padding: 0;
		height:330px;
	}
	#numeros legend{
		background: transparent;
		font-size: 18px;
		padding: 1.5rem 0 0rem;
	}
		
	#variacao{
		background: #FFFFFF;
	}
	#variacao fieldset{
		border: none;
	}
	#variacao h3{
		text-align: center;
		margin: 0;
		padding: 0;
		color: #17569d;
		font-size: 17px;
		font-weight: 800;
	}
	#variacao .tabs .tab-title a{
		padding: 0 .4rem;
	}
	#variacao .tabs-content canvas{
		width: 220px!important;
		height: 142px!important;
	}
	#variacao .wrap-input-cotacao{
		/*margin: 10px 0;*/
		width: 100%;
		margin: 2rem 0 0;
	}
	#variacao .wrap-input-cotacao.wrap-local {
	    background: url(/dolar_hoje/img/icon-select-green.jpg) no-repeat 6% 50% #62b468;
	}
	#variacao .wrap-input-cotacao select{
		font-size: 13px;
		color: #FFFFFF;
	}
	.tabs{
		width: 60%;
		margin: 1rem auto 2rem;
	}
	#onde{
		background: #f5f5f5;*/
	}
	#onde .item{
		min-height: 2rem;
		margin-bottom: 0.5rem;
		padding: 0;
	}
	#onde .columns + .columns:last-child{
		float: left;
	}
	#compare #call p{
		height: 45px;
		width: 90%;
		margin: 0 auto;
		font-size: 17px;
		padding-top: .6rem;
		color: #FFFFFF;
		margin-left:2.5%;
		margin-top:-0.5rem;
	}
	#veja-mais{
		margin-top: 1rem;
		margin-left:-2.5%;
	}
	.wrap-input-cotacao input, .wrap-input-cotacao select{
		width: 85%;
	}
	#variacao .wrap-input-cotacao select{
		color: #FFFFFF!important;
	}
	#faq{
		background: #fbfbfb;
		padding: 1rem 0;
		margin: 0;
	}
	#faq p{
		padding: 0 0.5rem;
		text-align: center;
	}
	
	#faq h2{
		font-size: 19px;
		font-weight: 300;
		padding-bottom: 0.5rem;
		text-align: center;
	}	
	
	#operacao .text-azul2{
		color: #18549d;
		padding-left: 15%;
	}
	#operacao .text-verde2{
		color: #58b467;
		padding-left: 15%;
	}
	
	#div-notas{
	 /*border: 1px #e9e9e9;*/ 
	 border-style:none none none none;
	}

}


@media only screen and (max-width : 21em) {
	.tabs{
		width: 60%;
		margin: 1rem auto 2rem;
	}
	#variacao .wrap-input-cotacao select{
		color: #FFFFFF!important;
	}
	#onde{
		background: #f5f5f5;*/
	}
	#onde .item{
		min-height: 2rem;
		margin-bottom: 0.5rem;
		padding: 0;
	}
	#onde .columns + .columns:last-child{
		float: left;
	}
	#numeros #variacao .pagination{
		float: none;
	    margin: 0 auto;
    	width: 40%;
	}
	
	#numeros fieldset{
		border: none;
		padding: 0;
	}
	#numeros legend{
		background: transparent;
		font-size: 17px;
		padding: 1.5rem 0 2rem;
	}
	#faq{
		background: #f5f5f5;
		padding: 1rem 0;
		margin: 0;
	}
	#faq p{
		padding: 0 0.5rem;
		text-align: center;
	}
	#operacao {
		padding-bottom: 12px;
	}
	
}