@charset "utf-8";
/* CSS Document */
/*
Theme Name: UtechSoft
Theme URI: http://www.utechsoft.com
Description: A theme by Unlimitech Software.
*/

* {padding: 0; margin: 0;}

body{
	background:#E4E4E4 url(images/bg.png) repeat-x;
	font: 75%/150% Verdana, Tahoma, Arial;
	font-size:11px;
	padding: 0px 0px 0px 20px;
}

hr {
      border: 1px dotted #CBCBCB;
      color: #fff;
      background-color: transparent;
      height: 1px;
      margin-top: 10px;
      margin-bottom: 10px;

}

h1,h2,h3,h4,h5 {
	font-family: "Trebuchet MS", Arial, sans-serif;
	font-weight: bold;
}

h1{
	font-size:18px;
	color: #fff;
	font-weight: bold;
}

h2 {
	font-size: 18px;
	color: #036;

}

.sub h2 {
  margin-bottom: 0.5em;
}

h3 {
	font-size: 14px;
	color: #036;
	margin-bottom: 1px;
}

p {	margin-bottom:12px;}

#fineprint{ font-size: 9px; color: #333; font-style: italic;}
#fineprint li {list-style-type: decimal;margin-left:15px;}

.bottom-content p {text-align:justify;}

a{
	text-decoration: none;
	font-weight:bold;
	color:#036;
}

#subcontent2 a:hover{text-decoration: underline;}

a:focus, a:visited {outline:none;} /*removes dotted borders from links in focus on Firefox*/

img {	border: none;}

#wrapper{
	width: 988px;
	background: none;
	margin-left:auto;
	margin-right:auto;
}

/************************ Start of Header *******************************/

#header-wrapper{
	/* min-height hack for IE6 */
	min-height:140px;
	height:auto !important;
	height: 140px;
	/*end min height hack */
	width:100%;
}

#header_right {
	float:right;
	width:auto;
}

#header-mid-wrapper{
	display:inline; /*fix IE6 double-width margins */
   	width:960px;
	/* min-height hack for IE6 */
	min-height:140px;
	height:auto !important;
	height: 140px;
	/*end min height hack */
	float: left;
	background: #FFF;
	margin-left:14px;
	margin-right:14px; /*left and right margins accomodate gradient divs*/
}

/************************ End of Header *******************************/

/************************ Begin styling used for gradient edges *******************************/

.side-wrapper-leftgradient {
	width: 100%;
	/* min-height hack for IE6 */
	min-height:140px;
	height:auto !important;
	height: 140px;
	/*end min height hack */
	float: right;
	background: url(images/shadow_left.png) repeat-y;
}

.side-wrapper-rightgradient {
	width: 100%;
	/* min-height hack for IE6 */
	min-height:140px;
	height:auto !important;
	height: 140px;
	/*end min height hack */
	float: right;
	background: url(images/shadow_right.png) right repeat-y;
}

.bottom-wrapper {
	width:100%;
	height:12px;
	display:inline; /*fix IE6 double-width margins */
	margin:0;
	padding:0;
}

.gradient-bottom-left{
	height:12px;
	width: 40%;
	float: left;
	background: url('images/shadow_bottom_left.png') no-repeat top left;
	display:inline; /*fix IE6 double-width margins */
}

.gradient-bottom-right{
	height:12px;
	width: 60%;
	/* min-height lets your site grow vertically (like in tables). */
	float: right;
	background: url('images/shadow_bottom_right.png') no-repeat top right;
	display:inline; /*fix IE6 double-width margins */
}

/************************ End styling used for gradient edges  *******************************/

/************************ Start of Content *******************************/

#title-wrapper{
	position:relative;
	/* min-height hack for IE6 */
	height:58px;
	width:100%;
	/*end min height hack */
	display:inline;
	float:left;
}

#title-header{
	display:inline; /*fix IE6 double-width margins */
	width:960px;
	height:100%;
	float: left;
	background: url(images/title_mid.png) repeat-x;
	margin-left:14px;
	margin-right:14px; /*left and right margins accomodate gradient divs*/
}

.title-leftgradient {
	display:inline; /*fix IE6 double-width margins */
	width: 100%;
	height:100%;
	float: left;
	background: url(images/title_left.png) no-repeat;
}

.title-rightgradient {
	display:inline; /*fix IE6 double-width margins */
	width: 100%;
	height:100%;
	float: right;
	background: url(images/title_right.png) right no-repeat;
}

#content-wrapper{
	width: 960px;
	/* min-height lets your site grow vertically (like in tables). The 2 extra height divs are an IE hack*/
	min-height:600px;
	height: auto !important;
	height:600px;
	margin: auto;
	background: #fff;
}

#content-area{
	width:100%;
	float:left;
	margin-top:-6px;
	z-index:-1;
}

.bottom-content {
	background:#fff;
	width:960px;
	float:left;
	display:inline;
	margin-left:14px;
	margin-right:14px;
	height:110%;
}

#homeheader1, #homeheader2, #homeheader3 {
	float: left;
	margin-top: 20px;
	display: inline; /*fix IE6 double-width margins */
	padding-left:10px;
	padding-right:10px;
	text-align: center;
	text-transform: uppercase;
}

