/*
    Copyright Notice ========================================================  
  
This file contains proprietary information of Alpine Internet Solutions. 
    Copying or reproduction without prior written approval is prohibited.   
  
Copyright (c) 2000-2006 ================================================= 

    Purpose: Site style definitions  
  
    @format.tab-size 4  
    @format.use-tabs true  
	
*/

/* Global Styles */
/* -------------------------------- */

/* zeroes margins and padding for all elements, eliminating cross-browser ambiguity */
/* ...currently commented out to make the templates easier to understand
...uncomment before starting design production */
* { 
margin: 0;
padding: 0;
}

body {
background: #FFFFFF;
color: #6C6C6C;
font-family: arial, helvetica, verdana, sans-serif;
font-size: 12px;
}

/* Semantic Content Styles */
/* -------------------------------- */

h1, h2, h3, h4, h5, h6 {line-height: 1.5em;}

h1 {font-size: 24px;}
h2 {font-size: 20px;}
h3 {font-size: 16px;}
h4 {font-size: 12px;}
h5 {font-size: 11px;}
h6 {font-size: 9px;}

p {font-size: 12px;}

ul {}
ol {}
li {}
ul li {}
ol li {}

dl {}
dt {}
dd {}

address {}
abbr {}
acronym {}
blockquote {}

strong, b {font-weight: bold;}
em, i {font-style: italic;}

img {border: 0;}
a img {border: 0;} /* keeps IE from always drawing a border around hyperlinked images */

hr {}

pre {}
code {font-family: courier new, courier, monospace;}

/* Hyperlink Styles */
/* -------------------------------- */

a {color: #999; text-decoration: underline;}
a:hover {color: #aaa; text-decoration: none;}

/* Form Styles */
/* -------------------------------- */

form {}
label {}
input {} /* stylize forms elements with caution... cross-browser support is infuriating */
input.text {} /* to stylize different types of inputs I need to give them classes, because IE doesn't support [attribute] CSS selectors */
input.radio, input.checkbox {border: 0; background: transparent;} /* keeps browsers from inadvertently drawing borders around these elements, and fixes an awful looking background-color overflow problem in IE */
input.button {}
input.image {border: 0;} /* keeps browsers from in advertently drawing borders around these elements */
select {}
option {}
textarea {}

/* Layout Styles */
/* -------------------------------- */

div#whopper {
text-align: left;
width: 750px;
background: url(/assets/2009_11_11_Homepage/images/body-bg-1.gif) top left repeat-y;
}
div#whopperInt {
text-align: left;
width: 750px;
/*background: url(/images/.design/body_bg_03.gif) top left repeat-y;*/
}
div#header {
position: relative;
width: 750px;
height: 125px;
overflow: hidden;
background: #FFFFFF url(/assets/2009_11_11_Homepage/images/header-bg.jpg) top left no-repeat;
border-bottom:4px solid #8a8a8a;
}
div#header h1 {text-indent: -9999px;}
div#header h1 a { /* typically do an image replacement for the text and logo, here */
text-decoration: none;
text-align: -9999px;
font: normal 24px/1.6em verdana, helvetica, arial, sans-serif;
}

div#headerInt {
position: relative;
width: 750px;
height: 125px;
overflow: hidden;
background: #FFFFFF url(/assets/2009_11_11_Homepage/images/header-bg.jpg) top left no-repeat;
border-bottom:4px solid #8A8A8A;
}
div#headerInt h1 {text-indent: -9999px;}
div#headerInt h1 a { /* typically do an image replacement for the text and logo, here */
text-decoration: none;
text-align: -9999px;
font: normal 24px/1.6em verdana, helvetica, arial, sans-serif;
}

div#headerLogo{
position:absolute;
top:40px;
left:18px;
}

