html{color:#000;background:#FFFFFF;height:100%}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym{border:0;font-variant:normal;}sup{vertical-align:text-top;}sub{vertical-align:text-bottom;}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;}input,textarea,select{*font-size:100%;}legend{color:#000;}del,ins{text-decoration:none;}body{font:13px/1.231 arial,helvetica,clean,sans-serif;*font-size:small;*font:x-small;}select,input,button,textarea{font:99% arial,helvetica,clean,sans-serif;}table{font-size:inherit;font:100%;}td{vertical-align:top;}pre,code,kbd,samp,tt{font-family:monospace;*font-size:100%;line-height:100%;}body{text-align:center;}#ft{clear:both;}
.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
    }
.clearfix {display: inline-block;}  /* for IE/Mac */

 <!--[if IE]>
<style type="text/css">
  .clearfix {
    zoom: 1;     /* triggers hasLayout */
    display: block;     /* resets display for IE/Win */
    }  /* Only IE can see inside the conditional comment
    and read this CSS rule. Don't ever use a normal HTML
    comment inside the CC or it will close prematurely. */
</style>
<![endif]-->

html body {	height:100%;
}

body {
  margin: 0;
  padding: 0;
  width:100%;
  font-size: 11px;
  font-family: 'Lato', sans-serif;
  font-weight: normal;
  letter-spacing: 1px;
  line-height: 22px;
  color: #333333;
  background: #FFFFFF;
}
a:link { 
  color: #000;
}
a:visited {
  color: #000;
}
a:hover {
  color: #EC7C00;
}
a:active { 
  color: #EC7C00;
}

h1 {
	color: #EC7C00;
	font-size: 11px;
	font-weight: 600;
	display: inline;
}
h3 {
	color: #EC7C00;
	font-size: 11px;
	font-weight: 600;
	text-transform: none;
	font-style: italic;
}

p { margin-bottom: 2em; 
}

img {
	padding: 0;
	margin: 0;
	border-width: 0;
	border-style: none;
}

.line1 {
  border-bottom: 1px solid #DB9E6B;
  height: 1px;
  margin: 0px;
}
.line2 {
  border-bottom: 1px dashed #DB9E6B;
  height: 1px;
  margin-bottom: 25px;
}

.no_underline {
  text-decoration: none;
}
.overflow_hidden {
  overflow: hidden;
}
.float_clear {
  clear: both;
}
.quote {
  font-style: italic;
}
.red {
  color: #990000;
  text-transform: uppercase;
}
.orange {
  color: #EC7C00;
}

hr { 
  border: 0; height: 0; border-top: 1px solid rgba(0, 0, 0, 0.1); border-bottom: 1px solid rgba(255, 255, 255, 0.3); 
}


  
/* Layout Skeleton */
.container {
  
  width: 947px;
  
  margin: 0 auto;
  
  padding: 0;
  
  text-align: left;
  vertical-align: text-top;
  height: 100%;
  position: relative;
} 
.border_top {
  
  height: 40px;
  
  width: 947px;
  
  padding: 0px;
  
  margin: 0px;
  
  background: url(images/header_border.png) repeat-y center top;
}

.border_topmid {
  
  height: 35px;
  
  width: 947px;
  
  padding: 0px;
  
  margin: 0px;
  
  background: url(images/header_border.png) repeat-y center top;
}

.logoarea  { 
  height: 106px;
  
  width: 947px;
  
  padding: 0px;
  
  margin: 0px;
  
  text-align:center;
  background: url(images/header_border.png) repeat-y center top;
}  

.centerimage {
  
  text-align: center;
}
.border_topnav {
  
  height: 1px;
  
  width: 945px;
  
  padding: 0px;
  
  margin: 0px;
}
.border_nav {
  
  height: 49px;
  
  width: 947px;
  
  padding: 0px;
  
  margin: 0px;
  
  background: url(images/header_border.png) repeat-y center top;
}
.border_content {
  
  width: 947px; 
  padding: 0px;
 
  margin: 0px;
 
  background: url(images/header_border.png) repeat-y center top;
}

