.tw-absolute {
  position: absolute !important;
}

.tw-relative {
  position: relative !important;
}

.tw-inset-0 {
  inset: 0px !important;
}

.tw-bottom-8 {
  bottom: 2rem !important;
}

.tw-right-8 {
  right: 2rem !important;
}

.tw-z-0 {
  z-index: 0 !important;
}

.tw-z-50 {
  z-index: 50 !important;
}

.tw-z-\[-20\] {
  z-index: -20 !important;
}

.tw-z-\[-30\] {
  z-index: -30 !important;
}

.tw-z-\[-40\] {
  z-index: -40 !important;
}

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

.tw-mb-8 {
  margin-bottom: 2rem !important;
}

.tw-mr-4 {
  margin-right: 1rem !important;
}

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

.tw-h-72 {
  height: 18rem !important;
}

.tw-h-\[100vh\] {
  height: 100vh !important;
}

.tw-h-\[90vh\] {
  height: 90vh !important;
}

.tw-max-h-\[100vh\] {
  max-height: 100vh !important;
}

.tw-min-h-\[100vh\] {
  min-height: 100vh !important;
}

.tw-w-fit {
  width: -moz-fit-content !important;
  width: fit-content !important;
}

.tw-w-full {
  width: 100% !important;
}

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

.tw-overflow-y-scroll {
  overflow-y: scroll !important;
}

.tw-rounded-2xl {
  border-radius: 1rem !important;
}

.tw-rounded-md {
  border-radius: 0.375rem !important;
}

.tw-rounded-sm {
  border-radius: 0.125rem !important;
}

.tw-rounded-xl {
  border-radius: 0.75rem !important;
}

.tw-border-0 {
  border-width: 0px !important;
}

.tw-border-2 {
  border-width: 2px !important;
}

.tw-border-b-2 {
  border-bottom-width: 2px !important;
}

.tw-border-solid {
  border-style: solid !important;
}

.tw-border-theme-accent {
  border-color: var(--accent-color) !important;
}

.tw-border-theme-text {
  border-color: var(--text-color) !important;
}

.tw-border-gray-100 {
  --tw-border-opacity: 1 !important;
  border-color: rgb(243 244 246 / var(--tw-border-opacity, 1)) !important;
}

.tw-bg-\[\#0f0f0f\]\/75 {
  background-color: rgb(15 15 15 / 0.75) !important;
}

.tw-bg-gray-200 {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1)) !important;
}

.tw-bg-green-600 {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(22 163 74 / var(--tw-bg-opacity, 1)) !important;
}

.tw-bg-red-600 {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(220 38 38 / var(--tw-bg-opacity, 1)) !important;
}

.tw-bg-theme {
  background-color: var(--bg-color) !important;
}

.tw-bg-theme-accent {
  background-color: var(--accent-color) !important;
}

.tw-bg-cover {
  background-size: cover !important;
}

.tw-bg-center {
  background-position: center !important;
}

.tw-bg-no-repeat {
  background-repeat: no-repeat !important;
}

.tw-p-2 {
  padding: 0.5rem !important;
}

.tw-p-4 {
  padding: 1rem !important;
}

.tw-p-8 {
  padding: 2rem !important;
}

.tw-px-2 {
  padding-left: 0.5rem !important;
  padding-right: 0.5rem !important;
}

.tw-px-8 {
  padding-left: 2rem !important;
  padding-right: 2rem !important;
}

.tw-py-1 {
  padding-top: 0.25rem !important;
  padding-bottom: 0.25rem !important;
}

.tw-py-2 {
  padding-top: 0.5rem !important;
  padding-bottom: 0.5rem !important;
}

.tw-py-4 {
  padding-top: 1rem !important;
  padding-bottom: 1rem !important;
}

.tw-pb-\[15vh\] {
  padding-bottom: 15vh !important;
}

.tw-pt-8 {
  padding-top: 2rem !important;
}

.tw-pt-\[10vh\] {
  padding-top: 10vh !important;
}

.tw-pt-\[15vh\] {
  padding-top: 15vh !important;
}

.tw-pt-\[30vh\] {
  padding-top: 30vh !important;
}

.tw-pb-8 {
  padding-bottom: 2rem !important;
}

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

.tw-text-3xl {
  font-size: 1.875rem !important;
  line-height: 2.25rem !important;
}

.tw-text-base {
  font-size: 1rem !important;
  line-height: 1.5rem !important;
}

.tw-text-sm {
  font-size: 0.875rem !important;
  line-height: 1.25rem !important;
}

.tw-text-xl {
  font-size: 1.25rem !important;
  line-height: 1.75rem !important;
}

.tw-font-bold {
  font-weight: 700 !important;
}

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

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

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

.tw-text-theme-accent-text {
  color: var(--accent-text) !important;
}

.tw-text-theme-text {
  color: var(--text-color) !important;
}

.tw-text-white {
  --tw-text-opacity: 1 !important;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1)) !important;
}

.\!tw-no-underline {
  text-decoration-line: none !important;
}

.tw-opacity-80 {
  opacity: 0.8 !important;
}

.tw-opacity-50 {
  opacity: 0.5 !important;
}

.tw-shadow {
  --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1) !important;
  --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color) !important;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;
}