div#main1 {
position: relative;
width: 750px;
height: 241px;
background: #FFFFFF;
}
div#colOneTop {
position: relative;
width: 135px;
height: 241px;
float: left;
background: #4C4C4C;
}
div#colTwoTop {
position: relative;
float: right;
width: 613px;
height: 241px;
/*background: url(/images/.design/photo_bg_01.jpg) top left no-repeat;*/
}
div#main2 {
position: relative;
width: 750px;
}
div#main2Top {
position: relative;
width: 760px;
height: 7px;
background:#fff;
/*background: url(/images/.design/bottom_bg_01.gif) top left no-repeat;*/
}
div#colOne {
position: relative;
width: 431px;
float: left;
margin: 5px 0 5px 5px;
}
div#colTwo {
position: relative;
width: 290px;
float: right;
margin: 5px 12px 5px 5px;
}
div#main3 {
position: relative;
width: 750px;
}
div#colOneInt {
position: relative;
width: 135px;
float: left;
background:#4c4c4c;
}
div#colTwoInt {
position: relative;
float: right;
width: 613px;
}
div#interiorTop {
position: relative;
width: 750px;
height: 3px;
/*background: url(/images/.design/interior_top_bg_01.gif) top left no-repeat;*/
}
html>body div#colTwo {
height: auto;
}

/* Content Area Styles */
/* -------------------------------- */

div#content {
position: relative;
width: 431px;
}
div#content p, div#content li {font-size: 11px; line-height: 1.3em;}
div#content p {
padding: 5px 5px 5px 20px;
color: #6C6C6C;
font-size: 12px;
}
div#content li {}
div#content ul, div#content ol { /* these are pretty good default values... i rarely customize these */
margin: 0 0 0 25px;
padding: 3px 10px 4px 15px;
}
div#content li {
padding: 0 0 5px 0;
}
div#content ul ul ul li {
list-style-image: url(/images/.design/dash.gif) center center no-repeat;
}
div#content h1, 
div#content h2, 
div#content h3, 
div#content h4, 
div#content h5, 
div#content h6 {line-height: 1.3em; padding: 5px 5px 5px 20px;}
div#content h1 {font-size: 16px; color: #FF9933;}
div#content h2 {font-size: 15px; color: #6C6C6C;}
div#content h3 {font-size: 14px; color: #FF9933;}
div#content h4 {font-size: 12px; color: #6C6C6C;}
div#content h5 {font-size: 11px; color: #FF9933;}
div#content h6 {font-size: 10px; color: #6C6C6C;}
div#content a {}
div#content a:hover {}
div#content form {
padding-left: 20px;
}
div#content input {}
div#content select {}

div#content2 {
position: relative;
width: 290px;
}
div#content2 p, div#content2 li {font-size: 12px; line-height: 1.3em;}
div#content2 p {padding: 5px 5px 5px 20px;}
div#content2 li {}
div#content2 ul, div#content2 ol { /* these are pretty good default values... i rarely customize these */
margin: 0 0 0 25px;
}
div#content2 li {
padding: 0 0 5px 0;
}
div#content2 h1, 
div#content2 h2, 
div#content2 h3, 
div#content2 h4, 
div#content2 h5, 
div#content2 h6 {line-height: 1.3em; padding: 5px 5px 5px 20px;}
div#content2 h1 {font-size: 16px; color: #FF9933;}
div#content2 h2 {font-size: 15px; color: #6C6C6C;}
div#content2 h3 {font-size: 14px; color: #FF9933;}
div#content2 h4 {font-size: 12px; color: #6C6C6C;}
div#content2 h5 {font-size: 11px; color: #FF9933;}
div#content2 h6 {font-size: 10px; color: #6C6C6C;}
div#content2 a {}
div#content2 a:hover {}
div#content2 form {padding-left: 20px;}
div#content2 input {}
div#content2 select {}