#content1, #homeheader1 {
	width:278px;
	margin-left: 14px;
}

#content1, #content2, #content3 {
	text-align: justify;
	color: #000;
	padding:10px;
	float:left;
	display:inline; /*fix IE6 double-margins */
}

#content2 img{
	border:none;
}

#content2, #homeheader2 {
	width: 338px;
	margin-left:10px;
}

#content3, #homeheader3 {
	width:240px;
}

#content3 h3 {
  text-align:left;
}



/******************* SUB PAGE ***********************/

#subheader1, #subheader2 {
	float:left;
	margin-top: 20px;
}

#subheader1{
	width: 230px;
	margin-left: 10px;
}

#subheader1 h1{
	text-transform:uppercase;
}

#side_bar{
	float:left;
	width: 220px;
	height: 100%;
	margin: 10px;
	display:inline;
}

#subcontent2{
	width:700px;
	float:left;
	height: 100%;
	margin-top: 10px;
	margin-bottom:15px;
        padding-right: 18px;
}

#subcontent2 ol, ul {
  margin:0px;
  padding: 0px;
}



/************************ End of Content *******************************/

/************************ Start of List Types *******************************/

.box_list li{
  list-style-type: square;
  margin-left: 40px;
}

.ordered_anchor_list li{
  list-style-type:decimal;
  margin-left:26px;
}

.ordered_anchor_list a{
  font-weight:normal;
}
/************************ End of List Types *******************************/

/************************ Start of Topbar *******************************/
.chat,.cart,.support {
	float:left;
	display:inline;
	height:49px;
	margin-right:5px;
        width:50px;
        overflow:hidden;
        position:relative;
}

/*.cart {background:url('images/cart.png') no-repeat;} */

/*.support {background:url('images/support.png') no-repeat;} */

/*a.cart:hover,a.support:hover {background-position:0 -11px;} */ /*put negative value when the hover-over image is in a sprite */

a.chat:hover img, a.cart:hover img, a.support:hover img {position:absolute; top:-11px!important;}

#slider{
	padding: 0px;
	background: none;
	margin:2px 14px;
}

#search {
    float: right;
	width: 260px;
	padding-right: 0px;
	height: 46px;
	margin-top: 10px;
	margin-left: 5px;
        margin-right: -20px;
}

#top-bar{
position:relative;
    float: right;
    margin-top:5px;
/*	width: 180px;*/
	height: 53px;
}



.search-field {
	height: 20px;
	width: 140px;
    background-color: #fff;
    border: 1px solid #666666;
    color: #999;
}

#searchsubmit {
    height: 30px;
	font-weight:bold;
	font-size:12px;
	color: #039;
/*	background-image:url('images/bino.gif');*/
}

/************************ End of TopBar *******************************/

#logo{
	height: 125px;
	width: 480px;
	margin-left: 10px;
	float:left;
	background: url('images/logo.png') no-repeat center;

}

/************** SIDEBAR ***********/

#side_bar ul, li{
   list-style-type:none;
}

#side_bar ul{
	margin-bottom: 45px;
}

#side_bar ul.children{
margin-bottom:0;
}

#side_bar li li{
	margin-left:4px;
}

#side_bar li a{
	font-weight:normal;
	font-family: Verdana, Arial, sans-serif;
	font-size:12px;
	color: #036;
	padding-left:15px;
}

#side_bar li a:hover{
	color: #F15C22;
	padding-left: 15px;
        background: url('images/small_logo.png') no-repeat left;
}

#side_bar h2 {
	margin-bottom:5px;
}

/***************PRODUCT PAGES******************/

.sub {display:inline;float:left;}
.sub_thumb {width:150px;line-height:0;float:left;}
.sub_text {width:530px;float:right;padding-left:15px;}

/***************CUSTOM CLASSES****************/

.faq h3{
font-size:16px;}

.faq h4{
font-weight:bold
font-size:14px;
color: #E85412;
}


/************* UTILITY CLASSES ***********************/
.clear { clear: both;}
.hidden {visibility:hidden; width:100%}
.breadcrumb h1, .breadcrumb a {
	color: #F9F9F9;
	font-size: 14px;
}
.left {float:left;}
.right {float:right;text-align:right;}
.center {margin-left:auto;margin-right:auto;text-align:center;}
.italic {font-style:italic;}
.bold {font-weight:bold;}
.code {font-family: "Courier New", "Courier", monospace; }
.spacer {height: 12px;}
.grayback {background: #e4e4e4;}

/************* COMMON COLORS ***********************/
.orange {color: #E85412;}
.blue {color: #003374;}
.more-link {color: #E85412;} /*same as orange, but might change later*/

/************** TABLES ***********/
table {border-collapse: collapse; width: 100%; }
th { padding: 1em; border: 1px #ccc solid; background: #697ca1; color: #fff; font-size: 15px; text-align:left;}
td, tr {padding: 1em; border: 1px #ccc solid; background: #dedfde;}
#highlight tr.hilight { background: #A4A4A4; }

table .contactinfo{ border: none; width: 100%; padding:1em;}

/************** SHADOWBOX JS ***********/

#sb-player{background: #fff;}