﻿/* MOVED FROM BUTTONS.CSS  AND MENU.CSS */

.toolButton { margin: 0 0 10px 0; float:left; width: 160px; height: 66px; }
.toolButton a { background: url("https://phenomenex.blob.core.windows.net/cdn/Content/Images/sprites/sprite-right-nav-buttons.png") no-repeat scroll;  cursor: pointer; font-weight:bold;  width: 160px; height: 66px; display:block; text-decoration:none; line-height:13px;  }
.toolButton a span { width:100px; font-size:12px; font-weight:bold; float:left; cursor:pointer !important; }

#columnMatchLargeButton { background-position: -660px 0; color:#632CD1; }
#columnMatchLargeButton span { margin:7px 0 0 10px; }
#columnMatchLargeButton:hover { background-position: -660px -66px; color:#fff; }

#guardItLargeButton { background-position: 0 0; color:#C9252C; }
#guardItLargeButton span { margin:20px 0 0 10px; }
#guardItLargeButton:hover { background-position: 0 -66px; color:#fff; }

#speToolLargeButton { background-position: -165px 0; color:#C7471B; }
#speToolLargeButton span { margin:15px 0 0 10px; }
#speToolLargeButton:hover { background-position:-165px -66px; color:#fff; }

#syringeFilterFinderToolLargeButton { background-position: -330px 0; color:#034D0C; }
#syringeFilterFinderToolLargeButton span { margin:13px 0 0 10px; }
#syringeFilterFinderToolLargeButton:hover { background-position:-330px -66px; color:#fff; }

#vialFinderLargeButton { background-position:-495px 0; color:#45B7CD; }
#vialFinderLargeButton span { margin:15px 0 0 10px; }
#vialFinderLargeButton:hover { background-position:-495px -66px; color:#fff; }

#structureSearchButton {  background-position:-1449px 0; }
#structureSearchButton span {  margin: 7px 0 0 10px; }
#structureSearchButton:hover { background-position:-1449px -66px; color:#fff; }

a.button {
    background: transparent url('images/bg_button_a.png') no-repeat scroll top right;
    color: #444;
    display: block;
    float: left;
    font: normal 12px arial, sans-serif;
    height: 23px;
    margin-right: 6px;
    padding-right: 8px; /* sliding doors padding */
    text-decoration: none;
}
 
a.button span {
    background: transparent url('images/bg_button_span.png') no-repeat;
    display: block;
    line-height: 13px;
    padding: 5px 0 5px 12px;
} 
 
a.button:hover {
    background-position: bottom right;
    color: #000;
    outline: none; /* hide dotted outline in Firefox */
}
 
a.button:hover span {
    background-position: bottom left;
} 

a.tallWhiteBtn 
{
    background: transparent url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/r_nav_button.png') no-repeat 0 0;
    display: block;    
    margin-top: 10px;
    padding-top: 10px;
    width: 158px; 
    height: 30px;
    font: bold 12px arial;
    text-decoration: none;
    color: #444444;
    text-align: center;
}

a.tallWhiteBtn:hover
{
    background-position: 0 -40px;
}

a.tallWhiteBtnTwoLine
{
    background: transparent url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/r_nav_button.png') no-repeat 0 0;
    display: block;    
    margin-top: 10px;
    padding-top: 5px;
    width: 158px; 
    height: 35px;
    font: bold 12px arial;
    text-decoration: none;
    color: #444444;
    text-align: center;
}

a.tallWhiteBtnTwoLine:hover
{
    background-position: 0 -40px;
}

a.tallWhiteBtn:hover
{
    background-position: 0 -40px;
}

a.tallerWhiteBtn
{
    background: transparent url('images/r_nav_lrg_btn.png') no-repeat 0 0;
    display: block;
    margin-top: 10px;
    padding-top: 8px;
    width: 158px; 
    height: 52px;
    font: bold 12px arial;
    text-decoration: none;
    color: #444444;
}

a.tallerWhiteBtn:hover
{
    background-position: 0 -60px;
}

a.tallOrderBtn
{
    background: transparent url('images/r_nav_order_btn.png') no-repeat 0 0;
    display: block;
    margin-top: 10px;
    padding-top: 10px;
    width: 158px; 
    height: 30px;
    font: bold 12px arial;
    text-decoration: none;
    color: #444444;
    text-align: center;
}

a.tallOrderBtn:hover
{
    background-position: 0 -40px;
}

.tallerBtnImage 
{
    cursor: pointer; 
    border: none; 
    float: left; 
    margin-left: 10px;
}

.tallerBtnSpan
{
    cursor: pointer; 
    float: left; 
    width: 100px; 
    text-align: center; 
    height: 55px;
}

a.button {
    background: transparent url('images/bg_button_a.png') no-repeat scroll top right;
    color: #444;
    display: block;
    float: left;
    font: normal 12px arial, sans-serif;
    height: 23px;
    margin-right: 6px;
    padding-right: 8px; /* sliding doors padding */
    text-decoration: none;
}
 
a.button span {
    background: transparent url('images/bg_button_span.png') no-repeat;
    display: block;
    line-height: 13px;
    padding: 5px 0 5px 12px;
} 
 
a.button:hover {
    background-position: bottom right;
    color: #000;
    outline: none; /* hide dotted outline in Firefox */
}
 
a.button:hover span {
    background-position: bottom left;
} 

.leftWhiteBtnOff {
    float: left;
    background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/leftWhiteBtnOff.png') no-repeat;
    width: 8px;
    height: 23px;   
}

.rightWhiteBtnOff {
    float: left;
    background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/rightWhiteBtnOff.png') no-repeat;
    width: 8px;
    height: 23px;  
}

.leftGreenBtnOff {
    float: left;
    background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/leftGreenBtnOff.png') no-repeat;
    width: 8px;
    height: 23px;   
}

.leftGreenTallBtnOff {
    float: left;
    background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/leftGreenTallBtnOff.png') no-repeat;
    width: 8px;
    height: 35px;   
}

.rightGreenBtnOff {
    float: left;
    background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/rightGreenBtnOff.png') no-repeat;
    width: 8px;
    height: 23px;  
}

.rightGreenTallBtnOff {
    float: left;
    background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/rightGreenTallBtnOff.png') no-repeat;
    width: 8px;
    height: 35px;  
}

.leftBlueBtnOff {
    float: left;
    background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/leftBlueBtnOff.png') no-repeat;
    width: 8px;
    height: 23px;   
}

.rightBlueBtnOff {
    float: left;
    background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/rightBlueBtnOff.png') no-repeat;
    width: 8px;
    height: 23px;  
}

a.midGreenBtnOff, a.midGreenBtnOff:link, a.midGreenBtnOff:visited, a.midGreenBtnOff:active,
a.midGreenBtnOff40, a.midGreenBtnOff40:link, a.midGreenBtnOff40:visited, a.midGreenBtnOff40:active,
a.midGreenBtnOff50, a.midGreenBtnOff50:link, a.midGreenBtnOff50:visited, a.midGreenBtnOff50:active,
a.midGreenBtnOff70, a.midGreenBtnOff70:link, a.midGreenBtnOff70:visited, a.midGreenBtnOff70:active,
a.midGreenBtnOff90, a.midGreenBtnOff90:link, a.midGreenBtnOff90:visited, a.midGreenBtnOff90:active,
a.midGreenBtnOff110, a.midGreenBtnOff110:link, a.midGreenBtnOff110:visited, a.midGreenBtnOff110:active,
a.midGreenBtnOff140, a.midGreenBtnOff140:link, a.midGreenBtnOff140:visited, a.midGreenBtnOff140:active,
a.midGreenBtnOff160, a.midGreenBtnOff160:link, a.midGreenBtnOff160:visited, a.midGreenBtnOff160:active,
a.midGreenBtnOff170, a.midGreenBtnOff170:link, a.midGreenBtnOff170:visited, a.midGreenBtnOff170:active,
a.midGreenBtnOff180, a.midGreenBtnOff180:link, a.midGreenBtnOff180:visited, a.midGreenBtnOff180:active
{
    float:left;
    background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/midGreenBtnOff.png') repeat-x;
    display: inline-block;
    height: 23px;   
    color: #444; 
    text-decoration: none; 
    text-align: center;     
    padding: 4px 0 0 0;
}

