html, button, input, select, textarea {color: #222; }
* { margin: 0; padding: 0; }
body {font-size: 1em; line-height: 1.4; }
body, html { 
  margin:0; 
  padding:0;
  background: #efefef;  
  height: 100%; 
  color: #004874;
  font-family: 'Open Sans', sans-serif;
}
::-moz-selection {background: #b3d4fc; text-shadow: none; }
::selection {background: #b3d4fc; text-shadow: none; }
hr {display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
img {vertical-align: middle; }
fieldset {border: 0; margin: 0; padding: 0; }
textarea {resize: vertical; }
.chromeframe {margin: 0.2em 0; background: #ccc; color: #000; padding: 0.2em 0; }
.left { float: left; }
.right { float: right; }

/* ==========================================================================
   Base
   ========================================================================== */

.sprite { 
  display: block; 
  text-indent:-9999px; 
  background:url(../img/sprite.png) no-repeat; 
}

a { 
  font-size: 13px;
  color: #5f8daf;
  text-decoration:none; 
}

#wrapper {
  width: 100%;
  position: relative;
  height: auto !important;
  min-height: 100%;
  height: 100%;
}

/* ==========================================================================
   Content
   ========================================================================== */

#content {
  width: 760px;
  height:100px; 
  margin: 0 auto; 
  display: table; 
}
#content h2 { width:100%; text-align:center; }
#content ul { margin:0; padding:0; }
#content ul li { 
  display: inline; 
  width:243px; 
  height:565px; 
  display: block; 
  float: left; 
  margin-right:10px; 
}
#content ul li p { 
  width:205px;
  font-size:15px; 
  text-align: center; 
  font-weight: 600; 
  margin:10px auto 25px; 
}

#content ul li ul { 
  display: table;
  margin-bottom:15px; 
}
#content ul li ul li { 
  height: auto;
  margin-bottom:4px; 
}
#content ul li ul li a { 
  background:url(../img/bgnav.png);
  display: block;
  padding:5px 8px; 
  width: 226px;
  text-align: center;
  border-top:1px solid #ececec;
  border-bottom:1px solid #ececec;
}

span { 
 color: #a1a1a1;
 /*  font-size: 10px;  */
  font-size: 13px;
/*   color: #5f8daf; */
  line-height: 12px;
  display: block;
  text-align: center;
}

.ecofrotas { background:url(../img/bgecofrotas.png) no-repeat; }
.ecobeneficios { background:url(../img/bgecobeneficios.png) no-repeat; }
.expers { background:url(../img/bgexpers.png) no-repeat; }


/* Logos */ 
figure { margin:35px auto 25px; height: 72px; }
.ecofrotas figure { background-position: -127px -4px; width: 81px;  }
.ecobeneficios figure { background-position:-126px -86px; width: 87px;  }
.expers figure { background-position: -1px -155px; width: 158px; }

