@charset "UTF-8";
:root {
  --bs-blue: #0d6efd;
  --bs-indigo: #6610f2;
  --bs-purple: #6f42c1;
  --bs-pink: #d63384;
  --bs-red: #dc3545;
  --bs-orange: #fd7e14;
  --bs-yellow: #ffc107;
  --bs-green: #198754;
  --bs-teal: #20c997;
  --bs-cyan: #0dcaf0;
  --bs-black: #000;
  --bs-white: #fff;
  --bs-gray: #6c757d;
  --bs-gray-dark: #343a40;
  --bs-gray-100: #f8f9fa;
  --bs-gray-200: #e9ecef;
  --bs-gray-300: #dee2e6;
  --bs-gray-400: #ced4da;
  --bs-gray-500: #adb5bd;
  --bs-gray-600: #6c757d;
  --bs-gray-700: #495057;
  --bs-gray-800: #343a40;
  --bs-gray-900: #212529;
  --bs-primary: #0d6efd;
  --bs-secondary: #6c757d;
  --bs-success: #198754;
  --bs-info: #0dcaf0;
  --bs-warning: #ffc107;
  --bs-danger: #dc3545;
  --bs-light: #f8f9fa;
  --bs-dark: #212529;
  --bs-primary-rgb: 13, 110, 253;
  --bs-secondary-rgb: 108, 117, 125;
  --bs-success-rgb: 25, 135, 84;
  --bs-info-rgb: 13, 202, 240;
  --bs-warning-rgb: 255, 193, 7;
  --bs-danger-rgb: 220, 53, 69;
  --bs-light-rgb: 248, 249, 250;
  --bs-dark-rgb: 33, 37, 41;
  --bs-primary-text-emphasis: #052c65;
  --bs-secondary-text-emphasis: #2b2f32;
  --bs-success-text-emphasis: #0a3622;
  --bs-info-text-emphasis: #055160;
  --bs-warning-text-emphasis: #664d03;
  --bs-danger-text-emphasis: #58151c;
  --bs-light-text-emphasis: #495057;
  --bs-dark-text-emphasis: #495057;
  --bs-primary-bg-subtle: #cfe2ff;
  --bs-secondary-bg-subtle: #e2e3e5;
  --bs-success-bg-subtle: #d1e7dd;
  --bs-info-bg-subtle: #cff4fc;
  --bs-warning-bg-subtle: #fff3cd;
  --bs-danger-bg-subtle: #f8d7da;
  --bs-light-bg-subtle: #fcfcfd;
  --bs-dark-bg-subtle: #ced4da;
  --bs-primary-border-subtle: #9ec5fe;
  --bs-secondary-border-subtle: #c4c8cb;
  --bs-success-border-subtle: #a3cfbb;
  --bs-info-border-subtle: #9eeaf9;
  --bs-warning-border-subtle: #ffe69c;
  --bs-danger-border-subtle: #f1aeb5;
  --bs-light-border-subtle: #e9ecef;
  --bs-dark-border-subtle: #adb5bd;
  --bs-white-rgb: 255, 255, 255;
  --bs-black-rgb: 0, 0, 0;
  --bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
  --bs-body-font-family: var(--bs-font-sans-serif);
  --bs-body-font-size: 1rem;
  --bs-body-font-weight: 400;
  --bs-body-line-height: 1.5;
  --bs-body-color: #212529;
  --bs-body-color-rgb: 33, 37, 41;
  --bs-body-bg: #fff;
  --bs-body-bg-rgb: 255, 255, 255;
  --bs-emphasis-color: #000;
  --bs-emphasis-color-rgb: 0, 0, 0;
  --bs-secondary-color: rgba(33, 37, 41, 0.75);
  --bs-secondary-color-rgb: 33, 37, 41;
  --bs-secondary-bg: #e9ecef;
  --bs-secondary-bg-rgb: 233, 236, 239;
  --bs-tertiary-color: rgba(33, 37, 41, 0.5);
  --bs-tertiary-color-rgb: 33, 37, 41;
  --bs-tertiary-bg: #f8f9fa;
  --bs-tertiary-bg-rgb: 248, 249, 250;
  --bs-link-color: #0d6efd;
  --bs-link-color-rgb: 13, 110, 253;
  --bs-link-decoration: underline;
  --bs-link-hover-color: #0a58ca;
  --bs-link-hover-color-rgb: 10, 88, 202;
  --bs-code-color: #d63384;
  --bs-highlight-bg: #fff3cd;
  --bs-border-width: 1px;
  --bs-border-style: solid;
  --bs-border-color: #dee2e6;
  --bs-border-color-translucent: rgba(0, 0, 0, 0.175);
  --bs-border-radius: 0.375rem;
  --bs-border-radius-sm: 0.25rem;
  --bs-border-radius-lg: 0.5rem;
  --bs-border-radius-xl: 0.4rem;
  --bs-border-radius-xxl: 0.5rem;
  --bs-border-radius-2xl: var(--bs-border-radius-xxl);
  --bs-border-radius-pill: 50rem;
  --bs-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
  --bs-box-shadow-sm: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
  --bs-box-shadow-lg: 0 1rem 3rem rgba(0, 0, 0, 0.175);
  --bs-box-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, 0.075);
  --bs-focus-ring-width: 0.25rem;
  --bs-focus-ring-opacity: 0.25;
  --bs-focus-ring-color: rgba(13, 110, 253, 0.25);
  --bs-form-valid-color: #198754;
  --bs-form-valid-border-color: #198754;
  --bs-form-invalid-color: #dc3545;
  --bs-form-invalid-border-color: #dc3545;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

@media (prefers-reduced-motion: no-preference) {
  :root {
    scroll-behavior: smooth;
  }
}

body {
  margin: 0;
  font-family: var(--bs-body-font-family);
  font-size: var(--bs-body-font-size);
  font-weight: var(--bs-body-font-weight);
  line-height: var(--bs-body-line-height);
  color: var(--bs-body-color);
  text-align: var(--bs-body-text-align);
  background-color: var(--bs-body-bg);
  -webkit-text-size-adjust: 100%;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

 h5, .h5, h4, .h4, h3, .h3, h2, .h2, h1, .h1 {
  margin-top: 0;
  margin-bottom: 0.5rem;
  font-weight: 500;
  line-height: 1.2;
  color: var(--bs-heading-color, inherit);
}

h1, .h1 {
  font-size: calc(1.375rem + 1.5vw);
}
@media (min-width: 1200px) {
  h1, .h1 {
    font-size: 2.5rem;
  }
}

h2, .h2 {
  font-size: calc(1.325rem + 0.9vw);
}
@media (min-width: 1200px) {
  h2, .h2 {
    font-size: 2rem;
  }
}

h3, .h3 {
  font-size: calc(1.3rem + 0.6vw);
}
@media (min-width: 1200px) {
  h3, .h3 {
    font-size: 1.75rem;
  }
}

h4, .h4 {
  font-size: calc(1.275rem + 0.3vw);
}
@media (min-width: 1200px) {
  h4, .h4 {
    font-size: 1.5rem;
  }
}

h5, .h5 {
  font-size: 1.25rem;
}

p {
  margin-top: 0;
  margin-bottom: 1rem;
}


ul {
  padding-left: 2rem;
}


ul {
  margin-top: 0;
  margin-bottom: 1rem;
}


ul ul {
  margin-bottom: 0;
}

small, .small {
  font-size: 0.875em;
}

a {
  color: rgba(var(--bs-link-color-rgb), var(--bs-link-opacity, 1));
  text-decoration: underline;
}
a:hover {
  --bs-link-color-rgb: var(--bs-link-hover-color-rgb);
}

a:not([href]):not([class]), a:not([href]):not([class]):hover {
  color: inherit;
  text-decoration: none;
}

img {
  vertical-align: middle;
}

label {
  display: inline-block;
}

button {
  border-radius: 0;
}

button:focus:not(:focus-visible) {
  outline: 0;
}

input,
button,
select {
  margin: 0;
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
}

button,
select {
  text-transform: none;
}

select {
  word-wrap: normal;
}
select:disabled {
  opacity: 1;
}

button,
[type=button] {
  -webkit-appearance: button;
}
button:not(:disabled),
[type=button]:not(:disabled) {
  cursor: pointer;
}

::-moz-focus-inner {
  padding: 0;
  border-style: none;
}

::-webkit-datetime-edit-fields-wrapper,
::-webkit-datetime-edit-text,
::-webkit-datetime-edit-minute,
::-webkit-datetime-edit-hour-field,
::-webkit-datetime-edit-day-field,
::-webkit-datetime-edit-month-field,
::-webkit-datetime-edit-year-field {
  padding: 0;
}

::-webkit-inner-spin-button {
  height: auto;
}

::-webkit-search-decoration {
  -webkit-appearance: none;
}

::-webkit-color-swatch-wrapper {
  padding: 0;
}

::file-selector-button {
  font: inherit;
  -webkit-appearance: button;
}

[hidden] {
  display: none !important;
}

.lead {
  font-size: 1.25rem;
  font-weight: 300;
}

.list-unstyled {
  padding-left: 0;
  list-style: none;
}

.container {
  --bs-gutter-x: 1.5rem;
  --bs-gutter-y: 0;
  width: 100%;
  padding-right: calc(var(--bs-gutter-x) * 0.5);
  padding-left: calc(var(--bs-gutter-x) * 0.5);
  margin-right: auto;
  margin-left: auto;
}

@media (min-width: 576px) {
   .container {
    max-width: 540px;
  }
}
@media (min-width: 768px) {
   .container {
    max-width: 720px;
  }
}
@media (min-width: 992px) {
   .container {
    max-width: 960px;
  }
}
@media (min-width: 1200px) {
   .container {
    max-width: 1140px;
  }
}
@media (min-width: 1400px) {
   .container {
    max-width: 1320px;
  }
}
:root {
  --bs-breakpoint-xs: 0;
  --bs-breakpoint-sm: 576px;
  --bs-breakpoint-md: 768px;
  --bs-breakpoint-lg: 992px;
  --bs-breakpoint-xl: 1200px;
  --bs-breakpoint-xxl: 1400px;
}

.row {
  --bs-gutter-x: 1.5rem;
  --bs-gutter-y: 0;
  display: flex;
  flex-wrap: wrap;
  margin-top: calc(-1 * var(--bs-gutter-y));
  margin-right: calc(-0.5 * var(--bs-gutter-x));
  margin-left: calc(-0.5 * var(--bs-gutter-x));
}
.row > * {
  flex-shrink: 0;
  width: 100%;
  max-width: 100%;
  padding-right: calc(var(--bs-gutter-x) * 0.5);
  padding-left: calc(var(--bs-gutter-x) * 0.5);
  margin-top: var(--bs-gutter-y);
}

.col-12 {
  flex: 0 0 auto;
  width: 100%;
}

.g-0 {
  --bs-gutter-x: 0;
}

.g-0 {
  --bs-gutter-y: 0;
}

@media (min-width: 576px) {
  .col-sm-6 {
    flex: 0 0 auto;
    width: 50%;
  }
}
@media (min-width: 768px) {
  .col-md {
    flex: 1 0 0%;
  }
  .col-md-4 {
    flex: 0 0 auto;
    width: 33.33333333%;
  }
  .col-md-6 {
    flex: 0 0 auto;
    width: 50%;
  }
  .col-md-7 {
    flex: 0 0 auto;
    width: 58.33333333%;
  }
}
@media (min-width: 992px) {
  .col-lg-3 {
    flex: 0 0 auto;
    width: 25%;
  }
  .col-lg-4 {
    flex: 0 0 auto;
    width: 33.33333333%;
  }
  .col-lg-6 {
    flex: 0 0 auto;
    width: 50%;
  }
  .col-lg-8 {
    flex: 0 0 auto;
    width: 66.66666667%;
  }
  .col-lg-9 {
    flex: 0 0 auto;
    width: 75%;
  }
}

.btn {
  --bs-btn-padding-x: 0.75rem;
  --bs-btn-padding-y: 0.375rem;
  --bs-btn-font-family: ;
  --bs-btn-font-size: 1rem;
  --bs-btn-font-weight: 400;
  --bs-btn-line-height: 1.5;
  --bs-btn-color: var(--bs-body-color);
  --bs-btn-bg: transparent;
  --bs-btn-border-width: var(--bs-border-width);
  --bs-btn-border-color: transparent;
  --bs-btn-border-radius: var(--bs-border-radius);
  --bs-btn-hover-border-color: transparent;
  --bs-btn-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075);
  --bs-btn-disabled-opacity: 0.65;
  --bs-btn-focus-box-shadow: 0 0 0 0.25rem rgba(var(--bs-btn-focus-shadow-rgb), .5);
  display: inline-block;
  padding: var(--bs-btn-padding-y) var(--bs-btn-padding-x);
  font-family: var(--bs-btn-font-family);
  font-size: var(--bs-btn-font-size);
  font-weight: var(--bs-btn-font-weight);
  line-height: var(--bs-btn-line-height);
  color: var(--bs-btn-color);
  text-align: center;
  text-decoration: none;
  vertical-align: middle;
  cursor: pointer;
  user-select: none;
  border: var(--bs-btn-border-width) solid var(--bs-btn-border-color);
  border-radius: var(--bs-btn-border-radius);
  background-color: var(--bs-btn-bg);
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
@media (prefers-reduced-motion: reduce) {
  .btn {
    transition: none;
  }
}
.btn:hover {
  color: var(--bs-btn-hover-color);
  background-color: var(--bs-btn-hover-bg);
  border-color: var(--bs-btn-hover-border-color);
}
.btn:focus-visible {
  color: var(--bs-btn-hover-color);
  background-color: var(--bs-btn-hover-bg);
  border-color: var(--bs-btn-hover-border-color);
  outline: 0;
  box-shadow: var(--bs-btn-focus-box-shadow);
}
 :not(.btn-check) + .btn:active, .btn:first-child:active, .btn.active, .btn.show {
  color: var(--bs-btn-active-color);
  background-color: var(--bs-btn-active-bg);
  border-color: var(--bs-btn-active-border-color);
}
 :not(.btn-check) + .btn:active:focus-visible, .btn:first-child:active:focus-visible, .btn.active:focus-visible, .btn.show:focus-visible {
  box-shadow: var(--bs-btn-focus-box-shadow);
}
.btn:disabled {
  color: var(--bs-btn-disabled-color);
  pointer-events: none;
  background-color: var(--bs-btn-disabled-bg);
  border-color: var(--bs-btn-disabled-border-color);
  opacity: var(--bs-btn-disabled-opacity);
}

.collapse:not(.show) {
  display: none;
}

.nav {
  --bs-nav-link-padding-x: 1rem;
  --bs-nav-link-padding-y: 0.5rem;
  --bs-nav-link-font-weight: ;
  --bs-nav-link-color: var(--bs-link-color);
  --bs-nav-link-hover-color: var(--bs-link-hover-color);
  --bs-nav-link-disabled-color: var(--bs-secondary-color);
  display: flex;
  flex-wrap: wrap;
  padding-left: 0;
  margin-bottom: 0;
  list-style: none;
}

.alert {
  --bs-alert-bg: transparent;
  --bs-alert-padding-x: 1rem;
  --bs-alert-padding-y: 1rem;
  --bs-alert-margin-bottom: 1rem;
  --bs-alert-color: inherit;
  --bs-alert-border-color: transparent;
  --bs-alert-border: var(--bs-border-width) solid var(--bs-alert-border-color);
  --bs-alert-border-radius: var(--bs-border-radius);
  --bs-alert-link-color: inherit;
  position: relative;
  padding: var(--bs-alert-padding-y) var(--bs-alert-padding-x);
  margin-bottom: var(--bs-alert-margin-bottom);
  color: var(--bs-alert-color);
  background-color: var(--bs-alert-bg);
  border: var(--bs-alert-border);
  border-radius: var(--bs-alert-border-radius);
}

@keyframes progress-bar-stripes {
  0% {
    background-position-x: 1rem;
  }
}

@keyframes spinner-border {
  to {
    transform: rotate(360deg) /* rtl:ignore */;
  }
}

@keyframes spinner-grow {
  0% {
    transform: scale(0);
  }
  50% {
    opacity: 1;
    transform: none;
  }
}

@keyframes placeholder-glow {
  50% {
    opacity: 0.2;
  }
}

@keyframes placeholder-wave {
  100% {
    mask-position: -200% 0%;
  }
}

.d-block {
  display: block !important;
}

.d-flex {
  display: flex !important;
}

.d-none {
  display: none !important;
}

.shadow-none {
  box-shadow: none !important;
}

.border {
  border: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important;
}

.border-0 {
  border: 0 !important;
}

.h-100 {
  height: 100% !important;
}

.flex-column {
  flex-direction: column !important;
}

.justify-content-end {
  justify-content: flex-end !important;
}

.justify-content-center {
  justify-content: center !important;
}

.align-items-end {
  align-items: flex-end !important;
}

.align-items-center {
  align-items: center !important;
}

.align-items-stretch {
  align-items: stretch !important;
}

.m-0 {
  margin: 0 !important;
}

.mx-auto {
  margin-right: auto !important;
  margin-left: auto !important;
}

.my-0 {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

.mt-3 {
  margin-top: 1rem !important;
}

.mt-4 {
  margin-top: 1.5rem !important;
}

.mt-5 {
  margin-top: 3rem !important;
}

.mt-6 {
  margin-top: 5rem !important;
}

.mb-0 {
  margin-bottom: 0 !important;
}

.mb-4 {
  margin-bottom: 1.5rem !important;
}

.mb-5 {
  margin-bottom: 3rem !important;
}

.p-0 {
  padding: 0 !important;
}

.py-0 {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.pt-0 {
  padding-top: 0 !important;
}

.fs-4 {
  font-size: calc(1.275rem + 0.3vw) !important;
}

.fst-normal {
  font-style: normal !important;
}

.fw-light {
  font-weight: 300 !important;
}

.fw-normal {
  font-weight: 400 !important;
}

.fw-medium {
  font-weight: 500 !important;
}

.fw-semibold {
  font-weight: 600 !important;
}

.text-center {
  text-align: center !important;
}

.text-uppercase {
  text-transform: uppercase !important;
}

.text-muted {
  --bs-text-opacity: 1;
  color: var(--bs-secondary-color) !important;
}

.bg-transparent {
  --bs-bg-opacity: 1;
  background-color: transparent !important;
}

.visible {
  visibility: visible !important;
}
@media (min-width: 768px) {
  .d-md-block {
    display: block !important;
  }
}
@media (min-width: 992px) {
  .mt-lg-0 {
    margin-top: 0 !important;
  }
  .mb-lg-0 {
    margin-bottom: 0 !important;
  }
  .text-lg-start {
    text-align: left !important;
  }
}
@media (min-width: 1200px) {
  .fs-4 {
    font-size: 1.5rem !important;
  }
}
:root {
  --cnvs-themecolor:	#83b341;
  --cnvs-themecolor-rgb:	131, 179, 65;
  --bs-link-color:	var(--cnvs-themecolor);
  --bs-link-color-rgb:	var(--cnvs-themecolor-rgb);
  --bs-link-hover-color:	var(--cnvs-heading-color);
  --cnvs-white:	#fff;
  --cnvs-black:	#000;
  --cnvs-body-bg:	var(--bs-body-bg);
  --cnvs-body-bg-boxed:	var(--cnvs-contrast-0);
  --cnvs-headings-font-weight:	500;
  --cnvs-before-heading-font:	normal 400 1.0625rem var(--cnvs-secondary-font);
  /* Font Families */
  --cnvs-body-font:	"Inter", sans-serif;
  --cnvs-primary-font:	"Inter", sans-serif;
  --cnvs-secondary-font:	"Playfair Display", serif;
  --cnvs-line-height-base:	1.5;
  --cnvs-line-height-content:	1.65;
  /* Margins */
  --cnvs-margin-base:	3rem;
  --cnvs-margin-sm:	2rem;
  --cnvs-margin-lg:	5rem;
  --cnvs-content-padding:	5rem;
  --cnvs-section-margin:	4rem;
  --cnvs-section-padding:	var(--cnvs-section-margin);
  --cnvs-col-padding:	var(--cnvs-section-padding);
  --cnvs-box-shadow-sm:	0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
  --cnvs-box-shadow:	0 0.5rem 1rem rgba(0, 0, 0, 0.15);
  --cnvs-box-shadow-lg:	0 1rem 3rem rgba(0, 0, 0, 0.175);
  --cnvs-copyrights-font-size: 0.875rem;
  --bs-bg-opacity:	1;
  /* Header Height */
  --cnvs-header-height:	100px;
  --cnvs-header-height-sm:	60px;
  --cnvs-header-height-md:	80px;
  --cnvs-header-height-lg:	120px;
  --cnvs-header-height-shrink:	60px;
  --cnvs-side-header-width:	260px;
  --cnvs-side-header-padding-gutters:	30px;
  --cnvs-transitions:	0.5s ease;
  /* Social Colors */
  --cnvs-color-facebook:	#3b5998;
  --cnvs-color-whatsapp:	#25d366;
  --cnvs-color-delicious:	#205cc0;
  --cnvs-color-paypal:	#00588b;
  --cnvs-color-waze:	#05c8f7;
  --cnvs-color-android:	#a4c639;
  --cnvs-color-googledrive:	#1FA463;
  --cnvs-color-wikipedia:	#333;
  --cnvs-color-stumbleupon:	#f74425;
  --cnvs-color-foursquare:	#25a0ca;
  --cnvs-color-call:	#444;
  --cnvs-color-ninetyninedesigns:	#f26739;
  --cnvs-color-forrst:	#5b9a68;
  --cnvs-color-digg:	#191919;
  --cnvs-color-spotify:	#1DB954;
  --cnvs-color-reddit:	#c6c6c6;
  --cnvs-color-blogger:	#fc4f08;
  --cnvs-color-cc:	#688527;
  --cnvs-color-dribbble:	#ea4c89;
  --cnvs-color-evernote:	#5ba525;
  --cnvs-color-flickr:	#ff0084;
  --cnvs-color-google:	#4885ed;
  --cnvs-color-salesforce:	#1798c1;
  --cnvs-color-cloudflare:	#f38020;
  --cnvs-color-linkedin:	#0e76a8;
  --cnvs-color-vk:	#2b587a;
  --cnvs-color-rss:	#ee802f;
  --cnvs-color-skype:	#00aff0;
  --cnvs-color-twitter:	#00acee;
  --cnvs-color-youtube:	#c4302b;
  --cnvs-color-vimeo:	#86c9ef;
  --cnvs-color-slack:	#ECB22E;
  --cnvs-color-yahoo:	#720e9e;
  --cnvs-color-email3:	#6567a5;
  --cnvs-color-macstore:	#333333;
  --cnvs-color-figma:	#ab7c63;
  --cnvs-color-podcast:	#e4b21b;
  --cnvs-color-meetup:	#e51937;
  --cnvs-color-dropbox:	#3d9ae8;
  --cnvs-color-ebay:	#89c507;
  --cnvs-color-github:	#171515;
  --cnvs-color-googleplay:	#3bccff;
  --cnvs-color-itunes:	#222;
  --cnvs-color-periscope:	#52677b;
  --cnvs-color-meta:	#0668E1;
  --cnvs-color-soundcloud:	#ff7700;
  --cnvs-color-tumblr:	#34526f;
  --cnvs-color-wordpress:	#1e8cbe;
  --cnvs-color-yelp:	#c41200;
  --cnvs-color-microsoft:	#f65314;
  --cnvs-color-trello:	#0079bf;
  --cnvs-color-scribd:	#666666;
  --cnvs-color-stripe:	#008cdd;
  --cnvs-color-print:	#111;
  --cnvs-color-btc:	#f2a900;
  --cnvs-color-weibo:	#DF2029;
  --cnvs-color-acrobat:	#d3222a;
  --cnvs-color-drupal:	#27537a;
  --cnvs-color-buffer:	#333333;
  --cnvs-color-pocket:	#ee4056;
  --cnvs-color-bitbucket:	#0e4984;
  --cnvs-color-stackoverflow:	#ef8236;
  --cnvs-color-hackernews:	#ff6600;
  --cnvs-color-xing:	#126567;
  --cnvs-color-instagram:	#8a3ab9;
  --cnvs-color-quora:	#a82400;
  --cnvs-color-openid:	#e16309;
  --cnvs-color-steam:	#111;
  --cnvs-color-amazon:	#e47911;
  --cnvs-color-line:	#00b900;
  --cnvs-color-kickstarter:	#87c442;
  --cnvs-color-appstore:	#000;
  --cnvs-color-pinterest:	#c8232c;
  --cnvs-color-fivehundredpx:	#111;
  --cnvs-color-tiktok:	#000;
  --cnvs-color-airbnb:	#FF5A5F;
  --cnvs-color-gpay:	#6877df;
  --cnvs-color-unsplash:	#111;
  --cnvs-color-snapchat:	#fffc00;
  --cnvs-color-discord:	#7289da;
  --cnvs-color-twitch:	#6441a5;
  --cnvs-font-size-body:	var(--bs-body-font-size);
  --cnvs-font-size-h1:	2.25rem;
  --cnvs-font-size-h2:	1.875rem;
  --cnvs-font-size-h3:	1.5rem;
  --cnvs-font-size-h4:	1.125rem;
  --cnvs-font-size-h5:	0.875rem;
  --cnvs-font-size-h6:	0.75rem;
  --cnvs-font-size-small:	0.75rem;
}

:root,
.not-dark {
  --cnvs-contrast-0: #fff;
  --cnvs-contrast-100: #f8f9fa;
  --cnvs-contrast-200: #e9ecef;
  --cnvs-contrast-300: #dee2e6;
  --cnvs-contrast-400: #ced4da;
  --cnvs-contrast-500: #adb5bd;
  --cnvs-contrast-600: #6c757d;
  --cnvs-contrast-700: #495057;
  --cnvs-contrast-800: #343a40;
  --cnvs-contrast-900: #212529;
  --cnvs-contrast-1000: #000;
  --cnvs-invert-contrast-0: #000;
  --cnvs-invert-contrast-100: #212529;
  --cnvs-invert-contrast-200: #343a40;
  --cnvs-invert-contrast-300: #495057;
  --cnvs-invert-contrast-400: #6c757d;
  --cnvs-invert-contrast-500: #adb5bd;
  --cnvs-invert-contrast-600: #ced4da;
  --cnvs-invert-contrast-700: #dee2e6;
  --cnvs-invert-contrast-800: #e9ecef;
  --cnvs-invert-contrast-900: #f8f9fa;
  --cnvs-invert-contrast-1000: #fff;
  --cnvs-link-color:	var(--cnvs-themecolor);
  --cnvs-link-hover-color:	var(--cnvs---cnvs-heading-color);
  --cnvs-contrast-rgb:	0, 0, 0;
  --cnvs-invert-contrast-rgb:	255, 255, 255;
  --cnvs-contrast-bg:	#fff;
  --cnvs-contrast-bg-offset:	#f8f9fa;
  --cnvs-topbar-bg: var(--cnvs-contrast-0);
  --cnvs-topbar-color: var(--cnvs-contrast-700);
  --cnvs-topbar-border-color: rgba(var(--cnvs-contrast-rgb), 0.1);
  --cnvs-topbar-social-icon-color: var(--cnvs-contrast-600);
  --cnvs-header-bg:	var(--cnvs-contrast-0);
  --cnvs-header-sticky-bg:	var(--cnvs-header-bg);
  --cnvs-side-header-bg:	var(--cnvs-contrast-0);
  --cnvs-section-bg:	var(--cnvs-contrast-bg-offset);
  --cnvs-heading-color:	var(--cnvs-contrast-900);
  --cnvs-line-color:	rgba(var(--cnvs-contrast-rgb), .1);
  --cnvs-footer-bg:	var(--cnvs-contrast-bg-offset);
  color: var(--cnvs-contrast-800);
}

/* ----------------------------------------------------------------

  Layouts.scss

-----------------------------------------------------------------*/
/* ----------------------------------------------------------------
  Bootstrap Adjustments
-----------------------------------------------------------------*/
@media (prefers-reduced-motion: no-preference) {
  :root {
    scroll-behavior: auto;
  }
}
[class*=col-]:not([class*=sticky-]):not([class*=position-]) {
  position: relative;
}

/*	Custom Bootstap Columns */
#wrapper {
  position: relative;
  float: none;
  width: 100%;
  margin: 0 auto;
  background-color: var(--cnvs-body-bg);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}
@media (min-width: 1200px) {
  body:not(.stretched) #wrapper {
    max-width: 1200px;
  }
}
@media (min-width: 1400px) {
  body:not(.stretched) #wrapper {
    max-width: 1400px;
  }
}
.stretched #wrapper {
  width: 100%;
  margin: 0;
  box-shadow: none;
}

