﻿/* DEFAULTS
----------------------------------------------------------*/
.backgroundWindowTop, .backgroundWindowMiddleLeft, .backgroundWindowMiddleCenter, .backgroundWindowMiddleRight, .backgroundWindowBottom, 
#officesPopupShadow, #careersPopupShadow, #humanityPopupShadow, #awardsPopupShadow, #pageTitle img, .tabTitle, #popupBackground, #pageWrapper, a.button span, 
a.scrollButtons, .accordionWrapper, #bodyBG, #bodyCurve, #logoContainer, #bodyBG, #bodyCurve
{ behavior: url(/scripts/iepngfix.htc); }


html, body {
  /*overflow: hidden; */
  width: 100%;
  margin: 0;
  padding: 0;
  /*overflow-x:hidden;
  overflow-y:auto; */
}

body {
    background: #E6D4C1;
    font-size: 11px;
    font-family: Arial, Helvetica, sans-serif;
    color: #000;
    overflow:hidden;
}

p {
    padding: 0;
    margin: 0;
}

img 
{
    border: none;
}

/* Our Sites */
#top-wrapper
{
	height:20px;
	width:958px;
	margin:0 auto;
    padding: 5px 0;
	font-size:11px;
	position:absolute;
    z-index: 5;
    color: #DADADA;
}
#top-wrapper ul { margin: 0; }
#top-wrapper .our-sites { margin-left: 20px; }
#top-wrapper span { float: left; padding: 0px 5px 0 0; font-weight: bold; }
#top-wrapper ul li { display: inline; float: left; font-size: 12px; padding: 0px 0 0 10px; margin: 0 0 0 0px; font-weight: bold; }
/*#top-wrapper .selected { color: #999; }*/
#top-wrapper ul.grayLinks li a { color: #DADADA; } /* Adapt to background color scheme. _MasterLayout:155-156 */
#top-wrapper ul.blackLinks li a { color: #444; }
#top-wrapper span.grayLinks { color: #DADADA; }
#top-wrapper span.blackLinks { color: #444; }

#top-wrapper ul.grayLinks li a.selected { color: rgb(49, 49, 49); }
#top-wrapper ul.blackLinks li a.selected { color: #999; }

.active-tab { color: #EC008C !important; }

.btn-corp-overview
{
    background: url("https://phenomenex.blob.core.windows.net/contentcorporate/images/overview.png") no-repeat;
    background-size: cover;
    width: 87px; 
    height: 64px;
    cursor: pointer;
    margin: 0 0 10px 12px;
}

.btn-corp-slideshow
{
    background: url("https://phenomenex.blob.core.windows.net/contentcorporate/images/slides.png") no-repeat;
    background-size: cover;
    width: 87px; 
    height: 76px;
    cursor: pointer;
    margin: 30px 0 10px 12px;
}

.scienceBtn1
{
    background: url("https://phenomenex.blob.core.windows.net/contentcorporate/images/whoweserve_video_btn_sciences2.png") no-repeat;
    width: 116px; 
    height: 60px;
    background-position:0px -65px;
    cursor: pointer;
}

.scienceBtn2
{
    background: url("https://phenomenex.blob.core.windows.net/contentcorporate/images/whoweserve_video_btn_sciences.jpg") no-repeat;
    width: 116px; 
    height: 65px;
    background-position:0px -66px;
    cursor: pointer;
}

.sprite-corporate-site { background: url("https://phenomenex.blob.core.windows.net/contentcorporate/images/sprites/sprite-corporate-site.png") no-repeat scroll; }

div.contentBtn1
{
    width: 116px;
    height: 72px;
    background-position:0px -96px;
    cursor: pointer;
    margin-bottom: 30px;
}

div.contentBtn1UnSelected:hover
{
   background-position:0px -240px;
}

div.contentBtn1Selected
{
    background-position:0px -168px;
}

div.contentBtn2
{
    width: 116px;
    height: 72px;
    background-position:-241px -96px;
    cursor: pointer;
}

div.contentBtn2UnSelected:hover
{
    background-position: -241px -240px;
}

div.contentBtn2Selected
{
    background-position: -241px -168px;
}

div.contentBtn3
{
    width: 116px;
    height: 72px;
    background-position: -121px -96px;
    cursor: pointer;
}

div.contentBtn3UnSelected:hover
{
    background-position: -121px -240px;
}

div.contentBtn3Selected
{
    background-position: -121px -168px;
}

.customersBtn
{
    width: 116px; 
    height: 72px;
    background-position:-382px -336px;
    cursor: pointer;
}

.employeesBtn
{
    width: 116px; 
    height: 72px;
    background-position:-503px -408px;
    cursor: pointer;
}

.philanthropyBtn
{
    width: 116px; 
    height: 72px;
    background-position:-624px -408px;
    cursor: pointer;
}

.storyBtn
{
    width: 116px; 
    height: 72px;
    background-position:-382px -187px;
    cursor: pointer;
}

.cultureBtn
{
    width: 116px; 
    height: 72px;
    background-position:-503px -259px;
    cursor: pointer;
}

.scienceBtn
{
    width: 116px; 
    height: 72px;
    background-position:-624px -259px;
    cursor: pointer;
}

div.tabContent a, div.whiteTextSection a, #tabPopupText a {
    color: blue;
}

