/* * Base styles for the ResellersPanel plugin's shortcode-rendered * widgets (order form, plan comparison tables, domain search) -- * this theme's own overrides on top of these follow further down. */ @CHARSET "UTF-8"; html,body { height: 100%; margin: 0; padding: 0; } /*****************************/ /*** Core html setup stuff ***/ /*****************************/ /* * Removed the rest of the vendor theme's own `body{...}` rule (font-family: * Helvetica/Arial, font-size:14px, color:#000, margin:0 auto) — same * `body`-tag collision as the background-image rules just above. * Confirmed live via getComputedStyle(document.body): this was * overriding this theme's own body font-family/size (style.css, * loaded earlier, same specificity so this later rule was winning) on * every page that loads this stylesheet — meaning most of the site was * silently rendering in Helvetica/Arial at 14px instead of the * intended design-system font at 16px. Likely a real contributor to * "doesn't feel as polished" — wrong body font sitewide is not a small * thing. Kept `height:100%; margin:0; padding:0` from the html,body * rule above (harmless resets, not fighting anything of ours). */ /* * Removed the `color:#c42c20` (brick red, the vendor theme's own old link * color) from this bare `a{}` rule — same collision pattern as * everything else in this block: a generic element selector, not * scoped to any vendor-theme-specific class, so it was overriding this * theme's own `a{color:inherit}` (style.css) on every plain link in * regular content. Confirmed live on the SSL certificates article: * inline links like "web hosting" and "domain" rendered in this red * instead of anything from the current design system. Kept * `text-decoration:none` — removing it too would un-underline links * that plugin-rendered content may rely on looking plain until hover. * Added `.page-body a, .post-body a` in style.css so content links get * an intentional, on-brand color instead of just invisibly inheriting * body text color once the red is gone. */ a{ text-decoration: none; } a:hover{ text-decoration: underline; } a:hover, a:active, a:focus, button:hover, button:focus {outline:none;} img{ border-style: none; } .clear { clear: both; overflow:hidden; font-size:0; line-height:0; } .left{ float:left; } .right{ float:right; } h1 { font-size:30px; font-weight:bold; } h2 { font-size:24px; font-weight:bold; padding-left:20px; } h4 { font-size:14px; font-weight:bold; } h5 { font-size:16px; font-weight:normal; } /*****************************************/ /*** Template specific layout elements ***/ /*****************************************/ #wrapper_fixed{ width:1000px; padding:0px; margin:0px auto; position: relative; } #ribbon{ float:none; width:94px; height:143px; position:absolute; margin:0; padding:0; left:-60px; } #logo{ width:60px; height:60px; margin:30px 20px 0 14px; padding:0; z-index:300; } #header_top{ float:left; width:1000px; height:auto; min-height:40px; overflow:hidden; margin:0; padding:0; position: relative; } #header_title{ float:left; width:1000px; height:auto; min-height:60px; overflow:hidden; margin:0; padding:0; display: flex; } .position{ width: 1000px; margin:0px auto; _text-align: left; } .hidden_text{ display:none; } /*****************************************/ /*** Site Title and Description in the Header ***/ /*****************************************/ h1#header_logo a{ margin:-20px 0 0 50px; padding:0px; font-family: Helvetica, Arial, sans-serif; text-decoration:none; font-size:24px; line-height:28px; font-weight:bold; display: block; color:#fff; } h5#header_logo { margin:0 0 0 50px; padding:0px; font-family: Helvetica, Arial, sans-serif; font-size:14px; font-weight:bold; display: block; color:#e75a50; } /*****************************************/ /*** Login Field in the Header ***/ /*****************************************/ #rpwp-login-wrapper{ float:left; height:auto; min-height:24px; overflow:hidden; padding:0 12px 0 36px; margin:8px 0; font-family: Helvetica, Arial, sans-serif; font-size:13px; line-height:24px; color:#8fa0ae; border-right: 1px dotted #3d5262; background-position: 10px 4px !important; } #rpwp-login-wrapper a{ font-family: Helvetica, Arial, sans-serif; color:#8fa0ae; text-decoration:none; } #rpwp-login-wrapper a:hover{ color:#e75a50; text-decoration:none; } /*****************************************/ /***Sign Up in the Header ***/ /*****************************************/ #rpwp-login-form-text{ float:left; height:auto; min-height:24px; overflow:hidden; padding:0 12px 0 36px; margin:8px 0 8px 210px; font-size:13px; font-weight:bold; line-height:24px; color:#fff; border-right: 1px dotted #3d5262; background-position: 10px 4px !important; } #rpwp-login-form-text a { font-family: Helvetica, Arial, sans-serif; font-weight:bold; text-decoration:none; color:#fff; } #rpwp-login-form-text a:hover{ text-decoration:none; color:#54c5fe; } /*****************************************/ /***Phone Number in the Header ***/ /*****************************************/ #header_phone { float:left; height:auto; min-height:24px; overflow:hidden; padding:0 12px 0 36px; margin:8px 0; font-family: Helvetica, Arial, sans-serif; font-size:13px; line-height:24px; color:#8fa0ae; border-right: 1px dotted #3d5262; background-position: 10px 4px !important; } #header_phone .small { padding-left: 5px; font-family: Helvetica, Arial, sans-serif; color:#e75a50; line-height:24px; } #header_phone .number { padding-left: 5px; font-family: Helvetica, Arial, sans-serif; font-size:14px; font-weight:bold; line-height:24px; color:#8fa0ae; } /*****************************************/ /*** Live Chat in the Header ***/ /*****************************************/ #live_chat{ float:left; display: block; width: 145px; height:24px; margin:8px 0; padding:0 12px; overflow: hidden; } /*****************************************/ /*** Main Menu ***/ /*****************************************/ #menu{ float:left; width:1000px; height:auto; min-height:50px; overflow:hidden; margin:0px; padding:0; } #menu ul.dropdown{ float:left; height:auto; min-height:50px; overflow:hidden; width:100%; margin: 0 0 0 40px; padding: 0; list-style-type: none; list-style:none; /* background: url(images/bkg_butseparator.gif) top left no-repeat; */ } #menu ul.dropdown li{ float:left; height:auto; min-height:50px; overflow:hidden; padding:0; position:relative; /* hey Submenu ULs, appear below! */ background:none; } #menu ul.dropdown li a{ margin: 0px; padding: 0 10px; line-height: 50px; font-size:13px; text-transform:uppercase; font-family: Helvetica, Arial, sans-serif; font-weight:bold; display: block; text-decoration: none; color:#fff; } #menu ul.dropdown li a:hover{ float:left; margin: 0px; padding: 0 10px; line-height: 50px; text-decoration: none; display: block; color:#afafaf; } #menu ul.dropdown li:hover{ color:#afafaf; } #menu ul.dropdown li.current_page_item a, #menu ul.dropdown li.current-menu-item a, #menu ul.dropdown li.current-menu-ancestor a, #menu ul.dropdown li.current-page-ancestor a, .menu-hover-class { float:left; margin: 0px; padding: 0 10px 10px 10px; line-height: 40px; text-decoration: none; display: block; color:#d53429; } #menu ul.dropdown li.current-menu-item a, #menu ul.dropdown li.current-menu-item a:hover { } /*****************************************/ /*** Sub Menu ***/ /*****************************************/ ul.dropdown li ul { min-width:212px; margin:0px; padding:2px; list-style: none; position:absolute; z-index:500; background:#000; border-top:5px solid #000; border-bottom:5px solid #000; top:40px; /* Box Radius */ -moz-border-bottom-right-radius: 6px; /* Firefox */ -moz-border-bottom-left-radius: 6px; /* Firefox */ -moz-border-top-right-radius: 6px; /* Firefox */ -webkit-border-bottom-right-radius: 6px; /* Safari, Chrome */ -webkit-border-bottom-left-radius: 6px; /* Safari, Chrome */ -webkit-border-top-right-radius: 6px; /* Safari, Chrome */ -o-border-bottom-right-radius: 6px; /* Opera */ -o-border-bottom-left-radius: 6px; /* Opera */ -o-border-top-right-radius: 6px; /* Opera */ border-top-right-radius: 6px; /* CSS3 */ border-bottom-right-radius: 6px; /* CSS3 */ border-bottom-left-radius: 6px; /* CSS3 */ } ul.dropdown ul ul { top:0; left:100%; /* Position the sub menus to right. */ } #menu ul.dropdown li ul.sub-menu li { width:212px; height:auto; margin:0px; padding:0; /* background: transparent; */ border-top:1px solid #2c3b45; border-bottom:1px solid #577285; } ul.dropdown li ul a { display:block; } #menu ul.dropdown li ul.sub-menu li a { width:200px; margin:0px; padding:5px 6px; line-height:normal; border: none; color:#fff; background:#4b5f6f; } #menu ul.dropdown li ul.sub-menu li a:hover { width:200px; padding:5px 6px; margin:0px; color: #afafaf; background:#314352; } /* #menu ul ul.sub-menu li:hover{ width:200px; padding:0px 6px; margin:0px; color: #fff; background:#a3a112; } */ #menu ul ul.sub-menu li.current-menu-item , #menu ul.dropdown li ul.sub-menu li.current-menu-item a { color: #d53429; background:#000; } /* Hide all the dropdowns (submenus) */ ul.dropdown ul, ul.dropdown li:hover ul ul, ul.dropdown ul li:hover ul ul { display: none; } /* Display the submenus only when li are hovered */ ul.dropdown li:hover ul, ul.dropdown ul li:hover ul , ul.dropdown ul li ul li:hover ul { display: block; } /*****************************************/ /*** Breadcrumbs ***/ /*****************************************/ #crumbs { float:left; width: 980px; margin:5px 10px -20px 10px; height:auto; min-height:30px; overflow:hidden; font-family: Helvetica, Arial, sans-serif; color:#d9d9d9; } #crumbs a{ color:#50c1fc; } .current { color:#fff; } /*****************************************/ /*** Content ***/ /*****************************************/ #content{ float:left; width:1000px; margin-top:95px; padding:0; position:relative; z-index:1; } #front_page_content{ float:left; width:1000px; margin-top:-95px; } #default_content, #internal_page_1, #contacts_page{ padding: 0 25px 50px; margin:0; line-height:24px; } #internal_page_2{ padding: 0 0px 50px; margin:0; } /*****************************************/ /*** Footer ***/ /*****************************************/ #footer-full-width { width:100%; padding-bottom:60px; padding-top:20px; background:#2f2f2f; } #footer{ width:1000px; padding:0px; margin:0px auto; position: relative; } #footer-copyright { width:1000px; padding:0px; margin:0px auto; position: relative; } #footer_menu{ float: left; width: 225px; margin:0 12px; padding: 0px; } #footer_menu h3{ font-size: 14px; font-weight:bold; color:#fff; } #footer_menu ul{ margin: 0; padding: 0; list-style-type: none; } #footer_menu ul li{ padding:4px 0px 4px 10px; } #footer_menu ul li a{ font-size: 12px; display: inline-block; text-decoration: none; color:#a1a1a1; padding: 3px 0px 3px 10px; } #footer_menu a:hover{ font-size: 12px; color:#e75a50; } #footer_menu ul li a span{ font-size:16px; } #footer_contacts{ float: left; width: 1000px; margin: 15px 0 0 0; padding: 0px; font-size: 12px; color:#fff; } #footer_contacts span{ border-right:1px solid #fff; padding-right:5px; } #footer_contacts span:last-child{ border-right:none; } #footer_contacts a:link{ font-size: 12px; color:#c5c5c5; } #footer_contacts a:hover{ font-size: 12px; color:#e75a50; } #footer_cards{ float: right; width: 250px; height:auto; min-height:24px; overflow:hidden; margin:0 0 10px 0; } #copyright{ float:left; width:600px; font-size: 12px; color:#858484; } /*****************************************/ /*** Buttons ***/ /*****************************************/ .rpwp-btn { width:110px; text-align:center;} .rpwp-button{ cursor: pointer; padding: 2px 15px; font-size: 18px; font-weight: bold; text-decoration: none; text-transform:capitalize; font-family: Arial, Helvetica, sans-serif; font-variant:normal; color: #fff; text-shadow: 0px 1px 1px #6d0902; border:1px solid #c8c8c8; /* Border Radius */ -moz-border-radius: 3px; /* Firefox */ -webkit-border-radius: 3px; /* Safari, Chrome */ -o-border-radius: 3px; /* Opera */ -ms-border-radius: 3px; /* Opera */ border-radius: 3px; /* CSS3 */ } .rpwp-button.colorize{ background-image: linear-gradient(bottom, #B02117 0%, #CF3125 100%); background-image: -o-linear-gradient(bottom, #B02117 0%, #CF3125 100%); background-image: -moz-linear-gradient(bottom, #B02117 0%, #CF3125 100%); background-image: -webkit-linear-gradient(bottom, #B02117 0%, #CF3125 100%); background-image: -ms-linear-gradient(bottom, #B02117 0%, #CF3125 100%); background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0, #B02117), color-stop(1, #CF3125) ); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#CF3125', EndColorStr='#B02117'); /* IE6–IE9 */ } .rpwp-button.colorize:hover{ background-image: linear-gradient(bottom, #750C04 0%, #A9190F 100%); background-image: -o-linear-gradient(bottom, #750C04 0%, #A9190F 100%); background-image: -moz-linear-gradient(bottom, #750C04 0%, #A9190F 100%); background-image: -webkit-linear-gradient(bottom, #750C04 0%, #A9190F 100%); background-image: -ms-linear-gradient(bottom, #750C04 0%, #A9190F 100%); background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0, #750C04), color-stop(1, #A9190F) ); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#A9190F', EndColorStr='#750C04'); /* IE6–IE9 */ } .rpwp-button.colorize-2{ /* ---black---- */ /*#3F3F3F - #6E6E6E*/ background-image: linear-gradient(bottom, #3F3F3F 19%, #6E6E6E 60%); background-image: -o-linear-gradient(bottom, #3F3F3F 19%, #6E6E6E 60%); background-image: -moz-linear-gradient(bottom, #3F3F3F 19%, #6E6E6E 60%); background-image: -webkit-linear-gradient(bottom, #3F3F3F 19%, #6E6E6E 60%); background-image: -ms-linear-gradient(bottom, #3F3F3F 19%, #6E6E6E 60%); background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0.19, #3F3F3F), color-stop(0.6, #6E6E6E) ); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#6E6E6E', EndColorStr='#3F3F3F'); /* IE6–IE9 */ } .rpwp-button.colorize-2:hover{ text-decoration: none; background-image: linear-gradient(bottom, #3F3F3F 19%, #5E5E5E 60%); background-image: -o-linear-gradient(bottom, #3F3F3F 19%, #5E5E5E 60%); background-image: -moz-linear-gradient(bottom, #3F3F3F 19%, #5E5E5E 60%); background-image: -webkit-linear-gradient(bottom, #3F3F3F 19%, #5E5E5E 60%); background-image: -ms-linear-gradient(bottom, #3F3F3F 19%, #5E5E5E 60%); background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0.19, #3F3F3F), color-stop(0.6, #5E5E5E) ); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#5E5E5E', EndColorStr='#3F3F3F'); /* IE6–IE9 */ } .rpwp-button.left{ float:left; } .rpwp-button.right{ float:right; } .rwp-button.center{ margin:0px auto; text-align:center; } .rpwp-button .gloss{ } .rpwp-block{padding-right: 2em;padding-bottom:30px;} /*****************************************/ /*** Content headers - special pages ***/ /*****************************************/ #content_header{ padding: 0 25px; font-size: 14px; margin:0 0 10px 0; position:relative; } /* * Found via a screen recording flagging "Hosting Articles" rendering * with doubled/ghosted-looking text. #aboutus-content-main h1 * (confirmed on /hosting-articles/, /about-us/, and used on 9 pages * sitewide) was grouped into this rule meant for #content_header — a * dark banner needing its heading text pulled up (margin-top:-66px) * and colored white to sit inside a background image. #aboutus- * content-main has no such banner: it's a plain light page-body * section, so this same white text (invisible against a light * background) with a heavy black text-shadow rendered as a shadow- * only silhouette, and the -66px margin pulled it up to directly * overlap the theme's own auto-generated .page-title — confirmed live * via getBoundingClientRect() the two exact-matching "Hosting * Articles" headings' boxes overlapped. The mobile breakpoint further * down this file already correctly overrides this h1 back to * margin-top:0/dark ink color for exactly this reason; desktop just * never got the matching fix. */ #content_header h1, #content_header h2, #content_header h3{ font-size: 30px; font-weight:bold; color:#fff; text-shadow: 0 4px 3px #000; margin-top:-66px; line-height:normal; } #aboutus-content-main h1{ font-size: 30px; font-weight:bold; color:#273948; text-shadow:none; margin-top:0; line-height:normal; } #domain-content-main h1, #default_content .article2-text-area h1, #default_content .article1-text-area h1, #default_content h1{ float: left; width:100%; margin-top:10px; font-size: 30px; font-weight:bold; text-shadow: none; color:#273948; line-height:normal; } .header_dedicated{ float: left; width: 950px; } .header_semi-dedicated{ float: left; width: 950px; } .header_web_hosting{ float: left; width: 950px; } .header_vps_compare{ float: left; width: 950px; } .header_vps_openvz{ float: left; width: 950px; } .header_vps_kvm{ float: left; width: 950px; } .header_domains{ float: left; width: 950px; } .header_dedicated, .header_semi-dedicated, .header_web_hosting, .header_vps_compare, .header_domains, .header_vps_openvz, .header_vps_kvm { height:190px; } .text_dedicated, .text_semi-dedicated, .text_web_hosting, .text_vps_compare, .text_domains, .text_vps_openvz, .text_vps_kvm { width:620px; line-height:24px; font-size:14px; padding-bottom:10px; } /****** Hepsia Page ******/ .header_hepsia { float: left; width: 950px; height:auto; min-height:250px; overflow:hidden; padding-bottom:0; margin-bottom:0; } .text_hepsia { float:left; width:460px; margin:10px 0 0 0; padding-bottom:10px; line-height:28px; font-size:14px; } .hepsia-top-video { float:right; margin:10px 12px 0px 0px; height:auto; min-height:217px; overflow:hidden; border:2px solid #0f4475; } a.demo-link { padding:0px 0px 0px 25px; margin-right:7px; } a.video-link { padding:0px 0px 0px 23px; margin-left:7px; } .line-full-width{ border-top:1px solid #b5b5b5; } /*****************************************/ /*** Default content for inner pages ***/ /*****************************************/ #default_content ol{ padding:0 0 0 20px; } #default_content ol li{padding: 4px 0 4px 9px;} #default_content p{line-height:24px;} /*****************************************/ /*** Domain Search ***/ /*****************************************/ /*-----domain name only banner------*/ #domain-only-banner, #domain-hosting-banner { float:left; width:970px; height:auto; min-height:232px; overflow:hidden; margin: 0 0 20px -25px; padding:10px 15px 0px 15px; } #domain-only-banner td, #domain-hosting-banner td { line-height:48px; } #domain-only-banner td.last, #domain-hosting-banner td.last { border-bottom: none; line-height:48px; } #domain-only-banner h3, #domain-hosting-banner h3 { font-size:20px; margin:0px; font-weight:bold; text-transform: uppercase; color:#fff; } #domain-only-banner .text, #domain-hosting-banner .text { font-size:24px; color:#fff; } #domain-only-banner span.currency, #domain-hosting-banner span.currency { font-size:28px; font-weight:bold; color:#fff; } #domain-only-banner span.price-value, #domain-hosting-banner span.price-value { font-size:30px; margin:0px; font-weight:bold; color:#fff; } /*-----domain name only banner------*/ /*-----domain tld banner------*/ #domain-tld-banner { float:left; width:970px; height:auto; min-height:212px; overflow:hidden; margin: 0 0 20px -25px; padding:30px 15px 0px 15px; font-size:36px; color:#fff; } #domain-tld-banner .arrow { } #domain-tld-banner span.tld { float:none; font-size:100px; line-height:120px; color:#fff; } #domain-tld-banner span.currency { font-size:90px; color:#fff; } #domain-tld-banner span.price-value { font-size:123px; line-height:140px; color:#fff; } /*-----domain tld banner------*/ /*-----domain tld banner 2------*/ #domain-tld-banner-2 { float:left; width:920px; height:auto; min-height:212px; overflow:hidden; margin: 0 0 20px 0; padding:30px 15px 0px 15px; font-size:36px; color:#fff; } #domain-tld-banner-2 .arrow { } #domain-tld-banner-2 span.tld { float:none; font-size:100px; line-height:120px; color:#fff; } #domain-tld-banner-2 span.currency { font-size:90px; color:#fff; } #domain-tld-banner-2 span.price-value { font-size:123px; line-height:140px; color:#fff; } .free-domain { font-size:60px; font-weight:bold; } .domain-tld-banner-text { font-size:20px; line-height:24px; text-transform:uppercase; } #domain-tld-banner-2 .domain-price { font-size:60px; font-weight:bold; } #domain-tld-banner-2 td.domain-price { width:160px; padding-right:10px; text-align:right; } #domain-tld-banner-2 .domain-currency { font-size:50px; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; } /*-----domain tld banner 2------*/ /*------------domain page 2---------------*/ #domain-content-main { float:left; width:630px; margin-top:0px; padding:0 20px 0 0; display:block; } #domain-content-main p { line-height:26px; } #domain-banner-1 { float:left; width:630px; margin: 20px 0 20px 0; padding: 0; } #domain-banner-1 div { float:left; width:460px; height:auto; min-height:40px; overflow:hidden; margin:0px 90px; padding:0; } h3.domain-banner-title-1 { float:left; font-size:30px; width:630px; margin:0px; padding:15px 0px; font-weight:bold; text-align:center; color:#fff; } #domain-banner-1 h4 { float:left; width:630px; text-align:center; font-size:23px; font-weight:normal; color:#50c1fc; } #domain-banner-1 h4 strong.tld-cont { font-size:32px; color:#50c1fc; } #domain-sidebar { float:right; width:300px; margin-top:14px; margin-right:-25px; padding:10px 10px; display:block; background:#d8d8d8; } #domain-sidebar h3 { font-size:19px; margin:0px; padding:0px 0px 0px 30px; font-weight:normal; background:#000; color:#FFF; border:1px solid #000000; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; line-height:42px; /* ---black---- */ /*#3F3F3F - #000000*/ background-image: linear-gradient(bottom, #3F3F3F 30%, #000000 60%); background-image: -o-linear-gradient(bottom, #3F3F3F 30%, #000000 60%); background-image: -moz-linear-gradient(bottom, #3F3F3F 30%, #000000 60%); background-image: -webkit-linear-gradient(bottom, #3F3F3F 30%, #000000 60%); background-image: -ms-linear-gradient(bottom, #3F3F3F 30%, #000000 60%); background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0.3, #3F3F3F), color-stop(0.6, #000000) ); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#000000', EndColorStr='#3F3F3F'); /* IE6–IE9 */ } /* * Confirmed live on /order-domain/ (#sidebar_accordion's

