/* CSS Document */

body 
{
margin: 0px;
padding: 0px;
color: #000;
background: #33363B url(../images/background.jpg) top center repeat-y;
}


/*	
SITE BODY ELEMENTS
*/

/* holds everything */
.container
{
overflow: hidden;
margin: 0px auto 20px auto;
width: 920px;
}

/* colour strips across the top of every page */
.strip1
{
margin: 0px auto;
width: 100%;
height: 10px;
background: url(../images/strip1.png) top left repeat-x;
}

.strip2
{
margin: 0px auto;
width: 100%;
height: 10px;
background: url(../images/strip2.png) top left repeat-x;
}

.strip3
{
margin: 0px auto;
width: 100%;
height: 10px;
background: url(../images/strip3.png) top left repeat-x;
}

.strip4
{
margin: 0px auto;
width: 100%;
height: 10px;
background: url(../images/strip4.png) top left repeat-x;
}

.strip5
{
margin: 0px auto;
width: 100%;
height: 10px;
background: #FFF;
}

.navbar
{
float: left;
width: 215px;
margin: 20px 0px;
}

.logo
{
float: left;
width: 240px;
margin: 0px 0px 15px 0px;
}

.contact-text
{
float: right;
width: 215px;
margin: 40px -5px 20px 0px;
}

.right-content-pink
{
float: left;
width: 600px;
margin: 20px 0px 20px 105px;
}

.right-content-green
{
float: left;
width: 600px;
margin: 20px 0px 20px 105px;
}

.right-content-purple
{
float: left;
width: 600px;
margin: 20px 0px 20px 105px;
}

.right-content-orange
{
float: left;
width: 600px;
margin: 20px 0px 20px 105px;
}

.right-content-contact
{
float: left;
width: 600px;
margin: 20px 0px 20px 105px;
}

.right-content
{
float: left;
width: 600px;
margin: 20px 0px 20px 105px;
}

.text-left
{
float: left;
width: 285px;
margin: 0px 30px 0px 0px;
}

.text-right
{
float: left;
width: 285px;
margin: 0px;
}

										/* HEADERS */


.header-home
{
float: left;
width: 600px;
height: 410px;
margin: 0px 0px 20px 0px;
background: url(../images/home1.jpg) top left no-repeat;
}


.header-services
{
float: left;
width: 600px;
height: 410px;
margin: 0px 0px 20px 0px;
background: url(../images/services1.jpg) top left no-repeat;
}

.header-accessories
{
float: left;
width: 600px;
height: 410px;
margin: 0px 0px 20px 0px;
background: url(../images/accessories1.jpg) top left no-repeat;
}

.header-doors
{
float: left;
width: 600px;
height: 410px;
margin: 0px 0px 20px 0px;
background: url(../images/doors1.jpg) top left no-repeat;
}

.header-office
{
float: left;
width: 600px;
height: 410px;
margin: 0px 0px 20px 0px;
background: url(../images/office1.jpg) top left no-repeat;
}

.header-garage
{
float: left;
width: 600px;
height: 410px;
margin: 0px 0px 20px 0px;
background: url(../images/garage1.jpg) top left no-repeat;
}

.header-classic
{
float: left;
width: 600px;
height: 410px;
margin: 0px 0px 20px 0px;
background: url(../images/classic2.jpg) top left no-repeat;
}

.header-living
{
float: left;
width: 600px;
height: 410px;
margin: 0px 0px 20px 0px;
background: url(../images/living1.jpg) top left no-repeat;
}

.header-linear
{
float: left;
width: 600px;
height: 410px;
margin: 0px 0px 20px 0px;
background: url(../images/linear1.jpg) top left no-repeat;
}

.header-officeaccs
{
float: left;
width: 600px;
height: 410px;
margin: 0px 0px 20px 0px;
background: url(../images/officeaccs1.jpg) top left no-repeat;
}

.header-dolce
{
float: left;
width: 600px;
height: 410px;
margin: 0px 0px 20px 0px;
background: url(../images/dolce1.jpg) top left no-repeat;
}

.header-stanza
{
float: left;
width: 600px;
height: 410px;
margin: 0px 0px 20px 0px;
background: url(../images/stanza1.jpg) top left no-repeat;
}

.header-franchise
{
float: left;
width: 600px;
height: 410px;
margin: 0px 0px 20px 0px;
background: url(../images/franchise1.jpg) top left no-repeat;
}


									/* NAVIGATION */

