/*****************************************/ /* Default classes: /* /* these set default styles for HTML elements on the page /* as well as common default classes used everywhere /* /* Form elements are treated separately /* /*****************************************/ body { color:#333; margin: 0; padding: 0px; font: 12px/160% arial, verdana, helvetica, sans-serif; background: #fff; } a { color:#36C; } li { margin-bottom: 0.5em; font-size: 1.1em; margin: 0; padding: 0; } h1 { font-size: 2.1em; line-height: 90%; font-family: helvetica, san-serif; color: #004F90; margin-bottom: 0.5em;} h2 { font-size: 1.8em; line-height: 90%; font-family: helvetica, san-serif; color: #004F90; margin-bottom: 0.5em;} h3 { font-size: 1.6em; line-height: 90%; font-family: helvetica, san-serif; color: #004F90; margin-bottom: 0.5em;} h4 { font-size: 1.6em; line-height: 90%; font-family: helvetica, san-serif; color: #004F90; margin-bottom: 0.5em;} h5 { font-size: 1.2em; line-height: 90%; font-family: helvetica, san-serif; color: #004F90; margin-bottom: 0.5em;} h6 { font-size: 1.1em; font-weight: bold; font-family: helvetica, san-serif; color: #004F90; margin-bottom: 0.5em;} p { font-size: 1.1em; } p { padding: 0; } li p, td p, th p, dt p, dd p { font-size: inherit; } h1, h2, h3, h4, h5, h6, p, ul, ol, dl { margin-top: 0 } table { width: 77%; } th { text-align: left; background-color: #ccc; } td { vertical-align: top; } th, td { padding: 3px; } fieldset { border: none; padding:10px; margin:0px 0px 10px 0px; } legend { font-size: 1.4em; font-weight: bold; } /* ---- end HTML --- */ .divide_2 { width: 48%; } .divide_3 { width: 33%; } .divide_4 { width: 24%; } .divide_5 { width: 18%; } .divide_3x2 { width: 66%; } .divide_4x2 { width: 48%; } .divide_4x3 { width: 72%; } .divide_5x2 { width: 39%; } .divide_5x3 { width: 59%; } .divide_5x4 { width: 78%; } .divide_6x4 { width: 100%; } .panel { float: left; } .stack { float: left; color: #FFFFFF; } .empty { display: none; } .nav, .nav ul, .nav ul .navitem { padding: 0; margin: 0; } .nav ul .navitem a { text-decoration: none; margin-right: 10px; } .nav ul { list-style-type: none; margin-left: 0; padding-left: 0; } .breadcrumbs .item, .nav .top li { float: left; } a.secondary { float:left; } a.primary { float:right; } .list .list .foot { display: none; } .list2 .list2 .foot2 { display: none; } .list .item p { margin: 0; } /* --- W here do these rules belong? ----- */ .row_a td { background-color: #e9e9e9; } .row_b td { background-color: #efefef; } .error { border:2px solid #cc0000; margin:3px 0px 10px 0px; } .error .error_msg { background-color:#FFEAEA; color:#cc0000; padding:2px 0px 0px 5px; } .error .entry { margin:0px; } .error h4 { color:#cc0000; } :focus { outline:none; } .hide { display:none; } .show { display:block; } .selected a { color:#333; text-decoration:none; } /*****************************************/ /* Main Nav /*/ .pagenav_level1 { margin: 1px 0 5px 0; height: auto; clear:both; } .pagenav_level1 ul { margin:0; float: left; width: 110%; } .pagenav_level1 ul li.navitem { display:block; float:left; margin-right: 0; background-color: transparent; background-image: url(../images/tabs/tab_off.gif); background-repeat: repeat-x; background-position: left top; } .pagenav_level1 #payroll_home { padding: 0 6px; } .pagenav_level1 #payroll_support_sect { display: none; } .pagenav_level1 ul li.navitem.selected { background: transparent url(../images/tabs/tab_on.gif) repeat-x top left; } .pagenav_level1 ul a { font-size: 11px; border-top: 0; padding: 2px 14px; display:block; color:#fff; font-weight:bold; font-family: arial, san-serif; } .pagenav_level1 ul li.navitem.selected a{ color:#000; background: } .pagenav_level1 .navitem a { } .pagenav_level1 .navitem a span { } .pagenav_level1 .navitem_selected a { border-bottom-color: #fff; text-decoration:none; color: #333; background-color: #fff;} .pagenav_level1 .navitem_selected span { } .left_nav { font-size: 0.95em; } .left_nav .list .item { margin: 0; } .left_nav .list ul { list-style-type: none; margin-left: 0; padding-left: 0; } .left_nav .list ul ul { margin-left: 20px; } /*****************************************/ /* Pagination /*/ .pagination { text-align:center; padding:3px 0px 3px 0px; border:1px solid #CCCCCC; margin:10px 0px 10px 0px; } .pagination #first_page { display:inline; margin:0px 10px 0px 0px; } .pagination #previous_page { display:inline; margin:0px 10px 0px 0px; } .pagination #next_page { display:inline; margin:0px 0px 0px 10px; } .pagination #last_page { display:inline; margin:0px 0px 0px 10px; } /* ---- entry ---- */ .inputtitle { padding: 0; margin: 0; float: left; width: 150px; text-align: right; } .inputtitle h4 { font-size: 10px; font-weight: bold; margin-bottom: 0; } .inputgroup { font-size: 10px; padding: 0; margin-left: 158px; } .entry_a { clear:both; } .entry_b { clear:both; } label { display: block; clear: right; } a.jump { padding-right: 10px; background: transparent url(../images/common/buttons/jump_arrow.gif) no-repeat center right;} a img { border: none; } /* ----- buttons ----- */ .button, button { color: #fff !important; cursor: pointer; border: none; background: transparent; text-align: center; } .button, button span { background: transparent url(../images/common/buttons/bright_left.gif) no-repeat center left; padding: 0 0 0 10px; display: block; height: 20px; white-space: nowrap; } .button span, button span em { background: transparent url(../images/common/buttons/bright_right.gif) no-repeat center right; font: bold 11px/20px Arial, Helvetica, sans-serif; display: block; padding-top: 1px; padding-right: 10px; padding-bottom: 0; padding-left: 0; } .button { margin: 3px; text-decoration: none; } .button:visited { color: #fff; } .button:hover { color: #fff; } .button:active { color: #fff; } /* Form Classes */ input { } .text { } .radio { } .checkbox { } .password { } .select { } .textarea { } .browse { } /*****************************************/ /* Footers /*/ .note { font-size: 11px; font-family: arial; font-weight:bold; } #stdbox_standard_footer { width: 700px; font-size:0.8em; clear:both; color:#333; margin: 0 auto 10px auto; } #stdbox_standard_footer p { margin-bottom:0; margin-top:0; } #copyright_info { margin-left: 0; } /* #legal_info { width:300px; padding:5px; float:right; text-align:right; }*/ .clear { height: 1px; margin-bottom: -1px; clear: both; } .clear br { display: none; } .head br { display: none; } /*****************************************/ /* Page /*/ .pagehdr { background: #fff url(../images/corp_id.gif) top left no-repeat; height: 100px; } .pagehdr .logo_hdr { width: 830px; margin: 0 auto; position:relative; } .pagehdr #mc_logo { position: absolute; top: 10px; right: 50px; display:none; } .panels { padding: 0; margin: 0; min-height: 500px; _height: 500px; background: url(../images/bkgd_gradient.gif) -2px -2px repeat-x; } .panels form .foot { width: auto; margin: 0 ; } /*.panels .foot { width: 700px; margin: 0 auto; }*/ #pagebox { margin: 0; } #main { width:80%; margin: 0; } #top { width: 840px; padding: 0 80px 0 80px; margin: 0 auto; float: none; } #center { width: 700px; clear: both; padding: 0 80px 0 80px; margin: 20px auto 0 auto; float: none; } #center .title { font-weight: normal; font: 22px/160% helvetica, arial, verdana, sans-serif; margin-bottom:10px; color:#4B5077;} #left_col { width: 25px; padding: 0; margin: 0; } #right_col { margin-left: 0px; float:none; } #full_main { width: 575px; padding: 0; margin: 0; } #side_bar { width: 200px; padding: 0; margin: 0; } .collapsable .head { background: transparent url(../images/box_d/top_left.gif) no-repeat top left; } .collapsable .head h6 { padding-bottom: 2px; padding-top: 2px; margin: 0 0 0 10px; background: transparent url(../images/box_d/top_right.gif) no-repeat top right; font-family: arial; font-weight: bold; font-size: 14px; color:#4B5077;} .collapsable .head h6 a { color:#4B5077; } .collapsable .selected { margin-bottom: 10px; } .collapsable .selected .head h6 a { color:#4B5077; } .collapsable .show, .collapsable .hide { background-color:#F3F5FB; padding-top: 10px; margin-bottom: 5px; } .collapsable .list { margin-right: 0px; text-indent: 0px; } .collapsable .list2 { text-indent: 0px; float: right; width: 50%; } /*****************************************/ /* Layouts /*/ .layout_A .panelA { width:100%; border:1px solid #cccccc; } .square { width: 700px; margin-bottom: 0; margin-top: 10px; } .square .head { background: transparent url(../images/square/top_left.gif) top left no-repeat; width: 100%; height:5px; margin-bottom: 0; } .square .head em { float: right; background: transparent url(../images/square/top_right.gif) top right no-repeat; height: 5px; width: 95%; line-height: 0; } .square .inner { background: transparent url(../images/square/right_center.gif) right repeat-y; width: 100%; } .square .inner .block { margin: 7px 0 0 7px; } .square .inner img { margin-left: 5px; _margin-bottom: -6px; } .square .inner h1 { margin-left: -23px; margin-top: 10px; color: #EB6703 ; font-size:44px; font-family: helvetica, san-serif; position: absolute; top: 10px; left: 2; } .square .content { background: transparent url(../images/square/left_center.gif) left repeat-y; width: 100% } .square .foot { background: transparent url(../images/square/btm_left.gif) top left no-repeat; width: 100%; height:6px; _height: 0; padding: 0; margin: 0; } .square .foot em { float: right; background: transparent url(../images/square/btm_right.gif) bottom right no-repeat; height:6px; _height:6px; width: 95%; line-height: 0; margin: 0; } .square #join_now { position: absolute; top: 195px; left: 100px; } .square .button, .square button span { background: transparent url(../images/common/buttons/splash_left.gif) no-repeat center left; padding: 0 0 0 10px; display: block; height: 30px; white-space: nowrap; } .square .button span, .square button span em { background: transparent url(../images/common/buttons/splash_right.gif) no-repeat center right; font: bold 15px/30px Arial, Helvetica, sans-serif; padding: 0 ; display: block; } .box_a { width: 700px; font: 12px/160% arial, verdana, sans-serif; color: #333; margin-top: 40px; margin: 0px; } .box_a .head { background: transparent url(../images/box_a/top_left.gif) top left no-repeat; width: 100%; height:5px; margin-bottom: 0;} .box_a .head em { float: right; background: transparent url(../images/box_a/top_right.gif) top right no-repeat; height: 5px; width: 95%; line-height: 0; } .box_a .content { background: transparent url(../images/box_a/left_center.gif) left repeat-y; width: 100% } .box_a p { margin-left: 10px; margin-bottom: 3px; color: #FFFFFF; font-size: 14px; } .box_a .outer { background: transparent url(../images/box_a/right_center.gif) right repeat-y; width: 100%; padding: 7px 0 ;} .box_a .outer h1 { margin-left: -23px; margin-top: 10px; position: absolute; top: 10px; left: 2; } .box_a .inner { margin: 0 10px ; } #center .box_a .content .inner em { font-style: normal; color: #fff; font-weight: bold; } /*#EB6703*/ .box_a .last #join_now { margin: 5px 0 0 25px; } .box_a .foot { background: transparent url(../images/box_a/btm_left.gif) top left no-repeat; width: 100%; height:6px; _height: 0; padding: 0; margin: 0; } .box_a .foot em { float: right; background: transparent url(../images/box_a/btm_right.gif) bottom right no-repeat; height:6px; _height:6px; width: 95%; line-height: 0; margin: 0; } .box_a .button, .box_a button span { background: transparent url(../images/common/buttons/splash_left.gif) no-repeat center left; padding: 0 0 0 10px; display: block; height: 30px; white-space: nowrap; } .box_a .button span, .box_a button span em { background: transparent url(../images/common/buttons/splash_right.gif) no-repeat center right; font: bold 15px/30px Arial, Helvetica, sans-serif; padding: 0 20px 0 2px; display: block; } .box_b { width:85%; margin: 10px auto 0 auto; font-size: 11px; color: #fff; text-align:left; } .box_b .head { background: transparent url(../images/box_b/top_left.gif) top left no-repeat; width: 100%; height:5px; margin-bottom: 0;} .box_b .head em { float: right; background: transparent url(../images/box_b/top_right.gif) top right no-repeat; height: 5px; width: 95%; line-height: 0; } .box_b .content { background: transparent url(../images/box_b/left_center.gif) left repeat-y; width: 100% } .box_b .outer { background: transparent url(../images/box_b/right_center.gif) right repeat-y; width: 100%; padding: 7px 0 ;} .box_b .outer h1 { margin-left: -23px; margin-top: 10px; position: absolute; top: 10px; left: 2; } .box_b .inner { margin: 0 10px ; } .box_b .inner .list ul { margin: 0 15px 0 15px; padding: 0; } .box_b .inner .list .foot { display: none; } .box_b .inner h6 { color: #fff; text-align: center; margin: 0; padding: 0; } #center .box_b .content .inner em { font-style: normal; color: #EB6703; font-weight: bold; } .box_b .last #join_now { margin: 10px 0 0 25px; } .box_b .foot { background: transparent url(../images/box_b/btm_left.gif) top left no-repeat; width: 100%; height: 6px; _height: 0; padding: 0; margin: 0; } .box_b .foot em { float: right; background: transparent url(../images/box_b/btm_right.gif) bottom right no-repeat; height:6px; _height:6px; width: 95%; line-height: 0; margin: 0; } .box_e { width:85%; margin: 10px auto 0 auto; font-size: 14px; color: #fff; text-align:left; } .box_e .head { background: transparent url(../images/box_e/top_left.gif) top left no-repeat; width: 100%; height:5px; margin-bottom: 0; } .box_e .head em { float: right; background: transparent url(../images/box_e/top_right.gif) top right no-repeat; height: 5px; width: 95%; line-height: 0; } .box_e .content { background: transparent url(../images/box_e/left_center.gif) left repeat-y; width: 100% } .box_e .outer { background: transparent url(../images/box_e/right_center.gif) right repeat-y; width: 100%; padding: 7px 0 ;} .box_e .outer h1 { margin-left: -23px; margin-top: 10px; position: absolute; top: 10px; left: 2; } .box_e .inner { margin: 0 10px ; } .box_e .inner .list ul { margin: 0 0 0 15px; padding: 0; } .box_e .inner .list .foot { display: none; } .box_e .inner h6 { color: #333; text-align: center; margin: 0; padding: 0; } #center .box_e .content .inner em { font-style: normal; color: #EB6703; font-weight: bold; } .box_e .last #join_now { margin: 10px 0 0 25px; } .box_e .foot { background: transparent url(../images/box_e/btm_left.gif) top left no-repeat; width: 100%; height: 6px; _height: 0; padding: 0; margin: 0; } .box_e .foot em { float: right; background: transparent url(../images/box_e/btm_right.gif) bottom right no-repeat; height:6px; _height:6px; width: 95%; line-height: 0; margin: 0; } #join_now { width:130px; } #translate { position: absolute; top: 55px; right: 150px; width:85px; text-align:center; padding: 0; display: none; } #translate a { color: #333; } #translate .button, #translate button span { background: transparent url(../images/common/buttons/sml_left.gif) no-repeat center left; height:23px; } #translate .button span, #translate button span em { background: transparent url(../images/common/buttons/sml_right.gif) no-repeat center right; height:23px;} /** pages **/ .features .featured { padding: 10px; margin: } .features .hilite { background-color: #fff; } .features .stack { margin-right:2px } .features .last { margin-right: 0; } .features .last .featured { margin-left: 10px; } #index { } #index .features .featured p { font: 14px/140% arial, verdana, helvetica, sans-serif; } #index .features .featured .opening { padding-right: 20px; } #index .features .featured .opening em { font-weight:bold; } #index .features .featured .opening p { font: 18px/140% arial, verdana, helvetica, sans-serif; } #index .features .featured h4 { font-size: 14px; } #index .features .featured h4 { font-size: 14px; } #payroll_index #center, #index #center { margin-top: 5px; } #payroll_index #callout_blocks .stack .box { background-color: #FFFFFF; background-image: url(../images/splash/employerchef.gif); background-repeat: no-repeat; background-position: left bottom; } #payroll_index #callout_blocks .last .box { background-color: #FFFFFF; background-image: url(../images/splash/employee.gif); background-repeat: no-repeat; background-position: right bottom; } #payroll_index #callout_blocks .stack .head { background: #fff url(../images/box_d/top_left.gif) no-repeat top left; } #payroll_index #callout_blocks .stack .head h6 { padding-bottom: 2px; padding-top: 2px; margin: 0 0 0 10px; background: transparent url(../images/box_d/top_right.gif) no-repeat top right; font-weight: normal; font-size:14px; color:#4B5077; } #payroll_index #callout_blocks .stack .head h6 a { color:#4B5077; } #payroll_index #callout_blocks .stack p { margin-left: 72px; margin-right: 0; } #payroll_index #callout_blocks .last p { margin-left: 0; margin-right: 10px; } #payroll_index #callout_blocks .last .button { float:left; margin-top: 3px; margin-right: 0; margin-bottom: 0; margin-left: 25px; } #payroll_index #callout_blocks .stack .content, #payroll_index #callout_blocks .stack .foot { padding: 10px; } #payroll_index #callout_blocks .stack .content { padding-bottom: 0; } #payroll_index #callout_blocks .stack .foot { padding-top: 0; padding-bottom: 15px; } #payroll_index #callout_blocks { margin-top: 15px; _margin-top: 5px; } #payroll_index #callout_blocks p { margin-bottom: 0; } #payroll_index #callout_blocks .stack.last { float: right; } #payroll_index #callout_blocks .button { float: right; width:100px; } #payroll_index #callout_blocks .button, #payroll_index #callout_blocks button span { background: transparent url(../images/common/buttons/sml_left.gif) no-repeat center left; height:23px; padding-top: 0px; margin-top: 25px; } #payroll_index #callout_blocks .button span, #payroll_index #callout_blocks button span em { background: transparent url(../images/common/buttons/sml_right.gif) no-repeat center right; height:23px;} #payroll_index .box_a { margin-top: 10px; } #payroll_index .square, #index .square { margin-bottom: 10px; margin-top: 15px; } #payroll_index .square .stack { margin-top: 15px; } #payroll_index .square .last { width: 300px; margin-left: 40px; margin-bottom: 0px; margin-top: 10px;} #payroll_index .square { background: transparent url(../images/splash/.gif) no-repeat 5px 5px;} #payroll_index .square .block p, #index .block p { font-size:18px; font-weight: normal; line-height: 120%; font-family: helvetica, san-serif; color: #004F90; margin-bottom:10px; } #payroll_index .block em, #index .block em { font-style: normal; color: #EB6703 ; margin: 0; padding:0 ; height: 1px;} #payroll_products p em { font-style: normal; font-weight:bold; } #payroll_employee_benefits .box_a, #payroll_employee_benefits .box_b, #payroll_employee_benefits .box_e { margin: 0 0 10px 0; } #payroll_employee_benefits .box_b p { margin: 0 0 2px 0; } #payroll_employee_benefits #right_col .last img { margin: 0 0 10px 0; } #payroll_employee_benefits .box_b, #payroll_employee_benefits .box_e { width: 100%; float: right; font-size:14px;} #payroll_employee_benefits #luma_card { width: 100%; text-align: center; margin-bottom: 20px; } #payroll_employee_benefits .selected table { width: 93%; margin-top: 0; margin-right: 10px; margin-bottom: 0; margin-left: 10px; } #payroll_employee_benefits .selected td { background: #fff; } #payroll_employee_benefits .selected th { background: transparent; padding: 0; } #payroll_employee_benefits #compare_cost .head { background: transparent url(../images/box_g/top_left.gif) no-repeat top left; } #payroll_employee_benefits #compare_cost .head h6 { background: transparent url(../images/box_g/top_right.gif) no-repeat top right; } #payroll_employee_benefits #compare_cost .content, #payroll_employee_benefits #compare_cost .foot { background: #FCF9E8; } #payroll_employer_benefits h6 a, #our_products h6 a { padding-right: 10px; background: transparent url(../images/common/buttons/jump_arrow.gif) no-repeat center right; } #payroll_employee_benefits .selected h6 a, #payroll_employer_benefits .selected h6 a, #our_products h6 a.selected { background-image: none; } #payroll_employee_benefits #right_col .box_a .last, #payroll_employer_benefits #right_col .box_a .last, #our_products #right_col .box_a .last { float: left; } #payroll_employee_benefits #right_col .last, #payroll_employer_benefits #right_col .last, #our_products #right_col .last { float: right; } #employee_benefits { } #employer_benefits { } #payroll_employer_benefits .list .note, #payroll_employee_benefits .list .note { margin-right: 40px; display: block; font: bold 11px/140%arial, verdana, helvetica, sans-serif; color:#004F90; } #how_it_works { } #payroll_how_it_works .box_b { margin: 20px 0 0 0; width:100%; font-size: 14px; } #payroll_how_it_works .box_b p { margin: 0; } #payroll_how_it_works .box_b a { color: #fff; font-weight:bold; } #payroll_how_it_works .box_a { margin-top: 10px; } #payroll_how_it_works #right_col .last { text-align: right; } #payroll_how_it_works p .note { margin: 5px 70px 0 20px ; display: block; font: 11px/140% arial, verdana, helvetica, sans-serif; color:#014E8F; } #payroll_how_it_works p em { font-style: normal; } #contact_us { } #payroll_contact_us p, #contact_us p { margin: 0; padding: 0; } #payroll_contact_us .text, #contact_us .text { width: 230px; } #payroll_contact_us .textarea, #contact_us .textarea { width: 270px; height: 120px; } #payroll_contact_us button, #contact_us button { margin-left: 148px; } #about_us { } #payroll_employer_benefits #pagebox .panels #center #right_col .box .content .block collapsable .box .stack divide_6x4 #box_block1 #block1 .list style1 table { width: 50%; }