/* ----------------------------------------------------------------
  Sections
-----------------------------------------------------------------*/
.section {
  position: relative;
  width: 100%;
  margin: var(--cnvs-section-margin) 0;
  padding: var(--cnvs-section-padding) 0;
  background-color: var(--cnvs-section-bg);
  overflow: hidden;
}
.section .container {
  z-index: 2;
}

.parallax {
  overflow: hidden;
  will-change: transform;
  position: relative;
}
.parallax-bg {
  min-width: 100%;
  min-height: 100%;
  object-fit: cover;
  will-change: transform;
}
@media (max-width: 991.98px) {
  .parallax-bg {
    max-width: none;
    height: 100%;
  }
}
.parallax-bg {
  opacity: 1;
}
@media (max-width: 991.98px) {
  .parallax-bg {
    position: absolute;
    z-index: -1;
    left: 0;
    top: 0;
  }
}
body:not(.has-plugin-parallax) .parallax-bg {
  opacity: 0;
  display: none;
}

/* ----------------------------------------------------------------
  Columns & Grids
-----------------------------------------------------------------*/

/*-----------------------------------------------------------------------------------
  typography.scss
-----------------------------------------------------------------------------------*/
/* ----------------------------------------------------------------
  Basic
-----------------------------------------------------------------*/
 ul, li {
  margin: 0;
  padding: 0;
}

.clear {
  clear: both;
  display: block;
  font-size: 0px;
  height: 0px;
  line-height: 0;
  width: 100%;
  overflow: hidden;
}

::selection {
  background: var(--cnvs-themecolor);
  color: var(--cnvs-body-bg);
  text-shadow: none;
}

::-moz-selection {
  background: var(--cnvs-themecolor);
  color: var(--cnvs-body-bg);
  text-shadow: none;
}

::-webkit-selection {
  background: var(--cnvs-themecolor);
  color: var(--cnvs-body-bg);
  text-shadow: none;
}

/* ----------------------------------------------------------------
  Typography
-----------------------------------------------------------------*/
body {
  line-height: 1.5;
  font-size: var(--cnvs-font-size-body);
  font-family: var(--cnvs-body-font);
  background: var(--cnvs-body-bg-boxed);
}

a {
  color: var(--cnvs-link-color);
}
a:not(.btn-link):not(.text-decoration-underline) {
  text-decoration: none !important;
}
a:hover {
  color: var(--cnvs-link-hover-color);
}
a img {
  border: none;
}

img {
  max-width: 100%;
}

/* ----------------------------------------------------------------
  Basic Layout Styles
-----------------------------------------------------------------*/
h1, .h1,
h2,
.h2,
h3,
.h3,
h4,
.h4,
h5,
.h5 {
  color: var(--cnvs-heading-color);
  font-weight: var(--cnvs-headings-font-weight);
  line-height: var(--cnvs-line-height-base);
  margin: 0 0 30px 0;
  font-family: var(--cnvs-primary-font);
}

h5, .h5 {
  font-weight: bold;
  margin-bottom: 20px;
}

h1, .h1 {
  font-size: var(--cnvs-font-size-h1);
}

h2, .h2 {
  font-size: var(--cnvs-font-size-h2);
}

h3, .h3 {
  font-size: var(--cnvs-font-size-h3);
}

h4, .h4 {
  font-size: var(--cnvs-font-size-h4);
}

h5, .h5 {
  font-size: var(--cnvs-font-size-h5);
}

.h5 {
  font-size: 1.25rem;
}

h4, .h4 {
  font-weight: 600;
}

h5, .h5 {
  font-weight: bold;
}

@media (max-width: 767.98px) {
  h1, .h1 {
    font-size: 1.75rem;
  }
  h2, .h2 {
    font-size: 1.5rem;
  }
  h3, .h3 {
    font-size: 1.25rem;
  }
  h4, .h4 {
    font-size: 1rem;
  }
}
h1 > span:not(.nocolor):not(.badge), .h1 > span:not(.nocolor):not(.badge),
h2 > span:not(.nocolor):not(.badge),
.h2 > span:not(.nocolor):not(.badge),
h3 > span:not(.nocolor):not(.badge),
.h3 > span:not(.nocolor):not(.badge),
h4 > span:not(.nocolor):not(.badge),
.h4 > span:not(.nocolor):not(.badge),
h5 > span:not(.nocolor):not(.badge),
.h5 > span:not(.nocolor):not(.badge) {
  color: var(--cnvs-themecolor);
}

p,
ul {
  margin-bottom: 30px;
}

small, .small {
  font-family: var(--cnvs-font-size-small);
}

/*-----------------------------------------------------------------------------------

  Utilities.scss

-----------------------------------------------------------------------------------*/
/* ----------------------------------------------------------------
  Helper Classes
-----------------------------------------------------------------*/

.col-padding {
  padding: 4rem;
}

.inline-block {
  float: none !important;
  display: inline-block !important;
}

.center {
  text-align: center !important;
}

.mx-auto {
  position: relative !important;
  float: none !important;
}

/* ----------------------------------------------------------------
  Text Contrast Color Utility Classes
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
  BG Contrast Color Utility Classes
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
  Border Contrast Color Utility Classes
-----------------------------------------------------------------*/

.color {
  color: rgba(var(--cnvs-themecolor-rgb), var(--bs-text-opacity, 1)) !important;
}

.border-color {
  border-color: var(--cnvs-themecolor) !important;
}

.text-transform-none {
  text-transform: none !important;
}

/* ----------------------------------------------------------------
  Font Weight Utility Classes
-----------------------------------------------------------------*/

.fw-medium {
  font-weight: 500 !important;
}

.fw-semibold {
  font-weight: 600 !important;
}

.fst-normal {
  font-style: normal !important;
}

/* ----------------------------------------------------------------
  Letter Spacing Utility Classes
-----------------------------------------------------------------*/

.ls-1 {
  letter-spacing: 1px !important;
}

.ls-2 {
  letter-spacing: 2px !important;
}

.ls-3 {
  letter-spacing: 3px !important;
}

.font-body {
  font-family: var(--cnvs-body-font);
}

/* ----------------------------------------------------------------
  Text Underline Offset
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
  Image fit Objects
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
  Image Object & Background Positions
-----------------------------------------------------------------*/
/* ----------------------------------------------------------------
  Background Sizes
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
  Image Scale Utility Classes
-----------------------------------------------------------------*/

@-webkit-keyframes BgAnimated {
  from {
    background-position: 0 0;
  }
  to {
    background-position: 0 400px;
  }
}
@keyframes BgAnimated {
  from {
    background-position: 0 0;
  }
  to {
    background-position: 0 400px;
  }
}

/* ----------------------------------------------------------------
  Opacity Utility Classes
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
  Text Sizing Utility
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
  Text Color Utility Classes
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
  BG Color Utility Classes
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
  Gradient Utility Classes
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
  Bootstrap Utility Classes: Extended
-----------------------------------------------------------------*/
/*	Gutters */
/* ----------------------------------------------------------------
  col-mb-classes & Bootstrap Utility Classes: Extended
-----------------------------------------------------------------*/
[class*=col-mb-] {
  margin-bottom: calc(var(--cnvs-col-mb) * -1);
}


[class*=col-mb-] > [class*=col-] {
  padding-bottom: var(--cnvs-col-mb);
}

.col-mb-50 {
  --cnvs-col-mb: 50px;
}
/* ----------------------------------------------------------------
  Height Utility Classes
-----------------------------------------------------------------*/

.h-100 {
  height: 100% !important;
}
/* ----------------------------------------------------------------
  Position Utility Classes: Extended
-----------------------------------------------------------------*/
/* ----------------------------------------------------------------
  Lazy Loading
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
  Borders
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
  Max-width Utility Classes:
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
  Text Sizes Utility Classes:
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
  X/Y Positioning Classes
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
  Square Sizes Utility Classes:
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
  Max-width Utility Classes:
-----------------------------------------------------------------*/
/* ----------------------------------------------------------------
  Shadow
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
  translate
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
  translate
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------

  topbar.scss

-----------------------------------------------------------------*/
/* ----------------------------------------------------------------
  Top Bar
-----------------------------------------------------------------*/

/* Top Links
---------------------------------*/

/* Top Social
-----------------------------------------------------------------*/

/* Top Login
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------

  header.scss

-----------------------------------------------------------------*/
/* ----------------------------------------------------------------
  Header
-----------------------------------------------------------------*/
:root,
.not-dark {
  --cnvs-header-border-color: rgba(var(--cnvs-contrast-rgb), .1);
  --cnvs-header-transparent-border-color: rgba(var(--cnvs-contrast-rgb), .1);
  --cnvs-header-floating-bg: var(--cnvs-contrast-0);
  --cnvs-primary-menu-color: var(--cnvs-contrast-900);
  --cnvs-primary-menu-submenu-bg: var(--cnvs-contrast-0);
  --cnvs-primary-menu-submenu-color: var(--cnvs-contrast-900);
  --cnvs-primary-menu-submenu-border: 1px solid rgba(var(--cnvs-contrast-rgb), 0.1);
  --cnvs-primary-menu-submenu-hover-bg: rgba(var(--cnvs-contrast-rgb), 0.025);
  --cnvs-header-misc-icons-color: var(--cnvs-primary-menu-color);
  --cnvs-side-panel-bg: var(--cnvs-contrast-100);
}

