/*----------------Core---------------------------*/ html { height: 100%; } body{ min-height: 100%; padding: 0px; margin: 0px; background: #fff; font-family: Arial, sans-serif; font-size: 14px; line-height: 1.5em; color: #333; height: 100%; } img, input[type=image] { border: 0px; vertical-align: middle; } a:link, a:visited, a:active { color: rgb(0,61,165); } a:focus, input:focus {outline: 0; } a:hover { color: #00aa8d; text-decoration: none;} form { margin: 0px; padding: 0px; } input[type=text], textarea { color: #fff; background: #111; border: 1px solid #000; padding: 2px; } input[type=submit] { cursor: pointer; color: #000; background: #34c6f5; padding: 2px 8px; border:0px; font-weight: bold; border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; } label { display: block; } .container { max-width: 920px; } /*------------UTILITIES ----------------------*/ .clear{ clear: both; height: 0px; margin: 0px; overflow: hidden; } .table-row { display: table; width: 100%; margin: 0; padding: 0; } .table-cell { display: table-cell; vertical-align: middle; } .no-list { list-style: none; padding-left: 0; } .no-list li { margin-left: 0px; } .bullet { display: inline-block; height: 0.6em; width: 0.6em; margin-right: 4px; border-bottom: 2px solid #fff; border-right: 1px solid #fff; background: #bb131a; } .row-5 { margin: 0 -7px; } .row-5 .col-sm-2 { width: 20%; padding: 0 7px; } .small-padding { margin-left: -5px; margin-right: -5px; } .small-padding .col-sm-1, .small-padding .col-sm-2, .small-padding .col-sm-3, .small-padding .col-sm-4, .small-padding .col-sm-5, .small-padding .col-sm-6, .small-padding .col-sm-7, .small-padding .col-sm-8, .small-padding .col-sm-9, .small-padding .col-sm-10, .small-padding .col-sm-11, .small-padding .col-sm-12, .small-padding .col-xs-1, .small-padding .col-xs-2, .small-padding .col-xs-3, .small-padding .col-xs-4, .small-padding .col-xs-5, .small-padding .col-xs-6, .small-padding .col-xs-7, .small-padding .col-xs-8, .small-padding .col-xs-9, .small-padding .col-xs-10, .small-padding .col-xs-11, .small-padding .col-xs-12 { padding: 0 5px; } .photo-caption { font-size: 11px; color: #888; display: block; line-height: 1.4em; text-align: right; margin-top: 3px; } .small-space { font-size: 5pt; } h1,h2,h3,h4,h5,h6 { font-family: Arial, serif; } #lightbox { position: fixed; top: 0px; left: 0px; width: 60%; min-width: 272px; max-width: 450px; padding: 25px 25px 59px; height: 80%; min-height: 272px; max-height: 500px; box-shadow: 0 0 8px rgba(0,0,0,0.2); background: #fff; border: 1px solid #ccc; z-index: 9998; } #chooser-container { height: 100%; overflow: auto; margin-bottom: -21px; } #chooser-container .row, #chooser-container #directory, #chooser-container .errorbx{ margin: 0px; } #chooser-container h3 { font-size: 24px; color: #000; margin: 0 0 8px; } #chooser-controls { z-index: 9999; margin-top: 44px; height: 21px; } #chooser-controls a{ display: block; text-align: right; color: #000; } #lightbox-screen { cursor: pointer; position: fixed; top: 0px; left: 0px; width: 100%; height: 100%; background: #eee; opacity: .8; -ms-filter: 'alpha(opacity=80)'; z-index: 9997; } #lightbox, #lightbox-screen{ display: none; } .bio { display: none; } .dividing-line { background: #2a70b8; background: linear-gradient(45deg, #00aa8d, #2a70b8); overflow: hidden; height: 5px; margin: 30px 0; } #tooltip { cursor: pointer; z-index: 9999; display: none; visibility: hidden; opacity: 0; color: #444; position: absolute; min-width: 100px; max-width: 250px; text-align: center; } #tooltip.show { display: block; visibility: visible; opacity: 1; } #tooltip .fa { line-height: 0px; display: block; font-size: 24px; margin: 0; height: 10px; } #tooltip .message { position: relative; z-index: 6; margin: 0px; padding: 4px 8px; background: #444; color: #fff; font-size: 12px; line-height: 1.2em; text-align: left; border-radius: 4px; overflow: hidden; } .photo-border { border: 1px solid #ccc; } /*------------HEADER----------------------*/ #logo { transition: all 0.2s ease-in-out 0.2s; -webkit-transition: all 0.2s ease-in-out 0.2s; width: 194px; } #header { background: #2a70b8; background: linear-gradient(45deg, #00aa8d, #2a70b8); z-index: 500; font-size: 16px; line-height: 1.4em; position: fixed; top: 0; opacity: 0; -webkit-transition: all 1s ease-in-out 0s; transition: all 1s ease-in-out 0s; width: 100%; left: 0; cursor: pointer; max-height: 100%; overflow: auto; padding: 10px 15px; color: #fff; } #header .company { display: block; font-weight:bold; } #header.loaded { top: 0px; opacity: 1; } #header a { color: #fff; } #header .logo { } #header .container-fluid { padding: 0 15px; } #header .table-cell { width: 33.33333333333333%; } #mobile-trigger { padding: 14px 0; } #mobile-trigger .menu-text { font-size: 16px; line-height: 1.4em; } #mobile-menu-btn { float: right; margin-left: 15px; cursor: pointer; width: 30px;overflow: hidden; text-decoration: none; } #mobile-menu-btn:hover { opacity: 0.5; } #mobile-menu-btn .icon-bar { height: 2px; background: #fff; display: block; margin: 4px 0px; } #mobile-menu-btn:hover .icon-bar { background: #fff; } #page-cover { cursor: pointer; display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(255,255,255,0.5); overflow: hidden; z-index: 501; } #mobile-menu { display: none; overflow: hidden; color: #fff; padding: 24px 0 8px; display: none; z-index: 510; } #mobile-menu.active { width: 300px; overflow: auto; } #mobile-menu .mobile-menu-trigger { cursor: pointer; font-size: 16px; line-height: 1.5em; padding: 18px 5px 19px; margin: -10px -30px 15px; text-align: center; background-color: rgba(0,0,0,0.05); } #mobile-menu ul { list-style: none; padding: 0; margin: 0; text-align: center; } #mobile-menu li { padding: 0; display: block; font-size: 16px; line-height: 1.5em; } #mobile-menu li i { display: none; } #mobile-menu li.last { border: 0; } #mobile-menu li a { display: block; color: #fff; text-decoration: none; padding: 5px 0; } #mobile-menu li a:hover { opacity: 0.5; } /*------------FOOTER----------------------*/ #footer { text-align: center; padding: 25px 15px; color: #777; border-top: 1px solid #ddd; margin-top: 25px; } #footer a{ color: #777; } /*------------PAGE WRAP----------------------*/ #page-wrap.active { -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; -o-backface-visibility: hidden; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transform: translateX(-300px); -moz-transform: translateX(-300px); -ms-transform: translateX(-300px); -o-transform: translateX(-300px); transform: translateY(-300px); -webkit-transition: all .2s ease; -moz-transition: all .2s ease; -ms-transition: all .2s ease; -o-transition: all .2s ease; transition: all .5s ease; -webkit-transform: translate3d(-300px, 0, 0); -moz-transform: translate3d(-300px, 0, 0); -ms-transform: translate3d(-300px, 0, 0); -o-transform: translate3d(-300px, 0, 0); transform: translate3d(-300px, 0, 0); height: 100%; overflow: hidden; } /*------------HOME----------------------*/ #cover { /*margin-top: 70px; */ margin-bottom: 20px; } #home { padding: 50px 0; color: #666; } #home .row { margin-left: -30px; margin-right: -30px; } #home .col-sm-1, #home .col-sm-2, #home .col-sm-3, #home .col-sm-4, #home .col-sm-5, #home .col-sm-6, #home .col-sm-7, #home .col-sm-8, #home .col-sm-9, #home .col-sm-10, #home .col-sm-11, #home .col-sm-12, #home .col-xs-1, #home .col-xs-2, #home .col-xs-3, #home .col-xs-4, #home .col-xs-5, #home .col-xs-6, #home .col-xs-7, #home .col-xs-8, #home .col-xs-9, #home .col-xs-10, #home .col-xs-11, #home .col-xs-12 { padding: 0px; } #home .column { padding: 0 30px; margin: 15px 0; } #home .column.left { border-right: 1px solid #ccc; } #home hr { border: 0; border-top: 1px solid #ccc; } #home .padding-15 { padding: 0 15px; } #home h2 { font-weight: 400; font-size: 30px; color: rgb(0,61,165); margin: 0 0 15px; } #home h2 span { display: block; font-weight: normal; } #home h3 { font-weight: 400; font-size: 18px; color: rgb(0,61,165); margin: 0 0 8px; } #home .quick-links { padding-left: 0; list-style: none; } #home .quick-links li { display: block; margin: 10px 0; padding-left: 15px; position: relative; } #home .quick-links li:before { content: "\f0da"; font:normal normal normal 14px/1 FontAwesome; font-size:inherit; text-rendering:auto; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; display: block; position: absolute; left: 0px; top: 4px; color: rgb(0,61,165); } #home .quick-links li a{ display: block; } #home a.read-more { font-size: 14px; font-weight: bold; } #home .stock { position: relative; overflow: hidden; max-width: 256px; margin: 30px 0; } #home .stock .ticker { position: absolute; z-index: 2; right: 10%; bottom: 17%; width: 80%; height: auto; padding: 0 5%; line-height: 1.5em; text-align: center; font-size: 11px; color: #666; font-style: italic; } #home .stock .ticker hr{ margin: 5px 0; } #home .intro { color: rgb(0,61,165); font-size: 20px; line-height: 1.5em; } #ticker-amount { font-size: 18px; line-height: 1.8em; font-weight: bold; display: block; color: #000; } #leading-brands-slider{ margin: 0px; padding: 0px; list-style: none; } .bx-wrapper .bx-pager { display: none; } .graph-container { margin-left: -4px; margin-right: -4px; position: relative; } .graph-container .callout { position: absolute; top: 0px; left: 6px; font-size: 36px; color: rgb(0,61,165); border: 1px solid rgb(0,61,165); line-height: 1em; padding: 15px; } .graph-container::before, .graph-container::after { display: table; content: " "; } .graph-container::after { clear: both; } .graph-container .col { position: relative; min-height: 1px; padding-right: 4px; padding-left: 4px; float: left; width: 12.5%; height: 365px; } .graph-container h3 { font-size: 24px; margin: 0; line-height: 1.5em; color: rgb(0,61,165) !important; font-weight: normal !important; } .graph-container h3 span { display: block; font-size: 12px; line-height: 1.5em; color: #666 !important; } .col .bar { border-color: rgb(0,61,165); box-sizing: content-box; border-radius: 0px; position: absolute; bottom: 15px; left: 10%; width: 80%; background: rgb(#00aa8d); background: linear-gradient(#00aa8d, #2a70b8); -webkit-transition: all 1s cubic-bezier(.87,-.41,.19,1.44); -moz-transition: all 1s cubic-bezier(.87,-.41,.19,1.44); -ms-transition: all 1s cubic-bezier(.87,-.41,.19,1.44); -o-transition: all 1s cubic-bezier(.87,-.41,.19,1.44); transition: all 1s cubic-bezier(.87,-.41,.19,1.44); } .col .bar .topper { -webkit-transition: all 1s cubic-bezier(.87,-.41,.19,1.44); -moz-transition: all 1s cubic-bezier(.87,-.41,.19,1.44); -ms-transition: all 1s cubic-bezier(.87,-.41,.19,1.44); -o-transition: all 1s cubic-bezier(.87,-.41,.19,1.44); transition: all 1s cubic-bezier(.87,-.41,.19,1.44); } .col .bar.curve { background-color: rgb(0,61,165); } .col .bar .shadow { position: absolute; left: 50%; width: 50%; bottom: 0; height: 100%; box-sizing: border-box; background: rgba(0,0,0,0.2); } .col .bar span { position: absolute; top: 100%; left: 0; width: 100%; text-align: center; font-size: 11px; } .col .bar .topper { position: absolute; font-weight: bold; font-size: 12px; bottom: 100%; left: 0; width: 100%; text-align: center; font-size: 11px; } #home-graph .col { width: 11.1111111111111%; height: 395px; } #robust-eps-growth { padding: 0 15px; } #robust-eps-growth .col { width: 25%; height: 330px; } #robust-eps-growth .callout { font-size: 24px; padding: 10px; top: 70px; left: 15px; } #dividend-growth { padding: 0 15px; } #dividend-growth .col { width: 25%; height: 300px; } #dividend-growth .callout { font-size: 24px; padding: 10px; top: 120px; left: 15px; } #bar-1 { height: 134px; border: 0; } #bar-2 { height: 134px; border-top: 48px solid rgb(0,61,165); } #bar-2 .topper { margin-bottom: 48px; } #bar-3 { height: 182px; border-top: 24px solid rgb(0,61,165); } #bar-3 .topper { margin-bottom: 24px; } #bar-4 { height: 206px; border-top: 52px solid rgb(0,61,165); } #bar-4 .topper { margin-bottom: 52px; } #bar-5 { height: 258px; border-top: 32px solid rgb(0,61,165); } #bar-5 .topper { margin-bottom: 32px; } #bar-6 { height: 290px; border-top: 36px solid rgb(0,61,165); } #bar-6 .topper { margin-bottom: 36px; } #bar-7 { height: 326px; border-top: 24px solid rgb(0,61,165); } #bar-7 .topper { margin-bottom: 24px; } #bar-8 { height: 350px; border-top: 8px solid rgb(0,61,165); } #bar-8 .topper { margin-bottom: 8px; } #bar-9 { height: 366px; } #bar-20 { height: 84px; } #bar-21 { height: 84px; } #bar-21 .topper { color: #fff;} #bar-24 { height: 188px; background: rgb(0,61,165); } #bar-22 { height: 67px; } #bar-23 { height: 183px; } @media all and (min-width: 991px) { #home-graph .col .bar { left: 15%; width: 70%; } } /*--- CHARTS ---*/ .ct-series-a .ct-bar { stroke: #bdbec1; } .ct-series-b .ct-bar { stroke: #f57b22; } .ct-series-a .ct-bar, .ct-series-b .ct-bar{ stroke-width: 35px; } .ct-grid { stroke: rgba(0, 0, 0, .1); stroke-width: 1px; stroke-dasharray: 0px; } /*------PAGES----------*/ .page { display: none; font-size: 16px; line-height: 1.6em; padding-top: 70px; padding-bottom: 20px; } .page h1 { font-size: 30px; margin: 35px 0 15px; line-height: 1.3em; color: rgb(0,61,165); } .intro-copy { color: rgb(0,61,165); font-size: 22px; line-height: 1.5em; margin-bottom: 15px; } .page .footer-img { margin-bottom: -20px; } .page hr { border-color: #ccc; } #home { display: block; } /*------------RRP----------------------*/ #rrp .iqos-headings { border-radius: 25px; background: #00aa8d; color: #fff; text-align: center; margin: 15px 0; padding: 4px;} #rrp .iqos-headings.blue { background: rgb(0,61,165); } #rrp .iqos-subheadings { text-align: center; font-size: 20px; font-weight: 700; color: #00aa8d; margin-bottom: 15px; } #rrp .iqos-subheadings.blue {color: rgb(0,61,165); } #rrp .iqos-subheadings span { display: block; margin: 0px auto; border-radius: 100%; line-height: 1em; border: 1px solid #00aa8d; padding: 4px; width: 26px; height: 26px; font-size: 16px; font-family: Arial; } #rrp .iqos-subheadings.blue span { border-color: rgb(0,61,165); } /*------------HIGHLIGHTS----------------------*/ #highlights h3 { color: rgb(0,61,165); font-size: 18px; line-height: 1.5em; font-weight: 700; } #highlights ul { margin: 0px 0 20px; padding-left: 13px; } #highlights li { list-style-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAAEklEQVQYlWMI7tT4jw8zjAwFADOGgMHcVOMSAAAAAElFTkSuQmCC'); } #eema-net-rev, #eema-operating { padding: 0 15px; } #eema-net-rev .col, #eema-operating .col { width: 25%; height: 200px; } #highlights-map { position: relative; } #highlights-map .hover-map { overflow: hidden; text-indent: -999em; opacity: 0; cursor: pointer;} /*------------LETTER----------------------*/ #letter h1 { color: rgb(0,61,165); } #letter h3 { font-weight: 700; color: rgb(0,61,165); font-size: 20px; line-height: 1.5em; } #letter .letter-caption { margin-bottom: 15px; color: rgb(0,61,165); font-size: 12px; line-height: 1.4em; margin-top: 5px; } #letter .quote { font-size: 28px; line-height: 1.5em; color: #8ec547; padding: 20px 0 10px; } #letter .callout-graph.right { border-left: 1px solid #ccc; padding-left: 15px; } #company-management { padding: 25px; border: 1px solid #ccc; margin: 20px 0 10px; font-size: 12px; line-height: 1.4em; color: #666 } #company-management hr { border-color: rgb(0,61,165); border-width: 3px; margin: 0 0 25px; } #company-management strong { color: #000; font-weight: normal; } #company-management h3 { margin-top: 0; } .charts { padding: 15px; color: #666; background: #fff; border: 1px solid #ccc; margin: 20px 0 10px; } .charts .title { margin-bottom: 15px; font-size: 16px; } .charts .chart-wrap { height: 300px; } #crt-1 { background: #fff; } #crt-2 { background: #fff; } .chart-example { } .chart-example .bar { border-top-right-radius: 6px; border-top-left-radius: 6px; width: 100px; height: 400px; margin: 0px auto; background-color: #f9ad1a; background-image: radial-gradient(ellipse farthest-corner at 100% 100% , transparent 20%, rgba(214,96,40, 0.5) 70%, transparent 0px), linear-gradient(#F9AD1A, #d66028); } .footnotes { margin-top: 15px; padding-top: 15px; font-size: 12px; line-height: 1.4em; color: #666; border-top: 1px solid #ccc; } .footnotes ul { list-style: none; padding-left: 0; } .footnotes li { display: block; padding-left: 15px; position: relative; } .footnotes li sup { display: block; position: absolute; left: 0px; top: 7px; } .callout-container { padding: 0 15px; border-left: 1px solid #f57b22; margin-left: -4px; margin-right: -4px; position: relative; } .callout-container h3 { font-size: 24px; margin: 0; line-height: 1.5em; color: #333 !important; font-weight: normal !important; } /*------------MANAGEMENT & BOD ----------------------*/ #bod .name, #management .name { color: rgb(0,61,165); } #management .gray, #bod .gray { font-size: 12px; color: #666; line-height: 1.6em; display: block; } #management { font-size: 14px; line-height: 1.5em; } /*------------ Shareholder ----------------------*/ #shareholder { } #shareholder h2 { color: rgb(0,61,165); font-size: 20px; line-height: 1.5em; font-weight: bold; margin: 0 0 15px; } #shareholder strong { color: rgb(0,61,165); } #shareholder .credits { font-size: 14px; line-height: 1.5em; } /*------------ Downloads ----------------------*/ #pdf-downloads ul { margin: 20px 0; padding-left: 13px; } #pdf-downloads li { list-style-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAEklEQVQImWPgCK79j44ZaCAIAEmALgA6UrbvAAAAAElFTkSuQmCC'); } #pdf-downloads li a { text-decoration: none; color: #333; } /*------------ VIDEOS ----------------------*/ #andre-video-page h1, #iqos-video-page h1 { color: rgb(0,61,165); } @media all and (min-width: 991px) { #menu-logo { max-width: 355px; } } @media all and (min-width: 766px) and (max-width:991px) { #dividend-growth .callout { top: 138px; } #menu-logo { max-width: 355px; } } @media all and (max-width:765px) { #header { padding: 10px 0; } #header .menu-text { font-size: 12px; } /*#header .text-right { text-align: center; }*/ .ct-series-a .ct-bar, .ct-series-b .ct-bar{ stroke-width: 15px; } #home .stock { margin: 0; } #home .row { margin-left: -15px; margin-right: -15px; } #home hr { margin: 0; } #home .column { padding: 15px 0px; margin: 15px 15px; } #home .column.left { border: 0; border-bottom: 1px solid #ccc; } #home-graph { padding-bottom: 30px; } .page { padding-top: 50px; } .page h1 { font-size: 20px; } .intro-copy { font-size: 16px; } #letter h3 { font-size: 16px; } #letter .quote { font-size: 20px; } /*#iqos-video-page .pull-right, #andre-video-page .pull-right { float: none !important; text-align: right; } */ #letter .callout-graph.right { border: 0; border-top: 1px solid #ccc; margin-top: 30px; padding: 0; padding-top: 30px; } #mobile-menu { padding: 30px 0 15px; } #bod .name { text-align: center;} .hide-mobile { display: none; } #letter .graph-container { margin-bottom: 15px; } .dividing-line { background-size: cover; } #mobile-trigger { padding: 4px 0; } .rrp-box { padding-bottom: 30px; margin-bottom: 30px; border-bottom: 1px solid #ccc; } .rrp-box.last { border: 0; } }