/* (c) 2008 Bam Creative Title : style.css Author : Bam Creative Description : Stylesheet */ /* GLOBAL SETTINGS------------------------------------- GLOBAL SETTINGS */ html { } body { font-family: Arial, Helvetica, sans-serif; font-size: 0.9em; /* MASTER font-size controller */ color: #333; /* MASTER text colour controller */ } /*-- this controls the tinymce area --*/ .mceContentBody { background-image: none; background-color: #fff; } /* LINKS -------------------------------------------------------- LINKS */ a { color: #2178a4; text-decoration: underline; } a:hover { color: #fb572d; } #footer a { text-decoration: none; } /* home btns */ #homebtn_participants, #homebtn_instructors, #homebtn_aboutus { width: 267px; height: 275px; display: block; text-indent: -99999em; background: url(/art/homebtn_participants.jpg) 0 0 no-repeat; cursor: pointer; border: none; float: left; } #homebtn_participants { width: 263px; } #homebtn_instructors { background-image: url(/art/homebtn_instructors.jpg); } #homebtn_aboutus { background-image: url(/art/homebtn_aboutus.jpg); } a#homebtn_participants:hover, #homebtn_instructors:hover, #homebtn_aboutus:hover { background-position: 0 -275px; } /* HEADINGS -------------------------------------------------- HEADINGS */ h1, h2, h3, h4, h5, h6 { font-weight: normal; margin: 0; padding: 0; padding-bottom: 0.4em; } h1 { font-size: 2.1em; } h2 { font-size: 1.4em; font-weight: normal; } h3 { font-size: 1.25em; font-weight: 600; } h4 { font-size: 1.1em; font-weight: bold; padding-bottom: 0.3em; } h5 { font-size: 1em; font-weight: bold; padding-bottom: 0.2em; } h6 { font-size: 0.9em; font-weight: bold; padding-bottom: 0.2em; } /* PARAGRAPHS ---------------------------------------------- PARAGRAPHS */ p { font-size: 100%; line-height: 1.4em; padding: 0 0 1.25em 0; } /* LISTS -------------------------------------------------------- LISTS */ ul, ol { padding:0 0 1.25em 1.6em; } #content li, body#tinymce li { font-size: 100%; line-height: 1.6em; } #content ul li, body#tinymce ul li { list-style-type: none; background: url(/art/bullet.gif) 0 0.3em no-repeat; padding-left: 15px; } /*-- nested lists --*/ #content ul ul, body#tinymce ul ul { padding: 0 0 0 1.3em; } #content ol ol, body#tinymce ol ol { padding: 0 0 0 1.3em; } #footer ul { margin: 0 0 0 /*195*/88px; padding: 0; list-style-type: none; text-align: center; } #footer ul li { float: left; border-right: 1px solid #d3d3d3; padding: 0 10px 0 0; margin-right: 10px; } #footer ul li.end { border-right: none; } /* LAYOUT ------------------------------------------------------ LAYOUT */ #container { margin: 0 auto; position: relative; } #header { width: 100%; height: 188px; background: url(/art/header.jpg) bottom center no-repeat; } #loginbox { width: 234px; background: url(/art/loginbox_bg.png) 0 0 repeat-y; position: absolute; left: 564px; top: 0; } div#login_msg { position: absolute; right: 233px; top: 8px; padding: 10px 30px 10px 10px; width: 248px; height: 38px; background: url(/art/login_msg.png) 0 0 no-repeat; font-size: 90%; } #loginbox h3 a { font-size: 16px; display: block; width: 204px; height: 16px; padding: 5px 15px; background: url(/art/loginbox_arrow.png) 200px 5px no-repeat; cursor: pointer; } #loginbox h3 a { color: #d3f4ff; text-decoration: none; cursor: pointer; } #loginbox h3 a:hover { color: #fff; } #loginbox_content { position: relative; height: 90px; display: none; } #loginbox_content input#username, #loginbox_content input#password { background:transparent url(/art/login_input.gif) no-repeat 0 0; border: none; color: #fff; display:block; font-family:Arial,Helvetica,sans-serif; height: 20px; padding: 5px 10px; width: 182px; position: absolute; left: 15px; top: 10px; } #loginbox_content input#password { background-image: url(/art/login_inputsmall.gif); width: 125px; top: 45px; } #loginbox_content #login_btn { width: 52px; height: 30px; display: block; text-indent: -99999em; background: url(/art/login_btn.gif) 0 0 no-repeat; cursor: pointer; border: none; position: absolute; top: 45px; right: 14px; } #loginbox_content #login_btn:hover { background-position: 0 -30px; } #home_body #header { height: 230px; } #header_center { width: 800px; margin: 0 auto; position: relative; } #page { background: url(/art/page_top.jpg) top center no-repeat; width: 728px; padding: 50px 40px 60px 60px; margin: -34px auto 0 auto; min-height: 370px; height: auto !important; height: 370px; position: relative; z-index: 6; } #home_body #page { background: none; padding: 50px 0 60px; width: 800px; } .testimonial { background: url(/art/quotes.gif) 0 0 no-repeat; padding: 15px 0 0 45px; margin: 20px 0 0 -15px; font-size: 90%; } .testimonial h5 { text-align: right; font-weight: bold; color: #989898; } #content { width: 486px; float: left; display: inline; margin: 0 auto; } #home_body #content { width: auto; padding: 0 116px; min-height: 125px; height: auto !important; padding-top: 30px; height: 125px; } #home_body #content.wide { padding-left: 0 !important; padding-right: 0 !important; width: 100%; } #homebtns { width: 804px; margin: 0 auto; clear: both; } #side { float: right; display: inline; width: 205px; } #page-content { /* all bamCMS content goes inside here: shouldn't need styling really */ } #footer { width: 800px; height: 40px; margin: 0 auto; padding: 15px 0 0; background: url(/art/footer.jpg) top center no-repeat; text-align: center; /*font-size: 90%;*/ color: #999999; } #footer #facebookBtn, #footer #twitterBtn { text-indent:-999em; width:64px; height:14px; } a#facebookBtn { background:url(../art/facebook.gif) no-repeat 0 0; display:block; } a#twitterBtn { background:url(../art/twitter.gif) no-repeat 0 0; display:block; } a#facebookBtn:hover, a#twitterBtn:hover { background-position:0px -14px; } .copyright { float: left; } .credits { float: right; } /* MISC --------------------------------------------------------- MISC */ hr { background: #ccc;/*NS FF OP */ color: #ccc;/*IE*/ border: none;/*FF NS OP*/ height: 1px;/*FF NS OP*/ width: 100%; } .home_logo { position: absolute; display: block; top: 28px; left: 293px; } .internal_logo { position: absolute; display: block; top: 28px; left: 311px; } /* FORMS -------------------------------------------------------- FORMS */ /* No generic form styling shall be applied here as it causes too many problems with Bamcms admin area. Instead, use classes or ids on forms to style. For more information refer to the CSS and XHTML Best Practices Manual */ /* TABLES ------------------------------------------------------ TABLES */ /*-- data table --*/ table.custom-data-table { border: 1px solid #ccc; border-bottom: none; border-right: none; width: 100%; } table.custom-data-table th, table.custom-data-table td { border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; padding: 4px; text-align: center; line-height: normal; } table.custom-data-table th{ background-color: #eee; font-size: 12px; font-weight: bold; height: 23px; color: #666; line-height: normal; } table.custom-data-table td { color: #676767; font-size: 12px; text-align: left; } table.custom-data-table td.right { text-align: right; } /* CUSTOM CLASSES -------------------------------------- CUSTOM CLASSES */ .clear { clear: both; } /* Any classes that start with the "custom-" prefix will automatically be made available in the TinyMCE Styles drop down menu. For example: .custom-red-text { color: #F00; } */ /* ARTICLES MODULE------------------------------------------ ARTICLES MODULE */ div.news-box { width: 200px; float: right; padding: 10px; border: 1px solid #ccc; } img.news-thumb { float: left; padding: 4px; border: 1px solid #eee; margin: 0 8px 8px 0; } div.news-item { border-bottom: 1px dashed #ccc; margin-bottom: 15px; } div.news-item h3 a { text-decoration: none; } div.article-category-heading { border-bottom: 1px dashed #ccc; margin-bottom: 20px; } div.article-thumbnail { float: left; margin: 0 9px 9px 0; } div.article-thumbnail img { border: 1px solid #eee; padding: 4px; } div.articles-paginator { background-color: #f1f1f1; padding: 3px 8px; border: 1px solid #ddd; width: auto; clear: both; margin-bottom: 10px; } div.article-listing { border-bottom: 1px dashed #ccc; padding-bottom: 8px; margin-bottom: 10px; } div.article-short-content { float: left; width: 480px; } div.articles-paginator p { padding: 0; } p.article-date { font-size: 90%; color: #999; padding-bottom: 0.8em; } div.article-image { float: right; margin: 0 0 10px 10px; } div.article-image img { border: 1px solid #eee; padding: 8px; } /* ARTICLES MODULE------------------------------------------ ARTICLES MODULE */ /* PROVIDERS MODULE------------------------------------------ PROVIDERS MODULE */ #providers-png{ margin-bottom:20px; } .provider-explanations h4{ color:#A9D34D; } .provider{ background:#efefef; background:#F3F3F3; margin:0 0 10px; padding:0; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; } .provider h3{ padding:2px 5px; line-height:25px; background:#067BBE; margin:0; color:#fff; text-shadow: 1px 2px 2px #01649E; } .provider h3 a{ display:block; color:#fff; text-decoration:none; padding-top:4px; padding-bottom:4px; padding-left:6px; text-transform:uppercase; } .provider h3:hover{ background:#4AB2D9; } .provider .items{ padding:10px; } .provider .line-item{ line-height:20px; } .provider .line-item .field{ float:left; width:150px; font-weight:bold; } .provider .line-item .value{ float:left; width:315px; } .clearfix:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; } .clearfix { display: inline-block; } html[xmlns] .clearfix { display: block; } * html .clearfix { height: 1%; } /* PROVIDERS MODULE------------------------------------------ PROVIDERS MODULE */ input.finder-submit, a.teir-finder{ margin-top:10px; -moz-box-shadow:inset 0px 1px 0px 0px #c1ed9c; -webkit-box-shadow:inset 0px 1px 0px 0px #c1ed9c; box-shadow:inset 0px 1px 0px 0px #c1ed9c; background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #9dce2c), color-stop(1, #8cb82b) ); background:-moz-linear-gradient( center top, #9dce2c 5%, #8cb82b 100% ); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#9dce2c', endColorstr='#8cb82b'); background-color:#9dce2c; -moz-border-radius:6px; -webkit-border-radius:6px; border-radius:6px; border:1px solid #83c41a; display:inline-block; color:#ffffff; font-family:arial; font-size:15px; font-weight:bold; padding:6px 24px; text-decoration:none; text-shadow:1px 1px 0px #689324; cursor:pointer; text-transform:uppercase; } a.teir-finder{ font-size:12px; padding:5px 15px; } input.finder-submit:hover, a.teir-finder:hover { background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #8cb82b), color-stop(1, #9dce2c) ); background:-moz-linear-gradient( center top, #8cb82b 5%, #9dce2c 100% ); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#8cb82b', endColorstr='#9dce2c'); background-color:#8cb82b; cursor:pointer; }input.finder-submit:active { position:relative; top:1px; }