@charset "utf-8";
/* CSS Document */

/* Styling for the Mega Drop Down Menu
on the top of the PDO Highlight section
OD/index.html*/

#pdoHi .megaMenu {
  display: flex;
  position: relative;
  height: 28px;
  width: 600px;
  align-items: center;
  background-color: black;
  border-top: 2px solid #b80808;
  top: -10px;
}

/*PDO page*/
#pdoHi .megaMenuBar {
  height: 34px;
  margin: 30px 0;
  border-top: 1px solid #B80808;
  background-color: #232323;
}

#pdoHi .megaMenuBar h2 {
  display: block;
  width: 100%;
}

#pdoHi .megaMenuBar h2 a {
  font-size: 1.5rem;
  line-height: 1.2;
  text-align: center;
  padding-left: 0;
}

#pdoHi .megaMenuBar .menuTitle::after {
  content: "\1F9F0 \00A0\00A0";
  position: absolute;
  top: -1.5px;
  right: 0;
}


#pdoHi .menuTitle {
  --od-ff: var(--od-ff-condensed);
  display: block;
  width: 100%;
  color: white;
  text-align: right;
  font-size: 14.5px;
  padding-right: 10px
}

#pdoHi .menuTitle::before {
  content: "\2630\00A0\00A0";
}

#pdoHi .megaMenuBar .menuTitle::before {
  content: "\00A0\00A0\2630";
  position: absolute;
  left: 0;
}

#pdoHi .megaMenu:hover a {
  display: block;
  width: 100%;
  height: auto;
  cursor: pointer;
}

#toolboxCon {
  position: relative;
}

#pdoHi .megaMenu:hover .menuDD,
#pdoHi .megaMenu:focus .menuDD,
#pdoHi .megaMenu:active .menuDD {
  position: absolute;
  top: 27px;
  display: flex;
  flex-flow: column nowrap;
  width: min(100%, 750px);
  height: auto;
}

#pdoHi .ddRow1 {
  display: flex;
  flex-wrap: nowrap;
}

#pdoHi .ddRow2 {
  display: flex;
  flex-flow: column nowrap;
}

#pdoHi .menuDD {
  position: absolute;
  top: 28px;
  right: 0;
  left: 0;
  padding: 10px 0;
  display: none;

  /* Premium White */
  background-image: linear-gradient(to bottom, #d5d4d0 0%, #d5d4d0 1%, #eeeeec 31%, #efeeec 75%, #e9e9e7 100%);


  /* Full Metal 
  background: linear-gradient(to bottom, #D5DEE7 0%, #E8EBF2 50%, #E2E7ED 100%), linear-gradient(to bottom, rgba(0,0,0,0.02) 50%, rgba(255,255,255,0.02) 61%, rgba(0,0,0,0.02) 73%), linear-gradient(33deg, rgba(255,255,255,0.20) 0%, rgba(0,0,0,0.20) 100%);
  background-blend-mode: normal,color-burn;*/

  /* Chemic Aqua 
  background-color: #CDDCDC;
  background-image: radial-gradient(at 50% 100%, rgba(255,255,255,0.50) 0%, rgba(0,0,0,0.50) 100%), linear-gradient(to bottom, rgba(255,255,255,0.25) 0%, rgba(0,0,0,0.25) 100%);
  background-blend-mode: screen, overlay;*/

  /* Earl Gray 
  background-color: #E4E4E1;
  background-image: radial-gradient(at top center, rgba(255,255,255,0.03) 0%, rgba(0,0,0,0.03) 100%), linear-gradient(to top, rgba(255,255,255,0.1) 0%, rgba(143,152,157,0.60) 100%);
 	background-blend-mode: normal, multiply;*/

  /* Slick Carbon 
  background: linear-gradient(to bottom, #323232 0%, #3F3F3F 40%, #1C1C1C 150%), linear-gradient(to top, rgba(255,255,255,0.40) 0%, rgba(0,0,0,0.25) 200%);
  background-blend-mode: multiply;*/

  /* Loon Crest 
  background: linear-gradient(to top, rgba(255,255,255,0.15) 0%, rgba(0,0,0,0.15) 100%), radial-gradient(at top center, rgba(255,255,255,0.40) 0%, rgba(0,0,0,0.40) 120%) #989898;
  background-blend-mode: multiply,multiply;*/

  /* Coup de Grace 
  background-color: #DCD9D4;
  background-image: linear-gradient(to top, rgba(255,255,255,0.50) 0%, rgba(0,0,0,0.50) 100%), radial-gradient(at 50% 0%, rgba(255,255,255,0.10) 0%, rgba(0,0,0,0.50) 50%);
  background-blend-mode: soft-light,screen;*/
  color: #f1f1f1;
  font-size: 13px;
  line-height: 22px;
  box-sizing: border-box;
  box-shadow: 0 3px 8px rgba(0, 0, 0, .4);
  z-index: 999;
}

/*PDO page*/
#pdoHi .megaMenuBar .menuDD {
  top: 34px;
}



#pdoHi .menuDD a {
  text-decoration: none;
  color: black;
}

#pdoHi .menuCol {
  display: flex;
  flex-flow: column wrap;
  align-content: center;
  box-sizing: border-box;
}

#pdoHi .menuCol h3 {
  font-size: 16px;
  font-style: normal;
  color: rgba(0, 0, 0, .6);
  display: block;
  width: 95%;
  margin-top: 0;
  padding: 0 0 5px 0;
  border-bottom: 1px solid #b80808;
  text-transform: uppercase;
  text-align: center;
  text-shadow: 1px 0 2px rgba(0, 0, 0, .35);
}

#pdoHi .menuCol a {
  display: block;
  width: auto;
  padding: 0 5px;
  text-align: left;
}

#pdoHi .menuCol a:hover {
  color: white;
  background-image: linear-gradient(to left, #383838 0%, black 100%);
  padding: 0 5px;
}

#pdoHi .col1 a,
#pdoHi .col2 a,
#pdoHi .col3 a,
#pdoHi .col4 a {
  padding-left: 10px;
}

#pdoHi .col1,
#pdoHi .col2 {
  border-right: 1.5px solid rgba(255, 255, 255, .75);
}

#pdoHi .col1 {
  width: 30%;
}

#pdoHi .col2 {
  width: 34%;
}

#pdoHi .col3 {
  width: 36%;
}

#pdoHi .col4,
#pdoHi .colFooter {
  width: 100%;
  padding-top: 5px;
}

#pdoHi .colFooter p {
  margin-bottom: 0;
}

#pdoHi .smallText {
  color: black;
  font-size: 9.5px;
  text-align: center;
}