*{
    margin: 0px;
    font-family: "Calibri", "sans-serif";
}
li{
    list-style: none;
}

a{
    text-decoration: none;
    color: #666;
}

.container{
    background: #fff;
}

.first{
    width: 100%;
    height: 700px;
    background: url('../images/bg.jpg') no-repeat center top fixed;
    background-size:cover ;
    display: table;
    padding: 30px 0px;
}

.login{
    width: 80%;
    height: auto;
    display: table;
    padding: 25px;
    margin-left: 10%;
    margin-right: 10%;
    margin-top: 8%;
    margin-bottom: 15%;
    box-shadow: 0px 0px 25px #000;
    background: rgba(0,0,0,0.8);
    border: 3px solid #eaeaea;
    border-radius: 25px;
}
.logo{
    width: 25%;
    padding: 30px;
    border-right: 1px solid #fff;
    float: left;
    background: transparent;
}
.logo img{
    width: 80%;
    margin-left: 10%;
    margin-right: 10%;
    display: block;
}
.inicial{
    width: 60%;
    display: table;
    float: right;
    background: transparent;
    padding-top:0 ;
}
.inicial p{
    margin-bottom: 10px;
    width: 100%;
    height: 37px;
    background: transparent;
    color: #fff;
}
.texto{
    width: 60px;
    height: 37px;
    background: transparent;
    float: left;
    text-align: right;
    padding-right: 6px;
    line-height: 37px;
    font-size: 1.2em;
}
.text_menor{
    width: 85px;
    height: 37px;
    background: transparent;
    float: left;
    line-height: 37px;
    font-size: 1em;
    text-align: right;
    padding-right: 8px;
}
.text{
    width: 150px;
    height: 37px;
    background: transparent;
    float: left;
    line-height: 37px;
    font-size: 1.2em;
    text-align: right;
    padding-right: 8px;
}

.imgmaior{
    width: 80%;
    margin-left: 10%;
    margin-right: 10%;
    min-height: 300px;
    display: table;
    margin-top: 40px;
}

.imgmaior img{
    width: 100%;
}

.maior{
    width: 60%;
    float: left;
    display: table;
}
.sg-maior{
    width: 100%;
    display: table;
}
.menor{
    width: 35%;
    float: right;
    display: table;
}
.input{
    width: 100%;
    height: 35px;
    font-size: 1.2em;
    color: #000;
    border: 1px solid #ccc;
    background: #fff;
    border-radius: 5px;
    margin-bottom: 30px;
    float: left;
}
.input2{
    width: 100%;
    height: 35px;
    font-size: 1.2em;
    color: #000;
    border: 1px solid #ccc;
    background: #fff;
    border-radius: 5px;
    margin-bottom: 10px;
    float: left;
}
.input_text{
    width: 65%;
    max-width: 65%;
    min-height: 150px;
    max-height: 200px;
    border-radius: 5px;
    font-size: 1.2em;
}

input.error{
    border: 1px solid #9f2348;
    background: #fff2ef;
}
textarea.error{
    border: 1px solid #9f2348;
    background: #fff2ef;
}
label.error{
    font-size: 0.8em;
    color:#9f2348 ;
}
.meia-tela{
    width: 100%;
    display: table;
    padding: 0;
    margin: 0px;
    float: left;
}
.centralizaForm{
    width: 80%;
    height: auto;
    display: table;
    margin-left: 10%;
    margin-left: 10%;
}

