/* base css styles */
html,body{ font: normal 100%/1.5 var(--phl-font, Arial, sans-serif); color: var(--phl-ink, #1f2933); }

h1 {
font-family: var(--phl-font);
font-size: var(--fs-lg);
font-weight: 700;
line-height: 1.25;
color: var(--phl-ink);
}
h2 {
font-family: var(--phl-font);
font-size: var(--fs-md);
font-weight: 700;
line-height: 1.25;
color: var(--phl-ink);
}
h3 {
display: block;
font-size: var(--fs-base);
line-height: 1.25;
margin: 1em 0;
font-weight: 700;
}
h4 {
display: block;
font-size: var(--fs-sm);
line-height: 1.25;
margin: 1.33em 0;
font-weight: 700;
}

h1.primeHeader{ font: 700 var(--fs-xl)/1.25 var(--phl-font); }
h2.primeHeader{ font: 400 var(--fs-md)/1.3 var(--phl-font); margin: 10px 0 5px 0; }
h3.primeHeader{ font: 400 var(--fs-base)/1.3 var(--phl-font); margin: 3px 0 3px 0; }
h4.primeHeader{ font: 400 var(--fs-sm)/1.3 var(--phl-font); margin:3px 0 3px 0; }

b { font-weight: bold }
strong{ font-weight: bold }
i { font-style:italic; }
a{ text-decoration: none; color: var(--phl-red-dark); }
a:hover{ color: var(--phl-red-deep); }

input, select, textarea, button { font-family: var(--phl-font); font-size: inherit; }

a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: none;
  box-shadow: var(--ring);
}

input[type="text"]:focus, input[type="email"]:focus, input[type="tel"]:focus,
input[type="number"]:focus, input[type="password"]:focus, input[type="search"]:focus,
select:focus, textarea:focus {
  background-color: var(--phl-surface-focus);
  border-color: var(--phl-blue);
}

/
/* aadel - 2016-12-12 - made select take the same box-sizing as inputs */
input, select {
    box-sizing: content-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

input[type='checkbox'] {
    width:20px;
    height:20px;
    border-radius:5px;
    border:2px solid #555;
}

p { margin: 10px 0 10px 0; }

ul{ list-style: disc inside; margin: 10px 0 10px 15px; }
ol{ list-style: decimal inside; margin: 10px 0 10px 15px; }

ol .lowerAlpha{ list-style: lower-alpha inside; margin: 10px 0 10px 15px; }

li{ margin: 5px 0 5px 0; }

fieldset{ border: 1px solid #3f3f3f; }

table{ margin: 10px 0 10px 0; }

#mainPanel{ background-color: #fff; margin: auto; max-width: 980px;}

#topBar{
  font-size: var(--fs-sm);
  height: 48px;
  margin: 0 calc(50% - 50vw);
  padding: 0 calc(50vw - 50%);
  background-color: var(--phl-hero-bg);
  border-bottom: 1px solid var(--phl-hero-line);
}

#topBar a{
  color: #fff;
}

#paginationPanel{ margin: 0 40px 0 40px; }
#paginationControl{ padding: 0; margin: 0; list-style: none; }
#paginationControl a{ color: var(--phl-red-dark); }
#paginationControl a.currentPage{ color: crimson; }
#paginationControl li{ float: left; margin-right: 5px; }

.fixed-346{ width: 346px; }
.grid .fixed-3-4{ width: calc( 75% - 346px ); }
.blueText{color: var(--phl-blue);}

#testimonialPanel{
  position:relative;
}

.phlHeroQuote{
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  font-size: var(--fs-md);
}

.phlHeroQuote #heroQuoteText,
.phlHeroQuote .phlQuoteWho{
  transition: opacity 0.18s ease;
}

.testimonial{ padding:0 auto; }
.testimonial .testName{ width: 260px; margin:10px auto 0 auto; }
.testimonial .testBody{ width: 260px; margin: 0 auto; }

#fordmotor{ margin: 0 auto; }

.searchInst{margin-top:10px;font-size: 0.8em;padding:0 20px;}
.searchInst .blueText{font-size: 1.0em;}

.logoHeader{
  padding:5px 0 5px 5px;
  margin-top:10px;
  font-weight: bold;
  border-bottom: 1px solid var(--phl-red);
}

.callBanner{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--sp-4);
  width: auto;
  max-width: 980px;
  box-sizing: border-box;
  margin: var(--sp-4) auto 0;
  padding: var(--sp-4);
  background-color: var(--phl-surface);
  border: 1px solid var(--phl-line);
  border-radius: var(--r-md);
  font: 600 var(--fs-md)/1.4 var(--phl-font);
  color: var(--phl-ink);
}

.callBanner img{
  width: 72px;
  height: 72px;
  object-fit: cover;
  object-position: top;
  border-radius: 50%;
  float: none;
}

.callBanner span{
  float: none;
  width: auto;
  margin: 0;
  text-align: left;
}

.callBanner b{ color: var(--phl-red-dark); }

#above-fold-phone{ font-weight: 700; color: var(--phl-red-dark); }

#searchBannerText{
  font: 800 var(--fs-xxl)/1.15 var(--phl-font);
  color: var(--phl-ink);
  width: 100%;
  padding: var(--sp-4) 0 var(--sp-1) var(--sp-4);
  letter-spacing: -0.01em;
}

ul.sideBarProp{
  list-style-type: none;
  padding:0;
  margin:0;
  float: right;
  width: 90%;
}

ul.sideBarProp li{
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  color: var(--phl-ink);
  text-align: left;
  margin: 0 0 10px 0;
  font-weight: 600;
  font-size: var(--fs-sm);
  background-color: var(--phl-surface);
  border: 1px solid var(--phl-line);
  border-radius: var(--r-md);
}

ul.sideBarProp li::before{
  content: "\2713";
  flex: none;
  width: 24px;
  height: 24px;
  line-height: 24px;
  text-align: center;
  border-radius: 50%;
  background-color: var(--phl-green);
  color: #fff;
  font-weight: 700;
}

ul#logoList{
  list-style-type: none;
  padding:0;
  margin:0;
}

