@font-face {
    font-family:'Poppins';
    src:url('/fonts/Poppins-Light.ttf');
    font-weight:normal;
    font-style:normal;
    font-display:swap;
}

@font-face {
    font-family:'Poppins';
    src:url('/fonts/Poppins-Bold.ttf');
    font-weight:bold;
    font-style:normal;
    font-display:swap;
}

* {
    box-sizing:border-box;
    font-family:'Poppins', sans-serif;
}
.front-page {
    background-size:cover;
    background-position:center;
    min-height:100vh;
    padding:10px 10vw;
    display:flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background-image: url('/images/leapBG.svg');
    box-shadow: inset 0 0 0 100rem rgb(0 0 0 / 10%);
    position: relative;

    h1 {
        font-size: 46px;
        font-weight:800;
        color:#222;

    }

    h2 {
        font-size:20px;
        font-weight:500;
        color:#222;
        text-align: center;
    }
}

.front-header {
    position:fixed;
    width:100%;
    height:6rem;
    top:0;
    background-color: transparent
}

.front-header > .header-content {
    width:100%;
    height:100%;
    display:flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    padding:2rem 8rem;
}

.header-content > .logo {
    width:14rem;
    height:4rem;
}

.login-button {
        background-color: var(--TL-blue);
        color: #fff;
        padding: 0.5rem 3rem;
        border-radius: 0.2rem;
        font-size: 22px;
        font-weight:800;
        font-family: Poppins, sans-serif;
        cursor: pointer;
}