.separaCampo{
    width: 40%;
    display: table;
    height: auto;
    float: left;
    margin-left: 5%;
    margin-right: 5%;
}
.send, .gerar{
    width: 220px;
    height: 45px;
    color: #fff;
    text-align: center;
    font-size: 1.3em;
    display: block;
    margin-right: auto;
    margin-left: auto;
    margin-top: 35px;
    cursor: pointer;
    -webkit-transform: scale(1);
    -webkit-transition-timing-function: ease-out;
    -webkit-transition-duration: 500ms;
    background: rgba(50,187,163,0.8);
    border: none;
    float: left;
}
.send:hover, .botao1:hover, .botao:hover, .nova:hover, .botao2:hover, .gerar:hover{
    -webkit-transform: scale(1.1);
    -webkit-transition-timing-function: ease-out;
    -webkit-transition-duration: 900ms;
    background: #32bba3;
}
.mini-send{
    width: 30px;
    height: 30px;
    border: none;
    background: url('../images/comparar.png');
    float: left;
    color: transparent;
    margin-left: 30px;
    cursor: pointer;
    -webkit-transform: scale(1);
    -webkit-transition-timing-function: ease-out;
    -webkit-transition-duration: 500ms;
}
.mini-send:hover{
    -webkit-transform: scale(1.1);
    -webkit-transition-timing-function: ease-out;
    -webkit-transition-duration: 900ms;
}
.sg-mini-send{
    display: table;
    margin-top: 0px;
}
.sucesso{
    border: #32bba3;
    color: #fff;
    background: #32bba3;
    box-shadow: 3px 3px 6px #ccc;
    width: 50%;
    text-align: center;
    padding: 20px;
    border-radius: 6px;
    padding-top: 30px;
    font-size: 1.5em;
    margin: 50px auto;
}
.obs{
    border: #32bba3;
    color: #fff;
    background: #32bba3;
    box-shadow: 3px 3px 6px #ccc;
    width: 50%;
    text-align: center;
    padding: 20px;
    border-radius: 6px;
    padding-top: 30px;
    font-size: 1.5em;
    margin: 10px auto;
}
.red{
    background:url('../images/lixo.png') no-repeat;
    background-size: cover;
}

.centro{
    margin-right: auto;
    margin-left: auto;
    display: block;
    text-align: center;
    margin-left: 30%;
}

.erro{
    border: #32bba3;
    color: #fff;
    background: #32bba3;
    box-shadow: 3px 3px 6px #ccc;
    width: 50%;
    text-align: center;
    padding: 20px;
    border-radius: 6px;
    padding-top: 30px;
    font-size: 1.5em;
    margin: 50px auto;
}
.consultar{
    text-align: center;
    margin-top: 30px;
    color: #ccc;
}
#divdesaparecer{
    width: 80%;
    height: 30px;
    padding: 5px;
    line-height: 30px;
    color: red;
    font-size: 0.8em;
    box-shadow: 0px 0px 3px #d14233;
    background: #f3e2e0;
}
#divdesaparecer img{
    float: left;
    margin-left: 20px;
    padding-right: 15px;
}
/*
* Header
*/
header{
    background:url('../images/back.png');
    width: 100%;
    height: 110px;
    box-shadow: 0px 0px 6px #000;
}
.metade{
    width: 50%;
    float: left;
    height: 100px;
}

.metade p{
    color: #fff;
    text-align: right;
    padding: 30px 30px 0px 30px;
    font-size: 1.4em;
}

.metade li{
    color: #fff;
    list-style: none;
    text-align: right;
    line-height: 24px;
    font-size: 1em;
    float: right;
    margin-top: 10px;
    padding-right: 25px;
    width: 100%;
}

#clock{
    float: right;
}

.metade img{
    padding: 30px;
    width: 40%;
}

.relogio{
    float: right;
    padding-right: 30px;
    color: #eaeaea;
    font-size: 1em;
    padding-left: 10px;
    border: none;
    background: transparent;
}
/*
menu
*/
#nav, #nvi{
    list-style: none;
    text-align: center;
    background: #454746;
    height: 40px;
    position: relative;
    z-index: 500;
    box-shadow: 0px 0px 3px #000;
}

#nav li, #nvi li{
    float: left;
    position: relative;
    margin-left: 2px;
    margin-right: 2px;
}
#nav li a:link,
#nav li a:visited ,#nvi li a:link,
#nvi li a:visited {
    display: block;
    text-decoration: none;
    height: 35px;
    color: #fff;
    line-height: 35px;
    text-align: left;
    padding-left: 30px;
}