ul#logoList li.logoEntry{ width:200px; text-align:center; margin: 30px auto 0px auto; }
ul#logoList li.logoEntry a#bbblink{ position:relative; left: 25px; }

/*--[ Colors ]----------------------------------------------------------------*/
.hlBlue{ background-color: var(--phl-blue); color: #fff; }
.hlLightBlue{ background-color: var(--phl-blue-light); color: #fff; }
.hlDarkBlue{ background-color: var(--phl-blue-dark); color: #fff; }
.hlRed{ background-color: var(--phl-red); }
.hlGreen{ background-color: var(--phl-green); }

.hlBlueText{ color: var(--phl-blue); }
.hlLightBlueText{ color: var(--phl-blue-light); }
.hlDarkBlueText{ color: var(--phl-blue-dark); }
.hlRedText{ color: var(--phl-red-dark); }
.hlGreenText{ color: var(--phl-green); }
.hlWhiteText{ color: #fff; }

.hlLightBlueBorder { border: 1px solid var(--phl-blue-light); }

#slideshowContainer{ width: 312px; height: 261px; position: relative; margin: 0 0; border-radius: var(--r-md); overflow: hidden; box-shadow: var(--shadow-1); }
#slideshowContainer img{ display:block; position:absolute; top:0; left:0; z-index:1; }

/*--[Positional Styles]-------------------------------------------------------*/
.textCenter{text-align:center;}
.textLeft{text-align:left;}
.textRight{text-align:right;}

/*--[ LightFace ]-------------------------------------------------------------*/
.lightfaceMask{
    opacity: 0.8;
    background-color:black;
    z-index: 9001;
}

/*--[ ShareSearch ]-----------------------------------------------------------*/
#shareSearch, #newSearch, #filters{ margin: 20px 0 0 0px; cursor: pointer; }

#shareSearch.oem{
  float: right;
  font-weight: bold;
  color: var(--phl-red);
  font-size:24px;
}

#newSearchButton{
  padding: 8px 12px;
  width:115px;
  background-color: var(--phl-action);
  border: 1px solid var(--phl-action-dark);
  border-radius: var(--r-sm);
  color: #fff;
  font-weight:600;
  cursor:pointer;
}

#newSearchButton:hover{ background-color: var(--phl-action-dark); }

#filterButton{
  padding: 8px 12px;
  width:115px;
  background-color: var(--phl-surface);
  border: 1px solid var(--phl-blue);
  border-radius: var(--r-sm);
  color: var(--phl-blue);
  font-weight:600;
  cursor:pointer;
}

#filterButton:hover{ background-color: var(--phl-blue-50); }

#shareSearchButton{
  padding: 8px 12px;
  background-color: var(--phl-surface);
  border: 1px solid var(--phl-blue);
  border-radius: var(--r-sm);
  color: var(--phl-blue);
  font-weight: 600;
  cursor:pointer;
}

#shareSearchButton:hover{ background-color: var(--phl-blue-50); }

#shareSearchPanel
{
  position:absolute;
  top: 51px;
  left: 390px;
  width: 632px;
  min-height: 200px;
  background-color: var(--phl-surface);
  border: 1px solid var(--phl-line);
  border-radius: var(--r-md);
  box-shadow: var(--shadow-2);
  visibility: hidden;
}

#shareSearchPanelContent
{
  margin: 0;
  padding: var(--sp-4);
  width: auto;
}

#shareSearchPanelContent h3{ font: normal 1.17em arial,helvetica,sans-serif; color: var(--phl-red-dark); }

#shareLink{ font-size: 0.90em; border: 1px solid var(--phl-line); border-radius: var(--r-sm); padding: 8px; height: 50px; width: auto; overflow-x: auto; background-color: var(--phl-bg); }

#shareSearchClosePanel{ margin: 10px 0 0 0; text-align: right; }
/*--[ filter panel ]----------------------------------------------------------*/

#filterPanel
{
  position:absolute;
  top: 85px;
  left: 213px;
  width: 632px;
  min-height: 200px;
  background-color: var(--phl-surface);
  border: 1px solid var(--phl-line);
  border-radius: var(--r-md);
  box-shadow: var(--shadow-2);
  display: none;
}

#filterPanelContent
{
  margin: 0;
  padding: var(--sp-4);
  width: auto;
}

#filterPanelContent h3{ font: normal 1.17em arial,helvetica,sans-serif; color: var(--phl-red-dark); }
#filterClosePanel{ margin: 10px 0 0 0; text-align: right; }
div#filterPanelContent * {vertical-align: middle;}


/*--[ Shopping Cart ]---------------------------------------------------------*/
#phlLogo{ max-width: 280px; height: auto; }

#cartHeaderPanel{ padding-top: var(--sp-3); }

#cartHeaderPanel #resultPanel{
  background-color: transparent;
  color: var(--phl-ink);
}

#cartHeaderPanel #resultPanel #cartStatus{
  background-color: transparent;
}

#cartHeaderPanel #resultPanel .topBar{
  background-color: transparent;
  width: 100%;
  height: auto;
  box-sizing: border-box;
  padding: 0 var(--sp-4);
}

#cartHeaderPanel #resultPanel .topBar #cartStatus{
  float: right;
  margin: 0;
}

#cartHeaderPanel #resultPanel .topBar #cartStatus a{
  display: inline-block;
  white-space: nowrap;
  text-decoration: none;
  color: var(--phl-blue-dark);
  background-color: var(--phl-blue-50);
  border: 1px solid var(--phl-line);
  border-radius: var(--r-full);
  padding: 4px 14px;
  font-weight: 600;
}

#cartHeaderPanel #cartHeader h3{
  font-family: var(--phl-display);
  font-weight: 900;
  font-size: clamp(1.5rem, 3vw, 2.05rem);
  line-height: 1.1;
  letter-spacing: -0.02em;
  color: var(--phl-ink);
  margin: var(--sp-2) 0;
  padding: 0;
}

#cartHeaderPanel #cartHeader{
  border-bottom: 1px solid var(--phl-line);
  padding-bottom: var(--sp-2);
}

