/*

"It's 106 miles to Chicago, we got a full tank of gas, half a pack of cigarettes, it's dark, and we're wearing sunglasses."

filename: main.css
author: Matthew Lodge
email: matt@palmiero-design.co.uk
company: Palmiero Design
copyright: 2009 Palmiero Design Ltd
date: Thursday 5th March

content order:

*/

@import url(reset.css);
@import url(mediabox.css);
@import url(formcheck.css);

/*-- general --*/
html, body {
height:100%;
}

body {
color:#333333;
font-family:Arial, Helvetica, sans-serif;
font-size:1em;

background:#bcbdc0 url(../imgs/bck_body.png) top repeat-x;
}

p, table {
font-size:0.75em;
line-height:1.125em;
margin:0em 0em 1em 0em;
}

ul, dd {
font-size:0.75em;
line-height:1.125em;
}

ul ul {
font-size:1em;
}

em {
font-style:italic;
}

strong {
font-weight:bold;
}

span {
display:none;
}

p.intro span { display:inline; }

hr {
border-top:none;
border-left:none;
border-right:none;
border-bottom:1px dotted #333333;
height:1px;
padding:0px;
}

img, a img {
color:#333333;
font-size:0.75em;
}

.float-right {
float:right;
}

.float-left {
float:left;
}

.clear {
clear:both;
}

/*-- specific typo --*/
.intro {
font-size:0.875em;
}

.large {
font-size:1em;
margin:0em;
}

.larger {
font-size:1.313em;
}

.fourteen {
font-size:0.875em;
}

.eighteen {
font-size:1.125em;
}

.small {
font-size:0.687em;
}

#main-content .large, #main-folio .large {
margin:1em 0em;
}

.subtitle {
margin:-.75em 0em 1em 0em;
}

/*-- links --*/
a:link {
border-bottom:1px dotted;
color:#F15D22;
text-decoration:none;
}

a:visited {
border-bottom:1px dotted;
color:#EC884B;
text-decoration:none;
}

a:hover {
border-bottom:1px dotted;
color:#C7135B;
}

#q1 a:link, #q2 a:link, #q3 a:link {
color:#333333;
}

#q1 a:hover, #q2 a:hover, #q3 a:hover {
color:#F15D22;
}

a.order-now, #bannerspace a, #header a, a.proceed, #main-welcome .rightside a {
border:none;
}

#folio-selection a:link, #folio-selection a:visited {
border:none;
color:#333333;
}

#folio-selection a:hover {
border:none;
color:#F15D22;
}

.clearview #folio-selection #n_logo-clearview,
.optimise #folio-selection #n_logo-optimise,
.expoteam #folio-selection #n_logo-expoteam,
.sia #folio-selection #n_brochure-sia,
.solatube #folio-selection #n_brochure-solatube,
.annodata #folio-selection #n_brochure-annodata,
.clearview #folio-selection #n_website-clearview,
.optimise #folio-selection #n_website-optimise,
.jgcontractors #folio-selection #n_website-jgcontractors {
color:#F15D22;
}

h4 a:link, h4 a:visited {
border:none;
color:#ffffff;
}

#three-examples a:link, #three-examples a:visited {
border:none;
}

/*-- h1 --*/
h1 {
bottom:10px;
position:absolute;
}

h1 a {
background:url(../imgs/h1_logo.gif) no-repeat;
display:block;
height:70px;
width:140px;
}

h1 a:hover {
border-bottom:none;
}

/*-- h2 --*/
h2 {
color:#F15D22;
font-size:1.313em;

margin:0em 0em .75em 0em;
}

.h2 {
color:#F15D22;
font-size:1.313em;
clear:left;

margin:1em 0em;
}

.rightside h2 {
color:#F15D22;
font-size:1.313em;

margin:0em 0em .75em 0em;
}

#home #main-packages h2, #home #main-welcome h2 {
background:#000000;
color:#ffffff;
padding:5px 10px 7px;
}

