.btn-cta-lg {
    height: 51.6px;
    min-width: 51.6px;
    border: 0px solid #02b757;
    background-color: #02b757;
    cursor: pointer;
    border-radius: 3px;
    color: #fff;
    font-size: 20px;
}
.btn-cta-md {
    height: 35.6px;
    min-width: 35.6px;
    border: 0px solid #02b757;
    background-color: #02b757;
    cursor: pointer;
    border-radius: 3px;
    color: #fff;
    font-size: 16px;
}
.btn-cta-sm {
    height: 31.6px;
    min-width: 31.6px;
    border: 0px solid #02b757;
    background-color: #02b757;
    cursor: pointer;
    border-radius: 3px;
    color: #fff;
    font-size: 16px;
}
.btn-cta-xs {
    height: 21.6px;
    min-width: 21.6px;
    border: 0px solid #02b757;
    background-color: #02b757;
    cursor: pointer;
    border-radius: 3px;
    color: #fff;
    font-size: 12px;
}
.btn-cta-lg:hover, .btn-cta-md:hover, .btn-cta-sm:hover, .btn-cta-xs:hover {
    transition: .2s;
    background-color: #3fc679;
    box-shadow: 0 1px 4px 0 rgba(25,25,25,0.3);
}
.btn-primary-lg {
    height: 51.6px;
    min-width: 51.6px;
    border: 0px solid #02b757;
    background-color: #02b757;
    cursor: pointer;
    border-radius: 3px;
    color: #fff;
    font-size: 20px;
}
.btn-primary-md {
    height: 35.6px;
    min-width: 35.6px;
    border: 0px solid #02b757;
    background-color: #02b757;
    cursor: pointer;
    border-radius: 3px;
    color: #fff;
    font-size: 16px;
}
.btn-primary-sm {
    height: 31.6px;
    min-width: 31.6px;
    border: 0px solid #02b757;
    background-color: #02b757;
    cursor: pointer;
    border-radius: 3px;
    color: #fff;
    font-size: 16px;
}
.btn-primary-xs {
    height: 21.6px;
    min-width: 21.6px;
    border: 0px solid #02b757;
    background-color: #02b757;
    cursor: pointer;
    border-radius: 3px;
    color: #fff;
    font-size: 12px;
}
.btn-primary-lg:hover, .btn-primary-md:hover, .btn-primary-sm:hover, .btn-primary-xs:hover {
    transition: .2s;
    background-color: #3fc679;
    box-shadow: 0 1px 4px 0 rgba(25,25,25,0.3);
}
.btn-secondary-lg {
    height: 51.6px;
    min-width: 51.6px;
    border: 0px solid #00a2ff;
    background-color: #00a2ff;
    cursor: pointer;
    border-radius: 3px;
    color: #fff;
    font-size: 20px;
}
.btn-secondary-md {
    height: 35.6px;
    min-width: 35.6px;
    border: 0px solid #00a2ff;
    background-color: #00a2ff;
    cursor: pointer;
    border-radius: 3px;
    color: #fff;
    font-size: 16px;
}
.btn-secondary-sm {
    height: 31.6px;
    min-width: 31.6px;
    border: 0px solid #00a2ff;
    background-color: #00a2ff;
    cursor: pointer;
    border-radius: 3px;
    color: #fff;
    font-size: 16px;
}
.btn-secondary-xs {
    height: 21.6px;
    min-width: 21.6px;
    border: 0px solid #00a2ff;
    background-color: #00a2ff;
    cursor: pointer;
    border-radius: 3px;
    color: #fff;
    font-size: 12px;
}
.btn-secondary-lg:hover, .btn-secondary-md:hover, .btn-secondary-sm:hover, .btn-secondary-xs:hover {
    transition: .2s;
    background-color: #32b5ff;
    box-shadow: 0 1px 4px 0 rgba(25,25,25,0.3);
}
[disabled] {
    opacity: .7;
    cursor: auto;
}
.box-shadow {
    box-shadow: 0 1px 4px 0 rgba(25,25,25,0.3);
}
.box-hover {
    box-shadow: 0 1px 4px 0 rgba(25,25,25,0.3);
    transition: .1s;
    cursor: pointer;
}
.box-hover:hover {
    box-shadow: 0 1px 10px 0 rgba(25,25,25,0.75);
}
.spinner {
    background: url(https://static-esrcdn.pages.dev/Images/loadingforabout.gif) no-repeat center;
    width: 100%;
    height: 100%;
    background-size: 80px;
}
.placeholder {
    width: 100%;
    height: 100%;
    background: url(https://static-esrcdn.pages.dev/Images/placeholder.png) no-repeat center;
    background-size: 100%;
}
/*Variables ^^*/
body {
    margin: 0px;
    margin-top: 40px;
}
.LobbyPage {
    margin: 8px;
    box-sizing: border-box;
    margin-top: 310px;
}
.LobbyTopNav {
    width: 100%;
    height: 300px;
    display: flex;
    align-items: center;
    left: 0px;
    top: 0px;
    background: url(https://static-esrcdn.pages.dev/Images/e942d5c326e104bddf1d2c8ce3e0e9a7.png) no-repeat;
    background-position-y: -750px;
    position: absolute;
}
.disflex {
    display: flex;
    flex-direction: column;
    margin-left: auto;
    margin-right: auto;
}
.Logoandslogancorp {
    background: url(https://static-esrcdn.pages.dev/Images/NameLogo.png) no-repeat center;
    background-size: 90%;
    width: 360px;
    height: 100px;
}
.LobbyTopNav span {
    font-weight: 700;
    font-size: 26px;
    display: block;
    color: #fff;
    text-align: center;
}
.btn-request {
    margin-top: 10px;
}
.AboutUs {
    min-height: 10px;
    height: fit-content;
}
.AboutUs h1 {
    text-align: center;
    width: 100%;
    margin: 0px;
    padding: 5px 0px;
}
.AboutUs ul {
    display: flex;
    width: 1090px;
    margin-left: auto;
    margin-right: auto;
}
.au-grid {
    margin-right: 10px;
    background-color: #fff;
    box-shadow: 0 1px 4px 0 rgba(25,25,25,0.3);
}
.InnerGrid {
    width: 260px;
    box-sizing: border-box;
    min-height: 100px;
    padding: 10px;
}
.InnerGrid h2, .InnerGrid span {
    margin: 0px;
    font-weight: 300;
    width: 100%;
    text-align: center;
}
.InnerGrid h2 {
    padding: 5px 0px;
}
.container {
    margin: 8px;
    display: flex;
}
.SkyScraperAd-Left {
    width: 160px;
    min-height: 618px;
    margin-right: 24px;
}
.SkyScraperAd-Right {
    width: 160px;
    height: 612px;
    margin-left: 24px;
}
@media (max-width: 1120px) {
    .SkyScraperAd-Left {
        display: none;
    }
    .SkyScraperAd-Right {
        display: none;
    }
}
.AdsSkyScraper {
    width: 160px;
    height: 612px;
    border: 0px;
}
.AlertBox {
    width: 100%;
    left: 0px;
    padding: 12px 0px;
    background-color: #f68802;
    color: #fff;
    font-weight: 400;
    text-align: center;
}
.container.homepage {
    width: 1350px;
    height: fit-content;
    margin-left: auto;
    margin-right: auto;
}
.homePageContainer {
    width: 1000px;
    height: fit-content;
    margin-left: auto;
    margin-right: auto;
}
.ProfileContainer {
    width: 100%;
    height: fit-content;
    display: flex;
    align-items: center;
}
.home-profile {
    height: 150px;
    width: 150px;
    border-radius: 100px;
    background-color: #fff;
}
.homePageContainer h1 {
    margin-top: 0px;
    margin-bottom: 0px;
    margin-right: 0px;
    margin-left: 20px;
    font-weight: 400;
}
.friendContainer {
    width: 100%;
    height: fit-content;
    margin-bottom: 10px;
}
.friendList {
    width: 100%;
    height: fit-content;
    box-sizing: border-box;
    height: 133px;
    background-color: #fff;
}
.friendContainer h2 {
    margin: 0px;
    padding: 10px 0px;
}
.homeGames {
    width: 100%;
}
.containerheader h2 {
    margin: 0px;
    font-weight: 300;
    padding-bottom: 5px;
}
.containerheader {
    width: 100%;
    margin-top: 3px;
    margin-bottom: 6px;
    display: flex;
    align-items: center;
}
.view-all-btn {
    padding: 3px 5px;
    color: #fff;
    background-color: #00a2ff;
    border-radius: 3px;
    height: fit-content;
    margin-left: auto;
}
.gameFlex {
    width: 100%;
    display: flex;
}
.gamecard {
    width: 150px;
    height: fit-content;
    margin-right: 8px;
    background-color: #fff;
    border-radius: 3px;
    overflow: hidden;
}
.gameImg {
    width: 150px;
    height: 150px;
    border-bottom: 1px solid #b8b8b8;
}
.gamecard span, .gamecard h3 {
    margin: 0px;
    padding: 5px 5px;
    font-weight: 300;
}
.gamecard span {
    padding: 0px 5px;
    color: #b8b8b8;
    font-size: 14px;
}
.gameImage {
    width: 100%;
    height: 100%;
    border: 0px;
}
.userImage {
    width: 100%;
    height: 100%;
    border-radius: 100px;
}