.gentable {
    margin:auto;
    width:auto;
    text-align:center;
}


#gen {
    margin:auto;
    width:auto;
    text-align:center;
}

body{
    background-color:black;
}

#container{
    width:100%;
    text-align: center;
    font-family:Arial, Helvetica, sans-serif;
}

#containerl{
    width:100%;
    text-align: left;
    font-family:Arial, Helvetica, sans-serif;
}

.tc{
    color:hsla(0, 0%, 0%, 0.050)
}

.medtex{
    size:200%;
    position:inline-block;
}

.body60{
    width:60%;
    font-size: large;
}

a{
    text-decoration: none;
}

#allcen{
    margin:0;
    position:absolute;
    top: 50%;
    left: 50%;
    -ms-transform: translate(-50%);
    transform:translate(-50%);
}

#gate{
    margin-top: 0%;
    margin-bottom: 0%;
    font-size:400%;
    background-color:hsla(0, 0%, 0%, 0);
    border:none;
    outline:none;
    
    cursor:crosshair;
}

.btn{
    font-size:125%;
    background-color:hsla(0, 0%, 0%, 0);
    border:none;
    outline:none;
    cursor:crosshair;
}

.medtbtn{
    font-size:500%;
    border-style:solid;
    border-color:hsla(0, 0%, 0%, 0);
    cursor:crosshair;
    width:fit-content;
}

.medbbtn{
    font-size:300%;
    border-style:solid;
    border-color:hsla(0, 0%, 0%, 0);
    cursor:crosshair;
    width: fit-content;
}

#hbtn{
    background-color:hsla(0, 0%, 0%, 0);
    border:none;
    outline:none;
    cursor:crosshair;
    width:fit-content;
    display:inline-block;
    padding-left:5px;
    padding-right:5px;
}

.bbtn, td{
    border-style:solid;
    border-color:hsla(0, 0%, 0%, 0);
    width:fit-content;
}

.active, .btn:hover, #gate:hover, .medtbtn:hover, .medbbtn:hover{
    background-color:hsla(0, 0%, 100%, 0);
    opacity: 0.6;
}

.active, #elip:hover, #hbtn:hover, .bbtn:hover{
    background-color:hsla(0, 0%, 0%, 0.756);
}

body {
	background-color:hsl(0, 0%, 100%);
}

.ml{
    margin-left:5%;
}

.ml3{
    margin-left:3%;
}

.elip {
    font-size: 150%;
    color:black;
    padding:1%;
    position:fixed;
    display:flex;
    bottom:0;
    right:0;
    cursor:crosshair;
    border-style:solid;
    border-color:hsla(0, 0%, 0%, 0);
    width:fit-content;
}

.opts {
    display:none;
    text-align: center;
    padding-left:10%;
    padding-right:10%;
    padding-top: 2%;
    padding-bottom: 2%;
    border: 1px solid;
    background-color: white;
    color:black;
    position:absolute;
    top: 45%;
    left: 50%;
    -ms-transform: translate(-50%);
    transform:translate(-50%);
    z-index: 1;
}

.gameslist{
    display:none;
}

.applist{
    display:none;
}

.artlist{
    display:none;
}

.front{
    display:none;
}

td {
    cursor:crosshair;
}

.show {display:block;}

#title{
    font-size:2000%;
    color:hsla(0, 0%, 95%, 0.51);
    margin-top:.5%;
}

.tcon {
    display: inline-block;
    cursor:crosshair;
}

.tcon input{
    position:absolute;
    opacity:0;
    height:0;
    width:0;
}

.toggle{
    position:relative;
    top:0;
    left:0;
    height:10px;
    width:10px;
    background-color:rgba(0, 0, 0, 0);
    border:1px solid rgb(0, 0, 0);
    display: inline-block;
    vertical-align: -1px;
}

.tcon:hover input ~ .toggle {
    border-color:rgba(0, 0, 0, 0.258);
}

.tcon input:checked ~ .toggle {
    background-color:rgba(2, 2, 2, 0.853);
}

.tcon:hover input:checked ~ .toggle {
    background-color:rgba(0, 0, 0, 0.358);
}

.toggle:after{
    content:"";
    position:absolute;
    display:none;
}

.tcon input:checked ~ .toggle:after{
    display: block;
}

.centable{
    text-align: center;
    width:94%;
    margin-right:3%;
}

.itlink{
    text-decoration: underline;
}

.ninput{
    background-color:rgba(0, 0, 0, 0);
    border:1px solid rgba(255, 255, 255, 0);
    text-align: center;
    width:3vmax;
}

.inline{
    display:inline;
}

input[type="number"]::-webkit-outer-spin-button, input[type="number"]::-webkit-inner-spin-button{
    appearance: none;
    margin: 0;
}

@media screen and (max-aspect-ratio:1/1){
    .gnav{
        font-size:300%;
        margin-left:-157px
    }
    .snav{
        margin-left:-22px;
    }
    .sttext{
        font-size:600%
    }
    .elip{
        font-size:400%
    }
    .btn{
        font-size:400%
    }
    #gate{
        font-size:800%;
    }
    .opts{
        font-size:200%;
    }
    h1{
        font-size:500%;
    }
    p{
        font-size:300%;
    }
    input{
        font-size:400%;
    }
    label{
        font-size:400%;
    }
    .opts{
        font-size:2vmax;
    }
    .subt{
        font-size:2vmax;
    }
    body{
        font-size:0.5em;
    }
    .npcout{
        font-size:2vmax;
    }
}