/* ---------------------------------------------------------------------------------------------------------------------------------------------------- */
/* GLOBALS */
* {margin:0; padding:0;} /* removes defaults from all elements */
a { text-decoration: none; }
a:focus {outline:0px;}
body {font:12px Arial, Helvetica, sans-serif; background: #7fb347 url(/images/BgBody.jpg) repeat-x;}
img {border:0;}
select { border: 1px solid #7fb347; }
.Left {float:left; margin:10px 10px 0 0;}
.Right {float:right; margin:10px 0 0 10px;}
.Clear {clear:both; height:0;}
.Center {position:relative; margin-left:auto; margin-right:auto;}

/* ---------------------------------------------------------------------------------------------------------------------------------------------------- */
/* BUTTONS */
.btnOrder {margin:10px;}

/* ---------------------------------------------------------------------------------------------------------------------------------------------------- */
/* HEADER STUFF */
#headerContainer {margin-left:auto; margin-right:auto; width:700px;}
#header {background: url(/images/BgHeader.gif) repeat-x; height:128px;}
#logo {position:relative; height:92px;}
#logo a {display:block; position:absolute; top:11px; left:15px; width:250px; height:70px; outline:none;}

/* ---------------------------------------------------------------------------------------------------------------------------------------------------- */
/* TOP LEVEL NAV */
#nav {height:35px; margin-left:15px; margin-bottom:0px; list-style:none;}
#nav li {float:left; margin-right:20px; height:35px; overflow:hidden;}
#nav li a, #nav li a:visited {float:left; display:block; line-height:35px; height:35px; padding:10px 10px 0px 10px; font: bold 12px Arial, Helvetica, sans-serif; color:#8cb662; overflow: hidden; background: url(/images/TabsBg.gif) center top no-repeat; outline:none; text-decoration:none;}
#nav li a:hover, #nav li a:active {background-position: 50% -35px; color:#fffff;}
#nav li a#NavActive, #nav li a#NavActive:hover {background-position:50% -70px;	color:#f0f0f0;}

/* ---------------------------------------------------------------------------------------------------------------------------------------------------- */
/* CONTENT CONTAINER */
#contentTop {margin-top:25px; margin-left:auto; margin-right:auto; width:700px; height:15px; background: transparent url(/images/BgContentTop.png) no-repeat top;}
#contentContainer {margin-left:auto; margin-right:auto; width:700px; background: #f5fde2;}
#contentBottom {margin-bottom:15px; margin-left:auto; margin-right:auto; width:700px; height:15px; background: transparent url(/images/BgContentBottom.png) no-repeat top;}
#content {padding-top:10px; margin:0px 271px 0px 16px; /* this left margin is so the content doesn't go under the sidebar */ min-height:350px;}
#content.nosideBar {margin-right:16px;} 
#content {padding-bottom:20px;}
#content h1 {margin:0; padding-bottom:5px; font-weigth:bold; font-size:24px; color:#555555;}
#content h2 {margin:0; padding-bottom:5px; font-weigth:bold; font-size:18px; color:#666666;}
#content h3 {margin: 13px 0 0 0; font-weigth:bold; font-size:12px; text-transform:uppercase; color:#555;}
#content h4 {margin: 0 0 -10px 0; font-weigth:bold; font-size:12px; color:#555;}
#content p, #content li {margin:10px 0; color: #777;}
#content ul { margin-left: 20px; }
#content a {color:#5f9214; font-weight:bold;}
/* FUCKS UP IMAGES ON HOVER #content a:hover {color:#333; text-decoration:underline; background:#ffc;}
#content a img:hover {background: none;}*/

/* ---------------------------------------------------------------------------------------------------------------------------------------------------- */
/* SIDEBAR */
#sideBar {float:right; margin:10px 16px 0 15px; width:241px; background:#f0f0f0 url(/images/BgSideBar.gif) center top repeat-y;}
#sideBar #sideBarTop {display:block; margin-bottom:-10px; height:10px; background: url(/images/BgSideBarTop.gif) center top no-repeat;}
#sideBar #sideBarBottom {display:block; margin-top:-10px; height:16px; background: url(/images/BgSideBarBottom.gif) center top no-repeat;}
#sideBar h2, #sideBar p, #sideBar li {margin:15px;}
#sideBar h2 {margin-bottom:-15px; font-size:18px; font-weight: bold; color: #555;}
#sideBar p {font-size:11px; line-height:14px; color: #777;}
#sideBar p.fineprint {font-size:10px; line-height:12px; color: #ccc;}
#sideBar ul, #sideBar ol {margin:25px 15px 15px 5px;}
#sideBar li ul, #sideBar li ol {margin: 0; font-size:9px;}
#sideBar li {color:#777; font-size:11px; line-height:16px;}
#sideBar ul li {margin:8px 10px; padding:0 15px; list-style: none; background: url(/images/IconArrow.gif) 0 4px no-repeat;}
#sideBar a {color:#5b7100; font-weight:bold;}
#sideBar a:hover {text-decoration: underline; color: #333;}
#sideBar .btnOrder {text-align:center;}
#sideBar .noStyle img {margin:10px 0;}
#sideBar .right img {position:relative; right:15px;}
#sideBar .left img {position:relative; left:15px;}

/* ---------------------------------------------------------------------------------------------------------------------------------------------------- */
/* BOX */
.BoxTop {width:545px; background: url(/images/BgBoxTop.gif) left top no-repeat; margin:10px 0 0 56px;}
.BoxTop .spacer {height:15px;}
.BoxBottom {height:10px; width:545px; background: url(/images/BgBoxBottom.png) left top no-repeat; margin:0 0 10px 56px;}

/* ---------------------------------------------------------------------------------------------------------------------------------------------------- */
/* HOSTING STUFF */
#HostingIcons {margin-left:118px;}
#HostingIconTransfer {float:left; height:86px; width:103px; margin:0px; background: url(/images/HostingIconTransfer.png) left top no-repeat;}
#HostingIconStorage {float:left; height:86px; width:103px; margin:0px; background: url(/images/HostingIconStorage.png) left top no-repeat;}
#HostingIconDb {float:left; height:86px; width:103px; margin:0px; background: url(/images/HostingIconDb.png) left top no-repeat;}

.PlansNoBox {margin: 15px 0 0 56px;}
#HostingTextTransfer {float:left; height:27px; width:103px; margin:0px; background: url(/images/HostingTextTransfer.png) left top no-repeat;}
#HostingTextStorage {float:left; height:27px; width:103px; margin:0px; background: url(/images/HostingTextStorage.png) left top no-repeat;}
#HostingTextDb {float:left; height:27px; width:103px; margin:0px; background: url(/images/HostingTextDb.png) left top no-repeat;}

#HostingPlanA {height:50px; width:515px; margin:0 0 0 15px; background: url(/images/HostingPlanA.gif) left top no-repeat;}
#HostingPlanB {height:50px; width:515px; margin:-1px 0 0 15px; background: url(/images/HostingPlanB.gif) left top no-repeat;}
#HostingPlanC {height:50px; width:515px; margin:-1px 0 0 15px; background: url(/images/HostingPlanC.gif) left top no-repeat;}
.planCol1 {float:left; width:103px; margin:18px 0 0 103px; font-size:12px; font-weight:bold; text-align:center; color:#666666;}
.planCol2 {float:left; width:103px; margin:18px 0 0 0; font-size:12px; font-weight:bold; text-align:center; color:#666666;}
.planCol3 {float:left; width:103px; margin:18px 0 0 0; font-size:12px; font-weight:bold; text-align:center; color:#666666;}
.BtnChoose {float:right; margin:8px 7px 0 0;}
#HostingInfoA, #HostingInfoB, #HostingInfoC {padding:16px;}

/* ---------------------------------------------------------------------------------------------------------------------------------------------------- */
/* DEVELOPMENT STUFF */
#ImageCarouselWrapper {margin:0; padding:0px;}
#ImageCarouselBtnPrevious {float:left; margin:117px 0 0 17px; padding:0; width:37px; height:35px;}
#ImageCarouselScreenBig {float:left; margin:15px 0 0 15px; padding:6px; width:412px; height:237px; background: url(/images/ImageCarouselBg.gif) left top no-repeat;}
#ImageCarouselBtnNext {float:left; margin:117px 0 0 0; padding:0; width:37px; height:35px;}
#ImageCarouselTitle {text-align:center; padding-bottom:10px;}

ul.ImageGallery {}
ul.ImageGallery li {display:inline; float:left; width:178px; height:100px; margin:20px; padding:0;}

/* ---------------------------------------------------------------------------------------------------------------------------------------------------- */
/* CONTENT TABLE */
.contentTable {width:98%; border-collapse:collapse; margin-top:10px; margin-bottom:10px; font-size:12px;}
.contentTable thead {color:#f0f0f0; background-color:#555555; margin:0px; padding:8px; text-align:left;}
.contentTable tr, .contentTable td, .contentTable th {margin:0px; padding:8px; text-align:left; border:1px solid #555555; border-collapse:collapse; }
.contentTable td.check {text-align:center;}

/* NEW Table Sorting Stuff */
.contentTable tr.rowodd {background-color: transparent;}
.contentTable tr.roweven {background-color: #f0f0f0;}
.contentTable .sortcol {cursor: pointer; padding-right:20px; background-repeat: no-repeat; background-position: right center;}
.contentTable .sortasc {background-color:#000000; background-image: url(/images/IconSortUp.gif);}
.contentTable .sortdesc {background-color:#000000; background-image: url(/images/IconSortDown.gif);}
.contentTable .nosort {cursor: default;}

/* ---------------------------------------------------------------------------------------------------------------------------------------------------- */
/* FORM ELEMENTS */
fieldset {margin:10px; padding:10px; border:1px solid #ccc;}
fieldset div {margin:0;	padding:5px; border-bottom:1px dotted #cfcfcf;}
fieldset div.last {border-bottom:0px}
legend {display:block; margin:10px; padding:5px; font-weight:bold; color:#999;}
label {display:block; float:left; clear:left; margin-right:5px; width:100px; color:#777; text-align:right;} 
input[type=button], input[type=submit] {cursor:pointer; margin-left:5px;}
input[type=text], input[type=password], textarea {color:#666666; padding:2px; border:1px solid #999999; margin-left:5px; font-family:Arial, Helvetica, sans-serif; font-size:12px;}
input[type=text]:focus, input[type=password]:focus, textarea:focus {background-color:#dde5f1; border:1px solid #000000; color:#000000; margin-left:5px;}
input[disabled] {cursor:default; margin-left:5px;}
select {padding:1px; color:#666666; cursor:pointer; margin-left:5px;}

/* ---------------------------------------------------------------------------------------------------------------------------------------------------- */
/* FOOTER */
#footerContainer {margin-left:auto; margin-right:auto; width:700px;}
#footer {background: url(/images/BgFooter.gif) repeat-x; padding:21px 10px 10px 10px;}
#footer p {margin:0 15px 0 15px; color:#8cb662;}
#footer a:link, #footer a:visited {text-decoration:none; color:#8cb662; outline:none; font-weight:bold;}
#footer a:hover, #footer a:active {text-decoration:underline; color:#8cb662;}


/* ---------------------------------------------------------------------------------------------------------------------------------------------------- */
/* TABBER STUFF */
#description { 		/* Overal Tab Div width */
float:left;
width:100%;
margin: 0px 0px 5px 0px; 
}

/* $Id: styles.css,v 1.1 2008-11-30 11:12:15 schiros Exp $ */

/*--------------------------------------------------
  REQUIRED to hide the non-active tab content.
  But do not hide them in the print stylesheet!
  --------------------------------------------------*/
.tabberlive .tabbertabhide {
 display:none;
}

/*--------------------------------------------------
  .tabber = before the tabber interface is set up
  .tabberlive = after the tabber interface is set up
  --------------------------------------------------*/
.tabber {
}
.tabberlive {
 margin-top:1em;
}

/*--------------------------------------------------
  ul.tabbernav = the tab navigation list
  li.tabberactive = the active tab
  --------------------------------------------------*/
ul.tabbernav /* line under tabs, space behind tabs */
{
 margin:0;
 padding: 3px 0;
 border-bottom: 1px solid #CCCCCC;
 font-size:20px;
 font-weight:bold; 
}

ul.tabbernav li /* space between tabs */
{
 list-style: none;
 margin: 0;
 padding:5px 5px 5px 0px;
 display: inline;
}

ul.tabbernav li a		/* Inactive Tabs */
{
 padding:5px;
 margin-left:0px;
 border: 1px solid #CCCCCC;
 border-bottom: none;
 background: #f0f0f0;
 text-decoration: none;
 font-size:18px;
 font-weight:bold;
}

ul.tabbernav li a:link { color: #CCCCCC; } /* Inactive Tab Text Color */
ul.tabbernav li.tabberactive a:link { color:#00539b; } /* Active Tab Text Color */

ul.tabbernav li a:hover /* When you rollover an inactive tab */
{
 color: #333333;
 background: #dde5f1;
 border-color: #CCCCCC;
}

ul.tabbernav li.tabberactive a /* The active tab */
{
 background-color: #ffffff;
 border-bottom: 1px solid #ffffff;
 border-top: 1px solid #CCCCCC;
 border-left: 1px solid #CCCCCC;
 border-right: 1px solid #CCCCCC;
 font-size:22px;
 font-weight:bold; 
}

ul.tabbernav li.tabberactive a:hover /* When you rollover the active tab */
{
 color: #333333;
 background: #ffffff;
 border-bottom: 1px solid #ffffff;
}

/*--------------------------------------------------
  .tabbertab = the tab content
  Add style only after the tabber interface is set up (.tabberlive)
  --------------------------------------------------*/
.tabberlive .tabbertab {  /* Content Area */
 padding:5px;
 border-top:1px solid #CCCCCC;
 border-left:1px solid #CCCCCC;
 border-right:1px solid #CCCCCC;
 border-bottom:1px solid #CCCCCC;
 border-top:0;
 background: #ffffff;

 /* If you don't want the tab size changing whenever a tab is changed
    you can set a fixed height */

 /* height:300px; */

 /* If you set a fix height set overflow to auto and you will get a
    scrollbar when necessary */

 overflow:auto;
}

/* If desired, hide the heading since a heading is provided by the tab */
.tabberlive .tabbertab h2 {
 /*display:none;*/
}
.tabberlive .tabbertab h3 {
 /*display:none;*/
}

/* Example of using an ID to set different styles for the tabs on the page */
.tabberlive#tab1 {
}
.tabberlive#tab2 {
}
.tabberlive#tab2 .tabbertab {
 height:200px;
 overflow:auto;
}

.italic {
	font-style: italic;
}

.bold {
	font-weight: bold;
}

.center {
	text-align: center;
}

a.tag1 {
	font-size: 10px;
	font-weight: bold;
}

a.tag2 {
	font-size: 14px;
	font-weight: bold;
}

a.tag3 {
	font-size: 18px;
	font-weight: bold;
}

a.tag4 {
	font-size: 22px;
	font-weight: bold;
}

.error {
	color: #f00;
}