.footer {
  
  width: 100%;
  
  padding-top: 10px;
  
  padding-bottom: 10px;
  
  text-align: left;
  
  vertical-align: middle;
  
  background: #FFEB8C;
  
  position: relative;
}

.footer h2 {
	
  color: #000;
	
  font-size: 9px;
	
  line-height: 25px;
	
  font-weight: normal;
	
  text-transform: none;
}

.footer h2 a {
	
  color: #666666;
	
  text-decoration: none;
}
.footer h2 a:hover,.h2 a .current:visited,.h2 a .current:hover {
	color:#E0A14F;
}

.footer table {
  
  border: 0;
  
  margin: 0;
  
  vertical-align: middle;
  
  top: 4px;
  
  position:absolute;
  
  right: 50px;
}
.footspace {
  
  padding-left: 140px;
}
.footersub {
  
  width: 100%;
  
  padding-top: 10px;
  
  padding-bottom: 5px;
  
  text-align: center;
  
  vertical-align: middle;
  
  background: #ffebb2;
  
  position: relative;
}

.footersub h2 {
	
  color: #000;
	
  font-size: 9px;
	
  line-height: 25px;
	
  font-weight: normal;
	
  text-transform: none;
}

.footersub h2 a {
	
  color: #666666;
	
  text-decoration: none;
}
.footersub h2 a:hover,.h2 a .current:visited,.h2 a .current:hover {
	color:#E0A14F;
}

.footersub table {
  
  border: 0;
  
  margin: 0;
  
  vertical-align: middle; 
  top: 4px;
  
  position:absolute;
  
  right: 70px;
}
.footspacesub {
  
  padding-left: 140px;
}
  
/* Home Page */
.banner {
  
  width: 945px;
  
  height: 292px;
  
  text-align: left;
 
   padding-left: 1px;
}
#bannerbox {
  
  width: 601px;
  
  height: 292px;
 
  background: #FFCC66;
  
  padding-left:1px;
}
#bannerstripe {
  
  width: 19px;
  
  height: 292px;
  
  background: #FFEB8C;
}

.bannercopy {
  
  width: 580px;
  
  padding-top: 20px;
 
  padding-left: 15px;
  
  font: 12px  Lato, sans-serif; 
  font-weight: 500; 
  line-height:20px;
}
.indexcontentcopy {
  
  width: 910px;
  
  text-align: left;
  
  padding-top: 10px;
  
  font: 12px  Lato, sans-serif; 
  font-weight: 500; 
  line-height:20px;
}

.visionheadbox {
  
  height: 66px;
  
  text-align: left;
  
  position:relative;
}
.visionfont{
  
  vertical-align:bottom;
  
  bottom:0;
  
  position:absolute;
  
  left:0;
  
  padding-left: 15px;
  
  font: 22px Courgette, cursive; 
  line-height:20px; 
  color:#992333;
  
  text-align: left;
}
.vision {
  
  width: 945px;
 
  height: 621px;
  
  text-align: left;
  
  padding-left: 1px;
}
#visionbox {
  
  width: 726px;
  
  height: 621px;
  
  background: #FFF;
}
.visioncopy {
  
  padding-top: 10px;
  
  padding-left: 15px;
  
  padding-right: 10px;
  
  font: 12px  Lato, sans-serif; 
  font-weight: 500; 
  line-height:20px;
}
.border_topvision {
  
  height: 1px;
  
  width: 945px;
  
  padding: 0px;
  
  margin: 0px;
}
.refugeheadbox {
  
  height: 47px;
  
  text-align: left;
  
  position:relative;
}
.refugefont{
  
  vertical-align:bottom;
  
  bottom:0;
  
  position:absolute;
  
  left:214px;
  
  padding-left: 10px;
  
  font: 18px Courgette, cursive; 
  line-height:20px; color:#992333;
  
  text-align: left;
}
.refuge {
  
  width: 945px;
  
  height: 653px;
  
  text-align: left;
  
  padding-left: 1px;
}
#refugebox {
  
  width: 746px;
  
  height: 653px;
  
  background: #FFF;
}