/* all lists in this menu */
#nav, #nav ul 
{ 
padding: 0;
margin: 0;
list-style: none;
float : left;
width : 225px;
}

/* all list items */	
#nav li 
{ 
position: relative;
float: left;
line-height: 1.25em;
width: 225px;
}

/* second-level lists */	
#nav li ul 
{ 
position: absolute;
left: -999em;
margin-left: 240px;
margin-top: -30px;
}
	
#nav li a 
{
width: 215px;
display: block;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 14px;
color: #FFF;
text-align: right;
text-decoration: none;
background-color: #4E5864;
padding: 5px 20px 5px 5px;
}
	
#nav li a:hover 
{
color: #FFF;
background-color: #717983;
}
	
#nav li:hover ul ul, #nav li:hover ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul 
{
left: -999em;
}
	
#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul 
{ /* lists nested under hovered list items */
left: auto;
}

										/* LIST STUFF */


.bullet
{
clear: left;
padding-left: 0px;
list-style: none;
font: 12px Verdana, Arial, Helvetica, sans-serif;
color: #FFF;
text-align: left;
line-height: 1.7em;
margin: 0px 0px 0px -8px;
}

.bullet li
{
background-image: url(../images/bullet-square.gif);
background-repeat: no-repeat;
padding-left: 22px;
background-position: 0.5em 0.2em;
margin-bottom: 10px;
}




										/* FONTS */

h1
{
clear: left;
font: 18px Verdana, Arial, Helvetica, sans-serif;
color: #FFF;
margin-top: 0px;
}

.right-content-green h1
{
color: #20B5B1;
}

.right-content-contact h1
{
color: #20B5B1;
}

.right-content-pink h1
{
color: #DE006A;
}

.right-content-purple h1
{
color: #B106C6;
}

.right-content-orange h1
{
color: #EB870F;
}

h2
{
font: 22px Verdana, Arial, Helvetica, sans-serif;
color: #FFF;
margin-top: 0px;
margin-bottom: 10px;
line-height: 1.5em;
}

h2 em
{
font-size: 13px;
font-style: normal;
}

h3
{
clear: left;
font: 16px Verdana, Arial, Helvetica, sans-serif;
color: #FFF;
margin-top: 0px;
margin-bottom: 5px;
line-height: 1.5em;
}

h4
{
clear: left;
font: 16px Verdana, Arial, Helvetica, sans-serif;
color: #FFF;
margin-top: 0px;
margin-bottom: 5px;
line-height: 1.5em;
}

p
{
font: 12px Verdana, Arial, Helvetica, sans-serif;
color: #FFF;
text-align: left;
line-height: 1.7em;
margin-top: 0px;
clear: right;
}

p.word
{
font: 12px Verdana, Arial, Helvetica, sans-serif;
color: #FFF;
clear: none;
text-align: left;
line-height: 3em;
margin-top: 0px;
background: url(../images/icon-word.png) center left no-repeat;
padding-left: 43px;
}

p.pdf
{
font: 12px Verdana, Arial, Helvetica, sans-serif;
color: #FFF;
clear: none;
text-align: left;
line-height: 3em;
margin-top: 0px;
background: url(../images/icon-acrobat.png) center left no-repeat;
padding-left: 43px;
}

.contact-text p
{
font-size: 12px;
text-align: right;
line-height: 1.5em;
}

.contact-text em
{
font-size: 16px;
font-style: normal;
}

.right-content-contact p
{
line-height: 1em;
}

p strong
{
color: #20B5B1;
font-weight: normal;
}



										/* GRAPHICS */

/* small images on the about page */
.people-thumbs
{
float: left;
width: 100px;
margin: 5px 15px 0px 0px;
}

.icon
{
float: right;
width: 32px;
margin: 5px 0px 12px 15px;
}




										/* LINKS */

											
/* standard links */
.body a:link 
{
color: #20B5B1;
text-decoration: none;
border-bottom: 1px dotted;
}

.body a:visited 
{
color: #20B5B1;
text-decoration: none;
border-bottom: 1px dotted;
}

.body a:hover 
{
color: #33363B;
background: #20B5B1;
border-bottom: 1px solid #20B5B1;
}

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

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

.whitelink a:hover 
{
color: #33363B;
background: #FFF;
border-bottom: 1px solid #FFF;
}

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

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

.sidebar a:hover 
{
color: #33363B;
background: #FFF;
border-bottom: 1px solid #FFF;
}