mdxComponents.js
Created Date: 2014-09-04
Author:Jayakumari Jayaraman 
*/
/* list-tabs CSS for MDX_TABS  */
ul,li,img {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	vertical-align: baseline;
	background: transparent;
	list-style:none;
}

ul.list-tabs {
	margin-left:10px;
	margin-right:3px;
	padding: 0;
	list-style: none;
/* 	border-bottom: 0.5em solid #bec3c9;	 */
}

ul.list-tabs li {
	display: inline-block;
	margin-right: 0.3em;
	outline:none;
}

ul.list-tabs a {
	margin-top: 0em;
	margin-bottom: 0em;
	margin-left: 0em;
	margin-right: 0em;
	font-family: arial, sans-serif;
	font-style: normal;
	font-variant: normal;
	font-weight: normal;
	font-size-adjust: none;
	font-stretch: normal;
	outline: blue;
	outline-color: invert;
	display: block;
	position: relative;
	background: #7e8c8d;
	color: #fff;
	font-size: 14px;
	line-height: 2.5em;
	padding: 0em 2em;
	text-decoration: none;
}

ul.list-tabs li.selected a {
	background-image: none;
	background-attachment: scroll;
	background-repeat: repeat;
	background-position-x: 0%;
	background-position-y: 0%;
	background-color: rgb(146, 79, 167);
}

/* ul.list-tabs li.selected a:after {
	content: url(../../../images/english/icon_arrow_tab_content.png);
	position: absolute;
	top: 65%;
	left: 40%;
	z-index: 10;
	font-size: 7px;
}
 */

/* div show/hide styles --------- */


.divhide {
	display: none;
	visibility:hidden;
	position:absolute;
	
}

.divshow {
	visibility:visible;
	width:99%;
	padding:20px 0px 0px 5px;
}

.divdisplayblock
{
	display:block;
    font: 13px arial, sans-serif !important;
}

.divdisplaynone
{
	display:none;
}

.border-thin
{
   border-left:1px solid #ddd;
  min-height:450px;
    margin-left:6px; 
    z-index: -1;
    position: inherit;
}

.border-thick
{
   border-left:5px solid #7e8c8d; 
   min-height:900px;   
   margin-left:6px;  
}

.border-left
{
  float:left;
  margin-right:8px
}

.border-right
{
  float:right;
  margin-left:8px;
  padding-right:5px;
}

.collapseExpandImage-left
{
   background-image:url(../../../images/english/icon_column_separator.png);
   position:relative;
   top:100px;
   left:-8px;
   width:10px;
   height:20px;
   cursor:pointer;
   position: inherit;
   z-index:0;
   margin-top:100px;
   margin-left:-7px;
}

.collapseExpandImage-right
{
  background-image:url(../../../images/english/icon_column_separator_right.png);
  position:relative;
  top:100px;
  left:-6px;
  width:10px;
  height:20px;
  cursor:pointer;
  position: inherit;
  z-index:0;
  margin-top:100px;
  margin-left:-7px;
}

/* CSS for Taxonomy Panel */

.clearBoth {
clear: both;
}
.toc-nav  a{
display: block;
/*font-size: 15px;*/
color: #7e8c8d;
padding: 5px;
}

.toc-nav , .allResultsLeft{
  font: 13px arial, sans-serif;
overflow: hidden;
float: left;
display: inline;
position: relative;
box-sizing: border-box;
padding-right: 5px;
padding-left: 6px;
}

.toc-nav ul , .allResultsLeft ul{
	margin-left: -35px;
	list-style: none outside none;
}

.content-narrow {
/* made changes for defect no 17 US87638 */
 /*  padding-top: 15px; */
 /*top: -13px;
position: relative;*/
/* End changes for defect no 17 US87638 */
overflow-x: hidden;
width: auto;
min-height: 450px;
padding-left: 25px;
box-sizing: border-box;
/*border-left: 5px solid #7e8c8d;
border-right: 1px solid #ddd;*/
}

