/* Parscale Media Style Sheet ----------------------------------------------------------------------------- Prototype Version: 2.21 Developer: Parscale Media Email Address: info@parscale.com Developer Website: http://www.parscale.com/ Client Website: http://www.fastserv.com Last Modifier: Brad Parscale - Parscale Media Last Modified: Sat 12.23.09 @ 1:28pm */ /* Table of Contents ----------------------------------------------------------------------------- 1. Clean Base 2. Base Typography 3. Images 4. Links 5. Forms 6. Tables 7. Framework */ /* 1. Create a Clean Base ------------------------------------------------------------------------------*/ html, body, br, hr, div, span, a, object, iframe, ul, ol, dl, li, dt, dd, h1, h2, h3, h4, h5, h6, p, blockquote, q, address, small, big, cite, dfn, ins, del, i, em, b, strong, sup, sub, strike, pre, code, samp, kbd, var, tt, form, fieldset, legend, label .nobox{background: transparent; border: 0; font-size: 100%; margin: 0; outline: 0; padding: 0; vertical-align: baseline; font-family:"Trebuchet MS";} input, option, textarea {background: #eeeeee; border: 1px solid #808080; padding: 1px;} blockquote, q{ quotes: none; } br{ height: 0; } ul, ol, dl{ list-style: none; } /* Class for clearing floats */ .clear{clear:both;display:block;overflow:hidden;visibility:hidden;width:0;height:0;} /* 2. Define Base Typography ------------------------------------------------------------------------------*/ /* Create the Default Headers */ h1, h2, h3, h4, h5, h6 {color: #2b2b2b ; font-family:"Trebuchet MS";} /* Create the Default Paragraphs */ p {color:#313233; line-height:20px;} /* Specific Header Settings */ h1 {font-size: 22px;} h2 {font-size: 20px;} h3 {font-size: 18px;} h4 {font-size: 16px;} h5 {font-size: 14px;} h6 {font-size: 12px;} /* Other Typo */ strong{font-weight: bold;} hr{border:0 #ccc solid;border-top-width:1px;clear:both;height:0; margin-bottom: 10px; } ol{list-style:decimal;} ul{list-style:square;} /* 3. Images ------------------------------------------------------------------------------*/ /* Remove border around linked images */ img {border: 0; border-style:none;} /* Create default inline image class */ img.inline{ display: inline; vertical-align: middle; } /* 4. Links ------------------------------------------------------------------------------*/ /* Default Link Types */ a{color:#d9842c; text-decoration:none;} a:hover{color:#d9842c; text-decoration:underline;} a:active{outline:none;} a:focus{outline:1px dotted invert;} a.arrow {background: url("/images/site/arrow_icon.gif") right 0 no-repeat; padding-right: 15px;} /* 5. Forms ------------------------------------------------------------------------------*/ /* Removes fieldset borders. even on Opea 7 */ fieldset {border: 1px solid transparent;} /* 6. Tables ------------------------------------------------------------------------------*/ /* Table Fixes */ table {border-spacing: 0; border-collapse: collapse;} td {text-align: left; font-weight: normal;} /* Removes fieldset borders. even on Opera 7 */ fieldset {border: 1px solid transparent;} /* Default Horizontal Zebra Table */ #hor-zebra{font-family:"Trebuchet MS"; font-size: 12px;width:630px;text-align:center;border-collapse:collapse;margin:0;text-align: left;} #hor-zebra b{font-size: 13px; font-weight: bold;color:#02624e;} #hor-zebra th{font-size:12px;font-weight:bold;color:#fff;padding: 2px 8px;background-color: #d9842c;} #hor-zebra td{color:#454444;padding:5px 8px 5px 8px; } #hor-zebra .odd{background:#f1f1f2;} #hor-zebra .yesno{ text-align: center; } /* 7. Framework ------------------------------------------------------------------------------*/ /* Page Layout */ html, body {height: 100%; font: 13px "helvetica",sans-serif, monospace; background: url("/images/site/background_rptr.jpg");} /* Wrapper */ #wrapper{width: 960px; min-height: 100%; height: auto !important; margin:0 auto -240px; background: #fff;} /* Header */ #header {height: 100px; position: relative;} #logo {width: 190px; height: 50px; position: absolute; top: 20px; left: 40px;} #phone {position: absolute; top: 15px; left: 515px;} #phone p {color: #4e4e4e; font-size: 15px;} #chat_header {width: 78px; height: 35px; position: absolute; right: 0; top: 55px;} /* Navigation */ #navigation {width: 600px; position: absolute; top: 60px; left: 290px;} #navigation ul {list-style: none;} #navigation ul li {display: inline; margin-right: 20px;} #navigation ul li a {text-transform: uppercase; font-size: 12px; color: #868484; font-weight: 600;} #navigation ul li a:hover {color: #d9842c; text-decoration: none;} /* Main */ #main {margin-bottom: 15px;} /* Banner */ #banner {width: 960px; height: 385px; overflow: hidden; position: relative; margin-bottom: 40px;} .banner_image {position: absolute; top: 0; left: 0;} .banner_message {width: 260px; position: absolute; top: 0; left: 0; z-index: 2; padding: 30px;} .banner_message h2 {color: #fff; font-size: 30px;} .banner_message p {color: #fff; font-size: 14px; margin-bottom: 10px;} #banner .dark h2 {color: #2b2b2b;} #banner .dark p {color: #2b2b2b;} #dedicated_servers {display: none;} #virtual_servers {display: none;} #website_hosting {display: none;} #streaming_media {display: none;} #banner_buttons {position: absolute; bottom: 0; left: 0; width: 960px; height: 120px; z-index: 1000;} #banner_buttons .button {width: 240px; height: 120px; display: block; float: left; overflow: hidden;} #banner_buttons #virtual_link {background: url("/images/site/banner_virtual_hover.png") no-repeat;} #banner_buttons #dedicated_link {background: url("/images/site/banner_dedicated_hover.png") no-repeat;} #banner_buttons #hosting_link {background: url("/images/site/banner_website_hover.png") no-repeat;} #banner_buttons #streaming_link {background: url("/images/site/banner_streaming_hover.png") no-repeat;} #banner_buttons #dedicated_link:hover {background-position: 0 -120px;} #banner_buttons #virtual_link:hover {background-position: 0 -120px;} #banner_buttons #hosting_link:hover {background-position: 0 -120px;} #banner_buttons #streaming_link:hover {background-position: 0 -120px;} #banner_buttons #dedicated_link.active {background-position: 0 -120px;} #banner_buttons #virtual_link.active {background-position: 0 -120px;} #banner_buttons #hosting_link.active {background-position: 0 -120px;} #banner_buttons #streaming_link.active {background-position: 0 -120px;} /* Home */ #home_left {width: 430px; padding-left: 50px; margin-right: 50px; float: left; border-right: 1px solid #f2f2f2;} #home_right {width: 370px; margin-right: 59px; float: left; } .home_feature {width: 401px;} .hf_image {width: 120px; float: left;} .hf_text {width: 280px; float: right; } .hf_text ul {margin-bottom: 10px;} .hf_text li { margin-left: 12px; margin-bottom: 3px; } /* About */ .about_feature {width: 640px;} .af_image {width: 90px; float: left; padding-top: 15px;} .af_text {width: 540px; float: left;} .af_title {width: 510px; float: left; background: url("/images/site/compare_check.png") 0px 1px no-repeat; padding-left: 35px} /* Internal Banner */ #internal_banner {width: 960px; height: 140px; overflow: hidden; position: relative; margin-bottom: 20px;} #ib_image {width: 670px; height: 140px; position: absolute; top: 0; left: 0;} #ib_text {width: 230px; height: 100px; padding: 20px 30px; position: absolute; top: 0; right: 0; background: #343434;} #ib_text h2 {color: #c1f6fa;} #ib_text h3 {color: #c1f6fa; margin-bottom: 10px;} #ib_text p {color: #fefbed; line-height: 16px;} /* Main Content */ #main_content {width: 630px; padding-left: 20px; padding-right: 20px; margin-right: 20px; float: left; border-right: 1px solid #f2f2f2;} #main_content h1 {margin-bottom: 10px;} #main_content p {margin-bottom: 10px;} .internal p {margin-top: 10px; margin-bottom: 10px;} .internal ul {margin-left: 10px; margin-bottom: 30px;} .internal li {margin-left: 10px; margin-bottom: 3px; } .kb p {margin-top: 10px; margin-bottom: 10px;} .kb ul {margin-left: 10px; margin-bottom: 30px;} .kb li {margin-left: 10px; margin-bottom: 3px; list-style: none; } /* Wide Content */ #wide_content {width: 920px; padding-left: 20px; padding-right: 20px; margin-right: 20px; float: left;} #wide_content h1 {margin-bottom: 10px;} #wide_content p {margin-bottom: 10px;} /* Secondary Content */ #secondary_content {width: 250px; float: right; } #secondary_content h3 {margin-bottom: 10px;} #secondary_content ul {margin-left: 5px; list-style: none; margin-bottom: 30px;} #secondary_content li {margin-left: 5px; margin-bottom: 3px;} .latestnews li {list-style: none;} /* Misc Content */ .misc_content {width: 600px; float: left; padding-bottom: 25px; padding-left: 25px;} .misc_content h3 {margin-bottom: 10px;} .misc_content ul {list-style: none; margin-bottom: 3px;} .misc_content li {margin-left: 10px; margin-bottom: 3px;} /* Footer Push */ #push{height: 240px;} /* Footer */ #footer_wrapper {height: 240px; background: #343434;} #footer {width: 960px; margin: 0 auto; padding-top: 20px; font-size: 12px;} #footer a {color: #c0c0c0;} #footer h3 {color: #fff; font-size: 14px; margin-bottom: 10px;} #footer p {color: #f1eded;} #footer ul {list-style: none;} #footer ul li {margin-bottom: 3px; background: url("images/site/footer_bullet.gif") 0 1px no-repeat; padding-left: 12px;} #footer .footer_column {width: 180px; float: left; margin-right: 40px;} #footer .right {width: 300px; margin-right: 0; float: right;} #footer #copyright {margin-top: 20px; text-align:center;} /* Panel Tab/button */ .tab{background:url("/images/tab/tab_b.png") repeat-x 0 0;height:42px;position:relative;top:0;z-index:9999;} .tab_center {width: 960px; margin: 0 auto; position: relative;} .tab ul.login{display:block;position:relative;float:right;clear:right;height:42px;width:auto;font-weight:700;line-height:42px;right:0;color:#FFF;font-size:80%;text-align:center;margin:0;} .tab ul.login li.left{background:url("/images/tab/tab_l.png") no-repeat left 0;height:42px;width:30px;display:block;float:left;margin:0;padding:0;} .tab ul.login li.right{background:url("/images/tab/tab_r.png") no-repeat left 0;height:42px;width:30px;display:block;float:left;margin:0;padding:0;} .tab ul.login li{text-align:left;display:block;float:left;height:42px;background:url("/images/tab/tab_m.png") repeat-x 0 0;padding:0 6px;} .tab ul.login li a{color:#d9842c;} .tab .sep{color:#414141;} .tab a.open,.tab a.close{height:20px;line-height:20px !important;padding-left:30px !important;cursor:pointer;display:block;width:100px;position:relative;top:11px;} .tab a.open{background:url("/images/tab/bt_open.png") no-repeat left 0;} .tab a.close{background:url("/images/tab/bt_close.png") no-repeat left 0;} .tab a:hover.open{background:url("/images/tab/bt_open.png") no-repeat left -19px;} .tab a:hover.close{background:url("/images/tab/bt_close.png") no-repeat left -19px;} /* sliding panel */ #toppanel{position:absolute;top:0;width:100%;z-index:999;text-align:center;margin-left:auto;margin-right:auto;} #panel{width:100%;height:270px;color:#999;background:#3f3f3f;overflow:hidden;position:relative;z-index:3;display:none;} #panel h1{font-size:1.6em;color:#FFF;margin:0;padding:5px 0 10px;} #panel h2{font-size:1.2em;color:#FFF;margin:0;padding:10px 0 5px;} #panel p{color:#fff;font-size:12px;margin:5px 0;padding:0;} #panel a{text-decoration:none;color:#d9842c;} #panel a-lost-pwd{display:block;float:left;} #panel .content{width:960px;padding-top:15px;text-align:left;font-size:0.85em;margin:0 auto;} #panel .content .left{width:280px;float:left;border-left:1px solid #333;padding:0 15px;} #panel .content .right{border-right:1px solid #333;} #panel .content form{margin:0 0 10px;} #panel .content label{float:left;padding-top:8px;clear:both;width:280px;display:block;} #panel .content input.field{border:1px #1A1A1A solid;background:#414141;margin-right:5px;margin-top:4px;width:200px;color:#FFF;height:16px;} #panel .content input:focus.field{background:#545454;} /* Login and Register buttons */ #panel .content input.bt_login,#panel .content input.bt_register{display:block;float:left;clear:left;height:24px;text-align:center;cursor:pointer;border:none;font-weight:700;margin:10px 0;} #panel .content input.bt_login{width:74px;background:transparent url("/images/tab/bt_login.png") no-repeat 0 0;} #panel .content input.bt_register{width:94px;color:#FFF;background:transparent url("/images/tab/bt_register.png") no-repeat 0 0;} #panel .lost-pwd{display:block;float:left;clear:right;font-size:0.95em;text-decoration:underline;padding:15px 5px 0;} .tab ul.login li a:hover,#panel a:hover{color:#FFF;} /*Bitrate Price Calculator*/ #bitrate_calc_wrapper {margin-bottom: 20px; width: 626px; height: 100px; border: 1px solid #d9842c;} #bitrate_calc_wrapper .header {width: 626px; height: 16px; text-align:center; font-size:12px;font-weight:bold;color:#fff;background-color: #d9842c;} #bitrate_calc_wrapper .column {margin: 5px; width: 140px; margin-bottom: 1.0em; float: left;} #bitrate_calc_wrapper .pricecolumn {width: 140px; float: left;} #bitrate_calc_wrapper span {font-size:14px; font-weight: bolder; } #bitrate_calc_wrapper span.price {font-size:20px; color: #d9842c; } /*Align images in XHTML paragraphs*/ img.left { float: left; border-right:1px solid #ccc; padding:3px; margin-right:10px; } img.right { float: right; border-left:1px solid #ccc; padding:3px; margin-left:10px; }