div#contentInt {
position: relative;
width: 604px;
}
div#contentInt p, div#contentInt li {font-size: 11px; line-height: 1.3em;}
div#contentInt p {
padding: 5px 5px 5px 20px;
color: #6C6C6C;
font-size: 12px;
}
div#contentInt li {}
div#contentInt ul, div#contentInt ol { /* these are pretty good default values... i rarely customize these */
margin: 0 0 0 25px;
padding: 3px 10px 4px 15px;
}
div#contentInt li {
padding: 0 0 5px 0;
}
div#contentInt h1, 
div#contentInt h2, 
div#contentInt h3, 
div#contentInt h4, 
div#contentInt h5, 
div#contentInt h6 {line-height: 1.3em; padding: 5px 5px 5px 20px;}
div#contentInt h1 {font-size: 16px; color: #FF9933;}
div#contentInt h2 {font-size: 15px; color: #6C6C6C;}
div#contentInt h3 {font-size: 14px; color: #FF9933;}
div#contentInt h4 {font-size: 12px; color: #6C6C6C;}
div#contentInt h5 {font-size: 11px; color: #FF9933;}
div#contentInt h6 {font-size: 10px; color: #6C6C6C;}
div#contentInt a {}
div#contentInt a:hover {}
div#contentInt form {
padding-left: 20px;
}
div#contentInt input {}
div#contentInt select {}

div#footer {
/*height: 81px;*/
height: 0px;
clear: both;
/*background: #FFFFFF url(/images/.design/bottom_bg_02.gif) top left no-repeat;*/
}
div#footer p {
text-align: center;
font-size: 10px;
font-family: arial, helvetica, verdana, sans-serif;
}
div#footer p a {
text-decoration: none;
}
div#footer a {}
div#footer a:hover {}
div#footerInt {
height: 81px;
clear: both;
/*background: #FFFFFF url(/images/.design/interior_bottom_bg_01.gif) top left no-repeat;*/
}
div#footerInt p {
text-align: center;
font-size: 10px;
font-family: arial, helvetica, verdana, sans-serif;
}
div#footerInt p a {
text-decoration: none;
}

/* Navigation Styles */
/* -------------------------------- */

div#nav {
width: 135px;
position: relative;
/*padding-top: 10px;*/
}
div#nav ul {
list-style: none;
/*padding-left: 6px;*/
}
div#nav ul li {
display: inline;
}
div#nav ul li a {
/*margin-top: 2px;*/
border-bottom: 1px solid #676767;
color: #fff;
text-decoration: none;
font-family: verdana, arial, sans-serif;
font-size: 10px;
display: block;
width: 130px;
height:25px;
line-height:25px;
padding: 4px 0 4px 5px;
}
div#nav ul li.on a {
color: #FFFFFF; 
background: #676767;
border: 1px solid #fff;
}
div#nav ul li a:hover {
color: #FFFFFF; 
background: #676767;
border-bottom: 1px solid #676767;
}
div#nav ul ul {
position: relative;
width: 133px;
padding: 0;
margin: 0;
border-left: 1px solid #676767;
border-right: 1px solid #676767;
border-bottom: 1px solid #676767;
} 
div#nav ul ul li {
border: 0;
padding: 0;
margin: 0;
}
div#nav ul ul li a {
border: 0;
margin: 0;
padding: 7px 0 7px 5px;
color: #FFFFFF;
}
div#nav ul li.on ul li a{
border: 0;
background: 0;
color: #CCCCCC;
}
div#nav ul ul li a:hover {
border: 0;
background: 0;
color: #F7A01F;
}

div#footerNav {padding: 20px 0 0 0;}
div#footerNav ul {list-style: none; text-align: center;}
div#footerNav ul li {display: inline; padding: 0 10px 0 10px;}
div#footerNav ul li a {
text-decoration: none;
font-family: verdana, arial, sans-serif;
font-size: 10px;
}
div#footerNav ul li a:hover {
text-decoration: underline; 
color: #999999;
}
div#headerNav {
position: absolute;
top: 0px!important;
top: 49px;
right: 10px;
}
div#headerNav a{
color:#fff;
}
div#headerNav ul {}
div#headerNav ul li {
text-indent: 0;
display: inline;
/*border: 1px solid #92ADDA;*/
background:#4c4c4c;
padding: 8px;
height: 20px;
margin-right: 0px!important;
margin-right: 2px;
-moz-border-radius-bottomleft: 5px;
-webkit-border-radius-bottomleft: 5px;
-moz-border-radius-bottomright: 5px;
-webkit-border-radius-bottomright: 5px;
}
div#headerNav ul li a {
text-indent: 0;
text-decoration: none;
font-family: verdana, arial, sans-serif;
font-size: 10px;
line-height: 20px;
}
div#headerNav ul li a:hover {
color: #FF9933;
}
div#headerNav ul, div#headerNav ol {
padding:0px;
margin:0px;
}
div#headerNavInt {
position: absolute;
top: 44px;
right: 10px;
}
div#headerNavInt ul {}
div#headerNavInt ul li {
text-indent: 0;
display: inline;
border: 1px solid #92ADDA;
padding: 3px;
height: 20px;
margin-right: 0px!important;
margin-right: 2px;
}
div#headerNavInt ul li a {
text-indent: 0;
text-decoration: none;
font-family: verdana, arial, sans-serif;
font-size: 10px;
line-height: 25px;
}
div#headerNavInt ul li a:hover {
color: #FF9933;
}

