section.home {
    background-image: linear-gradient(var(--customCrimson), var(--customPurple));
    height: calc(100vh - var(--upBarHeight));
}

.bannerImage {
    width: 100vw;
    height: calc(100vh - var(--upBarHeight));
    background-attachment: fixed;
    background-image: url(../assets/images/happy-jobseeker.png);
    background-size: 50%;
    background-position: top right;
    background-repeat: no-repeat;
}

.bannerLogo {
    width: 15vw;
    margin: calc(var(--upBarHeight) + 20px) 20px 0 var(--generalMarginLeft);
}

.bannerTitle,
.bannerSubtitle,
.bannerButton {
    margin-left: var(--generalMarginLeft);
}

.bannerTitle {
    color: white;
    width: 450px;
    font-weight: bold;
    font-size: 30px;
    margin-top: 20px;
    margin-bottom: 15px;
}

.bannerSubtitle {
    width: 400px;
    color: white;
    margin-bottom: 40px;
}

.bannerButton {
    font-size: 16px;
}

.bottomBar {
    align-items: center;
    display: flex;
    bottom: 0;
    background-color: var(--secondaryColor);
    width: 100vw;
    height: calc(var(--upBarHeight));
}

.bottomBar .bottomBarItem:first-child {
    margin-left: var(--generalMarginLeft);
}

.bottomBarItem {
    color: white;
    margin-right: 55px;
}

.bottomBarTitle {
    font-weight: bold;
}

.bottomBarSubtitle {
    font-weight: 500;
}