/*************** Variablen *********************/
:root {
  --sc3-c1: #c90c0f /*Rot aus Logo = 201, 12, 15*/;
  --sc3-c2: #696969 /*D-Grau = 105,105,105*/;
  --sc3-c3: #3d3d3d /* Sehr D-Grau = 61,61,61*/;
}

/***************** Header, Menü, Offcanvas-Toggler *********************/
#sp-header {
  box-shadow: unset;
  background-color: rgba(255,255,255,0);
  padding: 0px 2.5vw;
}

#sp-header .logo-image {
  margin-top: 30px;
}

.sp-megamenu-parent {
  margin: -20px 0px 0px;
}

.sp-megamenu-parent > li > a {
  padding: 0px;
  margin: 0 15px;
}

.sp-megamenu-parent > li.active > a {
  font-weight: 300;
}

.sp-megamenu-parent > li:last-child > a {
  padding-left: 0 !important;
}

#offcanvas-toggler.offcanvas-toggler-right {
  position: absolute;
  right: 20px !important;
  top: 6px;
}

@media (max-width: 1199.98px) {
  .sp-megamenu-parent .sc3-link-home {
    display: none !important;
  }
}

@media (min-width: 992px) {
  #offcanvas-toggler {
    display: none !important;
  }
}

@media (max-width: 991.98px) {
   #sp-header {
    padding: 0px 5vw;
  }
  #sp-header .logo-image {
    margin-top: 60px;
  }
}

@media (max-width: 767.98px) {
  #sp-header .logo-image {
    height: 70px !important;
    margin-top: 40px;
  }
}  

@media (max-width: 575.98px) {
  #offcanvas-toggler.offcanvas-toggler-right {
    top: 3px;
  }
}

@media (max-width: 399.98px) {
  #sp-header .logo-image {
    height: 60px !important;
    margin-top: 25px;
  }
}  


/************************* Off-Canvas ***************************/
.offcanvas-menu {
  background: var(--sc3-c1);
}

.offcanvas-menu .offcanvas-inner ul.menu > li a {
  color: #fff !important;
  opacity: 1;
}

.offcanvas-menu .offcanvas-inner ul.menu > li a:hover, .offcanvas-menu .offcanvas-inner ul.menu > li a:focus {
  color: var(--sc3-c2) !important; 
}

.offcanvas-menu .offcanvas-inner ul.menu > li.active a {
  opacity: 0.7;
}

/*************** Sonstiges, Funktion + Abstände ***********************/
.sc3-z10 {
  z-index: 10 !important;
}

p:last-child {
  margin-bottom: 0;
}

@media (max-width: 575.98px) {
  .sc3-trennung {
    -webkit-hyphens: auto;
    hyphens: auto;
    hyphenate-limit-lines: 3;
    hyphenate-limit-chars: 6 3 3;
  }
}


/************************ Sonstiges, Design ******************************/
#sp-main-body a:not(.sppb-btn, .sc3-bg-c1 a):hover, #sp-header a:hover {
  color: var(--sc3-c1);
  transition: ease-in-out 0.35s;
}

.sc3-bg-c1 {
  background: var(--sc3-c1);
}

.sc3-bg-c2 {
  background: var(--sc3-c2);
}

.sc3-bg-c1 a:hover {
  color: var(--sc3-c2) !important;
}

.sc3-ul {
  padding: 0;
  margin: 0;
  list-style: none;
}

.sc3-ul li {
  position: relative;
  padding-left: 40px;
  margin-bottom: 30px;
}

#sc3-home-intro .sc3-ul li {
  padding-left: 80px;
  margin-bottom: unset;
}
 
.sc3-ul li:before {
  content:"__";
  position: absolute;
  left: 0px;
  top: -3px;
  font-weight: 700;
  color: var(--sc3-c1);
}

#sc3-home-intro .sc3-ul li:before {
  top: -5px;
}

