/*
 * Remember:-
 * '#' selects id.
 * '.' selects class.
 * ''  selects element.
 */
/* PG Customisations
 */
@charset "ISO-8859-1";
 
* {
    scrollbar-color: #C1C1C1 #F1F1F1;
    scrollbar-width: thin;
}

.max-content-width {
  margin: 0 auto;
  max-width: var(--max-content-width);
}

.table--border {
  border: 1px solid var(--color-light);
  width: 100%;
}

.table--border tr {
  border: 1px solid var(--color-light);
}

.table_head {
  background: var(--alt-section-bg);
}

.basket_backdrop {
  background: var(--tdk-outline);
  height: 100%;
  opacity: 0;
  padding: 0;
  position: fixed;
  right: 0;
  top: 0px;
  transition: opacity var(--transition-slow), visibility var(--transition-slow), width 0s ease .6s, height 0s ease .6s;
  visibility: hidden;
  width: 100%;
  z-index: 1055;
}

.basket--open {
  height: 100%;
  opacity: 1;
  transition: opacity var(--transition-slow), visibility var(--transition-slow);
  visibility: visible;
  width: 100%;
}

.basket--open .basket_menu {
  transform: translateX(0);
}

.basket_menu {
  background: var(--color-white);
  box-shadow: var(--shadow-default);
  float: right;
  height: 100%;
  max-width: 100vw;
  overflow: auto;
  transform: translateX(33%);
  transition: transform var(--transition-slow);
  width: max(33%, 470px);
}

.basket_toast {
  border: 1px solid rgba(0, 0, 0, .2);
  border-radius: 8px;
  box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
  max-width: 100vw;
  min-width: 150px;
  opacity: 0;
  padding: .4rem;
  position: absolute;
  right: -10%;
  top: 150%;
  transition: opacity var(--transition-fast), visibility var(--transition-fast);
  visibility: hidden;
}

.basket_toast.success {
  background-color: var(--color-success);
  color: var(--color-white);
}
.basket_toast.success::after{
  border-color: transparent transparent var(--color-success) transparent;
}
  
.basket_toast.fail {
  background-color: var(--color-danger);
  color: var(--color-white);
}
.basket_toast.fail::after{
  border-color: transparent transparent var(--color-danger) transparent;
}
  

.basket_toast.warn {
  background-color: var(--color-warning);
  color: var(--color-white);
}
.basket_toast.warn::after{
  border-color: transparent transparent var(--color-warning) transparent;
}

.basket_toast.show {
  height: auto;
  opacity: 1;
  visibility: visible;
}
.basket_toast::before {
  border-color: transparent transparent rgba(0,0,0,.3) transparent;
  border-width: 9px;
  margin-left: -9px;
}
.basket_toast::after, .basket_toast::before {
  bottom: 100%;
  right: 10px;
}
.basket_toast::after, .basket_toast::before {
  border-style: solid;
  content: "";
  position: absolute;
}
.basket_toast::after {
  border-color: transparent transparent var(--color-success) transparent;
  border-width: 8px;
  margin-left: -8px;
}
.basket_error-wrapper {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 300px;
  opacity: .8;
  padding: 32px;
  text-align: center;
}

.basket_error-icon {
  font-size: 7rem;
  opacity: .3;
}

.basket_error-text {
  font-size: 1rem;
}

.basket_menu svg {
  pointer-events: none;
}

.basket_menu-header {
  padding: 1rem;
  padding-bottom: .5rem;
}

.basket_menu-footer {
  padding: 1rem;
  padding-top: .5rem;
}

.basket_menu-footer a {
  display: inline-block;
}

.basket_cta--disabled {
  opacity: .5;
  pointer-events: none;
}

.basket_menu-inner {
  position: sticky;
  top: 0;
}

.basket_list {
  border-top: 1px solid rgba(0, 0, 0, .2);
  margin-bottom: 0;
  margin-left: 0;
  padding-left: 0;
}

.basket-list_item {
  border-bottom: 1px solid rgba(0, 0, 0, .2);
  display: flex;
  padding: 1.2rem;
  position: relative;
  width: 100%;
}

.basket-list_img {
  background: var(--color-light);
  padding: .8rem;
}

.basket-list_text {
  margin-left: .5rem;
}

.checkbox_basket-sample {
  margin-left: .2rem;
  vertical-align: middle;
}

.basket_delete-item {
  color: red;
  position: absolute;
  right: 10px;
}

.loader--basket {
  min-height: 300px;
}

#siteHeader div.scroller_container {
  display: flex;
}

#siteHeader div.scroller {
  flex: 1;
}

.overflowYAuto {
  overflow-y: auto;
}

ul, li, ol {
  list-style: none;
}

.btn--link {
  background: none;
  border: none;
  color: var(--color-primary);
}

.btn--link:hover {
  opacity: .7;
}

.page-heading_float-container {
  float: right;
  width: 100%;
}

.page-heading_banner {
  align-items: baseline;
  display: flex;
  flex-wrap: wrap;
  position: relative;
}

.page-heading_h1 {
  float: left;
  font-size: 2.5rem;
  margin-bottom: 0;
  padding-left: .5rem;
  padding-top: 1rem;
  padding-right: .5rem;
  text-wrap: nowrap;
}

.page-heading_p {
  margin: .5rem;
}

.page-heading_p--bg {
  background: rgba(0,0,0,.03);
  margin-bottom: 1rem;
  padding: 1rem;
}

#searchCode::-webkit-search-decoration,
#searchCode::-webkit-search-cancel-button,
#searchCode::-webkit-search-results-button,
#searchCode::-webkit-search-results-decoration { display: none; }

#siteFooter ul, li, ol {
  padding-left: 0;
}

.copyright {
  line-height: 20px;
}

body {
  background-color: var(--color-white);
  color: var(--color-text);
  font-size: .85rem !important;
  margin-left: 0px;
  margin-right: 0px;
}

body, html {
  font-size: 16px;
  padding: 0;
}

a {
  color: var(--color-primary);
}

 a:hover {
  color: var(--color-primary);
}

#container:hover .dev-banner--test, #container:hover .dev-banner--local {
  display: none;
}

.dev-banner--test, .dev-banner--local {
  background: rgba(0,0,0,.3);
  border-bottom: 1px solid rgba(0,0,0,.1);
  left: 0;
  padding: 10px;
  position:fixed;
  right: 0;
  text-align: center;
  top: 0;
  width: 100%;
  z-index: 9999999;
}
.dev-banner--test span,
.dev-banner--local span {
  border-radius: 8px;
  border: 1px solid rgba(0,0,0,.5);
  font-size: 1.5rem;
  opacity: .8;
  padding: 5px;
}
.dev-banner--test span {background-color: var(--color-danger); color: var(--color-white)}
.dev-banner--local span {background-color: var(--color-warning); color: var(--color-black)}

.notify-when-inert {display: none;}

body[inert] .notify-when-inert {
  align-items:center;
  bottom: 0;
  display: flex;
  justify-content: center;
  left: 0;
  position: fixed;
  right: 0;
  top: 0;
  z-index: 999999999;
}

.article_section-padding {
  padding: var(--section-padding);
}

.alt_section_bg {
  background: var(--alt-section-bg);
  color: var(--tdk-font);
}

.article_section h2 {
  color: var(--color-primary);
  display: block;
  font-size: 2.5rem;
  font-weight: 400;
  line-height: 1.2;
  margin: 0 0 50px 0;
  width: 100%;
}

