* {
  overflow-x:hidden;
  box-sizing:content-box;
}
body {
  font-size:3.2vw;
  color: white;
  background-color: #4477f2;
padding:0px;
  margin:0px;
  text-align:center;
word-break: break-all;
}
.section::-webkit-scrollbar {
  width: 5px;
}
.section::-webkit-scrollbar-track {
  background: #4477f2;
}
.section::-webkit-scrollbar-thumb {
  background: white;
}

body::-webkit-scrollbar {
  width: 1vw;
}
body::-webkit-scrollbar-track {
  background: white;
}
body::-webkit-scrollbar-thumb {
  background: #4477f2;
}

iframe, img {
    overflow-y:visible;
border-style: solid;
  border-width: 1vh 1vw;
 border-radius:50px;
width:50vw;
margin:auto;
text-align:center;
}
iframe {
height:50vh;}
img:hover {
  transform: scale(1.1);}
a {
  cursor:pointer;
  color:white;
}
button {
border-width:0px;
  border:none;
}
a:hover {
text-decoration:none;}
h2 {
  display:inline;text-align:center;
}
.readmore {
color: orange;
}
.readmore:hover {
color: orangered;
}
span.code {
color: orange;
}
.code span {
color: orange;
}
input, .code {
  border:none;
 font-size:1.85vw;
   word-break: break-all;
  color: #4477f2;
  font-family: "Lucida Console", Monaco, monospace;
  background-color: white;
  width:78vw;
  padding:5vw;
  border-radius:25px;
}
::placeholder {
color: orange;
}
.section {
word-break: break-word;
  margin:0px;
  position:relative;
  padding:5vh 5vw;
  overflow-x:hidden;
  text-align:center;  
  overflow-y:auto;
  height:88vh;
  width:88vw;
  border-style: solid;
  border-width: 1vh 1vw;
  border-color: white;
}
.top {
display:none;
    overflow-y:hidden;
  overflow-x:auto;
  background-color: #4477f2;
  position: fixed;
  z-index: 1;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
  border-bottom-style: solid;
  border-bottom-width: 2vh;
  border-color: white;
  margin: 0px;
  top: 0%;
  width: 100vw;
  left: 0%;
  font-size: 7vh;
  text-align:center;
}
.recaptcha {
  border-style: none;
  border-width: 0vh 0vw;
 border-radius:0px;
  text-align:center;
}
.top a {
  padding: 4vh;
  color: white;
  text-decoration: none;
}
.top a:hover {
  text-decoration: underline;
  text-decoration-color: white;
}
.top .button {
padding:3px;}
.top .go {padding:5px;}
.large {
  margin-top: 5%;
  font-family: Verdana, Geneva, sans-serif;
  font-size: 15vw;
}
.medium {
  display:inline;
  font-size: 7.5vw;
  font-family: "Trebuchet MS", Helvetica, sans-serif;
}
.small {
  color: white;
  text-align: justify !important;
  font-size: 3.2vw;
  font-family: Arial, Helvetica, sans-serif	;
}
.go:hover {
   box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19);
 background-color: orangered;
  text-decoration:underline;
}
.copyright {
display: block;
font-size:5vw;
}
.go {
   box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
 color:white;
  text-decoration:none;
   padding:5px;
 cursor:pointer;
    font-family: "Arial Black", Gadget, sans-serif;
  border-radius: 25px;
  font-size:1em;
  background-color: orange;
}
.button:hover {
  box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19);
  background-color:white;
  color:#4477f2;
  text-decoration:underline;
}
.button {
   box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
 text-decoration:none;
  padding:3px;
  border-style:solid;
  border-color:white;
  border-width:1px;
  cursor:pointer;
  color:white;
    font-family: "Arial Black", Gadget, sans-serif;
  border-radius: 25px;
  font-size:1em;
  background-color:#4477f2;
}
@media (orientation: portrait) {
  .section {
    height:48vh!important;
  }
  
iframe {
height:25vh;}
}