body{
	background:#e6ffff; 
    background-size: 100%;
	border-color: #33cccc;
	color:#006699;
	font-family:"Times New Roman", Arial, Serif;
	line-height:1.4;
}
p{
	padding:2px;
}

@media screen and (min-width:300px){

header{
	box-sizing:border-box;
	height:5%;
	width:100%;
	right:0px;
	top:0px;
	left:0px;
	margin: 0 auto;
	border-bottom: solid #33cccc 5px;
}

@media screen and (min-width:900px){

header{
	box-sizing:border-box;
	height:14%;
	width:100%;
	right:0px;
	top:0px;
	left:0px;
	margin: 0 auto;
	border-bottom: solid #33cccc 5px;
	position:fixed;
	z-index: 999;
}
}
.header-sticky {
      background: #CCEEFF; 
      background-size: 100%;
      font-size:26px;
      text-align:center;
      font-variant:small-caps;
      opacity:1 !important;
  }
  
  


@media screen and (min-width:900px){


   .skip {
       position: absolute;
       left: -999em;
       width: 990em;
   }
}

  nav a{
	font-size:93%;
	/*padding:4px;*/
	border-radius:5%;
	line-height:25px;
	color:#FFFFFF;
	background-color:#CCEEFF;
	margin:0 auto;
}

  .link{
  	background: #CCEEFF;
      border-radius:5%;
  }

  .link ul {
  list-style: none;
  background-size: 100%;
  text-align: center;
  padding: 0px;
  margin: 2px 0px;
}

@media screen and (min-width:300px){

.link li {
	
    width: 100%;
    height: 2%;
    line-height: 2%;
    font-size: 80%;
    display: block;
  }
}

@media screen and (min-width:300px){

.link li {
	
    width: 100%;
    height: 2%;
    line-height: 2%;
    font-size: 80%;
    display: block;
  }
}


@media screen and (min-width:300px){
.link a{

	font-size:98%;
  text-decoration: none;
  background: #FFFFFF;
  color:#006699;
  display: block;
  padding-left: 5px;
  transition: .5s background-color;
}
}




@media screen and (min-width:900px){

.link li {
	
    width: 10%;
    height: 30px;
    line-height: 50px;
    font-size: 80%;
    display: inline-block;
    margin-right: -4px;
    margin-top:1.5%;
  }
}

@media screen and (min-width:900px){
.link a{

	font-size:98%;
  text-decoration: none;
  background: #FFFFFF;
  color:#006699;
  display: block;
  padding-left: 5px;
  transition: .5s background-color;
}
}

.link a:hover {
  background-color:#006699;
  color:#CCEEFF;
  list-style:none;

}
.link a:focus {
  background-color:#006699;
  color:#CCEEFF;
  list-style:none;
}


/* Sub Menus */
.link li li {
	list-style:none;
  font-size: .8em;
 /* padding-bottom:2px;*/
}

.link > ul > li {
	list-style:none;
   text-align: center;
   border-radius:5%;
}

.link > ul > li > a {
    padding-left: 0;
    list-style:none;
}

/* Sub Menus */
.link li ul {
    position: absolute;
    display: none;
    width: inherit;
    padding:2px;
    list-style:none;
}

.link li:hover ul {
   display: block;
   background-color:#CCEEFF;
   list-style:none;
   transition:.5s;
}

.link li ul li {
   display: block;
   clear:both;
   width:100%;
   border-radius:5%;
 }

 ul li:focus-within > ul{
 	display:block;
 	background-color:#CCEEFF;
   list-style:none;

 }

h1{
	font-size:30px;
	background:#FFCCFF;

}
h2{
	margin:0 auto;
	font-size:28px;
	font-variant:small-caps;
	text-align:center;

}
h3{ 
	padding:3px;
	margin:0 auto;
	font-size:20px;

}

h4{
	padding:0;
	font-size:18px;
	font-weight:bold;
}
.one h3{
	text-align:center;
	font-style:italic;
}

.main h3{
	text-align:center;
	font-style:italic;
}

.main h4{
	text-align:center;
	font-style:italic;
}
section{
	display:inline-block;
	background:#FFFFFF;
	margin:0.3%;
	border:solid;
	padding:3px;
	overflow:auto;

}


@media screen and (min-width:300px){
.one, .main, .year{
	display:block;
	width:95%;
	height:auto;
    margin-top:7%;
    border: 3px solid;
    border-color:#33cccc;
    border-radius:6%;

}
}
@media screen and (min-width:900px){
.one, .main, .year{
	float:left;
	width:77%;
	height:80%;
    margin-top:7%;
    border: 3px solid;
    border-color:#33cccc;
    border-radius:6%;

}
}
.year{
	text-align:center;
}
.one img{
	width:80%;
	height:auto;
	border:2px;
	border-style:double;
	border-color:#33cccc;
	margin: 4%;
	margin-top:0.3%;
	padding:0.5%;
	border-radius:3%;
}
@media screen and (min-width:300px){

.year img{
	width:85%;
	height:auto;
	border:2px;
	border-style:double;
	border-color:#33cccc;
	margin-left: 5%;
	margin-right:5%;
	margin-top:0.3%;
	padding:0.5%;
	border-radius:6%;
}
}
@media screen and (min-width:900px){

.year img{
	width:60%;
	height:auto;
	border:2px;
	border-style:double;
	border-color:#33cccc;
	margin-left: 18%;
	margin-right:18%;
	margin-top:0.3%;
	padding:0.5%;
	border-radius:6%;
}
}


.year h3{
	text-align:center;
	font-weight:bold;

}
.year h4{
	text-align:center;
	font-weight:italic;
}
.one p{
	text-align:center;
	font-size:17px;
	font-weight:bold;

}
 .one hr{
	width:70%;
	color:#006699;
}
 .three hr{
	width:70%;
	color:#006699;
}

.main img{
	width:80%;
	height:auto;
	border:2px;
	border-style:double;
	border-color:#33cccc;
	margin:1% 9.5%;
	padding:1px;
	border-radius:6%;
}
.main p{
	text-align:center;
	font-size:17px;
	font-style:normal;
}

.other{
	border: solid 3px #33cccc;

}

@media screen and (min-width:300px){
.left{
	display:block;
	width:98%;
	height:40%;

}
}


@media screen and (min-width:300px){
.right{
	display:block;
	width:98%;
	height:40%;
}
}
@media screen and (min-width:900px){
.left{
	display:inline-block;
	width:49%;
	height:40%;

}
}


@media screen and (min-width:900px){
.right{
	display:inline-block;
	width:49%;
	height:40%;
}
}

.right img{
	height:180px;
	width:auto;
	margin:0.5%;
}
.heh img{
	border:none;
}
table{
	color:#006699;
		background-color:#e6f7ff;
	font-family: Arial, Serif, "Times New Roman";
	font-size:110%;
	line-height:120%;
	font-weight:normal;
	width:98%;
	margin-top:0.5%;
	margin-bottom:2%;
	border:none;
	
}
table a{
	color:#006699;
	text-decoration:none;
}

table a:hover{
	font-weight:bold;
	color:#000089;
}
table a:focus{
	font-weight:bold;
}

th{
	padding:5px;
	color:#006699;
	font-weight:bold;
	background:#66CCFF;
	opacity:.9;/*
	background: -moz-linear-gradient(top, #cceeff 0%, #FFCCFF 100%);
	background: -webkit-linear-gradient(#cceeff 0%, #FFCCFF 100%);
	background: -o-linear-gradient(#cceeff 0%, #FFCCFF 100%);
	background: linear-gradient(#cceeff 0%, #FFCCFF 100%); */
	/*border: solid #66ccff;
	border-width: 0px 0px 3px 0px;
	border-bottom:3px;
	border-bottom-color: #006699;*/

}

th:first-child{
	-webkit-border-radius: 3;
	-moz-border-radius: 3;
	-o-border-radius: 3;
	border-radius: 5px;
	width:100%;
}/*
th:last-child{
	-webkit-border-radius: 3;
	-moz-border-radius: 3;
	-o-border-radius: 3;
	border-radius: 0px 5px 5px 0px;
	width:100%;
}*/

tr{
	opacity:.8;

}
tr:first-child{
	opacity:1;
	border:transparent;

}
tr:last-child{
	-webkit-border-radius: 3;
	-moz-border-radius: 3;
	-o-border-radius: 3;
	border-radius: 0px 5px 5px 0px;
}

tr:hover{
	opacity:1;
}

td{
	padding:5px;
	color:#006699;
	text-align:center;
	border: solid #33cccc;
	border-width: 2px;
	border-color:#66ccff;
	-webkit-border-radius: 3;
	-moz-border-radius: 3;
	-o-border-radius: 3;
	border-radius: 2px;

	
	
}
td:first-child{
	text-align:left;
	padding:5px;
	color:#006699;
	font-weight:bold;
	background:#66CCFF;
	opacity:1;
	width:25%;
}


@media screen and (min-width:300px){
.two{
	background-color:#cceeff;
	display:block;
	width:98%;
	height:auto;
	border:none;
	top:13%;
	border: solid #33cccc;
	border-right:5px;
	padding-top:2%;
	/*margin: 4px 4px 4px 4px;*/
	border-radius:0% 0% 0% 5%;

}
}

@media screen and (min-width:900px){
.two{
	background-color:#cceeff;
	width:20%;
	height:auto;
	border:none;
	top:13%;
	right:0%;
	left:79%;
	bottom:0px;
	overflow:auto;
	position:fixed;
	border: solid #33cccc;
	border-right:5px;
	padding-top:2%;
	/*margin: 4px 4px 4px 4px;*/
	border-radius:0% 0% 0% 5%;

}
}
.two summary{
	font-weight:bold;
	font-size:18px;
	font-variant:small-caps;
}
.two details{
	font-weight:normal;
	font-size:16px;
	font-variant:normal;

}
.two a{
	text-decoration:none;
}

.two a:hover, focus{
	font-weight:bold;
}

.spotlight{
	width:90%;
	height:40%;
	font-weight:bold;
	text-decoration:none;
	font-size:120%;
	text-align:center;
	font-variant:small-caps;

}
.spotlight img{
	width:100%;
	height:auto;
	margin:5%;
	border: solid;
	border-width:; 1%;
	border-color:#006699;
}

@media screen and (min-width:300px){
.three{
	color:#006699;
	display:block;
	clear:both;
	background:none;
	width:98%;
	height:40%;
	overflow:auto;
	border:solid;
	border-width: 0px 3px 0px 3px;

}
.three img{
        width:85%;
	height:auto;
	border:2px;
	border-style:double;
	border-color:#33cccc;
	margin: 0.3%;
	margin-top:0.3%;
	padding:0.5%;
	border-radius:3%;

	}

}

@media screen and (min-width:900px){
.three{
	color:#006699;
	display:inline-block;
	clear:both;
	background:none;
	width:77%;
	height:40%;
	overflow:auto;
	border:solid;
	border-width: 0px 3px 0px 3px;

}
.three img{
        width:auto;
	height:auto;
	border:2px;
	border-style:double;
	border-color:#33cccc;
	margin: 0.3%;
	margin-top:0.3%;
	padding:0.5%;
	border-radius:3%;

	}


}
.important{
	font-weight:bold;
	color:#003366;

}
/*
.details{
	display:inline-block;
	position:absolute;
	width:38%;
	line-height:140%;
	border:solid 1px #006699;
	background:#CCFFFF;
	
}
.details summary{
	font-weight:bold;
}*/

.column {
  float: left;
  padding: 1%;
  height: 33%; 
}


@media screen and (min-width:300px){

.left2, .right2 {
  width: auto;
  padding-top:1%;
  font-weight:bold;
  text-align:center;
}
}

@media screen and (min-width:900px){

.left2, .right2 {
  width: 22%;
  padding-top:1%;
  font-weight:bold;
  text-align:center;
}
}



@media screen and (min-width:300px){
.middle {
  width: auto;
  line-height:1.4;
  display:block;

}
}



@media screen and (min-width:900px){
.middle {
  width: 45%;
  line-height:1.4;

}
}



/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}
@media screen and (min-width:900px){

.row img{
        width:auto;
	height:200px;
	margin: auto;
	margin-top:0.3%;
	padding:0.5%;
	border-radius:3%;

	}
}



