/* Global Defaults */ body { font-family: Arial, Helvetica, sans-serif; font-size: 75%; /* Note that any font sizes will be a percentage of this top level default */ color: #333; background-color: #FCFAFA; margin: 0; padding: 0; } pre { font-family: Arial, Helvetica, sans-serif; font-size:0.9em;} /* Default Header Settings - and the p is there for SEO dumbness*/ h1, h2, h3, h5, p.heading { font-weight: bold; color: #333; margin: 0; } h1 { font-size: 1.7em; } h2 { font-size: 1.1em; margin-bottom: 5px; } h3, h5, p.heading { font-size: 1em; } td { font-family: Arial, Helvetica, sans-serif; font-size: 1em; color: #333; } /* Default Form Settings */ form { margin: 0; padding: 0; } input { vertical-align: top; } textarea { font-family: Arial, Helvetica, sans-serif; } /* Default Links */ a:link, a:visited, a:hover, a:visited:hover { text-decoration: underline; } a:link, a:visited { color: #0A7ABB; } a:hover, a:visited:hover { color: #274D72; } /* SideBar Links */ #sidebar a:link, #sidebar a:visited, #sidebar a:hover, #sidebar a:visited:hover { text-decoration: underline; font-weight: bold; } #sidebar a:link, #sidebar a:visited { color: #0A7ABB; } #sidebar a:hover, #sidebar a:visited:hover { color: #274D72; } /* Header Links */ #header a:link, #header a:visited, #header a:hover { text-decoration: underline; font-weight: bold; } #header a:link, #header a:visited { color: #0A7ABB; } #header a:hover { color: #274D72; } /* Breadcrumbs */ /*#breadcrumbs span.seperator, #breadcrumbs span.currentPage {color: #A3A3A3; } #breadcrumbs .breadCrumbRoot{background-image:url('/images/common/breadCrumbHome.gif'); background-repeat:no-repeat; padding-left:20px; }*/ /*#main {margin:0; padding:5px 10px 10px;}*/ .returnhome { float: left; margin-top: 5px; padding-left: 10px; } #breadcrumbs {float:left; color:#666; font-size:11px; margin-top:5px;} #breadcrumbs a:link, #breadcrumbs a:active, #breadcrumbs a:hover, #breadcrumbs a:visited {color:#666; font-size:11px; text-decoration:underline;} #breadcrumbs a.breadCrumbRoot {background-image: url('/images/common/breadCrumbHome.gif'); background-repeat:no-repeat; padding-left:16px;} #site-search-container {float:right; margin:5px 10px 0 0; font-size:11px;} #site-search-container form {margin:0; padding:0;} #site-search-container .site-search-text-input {margin:0; padding:2px 2px 3px; color:#999; border:1px solid #465156; vertical-align:top; font-size:11px;} #site-search-container .site-search-button {margin:0; padding:0;} /* Default Lists */ ul, ol { margin: 0; padding-left: 1.5em; } li{ padding-bottom: 5px; } ul { list-style-type: square; } /* Default IMG settings */ img { margin: 0; padding: 0; } img.logo { margin-bottom: 10px; } /* Default Button Configuration */ a.button, input.button { margin: 5px 0; } a.button img { border: none; } /* Removes the border from all button images */ /* Default Buttons */ a.button.learnmore { width: 100px; height: 21px; } a.button.go { width: 49px; height: 21px; } a.button.recalculate { width: 120px; height: 21px; } a.button.proceed { width: 150px; height: 21px; } a.button.continue { width: 100px; height: 21px; } a.button.search { width: 71px; height: 21px; } a.button.select { width: 98px; height: 21px; } a.button.selectpackage { width: 121px; height: 21px; } a.button.selectbackorder { width: 132px; height: 21px; } a.button.trythemnow { width: 115px; height: 21px; } a.button.takeatestdrive { width: 135px; height: 21px; } a.button.testdrivedesigntool { width: 255px; height: 21px; } a.button.basicsite { width: 88px; height: 21px; } a.button.builditforme { width: 109px; height: 21px; } a.button.builditmyself { width: 111px; height: 21px; } a.button.customsite { width: 100px; height: 21px; } a.button.justwebhosting { width: 132px; height: 21px; } a.button.nothanks { width: 94px; height: 21px; } a.button.robustflexiblesite { width: 148px; height: 21px; } a.yes.button { width: 49px; height: 21px; } a.button.submit { width: 98px; height: 21px; } a.button.buynow { width: 50px; height: 11px; } #content-container div.tinyarrow, #content-am div.tinyarrow { background-image: url(../images/common/tiny-arrow.gif); padding: 0 0 5px 14px; background-position: left 4px; background-repeat: no-repeat; } #content-container a.tinyarrow { background-image: url(../images/common/tiny-arrow.gif); padding: 0 0 5px 10px; background-position: left 4px; background-repeat: no-repeat; margin-left: 5px; } #content-container div.smallarrow, #content-am div.smallarrow, #sidebar h3.smallarrow a { background-image: url(../images/common/small-arrow.gif); padding: 0 0 5px 22px; background-position: left 1px; background-repeat: no-repeat; } #sidebar h3.smallarrow a { padding: 0 0 0 22px; } #content-container div.tinyarrow a, #content-am div.tinyarrow a, #content-container div.smallarrow a, #content-am div.smallarrow a, #content-container ul.tinyarrow a, #content-am ul.tinyarrow a, #content-container ul.smallarrow a, #content-am ul.smallarrow a, #content-container a.tinyarrow { font-weight: bold; } #sidebar h3.smallarrow a { background-position: center left; } #content-container ul.tinyarrow, #content-am ul.tinyarrow, #content-container ul.smallarrow, #content-am ul.smallarrow { margin: 0; padding: 0; background-image: none; } #sidebar ul.tinyarrow, #sidebar ul.smallarrow, #sidebar div.tinyarrow, #sidebar div.smallarrow { margin: 0 10px; } #content-container ul.tinyarrow li, #content-am ul.tinyarrow li, #am-header ul.tinyarrow li, #content-container ul.smallarrow li, #content-am ul.smallarrow li, #am-header ul.smallarrow li { list-style: none outside; background-repeat: no-repeat; margin: 3px 0; } #content-container ul.tinyarrow li, #content-am ul.tinyarrow li, #am-header ul.tinyarrow li { background-image: url(../images/common/tiny-arrow.gif); padding-left: 14px; background-position: left 4px; } #content-container ul.smallarrow li, #content-am ul.smallarrow li, #am-header ul.smallarrow li { background-image: url(../images/common/small-arrow.gif); padding-left: 22px; background-position: left 1px; } #content-container ul.smallarrow li ul li, #content-container ul.tinyarrow li ul li { background-image: none; list-style-type: square; padding-left: 5px; } #content-container ul.smallarrow li ul li a, #content-container ul.tinyarrow li ul li a { font-weight: lighter; } .box .smallarrow, .box .tinyarrow { margin: 0 10px; } /* Negate margins in these cases */ .box .content .smallarrow, .box .content .tinyarrow { margin: 0; } .generic-container .box .smallarrow, .generic-container .box .tinyarrow { margin: 0; } /* Horizontal Link List */ #content-container ul.horzlinklist, #content-am ul.horzlinklist { margin: 5px 0; } #am-header ul.horzlinklist { margin: 0; padding: 0; } #content-container ul.horzlinklist li, #content-am ul.horzlinklist li, #am-header ul.horzlinklist li { list-style: none; display: inline; } #content-container ul.horzlinklist li div, #content-am ul.horzlinklist li div, #am-header ul.horzlinklist li div { display: inline; } #content-container ul.horzlinklist.centeredlist, #content-am ul.horzlinklist.centeredlist, #am-header ul.horzlinklist.centeredlist { text-align: center; } #content-container ul.horzlinklist.centeredlist li, #content-am ul.horzlinklist.centeredlist li, #am-header ul.horzlinklist.centeredlist li { padding-right: 0; margin-right: 0; margin-left: 12px; } #content-container ul.horzlinklist.rightlist, #content-am ul.horzlinklist.rightlist, #am-header ul.horzlinklist.rightlist { text-align: right; padding-right: 2px; margin-right: 0; } #content-container ul.horzlinklist.rightlist li, #content-am ul.horzlinklist.rightlist li, #am-header ul.horzlinklist.rightlist li { padding-right: 0; margin-right: 0; margin-left: 12px; } #content-container ul.horzlinklist.leftlist, #content-am ul.horzlinklist.leftlist, #am-header ul.horzlinklist.leftlist { text-align: left; padding-left: 2px; margin-left: 0; } #content-container ul.horzlinklist.leftlist li, #content-am ul.horzlinklist.leftlist li, #am-header ul.horzlinklist.leftlist li { margin-left: 0; margin-right: 12px; } /* Arrow Stuff */ #content-container ul.horzlinklist.leftlist.tinyarrow li, #content-am ul.horzlinklist.leftlist.tinyarrow li, #am-header ul.horzlinklist.leftlist.tinyarrow li { padding-left: 14px; } #content-container ul.horzlinklist.leftlist.smallarrow li, #content-am ul.horzlinklist.leftlist.smallarrow li, #am-header ul.horzlinklist.leftlist.smallarrow li { padding-left: 22px; } /* Main Page */ #main { width: 749px; background-color: #FFF; border-right: 1px solid #CCC; padding: 0; } #main-liquid { background-color: #FFF; border-right: 1px solid #CCC; padding: 0; display: table-cell; } /* Header */ #header{ clear: both; background-color: #ECF3F7; width: 750px; height: 77px; background-image: url(../images/common/ui-page-bar-back.gif); background-repeat: repeat-x; border-bottom: 2px solid #3C6995; } #main-liquid #header { background-color: #ECF3F7; width: 100%; min-width: 750px; height: 77px; background-image: url(../images/ui-page-bar-back.gif); background-repeat: repeat-x; border-bottom: 2px solid #3C6995; } #header .customerwelcome { float: right; text-align: right; margin-top: 10px; margin-right: 5px; } #header .accentimage { float: right; border-left: 1px solid #FFF; } #header h1 { clear: left; padding-top: 25px; margin-left: 10px; color: #333; font-size: 1.7em; } #header .logout { position: absolute; left: 420px; top: 120px; width: 115px; } /* Content Area */ #main #content-container{ width: 750px; margin: 0; padding: 0; } #main-liquid #content-container{ width: 100%; margin: 0; padding: 0; } /* Sidebar */ #sidebar { width: 200px; float: right; margin: 10px 5px 5px 10px; } #sidebar h3 { font-size: 1em; font-weight: bold; background-color: #326698; padding: 8px 0 8px 8px; margin-bottom: 5px } #sidebar h3 a.vieworder:link, #sidebar h3 a.vieworder:visited { color: #FFF; } #sidebar h3 a.vieworder:hover { color: #CCC; } #sidebar h3.smallarrow { margin-left: 0; } #sidebar .smallarrow .vieworder { margin: 0; padding-bottom: 1px; } #sidebar .box { background-color: #EAEAEA; padding-bottom: 15px; } #sidebar .box h4, #sidebar .box .title { background-color: #C6C4C5; font-size: 0.95em; margin: 0 0 10px 0; padding: 5px 5px 5px 10px; text-transform: uppercase; font-weight:bold; } #sidebar .box p.sidetitle { background-color: #C6C4C5; font-size: 0.95em; margin: 0 0 10px 0; padding: 5px 5px 5px 10px; text-transform: uppercase; } #sidebar .box h5 { margin: 0 0 5px 10px; } #sidebar .box p { margin: 0; padding: 0 8px 6px 8px; } /* Sidebar Form Elements */ #sidebar .box form { margin: 0; padding: 0 6px 8px 8px;/**/ } #sidebar .box select { display: inline; width: 150px; } #sidebar .box input { vertical-align: top; } /* Content Setup */ #main-liquid #content-with-no-sidebar { padding: 10px; clear: both; } #content-with-sidebar { clear: none; margin-right: 211px; padding: 10px; } #content-with-no-sidebar { padding: 10px; clear: left; } #content-with-sidebar p, #content-with-no-sidebar p, #content-half p { margin: 0; padding: 0 0 8px 0; } #content-half { float: left; margin: 10px 0 10px 3px; width: 351px; padding: 10px; } /* Product Buckets */ #content-container .product-container, #content-container .product-callout, #content-container .product-list, #content-container .product-info, #content-container .generic-container, #content-container .column-container, #content-container .column-header-container { margin: 0 0 10px 0; float: left; clear: left; } #content-with-no-sidebar .product-container, #content-with-no-sidebar .product-callout, #content-with-no-sidebar .product-list, #content-with-no-sidebar .product-info, #content-with-no-sidebar .generic-container, #content-with-no-sidebar .column-container, #content-with-no-sidebar .column-header-container { clear: both; } /* Overall Container Width */ #content-with-sidebar .product-container, #content-with-sidebar .product-list, #content-with-sidebar .product-callout, #content-with-sidebar .product-info, #content-with-sidebar .generic-container, #content-am .generic-container { width: 517px; } #content-with-sidebar .column-container, #content-with-sidebar .column-header-container { width: 514px; } #content-with-no-sidebar .product-container, #content-with-no-sidebar .product-list, #content-with-no-sidebar .generic-container { width: 728px; } #content-with-no-sidebar .product-info, #content-with-no-sidebar .product-callout { width: 727px; } #content-with-no-sidebar .column-container, #content-with-no-sidebar .column-header-container { width: 724px; } #content-half .product-container, #content-half .product-list, #content-half .product-callout, #content-half .product-info, #content-half .generic-container { width: 351px; } #content-half .column-container, #content-half .column-header-container { width: 348px; } #content-container .product-container h2, #content-container .product-container h4, #content-container .product-callout h4, #content-container .product-info h4, #content-container .product-info h2, #content-container .product-list h4, #content-container .column-container h4, #content-container .column-header-container h4, #content-container .product-callout .header, #content-container .product-container .header, #content-container .product-info .header { background-color: #B8D3E1; padding: 7px 10px 6px 10px; margin: 0; font-size: 1.2em; font-weight: bold; } #content-container .product-list h4, #content-container .column-header-container h4 { background-color: #9AB0BD; padding: 6px 10px; border-bottom: 1px #FFF solid; margin-right: 1px; } #content-container .column-header-container h4 { margin-right: 0; } #content-container .product-container h5, #content-container .product-list h5, #content-container .column-header-container h5 { background-color: #B8D3E1; padding: 2px 10px 6px 10px; margin: 0; font-size: 1.2em; font-weight: normal; } #content-container .product-list h5, #content-container .column-header-container h5 { padding: 4px 10px; } #content-with-no-sidebar .product-list h4 { margin: 0 2px 0 0; } /* Secondary Coloring */ #content-container .product-container .secondary h4, #content-container .product-callout .secondary h4, #content-container .product-info .secondary h4, #content-container .product-list .secondary h5, #content-container .column-header-container .secondary h5 { background-color: #DFEBF1; } /* GENERIC CONTAINER */ #content-container .generic-container .box, #content-am .generic-container .box { border: 1px solid #B8D3E1; background-color: #FFF; padding: 10px; } /* single-header */ #content-container .generic-container h4, #content-am .generic-container h4, #content-container .generic-container .header { background-color: #B8D3E1; font-size: 1.2em; padding: 7px 10px 6px 10px; } #content-container #content-with-no-sidebar .generic-container h4 { margin: 0 2px 0 0; } #content-container #content-with-sidebar .generic-container h4 { margin: 0 1px 0 0; } #content-container #content-half .generic-container h4 { margin: 0 1px 0 0; } #content-am .generic-container h4 { margin: 0 1px 0 0; } /* multi-header */ #content-container #content-with-no-sidebar .generic-container .box h4, #content-container #content-with-sidebar .generic-container .box h4, #content-container #content-half .generic-container .box h4, #content-am .generic-container .box h4 { margin: -10px -10px 10px -10px; } #content-container .generic-container .box.secondary h4, #content-container .generic-container.secondary h4, #content-am .generic-container.secondary h4 { background-color: #DFEBF1; } #content-container .generic-container .box.disclaimer, #popup #content-container .disclaimer, #content-am .generic-container .box.disclaimer { color: #AAA; } #content-container .product-container .box, #content-container .product-list .box, #content-container .product-callout .box, #content-container .generic-container .box.oneoftwo, #content-container .generic-container .box.oneofthree, #content-container .generic-container .box.oneoffour, #content-am .generic-container .box.oneoftwo, #content-am .generic-container .box.oneofthree, #content-am .generic-container .box.oneoffour { float: left; border-bottom: 1px solid #B8D3E1; border-left: 1px solid #B8D3E1; border-top: none; border-right: none; background-color: #FFF; color: #333; margin-right: 1px; } #content-container .product-callout .box .big {font-size:18px; color:#000;} /* Tertiary */ #content-container #content-with-no-sidebar .generic-container.tertiary .box h4, #content-container #content-with-sidebar .generic-container.tertiary .box h4, #content-container #content-half .generic-container.tertiary .box h4, #content-container #content-with-no-sidebar .generic-container.tertiary h4, #content-container #content-with-sidebar .generic-container.tertiary h4, #content-container #content-half .generic-container.tertiary h4, #content-am .generic-container.tertiary h4, #content-container .product-container.tertiary .box h4, #content-container .product-container.tertiary .box h5, #content-container .product-container .box.tertiary h4, #content-container .product-container .box.tertiary h5 { background-color: #FFF; } #content-container .generic-container.tertiary .box, #content-am .generic-container.tertiary .box, #content-container .product-container.tertiary .box, #content-container .generic-container .box.tertiary, #content-container .product-container .box.tertiary { border-bottom: 1px solid #FFF; border-left: 1px solid #FFF; } #content-container #content-with-no-sidebar .generic-container.tertiary .box.oneofone, #content-container #content-with-sidebar .generic-container.tertiary .box.oneofone, #content-container #content-half .generic-container.tertiary .box.oneofone, #content-am .generic-container.tertiary .box.oneofone { border: 1px solid #FFF; } #content-container .product-container .box.oneofone { border-bottom: 1px solid #B8D3E1; border-left: 1px solid #B8D3E1; border-right: 1px solid #B8D3E1; margin-right: 0; } #content-container .product-container .box .content, #content-container .product-list .box .content, #content-container .product-info .box .content, #content-container .column-header-container .box .content { padding: 10px 10px 10px 10px; } /* Use this cap class to close off the right side of the right-most container */ #content-container .product-container .box.cap, #content-container .product-list .box.cap, #content-container .generic-container .box.oneoftwo.cap, #content-container .generic-container .box.oneofthree.cap, #content-container .generic-container .box.oneoffour.cap, #content-am .generic-container .box.oneoftwo.cap, #content-am .generic-container .box.oneofthree.cap, #content-am .generic-container .box.oneoffour.cap { border-right: 1px solid #B8D3E1; margin-right: 0; } #content-container .generic-container.tertiary .box.cap, #content-am .generic-container.tertiary .box.cap, #content-container .product-container.tertiary .box.cap { border-right: 1px solid #FFF; } #content-container .product-container .box .content ul, #content-container .product-callout.box .content ul, #content-container .generic-container.box .content ul, #content-am .generic-container.box .content ul { margin: 5px 0; } #content-container .product-container .box .button, #content-container .product-list .box .button { margin-left: 10px; } /* Smallcontrols applies to radio and checkboxes */ #content-container .product-container .box dl.radio, #content-container .product-list .box dl.radio, #content-container .product-info .box dl.radio, #content-container .generic-container .box dl.radio, #content-am .generic-container .box dl.radio, #content-container .product-container .box dl.smallcontrols, #content-container .product-list .box dl.smallcontrols, #content-container .product-info .box dl.smallcontrols, #content-container .generic-container .box dl.smallcontrols, #content-am .generic-container .box dl.smallcontrols { margin: 0; padding: 0; } #content-container .product-container .box dl.radio dt, #content-container .product-list .box dl.radio dt, #content-container .product-info .box dl.radio dt, #content-container .generic-container .box dl.radio dt, #content-am .generic-container .box dl.radio dt, #content-container .product-container .box dl.smallcontrols dt, #content-container .product-list .box dl.smallcontrols dt, #content-container .product-info .box dl.smallcontrols dt, #content-container .generic-container .box dl.smallcontrols dt, #content-am .generic-container .box dl.smallcontrols dt { float: left; clear: left; width: 20px; padding: 3px 0 3px 10px; } #content-container .product-container .box dl.radio dd, #content-container .product-list .box dl.radio dd, #content-container .product-info .box dl.radio dd, #content-container .generic-container .box dl.radio dd, #content-am .generic-container .box dl.radio dd, #content-container .product-container .box dl.smallcontrols dd, #content-container .product-list .box dl.smallcontrols dd, #content-container .product-info .box dl.smallcontrols dd, #content-container .generic-container .box dl.smallcontrols dd, #content-am .generic-container .box dl.smallcontrols dd { margin-left: 35px; padding: 5px 0 1px 0; } /* Pricing */ #content-container .product-container .box p.price, #content-container .product-list .box p.price, #content-container .product-callout .box p.price { margin: 5px 10px 0px 10px; font-weight: bold; color: #333; } #content-container p.price, #content-container span.price { font-weight: bold; color: #333; } #content-container .box .content p.price { margin: 0; } /* Best Value */ #content-container .product-container .box.align .content, #content-container .product-list .box.align .content { padding-top: 2.5em; } #content-container .product-container .box.bestvalue, #content-container .product-list .box.bestvalue { background-color: #EBF3F6; } #content-container .product-container .box.bestvalue .highlight, #content-container .product-list .box.bestvalue .highlight { border-bottom: 1px solid #677C18; margin: -10px -10px 10px -10px; background-color: #869F2A; text-align: center; font-weight: bold; color: #FFF; font-size: 0.8em; } #content-container .product-container .box.align .button { padding-top: 1.5em; } #content-with-sidebar .generic-container p.containertitle{ padding: 6px 10px; margin-right: 1px; margin-bottom: 0px; border-bottom: 0px; background-color: rgb(184, 211, 225); font-weight: bold; } #content-container .product-info .box p.subHeader2{ padding: 6px 10px; margin-right: 0px; margin-bottom: 0px; border-bottom: #fff 1px solid; background-color: rgb(184, 211, 225); font-weight: bold; } /* Special case with nested containers */ /*#content-container .generic-container .product-container .box { padding: 0; }*/ /* Content With Sidebar Product Container, Product List box widths */ #content-with-sidebar .product-container .box.oneofthree, #content-with-sidebar .product-list .box.oneofthree { width: 170px; } #content-with-sidebar .product-container .box.oneofone .box.oneofthree { width: 168px; } #content-with-sidebar .product-container .box.oneoftwo, #content-with-sidebar .product-list .box.oneoftwo { width: 256px; } #content-with-sidebar .column-header-container .box { width: 257px; } #content-with-sidebar .product-container .box.oneofone .box.oneoftwo { width: 254px; } #content-with-sidebar .column-container .box { width: 237px; } #content-with-sidebar .product-container .box.oneofone, #content-with-sidebar .product-list .box.oneofone, #content-with-sidebar .product-callout .box, #content-with-sidebar .product-info .box { width: 514px; } #content-with-sidebar .generic-container .box, #content-am .generic-container .box { width: 494px; } #content-with-sidebar .generic-container .box.oneofthree, #content-am .generic-container .box.oneofthree { width: 150px; } #content-with-sidebar .generic-container .box.oneoftwo, #content-am .generic-container .box.oneoftwo { width: 236px; } #content-with-sidebar .product-container .box.oneoftwo.principle, #content-with-sidebar .product-list .box.oneoftwo.principle, #content-with-sidebar .product-callout .box.principle { width: 307px; } #content-with-sidebar .column-header-container .box.principle { width: 308px; } #content-with-sidebar .product-container .box.oneoftwo.auxiliary, #content-with-sidebar .product-list .box.oneoftwo.auxiliary, #content-with-sidebar .product-callout .box.auxiliary { width: 205px; } #content-with-sidebar .column-header-container .box.auxiliary { width: 206px; } #content-with-sidebar .generic-container .box.oneoftwo.principle, #content-am .generic-container .box.oneoftwo.principle { width: 288px; } #content-with-sidebar .generic-container .box.oneoftwo.auxiliary, #content-am .generic-container .box.oneoftwo.auxiliary { width: 184px; } /* Content With No Sidebar Product Container, Product List box widths */ #content-with-no-sidebar .product-container .box.oneofthree, #content-with-no-sidebar .product-list .box.oneofthree { width: 240px; } #content-with-no-sidebar .product-container .box.oneofone .box.oneofthree { width: 238px; } #content-with-no-sidebar .product-container .box.oneoftwo, #content-with-no-sidebar .product-list .box.oneoftwo { width: 361px; } #content-with-no-sidebar .column-header-container .box { width: 362px; } #content-with-no-sidebar .product-container .box.oneofone .box.oneoftwo { width: 359px; } #content-with-no-sidebar .column-container .box { width: 342px; } #content-with-no-sidebar .product-container .box.oneofone, #content-with-no-sidebar .product-list .box.oneofone, #content-with-no-sidebar .product-callout .box, #content-with-no-sidebar .product-info .box { width: 724px; } #content-with-no-sidebar .generic-container .box { width: 704px; } #content-with-no-sidebar .generic-container .box.oneoffour { width: 160px; } #content-with-no-sidebar .generic-container .box.oneofthree { width: 220px; } #content-with-no-sidebar .generic-container .box.oneoftwo { width: 341px; } #content-with-no-sidebar .product-container .box.oneoftwo.principle, #content-with-no-sidebar .product-list .box.oneoftwo.principle, #content-with-no-sidebar .product-callout .box.principle { width: 433px; } #content-with-no-sidebar .column-header-container .box.principle { width: 434px; } #content-with-no-sidebar .product-container .box.oneoftwo.auxiliary, #content-with-no-sidebar .product-list .box.oneoftwo.auxiliary, #content-with-no-sidebar .product-callout .box.auxiliary { width: 289px; } #content-with-no-sidebar .column-header-container .box.auxiliary { width: 290px; } #content-with-no-sidebar .generic-container .box.oneoftwo.principle { width: 414px; } #content-with-no-sidebar .generic-container .box.oneoftwo.auxiliary { width: 268px; } /* Content Half Product Container, Product List box widths */ #content-half .product-container .box.oneoftwo, #content-half .product-list .box.oneoftwo, #content-half .column-header-container .box { width: 173px; } #content-half .column-container .box { width: 152px; } #content-half .product-container .box.oneofone, #content-half .product-list .box.oneofone, #content-half .product-callout .box, #content-half .product-info .box { width: 348px; } #content-half .generic-container .box { width: 328px; } #content-half .generic-container .box.oneoftwo { width: 153px; } /* These define the variable heights of the product container boxes */ #content-container .product-container.xxxlarge .box, #content-container .product-list.xxxlarge .box, #content-container .product-info.xxxlarge .box, #content-container .product-callout.xxxlarge .box, #content-container .generic-container.xxxlarge .box {height:29em;} #content-container .product-container.xxlarge .box, #content-container .product-list.xxlarge .box, #content-container .product-info.xxlarge .box, #content-container .product-callout.xxlarge .box, #content-container .generic-container.xxlarge .box {height:26em;} #content-container .product-container.xlarge .box, #content-container .product-list.xlarge .box, #content-container .product-info.xlarge .box, #content-container .product-callout.xlarge .box, #content-container .generic-container.xlarge .box {height:24em;} #content-container .product-container.large .box, #content-container .product-list.large .box, #content-container .product-info.large .box, #content-container .product-callout.large .box, #content-container .generic-container.large .box {height:22em;} #content-container .product-container.medium .box, #content-container .product-list.medium .box, #content-container .product-info.medium .box, #content-container .product-callout.medium .box, #content-container .generic-container.medium .box {height:20em;} #content-container .product-container.small .box, #content-container .product-list.small .box, #content-container .product-info.small .box, #content-container .product-callout.small .box, #content-container .generic-container.small .box {height:18em;} #content-container .product-container.xsmall .box, #content-container .product-list.xsmall .box, #content-container .product-info.xsmall .box, #content-container .product-callout.xsmall .box, #content-container .generic-container.xsmall .box {height:15em;} /* If this is a single product container across, the height should fit the size on the content. */ #content-container .product-container .box.oneofone { height: auto; padding-bottom: 8px;} /* Product Callout PriceInfo box height */ #content-container .product-callout.xxxlarge .box .priceinfo{height:25em;} #content-container .product-callout.xxlarge .box .priceinfo{height:23em;} #content-container .product-callout.xlarge .box .priceinfo{height:21em;} #content-container .product-callout.large .box .priceinfo{height:19em;} #content-container .product-callout.medium .box .priceinfo{height:17em;} #content-container .product-callout.small .box .priceinfo{height:15em;} #content-container .product-callout.xsmall .box .priceinfo{height:13em;} /* Product Container Content height */ #content-container .product-container.xxxlarge .box .content{height:19em;} #content-container .product-container.xxlarge .box .content{height:17em;} #content-container .product-container.xlarge .box .content{height:15em;} #content-container .product-container.large .box .content{height:13em;} #content-container .product-container.medium .box .content{height:11em;} #content-container .product-container.small .box .content{height:9em;} #content-container .product-container.xsmall .box .content{height:6em;} /* Product Container Content With Price height */ #content-container .product-container.xxxlarge .box .content.withprice{height:17em;} #content-container .product-container.xxlarge .box .content.withprice{height:16em;} #content-container .product-container.xlarge .box .content.withprice{height:14em;} #content-container .product-container.large .box .content.withprice{height:12em;} #content-container .product-container.medium .box .content.withprice{height:10em;} #content-container .product-container.small .box .content.withprice{height:8em;} #content-container .product-container.xsmall .box .content.withprice{height:5em;} #content-container .product-container .box.oneofone .content{height: auto;} /* Product List Content height */ #content-container .product-list.xxxlarge .box .content{height:22em;} #content-container .product-list.xxlarge .box .content{height:20em;} #content-container .product-list.xlarge .box .content{height:18em;} #content-container .product-list.large .box .content{height:16em;} #content-container .product-list.medium .box .content{height:14em;} #content-container .product-list.small .box .content{height:12em;} #content-container .product-list.xsmall .box .content{height:8em;} /* Product List Content with Price height */ #content-container .product-list.xxxlarge .box .content.withprice{height:20em;} #content-container .product-list.xxlarge .box .content.withprice{height:18em;} #content-container .product-list.xlarge .box .content.withprice{height:16em;} #content-container .product-list.large .box .content.withprice{height:14em;} #content-container .product-list.medium .box .content.withprice{height:12em;} #content-container .product-list.small .box .content.withprice{height:10em;} #content-container .product-list.xsmall .box .content.withprice{height:6em;} /* Product Callout Content height */ #content-container .product-callout.xxxlarge .box .content{height: 21em;} #content-container .product-callout.xxlarge .box .content{height:19em;} #content-container .product-callout.xlarge .box .content{height:17em;} #content-container .product-callout.large .box .content{height:15em;} #content-container .product-callout.medium .box .content{height:13em;} #content-container .product-callout.small .box .content{height:11em;} #content-container .product-callout.xsmall .box .content{height:9em;} /* Product Info, Product Callout Content with Price height */ #content-container .product-info.xxxlarge .box .content, #content-container .product-callout.xxxlarge .box .content.withprice{height: 20em;} #content-container .product-info.xxlarge .box .content, #content-container .product-callout.xxlarge .box .content.withprice{height:18em;} #content-container .product-info.xlarge .box .content, #content-container .product-callout.xlarge .box .content.withprice{height:16em;} #content-container .product-info.large .box .content, #content-container .product-callout.large .box .content.withprice{height:14em;} #content-container .product-info.medium .box .content, #content-container .product-callout.medium .box .content.withprice{height:12em;} #content-container .product-info.small .box .content, #content-container .product-callout.small .box .content.withprice{height:10em;} #content-container .product-info.xsmall .box .content, #content-container .product-callout.xsmall .box .content.withprice{height:8em;} #content-container .product-callout h4 { margin-right: 1px; } #content-container .product-callout .box.auxiliary { border-right: 1px solid #B8D3E1; } /* The multiple containers here are used to center the content inside the box. IE has trouble with this (it doesn't support table-cell or vertical-align */ #content-container .product-callout .box.auxiliary .content { width: 89%; height: auto; font-weight: bold; color: #666; display: table; overflow: hidden; } #content-container .product-callout .box.auxiliary .content .containcontent { display: table-cell; vertical-align: middle; text-align: center; width: 100%; } #content-container .product-callout .box.auxiliary .content h5 { font-size: 1.5em; font-weight: bold; margin: 0; } #content-container .product-info .box { border: 1px solid #B8D3E1; background-color: #FFF; } #content-container .product-info .box.firstonpage h4 { background-color: #B8D3E1; } #content-container .product-info .box .content, #content-container .product-callout .box .content { padding: 10px; } #content-container .product-info .box ul { padding: 8px 5px 5px 5px; border-bottom: 1px solid #DFEBF1; } #content-container .product-info .box li { margin-left: 20px; } /* Change this to ul.cap */ #content-container .product-info .box ul.cap{ border-bottom: 0; } /* Gives the button a special left margin when in these boxes */ #content-container .product-info .button, #content-container .product-callout .box .button { margin-left: 10px; } /* Column Container and Column Header Container */ #content-container .column-container, #content-container .column-header-container { border: 1px solid #B8D3E1; } #content-container .column-container .box { float: left; background-color: #FFF; color: #333; padding: 10px; } #content-container .column-container .secondary h4, #content-container .column-header-container .secondary h4 { background-color: #DFEBF1; } #content-container .column-container ul { } #content-container .column-container ul li { } /* Column Header Container */ #content-container .column-header-container .box { float: left; background-color: #FFF; color: #333; } #content-container .column-header-container .box h5 { margin-left: 1px; } /* Use this to give a product-container box that acid green border and header background color */ #content-container .product-container .box.highlight, #content-container .product-callout.highlight .box, #content-container .product-list .box.highlight, #content-container .product-container .box.highlight h4, #content-container .product-callout.highlight h4, #content-container .product-container .box.highlight h5, #content-container .product-list .box.highlight h5, #content-container .column-header-container .box.highlight h5, #content-container .product-callout.highlight .header { border-color: #C5EE62; } #content-container .product-container .box.highlight h4, #content-container .product-container .box.highlight h5, #content-container .product-callout.highlight h4, #content-container .product-list .box.highlight h5, #content-container .column-header-container .box.highlight h5, #content-container .product-callout.highlight .header { background-color: #C5EE62; } /* Johnson boxes (these are ad/info boxes) */ #content-container .johnsonbox { border-top: 15px solid #B8D3E1; border-left: 1px solid #B8D3E1; border-right: 1px solid #B8D3E1; border-bottom: 1px solid #B8D3E1; background-color: #FFF; color: #333; padding: 10px; float: left; margin: 0 10px 10px 0; } #sidebar .johnsonbox { width: 178px; } #content-with-sidebar .johnsonbox { width: 143px; } #content-with-no-sidebar .johnsonbox { width: 213px; } #content-half .johnsonbox { width: 148px; } #content-container .johnsonbox.right { float: right; margin: 0 0 10px 10px; } #content-with-sidebar .johnsonbox.right { margin-right: 2px; } #content-with-no-sidebar .johnsonbox.right { margin-right: 3px; } #content-half .johnsonbox.right { margin-right: 1px; } #content-container .johnsonbox.last { margin-left: 1px; margin-right: 0; } /* Last item in a stacked list of johnsonboxes */ #content-container .johnsonbox.specialoffer p { font-size: 1.5em; text-align: center; } /* For sales or callouts */ #content-container .johnsonbox.highlight { border-color: #C5EE62; } /* Acid green highlighting */ #content-container .johnsonbox.xxxlarge { height: 15em; } #content-container .johnsonbox.xxlarge { height: 14em; } #content-container .johnsonbox.xlarge { height: 12em; } #content-container .johnsonbox.large { height: 10em; } #content-container .johnsonbox.medium { height: 8em; } #content-container .johnsonbox.small { height: 6em; } #content-container .johnsonbox.xsmall { height: 4em; } /* Jason boxes (these are upgrade! boxes) */ .product-container div.jasonbox { float:right; background-color: #EBF3F6; border: 1px solid #B8D3E1; margin-left:10px; width: 220px; } .product-container div.jasonbox div.content p.heading { text-transform:none; font-size:1.2em; } .product-container div.jasonbox a img.learnmore.button { margin-left:0; } /* Promo Area */ .promo-container { clear: both; height: 13em; background-color: #B7D3E1; border-bottom: 1px solid #FFF; color: #666; } #main .promo-container { width: 750px; } #main-liquid .promo-container { width: 100%; } .promo-container .block { float: left; width: 261px; height: 13em; border-right: 2px solid #FFF; } .promo-container .block.one { background-color: #DFEBF1; } .promo-container .block.two { background-color: #D0E1EB; } .promo-container .block img.promo-image { border: 1px solid #3C6995; float: left; margin-top: 10px; margin-left: 10px; } .promo-container .block .content { margin-left: 67px; padding: 10px; width: 160px; } .promo-container .block .content h5 { margin: 0; font-size: 1em; } .promo-container .block .content .title { color: #333333; } .promo-container .block .content p { margin: 0; padding: 0; } .promo-container .block .button { float: left; clear: left; margin: 0; } .promo-container .block .go.button { margin: 10px 0 0 10px; border: none; } /* Popup Styles */ #popup {background:#fff;clear:both;text-align:left;margin:0 1%;width:98%;} #popup #masthead {width: 97%; height: 60px; float: left; margin:10px; background:url(/imgs/logos/rcom-logo-purple.svg) 0 0 no-repeat;} #popup #masthead .button-close {float:right; width: 156px; height:40px; margin-right: 10px; padding-top: 23px; text-align: center; } #popup #content-container h1, #popup h1 {clear: both; font-size: 1.5em;margin: 20px 20px 0 20px;color:#114A9B;} #popup #content-container {float:left;position:relative;margin:10px 0;width:100%;background:#fff;} #popup #content-container .content, #popup #content-container .content-glossary {background:#eee;float:left;padding:20px;} #popup #content-container .content h2, #popup #content-container .content-glossary h2 {font-size: 1.1em;text-transform:uppercase;border-bottom: solid 2px #666;} #popup #content-container .content .glossary, #popup #content-container .content-glossary .glossary {font-weight: bold;font-size: 12px;letter-spacing: 0.25ex;margin: 14px 0 24px 0;} #popup #content-container p {margin:10px 0;} #popup #content-container .content dl, #popup #content-container .content dt, #popup #content-container .content dd, #popup #content-container .content-glossary dl, #popup #content-container .content-glossary dt, #popup #content-container .content-glossary dd { margin: 0;font-size:12px;} #popup #content-container .content dt, #popup #content-container .content dd, #popup #content-container .content-glossary dt {color: #333;margin-bottom: 0.5em;font-size: 1em;} #popup #content-container .content-glossary dd {padding: 0 0 14px 0;} #popup #content-container .tinyarrow {margin:10px 0;font-size:12px;} #popup #content-container .c-tl, #popup #content-container .c-tr, #popup #content-container .c-bl, #popup #content-container .c-br {position:absolute; width:10px; height:10px; font-size:1px; line-height:0; background:url(/img/backgrounds/corners.png) no-repeat 0 0; z-index:10;} #popup #content-container .c-tl {top:0; left:0; background-position:0 -10px;} #popup #content-container .c-tr {top:0; right:0; background-position:-10px -10px;} #popup #content-container .c-bl {bottom:0; left:0; background-position:0 -20px;} #popup #content-container .c-br {bottom:0; right:0; background-position:-10px -20px;} #popup #content-container .content { font-weight: normal; padding: 10px; background-color: #fff; } #popup #content-container .content p { padding: 0 0 8px 0; } #popup #content-container .back-to-top { padding-bottom: 17px; } #popup #content-container thead.chart { font-weight: bold; background-color: #EEE; } #popup #content-container table.chart { margin: auto; border-bottom: solid 1px #666; border-right: solid 1px #666; } #popup #content-container .chart td { border-top: solid 1px #666; border-left: solid 1px #666; vertical-align: top; padding: 0.25em 1em 0.25em 0.5em; text-align: left; } /* a.textHelpAirline:link, a.textHelpAirline:visited { font-family:verdana,arial,helvetica,sans-serif; font-size:10px; color: #003399; text-decoration: none; } */ .textAirlineBox { font-family:verdana,arial,helvetica,sans-serif; font-size:11px; color: #3F434C; } .textBoldAirlineBox { font-family:verdana,arial,helvetica,sans-serif; font-size:11px; font-weight: bold; color: #3F65B8; } .textWarningAirlineBox { font-family: verdana, arial, helvetica, sans-serif; font-size: 11px; color: #CC0000; } .textBoldWarningAirlineBox { font-family: verdana, arial, helvetica, sans-serif; font-size: 11px; font-weight: bold; color: #CC0000; } .airlineEntryBox { width:192px; border: 1px solid; color: 3F434C; } /************************** * VYO Shopping Cart Styles *************************/ td.cart-header{ background-image: url(/purchase-it/images/bluebar.gif); background-repeat: repeat-x; } div.ad-above-cart{ padding: 4px; border: 1px solid #B7D3E1; width: 638px; margin: 5px 0; } td.ad-in-cart{ border: 1px solid #B7D3E1; border-top: none; border-bottom: none; background-color: #F6FAFC } /* SSL Upsell Page */ #main #content-container #content-with-no-sidebar #ssl-upsell-block {margin:0; padding:120px 0 0 0; background: transparent url('/images/common/ssl-upsell-bg.gif') no-repeat scroll 0 0; width:620px; border:2px solid #CCCCCC;} #main #content-container #content-with-no-sidebar #ssl-upsell-block ul {margin:0 20px 0 110px;} #main #content-container #content-with-no-sidebar #ssl-upsell-block .bar {margin:20px 10px; padding:10px; background-color:#F2FFD1; width:580px;} #main #content-container #content-with-no-sidebar #ssl-upsell-block .bar .price {float:left; font-size:14px; font-weight:bold;} #main #content-container #content-with-no-sidebar #ssl-upsell-block .bar .price .term {font-size:11px; font-weight:normal;} #main #content-container #content-with-no-sidebar #ssl-upsell-block .bar .action {padding:5px 0 0 0; float:right;} .button-blue { background-color: #0840A1; color: white; border: 0; padding: 5px 10px; border-radius: 3.01px; -moz-border-radius: 5px; -webkit-border-radius: 5px;