﻿#content {
    background-color: #2D366F;
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 100%;
    position: absolute;
    overflow-y: auto;
}

#pageContent {
    display: flex;
    flex-grow: 1;
}

#centerContent {
    max-width: 700px;
    max-height: 500px;
    margin: auto auto auto auto;
    padding-bottom: 24px;
}

#promoText {
    color: white;
    text-align: center;
    font-size: 14pt;
    margin-right: 12px;
    margin-left: 12px;
    font-weight: 500;
}

#headerContent {
    display: flex;
    justify-content: center;
}

#platformButtons {
    display: flex;
    justify-content: center;
}

#platformButtons a {
    max-width: 250px;
    height: 50px;
    margin-right: 5px;
    margin-left: 5px;
}

#platformButtons a img {
    height: 50px;
}

ms-store-badge::part(img) {
    max-height: 50px;
}

#googlePlayButtonImage {
    margin: -13px;
    height: 76px !important;
}

#titleContainer {
    display: inline-block;
    vertical-align: top;
    position: static;
    text-align: center;
}

#platformsImage {
    width: 100%;
    height: 100%;
}

#topBar {
    background: #1F264C;
    display: flex;
    flex-direction: row;
    white-space: nowrap;
    flex-grow: 0;
    flex-shrink: 0;
}

#topBarTitle {
    color: white;
    font-size: 35px;
    display: inline-flex;
    flex-grow: 1;
    vertical-align: central;
    margin: 12px 0 12px 24px;
}

#topBarButtonLogin {
    display: inline-flex;
    flex-grow: 0;
    width: auto;
    margin: 12px 24px 12px 0;
}

.horizontal-center-content {
    text-align: center;
}

.vertical-center-children {
    display: flex;
    align-items: center;
}

.center-helper,
.center-content {
    display: inline-block;
    vertical-align: middle;
    text-align: center;
}

@media screen and (max-width: 600px) {

    #platformButtons a {
        height: 40px;
    }

    #platformButtons a img {
        height: 40px;
    }

    #googlePlayButtonImage {
        margin: -10px;
        height: 60px !important;
    }

}



@media screen and (max-width: 475px) {

    #platformButtons {
        flex-direction: column;
        align-items: center;
    }

    #platformButtons a {
        margin-top: 5px;
        margin-bottom: 5px;
    }

}