.link-row_inner {
  padding-bottom: 22px;
  padding-top: 22px;
}
.link-row_title {
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.25rem;
  overflow: hidden;
}
.link-row_desc {
  color: var(--color-text);
  margin-bottom: 7px;
  margin-top: 0;
}
.link-row:hover .link-row_title,
.link-row:focus .link-row_title {
  text-decoration: underline;
}
.link-row {
  border-bottom: none;
  border-top: 1px solid #70707059;
  margin: 0;
  margin-right: 22px;
  padding: 0;
  padding-right: 22px;
  position: relative;
}
.link-row:last-child {
  border-bottom: 1px solid #70707059;
}
.link-row::after {
  border-right: 1px solid var(--color-primary);
  border-top: 1px solid var(--color-primary);
  content: "";
  display: inline-block;
  height: 12px;
  position: absolute;
  right: 6px;
  top: calc(50% - 6px);
  transform: rotate(45deg);
  width: 12px;
}
.link-row--pdf {
  padding-left: 40px;
}
.link-row--pdf::before {
  background: url(/Images/s_get/pdf_icon01.webp) no-repeat center bottom;
  background-size: contain;
  content: " ";
  display: inline-block;
  height: 37px;
  left: 0;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  vertical-align: baseline;
  width: 31px;
  z-index: 1;
}

td > ul > .link-row:first-child {
  border-top: none;
}

td > ul > .link-row:last-child {
  border-bottom: none;
}

.links_block-wrap {
  flex-direction: column;
  display: flex;
  padding: 0 20px 20px 0;
  width: 33.3%;
}

.links_card_A {
  background-color: var(--tdk-base);
  flex: 1;
}

.links_card_A a {
  color: var(--tdk-font);
  display: inline-block;
  height: 100%;
  text-decoration: none;
}

.links_card_A a:hover {
  text-decoration: none !important;
}

.links_card_A .links_image {
  background-color: rgba(0,0,0,.15);
  overflow: hidden;
  padding-bottom: 50.5%;
  position: relative;
}

.links_image img {
  -o-object-fit: cover;
  display: block;
  height: 100%;
  left: 0;
  object-fit: cover;
  position: absolute;
  top: 0;
  transition: transform 0.4s linear 0s,opacity 0.4s linear 0s;
  width: 100%;
  z-index: 1;
}

.links_image img.lambda_link_img {
  -o-object-fit: scale-down;
  background-color: #f4f6f9;
  object-fit: scale-down;
}

.links-card img,
.links-card .links-card_img--B i {
  transition: transform 0.4s linear 0s,opacity 0.4s linear 0s;
}

.links-card:hover img,
.links-card a:focus img,
.links-card:hover .links-card_img--B i,
.links-card a:focus .links-card_img--B i {
  transform: scale(1.05);
}

.links-card .links-card_img--B,
.links-card .links_image {
  transition: transform 0.4s linear 0s,opacity 0.4s linear 0s;
}

.links-card:hover .links-card_img--B,
.links-card a:focus .links-card_img--B,
.links-card:hover .links_image,
.links-card a:focus .links_image {
  opacity: .75;
}

.links_card_A .links_desc {
  background-color: var(--tdk-base);
  flex-grow: 1;
  padding: 20px 20px 30px 20px;
}

.links_title {
  cursor: pointer;
  font-size: 1.125rem;
  line-height: 1.55;
  margin: 0 0 10px 0;
  transition: color var(--transition-medium) 0s;
}

.links_title h1 {
  font-size: 1em;
}

.links_desc .links_title span {
  padding-bottom: 2px;
}

.links-card:hover .links_title {
  color: var(--tdk-accent);
}

.links-card--B {
  display: flex;
  flex-direction: column;
  padding: 0 20px 20px 0;
  width: 50%;
}

.links-card_link--B {
  display: block;
  height: 100%;
}
.links-card_inner {display: flex;height: 100%;min-height: 190px;}
.links-card_img--B {
  align-items: center;
  display: flex;
  flex-grow: 1;
  height: 100%;
  justify-content: center;
  overflow: hidden;
  width: 50%;
}
.links-card_img--B img {max-height: 190px;}
.links-card--B .links-card_content-box {
  background-color: #efefef;
  color: #0a0e14;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 20px;
  width: 50%;
}
.article_section {
  display: flex;
  flex-wrap: wrap;
  margin: 0 auto;
  max-width: var(--max-content-width);
  width: 100%;
}

.bg--tdk-blue {
  background-color: var(--color-primary);
}
.gradient-bg {
  background: rgb(0, 38, 95);
}
.gradient-bg--ACDC {background: radial-gradient(circle, rgba(255, 213, 138, 1) 0%, rgba(255, 154, 138, 1) 15%, rgba(0, 70, 173, 1) 55%, rgba(0, 38, 95, 1) 100%);}
.gradient-bg--DCDC {background: radial-gradient(circle, rgba(142, 223, 161, 1) 0%, rgba(40, 167, 69, 1) 15%, rgba(0, 70, 173, 1) 55%, rgba(0, 38, 95, 1) 100%);}
.gradient-bg--PROG {background: radial-gradient(circle, rgba(157, 215, 224, 1) 0%, rgba(39, 178, 200, 1) 15%, rgba(0, 70, 173, 1) 55%, rgba(0, 38, 95, 1) 100%);}
.gradient-bg--ACS {background: radial-gradient(circle, rgba(204,142,235,1) 0%, rgba(182,50,238,1) 15%, rgba(0,70,173,1) 55%, rgba(0,38,95,1) 100%);}
.gradient-bg--ACCS {background: radial-gradient(circle, #FF84C6 0%, #EB82EB 15%, rgba(0,70,173,1) 55%, rgba(0,38,95,1) 100%); font-size: 5rem; color: var(--color-white);}

.worldwide_banner {
  color: #0a0e14;
  font-weight: 400;
  text-align: center;
}

.worldwide_banner--bg {
  background-image: url("/Images/s_get/top_world_img01_pc.webp");
  background-position: center -80px;
  background-repeat: no-repeat;
  background-size: var(--max-content-width) auto;
}

.worldwide_banner .title {
  color: var(--tdk-accent);
  font-size: 40px;
  font-weight: 400;
  line-height: 1.2;
  margin-bottom: 25px;
}
.worldwide_banner .title.title--white {
  color: var(--color-white);
}
.worldwide_banner .text--white {
  color: var(--color-white);
}

.worldwide_banner .view_more {
  display: flex;
  justify-content: center;
  margin-top: 60px;
}

 .hero {
  background-image: linear-gradient(to right, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0)), url('../pimages/Hero/hero_02.jpg');
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  box-shadow: rgb(0, 0, 0) 3px 3px 6px 0px inset, rgba(0, 0, 0, 0.8) -3px -3px 6px 1px inset;
  margin-bottom: 10px;
  min-height: 469px;
  overflow: hidden;
  position: relative;
 }

 .hero.padding {
  padding: 10px;
 }

 .hero .hero-banner {
  color: var(--color-white);
  padding: 10px;
  position: relative;
  width: calc(100% - 430px);
 }

 .content-fit {
  margin: 0 auto;
  max-width: var(--max-content-width);
  width: 100%;
 }

.content-fit h6 {
  color: #747474;
  line-height: 28px;
}

.input_container--b {
  background-color: var(--alt-section-bg)e;
  border: 1px solid rgba(0, 0, 0, .125);
  border-radius: 3px;
  display: inline-block;
  margin-bottom: 5px;
  margin-right: 5px;
}

.input_container--b > label {
  padding-left: 8px;
}

.input-voltage-group > .input_container--b input {
  border: none;
  border-bottom-left-radius: 0;
  border-left: 1px solid rgba(0, 0, 0, .25);
  border-top-left-radius: 0;
  width: auto;
}

.input-voltage-group > .input_container--b > .validate-input-container {
  display: inline-block;
  width: auto;
}

.has-shadow {
  box-shadow: rgba(0, 0, 0, 0.24) 0px 2.25px 5.33px;
}

.has-border-r {
  border-right: 1px solid var(--color-light);
}

 .btn_tdk {
  border-radius: 3px;
  display: inline-block;
  font-weight: 400;
  min-width: 180px;
  padding: 11px;
  position: relative;
  text-align: center;
  text-decoration: none;
  transition: background-color var(--transition-medium) 0s,border-color var(--transition-medium) 0s,color var(--transition-medium) 0s;
}

.btn_tdk.arrow::before {
  background: var(--color-white);
  bottom: 0;
  clip-path: polygon(0% 0%, 0% 100%, 100% 50%);
  content: "";
  display: inline-block;
  height: 1.0417em;
  margin: auto;
  margin-right: .5em;
  position: relative;
  top: -2px;
  vertical-align: middle;
  width: .5em;
}

 .btn_tdk.btn_primary_A {
  background: linear-gradient(to right, var(--color-primary) 0%, #1132ff 15%, #0087ff 100%);
  color: var(--color-white);
}

.btn_tdk.btn_primary_A:hover,
.btn_tdk.btn_primary_A:focus {
  background-color: #336bbd;
  border-color: #336bbd;
}

 .btn_tdk.btn_primary_B {
  background-color: var(--color-white);
  border: 1px solid var(--color-white);
  color: var(--color-primary);
}

.btn_tdk.btn_primary_B:hover {
  background-color: #D1D1D1;
  border-color: #D1D1D1;
}

 .btn_tdk.btn_tertiary_A {
  background-color: var(--color-white);
  border: 1px solid var(--color-primary);
  color: var(--color-primary);
}

.btn_tdk.btn_tertiary_A:hover {
  border-color: #99B5DE;
}

 #UIBar {
  bottom: 0;
  height: 200px;
  left: 0;
  pointer-events: none;
  position: fixed;
  right: 0;
  width: 100%;
  z-index: 1052;
}

#UIBar iframe {
  bottom: 20px;
  position: absolute !important;
  right: 20px;
}