.sppb-btn {
  height: 110px;
  width: 180px;
  align-items: center; justify-content: center;
  display: flex;
  color: #fff;
  font-weight: unset;
  font-size: unset;
  text-transform: uppercase;
  -webkit-hyphens: auto;
  hyphens: auto;
}

.sc3-sec-bright .sppb-btn {
   background-color: var(--sc3-c2);
}

.sc3-sec-bg-img .sppb-btn {
   background-color: var(--sc3-c1);
}

.sc3-sec-bright .sppb-btn:hover, .sppb-btn:focus {
  background-color: var(--sc3-c1) !important;
  color: #fff !important;
}

.sc3-sec-bg-img .sppb-btn:hover, .sppb-btn:focus {
  background-color: var(--sc3-c2) !important;
  color: #fff !important;
}

.sp-scroll-up {
  width: 50px; height: 50px; line-height: 50px;
  bottom: 30px; right: 30px;
  border-radius: 0;
}

.sp-scroll-up:hover {
  background: var(--sc3-c1);
}

@media (max-width: 1199.98px) {
  #sc3-home-intro .sc3-ul li {
    padding-left: 60px;
  }
}

@media (max-width: 991.98px) {
  #sc3-home-intro .sc3-ul li {
    padding-left: 50px;
  }
  #sc3-home-intro .sc3-ul li::before {
	top: -4px;
  }
}

@media (max-width: 767.98px) {
  #sc3-home-intro .sc3-ul li {
    padding-left: 40px;
  }
}

@media (max-width: 575.98px) {
  .sc3-ul li {
    margin-bottom: 20px;
  }
}

@media (max-width: 399.98px) {
  .sc3-ul li {
    padding-left: 30px;
    -webkit-hyphens: auto;
    hyphens: auto;
  }
  .sc3-ul li:before {
    top: -2px;
  }
}

@media (max-width: 575.98px) {
  .sppb-btn {
    height: 110px;
    width: 160px;
  }
}

@media (max-width: 399.98px) {
  .sppb-btn {
    height: 90px;
  }
}

/************** Slider *************************/
.sp-slider .sp-nav-control {
  width: 160px !important;
}

/*************** Formulare ***********************/
.sppb-addon-form-builder .sppb-form-group {
  margin-bottom: 30px;
}

.sppb-addon-form-builder label, .sppb-addon-form-builder .sppb-form-control, .sppb-addon-form-builder input {
  font-size: 1.4rem !important;
}

.sppb-addon-form-builder .sppb-form-check-label {
  margin-left: 15px;
  -webkit-hyphens: auto;
  hyphens: auto;
}

.sppb-form-group label {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px; /* verhindert möglicherweise einen scroll-bug */
    overflow: hidden;
    clip: rect(0, 0, 0, 0); /* ältere Browser */
    white-space: nowrap;
    border: 0;
}

.sc3-sec-bright .sppb-addon-form-builder .sppb-form-check-label:before {
  border: 1px solid var(--sc3-c2);
}

.sc3-sec-bg-img .sppb-addon-form-builder .sppb-form-check-label:before {
  border: 1px solid #fff !important;
}

.sppb-ajax-contact-status {
  margin: 30px auto 20px 60px !important;
  color: var(--sc3-c2) !important;
}

.sppb-text-success, .sppb-text-danger {
  font-weight: 300 !important;
  font-style: normal;
  color: var(--sc3-c1) !important;
}

@media (max-width: 575.98px) {
  .sppb-addon-form-builder .sppb-form-group {
    margin-bottom: 20px;
  }
  .sppb-addon-form-builder label, .sppb-addon-form-builder .sppb-form-control, .sppb-addon-form-builder input {
    font-size: 1.2rem !important;
  }
  .sppb-form-group:not(.sppb-form-group.sppb-form-builder-field-0, .sppb-form-group.sppb-form-builder-field-1, .sppb-form-group.sppb-form-builder-field-2, .sppb-form-group.sppb-form-builder-field-3) label {
    position: unset;
    width: unset;
    height: unset;
    padding: unset;
    margin: unset;
    overflow: unset;
    clip: unset;
    white-space: nowrap;
    border: 0;
  }
}