.tw-shadow-sm {
  --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05) !important;
  --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color) !important;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;
}

.tw-shadow-black\/20 {
  --tw-shadow-color: rgb(0 0 0 / 0.2) !important;
  --tw-shadow: var(--tw-shadow-colored) !important;
}

.tw-shadow-theme {
  --tw-shadow-color: var(--bg-color) !important;
  --tw-shadow: var(--tw-shadow-colored) !important;
}

.tw-shadow-theme-accent {
  --tw-shadow-color: var(--accent-color) !important;
  --tw-shadow: var(--tw-shadow-colored) !important;
}

:root {
  --bg-color: #ffffff;
  --text-color: #212121;
  --accent-text: #f1f1f1;
  --accent-color: #2962ff;
}

.modern {
  --bg-color: #f4f6f8;
  --text-color: #212121;
  --accent-text: #ffffff;
  --accent-color: #2962ff;
}

.bold {
  --bg-color: #212121;
  --text-color: #fafafa;
  --accent-text: #ffffff;
  --accent-color: #d32f2f;
}

.hybrid {
  --bg-color: #0d1b2a;
  --text-color: #ffffff;
  --accent-text: #f5f5f5;
  --accent-color: #c62828;
}

body{
  background-color: var(--bg-color);
  color: var(--text-color);
}

.bg-theme{
  background-color: var(--bg-color);
}

.text-theme{
  color: var(--text-color)
}

.btn-cta{
  background-color: var(--accent-color);
  color: white;
}

.btn-cta:hover,
.btn-cta:active,
.btn-cta:focus{
  opacity: 0.9;
}

@keyframes fadeImage1 {
  0%, 100% {
    opacity: 0;
  }

  10%, 30% {
    opacity: 1;
  }

  40% {
    opacity: 0
  }
}

@keyframes fadeImage2 {
  0%, 30% {
    opacity: 0;
  }

  40%, 60% {
    opacity: 1;
  }

  70%, 100% {
    opacity: 0;
  }
}

@keyframes fadeImage3 {
  0%, 60% {
    opacity: 0;
  }

  70%, 95% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}

.hero {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  opacity: 0;
}

.hero-slide-1 {
  animation: fadeImage1 20s ease-in-out infinite;
}

.hero-slide-2 {
  animation: fadeImage2 20s ease-in-out infinite;
}

.hero-slide-3 {
  animation: fadeImage3 20s ease-in-out infinite;
}

@keyframes dotAnim{
  0%,50%,100% {
    margin-top: 45vh
  }

  25% {
    margin-top: 44vh
  }

  75% {
    margin-top: 46vh
  }
}

.dot{
  margin-top: 45vh;
  margin-left: 5px;
  margin-right: 5px;
  width:20px;
  height: 70px;
  background: rgb(204, 202, 202);
  border-radius: 25px;
  opacity: .9;
  transform: rotateZ(25deg);
  animation: dotAnim 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) infinite;
}

#dot-3{
  animation-delay: 0ms;
}

#dot-2{
  animation-delay: 150ms;
}

#dot-1{
  animation-delay: 425ms;
}

.hover\:tw-border-b-2:hover {
  border-bottom-width: 2px !important;
}

.hover\:tw-border-theme-accent:hover {
  border-color: var(--accent-color) !important;
}

.hover\:tw-bg-theme-accent:hover {
  background-color: var(--accent-color) !important;
}

.hover\:tw-text-theme-accent-text:hover {
  color: var(--accent-text) !important;
}

.hover\:tw-text-theme-text:hover {
  color: var(--text-color) !important;
}

.hover\:tw-opacity-100:hover {
  opacity: 1 !important;
}

.focus\:tw-border-b-2:focus {
  border-bottom-width: 2px !important;
}

.focus\:tw-border-theme-accent:focus {
  border-color: var(--accent-color) !important;
}

.focus\:tw-bg-theme-accent:focus {
  background-color: var(--accent-color) !important;
}

.focus\:tw-text-theme-accent-text:focus {
  color: var(--accent-text) !important;
}

.focus\:tw-text-theme-text:focus {
  color: var(--text-color) !important;
}

.active\:tw-border-b-2:active {
  border-bottom-width: 2px !important;
}

.active\:tw-border-theme-accent:active {
  border-color: var(--accent-color) !important;
}

.active\:tw-bg-theme-accent:active {
  background-color: var(--accent-color) !important;
}

.active\:tw-text-theme-accent-text:active {
  color: var(--accent-text) !important;
}

.active\:tw-text-theme-text:active {
  color: var(--text-color) !important;
}

@media (min-width: 768px) {
  .md\:tw-hidden {
    display: none !important;
  }

  .md\:tw-text-left {
    text-align: left !important;
  }

  .md\:tw-text-right {
    text-align: right !important;
  }

  .md\:tw-text-5xl {
    font-size: 3rem !important;
    line-height: 1 !important;
  }
}

@media (min-width: 1024px) {
  .lg\:tw-h-\[100vh\] {
    height: 100vh !important;
  }

  .lg\:tw-pt-\[10vh\] {
    padding-top: 10vh !important;
  }
}

@media (min-width: 1280px) {
  .xl\:tw-text-6xl {
    font-size: 3.75rem !important;
    line-height: 1 !important;
  }
}
