@font-face {
    font-family: "Roboto_Slab";
    font-style: normal;
    font-weight:100 900;
    font-display: swap;
    src: url("../font/Roboto_Slab/RobotoSlab-VariableFont_wght.ttf");
  }
  
  @font-face {
    font-family: "Roboto";
    font-style: normal;
    font-weight:400;
    font-display: swap;
    src: url("../font/Roboto/Roboto-Regular.ttf");
  }
  
  @font-face {
    font-family: "Raleway";
    font-style: normal;
    font-weight:100 900;
    font-display: swap;
    src: url("../font/Raleway/Raleway-VariableFont_wght.ttf");
  }
  @font-face {
    font-family: "Raleway-Italic";
    font-style: normal;
    font-weight:100 900;
    font-display: swap;
    src: url("../font/Raleway/Raleway-Italic-VariableFont_wght.ttf");
  }
  @font-face {
    font-family: "Lora";
    font-style: normal;
    font-weight:400 700;
    font-display: swap;
    src: url("../font/Lora/Lora-VariableFont_wght.ttf");
  }
  @font-face {
    font-family: "Lora-Italic";
    font-style: normal;
    font-weight:400 700;
    font-display: swap;
    src: url("../font/Lora/Lora-Italic-VariableFont_wght.ttf");
  }
  @font-face {
    font-family: "Poor Story";
    font-style: normal;
    font-weight:400;
    font-display: swap;
    src: url("../font/Poor_Story/PoorStory-Regular.ttf");
  }
  @font-face {
    font-family: "Indie Flower";
    font-style: normal;
    font-weight:400;
    font-display: swap;
    src: url("../font/Indie_Flower/IndieFlower-Regular.ttf");
  }
  body {
    margin: 0;
    font-family: 'Raleway';
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #464f5d;
    text-align: left;
    background-color: #fff;
  }
  .img-nav{
    width: 20%;
    height:auto;
  }
  @media (min-width: 992px) {
    .img-nav{
      width: 6%;
      height:auto;
      margin-left:3rem;
    }
  }

  .bg-start{
    font-family: 'Roboto';
    
      /* background-image: linear-gradient(rgba(115, 115, 115, 0.65), rgba(115, 115, 115, 0.65)), url("../img/bg/bg2.jpg"); */
      background-image: url("../assets/img/bg/bgMainZ.jpg");
      background-attachment: fixed;
      background-position: center;
      background-size: cover;
  }

  .bg-Referenzen{
    font-family: 'Roboto';
    
      /* background-image: linear-gradient(rgba(115, 115, 115, 0.65), rgba(115, 115, 115, 0.65)), url("../img/bg/bg2.jpg"); */
      background-image: url("../assets/img/bluTax/Referenzen.jpg");
      
      background-position: center;
      
      min-height: 500px;
  }

  .bg-ref{
    font-family: 'Roboto';
    
      /* background-image: linear-gradient(rgba(115, 115, 115, 0.65), rgba(115, 115, 115, 0.65)), url("../img/bg/bg2.jpg"); */
      background-image: url("../assets/img/bg/bgMainZ.jpg");
      background-attachment: fixed;
      background-position: center;
      background-size: auto;
  }

  .nav-text{
    font-family: 'Raleway';
    color: #4A91bf;
    font-size: 0.9rem;
    margin-left: 0.2rem;
    font-weight:600;
    text-transform: uppercase;
    content:"Wir steuern Ihren Erfolg";
   
   
    
  }
  @media (min-width: 992px) {
    .nav-text{
    color: #4A91bf;
    font-family: 'Raleway';
    font-size: 1.8rem;
    font-weight: 700;
    margin-left:4rem ;
    padding-top: 4rem;
    text-transform: uppercase;
    letter-spacing: 0.5rem;
    content:"bluTax - Wir steuern Ihren Erfolg";
   
    }
  }

.master {
  background: url("../assets/img/bluTax/bluTAStartseitefarbig.png") fixed center no-repeat;
  background-size: cover;
  width: 100%;
  height:100%;
}
.img-header{
  width: 100%;
  content: url("../assets/img/bluTax/TitelbildHandy2024.jpg");
  }
