/* roboto-300 - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  src: local(''),
       url('/assets/fonts/roboto-v30-latin-300.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/assets/fonts/roboto-v30-latin-300.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* roboto-regular - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: local(''),
       url('/assets/fonts/roboto-v30-latin-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/assets/fonts/roboto-v30-latin-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

.testbox {
  height: 50px;
  background-color: red; }

body {
  position: relative;
  color: #3e3e3e;
  background-color: #ffffff;
  font-family: 'Roboto', sans-serif;
  font-size: 20px;
  font-weight: 300;
  line-height: normal;
  margin-top: 118px; }

a {
  text-decoration: none; }
  a:hover {
    text-decoration: none; }

section {
  padding-left: 8px;
  padding-right: 8px; }

@media (min-width: 1360px) {
  .offset-xl-1 {
    margin-left: 10%; }
  .offset-xl-2 {
    margin-left: 20%; }
  .offset-xl-3 {
    margin-left: 30%; }
  .offset-xl-4 {
    margin-left: 40%; }
  .col-xl-1 {
    -ms-flex: 0 0 10%;
    flex: 0 0 10%;
    max-width: 10%; }
  .col-xl-2 {
    -ms-flex: 0 0 20%;
    flex: 0 0 20%;
    max-width: 20%; }
  .col-xl-3 {
    -ms-flex: 0 0 30%;
    flex: 0 0 30%;
    max-width: 30%; }
  .col-xl-4 {
    -ms-flex: 0 0 40%;
    flex: 0 0 40%;
    max-width: 40%; }
  .col-xl-5 {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%; }
  .col-xl-6 {
    -ms-flex: 0 0 60%;
    flex: 0 0 60%;
    max-width: 60%; }
  .col-xl-7 {
    -ms-flex: 0 0 70%;
    flex: 0 0 70%;
    max-width: 70%; }
  .col-xl-8 {
    -ms-flex: 0 0 80%;
    flex: 0 0 80%;
    max-width: 80%; } }

.col-xs-4 {
  -ms-flex: 0 0 50%;
  flex: 0 0 50%;
  max-width: 50%; }

.col-xs-8 {
  -ms-flex: 0 0 100%;
  flex: 0 0 100%;
  max-width: 100%; }

.pagebg-container {
  background: url("/assets/img/bg/bg01.jpg");
  background-position: center top;
  background-repeat: no-repeat;
  background-size: cover;
  height: 100%;
  position: fixed;
  width: 100%;
  z-index: -99; }

@media (min-width: 1360px) {
  .fts-content {
    margin-top: calc(-557px - 16px); } }

.fts-main {
  padding-top: 20px;
  padding-bottom: 30px; }
  @media (min-width: 768px) {
    .fts-main {
      padding-top: 100px; } }
  @media (min-width: 992px) {
    .fts-main {
      padding-top: 115px; } }

.fts-fotostart-t1 {
  color: #C90C0F;
  font-size: 38px;
  font-weight: 300;
  line-height: 50px;
  padding-top: 50px;
  padding-bottom: 50px;
  padding-left: 0px; }
  .fts-fotostart-t1 strong {
    color: #3E3E3E;
    font-weight: 300; }
  @media (min-width: 992px) {
    .fts-fotostart-t1 {
      float: left;
      width: 50%; } }

.fts-fotostart-t2 {
  background-color: #D1D0D0;
  border-radius: 14px;
  padding: 15px;
  position: relativ;
  top: -110px;
  font-size: 20px;
  font-weight: 300;
  line-height: 26px;
  color: #707070;
  margin-bottom: 40px; }
  .fts-fotostart-t2 strong {
    color: #3E3E3E;
    font-weight: 300; }
  @media (min-width: 992px) {
    .fts-fotostart-t2 {
      background-color: #D1D0D0;
      border-radius: 14px;
      padding: 15px;
      position: relativ;
      top: -110px;
      font-size: 20px;
      font-weight: 300;
      line-height: 26px;
      color: #707070;
      float: left;
      width: 50%;
      position: relative;
      top: -100px; } }

.fts-fotostart-t2-t1 {
  color: #C90C0F;
  font-size: 38px;
  font-weight: 300;
  line-height: 50px;
  padding-top: 0px;
  padding-bottom: 10px;
  color: #C90C0F;
  font-weight: 300; }

.fts-fotostart-t2-t2 {
  color: #3e3e3e; }

.fts-fotostart-t2-a1 {
  display: table;
  margin-left: auto !important;
  margin-right: auto !important; }

.fts-foto-hover-full {
  -webkit-border-radius: 14px;
  -moz-border-radius: 14px;
  border-radius: 14px;
  background-position: center center;
  background-size: cover;
  margin-bottom: 16px; }

.fts-foto-hover-full img {
  display: block;
  width: 100%;
  height: auto;
  -webkit-border-radius: 14px;
  -moz-border-radius: 14px;
  border-radius: 14px; }

.fts-foto-hover-full-overlay {
  position: absolute;
  top: 0;
  left: 8px;
  height: calc(100% - 16px);
  width: calc(100% - 16px);
  opacity: 0;
  transition: .5s ease;
  background-color: rgba(62, 62, 62, 0.7);
  -webkit-border-radius: 14px;
  -moz-border-radius: 14px;
  border-radius: 14px;
  padding: 70px 20px 25px 20px; }
  @media (min-width: 1360px) {
    .fts-foto-hover-full-overlay {
      padding: 110px 30px 35px 30px; } }

.fts-foto-hover-full:hover .fts-foto-hover-full-overlay {
  opacity: 1; }

.fts-foto-hover-full-t1 {
  color: #FFFFFF;
  font-size: 33px;
  line-height: 37px;
  font-weight: 300;
  text-align: center;
  padding-bottom: 40px;
  -ms-hyphens: auto;
  -webkit-hyphens: auto;
  hyphens: auto; }
  @media (min-width: 1360px) {
    .fts-foto-hover-full-t1 {
      font-size: 40px; } }

.fts-foto-hover-full-t2 {
  color: #FFFFFF;
  font-weight: 300;
  font-size: 24px;
  text-align: center;
  height: 100px; }
  @media (min-width: 1360px) {
    .fts-foto-hover-full-t2 {
      font-size: 30px; } }

.fts-foto-hover-full-a1 {
  font-size: 20px;
  font-weight: 300;
  text-decoration: none;
  color: #41B5F2; }

.fts-fotooverlay-left {
  -webkit-border-radius: 14px;
  -moz-border-radius: 14px;
  border-radius: 14px;
  background-position: center center;
  background-size: cover;
  margin-bottom: 16px; }
  @media (min-width: 1360px) {
    .fts-fotooverlay-left {
      -webkit-border-radius: 14px 0 0 14px;
      -moz-border-radius: 14px 0 0 14px;
      border-radius: 14px 0 0 14px; } }

.fts-fotooverlay-left img {
  display: block;
  width: 100%;
  height: auto;
  -webkit-border-radius: 14px;
  -moz-border-radius: 14px;
  border-radius: 14px; }

.fts-fotooverlay-left-overlay {
  background-color: rgba(62, 62, 62, 0.7);
  -webkit-border-radius: 14px;
  -moz-border-radius: 14px;
  border-radius: 14px;
  padding-bottom: 16px;
  padding: 110px 30px 35px 30px;
  text-align: center; }
  @media (min-width: 768px) {
    .fts-fotooverlay-left-overlay {
      padding: 30px 30px 30px 30px;
      width: 50%;
      margin-left: auto;
      -webkit-border-radius: 0;
      -moz-border-radius: 0;
      border-radius: 0; } }
  @media (min-width: 1360px) {
    .fts-fotooverlay-left-overlay {
      padding: 30px 30px 30px 30px;
      width: 40%;
      margin-left: auto;
      -webkit-border-radius: 0;
      -moz-border-radius: 0;
      border-radius: 0; } }

.fts-fotooverlay-left-overlay-t1 {
  color: #FFFFFF;
  font-size: 40px;
  line-height: 47px;
  font-weight: 300;
  padding-bottom: 40px;
  -ms-hyphens: auto;
  -webkit-hyphens: auto;
  hyphens: auto;
  text-align: center; }

.fts-fotooverlay-left-overlay-t2 {
  color: #FFFFFF;
  font-weight: 300;
  font-size: 20px;
  line-height: 26px;
  text-align: left;
  padding-bottom: 32px; }

.fts-fotooverlay-left-overlay-a1 {
  background-color: #C90C0F;
  color: #FFF;
  font-size: 20px;
  font-weight: 300;
  text-decoration: none;
  border-radius: 14px;
  padding: 8px 40px; }

.fts-fotohoveroverlay-full {
  min-height: 358px;
  height: calc(100% - 16px);
  -webkit-border-radius: 14px;
  -moz-border-radius: 14px;
  border-radius: 14px;
  background-position: center center;
  background-size: cover;
  margin-bottom: 16px; }

.fts-fotohoveroverlay-full-grey-t1 {
  padding: 30px;
  background-color: #D1D0D0;
  border-radius: 14px;
  color: #3E3E3E;
  min-height: 358px;
  font-weight: 300;
  font-size: 20px;
  line-height: 26px;
  text-align: left; }

.fts-fotohoveroverlay-full-overlay {
  position: absolute;
  top: 0;
  left: 8px;
  height: calc(100% - 16px);
  width: calc(100% - 16px);
  opacity: 0;
  transition: .5s ease;
  background-color: rgba(62, 62, 62, 0.7);
  -webkit-border-radius: 14px;
  -moz-border-radius: 14px;
  border-radius: 14px;
  padding-bottom: 16px;
  padding: 110px 30px 35px 30px; }

.fts-fotohoveroverlay-full:hover .fts-fotohoveroverlay-full-overlay {
  opacity: 1; }

.fts-fotohoveroverlay-full-overlay-t1 {
  color: #FFFFFF;
  font-weight: 300;
  font-size: 20px;
  line-height: 26px;
  text-align: left;
  position: absolute;
  width: calc(100% - 120px);
  bottom: 60px;
  left: 60px; }

.fts-fotooverlay-unten {
  -webkit-border-radius: 14px;
  -moz-border-radius: 14px;
  border-radius: 14px;
  background-position: center center;
  background-size: cover;
  margin-bottom: 16px;
  background-image: url(/assets/img/cnc-fraesen/fts-cnc-fraesen-praezisionsbearbeitungen.jpg); }
  @media (min-width: 1360px) {
    .fts-fotooverlay-unten {
      -webkit-border-radius: 14px;
      -moz-border-radius: 14px;
      border-radius: 14px; } }

.fts-fotooverlay-unten-overlay {
  position: absolute;
  background-color: rgba(62, 62, 62, 0.7);
  width: calc(100% - 16px);
  bottom: 16px;
  -webkit-border-radius: 0 0 14px 14px;
  -moz-border-radius: 0 0 14px 14px;
  border-radius: 0 0 14px 14px; }
  @media (min-width: 1360px) {
    .fts-fotooverlay-unten-overlay {
      position: absolute;
      background-color: rgba(62, 62, 62, 0.7);
      width: calc(100% - 16px);
      bottom: 16px; } }

.fts-fotooverlay-unten-overlay-t1 {
  color: #FFFFFF;
  font-weight: 300;
  font-size: 20px;
  line-height: 26px;
  text-align: left;
  padding: 30px 65px 20px 65px; }

.fts-fotooverlay-unten-overlay-h1 {
  height: 245px;
  max-height: 245px; }

.fts-fotooverlay-unten-overlay-h2 {
  height: 365px;
  max-height: 365px; }

.fts-fotooverlay-unten-overlay-h3 {
  height: 450px;
  max-height: 450px; }

.fts-fotooverlay-unten-overlay-h4 {
  height: 540px;
  max-height: 540px; }

.fts-fotooverlay-unten2 {
  height: 538px;
  -webkit-border-radius: 14px 14px 0 0;
  -moz-border-radius: 14px 14px 0 0;
  border-radius: 14px 14px 0 0;
  background-position: center center;
  background-size: cover;
  margin-bottom: 16px; }
  @media (min-width: 1360px) {
    .fts-fotooverlay-unten2 {
      -webkit-border-radius: 14px 14px 0 0;
      -moz-border-radius: 14px 14px 0 0;
      border-radius: 14px 14px 0 0; } }

.fts-fotooverlay-unten2-overlay {
  -webkit-border-radius: 14px 14px 0 0;
  -moz-border-radius: 14px 14px 0 0;
  border-radius: 14px 14px 0 0;
  position: absolute;
  background-color: rgba(62, 62, 62, 0.7);
  width: calc(100% - 16px);
  bottom: 16px; }
  @media (min-width: 768px) {
    .fts-fotooverlay-unten2-overlay {
      -webkit-border-radius: 0;
      -moz-border-radius: 0;
      border-radius: 0; } }
  @media (min-width: 1360px) {
    .fts-fotooverlay-unten2-overlay {
      position: absolute;
      background-color: rgba(62, 62, 62, 0.7);
      width: calc(100% - 16px);
      bottom: 16px;
      -webkit-border-radius: 0;
      -moz-border-radius: 0;
      border-radius: 0 0 14px 14px; } }

.fts-fotooverlay-unten2-overlay-t1 {
  width: 100%;
  float: left;
  color: #FFFFFF;
  font-size: 40px;
  line-height: 40px;
  font-weight: 300;
  text-align: center;
  padding: 10px 0 10px 0;
  -ms-hyphens: auto;
  -webkit-hyphens: auto;
  hyphens: auto; }
  @media (min-width: 768px) {
    .fts-fotooverlay-unten2-overlay-t1 {
      width: 33%;
      padding: 15px 0 40px 0;
      line-height: 47px; } }

.fts-fotooverlay-unten2-overlay-t2 {
  width: 100%;
  float: left;
  color: #FFFFFF;
  font-weight: 300;
  font-size: 20px;
  text-align: left;
  padding: 10px 25px 10px 25px; }
  @media (min-width: 768px) {
    .fts-fotooverlay-unten2-overlay-t2 {
      width: 66%;
      padding: 30px 65px 20px 65px; } }

.section-startproject {
  background-color: #EDEBEB;
  padding-top: 20px;
  padding-bottom: 20px; }
  @media (min-width: 992px) {
    .section-startproject {
      padding: 30px 0 80px 0; } }

.fts-startproject-1 {
  min-height: 350px;
  border: none;
  -webkit-border-radius: 14px;
  -moz-border-radius: 14px;
  border-radius: 14px; }
  @media (min-width: 992px) {
    .fts-startproject-1 {
      min-height: 350px;
      border: 2px solid #C90C0F; } }

.fts-startproject-2 {
  padding: 20px 15px 25px 15px;
  min-height: 350px;
  border: 2px solid #C90C0F;
  background-color: #ffffff;
  -webkit-border-radius: 14px;
  -moz-border-radius: 14px;
  border-radius: 14px; }
  @media (min-width: 992px) {
    .fts-startproject-2 {
      padding: 30px 45px 45px 45px;
      position: relative;
      top: 20px;
      left: calc(12.5% + 20px);
      min-height: 350px;
      border: none; } }

.fts-startproject-t1 {
  color: #C90C0F !important;
  font-size: 30px;
  font-weight: 300;
  line-height: 50px;
  padding-top: 0px;
  padding-bottom: 10px;
  padding-left: 0px; }
  @media (min-width: 992px) {
    .fts-startproject-t1 {
      font-size: 38px; } }

.fts-startproject-t2 {
  color: #3E3E3E;
  font-weight: 300;
  font-size: 20px;
  line-height: 26px;
  text-align: left;
  padding: 0; }

.fts-startproject-a1 {
  padding-top: 20px;
  text-align: right; }

.fts-startproject-a1 a {
  display: block;
  background-color: #FFF;
  color: #C90C0F;
  font-size: 13px;
  font-weight: 300;
  text-decoration: none;
  border-radius: 14px;
  border: 2px solid #C90C0F;
  padding: 8px 40px;
  text-align: center; }
  @media (min-width: 576px) {
    .fts-startproject-a1 a {
      display: inline; } }
  @media (min-width: 992px) {
    .fts-startproject-a1 a {
      display: inline;
      font-size: 20px; } }

.fts-fotolappen-unten {
  -webkit-border-radius: 14px 14px 0 0;
  -moz-border-radius: 14px 14px 0 0;
  border-radius: 14px 14px 0 0;
  margin: 0 0 50px 0; }
  @media (min-width: 992px) {
    .fts-fotolappen-unten {
      margin-bottom: -100px; } }

.fts-fotolappen-unten-f1 {
  -webkit-border-radius: 14px;
  -moz-border-radius: 14px;
  border-radius: 14px; }

.fts-teaser {
  color: #C90C0F;
  font-size: 28px;
  font-weight: 300;
  line-height: 34px;
  padding-top: 50px;
  padding-bottom: 50px; }
  .fts-teaser strong {
    color: #3E3E3E;
    font-weight: 300; }
  @media (min-width: 768px) {
    .fts-teaser {
      font-size: 38px;
      line-height: 50px; } }

.fts-foto-text-1 {
  padding-bottom: 60px;
  background-color: #ffffff;
  -webkit-border-radius: 14px 14px 0 0;
  -moz-border-radius: 14px 14px 0 0;
  border-radius: 14px 14px 0 0; }

.fts-foto-text-2 {
  padding: 10px 15px 15px 15px;
  background-color: #ffffff;
  -webkit-border-radius: 0 0 14px 14px;
  -moz-border-radius: 0 0 14px 14px;
  border-radius: 0 0 14px 14px; }
  @media (min-width: 992px) {
    .fts-foto-text-2 {
      padding: 30px 45px 65px 45px; } }

.fts-foto-text-f1 {
  -webkit-border-radius: 14px;
  -moz-border-radius: 14px;
  border-radius: 14px; }

.fts-foto-text-t1 {
  color: #C90C0F !important;
  font-size: 28px;
  font-weight: 300;
  line-height: 30px;
  padding-top: 0px;
  padding-bottom: 10px;
  padding-left: 0px; }
  @media (min-width: 992px) {
    .fts-foto-text-t1 {
      font-size: 38px;
      line-height: 47px; } }

.fts-foto-text-t2 {
  color: #3E3E3E;
  font-weight: 300;
  font-size: 20px;
  line-height: 26px;
  text-align: left;
  padding: 0 0 20px 0; }

.fts-foto-text-a1 {
  padding-bottom: 30px; }
  @media (min-width: 992px) {
    .fts-foto-text-a1 {
      float: right; } }

.fts-foto-text-a1 a {
  background-color: #FFF;
  color: #C90C0F;
  font-size: 20px;
  font-weight: 300;
  text-decoration: none;
  border-radius: 14px;
  border: 2px solid #C90C0F;
  padding: 8px 40px; }
  @media (min-width: 1360px) {
    .fts-foto-text-a1 a {
      font-size: 20px; } }

.header-navi {
  position: fixed;
  top: 0;
  height: 60px;
  width: 100%;
  z-index: 99;
  background-image: url(/assets/img/bg/bghead.png);
  background-position: center bottom; }
  @media (min-width: 992px) {
    .header-navi {
      height: 118px; } }

.header-navi-mobile {
  height: 67px;
  background-color: rgba(255, 255, 255, 0.4);
  position: absolute;
  top: 140px;
  z-index: 98;
  padding-left: 16px;
  padding-right: 16px;
  display: none; }
  @media (min-width: 768px) {
    .header-navi-mobile {
      height: 137px;
      top: 60px;
      display: block; } }
  @media (min-width: 992px) {
    .header-navi-mobile {
      height: 67px;
      top: 118px;
      display: block; } }
  @media (min-width: 1360px) {
    .header-navi-mobile {
      display: none; } }

.header-navi-mobile2 {
  padding-left: 16px;
  padding-right: 16px;
  display: block; }
  @media (min-width: 768px) {
    .header-navi-mobile2 {
      display: none; } }

.header-navi-logo {
  width: 172px;
  margin-top: 22px;
  border-radius: 8px;
  box-shadow: 0px 1px 12px #000000;
  z-index: 100; }
  @media (min-width: 768px) {
    .header-navi-logo {
      width: 100%;
      max-width: 267px; } }

.header-navi-btn, .header-navi-btn-l, .header-navi-btn-r {
  float: right;
  border-radius: 8px;
  background-color: #D1D0D0;
  font-size: 17px;
  font-weight: 300;
  line-height: 26px;
  color: #C90C0F;
  padding: 11px 5px;
  text-align: center;
  box-shadow: 0px 3px 3px silver;
  margin-left: 0;
  margin-right: 0;
  width: 100%; }
  .header-navi-btn:hover, .header-navi-btn-l:hover, .header-navi-btn-r:hover {
    background-color: #C90C0F;
    color: #FFFFFF; }
  .header-navi-btn.aktiv, .aktiv.header-navi-btn-l, .aktiv.header-navi-btn-r {
    background-color: #C90C0F;
    color: #FFFFFF; }

.header-navi-btn-l {
  margin-left: 0;
  margin-right: 0; }

.header-navi-btn-r {
  margin-left: 0;
  margin-right: 0; }

.navi {
  float: right;
  list-style-type: none;
  margin: 0;
  padding: 0;
  padding-top: 70px;
  display: none; }
  @media (min-width: 1360px) {
    .navi {
      display: block; } }

.navi-lev {
  float: left;
  display: block;
  margin: 0;
  padding: 0;
  font-size: 17px;
  font-weight: 300;
  color: #3E3E3E;
  line-height: 48px; }
  .navi-lev a {
    padding: 0 0 0 40px;
    font-size: 17px;
    font-weight: 300;
    color: #3E3E3E;
    line-height: 48px; }
  .navi-lev:hover a {
    color: #C90C0F; }

.navi-section {
  position: -webkit-sticky;
  position: sticky;
  top: 233px;
  height: calc(557 + 16px);
  display: none;
  margin-bottom: 16px; }
  @media (min-width: 1360px) {
    .navi-section {
      display: block; } }

.navi-box {
  height: 175px;
  background-color: #D1D0D0;
  padding: 35px 15px 31px 15px;
  text-align: center;
  border-radius: 14px;
  color: #bbbbbb; }
  .navi-box:hover {
    background-color: #C90C0F; }
    .navi-box:hover .navi-box-t1 {
      color: #FFFFFF; }
    .navi-box:hover .navi-box-t2 {
      color: #D1D0D0; }
  .navi-box.aktiv {
    background-color: #C90C0F; }
    .navi-box.aktiv .navi-box-t1 {
      color: #FFFFFF; }
    .navi-box.aktiv .navi-box-t2 {
      color: #D1D0D0; }

.navi-box-t1 {
  color: #C90C0F;
  font-weight: 300;
  font-size: 28px;
  line-height: 28px; }

.navi-box-t2 {
  color: #3E3E3E;
  font-weight: 300;
  font-size: 20px; }

.navi-box-btm-gutter {
  margin-bottom: 16px; }

.footer {
  color: #FFF;
  background-color: #747474;
  font-size: 14px;
  font-weight: 300;
  line-height: 20px;
  text-align: center;
  padding: 5px; }

@media (min-width: 576px) {
  .container {
    max-width: 768px; } }

@media (min-width: 768px) {
  .container {
    max-width: 992px; } }

@media (min-width: 992px) {
  .container {
    max-width: 1360px; } }

@media (min-width: 1360px) {
  .container {
    max-width: 1360px; } }