/*---------------  Top Menu Nav -----------------------------------------------------------------------------*/
ul#topnav {
	margin-top:10px;
	margin-left:0px;
	padding: 0;
	float: left;
	width: 100%;
	list-style: none;
	position: relative; /*--Set relative positioning on the unordered list itself - not on the list item--*/
	font-size: 11px;
	background: url(images/background/topnav_stretch.gif) repeat-x;
	color:#ffffff;
}
ul#topnav li {
	float: left;
	margin: 0; padding: 0;
	border-right: 2px solid #6A6A6A; /*--Divider for each parent level links--*/
}

ul#topnav li a {
	padding: 10px 15px;
	display: block;
	color: #f0f0f0;
	text-decoration: none;
}

#topnav-tollfree {
	float: right;
	padding: 10px 15px;
	display: block;
	color: #f0f0f0;
	text-decoration: none;
}

ul#topnav li:hover { background: #1376c9 url(images/background/topnav_active.gif) repeat-x; }
/*--Notice the hover color is on the list item itself, not on the link. This is so it can stay highlighted even when hovering over the subnav--*/

ul#topnav li span {
	float: left;
	padding: 10px 0;
	position: absolute;
	left: 0; top:33px;
	display: none; /*--Hide by default--*/
	width: 100%;
	background: #1376c9;
	color: #fff;
	/*--Bottom right rounded corner--*/
	-moz-border-radius-bottomright: 5px;
	-khtml-border-radius-bottomright: 5px;
	-webkit-border-bottom-right-radius: 5px;
	/*--Bottom left rounded corner--*/
	-moz-border-radius-bottomleft: 5px;
	-khtml-border-radius-bottomleft: 5px;
	-webkit-border-bottom-left-radius: 5px;
}
ul#topnav li:hover span { display: block; } /*--Show subnav on hover--*/
ul#topnav li span a { display: inline; } /*--Since we declared a link style on the parent list link, we will correct it back to its original state--*/
ul#topnav li span a:hover {text-decoration: underline;}

