@charset "UTF-8"; 
 /**
 *
 * @copyright       Copyright 2013, Daniel Raßbach
 *
 * @link            http://www.rasani.de
 * @lastmodified    $Date: 2013-03-28 14:00:00 +0100 $
 * @created         2013-03-28 14:00:00 +0100
 */

/*###################################################
 *                                                  *
 *                  General Elements                *
 *                                                  *
 ###################################################*/
@import url(http://fonts.googleapis.com/css?family=Droid+Sans:400,700);

.hidden {
  display: none;
}
body {
  background-color: #F6F3ED;
  color:#444;
  font-family: 'Droid Sans', sans-serif;
}
h1, h2, h3, h4, h5 {
  font-family: 'Droid Sans', sans-serif;
  font-weight:700;
  letter-spacing:-0.5px;
}
h1 {
  font-size:2.4em;
}
h2 {
  font-size:2em;
}
h3 {
  font-size:1.8em;
}
h4 {
  font-size:1.5em;
}
h5 {
  font-size:1.25em;
}


.fl {
  float:left;
}
.fr {
  float:right;
}
.clear {
  clear:both;
}
ul {
  list-style-type: square;
}

ul.check {
 list-style-image:url('vhs-assets-css-9ec179b144a1aa0338fd9247b43b73a8.png'); 
}

.book-img img {
  width:100%;
  height:auto;
}
.book-img h2 {
  font-size:1.6em;
}

/*###################################################
 *                                                  *
 *                  Navigation Elements             *
 *                                                  *
 ###################################################*/

nav.navbar {
  min-height: 40px;
  padding-right: 20px;
  padding-left: 20px;
  background-color: transparent;
  background: url('img/theke_komplett.png') no-repeat;
  border: 0px solid transparent;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  height: 330px;
} 
.navbar-default .navbar-collapse, .navbar-default .navbar-form {
  background-color:transparent;
  top:100px;
  position:relative;
}
nav.navbar > .container {
  top: 200px;
  position: relative;
  padding: 0 15px;
}
.navbar-default .navbar-brand {
  float:none;
  padding:0;
  top:30px;
  position:relative;
}
.navbar-header {
  float:none; 
}

/* FIX for Overlaping NavbarToggle */

.fr.phone {
    margin-bottom: 9em;
}

.navbar .nav>li>a {
  float: none;
  padding: 0px 20px;
  margin-top:10px;
  color: #fff;
  text-decoration: none;
  text-shadow: none;
  text-transform: uppercase;
  border-right:1px solid #666;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
.navbar .nav>li:last-child>a {
  border:none;
}

.navbar .nav>li>a:focus, .navbar .nav>li>a:hover, .navbar .nav>.active>a, .navbar .nav>.active>a:hover, .navbar .nav>.active>a:focus {
  color: #fff;
  text-decoration: none;
  background-color: transparent;
  box-shadow:none;
  text-shadow: 0 0 10px #fff;
  moz-text-shadow: 0 0 10px #fff;
  webkit-text-shadow: 0 0 10px #fff;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
.navtext {
  position:relative;
  top:125px;
  font-size:1.2em;
}
.orange {
  color: #fd8610;
}
.black {
  color: #000000;
}

.phone:before {
  content:'';
  position:absolute;
  background:url('vhs-assets-css-578490e8180404f34f1a23221ee536f2.png')no-repeat left top;
  width:50px;
  height:70px;
  margin-left:-40px;
}  

a:hover {
  text-decoration:none;
}

/*###################################################
 *                                                  *
 *                  Header Elements                 *
 *                                                  *
 ###################################################*/

.hero-unit {
  padding: 0;
  margin-bottom: 0;
  font-size: 18px;
  font-weight: 200;
  line-height: 30px;
  color: inherit;
  background-color: transparent;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
}

/*###################################################
 *                                                  *
 *                  Content Elements                *
 *                                                  *
 ###################################################*/

#content {
 padding-bottom:50px; 
}

#content img.size-full {
  width:100%;
  height:auto;
}

#content .csc-textpic-imagecolumn img {
  width:48%;
  hight:auto;
  margin-right:5px;
}
div#sidebar {
  background:url('vhs-assets-css-cccd0fe2173371e9b22398243d2b9562.png') no-repeat top center;
  background-size:contain;
  width: 190px;
  height: 390px;
  margin-left:20px;
}
div#sidebar > .content {
  padding: 120px 20px 0 25px;
  font-size: 0.9em;
}
.infobox-link, .click {
  padding: 4px 8px 4px 14px;
  position:relative;
  z-index: 1;
  color: #ffffff;
  cursor: pointer;
  float: left;
}
.infobox-link:hover, .click:hover {
  color:#fff;
  text-shadow:0 0 10px #fff;
  moz-text-shadow: 0 0 10px #fff;
  webkit-text-shadow: 0 0 10px #fff;
}
a.active {
  color: #fe8512;
}

p.versand-01 {
  font-weight: bold;
  font-size: 155%;
  color: #FD8610;
  letter-spacing: 1px;
  margin: 0;
}
p.versand-02 {
  font-weight: bold;
  font-size: 110%;
  color: #FD8610;
  letter-spacing: 1px;
  float: left;
  margin: 0;
}
p.versand-03 {
  font-size: 110%;
  color: #666666;
  margin: 0;
}
p.versand-info {
  font-size: 91%;
  margin: 0;
}