@media (max-width: 399.98px) {
  .sppb-addon-form-builder label, .sppb-addon-form-builder .sppb-form-control, .sppb-addon-form-builder input {
    font-size: 1rem !important;
  }
}


/*************** Sections, Größen + Abstände ********************/
#sp-main-body {
  margin-top: -100px;
}

.sc3-sec-hero, .sc3-col-hero, #sc3-404 {
  height: calc(100vh + 10px);
  min-height: 700px;
}

.sc3-sec-hero {
  padding: 0px 7.5vw;
}

.sc3-sec-content {
  padding: 150px 7.5vw 180px;
}

#sc3-home-hero h2 {
  border-left: 5px solid var(--sc3-c1);
}

@media (max-width: 991.98px) {
  .sc3-sec-hero, .sc3-col-hero, #sc3-404 {
    height: calc(100vh + 50px);
    min-height: 700px;
  }
  .sc3-sec-content {
    padding: 120px 7.5vw 150px;
  }
}

@media (max-width: 767.98px) {
  /*.sppb-row-container {
    max-width: 620px;
  }*/
  .sc3-sec-hero, .sc3-col-hero, #sc3-404 {
    height: calc(100vh + 50px);
    min-height: 650px;
  }
  .sc3-sec-content {
    padding: 120px 5vw 140px;
  }
}

@media (max-width: 575.98px) {
  .sc3-sec-hero {
    padding: 0 5vw;
  }
  .sc3-sec-content {
    padding: 100px 5vw 120px;
  }
  .sc3-row-img {
    max-width: 380px;
  }
}

@media (max-width: 499.98px) {
  .sc3-row-img {
    max-width: 320px;
  }
}

@media (max-width: 399.98px) {
  .sc3-sec-hero {
    padding: 0 2.5vw 0 5vw;
  }
  .sc3-sec-content {
    padding: 100px 2.5vw 120px;
  }
  .sc3-row-img {
    max-width: 250px;
  }
}

@media (max-width: 349.98px) {
  .sc3-sec-content {
    padding: 100px 0 120px;
  }
}

/******************** Sections, Design ********************/
html::before {
	content: ' ';
	display: block;
	background-image: url(/images/scancad3d-bg01-2000x1333-80.webp);
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	height: 100vh;
	width: 100vw;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	position: fixed;
	z-index: -10;
}

.sc3-sec-bg-img {
  /*background-image: url(/images/scancad3d-bg01-2000x1333-80.webp);
  background-attachment: fixed;
  background-size: cover;*/
  color: #fff;
}

.sc3-sec-bright {
  background: #fff;
  color: var(--sc3-c2);
}

#sc3-imp-imp, #sc3-imp-imp a, #sc3-ds, #sc3-ds a, #sc3-404 {
  color: #fff;
}

@media (max-width: 1199.98px) {
  html::before {
    background-image: url(/images/scancad3d-bg01-1200x800-80.webp);
  }
}

@media (max-width: 991px) {
  /*.sc3-sec-bg-img {
    background-attachment: scroll;
  }*/
}

@media (max-width: 767.98px) {
  html::before {
    background-image: url(/images/scancad3d-bg01-750x1250-80.webp);
  }
}

/*************** Footer ********************/
#sp-footer {
  background: var(--sc3-c1);
}

#sp-footer .container-inner {
	padding: 0;
	border-top: unset;
}

#sp-footer a:hover {
  color: var(--sc3-c2);
}

#sp-footer .sc3-ul li {
  margin-bottom: 16px;
}
 
#sp-footer .sc3-ul li:before {
  color: #fff;
}

@media (max-width: 575.98px) and (min-width: 400px) {
  #sp-footer {
    padding-left: 10%;
  }
}

