@charset "utf-8";

::-moz-selection {
  background:#005baa;
  color:#fff;
  text-shadow:none;
}
::selection { 
  background:#005baa; 
  color:#fff; 
  text-shadow:none;
}
/* Carregando
================================================== */
  #carregar { width: 100%; margin:0 auto; position: absolute; left: 45%; top: 45%;}
  #loading { display: block; font-size: 50px; position: absolute; color:#fff; z-index: 2000; margin:0 auto;}
  .no-js #loading { display: none;  }
  
  @-webkit-keyframes opacity {
    0% { opacity: 1; }
    100% { opacity: 0; }
  }
  @-moz-keyframes opacity {
    0% { opacity: 1; }
    100% { opacity: 0; }
  }
  
  #loading span {
    -webkit-animation-name: opacity;
    -webkit-animation-duration: 1s;
    -webkit-animation-iteration-count: infinite;
    
    -moz-animation-name: opacity;
    -moz-animation-duration: 1s;
    -moz-animation-iteration-count: infinite;
  }
  
  #loading span:nth-child(2) {
    -webkit-animation-delay: 100ms;
    -moz-animation-delay: 100ms;
  }
  
  #loading span:nth-child(3) {
    -webkit-animation-delay: 300ms;
    -moz-animation-delay: 300ms;
  }
/* Efeito Fade
================================================== */
@-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
  @-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
  @keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
   
  .fade {
    opacity:0;  /* make things invisible upon start */
    -webkit-animation:fadeIn ease-in 1;  /* call our keyframe named fadeIn, use animattion ease-in and repeat it only 1 time */
    -moz-animation:fadeIn ease-in 1;
    animation:fadeIn ease-in 1;
   
    -webkit-animation-fill-mode:forwards;  /* this makes sure that after animation is done we remain at the last keyframe value (opacity: 1)*/
    -moz-animation-fill-mode:forwards;
    animation-fill-mode:forwards;
   
    -webkit-animation-duration:0.5s;
    -moz-animation-duration:0.5s;
    animation-duration:0.5s;
  }
   
  .fade:first-child {
    -webkit-animation-delay: 0.5s;
    -moz-animation-delay: 0.5s;
    animation-delay: 0.5s;
  }
   
  .fade:nth-child(2n) {
    -webkit-animation-delay: 0.5s;
    -moz-animation-delay:0.5s;
    animation-delay: 0.5s;
  }
/* Efeitos para dar emoção a página
================================================== */
.deletar{
  -webkit-animation-name: shake;
  -webkit-animation-fill-mode: both;
  -webkit-animation-duration: 1s;
  -webkit-animation-iteration-count: 1;
  -webkit-animation-timing-function: linear;
  -moz-animation-name: shake;
  -moz-animation-fill-mode: both;
  -moz-animation-duration: 1s;
  -moz-animation-iteration-count: 1;
  -moz-animation-timing-function: linear;
  animation-name: shake;
  animation-fill-mode: both;
  animation-duration: 1s;
  animation-iteration-count: 1;
  animation-timing-function: linear;
}
.exibir{
  -webkit-animation-name: fadeInDown;
  -webkit-animation-fill-mode: both;
  -webkit-animation-duration: 1s;
  -webkit-animation-iteration-count: 1;
  -webkit-animation-timing-function: linear;
  -moz-animation-name: fadeInDown;
  -moz-animation-fill-mode: both;
  -moz-animation-duration: 1s;
  -moz-animation-iteration-count: 1;
  -moz-animation-timing-function: linear;
  animation-name: fadeInDown;
  animation-fill-mode: both;
  animation-duration: 1s;
  animation-iteration-count: 1;
  animation-timing-function: linear;
}
.editar{
  -webkit-animation-name: wobble;
  -webkit-animation-fill-mode: both;
  -webkit-animation-duration: 1s;
  -webkit-animation-iteration-count: 1;
  -webkit-animation-timing-function: linear;
  -moz-animation-name: fadeInDown;
  -moz-animation-fill-mode: both;
  -moz-animation-duration: 1s;
  -moz-animation-iteration-count: 1;
  -moz-animation-timing-function: linear;
  animation-name: fadeInDown;
  animation-fill-mode: both;
  animation-duration: 1s;
  animation-iteration-count: 1;
  animation-timing-function: linear;
}
.notificar{
  -webkit-animation-name: fadeInUp;
  -webkit-animation-fill-mode: both;
  -webkit-animation-duration: 3s;
  -webkit-animation-iteration-count: 1;
  -webkit-animation-timing-function: linear;
  -moz-animation-name: fadeInUp;
  -moz-animation-fill-mode: both;
  -moz-animation-duration: 3s;
  -moz-animation-iteration-count: 1;
  -moz-animation-timing-function: linear;
  animation-name: fadeInUp;
  animation-fill-mode: both;
  animation-duration: 3s;
  animation-iteration-count: 1;
  animation-timing-function: linear;
}
/* Corpo
================================================== */
body {
  overflow-x:hidden;
  background-color: #e0e0e0;
  background-image:url("../../img/bg/notebook.png");
  font-family:Arial, Helvetica, sans-serif;
  font-size:14px;
  color:#727176;
  -webkit-animation-name: bounceInDown;
  -webkit-animation-fill-mode: both;
  -webkit-animation-duration: 1.5s;
  -webkit-animation-iteration-count: 1;
  -webkit-animation-timing-function: linear;
  -moz-animation-name: bounceInDown;
  -moz-animation-fill-mode: both;
  -moz-animation-duration: 1.5s;
  -moz-animation-iteration-count: 1;
  -moz-animation-timing-function: linear;
  animation-name: bounceInDown;
  animation-fill-mode: both;
  animation-duration: 1.5s;
  animation-iteration-count: 1;
  animation-timing-function: linear;
}