footer {
  color:var(--tdk-secondary-font);
}

.social-media-all-page {
  background: linear-gradient(to right, var(--color-primary) 0%, #1132ff 15%, #0087ff 100%);
  color: var(--tdk-secondary-font);
  font-size: 30px;
  padding: 90px 50px 100px 50px;
}

.social-media-all-page span{
  align-items: baseline;
  display: flex;
  flex-wrap: wrap;
  font-weight: 400;
  line-height: 1.2;
  margin-bottom: 50px;
}

.social-icon a{
  padding-left: 35px;
  padding-right: 35px;
}

.footer-megamenu {
  background-color: var(--color-white);
  padding: 60px 50px 60px 50px;
  color: #171717;
}

.footer-navbar{
  font-size: 11px;
  margin: 0 auto;
  max-width: var(--max-content-width);
  width: 100%;
}

.footer-megamenu .megamenu-ul{
  flex-wrap: wrap;
  line-height: 2.3;
  list-style: none;
  margin: 0 -30px -30px 0;
  padding-left: 0;
  padding-top: 50px;
}

.megamenu-ul > li {
  padding: 0 30px 30px 0;
}

.footer-megamenu .megamenu-ul a:hover{
  text-decoration: none;
}

.megamenu-li-title {
  display: inline-block;
  height: 100%;
}

.megamenu-li-title > span {
  background-image: linear-gradient(to right,#171717,#171717);
  background-position: bottom left;
  background-repeat: no-repeat;
  background-size: 0% 1px;
  padding-bottom: 2px;
  transition: background-size var(--transition-medium) 0s;
}

.megamenu-sub-ul li {
  margin-bottom: 4px;
}

.megamenu-li-title:hover > span,
.megamenu-li-title:focus-within > span {
  background-size: 100% 1px;
}

.megamenu-sub-ul {
  padding-left: 0;
}

/* V10 settings from UK website */
#strapline {
  background-color: #f4f6f9;
  height: 81px;
  position: relative;
  text-align: center;
  z-index: 100;
}

#strapline img {
  height: auto;
  padding: 15px 0;
}

#siteID {
  display: flex;
  font-family: noto-sans, sans-serif;   /* If changing this, ensure it is handled in the 'HtmlToPdf' classes */
  line-height: 24px;
}

#siteID img{
  height:auto;
  margin-right:15px;
  vertical-align:baseline;
}

#siteHeader {
  background:linear-gradient(to right, var(--color-primary) 0%, #1132FF 15%, #0087ff 100%);;
  font-family: noto-sans, sans-serif; /* If changing this, ensure it is handled in the 'HtmlToPdf' classes */
  height: 5.9375rem;
  position:relative;
  width:100%;
  z-index: 1054;
}

#siteHeader a{
  color:var(--color-white);
}

#siteHeader div.siteID a {
  text-decoration:none;
}

#siteHeader div.siteID h1 {
  border-left: 1px solid #356eff;
  color: var(--color-white);
  font-size: 13px;
  font-weight: bold;
  padding-left: 15px;
  text-transform: uppercase;
}

#siteHeader h1.header_h1 {
  display: inline;
  font-size: 14px;
}

#siteHeader .inner .header_home-link:hover,
#siteHeader .inner .header_home-link:focus {
  opacity: .8;
}

#siteHeader .inner{
  color:var(--color-white);
  height:inherit;
  margin:0 auto;
  max-width:var(--max-content-width);
  padding:20px 0 13px;
  position:relative;
}

#siteFunction{
  font-size:11px;
  height:25px;
  max-width: 70%;
  position:absolute;
  right:0;
  top:20px;
}
#siteFunction > ul {
  display: flex;
  gap: 12px;
  margin: 0;
  padding: 0;
  position: relative;
  z-index: 2;
}
#siteFunction > ul > li:last-child {
  margin-bottom: 12px;
}

#siteFunction ul li {
  text-overflow: ellipsis;
  text-wrap: nowrap;
}
#siteFunction ul li > *:hover,
#siteFunction ul li > *:focus {
  opacity: 1;
  text-decoration: none;
}

#siteFunction div.lang {
  display: inline-block;
}

#siteFunction .list-unstyled {
  margin-bottom: 0;
}

.site-function__dropdown {
  background: var(--color-white);
  border-radius: 1.2em;
  display: none;
  position: absolute;
  text-align: left;
  transition: opacity 0s ease .3s;
}

.profile-settings .site-function__dropdown button,
.profile-settings .site-function__dropdown a {
  color: var(--color-primary);
  display: inline-block;
  font-size: 14px;
  padding: 10px;
  text-align: left;
  text-wrap: nowrap;
  width: 100%;
}

