/*

    Theme Name: West Van Vacuum
    Theme URI: 
    Description: A Wordpress site for http://www.westvanvacuumcentre.com
    Version: 1.0
    Author: Francis Penny
    Author URI: 


*/

/*reset*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}

body {
line-height: 1;
}

ol, ul {
list-style: none;
}

blockquote, q {
quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}

/* remember to define focus styles! */
:focus {
outline: 0;
}

del {
text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
border-collapse: collapse;
border-spacing: 0;
}

a img { border: none; outline: 0; }


/*end reset*/

/*layout*/

html, body{ 
margin:0; 
padding:0; 
text-align:center; 
}

body {
background-color: #000;
padding-bottom: 2em;
overflow: -moz-scrollbars-vertical;
background-image: url(images/design_elements/stripes.png);
background-repeat: repeat;
}

#pagewidth{ 
width:960px; 
text-align:left;
margin-top: 2em;
margin-right:auto;
margin-left:auto; 
background: #f3f3f3 url(images/design_elements/page-bg.jpg) repeat-y right top;
}

#branding {
position: relative;
width: 100%;
height: 35px;
line-height: 35px;
background: #000 url(images/design_elements/top-bg.png) repeat-x left bottom;
border-bottom: 2px #000 solid;
}

#header{
position:relative; 
height:166px; 
width:100%;
margin: 0;
background: #0059ab URL(images/design_elements/header-bg-silver.png) no-repeat center center;
border-bottom: 2px #000 solid;
}

#logo {
position: relative;
width: 640px;
height: 166px;
float: left;
}

#siteinfo {
position: relative;
width: 320px;
float: right;
display: inline;
height: 166px;
}

#wrapper {
border-top: 1px #000 solid;
}

#twocols{
width:100%; 
float:left; 
position:relative;
padding: 0;
border-top: 1px #000 solid;
}

#rightcol{
width:320px; 
float:right; 
position:relative;
}

#sidebar {
background-color: #434343;
}

div.sidebar-left {
float: left;
display: inline;
background-color: #cccccc;
}

div.sidebar-right {
float: right;
background-color: #dcdcdc;
}

div.sidebar-left, div.sidebar-right {
position: relative;
width: 50%;
}

/*extra div in sidebar*/

#rightcol #sidebar .extratop {
background-color: #f3f3f3;
margin-top: 0;
}

#rightcol .extramid {
background-color: #f3f3f3;
}

#rightcol .extrabot {
background-color: #f3f3f3;
}

.widget_text {
padding-bottom: 1em;
}

#maincol{ 
float: left;
display:inline; 
position: relative; 
width:638px;
margin-right: 2px;
padding: 5px 0;
}

/*the #gutter div and #content div are inside #maincol*/

#gutter {
position: relative;
width: 624px;
background-color: #fff;
border: 1px #E3E3E3 solid;
margin: 0 auto;
}

#content {
position: relative;
padding: 1em;
margin-bottom: 1.5em;
}

#footer{
clear:both;
height: 35px;
border-top: 2px #000 solid;
background: #000 url(images/design_elements/bottom.png) repeat-x left bottom;
} 


/* *** Float containers fix:
http://www.csscreator.com/attributes/containedfloat.php *** */ 
/* new clearfix */
.clearfix:after {
visibility: hidden;
display: block;
font-size: 0;
content: " ";
clear: both;
height: 0;
}

* html .clearfix             { zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */

div.clearing {
clear: both;
} 


/*typography*/

body {
font-size: 76%;
font-family: arial, helvetica, sans-serif;
color: #333;
}

p {
font-size: 1em;
line-height: 1.8em;
margin: 1.2em 0;
}

#branding p {
font-size: 1.3em;
color: #f4f4f4;
text-align: right;
margin: 0 1em;
padding: .15em 0;
}

#header p {
margin:  0;
}

#logo p {
margin-top: 3em;
}

#sidebar p {
font-size: 1em;
color: #333;
line-height:1.6em;
margin-left: 0;
}

h1 {
font-size: 2em;
color: #000;
letter-spacing: .3em;
text-transform: uppercase;
margin: .5em 0 .5em 0;
padding-top: .25em;
border-top: 4px #000 solid;
border-bottom: 1px #000 solid;
}