a.midGreenTallBtnOff40, a.midGreenTallBtnOff40:link, a.midGreenTallBtnOff40:visited, a.midGreenTallBtnOff40:active,
a.midGreenTallBtnOff50, a.midGreenTallBtnOff50:link, a.midGreenTallBtnOff50:visited, a.midGreenTallBtnOff50:active,
a.midGreenTallBtnOff70, a.midGreenTallBtnOff70:link, a.midGreenTallBtnOff70:visited, a.midGreenTallBtnOff70:active,
a.midGreenTallBtnOff90, a.midGreenTallBtnOff90:link, a.midGreenTallBtnOff90:visited, a.midGreenTallBtnOff90:active,
a.midGreenTallBtnOff110, a.midGreenTallBtnOff110:link, a.midGreenTallBtnOff110:visited, a.midGreenTallBtnOff110:active,
a.midGreenTallBtnOff140, a.midGreenTallBtnOff140:link, a.midGreenTallBtnOff140:visited, a.midGreenTallBtnOff140:active,
a.midGreenTallBtnOff160, a.midGreenTallBtnOff160:link, a.midGreenTallBtnOff160:visited, a.midGreenTallBtnOff160:active
{
    float:left;
    background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/midGreenTallBtnOff.png') repeat-x;
    display: inline-block;
    height: 35px;   
    color: #444; 
    text-decoration: none; 
    text-align: center;     
    padding: 4px 0 0 0;
    font-size:11px;
}

a.midWhiteBtnOff20, a.midWhiteBtnOff20:link, a.midWhiteBtnOff20:visited, a.midWhiteBtnOff20:active,
a.midWhiteBtnOff40, a.midWhiteBtnOff40:link, a.midWhiteBtnOff40:visited, a.midWhiteBtnOff40:active,
a.midWhiteBtnOff50, a.midWhiteBtnOff50:link, a.midWhiteBtnOff50:visited, a.midWhiteBtnOff50:active,
a.midWhiteBtnOff60, a.midWhiteBtnOff60:link, a.midWhiteBtnOff60:visited, a.midWhiteBtnOff60:active,
a.midWhiteBtnOff70, a.midWhiteBtnOff70:link, a.midWhiteBtnOff70:visited, a.midWhiteBtnOff70:active,
a.midWhiteBtnOff90, a.midWhiteBtnOff90:link, a.midWhiteBtnOff90:visited, a.midWhiteBtnOff90:active,
a.midWhiteBtnOff110, a.midWhiteBtnOff110:link, a.midWhiteBtnOff110:visited, a.midWhiteBtnOff110:active,
a.midWhiteBtnOff140, a.midWhiteBtnOff140:link, a.midWhiteBtnOff140:visited, a.midWhiteBtnOff140:active,
a.midWhiteBtnOff160, a.midWhiteBtnOff160:link, a.midWhiteBtnOff160:visited, a.midWhiteBtnOff160:active
{
    float:left;
    background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/midWhiteBtnOff.png') repeat-x;
    display: inline-block;
    height: 23px;   
    color: #444; 
    text-decoration: none; 
    text-align: center;     
    padding: 4px 0 0 0;
    font-size:11px;
}

a.midBlueBtnOff70, a.midBlueBtnOff70:link, a.midBlueBtnOff70:visited, a.midBlueBtnOff70:active,
a.midBlueBtnOff110, a.midBlueBtnOff110:link, a.midBlueBtnOff110:visited, a.midBlueBtnOff110:active
{
    float:left;
    background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/midBlueBtnOff.png') repeat-x;
    display: inline-block;
    height: 23px;   
    color: #444; 
    text-decoration: none; 
    text-align: center;     
    padding: 4px 0 0 0;
}

a.midBlueBtnOff40, a.midBlueBtnOff40:link, a.midBlueBtnOff40:visited, a.midBlueBtnOff40:active { width: 40px; }
a.midBlueBtnOff70, a.midBlueBtnOff70:link, a.midBlueBtnOff70:visited, a.midBlueBtnOff70:active { width: 70px; }
a.midBlueBtnOff110, a.midBlueBtnOff110:link, a.midBlueBtnOff110:visited, a.midBlueBtnOff110:active { width: 110px; }
a.midBlueBtnOff140, a.midBlueBtnOff140:link, a.midBlueBtnOff140:visited, a.midBlueBtnOff140:active { width: 140px; }
a.midBlueBtnOff160, a.midBlueBtnOff160:link, a.midBlueBtnOff160:visited, a.midBlueBtnOff160:active { width: 160px; }
a.midWhiteBtnOff20, a.midWhiteBtnOff20:link, a.midWhiteBtnOff20:visited, a.midWhiteBtnOff20:active { width: 20px; }
a.midWhiteBtnOff40, a.midWhiteBtnOff40:link, a.midWhiteBtnOff40:visited, a.midWhiteBtnOff40:active { width: 40px; }
a.midWhiteBtnOff50, a.midWhiteBtnOff50:link, a.midWhiteBtnOff50:visited, a.midWhiteBtnOff50:active { width: 50px; }
a.midWhiteBtnOff60, a.midWhiteBtnOff60:link, a.midWhiteBtnOff60:visited, a.midWhiteBtnOff60:active { width: 60px; }
a.midWhiteBtnOff70, a.midWhiteBtnOff70:link, a.midWhiteBtnOff70:visited, a.midWhiteBtnOff70:active { width: 70px; }
a.midWhiteBtnOff90, a.midWhiteBtnOff90:link, a.midWhiteBtnOff90:visited, a.midWhiteBtnOff90:active { width: 90px; }
a.midWhiteBtnOff110, a.midWhiteBtnOff110:link, a.midWhiteBtnOff110:visited, a.midWhiteBtnOff110:active { width: 110px; }
a.midWhiteBtnOff140, a.midWhiteBtnOff140:link, a.midWhiteBtnOff140:visited, a.midWhiteBtnOff140:active { width: 140px; }
a.midWhiteBtnOff160, a.midWhiteBtnOff160:link, a.midWhiteBtnOff160:visited, a.midWhiteBtnOff160:active { width: 160px; }
a.midGreenBtnOff20, a.midGreenBtnOff20:link, a.midGreenBtnOff20:visited, a.midGreenBtnOff20:active { width: 20px; }
a.midGreenBtnOff40, a.midGreenBtnOff40:link, a.midGreenBtnOff40:visited, a.midGreenBtnOff40:active { width: 40px; }
a.midGreenBtnOff50, a.midGreenBtnOff50:link, a.midGreenBtnOff50:visited, a.midGreenBtnOff50:active { width: 50px; }
a.midGreenBtnOff70, a.midGreenBtnOff70:link, a.midGreenBtnOff70:visited, a.midGreenBtnOff70:active { width: 70px; }
a.midGreenBtnOff90, a.midGreenBtnOff90:link, a.midGreenBtnOff90:visited, a.midGreenBtnOff90:active { width: 90px; }
a.midGreenBtnOff110, a.midGreenBtnOff110:link, a.midGreenBtnOff110:visited, a.midGreenBtnOff110:active { width: 110px; }
a.midGreenBtnOff140, a.midGreenBtnOff140:link, a.midGreenBtnOff140:visited, a.midGreenBtnOff140:active { width: 140px; }
a.midGreenBtnOff160, a.midGreenBtnOff160:link, a.midGreenBtnOff160:visited, a.midGreenBtnOff160:active { width: 160px; }
a.midGreenBtnOff170, a.midGreenBtnOff170:link, a.midGreenBtnOff170:visited, a.midGreenBtnOff170:active { width: 170px; }