.profile-settings .site-function__dropdown form {
  margin-bottom: 0px;
}

.profile-settings .site-function__dropdown span {
  color: var(--color-primary);
  display: inline-block;
  font-size: 10px;
  padding-left: 10px;
  padding-right: 10px;
  text-align: left;
  text-wrap: nowrap;
  width: 100%;
}

.profile-settings .site-function__dropdown button:hover {
  opacity: 1;
}

.profile-settings .site-function__dropdown ul > li:first-child {
  border-top: none;
}

#siteHeader .profile-settings .site-function__dropdown ul li {
  width: auto;
}

.profile-settings .list-unstyled {
  border-radius: 1.2em;
  overflow: hidden;
}

.on .site-function__dropdown {
  display: block;
  opacity: 1;
  transition: opacity 0s ease 0s;
}

.region__menu-inner {
  display: flex;
}

.region__menu ul {
  padding: 11px;
}

.region__menu-title {
  margin-bottom: 1.5em;
}

#siteHeader a.region__menu-item--selected {
  color: rgba(255,255,255,.5);
  cursor: default;
  pointer-events: none;
}

.header-function_log-in {
  background: none;
  border: none;
}

.header-function_link {
  background: none;
  border: none;
  color: var(--color-white);
  font-size: 1.2em;
  opacity: .8;
}

.header-function_link:hover,
.header-function_link:focus {
  opacity: 1;
  text-decoration: none;
}

/*Referenced in tdk.v10.custom.js*/
div.toggle a.close {
  opacity: 1;
}

@font-face {
  font-display: swap;
  font-family: tdk;
  font-style: normal;
  font-weight: 400;
  src: url(../v10/_fonts/tdk.woff?v2.0) format('woff');
}

@font-face {
  font-family: noto-sans; /* If changing this, ensure it is handled in the 'HtmlToPdf' classes */
  src: url(../fonts/notosans-regular-webfont.woff?v1.0) format("woff");
  font-display: swap;
}

#global {font-size: 13px; clear:both; width:100%; height:35px; left:0; bottom:0;}
#global>ul{float:left; clear:both; list-style-type: none; padding: 0; margin: 0; z-index:3000; margin-bottom:0; position: absolute; bottom: 0;}
#global>ul>li{float:left; margin-right:26px; background:none; padding:0;font-size: 13px;}
#global>ul>li>a{text-decoration:none; padding:0 0; display:inline-block; height:35px; line-height:35px;}
#global>ul>li.on>a {color: #b8eeff;text-decoration: underline;}
#global>ul>li>ul{float:none; display:none; position:absolute; left:0; top:35px; width:280px; box-shadow:0 0 10px rgba(0,51,204,.8); background:#039;}
#global>ul>li>ul>li{display:block; width:100%; height:auto; line-height:20; clear:both; font-size:12px;}
#global>ul>li>ul>li>a{display:block; width:100%; line-height:1.4; padding:8px 15px; height:auto; border-top: solid 1px #3a619a !important; position: relative}
#global>ul>li>ul>li>a:first-child{ border-top: none}
#global>ul>li>ul>li>a::after{content:"";display: inline-block;width:6px;height:6px;border-top:1px solid var(--color-white);border-right:1px solid var(--color-white);transform: rotate(45deg);position: absolute;right:10px;top: 13px;}
#global>ul>li>ul>li>a:hover{background:rgba(255,255,255,.2);}
#global>ul>li>a+i{display:none;}
#global .toggle{display:none;}
#global::after,
#global ul::after{content:''; display:block; clear:both;}

.mega-menu_container {
  display: none;
  left: 0;
  margin-left: -90px;
  position: absolute;
  z-index: 9999;
}

.mega-menu_li.on .mega-menu_container {display: block;}
.mega-menu_li .mega-menu_submenu {background:var(--color-primary); max-width: calc(var(--max-content-width) + 180px); margin: 0 auto;padding: 0 90px; position: relative;}
.mega-menu_icon-close {position: absolute; right: 10px; top: 10px; color: var(--color-white); z-index: 9999; font-size: 1.5em;}
.mega-menu_submenu-inner {display: flex;max-width: var(--max-content-width); margin: auto; width: var(--max-content-width);}
.mega-menu_submenu-li:hover {color: #b8eeff}
#siteHeader .mega-menu_submenu-li:hover .mega-menu_submenu-link {color: #b8eeff; text-decoration: underline}
.mega-menu_column {border-right: 1px solid rgba(255, 255, 255, 0.1); padding: 21px 18.5px 21px 0; position: relative; width: 33.33333%}
.mega-menu_column--1 {width: 33.33333%}
.mega-menu_column--2 {width: 66.66666%}
.mega-menu_column.mega-menu_column--1 ul {padding-left: 0;}
.mega-menu_submenu-li {padding-left: 15px; position: relative}
.submenu-li_pointer {position: absolute; left: 0; font-size: .8em; top: 5%;}
.mega-menu_submenu-link {display: inline-block;margin-bottom: 20px;width: 100%;}
.mega-menu_feature-section-title {color: var(--color-white);position: relative;font-size: 16px;margin-bottom: 23px;padding: 4px 0 0 20px;}
.mega-menu_feature-list {display: flex;flex-wrap: wrap;width: 100%;}
.mega-menu_feature-item {width: 50%;}
.mega-menu_feature-padding {padding: 0 20px 20px 20px;}
.mega-menu_feature-item-img {width: 100%;height: auto;}
.mega-menu_feature-item-title {color: var(--color-white);font-size: 16px;line-height: 18px;padding: 18px 0 12px;display: block;}
.mega-menu_feature-item-desc {color: #ccc;font-size: 13px;line-height: 18px;text-decoration: none;display: block;}
.mega-menu_feature-item-link:hover {text-decoration: none !important;}
.mega-menu_feature-item-link:hover .mega-menu_feature-item-img {opacity: .8}
.mega-menu_feature-item-link:hover .mega-menu_feature-item-title {color: #b8eeff;text-decoration: underline;}
.mega-menu_feature-item-link:hover .mega-menu_feature-item-desc {color: var(--color-white);text-decoration: none;}

/* element > element selector. Select any .wrapper class that is immediate child of #siteFooter id*/
#siteFooter>.wrapper {
  margin: 0 auto;
  max-width: var(--max-content-width);
  padding-bottom: 0px;
  padding-left: 0px;
  padding-right: 0px;
  padding-top: 0px;
}

#siteFooter{
  background:#e4e4e4;
  color: #171717;
  font-size: 12px;
  line-height: 20px;
  padding: 17px 0 15px;
  position:relative;
  z-index:100;
}

#siteFooter a:hover,
#siteFooter a:focus {
  text-decoration: underline;
}

#siteFooter .subLinks {
  clear: both;
  margin-bottom: 0;
  margin-top: auto;
}

#siteFooter .subLinks li {
  display: inline-block;
  margin-right: 20px;
}

#siteFooter .subLinks p {
  margin: 0;
  text-align: right;
}

footer a,
footer a:hover{
  color:inherit;
}

a.searchSelected::before {
  color: #ff0000;
  content:'\2713';
  display: inline-block;
  font-family: "tdk";
  margin-left: -1.3em;    /* same as padding-left set on a.priceSearchList below */
  width: 1.3em;   /* same as padding-left set on a.priceSearchList below */
}

