@charset 'UTF-8';@import url("https://fonts.googleapis.com/css2?family=Roboto+Condensed:ital,wght@0,100..900;1,100..900&family=Roboto:wght@400;700&display=swap"); /* ! Dependent files ------------------------------------------------------------------------------------------------------*/ /* ========================================================================== # # //////////////////////////////// GLOBAL /////////////////////////////////// # ========================================================================== */ /*------------------------------------------- Global variables and mixins for SASS/Foundation Table of Contents: 1. Color Variables 2. Font Variables 3. Foundation global variables 4. Mixins -------------------------------------------*/ /* ========================================================================== 1. Text Variables ========================================================================== */ html, body { font-family: var(--sans-serif, "Roboto"); color: var(--body-font-color, #333333); } h1, h2, h3, h4, h5, h6 { font-family: var(--sans-serif-condensed, "Roboto Condensed"); color: var(--body-font-color, #333333); } /* ========================================================================== 1. Colors Variables ========================================================================== */ /* ========================================================================== 2. Breakpoints ========================================================================== */ /* ========================================================================== # # ////////////////////////////// MIXINS ///////////////////////////////// # ========================================================================== */ /* ========================================================================== ! CSS Triangle ========================================================================== */ /* ========================================================================== ! CSS Background Triangle ========================================================================== */ /* ! Style ------------------------------------------------------------------------------------------------------*/ /* ========================================================================== # # /////////////////////////////// GENERAL /////////////////////////////////// # ========================================================================== */ /*------------------------------------------- Table of Contents: 1. General -------------------------------------------*/ /* ========================================================================== 1. General ========================================================================== */ img { height: auto; max-width: 100%; } /* ========================================================================== # # /////////////////////////////// FORMS /////////////////////////////////// # ========================================================================== */ /*------------------------------------------- Table of Contents: 1. Global Forms -------------------------------------------*/ /* ========================================================================== 0. Global Form Variables ========================================================================== */ /* ========================================================================== 1. Form Element ========================================================================== */ input[type=email], input[type=number], input[type=password], input[type=reset], input[type=search], input[type=tel], input[type=text], input[type=url], textarea { display: block; box-sizing: border-box; width: 100%; height: calc(var(--input-font-size, 14px) + var(--input-form-spacing, 16px) * 1.75); padding: calc(var(--input-form-spacing, 16px) / 2); border: var(--input-border, 2px solid var(--light-gray-color, #fafafa)); margin: 0 0 var(--input-form-spacing, 16px); font-family: var(--sans-serif, "Roboto"); font-size: var(--input-font-size, 14px); color: var(--input-color, var(--black-color, #222222)); background-color: var(--input-background, var(--white-color, #ffffff)); box-shadow: var(--input-shadow, none); border-radius: var(--input-radius, 3px); transition: var(--input-transition, box-shadow 0.5s, border-color 0.25s ease-in-out); -webkit-appearance: none; -moz-appearance: none; } input[type=email]:focus, input[type=number]:focus, input[type=password]:focus, input[type=reset]:focus, input[type=search]:focus, input[type=tel]:focus, input[type=text]:focus, input[type=url]:focus, textarea:focus { border: var(--input-border-focus, 2px solid var(--primary-color, #451cff)); background-color: var(--input-background-focus, var(--white-color, #ffffff)); outline: none; box-shadow: var(--input-shadow-focus, 0 0 5px var(--gray-color, #dddddd)); transition: var(--input-transition, box-shadow 0.5s, border-color 0.25s ease-in-out); } textarea { max-width: 100%; } textarea[rows] { height: auto; } input::placeholder, textarea::placeholder { color: var(--input-placeholder-color, var(--medium-gray-color, #989898)); } input:disabled, input[readonly], textarea:disabled, textarea[readonly] { background-color: var(--input-background-disabled, #F6F6F6); cursor: var(--input-cursor-disabled, not-allowed); } [type=submit], [type=button] { border-radius: var(--input-border-radius, 3px); -webkit-appearance: none; -moz-appearance: none; } input[type=search] { box-sizing: border-box; } /* ========================================================================== 2. Checkboxes ========================================================================== */ [type=file], [type=checkbox], [type=radio] { margin: 0 0 var(--input-form-spacing, 16px); } [type=checkbox] + label, [type=radio] + label { display: inline-block; margin-left: calc(var(--input-form-spacing, 16px) * 0.5); margin-right: var(--input-form-spacing, 16px); margin-bottom: 0; vertical-align: baseline; } [type=checkbox] + label[for], [type=radio] + label[for] { cursor: pointer; } label > [type=checkbox], label > [type=radio] { margin-right: calc(var(--input-form-spacing, 16px) * 0.5); } [type=file] { width: 100%; } /* ========================================================================== 3. Labels ========================================================================== */ label { display: block; margin: 0; font-family: var(--sans-serif, "Roboto"); font-size: var(--form-label-font-size, 14px); font-weight: var(--form-label-font-weight, bold); line-height: var(--form-label-line-height, 1.8); color: var(--form-label-color, #454142); } /* ========================================================================== 4. Help Text ========================================================================== */ .help-text { margin-top: calc(var(--input-form-spacing, 16px) * 0.5 * -1); font-size: var(--helptext-font-size, 13px); font-style: var(--helptext-font-style, italic); color: var(--helptext-color, var(--black-color, #222222)); } /* ========================================================================== 5. Input Group ========================================================================== */ .input-group { display: table; width: 100%; margin-bottom: var(--input-form-spacing, 16px); } .input-group > :first-child { border-radius: var(--input-radius, 3px) 0 0 var(--input-radius, 3px); } .input-group > :last-child > * { border-radius: 0 var(--input-radius, 3px) var(--input-radius, 3px) 0; } .input-group-button, .input-group-field, .input-group-label { margin: 0; white-space: nowrap; display: table-cell; vertical-align: middle; } .input-group-label { text-align: center; padding: 0 var(--input-prefix-padding, 1rem); background: var(--input-prefix-background, #F6F6F6); color: var(--input-prefix-color, var(--black-color, #222222)); border: var(--input-prefix-border, 1px solid var(--gray-color, #dddddd)); white-space: nowrap; width: 1%; height: 100%; } .input-group-label:first-child { border-right: 0; } .input-group-label:last-child { border-left: 0; } .input-group-field { border-radius: 0; height: calc(var(--input-font-size, 14px) + var(--input-form-spacing, 16px) * 1.5); } .input-group-button { padding-top: 0; padding-bottom: 0; text-align: center; height: 100%; width: 1%; } .input-group-button a, .input-group-button input, .input-group-button button { margin: 0; } .input-group .input-group-button { display: table-cell; } /* ========================================================================== 6. Fieldset ========================================================================== */ fieldset { border: 0; padding: 0; margin: 0; } legend { margin-bottom: calc(var(--input-form-spacing, 16px) * 0.5); max-width: 100%; } .fieldset { border: var(--fieldset-border, 1px solid var(--gray-color, #dddddd)); padding: var(--fieldset-padding, 20px); margin: var(--fieldset-padding, 18px 0px); } .fieldset legend { background: var(--white-color, #ffffff); padding: var(--fieldset-padding, 0px 3px); margin: 0; margin-left: -3px; } /* ========================================================================== 7. Select ========================================================================== */ select { width: 100%; height: calc(var(--input-font-size, 14px) + var(--input-form-spacing, 16px) * 1.75); padding: calc(var(--input-form-spacing, 16px) / 2); border: var(--input-border, 2px solid var(--light-gray-color, #fafafa)); margin: 0 0 var(--input-form-spacing, 16px); font-size: var(--input-font-size, 14px); font-family: var(--input-font-family, inherit); line-height: normal; color: var(--input-color, var(--black-color, #222222)); background-color: var(--select-background, var(--white-color, #ffffff)); border-radius: var(--select-radius, 3px); -webkit-appearance: none; -moz-appearance: none; background-image: url("data:image/svg+xml;utf8,"); background-size: 9px 6px; background-position: right -var(--input-form-spacing, 16px) center; background-origin: content-box; background-repeat: no-repeat; padding-right: calc(var(--input-form-spacing, 16px) * 1.5); } @media screen and (min-width: 0\0 ) { select { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAYCAYAAACbU/80AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAMBJREFUeNrEllsOhCAMRVszC9IlzU7KCmVHTJsoMWYMUtpyv9BgbuXQB5ZSdgBYYY4ycgBivk8KYFsQMfMiTTBP4o3nUzCKzOabLJbLy2/g31evGkAginR4/ZegKH5qX3bJCscA3t0x3kgO5tQFyhhFf50xRqFLbyMUNJQzgyjGS/wgCpvKqkRBpuWrE4V9d+1E4dPUXqIg107SQOE/2DRQxMwTDygIInVDET9T3lCoj/6j/VCmGjZOl2lKpZ8AAwDQP7zIimDGFQAAAABJRU5ErkJggg=="); } } select:disabled { background-color: var(--input-background-disabled, #F6F6F6); cursor: var(--input-cursor-disabled, not-allowed); } select::-ms-expand { display: none; } select[multiple] { height: auto; background-image: none; } .dark-form label { color: var(--white-color, #ffffff) !important; } /* ========================================================================== 8. Form Error ========================================================================== */ .frm_error { margin-top: -24px; font-size: 10px; font-style: italic; color: white; background: var(--alert-color, #ff0f0f); border-radius: 3px; padding: 2px; } .frm_error_style { color: var(--alert-color, #ff0f0f); font-weight: bold; font-style: italic; } .frm_message { color: var(--success-color, #3adb76); font-weight: bold; font-style: italic; } /* ========================================================================== # # /////////////////////////////// BUTTONS /////////////////////////////////// # ========================================================================== */ /*------------------------------------------- Table of Contents: 1. Buttons -------------------------------------------*/ /* ========================================================================== 1. Button Variables ========================================================================== */ /* ========================================================================== 2. Buttons ========================================================================== */ /*++++++++++++++++++++++++++++++++++++++++++++++++++ These variables are set from above +++++++++++++++++++++++++++++++++++++++++++++++++*/ .primary-button--app, .primary-button--app.filled { display: inline-block; background: var(--primary-color, #451cff) !important; border-color: var(--button-primary-hover-color, var(--primary-color, #451cff)) !important; border-style: solid; color: var(--button-primary-text-color, var(--white-color, #ffffff)) !important; line-height: var(--button-line-height, 20px) !important; letter-spacing: var(--button-letter-spacing, 0px); font-weight: var(--button-font-weight, 400) !important; font-size: var(--button-font-size, 16px) !important; text-transform: var(--button-text-transform, none); border-width: var(--button-border-width, 1px); border-radius: var(--button-border-radius, 4px); padding: var(--button-padding-top, 10px) var(--button-padding-right, 20px) var(--button-padding-bottom, 9px) var(--button-padding-left, 20px); text-decoration: none; cursor: pointer; } .primary-button--app:focus, .primary-button--app:active, .primary-button--app:hover, .primary-button--app.filled:focus, .primary-button--app.filled:active, .primary-button--app.filled:hover { background: var(--button-primary-hover-color, var(--primary-color, #451cff)) !important; border-color: var(--primary-color, #451cff) !important; border-radius: var(--button-border-radius, 4px) !important; } .primary-button--app *, .primary-button--app::before, .primary-button--app::after, .primary-button--app *::after, .primary-button--app *::before, .primary-button--app.filled *, .primary-button--app.filled::before, .primary-button--app.filled::after, .primary-button--app.filled *::after, .primary-button--app.filled *::before { box-sizing: border-box; } .primary-button--app.hollow { background: transparent !important; border-color: var(--primary-color, #451cff) !important; color: var(--primary-color, #451cff) !important; line-height: var(--button-line-height, 20px) !important; letter-spacing: var(--button-letter-spacing, 0px); font-weight: var(--button-font-weight, 400) !important; font-size: var(--button-font-size, 16px) !important; } .primary-button--app.hollow:focus, .primary-button--app.hollow:active, .primary-button--app.hollow:hover { background: transparent !important; border-color: var(--primary-color, #451cff) !important; border-radius: var(--button-border-radius, 4px) !important; } .primary-button--app.large { padding: calc(var(--button-size-large, 1.25) * var(--button-padding-top, 10px)) calc(var(--button-size-large, 1.25) * var(--button-padding-right, 20px)) calc(var(--button-size-large, 1.25) * var(--button-padding-bottom, 9px)) calc(var(--button-size-large, 1.25) * var(--button-padding-left, 20px)) !important; font-size: calc(var(--button-size-large, 1.25) * var(--button-font-size, 16px)) !important; } .primary-button--app.small { padding: calc(var(--button-size-small, 0.85) * var(--button-padding-top, 10px)) calc(var(--button-size-small, 0.85) * var(--button-padding-right, 20px)) calc(var(--button-size-small, 0.85) * var(--button-padding-bottom, 9px)) calc(var(--button-size-small, 0.85) * var(--button-padding-left, 20px)) !important; font-size: calc(var(--button-size-small, 0.85) * var(--button-font-size, 16px)) !important; } .primary-button--app.tiny { padding: calc(var(--button-size-tiny, 0.75) * var(--button-padding-top, 10px)) calc(var(--button-size-tiny, 0.75) * var(--button-padding-right, 20px)) calc(var(--button-size-tiny, 0.75) * var(--button-padding-bottom, 9px)) calc(var(--button-size-tiny, 0.75) * var(--button-padding-left, 20px)) !important; font-size: calc(var(--button-size-tiny, 0.75) * var(--button-font-size, 16px)) !important; } /*++++++++++++++++++++++++++++++++++++++++++++++++++ These variables are set from above +++++++++++++++++++++++++++++++++++++++++++++++++*/ .secondary-button--app, .secondary-button--app.filled { display: inline-block; background: var(--secondary-color, #266aff) !important; border-color: var(--button-secondary-hover-color, var(--secondary-color, #266aff)) !important; border-style: solid; color: var(--button-secondary-text-color, var(--white-color, #ffffff)) !important; line-height: var(--button-line-height, 20px) !important; letter-spacing: var(--button-letter-spacing, 0px); font-weight: var(--button-font-weight, 400) !important; font-size: var(--button-font-size, 16px) !important; text-transform: var(--button-text-transform, none); border-width: var(--button-border-width, 1px); border-radius: var(--button-border-radius, 4px); padding: var(--button-padding-top, 10px) var(--button-padding-right, 20px) var(--button-padding-bottom, 9px) var(--button-padding-left, 20px); text-decoration: none; cursor: pointer; } .secondary-button--app:focus, .secondary-button--app:active, .secondary-button--app:hover, .secondary-button--app.filled:focus, .secondary-button--app.filled:active, .secondary-button--app.filled:hover { background: var(--button-secondary-hover-color, var(--secondary-color, #266aff)) !important; border-color: var(--secondary-color, #266aff) !important; border-radius: var(--button-border-radius, 4px) !important; } .secondary-button--app *, .secondary-button--app::before, .secondary-button--app::after, .secondary-button--app *::after, .secondary-button--app *::before, .secondary-button--app.filled *, .secondary-button--app.filled::before, .secondary-button--app.filled::after, .secondary-button--app.filled *::after, .secondary-button--app.filled *::before { box-sizing: border-box; } .secondary-button--app.hollow { background: transparent !important; border-color: var(--secondary-color, #266aff) !important; color: var(--secondary-color, #266aff) !important; line-height: var(--button-line-height, 20px) !important; letter-spacing: var(--button-letter-spacing, 0px); font-weight: var(--button-font-weight, 400) !important; font-size: var(--button-font-size, 16px) !important; } .secondary-button--app.hollow:focus, .secondary-button--app.hollow:active, .secondary-button--app.hollow:hover { background: transparent !important; border-color: var(--secondary-color, #266aff) !important; border-radius: var(--button-border-radius, 4px) !important; } .secondary-button--app.large { padding: calc(var(--button-size-large, 1.25) * var(--button-padding-top, 10px)) calc(var(--button-size-large, 1.25) * var(--button-padding-right, 20px)) calc(var(--button-size-large, 1.25) * var(--button-padding-bottom, 9px)) calc(var(--button-size-large, 1.25) * var(--button-padding-left, 20px)) !important; font-size: calc(var(--button-size-large, 1.25) * var(--button-font-size, 16px)) !important; } .secondary-button--app.small { padding: calc(var(--button-size-small, 0.85) * var(--button-padding-top, 10px)) calc(var(--button-size-small, 0.85) * var(--button-padding-right, 20px)) calc(var(--button-size-small, 0.85) * var(--button-padding-bottom, 9px)) calc(var(--button-size-small, 0.85) * var(--button-padding-left, 20px)) !important; font-size: calc(var(--button-size-small, 0.85) * var(--button-font-size, 16px)) !important; } .secondary-button--app.tiny { padding: calc(var(--button-size-tiny, 0.75) * var(--button-padding-top, 10px)) calc(var(--button-size-tiny, 0.75) * var(--button-padding-right, 20px)) calc(var(--button-size-tiny, 0.75) * var(--button-padding-bottom, 9px)) calc(var(--button-size-tiny, 0.75) * var(--button-padding-left, 20px)) !important; font-size: calc(var(--button-size-tiny, 0.75) * var(--button-font-size, 16px)) !important; } /*++++++++++++++++++++++++++++++++++++++++++++++++++ These variables are set from above +++++++++++++++++++++++++++++++++++++++++++++++++*/ .tertiary-button--app, .tertiary-button--app.filled { display: inline-block; background: var(--tertiary-color, #19b6ff) !important; border-color: var(--button-tertiary-hover-color, var(--tertiary-color, #19b6ff)) !important; border-style: solid; color: var(--button-tertiary-text-color, var(--white-color, #ffffff)) !important; line-height: var(--button-line-height, 20px) !important; letter-spacing: var(--button-letter-spacing, 0px); font-weight: var(--button-font-weight, 400) !important; font-size: var(--button-font-size, 16px) !important; text-transform: var(--button-text-transform, none); border-width: var(--button-border-width, 1px); border-radius: var(--button-border-radius, 4px); padding: var(--button-padding-top, 10px) var(--button-padding-right, 20px) var(--button-padding-bottom, 9px) var(--button-padding-left, 20px); text-decoration: none; cursor: pointer; } .tertiary-button--app:focus, .tertiary-button--app:active, .tertiary-button--app:hover, .tertiary-button--app.filled:focus, .tertiary-button--app.filled:active, .tertiary-button--app.filled:hover { background: var(--button-tertiary-hover-color, var(--tertiary-color, #19b6ff)) !important; border-color: var(--tertiary-color, #19b6ff) !important; border-radius: var(--button-border-radius, 4px) !important; } .tertiary-button--app *, .tertiary-button--app::before, .tertiary-button--app::after, .tertiary-button--app *::after, .tertiary-button--app *::before, .tertiary-button--app.filled *, .tertiary-button--app.filled::before, .tertiary-button--app.filled::after, .tertiary-button--app.filled *::after, .tertiary-button--app.filled *::before { box-sizing: border-box; } .tertiary-button--app.hollow { background: transparent !important; border-color: var(--tertiary-color, #19b6ff) !important; color: var(--tertiary-color, #19b6ff) !important; line-height: var(--button-line-height, 20px) !important; letter-spacing: var(--button-letter-spacing, 0px); font-weight: var(--button-font-weight, 400) !important; font-size: var(--button-font-size, 16px) !important; } .tertiary-button--app.hollow:focus, .tertiary-button--app.hollow:active, .tertiary-button--app.hollow:hover { background: transparent !important; border-color: var(--tertiary-color, #19b6ff) !important; border-radius: var(--button-border-radius, 4px) !important; } .tertiary-button--app.large { padding: calc(var(--button-size-large, 1.25) * var(--button-padding-top, 10px)) calc(var(--button-size-large, 1.25) * var(--button-padding-right, 20px)) calc(var(--button-size-large, 1.25) * var(--button-padding-bottom, 9px)) calc(var(--button-size-large, 1.25) * var(--button-padding-left, 20px)) !important; font-size: calc(var(--button-size-large, 1.25) * var(--button-font-size, 16px)) !important; } .tertiary-button--app.small { padding: calc(var(--button-size-small, 0.85) * var(--button-padding-top, 10px)) calc(var(--button-size-small, 0.85) * var(--button-padding-right, 20px)) calc(var(--button-size-small, 0.85) * var(--button-padding-bottom, 9px)) calc(var(--button-size-small, 0.85) * var(--button-padding-left, 20px)) !important; font-size: calc(var(--button-size-small, 0.85) * var(--button-font-size, 16px)) !important; } .tertiary-button--app.tiny { padding: calc(var(--button-size-tiny, 0.75) * var(--button-padding-top, 10px)) calc(var(--button-size-tiny, 0.75) * var(--button-padding-right, 20px)) calc(var(--button-size-tiny, 0.75) * var(--button-padding-bottom, 9px)) calc(var(--button-size-tiny, 0.75) * var(--button-padding-left, 20px)) !important; font-size: calc(var(--button-size-tiny, 0.75) * var(--button-font-size, 16px)) !important; } /*++++++++++++++++++++++++++++++++++++++++++++++++++ These variables are set from above +++++++++++++++++++++++++++++++++++++++++++++++++*/ .white-color-button--app.hollow { background: transparent !important; border-color: var(--white-color, #ffffff) !important; color: var(--white-color, #ffffff) !important; line-height: var(--button-line-height, 20px) !important; letter-spacing: var(--button-letter-spacing, 0px); font-weight: var(--button-font-weight, 400) !important; font-size: var(--button-font-size, 16px) !important; } .white-color-button--app.hollow:focus, .white-color-button--app.hollow:active, .white-color-button--app.hollow:hover { background: transparent !important; border-color: var(--white-color, #ffffff) !important; border-radius: var(--button-border-radius, 4px) !important; } .white-color-button--app.large { padding: calc(var(--button-size-large, 1.25) * var(--button-padding-top, 10px)) calc(var(--button-size-large, 1.25) * var(--button-padding-right, 20px)) calc(var(--button-size-large, 1.25) * var(--button-padding-bottom, 9px)) calc(var(--button-size-large, 1.25) * var(--button-padding-left, 20px)) !important; font-size: calc(var(--button-size-large, 1.25) * var(--button-font-size, 16px)) !important; } .white-color-button--app.small { padding: calc(var(--button-size-small, 0.85) * var(--button-padding-top, 10px)) calc(var(--button-size-small, 0.85) * var(--button-padding-right, 20px)) calc(var(--button-size-small, 0.85) * var(--button-padding-bottom, 9px)) calc(var(--button-size-small, 0.85) * var(--button-padding-left, 20px)) !important; font-size: calc(var(--button-size-small, 0.85) * var(--button-font-size, 16px)) !important; } .white-color-button--app.tiny { padding: calc(var(--button-size-tiny, 0.75) * var(--button-padding-top, 10px)) calc(var(--button-size-tiny, 0.75) * var(--button-padding-right, 20px)) calc(var(--button-size-tiny, 0.75) * var(--button-padding-bottom, 9px)) calc(var(--button-size-tiny, 0.75) * var(--button-padding-left, 20px)) !important; font-size: calc(var(--button-size-tiny, 0.75) * var(--button-font-size, 16px)) !important; } /* ========================================================================== # # /////////////////////////////// MODULES /////////////////////////////////// # ========================================================================== */ /*------------------------------------------- Table of Contents: 1. DropdownBox -------------------------------------------*/ /* ========================================================================== 1. DropdownBox ========================================================================== */ /* DropdownBox */ .adp--dropdown-box-container { position: relative; display: inline-block; width: 100%; } .adp--dropdown-box { position: absolute; top: 100%; left: 0; width: 100%; min-width: 300px; background: #fff; box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1); border-radius: 8px; margin-top: 5px; padding: 10px; z-index: 10; } .adp--dropdown-box-clear-button { margin-left: 10px; cursor: pointer; font-size: 18px; font-weight: bold; color: #fff; background: rgba(255, 255, 255, 0.2); padding: 2px 6px; border-radius: 50%; } .adp--dropdown-box-display-label { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .adp--dropdown-box-button { width: 100%; padding: 10px; border-radius: 8px; background: #007BFF; color: #fff; border: none; cursor: pointer; font-size: 16px; text-align: left; display: flex; justify-content: space-between; align-items: center; } /* DropdownBox + Dropdown Options */ .adp--dropdown-box { .dropdown-options { max-height: 300px; overflow-y: auto; } } /* ========================================================================== # # /////////////////////////////// SKELETON /////////////////////////////////// # ========================================================================== */ /*------------------------------------------- Table of Contents: 1. Skeleton -------------------------------------------*/ /* ========================================================================== 1. Skeleton (Parts that flash before the app is fully loaded.) ========================================================================== */ .skeleton { height: 1em; position: relative; overflow: hidden; background-color: #DDDBDD; } .skeleton::after { position: absolute; top: 0; right: 0; bottom: 0; left: 0; transform: translateX(-100%); background-image: linear-gradient(90deg, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, 0.2) 20%, rgba(255, 255, 255, 0.5) 60%, rgba(255, 255, 255, 0)); animation: shimmer 2s infinite; content: ""; } @keyframes shimmer { 100% { transform: translateX(100%); } } .flex-container { display: flex; height: 100%; width: 100vw; } @media screen and (max-width: 770px) { .flex-container { display: block; width: 100%; } } .skeleton-container { display: flex; flex-direction: column; flex-basis: 33.33%; padding-left: 10px; padding-right: 10px; box-sizing: border-box; } .adp--horizontal-layout .skeleton-container { flex-basis: 25%; } .skeleton-sidebar-container { flex: 0 0 350px; } .skeleton-sidebar { height: 100%; } .skeleton-tile { height: 250px; margin-bottom: 5px; margin-top: 5px; } .skeleton-tiles-container { height: 100%; display: flex; flex-wrap: wrap; flex-grow: 1; box-sizing: border-box; } @media screen and (max-width: 770px) { .skeleton-tiles-container { display: block; } } .skeleton-filter-sidebar-container { margin-top: 1rem; } .skeleton-filter { margin-bottom: 5px; } /* ! Layout ------------------------------------------------------------------------------------------------------*/ /* ========================================================================== # # /////////////////////////////// BASE /////////////////////////////////// # ========================================================================== */ /*------------------------------------------- Table of Contents: 1. Base Layout 2. Base Sidebar 3. Base Main 4. Conditionals 5. Misc 6. Search Close - Horizontal Sidebar -------------------------------------------*/ /* ========================================================================== 1. Base Layout ========================================================================== */ .adp--archive { display: flex; flex-direction: row; max-width: 100%; } @media screen and (max-width: 992px) { .adp--archive { flex-direction: column; } } .adp--archive aside.adp--sidebar-section { min-width: 250px; flex: 0 1 300px; margin-top: 15px; } .adp--archive .adp--sidebar-container { padding: 30px; background: var(--light-gray-color, #fafafa); border: solid 1px #f3f3f3; } .adp--archive main.adp--main-section { flex: 1 0 0; } .adp--archive .adp--main-container { padding-top: 5px; } .adp--archive .adp--grid-section { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; padding: 10px 0 10px 20px; } @media screen and (max-width: 992px) { .adp--archive .adp--grid-section { grid-template-columns: repeat(2, 1fr); padding: 10px 0 10px 0; } } @media screen and (max-width: 768px) { .adp--archive .adp--grid-section { grid-template-columns: repeat(1, 1fr); } } .adp--archive .adp--no-results { font-size: 45px; font-style: italic; padding: 50px 20px; } .adp--horizontal-layout .adp--archive { display: flex; flex-direction: column; max-width: 100%; } .adp--horizontal-layout .adp--grid-section { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; padding: 10px 0 10px 20px; } @media screen and (max-width: 1200px) { .adp--horizontal-layout .adp--grid-section { grid-template-columns: repeat(3, 1fr); padding: 10px 0 10px 0; } } @media screen and (max-width: 992px) { .adp--horizontal-layout .adp--grid-section { grid-template-columns: repeat(2, 1fr); padding: 10px 0 10px 0; } } @media screen and (max-width: 768px) { .adp--horizontal-layout .adp--grid-section { grid-template-columns: repeat(1, 1fr); } } .adp--horizontal-layout aside.adp--sidebar-section { flex: 1 1 auto; } /* ========================================================================== 2. Base Sidebar ========================================================================== */ @media screen and (max-width: 992px) { aside.adp--sidebar-section.adp--hidden { display: none; } } .adp--sidebar-filters { display: none; } @media screen and (max-width: 992px) { .adp--sidebar-filters { display: block; } } @media screen and (max-width: 768px) { .adp--clear-filters { display: block; } } .adp--filter-checkbox-container .adp--filter-checkboxes { list-style: none; margin: 0; padding-left: 0; } .adp--filter-checkbox-container .adp--toggle-filter { color: var(--info-color, #19b6ff); cursor: pointer; } .adp--categories-container .adp--categories-list ul { padding-left: 15px; } /* ========================================================================== 3. Base Main ========================================================================== */ .adp--top-bar-container { display: flex; flex-direction: row; align-items: center; } .adp--top-bar-container .adp--item-count { display: flex; align-self: flex-end; flex: 0 0 50%; } .adp--top-bar-container .adp--item-count .adp--item-count-text { margin-left: 20px; font-weight: bold; font-size: 0.9rem; } .adp--top-bar-container .adp--controls { flex: 0 0 50%; display: flex; justify-content: end; } .adp--top-bar-container .adp--controls a:first-child { margin-right: 5px; } .adp--top-bar-container .adp--controls svg { width: 10px; height: 10px; padding-right: 5px; } .adp--top-bar-container .adp--controls svg path { fill: var(--white-color, #ffffff); } .adp--item-container { position: relative; background: var(--light-gray-color, #fafafa); border: solid 1px #f3f3f3; display: flex; flex-direction: column; flex: 1; overflow: hidden; } .adp--item-container .adp--item-image { display: none; } .adp--item-container .adp--item-image-wrapper { display: block; border-bottom: solid 1px #f3f3f3; background: var(--white-color, #ffffff); } .adp--item-container .adp--item-image-wrapper .adp--item-background-image { width: 100%; height: 250px; background-size: contain; background-position: center; background-repeat: no-repeat; } .adp--item-container .adp--post-content { display: flex; flex-direction: column; flex: 1; } .adp--item-container .adp--item-content { padding: 10px 20px 20px; display: flex; flex-direction: column; flex: 1; } .adp--item-container .adp--item-content .adp--item-title { text-align: center; flex: 1; } .adp--item-container .adp--item-content .adp--item-title a { color: var(--body-font-color, #333333); } .adp--item-container .adp--item-content .adp--item-subcategory-control-link { display: block; text-align: center; } .adp--item-container .adp--item-content .adp--item-link { text-align: center; } .adp--item-container .adp--item-subcategories { position: absolute; top: 0; left: 0; width: 100%; z-index: 2; background-color: var(--dark-gray-color, #454142); height: 0; overflow-y: auto; visibility: hidden; transition: height 0.5s ease, visibility 0.5s ease; } .adp--item-container .adp--item-subcategories .adp--item-subcategories-title { color: var(--white-color, #ffffff); text-align: center; } .adp--item-container .adp--item-subcategories .adp--item-subcategory-close-link { font-weight: 900; position: absolute; right: 10px; top: 10px; height: 15px; width: 15px; color: var(--white-color, #ffffff); cursor: pointer; text-decoration: none; } .adp--item-container .adp--item-subcategories ul { padding: 0 20px 10px; text-align: center; margin-top: 0; } .adp--item-container .adp--item-subcategories li { display: inline-block; padding: 5px; font-size: 14px; } .adp--item-container .adp--item-subcategories a { color: var(--white-color, #ffffff); } .adp--item-container .adp--item-subcategories.adp--is-visible { transition: height 0.5s ease, visibility 0.5s ease; height: 250px; visibility: visible; } .adp--compare-checkbox-container { padding: 10px; display: flex; background: #f4f4f4; align-items: center; } .adp--compare-checkbox-container input { margin-bottom: 0; } /* ========================================================================== 4. Conditionals ========================================================================== */ .adp--inventory-archive .adp--rental-item-content, .adp--inventory-archive .adp--catalog-item-content { display: none !important; } .adp--inventory-archive .adp--inventory-item-content { display: block !important; } .adp--catalog-archive .adp--rental-item-content, .adp--catalog-archive .adp--inventory-item-content { display: none !important; } .adp--catalog-archive .adp--catalog-item-content { display: block !important; } .adp--rental-archive .adp--catalog-item-content, .adp--rental-archive .adp--inventory-item-content { display: none !important; } .adp--rental-archive .adp--rental-item-content { display: block !important; } /* ========================================================================== 5. Misc ========================================================================== */ .adp--controls .secondary-button--app:first-child { margin-right: 10px; } .adp--controls .secondary-button--app svg { fill: var(--button-secondary-text-color, var(--white-color, #ffffff)); width: 13px; height: 13px; position: relative; top: 2px; margin-right: 3px; } .adp--no-results { min-height: 400px; padding: 2rem 1rem; margin: 0 2rem; background: repeating-linear-gradient(45deg, #FFFFFF, #FFFFFF 10px, #F8f8f8 10px, #F8f8f8 20px); } .adp--no-results h5 { font-size: 2.5rem; line-height: 1.2; margin-bottom: 1rem; text-align: center; } .adp--no-results p { font-size: 1.25rem; text-align: center; } /* ========================================================================== 6. Search Close -- Horizontal Sidebar ========================================================================== */ .adp--search-overlay-close { position: absolute; top: 50px; right: 0; } .adp--search-overlay-close .adp--close-search { text-decoration: none; padding: 10px; background: transparent; box-shadow: none; border: none; box-sizing: border-box; cursor: pointer; height: 80px; } .adp--search-overlay-close .adp--close-search .adp--close-inner { display: block; position: relative; height: 100%; display: flex; align-items: center; } .adp--search-overlay-close .adp--close-search .adp--close-inner::before { content: ""; position: absolute; height: 2px; width: 50px; background-color: #FFF; left: 50%; top: 50%; transform: translate(-50%, -50%) rotate(-45deg); transition: ease-out 0.2s all; } .adp--search-overlay-close .adp--close-search .adp--close-inner:after { content: ""; position: absolute; height: 2px; width: 50px; background-color: #FFF; left: 50%; top: 50%; transform: translate(-50%, -50%) rotate(45deg); transition: ease-out 0.2s all; } .adp--search-overlay-close .adp--close-search .adp--close-label { color: #FFF; opacity: 0; font-family: var(--sans-serif, "Roboto Condensed"); text-transform: uppercase; transition: all 0.2s ease-out; } .adp--search-overlay-close .adp--close-search:hover .adp--close-inner::before, .adp--search-overlay-close .adp--close-search:focus .adp--close-inner::before { transform: translate(-50%, 0%) rotate(0); top: 25%; } .adp--search-overlay-close .adp--close-search:hover .adp--close-inner:after, .adp--search-overlay-close .adp--close-search:focus .adp--close-inner:after { transform: translate(-50%, 0%) rotate(0); top: 76%; } .adp--search-overlay-close .adp--close-search:hover .adp--close-label, .adp--search-overlay-close .adp--close-search:focus .adp--close-label { opacity: 1; } /* ========================================================================== # # /////////////////////////////// CATALOG /////////////////////////////////// # ========================================================================== */ /*------------------------------------------- Table of Contents: 1. Catalog -------------------------------------------*/ /* ========================================================================== 1. Catalog ========================================================================== */ /* ========================================================================== # # /////////////////////////////// INVENTORY /////////////////////////////////// # ========================================================================== */ /*------------------------------------------- Table of Contents: 1. Inventory 2. Horizontal Sidebar - Filters -------------------------------------------*/ /* ========================================================================== 1. Inventory ========================================================================== */ .adp--inventory-item-content .adp--item-title { margin-bottom: 10px; } .adp--inventory-item-content .adp--item-price { font-size: 18px; font-weight: bold; text-align: center; margin-bottom: 20px; } .adp--inventory-item-content .adp--item-meta-container { margin-bottom: 20px; padding-top: 20px; border-top: solid 1px var(--gray-color, #dddddd); } .adp--inventory-item-content .adp--item-meta-container > div { text-align: center; margin-bottom: 5px; } /* ========================================================================== 2. Horizontal Sidebar - Filters ========================================================================== */ /* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ The horizontial sidebar is (currently) only used for inventory. However, it could be expanded to the catalog, but at this point I am putting this code within the inventory style-sheet. ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */ .adp--sidebar-section.adp--horizontal-sidebar .adp--sidebar-container { display: flex; flex-direction: row; justify-content: space-between; align-items: normal; position: relative; padding: 0px; } .adp--sidebar-section.adp--horizontal-sidebar .adp--search-button { min-width: 125px; } .adp--sidebar-section.adp--horizontal-sidebar .adp--search-button svg { width: 14px; margin-left: 3px; position: relative; top: 2px; } .adp--sidebar-section.adp--horizontal-sidebar .adp--search-container { display: none; } .adp--sidebar-section.adp--horizontal-sidebar .adp--search-container.is-active { display: flex; position: absolute; top: 0; left: 0; z-index: 3; width: 100%; background: var(--dark-gray-color, #454142); height: 68px; box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.2); } .adp--sidebar-section.adp--horizontal-sidebar .adp--search-container .adp--search-wrapper { flex: 1 1 auto; } .adp--sidebar-section.adp--horizontal-sidebar .adp--search-container .adp--search-wrapper input { font-size: 20px; height: 100%; margin-bottom: 0; } .adp--sidebar-section.adp--horizontal-sidebar .adp--search-container .adp--search-overlay-close { flex: 0 1 70px; position: relative; top: 0px; display: flex; justify-content: center; align-items: center; } .adp--sidebar-section.adp--horizontal-sidebar .adp--filters { display: flex; justify-content: space-between; width: 100%; overflow: hidden; } .adp--sidebar-section.adp--horizontal-sidebar .adp--filter-container { position: relative; width: 150px; min-width: 150px; display: flex; flex-direction: column; justify-content: space-around; text-align: left; padding: 0 15px; margin: 5px 0; } .adp--sidebar-section.adp--horizontal-sidebar .adp--filter-container:first-child::before { content: none; } .adp--sidebar-section.adp--horizontal-sidebar .adp--filter-container::before { content: ""; width: 1px; height: 75%; left: 0; top: 50%; transform: translateY(-50%); position: absolute; background: var(--medium-gray-color, #989898); } .adp--sidebar-section.adp--horizontal-sidebar .adp--filter-container.adp--filter-type { width: 200px; min-width: 200px; } .adp--sidebar-section.adp--horizontal-sidebar .adp--dropdown-box-clear-button { margin: 0; font-size: 16px; background: transparent; padding: 0; } .adp--sidebar-section.adp--horizontal-sidebar .adp--clear-filters { min-width: 120px; display: flex; justify-content: center; align-items: anchor-center; margin: 0 10px; } .adp--sidebar-section.adp--horizontal-sidebar .adp--hidden-filters { display: flex; position: relative; } .adp--sidebar-section.adp--horizontal-sidebar .adp--hidden-filters button.no-filters-selected::after { content: none; } .adp--sidebar-section.adp--horizontal-sidebar .adp--hidden-filters button::after { content: attr(data-modal-active-filters); position: absolute; right: -4px; top: -6px; background-color: var(--info-color, #19b6ff); border-radius: 100%; padding: 5px; line-height: 0.5; font-size: 10px; } .adp--searchable-dropdown-container .input-with-tags { display: flex; flex-direction: column-reverse; } .adp--searchable-dropdown-container .input-with-tags .tag-group { display: flex; gap: 5px; flex-wrap: wrap; margin-bottom: 10px; padding-bottom: 10px; border-bottom: solid 1px var(--light-gray-color, #fafafa); } .adp--searchable-dropdown-container .input-with-tags .tag { display: inline-block; font-size: 14px; padding: 5px 3px 1px; background: var(--light-gray-color, #fafafa); border-radius: 3px; color: var(--info-color, #19b6ff); line-height: 1.2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .adp--searchable-dropdown-container .input-with-tags .tag span { cursor: pointer; } .adp--searchable-dropdown-container .dropdown-options { direction: rtl; scrollbar-color: #898989 rgba(var(--light-gray-color, #fafafa), 0.1); } .adp--searchable-dropdown-container .dropdown-options > div { direction: ltr; font-size: 16px; text-transform: none; font-weight: normal; color: var(--dark-gray-color, #454142); padding-left: 10px; cursor: pointer; } .adp--searchable-dropdown-container .dropdown-options .is-selected { display: none; } .adp--twotext-inputs-container { display: flex; } .adp--twotext-inputs-container input { margin-bottom: 0; } .adp--dropdown-box { border-radius: 3px; padding: 20px; } .adp--dropdown-box::before { content: ""; position: absolute; top: -10px; left: 10px; width: 0; height: 0; border-style: solid; border-width: 0 7.5px 13px 7.5px; border-color: transparent transparent #ffffff transparent; } /* ========================================================================== 3. Filter Modal ========================================================================== */ .adp--filter-modal { display: flex; flex-direction: column; position: fixed; top: 40px; left: 50%; transform: translateX(-50%); max-width: 800px; width: 100%; height: 100%; max-height: 90%; margin: 0 auto; z-index: 1000; } .adp--filter-modal .adp--filter-modal-content { display: flex; flex-direction: column; height: auto; max-height: 100%; background: var(--white-color, #ffffff); border-radius: 3px; box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.2); } .adp--filter-modal .adp--filter-modal-header { padding: 10px 20px; border-bottom: solid 1px var(--medium-gray-color, #989898); } .adp--filter-modal .adp--filter-modal-footer { padding: 10px 20px; border-top: solid 1px var(--medium-gray-color, #989898); } .adp--filter-modal .adp--filters { position: relative; overflow-y: auto; max-height: 90%; padding: 10px 20px; } .adp--filter-modal-overlay { background: rgba(0, 0, 0, 0.75); position: absolute; width: 100%; height: 100%; left: 0; top: 0; z-index: 999; backdrop-filter: blur(4px); cursor: pointer; } body.adp--modal-filter-open { overflow: hidden; position: relative; } /* ========================================================================== # # /////////////////////////////// RENTALS /////////////////////////////////// # ========================================================================== */ /*------------------------------------------- Table of Contents: 1. Rentals -------------------------------------------*/ /* ========================================================================== 1. Rentals ========================================================================== */ .adp--rental-item-content .adp--item-title { margin-bottom: 10px; } .adp--rental-item-content .adp--item-price { font-size: 18px; font-weight: bold; text-align: center; margin-bottom: 20px; } .adp--rental-item-content .adp--item-meta-container { margin-bottom: 20px; padding-top: 20px; border-top: solid 1px var(--gray-color, #dddddd); } .adp--rental-item-content .adp--item-meta-container > div { text-align: center; margin-bottom: 5px; } .adp--rentals-archive { display: block; } div.adp--rental-region-selection-container { background-color: #f2f2f2; } ul.adp--rental-region-list { display: flex; align-items: center; gap: 15px; list-style: none; justify-content: center; } ul.adp--rental-region-list h5 { margin: 0; } ul.adp--rental-region-list li { align-items: center; padding: 8px 0; } ul.adp--rental-region-list input[type=checkbox] { margin: 0 8px 0 0; } /* ========================================================================== # # /////////////////////////////// COMPARE /////////////////////////////////// # ========================================================================== */ /*------------------------------------------- Table of Contents: 1. Compare -------------------------------------------*/ /* ========================================================================== 1. Compare Button & Modal ========================================================================== */ .adp--compare-popup-container { position: sticky; max-width: 500px; z-index: 6; height: auto; max-height: 600px; background-color: var(--white-color, #ffffff); padding: 30px; box-shadow: 0 0 3px 2px rgba(0, 0, 0, 0.15); top: 0; bottom: 30px; left: 100%; } .adp--compare-popup-container .adp--compare-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-gap: 10px; } .adp--compare-popup-container .adp--compare-close { position: absolute; right: 5px; top: 5px; background: transparent; border: none; cursor: pointer; } .adp--compare-popup-container .adp--compare-remove { text-decoration: underline; color: var(--info-color, #19b6ff); } .adp--compare-popup-container .secondary-button--app { margin-top: 20px; } .adp--compare-popup-container .adp--compare-item { display: table; width: 100%; border: solid 1px var(--gray-color, #dddddd); margin: 0 auto 10px; } .adp--compare-popup-container .adp--compare-item img { height: 100px; display: block; margin: auto; } .adp--compare-popup-button-container { position: sticky; display: inline-block; left: 100%; bottom: 30px; top: 0; z-index: 5; } .adp--compare-popup-button-container .adp--compare-popup-button { position: relative; width: 75px; height: 75px; border-radius: 100%; background: var(--primary-color, #451cff); color: var(--button-primary-text-color, var(--white-color, #ffffff)); font-weight: var(--button-font-weight, 400); letter-spacing: var(--button-letter-spacing, 0px); border: solid 1px var(--primary-color, #451cff); font-size: 12px; cursor: pointer; } .adp--compare-popup-button-container .adp--compare-popup-button.adp--is-closed { opacity: 1; transition: opacity 300ms ease-in; } .adp--compare-popup-button-container .adp--compare-popup-button.adp--is-open { opacity: 0; transition: opacity 300ms ease-in; } .adp--compare-popup-button-container .adp--compare-popup-button::after { content: ""; border: 5px solid var(--primary-color, #451cff); border-radius: 100%; height: 80px; width: 80px; position: absolute; right: -8px; top: -8px; animation: pulsate 5s ease-out; animation-iteration-count: infinite; opacity: 0; z-index: -1; } @keyframes pulsate { 0% { transform: scale(0.1, 0.1); opacity: 0; } 10% { opacity: 1; } 20% { transform: scale(1.2, 1.2); opacity: 0; } } /* ========================================================================== 2. Compare Page ========================================================================== */ .adp--compare-container .adp--compare-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; padding: 10px; } .adp--compare-container .adp--compare-item-container { position: relative; background: var(--light-gray-color, #fafafa); border: solid 1px #f3f3f3; display: flex; flex-direction: column; flex: 1; } .adp--compare-container .adp--compare-item-container .adp--compare-item-image { display: none; } .adp--compare-container .adp--compare-item-container .adp--compare-item-image-wrapper { display: block; border-bottom: solid 1px #f3f3f3; background: var(--white-color, #ffffff); } .adp--compare-container .adp--compare-item-container .adp--compare-item-image-wrapper .adp--compare-item-background-image { width: 100%; height: 250px; background-size: contain; background-position: center; background-repeat: no-repeat; } .adp--compare-item-content { padding: 10px 20px 20px; display: flex; flex-direction: column; } .adp--compare-item-content .adp--compare-item-title { margin-bottom: 5px; } .adp--compare-item-content .adp--compare-item-title a { color: var(--body-font-color, #333333); } .adp--compare-item-content .adp--compare-item-meta { margin: 0 0 20px; } .adp--compare-item-content .adp--compare-item-link-container { display: block; text-align: center; } .adp--compare-item-content .adp--compare-item-link-container a { display: block; margin-bottom: 5px; } .adp--compare-specifications .adp--compare-specifications-title { background: var(--gray-color, #dddddd); font-size: 18px; font-weight: bold; padding: 10px 20px; } .adp--compare-specifications .adp--compare-specifications-item { padding: 10px 20px; } .adp--compare-specifications .adp--compare-specifications-item:nth-child(odd) { background: #f3f3f3; } .adp--compare-specifications .adp--compare-spec-label { font-size: 14px; font-weight: bold; } .adp--compare-specifications .adp--compare-spec-value { font-size: 14px; } .adp--compare-top-bar-container { display: flex; position: relative; justify-content: space-between; } .adp--compare-display-dropdown { position: absolute; right: 0; min-width: 150px; z-index: 5; background: var(--white-color, #ffffff); border: solid 1px #f3f3f3; padding: 20px; } .adp--compare-display-dropdown::before { content: ""; position: absolute; top: -6px; right: 10px; width: 0; height: 0; border-style: solid; border-width: 0 5px 5px 5px; border-color: transparent transparent #f3f3f3 transparent; } .adp--compare-display-dropdown::after { content: ""; position: absolute; top: -5px; right: 10px; width: 0; height: 0; border-style: solid; border-width: 0 5px 5px 5px; border-color: transparent transparent #FFFFFF transparent; } /* ========================================================================== 3. Print Only ========================================================================== */ @media print { * { color: black !important; box-shadow: none !important; text-shadow: none !important; } .show-for-print { display: block !important; } .hide-for-print { display: none !important; } table.show-for-print { display: table !important; } thead.show-for-print { display: table-header-group !important; } tbody.show-for-print { display: table-row-group !important; } tr.show-for-print { display: table-row !important; } td.show-for-print { display: table-cell !important; } th.show-for-print { display: table-cell !important; } a, a:visited { text-decoration: none; } .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } abbr[title]:after { content: " (" attr(title) ")"; } pre, blockquote { border: 1px solid #dddddd; page-break-inside: avoid; } thead { display: table-header-group; } tr, img { page-break-inside: avoid; } img { max-width: 100% !important; } @page { margin: 0.5cm; } p, h2, h3 { orphans: 3; widows: 3; } h2, h3 { page-break-after: avoid; } .adp--compare-container .adp--compare-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; } .adp--compare-container .adp--compare-item-container { padding: 1px 1px 20px 1px; } .adp--compare-container .adp--compare-top-bar-container, .adp--compare-container .primary-button--app, .adp--compare-container .secondary-button--app, .adp--compare-container .adp--compare-item-remove, .adp--compare-container .adp--compare-item-background-image { display: none !important; } .adp--compare-container .adp--compare-item-image-wrapper { position: relative; display: block; overflow: hidden; height: 250px; } .adp--compare-container .adp--compare-item-image-wrapper .adp--compare-item-image { max-height: 100%; position: relative; z-index: 2; transform: translate(-50%, -50%); left: 50%; top: 50%; display: block; } }/* Slider */ .slick-slider { position: relative; display: block; box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; } .slick-list { position: relative; display: block; overflow: hidden; margin: 0; padding: 0; } .slick-list:focus { outline: none; } .slick-list.dragging { cursor: pointer; cursor: hand; } .slick-slider .slick-track, .slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .slick-track { position: relative; top: 0; left: 0; display: block; margin-left: auto; margin-right: auto; } .slick-track:before, .slick-track:after { display: table; content: ''; } .slick-track:after { clear: both; } .slick-loading .slick-track { visibility: hidden; } .slick-slide { display: none; float: left; height: 100%; min-height: 1px; } [dir='rtl'] .slick-slide { float: right; } .slick-slide img { display: block; } .slick-slide.slick-loading img { display: none; } .slick-slide.dragging img { pointer-events: none; } .slick-initialized .slick-slide { display: block; } .slick-loading .slick-slide { visibility: hidden; } .slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; } .slick-arrow.slick-hidden { display: none; } /* Slider */ .slick-loading .slick-list { background: #fff url('data:image/gif;base64,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') center center no-repeat; } /* Icons */ @font-face { font-family: 'slick'; font-weight: normal; font-style: normal; src: url('data:application/vnd.ms-fontobject;base64,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'); src: url('data:application/vnd.ms-fontobject;base64,AAgAAGQHAAABAAIAAAAAAAIABQkAAAAAAAABAJABAAAAAExQAQAAgCAAAAAAAAAAAAAAAAEAAAAAAAAATxDE8AAAAAAAAAAAAAAAAAAAAAAAAAoAcwBsAGkAYwBrAAAADgBSAGUAZwB1AGwAYQByAAAAFgBWAGUAcgBzAGkAbwBuACAAMQAuADAAAAAKAHMAbABpAGMAawAAAAAAAAEAAAANAIAAAwBQRkZUTW3RyK8AAAdIAAAAHEdERUYANAAGAAAHKAAAACBPUy8yT/b9sgAAAVgAAABWY21hcCIPRb0AAAHIAAABYmdhc3D//wADAAAHIAAAAAhnbHlmP5u2YAAAAzwAAAIsaGVhZAABMfsAAADcAAAANmhoZWED5QIFAAABFAAAACRobXR4BkoASgAAAbAAAAAWbG9jYQD2AaIAAAMsAAAAEG1heHAASwBHAAABOAAAACBuYW1lBSeBwgAABWgAAAFucG9zdC+zMgMAAAbYAAAARQABAAAAAQAA8MQQT18PPPUACwIAAAAAAM9xeH8AAAAAz3F4fwAlACUB2wHbAAAACAACAAAAAAAAAAEAAAHbAAAALgIAAAAAAAHbAAEAAAAAAAAAAAAAAAAAAAAEAAEAAAAHAEQAAgAAAAAAAgAAAAEAAQAAAEAAAAAAAAAAAQIAAZAABQAIAUwBZgAAAEcBTAFmAAAA9QAZAIQAAAIABQkAAAAAAACAAAABAAAAIAAAAAAAAAAAUGZFZABAAGEhkgHg/+AALgHb/9sAAAABAAAAAAAAAgAAAAAAAAACAAAAAgAAJQAlACUAJQAAAAAAAwAAAAMAAAAcAAEAAAAAAFwAAwABAAAAHAAEAEAAAAAMAAgAAgAEAAAAYSAiIZAhkv//AAAAAABhICIhkCGS//8AAP+l3+PedN5xAAEAAAAAAAAAAAAAAAAAAAEGAAABAAAAAAAAAAECAAAAAgAAAAAAAAAAAAAAAAAAAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABgAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAFAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGAIwAsAEWAAIAJQAlAdsB2wAYACwAAD8BNjQvASYjIg8BBhUUHwEHBhUUHwEWMzI2FAcGBwYiJyYnJjQ3Njc2MhcWF/GCBgaCBQcIBR0GBldXBgYdBQgH7x0eMjB8MDIeHR0eMjB8MDIecYIGDgaCBQUeBQcJBFhYBAkHBR4F0nwwMh4dHR4yMHwwMh4dHR4yAAAAAgAlACUB2wHbABgALAAAJTc2NTQvATc2NTQvASYjIg8BBhQfARYzMjYUBwYHBiInJicmNDc2NzYyFxYXASgdBgZXVwYGHQUIBwWCBgaCBQcIuB0eMjB8MDIeHR0eMjB8MDIecR4FBwkEWFgECQcFHgUFggYOBoIF0nwwMh4dHR4yMHwwMh4dHR4yAAABACUAJQHbAdsAEwAAABQHBgcGIicmJyY0NzY3NjIXFhcB2x0eMjB8MDIeHR0eMjB8MDIeAT58MDIeHR0eMjB8MDIeHR0eMgABACUAJQHbAdsAQwAAARUUBisBIicmPwEmIyIHBgcGBwYUFxYXFhcWMzI3Njc2MzIfARYVFAcGBwYjIicmJyYnJjQ3Njc2NzYzMhcWFzc2FxYB2woIgAsGBQkoKjodHBwSFAwLCwwUEhwcHSIeIBMGAQQDJwMCISspNC8mLBobFBERFBsaLCYvKicpHSUIDAsBt4AICgsLCScnCwwUEhwcOhwcEhQMCw8OHAMDJwMDAgQnFBQRFBsaLCZeJiwaGxQRDxEcJQgEBgAAAAAAAAwAlgABAAAAAAABAAUADAABAAAAAAACAAcAIgABAAAAAAADACEAbgABAAAAAAAEAAUAnAABAAAAAAAFAAsAugABAAAAAAAGAAUA0gADAAEECQABAAoAAAADAAEECQACAA4AEgADAAEECQADAEIAKgADAAEECQAEAAoAkAADAAEECQAFABYAogADAAEECQAGAAoAxgBzAGwAaQBjAGsAAHNsaWNrAABSAGUAZwB1AGwAYQByAABSZWd1bGFyAABGAG8AbgB0AEYAbwByAGcAZQAgADIALgAwACAAOgAgAHMAbABpAGMAawAgADoAIAAxADQALQA0AC0AMgAwADEANAAARm9udEZvcmdlIDIuMCA6IHNsaWNrIDogMTQtNC0yMDE0AABzAGwAaQBjAGsAAHNsaWNrAABWAGUAcgBzAGkAbwBuACAAMQAuADAAAFZlcnNpb24gMS4wAABzAGwAaQBjAGsAAHNsaWNrAAAAAAIAAAAAAAAAAAAAAAAAAQAAAAAAAAAAAAAAAAAAAAAABwAAAAEAAgECAQMAhwBECmFycm93cmlnaHQJYXJyb3dsZWZ0AAAAAAAAAf//AAIAAQAAAA4AAAAYAAAAAAACAAEAAwAGAAEABAAAAAIAAAAAAAEAAAAAzu7XsAAAAADPcXh/AAAAAM9xeH8=') format('embedded-opentype'), url('data:font/woff;base64,d09GRk9UVE8AAAVkAAsAAAAAB1wAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABDRkYgAAABCAAAAi4AAAKbH/pWDkZGVE0AAAM4AAAAGgAAABxt0civR0RFRgAAA1QAAAAcAAAAIAAyAARPUy8yAAADcAAAAFIAAABgUBj/rmNtYXAAAAPEAAAAUAAAAWIiC0SwaGVhZAAABBQAAAAuAAAANgABMftoaGVhAAAERAAAABwAAAAkA+UCA2htdHgAAARgAAAADgAAAA4ESgBKbWF4cAAABHAAAAAGAAAABgAFUABuYW1lAAAEeAAAANwAAAFuBSeBwnBvc3QAAAVUAAAAEAAAACAAAwABeJw9ks9vEkEUx2cpWyeUoFYgNkHi2Wt7N3rVm3cTs3UVLC4LxIWEQvi1P3i7O1tYLJDAmlgKGEhQrsajf0j7J3jYTXrQWUrMJG+++b55n5e8NwwKBhHDMLv5kxT3ATEBxKBn3qOAl9zxHgb1MAPhHQgHkyF08Gr/L8B/Eb6zWnmCJ7AJVLubQOheArXvJ1A4EXi6j4I+Zg9F0QFKvsnlBCmXeve+sFEnb/nCptdtQ4QYhVFRAT1HrF8UQK/RL/SbmUbclsvGVFXRZKDHUE38cc4qpkbAAsuwiImvro+ufcfaOIQ6szlrmjRJDaKZKnbjN3GWKIbiIzRFUfCffuxxKOL+3LDlDVvx2TdxN84qZEsnhNBa6pgm2dAsnzbLsETdsmRFxUeHV4e+I2/ptN8TyqV8T3Dt29t7EYOuajVIw2y1Wy3M86w0zg/Fz2IvawmQAUHOVrPVfLkoScVynsqsTG0MGUs4z55nh3mnOJa+li+rl9WpPIcFfDubDeaDC+fLBdYN3QADzLauGfj4B6sZmq6CCpqmtSvF0qlUl2qf5AJIUCSlTqlb7lUG+LRfGzZGzZEyBgccMu6MuqPecNDvD4Y9Kjtj4gD+DsvKVMTcMdtqtZtmkzQstQvYje7Syep0PDSAhSOeHYXYWThEF//A/0YvYV1fSQtpKU5STtrhbQ444OtpKSWJIg3pOg8cBs7maTY1EZf07aq+hjWs7IWzdCYTGhb2CtZ47x+Uhx28AAB4nGNgYGBkAIJz765vANHnCyvqYTQAWnkHswAAeJxjYGRgYOADYgkGEGBiYARCFjAG8RgABHYAN3icY2BmYmCcwMDKwMHow5jGwMDgDqW/MkgytDAwMDGwcjKAQQMDAyOQUmCAgoA01xQGB4ZExUmMD/4/YNBjvP3/NgNEDQPjbbBKBQZGADfLDgsAAHicY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQzMCQqKClOUJz0/z9YHRLv/+L7D+8V3cuHmgAHjGwM6ELUByxUMIOZCmbgAAA5LQ8XeJxjYGRgYABiO68w73h+m68M3EwMIHC+sKIeTqsyqDLeZrwN5HIwgKUB/aYJUgAAeJxjYGRgYLzNwMCgx8QAAkA2IwMqYAIAMGIB7QIAAAACAAAlACUAJQAlAAAAAFAAAAUAAHicbY49asNAEIU/2ZJDfkiRIvXapUFCEqpcptABUrg3ZhEiQoKVfY9UqVLlGDlADpAT5e16IUWysMz3hjfzBrjjjQT/EjKpCy+4YhN5yZoxcirPe+SMWz4jr6S+5UzSa3VuwpTnBfc8RF7yxDZyKs9r5IxHPiKv1P9iZqDnyAvMQ39UecbScVb/gJO03Xk4CFom3XYK1clhMdQUlKo7/d9NF13RkIdfy+MV7TSe2sl11tRFaXYmJKpWTd7kdVnJ8veevZKc+n3I93t9Jnvr5n4aTVWU/0z9AI2qMkV4nGNgZkAGjAxoAAAAjgAF') format('woff'), url('data:font/ttf;base64,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') format('truetype'), url("data:image/svg+xml,%3c?xml%20version='1.0'%20standalone='no'?%3e%3c!DOCTYPE%20svg%20PUBLIC%20'-//W3C//DTD%20SVG%201.1//EN'%20'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3e%3csvg%20xmlns='http://www.w3.org/2000/svg'%3e%3cmetadata%3eGenerated%20by%20Fontastic.me%3c/metadata%3e%3cdefs%3e%3cfont%20id='slick'%20horiz-adv-x='512'%3e%3cfont-face%20font-family='slick'%20units-per-em='512'%20ascent='480'%20descent='-32'/%3e%3cmissing-glyph%20horiz-adv-x='512'%20/%3e%3cglyph%20unicode='&%238594;'%20d='M241%20113l130%20130c4%204%206%208%206%2013%200%205-2%209-6%2013l-130%20130c-3%203-7%205-12%205-5%200-10-2-13-5l-29-30c-4-3-6-7-6-12%200-5%202-10%206-13l87-88-87-88c-4-3-6-8-6-13%200-5%202-9%206-12l29-30c3-3%208-5%2013-5%205%200%209%202%2012%205z%20m234%20143c0-40-9-77-29-110-20-34-46-60-80-80-33-20-70-29-110-29-40%200-77%209-110%2029-34%2020-60%2046-80%2080-20%2033-29%2070-29%20110%200%2040%209%2077%2029%20110%2020%2034%2046%2060%2080%2080%2033%2020%2070%2029%20110%2029%2040%200%2077-9%20110-29%2034-20%2060-46%2080-80%2020-33%2029-70%2029-110z'/%3e%3cglyph%20unicode='&%238592;'%20d='M296%20113l29%2030c4%203%206%207%206%2012%200%205-2%2010-6%2013l-87%2088%2087%2088c4%203%206%208%206%2013%200%205-2%209-6%2012l-29%2030c-3%203-8%205-13%205-5%200-9-2-12-5l-130-130c-4-4-6-8-6-13%200-5%202-9%206-13l130-130c3-3%207-5%2012-5%205%200%2010%202%2013%205z%20m179%20143c0-40-9-77-29-110-20-34-46-60-80-80-33-20-70-29-110-29-40%200-77%209-110%2029-34%2020-60%2046-80%2080-20%2033-29%2070-29%20110%200%2040%209%2077%2029%20110%2020%2034%2046%2060%2080%2080%2033%2020%2070%2029%20110%2029%2040%200%2077-9%20110-29%2034-20%2060-46%2080-80%2020-33%2029-70%2029-110z'/%3e%3cglyph%20unicode='&%238226;'%20d='M475%20256c0-40-9-77-29-110-20-34-46-60-80-80-33-20-70-29-110-29-40%200-77%209-110%2029-34%2020-60%2046-80%2080-20%2033-29%2070-29%20110%200%2040%209%2077%2029%20110%2020%2034%2046%2060%2080%2080%2033%2020%2070%2029%20110%2029%2040%200%2077-9%20110-29%2034-20%2060-46%2080-80%2020-33%2029-70%2029-110z'/%3e%3cglyph%20unicode='&%2397;'%20d='M475%20439l0-128c0-5-1-9-5-13-4-4-8-5-13-5l-128%200c-8%200-13%203-17%2011-3%207-2%2014%204%2020l40%2039c-28%2026-62%2039-100%2039-20%200-39-4-57-11-18-8-33-18-46-32-14-13-24-28-32-46-7-18-11-37-11-57%200-20%204-39%2011-57%208-18%2018-33%2032-46%2013-14%2028-24%2046-32%2018-7%2037-11%2057-11%2023%200%2044%205%2064%2015%2020%209%2038%2023%2051%2042%202%201%204%203%207%203%203%200%205-1%207-3l39-39c2-2%203-3%203-6%200-2-1-4-2-6-21-25-46-45-76-59-29-14-60-20-93-20-30%200-58%205-85%2017-27%2012-51%2027-70%2047-20%2019-35%2043-47%2070-12%2027-17%2055-17%2085%200%2030%205%2058%2017%2085%2012%2027%2027%2051%2047%2070%2019%2020%2043%2035%2070%2047%2027%2012%2055%2017%2085%2017%2028%200%2055-5%2081-15%2026-11%2050-26%2070-45l37%2037c6%206%2012%207%2020%204%208-4%2011-9%2011-17z'/%3e%3c/font%3e%3c/defs%3e%3c/svg%3e") format('svg'); } /* Arrows */ .slick-prev, .slick-next { font-size: 0; line-height: 0; position: absolute; top: 50%; display: block; width: 20px; height: 20px; padding: 0; -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); cursor: pointer; color: transparent; border: none; outline: none; background: transparent; } .slick-prev:hover, .slick-prev:focus, .slick-next:hover, .slick-next:focus { color: transparent; outline: none; background: transparent; } .slick-prev:hover:before, .slick-prev:focus:before, .slick-next:hover:before, .slick-next:focus:before { opacity: 1; } .slick-prev.slick-disabled:before, .slick-next.slick-disabled:before { opacity: .25; } .slick-prev:before, .slick-next:before { font-family: 'slick'; font-size: 20px; line-height: 1; opacity: .75; color: white; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .slick-prev { left: -25px; } [dir='rtl'] .slick-prev { right: -25px; left: auto; } .slick-prev:before { content: '←'; } [dir='rtl'] .slick-prev:before { content: '→'; } .slick-next { right: -25px; } [dir='rtl'] .slick-next { right: auto; left: -25px; } .slick-next:before { content: '→'; } [dir='rtl'] .slick-next:before { content: '←'; } /* Dots */ .slick-dotted.slick-slider { margin-bottom: 30px; } .slick-dots { position: absolute; bottom: -25px; display: block; width: 100%; padding: 0; margin: 0; list-style: none; text-align: center; } .slick-dots li { position: relative; display: inline-block; width: 20px; height: 20px; margin: 0 5px; padding: 0; cursor: pointer; } .slick-dots li button { font-size: 0; line-height: 0; display: block; width: 20px; height: 20px; padding: 5px; cursor: pointer; color: transparent; border: 0; outline: none; background: transparent; } .slick-dots li button:hover, .slick-dots li button:focus { outline: none; } .slick-dots li button:hover:before, .slick-dots li button:focus:before { opacity: 1; } .slick-dots li button:before { font-family: 'slick'; font-size: 6px; line-height: 20px; position: absolute; top: 0; left: 0; width: 20px; height: 20px; content: '•'; text-align: center; opacity: .25; color: black; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .slick-dots li.slick-active button:before { opacity: .75; color: black; }