#cartHeaderPanel #newSearch{ margin-top: var(--sp-2); }

#cartHeaderPanel #newSearch br{ display: none; }

#cartContentPanel #contentPanel{ min-height: max(80px, calc(100vh - 712px)); }

#warrLink{margin: 8px 0 0 40px;}
#warrLink a{text-decoration: none; color:white;}
#warrLink a:hover{color:yellow;}

#bottomWarrLink{visibility:hidden;}

#cartStatus
{
  float: right;
  margin: 9px 16px 0 0;
}

#cartStatus a{ color: #ffffff; text-decoration: none; }

#topBar #cartStatus a{
  display: inline-block;
  white-space: nowrap;
  text-decoration: none;
  color: #fff;
  background-color: rgba(255,255,255,0.14);
  border: 1px solid rgba(255,255,255,0.4);
  border-radius: var(--r-full);
  padding: 4px 14px;
  font-weight: 600;
}

#topBar #cartStatus a:hover{ background-color: rgba(255,255,255,0.26); }

/*--[ Notification Panel ]----------------------------------------------------*/
#shadowPanel{ position: fixed; top: 0; left: 0; z-index: 1000; background-color: black; visibility:hidden; }

#statusPanel{ position: fixed; top: 0; left: 0; z-index: 1001; width: 426px; visibility:hidden; border: 1px solid var(--phl-line); border-radius: var(--r-md); overflow: hidden; box-shadow: var(--shadow-2); background:#fff;}
#statusPanelBody{ text-align: center; color: #000; padding: 10px;}
#statusPanelTitle{ padding: 10px 0 0 12px; font-size: 12pt; font-weight: 600; color: #fff; height: 30px; background-color: var(--phl-blue-dark); }
#statusPanelControl{ height: 44px; padding: 15px 10px 0 10px;  }

#statusPanel .statusGrayButton{ height: 34px; width: 138px; color: var(--phl-ink); border: 1px solid var(--phl-line); border-radius: var(--r-sm); background-color: var(--phl-surface); font-weight: 600; cursor: pointer; }
#statusPanel .statusGreenButton{ height: 34px; width: 138px; color: white; border: 1px solid var(--phl-action-dark); border-radius: var(--r-sm); background-color: var(--phl-action); font-weight: 600; cursor: pointer; }
#statusPanel .statusRedButton{ height: 34px; width: 138px; color: white; border: 1px solid var(--phl-red-deep); border-radius: var(--r-sm); background-color: var(--phl-red-dark); font-weight: 600; cursor: pointer; }

#statusPanel.phlThrobberPanel{ width: 220px; border-radius: var(--r-md); }
#statusPanel.phlThrobberPanel #statusPanelTitle,
#statusPanel.phlThrobberPanel #statusPanelControl{ display: none; }
#statusPanel.phlThrobberPanel #statusPanelBody{ display: flex; align-items: center; justify-content: center; gap: 12px; padding: 22px 18px; }
.phlSearchThrobber{ width: 24px; height: 24px; flex: 0 0 auto; border: 3px solid var(--phl-line); border-top-color: var(--phl-red); border-radius: 50%; animation: phlThrobberSpin .7s linear infinite; }
.phlSearchThrobberLabel{ font-size: var(--fs-md); font-weight: 600; color: var(--phl-ink); }
@keyframes phlThrobberSpin{ to{ transform: rotate( 360deg ); } }

.statusTitleLeft { width: 13px; height: 34px; background: url( '/templates/phl_v2/images/searchform_sprite.png' ) no-repeat; }
.statusTitleCenter { color: white; padding-top: 5px; font-size: 14pt; height: 29px; background: url( '/templates/phl_v2/images/searchform_bar_sprite.png' ) repeat-x; }
.statusTitleRight { width: 13px; height: 34px; background: url( '/templates/phl_v2/images/searchform_sprite.png' ) no-repeat -13px 0; }

#box      { margin: 20px 0 20px 16px; padding: 2px 2px 0 2px; width:372px; height:29px; border:1px solid #000; }
#perc      { height:27px; background-color: var(--phl-action); }

/*#notificationPanel{ background: url( '/templates/phl_1/images/notification_bg.png' ) no-repeat; }*/
#notificationPanel{
  background-color: #fff;
  padding: 10px 10px 0 10px;
  width:474px;
  height:200px;
  top:80px;
  left:50%;
  margin-left: -237px;
  border-radius: var(--r-md);
  border: 1px solid var(--phl-line);
  box-shadow: var(--shadow-2);
}

#messagePanel{
  width:466px;
  margin-top: 10px;
  margin-left:auto;margin-right:auto;
}

/*--[RecyclerDetail ]-------------------------------------------------------*/
#closestYardsPanel{ margin: auto; }
#closestYardsPanel h3{font-size: 1.3em; padding-top:10px;}
#closestYardsPanelRpp{ width: 800px; margin: auto; text-align:center; }

.recyclerDetail,
.recyclerDetailRpp{
  padding: var(--sp-4);
  margin-bottom: var(--sp-3);
  text-align: left;
  background-color: var(--phl-surface);
  border: 1px solid var(--phl-line);
  border-left: 3px solid var(--phl-red);
  border-radius: var(--r-md);
  box-shadow: var(--shadow-1);
}

.recyclerName{
  font-size: var(--fs-md);
  font-weight: 700;
  color: var(--phl-ink);
}

.recyclerName a{ color: var(--phl-red-dark); }

.recyclerPhone{
  font-size: var(--fs-md);
  font-weight: 700;
  margin-top: 2px;
}

.recyclerPhone a{ color: var(--phl-red-dark); }
.recyclerAddress{}


/*--[ SEO Parts Pages ]-----------------------------------------------------*/
#partsPagePanel{}
#partsPagePanel a{ font: bold 12pt Arial, sans-serif; }