h2 {
font-size: 1.3em;
font-weight: bold;
font-variant: small-caps;
margin: 1.2em 0 1.2em 0;
}

h3 {
font-size: 1.2em;
font-weight: bold;
margin: 0 0 .5em 0;
}

.sidebar-left p, .sidebar-right p {
text-align: center;
line-height: 0;
}

#rightcol .extratop h3, #rightcol .extramid h3,
#rightcol .extrabot h3 {
font-size: 1.8em;
color: #fff;
font-weight: normal;
font-variant: small-caps;
text-align: left;
padding: 1.25em .5em .15em .5em;
border-bottom: 1px #000 solid;
}

#rightcol .extratop h3 {
margin-bottom: 0;
}

#rightcol .extramid h3, #rightcol .extrabot h3 {
margin-bottom: 1.2em;
border-top: 1px #000 solid;
}

#rightcol h3.grey, #rightcol h3.grey3 {
color: #fff;
background: #555555 url(images/design_elements/h3-bg.jpg) repeat-x left top;
}

#rightcol h3.grey2, #rightcol h3.grey4 {
background: #555555 url(images/design_elements/h3-bg.jpg) repeat-x left top;
}

#rightcol .extramid p, #rightcol .extrabot p {
color: #333;
margin: 0 1em 1.2em 1em;
}

address {
font-size: 1.1em;
color: #333;
line-height: 1.3em;
margin: 0 1em 0 1em;
}

#footer p {
font-size: .9em;
color: #fff;
line-height: 35px;
margin: 0 1em 0 1em;
}

/*box typography*/

#siteinfo {
color: #000000;
}

#siteinfo h3 {
font-size: 1.4em;
color: #333333;
border-bottom: 1px #333333 solid;
padding-bottom: .15em;
margin-bottom: .25em;
margin-left: 0;
}

#siteinfo p {
font-size: 1em;
line-height: 1.4em;
margin-bottom: 0;
}

/*lists*/

#content ul {
margin-bottom: 2em;
margin-left: 2em;
line-height: 1.4em;
}

#content ul li {
list-style-type: square;
}

/*links*/

a:link, a:visited {
color: #FF4F00;
text-decoration: none;
}

a:hover {
text-decoration: underline;
}

#branding a:link, #branding a:visited {
font-weight: bold;
color: #f3f3f3;
text-decoration: none;
}

#branding a:hover {
text-decoration: underline;
border: 0;
}

#content h1 a {
color: #333;
text-decoration: none;
}

#rightcol a {
color: #FF4F00;
text-decoration: none;
padding: 0;
border: 0;
}

#rightcol a:hover {
color: #FF7B40;
text-decoration: underline;
padding: 0;
border: 0;
}

.sidebar-right a, .sidebar-left a {
text-decoration: none;
border: 0;
}

.sidebar-right a:hover, .sidebar-left a:hover {
text-decoration: none;
border: 0;
}

#footer a:link, #footer a:visited {
color: #fff;
text-decoration: none;
}

#footer a:hover {
color: #fff;
text-decoration: underline;
border-bottom: 0;
}

/* box styles */

.box {
position: relative;
margin: 10px 10px 10px 0;
}

.silver {
background: #8c8c8c url(images/design_elements/box/gradient-grey.jpg) repeat-x top;
}

.inner {
padding: 20px;
}

/* corners */

.corner {
position: absolute;
width: 10px;
height: 10px;
background: url(images/design_elements/box/corners_darkgrey.png) no-repeat;
font-size: 0%;
}

.tl {
top: 0;
left: 0;
background-position: 0 0;
}

.tr {
top: 0;
right: 0;
background-position: -10px 0;
}

.bl {
bottom: 0;
left: 0;
background-position: 0 -10px;
}

.br {
bottom: 0;
right: 0;
background-position:  -10px -10px;
}

/*images*/

.alignright {
float: right;
margin: 0 0 .5em 1em;
padding: 3px;
/*border-left: 4px #ccc double;*/
}