h2.steps, .portfolio #three-examples h2 {
border-bottom:1px dotted #333333;
margin:0em 0em .50em 0em;
padding:0em 0em .25em 0em;
}

#form h2, .h2 {
font-weight:bold;
}

.packages .rightside h2 {
border-bottom:none;
color:#D51920;
font-size:1.313em;
font-weight:bold;

margin:0em;
padding:0em;
}

/*-- h3 --*/
h3 {
border-bottom:1px dotted #333333;
color:#F15D22;
font-size:1em;
line-height:1.125em;

margin:1em 0em .75em 0em;
padding:0em 0em .25em 0em;
}

.leftside h3 {
border:none;
}

.rightside h3 {
margin-top:0em;
}

.option h3 {
color:#333333;
margin-bottom:0em;
}

#glos h3 {
border-bottom:1px dotted #333333;
color:#F15D22;
font-weight:bold;
margin-top:2em;
}

/*-- h4 --*/
h4 {
color:#FFFFFF;
font-size:1.313em;
font-weight:bold;

text-shadow:2px 2px 3px #999999;
}

/*-- h5 --*/
h5 {
color:#333333;
font-size:1em;

margin:1em 0em .75em 0em;
padding:0em 0em .25em 0em;
}

/*-- colours --*/
.orange, .packages .rightside .orange {
color:#F15D22;
}

.purple, .packages .rightside .purple, .portfolio .rightside .purple {
color:#D75BA2;
}

.green, .packages .rightside .green, .portfolio .rightside .green {
color:#74B74A;
}

/*--- tables ---*/
.column-01 table, .column-02 table {
width:100%;
}

.column-01 th, .column-02 th {
font-weight:bold;
padding:5px 10px 5px 0px;
vertical-align:top;
}

.column-01 th {
width:140px;
}

.column-02 th {
width:75px;
}

.column-01 td, .column-02 td {
vertical-align:top;
background:#f1f1f1;
border-bottom:2px solid #ffffff;
padding:5px;
width:auto;
}

/*-- layout --*/
#wrap {
background:#ffffff;
height:auto;
margin:0px auto;
overflow:auto;
padding:0px 25px;
position:relative;
width:800px;
}

#header {
background:#F05323 url(../imgs/bck_header.png) repeat-x;
border-bottom:2px solid #F05323;
height:140px;
left:0px;
margin:0px 0px 20px -25px;
position:relative;
top:0px;
width:850px;
}

.article {
background:#ffffff;
float:left;
display:block;
height:auto;
margin:0px 0px 15px 0px;
position:relative;
width:800px;
}

#footer {
border-top:2px solid #4D4D4D;
color:#ffffff;
font-size:0.785em;

background:#262626;
clear:both;
display:block;
height:auto;
margin:0px 0px 0px -25px;
padding:25px;
position:relative;
width:800px;
}

/*-- header --*/
#subtitle {
color:#ffffff;
font-size:1.063em;

bottom:9px;
position:absolute;
right:0px;
}

#action {
position:absolute;
right:0px;
top:40px;
}

#action li {
float:left;
margin:0px;
padding:0px;
position:relative;
}

#act-phone {
background:url(../imgs/act_phone.gif) no-repeat;
display:block;
height:45px;
width:175px;
}

#act-online {
background:url(../imgs/act_online.gif) no-repeat;
display:block;
height:45px;
width:190px;
}

/*-- refresh --*/
#refresh {
background:url(../imgs/refresh.png) 0px 10px no-repeat;
display:block;
height:295px;
}

#refresh #guide {
display:block;
height:75px;
left:-5px;
top:200px;
position:relative;
width:485px;
}

#refresh #guide fieldset {
display:block;
height:60px;
margin:0;
padding:0;
width:485px;
}

