/*
Stylesheet For: VSI V4
URL: http://www.vsi-thinking.com
Version: v1.0
Author: VSI-Thinking, http://www.vsi-thinking.com
*/

/* >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> */
/* CONTENTS

   A: Universal Elements
      1. Body & Html
      2. Hyperlinks
      3. General Divs
      4. Headings

   B: Structure
      1. Header & Navigation
      2. Content Wrapper
      3. Sidebar
      4. Main Body
	  5. Footer

	C: Modules
                                                               */
/* >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> */

/* *********************************************************** */
/* A. Universal Elements                                       */
/* *********************************************************** */

/* ----------------------------------------------------------- */
/* A1. Body & Html                                             */
/* ----------------------------------------------------------- */
body, html {
	background: #002638;
	margin: 0px;
	padding: 0px;
}

body, div, p, td {
	font-family: "lucida sans",arial;
	color: #FFFFFF;
	font-size: small;
}

/* ----------------------------------------------------------- */
/* A2. Hyperlinks                                              */
/* ----------------------------------------------------------- */

a img {
	border: 0px;
}
a {
	color: #9FC6D7;
}
a:hover {
	color: #1B1463;
	text-decoration: underline;
}
div#main div.content div.large a.button {
	background: #FFFFFF;
	padding: 3px;
	border: #002638 1px solid;
	text-decoration: none;
	color: #002638;
    -moz-border-radius-bottomleft:3px;
    -moz-border-radius-bottomright:3px;
    -moz-border-radius-topleft:3px;
    -moz-border-radius-topright:3px;
}
div#main div.content div.large a.button:hover {
	background: #208AB1;
	color: #FFFFFF;
}


/* ----------------------------------------------------------- */
/* A3. General Divs                                            */
/* ----------------------------------------------------------- */
div.clearfix {
	clear: both;
}
div.content {
	width: 974px;
	padding-left: 10px;
	padding-right: 10px;
	margin: auto auto;
}
div.large {
	width: 714px;
	float: left;
}
div.small {
	width: 260px;
	float: right;
}
div.hr {	
	border-top: #C3C3C3 1px solid;
	margin-top: 5px;
	margin-bottom: 5px;
}
div.hr hr {
	display: none;
}
img.alignRight, img.alignLeft {
	padding: 5px;
	border: 1px solid #0A3342;
	background: #034C65;
}
img.alignRight {
	float: right;
	margin-left: 5px;
	margin-bottom: 5px;
}
img.alignLeft {
	float: left;
	margin-right: 5px;
	margin-bottom: 5px;
}
/* ----------------------------------------------------------- */
/* A4. Headings                                                */
/* ----------------------------------------------------------- */
h1 {
	color: #FFFFFF;
	font-weight: bold;
	font-size: x-large;
	margin: 0px;
	padding: 0px;
}
h1.home {
	background: transparent url(../../pics/bg-h1welcome.gif) no-repeat top left;
	text-indent: -9000px;
	height: 70px;
}
h2 {
	color: #89C4DF;
	font-size: large;
}
h2.home {
	font-size: x-large;
	padding-left: 15px;
	margin-top: 0px;
	padding-top: 0px;
}
h3 {
	font-size: medium;
	color: #FFFFFF;
	border-bottom: #6DABC5 1px solid;
	padding-bottom: 5px;
}


/* *********************************************************** */
/* B. Structure                                                */
/* *********************************************************** */

/* ----------------------------------------------------------- */
/* B1. Header & Navigation                                     */
/* ----------------------------------------------------------- */
div#head {
	background: #0C6383 url(../../pics/bg-masthead.jpg) repeat-x;
	min-height: 217px;
}
div#head .content {
    background: transparent url(../../pics/bg-vsi.jpg) no-repeat top left;
	min-height: 217px;
}


div#head div#menu {
    min-height: 60px;
}
div#head div#menu ul {
	margin: 0px;
    margin-top: 15px;
	padding: 0px;
	padding-top: 15px;
	list-style: none;
	float: right;
}
div#head div#menu ul li {
	float: left;
}
div#head div#menu ul li a {
	font-size: medium;
	font-weight: bold;
	padding: 10px;
	color: #FFFFFF;
	text-decoration: none;
}
div#head div#menu ul li a:hover {
	color: #002638;
	text-decoration: none;
}


div#head div#banner {
	min-height: 157px;
}
div#head div#banner div#logo {
    width: 240px;
    padding-top: 65px;
    float: left;
}
div#head div#banner div#mainPromo {
	width: 715px;
	padding-top: 50px;
	float: right;
	height: 100px;
