* {
    margin: 0;
    padding: 0;
}

html {
    min-height: 100%;
    margin-bottom: 1px;
}

body {
    margin: 0;
    padding: 0;
    font-size: 13px;
    font-family: "Trebuchet MS", sans-serif, Helvetica, sans-serif;
    /*
     text-shadow: rgb(110, 141, 153) 2px 2px 0px;
     */
}

p {
    line-height: 1.8;
    padding: 10px 0 0 0;
}

div.cleaner {
    clear: both;
    height: 0px;
    line-height: 0px;
    padding: 0;
    margin: 0;
}

a {
    color: #333;
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

input {
    border-right: 1px #DEDFE7 solid;
    border-left: 1px #E7E3EF solid;
    border-top: 1px #ADAEB5 solid;
    border-bottom: 1px #E7EBEF solid;
    background-color: #FFFFFF;
}

textarea {
    border-right: 1px #DEDFE7 solid;
    border-left: 1px #E7E3EF solid;
    border-top: 1px #ADAEB5 solid;
    border-bottom: 1px #E7EBEF solid;
    background-color: #FFFFFF;
}

h1 {
    margin: 10px 0 20px 0;
    padding: 0 0 0 0;
    color: #003399;
    font-size: 180%;
    font-weight: normal;
    font-family: 'Lucida Grande' 'Lucida Sans' Arial, Helvetica, sans-serif;
    /*
     text-shadow: rgb(110, 141, 153) 2px 2px 0px;
     */
}

h2 {
    margin: 0 0 10px 0;
    padding: 0 0 0 0;
    color: #003399;
    font-size: 150%;
}

h3 {
    margin: 0 0 10px 0;
    padding: 0 0 0 0;
    color: #003399;
    font-size: 120%;
}

h4 {
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    color: #003399;
    font-size: 120%;
}

h5 {
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    color: #2128B8;
    font-size: 150%;
}

div.slideshow ul li {
    float: left;
    list-style: none;
}

div.slideshow ul {
    position: absolute;
    overflow: hidden;
}

div.areaslist {
	
}
div.areaslist div{
	float:left; width:200px; text-align:left; 
}

div.areaslist h3{
	padding:20px 0 0 40px;
}
div.areaslist p{
	padding:0 0 20px 40px;
}

div.areaslist ul{
	padding:0 0 0 40px;
	list-style-type:none;
}

div.areaslist ul li{
	padding:2px 0 2px 0;
}




/* Box & Borders */
.border1-container {
    background: bottom left url(border1-bg.jpg) repeat-x;
    margin: 0 0 0 0;
}

.border1-top {
    background: top left url(border1-top.jpg) repeat-x;
}

.border1-right {
    background: bottom right url(border1-right.jpg) no-repeat;
}

.border1-bottom {
    background: bottom left url(border1-bottom.jpg) repeat-x;
}

.border1-left {
    background: bottom left url(border1-left.jpg) no-repeat;
}

.border1-top-left {
    background: top left url(border1-top-left.jpg) no-repeat;
}

.border1-top-right {
    background: top right url(border1-top-right.jpg) no-repeat;
}

.border1-bottom-right {
    background: bottom right url(border1-bottom-right.jpg) no-repeat;
}

.border1-bottom-left {
    background: bottom left url(border1-bottom-left.jpg) no-repeat;
}

.border1-padding {
    padding: 10px 10px 10px 10px;
}

.border1-body {
    padding: 5px 5px 5px 5px;
}

/* Custom Bullets */
ul.bullet-recycle {
    padding-left: 0;
    margin: 10px 0 0 0;
}

ul.bullet-recycle li {
    list-style: none;
    overflow: hidden;
    padding: 0 0 10px 20px;
    margin: 0 0 0 0;
}

ul.bullet-recycle li a {
    font-size: 120%;
}

ul.bullet-recycle li {
    background: url(../../images/typo/bullet-recycle.jpg) 0 2px no-repeat;
}

/* Default Typography Styles */
ul.bullet-1, ul.bullet-2, ul.bullet-3, ul.bullet-4, ul.bullet-5, ul.bullet-6, ul.bullet-7, ul.bullet-8 {
    padding-left: 15px;
    overflow: hidden;
    margin-left: 5px;
}

ul.bullet-1 li, ul.bullet-2 li, ul.bullet-3 li, ul.bullet-4 li, ul.bullet-5 li {
    list-style: none;
    padding-bottom: 3px;
    margin-bottom: 5px;
    padding-left: 10px;
}

ul.bullet-6 li, ul.bullet-7 li, ul.bullet-8 li {
    list-style: none;
    padding-bottom: 3px;
    margin-bottom: 5px;
    padding-left: 22px;
}

ul.bullet-1 li {
    background: url(../../images/typo/bullet-1.png) 0 5px no-repeat;
}

ul.bullet-2 li {
    background: url(../../images/typo/bullet-2.png) 0 5px no-repeat;
}

ul.bullet-3 li {
    background: url(../../images/typo/bullet-3.png) 0 5px no-repeat;
}

ul.bullet-4 li {
    background: url(../../images/typo/bullet-4.png) 0 5px no-repeat;
}

ul.bullet-5 li {
    background: url(../../images/typo/bullet-5.png) 0 5px no-repeat;
}

ul.bullet-6 li {
    background: url(../../images/typo/bullet-6.png) 0 2px no-repeat;
}

ul.bullet-7 li {
    background: url(../../images/typo/bullet-7.png) 0 2px no-repeat;
}

ul.bullet-8 li {
    background: url(../../images/typo/bullet-8.png) 0 3px no-repeat;
}

pre {
    padding: 10px;
    background: #f6f6f6;
    border-top: 1px solid #e5e5e5;
    border-right: 1px solid #e5e5e5;
    border-left: 1px solid #e5e5e5;
    border-bottom: 1px solid #e5e5e5;
}

blockquote {
    display: block;
    font-style: italic;
    font-size: 120%;
    line-height: 150%;
    width: auto;
    padding: 10px 20px 10px 20px;
    margin: 15px 0;
    background: #f6f6f6;
    border-top: 1px solid #e5e5e5;
    border-right: 1px solid #e5e5e5;
    border-left: 1px solid #e5e5e5;
    border-bottom: 1px solid #e5e5e5;
}

blockquote.blue, blockquote.red, blockquote.green, blockquote.purple, blockquote.orange, blockquote.brown, blockquote.grey {
    display: block;
    font-style: italic;
    font-size: 120%;
    line-height: 150%;
    width: auto;
    padding: 0px 20px;
    margin: 15px 0;
    border: 0;
    background: 0;
}

blockquote.blue {
    color: #0D507A;
}

blockquote.red {
    color: #D12E2E;
}

blockquote.green {
    color: #74A824;
}

blockquote.purple {
    color: #9E0E87;
}

blockquote.orange {
    color: #CC8300;
}

blockquote.brown {
    color: #8B6846;
}

blockquote.grey {
    color: #666;
}

blockquote.quotes {
    display: block;
    background: url(../../images/typo/quote-start.png) 0 5px no-repeat;
    padding: 0px 20px 0 38px;
    margin: 20px 0;
    font-size: 120%;
    line-height: 150%;
    width: auto;
    color: #666;
    border: 0;
}

blockquote.quotes p {
    padding: 0 38px 0 0;
    margin-top: 0;
    background: url(../../images/typo/quote-end.png) 100% 100% no-repeat;
}

.important, .important-blue, .important-red, .important-green, .important-purple, .important-orange, .important-brown, .important-grey {
    padding: 15px;
    margin: 15px 0;
}

span.important-title, span.important-title-blue, span.important-title-red, span.important-title-green, span.important-title-purple, span.important-title-orange, span.important-title-brown, span.important-title-grey {
    position: absolute;
    display: block;
    margin-top: -24px;
    background: #fff;
    padding: 0 8px;
    font-weight: bold;
    font-size: 120%;
}

.important {
    border: 1px solid #333;
}

.important-blue {
    border: 1px solid #2128B8;
}

.important-red {
    border: 1px solid #D12E2E;
}

.important-green {
    border: 1px solid #81BE32;
}

.important-purple {
    border: 1px solid #9E0E87;
}

.important-orange {
    border: 1px solid #CC8300;
}

.important-brown {
    border: 1px solid #8B6846;
}

.important-grey {
    border: 1px solid #666;
}

span.important-title {
    color: #333;
}

span.important-title-blue {
    color: #2128B8;
}

span.important-title-red {
    color: #D12E2E;
}

span.important-title-green {
    color: #81BE32;
}

span.important-title-purple {
    color: #9E0E87;
}

span.important-title-orange {
    color: #CC8300;
}

span.important-title-brown {
    color: #8B6846;
}

span.important-title-grey {
    color: #666;
}

span.number, span.number-blue, span.number-red, span.number-green, span.number-purple, span.number-orange, span.number-brown, span.number-grey {
    display: block;
    font-size: 170%;
    float: left;
    margin: 2px 10px 0 15px;
}

span.number {
    color: #333;
}

span.number-blue {
    color: #0D507A;
}

span.number-red {
    color: #D12E2E;
}

span.number-green {
    color: #74A824;
}

span.number-purple {
    color: #9E0E87;
}

span.number-orange {
    color: #CC8300;
}

span.number-brown {
    color: #8B6846;
}

span.number-grey {
    color: #666;
}

span.highlight {
    background: #FFFBD5;
    padding: 1px 2px;
}

span.highlight-blue {
    color: #0D507A;
}

span.highlight-red {
    color: #D12E2E;
}

span.highlight-green {
    color: #74A824;
}

span.highlight-purple {
    color: #9E0E87;
}

span.highlight-orange {
    color: #CC8300;
}

span.highlight-brown {
    color: #8B6846;
}

span.highlight-grey {
    color: #666;
}

span.highlight-bold {
    font-weight: bold;
    font-size: 120%;
}

span.dropcap, span.dropcap-blue, span.dropcap-red, span.dropcap-green, span.dropcap-purple, span.dropcap-orange, span.dropcap-brown, span.dropcap-grey {
    display: block;
    font-size: 260%;
    float: left;
    margin: 0px 4px 0 0;
    line-height: 100%;
}

span.dropcap {
    color: #333;
}

span.dropcap-blue {
    color: #0D507A;
}

span.dropcap-red {
    color: #D12E2E;
}

span.dropcap-green {
    color: #74A824;
}

span.dropcap-purple {
    color: #9E0E87;
}

span.dropcap-orange {
    color: #CC8300;
}

span.dropcap-brown {
    color: #8B6846;
}

span.dropcap-grey {
    color: #666;
}

span.inset-left {
    display: block;
    color: #000;
    padding: 15px;
    float: left;
    width: 20%;
    font-size: 110%;
    font-weight: bold;
    font-style: italic;
}

span.inset-right {
    display: block;
    color: #000;
    padding: 15px;
    float: right;
    width: 20%;
    font-size: 110%;
    font-weight: bold;
    font-style: italic;
}

span.attention, span.notice, span.alert, span.download, span.approved, span.media, span.note, span.cart, span.camera, span.doc {
    display: block;
    padding: 8px 10px 8px 36px;
    margin: 15px 0;
}

span.attention {
    color: #B79000;
    border: 1px solid #E7BD72;
    background: #FFF3A3 url(../../images/typo/attention.png) 10px 50% no-repeat;
}

span.notice {
    color: #648434;
    border: 1px solid #9BCC54;
    background: #CDEFA6 url(../../images/typo/notice.png) 10px 50% no-repeat;
}

span.alert {
    color: #CF3738;
    border: 1px solid #FFACAD;
    background: #FFD5D5 url(../../images/typo/alert.png) 10px 50% no-repeat;
}

span.download {
    color: #1C6B8B;
    border: 1px solid #6ABCE2;
    background: #A8CDE3 url(../../images/typo/download.png) 10px 50% no-repeat;
}

span.approved {
    color: #666;
    border: 1px solid #a8a8a8;
    background: #ccc url(../../images/typo/approved.png) 10px 50% no-repeat;
}

span.media {
    color: #C76E34;
    border: 1px solid #FFBB65;
    background: #FFE0B6 url(../../images/typo/media.png) 10px 50% no-repeat;
}

span.note {
    color: #B79000;
    border: 1px solid #E7BD72;
    background: #FFF3A3 url(../../images/typo/note.png) 10px 50% no-repeat;
}

span.cart {
    color: #666;
    border: 1px solid #C5C5C5;
    background: #E6E6E6 url(../../images/typo/cart.png) 10px 50% no-repeat;
}

span.camera {
    color: #666;
    border: 1px solid #C5C5C5;
    background: #E6E6E6 url(../../images/typo/camera.png) 10px 50% no-repeat;
}

span.doc {
    color: #C76E34;
    border: 1px solid #FFBB65;
    background: #FFE0B6 url(../../images/typo/doc.png) 10px 50% no-repeat;
}

/* Sliding Tabs */
#heading {
    display: block;
    text-align: left;
}