/*--[ FooterPanel ]---------------------------------------------------------*/
#footerPanel{}
/*#footerPanel .topLeft{ width: 13px; height: 14px; background: url( '/templates/phl_1/images/footer_sprite.png')  no-repeat; }
#footerPanel .topBar{ width: 954px; height: 14px; background: url( '/templates/phl_1/images/footer_bar_sprite.png' ) repeat-x; }
#footerPanel .topRight{ width: 13px; height: 14px; background: url( '/templates/phl_1/images/footer_sprite.png' ) no-repeat -13px 0; }
#footerPanel .bottomLeft{ width: 13px; height: 14px; background: url( '/templates/phl_1/images/footer_sprite.png' ) no-repeat 0 -14px; }
#footerPanel .bottomBar{ width: 954px; height: 14px; background: url( '/templates/phl_1/images/footer_bar_sprite.png' ) repeat-x 0 -14px; }
#footerPanel .bottomRight{ width: 13px; height: 14px; background: url( '/templates/phl_1/images/footer_sprite.png' ) no-repeat -13px -14px; }
*/
#footerPanel .footerBody{ background-color: var(--phl-blue-dark); color: var(--phl-hero-ink-soft); font-size: 11px; padding: 10px 5px; border-top: 1px solid rgba(255,255,255,0.15); }

#footerNav{ padding: 5px 0 20px 0; text-align: center; font-size: 0.9em }
#footerNav ul{ list-style: none; margin: 0; padding: 0; display: inline; }
#footerNav li{ display: inline; margin: 0 5px 0 5px; }
#footerNav a{ color: white; }
#footerNav a:hover {color: #F80000;}
#footerNav a.links {
    font-family: Arial, Helvetica, sans-serif;
    text-decoration: underline;
}


#copyInfo{ font-size: 10px; }

#finalLinks{ width: 100%; max-width: 980px; padding: 10px 0 0 0; }
#finalLinksBottom{ height: 43px; width: 100%; max-width: 980px; }

/*addition - aadel - 2016-12-15 - get rid of chrome autofil color */

input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill {
    background-color: unset !important;
}

/* addition - aadel - 2017-01-25 - making the alert panel overlay everything */
#statusPanel {
    z-index: 9999;
}
/* addition - aadel - 201-02-10 - fixed the status bar hanging off very small screens */
#statusProgBar, #statusProgBar #box {
    max-width: 95%;
}

/* SEO page heading and description initially hidden */
#partsPagePanel .thebodytext,
#partsPagePanel h1:first-child { display:none; }

#notificationPanel .close {
    color: var(--phl-red);
    font-weight:bold;
    font-size:36px;
}

/* Shopping Cart */
.table-flex {
  font-size: .9em;
}
.table-row {
  display: flex;           display: -webkit-flex;
  flex-direction: row;     -webkit-flex-direction: row;
  flex-grow: 0;            -webkit-flex-grow: 0;
  width: 100%;

}

.wrapper {
  display: flex;           display: -webkit-flex;
  flex-direction: row;     -webkit-flex-direction: row;
  flex-grow: 0;            -webkit-flex-grow: 0;
  flex-wrap: wrap;         -webkit-flex-wrap: wrap;
}
.table-row > * {
  flex-grow: 1; -webkit-flex-grow: 1;
}
.text {
  flex-grow: 1;           -webkit-flex-grow: 1;
}

.text {
  overflow: hidden;
  white-space: wrap;
  text-overflow: ellipsis;
  padding-right: 20px;
}

.num {
  width: 80px;
}

.table-row {
  border-bottom: 1px solid var(--phl-line);
  border-collapse: collapse;
  padding: 14px 0;
}

.table-row.header, .cartTotals {
  font-weight: 700;
  padding-top: 10px;
  padding-bottom: 10px;
}

.table-row.header {
  color: var(--phl-ink-soft);
  font-size: var(--fs-xs);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  border-bottom: 2px solid var(--phl-line);
  padding-top: 0;
  padding-bottom: 8px;
}

#cartItemTable .table-row {
  flex-wrap: nowrap;
}

#cartItemTable .table-row > .wrapper:nth-child(1) {
  flex: 0 0 44px;
  align-items: center;
  justify-content: center;
}

#cartItemTable .table-row > .wrapper:nth-child(2) {
  flex: 1 1 0;
  min-width: 0;
}

#cartItemTable .table-row > .wrapper:nth-child(3) {
  flex: 1.2 1 0;
  min-width: 0;
}

#cartItemTable .table-row > .wrapper:nth-child(4) {
  flex: 0 0 200px;
  align-content: flex-start;
}

#cartItemTable .table-row > .wrapper:nth-child(5) {
  flex: 0 0 96px;
  justify-content: flex-end;
  align-content: flex-start;
}

#cartItemTable .table-row > .wrapper:nth-child(1) .num,
#cartItemTable .table-row > .wrapper:nth-child(5) .num {
  width: auto;
}

#cartItemTable .table-row > .wrapper:nth-child(5) .num {
  text-align: right;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

#cartItemTable .table-row:not(.header) > .wrapper:nth-child(5) .num::before {
  content: "$";
}

#cartItemTable .table-row:not(.header):hover {
  background-color: var(--phl-bg);
}

#cartItemTable .yardCheckbox {
  width: 16px;
  height: 16px;
  accent-color: var(--phl-red);
  cursor: pointer;
}

#cartItemTable .text {
  width: auto;
}

.cartItemTitle {
  font-weight: 700;
}

.cartItemDesc {
  color: var(--phl-ink-soft);
  font-size: var(--fs-xs);
}

#cartItemTable select.itemGuarantee,
#cartItemTable select.itemShipping {
  max-width: 100%;
  padding: 6px 8px;
  font: inherit;
  font-size: .95em;
  color: var(--phl-ink);
  background-color: var(--phl-surface);
  border: 1px solid var(--phl-line);
  border-radius: var(--r-sm);
}

#cartItemTable select.itemGuarantee {
  margin: 8px 0 4px 0;
}

#cartItemTable [id^="guarLabel_"] {
  color: var(--phl-ink-soft);
  font-size: var(--fs-xs);
}

.guaranteedetails,
.refundpolicy {
  color: var(--phl-ink-soft);
  font-size: var(--fs-xs);
  text-decoration: underline;
}

.guaranteedetails:hover,
.refundpolicy:hover {
  color: var(--phl-red-dark);
}

