/*----------
	T.S. McMachon - CSS Document 
----------*/

@import url("reset.css");

/*----------	LaYoUT STYLeS	----------*/
body {
  color: #737373;
  background: #FFFFFF url(/images/core/bg.gif) repeat-x;
	font: 62.5%/1.8em Verdana, Arial, Helvetica, sans-serif;
}

#container {
  width: 805px;
  margin: 0 auto;
  font-size: 1.1em;
}

#column_right {
  float: right;
  width: 260px;
  font-family: Georgia, Verdana, Arial, sans-serif;
}

#column_left {
  float: left;
  width: 535px;
}

#text {
  text-align: justify;
}

/*----------	HeaDeR STYLeS	----------*/
#header { height: 168px; width: 535px; position: relative; }
#header img#logo { position: absolute; top: 11px; left: 100px; }

/*----------	NaViGaTIoN STYLeS	----------*/
#nav { height: 32px; position: absolute; top: 136px; left: 36px; }
#nav ul { list-style-type: none; margin: 0; }
#nav ul li { display: inline; float: left; margin-right: 4px; }
#nav ul li a { display: block; height: 32px; text-indent: -9999px; }
#nav ul li a:hover { background-position: 0 -32px !important; }
#nav ul li#home a { background: url(/images/nav/home.gif) no-repeat; width: 71px; }
#nav ul li#profile a { background: url(/images/nav/profile.gif) no-repeat; width: 87px; }
#nav ul li#products a { background: url(/images/nav/product.gif) no-repeat; width: 198px; }
#nav ul li#contact a { background: url(/images/nav/contact.gif) no-repeat; width: 96px; }

#p-home li#home a, #p-profile li#profile a, #p-product li#products a, #p-contact li#contact a {
  background-position: 0 -32px !important;
}


/*----------	CoMMoN STYLeS	----------*/
a { color: #EA913B; font-weight: bold; text-decoration: none; }
a:hover { text-decoration: underline; }
h1, h2, h3, h4 { font-family: Georgia, Verdana, Arial, sans-serif; font-weight: normal; }
h1, h2 { padding: 20px 0 0 0; }
h3, h4 { padding: 10px 0 0 0; }
h1 { color: #2860C1; font-size: 2.1em; }
h2 { font-size: 1.7em; color: #686767; }
h3 { font-size: 1.5em; color: #2860C1; }
strong { font-weight: bold; }
em { font-style: italic; }
hr { border: none; border-bottom: 1px solid #D8CEB4; margin: 10px; }
p { margin: 20px 0; }
ul { margin: 10px 30px; list-style-type: square; }
ol { margin: 10px 35px; list-style-type: decimal;}

.clear { display: block; clear: both; }
.hidden { display: none; }
.top { border-top: 1px solid #D8CEB4; text-align: right; font-size: 0.9em; margin: 10px 0; }
.font_small { font-size: 1.7em; }
.font_big { font-size: 1.8em; }

#mudmap { margin: 10px; float: right; font-size: 0.9em; width: 211px; }
img.inner_photos { float: right; margin: 10px; }



/*----------	RiGHT CoLUMN STYLeS	----------*/
#cta {
  width: 230px;
  padding: 10px 15px 10px 15px;
  text-align: justify;
  font-family: Georgia, Verdana, Arial, sans-serif;
  background: url(/images/core/cta_bg.gif) repeat-y;
}
#cta #title { color: #D1181F; padding: 20px 0 10px 0; border-bottom: double #D8CEB4; text-align: center; }
#cta h2 { border-top: 1px double #D8CEB4; border-top: double #D8CEB4; border-bottom: double #D8CEB4; text-align: center; padding-bottom: 20px; }
#cta .download { background: url(/images/core/icon-download.gif) no-repeat left; padding: 10px 0 10px 45px; }

#contact_details { padding: 20px 15px; }
#contact_details h3 { padding-bottom: 0;}

/*----------	BaNNeR STYLeS	----------*/
#banner { width: 535px; height: 289px; }


/*----------	FooTeR STYLeS	----------*/
#footer { color: #777777; background-color: #E1E1E1; width: 800px; height: 54px; display: block; clear: both; }
#footer a { color: #777777; font-weight: normal; }
#footer p { padding: 15px;}
#footer img#wflogo { float: right; margin: 20px; }


/*----------	PRoDUCT STYLeS	----------*/
#breadcrumbs { font-size: 0.9em; }
#categories ul, #listing ul { margin: 0; padding: 0; list-style-type: none; }
#categories ul li {
  float: left;
  width: 150px;
  height: 170px;
  text-align: center;
  margin: 10px;
}

#categories ul li img { display: block; margin: 0 auto; }

#listing ul li {
  clear: both;
  display: block;
  margin: 10px;
  text-align: justify;
}
#listing .picture { float: left; width: 160px; height: 150px; overflow: hidden; }
#listing .more { margin: 10px 2px; }
#listing .name { color: #2860C1;}
#listing .short_description { float: right; width: 350px; }

#details #picture { float: left; width: 200px; margin-right: 10px; }
#details #description { float: left; width: 310px; }