@font-face {
  font-family: "GothamBlack";
  src: url("/fonts/GothamBlack.ttf") format("truetype");
}

@font-face {
  font-family: "Manrope";
  src: url("/fonts/Manrope-Regular.ttf") format("truetype");
}

@font-face {
  font-family: "Cardo";
  src: url("/fonts/Cardo.ttf") format("truetype");
}

@font-face {
  font-family: "Inter";
  src: url("/fonts/Inter.ttf") format("truetype");
}

@font-face {
  font-family: "Lora";
  src: url("/fonts/Lora.ttf") format("truetype");
}

@font-face {
  font-family: "Montserrat";
  src: url("/fonts/Montserrat.ttf") format("truetype");
}

@font-face {
  font-family: "PTSerif";
  src: url("/fonts/PTSerif.ttf") format("truetype");
}

@font-face {
  font-family: "Roboto";
  src: url("/fonts/Roboto.ttf") format("truetype");
}

:root {
  --website-thema-red: #F44336;
  --website-thema-red-semi-transparent: rgba(244, 67, 54, 0.5);
  --website-thema-red-transparent: rgba(244, 67, 54, 0);

  --website-thema-green: #4CAF50;
  --website-thema-green-semi-transparent: rgba(76, 175, 80, 0.5);

  --website-thema-yellow: #FFC107;
  --website-thema-yellow-semi-transparent: rgba(255, 193, 7, 0.5);

  --website-thema-blue: #2196F3;
  --website-thema-blue-semi-transparent: rgba(33, 150, 243, 0.5);

  --website-thema-orange: #FF9800;
  --website-thema-orange-semi-transparent: rgba(255, 152, 0, 0.5);

  --website-thema-purple: #9500ff;
  --website-thema-purple-semi-transparent: rgba(149, 0, 255, 0.5);

  --root-font-size: 16px;
  --text-font-family: Manrope;
}

html {
  font-size: 14px;
  scroll-behavior: smooth;
}

body {
  font-family: var(--text-font-family);
  font-size: var(--root-font-size);
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

body {

}

.theme-red-bg{
  background-color: var(--website-thema-red);
}
.theme-green-bg{
  background-color: var(--website-thema-green);
}
.theme-yellow-bg{
  background-color: var(--website-thema-yellow);
}
.theme-blue-bg{
  background-color: var(--website-thema-blue);
}
.theme-orange-bg{
  background-color: var(--website-thema-orange);
}
.theme-purple-bg{
  background-color: var(--website-thema-purple);
}

h1, h2, h3, h4, h5, h6 {
  font-family: GothamBlack, serif !important;
}

p {
  font-family: Manrope, serif;
}