@font-face {

  font-family: Yanone Kaffeesatz; 

    src: url('../fonts/YanoneKaffeesatz-Regular.eot'); 

    src: local(Yanone Kaffeesatz), url('../fonts/YanoneKaffeesatz-Regular.ttf'); 

} 



html {

  height: 100%;

}



* {

  margin: 0;

  padding: 0;

}



/* tell the browser to render HTML 5 elements as block */

article, aside, figure, footer, header, hgroup, nav, section {

  display:block;

}



body {

  font: normal .85em arial, sans-serif;

  background: #F9F9F9;

  color: #555;
  
  height: 100%;

}

p {

  padding: 0 0 10px 0;

  line-height: 1.5em;

}



img {

  border: 0;
  vertical-align: middle;

}


h1 {
  margin: 0 auto;
  padding: 0;
  color: #333;
}


h1, h2, h3, h4, h5, h6 {

  color: #362C20;

  letter-spacing: 0em;

  padding: 0 0 5px 0;

}

h1, h2, h4 {

  text-shadow: 1px 1px #FFF;

  margin: 0 0 15px 0;

  padding: 15px 20px 5px 0;

  color: #555;

}

h1 {
  font: normal 180% arial, sans-serif;
}

h2 {

  font: normal 150% arial, sans-serif;

}



h4 {

  font: normal 150% "Yanone Kaffeesatz", arial, sans-serif;

  padding: 5px 20px 5px 0;

  margin: 0;

  color: #555;

}



h3 {

  color: #24355d;

  padding: 10px 0 10px 0;

  font: normal 150% arial;

}



h5 {

  color: #888;

  font: italic 95% arial;

  letter-spacing: normal;

  padding: 0 0 15px 0;

}



h6 {

  padding: 5px 0 25px 0;

}



a, a:hover {

  outline: none;

  text-decoration: underline;

  /*color: #A4AA04;*/
  
  /*color: #63B8D2;*/
  
  color: #025696;

}



a:hover {

  text-decoration: none;

}



blockquote {

  margin: 20px 0; 

  padding: 10px 20px 0 20px;

  border: 1px solid #E5E5DB;

  background: #FFF;

}



ul {

  margin: 2px 0 22px 17px;

}



ul li { 

  list-style-type: circle;

  margin: 0 0 6px 0; 

  padding: 0 0 4px 5px;

  line-height: 1.5em;

}

ol {

  margin: 8px 0 22px 20px;

}



ol li {

  margin: 0 0 11px 0;

}

table ol {
  margin: 8px 0 8px 20px;
}

table p {
  padding: 0 0 0 0;
}

p {

  text-align: justify;

}


.left {

  float: left;

  width: auto;

  margin-right: 10px;

}



.right {

  float: right; 

  width: auto;

  margin-left: 10px;

}



.center {

  display: block;

  text-align: center;

  margin: 20px auto;

}



#main {
	
  min-height: 100%;
  
}


#main, #logo_text, nav, #site_content, footer {

  margin-left: auto; 

  margin-right: auto;

}



header {

  background: #202020 url(../images/back.png) repeat-x;

  height: 250px;

}


#logo_text {
  width: 882px;
  position: relative;
  height: 203px;
  margin: 0 auto;
  padding: 0;
  color: #333;
  text-align: center;
  background: #f7f7f7 url(../images/banner.jpg) no-repeat;
}

#logo_text h1 {
  width: 800px;
  padding: 10px 0 0 0;
  margin: 0 auto;
  color: #333;
  text-decoration: none;
  font-family: Helvetica, Sans-Serif;
  font-weight: bold;
}

#logo_text h2 {
  background-color: rgba(204, 235, 240, 0.6);
  color: #333;
  padding: 0;
  text-decoration: none;
  font-family: Helvetica, Sans-Serif;
  font-weight: bold;
}

#logo_text h3 {
  background-color: rgba(0, 90, 187, 0.59);
  color: #eee;
  margin-top: 100px;
}

nav {

  width: 885px;

  height: 44px;

  padding: 0 0 0 4px;

} 



#site_content {

  width: 885px;
  
  overflow: hidden;

  margin: 20px auto 0 auto;

  padding: 0 0 20px 0;

} 



#sidebar_container {

  float: right;

  width: 254px;

}



