﻿/*
 * Mattias Bengtsson
 * Copyright Sector 5 AB 2009
 * -----------------------------------------------------------------------------
 */

@import "defaults.css";
@import "screen-shared.css";

/*
 * Start
 */

/* Image slider */
#startslider {
	height: 390px;
}

#startslider .wrap {
	position: absolute;
	width: 940px;
	overflow: hidden;
}

#startslider .slides {
	height: 340px;
	width: 9400px;
	margin-bottom: 3px;
	position: relative;
}

#startslider .slides ul {
	float: left;
}

#startslider .slides li {
	display: block;
	float: left;
}

#startslider .pager {
	clear: both;
	float: right;
}

#startslider .pager ul {
	float: left;
}

#startslider .pager li {
	display: block;
	float: left;
	height: 12px;
	width: 16px;
	background: url(../images/startslider-pager-bg.gif) left top no-repeat;
	text-align: center;
	padding: 2px 0;
	margin-left: 2px;
}

#startslider .pager a {
	display: block;
	color: #6c6c6c;
}

#startslider .pager li.active a {
	color: #049bbc;
}

/* Newsticker */
#newsticker {
	clear: both;
	height: 35px;
	margin-bottom: 20px;
}

#newsticker .wrap {
	background: url(../images/newsticker-bg.gif) left top no-repeat;
	float: left;
	width: 940px; /* Fx fix? */
}

#newsticker h2 {
	background: url(../images/newsticker-header-bg-left.gif) left top no-repeat;
	font-size: 15px;
	font-weight: bold;
	color: #0a96b5;
	padding-top: 8px;
	padding-left: 15px;
	padding-right: 10px;
	height: 27px;
	float: left;
}

#newsticker .posts {
	background: url(../images/newsticker-header-bg-right.gif) left top no-repeat;
	float: left;
	height: 35px;
}

#newsticker ul {
	position: relative;
	padding-top: 12px;
	padding-left: 30px;
	font-size: 11px;
	color: #1c1c1c;
}

#newsticker li {
	position: absolute;
	width: 820px;
	white-space: nowrap;
	overflow: hidden;
	display: none;
}

#newsticker a {
	color: #1c1c1c;
}

/* Tabbox: tabs */
#tabbox .tabs {
	float: left;
}

#tabbox .tabs ul {
	float: left;
}

#tabbox .tabs li {
	float: left;
	display: block;
	font-size: 11px;
	font-weight: bold;
	color: #fff;
	cursor: pointer;
}

* html #tabbox .tabs li {
	margin-left: 0;
}

#tabbox .tabs li span {
	float: left;
	display: block;
	height: 18px;
	padding-top: 4px;
	padding-left: 17px;
	padding-right: 30px;
}

/* Tabbox: tabs-logics */
#tabbox .tabs li {
	background: url(../images/tabbox-tab-inactive.gif) right top no-repeat;
}

#tabbox .tabs li.first span {
	background: url(../images/tabbox-tab-first-inactive.gif) left top no-repeat;
}

#tabbox .tabs li.beforeactive {
	background: url(../images/tabbox-tab-inactive-beforeactive.gif) right top no-repeat;
}

#tabbox .tabs li.active {
	background: url(../images/tabbox-tab-active.gif) right top no-repeat;
}

#tabbox .tabs li.last {
	background: url(../images/tabbox-tab-inactive-last.gif) right top no-repeat;
}

/* avoid double classes (IE 6 compat) */
#tabbox .tabs li.first-active span {
	background: url(../images/tabbox-tab-first-active.gif) left top no-repeat;
}

#tabbox .tabs li.last-active {
	background: url(../images/tabbox-tab-active-last.gif) right top no-repeat;
}

/* Tabbox: banners */
#tabbox .tabcontents {
	background: url(../images/tabbox-bg-top.gif) left top no-repeat;
	padding-top: 6px;
	clear: both;
}

* html #tabbox .tabcontents {
	clear: none;
}

*:first-child+html #tabbox .tabcontents {
	clear: none;
}

#tabbox .tabcontents .wrap {
	background: url(../images/tabbox-bg-bottom.gif) left bottom no-repeat;
	float: left;
	padding-bottom: 6px;
	width: 940px;
	background-color: #5b5b5b;
}

#tabbox .tabcontents .tab {
	display: none;
	float: left;
	background: url(../images/tabbox-bg-middle.gif) left bottom no-repeat;
}

#tabbox .tabcontents .tab.active {
	display: block;
}

#tabbox .banner {
	float: left;
	width: 228px;
	margin-left: 4px;
	padding-bottom: 24px;
}

#tabbox .banner.first {
	margin-left: 8px;
}

* html #tabbox .banner.first {
	margin-left: 4px;
}

#tabbox .banner img {
	margin-bottom: 15px;
}

#tabbox .banner h3,
#tabbox .banner p {
	margin: 0 16px;
}

#tabbox .banner h3 {
	color: #1c1c1c;
	font-size: 18px;
	line-height: 19px;
	margin-bottom: 4px;
}

#tabbox .banner p {
	color: #060606;
	font-size: 12px;
	line-height: 15px;
}

/*
 * Article
 */

#primary-content .introduction {
	font-weight: bold;
}

#primary-content img.main {
	margin-bottom: 12px;
}

/* Hook */
#hook {
	float: right;
	width: 187px;
	margin-left: 12px;
	background-image: url(../images/hook-bg-top.gif);
}

