/* ©2010 Bam Creative Title : style.css Author : NAME | Bam Creative Description : Main Stylesheet */ /* GLOBAL SETTINGS------------------------------------- GLOBAL SETTINGS */ html { } body { color: #7f7f7f; font-family: Arial, Helvetica, sans-serif; font-size: 0.845em; } /*-- this controls the tinymce area --*/ .mceContentBody { background-image: none; background-color: #fff; } .home #content { text-align:center; } p.welcome { font-family: "museo-sans", Arial; font-size:1.3em; color:#7f7f7f; padding-bottom:0px; margin-bottom:0px; } .fclass { background:#262626; border-top:3px solid #dfcd37; min-height:180px; height:auto !important; height:180px; margin-top:30px; } .search{ margin-top:-9px; padding:5px 8px 5px 8px; margin-left:4px; } .background { background-size:100%; height:140px; height:257px; margin-bottom:2%; position:absolute; width:100%; z-index:-1; overflow:hidden; top:0; left:0; } body.home .background { height:565px; } .background img{ width:100%; } .home-banners ul { margin:0; padding:0; overflow:visible !important; height:430px; width:100%; } .home-banners ul li { margin:0; padding:0; list-style:none; overflow-x: visible; overflow-y:hidden; width:100%; } .home-banners img{ width:100%; } .slide { padding-top:50px; position:relative; margin:0 auto; margin-top:23px; margin-bottom:112px; height:325px; overflow:hidden; } .slide img{ width:100%; } #home-slider{ display:none; } .warning { } #lhc { float:right; } .snav{ float:right; width:100%; } /* LINKS -------------------------------------------------------- LINKS */ a { color:#a50c3e; } a:hover { color:#926e8c; text-decoration:underline; } /* HEADINGS -------------------------------------------------- HEADINGS */ h1, h2, h3, h4, h5, h6 { font-weight: normal; margin: 0; font-family: "museo-sans", Arial; padding: 0; letter-spacing:-1px; } h2, h3, h4, h5, h6 { padding-top:0.2em; padding-bottom:0em; } h1 { font-size: 2.9em; color:#313131; letter-spacing:-2px; padding-bottom:0.2em; } h2 { font-size: 1.8em; } h3 { font-size: 1.4em; font-weight: 300; line-height:normal; } h4 { font-size: 1.3em; line-height: 1.2em; font-weight: 100; } h5 { font-size: 1.2em; font-weight: bold; padding-bottom: 0.2em; } h6 { font-size: 1em; font-weight: bold; padding-bottom: 0.2em; } /* PARAGRAPHS ---------------------------------------------- PARAGRAPHS */ p { font-size: 100%; line-height: 1.6em; padding:0.3em 0 0.75em 0; } /* LISTS -------------------------------------------------------- LISTS */ #content ul, #content ol, .mceContentBody ul, .mceContentBody ol { padding:0 0 1.25em 2.5em; } body#tinymce li { font-size: 100%; line-height: 1.6em; } body#tinymce ol li { list-style: decimal; } #content ul li, .mceContentBody ul li { font-size: 100%; line-height: 1.6em; list-style:disc; } #content ol li, .mceContentBody ol li { font-size: 100%; line-height: 1.6em; } /*-- nested lists --*/ #content ul ul, body#tinymce ul ul { padding: 0 0 0 1.5em; } #content ol ol, body#tinymce ol ol { padding: 0 0 0 1.5em; } /* LAYOUT ------------------------------------------------------ LAYOUT */ body.substyle #container { padding-top:285px; } #container { width:990px; margin: 0 auto; position: relative; } #header { } #content { margin-bottom:0px; } #page-content { /* all bamCMS content goes inside here: shouldn't need styling really */ } #footer { color:#7f7f7f; font-size:0.9em; } a.twitter { background:url(../../art/twitter.gif) no-repeat right; width:52px; height:46px; display:block; text-indent:-9999em; float:right; margin-right:10px; } a.twitter:hover { background-position:left; } ul#twitter_update_list { list-style-type:none; } ul.twitter_update_list li { } #content-edit { text-align:left; } p.nospace { margin:0px; padding:0px; } .category p.nospace, .product p.nospace { margin:0px; padding:0px; } img.pdf { vertical-align:baseline; float:left; margin-right:3px; margin-left:3px; margin-bottom:5px; height:32px; } .topspace { padding-top:14px; margin-bottom:5px; clear:both; } a.locate{ background:url(../../art/locate.png) no-repeat; width:36px; height:36px; display:block; float:right; position:fixed; top:66px; top:16px; right:20px; font-size:0.9em; padding-top:40px; color:#fff; } a.locate:hover{ background-position:right top; padding-top:40px; text-decoration:none; } .product .topspace h3 { padding-top:12px; color:#313131; } a.facetext { float:right; margin-right:1em; font-family: "museo-sans", Arial; color:#313131; font-size:1.3em; font-weight:500; letter-spacing:-1px; padding-top:2px; text-align:right; } a.facetext:hover { color:#885f82; text-decoration:none; } a.facetext span { color:#797474; font-weight:300; text-align:right; font-size:0.9em; } a.facebook { background:url(../../art/facebook.gif) no-repeat; height:42px; width:42px; display:block; text-indent:-9999em; float:right; } a.facebook:hover { background-position:right; } #footer p { line-height:1.3em; } #footer a { color:#fff; } #footerdetails { text-align:right; padding-top:10px; padding-right:15px; } .row-fluid.hr { height:1px; background:#fff; border-top:1px solid #e7e8e9; margin-bottom:30px; margin-top:20px; } .down { margin-bottom:6px; } a.product-image.downlast { margin-bottom:13px; } a.logo { background:url(/art/logox2.png) no-repeat; background : url(/art/logo.png)\9; /* IE8 and below */ max-width:172px; width:172px; float:left; margin-top:10px; margin-left:15px; background-size:172px 60px; z-index:150; height:60px; display:block; left:0px; top:4px; margin-right:25px; } .copyright { float: left; } .credits { float: right; padding-left:15px; padding-top:10px; } /* 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: 8px; text-align: center; line-height: normal; } table.custom-data-table th { background-color: #eee; font-size: 1em; font-weight: bold; height: 32px; line-height: normal; font-family:"museo-sans", Arial; } table.custom-data-table td { font-size: 12px; text-align: left; } table.custom-data-table td.right { text-align: right; } /* PAGINATION --------------------------------------------- PAGINATION */ div.pagination { text-align: right; vertical-align: middle; height: 24px; } div.pagination a.pagination-item { padding: 3px; border: 0px solid #ccc; color: #444; text-decoration: none; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; } div.pagination a.pagination-nextprev-item { background: none; } div.pagination a.pagination-item:hover { background: #E2EFD1; } div.pagination a.pagination-active-item { background: #eaeaea; font-weight: normal; color: #111; } div.pagination a.pagination-active-item:hover { background: #E2EFD1; } /* SEARCH ----------------------------------------------------- SEARCH */ form#searchform input.term { } form#searchform input.search { } /* MISC --------------------------------------------------------- MISC */ hr { background: #ccc;/*NS FF OP */ color: #ccc;/*IE*/ border: none;/*FF NS OP*/ height: 1px;/*FF NS OP*/ width: 100%; } .only-print { display: none; } /* FORMS -------------------------------------------------------- FORMS */ /* No generic form styling can 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 */ /* FORMHELP STYLING Every input is surrounded by a div with class "input" as well as a class representing the type of input. Eg. for a textarea - the div is class="input textarea". This behaviour can be overwritten. See Bam Wiki for more details. */ div.input { margin-bottom: 10px; } div.input input, div.input select { } div.input label { display: block; margin-bottom: 3px; } div.radio-option{ margin-left:15px; } div.radio-option input{ width:auto; float:none; margin:0; padding:0; } div.input label.radio_option, div.input label.checkbox_option { display: inline; margin:0 0 0 8px; font-weight:normal; } input.search { cursor:pointer; } input.calendar-input { padding: 4px 10px 4px 26px; background: url(/art/bamcms/common/calendar_input.png) no-repeat 4px 4px; border: 1px solid #ccc; } #ui-datepicker-div{display:none;} /*--------------------------------------------------------- BUTTONS */ .button, .button-inline, .button-mini { width: auto !important; font-family: Verdana, Arial, Helvetica, sans-serif; background: url(/art/bamcms/editscreen/btn-bg.gif) 0 0 repeat-x #d9d9d9; float: left; padding: 5px; font-size: 12px; font-weight: bold !important; margin-right: 4px; display: block; border: 1px solid #a8a8a8; border-bottom-color: #666; text-decoration: none; color: #333; cursor: pointer; margin-bottom: 4px; } .button-inline { float: none; display: inline; } .button-mini { padding: 3px; font-size: 10px; line-height: 14px; } #button-save, .button-save { background-image: url(/art/bamcms/editscreen/save-btn-bg.gif); padding-left: 22px; } #button-cancel, .button-cancel { background-image: url(/art/bamcms/editscreen/cancel-btn-bg.gif); padding-left: 22px; } #button-add, .button-add { background-image: url(/art/bamcms/editscreen/add-btn-bg.gif); padding-left: 24px; } #button-lock, .button-lock { background-image: url(/art/bamcms/editscreen/lock-btn-bg.gif); padding-left: 24px; } #button-unlock, .button-unlock { background-image: url(/art/bamcms/editscreen/unlock-btn-bg.gif); padding-left: 24px; } #button-disabled, .button-disabled { background-image: url(/art/bamcms/editscreen/disabled-btn-bg.gif); padding-left: 24px; color: #999999; cursor: default; } .underlay { background:url(/art/navbg.png) repeat; width:100%; height:80px; position:fixed; z-index:-1; height:89px; } /*------------------------------------------------------------Contact Form-----*/ .formhelp-form .input.text input, .formhelp-form textarea, .formhelp-form select { background-color:#f8f8f8; border:0; /* border-top:1px solid #eaeaea; border-left:1px solid #eaeaea; border-bottom:1px solid #eaeaea; border-right:1px solid #eaeaea;*/ border:1px solid #c5c3c3; padding:9px 5px; width:350px; font-size:1em; margin-right:5px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; outline-color:#63a0d9; margin-bottom:5px; font-size:14px; font-family:sans-serif; } #ContactForm .left { float:left; width:300px; } label span { font-size:0.9em; color:#666; } .formhelp-form input.submit { width:auto; margin-right: 169px; font-size:16px; letter-spacing:normal; background: #294c86; padding: 5px 22px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; cursor:pointer; letter-spacing:-1px; color:#fff; text-align:center; border:none; text-decoration:none; background-image: linear-gradient(bottom, #27477D 15%, #2F5899 100%); background-image: -o-linear-gradient(bottom, #27477D 15%, #2F5899 100%); background-image: -moz-linear-gradient(bottom, #27477D 15%, #2F5899 100%); background-image: -webkit-linear-gradient(bottom, #27477D 15%, #2F5899 100%); background-image: -ms-linear-gradient(bottom, #27477D 15%, #2F5899 100%); background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0.15, #27477D), color-stop(1, #2F5899) ); } .formhelp-form input.submit:hover { color:#fff; background:#969797; background-image: linear-gradient(bottom, #979898 15%, #BABBBB 100%); background-image: -o-linear-gradient(bottom, #979898 15%, #BABBBB 100%); background-image: -moz-linear-gradient(bottom, #979898 15%, #BABBBB 100%); background-image: -webkit-linear-gradient(bottom, #979898 15%, #BABBBB 100%); background-image: -ms-linear-gradient(bottom, #979898 15%, #BABBBB 100%); background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0.15, #979898), color-stop(1, #BABBBB) ); } /**************UberForm***************/ .formhelp-form .radio-option input, .formhelp-form .checkbox input { width:10px; } .formhelp-form .checkbox { overflow:auto; } .formhelp-form .checkbox input { float:left; display:block; } .formhelp-form .checkbox label { float:left; display:block; clear:both; } .formhelp-form .checkbox input#ContactFormSurveyOtherExplanation { clear:both; width:350px; } /*********************************************Additional Styles for form********************/ form.formhelp-form { padding-top:20px; } form.formhelp-form div.input textarea:focus, form.formhelp-form div.input input:focus { border: 1px solid #ccc; background:#fff; } div.input label.radio_option, div.input label.checkbox_option { display: inline; } .radio input, .checkbox input { width:10px; margin-right:0; margin-top:4px; } div.message-error { padding:6px 0; color:red; margin-top:-0.6em; } form.formhelp-form .error input { background:#fcfcfc; } .wf-loading { /* Hide the blog title and post titles while web fonts are loading */ visibility: hidden; } /* TABLE FOR db_log -------------------------------------- TABLE FOR db_log (DONT EDIT)*/ .db_log { width:960px; margin:2em auto; background: #f3f3f3; padding: 12px; border-radius: 10px; -moz-border-radius: 10px; } .db_log th { text-align:left; padding:0.2em; } .db_log td { padding:0.2em; } /* CUSTOM CLASSES -------------------------------------- CUSTOM CLASSES */ .clear { clear: both; } .float-right { float: right; } .float-left { float: left; } /* DROPDOWN NAV -------------------------------------- DROPDOWN NAV */ nav select { display: none; } @media (max-width: 768px) { .navbar { display: none; } .collapse-menu { display:block; } .normal-menu { display:block; } nav select { display: inline-block; margin-top:35px; margin-left:20px; } .slide { height:200px; } } @media (max-width: 480px) { .background { display: none; } nav select { margin-top:15px; margin-left:50px; } a.logo { margin-left:70px; } .slide { height:150px; margin-bottom:0px; } .underlay { height:125px; } body.substyle #container { padding-top:150px; } }