@charset "utf-8";
/* CSS Document */

body {
	text-align: center;
	margin: 30px 0;
	padding: 0;
	background: #E7EBF5 url(../graphics/bg.gif) repeat-x top;
	font-size: 75%;
	font-family: "Century Gothic", Arial, Tahoma, Verdana;
}

/* ------------------------------------------
				Content
--------------------------------------------*/
#WS-Content a {
	color: #000;
	border-bottom: 1px dotted #8D5789;
	text-decoration: none;
}
#WS-Content  a:hover {
	color: #8D5789;
	border-bottom: none;
}
#WS-Content h1 {
	margin: 0 0 15px 0;
	font-size: 180%;
	color: #8D5789;
	font-weight: bold;
}
#WS-Content h2 {
	font-size: 150%;
	color: #8A9DD0;
	font-weight: normal;
	margin-top: 0;
}
#WS-Content h3 {
	font-size: 130%;
	color: #000;
	font-weight: bold;
}
#WS-Content h4 {
	font-size: 110%;
	color: #8D5789;
	font-weight: bold;
}


#WS-Content hr {
	margin: 20px 0;
	border-top: 1px dotted #8D5789;
	border-right: 1px solid #FFF;
	border-bottom: 1px solid #FFF;
	border-left: 1px solid #FFF;
}

/* ------------------------------------------
				Wrapper
--------------------------------------------*/

#WS-Wrapper {
	text-align: left;
	width: 800px;
	margin: 0 auto;
	background: #FFF;
}

/* ------------------------------------------
				Container-Top
--------------------------------------------*/
#WS-Container-Top {
	padding: 20px;
	margin: 0;
}
#WS-Container-Top #WS-Telephone {
	float: right;
	width: 180px;
	text-align: right;
}

/* ------------------------------------------
				Container-Nav
--------------------------------------------*/
#WS-Container-Nav {
	margin: 0 6px;
	padding: 0;
	height: 30px;
	background: url(../graphics/website/nav-bg-black.gif) repeat-x;
}

/* ------------------------------------------
				Container-Banner
--------------------------------------------*/
#WS-Container-Banner {
	margin: 0 6px;
	padding: 0;
}

/* ------------------------------------------
				Container-Links
--------------------------------------------*/
#WS-Container-Links {
	margin: 0 6px;
	padding: 0;
	height: 30px;
	background: url(../graphics/website/nav-bg-purple.gif) repeat-x;
	font-size: 115%;
	text-align: center;
	font-weight: bold;
}
#WS-Container-Links ul {
	margin: 0;
	padding: 0 0 0 20px;
	list-style-type: none;
}
#WS-Container-Links ul li {
	padding: 0 32px;
	line-height: 28px;
	float: left;
	color: #FFF;
}
#WS-Container-Links ul li a {
	color: #FFF;
	text-decoration: none;
}
#WS-Container-Links ul li a:hover {
	color: #CCC;
}
/* ------------------------------------------
				Container-Content
--------------------------------------------*/
#WS-Container-Content {
	margin: 0 6px;
	padding: 20px 0;
	overflow: auto;
}
#WS-Container-Content #WS-Container-Content-Left {
	margin: 0 200px 0 0;
	padding: 0;
}
#WS-Container-Content #WS-Container-Content-Right {
	float: right;
	width: 200px;
}
#WS-Content {
	margin: 0 30px 0 20px;
	padding: 0;
	min-height: 350px;
}

/* ------------------------------------------
			Navigation Side Menu
--------------------------------------------*/
.NAV-Side-Menu {
	background: #D5DCEE url(../graphics/website/nav-side-menu-bg.gif) repeat-x top;
	padding: 15px 20px;
	margin: 0 0 10px 0;
	width: 150px;
}
.NAV-Side-Menu h3 {
	color: #8C5788;
	font-size: 135%;
	font-weight: bold;
	margin: 0 0 10px 0;
}
.NAV-Side-Menu ul {
	margin: 0 0 0 15px;
	padding: 0;
	list-style-position: outside;
	list-style-type: none;
	list-style-image: url(../graphics/website/icon-arrow.gif);
}
.NAV-Side-Menu ul li {
	margin: 0;
	padding: 5px 0;
}
.NAV-Side-Menu  ul li a {
	color: #000;
	text-decoration: none;
}
.NAV-Side-Menu  ul li a:hover {
	font-weight: bold;
}

