html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, hgroup, menu, nav, section, menu, time, mark, audio, video { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; }

article, aside, figure, footer, header, hgroup, nav, section { display: block; }

/* Responsive images and other embedded objects Note: keeping IMG here will cause problems if you're using foreground images as sprites, like, say for Google Maps custom placemarkers.  There has been a report of problems with standard Google maps as well, but we haven't been able to duplicate or diagnose the issue. */
img, object, embed { max-width: 100%; }

/* force a vertical scrollbar to prevent a jumpy page */
/* html { overflow-y: scroll; } */
/* we use a lot of ULs that aren't bulleted. 
	don't forget to restore the bullets within content. */
ul { list-style: none; }

blockquote, q { quotes: none; }

blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }

a { margin: 0; padding: 0; font-size: 100%; vertical-align: baseline; background: transparent; }

del { text-decoration: line-through; }

abbr[title], dfn[title] { border-bottom: 1px dotted #000; cursor: help; }

/* tables still need cellspacing="0" in the markup */
table { border-collapse: collapse; border-spacing: 0; }

th { font-weight: bold; vertical-align: bottom; }

td { font-weight: normal; vertical-align: top; }

hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }

input, select { vertical-align: middle; }

pre { white-space: pre; /* CSS2 */ white-space: pre-wrap; /* CSS 2.1 */ white-space: pre-line; /* CSS 3 (and 2.1 as well, actually) */ word-wrap: break-word; /* IE */ }

input[type="radio"] { vertical-align: text-bottom; }

input[type="checkbox"] { vertical-align: bottom; *vertical-align: baseline; }

.ie6 input { vertical-align: text-bottom; }

select, input, textarea { font: 99% sans-serif; }

table { font-size: inherit; font: 100%; }

/* Accessible focus treatment
	people.opera.com/patrickl/experiments/keyboard/test */
a:hover, a:active { outline: none; }

small { font-size: 85%; }

strong, th { font-weight: bold; }

td, td img { vertical-align: top; }

/* Make sure sup and sub don't screw with your line-heights
	gist.github.com/413930 */
sub, sup { font-size: 75%; line-height: 0; position: relative; }

sup { top: -0.5em; }

sub { bottom: -0.25em; }

/* standardize any monospaced elements */
pre, code, kbd, samp { font-family: monospace, sans-serif; }

/* hand cursor on clickable elements */
.clickable, label, input[type=button], input[type=submit], button { cursor: pointer; }

/* Webkit browsers add a 2px margin outside the chrome of form elements */
button, input, select, textarea { margin: 0; }

/* make buttons play nice in IE */
button { width: auto; overflow: visible; }

/* scale images in IE7 more attractively */
.ie7 img { -ms-interpolation-mode: bicubic; }

/* prevent BG image flicker upon hover */
.ie6 html { filter: expression(document.execCommand("BackgroundImageCache", false, true)); }

/* let's clear some floats */
.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; }

.clearfix:after { clear: both; }

.clearfix { zoom: 1; }

/* Ok, this is where the fun starts.
-------------------------------------------------------------------------------*/
/* new Linux- and Windows-friendly sans-serif font stack: http://mky.be/fontstack */
body { font: 13px Helmet, Freesans, sans-serif; }

/* using local fonts? make sure to read up on Paul Irish's 
	Bulletproof @font-face syntax: http://mky.be/font-face/bulletproof/ */
