/* vars */
/**********************************/
/*      para todas as p‡ginas     */
/**********************************/
/* cores */
/**************************************************/
/* Inicia servi�os externos (Dashboard) */
/**************************************************/

/* Abrevia�›es da CGE
PN - poucas nuvens
CC - cŽu claro
PI - pancadas isoladas
PN - poucas nuvens
PC - pancadas de chuva
*/

#adds, #sem-adds{position:relative;}
#twitter-box{
	background: rgba(0, 0, 0, 0.7);
	width: 320px;
	height:94px;
	position:absolute;
	z-index:66666;
	right:10px;
	top: 340px;
	color:#fff;
	padding: 8px 10px!important;
}


#twitter-box h4{padding: 5px 10px 0;}
#twitter-box a, #twitter-box h4 {
	color:#fff;
	width: 297px;
	background: rgba(0, 0, 0, 0.8);
    
}

#twitter-box li{ 
	padding: 5px 15px 5px 10px;
	background: rgba(0, 0, 0, 0.8);
	width: 294px;
	height: 64px;
	overflow:hidden;
}

.labelsp{display: inline;}
#twitter-box b{color:#bbb}

#twitter-box .rw, #twitter-box .fw{
	width:19px;
	height:32px;
	border:0;
	-webkit-border-radius:0;
	-moz-border-radius:0;
	border-radius:0;	
	position: absolute;
	right: 5px!important;
}


#twitter-box .rw{	
	background:#fff url(../img/sprite.png) no-repeat -581px -240px;
	top: 22px!important;
}

#twitter-box .fw{
	background:#fff url(../img/sprite.png) no-repeat -562px -240px;
	top: 56px;
}

#externos ul, #externos li{list-style:none;}
#externos {
  position: absolute;
  z-index: 5;
  background: rgba(0, 0, 0, 0.7);
  width: 340px;
  height: 360px;
  color: #fff;
  margin-right: 10px;
  overflow: hidden;
  right: 0;
  color: #fff;
  z-index:5555;
}

#externos a {
  color: #fff;
}


#mapa-serv{
    background:url(../img/sprite.png) no-repeat -237px -234px;
    width:320px;
    height:40px;
    position:absolute;
    margin-left:11px;
    top: 295px;
    cursor:pointer;
}

.azul-gd {
  color: #6dcff6;
  font-size: 1.3em;
}


.azul-pq {
  color: #6dcff6!important;
}

.amarelo {color:#fcc634;}
.verde {color:#7ddc6f;}

.e-abrir, .e-fechar{
	border: 0;
  width: 27px;
  height: 27px;
  float: right;
  margin-top: -5px;
  margin-bottom: 0;
	
  font-weight: bold;
}


.e-abrir, .e-abrir:hover, .e-abrir:focus {  
	background-image: url(../img/sprite.png);
	background-position: -482px -56px;
  
  background-color: transparent;
  border: 0;
}


.e-fechar,  .e-fechar:hover, .e-fechar:focus{
	background-image: url(../img/sprite.png);
    background-position: -449px -56px;
    background-color: transparent;
  border: 0;
}






.dash-header {
  display: block;
  font-size: 0.9em;
  padding: 10px 10px;
  text-transform: uppercase;
  font-weight: bold;
}

.dash-header a {
  color: #8fcc86 !important;
  display: inline-block;
}

.dash-header .drop {
  display: inline-block;
}



.verde-dash {
  color: #8fcc86;
}

.green-arrow-down {
  background: url(../img/sprite.png) no-repeat -440px -41px;
  width: 10px;
  height: 10px;
  display: inline-block;
}


#servicos-externos {
  font-size: 12px;
  width: 320px;
  overflow: hidden;
  height: 270px;
  position: relative;
  margin: 0 auto;
}

#servicos-externos li {
  width: 106px;
  height: 130px;
  position: relative;
  float: left;
  background: rgba(20, 20, 20, 0.6);
  text-align: center;
}

