*{
margin:0;
padding:0;
font-family:Arial,Helvetica,sans-serif;
}

html,body{
width:100vw;
height:100vh;
background-color:#FFFFFF;}

body > #wrap{
height:auto;
min-height:100vh;
padding:0;
}

#navbar ul{
list-style-type:none;
margin:0;
padding:0;
font-size:4vmin;
overflow:hidden;
background-color: #444444;
padding-left:1vw;
}

#navbar li{
display:inline-block;
padding-top: 2vmin;
}

#navbar li a {
display:inline-block;
width:auto;
height:6vmin;
margin: 0 auto;
text-align:center;
text-decoration:none;
color: #FFFFFF;
padding: 0 1vh;
}

#navbar li:hover{
background-color:#4CAF50;
-o-transition:.25s;
-ms-transition:.25s;
-moz-transition:.25s;
-webkit-transition:.25s;
transition:.25s;
}

#left{
width:20vw;
float:left;
height:90vh;
/* background-color:#FF00FF; */
}

#mid{
width:60vw;
height:90vh;
display:inline-block;
text-align:center;
/* background-color:#005500; */
}

#right{
width:20vw;
height:90vh;
float:right;
/* background-color:#0055FF; */
}


.gameType {
margin-top:2vh;
margin-left:22vw;
width:16vw;
height:8vh;
padding:2vw;
display:block;
font-size:2vw;
background:#0033FF;
color:#000000;
border:2px solid #000099;
border-radius:15px;
text-decoration:none;
overflow:hidden;
}

.gameType:hover {
background:#0088FF;
color:#000000;
border:2px solid #0000FF;
-o-transition:.25s;
-ms-transition:.25s;
-moz-transition:.25s;
-webkit-transition:.25s;
transition:.25s;
}

#myCanvas {
margin-top:4vh;
border: 2px solid #000000;
background-color: #FAFAFA;
border-radius:0.5vmin;
}

.srcHolder {
padding-left: 1vw;
padding-right: 1vw;
}

#srcMini {
width: auto;
height:20vh;
display: inline-block;
border: 1px solid #000000;
}

.title {
padding-top:2vh;
font-size: 6vmin;
}

.subtitle {
padding-top:1vh;
font-size: 4vmin;
}

.desc {
font-size: 2vmin;
}

.agetext {
font-size:3vh;
display:inline-block;
}