.cartTotals {
  width: min(360px, 100%);
  margin-left: auto;
  font-weight: 400;
}

.cartTotals .table-row {
  justify-content: space-between;
  align-items: baseline;
  padding: 9px 0;
}

.cartTotals .table-row .text {
  padding-right: 0;
  color: var(--phl-ink-soft);
}

.cartTotals .table-row .grow-3 {
  flex-grow: 0;
}

.cartTotals .table-row [id]::before {
  content: "$";
}

.cartTotals .table-row [id] {
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

.cartTotals .table-row:last-child {
  border-top: 2px solid var(--phl-ink);
  border-bottom: none;
  margin-top: 4px;
}

.cartTotals .table-row:last-child .text {
  color: var(--phl-ink);
  font-weight: 700;
}

.cartTotals .table-row:last-child [id] {
  font-size: 1.25em;
}

.button.go:disabled {
  opacity: .5;
  cursor: not-allowed;
}

.cartEmpty {
  text-align: center;
  padding: var(--sp-8) var(--sp-4);
}

.cartEmptyTitle {
  font-weight: 700;
  font-size: var(--fs-lg);
  color: var(--phl-ink);
  margin: 0 0 6px 0;
}

.cartEmptyHint {
  color: var(--phl-ink-soft);
  margin: 0;
}

.cartEmptyHint a {
  color: var(--phl-red-dark);
  font-weight: 700;
}

.grow-0 {
  flex-grow: 0; -webkit-flex-grow: 0;
}

.grow-1 {
  flex-grow: 1; -webkit-flex-grow: 1;
}

.grow-3 {
  flex-grow: 3; -webkit-flex-grow: 3;
}

.col-header {
  display: none;
  font-weight: bold;
  width: 25%;
}

@media screen and (max-width: 980px) {
  .table-row {
    flex-direction: column;
  }
  #cartItemTable .table-row {
    flex-wrap: wrap;
    box-sizing: border-box;
    background-color: var(--phl-surface);
    border: 1px solid var(--phl-line);
    border-radius: var(--r-md);
    box-shadow: var(--shadow-1);
    padding: var(--sp-2) var(--sp-4);
    margin-bottom: var(--sp-3);
  }
  #cartItemTable .table-row > .wrapper {
    justify-content: space-between;
    align-items: baseline;
    padding: 6px 0;
    border-bottom: 1px solid var(--phl-bg);
  }
  #cartItemTable .table-row > .wrapper:nth-child(1),
  #cartItemTable .table-row > .wrapper:nth-child(2),
  #cartItemTable .table-row > .wrapper:nth-child(3),
  #cartItemTable .table-row > .wrapper:nth-child(4),
  #cartItemTable .table-row > .wrapper:nth-child(5) {
    flex: 1 1 auto;
  }
  #cartItemTable .table-row > .wrapper:last-child {
    border-bottom: none;
  }
  #cartItemTable .table-row > .wrapper:nth-child(1) .col-header::before {
    content: "Select";
  }
  #cartItemTable .text {
    width: auto;
    padding-right: 0;
  }
  #cartItemTable .table-row:not(.header):hover {
    background-color: var(--phl-surface);
  }
  .cartTotals {
    width: 100%;
  }
  .cartTotals .table-row {
    flex-direction: row;
  }
  .col-header {
    display: flex;
    width: auto;
    min-width: 90px;
    font-weight: 600;
    color: var(--phl-ink-soft);
    font-size: var(--fs-xs);
    text-transform: uppercase;
    letter-spacing: 0.04em;
  }
  .table-row.header {
    display: none;
  }
}

.button {
	padding: 9px 14px;
	min-width: 115px;
	border: 1px solid var(--phl-line);
	border-radius: var(--r-sm);
	background-color: var(--phl-surface);
	color: var(--phl-ink);
	font-weight: 600;
	cursor: pointer;
  font-size: .9em;
  margin-bottom: 5px;
  transition: background-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}

.button:hover {
  box-shadow: var(--shadow-1);
  transform: translateY(-1px);
}

.button:active {
  transform: translateY(0);
  box-shadow: none;
}

.button.go {
  background-color: var(--phl-action);
  border-color: var(--phl-action-dark);
  color: #fff;
}

.button.go:hover {
  background-color: var(--phl-action-dark);
}

/* Cart Buyer Info */

#buyerInfoDiv label {
  display: block;
  font-size: var(--fs-sm);
  font-weight: 600;
  color: var(--phl-ink);
  margin-bottom: 2px;
}
#buyerInfoDiv * {
  box-sizing: border-box;
}
#buyerInfoDiv input:not([type="button"]):not([type="submit"]):not([type="checkbox"]), #buyerInfoDiv select {
  width: 100%;
  height: 40px;
  padding: 0 10px;
  font-size: 15px;
  border: 1px solid var(--phl-line);
  border-radius: var(--r-sm);
  background-color: #fff;
}
#buyerInfoDiv input[type="checkbox"] {
  width: auto;
}
.columns, .column {
  margin-bottom: 7px;
}


/* Grid taken from skeleton.css 
* Copyright 2014, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
/* Grid
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.container {
  position: relative;
  width: 100%;
  max-width: 960px;
  margin: 0 auto;
  padding: 0 20px;
  box-sizing: border-box; }
.column,
.columns {
  width: 100%;
  float: left;
  box-sizing: border-box; }

/* For devices larger than 400px */
@media (min-width: 400px) {
  .container {
    width: 85%;
    padding: 0; }
}

