body  {background:transparent url(../images/top_bg2.jpg) no-repeat top center; margin:0; padding:0; text-align:center; font-family:Arial; font-size:12px; color:#000;}

html {
   background:#e05a01 url(../images/main_bg.jpg) repeat-x;
   height:100%;
}

html>body {
 min-height:512px;
 height:auto;
}

#mainBox {
   width:100%;
   float:left;
}

#whiteBox {
   width:100%;
   float:left;
   background-image:url(../images/white_bg.gif);
   padding-bottom:10px;
}

#blueBox {
   width:100%;
   height:216px;
   float:left;
   background-image:url(../images/blue_bg.gif);
   background-repeat:repeat-x;
}

#orangeBox {
   width:100%;
   height:145px;
   float:left;
   background:transparent url(../images/orange_bg.gif) repeat-x;
}

.wrapper {width:1000px; margin:0 auto; text-align:left;}
#maincontainer {width:1000px; float:left;}

/* Sprites / Navigation
----------------------------------------------------------------------------*/
.sprite {background:url(../images/nav_img2.png);}

#topNav {
   width:695px;
   float:left;
}
#topNav span {display:none;}
#topNav ul {list-style-type:none; padding:0px; margin:0px;}
#topNav li {display:inline;}

#who {width:141px; height:55px; background-position:0 0; float:left;}
#who:hover {width:141px; height:55px; background-position:0 -55px; float:left;}
#our {width:137px; height:55px; background-position:-141px 0; float:left;}
#our:hover {width:137px; height:55px; background-position:-141px -55px; float:left;}
#port {width:139px; height:55px; background-position:-278px 0; float:left;}
#port:hover {width:139px; height:55px; background-position:-278px -55px; float:left;}
#note {width:138px; height:55px; background-position:-417px 0; float:left;}
#note:hover {width:138px; height:55px; background-position:-417px -55px; float:left;}
#con {width:135px; height:55px; background-position:-555px 0; float:left;}
#con:hover {width:135px; height:55px; background-position:-555px -55px; float:left;}

/* Top Login Nav
----------------------------------------------------------------------------*/
#loginNav {
   width:974px;
   height:20px;
   float:left;
   margin-left:26px;
   margin-top:4px;
   overflow:hidden;
}

#wisnetcom {
   width:242px;
   height:20px;
   float:left;
   background:transparent url(../images/curve_bg.gif) no-repeat;
   font-family:"Trebuchet MS", serif;
   font-size:11px;
   font-weight:bold;
}
#wisnetcom a {color:#3e6692; text-decoration:none;}
#wisnetcom a:hover {color:#fff; text-decoration:none;}
#wisnetcom p {margin:0 0 0 9px;}

#wisnetOthers {
   width:478px;
   float:left;
   font-family:"Trebuchet MS", serif;
   font-size:11px;
   font-weight:bold;
}
#wisnetOthers ul {list-style-type:none; margin:0px; padding:0px;}
#wisnetOthers li {display:inline;}
#wisnetOthers li a {margin-right:24px; color:#3e6692; text-decoration:none;}
#wisnetOthers li a:hover {margin-right:24px; color:#fff; text-decoration:none;}

#wisnetLogin {
   width:254px;
   float:left;
   font-family:"Trebuchet MS", serif;
   font-size:11px;
   font-weight:bold;
   background:transparent url(../images/login_curves.gif) no-repeat;
}
#wisnetLogin ul {list-style-type:none; margin:0px; padding:0px;}
#wisnetLogin li {display:inline;}
#wisnetLogin li a {margin-left:8px; margin-right:14px; color:#ea7b01; text-decoration:none;}
#wisnetLogin li a:hover {margin-left:8px; margin-right:14px; color:#fff; text-decoration:none;}

/* Logo / Search
----------------------------------------------------------------------------*/
#logoNavBox {
   width:974px;
   float:left;
   margin-left:26px;
   margin-top:26px;
}

#logo {
   width:279px;
   float:left;
}

#srchBox {
   width:988px;
   height:24px;
   float:left;
   margin-top:22px;
   text-align:right;
   background:transparent url(../images/search_bg.gif) no-repeat top right;
   overflow:hidden;
}

#srch {
   width:140px;
   float:right;
}

#srchBtn {
   width:50px;
   float:right;
}