@media (min-width: 992px) {
  .img-header {
    width: 100%;
    content: url("../assets/img/bluTax/TitelbildComputer2024.jpg");
  }
 }
 .img-location{
  width: 100%;
  content: url("../assets/img/bluTax/locationHandy.jpg");
  }
  @media (min-width: 992px) {
    .img-location {
      width: 100%;
      content: url("../assets/img/bluTax/locationComputer.jpg");
    }
   }
  .img-portfolio{
    width: 100%;
    margin-bottom: 1rem;
    content: url("../assets/img/bluTax/OrganigrammHandy.jpg");
    }
  @media (min-width: 992px) {
    .img-portfolio {
      width: 100%;
      margin-bottom: 5rem;
      content: url("../assets/img/bluTax/OrganigrammComputer.jpg");
    }
   }
   .img-dig{
    width: 100%;
    content: url("../assets/img/bluTax/DigitalisierungHandy.jpg");
    }
  @media (min-width: 992px) {
    .img-dig {
      width: 100%;
      content: url("../assets/img/bluTax/DigitalisierungComputer.jpg");
    }
   }
.masthead {
  position: relative;
  width: 100%;
  height: auto;
  display: block;
  min-height: 35rem;
  padding: 0rem 0;
  /* background: linear-gradient(to bottom, rgba(8, 99, 145, 0.3) 0%, rgba(79, 81, 88, 0.7) 75%), url("../assets/img/bluTax//buero3.png"); */
   
   background: url("../assets/img/bluTax/buero3.png") 50% 0 no-repeat;
  background-position: center;
  background-repeat: no-repeat;
  background-attachment: scroll;
  background-size: cover;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
}
.masthead h1 {
  font-family: "Varela Round", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-size: 2.5rem;
  line-height: 2.5rem;
  letter-spacing: 0.8rem;
  background: linear-gradient(rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0));
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text;
          background-clip: text;
}
.masthead h2 {
  max-width: 20rem;
  font-size: 1rem;
}
@media (min-width: 768px) {
  .masthead h1 {
    font-size: 4rem;
    line-height: 4rem;
  }
}
@media (min-width: 992px) {
  .masthead {
    height: 100vh;
    padding: 0;
    width: 100%;
  }
  .masthead h1 {
    font-size: 6.5rem;
    line-height: 6.5rem;
    letter-spacing: 0.8rem;
  }
  .masthead h2 {
    max-width: 30rem;
    font-size: 1.25rem;
  }
}
.text-header-section{
  font-family: 'Roboto_Slab';
    
      font-size: 2.0rem;
      font-weight: 0.85;
      color: transparent;
      margin: 0px auto;
      max-width: 700px;
      text-align: center;
          
    background-image: linear-gradient(90deg, #353c33,#4f6b49, #64a19d);
    background-clip: text;
    -webkit-background-clip: text;
}
.text-line-section{
  font-family: 'Roboto_Slab';
    
      font-size: 1.4rem;
      font-weight: 0.7;
      color: transparent;
      margin: 0px auto;
      max-width: 700px;
      text-align: center;
          
    background-image: linear-gradient(90deg, #6d9d62,#64a19d, white);
    background-clip: text;
    -webkit-background-clip: text;
}
.introduction{
  font-family: 'Roboto';
   padding-top: 2rem; 
      /* background-image: linear-gradient(rgba(115, 115, 115, 0.65), rgba(115, 115, 115, 0.65)), url("../img/bg/bg2.jpg"); 
      background-image: url("../assets/img/bg/bgMainZ.jpg");
      background-attachment: fixed;
      background-position: center;
      background-size: cover;*/
}
.introduction .text-heading{
  font-family: 'Raleway';
    color: #4A91bf;
    font-size: 2.0rem;
    font: weight 0.85em;
    
    
}

.introduction .text-t1{
  font-family: 'Raleway';
    color: #4A91bf;
    font-size: 1.1rem;
    font: weight 0.9em;
    
    
}
.introduction .text-t2{
  font-family: 'Raleway';
    color: #464f5d;
    font-size: 1.1rem;
    font: weight 0.9em;
    
    
}
.introduction .text-t1-d{
  font-family: 'Raleway';
    color: #4A91bf;
    font-size: 1.5rem;
    font: weight 1.1em;
    text-transform: uppercase;
    
    
}

.location {
  position:relative;
  width: 100%;
  height: 40vh;
  display: block;
  margin-bottom: 5rem;
 
  /* background: linear-gradient(to bottom, rgba(8, 99, 145, 0.3) 0%, rgba(79, 81, 88, 0.7) 75%), url("../assets/img/bluTax//buero3.png"); */
   
  /* background-image: linear-gradient(rgba(207, 212, 218, 0.65), rgba(255, 255, 255, 0.8)), url("../assets/img/bluTax/Standort.png"); */
  background: url("../assets/img/bluTax/locationComputer.jpg");
  background-position: center;
  background-repeat: no-repeat;
  background-attachment: scroll;
  background-size: cover;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
}

.location .row {
  display: flex;
  flex-direction:row;
  justify-content: center;
  
}

.location .card {
  padding: 2rem;

  margin-top: 1rem;
  margin-bottom: 1rem;
  border-radius: 0.5rem;
  box-shadow: 0.2rem 0.2rem 1rem rgba(0, 0, 0, 0.5);
 
  text-align: center;
  /* background: linear-gradient(30deg, white, #eceff3); */
  background-color: rgba(255, 255, 255, 1);
  opacity: 0.8;
}
.location .card .header{
  color:black;
  font-family: 'Raleway';
  font-size: 2.0rem;
  font-weight: 600;
}
.location .card .description{
  color:black;
  font-family: 'Raleway';
  font-size: 1.0rem;
  font-weight: 400;
}

@media (min-width: 992px) {
  .location {
    height: 80vh;
   
    width: 100%;
    min-height: 35rem;
  }
  .location .card {
    padding: 5rem;
  
    margin-top: 5rem;
    margin-bottom: 5rem;
   
   
   
  }
  
}

     /* Side Menu */
     #sidebar-wrapper {
      position: fixed;
      z-index: 2;
      right: 0;
      width: 220px;
      height: 100%;
      transition: all 0.4s ease 0s;
      transform: translateX(250px);
      /* background: #3895d2; */
      background: #545454;
      border-left: 1px solid rgba(255, 255, 255, 0.1);
    }
    
    .sidebar-nav {
      position: absolute;
      top: 0;
      width: 220px;
      margin: 0;
      padding: 0;
      list-style: none;
    }
    
    .sidebar-nav li.sidebar-nav-item a {
      display: block;
      text-decoration: none;
      
      font-size: 1.0rem;
      font-weight: 0.8;
      font-family: 'Roboto_Slab';
      color: #fff;
      padding: 15px;
    }
    
    .sidebar-nav li a:hover {
      text-decoration: none;
      color: #fff;
      background: rgba(255, 255, 255, 0.2);
    }
    
    .sidebar-nav li a:active,
    .sidebar-nav li a:focus {
      text-decoration: none;
    }
    
    .sidebar-nav > .sidebar-brand {
      font-size: 1.2rem;
      background: rgba(52, 58, 64, 0.1);
      height: 80px;
      line-height: 50px;
      padding-top: 15px;
      padding-bottom: 15px;
      padding-left: 15px;
    }
    
    .sidebar-nav > .sidebar-brand a {
      color: #fff;
    }
    
    .sidebar-nav > .sidebar-brand a:hover {
      color: #fff;
      background: none;
    }
    
    #sidebar-wrapper.active {
      right: 220px;
      width: 300px;
      transition: all 0.4s ease 0s;
    }
    
    .menu-toggle {
      position: fixed;
      right: 15px;
      top: 15px;
      width: 50px;
      height: 50px;
      text-align: center;
      color: #fff;
      background: rgba(52, 58, 64, 0.5);
      line-height: 50px;
      z-index: 999;
    }
    
    .menu-toggle:focus, .menu-toggle:hover {
      color: #fff;
    }
    
    .menu-toggle:hover {
      background: #343a40;
    }
    
    
    .projects-section {
      padding-top: 2rem;
    }
    .projects-section .text-header{
     
      font-family: 'Raleway';
      color: #4A91bf;
      font-size: 2.0rem;
      font-weight: 0.85;
      /* font-size: 3.0rem;
      font-weight: 400; */
      text-transform: uppercase;
    }

    .projects-section .text-headerset{
     
      font-family: 'Roboto_Slab';
      color: #4A91bf;
      font-size: 1.0rem;
      font-weight: 0.85;
    }
    
    .projects-section .featured-text {
      padding: 2rem;
    }
    @media (min-width: 992px) {
      .projects-section .featured-text {
        padding: 0 0 0 2rem;
        border-left: 0.5rem solid #64a19d;
      }
      .projects-section .text-header{
     
        font-family: 'Raleway';
        color: #4A91bf;
       /*  font-size: 2.0rem;
        font-weight: 0.85; */
        font-size: 3.0rem;
        font-weight: 400;
        text-transform: uppercase;
      }
    }
    .projects-section .project-text {
      padding: 3rem;
      font-size: 90%;
    }
    @media (min-width: 992px) {
      .projects-section .project-text {
        padding: 5rem;
      }
      .projects-section .project-text hr {
        border-color: #64a19d;
        border-width: 0.25rem;
        width: 30%;
      }
    }

    /* Service */
