/* Theme Name: HA-Andersson Theme URI: - Description: Version: 0.1 Author: David Teczely Author URI: http://www.spinit.se Tags: */ /* Resets the stylesheet -------------------------------------------------------------- */ html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}:focus{outline:0}ins{text-decoration:none}del{text-decoration:line-through}table{border-collapse:collapse;border-spacing:0} /* Body and html elements -------------------------------------------------------------- */ html { color: #5d5d5f; font-family: arial, helvetica, sans-serif; font-size: 13px; height: 100%; background: #f7f7f7 url("/CommonResources/Images/grey-background-gradient.jpg") left top repeat-x; height: 100%; } body { background: #fff; min-height: 600px; box-shadow: 0 5px 15px #c4c5c5; -moz-box-shadow: 0 5px 15px #c4c5c5; -webkit-box-shadow: 0 5px 15px #c4c5c5; margin: 0 auto; margin-bottom: 20px; position: relative; border-left: 1px solid #e6e6e6; border-right: 1px solid #e6e6e6; border-bottom: 1px solid #e6e6e6; } /* WPC specific styles --------------------------------------------------------------*/ body.RadEContentBordered { font-size: 11px !important; background: #fff !important; padding: 15px; height: 100%; } body.RadEContentBordered div, body.RadEContentBordered div { border: 2px solid #000; padding: 15px; float: left; margin: 5px;} /* Font faces --------------------------------------------------------------*/ @font-face { font-family: 'ArialNarrowBold'; src: url('arial_narrow_bold-webfont.eot'); src: local('☺'), url('arial_narrow_bold-webfont.woff') format('woff'), url('arial_narrow_bold-webfont.ttf') format('truetype'), url('arial_narrow_bold-webfont.svg#webfontatYuB7jT') format('svg'); font-weight: normal; font-style: normal; } /* Headings -------------------------------------------------------------- */ h1,h2,h3,h4,h5,h6 { color: #444; line-height: 1.3em;} h1{ font-size: 29px; margin-bottom: 8px; font-family: 'ArialNarrowBold', arial, helvetica, sans-serif; font-weight: normal;} h1 span { color: #666; font-size: 22px;} h2{ font-size: 21px; margin: 25px 0 5px 0; font-family: 'ArialNarrowBold', arial, helvetica, sans-serif; font-weight: normal;} h3{ font-size: 16px; margin-bottom: 5px; } h4{ font-size: 14px; margin-bottom: 5px; } h5{ } h6{ } .main-spot h1, .main-spot h2, .main-spot h3 { border-bottom: 1px solid #e3e3e3; } /* Text elements -------------------------------------------------------------- */ p, address {margin-bottom: 2em; line-height: 1.25em;} abbr {} acronym {} address { font-style: normal;} blockquote {margin-bottom: 1em; font-style: italic; font-size: 1.2em; } code {} del {} dfn {} dfn {} em {} pre {} strong {} /* Link elements -------------------------------------------------------------- */ a img {border: none;} a:hover img { opacity: 0.5; filter: alpha(opacity=50); } a:link, a:visited { text-decoration: none; color: #00215B} a:hover, a:active, a:focus { text-decoration: underline; } /* List elements -------------------------------------------------------------- */ #text-content ul {padding: 0 20px; list-style:square !important; margin-bottom:1.8em;} ul.downloads {list-style: none outside; margin: 1.2em 0 1em 0;} ul.downloads li:last-child {border: none;} ul.downloads li a {display: block; padding: .5em 0 .5em 25px;} ul.downloads li a[href$=".pdf"] {background: url(/CommonResources/Images/pdf-icon.png) left center no-repeat;} ul li{ line-height:1.5em; } ul li p {font-size: 1em;} li > ul, li > ol{ margin-bottom:0; margin-left:30px; } li > ul li, li > ol li{ font-size:1em; } ol{ margin-bottom:1.8em; list-style:decimal; padding: 0 0 0 25px; } ol li{ font-size:1.2em; line-height:1.5em; } ul.logo-list { list-style: none; } .logo-list li { text-align: center; margin-bottom: 30px;} #content ul { list-style: none;} ul.columns li { float: left; width: 50%; } dl { margin: 0 0 30px 0; overflow: hidden; padding: 10px;} dt { font-weight: bold; float:left; clear: left; margin: 0 10px 5px 0; width: 60px;} dd { float:left; } #text-content ul.concept-view, #text-content ul.recycling-guide-view { list-style: none; margin: 0; padding: 0; clear: both; width: 100%; float: left;} ul.concept-view li, ul.recycling-guide-view li { display: block; float: left; overflow: hidden;} ul.concept-view li { margin: 0 10px 10px 0; } ul.recycling-guide-view li { margin: 0 20px 20px 0; } ul.concept-view li { width: 160px; height: 210px; } ul.recycling-guide-view li { width: 150px; height: 190px; border: 1px #eee solid; background: #D5EBF5;} ul.concept-view li h3, ul.recycling-guide-view li h3 { font-size: 12px; padding: 0;} ul.concept-view li h3 { margin: 5px 0; } ul.recycling-guide-view li h3 { margin: 10px; } #text-content ul.concept-view li img, #text-content ul.recycling-guide-view li img { clear: both; margin-bottom: 10px; } #text-content ul.recycling-guide-view li img { height: 140px; border-bottom: 3px #305291 solid; } #text-content ul.concept-view li img { height: 160px; } /* Tables -------------------------------------------------------------- */ table { font-size: 0.9em;} caption {} thead {} tfoot {} tbody {} tr {} th { vertical-align: top; text-align: left; padding: 5px;} td { vertical-align: top; padding: 5px;} /* Some general selectors -------------------------------------------------------------- */ hr {color:#ccc; background-color:#ccc; height:1px; border:none; margin: 10px 0; clear: both;} .align-left {float:left;} .align-right {float:right;} .bottom {margin-bottom:0; padding-bottom:0;} .hide {display:none;} .clear-fix {clear: both; } .highlight {} .large { font-size: 1.2em; } .small { font-size: 0.8em; } .off-screen {position:absolute; left:-999em;} .top {margin-top:0; padding-top:0;} .d, .m, .y, .date, .to {font-size: 0.9em;} .shadow { box-shadow: 0 0 50px black; -moz-box-shadow: 0 0 50px black; -webkit-box-shadow: 0 0 50px black; } .low-shadow {box-shadow: 0 5px 15px black; -moz-box-shadow: 0 5px 15px black; -webkit-box-shadow: 0 5px 15px black; } .sup { vertical-align: top; font-size: 0.6em; line-height:1;} .sub { vertical-align: bottom; font-size: 0.6em; line-height:1;} .darkblue { background: #305291;} .lightblue { background: #76c8ec;} .white-text { color: white;} .side-image {} #text-content img.align-left { margin-right: 16px; } .tool-tip { position: absolute; z-index: 3000; padding: 5px; opacity: 0.85; filter: alpha(opacity=85); display: none; bottom: 15px; left: 120px; background: #fff; border: 1px solid #000; color: #000; font-size: 11px; width: 200px; *zoom: 1; } .tool-tip-show-hide { background:url("/CommonResources/Images/icon-tool-tip.png") no-repeat; width: 16px; height: 14px; text-indent: -999em; overflow: hidden; display: inline-block; margin-left: 5px;} /* Forms -------------------------------------------------------------- */ label { display: inline-block; vertical-align: middle; padding: 0; margin: 0; width: 80px; } input, textarea, select {width: 190px; padding: 5px; color: #5D5D5F; font-family: arial, helvetica, sans-serif; font-size: 0.9em; margin: 0; display: inline-block; vertical-align: middle; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; border: 1px #d5ebf5 solid; } textarea { height: 200px; width: 250px;} input[type=submit], .button, .button-primary { width: auto; } input[type="submit"] {border: 1px solid #aaa; -moz-border-radius: 20px; -webkit-border-radius: 20px; padding: 3px 10px; font-size: .9em; color: #555; background: #c6c6c6 url(/CommonResources/Images/grey-gradient.gif) repeat-x; font-weight: bold;} input[type="submit"]:hover, input[type="submit"]:active, input[type="submit"]:focus {border:1px solid #ccc; cursor: pointer; color: #888;} .form p { margin-bottom: 1em; } input:focus {-moz-box-shadow: } /* Navigation ---------------------------------------------------------------*/ #nav ul, #secondary-navigation ul { list-style: none; padding: 0; margin-bottom: 0;} #nav ul li { padding: 0; float: left; } #nav ul a{ text-decoration: none; font-size: 14px; float: left; bottom right no-repeat; color: #fff; text-align: center; padding: 15px 20px; line-height: 110%; text-transform: uppercase; text-shadow: #000 1px 1px 2px;} #nav ul li.selected a { background: #00215B; } #nav ul li a:hover { background: #013b84; } #sub-nav ul { list-style:none; margin: 0; padding: 0; background: #eee; } #sub-nav ul li a{display: block; padding: 10px; color: #000; text-decoration:none; border-bottom: 1px solid #e3e3e3; font: normal 12px Arial, Verdana, sans-serif; line-height: 150%; color: #666; zoom: 1;} #sub-nav ul li a:hover, #sub-nav ul li.selected a{ color: #000; } #sub-nav ul li ul {margin: 0; padding: 0;} #sub-nav ul li.selected ul li a { padding: 7px 0 7px 20px; color: #666; background: #f6f6f6; font: normal 11px Arial, Verdana, sans-serif; } #sub-nav ul li.selected ul li.selected a, #sub-nav ul li.selected ul li a:hover {color: #000; text-transform: none; background: #fff; } #sub-nav ul li.selected ul li.selected ul li a { padding: 3px 0 3px 40px; color: #000; text-transform: none; background: none; text-decoration: none;} #sub-nav ul li.selected ul li.selected ul li.selected a, #sub-nav ul li.selected ul li.selected ul li.selected a:hover {color: #004798; text-transform: none; background: none;} #secondary-navigation { position: absolute; right: 20px; bottom: -4px; overflow: auto; text-align: right; width: 225px; *zoom: 1;} #secondary-navigation ul a {color: #fff; padding: 2px 25px 0 0; } #secondary-navigation ul li {float: right; padding: 5px 20px; background: #00215B;} #secondary-navigation ul li.login-link { border-right: 1px dashed #fff; } #secondary-navigation ul li.english-link a{ background:url("/CommonResources/Images/icon-english.png") right 5px no-repeat; } #secondary-navigation ul li.login-link a{ background:url("/CommonResources/Images/icon-login.png") right 2px no-repeat; } #offer-list ul { list-style: none; } #offer-list li { float: left; width: 33%;} #offer-list a:hover { text-decoration: underline; } /* Layout containers -------------------------------------------------------------- */ #header { height: 130px; position: relative;} #nav { overflow: auto; border-top: 8px #00215B solid; background: #305291; margin-bottom: 20px; } #search-container {position: absolute; top: 40px; right: 20px; } #search-container label { display: inline-block; *display: inline; *zoom: 1; padding-right: 10px; text-transform: uppercase; font-size: : 13px; position: absolute; left: -999em; } #search-container input { display: inline-block; *display: inline; *zoom: 1; width: 130px; height: 31px; line-height: 31px; background:url("/CommonResources/Images/search-bg.gif") no-repeat; border: 0; padding: 0 5px;font-size: 12px;} #search-container input.search-button{ display: inline-block; *display: inline; *zoom: 1; width: 38px; height: 31px; background:url("/CommonResources/Images/search-button.gif") no-repeat; border: 0; padding: 0 5px;font-size: 12px; text-indent: -999em; -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0;} #logo { position: absolute; top: 20px; left: 20px;} #logo h1 a {background:url("/CommonResources/Images/logo.png") no-repeat scroll 0 0 transparent; display:block; height:73px; margin:0; overflow:hidden; padding:0; text-indent:-999em; width:250px;} #content { padding-bottom: 60px; } #content:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } #content h1 {padding-bottom: 8px; border-bottom: 5px solid #e3e3e3;} #text-content { position: relative; z-index: 999; } #text-content img {display: block;} .concept-content img { margin-bottom: 20px; } .equipment-content img { margin-right: -380px; width: 340px; border: 1px solid #e6e6e6; padding: 10px; box-shadow: 2px 2px 5px #c4c5c5; -moz-box-shadow: 2px 2px 5px #c4c5c5; -webkit-box-shadow: 2px 2px 5px #c4c5c5; -moz-border-radius: 5px; -webkit-border-radius: 5px;} #our-offer { background: #000; color: #fff; font-size: .9em; margin-top: -98px; padding: 20px; margin-bottom: 20px; line-height: 1.4; opacity: .8; filter: alpha(opacity=80); *zoom: 1;} #our-offer h2 { color: #fff; margin-top: 0; opacity: 1; filter: alpha(opacity=100);} #our-offer p { line-height: 1.5; opacity: 1; filter: alpha(opacity=100); margin: 0;} #side-content {} #side-content h3 {font-size: 14px;} #side-content h4 {font-size: 12px;} #side-content label, #contact-regions label{ position: absolute; left: -999em; } .concept-page #side-content, #concept-side-content { float: right; } #footer { height: 170px; background: #eee; padding: 30px 0 0 0;} #footer h3 { border-bottom: 1px solid #ccc;} .sitemap {font-size: 13px; margin: 10px 0; display: block; padding: 10px 0; border-top: 1px solid #ccc;} #copyright-info {background: #00215B; text-align: right; color: #fff; padding: 20px;} .video-container {background: #e3e3e3; margin-bottom: 20px; padding: 20px; -moz-border-radius: 10px; -webkit-border-radius: 10px;} .side-content-sub-container, .content-box {background: #d5ebf5; padding: 10px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; overflow: hidden; } .side-content-sub-container { width: 200px; margin-bottom: 20px; } .content-box { width: 500px; margin: 10px 0; } .content-box h2, .content-box h3, .content-box h4 { margin-top: 0; } .side-content-sub-container label, .side-content-sub-container input, .side-content-sub-container select { display: inline-block; *display: inline; *zoom: 1; font-size: : 13px; margin-bottom: 5px; } .side-content-sub-container label { width: 80px; } .side-content-sub-container select { width: 198px; } .side-content-sub-container h3 {margin: -10px -10px 10px -10px; padding: 10px; border-bottom: 1px solid #fff;} .side-content-sub-container p { margin-bottom: 13px; } .side-content-sub-container fieldset p { margin: 0; } .side-content-sub-container .rss-link { float: right;} #textspalt {float: left; width: 525px; } #sidbild {float: right; width: 205px; } #side-image-container.side-content-sub-container { background: #fff; no-repeat; margin-bottom: 20px; padding: 17px 17px 5px 17px; overflow: hidden; height: 245px; width: 183px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; box-shadow: 2px 2px 5px #c4c5c5; -moz-box-shadow: 2px 2px 5px #c4c5c5; -webkit-box-shadow: 2px 2px 5px #c4c5c5; border: 1px solid #e6e6e6;} .clip { left:530px; position:absolute; top:10px; width: 200px; height: 250px; overflow: hidden; } .clip img { clip:rect(0px,200px,250px,0px); position: absolute; width: 200px;} #side-image-container.side-content-sub-container h3 { font-size: 13px; border: none; margin-bottom: 5px; padding-bottom: 0;} .js #concept-container{background: #ddd; width: 700px; height: 376px; overflow: hidden; text-indent: -999em; margin-bottom: 30px;; color: #fff; } .js #concept-container h1 { color: #444; display: block; position: absolute; top: 20px; left: -20px; z-index: 9999; border: none; font-size: 14px; border: none; width: 190px; margin: 0; padding: 0; height: 43px; background:url("/CommonResources/Images/slide-show-h1.png") no-repeat; padding: 8px 5px 5px 35px; font-family: Arial; font-weight: bold;} .facts-box {-moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; box-shadow: 2px 2px 5px #c4c5c5; -moz-box-shadow: 2px 2px 5px #c4c5c5; -webkit-box-shadow: 2px 2px 5px #c4c5c5; border: 1px solid #e6e6e6; background: #fff; width: 198px; margin-bottom: 20px;} #downloads {padding: 10px; background: #F4F4F4; position: relative; overflow: visible; margin-bottom: 20px; } #downloads h3 { border-bottom: 1px solid #CCCCCC; } #downloads img { position: absolute; right: 10px; top: -10px; z-index: 33; -webkit-transform:rotate(25deg); -moz-transform:rotate(25deg);} #text-content ul#department-list {margin-bottom: 30px; overflow: auto; list-style: none !important; padding: 0;} #department-list h3 { font-size: 12px; } #department-list li { width: 20%; float: left; } #department-list img { width: 100%; overflow: hidden; display: block; margin-bottom: 10px;} /* Search -------------------------------------------------------------- */ .search-block {width: 500px;} #search .search-button { width: auto; margin: 0; margin-left: 10px;} div.searchEngine {font-size: 1.1em !important;} .search-info {font-weight: bold; margin-left: 10px;} #search-result {margin-top:1em} #search-result dt { width: 100%;} #search-result dd {margin:0; padding:0;} #search-result dd blockquote {margin:0; padding:0; font-style:normal; font-size: 1em;} #search-result .meta {overflow:hidden; border-bottom:1px dotted #000; padding-bottom:.7em; margin-bottom:.7em;} #search-result cite {font-size:.9em; font-style:normal;} #search-result cite a {color:#999;} .search-paging {margin:1.5em 0;} .search-pages a {padding:.3em; border:1px solid #ccc; margin-left:.2em} /*------------- News----------------*/ #text-content .latest-news li p { margin-bottom: 20px;} #text-content .latest-news li .date { border-bottom: 1px solid #f4f4f4; } /*----------- Sitemap -----------------*/ #sitemap {padding: 0 20px; } #sitemap ul {list-style: square; } #sitemap ul ul { padding: 0; } #sitemap ul li a:hover {background-color: #f4f4f4; } #sitemap ul li {background:none; margin:0; padding:3px 0; font-weight: bold; font-size: 14px;} #sitemap ul li ul li {font-weight: normal; font-size: 12px; } #sitemap ul li ul li ul li {font-weight: normal; font-size: 11px; }