/* styles.generic.css -------------------------------------------*/ blockquote, body, dd, div, dl, dt, fieldset, form, h1, h2, h3, h4, h5, h6, html, img, input, label, legend, li, ol, p, pre, th, td, ul { padding: 0; margin: 0; } address, caption, cite, code, dfn, em, strong, th, var { font-style: normal; font-weight: normal; } table { empty-cells: show; border-collapse: collapse; border-spacing: 0; } fieldset, img { border: 0; } caption, th { text-align: left; } q:before, q:after { content: ''; } strong { font-weight: bold; } em { font-style: italic; } .clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } .clearfix { min-height: 1px; height: auto !important; height: 1px; } .right { float: right } .left { float: left } .align_right { text-align: right } /* Main Css Start Here -------------------------------------------*/ html { } textarea, input, button, select { font: 11px arial, sans-serif;} h1, h2, h3, h4, h5, h6 { font-size: 10px;} ol, ul { list-style: none; } /**** Sampurna ****/ a { color: #0096ff; text-decoration: underline;-webkit-tap-highlight-color: rgba(0,0,0,0) !important; } a:visited { text-decoration: none;-webkit-tap-highlight-color: rgba(0,0,0,0) !important; } a:hover { color: #333; text-decoration: underline; outline: 0;-webkit-tap-highlight-color: rgba(0,0,0,0) !important;} a:focus { text-decoration: none;outline: none;} /********* nav ************/ a:active { text-decoration: none;outline: none;}/********* nav ************/ /**** /Sampurna ****/ p { } .hidden { display: none; } .floatRight { float: right; } .floatLeft { float: left; } .imgfloatLeft { float: left; margin: 0 10px 10px 0; } .imgfloatRight { float: right; margin: 0 0 10px 10px; } .exception {} /* to be used for things like end of lists, etc. used SPARINGLY */ .firstItem {} .lastItem {} .noListStyle { list-style: none; padding: 0; margin: 0; } .noListStyle li { padding: 0; margin: 0; } .noBorder { border: none !important; } .noSpacing { margin: 0 !important; } /* accessibility (skip nav) -------------------------------------------*/ .accLinks, .accLinks p { display:none;} .accLinks p a, .accLinks p a:hover, .accLinks p a:visited { display:none;} .accLinks p a:active, .accLinks p a:focus { display:none; } .sectionMarker { display:none; } /* main containers -------------------------------------------*/ #pageContainer { position: relative; text-align: left; width: 860px; margin: 0 auto; padding: 10px 10px 0 10px; } .columnContainer { } /* Clearing STACKABLE Containers -------------------------------------------*/ .columnContainer { min-height: 1px; height: auto !important; height: 1px; } .columnContainer:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } #globalHeader { min-height: 1px; height: auto !important; height: 1px; width: 100%; padding: 8px 0; margin: 0 0 0px 0; } #globalHeader:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } #audienceContainer { min-height: 1px; height: auto !important; height: 1px; width: 860px; margin: 0 0 10px 0; } #audienceContainer:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } #safetyContainer { min-height: 1px; height: auto !important; height: 1px; clear:both;} #safetyContainer:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } #globalFooter { min-height: 1px; height: auto !important; height: 1px; } #globalFooter:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } #globalMainContainer { width: 100%; margin: 0 0 10px 0; overflow: hidden;} #globalHeader #globalLinks { min-height: 1px; height: auto !important; height: 1px; float: right; clear: right;} #globalHeader #globalLinks:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } #treatmentNav #treatmentNavContainer { min-height: 1px; height: auto !important; height: 1px; margin: 0 0 10px 0; } #treatmentNav #treatmentNavContainer :after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } #primaryBrandContainer { min-height: 1px; height: auto !important; height: 1px;max-width: 860px; width: 100%; margin: 0 0 10px 0; padding: 0px; } #primaryBrandContainer:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } /* GRIDS -------------------------------------------*/ .column { float: left; } .col1 {} .col2 {} .col3 {} .col4 {} .col5 {} /* form content -------------------------------------------*/ fieldset { margin: 0; padding: 0; height: auto; width: auto; display: block; } legend { font-size: 0; height: 0; width: 0; overflow: hidden; } form button { } form button div { } form button span { } form button:hover { cursor: pointer; } form button:hover div { } form button:hover span { } /* END COMMON ELEMENTS - BELOW ARE ITEM SPECIFIC ELEMENTS */ #novartis-homepage {} #novartis-subpage {} /* globalHeader -------------------------------------------*/ #header {background-color: #fff;} #globalHeader {} #globalHeader #brandLogo { display: block; background: url(../images/FPO.img.logo.gif) 0px 0px no-repeat; float: left;background-size: 100% auto; -webkit-background-size: 100% auto; -ms-background-size: 100% auto; -moz-background-size: 100% auto; } #globalHeader #brandLogo h1 { display: block; height: 85px; width: 240px; background-size: 100% auto; -webkit-background-size: 100% auto; -ms-background-size: 100% auto; -moz-background-size: 100% auto;} #globalHeader #brandLogo h1 a { text-indent: -9999px; overflow: hidden; display: block; height: 85px; width: 240px; background-size: 100% auto; -webkit-background-size: 100% auto; -ms-background-size: 100% auto; -moz-background-size: 100% auto; } /* THIS BLOCK SHOWS THE LANGUAGE LINK ON THE HEADER */ #globalHeader #globalLinks #siteSearch {} #globalHeader #globalLinks #siteSearch form {} #globalHeader #globalLinks #siteSearch form fieldset {} #globalHeader #globalLinks #siteSearch form fieldset label { width: 0; height: 0; overflow: hidden; display: block; } #globalHeader #globalLinks #siteSearch form fieldset input { width: 200px; border: 1px solid #666; } #globalHeader #globalLinks #siteSearch form fieldset button {} #globalHeader #globalLinks #siteSearch form fieldset button div {} #globalHeader #globalLinks #siteSearch form fieldset button div span {} /* added by Dave on 2008.07.17 for testing */ #globalHeader #infoLinks ul li.fullPrescribingInformation2 {display:inline;} /* localNavigation -------------------------------------------*/ #localNavigation { position: absolute; top: 62px; left: 10px; } #treatmentNav ul.levelOneNav ul.levelTwoNav { text-align: left; margin: 0 0 0px 0; } #treatmentNav ul.levelOneNav ul.levelTwoNav li { display: block; padding: 0; height: auto;line-height: normal; max-width:15%; text-align: left; border-right: none; float: left;} #treatmentNav ul.levelOneNav ul.levelTwoNav li a { display: inline; width: auto; height: auto; line-height: 18px; padding:0; color: #000;font-size:16px;font-weight:normal;text-transform: none;} #treatmentNav ul.levelOneNav ul.levelTwoNav li a:hover {color:#5d2583;} #treatmentNav ul.levelOneNav ul.levelTwoNav li.firstItem {} #treatmentNav ul.levelOneNav ul.levelOneNav li.lastItem {} #treatmentNav ul.levelOneNav ul.levelTwoNav li.before-your-first-visit {max-width: 16%;} #treatmentNav ul.levelOneNav ul.levelTwoNav ul.levelThreeNav { text-align: left; padding: 0; } #treatmentNav ul.levelOneNav ul.levelTwoNav ul.levelThreeNav li { display: inherit; padding: 0; border-right: none; } #treatmentNav ul.levelOneNav ul.levelTwoNav ul.levelThreeNav li a { width: auto; height: auto; line-height: 25px;border-bottom: none; } #treatmentNav ul.levelOneNav ul.levelTwoNav ul.levelThreeNav li.finalPage a {color: #fff;} #treatmentNav ul.levelOneNav ul.levelTwoNav ul.levelThreeNav li.lastItem {} #treatmentNav .localPromotion { display: block; height: 150px; text-align: center; border: 1px solid #666; } #treatmentNav .localPromotion h3 { text-align: center; line-height: 150px; } #treatmentNav .localNavigation {width:100%;display:none;border:0px solid black;position:absolute;margin-left:-1px;z-index: 999999; left:0px;} /**SampurnaB **/ #treatmentNav .navigationBackground {background:#e0e0e1;width:100%;padding-bottom: 19px;} #treatmentNav .navigationCont {max-width:1000px;margin:0 auto; } .pageScreenShot img {max-width:150px;} .headline {} .headline h3 a {text-align:left;} /* These two Lines important for displaying dropdown menu */ #treatmentNav li.firstItem .localNavigation {} #treatmentNav li.lastItem .localNavigation {} #treatmentNav li.hover div.localNavigation {/*display:block;*/} /* globalMainContainer -------------------------------------------*/ #globalMainContainer {} .gridContainer p {font-size: 12px;} .gridContainer h2 {} .gridContainer h3 {} /* subpage COLUMN CONTAINER TYPES -------------------------------------------*/ #novartis-subpage #subpageOneCol .columnContainer .col1 { padding: 0 20px 0 20px;} /* articleContainer -------------------------------------------*/ #articleContainer {} /* articleHead -------------------------------------------*/ #articleHead { } #articleHead h2 { font-weight: normal; font-size: 20px; line-height: 110%; margin: 0 0 10px 0; float:left;display:inline;} .utilityNav { width: 75px; float:right;} .utilityNav ul { width: 75px; } .utilityNav ul li { display: block; float: left; } .utilityNav ul li a { text-indent: -9999px; overflow: hidden; display: block; width: 20px; height: 20px; } .utilityNav ul li.utilityEmail a { background: url(../images/FPO.icon.mail.gif) 0px 0px no-repeat; } .utilityNav ul li.utilityPrint a { background: url(../images/FPO.icon.print.gif) 0px 0px no-repeat; } .utilityNav ul li.utilityTextRegular a { background: url(../images/FPO.icon.txt.sm.gif) 0px 0px no-repeat; width: 15px; } .utilityNav ul li.utilityTextLarge a { background: url(../images/FPO.icon.txt.lg.gif) 0px 0px no-repeat; width: 18px; } /* brandSpace -------------------------------------------*/ #brandSpace {} #brandSpace #primaryBrandContainer {} #brandSpace #primaryBrandContainer #primaryMediaContainer { float: left; width: 325px; margin: 0 20px 0 0; } #brandSpace #primaryBrandContainer #primaryMessageContainer { padding: 30px 0 0 0; } #brandSpace #primaryBrandContainer #primaryMessageContainer h2 { font-size: 20px; font-weight: normal; margin: 0 0 .5em 0; } #brandSpace #primaryBrandContainer #primaryMessageContainer p { font-size: 14px; margin: 0 0 .5em 0; } #brandSpace #primaryBrandContainer #primaryMessageContainer ul {} #brandSpace #primaryBrandContainer #primaryMessageContainer ul li { font-size: 14px; } #brandSpace #primaryBrandContainer #primaryMessageContainer ul li a { background: url(../images/FPO.icon.arrow.gif) 100% 0px no-repeat; height: 24px; padding: 0 20px 0 0; } #brandSpace #primaryPromoContainer { width: 840px; padding: 0 10px 0 10px; } #brandSpace #primaryPromoContainer .columnContainer { border-top: 1px dotted #333; padding: 10px 0 10px 0; } #brandSpace #primaryPromoContainer .columnContainer .column { width: 273px; height: 140px; border-right: 1px dotted #333; text-align: center; } #brandSpace #primaryPromoContainer .columnContainer .col1 {} #brandSpace #primaryPromoContainer .columnContainer .col2 {} #brandSpace #primaryPromoContainer .columnContainer .col3 { border-right: none; } #brandSpace #primaryPromoContainer .columnContainer .column p { line-height: 140px; } /* safetyContainer -------------------------------------------*/ #safetyContainer {} #safetyContainer h2 {font-size: 14px;} #safetyContainer p {} /* Overlay Div and loading message styles */ .overlayDiv {position:absolute !important;} /* For IE6 */ #overlayDiv {position:fixed;height:100%;width:100%;background:#CCCCCC;left:0;top:0;} #LoadingMessage {position:absolute;background:#EFEFEF;padding:8px;border:1px solid white;} /* Email This page form example, can be removed if a brandsite carries different look & feel for the form window */ .FormWindow {position:absolute;background:none;border:black;width:480px;} .FormWindow div.title {font-size:13px;color:#666666;font-weight:bold;padding-left:8px;float:left;width:200px;} .FormWindow div.closeBox {float:right;height:16px;width:16px;} .FormWindow div.closeBox a {float:left;background:url(../images/FPO.icon.close.gif) no-repeat center;height:16px; width:16px;} .Form {clear:both;margin-top:26px;} .Form td {padding:8px;} .FormWindow td.topLeft {height:6px;width:6px;background:url(../images/FPO.border.topLeft.gif) no-repeat top left;font-size:0.1px;line-height:6px;} .FormWindow td.bottomLeft {height:6px;width:6px;background:url(../images/FPO.border.bottomLeft.gif) no-repeat top left;font-size:0.1px;line-height:6px;} .FormWindow td.topRight {height:6px;width:6px;background:url(../images/FPO.border.topRight.gif) no-repeat top left;font-size:0.1px;line-height:6px;} .FormWindow td.bottomRight {height:6px;width:6px;background:url(../images/FPO.border.bottomRight.gif) no-repeat top left;font-size:0.1px;line-height:6px;} .FormWindow td.left {width: 6px;background-image:url(../images/FPO.border.left.gif);background-repeat:repeat-y;left;font-size:0.1px;height:200px;} .FormWindow td.right {width: 6px;background:url(../images/FPO.border.right.gif) repeat-y left;font-size:0.1px;height:200px;} .FormWindow td.topMid {height:6px;background:url(../images/FPO.border.top.gif) repeat-x top;font-size:0.1px;line-height:6px;} .FormWindow td.bottomMid {height:6px;background:url(../images/FPO.border.bottom.gif) repeat-x top;font-size:0.1px;line-height:6px;} .FormWindow td.content {background:white;} /* Tooltip styles */ #buiTooltip {position:absolute;} .buiTooltipRed {border:1px solid #FFFFFF;background:#FFFFFF; color:#FF0000;width:200px;padding:4px} .buiTooltipGreen {border:1px solid #FFFFFF;background:#FFFFFF; color:#000000;width:200px;padding:4px} .buiAbsolutePositionAdjustment {margin-left:-100px;border:1px solid #FFFFFF;background:#AAFFAA; color:#000000;width:200px;padding:4px} /* Contact US form styles */ form#contactUSForm div {margin-bottom:0.5em;} form span.required {color:red;font-weight:bold;} form#contactUSForm div.error {padding:3px; } form#contactUSForm #usConsumer {display:block;} form#contactUSForm #usHCP {display:block;} form#contactUSForm #nonUS {display:block;} div#maxLengthIndicator {display:inline;} div.links ul li {display:block;clear:both;margin-bottom:10px;} .contactUsEmailHead {float:left;width:60px;height:60px;background: url(../images/contact_email.gif) no-repeat 10px 20px;} .contactUsPhoneHead {float:left;width:60px;height:60px;background: url(../images/contact_phone.gif) no-repeat 10px 20px;} .contactUsMailHead {float:left;width:60px;height:60px;background: url(../images/contact_mail.gif) no-repeat 10px 20px;} .contactUsTxt {padding-left:65px;} .contactUsEmailHead a {float:left;height:100%;width:100%;} #usHCP {float:left; height:34px; width:247px; text-indent:-1000px; background:url(../images/contact_hcp.gif);} #usConsumer {float:left; height:34px; width:247px; text-indent:-1000px; background:url(../images/contact_consumer.gif);} /* Footer's copyright text */ strong {font-weight:700;} /* for IE6 */ /* Sitemap Styles */ .siteMapList ul {margin:8px !important; margin-left:25px !important; font-size:10px !important;} .siteMapList ul a {font-weight: bold; font-size: 12px;text-decoration: none;} .siteMapList ul li a {font-weight: bold; font-size: 14px; text-decoration: none;} .siteMapList ul li ul li a {font-size: 12px; font-weight: bold; text-decoration: underline;} .siteMapList ul li ul li ul li a {font-weight: normal; font-size: 12px; } .siteMapList ul li ul.hcp li a {font-size: 12px; font-weight: normal;} /* List Font Style ***/ /*div.list ol li {font-size:120%;} div.list ul li {font-size:120%;}*/ .inactive {cursor:default;} /* glossary -----------------------------*/ .bui_glossary {display: inline-block;} /* added for term of use*/ div.list {padding-left:20px} div.list ul {} div.list ul li {padding-top:20px;list-style-type: decimal} /* Oyala */ /*div[id^=ooyalaplayer] {} .video-wrap, #ooyalaplayer, .innerWrapper {position: relative;padding-bottom: 0; z-index: 0;} .video-wrap object {position: absolute;top: 0;left: 0;width: 100%;height: 100%;}*/ /* Flex slider CSS ------------------------------------*/ /* Browser Resets *********************************/ .flex-container a:active, .flexslider a:active, .flex-container a:focus, .flexslider a:focus {outline: none;} .slides, .flex-control-nav, .flex-direction-nav {margin: 0; padding: 0; list-style: none;} /* FlexSlider Necessary Styles *********************************/ .flexslider {margin: 0; padding: 0;} .flexslider .slides > li {display: none; -webkit-backface-visibility: hidden;} /* Hide the slides before the JS is loaded. Avoids image jumping */ .flexslider .slides img {width: 100%; display: block;} .flex-pauseplay span {text-transform: capitalize;} /* Clearfix for the .slides element */ .slides:after {content: "\0020"; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;} html[xmlns] .slides {display: block;} * html .slides {height: 1%;} /* No JavaScript Fallback */ /* If you are not using another script, such as Modernizr, make sure you * include js that eliminates this class on page load */ .no-js .slides > li:first-child {display: block;} /* FlexSlider Default Theme *********************************/ .flexslider { margin: 0 0 60px; background: #fff; border: 4px solid #fff; position: relative; -webkit-border-radius: 4px; -moz-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px; zoom: 1; } .flex-viewport { max-height: 2000px; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease; } .loading .flex-viewport { max-height: 300px; } .flexslider .slides { zoom: 1; } .carousel li { margin-right: 5px; } /* Direction Nav */ .flex-direction-nav {*height: 0; display: none;/* added for hide nav*/} .flex-direction-nav a { display: block; width: 40px; height: 40px; margin: -20px 0 0; position: absolute; top: 50%; z-index: 10; overflow: hidden; opacity: 0; cursor: pointer; color: rgba(0,0,0,0.8); text-shadow: 1px 1px 0 rgba(255,255,255,0.3); -webkit-transition: all .3s ease; -moz-transition: all .3s ease; transition: all .3s ease; } .flex-direction-nav .flex-prev { left: -50px; background: url(../images/prev.gif) no-repeat center center; width: 39px; height: 38px; text-indent: -999px; } .flex-direction-nav .flex-next { right: -50px; background: url(../images/next.gif) no-repeat center center; width: 39px; height: 38px; text-indent: -999px; } .flexslider:hover .flex-prev { opacity: 0.7; left: 0px; } .flexslider:hover .flex-next { opacity: 0.7; right: 0px; } .flexslider:hover .flex-next:hover, .flexslider:hover .flex-prev:hover { opacity: 1; } .flex-direction-nav .flex-disabled { opacity: 0!important; filter:alpha(opacity=0); cursor: default; } /* Control Nav */ .flex-control-nav {width: 100%; position: absolute; bottom: -40px; text-align: center;} .flex-control-nav li {margin: 0 6px; display: inline-block; zoom: 1; *display: inline;} .flex-control-paging li a {width: 11px; height: 11px; display: block; background: #666; background: rgba(0,0,0,0.5); cursor: pointer; text-indent: -9999px; -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; border-radius: 20px; -webkit-box-shadow: inset 0 0 3px rgba(0,0,0,0.3); -moz-box-shadow: inset 0 0 3px rgba(0,0,0,0.3); -o-box-shadow: inset 0 0 3px rgba(0,0,0,0.3); box-shadow: inset 0 0 3px rgba(0,0,0,0.3); } .flex-control-paging li a:hover { background: #333; background: rgba(0,0,0,0.7); } .flex-control-paging li a.flex-active { background: #000; background: rgba(0,0,0,0.9); cursor: default; } #novartis-homepage .flex-control-paging li a.flex-active { background: #000; background: #5d2583; cursor: default; }/****satheesh**********/ #novartis-homepage .flex-control-paging li a {width: 11px; height: 11px; display: block; background: #666; background: #fff; cursor: pointer; text-indent: -9999px; -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; border-radius: 20px; -webkit-box-shadow: inset 0 0 3px rgba(0,0,0,0.3); -moz-box-shadow: inset 0 0 3px rgba(0,0,0,0.3); -o-box-shadow: inset 0 0 3px rgba(0,0,0,0.3); box-shadow: inset 0 0 3px rgba(0,0,0,0.3); } .flex-control-thumbs {margin: 5px 0 0; position: static; overflow: hidden;} .flex-control-thumbs li {width: 25%; float: left; margin: 0;} .flex-control-thumbs img {width: 100%; display: block; opacity: .7; cursor: pointer;} .flex-control-thumbs img:hover {opacity: 1;} .flex-control-thumbs .flex-active {opacity: 1; cursor: default;} @media screen and (max-width: 860px) { .flex-direction-nav .flex-prev { opacity: 1; left: 10px;} .flex-direction-nav .flex-next { opacity: 1; right: 10px;} } @media only screen and (min-width: 240px) and (max-width: 640px) { div[id^=ooyalaplayer] {} .vediolist, #ooyalaplayer, .innerWrapper {position: relative;padding-bottom: 0; z-index: 0;} .vediolist object {position: absolute;top: 0;left: 0;width: 100%;height: 100%;} } @media only screen and (min-width: 768px) and (max-width: 1024px) { div[id^=ooyalaplayer] {} .vediolist, #ooyalaplayer, .innerWrapper {position: relative;padding-bottom: 0;height: 0; z-index: 0;} .vediolist object {position: absolute;top: 0;left: 0;width: 100%;height: 100%;} }