/* ********************************************************** @NORMALIZES *************************************************************/ *, html, body, div, dl, dd, ol, ul, li, h1, h2, h3, h4, h5, h6, p, blockquote, pre, form, fieldset, input, textarea, select, th, td { margin: 0; padding: 0; } body, h1, h2, h3, h4, h5, h6, p, li, fieldset, label, input, textarea, select, table { font-family: "Trebuchet MS", "Trebuchet MS", Tahoma, sans-serif; font-size: 100%; font-weight: normal; } input, textarea, select { color: #D4D4D4; background: #FFF url(../images/form_shadow.gif) no-repeat left top; border-left: solid 1px #000; border-top: solid 1px #000; border-right: solid 1px #144961; border-bottom: solid 1px #144961; } input:hover, textarea:hover { /*background: #FFF url(../images/form_shadow.gif) no-repeat left top;*/ border-left: solid 1px #4277B9; border-top: solid 1px #4277B9; border-right: solid 1px #4277B9; border-bottom: solid 1px #4277B9; } select:hover, select:active, select:focus { border-left: solid 1px #4277B9; border-top: solid 1px #4277B9; border-right: solid 1px #4277B9; border-bottom: solid 1px #4277B9; } input:active, textarea:active, input:focus, textarea:focus { /*background: #FFF url(../images/form_shadow_focus.gif) no-repeat left top;*/ border-left: solid 1px #4277B9; border-top: solid 1px #4277B9; border-right: solid 1px #4277B9; border-bottom: solid 1px #4277B9; } label { color: #FFC20E; } h1, h2, h3, h4, h5, h6, p, li { cursor: default; line-height: 1.4em; } a { color: #00AEEF; text-decoration: none; cursor: pointer; } a:hover { color: #FFF; text-decoration: underline; } ol, ul { list-style-type: none; } address, caption, code, dfn, th, var { font-style: normal; font-weight: normal; } cite { font-style: italic; font-weight: normal; } table { border-collapse: collapse; border-spacing: 0; } fieldset, img { border: 0; } caption, th { text-align: left; } q:before, q:after { content: ''; } .clear { height: 0; clear: both; font-size: 0; line-height: 0; } /* @system messages */ p.crash { font-weight: bold; text-transform: uppercase; margin: 10px 0 10px 0; padding: 5px 10px 5px 10px; letter-spacing: 1px; border: solid 1px #CC0000; filter: alpha(opacity=100); -moz-opacity: 1.0; opacity: 1.0; color: #FFF; } p.crash span { font-weight: bold; font-size: 14px; line-height: 16px; letter-spacing: normal; text-transform: uppercase; color: #CC0000; } p.bless { font-weight: bold; text-transform: uppercase; margin: 10px 0 10px 0; padding: 5px 10px 5px 10px; letter-spacing: 1px; border: solid 1px #7EB712; filter: alpha(opacity=100); -moz-opacity: 1.0; opacity: 1.0; color: #FFF; } p.bless span { font-weight: bold; font-size: 14px; line-height: 16px; letter-spacing: normal; text-transform: uppercase; color: #7EB712; } p.note { font-weight: bold; text-transform: uppercase; margin: 10px 0 10px 0; padding: 5px 10px 5px 10px; letter-spacing: 1px; border: solid 1px #4C91BD; filter: alpha(opacity=100); -moz-opacity: 1.0; opacity: 1.0; color: #FFF; } p.note span { font-weight: bold; font-size: 14px; line-height: 16px; letter-spacing: normal; text-transform: uppercase; color: #4C91BD; } .orange { color: #F4BB13; } .blue { color: #0EBCF3; } .white { color: #FFF; } /* @WMouseText */ #WMouseText { background: #00707F; border: solid 2px #111018; color: #FFC20E; font-weight: bold; width: auto; height: auto; line-height: 20px; letter-spacing: 1px; margin: 0; padding: 10px; position: relative; } /* ********************************************************** @ICONOME *************************************************************/ /* @INDEX */ body { background: #00707F url(../images/bg.gif) repeat-x left top; font-size: 11px; color: /*#DADADA*/#DCDCDC; text-align: center; scrollbar-base-color: #C39A40; } #holder { width: auto; height: auto; background: transparent url(../images/bg_flow.gif) repeat-y center top; } .ht { width: auto; height: auto; background: transparent url(../images/bg_top.gif) no-repeat center top; } .hb { width: auto; height: auto; background: transparent url(../images/bg_bottom.gif) no-repeat center bottom; } #container { text-align: left; width: 974px; height: auto; min-height: 886px; margin: 0px auto 0px auto; position: relative; background: transparent url(../images/bg_flow.gif) repeat-y -5px top; }* html body #container { height: 886px; } #container .ht { background-position: -5px top; } #container .hb { background-position: -5px bottom; } /* @header */ #header { height: 66px; } #header h1 { text-indent: -9999px; position: absolute; top: 0; left: 47px; } #header h1 a { display: block; width: 200px; height: 88px; background: transparent url(../images/logo_iconome.gif) no-repeat left top; } #header ul.nav_main { position: absolute; top: 30px; right: 0; text-align: right; } #header ul.nav_main li { float: left; } #header ul.nav_main li a { display: block; height: 36px; line-height: 36px; background: transparent url(../images/nav_main.gif) no-repeat left top; } #header ul.nav_main li a.main1 { width: 208px; background-position: 0 0; } #header ul.nav_main li a.main1:hover, #header ul.nav_main li.current a.main1 { width: 208px; background-position: 0 -36px; } #header ul.nav_main li a.main2 { width: 126px; background-position: -208px 0; } #header ul.nav_main li a.main2:hover, #header ul.nav_main li.current a.main2 { width: 126px; background-position: -208px -36px; } #header ul.nav_main li a.main3 { width: 178px; background-position: -334px 0; } #header ul.nav_main li a.main3:hover, #header ul.nav_main li.current a.main3 { width: 178px; background-position: -334px -36px; } #header ul.nav_main li a.main4 { width: 180px; background-position: -512px 0; } #header ul.nav_main li a.main4:hover, #header ul.nav_main li.current a.main4 { width: 180px; background-position: -512px -36px; } #header ul.nav_main li a span { display: none; } #header ul.nav_user { position: absolute; top: 0; right: 10px; text-align: right; } #header ul.nav_user li { float: left; margin-left: 10px; } #header ul.nav_user li a { height: 30px; line-height: 30px; padding-left: 24px; } #header ul.nav_user li a.register { background: transparent url(../images/icon_top_register.gif) no-repeat left center; } #header ul.nav_user li a.login { background: transparent url(../images/icon_top_login.gif) no-repeat left center; } #header ul.nav_user li a.cart { background: transparent url(../images/icon_top_cart.gif) no-repeat left center; } #header ul.nav_user li a.checkout { background: transparent url(../images/icon_top_checkout.gif) no-repeat left center; } #header ul.nav_user li a span { color: #FFC20E; } .style1 { color: #614903; font-weight: bold; } /* @main flash */ #main_flash { width: 974px; height: 306px; } /*@main popup */ #main_popup.active { width: 343px; height: 290px; background: transparent url(../images/popup_bg.gif) no-repeat left top; position: absolute; top: 76px; right: 0; text-align: left; } #main_popup.active h3 { font-size: 18px; line-height: 34px; color: #FFC20E; padding-left: 30px; margin-left: 5px; } #main_popup.active h3 a#main_popup_head.opened { display: block; margin-right: 6px; padding-right: 22px; background: transparent url(../images/opened.gif) no-repeat right 12px; } #main_popup.active h3 a#main_popup_head.closed { display: block; margin-right: 6px; padding-right: 22px; background: transparent url(../images/closed.gif) no-repeat right 12px; } #main_popup.active ul.step_info { position: absolute; top: 40px; left: 14px; width: 180px; height: auto; z-index: 2; } #main_popup.active ul.step_info li { width: auto; height: auto; border-top: dotted 1px #afb2b5; padding: 8px 0 8px 20px; } #main_popup.active ul.step_info li.s1 { background: transparent url(../images/s1.gif) no-repeat left center; border: none; } #main_popup.active ul.step_info li.s2 { background: transparent url(../images/s2.gif) no-repeat left center; } #main_popup.active ul.step_info li.s3 { background: transparent url(../images/s3.gif) no-repeat left center; } #main_popup.active p.sticky { position: absolute; top: 41px; left: 204px; width: 135px; height: 130px; text-align: center; padding-top: 30px; background: transparent url(../images/sticky_popup.gif) no-repeat left top; font-size: 14px; line-height: 1em; text-transform: uppercase; color: #FFF; } #main_popup.active p.sticky span { font-size: 11px; line-height: 1.3em; color: #000; } #main_popup.active .start { position: absolute; left: 204px; top: 177px; } #main_popup.active .popup_form { position: absolute; left: 0; top: 202px; width: auto; height: 88px; margin: 0; } #main_popup.active .popup_form fieldset { width: auto; height: auto; margin: 5px 0; padding-left: 14px; } #main_popup.active .popup_form input.text { width: 108px; height: 17px; float: left; display: inline; margin: 0 6px 0 0; } #main_popup.active .popup_form input.button, #main_popup.active .popup_form img.button { width: 80px; height: 19px; float: left; display: inline; margin-left: 3px; border: none; background: none; } #main_popup.active .popup_form p { margin: 5px 14px; line-height: 26px; } #main_popup.passive { width: 343px; height: 30px; background: transparent url(../images/popup_bg.gif) no-repeat left top; position: absolute; top: 336px; right: 0; text-align: left; overflow: hidden; } #main_popup.passive h3 { font-size: 18px; line-height: 34px; color: #FFC20E; padding-left: 30px; margin-left: 5px; } #main_popup.passive ul, #main_popup.passive p, #main_popup.passive .start, #main_popup.passive .popup_form { display: none; } /* @content boxes */ #main_content { width: 962px; min-height: 373px; margin: 0 6px; position: relative; } * html body #main_content { height: 373px; } #main_content h3 { font-size: 18px; line-height: 34px; color: #FFC20E; padding-left: 26px; margin-left: 5px; } #main_content p { margin: 0 10px 10px 10px; } #main_content #icon_directory { position: absolute; top: 219px; left: 0; width: 762px; height: 148px; float: left; clear: left; background: transparent url(../images/icon_directory.gif) no-repeat left top; } #main_content #icon_directory h3 { background: transparent url(../images/icon_h3_directory.gif) no-repeat left center; } #main_content #iconome_info { position: absolute; top: 0; left: 0; width: 564px; height: 250px; float: left; clear: left; background: transparent url(../images/iconome_info.gif) no-repeat left top; } #main_content #iconome_info h3 { background: transparent url(../images/icon_h3_iconomeinfo.gif) no-repeat left center; margin-bottom: 5px; } #main_content #iconome_info table { margin: 0; } #main_content #iconome_info table td { padding: 0 10px; } #main_content #iconome_info table td h2 { font-size: 14px; line-height: 1.2em; font-weight: normal; color: #FFF; margin: 0 0 5px 0; } #main_content #iconome_info table td p { margin: 0 0 5px 0; } /*#main_content #iconome_info p { margin: 0 10px 10px 10px; }*/ #main_content #share_iconome { position: absolute; top: 180px; left: 0; width: 558px; height: 38px; float: left; border-top: dotted 1px #9B9FA3; } #main_content #share_iconome h3 { background: transparent url(../images/icon_h3_share.gif) no-repeat left center; float: left; display: inline; } #main_content #share_iconome ul.share { margin-top: 3px; } #main_content #share_iconome ul.share li { float: left; } #main_content #share_iconome ul.share li a { display: block; width: 28px; height: 28px; background: transparent url(../images/icon_share.gif) no-repeat left top; } #main_content #share_iconome ul.share li a.share1 { background-position: 0 0; margin-left: 20px; } #main_content #share_iconome ul.share li a.share2 { background-position: -28px 0; } #main_content #share_iconome ul.share li a.share3 { background-position: -56px 0; } #main_content #share_iconome ul.share li a.share4 { background-position: -84px 0; } #main_content #share_iconome ul.share li a.share5 { background-position: -112px 0; } #main_content #share_iconome ul.share li a.share6 { background-position: -140px 0; } #main_content #share_iconome ul.share li a.share7 { background-position: -168px 0; } #main_content #share_iconome ul.share li a span { display: none; } #a2apage_dropdown input { width: auto; height: auto; background-image: none; } #main_content #testimonial { position: absolute; top: 0; left: 564px; width: 198px; height: 219px; float: left; background: transparent url(../images/testimonial.gif) no-repeat left top; } #main_content #testimonial h3 { margin: 10px 0 0 8px; padding-left: 0; line-height: 1em; } #main_content #testimonial p { font: italic bold 16px Georgia, "Times New Roman", Times, serif; color: #FFC20E; display: block; margin-bottom: 10px; padding: 0 10px 20px 10px; } #main_content #testimonial p.link { font: normal normal 11px "Trebuchet MS", Tahoma, sans-serif; margin: 0; } #main_content #testimonial p.tml { margin: 0 10px 10px 10px; } #main_content #testimonial p.tml span.icon { background: transparent url(../images/icon_testimonial.gif) no-repeat left center; float: left; display: block; width: 32px; height: 28px; } #main_content #testimonial p.tml span.name { font: normal bold 12px "Trebuchet MS", Tahoma, sans-serif; color: #DCDCDC; display: block; padding-top: 10px; letter-spacing: 1px; } #main_content #most_recent { position: absolute; top: 0; left: 762px; width: 200px; height: 367px; float: left; background: transparent url(../images/most_recent.gif) no-repeat left top; } #main_content #most_recent h3 { background: transparent url(../images/icon_h3_mostrecent.gif) no-repeat left center; } /* @INSIDE */ #main_content_inside { width: 962px; min-height: 411px; margin: 0 6px; position: relative; } * html body #main_content_inside { height: 411px; } #main_content_inside #all_place { width: auto; margin: 0 220px 0 25px; padding-top: 10px; padding-bottom: 60px; } #main_content_inside #all_place h1 { font-size: 30px; line-height: 1.6em; color: #FFC20E; margin-bottom: 10px } #main_content_inside #all_place h2 { font-size: 24px; line-height: 1.6em; color: #FFC20E; margin-bottom: 10px } #main_content_inside #all_place h3 { font-size: 20px; line-height: 1.6em; color: #FFC20E; margin-bottom: 10px } #main_content_inside #all_place h4 { font-size: 18px; line-height: 1.8em; color: #FFC20E; margin-bottom: 10px } #main_content_inside #all_place h5 { font-size: 16px; font-weight: bold; line-height: 1.8em; color: #FFC20E; margin-bottom: 10px } #main_content_inside #all_place h6 { font-size: 14px; font-weight: bold; line-height: 1.8em; color: #FFC20E; margin-bottom: 10px } #main_content_inside #all_place p { font-size: 13px; line-height: 1.8em; margin: 0 0 10px 0; } #main_content_inside #all_place p#currently_viewing span { text-transform: uppercase; } #main_content_inside #all_place ul { list-style-type: disc; list-style-position: inside; margin: 0 10px 10px 10px } #main_content_inside #all_place ol { list-style-type: decimal; list-style-position: inside; margin: 0 10px 10px 10px } #main_content_inside #all_place li { font-size: 13px; padding: 6px 0; } #main_content_inside #all_place .contact_content ul { list-style-type: none; margin: 0; } #main_content_inside #all_place .contact_content ul#company_info li { float: left; width: 230px; padding: 0; margin: 0; height: auto; } #main_content_inside #all_place .contact_content ul#company_info li h3 { font-size: 13px; font-weight: bold; margin: 0; } #main_content_inside #all_place .contact_content ul#company_info li p { margin: 0; } /* @uni_form */ #all_place #uni_form {} #all_place #uni_form h3 { clear: both; color: #FFC20E; } #all_place #uni_form h4 { clear: both; font-weight: bold; } #all_place #uni_form ul { width: 623px; margin: 0; padding: 0; list-style-type: none; } #all_place #uni_form ul li { width: 100%; margin: 0; padding: 4px 0; float: left; clear: both; background: none; } #all_place #uni_form ul li span { background: none; padding: 0; color: #DCDCDC; } #uni_form ul li label { width: 150px; float: left; display: inline; margin-right: 0; line-height: 20px; } #uni_form ul li.double label.m1 { width: 90px; } #uni_form ul li.double label.m2 { width: 60px; } #uni_form ul li input { width: 198px; height: 18px; float: left; display: inline; } #uni_form ul li input.short { width: 99px; } #uni_form ul li input.chkbox { width: 20px; border: none; background: none; } #uni_form ul li input.radio { width: 20px; border: none; background: none; } #uni_form ul li input.button { width: auto; height: auto; border: none; margin-top: 10px; } #uni_form ul li select { width: 198px; height: auto; float: left; display: inline; font-size: 12px; } #uni_form ul li select.short { width: 99px; } #uni_form ul li.double select.m1 { width: 48px; margin-right: 12px;} #uni_form ul li.double select.m2 { width: 48px; } #uni_form ul li textarea { width: 198px; height: 80px; float: left; display: inline; } #uni_form ul li textarea.short { width: 198px; height: 80px; float: left; display: block; } #uni_form ul li textarea.doubleline { width: 198px; height: 36px; float: left; display: block; } #uni_form ul li .bubble_holder { width: 255px; margin: 0 0 15px 0; padding: 0; float: right; display: inline; position: relative;} #uni_form ul li .bubble_holder p.extra_info { font-size: 11px; position: relative; } #uni_form ul li .bubble { position: absolute; left: 80px; top: 0; width: 150px; z-index: 999; } #uni_form ul li .bubble p { font-size: 11px; background: #000; margin: 0; padding: 5px; border: solid 1px #FFF; } #all_place #uni_form .checkout_total { display: block; width: 100%; float: left; margin-bottom: 20px; } #all_place #uni_form .checkout_total p.priceAtt, #all_place #uni_form .checkout_total p.totalAtt { float: left; display: inline; width: 80px; margin: 0 5px 0 0; border-right: dashed 1px #A5ACB2; } #all_place #uni_form .checkout_total p.totalAtt, #all_place #uni_form .checkout_total p .priceInput { font-weight: bold; } #all_place .uni_form div.button { clear: both; width: 100%; } /* @testimonials */ #main_content_inside #all_place #testimonials_content { width: auto; padding-bottom: 30px; } #main_content_inside #all_place #testimonials_content ul { width: auto; height: auto; margin: 0 0 10px 0; list-style-type: none; } #main_content_inside #all_place #testimonials_content ul li { float: left; display: inline; width: 210px; height: auto; min-height: 60px; padding: 10px 0; margin: 0 10px 10px 0; background: transparent url(../images/testimonials_decor.gif) no-repeat right top; } * html body #main_content_inside #all_place #testimonials_content ul li { height: 120px; } #main_content_inside #all_place #testimonials_content ul li p { font: italic bold 16px Georgia, "Times New Roman", Times, serif; color: #FFC20E; display: block; width: auto; height: auto; margin: 0 26px 0 10px; padding: 0; text-indent: 0; text-align: center; } #main_content_inside #all_place #testimonials_content ul li p span.name { font: normal bold 12px "Trebuchet MS", Tahoma, sans-serif; color: #737373; display: block; margin: 10px; padding: 0; letter-spacing: 1px; } #main_content_inside #all_place #testimonials_content ul li p span img { border: none; background: none; float: none; padding: 0; } #main_content_inside #all_place #testimonials_content ul li p span.op, #main_content_inside #all_place #testimonials_content ul li p span.cl { width: 20px; height: auto; } #main_content_inside #all_place #testimonials_content ul li p span.op img { margin: 0 8px 0 0; } #main_content_inside #all_place #testimonials_content ul li p span.cl img { margin: 0 0 0 5px; } /* INSIDE END */ #main_content_inside #share_iconome { position: absolute; bottom: 0; left: 0; width: 962px; height: 38px; float: left; border-top: dotted 1px #9B9FA3; } #main_content_inside #share_iconome h3 { font-size: 18px; line-height: 34px; color: #FFC20E; padding-left: 26px; margin-left: 5px; background: transparent url(../images/icon_h3_share.gif) no-repeat left center; float: left; display: inline; } #main_content_inside #share_iconome p { margin: 0 10px 10px 10px; } #main_content_inside #share_iconome ul.share { margin-top: 3px; } #main_content_inside #share_iconome ul.share li { float: left; } #main_content_inside #share_iconome ul.share li a { display: block; width: 28px; height: 28px; background: transparent url(../images/icon_share.gif) no-repeat left top; } #main_content_inside #share_iconome ul.share li a.share1 { background-position: 0 0; margin-left: 20px; } #main_content_inside #share_iconome ul.share li a.share2 { background-position: -28px 0; } #main_content_inside #share_iconome ul.share li a.share3 { background-position: -56px 0; } #main_content_inside #share_iconome ul.share li a.share4 { background-position: -84px 0; } #main_content_inside #share_iconome ul.share li a.share5 { background-position: -112px 0; } #main_content_inside #share_iconome ul.share li a.share6 { background-position: -140px 0; } #main_content_inside #share_iconome ul.share li a.share7 { background-position: -168px 0; } #main_content_inside #share_iconome ul.share li a span { display: none; } #main_content_inside #most_recent { position: absolute; top: 0; left: 762px; width: 200px; height: 367px; float: left; background: transparent url(../images/most_recent.gif) no-repeat left top; } #main_content_inside #most_recent h3 { font-size: 18px; line-height: 34px; color: #FFC20E; padding-left: 26px; margin-left: 5px; background: transparent url(../images/icon_h3_mostrecent.gif) no-repeat left center; } #main_content_inside #most_recent p { margin: 0 10px 10px 10px; } /* @footer */ #footer { width: 954px; height: 150px; margin: 0 10px; position: relative; } #footer p { line-height: 38px; color: #818181; } #footer ul.nav_footer { position: absolute; top: 0; right: 0; text-align: right; color: #818181; } #footer ul.nav_footer li { float: left; margin: 12px 0 0 12px; line-height: 14px; border-left: solid 1px #818181; } #footer ul.nav_footer li a { margin-left: 8px; } #footer ul.nav_footer li.first { border: none; } #footer ul.nav_footer li.rss a { display: block; width: 14px; height: 14px; background: transparent url(../images/icon_rss.gif) no-repeat center center; } #footer ul.nav_footer li.rss a span { display: none; } #footer ul.nav_footer li.developer a { color: #818181; } #footer #secure_logos { margin-top: 15px; text-align: center; } /* @soft site */ html { height: 100%; text-align: center; } body.inside { width: 100%; min-width: 770px; height: 100%; min-height: 570px; margin: 0 auto; text-align: center; background-color: #111018; background-image: none; } #outer_1 { width: 770px; height: 100%; display: table; margin: 0 auto; } #outer_2 { height: 570px; display: table-cell; text-align: center; vertical-align: middle; } #container_inside { width: 750px; height: 550px; margin: 10px; /*background: transparent url(../images/_inside.jpg) no-repeat center center;*/ } /* @inside header */ #container_inside #header { display: block; height: 114px; margin-bottom: 6px; border-bottom: dotted 1px #AFB2B5; position: relative; } #container_inside #header h1 { text-indent: -9999px; position: absolute; top: 0; left: 0; } #container_inside #header h1 a { display: block; width: 183px; height: 80px; background: transparent url(../images/logo_iconome_inside.gif) no-repeat left top; } #container_inside #header h2 { position: absolute; top: 12px; right: 0; display: block; width: 186px; color: #FFF; font-size: 18px; line-height: 20px; text-transform: uppercase; text-align: right; } #container_inside #header h3 { position: absolute; bottom: 0; left: 0; font-size: 18px; line-height: 34px; text-transform: uppercase; color: #FFC20E; padding-left: 30px; background: transparent url(../images/icon_h3_tab1.gif) no-repeat left center; } #container_inside #header h3 span.small { font: normal 11px "Trebuchet MS", Tahoma, sans-serif; color: #FFF; text-transform: none; } #container_inside #header ul#nav { position: absolute; bottom: 8px; right: 0; text-align: right; } #container_inside #header ul#nav li { float: left; display: inline; } #container_inside #header ul#nav li a { padding-left: 10px; margin: 3px 0 3px 9px; background: transparent url(../images/list_space_inside.gif) no-repeat left center; } #container_inside #header ul#nav li.first a { background: none; margin: 0; padding: 0; } #container_inside #header #steps { position: absolute; top: 11px; left: 214px; } #container_inside #header #steps div { width: 87px; height: 43px; text-indent: -9999px; } #container_inside #header #steps div span { display: block; width: 87px; height: 43px; background: transparent url(../images/inside_nav.gif) no-repeat left top; } #container_inside #header #steps #step1 { position: absolute; top: 0; left: 0; z-index: 4; } #container_inside #header #steps #step1.passive span { background-position: 0 0; } #container_inside #header #steps #step1.passive a:hover { background-position: 0 -43px; } #container_inside #header #steps #step1.active span { background-position: 0 -86px; } #container_inside #header #steps #step2 { position: absolute; top: 0; left: 79px; z-index: 3; } #container_inside #header #steps #step2.passive span { background-position: -90px 0; } #container_inside #header #steps #step2.passive a:hover { background-position: -90px -43px; } #container_inside #header #steps #step2.active span { background-position: -90px -86px; } #container_inside #header #steps #step3 { position: absolute; top: 0; left: 158px; z-index: 2; } #container_inside #header #steps #step3.passive span { background-position: -180px 0; } #container_inside #header #steps #step3.passive a:hover { background-position: -180px -43px; } #container_inside #header #steps #step3.active span { background-position: -180px -86px; } #container_inside #header #steps #step4 { position: absolute; top: 0; left: 237px; z-index: 1; } #container_inside #header #steps #step4.passive span{ background-position: -270px 0; } #container_inside #header #steps #step4.passive a:hover { background-position: -270px -43px; } #container_inside #header #steps #step4.active span { background-position: -270px -86px; } /* @all inside content */ #container_inside #step1_content, #container_inside #step2_content, #container_inside #step3_content, #container_inside #step4_content { width: 750px; height: 429px; position: relative; } #container_inside #step1_content h3, #container_inside #step2_content h3, #container_inside #step3_content h3, #container_inside #step4_content h3 { text-align: center; font-size: 18px; line-height: 20px; text-transform: uppercase; color: #FFF; margin-top: 20px; text-align: center; } /* @step1 = flash software */ /* @step2 */ #container_inside #step2_content .left { position: absolute; top: 0; left: 0; width: 372px; height: 429px; background: transparent url(../images/side_box.gif) no-repeat left top; z-index: 1; text-align: left; } #container_inside #step2_content .left .name { width: 340px; margin: 10px auto 0 24px; position: relative; } #container_inside #step2_content .left .name label { font-size: 11px; line-height: 26px; margin-right: 5px; } #container_inside #step2_content .left .name input { width: 130px; height: 16px; padding: 1px 2px; } #container_inside #step2_content .left .name .public_chk { width: 68px; margin: 0; position: absolute; top: 0; right: 0; } #container_inside #step2_content .left .name .public_chk label { font-size: 11px; line-height: 26px; margin-right: 5px; float: left; display: inline; } #container_inside #step2_content .left .name .public_chk input { width: 20px; height: 20px; padding: 0; margin-top: 3px; border: none; background: none; } #container_inside #step2_content .left ul { width: 260px; height: 60px; margin: 10px auto 0 20px; background: transparent url(../images/switchlist_signal.gif) no-repeat right center; } #container_inside #step2_content .left ul li { width: 220px; height: 30px; text-align: left; } #container_inside #step2_content .left ul li input { width: 20px; height: 28px; border: none; background: none; float: left; } #container_inside #step2_content .left ul li label { font-size: 18px; line-height: 26px; margin-left: 6px; color: #F4BB13; } #container_inside #step2_content .left ul li label span.blue { font-size: 14px; font-weight: bold; margin-left: 15px;} #container_inside #step2_content .left p.plus { font-size: 18px; line-height: 20px; color: #F4BB13; width: 65px; margin: -52px 0 0 280px; text-align: center; } #container_inside #step2_content .left .graphic { position: absolute; top: 165px; left: 58px; width: 251px; height: 186px; background: transparent url(../images/step2_graphic_left.gif) no-repeat left top; } #container_inside #step2_content .left p.button { position: absolute; bottom: 10px; left: 130px; /*font-size: 12px; line-height: 40px; font-weight: bold; color: #F4BB13; text-align: center;*/ } #container_inside #step2_content .left p.button input { border: none; background: none; margin: 0; } #container_inside #step2_content .left p.button span.text { display: block; float: left; margin-right: 25px; } #container_inside #step2_content .switch { position: absolute; top: 0; left: 315px; width: 123px; height: 45px; background: transparent url(../images/switch_graphic.gif) no-repeat left top; z-index: 2; text-indent: -9999px; } #container_inside #step2_content .right { position: absolute; top: 0; right: 0; width: 372px; height: 429px; background: transparent url(../images/side_box.gif) no-repeat left top; z-index: 1; } #container_inside #step2_content .right p.title { font-size: 18px; line-height: 26px; color: #F4BB13; text-align: center; margin-top: 10px; } #container_inside #step2_content .right .graphic { position: absolute; top: 143px; left: 86px; width: 200px; height: 200px; background: transparent url(../images/step2_graphic_right.gif) no-repeat center center; } #container_inside #step2_content .right .graphic img { margin: 0; } #container_inside #step2_content .right .button { position: absolute; bottom: 10px; left: 135px; font-size: 12px; line-height: 40px; font-weight: bold; color: #F4BB13; text-align: center; } /* @step3 */ #container_inside #step3_content { background: transparent url(../images/full_side_box.gif) no-repeat left center; } #container_inside #step3_content .twoinone { width: 480px; margin: 0 auto; padding-top: 15px; } #container_inside #step3_content .twoinone h3 { color: #F4BB13; text-align: left; text-transform: none; line-height: 23px; margin: 0; padding-left: 20px; background: transparent url(../images/icon_h3_step3left.gif) no-repeat left center; } #container_inside #step3_content .twoinone ul { width: 100%; height: auto; } #container_inside #step3_content .twoinone ul li { width: 100%; height: auto; min-height: 20px; padding: 4px 0; clear: both; } * html body #container_inside #step3_content .twoinone ul li { height: 20px; } #container_inside #step3_content .twoinone ul li div.cell_1 { float: left; display: inline; width: 130px; height: auto; text-align: left; } #container_inside #step3_content .twoinone ul li div.cell_2 { float: left; display: inline; width: 90px; height: auto; text-align: center; } #container_inside #step3_content .twoinone ul li div.cell_3 { float: left; display: inline; width: 120px; height: auto; text-align: center; } #container_inside #step3_content .twoinone ul li div.cell_4 { float: left; display: inline; width: 80px; height: auto; text-align: right; } #container_inside #step3_content .twoinone ul li div.cell_5 { float: left; display: inline; width: 60px; height: auto; text-align: right; } #container_inside #step3_content .twoinone ul.title {} #container_inside #step3_content .twoinone ul.title li p { font-size: 12px; line-height: 20px; font-weight: bold; color: #FFC20E; } #container_inside #step3_content .twoinone ul.table { width: 100%; height: auto; border-top: solid 1px #3E5665; border-bottom: solid 1px #3E5665; } #container_inside #step3_content .twoinone ul.table li p { line-height: 12px; margin-top: 3px; font-weight: bold; } #container_inside #step3_content .twoinone ul.table li input { width: 32px; height: 16px; margin-top: 1px; text-align: right; } #container_inside #step3_content .twoinone ul.table li input#INameField { width: 128px; text-align: left; } #container_inside #step3_content .twoinone ul.table li input.chkbox { border: none; background: none; width: auto; height: 20px; } #container_inside #step3_content .twoinone ul.table li input.button { background: none; border: none; width: 45px; height: 17px; margin-top: 2px; } #container_inside #step3_content .twoinone ul.coupon { clear: both; } #container_inside #step3_content .twoinone ul.coupon p { font-size: 11px; font-weight: bold; } #container_inside #step3_content .twoinone ul.coupon li div.cell_1 { width: 340px; height: auto; text-align: left; color: #FFC20E; } #container_inside #step3_content .twoinone ul.coupon li div.cell_2 { width: 80px; height: auto; text-align: right; color: #FFF; } #container_inside #step3_content .twoinone ul.coupon li div.cell_3 { width: 60px; height: auto; text-align: right; } #container_inside #step3_content .twoinone ul.coupon li input#ICouponField { width: 128px; height: 16px; margin-top: 1px; text-align: left; } #container_inside #step3_content .twoinone ul.coupon li input.button { background: none; border: none; width: 45px; height: 17px; margin-top: 2px; } #container_inside #step3_content .twoinone ul.cart_total { clear: both; } #container_inside #step3_content .twoinone ul.cart_total p { font-size: 12px; font-weight: bold; } #container_inside #step3_content .twoinone ul.cart_total li div.cell_1 { width: 340px; height: auto; text-align: right; color: #FFC20E; } #container_inside #step3_content .twoinone ul.cart_total li div.cell_2 { width: 80px; height: auto; text-align: right; font-size: 14px; color: #FFF; } #container_inside #step3_content .twoinone .buttons { clear: both; padding-top: 20px; } #container_inside #step3_content .twoinone .buttons input { background: none; border: none; } /* @step4 /1 */ #container_inside #step4_content { background: transparent url(../images/full_side_box.gif) no-repeat left center; } #container_inside #step4_content h3 { color: #F4BB13; text-align: left; text-transform: none; line-height: 23px; margin: 15px 0 0 0; padding-left: 20px; } #container_inside #step4_content .left { position: absolute; top: 0; left: 20px; width: 226px; text-align: left; } #container_inside #step4_content .left h3 { background: transparent url(../images/icon_h3_step3left.gif) no-repeat left center; } #container_inside #step4_content .center { position: absolute; top: 0; left: 264px; width: 226px; text-align: left; } #container_inside #step4_content .center h3 { background: transparent url(../images/icon_h3_step3center.gif) no-repeat left center; } #container_inside #step4_content .center h3.noicon { background: transparent; } #container_inside #step4_content .center input.button { border: none; background: none; text-align: right; margin-top: 10px; } #container_inside #step4_content .center .accountinfo input.button { border: none; background: none; text-align: right; margin-top: 100px; } #container_inside #step4_content .right { position: absolute; top: 0; left: 508px; width: 226px; text-align: left; } #container_inside #step4_content .right h3 { background: transparent url(../images/icon_h3_step3right.gif) no-repeat left center; } #container_inside #step4_content .right h3.noicon { background: transparent; } #container_inside #step4_content .right input.button { border: none; background: none; text-align: right; margin-top: 10px; } #container_inside #step4_content .right .accountinfo input.button { border: none; background: none; text-align: right; margin-top: 100px; } #container_inside #step4_content ul { width: 226px; } #container_inside #step4_content ul li { float: left; display: inline; } #container_inside #step4_content ul li.mode1 { width: 226px; } #container_inside #step4_content ul li.mode2 { width: 108px; margin-right: 10px; } #container_inside #step4_content ul li.mode3 { width: 108px; } #container_inside #step4_content ul li.mode4 { width: 139px; margin-right: 10px; } #container_inside #step4_content ul li.mode5 { width: 77px; } #container_inside #step4_content ul li.mode6 { width: 107px; margin-right: 10px; } #container_inside #step4_content ul li.mode7 { width: 49px; margin-right: 10px; } #container_inside #step4_content ul li.mode8 { width: 50px; } #container_inside #step4_content ul li label { float: left; display: inline; height: 20px; margin-top: 5px; line-height: 20px; } #container_inside #step4_content ul li.mode1 label { width: 226px; } #container_inside #step4_content ul li.mode2 label { width: 108px; } #container_inside #step4_content ul li.mode3 label { width: 108px; } #container_inside #step4_content ul li.mode4 label { width: 139px; } #container_inside #step4_content ul li.mode5 label { width: 77px; } #container_inside #step4_content ul li.mode6 label { width: 107px; } #container_inside #step4_content ul li.mode7 label { width: 49px; } #container_inside #step4_content ul li.mode8 label { width: 50px; } #container_inside #step4_content ul li input { float: left; display: inline; height: 16px; padding: 1px 2px; } #container_inside #step4_content ul li.mode1 input { width: 220px; } #container_inside #step4_content ul li.mode2 input { width: 102px; } #container_inside #step4_content ul li.mode3 input { width: 102px; } #container_inside #step4_content ul li.mode4 input { width: 133px; } #container_inside #step4_content ul li.mode5 input { width: 71px; } #container_inside #step4_content ul li.mode6 input { width: 101px; } #container_inside #step4_content ul li.mode7 input { width: 43px; } #container_inside #step4_content ul li.mode8 input { width: 44px; } #container_inside #step4_content ul li textarea { float: left; display: inline; height: 80px; padding: 1px 2px; } #container_inside #step4_content ul li.mode1 textarea { width: 220px; } #container_inside #step4_content ul li.mode2 textarea { width: 102px; } #container_inside #step4_content ul li.mode3 textarea { width: 102px; } #container_inside #step4_content ul li.mode4 textarea { width: 133px; } #container_inside #step4_content ul li.mode5 textarea { width: 71px; } #container_inside #step4_content ul li.mode6 textarea { width: 101px; } #container_inside #step4_content ul li.mode7 textarea { width: 43px; } #container_inside #step4_content ul li.mode8 textarea { width: 44px; } #container_inside #step4_content ul li select { float: left; display: inline; background: #0B2230; } #container_inside #step4_content ul li.mode1 select { width: 226px; } #container_inside #step4_content ul li.mode2 select { width: 108px; } #container_inside #step4_content ul li.mode3 select { width: 108px; } #container_inside #step4_content ul li.mode4 select { width: 139px; } #container_inside #step4_content ul li.mode5 select { width: 77px; } #container_inside #step4_content ul li.mode6 select { width: 107px; } #container_inside #step4_content ul li.mode7 select { width: 49px; } #container_inside #step4_content ul li.mode8 select { width: 50px; } #container_inside #step4_content ul li p { margin-top: 5px; line-height: 20px; } #container_inside #step4_content ul li.mode1 p.footnote { font-size: 10px; line-height: 12px; } li.mode1 p.footnote { font-size: 10px; line-height: 12px; margin: 5px 0; line-height: 20px; } #container_inside #step4_content ul li.mode2 p {} #container_inside #step4_content ul li.mode2 p span { font-size: 14px; font-weight: bold; color: #F4BB13; } #container_inside #step4_content ul li.mode3 p { text-align: right; } #container_inside #step4_content ul li.mode3 p span { font-size: 14px; font-weight: bold; color: #F4BB13; } #container_inside #step4_content ul li.mode1#footnote { width: 161px; float: left; } #container_inside #step4_content ul li.mode1#thawte { width: 65px; padding-top: 10px; } #container_inside #step4_content { background: transparent url(../images/full_side_box.gif) no-repeat left center; } #container_inside #step4_content #message { position: absolute; top: 145px; left: 75px; width: 600px; } #container_inside #step4_content #message h3 { color: #F4BB13; line-height: 32px; text-transform: none; margin: 0; } /****************************/ #container_inside #step4_content ul li.mode1 input.button, #container_inside #step4_content ul li.mode1 img { width: 108px; height: 41px; float: left; display: inline; margin: 0; } #container_inside #step4_content ul li.mode1 img { margin-right: 5px; } #container_inside #step4_content ul li.mode1 input#hittheblue { margin: 10px 0 5px 0; } #container_inside #step4_content ul li#thawte img { width: auto; height: auto; float: right; display: inline; margin: 0; }