html
{
	background-image : url(../images/red_wall.jpg);
	background-position : top center;
	background-color : #433139;
	color : #FFF;

	height : 100%;
}

body
{
	background-image : url(../images/fade_to_black.png);
	background-repeat : repeat-x;
	
	min-height : 100%;
}

#layout
{
	margin : 0 auto 0 auto;
	padding : 20px 0 2em 0;
	width : 730px;
}

#layout.wide
{
	width : 960px;
}

#quickjump
{
    display : none;
}

#logo
{
	text-align : center;
	display : block;
	margin : 5px auto 20px auto;
}


h1, h2, h3, h4, h5, h6
{
  margin-top : 0; /* Reset margin from general.css */
}

#content-area
{
	color : #595959;
	background-color : white;
	background-image : url(../images/content_area_background_fade.gif);
	background-repeat : repeat-x;
	background-position : bottom left;
	padding : 12px;
}


#content-area:after,
#display-list-block:after
{
	/* Pulling content-area down to wrap any floated children: */
	content : "."; 
	display : block; 
	height : 0; 
	clear : both; 
	visibility : hidden;
}

#content-area-back-button
{
    width : 20em;
}

/* Drop shadow style: */
.drop-shadow
{
	position : relative;
	padding : 5px;
	background-color : white;
}

.drop-shadow .shadow-part
{
	position : absolute;
	display : block;
	
	background-repeat : no-repeat;
}

.drop-shadow .top-left
{
	background-image : url(../images/shadow_corners.png);
	background-position : top left;
	
	width : 86px;
	height : 86px;
	left : -43px;
	top : -43px;
}

.drop-shadow .top
{
	background-image : url(../images/shadow_top_bottom.png);
	background-repeat : repeat-x;
	background-position : top left;
	
	height : 43px;
	left : 43px;
	right: 43px;
	top : -43px;
}

.drop-shadow .top-right
{
	background-image : url(../images/shadow_corners.png);
	background-position : top right;
	
	width : 86px;
	height : 86px;
	right: -43px;
	top : -43px;
}

.drop-shadow .left
{
	background-image : url(../images/shadow_left_right.png);
	background-repeat : repeat-y;
	background-position : top left;
	
	width : 43px;
	left : -43px;
	top : 43px;
	bottom : 43px;
}

.drop-shadow .right
{
	background-image : url(../images/shadow_left_right.png);
	background-repeat : repeat-y;
	background-position : top right;
	
	width : 43px;
	right: -43px;
	top : 43px;
	bottom : 43px;
}

.drop-shadow .bottom-left
{
	background-image : url(../images/shadow_corners.png);
	background-position : bottom left;
	
	width : 86px;
	height : 86px;
	left : -43px;
	bottom : -43px;
}

.drop-shadow .bottom
{
	background-image : url(../images/shadow_top_bottom.png);
	background-repeat : repeat-x;
	background-position : bottom right;
	
	height : 43px;
	left : 43px;
	right: 43px;
	bottom : -43px;
}

.drop-shadow .bottom-right
{
	background-image : url(../images/shadow_corners.png);
	background-position : bottom right;
	
	width : 86px;
	height : 86px;
	right: -43px;
	bottom : -43px;
}

/* Generic button style: */
ul.button-menu
{
	list-style : none;
}

.button
{
	position : relative;
	
	padding : 0.3em;
	background-color : white;
	color : #595959;
	
	margin-bottom : 0.4em;
}

.button a
{
	display : block;
	
	background-image : url(../images/gallery_button_background_fade.gif);
	background-repeat : repeat-x;
	background-position : bottom right;
	padding : 0.3em;
	
	font-size : 150%;
	color : #595959;
	text-decoration : none;
}

.button a:hover
{
	color : #313131;
}


.button .button-part
{
	position : absolute;
	display : block;
	
	background-repeat : no-repeat;
}

