﻿/* Variaveis comuns */
:root {
	--laranja: #e55300;
	--verde-claro: #9fc542;
	--verde-medio: #008c50;
	--verde-escuro: #016609;
	--vermelho: #D54343;
    }

/* Padrões de página */
* { font-size: .9rem; font-family: Trebuchet MS }
html, body { height: 100%}
.body { background-image: url('../img/bgNovo.jpg'); margin: 0; background-repeat: repeat-x}
.container { width: 100%; margin: 0 auto }
.fluid { width: 100% }
.flex { display: flex;}
.grow1 { flex-grow: 1;}
.flex-pontas { display: flex; justify-content: space-between}
.full-el { width: 100%; max-width: 1200px; margin: 0 auto; padding-left: 1rem; padding-right: 1rem}
.titulo-1 { display: block; font-size: 1.5rem; color: var(--laranja)}
.sub-titulo { display: block; font-size: 1rem; color: var(--verde-medio)}
/* .small-text {font-size: 0.8rem}
.bigger-text {font-size:1.2rem} */
/* .dados-guia .small-text {font-size:1.2rem}
.dados-guia .bigger-text {font-size:1.2rem} */
.center-align{ align-items: center}
hr { border: none; border-top: 1px solid #efeeee; margin: 10px 0}
.bold { font-weight: bold }
.italico { font-style: italic }
.vermelho { color: var(--vermelho) }
.branco { color: white }
.pad-ver-1 { padding-top: 1rem; padding-bottom: 1rem}
.grow-full { flex-grow: 1 }
.bg-cinza-1 { background-color: #efeeee }
.bg-cinza-2 { background-color: #d4d4d4 }
.corpo { display: flex; flex-direction: column; height: 100% }
.conteudo { background-color: white; border-radius: 15px; border: 1px solid #efeeee; padding: 1rem; margin-bottom: 1rem}
.rodape { background-color: var(--verde-claro); text-align: center; padding: 1rem; color: var(--verde-escuro); margin-top: 1rem }
.sombra-meio {  box-shadow: -10px 15px 8px rgb(0,0,0,.1), 10px 15px 8px rgb(0,0,0,.1) }
.sep-verde { padding: 5px; border-bottom: 2px solid var(--verde-claro)}
.link { cursor: pointer }
.block { display: block}
.hide { display: none}
.row { border-radius: 3px }
.row div { padding: 0 5px} /* Tira a formatação do bootstrap */

.box-guia { margin: .5rem }
/* .cab-guia { padding: 1rem 0; background-color: #bcddbc; font-weight: bold; font-size: .8rem} */
.cab-guia { padding: 1rem 0; font-weight: bold; font-size: .8rem}
.guia-st-1 { background-color: #E0F8E6; }
.guia-st-2, .guia-st-4, .guia-st-5, .guia-st-6 { background-color: #F5F6CE; }
.guia-st-3 { background-color: #F8E0E0; }
.dados-guia div{ font-size: .8rem }
.sep-dados-guia { border-bottom: 1px solid white; padding: 3px 0 }
.sep-dados-guia-itens { border-bottom: 1px solid #efeeee; padding: 3px 0 }
.cab-itens div { font-size: .8rem; font-weight: bold; padding: 3px}

.origem-guia { border: 2px solid #fafafa; padding: 3px; border-radius: 5px; color: white}
.origemUVS { background-color: #9fc542 }
.origemPA { background-color: #d71106 }
.origemPEC  { background-color: #0080c0 }

.fverde { color: green }
.fcinza { color: gray }
.fs08 { font-size: 0.8rem;}
.help { cursor: help; }

.origem-ope { background-color: #CEF6F5; border: 2px solid skyblue; padding: 3px; border-radius: 5px }
.acesso-integral { background-color: darkgreen; color: white; border: 2px solid #d4d4d4; padding: 3px; border-radius: 5px }

.icone-tpguia i{ font-size: 1.8rem; cursor: pointer; margin-top: -.3rem}
.bg-item-pend { background-color: cornsilk }
.fa-clone:active { font-weight: 900}

.extra { transition: .5s  }
.esconde {height: 0; padding: 0; overflow: hidden; transition: .5s; border-bottom: none }

.box-envelope { border: 1px solid lightgray; border-left: 3px solid green; border-radius: 5px; padding: 5px !important}


  /* // Small devices (landscape phones, 576px and up) */
  @media (min-width: 576px) { 
  .container { width: 576px }
  }
  
  /* // Medium devices (tablets, 768px and up) */
  @media (min-width: 768px) { 
	  .container { width: 768px }
   }
  
  /* // Large devices (desktops, 992px and up) */
  @media (min-width: 992px) { 
	  .container { width: 992px  }
   }
  
  /* // Extra large devices (large desktops, 1200px and up) */
  @media (min-width: 1200px) { 
	  .container { width: 1200px }
   }