/* Portfolio / 3 Boxes Row
----------------------------------------------------------------------------*/
#portBox {
   width:976px;
   float:left;
   margin-top:14px;
   margin-left:24px;
}

#ourWork {
   display:block;
   width:652px;
   float:left;
}
.viewourwork {
	display:block;
	width:137px;
	height:33px;
	background-image:url(../images/view-our-work.png);
	background-repeat:no-repeat;
	z-index:1000;
	position:absolute;
	margin:290px 0 0 438px;
}
.viewourwork a{
	display:block;
	width:137px;
	height:33px;
}
.viewourwork a:hover{
	display:block;
	width:137px;
	height:33px;
}
.viewourwork span {display:none;}
#webBoxes {
   width:317px;
   float:left;
}

#webDesign {
   width:317px;
   height:109px;
   float:left;
   background-image:url(../images/box_bg.gif);
   overflow:hidden;
}
#webDesign h1{margin-top:33px; margin-bottom:0px; text-align:center;}
#webDesign p {width:294px; float:left; margin:0 0 0 16px; padding:0px; color:#333; font-family:"Trebuchet MS", serif;}

#hosting {
   width:317px;
   height:109px;
   float:left;
   margin-top:7px;
   background-image:url(../images/box_bg.gif);
   overflow:hidden;
}
#hosting h2{margin-top:33px; margin-bottom:0px; text-align:center;}
#hosting p {width:294px; float:left; margin:0 0 0 16px; padding:0px; color:#333; font-family:"Trebuchet MS", serif;}

#emailBox5 {
   width:317px;
   height:109px;
   float:left;
   margin-top:7px;
   background-image:url(../images/box_bg.gif);
   overflow:hidden;
}
#emailBox5 h2{margin-top:12px; margin-bottom:6px; text-align:center;}
#emailBox5 p {width:294px; float:left; margin:0 0 0 16px; padding:0px; color:#333; font-family:"Trebuchet MS", serif;}

.boxText {
   width:294px;
   float:left;
   margin-left:16px;
   color:#333;
   font-family:"Trebuchet MS", serif;
}
.boxText h2 {margin-top:0px; margin-bottom:0px;}

/* Featured Sites
----------------------------------------------------------------------------*/
#featProj {
	width:1000px;
	height:111px;
	float:left;
	background:transparent url(../images/featured-projects.jpg) no-repeat left 38px;
}

#projScroll {
   width:536px;
   float:left;
   margin-left:198px;
}

.projImg {
   width:106px;
   float:left;
}

#projArrow {
   width:250px;
   float:left;
   margin-top:16px;
}

/* White Box Info
----------------------------------------------------------------------------*/
#whiteMain {
   width:985px;
   float:left;
   margin-left:8px;
}

#whiteLeft {
   width:318px;
   float:left;
   margin-top:15px;
   background:transparent url(../images/hd_objectives.gif) no-repeat top left;
}

#whtLTxt {
   width:318px;
   float:left;
   margin-top:25px;
   font-family:Helvetica, Arial;
   color:#2c1700;
   line-height:20px;
}
#whtLTxt p {margin:8px 0 8px 0;}
#whtLTxt a {color:#5f0460; text-decoration:none; font-family:Verdana; line-height:13px; padding-right:10px; background:transparent url(../images/purp_arrow.gif) no-repeat right 5px;}
#whtLTxt a:hover {color:#5f0460; text-decoration:underline; font-family:Verdana; line-height:13px; padding-right:10px; background:transparent url(../images/purp_arrow.gif) no-repeat right 5px;}

#whiteMid {
   width:288px;
   float:left;
   margin-left:42px;
   margin-top:15px;
   background:transparent url(../images/many_services.gif) no-repeat top left;
   font-family:Helvetica, Arial;
   color:#2c1700;
   font-size:13px;
}
#whiteMid ul {list-style-image:url(../images/checkmark.gif); padding:0px; margin:60px 0 0 36px;}
#whiteMid li {margin-bottom:10px;}
#whiteMid a {color:#2c1700; text-decoration:none;}
#whiteMid a:hover {color:#2c1700; text-decoration:underline;}

#whiteRt {
	width:337px;
	float:left;
	background:transparent url(../images/note_blog.gif) no-repeat left 4px;
}

#NOTEWORTHY{
   width:auto;
   float:left;
}

#noteBox {
   width:327px;
   float:left;
   margin-top:46px;
}

#noteBox .inNoteL {
   width:auto;
   float:left;
}