#header {
  --cnvs-sticky-header-height:	var(--cnvs-header-height);
  --cnvs-header-border-color:	rgba(var(--cnvs-contrast-rgb), .1);
  --cnvs-header-transparent-border-color: rgba(var(--cnvs-contrast-rgb), .1);
  --cnvs-primary-menu-padding-x:	15px;
  /*  Floating Header */
  --cnvs-header-floating-top-offset:	60px;
  --cnvs-header-floating-padding:	30px;
  /*  Side Header */
  --cnvs-side-header-padding-gutters:	30px;
  /*  Primary Menu */
  --cnvs-primary-menu-color:	var(--cnvs-contrast-900);
  --cnvs-primary-menu-hover-color: var(--cnvs-themecolor);
  --cnvs-primary-menu-active-color:	var(--cnvs-primary-menu-hover-color);
  --cnvs-primary-menu-font:	var(--cnvs-primary-font);
  --cnvs-primary-menu-font-weight:	500;
  --cnvs-primary-menu-font-size:	1rem;
  --cnvs-primary-menu-tt:	none;
  --cnvs-primary-menu-ls:	0;
  --cnvs-primary-menu-icon-size:	1rem;
  --cnvs-primary-menu-submenu-padding-x: 15px;
  --cnvs-primary-menu-submenu-padding-y: 10px;
  --cnvs-primary-menu-submenu-top-border: 2px solid var(--cnvs-themecolor);
  --cnvs-primary-menu-submenu-width:	240px;
  --cnvs-primary-menu-submenu-font:	var(--cnvs-body-font);
  --cnvs-primary-menu-submenu-font-size:	0.875rem;
  --cnvs-primary-menu-submenu-font-weight:	400;
  --cnvs-primary-menu-submenu-hover-font-weight: 500;
  --cnvs-primary-menu-submenu-tt:	none;
  --cnvs-primary-menu-submenu-color:	var(--cnvs-contrast-900);
  --cnvs-primary-menu-submenu-spacing:	0;
  --cnvs-primary-menu-submenu-border:	1px solid rgba(var(--cnvs-contrast-rgb), 0.1);
  --cnvs-primary-menu-submenu-hover-bg:	rgba(var(--cnvs-contrast-rgb), 0.025);
  --cnvs-primary-menu-submenu-hover-color: var(--cnvs-primary-menu-active-color);
  --cnvs-header-misc-icons-size:	1.125rem;
  --cnvs-header-misc-icons-color:	var(--cnvs-primary-menu-color);
  --cnvs-mega-menu-width-sm: 400px;
  --cnvs-mobile-menu-off-canvas-width: 280px;
  position: relative;
}
#header-wrap {
  position: fixed;
  height: auto;
  z-index: 299;
  width: 100%;
  background-color: var(--cnvs-header-bg);
  border-bottom: 1px solid var(--cnvs-header-border-color);
  transition: height 0.2s ease 0s, background-color 0.3s ease 0s;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
@media (prefers-reduced-motion: reduce) {
  #header-wrap {
    transition: none;
  }
}


.is-expanded-menu div + #header-wrap {
  position: absolute;
}

body.is-expanded-menu:not(.stretched) #header:not(.sticky-header) #header-wrap {
  position: absolute;
}

body:not(.is-expanded-menu) #header:not([data-mobile-sticky=true]) #header-wrap {
  
}

body:not(.is-expanded-menu) #header:not([data-mobile-sticky=true]) .header-wrap-clone {
  display: none;
}

.header-wrap-clone {
  height: calc(var(--cnvs-header-height) + 1px);
}

.header-row {
  position: relative;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}
.is-expanded-menu .header-row {
  position: initial;
}

.is-expanded-menu {
  /* ----------------------------------------------------------------
    Sticky Header
  -----------------------------------------------------------------*/
}
.is-expanded-menu #header.sticky-header-shrink {
  --cnvs-sticky-header-height: var(--cnvs-header-height-shrink);
}
.is-expanded-menu #header.full-header:not(.transparent-header) {
  border-bottom-color: var(--cnvs-header-border-color);
}
.is-expanded-menu.stretched .full-header #header-wrap > .container {
  width: 100%;
  max-width: none;
  padding: 0 30px;
}
.is-expanded-menu .sticky-header #header-wrap {
  position: fixed;
  top: 0;
  left: 0;
  background-color: var(--cnvs-header-sticky-bg);
}
.is-expanded-menu .sticky-header.full-header #header-wrap {
  border-bottom: 1px solid var(--cnvs-header-border-color);
}
body:not(.is-expanded-menu) .sticky-header #header-wrap {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 299;
  background-color: var(--cnvs-header-sticky-bg);
  border-bottom: var(--cnvs-primary-menu-submenu-border);
  -webkit-transform: translateZ(0);
  -webkit-backface-visibility: hidden;
}
body:not(.is-expanded-menu) .sticky-header .header-wrap-clone {
  display: block;
}

/* ----------------------------------------------------------------
  Logo
-----------------------------------------------------------------*/
#logo {
  position: relative;
  display: flex;
  align-items: center;
  margin-right: auto;
  max-height: 100%;
}
#logo a {
  color: #000;
  font-family: var(--cnvs-primary-font);
  font-size: 36px;
  width: 100%;
}
#logo a [class^=logo-] {
  display: none;
}
#logo a .logo-default {
  display: flex;
}
#logo img {
  display: block;
  max-width: 100%;
  max-height: 100%;
  margin-left: auto;
  margin-right: auto;
  transition: height 0.4s ease, padding 0.4s ease, margin 0.4s ease, opacity 0.3s ease;
}
@media (prefers-reduced-motion: reduce) {
  #logo img {
    transition: none;
  }
}
#header-wrap #logo img {
  height: var(--cnvs-header-height);
}
.is-expanded-menu .full-header #logo {
  padding-right: 30px;
  border-right: 1px solid var(--cnvs-header-border-color);
}
.is-expanded-menu #header.sticky-header-shrink #header-wrap #logo img {
  height: var(--cnvs-sticky-header-height);
}

/* ----------------------------------------------------------------
  Header Right Area
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
  Primary Menu
-----------------------------------------------------------------*/
.primary-menu {
  display: flex;
  flex-basis: 100%;
  flex-grow: 1;
  align-items: center;
}
.is-expanded-menu .primary-menu {
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
  flex-grow: 0;
}
.primary-menu + .primary-menu {
  border-top: var(--cnvs-primary-menu-submenu-border);
}
.is-expanded-menu .primary-menu + .primary-menu {
  border-top: 0;
}

.primary-menu-trigger {
  --cnvs-menu-trigger-gap: 0.75rem;
  display: flex;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
}
@media (prefers-reduced-motion: reduce) {
  .primary-menu-trigger {
    transition: none;
  }
}
body:not(.is-expanded-menu) .primary-menu-trigger {
  opacity: 1;
  pointer-events: auto;
  cursor: pointer;
  justify-content: center;
  align-items: center;
  padding: var(--cnvs-menu-trigger-gap);
}

@media (prefers-reduced-motion: reduce) {
  .primary-menu-trigger {
    transition: none;
  }
}
.is-expanded-menu .primary-menu-trigger {
  display: none;
  opacity: 0;
  pointer-events: none;
  z-index: 0;
}

