.hidden {
    display: none !important;
    visibility: hidden !important;
}
.alert{
    margin-bottom: 2rem !important;
}
.show_password {
    margin-top: -47px;
    margin-left: 320px;
    cursor: pointer;
    background: #fff;
    position: absolute;
}

.signin-div {
    width: 90%;
    max-width: 360px;
    min-width: 280px;
    margin: 0 auto;
    padding: 30px 0;
    min-height: 400px;
}

.title {
    margin-bottom: 30px;
}
.title h1 {
    font-weight: normal;
    font-size: 44px;
    color: #f5a619;
}
.title p {
    color: #666;
    line-height: 1;
}

.title, form {
    display: block;
    width: 100%;
}

div.input {
    margin-bottom: 15px;
}
div.input label {
    white-space: nowrap;
    display: inline-block;
    max-width: 30%;
    overflow: hidden;
    text-overflow: ellipsis;
}
div.input label span {
    line-height: 50px;
}
div.input input {
    height: 50px;
    float: right;
    width: 70%;
    border: 1px solid #666;
}

div.others div.forgot-password {
    display: block;
    margin: 15px 0%;
    font-size: 15px;
}
div.others div.forgot-password a {
    text-decoration: underline;
    color: #f5a619;
}

div.input.activated label {
    display: block;
    height: 0;
    line-height: 60px;
    color: #666;
    overflow: visible;
}
div.input.activated label span {
    position: relative;
    bottom: 0;
    display: inline-block;
    margin: 0 5px;
    transition: all 1s;
    padding: 0 10px;
}
div.input.activated input {
    float: none;
    display: block;
    margin: 0;
    padding: 0 15px;
    width: 100%;
    height: 60px;
    outline: none;
    background: none;
    font-size: 16px;
    border: none;
}
div.input.activated input:-webkit-autofill {
    /*Tiny Hack*/
    box-shadow: inset 0 0 1000px 100px #fff;
}
div.input.activated.active label span, div.input.activated.passive label span {
    bottom: 30px;
    font-size: 15px;
    line-height: 10px;
    background-color: #fff;
    color: #f5a619;
}

.signin-div button {
    margin: 20px 5% 0 auto;
    display: block;
    width: 120px;
    height: 50px;
    border: 0;
    background-color: #eee;
    font-size: 16px;
    border-radius: 30px;
    padding: 5px;
}
.signin-div button span {
    background-color: #f5a619;
    color: #fff;
    display: block;
    height: 100%;
    line-height: 40px;
    border-radius: 20px;
}

/*Our Cool Borders*/
.activated .borders {
    height: 0;
    position: relative;
}
.activated .borders .top, .activated .borders .left, .activated .borders .right, .activated .borders .bottom {
    float: none;
    height: 0;
}
.activated .borders .top .content, .activated .borders .left .content, .activated .borders .right .content, .activated .borders .bottom .content {
    width: 100%;
    height: 1px;
    background-color: #ddd;
}
.activated .borders .top .content .bdr, .activated .borders .left .content .bdr, .activated .borders .right .content .bdr, .activated .borders .bottom .content .bdr {
    height: 100%;
    width: 0;
    background-color: #f5a619;
    transition: width 1s, height 1s;
}
.activated .borders .left, .activated .borders .right {
    width: 1px;
}
.activated .borders .left .content, .activated .borders .right .content {
    height: 60px;
    width: 1px;
}
.activated .borders .left .content .bdr, .activated .borders .right .content .bdr {
    height: 0;
    width: 100%;
    transition-delay: 1s;
}
.activated .borders .right {
    margin: 0 0 0 auto;
}
.activated .borders .left .content {
    display: flex;
}
.activated .borders .left .content .bdr {
    margin-top: auto;
}
.activated .borders .bottom {
    position: relative;
    top: 59px;
}
.activated .borders .bottom .content > .bdr {
    margin: 0 0 0 auto;
}

.active > .borders .top .content .bdr, .active > .borders .left .content .bdr, .active > .borders .right .content .bdr, .active > .borders .bottom .content .bdr, .passive > .borders .top .content .bdr, .passive > .borders .left .content .bdr, .passive > .borders .right .content .bdr, .passive > .borders .bottom .content .bdr {
    width: 100%;
    height: 100%;
}

.sign-up-bar {
    margin: 20px 0 0;
    text-align: center;
    line-height: 40px;
    border-radius: 50px;
}
.sign-up-bar a {
    display: block;
    color: #f5a619;
}
.sign-up-bar span {
    color: #777;
}
/*            @media screen and (min-height: 600px) {
                .sign-up-bar {
                    position: fixed;
                    bottom: 0;
                    left: 0;
                    width: 100%;
                    background-color: #fafafa;
                }
            }*/