:root {
 --nav-height: 114px;
--modal-link-color :#ffed00;
--modal-video-control : #ffffff;
}

@media screen and (max-width: 767px) {
	:root {
		 --nav-height: 107px;
	}
      }
      /*------- GENERAL -------*/
      .pdp {
        overflow: clip;
      }
      .pdp-center {
        text-align: center !important;
      }
      .pdp-left {
        text-align: left !important;
      }
      .pdp-right {
        text-align: right !important;
      }
      .pdp-show {
        display: block !important;
      }
      .pdp-visuallyshow {
        opacity: 1 !important;
      }
      .pdp-mobile-show {
        display: none;
      }
      .pdp-mobile-show-inline {
        display: none;
      }
      .pdp-desktop-show {
        display: block;
      }
      /*------- HERO VIDEO -------*/
      .hero-video:after {
        content: '';
        display: block;
        position: absolute;
        top: 0;
       /* box-shadow: inset -1px 1px 30px 40px #000000;'*/
        width: 100%;
        height: 100%;
      }
	.pdp-sup {
    font-size: 75%;
    vertical-align: super;
}
.pdp-flex-center{ justify-content: center !important; }
.pdp-flex-left{ justify-content: left !important; }
.pdp-flex-right{ justify-content: right !important;}

      /*------- VIDEO & CTRLS DISPLAY -------*/
      .pdp-video-cont {
        position: relative;
        max-width: 1200px;
        margin: 0 auto;
        text-align: right;
      }
      .ctrl-nav {
        padding: 6px 12px 0 0;
      }
      .pdp-vid-ctrls {
        padding: 6px 12px 0 0;
      }
      .ctrl-nav button,
      .pdp-vid-ctrls button,
      button.js-modal-close {
        background: transparent;
        padding: 6px;
      }
      /* NEW - to add all icon buttons (modal close) */
      .pdp-vid-ctrls button {
        background: transparent;
        margin: 6px;
        width: 48px;
        height: 48px;
        border: 1px solid var(--modal-video-control);
        border-radius: 50%;
      }
      .modal-content .pdp-vid-ctrls button {
        border-color: var(--modal-video-control);
      }
      .modal-content .pdp-vid-ctrls svg {
        stroke: var(--modal-video-control);
      }
      .ctrl-nav button:focus,
      .pdp-vid-ctrls button:focus,
      button.js-modal-close:focus {
        outline: 0;
      }
      .ctrl-nav svg,
      .js-modal-close svg {
        width: 48px;
        height: 48px;
        fill: none;
        stroke: #fcfbfa;
        stroke-width: 0.75;
      }
      .ctrl-nav svg {
        width: 48px;
        height: 48px;
        fill: none;
        stroke: var(--text-color);
        stroke-width: 0.75;
        stroke-linecap: round;
        stroke-linejoin: round;
      }
      /* NEW - */
      .pdp-vid-ctrls svg {
        width: 80%;
        height: 100%;
        fill: none;
        stroke: var(--text-color);
        stroke-width: 1;
        stroke-linecap: round;
        stroke-linejoin: round;
      }
      /*------- POP UP MODAL -------*/
      .modal-src-link {
        display: flex;
        align-items: center;
        margin-top: 12px;
      }
      .modal-src-link-icon {
        margin-right: 6px;
        /*    border: 1px solid #2a2a2a;*/
        border-radius: 50%;
        width: 36px;
        height: 36px;
      }
      .modal-src-link-icon svg {
        width: 80%;
        height: 100%;
        fill: none;
        stroke: var(--modal-link-color);
        stroke-width: 1;
        stroke-linecap: round;
        stroke-linejoin: round;
      }
      .modal-src-link-text {
        color: var(--modal-link-color) !important;
        align-self: center;
        margin-bottom: 0;
        text-decoration: none;
      }
      .modal-src-link-text:hover {
        text-decoration: underline !important;
        cursor: pointer;
      }
      .js-modal-close svg {
        width: 48px;
        height: 48px;
        fill: none;
        stroke: #fcfbfa;
        stroke-width: 0.75;
        stroke-linecap: round;
        stroke-linejoin: round;
      }
      .js-modal-src {
        /*
	display: flex;
    text-align: left;
    gap: 15px;
    justify-content: center;
    width: 90%;
    margin: 0 auto;
*/
      }
      .js-modal-cont {
        display: none;
        position: fixed;
        top: var(--nav-height);
        left: 0;
        width: 100%;
        height: calc(100% - var(--nav-height));
        overflow: auto;
        background-color: #040f1c;
        background-color: rgba(4, 15, 28, 0.8);
        backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
        opacity: 0;
        transition: 1s all ease;
        z-index: 4;
      }
      /*------- HOTSPOT -------*/
      .interactive-hotspot-contain {
        --coord-x: 0;
        --coord-y: 0;
        transform: translate(var(--coord-x), var(--coord-y));
		transition: 1s all ease;
      }
     .interactive-hotspot-point.w-active {
        transform: scale(1.25);
      }
      .interactive-hotspot-point.w-active .interactive-point-centre {
        outline: 3px solid #00fffc;
        background-color: #28807f;
      }
  /*    
.interactive-hotspot::after {
    content: '';
    display: block;
    position: absolute;
    bottom: -1px;
    right: 0;
    width: 100%;
    height: 15%;
    background: rgb(4,15,28);
    background: linear-gradient(0deg, rgb(4,15,27,0.95) 10%, rgba(4,15,28,0) 100%)
}
*/
      /*------- TABS -------*/
      .tabs::after {
        content: '';
        display: block;
        position: absolute;
        top: 0;
        right: 0;
        width: 10%;
        height: 68px;
       background: linear-gradient(270deg, rgb(255 228 0) 0%, rgb(255 228 0 / 0%) 100%);
}
/*
      .pdp .a-tab-menu-single:after {
        content: '';
        display: block;
        position: absolute;
        right: 0;
        width: 1px;
        height: 28px;
        background-color: #897a00;
      }
*/
      /*------- SLIDER -------*/
      .w-slider-dot {
        color: #D3D3D3 !important;
        background: none !important;
        border: 3px solid #D3D3D3 !important;
      }
      .w-slider-dot.w-active {
        background: #D3D3D3 !important;
        border: 3px solid #D3D3D3 !important;
      }