/* ------------------------------------------
		  Navigation Side Banner
--------------------------------------------*/
.NAV-Side-Banner {
	background: #DDD url(../graphics/website/nav-side-banner-bg.gif) repeat-x top;
	padding: 15px 20px;
	margin: 0 0 10px 0;
	width: 150px;
}
.NAV-Side-Banner h3 {
	color: #8C5788;
	font-size: 135%;
	font-weight: bold;
	margin: 0 0 10px 0;
}
.NAV-Side-Banner h3 a {
	text-decoration: none;
	color: #8C5788;
	border: none;
}
.NAV-Side-Banner h3 a:hover {color: #000;
	border: none;}

.NAV-Side-Banner a {
	text-decoration: none;
	border-bottom: 1px dotted #8C5788;
	color: #000;
}
.NAV-Side-Banner a:hover {
	text-decoration: none;
	border-bottom: 1px dotted #000;}

/* ------------------------------------------
				Container-Footer
--------------------------------------------*/

#WS-Footer {
	text-align: left;
	width: 800px;
	margin: 50px auto 30px auto;
	font-size: 90%;
	color: #666;
}
#WS-Footer p {margin: 0 0 10px 0;}

#WS-Footer-Left {
	float: left;
	width: 200px;
	border-right: 1px dotted #666;
	min-height: 130px;
}
#WS-Footer-Center {
	margin: 0 220px 0 200px;
	min-height: 130px;
	padding: 0 50px;
}
#WS-Footer-Center a {color: #666; text-decoration: none; border-bottom: 1px dotted  #666;}
#WS-Footer-Center a:hover {border-bottom: none;}

#WS-Footer-Center-Left {
	margin: 0 125px 0 0;
}
#WS-Footer-Center-Right {
	float: right;
	width: 100px;
}

#WS-Footer-Right {
	float: right;
	width: 220px;
	border-left: 1px dotted #666;
	min-height: 130px;
	text-align: right;
}
#WS-Footer-Right img {margin: 0 0 0 10px;}

/* ------------------------------------------
				Slider CSS
--------------------------------------------*/

#s3slider {
   width: 788px; /* important to be same as image width */
   height: 250px; /* important to be same as image height */
   position: relative; /* important */
   overflow: hidden; /* important */
}

#s3sliderContent {
   width: 788px; /* important to be same as image width or wider */
   position: absolute; /* important */
   top: 0; /* important */
   margin: 0; /* important */
   padding: 0;
   list-style-type: none;
}

.s3sliderImage {
   float: left; /* important */
   position: relative; /* important */
   display: none; /* important */
}

.s3sliderImage span {
   position: absolute; /* important */
   background-color: #8D5789;
   filter: alpha(opacity=70); /* here you can set the opacity of box with text */
   -moz-opacity: 0.7; /* here you can set the opacity of box with text */
   -khtml-opacity: 0.7; /* here you can set the opacity of box with text */
   opacity: 0.7; /* here you can set the opacity of box with text */
   color: #FFF;
   display: none; /* important */

   /*
       if you put
       top: 0; -> the box with text will be shown at the top of the image
       if you put
       bottom: 0; -> the box with text will be shown at the bottom of the image
   */
}
.s3sliderImage span strong {
	font-size: 125%;
}

.clear {
   clear: both;
} 
.s3slider-top {
	top: 0;
	left: 0;
}
.s3slider-bottom {
	bottom: 0;
    left: 0;
}
.s3slider-left {
	bottom: 0;
    left: 0;
	width: 200px !important;
	height: 220px;
	padding: 20px;
}
.s3slider-right {
	right: 0;
	bottom: 0;
	width: 200px !important;
	height: 220px;
	padding: 20px;
}