.page-section {
  margin-top: 5rem;
  margin-bottom: 5rem;
}


.page-section .page-heading{
  font-family: 'Raleway';
  color: #4A91bf;
 font-size: 1.8rem;
  font: weight 1.1em;
 
  text-transform: uppercase;
  
}
@media (min-width: 992px) {
  .page-section .page-heading{
  font-family: 'Raleway';
  color: #4A91bf;
 /*  font-size: 1.8rem;
  font: weight 1.1em; */
  font-size: 3.0rem;
  font-weight: 400;
  text-transform: uppercase;
  
}
}
.page-section .page-heading .divider{
  background-color: #4A91bf;
}
.page-section .page-heading-Title{
  font-family: 'Raleway';
  color: #4A91bf;
  font-size: 1.2rem;
  font-weight: 0.85;
}
.page-section .page-heading-Info{
  font-family: 'Raleway';
  color: #464f5d;
  font-size: 0.8rem;
  font-weight: 0.8;
}
.page-section .page-symbol{
  color: #4A91bf;
}
.section-heading {
  text-transform: uppercase;
}

.section-heading .section-heading-upper {
  display: block;
  font-size: 1rem;
  font-weight: 800;
}

.section-heading .section-heading-lower {
  display: block;
  font-size: 3rem;
  font-weight: 100;
}

