/* CSS Document */

/* ------------------------------
H3 Web Boutiqueh
Markham, ON L6B 1B5
Canada
=1 905-294-3403
http://www.h3webboutique.com
------------------------------- */

/* ******************** GENERAL ******************** */

* {margin: 0; padding: 0; border: 0; outline: 0; color: #2d3322;}
html {height: 100%;}
body {height: 100%; font-family: Verdana, Corbel, Tahoma, sans-serif; font-size: 75%; text-align: center; }
html>body {font-size: 12px;}
h1 {font-size: 1.5em; line-height: 1em; margin-bottom: 1.5em; margin-top: 3em; }
h2 {display:block; font-size: 1.1667em; line-height: 1.4; margin-top:2.572em; margin-bottom: 1.286em; font-weight:bold; color: #879865;}
h3 {font-size: 1em; line-height: 1.5em; margin-top: 1.5em; margin-bottom: 1.5em; color: #879865;}
h4 {font-size: 0.8333em; line-height: 1.8em; margin-top: 0.5em; margin-bottom: 0.5em;}
p {margin: 1.5em 0; font-size: 1em; line-height: 1.5em; }
p.intro {display:block; font-size: 1.1667em; line-height: 1.4; margin-top:1.286em; margin-bottom: 1.286em; font-weight:bold; color: #879865;}
a {color:#333;}
a:visited {color:#333;}
a:focus {outline: 3px dotted #FBB90D;}
a:hover{color: #EDB115;}
h1 a {text-decoration:none; border:0;}
ul {list-style: none;}
ul.disc { list-style-position:inside; list-style:disc; line-height: 1.5em; padding-left: 25px;}
ol {list-style:outside; list-style-type:decimal; line-height: 1.5em; padding-left: 25px;}
abbr, acronym {cursor: help; color:inherit; border-bottom: 1px dotted #333;}
h2 acronym {cursor:help; color:#879856;}

/* ****************** GLOBAL CLASSES ******************** */
h2.testimonial { padding-top:2em; border-top: 1px solid #879865;}

p.logotext {margin:0; padding: 25px 0 20px 65px; text-transform:uppercase; font: bold 2em Corbel, Verdana, Tahoma, sans-serif; }
p.logotext a {font-size: 1.5em; line-height: 1em; margin-bottom: 1.5em; margin-top: 0; padding: 75px 0 20px 15px; text-transform:uppercase; font: bold 2em Corbel, Verdana, Tahoma, sans-serif;background-color: transparent; border: none; }
p.logotext a:hover{color: #FBB90D;}
p.topofpage {font-size: .75em;}
p.reference {font-style: italic;}

img.padded {margin-bottom:30px;}
img.quote { margin-left: -10px; padding: 0;}
img.endquote {padding: 0px 0px 5px 190px;}	

.amp {font: italic 100% "Goudy Old Style", Palatino, "Book Antiqua", serif; color: inherit; font-weight:inherit;}
.note {font-style: italic;}
.print {display:none;}

/* ******************** STRUCTURE ******************** */

#container {width: 780px; min-height: 100%; margin: 0 auto; text-align: left;}

/* ---------- skip navigation ----------*/
#skip {margin: 0; padding: 0 5px 0 0; font: .8333em Verdana, Candara, Tahoma, sans-serif; text-align: right; }
#skip ul li {display:inline; padding:0 5px; border-right: #879865 solid 1px; }
#skip a {color: #333; }
#skip ul li.skiplast {border-right: none;}
#skip a:hover {color: #EDB115; }

/* -------------- HEADER --------------*/
#header {background: #fff  url(../images/h3-logo7.gif) left no-repeat; overflow: hidden; height: 80px; }
#header h1 {margin:0; padding: 25px 0 40px 65px; text-transform:uppercase; font: bold 2em Corbel, Verdana, Tahoma, sans-serif;}
#header p {margin:0; padding: 2px 0 0 65px; text-transform:uppercase; color:#879865; font-weight:bold; font-size:0.875em;/**/}

/* -------------- PICTURE --------------*/
#picture {width: 780px; border-bottom: 15PX solid #B4CB86;}
#picture a, #picture a:hover {background-color: transparent; border: none; }

/* ---------- MAIN NAVIGATION ---------- */
#nav {background-color: #b4cb86; overflow: inherit; height: 2.5em; margin: 0; padding: 0;}
#nav ul {list-style: none; margin: 0; padding: 0;}
#nav li {display: block; float: left; width: 156px; line-height: 2.5em;}
#nav li a {text-decoration:none; display: block; border: none; font-weight: bold; font-size: 1em; text-align: center; color: #fff;}
#nav li:hover, #nav li.sfhover {background-color: #fbb90d; outline:none;}
#home #nav-home a, #what #nav-what a, #how #nav-how a, #done #nav-done a, #contact #nav-contact a, #client #nav-client a {background-color: #879865;}
#nav li a:visited {color:#fff;}
#nav li a:active{background-color: #fbb90d; outline:none;}

/* -------------- HOMEPAGE --------------*/
#content-homepage {overflow: hidden; width: 100%; min-height: 400px; padding: 10px 0px 0px 0px; }
#content-homepage h2 {margin-bottom: 1.5em; margin-top: 0; font-size: 1.5em; line-height: 1em; }
#content-homepage ul {list-style-image:url(../images/bullet.gif); padding: 0 15px; line-height: 1.5em; }
#content-what{float: left; width: 239px; margin: 10px 0; padding: 10px 15px 10px 0px; }
#content-how{float: left; width: 240px; min-height: 275px; margin: 10px 0; padding: 10px 15px 10px 15px; border-right: dotted 1px #b4cb86; border-left: dotted 1px #b4cb86; }
#content-why {float: left; width:239px; margin: 10px 0; padding: 10px 0px 10px 15px; }

/* -------------- SUBPAGES --------------*/
#container-subpage {overflow: hidden; width: 100%; min-height: 250px; margin-bottom:10px; padding: 10px 0px 0px 0px; }
.intext-ul {padding: 0 20px;}
.intext-ul li  {list-style: disc; line-height: 1.5em; padding: 0 10px;}

/* --- content ---*/
#content-subpage{ float: left; width:63%; margin: 10px 0; padding: 0 2%;}
#content-subpage h2 a {text-decoration:none;}
#content-subpage img {border: 1px solid #ccc;}

/* --- projects --- */
#projects {float: left; width: 59%; margin: 10px 0; padding:0; }
#projects img {border: 1px solid #ccc;}
a.image, a.image:hover {background: transparent; border: none;}
#projects h3 {margin-top: 1.5em; margin-bottom: 0; padding: 2em 0 1em 0; border-top: #CCC solid 1px; font-size: 1.08335em; line-height: 1.5em; color:#5a6643; }
#projects h3.first { padding-top:0; border-top: none;}

/* --- sitemap --- */
#sitemap {padding: 0; font-weight:bold; line-height: 2em; }
#sitemap li {list-style: none; }
#sitemap li ul {font-weight:normal; }
#sitemap li ul li { background: url(../images/bullet.gif) no-repeat 2em 50%; padding-left: 3em;}

/* ------------- SIDEBAR -------------*/
#sidebar{float: right; width: 31%; margin: 40px 0; padding:0;}
#sidebar h2 {margin-top: 20px; display:block; background-color:#b4cb86; line-height:2.5em; color:#5a6643/*fff*/; padding: 0 .5em;}
#sidebar p { padding: 0 .5em;}
#sidebar p.top { padding-top:.5em; border-top: 1px dotted #b4cb86; }
#sidebar p.bottom { padding-bottom: .5em; border-bottom: 1px dotted #b4cb86; }


#sidebar a, #sidebar a:visited {color:#333;}
#sidebar a:focus, #sidebar a:active {color:#e8a70c;}



/* -- sidebar navigation -- */
#sidebar ul {padding:10px 0 40px 0;}
#sidebar li { display: block; border-bottom: 1px #2D3322 dotted; line-height: 2em; }
#sidebar li.first {border-top: 1px #2D3322 dotted;}
#sidebar li.selected {background-color: #ecf2e1;  padding: 5px 3px; font-weight: bold; }
#sidebar a {text-decoration: none; display: block; padding: 5px 3px; border: none;}

#sidebar a:hover {background-color: #FBB90D; color: #FFF; font-weight:bold;}


/* ---testimonial ---*/
#sidebar-testimonial {background: #ecf2e1 url(../images/testimonial-top.gif) no-repeat top; width: 240px; padding: 5px 0 0 0; }
#sidebar-testimonial p {margin: 0; padding: 0 20px; font: normal 1.1667em/1.5em Georgia, Cambria, "Times New Roman", Times, serif; color: #333; }
#sidebar-testimonial p.name {background: #ecf2e1 url(../images/testimonial-bottom.gif) no-repeat bottom; padding: 0 20px 20px 0;  font-size: .9em; font-style:italic; text-align:right;}
#sidebar-testimonial a.testimonial {display: inline; color: #333;}
#sidebar-testimonial a:hover.testimonial { background-color: inherit; color: #EDB115; font-weight:normal;}
.darker { font-style:italic; color:#2d3322;}





/* -------------- supp --------------*/
#supp {background-color: #b4cb86; clear:both; margin-top: 0; padding: 10px; font-size:0.8333em; line-height: 2em;}
#supp p {text-align: left; color: #333/*#5a6643*/;}

/* -- supplementary navigation -- */
#nav-supp {height: 1em;  margin: 0; padding: 0; text-align: left;}
#supp ul{height: 1.5em;  margin: 0; padding: 0;}
#supp li {display: inline; padding-right: 5px; }
#supp li.selected {padding-right: 5px;  border-bottom:none; font-weight: bold; color:#5a6643;}
#supp a { border-bottom: #333 dotted 1px; text-align: center; text-decoration: none; color: #333;}
#supp a:hover { background-color: inherit; border-bottom: #fff dotted 1px; color: #fff;}

/* ------------ compliance bar ------------*/
#compliance-bar { background: #879865 url(../images/h3-compliance-bar.gif) no-repeat top; height: 30px; margin: 0; padding: 5px 10px; font-size:0.8333em; }
#compliance-bar ul{height: 1.5em; margin: 0; padding: 2px 5px 0 5px; }
#compliance-bar li {display: inline; padding-right:5px;}
#compliance-bar a:hover, #compliance-bar a:hover abbr {background-color: transparent; border-bottom: #fff dotted 1px; color: #fff;}

/* ******************** FORMS ******************** */
fieldset {padding: 10px; border: 1px solid #879865; }
.textarea {background-color: #ecf2e1; margin-bottom: 10px; border: 1px solid #879865;}
input.button { background-color: #b4cb86; border: 1px solid #879865; vertical-align:middle; color: #fff;}
input.button:hover, input.button.hover, input.button:focus, input.button.focus {background-color: #fff; color: #fbb90d;}
form { border: 1px dotted #aaa; padding: 6px; }
input.txt {background-color: #E7E9EA; border: 1px inset  #cccccc; width: 200px; padding: 2px 4px;}
input.btn { color:#fff; background-color: #b4cb86; border:1px outset #ccc; padding: 2px 4px;}
.form {padding-bottom: 5px;}