#noteBox .inNoteR {
   width:330px;
   float:left;
   margin-left:24px;
}

#scroller {width:350px; height:300px; position:relative;}
#scroller .scrollobj {width:350px; height: 300px;}

.blogHold {
   width:auto;
   float:left;
   margin:10px 0 0;
   display:block;
}

.quoteBox { width:40px; height:44px; margin:0 6px 0 0;float:left; text-align:center; overflow:hidden; background: url(../images/quote_bg2.gif) no-repeat left;display:block; }
.quoteBox h3 {font-size:11px; color:#fff; margin-top:0px; margin-bottom:0px; font-family:"Trebuchet MS", serif; line-height:12px;}
.quoteBox h4 {font-size:20px; color:#fff; margin-top:0px; margin-bottom:0px; font-family:"Trebuchet MS", serif;}

.blogText {
   width:290px;
   float:right;
   font-size:11px;
   font-family:Helvetiva, Verdana, Arial;
   color:#2e1700;
   display:block;
}
.blogText p {margin:0;padding:0;line-height:16px;display:inline;}
.blogText a {color:#345d93; text-decoration:none; font-weight:bold;}
.blogText a:hover {color:#2e1700; text-decoration:none; font-weight:bold;}

#prevBox {
   width:310px;
   float:left;
   margin-top:12px;
   margin-left:40px;
}

#NOprevBtn {
   width:227px;
   height:14px;
   float:left;
   margin-left:40px;
   font-family:"Helvetica Bold", Helvetica, Arial;
   text-indent:6px;
   color:#261300;
   margin-top:6px;
   line-height:12px;
}

#prevBtn {
   width:227px;
   height:14px;
   float:left;
   margin-left:40px;
   font-family:"Helvetica Bold", Helvetica, Arial;
   text-indent:6px;
   color:#261300;
   margin-top:6px;
   line-height:12px;
   background:transparent url(../images/prev_bg.gif) no-repeat;
}
#prevBtn a {color:#2d4a1c; text-decoration:none; padding-left:5px; background:transparent url(../images/gr_prev_arrow.gif) no-repeat left 5px;}
#prevBtn a:hover {color:#2d4a1c; text-decoration:underline; padding-left:5px; background:transparent url(../images/gr_prev_arrow.gif) no-repeat left 5px;}

#NOnextBtn {
   width:40px;
   height:14px;
   float:left;
   font-family:"Helvetica Bold", Helvetica, Arial;
   text-indent:4px;
   color:#261300;
   margin-top:6px;
   line-height:12px;
}

#nextBtn {
   width:40px;
   height:14px;
   float:left;
   font-family:"Helvetica Bold", Helvetica, Arial;
   text-indent:4px;
   color:#261300;
   margin-top:6px;
   line-height:12px;
   background:transparent url(../images/next_bg.gif) no-repeat;
}
#nextBtn a {color:#2d4a1c; text-decoration:none; padding-right:8px; background:transparent url(../images/gr_next_arrow.gif) no-repeat right 5px;}
#nextBtn a:hover {color:#2d4a1c; text-decoration:underline; padding-right:8px; background:transparent url(../images/gr_next_arrow.gif) no-repeat right 5px;}

/* Blue Box Info
----------------------------------------------------------------------------*/
#blueLeft {
   width:240px;
   height:163px;
   float:left;
   margin:18px 0 0 0;
   background:transparent url(../images/blue_dots.gif) repeat-y top right;
}

#blueLTxt {
   width:240px;
   float:left;
   background:transparent url(../images/blue_dude.gif) no-repeat top left;
   font-family:"Trebuchet MS", serif;
   font-size:12px;
}
#blueLTxt ul {list-style-type:none; margin:14px 0 0 17px; padding:0px;}
#blueLTxt li {margin:0 0 9px 0;}
#blueLTxt li a {color:#70beed; text-decoration:none;}
#blueLTxt li a:hover {color:#fff; text-decoration:none;}

#blueMid {
   width:505px;
   float:left;
   margin:26px 0 0 13px;
}

#blueMidLeft {
   width:252px;
   float:left;
}
#blueMidLeft ul{list-style-type: none;margin:0;padding:0;}

#blueMidRt {
   width:253px;
   float:left;
}
#blueMidRt ul{list-style-type: none;margin:0;padding:0;}

