@function remy($value) {
    @return ($value / 16px) * 1rem;
}

body {
    overflow-x: hidden !important;
    overflow-y: hidden !important;
}

.main-wrapper {
    overflow: hidden;
    display: grid;
    grid-template-columns: 1fr 5fr;
    height: 100%;
}

.login-holder {
    width: 300px;
    background-color: var(--main-color);
    display: grid;
    align-items: center;
}

.login-holder>div {
    display: grid;
    grid-template-columns: 1fr;
    grid-gap: 1rem;
    align-items: center;
    padding: 0 1.5rem;
}

.login-holder label {
    color: var(--accent-color);
    font-weight: 600;
}

.login-holder input {
    border: none;
    border-radius: 5rem;
    width: 100%;
    padding: .5rem 0;
    text-indent: 1rem;
}

.form-group:last-child {
    margin-top: 1rem;
}

.signup__backgroung {
    font: 100% / 1.414 "Open Sans", "Roboto", arial, sans-serif;
    position: absolute;
    top: 50%;
    right: 0;
    left: 0;
    margin-right: auto;
    margin-left: 300px;
    transform: translateY(-50%);
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}

.signup__overlay {
    overflow: hidden;
    overflow-x: hidden !important;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(22, 0, 48, .94);
}

.container__child {
    width: 100%;
    height: 100%;
    color: #fff;
}

.signup__thumbnail {
    position: relative;
    padding: 2rem;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    background: url(https://d2v9y0dukr6mq2.cloudfront.net/video/thumbnail/cW5lDBG/abstract-technology-programming-code-background-of-software-developer-computer-scriptor-or-software-concept_smsctm8tx_thumbnail-full01.png);
    background-repeat: no-repeat;
    background-position: top center;
    background-size: cover;
}

.thumbnail__logo,
.thumbnail__content,
.thumbnail__links {
    z-index: 2;
}

.thumbnail__content {
    margin-left: -15%;
    width: 100%;
}

.thumbnail__logo {
    align-self: flex-start;
}

.logo__text {
    display: inline-block;
    font-size: 1.2rem;
    font-weight: 700;
    vertical-align: bottom;
}

.thumbnail__content {
    align-self: center;
}

h1,
h2 {
    font-weight: 300;
    color: rgba(255, 255, 255, 1);
}

.heading--primary {
    font-size: 2.9rem;
}

.heading--secondary {
    font-size: 1.6rem;
}

.logozeta {
    z-index: 2;
    width: 200px;
    height: 75px;
    float: right;
    position: fixed;
    bottom: 5px;
    right: 0;
}