/* ============ LIBRARIES ============ */ /* _flexbox-grid.scss */ .flex-container, .flex-container-fluid { margin-right: auto; margin-left: auto; padding-right: 2rem; padding-left: 2rem; } .flex-row { box-sizing: border-box; display: -webkit-flex; display: -ms-flexbox; display: -webkit-box; display: flex; -webkit-flex: 0 1 auto; -ms-flex: 0 1 auto; -webkit-box-flex: 0; flex: 0 1 auto; -webkit-flex-direction: row; -ms-flex-direction: row; -webkit-box-orient: horizontal; -webkit-box-direction: normal; flex-direction: row; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-right: -1rem; margin-left: -1rem; } .flex-row.reverse { -webkit-flex-direction: row-reverse; -ms-flex-direction: row-reverse; -webkit-box-orient: horizontal; -webkit-box-direction: reverse; flex-direction: row-reverse; } .flex-col.reverse { -webkit-flex-direction: column-reverse; -ms-flex-direction: column-reverse; -webkit-box-orient: vertical; -webkit-box-direction: reverse; flex-direction: column-reverse; } .flex-col-xs, .flex-col-xs-1, .flex-col-xs-2, .flex-col-xs-3, .flex-col-xs-4, .flex-col-xs-5, .flex-col-xs-6, .flex-col-xs-7, .flex-col-xs-8, .flex-col-xs-9, .flex-col-xs-10, .flex-col-xs-11, .flex-col-xs-12 { box-sizing: border-box; -webkit-flex: 0 0 auto; -ms-flex: 0 0 auto; -webkit-box-flex: 0; flex: 0 0 auto; padding-right: 1rem; padding-left: 1rem; } .flex-col-xs { -webkit-flex-grow: 1; -ms-flex-positive: 1; -webkit-box-flex: 1; flex-grow: 1; -ms-flex-preferred-size: 0; -webkit-flex-basis: 0; flex-basis: 0; max-width: 100%; } .flex-col-xs-1 { -ms-flex-preferred-size: 8.333%; -webkit-flex-basis: 8.333%; flex-basis: 8.333%; max-width: 8.333%; } .flex-col-xs-2 { -ms-flex-preferred-size: 16.667%; -webkit-flex-basis: 16.667%; flex-basis: 16.667%; max-width: 16.667%; } .flex-col-xs-3 { -ms-flex-preferred-size: 25%; -webkit-flex-basis: 25%; flex-basis: 25%; max-width: 25%; } .flex-col-xs-4 { -ms-flex-preferred-size: 33.333%; -webkit-flex-basis: 33.333%; flex-basis: 33.333%; max-width: 33.333%; } .flex-col-xs-5 { -ms-flex-preferred-size: 41.667%; -webkit-flex-basis: 41.667%; flex-basis: 41.667%; max-width: 41.667%; } .flex-col-xs-6 { -ms-flex-preferred-size: 50%; -webkit-flex-basis: 50%; flex-basis: 50%; max-width: 50%; } .flex-col-xs-7 { -ms-flex-preferred-size: 58.333%; -webkit-flex-basis: 58.333%; flex-basis: 58.333%; max-width: 58.333%; } .flex-col-xs-8 { -ms-flex-preferred-size: 66.667%; -webkit-flex-basis: 66.667%; flex-basis: 66.667%; max-width: 66.667%; } .flex-col-xs-9 { -ms-flex-preferred-size: 75%; -webkit-flex-basis: 75%; flex-basis: 75%; max-width: 75%; } .flex-col-xs-10 { -ms-flex-preferred-size: 83.333%; -webkit-flex-basis: 83.333%; flex-basis: 83.333%; max-width: 83.333%; } .flex-col-xs-11 { -ms-flex-preferred-size: 91.667%; -webkit-flex-basis: 91.667%; flex-basis: 91.667%; max-width: 91.667%; } .flex-col-xs-12 { -ms-flex-preferred-size: 100%; -webkit-flex-basis: 100%; flex-basis: 100%; max-width: 100%; } .flex-col-xs-offset-1 { margin-left: 8.333%; } .flex-col-xs-offset-2 { margin-left: 16.667%; } .flex-col-xs-offset-3 { margin-left: 25%; } .flex-col-xs-offset-4 { margin-left: 33.333%; } .flex-col-xs-offset-5 { margin-left: 41.667%; } .flex-col-xs-offset-6 { margin-left: 50%; } .flex-col-xs-offset-7 { margin-left: 58.333%; } .flex-col-xs-offset-8 { margin-left: 66.667%; } .flex-col-xs-offset-9 { margin-left: 75%; } .flex-col-xs-offset-10 { margin-left: 83.333%; } .flex-col-xs-offset-11 { margin-left: 91.667%; } .start-xs { -webkit-justify-content: flex-start; -ms-flex-pack: start; -webkit-box-pack: start; justify-content: flex-start; text-align: start; } .center-xs { -webkit-justify-content: center; -ms-flex-pack: center; -webkit-box-pack: center; justify-content: center; text-align: center; } .end-xs { -webkit-justify-content: flex-end; -ms-flex-pack: end; -webkit-box-pack: end; justify-content: flex-end; text-align: end; } .top-xs { -webkit-align-items: flex-start; -ms-flex-align: start; -webkit-box-align: start; align-items: flex-start; } .middle-xs { -webkit-align-items: center; -ms-flex-align: center; -webkit-box-align: center; align-items: center; } .bottom-xs { -webkit-align-items: flex-end; -ms-flex-align: end; -webkit-box-align: end; align-items: flex-end; } .around-xs { -webkit-justify-content: space-around; -ms-flex-pack: distribute; justify-content: space-around; } .between-xs { -webkit-justify-content: space-between; -ms-flex-pack: justify; -webkit-box-pack: justify; justify-content: space-between; } .first-xs { -webkit-order: -1; -ms-flex-order: -1; -webkit-box-ordinal-group: 0; order: -1; } .last-xs { -webkit-order: 1; -ms-flex-order: 1; -webkit-box-ordinal-group: 2; order: 1; } @media only screen and (min-width: 768px) { .flex-container { width: 750px; } .flex-col-sm, .flex-col-sm-1, .flex-col-sm-2, .flex-col-sm-3, .flex-col-sm-4, .flex-col-sm-5, .flex-col-sm-6, .flex-col-sm-7, .flex-col-sm-8, .flex-col-sm-9, .flex-col-sm-10, .flex-col-sm-11, .flex-col-sm-12 { box-sizing: border-box; -webkit-flex: 0 0 auto; -ms-flex: 0 0 auto; -webkit-box-flex: 0; flex: 0 0 auto; padding-right: 1rem; padding-left: 1rem; } .flex-col-sm { -webkit-flex-grow: 1; -ms-flex-positive: 1; -webkit-box-flex: 1; flex-grow: 1; -ms-flex-preferred-size: 0; -webkit-flex-basis: 0; flex-basis: 0; max-width: 100%; } .flex-col-sm-1 { -ms-flex-preferred-size: 8.333%; -webkit-flex-basis: 8.333%; flex-basis: 8.333%; max-width: 8.333%; } .flex-col-sm-2 { -ms-flex-preferred-size: 16.667%; -webkit-flex-basis: 16.667%; flex-basis: 16.667%; max-width: 16.667%; } .flex-col-sm-3 { -ms-flex-preferred-size: 25%; -webkit-flex-basis: 25%; flex-basis: 25%; max-width: 25%; } .flex-col-sm-4 { -ms-flex-preferred-size: 33.333%; -webkit-flex-basis: 33.333%; flex-basis: 33.333%; max-width: 33.333%; } .flex-col-sm-5 { -ms-flex-preferred-size: 41.667%; -webkit-flex-basis: 41.667%; flex-basis: 41.667%; max-width: 41.667%; } .flex-col-sm-6 { -ms-flex-preferred-size: 50%; -webkit-flex-basis: 50%; flex-basis: 50%; max-width: 50%; } .flex-col-sm-7 { -ms-flex-preferred-size: 58.333%; -webkit-flex-basis: 58.333%; flex-basis: 58.333%; max-width: 58.333%; } .flex-col-sm-8 { -ms-flex-preferred-size: 66.667%; -webkit-flex-basis: 66.667%; flex-basis: 66.667%; max-width: 66.667%; } .flex-col-sm-9 { -ms-flex-preferred-size: 75%; -webkit-flex-basis: 75%; flex-basis: 75%; max-width: 75%; } .flex-col-sm-10 { -ms-flex-preferred-size: 83.333%; -webkit-flex-basis: 83.333%; flex-basis: 83.333%; max-width: 83.333%; } .flex-col-sm-11 { -ms-flex-preferred-size: 91.667%; -webkit-flex-basis: 91.667%; flex-basis: 91.667%; max-width: 91.667%; } .flex-col-sm-12 { -ms-flex-preferred-size: 100%; -webkit-flex-basis: 100%; flex-basis: 100%; max-width: 100%; } .flex-col-sm-offset-0 { margin-left: 0; } .flex-col-sm-offset-1 { margin-left: 8.333%; } .flex-col-sm-offset-2 { margin-left: 16.667%; } .flex-col-sm-offset-3 { margin-left: 25%; } .flex-col-sm-offset-4 { margin-left: 33.333%; } .flex-col-sm-offset-5 { margin-left: 41.667%; } .flex-col-sm-offset-6 { margin-left: 50%; } .flex-col-sm-offset-7 { margin-left: 58.333%; } .flex-col-sm-offset-8 { margin-left: 66.667%; } .flex-col-sm-offset-9 { margin-left: 75%; } .flex-col-sm-offset-10 { margin-left: 83.333%; } .flex-col-sm-offset-11 { margin-left: 91.667%; } .start-sm { -webkit-justify-content: flex-start; -ms-flex-pack: start; -webkit-box-pack: start; justify-content: flex-start; text-align: start; } .center-sm { -webkit-justify-content: center; -ms-flex-pack: center; -webkit-box-pack: center; justify-content: center; text-align: center; } .end-sm { -webkit-justify-content: flex-end; -ms-flex-pack: end; -webkit-box-pack: end; justify-content: flex-end; text-align: end; } .top-sm { -webkit-align-items: flex-start; -ms-flex-align: start; -webkit-box-align: start; align-items: flex-start; } .middle-sm { -webkit-align-items: center; -ms-flex-align: center; -webkit-box-align: center; align-items: center; } .bottom-sm { -webkit-align-items: flex-end; -ms-flex-align: end; -webkit-box-align: end; align-items: flex-end; } .around-sm { -webkit-justify-content: space-around; -ms-flex-pack: distribute; justify-content: space-around; } .between-sm { -webkit-justify-content: space-between; -ms-flex-pack: justify; -webkit-box-pack: justify; justify-content: space-between; } .first-sm { -webkit-order: -1; -ms-flex-order: -1; -webkit-box-ordinal-group: 0; order: -1; } .last-sm { -webkit-order: 1; -ms-flex-order: 1; -webkit-box-ordinal-group: 2; order: 1; } } @media only screen and (min-width: 1024px) { .flex-container { width: 970px; } .flex-col-md, .flex-col-md-1, .flex-col-md-2, .flex-col-md-3, .flex-col-md-4, .flex-col-md-5, .flex-col-md-6, .flex-col-md-7, .flex-col-md-8, .flex-col-md-9, .flex-col-md-10, .flex-col-md-11, .flex-col-md-12 { box-sizing: border-box; -webkit-flex: 0 0 auto; -ms-flex: 0 0 auto; -webkit-box-flex: 0; flex: 0 0 auto; padding-right: 1rem; padding-left: 1rem; } .flex-col-md { -webkit-flex-grow: 1; -ms-flex-positive: 1; -webkit-box-flex: 1; flex-grow: 1; -ms-flex-preferred-size: 0; -webkit-flex-basis: 0; flex-basis: 0; max-width: 100%; } .flex-col-md-1 { -ms-flex-preferred-size: 8.333%; -webkit-flex-basis: 8.333%; flex-basis: 8.333%; max-width: 8.333%; } .flex-col-md-2 { -ms-flex-preferred-size: 16.667%; -webkit-flex-basis: 16.667%; flex-basis: 16.667%; max-width: 16.667%; } .flex-col-md-3 { -ms-flex-preferred-size: 25%; -webkit-flex-basis: 25%; flex-basis: 25%; max-width: 25%; } .flex-col-md-4 { -ms-flex-preferred-size: 33.333%; -webkit-flex-basis: 33.333%; flex-basis: 33.333%; max-width: 33.333%; } .flex-col-md-5 { -ms-flex-preferred-size: 41.667%; -webkit-flex-basis: 41.667%; flex-basis: 41.667%; max-width: 41.667%; } .flex-col-md-6 { -ms-flex-preferred-size: 50%; -webkit-flex-basis: 50%; flex-basis: 50%; max-width: 50%; } .flex-col-md-7 { -ms-flex-preferred-size: 58.333%; -webkit-flex-basis: 58.333%; flex-basis: 58.333%; max-width: 58.333%; } .flex-col-md-8 { -ms-flex-preferred-size: 66.667%; -webkit-flex-basis: 66.667%; flex-basis: 66.667%; max-width: 66.667%; } .flex-col-md-9 { -ms-flex-preferred-size: 75%; -webkit-flex-basis: 75%; flex-basis: 75%; max-width: 75%; } .flex-col-md-10 { -ms-flex-preferred-size: 83.333%; -webkit-flex-basis: 83.333%; flex-basis: 83.333%; max-width: 83.333%; } .flex-col-md-11 { -ms-flex-preferred-size: 91.667%; -webkit-flex-basis: 91.667%; flex-basis: 91.667%; max-width: 91.667%; } .flex-col-md-12 { -ms-flex-preferred-size: 100%; -webkit-flex-basis: 100%; flex-basis: 100%; max-width: 100%; } .flex-col-md-offset-0 { margin-left: 0; } .flex-col-md-offset-1 { margin-left: 8.333%; } .flex-col-md-offset-2 { margin-left: 16.667%; } .flex-col-md-offset-3 { margin-left: 25%; } .flex-col-md-offset-4 { margin-left: 33.333%; } .flex-col-md-offset-5 { margin-left: 41.667%; } .flex-col-md-offset-6 { margin-left: 50%; } .flex-col-md-offset-7 { margin-left: 58.333%; } .flex-col-md-offset-8 { margin-left: 66.667%; } .flex-col-md-offset-9 { margin-left: 75%; } .flex-col-md-offset-10 { margin-left: 83.333%; } .flex-col-md-offset-11 { margin-left: 91.667%; } .start-md { -webkit-justify-content: flex-start; -ms-flex-pack: start; -webkit-box-pack: start; justify-content: flex-start; text-align: start; } .center-md { -webkit-justify-content: center; -ms-flex-pack: center; -webkit-box-pack: center; justify-content: center; text-align: center; } .end-md { -webkit-justify-content: flex-end; -ms-flex-pack: end; -webkit-box-pack: end; justify-content: flex-end; text-align: end; } .top-md { -webkit-align-items: flex-start; -ms-flex-align: start; -webkit-box-align: start; align-items: flex-start; } .middle-md { -webkit-align-items: center; -ms-flex-align: center; -webkit-box-align: center; align-items: center; } .bottom-md { -webkit-align-items: flex-end; -ms-flex-align: end; -webkit-box-align: end; align-items: flex-end; } .around-md { -webkit-justify-content: space-around; -ms-flex-pack: distribute; justify-content: space-around; } .between-md { -webkit-justify-content: space-between; -ms-flex-pack: justify; -webkit-box-pack: justify; justify-content: space-between; } .first-md { -webkit-order: -1; -ms-flex-order: -1; -webkit-box-ordinal-group: 0; order: -1; } .last-md { -webkit-order: 1; -ms-flex-order: 1; -webkit-box-ordinal-group: 2; order: 1; } } @media only screen and (min-width: 1440px) { .flex-container { width: 1240px; } .flex-col-lg, .flex-col-lg-1, .flex-col-lg-2, .flex-col-lg-3, .flex-col-lg-4, .flex-col-lg-5, .flex-col-lg-6, .flex-col-lg-7, .flex-col-lg-8, .flex-col-lg-9, .flex-col-lg-10, .flex-col-lg-11, .flex-col-lg-12 { box-sizing: border-box; -webkit-flex: 0 0 auto; -ms-flex: 0 0 auto; -webkit-box-flex: 0; flex: 0 0 auto; padding-right: 1rem; padding-left: 1rem; } .flex-col-lg { -webkit-flex-grow: 1; -ms-flex-positive: 1; -webkit-box-flex: 1; flex-grow: 1; -ms-flex-preferred-size: 0; -webkit-flex-basis: 0; flex-basis: 0; max-width: 100%; } .flex-col-lg-1 { -ms-flex-preferred-size: 8.333%; -webkit-flex-basis: 8.333%; flex-basis: 8.333%; max-width: 8.333%; } .flex-col-lg-2 { -ms-flex-preferred-size: 16.667%; -webkit-flex-basis: 16.667%; flex-basis: 16.667%; max-width: 16.667%; } .flex-col-lg-3 { -ms-flex-preferred-size: 25%; -webkit-flex-basis: 25%; flex-basis: 25%; max-width: 25%; } .flex-col-lg-4 { -ms-flex-preferred-size: 33.333%; -webkit-flex-basis: 33.333%; flex-basis: 33.333%; max-width: 33.333%; } .flex-col-lg-5 { -ms-flex-preferred-size: 41.667%; -webkit-flex-basis: 41.667%; flex-basis: 41.667%; max-width: 41.667%; } .flex-col-lg-6 { -ms-flex-preferred-size: 50%; -webkit-flex-basis: 50%; flex-basis: 50%; max-width: 50%; } .flex-col-lg-7 { -ms-flex-preferred-size: 58.333%; -webkit-flex-basis: 58.333%; flex-basis: 58.333%; max-width: 58.333%; } .flex-col-lg-8 { -ms-flex-preferred-size: 66.667%; -webkit-flex-basis: 66.667%; flex-basis: 66.667%; max-width: 66.667%; } .flex-col-lg-9 { -ms-flex-preferred-size: 75%; -webkit-flex-basis: 75%; flex-basis: 75%; max-width: 75%; } .flex-col-lg-10 { -ms-flex-preferred-size: 83.333%; -webkit-flex-basis: 83.333%; flex-basis: 83.333%; max-width: 83.333%; } .flex-col-lg-11 { -ms-flex-preferred-size: 91.667%; -webkit-flex-basis: 91.667%; flex-basis: 91.667%; max-width: 91.667%; } .flex-col-lg-12 { -ms-flex-preferred-size: 100%; -webkit-flex-basis: 100%; flex-basis: 100%; max-width: 100%; } .flex-col-lg-offset-0 { margin-left: 0; } .flex-col-lg-offset-1 { margin-left: 8.333%; } .flex-col-lg-offset-2 { margin-left: 16.667%; } .flex-col-lg-offset-3 { margin-left: 25%; } .flex-col-lg-offset-4 { margin-left: 33.333%; } .flex-col-lg-offset-5 { margin-left: 41.667%; } .flex-col-lg-offset-6 { margin-left: 50%; } .flex-col-lg-offset-7 { margin-left: 58.333%; } .flex-col-lg-offset-8 { margin-left: 66.667%; } .flex-col-lg-offset-9 { margin-left: 75%; } .flex-col-lg-offset-10 { margin-left: 83.333%; } .flex-col-lg-offset-11 { margin-left: 91.667%; } .start-lg { -webkit-justify-content: flex-start; -ms-flex-pack: start; -webkit-box-pack: start; justify-content: flex-start; text-align: start; } .center-lg { -webkit-justify-content: center; -ms-flex-pack: center; -webkit-box-pack: center; justify-content: center; text-align: center; } .end-lg { -webkit-justify-content: flex-end; -ms-flex-pack: end; -webkit-box-pack: end; justify-content: flex-end; text-align: end; } .top-lg { -webkit-align-items: flex-start; -ms-flex-align: start; -webkit-box-align: start; align-items: flex-start; } .middle-lg { -webkit-align-items: center; -ms-flex-align: center; -webkit-box-align: center; align-items: center; } .bottom-lg { -webkit-align-items: flex-end; -ms-flex-align: end; -webkit-box-align: end; align-items: flex-end; } .around-lg { -webkit-justify-content: space-around; -ms-flex-pack: distribute; justify-content: space-around; } .between-lg { -webkit-justify-content: space-between; -ms-flex-pack: justify; -webkit-box-pack: justify; justify-content: space-between; } .first-lg { -webkit-order: -1; -ms-flex-order: -1; -webkit-box-ordinal-group: 0; order: -1; } .last-lg { -webkit-order: 1; -ms-flex-order: 1; -webkit-box-ordinal-group: 2; order: 1; } } /* ============ BASE ============ */ /* _variables.scss */ /* ============ Colors ============ */ /* ============ Fonts ============ */ /* ============ Breakpoints ============ */ /* .example { width: 100%; @include bp-sm { width: 50%; } } */ /* breakpoints */ /* transitions */ /* _reset.scss */ html { -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; font-size: 62.5%; scroll-behavior: smooth; } body { margin: 0; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } body.locked { overflow: hidden; } article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary { display: block; } audio, canvas, progress, video { display: inline-block; vertical-align: baseline; } img { max-width: 100%; } *::selection { background-color: #1963B0; color: white; } *, *::before, *::after { box-sizing: border-box; } .clearfix::before, .clearfix::after { content: ""; display: table; } .clearfix::after { clear: both; } * { scroll-margin-top: 100px; } *:target::before { content: ""; display: block; height: 90px; margin: -90px 0 0; } *:target::before:focus { outline: none; } *:target:focus { outline: none; } hr { width: 100%; } a, a:visited, a:hover, a:focus, input, input:hover { transition: all 0.33s ease; text-decoration: none; color: var(--e-global-color-158c4ba); font-weight: bold; } .elementor a, .elementor a:visited, .elementor a:hover, .elementor a:focus, .elementor input, .elementor input:hover { transition: all 0.33s ease; text-decoration: none; } /* _typography.scss */ /* ============ FONTS ============ */ /* ============ TAGS ============ */ h1, h2, h3, h4, h5, h6 { margin: 0; margin-bottom: 15px; } /* _buttons.scss */ a.link-arrow, .link-arrow span, span.link-arrow, .plan-your-visit .link-items a, .portals span.elementor-cta__button, .modal-slider a { color: var(--e-global-color-9cd78d6) !important; display: flex; align-items: center; gap: 5px; text-transform: uppercase; font-weight: bold; transition: all 0.25s ease-in-out; } a.link-arrow:after, .link-arrow span:after, span.link-arrow:after, .plan-your-visit .link-items a:after, .portals span.elementor-cta__button:after, .modal-slider a:after { display: block; content: ""; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11.814' height='13.524' viewBox='0 0 11.814 13.524'%3E%3Cg id='Arrow' transform='translate(1 1.414)'%3E%3Cline id='Line_12' data-name='Line 12' x2='9.814' transform='translate(0 5.348)' fill='none' stroke='%2300c389' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'/%3E%3Cpath id='Path_4160' data-name='Path 4160' d='M946.207,547.917l5.483,5.348-5.483,5.348' transform='translate(-941.875 -547.917)' fill='none' stroke='%2300c389' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'/%3E%3C/g%3E%3C/svg%3E%0A"); height: 13px; width: 13px; background-repeat: no-repeat; background-size: contain; background-position: center; transform: translateX(0px); transition: all 0.25s ease-in-out; color: var(--e-global-color-9cd78d6); } a.link-arrow:hover, .link-arrow span:hover, span.link-arrow:hover, .plan-your-visit .link-items a:hover, .portals span.elementor-cta__button:hover, .modal-slider a:hover { color: var(--e-global-color-158c4ba) !important; } a.link-arrow:hover::after, .link-arrow span:hover::after, span.link-arrow:hover::after, .plan-your-visit .link-items a:hover::after, .portals span.elementor-cta__button:hover::after, .modal-slider a:hover::after { transform: translateX(3px); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11.814' height='13.524' viewBox='0 0 11.814 13.524'%3E%3Cg id='Arrow' transform='translate(1 1.414)'%3E%3Cline id='Line_12' data-name='Line 12' x2='9.814' transform='translate(0 5.348)' fill='none' stroke='%23F58674' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'/%3E%3Cpath id='Path_4160' data-name='Path 4160' d='M946.207,547.917l5.483,5.348-5.483,5.348' transform='translate(-941.875 -547.917)' fill='none' stroke='%23F58674' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'/%3E%3C/g%3E%3C/svg%3E%0A"); } .elementor-loop-container .e-loop-item:hover .link-arrow span, .elementor-loop-container .e-loop-item:hover .link-arrow, .elementor-loop-container .e-loop-item:hover span.elementor-cta__button, .elementor-loop-container .e-loop-item:hover span .link-arrow, .portal-slider .slide:hover .link-arrow span, .portal-slider .slide:hover .link-arrow, .portal-slider .slide:hover span.elementor-cta__button, .portal-slider .slide:hover span .link-arrow, .portals:hover .link-arrow span, .portals:hover .link-arrow, .portals:hover span.elementor-cta__button, .portals:hover span .link-arrow, #posts-grid .post:hover .link-arrow span, #posts-grid .post:hover .link-arrow, #posts-grid .post:hover span.elementor-cta__button, #posts-grid .post:hover span .link-arrow { color: var(--e-global-color-158c4ba) !important; } .elementor-loop-container .e-loop-item:hover .link-arrow span::after, .elementor-loop-container .e-loop-item:hover .link-arrow::after, .elementor-loop-container .e-loop-item:hover span.elementor-cta__button::after, .elementor-loop-container .e-loop-item:hover span .link-arrow::after, .portal-slider .slide:hover .link-arrow span::after, .portal-slider .slide:hover .link-arrow::after, .portal-slider .slide:hover span.elementor-cta__button::after, .portal-slider .slide:hover span .link-arrow::after, .portals:hover .link-arrow span::after, .portals:hover .link-arrow::after, .portals:hover span.elementor-cta__button::after, .portals:hover span .link-arrow::after, #posts-grid .post:hover .link-arrow span::after, #posts-grid .post:hover .link-arrow::after, #posts-grid .post:hover span.elementor-cta__button::after, #posts-grid .post:hover span .link-arrow::after { transform: translateX(3px); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11.814' height='13.524' viewBox='0 0 11.814 13.524'%3E%3Cg id='Arrow' transform='translate(1 1.414)'%3E%3Cline id='Line_12' data-name='Line 12' x2='9.814' transform='translate(0 5.348)' fill='none' stroke='%23F58674' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'/%3E%3Cpath id='Path_4160' data-name='Path 4160' d='M946.207,547.917l5.483,5.348-5.483,5.348' transform='translate(-941.875 -547.917)' fill='none' stroke='%23F58674' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'/%3E%3C/g%3E%3C/svg%3E%0A"); } a.learn-more, .learn-more a, .portals span.elementor-cta__button { display: flex; align-items: center; gap: 5px; text-transform: uppercase; font-weight: bold; } a.learn-more--green, .learn-more a--green, .portals span.elementor-cta__button--green { color: var(--e-global-color-9cd78d6); } .portals span.elementor-cta__button { padding: 0 !important; } /* ============ COMPONENTS ============ */ /* _header.scss */ #google_translate_element { align-items: center; display: flex; outline: none; position: relative; } #google_translate_element::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26.641' height='24.281' viewBox='0 0 26.641 24.281'%3E%3Cg id='Language_Icon' data-name='Language Icon' transform='translate(518.998 17.441)'%3E%3Cpath id='Path_45869' data-name='Path 45869' d='M307.631,210.889l-1.751-4.377a.352.352,0,0,0-.035-.07l-.026-.044h0a.279.279,0,0,0-.044-.057l-.035-.044-.048-.039-.053-.026a.17.17,0,0,0-.048-.026l-.066-.035h0a.152.152,0,0,0-.048,0l-.066-.022h-.254l-.075.022a.183.183,0,0,0-.044,0l-.066.035-.066.026a.374.374,0,0,0-.048.039l-.048.039-.039.044h0a.662.662,0,0,0-.044.057v.044l-.039.07-2.626,6.566h0a.657.657,0,0,0,.368.875.593.593,0,0,0,.245.048.661.661,0,0,0,.609-.411l.709-1.777h2.626l.709,1.777h0a.666.666,0,0,0,.613.411.592.592,0,0,0,.241-.048.657.657,0,0,0,.368-.875Zm-3.139-.4.784-1.952.779,1.952Z' transform='translate(-805.898 -213.276)' fill='%23fff'/%3E%3Cpath id='Path_45870' data-name='Path 45870' d='M25.769,8.757a2.986,2.986,0,0,0-2.1-.877H16.581v-4.9A2.985,2.985,0,0,0,13.6,0H2.981A2.985,2.985,0,0,0,0,2.981V9.621a2.947,2.947,0,0,0,.5,1.65c1.051,2.022,5.9,5.012,5.949,5.043a.685.685,0,0,0,.341.1.652.652,0,0,0,.609-.9,18.283,18.283,0,0,1-.814-2.924h3.5v4.9a2.981,2.981,0,0,0,2.959,2.977h7a18.28,18.28,0,0,1-.814,2.915.652.652,0,0,0,.609.9.684.684,0,0,0,.341-.1c.053-.031,4.9-3.02,5.949-5.043a2.946,2.946,0,0,0,.5-1.655V10.86a2.985,2.985,0,0,0-.871-2.1M10.807,8.9a3.821,3.821,0,0,1-1.353-.293,5.689,5.689,0,0,0,1.213-3.025h.355a.657.657,0,0,0,0-1.313H8.947V3.1a.657.657,0,0,0-1.313,0V4.268H5.59a.657.657,0,1,0,0,1.313H9.345a4.324,4.324,0,0,1-.963,2.276A4.437,4.437,0,0,1,7.507,6.4a.657.657,0,0,0-1.226.473A5.905,5.905,0,0,0,7.306,8.619a4.3,4.3,0,0,1-1.694.311.657.657,0,0,0,0,1.313,5.282,5.282,0,0,0,2.771-.722,4.645,4.645,0,0,0,1.773.635,2.88,2.88,0,0,0-.088.7v.438l-1.344-.022H5.8a.673.673,0,0,0-.5.232.652.652,0,0,0-.149.525c0,.061.157,1.011.438,2.141-1.471-1.024-3.406-2.513-3.94-3.5a.646.646,0,0,0-.066-.123,1.6,1.6,0,0,1-.3-.946V2.981A1.672,1.672,0,0,1,2.981,1.313H13.6a1.672,1.672,0,0,1,1.668,1.668v4.9H13.049A2.981,2.981,0,0,0,10.807,8.9M25.06,18.433a.632.632,0,0,0-.066.118c-.516.981-2.456,2.473-3.94,3.5a18.564,18.564,0,0,0,.438-2.141h0a.651.651,0,0,0-.149-.525.665.665,0,0,0-.495-.236h-7.8a1.668,1.668,0,0,1-1.668-1.663V10.86a1.672,1.672,0,0,1,1.668-1.668H23.668a1.672,1.672,0,0,1,1.668,1.668l.022,6.628a1.6,1.6,0,0,1-.3.945' transform='translate(-518.998 -17.441)' fill='%23fff'/%3E%3C/g%3E%3C/svg%3E%0A"); background-position: center; background-size: contain; background-repeat: no-repeat; content: ""; display: inline-block; height: 25px; width: 25px; } @media only screen and (min-width: 1024px) { #google_translate_element::before { height: 20px; width: 20px; } } #google_translate_element .skiptranslate { display: flex; font-size: 0; } #google_translate_element .skiptranslate select { appearance: none; background: transparent url("data:image/svg+xml;utf8,") 100% 4px/12px no-repeat; border: none; color: var(--e-global-color-e235738); cursor: pointer; font-family: var(--e-global-typography-56d38d6-font-family), Sans-serif; font-size: 10px; font-weight: bold; letter-spacing: 0.1rem; margin-top: 6px; outline: none; padding-left: 8px; text-transform: uppercase; width: 150px; } @media only screen and (min-width: 1024px) { #google_translate_element .skiptranslate select { font-size: 12px; width: 165px; } } #google_translate_element .skiptranslate select option { background-color: white; color: black; text-transform: none; } #google_translate_element .skiptranslate > span { position: absolute; scale: 0; } /* _flex-nav.scss */ nav.flex-nav { align-items: flex-start; display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: space-between; padding: 0; } nav.flex-nav ul#mainnav { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; list-style: none; margin: 0; padding: 0; } nav.flex-nav ul#mainnav li { flex: 0 1 auto; } nav.flex-nav ul#mainnav li a { display: flex; } nav.flex-nav ul#mainnav li a:hover { background: #ddd; } nav.flex-nav ul#mainnav li > a.current { background: #ddd; } nav.flex-nav ul#mainnav li ul { display: none; flex-direction: column; list-style: none; margin: 0; padding: 0; position: absolute; z-index: 2000; } nav.flex-nav ul#mainnav li ul > li { display: block; position: relative; white-space: nowrap; z-index: 999; } nav.flex-nav ul#mainnav li ul > li a { background: #eee; display: block; padding: 8px 12px; width: 100%; } nav.flex-nav ul#mainnav li ul > li ul { left: 100%; top: 0; } nav.flex-nav ul#mainnav a { text-decoration: none; } nav.flex-nav ul#mainnav > li:hover > ul, nav.flex-nav ul#mainnav > li > ul > li:hover > ul { display: flex; } /* _sidecar.scss */ #siteWrapper { background-color: black; min-height: 100vh; position: relative; } .body-overlay { background: black; cursor: col-resize; display: block; height: 0; left: 0; opacity: 0; position: absolute; top: 0; transition-delay: 0.44s !important; transition: opacity 0.55s ease; visibility: hidden; width: 0; z-index: -100; } .body-overlay.active { height: 100%; opacity: 0.6; transition-delay: 0.2s !important; transition: opacity 0.55s ease; visibility: visible; width: 100%; z-index: 100; } #sidecar-toggle { background: black url("../assets/icons/ui/hamburger.svg") center/16px no-repeat; border-radius: 4px; display: block; height: 40px; margin-left: auto; width: 40px; } @media only screen and (min-width: 1440px) { #sidecar-toggle { display: none; } } /* ============ Sidecar Drawer ============ */ #sidecar { background-color: white; height: 100%; overflow-x: hidden; overflow-y: scroll; position: fixed; right: -300px; text-align: left; top: 0; transition: right 0.44s ease; width: 300px; z-index: 99999 !important; } #sidecar #close-sidecar { background: none; border: 2px solid black; border-radius: 4px; color: black; font: bold 1.6rem sans-serif; padding: 12px 48px 12px 24px; position: absolute; top: 16px; right: 16px; } #sidecar #close-sidecar::after { content: ""; height: 16px; pointer-events: none; position: absolute; top: 16px; right: 16px; width: 16px; } #sidecar ul#mainnav { right: 0px; } #sidecar.slide-right { left: inherit; opacity: 1; right: -300px; transition: transform 0.44s ease-in-out, left 0.44s ease-in-out, right 0.44s ease-in-out; } #sidecar.slide-right.active { box-shadow: 0px -5px 20px rgba(0, 0, 0, 0.3); opacity: 1; right: 0; transition: all 0.44s ease; } #sidecar.slide-right.active ul#mainnav li a { margin-left: 0px; opacity: 1; } /* ============ Sidecar Menu ============ */ nav#sidecar ul#mainnav { -webkit-padding-start: 0px; background: transparent; display: block; height: auto; margin: 100px 0 40px; position: relative; width: 100%; } nav#sidecar ul#mainnav #mn-home { display: none; } nav#sidecar ul#mainnav li { background: transparent; display: block; float: none; height: auto; margin: 0; padding: 0; position: relative; text-align: left; width: 100%; } nav#sidecar ul#mainnav li:nth-child(1) a { transition-delay: 0.05s !important; } nav#sidecar ul#mainnav li:nth-child(2) a { transition-delay: 0.1s !important; } nav#sidecar ul#mainnav li:nth-child(3) a { transition-delay: 0.15s !important; } nav#sidecar ul#mainnav li:nth-child(4) a { transition-delay: 0.2s !important; } nav#sidecar ul#mainnav li:nth-child(5) a { transition-delay: 0.25s !important; } nav#sidecar ul#mainnav li:nth-child(6) a { transition-delay: 0.3s !important; } nav#sidecar ul#mainnav li:nth-child(7) a { transition-delay: 0.35s !important; } nav#sidecar ul#mainnav li:nth-child(8) a { transition-delay: 0.4s !important; } nav#sidecar ul#mainnav li:nth-child(9) a { transition-delay: 0.45s !important; } nav#sidecar ul#mainnav li ul { background: rgba(0, 0, 0, 0.2); display: block; float: none; margin: 0; max-height: 0px; overflow: hidden; padding: 0 0 0 0px; position: relative; transition: max-height 0.25s ease-in; } nav#sidecar ul#mainnav li ul li a { border: none; font: normal 1.6rem sans-serif; padding: 8px 0px 8px 16px; } nav#sidecar ul#mainnav li ul.active { display: block; float: none; max-height: 500px; transition: max-height 0.44s ease-in; } nav#sidecar ul#mainnav li a { color: black; display: inline-block; font: normal 2rem sans-serif; height: auto; opacity: 0; padding: 8px 16px; position: relative; transition: all 0.44s ease; width: 100%; } nav#sidecar ul#mainnav li a.expand { background: url("../assets/icons/ui/arrow-dark.svg") center/50% no-repeat; cursor: pointer; display: block; height: 40px; padding: 16px; position: absolute; right: 0; top: 0; width: 40px; } nav#sidecar ul#mainnav li a.expand.active { transform: rotate(180deg); } ul.eael-simple-menu > li.menu-item > span.eael-simple-menu-indicator { align-items: center; display: flex; height: 40px; justify-content: center; top: 5px; width: 40px; } ul.eael-simple-menu ul.sub-menu span.eael-simple-menu-indicator { align-items: center; display: flex; height: 40px; justify-content: center; top: 0; width: 40px; } /* _alert.scss */ .page-alert { display: flex; align-items: center; background-color: var(--e-global-color-9cd78d6); height: fit-content; opacity: 0; transition: opacity, height 0.5s ease 0.2s; visibility: hidden; position: relative; height: 0px; z-index: -100; } .page-alert--active { opacity: 1; visibility: visible; padding: 24px; z-index: 99; height: fit-content; } .page-alert__message { width: 100%; text-align: center; color: var(--e-global-color-ebd8d0b); font-weight: 600; } .page-alert__dismiss { cursor: pointer; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15.363' height='14.175' viewBox='0 0 15.363 14.175'%3E%3Cg id='Close_Icon' data-name='Close Icon' transform='translate(-13790.088 -123.088)'%3E%3Cline id='Line_13' data-name='Line 13' x2='12.538' y2='11.35' transform='translate(13791.5 124.5)' fill='none' stroke='%23052e21' stroke-linecap='round' stroke-width='2'/%3E%3Cline id='Line_14' data-name='Line 14' x1='12.538' y2='11.35' transform='translate(13791.5 124.5)' fill='none' stroke='%23052e21' stroke-linecap='round' stroke-width='2'/%3E%3C/g%3E%3C/svg%3E%0A"); height: 16px; width: 16px; background-position: center; background-size: cover; position: absolute; top: 15px; right: 15px; } /* _footer.scss */ /* _gdpr.scss */ #gdpr-bar { background: var(--e-global-color-cf44058); color: white; position: fixed; bottom: 0; left: 0; transform: translateX(-100%); transition: transform 0.25s ease; width: 100vw; z-index: 100; border-top: 1px solid white; } #gdpr-bar.active { transform: translate(0, 0); } #gdpr-bar .flex-container { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; padding: 20px; margin: 0; width: 100% !important; } @media only screen and (min-width: 1024px) { #gdpr-bar .flex-container { padding: 50px 30px; } } #gdpr-bar p { width: 100%; } @media only screen and (min-width: 1024px) { #gdpr-bar p { flex: 1; } } #gdpr-bar p, #gdpr-bar a, #gdpr-bar button { color: white; } #gdpr-bar a { font-weight: bold; text-decoration: underline; } #gdpr-bar #gdpr-accept { background: transparent; border-color: white; font-size: 12px; border-radius: 3px; } #gdpr-bar #gdpr-accept:hover { cursor: pointer; } /* ============ HELPERS ============ */ /* _mixins.scss */ /* ============ Pseudo Element Overlay ============ */ .shade { position: relative; } .shade::before { background: black; content: ""; height: 100%; left: 0; opacity: 0.5; position: absolute; top: 0; transition: opacity 0.25s ease; width: 100%; z-index: 0; } /* ============ BG Images ============ */ .bg-image, .bg-image-js { background-attachment: scroll; background-position: center; background-repeat: no-repeat; background-size: cover; } /* ============ Paddding Adjustments ============ */ .no-border { border: 0; } .no-padding { padding: 0; } .no-margin { margin: 0; } .cushion-sm { padding: 2%; } .cushion-md { padding: 5%; } .cushion-lg { padding: 10%; } .cushion-v-sm { padding: 2% 0; } .cushion-v-md { padding: 5% 0; } .cushion-v-lg { padding: 10% 0; } .cushion-h-sm { padding: 0 2%; } .cushion-h-md { padding: 0 5%; } .cushion-h-lg { padding: 0 10%; } .white { color: white !important; } /* ============ Alignment ============ */ .center { text-align: center; } .centered { left: 50%; position: absolute; top: 50%; transform: translate(-50%, -50%); } .v-centered { position: absolute; top: 50%; transform: translateY(-50%); } .h-centered { left: 50%; position: absolute; transform: translateX(-50%); } .flex-center { align-items: center; display: flex; flex-direction: column; justify-content: center; } .flex-spread { display: flex; flex-wrap: wrap; justify-content: space-between; } /* ============ Transitions ============ */ .transition-cubic { transition: all 0.55s cubic-bezier(0.645, 0.045, 0.355, 1); } .transition-fast { transition: all 0.2s ease; } .transition { transition: all 0.5s ease; } .transition-slow { transition: all 1s ease; } .transition-bounce { transition: all 0.3s cubic-bezier(0.33, 2, 0.8, 1); } .easeInOutBack { transition: all 0.6s cubic-bezier(0.68, -0.55, 0.265, 1.55); } /* ============ Animation delays ============ */ .delay-1 { animation-delay: 0.1s; } .delay-2 { animation-delay: 0.2s; } .delay-3 { animation-delay: 0.3s; } .delay-4 { animation-delay: 0.4s; } .delay-5 { animation-delay: 0.5s; } .delay-6 { animation-delay: 0.6s; } /* _helpers.scss */ /* ============ Responsive Embed Wrapper ============ */ .embed-container { height: 0; max-width: 100%; overflow: hidden; padding-bottom: 56.25%; position: relative; } .embed-container iframe, .embed-container object, .embed-container embed { border: none; height: 100%; position: absolute; top: 0; left: 0; width: 100%; } /* ============ Better Browser Alert ============ */ iframe.get-a-better-browser { background: white; height: 100vh; position: fixed; top: 0; left: 0; width: 100vw; z-index: 1000; } /* _animate.scss */ .animated { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } .animated.infinite { -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; } .animated.hinge { -webkit-animation-duration: 2s; animation-duration: 2s; } .animated.flipOutX, .animated.flipOutY, .animated.bounceIn, .animated.bounceOut { -webkit-animation-duration: 0.75s; animation-duration: 0.75s; } @-webkit-keyframes bounce { from, 20%, 53%, 80%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } 40%, 43% { -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); -webkit-transform: translate3d(0, -30px, 0); transform: translate3d(0, -30px, 0); } 70% { -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); -webkit-transform: translate3d(0, -15px, 0); transform: translate3d(0, -15px, 0); } 90% { -webkit-transform: translate3d(0, -4px, 0); transform: translate3d(0, -4px, 0); } } @keyframes bounce { from, 20%, 53%, 80%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } 40%, 43% { -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); -webkit-transform: translate3d(0, -30px, 0); transform: translate3d(0, -30px, 0); } 70% { -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); -webkit-transform: translate3d(0, -15px, 0); transform: translate3d(0, -15px, 0); } 90% { -webkit-transform: translate3d(0, -4px, 0); transform: translate3d(0, -4px, 0); } } .bounce { -webkit-animation-name: bounce; animation-name: bounce; -webkit-transform-origin: center bottom; transform-origin: center bottom; } @-webkit-keyframes flash { from, 50%, to { opacity: 1; } 25%, 75% { opacity: 0; } } @keyframes flash { from, 50%, to { opacity: 1; } 25%, 75% { opacity: 0; } } .flash { -webkit-animation-name: flash; animation-name: flash; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes pulse { from { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 50% { -webkit-transform: scale3d(1.05, 1.05, 1.05); transform: scale3d(1.05, 1.05, 1.05); } to { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } @keyframes pulse { from { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 50% { -webkit-transform: scale3d(1.05, 1.05, 1.05); transform: scale3d(1.05, 1.05, 1.05); } to { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } .pulse { -webkit-animation-name: pulse; animation-name: pulse; } @-webkit-keyframes rubberBand { from { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 30% { -webkit-transform: scale3d(1.25, 0.75, 1); transform: scale3d(1.25, 0.75, 1); } 40% { -webkit-transform: scale3d(0.75, 1.25, 1); transform: scale3d(0.75, 1.25, 1); } 50% { -webkit-transform: scale3d(1.15, 0.85, 1); transform: scale3d(1.15, 0.85, 1); } 65% { -webkit-transform: scale3d(0.95, 1.05, 1); transform: scale3d(0.95, 1.05, 1); } 75% { -webkit-transform: scale3d(1.05, 0.95, 1); transform: scale3d(1.05, 0.95, 1); } to { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } @keyframes rubberBand { from { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 30% { -webkit-transform: scale3d(1.25, 0.75, 1); transform: scale3d(1.25, 0.75, 1); } 40% { -webkit-transform: scale3d(0.75, 1.25, 1); transform: scale3d(0.75, 1.25, 1); } 50% { -webkit-transform: scale3d(1.15, 0.85, 1); transform: scale3d(1.15, 0.85, 1); } 65% { -webkit-transform: scale3d(0.95, 1.05, 1); transform: scale3d(0.95, 1.05, 1); } 75% { -webkit-transform: scale3d(1.05, 0.95, 1); transform: scale3d(1.05, 0.95, 1); } to { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } .rubberBand { -webkit-animation-name: rubberBand; animation-name: rubberBand; } @-webkit-keyframes shake { from, to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } 10%, 30%, 50%, 70%, 90% { -webkit-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0); } 20%, 40%, 60%, 80% { -webkit-transform: translate3d(10px, 0, 0); transform: translate3d(10px, 0, 0); } } @keyframes shake { from, to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } 10%, 30%, 50%, 70%, 90% { -webkit-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0); } 20%, 40%, 60%, 80% { -webkit-transform: translate3d(10px, 0, 0); transform: translate3d(10px, 0, 0); } } .shake { -webkit-animation-name: shake; animation-name: shake; } @-webkit-keyframes headShake { 0% { -webkit-transform: translateX(0); transform: translateX(0); } 6.5% { -webkit-transform: translateX(-6px) rotateY(-9deg); transform: translateX(-6px) rotateY(-9deg); } 18.5% { -webkit-transform: translateX(5px) rotateY(7deg); transform: translateX(5px) rotateY(7deg); } 31.5% { -webkit-transform: translateX(-3px) rotateY(-5deg); transform: translateX(-3px) rotateY(-5deg); } 43.5% { -webkit-transform: translateX(2px) rotateY(3deg); transform: translateX(2px) rotateY(3deg); } 50% { -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes headShake { 0% { -webkit-transform: translateX(0); transform: translateX(0); } 6.5% { -webkit-transform: translateX(-6px) rotateY(-9deg); transform: translateX(-6px) rotateY(-9deg); } 18.5% { -webkit-transform: translateX(5px) rotateY(7deg); transform: translateX(5px) rotateY(7deg); } 31.5% { -webkit-transform: translateX(-3px) rotateY(-5deg); transform: translateX(-3px) rotateY(-5deg); } 43.5% { -webkit-transform: translateX(2px) rotateY(3deg); transform: translateX(2px) rotateY(3deg); } 50% { -webkit-transform: translateX(0); transform: translateX(0); } } .headShake { -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; -webkit-animation-name: headShake; animation-name: headShake; } @-webkit-keyframes swing { 20% { -webkit-transform: rotate3d(0, 0, 1, 15deg); transform: rotate3d(0, 0, 1, 15deg); } 40% { -webkit-transform: rotate3d(0, 0, 1, -10deg); transform: rotate3d(0, 0, 1, -10deg); } 60% { -webkit-transform: rotate3d(0, 0, 1, 5deg); transform: rotate3d(0, 0, 1, 5deg); } 80% { -webkit-transform: rotate3d(0, 0, 1, -5deg); transform: rotate3d(0, 0, 1, -5deg); } to { -webkit-transform: rotate3d(0, 0, 1, 0deg); transform: rotate3d(0, 0, 1, 0deg); } } @keyframes swing { 20% { -webkit-transform: rotate3d(0, 0, 1, 15deg); transform: rotate3d(0, 0, 1, 15deg); } 40% { -webkit-transform: rotate3d(0, 0, 1, -10deg); transform: rotate3d(0, 0, 1, -10deg); } 60% { -webkit-transform: rotate3d(0, 0, 1, 5deg); transform: rotate3d(0, 0, 1, 5deg); } 80% { -webkit-transform: rotate3d(0, 0, 1, -5deg); transform: rotate3d(0, 0, 1, -5deg); } to { -webkit-transform: rotate3d(0, 0, 1, 0deg); transform: rotate3d(0, 0, 1, 0deg); } } .swing { -webkit-transform-origin: top center; transform-origin: top center; -webkit-animation-name: swing; animation-name: swing; } @-webkit-keyframes tada { from { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 10%, 20% { -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg); transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg); } 30%, 50%, 70%, 90% { -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); } 40%, 60%, 80% { -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); } to { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } @keyframes tada { from { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 10%, 20% { -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg); transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg); } 30%, 50%, 70%, 90% { -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); } 40%, 60%, 80% { -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); } to { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } .tada { -webkit-animation-name: tada; animation-name: tada; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes wobble { from { -webkit-transform: none; transform: none; } 15% { -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); } 30% { -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); } 45% { -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); } 60% { -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); } 75% { -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); } to { -webkit-transform: none; transform: none; } } @keyframes wobble { from { -webkit-transform: none; transform: none; } 15% { -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); } 30% { -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); } 45% { -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); } 60% { -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); } 75% { -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); } to { -webkit-transform: none; transform: none; } } .wobble { -webkit-animation-name: wobble; animation-name: wobble; } @-webkit-keyframes jello { from, 11.1%, to { -webkit-transform: none; transform: none; } 22.2% { -webkit-transform: skewX(-12.5deg) skewY(-12.5deg); transform: skewX(-12.5deg) skewY(-12.5deg); } 33.3% { -webkit-transform: skewX(6.25deg) skewY(6.25deg); transform: skewX(6.25deg) skewY(6.25deg); } 44.4% { -webkit-transform: skewX(-3.125deg) skewY(-3.125deg); transform: skewX(-3.125deg) skewY(-3.125deg); } 55.5% { -webkit-transform: skewX(1.5625deg) skewY(1.5625deg); transform: skewX(1.5625deg) skewY(1.5625deg); } 66.6% { -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg); transform: skewX(-0.78125deg) skewY(-0.78125deg); } 77.7% { -webkit-transform: skewX(0.390625deg) skewY(0.390625deg); transform: skewX(0.390625deg) skewY(0.390625deg); } 88.8% { -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg); transform: skewX(-0.1953125deg) skewY(-0.1953125deg); } } @keyframes jello { from, 11.1%, to { -webkit-transform: none; transform: none; } 22.2% { -webkit-transform: skewX(-12.5deg) skewY(-12.5deg); transform: skewX(-12.5deg) skewY(-12.5deg); } 33.3% { -webkit-transform: skewX(6.25deg) skewY(6.25deg); transform: skewX(6.25deg) skewY(6.25deg); } 44.4% { -webkit-transform: skewX(-3.125deg) skewY(-3.125deg); transform: skewX(-3.125deg) skewY(-3.125deg); } 55.5% { -webkit-transform: skewX(1.5625deg) skewY(1.5625deg); transform: skewX(1.5625deg) skewY(1.5625deg); } 66.6% { -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg); transform: skewX(-0.78125deg) skewY(-0.78125deg); } 77.7% { -webkit-transform: skewX(0.390625deg) skewY(0.390625deg); transform: skewX(0.390625deg) skewY(0.390625deg); } 88.8% { -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg); transform: skewX(-0.1953125deg) skewY(-0.1953125deg); } } .jello { -webkit-animation-name: jello; animation-name: jello; -webkit-transform-origin: center; transform-origin: center; } @-webkit-keyframes bounceIn { from, 20%, 40%, 60%, 80%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 0% { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); } 20% { -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); } 40% { -webkit-transform: scale3d(0.9, 0.9, 0.9); transform: scale3d(0.9, 0.9, 0.9); } 60% { opacity: 1; -webkit-transform: scale3d(1.03, 1.03, 1.03); transform: scale3d(1.03, 1.03, 1.03); } 80% { -webkit-transform: scale3d(0.97, 0.97, 0.97); transform: scale3d(0.97, 0.97, 0.97); } to { opacity: 1; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } @keyframes bounceIn { from, 20%, 40%, 60%, 80%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 0% { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); } 20% { -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); } 40% { -webkit-transform: scale3d(0.9, 0.9, 0.9); transform: scale3d(0.9, 0.9, 0.9); } 60% { opacity: 1; -webkit-transform: scale3d(1.03, 1.03, 1.03); transform: scale3d(1.03, 1.03, 1.03); } 80% { -webkit-transform: scale3d(0.97, 0.97, 0.97); transform: scale3d(0.97, 0.97, 0.97); } to { opacity: 1; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } .bounceIn { -webkit-animation-name: bounceIn; animation-name: bounceIn; } @-webkit-keyframes bounceInDown { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 0% { opacity: 0; -webkit-transform: translate3d(0, -3000px, 0); transform: translate3d(0, -3000px, 0); } 60% { opacity: 1; -webkit-transform: translate3d(0, 25px, 0); transform: translate3d(0, 25px, 0); } 75% { -webkit-transform: translate3d(0, -10px, 0); transform: translate3d(0, -10px, 0); } 90% { -webkit-transform: translate3d(0, 5px, 0); transform: translate3d(0, 5px, 0); } to { -webkit-transform: none; transform: none; } } @keyframes bounceInDown { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 0% { opacity: 0; -webkit-transform: translate3d(0, -3000px, 0); transform: translate3d(0, -3000px, 0); } 60% { opacity: 1; -webkit-transform: translate3d(0, 25px, 0); transform: translate3d(0, 25px, 0); } 75% { -webkit-transform: translate3d(0, -10px, 0); transform: translate3d(0, -10px, 0); } 90% { -webkit-transform: translate3d(0, 5px, 0); transform: translate3d(0, 5px, 0); } to { -webkit-transform: none; transform: none; } } .bounceInDown { -webkit-animation-name: bounceInDown; animation-name: bounceInDown; } @-webkit-keyframes bounceInLeft { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 0% { opacity: 0; -webkit-transform: translate3d(-3000px, 0, 0); transform: translate3d(-3000px, 0, 0); } 60% { opacity: 1; -webkit-transform: translate3d(25px, 0, 0); transform: translate3d(25px, 0, 0); } 75% { -webkit-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0); } 90% { -webkit-transform: translate3d(5px, 0, 0); transform: translate3d(5px, 0, 0); } to { -webkit-transform: none; transform: none; } } @keyframes bounceInLeft { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 0% { opacity: 0; -webkit-transform: translate3d(-3000px, 0, 0); transform: translate3d(-3000px, 0, 0); } 60% { opacity: 1; -webkit-transform: translate3d(25px, 0, 0); transform: translate3d(25px, 0, 0); } 75% { -webkit-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0); } 90% { -webkit-transform: translate3d(5px, 0, 0); transform: translate3d(5px, 0, 0); } to { -webkit-transform: none; transform: none; } } .bounceInLeft { -webkit-animation-name: bounceInLeft; animation-name: bounceInLeft; } @-webkit-keyframes bounceInRight { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } from { opacity: 0; -webkit-transform: translate3d(3000px, 0, 0); transform: translate3d(3000px, 0, 0); } 60% { opacity: 1; -webkit-transform: translate3d(-25px, 0, 0); transform: translate3d(-25px, 0, 0); } 75% { -webkit-transform: translate3d(10px, 0, 0); transform: translate3d(10px, 0, 0); } 90% { -webkit-transform: translate3d(-5px, 0, 0); transform: translate3d(-5px, 0, 0); } to { -webkit-transform: none; transform: none; } } @keyframes bounceInRight { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } from { opacity: 0; -webkit-transform: translate3d(3000px, 0, 0); transform: translate3d(3000px, 0, 0); } 60% { opacity: 1; -webkit-transform: translate3d(-25px, 0, 0); transform: translate3d(-25px, 0, 0); } 75% { -webkit-transform: translate3d(10px, 0, 0); transform: translate3d(10px, 0, 0); } 90% { -webkit-transform: translate3d(-5px, 0, 0); transform: translate3d(-5px, 0, 0); } to { -webkit-transform: none; transform: none; } } .bounceInRight { -webkit-animation-name: bounceInRight; animation-name: bounceInRight; } @-webkit-keyframes bounceInUp { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } from { opacity: 0; -webkit-transform: translate3d(0, 3000px, 0); transform: translate3d(0, 3000px, 0); } 60% { opacity: 1; -webkit-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0); } 75% { -webkit-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); } 90% { -webkit-transform: translate3d(0, -5px, 0); transform: translate3d(0, -5px, 0); } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @keyframes bounceInUp { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } from { opacity: 0; -webkit-transform: translate3d(0, 3000px, 0); transform: translate3d(0, 3000px, 0); } 60% { opacity: 1; -webkit-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0); } 75% { -webkit-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); } 90% { -webkit-transform: translate3d(0, -5px, 0); transform: translate3d(0, -5px, 0); } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } .bounceInUp { -webkit-animation-name: bounceInUp; animation-name: bounceInUp; } @-webkit-keyframes bounceOut { 20% { -webkit-transform: scale3d(0.9, 0.9, 0.9); transform: scale3d(0.9, 0.9, 0.9); } 50%, 55% { opacity: 1; -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); } to { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); } } @keyframes bounceOut { 20% { -webkit-transform: scale3d(0.9, 0.9, 0.9); transform: scale3d(0.9, 0.9, 0.9); } 50%, 55% { opacity: 1; -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); } to { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); } } .bounceOut { -webkit-animation-name: bounceOut; animation-name: bounceOut; } @-webkit-keyframes bounceOutDown { 20% { -webkit-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); } 40%, 45% { opacity: 1; -webkit-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0); } to { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } } @keyframes bounceOutDown { 20% { -webkit-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); } 40%, 45% { opacity: 1; -webkit-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0); } to { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } } .bounceOutDown { -webkit-animation-name: bounceOutDown; animation-name: bounceOutDown; } @-webkit-keyframes bounceOutLeft { 20% { opacity: 1; -webkit-transform: translate3d(20px, 0, 0); transform: translate3d(20px, 0, 0); } to { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } } @keyframes bounceOutLeft { 20% { opacity: 1; -webkit-transform: translate3d(20px, 0, 0); transform: translate3d(20px, 0, 0); } to { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } } .bounceOutLeft { -webkit-animation-name: bounceOutLeft; animation-name: bounceOutLeft; } @-webkit-keyframes bounceOutRight { 20% { opacity: 1; -webkit-transform: translate3d(-20px, 0, 0); transform: translate3d(-20px, 0, 0); } to { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } } @keyframes bounceOutRight { 20% { opacity: 1; -webkit-transform: translate3d(-20px, 0, 0); transform: translate3d(-20px, 0, 0); } to { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } } .bounceOutRight { -webkit-animation-name: bounceOutRight; animation-name: bounceOutRight; } @-webkit-keyframes bounceOutUp { 20% { -webkit-transform: translate3d(0, -10px, 0); transform: translate3d(0, -10px, 0); } 40%, 45% { opacity: 1; -webkit-transform: translate3d(0, 20px, 0); transform: translate3d(0, 20px, 0); } to { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } } @keyframes bounceOutUp { 20% { -webkit-transform: translate3d(0, -10px, 0); transform: translate3d(0, -10px, 0); } 40%, 45% { opacity: 1; -webkit-transform: translate3d(0, 20px, 0); transform: translate3d(0, 20px, 0); } to { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } } .bounceOutUp { -webkit-animation-name: bounceOutUp; animation-name: bounceOutUp; } @-webkit-keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } } @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } } .fadeIn { -webkit-animation-name: fadeIn; animation-name: fadeIn; } @-webkit-keyframes fadeInDown { from { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInDown { from { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInDown { -webkit-animation-name: fadeInDown; animation-name: fadeInDown; } @-webkit-keyframes fadeInDownBig { from { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInDownBig { from { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInDownBig { -webkit-animation-name: fadeInDownBig; animation-name: fadeInDownBig; } @-webkit-keyframes fadeInLeft { from { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInLeft { from { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInLeft { -webkit-animation-name: fadeInLeft; animation-name: fadeInLeft; } @-webkit-keyframes fadeInLeftBig { from { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInLeftBig { from { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInLeftBig { -webkit-animation-name: fadeInLeftBig; animation-name: fadeInLeftBig; } @-webkit-keyframes fadeInRight { from { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInRight { from { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInRight { -webkit-animation-name: fadeInRight; animation-name: fadeInRight; } @-webkit-keyframes fadeInRightBig { from { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInRightBig { from { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInRightBig { -webkit-animation-name: fadeInRightBig; animation-name: fadeInRightBig; } @-webkit-keyframes fadeInUp { from { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInUp { from { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInUp { -webkit-animation-name: fadeInUp; animation-name: fadeInUp; } @-webkit-keyframes fadeInUpBig { from { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInUpBig { from { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInUpBig { -webkit-animation-name: fadeInUpBig; animation-name: fadeInUpBig; } @-webkit-keyframes fadeOut { from { opacity: 1; } to { opacity: 0; } } @keyframes fadeOut { from { opacity: 1; } to { opacity: 0; } } .fadeOut { -webkit-animation-name: fadeOut; animation-name: fadeOut; } @-webkit-keyframes fadeOutDown { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } } @keyframes fadeOutDown { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } } .fadeOutDown { -webkit-animation-name: fadeOutDown; animation-name: fadeOutDown; } @-webkit-keyframes fadeOutDownBig { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } } @keyframes fadeOutDownBig { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } } .fadeOutDownBig { -webkit-animation-name: fadeOutDownBig; animation-name: fadeOutDownBig; } @-webkit-keyframes fadeOutLeft { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } } @keyframes fadeOutLeft { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } } .fadeOutLeft { -webkit-animation-name: fadeOutLeft; animation-name: fadeOutLeft; } @-webkit-keyframes fadeOutLeftBig { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } } @keyframes fadeOutLeftBig { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } } .fadeOutLeftBig { -webkit-animation-name: fadeOutLeftBig; animation-name: fadeOutLeftBig; } @-webkit-keyframes fadeOutRight { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } } @keyframes fadeOutRight { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } } .fadeOutRight { -webkit-animation-name: fadeOutRight; animation-name: fadeOutRight; } @-webkit-keyframes fadeOutRightBig { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } } @keyframes fadeOutRightBig { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } } .fadeOutRightBig { -webkit-animation-name: fadeOutRightBig; animation-name: fadeOutRightBig; } @-webkit-keyframes fadeOutUp { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } } @keyframes fadeOutUp { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } } .fadeOutUp { -webkit-animation-name: fadeOutUp; animation-name: fadeOutUp; } @-webkit-keyframes fadeOutUpBig { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } } @keyframes fadeOutUpBig { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } } .fadeOutUpBig { -webkit-animation-name: fadeOutUpBig; animation-name: fadeOutUpBig; } @-webkit-keyframes flip { from { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg); transform: perspective(400px) rotate3d(0, 1, 0, -360deg); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 40% { -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg); transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 50% { -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg); transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 80% { -webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95); transform: perspective(400px) scale3d(0.95, 0.95, 0.95); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } to { -webkit-transform: perspective(400px); transform: perspective(400px); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } } @keyframes flip { from { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg); transform: perspective(400px) rotate3d(0, 1, 0, -360deg); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 40% { -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg); transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 50% { -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg); transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 80% { -webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95); transform: perspective(400px) scale3d(0.95, 0.95, 0.95); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } to { -webkit-transform: perspective(400px); transform: perspective(400px); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } } .animated.flip { -webkit-backface-visibility: visible; backface-visibility: visible; -webkit-animation-name: flip; animation-name: flip; } @-webkit-keyframes flipInX { from { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); transform: perspective(400px) rotate3d(1, 0, 0, 90deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; opacity: 0; } 40% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); transform: perspective(400px) rotate3d(1, 0, 0, -20deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 60% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg); transform: perspective(400px) rotate3d(1, 0, 0, 10deg); opacity: 1; } 80% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg); transform: perspective(400px) rotate3d(1, 0, 0, -5deg); } to { -webkit-transform: perspective(400px); transform: perspective(400px); } } @keyframes flipInX { from { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); transform: perspective(400px) rotate3d(1, 0, 0, 90deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; opacity: 0; } 40% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); transform: perspective(400px) rotate3d(1, 0, 0, -20deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 60% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg); transform: perspective(400px) rotate3d(1, 0, 0, 10deg); opacity: 1; } 80% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg); transform: perspective(400px) rotate3d(1, 0, 0, -5deg); } to { -webkit-transform: perspective(400px); transform: perspective(400px); } } .flipInX { -webkit-backface-visibility: visible !important; backface-visibility: visible !important; -webkit-animation-name: flipInX; animation-name: flipInX; } @-webkit-keyframes flipInY { from { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); transform: perspective(400px) rotate3d(0, 1, 0, 90deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; opacity: 0; } 40% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg); transform: perspective(400px) rotate3d(0, 1, 0, -20deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 60% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg); transform: perspective(400px) rotate3d(0, 1, 0, 10deg); opacity: 1; } 80% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg); transform: perspective(400px) rotate3d(0, 1, 0, -5deg); } to { -webkit-transform: perspective(400px); transform: perspective(400px); } } @keyframes flipInY { from { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); transform: perspective(400px) rotate3d(0, 1, 0, 90deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; opacity: 0; } 40% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg); transform: perspective(400px) rotate3d(0, 1, 0, -20deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 60% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg); transform: perspective(400px) rotate3d(0, 1, 0, 10deg); opacity: 1; } 80% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg); transform: perspective(400px) rotate3d(0, 1, 0, -5deg); } to { -webkit-transform: perspective(400px); transform: perspective(400px); } } .flipInY { -webkit-backface-visibility: visible !important; backface-visibility: visible !important; -webkit-animation-name: flipInY; animation-name: flipInY; } @-webkit-keyframes flipOutX { from { -webkit-transform: perspective(400px); transform: perspective(400px); } 30% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); transform: perspective(400px) rotate3d(1, 0, 0, -20deg); opacity: 1; } to { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); transform: perspective(400px) rotate3d(1, 0, 0, 90deg); opacity: 0; } } @keyframes flipOutX { from { -webkit-transform: perspective(400px); transform: perspective(400px); } 30% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); transform: perspective(400px) rotate3d(1, 0, 0, -20deg); opacity: 1; } to { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); transform: perspective(400px) rotate3d(1, 0, 0, 90deg); opacity: 0; } } .flipOutX { -webkit-animation-name: flipOutX; animation-name: flipOutX; -webkit-backface-visibility: visible !important; backface-visibility: visible !important; } @-webkit-keyframes flipOutY { from { -webkit-transform: perspective(400px); transform: perspective(400px); } 30% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg); transform: perspective(400px) rotate3d(0, 1, 0, -15deg); opacity: 1; } to { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); transform: perspective(400px) rotate3d(0, 1, 0, 90deg); opacity: 0; } } @keyframes flipOutY { from { -webkit-transform: perspective(400px); transform: perspective(400px); } 30% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg); transform: perspective(400px) rotate3d(0, 1, 0, -15deg); opacity: 1; } to { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); transform: perspective(400px) rotate3d(0, 1, 0, 90deg); opacity: 0; } } .flipOutY { -webkit-backface-visibility: visible !important; backface-visibility: visible !important; -webkit-animation-name: flipOutY; animation-name: flipOutY; } @-webkit-keyframes lightSpeedIn { from { -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg); transform: translate3d(100%, 0, 0) skewX(-30deg); opacity: 0; } 60% { -webkit-transform: skewX(20deg); transform: skewX(20deg); opacity: 1; } 80% { -webkit-transform: skewX(-5deg); transform: skewX(-5deg); opacity: 1; } to { -webkit-transform: none; transform: none; opacity: 1; } } @keyframes lightSpeedIn { from { -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg); transform: translate3d(100%, 0, 0) skewX(-30deg); opacity: 0; } 60% { -webkit-transform: skewX(20deg); transform: skewX(20deg); opacity: 1; } 80% { -webkit-transform: skewX(-5deg); transform: skewX(-5deg); opacity: 1; } to { -webkit-transform: none; transform: none; opacity: 1; } } .lightSpeedIn { -webkit-animation-name: lightSpeedIn; animation-name: lightSpeedIn; -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } @-webkit-keyframes lightSpeedOut { from { opacity: 1; } to { -webkit-transform: translate3d(100%, 0, 0) skewX(30deg); transform: translate3d(100%, 0, 0) skewX(30deg); opacity: 0; } } @keyframes lightSpeedOut { from { opacity: 1; } to { -webkit-transform: translate3d(100%, 0, 0) skewX(30deg); transform: translate3d(100%, 0, 0) skewX(30deg); opacity: 0; } } .lightSpeedOut { -webkit-animation-name: lightSpeedOut; animation-name: lightSpeedOut; -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } @-webkit-keyframes rotateIn { from { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: rotate3d(0, 0, 1, -200deg); transform: rotate3d(0, 0, 1, -200deg); opacity: 0; } to { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: none; transform: none; opacity: 1; } } @keyframes rotateIn { from { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: rotate3d(0, 0, 1, -200deg); transform: rotate3d(0, 0, 1, -200deg); opacity: 0; } to { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: none; transform: none; opacity: 1; } } .rotateIn { -webkit-animation-name: rotateIn; animation-name: rotateIn; } @-webkit-keyframes rotateInDownLeft { from { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); opacity: 0; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: none; transform: none; opacity: 1; } } @keyframes rotateInDownLeft { from { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); opacity: 0; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: none; transform: none; opacity: 1; } } .rotateInDownLeft { -webkit-animation-name: rotateInDownLeft; animation-name: rotateInDownLeft; } @-webkit-keyframes rotateInDownRight { from { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); opacity: 0; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: none; transform: none; opacity: 1; } } @keyframes rotateInDownRight { from { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); opacity: 0; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: none; transform: none; opacity: 1; } } .rotateInDownRight { -webkit-animation-name: rotateInDownRight; animation-name: rotateInDownRight; } @-webkit-keyframes rotateInUpLeft { from { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); opacity: 0; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: none; transform: none; opacity: 1; } } @keyframes rotateInUpLeft { from { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); opacity: 0; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: none; transform: none; opacity: 1; } } .rotateInUpLeft { -webkit-animation-name: rotateInUpLeft; animation-name: rotateInUpLeft; } @-webkit-keyframes rotateInUpRight { from { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, -90deg); transform: rotate3d(0, 0, 1, -90deg); opacity: 0; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: none; transform: none; opacity: 1; } } @keyframes rotateInUpRight { from { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, -90deg); transform: rotate3d(0, 0, 1, -90deg); opacity: 0; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: none; transform: none; opacity: 1; } } .rotateInUpRight { -webkit-animation-name: rotateInUpRight; animation-name: rotateInUpRight; } @-webkit-keyframes rotateOut { from { -webkit-transform-origin: center; transform-origin: center; opacity: 1; } to { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: rotate3d(0, 0, 1, 200deg); transform: rotate3d(0, 0, 1, 200deg); opacity: 0; } } @keyframes rotateOut { from { -webkit-transform-origin: center; transform-origin: center; opacity: 1; } to { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: rotate3d(0, 0, 1, 200deg); transform: rotate3d(0, 0, 1, 200deg); opacity: 0; } } .rotateOut { -webkit-animation-name: rotateOut; animation-name: rotateOut; } @-webkit-keyframes rotateOutDownLeft { from { -webkit-transform-origin: left bottom; transform-origin: left bottom; opacity: 1; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); opacity: 0; } } @keyframes rotateOutDownLeft { from { -webkit-transform-origin: left bottom; transform-origin: left bottom; opacity: 1; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); opacity: 0; } } .rotateOutDownLeft { -webkit-animation-name: rotateOutDownLeft; animation-name: rotateOutDownLeft; } @-webkit-keyframes rotateOutDownRight { from { -webkit-transform-origin: right bottom; transform-origin: right bottom; opacity: 1; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); opacity: 0; } } @keyframes rotateOutDownRight { from { -webkit-transform-origin: right bottom; transform-origin: right bottom; opacity: 1; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); opacity: 0; } } .rotateOutDownRight { -webkit-animation-name: rotateOutDownRight; animation-name: rotateOutDownRight; } @-webkit-keyframes rotateOutUpLeft { from { -webkit-transform-origin: left bottom; transform-origin: left bottom; opacity: 1; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); opacity: 0; } } @keyframes rotateOutUpLeft { from { -webkit-transform-origin: left bottom; transform-origin: left bottom; opacity: 1; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); opacity: 0; } } .rotateOutUpLeft { -webkit-animation-name: rotateOutUpLeft; animation-name: rotateOutUpLeft; } @-webkit-keyframes rotateOutUpRight { from { -webkit-transform-origin: right bottom; transform-origin: right bottom; opacity: 1; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, 90deg); transform: rotate3d(0, 0, 1, 90deg); opacity: 0; } } @keyframes rotateOutUpRight { from { -webkit-transform-origin: right bottom; transform-origin: right bottom; opacity: 1; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, 90deg); transform: rotate3d(0, 0, 1, 90deg); opacity: 0; } } .rotateOutUpRight { -webkit-animation-name: rotateOutUpRight; animation-name: rotateOutUpRight; } @-webkit-keyframes hinge { 0% { -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 20%, 60% { -webkit-transform: rotate3d(0, 0, 1, 80deg); transform: rotate3d(0, 0, 1, 80deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 40%, 80% { -webkit-transform: rotate3d(0, 0, 1, 60deg); transform: rotate3d(0, 0, 1, 60deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; opacity: 1; } to { -webkit-transform: translate3d(0, 700px, 0); transform: translate3d(0, 700px, 0); opacity: 0; } } @keyframes hinge { 0% { -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 20%, 60% { -webkit-transform: rotate3d(0, 0, 1, 80deg); transform: rotate3d(0, 0, 1, 80deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 40%, 80% { -webkit-transform: rotate3d(0, 0, 1, 60deg); transform: rotate3d(0, 0, 1, 60deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; opacity: 1; } to { -webkit-transform: translate3d(0, 700px, 0); transform: translate3d(0, 700px, 0); opacity: 0; } } .hinge { -webkit-animation-name: hinge; animation-name: hinge; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes rollIn { from { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes rollIn { from { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); } to { opacity: 1; -webkit-transform: none; transform: none; } } .rollIn { -webkit-animation-name: rollIn; animation-name: rollIn; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes rollOut { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); } } @keyframes rollOut { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); } } .rollOut { -webkit-animation-name: rollOut; animation-name: rollOut; } @-webkit-keyframes zoomIn { from { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); } 50% { opacity: 1; } } @keyframes zoomIn { from { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); } 50% { opacity: 1; } } .zoomIn { -webkit-animation-name: zoomIn; animation-name: zoomIn; } @-webkit-keyframes zoomInDown { from { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } @keyframes zoomInDown { from { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } .zoomInDown { -webkit-animation-name: zoomInDown; animation-name: zoomInDown; } @-webkit-keyframes zoomInLeft { from { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } @keyframes zoomInLeft { from { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } .zoomInLeft { -webkit-animation-name: zoomInLeft; animation-name: zoomInLeft; } @-webkit-keyframes zoomInRight { from { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } @keyframes zoomInRight { from { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } .zoomInRight { -webkit-animation-name: zoomInRight; animation-name: zoomInRight; } @-webkit-keyframes zoomInUp { from { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } @keyframes zoomInUp { from { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } .zoomInUp { -webkit-animation-name: zoomInUp; animation-name: zoomInUp; } @-webkit-keyframes zoomOut { from { opacity: 1; } 50% { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); } to { opacity: 0; } } @keyframes zoomOut { from { opacity: 1; } 50% { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); } to { opacity: 0; } } .zoomOut { -webkit-animation-name: zoomOut; animation-name: zoomOut; } @-webkit-keyframes zoomOutDown { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } to { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } @keyframes zoomOutDown { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } to { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } .zoomOutDown { -webkit-animation-name: zoomOutDown; animation-name: zoomOutDown; } @-webkit-keyframes zoomOutLeft { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0); } to { opacity: 0; -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0); transform: scale(0.1) translate3d(-2000px, 0, 0); -webkit-transform-origin: left center; transform-origin: left center; } } @keyframes zoomOutLeft { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0); } to { opacity: 0; -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0); transform: scale(0.1) translate3d(-2000px, 0, 0); -webkit-transform-origin: left center; transform-origin: left center; } } .zoomOutLeft { -webkit-animation-name: zoomOutLeft; animation-name: zoomOutLeft; } @-webkit-keyframes zoomOutRight { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0); } to { opacity: 0; -webkit-transform: scale(0.1) translate3d(2000px, 0, 0); transform: scale(0.1) translate3d(2000px, 0, 0); -webkit-transform-origin: right center; transform-origin: right center; } } @keyframes zoomOutRight { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0); } to { opacity: 0; -webkit-transform: scale(0.1) translate3d(2000px, 0, 0); transform: scale(0.1) translate3d(2000px, 0, 0); -webkit-transform-origin: right center; transform-origin: right center; } } .zoomOutRight { -webkit-animation-name: zoomOutRight; animation-name: zoomOutRight; } @-webkit-keyframes zoomOutUp { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } to { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } @keyframes zoomOutUp { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } to { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } .zoomOutUp { -webkit-animation-name: zoomOutUp; animation-name: zoomOutUp; } @-webkit-keyframes slideInDown { from { -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); visibility: visible; } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @keyframes slideInDown { from { -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); visibility: visible; } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } .slideInDown { -webkit-animation-name: slideInDown; animation-name: slideInDown; } @-webkit-keyframes slideInLeft { from { -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); visibility: visible; } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @keyframes slideInLeft { from { -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); visibility: visible; } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } .slideInLeft { -webkit-animation-name: slideInLeft; animation-name: slideInLeft; } @-webkit-keyframes slideInRight { from { -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); visibility: visible; } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @keyframes slideInRight { from { -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); visibility: visible; } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } .slideInRight { -webkit-animation-name: slideInRight; animation-name: slideInRight; } @-webkit-keyframes slideInUp { from { -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); visibility: visible; } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @keyframes slideInUp { from { -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); visibility: visible; } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } .slideInUp { -webkit-animation-name: slideInUp; animation-name: slideInUp; } @-webkit-keyframes slideOutDown { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } to { visibility: hidden; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } } @keyframes slideOutDown { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } to { visibility: hidden; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } } .slideOutDown { -webkit-animation-name: slideOutDown; animation-name: slideOutDown; } @-webkit-keyframes slideOutLeft { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } to { visibility: hidden; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } } @keyframes slideOutLeft { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } to { visibility: hidden; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } } .slideOutLeft { -webkit-animation-name: slideOutLeft; animation-name: slideOutLeft; } @-webkit-keyframes slideOutRight { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } to { visibility: hidden; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } } @keyframes slideOutRight { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } to { visibility: hidden; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } } .slideOutRight { -webkit-animation-name: slideOutRight; animation-name: slideOutRight; } @-webkit-keyframes slideOutUp { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } to { visibility: hidden; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } } @keyframes slideOutUp { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } to { visibility: hidden; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } } .slideOutUp { -webkit-animation-name: slideOutUp; animation-name: slideOutUp; } /* ============ ELEMENTS ============ */ .accordion__item { background-color: var(--e-global-color-e794c7e); border-radius: 0.2rem; transition: border-color 0.25s; } .accordion__item:not(:last-child) { margin-bottom: 0.8rem; } .accordion__item:hover { border-color: var(--e-global-color-e794c7e); } .accordion__title { cursor: pointer; display: flex; font-size: 18px; font-family: var(--e-global-typography-f6b8045-font-family); font-weight: 500; text-transform: uppercase; color: white; justify-content: space-between; padding: 0.8rem 1.6rem; letter-spacing: 1.8px; flex-wrap: wrap; gap: 10px; padding-right: 4rem; transition: background-color 0.2s ease; } @media only screen and (min-width: 1024px) { .accordion__title { gap: unset; } } .accordion__title:hover { background-color: #08172b; } .accordion__title:hover .arrow { filter: hue-rotate(215deg) brightness(0.98); } .accordion__title--active .accordion__icon { transform: rotate(90deg); } .accordion__title .event-card__times { width: 100%; order: 3; font-size: 18px; font-family: var(--e-global-typography-f6b8045-font-family); font-weight: 400; color: var(--e-global-color-d321df0); margin-left: auto; text-transform: uppercase; letter-spacing: 1.8px; } @media only screen and (min-width: 1024px) { .accordion__title .event-card__times { order: unset; width: 50%; } } .accordion__title .event-card__times * { margin: 0; } .accordion__icon { align-items: center; display: flex; height: 1.6rem; justify-content: center; margin-top: 0.4rem; transform: rotate(0deg); transition: transform 0.5s ease; width: 1.6rem; position: absolute; right: 1.6rem; } .accordion__icon .arrow { height: 1.6rem; width: 1.6rem; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17.16' height='19.766' viewBox='0 0 17.16 19.766'%3E%3Cg id='Arrow' transform='translate(1 1.414)'%3E%3Cline id='Line_12' data-name='Line 12' x2='15.16' transform='translate(0 8.469)' fill='none' stroke='%2300c389' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'/%3E%3Cpath id='Path_4160' data-name='Path 4160' d='M946.206,547.917l8.469,8.469-8.469,8.469' transform='translate(-939.516 -547.917)' fill='none' stroke='%2300c389' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'/%3E%3C/g%3E%3C/svg%3E%0A"); background-position: center; background-size: contain; background-repeat: no-repeat; } .accordion__panel { background-color: #0D294B; height: 0; overflow: hidden; transition: height 0.5s ease; color: white; } .accordion__panel-inner { padding: 0 1.6rem 1.6rem; display: flex; flex-direction: column-reverse; } @media only screen and (min-width: 1024px) { .accordion__panel-inner { flex-direction: row; padding-right: 0; padding-bottom: 0; } } .accordion__panel-inner .event-card__modal--info { display: flex; flex-direction: column; gap: 10px; } @media only screen and (min-width: 1024px) { .accordion__panel-inner .event-card__modal--info { flex: 2; } } @media only screen and (min-width: 1024px) { .accordion__panel-inner .event-card__photo { aspect-ratio: unset; height: 100%; flex: 1; } } .accordion__panel-inner .event-card__photo img { height: 100%; width: 100%; object-fit: cover; object-position: center; display: block; aspect-ratio: 16/9; } @media only screen and (min-width: 1024px) { .accordion__panel-inner .event-card__photo img { aspect-ratio: unset; } } .accordion__panel-inner > *:last-child { margin-bottom: 0; } #default-light .calendar-listings .event-cards .event-card { color: var(--e-global-color-e235738); } #default-light .calendar-listings .event-cards .event-card__inner { background: var(--e-global-color-e794c7e); } #sw-cal-grid-423071-649af0bae41e2 { margin-top: 60px; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); } .CalendarEvent { background: var(--e-global-color-e235738); border-radius: 5px; padding: 20px; color: var(--e-global-color-c3d970c); } .calendar-listings .event-cards { display: flex; } .calendar-listings .event-cards .event-card { color: var(--e-global-color-c3d970c); } .calendar-listings .event-cards .event-card:hover .event-card__title { text-decoration: underline; } .calendar-listings .event-cards .event-card__inner { background: white; min-height: 520px; display: flex; flex-direction: column; height: 100%; } .calendar-listings .event-cards .event-card__photo img { aspect-ratio: 8/5; object-fit: cover; object-position: center; width: 100%; } .calendar-listings .event-cards .event-card__logo { display: block; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='67.513' height='55.829' viewBox='0 0 67.513 55.829'%3E%3Cg id='Logo' transform='translate(-9.88 -26.905)'%3E%3Cg id='Icon' transform='translate(11.953 26.905)'%3E%3Cpath id='Path_1' data-name='Path 1' d='M33.335,79.629c16.106-.874,25.248-17.482,37.533-17.482a7.6,7.6,0,0,1,7.707,5.277c.255.885.8.812.726-.065-.547-6.433-6.715-12.577-16.584-12.04-14.973.812-22.122,16.1-37.405,16.932-4.7.251-7.824-2.014-8.791-3.828-.279-.52-.719-.406-.6.189C16.317,70.587,20.995,80.3,33.335,79.629Z' transform='translate(-15.901 -45.516)' fill='%23fff' fill-rule='evenodd'/%3E%3Cpath id='Path_2' data-name='Path 2' d='M43.548,76.433A2.723,2.723,0,1,1,40.973,79.3,2.722,2.722,0,0,1,43.548,76.433Z' transform='translate(-32.341 -59.382)' fill='%23fff' fill-rule='evenodd'/%3E%3Cpath id='Path_3' data-name='Path 3' d='M72.464,65.914A2.08,2.08,0,1,1,70.5,68.1,2.079,2.079,0,0,1,72.464,65.914Z' transform='translate(-51.702 -52.485)' fill='%23fff' fill-rule='evenodd'/%3E%3Cpath id='Path_4' data-name='Path 4' d='M88.715,47.565a1.593,1.593,0,1,1-1.5,1.676A1.6,1.6,0,0,1,88.715,47.565Z' transform='translate(-62.667 -40.452)' fill='%23fff' fill-rule='evenodd'/%3E%3Cpath id='Path_5' data-name='Path 5' d='M94.075,26.907a1.174,1.174,0,1,1-1.108,1.236A1.174,1.174,0,0,1,94.075,26.907Z' transform='translate(-66.439 -26.905)' fill='%23fff' fill-rule='evenodd'/%3E%3C/g%3E%3Cg id='Type' transform='translate(9.88 65.189)'%3E%3Cg id='Group_9' data-name='Group 9' transform='translate(0.468)'%3E%3Cg id='Group_2' data-name='Group 2'%3E%3Cpath id='Path_6' data-name='Path 6' d='M11.284,144.985a3.231,3.231,0,0,0,1.535.385h0a2.085,2.085,0,0,0,2.2-1.934,3.276,3.276,0,0,0-1.459-2.337c-.537-.468-1-.874-1.005-1.4a1.033,1.033,0,0,1,.282-.723.913.913,0,0,1,.671-.268,1.88,1.88,0,0,1,1.229.361v-.626a3.6,3.6,0,0,0-1.494-.317,2.1,2.1,0,0,0-1.549.6,1.561,1.561,0,0,0-.454,1.129,2.971,2.971,0,0,0,1.391,2.127c.565.478,1.095.929,1.108,1.546a1.166,1.166,0,0,1-.337.83,1.127,1.127,0,0,1-.757.348,2.111,2.111,0,0,1-1.363-.475v.754Z' transform='translate(-11.239 -138.127)' fill='%23fff'/%3E%3C/g%3E%3Cg id='Group_3' data-name='Group 3' transform='translate(10.182 0.135)'%3E%3Cpath id='Path_7' data-name='Path 7' d='M40.82,145.432h3.8v-.609H42.045v-2.991h1.99v-.547h-1.99v-2.179h2.571v-.585h-3.8Z' transform='translate(-40.82 -138.52)' fill='%23fff'/%3E%3C/g%3E%3Cg id='Group_4' data-name='Group 4' transform='translate(20.415 0.135)'%3E%3Cpath id='Path_8' data-name='Path 8' d='M74.181,145.432h1.284l-1.625-6.912H72.323l-1.773,6.912h.94l.423-1.821H73.8Zm-.527-2.5h-1.6l.833-3.514Z' transform='translate(-70.55 -138.52)' fill='%23fff'/%3E%3C/g%3E%3Cg id='Group_5' data-name='Group 5' transform='translate(31.42 0.132)'%3E%3Cpath id='Path_9' data-name='Path 9' d='M104,145.425h1.225v-6.313h1.48v-.6H102.52v.6H104Z' transform='translate(-102.52 -138.51)' fill='%23fff'/%3E%3C/g%3E%3Cg id='Group_6' data-name='Group 6' transform='translate(41.66 0.132)'%3E%3Cpath id='Path_10' data-name='Path 10' d='M133.75,145.425h1.225v-6.313h1.48v-.6H132.27v.6h1.48Z' transform='translate(-132.27 -138.51)' fill='%23fff'/%3E%3C/g%3E%3Cg id='Group_7' data-name='Group 7' transform='translate(52.929 0.135)'%3E%3Cpath id='Path_11' data-name='Path 11' d='M165.013,145.432h3.48v-.609h-2.237v-6.3H165.01v6.912Z' transform='translate(-165.01 -138.52)' fill='%23fff'/%3E%3C/g%3E%3Cg id='Group_8' data-name='Group 8' transform='translate(62.815 0.135)'%3E%3Cpath id='Path_12' data-name='Path 12' d='M193.73,145.432h3.8v-.609h-2.571v-2.991h1.99v-.547h-1.99v-2.179h2.571v-.585h-3.8Z' transform='translate(-193.73 -138.52)' fill='%23fff'/%3E%3C/g%3E%3C/g%3E%3Cpath id='Path_13' data-name='Path 13' d='M66.455,173.25A2.608,2.608,0,0,1,63.55,170.9s0-.2-.01-5.962h1.552c-.01,5.92-.01,6.113-.01,6.113a1.346,1.346,0,0,0,1.4,1.349,1.4,1.4,0,0,0,1.463-1.3V164.93h1.563v5.821C69.512,171.969,68.435,173.25,66.455,173.25Z' transform='translate(-45.07 -155.704)' fill='%23fff'/%3E%3Cpath id='Path_14' data-name='Path 14' d='M161.545,173.25a2.608,2.608,0,0,1-2.905-2.354s0-.2-.01-5.962h1.552c-.01,5.92-.01,6.113-.01,6.113a1.346,1.346,0,0,0,1.4,1.349,1.4,1.4,0,0,0,1.463-1.3V164.93H164.6v5.821C164.6,171.969,163.525,173.25,161.545,173.25Z' transform='translate(-107.429 -155.704)' fill='%23fff'/%3E%3Cpath id='Path_15' data-name='Path 15' d='M120.78,168.961l1.191,4.093H120.33l-1.022-3.662h-1.714v3.662H116.02V164.93h3.941a1.749,1.749,0,0,1,1.938,1.855S121.92,168.413,120.78,168.961Zm-1.807-3.125H117.59v2.685h1.384a1.315,1.315,0,0,0,1.27-1.449A1.135,1.135,0,0,0,118.973,165.835Z' transform='translate(-79.486 -155.704)' fill='%23fff'/%3E%3Cpath id='Path_16' data-name='Path 16' d='M143.51,173.063V164.94h1.552v8.123Z' transform='translate(-97.513 -155.711)' fill='%23fff'/%3E%3Cpath id='Path_17' data-name='Path 17' d='M190.412,173.063l-.609-5.108-1.546,3.411-1.583-3.411-.62,5.108H184.56l1.046-8.123h1.088l1.563,3.614,1.5-3.614h1.119l1.067,8.123Z' transform='translate(-124.434 -155.711)' fill='%23fff'/%3E%3Cpath id='Path_18' data-name='Path 18' d='M41.255,171.927a4.776,4.776,0,0,0,1.043-3.17c0-2.327-1.3-4.217-3.4-4.217s-3.4,1.886-3.4,4.217,1.222,4.217,3.4,4.217a3.183,3.183,0,0,0,1.487-.351,4.087,4.087,0,0,0,1.535.179v-.85A4.279,4.279,0,0,1,41.255,171.927Zm-2.344.162c-1.411,0-1.786-1.807-1.786-3.594,0-1.89.823-3.139,1.776-3.139s1.776,1.249,1.776,3.139C40.677,170.281,40.292,172.089,38.911,172.089Z' transform='translate(-26.675 -155.449)' fill='%23fff'/%3E%3Cpath id='Path_19' data-name='Path 19' d='M14.716,173.063h1.635l-2.213-8.123H12.269L9.88,173.063h1.239l.585-2.1h2.465Zm-2.75-3.039,1.015-3.645.947,3.645Z' transform='translate(-9.88 -155.711)' fill='%23fff'/%3E%3Cpath id='Path_20' data-name='Path 20' d='M93.456,173.063h1.635l-2.213-8.123H91.009l-2.389,8.123h1.239l.585-2.1h2.465Zm-2.75-3.039,1.015-3.645.947,3.645Z' transform='translate(-61.517 -155.711)' fill='%23fff'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A"); aspect-ratio: 8/5; object-fit: cover; object-position: center; width: 100%; background-color: var(--e-global-color-e794c7e); background-repeat: no-repeat; background-position: center; background-size: 40%; } .calendar-listings .event-cards .event-card__title { margin: 0; } .calendar-listings .event-cards .event-card__content { flex: 1; padding: 23px; display: flex; flex-direction: column; } .calendar-listings .event-cards .event-card__info { display: flex; flex-direction: column; flex: 1; } .calendar-listings .event-cards .event-card__info__header { flex: 1; } .calendar-listings .event-cards .event-card__bottom { display: flex; width: 100%; justify-content: space-between; } .calendar-listings .event-cards .event-card__time-location { display: flex; flex-direction: column; flex: 1; font-size: 12px; } .calendar-listings .event-cards .event-card__time { display: flex; gap: 5px; font-size: 12px; } .CalendarEventsDetail__eventCalendarFront { display: none; } @media only screen and (min-width: 1024px) { .CalendarEventsDetail__eventCalendarFront { display: block; } } .CalendarEventsDetail__eventCalendarFront .CalendarMonthFilter { display: none; } .CalendarEventsDetail__eventCalendarFront .CalendarMenu .CalendarMenuCenter { display: flex !important; } .CalendarEventsDetail__eventCalendarFront .CalendarMenu .CalendarMenuCenter a { background-color: var(--e-global-color-e794c7e); padding: 15px 40px; border: 1px solid var(--e-global-color-e794c7e); color: var(--e-global-color-e235738); font-weight: bold; font-size: 14px; text-transform: uppercase; width: fit-content; flex: 1; } @media only screen and (min-width: 1024px) { .CalendarEventsDetail__eventCalendarFront .CalendarMenu .CalendarMenuCenter a { flex: unset; } } .CalendarEventsDetail__eventCalendarFront .CalendarMenu .CalendarMenuCenter a:first-child { border-radius: 3px 0 0 3px; } .CalendarEventsDetail__eventCalendarFront .CalendarMenu .CalendarMenuCenter a:nth-child(2) { border-radius: 0 3px 3px 0; } .CalendarEventsDetail__eventCalendarFront .CalendarMenu .CalendarMenuCenter a.CalendarMenu__currentItem { background-color: var(--e-global-color-d321df0); color: var(--e-global-color-e794c7e); } .swCalEvents .event-cards { display: grid; gap: 46px; grid-template-columns: 1fr; } @media only screen and (min-width: 1024px) { .swCalEvents .event-cards { grid-template-columns: repeat(3, 1fr); } } .CalendarMonth { background-color: var(--e-global-color-e794c7e); } .CalendarMonth div.CalendarMonthNavigation:nth-child(2) { display: none !important; } .CalendarEventsDetail__eventCalendarFront * { font-family: var(--e-global-typography-primary-font-family); } .CalendarEventsDetail__eventCalendarFront a.CalendarMonthNavigation__action { color: white; display: inline-flex; font-size: 1.4rem; font-weight: 700; transition: color 0.25s; } @media only screen and (min-width: 1024px) { .CalendarEventsDetail__eventCalendarFront a.CalendarMonthNavigation__action { font-size: 2.2rem; } } .CalendarEventsDetail__eventCalendarFront a.CalendarMonthNavigation__action:hover { color: var(--e-global-color-d321df0); text-decoration: none; } .CalendarEventsDetail__eventCalendarFront a.CalendarMonthNavigation__action span { display: none; } @media only screen and (min-width: 1024px) { .CalendarEventsDetail__eventCalendarFront a.CalendarMonthNavigation__action span { display: inline; } } .CalendarEventsDetail__eventCalendarFront .CalendarMonthNavigation__header h2 { color: var(--e-global-color-e235738); font-size: 2.1rem; font-weight: 700; } @media only screen and (min-width: 1024px) { .CalendarEventsDetail__eventCalendarFront .CalendarMonthNavigation__header h2 { font-size: 4.6rem; } } .CalendarEventsDetail__eventCalendarFront .CalendarMonth > div:last-child { display: none; } .CalendarEventsDetail__eventCalendarFront .CalendarMonth__header_label { background-color: var(--e-global-color-e794c7e); color: white; font-size: 1.2rem; font-weight: 400; padding: 1.1rem 0; text-align: center; text-transform: uppercase; } @media only screen and (min-width: 1024px) { .CalendarEventsDetail__eventCalendarFront .CalendarMonth__header_label { font-size: 1.6rem; } } .CalendarEventsDetail__eventCalendarFront .CalendarGridDay { border: 0.1rem solid var(--e-global-color-cf44058); border-right: 0.1rem solid var(--e-global-color-cf44058); min-height: 6rem; } .CalendarEventsDetail__eventCalendarFront .CalendarGridDay--current-month { background-color: white; } .CalendarEventsDetail__eventCalendarFront .CalendarGridDay--current-month .CalendarGridDay__header { background-color: transparent; border: 0; color: var(--e-global-color-e794c7e); font-weight: 400; padding: 0.4rem 0.4rem; } .CalendarEventsDetail__eventCalendarFront .CalendarGridDay--current-day { background-color: var(--e-global-color-cf44058); } .CalendarEventsDetail__eventCalendarFront .CalendarGridDay--current-day * { color: white !important; } .CalendarEventsDetail__eventCalendarFront .CalendarGridDay--current-day > .CalendarGridDay__header { background-color: transparent; border: 0; color: white; font-weight: 400; padding: 0.4rem 0.4rem; } .CalendarEventsDetail__eventCalendarFront .CalendarMonth__row { border-left: 0.1rem solid var(--e-global-color-cf44058); } .CalendarEventsDetail__eventCalendarFront .CalendarGridDay__header { background-color: transparent; border: 0; color: var(--e-global-color-cf44058); font-size: 1.6rem; font-weight: 400; padding: 0.4rem 0.4rem; text-align: right; } @media only screen and (min-width: 1024px) { .CalendarEventsDetail__eventCalendarFront .CalendarGridDay__header { font-size: 2.2rem; } } .CalendarEventsDetail__eventCalendarFront .CalendarGridDay__content { padding: 0.4rem; } .CalendarEventsDetail__eventCalendarFront .CalendarGridDay__content .CalendarGridDayEvent { border: 0; } .CalendarEventsDetail__eventCalendarFront .CalendarGridDay__content .CalendarGridDayEvent a { color: var(--e-global-color-e794c7e); font-size: 1.2rem; font-weight: 400; line-height: 1.3; transition: color 0.25s; } @media only screen and (min-width: 1024px) { .CalendarEventsDetail__eventCalendarFront .CalendarGridDay__content .CalendarGridDayEvent a { font-size: 1.6rem; line-height: 1.5; } } .CalendarEventsDetail__eventCalendarFront .CalendarGridDay__content .CalendarGridDayEvent a:hover { color: var(--e-global-color-d321df0); } .CalendarEventsDetail__eventCalendarFront .CalendarGridDay__content .CalendarGridDayEvent:not(:last-child) { margin-bottom: 0.4rem; padding-bottom: 0.4rem; } .CalendarGridDayEventPopover { position: relative; } .popover { margin-top: -30px !important; } .CalendarGridDayEventPopover h3 { background-color: initial; border-bottom: 0px; margin: 1.2rem 0 0; font-size: 1.6rem; padding: 0; text-align: center; color: black; } .CalendarGridDayEventPopover .popover-content { padding: 1rem; color: black; } .CalendarGridDayEventPopover__time { font-size: 1.2rem; margin-bottom: 1rem; text-align: center; } .CalendarGridDayEventPopover__time svg { height: 14px; margin-right: 2px; margin-top: -2px; width: 16px; position: relative; top: 4px; } .CalendarGridDayEventPopover__content { color: black; display: flex; flex-direction: row; font-size: 1.2rem; } .CalendarGridDayEventPopover__content--image { align-items: center; background-color: #D3DFE4; display: flex; flex: 0 0 100px; height: 64px; justify-content: center; margin-right: 8px; width: 64px; max-height: 64px; max-width: 100px; } .CalendarGridDayEventPopover__content--image img, .CalendarGridDayEventPopover__content--image svg { max-height: 64px; max-width: 100px; } .CalendarGridDayEventPopover__content--text { flex: 1; overflow: hidden; text-overflow: ellipsis; color: black; line-height: 1.3; } @media (max-width: 768px) { .CalendarGridDayEvent__title { display: none; } } .speak-grid { display: grid; grid-template-columns: repeat(1, 1fr); gap: 30px; } @media only screen and (min-width: 768px) { .speak-grid { grid-template-columns: repeat(2, 1fr); } } @media only screen and (min-width: 1024px) { .speak-grid.grid-col-1 { grid-template-columns: repeat(1, 1fr); } } @media only screen and (min-width: 1024px) { .speak-grid.grid-col-2 { grid-template-columns: repeat(2, 1fr); } } @media only screen and (min-width: 1024px) { .speak-grid.grid-col-3 { grid-template-columns: repeat(3, 1fr); } } @media only screen and (min-width: 1024px) { .speak-grid.grid-col-4 { grid-template-columns: repeat(4, 1fr); } } .speak-grid__item { background: white; max-width: 100%; display: grid; grid-template-rows: min-content; } .speak-grid__item-image { aspect-ratio: 4/3; object-fit: cover; object-position: center; width: 100%; } .speak-grid__item-title { font-family: "Barlow Condensed", Sans-serif; line-height: 28px; font-size: 23px !important; } .speak-grid__item-content { display: flex; flex-direction: column; align-items: flex-start; padding: 30px; color: black; height: 100%; } .speak-grid__item-content * { width: fit-content; } .speak-grid__item-text { margin-bottom: 20px; } .speak-grid .button { margin-top: auto; } .grid-widget .grid-container { display: grid; grid-template-columns: repeat(2, 1fr); row-gap: 11px; column-gap: 9px; } @media only screen and (min-width: 1024px) { .grid-widget .grid-container { grid-template-columns: repeat(4, 1fr); row-gap: 60px; column-gap: 40px; } } .grid-widget .card { position: relative; min-height: 204px; display: flex; flex-direction: column; align-items: flex-end; justify-content: flex-end; background-position: center; background-size: cover; aspect-ratio: 4/5; width: 100%; } .grid-widget .card::after { content: ""; display: block; height: 2px; background-color: var(--e-global-color-cf44058); width: 100%; max-width: 100px; margin-bottom: 20px; position: relative; z-index: 1; } @media only screen and (min-width: 1024px) { .grid-widget .card::after { max-width: 200px; } } .grid-widget .card-overlay { position: absolute; background: linear-gradient(transparent 0%, var(--e-global-color-e794c7e) 110%); height: 50%; width: 100%; bottom: 0; z-index: 1; } .grid-widget h3 { position: relative; z-index: 2; width: 100%; padding: 0 12px; margin-bottom: 12px; } @media only screen and (min-width: 1024px) { .grid-widget h3 { padding: 0 12px; } } .member-cards { background-color: var(--e-global-color-e235738); border: 3px solid var(--e-global-color-d321df0); padding: 20px; } .member-cards * { margin: 0; text-align: center; } .member-cards__header { margin-bottom: 30px; } .member-cards__banner { text-align: center; padding: 5px; align-self: stretch; background-color: var(--e-global-color-cf44058); font-weight: bold; } .member-cards__container { display: grid; gap: 30px; } @media only screen and (min-width: 1024px) { .member-cards__container { grid-template-columns: 1fr 1fr; gap: 15px; } } .member-cards__item { align-self: end; background: var(--e-global-color-ebd8d0b); border: solid 1px var(--e-global-color-e794c7e); color: white; } .member-cards__item--special { background-color: var(--e-global-color-e794c7e); } .member-cards__item-content { display: flex; gap: 15px; flex-direction: column; align-items: center; padding: 20px; } .member-cards__item-price { margin: 20px 0; } .member-cards__link-group { display: flex; justify-content: center; } .member-cards__link-group a:nth-child(2):before { content: ""; height: 100%; width: 2px; background: white; margin: 0 5px; } #posts-grid { display: grid; grid-template-columns: 1fr; column-gap: 20px; row-gap: 40px; } @media only screen and (min-width: 768px) { #posts-grid { grid-template-columns: repeat(2, 1fr); } } @media only screen and (min-width: 1024px) { #posts-grid { grid-template-columns: repeat(3, 1fr); } } #posts-grid .post { background: var(--e-global-color-e794c7e); display: flex; flex-direction: column; } #posts-grid .post img { width: 100%; aspect-ratio: 16/9; object-fit: cover; object-position: center; } #posts-grid .post__inner { flex: 1; padding: 20px 15px; display: flex; flex-direction: column; gap: 10px; color: white; } #posts-grid .post__inner header { flex: 1; } .pagination-container { margin-top: 20px; display: grid; grid-template-columns: 1fr 1fr; width: 100%; } .pagination-container #next-button { justify-self: end; grid-column: 2/3; } .pagination-container button { width: fit-content; } .pagination-container button:hover { cursor: pointer; } .pagination-container button[disabled] { display: none; } #filter-container { display: grid; grid-template-columns: 1fr; column-gap: 20px; row-gap: 40px; margin-bottom: 30px; /* Dropdown Button */ /* Dropdown button on hover & focus */ /* The container
- needed to position the dropdown content */ /* Dropdown Content (Hidden by Default) */ /* Links inside the dropdown */ /* Change color of dropdown links on hover */ /* Show the dropdown menu (use JS to add this class to the .dropdown-content container when the user clicks on the dropdown button) */ } @media only screen and (min-width: 1024px) { #filter-container { grid-template-columns: repeat(3, 1fr); } } #filter-container #search-input { color: white; } #filter-container ul { padding-left: 15px; } #filter-container .dropbtn { background-color: var(--e-global-color-ebd8d0b); color: white; padding: 13px; font-size: 16px; font-weight: 500; border: none; cursor: pointer; width: 100%; height: 48px; position: relative; } #filter-container .dropbtn:after { content: ""; position: absolute; right: 13px; top: 0; height: 100%; width: 15px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12.705' height='5.699' viewBox='0 0 12.705 5.699'%3E%3Cpath id='Arrow' d='M-8384.861-17477l-5.914,5.2-6.291-5.2Z' transform='translate(8397.316 17477.25)' fill='%23fff' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='0.5'/%3E%3C/svg%3E%0A"); background-position: center; background-size: contain; background-repeat: no-repeat; } #filter-container .dropbtn:hover, #filter-container .dropbtn:focus { background-color: #1D5D63; } #filter-container .dropdown { position: relative; display: flex; flex-direction: column; } #filter-container .dropdown-content { display: none; position: absolute; background-color: var(--e-global-color-d321df0); min-width: 160px; box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2); z-index: 1; margin: 0; padding: 0; top: 100%; width: 100%; max-height: 437px; overflow-y: scroll; } #filter-container .dropdown-content ul { color: black; text-decoration: none; display: block; font-weight: 500; } #filter-container .dropdown-content li { color: black; padding: 10px 15px; text-decoration: none; display: block; font-weight: 500; } #filter-container .dropdown-content li:hover { background: rgba(0, 0, 0, 0.1); } #filter-container .dropdown-content li.selected { background: #1963B0; color: white; } #filter-container .dropdown-content ul { background-color: #3CCBDA; } #filter-container .dropdown-content li:hover { cursor: pointer; } #filter-container .show { display: block; } .tabs { background-color: var(--e-global-color-ebd8d0b); } .tabs a { font-size: 15px; } .tabs__menu { align-items: flex-end; justify-content: flex-start; display: flex; margin: 0 0 1.6rem; overflow-x: scroll; padding: 0; position: relative; background: var(--e-global-color-9cd78d6); /* Hide scrollbar for Chrome, Safari and Opera */ /* Hide scrollbar for Firefox */ /* For Internet Explorer and Edge */ } @media only screen and (min-width: 1024px) { .tabs__menu { justify-content: center; } } .tabs__menu::-webkit-scrollbar { display: none; } .tabs__menu { scrollbar-width: none; /* Firefox */ -ms-overflow-style: none; /* Internet Explorer 10+ */ } .tabs__menu { -ms-overflow-style: none; /* IE and Edge */ } .tabs__menu-button { align-items: center; cursor: pointer; display: flex; gap: 8px; font-size: 14px; font-weight: 400; justify-content: center; margin: 0; padding: 0 20px 0.8rem; position: relative; transition: color 0.25s; white-space: nowrap; width: fit-content; height: 90px; font-family: var(--e-global-typography-f6b8045-font-family) !important; background-color: transparent; text-transform: uppercase; font-weight: normal !important; color: var(--e-global-color-c3d970c) !important; } .tabs__menu-button > span:last-child { font-weight: bold; letter-spacing: 1px; } .tabs__menu-button:hover { color: white !important; text-decoration: underline !important; } .tabs__menu-button .icon { font-size: 24px; } @media only screen and (min-width: 1024px) { .tabs__menu-button { font-size: 1.8rem; } } .tabs__menu-button:not(:last-child) { margin-right: 0; } @media only screen and (min-width: 1024px) { .tabs__menu-button:not(:last-child) { margin-right: 0; } } .tabs__menu-button--active { cursor: text; font-weight: 500; color: white !important; background-color: var(--e-global-color-ebd8d0b); } .tabs__menu-button--active::after { display: none; } .tabs__menu-button--active:hover { color: white; cursor: pointer; } .tabs__panel { height: 0; opacity: 0; overflow: hidden; transition: opacity 0.5s ease; } .tabs__panel--active { height: auto; opacity: 1; } .tabs__panel-inner { display: flex; flex-direction: column; padding: 35px; } @media only screen and (min-width: 1024px) { .tabs__panel-inner { flex-direction: row; } } .tabs__panel-inner > *:last-child { margin-bottom: 0; } .tabs__panel-inner .link-items { flex: 1; text-align: right; color: white; } .tabs__panel-inner .link-items a { justify-content: flex-end; } .tabs__panel-inner-main { flex: 1; display: flex; flex-direction: column; gap: 18px; } @media only screen and (min-width: 1024px) { .tabs__panel-inner-main { flex: 2; } } .tabs__panel-inner-main .item-title { font-size: 22px; color: var(--e-global-color-e235738); } .tabs__panel-inner-main .item-content { margin-bottom: 10px; color: var(--e-global-color-e235738); } .tabs__panel-inner-main * { margin: unset; } .testimonial-slider .slider-container .add-transparency { opacity: 0.15; } .testimonial-slider .slider-container .slide { opacity: 1; color: var(--e-global-color-e235738); font-weight: 500; text-align: center; } .testimonial-slider .slider-container .slide__inner { display: flex; background-color: var(--e-global-color-ebd8d0b); justify-content: flex-end; overflow: hidden; min-height: 272px; position: relative; } .testimonial-slider .slider-container .slide__inner:before { content: ""; display: inline-block; height: 70px; width: 45px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='38.61' height='30.6' viewBox='0 0 38.61 30.6'%3E%3Cpath id='Path_48202' data-name='Path 48202' d='M15.66-52.47a7.749,7.749,0,0,1,3.51,2.97,8.53,8.53,0,0,1,1.26,4.68A8.373,8.373,0,0,1,18-38.565a8.5,8.5,0,0,1-6.21,2.385,8.562,8.562,0,0,1-6.255-2.43A8.329,8.329,0,0,1,3.06-44.82a14.794,14.794,0,0,1,.45-3.6,40.65,40.65,0,0,1,1.98-5.4l5.22-12.96h8.91Zm21.24,0a7.749,7.749,0,0,1,3.51,2.97,8.53,8.53,0,0,1,1.26,4.68,8.373,8.373,0,0,1-2.43,6.255,8.5,8.5,0,0,1-6.21,2.385,8.562,8.562,0,0,1-6.255-2.43A8.329,8.329,0,0,1,24.3-44.82a14.794,14.794,0,0,1,.45-3.6,40.651,40.651,0,0,1,1.98-5.4l5.22-12.96h8.91Z' transform='translate(-3.06 66.779)' fill='%23fff'/%3E%3C/svg%3E%0A"); background-repeat: no-repeat; background-position: center; position: absolute; left: 30px; } .testimonial-slider .slider-container .slide__inner img { position: absolute; left: -20px; bottom: -30px; opacity: 0.25; } @media only screen and (min-width: 1024px) { .testimonial-slider .slider-container .slide__inner img { opacity: 1; } } .testimonial-slider .slider-container .slide__content { margin: 60px 30px; width: 100%; z-index: 1; } @media only screen and (min-width: 1024px) { .testimonial-slider .slider-container .slide__content { margin: 65px 60px 65px 0; width: 55%; } } .home-slider-one .slider-container .slide:hover .slide__modal { top: 20%; } .home-slider-one .slider-container .slide__inner { position: relative; overflow: hidden; aspect-ratio: 3/4; } .home-slider-one .slider-container .slide__inner img { width: 100%; height: 100%; object-fit: cover; object-position: center; } .home-slider-one .slider-container .slide__heading { margin: 0 0 35px 0 !important; height: 63px; } .home-slider-one .slider-container .slide__modal { background-color: #463967; position: absolute; z-index: 1; top: calc(100% - 120px); height: 80%; width: 100%; padding: 35px; transition: top 0.25s ease-in-out; } .modal-slider .slide { overflow: hidden; padding-bottom: 125px; } .modal-slider .slide img { aspect-ratio: 1; object-fit: cover; object-position: center; width: 100%; display: block; } @media screen and (min-width: 1300px) { .modal-slider .slide[data-index=odd] { padding-top: 50px; } } .modal-slider .slide__inner { position: relative; } .modal-slider .slide__modal { position: absolute; padding: 0 35px 35px 35px; top: 100%; background-color: #463967; height: calc(100% + 125px); transition: top 0.25s ease-in-out; } .modal-slider .slide__modal::after { opacity: 0; transition: opacity 0.5s ease-in-out; } @media (max-width: 1023px) { .modal-slider .slide__modal--active { top: 0%; } .modal-slider .slide__modal--active::after { content: ""; display: block; height: 15px; width: 15px; background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 20.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 50 50' style='enable-background:new 0 0 50 50;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:none;stroke:%23000000;stroke-width:2;stroke-miterlimit:10;%7D%0A%3C/style%3E%3Cline class='st0' x1='0' y1='0' x2='49.8' y2='49.8'/%3E%3Cline class='st0' x1='49.8' y1='0' x2='0' y2='49.8'/%3E%3C/svg%3E%0A"); filter: invert(1); position: absolute; top: 20px; right: 20px; opacity: 1; } } .modal-slider .slide__heading-container { min-height: 125px; display: flex; align-items: center; } .modal-slider .slide__heading { margin-bottom: 0; } .modal-slider .slide__text { margin-bottom: 22px; } @media only screen and (min-width: 1024px) { .modal-slider .slide:hover .slide__modal { top: 30%; } } .tns-outer { position: relative; } .elementor-swiper-button { background-color: var(--e-global-color-d321df0); border: 1px solid var(--e-global-color-ebd8d0b) !important; transition: background-color 0.25s ease-in-out; display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; } .elementor-swiper-button svg { width: 38px !important; height: 38px !important; } .elementor-swiper-button:hover { background-color: var(--e-global-color-9cd78d6); } .elementor-swiper-button[aria-disabled=true] { display: none !important; } .tns-controls button { background-repeat: no-repeat; background-position: center; aspect-ratio: 1; display: block; position: absolute; top: calc(50% - 40px); width: 40px; height: 40px; padding: 12px !important; z-index: 2; } .tns-controls button[data-controls=prev] { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30.477' height='34.897' viewBox='0 0 30.477 34.897'%3E%3Cg id='Group_3421' data-name='Group 3421' transform='translate(-6.447 -5.856)'%3E%3Cg id='Arrow' transform='translate(-938.338 -540.051)'%3E%3Cline id='Line_12' data-name='Line 12' x1='27.634' transform='translate(946.207 563.355)' fill='none' stroke='%23052e21' stroke-linecap='round' stroke-linejoin='round' stroke-width='2.843'/%3E%3Cpath id='Path_4160' data-name='Path 4160' d='M961.644,547.917l-15.438,15.438,15.438,15.438' fill='none' stroke='%23052e21' stroke-linecap='round' stroke-linejoin='round' stroke-width='2.843'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A"); left: -28px; } .tns-controls button[data-controls=next] { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30.477' height='34.897' viewBox='0 0 30.477 34.897'%3E%3Cg id='Group_3422' data-name='Group 3422' transform='translate(-6.115 -5.859)'%3E%3Cg id='Arrow' transform='translate(7.536 7.869)'%3E%3Cline id='Line_12' data-name='Line 12' x2='27.634' transform='translate(0 15.438)' fill='none' stroke='%23052e21' stroke-linecap='round' stroke-linejoin='round' stroke-width='2.843'/%3E%3Cpath id='Path_4160' data-name='Path 4160' d='M946.206,547.917l15.438,15.438-15.438,15.438' transform='translate(-934.01 -547.917)' fill='none' stroke='%23052e21' stroke-linecap='round' stroke-linejoin='round' stroke-width='2.843'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A"); right: -28px; } .tns-controls button[disabled] { display: none !important; } .gallery-slider .slide__inner { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; } .gallery-slider .slide__inner .image-container { width: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; position: relative; } .gallery-slider .slide__inner .image-container img { width: 100%; object-fit: cover; object-position: center; } .gallery-slider .slide__inner .image-container .caption { bottom: 10px; left: 15px; z-index: 1; color: var(--e-global-color-e235738); font-size: 11px; line-height: 1.3em; text-align: left; background-color: var(--e-global-color-ebd8d0b); width: 100%; padding: 20px; } @media only screen and (min-width: 1024px) { .gallery-slider .slide__inner .image-container .caption { bottom: 37px; left: 26px; font-size: 16px; } } .gallery-slider .tns-nav { display: flex; gap: 15px; align-items: center; justify-content: center; margin-top: 26px; padding: 0 40px; } @media only screen and (min-width: 1024px) { .gallery-slider .tns-nav { padding: 0px; gap: 26px; } } .gallery-slider .tns-nav a { height: fit-content; aspect-ratio: 1; display: flex; border: 4px solid transparent; max-width: 132px; } .gallery-slider .tns-nav a:hover { cursor: pointer; } .gallery-slider .tns-nav a img { aspect-ratio: 1; object-fit: cover; object-position: center; } .gallery-slider .tns-nav a.tns-nav-active { border: 4px solid var(--e-global-color-9cd78d6); } #habitats-slider .grid-widget .grid-container { display: block; } .circle-title-slider .slide__inner { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 15px; } .circle-title-slider .slide__inner .image-container { aspect-ratio: 1; border-radius: 50%; clip-path: circle(); width: 150px; overflow: hidden; margin-bottom: 10px; } .circle-title-slider .slide__inner img { transition: all 0.25s ease-in-out; scale: 1; object-fit: cover; object-position: center; height: 100%; width: 100%; } .circle-title-slider .slide a { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; } .circle-title-slider .slide__heading { font-weight: bold; text-transform: uppercase; color: black; transition: all 0.25s ease-in-out; } .circle-title-slider .slide:hover .slide__heading { color: var(--e-global-color-cf44058); } .circle-title-slider .slide:hover img { scale: 1.1; } .accordion-slider a { color: white; } .accordion-slider .slider-container .slider { display: grid; gap: 15px; } @media only screen and (min-width: 1024px) { .accordion-slider .slider-container .slider { grid-template-columns: repeat(4, 1fr); } } .accordion-slider .slider-container .slider .slide { cursor: pointer; height: 625px; } .accordion-slider .slider-container .slider .slide .slide-inner { display: flex; flex-direction: column; align-items: center; justify-content: center; border-radius: 200rem; height: 100%; position: relative; overflow: hidden; background-position: center; background-size: cover; background-repeat: no-repeat; transition: all 0.25s ease-in-out; } .accordion-slider .slider-container .slider .slide .slide-inner .close-button { display: none; } .accordion-slider .slider-container .slider .slide .slide-inner h2 { font-size: 23px; font-family: var(--e-global-typography-06d0fb4-font-family); font-weight: 500; z-index: 2; } .accordion-slider .slider-container .slider .slide .slide-overlay { position: absolute; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.55); z-index: 1; } .accordion-slider .modal-container { transition: all 0.25s ease-in-out; position: fixed; opacity: 0; z-index: -1; display: flex; align-items: center; justify-content: center; height: calc(100vh - 220px); width: 100%; } @media only screen and (min-width: 1024px) { .accordion-slider .modal-container { height: 100%; position: absolute; } } .accordion-slider .modal-container h2, .accordion-slider .modal-container h3 { font-family: var(--e-global-typography-06d0fb4-font-family); } .accordion-slider .modal-container .close-button { position: absolute; z-index: 5; top: 40px; right: 30px; font-size: 14px; font-family: var(--e-global-typography-06d0fb4-font-family); text-transform: uppercase; display: block; color: white !important; } @media only screen and (min-width: 1024px) { .accordion-slider .modal-container .close-button { font-size: 23px; top: 60px; right: 90px; } } .accordion-slider .modal-container .close-button:hover { color: white !important; cursor: pointer; } .accordion-slider .modal-container .slide-inner { display: flex; flex-direction: column; justify-content: space-between; border-radius: 25px; overflow: hidden; width: calc(100% - 20px); background-position: center; background-size: cover; background-repeat: no-repeat; position: relative; height: 100%; padding: 30px; } @media only screen and (min-width: 1024px) { .accordion-slider .modal-container .slide-inner { width: 100%; padding: 60px 75px 20px 75px; border-radius: 100px; } } .accordion-slider .modal-container .slide-inner h2, .accordion-slider .modal-container .slide-inner .slide-modal { position: relative; z-index: 2; } .accordion-slider .modal-container .slide-inner h2 { font-size: 34px; } @media only screen and (min-width: 1024px) { .accordion-slider .modal-container .slide-inner h2 { font-size: 43px; } } .accordion-slider .modal-container .slide-inner .slide-overlay { position: absolute; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.55); z-index: 1; top: 0; left: 0; } .accordion-slider .modal-container.active { opacity: 1; transition: opacity 0.25s ease-in-out; z-index: 10; position: fixed; top: 110px; left: 0; } @media only screen and (min-width: 1024px) { .accordion-slider .modal-container.active { top: 0; position: absolute; left: unset; } } .accordion-slider .modal-container.active .slide-modal { flex: 1; display: flex !important; flex-direction: column; height: 100%; justify-content: space-between; } .accordion-slider .posts-loop-wrapper .posts-loop .post-item .post-item-inner { display: flex; flex-direction: column-reverse; align-items: center; justify-content: center; gap: 8px; } .accordion-slider .posts-loop-wrapper .posts-loop .post-item .post-item-inner h4 { font-size: 10px; font-weight: bold; text-align: center; line-height: 1.3; color: var(--e-global-color-e235738) !important; } .accordion-slider .posts-loop-wrapper .posts-loop .post-item .post-item-inner .featured-image { aspect-ratio: 1; border-radius: 50%; clip-path: circle(); overflow: hidden; } .accordion-slider .posts-loop-wrapper .posts-loop .post-item .post-item-inner img { transition: all 0.25s ease-in-out; scale: 1; object-fit: cover; object-position: center; } .accordion-slider .posts-loop-wrapper .posts-loop .post-item:hover img { scale: 1.1; } .quotes-slider { background-color: var(--e-global-color-ebd8d0b); } .quotes-slider .slider-container { position: relative; } .quotes-slider .slider-container .slide__inner { display: flex; flex-direction: column; gap: 36px; align-items: center; text-align: center; padding: 30px 40px 10px 40px; } @media only screen and (min-width: 1024px) { .quotes-slider .slider-container .slide__inner { padding: 60px 80px 20px 80px; } } .quotes-slider .slider-container .slide__inner:before { content: ""; display: inline-block; height: 32px; width: 45px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='38.61' height='30.6' viewBox='0 0 38.61 30.6'%3E%3Cpath id='Path_48202' data-name='Path 48202' d='M15.66-52.47a7.749,7.749,0,0,1,3.51,2.97,8.53,8.53,0,0,1,1.26,4.68A8.373,8.373,0,0,1,18-38.565a8.5,8.5,0,0,1-6.21,2.385,8.562,8.562,0,0,1-6.255-2.43A8.329,8.329,0,0,1,3.06-44.82a14.794,14.794,0,0,1,.45-3.6,40.65,40.65,0,0,1,1.98-5.4l5.22-12.96h8.91Zm21.24,0a7.749,7.749,0,0,1,3.51,2.97,8.53,8.53,0,0,1,1.26,4.68,8.373,8.373,0,0,1-2.43,6.255,8.5,8.5,0,0,1-6.21,2.385,8.562,8.562,0,0,1-6.255-2.43A8.329,8.329,0,0,1,24.3-44.82a14.794,14.794,0,0,1,.45-3.6,40.651,40.651,0,0,1,1.98-5.4l5.22-12.96h8.91Z' transform='translate(-3.06 66.78)' fill='%233ccbda'/%3E%3C/svg%3E%0A"); background-repeat: no-repeat; background-position: center; } .quotes-slider .slider-container .slide__name-location { display: flex; flex-direction: column; align-items: center; } .quotes-slider .slider-container .slide__name-location * { margin: unset; } .quotes-slider .slider-container .slide__name-location:before { content: ""; display: block; height: 4px; width: 40px; margin-bottom: 21px; background-color: var(--e-global-color-d321df0); } .quotes-slider .slider-container .slide__quote { font-weight: 500; color: var(--e-global-color-e235738); } .quotes-slider .slider-container .slide__name { font-family: var(--e-global-typography-f6b8045-font-family); color: var(--e-global-color-9cd78d6); font-size: 23px; } .quotes-slider .slider-container .slide__location { font-size: 10px; font-weight: bold; text-transform: uppercase; color: var(--e-global-color-e235738); } .quotes-slider .slider-container .slide__content { display: flex; flex-direction: column; gap: 36px; } .quotes-slider .slider-container .tns-nav { display: flex; justify-content: center; gap: 8px; width: 100%; padding: 30px 0; } .quotes-slider .slider-container .tns-nav .tns-nav-active { background-color: var(--e-global-color-d321df0); } .quotes-slider .slider-container .tns-nav button { height: 10px; width: 10px; border: 1px solid var(--e-global-color-d321df0); border-radius: 50%; padding: unset; background-color: unset; } .portal-slider .tns-slider { display: flex; } .portal-slider .slider-container .slide { height: auto; } .portal-slider .slider-container .slide__inner { background: var(--e-global-color-e794c7e); display: flex; flex-direction: column; height: 100%; } .portal-slider .slider-container .slide__inner img { width: 100%; aspect-ratio: 16/9; object-fit: cover; object-position: center; } .portal-slider .slider-container .slide__heading { flex: 1; } .portal-slider .slider-container .slide__content { flex: 1; padding: 20px 15px; display: flex; flex-direction: column; gap: 10px; color: white; font-weight: 400; } .portal-slider .slider-container .slide__content .link-arrow { margin-top: auto; } .split-content { display: flex; flex-direction: column; } @media only screen and (min-width: 1024px) { .split-content { flex-direction: row; } } @media only screen and (min-width: 1024px) { .split-content--reverse { flex-direction: row-reverse; } } .split-content img { display: block; } .split-content__info h1, .split-content__info h2, .split-content__info h3, .split-content__info h4, .split-content__info h5, .split-content__info h6 { margin: 0; } .split-content__title { margin-bottom: 12px; } .split-content__main-content { margin-bottom: 35px; } .split-content__images img { object-fit: cover; object-position: center; width: 100%; } .split-content.variation-1 { gap: 26px; } .split-content.variation-1 .split-content__info { flex: 1; } .split-content.variation-1 .split-content__images { flex: 2; } .split-content.variation-1 .split-content__images img { width: 100%; max-height: 300px; object-fit: cover; object-position: center; } .split-content.variation-2 { gap: 60px; } .split-content.variation-2 .split-content__info { flex: 1; display: flex; flex-direction: column; justify-content: center; } .split-content.variation-2 .split-content__info a.button { width: fit-content; } .split-content.variation-2 .split-content__images { flex: 1; position: relative; display: flex; align-items: flex-end; } @media only screen and (min-width: 1024px) { .split-content.variation-2 .split-content__images { flex-direction: column; } } .split-content.variation-2 .split-content__images img:first-child { aspect-ratio: 4/3; flex: 1; width: 60%; } @media only screen and (min-width: 1024px) { .split-content.variation-2 .split-content__images img:first-child { width: 100%; } } .split-content.variation-2 .split-content__images img:nth-child(2) { flex: 1; aspect-ratio: 1; max-width: 239px; margin-left: 20px; width: calc(40% - 20px); margin-bottom: -30px; } @media only screen and (min-width: 1024px) { .split-content.variation-2 .split-content__images img:nth-child(2) { margin-top: -119.5px; margin-right: 80px; margin-left: unset; margin-bottom: unset; align-self: flex-end; width: 239px; } } .split-content.variation-3 { align-items: center; gap: 60px; } .split-content.variation-3 .split-content__info { flex: 1; } .split-content.variation-3 .split-content__images { display: grid; grid-template-columns: 1fr 1fr; flex: 1; gap: 15px; } .split-content.variation-3 .split-content__images img { width: 100%; } .split-content.variation-3 .split-content__images img:first-child { align-self: end; height: 100%; grid-column: 1/2; grid-row: 1/3; } @media only screen and (min-width: 1024px) { .split-content.variation-3 .split-content__images img:first-child { height: unset; aspect-ratio: 4/3; grid-column: 1/2; grid-row: 1/2; } } .split-content.variation-3 .split-content__images img:nth-child(2) { aspect-ratio: 1; max-width: 256px; align-self: center; } @media only screen and (min-width: 1024px) { .split-content.variation-3 .split-content__images img:nth-child(2) { grid-row: 1/3; grid-column: 2/3; } } .split-content.variation-3 .split-content__images img:nth-child(3) { aspect-ratio: 4/3; margin-top: -40px; width: 80%; justify-self: end; } @media only screen and (min-width: 1024px) { .split-content.variation-3 .split-content__images img:nth-child(3) { width: calc(100% - 20px); grid-column: 1/2; grid-row: 2/3; margin-top: unset; } } .split-content.variation-4 { align-items: center; gap: 60px; } .split-content.variation-4 .split-content__info { flex: 1; width: 100%; } @media only screen and (min-width: 1024px) { .split-content.variation-4 .split-content__info { width: unset; } } .split-content.variation-4 .split-content__images { flex: 1; gap: 15px; display: grid; } @media only screen and (min-width: 1024px) { .split-content.variation-4 .split-content__images { grid-template-columns: repeat(12, 1fr); grid-template-rows: repeat(8, 1fr); } } .split-content.variation-4 .split-content__images img { width: 100%; } .split-content.variation-4 .split-content__images img:first-child { width: 100%; aspect-ratio: 16/9; } @media only screen and (min-width: 1024px) { .split-content.variation-4 .split-content__images img:first-child { width: calc(100% - 40px); grid-column: 1/13; grid-row: 1/4; aspect-ratio: 2; margin-right: unset; height: 100%; z-index: unset; } } .split-content.variation-4 .split-content__images img:nth-child(2) { grid-row: 1/6; grid-column: 6/11; margin-right: unset; margin-bottom: unset; width: calc(100% - 20px); height: 100%; display: none; } @media only screen and (min-width: 1024px) { .split-content.variation-4 .split-content__images img:nth-child(2) { grid-row: 4/8; grid-column: 7/13; margin-top: -35px; display: block; } } .split-content.variation-4 .split-content__images img:nth-child(3) { grid-column: 1/6; grid-row: 2/8; justify-self: end; height: 100%; display: none; } @media only screen and (min-width: 1024px) { .split-content.variation-4 .split-content__images img:nth-child(3) { grid-column: 1/7; grid-row: 4/8; aspect-ratio: 4/5; display: block; } } .split-content.variation-5 { gap: 30px; } @media only screen and (min-width: 1024px) { .split-content.variation-5 { align-items: center; gap: 60px; } } .split-content.variation-5 .split-content__info { flex: 1; padding: 0 20px; } @media only screen and (min-width: 1024px) { .split-content.variation-5 .split-content__info { padding: 0 20px 0 0; } } .split-content.variation-5 .split-content__images { flex: 1; } .split-content.variation-6 { position: relative; } .split-content.variation-6:after { content: ""; display: block; position: absolute; height: 100%; width: 100%; background-color: rgba(12, 35, 64, 0.94); } .split-content.variation-6 .split-content__info { flex: 2; z-index: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 70px 15px; } .split-content.variation-6 .split-content__main-content { font-weight: bold; font-size: 25px; line-height: 1.4em; text-align: center; margin: 0; } @media only screen and (min-width: 1024px) { .split-content.variation-6 .split-content__main-content { font-size: 30px; } } .split-content.variation-6 .split-content__images { flex: 1; z-index: 1; } .split-content.variation-6 .split-content__images img { aspect-ratio: 5/4; } .animal-template-default .variation-4 .split-content__images img { width: 100%; } .animal-template-default .variation-4 .split-content__images img:first-child { grid-column: 1/13; aspect-ratio: 16/9; margin-right: unset; } .animal-template-default .variation-4 .split-content__images img:nth-child(2) { display: none; } @media only screen and (min-width: 1024px) { .animal-template-default .variation-4 .split-content__images img:nth-child(2) { display: block; } } .animal-template-default .variation-4 .split-content__images img:nth-child(3) { display: none; } @media only screen and (min-width: 1024px) { .animal-template-default .variation-4 .split-content__images img:nth-child(3) { display: block; } } .callout { display: flex; flex-direction: column; position: relative; } @media only screen and (min-width: 1024px) { .callout { flex-direction: row; } } @media only screen and (min-width: 1024px) { .callout--reverse { flex-direction: row-reverse; } } .callout img { display: block; } .callout__info h1, .callout__info h2, .callout__info h3, .callout__info h4, .callout__info h5, .callout__info h6 { margin: 0; } .callout__title { margin-bottom: 12px; } .callout__image { flex: 1; z-index: 1; } .callout__image img { object-fit: cover; object-position: center; aspect-ratio: 5/4; height: 100% !important; } .callout:after { content: ""; display: block; position: absolute; height: 100%; width: 100%; background-color: rgba(12, 35, 64, 0.94); } .callout__info { flex: 2; z-index: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 70px 15px; } .callout__main-content { font-weight: bold; font-size: 25px; line-height: 1.4em; text-align: center; margin: 0; color: white; } @media only screen and (min-width: 1024px) { .callout__main-content { font-size: 30px; } } .callout__main-content p a { color: var(--e-global-color-9cd78d6); } .callout__main-content p a:hover { color: var(--e-global-color-158c4ba); } /* ============ ELEMENTOR ELEMENTS ============ */ .elementor-tabs .elementor-tabs-wrapper > .elementor-tab-title { transition: background-color 0.2s ease; } .elementor-tabs .elementor-tabs-wrapper > .elementor-tab-title:hover { color: var(--e-global-color-e235738) !important; text-decoration: underline; background: var(--e-global-color-cf44058); } .elementor-tabs .elementor-tab-title { text-align: center; } @media (max-width: 767px) { .elementor-tabs .elementor-tab-title { background: var(--e-global-color-9cd78d6) !important; text-align: left; } .elementor-tabs .elementor-tab-title.elementor-active { background: var(--e-global-color-e794c7e) !important; font-weight: bold !important; } } .elementor-tabs .elementor-tab-content a { color: var(--e-global-color-158c4ba) !important; } .elementor-tabs .elementor-tab-content a:hover { text-decoration: underline; } .elementor-accordion .elementor-tab-content a { color: var(--e-global-color-158c4ba) !important; } .elementor-accordion .elementor-tab-content a:hover { text-decoration: underline; } .e-n-accordion-item-title-icon { margin-left: auto; } .accordions.themed { margin: 0 0 3.5rem 0; } .accordions.themed .accordions__tab { margin: 0 0 0.5rem 0; border: 0.1rem solid #a3c1df; background: #d1e0ef; } .accordions.themed .accordions__tab-toggle { padding: 20px; } .accordions.themed .accordions__tab-toggle i { color: #1963B0; } .accordions.themed .accordions__tab-content { padding: 0 2rem 1rem 2rem; } .image-carousel.themed { margin: 0 0 4rem 0; } .image-carousel.themed .image-carousel__slides { margin: 0 0 2rem 0; } .image-carousel.themed .carousel-controls span { color: #1963B0; transition: all 0.3s ease 0s; } .image-carousel.themed .carousel-controls span:hover { color: black; } .image-carousel.themed .carousel-controls .carousel-indices .carousel-index { border: 0 solid #1963B0; } .image-carousel.themed .carousel-controls .carousel-indices .carousel-index.active { border-width: 0.2rem; } .image-gallery.themed, .media-gallery.themed { width: calc(100% + 2rem); margin: 0 -1rem 4rem -1rem; } .image-gallery.themed .image-gallery__item, .image-gallery.themed .media-gallery__item, .media-gallery.themed .image-gallery__item, .media-gallery.themed .media-gallery__item { transition: all 0.3s ease 0s; opacity: 1; } .image-gallery.themed .image-gallery__item:hover, .image-gallery.themed .media-gallery__item:hover, .media-gallery.themed .image-gallery__item:hover, .media-gallery.themed .media-gallery__item:hover { opacity: 0.5; } .posts-list.themed, .recent-posts.themed { width: calc(100% - 2rem); margin: 0 -1rem 4rem -1rem; } .posts-list.themed .posts-list__header, .posts-list.themed .recent-posts__header, .recent-posts.themed .posts-list__header, .recent-posts.themed .recent-posts__header { margin: 0 0 2rem 0; padding: 0 1rem; } @media (min-width: 840px) { .posts-list.themed .posts-list__item, .posts-list.themed .recent-posts__item, .recent-posts.themed .posts-list__item, .recent-posts.themed .recent-posts__item { width: calc(50% - 2rem); } } @media (min-width: 1080px) { .posts-list.themed .posts-list__item, .posts-list.themed .recent-posts__item, .recent-posts.themed .posts-list__item, .recent-posts.themed .recent-posts__item { width: calc(33.333334% - 2rem); } } .posts-list.themed .posts-list__item-content, .posts-list.themed .recent-posts__item-content, .recent-posts.themed .posts-list__item-content, .recent-posts.themed .recent-posts__item-content { padding: 4rem; background: #d1e0ef; } .image-block.has-lightbox.themed { transition: all 0.3s ease 0s; } .image-block.has-lightbox.themed:hover { opacity: 0.5; } .tabbed-content.themed { margin: 0 0 4rem 0; } .tabbed-content.themed .tabbed-content__toggles { border-bottom: 0.1rem solid #ededed; } .tabbed-content.themed .tabbed-content__toggles-item { margin: 0 2rem 0 0; padding: 0 0 0.2rem 0; color: grey; border-bottom: 0.3rem solid transparent; transition: all 0.3s ease 0s; } .tabbed-content.themed .tabbed-content__toggles-item.active { color: black; border-bottom-color: #1963B0; } .tabbed-content.themed .tabbed-content__tab { padding: 2rem 0 0 0; } /* ============ PAGES ============ */ /* _home.scss */ #gradient-bg { background: transparent linear-gradient(180deg, #00BD85 0%, #00855D 8%, #00818F 53%, #0E3E71 100%) 0% 0% no-repeat padding-box; } a.portal-image { transition: background-size 0.25s ease-in-out; } a.portal-image:hover { background-size: 520px !important; } a.portal-image .elementor-heading-title { display: flex; gap: 5px; } a.portal-image .elementor-heading-title::after { content: ""; display: inline-block; height: 16px; width: 16px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13.921' height='15.819' viewBox='0 0 13.921 15.819'%3E%3Cg id='Arrow' transform='translate(1 1.414)'%3E%3Cline id='Line_12' data-name='Line 12' x2='11.921' transform='translate(0 6.496)' fill='none' stroke='%2300c389' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'/%3E%3Cpath id='Path_4160' data-name='Path 4160' d='M946.207,547.917l6.659,6.5-6.659,6.5' transform='translate(-940.946 -547.917)' fill='none' stroke='%2300c389' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'/%3E%3C/g%3E%3C/svg%3E%0A"); background-position: center; background-repeat: no-repeat; } /* _default.scss */ #page { width: 100%; height: 400vh; display: block; } #default-light { color: var(--e-global-color-c3d970c); background-color: #fffff7; } .page-template-default-gradient, .default-gradient { background-color: #0E3E71; } .page-template-default-gradient main a, .default-gradient main a { color: var(--e-global-color-e235738); } .page-template-default-gradient main a:hover, .default-gradient main a:hover { color: var(--e-global-color-d321df0); } #hero-container { height: 100vh; max-height: 442px; min-height: 362px; } .standard-interior__hero h1 { text-shadow: 0px 0px 20px #122D22; } .stat-block { aspect-ratio: 1; } .progress-bar { border: solid 7px var(--e-global-color-ebd8d0b); border-radius: 200em; } .progress-bar .elementor-progress-bar { border-radius: 200em !important; } body main[data-id=fbe47b0] { padding-left: 20px !important; padding-right: 20px !important; } @media only screen and (min-width: 1024px) { body main[data-id=fbe47b0] { padding-left: 50px !important; padding-right: 50px !important; } } main { overflow: hidden !important; } #stories-search-form { padding: 0; } #stories-search-form input[type=text] { max-height: 48px; } #searchform, .searchform { display: flex; align-items: unset; padding: 20px 0; } #searchform input[type=submit], #searchform button[type=submit], .searchform input[type=submit], .searchform button[type=submit] { aspect-ratio: 1; padding: 8px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30.477' height='34.897' viewBox='0 0 30.477 34.897'%3E%3Cg id='Arrow' transform='translate(1.422 2.01)'%3E%3Cline id='Line_12' data-name='Line 12' x2='27.634' transform='translate(0 15.438)' fill='none' stroke='%23052e21' stroke-linecap='round' stroke-linejoin='round' stroke-width='2.843'/%3E%3Cpath id='Path_4160' data-name='Path 4160' d='M946.206,547.917l15.438,15.438-15.438,15.438' transform='translate(-934.01 -547.917)' fill='none' stroke='%23052e21' stroke-linecap='round' stroke-linejoin='round' stroke-width='2.843'/%3E%3C/g%3E%3C/svg%3E%0A"); background-position: center; background-repeat: no-repeat; background-size: contain; height: 48px; width: 48px; } #searchform input[type=submit]:hover, #searchform button[type=submit]:hover, .searchform input[type=submit]:hover, .searchform button[type=submit]:hover { cursor: pointer; } #searchform input[type=text], .searchform input[type=text] { background: #1D5D63; border: none; color: white !important; font-weight: bold; font-size: 16px; padding: 15px; line-height: 1; width: 100%; } #searchform input[type=text]::placeholder, .searchform input[type=text]::placeholder { color: white; } #searchform label, .searchform label { display: none; } #searchform .form-row:first-child, .searchform .form-row:first-child { flex: 1; } .page-id-647 .standard-interior__hero { display: none; } .side-nav-wrapper { color: white; height: calc(100% - 600px); left: 0; pointer-events: none; position: absolute; top: 600px; z-index: 100; } .side-nav-wrapper #toggle-side-nav { pointer-events: all; position: sticky; top: 300px; z-index: 1; height: 50px; width: 50px; font-size: 25px; border-radius: 50%; border: solid 3px var(--e-global-color-9cd78d6); background-color: var(--e-global-color-e794c7e); display: flex; align-items: center; justify-content: center; } .side-nav-wrapper #toggle-side-nav:hover { cursor: pointer; } .side-nav-wrapper #toggle-side-nav-close { pointer-events: all; position: absolute; top: 10px; right: 10px; height: 38px; width: 45px; display: flex; align-items: center; justify-content: center; } .side-nav-wrapper #toggle-side-nav-close:hover { cursor: pointer; } .side-nav-wrapper #side-nav-container { pointer-events: all; position: sticky; top: 300px; z-index: 2; background-color: var(--e-global-color-d321df0); border-radius: 0 60px 60px 0; padding: 30px 50px; width: max-content; display: flex; flex-direction: column; gap: 16px; } .side-nav-wrapper #side-nav-container li { margin: 0; list-style: none; display: flex; } .side-nav-wrapper #side-nav-container li a { color: var(--e-global-color-e794c7e); line-height: 1em; } .side-nav-wrapper #side-nav-container li a:hover { text-decoration: underline; } .go-full-width { margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); } /* _sitemap.scss */ .sitemap ul { list-style: none; margin: 0; padding: 0; } .sitemap ul li { display: block; } .sitemap ul > li { font: bold 2.4rem serif; margin-top: 12px; } .sitemap ul > li > ul { padding-left: 16px; } .sitemap ul > li > ul > li { font: bold 2rem sans-serif; margin-top: 8px; } .sitemap ul > li > ul > li > ul { padding-left: 16px; } .sitemap ul > li > ul > li > ul > li { font: normal 1.6rem sans-serif; margin-top: 4px; } /* _404.scss */ /* _styleguide.scss */ body.styleguide hr { margin: 50px 0 20px; } .swatch { background: var(--color); border-radius: 8px; display: inline-block; height: 80px; margin: 0 8px 8px 0; text-align: center; width: 80px; } .swatch::after { content: attr(color); display: block; font: normal 16px monospace; margin-bottom: 16px; position: relative; top: calc(100% + 4px); } /*# sourceMappingURL=style.css.map */