#refresh input#guide_name, #refresh input#guide_surname, #refresh input#guide_email, #refresh input#guide_phone {
background:url(../imgs/input_rounded.png) 0px 0px no-repeat;
border:none;
float:left;
font-size:0.75em;
height:14px;
margin:0px 10px 5px 0px;
padding:4px;
width:182px;
}

#refresh input#guide_name:hover, #refresh input#guide_surname:hover, #refresh input#guide_email:hover, #refresh input#guide_phone:hover {
background:url(../imgs/input_rounded.png) 0px -22px no-repeat;
}

#refresh input#guide_submit {
background:url(../imgs/send-orange.png) 0px 0px no-repeat;
border:none;
cursor:pointer;
display:block;
float:left;
height:24px;
margin:-1px 0px 0px 0px;
width:83px;
}

#refresh input#guide_submit:hover {
background-position:0px -32px;
}


/*-- main-content --*/
#main-content {
overflow:hidden;
}

#main-content img {
border:4px solid #cccccc;
float:right;
}

#main-content .worth-star {
border:none;
}

#main-content .leftside {
border-right:1px dotted #333333;
float:left;
margin:0px 0px -10000px 0px;
padding:0px 11px 10015px 0px;
width:528px;
}

#main-content .rightside {
float:left;
margin:0px 0px -10000px 0px;
padding:0px 0px 10015px 12px; 
width:248px;
}

/*-- main-welcome --*/
#main-content, #main-folio, #glos, .portfolio #three-examples, #form #main-welcome {
border-top:1px dotted #333333;
padding:25px 0px 0px 0px;
}

#main-welcome .leftside, #main-folio .leftside, #main-form .leftside {
float:left;
padding:0px 12px 0px 0px;
width:528px;
}

#main-welcome .rightside, #main-folio .rightside, #main-form .rightside {
float:left;
width:260px;
}

.packages #steps {
float:left;
margin:0px 0px 16px 0px;
}

#steps li {
display:block;
height:37px;
margin:0px 0px 2px 0px;
position:relative;
width:258px;
}

.packages #steps li {
display:inline-block;
float:left;
margin:0px 13px 0px 0px;
}

.packages #steps #step03 {
margin:0px 0px 0px 0px;
}

#step01 {
background:url(../imgs/step_01.gif) no-repeat;
}

#step02 {
background:url(../imgs/step_02.gif) no-repeat;
}

#step03 {
background:url(../imgs/step_03.gif) no-repeat;
}

#step04 {
padding:8px 0px 0px 0px;
}

/*-- main-packages --*/
.option {
background:#ffffff;
display:block;
float:left;
height:auto;
margin:0px 10px 25px 0px;
width:260px;
}

.option.last {
margin-right:0px;
}

.option ul {
line-height:1.25em;
list-style-image:url(../imgs/dash.gif);
margin:15px 0px 15px 10px;
}

.option a.findmore {
background:url(../imgs/find-out-more.png) no-repeat;
border-bottom:none;
display:block;
height:30px;
width:122px;
}

.option a.orange {
background-position:0px 0px;
}

.option a.purple {
background-position:0px -41px;
}

.option a.green {
background-position:0px -82px;
}

a.orange:hover, a.purple:hover, a.green:hover {
background-position:-134px 0px;
}

#option-spacer {
border-top:1px dotted #333333;
clear:both;
display:block;
height:15px;
width:100%;
}

#q1 {
background:url(../imgs/arrow-orange.png) no-repeat;
padding-left:26px;
}

#q2 {
background:url(../imgs/arrow-purple.png) no-repeat;
padding-left:26px;
}

#q3 {
background:url(../imgs/arrow-green.png) no-repeat;
padding-left:26px;
}

.order-now {
display:block;
height:30px;
margin:0em 0em 1em 0em;
width:122px;
}

p .order-now {
display:inline;
float:right;
height:30px;
margin:-5px 0px 16px 10px;
width:122px;
}