a.priceSearchList {
  padding-left: 1.3em;    /* If changing this, need to change the 2 entries above to the same size*/
}

.input-mini {
  width: 60px;
}

.input-small {
  width: 90px;
}

button.info {
  background-image: url('../pimages/template/ibutton.png');
  background-repeat: no-repeat;
  height: 16px;
  width: 16px;
}

ul.results {
  padding-left: 10px;
}

ul.v8icon {
  float: right;
  height: 110px;
  list-style: none;
  padding-bottom: 30px;
  padding-left: 0;
}

ul.v8icon>li {
  background-position: center top !important;
  background-repeat: no-repeat !important;
  display: inline-block;
  height: 95px;
  padding-left: 0;
  text-align: center;
  vertical-align: top;
  width: 83px;
}

ul.v8icon>li.help {
  background: url('../pimages/icons/question-mark.gif');
}

ul.v8icon>li>a {
  -webkit-appearance: inherit;
  appearance: inherit;
  color: #333333;
  display: block;
  padding-top: 87px;
  text-decoration: none;
}

ul.v8icon>li:hover {
  background-position: center 5px !important;
}

ul.v8icon>li>a:hover {
  color: var(--color-black);
  padding-top: 92px !important;
}

/* FLAG SETUP FOR DROPDOWN LINK OPTIONS */
/* ---------------------------------------------------------------------------- */


.card-header {
  border-radius: 0px;
}

hr.narrow {
  margin: 5px 0;
}

.table.nodiv td, .table.nodiv th {
  border: none;
  border-top: none;
}

.table#nodiv, .table#nodiv td, td.nodiv {
  border: 0;
}

.table {
  margin-bottom: 2px;
}

form {
  margin-bottom: 5px;
}

.config_heading {
  font-size: 14pt;
  font-weight: bold;
  margin-bottom: 10px;
  margin-top: 10px;
}

div.title {
  font-size: 18px;
  font-style: normal;
  font-weight: normal;
  margin: 3px;
  text-align: center;
  width: auto;
}

.config_textbox {
  font-size: 16px;
  height: auto;
  margin: 1px 0 1px 0;
  min-height: 20px;
  padding: 2px 2px;
}

.configResultsCompetitor {
  background-color: #c0c0c0 !important;
  border-color: #c0c0c0 !important;
}

/*Above this is for config program only*/

/* PAGE STYLES */

hr {
  border: 0;
  border-bottom: 1px dotted #666;
}

/* MISC STYLES */

.price {
  height: auto;
}

.priceBreak {
  border: 0;
}

.table>thead>tr>th, .table>thead>tr>td {
  border: 0;
}

.table>thead>tr>td.priceBreaksLeftBorder {
  border-left: 1px solid #ddd;
  text-align: center;
}

.table tbody tr.suppressed>td {
  background-color: rgba(25, 74, 78, 0.25);
}

.table tbody td.suppressed {
  background-color: #D7DED3 !important;
}

/* Used in SpreadsheetUpload.jsp */
#dropdown {
  min-width: 980px;
}

#dropdown li {
  align-items: center;
  background-color: var(--alt-section-bg);
  display: flex;
  gap: 5px;
  justify-content: space-between;
  margin: 0px;
  padding: 5px 5px 5px 5px;
}

#dropdown li:nth-child(odd) {
  background-color: #ccc;
}

.form-control {
  display: inline-block;
}

/* Used in priceManagers.jsp */
.static-selector {
  width: 100% !important
}

/* Used in search.jspf and searchResults.jspf */
.cursor-hand {
  cursor: pointer;
}

/* Used in specialPrice.jspf */
.close-other {
  color: var(--color-black);
  filter: alpha(opacity = 20);
  font-size: 18px;
  line-height: 1;
  opacity: .2;
  text-shadow: 0 1px 0 var(--color-white);
}

.close-other:hover, .close-other:focus {
  color: var(--color-black);
  cursor: pointer;
  filter: alpha(opacity = 50);
  opacity: .5;
}

/* Used in specialPrice.jspf */
button.close-other-button {
  -webkit-appearance: none;
  appearance: none;
  background: transparent;
  border: 0;
  cursor: pointer;
  padding: 0;
}

/* Used in specialPriceCalculator.js */
.blinking-cell {
  color: red !important;
}

/*        ============================================      */

section {
  left: 0;
  position: relative;
  top: 0;
}

button.close {
  padding-right: 10px;
}

div.caption p {
  margin-left: 40px;
}

.condensed {
  white-space: nowrap;
}

table.condensed>tbody>tr>td, table.condensed>thead>tr>td, table.condensed>tfoot>tr>td {
  padding: 5px;
}

table.outputs>thead>tr>th {
  padding-bottom: 0;
}

/* Used in vega/outputs.jspf, configEntry/outputs.jspf, inputVoltage_dc.jspf */
table.outputs>tbody>tr>td, table.outputs>thead>tr>td, table.outputs>tfoot>tr>td {
  padding-bottom: 2px;
  padding-top: 2px;
}

.thumbnail > img {
  max-height: 250px;
  max-width: 250px;
}

/* used in module_updateFilter.mjs, vega/pricing.jspf */

input {
  padding-left: 5px;
}

input.form-control-sm {
  padding: 5px 10px;
}

input.config_textbox {
  max-width: 100%;
  padding: 2px 6px;
}

#searchOptions ul li a {
  padding-right: 40px !important;
  position: relative;
}

/* For the output power table */
.table.psu-power th, .table.psu-power td {
  padding: 2px;
}

input:invalid {
  border-color: red;
  border-width: medium;
}

/* css selectors for the privacy policy parts */
.highlightLabelWhite:not(:checked) + span {
  color: red;
  font-weight: bold;
}

.highlightLabelWhite:not(:checked) + span > .privacylink {
  color: red;
}

.highlightLabelBlack:not(:checked) + span {
  color: red;
  font-weight: bold;
}
.highlightLabelBlack:not(:checked) + span > .privacylink {
  color: red;
}

.highlightLabelBlack:checked + span > .privacylink {
  color: black;
}
/* end of privacy policy selectors */

.header_cta-container {
  bottom: -2px;
  display: inline-flex;
  float: right;
  gap: 5px;
  position: relative;
}

.header_cta-container .searchbar {
  margin-bottom: 0;
}

.header_btn-cta {
  border: 1px solid #D2DAE5;
  border-radius: 3px;
  box-sizing: border-box;
  color: #D2DAE5;
  height: 30px;
  padding: 0 .25rem;
  position: relative;
}

.header_btn-cta:hover {
  color: #4D7EC6;
}

.header_btn-cta--basket {
  float: right;
}

.basket_counter {
  background: black;
  border: 1px solid var(--color-white);
  border-radius: 100%;
  color: var(--color-white);
  height: 20px;
  position: absolute;
  right: -8px;
  top: -5px;
  width: 20px;
}

.basket_counter.red {
  animation: flash-red .75s linear;
}

.basket_counter.green {
  animation: flash-green .75s linear;
}

@keyframes flash-red {
  0% {background-color: var(--color-danger);}
  100% {background-color: black;}
}

@keyframes flash-green {
  0% {background-color: var(--color-success);}
  100% {background-color: black;}
}

/* search bar css */
.searchbar {
  display: inline-flex;
}