#heading * {
    display: inline;
    padding: 4px;
    user-select: none;
    cursor: pointer;
    vertical-align: middle;
}

#heading li.active {
    background-color: #ddd;
    color: #000;
}

#panes {
    text-align: justify;
    border-style: none;
    /*width: 245px;*/
    margin: 0 1em 0 1em;
    font-size: 120%;
}

#panes p {
    width: 600px;
    margin: 0 auto 1em auto;
    line-height: 1.2em;
}

#panes div div {
    overflow: hidden;
}

#previous {
    float: none;
    cursor: pointer;
}

#next {
    float: none;
    cursor: pointer;
}

/* SLIMBOX */
#lbOverlay {
    position: absolute;
    left: 0;
    width: 100%;
    background-color: #000;
    cursor: pointer;
}

#lbCenter, #lbBottomContainer {
    position: absolute;
    left: 50%;
    overflow: hidden;
    background-color: #fff;
}

.lbLoading {
    background: #fff url(../../includes/loading.gif) no-repeat center;
}

#lbImage {
    position: absolute;
    left: 0;
    top: 0;
    border: 10px solid #fff;
    background-repeat: no-repeat;
}

#lbPrevLink, #lbNextLink {
    display: block;
    position: absolute;
    top: 0;
    width: 50%;
    outline: none;
}