#servicos-externos li:hover .ex-hover, #servicos-externos li:focus .ex-hover {
  display: block;
}

.dash-border {
  line-height: 13px;
  padding: 7px 5px;
  height: 114px;
  border-left: 1px rgba(150, 150, 150, 0.2) solid;
  border-top: 1px rgba(150, 150, 150, 0.2) solid;
}

.titulo-dash {
  color: #6dcff6;
  height: 1.5em;
  display: block;
}


.ex-hover {
  background: rgba(0, 0, 0, 0.8);
    width: 104px !important;
    height: 129px !important;
    position: absolute !important;
    top: 0;
    z-index: 6666;
    display: none;
    cursor: pointer;
}

.ex-hover div {
  background: url(../img/sprite.png) no-repeat -725px 0;
  z-index: 3;
  height: 35px;
  width: 35px !important;
  border: 0 !important;
  position: relative;
  margin: 68px auto 0 auto;
}


.dash-img {
  display: block;
  margin: 0 auto;
  background-image: url(../img/sprite.png);
  background-repeat: no-repeat;
}





.ex-clima .dash-img {
  width: 65px;
  height: 60px;
}


.o2quali {
  background-position: -52px -52px;
  width: 50px;
  height: 50px;
    margin-top:10px;
}


.ex-aero .dash-img {
  background-position: -104px -52px;
  width: 50px;
  height: 50px;
}


.ex-publico .dash-img {
  background-position: -156px -52px;
  width: 50px;
  height: 50px;
}


.semaforo {
  background-position: -213px -60px;
    width: 40px;
    height: 40px;
}


.ex-rodizio .dash-img {
  background-position: -260px -52px;
  width: 50px;
  height: 50px;
}


.ex-publico > div, .ex-transito, .ex-rodizio {
  border-bottom: 1px rgba(150, 150, 150, 0.2) solid;
}

.ex-rodizio > div, .ex-aero > div {
  border-right: 1px rgba(150, 150, 150, 0.2) solid;
}


.dash {
  width: 300px;
  height: 242px;
  display: none;
  margin:0 15px;
  padding: 5px 10px;
  background: rgba(0, 0, 0, 0.5);
    position: relative;
}

.dash h3 {
  padding: 0;
  color: #6dcff6;
  border-bottom: 1px white solid;
  font-weight: bold;
    line-height: normal;
    padding: 0 0 3px;
}

.fechar-dash {
  background: #fff;
  font-size: 0.9em;
  font-weight: lighter;
  height: 17px;
  width: 17px;
  padding: 0;
  border: 0;
  position: absolute;
  right: 16px;
    top: 7px;
  text-align: center;
  border-radius: 0;
}

.load-bar{
    background:rgba(0,0,0,0.9);
    position:absolute;
    z-index:999999;
    width:100%;
    height:105px;
    bottom:0;
    border-left:1px #666 solid;
    border-right:1px #666 solid;
    border-bottom:1px #666 solid;
}

.load-bar img{margin-top:30px;}

/******************************************/
/*************mini dash clima**************/
/******************************************/
.cr, .pc, .pi{background-position: 0 -105px;}
.nc, .nc-noite{background-position: -243px -107px;}
.pn{background-position: -97px -107px;}
.en{background-position: -195px -105px;}
.cv, .cv-noite{background-position: -195px -152px;}
.cc{background-position: -145px -105px;}
.nb, .nb-noite{background-position: -195px -105px;}
.ch, .tp, .ch-noite, .tp-noite{background-position: -243px -107px;}

.cr-noite, .pi-noite{background-position: 0 -154px;}
.pn-noite{background-position: -96px -153px;}
.en-noite{background-position: -49px -154px;}
.pc-noite{background-position: -95px -154px;}
.cc-noite{background-position: -145px -153px;}


