/*************************************************************************
    1. Base Document Compartments   
*************************************************************************/  
div.outerpage {
/*  position: absolute; top: 0px; */
    text-align: center;
    width: 820px;
    background-color: #FFFFFF;
    border: 1px solid #2D5175;
    padding: 10px 10px 10px 10px; 
}

table.page {
    width: 800px;
    vertical-align: top;
}

table.page tr.header {
    text-align: center;
}

table.page td.content {
    width: 627px;
    vertical-align: top;
    padding-right: 20px;
}

table.page td.contentfull {
    width: 800px;
    vertical-align: top;
    margin-right: 20px;
}

table.page td.contenthalf {
    width: 400px;
    vertical-align: top;
}

table.page td.tools {
    width: 156px;
    vertical-align: top;
    padding-top: 18px;
}

/*
    Used for Style 1 - Even split of content 
    i.e. main index page (50% shared / 50% managed)
*/
div.leftfull {
    width: 398px;
}

div.rightfull {
    width: 398px;
}

div.leftside {
    width: 392px;
    margin-right: 4px;
    margin-bottom: 20px;
    float: left;
}

div.rightside {
    width: 392px;
    margin-bottom: 20px;
    float: right;
}

/*************************************************************************
    2. Base Elements 
*************************************************************************/
BODY { font-family : Verdana, sans-serif;  font-size: 11px; line-height: 13px; background-color: #ffffff; color: #555753; }
P, .P, OL, TD, BLOCKQUOTE, TD  { font-family: Verdana, sans-serif;  font-size: 11px;  line-height: 13px; } 
a:link, a:visited { color: #ffffff;  text-decoration: none;}
a:hover { color: #ff9900; }
acronym {
    border-bottom: 1px dotted #333;
    cursor: help; 
}
acronym.white {
    border-bottom: 1px dotted #FFFFFF;
}

table {
    font: 8pt/16pt verdana; 
    color: #000000;  
    margin: 0px; 
}

ul.list li {
	background:transparent url(bullet_circle.gif) 0 5px no-repeat;
	padding-left:14px;
	line-height:1.5;
	margin-bottom:4px;
}


/*************************************************************************
    3. Fonts
*************************************************************************/
/* Used for small text such as footnotes */
div.tiny {
    font-size: 9px;
    color: #FF6600;
}

/* Used to position text on the right side of the containing element.  Used for creating links such as Learn More!. */
div.rightlink {
    text-align: right;
}

span.sup {
    line-height: 18px;
    vertical-align: super;
    font-size: 80%;
}
/*************************************************************************
    4. Content Divs 
*************************************************************************/
/* Title displayed for the page in the content section immediately below the header */
div.page_title {
    font-size: 16pt; 
    margin-bottom: 20px; 
    padding-top: 10px;
}

/* Outer div that contains a title and a description (or expando).  This provides the border around the section */
div.overview {
    /*  border: 1px solid #335D85; */
    /* border: 1px solid #006699; */
    margin-bottom: 20px;
}

/* Container divs used to stack content horizontally.  Uses 1/3 of the content area. */
div.overview_left_33 {
    float: left;
    border: 1px solid #000000;
    width: 30%;
    padding: 2px;
    margin: 5px;
}

/* Container divs used to stack content horizontally.  Uses 1/2 of the content area. */
div.overview_left_50 {
    float: left;
    width: 47%;
    padding: 2px;
    margin: 5px;
}

/* Used to specify the section title.  Contains the background color and appropriate font color to display. */
div.title {
    border-top: 1px solid #006699;
    background-color: #DEE7EE;
    font-weight: bold;
    color: #000000;
    padding: 4px 4px 4px 5px;
    font-size: 12px;
    margin-bottom: 4px;
}

div.sub_title {
    background-color: #F9F9F9;
    padding: 4px 4px 4px 5px;
    font-size: 12px;
    margin-bottom: 4px;
}

/* Base container used to for the content within an overview section. */
div.description {
    padding: 5px 5px 5px 5px;
    float: none;
}

/* Base container used to for the content within an overview section. */
div.description_full {
    padding: 5px 5px 5px 5px;
    float: none;
}

/* Element required when using floats or expandos or other elements that do not maintain the spacing of the outer divs. */
div.spacer {
    clear: both;
}

div.internal_nav {
    border: 1px solid #006699;  
    margin-bottom: 20px;
    padding: 2px;
}

/* Technique to change the "::" to an image in the content section title under the header. */
span.header_designation {
  display:block;
  float:left;
  width:12px;
  height:12px;
  margin-right:4px;
  background-repeat:no-repeat;
  margin-top:3px;   
  vertical-align: middle;
}
span.header_designation span { display:none; }

div.bigintro {
    font-size: 14px;
    line-height: 16px;
    height: 100px;  
}

div.montage {
    margin: 10px 0px 10px 0px;
    padding-top: 10px;
    border: 1px solid #CCCCCC;
    text-align: center;
}

div.montage div.promo {
    background-color: #CCCCCC;
    padding: 10px 10px 10px 10px;
    font-size: 20px;
    color: #ffffff;
    text-align: left;
}

div.montage ul {
    padding-bottom: 20px;
}

div.montage li {
    margin-left: 40px;
    text-align: left;
    font-size: 20px;
    line-height: 24px;
    color: #CCCCCC;
}

div.montage span.price {
    color: #ff6600; 
    font-size: 24px;
}

/*************************************************************************
    5. Tool Divs 
*************************************************************************/
/* top div in the style sheet used to force the tools to line up with the content */
div.content_spacer {
    height: 45px;
}

/* Outer containing div that defines the entity as a tool. */
div.tool {
    width: 156px;
    border: 1px solid #295175;
    margin-bottom: 10px;
}

/* Outer containing div that defines the entity as a tool, but does not have an outer border. */
div.tool_noborder {
    width: 156px;
    margin-bottom: 5px; 
}

/* Inner div that defines the title for the tool.  Sets the appropriate background, font, and border. */
div.tool_title {
    /* background-color: #5B86A6; */
    background-color: #497494;
    color: #FFFFFF;
    /* font-weight: bold; */
    font-size: 8pt;
    padding-left: 5px;
    border-bottom: 1px solid #295175;
}

/* Inner div that contains the content for the tool. */
div.tool_description {
    padding: 2px 2px 2px 2px;
}

div.tool_promo {
    padding-top: 4px;
    padding-bottom: 4px;
    border-bottom: 1px solid #CCCCCC;
}

/* Inner div that contains the content for the tool, specifically for containing advertisements. */
div.tool_description_ad {
    padding: 0px;
    text-align: center;
    vertical-align: middle;
}

div.tool div.hairline {
    padding-bottom: 2px;
    border-bottom: 1px solid #CCCCCC;
}

div.tool span.small {
    font-size: 75%;
}

/* Used for the Data Sheets Tools */
span.key {

}
span.value {
    padding-right: 2px;
}

/* Used for Shared Options Tools */
div.optleft {
    background-color: #F5F5F5;
    border-top: 1px solid #000000;
}
div.optright {
    text-align: right;
}

/*************************************************************************
    6. List elements for creating additional navigation.  
    i.e. Enhanced Services navigation on the various ES pages like Metrics
*************************************************************************/
li.inline {
  display: inline;
  padding-left: 6px;
  padding-right: 3px;
  border-right: 1px solid #006699;
}

li.last {
  display: inline;
  padding-left: 6px;
  padding-right: 3px;
  border-right: 0px;
}

/*************************************************************************
    7. Comparison Charts 
*************************************************************************/
/* Outer containing table. */
table.comparison_chart {
    font: 8pt/16pt georgia; 
    color: #555753;  
    margin: 0px; 
    vertical-align: top;
    width: 98%;
}

/* Table cell header, usually reserved for the left-hand column of the table. */
table.comparison_chart td.header {
    vertical-align: top;
    background-color: #F5F5F5;
    text-align: left;
    width: 200px;   
}

table.comparison_chart td.header_blue {
    vertical-align: top;
    background-color: #DEE7EE;
    text-align: left;
    width: 200px;   
}

/* Table row header, usually reserved for the top row of the table. */
table.comparison_chart tr.header {
    vertical-align: top;
    background-color: #F5F5F5;  
}

/* Defines the basic behaviour of all cells within a comparison table. */
table.comparison_chart td {
    border: 1px solid #CCCCCC;
    text-align: center;
    width: 75px;
}

/* Modifies the basic behaviour of the a comparison table cell to center alignment. */
table.comparison_chart td.left {
    text-align: left;
}

table.comparison_chart td.right {
    text-align: right;
}

table.dedicated_compare {
    vertical-align: top;
    text-align: left;
    margin-top: 10px;
    width: 100%;
    background-color: #FFFFFF;
}

table.dedicated_compare tr {
    vertical-align: top;
}

table.dedicated_compare td.header {
    background-color: #F5F5F5;  
}

table.dedicated_compare td.header_h {
    background-color: #FBF7E5;  
}

table.dedicated_compare td.center {
    text-align: center;
}

table.dedicated_compare td {
    border: 1ps solid #CCCCCC;
    background-color: #FFFFFF;
}

div.dedicated_detail {
    padding: 10px;
}

table.advanced_compare {
    margin-top: 5px;
    width: 605px;
        border-collapse: collapse;
        border-spacing: 0;
}
table.advanced_compare td {
        border-bottom: 1px solid #CCCCCC;
    text-align: center;
}
table.advanced_compare td.header {
        text-align: left;
        width: 140px;
        color: #FFFFFF;
        font-weight: normal;
        font-size: 85%;
        background-color: #999999;
        padding: 2px;
        border-bottom: 1px solid #777777;
}
table.advanced_compare td.header2 {
        color: #FFFFFF;
        font-weight: bold;
        background-color: #FF6600;
        border-bottom: 1px solid #999999;
        vertical-align: top;
}
table.advanced_compare td.header3 {
    color: #FF6600;
    font-weight: bold;
    background-color: #FBF7E5;
    text-align: center;
    vertical-align: top;
    border-bottom: 1px solid #FF6600;
}

span.nonbold {
    font-weight: normal;    
}
.progdesc 	{  font-family: "Arial", "Helvetica", "sans-serif"; font-size: 10pt; font-style: normal; font-weight: normal; color: #FFFFFF; }

div.orangebox {
    border: 1px solid #FF6600; 
    padding: 5px; 
    margin-bottom: 5px;
}
/*************************************************************************
    8. FAQ
*************************************************************************/
/* Outer div that contains a question and answer. */
div.faq {
    /* border: 1px solid #CCCCCC; */
    border-bottom: 1px dotted #CCCCCC;
    margin-bottom: 5px; 
    padding-bottom: 5px;
}

/* FAQ question */
div.question {
    font-weight: bold;
    text-decoration: none;
}

/* FAQ answer */
div.answer {
    padding-left: 5px;
    padding-right: 5px;
} 

/*************************************************************************
    9. ToolTips (from http://www.dyn-web.com/)
*************************************************************************/      
/* Style spec's for tooltip  */
div#tipDiv {
  position:absolute; visibility:hidden; left:0; top:0; z-index:10000;
  background-color:#FBF6E3; border:1px solid #336; 
  width:400px; padding:6px;
  color:#000; font-size:11px; line-height:1.3;
}

/*
    Used to stack content horizontally and provide a border around an
    image enclosed in the div.
    i.e. data center hosting pages for the pictures of the racks
*/ 
div.leftcontent {
    margin-top: 10px;
    width: 220px;
    text-align: center;
    float: left;
}
div.leftcontent img {
    border: 1px solid #000000;
}

/*************************************************************************
    10. Replacement Divs
*************************************************************************/

#divLinks   {
    position: relative; 
    visibility: hidden;
    text-align: center;
}
#divMessage {
    position: relative; 
    width: 550px; 
    visibility: hidden;
}

/*************************************************************************
    11. Expandos 
*************************************************************************/
div.switchcontent {
    padding: 5px 5px 5px 5px;
}

div.contentenclosure {
    border: thin solid #99CC00;
}

div.content {
    margin-bottom: 20px;
    padding-right: 5px;
}

div.contentelemen {
    background-color: #99CC00;
}

/* Technique to change the "+" to the image in the expando bars */
span.expando {
  display:block;
  float:left;
  width:16px;
  height:16px;
  margin-right:2px;
  background-repeat:no-repeat;
  margin-top:0px;
  }
span.expando span {display:none;}

span.expando3 {
  display:block;
  float:left;
  width:16px;
  height:16px;
  margin-right:2px;
  background-repeat:no-repeat;
  margin-top:0px;
  }
span.expando3 span {display:none;}
/*************************************************************************
    12. Page Specific Elements
*************************************************************************/ 

div.data_center_features {
        display: none;
        padding: 10px 0px 10px 0px; 
}

/** Enhanced Services mini section.  Used to display the overview section when the title is clicked on. **/ 
div.services_mini {
    display: none;
    padding: 2px;
    border-left: 1px solid #CCCCCC; 
    border-right: 1px solid #CCCCCC;    
    border-bottom: 1px solid #CCCCCC;   
}

/** Product Configurator **/
table.wh_conf {
    margin: 0px; 
    vertical-align: top;
    width: 100%;
}

table.wh_conf td {
    border: 1px solid #CCCCCC;  
}

tr.wh_conf_right {
    text-align: right;
}

.wh_conf_gray {
    background-color: #ffffff;
}

.wh_conf_price {
    color: #000000;
}

/* NAVIGATION
******************************************/
ul#subnav {
	width:100%;
	clear:left;
	border-top:1px solid #444;
	margin:0;
	padding:0;
}
ul#subnav li {
	float:left;
	margin:0 8px 0 0;
	padding:6px 0;
}
ul#subnav li a {
	color:#999;
	text-decoration:none;
	margin:0;
	padding:8px 0 5px 0;
}
ul#subnav li.br {
	color:#444;
	font-weight:normal;
}
ul#nav {
	width:100%;
	margin:0;
	padding:0;
	display:block;
	border-top:1px solid #444;
	position:relative;
	z-index:4;
}
ul#nav li {
	font-size:1em;
	float:left;
	margin:0 16px 0 0;
	padding:0;
}


ul#nav li a {
	color:#ccc;
	text-decoration:none;
	display:block;
	margin:0;
	padding:0px 0 0px 0;
	border-bottom:1px solid #292929;
}
ul#nav li a:link, ul#subnav li a:link {color:#999;}
ul#nav li a:visited, ul#subnav li a:link {color:#999;}
ul#nav li a:hover, ul#nav li a:active {
	color:#fff;
	border-bottom:1px solid #ff9900;
}
ul#subnav li a:hover, ul#subnav li a:active {color:#fff;}

ul#nav li#nav-login {float:right;margin-right:0;}

.title2 {
	font-family: Verdana, sans-serif, Arial;
	font-weight: normal;
	font-size: 10px;
	border-bottom-width: 1px;
	border-left-width: 3px;
	border-bottom-style: solid;
	border-left-style: solid;
	border-bottom-color: #ff9900;
	border-left-color: #ff9900;
	line-height: 15px;
	padding-left: 5px;
	letter-spacing: .1em;
}

.button {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	#color: #000000;
	#background-color: #FFFFFF;
	border: 1px solid #669999;
	
}