#nav li:hover a,
#nav li a:active,
#nav li a:hover, #nvi li:hover a,
#nvi li a:active,
#nvi li a:hover{
    display: block;
    line-height: 35px;
    text-align: center;
    text-decoration: none;
    height: 35px;
    color: white;
    font-weight: bold;
    text-align: left;
    padding-left: 30px;
    text-shadow: 1px 1px 2px #32bba3;
}
#nav li ul, #nvi li ul{
    display: none;
    position: absolute;
}
#nav li:hover ul, #nvi li:hover ul{
    display: block;
    border-radius:0px 0px 3px 3px  ;
}
#nav li ul li, #nvi li ul li{
    width: 200px;
    background: #454746;
    margin-left: -20px;

}

.submenu{
    margin:0;
    list-style:none;
    display:none;
    width: 120px;
    height: 30px;
    position:absolute;
    text-align: left;
    margin-left: -27px;
}

#nav li:hover .submenu, #nvi li:hover .submenu{
    display:block;
}

.submenu li a:link,
.submenu li a:visited{
    display: block;
    background: #32bba3;
    border-radius: 0px 0px 0px 0px;
    text-decoration: none;
    width: 120px;
    height: 30px;
    color: white;
    text-align: left;
    margin-left: -14px;
}

.submenu li:hover a,
.submenu li a:active,
.submenu li a:hover{
    display: block;
    background: #32bba3;
    text-decoration: none;
    width: 120px;
    height: 30px;
    color: white;
}


#nav .submenu li:hover, #nvi .submenu li:hover  {
    display:block;
}

input#control-nav {
    visibility: hidden;
    position: absolute;
    left: -9999px;
    opacity: 0;
}
/*
FOOTER
*/
footer{
    border-top: 1px solid #666;
    text-align: center;
    background: #454746;
}

footer p{
    color: #fff;
    padding-top: 10px;
}
.linha{
    width: 100%;
    height: 5px;
    background: #32bba3;
    box-shadow: 0px 0px 6px #000;
}

/*
* GERAL
*/

/*
* Novo Paciente
*/
.principal{
    width: 95%;
    margin-left: 2.5%;
    display: table;
    padding-bottom: 50px;
}
.principal h1{
    font-size: 1.2em;
    margin-top: 30px;
    margin-bottom: 40px;
    color:#ccc;
    border-bottom: 2px solid #eaeaea;
    width: 300px;
}
.secundaria{
    width: 100%;
    height: 500px ;
    min-height: 380px;
    display: table;
}
.botao,.botao1{
    width: auto;
    background:#32bba3;
    text-align: center;
    font-size: 1.2em;
    border-radius: 5px;
    box-shadow: 3px 3px 6px #666 ;
    color:#fff;
    margin-bottom: 30px;
    float: left;
    margin-right: 15px;
    padding: 2px 15px;
    margin-top: 20px;

}
.botao1{
    max-width: 150px;
    float: left;
    margin-right:30px;
}
.botao2{
    width: 220px;
    height: 45px;
    color: #fff;
    background: #32bba3;
    text-align: center;
    padding-top: 5px;
    font-size: 1.5em;
    margin-top: 100px;
    display: block;
    margin-left: auto;
    margin-right: auto;

}
.ft_text{
    font-size: 1.5em;
    color: #666;
}
.mrg-left{
    margin-left: 5%;
}
.quebra{
    width: 100%;
    clear: both;
}

.mostrafoto{
     width:150px;
     height:150px;
     position:relative;
    display: table;
    margin-left: 50px;
 }
