body { color: #3c5c74; font-size: 14px; font-family: georgia, "times new roman", helvetica; line-height: 24px; background-color: #f4f9fd; background-image: url(../images/bg.gif); background-repeat: repeat-x; background-attachment: fixed; margin: 0; padding: 0; }

h1 { background-image: url(../images/fresh-karma-logo.png); background-position: 0 top; text-indent: -9000px; width: 271px; height: 53px; float: left; margin: 0; padding: 0; display: block; }

h1 a { width: 100%; height: 100%; outline-style: none; display: block; }

h2 { color: #f4f9fd; font-size: 25px; font-family: georgia, "times new roman", helvetica; font-weight: normal; font-style: normal; line-height: 32px; text-decoration: none; margin: 0 0 8px; padding: 0; }

h3 { color: #3c5c74; font-size: 25px; font-family: georgia, "times new roman", helvetica; font-weight: normal; font-style: normal; line-height: 24px; text-decoration: none; letter-spacing: -1px; margin: 0; padding: 0; }

h4 { color: #bfcae6; font-size: 16px; font-family: georgia, "times new roman", helvetica; font-weight: normal; font-style: normal; line-height: 22px; text-decoration: none; margin: 0; padding: 0; }

h5 { color: #3c5c74; font-size: 18px; font-family: georgia, "times new roman", helvetica; font-weight: normal; font-style: normal; line-height: 24px; text-decoration: none; letter-spacing: -1px; margin: 0; padding: 0; }

h6 { color: #3c5c74; font-size: 25px; font-family: georgia, "times new roman", helvetica; font-weight: normal; font-style: normal; line-height: 24px; text-decoration: none; letter-spacing: -1px; float: left; margin: 0; padding: 0; }

#main { width: 720px; height: auto; margin: 0 auto; padding: 0; }

#header { width: 720px; height: 73px; margin: 65px 0 0; padding: 0; border-bottom: 1px dotted #3c5c74; }

#facelift { background-image: url(../images/facelift.png); background-repeat: no-repeat; background-position: 0 top; width: 216px; height: 18px; float: right; margin: 38px 0 0; padding: 0; }

#description { background-color: #55788e; background-image: url(../images/bg-description.gif); background-repeat: repeat-x; background-position: left bottom; width: auto; height: auto; margin: 20px 0; padding: 20px; }

#announcement { width: auto; height: auto; margin: 0; padding: 20px 0 0 0; border-top: 1px dotted #3c5c74; }

#portfolio { width: auto; height: auto; margin: 0; padding: 20px 0; border-top: 1px dotted #3c5c74; }

#portfolio img { margin: 5px 0; padding: 0; border-bottom: 4px solid #3c5c74; }

#portfolio p { font-size: 11px; font-family: verdana, arial, sans-serif, helvetica; line-height: 14px; margin: 5px 0 0; padding: 0; }

#announcement a, #portfolio a, #details a { color: #3c5c74; font-weight: bold; text-decoration: none; }

#announcement a:hover, #portfolio a:hover, #details a:hover  { color: #f4f9fd; background-color: #3c5c74; }

#portfolio-top { width: auto; height: auto; margin: 0; padding: 0 0 20px; border-bottom: 1px dotted #3c5c74; }

#portfolio-left { width: 470px; height: auto; float: left; margin: 0; padding: 0; }

#portfolio-right { width: 220px; height: auto; float: right; margin: 0; padding: 0; }

#portfolio-right ul { margin: 18px 0 0; padding: 0; list-style-type: none; }

#portfolio-right ul li { margin: 0; padding: 0; }

#portfolio-1 { width: 470px; height: auto; float: left; margin: 0; padding: 20px 0; border-bottom: 1px dotted #3c5c74; }

#portfolio-2 { width: 470px; height: auto; float: left; margin: 0; padding: 20px 0 0; }

#portfolio-bottom { width: 720px; height: auto; margin: 0; padding: 20px 0 0; }

.client-left { width: 220px; height: auto; float: left; margin: 0; padding: 0; }

.client-centre { width: 220px; height: auto; float: left; margin: 0 0 0 30px; padding: 0; }

.client-right { width: 220px; height: auto; float: right; margin: 0; padding: 0; }

#details { width: auto; height: auto; margin: 0 0 155px; padding: 20px 0 15px; border-top: 1px dotted #3c5c74; border-bottom: 1px dotted #3c5c74; }

#details p { margin: 15px 0 0; padding: 0; }

#details ul { margin: 15px 0 0; padding: 0; list-style-type: none; }

#details ul li { margin: 0; padding: 0 0 5px; }

#services { width: 340px; height: auto; float: left; margin: 0 40px 0 0; padding: 0; }

#contact { width: 340px; height: auto; float: left; margin: 0; padding: 0; }

#contact ul li { margin: 0; padding: 0; }

#contact a { font-weight: normal; }

#footer { width: auto; height: auto; margin: 0 0 5px; padding: 0; }

#footer p { margin: 0; padding: 0; }

#footer a { color: #3c5c74; text-decoration: none; }

#footer a:hover { color: #f4f9fd; background-color: #3c5c74; }

#previews { width: auto; height: auto; margin: 0; padding: 20px 0; }

#previews span { float: right; }

#previews a { color: #3c5c74; text-decoration: none; }

#previews a:hover { color: #f4f9fd; background-color: #3c5c74; }

#previews img { margin: 17px 0 180px; padding: 0; }

#cityscape { background-image: url(../images/cityscape.png); background-repeat: repeat-x; background-position: center top; text-align: center; vertical-align: bottom; position: fixed; left: 0; bottom: 0; width: 100%; height: 181px; z-index: 11; display: block; }

/* browser fixes - so f'in stupid */

/* clears floats in mozilla browsers */
#details:after, #portfolio:after, #portfolio-top:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }

/* clears floats in IE 7 - causes hasLayout */
#details, #portfolio, #portfolio-top { min-height: 0; }

/* clears floats in IE Mac */
#details, #portfolio, #portfolio-top { display: inline-block; }

/* clears floats in IE 6 and hides from IE Mac \*/
* html #details, * html #portfolio, * html #portfolio-top { height: 1%; }

#details, #portfolio, #portfolio-top { display: block; }
/* end hide from IE Mac */