.midBlueBtnOff70 input, .midBlueBtnOff110 input, .midBlueBtnOff180 input {
    float: left;
    background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/midBlueBtnOff.png') repeat-x;
    border: none;
    height: 23px;     
    color: #444;    
    text-decoration: none; 
    text-align: center;
    cursor: pointer;
    font-size: 11px;    
}

.midBlueBtnOff70 input { width: 70px; }
.midBlueBtnOff110 input { width: 110px; }
.midBlueBtnOff180 input { width: 180px; }

.midGreenBtnOff40 input, .midGreenBtnOff70 input, .midGreenBtnOff110 input, .midGreenBtnOff150 input
{
    float: left;
    background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/midGreenBtnOff.png') repeat-x;
    border: none;
    height: 23px;     
    color: #444;    
    text-decoration: none; 
    text-align: center;
    cursor: pointer;
    font-size: 11px;    
}

.midGreenBtnOff40 input { width: 40px; }
.midGreenBtnOff70 input { width: 70px; }
.midGreenBtnOff110 input { width: 110px; }
.midGreenBtnOff150 input { width: 150px;}


                                 
.greenBtn:hover input { background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/midGreenBtnOn.png') repeat-x; }
.greenBtn:hover .leftGreenBtnOff { background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/leftGreenBtnOn.png') no-repeat; }
.greenBtn:hover .rightGreenBtnOff { background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/rightGreenBtnOn.png') no-repeat; }  
.greenBtn:hover a { background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/midGreenBtnOn.png') repeat-x; }

.greenTallBtn:hover input { background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/midGreenTallBtnOn.png') repeat-x; }
.greenTallBtn:hover .leftGreenTallBtnOff { background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/leftGreenTallBtnOn.png') no-repeat; }
.greenTallBtn:hover .rightGreenTallBtnOff { background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/rightGreenTallBtnOn.png') no-repeat; }  
.greenTallBtn:hover a { background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/midGreenTallBtnOn.png') repeat-x; }

.whiteBtn:hover .leftWhiteBtnOff { background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/leftGreenBtnOn.png') no-repeat; }
.whiteBtn:hover .rightWhiteBtnOff { background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/rightGreenBtnOn.png') no-repeat; }  
.whiteBtn:hover a { background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/midGreenBtnOn.png') repeat-x; } 

.blueBtn:hover input { background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/midBlueBtnOn.png') repeat-x; }
.blueBtn:hover .leftBlueBtnOff { background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/leftBlueBtnOn.png') no-repeat; }
.blueBtn:hover .rightBlueBtnOff { background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/rightBlueBtnOn.png') no-repeat; }  

.blueBtn:hover a { background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/midBlueBtnOn.png') repeat-x; } 

#search1Button, #search2Button, #search3Button, #search4Button
{
    border: none;   
}

.offer 
{
    background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/offerBtnOff.png') no-repeat;
    width: 44px;
    height: 11px;
}

.offer:hover
{
    background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/offerBtnOn.png') no-repeat;
}

.offer_small 
{
    background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/offer.gif') no-repeat;
    width: 44px;
    height: 11px;
}

.offer_small:hover
{
    background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/offer_hover.gif') no-repeat;
}

.promo 
{
    background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/promo_icon.gif') no-repeat;
    width: 44px;
    height: 18px;
}

.promo:hover
{
    background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/promo_icon_hover.gif') no-repeat;
}

.corp_discount 
{
    background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/corp.gif') no-repeat;
    width: 44px;
    height: 11px;
}

.corp_discount:hover
{
    background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/corp_hover.gif') no-repeat;
}

/* LANDING PAGES  
----------------------------------------------------------*/

.solutionLandingBtn1
{
    background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/hplc_columns.png') no-repeat;
    width: 137px;
    height: 137px;
    border: none;
    cursor: pointer;
}

.solutionLandingBtn1:hover
{
    background-position: 0 -137px;
}

.solutionLandingBtn1New
{
    background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/btnSrchcol.png') no-repeat;
    width: 200px;
    height: 150px;
    border: none;
    cursor: pointer;   
}

.solutionLandingBtn1SECNew
{
    background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/btn_landing_searchcol145x105.png') no-repeat;
    width: 145px;
    height: 105px;
    border: none;
    cursor: pointer; 
}


.solutionLandingBtn2
{
    background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/apps.png') no-repeat;
    width: 137px;
    height: 137px;
    border: none;    
    cursor: pointer;
}

.solutionLandingBtn2:hover
{
    background-position: 0 -137px;
}

.solutionLandingBtn2New
{
    background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/btnSrchapp.png') no-repeat;
    width:200px;
    height: 150px;
    border: none;    
    cursor: pointer;
}

.solutionLandingBtn2SECNew
{
    background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/btn_landing_searchapp145x105.png') no-repeat;
    width:145px;
    height: 105px;
    border: none;    
    cursor: pointer;
}

.solutionLandingBtn3
{
    background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/chiral_services.png') no-repeat;
    width: 137px;
    height: 137px;
    border: none; 
    cursor: pointer;   
}

.solutionLandingBtn3:hover
{
    background-position: 0 -137px;
}

.solutionLandingBtn4
{
    background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/spe.png') no-repeat;
    width: 137px;
    height: 137px;
    border: none; 
    cursor: pointer;   
}

.solutionLandingBtn4:hover
{
    background-position: 0 -137px;
}

.solutionLandingBtn5
{
    background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/filtration.png') no-repeat;
    width: 137px;
    height: 137px;
    border: none;  
    cursor: pointer;  
}

.solutionLandingBtn5:hover
{
    background-position: 0 -137px;
}

.solutionLandingBtn5New
{
    background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/btnfilteration.png') no-repeat;
    width: 200px;
    height: 150px;
    border: none;  
    cursor: pointer;  
}

.solutionLandingBtn6
{
    background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/protein_precipitation.png') no-repeat;
    width: 137px;
    height: 137px;
    border: none;   
    cursor: pointer; 
}

.solutionLandingBtn6:hover
{
    background-position: 0 -137px;
}

.solutionLandingBtn6New
{
    background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/btnspe.png') no-repeat;
    width: 200px;
    height: 150px;
    border: none;   
    cursor: pointer; 
}

.solutionLandingBtn7
{
    background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/gc.png') no-repeat;
    width: 137px;
    height: 137px;
    border: none;  
    cursor: pointer;  
}

.solutionLandingBtn7:hover
{
    background-position: 0 -137px;
}

.solutionLandingBtn7New
{
    background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/btnSrchcol.png') no-repeat;
    width: 200px;
    height: 150px;
    border: none;  
    cursor: pointer; 
    
}

.solutionLandingBtn8
{
    background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/gc_accessories.png') no-repeat;
    width: 137px;
    height: 137px;
    border: none;   
    cursor: pointer; 
}

.solutionLandingBtn8:hover
{
    background-position: 0 -137px;
}

.solutionLandingBtn8New 
{
    background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/btnSrchacces.png') no-repeat;
    width: 200px;
    height: 150px;
    border: none;   
    cursor: pointer; 
}

.solutionLandingBtn9
{
    background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/hplc_accessories.png') no-repeat;
    width: 137px;
    height: 137px;
    border: none;
    cursor: pointer;
}

.solutionLandingBtn9:hover
{
    background-position: 0 -137px;
}

.solutionLandingBtn9New
{
    background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/btnSrchacces.png') no-repeat;
    width: 200px;
    height: 150px;
    border: none;
    cursor: pointer;    
}

.luxChiralBtn
{
    background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/chiral_columns.png') no-repeat;
    width: 137px;
    height: 137px;
    border: none;
    cursor: pointer;
}

.luxChiralBtn:hover
{
    background-position: 0 -137px;
}

.columnMatchClassificationBtn
{
    position: relative; 
    float: left; 
    width: 137px; 
    height: 97px; 
    background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/usp_off.png') no-repeat; 
    cursor: pointer;
}

.columnMatchClassificationBtn:hover
{
    background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/usp_on.png') no-repeat;
}

.columnMatchCompoundBtn
{
    position: relative; float: left; width: 137px; height: 97px; background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/compound_off.png') no-repeat; cursor: pointer;
}

.columnMatchCompoundBtn:hover
{
    background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/compound_on.png') no-repeat;
}

.columnMatchApplicationBtn
{
    position: relative; float: left; width: 137px; height: 97px; background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/application_off.png') no-repeat; cursor: pointer;
}

.columnMatchApplicationBtn:hover
{
    background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/application_on.png') no-repeat;
}

.columnMatchAlternativeBtn
{
    position: relative; float: left; width: 137px; height: 97px; background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/recommended_alternative_off.png') no-repeat; cursor: pointer;
}

.columnMatchAlternativeBtn:hover
{
    background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/recommended_alternative_on.png') no-repeat;
}

/* HOME SPLASH PAGE  
----------------------------------------------------------*/

.homeLeftNaveBtn { display: block; width: 203px; }

.homePrepProcessBtn 
{
    background-position:0 -161px;
    height: 28px;
}

.homePrepProcessBtn:hover
{
    background-position:0px -194px;
}

.homeSamplePrepBtn 
{
    background-position:0px -227px;
    height: 32px;
}

.homeSamplePrepBtn:hover
{
     background-position:0px -263px;
}

.homeOglioBtn 
{
    background-position:0px -300px;
    height: 29px;
}

.homeOglioBtn:hover
{
    background-position:0px -334px;
}

.homeSizeExBtn 
{
    background-position:0px -368px;
    height: 30px;
}

.homeSizeExBtn:hover
{
    background-position:0px -403px;
}

.homeAppBtn 
{
    background-position:0px -438px;
    height: 31px;
}

.homeAppBtn:hover
{
    background-position:0px -474px;
}

.homeAccBtn 
{
    background-position:0px -510px;
    height: 29px;
}

.homeAccBtn:hover
{
    background-position:0px -544px;
}

.homeChiralBtn 
{
    background-position:0px -578px;
    height: 30px;
}

.homeChiralBtn:hover
{
    background-position:0px -613px;
}

.homeHplcBtn 
{
    background-position:0px -648px;
    height: 29px;
}

.homeHplcBtn:hover
{
    background-position:0px -682px;
}

.homeSfcBtn 
{
    background-position:0px -716px;
    height: 32px;
}

.homeSfcBtn:hover
{
    background-position:0px -753px;
}

.homeGcBtn 
{
    background-position:0px -790px;
    height: 29px;
}

.homeGcBtn:hover
{
   background-position:0px -824px;
}

#appLibraryButton
{
    width: 78px; 
    height: 78px; 
    margin: 0 52px 0 52px;
    background: url(https://phenomenex.blob.core.windows.net/cdn/Content/Images/appBtn.gif) no-repeat 0 0; 
    cursor: pointer;
}

#appLibraryButton:hover
{
    background-position: 0 -78px;
}

#chiralButton
{
    width: 31%; 
    height: 150px; 
    float: left; 
    padding: 0 5px;    
    background: url(https://phenomenex.blob.core.windows.net/cdn/Content/Images/chiralBtnOff.gif) no-repeat center top;
    cursor: pointer;
}

#chiralButton:hover
{
    background: url(https://phenomenex.blob.core.windows.net/cdn/Content/Images/chiralBtnOn.gif) no-repeat center top;
}

.speToolSmallButton
{
    width: 78px; 
    height: 78px; 
    margin: 10px 0 0 30px;
    background-position: -83px 0;
    cursor: pointer;
}

.speToolSmallButton:hover
{
    background-position: -83px -78px;
}

#vialFinderSmallButton
{
    width: 78px; 
    height: 78px; 
    margin: 10px 0 0 30px;
    background-position: -166px 0;
    cursor: pointer;
}

#vialFinderSmallButton:hover
{
    background-position: -166px -78px;
}

#syringeFilterFinderToolSmallButton
{
    width: 78px; 
    height: 78px; 
    margin: 10px 0 0 30px;
    background-position: -571px 0;
    cursor: pointer;
}

#syringeFilterFinderToolSmallButton:hover
{
    background-position: -571px -78px;
}

#applicationSearchByStructure
{
    width: 78px; 
    height: 78px; 
    margin: 10px 0 0 30px;
    background-position: -654px 0;
    cursor: pointer;    
}

#applicationSearchByStructure:hover
{
    background-position: -654px -78px;
}

#speToolMedButton
{
    width: 195px; 
    height: 48px;   
    background: url(https://phenomenex.blob.core.windows.net/cdn/Content/Images/spe_both.png) no-repeat 0 0;
    cursor: pointer;
}

#speToolMedButton:hover
{
    background: url(https://phenomenex.blob.core.windows.net/cdn/Content/Images/spe_both.png) no-repeat 0 -48px;
}

#columnMatchMedButton
{
    width: 195px; 
    height: 48px;
    color:#000000;   
    background: url("https://phenomenex.blob.core.windows.net/cdn/Content/Images/sprites/sprite-right-nav-buttons.png") no-repeat scroll -600px -137px;
    cursor: pointer !important;
    line-height:14px;
}

#columnMatchMedButton:hover
{
    background-position: -600px -185px;
    color:#ffffff !important;
}

#CQofAButton
{
    width: 196px; 
    height: 48px;
    color:#000000;   
    background: url("https://phenomenex.blob.core.windows.net/cdn/Content/Images/cqofa_btn.png") no-repeat scroll 0px 0px;
    cursor: pointer !important;
    line-height:14px;
}

#CQofAButton:hover
{
    background-position: 0px -48px;
    color:#ffffff !important;
}

#vialFinderMedButton
{
    width: 195px; 
    height: 48px;   
    background: url(https://phenomenex.blob.core.windows.net/cdn/Content/Images/vial_finder_both.png) no-repeat 0 0;
    cursor: pointer;
}

#vialFinderMedButton:hover
{
    background: url(https://phenomenex.blob.core.windows.net/cdn/Content/Images/vial_finder_both.png) no-repeat 0 -48px;
}

#syringeFilterFinderToolMedButton
{
    width: 195px; 
    height: 48px;   
    background: url(https://phenomenex.blob.core.windows.net/cdn/Content/Images/syringe_button_medium_bothStates.png) no-repeat 0 0;
    cursor: pointer;
}

#syringeFilterFinderToolMedButton:hover
{
    background: url(https://phenomenex.blob.core.windows.net/cdn/Content/Images/syringe_button_medium_bothStates.png) no-repeat 0 -48px;
}





#guardItLargeIcon
{
    width: 169px; 
    height: 169px;   
    background: url(https://phenomenex.blob.core.windows.net/cdn/Content/Images/guardit_lrg_icon.png) no-repeat 0 0;
    cursor: pointer;
}

#guardItSquareButton
{
    width: 78px;
    height: 78px;
    margin: 10px 0 0 30px;
    background-position:0 0;
    cursor: pointer;
}

#guardItSquareButton:hover
{
    background-position:0 -78px;
}

#guardItMedButton
{
    width: 195px; 
    height: 48px;   
    background: url(https://phenomenex.blob.core.windows.net/cdn/Content/Images/column_guard_btn_med.png) no-repeat 0 0;
    cursor: pointer;
}

#guardItMedButton:hover
{
    background: url(https://phenomenex.blob.core.windows.net/cdn/Content/Images/column_guard_btn_med.png) no-repeat 0 -48px;
}

#messageCenterMedButton
{
    width: 195px; 
    height: 48px;
    color: #205D98;
    background: url("https://phenomenex.blob.core.windows.net/cdn/Content/Images/sprites/sprite-right-nav-buttons.png") no-repeat -400px -137px;
    cursor: pointer;
    line-height:14px;
    right: 0 !important;
    top: -40px !important;

}

#messageCenterMedButton:hover
{
    background-position:-400px -185px; 
    color:#ffffff;   
}

#dashboardButton
{
    width: 31%; 
    height: 150px; 
    float: left; 
    padding: 0 5px;    
    background: url(https://phenomenex.blob.core.windows.net/cdn/Content/Images/dashboardIcon.gif) no-repeat center top;
    cursor: pointer;
}

.disabledSubmitPurchaseBtn
{
    cursor: pointer;
}

/* PhenoLogix
----------------------------------------------------------*/

.services1Button
{
    width: 137px;
    height: 137px;
    background: url(https://phenomenex.blob.core.windows.net/cdn/Content/Images/chiral_screening.png) no-repeat 0 0;
    cursor: pointer;
}

.services1Button:hover
{
    background-position: 0 -137px;
}

.services2Button
{
    width: 137px;
    height: 137px;
    background: url(https://phenomenex.blob.core.windows.net/cdn/Content/Images/hplc_uhplc_txt.png) no-repeat 0 0;
    cursor: pointer;
}

.services2Button:hover
{
    background-position: 0 -137px;
}

.services3Button
{
    width: 137px;
    height: 137px;
    background: url(https://phenomenex.blob.core.windows.net/cdn/Content/Images/gc_txt.png) no-repeat 0 0;
    cursor: pointer;
}

.services3Button:hover
{
    background-position: 0 -137px;
}

.services4Button
{
    width: 137px;
    height: 137px;
    background: url(https://phenomenex.blob.core.windows.net/cdn/Content/Images/sample_prep_txt.png) no-repeat 0 0;
    cursor: pointer;
}

.services4Button:hover
{
    background-position: 0 -137px;
}

.services5Button
{
    width: 137px;
    height: 137px;
    background: url(https://phenomenex.blob.core.windows.net/cdn/Content/Images/prepartive_txt.png) no-repeat 0 0;
    cursor: pointer;
}

.services5Button:hover
{
    background-position: 0 -137px;
}

.services6Button  
{
    width: 137px;
    height: 137px;
    background: url(https://phenomenex.blob.core.windows.net/cdn/Content/Images/on-site_training_txt.png) no-repeat 0 0;
    cursor: pointer;
}

.services6Button:hover
{
    background-position: 0 -137px;
}



/* MOVED FROM MENU.CSS */

 /* common styling */

#MainNavigation 
{
    background: transparent url(https://phenomenex.blob.core.windows.net/cdn/Content/Images/navBottomBorder.gif) no-repeat 65px 57px;
    height: 100px;
    margin: 0 0 0 30px;
}

#siteSearchDiv {float:right; padding: 0 20px 0 0; width: 190px; margin:0 5px 0 0; }
#SearchDropDown { width: 173px; height: 132px; position: absolute; top: 84px; left: 743px; background-color: White; border: 1px solid black; }

#solutionsMenu {float: left; margin: 30px 0 0 0; width: 180px;}
#solutionsMenu a {display:block; font:bold 14px verdana,arial,sans-serif; color:#fff; line-height:22px; text-decoration:none; padding:0 20px;} 
#solutionsMenu a.top-level-a {float:left; padding:0 0 0 10px; } 
#solutionsMenu a.top-level-a b {float:left; padding:0 20px 0 0; cursor:pointer; cursor:hand;}
#solutionsMenu a.down b {font-size: 18px; float:left; padding:0 10px 0 0; background:url(https://phenomenex.blob.core.windows.net/cdn/Content/Images/chevronDownMain.gif) no-repeat right; cursor:pointer;}
#solutionsMenu li li a {font-family: Arial,sans-serif;} 
#solutionsMenu li li li a {font-size: 12px;} 

#solutionsMenu ul {display:inline-block;} 
#solutionsMenu ul {display:inline;}
#solutionsMenu ul {margin:0; padding:0; list-style:none; white-space:nowrap; text-align:left;} 
#solutionsMenu ul.top-level {margin-left:0; display:table; margin:0 auto;} 

#solutionsMenu ul.drop-down {top: 0px; width: 212px;}

#solutionsMenu li {margin:0; padding:0;}
#solutionsMenu li.top-level-li {float:left; position:relative; margin-right:1px;height:26px;padding-top:4px; z-index:99999; }
#solutionsMenu li div ul {display:block;position:absolute; visibility:hidden; left: 0px; background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/solutionsMenuBG.gif') repeat-x; border: 1px solid #21CBF7;}
#solutionsMenu li li ul {width: 240px; left:100%; margin-top:-23px; margin-left: 0px; margin-bottom:auto; z-index:99; background: url('https://phenomenex.blob.core.windows.net/cdn/Content/Images/solutionsMenuBG2.gif') repeat-x; border: 1px solid #21CBF7;}
#solutionsMenu li li ul li {width: 240px; float:left;position:relative; }
#solutionsMenu li li { }
#solutionsMenu li li a.fly {background: transparent url(https://phenomenex.blob.core.windows.net/cdn/Content/Images/chevronRight.gif) no-repeat 200px 8px;}

#solutionsMenu a.top-level-a:hover {white-space:nowrap; }
#solutionsMenu a.top-level-a:hover b, 
#solutionsMenu a.top-level-a:focus b,
#solutionsMenu a.top-level-a:active b {color:#0088CC; background: url(https://phenomenex.blob.core.windows.net/cdn/Content/Images/chevronUpMain.gif) no-repeat right; cursor:pointer;}
#solutionsMenu a.down:hover b, 
#solutionsMenu a.down:focus b {color:#0088CC; cursor:pointer;}
#solutionsMenu li.top-level-li:hover > a {white-space:nowrap;}
#solutionsMenu li.top-level-li:hover > a b {color:#0088CC;}
#solutionsMenu li.top-level-li:hover > a.down b {color:#0088CC; background: url(https://phenomenex.blob.core.windows.net/cdn/Content/Images/chevronUpMain.gif) no-repeat right;}
#solutionsMenu li:hover > div > ul {visibility:visible;}
#solutionsMenu li:hover .solutionsMenuShadow {visibility:visible;}
#solutionsMenu li:hover > ul {visibility:visible;}
#solutionsMenu a:hover div ul,
#solutionsMenu a:hover div a:hover ul, 
#solutionsMenu a:hover a:hover a:hover ul {visibility:visible;}
#solutionsMenu a:hover ul ul, 
#solutionsMenu a:hover a:hover ul ul {visibility:hidden;}
#solutionsMenu li li a:hover {background:#21CBF7;} 
#solutionsMenu li li:hover > a {background:#21CBF7;}
#solutionsMenu li li a.fly:hover {background: #21CBF7 url(https://phenomenex.blob.core.windows.net/cdn/Content/Images/chevronRight.gif) no-repeat 200px 8px;} 
#solutionsMenu li li:hover > a.fly {background: #21CBF7 url(https://phenomenex.blob.core.windows.net/cdn/Content/Images/chevronRight.gif) no-repeat 200px 8px;}
	
#solutionsMenu table {position:absolute;top:0;left:0;border-collapse:collapse;text-align:left;}
#solutionsMenu table ul li a {padding-left:10px; width: 184px; height: 24px;}
#solutionsMenu table table {top:auto; left:100%; margin-left:-2px; margin-top: 2px;}
#solutionsMenu table table ul {margin-top:-7px; }
#solutionsMenu table table ul li a {width: 194px;}

.solutionsMenuShadow 
{
    display: block;
    visibility: hidden;
    position: absolute;
    top: 27px;
    left: 60px;
    height: 135px;
    width: 217px;
    padding: 0 10px 10px 0;  
    background: url(https://phenomenex.blob.core.windows.net/cdn/Content/Images/solutionsShadow.png) no-repeat bottom right;
}


#consumerMenu {float: left; margin: 15px 0 0 0; width: 570px;}

#consumerMenu ul {display:inline-block;} 
#consumerMenu ul.top-level {margin-left:0;}
#consumerMenu ul {margin:0; padding:0 0 3px 0; list-style:none; white-space:nowrap; text-align:left;} 
#consumerMenu li {margin:0; padding:0;}
#consumerMenu a {display:block; font:bold 11px verdana,arial,sans-serif;color:#fff; line-height:22px; text-decoration:none; padding:0 20px;} 
* html #consumerMenu ul.top-level {margin-left:0;} /* I don't know why, but this centers IE5.5 ?? */
 
#consumerMenu li:hover > ul {visibility:visible;}
#consumerMenu a:hover ul {visibility:visible;}
 
#consumerMenu ul.top-level {margin:0 auto;} 
#consumerMenu li.top-level-li {float:left; position:relative; margin-right:1px;}
 
#consumerMenu a.top-level-a {float:left; padding:0 0 0 15px;} 
#consumerMenu a.top-level-a b {float:left; padding:0 10px 0 0; cursor:pointer; cursor:hand;}
#consumerMenu a.down b {float:left; padding:0 10px 0 0; background:url(https://phenomenex.blob.core.windows.net/cdn/Content/Images/chevronDownMain.gif) no-repeat right; cursor:pointer;}
 
#consumerMenu a.top-level-a:hover {white-space:nowrap;}
#consumerMenu a.top-level-a:hover b, 
#consumerMenu a.top-level-a:focus b, 
#consumerMenu a.top-level-a:active b {color:#fff; cursor:pointer; background: url(https://phenomenex.blob.core.windows.net/cdn/Content/Images/chevronUpMain.gif) no-repeat right;}
#consumerMenu a.down:hover b, 
#consumerMenu a.down:focus b, 
#consumerMenu a.down:active b {color:#fff; cursor:pointer; background: url(https://phenomenex.blob.core.windows.net/cdn/Content/Images/chevronUpMain.gif) no-repeat right;}
 
#consumerMenu li.top-level-li:hover > a {white-space:nowrap;}
#consumerMenu li.top-level-li:hover > a b {color:#0088CC;}
#consumerMenu li.top-level-li:hover > a.down b {color:#0088CC;}
 
#consumerMenu li ul {border-top:1px solid #474849; border-left:1px solid #474849; border-right:1px solid #474849; display:block; position:absolute; left: 20px; margin: 0; padding: 0 0; visibility:hidden; background-color: #343434; z-index:99999; }
#consumerMenu li li {border-bottom :1px solid #474849; padding: 0; margin: 0; height: 22px;}
#consumerMenu li li a { width: 260px; padding: 0 0 0 10px; margin: 0; } 
#consumerMenu li li a:hover {color:#0088CC;} 
#consumerMenu li li:hover > a {color:#0088CC;}
 
#consumerMenu ul.drop-down {top:22px;} 
 
#consumerMenu table {position:absolute;top:0;left:0;border-collapse:collapse;text-align:left;}
#consumerMenu table ul li a {padding-left:0; padding-left:10px;}
#consumerMenu table table {top:auto; left:100%; margin-left:-1px; padding:0; margin:0;}
#consumerMenu table table ul {margin-top:-4px; margin-top:-7px;}


#searchOptionsMenu {float: right; margin: 15px 15px 0 0; width: 160px; text-align: center; }

#searchOptionsMenu ul {display:inline-block;} 
#searchOptionsMenu ul.top-level {margin-left:0;}
#searchOptionsMenu ul {margin:0; padding:0 0 3px 0; list-style:none; white-space:nowrap; text-align:left;} 
#searchOptionsMenu li {margin:0; padding:0;}
#searchOptionsMenu a {display:block; font:bold 11px verdana,arial,sans-serif;color:#fff; line-height:22px; text-decoration:none; padding:0 20px;} 
* html #consumerMenu ul.top-level {margin-left:0;} /* I don't know why, but this centers IE5.5 ?? */
 
#searchOptionsMenu li:hover > ul {visibility:visible;}
#searchOptionsMenu a:hover ul {visibility:visible;}
 
#searchOptionsMenu ul.top-level {margin:0 auto;} 
#searchOptionsMenu li.top-level-li {float:left; position:relative; margin-right:1px; z-index:99999;}
 
#searchOptionsMenu a.top-level-a {float:left; padding:0 0 0 20px;;} 
#searchOptionsMenu a.top-level-a b {float:left; padding:0 10px 0 0; cursor:pointer; cursor:hand;}
#searchOptionsMenu a.down b {float:left; padding:0 10px 0 0; background:url(https://phenomenex.blob.core.windows.net/cdn/Content/Images/chevronDownMain.gif) no-repeat right; cursor:pointer;}
 
#searchOptionsMenu a.top-level-a:hover {white-space:nowrap;}
#searchOptionsMenu a.top-level-a:hover b, 
#searchOptionsMenu a.top-level-a:focus b, 
#searchOptionsMenu a.top-level-a:active b {color:#fff; cursor:pointer; background: url(https://phenomenex.blob.core.windows.net/cdn/Content/Images/chevronUpMain.gif) no-repeat right;}
#searchOptionsMenu a.down:hover b, 
#searchOptionsMenu a.down:focus b, 
#searchOptionsMenu a.down:active b {color:#fff; cursor:pointer; background: url(https://phenomenex.blob.core.windows.net/cdn/Content/Images/chevronUpMain.gif) no-repeat right;}
 
#searchOptionsMenu li.top-level-li:hover > a {white-space:nowrap;}
#searchOptionsMenu li.top-level-li:hover > a b {color:#0088CC;}
#searchOptionsMenu li.top-level-li:hover > a.down b {color:#0088CC;}
 
#searchOptionsMenu li ul {border-top:1px solid #474849; border-left:1px solid #474849; border-right:1px solid #474849; display:block; position:absolute; left: 20px; margin: 0; padding: 0 0; visibility:hidden; background-color: #343434; }
#searchOptionsMenu li li {border-bottom :1px solid #474849; padding: 0; margin: 0; height: 22px;}
#searchOptionsMenu li li a { width: 150px; padding: 0 0 0 10px; margin: 0; } 
#searchOptionsMenu li li a:hover {color:#0088CC;} 
#searchOptionsMenu li li:hover > a {color:#0088CC;}
 
#searchOptionsMenu ul.drop-down {top:22px;} 

#solutionsLink {  }
#solutionsLink span { display: block; float: left; border: none; margin: 0 0 0 0; width:46px; height:46px; padding: 0px 10px 0 0; background-position: -249px -45px;}
#solutionsLink:hover span { background-position: -249px -95px; }


/* for all new sprite buttons: */
.button {margin:5px 0; float:left; }
.button a {cursor:pointer !important; display:block; margin:0; text-decoration:none; float:left; background:url("https://phenomenex.blob.core.windows.net/cdn/Content/Images/sprites/spirit_right.png") no-repeat scroll; }
.button a span {display: block; text-decoration:none; vertical-align:middle; text-align:center; background:url("https://phenomenex.blob.core.windows.net/cdn/Content/Images/sprites/spirit_left.png") no-repeat scroll; float: left;    }

/* buttonSystemSmall */
.button a.buttonSystemSmall {padding: 0 15px 0 0; text-decoration:none; height: 26px; line-height: 19px; color: #444444;font-size: 11px;background-position: right -1px; cursor:pointer !important;}
.button a.buttonSystemSmall span { padding: 3px 0 4px 15px; background-position: left -1px;  }
.button a.buttonSystemSmall:hover {background-position: right -26px;}
.button a.buttonSystemSmall:hover span {background-position: left -26px; color:#0088CC; }

/* buttonSystemMedium */
.button a.buttonSystemMedium { padding: 0 15px 0 0; text-decoration:none; height: 40px; line-height: 32px; color: #444444; font-size: 14px; background-position: right -55px; cursor:pointer !important; }
.button a.buttonSystemMedium span { padding: 2px 0 8px 15px; font-weight: bold; background-position: left -55px;}
.button a.buttonSystemMedium:hover { background-position: right -97px; }
.button a.buttonSystemMedium:hover span{ background-position: left -97px; color:#0088CC; }

/* buttonSystemMediumTwoLines */
.button a.buttonSystemMediumTwoLines { padding: 0 15px 0 0; text-decoration:none; height: 40px; line-height: 16px; color: #444444; font-size: 11px; background-position: right -55px; cursor:pointer !important; }
.button a.buttonSystemMediumTwoLines span { padding: 2px 0 8px 15px; font-weight: normal; background-position: left -55px;}
.button a.buttonSystemMediumTwoLines:hover { background-position: right -97px; }
.button a.buttonSystemMediumTwoLines:hover span{ background-position: left -97px; color:#0088CC; }

/* buttonSystemLarge */
.button a.buttonSystemLarge { padding: 0 15px 0 0; text-decoration:none; height: 60px; line-height: 20px; color: #444444; font-size: 16px; background-position: right -139px; cursor:pointer !important; }
.button a.buttonSystemLarge span { padding: 20px 0 20px 15px; font-weight: bold; background-position: left -139px;}
.button a.buttonSystemLarge:hover{ background-position: right -202px; }
.button a.buttonSystemLarge:hover span{ background-position: left -202px; color:#0088CC; }

/* buttonSystemLargeTwoLines */
.button a.buttonSystemLargeTwoLines { padding: 0 15px 0 0; text-decoration:none; height: 60px; line-height: 20px; color: #444444; font-size: 16px; background-position: right -139px; cursor:pointer !important; }
.button a.buttonSystemLargeTwoLines span { padding: 10px 0 10px 15px; font-weight: bold; background-position: left -139px;}
.button a.buttonSystemLargeTwoLines:hover { background-position: right -202px; }
.button a.buttonSystemLargeTwoLines:hover span{ background-position: left -202px; color:#0088CC; }

/* buttonEmphasizedSmall */
.button a.buttonEmphasizedSmall {padding: 0 15px 0 0; text-decoration:none; height: 26px; line-height: 18px; color: #444444;font-size: 11px;background-position: right -263px; cursor:pointer !important; }
.button a.buttonEmphasizedSmall span { padding: 3px 0 4px 15px; background-position: left -263px;  }
.button a.buttonEmphasizedSmall:hover {background-position: right -289px;}
.button a.buttonEmphasizedSmall:hover span {background-position: left -289px; color:#0088CC; }

/* buttonEmphasizedMedium  */
.button a.buttonEmphasizedMedium { padding: 0 15px 0 0; text-decoration:none; height: 40px; line-height: 32px; color: #444444; font-size: 14px; background-position: right -315px; cursor:pointer !important; }
.button a.buttonEmphasizedMedium span { padding: 3px 0 7px 15px; font-weight: bold; background-position: left -315px;}
.button a.buttonEmphasizedMedium:hover { background-position: right -357px; }
.button a.buttonEmphasizedMedium:hover span { background-position: left -357px; color:#0088CC; }

/* buttonEmphasizedMediumTwoLines  */
.button a.buttonEmphasizedMediumTwoLines { padding: 0 15px 0 0; text-decoration:none; height: 40px; line-height: 16px; color: #444444; font-size: 11px; background-position: right -315px; cursor:pointer !important; }
.button a.buttonEmphasizedMediumTwoLines span { padding: 2px 0 8px 15px; font-weight: normal; background-position: left -315px; height:30px;}
.button a.buttonEmphasizedMediumTwoLines:hover { background-position: right -357px; }
.button a.buttonEmphasizedMediumTwoLines:hover span { background-position: left -357px; color:#0088CC; }

/* buttonEmphasizedLarge */
.button a.buttonEmphasizedLarge { padding: 0 15px 0 0; text-decoration:none; height: 60px; line-height: 20px; color: #444444; font-size: 16px; background-position: right -399px; cursor:pointer !important; }
.button a.buttonEmphasizedLarge span { padding: 20px 0 20px 15px; font-weight: bold; background-position: left -399px;}
.button a.buttonEmphasizedLarge:hover { background-position: right -462px; }
.button a.buttonEmphasizedLarge:hover span { background-position: left -462px; color:#0088CC; }

/* buttonEmphasizedLargeTwoLines */
.button a.buttonEmphasizedLargeTwoLines { padding: 0 15px 0 0; text-decoration:none; height: 60px; line-height: 20px; color: #444444; font-size: 16px; background-position: right -399px; cursor:pointer !important; }
.button a.buttonEmphasizedLargeTwoLines span { padding: 10px 0 10px 15px; font-weight: bold; background-position: left -399px;}
.button a.buttonEmphasizedLargeTwoLines:hover { background-position: right -462px; }
.button a.buttonEmphasizedLargeTwoLines:hover span { background-position: left -462px; color:#0088CC; }

/* buttonCTASmall */ /* CTA= Call To Action */
.button a.buttonCTASmall {padding: 0 15px 0 0; text-decoration:none; height: 26px; line-height: 17px; color: #444444;font-size: 12px;background-position: right -523px; cursor:pointer !important; }
.button a.buttonCTASmall span { padding: 3px 0 4px 15px; font-weight: bold; background-position: left -523px;  }
.button a.buttonCTASmall:hover { background-position: right -549px; }
.button a.buttonCTASmall:hover span { background-position: left -549px; color:#0088CC; }

/* buttonCTAMedium */ 
.button a.buttonCTAMedium { padding: 0 15px 0 0; text-decoration:none; height: 40px; line-height: 28px; color: #444444; font-size: 14px; background-position: right -575px; cursor:pointer !important; }
.button a.buttonCTAMedium span { padding: 4px 0 8px 15px; font-weight: bold; background-position: left -575px;}
.button a.buttonCTAMedium:hover { background-position: right -617px; }
.button a.buttonCTAMedium:hover span { background-position: left -617px; color:#0088CC; }

/* buttonCTAMediumTwoLines */ 
.button a.buttonCTAMediumTwoLines { padding: 0 15px 0 0; text-decoration:none; height: 40px; line-height: 16px; color: #444444; font-size: 11px; background-position: right -575px; cursor:pointer !important; }
.button a.buttonCTAMediumTwoLines span { padding: 2px 0 8px 15px; font-weight: normal; background-position: left -575px;}
.button a.buttonCTAMediumTwoLines:hover { background-position: right -617px; }
.button a.buttonCTAMediumTwoLines:hover span { background-position: left -617px; color:#0088CC; }

/* buttonCTAMLarge */
.button a.buttonCTALarge { padding: 0 15px 0 0; text-decoration:none; height: 60px; line-height: 20px; color: #444444; font-size: 16px; background-position: right -659px; cursor:pointer !important; }
.button a.buttonCTALarge span { padding: 20px 0 20px 15px; font-weight: bold; background-position: left -659px;}
.button a.buttonCTALarge:hover { background-position: right -721px; }
.button a.buttonCTALarge:hover span { background-position: left -721px; color:#0088CC; }

/* buttonCTALargeTwoLines */
.button a.buttonCTALargeTwoLines { padding: 0 15px 0 0; text-decoration:none; height: 60px; line-height: 20px; color: #444444; font-size: 16px; background-position: right -659px; cursor:pointer !important; }
.button a.buttonCTALargeTwoLines span { padding: 10px 0 10px 15px; font-weight: bold; background-position: left -659px;}
.button a.buttonCTALargeTwoLines:hover { background-position: right -659px; }
.button a.buttonCTALargeTwoLines:hover span { background-position: left -659px; color:#0088CC; }

/* buttonFocusSmallBlue */
.button a.buttonFocusSmallBlue {padding: 0 15px 0 0; text-decoration:none; height: 26px; line-height: 18px; color: #444444;font-size: 12px;background-position: right -782px; cursor:pointer !important; }
.button a.buttonFocusSmallBlue span { padding: 4px 0 4px 15px; background-position: left -782px;  }
.button a.buttonFocusSmallBlue:hover { background-position: right -807px;}
.button a.buttonFocusSmallBlue:hover span { background-position: left -807px; color:#444444; }

/* buttonFocusSmall */
.button a.buttonFocusSmall {padding: 0 15px 0 0; text-decoration:none; height: 26px; line-height: 18px; color: #fff;font-size: 12px;background-position: right -834px; cursor:pointer !important; }
.button a.buttonFocusSmall span { padding: 3px 0 4px 15px; background-position: left -834px;  }
.button a.buttonFocusSmall:hover { background-position: right -860px;}
.button a.buttonFocusSmall:hover span { background-position: left -860px; color:#ffffff; }

/* buttonFocusMedium */ 
.button a.buttonFocusMedium { padding: 0 15px 0 0; text-decoration:none; height: 40px; line-height: 32px; color: #ffffff; font-size: 14px; background-position: right -886px; cursor:pointer !important; }
.button a.buttonFocusMedium span { padding: 2px 0 8px 15px; font-weight: bold; background-position: left -886px;}
.button a.buttonFocusMedium:hover { background-position: right -927px; }
.button a.buttonFocusMedium:hover span { background-position: left -927px; color:#ffffff; }

/* buttonFocusMediumTwoLines */ 
.button a.buttonFocusMediumTwoLines { padding: 0 15px 0 0; text-decoration:none; height: 40px; line-height: 16px; color: #ffffff; font-size: 11px; background-position: right -886px; cursor:pointer !important; }
.button a.buttonFocusMediumTwoLines span { padding: 2px 0 8px 15px; font-weight: normal; background-position: left -886px;}
.button a.buttonFocusMediumTwoLines:hover { background-position: right -927px; }
.button a.buttonFocusMediumTwoLines:hover span { background-position: left -927px; color:#ffffff; }

/* buttons with icons in them */
.button a.cartButton span img { vertical-align:middle; padding:0; margin:0; width:19px;  }
.button a.applicationButton span { padding: 2px 0 2px 15px; }
.button a.applicationButton span img { vertical-align:middle; padding:0; margin:3px 0 0 2px; width:24px; }
.button a.addButton span { padding:2px 0 2px 15px; }
.button a.addButton span img { vertical-align:middle; padding:4px 0 3px 0; margin:0px; width:19px; }
.button a.printIcon span img { float:left; vertical-align:middle; padding: 8px 5px 8px 0px; }
.button a.addButtonTwoLines span img { float:left; vertical-align:middle; padding:8px 5px 3px 0; margin:0px; width:19px; }

/* input buttons */
.inputButton {margin:4px 0; float:left; }
.inputButton input { cursor:pointer !important; display:inline; margin:0; padding:0; text-decoration:none; outline:none; background:url("https://phenomenex.blob.core.windows.net/cdn/Content/Images/sprites/spirit_left.png") no-repeat scroll;}
.inputButton span {cursor:pointer !important; display:inline; margin:0; text-decoration:none; float:left; background:url("https://phenomenex.blob.core.windows.net/cdn/Content/Images/sprites/spirit_right.png") no-repeat scroll;} 

/* buttonInputSmall */
.inputButton input.buttonInputSystemSmall { color: #444444; cursor: pointer; border:none; float: left; font-size: 11px; height: 25px;  text-align: center; text-decoration: none; margin:0; padding:0 0 0 15px; background-position: left -1px;}
.inputButton span.buttonInputSystemSmallEndCap { width:15px; height:25px; background-position: right -1px;}
.inputButton input.buttonInputSystemSmall:hover { background-position: left -26px; color:#0088CC;}
.inputButton:hover span.buttonInputSystemSmallEndCap { background-position: right -26px; }
.inputButton span.buttonInputSystemSmallEndCap:hover { background-position: right -1px; cursor: auto; }

/* buttonInputEmphasizedSmall */
.inputButton input.buttonInputEmphasizedSmall { color: #444444; cursor: pointer; border:none; float: left; font-size: 11px; height: 25px;  text-align: center; text-decoration: none; margin:0; padding:2px 0 4px 15px; background-position: left -263px;}
.inputButton span.buttonInputEmphasizedSmallEndCap { width:15px; height:25px; background-position: right -263px;}
.inputButton input.buttonInputEmphasizedSmall:hover { background-position: left -289px; color:#0088CC;}
.inputButton:hover span.buttonInputEmphasizedSmallEndCap { background-position: right -289px; }
.inputButton span.buttonInputEmphasizedSmallEndCap:hover { background-position: right -263px; cursor: auto; }

/* buttonInputCTASmall */
.inputButton input.buttonInputCTASmall { color: #444444; cursor: pointer; border:none; float: left; font-size: 11px; font-weight:bold; height: 25px;  text-align: center; text-decoration: none; margin:0; padding:2px 0 4px 15px; background-position: left -523px;}
.inputButton span.buttonInputCTASmallEndCap { width:15px; height:25px; background-position: right -523px;}
.inputButton input.buttonInputCTASmall:hover { background-position: left -549px; color:#0088CC;}
.inputButton:hover span.buttonInputCTASmallEndCap { background-position: right -549px; }
.inputButton span.buttonInputCTASmallEndCap:hover { background-position: right -523px; cursor: auto; }

/* buttonInputCTAMedium */
.inputButton input.buttonInputCTAMedium { color: #444444; cursor: pointer; border:none; float: left; font-size: 14px; font-weight:bold; height: 40px;  text-align: center; text-decoration: none; margin:0; padding:2px 0 4px 15px; background-position: left -575px;}
.inputButton span.buttonInputCTAMediumEndCap { width:15px; height:40px; background-position: right -575px;}
.inputButton input.buttonInputCTAMedium:hover { background-position: left -617px; color:#0088CC;}
.inputButton:hover span.buttonInputCTAMediumEndCap { background-position: right -617px; }
.inputButton span.buttonInputCTAMediumEndCap:hover { background-position: right -575px; cursor: auto; }

/* Borrowed buttons from buttons-new.css to LoginModal selectors */

/* for all buttons: */
#modalLogIn .button, #modalRegister .button { margin:5px 0; float:none !important; }
#modalLogIn .button a, #modalRegister .button a {cursor:pointer !important; display:block; margin:0; text-decoration:none; float:left; background:url("https://phenomenex.blob.core.windows.net/cdn/Content/Images/sprites/phx-buttons-sprite-right.png") no-repeat scroll; }
#modalLogIn .button a span, #modalRegister .button a span {cursor:pointer !important; display: block; text-decoration:none; vertical-align:middle; text-align:center; float:left; background:url("https://phenomenex.blob.core.windows.net/cdn/Content/Images/sprites/phx-buttons-sprite-left.png") no-repeat scroll; }

/* button-focus-small */
#modalLogIn .button a.button-focus-small { padding: 0 23px 0 0; text-decoration:none; height: 25px; line-height: 18px; color: #fff;font-size: 14px;background-position: right -513px; cursor:pointer !important; }
#modalLogIn .button a.button-focus-small span { padding: 4px 0 4px 23px; background-position: left -513px;  }
#modalLogIn .button a.button-focus-small:hover { background-position: right -541px; }
#modalLogIn .button a.button-focus-small:hover span { background-position: left -541px; color:#fff; }

/* button-calltoaction-yellow-small */
#modalRegister .button a.button-calltoaction-yellow-small { padding: 0 23px 0 0; text-decoration:none; height: 26px; line-height: 18px; color: #fff;font-size: 14px;background-position: right -769px; cursor:pointer !important; }
#modalRegister .button a.button-calltoaction-yellow-small span { padding: 3px 0 5px 23px; background-position: left -769px; }
#modalRegister .button a.button-calltoaction-yellow-small:hover { background-position: right -797px; }
#modalRegister .button a.button-calltoaction-yellow-small:hover span { background-position: left -797px; color:#fff; }

#myModalLogIn h3 { font-size:16px; line-height:18px; color:#89108A; font-weight:bold; }
#modalLogIn h4, #modalRegister h4 { font-size:14px; /* line-height:18px; */ color:#89108A; font-weight:bold; font-variant: normal; }

#modalLogIn input { border: 1px solid #ABADB3; }
#modalLogIn p, #modalRegister p { margin-top: 5px; line-height: 16px; font-size: 11px; }