#hook .wrap {
	background-image: url(../images/hook-bg-bottom.gif);
}

#hook ul {
	list-style-type: none;
	margin-left: 0;
}

#hook li {
	margin-bottom: 10px;
	font-size: 11px;
}

#hook ul.links li {
	background: #fff url(../images/readmore-arrow.gif) left 4px no-repeat;
	padding-left: 8px;
	margin-left: 3px;
}

/* Byline */
#byline h3 {
	margin-bottom: 6px;
}

/* Form */
#xform {
	margin-top: 17px;
}

#xform h3 {
	margin-bottom: 19px;
}

#xform .input {
	display: block;
	margin-bottom: 12px;
	clear: both;
}

#xform label {
	display: block;
	margin-bottom: 3px;
}

#xform input,
#xform select,
#xform textarea {
	color: #000;
}

#xform input.text,
#xform textarea {
	width: 310px;
}

#xform .multichoice {
	float: left;
	clear: both;
	width: 100%;
}

#xform .multichoice input {
	float: left;
	margin: 0 4px;
	clear: left;
}

* html #xform .multichoice label {
	padding: 2px 0;
}

#xform .buttons {
	clear: both;
}

/*
 * Product entrance
 */

#products-intro {
	padding-right: 178px;
	padding-bottom: 14px;
	border-bottom: 2px solid #0a96b5;
	margin-bottom: 20px;
}

#products-intro h3 {
	color: #171717;
	font-size: 18px;
	line-height: 28px;
	margin-bottom: 2px;
}

#products-intro p {
	color: #0d0d0d;
	font-size: 12px;
	line-height: 16px;
}

.products-banners {
	background: url(../images/products-banners-bg-top.gif) left top no-repeat;
	padding-top: 6px;
	margin-bottom: 19px;
	float: left;
}

.products-banners .wrap {
	background: url(../images/products-banners-bg-bottom.gif) left bottom no-repeat;
	float: left;
	padding-bottom: 14px;
}

.products-banners .banner {
	width: 217px;
	float: left;
	margin-left: 20px;
}

.products-banners .banner.first {
	margin-left: 0;
}

.products-banners h4 {
	font-size: 12px;
	line-height: 20px;
	font-weight: bold;
	color: #171717;
	padding: 5px 16px 7px 16px;
}

.products-banners img {
	margin-left: 3px;
}

.products-banners p {
	font-size: 12px;
	line-height: 16px;
	color: #040404;
	padding: 8px 14px 5px 14px;
}

/*
 * Contact listing
 */

#contact-intro {
	padding-bottom: 14px;
	margin-bottom: 16px;
}

#contact-intro h3 {
	color: #171717;
	font-size: 18px;
	line-height: 28px;
	margin-bottom: 2px;
}

#contact-intro p {
	color: #0d0d0d;
	font-size: 12px;
	line-height: 16px;
}

#contact-locations .location {
	width: 217px;
	margin-left: 20px;
	float: left;
	margin-bottom: 31px;
}

#contact-locations .location.odd {
	margin-left: 0;
}

#contact-locations .location h4 {
	font-size: 12px;
	font-weight: bold;
	color: #049bbc;
	background: url(../images/contactlocation-header-bg.gif) left top no-repeat;
	height: 19px;
	padding-top: 5px;
	padding-left: 10px;
	margin-bottom: 6px;
}

#contact-locations .location p {
	margin-left: 10px;
	font-size: 12px;
	line-height: 16px;
	color: #040404;
}

#contact-locations .location .readmore-button {
	margin-left: 8px;
}

/*
 * Staff listing
 */

#locationmap {
	margin-bottom: 14px;
}

.stafflisting {
	color: #0f0e0e;
	font-size: 12px;
	line-height: 16px;
	float: left;
}

.stafflisting .person {
	padding-bottom: 20px;
	float: left;
	width: 100%;
}

.stafflisting img {
	float: left;
	margin-right: 15px;
}

.stafflisting h3 {
	font-size: 12px;
	font-weight: bold;
	margin-bottom: 8px;
}

.stafflisting p {
	float: left;
}

/*
 * Search
 */

#search-box {
	background: url(../images/pagesearch-box-bg.gif) left top no-repeat;
	height: 56px;
	padding-top: 9px;
	margin-bottom: 13px;
	clear: both;
}

#search-box label {
	margin-left: 20px;
	color: #040404;
	font-size: 11px;
	display: block;
	margin-bottom: 5px;
}

#search-box input {
	background: url(../images/pagesearch-input-bg.gif) left top no-repeat;
	margin-left: 20px;
	border: 0;
	width: 228px;
	height: 19px;
	color: #040404;
	font-size: 12px;
	padding-top: 5px;
	padding-left: 6px;
	margin-right: 7px;
	float: left;
}

#search-box div.button {
	background-image: url(../images/pagesearch-button-bg-right.gif);
}

#search-box div.button a {
	background-image: url(../images/pagesearch-button-bg-left.gif);
	padding-top: 5px;
	padding-bottom: 6px;
	font-size: 12px;
}

#search-results {
	margin-bottom: 13px;
}

#search-results h2 {
	border-bottom: 2px solid #0a96b5;
	margin-bottom: 17px;
	padding-bottom: 3px;
	font-size: 11px;
}

#search-results .hit {
	font-size: 12px;
	line-height: 16px;
	color: #040404;
	margin-bottom: 18px;
}

#search-results .hit a {
	font-weight: bold;
}
