/**
 _  \_/ |\ | /¯¯\ \  / /\    |¯¯) |_¯ |¯¯) /¯¯\ |¯¯) |\ |6
 ¯  /¯\ | \| \__/  \/ /--\   |¯¯\ |__ |__) \__/ |¯¯\ | \|Core.
 * @author: Copyright (C) 2020 by Jorge Navarrete (Jekill) developer of xNova Reborn and ParallelGames Leader
 * @link: http://www.xnovarevolution.con.ar

 * @package xNova Reborn
 * @author Jekill <jonavarrete@nauta.cu>, <jn9508@gmail.com>

 * Please do not remove the credits
*/
html{
	height:100%;
}
*:focus {
    outline: 0;
}
body {
    background: url(../images/login/login_bg.jpg);
    background-size: cover;
    background-position: 50% 50%;
    background-attachment: fixed;
    height: inherit;
    padding: 0;
    margin: 0;
    font-family:Arial,Helvetica,sans-serif;
}
.login_page {
    display: flex;
    height: inherit;
}
.login_content, .register_content{
	margin: 7.5% auto;
    width: 325px;
    height: 328px;
    background-size: cover !important;
    z-index: 200;
}

.form_header {
    color: #8a8a8a;
    display: flex;
    font-weight: bold;
}
.login_content:before, .register_content:before {
    background: url(../images/login/header.png);
    content: "";
    width: 340px;
    height: 86px;
    position: absolute;
    background-size: 100%;
    z-index: -1;
    margin-top: -13px;
    margin-left: -8px;
}
.login_content:after, .register_content:after {
    background: url(../images/login/footer.png);
    content: "";
    width: 344px;
    height: 8px;
    position: absolute;
    background-size: cover;
    z-index: -1;
    margin-top: 0px;
    margin-left: -10px;
}
.login_form:before {
    background: url(../images/login/sides.png);
    content: "";
    width: 341px;
    height: 220px;
    position: absolute;
    background-size: 100%;
    z-index: -1;
    background-position: 0px;
    margin-left: -24px;
}
.register_form:before {
    background: url(../images/login/sides.png);
    content: "";
    width: 341px;
    height: 322px;
    position: absolute;
    background-size: 100%;
    z-index: -1;
    background-position: 0px;
    margin-left: -24px;
}
.item {
    margin: 0px auto;
    padding: 10px 47px;
    cursor: pointer;
    background: #16242f;
}
.item.active{
	color: #fff;
    background: #3b6284;
}
.login_form {
    padding: .5rem 1rem;
    background: linear-gradient(to bottom, #3c6385, #000000);
}
.register_form {
    padding: .5rem 1rem;
    background: linear-gradient(to bottom, #3c6385, #000000);
}
.form_group {
    width: 100%;
    margin-bottom: 1rem;
}
.form_inline {
    display: flex;
    margin-bottom: .2rem;
}
.form_inline .form_group{
	margin-right: 3px;
}

label{
	color: #fff;
}
.form_group label{
    display: block;
    font-size: 1.5em;
    color: #fff;
}
.form_group input, .form_group select {
    display: block;
    padding: 7px 4px;
    font-size: 1.2rem;
    min-width: -webkit-fill-available;
}

.btn {
    padding: 12px;
    border: 0px;
    background: transparent;
    color: #fff;
    border-radius: 3px;
    cursor:pointer;
}
.btn_blue {
    background: #263f54;
}
.btn_blue:hover {
    background: #406b93;
}
.btn_block {
    display: block;
    width: 100%;
}

div#error {
    position: absolute;
    margin-left: 325px;
    background: #ff000061;
    padding: 11px;
    color: #fff;
    border: 2px solid #ffa8a8;
    border-top: 2px solid #cf0012;
    margin-top: -12px;
    animation:error 3s linear;
    opacity: 0;
}

#error:before {
    content: '';
    background: url(../images/login/error.png);
    width: 172px;
    height: 39px;
    position: absolute;
    background-repeat: no-repeat;
    margin-left: -47px;
    margin-top: -14px;
}

[href="?page=rules"] {
    color: #66bee0;
    text-decoration: none;
}

@keyframes error{
	0%{opacity: 0;}
	20%{opacity: 100;}
	80%{opacity: 100;}
	100%{opacity: 0;}
}


.footer {
    background: linear-gradient(to top, black, transparent 92%);
    color: #fff;
    position: fixed;
    bottom: 0;
    width: 100%;
}
.footer_content {
    margin: auto;
    display: block;
    width: 800px;
    font-size: 10px;
    padding: 5px;
}
.rights{
    display: flex;
}
.center{
	font-size: 10px;
	display: flex;
}
.footer_content a {
    text-decoration: none;
    color:#fff;
}
ul#menu {
    list-style: none;
    display: flex;
    margin: 0;
}
#menu li {
    margin: 0px 9px;
    text-shadow: 0px 0px 7px #000;
}

.left {
    float: left;
}
.right {
    float: right;
}
.logo {
    display: block;
    margin: auto;
    width: 54px;
    margin-bottom: 12px;
}