div.tabContent a:hover, div.whiteTextSection a:hover, #tabPopupText a:hover {
    color: #444;
}


a.button, a.button:link, a.button:visited, a.button:active {
    color: #fff;
    display: block;
    float: left;
    font: normal 12px arial, sans-serif;
    height: 29px;
    margin-right: 8px;
    padding-right: 5px; /* sliding doors padding */
    text-decoration: none;
}

a.button span {
    background: transparent url('https://phenomenex.blob.core.windows.net/contentcorporate/images/mainMenuTabLeft.png') no-repeat;
    display: block;
    line-height: 29px;
    padding-left: 6px;
} 

a.button:hover 
{
    color: #EC008C;
    text-decoration: none;
}

a.button:hover span {

}

a, a:link, a:visited, a:active
{
    text-decoration: none;
    color: #fff;    
}

a:hover
{
    text-decoration: none;
    color: #444; 
}

a.topMenu, a.topMenu:link, a.topMenu:visited, a.topMenu:active
{
    text-decoration: none;
    color: #fff;    
    font-weight: bold;
}

a.topMenu:hover
{
    text-decoration: none;
    color: #636466; 
}

a.link2, a.link2:link, a.link2:visited, a.link2:active 
{
    color: #fff;
    text-decoration: none;
}

a.link2:hover 
{
    color: #EC008C;
    text-decoration: none;
}
	
a.link3, a.link3:link, a.link3:visited
{
    color: #414042;
    text-decoration: none;
}

a.link3:hover, a.link3:active
{
    color: blue;
    text-decoration: none;
}

a.link4, a.link4:link, a.link4:visited
{
    color: blue;
    text-decoration: none;
}

a.link4:hover, a.link4:active
{
    color: #414042;
    text-decoration: none;
}

/* HEADINGS   
----------------------------------------------------------*/

h1 {
    font-size: 72px; 
    color: #444; 
    text-align: right;
    padding: 0;
    margin: 0;
    font-weight: normal;
}

h2 {
    color: #89108A;
    font-size: 20px;
    font-weight: bold;
    padding: 10px 0 0 0;
    margin: 0;
}

h3 
{
    color: #89108A;
    font-size: 12px;
    padding: 0;
    margin: 0;
}

h4 {
    color: #444;
    font-variant: small-caps;
    font-weight: normal;
    font-size: 16px;
    margin: 0;
    padding: 0 10px 0 0;
}

h5 {
    font-family: Times New Roman, serif; 
    font-size: 18px; 
    color: #444;
    font-weight: normal;
    margin: 0;
    padding: 0 0 5px 0;
}

h6 
{
    font-size: 15px; 
    color: #83A900;
}

.h7 
{
    color:#FFFFFF; 
    line-height:24px; 
    font-size:14px; 
    text-shadow: 1px 1px 1px #343434; 
    height: 24px; 
    background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/h7Bkrnd.gif') repeat-x;
    padding: 0 4px;
    margin: 0;
}

.h8 
{
    color:#3E5004; 
    font-weight: bold;
    font-size:12px; 
    padding: 5px 0;
}

.h9
{
    font-weight: bold;
    padding: 5px 0;   
}

.h10
{
    color:#3E5004;
    padding: 5px 0;
}


/* PRIMARY LAYOUT ELEMENTS   
----------------------------------------------------------*/

.tabContentContainerNoBorder
{
    padding: 0px; 
    width: 594px;
    height: 334px;
}

.tabContentMargin
{
    width: 30px;
    height: 304px;
}

.tabMenu
{
    width: 135px;
    height: 334px;
}

.accordionWrapper
{
    width: 929px;
    height: 334px;
}

