body { 
 background-color: #fefefe; color: #0a0a0a; font-family: "arial"; text-align: center;
 font-size: 13px;}

* {box-sizing: border-box;}
.q15 { background-color: #fefefe;  float:left;  width:15%; margin: auto;  text-align:center;}
.q05 { background-color: #fefefe;  float:left;  width:5%; margin: auto;  text-align:center;}
//.q15 { background-color: #fefefe;  float:left;  width:15%; margin: auto;  text-align:center;}
.q20 { background-color: #f4f4fd;  float:left;  width:20%; margin: auto;  text-align:center;}
.q25 { background-color: #f4f4fd;  float:left;  width:25%; margin: auto;  text-align:center;}
.q30 { background-color: #f4f4fd;  float:left;  width:30%; margin: auto;  text-align:center;}
.top { background-color: #f4f4fd;  float:left;  width:25%; margin: auto;  text-align:center;}
.q70 { background-color: #fefefe;  float:left;  width:70%; margin: auto;  text-align:center;}
.q100 { background-color: #fefefe;  float:left;  width:100%; margin: auto;  text-align:center;}
.q75i { background-color: #fefefe;  float:left;  width:74%; margin: auto;  text-align:center;}

@media only screen and (max-width:620px) {
  /* For mobile phones: */
  .q70, .q100, .q30 {width:100%;}
  .q75i {width:48%;}
  .q25 {width:48%;}
  .q20, .linker {width:33%;}
  .top, .q15 {width:1%; height: 0%; visibility: hidden;}
}
@media only screen and (max-width:480px) {
  /* For narrow mobile phones: */
  .q20 {width:49%;}
}

h1 {font-size: 70px; font-weight: normal; color: #0000a0;}
@media all and (min-width: 960px) {
h1{    font-size: 70px;  }
}
@media all and (max-width: 959px) and (min-width: 600px) {
h1{    font-size: 7vw;  }
}
@media all and (max-width: 599px) and (min-width: 50px) {
h1{    font-size: 7vw;  }
}

h2 {font-size: 28px; font-weight: normal; color: #0000a0;}
li {font-size: 15px; color: #222222; text-align: left; margin-left: 20px;}

p {font-size: 15px; text-align: left;}
.paracent {text-align: center; color: #0000a0; margin-left: 10px; margin-right: 10px}
.paraleft {font-size: 17px; color: #111111; text-align: left; margin-left: 10px; margin-right: 10px}
.pararight {font-size: 15px; color: #0000a0; text-align: right; margin-left: 10px; margin-right: 10px}
.bigger {font-size: 16px; text-align: center; margin-left: 10px; margin-right: 10px}
.heading {font-size: 28px; text-align: center; margin-left: 10px; margin-right: 10px}
.older {font-size:15px; background:#e9e9e9; color: #cccccc; text-align: center; margin:2px; padding:2px; min-height:40px; font-weight: bold;}
.small {font-size: 12px; color: #0000a0; text-align: left;}

a:link   {color: #0000dd; text-decoration: none;}
a:visited{color: #0000bb; text-decoration: none;}
a:hover  {color: #dd00dd;}
a:active {color: #0000a0;}

.newer {font-size:13px; width:185px; background:#ffffa8; color: #0000a0; text-align: center; margin:5px; padding:0px;}
  .on  {font-size: 13px; text-decoration: none; color: #dd00dd; }
  .off {font-size: 13px; text-decoration: none; color: #0000a0; }
  .new {font-size: 13px; text-decoration: none; color: #00bb00; }