.footer {
  background-color: rgba(20, 20, 19, 0.9);
}

.footer-section {
  padding-top: 0.25rem;
  padding-bottom: 1rem;
}
.footer-section .card {
  border: 0;
  border-bottom: 0.25rem solid #64a19d;
}
.footer-section .card h4 {
  font-size: 0.8rem;
  font-family: 'Roboto';
  text-transform: uppercase;
  letter-spacing: 0.15rem;
}
.footer-section .card hr {
  border-color: #64a19d;
  border-width: 0.25rem;
  width: 3rem;
}
.footer-section .social {
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
}
.footer-section .social a {
  text-align: center;
  height: 3rem;
  width: 3rem;
  background: rgba(255, 255, 255, 0.1);
  border-radius: 100%;
  line-height: 3rem;
  color: rgba(255, 255, 255, 0.3);
}
.footer-section .social a:hover {
  color: rgba(255, 255, 255, 0.5);
}
.footer-section .social a:active {
  color: #fff;
}

.portfolio {
  margin-bottom: 0px; 
  font-family: 'Roboto';
}

.portfolio .portfolio-item {
  cursor: pointer;
  position: relative;
  display: block;
  max-width: 25rem;
  margin-bottom: 30px;
  border-radius: 0.5rem;
  overflow:hidden;
  /* box-shadow: 0px 0px 5px rgba(255, 255, 255, 0.8); */
  box-shadow:8px 5px 5px rgb(74, 145, 191, 0.6);
 
}

.portfolio .portfolio-item .textfeld{
  
 color: #464f5d;
}

.portfolio .portfolio-item .portfolio-item-caption {
  position: absolute;
  top: 0;
  left: 0;
  transition: all 0.2s ease-in-out;
  opacity: 0;
  background-color: rgba(255, 255, 255, 0.9);
 

}

.portfolio .portfolio-item .portfolio-item-caption:hover {
  opacity: 1;
}

.portfolio .portfolio-item .portfolio-item-caption .portfolio-item-caption-content {
  font-size: 0.85rem;
  font-family: 'Roboto_Slab';
  color:#545454;
}