.cnvs-hamburger {
  --cnvs-hamburger-size: 1rem;
  --cnvs-hamburger-width: 2px;
  --cnvs-hamburger-offset: calc(-1 * calc(calc(var(--cnvs-hamburger-size) - calc(var(--cnvs-hamburger-width) * 2)) * .5));
  display: block;
  position: relative;
  cursor: pointer;
  transition-property: opacity, filter;
  transition-duration: 0.15s;
  transition-timing-function: linear;
  font: inherit;
  color: inherit;
  text-transform: none;
  background-color: transparent;
  border: 0;
  margin: 0;
  padding: 0;
  overflow: visible;
}
.cnvs-hamburger .cnvs-hamburger-box {
  width: var(--cnvs-hamburger-size);
  height: var(--cnvs-hamburger-size);
  display: block;
  position: relative;
}
.cnvs-hamburger .cnvs-hamburger-inner {
  display: block;
  top: 50%;
  margin-top: calc(-1 * var(--cnvs-hamburger-width) * 0.5);
  transition-duration: 0.075s;
  transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
.cnvs-hamburger .cnvs-hamburger-inner, .cnvs-hamburger .cnvs-hamburger-inner::before, .cnvs-hamburger .cnvs-hamburger-inner::after {
  width: var(--cnvs-hamburger-size);
  height: var(--cnvs-hamburger-width);
  background-color: var(--cnvs-contrast-900);
  position: absolute;
  transition-property: transform;
  transition-duration: 0.15s;
  transition-timing-function: ease;
}
.cnvs-hamburger .cnvs-hamburger-inner::before, .cnvs-hamburger .cnvs-hamburger-inner::after {
  content: "";
  display: block;
}
.cnvs-hamburger .cnvs-hamburger-inner::before {
  top: var(--cnvs-hamburger-offset);
  transition: top 0.075s 0.12s ease, opacity 0.075s ease;
}
.cnvs-hamburger .cnvs-hamburger-inner::after {
  bottom: var(--cnvs-hamburger-offset);
  transition: bottom 0.075s 0.12s ease, transform 0.075s cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.menu-container {
  display: none;
  list-style: none;
  margin: 0;
  width: 100%;
}

.menu-item {
  position: relative;
}
.menu-item:not(:first-child) {
  border-top: var(--cnvs-primary-menu-submenu-border);
}
.is-expanded-menu .menu-item:not(:first-child) {
  border-top: 0;
}
.menu-item:hover > .menu-link {
  color: var(--cnvs-primary-menu-hover-color);
}
.menu-item.current > .menu-link {
  color: var(--cnvs-primary-menu-active-color);
}

.menu-link {
  --cnvs-primary-menu-padding-y: 14px;
  --cnvs-primary-menu-padding-x: 5px;
  display: block;
  line-height: 22px;
  padding: var(--cnvs-primary-menu-padding-y) var(--cnvs-primary-menu-padding-x);
  color: var(--cnvs-primary-menu-color);
  font-weight: var(--cnvs-primary-menu-font-weight);
  font-size: var(--cnvs-primary-menu-font-size);
  font-family: var(--cnvs-primary-menu-font);
  text-transform: var(--cnvs-primary-menu-tt);
  letter-spacing: var(--cnvs-primary-menu-ls);
}
.is-expanded-menu .menu-link {
  --cnvs-primary-menu-padding-y: calc(calc(var(--cnvs-sticky-header-height) - 22px) * 0.5);
  --cnvs-primary-menu-padding-x: 15px;
  transition: margin 0.4s ease, padding 0.4s ease;
}
@media (prefers-reduced-motion: reduce) {
  .is-expanded-menu .menu-link {
    transition: none;
  }
}
.menu-link span {
  display: none;
}
.menu-link i {
  position: relative;
  font-size: var(--cnvs-primary-menu-icon-size);
  width: var(--cnvs-primary-menu-icon-size);
  text-align: center;
  margin-right: 0.625rem;
  vertical-align: top;
}

/* ----------------------------------------------------------------
  Mega Menu
-----------------------------------------------------------------*/

body:not(.is-expanded-menu) .primary-menu {
  max-width: 100%;
}
body:not(.is-expanded-menu) .primary-menu > .container {
  max-width: none;
  padding: 0;
}

/* Off Canvas Menu
-----------------------------------------------------------------*/

/* Off Canvas Menu
-----------------------------------------------------------------*/

.is-expanded-menu {
  /* ----------------------------------------------------------------
    Mega Menu
  -----------------------------------------------------------------*/
  /* Sub-Menu On-Click Dropdown */
  /* Primary Menu - Style 2
  -----------------------------------------------------------------*/
  /* Primary Menu - Style 3
  -----------------------------------------------------------------*/
  /* Primary Menu - Style 4
  -----------------------------------------------------------------*/
  /* Primary Menu - Style 5
  -----------------------------------------------------------------*/
  /* Primary Menu - Style 6
  -----------------------------------------------------------------*/
  /* Primary Menu - Sub Title
  -----------------------------------------------------------------*/
  /* ----------------------------------------------------------------
    Side Header
  -----------------------------------------------------------------*/
  /* Side Header - Push Header
  -----------------------------------------------------------------*/
  /* Side Header - Right Aligned
  -----------------------------------------------------------------*/
  /* Primary Menu - Overlay Menu
  -----------------------------------------------------------------*/
}
.is-expanded-menu .menu-container:not(.mobile-primary-menu) {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
.is-expanded-menu .full-header .primary-menu .menu-container {
  padding-right: 0.5rem;
  margin-right: 0.5rem;
  border-right: 1px solid var(--cnvs-header-border-color);
}
.is-expanded-menu .menu-container > .menu-item:not(:first-child) {
  margin-left: 2px;
}
/* ----------------------------------------------------------------
  Top Search
-----------------------------------------------------------------*/

/* Top Search Animation */

/* ----------------------------------------------------------------
  Top Cart
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
  Page Menu
-----------------------------------------------------------------*/

/* Page Menu - Dots Style
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
  One Page
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
  Side Push Panel
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------

  slider.scss

-----------------------------------------------------------------*/
/* ----------------------------------------------------------------
  Flex Slider
-----------------------------------------------------------------*/
:root,
.not-dark {
  --cnvs-slider-caption-font-color: var(--cnvs-contrast-800);
  --cnvs-slider-arrows-bg-color: rgba(0, 0, 0, 0.3);
  --cnvs-slider-arrows-bg-hover-color: rgba(0, 0, 0, 0.6);
  --cnvs-slider-arrow-color: var(--bs-gray-100);
  --cnvs-owl-dots-slider-color: #fff;
}

:root {
  --cnvs-fslider-dots-position-top: 14px;
  --cnvs-fslider-dots-position-right: 10px;
  --cnvs-fslider-dots-size: 0.625rem;
  --cnvs-fslider-dots-border-color: #fff;
  --cnvs-fslider-dots-border-radius: 50%;
  --cnvs-fslider-thumbs-gutters: 2px;
  --cnvs-fslider-thumbs-width: 100px;
  --cnvs-canvas-slider-dots-size: 0.625rem;
  --cnvs-slider-pagination-gutters: 4px;
  --cnvs-slider-pagination-rounded: 50%;
  --cnvs-swiper-dots-position-bottom: 20px;
  --cnvs-slider-caption-width: 550px;
  --cnvs-slider-caption-font-size: 1.375rem;
  --cnvs-slider-caption-font-weight: 300;
  --cnvs-slider-caption-transition: top 0.3s ease;
  --cnvs-slider-caption-p-size: 1.5rem;
  --cnvs-slider-caption-offset: 50px;
  --cnvs-slider-caption-bg-light: rgba(255, 255, 255, 0.8);
  --cnvs-slider-caption-bg-dark: rgba(0, 0, 0, 0.6);
  --cnvs-slider-caption-bg-radius: 2px;
  --cnvs-slider-caption-bg-padding: 5px 12px;
  --cnvs-slider-arrows-size: 52px;
  --cnvs-slider-arrows-sm-size: calc(var(--cnvs-slider-arrows-size) - 20px);
  --cnvs-slider-arrows-border-radius: 3px;
  --cnvs-slider-arrow-sm-offset: 20px;
  --cnvs-owl-dots-slider-position: top auto bottom 15px;
}

.fslider,
.fslider .flexslider,
.fslider .slider-wrap,
.fslider .slide,
.fslider .slide > a,
.fslider .slide > img,
.fslider .slide > a > img {
  position: relative;
  display: block;
  width: 100%;
  height: auto;
  overflow: hidden;
  -webkit-backface-visibility: hidden;
}

.fslider.h-100 .flexslider,
.fslider.h-100 .slider-wrap,
.fslider.h-100 .slide,
.fslider.h-100 .slide > a,
.fslider.h-100 .slide > a > img {
  height: 100% !important;
}
.fslider.h-100 .slide > a > img {
  object-fit: cover;
}

.fslider {
  min-height: 32px;
}


.flexslider a:active,
.flexslider a:focus {
  outline: none;
  border: none;
}

.slider-wrap {
  margin: 0;
  padding: 0;
  list-style: none;
  border: none;
}

.flexslider {
  position: relative;
  margin: 0;
  padding: 0;
}
.flexslider .slider-wrap > .slide {
  display: none;
  -webkit-backface-visibility: hidden;
}

.flexslider .slider-wrap img {
  width: 100%;
  display: block;
}

.slider-wrap::after {
  content: " ";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0;
}

* html .slider-wrap {
  height: 1%;
}

/* ----------------------------------------------------------------
  Slider
-----------------------------------------------------------------*/
/* Boxed Slider
-----------------------------------------------------------------*/

/* Swiper Slider
-----------------------------------------------------------------*/

/* Video Overlay
-----------------------------------------------------------------*/

/* Slider Caption
-----------------------------------------------------------------*/

/* Slider Arrows
-----------------------------------------------------------------*/

/* Slide Number
-----------------------------------------------------------------*/

/* Pagination
-----------------------------------------------------------------*/

/* Flex Slider - Navigation
-----------------------------------------------------------------*/

/* Flex Slider - Pagination & Thumbs
-----------------------------------------------------------------*/

/* Flex Slider: Pagination Positions
-----------------------------------------------------------------*/

/* Flex Slider: Thumbs
-----------------------------------------------------------------*/

/* FlexSlider: Thumbs - Flexible
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
  pagetitle.scss
-----------------------------------------------------------------*/
/* ----------------------------------------------------------------
  Page Title
-----------------------------------------------------------------*/
:root,
.not-dark {
  --cnvs-page-title-bg: var(--cnvs-contrast-bg-offset);
  --cnvs-page-title-color: var(--cnvs-contrast-900);
  --cnvs-page-title-border-color: rgba(var(--cnvs-contrast-rgb), 0.1);
}
/* ----------------------------------------------------------------

  content.scss

-----------------------------------------------------------------*/
/* ----------------------------------------------------------------
  Content
-----------------------------------------------------------------*/
#content {
  position: relative;
  background-color: var(--cnvs-body-bg);
}

.content-wrap {
  position: relative;
  padding: var(--cnvs-content-padding) 0;
  overflow: hidden;
}
.content-wrap .container {
  position: relative;
}
.content-wrap p {
  line-height: var(--cnvs-line-height-content);
}

.grid-container,
.grid-inner {
  position: relative;
  overflow: hidden;
  will-change: transform;
}

.grid-inner {
  width: 100%;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}

.grid-container {
  transition: height 0.4s ease;
}
@media (prefers-reduced-motion: reduce) {
  .grid-container {
    transition: none;
  }
}

/* ----------------------------------------------------------------

  portfolio.scss

-----------------------------------------------------------------*/
/* ----------------------------------------------------------------
  Portfolio
-----------------------------------------------------------------*/
:root,
.not-dark {
  --cnvs-grid-filter-border-color: rgba(var(--cnvs-contrast-rgb), 0.1);
  --cnvs-portfolio-meta-color: var(--cnvs-contrast-600);
  --cnvs-portfolio-meta-row-1-color: var(--cnvs-heading-color);
}

/* Grid - Filter
-----------------------------------------------------------------*/

/* Portfolio - Shuffle Icon
-----------------------------------------------------------------*/

/* Portfolio - Items
-----------------------------------------------------------------*/
.portfolio,
[class*=portfolio-] {
  --cnvs-portfolio-desc-padding-x: 5px;
  --cnvs-portfolio-desc-padding-y:	20px;
  --cnvs-portfolio-desc-title-size: 1.25rem;
  --cnvs-portfolio-modal-padding: 40px;
  --cnvs-portfolio-ajax-height: 1500px;
  --cnvs-portfolio-meta-font-size: 0.875rem;
  --cnvs-portfolio-meta-color: var(--cnvs-contrast-600);
  --cnvs-portfolio-meta-row-1: 150px;
  --cnvs-portfolio-meta-row-1-color: var(--cnvs-heading-color);
  --cnvs-portfolio-meta-icon: 14px;
  --cnvs-portfolio-navigation-size: 24px;
}

.portfolio {
  position: relative;
  transition: height 0.4s linear;
}
.portfolio-item {
  position: relative;
}
.portfolio-item .portfolio-image {
  position: relative;
  overflow: hidden;
}
.portfolio-item .portfolio-image,
.portfolio-item .portfolio-image > a,
.portfolio-item .portfolio-image img {
  display: block;
  width: 100%;
  height: auto;
}
@media (prefers-reduced-motion: reduce) {
  .portfolio {
    transition: none;
  }
}
/* Portfolio - Item Title
-----------------------------------------------------------------*/
.portfolio-desc {
  position: relative;
  z-index: 6;
  padding: var(--cnvs-portfolio-desc-padding-y) var(--cnvs-portfolio-desc-padding-x);
}
.portfolio-desc h3, .portfolio-desc .h3 {
  margin: 0;
  padding: 0;
  font-size: var(--cnvs-portfolio-desc-title-size);
}
.portfolio-desc h3 a, .portfolio-desc .h3 a {
  color: var(--cnvs-contrast-900);
}
.portfolio-desc h3 a:hover, .portfolio-desc .h3 a:hover {
  color: var(--cnvs-themecolor);
}
.portfolio-desc span {
  display: block;
}
.portfolio-desc span,
.portfolio-desc span a {
  color: var(--cnvs-contrast-600);
}
.portfolio-desc span a:hover {
  color: var(--cnvs-contrast-900);
}
.portfolio.g-0 .portfolio-desc {
  --cnvs-portfolio-desc-padding-x: 15px;
}

/* Portfolio - Parallax
-----------------------------------------------------------------*/

/* Portfolio Single - Image
-----------------------------------------------------------------*/

/* Masonry Thumbs
-----------------------------------------------------------------*/

/* Portfolio Single - Content
-----------------------------------------------------------------*/

/* Portfolio Single - Meta
-----------------------------------------------------------------*/

/* Portfolio Single Navigation
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------

  blog.scss

-----------------------------------------------------------------*/
/* ----------------------------------------------------------------
  Blog
-----------------------------------------------------------------*/
:root,
.not-dark {
  --cnvs-post-title-font-color: var(--cnvs-heading-color);
  --cnvs-post-meta-color: var(--cnvs-contrast-600);
  --cnvs-post-entry-link-bg: var(--cnvs-contrast-100);
  --cnvs-post-entry-link-color: var(--cnvs-heading-color);
  --cnvs-post-timeline-border-color: var(--cnvs-contrast-400);
  --cnvs-post-timeline-date-border-color: var(--cnvs-contrast-400);
}


.entry,
[class*=entry-] {
  --cnvs-post-item-margin: 50px;
  --cnvs-post-image-size: 100%;
  --cnvs-post-image-rounded: 3px;
  --cnvs-post-image-mb: 1.5rem;
  --cnvs-post-sm-image: 64px;
  --cnvs-post-title-font-size: 1.75rem;
  --cnvs-post-title-font-weight: 600;
  --cnvs-post-title-font-spacing: 0;
  --cnvs-post-title-text-transform: none;
  --cnvs-post-title-font-color: var(--cnvs-heading-color);
  --cnvs-post-meta-seperator: ⁞;
  --cnvs-post-meta-seperator-width: 0.25rem;
  --cnvs-post-meta-margin: 1rem;
  --cnvs-post-meta-color: var(--cnvs-contrast-600);
  --cnvs-post-meta-fontsize: 90%;
  --cnvs-post-meta-iconsize: 1rem;
  --cnvs-post-content-margin: 2rem;
  --cnvs-post-entry-link-bg: var(--cnvs-contrast-100);
  --cnvs-post-entry-link-padding: 2rem 0;
  --cnvs-post-entry-link-color: var(--cnvs-heading-color);
  --cnvs-post-entry-link-font-family: var(--cnvs-primary-font);
  --cnvs-post-entry-link-text-transform: none;
  --cnvs-post-entry-link-letter-spacing: 0;
  --cnvs-post-entry-link-font-size: 1.5rem;
  --cnvs-post-entry-link-font-weight: 600;
  --cnvs-post-entry-link-border-radius: 3px;
  position: relative;
}

.entry {
  margin-bottom: var(--cnvs-post-item-margin);
}
.posts-md .entry {
  margin-bottom: 0;
}
.entry::after {
  content: "";
  position: relative;
  height: 2px;
  margin-top: var(--cnvs-post-item-margin);
  background-color: var(--cnvs-contrast-100);
}
.entry-image {
  margin-bottom: var(--cnvs-post-image-mb);
}

.posts-md .entry-image {
  margin-bottom: 0;
}

.entry-image,
.entry-image > a,
.entry-image .slide a,
.entry-image img {
  display: block;
  position: relative;
  width: var(--cnvs-post-image-size);
  height: auto;
}
.entry-image video {
  display: block;
  width: 100%;
}
.entry-image img {
  border-radius: var(--cnvs-post-image-rounded);
}

.posts-md .entry-image + .entry-title {
  margin-top: 0.875rem;
}

.entry-title h2, .entry-title .h2,
.entry-title h3,
.entry-title .h3,
.entry-title h4,
.entry-title .h4 {
  margin: 0;
  font-size: var(--cnvs-post-title-font-size);
  font-weight: var(--cnvs-post-title-font-weight);
  text-transform: var(--cnvs-post-title-text-transform);
  letter-spacing: var(--cnvs-post-title-font-spacing);
}
.entry-title h2 a, .entry-title .h2 a,
.entry-title h3 a,
.entry-title .h3 a,
.entry-title h4 a,
.entry-title .h4 a {
  color: var(--cnvs-post-title-font-color);
}
.entry-title h2 a:hover, .entry-title .h2 a:hover,
.entry-title h3 a:hover,
.entry-title .h3 a:hover,
.entry-title h4 a:hover,
.entry-title .h4 a:hover {
  color: var(--cnvs-themecolor);
}
.entry-title h4, .entry-title .h4 {
  --cnvs-post-title-font-size: 0.875rem;
  letter-spacing: 0;
}

.entry-title h4,
.entry-title .h4 {
  text-transform: none;
}

.entry-content {
  position: relative;
  margin-top: var(--cnvs-post-content-margin);
}
.posts-md .entry-content {
  margin-top: calc(var(--cnvs-post-content-margin) / 1.5);
}

/* Blog - Grid
-----------------------------------------------------------------*/

/* Blog - Timeline
-----------------------------------------------------------------*/

@media (min-width: 992px) {
  /* Blog - Timeline - Sidebar
  -----------------------------------------------------------------*/
}
.more-link {
  display: inline-block;
  border-bottom: 1px solid var(--cnvs-themecolor);
  padding: 0 2px;
  font-family: var(--cnvs-secondary-font);
  font-style: italic;
}
.more-link:hover {
  border-bottom-color: var(--cnvs-contrast-700);
}

/* ----------------------------------------------------------------
  Comments List
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
  Comment Form
-----------------------------------------------------------------*/

/* Post Elements
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------

  shop.scss

-----------------------------------------------------------------*/
/* ----------------------------------------------------------------
  Shop
-----------------------------------------------------------------*/
:root,
.not-dark {
  --cnvs-cart-quantity-bg: var(--cnvs-contrast-200);
  --cnvs-cart-quantity-color: var(--cnvs-contrast-800);
  --cnvs-cart-quantity-color-hover: var(--cnvs-cart-quantity-color);
  --cnvs-cart-quantity-border-color: rgba(var(--cnvs-contrast-rgb), 0.1);
  --cnvs-cart-quantity-bg-hover: var(--cnvs-contrast-300);
}

/* Shop - Single
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
  Cart
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------

  event.scss

-----------------------------------------------------------------*/
/* ----------------------------------------------------------------
  Events
-----------------------------------------------------------------*/

/*-----------------------------------------------------------------------------------
  shortcodes
-----------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------

  Shortcodes: countdown.scss

-----------------------------------------------------------------------------------*/
/* ----------------------------------------------------------------

  Countdown

-----------------------------------------------------------------*/

/* Countdown - Coming Soon
-----------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------

  Shortcodes: buttons.scss

-----------------------------------------------------------------------------------*/
/* ----------------------------------------------------------------
  Buttons
-----------------------------------------------------------------*/
.button {
  --cnvs-btn-padding-x: 1.375rem;
  --cnvs-btn-padding-y: 0.5rem;
  --cnvs-btn-fontsize: 1rem;
  --cnvs-btn-color: var(--cnvs-themecolor);
  --cnvs-btn-color-dark: #333;
  --cnvs-btn-color-light: #e9ecef;
  --cnvs-btn-color-hover: var(--cnvs-btn-color-dark);
  --cnvs-btn-lineheight: calc(var(--cnvs-btn-fontsize) * 1.6);
  --cnvs-btn-border-width: 1px;
  display: inline-block;
  position: relative;
  cursor: pointer;
  outline: none;
  white-space: nowrap;
  margin: 5px;
  padding: var(--cnvs-btn-padding-y) var(--cnvs-btn-padding-x);
  font-size: var(--cnvs-btn-fontsize);
  line-height: var(--cnvs-btn-lineheight);
  text-align: center;
  background-color: var(--cnvs-btn-color);
  color: #fff;
  font-weight: 500;
  border: var(--cnvs-btn-border-width) solid transparent;
  transition: all 0.2s ease-in-out;
  /* Buttons - Border
  -----------------------------------------------------------------*/
  /* Buttons - 3D
  -----------------------------------------------------------------*/
  /* Buttons - Icon Reveal
  -----------------------------------------------------------------*/
}
.button i {
  position: relative;
  margin-right: 10px;
  width: 1rem;
  text-align: center;
}
@media (prefers-reduced-motion: reduce) {
  .button {
    transition: none;
  }
}
.button.button-light {
  --cnvs-btn-color: var(--cnvs-btn-color-light);
  color: var(--cnvs-btn-color-dark);
}
.button:hover {
  background-color: var(--cnvs-btn-color-dark);
  color: #fff;
}
.button.button-large {
  --cnvs-btn-padding-x: 1.625rem;
  --cnvs-btn-padding-y: 0.5rem;
  --cnvs-btn-fontsize: 1.125rem;
}
.button.button-border {
  --cnvs-btn-border-color: var(--cnvs-btn-color-dark);
  border: var(--cnvs-btn-border-width) solid var(--cnvs-btn-border-color);
  background: transparent;
  color: var(--cnvs-btn-border-color);
}
.button.button-border:not(.button-fill):hover {
  background-color: var(--cnvs-btn-color);
  color: #fff;
  border-color: transparent !important;
}
.button.button-border.button-light {
  --cnvs-btn-border-color: #FFF;
}
.button.button-border.button-light:hover {
  background-color: #fff;
  color: var(--cnvs-btn-color-dark);
}

/* Buttons - Promo 100% Width
-----------------------------------------------------------------*/

/* Buttons - Circle
-----------------------------------------------------------------*/
.button.button-circle {
  border-radius: 50rem;
}

/* Buttons - Flat
-----------------------------------------------------------------*/

/* Buttons - Action
-----------------------------------------------------------------*/

/* Buttons - Fill Effect
-----------------------------------------------------------------*/

/* Buttons - Fill Effect
-----------------------------------------------------------------*/

/* Buttons - Colors
-----------------------------------------------------------------*/

.button[class*=gradient-] {
  border: 0;
}

/* Buttons - No Hover
-----------------------------------------------------------------*/

/* Buttons - States
-----------------------------------------------------------------*/
 .button:disabled {
  opacity: 0.65 !important;
  pointer-events: none !important;
}

/*-----------------------------------------------------------------------------------

  Shortcodes: promo.scss

-----------------------------------------------------------------------------------*/
/* ----------------------------------------------------------------
  Promo Boxes
-----------------------------------------------------------------*/
.promo {
  --cnvs-promo-span-font-size: 1.125rem;
  --cnvs-promo-uppercase-font-size: 1.25rem;
  --cnvs-promo-uppercase-span-font-size: 1rem;
  --cnvs-promo-border: 1px solid var(--cnvs-contrast-200);
  --cnvs-promo-light: rgba(var(--cnvs-contrast-rgb), 0.05);
  --cnvs-promo-light-text-color: var(--cnvs-heading-color);
  --cnvs-promo-dark: #343a40;
  --cnvs-promo-dark-text-color: #fff;
  --cnvs-promo-parallax-padding:	5rem;
  position: relative;
  /* Promo - Light
  -----------------------------------------------------------------*/
  /* Promo - Dark
  -----------------------------------------------------------------*/
  /* Promo - 100% Full Width
  -----------------------------------------------------------------*/
  /* Promo - Parallax
  -----------------------------------------------------------------*/
  /* Promo - Mini
  -----------------------------------------------------------------*/
}
.promo h3, .promo .h3 {
  font-weight: bold;
  margin-bottom: 0;
}
.promo h3 + span, .promo .h3 + span {
  display: block;
  color: var(--cnvs-promo-light-text-color);
  font-weight: 300;
  font-size: var(--cnvs-promo-span-font-size);
  margin-top: 6px;
}
.promo.parallax {
  padding: var(--cnvs-promo-parallax-padding) 0 !important;
}

/*-----------------------------------------------------------------------------------

  Shortcodes: feature-box.scss

-----------------------------------------------------------------------------------*/
/* ----------------------------------------------------------------
  Featured Boxes
-----------------------------------------------------------------*/
.feature-box {
  --cnvs-featured-box-icon: 4rem;
  --cnvs-featured-box-padding-x: 0.75rem;
  --cnvs-featured-box-icon-size: 1.75rem;
  --cnvs-featured-box-font-size: 1.125rem;
  --cnvs-featured-box-font-color: var(--cnvs-heading-color);
  --cnvs-featured-box-font-weight: 500;
  --cnvs-featured-box-font-tt: none;
  --cnvs-featured-box-icon-sm: calc(4rem * 0.5);
  --cnvs-featured-box-padding-x-sm: calc(0.75rem / 1.5);
  --cnvs-featured-box-icon-size-sm: calc(1.75rem / 1.75);
  --cnvs-featured-box-icon-lg: calc(4rem * 1.5);
  --cnvs-featured-box-icon-size-lg: calc(1.75rem * 1.4285714286);
  --cnvs-featured-box-icon-xl: calc(4rem * 2);
  --cnvs-featured-box-icon-size-xl: calc(1.75rem * 2.5714285714);
  --cnvs-featured-box-outline-border: 1px;
  --cnvs-featured-box-outline-padding: 0.25rem;
  --cnvs-featured-box-rounded:	3px;
  --cnvs-featured-box-bg-light:	var(--cnvs-contrast-200);
  --cnvs-featured-box-bg-dark:	#343a40;
  --cnvs-featured-box-plain-font-size: 3rem;
  --cnvs-featured-box-plain-icon-size: 3rem;
  position: relative;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-left: calc(-1 * var(--cnvs-featured-box-padding-x));
  margin-right: calc(-1 * var(--cnvs-featured-box-padding-x));
}
.feature-box:first-child {
  margin-top: 0;
}
.fbox-icon {
  width: calc(var(--cnvs-featured-box-icon) + var(--cnvs-featured-box-padding-x) * 2);
  height: var(--cnvs-featured-box-icon);
  padding: 0 var(--cnvs-featured-box-padding-x);
}
.fbox-icon a,
.fbox-icon i,
.fbox-icon img {
  display: block;
  position: relative;
  width: 100%;
  height: 100%;
  color: #fff;
}
.fbox-icon i,
.fbox-icon img {
  border-radius: 50%;
  background-color: var(--cnvs-themecolor);
}
.fbox-icon i {
  font-style: normal;
  font-size: var(--cnvs-featured-box-icon-size);
  line-height: var(--cnvs-featured-box-icon);
  text-align: center;
}
.fbox-content {
  -ms-flex-preferred-size: 0;
  flex-basis: 0;
  -ms-flex-positive: 1;
  flex-grow: 1;
  min-width: 0;
  max-width: 100%;
  padding: 0 var(--cnvs-featured-box-padding-x);
}
.fbox-content h3, .fbox-content .h3 {
  font-size: var(--cnvs-featured-box-font-size);
  font-weight: var(--cnvs-featured-box-font-weight);
  font-family: var(--cnvs-primary-font);
  text-transform: var(--cnvs-featured-box-font-tt);
  margin-bottom: 0;
  color: var(--cnvs-featured-box-font-color);
}
.fbox-content p {
  margin-top: 0.5rem;
  margin-bottom: 0px;
  color: var(--cnvs-contrast-600);
}
.fbox-content .before-heading {
  font-size: calc(var(--cnvs-featured-box-font-size) / 1.142);
}
.fbox-content-sm h3, .fbox-content-sm .h3,
.fbox-content-sm p {
  font-size: calc(var(--cnvs-featured-box-font-size) / 1.142);
}
.fbox-content-sm .before-heading {
  font-size: calc(var(--cnvs-featured-box-font-size) / 1.333);
}
.fbox-plain {
  /* Feature Box - Icon Plain Sizes
  -----------------------------------------------------------------*/
}
.fbox-plain .fbox-icon {
  border: none !important;
  height: auto !important;
}
.fbox-plain .fbox-icon i,
.fbox-plain .fbox-icon img {
  border: none;
  background-color: transparent;
  color: var(--cnvs-themecolor);
  border-radius: 0;
}
.fbox-plain .fbox-icon i {
  font-size: var(--cnvs-featured-box-plain-font-size);
  line-height: 1;
}
.fbox-plain .fbox-icon img {
  height: auto;
}
.fbox-plain.fbox-dark .fbox-icon i,
.fbox-plain.fbox-dark .fbox-icon img {
  color: var(--cnvs-contrast-700);
}
.fbox-center {
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-align: center;
  align-items: center;
  text-align: center;
}
.fbox-center .fbox-icon {
  margin-bottom: 1.5rem;
}
.fbox-content h3 + .fbox-icon, .fbox-content .h3 + .fbox-icon {
  margin-top: 1.5rem;
  margin-bottom: 0 !important;
}

/* Animated Icon Hovers
-----------------------------------------------------------------*/

/* Icon Effects - Bordered
-----------------------------------------------------------------*/

/* Media Featured Box
-----------------------------------------------------------------*/

/*-----------------------------------------------------------------------------------

  Shortcodes: process-steps.scss

-----------------------------------------------------------------------------------*/
/* ----------------------------------------------------------------
  Process Steps
-----------------------------------------------------------------*/

/*-----------------------------------------------------------------------------------

  Shortcodes: alerts.scss

-----------------------------------------------------------------------------------*/
/* ----------------------------------------------------------------
  Alerts
-----------------------------------------------------------------*/

.alert i {
  position: relative;
  top: 1px;
  font-size: 0.875rem;
  width: 0.875rem;
  text-align: center;
  margin-right: 5px;
}

/*-----------------------------------------------------------------------------------

  Shortcodes: styled-icons.scss

-----------------------------------------------------------------------------------*/
/* ----------------------------------------------------------------
  Styled Icons
-----------------------------------------------------------------*/


.social-icon {
  --cnvs-i-color: var(--cnvs-white);
  text-align: center !important;
  font-size: var(--cnvs-i-fontsize);
  color: var(--cnvs-i-color);
  cursor: pointer;
  font-style: normal;
  transition: all 0.3s ease;
}
@media (prefers-reduced-motion: reduce) {
  
  .social-icon {
    transition: none;
  }
}

/* Icon Size - Small
-----------------------------------------------------------------*/

/* Icon Size - Small
-----------------------------------------------------------------*/

/* Icon Size - Large
-----------------------------------------------------------------*/

/* Icon Size - Extra Large
-----------------------------------------------------------------*/

/* Icon Size - Extra Extra Large
-----------------------------------------------------------------*/

/* Icon Lists
-----------------------------------------------------------------*/

/*-----------------------------------------------------------------------------------

  Shortcodes: social-icons.scss

-----------------------------------------------------------------------------------*/
/* ----------------------------------------------------------------
  Social Icons
-----------------------------------------------------------------*/
.social-icon {
  --cnvs-socialicon-size: 2.5rem;
  --cnvs-socialicon-gap: 5px;
  --cnvs-socialicon-fontsize: calc( var(--cnvs-socialicon-size) / 2.5);
  --cnvs-socialicon-border: 1px;
  --cnvs-socialicon-border-color: var(--cnvs-contrast-600);
  --cnvs-socialicon-lineheight: calc(var(--cnvs-socialicon-size) - calc(var(--cnvs-socialicon-border) * 2));
  --cnvs-socialicon-rounded: 0.375rem;
  --cnvs-socialicon-color: var(--bs-contrast-900);
  float: left;
  display: block;
  margin: 0 var(--cnvs-socialicon-gap) var(--cnvs-socialicon-gap) 0;
  width: var(--cnvs-socialicon-size);
  height: var(--cnvs-socialicon-size);
  font-size: var(--cnvs-socialicon-fontsize);
  line-height: var(--cnvs-socialicon-lineheight) !important;
  color: var(--cnvs-socialicon-color);
  text-shadow: none;
  border: var(--cnvs-socialicon-border) solid var(--cnvs-socialicon-border-color);
  border-radius: var(--cnvs-socialicon-rounded);
  overflow: hidden;
  /* Social Icons - Large
  -----------------------------------------------------------------*/
  /* Social Icons - Small
  -----------------------------------------------------------------*/
}
[class*=-flex] > .social-icon, [class*=row] > .social-icon {
  float: none;
  margin-right: var(--cnvs-socialicon-gap-x);
  margin-bottom: var(--cnvs-socialicon-gap-y);
  flex: 0 0 auto;
}
.social-icon.si-small {
  --cnvs-socialicon-size: 2rem;
  --cnvs-socialicon-fontsize: 0.875rem;
}
.social-icon i {
  display: block;
  position: relative;
  line-height: inherit;
  transition: all 0.3s ease;
}
@media (prefers-reduced-motion: reduce) {
  .social-icon i {
    transition: none;
  }
}
.social-icon i:last-child {
  color: #FFF;
}
.social-icon:hover i:first-child {
  margin-top: calc(var(--cnvs-socialicon-lineheight) * -1);
}
.social-icon:hover {
  color: var(--cnvs-socialicon-color);
  border-color: transparent;
}
.social-icon[class*=" bg-"] {
  border-color: transparent;
}

/* Social Icons - Group
-----------------------------------------------------------------*/
[class*=-flex],
[class*=row] {
  --cnvs-socialicon-gap: 5px;
  --cnvs-socialicon-gap-x: var(--cnvs-socialicon-gap);
  --cnvs-socialicon-gap-y: 0px;
}

/* Social Icons - Sticky
-----------------------------------------------------------------*/

/* Social Icons - colors
-----------------------------------------------------------------*/

.h-bg-facebook:hover {
  background-color: var(--cnvs-color-facebook) !important;
}


.h-bg-whatsapp:hover {
  background-color: var(--cnvs-color-whatsapp) !important;
}


.h-bg-github:hover {
  background-color: var(--cnvs-color-github) !important;
}


.h-bg-instagram:hover {
  background-color: var(--cnvs-color-instagram) !important;
}

/*-----------------------------------------------------------------------------------

  Shortcodes: toggles-accordions.scss

-----------------------------------------------------------------------------------*/
/* ----------------------------------------------------------------
  Toggle
-----------------------------------------------------------------*/

/* Toggle - with Title Background
-----------------------------------------------------------------*/

/* Toggle - Bordered
-----------------------------------------------------------------*/

/* Toggle - FAQs
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
  Accordions
-----------------------------------------------------------------*/

/* Accordion - with Title Background
-----------------------------------------------------------------*/

/* Accordion - Bordered
-----------------------------------------------------------------*/

/* Accordion - Large
-----------------------------------------------------------------*/

/*-----------------------------------------------------------------------------------

  Shortcodes: tabs.scss

-----------------------------------------------------------------------------------*/
/* ----------------------------------------------------------------
  Tabs
-----------------------------------------------------------------*/

/* Bootstrap Tabs */

/* Tab Icons */

/* Tab Bordered */
/*-----------------------------------------------------------------------------------

  Shortcodes: faqs.scss

-----------------------------------------------------------------------------------*/
/* ----------------------------------------------------------------
  FAQ List
-----------------------------------------------------------------*/

/*-----------------------------------------------------------------------------------

  Shortcodes: clients.scss

-----------------------------------------------------------------------------------*/

/* ----------------------------------------------------------------
  Clients
-----------------------------------------------------------------*/
/* ----------------------------------------------------------------
  Testimonials
-----------------------------------------------------------------*/
/* Testimonials - Grid
-----------------------------------------------------------------*/

/* Testimonial - Pagination
-----------------------------------------------------------------*/

/* Testimonial - Full Scroller
-----------------------------------------------------------------*/

/*-----------------------------------------------------------------------------------

  Shortcodes: team.scss

-----------------------------------------------------------------------------------*/
/* ----------------------------------------------------------------
  Team
-----------------------------------------------------------------*/
.team {
  --cnvs-team-base-color: var(--cnvs-heading-color);
  --cnvs-team-desc-align: center;
  --cnvs-team-desc-background: var(--cnvs-contrast-0);
  --cnvs-team-desc-padding: 10px 0 30px;
  --cnvs-team-title-font-size: 1.25rem;
  --cnvs-team-title-designation-font-size: 1rem;
  --cnvs-team-title-designation-font-color: var(--cnvs-themecolor);
  --cnvs-team-title-designation-font-family: var(--cnvs-secondary-font);
  --cnvs-team-title-designation-font-weight: 400;
  --cnvs-team-title-designation-font-style: italic;
  --cnvs-team-title-designation-icon-width: 32px;
  --cnvs-team-title-designation-icon-size: 14px;
  --cnvs-team-overlay-color: #fff;
  --cnvs-team-overlay-opacity: 0.75;
  --cnvs-team-list-image-width: 250px;
  --cnvs-team-content-font-size: ;
  --cnvs-team-content-font-color: var(--cnvs-contrast-600);
  position: relative;
  /* Team Center
  -----------------------------------------------------------------*/
  /* Team List
  -----------------------------------------------------------------*/
}
.team-image {
  position: relative;
}
.team-image > a,
.team-image img {
  display: inline;
  width: 100%;
}
.team-desc {
  text-align: var(--cnvs-team-desc-align);
}
.team-desc-bg {
  background-color: var(--cnvs-team-desc-background);
  padding: var(--cnvs-team-desc-padding);
}
.team-title {
  position: relative;
  padding-top: 20px;
}
.team-title h4, .team-title .h4 {
  display: block;
  margin-bottom: 0;
  font-size: var(--cnvs-team-title-font-size);
  text-transform: uppercase;
  letter-spacing: 1px;
  font-weight: 700;
}
.team-title span {
  display: block;
  color: var(--cnvs-team-title-designation-font-color);
  font-weight: var(--cnvs-team-title-designation-font-weight);
  font-family: var(--cnvs-team-title-designation-font-family);
  font-style: var(--cnvs-team-title-designation-font-style);
  font-size: var(--cnvs-team-title-designation-font-size);
  margin-top: 5px;
}
.team.center .team-title::after {
  left: 50%;
  margin-left: -40px;
}

.team .team-desc > .social-icon {
  margin-top: 20px;
}
.team:not(.team-list) .social-icon {
  display: inline-block !important;
  vertical-align: middle;
  float: none;
  margin-left: 4px;
  margin-right: 4px;
}

/*-----------------------------------------------------------------------------------

  Shortcodes: pricing.scss

-----------------------------------------------------------------------------------*/
/* ----------------------------------------------------------------
  Pricing Boxes
-----------------------------------------------------------------*/

/*-----------------------------------------------------------------------------------

  Shortcodes: counter-skills.scss

-----------------------------------------------------------------------------------*/
/* ----------------------------------------------------------------
  Counter
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
  Animated Rounded Skills
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
  Skills Bar
-----------------------------------------------------------------*/
/* ----------------------------------------------------------------
  Skills Bar
-----------------------------------------------------------------*/

/*-----------------------------------------------------------------------------------

  Shortcodes: carousels.scss

-----------------------------------------------------------------------------------*/
/* ----------------------------------------------------------------
  Owl Carousel CSS
-----------------------------------------------------------------*/
.owl-carousel {
  --cnvs-carousel-animation-transition: 1000ms;
  --cnvs-owl-video-play-icon-size:	64px;
  --cnvs-owl-video-play-icon: url("images/icons/play.png");
  --cnvs-owl-video-play-icon-hover: scale(1.3);
  --cnvs-owl-autoHeight-transition: 500ms ease-in-out;
  --cnvs-owl-nav-hidden: true;
  --cnvs-owl-nav-border: 1px solid rgba(var(--cnvs-contrast-rgb), 0.2);
  --cnvs-owl-nav-background: var(--cnvs-body-bg);
  --cnvs-owl-nav-color: var(--cnvs-contrast-600);
  --cnvs-owl-nav-border-radius: 50%;
  --cnvs-owl-full-nav-size: 28px;
  --cnvs-owl-full-nav-border-radius: 3px;
  --cnvs-owl-full-nav-bgcolor: rgba(var(--cnvs-contrast-rgb), 0.4);
  --cnvs-owl-full-nav-color: var(--cnvs-contrast-100);
  --cnvs-owl-full-nav-hover-bgcolor: var(--cnvs-themecolor);
  --cnvs-owl-full-nav-hover-color: var(--cnvs-body-bg);
  --cnvs-owl-dots-background: var(--cnvs-themecolor);
  --cnvs-owl-dots-opacity: 0.5;
  --cnvs-owl-nav-sizes: 36px;
  --cnvs-owl-dots-gutters: 4px;
  --cnvs-owl-dots-sizes: 8px;
  --cnvs-owl-nav-bg: var(--cnvs-themecolor);
  --cnvs-owl-nav-margin: calc(var(--cnvs-owl-nav-sizes) / -2);
  --cnvs-owl-nav-with-dots: calc( var(--cnvs-owl-nav-margin) - calc( calc( 30px + var(--cnvs-owl-dots-sizes) ) / 2 ) );
}

@-webkit-keyframes fadeout {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes fadeout {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

.owl-carousel {
  direction: ltr;
  display: none;
  -webkit-tap-highlight-color: transparent;
  position: relative;
  z-index: 1;
  width: 100%;
  touch-action: manipulation;
}
.owl-carousel .animated {
  -webkit-animation-duration: var(--cnvs-carousel-animation-transition);
  animation-duration: var(--cnvs-carousel-animation-transition);
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

/* Owl Carousel - Controls
-----------------------------------------------------------------*/

/* Owl Carousel - Controls - Arrows
-----------------------------------------------------------------*/

/* Owl Carousel - Controls - Dots
-----------------------------------------------------------------*/

/* Owl Carousel - Controls - Dots - Positions
-----------------------------------------------------------------*/

/* Owl Carousel - Controls - Dots - Sizes
-----------------------------------------------------------------*/

/* Owl Carousel - Controls - Dots - Border
-----------------------------------------------------------------*/

/* Owl Carousel - Controls - Dots - square
-----------------------------------------------------------------*/

/* Owl Carousel - Controls - Dots - square
-----------------------------------------------------------------*/

/* Owl Carousel - Controls - Dots - Dashed
-----------------------------------------------------------------*/

/* Owl Carousel - Controls - Dots - Numbers
-----------------------------------------------------------------*/

/* Owl Carousel - Controls - Arrows - Sizes
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------

  Flip Cards

-----------------------------------------------------------------*/
/* ----------------------------------------------------------------
  Flip Cards
-----------------------------------------------------------------*/

/*-----------------------------------------------------------------------------------

  Shortcodes: headings.scss

-----------------------------------------------------------------------------------*/
/* Titular
-----------------------------------------------------------------*/

/* Block Titles
-----------------------------------------------------------------*/

/* Heading Block - with Subtitle
-----------------------------------------------------------------*/

/* Emphasis Title
-----------------------------------------------------------------*/

/* Justify Border Title
-----------------------------------------------------------------*/

/* Fancy Title - Center Align
-----------------------------------------------------------------*/

/* Fancy Title - Right Align
-----------------------------------------------------------------*/

/* Fancy Title - Bottom Short Border
-----------------------------------------------------------------*/

/* Sub Heading
-----------------------------------------------------------------*/
.before-heading {
  --cnvs-before-heading-font: normal 400 1.0625rem var(--cnvs-secondary-font);
  display: block;
  margin: 0 0 0.25rem;
  color: var(--cnvs-contrast-600);
}

/*-----------------------------------------------------------------------------------

  Shortcodes: dividers.scss

-----------------------------------------------------------------------------------*/
/* ----------------------------------------------------------------
  Divider
-----------------------------------------------------------------*/

/*-----------------------------------------------------------------------------------

  Shortcodes: misc.scss

-----------------------------------------------------------------------------------*/
/* Infinity Scroll - Message Style
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
  Quotes & Blockquotes
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
  Cascading Images
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
  Dropcaps & Highlights
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
  Text Rotater
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
  Overlays
-----------------------------------------------------------------*/
.bg-overlay,
.bg-overlay-bg,
.bg-overlay-content {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  overflow: hidden;
}

.bg-overlay {
  z-index: 5;
}
.bg-overlay [data-hover-animate]:not(.animated) {
  opacity: 0;
}
.bg-overlay-content {
  display: -ms-flexbox;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1;
  padding: 20px;
}
.bg-overlay-bg {
  background-color: rgba(var(--cnvs-invert-contrast-rgb), 0.5);
}

/* ----------------------------------------------------------------
  Google Maps
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
  Google Custom Search
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
  Magazine Specific Classes
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
  Go To Top
-----------------------------------------------------------------*/
#gotoTop {
  --cnvs-gotoTop-size: 2.5rem;
  --cnvs-gotoTop-bg: rgba(0, 0, 0, 0.3);
  --cnvs-gotoTop-icon-size: 1.5rem;
  --cnvs-gotoTop-icon-color: #fff;
  --cnvs-gotoTop-position-boxed-right: 30px;
  --cnvs-gotoTop-position-boxed-bottom: 50px;
  --cnvs-gotoTop-position-botom: 30px;
  --cnvs-gotoTop-border-radius: 2px;
  --cnvs-gotoTop-hover-color: var(--cnvs-themecolor);
  z-index: -999;
  position: fixed;
  width: var(--cnvs-gotoTop-size);
  height: var(--cnvs-gotoTop-size);
  line-height: var(--cnvs-gotoTop-size);
  background-color: var(--cnvs-gotoTop-bg);
  font-size: var(--cnvs-gotoTop-icon-size);
  text-align: center;
  color: var(--cnvs-gotoTop-icon-color);
  top: auto;
  left: auto;
  right: var(--cnvs-gotoTop-position-boxed-right);
  bottom: var(--cnvs-gotoTop-position-boxed-bottom);
  cursor: pointer;
  border-radius: var(--cnvs-gotoTop-border-radius);
  opacity: 0;
  transition: background-color 0.2s linear, opacity 0.4s ease;
}
@media (prefers-reduced-motion: reduce) {
  #gotoTop {
    transition: none;
  }
}
.gototop-active #gotoTop {
  z-index: 599;
  opacity: 1;
}
.stretched #gotoTop {
  right: var(--cnvs-gotoTop-position-boxed-right);
  bottom: var(--cnvs-gotoTop-position-boxed-bottom);
}
#gotoTop:hover {
  background-color: var(--cnvs-gotoTop-hover-color);
}

