:root{
  --color-text-logo: #848282;
  
  --color-text: #545759;
  --color-text-dark: #545759;
  
  --color-brownish: #85837f;
  --color-brownish-light: #d6d6d6;
  --color-brownish-light2: #e8e7e7; 
  
  --color-primary: #3e01ff;
  --color-secondary: #3b4cbf;
  --color-light: #7bb2ec;
  --color-dark: #48619e;
  --bs-link-hover-color: #3e01ff;
}




/* scrollbar */
#element::-webkit-scrollbar {
  display: none;
}
::-webkit-scrollbar {
  width: 11px;
}
::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.25);
  background-color: #a1a1a1;
}
::-webkit-scrollbar-thumb {
  background-color: var(--color-primary);
  outline: 0px solid #fdfdfd;
}




body {
  color: var(--color-text);
}
.row.bauen-project-items img:hover {
filter: grayscale(0);  
}
.row.bauen-project-items img {
filter: grayscale(1);
}

.section-title {
  color: var(--color-text-dark);
}

.services .item:hover .numb {
  color: transparent;
  -webkit-text-stroke: 1px rgb(62 1 255 / 40%);
}

.process .item h3 {
  -webkit-text-stroke: 1px rgb(62 1 255 / 40%);
}

#klogo1 { filter: contrast(0) sepia(1); }
#klogo1:hover { filter: contrast(0) sepia(1); }

.social-left li a:hover {
  border-color: var(--color-primary);
}

.services .item img {
    filter: hue-rotate(198deg);
    opacity: 0.4;
}

.process .item .icon {
  color: #d6d9e8;
  color: #cbcddb !important;
}

.bauen-project-filter li:hover,
.bauen-project-filter li.active {
  color: var(--color-primary);
}

.bauen-project-wrap p {
    color: var(--color-primary);
}

.logo-wrapper {
  border-bottom-right-radius: 2px;
}
.logo-wrapper .logo span {
  font-size: 16px;
  color: var(--color-text-logo);
  /*text-shadow: 1px 1px rgb(0 0 0 / 10%);*/
  font-weight: 300;
}
.logo-wrapper .logo span span { font-size: 18px; font-weight: 400; opacity: 1; }

.logo-img {
  width: unset;
  height: 70px;
  margin-bottom: 5px;
}
.nav-scroll .logo-img {
  width: unset;
  height:50px;
}

.nav-scroll .logo-wrapper .logo a {
  position:relative;
}
.nav-scroll .logo-wrapper .logo h2 {
  display: block;
  top: 15px;
  left: 60px;
  width: 390px !important;
  text-align: left;
  padding: 0;
  position: absolute;
}
.nav-scroll .logo-wrapper .logo h2 span {
  display: block !important;
}

a:hover {
    color: var(--bs-link-hover-color) !important;
}

.link-btn:before {
  
  background-color: var(--color-primary);
}

.link-btn i {
  
  color: var(--color-primary);
}

li.nav-item {
  margin-left: 20px;
  padding-left: 3px;
  border: 1px solid transparent;
}

li.nav-item.active,
li.nav-item:hover {
  background: rgb(255 255 255 / 70%);
  border-radius: 2px;
}



.navbar .navbar-nav .active,
.nav-scroll .navbar-nav .active {
    color: var(--bs-link-hover-color) !important;
}

.navbar .navbar-nav .nav-link {
  font-weight: 400;
}

.main-footer .fothead h6 {
  
  color: var(--color-primary);
}



.section-title span {

    /*col*/  
  color: var(--color-primary);
  
}

.process .item .icon {
  
  /*col*/  
  color: var(--color-primary);
  
}


.bauen-blog4 .caption h6 {
  
  /*bg*/
  background-color: var(--color-primary);
  
}

.process .item .cont {
  border-radius: 0px;
}

.process .item .cont:hover {
    background-color: var(--color-light);
    border: 1px solid var(--color-light);
}