.toc-nav > div > ul > li > ul > li > a, .allResultsLeft > div > ul > li > ul > li > a{
padding-left: 30px;
font-size: 13px;
font-weight: bold;
text-decoration: none;
color: #7e8c8d;
}

.toc-nav > div > ul > li > ul > li.active > a, .allResultsLeft > div > ul > li > ul > li.active > a {
color: #9264a7;
text-decoration: none;
}


.toc-nav >  div > ul > li > a, .allResultsLeft >  div > ul > li > a {
font-weight: bold;
padding-left: 15px;
background: #f1f1f1;
text-decoration: none;
color: #7e8c8d;
}

.toc-nav  > div > ul > li.active > a,  .allResultsLeft > div > ul > li.active > a {
background: #eee;
padding-left: 10px;
border-left: 5px solid #924fa7;
color: #9264a7;
}


.toc-nav > div > ul > li, .allResultsLeft > div > ul > li {
margin-bottom: 7px;
width: 206px;
}

/* Removing dotted rectangular box issue in US87636 */
.toc-nav > a:link, a:hover, a:active, a:visited, .allResultsLeft > a:link, a:hover, a:active, a:visited
{
outline:none !important;
}
/* End Removing dotted rectangular box issue in US87636 */
.content-options {
display: inline-block;
padding: 0 10px 0 0;
/* width: 160px;*/
float: right;
font-size: 83%;
}


.section-header {
color: #9246a7;
font-size:18px;
font-weight:bold;
}

.section-header > h2{
color: #9246a7;
margin-bottom: 10px;
font-size:20px;
font-weight: bold;
margin:0;
padding:0; 
}

.section-header > h3{
color: #7e8c8d;
margin-bottom: 10px;
font-size:16px;
font-weight: bold;

}

.toc-nav>div>ul>li>ul, .allResultsLeft>div>ul>li>ul {
	margin: 0;
	padding: 0;
}

.toc-nav>div>ul, .allResultsLeft>div>ul {
	margin: 0;
	padding: 0;
}

/* CSS for Show Results Panel */
.show-nav{
    float: right;
padding-right: 10px;
}
.show-nav div ul {
    margin: 0px 0px 0px 5px;
    padding: 0px;
    list-style: none outside none;
}
.show-nav div ul li{
    margin: 3px 0px;
    /* margin-left: -4px; */
}

.hide {
   display: none;
}

.modal-content div ul {
    margin: 0px 0px 0px 32px;
    padding: 0px;
    list-style: none outside none;
}
.modalid {
    color: #1675be;
text-decoration: none;
/* commented by Jayakumari to get outline while tabbing */
/*outline: none; */ 
    padding: 1px !important;
    list-style: none outside none; 
    font: 13px arial, sans-serif !important; 
    display: inline-block !important;
     }
.modalid a:hover {
  text-decoration: none;
}
.modalidpopup {
    color: #1675be;
    text-decoration: none;
    /* outline: none; */
    padding: 0px;
   /* commented by shankar for space between links and bullet */
    /* margin-left: 22px; */
    list-style: none outside none; 
    font: 13px arial, sans-serif; 
     
}
.modalidpopup a:hover {
  text-decoration: none;
}
.secondtitle{
  margin: 15px 0px 3px 16px;
  /* added by shankar for space between subheading and second title */
  padding-bottom: 5px;
}
.subtitleheading{
  margin: 0px 0px 10px -5px;
}
.thirdtitle{
  margin: 0px 0px 3px 40px;
}
.cross{
  	font-size: 19.5px;
	font-weight: bold;
	line-height: 1;
	color: #000;
	text-shadow: 0 1px 0 #fff;
  }