.backgroundWindow
{
	margin:0 auto; /* center, not in IE5 */
	width: 836px;	
    height: 334px;
    border-right: 1px solid black;
}

.backgroundWindowTop
{
    width: 836px;
    height: 80px;
}

.backgroundWindowMiddle
{
    width: 836px;
    height: 210px;
}

.backgroundWindowMiddleLeft
{
    width: 334px;
    height: 210px;
}

.backgroundWindowMiddleCenter
{
    width: 167px;
    height: 210px;
}

.backgroundWindowMiddleRight
{
    width: 334px;
    height: 210px;
}

.backgroundWindowBottom
{
    width: 836px;
    height: 44px;
}

.accordionWrapper div.title
{
    width: 24px;
    height: 334px;
}

#pageTitle
{
    margin: 0 auto 0 485px;
    width: 929px;
}

#pageWrapper 
{
    top: 0;
    left: 0;
    padding: 188px 0 0 0;
    position: absolute;
    z-index: 2;
	margin:0 auto; /* center, not in IE5 */
	width: 1400px;
	height: 100%;
}

#jobsWrapper 
{
    background: white;
    top: 155px;
    padding: 10px;
    position: relative;
    z-index: 2;
	margin:0 auto; /* center, not in IE5 */
	width: 960px;
	height: 650px;
    box-shadow: 0 0 10px 2px #444;
    -webkit-box-shadow: 0 0 10px 2px #444;
    -moz-box-shadow: 0 0 10px 2px #444;
    border-radius: 6px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
}
#jobsWrapper h1 { text-align: left !important; font-size: 64px !important; }

#backgroundWindowWrapper 
{
    top: 0;
    left: 0;
    padding: 245px 0 0 0;    
    position: absolute;
	margin:0 auto; /* center, not in IE5 */
	width: 1400px;
	height: 100%;	
	z-index: 1;
}

.tabContent {
    overflow: auto;
    padding: 0 20px 0 0;
    float: left;
    width: 510px;
    height: 304px;
}

.tabContentContainer 
{
    width: 594px;
    height: 334px;
    padding: 20px; 
}

/*.pageTitle 
{
    display: block;
    padding: 0 0 0 40px;   
}*/

/* POPUP 
----------------------------------------------------------*/
#popupBackground   
{
    display:none;   
    position: absolute; 
    left: 50%;
    top: 0; 
    width: 2000px; 
    margin-left: -960px; 
    height:200%;
    background: transparent url('https://phenomenex.blob.core.windows.net/contentcorporate/images/popupBG.png'); 
    z-index:650;   
} 

#popupWrapper 
{
    top: 150px;
    left: 0;  
    position: absolute;
	margin:0 auto; /* center, not in IE5 */
	width: 1400px;
	z-index: 750;
}