/* INFOBOX */

.infobox {
  display: none;
  background: rgb(228,228,228);
  background: -moz-linear-gradient(top, rgba(228,228,228,1) 0%, rgba(246,243,238,1) 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(228,228,228,1)), color-stop(100%,rgba(246,243,238,1)));
  background: -webkit-linear-gradient(top, rgba(228,228,228,1) 0%,rgba(246,243,238,1) 100%);
  background: -o-linear-gradient(top, rgba(228,228,228,1) 0%,rgba(246,243,238,1) 100%);
  background: -ms-linear-gradient(top, rgba(228,228,228,1) 0%,rgba(246,243,238,1) 100%);
  background: linear-gradient(to bottom, rgba(228,228,228,1) 0%,rgba(246,243,238,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e4e4e4', endColorstr='#f6f3ee',GradientType=0 );
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
  border-top-right-radius: 0px;
  border-top-left-radius: 0px;
  position: relative;
  z-index: 2;
  top: -5px;
  height:0;
  padding: 0 10px;
  margin: 13px 15px 10px 15px;
}
.infobox.active { 
  border:1px solid #A3A3A3;
}

.infobox ul li {
  list-style-image: url('vhs-assets-css-6ef36a08744a85eda1f05cc2acf70f67.png');
}

.box {
  margin: 0 0 20px 0;
}

.renderBox {
  background: rgb(195,195,195); /* Old browsers */
  background: -moz-linear-gradient(top, rgba(195,195,195,1) 0%, rgba(163,163,163,1) 99%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(195,195,195,1)), color-stop(99%,rgba(163,163,163,1))); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, rgba(195,195,195,1) 0%,rgba(163,163,163,1) 99%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, rgba(195,195,195,1) 0%,rgba(163,163,163,1) 99%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top, rgba(195,195,195,1) 0%,rgba(163,163,163,1) 99%); /* IE10+ */
  background: linear-gradient(to bottom, rgba(195,195,195,1) 0%,rgba(163,163,163,1) 99%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c3c3c3', endColorstr='#a3a3a3',GradientType=0 ); /* IE6-9 */
  border-radius: 0px 8px 8px 8px;
  padding: 0;
  position:relative;
}

.active > .renderBox {
  border-radius: 0;
}

.active > .renderBox * {
  border-radius: 0;
}