div#breadcrumbs {}
div#breadcrumbs ul {}
div#breadcrumbs ul li {}
div#breadcrumbs ul li a {}
div#breadcrumbs ul li a:hover {}

/* Search Form Styles */
/* -------------------------------- */

div#search {
position: absolute;
top: 90px;
right: 10px;
height: 19px;
width: 225px;
/*background: url(/images/.design/search_bg_01.gif) top left no-repeat;*/
}
div#searchInt {
position: absolute;
top: 80px;
right: 10px;
height: 19px;
width: 125px;
background: url(/images/.design/search_bg_01.gif) top left no-repeat;
}
div#search div#searchnow {
float:left;
}
input#searchboxer {
position: absolute;
top: 0px;
left: 0px;
width: 170px;
height:16px;
vertical-align: text-middle;
text-align: left;
border: 0;
line-height: 13px
color: #6C6C6C;
font-family: verdana, arial, sans-serif;
font-size: 10px;
padding-top: 4px;
padding-left: 4px;
background: #CCCED0;
}
input#gobabygo {
position: absolute;
right: 22px;
vertical-align: text-bottom;
color:#fff;
background:#0973AE;
border:1px solid #0973AE;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;

}
div#search img {}
div#search input {}
div#search input.text { /* remember to assign the class to the HTML elements */
padding: 2px;
color: #999;
}

div#search input.image {}

/* Search Results Styles */
/* these are good basic styles, and are rarely customized */
/* -------------------------------- */

div#searchResults {}
div#searchResults ol {}
div#searchResults ol li {}

div.searchResult {}
div.searchResult a {}
div.searchResult span.description {}
div.searchResult span.updated {}
div.searchResult span.location {}
div.searchResult span.score {}

div#searchRelated {float: right; clear: right; width: 150px;}
div#searchRelated span.description {}

/* Print and Email Styles */
/* styles for "print this page" and "email this page" container, links */
/* -------------------------------- */

div#pande {
position: relative;
width: 121px;
padding: 13px 0 13px 5px;
}
div#pande p {
width: 116px;
line-height: 1.5em;
border: 1px solid #676767;
padding: 5px 0 5px 6px;
}
div#pande p a {
font-size: 10px; 
text-decoration: none;
color: #CCCCCC;
font-family: verdana, arial, sans-serif;


}
div#pande p a:hover {text-decoration: underline; color: #FFFFFF;}

/* Common Styles */
/* aside from .current, .designed and .powered, these are never changed.  never ever. */
/* -------------------------------- */

.current {}
.powered {text-align: center; padding: 10px;}
.designed {}

.hide {display: none;}
.cloak {visibility: hidden;}

.floatL {float: left;}
.floatR {float: right;}

.clear {clear: both;}
.clearL {clear: left;}
.clearR {clear: right;}

.center {text-align: center;}
.left {text-align: left;}
.right {text-align: right;}

/* Debugging Styles */
/* heavy-handed spacing and bordering styles for diagnosing display problems. absurdly useful */
/* -------------------------------- */

/* 
td {margin: 2px; padding: 2px; border: 1px solid #c00;}
li {margin: 2px; padding: 2px; border: 1px solid #0c0;}
div {margin: 2px; padding: 2px; border: 1px solid #00c;}
*/