.tempo-p {
                    background: url(../img/sprite.png) no-repeat;
                    width: 40px;
                    height: 40px;
                    position: relative;
                    margin: 0 auto;
                    clear: both;
                }

.cr-pq, .pc-pq, .pi-pq{background-position: 0 -203px;}
.nc-pq, .nc-pq-noite{background-position: -195px -203px;}
.pn-pq{background-position: -78px -202px;}
.en-pq{background-position: -156px -203px;}
.cv-pq, .cv-pq-noite{background-position:-155px -242px;}
.cc-pq{background-position: -116px -203px;}
.nb-pq, .nb-pq-noite{background-position: -157px -203px;}
.ch-pq, .tp-pq, .ch-pq-noite, .tp-pq-noite{background-position: -195px -203px;}

.cr-pq-noite, .pc-pq-noite, .pi-pq-noite{background-position: 0 -242px;}
.pn-pq-noite{background-position: -78px -242px;}
.en-pq-noite{background-position: -156px -203px;}
.cc-pq-noite{background-position: -117px -242px;}




#temp-bloco{border-bottom:1px dotted #aaa;position:relative; float:left; clear:both;}
                #t-agora{position:relative; float:left; margin: 2px 7px 0;}
                #t-media{width:172px; position:relative; float:left; text-align:center; margin-top:10px;}
                #minXmax{width:50px; position:relative; float:left; text-align:right;font-size:1.3em; padding-right:7px; margin-top:10px;}
                
                .tmax, .tmin{width:10px; height:18px; display:block; float:left; background:url(../img/sprite.png) no-repeat; }
                .tmax{background-position:-781px 0; }
                .tmin{background-position: -802px 0; clear:left;}
                
                
                
                #dia-todo {text-align:center; position:relative; clear:both; border-bottom:1px dotted #aaa; height:85px; display:block;}
                #dia-todo li{
                    width:74px;
                    position:relative;
                    float:left;
                    height:auto;
                    display:block;
                }
                
                
                
                
                
                .gotas{
                position:relative;
                float:left;
                background:url(../img/sprite.png) no-repeat right -20px;
                width:24px;
                height:24px;
                margin-right:5px;
                margin-bottom:5px;
                margin-top:5px;
            }
            
            #tempor-outras {padding-top:10px;}
            #tempor-outras small{
                position:relative;
                clear:right;
                float:left;
                width:100%;
            }  
            #sol{
                background:url(../img/sprite.png) no-repeat -513px -54px;
                height:25px;
                width:92px;
                display:block;
                clear:both;
                margin:0 auto;
                
            }
            .sol-box{float:right; width:55%; text-align:center; position:relative;}
            .a-40{
                position:relative;
                float:left;
                width:40%;                
            }
            .a-half{
                position:relative;
                float:left;
                width:50%;
                
            }  
            #tempor-outras .a-half{
                text-align:center;
                
            }




.tempo-g{
    background:url(../img/sprite.png) no-repeat 0 -107px;
    width:50px;
    height:50px;
    position:relative;
    margin: 0 auto;
    clear:both;
}

.raio{
    width:14px;
    height:16px;
    background:url(../img/sprite.png) no-repeat  -777px -19px;
    display:inline-block;
    vertical-align:middle;
}

/******************************************/
/*************Dash aeroportos**************/
/******************************************/
#call-aero {
  background: rgba(0, 0, 0, 0.5);
  font-size: 14px;
  line-height: 12px;
}





/******************************************/
/**************Dash rod’zio****************/
/******************************************/

#mapa-rodizio{
    width:300px;
    height:122px;
    position:relative;
    clear:both;
    margin:0 auto;
    background:url('../img/sprite.png') no-repeat -300px -112px;
    margin:5px 0 10px
}

.rod-3col{
    position:relative;
    clear:both;
    text-align:center;
    border-top:1px dotted rgba(150,150,150,0.5);
}

.rod-3col li{
    padding:6px 0 0;
    width:33%;
    position:relative;
    float:left;
    height:55px;
    
}

