/* ---------------------------------------------------------- **Client Name** CSS Managed by: Blue State Digital Last Update: May 2009 TABLE OF CONTENT 01 - GLOBAL BROWSER RESET 02 - COMMON STYLE 03 - LAYOUT 04 - HOMEPAGE 05 - SUBPAGES 06 - FRAMEWORK 07 - UTILITY COLOR GUIDE (Main Site Colors and their Hex Codes) ---------------------------------------------------------- */ /* 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 ---------------------------------------------------------- */ body { } #blog, #wrappers, #pages { font-family: Arial, Helvetica, sans-serif; font-size: 0.8em; width: 960px; margin: 20px auto; } .base h1 { font-size: 2.4em; font-weight: bold; margin-bottom: 10px; } .base h2 { font-size: 2em; font-weight: bold; margin-bottom: 10px; } .base h3 { font-size: 1.6em; line-height: 3em; margin-bottom: 10px; } .base h4 { font-size: 1.2em; font-weight: bold; padding-bottom: 5px; } .base p { margin-bottom: 8px; line-height: 1.6em; } a { color: #000; text-decoration: none; } a:hover { } a:active { outline: none; } a:focus { -moz-outline-style: none; } blockquote { } .base ul, ol { } .base ul { } .base ol { } .base ul li, .base ol li { margin-bottom: 5px; } .base ul li { list-style: square; margin-left: 13px; } .base li ol { } .base li ul { } /* 03 =LAYOUT ---------------------------------------------------------- */ #header { background-image: url(/page/-/wrappers/header.png); background-repeat: no-repeat; } #header h1#banner a { display: block; width: 640px; float: left; height: 152px; text-indent: -9999px; } #nav { background-image: url(/page/-/wrappers/nav.png); background-repeat: no-repeat; height: 40px; position: relative; } #nav li { display: inline; list-style: none; position: absolute; } #nav li a { text-indent: -9999px; background-color: transparent; height: 40px; display: block; } #nav li a:hover { background-image: url(/page/-/wrappers/nav_hover.png); } #nav #navA { left: 28px; width: 190px; } #nav #navB { left: 218px; width: 205px; } #nav #navC { left: 423px; width: 167px; } #nav #navD { left: 590px; width: 240px; } #nav #navE { left: 830px; width: 118px; } #nav #navA a:hover { background-position: -28px 0px; } #nav #navB a:hover { background-position: -218px 0px; } #nav #navC a:hover { background-position: -423px 0px; } #nav #navD a:hover { background-position: -590px 0px; } #nav #navE a:hover { background-position: -830px 0px; } #main { background-color: #ffd620; background-image: url(/page/-/wrappers/content_bg.png); } #counter { margin-right: 10px; margin-top: 95px; height: 50px; overflow: hidden; float: right; display: inline; } #footer { background-image: url(/page/-/wrappers/footer.png); background-repeat: no-repeat; background-position: 460px 10px; background-color: #ffd620; padding: 20px 47px 35px 47px; text-indent: -9999px; } #content, #framework { width: 570px; float: left; padding-left: 47px; padding-top: 30px; margin-bottom: 20px; display: inline; } #sidebar { background-color: #ffa000; float: right; width: 300px; margin-right: 15px; display: inline; } #quicksignup { background-image: url(/page/-/wrappers/quicksignup.png); height: 137px; margin-bottom: 15px;} #quicksignup h4 { padding-top: 10px; height: 38px;text-indent: -9999px; } #quicksignup input { border: 0px; padding: 2px; } #quicksignup #input_email { position: relative; top: 6px; left: 30px; width: 240px; } #quicksignup #input_postcode { position: relative; top: 8px; left: 30px; width: 190px; } #quicksignup #input_submit { width: 41px; height: 18px; position: relative; left: 35px; top: 15px; } .full-width #framework { width: 860px; margin-top: 0px; } /* 04 =HOMEPAGE ---------------------------------------------------------- */ /* 05 =SUBPAGES ---------------------------------------------------------- */ /* 06 =FRAMEWORK ---------------------------------------------------------- */ #body form#invitationpage { font-size: 1.2em; } #body form#invitationpage #body { padding: 5px; } form#invitationpage input.text {border: 1px solid #a7a7a7; padding: 5px; font: 12px Helvetica, Arial, sans-serif; color: #666; margin-top: 4px;} form#invitationpage textarea { border: 1px solid #a7a7a7; padding: 5px; font: 12px Helvetica, Arial, sans-serif; color: #666; margin-top: 4px;} form#invitationpage label { vertical-align: middle; text-transform: uppercase; font-size: 11px; } #signup {width: 425px; margin: 0px; font-size: 1.2em; padding-top: 0px;} #signup .text { border: 1px solid #a7a7a7; padding: 5px; font: 12px Helvetica, Arial, sans-serif; color: #666; margin-top: 4px;} #signup select { margin-top: 4px; font-size: 14px; } #signup td {padding-top: 0px;} #signup .input_email {width: 415px;} #signup .input_firstname {width: 190px;margin-right: 11px;} #signup .input_lastname {width: 200px;} #signup .input_addr1 {width: 415px;} #signup .input_addr2 {width: 415px; } #signup .input_city {width: 210px} #signup .input_zip {width: 115px; } #signup .select_country {width: 175px; margin-right: 15px;} #signup .input_phone {width: 178px; margin-right: 8px;} #signup #submit {text-align: left; margin-bottom: 5px; padding-bottom: 15px; } #signup span.error { font-size: 11px; text-transform: uppercase; } #signup input.submit {margin-top: 15px; color: #FFF; background-color: #000; padding: 5px; border: 1px solid #999; font-weight: bold; font-size: 14px; } #signup input.checkbox, #signup input.radiobutton {margin: 5px 5px; vertical-align: middle;} #signup label { vertical-align: middle; font-size: 14px; } #signup textarea {width: 415px; border: 1px solid #a7a7a7; padding: 5px; font: 12px Helvetica, Arial, sans-serif; color: #666; margin-top: 4px;} #signup span { display: inline;} #signup td#required_note { font-size: 0.7em; } #contribution .fieldlabel { text-transform: uppercase; font-size: 11px; padding-top: 10px; display: block; } #contribution #payment_options { display: none; } #contribution .amounts input { margin-right: 5px; } #contribution .contribheader { padding-bottom: 4px; text-transform: uppercase; } #contribution #processbutton { margin-bottom: 20px; padding: 5px; border: 1px solid #000; text-transform: uppercase; margin-top: 5px; } /* 07 =UTILITY ---------------------------------------------------------- */ .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;}