/*
----------------------------------------------------
Ashley Ann - Main Stylesheet
----------------------------------------------------
(04-06-08) (C) Navertech.
Developer: Gordon Mackay
----------------------------------------------------

@Global reset 
----------------------------------------------------*/
* {
font-size:100%;
line-height:normal;
margin:0;
padding:0
}

/*
@Generic elements 
----------------------------------------------------*/
body {
background:#24201F;
color:#FFF;
font-family:Verdana, Arial, Helvetica, sans-serif;
margin:50px 0;
padding:0
}

p,ul {
font-size:12px;
line-height:1.5;
margin:1em 0
}

p.checkboxcontainer {
background-color:#FFF;
overflow:hidden;
padding:2px 4px;
width:352px
}

.checkboxcontainer label {
color:#000;
display:block;
float:left;
width:33%
}

.checkboxcontainer input {
background-color:#F18103
}

input,select,textarea {
border:1px solid #FFF
}

select#input-showroom,input#input-name,textarea#input-address,input#input-email,input#input-phone, input#input-postcode {
padding:2px;
width:350px
}

#brochure-submit {
background:transparent;
border:none;
color:#F18103;
font-size:18px;
margin:0;
padding:0
}

h3 {
color:#F18103;
font-size:28px;
font-weight:400;
margin-bottom:6px
}

body.page-brochure h3 {
font-size:20px
}

/*
@Containers
----------------------------------------------------*/
#wrapper-a {
background:url(../images/bg_wrapper-a.jpg) no-repeat 0 0;
border:2px solid #666;
margin:0 auto;
min-height:674px;
width:974px
}

#wrapper-m {
background:url(../images/bg_wrapper-m.jpg) no-repeat 0 0;
border:2px solid #666;
margin:0 auto;
min-height:674px;
width:974px
}

#content-a {
float:left;
position:relative;
width:762px
}

#content-b {
float:left;
width:198px
}

#content-c {
clear:both;
font-size:0;
height:0
}

#content-a div.padder {
padding:70px 0 10px 69px
}

#content-b div.padder {
padding:60px 10px 10px
}

/*
@Column layout
----------------------------------------------------*/
body.page-contracts #content-a-1 {
float:left;
width:346px
}

body.page-showrooms #content-a-1,body.page-brochure #content-a-1 {
float:left;
position:absolute;
width:480px;
z-index:3000
}

body.page-contracts #content-a-2 {
float:left;
width:345px
}

body.page-contracts #content-a-1 .padder {
padding:0 10px 20px 20px
}

body.page-showrooms #content-a-1 .padder,body.page-brochure #content-a-1 .padder {
padding:0 10px 20px 0
}

body.page-contracts #content-a-2 .padder {
padding:0 20px 20px 10px
}

br#clearstuff {
clear:both
}

/*
@Branding
----------------------------------------------------*/
#branding {
position:relative
}

#branding h1,#heading-location {
left:0;
position:absolute;
top:-9999px
}

/*
@Navigation
----------------------------------------------------*/
#navigation-a {
font-size:18px;
list-style-type:none
}

#navigation-a li {
padding:0 0 24px;
text-align:center
}

#navitem-contact {
text-indent: -9999px;
width:82px;
height:43px;
overflow: hidden;
margin:14px auto 0 auto
}

#navitem-contact a {
display: block;
width:82px;
height:43px;
background:  url(../images/nav_metris.png) no-repeat 0 -43px;
}


#navitem-contact a:hover, #navitem-contact a:focus, #navitem-contact a:active {
background-position:  0 0 !important;
}

/*
@Feature Images
----------------------------------------------------*/
body.page-home #feature {
left:475px;
position:absolute;
top:-25px;
z-index:1000
}

body.page-brochure #feature {
left:420px;
position:absolute;
top:-25px;
z-index:1000
}

body.page-showrooms #feature {
height:558px;
left:400px;
position:absolute;
top:10px;
width:369px
}

body.srglasgow #feature {
background:url(../images/map_glasgow.png)
}

body.sredinburgh #feature {
background:url(../images/map_edinburgh.png)
}