/* ----------------------------------------------------------------
  Read More
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
  GDPR Settings
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
  Error 404
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
  Landing Pages
-----------------------------------------------------------------*/

/* Navigation Tree
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
  Wedding
-----------------------------------------------------------------*/

/* --------------------------------------------------------------
  SWITCH
--------------------------------------------------------------  */

/* --------------------------------------------------------------
  SWITCH 1 - ROUND
----------------------------------------------------------------- */

/* -----------------------------------------------------------
  SWITCH 2 - ROUND FLAT
-------------------------------------------------------------- */

/* -----------------------------------------------------------
  Tour Driver
-------------------------------------------------------------- */
@-webkit-keyframes pulsate {
  0% {
    opacity: 0;
    transform: scale(1);
  }
  50% {
    opacity: 0.3;
  }
  100% {
    opacity: 0;
    transform: scale(2.5);
  }
}
@keyframes pulsate {
  0% {
    opacity: 0;
    transform: scale(1);
  }
  50% {
    opacity: 0.3;
  }
  100% {
    opacity: 0;
    transform: scale(2.5);
  }
}
/* ----------------------------------------------------------------------------
  Canvas Cursor
---------------------------------------------------------------------------- */

/* ----------------------------------------------------------------------------
  Grid Border
---------------------------------------------------------------------------- */
.grid-border {
  overflow: hidden;
  --cnvs-grid-border-width: 1px;
  --cnvs-grid-border-color: var(--cnvs-contrast-900);
  --cnvs-grid-border-color-dark: #FFF;
  --cnvs-grid-border-opacity: 0.07;
}
.grid-border [class^=col-]::before, .grid-border [class^=col-]::after {
  content: "";
  position: absolute;
  border-width: 0;
  border-style: solid;
  border-color: var(--cnvs-grid-border-color);
  opacity: var(--cnvs-grid-border-opacity);
}
.grid-border [class^=col-]::before {
  height: 100%;
  top: 0;
  left: calc(-1 * var(--cnvs-grid-border-width));
  border-left-width: var(--cnvs-grid-border-width);
}
.grid-border [class^=col-]::after {
  width: 100%;
  height: 0;
  top: auto;
  left: 0;
  bottom: calc(-1 * var(--cnvs-grid-border-width));
  border-bottom-width: var(--cnvs-grid-border-width);
}

/* -----------------------------------------------------------
  App Menu
-------------------------------------------------------------- */

/* -----------------------------------------------------------
  Circle Stack
-------------------------------------------------------------- */

/* -----------------------------------------------------------
  Ticker
-------------------------------------------------------------- */
@-webkit-keyframes tickerAnim {
  0% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    visibility: visible;
  }
  100% {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}
@keyframes tickerAnim {
  0% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    visibility: visible;
  }
  100% {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}

/*-----------------------------------------------------------------------------------

  Shortcodes: Forms.scss

-----------------------------------------------------------------------------------*/
/* ----------------------------------------------------------------
  Forms
-----------------------------------------------------------------*/
:root,
.not-dark {
  --cnvs-form-processor-bg: #fff;
  --cnvs-input-btn-input-color: var(--bs-body-color);
  --cnvs-input-btn-input-bg: var(--bs-body-bg);
  --cnvs-input-btn-border-color: var(--bs-border-color);
}

label {
  margin-bottom: var(--cnvs-input-label-mb);
  font-weight: var(--cnvs-form-label-font-weight);
}

/* ----------------------------------------------------------------
  Contact Form
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
  Preloaders
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------

  footer.scss

-----------------------------------------------------------------*/
/* ----------------------------------------------------------------
  Footer
-----------------------------------------------------------------*/
#footer {
  --cnvs-footer-top-border: 5px solid rgba(var(--cnvs-contrast-rgb), 0.15);
  --cnvs-copyrights-link-color: var(--cnvs-contrast-500);
  position: relative;
  background-color: var(--cnvs-footer-bg);
  border-top: var(--cnvs-footer-top-border);
}
#footer .footer-widgets-wrap {
  position: relative;
; padding-top: 40px;
}

#footer .section {

}