.button .top-left
{
	background-image : url(../images/gallery_button_corners.png);
	background-position : top left;
	
	width : 7px;
	height : 7px;
	left : -4px;
	top : -4px;
}

.button .top
{
	background-image : url(../images/gallery_button_top_bottom.png);
	background-position : top left;
	background-repeat : repeat-x;
	
	height : 4px;
	top : -4px;
	left : 3px;
	right : 3px;
}

.button .top-right
{
	background-image : url(../images/gallery_button_corners.png);
	background-position : top right;
	
	width : 7px;
	height : 7px;
	right : -4px;
	top : -4px;
}

.button .left
{
	background-image : url(../images/gallery_button_left_right.png);
	background-position : top left;
	background-repeat : repeat-y;
	
	width : 4px;
	left : -4px;
	top : 3px;
	bottom : 3px;
}

.button .right
{
	background-image : url(../images/gallery_button_left_right.png);
	background-position : top right;
	background-repeat : repeat-y;
	
	width : 4px;
	right : -4px;
	top : 3px;
	bottom : 3px;
}


.button .bottom-left
{
	background-image : url(../images/gallery_button_corners.png);
	background-position : bottom left;
	
	width : 7px;
	height : 7px;
	left : -4px;
	bottom : -4px;
}

.button .bottom
{
	background-image : url(../images/gallery_button_top_bottom.png);
	background-position : bottom left;
	background-repeat : repeat-x;
	
	height : 4px;
	bottom : -4px;
	left : 3px;
	right : 3px;
}

.button .bottom-right
{
	background-image : url(../images/gallery_button_corners.png);
	background-position : bottom right;
	
	width : 7px;
	height : 7px;
	right : -4px;
	bottom : -4px;
}

/* Content specific buttons style: */
.button a.active
{
	background-image : url(../images/gallery_button_background_fade_active.gif);
}

.kitchen-displays a
{
	background-image : url(../images/gallery_button_background_fade_kitchens.gif);
}

.bathroom-displays a
{
	background-image : url(../images/gallery_button_background_fade_bathrooms.gif);
}

/* Front page style: */
#primary-content
{
	float : left;
	width : 330px;
}

#secondary-content
{
	float : right;
	width : 350px;
}

#main-menu-block h2,
#directions-block h2,
#contact-information-block h2,
#suppliers-block h2
{
	display : none;
}

#intro-block
{
	margin-bottom : 2em;
}

a#order-catalog-link
{
	position : absolute;
	display : block;
	background-image : url(../images/order_catalog_bubble.png);
	
	width : 102px;
	height : 97px;
	
	top : 250px;
	right : 210px;
	
	color : #614f5d;
	text-decoration : none;
	font-size : 16px;
	
	text-align : center;
	padding : 55px 20px 0px 20px;
}

#sigdal-link
{
	position :absolute;
	display : block;
	
	width : 84px;
	height : 35px;
	
	top : 393px;
	right : 20px;
	
	background-image : url(../images/sigdal_logo.png);
	text-indent : -1000%;
	overflow : hidden;
}

#contact-information-block p
{
	margin-top : 10px;
	margin-bottom : 0;
}

/* Order form style: */
#order-form-block
{
	background-image : url(../images/order_form_background.gif);
	background-position : top right;
	background-repeat : no-repeat;
	padding : 12px;
}

#content-area.order-catalog
{
	padding : 0;
}

.required-field,
.validation-error
{
	color : #AA0000;
}

#order-form
{
    margin : 0 0 1em 0;
}

#order-form label
{
    float : left;
    width : 8em;
}

#order-form input.text-field
{
    padding : 0.1em 0.3em 0.1em 0.3em;
    margin-bottom : 0.2em;
    border : 1px solid #BBB;
    
    font-family : inherit;
}

#order-form input.submit-button
{
    margin-left : 7.7em;
}

/* About page style: */
#about-photo-collage
{
    float : right;
    margin : 1em;
}