#lbPrevLink {
    left: 0;
}

#lbPrevLink:hover {
    background: transparent url(../../includes/prevlabel.gif) no-repeat 0% 15%;
}

#lbNextLink {
    right: 0;
}

#lbNextLink:hover {
    background: transparent url(../../includes/nextlabel.gif) no-repeat 100% 15%;
}

#lbBottom {
    font-family: Verdana, Arial, Geneva, Helvetica, sans-serif;
    font-size: 10px;
    color: #666;
    line-height: 1.4em;
    text-align: left;
    border: 10px solid #fff;
    border-top-style: none;
}

#lbCloseLink {
    display: block;
    float: right;
    width: 66px;
    height: 22px;
    background: transparent url(../../includes/closelabel.gif) no-repeat center;
    margin: 5px 0;
}

#lbCaption, #lbNumber {
    margin-right: 71px;
}

#lbCaption {
    font-weight: bold;
}

/* Accordion */
#accordion {
    margin: 20px 0px;
}

h3.toggler {
    cursor: pointer;
    border: 1px solid #f5f5f5;
    border-right-color: #ddd;
    border-bottom-color: #ddd;
    font-family: 'Andale Mono', sans-serif;
    font-size: 12px;
    background: #EDEDED;
    color: #528CE0;
    margin: 0 0 10px 0;
    padding: 3px 5px 1px;
}

