@font-face{
    font-family:font;
    src: url("../font/OpenSans-Regular.ttf");
}
@font-face{
    font-family:font2;
    src: url("../font/OpenSans-Bold.ttf");
}
*{
    margin: 0;
    padding: 0;
}
body{
    font-family: font1;
    background: url("../img/fondo0.jpg");
    background-size: cover;
}
#form3 ::placeholder {
  color: white;
}
#formLogeo{
    color: #454444;
    width: 30%;
    border-radius: .5em;
    margin: 5em auto;
    background:  url("../img/fondo3.png");
    padding: 2em 0  0 0;
    box-shadow: 4px 3px 6px rgba(0, 0, 0, 0.4);
}
#img-arka{
    width: 3%;
    display: inline-block;
}
#logo-form1{
    width: 45%;
    margin: 1em auto 0 auto;
}
#logo-formLogeo{
    width: 60%;
    margin:  0 auto;
}
.btn-iLogeo{
    font-family: font2;
    background: white;
    margin: 2em 0 0 0;
    width: 100%;
    padding: .4em 0;
    font-size: 1.5em;
    border: none;
    color: #085c94;
    border-radius: 0 0 0.2em .2em;
}
.ipt-iLogeo{
    background: none;
    padding: .3em 0;
    background: url("../img/cuenta.png") no-repeat;
    background-size: 9%;
    width: 80%;
    color: white;
    font-size: 1.1em;
    text-align: center;
    border:none;
    font-family: font;
    margin: .4em 10% 0 10%;
    border: none;
    border-bottom: 1px solid rgba(208, 208, 208, 0.75);
    transition: all .3s ease;
}
.ipt-iLogeo:focus{
    outline: 0px;
     border-bottom: 2px solid rgba(33, 158, 188, 0.75);
    box-shadow: 2px 3px 4px rgba(0,0,0,.8);
    width: 81%;
    transition: all .3s ease;
}
.ipt-iLogeo2{
    background: none;
    padding: .3em 0;
    background: url("../img/candado2.png") no-repeat;
    background-size: 9%;
    width: 80%;
    color: white;
    font-size: 1.1em;
    text-align: center;
    border:none;
    font-family: font;
    margin: .4em 10% 0 10%;
    border: none;
    border-bottom: 1px solid rgba(208, 208, 208, 0.75);
    transition: all .3s ease;
}
.ipt-iLogeo2:focus{
    outline: 0px;
     border-bottom: 2px solid rgba(33, 158, 188, 0.75);
    box-shadow: 2px 3px 4px rgba(0,0,0,.8);
    width: 81%;
    transition: all .3s ease;
}
@media screen and (max-width: 769px) {
    body{
        background: #3A3A3A;
    }
    #formLogeo{
    width: 90%;
    border-radius: .5em;
    margin: 2em auto;
    padding: 2em 0  0 0;
    background-size: cover;
    }
    #logo-formLogeo{
    width: 80%;
    margin:  0 auto;
    }
    .ipt-iLogeo,.ipt-iLogeo2{
    padding: .5em 0;
    font-size: 2.4em;
    margin: .8em 10% 0 10%;
    }
    .btn-iLogeo{
    font-family: font2;
    background: white;
    margin: 2em 0 0 0;
    width: 100%;
    padding: .4em 0;
    font-size: 3em;
    border: none;
    color: #085c94;
    border-radius: 0 0 0.2em .2em;
}
}