@media screen and (min-width:300px){
.other{
	clear:both;
	display:block;
	color:#CCFFFF;
	background-color:#006699;
	width:98%;
	text-align:center;
	height:auto;
	/*margin:0 auto;*/
	border-radius:8%;
	border:solid;
	border-width: 3px 0px 3px 0px;
}
}


@media screen and (min-width:900px){
.other{
	clear:both;
	display:inline-block;
	background-color:#CCEEFF;
	color:#006699;
	width:77%;
	height:auto;
	overflow: hidden;
	/*margin:0 auto;*/
	border-radius:8%;
	border:solid;
	border-width: 3px 0px 3px 0px;
}
}


@media screen and (min-width:300px){

.other nav{
	display:block;
	width:98%;
	margin:3px;
	text-align:center;
	clear:both;
	border:none;
	text-decoration:none;

}
}


@media screen and (min-width:300px){
	.other img{
		display:none;
	}
}

@media screen and (min-width:900px){
	.other img{
		display:all;
	}


@media screen and (min-width:900px){

.other nav{
	display:inline-block;
	width:98%;
	margin:3px;
	text-align:center;
	clear:both;
	border:none;
	text-decoration:none;

}
}/*
.other nav a{
	color:#FFFFFF;
}*/
.other h3{
	text-align:center;
}

.other img{
	display:inline-block;
	clear:both;
	/*width:13%;*/
	height:110px;
	width:auto;
	border:2px;
	border-style:double;
    margin: 0.9% 0%;
}

.other a{
	border:0;
}
/*
.other img:hover{
	width:15%;
	height:auto;
	transition: .2s ease-out !important;
	transition-delay: .2s !important;
     }*/

 .other img:focus{
 	width:110px;
 	height:auto;

 }
.container {
  position: relative;
  display: inline-block;
  width: 15%;
}
/*

.moc{
  position: relative;
  display: inline-block;
  width: 20%;
  height:270px;
 margin-left:0.5%;
 margin-right:0.5%;
}*/


.three img{
	border:2px;
	border-style:double;
}
/*
.image2 {
  display:inline-block;
  height:100%;
  width:auto;
	border:2px;
	margin:2px;
	border-style:double;
}
*/
@media screen and (min-width:900px){
	

.overlay {
  position: absolute;
  top: 60%;
  bottom: 0;
  left: 0;
  right: 0;
  height: 40%;
  width: 100%;
  opacity: 0;
  transition: .5s ease;
  background-color: #CCEEFF;
  border-radius:10%;
}
}

/*
.overlay2 {
  position: absolute;
  top: 70%;
  bottom: 0;
  left: 0;
  right: 0;
  height: 25%;
  margin-right:8%;
  margin-left:4%;
  margin-bottom: 0%;
  width: auto;
  opacity: 0;
  transition: .5s ease;
  background-color: #CCEEFF;
  border-radius:10%;
  border: solid 1px #006699;
}*/


.container:hover .overlay {
  opacity: 1;
}
/*

.moc:hover .overlay2 {
  opacity: 1;
}
*/

.text {
  color: #006699;
  font-size: 16px;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
}


footer{
	clear:both;
	display:block;
	border:none;
	/*background:rgba(102, 0, 102,.1);*/
	color:#006699;
	height:100px;
	width:77%;
	padding:2px;
	margin:3px;
	font-size:80%;
}