/*  
Theme Name: HCST Network Services
Theme URI: http://www.hcst.com/
Description: HCST Theme.
Version: 1.0
Author: Dave Kress, Jonathan Davis
Author URI: http://www.ingenesis.net/
*/

@import "core.css";

/**
 * Base Typography & Colors
 **/
body { background: #dfdfe4 url('../images/background.jpg') repeat-x left top; font: 14px "Arial","Helvetica",sans-serif; line-height: 1.4; }
a { color: #8d0000; text-decoration: none; }
a:hover { color: #4c0000; }
p { margin-bottom: 18px; color: #33333c; }
h1 {  }

h3,h4,h5,h6 { color: #550000; font-weight: bold; margin: 40px 0 5px 0; }

h2 { color: #6b110f; font-weight: bold; font-size: 36px; }
h3 { font-size: 24px; color: #4c0000; }
h4 { font-size: 18px; }
h5 { font-size: 16px; }
h6 { font-size: 14px; }
ul { color: #33333c; list-style-image: url('../images/bullet.gif'); padding: 0 0 0 15px; margin-bottom: 18px; }
dt { font-weight: bold; font-size: 15px; letter-spacing: -0.08em; color: #33333c; }
dd { margin-left: 0; margin-bottom: 18px; }

/**
 * Header
 **/
#header { background: url('../images/headerbg.jpg') no-repeat left 10px; width:1025px; height: 182px; margin: 0 auto; z-index: 2; position: relative;} 

#tagline { top: 49px; left: 0; position: absolute;}
#logo { top: 77px; left: -23px; position: absolute; }

#toolbar { background: #adaebb; width: 330px; height: 24px; margin-left: 584px; list-style: none; }
#toolbar li { padding: 5px 8px 0px 12px; float: left; background: url('../images/pipe.png') no-repeat left 3px; }
#toolbar li.item2 { padding-left: 8px; background: none; }

/* #navigation { width: 433px; height: 33px; top: 106px; left: 507px; position: absolute; z-index: 10; font: bold 14px; display: block; list-style: none; padding: 0; } */
/* #navigation { width: 575; height: 33px; top: 106px; left: 307px; position: absolute; z-index: 10; font: bold 14px; display: block; list-style: none; padding: 0; } */
#navigation { width: 575px; height: 33px; top: 106px; left: 370px; position: absolute; z-index: 10; font-weight: bold; font-size: 14px; display: block; list-style: none; padding: 0; }
#navigation li { padding-left: 5px; float: left; position: relative; }
#navigation li img { display: block; }
#navigation li a { color: #fff;}

#navigation .parent span.separator span { display: none; }
#navigation .item1 { width: 97px; height: 33px; background: url('../images/supportnav.png') no-repeat; }
#navigation .item1.hover { background-position: left -33px; }
#navigation .item7 { width: 175px; height: 33px; background: url('../images/hardsoftnav.png') no-repeat; }
#navigation .item7.hover { background-position: left -33px; }
#navigation .item14 { width: 140px; height: 33px; background: url('../images/internetnav.png') no-repeat; }
#navigation .item14.hover { background-position: left -33px; }
#navigation .item25 { width: 140px; height: 33px; background: url('../images/voippbxnav.png') no-repeat; }
#navigation .item25.hover { background-position: left -33px; }

#navigation li ul { background: #314055 url('../images/menubg.jpg') no-repeat top right; color: #fff; width: 262px; padding: 10px; position: absolute; left: -999em; text-align: right; top: 33px; }
#navigation li.hover ul { left: auto; right: 5px; }
#navigation li ul li { display: block; float: none; }
#navigation li ul li a { display: inline-block; width: 242px; height: 20px; padding: 10px 10px 5px; }
#navigation li ul li a:hover {  background: url('../images/menuhover.jpg') no-repeat; }

/**
 * Homepage
 **/

#homepage { background: url('../images/shadows.jpg') no-repeat left 286px; width: 924px; margin: 0 auto; position: relative; z-index: 1;}

.popup { background-image: url('../images/popup.png') ; background-repeat: no-repeat; position: absolute; width: 208px; height: 80px; padding: 5px 10px 0;  /* filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/popup.png', sizingMethod='scale'); */ }
.popup { behavior: url('../images/pngbehavior.htc'); }
.popup h4 { color: #4c0000; font-size: 15px; font-weight: bold; line-height: 18px; text-transform: lowercase; letter-spacing: -0.08em; margin: 0; }
.popup p { color: #333333; font-size: 13px; line-height: 15px; }
#popphone { top: 20px; left: 40px; }
#popcomputer { top: 20px; left: 350px; }
#popservers { top: 20px; left: 650px; }

#phone { left: 25px; top: 129px; position: absolute;  }
#computer { left: 308px; top: 100px; position: absolute; }
#servers { left: 665px; top: 99px; position: absolute; }

#infobox { margin-top: 18px; }
#welcome { background: url('../images/welcomebg1.jpg') no-repeat top; width: 565px; float: left; padding: 30px 25px 40px 28px; }
#welcome h2 { font-size: 18px; letter-spacing: -1px; margin: 0; }
#welcome p { color: #333333;line-height: 28px; }

#features { height: 202px; list-style: none; padding: 0; margin: 0 -25px 0 -28px; }
#features li { padding-right: 4px; float: left; }
#features li.last { padding-right: 0;}

#homepage div.support p { color: #535456; font-weight: 900; font-size: 15px; letter-spacing: -1px; margin: 0; }
#homepage div.support p.heading { color: #4c0000; font-weight: bold; letter-spacing: -1px;}
#homepage div.support p.support { font-size: 18px; }
#homepage div.support p.hours { font-size: 15px; margin-top: 22px;}

#homepage #latestnews ul { background: url('../images/shadow.jpg') no-repeat top; width: 260px; }
/* .column { margin: 80px 0 0 20px; float: left; } */
.column { margin: 18px 0 0 20px; float: left; }

.column h4 { font-weight: bold; margin: 40px 0 5px 0;}
.column li { padding: 10px 0 0 0; }
.column span.date { color: #535456; font: 11px; }
.column ul li a { color: #4c0000; font: 13px; margin-left: 5px;}
.column ul li a:hover { text-decoration: underline; }
.column img { margin-top: 18px; }


/**
 * Content
 **/

.shadowtop { background: url('../images/bordershadowtb.jpg') repeat-x top; height: 10px; width: 944px; margin: 0 auto; position: relative; }

#frame { background: #fff url('../images/contentbg.jpg') repeat-y top; width: 942px; margin: 0 auto; padding-bottom: 30px; position: relative; }
#content a { color: #b10000; text-decoration: underline; }

#content { width: 556px; padding-left: 30px; float: left; }
#content h2 { letter-spacing: -2px; background: url('../images/rule.gif') no-repeat top left; margin-left: -21px; margin-bottom: 20px; }
#content h2 sub { font-size: 12px; letter-spacing: -1px; display: block; padding: 29px 0 0 21px; }
#content h2 span { display: block; margin-top: -5px; padding-left: 20px;}
#content blockquote { color: #fff; background: #56595f url('../images/quotebg.jpg') repeat-y right; font: bold 15px; width: 417px; margin: 10px 10px 10px -21px; padding: 20px; float: left; }



#content p.lead { color: #666666; font-weight: bold; font-size: 16px; letter-spacing: -1px; margin-top: 15px; line-height: 25px; }

#sidebar { width: 298px; float: left; }
#sidebar h4 { width: 298px; margin: 30px 0 10px 30px; float: left;}

#sidebar #support { background: url('../images/sidebarulbg.jpg') repeat-x top; border-top: 1px solid #a9a9b5; width: 298px; height: 220px; margin: 0 0 0 30px; }
#sidebar #support img { padding-left: 20px; margin-top: 15px; float: left; display: block; }
#sidebar #support p { margin-top: 15px; padding-left: 10px; float: left; margin-bottom: 0; }
#sidebar #support p.sub { color: #535456; padding-bottom: 0;}
#sidebar #support .contact { color: #4c0000; font-size: 24px; margin-top: 0; padding-bottom: 0 margin-left: 15px; list-style-image: url('../images/bullet.gif'); }

#sidebar div ul { padding: 0px 10px; }
#sidebar div.panel.column { background: url('../images/sidebarulbg.jpg') repeat-x top; width: 263px; margin: 0 0 0 30px; padding: 10px 0 20px 30px; float:left; }
#sidebar div.panel.column ul { margin-bottom: 0; }
#newsbuttons { padding-left: 125px; }
#newsbuttons li { display: inline; }

.shadowbottom { background: url('../images/bordershadowtb.jpg') repeat-x top; height: 10px; width: 944px; margin: 0 auto; position: relative; background-position: left -10px; }


/**
 * Contacts
 **/

#contacts { padding-left: 0; }
#contacts li { display: block; width: 44%; height: 80px; margin: 0 10px 10px 0; float: left;  background: url('../images/sidebarulbg.jpg') repeat-x top; padding: 10px; line-height: 1; }
#contacts h3 { margin-top: 0; }
#contacts a { color: #6b110f; text-decoration: none; }
#contacts a:hover { text-decoration: underline; }

form ul { width: 100%; clear: both; line-height: 1; list-style: none; padding-left: 0; }
form ul li { text-indent: 0; clear: both; display: block; padding: 4px 0; margin: 0; }
form label { clear: both; display: block; }
form ul li label.inline { display: inline; clear: none; }
form ul li:before { content: ""; }
form ul li div.inline { width: auto; clear: both; }
form ul li div.inline input { width: auto;  }
form ul li div.inline label { clear: none; display: inline; }
form ul li span input { margin: 0 0 5px 0; }
form ul li div input,
form ul li div select,
form ul li div textarea { width: 100%; }
form ul li div.left { display: inline; width: 47%; float: left; margin: 0; clear: left; }
form ul li div.right { display: inline; width: 47%; float: right; margin: 0; clear: right; }
form ul li.half { display: inline; width: 47%; float: left; clear: none; }
form ul li.half.right { display: inline; float: right; }
form ul li span { float: left; padding: 0 5px 0 0; display: inline-block; text-align: left; }
form ul li span label,
form div label { clear: both; }
form label { font-size: 14px; font-weight: bold; padding-bottom: 3px; }
form ul li span label,
form div label { font-size: 11px; font-weight: normal; padding-bottom: 8px; }
form div.alignright { text-align: right; }
/**
 * Footer
 **/

#footer { background: #202124 url('../images/footer.png') repeat-y top; height: 41px; width: 100%; margin-top: 30px;  position: relative; }
#footer a { color: #929292; }
#footer ul { width: 924px; margin: 0 auto; color: #929292; font-weight: bold; font-size: 11px; padding-top: 15px; }
#footer ul li { display: inline; margin-right: 40px; }