.alignleft {
float: left;
margin: 1em 1em .5em 0;
padding: 3px;
/*border: 1px #ccc solid;*/
}

.cycloright {
float: right;
margin: 0;
padding: 3px;
border: 1px #ccc solid;
}

.vacbytable {
float: right;
margin: 3em 0 .5em 1em;
padding: 3px;
/*border: 1px #ccc solid;*/
}

.landinglogos {
float: right;
margin: 0 0 .5em 1em;
}

/*tables*/

table.product_details{
font-size:1em;
color:#333;
border:1px solid #efefef;
width: auto;
margin:10px 0 20px 0;
border: 0;
border-collapse:collapse;
}

table.product_details caption {
font-size: 1em;
font-weight: bold;
color: #fff;
background-color: #505050;
text-align: left;
padding: .25em;
}

table.product_details td{
padding: .25em;
border-bottom:1px solid #ddd;
}

table.product_details td.value{
color:#0059AB;
}

table.product_details tr.odd{
background-color:#efefef;
}

/*central vacuum product styles*/

.cycloproducts {
margin-bottom: 1em;
height: 160px;
margin-bottom: 2em;
}

#content .product_wrap {
position: relative;
width: 100%;
margin-bottom: 1em;
}

#content .product_photo {
position: relative;
float: left;
display: inline;
width: 145px;
margin-right: 1.5em;
}

#content .product_info {
position: relative;
float: right;
width: 400px;
}

div.cycloproducts ul .centralvac {
margin-bottom: 5em;
line-height: 1.4em;;
}

/*breadcrumb*/

div.breadcrumb {
border-top: 1px #ccc solid;
padding-top: .15em;
}

#pullquote {
float: right;
width: 250px;
margin: 0 0 .5em 1em;
font-size: 3em;
line-height: 1em;
color: black;
text-align: right;
}

.pullquote-silver {
color: silver;
}

.pullquote-gray {
color: gray;
}

/*submit button*/

input#contactsubmit {
font-size: 2em;
font-family: Georgia, "Times New Roman", Times, serif;
color: #333;
font-weight: bold;
background-color: #fff;
border-top: 1px #ccc solid;
border-right: 0;
border-bottom: 4px #ccc double;
border-left: 0;
cursor: pointer;
}

/* Captions */
.aligncenter,
div.aligncenter {
display: block;
margin-left: auto;
margin-right: auto;
}

.wp-caption {
border: 1px solid #ddd;
text-align: center;
background-color: #f3f3f3;
padding-top: 4px;
margin: 10px;
-moz-border-radius: 3px;
-khtml-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
}

.wp-caption img {
margin: 0;
padding: 0;
border: 0 none;
}

.wp-caption p.wp-caption-text {
font-size: 11px;
line-height: 17px;
padding: 0 4px 5px;
margin: 0;
}
/* End captions */

/*--------------
Dropdown menu
---------------*/

#pixopoint_menu1_wrapper {
position: relative;
width: 100%;
height: 35px;
z-index: 100;
}

#pixopoint_menu1 {
position: relative;
width:100%;
height:35px;
background: #2b2b2b url(images/design_elements/dazzle_black.png) repeat-x;
background-position:50% 0;
margin:0;}

#pixopoint_menu1 ul {
width:100%;
border:none;
background:none;
margin:0;
padding:0;
list-style:none;
}

#pixopoint_menu1 li {
border:none;
background:none;
background:#2b2b2b url(images/design_elements/dazzle_black.png);
color:#FFFFFF;
line-height:35px;
z-index:20;
letter-spacing:0px;
font-weight:bold;
font-size:14px;
padding:0;
margin:0;
float:left;
font-family:tahoma,sans-serif;
position:relative;
}

#pixopoint_menu1 li:hover,#pixopoint_menu1 li.sfhover {
background:#D43843 url(images/design_elements/dazzle_black.png);
background-position:0 60px;
}

#pixopoint_menu1 li a {
border:none;
background:none;
text-decoration:none;
display:block;
padding:0 12px;
color:#f4f4f4;
}

#pixopoint_menu1 li a:hover {
border:none;
background:none;
text-decoration:none;
color:#FFFFFF;
background-position:100% -120px;
}