.active > .renderBox:after {  
  background-color: #E5E5E5;
  bottom: -14px;
  content: " ";
  height: 14px;
  left: 0;
  position: absolute;
  width: 100%;
  border:1px solid #A3A3A3;
  border-top:0; border-bottom: 0;
  z-index:3;
}
.kalkulieren {
  background: rgb(164,164,164); /* Old browsers */
  background: -moz-linear-gradient(top, rgba(164,164,164,1) 0%, rgba(93,93,93,1) 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(164,164,164,1)), color-stop(100%,rgba(93,93,93,1))); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, rgba(164,164,164,1) 0%,rgba(93,93,93,1) 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, rgba(164,164,164,1) 0%,rgba(93,93,93,1) 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top, rgba(164,164,164,1) 0%,rgba(93,93,93,1) 100%); /* IE10+ */
  background: linear-gradient(to bottom, rgba(164,164,164,1) 0%,rgba(93,93,93,1) 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a4a4a4', endColorstr='#5d5d5d',GradientType=0 ); /* IE6-9 */
  padding: 4px 20px 4px 20px;
  border-radius: 8px;
  position: relative;
  z-index: 3;
  color: #ffffff;
  margin-left: 8px;
  float: right;
}
.kalkulieren:hover {
  text-decoration:none;
  color:#fff;
  background: #fcfcfc; /* Old browsers */
  background: -moz-linear-gradient(top,  #fcfcfc 0%, #feb973 2%, #fd8610 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fcfcfc), color-stop(2%,#feb973), color-stop(100%,#fd8610)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top,  #fcfcfc 0%,#feb973 2%,#fd8610 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top,  #fcfcfc 0%,#feb973 2%,#fd8610 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top,  #fcfcfc 0%,#feb973 2%,#fd8610 100%); /* IE10+ */
  background: linear-gradient(to bottom,  #fcfcfc 0%,#feb973 2%,#fd8610 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfcfc', endColorstr='#fd8610',GradientType=0 ); /* IE6-9 */
  text-shadow:0 0 10px #fff;
}

div.cover {
  background: none repeat scroll 0 0 #FFFFFF;
  color: #000000;
  display: block;
  height: auto;
  opacity: 0.7;
  position: absolute;
  top: 136px;
  width: 100%;
}
div.captionfull {
  color: #000;
  background:#fff;
  height: 170px;
  overflow: hidden;
  padding: 0;
  position: relative;
  text-align: left;
  width: 100%;
}

div.captionfull2 {
  color: #000;
  height: 225px;
  overflow: hidden;
  padding: 0;
  position: relative;
  text-align: left;
  width: 100%;
}
div.captionfull2 img {
  height:auto;
  width: 100%;
}


div.cover2 {
  background: none repeat scroll 0 0 #FFF;
  color: #000;
  display: block;
  height: 90px;
  opacity: 0.7;
  position: absolute;
  top: 165px;
  width: 100%;
}
div.title {
  color:#000000;
  font-size: 1.1em;
  font-weight: bold;
  margin: 0px 3px 3px 10px;
  letter-spacing: -0.071em;
}

div.title2 {
  color:#000000;
  font-size: 1.5em;
  font-weight: bold;
  margin: 5px 3px 0px 10px;
}

div.notiz {
  font-size: 0.9em;
  margin: -8px 5px 5px 10px;
}

div.notiz2 {
  font-size: 1.2em;
  margin: -5px 5px 5px 10px;
}

div.link {
  margin: 100px 10px 10px 150px;
}
div.link a {
  background: transparent;
}
div#c248 div.ym-gbox {
  margin-left: 14px;
  margin-right: 14px;
}

div.captionfull:hover div.title {
  color:#e59114;
}

div.captionfull2:hover div.title2 {
  color:#e59114;
}

/* accordion */

.panel-heading {
  background: #d3d4d5; /* Old browsers */
  background: -moz-linear-gradient(left,  #d3d4d5 0%, #f7f7f7 5%, #f7f7f7 95%, #d3d4d5 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, right top, color-stop(0%,#d3d4d5), color-stop(5%,#f7f7f7), color-stop(95%,#f7f7f7), color-stop(100%,#d3d4d5)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(left,  #d3d4d5 0%,#f7f7f7 5%,#f7f7f7 95%,#d3d4d5 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(left,  #d3d4d5 0%,#f7f7f7 5%,#f7f7f7 95%,#d3d4d5 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(left,  #d3d4d5 0%,#f7f7f7 5%,#f7f7f7 95%,#d3d4d5 100%); /* IE10+ */
  background: linear-gradient(to right,  #d3d4d5 0%,#f7f7f7 5%,#f7f7f7 95%,#d3d4d5 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d3d4d5', endColorstr='#d3d4d5',GradientType=1 ); /* IE6-9 */
}
.panel-heading:hover {
  color:#fff;
  background: #fcfcfc; /* Old browsers */
  background: -moz-linear-gradient(top,  #fcfcfc 0%, #feb973 2%, #fd8610 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fcfcfc), color-stop(2%,#feb973), color-stop(100%,#fd8610)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top,  #fcfcfc 0%,#feb973 2%,#fd8610 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top,  #fcfcfc 0%,#feb973 2%,#fd8610 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top,  #fcfcfc 0%,#feb973 2%,#fd8610 100%); /* IE10+ */
  background: linear-gradient(to bottom,  #fcfcfc 0%,#feb973 2%,#fd8610 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfcfc', endColorstr='#fd8610',GradientType=0 ); /* IE6-9 */
}
.panel-heading:hover .panel-title, .panel-heading a:hover {
  text-shadow: 0 0 10px #fff;
  moz-text-shadow: 0 0 10px #fff;
  webkit-text-shadow: 0 0 10px #fff;
  color:#fff;
}
.panel-title {
 color:#666; 
 font-weight:300;
}

/* bestellablauf */

#bestellablauf .well, #vorteile .well {
  background-color:#fafafa;
  text-align:center;
  padding:10px;
  min-height:310px;
}
#vorteile .well {
 min-height:340px; 
  padding-top:25px;
}

#bestellablauf .well h2, #vorteile .well h2 {
 color:#fd8610;
  font-size:1.1em;
  letter-spacing:0;
}


UL.csc-uploads SPAN.csc-uploads-fileName {
  text-decoration:none;
}
a {
 color:#fd8610; 
}
a:hover {
 color:#666; 
}
/* form */
.Tx-Formhandler label {
  width:29%;
  font-weight:300;
}
input, button, select, textarea {
  border:0;
}
.Tx-Formhandler input, .Tx-Formhandler textarea {
  width:70%;
  padding:3px;
}
.Tx-Formhandler .field-box {
 margin:10px; 
}
.csc-uploads-fileName a,
a.button {
  padding: 5px 20px;
  display: table;
}
input[type="submit"] {
  color:#fff;
  background: rgb(195,195,195); /* Old browsers */
  background: -moz-linear-gradient(top, rgba(195,195,195,1) 0%, rgba(163,163,163,1) 99%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(195,195,195,1)), color-stop(99%,rgba(163,163,163,1))); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, rgba(195,195,195,1) 0%,rgba(163,163,163,1) 99%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, rgba(195,195,195,1) 0%,rgba(163,163,163,1) 99%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top, rgba(195,195,195,1) 0%,rgba(163,163,163,1) 99%); /* IE10+ */
  background: linear-gradient(to bottom, rgba(195,195,195,1) 0%,rgba(163,163,163,1) 99%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c3c3c3', endColorstr='#a3a3a3',GradientType=0 ); /* IE6-9 */
  border-radius:5px;
}
input[type="submit"]:hover {
  background: #fcfcfc; /* Old browsers */
  background: -moz-linear-gradient(top,  #fcfcfc 0%, #feb973 2%, #fd8610 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fcfcfc), color-stop(2%,#feb973), color-stop(100%,#fd8610)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top,  #fcfcfc 0%,#feb973 2%,#fd8610 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top,  #fcfcfc 0%,#feb973 2%,#fd8610 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top,  #fcfcfc 0%,#feb973 2%,#fd8610 100%); /* IE10+ */
  background: linear-gradient(to bottom,  #fcfcfc 0%,#feb973 2%,#fd8610 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfcfc', endColorstr='#fd8610',GradientType=0 ); /* IE6-9 */
  text-shadow:0 0 10px #fff;
}

.csc-uploads-fileName a,
a.button {
  color:#fff;
  border-radius: 5px;
  background: #fcfcfc; /* Old browsers */
  background: -moz-linear-gradient(top,  #fcfcfc 0%, #feb973 2%, #fd8610 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fcfcfc), color-stop(2%,#feb973), color-stop(100%,#fd8610)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top,  #fcfcfc 0%,#feb973 2%,#fd8610 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top,  #fcfcfc 0%,#feb973 2%,#fd8610 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top,  #fcfcfc 0%,#feb973 2%,#fd8610 100%); /* IE10+ */
  background: linear-gradient(to bottom,  #fcfcfc 0%,#feb973 2%,#fd8610 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfcfc', endColorstr='#fd8610',GradientType=0 ); /* IE6-9 */
  }
.csc-uploads-fileName a:hover,
a.button:hover {
  text-shadow:0 0 10px #fff;
}

a.button {
  font-size: 16px;
  font-weight: 400;
}

#kontakt input[type="submit"] {
  float:right;
  margin-right: 32px;
  width: 344px;
}



/* CALCULATOR */

.error {
 color: #cc1100;
 font-size: 1em; 
}

.type-check input {
 width:10%;
  margin-left:29%
}
.type-check label {
 width:59%; 
}

#calculator input[type="submit"] {
 margin-left:200px; 
}
#calculator select {
 width:69%; 
}

fieldset {
  padding: .35em .625em .75em;
  margin: 0 2px;
}

.calc {
  /*clear: both;*/
  width: 960px;
}

.calcrahmen p {
  margin: 0px;
}

.calcrahmen #smallpreview {
  position:relative;
  float:left;
  padding:5px;
  border:1px solid #ccc;
    -webkit-transition:all 0.3s ease;
    -moz-transition:all 0.3s ease;
    transition:all 0.3s ease;
  margin:0 20px 0 0;
}

.calcrahmen #smallpreview:hover {
  -webkit-transition:all 0.5s ease;
    -moz-transition:all 0.5s ease;
  transition:all 0.5s ease;
  margin:0 0 20px 0;
}