@media (min-width: 992px) {
.portfolio {
  margin-bottom: 0px; 
  font-family: 'Roboto';
}

.portfolio .portfolio-item {
  cursor: pointer;
  position: relative;
  display: block;
  max-width: 25rem;
  margin-bottom: 30px;
  border-radius: 0.5rem;
  overflow:hidden;
  /* box-shadow: 0px 0px 5px rgba(255, 255, 255, 0.8); */
  box-shadow:8px 5px 5px rgb(74, 145, 191, 0.6);
  min-height: 28rem;
}

.portfolio .portfolio-item .textfeld{
  
  min-height: 18rem;
}

.portfolio .portfolio-item .portfolio-item-caption {
  position: absolute;
  top: 0;
  left: 0;
  transition: all 0.2s ease-in-out;
  opacity: 0;
  background-color: rgba(255, 255, 255, 0.9);
 

}

.portfolio .portfolio-item .portfolio-item-caption:hover {
  opacity: 1;
}

.portfolio .portfolio-item .portfolio-item-caption .portfolio-item-caption-content {
  font-size: 0.85rem;
  font-family: 'Roboto_Slab';
  color:#545454;
}
}

.service-list{
  font-family: 'Raleway';
  color: #464f5d;
  font-size: 0.8rem;
  font-weight: 0.8;
  list-style-type:disc;
}
.service-list-second{
  font-family: 'Raleway';
  color: #464f5d;
  font-size: 0.8rem;
  font-weight: 0.8;
  list-style-type:circle;
}
.service-list-heading{
  font-family: 'Raleway';
  color: #464f5d;
  font-size: 1.0rem;
  font-weight: 0.9;
  text-transform: uppercase;
}
.button-service {
  margin-top: 20px;
  font-size: 0.85rem;
  font-family: 'Roboto_Slab';
  color:white;

  text-decoration:none;
  background-color: #4A91bf;
  padding: 10px 20px 10px 20px;
  display: inline-block;
  border-radius: 10000px;
}

/* .button-service:hover {
  background-image: radial-gradient(circle at 50% 50%, rgb(100, 161, 96) 1%, rgb(100, 161, 66) 1%);
  background-size: 20000% 20000%;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  transition: background-size linear 0.25s;
}
.button-service:hover:active {
  transition-duration: 0s;
  background-size: 100% 100%;
} */
.chat-news{
  border-radius: 1.0rem;
}
.chat-heading {
  font-family: 'Raleway';
  color:#64a19d;
  font-size: 1.1rem;
  font-weight: 0.9;
  text-transform: uppercase;
}
.chat-text {
  font-family: 'Raleway';
  color:#545454;
  font-size: 1.1rem;
  font: weight 0.9em;
}
.img-ref{
  border-radius: 8px;
  width: 100%;
}
@media (min-width: 992px) {
  .img-ref {
    width: 100%;
   border-radius:8px;
  }
}
.cta {
  padding-top: 1rem;
  padding-bottom: 0.5rem;
 
}

.cta .cta-inner {
  position: relative;
  padding: 3rem;
  margin: 0.5rem;
  background-color: rgba(74, 145, 191, 0.85);
}

.cta .cta-inner:before {
  border-radius: 0.5rem;
  content: '';
  position: absolute;
  top: -0.5rem;
  bottom: -0.5rem;
  left: -0.5rem;
  right: -0.5rem;
  border: 0.25rem solid rgba(74, 145, 191, 0.85);
}
.cta-text {
  color:white;
  font-family: 'Raleway';
  font-size: 0.8rem;
  font-weight: 400;
}
.cta-text-heading {
  color:white;
  font-family: 'Raleway';
  font-size: 1.0rem;
  font-weight: 600;
}
.chatroom-heading{
  font-family: 'Raleway';
  color: #4A91bf;
  font-size: 1.8rem;
  margin-left: 0.2rem;
  font-weight:600;
  letter-spacing: 0.5rem;
  text-transform: uppercase;
 
}
.chatroom-text{
  font-family: 'Raleway';
  color: black;
  font-size: 1.1rem;
  font: weight 0.9em;
 
}
.chatroom-text-answer{
  font-family: 'Raleway';
  color: black;
  font-size: 1.1rem;
  font: weight 0.9em;
 
}
.bg-chat{
  background-color: greenyellow;
  border-radius: 0.5rem;
  box-shadow: 0.2rem 0.2rem 1rem rgba(0, 0, 0, 0.5);
}
    
.section-page {
  padding-top: 3rem;
}
.section-page .text-header-main{
 
  font-family: 'Raleway';
  color: #525252;
  font-size: 3.0rem;
  font-weight: 400;
  text-transform: uppercase;
}

.section-page .text-headerset-main{
 
  font-family: 'Raleway';
  color: #525252;;
  font-size: 1.0rem;
  font-weight: 400;
}    
    