.searchbar_input {
  background: none;
  border: 1px solid var(--color-white);
  border-radius: 3px 0 0 3px;
  box-sizing: border-box;
  color: var(--color-white);
  flex: auto;
  font-size: 13px;
  height: 30px;
  line-height: 30px;
  padding-left: 6px;
  width: 20em;
}

.searchbar_input:focus {
  background: var(--color-white);
  color: #666666;
}
.searchbar_input:focus::placeholder {
  color: #888888;
}

.searchbar_input::placeholder {
  color: rgba(255,255,255,.8);
}

.header_btn-cta--searchbar {
  background: var(--color-white);
  border: 1px solid var(--color-white);
  border-left: none;
  border-radius: 0 3px 3px 0;
  color: var(--color-primary);
  overflow: hidden;
  width: 40px;
}

.header_btn-cta--searchbar .navBarLoader.TR_Loader__small {
  display: inline-block;
  font-size: 2px;
  height: 100%;
  position: relative;
  top: 3px;
}
/* end of searchbar css */

/*tooltip css */
.has-tooltip {
  position: relative;
}

.has-tooltip .tooltiptext {
  background-color: var(--color-white);
  border: 1px solid #ccc;
  border-radius: 1.2em;
  box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
  color: #0a0e14;
  font-size: 14px;
  min-width: 200px;
  opacity: 0;
  padding: 10px;
  position: absolute;
  transition: opacity 0.3s ease, visibility .3s ease;
  text-align: left;
  visibility: hidden;
  z-index: 1056;
}

.tooltiptext.warning {
  background-color: var(--color-danger);
}

.tooltiptext.left.warning::after {
  border-color: transparent transparent transparent var(--color-danger);
}

.tooltiptext.top {
  bottom: 100%;
  left: 50%;
  margin-left: -125px;
}

.tooltiptext.bottom.search-tooltip {
  left: auto;
  margin-left: -125px;
  min-width: 400px;
  right: 0;
}

.tooltiptext.bottom {
  left: 50%;
  margin-left: -125px;
  margin-top: 10px;
  top: 100%;
}

.tooltiptext.right {
  left: 105%;
  top: -5px;
}

.tooltiptext.left {
  right: 105%;
  top: -5px;
}

.tooltiptext::after,
.tooltiptext::before {
  border-style: solid;
  content: "";
  position: absolute;
}

.tooltiptext::before {border-width: 9px}
.tooltiptext::after {border-width: 8px}

.tooltiptext.top::after,
.tooltiptext.top::before {
  left: 50%;
  top: 100%;
}
.tooltiptext.top::after{
  border-color: var(--color-white) transparent transparent transparent;
  margin-left: -8px;
}
.tooltiptext.top::before {
  border-color: #ccc transparent transparent transparent;
  margin-left: -9px;
}

.tooltiptext.bottom::after,
.tooltiptext.bottom::before {
  bottom: 100%;
  left: 50%;
}

.tooltiptext.bottom::after{
  border-color: transparent transparent var(--color-white) transparent;
  margin-left: -8px;
}
.tooltiptext.bottom::before {
  border-color: transparent transparent #ccc transparent;
  margin-left: -9px;
}

.tooltiptext.right::after,
.tooltiptext.right::before {
  right: 100%;
	top: 20px;
}

.tooltiptext.right::after{
  border-color: transparent var(--color-white) transparent transparent;
  margin-top: -8px;
}
.tooltiptext.right::before {
  border-color: transparent #ccc transparent transparent;
  margin-top: -9px;
}

.tooltiptext.left::after,
.tooltiptext.left::before {
  left: 100%;
  top: 50%;
}

.tooltiptext.left::after{
  border-color: transparent transparent transparent var(--color-white);
  margin-top: -8px;
}
.tooltiptext.left::before {
  border-color: transparent transparent transparent #ccc;
  margin-top: -9px;
}

.has-tooltip:hover .tooltiptext {
  opacity: 1;
  transition: opacity 0.3s ease .6s, visibility .3s ease .6s;
  visibility: visible;
}

/* end of tooltip css */

.header_sticky-logo {
  display: none;
}

#global > ul > li.header_sticky-logo > a {
  line-height: normal;
}

.site-function__currency-price-display {
  position: absolute;
}

@media only screen and (max-width: 1440px) {
   :root {
    --max-content-width: 1200px;
   }
 }

 @media only screen and (max-width: 1240px) {
   :root {
    --max-content-width: 980px;
   }
 }


@media screen and (min-width:984px){
 #container {
  min-height: 90px;
 }
 #siteHeader.header--pc-sticky {
  transition: var(--transition-slow)-in-out transform;
 }
 .header--pc-sticky #siteFunction {
  display: none;
 }
 .header--pc-sticky .site-function__currency-price-display {
  display: none;
 }
 #siteHeader.header--pc-sticky {
  border-bottom: 1px solid var(--tdk-outline);
  box-shadow: var(--shadow-default);
  position: fixed;
  top: -90px;
  transform: translateY(45px);
 }
 .header--pc-sticky #global>ul>li>a {
  font-size: 1rem;
 }
 #siteHeader.header--pc-sticky .header_sticky-logo {
  display: block;
  margin-top: -1.5px;
 }
 .header_btn-cta--basket {
  background: var(--color-white);
  border: 1px solid #4D7EC6;
  bottom: -2px;
  color: var(--color-primary);
  margin-left: 1rem;
 }
 .header_btn-cta--basket:hover {
  border: 1px solid #4D7EC6;
  color: #4D7EC6;
 }
 .header--pc-sticky #global {
   bottom: -40px;
   position: relative;
 }
 .header--pc-sticky .header_btn-cta--basket {
   bottom: -38px;
   position: relative;
 }
 .header--pc-sticky .searchbar {
   top: -4px;
 }
 .header--pc-sticky #siteID {
   display: none;
 }
 .site-function__dropdown {border: 1px solid #ccc;}
 .on .site-function__dropdown::after {
   border: 8px;
   border-color: transparent transparent var(--color-white) transparent;
   border-style: solid;
   content: "";
   display: inline-block;
   left: 54px;
   position: absolute;
   top: -15px;
   z-index: 2;
 }

 #siteHeader .site-function__dropdown ul li.region__menu-title {
   color: #666666;
   border-top: none;
   font-size: 1em;
   font-weight: bold;
   text-wrap: wrap;
 }
 #siteHeader .site-function__dropdown ul li {
   background-color: var(--color-white);
   border-top: 1px solid #ccc;
   box-sizing: border-box;
   color: var(--color-primary);
   display: flex;
   overflow: hidden;
   width: 101px;
 }
 #siteHeader .site-function__dropdown ul li a {
   color: var(--color-primary);
   flex: 1;
 }
  #siteHeader .site-function__dropdown ul li a:hover,
  #siteHeader .site-function__dropdown ul li a:focus,
  #siteHeader .site-function__dropdown ul li button:hover,
  #siteHeader .site-function__dropdown ul li button:focus  {
    background: rgba(0, 70, 173, 0.1);
  }
  #siteHeader .site-function__dropdown ul li.region__menu-title:hover {
    background: none;
  }
  .region__menu-item--selected {
    color: var(--color-primary);
    opacity: .5;
  }
}