#copyrights {
  padding: calc(var(--cnvs-content-padding) * 0.2) 0;
  background-color: var(--cnvs-contrast-300);
  font-size: var(--cnvs-copyrights-font-size);
  line-height: var(--cnvs-line-height-content);
}

/* ----------------------------------------------------------------

  widgets.scss

-----------------------------------------------------------------*/
/* ----------------------------------------------------------------
  Widgets
-----------------------------------------------------------------*/
:root,
.not-dark {
  --cnvs-widget-border: 1px solid rgba(var(--cnvs-contrast-rgb), 0.1);
}

.widget {
  --cnvs-widget-border: 1px solid rgba(var(--cnvs-contrast-rgb), 0.1);
  --cnvs-widget-margin: 3rem;
  --cnvs-widget-title-margin: 1.5rem;
  --cnvs-widget-title-font-size: 1.25rem;
  --cnvs-widget-title-font-weight: 500;
  --cnvs-widget-title-letter-spacing: 0;
  --cnvs-widget-title-text-transform: none;
  position: relative;
  margin-top: var(--cnvs-widget-margin);
  /* Widget - Links
  -----------------------------------------------------------------*/
  /* Widget - Testimonial & Twitter
  -----------------------------------------------------------------*/
}
.widget p {
  line-height: 1.7;
}
.widget:first-child {
  margin-top: 0;
}
.widget > h4, .widget > .h4 {
  margin-bottom: var(--cnvs-widget-title-margin);
  font-size: var(--cnvs-widget-title-font-size);
  font-weight: var(--cnvs-widget-title-font-weight);
  letter-spacing: var(--cnvs-widget-title-letter-spacing);
  text-transform: var(--cnvs-widget-title-text-transform);
}
.widget .testimonial p {
  font-size: 0.875rem;
}
/* Widget - Quick Contact Form
-----------------------------------------------------------------*/

/* Newsletter Widget
-----------------------------------------------------------------*/

/* Twitter Feed Widget
-----------------------------------------------------------------*/

/* Widget Filter Links
-----------------------------------------------------------------*/

/* Tag Cloud
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------

  Paginations.scss

-----------------------------------------------------------------*/
/* ----------------------------------------------------------------
  Styled Paginations
-----------------------------------------------------------------*/
:root,
.not-dark {
  --cnvs-pagination-circle-size: 35px;
  --cnvs-pagination-margin: 5px;
  --bs-pagination-hover-color: var(--cnvs-contrast-0);
}

/* ----------------------------------------------------------------
  extras.scss
-----------------------------------------------------------------*/
/* ----------------------------------------------------------------
  Bootstrap Specific
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
  Shape Dividers
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
  HTML5 Youtube Video Backgrounds
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
  Datepicker Component
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
  Star Ratings Component
-----------------------------------------------------------------*/

/* ----------------------------------------------------------------
  Custom Animate.css Styles
-----------------------------------------------------------------*/
@-webkit-keyframes fadeInDownSmall {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -50%, 0);
    transform: translate3d(0, -50%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes fadeInDownSmall {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -50%, 0);
    transform: translate3d(0, -50%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
.fadeInDownSmall {
  -webkit-animation-name: fadeInDownSmall;
  animation-name: fadeInDownSmall;
}

@-webkit-keyframes fadeInLeftSmall {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-50%, 0, 0);
    transform: translate3d(-50%, 0, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes fadeInLeftSmall {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-50%, 0, 0);
    transform: translate3d(-50%, 0, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@-webkit-keyframes fadeInRightSmall {
  from {
    opacity: 0;
    -webkit-transform: translate3d(50%, 0, 0);
    transform: translate3d(50%, 0, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes fadeInRightSmall {
  from {
    opacity: 0;
    -webkit-transform: translate3d(50%, 0, 0);
    transform: translate3d(50%, 0, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@-webkit-keyframes fadeInUpSmall {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 50%, 0);
    transform: translate3d(0, 50%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes fadeInUpSmall {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 50%, 0);
    transform: translate3d(0, 50%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@-webkit-keyframes fadeOutDownSmall {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 50%, 0);
    transform: translate3d(0, 50%, 0);
  }
}
@keyframes fadeOutDownSmall {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 50%, 0);
    transform: translate3d(0, 50%, 0);
  }
}
.fadeOutDownSmall {
  -webkit-animation-name: fadeOutDownSmall;
  animation-name: fadeOutDownSmall;
}

@-webkit-keyframes fadeOutLeftSmall {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(-50%, 0, 0);
    transform: translate3d(-50%, 0, 0);
  }
}
@keyframes fadeOutLeftSmall {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(-50%, 0, 0);
    transform: translate3d(-50%, 0, 0);
  }
}

@-webkit-keyframes fadeOutRightSmall {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(50%, 0, 0);
    transform: translate3d(50%, 0, 0);
  }
}
@keyframes fadeOutRightSmall {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(50%, 0, 0);
    transform: translate3d(50%, 0, 0);
  }
}

@-webkit-keyframes fadeOutUpSmall {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -50%, 0);
    transform: translate3d(0, -50%, 0);
  }
}
@keyframes fadeOutUpSmall {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -50%, 0);
    transform: translate3d(0, -50%, 0);
  }
}
.fadeOutUpSmall {
  -webkit-animation-name: fadeOutUpSmall;
  animation-name: fadeOutUpSmall;
}

/* ----------------------------------------------------------------

  pageloaders.scss

-----------------------------------------------------------------*/
:root,
.not-dark {
  --cnvs-loader-color: var(--cnvs-contrast-300);
}

/* ----------------------------------------------------------------
  Page Transitions
-----------------------------------------------------------------*/
@-webkit-keyframes bouncedelay {
  0%, 80%, 100% {
    -webkit-transform: scale(0);
    transform: scale(0);
  }
  40% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@keyframes bouncedelay {
  0%, 80%, 100% {
    -webkit-transform: scale(0);
    transform: scale(0);
  }
  40% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@-webkit-keyframes rotateplane {
  0% {
    transform: perspective(120px) rotateX(0deg) rotateY(0deg);
    -webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg);
  }
  50% {
    transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
    -webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
  }
  100% {
    transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
    -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
  }
}
@keyframes rotateplane {
  0% {
    transform: perspective(120px) rotateX(0deg) rotateY(0deg);
    -webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg);
  }
  50% {
    transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
    -webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
  }
  100% {
    transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
    -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
  }
}
@-webkit-keyframes cssspinnerbounce {
  0%, 100% {
    transform: scale(0);
    -webkit-transform: scale(0);
  }
  50% {
    transform: scale(1);
    -webkit-transform: scale(1);
  }
}
@keyframes cssspinnerbounce {
  0%, 100% {
    transform: scale(0);
    -webkit-transform: scale(0);
  }
  50% {
    transform: scale(1);
    -webkit-transform: scale(1);
  }
}
@-webkit-keyframes stretchdelay {
  0%, 40%, 100% {
    transform: scaleY(0.4);
    -webkit-transform: scaleY(0.4);
  }
  20% {
    transform: scaleY(1);
    -webkit-transform: scaleY(1);
  }
}
@keyframes stretchdelay {
  0%, 40%, 100% {
    transform: scaleY(0.4);
    -webkit-transform: scaleY(0.4);
  }
  20% {
    transform: scaleY(1);
    -webkit-transform: scaleY(1);
  }
}
@-webkit-keyframes cubemove {
  25% {
    transform: translateX(42px) rotate(-90deg) scale(0.5);
    -webkit-transform: translateX(42px) rotate(-90deg) scale(0.5);
  }
  50% {
    transform: translateX(42px) translateY(42px) rotate(-179deg);
    -webkit-transform: translateX(42px) translateY(42px) rotate(-179deg);
  }
  50.1% {
    transform: translateX(42px) translateY(42px) rotate(-180deg);
    -webkit-transform: translateX(42px) translateY(42px) rotate(-180deg);
  }
  75% {
    transform: translateX(0px) translateY(42px) rotate(-270deg) scale(0.5);
    -webkit-transform: translateX(0px) translateY(42px) rotate(-270deg) scale(0.5);
  }
  100% {
    transform: rotate(-360deg);
    -webkit-transform: rotate(-360deg);
  }
}
@keyframes cubemove {
  25% {
    transform: translateX(42px) rotate(-90deg) scale(0.5);
    -webkit-transform: translateX(42px) rotate(-90deg) scale(0.5);
  }
  50% {
    transform: translateX(42px) translateY(42px) rotate(-179deg);
    -webkit-transform: translateX(42px) translateY(42px) rotate(-179deg);
  }
  50.1% {
    transform: translateX(42px) translateY(42px) rotate(-180deg);
    -webkit-transform: translateX(42px) translateY(42px) rotate(-180deg);
  }
  75% {
    transform: translateX(0px) translateY(42px) rotate(-270deg) scale(0.5);
    -webkit-transform: translateX(0px) translateY(42px) rotate(-270deg) scale(0.5);
  }
  100% {
    transform: rotate(-360deg);
    -webkit-transform: rotate(-360deg);
  }
}
@-webkit-keyframes scaleout {
  0% {
    transform: scale(0);
    -webkit-transform: scale(0);
  }
  100% {
    transform: scale(1);
    -webkit-transform: scale(1);
    opacity: 0;
  }
}
@keyframes scaleout {
  0% {
    transform: scale(0);
    -webkit-transform: scale(0);
  }
  100% {
    transform: scale(1);
    -webkit-transform: scale(1);
    opacity: 0;
  }
}
@-webkit-keyframes ball-grid-pulse {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(0.5);
    transform: scale(0.5);
    opacity: 0.7;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
}
@keyframes ball-grid-pulse {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(0.5);
    transform: scale(0.5);
    opacity: 0.7;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
}
@-webkit-keyframes rotate {
  0% {
    -webkit-transform: rotate(0deg) scale(1);
    transform: rotate(0deg) scale(1);
  }
  50% {
    -webkit-transform: rotate(180deg) scale(0.6);
    transform: rotate(180deg) scale(0.6);
  }
  100% {
    -webkit-transform: rotate(360deg) scale(1);
    transform: rotate(360deg) scale(1);
  }
}
@keyframes rotate {
  0% {
    -webkit-transform: rotate(0deg) scale(1);
    transform: rotate(0deg) scale(1);
  }
  50% {
    -webkit-transform: rotate(180deg) scale(0.6);
    transform: rotate(180deg) scale(0.6);
  }
  100% {
    -webkit-transform: rotate(360deg) scale(1);
    transform: rotate(360deg) scale(1);
  }
}
@-webkit-keyframes ballrotate {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  50% {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes ballrotate {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  50% {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@-webkit-keyframes ball-zig-deflect {
  17% {
    -webkit-transform: translate(-15px, -30px);
    transform: translate(-15px, -30px);
  }
  34% {
    -webkit-transform: translate(15px, -30px);
    transform: translate(15px, -30px);
  }
  50% {
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
  }
  67% {
    -webkit-transform: translate(15px, -30px);
    transform: translate(15px, -30px);
  }
  84% {
    -webkit-transform: translate(-15px, -30px);
    transform: translate(-15px, -30px);
  }
  100% {
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
  }
}
@keyframes ball-zig-deflect {
  17% {
    -webkit-transform: translate(-15px, -30px);
    transform: translate(-15px, -30px);
  }
  34% {
    -webkit-transform: translate(15px, -30px);
    transform: translate(15px, -30px);
  }
  50% {
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
  }
  67% {
    -webkit-transform: translate(15px, -30px);
    transform: translate(15px, -30px);
  }
  84% {
    -webkit-transform: translate(-15px, -30px);
    transform: translate(-15px, -30px);
  }
  100% {
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
  }
}
@-webkit-keyframes ball-zag-deflect {
  17% {
    -webkit-transform: translate(15px, 30px);
    transform: translate(15px, 30px);
  }
  34% {
    -webkit-transform: translate(-15px, 30px);
    transform: translate(-15px, 30px);
  }
  50% {
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
  }
  67% {
    -webkit-transform: translate(-15px, 30px);
    transform: translate(-15px, 30px);
  }
  84% {
    -webkit-transform: translate(15px, 30px);
    transform: translate(15px, 30px);
  }
  100% {
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
  }
}
@keyframes ball-zag-deflect {
  17% {
    -webkit-transform: translate(15px, 30px);
    transform: translate(15px, 30px);
  }
  34% {
    -webkit-transform: translate(-15px, 30px);
    transform: translate(-15px, 30px);
  }
  50% {
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
  }
  67% {
    -webkit-transform: translate(-15px, 30px);
    transform: translate(-15px, 30px);
  }
  84% {
    -webkit-transform: translate(15px, 30px);
    transform: translate(15px, 30px);
  }
  100% {
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
  }
}
@-webkit-keyframes ball-scale-multiple {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
    opacity: 0;
  }
  5% {
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 0;
  }
}
@keyframes ball-scale-multiple {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
    opacity: 0;
  }
  5% {
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 0;
  }
}
@-webkit-keyframes ball-triangle-path-1 {
  33% {
    -webkit-transform: translate(25px, -50px);
    transform: translate(25px, -50px);
  }
  66% {
    -webkit-transform: translate(50px, 0px);
    transform: translate(50px, 0px);
  }
  100% {
    -webkit-transform: translate(0px, 0px);
    transform: translate(0px, 0px);
  }
}
@keyframes ball-triangle-path-1 {
  33% {
    -webkit-transform: translate(25px, -50px);
    transform: translate(25px, -50px);
  }
  66% {
    -webkit-transform: translate(50px, 0px);
    transform: translate(50px, 0px);
  }
  100% {
    -webkit-transform: translate(0px, 0px);
    transform: translate(0px, 0px);
  }
}
@-webkit-keyframes ball-triangle-path-2 {
  33% {
    -webkit-transform: translate(25px, 50px);
    transform: translate(25px, 50px);
  }
  66% {
    -webkit-transform: translate(-25px, 50px);
    transform: translate(-25px, 50px);
  }
  100% {
    -webkit-transform: translate(0px, 0px);
    transform: translate(0px, 0px);
  }
}
@keyframes ball-triangle-path-2 {
  33% {
    -webkit-transform: translate(25px, 50px);
    transform: translate(25px, 50px);
  }
  66% {
    -webkit-transform: translate(-25px, 50px);
    transform: translate(-25px, 50px);
  }
  100% {
    -webkit-transform: translate(0px, 0px);
    transform: translate(0px, 0px);
  }
}
@-webkit-keyframes ball-triangle-path-3 {
  33% {
    -webkit-transform: translate(-50px, 0px);
    transform: translate(-50px, 0px);
  }
  66% {
    -webkit-transform: translate(-25px, -50px);
    transform: translate(-25px, -50px);
  }
  100% {
    -webkit-transform: translate(0px, 0px);
    transform: translate(0px, 0px);
  }
}
@keyframes ball-triangle-path-3 {
  33% {
    -webkit-transform: translate(-50px, 0px);
    transform: translate(-50px, 0px);
  }
  66% {
    -webkit-transform: translate(-25px, -50px);
    transform: translate(-25px, -50px);
  }
  100% {
    -webkit-transform: translate(0px, 0px);
    transform: translate(0px, 0px);
  }
}
@-webkit-keyframes ball-pulse-sync {
  33% {
    -webkit-transform: translateY(10px);
    transform: translateY(10px);
    opacity: 0.85;
  }
  66% {
    -webkit-transform: translateY(-10px);
    transform: translateY(-10px);
    opacity: 0.7;
  }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
}
@keyframes ball-pulse-sync {
  33% {
    -webkit-transform: translateY(10px);
    transform: translateY(10px);
    opacity: 0.85;
  }
  66% {
    -webkit-transform: translateY(-10px);
    transform: translateY(-10px);
    opacity: 0.7;
  }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
}
@-webkit-keyframes ball-scale-ripple-multiple {
  0% {
    -webkit-transform: scale(0.1);
    transform: scale(0.1);
    opacity: 1;
  }
  70% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 0.7;
  }
  100% {
    opacity: 0;
  }
}
@keyframes ball-scale-ripple-multiple {
  0% {
    -webkit-transform: scale(0.1);
    transform: scale(0.1);
    opacity: 1;
  }
  70% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 0.7;
  }
  100% {
    opacity: 0;
  }
}

/* Magnific Popup SCSS */
:root {
  --cnvs-mfp-overlay-color: #0b0b0b;
  --cnvs-mfp-overlay-opacity: 0.9;
  --cnvs-mfp-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
  --cnvs-mfp-popup-padding-left: 8px;
  --cnvs-mfp-popup-padding-left-mobile: 6px;
  --cnvs-mfp-z-index-base: 1040;
  --cnvs-mfp-controls-opacity: 0.65;
  --cnvs-mfp-controls-color: #FFF;
  --cnvs-mfp-inner-close-icon-color: #333;
  --cnvs-mfp-controls-text-color: #CCC;
  --cnvs-mfp-controls-text-color-hover: #FFF;
  --cnvs-mfp-preloader-size: 2rem;
  --cnvs-mfp-close-btn-size: 4rem;
  --cnvs-mfp-close-btn-font-size: 1.5rem;
  --cnvs-mfp-arrow-size: 4rem;
  --cnvs-mfp-title-padding: 1rem;
  --cnvs-mfp-title-border-radius: 0.25rem;
  --cnvs-mfp-link-color: #CCC;
  --cnvs-mfp-iframe-padding-top: 40px;
  --cnvs-mfp-iframe-background: #000;
  --cnvs-mfp-iframe-max-width: 900px;
  --cnvs-mfp-iframe-ratio: 9/16;
  --cnvs-mfp-image-background: #444;
  --cnvs-mfp-caption-title-color: #F3F3F3;
  --cnvs-mfp-caption-subtitle-color: #BDBDBD;
}
button::-moz-focus-inner {
  padding: 0;
  border: 0;
}

/* Main image in popup */

/* The shadow behind the image */

@media screen and (max-width: 800px) and (orientation: landscape), screen and (max-height: 300px) {
  /**
   * Remove all paddings around the image on small screen
   */
}
/*!
 * animate.css - https://animate.style/
 * Version - 4.1.1
 * Licensed under the MIT license - http://opensource.org/licenses/MIT
 *
 * Copyright (c) 2020 Animate.css
 */
:root {
  --cnvs-animate-duration: 1s;
  --cnvs-animate-delay: 1s;
  --cnvs-animate-repeat: 1;
}

.not-animated {
  opacity: 0;
}

.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-duration: var(--cnvs-animate-duration);
  animation-duration: var(--cnvs-animate-duration);
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
.animated.infinite {
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}
@media print, (prefers-reduced-motion: reduce) {
  .animated {
    -webkit-animation-duration: 1ms !important;
    animation-duration: 1ms !important;
    -webkit-transition-duration: 1ms !important;
    transition-duration: 1ms !important;
    -webkit-animation-iteration-count: 1 !important;
    animation-iteration-count: 1 !important;
  }
  .animated[class*=Out] {
    opacity: 0;
  }
}

/* Attention seekers  */
@-webkit-keyframes bounce {
  from, 20%, 53%, 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) scaleY(1.1);
    transform: translate3d(0, -30px, 0) scaleY(1.1);
  }
  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) scaleY(1.05);
    transform: translate3d(0, -15px, 0) scaleY(1.05);
  }
  80% {
    -webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    -webkit-transform: translate3d(0, 0, 0) scaleY(0.95);
    transform: translate3d(0, 0, 0) scaleY(0.95);
  }
  90% {
    -webkit-transform: translate3d(0, -4px, 0) scaleY(1.02);
    transform: translate3d(0, -4px, 0) scaleY(1.02);
  }
}
@keyframes bounce {
  from, 20%, 53%, 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) scaleY(1.1);
    transform: translate3d(0, -30px, 0) scaleY(1.1);
  }
  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) scaleY(1.05);
    transform: translate3d(0, -15px, 0) scaleY(1.05);
  }
  80% {
    -webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    -webkit-transform: translate3d(0, 0, 0) scaleY(0.95);
    transform: translate3d(0, 0, 0) scaleY(0.95);
  }
  90% {
    -webkit-transform: translate3d(0, -4px, 0) scaleY(1.02);
    transform: translate3d(0, -4px, 0) scaleY(1.02);
  }
}

