/* import core styles */
@import url(base.css);

/* Style the button that is used to open and close the collapsible content */
.collapsible {
  background-color: #53247F;
  color: white;
  padding: 18px;
  width: 100%;
  border: none;
  text-align: left;
  outline: none;
  font-size: 15px;
}

.content {
  padding: 0 18px;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.2s ease-out;
  background-color: #f1f1f1;
}

/*------------------------------------------
// 1.BASIC ELEMENTS
//------------------------------------------*/
body { color:#000; background:#9b916c;  font-family:"Helvetica", "Lucida Sans Unicode", sans-serif;}
h1, h2, h3, h4, h5, h6, p, li { line-height:1.0em; }

/*------------------------------------------
// 2.LAYOUT
//------------------------------------------*/


/*---- Container ----*/
div#container {  min-width: 980px; overflow: hidden;}

/*---- Container ----*/
div#container div.wrapper { width:970px; margin:0 auto; }

/*---- Header ----*/
div#header { background:#29104c url(../images/header/header-bg.gif) repeat-y center top; position:relative; z-index:20; border-top:1px solid #000; padding:18px 0px;  }
body.home div#headerWrapper { padding-top: 25px; margin: 0 auto; background: #fff;  }
body.layout div#header { background:#52247f; position:relative; z-index:20; padding:0px 0px 0px 0px;  }


/*---- Main Navigation ----*/
div#main-navigation {  background:url(../images/navigation/navigation-bg.gif) repeat-x left top;  position:relative; z-index:21; }


/*---- Banner ----*/
div#banner{ position:relative; z-index:1; background: #fff; }
*+html div#banner{ height:554px; float:left;}
div#banner div.wrapper{  width:100%; position:relative; margin:0 auto; top:-150px; overflow: hidden;}

/*---- Content ----*/
div#content { background:#f0ecdc url(../images/content/content-bg.gif) repeat-y center top;  padding-bottom:30px;  position:relative; z-index:10; }
body.home div#content{ margin-top:-152px;}
body.layout div#content {  padding-bottom:10px; margin-bottom:0px;}

/*---- Main ----*/
div#main { float:left; width:700px;}
div#main div#sidebar1{ float:left; width:180px;}
div#main div#inner-main{ float:right; width:495px; color: #444; font-size: 120%;}

/*---- Sidebar ----*/
div#sidebar { float:right; width:235px;  }

/*---- Footer ----*/
div#footer { padding: 15px 0 30px 0;  }

/*---- Footer ----*/
body.layout div#footer { padding-bottom:30px; background:url(../images/footer/footer-bg.gif) left top repeat-x; padding-top:20px;  }


/*------------------------------------------
// 3. PAGE COMMON STYLES
//------------------------------------------*/

/*---- Header - Logo ----*/
div#header div.logo { float:left; width:352px; height:53px; position:relative; margin-left:-3px;}
div#header div.logo.small { float:left; width:299px; height:44px; position:relative; margin-left:-3px;}
div#header div.logo a { position:relative; width:352px; height:53px; display:block; text-decoration:none; }
div#header div.logo a span  { position: absolute; top: 0; left: 0; background:url(../images/header/logo.png) 0 0 no-repeat; width:100%; height:100%; display:block; }
div#header div.logo.small a span  { position: absolute; top: 0; left: 0; background:url(../images/logosmall.gif) 0 0 no-repeat; width:100%; height:100%; display:block; }

/*---- Layout Header - Logo ----*/
body.layout div#header div.logo { float:right; width:189px; height:29px; margin:23px 0px; margin-right:2px; }
body.layout div#header div.logo h1 a { position:relative; width:189px; height:29px; display:block; text-decoration:none;  }
body.layout div#header div.logo h1 a span  { position: absolute; top: 0; left: 0; background:url(../images/header/logo3.jpg) 0 0 no-repeat; width:100%; height:100%; display:block; }

/*---- Layout Header - Logo2 ----*/
body.layout div#header div.logo2 { float:left; width:167px; height:111px;}
body.layout div#header div.logo2 h1 a { position:relative; width:167px; height:111px; display:block; text-decoration:none;}
body.layout div#header div.logo2 h1 a span  { position: absolute; top: 0; left: 0; background:url(../images/header/logo2.jpg) 0 0 no-repeat; width:100%; height:100%; display:block; }

/*---- Layout Header - The Hills ----*/
body.layout div#header div.thehills { float:left; width:167px; height:111px;}
body.layout div#header div.thehills h1 a { position:relative; width:167px; height:111px; display:block; text-decoration:none;}
body.layout div#header div.thehills h1 a span  { position: absolute; top: 0; left: 0; background:url(../images/header/hills-logo-white.jpg) 0 0 no-repeat; width:100%; height:100%; display:block; }

/*---- Header - Global Navigation ----*/
div#header div.global-navigation { float:right; /*width:283px;*/ margin-bottom:12px;}
div#header div.global-navigation ul li{ float:left; color:#fff; font-size:110%; margin-right:2px; line-height:11px; border-right:1px solid #8564a1; padding:0px 5px;}
div#header div.global-navigation ul li.last{ border:0px; padding-right:0px; margin-right:0px;}
div#header div.global-navigation ul li a{ color:#fff;}

/*---- Header - Search Form ----*/
div#header div.search-form { float:right; width:213px; height:22px; border:1px solid #000; clear:right;}
div#header div.search-form  p input.textbox{ background:#7b4fa5; border:none; padding:3px; line-height:16px; height:16px; width:181px; float:left; color:#fff;}
div#header div.search-form  p input.search-btn{ background:url(../images/header/search-btn.gif) no-repeat left top; height:22px; width:26px; cursor:pointer; float:left; border:0px;}

/*---- Main Navigation ----*/
div#main-navigation ul li{ float:left; height:32px; background:url(../images/navigation/navigation-li-bg.gif) no-repeat left top; position:relative; font-family:"Lucida Sans Unicode", sans-serif;}
div#main-navigation ul li a { float:left; text-decoration:none;  display:block; line-height:28px; height:32px; padding:0px 11px; color:#fff; font-size:14px; text-transform:uppercase; font-weight:bold;}
div#main-navigation ul li.outer-most a {background:url(../images/navigation/navigation-li-bg.gif) no-repeat right top; }
div#main-navigation ul li.outer-most li a {background: none; }
div#main-navigation ul li a.home{ background:url(../images/navigation/home.png) no-repeat center; width:15px;}
div#main-navigation ul li:hover{ background:url(../images/navigation/navigation-li-hover-bg.gif) repeat-x left 1px;}
div#main-navigation ul li:hover a.home{ background:url(../images/navigation/home.png) no-repeat center;}
div#main-navigation ul li.parent div.child{ position:absolute; z-index:30; top:31px;  width:700px; left:0px; display:none;}
div#main-navigation ul li.parent div.child div.inner{padding:12px 10px 8px 7px; border:5px solid #7b4fa5; background:#fff; position:relative;}
div#main-navigation ul li.parent:hover div.child{ display:block;}
div#main-navigation ul li.parent div.child ul{ background:none;}
div#main-navigation ul li.parent div.child ul li{ background:none; float:left; margin-right:10px; height:auto; line-height:normal; width:175px; padding-right:10px; /*min-height:145px;*/ border-right:1px solid #e4daee;}
div#main-navigation ul li.parent div.child ul li.last{ padding-right:0px; margin-right:0px; border-right:0px;}
div#main-navigation ul li.parent div.child ul li h2{ color:#000000; font-size:12px; margin-bottom:8px; text-transform:uppercase;}
div#main-navigation ul li.parent div.child ul li ul{ background:none;}
div#main-navigation ul li.parent div.child ul li ul li{display:block; float:none; font-size:80%; font-weight:bold; margin-right:0px; width:auto; /*min-height:18px;*/ border-right:0px; padding-right:0px; margin-bottom:3px;}
div#main-navigation ul li.parent div.child ul li ul li:hover{ background:none;}
div#main-navigation ul li.parent div.child ul li ul li a{ color:#310f56; text-decoration:none; height:auto!important; line-height:18px; padding:0px 2px; display: block; float:none; text-transform:none; font-size:11px;}
div#main-navigation ul li.parent div.child ul li ul li:hover a, div#main-navigation ul li.parent div.child ul li ul li.active a{ color:#fff; text-decoration:none; background:#441c6f; }

/*---- Layout Main Navigation ----*/
body.layout div#main-navigation ul li{ float:left; height:32px; background:url(../images/navigation/navigation-li-bg.gif) no-repeat left top; margin-left:1px; }
body.layout div#main-navigation ul li a { float:left; text-decoration:none;  display:block; line-height:32px; height:32px; padding:0px 12px; color:#fff; font-size:14px; text-transform:uppercase; }
body.layout div#main-navigation ul li:hover{ background:url(../images/navigation/navigation-li-hover-bg.gif) repeat-x center;}
body.layout div#main-navigation ul li.parent ul.child{ position:absolute; z-index:30; width:164px; top:31px; display:none; left:-3px; background:url(../images/navigation/navigation-chlid-li-bg.png) repeat-y left top; padding:0px 3px 0px 3px;}
body.layout div#main-navigation ul li.parent ul.child li{ background:#7b4fa5; border-bottom:1px solid #4b2676; height:21px; line-height:21px; padding:0px 12px; float:none; margin-left:0px;} 
body.layout div#main-navigation ul li.last:hover{ background:none;}
body.layout div#main-navigation ul li.parent:hover ul.child{ display:block;}

body.layout div#main-navigation ul li.parent ul.child li.last{ border:0px;}
body.layout div#main-navigation ul li.parent ul.child li:hover{ background:url(../images/navigation/navigation-li-chlid-hover-bg.gif) left top repeat-x;}
body.layout div#main-navigation ul li.parent ul.child li a{ color:#fff; background:none; height:21px; line-height:21px; padding:0px 0px; font-size:10px; text-transform:none; font-weight:normal; }
body.layout div#main-navigation ul li.last:hover{ background:url(../images/navigation/navigation-li-bg.gif) no-repeat left top; }


/*---- Main Navigation - Search Form ----*/
body.layout div#main-navigation div.search-form { float:right; width:250px; height:21px;  clear:right; margin-top:7px; margin-left:14px;}
body.layout div#main-navigation div.search-form  p input.textbox{ background:#fff url(../images/navigation/textbox.gif) left top no-repeat; border:1px solid #a3a3a3; padding:0px 3px 0px 22px; line-height:16px; height:16px; width:186px; float:left; margin-top:1px; color:#310f56;}
body.layout div#main-navigation div.search-form  p input.search-btn{ background:url(../images/navigation/search-btn.gif) no-repeat left top; height:21px; width:34px; cursor:pointer; float:left; border:0px;}
*+html body.layout div#main-navigation div.search-form  p input.search-btn{display:inline; margin-top:-16px;}


/*---- Post ---*/
div.post h1 { font-size:220%; margin-bottom:12px; color:#000; font-weight:normal;}
div.post h2 { font-size:14pt; margin-bottom:8px; color:#53247f;}
div.post h3 { font-size:18pt; margin-bottom:8px; color:#53247f; font-family:Impact, Chicago;}
div.post h4 { font-size:160%; margin-bottom:10px; color:#310f56; font-weight:normal; font-family:Georgia, "Times New Roman", Times, serif;}
div.post h5 { font-size:120%; margin-bottom:5px; color: #310f56;}
div.post h6 { font-size:220%; line-height:30px; margin-bottom:12px; color:#53247f; font-family:trebuchet ms, geneva;}
div.events h6 { font-size:120%; margin-bottom:15px; color:#000; text-transform:uppercase;}

div.post p { color:#444444; line-height:18px; margin-bottom:8px; display:block; font-size: 120%; }
div.post p a { color:#52237f; border-bottom:1px dotted #52237f; }
div.post p a:hover{ border-bottom:0px; text-decoration:none;}
div.post div.highlight, div.post div.highlight p {  font-size:120%; font-family:Helvetica, "Times New Roman", Times, serif;}
div.post div.image img{ border:1px solid #d4ceb7; padding:2px; background:#fff;}
div.post div.image span.name{ display:inline-block; float:left; color:#000; font-size:95%; font-family:Georgia, "Times New Roman", Times, serif; margin-bottom:5px; clear:left; font-style:italic;} 

div.post blockquote { margin-bottom:20px; }
div.post blockquote p{ margin-bottom:5px; font-style:italic;}
div.post blockquote p cite{ font-weight:bold; text-align:right; display:block;}

div.post img { max-width:100%; }
div.post .alignleft{ float:left; margin:0 10px 10px 0; display: inline;}
div.post img.alignright{ float:right; margin:0 0px 10px 10px; display: inline;}
div.post img.aligncenter{ display:block; margin-left:auto; margin-right:auto; margin-bottom:10px;}

div.post ul { margin:0 0 20px 14px; list-style:disc; }
div.post ol { margin:0 0 12px 0px; list-style:decimal; line-height:18px; list-style-position:inside; color:#444; }
div.post li {  font-size:120%; }
div.post li ul, div.post li ol { margin-bottom:0px; } 
div.post li li, div.post li p { font-size:100%; margin-bottom:0px; }

/*---- Post - Custom Lists ---*/
div.post ul.list1 { margin:0; padding:0; }
div.post ul.list1 li { margin:0; padding:0; }

div.post ol.list2 { margin:0; padding:0; }
div.post ol.list2 li { margin:0; padding:0; }

/*---- Footer - Navigation ---*/
div#footer div#footer-navigation { float:right; width:593px; padding-top:10px; }
div#footer div#footer-navigation ul { margin-bottom:10px;}
div#footer div#footer-navigation ul li { display:inline; color:#210b40; font-size:140%; font-weight:normal; margin-bottom:8px; line-height:14px; border-right:1px solid #7a6d60; padding:0px 5px; font-family:Georgia, "Times New Roman", Times, serif;}
div#footer div#footer-navigation ul li.last{ border-right:0px;}
div#footer div#footer-navigation ul li a{ color:#210b40;}
div#footer div#footer-navigation ul li.withimg A{ padding:0 17px 0 0;}
div#footer div#footer-navigation ul li.withimg.rss A{background: url("../images/icons/rss-feed.gif") no-repeat right center;}
div#footer div#footer-navigation ul li.withimg.fb A{background: url("../images/icons/facebook.gif") no-repeat right center;}
div#footer div#footer-navigation ul li.withimg.t A{background: url("../images/icons/twitter.gif") no-repeat right center;}
div#footer div#footer-navigation ul li.withimg.tube A{background: url("../images/icons/youtube-2.gif") no-repeat right center;}
div#footer div#footer-navigation ul li.withimg.pica A{background: url("../images/icons/g-photos.gif") no-repeat right center;}
div#footer div#footer-navigation ul li a img{ vertical-align:top;}

body.layout div#footer div.map a.OUdirectEdit, div#footer div#footer-navigation a.OUdirectEdit {color: #FFF; margin: 0 2px 0px 0px;} /* hide OU direct button */

/*---- Footer - Adr ---*/
div#footer div.adr{   float:left;  width:325px;}
div#footer div.adr img{ margin-right:5px; float:left;}
div#footer div.adr div.address{ float:left; width:230px; padding:10px 5px 16px 0px;}
div#footer div.adr div.address h3{ color:#210b40; font-size:140%; font-weight:normal; margin-bottom:8px; line-height:14px; font-family:Georgia, "Times New Roman", Times, serif;}
div#footer  p{ color:#fff; font-size:110%; line-height:14px;}


/*---- Layout Footer - Adr ---*/
body.layout div#footer div.adr{ padding:14px 5px 14px 0px; float:left;  width:400px; background:none;}
body.layout div#footer div.adr h3{ color:#210b40; font-size:16px; font-weight:normal; margin-bottom:8px; line-height:14px; font-family:Georgia, "Times New Roman", Times, serif;}
body.layout div#footer  p{ color:#fff; font-size:110%; line-height:14px;}

/*---- Layout Footer - Adr ---*/
body.layout div#footer div.map{  float:right;  width:275px; background:none; display:inline; margin-top:15px;}
body.layout div#footer div.map a{ float:right; display:block; margin:0px 0px 10px 10px;}
body.layout div#footer div.map a.OUdirectEdit{ float:left;}

body.layout div#footer  p{ color:#fff; font-size:110%; line-height:14px;}

/*---- Sidebar ---*/
div#sidebar div.widget{ padding:12px; }
div#sidebar div.widget h3{ color:#010000; font-size:120%; margin-bottom:8px; text-transform:uppercase; }
div#sidebar div.widget p{ color:#444444; line-height:18px; font-size:120%; margin-bottom:10px;}


/*---- Common Boxes & Containers ----*/
/*---- Boxes----*/
/*---- Box1----*/
div.box1{ border:1px solid #d4ceb7; width:593px; padding:1px; position:relative; margin:-1px 0 0 0; float:left;}

/*---- Box2----*/
div.box2{ background:#fff; position:relative;}

/*---- Box3----*/
div.box3{ background:#fff; position:relative; padding:5px; margin-bottom:10px; }


/*---- Buttons ----*/
/*---- Button1 ----*/
a.button1{ color:#9b916c; display:block; font-size:130%; border:1px solid #c4bda1; background:#dddbc6; padding:0px 12px; float:left; height:17px; line-height:17px; text-decoration:none; text-transform:uppercase; margin-bottom:8px;}
a.button1:hover{ text-decoration:none;}

/*---- Button2 ----*/
a.button2{ color:#fff; display:block; font-size:130%;  background:#c4bda1; padding:0px 12px; float:left; height:22px; line-height:22px; text-decoration:none; text-transform:uppercase; margin-bottom:8px;}
a.button2 span{ background:url(../images/buttons/button2.gif) no-repeat right center; padding-right:10px; display:block; float:left;}
a.button2:hover{ text-decoration:none;}

/*---- Button3 ----*/
a.button3{ color:#fff; display:block; font-size:130%;  background:#78824f; padding:0px 12px; float:left; height:22px; line-height:20px; text-decoration:none; text-transform:uppercase; margin-right:2px; }
a.button3 span{ background:url(../images/buttons/button3.png) no-repeat right center; padding-right:10px; display:block; float:left;}
a.button3:hover{ text-decoration:none;}

/*---- Button4 ----*/
a.button4{ color:#fff; display:block; font-size:130%;  background:#6b8998; padding:0px 12px; float:left; height:22px; line-height:20px; text-decoration:none; text-transform:uppercase; margin-right:2px; }
a.button4 span{ background:url(../images/buttons/button3.png) no-repeat right center; padding-right:10px; display:block; float:left;}
a.button4:hover{ text-decoration:none;}

/*---- Button5 ----*/
a.button5{ color:#fff; display:block; font-size:130%;  background:#cc6666; padding:0px 12px; float:left; height:22px; line-height:20px; text-decoration:none; text-transform:uppercase; margin-right:2px; }
a.button5 span{ background:url(../images/buttons/button3.png) no-repeat right center; padding-right:10px; display:block; float:left;}
a.button5:hover{ text-decoration:none;}

/*---- Button6 ----*/
a.button6{ color:#fff; display:block; font-size:130%;  background:#8a4618; padding:0px 12px; float:left; height:22px; line-height:22px; text-decoration:none; text-transform:uppercase; margin-right:2px; }
a.button6 span{ background:url(../images/buttons/button3.png) no-repeat right center; padding-right:10px; display:block; float:left;}
a.button6:hover{ text-decoration:none;}

/*---- Button7 ----*/
a.button7{ color:#fff; display:block; font-size:110%;  background:url(../images/buttons/button7.png) no-repeat left top; padding-left:10px; float:left; height:26px; line-height:22px; text-decoration:none; text-transform:uppercase; }
a.button7 span{ background:url(../images/buttons/button7.png) no-repeat right top;   padding-right:10px; display:block; float:left;}
a.button7:hover{ text-decoration:none; background:url(../images/buttons/button8.png) no-repeat left top; }
a.button7:hover span{ background:url(../images/buttons/button8.png) no-repeat right top;}

/*---- Button8 ----*/
a.button8{ color:#fff; display:block; font-size:110%;  background:url(../images/buttons/button8.png) no-repeat left top; padding-left:10px; float:left; height:26px; line-height:26px; text-decoration:none; text-transform:uppercase; }
a.button8 span{ background:url(../images/buttons/button8.png) no-repeat right top;   padding-right:10px; display:block; float:left;}
a.button8:hover{ text-decoration:none;}

/*---- Button9 ----*/
.button9 {
  padding: 16px 5px;
  width: 208px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  margin: 2px;
  transition-duration: 0.4s;
  cursor: pointer;
  background-color: #53247F; 
  color: white; 
  border: 2px solid #53247F;
}

.button9:hover {
  background-color: white;
  color: #53247F;
}

/*---- Button10 ----*/
.button10 {
  padding: 16px 5px;
  width: 208px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  margin: 2px;
  transition-duration: 0.4s;
  cursor: pointer;
  background-color: transparent;
  color: white; 
  border: 2px solid white;
}

.button10:hover {
  background-color: white;
  color: transparent;
}



/*---- Print Btn ----*/
a.print-btn{ background:url(../images/buttons/print-btn.gif) no-repeat left top; width:82px; height:32px; display:block; text-decoration:none;}
a.print-btn:hover{ text-decoration:none;}

/*---- Read More ----*/
a.read-more-btn{ color:#9b916c; display:block; font-size:130%; border:1px solid #c4bda1; background:#dddbc6; padding:0px 12px; float:left; height:17px; line-height:15px; text-decoration:none; text-transform:uppercase;}
a.read-more-btn:hover{ text-decoration:none;}

/*---- Lists ----*/
/*---- List1 ----*/
ul.list1{ margin:0px;}
ul.list1 li{ margin-bottom:16px; width:100%;}
ul.list1 li div.image{ float:left; border:1px solid #d4ceb7; width:96px; padding:2px; margin-right:15px;}
ul.list1 li div.image img{ display:block;}
ul.list1 li div.description{ float:left;  width:335px; }
ul.list1 li div.description h2{ color:#310f56; font-weight:normal; font-size:160%; line-height:17px; margin-bottom:5px; font-family:Georgia, "Times New Roman", Times, serif;}
ul.list1 li div.description h2 a{color:#310f56;}
ul.list1 li div.description p{ color:#444444;  font-size:120%; line-height:18px;}

/*---- List2 ----*/
ul.list2{ margin:0px;}
ul.list2 li{ margin-bottom:15px;}
ul.list2 li span.date-samp{ float:left; width:31px; margin-right:15px; display:block; background:#9b916c; font-size:200%; text-align:center; font-family:"Times New Roman", Times, serif; color:#9b916c; padding:4px 0px 0px 0px;}
ul.list2 li span.date-samp span.month{ font-size:50%; color:#fff; font-family:Arial, Helvetica, sans-serif; }
ul.list2 li span.date-samp span.date{ background:url(../images/content/list2-date-stamp.gif) no-repeat left top; width:31px; padding:4px 0px 0px 0px; display:block; height:18px; margin-top:4px;}
ul.list2 li div.description{ float:left;  width:460px; }
ul.list2 li div.description h2{ color:#310f56; font-weight:normal; font-size:160%; line-height:17px; margin-bottom:5px; font-family:Georgia, "Times New Roman", Times, serif;}
ul.list2 li div.description h2 a{ color:#310f56; text-decoration:none;}
ul.list2 li div.description p{ color:#444444;  font-size:120%; line-height:18px;}

/*---- Landing page lists ----*/
div#linkSections ul { margin:0px 0px 5px 0px; list-style:none; padding-top:12px; float:right; width:510px}
div#linkSections ul li{ background:url(../images/content/main/list3-bg.gif) left bottom repeat-x; height:19px; margin-bottom:5px; line-height:13px; padding-bottom:3px; color:#000; font-size:120%; float:left; margin-right:15px; width:240px; }
div#linkSections ul li.last{ background:none; }
div#linkSections ul li a{ background:url(../images/content/main/list3-a-bg.gif) no-repeat left center; display:block; padding-left:20px; color:#000; }
div#main div#sidebar1 ul li{ background:url(../images/content/main/list3-bg.gif) left bottom repeat-x; height:auto; margin-bottom:5px; line-height:13px; padding-bottom:3px; color:#000; font-size:120%; float:left; margin-right:15px; width:100%; }
div#main div#sidebar1 ul li a:hover{ color:#6b8998; }
div#main div#sidebar1 ul li a { background:url(../images/content/main/list4-a-bg.gif) no-repeat left center; display:block; padding-left:20px; color:#000; }

/* Section Navigation List */
#sectionNav ul {
	display: block;
	margin: 0px 0px 5px 0px;
	list-style: none;
	padding-top: 12px;
}
#sectionNav ul li {
	background: url(../images/content/main/list3-bg.gif) left bottom repeat-x;
	height: 19px;
	margin-bottom: 5px;
	line-height: 13px;
	padding-bottom: 3px;
	color: #000;
	font-size: 120%;
	float: left;
	margin-right: 15px;
	width:240px;
}
#sectionNav ul li a {
	background: url(../images/content/main/list3-a-bg.gif) no-repeat left center;
	display: block;
	padding-left: 20px;
	color:#000;
}
#sectionNav ul li a:hover {
	color: #738539;
	text-decoration: none;
}


/*---- List3 ----*/
div.post ul.list3, ul.list3{ margin:0px 0px 5px 0px; list-style:none; padding-top:12px; float:right; width:510px}
ul.list3 li{ background:url(../images/content/main/list3-bg.gif) left bottom repeat-x; height:19px; margin-bottom:5px; line-height:13px; padding-bottom:3px; color:#000; font-size:120%; float:left; margin-right:15px; width:240px; }
ul.list3 li.last{ background:none; }
div#main div#sidebar1 ul.list3 { margin-bottom:10px; float:none;}
div#main div#sidebar1 ul.list3 li{  width:180px; height:auto; padding-bottom:8px; margin-right:0px; float:none; }
div#main div#sidebar1 ul.list3 li a:hover{ color:#738539; text-decoration:none;}
ul.list3 li a{ background:url(../images/content/main/list3-a-bg.gif) no-repeat left center; display:block; padding-left:20px; color:#000; }

/*---- List4 ----*/
div.post ul.list4, ul.list4{ margin:0px 0px 5px 0px; list-style:none; padding-top:12px; float:right; width:510px}
ul.list4 li{ background:url(../images/content/main/list3-bg.gif) left bottom repeat-x; height:19px; margin-bottom:5px; line-height:13px; padding-bottom:3px; color:#000; font-size:120%; float:left; margin-right:15px; width:240px; }
ul.list4 li.last{ background:none; }

div#main div#sidebar1 ul.list4{ margin-bottom:10px; float:none;}
div#main div#sidebar1 ul.list4 li{  width:180px; height:auto; padding-bottom:8px; margin-right:0px; float:none; }
div#main div#sidebar1 ul.list4 li a:hover{ color:#6b8998;}
ul.list4 li a{ background:url(../images/content/main/list4-a-bg.gif) no-repeat left center; display:block; padding-left:20px; color:#000;}
#sidebar1 ul li a{text-decoration:none;}

/*---- List5 ----*/
div.post ul.list5, ul.list5{ margin:0px 0px 5px 0px; list-style:none; padding-top:12px; float:right; width:510px}
ul.list5 li{ background:url(../images/content/main/list3-bg.gif) left bottom repeat-x; height:19px; margin-bottom:5px; line-height:13px; padding-bottom:3px; color:#000; font-size:120%; float:left; margin-right:15px; width:240px; }
#sidebar1 ul li.last{ background:none; }

div#main div#sidebar1 ul.list5{ margin-bottom:10px; float:none;}
div#main div#sidebar1 ul.list5 li{  width:180px; height:auto; padding-bottom:8px; margin-right:0px; float:none; }
div#main div#sidebar1 ul.list5 li a:hover{ color:#8a4618;}
ul.list5 li a{ background:url(../images/content/main/list5-a-bg.gif) no-repeat left center; display:block; padding-left:20px; color:#000;}

/*---- List6 ----*/
ul.list6{ margin-bottom:10px;}
ul.list6 li{ border:1px solid #d4ceb7; width:97px; padding:2px; margin-bottom:auto; margin-top:auto; display:inline-block; margin-left: auto; margin-right: auto;}
ul.list6 li img{ display:inline-block;}

/*---- List7 ----*/
div.post ul.list7, ul.list7{ margin:0px 0px 20px 0px; list-style:none;}
ul.list7 li{ background:#ecebdc; line-height:26px; color:#52237f; font-size:120%; padding:0px 6px;}
ul.list7 li.alt{ background:none;}
ul.list7 li span.time{ display:block; color:#444444; font-weight:bold; width:152px; float:left;}

/*---- List8 ----*/
div.post ul.list8, ul.list8{ margin:0px; list-style:none;}
ul.list8 li{ background:url(../images/content/main/list3-bg.gif) left bottom repeat-x; height:19px; margin-bottom:5px; line-height:13px; padding-bottom:3px; color:#000; font-size:120%; }
ul.list8 li a{ background:url(../images/content/main/list8-a-bg.gif) no-repeat left center; display:block; padding-left:10px; color:#000; }
ul.list8 li.last{ background:none;}

/*---- List9 ----*/
div.post ul.list9, ul.list9{ margin:0px; list-style:none; }
ul.list9 li{ margin-bottom:12px; line-height:13px; color:#52237f; font-size:120%; padding-right:10px; float:left; width:auto; width:201px; }
ul.list9 li a{ background:url(../images/content/main/list9-bg.gif) right center no-repeat; color:#52237f; padding-right:10px; text-decoration:none;}
ul.list9 li a:hover{text-decoration:underline;}

/*---- Headings ----*/
/*---- Heading1 ----*/
div.post h3.heading1, h3.heading1 { background:url(../images/content/main/heading1-bg.gif) left top; padding-left:7px; line-height:21px; color:#fff; font-size:120%; text-transform:uppercase; }

/*---- Heading2 ----*/
div.post h3.heading2, h3.heading2 { background:url(../images/content/main/heading2-bg.gif) left top; padding-left:7px; line-height:21px; color:#fff; font-size:120%; text-transform:uppercase; }

/*---- Heading3 ----*/
div.post h3.heading3, h3.heading3 { background:url(../images/content/main/heading3-bg.gif) left top; padding-left:7px; line-height:21px; color:#fff; font-size:120%; text-transform:uppercase; }

/*---- Heading4 ----*/
h2.heading4 { background:url(../images/content/main/heading4-bg.gif) left top repeat-x; font-weight:normal; height:34px; padding-left:7px; line-height:34px; color:#fff; font-size:17px; font-family:Georgia, "Times New Roman", Times, serif; position:relative;}

/*---- Heading5 ----*/
div.post h3.heading5, div#sidebar div.widget h3.heading5, h3.heading5 { background:url(../images/content/main/heading5-bg.gif) left top repeat-x; height:21px; padding-left:7px; line-height:21px; color:#fff; font-size:120%; text-transform:uppercase; }

div#main.hett-interior h3 {
  background: url(/public/images/content/main/heading5-bg.gif) left top repeat-x;
  height: 21px;
  padding-left: 7px;
  line-height: 21px;
  color: white;
  font-size: 120%;
  text-transform: uppercase;
  width: 99%;
  display: block;
}

p.hr{ background:url(../images/content/main/list3-bg.gif) repeat-x left top; height:1px; clear:both; line-height:1px; }

p.hr3, p.hr3{ background:#8dc73f; repeat-x left top; height:3px; clear:both; line-height:3px; }

p.hr4, p.hr4{ background:#78824f; repeat-x left top; height:3px; clear:both; line-height:3px; }

div.post p.hr2, p.hr2{ background:#dddbc6; height:2px; clear:both; margin-bottom:8px;  line-height:2px;}


/*---- Breadcrumb ----*/
div.breadcrumb{ margin-bottom:14px; padding-top:12px;}
div.breadcrumb p{ color:#333333; font-size:110%; line-height:12px;}
div.breadcrumb p a { color:#53247f; font-weight:bold; }
div.breadcrumb p .share { cursor: pointer; color:#53247f; font-weight:bold; display:inline-block; float:right; background:url(../images/content/share-bg.gif) no-repeat right top; height:16px; padding-right:20px;  }

/*------------------------------------------
// 4.1  INDEX PAGE SPECIFIC STYLES
//------------------------------------------*/
/*---- Slideshow1 ----*/
div.slideshow1{ float:left; width:315px; margin-top:8px; position:relative;}
div.slideshow1 div.slides{ margin:0px; width: 315px; height: 350px;}
div.slideshow1 div.slides div.slide{ margin:0px; width: 315px; height: 350px; display: none;}
div.slideshow1 div.slides div.slide div.image{ position:relative; margin-left:-15px; width:329px; margin-bottom:3px;}
div.slideshow1 div.slides div.slide div.description h2{ line-height:22px;  font-size:160%; font-weight:normal; font-style:italic; margin-bottom:14px; font-family:Georgia, "Times New Roman", Times, serif;}
div.slideshow1 div.slides div.slide div.description span.author{ color:#444444; display:block; font-size:120%; margin-bottom:18px;}
div.slideshow1 div.slides div.slide div.description a.read-more{ background:url(../images/content/read-more-bg.gif) no-repeat right 3px; padding-right:8px; display:block; color:#c2a210; font-size:120%; margin-bottom:8px; font-weight:bold;}

/* @OmniUpdate Aug 2011 */
/* div.slideshow1 div.controls{ margin:0px; height:25px; position: absolute; bottom: 0; left: 0;} */
div.slideshow1 div.controls{ margin:0px; height:25px; bottom: 0; left: 0;}

/* @OmniUpdate Aug 2011 */
/* div.slideshow1 div.controls a{ display:block; float:left; margin-right:4px; text-decoration:none; padding-top:6px; width:32px; text-align:center; } */
div.slideshow1 div.controls a{ display:block; float:left; margin-right:4px; text-decoration:none; width:32px; text-align:center; }

div.slideshow1 div.controls a span{ border:1px solid #c4bda1; background:#dddbc6; line-height:17px; padding:0px 10px; color:#9b916c; font-size:130%; display:block; }
div.slideshow1 div.controls a.activeSlide, div.slideshow1 div.controls a:hover{ padding-top:0px;}

/* @OmniUpdate Aug 2011 */
/* div.slideshow1 div.controls a.activeSlide span, div.slideshow1 div.controls a:hover span{ border:1px solid #a39a77; background:#9b916c; line-height:23px;  color:#fff; font-size:160%;   } */
div.slideshow1 div.controls a.activeSlide span, div.slideshow1 div.controls a:hover span{ border:1px solid #a39a77; background:#9b916c; line-height:17px;  color:#fff; font-size:160%;   }

/*---- Tabs ----*/
div.tabs{ margin:18px 10px 0 0; display:inline; width:595px; float:right;}

/* @OmniUpdate Aug 2011*/
/* div.tabs div.tab-strip{ height:32px; position:relative; z-index:100;} */
div.tabs div.tab-strip{ height:32px; position:relative; z-index:100; padding-left: 3px;}

div.tabs div.tab-strip div.shadow{display:none; background:url(../images/content/tab-strip-shadow.gif) no-repeat left bottom; position:relative;  height:3px; width:120px; z-index:10; float:left; margin-top:29px;}
div.tabs div.tab-strip ul{ float:left;}

/* @OmniUpdate Aug 2011 */
/* div.tabs div.tab-strip ul li{ height:32px;   line-height:32px; float:left; margin:0 5px 0 -3px; position:relative; z-index:1; background:url(../images/content/tab-strip-li-bg.png) left top no-repeat; padding-left:10px; } */
div.tabs div.tab-strip ul li{ height:32px;   line-height:32px; float:left; margin:0 12px 0 -3px; position:relative; z-index:1; background:url(../images/content/tab-strip-li-bg.png) left top no-repeat; padding-left:10px; }

div.tabs div.tab-strip ul li.first, div.tabs div.tab-strip ul li:first{ height:32px;   line-height:32px; float:left; margin:0 5px 0 -3px; position:relative; z-index:1; background:url(../images/content/tab-strip-li-bg2.gif) left top no-repeat; padding-left:10px; }
div.tabs div.tab-strip ul li.outer-most, div.tabs div.tab-strip ul li:last{ margin:0px;}

/* @OmniUpdate Aug 2011 */
/* div.tabs div.tab-strip ul li a{text-decoration:none; display:block; padding:0px 18px 0px 10px; color:#9b916c; font-size:150%; line-height:30px; text-transform:uppercase; background:url(../images/content/tab-strip-li-bg.png) right top no-repeat; height:32px; line-height:32px; position:relative;} */
div.tabs div.tab-strip ul li a{text-decoration:none; display:block; padding:0px 18px 0px 10px; color:#9b916c; font-size:150%; line-height:30px; text-transform:uppercase; background:url(../images/content/tab-strip-li-bg.png) right top no-repeat; height:32px; line-height:32px; position:relative; margin-right: -7px; }

div.tabs div.tab-strip ul li:hover, div.tabs div.tab-strip ul li.active {z-index:100; background:url(../images/content/tab-strip-li-bg.png) no-repeat left bottom; }
div.tabs div.tab-strip ul li:hover a, div.tabs div.tab-strip ul li.active a{ color:#000; background:url(../images/content/tab-strip-li-bg.png) no-repeat right bottom;}
div.tabs div.tab-strip ul li.first:hover, div.tabs div.tab-strip ul li.active.first {z-index:100; background:url(../images/content/tab-strip-li-bg2.gif) no-repeat left bottom; }
div.tabs div.tab-strip ul li.first:hover a, div.tabs div.tab-strip ul li.active.first a{ color:#000; background:url(../images/content/tab-strip-li-bg2.gif) no-repeat right bottom;}
div.tabs div.tab-content{ padding:20px 22px 16px 15px; display:none;  width:554px; float:left;}
div.tab-content p {
  font-size: 12px;
  line-height: 1.6em;
  margin-bottom: 8px;
}
#news-tab-content{background: url("../images/pictures/church.jpg") no-repeat bottom right;}
#events-tab-content{background: url("../images/pictures/stove.jpg") no-repeat bottom right;}
div.tabs div.active { display:block; }

div.tabs div#news-tab-cotnent{ background:url(../images/content/tab-content-news-bg.gif) no-repeat right bottom; }

div.tabs div#events-tab-cotnent{ background:url(../images/content/tab-content-events-bg.gif) no-repeat right bottom; }

/*------------------------------------------
// 4.2  ABOUT PAGE SPECIFIC STYLES
//------------------------------------------*/
/*---- Slideshow2 ----*/
div.slideshow2{   position:relative; height:237px;}
div.slideshow2 div.slides{ margin:0px;}
div.slideshow2 div.slides div.slide{ margin:0px; width: 970px; height: 237px; display: none; }
div.slideshow2 div.slides div.slide div.image{ position:relative; z-index:10;}
div.slideshow2 div.slides div.slide div.description{ position:absolute; z-index:10; top:20px; right:10px;}
div.slideshow2 div.controls{  height:16px; position:absolute; right:10px; bottom:10px; width:60px; z-index:20; }
div.slideshow2 div.controls a.previous{ display:block; float:left; margin-right:4px; text-decoration:none; background:url(../images/slideshow2/previous-btn.png) no-repeat left top; height:16px; width:16px; }
div.slideshow2 div.controls a.previous:hover{ background:url(../images/slideshow2/previous-hover-btn.png) no-repeat left top; }
div.slideshow2 div.controls a.pause{ display:block; float:left; margin-right:4px; text-decoration:none; background:url(../images/slideshow2/pause-btn.png) no-repeat left top; height:16px; width:16px; }
div.slideshow2 div.controls a.next{ display:block; float:left;  text-decoration:none; background:url(../images/slideshow2/next-btn.png) no-repeat left top; height:16px; width:16px; }
div.slideshow2 div.controls a.next:hover{ background:url(../images/slideshow2/next-hover-btn.png) no-repeat left top; }
div.slideshow2 div.controls a.play{ display:block; float:left; margin-right:4px; text-decoration:none; background:url(../images/slideshow2/play-btn.png) no-repeat left top; height:16px; width:16px; display:none; }
/*------------------------------------------
// 4.3  PLAN YOUR VISIT PAGE SPECIFIC STYLES
//------------------------------------------*/
/*---- Quiz-form ----*/
div.quiz-form{ margin:0px;}
div.quiz-form ul li{ margin-bottom:10px;}
div.quiz-form ul li input.radio-btn{ float:left; margin:0px 5px 0px 0px;}
div.quiz-form ul li label{ display:inline-block; float:left; color:#52237f; line-height:13px; font-size:120%;}
div.quiz-form ul li input.submit-btn{ background:url(../images/buttons/submit-btn1.gif) no-repeat left top; width:79px; height:22px; border:0px; cursor:pointer;}
div.quiz-form ul li input.submit-btn2{ background:url(../images/buttons/submit-btn2.gif) no-repeat left top; width:79px; height:22px; border:0px; cursor:pointer;}

/*------------------------------------------
// 4.4  HISTORY PAGE SPECIFIC STYLES
//------------------------------------------*/
/*---- Slideshow3 ----*/
div.slideshow3{ height:237px; position:relative;}
div.slideshow3 div.slides{ margin:0px;}
div.slideshow3 div.slides div.slide{ margin:0px;}
div.slideshow3 div.slides div.slide div.image{ position:relative; z-index:10;}
div.slideshow3 div.slides div.slide div.description{  height:auto; position:absolute; right:0px; bottom:25px;  z-index:20; background:url(../images/slideshow3/description-bg.png) no-repeat left center; width:410px; padding:8px 10px 8px 20px;}
div.slideshow3 div.slides div.slide div.description h2{ color:#c4bda1; font-size:160%; font-style:italic; font-weight:normal; line-height:24px; font-family:Georgia, "Times New Roman", Times, serif;} 
div.slideshow3 div.slides div.slide div.description h2 span{ color:#fff;}

div.frame{ width:188px; float:left; margin-right:10px;}

/*------------------------------------------
// 4.5  HETT HOME PAGE SPECIFIC STYLES
//------------------------------------------*/
div.events{ margin-bottom:6px;}
div.events h5 a { color: #52237F; }
div.events div.description{ float:left; width:455px; }
div.events div.description h5{ color:#52237f; background:url(../images/content/main/events-description-h5-bg.gif) repeat-x left bottom; float:left; line-height:14px;}
div.events div.description span.date-stamp{ display:block; color:#444; font-family:Georgia, "Times New Roman", Times, serif; font-size:120%; margin-bottom:5px; clear:both; font-style:italic;}

div.tabs2{ float:right; width:400px;}
ul.tab-strips2{ background:url(../images/header/tab2-bg.gif) left top repeat-x; height:42px; width:340px; float:right;}
ul.tab-strips2 li{ background:url(../images/header/tab2-li-bg.gif) no-repeat right top; height:42px; float:left;}
ul.tab-strips2 li a{ display:block; padding:0px 20px; height:42px; line-height:42px; color:#fff; font-size:200%; text-decoration:none; float:left;}
ul.tab-strips2 li a:hover{ text-decoration:none;}
ul.tab-strips2 li.first a{ background:url(../images/header/tab2-li-first-bg.gif) no-repeat left top;}
ul.tab-strips2 li.last{ background:url(../images/header/tab2-li-last-bg.gif) no-repeat right top;}


/*---- Slideshow4 ----*/
div.slideshow4{   position:relative; height:305px; width: 970px; padding-top:20px;}
div.slideshow4 div.slides{ margin:0px;}
div.slideshow4 div.slides div.slide{ margin:0px; width: 970px; height: 305px;}
div.slideshow4 div.slides div.slide div.image{ position:relative; z-index:10;}
div.slideshow4 div.slides div.slide div.description{ position:absolute; z-index:10; top:44px; right:10px;}
div.slideshow4 div.slides div.slide div.description h1  { position:relative; width:296px; height:151px; display:block; margin-bottom:24px; }
div.slideshow4 div.slides div.slide div.description h1 span  { position: absolute; top: 0; left: 0; background:url(../images/slideshow2/image3.jpg) 0 0 no-repeat; width:100%; height:100%; display:block; }
div.slideshow4 div.controls{  height:16px; position:absolute; right:10px; bottom:10px; width:60px; z-index:20; }
div.slideshow4 div.controls a.previous-btn{ display:block; float:left; margin-right:4px; text-decoration:none; background:url(../images/slideshow2/previous-btn.png) no-repeat left top; height:16px; width:16px; }
div.slideshow4 div.controls a.previous-btn:hover{ background:url(../images/slideshow2/previous-hover-btn.png) no-repeat left top; }
div.slideshow4 div.controls a.pause-btn{ display:block; float:left; margin-right:4px; text-decoration:none; background:url(../images/slideshow2/pause-btn.png) no-repeat left top; height:16px; width:16px; }
div.slideshow4 div.controls a.play-btn{ display:block; float:left; margin-right:4px; text-decoration:none; background:url(../images/slideshow2/play-btn.png) no-repeat left top; height:16px; width:16px; display:none; }
div.slideshow4 div.controls a.next-btn{ display:block; float:left;  text-decoration:none; background:url(../images/slideshow2/next-btn.png) no-repeat left top; height:16px; width:16px; }
div.slideshow4 div.controls a.next-btn:hover{ background:url(../images/slideshow2/next-hover-btn.png) no-repeat left top; }


/*------------------------------------------
// 4.5  CALENDAR PAGE SPECIFIC STYLES
//------------------------------------------*/
/*---- Header - Search Form ----*/
div#sidebar div.search-form { width:208px; height:24px; margin-bottom:16px;}
div#sidebar div.search-form  p input.textbox{ background:#fff; border:1px solid #dddbc6; border-right:0px; padding:3px; line-height:16px; height:16px; width:174px; float:left; color:#310f56;}
div#sidebar div.search-form  p input.search-btn{ background:url(../images/content/sidebar/search-btn.gif) no-repeat left top; height:24px; width:27px; cursor:pointer; float:left; border:0px;}


/*---- Table1 ----*/
div.table{ background:#606d2b; padding:4px; margin-bottom:24px;}
div.table div.controls{ margin-bottom:5px;}
div.table div.controls a.previous-btn{ background:url(../images/content/sidebar/previous-btn.gif) no-repeat left top; height:14px; width:24px; display:block; float:left; text-decoration:none;}
div.table div.controls a.next-btn{ background:url(../images/content/sidebar/next-btn.gif) no-repeat left top; height:14px; width:24px; display:block; float:right; text-decoration:none;}
div.table div.controls h2{ color:#fff; font-size:100%; text-align:center;}
table.table1{ width:100%; border-spacing:0; border-collapse:collapse;  }
table.table1 tr th{ color:#fff; font-size:100%;  vertical-align:middle; text-align:center; line-height:20px;  background:#8d9f52; font-variant:normal; }
table.table1 tr td{ color:#555555; font-size:100%;  vertical-align:middle; text-align:center; line-height:20px; background:#f0ecdc; border:1px solid #fff; }

/*---- Slideshow5 ----*/
div.slideshow5{ position:relative; height:554px;}
div.slideshow5 div.slides{ margin:0px; height: 555px; position: relative; width: 100%; }
div.slideshow5 div.slides div.slide { margin:0px; position:absolute; z-index:1; height: 555px; width: 100%; }
div.slideshow5 div.slides div.slide div.image { background:#fff; }
div.slideshow5 div.slides div.slide div.image img{ position:relative; z-index:2; opacity:1; width: 100%; min-width: 1291px; }
div.slideshow5 div.slides div.slide div.descriptionWrapper { display:none;}
div.slideshow5 div.slides div.slide div.descriptionWrapper { position: absolute; width: 100%; top: 0; left: 0; height: 555px; z-index:5; }

/* @OmniUpdate */
div.slideshow5 div.slides div.slide div.description { position:relative; margin: 0 auto; padding: 196px 0 0 165px; width: 1126px; }
/* div.slideshow5 div.slides div.slide div.description { position:absolute; left: 0; top: 0; margin: 0 auto; padding: 196px 0 0 165px; width: 1126px; z-index: 2; display: none; } */

div.slideshow5 div.slides div.slide div.description h2{ 
	color: #210b40;
	font-size: 460%;
	font-weight: normal;
	margin-bottom: 20px;
	font-family: ColaborateThinRegular, "Times New Roman";
}
div.slideshow5 div.slides div.slide div.description ul li{ float:left; width:170px; margin-right:25px; z-index: 70; }
div.slideshow5 div.slides div.slide div.description ul li h3{ color:#52237f; font-size:130%; margin-bottom:10px;  text-transform:uppercase;}
div.slideshow5 div.slides div.slide div.description ul li img{ border:1px solid #fff; margin-bottom:10px;}
div.slideshow5 div.slides div.slide div.description ul li h4{ color:#210b40; font-size:120%; line-height:14px; font-style:italic; font-size:11px;}
div.slideshow5 div.slides div.slide div.description ul li p{ color:#210b40; font-size:11px; line-height:14px; margin-bottom:6px;}

.controls.index{ position:absolute; right:0px; top:370px;  z-index:20;}
.controls.index ul li{ float:left; background:url(../images/slideshow5/ul-li-bg.png) left top repeat-x; padding:4px 0px 4px 1px; position:relative;}
.controls.index ul li a.short img{ display:block; z-index:25; opacity: 0.7; height: 39px; }

.controls.index ul li div.long{ display:none;}
.controls.index ul li.active a.short{ display:none;}
.controls.index ul li.active div.long{ display:block;}
.controls.index ul li div.long{ background:url(../images/slideshow5/ul-li-active-left.png) no-repeat left top; padding-left:2px; position:relative; z-index:30; width:380px; display:none; margin:-5px 0px 0px -3px; }
.controls.index ul li div.long div.right{ background:url(../images/slideshow5/ul-li-active-right.png) no-repeat right top; padding-right:5px;}
.controls.index ul li div.long div.right div.middle{ background:url(../images/slideshow5/ul-li-active-bg.png) repeat-x left top; padding:2px 0px;}
.controls.index ul li div.long div.right div.middle div.image .spiner{position:absolute; width:100%; height:100%; left:0px; top:0px; }
.controls.index ul li div.long div.right div.middle div.image{ float:left; width:87px; margin-right:12px; position:relative; cursor:pointer; }
.controls.index ul li div.long div.right div.middle div.info{ background:url(../images/slideshow5/ul-li-info-bg.png) no-repeat left 3px; margin-top:6px; padding-left:18px; float:left; width:250px; padding-bottom:8px;}
.controls.index ul li div.long div.right div.middle div.info h2{ color:#210b40; font-size:120%; text-transform:uppercase; line-height:14px; float:left; width:100%; padding-bottom: 4px;}

.controls.index ul li.current div.long{width:275px; }
.controls.index ul li.current  div.long div.right div.middle div.info{ width:152px;}
.controls.index ul li.hett div.long{width:245px; }
.controls.index ul li.hett  div.long div.right div.middle div.info{  width:115px; }
.controls.index ul li.military div.long{width:308px; }
.controls.index ul li.military  div.long div.right div.middle div.info{  width:180px; }
.controls.index ul li.college div.long{width:365px; }
.controls.index ul li.college  div.long div.right div.middle div.info{  width:235px; }
.controls.index ul li.distinction div.long{width:305px; }
.controls.index ul li.distinction  div.long div.right div.middle div.info{  width:180px; }
.controls.index ul li div.long div.right div.middle div.info h2{ color:#210b40; font-size:120%; text-transform:uppercase; line-height:14px;  float:left; width:100%;}
.controls.index ul li div.long div.right div.middle div.info h2 a{color:#210b40; padding-bottom:2px; font-size: 90%;}
.controls.index ul li div.long div.right div.middle div.info span{ display:block; font-size:110%; color:#52237f; float:left; padding:1px 0; text-transform:uppercase;}
.controls.index ul li div.long div.right div.middle div.info span a{color:#52237f; padding-bottom:1px;}
.controls.index ul li div.long div.right div.middle div.info h2 a:hover{text-decoration:none; border-bottom:1px #52237f solid; padding-bottom:1px;}
.controls.index ul li div.long div.right div.middle div.info span a:hover{text-decoration:none; border-bottom:1px #52237f solid; padding-bottom:0px;}

/* Calendar Styles */
div.singleEvent {
	line-height: 1.3em;
}

/* Img Border Styles */
img.imgShadow { -moz-border-radius: 5px; border-radius: 5px; -moz-box-shadow: 0px 0px 5px #888; -webkit-box-shadow: 0px 0px 5px #888; box-shadow: 0px 0px 5px #888; }

/* Progress Bar */
div.progress-bar {
  background-color: whiteSmoke;
  border-radius: 2px;
  box-shadow: 0 2px 3px rgba(0, 0, 0, 0.25) inset;

  width: 715px;
  height: 10px;
  
  position: relative;
  display: block;
}
  
div.progress-bar > span {
  background-color: #53247F;
  border-radius: 2px;
	
  display: block;
  text-indent: -9999px;
}

/* Two Column Template in for 725px width */
#columnone {
  float: left;
  width: 357px;
}
#columntwo {
  float: left;
  width: 357px;
}


/* Three Column Template in for 725px width */
#columnonethree {
  float:left;
  width: 258px;
  text-align: center;
}
#columntwothree {
  float:left;
  width: 258px;
  text-align: center;
}
#columnthreethree {
  float:left;
  width: 258px;
  text-align: center;
}

/* Before and After Peel Back Image */
a.nowandthen{
position:relative;
display:inline-block;
overflow:hidden;
cursor: pointer;
width: 725px; /* set width of image container */
height: 150px; /* set height of image container */
}

a.nowandthen img{
position:absolute;
left:0;
top:0;
width: 300px;
height: 150px;
-moz-transition: all 0.5s ease; /* enable transition */
-webkit-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
-ms-transition: all 0.5s ease;
transition: all 0.5s ease;
z-index: 2;
clip: rect(0,300px,150px,0); /* clip values should be rect(0,image_width,image_height,0) */
}

a.nowandthen img:nth-of-type(2){ /* hide "after" image beneath "before" so it's initially out of view */
z-index: 1;
}

a.nowandthen:hover img:nth-of-type(1){ /* clip "before" image to reveal "after" */
clip: rect(0,0,150px,0); /* clip values should be rect(0,0,image_height,0) */
opacity: 0;
}

a.nowandthen.alt{
width: 300px; /* set width of image container */
height: 150px; /* set height of image container */
}

a.nowandthen.alt img{
clip: rect(0,300px,150px,0); /* clip values should be rect(0,image_width,image_height,0) */
}

a.nowandthen.alt:hover img:nth-of-type(1){
clip: rect(0,0,150px,0); /* clip values should be rect(0,0,image_height,0) */
}

/* Image 3D Flip */
div.flip{
position:relative;
width: 300px; /* Set default width of flip */
height: 150px; /* Set default height */
-webkit-perspective: 600px; /* larger the value, the less pronounced the 3D effect */
-moz-perspective: 600px;
-o-perspective: 600px;
perspective: 600px;
}


div.flip div.rotate{
width: 100%;
height: 100%;
-moz-transform-style: preserve-3d; /* Specify all child elements inside this DIV maintain the same perspective */
-webkit-transform-style: preserve-3d;
-o-transform-style: preserve-3d;
transform-style: preserve-3d;
-moz-transition: all 0.6s ease-in-out 0.3s; /* final 0.3s specifies delay before effect kicks in */
-webkit-transition: all 0.6s ease-in-out 0.3s;
-o-transition: all 0.6s ease-in-out 0.3s;
transition: all 0.6s ease-in-out 0.3s;
}

div.flip div.rotate > *{ /* Target all children elements */
position:absolute;
width: 100%;
height: 100%;
-moz-backface-visibility: hidden;
-webkit-backface-visibility: hidden;
-o-backface-visibility: hidden;
backface-visibility: hidden;
}

div.flip div.rotate > div{ /* Target all child DIVs */
-webkit-box-sizing: border-box; /* Specify that any border/ paddings do not add to the DIV's total width */
-moz-box-sizing: border-box;
box-sizing: border-box;
}

div.rotate.x *:nth-child(2){ /* X Axis rotate specific CSS. Rotate 2nd child DIV 180deg in the X axis */
-moz-transform: rotateX(180deg);
-webkit-transform: rotateX(180deg);
-o-transform: rotateX(180deg);
transform: rotateX(180deg);
}


div.flip:hover > div.rotate.x{ /* X Axis rotate specific CSS. Rotate div.rotate.x when mouse rolls over container */
-moz-transform: rotateX(180deg);
-webkit-transform: rotateX(180deg);
-o-transform: rotateX(180deg);
transform: rotateX(180deg);
}


div.rotate.y *:nth-child(2){ /* Y Axis rotate specific CSS. Rotate 2nd child DIV 180deg in the Y axis so it mirrors the first */
-moz-transform: rotateY(180deg);
-webkit-transform: rotateY(180deg);
-o-transform: rotateY(180deg);
transform: rotateY(180deg);
}


div.flip:hover > div.rotate.y{ /* Y Axis rotate specific CSS. Rotate div.rotate.y when mouse rolls over container */
-moz-transform: rotateY(180deg);
-webkit-transform: rotateY(180deg);
-o-transform: rotateY(180deg);
transform: rotateY(180deg);
}

/* CSS Popup Image Viewer */

a.popupthumbnail{
position: relative;
z-index: 0;
}

a.popupthumbnail:hover{
background-color: transparent;
z-index: 50;
}

a.popupthumbnail span{ /*CSS for enlarged image*/
position: absolute;
background-color: white;
padding: 5px;
left: -1000px;
border: 1px dashed gray;
visibility: hidden;
color: black;
text-decoration: none;
}

a.popupthumbnail span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 2px;
}

a.popupthumbnail:hover span{ /*CSS for enlarged image on hover*/
visibility: visible;
top: 0;
left: 60px; /*position where enlarged image should offset horizontally */
-moz-transition: all 0.5s ease; /* enable transition */
-webkit-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
-ms-transition: all 0.5s ease;
transition: all 0.5s ease;
}

/* Original Hover Effects with CSS3 */
.view {
    width: 340px;
    height: 227px;
    margin: 10px;
    float: right;
    border: 10px solid #fff;
    overflow: hidden;
    position: relative;
    text-align: center;
    box-shadow: 1px 1px 2px #e6e6e6;
    cursor: default;
    background: #fff url(../images/bgimg.jpg) no-repeat center center
}
.view .mask, .view .content {
    width: 340px;
    height: 227px;
    position: absolute;
    overflow: hidden;
    top: 0;
    left: 0
}
.view img {
    display: block;
    position: relative
}
.view h2 {
    text-transform: uppercase;
    color: #fff;
    text-align: center;
    position: relative;
    padding: 10px;
	font-size: 14px;
    background: rgba(0, 0, 0, 0.8);
    margin: 20px 0 0 0
}
.view p {
    font-family: Georgia, serif;
    font-style: italic;
    font-size: 12px;
    position: relative;
    color: #fff;
    padding: 10px 20px 20px;
    text-align: center
}
.view a.info {
    display: inline-block;
    text-decoration: none;
    padding: 7px 14px;
    background: #000;
    color: #fff;
    text-transform: uppercase;
    box-shadow: 0 0 1px #000
}
.view a.info:hover {
    box-shadow: 0 0 5px #000
}

/* Original Hover Effects with CSS3 - Example 1 */
.view-first img { 
    transition: all 0.2s linear;
}
.view-first .mask {
    opacity: 0;
    background-color: rgba(83,36,127, 0.7); 
    transition: all 0.4s ease-in-out;
	color: #fff;
}
.view-first h2 {
    transform: translateY(-100px);
    opacity: 0;
    transition: all 0.2s ease-in-out;
	font-size: 7px;
}
.view-first p { 
    transform: translateY(100px);
    opacity: 0;
	transition: all 0.2s linear;
}
.view-first a.info{
    opacity: 0;
	transition: all 0.2s ease-in-out;
}

.view-first:hover img { 
	transform: scale(1.1);
} 
.view-first:hover .mask { 
	opacity: 1;
}
.view-first:hover h2,
.view-first:hover p,
.view-first:hover a.info {
    opacity: 1;
	color: #fff;
    transform: translateY(0px);
}
.view-first:hover p {
    transition-delay: 0.1s;
}
.view-first:hover a.info {
    transition-delay: 0.2s;
}


/* Animated UL Background Effect */

ul.animatedbgul{
	margin: 0;
	padding: 0;
	list-style: none;
}

ul.animatedbgul li{
	width: 100%;
	clear:left; /* clear contents of inner span, which will be floated left */
	overflow: hidden; /* clear contents of inner span, which will be floated left */
}

ul.animatedbgul li span{
	display: block;
	float: left; /* cause width of each span to take up only as much space as needed */
	min-width: 0px; /* animated property. Explicit min-width defined so animation works. */
	margin-bottom: 5px;
	padding: 8px;
	color: #5d5d5d;
}

ul.animatedbgul li:hover span{
	color: #53247f;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#53247f+0,ffffff+100&0.2+0,0.5+100 */
background: -moz-linear-gradient(left, rgba(83,36,127,0.2) 0%, rgba(255,255,255,0.5) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, rgba(83,36,127,0.2) 0%,rgba(255,255,255,0.5) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, rgba(83,36,127,0.2) 0%,rgba(255,255,255,0.5) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3353247f', endColorstr='#80ffffff',GradientType=1 ); /* IE6-9 */
	border-left: 8px solid #53247f;
	min-width: 450px; /* animated property. Set to desired final length of background */
	-webkit-transition: all 0.3s ease-out;
	-moz-transition: all 0.3s ease-out;
	-o-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}


/* Reverse Animated UL Background Effect */

ul.animatedbgulreverse{
	margin: 0;
	padding: 0;
	list-style: none;
}

ul.animatedbgul li{
	width: 100%;
	clear:left; /* clear contents of inner span, which will be floated left */
	overflow: hidden; /* clear contents of inner span, which will be floated left */
}

ul.animatedbgul li span{
	color: #53247f;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#53247f+0,ffffff+100&0.2+0,0.5+100 */
background: -moz-linear-gradient(left, rgba(83,36,127,0.2) 0%, rgba(255,255,255,0.5) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, rgba(83,36,127,0.2) 0%,rgba(255,255,255,0.5) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, rgba(83,36,127,0.2) 0%,rgba(255,255,255,0.5) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3353247f', endColorstr='#80ffffff',GradientType=1 ); /* IE6-9 */
	border-left: 8px solid #53247f;
	min-width: 450px; /* animated property. Set to desired final length of background */
	-webkit-transition: all 0.3s ease-out;
	-moz-transition: all 0.3s ease-out;
	-o-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}

ul.animatedbgul li:hover span{
	display: block;
	float: left; /* cause width of each span to take up only as much space as needed */
	min-width: 0px; /* animated property. Explicit min-width defined so animation works. */
	margin-bottom: 5px;
	padding: 8px;
	color: #5d5d5d;
}

/* A simple crossfading slideshow made with CSS */

.css-slideshow{
  position: relative;
  max-width: 495px;
  height: 370px;
  margin: 5em auto .5em auto;
}
.css-slideshow figure{
  margin: 0;
  max-width: 495px;
  height: 370px;
  background: #000;
  position: absolute;
}
.css-slideshow img{
  box-shadow: 0 0 2px #666;
}
.css-slideshow figcaption{
  position: absolute;
  top: 0;
  color: #fff;
  background: rgba(0,0,0, .3);
  font-size: .8em;
  padding: 8px 12px;
  opacity: 0;
  transition: opacity .5s;
}
.css-slideshow:hover figure figcaption{
  transition: opacity .5s;
  opacity: 1;
}
.css-slideshow-attr{
  max-width: 495px;
  text-align: right;
  font-size: .7em;
  font-style: italic;
  margin:0 auto;
}
.css-slideshow-attr a{
  color: #666;
}
.css-slideshow figure{
  opacity:0;
}
figure:nth-child(1) {
  animation: xfade 48s 42s infinite;
}
figure:nth-child(2) {
  animation: xfade 48s 36s infinite;
}
figure:nth-child(3) {
  animation: xfade 48s 30s infinite;
}
figure:nth-child(4) {
  animation: xfade 48s 24s infinite;
}
figure:nth-child(5) {
  animation: xfade 48s 18s infinite;
}
figure:nth-child(6) {
  animation: xfade 48s 12s infinite;
}
figure:nth-child(7) {
  animation: xfade 48s 6s infinite;
}
figure:nth-child(8) {
  animation: xfade 48s 0s infinite;
}

@keyframes xfade{
  0%{
    opacity: 1;
  }
  10.5% {
    opacity: 1;
  }
  12.5%{
    opacity: 0;
  }
  98% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* CSS Only Responsive Carousel */

.css-carousel {
	width: 100%;
	height: 350px; /* Height of images */
	position: relative;
	overflow: hidden;
}
.css-carousel .css-img {
	max-width: 100%;
	position: absolute;
	left: 0;
	right: 0;
	opacity: 0;
	-webkit-animation: css-carousel-fade 30s linear infinite;
	-moz-animation: css-carousel-fade 30s linear infinite;
	-ms-animation: css-carousel-fade 30s linear infinite;
	animation: css-carousel-fade 30s linear infinite;
}
.css-carousel .css-img:nth-child(2) {
	-webkit-animation-delay: 5s;
	-moz-animation-delay: 5s;
	-ms-animation-delay: 5s;
	animation-delay: 5s;
}
.css-carousel .css-img:nth-child(3) {
	-webkit-animation-delay: 10s;
	-moz-animation-delay: 10s;
	-ms-animation-delay: 10s;
	animation-delay: 10s;
}
.css-carousel .css-img:nth-child(4) {
	-webkit-animation-delay: 15s;
	-moz-animation-delay: 15s;
	-ms-animation-delay: 15s;
	animation-delay: 15s;
}
.css-carousel .css-img:nth-child(5) {
	-webkit-animation-delay: 20s;
	-moz-animation-delay: 20s;
	-ms-animation-delay: 20s;
	animation-delay: 20s;
}
.css-carousel .css-img:nth-child(6) {
	-webkit-animation-delay: 25s;
	-moz-animation-delay: 25s;
	-ms-animation-delay: 25s;
	animation-delay: 25s;
}
@-webkit-keyframes css-carousel-fade {
    0%, 20%, 100% { opacity: 0; }
    5%, 15% { opacity: 1;}
}
@-moz-keyframes css-carousel-fade {
    0%, 20%, 100% { opacity: 0; }
    5%, 15% { opacity: 1;}
}
@-ms-keyframes css-carousel-fade {
    0%, 20%, 100% { opacity: 0; }
    5%, 15% { opacity: 1;}
}
@keyframes css-carousel-fade {
	0%, 20%, 100% { opacity: 0; }
	5%, 15% { opacity: 1;}
}


/* McKendree Purple for WYSIWYG Styles */

.mckpurplebold {
	color: #53247f;
	font-weight: bold;
}
.mckpurple {
	color: #53247f;
}

/* Accordian */

.accordion {
  background-color: #53247f;
  color: white;
  cursor: pointer;
  padding: 18px;
  width: 100%;
  border: none;
  text-align: left;
  outline: none;
  font-size: 15px;
  font-weight: bold;
  transition: 0.4s;
}

.active, .accordion:hover {
  background-color: #7b4fa5;
}

.accordion:after {
  content: '\002B';
  color: white;
  font-weight: bold;
  float: right;
  margin-left: 5px;
}

.active:after {
  content: "\2212";
}

.panel {
  padding: 0 18px;
  background-color: white;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.2s ease-out;
}