/* Admin styles */

* {
    margin: 0px;
    padding: 0px;
}

.clearfix, .cl {
    clear: both;
}

body {
    font-family: raleway, sans-serif;
    font-size: 13px;
}

/*-----------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/* login page 
*/
.login-page {
    width: 100%;
    height: 100vh;
    background-repeat: no-repeat;
    background-size: cover;
    color: #fff;
}

.login-page.spring {
    background-image: url("images/login-page/jaro.jpg");
}

    .login-page.summer {
        background-image: url("images/login-page/leto.jpg");
    }

    .login-page.autumn {
        background-image: url("images/login-page/podzim.jpg");
    }

    .login-page.winter {
        background-image: url("images/login-page/zima.jpg");
    }

.login-content {
    width: 30%;
    float: left;
    height: 100vh;
    background-image: url("images/over65.png");
    text-align: center;
    min-width: 320px;
}

.login-welcome {
    background-image: url("images/login-page/login-logo.png");
    background-repeat: no-repeat;
    background-size: 100% auto;
    display: inline-block;
    height: 5vw;
    margin: 11vh auto 0;
    width: 17vw;
    min-width: 180px;
    min-height: 55px;
}

.login-form {
    border-bottom: 1px solid #fff;
    border-top: 1px solid #fff;
    display: inline-block;
    margin-top: 11vh;
    padding-bottom: 6vh;
    padding-top: 7vh;
    width: 17vw;
    min-width: 180px;
}

.login-input input, .pass-input input {
    background-color: transparent;
    background-image: url("images/over65.png");
    border: medium none;
    color: #fff;
    margin-bottom: 1.5vh;
    min-width: 160px;
    padding: 10px;
    width: calc(17vw - 20px);
}

    .login-input input.input-validation-error, .pass-input input.input-validation-error {
        outline: 1px solid red;
    }

.login-form span.field-validation-error {
    display: none;
}

.login-form span {
    display: inline-block;
    font-size: 1.26vw;
    margin-bottom: 2vh;
    margin-top: 2vh;
    opacity: 0.6;
}

    .login-form span.field-validation-valid {
        margin: 0;
    }

.save-login, .redir-home {
    text-align: left;
    line-height: 24px;
    color: silver;
    min-width: 180px;
}

    .save-login input {
        float: left;
        margin-right: 10px;
        margin-top: 6px;
    }

    .redir-home input {
        float: left;
        margin-right: 10px;
        margin-top: 6px;
    }

button.login-btn {
    background-color: #000;
    border: medium none;
    color: #fff;
    font-size: 15px;
    margin-bottom: 1.5vh;
    margin-top: 4vh;
    padding: 0.7vw;
    text-transform: uppercase;
    width: 17vw;
    cursor: pointer;
    min-width: 180px;
}

.trouble {
    color: #8e8e8e;
    margin: 9vh auto 0;
    width: 17vw;
    min-width: 180px;
}

    .trouble a {
        color: #8e8e8e;
    }

.validation-summary-errors {
    background: red;
    color: #fff;
    font-size: 12px;
    left: 0;
    padding: 10px;
    position: absolute;
    bottom: 0;
    width: calc(100vw - 20px);
}

    .validation-summary-errors ul {
        list-style-type: none;
        margin: 0;
        padding: 0;
    }

/* responzive */
@media (max-width: 768px) {
    .login-content {
        float: none;
        margin: 0px auto;
        width: 60%;
    }

    button.login-btn {
        font-size: 12px;
    }
}

@media (max-width: 360px) {
    .login-content {
        width: 60%;
    }
}

@media (max-height: 1024px) {
    .trouble {
        font-size: 11px;
        margin: 5vh auto 0;
    }

    .login-welcome {
        margin: 7vh auto 0;
    }

    .login-form {
        margin-top: 6vh;
    }
}
/*-----------------------------------------------------------------------------------------------------------------------------------------------------------------------*/









/* -------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------- */
/*                                EFFECTS                                     */
/* -------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------- */
/* fade in */
.fade {
    -webkit-animation: fadein 3s; /* Safari, Chrome and Opera > 12.1 */
    -moz-animation: fadein 3s; /* Firefox < 16 */
    -ms-animation: fadein 3s; /* Internet Explorer */
    -o-animation: fadein 3s; /* Opera < 12.1 */
    animation: fadein 3s;
}

@keyframes fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* Firefox < 16 */
@-moz-keyframes fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* Internet Explorer */
@-ms-keyframes fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* Opera < 12.1 */
@-o-keyframes fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}


/* buttons hover */
.btn {
    position: relative;
}

    .btn:before {
        content: '';
        position: absolute;
        top: 0px;
        left: 0px;
        width: 0%;
        height: 100%;
        background: rgba(124,207,58,0.3);
        transition: all 0.3s ease;
        color: #fff !important;
    }

    .btn:hover:before {
        width: 100%;
    }

/* buttons hover */
.mess-btn.btn {
    position: relative;
}

    .mess-btn.btn:before {
        content: '';
        position: absolute;
        top: 0px;
        left: 0px;
        width: 0%;
        height: 100%;
        background: #fff;
        transition: all 0.3s ease;
        color: #fff !important;
        opacity: 0.3;
    }

    .mess-btn.btn:hover:before {
        width: 100%;
    }