/*------- TABS DIVIDER -------*/
      .pdp .a-tab-menu-w25:after {
        content: '';
        display: block;
        position: absolute;
        right: 0;
        width: 1px;
        height: 28px;
        background-color: #897a00;
      }
		.pdp .a-tab-menu-w25:last-child:after {
			width: 0;
		}
		  
      @media screen and (max-width: 767px) {
        .pdp-mobile-show {
          display: block;
        }
        .pdp-mobile-show-inline {
          display: inline-block;
        }
        .pdp-desktop-show {
          display: none;
        }
		  .w-slider-dot {
        color: #D3D3D3 !important;
        background: none !important;
        border: 3px solid #D3D3D3 !important;
      }
      .w-slider-dot.w-active {
        background: #D3D3D3 !important;
        border: 3px solid #D3D3D3 !important;
      }
     .pdp-flex-left{ 
	justify-content: center !important; }
		  
        /*------- USP -------*/
        .usp-tiles-row:first-child {
          margin-top: 0px;
        }
        /*
.pdp-vid-ctrls svg{
    width: 36px;
    height: 36px;
}
*/
        .modal-src-link-icon {
          width: 32px;
          height: 32px;
        }
        .pdp .modal-src-link-text {
          font-size: 16px;
        }
		  
/*------- MOBILE PORTRAIT -------*/
@media screen and (max-width: 479px) {
	.hero-video:after{
		box-shadow: none;
/*		box-shadow: inset -1px 1px 20px 10px var(--hero-video-fade-color);*/
	}
	.tile-img img {
        max-width: none;
    }