@-webkit-keyframes flash {
  from, 50%, to {
    opacity: 1;
  }
  25%, 75% {
    opacity: 0;
  }
}
@keyframes flash {
  from, 50%, to {
    opacity: 1;
  }
  25%, 75% {
    opacity: 0;
  }
}

/* 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);
  }
}

@-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);
  }
}

@-webkit-keyframes shakeX {
  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 shakeX {
  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);
  }
}

@-webkit-keyframes shakeY {
  from, to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  10%, 30%, 50%, 70%, 90% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }
  20%, 40%, 60%, 80% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }
}
@keyframes shakeY {
  from, to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  10%, 30%, 50%, 70%, 90% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }
  20%, 40%, 60%, 80% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }
}

@-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);
  }
}

@-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);
  }
}

@-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);
  }
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@-webkit-keyframes wobble {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  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: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes wobble {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  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: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@-webkit-keyframes jello {
  from, 11.1%, to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  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: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  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);
  }
}

@-webkit-keyframes heartBeat {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  14% {
    -webkit-transform: scale(1.3);
    transform: scale(1.3);
  }
  28% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  42% {
    -webkit-transform: scale(1.3);
    transform: scale(1.3);
  }
  70% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@keyframes heartBeat {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  14% {
    -webkit-transform: scale(1.3);
    transform: scale(1.3);
  }
  28% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  42% {
    -webkit-transform: scale(1.3);
    transform: scale(1.3);
  }
  70% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

/* Back entrances */
@-webkit-keyframes backInDown {
  0% {
    -webkit-transform: translateY(-1200px) scale(0.7);
    transform: translateY(-1200px) scale(0.7);
    opacity: 0.7;
  }
  80% {
    -webkit-transform: translateY(0px) scale(0.7);
    transform: translateY(0px) scale(0.7);
    opacity: 0.7;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
}
@keyframes backInDown {
  0% {
    -webkit-transform: translateY(-1200px) scale(0.7);
    transform: translateY(-1200px) scale(0.7);
    opacity: 0.7;
  }
  80% {
    -webkit-transform: translateY(0px) scale(0.7);
    transform: translateY(0px) scale(0.7);
    opacity: 0.7;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
}

@-webkit-keyframes backInLeft {
  0% {
    -webkit-transform: translateX(-2000px) scale(0.7);
    transform: translateX(-2000px) scale(0.7);
    opacity: 0.7;
  }
  80% {
    -webkit-transform: translateX(0px) scale(0.7);
    transform: translateX(0px) scale(0.7);
    opacity: 0.7;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
}
@keyframes backInLeft {
  0% {
    -webkit-transform: translateX(-2000px) scale(0.7);
    transform: translateX(-2000px) scale(0.7);
    opacity: 0.7;
  }
  80% {
    -webkit-transform: translateX(0px) scale(0.7);
    transform: translateX(0px) scale(0.7);
    opacity: 0.7;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
}

@-webkit-keyframes backInRight {
  0% {
    -webkit-transform: translateX(2000px) scale(0.7);
    transform: translateX(2000px) scale(0.7);
    opacity: 0.7;
  }
  80% {
    -webkit-transform: translateX(0px) scale(0.7);
    transform: translateX(0px) scale(0.7);
    opacity: 0.7;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
}
@keyframes backInRight {
  0% {
    -webkit-transform: translateX(2000px) scale(0.7);
    transform: translateX(2000px) scale(0.7);
    opacity: 0.7;
  }
  80% {
    -webkit-transform: translateX(0px) scale(0.7);
    transform: translateX(0px) scale(0.7);
    opacity: 0.7;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
}

@-webkit-keyframes backInUp {
  0% {
    -webkit-transform: translateY(1200px) scale(0.7);
    transform: translateY(1200px) scale(0.7);
    opacity: 0.7;
  }
  80% {
    -webkit-transform: translateY(0px) scale(0.7);
    transform: translateY(0px) scale(0.7);
    opacity: 0.7;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
}
@keyframes backInUp {
  0% {
    -webkit-transform: translateY(1200px) scale(0.7);
    transform: translateY(1200px) scale(0.7);
    opacity: 0.7;
  }
  80% {
    -webkit-transform: translateY(0px) scale(0.7);
    transform: translateY(0px) scale(0.7);
    opacity: 0.7;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
}

/* Back exits */
@-webkit-keyframes backOutDown {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
  20% {
    -webkit-transform: translateY(0px) scale(0.7);
    transform: translateY(0px) scale(0.7);
    opacity: 0.7;
  }
  100% {
    -webkit-transform: translateY(700px) scale(0.7);
    transform: translateY(700px) scale(0.7);
    opacity: 0.7;
  }
}
@keyframes backOutDown {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
  20% {
    -webkit-transform: translateY(0px) scale(0.7);
    transform: translateY(0px) scale(0.7);
    opacity: 0.7;
  }
  100% {
    -webkit-transform: translateY(700px) scale(0.7);
    transform: translateY(700px) scale(0.7);
    opacity: 0.7;
  }
}

@-webkit-keyframes backOutLeft {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
  20% {
    -webkit-transform: translateX(0px) scale(0.7);
    transform: translateX(0px) scale(0.7);
    opacity: 0.7;
  }
  100% {
    -webkit-transform: translateX(-2000px) scale(0.7);
    transform: translateX(-2000px) scale(0.7);
    opacity: 0.7;
  }
}
@keyframes backOutLeft {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
  20% {
    -webkit-transform: translateX(0px) scale(0.7);
    transform: translateX(0px) scale(0.7);
    opacity: 0.7;
  }
  100% {
    -webkit-transform: translateX(-2000px) scale(0.7);
    transform: translateX(-2000px) scale(0.7);
    opacity: 0.7;
  }
}

@-webkit-keyframes backOutRight {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
  20% {
    -webkit-transform: translateX(0px) scale(0.7);
    transform: translateX(0px) scale(0.7);
    opacity: 0.7;
  }
  100% {
    -webkit-transform: translateX(2000px) scale(0.7);
    transform: translateX(2000px) scale(0.7);
    opacity: 0.7;
  }
}
@keyframes backOutRight {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
  20% {
    -webkit-transform: translateX(0px) scale(0.7);
    transform: translateX(0px) scale(0.7);
    opacity: 0.7;
  }
  100% {
    -webkit-transform: translateX(2000px) scale(0.7);
    transform: translateX(2000px) scale(0.7);
    opacity: 0.7;
  }
}

@-webkit-keyframes backOutUp {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
  20% {
    -webkit-transform: translateY(0px) scale(0.7);
    transform: translateY(0px) scale(0.7);
    opacity: 0.7;
  }
  100% {
    -webkit-transform: translateY(-700px) scale(0.7);
    transform: translateY(-700px) scale(0.7);
    opacity: 0.7;
  }
}
@keyframes backOutUp {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
  20% {
    -webkit-transform: translateY(0px) scale(0.7);
    transform: translateY(0px) scale(0.7);
    opacity: 0.7;
  }
  100% {
    -webkit-transform: translateY(-700px) scale(0.7);
    transform: translateY(-700px) scale(0.7);
    opacity: 0.7;
  }
}

/* Bouncing entrances  */
@-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);
  }
}

@-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) scaleY(3);
    transform: translate3d(0, -3000px, 0) scaleY(3);
  }
  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, 25px, 0) scaleY(0.9);
    transform: translate3d(0, 25px, 0) scaleY(0.9);
  }
  75% {
    -webkit-transform: translate3d(0, -10px, 0) scaleY(0.95);
    transform: translate3d(0, -10px, 0) scaleY(0.95);
  }
  90% {
    -webkit-transform: translate3d(0, 5px, 0) scaleY(0.985);
    transform: translate3d(0, 5px, 0) scaleY(0.985);
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@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) scaleY(3);
    transform: translate3d(0, -3000px, 0) scaleY(3);
  }
  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, 25px, 0) scaleY(0.9);
    transform: translate3d(0, 25px, 0) scaleY(0.9);
  }
  75% {
    -webkit-transform: translate3d(0, -10px, 0) scaleY(0.95);
    transform: translate3d(0, -10px, 0) scaleY(0.95);
  }
  90% {
    -webkit-transform: translate3d(0, 5px, 0) scaleY(0.985);
    transform: translate3d(0, 5px, 0) scaleY(0.985);
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@-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) scaleX(3);
    transform: translate3d(-3000px, 0, 0) scaleX(3);
  }
  60% {
    opacity: 1;
    -webkit-transform: translate3d(25px, 0, 0) scaleX(1);
    transform: translate3d(25px, 0, 0) scaleX(1);
  }
  75% {
    -webkit-transform: translate3d(-10px, 0, 0) scaleX(0.98);
    transform: translate3d(-10px, 0, 0) scaleX(0.98);
  }
  90% {
    -webkit-transform: translate3d(5px, 0, 0) scaleX(0.995);
    transform: translate3d(5px, 0, 0) scaleX(0.995);
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@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) scaleX(3);
    transform: translate3d(-3000px, 0, 0) scaleX(3);
  }
  60% {
    opacity: 1;
    -webkit-transform: translate3d(25px, 0, 0) scaleX(1);
    transform: translate3d(25px, 0, 0) scaleX(1);
  }
  75% {
    -webkit-transform: translate3d(-10px, 0, 0) scaleX(0.98);
    transform: translate3d(-10px, 0, 0) scaleX(0.98);
  }
  90% {
    -webkit-transform: translate3d(5px, 0, 0) scaleX(0.995);
    transform: translate3d(5px, 0, 0) scaleX(0.995);
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@-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) scaleX(3);
    transform: translate3d(3000px, 0, 0) scaleX(3);
  }
  60% {
    opacity: 1;
    -webkit-transform: translate3d(-25px, 0, 0) scaleX(1);
    transform: translate3d(-25px, 0, 0) scaleX(1);
  }
  75% {
    -webkit-transform: translate3d(10px, 0, 0) scaleX(0.98);
    transform: translate3d(10px, 0, 0) scaleX(0.98);
  }
  90% {
    -webkit-transform: translate3d(-5px, 0, 0) scaleX(0.995);
    transform: translate3d(-5px, 0, 0) scaleX(0.995);
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@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) scaleX(3);
    transform: translate3d(3000px, 0, 0) scaleX(3);
  }
  60% {
    opacity: 1;
    -webkit-transform: translate3d(-25px, 0, 0) scaleX(1);
    transform: translate3d(-25px, 0, 0) scaleX(1);
  }
  75% {
    -webkit-transform: translate3d(10px, 0, 0) scaleX(0.98);
    transform: translate3d(10px, 0, 0) scaleX(0.98);
  }
  90% {
    -webkit-transform: translate3d(-5px, 0, 0) scaleX(0.995);
    transform: translate3d(-5px, 0, 0) scaleX(0.995);
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@-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) scaleY(5);
    transform: translate3d(0, 3000px, 0) scaleY(5);
  }
  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0) scaleY(0.9);
    transform: translate3d(0, -20px, 0) scaleY(0.9);
  }
  75% {
    -webkit-transform: translate3d(0, 10px, 0) scaleY(0.95);
    transform: translate3d(0, 10px, 0) scaleY(0.95);
  }
  90% {
    -webkit-transform: translate3d(0, -5px, 0) scaleY(0.985);
    transform: translate3d(0, -5px, 0) scaleY(0.985);
  }
  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) scaleY(5);
    transform: translate3d(0, 3000px, 0) scaleY(5);
  }
  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0) scaleY(0.9);
    transform: translate3d(0, -20px, 0) scaleY(0.9);
  }
  75% {
    -webkit-transform: translate3d(0, 10px, 0) scaleY(0.95);
    transform: translate3d(0, 10px, 0) scaleY(0.95);
  }
  90% {
    -webkit-transform: translate3d(0, -5px, 0) scaleY(0.985);
    transform: translate3d(0, -5px, 0) scaleY(0.985);
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

/* Bouncing exits  */
@-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);
  }
}

@-webkit-keyframes bounceOutDown {
  20% {
    -webkit-transform: translate3d(0, 10px, 0) scaleY(0.985);
    transform: translate3d(0, 10px, 0) scaleY(0.985);
  }
  40%, 45% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0) scaleY(0.9);
    transform: translate3d(0, -20px, 0) scaleY(0.9);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0) scaleY(3);
    transform: translate3d(0, 2000px, 0) scaleY(3);
  }
}
@keyframes bounceOutDown {
  20% {
    -webkit-transform: translate3d(0, 10px, 0) scaleY(0.985);
    transform: translate3d(0, 10px, 0) scaleY(0.985);
  }
  40%, 45% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0) scaleY(0.9);
    transform: translate3d(0, -20px, 0) scaleY(0.9);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0) scaleY(3);
    transform: translate3d(0, 2000px, 0) scaleY(3);
  }
}

@-webkit-keyframes bounceOutLeft {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(20px, 0, 0) scaleX(0.9);
    transform: translate3d(20px, 0, 0) scaleX(0.9);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0) scaleX(2);
    transform: translate3d(-2000px, 0, 0) scaleX(2);
  }
}
@keyframes bounceOutLeft {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(20px, 0, 0) scaleX(0.9);
    transform: translate3d(20px, 0, 0) scaleX(0.9);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0) scaleX(2);
    transform: translate3d(-2000px, 0, 0) scaleX(2);
  }
}

@-webkit-keyframes bounceOutRight {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(-20px, 0, 0) scaleX(0.9);
    transform: translate3d(-20px, 0, 0) scaleX(0.9);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0) scaleX(2);
    transform: translate3d(2000px, 0, 0) scaleX(2);
  }
}
@keyframes bounceOutRight {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(-20px, 0, 0) scaleX(0.9);
    transform: translate3d(-20px, 0, 0) scaleX(0.9);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0) scaleX(2);
    transform: translate3d(2000px, 0, 0) scaleX(2);
  }
}

@-webkit-keyframes bounceOutUp {
  20% {
    -webkit-transform: translate3d(0, -10px, 0) scaleY(0.985);
    transform: translate3d(0, -10px, 0) scaleY(0.985);
  }
  40%, 45% {
    opacity: 1;
    -webkit-transform: translate3d(0, 20px, 0) scaleY(0.9);
    transform: translate3d(0, 20px, 0) scaleY(0.9);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0) scaleY(3);
    transform: translate3d(0, -2000px, 0) scaleY(3);
  }
}
@keyframes bounceOutUp {
  20% {
    -webkit-transform: translate3d(0, -10px, 0) scaleY(0.985);
    transform: translate3d(0, -10px, 0) scaleY(0.985);
  }
  40%, 45% {
    opacity: 1;
    -webkit-transform: translate3d(0, 20px, 0) scaleY(0.9);
    transform: translate3d(0, 20px, 0) scaleY(0.9);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0) scaleY(3);
    transform: translate3d(0, -2000px, 0) scaleY(3);
  }
}

/* Fading entrances  */
@-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: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@-webkit-keyframes fadeInDownBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes fadeInDownBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@-webkit-keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@-webkit-keyframes fadeInLeftBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes fadeInLeftBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@-webkit-keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@-webkit-keyframes fadeInRightBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes fadeInRightBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@-webkit-keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@-webkit-keyframes fadeInUpBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes fadeInUpBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@-webkit-keyframes fadeInTopLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, -100%, 0);
    transform: translate3d(-100%, -100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes fadeInTopLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, -100%, 0);
    transform: translate3d(-100%, -100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@-webkit-keyframes fadeInTopRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, -100%, 0);
    transform: translate3d(100%, -100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes fadeInTopRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, -100%, 0);
    transform: translate3d(100%, -100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@-webkit-keyframes fadeInBottomLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 100%, 0);
    transform: translate3d(-100%, 100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes fadeInBottomLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 100%, 0);
    transform: translate3d(-100%, 100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@-webkit-keyframes fadeInBottomRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 100%, 0);
    transform: translate3d(100%, 100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes fadeInBottomRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 100%, 0);
    transform: translate3d(100%, 100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

/* Fading exits */
@-webkit-keyframes fadeOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
@keyframes fadeOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}

@-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);
  }
}

@-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);
  }
}

@-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);
  }
}

@-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);
  }
}

@-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);
  }
}

@-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);
  }
}

@-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);
  }
}

@-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);
  }
}

@-webkit-keyframes fadeOutTopLeft {
  from {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(-100%, -100%, 0);
    transform: translate3d(-100%, -100%, 0);
  }
}
@keyframes fadeOutTopLeft {
  from {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(-100%, -100%, 0);
    transform: translate3d(-100%, -100%, 0);
  }
}

@-webkit-keyframes fadeOutTopRight {
  from {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, -100%, 0);
    transform: translate3d(100%, -100%, 0);
  }
}
@keyframes fadeOutTopRight {
  from {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, -100%, 0);
    transform: translate3d(100%, -100%, 0);
  }
}

@-webkit-keyframes fadeOutBottomRight {
  from {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 100%, 0);
    transform: translate3d(100%, 100%, 0);
  }
}
@keyframes fadeOutBottomRight {
  from {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 100%, 0);
    transform: translate3d(100%, 100%, 0);
  }
}

@-webkit-keyframes fadeOutBottomLeft {
  from {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 100%, 0);
    transform: translate3d(-100%, 100%, 0);
  }
}
@keyframes fadeOutBottomLeft {
  from {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 100%, 0);
    transform: translate3d(-100%, 100%, 0);
  }
}

/* Flippers */
@-webkit-keyframes flip {
  from {
    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg);
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
  40% {
    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
    transform: perspective(400px) scale3d(1, 1, 1) 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) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
    transform: perspective(400px) scale3d(1, 1, 1) 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) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
    transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  to {
    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
}
@keyframes flip {
  from {
    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg);
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
  40% {
    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
    transform: perspective(400px) scale3d(1, 1, 1) 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) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
    transform: perspective(400px) scale3d(1, 1, 1) 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) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
    transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  to {
    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
}

@-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);
  }
}

@-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);
  }
}

@-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;
  }
}

@-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;
  }
}

/* Lightspeed */
@-webkit-keyframes lightSpeedInRight {
  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);
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes lightSpeedInRight {
  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);
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@-webkit-keyframes lightSpeedInLeft {
  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);
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes lightSpeedInLeft {
  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);
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@-webkit-keyframes lightSpeedOutRight {
  from {
    opacity: 1;
  }
  to {
    -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
    transform: translate3d(100%, 0, 0) skewX(30deg);
    opacity: 0;
  }
}
@keyframes lightSpeedOutRight {
  from {
    opacity: 1;
  }
  to {
    -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
    transform: translate3d(100%, 0, 0) skewX(30deg);
    opacity: 0;
  }
}

@-webkit-keyframes lightSpeedOutLeft {
  from {
    opacity: 1;
  }
  to {
    -webkit-transform: translate3d(-100%, 0, 0) skewX(-30deg);
    transform: translate3d(-100%, 0, 0) skewX(-30deg);
    opacity: 0;
  }
}
@keyframes lightSpeedOutLeft {
  from {
    opacity: 1;
  }
  to {
    -webkit-transform: translate3d(-100%, 0, 0) skewX(-30deg);
    transform: translate3d(-100%, 0, 0) skewX(-30deg);
    opacity: 0;
  }
}