.rod-3col li:nth-child(even){
    border-left:1px dotted rgba(150,150,150,0.5);
    border-right:1px dotted rgba(150,150,150,0.5);
}


/******************************************/
/****************Dash Ar*******************/
/******************************************/
#o2mapa{width:300px; height:160px; border-bottom:1px #eee dotted; margin-left: -8px;}

#dica{margin-top:10px;
	height: 50px;
    overflow: auto;
 }
#dica i{
    width:7px;
    height:7px;
    background:#6dcff6;
    display:inline-block;
    margin-right:5px;
    -webkit-border-radius:20px;
    -moz-border-radius:20px;
    -ms-border-radius:20px;
    -o-border-radius:20px;
    border-radius:20px;
}
#dica li{font-size:12px; line-height:14px;}

/**parelheiros*/
#arel{}

.ex-clima .dash-img {
width: 45px;
height: 45px;
}

.fonte{font-weight:lighter; color:#6b7a81; font-size:12px;}

.bullet-roxo, .bullet-vermelho, .bullet-laranja, .bullet-amarelo, .bullet-verde{
    font-size:1.7em;
    margin-top:5px;
}
.bullet-roxo{color:#800080}
.bullet-vermelho{color:#ff0000}
.bullet-laranja{color:#ff9900}
.bullet-amarelo{color:#ffff00}
.bullet-verde{color:#7ddc6f}

/******************************************/
/***************Dash Publico***************/
/******************************************/


.link-amarelo {
  color: #000!important;
  background-color: #fcc634;
  padding: 5px 15px;
  float: right;
  clear: both;
  margin-top: 5px;
  width: 269px;
  text-align: center;
}


/******************************************/
/**************Dash Tr‰nsito***************/
/******************************************/
.semaforo{
    background:url(../img/sprite.png) no-repeat -221px -63px;
    width:27px;
    height:32px;
    position:relative;
    clear:both;
    margin:5px auto;
}

.ball-status{
    width:10px;
    height:10px;
    display:inline-block;
    background:#ffc600;
    margin-right:5px;
    margin-top:2px;
    -webkit-border-radius:20px;
    -moz-border-radius:20px;
    -ms-border-radius:20px;
    -o-border-radius:20px;
    border-radius:20px;
}

.ex-transito span{display:block;}
.kmStatus{margin-top: -7px;}


.vermelho{color:#ed1c24;}
.verde{color:#7ddc6f;}

.ball-status.vermelho{background:#ed1c24;}
.ball-status.verde{background:#7ddc6f;}
.ball-status.amarelo{background:#fdc703;}



.tran-total{
    padding:10px 0;
    position:relative;
    width:180px;
    margin:0 auto;
}
.pont{
    background:transparent;
    border-bottom: 2px rgba(150, 150, 150, 0.2) dotted;
    border-top:0;
    border-right:0;
    border-left:0;
    margin:0;
}

.bolinha{
    width:15px;
    height:15px;
    display:inline-block;
    background:#ffc600;
    margin-right:5px;
    margin-top:2px;
    -webkit-border-radius:20px;
    -moz-border-radius:20px;
    -ms-border-radius:20px;
    -o-border-radius:20px;
    border-radius:20px;
}

.bloco-linha{
    position:relative;
    clear:both;
    text-align:center;
    border-top: 1px rgba(150, 150, 150, 0.2) dotted;
    padding-top: 8px;
    margin-top:5px;
}
.bloco-linha a {
    display:inline-block;
    font-weight:bold;
    width: 48%;
    text-decoration: underline;
    font-size:0.8em;
}
.ttotal{
    position:relative;
    height: 58px;
    width:49%;
    float:left;
}

#sp-mapa {
    background:url(../img/sprite.png) no-repeat -661px -59px;
    width:155px;
    height:94px;
    position:relative;
    clear:both;
    margin:5px auto 0;
    
}

#lentidao{
    position:absolute;    
    width:100%;
    height:150px;
    top:0;
    left:0;
    margin-top:54px;
}
#lentidao li{
    width:70px;
    font-size:1.3em;
    position:absolute;
}

#kmOeste{
    left: -75px;
    top: -45px;
    text-align:right;
}

#kmSul{
    left: -75px;
    top: -5px;
    text-align:right;
}

#kmNorte{
    left: 160px;
    top: -43px;
}

#kmLeste{
    left: 160px;
    top: -8px;
}

/******************************************/
/***************Dash Pœblico***************/
/******************************************/

.ex-publico a {
  text-align: center;
  text-decoration: underline;
  position: relative;
  padding: 5px;
  margin: 0 auto;
  display: block;
  line-height: 1.2em;
}


#call-publi {
  font-size: 13px;
  line-height: 13px;
}

#call-publi ul {
  position: relative;
  clear: both;
  margin-top: 10px;
    border-bottom: 1px dotted #979797;
}

#call-publi li {
  height: auto;
  min-height: 33px;
  position: relative;
  padding: 7px 0;
  font-weight: 500;
}

#call-publi li a {
  color: #6dcff6;
}