/*--------------- Home Page Block Section ------------------------------*/
.home-block {
	background: url(images/background/vert_repeat.gif) repeat-x;
	float: left; 
	display: block;
	height: 214px;
	padding: 10px 0px 10px 0px;
	width: 300px;
	-webkit-box-shadow: rgba(0, 0, 0, 0.496094) 0px 1px 3px;
}
.home-block-space { float: left; width:20px; height: 234px; display:block; background: #ffffff; }
.home-block-inner {
	margin: 0px atuo;
	width: 265px;
	padding: 20px;
}
.home-block-subtitle {
	visibility: visible !important;
	color:#8F8F8F;
	front-size: 24px;
	font-weight: normal;
	line-height: 20px;
	margin: -10px 0px 2px 0px;
	padding: 0px;
	text-transform:uppercase;
	font-size: 115%;
	font-weight:bold;
}

.home-block-title {
	visibility: visible !important;
	color: #000;
	margin-top: 0px;
	width:270px;
	font-size: 1.7em;
	line-height: 22px;
	text-transform: uppercase;
}

.home-block-more, .home-block-more:visited {
	font-zie:14px;
	font-weight:bold;
	line-height: 1;
	text-shadow: #D2D2D2 opx -1px 1px;
	padding: 5px 10px 5px;
	background: url(images/background/alert-overlay.png) repeat-x #1D1D1D;
	-webkit-border-bottom-left-radius: 5px 5px;
	-webkit-border-bottom-right-radius: 5px 5px;
	-webkit-border-top-left-radius: 5px 5px;
	-webkit-border-top-right-radius: 5px 5px;
	-webkit-box-shadow: rgba(0, 0, 0, 0.496094) 0px 1px 3px;
	border-bottom: 1px solid rgba(0, 0, 0, 0.246094);
	position:relative; top: 10px; left: 2px;
}
	

/*--------------- Solution Page Section --------------------------------*/
.sol-block {width: 300px;  margin-left: 20px; margin-right: 20px; float:left; padding-bottom:15px;  }
.sol-img-wrap {position: relative; text-align:left; border: 1px solid #aaa; padding: 10px; background: #fff;}
.sol-desc {font-size: 11px; padding-bottom: 2px; color: #636363; line-height: 180%; padding-top: 8px; font-family: Tahoma; text-align: left;}
.sol-img-title { background:#191919; overflow: hidden;position: absolute;bottom: 0;left: 10px;padding: 4px;border-bottom: 0 !important;}
.sol-title {display: block;font-weight: bold; text-align:center;}
.feature-tab-img-wrap { margin-right: 10px; position: relative; }
.readon { text-decoration: none; }
.readon:link, .readon:visited, .readon:active, .readon:hover {	font-size: 10px; color: #0095Da; font-family: Tahoma; text-decoration: none; padding-left:15px; }

/*--------------- Product page Section ---------------------------------*/
.pro-block {width: 335px;  margin-left: 5px; margin-right: 5px; float:left; padding-bottom:15px;  height:255px;}
.pro-img-wrap {position: relative; text-align:center; border: 1px solid #aaa; padding: 5px; background: #fff;}
.pro-desc {font-size: 10px; padding-bottom: 2px; color: #636363; line-height: 180%; padding-top: 8px; text-align: left;}
.pro-img-title { background:#191919; overflow: hidden;position: absolute;bottom: 0;left: 10px;padding: 4px;border-bottom: 0 !important;}
.pro-title {display: block;font-weight: bold; text-align:center;}
/*--------------- Front Page Tab Section  ohxiao 10/27/09-------------------------------*/
ul.tabs 
{
	margin: 0 auto; 
	padding: 0; 
	list-style: none;
	height: 25px;
	border-bottom: 1px solid #999;
	border-left: 1px solid #999;
	width: 680px;
}

ul.tabs li
{
	margin: 0; 
	padding: 0; 
	float:left;
	margin-bottom: -1px;
	overflow:hidden;
	position: relative;
	background: #9ad1ef;
	height: 24px;
	line-height: 24px;
	border: 1px solid #999;
	border-left: none; 
}

ul.tabs li a 
{
	text-decoration: none; 
	color: #000;
	display: block;
	width: 97px;
	font-size: 12px;
	padding: 0 18px;
	border: 1px solid #fff;
	outline: none;
	font-family: Tahoma;
}

ul.tabs li a:hover { background: #0095DA; }

html ul.tabs li.active, html ul.tabs li.active a:hover { background: #fff; border-bottom: 1px solid #fff; }

.tab_container 
{
	border: 1px solid #999;
	border-top: none;
	overflow: hidden;
	clear: both;
	/*float: left;*/
	width: 680px;
	background: #fff;
	margin: 0px auto;
}
.tab_container li { line-height: 150%; }

.tab_content { padding: 25px; font-size: .9em; outline:0px; vertical-align:baseline; line-height:165%; text-align:left;}
	
/* Product Gallery Style 
-------------------------------------------------------------------------------------------------------------------------------*/

#apg { padding-top:350px; list-style: none; width: 650px;  }
#apg li { opacity: .95; float: left; display: block; width: 132px; height: 79px; background-position: 50% 50%; cursor: pointer; border: 3px solid #fff; outline: 1px solid #ddd; margin-right: 16px; margin-bottom: 15px; }
#apg li img { position: absolute; top: 400px; left: 41%; display: none; }
#apg li.active img { display: block; }
#apg li.active, #jgal li:hover { outline-color: #bbb; opacity: .99 /* safari bug */ }
 
/* styling without javascript */
#gallery { list-style: none; display: block; }
#gallery li { float: left; margin: 0 10px 10px 0; }

/* ------------------------- Content Style Section --------------------------------------------------------------*/
.titlebg {
	background: url(images/background/title-bg.jpg) no-repeat 18% 120%;
	height: 60px;
	text-align: left;
	/*color: #0095da;*/
}

/* ------------------------ Nexenta Section (Green) Main Color --------------------------------------------------*/
div li.project {
	float: left;
	width: 190px;
	margin-bottom: 40px;
	position: relative;
}
div li.project h2 {
	padding: 20px 0 10px 0;
}
divh2.inside {
	margin-top: 80px
}
divli.project p {
	width: 190px;
	line-height: 1.6em;
	padding-bottom: 5px;
}
divli.project p a {
	font-weight: bold;
	color: #009BFF;
}
div#item-overview a img {
	cursor: pointer;
}
div.project {
	float: left;
	width: 190px;
	margin-bottom: 20px;
	margin-top:-10px;
	padding-left: 15px;
	position: relative;
}
div.project h2 {
	margin: -5px 0 10px 0;
	font-weight: normal;
}
div.project p {
	width: 190px;
	line-height: 1.6em;
	padding-bottom: 5px;
}
div.project p.small {
	line-height: 1.4em;
	margin-top: 25px;
}
div.project p a {
	font-weight: bold;
	color: #009BFF;
}
div.project .service1 span.green {
	font-weight: bold;
	border-bottom:1px dotted #9dbb00;
	color:#9dbb00 !important;
}
div.project .service1 span.orange {
	font-weight: bold;
	border-bottom:1px dotted #ec6601;
	color:#ec6601 !important;
}
div.project .service1 span.red {
	font-weight: bold;
	border-bottom:1px dotted #cd001d;
	color:#cd001d !important;
}
/*transparency animtion for start thumbs*/
div.project a img {
	opacity: .1;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=10)";
	filter:alpha(opacity=10);
 -webkit-transition: opacity .5s linear;
	padding:  0px;
}
div.project a:hover img {
	opacity: 1;
	padding:  0;
}
/*transparency animation for inside thumbs*/
div.project .back-service1 a img, div.project .back-service2 a img, div.project .back-service3 a img {
	opacity: .1;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=10)";
	filter:alpha(opacity=10);
 -webkit-transition: opacity .5s linear;
	padding:  0px;
}
div.project .back-service1 a:hover img, div.project .back-service2 a:hover img, div.project .back-service3 a:hover img {
	opacity: 1;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter:alpha(opacity=100);
}
div.project .back-service1 {
	background: transparent url(images/background/icongreen.png) 0 0 no-repeat;
	width: 190px;
	height: 160px;
	margin-bottom: 7px;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	-khtml-border-radius: 6px;
}
div.project .back-service2 {
	background: transparent url(images/backgroundiconorange.png) 0 0 no-repeat;
	width: 190px;
	height: 160px;
	margin-bottom: 7px;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	-khtml-border-radius: 6px;
}
div.project .back-service3 {
	background: transparent url(images/background/iconred.png) 0 0 no-repeat;
	width: 190px;
	height: 160px;
	margin-bottom: 7px;
	opacity: 1;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter:alpha(opacity=100);
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	-khtml-border-radius: 6px;
}
div.project p.service1 {
	height: 45px;
	padding-bottom: 3px;
}
div.project p.service2 {
	height: 45px;
	padding-bottom: 3px;
}
div.project p.service3 {
	height: 45px;
	padding-bottom: 3px;
}
div.project a.green {
	background: transparent url(images/background/icongreen.jpg) 0 0 no-repeat;
	display: block;
	width: 190px;
	height: 35px;
	text-decoration: none;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	-khtml-border-radius: 6px;
}
div.project a.red {
	background: transparent url(images/background/iconblue.jpg) 0 0 no-repeat;
	display: block;
	width: 190px;
	height: 35px;
	text-decoration: none;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	-khtml-border-radius: 6px;
}
div.project a.orange {
	background: transparent url(images/background/iconorange.jpg) 0 0 no-repeat;
	display: block;
	width: 190px;
	height: 35px;
	text-decoration: none;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	-khtml-border-radius: 6px;
}

/*3D Marquee Styles*/
 
.rectgreen, .rectred, .rectorange {
	-moz-border-radius-bottomright:5px;
	-moz-border-radius-topleft:5px;
	-moz-border-radius-topright:5px;
	-webkit-border-bottom-right-radius: 5px;
	-webkit-border-top-left-radius: 5px;
	-webkit-border-top-right-radius: 5px;
	float:left;
	margin-left: -10px;
	height:30px;
	position:absolute;
	top:25px;
	width:120px;
	z-index:100;
	-moz-box-shadow:1px 1px 1px rgba(0, 0, 0, 0.66);
	-khtml-box-shadow:1px 1px 1px rgba(0, 0, 0, 0.66);
	-webkit-box-shadow:1px 1px 1px rgba(0, 0, 0, 0.66);
	z-index: 100; /* the stack order: foreground */
}
.rectgreen h2, .rectred h2, .rectorange h2 {
	font-size: 12px;
	padding-top: 10px!important;
	text-align: center;
}
.bubble {
	clear: both;
	position: relative;
	z-index: 90; /* the stack order: displayed under ribbon rectangle (100) */
}
.trigreen, .trired, .triorange {
	border-style:solid;
	border-width:10px;
	height:0;
	left:-20px;
	position:absolute;
	top:0px;
	width:0;
	z-index: -1; /* displayed under bubble */
}
.trigreen {
	border-color:transparent #707a3a transparent transparent;
}
.trired {
	border-color:transparent #b51f34 transparent transparent;
}
.triorange {
	border-color:transparent #b8500d transparent transparent;
}
.rectgreen {
	background:#9dbb00 none repeat scroll 0 0;
}
.rectred {
	background:#0099ff none repeat scroll 0 0;
}
.rectorange {
	background:#ef7f2a none repeat scroll 0 0;
}
.rectgreen h2 {
	color: #ffffff!important;
	font-family:tahoma;
	font-weigt: bold;
}
.rectred h2 {
	color: #ffffff!important;
	font-family:tahoma
}
.rectorange h2 {
	color: #ffffff!important;
	font-family:tahoma
}