/* WAM!NET Corporate styles */
/* Ident: $Id: wamnet.css 35754 2006-03-24 15:32:31Z rabrahamson $ */

/* DO NOT CHANGE THIS STYLE SHEET...it is used across multiple service user interfaces! */
/* Please add service specific styles to a separate style sheet */

/* main body styles */
html { margin: 0; padding: 0; }
body { min-width: 780px; margin: 0; padding: 0; font-family: Arial, Helvetica, sans-serif; font-size: 100%; background-color: #fff; color: #333; /*color updated by preferred/alternate sheet*/ }

h1,h2,h3,h4 { margin-top: .5em; margin-bottom: .5em; padding: 0; font-family: Verdana, Arial, Helvetica, sans-serif; }
h1 { font-size: 110%; }
h2 { font-size: 90%; }
h3 { font-size: 80%; }
h4 { font-size: 70%; }

img { border: 0; }
p { margin-top: 1em; margin-bottom: 1em; }

ul { margin: .5em; margin-bottom: 1em; padding-left: 0; list-style-position: inside; list-style-type: square; }
ul.border { margin-top: 0; margin-bottom: 0; }
ol { margin: .5em; padding-left: .5em; }
ol.border { margin-top: 0; margin-bottom: 0; }
li { font-family: Arial, Helvetica, sans-serif; margin: .5em; padding: 0; font-size: 100%; }
li li { font-size: 100%; /* don't let nested lists shrink text */}

acronym:hover, abbr:hover { cursor: help }
abbr[title], acronym[title] { border-bottom: thin dotted; cursor: help; font-style: normal; }

/* alignment classes */
.top { vertical-align: top !important; }
.middle { vertical-align: middle !important; }
.bottom { vertical-align: bottom !important; }
.right { text-align: right !important; }
.left { text-align: left !important; }
.center { text-align: center !important; }

/* text classes */
.text { font-size: 80%; }
.error { color: #c33 !important; }
.jtkError, .validationError { border-left: 2px solid #c33; padding-left: 2px; } /* use this for missing required form fields */
.confirm { color: #3c3 !important; }
.small { font-size: 70%; }
.bold, .error, .confirm { font-weight: bold; }
.tips { display: table-cell ; padding-left: 2em; font-size: 87%; vertical-align: top !important; }
.text .sup, .small .sup, h3 .sup { font-size: 75%; vertical-align: text-top; line-height: 90%; }
h2 .sup { font-size: 70%; vertical-align: text-top; line-height: 110%; }

/* border classes */
.border { border-bottom: 1px dotted #ccc; padding-bottom: .5em; padding-top: .5em; }
.noBorder { border-width: 0px !important;  border-style: none !important; }

/* positioniing classes */
.content { padding: 0 .5em; }
.indent { margin-left: 1em !important; }
.topSpace { margin-top: 1em !important; margin-bottom: 0 !important; }
h2.topSpace { margin-top: .5em !important; margin-bottom: 0 !important; }
.bottomSpace { margin-top: 0 !important; margin-bottom: 1em !important;}
.noSpace { margin-top: 0 !important; margin-bottom: 0 !important; }
.spacer { padding-top: 1.5em !important; }
.nowrap { white-space: nowrap; }
.noPad { padding-top: 0 !important; padding-bottom: 0 !important; }
div.fullWidth { margin-bottom: 0 !important; padding-bottom: 0 !important; }

/* width classes */
.fullWidth { width: 100%; }
.stdWidth { width: 90% !important; }
.halfWidth { width: 50% !important; }
.autoWidth { width: auto !important; }

/* special classes */
.complianceLogo { width: 88px; height: 31px; }
.sortIcon { height: 13px; width: 13px; margin-top: -2px; }
.tipsCol { width: 30%; padding-right: 1em;}
#tipsOff, #tipsOn { background-repeat: no-repeat; background-position: left center; padding-left: 1.2em; }
#tipsOn { background-image: url(../images/expand.gif); }
#tipsOff { background-image: url(../images/expanded.gif); }
.icons { white-space: nowrap; text-align: center; }
.icons img, #select img, .check img { padding: 3px; }
.icons img { height: 25px; width: 25px; }
.check { text-align: center; }
.noBullet { list-style-type: none; list-style-position: outside; }

/* special styles */
th#select { white-space: nowrap; }

/* table styles */
table { margin: 0; padding: 0; }
caption { font-size: 87%; margin-left: auto; margin-right: auto; caption-side: top; padding-bottom: .4em; text-align: center; }
th, td { padding-left: .25em; padding-right: .25em; }
th.column { vertical-align: middle; text-align: center; }
th.row { vertical-align: middle; text-align: center; }
table.text .small { font-size: 87%; } /* making the text about 70% - the same as the small class - (.8 x .87) */
table.text h3 { white-space: nowrap; border-bottom: 2px solid #000; padding-bottom: .3em; padding-left: 0; }

/* take care with centering tables with CSS: use a div with class center that contains a table with class center */
.center table { margin-left: auto; margin-right: auto; text-align: left; }

/* table head gradients - background colors inherited from bgX class in navigation.css */
th.column.bg1, th.column.bg2, th.column.bg3, th.column.bg4, th.column.bg5, th.column.bg6, th.column.bgH { background-position: left top; background-repeat: repeat-x; color: #fff; }
th.column.bg1 { background-image: url(../images/col_head_bg1.gif); }
th.column.bg2 { background-image: url(../images/col_head_bg2.gif); }
th.column.bg3 { background-image: url(../images/col_head_bg3.gif); }
th.column.bg4 { background-image: url(../images/col_head_bg4.gif); }
th.column.bg5 { background-image: url(../images/col_head_bg5.gif); }
th.column.bg6 { background-image: url(../images/col_head_bg6.gif); }
th.column.bgH { background-image: url(../images/col_head_bgH.gif); }
th.column.bg1 a, th.column.bg2 a, th.column.bg3 a, th.column.bg4 a, th.column.bg5 a, th.column.bg6 a, th.column.bgH a { color: #fff; }
th.column.bg1 a:hover, th.column.bg2 a:hover, th.column.bg3 a:hover, th.column.bg4 a:hover, th.column.bg5 a:hover, th.column.bg6 a:hover, th.column.bgH a:hover { color: #333; }

/* data table styles */
table.data { color: #000; border-left: 1px solid #999; text-align: center; width: 100%; border-top: 1px none #999; /* allows custom css to add top border easily*/}
table.data caption { margin-left: 0; text-align: left; }
table.data th, table.data td { border-right: 1px solid #999; border-bottom: 1px none #999; /* allows custom css to add bottom border on th easily*/ text-align: center; font-size: 90%; }
table.data th td, table.data th th, table.data td th,table.data td td { font-size: 100%; /* don't let nested tables shrink text */}
table.data td, table.data th.row { background-color: transparent; /*background updated by preferred/alternate sheet*/ border-bottom: 1px solid #999; padding: .5em; }
table.data tr.even td, table.data tr.even th.row { background-color: #e8e8e8; /* background updated by preferred/alternate sheet*/ }

/* table paging */
.pagedTable { position: relative; width: 100%; /* need to explicitly set the width to get IE Win to position correctly */}
.pagedLinks { font-size: 70%; position: absolute; top: 0; right: 15px; margin-right: -15px; padding-right: .5em; text-align: right; white-space: nowrap; } /* 15px and -15px combination stops IE Mac showing unnecessary horizontal scroll bar */

/* nested data tables styles */
td.fText table.data { width: auto; }
td.fText table.data th { padding-left: 1em; padding-right: 1em; }
td.fText table.fInput { margin-left: -.2em !important; }
td.fText table.fInput td { padding-left: 0; }

/* data table footer styles (e.g. buttons) */
td.tableFooter {  width: auto; padding: 0 !important; }
td.tableFooter table { width: 100%; }
td.tableFooter td { text-align: left;  border-right-style: none !important; border-bottom-style: none !important; }
td.tableFooter td.right { white-space: nowrap; }
td.tableFooter table table { width: auto; }
td.tableFooter table table .fLabel { padding-left: 0; }
td.tableFooter table table .fText { padding-right: 2em; }
td.tableFooter .fLabel, td.tableFooter .fText, td.tableFooter .fButt { font-size: 111%; } /* making the text about 100% - (.9 x 1.11) */
td.tableFooter .fLabel, td.tableFooter .fText, td.tableFooter .fInput { text-align: left !important; margin-top: 0; vertical-align: middle !important; white-space: nowrap; }

/* form styles */
.fRequired, .fLabel, .fInput, .fFile, .fText, .fButt { font-family: Arial, Helvetica, sans-serif; color: #000; font-weight: normal; }
.fRequired, .fLabel, .fText { border-bottom: 1px dotted #ccc; padding-top: .45em; padding-bottom: .25em; vertical-align: top !important; }
.fRequired, .fLabel { color: #333; padding-right: 2em; white-space: nowrap; }
.fRequired { font-weight: bold; }
.fInput { margin: -.25em 0 0 0; }
table.fInput  { background-color: #fff; } /* file input fields are enclosed in their own table so that customizations work */
.fFile { padding: .3em; } /* file input fields need special formatting */
.fInput, .fButt, optgroup { font-size: 100%; } /* makes sure all browsers apply the correct font size */
optgroup { font-weight: bold; font-style: normal; }
optgroup option { font-weight: normal; }
fieldset { border: 1px solid #ccc; padding-left: .5em; margin: 0; padding-top: 0; padding-bottom: 0; }
input { height: auto !important; } /* lets dropdown line height adjust to font size */

/* mainColumn (for use with leftColumn) and mainBody (for use WITHOUT leftColumn) styles */
#mainColumn { width: 80%; float: left; position: relative; overflow: hidden; /* stops the IE Win 20%+80% bug*/ margin-left: 0; margin-right: -1px; border-left: 1px solid #ccc; z-index: 0; /* keep body behind dropdowns */ } /* negative margins allows border between leftColumn and mainColumn to always show correctly */
	/* this next rule is a hack to correct IE Mac specific declarations in the line above! \*/
	#mainColumn { left: 1px; margin-left: -1px; margin-right: 0; } /* negative margins allows border between leftColumn and mainColumn to always show correctly */
	/* end hack */
#mainColumn .content { padding-bottom: 2em; padding-right: .75em; padding-left: .75em; }
#mainColumn > .content div.text { width: 100%; overflow: auto; /*allows wide content to show with a scrollbar*/ margin-right: -20px; padding-right: 20px; /* stop text disappearing behind scrollbar */ }
	/* this next rule is a hack to correct IE Mac specific declarations in the line above! The subsequent rule allows some other browsers to show wide content with scrollbars \*/
		#mainColumn > .content div.text { width: auto; overflow: visible; margin-right: 0; padding-right: .5em; }
		#mainColumn > .content p { overflow: auto; padding-right: 20px; }
	/* end hack */
#mainColumn h2, #mainBody h2 { color: #000; font-weight:bold; border-bottom: 1px dotted #ccc; margin: .5em 0; padding: .5em 0; position: relative; width: auto; /* forces underline on IE */ }

#mainBody { width: 100%; position: relative; z-index: 0; /* keep body behind dropdowns */ }
#mainBody .content { padding-bottom: 2em; }

/* leftbar & rightbar styles */
#leftColumn { width: 20%; float: left; position: relative; overflow: auto; clear: left; margin-left: -1px; /*avoids a horizontal scroll bar*/ margin-right: -1px; border-right: 1px solid #ccc; z-index: 0; /* keep body behind dropdowns */ } /* negative margins allows border between leftColumn and mainColumn to always show correctly */
#leftColumn ul { list-style-type: none; list-style-position: outside; }
#leftColumn h2, #rightColumn h2 { border-bottom: 1px dotted #ccc; margin: .5em 0; padding: .5em 0; font-size: 90%; color: #333; }
#leftColumn h3, #rightColumn h3 { margin-top: 1em; font-size: 70%; }
#leftColumn .text, #rightColumn .text { font-size: 70% !important; }
#leftColumn div, #rightColumn div { margin-bottom: 1em; padding-bottom: 1px; /* keep spacing consistent across browsers */ }
#leftColumn div.fullWidth div, #leftColumn div.fullWidth p, #rightColumn div.fullWidth div, #rightColumn div.fullWidth p { padding-left: 1px; padding-right: 1px; } /* stops some browsers clipping any uppercase "W" that start/end a line */

#rightColumn { width: 30%; float: right; position: relative; z-index: 1; padding-top: 0px; /* make underlined headings align */ padding-left: .5em; margin: 0 .2em 1em 1em; background-color: #fff; /* stops borders on mainColumn h2 and rightColumn content colliding */}
	/* this next rule is a hack to correct IE Mac specific declarations in the line above! \*/
	#rightColumn { padding-top: 0px; }
	/* end hack */
#rightColumn .content { border: 1px solid #ccc; margin: .25em .25em .25em 0; padding: 0 .5em; overflow: auto; min-height: 15em; /* stops Camino showing a tiny box with a scroll bar */ }
#rightColumn h2 { margin-top: 2px; /* make underlined headings align */ width: 100%; /* forces underline on IE */ position: static; /* reverse mainColumn setting to make sure all browsers show borders correctly */}
#rightColumn table { width: 98%; } /* stops some browsers showing horizontal scroll bar */

/* common footer styles */
.links { color: #999; }
.links p { margin: .5em; }
.links a { text-decoration: underline; color: #666; }
.links a:hover { color: #333; }
#footer, #footerLeft, #footerRight { float: left; background-color: #fff; border-top: 2px solid #999; font-size: 70%; }
#footerLeft, #footerRight { height: auto; position: relative; margin-right: -1px; }
#footerLeft .links, #footerRight .links { overflow: auto; /*allows wide content to show with scrollbar*/ position: relative; top: -1px; margin-top: 1px; } /* last 3 items make sure the borders always show */

/* #footer styles (for use WITHOUT leftColumn)*/
#footer { width: 100%; }
#footer .links { overflow: auto; /*allows wide content to show with scrollbar*/ text-align: right; }

/* #footerLeft and #footerRight styles (for use with leftColumn)*/
#footerLeft { width: 20%; clear: left; overflow: hidden; margin-left: -1px; /*avoids a horizontal scroll bar*/ border-right: 1px solid #ccc; } /* negative margins allows border between leftFooter and rightFooter to always show correctly */
#footerLeft .links { width: 100%; text-align: left; }
#footerLeft .title { font-weight: bold; display: block; padding-right: .5em; }
#footerRight { width: 80%; overflow: hidden; margin-left: 0; border-left: 1px solid #ccc; }/* negative margins allows border between leftFooter and rightFooter to always show correctly */
	/* this next rule is a hack to correct IE Mac specific declarations in the line above! \*/
	#footerRight { left: 1px; margin-left: -1px; margin-right: 0; } /* negative margins allows border between leftFooter and rightFooter to always show correctly */
	/* end hack */
#footerRight .links { /*width: 100%;*/ text-align: right; }

#footerLogos { position: relative; clear: both; text-align: center; border-top: 1px solid #ccc; } /*display under standard left/right footer */
#footer #footerLogos { display: block; border-top: none; margin-top: 10px; float: left; width: 270px; text-align: left; } /* display on left side of full width footer */
#footerLogos .wamnetLogo, #footerLogos .savvisLogo { margin: 5px 10px; vertical-align: bottom; }
#footerLogos .wamnetLogo { height: 40px; width: 96px; margin-bottom: 7px; /* offset to match logo baselines */ }
#footerLogos .savvisLogo { height: 40px; width: 129px; }