#call-publi .status {
  display: inline-block;
  vertical-align: middle;
}

#call-publi .mini {
  width: 33px;
  height: 33px;
  background-image: url(../img/sprite.png);
  background-repeat: no-repeat;
  display: inline-block;
  vertical-align: middle;
}

#call-publi span {
  display: inline-block;
  vertical-align: middle;
  width: 255px;
}


.Mbus {
  background-position: -379px -52px;
}


.Mmetro {
  background-position: -313px -52px;
}


.Mcptm {
  background-position: -346px -52px;
}


.link-verde {
  color: rgba(0, 0, 0, 0.7) !important;
  background-color: #8fcc86;
  padding: 5px 15px;
  float: right;
  clear: both;
  margin-top: 5px;
}

/******************************************/
/**************Dash Aeroportos*************/
/******************************************/


#aero-lista{ margin-top:10px; position:relative; clear:both; width:100%;}
#aero-lista li{
    width: 137px;
    position: relative;
    float: left;
    height: 90px;
    border: 1px solid rgba(150,150,150,0);
    font-size:100%;
}

.cgh{padding-right:10px; padding-bottom:10px; }
.gru{padding-left:10px;  padding-bottom:10px; border-bottom:1px dotted rgba(150,150,150,0.5)!important; border-left:1px dotted rgba(150,150,150,0.5)!important}
.mae{padding-top:10px; padding-right:10px;  border-top:1px dotted rgba(150,150,150,0.5)!important; border-right:1px dotted rgba(150,150,150,0.5)!important}
.vcp{padding-top:10px;  padding-left:10px;  }


#aero-lista small{
    display:block;
    font-size: 13px;
    font-weight:normal;
}


.aeronome{
    color:#fff;
    font-size:0.9em;
    display:block;
}

.link-aero{
    font-size: 1em;
    color:#6DCFF6!important;
    text-align:center;
    display:block;
    text-decoration:underline;
    margin:15px 0 5px;
    font-weight:bold;
}

.aeronome abbr{font-size:1.2em;}
/******************************************/
/****************Dash Clima****************/
/******************************************/



#call-clima > div {
  position: relative;
  clear: both;
}



.max {
  width: 20px;
  height: 16px;
  display: inline-block;
  vertical-align: baseline;
  background-image: url(../img/sprite.png);
  background-repeat: no-repeat;
  background-position: -777px 0;
}


.min-max {
  width: 65px;
  height: 65px;
}



/* lua */
.min {
  width: 20px;
  height: 16px;
  display: inline-block;
  vertical-align: baseline;
  background-image: url(../img/sprite.png);
  background-repeat: no-repeat;
  background-position: -797px 0;
}
