/*------------------------------------------------------------------------------* * * * Project: Arbeta & Bo * * Last change: 17/05/08 [splitted the css into layout and typography, ne] * * * * [TABLE OF CONTENTS] * * * * 1. LAYOUT * * 2. TYPOGRAPHY * * 3. SECTION/PAGE SPECIFIC * * * *------------------------------------------------------------------------------*/ @import url("http://yui.yahooapis.com/2.5.0/build/reset/reset-min.css"); /*------------------------------------------------------------------------------*/ /*---------------------------* * 1. LAYOUT * *---------------------------*/ html { background:#ececec; } body { text-align:center; } #wrapper { width:850px; margin:0 auto 10px auto; text-align:left; } #logo { background:#ececec; width:840px; padding:20px 0 5px 0; text-align:right; } #menu { background:#ececec; width:840px; } #menu li { float:left; } #menu li a { float:left; margin-right:1px; text-align:center; padding-top:9px; background:url("../img/menu_item.gif") no-repeat; width:104px; height:21px; } #menu li a.active { background:url("../img/menu_item_over.gif") no-repeat; padding-top:4px; height:26px; } #container { background:url("../img/shadow_right.png") repeat-y top right; } #header { width:850px; height:240px; } #content { text-align:left; padding:0 0 20px 0; } #breadcrumbs { height:18px; padding:6px 0 0 30px; background:#f5f5f5; margin-right:10px; margin-bottom:20px; border-bottom:1px solid #ccc; } #page_title { width:666px; overflow:hidden; min-height:60px; padding-left:30px; border-right:1px solid #999; } #contestbanner { float:right; height:60px; margin:0 26px 30px 0; width:420px; background:#f5f5f5; } #left { width:200px; float:left; margin:0 10px 0 30px; display:inline; overflow:hidden; } #left li { background:url("../img/menu_bullet.gif") no-repeat 0 3px; padding-left:15px; margin-bottom:2px; } #left li.heading { background:none; padding-left:0; } #left li.spacing { background:none; height:30px; } #middle { width:420px; float:left; margin:0 0 0 10px; min-height:280px; height:auto !important; height:280px; border-right:1px solid #999; padding-right:26px; } #middle ul { margin-left:20px; } #middle ol { margin-left:30px; } #middle ul li { list-style-type:disc; margin-bottom:10px; } #middle ol li { list-style-type:decimal; margin-bottom:10px; } /* newsboxes on startpage --------------*/ #newsbox { border-top:1px solid #666; padding:10px 0 0 0; margin-bottom:20px; } #newsleft { float:left; width:210px; padding-bottom:3px; border-right:1px solid #666; } #newsright { float:left; width:209px; padding-bottom:3px; } .newscontent { padding:0 7px; } /* personporträtt --------------*/ #portratt #citat { width:420px; text-align:center; } #portratt { border-top:1px solid #999; padding-top:20px; } #portratt_detail { padding:0 0 20px; } #portratt_detail #text { padding-top:20px; } #middlewide { display:inline; float:left; width:666px; margin:0 10px 0 30px; border-right:1px solid #999; min-height:280px; height:auto !important; height:280px; } .maptext { width:635px; } #right { width:120px; float:right; margin:0 15px 0 5px; display:inline; } #shadow_bottom { width:850px; height:10px; background:url("../img/shadow_bottom.gif") no-repeat; } #footer { background:#b1b3b4; height:23px; text-align:center; } #footercontent { width:830px; margin:0 auto; } #footer ul { float:left; width:240px; padding-top:5px; } #footer li { display:inline; margin-right:15px; background:url("../img/footer_bullet.gif") 0 3px no-repeat; padding-left:15px; } #searchform { float:left; padding-top:8px; text-align:right; width:200px; padding-right:10px; } #searchfld { width:100px; } #searchbtn { font-weight:bold; height:18px; width:36px; } .addthis_toolbox { clear:both; float:right; padding:20px 0 0; } /*----------------------------* * 2. TYPOGRAPHY * *----------------------------*/ body { font:normal 11px verdana,arial,helvetica,sans-serif; text-align:center; } h1 { font:bold 15px arial,verdana,helvetica,sans-serif; margin:0 0 10px 0; color:#666; } /* Stor Rubrik (15px) */ h2 { font:bold 13px arial,verdana,helvetica,sans-serif; padding:6px 0 10px 0; color:#666; } /* Mellan Rubrik (13px) */ h3 { } /* Presentationrubrik (13px) */ .fakta { display:block; background:#f5f5f5; border:1px solid #ccc; padding:5px; } /* LemonStyle: Faktaruta */ .liten_knapp { width:100px; text-align:center; display:block; background:#f5f5f5; border:1px solid #ccc; padding:5px; } /* LemonStyle: Liten knapp */ .mellan_knapp { width:205px; text-align:center; display:block; background:#f5f5f5; border:1px solid #ccc; padding:5px; } /* LemonStyle: Mellan knapp */ .stor_knapp { text-align:center; display:block; background:#f5f5f5; border:1px solid #ccc; padding:5px; } /* LemonStyle: Stor knapp */ a { color:#777; text-decoration:none; } a img { border:0; } a:visited { color:#b1b3b4; } a:hover { color:#333; } img { border:0px; } p { margin-bottom:10px; } /* Paragraf */ strong { font-weight:bold; } em { font-style:italic; } #menu li a { font:bold 12px "trebuchet ms"; text-decoration:none; color:#b1b3b4; } #menu li a:hover { color:#666; } #menu li a.active { color:#fff; } #left ul { font-weight:bold; } #left li.heading { text-transform:uppercase; color:#333; } #left li a { text-transform:uppercase; text-decoration:none; color:#b1b3b4; } #left li a:hover { color:#666; } #left li a.active { color:#666; } #portratt #citat, #portratt_detail #citat { font:italic normal 18px arial; } #portratt #citatnamn { font-size:11px; } #portratt #citat a { text-decoration:none; color:#b1b3b4; } #portratt #citat a:hover { color:#666; } #right { color:#000; } #right a { text-transform:uppercase; width:60px; font:bold 11px tahoma,arial,verdana,sans-serif; cursor:pointer; } #right img { float:left; } #right span { display:block; width:50px; float:left; padding-left:8px; } #right span:hover { color:#666; } #footer { color:#fff; } #footer a { color:#fff; font-weight:bold; text-decoration:none; } #footer a.active { color:#666; } #footer a:hover { color:#666; } #footer #credit { float:right;padding:5px 10px 0 0;font-size:10px;color:#efefef; } /*---------------------------* * 3. SECTION/PAGE SPECIFIC * *---------------------------*/ /* form.con - styling for lemongenerated forms --------------*/ .form { width:420px; background:#f5f5f5; border:1px solid #ccc; } .form td { text-align:center; } .form td img { margin:10px 0; width:200px; height:55px; } .form #uword { margin-top:10px; } .label_td, .field_td { width:200px; padding:10px 0 0 10px; text-align:left !important; } .group_td { width:400px; padding-left:10px; padding-bottom:10px; text-align:left !important; } .field_input { width:190px; margin:0 10px 0 0; } .field_text, .field_textarea, .field_select { font-size:13px; } .field_textarea { height:50px; overflow:auto; } .field_checkbox { width:auto; } .button { margin:0 7px 10px 0; font:bold 12px tahoma; width:80px; } /* foretag.con --------------*/ #presentation_middle { width:570px; float:left; margin:0 0 0 10px; min-height:280px; height:auto !important; height:280px; padding-right:26px; } #presentation_middle .updated { font:normal 11px tahoma; text-transform:uppercase; } #presentation_middle .left { width:265px; float:left; margin-right:30px; } #presentation_middle .right { width:265px; float:left; } #presentation_middle h1 { font:bold 16px arial,verdana,helvetica,sans-serif; margin:0; color:#666; text-transform:uppercase; } #presentation_middle h2 { font:bold 13px arial,verdana,helvetica,sans-serif; color:#666; text-transform:uppercase; } #presentation_middle h3 { font:bold 13px arial,verdana,helvetica,sans-serif; color:#666; background:#f5f5f5; border:1px solid #ccc; padding:3px; margin-bottom:5px; } #presentation_middle ul { margin-left:20px; margin-bottom:10px; } #presentation_middle ul li { list-style-type:disc; } #presentation_middle ol { margin-left:30px; margin-bottom:10px; } #presentation_middle ol li { list-style-type:decimal; } /* IE */ hr.line { height:1px; padding:0px; margin:8px 0 8px 0; border:1px solid #555; background-color:#555; } /* FF */ div.line { background:#555; height:1px; margin:15px 0 15px 0; } /* text.con - foretagspresentationer --------------*/ #threeLatest { margin-bottom:20px; } .resGroup { background:#f5f5f5; border-top:1px solid #ccc; border-bottom:1px solid #ccc; margin-bottom:10px; padding:10px; } .resGroup span { display:block; font:bold 13px arial,verdana,helvetica,sans-serif; color:#666; text-transform:uppercase; padding-bottom:3px; } /* newsletter.con --------------*/ .newslettertext { width:240px; float:left; } #subscriber_container { margin-bottom:10px; width:138px; background:#f5f5f5; float:right; padding:10px 10px 0 10px; border:1px solid #ccc; } #subscriber_container label { width:80px; display:block; float:left; font-weight:bold; } #subscriber_container select { width:135px; } #subscriber_container input { font:normal 11px verdana; } #subscriber_container #submit { font-weight:bold; width:60px; height:20px; } #subscriber_container #unsubmit { font-weight:bold; width:60px; height:20px; } #unsubscribeform { padding-bottom:10px; } #ajaxresult { margin-bottom:10px; } .ajax-loading { background:url(../img/ajax_spinner.gif) no-repeat center; height:40px; } div.reg_complete { font-weight:bold; padding:10px; border:1px solid #999; } p.reg_error { font-weight:bold; color:red; } span.reg_error { font-weight:normal; color:red; } /* bostadsannonser.con --------------*/ .ad_content { margin-bottom:10px; } .ad_title { background:#f5f5f5; border:1px solid #ccc; padding:5px; margin-bottom:5px; } .ad_title a { font-weight:bold; color:#666; } .ad_text { margin-bottom:5px; } /* jobs.con --------------*/ #joblist li { background:none; font-weight:normal; text-transform:lowercase; padding:0; margin-bottom:5px; } #joblist li a { text-transform:none; } #jobform { padding-bottom:20px; padding-top:20px; } #subcatcontainer { display:inline; float:left; margin-right:15px; width:340px; } #jobdatacontainer {} #cat { width:420px; margin-bottom:20px; } #subcat { width:340px; } #submitjobform { display:inline; float:left; width:60px; } /* clear some shit --------------*/ .clearfix:after, #menu:after, #content:after, #newsbox:after, #newslettercontent:after, .ad_content:after, #footercontent:after { content:".";display:block;height:0;clear:both;visibility:hidden; } .clearfix, #menu, #content, #newsbox, #newslettercontent, .ad_content, #footercontent { display:inline-block; } * html .clearfix, * html #menu, * html #content, * html #newsbox, * html #newslettercontent, * html .ad_content, * html #footercontent { height:1%; } .clearfix, #menu, #content, #newsbox, #newslettercontent, .ad_content, #footercontent { display:block; } .error { color:red; } /* 10 minuter-tävlingen --------------*/ #tm_content { display:inline; float:left; margin:20px 0 0 70px; width:500px; } #tm_sponsors { display:inline; float:right; margin:20px 70px 0 0; text-align:center; width:110px; } #share { display:inline; float:left; margin:0 0 0 70px; padding:10px 0 0; width:400px; } .fbshare { margin:0 10px 0 0; } #tm_content h1, #tm_sponsors h1 { text-transform:uppercase; } #tm_form, #tm_tipsa { padding:10px 0 0; } #first-form {} #loading-spinner { display:none; } /* .form-row { margin:0 0 10px; } .form-row textarea { border:1px solid #ccc; border-bottom:1px solid #efefef; border-right:1px solid #efefef; height:60px; margin:0 0 10px; padding:3px; width:492px; } .form-row input { border:1px solid #ccc; border-bottom:1px solid #efefef; border-right:1px solid #efefef; padding:3px; width:232px; } .form-row #newsletter { border:none; float:left; margin:15px 10px 0 0; width:14px; } .form-row #accept { border:none; float:left; margin:5px 10px 0 0; width:14px; } .form-row label { color:#666; cursor:pointer; display:block; padding:0 0 3px; } .form-row .attach-file-label { float:left; padding:3px 0 0; width:100px; } .form-row .newsletter-label { float:left; margin:15px 0 0; } .form-row .accept-label { float:left; font-style:italic; margin:5px 0 0; width:455px; } .form-row .row-left { display:inline; float:left; margin:0 20px 0 0; width:240px; } .form-row .row-right { float:right; width:240px; } .form-row #submit-tmform, .form-row #submit-tmtipform { width:108px; } */ /* tävling sommar 2011 --------------*/ #contest-content { display:inline; float:left; margin:20px 0 0 70px; width:500px; } #contest-sponsors { display:inline; float:right; margin:20px 40px 0 0; width:160px; } #contest-content h1, #contest-sponsors h1 { text-transform:uppercase; } #contest-container {} #contest-form { padding:10px 0 0; } #loading-spinner { display:none; } #share { display:inline; float:left; margin:0 0 0 70px; padding:10px 0 0; width:400px; } .radio-buttons { } .radio-buttons div { color:#666; margin:0 0 10px; } .form-row.radio-buttons input { clear:left; float:left; margin:0 10px 5px 0; width:auto; } .form-row.radio-buttons label { float:left; margin:0 0 5px; } div.formerror { color:#f00; } .form-row { margin:0 0 10px; } .form-row textarea { border:1px solid #ccc; border-bottom:1px solid #efefef; border-right:1px solid #efefef; height:60px; margin:0 0 10px; padding:3px; width:492px; } .form-row input { border:1px solid #ccc; border-bottom:1px solid #efefef; border-right:1px solid #efefef; padding:3px; width:232px; } .form-row #newsletter { border:none; float:left; margin:15px 10px 0 0; width:14px; } .form-row #accept { border:none; float:left; margin:5px 10px 0 0; width:14px; } .form-row label { color:#666; cursor:pointer; display:block; padding:0 0 3px; } .form-row .attach-file-label { float:left; padding:3px 0 0; width:100px; } .form-row .newsletter-label { float:left; margin:15px 0 0; } .form-row .accept-label { float:left; font-style:italic; margin:5px 0 0; width:455px; } .form-row .row-left { display:inline; float:left; margin:0 20px 0 0; width:240px; } .form-row .row-right { float:right; width:240px; } .form-row #submit-contestform { width:108px; }