/* Rotating entrances */
@-webkit-keyframes rotateIn {
  from {
    -webkit-transform: rotate3d(0, 0, 1, -200deg);
    transform: rotate3d(0, 0, 1, -200deg);
    opacity: 0;
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}
@keyframes rotateIn {
  from {
    -webkit-transform: rotate3d(0, 0, 1, -200deg);
    transform: rotate3d(0, 0, 1, -200deg);
    opacity: 0;
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}

@-webkit-keyframes rotateInDownLeft {
  from {
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}
@keyframes rotateInDownLeft {
  from {
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}

@-webkit-keyframes rotateInDownRight {
  from {
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}
@keyframes rotateInDownRight {
  from {
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}

@-webkit-keyframes rotateInUpLeft {
  from {
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}
@keyframes rotateInUpLeft {
  from {
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}

@-webkit-keyframes rotateInUpRight {
  from {
    -webkit-transform: rotate3d(0, 0, 1, -90deg);
    transform: rotate3d(0, 0, 1, -90deg);
    opacity: 0;
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}
@keyframes rotateInUpRight {
  from {
    -webkit-transform: rotate3d(0, 0, 1, -90deg);
    transform: rotate3d(0, 0, 1, -90deg);
    opacity: 0;
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}

/* Rotating exits */
@-webkit-keyframes rotateOut {
  from {
    opacity: 1;
  }
  to {
    -webkit-transform: rotate3d(0, 0, 1, 200deg);
    transform: rotate3d(0, 0, 1, 200deg);
    opacity: 0;
  }
}
@keyframes rotateOut {
  from {
    opacity: 1;
  }
  to {
    -webkit-transform: rotate3d(0, 0, 1, 200deg);
    transform: rotate3d(0, 0, 1, 200deg);
    opacity: 0;
  }
}

@-webkit-keyframes rotateOutDownLeft {
  from {
    opacity: 1;
  }
  to {
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }
}
@keyframes rotateOutDownLeft {
  from {
    opacity: 1;
  }
  to {
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }
}

@-webkit-keyframes rotateOutDownRight {
  from {
    opacity: 1;
  }
  to {
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}
@keyframes rotateOutDownRight {
  from {
    opacity: 1;
  }
  to {
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}

@-webkit-keyframes rotateOutUpLeft {
  from {
    opacity: 1;
  }
  to {
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}
@keyframes rotateOutUpLeft {
  from {
    opacity: 1;
  }
  to {
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}

@-webkit-keyframes rotateOutUpRight {
  from {
    opacity: 1;
  }
  to {
    -webkit-transform: rotate3d(0, 0, 1, 90deg);
    transform: rotate3d(0, 0, 1, 90deg);
    opacity: 0;
  }
}
@keyframes rotateOutUpRight {
  from {
    opacity: 1;
  }
  to {
    -webkit-transform: rotate3d(0, 0, 1, 90deg);
    transform: rotate3d(0, 0, 1, 90deg);
    opacity: 0;
  }
}

/* Specials */
@-webkit-keyframes hinge {
  0% {
    -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-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-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-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-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-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;
  }
}

@-webkit-keyframes jackInTheBox {
  from {
    opacity: 0;
    -webkit-transform: scale(0.1) rotate(30deg);
    transform: scale(0.1) rotate(30deg);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
  }
  50% {
    -webkit-transform: rotate(-10deg);
    transform: rotate(-10deg);
  }
  70% {
    -webkit-transform: rotate(3deg);
    transform: rotate(3deg);
  }
  to {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@keyframes jackInTheBox {
  from {
    opacity: 0;
    -webkit-transform: scale(0.1) rotate(30deg);
    transform: scale(0.1) rotate(30deg);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
  }
  50% {
    -webkit-transform: rotate(-10deg);
    transform: rotate(-10deg);
  }
  70% {
    -webkit-transform: rotate(3deg);
    transform: rotate(3deg);
  }
  to {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

/* 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: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@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: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

/* 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);
  }
}

/* Zooming entrances */
@-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;
  }
}

@-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);
  }
}

@-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);
  }
}

@-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);
  }
}

@-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);
  }
}

/* Zooming exits */
@-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;
  }
}

@-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-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-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

@-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);
  }
}
@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-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);
  }
}
@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-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-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-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

/* Sliding entrances */
@-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);
  }
}

@-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);
  }
}

@-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);
  }
}

@-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);
  }
}

/* Sliding exits */
@-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);
  }
}

@-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);
  }
}

@-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);
  }
}

@-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);
  }
}

/*-----------------------------------------------------------------------------------
  Dark Scheme - sass/dark.scss
-----------------------------------------------------------------------------------*/
.dark {
  --cnvs-contrast-bg: #212529;
  --cnvs-contrast-bg-offset: #343a40;
  --cnvs-contrast-0: #000;
  --cnvs-contrast-100: #212529;
  --cnvs-contrast-200: #343a40;
  --cnvs-contrast-300: #495057;
  --cnvs-contrast-400: #6c757d;
  --cnvs-contrast-500: #adb5bd;
  --cnvs-contrast-600: #ced4da;
  --cnvs-contrast-700: #dee2e6;
  --cnvs-contrast-800: #e9ecef;
  --cnvs-contrast-900: #f8f9fa;
  --cnvs-contrast-1000: #fff;
  --bs-link-color: var(--cnvs-contrast-900);
  --cnvs-invert-contrast-0: #fff;
  --cnvs-invert-contrast-100: #f8f9fa;
  --cnvs-invert-contrast-200: #e9ecef;
  --cnvs-invert-contrast-300: #dee2e6;
  --cnvs-invert-contrast-400: #ced4da;
  --cnvs-invert-contrast-500: #adb5bd;
  --cnvs-invert-contrast-600: #6c757d;
  --cnvs-invert-contrast-700: #495057;
  --cnvs-invert-contrast-800: #343a40;
  --cnvs-invert-contrast-900: #212529;
  --cnvs-invert-contrast-1000: #000;
  --cnvs-contrast-rgb: 255, 255, 255;
  --cnvs-invert-contrast-rgb: 0, 0, 0;
  --cnvs-heading-color: var(--cnvs-contrast-900);
  --cnvs-topbar-bg: var(--cnvs-contrast-bg-offset);
  --cnvs-header-bg: var(--cnvs-contrast-bg);
  --cnvs-header-sticky-bg: var(--cnvs-contrast-bg);
  --cnvs-side-header-bg: var(--cnvs-contrast-bg);
  --cnvs-header-floating-bg: var(--cnvs-contrast-bg);
  --cnvs-primary-menu-submenu-bg: var(--cnvs-contrast-bg);
  --cnvs-section-bg: var(--cnvs-contrast-bg-offset);
  --cnvs-footer-bg: var(--cnvs-contrast-bg-offset);
  color: var(--cnvs-contrast-800);
}
body.dark {
  --cnvs-body-bg: var(--cnvs-contrast-bg);
}

.dark#footer .footer-widgets-wrap, .dark #footer .footer-widgets-wrap {
  color: var(--cnvs-contrast-800);
}
.dark#footer .footer-widgets-wrap a, .dark #footer .footer-widgets-wrap a {
  color: rgba(255, 255, 255, 0.75);
}
.dark#footer .footer-widgets-wrap a:hover, .dark #footer .footer-widgets-wrap a:hover {
  color: var(--cnvs-contrast-1000);
}

.dark #copyrights, #copyrights.dark {
  color: rgba(255, 255, 255, 0.4);
  background-color: rgba(0, 0, 0, 0.2);
}

.video-facade {
  position: relative;
  width: 100%;
  max-width: 960px; /* Максимальная ширина плеера */
  aspect-ratio: 16 / 9; /* Жестко фиксируем пропорции 16:9 */
  background-color: #000;
  background-size: cover;
  background-position: center;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 4px 15px rgba(0,0,0,0.1);
  transition: transform 0.2s ease;
  /* Убрали cursor: pointer отсюда */
}

.video-facade:hover {
  transform: scale(1.01); /* Легкий эффект увеличения при наведении */
}

/* Стили для искусственной кнопки Play */
.play-button {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 60px;
  height: 60px;
  background-color: rgba(255, 255, 255, 0.8);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 0 15px rgba(0,0,0,0.3);
  transition: background-color 0.3s ease, transform 0.2s ease;
  cursor: pointer; /* Добавили курсор-палец сюда */
}

/* Рисуем сам треугольник внутри кнопки */
.play-button::after {
  content: '';
  display: block;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 10px 0 10px 16px;
  border-color: transparent transparent transparent #333;
  margin-left: 5px; /* Немного сдвигаем вправо для визуального баланса */
}

/* Эффект наведения конкретно на кнопку (а не на весь фасад) */
.play-button:hover {
  background-color: rgba(255, 255, 255, 1);
  transform: translate(-50%, -50%) scale(1.1); /* Кнопка чуть увеличивается при наведении */
}

/* Унификация размеров всех медиа в секции слайдера */

/* Убираем возможные конфликты высоты у родительских контейнеров слайдов */

/* Стили для запущенного видео */
.facade-video-player {
  position: absolute; /* Привязываем к краям родительского блока */
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover; /* Заполняет весь контейнер, обрезая лишнее, если пропорции не совпадают */
  border-radius: inherit; /* Наследует скругление 12px от родителя */
  background-color: #000; /* Черный фон на долю секунды, пока грузится кадр */
  outline: none; /* Убираем синюю рамку при клике */
}

/* Максимальный размер слайдера на мобильных телефонах */

/* Затемняющая маска для превью видео */
.video-facade::before {
  content: '';
  position: absolute;
  top: 0; left: 0; width: 100%; height: 100%;
  background-color: rgba(0, 0, 0, 0.5); /* Полупрозрачный черный (50%) */
  z-index: 1; /* Маска лежит поверх картинки, но ПОД кнопкой Play */
  transition: background-color 0.4s ease;
  pointer-events: none; /* Пропускаем клики сквозь маску */
  border-radius: inherit;
}

/* Убираем затемнение при наведении мыши */
.video-facade:hover::before {
  background-color: rgba(0, 0, 0, 0); /* Делаем маску полностью прозрачной */
}

/* Убедимся, что кнопка Play всегда яркая и лежит поверх маски */
.play-button {
  z-index: 2 !important; 
}

/* Отключаем маску навсегда, когда видео уже запущено */
.video-facade.is-playing::before {
  display: none;
}

/* --- ГЛОБАЛЬНЫЕ ЦВЕТА --- */
:root {
  --cnvs-themecolor: #86b74c !important;
  --cnvs-body-bg: #343a40 !important;
}
body, #content, #wrapper, .section {
  background-color: #343a40 !important;
  color: #ffffff !important;
}
h1, h2, h3, h4, h5, .text-muted {
  color: #ffffff !important;
}
a {
  color: #86b74c;
}
a:hover {
  color: #ffffff;
}

/* --- УМНОЕ МЕНЮ --- */

/* --- СТИЛИ ГЛАВНОГО ЭКРАНА --- */
.hero-fullscreen {
  position: relative;
  width: 100%;
  height: 100vh; /* На всю высоту экрана */
  overflow: hidden;
  display: flex;
  align-items: center;
}
.hero-video {
  position: absolute;
  top: 50%;
  left: 50%;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  transform: translate(-50%, -50%);
  z-index: 1;
  object-fit: cover;
}
.hero-mask {
  position: absolute;
  top: 0; left: 0; width: 100%; height: 100%;
  background-color: rgba(52, 58, 64, 0.55); /* Цвет #343a40 с прозрачностью 75% */
  z-index: 2;
}

.hero-mask-recovery {
  position: absolute;
  top: 0; left: 0; width: 100%; height: 100%;
  background-color: rgba(35, 102, 170, 0.05); /* Цвет #343a40 с прозрачностью 75% */
  z-index: 2;
}  
.hero-content-wrap {
  position: relative;
  z-index: 3;
}

/* Адаптация под телефоны */
@media (max-width: 768px) {
  .hero-title { font-size: 2.2rem !important; }
  .hero-subtitle { font-size: 0.8rem; }
  .hero-logo { margin-bottom: 20px; }
}

/* Премиальный калькулятор AI-видео */
.calc-wrapper {
	display: flex;
	justify-content: center;
	width: 100%;
	padding: 1rem 0;
}

.ai-calculator-premium {
	background: linear-gradient(135deg, rgba(255, 255, 255, 0.95) 0%, rgba(249, 250, 251, 0.9) 100%);
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
	border: 1px solid rgba(255, 255, 255, 0.2);
	border-radius: 24px;
	box-shadow: 
		0 20px 40px rgba(0, 0, 0, 0.1),
		0 10px 20px rgba(0, 0, 0, 0.05),
		inset 0 1px 0 rgba(255, 255, 255, 0.6);
	max-width: 520px;
	width: 100%;
	padding: 0.2rem;
	margin: 0 auto;
	position: relative;
	overflow: hidden;
}

.ai-calculator-premium::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 1px;
}

.calc-header {
	text-align: center;
	margin-bottom: 2.5rem;
}

.calc-icon {
	width: 60px;
	height: 60px;
	background: linear-gradient(135deg, #83b341 0%, #86b74c 100%);
	border-radius: 16px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto 1.5rem;
	box-shadow: 0 8px 25px rgba(131, 179, 65, 0.3);
}

.calc-icon i {
	color: white;
	font-size: 1.5rem;
}

.calc-title {
	font-size: 1.75rem;
	font-weight: 700;
	color: #1a202c;
	margin-bottom: 0.5rem;
	font-family: 'Roboto', sans-serif;
}

.calc-subtitle {
	color: #64748b;
	font-size: 1rem;
	font-weight: 400;
	margin: 0;
}

.calc-body {
	margin-bottom: 2rem;
}

.calc-group {
	margin-bottom: 1.75rem;
}

.calc-label {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 0.75rem;
}

.calc-label label {
	font-weight: 600;
	color: #374151;
	font-size: 0.95rem;
	font-family: 'Roboto', sans-serif;
}

.calc-value {
	background: linear-gradient(135deg, #83b341 0%, #86b74c 100%);
	color: white;
	padding: 0.25rem 0.75rem;
	border-radius: 12px;
	font-weight: 600;
	font-size: 0.875rem;
	box-shadow: 0 4px 12px rgba(131, 179, 65, 0.25);
}

.calc-range-wrapper {
	position: relative;
	margin-bottom: 0.5rem;
}

.calc-range {
	width: 100%;
	height: 8px;
	background: #e5e7eb;
	border-radius: 4px;
	outline: none;
	-webkit-appearance: none;
	appearance: none;
	cursor: pointer;
}

.calc-range::-webkit-slider-thumb {
	-webkit-appearance: none;
	appearance: none;
	width: 24px;
	height: 24px;
	background: linear-gradient(135deg, #83b341 0%, #86b74c 100%);
	border-radius: 50%;
	cursor: pointer;
	box-shadow: 0 4px 12px rgba(131, 179, 65, 0.4);
	transition: all 0.3s ease;
}

.calc-range::-webkit-slider-thumb:hover {
	transform: scale(1.1);
	box-shadow: 0 6px 20px rgba(131, 179, 65, 0.5);
}

.calc-range::-moz-range-thumb {
	width: 24px;
	height: 24px;
	background: linear-gradient(135deg, #83b341 0%, #86b74c 100%);
	border-radius: 50%;
	cursor: pointer;
	border: none;
	box-shadow: 0 4px 12px rgba(131, 179, 65, 0.4);
	transition: all 0.3s ease;
}

.calc-range-progress {
	height: 8px;
	background: linear-gradient(90deg, #83b341 0%, #86b74c 100%);
	border-radius: 4px;
	position: absolute;
	top: 0;
	left: 0;
	width: 4%;
	pointer-events: none;
}

.calc-select-wrapper {
	position: relative;
}

.calc-select {
	width: 100%;
	padding: 1rem 3rem 1rem 1.25rem;
	background: white;
	border: 2px solid #e5e7eb;
	border-radius: 16px;
	font-size: 0.95rem;
	font-weight: 500;
	color: #374151;
	cursor: pointer;
	outline: none;
	transition: all 0.3s ease;
	font-family: 'Roboto', sans-serif;
	appearance: none;
	-webkit-appearance: none;
}

.calc-select:hover {
	border-color: #83b341;
}

.calc-select:focus {
	border-color: #83b341;
	box-shadow: 0 0 0 4px rgba(131, 179, 65, 0.1);
}

.calc-select-arrow {
	position: absolute;
	right: 1.25rem;
	top: 50%;
	transform: translateY(-50%);
	pointer-events: none;
	color: #83b341;
	transition: transform 0.3s ease;
}

.calc-select-wrapper:hover .calc-select-arrow {
	transform: translateY(-50%) rotate(180deg);
}

.calc-result-premium {
	background: linear-gradient(135deg, #1a202c 0%, #2d3748 100%);
	border-radius: 20px;
	padding: 2rem;
	text-align: center;
	margin-bottom: 1.5rem;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
	border: 1px solid rgba(255, 255, 255, 0.1);
}

.calc-result-label {
	color: #94a3b8;
	font-size: 0.875rem;
	font-weight: 500;
	margin-bottom: 0.5rem;
	text-transform: uppercase;
	letter-spacing: 0.05em;
}

.calc-result-price {
	display: flex;
	align-items: baseline;
	justify-content: center;
	gap: 0.25rem;
	margin-bottom: 0.75rem;
}

.calc-currency {
	color: #83b341;
	font-size: 1.5rem;
	font-weight: 600;
}

.calc-amount {
	color: white;
	font-size: 3rem;
	font-weight: 700;
	line-height: 1;
	font-family: 'Roboto', sans-serif;
}

.calc-result-note {
	color: #64748b;
	font-size: 0.8rem;
	opacity: 0.8;
}

.calc-footer {
	text-align: center;
}

.calc-button {
	background: linear-gradient(135deg, #83b341 0%, #86b74c 100%);
	color: white;
	border: none;
	border-radius: 16px;
	padding: 1rem 2rem;
	font-size: 1rem;
	font-weight: 600;
	cursor: pointer;
	transition: all 0.3s ease;
	box-shadow: 0 8px 25px rgba(131, 179, 65, 0.3);
	display: inline-flex;
	align-items: center;
	gap: 0.75rem;
	font-family: 'Roboto', sans-serif;
}

.calc-button:hover {
	transform: translateY(-2px);
	box-shadow: 0 12px 35px rgba(131, 179, 65, 0.4);
}

.calc-button:active {
	transform: translateY(0);
}

/* Адаптивность калькулятора */
@media (max-width: 768px) {
	.calc-wrapper {
		padding: 1rem 0;
	}
	
	.ai-calculator-premium {
		padding: 2rem 1.5rem;
		margin: 0 1rem;
	}
	
	.calc-title {
		font-size: 1.5rem;
	}
	
	.calc-amount {
		font-size: 2.5rem;
	}
	
	.calc-button {
		padding: 0.875rem 1.5rem;
		font-size: 0.95rem;
	}
}

@media (max-width: 480px) {
	.ai-calculator-premium {
		padding: 1.5rem 1rem;
	}
	
	.calc-icon {
		width: 50px;
		height: 50px;
	}
	
	.calc-icon i {
		font-size: 1.25rem;
	}
	
	.calc-title {
		font-size: 1.25rem;
	}
	
	.calc-amount {
		font-size: 2rem;
	}
	
	.calc-select {
		padding: 0.875rem 2.5rem 0.875rem 1rem;
	}
}

}