body{
    margin: 0;
}

html, body {
    overflow: hidden;
}

#home{
    width: 100vw;
    height: 100vh;
    /*background: url(imagens/fundo_natal_ig5.png) 0 0 no-repeat fixed;*/
    background-color: rgb(255, 105, 0);
    max-width:100%;
    position: absolute;
    color: rgb(0, 38, 58);
}

#home2, #home3{
    width: 100vw;
    height: 100vh;
    background: rgb(0, 38, 58);
    max-width:100%;
    position: absolute;
    color: rgb(255, 105, 0);
}

.corfundo{
    background: rgb(255, 105, 0);
}

.corfundo2{
    background: rgb(0, 38, 58);
    z-index: 20;
}

.barras{
    background: rgb(255, 105, 0);
    color: white;
    border-style: none;
    margin-left: 20px;
    outline: none;
}

.barras2{
    background: rgb(0, 38, 58);
    color: white;
    border-style: none;
    margin-left: 20px;
    outline: none;
}

.barras:hover{
    color: rgb(0, 38, 58);
}

.barras2:hover{
    color: rgb(255, 105, 0);
}

#mySidebar{
    background-color: rgb(0, 38, 58);
    color: white;
    border-style: none!important;

    display: block!important;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: opacity 400ms, visibility 400ms;
    transition: opacity 400ms, visibility 400ms;
}

#mySidebar2{
    background-color: rgb(255, 105, 0);
    color: white;
    border-style: none!important;

    display: block!important;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: opacity 400ms, visibility 400ms;
    transition: opacity 400ms, visibility 400ms;
}

.fundolat{
    position: absolute!important;
    bottom: 0px!important;
}

#btnfechar, #btnfechar2{
    text-decoration: none;
}

#btnfechar:hover{
    color: rgb(255, 105, 0);
}

#btnfechar2:hover{
    color: rgb(0, 38, 58);
}

.botaolateral:hover{
    background:rgb(255, 105, 0);
    color:rgb(0, 38, 58);
    text-decoration: none;
}

.botaolateral2:hover{
    background:rgb(0, 38, 58);
    color:rgb(255, 105, 0);
    text-decoration: none;
}

#pag1{
    width: 100vw;
    height: 100vh;
    max-width:100%;
}

.imgf, .imgf2{
    position: fixed;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

#msg_natal{
    background-color: rgba(0,0,0,0.5);
    position: absolute;
    z-index: 5;
    width: 100%;
    height: 100%;
    text-align: center;
    cursor: pointer;
}

#img_msg_natal{
    width: 70%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

@media only screen and (max-width: 1000px) {
    #logo{
        margin-left: auto;
        margin-right: auto;
        width: 100%;
    }
    .imgf2 {
        position:absolute;
        width: 95%;
        padding-top: 100px;
    }
    #home3 {
        overflow: auto;
        overflow-x: hidden;
    }
    
    #tbl_valores{
        margin-top: 50px !important;
        margin-bottom: 50px !important;
    }
}



.fade-in {
    animation: fadeIn ease 2s;
    -webkit-animation: fadeIn ease 2s;
    -moz-animation: fadeIn ease 2s;
    -o-animation: fadeIn ease 2s;
    -ms-animation: fadeIn ease 2s;
    }
    @keyframes fadeIn {
    0% {opacity:0;}
    100% {opacity:1;}
    }
    
    @-moz-keyframes fadeIn {
    0% {opacity:0;}
    100% {opacity:1;}
    }
    
    @-webkit-keyframes fadeIn {
    0% {opacity:0;}
    100% {opacity:1;}
    }
    
    @-o-keyframes fadeIn {
    0% {opacity:0;}
    100% {opacity:1;}
    }
    
    @-ms-keyframes fadeIn {
    0% {opacity:0;}
    100% {opacity:1;}
    }

    .btnlaranja{
        background: rgb(255, 105, 0)!important;
        color: rgb(0, 38, 58)!important;
    }
    
    span.psw {float: right;padding-top: 16px;font-size: 0.8em;}
    input[type=text], input[type=password] {width: 100%;padding: 12px 20px;margin: 8px 0;display: inline-block;border: 1px solid #ccc;box-sizing: border-box;}
    .button1 {background-color: #00263A;color: #FFF;padding: 14px 20px;margin: 8px 0;border: none;cursor: pointer;width: 100%;}
    .button1:hover {opacity: 0.8;}
    .imgcontainer {text-align: center;margin: 24px 0 12px 0;position: relative;}
    img.avatar {width: 30%;border-radius: 50%;}
    .modal {display: none;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.4);padding-top: 60px;}
    .modal-content {background-color: #fefefe;margin: 0.5% auto 0.5% auto;border: 1px solid #888;width: 71%;}
    .cancelbtn {width: auto;padding: 10px 18px;background-color: #FF6900;color: #FFF;border: none;}
    .cancelbtn:hover {opacity: 0.8;}
    .container {padding: 16px;width:100%!important;}
    .animate {-webkit-animation: animatezoom 0.6s;animation: animatezoom 0.6s}
    .close {position: absolute;right: 25px;top: 0;color: #000;font-size: 35px;font-weight: bold;}
    .close:hover,
    .close:focus {color: red;cursor: pointer;}
    @-webkit-keyframes animatezoom {
         from {-webkit-transform: scale(0)} 
         to {-webkit-transform: scale(1)}
         }
    @keyframes animatezoom {
         from {transform: scale(0)} 
         to {transform: scale(1)}
         }
         

#sobre table{
    color: rgba(255, 105, 0, 1) !important;
}

#sobre table p{
    color: white;
}

#sobre img{
    width: 350px;
}

.titulo_sobre {
    font-weight: bold;
}

.sub_titulo_sobre{
    color: rgba(200, 105, 0, 1) !important;
    font-weight: bold;
}

.btn_sobre {
  background-color: rgb(200, 105, 0);
  border: none;
  border-radius: 12px;
  color: white;
  padding: 15px;
  text-align: center;
  text-decoration: none !important;
  font-size: 12px;
  font-weight: bold;
}

.valores{
    width: 100px !important;
}

.coluna_img{
    width: 150px !important;
}