.x13gpsr__backdrop { position: fixed; top: 0; right: 0; bottom: 0; left: 0; overflow-x: hidden; overflow-y: auto; z-index: 16384; } .x13gpsr__backdrop--16 p, .x13gpsr__backdrop--16 .x13gpsr__btn { font-size: 14px !important; } .x13gpsr__backdrop--16 .x13gpsr__box-title { font-size: 18px !important; } .x13gpsr__box { position: relative; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; min-height: 100%; padding: 20px; } .x13gpsr__box::before { content: ""; display: block; position: absolute; top: 0; left: 0; right: 0; bottom: 0; opacity: var(--x13gpsr-backdrop-opacity, 0.4); background-color: var(--x13gpsr-backdrop-bg, #000000); background-image: var(--x13gpsr-backdrop-image, none); background-position: center; background-size: cover; background-attachment: fixed; z-index: -1; } .x13gpsr__box--fixed { -webkit-justify-content: flex-end; justify-content: flex-end; -webkit-align-items: stretch; align-items: stretch; padding: 0; } .x13gpsr__box--fixed .x13gpsr__box-inner { margin-right: 0; } .x13gpsr__box-inner { position: relative; z-index: 2; width: 100%; margin: 0 auto; min-height: var(--x13gpsr-popup-height, 1px); max-width: var(--x13gpsr-popup-width, 500px); background-color: var(--x13gpsr-popup-bg, #ffffff); border-radius: var(--x13gpsr-popup-radius, 0px); border: 0; } .x13gpsr__box-header { position: -webkit-sticky; position: sticky; top: 0; display: -webkit-flex; display: flex; -webkit-align-items: flex-start; align-items: flex-start; -webkit-justify-content: space-between; justify-content: space-between; gap: 10px; background: #FFFFFF; padding: var(--x13gpsr-popup-padding, 15px); background-color: #fff; border-bottom: 1px solid #e5e5e5; } .x13gpsr__box-title { margin: 0; font-weight: 700; font-size: 20px !important; margin-bottom: 0 !important; pointer-events: auto; } .x13gpsr__box-body { padding: var(--x13gpsr-popup-padding, 15px); } .x13gpsr__nav { display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; position: -webkit-sticky !important; position: sticky !important; top: 0; z-index: 2; background-color: #fff; border-bottom: 1px solid #e5e5e5; padding: 0; margin-top: calc(var(--x13gpsr-popup-padding, 15px) * -1); margin-bottom: 20px; list-style: none; } .x13gpsr__nav-item { -webkit-flex: 1; flex: 1; max-width: 100%; padding: 0 !important; margin: 0 0 -2px !important; } .x13gpsr__nav-link { display: grid !important; place-items: center !important; height: 100% !important; padding: 10px var(--x13gpsr-popup-padding, 15px) !important; margin: 0 !important; color: #232323 !important; font-weight: 700 !important; text-shadow: none !important; text-decoration: none !important; font-size: 14px !important; text-align: center !important; border: 0 !important; border-bottom: 3px solid transparent !important; } .x13gpsr__nav-link:active, .x13gpsr__nav-link:hover { color: #232323 !important; } .x13gpsr__nav-link.active { color: #232323 !important; border-bottom-color: var(--x13gpsr-color-tab, #24b9d7) !important; } .x13gpsr__tab-pane { display: none; } .x13gpsr__tab-pane.active { display: block; } .x13gpsr__tab-pane .x13gpsr__title { display: none; } .x13gpsr { line-height: 1.5; } .x13gpsr *:not(a):not(button) { color: #232323; } .x13gpsr__list { display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column; margin-bottom: 16px; } .x13gpsr__title { font-size: 1.2em; margin-bottom: 5px; } .x13gpsr__label { font-weight: bold; } .x13gpsr__manufacturer { margin-bottom: 1rem; } .x13gpsr__manufacturer img { max-height: 4rem; border: 2px solid #f6f6f6; } .x13gpsr__btn { display: inline-block; padding: 0; text-align: inherit; background-color: transparent; border: 0; -webkit-appearance: none; -moz-appearance: none; appearance: none; cursor: pointer; } .x13gpsr__btn--close { display: grid; width: 30px; height: 30px; place-items: center; } .x13gpsr__btn--close * { pointer-events: none; } .x13gpsr__box::before { transition: opacity 0.3s ease-in-out; } body:not(.x13gpsr-transition) .x13gpsr__box::before { opacity: 0; } .x13gpsr__box--default .x13gpsr__box-inner { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); transition: opacity 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out; transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out; transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out; } body:not(.x13gpsr-transition) .x13gpsr__box--default .x13gpsr__box-inner { -webkit-transform: translateY(-50px); transform: translateY(-50px); opacity: 0; } .x13gpsr__box--fixed .x13gpsr__box-inner { -webkit-transform: translateX(0); transform: translateX(0); transition: -webkit-transform 0.3s ease-in-out; transition: transform 0.3s ease-in-out; transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out; } body:not(.x13gpsr-transition) .x13gpsr__box--fixed .x13gpsr__box-inner { -webkit-transform: translateX(110%); transform: translateX(110%); } .x13gpsr-block { overflow: hidden !important; } .x13gpsr-hidden { display: none !important; } .x13gpsr-disabled { pointer-events: none !important; } #x13gpsr p, #x13gpsr h1, #x13gpsr h2, #x13gpsr h3, #x13gpsr h4, #x13gpsr h5, #x13gpsr h6 { color: #232323; } #x13gpsr p { font-size: 14px; margin-bottom: 10px; line-height: 1.5; } .x13gpsr a:not(.x13gpsr__nav-link) { color: var(--x13gpsr-color-link, #24b9d7) !important; text-decoration: none !important; } .x13gpsr a:not(.x13gpsr__nav-link):hover { text-decoration: underline !important; }