/* LOGIN */
.logo-login {
    width: 200px;
}

.wrapper {
    background: #00416A;
    background: -webkit-linear-gradient(top left, #00416A 0%, #4E869F 100%);
    background: linear-gradient(to bottom right, #00416A 0%, #4E869F 100%);
    height: 100%;
}
.wrapper .x-form-text {
    background-color: rgba(255, 255, 255, 0.3);
    text-align: center;
    color: white;
}
.wrapper .x-form-text::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    color: #cfd8dc;
}
.wrapper .x-form-text:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color: #cfd8dc;
    opacity:  1;
}
.wrapper .x-form-text::-moz-placeholder { /* Mozilla Firefox 19+ */
    color: #cfd8dc;
    opacity:  1;
}
.wrapper .x-form-text:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: #cfd8dc;
}
.wrapper .x-form-text:hover:not(.x-form-invalid-field):not(:focus) {
    background-color: rgba(255, 255, 255, 0.4);
}
.wrapper .x-form-text:focus {
    background-color: white;
    color: #546E7A;
}

.wrapper .x-form-type-text textarea.x-form-invalid-field, 
.wrapper .x-form-type-text input.x-form-invalid-field, 
.wrapper .x-form-type-password textarea.x-form-invalid-field, 
.wrapper .x-form-type-password input.x-form-invalid-field, 
.wrapper .x-form-type-number textarea.x-form-invalid-field, 
.wrapper .x-form-type-number input.x-form-invalid-field, 
.wrapper .x-form-type-email textarea.x-form-invalid-field, 
.wrapper .x-form-type-email input.x-form-invalid-field, 
.wrapper .x-form-type-search textarea.x-form-invalid-field, 
.wrapper .x-form-type-search input.x-form-invalid-field, 
.wrapper .x-form-type-tel textarea.x-form-invalid-field, 
.wrapper .x-form-type-tel input.x-form-invalid-field {
    color: #546E7A;
}

/**
*	LINKS
**/

.wrapper .x-btn-link-toolbar-small .x-btn-inner {
    color: #fff;
}
.wrapper .x-btn-link-toolbar-small-over .x-btn-inner {
    color: #fff;
}

/* FIX HEIGHT ON FORM */
.wrapper .x-box-target{
    height: 100%;
}

/* SQUARE */
.wrapper ul li {
    position: absolute;
    list-style: none;
    display: block;
    width: 200px;
    height: 200px;
    border: 3px solid rgba(78, 134, 159, 0.70);
    border-radius: 40px;
    bottom: -200px;
    -webkit-animation: sq1 70s infinite;
    animation: sq1 70s infinite;
    -webkit-transition-timing-function: linear;
    transition-timing-function: linear;
}

/* SQUARE 1 */
.wrapper ul li:nth-child(1) {
    -webkit-animation: sq1 70s infinite;
    animation: sq1 70s infinite;
    -webkit-animation-delay: 9s;
    animation-delay: 9s;
    left: 5%;
}

/* SQUARE 2 */
.wrapper ul li:nth-child(2) {
    left: 35%;
    width: 120px;
    height: 120px;
    border-radius: 24px;
    bottom: -120px;
    -webkit-animation: sq2 40s infinite;
    animation: sq2 40s infinite;
}

/* SQUARE 3 */
.wrapper ul li:nth-child(3) {
    left: 75%;
    width: 400px;
    height: 400px;
    border-radius: 80px;
    bottom: -400px;
    -webkit-animation: sq3 130s infinite;
    animation: sq3 130s infinite;
    -webkit-animation-delay: 3s;
    animation-delay: 3s;
}

@-webkit-keyframes sq1 {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    100% {
        -webkit-transform: translateY(-100vh) translateY(-284px) rotate(-350deg);
        transform: translateY(-100vh) translateY(-284px) rotate(-350deg);
    }
}
@keyframes sq1 {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    100% {
        -webkit-transform: translateY(-100vh) translateY(-284px) rotate(-350deg);
        transform: translateY(-100vh) translateY(-284px) rotate(-350deg);
    }
}

@-webkit-keyframes sq2 {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    100% {
        -webkit-transform: translateY(-100vh) translateY(-170px) rotate(500deg);
        transform: translateY(-100vh) translateY(-170px) rotate(500deg);
    }
}
@keyframes sq2 {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    100% {
        -webkit-transform: translateY(-100vh) translateY(-170px) rotate(500deg);
        transform: translateY(-100vh) translateY(-170px) rotate(500deg);
    }
}

@-webkit-keyframes sq3 {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    100% {
        -webkit-transform: translateY(-100vh) translateY(-566px) rotate(-100deg);
        transform: translateY(-100vh) translateY(-566px) rotate(-100deg);
    }
}
@keyframes sq3 {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    100% {
        -webkit-transform: translateY(-100vh) translateY(-566px) rotate(-100deg);
        transform: translateY(-100vh) translateY(-566px) rotate(-100deg);
    }
}

/* REGISTER */

/* COMPLETENESS METER */
.completeness-meter {
    top: 8.5px !important;
    border-radius: 4px;
    border: 1px solid transparent;
    overflow: hidden;
}

.completeness-step {
    width: 15px;
    height: 100%;
    background: #eceff1;
    display:inline-block;
    margin:0;
}

.completeness-step.c-step-active {
    background: #94d500;
}