/*  Responsive CSS - desktop first
----------------------------------------------- */


/*  Basic format
----------------------------------------------- */
html,body,div, p {
margin: 0px;
padding: 0px;
border: 0;
}
p {
padding-bottom: 0.5em;
padding-top: 0.5em;
}


body {
font-family: arial,helvetica,sans-serif;
font-size: 18px;
text-align:center;
height:auto;
width: auto;
background-color:silver;
}


#page {
max-width: 1000px;
width: 98%;
margin-left: auto;
margin-right: auto;
background-color:#ffffcc;
text-align: left;
height: auto;
border-collapse: collapse;
border-right: 5px solid gray;
border-bottom: 5px solid gray;

}

.ordtext {
padding: 1%;
background-color: whitesmoke;
border: 1px solid silver;
 border-radius: 5px;
 margin-top:10px;
 margin-bottom:10px;
 }
/*  Top Banner
----------------------------------------------- */
#banner {
background-color:#003399;
width:100%;
min-height: 100px;
border-bottom: 3px solid steelblue;
}
#banner .bannerimage{
  float:left;
  width: auto;
  height: auto;
 padding:0;
display:block;
  }


#banner  .bannertitle, .mobiletitle { 

 width: auto;
	 font-size: 140%; 
	 height:auto;
	font-weight: 900;
	 color:yellow;
	 text-align: left;
	 float:left;
	 margin-top:20px;
	 margin-right: 4%;
	 margin-left:4%;
	 margin-bottom: 10px;
	 padding:0;
	 }
#banner .bannertitle {display:block;}
#banner .mobiletitle {display: none;}	 
.subtitle {  
	 font-size: 16px; 
	 height:10;
	font-weight: 900;
	 color:yellow;
	 text-align: right;
	 float:left;
	 margin-top:0;
	 margin-right: 4%;
	 margin-left:4%;
	  padding:0;
	
	 
	  
	  display:block;
	 }
.gsc-control-searchbox-only {
border:0;
background-color:#003399;
padding: 10px;
padding-top: 0px;
padding-bottom: 0px;
padding-left: 0px;
width: 25%;
float:left;
}
#byline {
font-size: 11pt;
height:auto;
margin: 0;

padding: 0;
font-weight:600;
padding-right: 2%;
text-align:center;
width: 98%;
border-bottom: 2px solid gray;
 background: silver; 
 color:darkred;
}
/*  Left Navigation
----------------------------------------------- */




#topnav { background:#f0f0f0;
}
#topnav ul { 
 
 
float:left; 
 padding: 0px; 
 margin: 0px; 
 font-weight: bold; 
 text-align: center; 
 border-bottom: 1px solid black; }
#topnav ul li {list-style-type: none; }

#topnav ul li a { display: block; 
width:auto; 
text-align:left; 
font-size:16px; 
padding: 15px 15px 15px 15px; 
text-decoration: none; 
color:indigo;
font-weight: 600; 
background:#f0f0f0;
border: 1px solid silver;}

#topnav ul li a:hover { background-color: #ccc;color: #fff; }


.openlink, .closelink { 
width:auto;
display:none;
text-align: left; 
padding: 2%;
padding-left: 4%; 
color: #fff; 
background-color: #0084B4; 
text-decoration: none; 


 }
/* Show Menu */
#topnav ul{
    display: block;
	width:18%;
}
#toggle a.closelink{
    display: none;
}
/* Display Menu Items */
#topnav:target #menu-items{
    display: block;}
	/* Hide Open Toggle Link */
#topnav:target #toggle a.openlink{
    display: none;}
/* Show Close Toggle Link */
#topnav:target #toggle a.closelink{
    display: block;}


h1 {
	color: darkblue; 
	font-size: 25px; 
	font-weight: 800; 
	line-height: 14pt; 
	text-align: center;
	padding-top: 0px;
	padding-bottom: 10px;
}
h2 {
	color: darkblue; 
	font-size: 22px; 
	font-weight: 800; 
	text-align: center;
	margin:auto;
	padding-top: 0px;
}	

h3 {
color:indigo; 
font-family: arial,helvetica,sans-serif; 
font-size: 1.2em;
font-weight: 700; 
text-align: left;
padding:0;
margin:0;}

/*  h4 = subheading with bottom border as on links page
----------------------------------------------- */

h4
{font-size: 20px;
font-weight:bold;
color:darkblue;
text-align:left;
border-bottom: 1px solid darkblue;
padding-bottom: 5px;
margin-bottom:20px;
clear:both;
}
ul li, ol ul li {
 list-style: disc  }

.pictitle {
	font-size: 16px; 
	text-align: center; 
	font-weight: bold;
	font-style:italics;
}
.center {
text-align:center;
}
.clear {
clear:both;
}
/*  Main content
----------------------------------------------- */
#maincontent {
float:right;
font-family: arial,helvetica,sans-serif;

text-align:left;
width:78%;
height:auto;
padding: 20px;
padding-left:2%;
padding-right:2%;
background-color:#ffffcc;




}
li {
text-align:left;}