#corp-id .order-now:hover, #print-des .order-now:hover, #web-des .order-now:hover {
background:url(../imgs/order-now.png) -2px 0px no-repeat;
border-bottom:none;
}

#corp-id .order-now {
background:url(../imgs/order-now.png) -125px 0px no-repeat;
}

#print-des .order-now {
background:url(../imgs/order-now.png) -125px -30px no-repeat;
}

#web-des .order-now {
background:url(../imgs/order-now.png) -125px -60px no-repeat;
}

/*-- three examples --*/
#three-examples div {
background:#CCCCCC;
overflow:auto;
padding:10px 11px;
width:778px;
}

#three-examples div img {
display:block;
float:left;
height:165px;
margin:0px 11px 0px 0px;
width:252px;
}

#three-examples div img.last {
margin:0px;
}

#three-examples li {
float:left;
margin:0px 10px 0px 0px;
}

#three-examples li img {
border:4px solid #CCCCCC;
}

#three-examples li.last {
margin:0px;
}

/*-- bannerspace --*/
#bannerspace {
border-top:1px dotted #333333;
padding:5px 0px 0px 0px;
}

#bannerspace a:hover {
border-bottom:none;
}

#bannerspace .terms {
bottom:5px;
cursor:pointer;
display:block;
height:21px;
position:absolute;
right:5px;
width:121px;
}

#bannerspace .terms:hover {
border:2px solid #F15D22;
background:rgba(241, 93, 34, 0.2);
}

/*-- portfolio --*/
#main-folio img {
border:1px solid #cccccc;
margin:0em 0em 1em 0em;
}

#folio-selection {
margin:0em 0em 2em 0em;
}

#folio-selection li {
border-bottom:1px dotted #333333;

padding:3px 0px;
}

/*-- contact --*/
#map {
border:1px solid #cccccc;
display:block;
float:left;
height:248px;
margin:0px 15px 0px 0px;
width:518px;
}

#contactform, #contactform ul {
margin:0px;
padding:0px;
width:528px;
}

#contactform li {
clear:none;
display:block;
float:left;
margin:0px 15px 0px 0px;
width:254px;
}

#contactform .last {
margin:0px 0px 0px 0px;
}

#contactform input {
width:248px;
}

#contactform textarea {
width:518px;
}

#contactform input.submit {
background:url(../imgs/btn-send.png) -90px 0px no-repeat;
cursor:pointer;
display:block;
float:right;
height:36px;
margin:10px -5px 0px 0px;
padding:0px;
width:90px;
border:none;
}

#contactform .submit:hover {
background:url(../imgs/btn-send.png) 0px 0px no-repeat;
}

/*-- glossary --*/

#glos .leftside {
border-right:1px dotted #333333;
float:left;
margin:0px;
padding:0px 11px 15px 0px;
width:528px;
}

#glos .rightside {
float:left;
margin:0px;
padding:0px 0px 15px 12px; 
width:248px;
}

dt {
color:#F15D22;
margin-bottom:0.25em;
}

dd {
display:block;
margin-bottom:1.5em;
padding-bottom:1em;
position:relative;
}

dd .top {
bottom:0px;
position:absolute;
right:0px;
}

/*-- order forms --*/
#form #main-welcome p {
width:580px;
}

form {
clear:both;
display:block;
height:auto;
margin:0px;
padding:0px;
}

form ul {
display:block;
margin:-1.5em 0em 2em 0em;
}

form li {
clear:both;
display:block;
float:none;
position:relative;
height:auto;
}

form li.select {
clear:none;
float:left;
width:150px;
}

#form-logo-01 .column-01, 
#form-logo-05 .column-01, 
#form-brochure-01 .column-01, 
#form-brochure-05 .column-01, 
#form-brochure-02 .column-01, 
#form-brochure-03 .column-01,
#form-website-01 .column-01,
#form-website-02 .column-01,
#form-website-03 .column-01,
#form-website-05 .column-01 {
display:block;
float:left;
margin:0px 12px 0px 0px;
width:528px;
}