div.element p, div.element h4 {
    margin: 0px;
    padding: 4px;
}

blockquote {
    padding: 5px 20px;
}

/*tooltip*/
.tip {
    width: 139px;
    font-family: tahoma, arial;
    background: url(../../includes/bubble.png) bottom right;
}

.tip-top {
    width: 139px;
}

.tip-title {
    color: #e95e25;
    font-weight: bold;
    padding: 5px;
    background: url(../../includes/bubble.png) top left;
    width: 139px;
}

.tip-text {
    color: #333;
    padding: 5px;
}

.tip-bottom {
}

/**
 Stylesheet: Slideshow.css
 CSS for Slideshow.
 
 License:
 MIT-style license.
 
 Copyright:
 Copyright (c) 2008 [Aeron Glemann](http://www.electricprism.com/aeron/).
 
 HTML:
 <div class="slideshow">
 <div class="images" />
 <div class="captions" />
 <div class="controller" />
 <div class="thumbnails" />
 </div>
 
 Notes:
 These next four rules are set by the Slideshow script.
 You can override any of them with the !important keyword but the slideshow probably will not work as intended.
 */
.slideshow {
    display: block;
    position: relative;
    z-index: 0;
}

.slideshow-images {
    display: block;
    overflow: hidden;
    position: relative;
}

.slideshow-images img {
    display: block;
    position: absolute;
    z-index: 1;
}

.slideshow-thumbnails {
    overflow: hidden;
}

/**
 HTML:
 <div class="slideshow-images">
 <img />
 <img />
 </div>
 
 Notes:
 The images div is where the slides are shown.
 Customize the visible / prev / next classes to effect the slideshow transitions: fading, wiping, etc.
 */
.slideshow-images {
    height: 210px;
    width: 770px;
}

.slideshow-images-visible {
    opacity: 1;
}

.slideshow-images-prev {
    opacity: 0;
}

.slideshow-images-next {
    opacity: 0;
}

.slideshow-images img {
    float: left;
    left: 0;
    top: 0;
}