.sidebar {

  width: 220px;

  background: #fff;

  -webkit-box-shadow: rgba(0, 0, 0, 0.2) 0px 2px 2px;

  -moz-box-shadow: rgba(0, 0, 0, 0.2) 0px 2px 2px;

  box-shadow: rgba(0, 0, 0, 0.2) 0px 2px 2px;

  border: 1px solid #eee;

  border-radius: 15px 15px 15px 15px;

  -moz-border-radius: 15px 15px 15px 15px;

  -webkit-border: 15px 15px 15px 15px;

  padding: 10px 15px 15px 15px;

  margin: 0 0 17px 0;

}



.sidebar ul {

  list-style: none; 

  width: 220px; 

  padding: 4px 0 0 0; 

  margin: 4px 0 4px 0;

}



.sidebar ul li {

  list-style-type: none;

  margin: 0 0 10px 0; 

  padding: 0 0 0 0;

  line-height: 1.5em;

}


.sidebar ul li a {

  text-decoration: none;	

}

.sidebar ul li a:hover {

  text-decoration: underline;	

}

.sidebar ul li a, .sidebar ul li a:hover {

  padding: 0 0 0 0;

} 



.sidebar ul li a.selected {

  color: #444;

} 



#content {

  text-align: justify;

  width: 600px;
  
  min-height: 450px;

  padding: 0 0 0 5px;

  float: left;

}

  

#content ul {

  margin: 2px 0 22px 0px;

}


#content ul li {

  list-style-type: none;

  background: url(../images/bullet.png) no-repeat;

  margin: 0 0 0 0; 

  padding: 0 0 4px 28px;

  line-height: 1.5em;

}



footer {

  width: 100%;

  height: 80px;

  font-family: 'trebuchet ms', sans-serif;

  font-size: 100%;

  padding: 25px 0 5px 0;

  text-align: center; 

  background: #333;

  color: #A8AA94;

}



footer p {

  line-height: 1.5em;
  
  text-align: center;

  padding: 0 0 10px 0;

}



footer a {

  color: #A8AA94;

  text-decoration: none;

}



footer a:hover {

  color: #FFF;

  text-decoration: none;

}



.form_settings {

  margin: 15px 0 0 0;

}



.form_settings p {

  padding: 0 0 4px 0;

}



.form_settings span {

  float: left; 

  width: 200px; 

  text-align: left;

}

  

.form_settings input, .form_settings textarea {

  padding: 5px; 

  width: 299px; 

  font: 100% arial; 

  border: 1px solid #E5E5DB; 

  background: #FFF; 

  color: #47433F;

  border-radius: 7px 7px 7px 7px;

  -moz-border-radius: 7px 7px 7px 7px;

  -webkit-border: 7px 7px 7px 7px;  

}

  

.form_settings .submit {

  font: 100% arial; 

  border: 0; 

  width: 99px; 

  margin: 0 0 0 212px; 

  height: 33px;

  padding: 2px 0 3px 0;

  cursor: pointer; 

  background: #3B3B3B; 

  color: #FFF;

  border-radius: 7px 7px 7px 7px;

  -moz-border-radius: 7px 7px 7px 7px;

  -webkit-border: 7px 7px 7px 7px;  

}



.form_settings textarea, .form_settings select {

  font: 100% arial; 

  width: 299px;

}



.form_settings select {

  width: 310px;

}



.form_settings .checkbox {

  margin: 4px 0; 

  padding: 0; 

  width: 14px;

  border: 0;

  background: none;

}



.separator {

  width: 100%;

  height: 0;

  border-top: 1px solid #D9D5CF;

  border-bottom: 1px solid #FFF;

  margin: 0 0 20px 0;

}

  

table {

  margin: 10px 0 30px 0;

}



table tr th, table tr td {

  /* background: #3B3B3B;

  color: #FFF; */
  
  line-height: 1.5em;

  padding: 7px 4px;

  text-align: left;

}

  
/*
table tr td {

  background: #E5E5DB;

  color: #47433F;

  border-top: 1px solid #FFF;

}
*/



/* scroll to top */

#scroll {

  position: relative; 

  width: 900px;

  margin: 10px auto;

  bottom: 15px; 

  right: 0;

  background: red;

  padding: 0;

}

  

#scroll a {

  float: right;

  margin: 0 0 0 0; 

  padding: 0 0 0 0;

}

  

#scroll a img {

  float: right;

  padding: 0 0 0 0;

  margin: 0;

}



/**

Stylesheet for SooperFish by www.SooperThemes.com

Author: Jurriaan Roelofs

**/



/* Configuration of menu width */