.calcrahmen #smallpreview #lupe {
  position:absolute;
  bottom:6px;
  right:6px;
}

.calcrahmen #smallpreview #previewimg {
  width:100px;
    -webkit-transition:all 0.3s ease;
    -moz-transition:all 0.3s ease;
    transition:all 0.3s ease;
  display:block;
}


.calcrahmen p#preis {
  float: left;
  width: 200px;
}
.calcrahmen #preis, .calcrahmen #gesamt {
  font-style: inherit;
  font-weight: 600;
  color: #F30;
}
.calcrahmen #gesamt {
  color: #f89832;
  font-size: 18px;
}

ul#pricinglist, ul#calclist, .calcrahmen ul {
  list-style-type:none;
}

#list7, #list8 {
   clear: both;
    margin-left: 210px;
    position: relative;
  margin-bottom: 0px;
}


input[type="number"], select, .calc #selector input[type="text"], .styled-select {
  width: 175px;
  height: -1px;
  margin: 2px;
  color: #333;
  border: solid 1px #ccc;
  background: #e2e2e2;
  background: -webkit-gradient(linear, left top, left bottom, from(#eeeeee), to(#e2e2e2));
  background: -moz-linear-gradient(top, #eeeeee, #e2e2e2);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#eeeeee', endColorstr='#e2e2e2' );
  -webkit-input-placeholder: #ccc;
  -moz-placeholder: #ccc;
}
input[type="number"] {
  width: 90px;
}
input[type="submit"] {
  margin: 20 0px;
  color: #FFF;
  background: #1a5fac;
  background: -webkit-gradient(linear, left top, left bottom, from(#FBC88D), to(#FD7F01));
  background: -moz-linear-gradient(top, #FBC88D, #FD7F01);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FBC88D', endColorstr='#FD7F01');
}
button.submit {
  margin: 20px 50px;
  font-weight: bold;
}

#calculator-step3 #file {
 display:inline;
  width: auto;
}
#calculator-step3 .file-email, #calculator-step3 .fileupload-info {
 margin-left:29%;
}
#calculator-step3 .fileupload-info .info {
 font-size:0.8em;
  white-space:nowrap;
}


#calculator-step3 input.button {
 width:auto; 
  margin:0;
}
#calculator-step3 .type-text.type-file {
 margin-bottom: 20px; 
}

/* Kalkulieren */