/* Links */ 
.ecofrotas a:hover { color:#328d27; }
.ecobeneficios a:hover { color:#d9a33d; }
.expers a:hover { color:#c9272b; }

.btn_clique { 
  background: url(../img/sprite.png) no-repeat 0 0;
  width: 107px;
  height: 31px;
  display: block;
  margin:14px auto; 
}
.ecofrotas .btn_clique:hover { background-position: 0 -36px; }
.ecobeneficios .btn_clique:hover { background-position: 0 -71px; }
.expers .btn_clique:hover { background-position: 0 -107px; }

#content ul li.expers ul{ margin-top:59px; margin-bottom:49px; }


/* ==========================================================================
   Footer
   ========================================================================== */

footer {
  clear: both;
  position: relative;
  height: 65px;
  width: 432px;
  margin: 20px auto 0; 
  font-family: 'Open Sans', sans-serif;
  font-size:12px; 
  color: #527f9b;
}
.goodcard { 
  width:142px;
  height:44px; 
  /* background-position:-166px -165px; */
  margin-right:15px; 
  background:url(../img/logo_good.png) no-repeat; 
}
footer p { padding-top:10px; }


/* ==========================================================================
   Helper classes
   ========================================================================== */
.ir {background-color: transparent; border: 0; overflow: hidden; /* IE 6/7 fallback */ *text-indent: -9999px; }
.ir:before {content: ""; display: block; width: 0; height: 150%; }
.hidden {display: none !important; visibility: hidden; }
.visuallyhidden {border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus {clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }
.invisible {visibility: hidden; }
.clearfix:before, .clearfix:after {content: " "; /* 1 */ display: table; /* 2 */ }
.clearfix:after {clear: both; }
.clearfix {*zoom: 1; }
/* ==========================================================================
   Media Queries for Responsive Design.Print styles
   ========================================================================== */
@media only screen and (min-width: 35em) { }
@media print,
       (-o-min-device-pixel-ratio: 5/4),
       (-webkit-min-device-pixel-ratio: 1.25),
       (min-resolution: 120dpi) { }
@media print {
  * {background: transparent !important; color: #000 !important; /* Black prints faster: h5bp.com/s */ box-shadow: none !important; text-shadow: none !important; }
  a, a:visited {text-decoration: underline; }
  a[href]:after {content: " (" attr(href) ")"; }
  abbr[title]:after {content: " (" attr(title) ")"; }
  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after {content: ""; }
  pre, blockquote {border: 1px solid #999; page-break-inside: avoid; }
  thead {display: table-header-group; /* h5bp.com/t */ }
  tr, img {page-break-inside: avoid; }
  img {max-width: 100% !important; }
  @page {margin: 0.5cm; }
  p, h2, h3 {orphans: 3; widows: 3; }
  h2, h3 {page-break-after: avoid; }
}

/* ==========================================================================
   Typography
   ========================================================================== */
@font-face{
  font-family:'metapro'; 
  src:url('fonts/MetaPro.eot'); 
  src:url('fonts/MetaPro.eot?#iefix') format('embedded-opentype'),
      url('fonts/MetaPro.svg#metapro') format('svg'), 
      url('fonts/MetaPro.ttf') format('truetype'),
      url('fonts/MetaPro.woff') format('woff');
  font-weight:normal; 
  font-style:normal;
}

.container {
	width:100%;
}

.linha {
	width:760px;
	margin:0 auto;
	height:1px;
	border-top:solid 1px #D3D3D3;
}

.conteudo {
	margin:0 auto;
	width:760px;
	height:115px;
	
	padding:15px 0;
}

.conteudo div p {
	color:#5C8BAA;
	font-size:13px;
	text-align:center;
	margin-bottom:5px;
}

.conteudo div a {
	margin: 0 auto;
	width: 356px;
	display: block;
	text-align: center;
	color:#878787;
}

.conteudo h4 {
	width:760px;
	text-align:center;
	margin-bottom:0px;
}

.texto_colaborador {
	width:485px;
	float:left;
}

.texto_colaborador p {
	color:#5C8BAA;
	font-size:13px;
	right:0;
	width:445px;
	float:right;
}

.btn_clicar {
	width:243px;
	float:right;
	margin:10px 0;
}

.btn_clicar a {
	margin:0 auto;
	display:block;
	width:99px !important;
	height:34px;
}

hr {
	color:#D3D3D3;
}


/* MODAL TICKETLOG */

.modal {
    display: block;
    position: fixed;
    z-index: 1;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto; 
    background-color: rgb(0,0,0); 
    background-color: rgba(0,0,0,0.6); 
}

.modal-content {
    margin: 15% auto;
    padding: 20px;
    width: 570px;
}

.close {
    float: right;
    z-index: 900;
    position: relative;
    margin-bottom: -17px;
    margin-right: -13px;
}

.close:hover,
.close:focus {
    cursor: pointer;
}