#form-logo-01 .column-02, 
#form-logo-05 .column-02, 
#form-brochure-01 .column-02, 
#form-brochure-05 .column-02,
#form-brochure-02 .column-02, 
#form-brochure-03 .column-02,
#form-website-01 .column-02,
#form-website-02 .column-02,
#form-website-03 .column-02,
#form-website-05 .column-02 {
display:block;
float:left;
margin:0px 0px 0px 0px;
width:260px;
}

.column-01 {
display:block;
float:left;
margin:0px 18px 0px 0px;
width:255px;
}

.column-02 {
display:block;
float:left;
margin:0px 17px 0px 0px;
width:255px;
}

.column-03 {
border-top:1px dotted #333333;
display:block;
float:left;
margin:33px 0px 0px 0px;
padding:6px 0px 0px 0px;
width:255px;
}

#form-website .column-03, #form-website-04 .column-03 {
border-top:none;
margin:0px;
padding:0px;
}

#form-logo-04 .column-02, #form-website .column-02, #form-website-04 .column-02 {
padding-top:68px;
}

#form-brochure-04 .column-02 {
padding-top:55px;
}

#form-logo-03 .column-01 .larger, #form-logo-03 .column-02 .larger {
border-bottom:1px dotted #333333;
padding:0em 0em 0.25em 0em;
margin:1em 0em 0.75em 0em;
}

.form-heading {
border-bottom:1px dotted #333333;
font-size:1.143em;
margin:1em 0em .50em 0em;
padding:0em 0em .25em 0em;
}

input, textarea {
font-family:Arial, Helvetica, sans-serif;
font-size:1em;
background:#ebebeb;
border:1px solid #dbdbdb;
color:#333333;
padding:.15em .25em;
}

textarea {
height:100px;
}

#form-logo-01 .column-01 input, 
#form-logo-01 .column-01 textarea, 
#form-brochure-01 .column-01 input, 
#form-brochure-01 .column-01 textarea, 
#form-brochure-03 .column-01 input, 
#form-brochure-03 .column-01 textarea,
#form-website-01 .column-01 input, 
#form-website-01 .column-01 textarea,
#form-website-02 .column-01 input, 
#form-website-02 .column-01 textarea {
width:510px;
}

#form-logo-01 .column-02 input, 
#form-logo-01 .column-02 textarea, 
#form-brochure-01 .column-02 input, 
#form-brochure-01 .column-02 textarea, 
#form-brochure-03 .column-02 input, 
#form-brochure-03 .column-02 textarea {
width:252px;
}

.column-01 input, 
.column-01 textarea, 
.column-02 input, 
.column-02 textarea, 
.column-03 input, 
.column-03 textarea {
width:245px;
}

label {
display:block;
height:auto;
margin:1.5em 0em 0.25em 0em;
position:relative;
width:auto;
}

.label {
margin:1.5em 0em 0.5em 0em;
}

input:hover, textarea:hover {
background:#fbfbfb;
}

.checkbox {
clear:none;
display:block;
float:left;
width:130px;
margin:0px 0px 8px 0px;
}

#form-logo-03 .column-01 .checkbox, 
.column-02 .checkbox, 
#form-logo-04 .column-01 .checkbox,
#form-website .column-01 .checkbox,
#form-website-01 .column-01 .checkbox, #form-website-04 .column-01 .checkbox {
float:none;
width:260px;
}

#form-website .column-01 .checkbox, #form-website-04 .column-01 .checkbox {
width:510px;
}

.checkbox label {
display:block;
margin:-15px 0px 0px 25px;
}

input.radio, 
#form-logo-01 .column-01 input.radio, 
#form-logo-01 .column-02 input.radio {
background:transparent;
border:none;
display:block;
width:13px;
height:13px;
padding:0px;
margin:0px;
position:relative;
top:-1px;
}