/* Link
================================================== */
a:link, a:visited, a:hover, a:active{ 
  text-decoration:none; 
}

a:hover { 
  -webkit-transition: all .3s ease-out; 
    -moz-transition: all .3s ease-out; 
    -o-transition: all .3s ease-out; 
    transition: all .3s ease-out;
}
a:active {  
  -webkit-transition: all .3s ease-out; 
    -moz-transition: all .3s ease-out; 
    -o-transition: all .3s ease-out; 
    transition: all .3s ease-out;
}
/* Tooltips
================================================== */
.tooltip{
  font-size:16px;
  position: absolute;
  display: none;
  padding: 10px 15px;
  background:#005baa;
  color:#FFF;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px; 
  border-radius: 5px; 
  -webkit-box-shadow: inset 0px 0px 1px rgba(118, 45, 25, 1), 0 0 4px rgba(91, 91, 95, 0.5);
  -moz-box-shadow: inset 0px 0px 1px rgba(118, 45, 25, 1), 0 0 4px rgba(91, 91, 95, 0.5);
    box-shadow: inset 0px 0px 1px rgba(118, 45, 25, 1), 0 0 4px rgba(91, 91, 95, 0.5);
  z-index:2000;
}
/* Pages
================================================== */
.head {
  height: auto;
  width: 430px;
  margin: 0 auto;
}

.espaco-page{
  width:100%;
  height:25px;
  display: inherit;
  clear: both;
}
.espaco-page-end{
  width:100%;
  height:40px;
  display: inherit;
  clear: both;
}

.topo {
  height: auto;
  color: #fff;
  font-size: 26px;
  background:#005baa;
  border-top-left-radius:7px; 
    -moz-border-top-left-radius:7px; 
    -webkit-border-top-left-radius:7px;
    border-top-right-radius:7px; 
    -moz-border-top-right-radius:7px; 
    -webkit-border-top-right-radius:7px;
    border-bottom:2px dotted #fff;
  padding: 20px;
  display: block;
}
.pages {
  height: auto;
  background: #fff;
  border-bottom-left-radius:7px; 
    -moz-border-bottom-left-radius:7px; 
    -webkit-border-bottom-left-radius:7px;
    border-bottom-right-radius:7px; 
    -moz-border-bottom-right-radius:7px; 
    -webkit-border-bottom-right-radius:7px;
  padding: 30px 20px;
  overflow-y:hidden;
  display: block;
}

.coluna {
  width: 6%;
  background-color:#ccc;
  display: block;
  float:left;
}
.colu {
  width: 100%;
  margin:auto auto;
  background: #fff;
  display: block;
}
.colum {
  width: 100%;
  height:100px;
  margin:auto auto;
  background: #fff;
  display: inherit;
}
.colum2 {
  width: 100%;
  height:570px;
  margin:auto auto;
  background: #fff;
  display: inherit;
}
.col-ico {
  font-family:icons;
    font-size:30px;
    font-style:normal;
  color:#a7a9ac;
}
.corpo {
  width: 94%;
  display: block;
  float:right;
}

