@charset "UTF-8";

/*
	----------------------------
	GLOBAL CLASSES + STYLES
	----------------------------
*/

body { background-color: #f2f2f2; }
body,img,p,h1,h2,h3,h4,h5,h6,form,table,td,ul,ol,li,fieldset { margin:0; padding:0; border:0; }
section, nav, article, header, footer { display: block; }
a { color: #00bff3; text-decoration: none; }
a:hover, a:active, a:visited { color: #006699; }
input, textarea, select { font-family: 'HPSimplified', Arial, Helvetica, sans-serif; }
.body { font-family: 'HPSimplified', Arial, Helvetica, sans-serif; background-color: #fff; font-size: 16px; line-height: 22px; color: #222; position: relative; }
.content { width: 1000px; margin: 0 auto; padding: 0 20px; }
#header { margin-top: 10px; }
h1 { font-size: 32px; line-height: 100%; margin-top: .5em; margin-bottom: .25em; }
h2 { font-size: 24px; line-height: 30px; }
h3 { font-size: 20px; line-height: 24px; margin-bottom: 8px; }
h4 { font-size: 18px; line-height: 22px; }
h5 { font-size: 18px; line-height: 22px; }
h6 { font-size: 16px; line-height: 22px; } 
#body p, #body ul, #body ol, #body dl { margin: 0 0 12px 0; }
a { color: #007DBA; text-decoration: none; }
a:visited { color: #822980; }
a:hover, a:focus { text-decoration: underline; }
::-moz-selection { background: #f05332; color: white; text-shadow: none; }
::selection {  background: #f05332; color: white; text-shadow: none; }

sup { font-size: 10px; line-height: 1; }

.clearfix:before, .clearfix:after { content:""; display:table; }
.clearfix:after { clear:both; }
.clearfix { zoom:1; }

/*
.left { text-align: left; }
.center { text-align: center; }
.right { text-align: right; }
*/

.button { display: inline-block; background-color: #d7410b; color: #fff; font-size: 16px; line-height: 36px; font-weight: bold; padding: 0px 16px; white-space: nowrap; -webkit-border-radius: 0 6px; -moz-border-radius: 0 6px; border-radius: 0 6px; }
.button:hover, .button:visited { background-color: #c1401a; color: #fff; text-decoration: none; }

#cta-intro {float:right; padding:12px 15px 0 0; }
#multi-cta { float:right; position:relative; margin-top:4px; }
#multi-cta .dropdown { display: block; width: 215px;  background-color: #d7410b; color: #fff; font-size: 16px; height:36px; line-height: 36px; font-weight: bold; background: url(../media/cta-dropdown.gif) no-repeat 0 0; color: #fff !important; margin: 0 15px 0 0; text-indent:10px;}

#multi-cta #cta-links { position:absolute; top:36px; left:0; width:211px; display:none; }
#multi-cta ul { margin:0; list-style-type:none; border:#5a5a5a 2px solid; border-top:none;  }
#multi-cta li a { background: #fff url(../media/cta-dropdown-sprite.gif) no-repeat 0 0; display:block; line-height:30px; height:30px; text-indent:30px;}
#multi-cta li a:hover { background-color:#d7410b; color:#fff; }
    #multi-cta li a#cta-phone { cursor:default; }
    #multi-cta li a#cta-phone:hover { background-position: -250px 0; }
    #multi-cta li a#cta-sales { background-position: 0 -50px; }
    #multi-cta li a#cta-sales:hover { background-position: -250px -50px; }
    #multi-cta li a#cta-resellers { background-position: 0 -100px; }
    #multi-cta li a#cta-resellers:hover { background-position: -250px -100px; }

.button.secondary { background-color: #0096D6; }
.button.secondary:hover, .button.secondary:visited { background-color: #007DBA; }
.button.tertiary { background-color: #767676; }
.button.tertiary:hover, .button.tertiary:visited { background-color: #5a5a5a; }
.button.disabled, .button.disabled:hover { background-color: #ccc; }

.uppercase { text-transform: uppercase; }

.first-child { border-top: 0 !important; padding-top: 0 !important; }
.last-child { border-bottom: 0 !important; padding-bottom: 0 !important; }

.clickable-div { position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: 1; background-image: url(../media/empty.gif); }
.clickable-div ~ a.button, .clickable-div ~ p a.button { position: relative; z-index: 2; }
.clickable-div span { visibility: hidden; }
.no-js .clickable-div > span { visibility: visible; }

.seo_birdseed { display: none; width: 0; height: 0; }

/*
	----------------------------
	LAYOUT
	----------------------------
*/

#footnotes { font-size: 12px; margin: 20px auto; width: 1000px; color: #666; border-top:1px solid #e5e8e8; padding: 10px 32px 10px; }
#footnotes h2 { font-size: 28px; }
#footnotes p { text-indent: -9px; margin-left: 9px; }

.price { font-size: 32px; color: #d7410b; display: block; line-height: 1; margin-bottom: .25em; }
.price sup { font-size: 50%; vertical-align: top; }
.cents { font-size: 50%; line-height: 1; vertical-align: super; }

/*
.col-2 { width: 470px; padding: 0 14px; display: inline-block; float: left; }
.col-2:first-child { border-right: 1px solid #e5e5e5; }

.col-3 { width: 218px; padding: 0 18px; display: block; float: left; padding-bottom:30px; margin-left: 116px; }
.col-3:first-child { border-left: 0; margin-left: 0; }
*/

/*
	----------------------------
	HUB NAVIGATION
	----------------------------
*/

#local-nav { clear:both; position: relative; width: 1000px; }
#local-nav a { color: #000; }
#local-nav a:hover { text-decoration: none; }
#local-nav h2, #local-nav > a:hover { color: #000; float: left; margin: 0 18px; font-size: 16px; line-height: 2.5; border-bottom: 4px solid #0096d6; position: relative; top: 2px; display: inline-block; zoom: 1; *display: inline; font-weight: normal; }
#local-nav > a { color: #aaa; float: left; margin: 0 18px; font-size: 16px; line-height: 2.5; border-bottom: 4px solid transparent; position: relative; top: 2px; display: inline-block; zoom: 1; *display: inline; }
#local-nav .top { vertical-align: top; }

/*
	----------------------------
	HERO MASTHEAD
	----------------------------
*/

#masthead { position: relative; margin: 14px 0 24px 0; }
.hero { height: 256px; overflow: hidden; background-color: #CCC; background-repeat: no-repeat; position: relative; }
.hero .message { margin-left: 18px; width: 400px; }
.hero .message a.button { margin-top: 1em; line-height: 2.25em; }
.hero h5 { font-weight: normal; }



/*
	----------------------------
	FEATURED PRODUCT CAROUSEL
	----------------------------
*/

#featured-products { width: 630px; position: relative; padding: 13px 0 20px; z-index: 1; float: left; margin-left: 18px; }
#featured-products h2 { margin: 0 32px; /*padding: 0; position: relative; font-size: 130%; font-weight: bold; */ text-transform: uppercase; }
#featured-products h2 span { color: #888;}
#help-me { position: absolute; right: 12px; top: 12px; font-size: 12px; }

#product-carousel { width: 630px; position: relative; margin: 32px 0; }
#product-slides { position: relative; }

#product-carousel .carousel-nav-left { left: 1px; top: 0; height: 312px; background-position: -180px 142px; }
#product-carousel .carousel-nav-right { right: 1px; top: 0; height: 312px; background-position: -228px 142px; }
.product {  position: relative; float: left; width: 208px; height: 350px; border-right: 1px solid #444; }
.product.first { border-left: 1px solid transparent; }
.product.last { border-right: 1px solid transparent; }
	.product .img { display: table-cell; vertical-align: bottom; height: 140px; position: relative; width: 208px; text-align: center; }
	.product .img img { position: relative; top: -24px; }
	.product .data { padding: 0 12px 0 18px; margin-top: -16px; }
	.product.first .data { padding-left: 0; }
		.product h3 { margin: 0 0 6px 0; line-height: 1; }
		.product .highlight { color: #000; }
		.product .highlight div { font-weight: bold; font-size: 24px; line-height: 1.4; display: inline; }
		.product .highlight .text > b { font-weight: normal !important; }
		.product .highlight .text > br { display: none !important; }
		.product .highlight .text > div { display: none !important; }
		.product p { margin: 0; }
		.product p.links { position: absolute; bottom: 0; width: 206px; }
		.product ul { list-style: none; font-size: 14px; margin: 6px 0 0 7px; clear: both; color: #666; }
		.product ul li { text-indent: -8px; line-height: 1.25em; margin-bottom: .5em; }
		.product a.button { position: absolute; bottom: 0; line-height: 2.25em; }
		.product a.pdf, .product a.video { position: relative; left: 102px; line-height: 1; padding-left: 20px; background: url(../media/sprite.png) no-repeat; color: #333; font-size: 12px; display: block; height: 14px; margin-top: 4px; }
		.product a.video { background-position: -76px -87px; }
		.product a.pdf { background-position: -76px -103px;}

.col-3 .img { display: block; text-align: center; }
.col-3 ul { margin-left: 18px !important; list-style-type: disc; height: 124px; text-align: left; }
.col-3 li span { position: relative; left: -4px; }
.col-3 .promo { display:block; margin-bottom: 22px; font-size:10px; color:#a5a5a5;}
.col-3 .button { line-height: 2.5em; padding: 0 1.25em; text-align: left;  }
.col-3 .pdf { position: relative; left: 24px; line-height: 1; padding-left: 20px; background: url(../media/sprite.png) no-repeat -76px -100px; color: #333; font-size: 16px; display: inline-block; height: 22px; background-position: -76px -100px; }

/* EZBUY PRICING OVERRIDES */
.ezb { float: left; }
.ezb-price { color: #9CF39F; }
.ezb-vat { display: inline; padding-left: 4px; color: #9CF39F; }


/*
	----------------------------
	PROOF POINT FEATURES
	----------------------------
*/

#features { width: 620px; padding-top: 36px; position: relative; float: left; clear: both; }
#features h1 { margin-top: 32px; }
.feature { position: relative; width: 100%; margin: 36px 0 72px; }
.feature h2 { margin-bottom: .5em; }
.feature a.button span { color: #1dc3e7; }
.feature a.button { padding: .5em 1.25em; margin-top: 18px; }
.feature img { float: left; }
.feature .message { position: relative; text-align: left; width: 48%; margin-left: 52%;}
.feature.right .message { margin-left: 0; }
.feature.right img { float: right; }
#features.full-width { float: none; width: auto; border-top: 1px solid #ccc; }


/*
	----------------------------
	SIDEBAR
	----------------------------
*/

#sidebar { float: right; width: 325px; font-size: 14px; line-height: 18px; margin-top: 26px; }
#sidebar h3 { font-size: 18px; }
#sidebar ul { list-style: none; margin: 12px 0 24px; }
#sidebar ul li { margin: 0 0; position: relative; padding: 12px 0 8px 12px; }
#sidebar ul li p { margin: 0 8px; }
#sidebar ul li a span { color: #1dc3e7; }
#sidebar cite { display: block; font-style: normal; margin: 20px 0 0 10px; color: #5a5a5a; }

.retail-badges a { display: inline-block; margin-right: 16px; padding-top: 24px; }



/*
	----------------------------
	VIDEO PLAYER WITH PLAYLIST
	----------------------------
*/

#player-playlist h3 { margin-bottom: 14px; }
#player-playlist { background: #e6e7e8; font-size: 15px;  }
#video { float: left; width: 640px; padding: 42px 0 24px 40px; }
#player { width: 640px; height: 360px; background: #000; color: #CCC; margin-bottom: 14px; }
#player-copy p.short { display: none; }
#player-copy img { display: none; }
#player-playlist h3 a.button { font-size: .7em; margin-left: 16px; }

#playlist { float: right; width: 270px; margin-right: 30px; padding-top: 42px; }
#playlist ul { list-style: none; font-size: 14px; line-height: 18px;}
#playlist li { margin-bottom: 16px; }
#playlist li a { display: block; color: #333; }
#playlist li a:hover ~ img { opacity: 1; }
#playlist li.active { display: none; }
#playlist li p { padding-left: 138px; }
#playlist li p.long { display: none; }
#playlist li img { float: left; margin: 0 10px 0 0; opacity: .6; }
#playlist li a:hover img { opacity: 1; }
#playlist li span.video { padding-left: 25px; background: url(../media/sprite.png) no-repeat -76px -86px; font-size: 14px; display: inline-block; line-height: 1; }

#bc_placeholder { width: 600px; height: 338px; }

#lightbox-overlay { background: #000; display: none; position: fixed; z-index: 998; width: 100%; height: 100%; left: 0; top: 0; opacity: .5; }
#lightbox { background: #fff; /* border-top: 5px solid #0096d6; border-bottom: 5px solid #0096d6;*/ display: none; position: fixed; z-index: 999; min-width: 640px; padding: 32px 28px 28px; }
#lightbox h2 { margin-bottom: .25em; }
#lightbox .x { opacity: .6; position: absolute; top: 6px; right: 6px; width: 23px; height: 23px; display: block; background: url(../media/sprite.png) no-repeat -79px 0; }
#lightbox .x:hover { opacity: 1; text-decoration: none; }
#lb-video { min-width: 640px; min-height: 360px; }
	
/*
	----------------------------
	TONER SEARCH FORM
	----------------------------
*/
	/* United States IFRAME Toner Search */
#toner-search { z-index: 1; position: relative; padding: 36px 18px 36px; border-top: 1px outset #ccc; }
#toner-search h1 { margin-top: 0; }
#toner-search iframe { width: 550px; height: 80px; margin-top: 24px; }

#toner-packs { float: right; margin-top: 5px; }

/*
#HP_ink_and_toner_finder * { font-family: 'HPSimplified', Arial, sans-serif !important; }
#HP_ink_and_toner_finder { background: transparent !important; width: 520px !important; min-width: 520px !important; }
#HP_ink_and_toner_finder #search { border: 0; padding: 0; }
#HP_ink_and_toner_finder #search input.text { width: 190px; }
#HP_ink_and_toner_finder #search .search_by { display: none !important; }
#HP_ink_and_toner_finder #search .search_type { color: #333; font-size: 12px; }
#HP_ink_and_toner_finder #search #or { color: #4b4b4b; font-weight: bold; }
#HP_ink_and_toner_finder #search .go_button { background-color: #007DBA; font-size: 16px; line-height: 26px; font-weight: bold; white-space: nowrap; -webkit-border-radius: 0 6px; -moz-border-radius: 0 6px; border-radius: 0 6px; }
#HP_ink_and_toner_finder #search .go_button:hover { background-color: #006699; }
#HP_ink_and_toner_finder #search_printer, #HP_ink_and_toner_finder #search_cartridge { *width: 235px !important; }
*/

/* Regional Toner Search FORM  */
#toner-search-form { margin-top: 32px; width: 536px; }
#toner-search-form .go_button { height: 26px; float: left; cursor: pointer; margin-left: 5px; border: 0; }
#toner-search-form .search_header { font-size: 13px; }
#toner-search-form input.text { float: left; width: 190px; height: 22px; border: 1px solid #c3c3c3; font-family: Arial, Helvetica, sans-serif; }
#toner-search-form input.text.error { border: 1px solid #ff5050; }
#toner-search-form #or { color: #999; font-size: 8pt; float: left; width: auto; margin-top: 26px; margin-left: 18px; }
#toner-search-form .search_footer { color: #999; font-size: 9pt; margin-top: 3px; }
#toner-search-form #search_cartridge { float: left; display: inline; }
#toner-search-form #search_printer { float: right; display: inline; }
#toner-search-form .search_error { color: #FF5050; font-size: 9pt; visibility: hidden; margin-top: 3px; }
#toner-search-form .clear { clear: both; }


/*
	----------------------------
	BOTTOM STRAP
	----------------------------
*/

#bottom-strap { position: relative; display: block; padding: 8px 0; border-bottom: 2px solid #eee; }
#bottom-strap > a { display: block; float: left; margin-left: 96px; margin-right: 40px; }
#bottom-strap > div { margin-top: 40px; }
#bottom-strap h2 { margin-bottom: 8px; }


/*
	----------------------------
	PAGE SPECIFIC STYLES GO HERE
	----------------------------
*/

#footer { display: block; width: 1000px; margin: 0 auto; }
.text-center { text-align: center; }
.breakout { width: 100%; }
.breakout > div { width: 1000px; margin: 0 auto; }
.fixed { position: fixed; }

.col-2 > div { display: inline-block; width: 49.5%; vertical-align: top; zoom: 1; *display: inline; }
.col-3 > div { display: inline-block; width: 32.5%; margin-right: 0.5%; vertical-align: top; zoom: 1; *display: inline; }
h2 { font-size: 32px; line-height: 1; }

.dock { background: #fff; z-index: 100; }
.nav h1 { float: left; margin-left: 16px; }
.nav .store-cta { float: right; font-size: 14px; margin-top: .75em; }
.nav a.button { font-size: 14px; position: relative; bottom: .5em; color: #fff !important; margin: 0 18px 0 9px; }
.nav { position: relative;  width: 1000px; margin: 0 auto; }
.dock .nav { border-bottom: 1px solid #a5a5a5; }
.hero-message { margin: 72px auto; }
.hero-message p { width: 82%; }
.hero-message h2 { font-size: 56px; margin-top: 0; margin-bottom: .15em;}
.hero-message.col-2 > div { vertical-align: middle; text-align: center; }
.hero-message.col-2 > div:first-child { text-align: left; }
.hero-message.col-2 > div > img { margin-right: 24px; }
.hero-message .clearfix { margin-top: 1em; }

.content p > .button { margin-left: 1em; }
.fact-panel { border-right: 1px solid #fff; float: left; width: 172px; height: 172px; margin-bottom: 32px; padding: 0 24px; }
.fact-panel p { margin-bottom: 0; }
.fact-panel.last { border-right: 0; }
.fact-panel-divider { clear: both; border-bottom: 1px solid #fff; margin: 24px auto; }

.share-this { width: 75px; float: left; font-size: 14px; }
.share-this a { color: #767676; display: inline-block; background: white; line-height: 0; padding: 3px 6px; border-radius: 0 4px; zoom: 1; *display: inline; }
.share-this img { vertical-align: middle; }
.share-fb { width: 200px; float: left; }

#futuresmart { background: url(../media/overview_redefined_bg.jpg) scroll 50% 50% no-repeat; height: 599px; }
#futuresmart h2 { margin: 1.5em 0 .333em 0; font-size: 32px; }
#futuresmart .col-2 > div { width: 35.5%; margin-left: 1%; }
#futuresmart .video img { float: left; margin-right: 12px; }

#workflow { background: url(../media/overview_workflow.jpg) scroll 90% 0% no-repeat; height: 525px; }
#workflow .content { border-bottom: 1px solid #ccc; }
#workflow h2 { margin: 1.5em 0 .333em; }
#workflow .button { margin-bottom: 3em; }
#workflow > div { vertical-align: bottom; }

#security { border-top: 1px solid #ccc; padding-top: 3em; }
#security h2 { margin: 0 0 .333em; }
#security .left { width: 25%; text-align: center; vertical-align: middle; }
#security .right { width: 70%; margin-bottom: 1.5em; }

#add-printer { margin-top: 32px; }
#add-printer > div { vertical-align: bottom; }
#add-printer h2 { padding-bottom: .75em; }
#add-printer .button { line-height: 2.5em; margin: 1.333em 0; }

#work-hard { border-top: 1px solid #a5a5a5; margin: 32px auto; padding-top: 32px; }
#work-hard h2 { margin: 1.5em 0 .333em; }
#work-hard > div { text-align: left; }
#work-hard > div img { margin: 0 auto 1em auto; display: block;}
#work-hard > div h3 { text-align: left; font-size: 24px; }
#work-hard > div p { text-align: left; }

#flow #hero { background: url(../media/overview_flow_bg.jpg) scroll 50% 0 no-repeat; height: 600px; }

#flow .hero-message { width: 500px; padding-left: 150px; padding-top: 124px; }
#flow .hero-message h2 { font-size: 48px; }

#flow #hero.medical { background-image: url(../media/overview_flow_bg_medical.jpg); }
#flow #hero.medical .hero-message { padding-left: 394px; padding-top: 180px; }
#flow #hero.legal { background-image: url(../media/overview_flow_bg_legal.jpg); }
#flow #hero.legal .hero-message { padding-left: 50px; padding-top: 215px;}
#flow #hero.finance { background-image: url(../media/overview_flow_bg_finance.jpg); }
#flow #hero.finance .hero-message { padding-top: 200px; }

#flow #see-flow { background: url(../media/overview_bottomstrap_bg.jpg) scroll 50% 50% no-repeat; height: 450px; }
#flow #see-flow h2 { margin: 1.5em 0 .333em; }
#flow #see-flow p { width: 52%; }
#flow #see-flow .left { width: 32%; }
#flow #see-flow .right { width: 67%; }

#what-is-flow .left { text-align: center; }
#what-is-flow { border-bottom: 1px solid #ccc; margin-top: 2em; }
#what-is-flow h2 { margin: 1.5em 0 .333em }
#what-is-flow .button { margin-top: 1em; margin-bottom: 3em; }

#paper-cloud .left img { position: relative; left: -250px; margin-top: 2em; }
#paper-cloud h2 { margin: 1.5em 0 .333em }

#flow #security { margin-top: 3em; padding-top: 3em; margin-bottom: 2em; border-top: 1px solid #ccc; }
#flow #security .left { width: 32%; }
#flow #security .right { width: 60%; }

#featured-printers > div:first-child { width: 100%; margin-bottom: 30px; }
#featured-printers .left { text-align: left; }
#featured-printers .model-info { margin-left: 180px; padding-right: 50px; }
#featured-printers .model-info h3 { font-size: 24px; }
#featured-printers .model-info ul { list-style-type: disc; }
#featured-printers .model-info ul li { margin-left: 18px; }
#featured-printers { border-top: 1px solid  #a5a5a5; margin: 32px auto; padding-top: 32px; }
#featured-printers img { float: left; }
#featured-printers h2 { margin: .5em 0 .333em; }
#featured-printers .button { margin-bottom: 5em; }

#infographic { display: none; }
#lightbox #infographic { display: block; }
/*
MESSAGE READ MORE OR LESS
*/
.no-js a.more { display: none; }
.no-js p.more { display: block; }
a.more, .feature a.video { display: block; cursor: pointer; color: #767676; padding-left: 18px; font-size: 14px; height: 20px;}
.feature a.video { background: url(../media/video.png) no-repeat 0 6px; }
a.more { background: url(../media/expand.png) no-repeat 0 -22px; }
a.more.less { background-position: 0 4px; }
p.more { display: none; margin-left: 18px; }

#work-hard h3 a, #featured-printers h3 a { color: #000; text-decoration: none; font-size: 17px; margin-bottom: .5em; }
.video { color: #000; text-decoration: none; }
.button.video { color: #fff; }