﻿@charset "utf-8";
/* GENERAL STYLING */
body {
	margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0;
}


#container ul {clear:both; margin:10px 0px;}
#container li {padding-left:12px;}
#container ul.nb li {padding-left:0px;}

/* BRANDING: */
#branding {
	padding:0 0 0 250px;
	margin:0px;
	height:161px;
	position:relative;
}

#branding h1{width:400px;}
#branding p{}
#branding h2{width:400px; margin-top:20px;}
#branding h3{width:400px; margin-top:10px;}
#branding h3 ul {width:400px; margin-left:90px;}
#branding h3 ul li {
	float:left;
	padding-left:12px;
	margin-left:10px;
}
#branding h3 ul li.first {margin-left:0px;}
#branding #styling {
width:40px;
height:78px;
position:absolute;
bottom:0px;
right:0px;
}

/* End #branding */

/* MENU: */
#menu {padding:2px 0px 0px 5px;}
#menu ul {}
#menu ul li{
	float:left; 
	padding:0px 5px 0px 0px;
	height:26px;
}

#menu ul li a{
	padding:0px 0px 0px 20px;
	display:block;
	float:left;
	height:26px;
	cursor:pointer;
}

#menu ul li a span{
	padding:0px 8px 0px 0px;
	display:block;
	float:left;
	height:26px;
}

#home ul li a.home{
	cursor:default;
}

/* End #menu */

.layout #container {
	width: 740px;  /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */
	margin: 80px auto 0 auto; /* the auto margins (in conjunction with a width) center the page */
	text-align: center;
	
}
.layout #header {
	width: 700px;
	margin : 0px 20px;  /* this padding matches the left alignment of the elements in the divs that appear beneath it. If an image is used in the #header instead of text, you may want to remove the padding. */
	padding:125px 0px 0px 0px;
}
.layout #header h1 {
	margin: 0px; /* zeroing the margin of the last element in the #header div will avoid margin collapse - an unexplainable space between divs. If the div has a border around it, this is not necessary as that also avoids the margin collapse */
	padding: 2px 15px; /* using padding instead of margin will allow you to keep the element away from the edges of the div */
	line-height:24px;
}
.layout #mainContent {
	width: 660px;
	margin:0px auto;
	padding: 0px 20px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
	text-align: left; /* this overrides the text-align: center on the body element. */
}

.layout #mainContent p{
	width: 450px;
	text-align: left; /* this overrides the text-align: center on the body element. */
}

.layout #mainContent #col1 {width:450px; float:left; padding-top:10px;}
.layout #mainContent #col2 {width:181px; float:right; padding-top:0px;}
.layout #mainContent #col2 img{display:block; padding:5px;}
.layout #mainContent #contentEnds{height:80px; width:100%; clear:both; }

.layout #footer {
	width: 748px;
	padding:0px 0px 0px 0px; /* this padding matches the left alignment of the elements in the divs that appear above it. */
	height:40px;
	margin:0px auto 10px auto;
	text-align:center;
}

#footer ul {float:right; text-align:left; padding-top:15px;}
#footer ul li{
	float:left; 
	padding:0px 5px 0px 0px;
	height:26px;
}

.layout #footer p {
	margin: 0; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
	padding: 10px 0; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
}


/* PRODUCTS PAGE */
#productlist .bicproducts {float:left; padding-left:15px; text-align:center;}
#productlist #sizes{padding-top:30px;}
#products h3#heading {margin:0px 0px 20px 0px;}

/* CONTACT US PAGE */
#userInfo label {display:block; float:left; width:80px;}

/* ArtiCAD Advert */
.layout #mainContent p#articad_ad {margin:50px 0px 0px 0px;}