body, html { width: 100%; height: 100%; font-family: 'Roboto', sans-serif; color: #777a7b; font-size: 15px;}


/* montserrat-700 - latin */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-display: swap;
  font-weight: 700;
  src: local(''),
       url('../fonts/montserrat-v23-latin-700.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('../fonts/montserrat-v23-latin-700.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* roboto-300 - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-display: swap;
  font-weight: 300;
  src: local(''),
       url('../fonts/roboto-v29-latin-300.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('../fonts/roboto-v29-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-display: swap;
  font-weight: 400;
  src: local(''),
       url('../fonts/roboto-v29-latin-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('../fonts/roboto-v29-latin-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}


/*HEADER*/
.header {
    background: #2b2e34 none repeat scroll 0 0;
    border-bottom: 2px solid #eee;
    position: relative;
    z-index: 99;
}

.carousel-caption {bottom: 240px !important;}
.carousel-inner > .item > a > img, .carousel-inner > .item > img, .img-responsive, .thumbnail a > img, .thumbnail > img { width: 100%; }
h1.text{text-align: left;color: #fb3099; font-size: 50px; font-family: 'Montserrat', sans-serif;}


/*NAVBAR*/
.navbar{padding: 10px 0 10px; min-height: 110px; background-color: #2b2e34;}
.navbar > .container .navbar-brand, .navbar > .container-fluid .navbar-brand { margin-left: 0px;}
.navbar .nav{ margin: 6px 0 -5px 0;  text-transform: uppercase;}
.navbar .nav > li > a:hover, .navbar > li > a:focus {background-color: rgba(51, 51, 51, 0.8); text-transform: uppercase;}


/*.navbar.affix {background-color: rgba(51, 51, 51, 0.8); border-color: rgba(51, 51, 51, 1); min-height: 60px; -webkit-transition: all 1s; -moz-transition: all 1s; transition: all 1s;}
.navbar.affix .navbar-brand img{width: 155px;  -webkit-transition: all 1s; -moz-transition: all 1s; transition: all 1s;}*/
.navbar.affix .navbar-nav > li > a {color: white;}
.navbar.affix .nav  > li > a:hover, .navbar.affix .nav > li > a:focus {background-color: #00b8f1;}
.navbar.affix .phone{display: none;}


@media (max-width: 768px) {
	.navbar { padding: 0px; min-height: 60px;}
	.navbar-brand{margin-left: 30px !important;}
    .navbar .nav{ margin: 15px 0 0 0;}
    .nav > li {padding-left: 0px !important;}
}

.navbar-nav > li > a {color: #FFF; text-decoration: none; font-size: 16px;}
.navbar-brand{ padding: 0px; margin-left: 0px;}

.navbar-toggle { border: 1px solid #00b8f1; }
.navbar-toggle .icon-bar { background-color: #00b8f1;}
@media (max-width: 480px) {
    .navbar-brand img { max-width: 200px;}
}


/*Banner*/
.parallax-window { min-height: 600px; position: relative;}


@media (max-width: 768px) {
    .parallax-window { min-height: 350px; }
}

/*Ãœberschriften*/
h1, h2, h3{
  margin: 0px;
  padding: 0px;
  font-family: 'Roboto', sans-serif;
  word-break: break-word;
  -webkit-hyphens: auto;
  -moz-hyphens: auto;
  -ms-hyphens: auto;
  -o-hyphens: auto;
  hyphens: auto;
}
h1{color: #2b2e34; font-size: 28px; text-transform: uppercase;letter-spacing: 2px;}
h2{margin-bottom: 10px; font-size: 20px;letter-spacing: 1px; text-transform: uppercase; color: #2b2e34;}





h1.headline{color: #2b2e34; font-size: 40px; font-family: 'Roboto', sans-serif; font-weight: 300;}
@media (max-width: 768px) {
    h1.headline{font-size: 30px;}
}



.lead{font-family: 'Roboto', sans-serif; font-weight: normal; line-height: 2.5; font-size: 16px;}
.box_lead{font-family: 'Roboto', sans-serif; font-weight: 300; line-height: 2.5; font-size: 14px;}

/*CONTENT*/
figure{margin: 0; padding:0;}

a{color: #2b2e34;}
a:hover, a:focus{color: #333; text-decoration: none;}
section{padding: 80px 0 50px 0;}
section.default-padding { padding-top: 50px; }
p{line-height: 33px; letter-spacing: 0.3px;}
.no-gutter > [class*=col-] { padding-right: 0; padding-left: 0;}
.no-padding{padding: 0px;}
.margin-top-30{margin-top: 30px;}


.icon{ border-radius: 50% !important; font-size: 31px; height: 60px; line-height: 50px; margin-bottom: 15px; width: 60px; text-align: center; display: inline-block;}
.blue {border: 6px solid #00b8f1;  color: #00b8f1;}
.magenta {border: 6px solid #fb3099;  color: #fb3099;}
.yellow {border: 6px solid #ffea3d;  color: #ffea3d;}
.white{color: #fff;}

.grow-rotate {box-shadow: 0 0 1px rgba(0, 0, 0, 0); display: inline-block; transform: translateZ(0px); transition-duration: 0.3s; transition-property: transform;}
.grow-rotate:hover{transform: scale(1.1) rotate(4deg);}

.bg-gray{background-color: #f4f4f5;}
.bg-white{background-color: #fff;}

    /*INTRO*/
    .intro{margin-top: -100px;}
    @media (max-width: 768px) {
            .intro{margin-top: 0px;}
        }
    .intro-box_1{background-color: #fff; padding: 25px 35px; margin: 0 5px 0 0;}
        @media (max-width: 768px) {
            .intro-box_1{margin: 0 5px 25px 5px;}
        }
    .intro-box_1 i{color: #00b8f1;}

    .intro-box_2{ background-color: #fff;padding: 25px 35px; margin: 0 5px;}
    .intro-box_2 i{color: #fb3099;}

    .intro-box_3{background-color: #fff;padding: 25px 35px; margin: 0 0px 0 5px;}
        @media (max-width: 768px) {
            .intro-box_3{margin: 25px 5px 0 5px;}
        }
    .intro-box_3 i{color: #ffea3d;}




.box{border: 1px solid #e9e9e9; background-color: #fff;}
.box:hover{box-shadow: 0 0 8px #eee; -webkit-box-shadow:0 0 8px #eee; -moz-box-shadow: 0 0 8px #eee; }



/*Feature*/
.feature-box h3{letter-spacing: 0; font-weight: 300; font-size:20px;}
.feature-box {padding: 55px;}
.feature-box i{display: inline-block; text-align: center}
.feature-box i.magenta{color: #fb3099; border: 0px;}
.feature-box i.yellow{color: #ffea3d; border: 0px;}
.feature-box i.blue{color: #00b8f1; border: 0px;}
.feature-box li{margin-bottom: 10px;}


/*Druckerei*/
.printing_box{padding: 25px;  transition: all 0.4s ease 0s;}
.printing_box:hover{background-color: #00b8f1; color: #fff;  transform: translate3d(0px, -15px, 0px)}
.printing_box:hover .blue{border: 6px solid #fff;  color: #fff;}
.printing_box a{color: #777a7b;}
.printing_box:hover h2, .printing_box:hover a{color: #FFF;}

@media (max-width: 768px) {
    .printing_box{margin-top: 25px;}
}


/*CopyShop*/
.copy{ padding-top: 15px;}
.copy_box{padding:25px 0 25px 0; color: #2b2e34!important;}
.copy_box a{color: #2b2e34;}
.copy_box .light_box{padding: 25px; background-color: rgba(255, 255, 255, 0.4);}
.copy_box .box{padding: 25px 25px 10px 25px;  background-color: rgba(255, 255, 255, 0.8);}

.copy figure{position: relative;}
.copy figcaption{position: absolute; bottom: 15px; background-color: rgba(0,0,0,0.7); padding: 7px 10px 0 10px}

@media (max-width: 768px) {
    .copy{margin-top: 25px;}
}




/*Mitteilungsblätter*/
.message_box{padding:25px; transition: all 0.4s ease 0s;}
.message_box a{color: #777a7b;}
.message_box:hover{background-color: #ffea3d; color: #2b2e34; transform: translate3d(0px, -15px, 0px)}
.message_box:hover .yellow{border: 6px solid #2b2e34;  color: #2b2e34;}

@media (max-width: 768px) {
    .message_box{margin-top: 25px;}
}