@font-face{font-family:"Metric";font-weight:200;font-style:normal;src:url("../fonts/Metric-Light.woff2") format("woff2"),url("../fonts/Metric-Light.woff") format("woff");}
@font-face{font-family:"Metric";font-weight:400;font-style:normal;src:url("../fonts/Metric-Regular.woff2") format("woff2"),url("../fonts/Metric-Regular.woff") format("woff");}
@font-face{font-family:"Metric";font-weight:500;font-style:normal;src:url("../fonts/Metric-Medium.woff2") format("woff2"),url("../fonts/Metric-Medium.woff") format("woff");}
@font-face{font-family:"Metric";font-weight:600;font-style:normal;src:url("../fonts/Metric-Semibold.woff2") format("woff2"),url("../fonts/Metric-Semibold.woff") format("woff");}
@font-face{font-family:"Metric";font-weight:700;font-style:normal;src:url("../fonts/Metric-Black.woff2") format("woff2"),url("../fonts/Metric-Black.woff") format("woff");}


body {font-family: 'Metric'; font-size: calc(1rem + .45vmin); font-weight: 400; color: rgb(68, 68, 68); line-height: 1.25; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; background-color: #fff !important; }
body p:last-child { padding-bottom: 0; margin-bottom: 0; }

.mastspace { margin-top: 58px; }


/* HEADER */

@media (min-width: 992px) {
  h1 { font-size: 53px; }
  h2 { font-size: 40px; }
  h2.gradient-block-title { font-size: 32px; text-align: left; padding-bottom: 0; }
  .gradient-block.desc { font-size: 22px; }
  .bodytx-large { font-size: 22px; }
  h2.black-title-center { text-align: center; padding-bottom: 2rem; font-size: 40px; }
}

h1, h2, h3, h4, h5 { line-height: 1.11320755em; font-weight: 400; letter-spacing: 0.01em; padding-bottom: 1rem; text-transform: inherit; }
small { color: #7f7d7d; line-height: 1.2; }

.headerunderline { 
  position: absolute;
  display: block;
  width: 65px;
  height: 3px;
  background-color: #01A982;
  margin-top: .8rem; 
}

.headertitlespace { margin-bottom: 3rem;color: #ffffff; }

.tx-green { color: #01A982 !important; }
.tx-white { color: #ffffff; }
.tx-black { color: #000000; }
.tx-magenta { color: #C140FF !important; }

section.margin-bottom-4rem { margin-bottom: 4rem; }

.border_top { border-top: 1px solid #E5E5E5; margin: 1rem 1.25rem; }
.bordertop { border-top: 1px solid #dee2e6 }
.borderbottom { border-bottom: 3px solid #dee2e6 }
.bordrtop_green { background-color: #01A982; height: 1px; margin-bottom: 1rem; }

.font-weight-400 { font-weight: 400 !important; }
.font-weight-500 { font-weight: 500 !important; }
.font-weight-600 { font-weight: 600 !important; }
.font-weight-700 { font-weight: 700 !important; }
.font-inherit { font-size: inherit; }

.paddingLeft-0 { padding-left: 0; }
.paddingRight-0 { padding-right: 0; }
.pad-2rem { padding: 2rem; }
.pad-3rem { padding: 3rem; }
.pad-2point5rem { padding: 2.5rem; }

.margintop-0 { margin-top: 0 !important; }
.m-bottom-1-5rem { margin-bottom: 1.5rem; }
.margin-left-point5 { margin-left: .5rem; }
.margin-right-point5 { margin-right: .5rem; }
.margintb-1 { margin: 1rem 0; }
.margintb-half { margin: .5rem 0; }

.radius-30px { border-radius: 30px; }
.radius-1rem { border-radius: 1rem; }
.extraseparator { height: 35px; }

.magentatx { color: #C140FF !important; }
.notetx { font-size: 1rem; }

a, a:hover { text-decoration: none; cursor: pointer; color: inherit;  }

@media (min-width: 1200px) {
  section .container { padding-top: 4rem; padding-bottom: 4rem }
}

@media (min-width: 992px) and (max-width: 1199px) {
  section .container { padding-top: 3rem; padding-bottom: 3rem }
  .font_size_48px { font-size: 48px; }
  .font_size_3rem { font-size: 3rem; }
}

@media (max-width: 991px) {
  section .container { padding-top: 2rem; padding-bottom: 2rem }
}

section .container.padding-topbottom-0 { padding-top: 0 !important; padding-bottom: 0 !important }

@media (min-width: 1200px) {
  .masthead-brief { margin-top: calc(30px - 0.31462em); font-size: 26px; line-height: 1.26923077em; }
}

/* END HEADER */


/* BACKGROUND COLOR */

.HPE_lightpurple { background-color: #C140FF; }
.bg-green { background-color: #01A982; }
.bg-greymenu { background-color: #eeeeee; }
.bg-grey { background-color: #F2F2F2; }
.bg-lightgrey { background-color: #f8f8f8; }
.bg-mediumgrey { background-color: #e4e4e4; }
.block-grey { background-color: #F1F1F1; }
.bgwhite { background-color: #ffffff; }
.HPE_purple { background-color: #6F37ED; }

/* END BACKGROUND COLOR */


/* GRADIENT */

.gradient_bluemargentayellow { background: linear-gradient(45deg, #fec901, #af42f0, #0d5265); }
.gradient_purpleblue { background: linear-gradient(45deg, #d221ff, #00dec8); }
.gradient_purplemargentayellow { background: linear-gradient(45deg, #ffc800, #eb3474, #8219f3); }
.gradient_purpleblueyellow { background: linear-gradient(45deg, #8219f3, #00dec8, #ffc800); }
.gradient_orangeyellow { background: linear-gradient(45deg, #ffd300, #ff6300); }
.gradient_greenyellow { background: linear-gradient(225deg, #FF8300, #FEC901, #2ECC40, #3D9970) }
.gradient_magentagreenyellow { background: linear-gradient(225deg, #eb3474, #b56cad, #01c294 40%, #fec901) }
.gradient_magentapurplegreen { background: linear-gradient(225deg, #eb3474, #7630ea, #01d9a6) }
.gradient_orangepurple { background: linear-gradient(270deg, #7B2DFF 0%, #AA3EFF 47%, #FE5C01 100%); }

.gradient_back img { margin: 1.35rem; }
.gradient_back_purpleblue { content: ''; z-index: -1; background: linear-gradient(45deg, #d221ff, #00dec8); width: 230px; }
.gradient_back_bluemargentayellow { content: ''; z-index: -1; background: linear-gradient(45deg, #fec901, #af42f0, #0d5265); width: 230px; }
.gradient_back_purpleblueyellow { content: ''; z-index: -1; background: linear-gradient(45deg, #ffc800, #00dec8, #8219f3); width: 230px; }
.gradient_back_purplemargentayellow { content: ''; z-index: -1; background: linear-gradient(45deg, #ffc800, #eb3474, #8219f3); width: 230px; }
.gradient_back_orangeyellow { content: ''; z-index: -1; background: linear-gradient(45deg, #ffd300, #ff6300); width: 230px; }
.gradient_back_greenyellow { content: ''; z-index: -1; background: linear-gradient(225deg, #FF8300, #FEC901, #2ECC40, #3D9970); width: 230px; }
.gradient_back_magentagreenyellow { content: ''; z-index: -1; background: linear-gradient(225deg, #eb3474, #b56cad, #01c294 40%, #fec901); width: 230px; }
.gradient_back_magentapurplegreen { content: ''; z-index: -1; background: linear-gradient(225deg, #eb3474, #7630ea, #01d9a6); width: 230px; }

.greycurve_bg {
  background-image: url('../images/stockimages/GettyImages-1304863046_1600_0_72_RGB.jpg');
  background-size: cover; padding: 1rem 0; background-repeat: no-repeat;
}

.tx_purplemagentayellow {
  content: '';
  background-image: linear-gradient(45deg, #ffc800, #eb3474, #8219f3);
  background-size: 100% 100%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.tx_purpleblue {
  content: '';
  background-image: linear-gradient(45deg, #d221ff, #00dec8);
  background-size: 100% 100%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.tx_purpleblueyellow { 
  background: linear-gradient(45deg, #8219f3, #00dec8, #ffc800);
  content: '';
  background-size: 100% 100%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent; 
}

.tx_orangepurple { 
  background: linear-gradient(270deg, #7B2DFF 0%, #AA3EFF 47%, #FE5C01 100%);
  content: ''; margin-bottom: ;
  background-size: 100% 100%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent; 
}

/* END GRADIENT */

.gradient-stockimage, .membercard { grid-area: overflow-content; position: relative; margin-bottom: 2rem; }

@media screen and (max-width: 767px) {
  .membercard img { width: calc(100% - 30px) }
  .gradient-stockimage img { width: calc(100% - 30px); object-fit: cover; height: 300px; object-position: top; }

  .gradient-stockimage_orangeyellow::after {
    content: '';
    position: absolute;
    z-index: -1;
    left: 10%;
    bottom: -10%;
    width: calc(100% - 12.5%);
    background: linear-gradient(45deg, #ffd300, #ff6300);
    height: 100%;
  }
  .gradient-stockimage_purplemargentayellow::after {
    content: '';
    position: absolute;
    z-index: -1;
    left: 10%;
    bottom: -10%;
    width: calc(100% - 12.5%);
    background: linear-gradient(45deg, #ffc800, #eb3474, #8219f3);
    height: 100%;
  }
  .gradient-stockimage_purpleblue2::after {
    content: '';
    position: absolute;
    z-index: -1;
    left: 10%;
    bottom: -10%;
    width: calc(100% - 10.5%);
    background: linear-gradient(45deg, #d221ff, #00dec8);
    height: 100%;
  }
  .gradient-stockimage_purpleblueyellow::after {
    content: '';
    position: absolute;
    z-index: -1;
    left: 10%;
    bottom: -10%;
    width: calc(100% - 12.5%);
    background: linear-gradient(45deg, #ffc800, #00dec8, #8219f3);
    height: 100%;
  }
  .gradient-stockimage_purpleblue::after {
    content: '';
    position: absolute;
    z-index: -1;
    left: 10%;
    bottom: -10%;
    width: calc(100% - 12.5%);
    background: linear-gradient(45deg, #d221ff, #00dec8);
    height: 100%;
  }
  .gradient-stockimage_greenyellow::after {
    content: '';
    position: absolute;
    z-index: -1;
    left: 10%;
    bottom: -10%;
    width: calc(100% - 12.5%);
    background: linear-gradient(225deg, #FF8300, #FEC901, #2ECC40, #3D9970);
    height: 100%;
  }
  .gradient-stockimage_magentagreenyellow::after {
    content: '';
    position: absolute;
    z-index: -1;
    left: 10%;
    bottom: -10%;
    width: calc(100% - 12.5%);
    background: linear-gradient(225deg, #eb3474, #b56cad, #01c294 40%, #fec901);
    height: 100%;
  }
  .gradient-stockimage_magentapurplegreen::after {
    content: '';
    position: absolute;
    z-index: -1;
    left: 10%;
    bottom: -10%;
    width: calc(100% - 12.5%);
    background: linear-gradient(225deg, #eb3474, #7630ea, #01d9a6);
    height: 100%;
  }
  .gradient-stockimage_orangepurple::after {
    content: '';
    position: absolute;
    z-index: -1;
    left: 10%;
    bottom: -10%;
    width: calc(100% - 12.5%);
    background: linear-gradient(270deg, #7B2DFF 0%, #AA3EFF 47%, #FE5C01 100%);
    height: 100%;
  }
}

@media screen and (min-width: 768px) and (max-width: 991px) {
  .gradient-stockimage img { width: calc(100% - 48px); object-fit: cover; height: 350px; object-position: 0% 30%; object-position: top; }
}

@media screen and (min-width: 992px) and (max-width: 1199px) {
  .gradient-stockimage img { width: calc(100% - 50px); object-fit: cover; height: 245px; object-position: top; }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .membercard img { width: calc(100% - 50px);  }
  .gradient-stockimage_orangeyellow::after {
    content: '';
    position: absolute;
    z-index: -1;
    left: 10%;
    bottom: -10%;
    width: calc(92.5% - 50px);
    background: linear-gradient(45deg, #ffd300, #ff6300);
    height: 100%;
  }
  .gradient-stockimage_purplemargentayellow::after {
    content: '';
    position: absolute;
    z-index: -1;
    left: 10%;
    bottom: -10%;
    width: calc(92.5% - 50px);
    background: linear-gradient(45deg, #ffc800, #eb3474, #8219f3);
    height: 100%;
  }
  .gradient-stockimage_purpleblue2::after {
    content: '';
    position: absolute;
    z-index: -1;
    left: 10%;
    bottom: -10%;
    width: calc(95.5% - 50px);
    background: linear-gradient(45deg, #d221ff, #00dec8);
    height: 100%;
  }
  .gradient-stockimage_purpleblueyellow::after {
    content: '';
    position: absolute;
    z-index: -1;
    left: 10%;
    bottom: -10%;
    width: calc(92.5% - 50px);
    background: linear-gradient(45deg, #ffc800, #00dec8, #8219f3);
    height: 100%;
  }
  .gradient-stockimage_purpleblue::after {
    content: '';
    position: absolute;
    z-index: -1;
    left: 10%;
    bottom: -10%;
    width: calc(92.5% - 50px);
    background: linear-gradient(45deg, #d221ff, #00dec8);
    height: 100%;
  }
  .gradient-stockimage_greenyellow::after {
    content: '';
    position: absolute;
    z-index: -1;
    left: 10%;
    bottom: -10%;
    width: calc(92.5% - 50px);
    background: linear-gradient(225deg, #FF8300, #FEC901, #2ECC40, #3D9970);
    height: 100%;
  }
  .gradient-stockimage_magentagreenyellow::after {
    content: '';
    position: absolute;
    z-index: -1;
    left: 10%;
    bottom: -10%;
    width: calc(92.5% - 50px);
    background: linear-gradient(225deg, #eb3474, #b56cad, #01c294 40%, #fec901);
    height: 100%;
  }
  .gradient-stockimage_magentapurplegreen::after {
    content: '';
    position: absolute;
    z-index: -1;
    left: 10%;
    bottom: -10%;
    width: calc(92.5% - 50px);
    background: linear-gradient(225deg, #eb3474, #7630ea, #01d9a6);
    height: 100%;
  }
  .gradient-stockimage_orangepurple::after {
    content: '';
    position: absolute;
    z-index: -1;
    left: 10%;
    bottom: -10%;
    width: calc(92.5% - 50px);
    background: linear-gradient(270deg, #7B2DFF 0%, #AA3EFF 47%, #FE5C01 100%);
    height: 100%;
  }
}

@media screen and (min-width: 1200px) {
  .membercard img { width: calc(100% - 56px); }
  .gradient-stockimage img { width: calc(100% - 56px); object-fit: cover; height: 300px; object-position: top; }

  .gradient-stockimage_orangeyellow::after {
    content: '';
    position: absolute;
    z-index: -1;
    left: 8%;
    bottom: -9.5%;
    width: calc(95% - 56px);
    background: linear-gradient(45deg, #ffd300, #ff6300);
    height: 100%;
  }
  .gradient-stockimage_purplemargentayellow::after {
    content: '';
    position: absolute;
    z-index: -1;
    left: 8%;
    bottom: -9.5%;
    width: calc(95% - 56px);
    background: linear-gradient(45deg, #ffc800, #eb3474, #8219f3);
    height: 100%;
  }
  .gradient-stockimage_purpleblueyellow::after {
    content: '';
    position: absolute;
    z-index: -1;
    left: 8%;
    bottom: -9.5%;
    width: calc(95% - 56px);
    background: linear-gradient(45deg, #ffc800, #00dec8, #8219f3);
    height: 100%;
  }
  .gradient-stockimage_purpleblue::after {
    content: '';
    position: absolute;
    z-index: -1;
    left: 8%;
    bottom: -9.5%;
    width: calc(95% - 56px);
    background: linear-gradient(45deg, #d221ff, #00dec8);
    height: 100%;
  }
  .gradient-stockimage_greenyellow::after {
    content: '';
    position: absolute;
    z-index: -1;
    left: 8%;
    bottom: -9.5%;
    width: calc(95% - 56px);
    background: linear-gradient(225deg, #FF8300, #FEC901, #2ECC40, #3D9970);
    height: 100%;
  }
  .gradient-stockimage_magentagreenyellow::after {
    content: '';
    position: absolute;
    z-index: -1;
    left: 8%;
    bottom: -9.5%;
    width: calc(95% - 56px);
    background: linear-gradient(225deg, #eb3474, #b56cad, #01c294 40%, #fec901);
    height: 100%;
  }
  .gradient-stockimage_magentapurplegreen::after {
    content: '';
    position: absolute;
    z-index: -1;
    left: 8%;
    bottom: -9.5%;
    width: calc(95% - 56px);
    background: linear-gradient(225deg, #eb3474, #7630ea, #01d9a6);
    height: 100%;
  }
  .gradient-stockimage_orangepurple::after {
    content: '';
    position: absolute;
    z-index: -1;
    left: 8%;
    bottom: -9.5%;
    width: calc(95% - 56px);
    background: linear-gradient(270deg, #7B2DFF 0%, #AA3EFF 47%, #FE5C01 100%);
    height: 100%;
  }

  .gradient-stockimage_purpleblue2::after {
    content: '';
    position: absolute;
    z-index: -1;
    left: 8%;
    bottom: -9.5%;
    width: calc(97% - 56px);
    background: linear-gradient(45deg, #d221ff, #00dec8);
    height: 100%;
  }
}

/* FOOTER */
#sponsored-logo { background: #fff; text-align: center; }
#sponsored-logo img { margin: 0 0.5em; }
#sponsored-logo .row_01 img { width: 7em; }
#sponsored-logo .row_02 img { width: 7.5em; margin-bottom: 0.7em; }
#sponsored-logo .row_03 img { width: 5em; }
/* END FOOTER */


/*----- Floating Contact Button -----*/
.float_contact { position: fixed; bottom: 5%; z-index: 999; right: 2%; }
/*----- End of Floating Contact Button -----*/



/* ================ GLOBAL LANDING ================ */

.home_header {
  background: url("../images/stockimages/hpe_intro_bg.png");
  background-position: center top;
  background-size: cover;
  padding: 6em 0 4em;
  color: #fff;
}
.home_header p { font-size: 24px; }
.home_login { background: #000000; padding: 4em 0 3em; color: #fff; position: relative; font-size: 18px; }
.globe_vid { position: absolute; bottom: 0; right: 2em; display: grid; }
.globe_vid video { width: auto; float: right; }
.video_overlay { background: linear-gradient(0deg, rgba(0, 0, 0, 1) 1%, rgba(0, 0, 0, 0) 20%); }
.video_content, .video_overlay { grid-area: 1 / 1; }

.bringtofront { z-index: 1; }

@media screen and (max-width: 768px) and (max-device-width: 768px) {
  .globe_vid { width: 100%; right: 2px !important; }
  .globe_vid video { width: 100% !important; }
}

h1.home-block-title, h2.home-block-title { text-transform: none; margin-bottom: .5rem }
.home-block h2 { text-transform: none; margin: 1.5rem 0 0.5rem; font-weight: 600; }
.home-block { background: #F1F1F1; border: 0; }
.home-block-body { padding: 1.5em 1.5em 0 1.5em ; border: 0; background: transparent; }
.home-block-btn { padding: 1.5em; border: 0; background: transparent; }
.home-block-body p {
  margin: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  font-weight: 400;
}

.home-block-green { background: #01A982; border-radius: 30px; color: #ffffff; }

@media screen and (max-width: 767px) {
  .card-body.tbspace { padding-top: 3rem; padding-bottom: 3rem; }
  .tbspace2 { padding-top: 1rem; padding-bottom: 1rem; }
}

@media screen and (min-width: 768px) {
  .tbspace2 { padding-top: 3rem; padding-bottom: 3rem; }
}


/* FLIPING CARD */

#globalland .flip-card {
  background-color: transparent;
  width: 100%; border-radius: 1rem;
  overflow: hidden;
  margin: 0; 
}
#globalland .flip-card-inner, #carouselflip .flip-card {
  position: relative;
  text-align: center;
  min-height: 340px;
  transition: transform .9s;
  transform-style: preserve-3d;
}

#globalland .flip-card-inner .flip-card-front img { width: 70%; }

#globalland .flip-card:hover .flip-card-inner, #carouselflip .flip-card:hover .flip-card-inner { transform: rotateY(180deg); }

#globalland .flip-card-front, #globalland .flip-card-back, #carouselflip .flip-card-front, #carouselflip .flip-card-back {
  position: absolute; border-radius: 1rem;
  width: 100%;
  height: 100%;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
#globalland .flip-card-front { background-color: #ffffff; padding: 4rem 3rem 3rem; font-size: 1rem; }

#globalland .flip-card-front, #globalland .flip-card-front img {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
#globalland .flip-card-back {
  background-color: #000000;
  color: #fff; 
  transform: rotateY(180deg);
}
#globalland .flip-card-back .flip-card-back-inner {
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 100%; padding: 2rem;
}
#globalland .flip-card-back .flip-card-back-inner p, #carouselflip .flip-card-back .flip-card-back-inner p {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 6;
  -webkit-box-orient: vertical;
}

#carouselflip .flip-card-inner .flip-card-front img, #incentive .flip-card-inner .flip-card-front img { width: 100%; height: 100%;object-fit: cover; }

#carouselflip .flip-card-back { color: #fff; transform: rotateY(180deg); }
#carouselflip .flip-card-back-odd { background-color: #f6f6f6; color: rgb(68, 68, 68);  height: 100%; }
#carouselflip .flip-card-back-even { background-color: #333333; color: #fff; height: 100%;  }
#carouselflip .flip-card-back .flip-card-back-inner { padding: 2rem; }

@media screen and (min-width: 1200px) {
  #carouselflip .flip-card-back-inner p { font-size: 16px; }
}

#carouselflip .flip-card {
  background-color: transparent;
  height: 300px;
  width: 100%;
  overflow: hidden;
}
#carouselflip .flip-card-inner {
  position: relative;
  text-align: center;
  height: 300px;
  transition: transform 0.6s;
  transform-style: preserve-3d;
}
#carouselflip .flip-card:hover .flip-card-inner { transform: rotateY(180deg); }

#flipcarousel .carousel-control-prev-icon { background-image: url('../images/icon/icon_caret_left.svg') }
#flipcarousel .carousel-control-next-icon { background-image: url('../images/icon/icon_caret_right.svg') }
#flipcarousel  .carousel-indicators {
  position: absolute;
  right: 0;
  bottom: -45px;
  left: 0;
  z-index: 2;
  display: flex;
  justify-content: center;
  margin-right: 15%;
  margin-bottom: 1rem;
  margin-left: 15%;
  list-style: none;
}

#flipcarousel .carousel-indicators .active {
  opacity: 1;
  border: 1px solid rgba(0, 0, 0, .5);
  background-color: rgba(255, 255, 255, 1.0) !important;
}

#flipcarousel .carousel-indicators [data-bs-target] {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: rgba(0, 0, 0, .25) !important;
  border: 1px solid rgba(0, 0, 0, .5);
  margin-right: 4px;
  margin-left: 4px;
}

#globalland .flip-card-back .flip-card-back-inner table { text-align: center; }
#globalland .flip-card-back .flip-card-back-inner table tr td:first-child { width: 60%; }

/* END FLIPING CARD */

/* ================ END GLOBAL LANDING ================ */


/* ================ HOME ================ */

.member-bg { height: auto; background-repeat: no-repeat !important; background-size: cover !important; }
.blackoverlay { box-shadow: inset 0 0 0 2000px rgba(0, 0, 0, 0.5) !important; }

#membersection h5  { font-weight: 400; }
#membersection h2, #membersection h4, #membersection h5 { padding-bottom: 0; margin-bottom: 0; }

#membersection .accordion-item { background-color: transparent; border: 0; }
#membersection .accordion-button { background-color: transparent; padding: 0; outline: none; box-shadow: none; }
#membersection .accordion-button::after { filter: invert(48%) sepia(57%) saturate(2932%) hue-rotate(134deg) brightness(90%) contrast(99%); }

#membersection .accordion-body { padding: 1rem 0 !important; font-size: 1rem; }

#membersection .accordion-button:not(.collapsed) {
  color: #0c63e4;
  background-color: transparent;
  box-shadow: inset 0 -1px 0 rgba(255,255,255,.125);
}

.smallnote { font-size: 14px !important; margin-bottom: 0; font-weight: 300; }
#membersection .accordion { margin: 1rem 0; }
#membersection .col-line { border-right: 1px solid rgba(255,255,255,.35); }

.card { border-radius: 1rem; }
.card.card-block { 
  background: #ffffff; border: 0; 
  box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.07);
  -webkit-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.07);
  -moz-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.07);  
}

.whiteoverlay { box-shadow: inset 0 0 0 2000px rgba(255, 255, 255, 0.7) !important; }

#membersection figure { margin: 0; }
#membersection .blockquote-footer { margin-bottom: 0; font-size: .75em; color: #ffffff; margin-top: 1rem; }

@media screen and (max-width: 991px) {
  #membersection .container { padding: 2rem; color: #ffffff; }
  #membersection .col-line-last { border-right: 0; }
  .cardshadow { padding: 0; }
}

@media screen and (min-width: 992px) {
  #membersection .container { padding-top: 4rem; padding-bottom: 4rem; color: #ffffff; }
  #membersection .col-line-last { border-right: 1px solid rgba(255,255,255,.35); }
  .cardshadow { 
    box-shadow: 0px 0px 20px 0px rgba(0,0,0,0..07);
    -webkit-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.07);
    -moz-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.07);
    padding: 3rem; border-radius: 1rem; 
  }
}


/* MASTHEAD CAROUSEL SLIDER */

.carousel-inner > .item {
  position: relative;
  display: none;
  -webkit-transition: 3s ease-in-out left;
  -moz-transition: 3s ease-in-out left;
  -o-transition: 3s ease-in-out left;
  transition: 3s ease-in-out left;
  transition-duration: 3s;
}

.carousel-indicators [data-bs-target] { width: 10px; height: 10px; border-radius: 50%; border: 1px solid transparent; margin-right: 4px; margin-left: 4px; }
.carousel-indicators li { background-color: #df064c; }
.carousel-control-next-icon, .carousel-control-prev-icon { width: 3rem; height: 3rem; }
.carousel-container-tx { height: 540px; margin-top: 10px; position: relative; }
.carousel-indicators .active { opacity: 1; border: 1px solid #fff!important; background-color: rgba(255, 255, 255, .5) !important; }


@media screen and (max-width: 991px) {
  .carousel-container-tx { height: auto; margin-top: 10px; position: relative; }
  .carousel-caption { text-align: left; right: 10%; left: 10%; bottom: 10%; }
  .carousel-control-next, .carousel-control-prev { width: 5%; bottom: 20%; top: auto; }
  .mastoverlay { box-shadow: inset 0 0 0 2000px rgba(0, 0, 0, 0.3) !important; }
  .fluid-bg { height: 460px; background-repeat: no-repeat !important; background-size: cover !important; }
}


@media screen and (min-width: 992px) {
  .carousel-caption { text-align: left; right: 0; left: 0; top: 0; }
  .carousel-control-next, .carousel-control-prev { width: 5%; top: 0;}
  .fluid-bg { height: 460px; background-repeat: no-repeat !important; background-size: cover !important; }
} 


/* END MASTHEAD CAROUSEL SLIDER */


/* ================ MY ACTIVITIES ================ */

#myactivities .container { padding: 4rem; }

@media screen and (max-width: 991px) {
  .activities-bg { height: 210px; background-repeat: no-repeat !important; background-size: cover !important; display: flex; align-items: center; text-align: center; }
}

@media screen and (min-width: 992px) {
  .activities-bg { height: 250px; background-repeat: no-repeat !important; background-size: cover !important; display: flex; align-items: center; text-align: center; }
}

.card.card-gradient { border: 0; color: #ffffff; padding: 2.5rem; border-radius: 1rem; }

@media screen and (min-width: 992px) and (max-width: 1199px) {
  .card.card-gradient { border: 0; color: #ffffff; padding: 2rem;  }
}

.card-gradient-btn { padding: 0; }
.card-gradient-body { padding: 0 0; }
.card-gradient-body .card-title { margin-bottom: 0; padding-bottom: 0; }

/* ================ END MY ACTIVITIES ================ */

/* ================ TAB ================ */

@media screen and (max-width: 991px) {
  #tabnav .nav-tabs-borderbottom991 { height: 1px; width: auto; position: absolute; background-color: #d3d3d3; top: 67px; }
  #proliantserver #tabnav .nav-justified .nav-item, #proliantserver #tabnav .nav-justified>.nav-link { flex-basis: auto; width: 100%; }
}

@media screen and (min-width: 992px) {
  #proliantserver #tabnav .nav-justified .nav-item, #proliantserver #tabnav .nav-justified>.nav-link { flex-basis: auto; }
}

#tabnav .nav-tabs-borderbottom { height: 1px; width: 100%; background-color: #d3d3d3;  }
#tabnav .nav-tabs .nav-link { border: 3px solid transparent; border-top-left-radius: 0; border-top-right-radius: 0; border-style: none; border-bottom: 3px solid transparent; }

#tabnav .nav-tabs .nav-link:hover {
  color: rgb(68, 68, 68);
  border-color: transparent; 
  border-radius: 0; font-weight: 500;
  border-bottom: 4px solid #ebebeb;
}

#tabnav .nav-tabs .nav-link:focus, #tabnav .nav-tabs .nav-link.active {
  color: rgb(68, 68, 68);
  border-color: transparent; 
  border-radius: 0; font-weight: 500;
  border-bottom: 4px solid #01A982;
}

#tabnav .nav-link {
  display: block;
  padding: .8rem 1.5rem;
  margin: 0 !important;
  color: rgb(68, 68, 68);
  text-decoration: none;
  transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .05s ease-in-out;
}

#tabnav .nav-tabs { border-bottom: 0; }
#tabnav .nav-tabs .nav-link { margin-bottom: 0; }
#tabnav .tab-content { padding: 2rem 0; }

#proliantserver #tabnav .nav-tabs .nav-link:hover, #proliantserver #tabnav .nav-tabs .nav-link:focus, #proliantserver #tabnav .nav-tabs .nav-link.active {
  font-weight: normal; }

/* ================ END TAB ================ */


/* ================ INCENTIVE ================ */

#incentive .accordion-button { 
  padding: 0; outline: #01A982; box-shadow: none; font-size: 18px; padding: 5px 10px; 
}
.accordion-button::after { filter: invert(48%) sepia(57%) saturate(2932%) hue-rotate(134deg) brightness(90%) contrast(99%); }
#incentive .accordion-button:not(.collapsed) { 
  color: rgb(68, 68, 68); padding: 5px 10px; 
  box-shadow: rgb(255, 255, 255) 0px 0px 2px 1px, rgb(1, 169, 130) 0px 0px 4px 1px;
  border-radius: 6px; background-color: transparent; 
}

#incentive .accordion-button:not(.collapsed)::after 
{ filter: invert(48%) sepia(57%) saturate(2932%) hue-rotate(134deg) brightness(90%) contrast(99%) }
#incentive .accordion-body { padding: .5rem; margin-bottom: 1.5rem }
#incentive h6 { font-weight: 500; }
#incentive .accordion-item { background-color: #fff; border: 0; }


@media screen and (min-width: 992px) {
  .accordion-expandtx { font-size: 16px; }
  .card-text { font-size: 18px; }
}


#incentive .card { border-radius: 0; }
#incentive .card-footer { padding: 0; background-color: transparent; border-top: 1px solid rgba(0,0,0,.125); }

.card-footer-smallnote { flex: 1 1 auto; padding: .4rem 1rem; font-size: 14px }
#incentive .progress { border-radius: 0; height: .7rem; font-size: .6rem; }

.progress-bar.progress-bar-green { background-color: #01A982; }
.progress-bar.progress-bar-yellow { background-color: #FEC901; }
.progress-bar.progress-bar-orange { background-color: #FF8300 }
.progress-bar.progress-bar-lightblue { background-color: #7FF9E2 }
.progress-bar.progress-bar-mediumblue { background-color: #32DAC8 }
.progress-bar.progress-bar-darkblue { background-color: #0D5265 }
.progress-bar.progress-bar-lightpurple { background-color: #C140FF }
.progress-bar.progress-bar-mediumpurple { background-color: #7630EA }
.progress-bar.progress-bar-red { background-color: #CA2B4E }

#incentive .flip-card { background-color: transparent; height: 100%; width: 100%; overflow: hidden; margin: 0; }
#incentive .flip-card-inner .flip-card-front img { width: 100%; }
#incentive .flip-card-front img { position: absolute; left: 50%; top: 0; transform: translate(-50%, 0); }

#incentive .flip-card-front .flip-card-front-inner { position: fixed; width: 100%; top: 54%; }
#incentive .flip-card-back .flip-card-back-inner { position: fixed; left: 50%; top: 0; transform: translate(-50%, 0); width: 100%; padding: 2rem; }
#incentive .flip-box { color: rgb(68, 68, 68); text-align: left; }
#incentive .flip-card-inner .flip-card-front img { width: 100%; height: 180px; object-fit: cover; }
#incentive .flip-card-inner{
  position: relative;
  text-align: center;
  min-height: 340px;
  height: 100%;
  transition: transform 0.6s;
  transform-style: preserve-3d;
}

.d-contents { display: contents; }

/* ================ END INCENTIVE ================ */


/* ================ START COMPANY MANAGEMENT CSS ================ */

@media (min-width: 1200px) {
  #companymanagement section .container { padding-top: 3rem; padding-bottom: 3rem }
}

.company-mng-position { background-position: center bottom !important; }
#companymanagement .percent { position: relative; text-align: center; }
#companymanagement .progress-bar-box svg { position: relative; width: 230px; height: 230px; transform: rotate(-90deg); }

#companymanagement .progress-bar-box svg circle {
  width: 100%; height: 100%;
  fill: none;
  stroke: #f0f0f0;
  stroke-width: 15;
  stroke-linecap: round;
}

#companymanagement .progress-bar-box svg circle:last-of-type {
  stroke-dasharray: 625px;
  stroke-dashoffset: calc(625px - (625px * var(--percent)) / 100);
  stroke: #3498db; 
}

#companymanagement .progress-bar-box .number-darkblue 
{ position: absolute; top: 43%; left: 50%; transform: translate(-50%, -50%); }
#companymanagement .progress-bar-box .number-mediumblue 
{ position: absolute; top: 43%; left: 50%; transform: translate(-50%, -50%); }
#companymanagement .progress-bar-box .number-mediumpurple 
{ position: absolute; top: 44%; left: 50%; transform: translate(-50%, -50%); }
#companymanagement .progress-bar-box .number-lightpurple 
{ position: absolute; top: 43%; left: 50%; transform: translate(-50%, -50%); }
#companymanagement .progress-bar-box .number-orange 
{ position: absolute; top: 43%; left: 50%; transform: translate(-50%, -50%); }
#companymanagement .progress-bar-box .number-yellow 
{ position: absolute; top: 43%; left: 50%; transform: translate(-50%, -50%); }

#companymanagement .progress-bar-box .number h3 { font-weight: 200; font-size: 2.5rem; color: #32dacb; }
#companymanagement .progress-bar-box .number h3 span { font-size: 2rem; }
#companymanagement .progress-bar-box .title h2 { margin: 25px 0 0; line-height: 22px; }
#companymanagement .progress-bar-box .title h2 span { font-size: 17px; }

#companymanagement .progress-bar-box-darkblue svg circle:last-of-type { stroke: #0D5265; }
#companymanagement .progress-bar-box .number-darkblue h3 { font-weight: 200; font-size: 2.5rem; color: #0D5265; }
#companymanagement .progress-bar-box-mediumblue svg circle:last-of-type { stroke: #32DAC8; }
#companymanagement .progress-bar-box .number-mediumblue h3 { font-weight: 200; font-size: 2.5rem; color: #32DAC8; }
#companymanagement .progress-bar-box-mediumpurple svg circle:last-of-type { stroke: #7630EA; }
#companymanagement .progress-bar-box .number-mediumpurple h3 { font-weight: 200; font-size: 2.5rem; color: #7630EA; }
#companymanagement .progress-bar-box-lightpurple svg circle:last-of-type { stroke: #C140FF; }
#companymanagement .progress-bar-box .number-lightpurple h3 { font-weight: 200; font-size: 2.5rem; color: #C140FF; }
#companymanagement .progress-bar-box-orange svg circle:last-of-type { stroke: #FF8300; }
#companymanagement .progress-bar-box .number-orange h3 { font-weight: 200; font-size: 2.5rem; color: #FF8300; }
#companymanagement .progress-bar-box-yellow svg circle:last-of-type { stroke: #FEC901; }
#companymanagement .progress-bar-box .number-yellow h3 { font-weight: 200; font-size: 2.5rem; color: #FEC901; }

.bonus-brd { border: 1px solid #ccc; width: 100%; padding: 20px 10px;  }
.bonus-brd h2 { line-height: 22px; }
.bonus-brd h2 span { font-size: 17px; }
.text-ttl-bouns { font-size: 50px; color: #c140ff; }
.prl-text { color: #7630ea; }

#companymanagementtable .table-fixed-column-outter { position: relative; margin: 2rem auto;  }
#companymanagementtable .table-fixed-column-inner { overflow-x: scroll; overflow-y: visible; margin-left: 450px; }
#companymanagementtable .table { margin-bottom: 0.25rem; }
#companymanagementtable .table.table-fixed-column { table-layout: fixed; width: 100% }
#companymanagementtable .table td, .table th { width: 150px; border: none; padding: 0.5rem 0.75rem; }
#companymanagementtable .table th:first-child,
#companymanagementtable .table tr td:first-child { position: absolute; left: 0; width: 300px; }
#companymanagementtable .table-bordered>:not(caption)>* { border-width: 0; }

.pagination { display: inline-block; float: right; padding: 20px 0 0 0; }
.pagination a {
  color: black;
  float: left;
  padding: 5px 12px;
  text-decoration: none;
  border: 1px solid #ddd;
}

.pagination a.active { background-color: #01A982; color: white; border: 1px solid #01A982; }
.pagination a:hover:not(.active) { background-color: #ddd; }
.pagination a:first-child { border-top-left-radius: 5px; border-bottom-left-radius: 5px; }
.pagination a:last-child { border-top-right-radius: 5px; border-bottom-right-radius: 5px; }

@media screen and (max-width:991px) {
  #companymanagementtable .table th:first-child,
  #companymanagementtable .table tr td:first-child { width: 200px; }
  #companymanagementtable .table th:nth-child(2),
  #companymanagementtable .table tr td:nth-child(2) { left: 200px; }
  #companymanagementtable .table-fixed-column-inner { margin-left: 350px; }
}

@media screen and (min-width:992px) {
  #companymanagementtable .table tr td:nth-child(2), #companymanagementtable .table th:nth-child(2),
  #companymanagementtable .table tr td:nth-child(2) { position: absolute; left: 300px; }
}

@media screen and (min-width:501px) {
  #companymanagementtable .table th:nth-child(2),
  #companymanagementtable .table tr td:nth-child(2) { position: absolute; }
}

@media screen and (max-width:500px) {
  #companymanagementtable .table-fixed-column-inner { margin-left: 300px; }
  #companymanagementtable .table th:nth-child(2),
  #companymanagementtable .table tr td:nth-child(2) { position: absolute; width: 100px;  }
}

.table>:not(caption)>*>* {
  padding: 0.5rem 0.75rem;
  background-color: var(--bs-table-bg);
  border-bottom-width: 1px;
  box-shadow: inset 0 0 0 9999px var(--bs-table-accent-bg);
}

/* ================ END COMPANY MANAGEMENT CSS ================ */


/* ================ MY CREDIT CARD CSS START HERE ================ */

.crdit-card-hd { font-weight: 400; }
.status-text { color: #01A982; font-weight: 700 }
#creditcard .percent { position: relative; text-align: center; }
#creditcard .progress-bar-box svg { position: relative; width: 210px; height: 210px; transform: rotate(-90deg); }

#creditcard .progress-bar-box svg circle { 
  width: 100%; height: 100%; fill: none; stroke: #f0f0f0; stroke-width: 10px; stroke-linecap: round; 
}
#creditcard .progress-bar-box svg circle:last-of-type { 
  stroke-dasharray: 625px; stroke-dashoffset: calc(625px - (625px * var(--percent)) / 100); stroke: #3498db; 
}

#creditcard .progress-bar-box .number { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); }
#creditcard .progress-bar-box .number h3, #creditcard .progress-bar-box .number2 h3 { font-weight: 400; font-size: 2.5rem;  }
#creditcard .progress-bar-box .number h3 span { font-size: 2rem; }
#creditcard .title h3 { font-size: 1.5rem; margin-bottom: 0; padding-bottom: 0; }
#creditcard .progress_lightblue svg circle:last-of-type { stroke: #32DAC8; }
#creditcard .progress_orange svg circle:last-of-type { stroke: #FF8300; }
#creditcard .progress_green svg circle:last-of-type { stroke: #01A982; }
#creditcard .progress_darkpurple svg circle:last-of-type { stroke: #7630EA; }
#creditcard .progress_lightpurple svg circle:last-of-type { stroke: #C140FF; }

#creditcard .bonus-brd { border: 1px solid #ccc; width: 100%; padding: 20px 10px; min-height: 280px; }
#creditcard .bonus-brd h2 { line-height: 22px; }

#creditcard .bar_lightblue_big svg { position: relative; width: 350px; height: 350px; transform: rotate(-90deg); }
#creditcard .bar_lightblue_big svg circle { width: 100%; height: 100%; fill: none; stroke: #f0f0f0; stroke-width: 14px; stroke-linecap: round; }
#creditcard .bar_lightblue_big:nth-child(1) svg circle:last-of-type { stroke: #7630ea; }
#creditcard .bar_lightblue_big .number { position: absolute; top: 45%;  }
#creditcard .bar_lightblue_big .number h3 { font-weight: 400; font-size: 3rem;  }

.bs-wizard { margin-top: 40px; }
.bs-wizard { border-bottom: solid 1px #e0e0e0; padding: 0 0 10px 0; }
.bs-wizard > .bs-wizard-step { padding: 0; position: relative; }

@media screen and (min-width:992px) {
  .bs-wizard > .bs-wizard-step .bs-wizard-stepnum { margin-top: 58px; margin-left: 65px; }
}

.bs-wizard > .bs-wizard-step .bs-wizard-info { color: #999; font-size: 14px; }
.bs-wizard > .bs-wizard-step > .bs-wizard-dot {
  position: absolute;
  width: 100px; height: 100px;
  display: block;
  background: #01A982;
  top: -15px;
  left: 50%;
  margin-top: -15px;
  margin-left: -15px;
  border-radius: 50%;
}
.bs-wizard > .bs-wizard-step > .progress {
  background-color: #7f8285;
  position: relative;
  border-radius: 0px;
  height: 3px;
  box-shadow: none;
  margin: 20px 0;
}
.bs-wizard > .bs-wizard-step > .progress > .progress-bar { width:0px; box-shadow: none; background: #01A982; }
.bs-wizard > .bs-wizard-step.complete > .progress > .progress-bar {width:100%;}
.bs-wizard > .bs-wizard-step.active > .progress > .progress-bar {width:50%;}
.bs-wizard > .bs-wizard-step:first-child.active > .progress > .progress-bar {width:0%;}
.bs-wizard > .bs-wizard-step:last-child.active > .progress > .progress-bar {width: 100%;}
.bs-wizard > .bs-wizard-step.disabled > .bs-wizard-dot {background-color: #7f8285;}
.bs-wizard > .bs-wizard-step.disabled > .bs-wizard-dot:after {opacity: 0;}
.bs-wizard > .bs-wizard-step:first-child  > .progress {left: 50%; width: 50%;}
.bs-wizard > .bs-wizard-step:last-child  > .progress {width: 50%;}
.bs-wizard > .bs-wizard-step.disabled a.bs-wizard-dot{ pointer-events: none; }

a.bs-wizard-dot img { 
  width: 45px;
  margin: auto;
  height: 45px;
  filter: invert(1);
  position: relative;
  display: flex;
  top: 28%;
}

.text-center.bs-wizard-stepnum.text-active { color: #01A982; }


@media screen and (max-width:599px) {
  .bs-wizard > .bs-wizard-step .bs-wizard-stepnum { font-size: 14px; padding: 0 .5rem; width: 100%; margin-top: 2.5rem; }
}

@media screen and (min-width:600px) and (max-width:991px) {
  .bs-wizard > .bs-wizard-step .bs-wizard-stepnum { font-size: 14px; padding: 0 .5rem; width: 83%; margin-top: 2.5rem; }
}

@media screen and (max-width:991px) {

  .bs-wizard > .bs-wizard-step > .bs-wizard-dot {
    position: absolute;
    width: 70px;
    height: 70px;
    display: block;
    background: #01A982;
    top: -15px;
    left: 50%;
    margin-top: -15px;
    margin-left: -15px;
    border-radius: 50%;
  }

  a.bs-wizard-dot img {
    width: 25px;
    margin: auto;
    height: 25px;
    filter: invert(1);
    position: relative;
    display: flex;
    top: 28%;
  }

  .bs-wizard > .bs-wizard-step > .progress {
    background-color: #7f8285;
    position: relative;
    border-radius: 0px;
    height: 3px;
    box-shadow: none;
    margin: 5px 0;
  }

  .bs-wizard > .bs-wizard-step > .bs-wizard-dot { left: 32%; }
}

/* ================ END MY CREDIT CARD ================ */


/* ================ PROLIANT SERVER ================ */

@media screen and (min-width: 992px) {
  .fluid-bg2 {
    height: 420px; width: 100%;
    background-repeat: no-repeat !important;
    background-size: cover !important;
    object-fit: cover;
  }
}


@media screen and (max-width: 991px) {
  .fluid-bg2 { height: 520px; background-repeat: no-repeat !important; background-size: cover !important; }
  .productimg { margin-top: 3.5rem; }
} 

.fluid-bg2-text { height: 420px; }

#proliantserver .card-body { flex: 1 1 auto; padding: 1rem 0; min-height: 30vh; }

.overflow-ellipsis {
 display: -webkit-box; 
 -webkit-box-orient: vertical; 
 -webkit-line-clamp: 5; 
 overflow: hidden; 
 text-overflow: ellipsis; 
}

.cardpad { padding: 2rem; }

#proliantserver .card-owl3-item {
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  word-wrap: break-word;
  background-color: #fff;
  background-clip: border-box;
  border: 1px solid rgba(0,0,0,.125);
  border-radius: 15px;
}

#proliantserver .card-footer { background-color: transparent; border-top: 0; padding: 0;  }
#proliantserver .owl3-item { transition: .2s all ease-in-out; cursor: pointer; }
.owl3-item img { height: 100px; object-fit: contain; margin: 2rem 0; }

#proliantserver .smallnote { font-size: 16px !important; margin-bottom: 1rem; color: #9d9d9d; }
#proliantserver h5 { margin-bottom: 0; padding-bottom: 0; }


/* ================ END PROLIANT SERVER ================ */


.bgimageposition { background-position: top right !important; }
.carouselcontentshadow { text-shadow: 0 0 5px rgba(0, 0, 0, 0.2); }
.carouselcontentblack { color: #000; }
#carousellogo td { padding: 0; }
.carousel-dual-logo { width: 1px; height: 100%; background-color: #ffffff; }
.mastoverlay2 { box-shadow: inset 0 0 0 2000px rgba(0, 0, 0, 0.3) !important; }

.tncmodal .modal-header, .modal-header {
  background-color: #01a982;
  color: #fff;
  border-radius: .3rem .3rem 0 0;
  font-weight: 900 !important;
}

.tncmodal .modal-footer { display: block !important; }
.tncmodal .modal-footer p { font-size: 75%; }

.tncmodal .modal-dialog { overflow-y: initial !important }
.tncmodal .modal-body { min-height: 40vh; overflow-y: auto; }
.tncmodal .modal-body ol, .tncmodal .modal-body ul { padding-left: 25px; font-weight: 200 !important; }

#tnccontent ul li { list-style: disc !important; }
.tnc-tb, .tnc-tb2 { margin: 1em .5em; width: 100%; }
.tnc-tb3, .tnc-tb3 th { margin: 1em 0; width: 100%; width: 200px; }

.tncmodal ul { padding-left: 2rem; }

.tnc-tb th, .tnc-tb2 th {
  border-bottom: 3px solid #01a982;
  border-top: none !important;
  padding: 0.5em;  font-size: 1rem;
  text-transform: uppercase;
  font-weight: 500 !important;
  color: #444;
}

.tnc-tb td, .tnc-tb2 td { padding: 0.5em; font-size: 1rem; }
.tnc-tb tr:nth-child(even) { background-color: #f5f5f5; }
.tnc-tb2 tr:nth-child(even) { background-color: #ffffff; }

button:disabled, button[disabled] { pointer-events: none; }

#tncpop h6 { padding-top: 1rem; font-weight: 500; font-size: 1.1rem; }
#tncpop ol { list-style-type: decimal; }
#tncpop ol li, #tncpop ul li { padding-left: .5rem; padding-bottom: .5rem;}
#tncpop { font-size: 0.9em; }

@media screen and (min-width: 992px) {
  .promo-illustrate img { width: 60%; padding-top: 3rem; }
  .greenborderbox { border: 3px solid #01a982; padding: 3rem; border-radius: 1rem; margin: 15px 0; }
  .promo-icon img { width: 20%; padding-bottom: 2rem; }
}

@media screen and (max-width: 991px) {
  .promo-illustrate img { width: 100%; padding-top: 3rem; }
  .greenborderbox { border: 3px solid #01a982; padding: 1.5rem; border-radius: 1rem; margin: 15px 0; }
  .promo-icon img { width: 60%; }
}

#incentive .progress2 { border-radius: 0; height: 1.5rem; font-size: .8rem; }
#incentive .progress3 { border-radius: 0; height: 1.2rem; font-size: .8rem; }

.tx-tnc { font-size: 1rem; }
.tx-tnc ol li { list-style-type: decimal !important; margin-left: -1rem !important; padding-bottom: .3rem;}
ul.tx-tnc-disc li { list-style-type: disc !important; padding-bottom: .3rem;}
ul.tx-tnc-disc li > ul li { list-style-type: circle !important; padding-bottom: .3rem;}

.fix-wrapper { overflow-x: auto; width: 100%; }
.fixtable {
  table-layout: fixed; 
  width: 100%;
  border-collapse: collapse;
  background: white;
}

.fixtable tr { border-bottom: 1px solid #ccc; }
.fixtable td, .fixtable th {
  vertical-align: top;
  text-align: left;
  width:100px;
  padding: 12px;
}
.fix { position: sticky !important; background: white !important; }
.fix:first-child {
  left:0 !important;
  width:200px !important;
  z-index: 99;
  background: #fff !important;  
}
.fix:nth-child(2) {
  left: 200px !important;
  z-index: 99;
  width: 150px !important;
  background: #fff !important;
}
.fix:nth-child(3) {
  left:350px !important;
  z-index: 99;  
  background: #fff !important;  
}

ul.check_list { padding-left: 5px; }
ul.check_list > li { display: flex; padding-bottom: 1rem; }
ul.check_list > li > span { display: contents; }
ul.check_list > li::before { font-family: 'hpe-icons' !important; display: table-cell; content: "\ecac"; color: #01a982; padding-right: 0.75em; }
ul.check_list > li { padding-bottom: 1rem; }
.nav-tabs .nav-link.active { background-color: transparent;}

hr.greenline { background-color: #01a982; height: 2px; width: 100%; opacity: 1; margin-bottom: 2rem; }


@media screen and (max-width: 991px) {
  .mobile-banner-intel { background: url('../images/stockimages/banner-intel-landscape.jpg');}
  .mastoverlay3 { box-shadow: inset 0 0 0 2000px rgba(0, 0, 0, 0.3) !important; }
}

@media screen and (min-width: 992px) {
  .mobile-banner-intel { background: url('../images/stockimages/banner-intel.jpg');}
}

.mobile-banner-HPETopAchieversClub { background: url('../images/stockimages/HPETopAchieversClub.jpg');}

.modal-header { border-bottom: none; }
.modaluili ul li { padding-bottom: 1rem; }


/*++++++ SBP Incentive **++++++*/

.sbp_container { position: relative; }

table.sbp_tb tr td {
  border-top-style: dashed;
  border-top-width: 3px;
  border-top-color: #0D5265;
  vertical-align: top;
  width: 24%;
  padding-left: 0;
  display: inline-block;
}

@media screen and (min-width: 591px) and (max-width: 992px) {
  .sbp_step_box { position: relative; margin-top: -22px; }
}

@media screen and (min-width: 993px) {
  .sbp_step_box { position: relative; margin-top: -12px; }
}

.sbp_header_no {
  background: #7FF9E2;
  align-items: center;
  display: inline-grid;
  vertical-align: top;
  border-radius: 50px;
  width: 40px;
  height: 40px;
  text-align: center;
  font-weight: 600;
  color: #000;
  margin-right: 0.5em;
  margin-top: -10px;
}

.sbp_header_title {
  display: inline-block;
  font-weight: 600;
  margin-top: -7px;
  width: auto;
  padding: .3em 0.75em;
  vertical-align: top;
  background: #fff;
  border: 2px solid #0D5265;
}

.sbp_image,
.sbp_list { margin: 0 1em; }
.sbp_list ul.promolist { padding-left: 30px; }
.sbp_list ul.promolist .icon { left: 20px !important; }


@media screen and (min-width: 1251px) {
  .sbp_tb td:nth-child(4) {
    border-right-style: dashed;
    border-right-width: 3px;
    border-right-color: #0D5265;
    padding-bottom: 6.5em;
  }
  .sbp_tb td:nth-child(5) { float: right; margin-right: 4%; }
  .sbp_tb td:nth-child(6) { float: right; }
  .sbp_tb td:nth-child(7) { float: right; }
  .sbp_tb td:nth-child(8) { float: right;
  }

}


@media screen and (min-width: 791px) and (max-width: 1250px) {
  table.sbp_tb tr td { width: 33%; }
  .sbp_tb td:nth-child(3) {
    border-right-style: dashed;
    border-right-width: 3px;
    border-right-color: #0D5265;
    padding-bottom: 6em;
  }
  
  .sbp_tb td:nth-child(4) { float: right; margin-right: 1%; }
  .sbp_tb td:nth-child(5) { float: right; }
  .sbp_tb td:nth-child(6) {
    float: right;
    border-left-style: dashed;
    border-left-width: 3px;
    border-left-color: #0D5265;
    padding-bottom: 10em;
  }
}


@media screen and (min-width: 590px) and (max-width: 790px) {
  table.sbp_tb tr td { width: 49%; }
  
  .sbp_tb td:nth-child(2) {
    border-right-style: dashed;
    border-right-width: 3px;
    border-right-color: #0D5265;
    padding-bottom: 6em;
  }
  
  .sbp_tb td:nth-child(3) { float: right; margin-right: 2%; }
  .sbp_tb td:nth-child(4) {
    border-left-style: dashed;
    border-left-width: 3px;
    border-left-color: #0D5265;
    padding-bottom: 5em;  
  }

  .sbp_tb td:nth-child(5) 
  { float: right; margin-right: 2%;  border-right-style: dashed; border-right-width: 3px; margin-top: -10px; padding-bottom: 4em; border-right-color: #0D5265;}
  .sbp_tb td:nth-child(6) { padding-bottom: 5em;}
  .sbp_tb td:nth-child(7) { float: right; margin-right: 2%; }
  .sbp_tb td:nth-child(8) { float: right; }
}


@media screen and (max-width: 590px) {
  table.sbp_tb tr td { width: 90%; }

  .sbp_tb td {
    border-top: 0 !important;
    border-left-style: dashed;
    border-left-width: 3px;
    border-left-color: #0D5265;
    margin-left: 25px;
  }

  .sbp_step_box { margin-left: -22px; }
  .sbp_image, .sbp_list { padding-left: 50px; }
  .sbp_list ul.promolist .icon { left: 65px !important; }

  .sbp_tb td:last-child {
    border-top: 0 !important;
    border-left-style: dashed;
    border-left-width: 3px;
    border-left-color: white;
    margin-left: 25px;
  }
  table.sbp_tb tr td { padding-bottom: 4em; }
}


@media screen and (min-width: 591px) and (max-width: 992px) {
  .sbp_header_title {
    display: inline-block;
    font-weight: 600;
    margin-top: 2px;
    width: auto;
    padding: .3em 0.75em;
    vertical-align: top;
    background: #fff;
    border: 2px solid #0D5265;
  }
  .sbp_header_no {
    background: #7FF9E2;
    align-items: center;
    display: inline-grid;
    vertical-align: top;
    border-radius: 50px;
    width: 40px;
    height: 40px;
    text-align: center;
    font-weight: 600;
    color: #000;
    margin-right: 0.5em;
    margin-top: 0;
  }

  .sbp_tb td:nth-child(3) { padding-bottom: 7.5em; }
}

/**++++++++++* END SBP Incentive *++++++++++*/


.d-contents { display: contents; }
#incentive2 #accordion { 
  color: rgb(68, 68, 68); padding: 5px 10px; 
  box-shadow: none; outline: none; appearance: none;
  border-radius: none; background-color: transparent; 
}

#incentive2  button:focus { outline: none !important; outline-width: 0 !important; box-shadow: none; -moz-box-shadow: none; -webkit-box-shadow: none; }
#incentive2 .accordion-header { margin-bottom: 0; padding-bottom: 0; }
#incentive2 .accordion-body { border: 0; border-radius: 0; background-color: #F9F9F9; padding: 1rem 1.25rem; }
#incentive2 .accordion-button:not(.collapsed) { box-shadow: none; background-color: #F9F9F9; color: inherit; }
#incentive2 .accordion-item { border: none; margin-bottom: 1rem; }
#incentive2 .accordion-button { background-color: #F9F9F9; }

.flex-column-reverse { display: flex; flex-flow: column-reverse; }
.big { font-size: 2.5rem; }
.btn2 { border-top-right-radius: 0.25rem !important; border-bottom-right-radius: 0.25rem !important; }

.datepicker td, .datepicker th { width: auto; text-align: center; padding: .5rem 1rem; }
.dropdown-menu { border: 2px solid #01A982; } 
.month { padding: 0.3rem; font-size: 14px; }

.briefpara { font-size: 22px; }
.SBP-statustitle { font-size: 20px; color: #c140ff; }
.SBP-card-achievement { border: 1px solid #ccc; padding: 1.5rem; }
.SBP-card-achievement-noborder { border: 0; padding: 1.5rem; }
.SBP-cardfooter { background: transparent; border: 0; padding: 0; }
.noborder { border: 0; }


/* PBM */

#searchbox .container { text-align: left; }
.searchbanner {
  background: url('../images/prelogin/hpe_intro_bg.png');
  background-position: center top;
  background-size: cover;
  min-height: 340px;
  justify-content: center;
  display: flex;
  align-items: center;
}

@media screen and (min-width: 992px) {
  .searchbox { 
    background: rgba(244, 244, 244, 0.5);
    border-radius: 12px;
    padding: 30px 40px 40px 40px;
    color: #000;
    text-align: left; z-index: -1;
  }
}

@media screen and (max-width: 991px) {
  .searchbox { 
    background: rgba(244, 244, 244, 0.5);
    border-radius: 12px;
    padding: 1rem 2rem;
    color: #000;
    text-align: left; z-index: -1;
  }
}

#searchbox input { border: 1px solid #dedede; padding: .75em; background-color: #ffffff; }
#searchbox section { margin: 4rem 0;padding: 0; }
#searchbox h2, #searchbox h3, #searchbox h4, #searchbox h5 { padding-bottom: 1rem; }
.searchboxtx { color: #000000; width: 100%; }

.newboxshadow { 
  box-shadow: 0px 4px 7px rgba(0,0,0,0.2);
  -webkit-box-shadow: 0px 4px 7px rgba(0,0,0,0.2);
  -moz-box-shadow: 0px 4px 7px rgba(0,0,0,0.2); 
}
#newspinner h2,#newspinner h3,#newspinner h4, #newspinner h5 { padding-bottom: 0; font-weight: normal !important; margin-bottom: 0; }

#newspinner .boxshadow { 
  border-radius: 12px; 
  box-shadow: 0px 4px 7px rgba(0,0,0,0.2);
  -webkit-box-shadow: 0px 4px 7px rgba(0,0,0,0.2);
  -moz-box-shadow: 0px 4px 7px rgba(0,0,0,0.2); }

  .progress { height: 1.2rem; }
  .progressbar-radius { border-radius: 50px !important; }
  .bar-red { background-color: #e25141; }
  .bar-mediumblue { background-color: #32DAC8; }
  .bar-yellow { background-color: #FEC901; }
  .bar-point { font-size: .9rem; }

  .circleredtx { font-size: 1.2rem; color: #e25141; }
  .circlepointtx { font-size: 2rem;  }

  .boxshadowmargin { margin: 1.5rem 0; }
  .barpointer { position: absolute; text-align: right; color: #01A982; font-size: .8rem; margin-left: -0.5rem; margin-top: -1rem;}
  .barpointerline { position: absolute; border-right: 2px dotted #01A982; height: 8px; margin-top: -1.7rem; }
  .progress { margin-bottom: 0; }

  @media only screen and (max-width:991px) {
    #newspinner .boxshadow { padding: 2rem 1rem;  }
    .boxheader-block { text-align: center; }
    .marginspace { margin: 1rem; }
    .mobilemt { margin-bottom: 3rem; }
    .mobilemt-empty { margin-bottom: 1rem; }
  }


  @media only screen and (min-width:992px) {
    #newspinner .boxshadow { padding: 2.5rem;  }
    .boxheader-block { text-align: left; }
    .marginspace { margin: 0 0 1rem; }
  }


  @media only screen and (min-width:992px) {
    .PBMhchart { height: 85%; }
  }

/* END PBM */


/* PBM Business Review */

.partner-banner { position: relative; width: 100%; }
.partner-banner img { max-width: 100%; width: 100%; height: 600px; }
.banner-caption {
  position: absolute;
  left: 33%;
  top: 60%;
  font-size: 60px;
  font-weight: bold;
  text-align: center;
  max-width: 500px;
  right: 0;
}
canvas#chart { padding: 1rem; }
.bggraph { border: 5px solid #3ccfcb; border-radius: 20px; }
.review-text h4 { font-weight: bold !important; font-size: 35px; }
.review-text {
  padding: 1.7rem;
  color: #fff;
  position: relative;
  margin: 0 0 18px;
  width: 100%;
  min-height: 125px;
}
.review-text p {
  font-size: 22px;
  font-weight: 500;
} 
.or-card .or-link {
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 1;
}
.or-card .or-content { flex: 1 0 auto; }
.or-card .or-description { margin-top: 15px; }
.or-card .or-background-overlay {
  border-radius: 12px;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: -1;
}
.select-wrapper.padqtr select {
  border: 1px solid #dedede !important;
  padding: 0.5em 1em 0.5em !important;
  border-radius: 10px !important;
} 
.about-sales-box{
  width:100%;
  float: left;
  background: #f5f5f5;
  padding: 40px;
  border-radius: 10px;
} 
.about-sales-box-main{
  display: grid;
  box-sizing: border-box;
  grid-template-columns: repeat(auto-fill, minmax(min(30%, 100%), 1fr));
  gap: 48px;
}

.about-sales-box-col-1{
  display: flex;
  box-sizing: border-box;
  max-width: 100%;
  align-items:center;
  background-color:#fff;
  color: rgb(111, 111, 111);
  min-width: 0px;
  min-height: 0px;
  flex-direction: column;
  width: 100%;
  padding: 25px;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: rgba(0, 0, 0, 0.12) 0px 6px 12px;
  cursor: pointer;
  transition: all 0.3s ease-in-out 0s;  
}
.about-sales-box-col-1 p { font-size: 22px; color: #000; font-weight: 400; }
.about-sales-box-col-1 p span { font-weight: 600; }
.chart-container { width: 100%; height: 100%; margin: auto; border-radius: 20px; }

@media (max-width:1230px) {
  .col-12.col-md-9.graph { max-width: 100%; flex: 100%; }
  #selectBox .cs-select > span { width: 100%; }
  #selectBox .cs-skin-elastic .cs-options { max-width: 100%; }
  #selectBox .cs-skin-elastic .cs-options span:hover,
  #selectBox .cs-skin-elastic .cs-options li.cs-focus span,
  #selectBox .cs-skin-elastic .cs-options .cs-selected span { width: 100%; }

  section#selectBox { padding: 1em 0; }
  .review-text { margin: 10px 0; }
  .col-12.col-md-3.review-mobile-view { max-width: 100%; flex: 100%; }
  .col-12.col-md-2.review-mobile-view { max-width: 100%; flex: 100%; }
  .about-sales-box-main{grid-template-columns: none;}  
  .or-card.text-center.review-text {width: 100%;} 
  .banner-caption { left: 27%; top: 58%; font-size: 42px; }
  .partner-banner img { height: auto; }
} 

@media (max-width: 1000px) {
  .col-12.col-md-9.graph { max-width: 100%; flex: 100%; }
  .col-12.col-md-3.review-mobile-view { max-width: 100%; flex: 100%; }
  .col-12.col-md-2.review-mobile-view { max-width: 100%; flex: 100%; }
  .banner-caption { left: 21%; top: 60%; font-size: 40px; }
}

@media (max-width: 599px) {
  .banner-caption {
    left: 0;
    top: 60%;margin-top: 1rem;
    font-size: 30px;
  }
} 

@media (min-width: 600px) {
  .banner-caption {
    top: 60%;margin-top: 1rem;
    font-size: 50px;
  }
} 

.boxheader-block .card { border: none; }
.or-description p, .about-sales-box-col-1 p { margin-bottom: 0; }

/* END PBM Business Review */


.stat-square { height: 20px; width: 20px; float: left; margin-right: 0.5em; }


/* ---------------- Support-About Program ----------------*/

#good-to-know i{font-size: 1.4em;}
#good-to-know {background-color: #f4f4f4;}
#about_sect .col-lg-5, #about_ect .col-lg-7 { padding:0; }

@media only screen and (max-width: 991px){
  .line-in-middle {height:30px;background: linear-gradient(to right, transparent 0%, transparent calc(50% - 3px), black calc(50% - 3px), black calc(50% + 3px), transparent calc(50% + 3px), transparent 100%); }
}

@media only screen and (min-width: 992px) {
  .line-in-middle { height:30px; }
}

#desc_sect .accordion-item { background-color: #fff; border: none; }
#desc_sect .accordion_item_green { border: 3px solid #01a982; }
#desc_sect .accordion_item_lightgreen { border: 3px solid #32DAC8; }
#desc_sect .accordion_item_purple { border: 3px solid #7630EA; }
#desc_sect .accordion_item_orange { border: 3px solid #FF8300; }
#desc_sect .accordion_item_yellow { border: 3px solid #FEC901; }

#desc_sect .accordion-button, #desc_sect .accordion-button:not(.collapsed) {
  color: #000; font-weight: 500; font-size: 1.2rem;
  background-color: transparent;
  box-shadow: none; outline: none;
}

#desc_sect .accordion-item h2.accordion-header, #desc_sect h4 { padding-bottom: 0; margin-bottom: 0; }
.desc_title {
  width: 250px;
  padding: 1em;
  text-align: center;
  border-style: solid;
  border-width: 3px;
  margin: 1.5em 1em 1.5em 0;
}

#desc_sect .accordion-body p:last-child { margin-bottom: 0; }

/* ---------------- END Support-About Program ----------------*/


/* ---------------- Multi step form ----------------*/

@media only screen and (min-width:992px) {
  #multi-step-form-container { margin-top: 3rem; }
}

@media only screen and (max-width:991px) {
  #multi-step-form-container { margin-top: 0; padding: 3rem; }
}

ul.form-stepper { counter-reset: div; margin-bottom: 3rem; }
ul.form-stepper .form-stepper-circle { position: relative; }

ul.form-stepper .form-stepper-circle span {
  position: absolute;
  top: 50%;
  left: 50%;
  color: #fff;
  transform: translateY(-50%) translateX(-50%);
}

.form-stepper-horizontal { position: relative; }

ul.form-stepper > li { list-style: none; }
ul.form-stepper li a .form-stepper-circle {
  display: inline-block;
  width: 40px;
  height: 40px;
  margin-right: 0;
  line-height: 1.7rem;
  text-align: center;
  background: rgba(0, 0, 0, 0.38);
  border-radius: 50%;
}

.form-stepper .form-stepper-active .form-stepper-circle { background-color: #01A982 !important; color: #fff; }
.form-stepper .form-stepper-active .label { color: #01A982 !important; }
.form-stepper .form-stepper-active .form-stepper-circle:hover { background-color: #01A982 !important; color: #fff !important; cursor: pointer; }
.form-stepper .form-stepper-unfinished .form-stepper-circle { background-color: #32DAC8; color: #000 !important; }
.form-stepper .form-stepper-completed .form-stepper-circle { background-color: #01A982 !important; color: #fff; }
.form-stepper .form-stepper-completed .label { color: #01A982 !important; }
.form-stepper .form-stepper-completed .form-stepper-circle:hover { background-color: #0e9594 !important; color: #01A982 !important; cursor: pointer; }
.form-stepper .form-stepper-active span.text-muted { color: #000 !important; }
.form-stepper .form-stepper-completed span.text-muted { color: #fff !important; }
.form-stepper .label { font-size: 1rem; margin-top: 0.5rem; }

button { cursor: pointer; }

/* ---------------- END Multi step form ----------------*/


@media screen and (max-width: 991px) {
  #PartnerGrowthIncentive .partnergrowth_box_radius { border: 3px solid #000; padding: 1.5rem; border-radius: 15px; z-index: 3; position: relative; background-color: #fff; align-items: center; display: grid; }
  #PartnerGrowthIncentive .dotted_line_vertical_mobile:after { content: ""; position: absolute; left: 50%; border-left: 3px dotted #0d5265; height: 41.5%; top: 31%; }
}

@media screen and (min-width: 992px) {
  .carousel-container-middle { height: 420px; }
  h2.masthead_H1B { font-size: 40px;  }
  #PartnerGrowthIncentive .partnergrowth_box_radius { border: 3px solid #000; padding: 1.5rem; border-radius: 15px; z-index: 3; position: relative; background-color: #fff; min-height: 140px; align-items: center; display: grid; }
}

.bgimageposition2 { background-position: center right !important; }
.mobile-banner-microsoft_intel { background: url('../images/stockimages/AdobeStock_178278585_1600_0_72_RGB.jpg');}

#PartnerGrowthIncentive .dotted_line_horizontal { border: none; border-top: 3px dotted #0d5265; height: 3px; }
#PartnerGrowthIncentive .dotted_line_vertical 
{ border-right: 3px dotted #0d5265; height: 50px; left: -50%;
  position: relative; 
}

#PartnerGrowthIncentive .dotted_line_horizontal2:after { content: ""; position: absolute; left: 37.8%; border-bottom: 3px dotted #0d5265; width: 24.2%; }
#PartnerGrowthIncentive .dotted_line_vertical_left:after { content: ""; position: absolute; left: 37.8%; border-left: 3px dotted #0d5265; height: 25px; bottom: auto; }
#PartnerGrowthIncentive .dotted_line_vertical_right:after { content: ""; position: absolute; right: 38%; border-left: 3px dotted #0d5265; height: 25px; bottom: 37%; }

#PartnerGrowthIncentive .partnergrowth_box_radius_blue { border-color: #00DEC8; }
#PartnerGrowthIncentive .partnergrowth_box_radius_lightblue { border-color: #1EB0D2; }
#PartnerGrowthIncentive .partnergrowth_box_radius_purple { border-color: #6F37ED; }
#PartnerGrowthIncentive .partnergrowth_box_radius_dimblue { border-color: #3490D9; }

@media screen and (min-width: 992px) and (max-width: 1199px) {
  #PartnerGrowthIncentive .dotted_line_vertical_left:after { content: ""; position: absolute; left: 37.8%; border-left: 3px dotted #0d5265; height: 25px; bottom: 35%; }
  #PartnerGrowthIncentive .dotted_line_vertical_right:after { content: ""; position: absolute; right: 38%; border-left: 3px dotted #0d5265; height: 25px; bottom: 40%; }
}

.margin-left-point5 { margin-left: .5rem; }
.margin-right-point5 { margin-right: .5rem; }
.margintb-1 { margin: 1rem 0; }
.margintb-half { margin: .5rem 0; }

.mobile-banner-HPETopAchieversClub2 { background: url('../images/stockimages/GettyImages-1087517562_1600_0_72_RGB.jpg');}

@media screen and (max-width: 767px) {
  .xs_marginbottom_1rem { margin-bottom: 1rem; }
  .xs_marginbottom_2rem { margin-bottom: 2rem; }
  .xs_margintop_2rem { margin-top: 2rem; }
  .xs_margintop_3rem { margin-top: 3rem; }
  .xs_margintop_point5rem { margin-top: .5rem; }
  .xs_margintop_1rem { margin-top: 1rem !important; }
  .xs_tx_center { text-align: center !important; }
  .xs_mb_0 { margin-bottom: 0 !important; }
  .xs_pb_0 { padding-bottom: 0 !important; }
}

@media screen and (max-width: 991px) {
  .md_margintop_1rem { margin-top: 1rem !important; }
  .md_margintop_2rem { margin-top: 2rem !important; }
  .md_tx_center { text-align: center !important; }
  .md_marginbottom_1rem { margin-bottom: 1rem; }
  .md_my_3rem { margin: 3rem 0; }
}

.tx_purple { color: #7630EA !important; }
.tx_lightblue { color: #1EB0D2 !important; }
.tx_dimblue { color: #3490D9 !important; }
.tx_red { color: #ed0000; }

.tx_darkblue { color: #0D5265 }
.tx_mediumblue { color: #32DAC8 }
.tx_lightblue2 { color: #7FF9E2 }
.tx_lightpurple { color: #C140FF }

/*---------------- Bali ----------------*/

@media (max-width: 991px) {
  .imgsuitcase_mobile { margin-right: 1rem; }
}

@media (min-width: 992px) {
  .imgsuitcase_mobile { margin-right: 5rem; }
}

#tacBali .imgbali { background: url('../images/stockimages/TAC_bali.jpg'); background-size: cover; background-position: top; background-repeat: no-repeat; height: 850px; }
#tacBali .imgcirclepic { height: 75%;  z-index: 1; }
#tacBali .shapebubble {     
  height: 42%;
  position: absolute;
  justify-content: space-around;
  background: url('../images/stockimages/TAC_bali_bubble.svg');
  background-repeat: no-repeat;
  left: 22%;
}
#tacBali .shapeheader { position: relative; width: 35%; padding: 4.5rem; left: 0; }
#tacBali .balifooter { background-color: #01A982; padding: 4rem; color: #fff; z-index: -5; position: relative;}

#tacBali ul { padding-left: 0; }
#tacBali ul li { content:''; background-image: url('../images/icon/ico_square.svg'); background-repeat: no-repeat; padding-left: 2rem; background-size: 16px; font-size: 88%; padding-bottom: .8rem;background-position-y: 4px; }

.tx_lightblue_how { color: #7FF9E2 }
.margin-right-5rem { margin-right: 5rem; }
.gradient_bali { background: linear-gradient(45deg, #007cb0, #04c052); z-index: -3; position: relative; }

#tacBali .imgbali2 { background: url('../images/stockimages/TAC_bali.jpg'); background-position: top; background-repeat: no-repeat; height: 850px; z-index: -2; position: relative; }

@media screen and (max-width: 576px) {
  #tacBali .imgcirclepic2 { height: 310px;  z-index: 1; }
  #tacBali .shapebubble2 {     
    height: 800px;
    position: absolute;
    justify-content: space-around;
    background: url('../images/stockimages/TAC_bali_bubble_mobile.svg');
    background-repeat: no-repeat;
    left: 11%; top: -18%; z-index: -1;
  }
  #tacBali .shapeheader2 { position: relative; width: 66%; padding: 1rem; left: 10px; bottom: -60%; }
  #tacBali .ticket_suitcase { bottom: 3%; position: absolute; }
  .h1, h1 { font-size: calc(1.375rem + 2.2vw); }
}

@media screen and (min-width: 577px) and (max-width: 767px)  {
  #tacBali .imgcirclepic2 { height: 310px;  z-index: 1; }
  #tacBali .shapebubble2 {     
    height: 1100px;
    position: absolute;
    justify-content: space-around;
    background: url('../images/stockimages/TAC_bali_bubble_mobile.svg');
    background-repeat: no-repeat;
    left: 11%; top: -62%; z-index: -1;
  }
  #tacBali .shapeheader2 { position: relative; width: 50%; padding: 1rem; left: 10px; bottom: -56%; }
  #tacBali .ticket_suitcase { bottom: 3%; position: absolute; width: 80%; left: 9%; }
  .h1, h1 { font-size: calc(1.375rem + 2.5vw); }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  #tacBali .imgcirclepic2 { height: 550px;  z-index: 1; }
  #tacBali .shapebubble2 {     
    height: 1300px;
    position: absolute;
    justify-content: space-around;
    background: url('../images/stockimages/TAC_bali_bubble_mobile.svg');
    background-repeat: no-repeat;
    left: 11%; top: -72%; z-index: -1;
  }
  #tacBali .shapeheader2 { position: relative; width: 40%; padding: 1rem; left: 10px; bottom: -56%; }
  #tacBali .ticket_suitcase { bottom: -12%; position: absolute; width: 80%; left: 9%; }
  .h1, h1 { font-size: calc(1.375rem + 2.5vw); }
}

@media screen and (min-width: 1200px) {
  #tacBali .imgcirclepic2 { height: 550px;  z-index: 1; }
  #tacBali .shapebubble2 {     
    height: 1300px;
    position: absolute;
    justify-content: space-around;
    background: url('../images/stockimages/TAC_bali_bubble_mobile.svg');
    background-repeat: no-repeat;
    left: 11%; top: -72%; z-index: -1;
  }
  #tacBali .shapeheader2 { position: relative; width: 40%; padding: 1rem; left: 10px; bottom: -50.5%; }
  .h1, h1 { font-size: calc(1.375rem + 2.3vw);} 
  #tacBali .ticket_suitcase { bottom: -12%; position: absolute; width: 80%; left: 9%; }
}

/*---------------- END Bali ----------------*/

.mobile-banner-MSA_ComputeIncentive { background: url('../images/stockimages/HPE2022042308250_1600_0_72_RGB.jpg'); background-position: 60% 10%; }
.box_radius_blue { border: 3px solid #00DEC8;  }
.box_radius_lightblue { border: 3px solid #1EB0D2; }
.box_radius_dimblue { border: 3px solid #3490D9; }
.box_radius_purple { border: 3px solid #6F37ED; }
.box_radius_magenta { border: 3px solid #C140FF; }
.box_radius_green { border: 3px solid #01a982; }
.card-footer_trans { background-color: transparent; border-top: 0; padding: 0;  }
.font_size_90perc { font-size: 90%; }
.smallblack { color: rgb(68, 68, 68); font-style: italic; }

@media (min-width: 992px) {
  .box_radius { padding: 1.5rem; border-radius: 15px; background-color: #fff;  }
  .pad_extra { padding: .3rem 0; }
}

@media (max-width: 991px) {
  .box_radius { padding: 1.5rem; border-radius: 15px; background-color: #fff;  }
  .pad_extra { padding: 0; }
}

.gradient-stockimage img { z-index: 2 !important; position: relative !important; }
.gradient-stockimage_purpleblueyellow::after,
.gradient-stockimage_purplemargentayellow::after,
.gradient-stockimage_orangeyellow::after,
.gradient-stockimage_purpleblue::after,
.gradient-stockimage_greenyellow::after,
.gradient-stockimage_magentagreenyellow::after,
.gradient-stockimage_magentapurplegreen::after { z-index: 1 !important; }

@media (max-width: 767px) {
  .gradient-stockimage { position: relative; margin-bottom: 4rem; }
}

@media (min-width: 768px) and (max-width: 991px) {
  .gradient-stockimage { position: relative; margin-bottom: 4rem; }
}

.dotted_line_vertical_mobile_servicesincentive { border-right: 3px dotted #FF8300; height: 30px; left: -50%; position: relative; bottom: -50%; }

/* ================ CALENDAR 03-09-24================ */

.rd-container { 
  display: none; background-color: #fff; padding: 20px; text-align: center; 
  box-shadow: 0 15px 15px 0 rgba(0, 0, 0, .2); border: 2px solid #01A982; 
  margin-top: 1px; border-radius: 6px;
}
.rd-container-attachment { position: absolute; }
.rd-month { display: inline-block; margin-right: 25px; margin-top: 6px; }
.rd-month:last-child { margin-right: 0; }
.rd-back,
.rd-next { cursor: pointer; border: none; outline: none; background: none; padding: 0; margin: 0; }
.rd-back[disabled],
.rd-next[disabled] { cursor: default; }
.rd-back { float: left; margin-left: 10px; }
.rd-next { float: right; margin-right: 10px; }
.rd-back:before { font-family: 'hpe-icons' !important; display: block; content: "\e976"; color: #01a982; font-size: .85rem; margin-top: 6px; }
.rd-next:before { font-family: 'hpe-icons' !important; display: block; content: "\e977"; color: #01a982; font-size: .85rem; margin-top: 6px; }
.rd-day-body { cursor: pointer; text-align: center;  width: 35px; height: 35px; vertical-align: middle; }
.rd-day-selected,
.rd-time-selected,
.rd-time-option:hover { cursor: pointer; background-color: #01A982; color: #fff;  /* new */ border-radius: 50%; }
.rd-day-prev-month,
.rd-day-next-month { color: #ccc; }
.rd-day-disabled { cursor: default; color: #ccc; }
.rd-time { position: relative; display: inline-block; margin-top: 5px; min-width: 80px; }
.rd-time-list { display: none; position: absolute; overflow-y: scroll; max-height: 160px; left: 0; right: 0; background-color: #fff; color: #333; }
.rd-time-selected { padding: 5px; }
.rd-time-option { padding: 5px; }
.rd-day-concealed { visibility: hidden; }
.rd-days { margin-top: 15px; }

table.rd-days th, table.rd-days td { font-size: .9rem; }
table th.rd-day-head { padding-bottom: 1rem; }

@media screen and (max-width: 991px) {
  table.rd-days td { padding: 0.75rem; }
  .mt_1rem { margin-top: 1rem; }
  .mt_point5rem { margin-top: .5rem; }
}

/* ================ END CALENDAR 03-09-24================ */

.xs_position_fixed { position: fixed; }
.opacity_point8 { opacity: .8 ; }
.opacity_point75 { opacity: .75 ; }
.z-1 { z-index: 1; }
.justify-items-center { justify-items: center; }
.justify-self-center { justify-self: center; }
.font_size_35px { font-size: 35px; }
.font_size_48px { font-size: 48px; }
.border_radius_36px { border-radius: 36px; }
.blackoverlay_point3 { box-shadow: inset 0 0 0 2000px rgba(0, 0, 0, 0.3) !important; }
.pad_bottom_1rem { padding-bottom: 1rem; }
.mb_2rem { margin-bottom: 2rem; }
.pl_3rem { padding-left: 3rem; }
.pr_3rem { padding-right: 3rem; }
.px_3rem { padding: 0 3rem; }

ul.bullet { list-style: disc; }

.tx_link a { color: #333333; }
.tx_link a:hover, .tx_link a:active, .tx_link a:focus { color: #01A982; }

@media screen and (max-width: 991px) {
  .sponsor, .programinfo { text-align: center; }
}

@media screen and (min-width: 992px) {
  .sponsor { text-align: left; }
  .programinfo { text-align: right; }
}

h2 { margin-bottom: 1rem }

#masthead_single, #masthead_single_microsoft { position: relative; }
.mastoverlay_single {
  box-shadow: inset 0 0 0 2000px rgba(0, 0, 0, 0.3) !important; 
  height: 100%;
  width: 100%;
  position: absolute;
}

@media screen and (min-width: 992px) {
 #masthead_single .carousel-caption, #masthead_single_microsoft .carousel-caption {
  text-align: left; right: 0; left: 0; top: 0;
}
}

@media screen and (max-width: 991px) {
  #masthead_single .carousel-caption { text-align: left; right: 1.5%; left: 1.5%; bottom: 2rem; }
  #masthead_single_microsoft .carousel-caption { text-align: left; right: 1.5%; left: 1.5%; bottom: 1rem; }
  .mastoverlay_single_mobile2 {
    background: linear-gradient(235deg, rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, .7) 80%);
    height: 100%;
    width: 100%;
    z-index: 1;
    position: absolute;
  }
}

.mastoverlay_single_mobile {
/*box-shadow: inset 0 0 0 2000px rgba(0, 0, 0, 0.3) !important; */
background: linear-gradient(235deg, rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, 1) 80%);
height: 100%;
width: 100%;
z-index: 1;
position: absolute;
}

.tx_orangeyellow { 
  background: linear-gradient(45deg, #ffd300, #ffd300);
  content: '';
  background-size: 100% 100%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent; 
}

.new_sku { 
  color: #fff; border-radius: 50px; padding: 3px .8rem; background: linear-gradient(45deg, #ffd300, #ff6300); display: inline-block
}

.bgsize_100 { background-size: 100% !important; } 

@media screen and (min-width: 992px) {
  .margintb_lg_2rem { margin: 2rem 0 !important; }
  .margintb_lg_6rem { margin: 6rem 0 !important; }
  .lg_mb_2rem { margin-bottom: 2rem !important; }
  .lg_mt_7rem { margin-top: 7rem; }
}

.gradient-stockimage img.object_fit_fill { object-fit: fill;  }
.font_size_65px { font-size: 65px !important; }
.font_size_30px { font-size: 30px; }
.font_size_25px { font-size: 25px; }
.font_size_20px { font-size: 20px; }
.position_relative { position: relative; }
.z-n1 { z-index: -1; }

.incentive_tnc li ul.list_alpha li { list-style-type: lower-alpha !important; padding-bottom: .2rem; padding-left: .5rem; }
.incentive_tnc { font-size: 1rem; }
.incentive_tnc ol li { list-style-type: decimal !important; margin-left: -1rem !important; padding-bottom: .3rem; padding-left: .5rem;}
.incentive_tnc ul { padding-left: 2rem; }

.incentive_tnc li ul.bullet li { list-style-type: disc !important; padding-bottom: .2rem; padding-left: .5rem; }

.card.card_border_color {
  color: rgb(68, 68, 68);
  padding: 2.5rem;
  border-radius: 1rem;
}

.my_2rem { margin-bottom: 2rem; }
.mt_2rem { margin-top: 2rem; }
.m_top_1point5rem { margin-top: 1.5rem; }
.font_size_40px { font-size: 40px; }
.fill_green { filter: invert(48%) sepia(57%) saturate(2932%) hue-rotate(134deg) brightness(90%) contrast(99%); }
.fill_orange { filter: brightness(0) saturate(100%) invert(39%) sepia(94%) saturate(1789%) hue-rotate(359deg) brightness(102%) contrast(107%); }

.rotate_90deg { transform: rotate(90deg); }
.box_radius_lightpurple { border: 3px solid #C140FF; }
.tx_greenyellow { 
  background: linear-gradient(225deg, #FF8300, #FEC901, #2ECC40, #3D9970);
  content: ''; margin-bottom: ;
  background-size: 100% 100%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent; 
}

.datablock_bg {
  background-image: url('../images/stockimages/HPE_AI_texture_datablocks.jpg');
  background-size: cover; padding: 1rem 0; background-repeat: no-repeat;
}

.tx_magentagreenyellow { 
  content: ''; background: linear-gradient(225deg, #fec901, #01c294, #b56cad 40%, #eb3474); 
  background-size: 100% 100%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.box_shadow { 
  box-shadow: 0px 0px 12px 0px rgba(0,0,0,0.06);
  -webkit-box-shadow: 0px 0px 12px 0px rgba(0,0,0,0.06);
  -moz-box-shadow: 0px 0px 12px 0px rgba(0,0,0,0.06);
  padding: 1.5rem; border-radius: 1rem; 
}


@media screen and (max-width: 767px) {
  .gradient-stockimage_hauto img { width: calc(100% - 30px); height: 270px; object-fit: fill; }
  .gradient-stockimage_hauto { position: relative; margin-bottom: 4rem; }
}

@media screen and (min-width: 768px)  and (max-width: 1199px) {
  .gradient-stockimage_hauto img { width: calc(100% - 50px); height: 190px;  object-fit: fill; }
  .gradient-stockimage_hauto { position: relative; margin-bottom: 0; }
}

@media screen and (min-width: 1200px) {
  .gradient-stockimage_hauto img { width: calc(100% - 60px); height: auto; }
  .gradient-stockimage_hauto { position: relative; margin-bottom: 0; }
}

.pl_point5rem { padding-left: .5rem; }
.pl_1rem { padding-left: 1rem; }
.pr_1rem { padding-right: 1rem; }

.box_radius_yellow { border: 3px solid #FEC901; }
.box_radius_superlightblue { border: 3px solid #7FF9E2; }

@media screen and (min-width: 992px) {
  .fluidbg_blue {
    background-image: url('../images/stockimages/AdobeStock-257301038_1600_0_72_RGB.jpg');
    background-size: 200%; background-repeat: no-repeat;
  }
  .lg_marginbottom_2rem { margin-bottom: 2rem; }
}
@media screen and (max-width: 991px) {
  .fluidbg_blue {
    background-image: url('../images/stockimages/AdobeStock-257301038_1600_0_72_RGB.jpg');
    background-size: cover; background-repeat: no-repeat;
  }
}
.card-body_1pt5 { padding: 1.5rem; }
.card_footer_1pt5 { padding: 0 1.5rem 1.5rem; }
.card_footer_2rem { padding: 0 2rem 2rem; }

.font_size_16px { font-size: 16px; }
.my_5rem { margin: 5rem 0; }
.marginbottom_2rem { margin-bottom: 2rem; }

@media screen and (max-width: 1199px) {
  .lg_tx_center { text-align: center !important; }
  .lg_px_1rem { padding: 0 1rem; }
}

.p_1point4rem { padding: 1.4rem; }

.tx_faq { font-size: 1.15rem !important; }
.tx_faq ol li { list-style-type: decimal !important; margin-left: -1rem !important; padding-bottom: .5rem; padding-left: .5rem; padding-top: .5rem; }
.tx_faq ol li ol li { list-style-type: upper-roman !important; margin-left: -1rem !important; padding-bottom: .5rem; padding-left: .5rem; padding-top: .5rem; }
.tx_faq ol { margin-bottom: 1rem; }
.p_1point25rem { padding: 1rem 1.25rem }
li button { font-size: 1.2rem; }
.px_point5rem { padding: 0 .5rem; }
.tx_deci ol li:nth-child(1), .tx_deci ol li:nth-child(2) { font-weight: 500; color: #01A982 ; }

.tx_bluemargentayellow {
  content: '';
  background-image: linear-gradient(175deg, #0d5265, #af42f0, #fec901);
  background-size: 100% 100%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.gradient_yellowmargentablue { background: linear-gradient(45deg, #0d5265, #af42f0, #fec901); }

.tx_yellowmargentablue {
  content: '';
  background-image: linear-gradient(45deg, #0d5265, #af42f0, #fec901);
  background-size: 100% 100%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.h2_tx_shadow { text-shadow: 0 0 5px rgba(0, 0, 0, 0.5); }
.background_size_150 { background-size: 150%; }
.tooltip-inner { padding: 1rem; background-color: rgba(0, 0, 0, 1.0); border-radius: 15px; line-height: 1.3; }

.landing_login { background: #000000; padding: 7em 0 3em 0; color: #fff; position: relative; font-size: 18px; }
.landing_login_vid { position: absolute; bottom: 0; right: 2em; display: grid; }
.landing_login_vid video { width: auto; float: right; }

@media screen and (max-width: 768px) and (max-device-width: 768px) {
  .landing_login_vid { width: 100%; right: 2px !important; }
  .landing_login_vid video { width: 100% !important; }
}

.border_none { border: none; }

.gradient_border_yellowmargentablue { 
  border: transparent;
  border-radius: 25px;
  background-image: linear-gradient(white, white), 
  linear-gradient(45deg, #ffc800, #eb3474, #8219f3);
  background-origin: border-box;
  background-clip: content-box, border-box;
} 

.gradient_border_purpleblueyellow { 
  border: transparent;
  border-radius: 25px;
  background-image: linear-gradient(white, white), 
  linear-gradient(45deg, #8219f3, #00dec8, #ffc800);
  background-origin: border-box;
  background-clip: content-box, border-box;
} 

.gradient_border_magentapurplegreen { 
  border: transparent;
  border-radius: 25px;
  background-image: linear-gradient(white, white), 
  linear-gradient(45deg, #eb3474, #7630ea, #01d9a6);
  background-origin: border-box;
  background-clip: content-box, border-box;
} 

.gradient_border_purpleblue { 
  border: transparent;
  border-radius: 25px;
  background-image: linear-gradient(white, white), 
  linear-gradient(45deg, #d221ff, #00dec8);
  background-origin: border-box;
  background-clip: content-box, border-box;
}

#globalland .flip-card-front .flip-card-front-inner p, #globalland .flip-card-back .flip-card-back-inner p  { font-size: 1.1rem; }

.mt_10rem { margin-top: 10rem; }

@media screen and (min-width: 1521px) {
  .illu_tx_top1 { width: 20%; position: absolute; left: 40%; text-align: center; }
  .illu_tx_top2 { width: 21%; position: absolute; top: 49%; left: 17%; text-align: center; }
  .illu_tx_top3 { width: 20%; position: absolute; top: 43%; left: 63%; text-align: center; }
  .illu_img { width: 60%; margin-top: 5rem; }
}

@media screen and (min-width: 1199px) and (max-width: 1520px) {
  .illu_tx_top1 { width: 20%; position: absolute;  left: 40%; text-align: center; }
  .illu_tx_top2 { width: 20%; position: absolute; top: 46%; left: 14%; text-align: center; }
  .illu_tx_top3 { width: 20%; position: absolute; top: 40%; left: 66%; text-align: center; }
  .illu_img { width: 60%; margin-top: 6.5rem; }
}

@media screen and (min-width: 992px) and (max-width: 1199px) {
  .illu_tx_top1 { width: 25%; position: absolute; left: 38%; text-align: center; }
  .illu_tx_top2 { width: 25%; position: absolute; top: 46%; left: 14%; text-align: center; }
  .illu_tx_top3 { width: 25%; position: absolute; top: 40%; left: 62%; text-align: center; }
  .xs_mt_28rem { margin-top: 28rem; }
  .illu_img { width: 60%; margin-top: 6.5rem; }
  #landing_login .icon_step { position: relative; border-top: 2px solid; margin-top: -20%; z-index: -1; }
}

@media screen and (min-width: 768px) and (max-width: 991px) {
  .illu_tx_top1 { width: 85%; position: absolute; text-align: center; justify-self: anchor-center; }
  .illu_tx_top2 { width: 85%; position: absolute; top: 33%; text-align: center; justify-self: anchor-center;}
  .illu_tx_top3 { width: 85%; position: absolute; top: 48%; text-align: center; justify-self: anchor-center;}
  .xs_mt_20rem { margin-top: 20rem; }
  .xs_mt_28rem { margin-top: 28rem; }
  .illu_img { width: 100%; margin-top:22rem; }
  #landing_login .icon_step { position: relative; border-top: 2px solid #898989; margin-top: -17%; z-index: -1; }
}

@media screen and (max-width: 767px) {
  .illu_tx_top1 { width: 85%; position: absolute; text-align: center; justify-self: anchor-center; }
  .illu_tx_top2 { width: 85%; position: absolute; top: 36%; text-align: center; justify-self: anchor-center;}
  .illu_tx_top3 { width: 85%; position: absolute; top: 55%; text-align: center; justify-self: anchor-center;}
  .xs_mt_20rem { margin-top: 20rem; }
  .xs_mt_28rem { margin-top: 28rem; }
  .illu_img { width: 100%; margin-top: 28rem; }
  #landing_login .icon_step { display: none; }
}

@media screen and (max-width: 991px) {
  .titleline { display: none; }
  .landing_login_box_radius_expand_position { position: relative; left: 0; }
  .stepline_bottom::before { 
    content: "";
    border-left: 2px solid #898989;
    position: absolute;
    z-index: -1;
    bottom: 13%;
    height: 700px;
  }
  .stepline_top::after { 
    content: "";
    border-left: 2px solid #898989;
    position: absolute;
    z-index: -1;
    top: -115%;
    height: 470px;
  }
}

@media screen and (min-width: 992px) {
  .stepline_bottom::before { 
    content: "";
    border-left: 2px solid #898989;
    position: absolute;
    z-index: -1;
    bottom: 13%;
    height: 500px;
  }
  .stepline_top::after { 
    content: "";
    border-left: 2px solid #898989;
    position: absolute;
    z-index: -1;
    top: -90%;
    height: 450px;
  }

  .landing_login_box_radius_expand_position { position: relative; left: 125px; }
}

@media screen and (min-width: 1200px) {
  #landing_login .icon_step { border-top: 2px solid #898989; top: -25px; z-index: -1; position: relative; }
}

.pad_point7rem { padding: .7rem; }
.pad_1rem { padding: 1rem; }
.pl_2rem { padding-left: 2rem; }

.gradient_border_minheight { min-height: 16rem; }

#landing_login .accordion-button {  padding: 0; outline: #01A982; box-shadow: none; font-size: 26px; font-weight: 500;  }
#landing_login .accordion-button:not(.collapsed) { padding: 0; box-shadow: none; border-radius: 6px; background-color: transparent; border: 0; font-size: 26px;  }

#landing_login .accordion-button:not(.collapsed)::after {
  background-image: url('../images/icon/icon_close.svg');
  transform: rotate(-180deg); background-size: contain; filter: brightness(0) saturate(100%) invert(68%) sepia(0%) saturate(6445%) hue-rotate(174deg) brightness(103%) contrast(98%);
}
#landing_login .accordion-button::after { filter: brightness(0) saturate(100%) invert(68%) sepia(0%) saturate(6445%) hue-rotate(174deg) brightness(103%) contrast(98%); }

#landing_login .accordion-body { padding: .5rem; margin-bottom: 1.5rem }
#landing_login h6 { font-weight: 500; }
#landing_login .accordion-item { background-color: #fff; border: 0; margin-top: .8rem; }
#landing_login .accordion-item .accordion-button ~ .collapse { margin-top: 0; }

#landing_login .icon_step:after {
  content: '';
  border-radius: 50px;
  width: 35px;
  height: 35px;
  top: -20px;
  position: relative;
  display: flex;
  justify-self: end;
}

#landing_login .icon_step.icon_step_yellow:after { background: #FEC901; }
#landing_login .icon_step.icon_step_orange:after { background: #FF8300; }
#landing_login .icon_step.icon_step_green:after { background: #01A982; }
#landing_login .icon_step.icon_step_magenta:after { background: #C140FF; }
#landing_login .icon_step.icon_step_purple:after { background: #7630EA; }

#landing_login .icon_step_img {
  border-radius: 50px;
  padding: 1rem; background-color: #fff;
  width: 80px;
  height: 80px;
  align-items: center;
  display: flex;
  justify-content: center;
  position: relative;
  top: 15px;
}

#landing_login .landing_login_box_radius_expand { padding: 1.5rem; border-radius: 15px; z-index: 3; position: relative; background-color: #fff; align-items: center; display: grid; }

.tx_yellow { color: #FEC901 !important; }
.tx_orange { color: #FF8300 !important; }

.border_color_orange { border: 3px solid #FF8300; }
.border_color_yellow { border: 3px solid #FEC901; }
.border_color_green { border: 3px solid #01A982; }
.border_color_magenta { border: 3px solid #C140FF; }
.border_color_purple { border: 3px solid #7630EA; }
.border_color_lightblue { border: 3px solid #00dec8; }
.border_color_blue { border: 3px solid #1EB0D2; }
.border_color_dimblue { border: 3px solid #0D5265; }

.m_top_point5rem { margin-top: .5rem; }

.landing_login_box_radius_expand_header { 
  background: linear-gradient(225deg, #ffc800, #eb3474, #8219f3);
  padding: 1rem 2rem; color: #ffffff;
  border-radius: 3rem;
  font-size: 28px;
  font-weight: 600;
}

#aboutus .masthead_aboutus {
  background: url('../images/stockimages/HPE2022042702080.jpg') 67% 35%; background-size: cover; 
}

.tx_magentapurplegreen {
  content: '';
  background-image: linear-gradient(45deg, #eb3474, #7630ea, #01d9a6);
  background-size: 100% 100%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}


@media screen and (max-width: 991px) {
  .header_border_green { height: 3px; background-color: #01A982; position: absolute; width: 22%; top: 6%; left: 0;}
  .header_border_purple { height: 3px; background-color: #7630EA; position: absolute; width: 22%; top: 6%; right: 0; }
  .profile_justify-items-end { justify-items: start; }
}

@media screen and (min-width: 992px) {
  .header_border_green { height: 3px; background-color: #01A982; position: absolute; width: 32%; top: 14%; left: 0; }
  .header_border_purple { height: 3px; background-color: #7630EA; position: absolute; width: 32%; top: 14%; right: 0; }
  .profile_justify-items-end { justify-items: end; }
}

.landing_pic { object-fit: cover; height: 180px; object-position: 50% 60%; }

#myprofile .masthead_myprofile {
  background: url('../images/stockimages/HPEService_18247_ProLiant2.jpg') 70% 25%; background-size: cover; 
}

#myprofile .card_img img { width: 100%; height: 270px; object-fit: cover; border-radius: 1rem 1rem 0 0; object-position: top; }

.borderleft_color_orange { border-left: 4px solid #FF8300; }
.borderleft_color_yellow { border-left: 4px solid #FEC901; }
.borderleft_color_green { border-left: 4px solid #01A982; }
.borderleft_color_lightgreen { border-left: 4px solid #32DAC8; }
.borderleft_color_magenta { border-left: 4px solid #C140FF; }
.borderleft_color_purple { border-left: 4px solid #7630EA; }

#myprofile td { padding: 10px 0; }

#myprofile .point_mask {
  font-size: 5.5rem;
  font-weight: 700;
  background: url('../images/stockimages/AdobeStock_222468625_1600_0_72_RGB.jpg') 0 0 / contain repeat;
  color: #de466c;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.px_2rem { padding: 0 2rem }
.justify-content-end { justify-content: end; }
.w_190px { width: 190px; }
.p_2rem { padding: 2rem }
.p_3rem { padding: 3rem }
.font_size_50px { font-size: 50px; }
.align-self-flex-end { align-self: flex-end; }

.profile_bg { background-image: url('../images/stockimages/profile_bg.jpg'); background-size: cover; background-repeat: no-repeat; }
.bg_member { background-image: url('../images/stockimages/bg_member.jpg'); background-size: cover; background-repeat: no-repeat; }

.tncmodal .modal-body.minheight_auto { min-height: auto; }
.camera_radius {
  border-radius: 50px;
  background-color: #01A982;
  width: 100px;
  height: 100px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}

.to_do_body { min-height: 205px; height: 205px; overflow-y: auto; }

::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track, ::-webkit-scrollbar-thumb { border-radius: 16px; border: solid 5px transparent; }
::-webkit-scrollbar-track { background-color: #e1e1e1; }
::-webkit-scrollbar-thumb { background-color: #01A982; }

.mx_2rem { margin: 0 2rem; }
.ml_1rem { margin-left: 1rem; }
.mt_1rem { margin-top: 1rem; }

#Block_Slider .owl-carousel .owl-nav button.owl-prev { left: -60px; position: absolute; top: 40%; }
#Block_Slider .owl-carousel .owl-nav button.owl-next { right: -60px; position: absolute; top: 40%; }

/********* SCROLLING TAB ********/ 

@keyframes fadein {
  0% { opacity: 0; transform: translateX(20px); }
  100% { opacity: 1; transform: translateX(0); }
}

.tab-nav-bar { position: relative; }
.tab-navigation { position: relative; align-items: center; }
.tab_bar_borderbottom { height: 1px; width: 100%; background-color: #d3d3d3; position: absolute; bottom: 0; left: 0; }

@media screen and (max-width: 991px) {
  .tab-menu { max-width: 600px; margin: 0px 35px;  }
  .left-btn { left: 0; background: transparent; display: none; }
}

@media screen and (min-width: 992px) {
  .tab-menu { max-width: 930px;  }
  .left-btn { left: -30px; background: transparent; display: none; }
}

.tab-menu {
  /*   color: var(--text-color); */
  /*   background-color: var(--third-color); */
  /*   max-width: 800px; */
  /* border-bottom: 1px solid var(--third-color);
  border-radius: 50px;
  box-shadow: var(--box-shadow); */
  scroll-behavior: smooth;
  user-select: none;
  overflow-x: auto;
  padding: 0;
  list-style: none;
  white-space: nowrap;
}

.tab-menu.dragging { scroll-behavior: unset; cursor: grab; }
.tab-menu::-webkit-scrollbar { display: none; }

.tab-btn {
  display: inline-block;
  cursor: pointer;
  user-select: none;
  padding: .8rem 1.5rem;
  margin: 0 -2px !important;
  color: rgb(68, 68, 68);
  transition: color .15s ease-in-out, border-color .05s ease-in-out;
  font-size: 1.2rem; 
  border-bottom: 4px solid transparent;
}
.tab-btn:hover, .tab-btn:focus { border-color: transparent; border-radius: 0; font-weight: 500; border-bottom: 4px solid #ebebeb; }
.tab-btn.active { border-color: transparent; border-radius: 0; font-weight: 500; border-bottom: 4px solid #01A982; }

.tab-menu.dragging .tab-btn { pointer-events: none; }
.left-btn, .right-btn { position: absolute; cursor: pointer; fill: #01A982; align-self: anchor-center; }
.right-btn { right: 0; background: transparent; }

/* ===== Tab content ===== */

.tab-content { position: relative; }
.tab_body {
  position: relative;
  width: 100%;
  padding: 2rem 0;
  display: none;
  animation: fadein .8s; 
}

/********* END SCROLLING TAB ********/ 


/********* RANGE SLIDER ********/ 

.range-slider.grad {
  --progress-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2) inset;
  --progress-flll-shadow: var(--progress-shadow);
  --fill-color: linear-gradient(to right, LightCyan, var(--primary-color));
  --thumb-shadow: 0 0 4px rgba(0, 0, 0, 0.3),
  -3px 9px 9px rgba(255, 255, 255, 0.33) inset,
  -1px 3px 2px rgba(255, 255, 255, 0.33) inset,
  0 0 0 99px var(--primary-color) inset;
}
.range-slider.grad input:hover { --thumb-transform: scale(1.2); }
.range-slider.grad input:active { --thumb-shadow: inherit; --thumb-transform: scale(1); }

.range-slider.flat {
  --thumb-size: 20px;
  --track-height: calc(var(--thumb-size) / 3);
  --progress-shadow: none;
  --progress-flll-shadow: none;
  --thumb-shadow: 0 0 0 5px var(--primary-color) inset, 0 0 0 30px white inset;
  --thumb-shadow-hover: 0 0 0 9px var(--primary-color) inset,
  0 0 0 99px white inset;
  --thumb-shadow-active: 0 0 0 13px var(--primary-color) inset;
}

/* .range-slider.overlay {
  --primary-color: #01A982;
  --track-height: 20px;
  --thumb-size: var(--track-height);
  --thumb-color: var(--primary-color);
  --thumb-shadow: none;
  --progress-flll-shadow: none;
  --progress-shadow: none;
  --progress-background: none;
  --progress-radius: 0px;
  --ticks-color: var(--primary-color);
  --ticks-height: 0;
  --ticks-thickness: 0;
  --ticks-gap: 0px;
  --min-max-font: 500 18px Metric;
  --min-max-opacity: 1;
  --show-min-max: none;
  color: #01A982;
} */
/* .range-slider.overlay input:hover {
  --thumb-shadow: calc(25px - (50px * var(--is-left-most))) 0 0 -15px #01A982
    inset;
} */
.range-slider.overlay input:active { --thumb-color: inherit; }
.range-slider.overlay .range-slider__values { width: calc(100% - 50% / (var(--max) - var(--min))); }

.range-slider {
  --primary-color: #01A982;
  --value-offset-y: var(--ticks-gap);
  --value-active-color: white;
  --value-background: transparent;
  --value-background-hover: var(--primary-color);
  --value-font: 500 14px/1 Metric;
  --fill-color: var(--primary-color);
  --progress-background: #eee;
  --progress-radius: 30px;
  --track-height: calc(var(--thumb-size) / 2);
  --min-max-font: 10px Metric;
  --min-max-opacity: 0.5;
  --min-max-x-offset: 10%;
  --thumb-size: 22px;
  --thumb-color: white;
  --thumb-shadow: 0 0 3px rgba(0, 0, 0, 0.4), 0 0 1px rgba(0, 0, 0, 0.5) inset, 0 0 0 99px var(--thumb-color) inset;
  --thumb-shadow-active: 0 0 0 calc(var(--thumb-size) / 4) inset
  var(--thumb-color), 0 0 0 99px var(--primary-color) inset, 0 0 3px rgba(0, 0, 0, 0.4);
  --thumb-shadow-hover: var(--thumb-shadow);
  --ticks-thickness: 1px;
  --ticks-height: 5px;
  --ticks-gap: var( --ticks-height, 0 );
  --ticks-color: silver;
  --step: 1;
  --ticks-count: Calc(var(--max) - var(--min)) / var(--step);
  --maxTicksAllowed: 30;
  --too-many-ticks: Min(1, Max(var(--ticks-count) - var(--maxTicksAllowed), 0));
  --x-step: Max(
    var(--step),
    var(--too-many-ticks) * (var(--max) - var(--min)));
  --tickInterval: 100/ ((var(--max) - var(--min)) / var(--step)) * var(--tickEvery, 1);
  --tickIntervalPerc: calc(
    (100% - var(--thumb-size)) / ((var(--max) - var(--min)) / var(--x-step)) *
    var(--tickEvery, 1)
  );
  --value-a: Clamp(
    var(--min),
    var(--value, 0),
    var(--max));
  --value-b: var(--value, 0);
  --text-value-a: var(--text-value, "");
  --completed-a: calc(
    (var(--value-a) - var(--min)) / (var(--max) - var(--min)) * 100
  );
  --completed-b: calc(
    (var(--value-b) - var(--min)) / (var(--max) - var(--min)) * 100
  );
  --ca: Min(var(--completed-a), var(--completed-b));
  --cb: Max(var(--completed-a), var(--completed-b));
  --thumbs-too-close: Clamp(
    -1,
    1000 * (Min(1, Max(var(--cb) - var(--ca) - 5, -1)) + 0.001),
    1);
  --thumb-close-to-min: Min(1, Max(var(--ca) - 2, 0));
  --thumb-close-to-max: Min(1, Max(98 - var(--cb), 0));
  display: inline-block;
  height: max(var(--track-height), var(--thumb-size));
  background: linear-gradient(to right, var(--ticks-color) var(--ticks-thickness), transparent 1px) repeat-x;
  background-size: var(--tickIntervalPerc) var(--ticks-height);
  background-position-x: calc( var(--thumb-size) / 2 - var(--ticks-thickness) / 2 );
  background-position-y: var(--flip-y, bottom);
  padding-bottom: var(--flip-y, var(--ticks-gap));
  padding-top: calc(var(--flip-y) * var(--ticks-gap));
  position: relative;
  z-index: 1;
}
.range-slider[data-ticks-position=top] { --flip-y: 1; }
.range-slider::before, .range-slider::after {
  --offset: calc(var(--thumb-size) / 2);
  content: counter(x);
  display: var(--show-min-max, block);
  font: var(--min-max-font);
  position: absolute;
  bottom: var(--flip-y, 3ch);
  top: calc(6ch * var(--flip-y));
  opacity: clamp(0, var(--at-edge), var(--min-max-opacity));
  transform: translateX(calc(var(--min-max-x-offset) * var(--before, -1) * -1)) scale(var(--at-edge));
  pointer-events: none;
}
.range-slider::before { --before: 1; --at-edge: var(--thumb-close-to-min); counter-reset: x var(--min); left: var(--offset); }
.range-slider::after { --at-edge: var(--thumb-close-to-max); counter-reset: x var(--max); right: var(--offset); }
.range-slider__values {
  position: relative;
  top: 50%;
  line-height: 0;
  text-align: justify;
  width: 100%;
  pointer-events: none;
  margin: 0 auto;
  z-index: 5;
}
.range-slider__values::after { content: ""; width: 100%; display: inline-block; height: 0; background: red; }
.range-slider__progress {
  --start-end: calc(var(--thumb-size) / 2);
  --clip-end: calc(100% - (var(--cb)) * 1%);
  --clip-start: calc(var(--ca) * 1%);
  --clip: inset(-20px var(--clip-end) -20px var(--clip-start));
  position: absolute;
  left: var(--start-end);
  right: var(--start-end);
  top: calc( var(--ticks-gap) * var(--flip-y, 0) + var(--thumb-size) / 2 - var(--track-height) / 2 );
  height: calc(var(--track-height));
  background: var(--progress-background, #eee);
  pointer-events: none;
  z-index: -1;
  border-radius: var(--progress-radius);
}
.range-slider__progress::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  -webkit-clip-path: var(--clip);
  clip-path: var(--clip);
  top: 0;
  bottom: 0;
  background: var(--fill-color, black);
  box-shadow: var(--progress-flll-shadow);
  z-index: 1;
  border-radius: inherit;
}
.range-slider__progress::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  box-shadow: var(--progress-shadow);
  pointer-events: none;
  border-radius: inherit;
}
.range-slider > input {
  -webkit-appearance: none;
  width: 100%;
  height: var(--thumb-size);
  margin: 0;
  position: absolute;
  left: 0;border: none;
  /*   top: calc( 50% - Max(var(--track-height), var(--thumb-size)) / 2 + calc(var(--ticks-gap) / 2 * var(--flip-y, -1)) ); */
  cursor: -webkit-grab;
  cursor: grab;
  outline: none;
  background: none;
}
.range-slider > input:not(:only-of-type) { pointer-events: none; }
.range-slider > input::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  height: var(--thumb-size);
  width: var(--thumb-size);
  transform: var(--thumb-transform);
  border-radius: var(--thumb-radius, 50%);
  background: var(--thumb-color);
  box-shadow: var(--thumb-shadow);
  border: none;
  pointer-events: auto;
  -webkit-transition: 0.1s;
  transition: 0.1s;
}
.range-slider > input::-moz-range-thumb {
  -moz-appearance: none;
  appearance: none;
  height: var(--thumb-size);
  width: var(--thumb-size);
  transform: var(--thumb-transform);
  border-radius: var(--thumb-radius, 50%);
  background: var(--thumb-color);
  box-shadow: var(--thumb-shadow);
  border: none;
  pointer-events: auto;
  -moz-transition: 0.1s;
  transition: 0.1s;
}
.range-slider > input::-ms-thumb {
  appearance: none;
  height: var(--thumb-size);
  width: var(--thumb-size);
  transform: var(--thumb-transform);
  border-radius: var(--thumb-radius, 50%);
  background: var(--thumb-color);
  box-shadow: var(--thumb-shadow);
  border: none;
  pointer-events: auto;
  -ms-transition: 0.1s;
  transition: 0.1s;
}
.range-slider > input:hover { --thumb-shadow: var(--thumb-shadow-hover); border: none; }
.range-slider > input:hover + output {
  --value-background: var(--value-background-hover);
  --y-offset: -5px;
  color: var(--value-active-color);
  box-shadow: 0 0 0 3px var(--value-background);
}
.range-slider > input:active {
  --thumb-shadow: var(--thumb-shadow-active);
  cursor: -webkit-grabbing;
  cursor: grabbing;
  z-index: 2;
}
.range-slider > input:active + output { transition: 0s; }
.range-slider > input:nth-of-type(1) { --is-left-most: Clamp(0, (var(--value-a) - var(--value-b)) * 99999, 1); }
.range-slider > input:nth-of-type(1) + output { --value: var(--value-a); --x-offset: calc(var(--completed-a) * -1.4%); }
.range-slider > input:nth-of-type(1) + output:not(:only-of-type) { --flip: calc(var(--thumbs-too-close) * -1); }
.range-slider > input:nth-of-type(1) + output::after { content: var(--prefix, "") var(--text-value-a) var(--suffix, ""); }
.range-slider > input:nth-of-type(2) { --is-left-most: Clamp(0, (var(--value-b) - var(--value-a)) * 99999, 1); }
.range-slider > input:nth-of-type(2) + output { --value: var(--value-b); }
.range-slider > input:only-of-type ~ .range-slider__progress { --clip-start: 0; }

.range-slider > input + output {
  --flip: -1;
  --x-offset: calc(var(--completed-b) * -.8%);
  --pos: calc(
    ((var(--value) - var(--min)) / (var(--max) - var(--min))) * 100%);
  pointer-events: none;
  position: absolute;
  z-index: 5;
  background: var(--value-background);
  border-radius: 10px;
  padding: 0;
  left: var(--pos);
  transform: translate(var(--x-offset), calc( 150% * var(--flip) - (var(--y-offset, 0px) + var(--value-offset-y)) * var(--flip) ));
  transition: all 0.12s ease-out, left 0s;
  color: #01A982;
}
.range-slider > input + output::after {
  content: var(--prefix, "") var(--text-value-b) var(--suffix, "");
  font: var(--value-font); padding: .5rem;
}

.range-slider, label[dir=rtl] .range-slider { /* width: clamp(300px, 50vw, 800px); */ width: 100%; min-width: 100%; }

#range_drop button.accordion-button2 {
  color: rgb(68, 68, 68); padding: 8px 10px;
  background-image: url(data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e) !important;
  background-repeat: no-repeat; background-position: .25rem 0.25rem; background-size: 16px 12px;
  border: 1px solid rgba(0, 0, 0, 0.36); border-radius: 6px;
}

#range_drop button.accordion-button2::after {
  color: rgb(68, 68, 68); padding: 5px 10px; border-radius: 3px;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e") !important;
  background-repeat: no-repeat; background-position: .15rem 0.3rem; background-size: 16px 12px;
  border-radius: 6px;
  transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
  -webkit-appearance: none; -moz-appearance: none; appearance: none;
}

#range_drop .accordion-button:not(.collapsed), #range_drop .accordion-button2:hover, #range_drop .accordion-button2:focus, #range_drop .accordion-button2:active {
  color: rgb(68, 68, 68);
  padding: 8px 10px;
  box-shadow: rgb(110, 230, 210) 0px 0px 3px 2px;
  border-radius: 6px;
  background-color: transparent; 
}

#range_drop .accordion-button2::after, #range_drop .accordion-button2:not(.collapsed)::after { filter: brightness(100%) }

/* Chrome, Safari, Edge, Opera */
#range_drop input::-webkit-outer-spin-button,
#range_drop input::-webkit-inner-spin-button, { -webkit-appearance: none; margin: 0; }

/* Firefox */
#range_drop input[type=number] { -moz-appearance: textfield; }

/********* END RANGE SLIDER ********/ 


#tab_accor #accordion { 
  color: rgb(68, 68, 68); padding: 5px 10px; 
  box-shadow: none; outline: none; appearance: none;
  border-radius: none; background-color: transparent; 
}

#tab_accor  button:focus { 
  outline: none !important; outline-width: 0 !important; box-shadow: none; -moz-box-shadow: none; -webkit-box-shadow: none; 
}
#tab_accor .accordion-header { margin-bottom: 0; padding-bottom: 0; }
#tab_accor .accordion-body { border: 0; border-radius: 0; background-color: #F9F9F9; padding: 0 1.5rem 1.5rem; }
#tab_accor .accordion-button:not(.collapsed) { 
  box-shadow: none; background-color: #F9F9F9; color: inherit; padding: 1.5rem; 
}
#tab_accor .accordion-item { border: none; margin-bottom: 1rem; }
#tab_accor .accordion-button { background-color: #F9F9F9; padding: 1.5rem;     align-items: flex-start; }

#incentive_rightaccordion .accordion-item { 
  background-color: #fff; border: 1px solid rgba(0, 0, 0, 0.36); border-radius: .25rem; margin-bottom: 1rem; 
}
#incentive_rightaccordion .accordion-item .accordion-header  { padding: 0; }

#incentive_rightaccordion .accordion-button:not(.collapsed) {
  color: rgb(68, 68, 68);
  background-color: #fff;
  box-shadow: none;
}

#incentive_rightaccordion .accordion-button:focus { box-shadow: none; }
#incentive_rightaccordion .accordion-flush .accordion-item .accordion-button { border-radius: .25rem;  }
#incentive_rightaccordion .accordion-button { 
  border: 1px solid transparent; padding: 8px 11px 8px 11px; color: rgb(68, 68, 68, .8); font-size: 1.1rem; 
}

#incentive_rightaccordion .accordion-item:hover, #incentive_rightaccordion .accordion-item:active {
  color: rgb(68, 68, 68);
  box-shadow: rgb(110, 230, 210) 0px 0px 3px 2px;
  border: 1px solid #555555
}

#incentive_rightaccordion .accordion_body_scroll { min-height: 220px; height: 220px; overflow-y: auto; }

#incentive_rightaccordion .accordion-body { border-radius: .25rem; padding: 1.25rem; }
#incentive_rightaccordion .accordion-body .form-check:last-child { margin-bottom: 0; }

#incentive_rightaccordion .accordion-body.range_slider { padding: 2rem 1rem 3rem; }

.incentive_bannerpoint {
  padding: 2.5rem; color: #ffffff; display: block;
  background-image: url('../images/stockimages/incentive_bannerpoint.jpg');
  background-size: cover; background-repeat: no-repeat; border-radius: 1rem;
}

.px_3rem { padding-left: 3rem; padding-right: 3rem; }
.py_2rem { padding-top: 2rem !important; padding-bottom: 2rem !important; }
.py_1rem { padding-top: 1rem !important; padding-bottom: 1rem !important; }


@media screen and (max-width: 991px) {
  #resourcelibrary .card-body { padding: 2rem; }
  #resourcelibrary .card-gradient-btn { padding: 0 2rem 2rem; }
  .btn_main_grey {
    background: #F2F2F2;
    color: #555555; font-size: 90%;
    font-weight: 600;
    padding: 10px 50px;
    border-radius: 1rem; border: transparent;
    display: inline-block;
    margin-top: 1rem; 
  }
}

@media screen and (min-width: 992px) {
  #resourcelibrary .card-body { padding: 0; }
  #resourcelibrary .card-gradient-btn { padding-top: 1rem; }
  .btn_main_grey {
    background: #F2F2F2;
    color: #555555; font-size: 90%;
    font-weight: 600;
    padding: 10px 50px;
    border-radius: 10rem; border: transparent;
    display: inline-block;
    margin-top: 1rem; 
  }
}

.mt_n1point5rem { margin-top: -1.5rem; }
.z_n1 { z-index: -1; }
.z_2 { z-index: 2; }

.membercard_partner_name { position: absolute; color: #fff; z-index: 3; bottom: 13%; left: 8%; font-size: 1rem; }
.membercard_company_name { position: absolute; color: #fff; z-index: 3; bottom: 4%; left: 8%; font-size: 1rem; }

.membercard_partner_reward { position: absolute; color: #fff; z-index: 3; bottom: 31%; left: 14%; font-size: 1rem; }
.membercard_company_reward { position: absolute; color: #fff; z-index: 3; bottom: 26%; left: 14%; font-size: 1rem; }

.mt_3rem { margin-top: 3rem; }
.mb_4rem { margin-bottom: 4rem; }

.greycurve_bg2 { position: relative; }
.greycurve_bg2::after {
  content: "";
  background-image: url('../images/stockimages/greycurve_bg2.jpg'); 
  background-size: cover; padding: 1rem 0; background-repeat: no-repeat; 
  opacity: .2; border-radius: 2rem; 
  top: 0; left: 0; bottom: 0; right: 0;
  position: absolute; z-index: -1; 
}

.transparent_white { background: rgba(255, 255, 255, .35) !important; border: none; }
.round_circle_mask {
  border-radius: 50%;
  background-color: rgba(127, 249, 226, .25);
  width: 90px;
  height: 90px;
  padding: 3rem;
  align-items: center;
  justify-content: center;
  display: flex;
}

.round_circle_camera { 
  background: url('../images/icon/camera.svg');
  width: 40px;
  height: 40px;
  position: absolute;
  margin-left: 55px;
}

.round_circle_gallery { 
  background: url('../images/icon/gallery.svg');
  width: 40px;
  height: 40px;
  position: absolute;
  margin-left: 55px;
}

@media screen and (max-width: 991px) {
  .round_circle_camera, .round_circle_gallery { bottom: 65%; }
}

@media screen and (min-width: 992px) and (max-width: 1199px) {
  .round_circle_camera, .round_circle_gallery { bottom: 63%; }
}

@media screen and (min-width: 1200px) {
  .round_circle_camera, .round_circle_gallery  { bottom: 35%; }
}

.owl-carousel .owl-item img { display: inline;  }
.font-weight-300 { font-weight: 300 !important; }

.mb_n_10px{ margin-bottom: -10px; }
.font_size_14px { font-size: 14px; }
.font_size_12px { font-size: 12px; }
.font_size_10px { font-size: 10px; }

.bg_curvegreen {
  background-image: url('../images/stockimages/AdobeStock_222468625_1600_0_72_RGB.jpg');
  background-size: cover; background-repeat: no-repeat;
}

.greycurve_bg3 {
  background-image: url('../images/stockimages/GettyImages-1135685118_1600_0_72_RGB.jpg');
  background-size: cover; padding: 1rem 0; background-repeat: no-repeat;
}

.point_tb_line {
  border-bottom: 2px solid #32DAC8;
  border-top: 2px solid #32DAC8;
  justify-self: anchor-center;
  padding: .5rem;
}

.header_line { width: 65px; height: 4px; margin: 1rem 0; }
.header_line_center { width: 100px; height: 4px !important; margin: 2rem 0 1rem !important; justify-self: anchor-center; }
.fill_white { filter: invert(1); }

.border_gradient_purpleblue { 
  border: transparent;
  border-radius: 25px;
  background-image: linear-gradient(transparent), 
  linear-gradient(45deg, #d221ff, #00dec8);
  background-origin: border-box;
  background-clip: content-box, border-box;
}

.flex_none { flex: none; }
.card-footer { background: transparent; }

.mastoverlay_carousel {
  background: linear-gradient(235deg, rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, .7) 80%);
  height: 100%;
  width: 100%;
  z-index: 1;
  position: absolute;
}

#carousel_home .masthead_carousel_home {
  background: url('../images/stockimages/HPE20190301045.jpg') 75% 15%; background-size: cover; 
}

@media screen and (max-width: 991px) {
  #carousel_home .masthead_product img { width: 450px; opacity: .8; }
  #carousel_home .masthead_product_text { position: absolute; z-index: 1; bottom: 0; } 
  .xs_mx_auto { margin: 0 auto; }
  .masthead_space { margin-top: 0; }
}

@media screen and (min-width: 992px) {
  #carousel_home .masthead_product img { width: 450px; opacity: 1.0; }
  .my_6rem { margin: 6rem 0; }
  .masthead_space { margin-top: 125px; }
}

#carousel_home .owl-2-style .card-text { min-height: 5.5rem; }

.modal-content { border: none; }

.carousel-container-middle img { width: 150px; }
.carousel-container-middle2 img { width: 280px; }

.mt_7rem { margin-top: 7rem; }
.mt_66px { margin-top: 66px; }

@media screen and (max-width: 1199px) {
  #prelogin .owl-carousel .owl-nav button.owl-next, #prelogin .owl-carousel .owl-nav button.owl-prev { display: none; }
}

@media screen and (min-width: 1200px) {
  #prelogin .owl-carousel .owl-nav button.owl-next {
    right: -80px;
    position: absolute;
    top: 40%; filter: invert(100%);
  }
  #prelogin .owl-carousel .owl-nav button.owl-prev {
    left: -80px;
    position: absolute;
    top: 40%; filter: invert(100%);
  }
}


#reward table { width: 74%; text-align: left; position: absolute; bottom: 29%; margin: 0 1rem; }
#reward tr { border-bottom: 0; margin: 0; vertical-align: top; }
#reward th, #reward td { padding: 0; }
#reward td:first-child { width: 92px; }
#reward table td { font-size: .8rem; }

@media screen and (min-width: 597px) and (max-width: 991px) {
  #reward table { width: 82%; text-align: left; position: absolute; bottom: 21%; margin: 0 2rem; }
  #reward td:first-child { width: 60px; }
  #reward table td { font-size: 1.3rem; width: 200px; }
  #reward2 table td { font-size: 1.3rem; width: 200px; }
}

#reward2 table { width: 80%; text-align: left; position: absolute; bottom: 6%; margin: 0 1.5rem; z-index: 3; }
#reward2 tr { border-bottom: 0; margin: 0; vertical-align: top; }
#reward2 th, #reward td { padding: 0; }
#reward2 td:first-child { width: 124px; }
#reward2 table td { font-size: 1rem; padding-bottom: 0; }

@media screen and (min-width: 768px) and (max-width: 991px) {
#reward2 table { width: 70%; text-align: left; position: absolute; bottom: 4%; margin: 0 1rem; z-index: 3; }
#reward2 table td { font-size: .8rem; }
}

#reward2 td { padding: 0 }


.flip-card-back .flip-card-back-inner img { width: 90px; }
.flip-card-back .flip-card-back-inner img.hpes { width: 130px; }