body.srperth #feature {
background:url(../images/map_perth.png)
}

body.srstirling #feature {
background:url(../images/map_stirling.png)
}

body.sraberdeen #feature {
background:url(../images/map_aberdeen.png)
}

body.srinverness #feature {
background:url(../images/map_inverness.png)
}

body.srthurso #feature {
background:url(../images/map_thurso.png)
}

body.srelgin #feature {
background:url(../images/map_elgin.png)
}

body.page-contracts #feature {
left:475px;
position:absolute;
top:270px;
z-index:1000
}

#wrapper-mainimage {
height:490px
}

body.page-home #slidecontainer img {
display:none;
left:0;
position:absolute;
top:0
}

body.page-bedrooms #slidecontainer,body.page-kitchens #slidecontainer,body.page-factory #slidecontainer {
background:transparent url(../images/loading.png) no-repeat 50% 50%
}

p#caption {
background:url(../images/bg_captions.png);
bottom:0;
color:#FFF;
display:inline;
font-size:13px;
left:10px;
letter-spacing:.1em;
margin:0;
padding:6px 18px;
position:absolute;
text-shadow:#000 0 0 5px
}

/*
@Location listing
----------------------------------------------------*/
#locations {
bottom:-33px;
color:#F18103;
font-size:10px;
font-weight:700;
left:60px;
list-style-type:none;
overflow:hidden;
position:absolute;
text-transform:uppercase;
z-index:2000
}

body.page-showrooms #locations {
bottom:-30px;
left:60px
}

#locations li {
background:url(../images/bullet_locations.png) no-repeat right center;
float:left;
margin:0 0 0 15px;
padding:3px 30px 3px 0
}

#locations li.end {
background-image:none !important;
padding-right:0 !important
}

#locations a {
text-decoration:none
}

/*
@Drawer Styles
----------------------------------------------------*/
.drawer {
position:absolute;
right:0;
top:0;
width:18px
}

.drawer .drawerContent {
margin-right:0;
position:relative
}

.drawer .drawerTab {
border-right:1px solid #FFF;
cursor:pointer;
display:block;
float:left;
left:0;
position:absolute;
width:18px;
z-index:10
}

.drawer .wrap {
background:transparent url(../images/drawer_mask.png);
bottom:0;
left:18px;
overflow:hidden;
padding:0;
position:absolute;
right:0;
top:0
}

.drawer .wrap img {
float:left;
height:98px;
margin:0;
overflow:hidden;
padding:0;
width:98px
}

#drawer_panel {
height:124px;
top:0
}

body.page-kitchens #drawer_panel .drawerTab {
background:transparent url(../images/OpenKitchens.gif) center left no-repeat;
height:490px
}

body.page-bedrooms #drawer_panel .drawerTab {
background:transparent url(../images/OpenBedrooms.gif) center left no-repeat;
height:490px
}

body.page-metris #drawer_panel .drawerTab {
background:transparent url(../images/OpenKitchens.gif) center left no-repeat;
height:490px
}

#drawer_panel .drawerContent {
color:#1d1d20;
height:490px
}

.drawer a:hover img,.drawer a:focus img,.drawer a:active img,.drawer a img.current {
-moz-opacity:.80;
filter:alpha(opacity=80);
opacity:.8
}

/*
@Drawer Effect Definitions
----------------------------------------------------*/
.drawer_panel_close {
width:18px
}

.drawer_panel_open {
width:214px
}

.drawer_panel_content_close {
opacity:0;
visibility:hidden;
width:0
}

.drawer_panel_content_open {
opacity:100px;
visibility:visible;
width:300px
}

/*
@Image Hotspot Styles
----------------------------------------------------*/
div.hotspot {
border:3px solid #F18103;
font-size:13px;
height:45px;
position:absolute;
width:45px
}

div.hotspot a {
color:#000;
cursor:crosshair;
display:block;
height:45px;
text-decoration:none;
width:45px
}

div.hotspot a span {
background:transparent url(../images/bg_popup.png);
display:none;
height:300px;
position:absolute;
width:300px;
z-index:3000
}