toggle, * appears on 27 pages per the sitewide audit): plain black gradient, * unrelated to any brand color on the site. Flat teal instead. */ #domain-sidebar h4 { font-size:19px; padding:0px 0px 0px 30px; font-weight:normal; background:var(--signal); color:#FFF; border:1px solid var(--signal-ink); -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; line-height:42px; background-image:none; } #domain-sidebar table.tld-prices th { height:35px; font-size:17px; font-weight:normal; color:#fff; background:#0a3768; } #domain-sidebar table.tld-prices tr { background:#ebebeb; } #domain-sidebar table.tld-prices tr td { padding:0 0 0 15px; border-top:1px solid #b9b9b9; border-bottom:1px solid #F3F3F3; } .tld-price-currency { font-size:16px; font-weight:bold; color:#000; } #domain-sidebar table.tld-prices tr td .tld-price-value { font-size:16px; color:#000; } table.tld-prices td strong.tld { margin:0; font-size:16px; color:#000; } #sidebar_accordion td.year { color:#3D3D3D; font-size:19px; } #sidebar_accordion td.price { font-size:22px; } #domain-sidebar strong { line-height:25px; } /*------------domain page 2---------------*/ #domain-search-area-frontpage{ float:left; width:1000px; height:auto; min-height:101px; overflow:hidden; margin:0 0 20px 0; padding: 0px; } #domain-search-area, #domain-search-area-4 { float:left; width:1000px; height:auto; min-height:101px; overflow:hidden; margin:0 0 20px -25px; padding: 0px; } #domain-search-form { float:left; width:460px; height:auto; min-height:101px; overflow:hidden; margin-left:80px; text-align:left; } #domain-search-form h3 { float:left; height:auto; min-height:30px; overflow:hidden; font-size:18px; font-weight:normal; line-height:24px; margin:0; padding:20px 0 0 0; } #domain-search-form div { float:left; width:460px; height:auto; min-height:40px; overflow:hidden; margin:0px; padding:0; } form, fieldset { margin:0; padding:0; outline:none; } input, select { outline:none; } #domain-search-form div form, #domain-banner-1 div form, .sidebar-domain-search div form{ height:38px; background:#bdbdbd; border:1px solid #fefefe; -moz-border-radius: 6px; -o-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; } #domain_sld { float:left; width:240px; height:auto; min-height:28px; overflow:hidden; margin:0px; padding:5px; font-size:20px; line-height:26px; font-family: Helvetica, Arial, sans-serif; font-style:italic; color:#434242; background:none; border:0px solid #FFF; border-right:1px solid #3a3a3a; display:block; } #domain_tld { float:left; width:97px; height:auto; min-height:36px; overflow:hidden; margin:0; padding:0px; background:none; font-family:Arial, Helvetica, sans-serif; font-size:20px; line-height:36px; border:0px solid #FFF; display:block; } .domain-search-button { float:right; width:82px; height:auto; min-height:36px; overflow:hidden; margin-right:2px; margin-top:1px; } #promo-tlds { float:right; width:360px; height:auto; min-height:101px; overflow:hidden; margin:0 100px 0 0; } #promo-tlds h3{ margin:20px 0 5px; padding:0 0 0 20px; font-size:20px; color:#000; } #promo-tlds p{ margin:0; padding:0 0 0 20px; color:#000; } #promo-tlds a{ } #tld-box { float:left; width:180px; height:auto; min-height:40px; overflow:hidden; margin: 7px 0 3px 0; padding:0px; } .tld { float:left; width:93px; height:auto; min-height:40px; overflow:hidden; padding-right:6px; font-size:16px; font-weight:bold; line-height:40px; text-align:right; color:#000; } .tld-price{ float:right; width:81px; height:auto; min-height:40px; overflow:hidden; margin:0; text-align:center; font-size:15px; font-weight:bold; } .tld-currency { font-size:16px; color:#fff; text-shadow: 0 1px #000; } .tld-price-value { font-size:16px; font-weight:bold; line-height:40px; color:#fff; text-shadow: 0 1px #000; } .tld-period { font-size:14px; color:#fff; text-shadow: 0 1px #000; } #domain_results_header { float:left; width:624px; height:auto; min-height:38px; overflow:hidden; margin:0; border:1px solid #640700; background-image: linear-gradient(bottom, #A6160C 0%, #CF3125 100%); background-image: -o-linear-gradient(bottom, #A6160C 0%, #CF3125 100%); background-image: -moz-linear-gradient(bottom, #A6160C 0%, #CF3125 100%); background-image: -webkit-linear-gradient(bottom, #A6160C 0%, #CF3125 100%); background-image: -ms-linear-gradient(bottom, #A6160C 0%, #CF3125 100%); background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0, #A6160C), color-stop(1, #CF3125) ); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#CF3125', EndColorStr='#A6160C'); /* IE6–IE9 */ color:#FFF; font-weight:bold; } #domain_results_header_left { float:left; width:426px; padding:10px 5px 10px 10px; border-right:1px solid #640700; } #domain_results_header_right { float:left; width:167px; padding:10px 5px 10px 10px; } table#domain_results_table{ margin:0; border:1px solid #D2D2D2; } #domain-tables { padding:7px 20px; } /* root element for domain-tabs */ ul.domain-tabs { list-style:none; margin:0 !important; padding:0; border-bottom:1px solid #CF3125; height:40px; } /* single tab */ ul.domain-tabs li { float:left; text-indent:0; padding:0; margin:0 !important; list-style-image:none !important; border-right:1px solid #FFF; } /* link inside the tab. uses a background image */ ul.domain-tabs a { background-image: linear-gradient(bottom, #BEBEBE 0%, #EEEEEE 100%) !important; background-image: -o-linear-gradient(bottom, #BEBEBE 0%, #EEEEEE 100%) !important; background-image: -moz-linear-gradient(bottom, #BEBEBE 0%, #EEEEEE 100%) !important; background-image: -webkit-linear-gradient(bottom, #BEBEBE 0%, #EEEEEE 100%) !important; background-image: -ms-linear-gradient(bottom, #BEBEBE 0%, #EEEEEE 100%) !important; background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0, #BEBEBE), color-stop(1, #EEEEEE) ) !important; filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#EEEEEE', EndColorStr='#BEBEBE') !important; /* IE6–IE9 */ font-size:16px; font-weight:bold; display:block; height: 40px; line-height:40px; width: 240px; text-align:center; text-decoration:none; color:#333 !important; padding:0px; margin:0px; position:relative; border-right:1px solid #B8B8B8; } ul.domain-tabs a:active { outline:none; } /* when mouse enters the tab move the background image */ ul.domain-tabs a:hover { background-image: linear-gradient(bottom, #A6160C 0%, #CF3125 100%) !important; background-image: -o-linear-gradient(bottom, #A6160C 0%, #CF3125 100%) !important; background-image: -moz-linear-gradient(bottom, #A6160C 0%, #CF3125 100%) !important; background-image: -webkit-linear-gradient(bottom, #A6160C 0%, #CF3125 100%) !important; background-image: -ms-linear-gradient(bottom, #A6160C 0%, #CF3125 100%) !important; background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0, #A6160C), color-stop(1, #CF3125) ) !important; filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#CF3125', EndColorStr='#A6160C') !important; /* IE6–IE9 */ color:#fff !important; top:1px; } /* active tab uses a class name "current". its highlight is also done by moving the background image. */ ul.domain-tabs .ui-tabs-active a, ul.domain-tabs .ui-tabs-active a:hover, ul.domain-tabs .ui-tabs-active a { background-image: linear-gradient(bottom, #A6160C 0%, #CF3125 100%) !important; background-image: -o-linear-gradient(bottom, #A6160C 0%, #CF3125 100%) !important; background-image: -moz-linear-gradient(bottom, #A6160C 0%, #CF3125 100%) !important; background-image: -webkit-linear-gradient(bottom, #A6160C 0%, #CF3125 100%) !important; background-image: -ms-linear-gradient(bottom, #A6160C 0%, #CF3125 100%) !important; background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0, #A6160C), color-stop(1, #CF3125) ) !important; filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#CF3125', EndColorStr='#A6160C') !important; /* IE6–IE9 */ cursor:default !important; color:#FFF !important; top:1px; } /* Different widths for domain-tabs: use a class name: w1, w2, w3 or w2 */ /* width 1 */ ul.domain-tabs a.s { background-position: -553px 0; width:81px; } ul.domain-tabs a.s:hover { background-position: -553px -31px; } ul.domain-tabs a.s.current { background-position: -553px -62px; } /* width 2 */ ul.domain-tabs a.l { background-position: -248px -0px; width:174px; } ul.domain-tabs a.l:hover { background-position: -248px -31px; } ul.domain-tabs a.l.current { background-position: -248px -62px; } /* width 3 */ ul.domain-tabs a.xl { background-position: 0 -0px; width:248px; } ul.domain-tabs a.xl:hover { background-position: 0 -31px; } ul.domain-tabs a.xl.current { background-position: 0 -62px; } /* initially all panes are hidden */ .panes .pane { display:none; } table.rp-tld-price{ border-right:1px solid #b5b5b5; } .rp-tld-price, .rp-tld-info{width:100%;border-collapse: collapse;} /* * Confirmed live on /order-domain/ (sidebar_accordion, appears on 27 * pages per the sitewide audit): this table's header row and first * column were both the old brick-red/dark-red gradient, and the * first-column link was bright yellow (#fff000) on top of that red — * the most saturated leftover vendor-theme coloring found on the whole * site. Flat teal instead, matching the rest of the redesign; kept * the gradient's dark variant for the hover-equivalent depth cue by * using --signal/--signal-ink as the two stops instead of red tones. */ .rp-tld-price th, .rp-tld-info th{ padding:6px 8px; text-align: center; font-size:14px; font-weight:bold; color:#fff; border-left:1px solid #003748; background:var(--signal); background-image:none; } .rp-tld-row-even{background:#dedede;} .rp-tld-price td, .rp-tld-info td{text-align:right;padding:6px 8px; border-left:1px solid #b5b5b5; border-bottom:1px solid #b5b5b5;} .rp-tld-price td.rp-tld-col-first, .rp-tld-info td.rp-tld-col-first{text-align:left; font-weight:bold; font-size:15px; color:#fff; background:var(--signal-ink); border-left:1px solid #003748;} .rp-tld-price td.rp-tld-col-first a, .rp-tld-info td.rp-tld-col-first a{color:#fff;} .rp-tld-price td.rp-tld-col-last, .rp-tld-info td.rp-tld-col-last{border-right:1px solid #b5b5b5;} /* * Removed: `.wrap{padding:1px;}` — present in the vendor theme's own original * source too, so not a copy error, but a naming collision: the vendor theme's * own main layout container was #wrapper_fixed, so .wrap was free for * some small internal use there. This theme independently chose .wrap * as its OWN main layout container's class, and since this file loads * after style.css, this rule was silently winning and collapsing the * main content area's and footer's horizontal padding to 1px on every * page that loads this stylesheet (most pages, since most use some * ResellersPanel shortcode) — confirmed live via computed styles. */ /* .content_domains #tld-tabs{list-style: none;padding:0;margin:0;} .content_domains #tld-tabs li{list-style: none;float:left;display:block;padding:0;margin:0 0 0 5px; -webkit-border-top-left-radius: 8px; -webkit-border-top-right-radius: 8px; -moz-border-radius-topleft: 8px; -moz-border-radius-topright: 8px; -o-border-radius-topleft: 8px; -o-border-radius-topright: 8px; border-top-left-radius: 8px; border-top-right-radius: 8px; } .content_domains #tld-tabs li a{display:block;outline:none; -webkit-border-top-left-radius: 8px; -webkit-border-top-right-radius: 8px; -moz-border-radius-topleft: 8px; -moz-border-radius-topright: 8px; -o-border-radius-topleft: 8px; -o-border-radius-topright: 8px; border-top-left-radius: 8px; border-top-right-radius: 8px; } .content_domains #tld-tabs li.active{ border-bottom:0; } .content_domains #tld-tabs li a{padding: 3px 10px; margin-top:2px;} .content_domains #tld-tabs li.active a{ border-bottom:0; margin-top:0; } */ /*****************************************/ /*** Plan Tables ***/ /*****************************************/ #rp_presentation{ border-style: none; width: 100%; table-layout:fixed; border-spacing:2px 0px; border-collapse: separate; } .rp_upgrades{ border:1px solid #717171; padding:1px; } #rp_presentation td{ vertical-align:middle; } #rp_presentation .rp_pr_plan_header td{ word-wrap: break-word; } .rp_pr_desc,.rp_pr_plan{ /*border-style: none;*/ } .rp_pr_plan{ /*border-left: 0px;*/ margin: 0; padding: 0 5px; text-align: center; } .rp_pr_plan.first-plan { } .plan-overview { margin-top:-20px; padding:0px 5px 10px; } .rp_pr_plan a:link{ } .rp_upgrades .rp_pr_plan{ /*border-left: 0;*/ padding-left: 1px; } .rp_upgrades .rp_pr_desc{ } .rp_pr_desc,.rp_pr_desc div{ text-align: left; margin: 0; padding:10px 0px 0px 10px; } .rp_pr_plan_header .rp_pr_plan{ height: 60px; vertical-align:middle; font-family: Helvetica, Arial, sans-serif; font-size: 20px; font-weight:bold; text-transform: capitalize; color:#FFF; text-shadow:0 1px 1px #000; background:#7db21e; border-top:1px solid #c8c8c8; border-left:1px solid #c8c8c8; border-right:1px solid #c8c8c8; border-top-left-radius:6px; border-top-right-radius:6px; } .content_web_hosting .rp_pr_plan.rp_pr_best{ width: 192px; } .rp_pr_plan_header .rp_pr_plan.rp_pr_best{ font-size: 30px; background:#cf3125; border-top-left-radius:6px; border-top-right-radius:6px; } .rp_pr_after_best { border-style: none; } .rp_pr_feature_header .rp_pr_desc,.rp_pr_feature_header .rp_pr_plan{ text-transform: uppercase; font-size:16px; line-height:30px; font-weight:Bold; padding-right:19px; color:#000; height: 40px; } .rp_upgrades .rp_pr_feature_header .rp_pr_desc{ background-image: none; color: #000000; font-size: 14px; font-weight:bold; background-image: linear-gradient(bottom, #BEBEBE 0%, #F2F2F2 100%); background-image: -o-linear-gradient(bottom, #BEBEBE 0%, #F2F2F2 100%); background-image: -moz-linear-gradient(bottom, #BEBEBE 0%, #F2F2F2 100%); background-image: -webkit-linear-gradient(bottom, #BEBEBE 0%, #F2F2F2 100%); background-image: -ms-linear-gradient(bottom, #BEBEBE 0%, #F2F2F2 100%); background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0, #BEBEBE), color-stop(1, #F2F2F2) ); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#F2F2F2', EndColorStr='#BEBEBE'); /* IE6–IE9 */ } .rp_upgrades .rp_pr_feature_header .rp_pr_plan, .rp_upgrades .rp_pr_feature_header .rp_pr_plan.rp_pr_after_best{ background-image: none; color: #000000; font-size: 14px; font-weight:bold; background-image: linear-gradient(bottom, #8BB935 0%, #A1D147 100%); background-image: -o-linear-gradient(bottom, #8BB935 0%, #A1D147 100%); background-image: -moz-linear-gradient(bottom, #8BB935 0%, #A1D147 100%); background-image: -webkit-linear-gradient(bottom, #8BB935 0%, #A1D147 100%); background-image: -ms-linear-gradient(bottom, #8BB935 0%, #A1D147 100%); background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0, #8BB935), color-stop(1, #A1D147) ); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#A1D147', EndColorStr='#8BB935'); /* IE6–IE9 */ } .rp_upgrades .rp_pr_feature_header .rp_pr_desc{ text-transform: uppercase; } .rp_pr_feature_header .rp_pr_plan.rp_pr_best{ height: 30px; padding-right:0px; background:#e8e8e8; border-left:1px solid #c8c8c8; border-right:1px solid #c8c8c8; } .rp_pr_feature_header .rp_pr_plan.rp_pr_after_best, .rp_pr_feature_header .rp_pr_plan{ height: 30px; padding-right:0px; background:#fff; border-left:1px solid #c8c8c8; border-right:1px solid #c8c8c8; } .rp_upgrades .rp_pr_feature_header .rp_pr_plan.rp_pr_best{ background-image: none; color:#fff; background-image: linear-gradient(bottom, #D84035 0%, #FC5C51 100%); background-image: -o-linear-gradient(bottom, #D84035 0%, #FC5C51 100%); background-image: -moz-linear-gradient(bottom, #D84035 0%, #FC5C51 100%); background-image: -webkit-linear-gradient(bottom, #D84035 0%, #FC5C51 100%); background-image: -ms-linear-gradient(bottom, #D84035 0%, #FC5C51 100%); background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0, #D84035), color-stop(1, #FC5C51) ); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#FC5C51', EndColorStr='#D84035'); /* IE6–IE9 */ } /* .rp_upgrades .rp_pr_feature_header .rp_pr_plan.rp_pr_after_best{ background-image: none; background-color: #C8C8C8; } */ .rp_pr_features .rp_pr_plan,.rp_pr_features .rp_pr_desc{ padding: 7px 0; } .rp_pr_features .rp_pr_desc{font-size: 14px;} .rp_pr_features.rp_pr_features_price .rp_pr_plan, .rp_pr_features.rp_pr_features_price .rp_pr_desc{ font-weight: bold; font-size: 16px; color: #000; } .rp_upgrades .rp_pr_features.rp_pr_features_price .rp_pr_desc{ border-right-style: none; } .rp_upgrades .rp_pr_signup .rp_pr_desc{ border-right-style: none; } .rp_pr_features.rp_pr_features_price .rp_pr_plan{ color:#000; background:#fff; border-left:1px solid #c8c8c8; border-right:1px solid #c8c8c8; font-weight: normal; } .rp_pr_plan{ color:#000; background:#fff; border-left:1px solid #c8c8c8; border-right:1px solid #c8c8c8; } .rp_upgrades .rp_pr_plan{ color:#000; background:#fff; border-left:1px solid #c8c8c8; border-right:1px solid #c8c8c8; } .rp_pr_features.rp_pr_features_price .rp_pr_plan span{ font-size: 20px; font-weight:bold; } .rp_pr_features .rp_pr_plan.rp_pr_best,.rp_pr_signup .rp_pr_plan.rp_pr_best{ background:#e8e8e8; border-left:1px solid #c8c8c8; border-right:1px solid #c8c8c8; } .rp_upgrades .rp_pr_features .rp_pr_plan.rp_pr_best, .rp_upgrades .rp_pr_signup .rp_pr_plan.rp_pr_best{ background:#e8e8e8; border-left:1px solid #c8c8c8; border-right:1px solid #c8c8c8; } .rp_upgrades .rp_pr_features .rp_pr_plan.rp_pr_best,.rp_upgrades .rp_pr_signup .rp_pr_plan.rp_pr_best{ background-image: none; } .rp_pr_features .rp_pr_desc{ color: #000; padding-right: 14px; width: 320px; } .rp_upgrades .rp_pr_features .rp_pr_desc{ padding-right: 13px; } .rp_pr_features .pr_rp_desc_info{ margin-left:-5px; padding: 0px 5px 0px 5px } .rp_pr_signup .rp_pr_plan{ padding: 5px 0 5px 0; } .rp_pr_signup .pr_rp_sing_up_form{ text-align: center; } /* .rp_pr_signup .pr_rp_sing_up_button{ font-size: 20px; font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; color: #fff; font-weight: bold; text-transform:lowercase; height: 35px; width: 136px; padding: 0 0 5px 0; text-align:center; margin: 0; border-style: none; cursor: pointer; text-shadow: 0 0 3px #000; } */ /**** OVERRIDE FOR ORDER BUTTTONS IN TABLES ****/ .rp_pr_signup .rpwp-button.colorize{display:inline;margin-bottom:5px;margin-top:5px; padding:0px 6px;} .rp_pr_signup .rp_pr_best .rpwp-button.colorize{font-size: 22px; padding:4px 10px;} .rp_upgrades .rp_pr_signup .rp_pr_best .rpwp-button.colorize{font-size: 18px;padding: 5px 5px;} /**** END OVERRIDE FOR ORDER BUTTTONS IN TABLES ****/ .rp_upgrades .rp_pr_end{display:none;} .rp_pr_end .rp_pr_plan{ height:7px; border-left: 0; background:#fff; border-left:1px solid #c8c8c8; border-right:1px solid #c8c8c8; border-bottom:1px solid #c8c8c8; border-bottom-left-radius:6px; border-bottom-right-radius:6px; } .rp_pr_end .rp_pr_plan.rp_pr_best{/*background: url("images/pr_footer_best.gif") no-repeat scroll 0 0;*/ background:#e8e8e8; border-left:1px solid #c8c8c8; border-right:1px solid #c8c8c8; border-bottom:1px solid #c8c8c8; border-bottom-left-radius:6px; border-bottom-right-radius:6px; } /**** POP-UP INFO BOX FOR THE FEATURES ****/ .rp_pr_features .rp_pr_desc div{position:relative} /* * Reported live (screenshot + screen recording) as a flash of ~100 * yellow tooltip boxes all visible at once on every page * load/refresh, before settling back to normal. Root cause: this * element has no hidden-by-default state in CSS at all — the only * thing that hides it is rp-widgets.js's jQuery(document).ready() * handler calling .hide() (confirmed live: current state is * correctly all-hidden, since that JS *does* run — it's just a race * every page load between first paint and jQuery finishing init). * display:none here means every tooltip is hidden from the very * first paint regardless of JS timing; jQuery's .show()/.hide() on * hover still work exactly the same (.show() sets an inline * display:block, .hide() reverts it), so the hover interaction itself * is unaffected. */ .pr_rp_desc_info_test{display:none;position:absolute;width: 200px;background-color: #FFFFD2; border: 1px solid #FDB179; /* Box Radius */ -moz-border-radius: 4px; /* Firefox */ -webkit-border-radius: 4px; /* Safari, Chrome */ -o-border-radius: 4px; /* Opera */ border-radius: 4px; /* CSS3 */ /* Box Shadow */ -moz-box-shadow: 0px 0px 5px #616161; /* FF3.5+ */ -webkit-box-shadow: 0px 0px 5px #616161; /* Saf3.0+, Chrome */ box-shadow: 0px 0px 5px #616161; /* Opera 10.5, IE9, Chrome 10+ */ padding: 0.5em;right: 0; top: 100%; z-index:1; font-size: 12px; } /**** END POP-UP INFO BOX FOR THE FEATURES ****/ /*****************************************/ /*** VPS Compare Plans ***/ /*****************************************/ #tower-box { float:left; min-width:181px; width:181px; margin-top:25px; position:relative; color:#000; background:#fff; border:1px solid #c8c8c8; /* Box Radius */ -moz-border-radius: 6px; /* Firefox */ -webkit-border-radius: 6px; /* Safari, Chrome */ -o-border-radius: 6px; /* Opera */ border-radius: 6px; /* CSS3 */ } #default_content.content_vps_openvz table{ float:left; width:100%; margin:10px 0; } #tower-box-title { width:100%; height:auto; padding:0px; position:relative; background:#7db21e; /* Box Radius */ -moz-border-top-left-radius: 5px; /* Firefox */ -webkit-border-top-left-radius: 5px; /* Safari, Chrome */ -o-border-top-left-radius: 5px; /* Opera */ border-top-left-radius: 5px; /* CSS3 */ -moz-border-top-right-radius: 5px; /* Firefox */ -webkit-border-top-right-radius: 5px; /* Safari, Chrome */ -o-border-top-right-radius: 5px; /* Opera */ border-top-right-radius: 5px; /* CSS3 */ } #tower-box-title h2 { margin:0px; padding:30px 10px 0px 10px; font-size:20px; font-weight:bold; color:#FFF; text-shadow:0 1px 1px #000; text-align:center; text-transform:uppercase; word-wrap: break-word; } #tower-box-content{ float:left; width:181px; margin:0px; border-top:1px solid #c8c8c8; } #tower-box-price { width:181px; text-align:center; padding-top:10px; } .tower-box-price-currency { font-size:18px; font-weight:bold; color:#000 } .tower-box-price-value { font-size:28px; font-weight:bold; color:#000; } .tower-box-price-period { font-size:18px; color:#000; } #tower-box-content ul{ padding:10px 0px 0px 0px; margin:0px; float:left; width:183px; height:auto; } #tower-box-content-2 ul { float:left; width:183px; padding:10px 0px 0px 0px; margin:0px; } #tower-box-content ul li, #tower-box-content-2 ul li { padding: 10px 0; margin:0px; list-style:none; line-height:normal; font-size:13px; text-align:center; } #tower-box-content ul li strong, #tower-box-content-2 ul li strong{ font-size:16px; } #tower-box-bottom { height:53px; padding: 17px 0px 0px 0px; text-align:center; width:183px; } .rp_pr_signup .rp_pr_plan .out-of-stock, .article1-plan-order .out-of-stock, #box-bottom .out-of-stock{ text-transform: uppercase; } .box-space-11px { width:11px; height:11px; } .tower-box-button { width:150px; margin:0px auto; } .best-plan { position:absolute; top:-34px; left:50px; width:83px; height:33px; z-index:1; } a.expand { float:left; height:auto; min-height:25px; overflow:hidden; width:50px; padding-left:20px; margin-left:55px; line-height:24px; background:url(images/plus.gif) left no-repeat; } a.collapse { float:left; height:auto; min-height:25px; overflow:hidden; width:50px; padding-left:20px; margin-left:55px; line-height:24px; background:url(images/minus.gif) left no-repeat; } a.expand_all { float:right; height:auto; min-height:25px; overflow:hidden; padding-left:20px; margin-right:0px; margin-bottom:0px; line-height:24px; background:url(images/plus.gif) left no-repeat; } a.collapse_all { float:right; height:auto; min-height:25px; overflow:hidden; padding-left:20px; margin-right:0px; margin-bottom:0px; line-height:24px; background:url(images/minus.gif) left no-repeat; } /*------- compare box ----------*/ #compare-box { float:left; width:183px !important; margin-top:25px; position:relative; background:#fff; border:1px solid #d7d7d7; /* Box Radius */ -moz-border-radius: 6px; /* Firefox */ -webkit-border-radius: 6px; /* Safari, Chrome */ -o-border-radius: 6px; /* Opera */ border-radius: 6px; /* CSS3 */ } #compare-box-title { padding:0px; height:56px; position:relative; } #compare-box-title h2 { font-size:20px; font-weight:bold; color:#000; margin:0px; padding:15px 10px 0px 10px; text-align:center; text-transform:uppercase; } #compare-box-text { width:173px; padding:10px 5px; text-align:center; line-height:20px; } #compare-box-content { text-align:center; } #compare-box-content ul { padding:10px 0px 0px 0px; margin:0px; float:left; width:183px; height:auto; min-height:250px; overflow:hidden; } #compare-box-content ul li { padding:0px; margin:0px; list-style:none; line-height:38px; } #compare-box-bottom { height:53px; padding: 17px 0px 0px 0px; text-align:center; width:183px; } .compare-box-button { width:160px; margin:0px auto; padding-left:5px; padding-right:5px; } /*****************************************/ /*** OpenVZ VPS plans ***/ /*****************************************/ .openvz-plan-even { float:left; width:97%; background:#e7e7e7; border:1px solid #f5f5f5; padding:10px; position:relative; } .openvz-plan-even:hover { background:#d6d6d6; } .openvz-plan-odd { float:left; width:97%; background:#c9c9c9; border:1px solid #f5f5f5; padding:10px; position:relative; } .openvz-plan-odd:hover { background:#bfbfbf; } .openvz-plan-name { font-size:24px; font-weight:bold; color:#840900; } .openvz-plan-features { line-height:26px; } .openvz-plan-price { font-size:24px; font-weight:bold; color:#840900; } .openvz-price-currency { font-size:18px; font-weight:bold; color:#840900; } .openvz-plan-price-mo { font-size:18px; font-weight:bold; color:#840900; } .openvz-info { padding:10px; } ul.openvz-server-info { float:left; width:290px; padding:0px; margin:0px 10px 0px 0px; } ul.openvz-server-info li { padding:0px 0px 0px 25px; margin:0px; list-style:none; line-height:28px; background-position: 0px 6px; } .openvz-plan-odd div.best-plan-openvz, .openvz-plan-even div.best-plan-openvz { position:absolute; width:126px; height:30px; top:86px; left:-5px; } .openvz-plan-odd.best, .openvz-plan-even.best { background:#a2deff; } /*****************************************/ /***New Content ***/ /*****************************************/ div.text-box.domain-box { float:left; width:650px; height:auto; margin-top:20px; padding:0; background:none; } div.text-box.domain-box div span { float:left; width:630px; margin:0 20px 0 0; padding:0px; line-height:26px; } div.text-box.domain-box div h3 { float:left; width:630px; margin:0 20px 0 0; padding:0px; font-size:18px; font-weight:bold; } div.text-box.without-img { float:left; width:50%; height:auto; margin-top:20px; padding:0; background:none; } div.text-box.without-img div span { float:left; width:90%; margin:0 10px; padding:0px; line-height:26px; } div.text-box.without-img div h3 { float:left; margin:0 10px; padding:0px; font-size:18px; font-weight:bold; } /*------------about us page 1---------------*/ #aboutus-content-main { float:left; width:630px; display:block; } #aboutus-content-main h2{ margin:20px 0 0 0; padding:0px; } #aboutus-content-main p{ margin:0px; padding:5px 0px 0px 0px; line-height:26px; } #aboutus-sidebar { float:right; width:260px; padding:0 10px; margin:15px -20px 0 0; display:block; line-height:26px; } #aboutus-sidebar h3 { font-size:24px; margin:0px; padding:0px 0px 10px 0px; } /*------------about us page 1---------------*/ /*------------contact us page 1---------------*/ .cform-input { width:280px; height:26px; border:1px solid #D0D0D0; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; padding:2px 5px; } .cform-select { width:295px; height:30px; line-height:30px; border:1px solid #D0D0D0; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; padding:2px; margin:0px; } .to-checkbox { font-size: 13px; display: inline-block; margin-left: 20px; } .error { border: 1px solid red; } input[type="checkbox"].error { box-shadow: 0 0 0 1px red; border-radius: 3px; } /*------------ article 1 pages ------------*/ .article1-container-area {} .article1-plans-area { display:block; float:left; width:288px; margin-left:10px; padding-top:6px; } .article1-text-area { display:block; float:right; width:620px; margin-right:10px; } .article1-plan-box { float:left; width:278px; margin:0 10px 10px 0; padding:0; text-align:center; position:relative; background:#fff; border:1px solid #c8c8c8; /* Box Radius */ -moz-border-radius: 6px; /* Firefox */ -webkit-border-radius: 6px; /* Safari, Chrome */ -o-border-radius: 6px; /* Opera */ border-radius: 6px; /* CSS3 */ } .article1-plan-title { float:left; width:278px; height:auto; min-height:40px; overflow:hidden; margin: 0; padding:0 0 10px 0; text-align:center; color:#fff; background:#7db21e; /* Box Radius */ -moz-border-top-left-radius: 6px; /* Firefox */ -moz-border-top-right-radius: 6px; /* Firefox */ -webkit-border-top-left-radius: 6px; /* Safari, Chrome */ -webkit-border-top-right-radius: 6px; /* Safari, Chrome */ -o-border-top-left-radius: 6px; /* Opera */ -o-border-top-right-radius: 6px; /* Opera */ border-top-left-radius: 6px; /* CSS3 */ border-top-right-radius: 6px; /* CSS3 */ } .article1-plan-title span { display:block; padding-top:15px; color:#fff; text-transform:uppercase; text-align:center; font-size:20px; } .article1-plan-features { padding:20px 10px 0; font-size:15px; text-align:center; line-height:34px; color:#000;} .article1-plan-features strong {font-size:17px;} .article1-plan-price { padding-top:12px; padding-bottom:12px; text-align:center; color:#000; } .article1-plan-price span { font-size: 26px;} .article1-plan-price span.currency {} .article1-plan-order { padding-top:10px; padding-bottom:30px; } .article1-plan-order input { display:block; width:134px; margin:auto; } .article1-plan-order .rpwp-button { margin: 0 auto; } .article-plan-best { background-color:#d0fb83; } .article-plan-best div.article1-plan-title { background-color:#cf3125; } /*------------ article 2 pages ------------*/ .article2-container-area {} .article2-links-area { display:block; float:left; width:202px; padding:6px 28px 0 0; margin-left:10px; min-height:448px; } .article2-links-area a.a-link { display:block; padding:5px 2px 5px 2px; border-bottom:1px solid #aaaaaa; } .article2-links-area a.a-link:hover, .article2-links-area a.a-link-selected { background:#e8e5e5; } .article2-text-area { display:block; float:right; width:690px; margin-right:10px; } .article2-text-plan-area { float:left; display:block; width:635px; margin-left:55px; } .article2-text-plan-area .article1-plan-box { display:block; width:278px; float:left; margin-right:20px; } /*------------ domain ads article pages ------------*/ .domain-promo { width:390px; height:205px; margin:0px auto; border:1px solid #E7E7E7; -moz-border-radius: 9px; /* Firefox */ -webkit-border-radius: 9px; /* Safari, Chrome */ -o-border-radius: 9px; /* Opera */ border-radius: 9px; /* CSS3 */ padding-left:210px; } .domain-promo h3 { text-transform:uppercase; font-size:22px; margin: 20px 0px 30px 0px; padding:0px; } .domain-promo div { border:1px solid #9A9A9A; -moz-border-radius: 5px; /* Firefox */ -webkit-border-radius: 5px; /* Safari, Chrome */ -o-border-radius: 5px; /* Opera */ border-radius: 5px; /* CSS3 */ height:37px; width:370px; } .domain-promo div input#domain_sld { width:255px; } .domain-promo div select#domain_tld { border-left:1px solid #B5B5B5; margin-top:1px; } .domain-promo input.domain-search-button { margin:20px 0px 0px 0px; float:right; } .domain-promo div.prices-starts-from { float:left; width:280px; height:auto; min-height:30px; overflow:hidden; font-size:16px; border:0px; margin-top:25px; font-style:italic; } .domain-promo span.tld-price { float:right; width:120px; height:auto; min-height:30px; overflow:hidden; margin:-7px 0 0 0px; padding:0; font-style:normal; background:none; } .domain-promo span.tld-price span.tld-currency { font-size: 20px; font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-weight:bold; color:#096784; } .domain-promo span.tld-price span.tld-price-value, .domain-promo span.tld-price span.tld-period { font-size: 24px; color:#096784; } /*------------end domain ads article pages ------------*/ /*------------sidebar domain search ------------*/ .sidebar-domain-search { height:165px; } .sidebar-domain-search h3 { font-size:24px; margin:0px; padding:0px 0px 0px 10px; } .sidebar-domain-search div { height:37px; margin-left:10px; margin-top:15px; width:265px; } .sidebar-domain-search #domain_sld { width:165px; height:auto; min-height:25px; overflow:hidden; line-height:26px; background:none; padding:3px 5px; font-family:Arial, Helvetica, sans-serif; font-size:15px; float:left; margin:2px 0px 0px 0px; display:block; } .sidebar-domain-search #domain_tld { float:left; height:auto; min-height:33px; overflow:hidden; line-height:27px; /*line-height:25px;# hack for Safari */ padding:3px 0px; width:85px; font-family:Arial, Helvetica, sans-serif; font-size:15px; margin:2px 0px 0px 0px; display:block; } .sidebar-domain-search .domain-search-button { margin-top:20px; height:auto; min-height:37px; overflow:hidden; widows:84px; float:right; /* Border Radius */ -moz-border-radius: 6px; /* Firefox */ -webkit-border-radius: 6px; /* Safari, Chrome */ -o-border-radius: 6px; /* Opera */ -ms-border-radius: 6px; /* Opera */ border-radius: 6px; /* CSS3 */ } .sidebar-domain-table { padding-top:2px; margin:0 0 20px 0px; text-align:center; line-height:normal; color:#000; background:#fff; border:1px solid #c8c8c8; /* Box Radius */ -moz-border-radius: 6px; /* Firefox */ -webkit-border-radius: 6px; /* Safari, Chrome */ -o-border-radius: 6px; /* Opera */ border-radius: 6px; /* CSS3 */ } .sidebar-domain-table table{ margin:-30px 0 0px 0px; } .sidebar-domain-table td { text-align:center; line-height:normal; padding:0px 5px; } .sidebar-domain-table td .tld { float:none; padding:0; font-size:12px; height:inherit; color:#000; } .sidebar-domain-table td .tld-price { float:none; padding:0; font-size:12px; color:#cf3125; background:none; } /*------------end sidebar domain search ------------*/ /*------------data centers ------------*/ #us-dc-banner { float:left; width:942px; height:auto; min-height:232px; overflow:hidden; margin: 0px 0 20px -7px; padding:25px 0px 0px 20px; font-size:16px; color:#fff; } #us-dc-banner h3{ margin:-10px 0 0 0; padding:0px; font-size:48px; } #us-dc-banner ul { padding:0px 0px 0px 20px; margin:15px 0px 0px 0px; } #us-dc-banner ul li { padding:2px 0; margin:0px; } #us-dc-banner a { color:#fff000; } #dc-box { float:left; width:462px; margin:0 5px; font-size:14px; background:#fff; border:1px solid #c8c8c8; /* Box Radius */ -moz-border-radius: 10px; /* Firefox */ -webkit-border-radius: 10px; /* Safari, Chrome */ -o-border-radius: 10px; /* Opera */ border-radius: 10px; /* CSS3 */ } /* * Reported via screenshot on /data-centers/: a large dead gap to the * right of the 2x2 grid of location cards, while #us-dc-banner right * above it correctly fills the full width — same "hardcoded width * doesn't match this theme's wider .page-body" bug found repeatedly * elsewhere this session, just on a component that hadn't been * checked yet. #dc-box has no wrapping container of its own (these 4 * divs float directly inside the shared .page-body, which every other * page also uses, so this can't just be turned into a grid/flex * container) — used calc(50% - 10px) instead of a fixed 462px so each * card claims half of whatever width its container actually has, * accounting for the existing margin:0 5px. Confirmed live: gap went * from 161px to 5px (just the box's own margin). The location photo * inside each card was also a fixed 445px via its own HTML width * attribute — same fix needed there so it scales up with the now- * wider card instead of leaving empty space beside it. */ #dc-box{ width:calc(50% - 10px); box-sizing:border-box; } #dc-box #box-content img{ width:100%; height:auto; } #dc-box #box-title { padding:0px 0px 0px 15px; } #dc-box #box-title h2{ margin-bottom:5px; color:#000; } #dc-box #box-content { width:436px; padding:13px; height:215px; } /* * The img-scaling fix above wasn't enough on its own: this immediate * parent has its own hardcoded width:436px/height:215px (vendor rule * right above), which kept clamping the image back down regardless of * the img's own width:100%. Two independently hardcoded widths on the * same component — override both to auto so the card can actually use * the wider space #dc-box now claims. Confirmed live: image grew from * 436px to ~514px, content height auto-adjusted to 233px, no overflow. */ #dc-box #box-content { width:auto; height:auto; } #dc-box #box-content { line-height:24px; } #dc-box #box-content div.cp-demo { line-height:24px; padding-right:110px; } #dc-box #box-content p { line-height:24px; } #dc-box #box-content ul { padding:0px; margin:0px; } #dc-box #box-content li { line-height:38px; font-size:14px; } #box-form .out-of-stock{ text-transform: uppercase; } #shared-box-medium #box-form .out-of-stock{ font-size: 20px; margin-top: 20px; } #shared-box-large #box-form .out-of-stock{ font-size: 25px; } .learn-more-link { float:right; width:160px; margin:10px 15px; font-weight:bold; text-align:right; } /*------------end data centers ------------*/ /*------------ data center pages ---------------*/ .dc-header-container {padding:0;} .dc-video-containter {float:left; width:385px; padding:25px 0 0 0; margin:0 0 0 20px;} .dc-image { float:right; width:366px; text-align:right; padding:12px 0 0 0;} .dc-image img { border:7px solid #aaaaaa; } .dc-information { float:left; width:540px; } .dc-information p { text-align:justify; line-height:24px;} .dc-bottom-line { margin:14px 0 0 0; padding:0; font-size:0; height:7px;} /*------------ data center page 2 ------------*/ .dc-banner { width:450px; height:340px; padding:5px 480px 0 20px; padding-left:20px; } .dc-banner p{ line-height:24px; } .us-dc { border:1px solid #c8c8c8; /* Box Radius */ -moz-border-radius: 10px; /* Firefox */ -webkit-border-radius: 10px; /* Safari, Chrome */ -o-border-radius: 10px; /* Opera */ border-radius: 10px; /* CSS3 */ } .se-dc { border:1px solid #c8c8c8; /* Box Radius */ -moz-border-radius: 10px; /* Firefox */ -webkit-border-radius: 10px; /* Safari, Chrome */ -o-border-radius: 10px; /* Opera */ border-radius: 10px; /* CSS3 */ } .au-dc { border:1px solid #c8c8c8; /* Box Radius */ -moz-border-radius: 10px; /* Firefox */ -webkit-border-radius: 10px; /* Safari, Chrome */ -o-border-radius: 10px; /* Opera */ border-radius: 10px; /* CSS3 */ } .uk-dc { border:1px solid #c8c8c8; /* Box Radius */ -moz-border-radius: 10px; /* Firefox */ -webkit-border-radius: 10px; /* Safari, Chrome */ -o-border-radius: 10px; /* Opera */ border-radius: 10px; /* CSS3 */ } /*---------DC Tabs------------*/ /* root element for dc-tabs */ #domain-tables.ui-tabs, #domain-tables.ui-widget-header, #domain-tables .ui-widget-header, #domain-tables .ui-widget-content #dc-plans.ui-tabs, #dc-plans.ui-widget-header, #dc-plans .ui-widget-header, #dc-plans.ui-widget-content { background: none; border: none; } #domain-tables .ui-tabs .ui-tabs-panel, #dc-plans .ui-tabs .ui-tabs-panel { display: block; border-width: inherit; padding: initial; background: none; } #domain-tables .ui-widget-content, #dc-plans.ui-widget-content { padding:0; } #dc-plans .ui-state-active, #dc-plans .ui-widget-content .ui-state-active, #dc-plans .ui-widget-header .ui-state-active { border: none; background: none; } ul.dc-tabs a:active, ul.dc-tabs a:visited { outline:none; } ul.dc-tabs .ui-tabs-active a, ul.dc-tabs .ui-tabs-active a:hover, ul.dc-tabs .ui-tabs-active a:focus, ul.domain-tabs .ui-tabs-active a, ul.domain-tabs .ui-tabs-active a:hover, ul.domain-tabs .ui-tabs-active a:focus { outline: none !important; border: none !important; } ul.domain-tabs li { border-top: none !important; border-bottom: : none !important; border-right: : none !important; background: none !important; } .domain-tabs .ui-state-active, .domain-tabs .ui-widget-content .ui-state-active, .domain-tabs .ui-widget-header .ui-state-active, .domain-tabs .ui-state-default, .domain-tabs .ui-widget-content .ui-state-default, .domain-tabs .ui-widget-header .ui-state-default { border: none !important; background: none !important; } #domain-tables { padding: 0px; overflow: hidden; }.dc-tabs.ui-tabs-nav li a { padding: 0 !important; font-size: 13px; } #dc-plans #tower-box { margin-left: 1px; margin-right: 1px; } ul.domain-tabs, ul.dc-tabs { padding:0 !important; } ul.dc-tabs a, .rp-tld-price td, .rp-tld-info td { font-size:13px; } .rp-tld-price th, .rp-tld-info th, .rp-tld-price td.rp-tld-col-first, .rp-tld-info td.rp-tld-col-first { font-size:12px !important; } #promo-tlds .tld { font-size: 15px !important; } ul.dc-tabs { list-style:none; margin:0 !important; padding:0; height:40px; border-bottom:3px solid #202020; } /* single tab */ ul.dc-tabs li { float:left; text-indent:0; padding:0; margin:0 !important; list-style-image:none !important; border-right:1px solid #FFF; } /* link inside the tab. uses a background image */ ul.dc-tabs a { font-size:16px; font-weight:bold; display:block; height: 40px; line-height:40px; width: 180px; text-align:center; text-decoration:none; padding:0px; margin:0px; position:relative; background-image: linear-gradient(bottom, #BEBEBE 0%, #EEEEEE 100%) !important; background-image: -o-linear-gradient(bottom, #BEBEBE 0%, #EEEEEE 100%) !important; background-image: -moz-linear-gradient(bottom, #BEBEBE 0%, #EEEEEE 100%) !important; background-image: -webkit-linear-gradient(bottom, #BEBEBE 0%, #EEEEEE 100%) !important; background-image: -ms-linear-gradient(bottom, #BEBEBE 0%, #EEEEEE 100%) !important; background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0, #BEBEBE), color-stop(1, #EEEEEE) ) !important; filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#EEEEEE', EndColorStr='#BEBEBE') !important; /* IE6–IE9 */ color:#333 !important; border-right:1px solid #B8B8B8; } ul.dc-tabs a:active { outline:none; } /* when mouse enters the tab move the background image */ ul.dc-tabs a:hover { top:1px; background-image: linear-gradient(bottom, #A6160C 0%, #CF3125 100%) !important; background-image: -o-linear-gradient(bottom, #A6160C 0%, #CF3125 100%) !important; background-image: -moz-linear-gradient(bottom, #A6160C 0%, #CF3125 100%) !important; background-image: -webkit-linear-gradient(bottom, #A6160C 0%, #CF3125 100%) !important; background-image: -ms-linear-gradient(bottom, #A6160C 0%, #CF3125 100%) !important; background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0, #A6160C), color-stop(1, #CF3125) ) !important; filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#CF3125', EndColorStr='#A6160C') !important; /* IE6–IE9 */ color:#fff !important; } /* active tab uses a class name "current". its highlight is also done by moving the background image. */ ul.dc-tabs .ui-tabs-active a, ul.dc-tabs .ui-tabs-active a:hover, ul.dc-tabs .ui-tabs-active a { cursor:default !important; top:1px; background-image: linear-gradient(bottom, #A6160C 0%, #CF3125 100%) !important; background-image: -o-linear-gradient(bottom, #A6160C 0%, #CF3125 100%) !important; background-image: -moz-linear-gradient(bottom, #A6160C 0%, #CF3125 100%) !important; background-image: -webkit-linear-gradient(bottom, #A6160C 0%, #CF3125 100%) !important; background-image: -ms-linear-gradient(bottom, #A6160C 0%, #CF3125 100%) !important; background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0, #A6160C), color-stop(1, #CF3125) ) !important; filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#CF3125', EndColorStr='#A6160C') !important; /* IE6–IE9 */ cursor:default !important; color:#FFF !important; border-right:1px solid #470106; border-left:1px solid #470106; border-top:1px solid #470106; } /* Different widths for domain-tabs: use a class name: w1, w2, w3 or w2 */ /* width 1 */ ul.dc-tabs a.s { background-position: -553px 0; width:81px; } ul.dc-tabs a.s:hover { background-position: -553px -31px; } ul.dc-tabs a.s.current { background-position: -553px -62px; } /* width 2 */ ul.dc-tabs a.l { background-position: -248px -0px; width:174px; } ul.dc-tabs a.l:hover { background-position: -248px -31px; } ul.dc-tabs a.l.current { background-position: -248px -62px; } /* width 3 */ ul.dc-tabs a.xl { background-position: 0 -0px; width:248px; } ul.dc-tabs a.xl:hover { background-position: 0 -31px; } ul.dc-tabs a.xl.current { background-position: 0 -62px; } /* initially all panes are hidden */ .panes .pane { display:none; } /*---------end DC Tabs------------*/ #dc-plans { padding:7px; } /*--------- Customer Support ------------*/ #cs_context_help_areas { padding-left:110px; background-position:0px 9px; margin-bottom:30px; line-height:26px; } #cs_video_tutorials { padding-left:110px; background-position:0px 9px; margin-bottom:30px; line-height:26px; } #cs_faq { padding-left:110px; background-position:0px 9px; margin-bottom:30px; line-height:26px; } #cs_ticketing_system { padding-left:110px; background-position:0px 9px; margin-bottom:30px; line-height:26px; } /*------------ 1 app installer ---------------*/ .app-preview-left { width:460px; float:left; } .app-text-right { float:right; width:460px; } .app-text-right p { text-align:justify; } .app-text-right p.tar { text-align:right; } .app-text-right h3 { font-size:24px; padding:0; margin:0; } .app-preview-right { width:460px; float:right; } .app-text-left { float:left; width:460px; } .app-text-left p { text-align:justify; } .app-text-left p.tar { text-align:right; } .app-text-left h3 { font-size:24px; padding:0; margin:0; } /*------------ 1 app installer boxes ---------------*/ .app-box-item { display:block; float:left; height:auto; min-height:390px; overflow:hidden; width:176px; margin:-20px 0 20px 0; padding:0 19px 0 19px; } .app-box-item h3 { margin:16px auto 16px auto; padding:0; font-size:24px; text-align:center;} .app-box-item p.app-box-text { display:block; height:124px; overflow:hidden; margin:12px 0 12px 0; padding:0; } .app-box-demo-signup { text-align:center; border-top:1px solid #d7d7d7; padding-top:12px; } .app-box-divider {display:block; float:left; width:30px; height:auto; min-height:10px; overflow:hidden;} /*------------ why us page 2 ------------*/ .why-us-2 { float:left; width:424px; height:auto; min-height:310px; overflow:hidden; padding: 10px 14px; margin:0 10px; margin-bottom:20px; display: block; line-height:26px; background: #F5F5F5; border: 1px solid #DDDDDD; border-radius: 7px; -moz-border-radius: 7px; /* Firefox */ -webkit-border-radius: 7px; /* Safari, Chrome */ -o-border-radius: 7px; /* Opera */ } .why-us-2 h3 { font-size:24px; margin:0 0 15px 0; padding:0; } .why-us-2 img { margin-right:10px; margin-bottom:140px; } /*------------ hepsia features ---------------*/ .hepsia-feature {} .hepsia-feature h4 { font-size:24px; font-weight:bold; margin:0 0 16px 0; padding:0;} .hepsia-feature p { margin:0; padding:0; } .hepsia-feature img { border:5px solid #c8c8c8; float:right; margin:8px 0 0 40px;} /*------------ hepsia vs cpanel page ------------*/ .compare-panels { width:440px; margin-left:20px; display: block; margin: 0px 0px 20px 0px; padding: 10px 14px; min-height:130px; height:auto !important; height:130px; margin-bottom:0px; line-height:24px; } .compare-panels h3 { font-size:24px; margin-bottom:15px; } .compare-panels.left img { margin:0px 0px 0px 10px; } .compare-panels.right img { margin:0px 10px 0px 0px; } /*------------ order form ---------------*/ /* Interaction states ----------------------------------*/ .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default { border: 1px solid #A5A5A5; background:#D7D7D7; font-weight: normal; color: #000; } /* Component containers ----------------------------------*/ .ui-widget-header { border: 1px solid #2d8caa; background: #46a6c4; color: #FFF; font-weight: bold; line-height:15px; } .ui-widget-header a { color: #FFF; } .ui-widget-header span a:link { color: #000; } .ui-widget-header.header { color:#000; } #all_pm { height:90px; } #PayPalDP label { height:75px; overflow:visible; padding-top:15px; } #submit_order .ui-button { font-size: 22px; padding:6px 15px 9px; border:0px; color:#FFF; background:#096784; font-weight:bold; } #submit_order .ui-button:hover { font-size: 22px; padding:6px 15px 9px; text-decoration: none; border:0px; color:#FFF; background:#044356; font-weight:bold; } /*------------ shared box articles ---------------*/ #shared-box { float:right; width:300px; height:auto; min-height:377px; overflow:hidden; margin:0 0px 10px 25px; padding:0; text-align:center; position:relative; } #shared-box #box-title { float:left; width:300px; height:auto; min-height:40px; overflow:hidden; /* Confirmed live via getBoundingClientRect() on /hosting-articles/best-web-hosting/: #box-price is position:absolute (top:60px, ~61px own height, so its bottom edge lands around y=114), while #box-content flows normally right after this title — 52px own height + the 50px bottom margin this rule had put content's top at y=102, 2px into the price's own bottom edge, just enough for the price and the first spec line to visibly touch. Bumped the margin to clear it with a small buffer instead. */ margin:0px 0 65px 0; padding:0; text-align:center; } #box-title h2{ height:40px; margin-top:0; padding-top:0; font-size:24px; line-height:40px; font-weight:bold; color:#FFF; } #shared-box form{ float:left; margin:0 84px; } #shared-box form .rpwp-button.colorize{display:inline; padding:5px 20px;} /* * #shared-box's entire visual shape (flat-top rectangle + rounded * semicircle bottom, thin border) came from a background PNG * (shared-box-small-1.png) rather than CSS — confirmed live via * getComputedStyle, and the image itself had an old vendor-theme green * header band, same pattern as #tower-box-title before its redesign. * Regenerated that image in teal instead (see * images/make_shared_box_bg.py) rather than rebuilding this box's * absolute-positioned layout in CSS from scratch. Just the button and * link color needed fixing here — still the old red. */ #shared-box .rpwp-button.colorize{ box-sizing:border-box; background:var(--signal); background-image:none !important; border:0; border-radius:var(--radius-sm); text-shadow:none; text-transform:none; font-family:var(--font-body); filter:none; } #shared-box .rpwp-button.colorize:hover{ background:var(--signal-ink); background-image:none !important; filter:none; } #shared-box #box-price { width:298px; margin:0; text-align:center; padding:0; color:#fff; position:absolute; top:60px; left:0; } #shared-box #box-price .box-price-value { font-size:36px; font-weight:bold; color:#000; } #shared-box #box-price .box-price-currency { padding-right:4px; font-size:24px; color:#000; } #shared-box #box-price .box-price-period { font-size:24px; color:#000; } #shared-box #box-content{ border:none; } #shared-box #box-content ul{ float:left; width:268px; margin:10px 0; padding:0 15px; } .plan-details-link { float:left; width:298px; margin:5px 0; text-align:center; } .plan-details-link a{ color:var(--signal-ink); } /*****************************************/ /*** Front Page Content ***/ /*****************************************/ #home-banner-1 { float:left; width:1000px; height:auto; min-height:375px; overflow:hidden; margin:0px; } h2.home-banner-title-1 { width:875px; font-size: 48px; margin:5px 0 25px 100px; padding:0; font-weight:bold; color:#FFF; text-shadow: 0 4px 3px #000; } /*----- banner features ------*/ #home-banner-1-plan-features { float:left; width:700px; margin-left:100px; } #home-banner-1-plan-features ul { float:left; padding:0px; margin:0px 0px 0px 25px; } #home-banner-1-plan-features ul li { padding-left:30px; font-size:16px; line-height:36px; list-style:none; color:#FFF; text-shadow:0px 0px 5px #000; } #home-banner-1-plan-features ul li span{ font-size:20px; font-weight:bold; line-height:36px; list-style:none; color:#FFF; text-shadow:0px 0px 5px #000; } /*----- banner price ------*/ .home-banner-1-price { float:left; width:450px; height:auto; min-height:80px; overflow:hidden; margin:10px 0 0 100px; padding:0px; font-family: 'Anton', Helvetica, Arial, sans-serif; color: #FFF; text-align:center; -moz-text-shadow: 0px 2px 4px #000; -webkit-text-shadow: 1px 2px 4px #000; text-shadow: 0px 2px 4px #000; position: relative; } .home-banner-1-price .price-value { float:left; height:auto; min-height:80px; overflow:hidden; font-size:72px; line-height:80px; } .home-banner-1-price .currency { float:left; height:auto; min-height:70px; overflow:hidden; margin-left:95px; padding-right:6px; padding-top:10px; font-size:48px; } .home-banner-1-price .period { float:left; height:auto; min-height:26px; overflow:hidden; padding-top:24px; padding-left:6px; font-family: Helvetica, Arial, sans-serif; font-size:20px; line-height:24px; text-align:center; text-transform:uppercase; } /*----- video button ------*/ .home-banner-1-buttons { float:left; width:450px; margin:15px 0 0 100px; } .home-banner-1-buttons.free-trial{ margin-top: 0; } .home-banner-1-buttons.free-trial p{ color: #CEEEFF; text-align: center; margin-top: 10px; } .home-banner-play-video { float:left; width:150px; height:auto; min-height:46px; overflow:hidden; margin:0px 20px 0px 54px; text-align:center; } .home-banner-play-video a{ font-family: Arial, Helvetica, sans-serif; font-size:20px; line-height:46px; font-weight:bold; text-decoration:none; display:block; color:#fff; text-shadow:0 1px #000; } .home-banner-play-video a:hover{ color:#4cbef9; text-shadow:0 1px #000; } .home-banner-1-buttons .outofstock{ display: inline-block; } .home-banner-1-buttons .checkstock{ line-height: 40px; color: #fff; } .home-banner-1-buttons .out-of-stock{ line-height: 40px; text-transform: uppercase; display: inline-block; font-size: 17px; } /*----- order button ------*/ .home-banner-sign-up { float:left; width:195px; height:auto; min-height:46px; overflow:hidden; margin:0px; padding:0 0 0 10px; text-align:left; } .home-banner-sign-up .rpwp-button2{ width:206px; font-family: Arial, Helvetica, sans-serif; font-size:18px; line-height:46px; font-weight:bold; text-align:left; text-decoration:none; display:block; color:#fff; text-shadow:0 1px #000; background:none; background-image:none; border:none; box-shadow:none; padding:0; margin:0; } .home-banner-sign-up .rpwp-button2:hover{ color:#fffc00; text-shadow:0 1px #000; } /*----- text titles ------*/ #front_page_content-titles { float:left; width:1000px; height:auto; min-height:170px; overflow:hidden; margin:20px 0 0 0; padding:0; font-size:24px; line-height:30px; text-align:center; color:#606060; } #front_page_content-titles h3{ font-size:60px; font-weight:bold; line-height:70px; margin:0; padding:0; color:#000; } #front_page_content-titles h3 span{ font-weight:normal; } /*----- plans ------*/ #front_page_content-plan-area{ float:left; width:1000px; height:auto; min-height:377px; overflow:hidden; margin: 0 0 20px 0; padding:0; } #shared-box-small { float:left; width:300px; height:auto; min-height:377px; overflow:hidden; margin:0 0 0 25px; padding:0; text-align:center; } #shared-box-small:nth-child(1):nth-last-child(2){ margin-left:17%; } #shared-box-small:nth-child(2):nth-last-child(1){ margin-right:17%; } #shared-box-medium { float:left; width:462px; height:auto; min-height:377px; overflow:hidden; margin:0 0 0 25px; padding:0; text-align:center; } #shared-box-large { float:left; width:950px; height:auto; min-height:377px; overflow:hidden; margin:0 25px; padding:0; text-align:center; } #shared-box-small #box-title { float:left; width:300px; height:auto; min-height:40px; overflow:hidden; margin:0px; padding:0; text-align:center; } #shared-box-medium #box-title { float:left; width:462px; height:auto; min-height:40px; overflow:hidden; margin:0px; padding:0; text-align:center; } #shared-box-large #box-title { float:left; width:950px; height:auto; min-height:40px; overflow:hidden; margin:0px; padding:0; text-align:center; } #box-title h4{ height:40px; margin-top:0; padding-top:0; font-size:24px; line-height:40px; font-weight:bold; } #box-title h4 a{ color:#FFF; text-shadow:0 1px 1px #000; text-decoration:none; } #box-title h4 a:hover{ color:#fff000; text-decoration:none; } #shared-box-small form{ margin:0px auto; } #shared-box-small form{ margin:0px auto; } #shared-box-small form{ margin:0px auto; } /**** OVERRIDE FOR ORDER BUTTTONS IN TABLES ****/ #shared-box-medium form .rpwp-button.colorize{display:inline; font-size:20px; padding:10px 40px;} #shared-box-large form .rpwp-button.colorize{display:inline; font-size:20px; padding:10px 40px;} #shared-box-medium #box-form .out-of-stock, #shared-box-large #box-form .out-of-stock{display:block; padding:10px 40px; margin-bottom: 20px;} /**** END OVERRIDE FOR ORDER BUTTTONS IN TABLES ****/ /* box price */ #shared-box-small #box-price { float:left; width:300px; margin:10px 0 0 0; text-align:center; padding:0; color:#000; } #shared-box-medium #box-price { float:left; width:462px; margin:10px 0 0 0; text-align:center; padding:0; color:#000; } #shared-box-large #box-price { float:left; width:950px; margin:10px 0 0 0; text-align:center; padding:0; color:#000; } #box-price .box-price-value { font-size:56px; font-weight:bold; color:#000; } #box-price .box-price-currency { padding-right:4px; font-size:28px; color:#000; } #box-price .box-price-period { font-size:28px; color:#000; } #box-content { float:left; width:100%; margin-bottom:20px; border-top:1px solid #c8c8c8; border-bottom:1px solid #c8c8c8; } #box-content ul{ float:left; margin:10px 0; padding:0 15px; text-align:left; } #shared-box-small #box-content ul{ width:270px; } #shared-box-medium #box-content ul{ width:201px; } #shared-box-large #box-content ul{ width:286px; } #box-content ul li{ margin:0px; padding:6px 0px 6px 15px; list-style:none; font-size:15px; line-height:normal; color:#595959; } #box-content ul li strong{ font-weight:bold; color:#000; } #shared-box-medium #box-content ul li { font-size: 13px; } /*----- welcome text, other services and testimonials ------*/ #quote_wrap { overflow: hidden; } #front_page_content-main { float:left; width:1000px; min-height:275px; margin:0 0 20px 0; padding:0; } #home-main-text, #other-services, #hosting-features { float:left; width:300px; margin-left:25px; padding:0; } #front_page_content-main h2{ font-size:18px; font-weight:bold; color:#000; } #home-main-text{ line-height:18px; } #other-services ul { list-style:none; padding:0; margin:0; } #other-services ul li { padding:6px 0; margin:0 ; font-size:15px; font-weight:bold; list-style-image:none; color: #c42c20; } #other-services ul li a{ color: #000; text-decoration:underline; } #other-services ul li a:hover{ color: #096784; text-decoration:none; } #hosting-features ul { list-style:none; padding:0; margin:0; } #hosting-features ul li { padding:6px 0; margin:0 ; font-size:15px; font-weight:bold; list-style-image:none; color: #000; } /*****************************************/ /*** Blog Content ***/ /*****************************************/ #category_content { padding: 20px 9px 50px; } #category_content-main { float:left; width:650px; line-height: 24px; } #category_content-main p{ line-height:24px; } #category_content-main h1 { margin-top:-76px; margin-left:25px; font-size: 30px; font-weight:bold; color:#fff; text-shadow: 0 4px 3px #000; } body.single #category_content-main h1 { margin-top:0px; margin-left:0px; font-size: 30px; font-weight:bold; color:#273948; text-shadow: none; line-height:34px; } #category_content-main h2 { font-size:29px; line-height:31px; color:#000; margin:0px; padding:0px; } #category_content-main h2 a { color:#b31308; } /* ----------Comments ---------*/ #comments { padding:0px 10px 0px 10px; } #comments h3 { font-family: 'Open Sans Condensed', sans-serif; font-size:24px; } li.comment { border:1px solid #E5E5E5; margin-top:20px; padding:10px; } .comment-meta { color:#9A9A9A; background-position:130px 0px; padding-left:150px; margin-bottom:10px; } .comment.depth-2 { margin-top:10px; } .thread-even { background:#FFF; } .even.depth-2, .even.depth-3, .even.depth-4 { background:#F0F0F0; } .odd.depth-2, .odd.depth-3, .odd.depth-4 { background:#FFF; } .thread-odd { background:#F9F9F9; } div.comment-content { word-wrap:break-word; padding-left:130px; } #category_content-main div.comment-content p { line-height:22px; } li.comment.depth-2, li.comment.depth-3, li.comment.depth-4 { border-left: 3px solid #333; list-style:none; } .comment-reply-link { text-align:right; font-weight:bold; clear:both; } .comment-author { width:110px; float:left; margin-right:20px; } img.avatar { margin-bottom:10px; border:3px solid #A0A0A4; display:block; } div#respond{ margin-top:40px; } .form-section { margin-bottom:10px; } .form-label { float:left; width:100px; } .required { color:#F00; } /* Search form */ form#searchform div{ height:38px; margin-bottom:25px; border:1px solid #adadad; -moz-border-radius: 5px; -o-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; background-image: linear-gradient(bottom, #e9e8e8 0%, #ffffff 100%); background-image: -o-linear-gradient(bottom, #e9e8e8 0%, #ffffff 100%); background-image: -moz-linear-gradient(bottom, #e9e8e8 0%, #ffffff 100%); background-image: -webkit-linear-gradient(bottom, #e9e8e8 0%, #ffffff 100%); background-image: -ms-linear-gradient(bottom, #e9e8e8 0%, #ffffff 100%); background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0, #e9e8e8), color-stop(1, #ffffff) ); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#ffffff', EndColorStr='#e9e8e8'); /* IE6–IE9 */ } form#searchform div label.screen-reader-text { float:left; margin:0px; padding:5px; font-size:14px; line-height:28px; font-style:italic; color:#000; background:none; border:none; display:block; } form#searchform div input#s { float:left; width:120px; height:auto; min-height:20px; overflow:hidden; margin:8px 0; padding:0px 3px; background:none; font-size:16px; line-height:20px; color:#000; background:#eae9e9; border:1px solid #adadad; display:block; } form#searchform div input#searchsubmit { float:right; width:60px; height:auto; min-height:36px; overflow:hidden; margin-right:2px; margin-top:1px; border: none; color:#fff; -moz-border-radius: 4px; -o-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; background-image: linear-gradient(bottom, #262626 0%, #676767 100%); background-image: -o-linear-gradient(bottom, #262626 0%, #676767 100%); background-image: -moz-linear-gradient(bottom, #262626 0%, #676767 100%); background-image: -webkit-linear-gradient(bottom, #262626 0%, #676767 100%); background-image: -ms-linear-gradient(bottom, #262626 0%, #676767 100%); background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0, #262626), color-stop(1, #676767) ); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#676767', EndColorStr='#262626'); /* IE6–IE9 */ } /*------- sidebars ----------*/ #sidebar { width:280px; float:right; padding:10px 10px; display:block; } #sidebar ul { padding:0px; margin:0px; } #sidebar ul li { list-style:none; padding:0px; margin:0px; } #sidebar ul li h2{ padding:0px; margin:0px 0px 10px 0px; line-height:38px; } #sidebar ul li ul { padding:0px; margin:0px 0px 20px 20px; } #sidebar ul li ul li { list-style: circle; padding:5px 0px; margin:0px; } /*-----Customizing the Time and Date------*/ .date-formating { float:left; width:60px; background:#7db21e; text-align:center; padding-top:5px; } .month { text-transform:uppercase; font-weight:bold; color:#000; } .day { text-transform:uppercase; font-weight:bold; font-size:23px; color:#000; } .year { font-size:11px; } .time { font-size:12px; padding:3px 0px; color:#fff; background:#345002; } .cat-excerpt { float:left; width:550px; margin-left:10px; line-height:18px; } /*--------Terms Page------------*/ .terms-left-col { float:left; width:475px; margin-top:10px; } .terms-left-col h2 { margin:0px; padding:0px; } /*--------Terms Page------------*/ /*-------- OVERLAYS ------------*/ .video_overlay { display:block; width:640px; height:360px; } /*-------- END OVERLAYS --------*/ /*-----script banner------*/ #script-banner { float:left; width:950px; height:auto; min-height:320px; overflow:hidden; position:relative; margin: 0 0 30px -15px; padding:10px 14px 0px 14px; } #script-banner h1, h3.script-banner-title { font-size:30px; width:500px; margin:0px; padding:5px 0px 0px 15px; font-weight:bold; color:#fff; } #script-banner-plan-features { float:left; width:550px; } #script-banner-plan-features ul { padding:0px; margin:28px 0px 0px 20px; float:left; } #script-banner-plan-features ul li { font-size:17px; line-height:34px; list-style:none; padding-left:25px; color:#fff; } /*----- banner price ------*/ .script-banner-price { float:right; margin-top:0px; margin-right:30px; text-align:center; position:absolute; top:110px; right:400px; color:#fff; } .script-banner-price .price-value { font-size:55px; margin:0px; padding:0px; color:#fff; } .script-banner-price .currency { font-size:42px; font-weight:bold; color:#fff; } .script-banner-price .period { font-size:24px; color:#fff; } #script-banner-plan-features .rpwp-button { font-size:26px; } /*-----script banner price ------*/ #script-banner-img { float:right; margin:-9px 0px 0px 0px; } /*--------end script banner ---------*/ /* * Modernizing this banner's own typography/button now that its shared * background isn't the old muddy texture anymore (see the * #domain-only-banner/#script-banner background rule above) — the red * gradient "order now" button was the last visibly off-brand piece, * confirmed via screenshot on the SSL certificates page. */ #script-banner{ border-radius:var(--radius); } /* * The banner's fixed 950px width (above) was tuned for the vendor theme's own * narrower page container. This theme's .page-body is wider (confirmed * live: 1104px), so #script-banner left a ~140px dead gap on the * right — reported via screenshot on five pages at once (SSL, * WordPress/PrestaShop/OpenCart/Joomla/Drupal hosting all share this * one component). Switched the container to width:100% + flexbox * (justify-content:space-between) so #script-banner-img sits flush * against the actual right edge regardless of container width, instead * of stopping wherever a hardcoded 950px happened to end. * * .script-banner-price stays put visually — it was positioned * `right:400px` relative to the OLD 950px outer box, which not * coincidentally put its right edge exactly at x=550, the boundary of * the 550px-wide #script-banner-plan-features block. Repositioning it * relative to that block instead (position:relative added there, * right:0 here) reproduces the exact same spot but anchored to a box * whose width never changes, so it can't drift if the outer container * ever changes size again. */ #script-banner{ width:100%; margin:0 0 30px 0; box-sizing:border-box; display:flex; align-items:center; justify-content:space-between; } /* * Two regressions chased from the width fix above before landing on * this: (1) the "order now" button rendering as a sliver at the * bottom of the banner (reported on /wordpress-web-hosting/), then * (2) after pinning the text block to the top to fix that, the text * block and #script-banner-img no longer looked aligned with each * other — text glued to the top, image centered (reported on * /drupal-hosting/, "not properly inline with the left section and * right image section"). * * Both traced to the same root cause: .script-banner-price is * position:absolute, so it's excluded from #script-banner-plan- * features' own height for layout purposes — the browser only counts * the title + list when sizing that box, even though the price+button * visibly extend further down via absolute positioning. Any * align-items value applied to that undersized box (center, flex- * start, whatever) was always going to either clip the button or * visibly disagree with #script-banner-img's alignment, because the * box's "real" height never matched its visible content. * * Fixed at the actual source instead of working around it further: * .script-banner-price no longer uses position:absolute at all — it's * a normal flex item now, so its height is real and #script-banner- * plan-features can size correctly. #script-banner-plan-features * itself became a small flex-wrap layout (title forced to its own * full-width row via flex-basis:100%, then