body {
    background: #ffffff url("/img/redpanda_logo_faint.png") no-repeat center;
    background-attachment: fixed;
    background-size: 20%;
    font-family: 'Roboto', sans-serif;
}

.navbar {
    overflow: hidden;
    top: 0;
    left: 0;
    position: absolute;
    height: 6%;
    width: 100%;
    background-color: #3c4b5e;
    font-family: Roboto;
}

.mainarea {
    overflow: hidden;
    margin-top: 100px;
    width: 100%;
    font-family: Roboto;
}
.navbar a {
    float: left;
    font-size: 3vmin;
    color: white;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
}

.rpgnavbar {
    float: right;
    font-size: 3vmin;
    color: white;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
}

.dropdown {
    float: left;
    overflow: hidden;
}

.dropdown .dropbtn {
    font-size: 3vmin;    
    border: none;
    outline: none;
    color: white;
    padding: 14px 16px;
    background-color: inherit;
    font-family: inherit;
    margin: 0;
    position: relative;
}

.navbar a:hover, .dropdown:hover .dropbtn {
    background-color: #4c5b6e;
}

.dropdown-content {
    display: none;
    position: fixed;
    top: 6%;
    background-color: #f9f9f9;
    min-width: 8%;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}

.dropdown-content a {
    float: none;
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    text-align: left;
}

.dropdown-content a:hover {
    background-color: #ddd;
}

.dropdown:hover .dropdown-content {
    display: block;
}

.centerdiv {
    margin: 0 auto;
    width: 80%;
    text-align: center;
}

.productdiv {
    height:10%;
    background-color:#f0f0f0;
    float:left;
    width: 40%;
    margin: 25px;
    border: 2px solid black;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.productdiv img {
   max-width: 100%;
   max-height: 100%;
   display: block;
}

.featurediv img {
   max-width: 90%;
   max-height: 90%;
   margin-left: auto;
   margin-right: auto;
   display: block;
   box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.page {
  display: none;
}
.page.visible {
  display: block;
}