/* For devices larger than 550px */
@media (min-width: 550px) {
  .container {
    width: 80%; }
  .column,
  .columns {
    margin-left: 4%; }
  .column:first-child,
  .columns:first-child {
    margin-left: 0; }

  .one.column,
  .one.columns                    { width: 4.66666666667%; }
  .two.columns                    { width: 13.3333333333%; }
  .three.columns                  { width: 22%;            }
  .four.columns                   { width: 30.6666666667%; }
  .five.columns                   { width: 39.3333333333%; }
  .six.columns                    { width: 48%;            }
  .seven.columns                  { width: 56.6666666667%; }
  .eight.columns                  { width: 65.3333333333%; }
  .nine.columns                   { width: 74.0%;          }
  .ten.columns                    { width: 82.6666666667%; }
  .eleven.columns                 { width: 91.3333333333%; }
  .twelve.columns                 { width: 100%; margin-left: 0; }

  .one-third.column               { width: 30.6666666667%; }
  .two-thirds.column              { width: 65.3333333333%; }

  .one-half.column                { width: 48%; }

  /* Offsets */
  .offset-by-one.column,
  .offset-by-one.columns          { margin-left: 8.66666666667%; }
  .offset-by-two.column,
  .offset-by-two.columns          { margin-left: 17.3333333333%; }
  .offset-by-three.column,
  .offset-by-three.columns        { margin-left: 26%;            }
  .offset-by-four.column,
  .offset-by-four.columns         { margin-left: 34.6666666667%; }
  .offset-by-five.column,
  .offset-by-five.columns         { margin-left: 43.3333333333%; }
  .offset-by-six.column,
  .offset-by-six.columns          { margin-left: 52%;            }
  .offset-by-seven.column,
  .offset-by-seven.columns        { margin-left: 60.6666666667%; }
  .offset-by-eight.column,
  .offset-by-eight.columns        { margin-left: 69.3333333333%; }
  .offset-by-nine.column,
  .offset-by-nine.columns         { margin-left: 78.0%;          }
  .offset-by-ten.column,
  .offset-by-ten.columns          { margin-left: 86.6666666667%; }
  .offset-by-eleven.column,
  .offset-by-eleven.columns       { margin-left: 95.3333333333%; }

  .offset-by-one-third.column,
  .offset-by-one-third.columns    { margin-left: 34.6666666667%; }
  .offset-by-two-thirds.column,
  .offset-by-two-thirds.columns   { margin-left: 69.3333333333%; }

  .offset-by-one-half.column,
  .offset-by-one-half.columns     { margin-left: 52%; }

}
.container:after,
.row:after,
.u-cf {
  content: "";
  display: table;
  clear: both; }
/* End Grid */
/*--[ Modern Header / Footer ]------------------------------------------------*/
#headerPanel{ margin: 0 calc(50% - 50vw); background-color: var(--phl-bg); border-bottom: 1px solid var(--phl-line); }

.phlHeaderInner{
  display: flex;
  align-items: center;
  gap: var(--sp-5);
  max-width: 980px;
  margin: 0 auto;
  padding: var(--sp-3);
  box-sizing: border-box;
}

.phlHeaderLogo img{ display: block; width: 280px; height: auto; }

.phlHeaderTag{ flex: 1; min-width: 0; }
.phlHeaderTag h2.primeHeader{ font-size: var(--fs-base); font-weight: 600; margin: 0; color: var(--phl-ink); }
.phlHeaderTag h3.primeHeader{ font-size: var(--fs-sm); font-weight: 400; margin: 2px 0 0 0; color: var(--phl-ink-soft); }

.phlHeaderRight{ margin-left: auto; display: flex; align-items: center; gap: var(--sp-4); }

.phlHeaderCta{ text-align: right; }
.phlHeaderCtaLabel{
  display: block;
  font-size: var(--fs-xs);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--phl-ink-soft);
}
.phlHeaderPhone{ font-size: var(--fs-lg); font-weight: 700; color: var(--phl-red); white-space: nowrap; }
.phlHeaderPhone:hover{ color: var(--phl-red-dark); }

@media screen and (max-width: 736px){
  .phlHeaderInner{ padding: var(--sp-2) var(--sp-3); gap: var(--sp-3); }
  #headerPanel #phlLogo{ width: 150px; }
  .phlHeaderCtaLabel{ display: none; }
  .phlHeaderPhone{ font-size: var(--fs-base); }
}


.phlFooter{ margin: 0 calc(50% - 50vw); background-color: var(--phl-blue-dark); color: #fff; padding: var(--sp-7) var(--sp-4) var(--sp-6); }

.phlFooterCols{
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-6);
  max-width: 980px;
  margin: 0 auto;
}

.phlFooterCol{ flex: 1 1 200px; min-width: 180px; }

.phlFooterHead{
  font-size: var(--fs-sm);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: var(--sp-3);
  color: #fff;
}