.kalkulator-button {
background: rgb(252,252,252); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(252,252,252,1) 1%, rgba(254,190,125,1) 2%, rgba(252,138,21,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,rgba(252,252,252,1)), color-stop(2%,rgba(254,190,125,1)), color-stop(100%,rgba(252,138,21,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(252,252,252,1) 1%,rgba(254,190,125,1) 2%,rgba(252,138,21,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(252,252,252,1) 1%,rgba(254,190,125,1) 2%,rgba(252,138,21,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(252,252,252,1) 1%,rgba(254,190,125,1) 2%,rgba(252,138,21,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(252,252,252,1) 1%,rgba(254,190,125,1) 2%,rgba(252,138,21,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfcfc', endColorstr='#fc8a15',GradientType=0 ); /* IE6-9 */

  color:#fff;
  font-weight:bold;
  padding: 23px 10px 23px 65px;
  border-radius: 8px;
  position:relative;
  margin-top:15px;
  box-shadow: 1px 1px 1px 1px #999;
}
.kalkulator-button:before {
  content:' ';
  background: url('vhs-assets-css-a36646803b944ce390e6cb2f14070bb5.png')no-repeat left top;
  height:60px;
  width:50px;
  position:absolute;
  top:8px;
  left:8px;
}

.kalkulator-button p {
  margin:0;
  font-size:140%;
  text-align:center;
}

.kalkulator-button a {
  color:#fff !important;
}
.kalkulator-button a:hover {
  text-shadow:0px 0px 5px #fff;
}
.bindung-nav-col h2 {
  color:#fd8610;
  font-size:1.4em;
}

/** Headermagic **/
div#header {
  /*height: 500px;*/
  width: 320px;
  position: absolute;
  margin-left: 650px;
}
div#header #left {
  float: right;
  margin: 10px 5px;
  width: 180px;
}
div#header #left li {
  list-style: none;
}
div#header h3 {
  font-wight: bold;
  font-size: 120%;
}
div#header p {
 font-size: 95%;
}

div#header p#preis {
  float: left;
  width: 200px;
}
div#header #preis, div#header #gesamt {
  font-style: inherit;
  font-weight: 600;
  color: #F30;
}
div#header #gesamt {
  color: #f89832;
  font-size: 24px;
}
div#header #pricing {
  margin-top: 60px;
}
div#header #imagebox {
  float: left;
  position: relative;
  margin: 10px 0 0 10px;
  /*top: 60px;
  margin-right: 190px;*/
}
div#header #imagebox img {
  width: 100px;
  padding: 5px;
  border: 1px solid #ccc;
}

.calc-icon {
  margin: 5px 20px 0px 0px;
  float:left;
  width:60px;  
}

/** Selector **/
.calc #selector {
  margin-top: 40px;
  width: 70%;
}
.calc #selector img {
  margin: 5px 20px;
  float: left;
  width: 60px;
}
.calc #selector h4 {
  font-weight: bold;
  color: #f89832;
}
.calc #selector p {
  float: inherit;
}
.calc #selector #hidden {
  margin-left: 200px;
}
.calc #selector #hidden option {
  float: right;
}
calc #selector div.formhide {
  margin-right: 100px;
}
.calc div#selector.lieferung {
  clear:both;
}
.calc #selector .lieferung .right {
  float: right;
}
/** Elements **/
.calc #elements {
  width: auto;
  float: right;
}
.calc #elements.top {
  margin-top: -99px;
  margin-right: 320px;
}
.calc #elements.sec, .calc #elements.lieferung {
  margin-top: -77px;
  margin-right: 320px;
}
.calc #elements.back_view {
  float: none;
  width: 300px;
  /*
  margin-bottom: 30px;
  margin-right: 100px;
  clear: right;*/
}
.calc #elements.back_view img {
  border: 1px solid #ccc;
  padding: 10px;
  margin: -400px 0 0 300px;
  max-height: 90%;
  max-width: 95%;
}
/** hidden **/
.formhide {
  display: none;
  float: left;
  width: auto;
  /*margin-left: 250px;*/
}
.calc .formhide #mod {
  width: 250px;
  color: white;
  position: relative;
  top: -120px;
  left: 330px;
  text-align: center;
  text-shadow: 0px 2px 3px #666;
}
.calc .formhide #mod p#title {
  font-weight: 450;
  font-size: 20px;
}
.calc .formhide #mod p#sectitle {
  font-weight: 600;
  font-size: 24px;
}
.calc .formhide #mod p#name {
  margin-top: 80px;
}
/** Eyecandy **/
select[disabled="disabled"] {
  cursor: not-allowed;
}
div#typo3-previewInfo {
  display:none;
}

.small, ul.steuern li {
  font-size:0.7em;
}

ul.steuern {
  margin-top:0;
}

.margin-left {
  margin-left:29%;
}

.label {
  background: #FFA03B;
}
#softcover_options, #plastringbindung, #drahtringbindung, #fealzelband, #kammbindung, #heissleim_options {
  display: none;
}
.type-button input{
width: 240px;
  margin-bottom:3px;
}

 img#previewicon {
  width:150px;
  padding:5px;
  border:1px solid #ccc;
  float:left;
  margin-right:25px;
  margin-bottom:20px;
}

div#binding > div {
 margin-left:175px; 
}

div#binding > div li {
  margin-left:2em;
}

#bindname {
  color:#f89832;
  font-weight:bold;
}

.box-1, .box-2, .box-3 {
  text-align:right;
}
#kammbindung, #fealzelband, #drahtringbindung, #plastringbindung, #heissleim_options, #softcover_options, #hardcover_options, #praegung_options, #cd_options {
  text-align:right;
  width:100%;
}
#check_praegung, #check_cd, #cdhuelle, #cddruck {
  width:auto;
}