/* we like off-black for text */
body, select, input, textarea { color: #333; }

a { color: #03f; }

a:hover { color: #69f; }

/* Custom text-selection colors (remove any text shadows: twitter.com/miketaylr/status/12228805301) */
::-moz-selection { background: black; color: #FFF; text-shadow: none; }

::selection { background: black; color: #FFF; text-shadow: none; }

/*	j.mp/webkit-tap-highlight-color */
* { -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }

ins { background-color: #fcd700; color: #000; text-decoration: none; }

mark { background-color: #fcd700; color: #000; font-style: italic; font-weight: bold; }

@font-face { font-family: 'ChaparralPro'; src: url("../fonts/ChaparralPro-Regular.otf"); }

@font-face { font-family: 'MyriadProRegular'; src: url("../fonts/MyriadPro-Regular.otf"); }

@font-face { font-family: 'MyriadProLight'; src: url("../fonts/MyriadPro-Light.otf"); }

@font-face { font-family: 'MyriadProBold'; src: url("../fonts/MyriadPro-Bold.otf"); }

@font-face { font-family: 'MyriadSemibold'; src: url("../fonts/MyriadPro-Semibold.otf"); }

/*
@font-face { font-family: 'Trade Gothic LT Std'; font-weight: bold; src: url('../fonts/Trade Gothic LT Std/TradeGothicLTStd-Bold.otf'); }
@font-face { font-family: 'Trade Gothic LT Std'; font-style: italic; src: url('../fonts/Trade Gothic LT Std/TradeGothicLTStd-Obl.otf'); }
@font-face { font-family: 'Trade Gothic LT Std'; font-weight:bold; font-style: italic; src: url('../fonts/Trade Gothic LT Std/TradeGothicLTStd-BoldObl.otf'); }
*/
body { font-family: Verdana; font-size: 14px; font-family: MyriadProRegular; -webkit-perspective: 500; color: #000; width: 1024px; height: 724px; background: white url("../images/main-background.jpg") no-repeat; }
body > header { background: url("../images/main-logo.png") 18px 18px no-repeat, url("../images/main-res-int-DES.png") 765px 89px no-repeat; height: 165px; }
body > header > h1 { padding: 80px; font-family: ChaparralPro; font-size: 32px; line-height: 1em; }
body > header > h1 span { font-family: MyriadProLight; font-size: 25px; }
body > div.content { height: 467px; color: #fff; }
body > div.content .gutter { padding-top: 40px; }
body > div.content .gutter > footer p { padding: 30px; font-size: 10px; color: #000; }
body > div.content .gutter > footer p sup { font-size: 9px; }
body > footer { position: relative; height: 90px; }
body > footer p { color: #fff; font-size: 10px; position: absolute; bottom: 13px; left: 21px; }

/* BOX */
.box { margin: auto; }

/* TOOLTIP */
.tooltapper { width: 58px; height: 38px; position: absolute; }

.tooltip { font-size: 11px; z-index: 9; position: relative; width: 170px; border-radius: 10px; padding: 20px; -webkit-box-shadow: 0 0 15px #ffffff; background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #717171), color-stop(14%, #686868), color-stop(49%, #484848), color-stop(50%, #474747), color-stop(50%, #3e3e3e), color-stop(50%, #292929), color-stop(51%, #232323), color-stop(52%, #222222), color-stop(75%, #1c1c1c), color-stop(100%, #1a1a1a)); color: #fff; display: none; }
.tooltip h1 { font-family: MyriadSemibold; font-size: 16px; text-shadow: 1px 1px 1px #000; }
.tooltip p.footer { font-family: MyriadSemibold; color: #d5b230; font-size: 9px; margin-top: 10px; }
.tooltip > .arrow { position: absolute; width: 0; height: 0; z-index: 20; border-left: 12px solid transparent; border-right: 12px solid transparent; }
.tooltip > .left-down { bottom: 15%; left: -16px; border-top: 12px solid #1a1a1a; -webkit-transform: rotate(90deg); }
.tooltip > .left-top { top: 15%; left: -16px; border-top: 12px solid #686868; -webkit-transform: rotate(90deg); }
.tooltip > .right-top { top: 15%; right: -16px; border-top: 12px solid #686868; -webkit-transform: rotate(-90deg); }

.showtip { display: block; }

/* END TOOLTIP */
sup { font-size: 14px; }

.clearer { clear: both; }

body.page1 .content .box { width: 878px; height: 373px; background: url("../images/page1-box-background.png"); }
body.page1 .content .box > ul { padding: 25px 80px; list-style: disc; }
body.page1 .content .box > ul li { font-family: MyriadProRegular; font-size: 25px; }
body.page1 .content .box > ul li ul { padding: 45px 53px; }
body.page1 .content .box > ul li ul li { font-family: MyriadProLight; font-size: 21px; }

body.page2 .content .gutter { padding-top: 60px; }
body.page2 .content .gutter .square { position: relative; text-align: center; width: 234px; height: 265px; float: left; opacity: 0; }
body.page2 .content .gutter .square.animate { -webkit-transition-property: opacity; -webkit-transition: all linear 300ms; opacity: 1; }
body.page2 .content .gutter .square h1 { font-size: 18px; }
body.page2 .content .gutter .square h2 { font-family: MyriadProLight; }
body.page2 .content .gutter .square:nth-child(1) { background: url("../images/page2-thumb1.jpg") center no-repeat, url("../images/page2-square1-background.png") no-repeat; margin: 0 7px 0 28px; }
body.page2 .content .gutter .square:nth-child(1) h1 { padding: 43px 15px; }
body.page2 .content .gutter .square:nth-child(1) h2 { padding: 95px 31px; }
body.page2 .content .gutter .square:nth-child(2) { background: url("../images/page2-thumb2.jpg") center no-repeat, url("../images/page2-square2-background.png") no-repeat; margin: 0 7px 0 0; }
body.page2 .content .gutter .square:nth-child(2) h1 { padding: 29px 15px; }
body.page2 .content .gutter .square:nth-child(2) h2 { padding: 100px 31px; }
body.page2 .content .gutter .square:nth-child(3) { background: url("../images/page2-thumb3.jpg") center no-repeat, url("../images/page2-square3-background.png") no-repeat; margin: 0 7px 0 0; }
body.page2 .content .gutter .square:nth-child(3) h1 { padding: 13px 15px; }
body.page2 .content .gutter .square:nth-child(3) h2 { padding: 105px 31px; }
body.page2 .content .gutter .square:nth-child(4) { background: url("../images/page2-thumb4.jpg") center no-repeat, url("../images/page2-square4-background.png") no-repeat; }
body.page2 .content .gutter .square:nth-child(4) h1 { padding: 29px 15px; }
body.page2 .content .gutter .square:nth-child(4) h2 { padding: 100px 31px; }

body.page3 .content .box { position: relative; width: 772px; height: 405px; background: url("../images/page3-box-background.png"); }
body.page3 .content .box .shadow { height: 164px; position: absolute; width: 0; }
body.page3 .content .box .shadow.one { background: url("../images/page-3-dropshadow1.png") no-repeat; top: 224px; left: 60px; width: 179px; }
body.page3 .content .box .shadow.two { background: url("../images/page-3-dropshadow2.png") no-repeat; top: 224px; left: 240px; }
body.page3 .content .box .shadow.two.animate { -webkit-transition: all 400ms; width: 138px; }
body.page3 .content .box .shadow.three { background: url("../images/page-3-dropshadow3.png") no-repeat; top: 229px; left: 364px; }
body.page3 .content .box .shadow.three.animate { -webkit-transition: all 400ms; width: 148px; }
body.page3 .content .box .shadow.four { background: url("../images/page-3-dropshadow4.png") no-repeat; top: 228px; left: 520px; }
body.page3 .content .box .shadow.four.animate { -webkit-transition: all 400ms; width: 141px; }
body.page3 .content .box .shadow.animate1 { -webkit-transition: all 400ms; width: 370px; }
body.page3 .content .box .shadow.animate2 { -webkit-transition: all 400ms; width: 520px; }
body.page3 .content .box .shadow.animate3 { -webkit-transition: all 400ms; width: 600px; }
body.page3 .content .box .barlabel { font-size: 16px; position: absolute; z-index: 1; color: #000; opacity: 0; }
body.page3 .content .box .barlabel.one { top: 118px; left: 252px; z-index: 100; }
body.page3 .content .box .barlabel.two { top: 62px; left: 384px; z-index: 101; }
body.page3 .content .box .barlabel.three { top: 278px; left: 525px; z-index: 102; }
body.page3 .content .box .barlabel.animate { -webkit-transition: all 1000ms; opacity: 1; }
body.page3 .content .box .text { position: absolute; top: 337px; left: 212px; color: #000; }
body.page3 .content .box .text .graphlabel { text-align: center; font-family: MyriadProBold; font-size: 16px; float: left; margin-right: 31px; }
body.page3 .content .box .bars { position: absolute; border: 1px solid; top: 100px; left: 212px; }
body.page3 .content .box .bars .bar.animate { -webkit-transition: all 400ms; background-position-y: 0; }
body.page3 .content .box .bars .one { background: url("../images/page3-graph1-background.png") no-repeat; height: 193px; background-position-y: 193px; width: 57px; position: absolute; top: 36px; left: 28px; }
body.page3 .content .box .bars .two { background: url("../images/page3-graph2-background.png") no-repeat; height: 239px; background-position-y: 239px; width: 57px; position: absolute; top: -10px; left: 160px; }
body.page3 .content .box .bars .three { background: url("../images/page3-graph3-background.png") no-repeat; width: 61px; height: 60px; background-position-y: 60px; position: absolute; top: 168px; left: 300px; }
body.page3 .content .box .largearrow { position: absolute; right: 143px; top: 45px; background: url("../images/page3-arrow-large.png") no-repeat; width: 167px; height: 201px; opacity: 0; }
body.page3 .content .box .largearrow.animate { -webkit-transition: all 1000ms; opacity: 1; }
body.page3 .content .box .smallarrow { position: absolute; top: 65px; left: 80px; background: url("../images/page3-arrow-small.png") no-repeat; width: 37px; height: 228px; }
body.page3 .content .gutter > footer p { padding: 10px 30px; font-size: 10px; color: #000; }

body.page4 .content .box { width: 865px; height: 301px; text-align: center; }
body.page4 .content .box h2 { font-size: 30px; color: #000; margin: 40px 0px 20px 0px; }
body.page4 .content .box .row { width: inherit; }
body.page4 .content .box .row > div { width: 245px; height: 100px; background: url("../images/page4-rectangle-background.png") no-repeat; float: left; font-size: 28px; color: #000; line-height: 1em; padding-top: 20px; }
body.page4 .content .box .row > div:nth-child(1) { margin: 0 50px 0 15px; }
body.page4 .content .box .row > div:nth-child(2) { margin-right: 50px; }
body.page4 .content .box .row > div:nth-child(3) { xmargin-right: 30px; }

body.page5 .content .box { position: relative; width: 625px; height: 410px; background: url("../images/page5-box-background.png") no-repeat; }
body.page5 .content .box .barlabel { font-size: 16px; position: absolute; z-index: 1; opacity: 0; }
body.page5 .content .box .barlabel.animate { -webkit-transition: all 400ms; opacity: 1; }
body.page5 .content .box .barlabel.one { top: 90px; left: 179px; }
body.page5 .content .box .barlabel.two { top: 120px; left: 314px; }
body.page5 .content .box .barlabel.three { top: 64px; left: 467px; }
body.page5 .content .box .text { position: absolute; top: 332px; left: 150px; width: inherit; }
body.page5 .content .box .text .graphlabel { text-align: center; font-family: MyriadProBold; font-size: 16px; float: left; margin-right: -13px; width: 150px; padding: 0; }
body.page5 .content .box .text .graphlabel:nth-child(3) { margin-left: 10px; }
body.page5 .content .box .bars { position: absolute; border: 1px solid; top: 100px; left: 212px; }
body.page5 .content .box .bars .bar.animate { -webkit-transition: all 400ms; background-position-y: 0; }
body.page5 .content .box .bars .one { background: url("../images/page5-graph1-background.png") no-repeat; height: 201px; background-position-y: 201px; width: 61px; position: absolute; top: 15px; left: -18px; }
body.page5 .content .box .bars .two { background: url("../images/page5-graph2-background.png") no-repeat; height: 170px; background-position-y: 170px; width: 61px; position: absolute; top: 45px; left: 120px; }
body.page5 .content .box .bars .three { background: url("../images/page5-graph3-background.png") no-repeat; width: 61px; height: 220px; background-position-y: 220px; position: absolute; top: -6px; left: 270px; }
body.page5 .content .gutter p { padding: 5px 30px; font-size: 10px; color: #000; }

body.page6 > header > h1 { padding-top: 60px; }
body.page6 .content .box { position: relative; width: 952px; height: 432px; background: url("../images/page6-box-background.png") no-repeat; }
body.page6 .content .box #tooltapper_1 { background: url("../images/page6-earth-icon.png") no-repeat; width: 85px; height: 94px; top: 305px; left: 39px; z-index: 10; }
body.page6 .content .box #tooltip_1 { top: 50px; left: 129px; }
body.page6 .content .box #tooltapper_2 { background: url("../images/page6-american-icon.png") no-repeat; top: 76px; left: 174px; z-index: 2; }
body.page6 .content .box #tooltip_2 { top: 50px; left: 235px; width: 150px; }
body.page6 .content .box #tooltip_2 ul:nth-child(2) { margin-bottom: 30px; }
body.page6 .content .box #tooltapper_3 { background: url("../images/page6-eu-icon.png") no-repeat; top: 71px; left: 453px; z-index: 3; }
body.page6 .content .box #tooltip_3 { top: 48px; left: 263px; width: 150px; }
body.page6 .content .box #tooltapper_4 { background: url("../images/page6-china-icon.png") no-repeat; top: 107px; left: 648px; z-index: 4; }
body.page6 .content .box #tooltip_4 { top: 69px; left: 444px; width: 160px; }
body.page6 .content .box #tooltip_4 ul:nth-child(2) { margin-bottom: 30px; }
body.page6 .content .box #tooltapper_5 { background: url("../images/page6-asia-icon.png") no-repeat; top: 147px; left: 642px; z-index: 5; }
body.page6 .content .box #tooltip_5 { top: 114px; left: 440px; width: 150px; }
body.page6 .content .box #tooltapper_6 { background: url("../images/page6-japan-icon.png") no-repeat; top: 150px; left: 700px; z-index: 6; }
body.page6 .content .box #tooltip_6 { top: 114px; left: 500px; width: 150px; }
body.page6 .content .box #tooltip_6 ul:nth-child(2) { margin-bottom: 50px; }
body.page6 .content .box #tooltapper_7 { background: url("../images/page6-australia-icon.png") no-repeat; top: 245px; left: 749px; z-index: 7; }
body.page6 .content .box #tooltip_7 { top: 228px; left: 545px; width: 150px; }
body.page6 .content .box #tooltapper_8 { background: url("../images/page6-newzealand-icon.png") no-repeat; top: 288px; left: 872px; z-index: 9; }
body.page6 .content .box #tooltip_8 { top: 280px; left: 675px; width: 150px; }

body.page7 .content .box { position: relative; width: 704px; height: 402px; background: url("../images/page7-box-background.png") no-repeat; }
body.page7 .content .box > div { position: absolute; }
body.page7 .content .box .shadow { top: 250px; left: 90px; width: 70px; height: 70px; background: url("../images/page7-box-lineshadows.png") no-repeat; }
body.page7 .content .box .shadow.animate { -webkit-transition: all 400ms; width: 548px; }
body.page7 .content .box .legend { top: 80px; left: 350px; width: 234px; height: 53px; background: url("../images/page7-box-legend.png") no-repeat; -webkit-box-shadow: 0 0 15px #ccc; }
body.page7 .content .box .legend.animate { -webkit-transition: all 400ms; opacity: 1; }
body.page7 .content .box .numbers { top: 156px; left: 570px; width: 67px; height: 86px; background: url("../images/page7-box-numbers.png") no-repeat; -webkit-box-shadow: 0 0 15px #ccc; opacity: 0; }
body.page7 .content .box .numbers.animate { opacity: 1; }
body.page7 .content .box .logrank { top: 176px; left: 250px; width: 104px; height: 16px; background: url("../images/page7-box-logrank.png") no-repeat; opacity: 0; }
body.page7 .content .box .logrank.animate { opacity: 1; }
body.page7 .content .box .graph { top: 181px; left: 157px; width: 0px; height: 130px; background: url("../images/page7-box-lines.png") no-repeat; }
body.page7 .content .box .graph.animate { -webkit-transition: all 400ms; width: 399px; }
body.page7 .content .gutter > footer p { padding: 10px 30px; }

body.page8 .content .box { position: relative; width: 808px; height: 393px; background: url("../images/page8-box-background.png") no-repeat; }
body.page8 .content .box > .barlabel { position: absolute; top: 300px; color: #000; text-align: center; font-family: MyriadProBold; font-size: 16px; }
body.page8 .content .box > .barlabel.one { left: 70px; }
body.page8 .content .box > .barlabel.two { left: 230px; }
body.page8 .content .box > .barlabel.three { left: 370px; }
body.page8 .content .box > .barlabel.four { left: 490px; }
body.page8 .content .box > .barlabel.five { left: 680px; }
body.page8 .content .box > div { position: absolute; }
body.page8 .content .box .legend { width: 220px; height: 50px; top: 49px; left: 294px; background: url("../images/page8-box-legend.png") no-repeat; -webkit-box-shadow: 0 0 15px #ccc; }
body.page8 .content .box .legend.animate { opacity: 1; }
body.page8 .content .box .numbers { position: absolute; height: 17px; top: 162px; opacity: 0; }
body.page8 .content .box .numbers.one { width: 62px; left: 80px; background: url("../images/page8-numbers1.png") no-repeat; }
body.page8 .content .box .numbers.one.animate { -webkit-transition: all 400ms; opacity: 1; }
body.page8 .content .box .numbers.two { width: 58px; left: 225px; background: url("../images/page8-numbers2.png") no-repeat; }
body.page8 .content .box .numbers.two.animate { -webkit-transition: all 400ms; opacity: 1; }
body.page8 .content .box .numbers.three { width: 58px; left: 380px; background: url("../images/page8-numbers3.png") no-repeat; }
body.page8 .content .box .numbers.three.animate { -webkit-transition: all 400ms; opacity: 1; }
body.page8 .content .box .numbers.four { width: 64px; left: 520px; background: url("../images/page8-numbers4.png") no-repeat; }
body.page8 .content .box .numbers.four.animate { -webkit-transition: all 400ms; opacity: 1; }
body.page8 .content .box .numbers.five { width: 53px; left: 680px; background: url("../images/page8-numbers5.png") no-repeat; }
body.page8 .content .box .numbers.five.animate { -webkit-transition: all 400ms; opacity: 1; }
body.page8 .content .box .bars { width: 716px; height: 88px; top: 200px; }
body.page8 .content .box .bars.one { background: url("../images/page8-bars1.png") no-repeat; background-position-y: 88px; left: 50px; }
body.page8 .content .box .bars.one.animate { -webkit-transition: all 400ms; background-position-y: 0; }
body.page8 .content .box .bars.two { background: url("../images/page8-bars2.png") no-repeat; left: 189px; background-position-y: 88px; }
body.page8 .content .box .bars.two.animate { -webkit-transition: all 400ms; background-position-y: 0; }
body.page8 .content .box .bars.three { background: url("../images/page8-bars3.png") no-repeat; left: 339px; background-position-y: 88px; }
body.page8 .content .box .bars.three.animate { -webkit-transition: all 400ms; background-position-y: 0; }
body.page8 .content .box .bars.four { background: url("../images/page8-bars4.png") no-repeat; left: 479px; background-position-y: 88px; }
body.page8 .content .box .bars.four.animate { -webkit-transition: all 400ms; background-position-y: 0; }
body.page8 .content .box .bars.five { background: url("../images/page8-bars5.png") no-repeat; left: 629px; background-position-y: 88px; }
body.page8 .content .box .bars.five.animate { -webkit-transition: all 400ms; background-position-y: 0; }

body.page9 > header > h1 { padding-top: 64px; line-height: .9em; }
body.page9 .content .box { position: relative; width: 825px; height: 357px; background: url("../images/page9-table.png") 0px 260px no-repeat, url("../images/page9-box-background.png") no-repeat; }
body.page9 .content .box > div { position: absolute; }
body.page9 .content .box .bars { top: 145px; left: 127px; width: 0px; height: 49px; background: url("../images/page9-box-bars.png") no-repeat; }
body.page9 .content .box .bars.animate { -webkit-transition: all 400ms; width: 647px; }

body.page10 > header > h1 { padding-top: 64px; line-height: .9em; }
body.page10 .content .box { position: relative; }
body.page10 .content .box > div { position: absolute; }
body.page10 .content .box > div.piechart { top: 66px; left: 26px; xwidth: 613px; }
body.page10 .content .box > div.legend { width: 348px; height: 56px; background: url("../images/page10-legend.png") no-repeat; top: 380px; left: 20px; }
body.page10 .content .box > div#shape { top: 100px; left: 280px; width: 0; height: 156px; background: url("../images/page10-triangleshape.png") no-repeat; }
body.page10 .content .box > div#shape.animate { -webkit-transition: all 400ms; width: 106px; }
body.page10 .content .box > div#smallchart { top: 100px; left: 385px; width: 422px; height: 150px; background: url("../images/page10-small-chart.png") no-repeat; opacity: 0; }
body.page10 .content .box > div#smallchart.animate { -webkit-transition: all 400ms; opacity: 1; }
body.page10 .content .box > div#smallchart > ul { color: #000; width: 49%; text-align: center; margin-top: 14px; }
body.page10 .content .box > div#smallchart > ul:nth-child(1) { float: left; }
body.page10 .content .box > div#smallchart > ul:nth-child(2) { float: right; }
body.page10 .content .box > div.barchart { top: 66px; left: 366px; }
body.page10 .content .box > div.barchart.hide { opacity: 0; }
body.page10 .content .box > div.barchart .bar, body.page10 .content .box > div.barchart .text { position: absolute; color: #000; }
body.page10 .content .box > div.barchart .text { -webkit-transition: all 400ms; opacity: 0; }
body.page10 .content .box > div.barchart .showText { opacity: 1; }
body.page10 .content .box > div.barchart #text_1 { top: 118px; left: 108px; }
body.page10 .content .box > div.barchart #text_2 { top: 110px; left: 213px; }
body.page10 .content .box > div.barchart #text_3 { top: 80px; left: 404px; }
body.page10 .content .box > div.barchart #text_4 { top: 45px; left: 510px; }
body.page10 .content .box > div.barchart #text_5 { top: 288px; left: 105px; opacity: 1; }
body.page10 .content .box > div.barchart #text_6 { top: 288px; left: 210px; opacity: 1; }
body.page10 .content .box > div.barchart #text_7 { top: 288px; left: 400px; opacity: 1; }
body.page10 .content .box > div.barchart #text_8 { top: 288px; left: 509px; opacity: 1; }
body.page10 .content .box > div.barchart #bar_1 { top: 136px; left: 96px; width: 54px; height: 132px; background: url("../images/page10-bar1.png") 0 132px no-repeat; }
body.page10 .content .box > div.barchart #bar_1.animate { -webkit-transition: all 400ms; background-position-y: 0px; }
body.page10 .content .box > div.barchart #bar_2 { top: 125px; left: 202px; width: 51px; height: 144px; background: url("../images/page10-bar2.png") 0 144px no-repeat; }
body.page10 .content .box > div.barchart #bar_2.animate { -webkit-transition: all 400ms; background-position-y: 0px; }
body.page10 .content .box > div.barchart #bar_3 { top: 97px; left: 390px; width: 55px; height: 171px; background: url("../images/page10-bar3.png") 0 171px no-repeat; }
body.page10 .content .box > div.barchart #bar_3.animate { -webkit-transition: all 400ms; background-position-y: 0px; }
body.page10 .content .box > div.barchart #bar_4 { top: 61px; left: 498px; width: 50px; height: 207px; background: url("../images/page10-bar4.png") 0 207px no-repeat; }
body.page10 .content .box > div.barchart #bar_4.animate { -webkit-transition: all 400ms; background-position-y: 0px; }

body.page11 > header > h1 { padding-top: 60px; }
body.page11 .content .box { position: relative; width: 854px; height: 428px; xbackground: url("../images/page11-box-graph1.png") no-repeat; }
body.page11 .content .box img { position: absolute; opacity: 0; -webkit-transition: all 400ms; }
body.page11 .content .box img.show { opacity: 1; }
body.page11 .content .box.graph2 { xbackground: url("../images/page11-box-graph2.png") no-repeat; }

body.page12 .content .box { width: 879px; height: 418px; background: url("../images/page12-box-background.png") no-repeat; }
body.page12 .content .box ul { padding: 15px 51px 0px 51px; list-style: none; float: left; width: 450px; }
body.page12 .content .box ul li { font-family: MyriadProRegular; font-size: 22px; }
body.page12 .content .box ul li ul { list-style: none; padding: 20px 5px; }
body.page12 .content .box ul li ul li { font-family: MyriadProLight; font-size: 18px; margin-bottom: 20px; }
body.page12 .content .box ul li ul li:nth-last-child(1) { margin-bottom: 0; }
body.page12 .content .box ul:nth-child(1) { width: 450px; }
body.page12 .content .box ul:nth-child(2) { margin-top: 3px; }
body.page12 .content .box ul:nth-child(n+2) { list-style: none; width: 220px; padding: 15px 31px; }
body.page12 .content .box ul:nth-child(n+2) li { font-family: MyriadProLight; font-size: 13px; }
body.page12 .content .box ul:nth-child(n+2) li.header { font-family: MyriadProBold; }
body.page12 .content .box p { font-family: MyriadProLight; font-size: 10px; padding: 0 0 0 30px; }
body.page12 .content .gutter > footer p { padding: 0px 30px; }

body.prod-overview { background: url("../images/product-overview-background.jpg") no-repeat; font-family: ChaparralPro; width: 1024px; height: 724px; -webkit-perspective: 500; }
body.prod-overview .left { float: left; width: 429px; }
body.prod-overview .left > header { height: 70px; background: url("../images/product-overview-logo.png") 53px 34px no-repeat; margin-bottom: 30px; }
body.prod-overview .left div.gutter { padding-left: 53px; }
body.prod-overview .left div.gutter h1 { color: #f8cf30; font-size: 48px; margin-bottom: 8px; line-height: .8em; }
body.prod-overview .left div.gutter h2 { color: #fff; font-size: 24px; line-height: 1em; }
body.prod-overview .left div.gutter h3 { color: #fff; font-size: 30px; margin-bottom: 20px; line-height: 1em; }
body.prod-overview .left div.gutter h4 { color: #fff; font-size: 18px; margin-bottom: 5px; }
body.prod-overview .left div.gutter ul { color: #fff; list-style: disc; margin-left: 20px; margin-bottom: 20px; }
body.prod-overview .left div.gutter p { color: #fff; font-size: 16px; width: 380px; margin-bottom: 20px; }
body.prod-overview .left div.gutter hr { width: 339px; margin-bottom: 20px; }
body.prod-overview .left div.gutter button.button { font-family: ChaparralPro; font-size: 25px; color: #ffffff; padding: 10px 20px; margin-bottom: 20px; width: 340px; line-height: 1em; background: -webkit-gradient(linear, left top, left bottom, from(#005c7e), to(#00334d)); -webkit-border-radius: 10px; border: 1px solid #75adc1; -webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.5), inset 0px 0px 1px rgba(255, 255, 255, 0.5); text-shadow: 0px -1px 0px rgba(0, 0, 0, 0.7), 0px 1px 0px rgba(255, 255, 255, 0.3); }
body.prod-overview .left footer { font-size: 10px; color: #fff; position: absolute; bottom: 10px; left: 53px; }
body.prod-overview .right { float: right; width: 595px; height: inherit; }
body.prod-overview .right.nc_sprinter { background: url("../images/overview_balloon_ncSprinter.png") no-repeat; }
body.prod-overview .right.sprinter_legend { background: url("../images/overview_balloon_sprinterLegend.png") no-repeat; }
body.prod-overview .right.falcon_cto { background: url("../images/overview_balloon_FalconCTO.png") no-repeat; }
body.prod-overview .right.falcon_grande { background: url("../images/overview_balloon_FalconGrande.png") no-repeat; }
body.prod-overview .right.falcon_forte { background: url("../images/overview_balloon_FalconForte.png") no-repeat; }
body.prod-overview .right.provia { background: url("../images/overview_provia_detailsViewImage.png") no-repeat; }
body.prod-overview .right.intuition { background: url("../images/overview_intuition_detailsViewImage.png") no-repeat; }
body.prod-overview .right.export_ap { background: url("../images/overview_catheter_exportAp.png") no-repeat; }
body.prod-overview .right.diver_ce { background: url("../images/overview_catheter_diverCE.png") no-repeat; }
body.prod-overview .right.diver_ce_max { background: url("../images/overview_catheter_diverCEMax.png") no-repeat; }
body.prod-overview .right.launcher { background: url("../images/overview_catheter_launcher.png") no-repeat; }
body.prod-overview .right.sherpa_nx { background: url("../images/overview_catheter_sherpaNx.png") no-repeat; }
body.prod-overview .right.inpact { background: url("../images/overview_deb_inpactFalcon.png") no-repeat; }
body.prod-overview .right.diver_support { background: url("../images/overview_other_supportCatheter.png") no-repeat; }
body.prod-overview div.popup { position: absolute; top: 150px; left: 180px; width: 664px; height: 352px; -webkit-transform: scale(0); -webkit-transition: all 300ms; -webkit-border-radius: 10px; -webkit-box-shadow: 0 0 15px #000; border: 2px solid #a3a3a3; background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #a3a3a3), color-stop(0%, #a3a3a3), color-stop(1%, #cecece), color-stop(2%, #d3d3d3), color-stop(6%, #f4f4f4), color-stop(7%, #fcfcfc), color-stop(46%, #fcfcfc), color-stop(95%, #edeef0), color-stop(96%, #e9eaec), color-stop(99%, #d1d1d2), color-stop(100%, #a3a3a3), color-stop(100%, #a3a3a3)); }
body.prod-overview div.popup.animate { -webkit-transform: scale(1); }
body.prod-overview div.popup div.gutter { position: relative; padding: 25px 0 0 31px;}

body.prod-overview div.popup .gutter{width: 80%; margin: 40px auto;}
body.prod-overview div.popup h1{font-size: 30px;}
body.prod-overview div.popup ul{ list-style: none; font-size: 18px;}
body.prod-overview div.popup ul li ul{margin-left: 5px;}
body.prod-overview div.popup ul li ul li{background: url('../images/popup-hyphen.gif') 0px 8px no-repeat; padding-left: 8px;}


body.prod-overview div.popup footer { position: absolute; bottom: 20px; left: 31px; }
body.prod-overview div.popup .closer { position: absolute; bottom: -25px; left: 35%; width: 189px; height: 41px; background: url("../images/popup_close_button.png") no-repeat; }
