* { margin: 0; padding: 0; border: none; } body { font: 11px Verdana, Arial, Helvetica, sans-serif; line-height: 1; } ol, ul { list-style: none; } input, textarea { font: 11px Verdana, Arial, Helvetica, sans-serif; } a { color: #f00; text-decoration: none; cursor: pointer; } a:hover { text-decoration: none; } :focus { outline: 0; } #wrapper { margin: 0 auto; padding-top: 50px; width: 937px; position: relative; } /* HEAD RULES */ #head { margin: 0 auto; width: 937px; /*height: 90px;*/ position: relative; } #head div { padding-top: 18px; float: right; text-align: right; } #head a { float: right; color: #707070; font-size: 10px; line-height: 24px; } #head a:hover { color: #f00; text-decoration: underline; } #head a.twitter { width: 24px; background: url(../images/sprite_social_icons_small.gif) no-repeat -48px 0; text-align: left; text-indent: -9999px; } #head a.twitter:hover { background-position: -48px -24px; } #head a.facebook { width: 24px; background: url(../images/sprite_social_icons_small.gif) no-repeat -24px 0; text-align: left; text-indent: -9999px; } #head a.facebook:hover { background-position: -24px -24px; } #head a.flickr { width: 24px; background: url(../images/sprite_social_icons_small.gif) no-repeat 0 0; text-align: left; text-indent: -9999px; } #head a.flickr:hover { background-position: 0 -24px; } #head p { width: 564px; } #head ul { padding-top: 25px; width: 564px; } #head li { margin-left: 25px; display: inline; float: right; } #head li.first { margin: 0; } #head li a { margin: 0; height: 26px; display: block; float: none; background-image: url(../images/sprite_nav.gif); text-align: left; text-indent: -9999px; } #logo { width: 145px; height: 111px; position: absolute; top: 0; left: 0; z-index:100; display: block; text-indent: -9999px; background: url(../images/logo_o3.png) no-repeat 0 0; } a#nav_news { width: 41px; background-position: -457px 0; } a#nav_news:hover { background-position: -457px -26px; } a#nav_news_active { width: 41px; background-position: -457px -52px; } a#nav_blog { width: 37px; background-position: -266px 0; } a#nav_blog:hover { background-position: -266px -26px; } a#nav_blog_active { width: 37px; background-position: -266px -52px; } a#nav_work { width: 78px; background-position: -188px 0; } a#nav_work:hover { background-position: -188px -26px; } a#nav_work_active { width: 78px; background-position: -188px -52px; } a#nav_products { width: 67px; background-position: -303px 0; } a#nav_products:hover { background-position: -303px -26px; } a#nav_products_active { width: 67px; background-position: -303px -52px; } a#nav_about { width: 71px; background-position: -41px 0; } a#nav_about:hover { background-position: -41px -26px; } a#nav_about_active { width: 71px; background-position: -41px -52px; } a#nav_home { width: 41px; background-position: 0 0; } a#nav_home:hover { background-position: 0 -26px; } a#nav_home_active { width: 41px; background-position: 0 -52px; } /* HOME PAGE RULES */ #home_list { margin: 0 auto 35px; width: 937px; position: relative; } #home_list h4 { margin-bottom: 20px; color: #f00; font-size: 14px; font-weight: 100; text-transform: uppercase; } #home_list ul { width: 937px; } #home_list li { width: 299px; display: inline; float: left; position: relative; } #home_list h3 { height: 40px; color: #f00; font-size: 14px; line-height: 18px; } #home_list h3 a { color: #f00; } #home_list h3 a:hover { text-decoration: underline; } #home_list p { margin-bottom: 5px; font-size: 10px; line-height: 18px; } #home_list img { margin-bottom: 7px; } #home_list div a { font-size: 11px; text-decoration: underline; color: #f00; } #home_list div div { padding-top: 3px; width: 140px; float: left; line-height: 16px; } #home_list a.rss { width: 24px; height: 24px; display: block; position: absolute; top: -3px; right: 0; background: url(../images/sprite_icons.gif) no-repeat 0 -666px; text-indent: -9999px; } #home_list a.rss:hover { background-position: 0 -690px; } #home_list a.comments { padding: 7px 0 0 29px; height: 17px; float: right; background: url(../images/sprite_icons.gif) no-repeat 0 0; color: #707070; text-align: right; text-decoration: none; } #home_list a.comments:hover { background-position: 0 -24px; color: #f00; text-decoration: underline; } #home_list .date { margin: 0; padding: 10px; height: 38px; width: 23px; position: absolute; z-index: 10; background: url(../images/sprite_talkies.gif) no-repeat 0 -305px; font-size: 16px; font-weight: 700; color: #fff; line-height: 10px; text-align: center; } #home_list .date span { margin-bottom: 5px; display: block; color: #fff; font-size: 10px; } /* BLOG RULES */ #blog_left { margin-bottom: 40px; width: 743px; display: inline; float: left; } .post { width: 743px; position: relative; z-index: 100; } .post_content { width: 558px; display: inline; float: right; } .post_content h1, .post_content h2, .post_content h3, .post_content h4 { margin-bottom: 20px; color: #000; } .post_content h1 { padding: 9px 0 0 9px; height: 27px; width: 550px; color: #707070; background-color: #efefef; font-size: 14px; text-transform: uppercase; } .post_content h2 { font-size:14px; } .post_content h3 { font-size:13px; } .post_content h4 { font-size:11px; } .post_content ul, .post_content ol { margin-bottom: 20px; padding: 0 10px 0 25px; list-style-position: inside; } .post_content ul { list-style: disc; } .post_content ol { margin-left: 20px; list-style: decimal; } .post_content li { margin-bottom: 15px; line-height: 18px; } .post_content img { margin-bottom: 20px; } .post_content p { margin-bottom: 20px; padding: 0 10px; font-size: 11px; line-height: 18px; } .post_content blockquote { margin: 0 0 20px 10px; padding: 15px; background: url(../images/bg_rule_2.gif) repeat 0 0; font-size: 11px; line-height: 18px; } .post_content a { color: #f00; clear: both; } .post_content h1 a { color: #707070; font-weight: normal; } .post_content a:hover { text-decoration: underline; } .post_content a.btn_read_more { margin-bottom: 15px; padding: 8px 30px 10px 0; display: inline; float: right; background: url(../images/sprite_icons.gif) no-repeat 100% -521px; font-size: 10px; color: #707070; text-transform: uppercase; font-weight: 700;} .post_content a.btn_read_more:hover { background-position: 100% -545px; color: #f00; text-decoration: none;} .img_left { margin-right: 20px; float: left; display: inline;} .img_right { margin-left: 20px; float: right; display: inline; } p.co_image { margin: 0 0 20px; padding: 0; color: #eee; font-size: 11px; text-align: center; } p.co_image .co_image img { display: block; } .co_image_left img { margin: 0 20px 0 0; padding-right: 6px; background: url(../images/rule_vert.gif) repeat-y 100% 0; } .co_image_right img { margin: 0 0 0 20px; padding-left: 6px; background: url(../images/rule_vert.gif) repeat-y 0 0; } .co_image_center img { margin: 0 auto 20px; } .meta { width: 184px; min-height: 245px; display: inline; float: left; } .meta a { color: #707070; } .meta h3 { margin-bottom: 10px; padding: 6px 0 0 31px; color: #707070; height: 18px; background: url(../images/sprite_icons.gif) no-repeat 0 -96px; font-size: 11px; } .meta_date { margin-bottom: 16px; padding: 8px 0 0 10px; height: 44px; width: 174px; color: #fff; background: url(../images/sprite_talkies.gif) no-repeat 0 0; font-size: 14px; text-transform: uppercase; } .meta_cat { font-size: 11px; } .meta_cat li { line-height: 22px; } .meta_cat a { padding-left: 30px; line-height: 22px; background: url(../images/sprite_icons.gif) no-repeat 7px -383px; } .meta_cat a:hover { color: #f00; background-position: 7px -337px; } .action { padding: 0; width: 184px; position: absolute; bottom: 15px; left: 0; z-index: 3000; } .action li { margin-bottom: 7px; height: 24px; list-style: none; } .action li a { padding: 7px 0 0 31px; width: 153px; height: 17px; display: block; color: #707070; background-image: url(../images/sprite_icons.gif); background-repeat: no-repeat; font-size: 11px; } .action li a:hover { color: #f00; text-decoration: underline; } .action_detail { bottom: 10px; } a.action_visit_site { background-position: 0 -192px; } a.action_visit_site:hover { background-position: 0 -216px; } a.action_case_study { background-position: 0 -144px; } a.action_case_study:hover { background-position: 0 -168px; } a.action_comments { background-position: 0 0; } a.action_comments:hover { background-position: 0 -24px; } a.action_add_this { background-position: 0 -48px; } a.action_add_this:hover { background-position: 0 -72px; } #pagination { padding: 7px 0 0; width: 743px; color: #707070; position: relative; font-size: 10px; font-weight: 700; text-align: center; text-transform: uppercase; } #pagination a { position: absolute; top: 0; z-index: 10; color: #707070; font-size: 10px; font-weight: 700; text-align: center; text-transform: uppercase; } #pagination a:hover { text-decoration: underline; color: #f00; } #pagination a.inactive { color: #ccc; } #pagination a#previous { padding: 7px 0 10px 30px; left: 0; background: url(../images/sprite_icons.gif) no-repeat 0 -474px; text-align: left; } #pagination a#previous:hover { background-position: 0 -498px; text-decoration: none; } #pagination a#previous.inactive:hover { background-position: 0 -474px; text-decoration: none; } #pagination a#next { padding: 7px 30px 10px 0; right: 0; background: url(../images/sprite_icons.gif) no-repeat 100% -522px; text-align: right; } #pagination a#next:hover { background-position: 100% -546px; text-decoration: none; } #pagination a#next.inactive:hover { background-position: 100% -522px; text-decoration: none; } #comments { width: 743px; float: right; display: inline; position: relative; font-size: 11px; color: #000; line-height: 16px; } .comment p { margin-left: 184px; padding: 21px 22px 19px 41px; width: 496px; background: #efefef url(../images/blog_comment_quote.gif) no-repeat 19px 19px; } .comment div { margin-left: 184px; padding: 10px 0 0 41px; height: 39px; background: url(../images/blog_comment_bubble.gif) no-repeat 0 0; } .comment a.author { margin-left: 10px; color: #f00; font-weight: 700; text-decoration: underline; } #comment_processing, #comment_complete, #comment_form { width: 743px; float: left; display: inline; position: relative; } #comment_form h2 { padding: 10px 0 0 10px; height: 50px; width: 174px; float: left; display: inline; color: #fff; background: url(../images/sprite_talkies.gif) no-repeat 0 0; font-size: 14px; text-transform: uppercase; } #comment_form span { color: #f00; font-size: 11px; } #comment_form span.hint { display: none; } #comment_form input { margin-right: -8px; padding: 6px; height: 14px; color: #000; width: 300px; background: url(../images/sprite_inputs.gif) no-repeat scroll 0 0; } #comment_form label { margin: 8px 0 20px 92px; float: left; display: inline; color: #000; font-size: 11px; } #comment_form textarea { padding: 10px 5px; height: 130px; width: 290px; background: transparent url(../images/sprite_inputs.gif) no-repeat scroll 0 -52px; color: #000; } #comment_form .input_capture { margin: 0 0 20px 185px; } #comment_submit { margin-left: 429px; padding-bottom: 37px; } #required_head { margin-bottom: 24px; padding: 13px 15px 0 0; height: 23px; width: 543px; float: right; display: inline; background: #efefef; font-weight: 700; text-align: right; } #comment_processing { padding-left: 185px; width: 220px; position: absolute; top: 72px; left: 0; z-index: 100; } #comment_complete { padding-left: 185px; width: 558px; position: absolute; top: 72px; left: 0; z-index: 100; } #comment_processing p, #comment_complete p { color: #000; font-size: 11px; } #blog_right #recent_posts a { margin-bottom: 1px; height: 50px; width: 174px; display: block; background: url(../images/sprite_recent_posts.gif) no-repeat 0 0; text-indent: -9999px; } #blog_right #recent_posts a:hover, #blog_right #recent_posts a.active { background-position: 0 -50px; } #sub_nav { margin-bottom: 20px; padding: 13px 0 12px; width: 174px; background: #efefef; } #sub_nav h2 { margin-bottom: 10px; padding: 3px 0 4px 50px; width: 124px; min-height: 17px; color: #707070; background: url(../images/sprite_icons.gif) no-repeat 14px -450px; font-size: 14px; font-weight: 700; text-transform: uppercase; } #sub_nav ul { padding-left: 20px; width: 154px; } #sub_nav li a { padding-left: 30px; color: #707070; display: block; background: url(../images/sprite_icons.gif) no-repeat 0 -378px; font: 11px/22px Arial, Helvetica, sans-serif; } #sub_nav li a:hover { color: #f00; background-position: 0 -332px; } #sub_nav li a.active { color: #f00; background-position: 0 -332px; } #social a { margin-bottom: 15px; width: 174px; height: 53px; display: block; background-image: url(../images/sprite_nav_social.jpg); text-indent: -9999px; } a#twitter { background-position: 0 0; } a#twitter:hover { color: #f00; background-position: 0 -53px; } a#facebook { background-position: 0 -106px; } a#facebook:hover { color: #f00; background-position: 0 -159px; } a#rss { background-position: 0 -212px; } a#rss:hover { color: #f00; background-position: 0 -265px; } #blog_right h3 { line-height: 20px; color: #707070; font-size: 14px; text-transform: uppercase; } /* EMPLOYMENT RULES */ #employment { margin: 0 auto; padding-top: 50px; width: 937px; } #employment h1 { margin-bottom: 20px; color: #f00; font-size: 18px; font-weight: 100; text-transform: uppercase; } #employment img { margin-bottom: 21px; display: block; } #employment #main { margin-bottom: 40px; width: 743px; display: inline; float: left; } #employment .post_content h1 { margin-bottom: 17px; padding: 9px 0 0 9px; height: 27px; width: 548px; background-color: #efefef; } #employment .post_content a.apply_now { padding:13px 15px 10px 30px; position:absolute; right:0; top:0; z-index:1000; font-size: 10px; font-weight: 700; float: right; background: url(../images/sprite_icons.gif) no-repeat 0 -244px; } #employment .post_content a.back_to_top { float: right; display: inline; padding-right: 15px; font-size: 10px; } #employment #sidebar { margin-top: 0; } #employment #sub_nav li a.active { color: #f00; } #employment .post_content h3 { margin: 0 0 5px; padding: 0 10px; color: #FF0000; } /* MOBILE RULES */ .mobile_wrap { padding-bottom: 40px; } .mobile_wrap h1 { color: #FF0000; font-size: 18px; font-weight: 100; text-transform: uppercase; } ul#mobile { width: 639px; float: left; list-style: none; } #mobile li { margin: 0 20px 20px 0; padding: 0 0 10px; width: 639px; background: url("../images/bg_rule.gif") repeat-x scroll 0 100% transparent; } #mobile li div.left { margin: 0 40px 0 0; float: left; width: 235px; height: 485px; } #mobile li div.right { width: 344px; float: left; } #mobile li div h2 { padding: 0 0 20px; font-size: 14px; color: #FF0000; text-transform: uppercase; } #mobile li div p { padding: 0 0 40px; font-size: 11px; line-height: 18px; } #mobile li div h4 { padding: 0 0 20px; font-size: 14px; color: #707070; text-transform: uppercase; } #mobile_sidebar { width: 298px; float: left; } #mobile_sidebar h2 { padding: 0 0 20px; font-size: 14px; color: #FF0000; text-transform: uppercase; } #mobile_sidebar h3 { padding: 0 0 10px; font-size: 14px; color: #FF0000; text-transform: uppercase; } #mobile_sidebar p { padding: 0 0 20px; font-size: 11px; line-height: 18px; } /* SERVICES RULES */ .services_wrap { padding-bottom: 40px; } .services_wrap h1 { margin: 0 0 20px; color: #FF0000; font-size: 18px; font-weight: 100; text-transform: uppercase; } ul#services { width: 937px; list-style: none; } #services li { margin: 0 20px 0 0; padding: 0; width: 299px; display: inline; float: left; } #services li.last { margin: 0 0 0 0; } #services img { margin: 0; } #services p { margin-bottom: 15px; padding: 0 10px; font-size: 11px; line-height: 18px; } #services h2 { padding: 0 10px 20px; color: #FF0000; } #services li a.btn { margin-left: 10px; padding-right: 29px; width: 75px; display: block; color: #707070; background: url(../images/sprite_icons.gif) no-repeat 100% -521px; text-transform: uppercase; font-size: 10px; font-weight: 700; line-height: 24px; } #services li a.btn:hover { color: #f00; background-position: 100% -545px; text-decoration: none; } /* WORK RULES */ #work_nav { margin-bottom: 20px; width: 937px; position: relative; } #work_nav h2 { color: #f00; font-size: 18px; font-weight: 100; text-transform: uppercase; } #work_nav h2 a { color: #f00; } #work_nav h2 a:hover { text-decoration: underline; } #work_nav h2 img { margin: 0 15px; vertical-align: middle; } #work_nav p { width: 675px; position: absolute; top: 7px; right: 0; line-height: 28px; } #work_nav p a { margin-left: 15px; padding-left: 13px; color: #707070; float: right; background: url(../images/icon_arrow_grey.gif) no-repeat 0 12px; font-weight: 700; text-transform: uppercase; } #work_nav p a:hover { color: #f00; text-decoration: none; } #work_nav p a.active { color: #f00; background: url(../images/icon_arrow_red_down.gif) no-repeat 0 11px; } #work_nav p a.btn_clients { padding: 0; width: 134px; height: 28px; display: block; background: url(../images/btn_client_list.gif) no-repeat 0 0; text-indent: -9999px; } #contact_us a.btn_contact { padding: 0; width: 106px; height: 28px; display: block; background: url(../images/btn_contact_us.gif) no-repeat 0 0; text-indent: -9999px; } #clients { width: 937px; } #clients h3 { margin-bottom: 10px; color: #f00; font-size: 14px; font-weight: 100; text-transform: uppercase; } #clients li { margin-bottom: 15px; padding: 10px 10px 0; width: 279px; height: 196px; display: inline; float: left; position: relative; background: url(../images/bg_client_list.gif) no-repeat 0 0; } #clients li:hover div { display: block; } #clients li div { padding: 20px 20px 0; width: 239px; height: 150px; display: none; position: absolute; top: 10px; left: 10px; z-index: 1000; background: rgba(255,255,255,.95); } #clients li p { margin-bottom: 10px; line-height: 20px; } #clients li span { width: 75px; height: 75px; display: block; position: absolute; top: 10px; right: 10px; z-index: 5; background: url(../images/bg_coming_soon.png) no-repeat 0 0; text-indent: -9999px; } #clients li img { display: block; } #clients a.btn { padding-right: 29px; width: 70px; color: #707070; display: block; position: absolute; bottom: 10px; right: 10px; z-index: 1010; background: url(../images/btn_arrow.png) no-repeat 100% 0; text-transform: uppercase; font-size: 10px; font-weight: 700; line-height: 24px; } #clients a.btn:hover { color: #f00; background-position: 100% -24px; text-decoration: none; } #work_nav2 { margin-bottom: 20px; width: 937px; position: relative; } #work_nav2 h2 { color: #707070; font-size: 18px; font-weight: 100; text-transform: uppercase; } #work_nav2 h2 a { color: #f00; } #work_nav2 h2 a:hover { text-decoration: underline; } #work_nav2 h2 img { margin: 0 15px; vertical-align: middle; } #work_nav2 div { width: 150px; position: absolute; top: 0; left: 638px; } #work_nav2 a.prev { margin-right: 20px; padding: 8px 0 0 30px; color: #707070; height: 16px; display: inline; float: left; background: url(../images/sprite_icons.gif) no-repeat 0 -474px; font-size: 10px; text-transform: uppercase; font-weight: 700;} #work_nav2 a.prev:hover { color: #f00; background-position: 0 -498px; } #work_nav2 a.next { padding: 8px 30px 0 0; height: 16px; color: #707070; display: inline; float: left; background: url(../images/sprite_icons.gif) no-repeat 100% -521px; font-size: 10px; text-transform: uppercase; font-weight: 700;} #work_nav2 a.next:hover { color: #f00; background-position: 100% -545px; } #work_nav2 a.work { width: 41px; height: 23px; display: block; position: absolute; top: 0; right: 0; background: url(../images/icon_work.gif) no-repeat 0 0; text-indent: -9999px; } #work_nav2 a.client_list { width: 41px; height: 23px; display: block; position: absolute; top: 0; right: 0; background: url(../images/icon_client_list.gif) no-repeat 0 0; text-indent: -9999px; } #client_list { width: 937px; color: #707070; } #client_list p { margin-bottom: 20px; line-height: 20px; } #client_list ul { width: 937px; } #client_list li { margin-bottom: 40px; width: 468px; display: inline; float: left; } #client_list li.clear { margin-bottom: 0; width: 937px; height: 0px; display: block; float: none; clear: both; line-height: 0px; } #client_list li ul { width: 468px; } #client_list li li { margin: 0; width: 234px; line-height: 20px; } #client_list h3 { margin-bottom: 15px; font-size: 11px; } #client_list a { color: #f00; } #client_list a:hover { text-decoration: underline; } .clients {} .clients h2 { color:#FF0000; text-transform:uppercase; margin-bottom:10px; font-size:18px; } .clients table { width:100%; border-collapse:collapse; margin-bottom:15px; } .clients td { padding:15px; border-right:1px solid #f1f1f1; border-bottom:1px solid #f1f1f1; } .clients td.last { border-right:none; } .clients td.bottom { border-bottom:none; } .clients a { cursor:default; } #work_wrap { width: 937px; position: relative; } #work_left { width: 618px; } #work_left img { margin: 0 auto 20px; display: block; } #work_right { width: 299px; position: absolute; top: 0; right: 0; } #work_right h3 { color: #f00; font-size: 14px; font-weight: 100; text-transform: uppercase; } #work_right p { margin-bottom: 20px; line-height: 20px; } #project_nav { width: 299px; } #project_nav li { display: inline; float: left; } #project_nav li a { padding: 8px 0 0 30px; height: 16px; display: inline; float: left; background-image: url(../images/sprite_icons.gif); background-repeat: no-repeat; font-size: 10px; text-transform: uppercase; font-weight: 700; } #project_nav a.visit { color: #707070; background-position: 0 -192px; } #project_nav a.visit:hover { color: #f00; background-position: 0 -216px; } #project_nav a.action_add_this { color: #707070; background-position: 0 -48px; } #project_nav a.action_add_this:hover { color: #f00; background-position: 0 -72px; } #contact_us a.btn_contact { padding: 0; width: 162px; height: 33px; display: block; background: url(../images/btn_contact_us.gif) no-repeat 0 0; text-indent: -9999px; } #related { margin-bottom: 15px; padding: 15px; width: 269px; position: relative; background: #efefef; } #related h4 { color: #707070; font-size: 14px; font-weight: 100; text-transform: uppercase; } #related li { margin-bottom: 10px; padding-left: 15px; background: url(../images/icon_arrow_red.gif) no-repeat 0 7px; } #related li p { margin: 0; line-height: 18px; } #related li strong { margin-bottom: 3px; display: block; color: #f00; text-transform: uppercase; } #related li a:hover { text-decoration: underline; } #related span { width: 15px; height: 15px; display: block; position: absolute; bottom: -15px; left: 15px; background: url(../images/icon_talkie_bottom.gif) no-repeat 0 0; } #other_clients { margin: 0 auto 20px; width: 937px; } #other_clients h4 { color: #f00; font-size: 18px; font-weight: 100; text-transform: uppercase; } #more_work { width: 937px; height: 206px; position: relative; } #more_work .btn { width: 53px; height: 53px; display: block; position: absolute; top: 75px; z-index: 3000; background-image: url(../images/case_studies/sprite_home_buttons.png); background-repeat: no-repeat; text-indent: -9999px; } #prev_case { left: -26px; } #prev_case:hover { background-position: 0 -53px; } #next_case { right: -26px; background-position: -53px 0; } #next_case:hover { background-position: -53px -53px; } #slide_wrap { width: 937px; height: 206px; position: relative; z-index: 100; overflow: hidden; } #slide { height: 206px; position: absolute; z-index: 100; } #slide h3 { margin-bottom: 10px; color: #f00; font-size: 14px; font-weight: 100; text-transform: uppercase; } #slide li { margin-bottom: 15px; padding: 10px 10px 0; width: 279px; height: 196px; display: inline; float: left; position: relative; background: url(../images/bg_client_list.gif) no-repeat 0 0; } #slide li:hover div { display: block; } #slide li div { padding: 20px 20px 0; width: 239px; height: 150px; display: none; position: absolute; top: 10px; left: 10px; z-index: 1000; background: rgba(255,255,255,.95); } #slide li p { margin-bottom: 10px; line-height: 20px; } #slide li span { width: 75px; height: 75px; display: block; position: absolute; top: 10px; right: 10px; z-index: 5; background: url(../images/bg_coming_soon.png) no-repeat 0 0; text-indent: -9999px; } #slide li img { display: block; } #slide a.btn { padding-right: 29px; width: 70px; height: auto; display: block; position: absolute; top: auto; bottom: 10px; right: 10px; z-index: 1010; background: url(../images/btn_arrow.png) no-repeat 100% 0; text-transform: uppercase; font-size: 10px; font-weight: 700; line-height: 24px; text-indent: 0; } #slide a.btn:hover { color: #f00; background-position: 100% -24px; text-decoration: none; } /* NEWS RULES */ h1#news { color: #f00; font-size: 18px; font-weight: 100; text-transform: uppercase; } #news_left { width: 618px; } #news_left h2 { margin-bottom: 10px; color: #f00; font-size: 14px; font-weight: 100; text-transform: uppercase; } #news_left h2 a { color: #f00; } #news_left h2 a:hover { text-decoration: underline; } #news_left li { margin-bottom: 5px; padding: 10px; width: 598px; background: #f7f7f7; } #news_left li.alt { background: #fff; } #news_left li.rule { margin-bottom: 5px; padding: 0; height: 5px; width: 100%; background: url(../images/bg_rule.gif) repeat-x 0 0; line-height: 0; font-size: 0; } #news_left p { margin-bottom: 10px; line-height: 20px; } #news_left a:hover { text-decoration: underline; } #news_left strong { margin-bottom: 5px; line-height: 18px; display: block; color: #707070; } #news_left a.btn { padding-right: 29px; width: 70px; color: #707070; display: block; background: url(../images/btn_arrow.png) no-repeat 100% 0; text-transform: uppercase; font-size: 10px; font-weight: 700; line-height: 24px; } #news_left a.btn:hover { color: #f00; background-position: 100% -24px; text-decoration: none; } #news_pagination { margin: -5px 0 20px; padding: 0; width: 618px; position: relative; font-size: 10px; color: #707070; font-weight: 700; text-align: center; text-transform: uppercase; line-height: 45px; } #news_pagination a { color: #707070; position: absolute; top: 10px; z-index: 10; font-size: 10px; font-weight: 700; text-align: center; text-transform: uppercase; line-height: 24px; } #news_pagination a:hover { color: #f00; text-decoration: none; } #news_pagination a.inactive { color: #ccc; } #news_pagination a#previous { padding: 0 0 0 30px; left: 0; background: url(../images/sprite_icons.gif) no-repeat 0 -474px; text-align: left; } #news_pagination a#previous:hover { background-position: 0 -498px; text-decoration: none; } #news_pagination a#next { padding: 0 30px 0 0; right: 0; background: url(../images/sprite_icons.gif) no-repeat 100% -522px; text-align: right;; } #news_pagination a#next:hover { background-position: 100% -546px; text-decoration: none; } #news_detail { width: 618px; } #news_detail h2 { margin-bottom: 10px; color: #f00; font-size: 14px; font-weight: 100; text-transform: uppercase; } #news_detail p { margin-bottom: 15px; line-height: 20px; } #news_detail p.co_image { width: 300px; } #news_detail p.co_image_right { margin-left: 15px; } #news_detail p.co_image_left { margin-right: 15px; } #news_detail ul { margin-bottom: 10px; padding-left: 15px; list-style: circle outside none; line-height: 20px; } #news_detail ol { margin-bottom: 10px; padding-left: 15px; list-style: decimal outside none; line-height: 20px; } #news_detail strong.date { margin-bottom: 5px; display: block; color: #707070; } #news_right { width: 299px; } #recent_blog { position: relative; } #recent_blog h4 { margin-bottom: 20px; color: #f00; font-size: 14px; font-weight: 100; text-transform: uppercase; } #recent_blog li { padding: 7px 10px 10px; background: #f7f7f7; } #recent_blog li.alt { background: #fff; } #recent_blog li p { padding-left: 15px; background: url(../images/icon_arrow_grey.gif) no-repeat 0 6px; line-height: 18px; } #recent_blog li strong { margin-bottom: 3px; display: block; color: #707070; text-transform: uppercase; } #recent_blog li a:hover { text-decoration: underline; } #recent_blog a.rss { width: 24px; height: 24px; display: block; position: absolute; top: -3px; right: 0; background: url(../images/sprite_icons.gif) no-repeat 0 -666px; text-indent: -9999px; } #recent_blog a.rss:hover { background-position: 0 -690px; } #recent h4 { color: #f00; font-size: 14px; font-weight: 100; text-transform: uppercase; } #recent h3 { margin-bottom: 10px; color: #f00; font-size: 14px; font-weight: 100; text-transform: uppercase; } #recent li { margin-bottom: 10px; padding: 10px 10px 0; width: 279px; height: 196px; position: relative; background: url(../images/bg_client_list.gif) no-repeat 0 0; } #recent li:hover div { display: block; } #recent li div { padding: 20px 20px 0; width: 239px; height: 150px; display: none; position: absolute; top: 10px; left: 10px; z-index: 1000; background: rgba(255,255,255,.95); } #recent li p { margin-bottom: 10px; line-height: 20px; } #recent li span { width: 75px; height: 75px; display: block; position: absolute; top: 10px; right: 10px; z-index: 5; background: url(../images/bg_coming_soon.png) no-repeat 0 0; text-indent: -9999px; } #recent li img { display: block; } #recent a.btn { padding-right: 29px; width: 70px; height: auto; display: block; position: absolute; top: auto; bottom: 10px; right: 10px; z-index: 1010; background: url(../images/btn_arrow.png) no-repeat 100% 0; text-transform: uppercase; font-size: 10px; font-weight: 700; line-height: 24px; text-indent: 0; } #recent a.btn:hover { color: #f00; background-position: 100% -24px; text-decoration: underline; } /* CONTACT RULES */ #contact_main { width: 743px; display: inline; float: left; } #contact_main h1 { margin-bottom: 20px; color: #f00; font-size: 18px; font-weight: 100; text-transform: uppercase; } #contact_main img { margin-bottom: 20px; } #contact_main p { padding: 12px 20px 15px; height: 125px; width: 275px; float: left; display: inline; background: url(../images/sprite_talkies.gif) no-repeat 0 -390px; color: #000; font-size: 11px; line-height: 18px; } #contact_form { position: relative; } #contact_form input { padding: 7px 5px 0; width: 290px; height: 19px; background: transparent url(../images/sprite_inputs.gif) no-repeat scroll 0 0; color: #000; } #contact_form label { padding-top: 10px; width: 81px; float: left; display: inline; color: #000; font-size: 11px; line-height: 16px; } #contact_form textarea { padding: 10px 5px; width: 290px; height: 130px; background: transparent url(../images/sprite_inputs.gif) no-repeat scroll 0 -52px; color: #000; } #contact_form .input_capture { margin: 0 0 20px 86px;} #contact_form .head { padding-bottom: 20px; text-align: right; } #contact_submit { margin-left: 85px; padding-bottom: 37px; } #contact_submit a { margin-right: 10px; width: 56px; height: 28px; display: inline; float: left; background: url(../images/btn_submit.gif) no-repeat 0 0; text-indent: -9999px; } #contact_submit span { float: left; line-height: 28px; } #showLoading, #showResponse { width: 388px; height: 180px; float: right; display: inline; position: relative; } #showResponse p { padding: 12px 20px 15px;; float: left; display: inline; font-size: 11px; line-height: 18px; color: #000000; background: none; } #sidebar #quick { margin: 40px 0 19px 0; padding: 0 20px; height: 223px; background: url(../images/sprite_talkies.gif) no-repeat 0 -70px; color: #fff; font-size: 11px; line-height: 18px; } #sidebar #quick h3 { margin-bottom:7px; padding-top: 14px; color: #fff; font-size: 14px; text-transform: uppercase; } #sidebar #quick a { color: #fff; } #sidebar #quick a:hover { text-decoration: underline; } /* ABOUT RULES */ .about { padding-bottom: 40px; } .about a { color: #F00; } .about h1 { margin-bottom: 15px; height: 36px; width: 230px; background: url(../images/about_head.gif) no-repeat 0 0; text-indent: -9999px; } .about div div blockquote { width: 275px; float: left; color: #f00; font-size: 18px; text-transform: uppercase; line-height: 30px; } .about div div p { padding: 0 0 10px; width: 705px; float: right; line-height: 26px; font-size: 12px; } /* PRODUCTS RULES */ .products h2 { margin: 10px 0 15px 10px; width: 300px; height: 21px; text-indent: -9999px; } .products h2.red_14px { width: auto; height: auto; text-indent: 0; } .products h2.o3ms { background: url(../images/products/header_o3ms.gif) no-repeat 0 0 } .products h2.page { background: url(../images/products/header_page_creator.gif) no-repeat 0 0; } .products h2.form { background: url(../images/products/header_form_manager.gif) no-repeat 0 0; } .products h2.blog { background: url(../images/products/header_blog_manager.gif) no-repeat 0 0; } .products h2.media { background: url(../images/products/header_media_manager.gif) no-repeat 0 0; } .products h2.ecommerce { background: url(../images/products/header_ecommerce.gif) no-repeat 0 0; } .products h2.custom { background: url(../images/products/header_custom.gif) no-repeat 0 0; } .products h2.faq { background: url(../images/products/header_faq.gif) no-repeat 0 0; } .products h2.question { background: url(../images/products/header_question.gif) no-repeat 0 0; } .products h3 { margin-bottom: 20px; } .products p { margin-bottom: 25px; line-height: 25px; } .products p a { color: #f00; } .products p a:hover { text-decoration: underline; } .products img.right { margin: 0 0 10px 20px; float: right; } .products blockquote { margin: 20px 0; color: #707070; line-height: 18px; } .products ul.prod_feat { padding-left: 15px; width: 490px; } .products ul.prod_feat li { margin-bottom: 5px; padding-left: 35px; background: url(../images/icon_product_features.gif) no-repeat 0 0; line-height: 24px; } .products ul.columns { padding-left: 15px; width: 728px; } .products ul.columns li { margin-bottom: 5px; width: 230px; display: inline; float: left; } .products ul.columns a { padding-left: 35px; color: #000; display: block; background: url(../images/sprite_icons.gif) no-repeat 0 -522px; font-weight: 700; line-height: 24px; } .products ul.columns a:hover { color: #f00; background: url(../images/sprite_icons.gif) no-repeat 0 -546px; } .products ul.thumbs { margin-bottom: -20px; padding-right: 15px; width: 190px; float: right; } .products ul.thumbs li { margin: 0 0 20px 20px; display: inline; float: left; } .products ul.thumbs a { width: 75px; height: 75px; display: block; background: #e1e1e1; } .prod_int_btm { margin-bottom: 20px; background: url(../images/bg_rule_vertical.gif) repeat-y 532px 0; } #left { width: 743px; float: left; display: inline; position: relative; } #products_sidebar { width: 174px; display: inline; float: right; } #products_sidebar ul li a { height: 53px; width: 174px; display: block; background-image: url(../images/sprite_products_subnav.gif); text-indent: -9999px; } a#o3ms_nav { background-position: 0 0; } a#o3ms_nav:hover, a#o3ms_nav.active { background-position: -176px 0; } a#noozeletter_nav { background-position: 0 -53px; } a#noozeletter_nav:hover, a#noozeletter_nav.active { background-position: -176px -53px; } a#media_kit_nav { background-position: 0 -107px; } a#media_kit_nav:hover, a#media_kit_nav.active { background-position: -176px -107px; } a#other_nav { background-position: 0 -161px; } a#other_nav:hover, a#other_nav.active { background-position: -176px -161px; } ul#o3ms_subnav { padding-top: 10px; } ul#o3ms_subnav li { background: #efefef; } ul#o3ms_subnav li.last { padding-bottom: 10px; } ul#o3ms_subnav li a { padding: 0 10px 0 40px; width: 124px; height: 21px; display: block; background: url(../images/sprite_icons.gif) no-repeat 20px -380px; line-height: 14px; text-indent: 0; } ul#o3ms_subnav li a:hover, ul#o3ms_subnav li a.active { color: #f00; background-position: 20px -334px; } #faq li { padding: 15px 20px 20px 70px; width: 653px; min-height: 47px; position: relative; } #faq li span { width: 62px; height: 65px; display: block; position: absolute; top: 0; left: 0; background: url(../images/products/bg_a.gif) no-repeat 0 0; text-indent: -9999px; } #faq li.grey { padding-bottom: 16px; background: #efefef url(../images/products/bg_faq_bottom.gif) no-repeat 0 100%; } #faq li.grey span { background: url(../images/products/bg_q.gif) no-repeat 0 0; } #faq li p { margin: 0; padding: 0 0 18px; width: 653px; height: auto; float: none; display: block; background: none; } #faq_main { width: 743px; display: inline; float: left; } #faq_main img { margin-bottom: 20px; } #faq_main p { padding: 12px 20px 15px; height: 125px; width: 275px; float: left; display: inline; background: url(../images/sprite_talkies.gif) no-repeat 0 -390px; color: #000; font-size: 11px; line-height: 18px; } #faq_form { float: right; display: inline; position: relative; } #faq_form input { padding: 7px 5px 0; width: 290px; height: 19px; background: transparent url(../images/sprite_inputs.gif) no-repeat scroll 0 0; color: #000; } #faq_form label { padding-top: 10px; width: 81px; float: left; display: inline; color: #000; font-size: 11px; line-height: 16px; } #faq_form textarea { padding: 10px 5px; width: 290px; height: 130px; background: transparent url(../images/sprite_inputs.gif) no-repeat scroll 0 -52px; color: #000; } #faq_form .input_capture { margin: 0 0 20px 86px;} #faq_form .head { text-align: right; } #faq_submit { margin-left: 332px; padding-bottom: 37px; } #faq_main #FAQProcessing, #faq_main #FAQResponce { display: none; visibility: hidden; } #faq_main #FAQResponce { float: right; position: relative; background: none; } #faq_main #FAQResponce p { margin: 0 0 20px 0; padding: 0; width: 388px; height: auto; float: none; display: block; background: none; } #noozeletter #left img { margin: 0 0 15px 90px; } #noozeletter h1 { margin-bottom: 20px; height: 52px; width: 743px; display: block; background: url(../images/header_noozeletter.gif) no-repeat 0 0; text-indent: -9999px; } #noozeletter h2 { margin-bottom: 15px; text-transform: uppercase; color: #f00; font-size: 12px; } ul.featured { width: 237px; display: inline; float: left; } ul.featured li { margin-bottom: 15px; padding-left: 20px; background: url(../images/sprite_icons.gif) no-repeat 0 -380px; line-height: 18px; } #o3ms h1 { margin-bottom: 20px; height: 52px; width: 743px; display: block; background: url(../images/header_o3ms.gif) no-repeat 0 0; text-indent: -9999px; } /* NEW PRODUCTS RULES */ #products { margin-bottom: 15px; width: 937px; } #products li { margin-right: 1px; padding-bottom: 15px; width: 233px; display: inline; float: left; } #products li.o3ms { background: #efefef url(../images/products/header_o3ms_red.gif) no-repeat 0 0; } #products h2 a { width: 233px; height: 36px; display: block; text-indent: -9999px; } #products h2 a:hover { background-position: 0 -36px; } #products p { margin-bottom: 15px; padding: 0 10px; font-size: 11px; line-height: 18px; } #products a.btn { margin-left: 10px; padding-right: 29px; width: 75px; display: block; color: #707070; background: url(../images/sprite_icons.gif) no-repeat 100% -521px; text-transform: uppercase; font-size: 10px; font-weight: 700; line-height: 24px; } #products a.btn:hover { color: #f00; background-position: 100% -545px; text-decoration: none; } #products a.btn_grey { background: url(../images/btn_read_more_grey.gif) no-repeat 100% 0; } #products a.btn_grey:hover { background-position: 100% -24px; } #products img { display: block; } #products .marketing { background: url(../images/products/header_market_strategy.gif) no-repeat 0 0; } #products .design { background: url(../images/products/header_design.gif) no-repeat 0 0; } #products .technology { background: url(../images/products/header_technology.gif) no-repeat 0 0; } #products .o3ms { background: url(../images/products/header_o3ms_red.gif) no-repeat 0 0; } #products .o3ms:hover { background-position: 0 0; } #service_nav { margin-bottom: 10px; width: 937px; height: 52px; background: url("../images/bg_work_nav.gif") repeat-x scroll 0 0; } #service_nav li { width: 185px; position: relative; } #service_nav li:hover div { display: block; } #service_nav li a { width: 185px; height: 52px; display: block; background: url(../images/header_services.gif) no-repeat 0 0; text-indent: -9999px; } #service_nav div { padding-bottom: 16px; display: none; position: absolute; top: 36px; left: 0; z-index: 4000; background: url(../images/bg_red_nav_arrow.gif) no-repeat 0 100%; } #service_nav ul { padding: 0 0 16px 12px; background: #f00; } #service_nav ul li { width: auto; } #service_nav ul li a { padding: 10px 0 10px 20px; width: 152px; height: auto; color: #fff; background: url(../images/sprite_icons.gif) no-repeat 0 -282px; text-indent: 0; } #service_nav ul li a:hover { text-decoration: underline; } #service { width: 937px; } #service h1 { margin-bottom: 20px; color: #f00; font-size: 22px; text-transform: uppercase; } #service img { margin: 0 0 15px 15px; float: right; } #service_left { padding-left: 10px; width: 608px; display: inline; float: left; } #service_left p { margin-bottom: 20px; font-size: 12px; line-height: 22px; } #service_left p a { color: #f00; } #service_left p a:hover { text-decoration: underline; } #service_right { width: 280px; display: inline; float: right; } #service_right h3 { margin-bottom: 10px; color: #707070; font-size: 14px; text-transform: uppercase; } #accordion { margin-bottom: 20px; font-size: 11px; } #accordion .toggler { margin-bottom: 10px; color: #f00; background: url(../images/sprite_accordion.gif) no-repeat 100% 0; font-weight: 700; line-height: 24px; cursor: pointer; } #accordion .element { height: 0; overflow: hidden; visibility: hidden; } #accordion p { margin: 0 0 15px; line-height: 18px; } #accordion p a { color: #f00; } #accordion p a:hover { text-decoration: underline; } /* CONTENT RULES */ #content_main { width: 743px; display: inline; float: left; } #content_main h1 { margin-bottom: 20px; color: #f00; font-size: 18px; font-weight: 100; text-transform: uppercase; } #content_main p { margin-bottom: 20px; padding: 0 10px; font-size: 11px; line-height: 18px; } #content_main strong { color: #f00; } #content_main ul { list-style: circle; color: #707070; } #content_main ul.column { width: 33%; float: left; } #content_main ul.last { } #content_main li { margin: 0 0 20px 20px; } #content_main li a { color: #f00; line-height: 18px; } #content_main ul li ul { margin-top: 20px; } /* FOOTER RULES */ #footer_wrap { width: 100%; background: #efefef; } #footer { margin: 0 auto; padding: 15px 0 10px; width: 937px; color: #707070; } #footer h5 { margin-bottom: 15px; color: #707070; font-size: 18px; text-transform: uppercase; } #footer span.sub_head { font-size: 10px; text-transform: uppercase; } #footer a.btn { width: 24px; height: 24px; position: absolute; top: 12px; right: 0; z-index: 100; background-image: url(../images/sprite_social_icons_small_footer.gif); text-indent: -9999px; } #footer a.twitter { background-position: -48px 0; } #footer a.twitter:hover { background-position: -48px -24px; } #footer a.contact { background-position: -24px 0; } #footer a.contact:hover { background-position: -24px -24px; } #footer a.flickr { background-position: 0 0; } #footer a.flickr:hover { background-position: 0 -24px; } #foot_contact { margin-right: 31px; padding-top: 15px; width: 299px; display: inline; float: left; position: relative; } #foot_contact p { margin-bottom: 15px; line-height: 18px; } #foot_contact a { color: #f00; } #foot_contact input { padding: 6px; height: 14px; width: 218px; float: left; color: #000; background: url(../images/sprite_inputs.gif) no-repeat 0 -26px; position: relative; z-index: 1; top: 0; left: 0; } #foot_contact input.btn { padding: 0; width: 56px; height: 28px; float: right; background: none; } #NewsletterInputWrap { display: block; width: 299px; height: 26px; position: relative; } #NewsletterLoadingIcon { position: absolute; z-index: 2; top: 6px; left: 208px; width: 16px; height: 16px; visibility: hidden; } #foot_contact a.sitemap { margin-top: 20px; padding: 0 0 0 35px; height: 19px; display: block; color: #c7c7c7; font-size: 10px; background: url(../images/icon_site_map.gif) no-repeat 0 0; } #foot_contact a.sitemap:hover { color: #f00; text-decoration: underline; background-position: 0 -19px; } #foot_twit { margin-right: 31px; padding-top: 15px; width: 272px; display: inline; float: left; position: relative; } #foot_twit li { margin-bottom: 10px; line-height: 18px; } #foot_twit a { color: #f00; } #foot_twit a.time_stamp { font-size: 9px; } #foot_flickr { padding-top: 15px; width: 304px; display: inline; float: left; position: relative; } #foot_flickr ul { width: 304px; } #foot_flickr li { margin: 0 1px 1px 0; width: 75px; height: 75px; display: inline; float: left; background: #707070; } /* TOOL BOX */ .rule { margin-bottom: 20px; height: 5px; width: 100%; background: url(../images/bg_rule.gif) repeat-x 0 0; } .hide { display: none; } .pad_10_t { padding-top: 10px; } .mar_20_r { margin-right: 20px; } .mar_20_t { margin-top: 20px; } .mar_20_b { margin-bottom: 20px; } .mar_15_r { margin-right: 15px; } .mar_15_b { margin-bottom: 15px; } .mar_15_l { margin-left: 15px; } .mar_10_l { margin-left: 10px; } .mar_10_b { margin-bottom: 10px; } .mar_1_b { margin-bottom: 1px; } .col_980 { width: 980px; } .col_960 { width: 960px; } .col_743 { width: 743px; } .col_738 { width: 738px; } .col_680 { width: 680px; } .col_300 { width: 300px; } .col_290 { width: 290px; } .col_174 { width: 174px; } .bg_efefef { background: #efefef; } .txt_right { text-align: right; } .red { color: #f00; } .inline_left { display: inline; float: left; } .inline_right { display: inline; float: right; } .invis { visibility: hidden !important; } .hide { display: none !important; } .clear:after { height: 0; display: block; clear: both; visibility: hidden; content: "."; }