/** Navigation-Bindung **/

.binden_nav {
  background-color: #fff;
  padding: 25px 0 60px 5px;
  position: relative;
  width: 100%;
  margin-bottom: 10px;
  border-radius:5px;
  box-shadow: 0 5px 5px #ccc;
  background: #d3d4d5; /* Old browsers */
  background: -moz-linear-gradient(left,  #d3d4d5 0%, #f7f7f7 3%, #f9f9f9 50%, #f7f7f7 97%, #d3d4d5 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, right top, color-stop(0%,#d3d4d5), color-stop(3%,#f7f7f7), color-stop(50%,#f9f9f9), color-stop(97%,#f7f7f7), color-stop(100%,#d3d4d5)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(left,  #d3d4d5 0%,#f7f7f7 3%,#f9f9f9 50%,#f7f7f7 97%,#d3d4d5 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(left,  #d3d4d5 0%,#f7f7f7 3%,#f9f9f9 50%,#f7f7f7 97%,#d3d4d5 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(left,  #d3d4d5 0%,#f7f7f7 3%,#f9f9f9 50%,#f7f7f7 97%,#d3d4d5 100%); /* IE10+ */
  background: linear-gradient(to right,  #d3d4d5 0%,#f7f7f7 3%,#f9f9f9 50%,#f7f7f7 97%,#d3d4d5 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d3d4d5', endColorstr='#d3d4d5',GradientType=1 ); /* IE6-9 */
}
.binden_nav li {
  float: left;
  list-style-type: none;
  margin: 0 26px;
}
.binden_nav ul.navbar-nav li a {
  display: block;
  height: 80px;
  width: 80px;
  font-size: 1em;
  color: #666;
  padding: 0;
  border: 1px solid #eee;
  text-align:center;
}
.binden_nav li a span {
  position: relative;
  top: 85px;
}
li a.hardcover {
  background: url('vhs-assets-css-2a407d912532852490a060fd5d264829.jpg') no-repeat right 0px;
}
li a.softcover {
  background: url('vhs-assets-css-1fddbcb80c149f943c7c0a593dcefef6.jpg') no-repeat right 0px;
}
li a.kammbindung {
  background: url('vhs-assets-css-93616e309d37912dbe1e237b9a166657.jpg') no-repeat right 0px;
}
li a.plakat {
  background: url('vhs-assets-css-458ef6c02626d54318d210f8d7a63aea.jpg') no-repeat right 0px;
}
li a.loseblatt {
  background: url('vhs-assets-css-384654adb0b24350278ec0a8a7d52a43.jpg') no-repeat right 0px;
}
li a.plastring {
  background: url('vhs-assets-css-bd570fdc6d89206b6ef7c11939bb0873.jpg') no-repeat right 0px;
}
li a.drahtring {
  background: url('vhs-assets-css-1311c965c2435e970f96522e58197bce.jpg') no-repeat right 0px;
}
li a.hardcover:hover {
  background: url('vhs-assets-css-2a407d912532852490a060fd5d264829.jpg') no-repeat right -80px;
}
li a.softcover:hover {
  background: url('vhs-assets-css-1fddbcb80c149f943c7c0a593dcefef6.jpg') no-repeat right -80px;
}
li a.kammbindung:hover {
  background: url('vhs-assets-css-93616e309d37912dbe1e237b9a166657.jpg') no-repeat right -80px;
}
li a.plakat:hover {
  background: url('vhs-assets-css-458ef6c02626d54318d210f8d7a63aea.jpg') no-repeat right -80px;
}
li a.loseblatt:hover {
  background: url('vhs-assets-css-384654adb0b24350278ec0a8a7d52a43.jpg') no-repeat right -80px;
}
li a.plastring:hover {
  background: url('vhs-assets-css-bd570fdc6d89206b6ef7c11939bb0873.jpg') no-repeat right -80px;
}
li a.drahtring:hover {
  background: url('vhs-assets-css-1311c965c2435e970f96522e58197bce.jpg') no-repeat right -80px;
}

li. a:hover {
  color:#fd860f;
}

/*###################################################
 *                                                  *
 *                  Footer Elements                 *
 *                                                  *
 ###################################################*/

footer {
  background: #606160; /* Old browsers */
  background: -moz-linear-gradient(top,  #606160 0%, #898989 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#606160), color-stop(100%,#898989)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top,  #606160 0%,#898989 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top,  #606160 0%,#898989 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top,  #606160 0%,#898989 100%); /* IE10+ */
  background: linear-gradient(to bottom,  #606160 0%,#898989 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#606160', endColorstr='#898989',GradientType=0 ); /* IE6-9 */
  color: #eee;
  display: block;
  min-height: 200px;
  padding: 10px 0 20px 0;
}
footer h3 {
  color: #ffffff;
  font-size: 22px;
}
footer h3 a:hover {
  color: #ffffff;
}
footer h3 a {
  color: #dddddd;
  font-size: 22px;
}
footer h3 a:hover {
  color: #ffffff;
}
footer a {
  color: #b7b7b7;
  font-size: 1em;
}
footer a:hover, footer a:focus {
  color: #fff;
  text-decoration: none;
}
footer ul {
  margin: 0;
  padding:0;
}
footer ul li {
  list-style-type: none;
  border-bottom: 1px solid #666;
  line-height:22px;
}
footer ul li:last-child {
  border-bottom:0;
}
footer .highlight {
  border-bottom:0;
}
footer .highlight a {
  color:#ddd;
  font-weight:700;
}
footer .highlight a:hover {
  color:#fff;
}

/*###################################################
 *                                                  *
 *                     Kalkulator                   *
 *                                                  *
 ###################################################*/

.Tx-Formhandler .calc input {
  padding: 3px;
  margin: 1px 0px;
}
.calc .styled-select {
  width: 55%;
}
.calc #softcover_options, .calc #plastringbindung, .calc #drahtringbindung, .calc #fealzelband, .calc #kammbindung, .calc #heissleim_options {
  display: none;
}
.calc .button.submit {
  width: 125px;
}
.calc .calc-icon {
  width: 60px;
}
.calcrahmen {
  background: #ffffff;
  padding: 15px;
  border-radius:5px;
  box-shadow: 0 5px 5px #ccc;
  background: #d3d4d5; /* Old browsers */
  background: -moz-linear-gradient(left,  #d3d4d5 0%, #f7f7f7 3%, #f9f9f9 50%, #f7f7f7 97%, #d3d4d5 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, right top, color-stop(0%,#d3d4d5), color-stop(3%,#f7f7f7), color-stop(50%,#f9f9f9), color-stop(97%,#f7f7f7), color-stop(100%,#d3d4d5)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(left,  #d3d4d5 0%,#f7f7f7 3%,#f9f9f9 50%,#f7f7f7 97%,#d3d4d5 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(left,  #d3d4d5 0%,#f7f7f7 3%,#f9f9f9 50%,#f7f7f7 97%,#d3d4d5 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(left,  #d3d4d5 0%,#f7f7f7 3%,#f9f9f9 50%,#f7f7f7 97%,#d3d4d5 100%); /* IE10+ */
  background: linear-gradient(to right,  #d3d4d5 0%,#f7f7f7 3%,#f9f9f9 50%,#f7f7f7 97%,#d3d4d5 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d3d4d5', endColorstr='#d3d4d5',GradientType=1 ); /* IE6-9 */
  width:100%;
}
.calcrahmen h3 {
 margin-top:0; 
}
  
  
}
/*.calcrahmen ul {
  list-style: none;
}*/

.calcrahmen ul#pricinglist {
 padding:0; 
}
.calcrahmen #pricinglist li {
  margin: 0 10px;
  width: 100px;
  float: left
}
.calcrahmen #smallpreview {
  position: relative;
  float: left;
  width:120px;
  padding: 5px;
  border: 1px solid #ccc;
  margin: 0 20px 0 0;
  
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
.calcrahmen #smallpreview:hover {
  margin: 0 20px 20px 0;
  width:100%;
}
.calcrahmen #smallpreview #previewimg {
  width: 100%;
  display: block;
}
.calcrahmen #smallpreview #lupe {
  position: absolute;
  bottom: 6px;
  right: 6px;
}