.mostrafoto img{
    width:100%;
    height:150px;

}
/*============Busca paciente ===========*/
.cx-pacientes{
    display: table;
    padding-bottom: 10px;
    padding-top: 10px;
    width: 90%;
    margin-left: 5%;
    margin-right: 5%;
    min-height: 400px;
}
.sg-paciente{
    float: left;
    background: #eaeaea;
    border-radius:5px ;
    box-shadow: 3px 3px 6px #ccc;
    max-height: 160px;
    min-height: 120px;
    display: table;
    padding: 20px 20px;
    width: 23%;
    margin-left: 2.5%;
    margin-right: 2.5%;
    margin-bottom: 50px;
    -webkit-transform: scale(1);
    -webkit-transition-timing-function: ease-out;
    -webkit-transition-duration: 600ms;
}

.sg-paciente:hover{
    box-shadow: 3px 3px 6px #666;
    -webkit-transform: scale(1.01);
    -webkit-transition-timing-function: ease-out;
    -webkit-transition-duration: 600ms;
}

span a:hover{
    text-decoration: underline;
}

.ft-paciente{
    width: 25%;
    min-height: 80px;
    float: left;

}

.ft-paciente img{
    width: 100%;
}
.info-paciente{
    float: left;
    text-align: center;
    width: 75%;

}
.info-paciente h4{
    font-size:1.4em
}
.info-paciente p{
    font-size: 1em;
    line-height: 20px;
}
.inputFoto{
    width: 90%;
    height: 30px;
    font-size: 1.2em;
    color: #000;
    border: 1px solid #ccc;
    background: #fff;
    border-radius: 5px;
    margin-bottom: 10px;
    margin-left: 5%;
    margin-right: 5%;
}
.ft_textFoto{
    font-size: 1.1em;
    color: #666;
    margin-left: 50px;
}
.pesquisa{
    width: 65%;
    height: 30px;
    font-size: 1.2em;
    color: #000;
    border: 1px solid #ccc;
    background: #fff;
    border-radius: 5px;
    margin-bottom: 10px;
    float: left;
    display: table;
    margin-left: 5%;
    margin-right: 2.5%;
}

.botaoBusca{
    width: 15%;
    background:#32bba3;
    text-align: center;
    font-size: 1.2em;
    border-radius: 5px;
    box-shadow: 3px 3px 6px #666 ;
    color:#fff;
    margin-bottom: 30px;
    float: left;
    padding: 2px 8px;
    -webkit-transform: scale(1);
    -webkit-transition-timing-function: ease-out;
    -webkit-transition-duration: 500ms;

}

.botaoBusca:hover{
    -webkit-transform: scale(1.1);
    -webkit-transition-timing-function: ease-out;
    -webkit-transition-duration: 900ms;
    cursor: pointer;
}

.centralizaBusca{
    width: 80%;
    height: auto;
    display: table;
    margin-left: 10%;
    margin-right: 10%;
}

.separaBusca{
    width: 80%;
    display: block;
    height: auto;
    float: left;
    margin-left: 10%;
    margin-right: 10%;
}

.info-paciente span {
    font-size: 0.5em;
    float: right;

}
/*============Galeria ==============*/
.cx-galeria{
    width: 100%;
    height: auto;
    display: table;

}
.ft-galeria{
    width: 200px;
    height: 150px;
    float: left;
    border: 1px solid white;
    position: relative;
}
.check-sg {
    width: 200px;
    height: 150px;
    float: left;
    margin-bottom: 10px;
    margin-right: 2%;
    margin-left: 2%;
    box-shadow: 0px 0px 3px #666;
    margin-top: 40px;
    display: table;
}

.check-sg:hover{
    box-shadow: 0px 0px 3px #000;
}
.check-sg img{
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    display: block;
}
.sg-check {
    list-style: none;
    display: table;
    width: 200px;
    height: 150px;
    float: left;
    margin-top: 40px;
    margin-right: 2%;
    margin-left: 2%;
    box-shadow: 0px 0px 0px #ccc;
}

.sg-check:after {
    content: "";
    clear: both;
}

.sg-bt {
    box-sizing: border-box;
    float: left;
    height: 50px;
    position: relative;
    width: 100%;
    margin-left: -5%;
}