#pixopoint_menu1 ul ul {
position:absolute;
left:-999em;
top:35px;
width:160px;/*changed from 120px*/
}

#pixopoint_menu1 li:hover ul,#pixopoint_menu1 li.sfhover ul {
left:auto;
}

#pixopoint_menu1 ul ul li a {
padding:4px 10px;
text-transform:normal;
font-variant:normal;
}

#pixopoint_menu1 ul ul li {
letter-spacing:0px;
color:#444444;
z-index:20;
width:160px;/*changed from 120px*/
font-family:helvetica,arial,sans-serif;
font-size:12px;
font-weight:bold;
font-style:normal;
background:#FFFFFF;
border-bottom:1px solid #cccccc;
border-left:1px solid #cccccc;
border-right:1px solid #cccccc;
margin:0;
}

#pixopoint_menu1 ul ul li a {
line-height:22px;
color:#444444;
text-decoration:none;
}

#pixopoint_menu1 ul ul li:hover a,#pixopoint_menu1 ul ul li.sfhover a {
color:#FFFFFF;
text-decoration:none;
}

#pixopoint_menu1 ul ul li:hover li a,#pixopoint_menu1 ul ul li.sfhover li a {
color:#444;
}

#pixopoint_menu1 ul ul li:hover li a:hover,#pixopoint_menu1 ul ul li.sfhover li a:hover {
color:#FFFFFF;
}

#pixopoint_menu1 ul ul li:hover,#pixopoint_menu1 ul ul li.sfhover {
color:#FFFFFF;
background:#83001F;
}

#pixopoint_menu1 ul ul ul li {
font-size:1em;}

#pixopoint_menu1 ul ul ul, #pixopoint_menu1 ul ul ul ul {
position:absolute;
margin-left:-999em;
top:0;
width:160px;/*changed from 120px*/
}

#pixopoint_menu1 li li:hover ul,#pixopoint_menu1 li li.sfhover ul,#pixopoint_menu1 li li li:hover ul,#pixopoint_menu1 li li li.sfhover ul {
margin-left:160px;/*changed from 120px*/
}

#pixopoint_menu1 ul ul li:hover li a,#pixopoint_menu1 ul ul li.sfhover li a {
text-decoration:none;
}

#pixopoint_menu1 ul ul li li:hover a,#pixopoint_menu1 ul ul li li.sfhover a {
/*color:#FFFFFF;*/
text-decoration:none;
}

/*-----------------------------
styling for current pages
--------------------------------*/

#pixopoint_menu1 ul.sf-menu li.current_page_item {
background:#000000 url(images/design_elements/dazzle_black.png);
background-position:0 60px;
}

#pixopoint_menu1 ul.sf-menu li li.current_page_item, #pixopoint_menu1 ul.sf-menu li li li.current_page_item {
background: none;
background-color: #83001F;
}

/*STYLING THE LINK COLORS IN SUB MENUS*/

#pixopoint_menu1 ul.sf-menu li li.current_page_item .haschildren, #pixopoint_menu1 ul.sf-menu li li.current_page_parent a {
color: #fff;
}

#pixopoint_menu1 ul.sf-menu li li.current_page_item a, #pixopoint_menu1 ul.sf-menu li li.current_page_parent a {
color: #fff;
}

#pixopoint_menu1 ul.sf-menu li li.current_page_item, #pixopoint_menu1 ul.sf-menu li li li.page_item a {
color: #333;
}

#pixopoint_menu1 ul.sf-menu li li.current_page_item, #pixopoint_menu1 ul.sf-menu li li li.current_page_item a {
color: #fff;
}

#pixopoint_menu1 ul.sf-menu li.current_page_parent {
background:#000000 url(images/design_elements/dazzle_black.png);
background-position:0 60px;
}

#pixopoint_menu1 ul.sf-menu li.current_page_ancestor li.current_page_parent {
background: none;
background-color: #83001F;
}

#pixopoint_menu1 ul.sf-menu li.current_page_ancestor {
background:#000000 url(images/design_elements/dazzle_black.png);
background-position:0 60px;
}