@font-face {
    font-family: 'helveticaneue';
    src: url('assets/fonts/helveticaneueltstd-cn-webfont.b1e83771.woff') format('woff');
    font-weight: normal;
}
@font-face {
    font-family: "Helveticaneue CondensedLight";
    src: url("assets/fonts/helveticaneueltstd-ltcn-webfont.41a4e60d.woff") format("woff");
    font-weight: normal;
}

body {
    background: url("assets/alpine_sports_car.00198c99.jpg") no-repeat;
    background-size: cover;

    font-family: 'helveticaneue', sans-serif;
}
.title {
    color: white;
    text-align: center;
    font-family: "Helveticaneue CondensedLight", sans-serif;
}
.subtitle {
    color: white;
    text-align: center;
    font-weight: normal;
}
.wrapper {
    background-color: rgba(39,39,49,.70);
    
    margin-top: 10%;
    margin-left: 15%;
    margin-right: 15%;
    
    padding: 1%;

    border-radius: 3px;
}
.grid-wrapper {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 10px;
    grid-auto-rows: minmax(100px, auto);
}
.tile {
    background-color: #F7B206;
    opacity: 0.9;
    border-radius: 3px;

    display: flex;
    align-items: center;
    justify-content: center;

    text-decoration: none;
    color: black;
    font-size: 1.1rem;
    cursor: pointer;
}

.login-form {
    display: flex;
    justify-content: center;
}

.go-back-form {
    margin-top: 2rem;
}

.login-button {
    background-color: #F7B206;
    opacity: 0.9;
    box-shadow: none;
    border: none;
    border-radius: 3px;
    padding: 15px 100px 15px;
    font-size: 1.1rem;
    cursor: pointer;
}

.login-button:hover {
    padding: 12px 97px; /* same values minus 3px from border to avoid weird button behaviour */
}
.tile:hover, .login-button:hover {
    border: 3px solid rgba(255, 255, 255, .5);
    opacity: 1;
}

.ipn {
    color: white;
    text-align: right;
}