.btn:hover,.btn:focus{color:#fff;text-decoration:none}
.btn-default{color:#fff;background-color:#7e8c8d;border-color:#ccc}
.btn-default:hover,.btn-default:focus,.btn-default:active,.btn-default.active,.open .dropdown-toggle.btn-default{
    color:#fff;background-color:#6a7778;border-color:#adadad}
.btn-primary{color:#fff;background-color:#1675be;border-color:#1367a7}
.btn-primary:hover,.btn-primary:focus{
      color:#fff;background-color:#125e99;border-color:#0d4570}      
.close{float:right;font-size:19.5px;font-weight:bold;line-height:1;color:#000;text-shadow:0 1px 0 #fff;opacity:.2;
          filter:alpha(opacity=20)}
.close:hover,.close:focus{color:#000;text-decoration:none;cursor:pointer;opacity:.5;filter:alpha(opacity=50)}
button.close{padding:0;cursor:pointer;background:transparent;border:0;-webkit-appearance:none}
.modal-open{overflow:hidden}
.modal{display:none;overflow:auto;overflow-y:scroll;position:fixed;top:0;right:0;
  bottom:0;left:0;z-index:1050;-webkit-overflow-scrolling:touch;outline:0}
.modal-dialog{position:relative;width:500px;margin:350px;margin-top: 135px;margin-left: 250px;}
.modal-content{position:relative;background-color:#fff;border:1px solid #999;
        border:1px solid rgba(0,0,0,0.2);border-radius:6px;
        -webkit-box-shadow:0 3px 9px rgba(0,0,0,0.5);box-shadow:0 3px 9px rgba(0,0,0,0.5);
        background-clip:padding-box;outline:none}
.modal-header{padding:15px;border-bottom:1px solid #e5e5e5;min-height:16.42857143px}
.modal-header .close{margin-top:-2px}
.modal-title{margin:0;line-height:1.42857143}
.modal-body{position:relative;padding:20px}
.modal-data{padding: 20px; color: #333; max-height: 243px;overflow: auto; line-height:18px;}
.modal-footer{margin-top:15px;padding:3px 20px 3px;text-align:right;
            border-top:1px solid #e5e5e5}
.modal-check{margin-bottom:15px;text-align:left;margin-left: -20px;margin-top: -5px}
.main-checkbox{margin-left:-34px;margin-top:10px}
.sub-checkbox{padding-bottom:5px;margin-top:5px}            
.modal-footer .btn+.btn{margin-left:5px;margin-bottom:0}
.modal-footer .btn-group .btn+.btn{margin-left:-1px}
.modal-footer .btn-block+.btn-block{margin-left:0}
.btn-primary{color:#fff;background-color:#1675be;border-color:#1367a7;width: 80px}
.btn-default{width: 80px}
.modal-footer .btn+.btn {
margin-left: 5px;
margin-bottom: 0;
}   
.btn {
display: inline-block;
margin-bottom: 0;
margin-left: 5px;
margin-right: 5px;
font-weight: normal;
text-align: center;
vertical-align: middle;
cursor: pointer;
background-image: none;
border: 1px solid transparent;
white-space: nowrap;
padding: 6px 12px;
font-size: 13px;
line-height: 1.42857143;
border-radius: 4px;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}     
.modalDialog {
    position: fixed;
    font-family: Arial, Helvetica, sans-serif;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 99999;
    opacity:0;
    pointer-events: none;
  }
  .raContentPopup {
    position: fixed;
    font-family: Arial, Helvetica, sans-serif;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 99999;
    opacity:1;
    pointer-events: auto;
  }
  .showPopup{
    opacity:1;
    pointer-events: auto;
  }
 
  .modalDialog:target {
    opacity:1;
    pointer-events: auto;
  }
 
button.cross {
	padding: 0px;
	cursor: pointer;
	background: none repeat scroll 0% 0% transparent;
	border: 0px none;
	float: right;
	text-align: right;
	clear: left;
	padding-top: 14px;
	padding-right: 10px;
	/* outline: none; */
	width:30px;
}
  .close {
    margin-top: -2px;
    color: #FFFFFF;
    line-height: 20px;
    position: absolute;
    right: 5px;
    text-align: center;
    top: 2px;
    width: 21px;
    text-decoration: none;
    font-weight: bold;
    -moz-border-radius: 12px;
    border-radius: 12px;
    float: right;
font-size: 19.5px;
font-weight: bold;
line-height: 1;
color: #000;
text-shadow: 0px 1px 0px #FFF;
opacity: 0.2;
  }
.maindivshowresults {
  font: 13px arial, sans-serif;
  padding-left:5px;
  margin-top:-15px;
}
.maindivshowresults > h3{
font-size: 16px;
}
.maindivshowresults > h1, h2, h3, h4 {
font: 13px arial, sans-serif;  
font-weight: bold;
color: #7e8c8d;
margin-bottom: 10px;
}
.maindivshowresults > hr{
    border-style: none none solid;
    color: #ddd;
    height: 2px;
    margin-bottom: 10px;
    margin-top: 10px;
}

.bullet-link{
	list-style-type: disc;
   list-style-position: initial;
}
.spacesecondheading{
	margin-top:-8px;
}

	/** CSS related to search within document and navigate to subsection**/
	#indepthpanel_fullDocumentSearchText
	{
		font-size: 13px;
		font-weight:bold;
		color: #ccc;
		border: Solid 1px #d6d6d6;
		width: 200px;
		height:30px;
		height:30px\9;
		line-height:30px\9;
		text-indent:5px;
		float: left;
		padding: 0 0px;
	}
	input.fullDocumentTextSearchIcon {
		width: 44px;
		height: 32px;
		background: #eee url(../../../images/english/global_icon_search.png) center center no-repeat;
		border: solid 1px #d6d6d6;
		cursor: pointer;
		margin-left: 0px;
		border-radius: 4px;
		position: inherit;
		left: -4px;
		position: relative;
		border-top-left-radius: 0px;
		border-bottom-left-radius: 0px
	}
	#indepthpanel_full_document_container{
		padding-left: 5px;
	}
	#MyDocOutLine,#MyDocOutLine_neonatal,#MyDocOutLine_pediatric{
		position: absolute;
		height: 32px;
		padding: 6px 12px;
		line-height: 1.42857143;
		background-color: #fff;
		background-image: none;
		-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);
		box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);
		-webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
		transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
	}
	#indepthpanel_fulldoc_search_message_container{
		padding-top: 10px;
		font-family: Arial, Helvetica, sans-serif;
		font-weight: normal;
		font-size: 13px;
		color: #333;
		padding-bottom: 10px;
		background-color: white;
	}
	.upwardNavigationIcon{
		
		border-width: 1px 1px 1px 1px
	}
	.downwardNavigationIcon{
		
		border-width: 1px 1px 1px 1px
	}
	
	#indepthpanel_fulldoc_search_container{
	padding-top: 10px;
	background-color: white;
	margin-top: 0px;
	}
	
.fa{
  display: inline-block;
  font-family: FontAwesome;
  font-style: normal;
  font-weight: normal;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font: 13px arial, sans-serif !important;
}
.fa-bars:before{
  content: url(../../../images/english/fa-bar.png);
}
.fa-print:before{
  content: url(../../../images/english/fa-print.png);
}
.fa-file-text:before {
    color: #1675be;
    content: url("../../../images/english/fa-file-text.png");
}
.marginIndepthHyperlink {
    margin-bottom: 14px;
}
	/** Added for the docking the header in full document view **/
	.landingTabDock
	{
	position: fixed;
	width: 99%;
	background-color: #fff;
	z-index: 948;
	/* margin-top changed from 38px to 48px to ensure the title is at same position across all the tabs */
	margin-top: 38px;
	max-width: 1784px;
	left: 0;
	right: 0;
	margin-right: auto;
	margin-left: auto;
	}

	.fullDocumentHeaderDock
	{
	position: fixed;
	float: right;
	width: 98%;
	/* padding-top changed from 84px to 94px to ensure the title is at same position across all the tabs */
	padding-top: 84px;
	z-index: 946;
	background-color: white;	
	max-width: 1784px;
	left: 0;
	right: 0;
	margin-right: auto;
	margin-left: auto;
	}		

	.fullContentPanelDock
	{
	padding-top: 133px;
	}
	
	.landingPageTitleDock
	{
	z-index: 947;
	background-color: white;
	position: fixed;
	width: 99%;
	/* margin-top commented to ensure the title is at same position across all the tabs*/
	margin-top: -22px;
    height: 120px;
    max-width: 1784px;
    left: 0;
    right: 0;
    margin-right: auto;
    margin-left: auto;
	
	}
	/** Added for search within document**/
	.highlight
    {
       background-color:#F6E6B3;
    }
	.currentHighlight
    {
       background-color:#FDA768 !important;
    }

/*  */


/* added by shankar for print icon quick and Indepth Answers */
.print-icn{
width: 30px;
height: 18px;
background: url(../../../images/english/fa-print.png) left bottom no-repeat;
border:0;
/* Commented by Jayakumari as part of 508 Compliance US to get proper outline while tabbing */
/* margin-left:-2px; */
margin-top: 10px;
display: block;
padding-left: 20px;
list-style: none outside none;
font: 13px arial, sans-serif !important;
}

.showDownload-icon{
width: 18px;
background: url(../../../images/english/fa-download.png) left bottom no-repeat;
border:0;
padding-top: 0px;
padding-left:20px;	
}

/* added by shanakr for document icon for Indepth Answers and Full Document view */
.documentview-icon {
width: 16px;
height: 16px;
background: url(../../../images/english/fa-file-text.png) left center no-repeat;
border:0;
display: inline;
padding-left: 20px;
font-size: 13px;
}
/* Changed position to relative for Quick and InDepth Answers page*/
.backToTop {
    visibility:hidden;
    width: 40px;
    height: 40px;
    right: 0px;
    position:relative;
    color:#ffff;
    background: url(../../../images/english/icon-top.png) center no-repeat;
    border-radius:0px;
    left: -8px;
   }
.errorMessagePrint{
/*this is the new style we are using in EX*/
font-size:13px;
font-weight:bold;
background-color:#f4e5e5;
color: #ff0000;
border:1px solid #dc0a0a;
/*margin-left: -4px;
margin-top: -5px;*/
margin-bottom: 8px;
padding:8px;
text-indent:5px;
width:95%;
box-sizing: border-box;
margin: 5px auto;}
/* added by Karthic.S for Contact Us button for No Subscription */
.contact-us-btn {
width: 120px;
padding: 6px 12px;
background: #1675be url(../../../images/english/fa-arrow.png) 120px center no-repeat;
font-size: 13px;
font-weight: normal;
color: #FFF;
margin-right: 5px;
margin: 10px 0px;
border-radius: 4px;
border-color: #1367a7;
line-height: 1.42857143;
margin-top: 20px;
float: left;
clear: both;
}
.contact-us-btn:hover,.contact-us-btn:focus{
color:#fff;
background-color:#125e99;
border-color:#0d4570;
}    
.crosswalkFont{
font-size: 13px;
/*font-weight: bold;*/
color: #333;
}
.sub_plans{
font-size: 16px;
font-weight: bold;
color: #333;
margin: 5px 0px;
margin-top: 20px;
}
.caret-ico {
background: transparent url(../../../images/english/icon_arrow_tab_content.png) center -4px no-repeat !important;
border-radius: 0px !important;
}
.tab-div-border{
border-bottom: 0.5em solid #bec3c9;
margin-top: -28px;
margin-left: 10px;
}

/** Added for print popup font **/
.content-options-print {
font-size: 83%;
}
/** Styles for Drug landing page Full Document **/
.drugLandingTabDock
{
position: fixed;
width: 99%;
background-color: #fff;
z-index: 946;
/* margin-top changed from 90px to 98px to ensure the title is at same position across all the tabs */
margin-top: 98px;
max-width: 1784px;
left: 0;
right: 0;
margin-left: auto;
margin-right: auto;
}

.drugFullDocumentHeaderDock
{
position: fixed;
float: right;
width: 98%;
/* padding-top changed from 135px to 145px to ensure the title is at same position across all the tabs */
padding-top: 135px;
z-index: 945;
max-width: 1784px;
left: 0;
right: 0;
margin-right: auto;
margin-left: auto;
}		

.drugFullContentPanelDock
{
padding-top: 180px;
}

ul.list-tabs a:focus{
	outline: 2px solid grey;
}

ul.list-tabs li.selected a:focus{
	outline: none;
}

.allResultsLeft div ul li{
	margin-top: 3px;
}

.flagImage-ema{
	  background-image:url(../../../images/english/flag-ema.png);
}

.flagImage-healthcanada{
	  background-image:url(../../../images/english/flag-healthcanada.png);
}
.raImage-fda{

  float: left;
  height: 25px;
  width: 47px;
  position: relative;
  right: 8px;
  margin-top: 42px;
}

.raImage-ema{

  float: left;
  height: 25px;
  width: 37px;
  position: relative;
  right: 8px;
  margin-top: 42px;
}


.raImage-healthcanada{

  float: left;
  height: 25px;
  width: 50px;
  position: relative;
  right: 8px;
  margin-top: 42px;
}

.raSelect{
    border: 1px solid #d6d6d6;
    border-radius: 4px;
    color: #555;
    font-size: 13px;
    padding: 5px;
    width: 133px;
    margin-top: 40px;
}

.middlePanelRA-fda{

	height: 25px;
    width: 47px;
    display: inline-block;
}

.middlePanelRA-ema{

	height: 25px;
    width: 37px;
    display: inline-block;
}

.middlePanelRA-healthcanada{

	height: 25px;
    width: 50px;
    display: inline-block;
}

.backToTop-ema{
    background-image:url(../../../images/english/flag-backToTop-ema.png);
    height: 23px;
    width: 39px;
    display: inline-block;
    background-repeat: no-repeat;
    float: left;
    margin-right: 2px;
    margin-top: 2px;
}

.backToTop-healthcanada{
    background-image:url(../../../images/english/flag-backToTop-healthcanada.png);
    height: 20px;
    width: 40px;
    display: inline-block;
    background-repeat: no-repeat;
    float: left;
    margin-right: 2px;
    margin-top: 2px;
}
.sectionTopicDiv{
	float:left;
	margin-right:10px;
}

.flagOuterContainer{
	margin-top:10px;
	float:left;
	
}

.flagOuterContainerWithSection{
    visibility: hidden;
    float: right;
    right: 19px;
    position: fixed;
    width:124px;
    cursor: pointer;
    background-color: white;
	padding: 10px;
	box-shadow: 3px 3px 2px #808080;
	z-index:948;
}
.sectionSubTopicHeaderNearArrow{
    visibility: hidden;
    font-size: 13px;
    font-weight: bold;
    margin-left: 0px;
    position: relative;
    color: #7e8c8d;
    max-width: 94px;
}
/* Introduced for veiw Full Document and All Results page*/
.backToTopCommon{
    visibility:hidden;
    width: 40px;
    height: 40px;
    float: right;
    right: 0px;
    position:fixed;
    cursor: pointer;
    color:#ffff;
    padding:10px 25px 10px 10px;
    background: url(../../../images/english/icon-top.png) center no-repeat;
    border-radius:0px;
}
@media screen and (min-width: 1784px){
  /* Right align for large screens based on body max-width */
  .backToTopCommon {
    right: calc((100% - 1784px) / 2);
  }
}
@media screen and (min-width: 1784px){
  /* Right align for large screens based on body max-width */
  .flagOuterContainerWithSection {
    right: calc((100% - 1784px) / 2);
  }
}