html,body {margin:0; padding:0; border:0; text-align: center;} body { background-color:#ccc; font-family:Montserrat,Verdana,Arial,sans-serif; }
      .soft::-webkit-scrollbar { display: none; } .soft { -ms-overflow-style: none; scrollbar-width: none; }
      #header { background-color: #777; color: #eee; text-align: center; font-size: 2vh; line-height: 2vh; top:0; position: fixed; width:100%; z-index: 1000; border-bottom: 1px solid #ccc;} 
       #main {overflow:scroll} h1,h3 {font-weight: normal} h1 {letter-spacing:3px}
      .hidden {display:none !important; visibility:hidden !important}
      
      #footer {padding:1vh 0; border-top:1px solid #ccc; font-size:80%; bottom:0; position: fixed; width:100%; background-color:#777; z-index: 1000; color:#fff} 
	  .hide {opacity:0; transition: all 0.1s} .show {opacity:1; transition: all 1s ease-in-out;}
	  
	  .box {display:inline-block; margin: 5% 2%;}
	  .box img {/* width:23vh; */ border: 7px solid #fff; border-radius: 13px; max-width:98%}
	  .content {margin-top: 25vh;} 
	  .title {margin: 13px; font-weight: bold; letter-spacing: 3px;} .flag { background: crimson; color: #fff; padding: 3px 9px; border-radius: 12px; margin-right: 20px;}
	  
	  label {background-color: #777; color: #fff; border: 1px solid #777; padding: 7px 13px; border-radius: 7px; margin: 10px; line-height: 50px;cursor:pointer; white-space:nowrap !important}
	  label:hover, label:active, label:focus {background: #fff; color: #777;}
	  a {text-decoration:none} hr.section { max-width: 80%;} iframe {margin: 0 auto; border: 10px solid #fff; border-radius: 4px; box-shadow: 2px 2px 10px #808080 !important; max-width: 90vw;}
	  
	  table { width: 94%; max-width: 600px;}
	  @media only screen and (max-width: 600px) { body { cursor:pointer; font-size: 80% !important; } }	 
      @media only screen and (max-device-width: 800px) { body { cursor:pointer; font-size: 80% !important; } }