/*###################################################
 *                                                  *
 *                      Blog                        *
 *                                                  *
 ###################################################*/


p.form-submit {
    margin-bottom: 7em;
}

li.single-comment {
    margin: 1em 0 2em 0;
    background-color: #eeeeee;
    padding: 1em;
}

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

textarea#comment {
    width: 100%;
}

.single-comment p:first-child {
    padding-top: .5em;
    margin: 0;
}

.site-sidebar input[type="submit"] {
  position: relative;
  bottom: 1px;
}
.site-sidebar input#s {
  height: 23px;
}
.site-sidebar div#categories-3 {
    padding-top: 2em;
}

/*###################################################
 *                                                  *
 *                      Social                      *
 *                                                  *
 ###################################################*/

.social-share {
    font-size: 44px;
}

.social-share h5 {
    font-size: 19px;
}

.onlyMobile {
  display: none;
}

@media (max-width: 620px) {
  .onlyMobile {
    display: inline;
  }
}


/*###################################################
 *                                                  *
 *               Responsive Elements                *
 *                                                  *
 ###################################################*/
.navbar-default .navbar-toggle {
  color:#fff;
  background: rgb(195,195,195); /* Old browsers */
  background: -moz-linear-gradient(top, rgba(195,195,195,1) 0%, rgba(163,163,163,1) 99%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(195,195,195,1)), color-stop(99%,rgba(163,163,163,1))); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, rgba(195,195,195,1) 0%,rgba(163,163,163,1) 99%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, rgba(195,195,195,1) 0%,rgba(163,163,163,1) 99%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top, rgba(195,195,195,1) 0%,rgba(163,163,163,1) 99%); /* IE10+ */
  background: linear-gradient(to bottom, rgba(195,195,195,1) 0%,rgba(163,163,163,1) 99%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c3c3c3', endColorstr='#a3a3a3',GradientType=0 ); /* IE6-9 */
  border-radius:5px;
  border:none;
}
.navbar-default .navbar-toggle:hover {
  background: #fcfcfc; /* Old browsers */
  background: -moz-linear-gradient(top,  #fcfcfc 0%, #feb973 2%, #fd8610 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fcfcfc), color-stop(2%,#feb973), color-stop(100%,#fd8610)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top,  #fcfcfc 0%,#feb973 2%,#fd8610 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top,  #fcfcfc 0%,#feb973 2%,#fd8610 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top,  #fcfcfc 0%,#feb973 2%,#fd8610 100%); /* IE10+ */
  background: linear-gradient(to bottom,  #fcfcfc 0%,#feb973 2%,#fd8610 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfcfc', endColorstr='#fd8610',GradientType=0 ); /* IE6-9 */
}
.navbar-default navbar-collapse {
 top:80px;
 background:#fff; 
}

.uploadedfiles {
  margin-left:29%;
}

@media (min-width:1200px) {

.container, .navbar-static-top .container, .navbar-fixed-top .container, .navbar-fixed-bottom .container {
  width:990px;
}

}

@media (max-width: 1200px) {
nav.navbar {
 background-size:contain; 
}
.calc {
 width:100%; 
}
.navbar-nav {
 margin-top:-5px; 
}

}



@media (max-width: 992px) {
.navbar .nav>li>a  {
  color:#676767;
  margin-top:0;
  margin-bottom:10px;
  padding:0 22px
}
.navbar .nav>li>a:focus, .navbar .nav>li>a:hover, .navbar .nav>.active>a, .navbar .nav>.active>a:hover, .navbar .nav>.active>a:focus {
  color:#fd8610;
}
.binden_nav li {
  padding-bottom:60px;
}
.calcrahmen {
 width:100%;
 margin-top:70px; 
}

}

@media (max-width: 767px) {
.navbar-brand {
 top:0;
 left:-20px; 
}
nav.navbar {
 background:none; 
}

.navbar-toggle {
  margin-top: -50px;
  margin-right: -15px;
}
.navbar .nav>li>a  {
  border:none;
  border-bottom:1px solid #eee;
  margin:0 15px;
  padding:10px 0;
  text-align:center;
}
#calculator-step3 .uploadedfiles, #calculator-step3 label, #calculator-step3 input, #calculator-step3 textarea, #calculator-step3 .file-email, #calculator-step3 .fileupload-info, #calculator-step3 .margin-left {
 width:100%;
 margin-left:0; 
}
#calculator label, #calculator input, #calculator textarea, #calculator select {
  width:100%;
}
#calculator .type-check input {
  width:20%;
  margin-left:0;
}
#calculator .type-check label {
  width:auto;
}
}

