body {
    background: url(../images/background.jpg)  no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    /*background-size: 250vh 100vh;
    background-repeat: no-repeat;*/

    font-family: "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-size: 0.8em;
}

#content {
    margin-top: 50px;
    margin-right: auto;
    margin-left: auto;
}

#content img {
    display: block;
    margin: auto;
}

#content div.card {
    border-radius: 10px;
    max-width: 400px;
    height: auto;
    margin-left: auto;
    margin-right: auto;
}

.efecto
{
    position: relative;
}
.efecto:before, .efecto:after
{
    z-index: -1;
    position: absolute;
   content: "";
    bottom: 20px;
    left: 10px;
    width: 52%;
    top: 80%;
    max-width:400px;
    background: rgba(0, 0, 0, 0.151);
    -webkit-box-shadow: 0 25px 10px rgba(0, 0, 0, 0.151);
    -moz-box-shadow: 0 25px 10px rgba(0, 0, 0, 0.151);
    box-shadow: 0 25px 10px rgba(0, 0, 0, 0.151);
    -webkit-transform: rotate(-7deg);
    -moz-transform: rotate(-7deg);
    -o-transform: rotate(-7deg);
    -ms-transform: rotate(-7deg);
    transform: rotate(-7deg);
}
.efecto:after
{
    -webkit-transform: rotate(7deg);
    -moz-transform: rotate(7deg);
   -o-transform: rotate(7deg);
    -ms-transform: rotate(7deg);
    transform: rotate(7deg);
    right: 10px;
    left: auto;
}


.card-footer {
    background-color: rgba(98, 81, 81, 0.1);
    -moz-box-shadow: 0px 3px 8px rgba(100, 100, 100, 0.294);
    -webkit-box-shadow: 0px 3px 8px rgba(100, 100, 100, 0.294);
    box-shadow: 0px 3px 8px rgba(100, 100, 100, 0.294);
}

#content form button {
    background-color: rgba(69, 66, 66, 0.61);
    border: rgba(69, 66, 66, 0.61) 0px;
}

#content form input {
    background-color: rgba(98, 81, 81, 0.1);
    max-width: 350px;
    margin-left: auto;
    margin-right: auto;
}
  
#iconlock {
    background-image: url(../images/input-lock.png);
    background-repeat: no-repeat;
    background-position: 6px 6px;
    background-size: 25px;
    padding-left: 40px;
    margin: 0 10px 0 2px;
    border-radius: 1px;
}

#iconuser {
    background-image: url(../images/input-user.png);
    background-repeat: no-repeat;
    background-size: 25px;
    background-position: 6px 6px;
    padding-left: 40px;
    border-radius: 2px;
}

::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: rgb(180, 180, 180)!important;
    opacity: 1; /* Firefox */
}
.custom-checkbox .custom-control-input:checked ~ .custom-control-label::before {
    background-color: #fbe959 !important;
}

.custom-checkbox .custom-control-input:indeterminate ~ .custom-control-label::before {
    background-color: #fff58b
}
.custom-control-label {
    white-space: nowrap;
}
input {
    border: none!important;
}
.custom-control-input {
    width: 10px;
}
.custom-control-input,
textarea:hover, 
input:hover, 
textarea:active, 
input:active, 
textarea:focus, 
input:focus,
button:focus,
button:active,
button:hover,
label:focus,
.btn:active,
.btn.active
{
    outline:0px !important;
    border: none!important;
    -webkit-appearance:none;
    box-shadow: none!important;
}

@media (max-width: 480px) {
    .card {max-width: 95%!important;}
    #label_forgot_pass { width: 120%!important; white-space: pre-wrap!important; font-size: 11px;}
 }