html body ul.sf-menu ul,html body ul.sf-menu ul li {

  width: 200px;

}



html body ul.sf-menu ul ul {

  margin: 0 0 0 200px;

}



/* Framework for proper showing/hiding/positioning */

ul.sf-menu,ul.sf-menu * {

  margin: 0;

  padding: 0;

}



ul.sf-menu {

  display: block;

  position: relative;

}

  

ul.sf-menu li {

  display: block;

  list-style: none;

  float: left;

  position: relative;

}

  

ul.sf-menu li:hover {

  visibility: inherit; /* fixes IE7 'sticky bug' */ 

}



ul.sf-menu a {

  display: block;

  position: relative;

}

  

ul.sf-menu ul {

  position: absolute;

  left: 0;

  width: 150px; 

  top: auto;

  left: -999999px;

}

  

ul.sf-menu ul a {

  zoom: 1; /* IE6/7 fix */ 

}



ul.sf-menu ul li {

  float: left; /* Must always be floated otherwise there will be a rogue 1px margin-bottom in IE6/7 */

  width: 150px;

}

  

ul.sf-menu ul ul {

  top: 0;

  margin: 0 0 0 150px;

}



ul.sf-menu li:hover ul,ul.sf-menu li:focus ul,ul.sf-menu li.sf-hover ul, 

ul.sf-menu ul li:hover ul,ul.sf-menu ul li:focus ul,ul.sf-menu ul li.sf-hover ul,

ul.sf-menu ul ul li:hover ul,ul.sf-menu ul ul li:focus ul,ul.sf-menu ul ul li.sf-hover ul,

ul.sf-menu ul ul ul li:hover ul,ul.sf-menu ul ul ul li:focus ul,ul.sf-menu ul ul ul li.sf-hover ul {

  left: auto;

}

  

ul.sf-menu li:hover ul ul,ul.sf-menu li:focus ul ul,ul.sf-menu li.sf-hover ul ul,

ul.sf-menu ul li:hover ul ul,ul.sf-menu ul li:focus ul ul,ul.sf-menu ul li.sf-hover ul ul,

ul.sf-menu ul ul li:hover ul ul,ul.sf-menu ul ul li:focus ul ul,ul.sf-menu ul ul li.sf-hover ul ul,

ul.sf-menu ul ul ul li:hover ul ul,ul.sf-menu ul ul ul li:focus ul ul,ul.sf-menu ul ul ul li.sf-hover ul ul {

  left: -999999px;

}



/* autoArrows CSS */

span.sf-arrow {

  width: 7px;

  height: 7px;

  position: absolute;

  top: 20px;

  right: 5px;

  display: block;

  background: url(../images/arrows-black.png) no-repeat 0 0;

  overflow: hidden; /* making sure IE6 doesn't overflow and expand the box */

  font-size: 1px;

}



ul ul span.sf-arrow {

  right: 10;

  top: 20px;

  background-position: 0 100%;

}



/* Theming the menu */

ul#nav {

  float: left;

}



ul#nav ul {

  background: #eee;

  margin-top: 0;

  border: 1px solid #ddd;

}



ul#nav li a {

  padding:9px 25px 10px 25px;

  font: 155% 'Yanone Kaffeesatz',helvetica,arial,verdana,sans;

  text-shadow: 1px 1px #FFF;

  text-decoration:none;

  color: #444;

}



ul#nav li a:hover, ul#nav li a:focus, ul#nav li.selected {

  background: #FFF;

}

  
/* Style for the program table, added by Haiyue Yuan 07/2022 */
.warm-grey {
  background-color: #ede9e1;
}
.blue-slate {
  background-color: #d1e3de;
  text-color: white;
}


.program-non-technical {
    color: #787775;
    text-shadow: 0.5px 0.5px 0.5px blue;
	font-size: 110%;
}

.program-technical {
    font-weight: bold;
}

.program-text-small {
    color: charcol;
	background-color:#faf5ed;
	font-size: 90%;
}

.program-time {
    color: charcol;
	font-size: 100%;
	text-align: center;
	font-weight: bold;
	
}

.program-time-small {
    color: charcol;
	background-color:#e9f5f2;
	font-size: 90%;
	text-align: center;
	width: 100px;
}


table tr td {
	/*background: #3B3B3B;*/
	/*color: #FFF;*/
	padding: 7px 4px;
	text-align: left;
	color: charcol;
	font-size: 100%;
}

table tr td .people {
	font-style: italic;
}