/* Gallery style: */
#gallery
{
    background-color : #999999;
    background-image : url(../images/gallery_button_list_background_fade.gif);
    background-position : bottom left;
    background-repeat : repeat-x;
}

#display-block
{
    position : relative;
    
    float : right;
    width : 700px;
    padding : 0;
    margin : 0;
    
    z-index : 10;
    
    background-color : #323232;
}

#display-block h2
{
    float : right;
    margin : 0;
    padding : 425px 10px 0 5px;
}

#display-block h3
{
    display : none;
}

#current-photo
{
    position : absolute;
    z-index : 15;
    
    top : 10px;
    right : 180px;
    
    display : block;
    border : 5px solid #121212;
}

#current-photo.loading
{
    top : 15px;
    right : 185px;
    border : 0;
}

#description
{
    margin : 0;
    padding : 425px 180px 10px 15px;
    
    background-image : url(../images/gallery_browser_background_fade.gif);
    background-position : bottom left;
    background-repeat : repeat-x;
}

#thumbnail-list
{
	display : block;
    position : absolute;
    z-index : 15;
    
    top : 10px;
    right : 10px;

    list-style : none;
}

#thumbnail-list li
{
    display : block;
}

#thumbnail-list li a
{
    display : block;
    border : 5px solid #121212;
    border-bottom : none;
}

#thumbnail-list li.last a
{
    border-bottom : 5px solid #121212;
}

#thumbnail-list li a img
{
    display : block;
}

#thumbnail-list li a img
{
	opacity: 0.8;
}

#thumbnail-list li a:hover img
{
	opacity: 1;
}

#display-list-block
{
    position : relative;
    z-index : 5;
    
    margin-right : 700px;
    padding : 10px 10px 0 10px;
}

#display-list-block h2
{
    display : none;
}

#other-menu
{
    position : absolute;
    
    bottom : 5px;
    left : 10px;
    right : 10px;
}

/* Footer style: */
#footer
{
	clear : both;
	
	position : relative;
	z-index : 200;
}

#footer #credits
{
	display : block;
}

#footer #credits li
{
	display : block;
}

#footer h2
{
	display : none;
}

#footer #wedvik-productions
{
	position : absolute;
	top : 4px;
	left : 5px;
}

#footer #wien-systems
{
	position : absolute;
	top : 3px;
	right : 5px;
}

#footer a
{
	display : block;
	text-indent : -1000%;
	overflow : hidden;
	background-position : top left;
	background-repeat : no-repeat;
}

#footer a:hover
{
	background-position : bottom left;
}

#footer #wedvik-productions a
{
	width : 67px;
	height : 6px;
	background-image : url(../images/wedvikprod_logo.png);
}

#footer #wien-systems a
{
	width : 52px;
	height : 8px;
	background-image : url(../images/wiensystems_logo.png);
}

/* Error dialog style: */
#error-box
{
	position : absolute;
	z-index : 100;
	width : 100%;
	height : 100%;
	min-height : 100%;
	top : 0;
	left : 0;
}

#error-box .error-box-overlay
{
	position : fixed;
	z-index : 110;

	top : 0;
	left : 0;
	bottom : 0;
	right : 0;

	background-color : black;
	color : white;
	
	opacity: 0.6;
}

#error-box .error-box-content
{
	position : relative;
	z-index : 120;

	background-color : black;
	color : white;
	
	opacity: 0.8;
	
	padding : 4em 3em 4em 4em;
	margin : 200px auto auto auto;
	width : 30em;
}

#error-box .error-box-content input
{
	float : right;
}

#error-box .error-box-content .text-block
{
	margin-left : 90px;
}

#error-box .error-box-content .text-block h1
{
	margin-bottom : 0.2em;
}

#error-box .error-box-content .text-block p
{
	margin-bottom : 1.0em;
}

#error-box .error-box-content img.dialog-error-image
{
	float : left;
}


