@import "reset.css";
@import "typography.css";


/*---------------------------------------------------------- LAYOUT ----------------------------------------- */

.aligncenter { display:block; margin:0 auto }
.alignleft { float:left }
.alignright { float:right }
.wp-caption { border:1px solid #666; text-align:center; background:#ccc; padding:10px; margin:10px }

br.clear { clear:both; display:block; height:1px; margin:-1px 0 0 0 }

body { background: #f7f7f7 url(../images/body_bg.jpg) repeat-x left top; }

html, body { height: 100%; }

#wrapper { background: url(../images/wrapper_bg.jpg) no-repeat center top; height: 100%; min-height: 100%; }

#main { width: 940px; background: url(../images/main_bg.png) repeat-y; min-height: 100%; height: auto !important; height: 100%; margin: 0 auto; }
#main-content{ padding: 0 20px; }
#home-content { padding: 20px; }

#wrapper-home { width: 860px; margin: 0 auto -130px auto; height: 100%; min-height: 100%; height: auto !important; }

ul#btns { overflow: hidden; margin: 20px 0 10px 0; height: 120px; width: 710px; float: left; }
ul#btns li { display: inline; margin: 0 5px 0 0; float: left; position: relative; }
ul#btns li#last { margin: 0; }
ul#btns li:last-child { margin: 0; }
ul#btns li a { width: 230px; height: 53px; display: block; background: url(../images/home_btnbg.jpg) no-repeat right top; }
ul#btns li a:hover {  height: 110px; background: #82939f url(../images/home_btnbg_hover.jpg) no-repeat right top; text-decoration: none; }
ul#btns li a h3 { color: black; position: absolute; top: 15px; left: 15px; }
ul#btns li a:hover h3 { color: white; }
ul#btns li a p { color: white; position: absolute; top: 53px; left: 10px; }
ul#btns li a:hover p {  position: absolute; top: 53px; left: 10px; }




.bucket { padding: 10px; border: 1px solid #dedede; margin: 0 0 10px 0; }
.thumb, .image { float: left; margin: 0 10px 0 3px; }
.thumb { padding: 4px; border: 1px solid #dedede; }

.content { padding: 10px; overflow: hidden; }
.content-10 { padding: 10px; overflow: hidden; }
.content-20 { padding: 20px; overflow: hidden; }

#page-overview-right ul, #page-right ul { margin: 0 0 10px 20px; }
#page-right ul ul li { list-style-type: circle; }
#page-overview-right ul li, #page-right ul li { list-style: disc; margin: 0 0 3px 0; }

a:active, a, a:focus { outline: none; border: 0 none; }
:-moz-any-link:focus { outline: none; }


/*---------------------------------------------------------- TABLES ----------------------------------------- */

td { vertical-align: top; padding: 3px 5px; border: 1px solid #eee; }

table { margin: 0 0 10px 0; }

/*---------------------------------------------------------- FORMS ----------------------------------------- */

input#submit { background: #798a9a; border: 1px solid #274664; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; padding: 3px 10px; color: white; }
input#submit:hover { background: #274664; cursor: pointer; }

textarea#comment { margin: 0 0 10px 0; }

/*---------------------------------------------------------- TYPE ----------------------------------------- */

* { font-family: Trebuchet, Tahoma, Arial, sans-serif; font-size: 12px; }
a { text-decoration: none; color: #004a88; }
a:hover { color: black; text-decoration: underline; }

p { margin: 0 0 10px 0; }
p.intro { font-size: 14px; color: #32628c; }

h2, h3, h3 a, h4 { font-family: Futura, "Century Gothic", "Apple Gothic", sans-serif; color: #cc3333; font-weight: normal; }
h2 { font-size: 24px; margin: 10px 0 20px 0; padding: 0 0 5px 0; border-bottom: 1px solid #eaeaea; }
h3, h3 a { font-size: 18px; margin: 0 0 10px 0;  }
h4 { font-size: 14px; }

hr { clear: both; border: 0 none; border-bottom: 1px solid #dedede; margin: 20px 0; }
hr.ten { margin: 10px 0; }

.red { font-weight: bold; color: #cc3333; }

h3.show-hide {  }

small { font-size: 10px; color: gray; }

p.rule { clear: both; border-top: 1px solid #dedede; padding: 5px 0 0 0; }

#contact-bar span.tip { font-family: Futura, "Century Gothic", "Apple Gothic", sans-serif; color: #cc3333; font-size: 14px; margin: 5px 10px; line-height: 25px;  }
#contact-bar span#contact-bar-title { margin: 0; line-height: 25px; font-size: 10px; color: gray; }

a.btn { background: #768999; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; padding: 3px 10px; color: white; }
a.btn:hover { background: #60778a; }


/*---------------------------------------------------------- HEADER ----------------------------------------- */

#header { background: url(../images/header_bg_2.jpg) no-repeat right top; height: 90px; z-index: 2; position: relative; }
#header-top { height: 90px; position: relative; }
#header-logo { float: left; }

#nav-top { height: 28px; position: absolute; top: 40px; right: 10px; }
#nav-top * { font-size: 10px; }
#nav-top span { float: right; margin: 2px 0 0 0; }

#nav-main-wrap { background: url(../images/header_nav_bg.jpg) no-repeat; height: 42px; }
ul#nav-main { float: left; z-index: 1; position: relative; }
ul#nav-main li { display: inline; float: left; position: relative; background: url(../images/nav_sep.jpg) no-repeat right bottom; }
ul#nav-main li:hover { background-color: #82949f; }
ul#nav-main li a { display: block; padding: 0 20px; height: 42px; line-height: 42px; font-family: Futura, "Century Gothic", "Apple Gothic", sans-serif; font-size: 16px; color: white; float: left;  }
ul#nav-main li a:hover { text-decoration: none; }
ul#nav-main li ul { display: block; left:-9999px; top:42px; position: absolute; overflow: hidden; width: 200px; border: 1px solid #dbdbdb; border-top: 0 none; box-shadow: 0px 3px 3px #bbb; -moz-box-shadow: 0px 3px 3px #bbb; -webkit-box-shadow: 0px 3px 3px #bbb; }
ul#nav-main li ul li { float: none; width: 100%; display: list-item; border-top: 1px solid white; background: #82949f; }
ul#nav-main li ul li:hover { background-color: #adbec8; }
ul#nav-main li ul li a {  width: auto; height: auto; line-height: normal; display:block; padding: 5px; font-family: Trebuchet, Tahoma, Arial, sans-serif; font-size: 11px; color: white; float: none;  }
ul#nav-main li ul li a:hover { color: black; text-decoration: none; background-color: transparent; }
 
ul#nav-main li:hover ul { left: 0px; background: #DADADA;}

ul#nav-main li.current_page_ancestor { background-color: #82949f; }

#home-flash { width: 860px; height: 300px; }

#search-header { float: right; margin: 0 0 0 10px; display: inline; }

#contact-bar { background: url(../images/contactbar_bg.jpg) no-repeat right top; float: right; position: absolute; top: 0px; right: 0px; z-index: 1; width: 600px; }
#contact-bar ul { float: right; }

#contact-bar ul li ul { position: absolute; left: -9999px; top: 30px; width: 180px; border: 1px solid #dfdfdf; border-bottom: 0 none; }
#contact-bar ul li { display: block; float: right; position: relative; height: 25px; padding: 0 10px; margin: 0; border-left: 1px solid white; }
#contact-bar ul li img { margin: 5px 0 0 0; }
#contact-bar ul li a { }
#contact-bar ul li a:hover { background-color: #e8eaec; }
#contact-bar ul li a img { margin: 5px 0 0 0; }
#contact-bar span { margin: 5px 10px; text-decoration: none; }
#contact-bar a.hover-btn span.tip { text-decoration: none; }


#contact-bar ul li:hover ul, ul#contact-bar-list li.over ul { left: 0px; top: 25px; }

a.hover-btn { display: block; margin: 0; padding: 0; }

#page-left h3 { margin: 0; }

/*------------------------------------------------- FOOTER --------------------------------------------------------------------------*/

.push { height: 100px; clear: both; }

#footer-wrap { clear: both; height: 100px; padding: 20px 0 0 0; background: url(../images/footer_bg.png) repeat-x; margin: -120px 0 0 0; }
#footer { width: 900px; margin: 0 auto; height: 100px; position: relative; }
ul#footer-nav { position: absolute; left: 20px; top: 20px; margin: 0; }
ul#footer-nav li { display: inline; margin: 0 10px 0 0; }
ul#footer-nav li a {font-size: 10px; }

#footer span { font-size: 10px; }
#footer span a { font-size: 10px; }
#footer span a:hover { color: gray; text-decoration: none; }
#footer-wsm { position: absolute; top: 45px; left: 20px;  }
#footer-copy { position: absolute; top: 65px; left: 20px; }


/*---------------------------------------------------------- PAGE ----------------------------------------- */


.menu-arrow { width: 11px; height: 11px; background: url(../images/leftnav_arrow.jpg) no-repeat; position: absolute; top: 4px; left: 0px; cursor: pointer; }
.menu-arrow.active { background-position: left bottom; }

#breadcrumbs-wrap { width: 800px; float: left; }
#breadcrumbs { border-bottom: 1px solid #eaeaea; color: #82939f; padding: 0 0 0 10px; font-size: 10px; height: 30px; min-height: 30px; }
#breadcrumbs a, #breadcrumbs strong { line-height: 30px; font-size: 10px; font-weight: normal; color: gray; padding: 0 5px; }
#breadcrumbs a:hover { color: black; }

#page-left { width: 180px; min-height: 400px !important; float: left; overflow: hidden; padding: 10px 0 0 0; background: url(../images/pageleft_bg.jpg) no-repeat right top; }
#page-left h4 { margin: 0 0 0 10px; }

#page-right { width: 720px; float: right; overflow: hidden; background: url(../images/pageright_bg.jpg) no-repeat; }

ul#sub-pages { margin: 0 0 0 10px; }
ul#sub-pages li.current_page_item, ul#overviews-pages li.current_page_item, ul#overviews-pages li.current_page_ancestor { background: #f5f5f5; padding: 5px 5px; }
ul#sub-pages li.current_page_item a, ul#overviews-pages li.current_page_item a, ul#overviews-pages li.current_page_ancestor a { color: black; }
ul#sub-pages li.current_page_item a:hover, ul#overviews-pages li.current_page_item a:hover { color: black; cursor: default; }
ul#sub-pages li, ul#overviews-pages li { margin: 3px 0; padding: 2px 0; position: relative; }
ul#sub-pages li a, ul#overviews-pages li a { font-size: 11px; display: inline-block; padding: 0 0 0 14px; }
ul#sub-pages li a:hover, ul#overviews-pages li a:hover { color: #990000; }
ul#sub-pages li ul { margin: 0 0 0 16px; }
ul#sub-pages li ul li { margin: 0; }
ul#sub-pages li ul li a { color: gray; font-size: 10px; padding: 0; }
ul#sub-pages li ul li a:hover { text-decoration: none; color: black; }

ul#lp-btns { overflow: hidden; margin: 20px 0 10px 0; height: 130px; }
ul#lp-btns li { display: inline; margin: 0 2px 0 0; float: left; position: relative; }
ul#lp-btns li#last { margin: 0; }
ul#lp-btns li:last-child { margin: 0; }
ul#lp-btns li a { width: 280px; height: 75px; display: block; background: url(../images/cclp_btnbg.jpg) no-repeat right top; }
ul#lp-btns li a:hover {  height: 130px; background: #82939f url(../images/cclp_btnbg_hover.jpg) no-repeat right top; text-decoration: none; }
ul#lp-btns li a h3 { color: black; position: absolute; top: 27px; left: 15px; }
ul#lp-btns li a h3#mcs { top: 15px; }
ul#lp-btns li a:hover h3 { color: white; }
ul#lp-btns li a p { color: white; position: absolute; top: 75px; left: 20px; }
ul#lp-btns li a:hover p { top: 65px; }

#page-resources { width: 150px; float: right; padding: 0 0 0 10px; margin: 0 0 0 10px; display: inline-block; border-left: 1px solid #dedede; }
ul#resource-list { margin: 0 0 10px 10px; }
ul#resource-list li { padding: 0 0 0 20px; margin: 0 0 10px 0; background: url(../images/resource_icon.jpg) no-repeat; list-style-type: none; }

a.page-btn { display: block; width: 300px; margin: 5px; padding: 20px; float: left; display: inline; color: black; background: #e8eaec url(../images/cclp_btnbg.jpg) no-repeat left bottom; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; font-size: 14px; }
a.page-btn:hover { text-decoration: none; color: white; background: #82939f url(../images/cclp_btnbg_hover.jpg) no-repeat left top; }
a.page-btn:hover h3 { color: white; }
a.page-btn h3 { color: black; margin: 3px 0 -5px 0; font-size: 20px; }

a.page-btn-drop { width: 215px; padding: 20px; margin: 5px; height: 75px; display: block; background: url(../images/cclp_btnbg.jpg) no-repeat right top; position: relative; float: left; }
a.page-btn-drop:hover {  height: 90px; background: #82939f url(../images/cclp_btnbg_hover.jpg) no-repeat right top; text-decoration: none; }
a.page-btn-drop h3 { color: black; position: absolute; top: 27px; left: 15px; }
a.page-btn-drop:hover h3 { color: white; }
a.page-btn-drop p { color: white; position: absolute; top: 75px; left: 20px; }
a.page-btn-drop:hover p { top: 65px; }

.page-image { position: relative; margin: 0 0 20px 0; overflow: hidden; }
.page-title { position: absolute; left: 0px; bottom: 0px;  background: transparent url(../images/page_title_bg.png) repeat; width: 700px; }
.page-title h2 { padding: 10px; margin: 0; display: block; border: 0 none; }

/*---------------------------------------------------------- CONTENT PAGE ----------------------------------------- */

ul#overviews-pages { margin: 0 0 0 10px; }

#page-overview-right { width: 550px; float: left;  }
#page-overview-right-right { width: 170px; float: right; }


ul#overview-pages { margin: 10px 0 15px 0; }
ul#overview-pages li { display: inline; border-left: 1px solid #dedede; padding: 0 10px 0 10px; margin: 0; }
ul#overview-pages li.current_page_item a { color: black; }
ul#overview-pages li a { font-size: 13px; }

#overviews-image { position: relative; min-height: 50px; }
#overview-title h2, #overview-title h3 { border: 0 none; margin: 10px 0 0 10px; }
#overview-title h3 { color: black; margin: 0 0 10px 10px; }

#overview-title { position: absolute; left: 0px; bottom: 0px; clear: both; width: 530px; background: transparent url(../images/page_title_bg.png) repeat; }

#page-overview-right .page-btn { width: 215px; }

/*---------------------------------------------------------- TOOLBAR/CONTACT-BAR ----------------------------------------- */

ul#toolbar { float: right; z-index: 999; }
ul#toolbar li { display: inline-block; height: 30px; float: left; position: relative; }
ul#toolbar li:hover { background-position: left bottom; }
#tb-share { width: 31px; background: url(../images/toolbar_sharebtn.jpg) no-repeat; }
#tb-print { width: 30px; background: url(../images/toolbar_printbtn.jpg) no-repeat; }
#tb-follow { width: 30px; background: url(../images/toolbar_followbtn.jpg) no-repeat; }
#tb-contact { width: 30px; background: url(../images/toolbar_contactbtn.jpg) no-repeat; }
a#tb-rss { width: 30px; height: 30px; display: block; background: url(../images/tb_rss.jpg) no-repeat; }
a#tb-rss:hover { background-position: left bottom; }

ul#toolbar li ul { position: absolute; left: -9999px; top: 30px; width: 180px; z-index: 9999; border: 1px solid #dfdfdf; border-bottom: 0 none; }
ul#toolbar li ul li, #contact-bar ul li ul li { display: list-item; float: none; background: white; border-bottom: 1px solid #dfdfdf; height: auto; width: auto; padding: 0; }
ul#toolbar li ul li a, #contact-bar ul li ul li a { display:block; width: 140px; height: 25px; line-height: 25px; padding: 0 0 0 10px; }
ul#toolbar li ul li a:hover, #contact-bar ul li ul li a:hover { background: white url(../images/dropdown_btnbg.jpg); }
ul#toolbar li#tb-share:hover ul { left: 0px; }
ul#toolbar li#tb-follow:hover ul { left: 0px; }
ul#toolbar li#tb-contact:hover ul { left: 0px; }

/*------------------------------------------------- HOME --------------------------------------------------------------------------*/

#home-news{ background: white url(../images/home-news-bg.jpg) repeat-x left bottom; overflow: hidden; padding: 10px; border-top: 1px solid #dedede; border-bottom: 1px solid #dedede; }
#home-news-left { float: left; width: 49%; }
#home-news-left td { padding: 5px 3px; border: 0 none; }
#home-news-right { float: right; width: 49%; background: #82939f; color: white; }
#home-news-right img { border: 1px solid white; margin: 0 10px 3px 0; }
#home-news-right a { color: white; text-decoration: underline; }
#home-news-right a:hover { color: black; }
h3#news-h3 { border-bottom: 1px solid #dedede; margin: 0; display: inline; border: 0 none; }
h3#news-h3 a { font-size: 16px; }
h3#news-h3 a:hover { text-decoration: none; }
#home-newsletters { width: 47%; float: right; }
span.date { color: #999999; }

ul#home-news-right-list { position: relative; height: 85px; }
ul#home-news-right-list li { display: block; height: 85px; width: 392px; position: absolute; left: 0px; top: 0px; }

a.rss-btn { padding: 0 0 0 20px; background: url(../images/rss_icon.jpg) no-repeat; }

#home-ad{ width: 48%; float: right; padding: 0 0 0 10px; }

#quick-links { width: 140px; height: 53px; background: url(../images/quicklinks_bg.jpg) no-repeat; float: right; margin: 20px 0 0 0; position: relative; }
#quick-links ul { position: absolute; top: 24px; left: -9999px; background: white; z-index: 99; min-width: 138px; border-left: 1px solid #dedede; border-right: 1px solid #dedede; box-shadow: 0px 3px 3px #bbb; -moz-box-shadow: 0px 3px 3px #bbb; -webkit-box-shadow: 0px 3px 3px #bbb; }
#quick-links ul li { border-bottom: 1px solid #dedede; }
#quick-links ul li:hover { background: url(../images/dropdown_btnbg.jpg) repeat-x left bottom; }
#quick-links ul li a { padding: 3px 10px; display: block; background: transparent url(../images/nav_arrow_blue.gif) no-repeat right center; font-size: 11px; }
span#quick-links-select { display: block; width: 140px; height: 24px; background: url(../images/quicklinks_select.jpg) no-repeat; position: absolute; bottom: 0px; left: 0px; line-height: 24px; }
span#quick-links-select:hover { background-position: right bottom; }
span#quick-links-select:hover ul{ left: 0px; }


/*------------------------------------------------- LANDING PAGES --------------------------------------------------------------------------*/

#lp-wrap { width: 850px; margin: 0 auto; padding: 0 0 20px 0; }
.lp-bucket { width: 850px; height: 300px; margin: 20px 0 0 0; position: relative; }
.lp-bucket-text { position: absolute; left: 20px; top: 20px; width: 500px; }
.lp-bucket-text h2 { border: 0 none; margin: 0 0 15px 0; padding: 0; }
.lp-bucket-text h4 { color: black; }
#lp-bg44 { background: url(../images/lp/bucket_bg_cc.jpg); }



ul#resources li { margin: 0 0 5px 0; line-height: normal; }
ul#resources li a, ul#resources li { font-size: 10px; }


/*------------------------------------------------- RESOURCES-LP --------------------------------------------------------------------------*/

a.resources-lpbtn { display: block; width: 315px; padding: 15px 10px; background: #d3d3d3 url(../images/home_btnbg.jpg) no-repeat right top;  }
a.resources-lpbtn h3 { margin: 0; color: black; }
a.resources-lpbtn:hover {  background: #82939f url(../images/home_btnbg_hover.jpg) no-repeat right top; text-decoration: none; }
a.resources-lpbtn:hover h3 { color: white; }


/*---------------------------------------------------------- LIST SUBPAGES / LIST VIDEOS----------------------------------------- */

.content-show-hide {  }
.content-intro { overflow: hidden; }
.content-full {  }
.show { height: auto; }
.hide { height: 1px; overflow: hidden; position: absolute; left: -9999px; }
.hide-show-table td { border: 0 none; padding: 0; }

span.more-btn { display: block; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; padding: 3px 15px 3px 10px; background: #f0f0f0 url(../images/more-arrow.gif) no-repeat right center;  }

h3.video { background: url(../images/h3_video_bg.jpg) no-repeat; padding: 0 0 0 25px; }

#video-reqs-content { visibility: hidden; }
#video-reqs-content { visibility: collapse; }
#video-reqs:hover .more-btn { visibility: collapse; height: 0px; }
#video-reqs:hover #video-reqs-content { visibility: visible; }


/*-------------------------------------------------  NEWS --------------------------------------------------------------------------*/

.post { padding: 10px; border: 1px solid #dedede; margin: 0 0 10px 0; background: #f6f8fa; }
.post-header { border-bottom: 1px solid #dedede; margin: 0 0 10px 0; }
.post-header h3 { display: inline; }

a#feedback { display: block; height: 17px; line-height: 17px; padding: 0 0 0 25px; background: url(../images/feedback_btnbg.jpg) no-repeat; position: absolute; right: 0px; top: 30px; }
a#feedback:hover { background-position: left bottom; }

.post-footer { border-top: 1px solid #dedede; padding: 5px 10px; background: white; width: 100%; margin: 0 0 -10px -10px; }

a.more-link { margin: 10px 0 0 0; }

li.cat-item { margin: 3px 0; }

.result { padding: 10px; border: 1px solid #dedede; margin: 0 0 10px 0; background: white; }
.result h3 { margin: 0 0 5px 0; }
.result h3 a { text-decoration: underline; }

/*-------------------------------------------------  COMMENTS --------------------------------------------------------------------------*/

li.comment { border-bottom: 1px solid #dedede; margin: 10px 0; }


/*-------------------------------------------------  ORDER FORM --------------------------------------------------------------------------*/

table#order-form {  }
table#order-form td { text-align: right; vertical-align: top; }

a.page-btn-orderform-ca { display: block; width: 300px; margin: 5px; padding: 20px; float: left; display: inline; color: black; background: #e8eaec url(../images/orderformbtn_ca_bg.jpg) no-repeat left top; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; font-size: 14px; }
a.page-btn-orderform-ca:hover { text-decoration: none; color: #CC3333; }
a.page-btn-orderform-ca:hover h3 { text-decoration: none; color: black; }

a.page-btn-orderform-us { display: block; width: 300px; margin: 5px; padding: 20px; float: left; display: inline; color: black; background: #e8eaec url(../images/orderformbtn_us_bg.jpg) no-repeat left top; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; font-size: 14px; }
a.page-btn-orderform-us:hover { text-decoration: none; color: #CC3333; }
a.page-btn-orderform-us:hover h3 { color: black; }