@import url(https://fonts.googleapis.com/css?family=Montserrat:100,200,300,regular,500,600,700,800,900,100italic,200italic,300italic,italic,500italic,600italic,700italic,800italic,900italic);

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: "Montserrat", sans-serif !important;
}

.container {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    height: 100vh;
    background-color: #f5f5f5;
    padding: 6vw 5vw;
    background-image: url("data:image/svg+xml,<svg id='patternId' width='100%' height='100%' xmlns='http://www.w3.org/2000/svg'><defs><pattern id='a' patternUnits='userSpaceOnUse' width='25' height='25' patternTransform='scale(3) rotate(0)'><rect x='0' y='0' width='100%' height='100%' fill='hsla(0, 0%, 0%, 1)'/><path d='M25 30a5 5 0 110-10 5 5 0 010 10zm0-25a5 5 0 110-10 5 5 0 010 10zM0 30a5 5 0 110-10 5 5 0 010 10zM0 5A5 5 0 110-5 5 5 0 010 5zm12.5 12.5a5 5 0 110-10 5 5 0 010 10z'  stroke-width='1' stroke='hsla(315, 98%, 52%, 0.14)' fill='none'/><path d='M0 15a2.5 2.5 0 110-5 2.5 2.5 0 010 5zm25 0a2.5 2.5 0 110-5 2.5 2.5 0 010 5zM12.5 2.5a2.5 2.5 0 110-5 2.5 2.5 0 010 5zm0 25a2.5 2.5 0 110-5 2.5 2.5 0 010 5z'  stroke-width='1' stroke='hsla(315, 98%, 52%, 0.14)' fill='none'/></pattern></defs><rect width='800%' height='800%' transform='translate(0,0)' fill='url(%23a)'/></svg>");
}

.container .left {
    background-color: rgba(18, 18, 18, 0.337254902);
    width: 50%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    border-right: 5px solid #000;
    border-radius: 15px 0px 0px 15px;
}

.container .left h2 {
    font-size: 2em;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.9333333333);
    margin-bottom: 5vh;
}

.container .left h2::after {
    content: " .";
    color: #fc0fc0;
    margin-top: 2em;
}

.container .left form {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 50%;
    width: 100%;
    height: 100%;
    display: flex;
}

.container .left form span {
    margin-top: 1em;
    display: flex;
    justify-content: space-between;
    width: 100%;
    justify-content: space-around;
}

.container .left form span #signup {
    color: #fc0fc0;
    font-size: 1em;
    font-weight: 600;
    text-decoration: none;
}

.container .left form span #signup:hover {
    color: #000;
    transition: all 0.3s ease-in-out;
}

.container .left form input {
    width: 25em;
    height: 3em;
    border: 2px solid #000;
    border-radius: 4px;
    padding: 0 1em;
    margin-bottom: 1em;
    background: #000000;
    color: #fc0fc0;
    font-size: 1em;
    font-weight: 500;
}

.container .left form input:focus {
    outline: none;
    font-weight: 600;
    border: 2px solid #fc0fc0;
    color: #fff;
    transition: all 0.3s ease-in-out;
}

.container .left form input::-moz-placeholder {
    color: #fff;
}

.container .left form input::placeholder {
    color: #fff;
}

.container .left form button {
    width: 25em;
    height: 3em;
    border: 2px solid rgba(4, 4, 4, 0.7803921569);
    background: #fc0fc0;
    color: #fff;
    font-weight: 600;
    font-size: 1em;
    cursor: pointer;
    border-radius: 3%;
    padding: 0 1em;
}

.container .left form button:hover {
    background-color: #000;
    color: #fff;
    border: 1px solid #1100ff;
    transition: all 0.3s ease-in-out;
}

.container .left form a {
    color: #fff;
    font-size: 1em;
    font-weight: 500;
    margin-top: 1em;
    text-decoration: none;
}

.container .left form a:hover {
    color: #fc0fc0;
    transition: all 0.3s ease-in-out;
}

.container .right {
    background-image: url("data:image/svg+xml,<svg id='patternId' width='100%' height='100%' xmlns='http://www.w3.org/2000/svg'><defs><pattern id='a' patternUnits='userSpaceOnUse' width='87' height='50.232' patternTransform='scale(2) rotate(0)'><rect x='0' y='0' width='100%' height='100%' fill='hsla(0, 0%, 0%, 0.44)'/><path d='M0 54.424l14.5-8.373c4.813 2.767 9.705 5.573 14.5 8.37l14.5-8.373V29.303M0 4.193v16.744l-14.5 8.373L0 37.68l14.5-8.374V12.562l29-16.746m43.5 58.6l-14.5-8.37v-33.49c-4.795-2.797-9.687-5.603-14.5-8.37m43.5 25.111L87 37.67c-4.795-2.797-24.187-13.973-29-16.74l-14.5 8.373-14.5-8.37v-33.489m72.5 8.365L87 4.183l-14.5-8.37M87 4.183v16.745L58 37.673v16.744m0-66.976V4.185L43.5 12.56c-4.795-2.797-24.187-13.973-29-16.74L0 4.192l-14.5-8.37m29 33.484c4.813 2.767 9.705 5.573 14.5 8.37V54.42'  stroke-linecap='square' stroke-width='1' stroke='hsla(315, 98%, 52%, 0.4)' fill='none'/></pattern></defs><rect width='800%' height='800%' transform='translate(0,0)' fill='url(%23a)'/></svg>");
    width: 50%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    border-radius: 0px 20px 20px 0px;
}

.container .right img {
    width: 40%;
    margin-bottom: 5vh;
}

.account-link:hover{
    color: #ffff !important;
}

@media only screen and (max-width: 1000px) {
    .container {
        max-width: 100% !important;
        padding: 0;
        margin: 0;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    .container .left {
        width: 90%;
        border-radius: 0;
        padding: 0;
        margin: 0;
    }

    .container .left form {
        display: flex;
        flex-direction: column;
        width: 100%;
        justify-content: center;
        align-items: center;
    }

    .container .left form span {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        width: 100%;
        margin-top: 1em;
    }

    .container .left form span #signup {
        margin-top: 1em;
        margin-bottom: 1em;
    }

    .container .left form input {
        min-width: 20em;
        width: 90% !important;
        height: 3em;
        border: 2px solid #000;
    }

    .container .left form button {
        min-width: 20em;
        width: 90% !important;
        height: 3em;
    }

    .container .right {
        display: none;
    }
}

/*# sourceMappingURL=styles.css.map */