.sg-bt label img{
    bottom: 1px;
    cursor: pointer;
    display: table;
    left: 1px;
    position: absolute;
    right: 1px;
    top: 1px;
    height:150px;
    margin-left: -5px;
    border: 8px solid #fff;
    width: 100%;
}

.sg-check input:checked + label img {
    border: 8px solid #32bba3 ;
    color:#fff;
    font-weight: bold;
}
.float-right{
    float: right;
}


/*-------menu camera ---------*/
.demo-3 {
    position:relative;
    width: 190px;
    height: 80px;
    overflow:hidden;
    float:right;
    margin-right:20px;
    margin-top: -5%;
}


.demo-icon {
    width: 30px;
    height: 25px;
    text-align: center;
    border-radius: 5px;
    display: table;
    font-size: 1.2em;
    background: #32bba3;
    box-shadow: 3px 3px 6px #666 ;
    float: left;
    margin-left: 5%;
    padding: 5px;
    color: #fff;
    text-decoration: none;

}
.demo-3 li a img{
    width: 100%;

}



/*------------comparacao --------*/
.compara-fundo{
    width: 100%;
    margin-left:0;
    background: rgba(0,0,0,0.95);
    position: absolute;
    z-index: 500;
    margin-top:5px;
}

.compara-fundo2{
    width: 100%;
    min-height: 800px;
    display: table;
    background: rgba(0,0,0,0.9);
    position: absolute;
    z-index: 9998;
}
.compare-ft{
    width: 50%;
    float: left;
    height: 400px;
    position: relative;

}
.compare-ft img{
    width: 100%;
    height: 400px;
}

.comp-ft{
    width: 40%;
    margin-left: 5%;
    margin-right: 5%;
    margin-bottom:50px ;
    background: #fff;
    height: 500px;
    float: left;
}
.comp-ft img{
    width: 100%;
    height: 100%;

}

.pesquisa{
    width: 65%;
    height: 30px;
    font-size: 1.2em;
    color: #000;
    border: 1px solid #ccc;
    background: #fff;
    border-radius: 5px 0px 0px 5px;
    margin-bottom: 10px;
    float: left;
    display: table;
}

.botaoBusca{
    width: 120px;
    background:#32bba3;
    border: 1px solid #32bba3;
    height: 34px;
    text-align: center;
    font-size: 1.2em;
    border-radius: 0px 5px 5px 0px;
    box-shadow: 3px 3px 6px #666 ;
    color:#fff;
    margin-bottom: 30px;
    float: left;
    padding: 2px 8px;
    -webkit-transform: scale(1);
    -webkit-transition-timing-function: ease-out;
    -webkit-transition-duration: 500ms;

}

.botaoBusca:hover{
    -webkit-transform: scale(1.1);
    -webkit-transition-timing-function: ease-out;
    -webkit-transition-duration: 900ms;
    cursor: pointer;
}

.centralizaBusca{
    width: 80%;
    height: auto;
    display: table;
    margin-left: 10%;
    margin-right: 10%;
}

.separaBusca{
    width: 80%;
    display: block;
    height: auto;
    float: left;
    margin-left: 10%;
    margin-right: 10%;
}

#content {
    margin: 0 auto;
    width: 650px;
    height: 200px;
    background: transparent;
}

#carrossel {
    float: left;
    width: 630px;
    overflow: hidden;
    height: 150px;
}

#carrossel ul li {
    width: 100%;
    height: 150px;
    float: left;
    margin: 0 10px;
}

#carrossel ul li img{
    width: 100%;
    height: 150px;
}

#menu-carrossel {
    float: left;
    clear: both;
    width: 100%;
    text-align: center;
}

.masc{
    width: 100%;
    height: 800px;
    background: rgba(0,0,0,0.9);
}
.content{
    display: table;
}
.sg-content{
    margin-left: 5%;
    width: 80%;
    display: table;
}

#content {
    margin: 0 auto;
    width: 650px;
    height: 200px;
}

