body{
    color:#3E4349;
    font-family: 'Roboto', sans-serif;
    line-height: 200%;
    text-align: center;
    padding-top:200px;
    transition:padding-top .5s ease-out;
    -webkit-transition:padding-top .5s ease-out;
}
header{height:200px;
    position:fixed;
    top:0;
    width:100%;
    transition:all 0.5s ease-out;
    -webkit-transition:all 0.5s ease-out;
    overflow: hidden;
}
.clearfix:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
}
h1{
    font-family: 'Nova Square', cursive;
    color:#fff;
    font-size: 2rem;
    padding:5rem 2rem;
    line-height: 200%;
    transition:all 0.5s ease-out;
   -webkit-transition:all .5s ease-out;
}
h2{
    font-family: 'Roboto', sans-serif;
    color:#59595B;
    font-size:1.5rem;
    margin-bottom:.5rem;
    font-weight:400
}
h3{
    font-family: 'Roboto', sans-serif;
    color:#59595B;
    font-size:1.25rem;
    margin-bottom:.5rem;
    font-weight:400
}
.shrink-header{
    padding-top: 100px;
}
.shrink-header header{
    height: 41px;
    box-shadow: 0 2px 6px;
    -webkit-box-shadow:0 2px 6px rgba(0,0,0,.6);
}
.shrink-header h1{
   margin-top:200px;
}
#nav{
    /* Green cs201 #354005 */
    /* Orange malware #A54005 */
    /* Red angr #951005 */
    background:linear-gradient(90deg,#354005,#6A7F10, #354005);
    /* background:linear-gradient(90deg,#A54005,#CA7F10, #A54005); */
    /* background:linear-gradient(90deg,#951005,#EA2F10, #951005); */
}
#nav ul{
    /* Green cs201 #354005 */
    /* Orange malware #A54005 */
    /* Red angr #951005 */
    background:linear-gradient(90deg,#354005,#6A7F10, #354005);
    /* background:linear-gradient(90deg,#A54005,#CA7F10, #A54005); */
    /* background:linear-gradient(90deg,#951005,#EA2F10, #951005); */
    padding:5px 0 4px 0;
    bottom:0;
    position: absolute;
    width:100%;
}
#nav li{
    float:left;
    display: inline-block;
}
#nav a{
    font-size:1.2rem;
    padding:10px 40px;
    color:#fff;
    text-decoration: none;
}
#nav a:hover{
    background-color:#F0F0F0; /* ITS orig: #789e0f; */
    color:#2A3F10;              /* ITS orig: #224510; */
}
form{
    float:right;
    font-size: 1.2rem;
    margin-top:-2px;
}
input[type = submit]{
    padding:10px 40px 12px;
    border:none;
    font-size:1rem;
    color:#fff;
    /* ITS orig: #224510 */
    /* Green cs201 #354005 */
    /* Orange malware #A54005 */
    /* Red angr #951005 */
    background-color:#354005;
    /* background-color:#A54005; */
    /* background-color:#951005; */
    margin:-4px;
}
input[type = submit]:hover{
    background-color:#F0F0F0; /* ITS orig: #789e0f */
    color:#2A3F10; /* ITS orig: #224510 */
}
section{
    background-color:#fff;
    padding-top:3rem;
}
.login{
    float:none;
    width:50%;
    margin:0 auto;
}
.login input{
    width:300px;
    padding:5px;
    font-size:1rem;
}
.login input[type=submit]{
    margin-top:1rem;
    width:100px;
}
p>span{
    color:#789e0f;
    float:left;
    margin-left:3rem;
 }
span.highlight{
    background-color:#33cc33;
    margin-left:0rem;
    color:#224510;
}
#content>input{
    margin:5px 10px;
    font-family: 'Roboto', sans-serif;
}
#content>input[type = text]{
    width:300px;
    padding:5px 10px;
    display: block;
}
#content>input[type = submit]{
    width:300px;
}
footer {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
    text-align: center;
    color:#fff;
    /* ITS orig: #224510 #4d6311 #789e0f */
    /* Green cs201 #354005 */
    /* Orange malware #A54005 */
    /* Red angr #951005 */
    background:linear-gradient(135deg,#354005,#6A7F10, #354005);
    /* background:linear-gradient(135deg,#A54005,#CA7F10, #A54005); */
    /* background:linear-gradient(135deg,#951005,#EA2F10, #951005); */
}
.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}
.flashed-err {
    text-align: center;
    background-color: red;
    color: white;
    width: 80%;
    margin:0 auto;
}
.flashed-ok {
    text-align: center;
    background-color: green;
    color: white;
    width: 80%;
    margin:0 auto;
}
.admin {
    width:90%;
    text-align: center;
    float:none;
    width:100%;
}
.admin form {
   float:none;
   /* margin-top:1rem;*/
   margin:0 auto;
   /*  margin-left:5rem; width:80%;*/
}
@media only screen and (max-width : 700px){
    h1{
        font-size: 2rem;
        padding:3rem;
    }
    header{
        height:266px;
    }
    body{
        padding-top:266px;
    }
}
@media only screen and (max-width: 515px ){
    h1{
       font-size: 1.5rem;
       padding:1rem;

    }
    header{height:207px;}

    #nav a{
        font-size: 1rem;

    }
    #nav li{width:33.3%;}
    form{
        width:100%;
        margin-top:5px;
    }
    input{
        padding:0;
        margin:0;
        width:100%;
    }
    body{padding-top:207px;}
}
/* End shared CSS */
.user {
   width: 90%;
   margin:0 auto;
}
table.scoretable{
  border: solid black 1px;
  border-collapse: collapse;
  width: 100%;
}
.scoretable tbody{
  border: solid black 1px;
  border-collapse: collapse;
  width: 100%;
}
.scoretable tr{
  border: solid black 1px;
  border-collapse: collapse;
}
.scoretable th{
  border: solid black 1px;
  border-collapse: collapse;
}
.scoretable td{
  border: solid black 1px;
  border-collapse: collapse;
}
/* grids version;*/
.hideinfo{
    display: none;
    background-color: #1690ac;
    color: #fff;
    text-align: center;
    font-size: 15px;
    padding: 1px 0;
    border-radius: 3px;
    position:absolute;
    z-index:1;
}
td:hover .hideinfo{
     display: block;  
}
/*end */
.download {
   width: 80%;
   margin:0 auto;
}
.download form {
    float:none;
    /* margin-top:1rem;*/
    margin:0 auto;
  /*  margin-left:5rem; width:80%;*/
  }

.solve{
   width:90%;
   margin-left:1rem;
   text-align: center;
   float:none;
   width:100%;
}
.solve form{
    float:none;
/*    margin-top:1rem;
    margin-left:2rem;*/
    margin:0 auto;
    width:80%;
}
.solve select{
    width:250px;
    padding:5px;
    margin-right:0.5rem;
    margin-bottom:0.5rem;
    font-size: 1.25rem;
}
.solve input{
    width:300px;
    padding:5px;
    font-size: 1.2rem;
    margin-right:1rem;
}
.solve input[type = submit]{
    width:200px;
    font-size: 1rem;
}