.phlFooterNav{ list-style: none; margin: 0; padding: 0; }
.phlFooterNav li{ margin: 0 0 8px 0; }
.phlFooterNav a{ color: #cfe0f2; font-size: var(--fs-sm); }
.phlFooterNav a:hover{ color: #fff; }

.phlFooterPhone{ display: inline-block; font-size: var(--fs-lg); font-weight: 700; color: #fff; margin-bottom: var(--sp-1); }
.phlFooterPhone:hover{ color: #cfe0f2; }

.phlFooterMuted{ color: var(--phl-hero-ink-soft); font-size: var(--fs-sm); margin-bottom: var(--sp-3); }

.phlFooterTrust{
  justify-content: flex-start;
  gap: var(--sp-2);
  margin-bottom: var(--sp-3);
}

.phlFooterTrust img{
  height: 36px;
  width: auto;
  background-color: #fff;
  border-radius: var(--r-sm);
  padding: 4px 8px;
}


.phlFooterQuote{
  font-size: var(--fs-sm);
  line-height: 1.5;
  color: #e4edf6;
  border-left: 3px solid var(--phl-red);
  padding-left: var(--sp-3);
}
.phlFooterQuoteWho{ display: block; margin-top: var(--sp-1); font-weight: 700; color: var(--phl-hero-ink); }


.phlFooterPartner{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-5);
  max-width: 980px;
  margin: var(--sp-6) auto 0;
  padding-top: var(--sp-5);
  border-top: 1px solid rgba(255, 255, 255, 0.15);
}

.phlFooterPartnerCopy{ flex: 1 1 320px; }

.phlFooterPartnerBrand{
  font-family: var(--phl-display);
  font-size: var(--fs-lg);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #fff;
  margin-bottom: var(--sp-1);
}

.phlFooterPartnerAccent{ color: var(--phl-partner-orange); }

.phlFooterPartnerPitch{
  font-size: var(--fs-sm);
  line-height: 1.5;
  color: var(--phl-hero-ink-soft);
  max-width: 62ch;
}

.phlFooterPartnerLink{
  display: inline-block;
  background-color: var(--phl-partner-orange);
  color: #fff;
  font-size: var(--fs-sm);
  font-weight: 700;
  line-height: 1.2;
  padding: var(--sp-3) var(--sp-5);
  border-radius: var(--r-sm);
  white-space: nowrap;
}

.phlFooterPartnerLink:hover,
.phlFooterPartnerLink:focus{ background-color: var(--phl-partner-orange-dark); color: #fff; }

@media screen and (max-width: 700px){
  .phlFooterPartner{ flex-direction: column; align-items: flex-start; gap: var(--sp-4); }
  .phlFooterPartnerCopy{ flex: 0 0 auto; }
  .phlFooterPartnerLink{ white-space: normal; }
}

.phlPartnerBanner{
  margin: 0 calc(50% - 50vw);
  background-color: var(--phl-blue-dark);
  border-bottom: 2px solid var(--phl-partner-orange);
}

.phlPartnerBannerInner{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--sp-4);
  max-width: 980px;
  margin: 0 auto;
  padding: var(--sp-2) var(--sp-4);
}

.phlPartnerBannerBrand{
  font-family: var(--phl-display);
  font-size: var(--fs-sm);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #fff;
  white-space: nowrap;
}

.phlPartnerBannerAccent{ color: var(--phl-partner-orange); }

.phlPartnerBannerPitch{
  font-size: var(--fs-sm);
  line-height: 1.4;
  color: var(--phl-hero-ink-soft);
}

.phlPartnerBannerLink{
  display: inline-block;
  background-color: var(--phl-partner-orange);
  color: #fff;
  font-size: var(--fs-xs);
  font-weight: 700;
  line-height: 1.2;
  padding: var(--sp-1) var(--sp-3);
  border-radius: var(--r-sm);
  white-space: nowrap;
}

.phlPartnerBannerLink:hover,
.phlPartnerBannerLink:focus{ background-color: var(--phl-partner-orange-dark); color: #fff; }

@media screen and (max-width: 700px){
  .phlPartnerBannerInner{ justify-content: space-between; gap: var(--sp-3); padding: var(--sp-1) var(--sp-3); }
  .phlPartnerBannerPitch{ display: none; }
}

.footerBody{
  background-color: var(--phl-blue-dark);
  border-top: 1px solid rgba(255, 255, 255, 0.15);
  padding: var(--sp-4);
  margin: 0 calc(50% - 50vw);
}

#finalLinks:empty,
#finalLinksBottom:empty{ display: none; }

.footerBody #copyInfo{
  float: none;
  width: auto;
  max-width: 980px;
  margin: 0 auto;
  font-size: var(--fs-xs);
  line-height: 1.6;
  color: var(--phl-hero-ink-soft);
}


/*--[ Hero band ]-------------------------------------------------------------*/
#searchPanelContainer{ margin: 0 calc(50% - 50vw); background-color: var(--phl-bg); border-bottom: 1px solid var(--phl-line); padding-bottom: var(--sp-4); }

#phlHero{
  background-color: var(--phl-hero-bg);
  background-image:
    radial-gradient(120% 90% at 78% 8%, rgba(212, 0, 0, 0.20) 0%, rgba(212, 0, 0, 0) 58%),
    repeating-linear-gradient(135deg, rgba(244, 241, 236, 0.028) 0 2px, rgba(244, 241, 236, 0) 2px 9px);
  color: var(--phl-hero-ink);
  padding: var(--sp-6) 0 var(--sp-7);
  margin-bottom: var(--sp-5);
  border-bottom: 3px solid var(--phl-red);
}

#phlHero #searchPanel{ max-width: 978px; margin: 0 auto; }

.phlHeroCopy{ padding-right: var(--sp-6) !important; }

#searchBannerText{
  font-family: var(--phl-display);
  font-size: var(--fs-hero);
  font-weight: 900;
  line-height: 0.94;
  letter-spacing: -0.025em;
  text-transform: uppercase;
  color: var(--phl-hero-ink);
  padding: 0;
  width: 100%;
}

#searchBannerText em{
  font-style: normal;
  color: var(--phl-red);
}

.phlHeroSub{
  max-width: 34em;
  margin: var(--sp-4) 0 var(--sp-5);
  padding: 0;
  color: var(--phl-hero-ink-soft);
  font-size: var(--fs-base);
  line-height: 1.55;
}

.phlHeroSub b{ color: var(--phl-hero-ink); font-weight: 700; }

#phlHero ul.sideBarProp{
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-2) var(--sp-5);
  float: none;
  width: auto;
  margin: 0 0 var(--sp-5);
  padding: var(--sp-4) 0 0;
  border-top: 1px solid var(--phl-hero-line);
}

#phlHero ul.sideBarProp li{
  align-items: flex-start;
  gap: var(--sp-2);
  margin: 0;
  padding: 0;
  background: none;
  border: 0;
  border-radius: 0;
  color: var(--phl-hero-ink);
  font-size: var(--fs-sm);
  font-weight: 600;
}

#phlHero ul.sideBarProp li::before{
  content: "";
  margin-top: 7px;
  width: 7px;
  height: 7px;
  border-radius: 0;
  background-color: var(--phl-red);
  transform: rotate(45deg);
}

#phlHero #testimonialPanel{
  padding-top: var(--sp-4);
  border-top: 1px solid var(--phl-hero-line);
}

#phlHero .phlQuote{
  background: none;
  border: 0;
  border-left: 2px solid var(--phl-red);
  border-radius: 0;
  box-shadow: none;
  padding: 0 0 0 var(--sp-4);
  margin: 0;
}

#phlHero .phlQuote::before{ display: none; }

#phlHero .phlHeroQuote{
  font-size: var(--fs-sm);
  font-style: italic;
  line-height: 1.6;
  color: var(--phl-hero-ink-soft);
}