#carrossel {
    float: left;
    width: 100%;
    overflow: hidden;
    height: 122px;
    display: block;
    margin-left: 150px;
}
#carrossel ul{
    width: 100%;
    height: 122px;
}
#carrossel ul li {
    width: 15%;
    height: auto;
    float: left;
    margin: 0 5px;
}
#carrossel ul li a{
    width: 120px;
    height: 120px;
}
#carrossel ul li a img{

    width: 80%;
    margin-left: 10%;
    margin-right: 10%;
    height: 100px;
}

#menu-carrossel {
    float: left;
    width: 5%;
    text-align: center;
    margin-top: -10%;
    height: 45px;
}
#menu-carrossel1 {
    float: right;
    width: 5%;
    text-align: center;
    height: 45px;
    margin-top: -10%;
}
.sg-caroussel{
    width: 70%;
    margin-left: 15%;
    margin-right: 15%;
    display: table;
    margin-top: 10px;
    height: 70px;
}
.destaca-img {
    border: 2px solid #32bba3 ;
}
.maior{
    width: 80%;
    height: 500px;
    margin-right: 10%;
    margin-left: 10%;
}
.maior img{
    width: 100%;
    height: 500px;
}

.fileUpload {
    position: relative;
    margin: 10px;
    background: #cbdce1;
    border: 2px dashed #37555f;
    text-align: center;
    padding-top: 20px;
}


.fileUpload input.upload {
    top: 0;
    right: 0;
    margin: 0;
    padding: 0;
    font-size: 20px;
    cursor: pointer;
    opacity: 0;
    filter: alpha(opacity=0);
    width: 80%;
    height: 100px;

}

.todo{
    width: 70%;
    background: #e7f0f4;
    padding: 10px;
    margin: 50px auto;
    display: table;
}

.central{
    margin-left: auto;
    margin-right: auto;
    display: block;
    width: 250px;
}

.file-list{
    width: 50%;
    margin: 0 auto;
}

.file-list img{
    width: 100%;
}

/*===================EDITOR ==================*/
.cx{
    width: 65%;
    display: table;
    min-height: 100px;
    margin-left: auto;
    margin-right: auto;


}
.bt{
    width: auto;
    background:#32bba3;
    text-align: center;
    font-size: 1.2em;
    border-radius: 5px;
    box-shadow: 3px 3px 6px #666 ;
    color:#fff;
    float: left;
    padding: 2px 15px;
}
.bt a{
    color:#fff;
    font-weight:bold ;
    text-decoration: none;

}
.bt:hover{
    -webkit-transform: scale(1.1);
    -webkit-transition-timing-function: ease-out;
    -webkit-transition-duration: 900ms;
    cursor: pointer;
}
#wPaint{
    position:relative;
    width:640px;
    height: 480px;
    display: block;
    margin-left: auto;
    margin-right: auto;
}
/*================== OBSERVACAO ================*/
.mostra-ft{
    width: 50%;
    height: 550px;
    float: left;
    margin-top: 90px;
    margin-left: 2.5%;
}
.mostra-ft img{
    width: 100%;
    height: 500px;
}
.observacao{
    width: 40%;
    display: table;
    float: left;
    margin-left: 5%;
    margin-top: 90px;
}
.observacao label{
    color: #fff;
    font-size: 1.5em;
    font-weight: bold;
}
.obs-ft{
    min-width: 95%;
    max-width: 95%;
    min-height: 370px;
    max-height: 370px;
    border: 1px solid #ccc;
    border-radius: 5px;
    padding-left: 10px;
    font-size: 1.2em;
    color: #444;
}