/*	top: 110px !important;
	top: 95px;
	left: 400px;
	width: 715px;
	
	padding-bottom: 5px;
	position: absolute;*/

}
div#head div#banner div#mainPromo div#bannerPromo a {
	display: none;
}
div#head div#banner div#mainPromo div#bannerPromo a#bannerPromoMain {
	display: block;
}


/* ----------------------------------------------------------- */
/* B2. Content Wrapper                                         */
/* ----------------------------------------------------------- */
div#main {
	background: #4592B0 url(../../pics/bg-body.jpg) repeat-x top left;
	min-height: 300px;
	height: auto !important;
	height: 300px;
	padding-bottom: 10px;
}
div#main div.content {
    background: transparent url(../../pics/bg-content.jpg) no-repeat top left;
	padding-top: 10px;
	height: auto !important;
	height: 350px;
	min-height: 350px;
}
div#main.home div.content {
	padding-top: 20px;
}
div#main div#pageTools {
	text-align: right;
}

/* ----------------------------------------------------------- */
/* B3. Side Bar                                                */
/* ----------------------------------------------------------- */
div#main div.small h2.standard {
	font-size: 150%;
	color: #FFFCAC;
	margin: 0px;
	padding: 5px;
	margin-left: 5px;
}

div#main ul.sectionmenu {
	margin: 0px;
	padding: 0px;
	list-style: none;
}
div#main ul.sectionmenu li {
	padding: 0px;
	margin: 0px;
	padding-left: 5px;
	height: auto !important;
	height: 15px;
}
div#main ul.sectionmenu li a {
	padding: 5px;
	padding-left: 15px;
	display: block;
	margin: 0px;
	color: #FFFFFF;
	text-decoration: none;
	border-bottom: #6DABC5 1px solid;

}
div#main ul.sectionmenu li a:hover {
	background: #0A3342;
}


/* ----------------------------------------------------------- */
/* B4. Main Body                                               */
/* ----------------------------------------------------------- */


/* ----------------------------------------------------------- */
/* B5. Footer                                                  */
/* ----------------------------------------------------------- */
div#footer {
	background: transparent url(../../pics/bg-footer.gif) repeat-x top left;
	padding-top: 5px;
    padding-bottom: 10px;
}
div#footer div.content {
	font-size: x-small;
}
div#footer div.content span {
	color: #4EA5CD;
}
div#footer div.content div.w3c {
	width: 200px;
	float: right;
	text-align: right;
}


/* *********************************************************** */
/* C. Modules                                                  */
/* *********************************************************** */

div#vsiContact input, textarea, select {
    background-color:#FFFFFF;
    border-color:#B5B5B5;
    border-width: 1px;
    border-style: solid;
    padding: 2px;	
    -moz-border-radius-bottomleft:3px;
    -moz-border-radius-bottomright:3px;
    -moz-border-radius-topleft:3px;
    -moz-border-radius-topright:3px;
}
div#vsiContact table td {
	vertical-align: top;
	padding: 5px;
	padding-right: 10px;
}


/* ----------------------------------------------------------- */
/* C2. Slider                                                  */
/* ----------------------------------------------------------- */
#slider {
  margin: 0 auto;
  position: relative;
  background: transparent;
}
.scroll {
  height: 310px;
  width: 714px;
  overflow: auto;
  position: relative; /* fix for IE to respect overflow */
  clear: left;
 
}
.scrollContainer div.panel {
  padding-bottom: 20px;
  padding-left: 0px;
  padding-right: 150px;
  height: 270px;
  width: 564px; /* change to 560px if not using JS to remove rh.scroll */
}
.scrollContainer div#welcome.panel {
	background: transparent url(../../pics/bg-inset.jpg) no-repeat bottom right;
}
.scrollContainer div#phuse.panel {
	background: transparent url(../../pics/promos/inset-phuse.jpg) no-repeat bottom right;
}
.scrollContainer div#pmpl.panel {
	background: transparent url(../../pics/promos/inset-pmpl.jpg) no-repeat bottom right;
}
.scrollContainer div#thinkingBlog.panel {
	background: transparent url(../../pics/promos/inset-thinkingBlog.jpg) no-repeat bottom right;
}
.scrollButtons {
  position: absolute;
  top: 20px;
  right: 20px;
  cursor: pointer;
}
.scrollButtons.left {
	padding-right: 25px;
}

/* ----------------------------------------------------------- */
/* C3. Home                                                    */
/* ----------------------------------------------------------- */

