/* ---------------------------------------------------------- NELPC CSS Managed by: Blue State Digital TABLE OF CONTENT 01 - GLOBAL BROWSER RESET 02 - COMMON STYLE 03 - LAYOUT 04 - HOMEPAGE 05 - SUBPAGES 06 - FRAMEWORK 07 - UTILITY 08 - TABLES COLOR GUIDE (Main Site Colors and their Hex Codes) darker blue: #0076a3 ---------------------------------------------------------- */ /* 01 =GLOBAL BROWSER RESET ---------------------------------------------------------- */ /* YUI Reset version: 2.7.0 */ html { color: #000; background: #FFF; } body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td { margin: 0; padding: 0; } table { border-collapse: collapse; border-spacing: 0; } fieldset,img { border: 0; } address,caption,cite,code,dfn,em,strong,th,var,optgroup { font-style: inherit; font-weight: inherit; } del,ins { text-decoration: none; } li { list-style: none; } caption, th { text-align: left; } h1,h2,h3,h4,h5,h6 { font-size: 100%; font-weight: normal; } q:before, q:after { content: ''; } abbr,acronym { border: 0; font-variant: normal; } sup { vertical-align: baseline; } sub { vertical-align: baseline; } /*because legend doesn't inherit in IE */ legend { color: #000; } input,button,textarea,select,optgroup,option { font-family: inherit; font-size: inherit; font-style: inherit; font-weight: inherit; } /*@purpose To enable resizing for IE */ /*@branch For IE6-Win, IE7-Win */ input,button,textarea,select { *font-size: 100%; } /* 02 =COMMON STYLE ---------------------------------------------------------- */ html { font-family: Arial, Helvetica, sans-serif; font-size: 13px; } body { } h1, h2, h3, h4 { font-weight: bold; color: #c60001; } #wrap { width: 1000px; margin: auto; } .base h1 { font-size: 21px; margin: 20px 0; } .base h2 { font-size: 18px; margin: 15px 0; } .base h3 { font-size: 16px; margin: 10px 0; } .base h4 { } .base h5 { } .base h6 { } .base p { line-height: 1.4; font-size: 13px; margin: 12px 0; } .base li { } .base table { } a:link, a:visited { color: #0076a3; } a:active, a:hover, a:focus { } .base blockquote { } .base ul, ol { font-size:13px; padding:0 0 0 20px; } .base ul, .base ol { margin:10px 0; } .base ul li { padding:0 0 0 5px; list-style-type:disc; margin:0 0 5px; } .base ol li { list-style-type:decimal; margin:0 0 5px; } .base li ol { padding:0 0 0 40px; } .base li ul { } a img { border: none; } /* 03 =LAYOUT ---------------------------------------------------------- */ #head { padding-bottom: 5px; background: url(/page/-/rtmw/img/dot_hrz.gif) 0 100% repeat-x; height: 142px; } #head a { display: block; float: left; width: 365px; } #head-wrap { float: left; width: 635px; } #signup-wrap { background: #cbe3ed; padding: 13px; margin-bottom: 58px; overflow: hidden; background-image: -webkit-gradient( linear, left top, right top, color-stop(0, rgb(255,255,255)), color-stop(0.35, rgb(203,227,237)) ); background-image: -moz-linear-gradient( left center, rgb(255,255,255) 0%, rgb(203,227,237) 35% ); } #signup-wrap form { float: right; } #signup-wrap input { width: 220px; padding: 2px; color: #444; } #signup-wrap label { text-transform: uppercase; margin-right: 15px; } #signup-wrap button { background: url(/page/-/rtmw/img/join.gif) no-repeat; height: 21px; width: 60px; border: 0; cursor: pointer; text-indent: -9999px; } #tagline { text-align: right; color: #0076a3; font-size: 14px; text-transform: uppercase; } #tagline span { color: #c60001; } #nav { height: 25px; margin: 20px 0; font-weight: bold; } #nav a { text-decoration: none; color: black; text-transform: uppercase; display: inline-block; padding: 4px 7px; letter-spacing: 1px; } #nav a:hover, #nav .level1 li:hover>a { background: #b00000; color: white; } .level1 { float: left; } .level1 li { float: left; padding: 1px 5px; border-right: 2px solid #c20000; position: relative; } .level1 .last { border-right: none; padding-right: 0; } .level1 ul { display: none; background-color: #daebf2; min-width: 96%; position: absolute; z-index: 15; } .level1 li:hover ul { display: block;} .level1 li li { float: none; padding: 0; border-right: 0; border-bottom: 2px solid #0076a3; padding: 2px 3px; font-size: 11px; } #nav .level1 li li:hover a { background: none; } #nav .level1 li li:hover { background: #0076a3; } #nav-search { float: right; } #nav-search #search { border: 0; padding: 5px; -webkit-box-shadow: inset 1px 2px 3px rgba(0,0,0,0.2); background: #fefefe; height: 17px;} #nav-search input.gsc-search-button { border: none; background-color: black; cursor: pointer; height: 25px; width: 25px; background: url(/page/-/rtmw/img/search.png) 50% 50%; text-indent: -99999px; position: relative; left: -4px; } #main { } #nav-search .cse form.gsc-search-box, #nav-search form.gsc-search-box {padding: 0; width: 220px;} #nav-search input.gsc-input {height: 17px;} #page { width: 770px; float: left; } #side { width: 205px; float: right; background: url(/page/-/rtmw/img/dot_vrt.gif) repeat-y; padding-left: 25px; min-height: 435px; } #side h2 a, #blog-side h2 a { float: right; } #side #news, #side #facts, #side #section, #side #social, #blog-side #news, #blog-side #facts, #blog-side #section, #blog-side #social { border-bottom: 3px solid #d3e7f0; padding-bottom: 25px; margin-top: 20px; } #side #social, #blog-side #social { border-bottom: 0; margin-top: 20px } #side #section, #blog-side #section { margin-top: 0px; } #social a:hover { opacity: .70;} #news ul { padding-left: 30px; margin-bottom: 20px; } #news li { list-style: disc outside url(/page/-/rtmw/img/arrow_bullet.gif); margin-bottom: 15px; } #news li p { color: #858f92; font-size: 12px; font-weight: bold; margin: 8px 0; } #news li a { color: #c60001; font-size: 15px; line-height: 1.3; font-weight: bold; } #news h2 a { float: right; } #facts h3 { font-size: 48px; position: relative; } #facts h3 span { background: url(/page/-/rtmw/img/gradient-white.png) repeat-x; position: absolute; display: block; width: 100%; height: 31px; } #side #section h3 { text-align: center; padding-bottom: 12px; border-bottom: 3px solid #cbe5f0; color: #c60001; font-size: 20px; text-transform: uppercase;} #section ul { } #section li { list-style: url(/page/-/rtmw/img/arrow_bullet.gif) inside; padding: 6px 10px; } #section li:hover { background: #cbe3ed; list-style-image: url(/page/-/rtmw/img/arrow_bullet_active.gif); } #section li a { color: black; text-decoration: none; text-transform: uppercase; font-weight: bold; font-size: 15px; } #foot { margin-top: 35px; background: url(/page/-/rtmw/img/dot_hrz.gif) repeat-x 0 0; padding-top: 25px; } #foot ul { float: left; } #foot ul li { float: left; padding: 0 20px; } #foot li a { color: black; text-transform: uppercase; text-decoration: none; font-weight: bold; } #foot li a:hover { text-decoration: underline; } #foot .foot-logo { float: right; text-decoration: none; color: black; position: relative; top: -10px; } #foot .foot-logo img { vertical-align: middle; } #addr{ text-align: center; background: #cbe3ed; padding: 10px 0; margin-top: 10px; font-weight: bold; clear: both; } #news h2, #callout h2, #side h2, #blog-side h2 { color: #0076a3; font-size: 18px; margin-bottom: 25px; text-transform: uppercase; } .interior #page { width: 750px; } #page h1 { color: white; font-size: 25px; font-weight: bold; padding: 8px; background: #0076a3; margin-bottom: 20px; } /* 04 =HOMEPAGE ---------------------------------------------------------- */ #hero { margin-bottom: 30px; } .jcarousel-container { margin-bottom: 50px; height: 310px; overflow: hidden; background: white } #hero li { cursor: pointer; position: relative; background: white } #hero img { padding: 15px; background: white; border: white; border-width: 50px } #hero h3 { position: absolute; bottom: 30px; padding: 20px; background: white; background: rgba(0,0,0,.75); left: 50px; width: 480px; } #hero h3 a { text-decoration: none; color: white; font-size: 22px; } .hero-button { cursor: pointer; display: inline-block; height: 310px; width: 45px; background: white; color: #0076a3; position: absolute; top: 0; z-index: 30; line-height: 310px; text-align: center; } .hero-button.prev { left: 0; } .hero-button.next { right: 0; } #home #news { width: 345px; margin-right: 10px; float: left; padding-right: 10px; min-height: 340px; } #callout { float: left; width: 330px; min-height: 370px; background: url(/page/-/rtmw/img/dot_vrt.gif) repeat-y; float: right; padding-right: 25px; padding-left: 25px;} #callout h2 { color: black; text-transform: capitalize; font-size: 20px; font-weight: bold; } #callout p { margin-bottom: 10px; } /* 05 =SUBPAGES ---------------------------------------------------------- */ #blog .page-content, #entry { width: 72%; float: left; } #blog a, #blog-entry a { text-decoration: none; } #blog a span, #blog-entry a span { font-size: 20px; } .featured-post img { float: left; padding: 20px 20px 20px 0px; } .featured-post p { padding-top: 20px; font-size: 18px; line-height: 1.4; } .featured-title { font-size: 32px; margin-bottom: 10px; } .featured-post .entry_date { font-size: 16px; line-height: 1.4; } .blog-post, .archive-post { margin-top: 15px; padding-top: 15px; border-top: 1px solid #ccc; clear: both; } .blog-post p { font-size: 14px; line-height: 1.4; } .post-title, .archive-title { font-size: 28px; margin-bottom: 10px; text-decoration: none; } .entry_date { font-size: 14px; line-height: 1.4; margin-bottom: 10px; text-transform: uppercase; } #blog-side { width: 25%; float: right; } .blog-content { width: 72%; float: left; } .blog-content .entry_date { margin-bottom: 0px } .blog-title { font-size: 28px; line-height: 1.4; margin-bottom: 10px; } .blog-author { font-size: 13px; line-height: 1.4; margin-bottom: 10px; text-transform: uppercase; } .page-content p { line-height: 1.4; font-size: 14px; margin-bottom: 10px; margin-top: 5px } .archive-post:first-child { border-top: none; } .paginate { font-size: 20px; margin-top: 20px; text-align: center; clear: both; } .paginate a { text-decoration: none; } #email { width: 100%; margin-bottom: 5px; } #breadcrumb { margin-bottom: 20px; font-size: 95%; color: #7a7a7a;} .share { float: right; margin: 10px; } .share .social-icon { padding: 0px 0px 0px 0px; margin-right: 10px; } /*.social-share.facebook { text-indent: -999px; background: url(http://campaign.nelp.org/page/-/img/fb.png/@mx_20@my_20) no-repeat; background-position: 0px 0px; display: inline-block; width: 20px; } .social-share.twitter { text-indent: -999px; background: url(http://campaign.nelp.org/page/-/img/twitter.png/@mx_20@my_20) no-repeat; background-position: 0px 0px; display: inline-block; width: 20px; } @-moz-document url-prefix() { span.facebook.ss-icon.ss-social-regular { text-indent: -999px; background: url(http://campaign.nelp.org/page/-/img/fb.png/@mx_20@my_20) no-repeat; background-position: 0px 0px; display: inline-block; width: 20px; } span.twitter.ss-icon.ss-social-regular { text-indent: -999px; background: url(http://campaign.nelp.org/page/-/img/twitter.png/@mx_20@my_20) no-repeat; background-position: 0px 0px; display: inline-block; width: 20px; } }*/ #blog-entry .share { float: none; margin: 10px 0px; } #disqus_thread { border-top: 1px solid #ccc; clear: both; padding-top: 25px; margin-top: 75px; } #blog-branding, #side-branding { margin: 20px 0px; } #blog .read-more { float: left; } /* 06 =FRAMEWORK ---------------------------------------------------------- */ /* 07 =UTILITY ---------------------------------------------------------- */ .clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } .cufon-loading .cufon { visibility: hidden !important; } .stretcher { clear: both; height: 1px; visibility: hidden; } .nomargin { margin-bottom: 0px; } .floatl { float: left; margin: 0; padding: 0 10px 10px 0; } .floatr { float: right; margin: 0; padding: 0 0 10px 10px; } .floatl-nomargin { float: left; margin: 0; padding: 0; } .floatr-nomargin { float: right; margin: 0; padding: 0; } .clear { clear:both; height:0; margin:0; font-size: 1px; line-height: 0; } .required { color: red; } i, em { font-style: italic; } b, strong { font-weight: bold; } sup, sub { height: 0; line-height: 1; vertical-align: baseline; _vertical-align: bottom; position: relative;} sup { bottom: 1ex; } sub { top: .5ex; } .clearfix:after { content:"."; display:block; height:0; clear:both; visibility:hidden; } .clearfix {display:inline-block;} .clearfix {display:block;} .more{ float: right; display: inline-block; background: url(more.gif); height: 21px; width: 66px; text-indent: -9999px; } /* #hero, .jcarousel-clip { overflow: visible !important; } .jcarousel-container { padding-left: 180px; overflow: hidden; } .jcarousel-wrap {margin-bottom: 50px;} .jcarousel-skin-tango {overflow: hidden; height: 334px;} .jcarousel-skin-tango .jcarousel-container { width: 1000px; padding: 0px; background: #f2f2f2; overflow: hidden; position: relative; } .jcarousel-skin-tango .jcarousel-clip-horizontal { width: 1485px; height: 334px; position: relative; left: -25%; } .jcarousel-skin-tango .jcarousel-item { width: 475px; height: 314px; } .jcarousel-skin-tango .jcarousel-item-horizontal { margin-left: 0; margin-right: 20px; } .jcarousel-skin-tango .jcarousel-item-placeholder { background: #fff; color: #000; } */ #hero, .jcarousel-clip { overflow: visible !important; } .jcarousel-container { padding-left: 180px; overflow: hidden; } .jcarousel-wrap {margin-bottom: 50px;} .jcarousel-skin-tango {overflow: hidden; height: 334px;} .jcarousel-skin-tango .jcarousel-container { width: 1000px; padding: 0px; background: #000; overflow: hidden; position: relative; } .jcarousel-skin-tango .jcarousel-clip-horizontal { width: 1485px; height: 334px; position: relative; left: -89%; } .jcarousel-skin-tango .jcarousel-item { width: 910px; height: 314px; } .jcarousel-skin-tango .jcarousel-item-horizontal { margin-left: 0; margin-right: 20px; } .jcarousel-skin-tango .jcarousel-item-placeholder { background: #fff; color: #000; } /* 08 =TABLES ---------------------------------------------------------- */ table.sortable th:not(.sorttable_sorted):not(.sorttable_sorted_reverse):after { content: " \25B4\25BE" }