div.hotspot a:hover span img {
padding:35px
}

ul.bluearrow li {
background:transparent url(../images/BlueArrow.gif) no-repeat 0 3px;
margin:0 0 6px;
padding:0 0 0 20px
}

/*
@Individual Image Hotspot Styles
----------------------------------------------------*/
.kitch1 {
left:320px;
top:269px
}

.detail-avantebony {
left:200px;
top:100px
}

.detail-broadoak {
left:220px;
top:180px
}

.detail-milton_ivory {
left:220px;
top:22px
}

.detail-milton_wallnut {
left:280px;
top:80px
}

.detail-nuvola-cappuccino {
left:200px;
top:180px
}

.detail-opus-black-gloss {
left:300px;
top:180px
}

.detail-ultra_latte {
left:10px;
top:240px
}

.detail-ultra_white {
left:200px;
top:60px
}

.detail-valais {
left:370px;
top:140px
}

.detail-valais a:hover span {
display:block;
right:48px;
top:10px
}

.detail-opus-morello {
left:316px;
top:264px
}

/*
@Individual Kitchen Image Styles (k1,k2,k3... get the picture?)
---------------------------------------------------------------*/
body.k1 #wrapper-mainimage {
background:url(../images/kitchen_morello.jpg) no-repeat 0 0
}

body.k2 #wrapper-mainimage {
background:url(../images/kitchens/AvantEbony.jpg) no-repeat 0 0 !important
}

body.k3 #wrapper-mainimage {
background:url(../images/kitchens/BroadoakNaturalL.jpg) no-repeat 0 0
}

body.k4 #wrapper-mainimage {
background:url(../images/kitchens/MiltonIvoryL.jpg) no-repeat 0 0
}

body.k5 #wrapper-mainimage {
background:url(../images/kitchens/MiltonWallnutL.jpg) no-repeat 0 0
}

body.k6 #wrapper-mainimage {
background:url(../images/kitchens/NUVOLA%20CAPPUCCINO%201.jpg) no-repeat 0 0
}

body.k7 #wrapper-mainimage {
background:url(../images/kitchens/OPUS_BLACK_GLOSS_485-26.jpg) no-repeat 0 0
}

body.k8 #wrapper-mainimage {
background:url(../images/kitchens/ultra-latte.jpg) no-repeat 0 0
}

body.k9 #wrapper-mainimage {
background:url(../images/kitchens/ultraWhite.jpg) no-repeat 0 0
}

body.k10 #wrapper-mainimage {
background:url(../images/kitchens/ValaisL.jpg) no-repeat 0 0
}

/*
@Individual Bedroom Image Styles (b1,b2,b3... get the picture?)
---------------------------------------------------------------*/
body.b1 #wrapper-mainimage {
background:url(../images/bedrooms/ivoryshaker.jpg) no-repeat 0 0
}

body.b2 #wrapper-mainimage {
background:url(../images/bedrooms/BedCamilloOak.jpg) no-repeat 0 0
}

body.b3 #wrapper-mainimage {
background:url(../images/bedrooms/BlackPisa.jpg) no-repeat 0 0
}

body.b4 #wrapper-mainimage {
background:url(../images/bedrooms/CappuccinoVeniceBlack.jpg) no-repeat 0 0
}

body.b5 #wrapper-mainimage {
background:url(../images/bedrooms/CappuccinoVeniceBrown.jpg) no-repeat 0 0
}

body.b6 #wrapper-mainimage {
background:url(../images/bedrooms/MapleVenice.jpg) no-repeat 0 0
}

body.b7 #wrapper-mainimage {
background:url(../images/bedrooms/RedModena.jpg) no-repeat 0 0
}

body.b8 #wrapper-mainimage {
background:url(../images/bedrooms/RivenLimeVenice.jpg) no-repeat 0 0
}

body.b9 #wrapper-mainimage {
background:url(../images/bedrooms/SlopingCeiling.jpg) no-repeat 0 0
}