/**************** Fonts ********************/
@font-face {
  font-display: swap;
  font-family: 'Conthrax';
  font-weight: 700;
  src: url('../local-fonts/conthrax-bold.otf') format('opentype');
}
@font-face {
  font-display: swap;
  font-family: 'Conthrax';
  font-weight: 600;
  src: url('../local-fonts/conthrax-semibold.otf') format('opentype');
}
@font-face {
  font-display: swap;
  font-family: 'Conthrax';
  font-weight: 400;
  src: url('../local-fonts/conthrax-regular.otf') format('opentype');
}
@font-face {
  font-display: swap;
  font-family: 'Ethnocentric';
  font-weight: 700;
  src: url('../local-fonts/ethnocentric-bold-italic.otf') format('opentype');
}
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Stack Sans Text';
  font-style: normal;
  font-weight: 400;
  src: url('../local-fonts/stack-sans-text-v1-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../local-fonts/stack-sans-text-v1-latin-regular.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Stack Sans Text';
  font-style: normal;
  font-weight: 300;
  src: url('../local-fonts/stack-sans-text-v1-latin-300.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../local-fonts/stack-sans-text-v1-latin-300.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}

@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Stack Sans Text';
  font-style: normal;
  font-weight: 200;
  src: url('../local-fonts/stack-sans-text-v1-latin-200.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../local-fonts/stack-sans-text-v1-latin-200.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}

h1, h2, h3, h4, .sp-megamenu-parent > li > a {
  text-transform: uppercase;
}

h1, h2, h3, h4 {
  font-family: 'Conthrax', sans-serif !important;  
}

body, #sc3-home-hero h2, .sp-megamenu-parent > li > a, .offcanvas-menu a, #sp-footer, label {
  font-family: 'Stack Sans Text', sans-serif !important;
}

.sc3-sec-hero h2 {
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 1.4;
  max-width: 1010px;
}

#sc3-home-hero h1 {
  font-size: 5.5rem;
}

#sp-footer {
  font-size: unset;
}

.ds-zwischen-hl {
  margin-top: 3rem;
  margin-bottom: 2rem;
}

.ds-zwischen-hl-klein {
  font-size: 1.5rem;
  font-weight: 700;
  margin-top: 2rem;
  text-transform: uppercase;
}

.ds-hervorhebung {
  margin-top: 2rem;
  font-weight: 500;
  text-transform: uppercase;
}

@media (max-width: 1199.98px) {
  #sc3-home-hero h1 {
    font-size: 4.75rem;
  }
  .sc3-sec-hero h2 {
    font-size: 2rem !important;
  }
}

@media (max-width: 1199.98px) and (min-width: 992px) {
  h2 {
    font-size: 2.5rem !important;
  }
}

@media (max-width: 991.98px) {
  #sc3-home-hero h1 {
    font-size: 3.75rem;
  }
  #sc3-home-intro h2 {
    font-size: 2rem !important;
  }
}

@media (max-width: 767.98px) {
  #sc3-home-hero h1 {
    font-size: 2.75rem;
  }
  .sc3-sec-hero h2 {
    font-size: 1.9rem !important;
  }
  #sc3-home-intro h2 {
    font-size: 1.5rem !important;
  }
}

@media (max-width: 575.98px) {
  body, #sp-footer {
    font-size: 1.2rem !important;
  }
  h2 {
    font-size: 2.2rem !important;
  }
  h3, .sc3-sec-hero h2 {
    font-size: 1.4rem !important;
  }
  #sc3-home-hero h1 {
    font-size: 2.4rem;
  }
}

@media (max-width: 399.98px) {
  body, #sp-footer {
    font-size: 1rem !important;
  }
  #sc3-home-hero h1 {
    font-size: 1.85rem;
  }
  h3, .sc3-sec-hero h2 {
    font-size: 1.25rem !important;
  }
  h2 {
    font-size: 1.6rem !important;
  }
}