/* rules at 984px or smaller */
@media screen and (max-width:984px){
  .basket--open .basket_menu {
    transform: translateX(0);
  }

  .no-mobile-header {
   display: none;
  }

  .basket_menu {
    max-height: 100vh;
    max-width: 100vw;
    min-width: 0;
    overflow: auto;
    padding-top: 50px;
    transform: translateY(-100%);
    width: 100vw;
  }
  .basket_menu {
    width: 100%;
  }
  .basket_backdrop {
   z-index: 1054;
  }
  .header_btn-cta--basket {
   background: none;
   border: none;
   color: var(--color-white);
   height: 40px;
   position: absolute;
   right: 50px;
   top: 3px;
  }
  .basket_counter {
   top: -3px;
  }
  .header_btn-cta--basket .basket_text {
   display: none;
  }
  .header_btn-cta--basket i {
   font-size: 24px;
  }
  .header_btn-cta:hover {
    color: rgba(255,255,255,.8);;
  }
  /* ================================================== section for tablet ================================================== */
  body{-webkit-overflow-scrolling: touch;}
  #container{min-width:217px; z-index: 2999; position: sticky; width: 100%; top: 0;}
  /* site header
  ================================================== */
  #siteHeader{
    height:50px;
	width:100%;
  }
	#siteHeader .inner {
		height: 50px;
		max-width: 100%;
		padding: 0;
		position: relative;
	}
	#siteFunction{position:relative; right:auto; top:auto; font-size:11px; width:auto; height:auto; clear:both; background:var(--color-primary); flex-direction: column;gap: 0; padding: 0; max-width: 100%; order: 2}
  #siteFunction div.region__menu{position: relative; background: none;box-shadow: none;}
  #siteFunction .profile-settings .site-function__dropdown button, #siteFunction .profile-settings .site-function__dropdown a {color: var(--color-white); text-align: left; }
  #siteFunction .profile-settings .site-function__dropdown a:hover, #siteFunction .profile-settings .site-function__dropdown button:hover,
  #siteFunction .profile-settings .site-function__dropdown a:focus, #siteFunction .profile-settings .site-function__dropdown button:focus{color: #B8EEFF;text-decoration: underline;background: none;}
  #siteHeader > ul >  li a, #siteHeader > ul >  li button {width: 100%; display:block; padding:20px 0 24px; background:none;}
  #siteFunction li .site-function__dropdown {background:none; position: relative;box-shadow: none;}
  #siteFunction > ul >  li {width: 100%; text-align: center; padding: 11px 20px;}
	#siteHeader ul {
		align-items: center;
		flex-direction: column;
	}
	#siteHeader ul li a:hover,
  #siteHeader ul li a:focus,
  #siteHeader .header-function_link:hover,
  #siteHeader .header-function_link:focus,
  #siteHeader .header-function_link:hover > a,
  #siteHeader .header-function_link:focus > a {color:#B8EEFF;text-decoration: underline;background: none;}
  #siteHeader div.scroller{overflow:auto; height:calc(100% - 50px); position:fixed; left:0; top:50px; width:100%; background:rgba(0,0,0,.5); display:none; z-index:3000;}
  #siteHeader .toggle{width:40px; height:40px; position:absolute; right:5px; top:5px; display:block; cursor:pointer;}
  #siteHeader .toggle a{display:block; width:40px; height:40px; text-indent:50px; white-space:nowrap; overflow:hidden; cursor:pointer;}
  #siteHeader .toggle a::after{display:block; width:40px; height:40px; text-align:center; text-indent:0; content:'\f0c9'; font-family:"tdk"; font-size:24px; position:absolute; left:0; top:0px;}
  #siteHeader .toggle a.close{display:none;}
  #siteHeader .toggle a.close::after{content:'\f00d'; font-family:"tdk"; font-weight: normal;}
  #global{margin-top:0; position:static; left:auto; bottom:auto; height:auto;display: flex;flex-direction: column;background: var(--color-primary);padding: 10px 0 0;}
  #global ul{float:none; position: relative; padding-top: 20px;}
  #global ul li{float:none; margin-right:0; position:relative; font-size:18px;
    position:relative; cursor:pointer;border-top:1px solid rgba(255, 255, 255, 0.1); padding: 0 20px;}
  #global ul li ul{display:block; position:relative; left:auto; top:auto; width:auto; box-shadow:none; background:var(--color-primary); display:none; padding-left: 0; margin-bottom: 0; width: 100%; padding-top: 0;}
  #global ul li a+a::before{text-align:center; text-indent:0; position:absolute; right: 0;color:var(--color-white); font-size:11px; font-family: "bootstrap-icons"; content: '\F282';opacity: .8; width: 100%;}
  #global ul li a+a:hover::before,
  #global ul li a+a:focus::before {opacity: 1;}
  #global ul li a+a.open::before { content: '\F2EA'; }
  #global ul li:last-child{border-bottom:1px solid rgba(255, 255, 255, 0.1);}
  .header_cta-container {order: -1; top:0; bottom: 0;}
  .searchbar {width: auto; margin: 0 auto; margin-top: 10px;}
  .searchbar_input {border-color: rgba(255, 255, 255, 1);margin-right: 20px;}
  .searchbar_input::placeholder {color: var(--color-white);}
  .header_btn-cta--searchbar {background-color: #336BBD;border-radius: 3px; border: 1px solid #336BBD; width: auto;color: var(--color-white); padding: 0 11px;}
  #searchIconDiv {display: none;}
  .header-function_link {opacity: 1}
  #siteHeader ul.header_dropdown-nav-list {margin-left: 20px;}
  #siteHeader ul.header_dropdown-nav-list>li>a {color: #ededed; padding:12.5px 0;font-size: 13px;}
  #siteHeader ul.header_dropdown-nav-list>li>a::after {border: none;}
  #global ul li a+a.toggle1 {width: 50px;background: #336bbd;}

  /* These should be overridden for smaller screens */
  #siteID{left:10px; top:15px; font-size:14px; position:absolute;}
  .header_logo {padding-left: 0;}
  #siteID img{width:156px; height:17px;}

  #global ul li a{padding:0 0 0 20px; line-height:50px; display:block; height:50px; cursor:pointer;}
  #global ul li a:first-child::after{margin-left:10px;}
  #global ul li a+a{width:50px; height:50px; position:absolute; right:0; top:0; text-indent:110%; white-space:nowrap; overflow:hidden; display:block; cursor:pointer;}
  #global ul li ul li{line-height:1; clear:both; font-size:16px; border-bottom-color:rgba(255, 255, 255, 0.1); position: relative}
  #global ul li ul li a{line-height:1; padding:10px 0 10px 80px; height:auto; color:var(--alt-section-bg); border-top:none !important}
  #global ul li ul li a:hover{color:#B8EEFF;text-decoration: underline;background: none;}
  #global ul li ul li a::after{content:"";display: inline-block;width:7px;height:7px;border-top:2px solid var(--color-white);border-right:2px solid var(--color-white);transform: rotate(45deg);position: absolute;right:25px;top: 13px;}
  #siteHeader #global>ul>li>a {padding: 20.5px 0; line-height: 100%; height: auto;font-size: 1rem;}

  /* End of required overrides for smaller screens */


  /* site footer
  ================================================== */
  .social-media-all-page {padding: 90px 30px 100px 30px;}
  #siteFooter nav{margin:0 -15px; display: block}
  #siteFooter nav ul li li{ font-size:12px; line-height:1.2; font-weight:normal;}
  #siteFooter nav ul li ul{margin-top:5px;}
  #siteFooter nav ul li ul li a{ padding-right: 20px;}
  #siteFooter nav ul li ul li a::after{content:"";display: block;width:6px;height:6px;border-top:1px solid var(--color-white);border-right:1px solid var(--color-white);transform: rotate(45deg);position: absolute; right: 10px; top: 13px;}
  #siteFooter p{line-height:1.2;}
  #siteFooter nav::after{clear:both; display:block; content:'';}

  /* These should be overridden for smaller screens */
  #siteFooter nav div{padding-right:10px;}
  #siteFooter nav ul{margin-bottom:20px;}
  #siteFooter nav ul li{font-weight:bold; margin-bottom:10px;}
  #siteFooter nav ul li a:hover::after{text-decoration:none;}
  #siteFooter nav ul li a:hover{text-decoration:underline;}
  #siteFooter .row {
    --bs-gutter-x: 0;
  }
  /* End of required overrides for smaller screens */
}

