body {
font-family: Arial, Helvetica, sans-serif;
background: linear-gradient(#ADD8E6, #FFA500);
}
div.page {
width:100%;
height:auto;
}




div.fronttext {
width: 100%;
height:auto;
}
div.fronttext p {
font-size: 40px;
text-align:center;
}
div.frontpic {
width: 100%;
height:auto;
}
div.frontpic img {
  display: block;
max-width:100%;
max-height:100%;
margin-left:auto;
margin-right:auto;
}
div.gday {
width: 45%;
height:auto;
float:left;
margin-left: 10%;
background:#FF3333;
font-size: 25px;
color:#FFFFFF;
}
div.clear {
clear:both;
}
div.navbox {
width:100%;
height:auto;
}
nav {
  background-color: #000000;
  border: 1px solid #dedede;
  border-radius: 12px;
  box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.055);
  color: #888;
font-weight:bold;
  display: block;
overflow: hidden;
  width: 75%;
height: auto;
margin-left:auto;
margin-right:auto;
text-align:center;
}
  nav ul {
margin: 0;
padding: 0;
  }
    nav ul li {
margin: 5px;
      display: inline-block;
padding-top: 7px;
padding-left: 15px;
      list-style-type: none;
      -webkit-transition: all 0.2s;
        -moz-transition: all 0.2s;
        -ms-transition: all 0.2s;
        -o-transition: all 0.2s;
        transition: all 0.2s; 
    }
nav > ul > li >a:hover {
background-color: #333333;
color: #FFFFFF;
        }
div.vidhead {
width:100%;
height:auto;
}
div.vidhead h1 {
text-align:center;
}
div.videobox {
margin-top: 5%;
margin-bottom: 15%;
width: 45%;
height:auto;
float:left;
color: #FFFFFF;
border: 5px solid #FFFF00;
border-radius: 160px 160px 0 0;
padding-top: 40px;
padding-left: 28px;
padding-right: 28px;
text-align:center;
}
div.jokes {
width:100%;
height:auto;
margin-left: 15%;
}
div.jokelist {
width: 85%;
height:auto;
margin-left: 3%;
}
div.jokes h1 {
text-align:center;
}
details {
  user-select: none;
}
details>summary span.icon {
  width: 24px;
  height: 24px;
  transition: all 0.3s;
  margin-left: auto;
}
details[open] summary span.icon {
  transform: rotate(180deg);
}
summary {
  display: flex;
  cursor: pointer;
}
summary::-webkit-details-marker {
  display: none;
}
div.quiz {
margin-top: 2%;
width: 45%;
height:auto;
margin-left:auto;
margin-right:auto;
}
div.quiz h1 {
text-align:center;
}
div.quiz p {
text-align:center;
font-size: 35px;
}
div.quizansw {
margin-top: 4%;
width:80%;
height:auto;
margin-left:auto;
margin-right:auto;
}
div.oops {
width: 75%;
height:auto;
margin-top: 5%;
margin-left:auto;
margin-right:auto;
}
div.oops p {
font-size: 35px;
text-align:center;
}
div.contact {
width: 65%;
height:auto;
margin-top: 1%;
margin-left:auto;
margin-right:auto;
}
div.box1 {
width:100%;
height: auto;
}
div.gday h1 {
text-align:center;
}
div.welcome {
width: 45%;
height: auto;
margin-left:auto;
margin-right:auto;
color: #FFFFFF;
font-size: 20px;
}
div.box5 {
width: 45%;
height: auto;
margin-left:auto;
margin-right:auto;
text-align:center;
}
div.box3 {
width: 45%;
height: auto;
margin-left:auto;
margin-right:auto;
}
table {
border:1;
cellpadding: 0;
cellspacing: 0;
margin-left:auto;
margin-right:auto;
color: #FFFFFF;
}
td {
text-align:center;
}
button {
color: #FFFFFF;
text-decoration: none;
background:none;
}
onclick {
text-decoration: none;
}
a.sm {
background: #000000;
color: #FFFFFF;
border:1px solid white;
}
a.sm:hover {
background-color: #333333;
color: #FFFFFF;
}
div.box {
width: 45%;
height: auto;
margin-left:auto;
margin-right:auto;
background:#FF3333;
color:#FFFFFF;
border:3px solid #FFFFFF;
text-align:center;
padding-top: 10px;
}
div.box h1 {
text-align:center;
}
div.house {
width: 100%;
height: auto;
}
video {
width:100%;
height:auto;
margin-top: 2%;
}
div.list {
width: 45%;
height: auto;
margin-left:auto;
margin-right:auto;
margin-top: 2%;
}
div.list ul {
float:left;
list-style-type:none;
        text-decoration: none;
}
div.list ul  li {
margin-top: 1em;
        text-decoration: none;
}
div.note {
width: 45%;
height: auto;
margin-left:auto;
margin-left:auto;
margin-top: 2%;
color: #FFFFFF;
padding-top: 5px;
padding-left: 5px;
padding-right: 5px;
padding-bottom: 5px;
background:#FF3333;
color:#FFFFFF;
border:3px solid #FFFFFF;
}
div.info {
margin-left:auto;
margin-right:auto;
width: 45%;
height:auto;
color: #FFFFFF;
}