/*========================CAPTURA =======*/
.cx-video{
    width: 50%;
    display: table;
    float: left;
}
.sg-bt-img{
    margin-top: 20px;
    width: 60%;
    display: table;
}
/* --- versao https
.bt-img{
    float: left;
    margin-left: 30px;
    display: table;
    padding: 5px;
    background: #32bba3;
    border: none;
    color:transparent;
    cursor: pointer;
    border-radius: 5px;
    -webkit-transform: scale(1);
    -webkit-transition-timing-function: ease-out;
    -webkit-transition-duration: 900ms;
}
.bt-img:hover{
    -webkit-transform: scale(1.1);
    -webkit-transition-timing-function: ease-out;
    -webkit-transition-duration: 900ms;
    cursor: pointer;
}
.bt-img img{
    width: 35px;
    height: 35px;
}
*/
.bt-img{
    float: left;
    margin-left: 30px;
    display: table;
    padding: 5px;
    background: #32bba3;
    border: none;
    color:transparent;
    cursor: pointer;
    width: 35px;
    height: 35px;
    border-radius: 5px;
    -webkit-transform: scale(1);
    -webkit-transition-timing-function: ease-out;
    -webkit-transition-duration: 900ms;

}
.bg-um{
    background: url('../images/camera.jpg') no-repeat;
    background-size: cover;
}
.bg-tres{
    background: url('../images/girarimg.jpg') no-repeat;
    background-size: cover;
}

.bg-dois{
    background: url('../images/config.jpg') no-repeat;
    background-size: cover;
}
.bt-img:hover{
    -webkit-transform: scale(1.1);
    -webkit-transition-timing-function: ease-out;
    -webkit-transition-duration: 900ms;
    cursor: pointer;
}
.bt-img img{
    width: 35px;
    height: 35px;
}
.test{
    width: 50%;
    height: 490px;
    float: left;
    display: table;

}
.test canvas{
    width: 500px;
    height: 200px;
}
.sg-send{
    width: 15%;
    display: table;
    margin-left: auto;
    margin-right: auto;
}
.view{
    width: 40%;
    display: table;
    float: left;
}
.view h1{
    margin: 0;
    color: transparent;
    border:none;
    margin-top:-23px ;
}
#upload_results img{
    width: 100px;
    height: 100px;
    float: left;
}
#divsalvando{
    width: 100%;
    height: 600px;
    display: block;
    padding-top: 10%;
    margin-right: auto;
    position: absolute;
    z-index: 9999;
    background: rgba(250,250,250,0.1);
}
#divsalvando p{
    font-size: 2.5em;
    color: white;
    text-align: center;
}

.ajusta{
    margin-top: 120px;
}
/*================MODAL============*/

/* The Modal (background) */
.modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 999; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content/Box */
.modal-content {
    background-color: #fefefe;
    margin: 15% auto; /* 15% from the top and centered */
    padding: 20px;
    border: 1px solid #888;
    display: table;
    width: 80%; /* Could be more or less, depending on screen size */
}

/* The Close Button */
.close {
    color: #aaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
}

.close:hover,
.close:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
}

.sg-avatar{
    width: 120px;
    height: 120px;
    display: table;
    text-align: center;
    float: left;
    background: #eaeaea;
    margin-left: 30px;

}
.sg-avatar:hover{
    box-shadow: 1px 2px 0px #ccc;
}
.bt-modal{
    background: none;
    color:#666;
    border :none;
    cursor:pointer;
    font-weight: bold;
}
.bt-modal:hover{
    color: #111;
}

#vid{
    width: 75%;
    height: auto;
}
.btn-capturar{
    width: auto;
    padding: 5px 10px;
    background: #32bba3;
    color:#fff;
    font-weight: bold;
    font-size: 1.2em;
    border-radius:5px;
    margin-top: 30px;
    margin-left: 5%;
    border:none;
    box-shadow: 1px 1px 2px #666;
    cursor: pointer;
}
.some-captura {
    display: none;
}
.check-sg .img-obs{
    width: 40px;
    height: 40px;
    float: right;
    position: absolute;
    margin-left: 178px
}
.HoraFoto{
    color: gold;
    font-weight: lighter;
    font-family: "Calibri";
    margin-top: -60px;
    margin-left: 10%;
    float: right;
    position: absolute
}