#pagelayout {
border-collapse: collapse;
width:100%;
}
#pagelayout td {
padding-bottom: 20px;
padding-left: 10px;
padding-right: 10px;
vertical-align: middle;
text-align:center;
width:50%;
}
#pagelayout td img{
margin:auto;
padding: 10px;
}


#address {
margin-left: 10%;
}

#linkslayout {
width:100%;
padding: 5px;
padding-bottom: 20px;
}
#linkslayout img {
display:block;
float:left;
padding-left: 1%;
padding-right: 1.5%;
padding-bottom: 20px;
border:0;
}
#linkslayout  ul{
margin-left: 20%;


}
#linkslayout a {
text-decoration:none;
}
#linkslayout ul li{
list-style-type: none; 
margin:0;
padding-left:0%;
padding-bottom: 1%;

}	
 
#linkslayout ul li a 
{
display:block;
width:78%;
font-size:18px;
padding:10px;
color:indigo;
text-decoration: none;
font-weight: 600;

}
#linkslayout ul li a:hover{
text-decoration: none;
background-color:silver;
color:indigo;}

p, li{
	  text-align: justify
}
td, th, div {
	text-align: left;
	
}

/* Links
----------------------------------------------- */  

.contentlinks {
margin-left: 20%;
float:left;}

.contentlinks li{
list-style-type: none; 
margin:0;
padding-left:0%;
padding-bottom: 1%;

}	
 
.contentlinks li a , .inlinelink a
{
display:block;
width:97%;

padding:10px;
color:black;
text-decoration: none;
font-weight: 600;

}
.inlinelink a {
display:inline-block;
width:auto;
color:indigo;
padding-left: 0px;
padding-right: 0px;
}
h3 .inlinelink a {
font-size:20px;}

.contentlinks li a:hover, .inlinelink a:hover {
text-decoration: none;
background-color:silver;
color:indigo;}




	
a {
	color: navy;
	text-decoration: none; 
	font-weight: 800;
}
a:hover {
		text-decoration:underline;
		color:#004080;}

 #syllabus {
		 width:97%;
		 height:auto;
		 background-color:white;
		 border: 1px solid indigo;
		
		 text-align:center;
		 margin:auto;
		 margin-bottom:20px;
		 margin-top: 20px;
}
#syllabus td, th {
		  font-size:12pt;
		 height: auto;
		 text-align:left;
		 vertical-align:middle;
		 margin: 0;
		 padding: 5px;
		 width: 80%;
		 vertical-align:top;
}
#syllabus td a {

padding:10px;
padding-top: 0px;
padding-left: 0px;
color:indigo;
text-decoration: none;
font-weight: 600;
display:inline-block;
width:auto;
}
#syllabus td a:hover {
text-decoration: underline;
background-color:silver;
color:red;}



#syllabus th {

color:indigo;
background-color:whitesmoke;
padding:0.5em;
font-size: 12pt;
height: 1.0em;
}
#syllabus th.col1, #syllabus td.col1 {
width:20%;
padding-left:3%;
}
#pagelayout td {
padding-left: 10px;
padding-right: 10px;
}
#contact {
width:80%;
margin:auto;
}
#contact td {
padding:5px;
padding-left:10px;
}
#contact a{
		 color: navy; 
	 	 font-weight: 400;
	 	 text-decoration:underline;}
#contact input{
		 background-color:white;
		 }
#contact #url {display:none;}		 
#newsblock {
border: 1px solid silver;
width:98%;
height:auto;
padding:1%;
background-color:whitesmoke;}

#newsblock ul {
margin-left: 0;
height:auto;}	

#newsblock ul li{
line-height: 25px;
margin-bottom: 10px;
}


#twocoltable {
width: 98%;
margin-left: auto; 
margin-right: auto;

background-color:whitesmoke;
padding:1%;
margin:1%;}
#twocoltable td {
width: 50%;
font-weight:normal;
font-size: 11pt;
padding-left: 2%;}

#mapframe {
width: 98%;
height:400px;
}

 /*  Footer
----------------------------------------------- */
#footer {
clear:both;
width: 98%;
font-size: 14px;
font-style: italic;
font-weight: 700;
color:darkblue;
background-color:silver;
border: 1px solid black;
height: 3.5em;
padding: 1%;
text-align: center;
}

img {
	max-width: 100%;
	height: auto;
	margin: 0;
	border:0;
}


@media screen and (max-width:500px){
#banner .bannerimage {display:none;}

#banner {min-height:70px;}
#linkslayout img {display:none;}
#linkslayout ul{margin-left:-5;}

#linkslayout ul li a 
{font-size:22px;}
h2 { font-size: 24px; }
h3 {font-size: 22px;}
h4 {font-size: 22px;}

}
@media screen and (max-width:850px){
	#page {width:auto;border:0;}
	#topnav ul { display: none; width:100%;}
	#topnav ul li a {width:auto;text-align:left; }
	.openlink,.closelink { display: block; }
	#maincontent {width:96%;}
	#maincontent {font-size: 22px;}
#banner .bannertitle {display:none;}
#banner .mobiletitle {display:block;}
#banner .subtitle {display:none;}
}