/*LOGIN ESTILOS*/
.login {
    display: flex;
    margin: auto !important;
    height: 100%;
    /* background-size: 22px !important; */
    /* background-image: url(images/SOSAPACH_imagen_agua-04.jpg) !important; */
    background-color: #9d2449 !important;
    background-size: cover;
    color: #fff;
}
.login_content {
    text-shadow: none;
    position: initial;
    margin: auto;
    padding: 0;
    /* min-width: 500px; */
}
.logos {
    display: flex;
    box-shadow: 2px 2px 11px 0px #aeaeae6e;
    margin-bottom: 2em;
}

.logos div {
    background: #79193f;
    width: 100%;
    text-align: center;
}

.login .col-10.mx-auto {
    background: rgb(255 255 255 / 81%);
    padding: 4% 10%;
    box-sizing: border-box;
    box-shadow: 0 0 20px #333;
    border-radius: 21px;
}

.logos img {
    width: 22%;
    height: auto !important;
    object-fit: contain;
    padding: 17px;
}

.logos div img {
    width: 50%;
}
i.fas {
    color: #44999e;
}
.uk-notify-message-success{
    width: 350px;
}
.uk-notify-message-danger{
    width: 350px;
}
html {
    height: 100%;
}
body{
    font-family: 'Montserrat', sans-serif !important;
}

#username {
    background-position: 10px 10px !important
}
#password {
    background-position: 10px -53px !important
}
.login_form, .registration_form {
    display: flex;
    margin: auto;
    position: initial;
}
.login_wrapper {
    display: flex;
    position: initial !important;
    margin:  auto;
    width: 100%;
    height: 100%;
}
body.login > div {
    width: 100%;
}
section.login_content >div {
    background: #fff;
    padding: 35px 0;
    /* border: 2px solid #ccc; */
    position: relative;
    width: 97%;
    margin: 0 auto;
}
.reset_pass {
    margin-top: 10px !important
}
.login_content div .reset_pass {
    margin-top: 13px !important;

}

.form-group img {
    display: inline-block;
    width: 20px;
    vertical-align: middle;
    margin-right: 2%;
}
.login_content form input[type="text"], .login_content form input[type="email"], .login_content form input[type="password"]{
    box-shadow:none;
    border: none;
    color: #000 !important;
    vertical-align: middle;
    width: 80%;
    /*background: #1a3e4c !important;*/
    border-radius: 0;
}

input#loginForm:usr, input#loginForm:pwd {
    width: 80%;
    display: inline-block;
    border: none !important;
    background: none;
    box-shadow: none;
    color: #fff !important;
    margin: 0;
    vertical-align: middle;
}

.login_content form input[type="text"]::placeholder,  input#loginForm:pwd::placeholder {
    color: #fff !important;
    font-size: 1.5em;
}
.input-mail{
    border-radius: 4px;
}
.input-mail:focus {
    border-color: #66afe9;
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102,175,233,.6);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102,175,233,.6);
}
.login_content .form-group {
    border: 1px solid #c6c6c6;/*Borde de los input*/
    background: #fff;
}
.enviar input.btn {
    width: 100%;
    background: none;
    font-size: 1.5em;
    text-transform: uppercase;
    border-radius: 0;
}

body.login .loginFormUk {
    background: #9D2449;
    border:1px solid #fff;
    padding: .3em 1em;
    border: 1px solid #611232;
}

body.login .login-back {
    color: #9D2449;
    background-color: transparent;
    border: 1px solid #611232;
    padding: .3em 1em;
}

body.login a{
    color: #ffffff; /*color de los links*/
}

.login a.btn {width:20% !important;display:block;border-radius: 0;text-transform: uppercase;}


form#loginForm >div:nth-child(2):after {
    /* content: ""; */
    border: 1px solid #241E20; /*borde de la imagen*/
    width: 103%;
    position: absolute;
    top: -7px;
    left: -7px;
    right: 0px;
    bottom: -7px;
}

.login_content .ui-panel .ui-panel-content {
    padding: 0;
}
.footer {
    border-top: 1px solid #611232;
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
    color: #fff;
    background: #611232;
    padding-top: 5px;
    padding-bottom: 5px;
    font-size: 75%;
}

form#loginForm .uk-form-danger {
    border-color: #dc8d99 !important;
    background: #fff7f8 !important;
    color: #d85030 !important;
}
#myModalLabel{
    color: #7e8890;
    font-size: 18px;
    line-height: 1.8;
    font-weight: 700;
    font-family: 'Montserrat', sans-serif !important;
}
@media (max-width: 600px) {

.footer .col {
    flex-basis: auto;
    text-align: center !important;
    margin-bottom: .4em;
}

body.login .login-back, body.login .loginFormUk {
    width: 100%;
    margin-bottom: .5em;
}

.login .col-10.mx-auto {
    margin-top: -40% !important;
    padding: 20% 10%;
}
.logos img {
    width: 30%;
}
}