.refugecopy {
  
  padding-top: 10px;
  
  padding-left: 24px;
  
  padding-right: 10px;
  
  font: 12px  Lato, sans-serif; 
  font-weight: 500; 
  line-height:20px;
}

  .refugecopy a {
  
  font: 10px  Lato, sans-serif; 
  font-weight: 500; 
  line-height:20px;
  
  color:#992333;
}
.endspacer {
  
  height: 57px;	
}
.threefont{
  
  color:#992333;
}


#term {
  color: #000;
	
  font-size: 12px;
	
  line-height: 20px;
	
  font-weight: normal;
  text-align: left;
  margin: 10px;
  padding: 10px;
}
#term ul {
style="list-style-type:circle;"
}
/* Content General Layout */
.contentbanner {
  
  width: 945px;
  
  height: 232px;
  
  text-align: left;
 
  padding-left :1px;
}
.content_col_left {
  
  width: 380px;
  
  float: left;
  
  padding-top: 20px;
  
  padding-left: 101px;
}
.contentlabel {  
  height: 66px;  
  text-align: left;  
  position:relative;}
.contentlabelfont{  
  vertical-align:bottom;  
  bottom:0;
  position:absolute; 
  left:0;
  padding-left: 15px;
  font: 18px Courgette, cursive; 
  line-height:20px; 
  color:#992333;  
  text-align: left;}
.contentlabelcenter {
  
  height: 66px;
  
  text-align: center;
  
  position:relative;
}
.contentlabelcenterfont{
  
  font: 14px Courgette, cursive; 
  line-height:20px; 
  color:#992333;
}
.contentdate{
  
  padding-top: 5px;
  
  padding-bottom: 25px;
  
  text-align: center;
}

.contentdatefont{
  
  font: 26px Courgette, cursive; 
  line-height:20px; 
  color:#992333;
}

.contentann{
  
  padding-top: 5px;
  
  padding-bottom: 25px;
  
  text-align: center;
}

.contentannfont{
  
  font: 18px Courgette, cursive; 
  line-height:20px; color:#992333;
}
.contentcopy {
  
  width: 910px;
  
  text-align: left;
  
  padding-top: 10px;
 
  padding-left: 15px;
  
  font: 12px  Lato, sans-serif; 
  font-weight: 500; 
  line-height:20px;
}

.contentimg1 {
  
  text-align: center;
  
  padding: 10px 10px 0 10px;
}	
.contentimg1 img {
  
  padding: 1px;
  
  margin-left:3px;
  
  margin-right:3px;
  
  border: 1px solid #999;
}

.content_col_right {
  
  width: 170px;	
  
  float: right;
  
  margin-right: 35px;
  
  margin-top: 30px;
 
  text-align: right;
}
.content_col_full {
  
  width: 75%;
  
  float: left;
  
  padding-top: 20px;
  
  padding-left: 101px;
  
  padding-right: 30px;
}

.logoender {
	
  width:100%;

  text-align: center;
	
  padding-bottom: 20px;
	
  padding-top: 10px;
}	
.imageender {
  
  width:100%;
  
  text-align: center;
  
  padding-top: 20px;
  
  padding-bottom: 50px;
}
.bottomspacer {
  
  height: 75px;
 
  width: 1px;
}
.spacer {
  
  height: 75px;
  
  width: 1px;
}
.smspacer {
  
  height: 10px;
  
  width: 1px;
}


  
/* Hermitage Pages */


.itemlist {
  
  text-align: left;
  
  padding-left: 20px;
}
.itemlist ul li{
  
  list-style: circle;
}

.itemlist ol li{
  
  list-style: upper-roman;
}
.listemp { 
 
  font-style: italic;
  
  font-weight: 600;
}
.address {
  
  text-align: center;
 
  padding-left: 20px;
  
  padding-top: 10px;
  
  font-weight: 800;
  
  line-height: 24px;
}