.popupLeftFiller 
{
    background: url(https://phenomenex.blob.core.windows.net/cdn/Content/Images/popupLeftMid.png) repeat-y; float: left; width: 25px; height: auto;
}

.popupRightFiller
{
    background: url(https://phenomenex.blob.core.windows.net/cdn/Content/Images/popupRightMid.png) repeat-y; float: left; width: 25px; height: auto;
}

.popupUpperLeft
{
    background: url(https://phenomenex.blob.core.windows.net/cdn/Content/Images/popupUpperLeft.png) no-repeat; float: left; width: 25px; height: 20px;
}

.popupUpperRight
{
    background: url(https://phenomenex.blob.core.windows.net/cdn/Content/Images/popupUpperRight.png) no-repeat; float: left; width: 25px; height: 20px;
}

.popupLowerLeft
{
    background: url(https://phenomenex.blob.core.windows.net/cdn/Content/Images/popupLowerLeft.png) no-repeat; float: left; width: 25px; height: 20px;
}

.popupLowerRight
{
    background: url(https://phenomenex.blob.core.windows.net/cdn/Content/Images/popupLowerRight.png) no-repeat; float: left; width: 25px; height: 20px;
}

.popupUpperFiller 
{
    background: url(https://phenomenex.blob.core.windows.net/cdn/Content/Images/popupUpperMid.png) repeat-x; float: left; width: 422px; height: 20px;
}

.popupLowerFiller
{
    background: url(https://phenomenex.blob.core.windows.net/cdn/Content/Images/popupLowerMid.png) repeat-x; float: left; width: 422px; height: 20px;
}



/* FOOTER   
----------------------------------------------------------*/

#level1FooterLinks 
{
    float: left;    
}

#level1FooterLinks p, #level1FooterLinks p a, #level1FooterLinks p a:link, #level1FooterLinks p a:visited
{
    color: #89108A;   
    text-transform: uppercase;
    font-weight: bold;
    font-size: 12px;
    text-decoration: none;     
}

#level1FooterLinks p a:hover, #level1FooterLinks p a:active
{
    color: #0088CC;   
    text-decoration: underline; 
}

#level2FooterLinks 
{
    float: left;    
    padding: 15px 0 0 10px;
}

#level2FooterLinks p, #level2FooterLinks p a, #level2FooterLinks p a:link, #level2FooterLinks p a:visited
{
    color: #444;   
    font-size: 12px;
    text-decoration: none;     
}

#level2FooterLinks p a:hover, #level2FooterLinks p a:active
{
    color: #0088CC;   
    text-decoration: underline;  
}

#copyrightLinks 
{   
    padding: 15px 0 0 0;  
}

#copyrightLinks p, #copyrightLinks p a, #copyrightLinks p a:link, #copyrightLinks p a:visited
{
    color: #444;   
    font-size: 11px;  
    text-decoration: none;    
}

#copyrightLinks p a:hover, #copyrightLinks p a:active
{
    color: #0088CC;   
    text-decoration: underline;
}

/* FORM ELEMENTS   
----------------------------------------------------------*/

.formContainer 
{
    border: 1px solid #41520E; 
    padding: 10px;   
    background: #fff url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/divBG.png') repeat-x top; 
}

.required, .optional
{
    zoom: 1;
    margin: 5px 0 0 0;
    padding: 1px 3px;
}

.required label, .optional label {
  display: block;
  float: left;
  width: 140px;
  padding: 3px 5px;
  margin: 0 0 5px 0;
  text-align: right;
}

.optional label, label.optional {
  font-weight: normal;
}
 
.required label, label.required {

}

.required small, .optional small {
  display: block;
  margin: 0 0 5px 142px;
  padding: 1px 3px;
  font-size: 78%;
  zoom: 1;
  font-style: italic;
}

.required input.inputText, .required input.inputPassword, .optional input.inputText, .optional input.inputPassword {
    padding: 1px 3px;
    margin: 0;  
    font-family: Verdana, Arial, Helvetica, sans-serif;
}

.required select, .optional select 
{
    padding: 1px;
    font-family: Verdana, Arial, Helvetica, sans-serif;
}

.required input.inputCheckbox, .required input.inputRadio, .optional input.inputCheckbox, .optional input.inputRadio, input.inputCheckbox, input.inputRadio {
  padding: 0;
  margin: 0;
}

.formLabelsContainer 
{
    float: left;
    width: 150px;
}

.formFieldLabels 
{
    display: block;
    text-align: right;    
    line-height: 40px; 
    padding: 0 5px 0 0;     
}

.formFieldsContainer
{
     float: left; 
     width: 170px;
}

.formFields 
{
    display: block; 
    padding: 0; 
    line-height: 40px;    
}

.text30 
{
    width: 30px;
}

.text50 
{
    width: 50px;
}

.text100 
{
    width: 100px;
}

.text150 
{
    width: 150px;
}

.text190 
{
    width: 190px;
}

.text250 
{
    width: 250px;
}

.text250x50
{
    width: 250px;
    height: 50px;
}

.ddl50
{
    width: 50px;
}

.ddl60
{
    width: 60px;
}

.ddl120
{
    width: 120px;
}

.ddl150
{
    width: 150px;
}

.ddl190
{
    width: 190px;
}

/* OFFICES  
----------------------------------------------------------*/

.officeSmall 
{
    width: 69px; 
    height: 69px; 
    border: 2px solid #fff;
    cursor: hand;
    cursor: pointer;
}

/* MISC  
----------------------------------------------------------*/

br.clear { clear: both; }

.field-validation-error
{
    color: #ff0000;
}

.ajaxLoaderDiv
{
    margin: 123px 0 0 205px;
}

#productSiteThumb { float:left; width:86px; height:61px; background-position:0 -16px; }
#logoContainer { height: 64px; position: absolute; left: 50%; top: 70px; width: 1920px; margin-left: -950px; text-align:center; overflow:hidden; width:100%; }
#logoContainerLeft {float:left; background-color:#000; height: 64px; width:768px; width:40%; }
#logoContainerCenter {float:left; height:64px; width:391px; }
#logoContainerRight {float:left; background-color:#000; height: 64px; width:768px; width:39.5%;  }

/* Main Menu styles */

#MainMenu { position: fixed; bottom: 27px; width: 100%; padding: 0; margin: 0; z-index: 600; }
#MenuTabs { position: relative; bottom: 0; padding: 0; margin: 0; }

#MenuTabs #menuList { float:left; margin:0; padding:0; }
#menuList .menuItem { display:inline; background-position:-292px -17px; width:auto; float:left;  height:16px; padding: 5px 0 5px 12px; margin: 0 10px 0 0; color:#fff; cursor:pointer; width:auto;  }
#menuList .menuItem a { padding-right:5px;}
#menuList .menuItem span { background-position:-427px -17px; float: left; display:inline-block; height:25px; width:6px; position: absolute; margin: -5px 0 0 0; }

.closeButtonGray { width:14px; height:13px; display: inline-block; background-position:-273px -22px; margin:0 5px 0 0; vertical-align: middle; }
.closeButtonBlack { width:14px; height:13px; display: inline-block; background-position:-273px -40px; float:left; margin:0 5px 0 0; }

#FooterMenu #phxOnLinkedIn { width:16px; height:16px; background-position:-483px -17px; display:inline-block; margin:0 10px 0 0; cursor:pointer !important; }
#FooterMenu #phxOnTwitter { width:16px; height:16px; background-position: -503px -17px; display:inline-block; margin:0 10px 0 0; cursor:pointer !important; }
#FooterMenu #phxOnYouTube { width:16px; height:16px; background-position:-523px -17px; display:inline-block; cursor:pointer !important; }
#corporateSiteLegend {position: absolute; top: 250px; left: 50px; width:132px; height:70px; background-position: -136px -17px; }
.countryFlag { float: left; margin: 3px 5px 5px 0; width:14px; height:12px; padding:0; }

.algeriaFlagSm { background-position: 0px 0px; display:inline-block; }
.australiaFlagSm { background-position: -19px 0px; display:inline-block;}
.austriaFlagSm { background-position: -38px 0px; display:inline-block; }
.belgiumFlagSm { background-position: -56px 0px; display:inline-block;}
.canadaFlagSm { background-position: -76px 0px; display:inline-block; }
.denmarkFlagSm { background-position: -95px 0px; display:inline-block; }
.fijiFlagSm { background-position: -114px 0px; display:inline-block; }
.finlandFlagSm { background-position: -133px 0px; display:inline-block; }
.franceFlagSm { background-position: -152px 0px; display:inline-block; }
.germanyFlagSm { background-position: -171px 0px; display:inline-block; }
.great_britainFlagSm { background-position: -190px 0px; display:inline-block; }
.icelandFlagSm { background-position: -209px 0px; display:inline-block; }
.indiaFlagSm { background-position: -228px 0px; display:inline-block; }
.irelandFlagSm { background-position: -247px 0px; display:inline-block; }
.italyFlagSm { background-position: -266px 0px; display:inline-block; }
.luxembourgFlagSm { background-position: -285px 0px; display:inline-block;}
.maltaFlagSm { background-position: -304px 0px; display:inline-block; }
.mexicoFlagSm { background-position: -323px 0px; display:inline-block; }
.moroccoFlagSm { background-position: -342px 0px; display:inline-block; }
.netherlandsFlagSm { background-position: -361px 0px; display:inline-block;}
.new_zealandFlagSm { background-position: -380px 0px; display:inline-block; }
.norwayFlagSm { background-position: -399px 0px; display:inline-block; }
.swedenFlagSm { background-position: -494px 0px; display:inline-block; }
.papua_new_guineaFlagSm { background-position: -418px 0px; display:inline-block; }
.puerto_ricoFlagSm { background-position: -437px 0px; display:inline-block; }
.tunisiaFlagSm { background-position: -456px 0px; display:inline-block; }
.usaFlagSm { background-position: -475px 0px; display:inline-block; }
.pageTitleWhoWeAre { width:337px; height:56px; margin: 0; font-weight: bold; background-position: 10px -370px; }
.pageTitleWhoWeServe { width:394px; height:57px; margin: 0; font-weight: bold; background-position: 10px -312px; }
.moreTrippleArrow { text-align: right; display:inline-block; width:19px; height:10px; margin: 0 0 -2px; background-position:-437px -17px; }

.captionCountry 
{
    padding: 3px 11px 0 15px;
    position: absolute;
    top: -23px;
    right: 0px;
    color: White;
    /* background: url(https://phenomenex.blob.core.windows.net/contentcorporate/images/slideshows_caption.png) repeat-y -100px 0px; */
    background: rgba(0, 0, 0, 0.60);
}