body.b10 #wrapper-mainimage {
background:url(../images/bedrooms/WhiteVenice.jpg) no-repeat 0 0
}

/*
@Individual Metris Image Styles (m1,m2,m3... get the picture?)
---------------------------------------------------------------*/
body.m1 #wrapper-mainimage {
background:url(../images/metris/wavecurve.jpg) no-repeat 0 0
}

body.m2 #wrapper-mainimage {
background:url(../images/metris/richmix.jpg) no-repeat 0 0
}

body.m3 #wrapper-mainimage {
background:url(../images/metris/geometric.jpg) no-repeat 0 0
}

body.m4 #wrapper-mainimage {
background:url(../images/metris/PeninsularCurve.jpg) no-repeat 0 0
}

body.m5 #wrapper-mainimage {
background:url(../images/metris/fittedcurve.jpg) no-repeat 0 0
}

body.m6 #wrapper-mainimage {
background:url(../images/metris/seamless.jpg) no-repeat 0 0
}

.vcard .email {
float:right
}

#map-showrooms li {
height:30px;
margin:0;
overflow:hidden;
padding:0;
position:absolute;
text-indent:9999px;
width:65px;
z-index:5000
}

#map-showrooms li a {
display:block;
height:30px;
width:65px
}

#showroom-glasgow {
left:507px;
top:343px
}

#showroom-edinburgh {
left:575px;
top:325px
}

#showroom-stirling {
left:510px;
top:302px
}

#showroom-perth {
left:550px;
top:270px
}

#showroom-aberdeen {
left:615px;
top:184px
}

#showroom-elgin {
left:595px;
top:134px
}

#showroom-inverness {
left:515px;
top:154px
}

#showroom-thurso {
left:560px;
top:26px
}

img,body.page-showrooms #textcontainer,body.page-brochure #textcontainer {
border:none
}

a:link,a:visited,#locations a:hover,#locations a:focus,#locations a:active {
color:#F18103
}

#navigation-a li a,p#caption a {
color:#FFF;
text-decoration:none
}

ul.bluearrow,#map-showrooms {
list-style-type:none;
margin:0;
padding:0
}

.detail-avantebony a:hover span,.detail-broadoak a:hover span {
display:block;
left:48px;
top:-50px
}

.detail-milton_ivory a:hover span,.detail-milton_wallnut a:hover span,.detail-nuvola-cappuccino a:hover span,.detail-opus-black-gloss a:hover span,.detail-ultra_white a:hover span {
display:block;
left:48px;
top:10px
}

.detail-ultra_latte a:hover span,.detail-opus-morello a:hover span {
display:block;
left:48px;
top:-100px
}

label,a:hover,a:focus,a:active,#navigation-a li a:hover,#navigation-a li a:focus,#navigation-a li a:active,#navigation-a li a.current,p#caption a:hover,p#caption a:focus,p#caption a:active,#locations a:link,#locations a:visited {
color:#F18103
}

#slidecontainer,#textcontainer {
border-bottom:2px solid #F18103;
border-left:2px solid #F18103;
border-top:2px solid #F18103;
min-height:490px;
overflow:hidden;
position:relative;
}

body.page-test #textcontainer
{
max-height:490px !important;
min-height: 490px;
}

#wrapper-mainimage img,.vcard b,.email span {
display:none
}

body.page-brochure #textcontainer {
min-height: 520px;
}

form p
{
margin: 0;
padding: 0 0 10px 0;
}

.freedelivery
{
	text-transform: uppercase;
	color:#F18103;
	margin: -5px 0 0 0;
	line-height: 1.2em !important;
	padding: 0 0 5px 0 !important;
	font-size: 15px;
	letter-spacing: 0.2em;
}


#viewmore
{
	padding: 5px 20px 5px 0;
	color:#FFF;
	text-decoration: none;
	background: url(/images/exnext.png) no-repeat 100% 50%;
	font-size:14px;
}

#viewprevious
{
	padding: 5px 0 5px 20px;
	color:#FFF;
	text-decoration: none;
	background: url(/images/exprev.png) no-repeat 0 50%;
	font-size:14px;
}