div.homeCol1,
div.homeCol2,
div.homeCol3 {
	width:226px;
	float:left;
	margin-right:8px;
}
div#testimonial {
	padding:8px;
	margin:0px 0px 8px 0px;
}

div.small div#testimonial {
	margin:0px 0px 0px 5px;
}

div#testimonial h3 {
	color:#89C4DF;
	margin:0px;
	padding:0px;
	margin-bottom:8px;
	border:none;
	font-size:large;
}
div#testimonial p {
	font-style:italic;
	font-size:medium;
	margin:0px;
	padding:0px;
	margin-bottom:8px;
	color:#FFFF99;
}
div#testimonial p.author {
	font-style:none;
	font-weight:bold;
	margin:0px;
	padding:0px;
}

/* ----------------------------------------------------------- */
/* C3. Promo Boxes                                             */
/* ----------------------------------------------------------- */
div.promoboxes {
	margin: 0px 0px 4px 0px;
}
div.promoBox {
	float: left; 
	width:220px; 
	height: 66px; 
	background: transparent url(../../pics/promos/1.gif) no-repeat top left; 
	font-size: 110%; 
	font-weight: bold; 
	padding-top: 100px; 
	padding-left: 5px; 
	padding-right: 5px;
	margin-bottom: 10px;
 }
div.promoBox a {
	display: block; 
	margin-top: 10px; 
	color: #46A1CB; 
	text-decoration: none; 
	font-size: small; 
	font-weight: normal;
}
div.promoBox a:hover {
}
div.promoBox2 {
	background: transparent url(../../pics/promos/2.gif) no-repeat top left; 
	margin-left: 13px;
}
div.promoBox3 {
	background: transparent url(../../pics/promos/3.gif) no-repeat top left; 
	float: right;
}

/* ----------------------------------------------------------- */
/* C3. Home News                                               */
/* ----------------------------------------------------------- */
div.small div#vsiSmallBlog {
	padding-left: 15px;
	padding-right: 10px;
	padding-bottom: 10px;
	background: transparent url(../../pics/bg-news.gif) no-repeat bottom right;
}
div.small h2.home {
	color: #FFFCAC;
}
div.small div#vsiSmallBlog h3 {
	color:#005673;
	font-size:small;
	border: 0px;
	padding: 0px;
	margin: 0px;
}
div.small div#vsiSmallBlog a {
	color:#005673;
}
div.small div#vsiSmallBlog p {
	font-size: 90%;
	padding-bottom: 10px;
	border-bottom: #337290 1px dashed;
}
div.small div#vsiSmallBlog div.more {
	text-align: right
}

/* ----------------------------------------------------------- */
/* C4. Lightbox                                                */
/* ----------------------------------------------------------- */
ul.lightbox {
	margin: 0px;
	padding: 0px;
	list-style: none;
}
ul.lightbox li {
	float: left;
	margin-right: 5px;
}
ul.lightbox li img {
	border: #0A3342 1px solid;
	background: #034C65;
	padding: 5px;
}
ul.lightbox li a:hover img {
	border-color: #208AB1;
}

/* ----------------------------------------------------------- */
/* C4. Satisfied Page                                          */
/* ----------------------------------------------------------- */
#bigBoxPanel,#box { width:204px; }

#box.box1,
#box.box2 { margin:0 26px 0 0; }

#bigBoxPanel {
	float:right;
	padding:0 8px 0 8px;
	background: url(../../pics/satPriceBg.jpg) no-repeat top center;
}
#bigBoxPanel #bigBox p {
	margin:12px 0 0 0;
	padding:0;
}
#bigBoxPanel #bigBox p .prodName { font-size:140%; font-weight:bold; }
#bigBoxPanel #bigBox p .prodPrice { font-size:400%; }
#bigBoxPanel #bigBox p .prodMonthly { font-size:110%; }

#box { float:left; padding:8px; }

#box.box1 {	background: url(../../pics/box1Bg.jpg) no-repeat top center; }
#box.box2 {	background: url(../../pics/box2Bg.jpg) no-repeat top center; }
#box.box3 {	background: url(../../pics/box3Bg.jpg) no-repeat top center; }

#box.box1 h3,
#box.box2 h3,
#box.box3 h3 {
	margin:128px 0 0 0 ;
	padding:0;
	color:#1b1463;
}
#box.box1 p,
#box.box2 p,
#box.box3 p {
	margin:0;
	padding:0;
	color:#1b1463;
}
.boxLinks a {
	color:#FFFF99;
}

.boxLinks .arrow {
	font-size:170%;
	font-weight:bold;
	vertical-align:middle;
}