.retreatcost {
  
  font: 12px  Lato, sans-serif; 
  font-weight: 500; 
  line-height:20px;
  
  font-style: italic;}

table#chanda td {
  padding-right: 25px;}
table#chanda td img {  
  padding: 1px;  
  margin-top:5px; 
  border: 1px solid #999;}
.stafflabel {  
  padding-bottom: 3px;
  font: 16px Courgette, cursive; 
  line-height:20px; 
  color:#6a1d8c;}
  
/* Retreat Schedule Pages */
.retreatindent {
  
  margin-left: 100px;

  }

.retreatheading {
  
  font: 16px  Lato, sans-serif; 
  font-weight: 500; 
  line-height:25px; 
  color:#992333;
}
.retreatlabel {
  
  font: 12px  Lato, sans-serif; 
  font-weight: 500; 
  line-height:25px; 
  color:#000;
}

.retreatcopy {
  
  width: 700px;
  
  text-align: left;
  
  padding-left: 0px;

  padding-top: 10px;
  
  padding-bottom: 50px;
  
  font: 12px  Lato, sans-serif; 
  font-weight: 500; 
  line-height:20px;
}

.teachers {
  
  font: 12px  Lato, sans-serif; 
  font-weight: 500; 
  line-height:20px; 
  color:#333;
}

.specialevent {
  
  font: 14px  Lato, sans-serif; 
  font-weight: 500; 
  line-height:25px; 
  color:#992333;
  
  margin-bottom: 20px;
}

/* International Pages */

.quoteindent {
  
  width: 550px;
  
  margin-left:150px;
}
.indent2 {
  
  margin-left:63px;
}

.indent3 {
  
  margin-left:185px;
}


.ktretreat {
  color:#000;
  width: 700px;
  
  text-align: left;
  font: 12px  Lato, sans-serif; 
  font-weight: 500; 
  line-height:20px;
}


/* Ecodharma Pages */

.quoteindentital {
  
  width: 700px;
  
  margin-left:100px;
  
  font-style: italic;
}

.signhere {
  
  text-align: center;	
}

.climatepiece {
  
  width: 700px;
  
  margin-left:100px;
  
  font-style: italic;
}



/* Resources Pages */
.talkslist {
  
  text-align: left;
  
  padding-left: 20px;
}
.talkslist ul li{
  
  list-style: circle;
}

.talkslist ol li{
  
  list-style: upper-roman;
}
.talklistheader{
  
  font: 14px  Lato, sans-serif; 
  font-weight: 500; 
  line-height:25px; 
  color:#992333;
}

.subtitle {
  font: 12px  Lato, sans-serif; 
  font-weight: 500; 
  line-height:22px; 
  color:#992333; 
  font-style: italic;
}
.trivideo {
  text-align: center;
  margin: 0 auto;
  }
.tritable th {
  background-color: grey;
  color: white;
  padding:8px 12px 8px 12px;
  text-align: center;}
.tritable td {
  padding: 3px;
  border-bottom: 1px solid #99CC99;
  border-right: 1px solid #99CC99;}
.tritable {
  text-align: left;
  width: 640px;
  margin: 0 auto;
  font: 14px  Lato, sans-serif; 
  font-weight: 500; 
  line-height: 22px;
  border-collapse: separate; 
  border-spacing: 28px 5px;
  padding: 5px;} 
.tritalic {
  font: 12px  Lato, sans-serif;
  font-style: italic;
  padding-right: 15px;}
.tritalichd {
  font: 12px  Lato, sans-serif;
  font-style: italic;
  color:#FDFFEB;
  padding-right: 10px;}
.tritime {
 float:right;
 padding-right: 25px;
 color: #335C33;}
.triem {
 font-style: italic;
 font-weight: bold;
 padding-bottom: 15px;}
.tricat {
 letter-spacing: 2px;
 font-weight: bold;
 padding-bottom: 15px;}
.trisubhd {
 letter-spacing: 2px;
 color: red;
 font-weight: bold;
 font-size: 16px;}
.triblock2 {
 font-style: italic;
 width: 750px;
 margin: 0 auto;}

  
/* Training Pages */
.onlinetestimonial {
  
  font: 12px  Lato, sans-serif; 
  font-weight: 500; 
  line-height:22px; 
  color:#992333; 
  font-style: italic;
}

.modules {
  
  vertical-align: top;
  
  text-align: left;
  width: 800px;
}

.modules td {
  
  vertical-align:top;
 
  padding-right: 25px;
}

.onlinenav {
  
  width: 175px;
 
  float: left;
  
  text-align: left;
  
  padding-top: 10px;
 
  padding-left: 3px;
  
  font: 12px  Lato, sans-serif; 
  font-weight: 500; 
  line-height:20px;
}

.onlinecontentcopy {
  
  float: right;
  
  width: 750px;
  
  margin-top: 25px;
  
  padding-right: 15px;
  
  text-align: left;
 
  font: 12px  Lato, sans-serif; 
  font-weight: 500;
  line-height:20px;
}

.onlineannou {
  
  text-align: center;
  
  font: 14px  Lato, sans-serif; 
  font-weight: 500; 
  line-height:22px; 
  color:#B05200; 
  font-style: bold;
}

.smsnorm {
  
  text-align: center;
  
  font: 14px  Lato, sans-serif; 
  font-weight: 500; 
  line-height:22px; 
  color:#992333; 
  font-style: bold;
  
  padding-bottom: 10px;
}


.smsonlineannou {
  
  padding: 10px;
  
  text-align: center;
  
  font: 14px  Lato, sans-serif; 
  font-weight: 500; 
  line-height:22px; 
  color:#B05200; 
  font-style: bold;
  
  width: 800px;
  
  border-style: dashed;
  
  border-color: #999;
  
  border-width: 1px;
  
  padding-top: 12px;
 
  padding-bottom: 15px;
}
.smsonlineannou a:link {
  
  color: #FF4719;
}


.smsonlineannou a:hover {
  
  color: #333333;
}

.smscenter {
 
  text-align: center;
  
  padding-left: 60px;
}

.smsquote {
  
  font-style:italic;
  
  padding-left:10px;
}

.smsniquote {
  
  padding-left:10px;}

.trainingquestion {
  
  margin-left:8px;
}

.donatecenter {
  
  text-align: center;
}

.numlist {
  
  text-align: left;
  
  padding-left: 20px;
}
.numlist ul li{
  
  list-style: decimal;
}

.numlist ol li{
  
  list-style: upper-roman;
}

.imgcent {
  
  padding-left: 12px;
}

.imgcent2 {
  
  position:relative;
  
  left:125px;
}

.imgcent3 {
  
  position:relative;
  
  left:97px;
}

.imgcenter1 {
  
  position:relative;
  
  left:268px;
}

.imgcenter2 {
  
  position:relative;
  
  left:215px;
}

.donatecenter {
  
  text-align:center;
}



/* Gallery Pages */
.gallerylist {  
  text-align: left;  
  padding-left: 20px;}
.gallerylist img {
  border: 1px solid #999;
  padding: 5px;
  margin-right: 10px;}
.gallerylist ul li{  
  list-style: circle;}
.gallerylist ol li{  
  list-style: upper-roman;}
.gallerylistheader{  
  font: 14px  Lato, sans-serif; 
  font-weight: 500; 
  line-height:25px; 
  color:#992333;}

/* Contact Page */


.contlabel {
 
  color: #EC7C00;
 
  font-weight: 500;
}

.hilite {
  
  color: #EC7C00;
  
  font-weight: 500;
  
  display: inline;
}

.contact_col_right {
  
  width: 170px;	
  
  float: right;
  
  margin-right: 60px;
  
  margin-top: 60px;
  
  text-align: right;
}

.mapimage {
  
  float: left;
}

.maptable {
 
  width: 500px;
 
  margin-left: 325px;
}


.divider {
	
  vertical-align: top;
}



/* Lightbox */
/* Preload images */
body:after {
  content: url(images/close.png) url(images/loading.gif) url(images/prev.png) url(images/next.png);
  display: none;
}
body.lb-disable-scrolling {
  overflow: hidden;
}
.lightboxOverlay {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 9999;
  background-color: black;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
  opacity: 0.8;
  display: none;
}
.lightbox {
  position: absolute;
  left: 0;
  width: 100%;
  z-index: 10000;
  text-align: center;
  line-height: 0;
  font-weight: normal;
}
.lightbox .lb-image {
  display: block;
  height: auto;
  max-width: inherit;
  border-radius: 3px;
}
.lightbox a img {
  border: none;
}
.lb-outerContainer {
  position: relative;
  background-color: white;
  *zoom: 1;
  width: 250px;
  height: 250px;
  margin: 0 auto;
  border-radius: 4px;
}
.lb-outerContainer:after {
  content: "";
  display: table;
  clear: both;
}
.lb-container {
  padding: 4px;
}
.lb-loader {
  position: absolute;
  top: 43%;
  left: 0;
  height: 25%;
  width: 100%;
  text-align: center;
  line-height: 0;
}
.lb-cancel {
  display: block;
  width: 32px;
  height: 32px;
  margin: 0 auto;
  background: url(../images/loading.gif) no-repeat;
}
.lb-nav {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 10;
}
.lb-container > .nav {
  left: 0;
}
.lb-nav a {
  outline: none;
  background-image: url('data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==');
}
.lb-prev, .lb-next {
  height: 100%;
  cursor: pointer;
  display: block;
}
.lb-nav a.lb-prev {
  width: 34%;
  left: 0;
  float: left;
  background: url(images/prev.png) left 48% no-repeat;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  -webkit-transition: opacity 0.6s;
  -moz-transition: opacity 0.6s;
  -o-transition: opacity 0.6s;
  transition: opacity 0.6s;
}
.lb-nav a.lb-prev:hover {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
}
.lb-nav a.lb-next {
  width: 64%;
  right: 0;
  float: right;
  background: url(images/next.png) right 48% no-repeat;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  -webkit-transition: opacity 0.6s;
  -moz-transition: opacity 0.6s;
  -o-transition: opacity 0.6s;
  transition: opacity 0.6s;
}
.lb-nav a.lb-next:hover {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
}
.lb-dataContainer {
  margin: 0 auto;
  padding-top: 5px;
  *zoom: 1;
  width: 100%;
  -moz-border-radius-bottomleft: 4px;
  -webkit-border-bottom-left-radius: 4px;
  border-bottom-left-radius: 4px;
  -moz-border-radius-bottomright: 4px;
  -webkit-border-bottom-right-radius: 4px;
  border-bottom-right-radius: 4px;
}
.lb-dataContainer:after {
  content: "";
  display: table;
  clear: both;
}
.lb-data {
  padding: 0 4px;
  color: #ccc;
}
.lb-data .lb-details {
  width: 85%;
  float: left;
  text-align: left;
  line-height: 1.1em;
}
.lb-data .lb-caption {
  font-size: 13px;
  font-weight: bold;
  line-height: 1em;
}
.lb-data .lb-number {
  display: block;
  clear: left;
  padding-bottom: 1em;
  font-size: 12px;
  color: #999999;
}
.lb-data .lb-close {
  display: block;
  float: right;
  width: 30px;
  height: 30px;
  background: url(images/close.png) top right no-repeat;
  text-align: right;
  outline: none;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
  opacity: 0.7;
  -webkit-transition: opacity 0.2s;
  -moz-transition: opacity 0.2s;
  -o-transition: opacity 0.2s;
  transition: opacity 0.2s;
}
.lb-data .lb-close:hover {
  cursor: pointer;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
}

/*================================================================ 
This copyright notice must be untouched at all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.stunicholls.com/menu/skeleton.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any 
way to fit your requirements.
=================================================================== */
#nav, 
#nav ul {padding:0 0 5px 0; margin-left: 1px; list-style:none; font: 11px  Lato, sans-serif; font-weight: 500; background:#fff; position:relative; z-index:200;}
#nav {padding:0; height:25px; width: 650px; margin-left: 100px; margin-bottom: 15px;}

#nav li {float:left;}
#nav li li {float:none; background:#fff;}
/* a hack for IE5.x and IE6 */
* html #nav li li {float:left;}

#nav li a {display:block; float:left; color:#333; margin:0 3px 0 3px; height:25px; line-height:25px; text-decoration:none; text-transform: uppercase; letter-spacing: 1.2px; white-space:nowrap; }
#nav li li a {height:25px; line-height:25px; text-transform: none; float:none;}

#nav li:hover {position:relative; z-index:300;}
#nav li:hover ul {left:0; top:25px;border:1px solid #000; border-color:#ecb; border-width:1px 1px 1px 1px;}


/* another hack for IE5.5 and IE6 */
* html #nav li:hover ul {left:10px;}

#nav ul {position:absolute; left:-9999px; top:-9999px;}
/* yet another hack for IE5.x and IE6 */
* html #nav ul {width:1px;}

/* it could have been this simple if all browsers understood */
/* show next level */
#nav li:hover li:hover > ul {left:-15px; margin-left:100%; top:-1px;}
/* keep further levels hidden */
#nav li:hover > ul ul {position:absolute; left:-9999px; top:-9999px; width:auto;}
/* show path followed */
#nav li:hover > a {text-decoration:none; color:#EC7C00;}


/* but IE5.x and IE6 need this lot to style the flyouts and path followed */
/* show next level */
#nav li:hover li:hover ul,
#nav li:hover li:hover li:hover ul,
#nav li:hover li:hover li:hover li:hover ul,
#nav li:hover li:hover li:hover li:hover li:hover ul
{left:-15px; margin-left:100%; top:-1px;}

/* keep further levels hidden */
#nav li:hover ul ul,
#nav li:hover li:hover ul ul,
#nav li:hover li:hover li:hover ul ul,
#nav li:hover li:hover li:hover li:hover ul ul
{position:absolute; left:-9999px; top:-9999px;}

/* show path followed */
#nav li:hover a,
#nav li:hover li:hover a,
#nav li:hover li:hover li:hover a,
#nav li:hover li:hover li:hover li:hover a,
#nav li:hover li:hover li:hover li:hover li:hover a,
#nav li:hover li:hover li:hover li:hover li:hover li:hover a
{text-decoration:none; color:#EC7C00;}

/* hide futher possible paths */
#nav li:hover li a,
#nav li:hover li:hover li a,
#nav li:hover li:hover li:hover li a,
#nav li:hover li:hover li:hover li:hover li a,
#nav li:hover li:hover li:hover li:hover li:hover li a
{text-decoration:none; color:#333;}

/* home page nav specific */

#navhome, 
#navhome ul {padding:0; list-style:none; font: 12px  Lato, sans-serif; background:#fff; margin-left:1px; position:relative; z-index:200;}
#navhome {padding:0; height:49px; width: 945px;}

#navhome li {float:left;}
#navhome li li {float:none; background:#fff;}
/* a hack for IE5.x and IE6 */
* html #navhome li li {float:left;}

#navhome li a {display:block; float:left; color:#000; margin:0 14px 0 14px; height:45px; line-height:48px; text-decoration:none; text-transform: uppercase; white-space:nowrap;}
#navhome li li a {margin-top:5px; margin-bottom:3px; height:25px; line-height:24px; text-transform: none; float:none;}

#navhome li:hover {position:relative; z-index:300;}
#navhome li:hover ul {left:0; top:40px;border:1px solid #000; border-color:#d9d9d9; border-width:1px 1px 1px 1px;}


/* another hack for IE5.5 and IE6 */
* html #navhome li:hover ul {left:10px;}

#navhome ul {position:absolute; left:-9999px; top:-9999px;}
/* yet another hack for IE5.x and IE6 */
* html #navhome ul {width:1px;}

/* it could have been this simple if all browsers understood */
/* show next level */
#navhome li:hover li:hover > ul {left:-15px; margin-left:100%; top:-1px;}
/* keep further levels hidden */
#navhome li:hover > ul ul {position:absolute; left:-9999px; top:-9999px; width:auto;}
/* show path followed */
#navhome li:hover > a {text-decoration:none; color:#EC7C00;}


/* but IE5.x and IE6 need this lot to style the flyouts and path followed */
/* show next level */
#navhome li:hover li:hover ul,
#navhome li:hover li:hover li:hover ul,
#navhome li:hover li:hover li:hover li:hover ul,
#navhome li:hover li:hover li:hover li:hover li:hover ul
{left:-15px; margin-left:100%; top:-1px;}

/* keep further levels hidden */
#navhome li:hover ul ul,
#navhome li:hover li:hover ul ul,
#navhome li:hover li:hover li:hover ul ul,
#navhome li:hover li:hover li:hover li:hover ul ul
{position:absolute; left:-9999px; top:-9999px;}

/* show path followed */
#navhome li:hover a,
#navhome li:hover li:hover a,
#navhome li:hover li:hover li:hover a,
#navhome li:hover li:hover li:hover li:hover a,
#navhome li:hover li:hover li:hover li:hover li:hover a,
#navhome li:hover li:hover li:hover li:hover li:hover li:hover a
{text-decoration:none; color:#EC7C00;}

/* hide futher possible paths */
#navhome li:hover li a,
#navhome li:hover li:hover li a,
#navhome li:hover li:hover li:hover li a,
#navhome li:hover li:hover li:hover li:hover li a,
#navhome li:hover li:hover li:hover li:hover li:hover li a
{text-decoration:none; color:#333;}


/* collapsible menu online courrse */
#example3 {
  float: left;
  padding-top: 42px;
}
.expand_all,
.collapse_all {
  cursor: pointer;
}
.example_menu {
  font-size: 90%;
  list-style: none;
  margin: 0;
  padding: 0;
  vertical-align: top;
  width: 136px;
}
.example_menu ul {
  display: none;
  list-style: none;
  margin: 0;
  padding: 0;
}
#menu3 {
  margin: 0;
}
#menu3 li,
.example_menu li {
  background-image: none;
  margin: 0;
  padding: 0;
}
.example_menu ul ul {
  display: block;
}
.example_menu ul ul li a {
  padding-left: 20px;
  width: 109px;
}
.example_menu a {
  color: #000;
  cursor: pointer;
  display: block;
  font-weight: bold;
  margin-left: 0;
  padding: 2px 2px 2px 17px;
  width: 112px;
}
.example_menu a.expanded {
  background: #FFA347 url('images/collapse.gif') no-repeat 3px 50%;
}
.example_menu a.collapsed {
  background: #FFA347 url('images/expand.gif') no-repeat 3px 50%;
}
.example_menu a.blank {
  background: #FFA347 no-repeat 3px 50%;
}
.example_menu a:hover {
  text-decoration: none;
}
.example_menu ul a {
  background: #e8e8e8;
  border-top: 2px solid #fff;
  color: #000;
  display: block;
  font-weight: normal;
  padding: 2px 2px 2px 10px;
  width: 119px;
}
.example_menu ul a:link {
  font-weight: normal;
}
.example_menu ul a:hover {
  background : #f5f5f5;
  text-decoration: underline;
}
.example_menu li.active a {
  background: #fff;
}
.example_menu li.active li a {
  background: #e8e8e8;
}
#menu3 li.footer,
.example_menu .footer {
  background: transparent url('images/footer.jpg') no-repeat 0 0;
  border-top: 2px solid #fff;
  height: 9px;
  line-height: 15px;
  margin: 0 0 10px 0;
  width: 131px;
}
.example_menu .footer span {
  display: none;
}
.example_menu .blankfooter {
  background: transparent no-repeat 0 0;
  border-top: 2px solid #fff;
  height: 15px;
  line-height: 15px;
  margin: 0 0 10px 0;
  width: 131px;
}
.example_menu .blankfooter span {
  display: none;
}