/**
 Notes:
 These are examples of user-defined styles.
 Customize these classes to your usage of Slideshow.
 */
.slideshow {
    height: 210px;
    width: 770px;
}

.slideshow a img {
    border: 0;
}

/**
 HTML:
 <div class="slideshow-captions">
 ...
 </div>
 
 Notes:
 Customize the hidden / visible classes to affect the captions animation.
 */
.slideshow-captions {
    background: #000;
    bottom: 0;
    color: #FFF;
    font: normal 12px / 22px Arial, sans-serif;
    left: 0;
    overflow: hidden;
    position: absolute;
    text-indent: 10px;
    width: 100%;
    z-index: 10000;
}

.slideshow-captions-hidden {
    height: 0;
    opacity: 0;
}

.slideshow-captions-visible {
    height: 22px;
    opacity: .7;
}

/**
 HTML:
 <div class="slideshow-controller">
 <ul>
 <li class="first"><a /></li>
 <li class="prev"><a /></li>
 <li class="pause play"><a /></li>
 <li class="next"><a /></li>
 <li class="last"><a /></li>
 </ul>
 </div>
 
 Notes:
 Customize the hidden / visible classes to affect the controller animation.
 */
.slideshow-controller {
    background: url(controller.png) no-repeat;
    height: 42px;
    left: 50%;
    margin: -21px 0 0 -119px;
    overflow: hidden;
    position: absolute;
    top: 50%;
    width: 238px;
    z-index: 10000;
}

.slideshow-controller * {
    margin: 0;
    padding: 0;
}

.slideshow-controller-hidden {
    opacity: 0;
}

.slideshow-controller-visible {
    opacity: 1;
}

.slideshow-controller a {
    cursor: pointer;
    display: block;
    height: 18px;
    overflow: hidden;
    position: absolute;
    top: 12px;
}

.slideshow-controller a.active {
    background-position: 0 18px;
}

.slideshow-controller li {
    list-style: none;
}

.slideshow-controller li.first a {
    background-image: url(controller-first.gif);
    left: 33px;
    width: 19px;
}

.slideshow-controller li.last a {
    background-image: url(controller-last.gif);
    left: 186px;
    width: 19px;
}

.slideshow-controller li.next a {
    background-image: url(controller-next.gif);
    left: 145px;
    width: 28px;
}

.slideshow-controller li.pause a {
    background-image: url(controller-pause.gif);
    left: 109px;
    width: 20px;
}

.slideshow-controller li.play a {
    background-position: 20px 0;
}

.slideshow-controller li.play a.active {
    background-position: 20px 18px;
}

.slideshow-controller li.prev a {
    background-image: url(controller-prev.gif);
    left: 65px;
    width: 28px;
}

/**
 HTML:
 <div class="slideshow-loader" />
 
 Notes:
 Customize the hidden / visible classes to affect the loader animation.
 */
.slideshow-loader {
    height: 28px;
    right: 0;
    position: absolute;
    top: 0;
    width: 28px;
    z-index: 10001;
}

.slideshow-loader-hidden {
    opacity: 0;
}

.slideshow-loader-visible {
    opacity: 1;
}

/**
 HTML:
 <div class="slideshow-thumbnails">
 <ul>
 <li><a class="slideshow-thumbnails-active" /></li>
 <li><a class="slideshow-thumbnails-inactive" /></li>
 ...
 <li><a class="slideshow-thumbnails-inactive" /></li>
 </ul>
 </div>
 
 Notes:
 Customize the active / inactive classes to affect the thumbnails animation.
 Use the !important keyword to override FX without affecting performance.
 */
.slideshow-thumbnails {
    bottom: -65px;
    height: 65px;
    left: 0;
    position: absolute;
    width: 100%;
}

.slideshow-thumbnails * {
    margin: 0;
    padding: 0;
}

.slideshow-thumbnails ul {
    height: 65px;
    left: 0;
    position: absolute;
    top: 0;
    width: 10000px;
}

.slideshow-thumbnails li {
    float: left;
    list-style: none;
    margin: 5px 5px 5px 0;
    position: relative;
}

.slideshow-thumbnails a {
    display: block;
    padding: 5px;
    position: relative;
}

.slideshow-thumbnails a:hover {
    background-color: #FF9 !important;
    opacity: 1 !important;
}

.slideshow-thumbnails img {
    display: block;
}

.slideshow-thumbnails-active {
    background-color: #9FF;
    opacity: 1;
}

.slideshow-thumbnails-inactive {
    background-color: #FFF;
    opacity: .5;
}