/*  
Theme Name: Productum
Version: 1.0.8
Description: Designed by <a href="http://www.markforrester.co.za">Mark Forrester</a>.
Author: WooThemes
Author URI: http://www.woothemes.com
*/

/* Custom styles */
@import "custom.css";

/*------------------------------------------------------------------
[ STYLE.CSS ] Main Stylesheet
--------------------------------------------------------------------

[Table of contents]

1.	RESET

2.	MAIN STYLES
2.a  Tags defaults
2.b  Base layout
2.c  Navigations
2.d  Elements, ID's & Classes

3.	FORMS
3.a  Form styles
3.b  Individual forms

4.	PLUGINS

5.	PRINT


/*------------------------------------------------------------------

1.	RESET
	Global reset for all HTML elements

------------------------------------------------------------------*/

@media handheld, projection, screen, print {

* { font-family: inherit; font-size: 100%; font-style: inherit; font-weight: inherit; margin: 0; outline: 0; padding: 0; vertical-align: baseline }
html { height: 100% }
body { background: #fff; color: #fff; font-size: 100.01%; min-height: 101%; text-align: left }
img, fieldset, abbr, acronym { border: 0 }
ul, ol { list-style: none }
table { border-collapse: collapse; border-spacing: 0; width: 100% }
address, caption, cite, code, dfn, em, strong, th, var { font-style: normal; font-weight: normal; }
caption, th { text-align: left }
q:before, q:after, blockquote:before, blockquote:after { content: '' }
input, select, textarea, button { font-size: 1em; line-height: normal; width: auto; vertical-align: middle }
textarea { height: auto; overflow: auto }
option { padding-left: 0.6em }
button { background: none; border: 0; cursor: pointer; text-align: center }
h1, h2, h3, h4, h5, h6 { font-weight: normal; line-height: normal; color:#ffffff; }
img.alignright {float:right; margin:0 0 0px 10px}
img.alignleft {float:left; margin:0 10px 0px 0}
img.aligncenter {display: block; margin-left: auto; margin-right: auto}
a img.alignright {float:right; margin:0 0 0px 10px}
a img.alignleft {float:left; margin:0 10px 0px 0}
a img.aligncenter {display: block; margin-left: auto; margin-right: auto}


} @media handheld, projection, screen {


/*------------------------------------------------------------------

2.	MAIN STYLES
	General definitions

--------------------------------------------------------------------

/*-------------------------------
2.a Tags defaults
---------------------------------
[?] Tags only. No classes or ID's here.
*/
	
body {
	background: #6f6f6f url(images/bg.gif) repeat-x;
	color: #FFFFFF;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 90%;
	line-height: 1.5em;
	text-align: center;
	padding: 0 0 20px;
}

p, ul, ol, table { margin: 0 0 1.33em }

strong { color: #FFFFFF; font-weight: bold }
em { font-style: italic }

/* Headlines */
h1 {color: #FFFFFF; font-size: 1.8em; font-weight: bold; line-height: 1em; margin: 0 0 10px;}
h2 {color: #FFFFFF;font-size: 1.5em;font-weight: bold;line-height: 1em;margin: 0 0 10px;}
h3 {color: #FFFFFF;font-size: 1.33em;font-weight: bold;line-height: 1em;margin: 0 0 10px;}
h4 {color: #FFFFFF;font-size: 1.2em;font-weight: bold;line-height: 1em;margin: 0 0 10px;}
h5 {font-size:16px; font-family: Arial, Helvetica, sans-serif;color:#fff; font-weight: bold;padding:5px; margin:0;overflow:hidden; }
h6 {margin:0 5px; font-family: Arial, Helvetica, sans-serif;font-size:13px; font-weight: bold;line-height:14px; color:#fff; }
#footer h5 {margin-bottom:0 !important;}

/* Anchors */
a, a:link, a:visited {color:#ff4400;}
a:hover, a:active, a.active {color:#ff4400;}
ul#nav li.page_item a:hover, ul#nav li.current_page_item a {color:#ffb000;}

/*-------------------------------
2.b Base layout
---------------------------------
[?] Mostly ID's. Classes & tags allowed.
*/

#wrap {margin: auto;text-align: left;width: 984px;position: relative;}
#header, #content, #footer, #contentWrap, #footerWrap {float: left; display: inline;clear: both;position: relative;}
#header {background: url(images/bg-header.jpg) no-repeat;height: 254px;width: 100%;}
#home #header {height: 254px;}
#logo { margin: 0 }
#logo a {cursor: pointer;position: absolute;top: 25px; left: 23px;}
#content {background: url(images/bg-content.png) repeat-y;width: 100%;}
#contentWrap {padding: 24px 12px 10px;width: 960px;}
#home #contentWrap { padding-top: 15px }
#footer {background: none;width: 984px;}
#footerWrap {background: url(images/bg-rounded-bottom.gif) no-repeat 0 bottom;padding: 0 12px 12px;width: 960px;}

/*-------------------------------
2.c Navigations
-------------------------------*/

/* Page Nav */

#nav {height: 36px;position: absolute;top: 100px; left: 8px;z-index: 9999;}
#nav a {display: block;line-height: 35px;padding: 0 10px;z-index: 100;font-size: 12px; font-weight:bold; text-transform:uppercase; color: #ffffff;}
#nav li {float: left;}

/* Style drop down list */

#nav li ul { position: absolute; width: 172px; left: -999em;}
#nav li ul li {	background: url(images/bg-dropdown.png) !important;background: #000; }
#nav li ul li a { line-height: 35px; width: 150px; }
#nav li ul ul {	margin: -26px 0 0 170px; }
#nav li ul ul li a { line-height: 30px; text-transform:none; }
#nav li ul li ul li a { }
#nav li:hover ul, #nav li.sfhover ul { left: auto; }
#nav li:hover ul ul, #nav li.sfhover ul ul { left: -999em; }
#nav li:hover ul, #nav li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul { left: auto; }
#nav li:hover, #nav li.hover { position: static; } /* IE7 Fix */

/* Pagination */

.more_entries .Nav {margin-bottom:2.5em;text-align:center;}
.more_entries .Nav strong {padding:5px;border:1px solid #E4E4E4;margin-right:5px;}
.more_entries .Nav a strong {padding:0;border:none;margin-right:0;}
.more_entries .Nav a, .more_entries .Nav .on {padding:5px;border:1px solid #E4E4E4;margin-right:5px;}
.more_entries .Nav .on { font-weight:bold; }
.more_entries .Nav a:hover {background-color:#E4E4E4;color:#333333;}

/*-------------------------------
2.d Elements, ID's & Classes
-------------------------------*/

div#featuredTxt {color: #fff;width: 480px;position: absolute;top: 156px; left: 20px;}
#home #header h2 {color: #fff;font-size: 1.5em;text-transform: uppercase;margin: 0 0 12px;}
#home #header p {font-size: 1.17em;line-height: 1.43em;}
#home #header ul#featuredNav {margin: 0;position: absolute;width:480px;top: 258px; left: 20px;}
#home #header ul#featuredNav li {float:left;margin-right:20px;}
#home #header ul#featuredNav li a {color: #fff;font-size: 1.08em;font-weight: bold;text-transform: uppercase;text-decoration: none;display: block;border-width:1px;border-style:solid;padding:8px;-moz-border-radius: 10px;-webkit-border-radius: 10px;}
h2.single { font-size: 2.17em; margin-bottom:15px; }
h2.archive { border-bottom: 1px solid #E4E4E4; padding-bottom:15px;}
#sidebar { color: #000;}
#sidebar h3, #sidebar2 h3 { font-size: 1.5em }
#sidebar h4, #sidebar2 h4 { margin: 0 0 3px }
#home #sidebar h4, #home #sidebar2 h4 { margin: 0 0 0px }
#sidebar .thumbnail {margin-bottom:15px;border: 1px solid #e4e4e4;}
#footerWrap h4 { margin: 0 0 10px }
#footerWrap h3 { padding: 5px 0 5px 0 }
#footerWrap h2 {font-size:1.33em; line-height:1em; padding: 5px 0 5px 0 }

/*h3#news { background: url(images/ico-news.gif) no-repeat; height: 32px; padding: 5px 0 0 47px; margin-bottom:20px }

h3#photos { background: url(images/ico-photos.gif) no-repeat; height: 32px; padding: 5px 0 0 44px }

h3#twitter { background: url(images/ico-twitter.gif) no-repeat; height: 32px; padding: 5px 0 0 39px }

h3#subscribe { background: url(images/ico-subscribe.gif) no-repeat; height: 32px; padding: 5px 0 0 44px }

h3#popular { background: url(images/ico-press.gif) no-repeat; height: 32px; padding: 5px 0 0 44px }*/

blockquote p {color: #666;font-size: 16px;font-style: italic;line-height: 22px;}
ul.news li {border-bottom: 1px solid #e4e4e4;margin: 0 0 15px;}
ul.news li h4 {	margin: 0 }
#sidebar2 ul.photos {width: 240px;margin: 0 0 1.5em -20px;}
#twitter_update_list {background: #e5edf0;border: 1px solid #b6ccd4;color: #000000;font-family: Georgia, "Times New Roman", Times, serif;font-size: 1.17em;font-style: italic;line-height: 1.43em;text-align: left;padding: 12px 15px;}
#twitter_update_list li {margin-bottom:15px}
span.website {color:#FFFFFF;font-family:Georgia,"Times New Roman",Times,serif;font-size:1.1em;font-style:italic;line-height:1.43em;padding:3px;text-align:center;background-attachment: scroll;background-color: #A3B7BD;background-image: none;background-repeat: repeat;background-position: 0 0;}
span.website a {color:#e5edf0;}
#searchform #s {padding:5px;border: 1px solid #cccccc;margin-right:5px;}
#searchform #searchsubmit {padding:5px;border: 1px solid #cccccc;background-color:#000000;color:#FFFFFF;}
#wp-calendar {width: 99%;padding: 0 0 0px 0;margin-bottom: 15px;}
#wp-calendar caption {font-size: 11px;text-align:center;padding:5px;text-transform: uppercase;}
#wp-calendar thead tr th {color: #000000;font-size: 14px;font-weight: bold;padding-top: 10px;}
#wp-calendar tfoot tr th {padding-top: 10px;}
#wp-calendar th {color: #fff;}
#wp-calendar th, #wp-calendar td {padding: 3px;text-align: center;}
#wp-calendar td {background: transparent;}
#wp-calendar td, table#wp-calendar th {padding: 3px 0;}
#wp-calendar a {text-decoration: underline;}
#wp-calendar a:hover {text-decoration: none;}
.wp-caption {background-color:#ffffff;border:1px solid #DDDDDD;padding:4px 0 0px;text-align:center;float:left; margin:0 10px 0px 0}
.wp-caption-text {font-size:12px;color: #000000;font-weight:bolder;text-align:left;padding:0px 5px 2px;}
#footerWrap ul { margin: 0 0 8px }
#footerWrap h4 {color: #2f3032;font-size: 1.17em;font-weight: bold;line-height: 1.43em;}	
#footerWrap ul li p {color:#333333;margin:0;}
#footerWrap ul li {margin: 0 0 5px;}
#footerWrap ul li ul {margin: 0;}
#footerWrap ul li.recentcomments {padding:5px;}
#footerWrap a {display: block;padding:5px;text-decoration: none;}
#footerWrap ul li ul li {margin: 5px;background-color: #f7f7f7;padding:0px;}
#footerWrap ul li ul li a {font-weight:normal;font-size:12px;color: #333333;padding-left:10px;}
#footerWrap ul li ul li ul li a {font-weight:bolder;font-size:11px;background-color: #f7f7f7;padding-left:10px;}	
#footerWrap ul li img {text-align: center;}	
#footerWrap ul li.clickready {cursor: pointer;}
.footer_widget {margin-bottom:20px;}
#footerWrap .widget_tag_cloud a {display:inline !important;}
.credits {text-align:center;padding-top:5px;color:#FFFFFF;font-weight:bolder;}
.credits a {display:inline;color:#FFFFFF;text-decoration:underline;}
.credits img {vertical-align:middle;}

/* Blog */

.entry {padding-bottom:2em;margin-bottom:3em;padding:0 10px 5px 0px;}
.entry ul li {background:transparent url(images/bullet.gif) no-repeat scroll 4px 4px;line-height: 140%;padding:0 0 5px 18px;}
.entry ol li {line-height:140%;padding:0 0 1em 0;list-style-position: inside;list-style-type:decimal;}
#line_break {margin-top:2.5em;padding-top:3em;border-top:1px solid #E4E4E4;}
#prevPosts {background: #232528;width: 460px;height: 200px;position: relative;}
#prevPosts h3 {color: #fff;height: 32px;padding: 5px 0 0 0;position: absolute;top: 10px; left: 10px;}
p.post_meta { font-size:11px; color:#333333; }
p.post_meta span { background: url(images/post_meta_bg.jpg) no-repeat; padding: 3px 0 3px 21px; }
div#comments {}
ol.commentlist { margin-bottom: 3em; border-top:1px solid #E4E4E4; }
ol.commentlist li.odd {background-color:#f4f4f4;}
ol.commentlist li h4 { margin-bottom: 0; }
ol.commentlist li { padding:1.5em; border-bottom:1px solid #E4E4E4; position: relative; }
ol.commentlist .avatar { float: right; display: inline; margin: 0 0 1.5em 1.5em; padding:4px; background-color:#ffffff; border: solid 1px #E4E4E4; }
ol.commentlist li cite { font-size: 1.3em; font-weight:bold }
ol.commentlist li .comment-meta { font-size: .92e; margin-bottom:1em }
ol.commentlist ul.children li { position:relative; margin:1.5em 1.5em 0 1.5em; }
ol.commentlist .odd ul.children li { background-color:#ffffff; }
ol.commentlist .odd ul li ul.children li { background-color:#F4F4F4; }
#respond #author, #respond #email, #respond #url, #respond #comment {border: 1px solid #cccccc;padding:5px;}
#respond label {padding:5px;margin-left:5px;}

/*------------------------------------------------------------------

3.	FORMS
	Styles for forms only

--------------------------------------------------------------------

/*-------------------------------
3.a Form styles
-------------------------------*/

input.text, select.select, textarea.textarea{border: 1px solid #B6CCD4;color: #000;padding: 6px;}
input.text { width: 195px }
select.select { width: 200px }
textarea.textarea { height: 10em; width: 446px }
select.select.free {	width: auto }
button.button {color: #000;height: auto; width: auto;line-height: normal;white-space: nowrap;}
input.submit {color: #000;cursor: pointer;padding: 0;}


/* General forms */
form.form { /* nothing here */ }
form.form ol.fieldset {	list-style: none }
form.form ol.fieldset li.field {margin: 0 0 1em;position: relative;}
form.form ol.fieldset li.field label {font-weight: bold;display: block;}		
form.form p.submit { /* nothing here */ }

/* Search forms where button and text input are next to each other  */
form.search { /* nothing here */ }
form.search p.fields { margin: 0 }
form.search p.fields input, form.search p.fields button {display: inline;vertical-align: middle;}
		
/*-------------------------------
3.b Individual forms
-------------------------------*/

form#newsletter {margin-bottom: 1.5em;position: relative;}
form#newsletter p.fields input.text {border: 1px solid #b6ccd4;padding: 9px 30px 9px 7px;width: 180px;}
form#newsletter p.fields button {background: url(images/ico-newsletter.gif) no-repeat;width: 17px; height: 22px;border: none;position: absolute;top: 6px; right: 10px;z-index: 9999;}


/*------------------------------------------------------------------

4.	PLUGINS
	Predefined utilities

--------------------------------------------------------------------


/*------------------------------------------------------------------
				FAQ
-------------------------------*/

#answer {font-family: Arial, Helvetica, sans-serif;color: #FFFFFF;font-size: 12;display: inline;padding: 0; margin: 0;}
ol.faq {list-style: none;}
ol.faq li {list-style: none;}
ol.faq li:hover {background-color: #706f6f;padding-left: 30px;background-image: none;}
ol.faq h3 {padding-bottom: 5px;cursor:  pointer;}
ol.faq div.answer {display: none;padding-left: 30px;background-color: #706f6f;}
ol.faq div.answer p {font-size: 75%;}
ol.faq div.faq_approve {display: none;}
/*------------------------------------------------------------------
				ADROTATE
-------------------------------*/

#adrotate {float: right;width: 468px;padding:25px 20px 0px;}
#adrotate img{float: right;}
/*#adrotate2 {
	background: url(images/vertical-bg.gif) no-repeat;
	background: #e5edf0;
	color: #434343;
	padding: 158px 0px 0px 710px;*

}*/
#adrotate2 {float: left;width: 660px;padding: 55px 0px 0px 130px;}


/*------------------------------------------------------------------
VERTICAL RESPONSE WIDGET
-------------------------------*/
#vertical-response {background: url(images/vertical-bg.jpg) no-repeat;color: #434343;padding: 180px 10px 50px 5px;}
	
/*.submit {
	background: transparent;
	border-top: 0;
	border-right: 0;
	border-bottom: 1px solid #00F;
	border-left: 0;
	color: #00F;
	display: inline;
	margin: 0;
	padding: 0;
}*/

/*-------------------------------
INCREASE FONT SIZE SIDEBAR
-------------------------------*/
#font-size-options {width:250px; height:20px;display: inline;background:#e5edf0;}

/*-------------------------------
PDF LINKS
-------------------------------*/

a[href$='.pdf'] {display:inline-block;font-weight: bold;text-decoration: underline;padding-left:20px;line-height:18px;background:transparent url(images/sm_pdf.png) center left no-repeat;}

/*-------------------------------
Utility classes
-------------------------------*/

.l { text-align: left }
.c { text-align: center }
.r { text-align: right }
.wrap, .col { float: left;	display: inline; position: relative; }
.wrap { clear: both }
.clear { clear: both }
.fl { float: left }
.fr { float: right }
.hide, .hidden, .skip { display: none }
.nomargin { margin-bottom: 0 !important }
.noborder { border: 0 !important }
.top { margin-top: 0 !important }
.hr { background: #ccc; height: 1px; margin: 1.5em 0; }
.hr hr { display: none }
.replace, .br { display: block; font-size: 1%; line-height: 0; text-align: left; text-indent: -10000px; }
.opacity { -moz-opacity: 0.95; opacity: 0.95; filter: alpha(opacity = 95); }
.rounded { -moz-border-radius: 6px; -khtml-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; }
.clearfix:after { clear: both; content: "."; display: block; height: 0; visibility: hidden }
.fix {clear:both;height: 1px;margin: 0 0 -1px;overflow: hidden;}

/* Align */

.aligncenter {margin: 10px auto 20px auto;display: block;}
.alignleft {margin: 10px 20px 8px 0;float: left;}
.alignright {margin: 10px 0px 8px 20px;float: right;}

/*-------------------------------
"Bars" navigation
---------------------------------
[?] EXAMPLE

Home | Services | About | Contact	*/

ul.bars li {display: inline; margin-left: -4px;}
ul.bars li.first {border: 0 !important;}
ul.bars li:before {content: "|"; padding: 0 4px;}
ul.bars li:first-child:before {content: ""; padding: 0 4px 0 0;}


} @media print {

/*------------------------------------------------------------------

5.	PRINT
	Styles for print

------------------------------------------------------------------*/

body { background: none; color: #000; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 10pt }
code, pre { font-family: "Courier New", Courier, mono }
img { float: left; clear: left; page-break-inside: avoid; page-break-after: avoid }
a, a:link, a:visited { color: blue; text-decoration: underline }
blockquote, table, pre { page-break-inside: avoid }
ul, ol, dl  { page-break-before: avoid }
h1, h2, h3, h4, h5, h6 { display: block; font-weight: bold; page-break-after: avoid }
#footer, .ad, #nav, .nav, form, .skip { display: none }
h1 { font-size: 3em; margin: .67em 0; }
h2 { font-size: 2em; margin: .83em 0; }
h3 { font-size: 1.5em; margin: 1em 0; }
h4 { font-size: 1em; margin: 1.33em 0; }


/*------------------------------------------------------------------
	END CSS
------------------------------------------------------------------*/

}/* end @media */

