/*

Theme Name: webtechbc.com

Theme URI: http://webtechbc.com/portfolio.html

Description: http://matthewjamestaylor.com/blog/perfect-3-column.htm


Author: Site customized by webtechbc - Jonah Lewis

Tags: 3 column flexible percentage layout

Webtechbc.com customizes wordpress themes and provides seo services

info@webtechbc.com

*/



body {
background: #fff;
font:11px/20px Georgia,"Times New Roman",Times,serif;
font-size: 12px;
color: #000;
margin:0;
padding:0;
border:0;	
width:100%;
font-weight: 500;
min-width:600px;   
overflow: auto;	
list-style: none;				
}

/* Header styles */
#masthead {
width:900px;
height: 200px;
background-image: url(./images/header.jpg);
background-repeat: no-repeat;
margin-left: auto;
margin-right: auto;
margin-top: 0;
text-align: left;
}
#header ,
#header h1,
#header h2 {
padding:.4em 15px 0 15px;
margin-top: 0;
}

#header ul {
clear: both;
list-style:none;
margin-top: 110px;
margin-left: 20px;
margin-right: auto;
margin-bottom: 25px;
padding-top: 0;
padding-bottom: 0;
padding-right: 0;
padding-left: 0;
}
#header ul li {
display:inline;
list-style:none;
margin:0;
padding:0;
}
#header ul li a {
display:block;
float:left;
margin:0 0 0 1px;
padding:3px 10px;
text-align:center;
background-color:#666666;
color:#fff;
text-decoration:none;
position:relative;
left:15px;
line-height:1.3em;
}
#header ul li a:hover {
background-color:#369;
color:#fff;
}
#header ul li a.active,
#header ul li a.active:hover {
color:#e6aa2e;
background-color:#000;
font-weight:bold;
}
#navigation ul li a span {
display:block;
}

a {
color:#369;
font-weight: 700;
}
a:hover {
color:#C00;
background-color:#FFF;
text-decoration:none;
}
.contact {
width: 80%;
}
h1 {
font-size: 16px;
font-weight: 900;
margin-left: 0px;
margin-top: 0px;
}
h2 {
font-size: 14px;
font-weight: 900;
margin-top: 0;
}
h3 {
font-size: 14px;
font-weight: 900;
margin-top: 0;
}
p {
margin:.4em 0 .8em 0;
padding:0;
}
img {
margin:10px 0 5px;
border: 0;
}

/* Header styles */

/* 'widths' sub menu */
#layoutdims {
clear:both;
background:#eee;
border-top:4px solid #000;
margin:0;
padding:6px 15px !important;
text-align:right;
}
/* column container */
.colmask {
position:relative;		/* This fixes the IE7 overflow hidden bug */
clear:both;
margin-left: auto;
margin-right: auto;
width:900px;				/* width of whole page */
overflow:hidden;			/* This chops off any overhanging divs */
}
/* common column settings */
.colright,
.colmid,
.colleft {
float:left;
width:100%;				/* width of page */
position:relative;
text-align: left;
}
.col1,
.col2,
.col3 {
float:left;
position:relative;
padding: 0 1em 2em 1em;		/* no left and right padding on columns, we just make them narrower instead 
			only padding top and bottom is included here, make it whatever value you need */
overflow:hidden;
text-align: justify;
}
/* 3 Column blog style settings */
.blogstyle {
background:#FFF;			/* right column background colour */
}
.blogstyle .colmid {
right:25%;				/* width of the right column */
background:#FFF;		/* center column background colour */
}
.blogstyle .colleft {
right:25%;				/* width of the middle column */
background:#fff;			/* left column background colour */
}
.blogstyle .col1 {
width:62%;				/* width of center column content (column width minus padding on either side) */
left:50%;				/* 100% plus left padding of center column */
}
.blogstyle .col2 {
width:15%;				/* Width of left column content (column width minus padding on either side) */
left:50%;				/* width of (right column) plus (center column left and right padding) plus (left column left padding) */
}
.blogstyle .col3 {
width:30%;				/* Width of right column content (column width minus padding on either side) */
left:55%;				/* Please make note of the brackets here:
			(100% - left column width) plus (center column left and right padding) plus (left column left and right padding) plus (right column left padding) */
}
.col2text {
text-align: justify;
width: 80%;
}

.col3text {
margin-left: 10px;
margin-top: 5px;
}

.boxbody {
background-image: url(./images/box.jpg);
background-repeat: no-repeat;
width: 250px;
height: 250px;
margin-left: 5px;
margin-right: 25px;
margin-top: 5px;
}
.boxbodytext {
width: 200px;
margin-top: 10px;
margin-left: 15px;
margin-right: 5px;
font-size: 12px;
font-weight: 500;
color: #FFFFFF;
font-family:lucida grande, "Lucida Grande", sans-serif;
}
.boxmargin {
width: 80%
}

.boxbody a {
color:#FF9933;
}
.boxbody a:hover {
color:#C00;
background-color:#FFF;
text-decoration:none;
}

.colimages {
margin-left: 5px;

}

/* Footer styles */
#footer {
background-image: url(./images/footer.jpg);
background-repeat: no-repeat;
width:900px;
height:150px;
margin-left: auto;
margin-right: auto;
margin-bottom: 0;
font-family:lucida grande, "Lucida Grande", sans-serif;
color:#607889;
clear: both;
text-align: center;
}
#footer p {
width: 40%;
margin-top: 60px;
text-align: center;
float: right;
}

#footer ul {
clear:left;
float: left;
list-style:none;
margin-top:15px;
margin-left: 20px;
margin-bottom: 25px;
padding:0;
text-align: left;
}
#footer ul li {
display:inline;
list-style:none;
margin:0;
padding:0;
}
#footer ul li a {
display:block;
float:left;
margin:50px 0 0 1px;
padding:3px 10px;
text-align:center;
background-color:#666666;
color:#fff;
text-decoration:none;
position:relative;
left:15px;
line-height:1.3em;
}
#footer ul li a:hover {
background-color:#369;
color:#fff;
}
#footer ul li a.active,
#footer ul li a.active:hover {
color:#e6aa2e;
background-color:#000;
font-weight:bold;
}
#footer ul li a span {
display:block;
}