@media (max-width: 550px) {
.navbar-brand img {
 width:100%;
  height:auto;
}
#content {
 padding-top:20px; 
}
.calc-icon-box, #lupe {
  display:none;
}
.box-1, .box-2, .box-3, #kammbindung, #fealzelband, #drahtringbindung, #plastringbindung, #heissleim_options, #softcover_options, #hardcover_options, #praegung_options, #cd_options {
  text-align:left;
}
.calc .styled-select, .calc .button.submit, .calcrahmen #smallpreview, .calcrahmen #smallpreview #previewimg, .calcrahmen #smallpreview:hover #previewimg, img#previewicon {
 width:100%; 
}
.calcrahmen ul.check {
  padding-left:5px;
}
div#binding > div {
 margin-left:0; 
}
.calcrahmen #pricinglist li {
 width:100%;
 margin-bottom:15px; 
}
#list7, #list8 {
 margin-left:0; 
}
}



.tx-druckthekeauftrag-pi1 table {
    width: 100%;
}

.tx-druckthekeauftrag-pi1 table tr {
    height: 75px;
    border-bottom: 1px solid orange;
}

.tx-druckthekeauftrag-pi1 table td input {
    width: 100%;
    padding: 3px 10px;
    margin: 3px 0;
    max-width: 270px;
}










.spinner {
  -webkit-animation: rotator 1.4s linear infinite;
          animation: rotator 1.4s linear infinite;
}

@-webkit-keyframes rotator {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(270deg);
            transform: rotate(270deg);
  }
}

@keyframes rotator {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(270deg);
            transform: rotate(270deg);
  }
}
.path {
  stroke-dasharray: 187;
  stroke-dashoffset: 0;
  -webkit-transform-origin: center;
      -ms-transform-origin: center;
          transform-origin: center;
  stroke: orangered;
  -webkit-animation: dash 1.4s ease-in-out infinite;
          animation: dash 1.4s ease-in-out infinite;
}

@-webkit-keyframes dash {
  0% {
    stroke-dashoffset: 187;
  }
  50% {
    stroke-dashoffset: 46.75;
    -webkit-transform: rotate(135deg);
            transform: rotate(135deg);
  }
  100% {
    stroke-dashoffset: 187;
    -webkit-transform: rotate(450deg);
            transform: rotate(450deg);
  }
}

@keyframes dash {
  0% {
    stroke-dashoffset: 187;
  }
  50% {
    stroke-dashoffset: 46.75;
    -webkit-transform: rotate(135deg);
            transform: rotate(135deg);
  }
  100% {
    stroke-dashoffset: 187;
    -webkit-transform: rotate(450deg);
            transform: rotate(450deg);
  }
}






.loader-thingey {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: rgba(255,255,255,.8);
text-align: center;
line-height: 11em;
}