/* 

Intercontex LLC
Matthew James / OK CREATIVE / www.designbyok.com

*/


body {
margin: 0;
padding: 0;
width: 100%;
font: normal 85%/135% Verdana, arial, sans-serif;
background: #404041  url(../i/bg.png) center top repeat-y;
color: #333;
}
    
#wrapper {
position: relative;
margin: 0 auto;
width: 960px;
text-align:left;
background: transparent url(../i/wrapperbg_inner.jpg) top center no-repeat; 
}

#date {
font-size: 80%;
color: #fff;
text-transform: uppercase;
margin: 0 0 0 10px;
}


/* layout */

#main {
font-size: 95%;
background: transparent;
float: left;
width: 620px;
padding: 0 0 50px 0;
margin: 0 0 20px 0;
}

#sidebar {
background: url(../i/sidebar_bg.png) bottom left no-repeat;
float: left;
width: 278px;
margin: 0 30px 20px 0;
padding: 0;
}

#sidebar_nobg {
background: transparent;
float: left;
width: 278px;
margin: 0 30px 20px 0;
padding: 0;
}



/* main navigation */

ul#mainnav {
margin: 150px 0 40px 0;
padding: 10px;
font-weight: normal;
font-size: 80%;
background: #1a1a1a;
}

ul#mainnav li {
display: inline;
margin-right: 20px;
padding: 0 5px;
font-size: 130%;
}

ul#mainnav li a:link, ul#mainnav li a:visited {
color: #999;
text-decoration: none;
}

ul#mainnav li a:hover {
color:#fff;
text-decoration: none;
}

#home a.home,
#company a.company, 
#blog a.blog, 
#solutions a.solutions, 
#clients a.clients, 
#products a.products,
#contact a.contact {
text-decoration: none;
border-bottom: 2px solid #999;
}


/* sub navigation */

#subnav {
margin: 20px 0 25px 10px;
padding: 0;
font-size: 75%;
list-style-type: none;
width: 255px;
border-top: 1px solid #ccc;
}

#subnav li {
font-size: 110%;
margin: 15px 0;
border-bottom: 1px solid #ccc;
padding-bottom: 15px;
}

#subnav a, #subnav a:visited  {
color: #666;
text-decoration: none;
padding: 7px 20px 5px 20px;
background-image: url(../i/subnav_dot_off.png);
background-repeat: no-repeat;
background-position: left 8px;
}

#subnav li a:hover {
margin: 5px 0;
color: #333;
text-decoration: none;
padding: 7px 20px 5px 22px;
background-image: url(../i/subnav_dot_on.png);
background-repeat: no-repeat;
background-position: left 8px;
}

#active a:link, #active a:visited, #active a:hover  {
margin: 5px 0;
color: #333;
text-decoration: none;
padding: 7px 20px 5px 22px;
background-image: url(../i/subnav_dot_on.png);
background-repeat: no-repeat;
background-position: left 8px;
}



/* footer */
#footer {
clear: both;
background: transparent url('../i/footer_logo.png') top left no-repeat; 
margin-top: 50px;
padding: 65px 0 10px 100px;
font-size: 85%;
color: #999;
border-top: 1px solid #ccc;
}

#footer a:link, #footer a:visited {
color: #999;
text-decoration: underline;
}

#footer a:hover {
color: #333;
text-decoration: underline;
}

.tagline {
margin: 8px 0;
height: 20px;
width: 237px;
}



/* contact form */

#contact-area {
width: 500px;
margin-top: 25px;
background: transparent;
padding: 10px 0 40px 0;
}

#contact-area input, #contact-area textarea {
padding: 5px;
width: 250px;
margin: 0px 0px 10px 0px;
border: 1px solid #999;
background: #fff;
color: #333;
font-size: 100%;
}

#contact-area textarea {
height: 90px;
}

#contact-area textarea:focus, #contact-area input:focus {
border: 1px solid #ec008c;
background: #fff;
}

#contact-area input.submit-button {
width: 80px;
margin-left: 368px;
}

label {
float: left;
text-align: left;
margin-right: 15px;
width: 170px;
padding-top: 5px;
font-weight: normal;
}
















.smallprint {
font-size: 90%;
color: #666;
}

.smallprint p, .smallprint ol {
margin-top: 0;
margin-bottom: 0;
}



a:link {
color: #333;
text-decoration: underline;
}
	
a:hover {
color: #ec008c;
text-decoration: underline;
}

a:visited {
color: #666;
text-decoration: underline;
}

a.product-image {
    border: 3px solid #666;
    float: left;
    display: block;
    margin: 0 10px 10px 0;
}

#sidebar_nobg h2 {
    clear: both;
    color: #666;
}

#sidebar_nobg h2:first-child {
    margin: 0 0 0.8em 0;
}

a.product-image img {
    display:block;
    border: none;

}

a.product-image:hover {
    border: 3px solid #ec008c;
}

p {
margin: 0 0 10px 0;
line-height: 150%;
}

p.sidebar {
color: #555;
margin: 10px;
font-size: 90%;
line-height: 140%;
}

#ul {
margin: 5px 0 20px 0;
list-style-type: disc;
padding-left: 20px;
}

#li {
margin: 5px 0;
}

h1 {
color: #666;
font: 250% "Helvetica Neue", helvetica, arial, sans-serif;
font-weight: 200;
line-height: 120%;
margin: 0 0 15px 0;
}

h2 {
color: #333;
font: bold 120% "Helvetica Neue", helvetica, arial, sans-serif;
line-height: 120%;
margin: 30px 0 3px 0;
}



.welcome {
font: bold 300% "Helvetica Neue", helvetica, arial, sans-serif;
line-height: 110%;
color: #666;
}

.largetext {
font: bold 140% "Helvetica Neue", helvetica, arial, sans-serif;
line-height: 120%;
color: #666;
}

.contact_panel {
color: #333;
font-weight: normal;
background:  #C1F3F7;
padding: 10px;
margin-top: 20px;
}

.pink {
color: #ec008c;
}

.black {
color: #333;
}


.floatleft {
float: left;
margin: 0 20px 10px 0;
border: 5px solid #fff;
}

.floatright {
float: right;
margin: 0 0 10px 20px;
border: 5px solid #fff;
}

.logo {
height: 151px;
width: 240px;
}

ul.products {
margin: 0;
padding: 0;
font-size: 100%;
list-style-type: none;
}

ul.products li {
margin: 0;
padding: 5px 0;
font-size: 100%;
list-style-type: none;
}


.grey_panel {
background:  #ddd;
padding: 10px;
margin-top: 20px;
}

.divider {
border-top: 1px dotted #333;
margin: 30px 0;
}

.client {
font-weight: bold;
text-transform: uppercase;
font-size: 80%;
color: #333; 
}

.quote {
color: #666;
font-size: 115%;
}

.icon {
width: 16px;
height: 16px;
margin: 5px 10px 0 0;
}