/* rules at 768px or smaller */
@media screen and (max-width:768px){
  /* ================================================== section for smartphone ================================================== */
  /* site header
  ================================================== */
  #siteID{left:15px; top:10px; font-size:10px;}
  #global ul li a{padding:0 0 0 15px; line-height:40px; height:40px;}
  #global ul li a+a{width:40px; height:40px;}
  #global ul li ul li{font-size:14px;}
  #global ul li ul li a{padding:6px 0 6px 20px; border: none !important}
  #global ul li ul li a::after{content:"";display: inline-block;width:6px;height:6px;border-top:2px solid var(--color-white);border-right:2px solid var(--color-white);transform: rotate(45deg);position: absolute;right:18px;top: 9px;}

  /* site footer
  ================================================== */
  .social-media-all-page{padding: 70px 20px 70px 20px;}
  .social-media-all-page span{font-size:20px;margin-bottom:30px}
  .social-media-all-page a{padding-left:15px; padding-right:15px;}
  .social-media-all-page .social-icon img{width:29.5px;height:25px;}
  .social-media-all-page .social-icon:nth-child(3) img{width:35.5px}
  .social-media-all-page .social-icon:nth-child(4) img{width:25px;}
  #siteFooter {padding-top: 1rem; padding-bottom: 0; background: var(--color-white); border-top: 1px solid #e4e4e4;}
  #siteFooter ul{width: 100%; font-size: 12px;}
  #siteFooter .wrapper {padding-top: 0;}
  #siteFooter .subLinks {flex-direction: column; text-align: center;}
  #siteFooter .subLinks p{line-height:1.4; margin:0 ; background:#e4e4e4; padding:10px 5px; text-align: center;}
  #siteFooter{font-size: 10px;}

  #siteFooter nav div{padding:0; float:none; clear:both; width:auto;}
  #siteFooter nav ul{margin-bottom:0; /*border-top:1px #ccc solid;*/}
  #siteFooter nav ul li{font-weight:normal; margin-bottom:0; border-bottom:1px #ccc solid;}
  #siteFooter nav ul li a{padding:6px 30px; display:block;}
  #siteFooter nav ul li a::after{content:"";display: block;width:6px;height:6px;border-top:1px solid var(--color-white);border-right:1px solid var(--color-white);transform: rotate(45deg);position: absolute; right: 30px; top: 13px;}
  #siteFooter nav ul li a:hover{text-decoration: none; background: #888}
  #siteFooter nav ul li ul{display:none;}

  #siteHeader {box-shadow: 0 0 10px rgba(0, 0, 0, .8);}
}

@media screen and (min-width: 750px) {

  .inner.flex .flex-item.space-between {
    width:calc(50% - 10px);
  }

 .inner.flex .flex-item.fill-space {
    width: 100%;
  }
}

 @media screen and (max-width: 750px){
  :root{
   --section-padding: 70px 20px 70px 20px;
  }

  .links-card--B {
    padding-right: 0;
	width: 100%;
  }

  .links_block-wrap {
    padding-right: 0;
    width: 100%;
  }

  .article_section {
    flex-wrap: wrap;
  }

  .content-fit {
    margin: 0 12.5px 0 12.5px;
  }

  .hero {
    background-image: linear-gradient(to right, rgba(0, 0, 0, 1), rgba(0, 0, 0, .5)), url('../pimages/Hero/hero_02.jpg');
  }

  .hero .hero-flex {
    flex-wrap: wrap;
    height: auto;
  }

  .hero .hero-banner {
    height: auto;
    margin-bottom: 100px;
    padding: 0;
    width: 100%;
  }

}

@media screen and (max-width: 410px) {
  .header_home-link {
   display: none;
  }
}

@media (min-width: 333px) {
  ul.v8icon>li {
    margin: 15px;
  }
}
@media (max-width: 332px) {
  ul.v8icon>li {
    margin: 5px;
  }
}

@media (max-width: 10px) {
  body {
    margin-left: 0px;
    margin-right: 0px;
  }
}

.hr-separator {
  align-items: center;
	display: flex;
  margin: 15px 0;
  justify-content: center;
  text-align: center;
}

.hr-separator::before,
.hr-separator::after {
  border-bottom: 1px solid var(--color-black);
	content: '';
  flex: 1;
}

.hr-separator:not(:empty)::before {
  margin-right: .25em;
}

.hr-separator:not(:empty)::after {
  margin-left: .25em;
}

/* Sliding Toggle Switch CSS - used in AC Source Configurator */
.sliding-toggle {  /* label and container for the toggle switch */
  display: inline-block;
  height: 34px;
  line-height: 34px;
  padding-right: 60px;
  position: relative;
}

.sliding-toggle:has(input:disabled) .sliding-toggle__inner{
  cursor: default;
  opacity: .5;
}

.sliding-toggle input {
  height: 0;
	opacity: 0;
  width: 0;
}

.slider {
  -webkit-transition: .4s;
  background-color: #ccc;
  border-radius: 34px;
  bottom: 0;
	cursor: pointer;
  position: absolute;
  right: 0;
  top: 0;
  transition: .4s;
  width: 60px;
}

.slider:before {
  -webkit-transition: .4s;
	background-color: white;
  border-radius: 50%;
  bottom: 4px;
  content: "";
  height: 26px;
  left: 4px;
  position: absolute;
  transition: .4s;
  width: 26px;
}

.sliding-toggle input:checked + .slider {
  background-color: var(--color-primary);
}

.sliding-toggle input:focus + .slider {
  box-shadow: 0 0 1px var(--color-primary);
}

.sliding-toggle input:checked + .slider:before {
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}

/* End of Sliding Toggle Switch CSS */

/* Progress loader CSS - used in AC Source Configurator */

.progress-loader {
  display: flex;
  flex-direction: column;
	height: 100%;
  justify-content: center;
	left: 0;
	position: absolute;
  top: 0;
  width: 100%;
  z-index: 1;
}

.progress-loader_inner {
  background-color: #fafcff;
  border: 1px solid rgba(0, 0, 0, 0.125);
  border-radius: 1rem;
  box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;
	margin: 0 auto;
  padding: 10px;
}

.progress-loader_img {
  padding-bottom: 8px;
}

.progress-loader_progress-bar {
  background-color: var(--color-primary);
  border-radius: 3px;
  height: 10px;
  transition: width .8s ease-in-out;
  width: 1%;
}

.progress-loader_text {
  color: var(--color-primary);
  font-size: 1.5rem;
  text-align: center;
}