body {
    margin: 0;
    background: #000; 
}
video { 
    position: fixed;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: -100;
    transform: translateX(-50%) translateY(-50%);
    background: url('/resources/images/fondo-inicio.png') no-repeat;
    background-size: cover;
    transition: 1s opacity;
}
.stopfade { 
    opacity: .5;
}

#polina { 
    font-family: Agenda-Light, Agenda Light, Agenda, Arial Narrow, sans-serif;
    font-weight:100; 
    background: rgba(0,0,0,0.3);
    color: white;
    padding: 2rem;
    width: 33%;
    margin:2rem;
    float: right;
    font-size: 1.2rem;
}
h1 {
    font-size: 3rem;
    text-transform: uppercase;
    margin-top: 0;
    letter-spacing: .3rem;
}
#polina button { 
    display: block;
    width: 80%;
    padding: .4rem;
    border: none; 
    margin: 1rem auto; 
    font-size: 1.3rem;
    background: rgba(255,255,255,0.23);
    color: #fff;
    border-radius: 3px; 
    cursor: pointer;
    transition: .3s background;
}
#polina button:hover { 
    background: rgba(0,0,0,0.5);
}

a {
    display: inline-block;
    color: #fff;
    text-decoration: none;
    background:rgba(0,0,0,0.5);
    padding: .5rem;
    transition: .6s background; 
}
a:hover{
    background:rgba(0,0,0,0.9);
}
/*@media screen and (max-width: 500px) { 
    div{width:70%;} 
}
@media screen and (max-device-width: 800px) {
    
}*/

.box{
  position:absolute;
  height:100%;
  width:100%;
  font-family:Helvetica;
  color:#fff;
  background:rgba(33,45,83,0.40);
  /*background:rgba(0,0,0,0.13);*/
}
.box h1{
  text-align:center;
  margin:30px 0;
  font-size:30px;
}
.box input{
  display:block;
  width:300px;
  margin:20px auto;
  padding:15px;
  background:rgba(32,44,82,0.3);
  color:#fff;
  border:0;
}
.box input:focus,.box input:active,.box button:focus,.box button:active{
  outline:none;
}

.button{
  background:rgba(32,44,82,0.7)!important;
  border:0;
  color:#fff;
  padding:10px;
  font-size:20px;
  width:300px;
  margin:20px auto;
  display:block;
  cursor:pointer;
  text-align: center;
}

.button:active{
  background:#e8580e;
}
.button:hover{
  text-decoration:none;  
  background:rgba(121,0,24,0.7);
  color:#fff;
/*  border:0;
 
  padding:10px;
  font-size:20px;
  width:300px;
  margin:20px auto;
  display:block;
  cursor:pointer;
  text-align: center;*/
}



.box p{
  font-size:14px;
  text-align:center;
}
.box p:hover{
  font-size:14px;
  text-align:center;
  cursor: pointer;
}

.box p span{
  cursor:pointer;
  color:#666;
}

.holder{        
    width:100%;
    display:block;
}
.content{
    background:#fff;
    padding: 28px 26px 33px 25px;
}

.alert-danger {
    width: 300px;
    margin: 5px auto;
}

.logo-fl{
    display: block;
    margin: 20px auto;
}

.oculto{
  display :none;
}
.btn-orange {background: rgba(239, 96, 34, 1)!important;}
.box-blue {background: rgba(33, 45, 83, 0.4)!important; border:0!important;margin-top:140px;}

/* animations login julio 2018, rodrigo */

#uno
{
position:relative;
animation:mymove1 1s;
-webkit-animation:mymove1 1s; /* Safari and Chrome */
animation-timing-function: ease;
}
 
@keyframes mymove1
{
from {top:-50px;}
to {top:0px;}
}
 
@-webkit-keyframes mymove1 /* Safari and Chrome */
{
from {top:-50px;}
to {top:0px;}
}
 
#dos
{
position:relative;
animation:mymove2 1.5s;
-webkit-animation:mymove2 1.5s; /* Safari and Chrome */
}
 
@keyframes mymove2
{
from {top:-80px;}
to {top:0px;}
}
 
@-webkit-keyframes mymove2 /* Safari and Chrome */
{
from {top:-80px;}
to {top:0px;}
}
 
#tres
{
position:relative;
animation:mymove3 2s;
-webkit-animation:mymove3 2s; /* Safari and Chrome */
}
 
@keyframes mymove3
{
from {top:-110px;}
to {top:0px;}
}
 
@-webkit-keyframes mymove3 /* Safari and Chrome */
{
from {top:-110px;}
to {top:0px;}
}
 
#cuatro
{
position:relative;
animation:mymove4 2.5s;
-webkit-animation:mymove4 2.5s; /* Safari and Chrome */
}
 
@keyframes mymove4
{
from {top:-140px;}
to {top:0px;}
}
 
@-webkit-keyframes mymove4 /* Safari and Chrome */
{
from {top:-140px;}
to {top:0px;}
}

#cinco
{
position:relative;
animation:mymove5 1.5s;
-webkit-animation:mymove5 1.5s; /* Safari and Chrome */
}
 
@keyframes mymove5
{
from {top:170px;}
to {top:0px;}
}
 
@-webkit-keyframes mymove5 /* Safari and Chrome */
{
from {top:170px;}
to {top:0px;}
}

#seis
{
position:relative;
animation:mymove6 1s;
-webkit-animation:mymove5 1s; /* Safari and Chrome */
}
 
@keyframes mymove6
{
from {top:200px;}
to {top:0px;}
}
 
@-webkit-keyframes mymove6 /* Safari and Chrome */
{
from {top:200px;}
to {top:0px;}
}


#siete
{
position:relative;
animation:mymove7 1s;
-webkit-animation:mymove5 1s; /* Safari and Chrome */
}
 
@keyframes mymove7
{
from {top:-200px;}
to {top:0px;}
}
 
@-webkit-keyframes mymove7 /* Safari and Chrome */
{
from {top:-200px;}
to {top:0px;}
}

#ocho
{
position:relative;
animation:mymove7 1s;
-webkit-animation:mymove5 1s; /* Safari and Chrome */
}
 
@keyframes mymove8
{
from {top:-230px;}
to {top:0px;}
}
 
@-webkit-keyframes mymove8 /* Safari and Chrome */
{
from {top:-230px;}
to {top:0px;}
}

#nueve
{
position:relative;
animation:mymove9 1s;
-webkit-animation:mymove5 1s; /* Safari and Chrome */
}
 
@keyframes mymove9
{
from {top:-260px;}
to {top:0px;}
}
 
@-webkit-keyframes mymove9 /* Safari and Chrome */
{
from {top:-260px;}
to {top:0px;}
}


#box-login
{
position:relative;
animation:mymovebox 1.5s;
-webkit-animation:mymovebox 1.5s; /* Safari and Chrome */
}
 
@keyframes mymovebox
{
from {top:-100px;opacity: 0;}
to {top:0px;opacity: 1;}
}
 
@-webkit-keyframes mymovebox /* Safari and Chrome */
{
from {top:-100px;opacity: 0;}
to {top:0px;opacity: 1;}
}

.log-well {
    width:340px!important; 
    background-color: rgba(255,255,255,0.4)!important;
    border-color:transparent!important;
    margin-top:15px!important;
}