.module {
clear:none;
display:block;
float:left;
height:auto;
margin:0px;
padding:5px 0px 15px 0px;
position:relative;
width:170px;
}

.module img {
border:1px solid #999999;
display:block;
height:110px;
margin:0px 0px -15px 0px;
position:relative;
width:160px;
}

.module .radio {
display:block;
float:left;
margin:-15px 0px 0px 0px;
width:auto;
z-index:10;
}

.module label {
margin:-15px 0px 0px 20px;
}

.submit, 
#form-logo-01 .column-01 .submit, 
.column-01 .submit, 
.column-02 .submit, 
#form-brochure-01 .column-02 .submit, 
.column-03 .submit, 
#form-brochure-03 .column-02 .submit,
#form-website-01 .column-01 .submit {
cursor:pointer;
display:block;
float:right;
height:30px;
margin:10px 0px 0px 0px;
padding:0px;
width:123px;
border:none;
}

.column-03 .submit {
position:absolute;
bottom:0px;
right:0px;
}

#next-logo-02, #next-brochure-02, #next-website-02 {
position:absolute;
right:0px;
top:-5px;
}

#next-logo-01, #next-logo-02 {
background:url(../imgs/next-step.png) -124px 0px no-repeat;
}

#next-brochure-01, #next-brochure-02 {
background:url(../imgs/next-step.png) -123px -30px no-repeat;
}

#next-website-01, #next-website-02 {
background:url(../imgs/next-step.png) -123px -61px no-repeat;
}

#next-logo-01:hover, #next-brochure-01:hover, #next-website-01:hover, #next-logo-02:hover, #next-brochure-02:hover, #next-website-02:hover {
background:url(../imgs/next-step.png) 0px 0px no-repeat;
}

#submit-logo, #contactform .submit {
background:url(../imgs/place-order.png) -124px 0px no-repeat;
}

#submit-brochure {
background:url(../imgs/place-order.png) -123px -30px no-repeat;
}

#submit-website {
background:url(../imgs/place-order.png) -123px -61px no-repeat;
}

#submit-logo:hover, #submit-brochure:hover, #submit-website:hover {
background:url(../imgs/place-order.png) 0px 0px no-repeat;
}

#form img {
margin:0px 0px 20px 0px;
}

#package-cost {
display:block;
position:absolute;
right:0px;
top:115px;
}

#costs h2 {
clear:both;
margin:1.5em 0em 0.19em 0em;
}

#package-cost h2, .column-03 h2 {
clear:both;
margin:0em 0em 0.19em 0em;
}

#package-cost label, .column-03 label, #costs label, .subcost label {
display:inline-block;
float:left;
margin:0px;
padding:1px 0px 0px 0px;
font-weight:bold;
}

#sum, #extracost, .column-01 input#printcost, .column-01 input#artcost, #form-brochure-01 .column-02 .subcost input {
background:#ffffff;
border:none;
display:inline-block;
float:left;
font-weight:bold;
margin:-1px 0px 0px 0px;
padding:0px;
width:130px;
}

.subcost {
font-size:1.25em;
top:15px;
}

.subcost .h2 {
padding:3px 0px 0px 0px;
}

.column-01 .subcost {
top:-10px;
}

.column-02 .subcost label {
width:110px;
}

#total {
font-size:1.25em;
}

#log_res p {
display:block;
float:left;
margin:15px 0px 5px 0px;
padding:10px;
position:relative;
text-align:center;
width:776px;
}

#logres p {
display:block;
margin:0px;
padding:2px 5px;
position:relative;
}

#home #log_res p { 
	margin-top:0px;
	padding:5px;
	text-align:left;
}

#contactform #log_res p {
width:506px;
}

#log_res .success, #logres .success {
border:2px solid #00CC00;
background:#CCFFCC;
}

#log_res .error, #logres .error {
border:2px solid #CC0000;
background: #FFCCFF;
}

/* "Hit it! */