/*
screen.css: SCREEN stylesheet
------------
Job: Adlib
Template Version: 1.0
Produced by: Heidi Seymour
Start date: 12/03/2009
------------
NOTES:
Do all stucture and module sizes in ems.
TOC:
1. general styles
body styles
reset
links
headings
other elements, tags
2. helper styles
forms
notifications and errors
consistant items with normally just one class
3. page structure
skeleton including page furniture
4. page components / modules
most of your styles will be in here
5. content/FCK
these are styles that the client could put in via the FCKeditor. They will also need to be added to the FCK stylesheet.
6. overrides
*/
/* =1. general styles */
* {margin: 0; padding: 0; text-decoration: none; }
body {background:#fff url(/_common/img/bg.gif) repeat-x; font-family: Arial, Helvetica, sans-serif; font-size: 100%;}
a:link, a:visited {}
a:hover, a:focus {text-decoration:underline;}
a img {border: none;}
.accessmenu, .formsearch label {left: -10000px; position:absolute;}
/* =2. helper styles */
input, textarea, select {font-family: Arial, Helvetica, sans-serif; font-size: 80%; }
.mailingList em, .contactForm em {color:#CC1F36; font-size:2em; font-weight:bold; padding-right:.3em; position:absolute; right:0;}
.formMsg {background:#f5e9e9; color:#CC1F36; font-size:.7em; line-height:1.8; padding:1.5em; margin-bottom:2em; -moz-border-radius-bottomright: .2em; -webkit-border-bottom-right-radius: .5em;}
.formMsg ul {margin:1em 0 1em 1.5em;}
/* mailing list form*/
.mailingList li {list-style:none; margin-bottom:1.5em}
.mailingList label {color:#002B54; float:left;font-weight:bold; font-size:.8em; width:15em; position:relative;}
.mlsmall label {width:11.2em; font-size:.75em;}
.mailingList .text { border:1px solid #afbcd2; color:#748EAF; font-size:.7em; padding:.26em; width:18em;}
.mailingList fieldset {background:#dbe8f8; border:0; padding: 1.5em; margin:2em 0; position:relative; -moz-border-radius-bottomright: .2em; -webkit-border-bottom-right-radius:.5em}
.mailingList p {color:#808284; font-size:.8em; line-height:1.8em; margin-bottom:1.5em}
.mailingList p label {font-size:.9em; width:15em; padding-right:2em; }
.mailingList p span label {float:none; margin:0 2em 0 1em;}
.mlsmall p span label {float:none; margin:0 0 0 1em;}
/*.mailingList p label em {top:.25em}*/
.mailingList fieldset ul {margin-top:2em;}
.mailingList fieldset ul li { border-top:1px solid #fff; padding-top:.5em}
.mailingList fieldset ul ul li {border:0; padding:0;}
.mailingList fieldset ul p {float:left; width:12em; line-height:1; margin:0}
.mlsmall fieldset ul p {float:none;margin-bottom:1em}
.mlsmall input#all {margin-left:3.2em;}
.mailingList fieldset ul ul {float:left; width:15em;margin:0}
.mailingList fieldset ul li , .mailingList fieldset ul ul li {width:100%; overflow:hidden;}
.mailingList fieldset ol label {float:left; width:20em; }
.mailingList fieldset legend span {color:#002B54; display:block; font-weight:bold; font-size:.8em; padding-top:3.5em;/*position:absolute; left:0; top:.5em*/;}
.mailingList fieldset legend span em {padding:0;position:relative;vertical-align:middle; /*right:-.8em; top:-.1em;*/}
.mailingList p.submit {clear:both; float:right; font-size:1em}
/* contact form */
.contactForm li {list-style:none; margin-bottom:1.5em; clear:left;}
.contactForm label {color:#002B54; float:left;font-weight:bold; font-size:.8em; width:15em; position:relative;}
.contactForm span label {float:none; margin-left:.5em}
.contactForm textarea, .contactForm select {border:1px solid #afbcd2; color:#748EAF; font-size:.7em; padding:.2em; }
.contactForm .text { border:1px solid #afbcd2; color:#748EAF; font-size:.7em; padding:.26em; width:18em;}
.contactForm p.submit {clear:both; float:right; font-size:1em}
/* =3. page structure */
.container {background:#fff; border:1px solid #c2c2c2; border-top:0; width: 60em; margin: 0 auto; padding:1.18em; overflow:auto}
.containerPop {width:auto;padding:5%}
.wrap {clear:both;}
.contNav, .contSup { float:left; width:10.88em;}
.contMain {float:left; margin:0 1.88em;/* 30px */; width:34.38em;/* 550px */;}
.siteInfo {clear:both; padding:2em 0;}
#flashReplace {width:34.38em;/* 550px */margin-bottom:1.5em}
/* =4. page components / modules */
/* branding */
.branding {margin-bottom:1em; overflow:hidden; width:100%}
.branding h1 {float:left;margin-left:1.3em; width:10em;font-size:1em;}
.branding .contBranding { float:left; margin-left:2em; width:34.38em; /* 550px */;}
.branding p.tagline {float:left; font-size:1.5em; font-weight:bold; margin-top:2.5em}
.branding .help {float:right; width:10.88em;}
.branding .help .formsearch {margin-top:1em;}
.branding .help .formsearch input.searchInput { border:1px solid #afbcd2; color:#748EAF; font-size:.7em; padding:.26em; width:12.4em;}
.branding .help .formsearch input.searchButton { vertical-align:bottom;}
.branding .help .tel {color:#002b55; font-size:.9em; font-weight:bold; margin-top:1em }
.branding .help .tel span {display:block; font-weight:bold; margin-top:.2em}
.branding ul.nav1 { float:right; }
.branding ul.nav1 li {border-left:1px solid #002b55; float:left; list-style:none; margin:0 0 0 1em; padding:0 0 0 1em;}
.branding ul.nav1 li.first {border:0; margin:0}
.branding ul.nav1 li a {background:url('/_common/img/bg-nav1.gif') repeat-x 0 bottom; color:#002b55; font-size:.7em; font-weight:bold;}
/* addThis */
.addThis a {color:#002B54; font-size:.7em; font-weight:bold; text-decoration:none; text-transform:uppercase;}
.addThis a img {margin-right:.5em; vertical-align:bottom}
.addThisEmail a {color:#002B54; font-size:.7em; font-weight:bold; text-decoration:none; text-transform:uppercase;}
.addThisEmail a img {margin-right:.5em; vertical-align:bottom}
/* navigation */
.contNav a {background: url('/_common/img/arrow.gif') no-repeat 0 center; color: #002b55; font-size:.7em; font-weight:bold; padding-left:12px}
.contNav li.selected a {background: url('/_common/img/arrowDn.gif') no-repeat 0 center;}
.contNav li.selected ul a {background: url('/_common/img/arrow.gif') no-repeat 0 center;}
.contNav ul ul a, .contNav ul ul li.selected ul a {font-weight:normal;}
.contNav ul ul li.selected a, .contNav ul ul li.selected li.selected a {font-weight:bold;}
.contNav li {list-style:none;padding: .2em 0}
.contNav li li {background:#dbe8f8; margin:3px 0; padding:0 0 .2em 0} /* blue */
.contNav li li a {margin-left:1em;}
.contNav li li li {border-top: 3px solid #fff; padding:0 0 0 .7em; margin-bottom:0;}
.contNav li li.cn0202 {background:#fff395; margin:3px 0;padding:0 0 .2em 0} /* yellow */
.contNav li li.cn0202 li {background:#fff395;}
.contNav li li.cn0204 {background:#e5f0ac; margin:3px 0; padding:0 0 .2em 0} /* green */
.contNav li li.cn0204 li {background:#e5f0ac;}
.contNav li li.cn0203 {background:#feb7a5; margin:3px 0;padding:0 0 .2em 0} /* red */
.contNav li li.cn0203 li {background:#feb7a5;}
.contNav li li.cn0201 {background:#ffd586; margin:3px 0; padding:0 0 .2em 0} /* orange */
.contNav li li.cn0201 li {background:#ffd586;}
.specialOffers {margin: 1em 0 0 0;}
.specialOffers a {background: none; display: block; padding: 0; margin: 0 0 .5em 0; width: 174px; }
.specialOffers a img {display: block; margin: 0 auto; padding: 0;}
/* breadcrumb */
ul.breadcrumb {margin-bottom:.5em;overflow:hidden}
ul.breadcrumb li {float:left; list-style:none; margin-right:.8em}
ul.breadcrumb li a {background:url('/_common/img/brdcrb.gif') no-repeat 0 center; color:#738eae; font-size:.7em; padding-left:12px}
/* supplimentary Lists */
.supList h3 {color:#002b55; font-size:.9em; margin-bottom:1em;}
.supList ul {margin-bottom:2em;}
.supList li {list-style:none; margin-bottom:.5em; font-size:.7em; color:#808284 }
.supList li a {background:url('/_common/img/arrow.gif') no-repeat 0 center; color:#808284; display:block; font-weight:normal; padding-left:12px}
/* downloads */
.downloads h3 {color:#002b55; font-size:.9em; margin-bottom:1em;}
.downloads ul {margin-bottom:2em;}
.downloads li {list-style:none; margin-bottom:.5em; }
.downloads li.pdf a {background:url('/_common/img/icons/icon-pdf.gif') no-repeat 0 center; color:#808284; display:block; font-size:.7em; font-weight:normal; padding-left:18px}
.downloads li.ppt a {background:url('/_common/img/icons/icon-ppt.gif') no-repeat 0 center; color:#808284; display:block; font-size:.7em; font-weight:normal; padding-left:18px}
.downloads li.doc a {background:url('/_common/img/icons/icon-doc.gif') no-repeat 0 center; color:#808284; display:block; font-size:.7em; font-weight:normal; padding-left:18px}
.downloads li.xls a {background:url('/_common/img/icons/icon-xls.gif') no-repeat 0 center; color:#808284; display:block; font-size:.7em; font-weight:normal; padding-left:18px}
.downloads li.txt a {background:url('/_common/img/icons/icon-txt.gif') no-repeat 0 center; color:#808284; display:block; font-size:.7em; font-weight:normal; padding-left:18px}
/* siteInfo */
.siteInfo ul li {color:#808284;float:left; font-size:.7em; list-style:none; margin-left: 2em}
.siteInfo ul li a {color:#758FB2;}
.siteInfo ul li.first {margin:0;}
.siteInfo ul li.siteCredit {float:right;}
/* Case Study */
.caseStudy h3 {color:#002b55; font-size:.9em; margin-bottom:1em;}
.caseStudy h4 a {background:url('/_common/img/arrow.gif') no-repeat 0 center; color:#808284; display:block; font-size:.7em; padding-left:12px; margin-bottom:1em}
.caseStudy .summary {color:#808284; font-size:.7em; line-height:1.8;}
.caseStudy .summary p, .caseStudy .summary ul {margin-bottom:2em;}
.caseStudy .summary img {float:left; margin:0 .5em .5em 0;}
.caseStudy .summary li {margin-left:1.3em; padding-left:.4em;}
.caseStudy .summary ol li {margin-left:1.7em; padding:0;}
/* home */
#flashReplace p { font-size:.8em; line-height:1.8; margin-bottom:2em}
#flashReplace img {margin-bottom:2em}
/* area */
.contImgLinks li {background:#dbe8f8; list-style:none; float:left; margin-bottom:1.5em; width: 15.94em; /* 255px */}
.contImgLinks li.alt {margin-right:2em;}
.contImgLinks li a img {display:block;}
.contImgLinks li a {color: #002b55; display:block; }
.contImgLinks li a span {background: url('/_common/img/arrow.gif') no-repeat 0 center;display:block; font-size:.7em; font-weight:bold; padding:.5em 1em .5em 12px; margin-left:1em;}
.contImgLinksThreeCol li {background:#dbe8f8; list-style:none; float:left; margin:0 0 1.5em 1em; width: 10.6em; /* 255px */}
.contImgLinksThreeCol li.alt {margin-left:0; clear:both;}
.contImgLinksThreeCol li a img {display:block;}
.contImgLinksThreeCol li a {color: #002b55; display:block; }
.contImgLinksThreeCol li a span {background: url('/_common/img/arrow.gif') no-repeat 0 center;display:block; font-size:.7em; font-weight:bold; padding:.5em 1em .5em 12px; margin-left:1em;}
.contImgLinksThreeCol li img {width: 170px; /* 255px */}
.expert {margin: 0 0 1em 0; background: transparent; padding: 0;}
.expert p {color: #808284; font-size: .7em; line-height: 1.4em;}
.expert p a {color: #808284;}
/* content */
p.hdLink {background:#dbe8f8; padding:0 .2em .2em .5em ; margin-bottom:1em}
p.hdLink a {background: url('/_common/img/arrow.gif') no-repeat 0 center; color: #002b55; font-size:.7em; font-weight:bold; padding-left:12px}
/* article list */
p.listOverview {font-size:.7em; text-align:right;}
.artList {clear:both; margin:1em 0;}
.artList li {list-style:none; margin-bottom:1.5em; overflow:hidden; position: relative;}
.artList a {color:#10476f; font-weight:bold; font-size:.8em}
.artList li small {color:#B3B4B5; font-size:.7em;}
.artList li div.imgWrap {float:left; margin:0 1.5em 1em 0;display:block;width: 7.5em;}
/*.artList li img {float:left; margin:0 1.5em 1em 0;}*/
.artList div {float:left; width:24.69em; /* 395px */}
.artList p {color:#808284; font-size:.8em; line-height:1.8;}
.artList p.price {color:#000; font-weight:bold; display: block; width:22em;}
.artList p.enquire { background:#dbe8f8; padding:.4em .4em .4em .5em ; line-height:1; position: absolute; top: 20px; right: 0;}
.artList p.enquire a {background: url('/_common/img/arrow.gif') no-repeat 0 center; color: #002b55; font-size:.85em; font-weight:bold; padding-left:12px; display:block}
.artList p strong { color:#000;}
.artList div.spec p {font-size:.7em;}
/* article detail */
/*.newsDetail h2 {float:left;}*/
small.date {color:#B3B4B5; /*clear:both;display:block; */font-size:.7em; margin-bottom:1.5em; /*new*/float:left;}
p.back {float:right; margin-bottom:1.5em;/*new*/display:inline;}
p.back a {color:#10476f; font-size:.7em; background:url('/_common/img/arrowBk.gif') no-repeat 0 center; /*display:block; */padding-left:12px; }
/* product detail */
.productDetail .primaryImg {border:1px solid #B3B4B5; float:left; margin:0 1.5em 2em 0;}
.productDetail .description {clear:both;}
.productDetail h3 {float:left;margin-bottom:1.5em}
.productDetail p.price {color:#000; float:left; font-weight:bold;}
.productDetail p.enquire { background:#dbe8f8; float:right; padding:.3em .3em .3em .5em ; line-height:1;}
.productDetail p.enquire a {background: url('/_common/img/arrow.gif') no-repeat 0 center; color: #002b55; font-size:.7em; font-weight:bold; padding-left:12px; display:block}
.productDetail .spec {color:#808284; float:left; padding:1em 0; width:15.44em; /* 247px */}
.productDetail div.spec p { font-size:.7em;}
.productDetail div.spec strong {color:#000; }
.productDetail div.wrap {float:left;width:15em;clear:none}
/* case study detail */
.casestudyDetail h2 {float:left;}
/* staff directory */
.staffDirectory h2 {float:left;}
.deptSearch {background:#dbe8f8; padding: .5em; margin-bottom:2em;}
.deptSearch label {color:#002B54; display:block; font-size:.7em; font-weight:bold; margin-bottom:1em;}
.deptSearch select {border:1px solid #afbcd2; color:#748EAF; font-size:.7em; padding:.2em; vertical-align:top; width:11.5em;}
.deptSearch span.filter { color:#808284; font-size:.7em; padding: .5em 0; }
.deptSearch span.filter strong {color:#002B54;}
.deptSearch span.filter a {color:#808284; font-weight:normal;}
/* staff profile */
.staffProfile h2 {float:left;}
.staffProfile dl {color:#B3B4B5; clear:both;display:block; font-size:.7em; margin-bottom:2em;}
.staffProfile dt {float:left; margin-right:.5em}
.staffProfile dd a {color:#002B54; font-weight:bold; }
/* search results */
.searchResults h2 {float:left;}
.searchResults ol {clear:both; color:#B3B4B5; font-weight:bold; margin-left:2em}
.searchResults ol li {margin-bottom:1.5em;}
.searchResults ol li a {color:#10476f; font-size:.8em; font-weight:bold;}
.searchResults ol li p {color:#808284; font-size:.8em; font-weight:normal; line-height:1.8;}
/* paging */
.paging {clear: both; width: 100%; float: left; margin: 0 0 .5em;}
.paging ul {float:right;}
.paging li {list-style:none; float:left; margin-left:1em}
.paging li a {color:#10476f; font-size:.7em;}
.paging li.selected a {font-weight:bold;}
.paging li.next a {background:url('/_common/img/arrow.gif') no-repeat 0 center; display:block; width:8px; height:2em}
.paging li.prev a {background:url('/_common/img/arrowBk.gif') no-repeat 0 center; display:block; width:8px; height:2em}
.paging li.next span, .paging li.prev span {position:absolute; left:-10000px;}
/* siteMap */
.siteMap {color:#B3B4B5; margin-left:1.2em;}
.siteMap li {margin-bottom:1.2em;}
.siteMap ul {font-size:.9em; margin:1em 0 0 4em;}
.siteMap a {color:#10476f; font-weight:bold;}
/* contact */
.contDetails {color:#808284;}
.contDetails h3 {color:#002b55; font-size:.9em; margin-bottom:1em;}
.contDetails address {font-style:normal; line-height:1.8; margin-bottom:2em}
.contDetails dt {float:left; font-weight:bold; margin-right:.5em}
.contDetails .contentFCK h3 {background:none;}
/* =5. content/FCK */
/* these will probably need to sit inside the content module reference. eg. #content h3 */
/* any heading type styles, the client will add these via the FCK styles dropdown, so you only need to add the ones you want to use. */
.contentFCK {clear:both; color:#808284; font-size:.8em; line-height:1.3;}
.contMain h2, .contentFCK h2, .contentFCK h3, .contentFCK h4 {color:#000; margin-bottom:1em}
.contentFCK p, .contentFCK ul, .contentFCK ol, .contentFCK dl {line-height:1.8; margin-bottom:2em;}
.contentFCK img,.primaryImg {margin-bottom:1.5em;}
.contentFCK blockquote {background:url('/_common/img/quote-grey-bottom.gif') no-repeat right bottom;padding: 0 20px 0 0;}
.contentFCK blockquote p {background:url('/_common/img/quote-grey-top.gif') no-repeat left top;padding: 10px 0 0 20px; font-weight:bold;}
/* list styles */
.contentFCK li {margin-left:1.3em; padding-left:.4em;}
.contentFCK ol li {margin-left:1.7em; padding:0;}
li
{
}
/* link styles, probably won't need this as it should be set above, but FCK will need it. */
.contentFCK a {color:#758fb2; font-weight:bold; }
/* paragraph formatting, probably won't need this as it should be set above, but FCK will need it. */
p
{
}
br
{
}
/* horizontal rule */
hr
{
}
/* tables */
table
{
}
caption
{
}
tr
{
}
td
{
}
/* text formatting */
em
{
}
strong
{
}
u
{
}
sub
{
}
sup
{
}
blockquote
{
}
/* images */
img
{
}
/* =6. overrides */
.deptSearch .filterButton
{
border: 0;
color:#808284;
font-weight:normal;
font-size:100%;
background: #fff;
}
.deptSearch .filterButton:hover
{
color:#002B54;
}
/*SIFR */
/*****************************************************************************
scalable Inman Flash Replacement (sIFR) version 3.
Copyright 2006 – 2008 Mark Wubben,
Older versions:
* IFR by Shaun Inman
* sIFR 1.0 by Mike Davidson, Shaun Inman and Tomas Jogin
* sIFR 2.0 by Mike Davidson, Shaun Inman, Tomas Jogin and Mark Wubben
See also and .
This software is licensed and provided under the CC-GNU LGPL.
See
*****************************************************************************/
@media screen {
.sIFR-flash {
visibility: visible !important;
margin: 0;
padding: 0;
}
.sIFR-replaced, .sIFR-ignore {
visibility: visible !important;
}
.sIFR-active p.tagline {
padding-bottom: 0;
margin-bottom: 0;
font-size: 32px;
margin-top:1.7em
}
.sIFR-active h3 {
padding-bottom: 0;
margin-bottom: 0;
font-size: 16px;
}
.sIFR-active h2 {
padding-bottom: 0;
margin-bottom: 0;
}
.sIFR-alternate {
position: absolute;
left: 0;
top: 0;
width: 0;
height: 0;
display: block;
overflow: hidden;
}
.sIFR-replaced div.sIFR-fixfocus {
margin: 0pt;
padding: 0pt;
overflow: auto;
letter-spacing: 0px;
float: none;
}
}
@media print {
.sIFR-flash {
display : none !important;
height : 0;
width : 0;
position : absolute;
overflow : hidden;
}
.sIFR-alternate {
visibility : visible !important;
display : block !important;
position : static !important;
left : auto !important;
top : auto !important;
width : auto !important;
height : auto !important;
}
}
/*
Place CSS rules for to-be-replaced elements here. Prefix by .sIFR-active
so they only apply if sIFR is active. Make sure to limit the CSS to the screen
media type, in order not to have the printed text come out weird.
*/
@media screen {
/* Example:
.sIFR-active h1 {
font-family: Verdana;
visibility: hidden;
}
*/
}