.main-layout{background-color:var(--main-color-bg);color:var(--main-color-text);display:-ms-grid;-ms-grid-columns:[sidebar-start] 200px [sidebar-end content-v-start] 1fr [content-v-end];-ms-grid-rows:[header-start] 100px [header-end content-h-start] 1fr [content-h-end];grid-gap:30px;grid-template-rows:[header-start]100px[header-end content-h-start]1fr[content-h-end];grid-template-columns:[sidebar-start]200px[sidebar-end content-v-start]1fr[content-v-end];height:100vh;display:grid;overflow:hidden scroll}@media (width<=900px){.main-layout{height:100vh;display:block}}.header{-ms-grid-row:1;-ms-grid-row-span:1;grid-area:1/1/2/-1}.sidebar{-ms-grid-column:1;-ms-grid-column-span:1;-ms-grid-row:2;-ms-grid-row-span:1;flex-direction:column;grid-area:2/1/3/2;display:flex}::-webkit-scrollbar{width:10px}::-webkit-scrollbar-thumb{background:var(--secondary-color-text);border-radius:5px}::-webkit-scrollbar-thumb:hover{background:var(--tertiary-color-bg)}.main-content{-ms-grid-column:2;-ms-grid-column-span:1;-ms-grid-row:2;-ms-grid-row-span:1;grid-area:2/2/3/3;transition:all 3s;position:relative;overflow:hidden scroll}@media (width<=900px){.main-content{height:100%}}.main-content-show{animation:.5s ease-in appear}.main-content-hide{display:none}@keyframes appear{0%{opacity:0;width:calc(100% - 1rem);transform:translate(1rem)}to{opacity:1;width:100%;transform:translate(0)}}.center-text{width:100%;height:100%;position:absolute;top:0;left:0}:root{--main-color-bg:#273247;--secondary-color-bg:#273247;--tertiary-color-bg:#615d75;--main-color-text:#e1ddd1;--secondary-color-text:#6786b5;--tertiary-color-text:#98afd1;--color-primary:#797257;--color-primary-light:#b0a383;--color-grey-light-1:#faf9f9;--color-grey-light-2:#f4f2f2;--color-grey-light-3:#f0eeee;--color-grey-light-4:#ccc;--color-grey-dark-1:#333;--color-grey-dark-2:#777;--color-grey-dark-3:#999;--shadow-dark:0 2rem 6rem #0000004d;--shadow-light:0 2rem 6rem #0000000f;--line:1px solid var(--color-grey-light-2)}*{margin:0;padding:0}html{box-sizing:border-box;font-size:62.5%}@media (width<=900px){html{font-size:37.5%}}@media (width<=1200px){html{font-size:50%}}*,:before,:after{-webkit-box-sizing:inherit;box-sizing:inherit}body{color:var(--main-color-text);min-height:100vh;font-family:Courier New,Courier,monospace;font-size:2rem;font-weight:500;line-height:1.6}h2{color:var(--secondary-color-text);font-family:Courier New,Courier,monospace;font-size:6rem;font-weight:500;line-height:1.6;transition:all .3s}@media (width<=900px){h2{font-size:5rem}}h2:hover{cursor:pointer;background-color:#374153}h2::selection{color:none;background:0 0}h3{color:var(--secondary-color-text);font-family:Courier New,Courier,monospace;font-size:3rem;font-weight:500;line-height:1.6;transition:all .3s}h3::selection{color:none;background:0 0}h3:hover{cursor:pointer;background-color:#374153}ul{margin-left:0;padding-left:1.2em;list-style:none;position:relative}ul li:before{content:">";margin-left:4rem;position:absolute;left:0}li{margin-left:4rem}.button{cursor:pointer;align-items:center;width:100%;height:70px;display:flex;position:relative}@media (width<=900px){.button{height:40px}}.button:not(:first-child){margin-top:45px}@media (width<=900px){.button:not(:first-child){margin-top:15px}}.button__text{color:var(--main-color-text);z-index:10;margin-left:3rem;font-family:Courier New,Courier,monospace;font-size:2.5rem;font-weight:500}.button__current{background-color:var(--color-primary);z-index:4;width:100%;height:100%;position:absolute}.button:before{z-index:2;content:"";background-color:var(--color-primary);width:5px;height:100%;transition:transform .2s,width .7s cubic-bezier(1,0,0,.4) .2s;position:absolute;top:0;left:0;transform:scaleY(0)}.button:hover:before{width:100%;transform:scaleY(1)}.button:after{z-index:1;content:"";background-color:var(--color-primary-light);width:5px;height:100%;transition:transform .2s,width .4s cubic-bezier(1,0,0,1) .2s;position:absolute;top:0;left:0;transform:scaleY(0)}.button:hover:after{width:100%;transform:scaleY(1)}.welcome-text{padding:10% 5%;font-size:2.5rem}.home-text{position:relative}.game-description{vertical-align:top;max-width:calc(100% - 400px);display:inline-block;position:relative}@media (width<=1300px){.game-description{max-width:100%}}.game-link{color:var(--tertiary-color-text);font:inherit;font-size:inherit;cursor:pointer;background-color:#0000;border:none;border-bottom:1px solid;padding-bottom:-5px;text-decoration:none;transition:color .3s;display:inline-block}.game-link:hover{color:var(--secondary-color-text)}.game-image{max-height:250px;display:inline-block;position:absolute;top:0;right:-10px}@media (width<=1300px){.game-image{display:none}}.dropdown-small{position:relative}@media (width<=1300px){.dropdown-small{height:200px}}.dropdown-small-show{opacity:1;max-width:calc(100% - 1rem);height:min-content;transition:all .3s ease-in}.dropdown-small-hide{opacity:0;height:0;transition:all .3s ease-out}.dropdown-medium{position:relative}.dropdown-medium-show{opacity:1;max-width:calc(100% - 1rem);height:min-content;transition:all .3s ease-in}.dropdown-medium-hide{opacity:0;height:0;transition:all .3s ease-out}.dropdown-large{position:relative}.dropdown-large-show{opacity:1;max-width:calc(100% - 1rem);height:min-content;transition:all .3s ease-in}.dropdown-large-hide{opacity:0;height:0;transition:all .3s ease-out}.drop-arrow{vertical-align:center;font-family:Lato,sans-serif;font-weight:900;position:absolute;right:40px}.drop-arrow-right{animation:.3s ease-in right}.drop-arrow-down{animation:.3s ease-in down;transform:rotate(90deg)}@keyframes right{0%{transform:rotate(90deg)}to{transform:rotate(0)}}@keyframes down{0%{transform:rotate(0)}to{transform:rotate(90deg)}}.link-containers{justify-content:space-around;padding-top:3rem;display:flex}.site-image{width:120px;height:120px}@media (width<=900px){.site-image{width:90px;height:90px}}