#data {
  display: none;
}

.rodape {
  display: block;
  clear: both;
}
.assina {
  font-size: 14px;
  font-style: italic;
  text-align: right !important;
}

/* Dois botões */
#doisbt {
  display: block;
  width: 100%;
  margin: 0 auto;
}
.bt1 {
  width: 49%;
  float: left;
}
.bt2 {
  width: 49%;
  float: right;
}
@media (max-width: 450px) {
  .bt1 {
    width: 100%;
    display: block;
    padding-bottom: 10px;
  }
  .bt2 {
    width: 100%;
    display: block;
  }

}

/* Forms Elementos
================================================== */
form label {
  display:block;
}
label {
  font-size:18px;
}
form.form label.error, label.error {
  position: relative;
  top: 0px;
  color:#a7a9ac;
  font-size:14px;
  padding:5px 0px 0px 12px;
  font-style: italic;
}
div.error { 
  display: none; 
}
.insert {
  padding:10px;
  background-color:#f37021;
  color: #fff;
  border-top-left-radius:5px; 
  -moz-border-top-left-radius:5px; 
  -webkit-border-top-left-radius:5px;
  border-top-right-radius:5px; 
  -moz-border-top-right-radius:5px; 
  -webkit-border-top-right-radius:5px;
  border:3px solid #c85c1a;
  border-bottom:none;
}
.insert-alert {
  position: relative;
  top:-10px;
}
.verificar {
  background:#d1d3d4;
  background: -moz-linear-gradient(top,  #d1d3d4 0%, #bcbec0 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#d1d3d4), color-stop(100%,#bcbec0));
  background: -webkit-linear-gradient(top,  #d1d3d4 0%,#bcbec0 100%);
  background: -o-linear-gradient(top,  #d1d3d4 0%,#bcbec0 100%);
  background: -ms-linear-gradient(top,  #d1d3d4 0%,#bcbec0 100%);
  background: linear-gradient(top,  #d1d3d4 0%,#bcbec0 100%);
  color:#58595b;
  border-radius:6px;
  -moz-border-radius:6px; 
  -webkit-border-radius:6px;
  text-indent:0;
  border:1px solid #a7a9ac;
  border-bottom: 3px solid #a7a9ac;
  display:inline-block;
  font-family:arial;
  font-size:16px;
  font-weight:bold;
  font-style:normal;
  height:47px;
  line-height:48px;
  width:100%;
  text-decoration:none;
  text-align:center;
  text-shadow:1px 1px 0px #fff;
  cursor: pointer;
  -webkit-transition: all .3s ease-out; 
    -moz-transition: all .3s ease-out; 
    -o-transition: all .3s ease-out; 
    transition: all .3s ease-out;
}
.verificar:hover {
  background:#004a8f;
  background: -moz-linear-gradient(top,  #004a8f 0%, # 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#004a8f), color-stop(100%,#005baa));
  background: -webkit-linear-gradient(top,  #004a8f 0%,#005baa 100%);
  background: -o-linear-gradient(top,  #004a8f 0%,#005baa 100%);
  background: -ms-linear-gradient(top,  #004a8f 0%,#005baa 100%);
  background: linear-gradient(top,  #004a8f 0%,#005baa 100%);
  color:#fff;
  border:1px solid #003974;
  border-bottom: 3px solid #003974;
  text-shadow:1px 1px 0px #005baa;
}
.verificar:active {
  position:relative;
  top:1px;
}
.enviar {
  background:#d1d3d4;
  background: -moz-linear-gradient(top,  #d1d3d4 0%, #bcbec0 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#d1d3d4), color-stop(100%,#bcbec0));
  background: -webkit-linear-gradient(top,  #d1d3d4 0%,#bcbec0 100%);
  background: -o-linear-gradient(top,  #d1d3d4 0%,#bcbec0 100%);
  background: -ms-linear-gradient(top,  #d1d3d4 0%,#bcbec0 100%);
  background: linear-gradient(top,  #d1d3d4 0%,#bcbec0 100%);
  color:#58595b;
  border-radius:6px;
  -moz-border-radius:6px; 
  -webkit-border-radius:6px;
  text-indent:0;
  border:1px solid #a7a9ac;
  border-bottom: 3px solid #a7a9ac;
  display:inline-block;
  font-family:arial;
  font-size:16px;
  font-weight:bold;
  font-style:normal;
  height:50px;
  line-height:30px;
  width:100%;
  text-decoration:none;
  text-align:center;
  text-shadow:1px 1px 0px #fff;
  cursor: pointer;
  -webkit-transition: all .3s ease-out; 
    -moz-transition: all .3s ease-out; 
    -o-transition: all .3s ease-out; 
    transition: all .3s ease-out;
}
.enviar:hover {
  background:#004a8f;
  background: -moz-linear-gradient(top,  #004a8f 0%, # 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#004a8f), color-stop(100%,#005baa));
  background: -webkit-linear-gradient(top,  #004a8f 0%,#005baa 100%);
  background: -o-linear-gradient(top,  #004a8f 0%,#005baa 100%);
  background: -ms-linear-gradient(top,  #004a8f 0%,#005baa 100%);
  background: linear-gradient(top,  #004a8f 0%,#005baa 100%);
  color:#fff;
  border:1px solid #003974;
  border-bottom: 3px solid #003974;
  text-shadow:1px 1px 0px #005baa;
}
.enviar:active {
    position:relative;
  top:1px;
}
.txt {
  width: 94%;
  border:none;
  padding:7px 10px;
  border-radius:5px;
  -webkit-border-radius:5px;
  -moz-border-radius:5px;
  border:3px solid #d8d9dd;
  margin-top:5px;
  margin-bottom:5px;
  font-size:16px;
  color: #87868a;
  background-color:#fff;
  -webkit-transition: all .3s ease-out; 
    -moz-transition: all .3s ease-out; 
    -o-transition: all .3s ease-out; 
    transition: all .3s ease-out;
}
.txt:focus{
  border:3px solid #005baa;
  background-color:#e2e4e7;
  color:#5b5b5f;
  outline: none;
}
textarea {
  font-family: Arial, Helvetica, sans-serif;
}
select option {
  background-color:#e2e4e7;
  color:#5b5b5f;
  outline: none;
}

.checkbox,
.radio {
  margin-left: 4px;
  margin-bottom: 12px;
  padding-left: 20px;
  position: relative;
  -webkit-transition: 0.25s;
  -moz-transition: 0.25s;
  -o-transition: 0.25s;
  transition: 0.25s;
  -webkit-backface-visibility: hidden;
  cursor:pointer;
}
  .checkbox:hover,
  .radio:hover {
    color: #005baa; 
}
  .checkbox input,
  .radio input {
    outline: none !important;
    opacity: 0;
    filter: alpha(opacity=0);
    zoom: 1; 
}
  .checkbox.checked .icon,
  .radio.checked .icon {
    background-position: -60px -30px;
    opacity: 1;
    display: block\9; }
  .checkbox.checked .icon-to-fade,
  .radio.checked .icon-to-fade {
    opacity: 0;
    display: none\9; }
  .checkbox.disabled,
  .radio.disabled {
    text-decoration:line-through;
    cursor: default; }
    .checkbox.disabled .icon,
    .radio.disabled .icon {
      opacity: 0;
      display: none\9; }
    .checkbox.disabled .icon-to-fade,
    .radio.disabled .icon-to-fade {
      background-position: -30px -60px;
      opacity: 1;
      display: block\9; }
    .checkbox.disabled.checked .icon,
    .radio.disabled.checked .icon {
      background-position: 0 -90px;
      opacity: 1;
      display: block\9; }
    .checkbox.disabled.checked .icon-to-fade,
    .radio.disabled.checked .icon-to-fade {
      opacity: 0;
      display: none\9; }
  .checkbox .icon,
  .checkbox .icon-to-fade,
  .radio .icon,
  .radio .icon-to-fade {
    background: url("../../img/form/checkbox-azul.png") -90px 0 no-repeat;
    display: block;
    height: 20px;
    left: 0;
    opacity: 1;
    position: absolute;
    top: -1px;
    width: 20px;
    -webkit-transition: opacity 0.1s linear;
    -moz-transition: opacity 0.1s linear;
    -o-transition: opacity 0.1s linear;
    transition: opacity 0.1s linear;
    -webkit-backface-visibility: hidden; }
  .checkbox .icon,
  .radio .icon {
    opacity: 0;
    top: 0;
    z-index: 2;
    display: none\9; }

.radio .icon,
.radio .icon-to-fade {
  background-image: url("../../img/form/radio-azul.png"); }