#blueView {
   width:490px;
   height:52px;
   float:left;
   margin:10px 0 0 0;
   background-image:url(../images/view_bg.gif);
   overflow:hidden;
}
#blueView a {font-size:12px; font-family:"Trebuchet MS", serif; color:#70beed; font-weight:bold; display:block;text-align:center; margin: 18px 4px 0 0;padding:0; text-decoration:none;background:url(../images/sky_blue_arrow.gif) no-repeat 315px 6px;}
#blueView a:hover {color:#fff; text-decoration:none;}

.blueRtTxt {
	width:200px;
	float:left;
	margin:18px 0 0 0;
	padding:0 0 0 18px;
	_padding:0 0 0 18px;
	color:#70beed;
	font-family:"Trebuchet MS", serif;
	background:transparent url(../images/blue_dots.gif) repeat-y top left;
	display:block;
	height:163px;
}
.blueRtTxt ul{margin:0;padding:0;display:block;list-style:none;}
.blueRtTxt li{margin:0 0 3px 0;padding:0;font-style: normal;display:block;list-style:none;}
.blueRtTxt .phone{margin:0;padding:32px 0 0 0;font-style: normal;display:block;background:url(../images/blue_line.gif) no-repeat left 3px;display:block;}
.blueRtTxt .businessname {font-size:22px; font-family:"Trebuchet MS", serif; color:#70beed;margin:2px 0 5px 0;display:block;}


.bluedark {
	font-size:12px;
	color:#70beed;
	font-family:"Trebuchet MS", serif;
	font-weight:normal;
	text-indent:11px;
	width:238px;
	height:22px;
	margin: 4px 0 2px 0;
	padding:2px 0 0 0;
	background:transparent url(../images/h5_bg.gif) no-repeat left 0px;
	display:block;
}
.bluedark a {color:#70beed; text-decoration:none;}
.bluedark a:hover {color:#FFFFFF; text-decoration:none;}
.bluenone {font-size:12px; color:#70beed; font-family:"Trebuchet MS", serif; font-weight:normal; text-indent:11px; width:238px; height:22px; margin: 6px 0 0 0;}
.bluenone a {color:#70beed; text-decoration:none;}
.bluenone a:hover {color:#FFFFFF; text-decoration:none;}

/* Footer
----------------------------------------------------------------------------*/
#copyright {
   width:643px;
   float:left;
   text-indent:20px;
   font-family:Helvetica, Arial;
   font-size:13px;
   color:#fff;
}
#copyright p {margin-top:84px;}
#copyright a {color:#AD4802;margin:4px 0 0 20px;font-size:11px;}

#planeBox {
   width:357px;
   height:136px;
   float:left;
   background:transparent url(../images/plane_bg.jpg) no-repeat top left;
   overflow:hidden;
   color:#f09100;
   font-size:11px;
   font-family:"Trebuchet MS", serif;
}
#planeBox p {margin-left:92px; margin-top:0px; margin-bottom:0px;height:32px;}

#subTextFld {
   width:147px;
   height:27px;
   float:left;
   margin-left:50px;
   margin-top:18px;
   background:transparent url(../images/text_field_bg.gif) no-repeat;
}
#subTextFld p {margin:2px 0 0 4px;}

#inSubBtn {
   width:167px;
   float:left;
}
#inSubBtn p {margin:29px 0 0 118px;}

/* Classes
----------------------------------------------------------------------------*/
.sm_text {font-family:Helvetica, Arial; font-size:11px;margin:2px 0;padding:0;display:block;line-height:11px;}
.sub {font-size:22px; font-family:"Trebuchet MS", serif; color:#70beed;}
.sub2 {font-size:13px; color:#261300; font-family:Helvetica, Arial; font-weight:bold;}
.sub2 a {color:#261300; text-decoration:none;line-height:13px;margin:0 0 1px;display:block;}
.sub2 a:hover {color:#261300; text-decoration:underline;}
.text_field {border:0px; width:135px; height:18px; background-color:#fedaa2; color:#8b4615; font-size:13px;}
.text_field2 {border:0px; width:138px; height:22px; background-color:#646464; color:#fff; font-size:13px;}
a img {border:none;}
form {padding:0px; margin:0px;}

/* Homepage Slider Gallery
----------------------------------------------------------------------------*/
div.content {
	/* The display of content is enabled by a javascript generated style on the page.
	   This is so that the slideshow content won't display unless javascript is enabled. */
	display: none;
	width:652px; 
}
div.loader {
	background-image: url('loader.gif');
	background-repeat: no-repeat;
	background-position: center;
	width: 652px;
	height: 347px
}
div.navigation {
	/* The navigation style is set by a javascript generated style on the page.
	   This is so that the javascript specific styles won't be applied unless javascript is enabled. */
}
ul.thumbs {
	clear: both;
	margin: 0;
	padding: 0;
	list-style: none;
}
ul.thumbs li {
	float: left;
	list-style: none;
}
a.thumb {
	display: block;
}
ul.thumbs li.selected a.thumb {
	background: #000;
}
a.thumb:focus {
	outline: none;
}
ul.thumbs img {
	border: none;
	display: block;
}
/* Minimal Gallery Styles */
#thumbs-min ul.thumbs li {
	float: none;
	padding: 0;
	margin: 0;
	list-style: none;
}

#thumbs-min a.thumb {
	padding: 0px;
	display: inline;
	border: none;
}

#thumbs-min ul.thumbs li.selected a.thumb {
	background: inherit;
	color: #000;
	font-weight: bold;
}

	.gallery_demo{width:536px;margin:0 auto;}
	.gallery_demo li{width:98px;height:54px;}
	
	#main_image{margin:0 auto 60px auto;height:438px;width:700px;background:black;}
	
	
	/**	
Notes:
	These next four rules are set by the Slideshow script.
	You can override any of them with the !important keyword but the slideshow probably will not work as intended.
*/

.slideshow {
	display: block;
	position: relative;
	z-index: 0;
}
.slideshow-images {
	display: block;
	overflow: hidden;
	position: relative;
}		
.slideshow-images img {
	display: block;
	position: absolute;
	z-index: 1;
}		
.slideshow-thumbnails {
	overflow: hidden;
}

/**
HTML:
	<div class="slideshow-images">
		<img />
		<img />
	</div>
	
Notes:
	The images div is where the slides are shown.
	Customize the visible / prev / next classes to effect the slideshow transitions: fading, wiping, etc.
*/

.slideshow-images {
	height: 300px;
	width: 400px;
}		
.slideshow-images-visible { 
	opacity: 1;
}	
.slideshow-images-prev { 
	opacity: 0; 
}
.slideshow-images-next { 
	opacity: 0; 
}
.slideshow-images img {
	float: left;
	left: 0;
	top: 0;
}	

/**
Notes:
	These are examples of user-defined styles.
	Customize these classes to your usage of Slideshow.
*/

.slideshow {
	height: 300px;
	margin: 0 auto;
	width: 652px;
}
.slideshow a img {
	border: 0;
}

/**
	
Notes:
	Customize the hidden / visible classes to affect the loader animation.
*/

.slideshow-loader {
	height: 28px;
	right: 0;
	position: absolute;
	top: 0;
	width: 28px;
	z-index: 10001;
}
.slideshow-loader-hidden {
	opacity: 0;
}
.slideshow-loader-visible {
	opacity: 1;
}

/**
	
Notes:
	Customize the active / inactive classes to affect the thumbnails animation.
	Use the !important keyword to override FX without affecting performance.
*/

.slideshow-thumbnails {
	bottom: -133px;
	margin:0 0 0 162px;
	height: 65px;
	left: 0;
	position: absolute;
	width: 515px;
}
.slideshow-thumbnails * {
	margin: 0;
	padding: 0;
}
.slideshow-thumbnails ul {
	height: 65px;
	left: 0;
	position: absolute;
	top: 0;
	width: 10000px;
}
.slideshow-thumbnails li {
	float: left;
	list-style: none;
	margin: 5px 5px 5px 0;
	position: relative;
}
.slideshow-thumbnails a {
	display: block;
	float: left;
	padding: 0;
	position: relative; 
}
.slideshow-thumbnails a:hover {
	background-color: #FF9 !important;
	opacity: 1 !important;
}
.slideshow-thumbnails img {
	display: block;
}
.slideshow-thumbnails-active {
	background-color: #9FF;
	opacity: 1;
}
.slideshow-thumbnails-inactive {
	background-color: #FFF;
	opacity: .5;
}
.dotdot {
color:#333300;
font-weight:normal;
font-size:10px;
display:inline;
}
.dotdot a {color:#333300;font-weight:normal;}
.dotdot a:hover {color:#333300;font-weight:normal;}