#phlHero .phlHeroQuote .phlQuoteWho{
  margin-top: var(--sp-2);
  font-style: normal;
  font-weight: 700;
  font-size: var(--fs-xs);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--phl-hero-ink);
}

.phlHeroForm .phlWizardCard{
  background-color: var(--phl-surface);
  border: 0;
  border-radius: var(--r-md);
  box-shadow: var(--shadow-hero);
  overflow: hidden;
}

.phlWizardCard{ padding: 0; }

.phlHeroForm .phlExpandHint{
  margin: var(--sp-3) 0 0;
  text-align: center;
  color: var(--phl-hero-ink-soft);
  font-size: var(--fs-xs);
  line-height: 1.5;
}

.phlHeroForm .phlExpandHint b{ color: var(--phl-hero-ink); }

.phlExpandHint{ color: var(--phl-ink-soft); font-size: var(--fs-sm); }

@media screen and (max-width: 800px){
  #phlHero{ padding: var(--sp-4) 0 var(--sp-5); margin-bottom: var(--sp-4); }
  #phlHero #searchPanel .col{ width: 100%; }
  .phlHeroCopy{ padding-right: 0 !important; }
  #phlHero #searchBannerText{ font-size: var(--fs-xl); }
  .phlHeroSub{ font-size: var(--fs-sm); margin-bottom: var(--sp-3); }
  #phlHero ul.sideBarProp,
  #phlHero #testimonialPanel{ display: none; }
}

#pageHeadBand{
  margin: 0 calc(50% - 50vw);
  padding: 0 calc(50vw - 50%);
  background-color: var(--phl-hero-bg);
  background-image: repeating-linear-gradient(135deg, rgba(244, 241, 236, 0.028) 0 2px, rgba(244, 241, 236, 0) 2px 9px);
  border-bottom: 3px solid var(--phl-red);
  margin-bottom: var(--sp-5);
}

.pageHeadInner{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-4);
  max-width: 980px;
  margin: 0 auto;
  padding: var(--sp-3) 0;
}

.pageHeadBandBare .pageHeadInner{ justify-content: flex-end; }

#pageHeadBand.pageHeadBandOpen{ margin-bottom: 0; }

.pageHeadCrumbs{
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  min-width: 0;
  font-size: var(--fs-xs);
  line-height: 1.3;
}

.pageHeadCrumb{
  color: var(--phl-hero-ink-soft, rgba(244, 241, 236, 0.66));
  text-decoration: none;
}

a.pageHeadCrumb:hover,
a.pageHeadCrumb:focus-visible{
  color: #fff;
  text-decoration: underline;
}

.pageHeadCrumbSep{
  color: rgba(244, 241, 236, 0.34);
}

.pageHeadCrumbCurrent{
  font-weight: 700;
  color: var(--phl-hero-ink);
}

#toggleSearchButton{
  flex: none;
  padding: 9px 18px;
  font: 700 var(--fs-sm) var(--phl-font);
  color: var(--phl-hero-ink);
  background-color: rgba(244, 241, 236, 0.08);
  border: 1px solid var(--phl-hero-line);
  border-radius: var(--r-sm);
  cursor: pointer;
  transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

#toggleSearchButton:hover,
#toggleSearchButton:focus-visible{
  color: #fff;
  background-color: var(--phl-action);
  border-color: var(--phl-action);
}

@media screen and (max-width: 560px){
  .pageHeadInner{ padding: var(--sp-2) 0; gap: var(--sp-3); }
  #toggleSearchButton{ padding: 8px 12px; }
  .pageHeadCrumbs > *:not(.pageHeadCrumbCurrent){ display: none; }
}

#pageCtaBand{
  margin: var(--sp-8) calc(50% - 50vw) 0 calc(50% - 50vw);
  padding: 0 calc(50vw - 50%);
  background-color: var(--phl-bg);
  border-top: 1px solid var(--phl-line);
}

.pageCtaInner{
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: var(--sp-5);
  max-width: 980px;
  margin: 0 auto;
  padding: var(--sp-7) 0;
}

.pageCtaCopy{ min-width: 0; }

.pageCtaTitle{
  margin: 0;
  font-family: var(--phl-display);
  font-size: clamp(1.3rem, 2.4vw, 1.7rem);
  font-weight: 900;
  line-height: 1.1;
  letter-spacing: -0.02em;
  color: var(--phl-ink);
}

.pageCtaSub{
  max-width: var(--measure);
  margin: var(--sp-2) 0 0 0;
  font-size: var(--fs-sm);
  line-height: 1.5;
  color: var(--phl-ink-soft);
}

.pageCtaActions{
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--sp-5);
}

.pageCtaButton{
  flex: none;
  padding: 13px 26px;
  font: 700 var(--fs-md) var(--phl-font);
  color: #fff;
  background-color: var(--phl-action);
  border: 1px solid var(--phl-action-dark);
  border-radius: var(--r-sm);
  cursor: pointer;
  transition: background-color 0.15s ease;
}

.pageCtaButton:hover,
.pageCtaButton:focus-visible{ background-color: var(--phl-action-dark); }

.pageCtaPhone{
  display: block;
  text-decoration: none;
  border-left: 1px solid var(--phl-line);
  padding-left: var(--sp-5);
}

.pageCtaPhoneLabel{
  display: block;
  font-size: var(--fs-xs);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--phl-ink-soft);
}

.pageCtaPhoneNumber{
  display: block;
  margin-top: 2px;
  font-size: var(--fs-lg);
  font-weight: 700;
  color: var(--phl-red-dark);
}

.pageCtaPhone:hover .pageCtaPhoneNumber{ text-decoration: underline; }

@media screen and (max-width: 700px){
  .pageCtaInner{ padding: var(--sp-6) 0; gap: var(--sp-4); }
  .pageCtaActions{ width: 100%; gap: var(--sp-4); }
  .pageCtaButton{ width: 100%; }
  .pageCtaPhone{ padding-left: 0; border-left: none; }
}

@media screen and (min-width: 737px){
  .phlHeroForm .phlWizardCard{ min-height: 410px; }
}
