@font-face {
  font-family: 'Istok Web',Arial, sans-serif;
}

html, body {
  height: 100%;
}

html,
button,
input,
select,
textarea {
  color: #222;
}

html {
  font-size: 1em;
  line-height: 1.4;
}
body{
  color:#333;
  font-weight:300;
  font-size:14px;
  font-family: 'Istok Web', sans-serif;
  line-height:18px;
  background-color: #fff;
}



/*h1 etc.*/

h1 {
  float:right; 
  padding-left:20px;
  color:#fff;
  margin-top:2px;
}
h2 {
  font-size: 2em;
  margin-top:2px;
}
h3 {
  font-size:1em;
  margin: 0;
  text-transform: uppercase;
  margin-bottom:4px;
  font-weight: 600;
  //color:#333;
}


a {color:#666;text-decoration:none;}
a:hover {text-decoration:underline;}

.light {
    color:#AFA8A0;
}
#beschreibung h3{
  padding:  20px 0 0;
 }
/* ~~~~~~~~~~~~~~~~~~~~textcontainer ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
 @media only screen and (min-width: 1824px) {

     .blue {
          background-color: #fff;        
     }
      .pink {
        margin:0 auto;
         width:1600px;
        
        background-color: #fff;
     }
     .gold {
        
        background-color: #fff;
     }
 }

 #beschreibung{
  width: 90%;
  max-width: 768px;
  padding:  2em 0;
  margin: 0 auto;
  //color: #afa8a0;
  color:#666;
  line-height: 1.8; 
 }
 p.backlink{
  font-size:0.8em;
  color:#666;
 
 }
/* ~~~~~~~~~~~~~~~~~~~~accordion ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
.btn_panel {
  clear:both;
  margin:20px 0 0 0;
  color:#999;
  text-transform:uppercase;
  cursor:pointer;
  width:200px;
  float:left;
}
.btn_panel a {
  font-size:16px;
}
.btn_panel a:hover, .btn_panel a:focus {

}
.spacer{
  float:right;
  margin:20px 0 0;
}
.btn_closepanel, .btn_closepanel_down {
  cursor:pointer;
}

.btn_closepanel, .panel{
  display:none;
}
.btn_closepanel {
  float:right;
}


/* Use specific transition for fx: 'slideHorz' */
div.mc-image {
  -webkit-transition: left 1s ease-in-out; 
  -moz-transition: left 1s ease-in-out; 
  -o-transition: left 1s ease-in-out; 
  transition: left 1s ease-in-out;
}
/* pager */
.cycle-pager { 
  text-align: center; width: 100%; z-index: 500; position: relative; top: 10px; overflow: hidden;
}
.cycle-pager span { 
  font-family: arial; font-size: 50px; width: 16px; height: 16px; 
  display: inline-block; color: #ddd; cursor: pointer; 
}
.cycle-pager span.cycle-pager-active { color: #D69746;}
.cycle-pager > * { cursor: pointer;}

.proj_leiste {
  margin:60px 0;
  width:100%;

}
.proj_leiste .arr_left {
  float:left;
  width:10%
}
.proj_menu_title {
  float:left;
  width:80%;
}

.proj_leiste h5 {
  margin-top:5px;
  font-size:1.2em;
  text-align:center;
}
.proj_leiste .arr_right {
  float:right;
  width:10%;
  text-align: right;
}

.logo_container p.logo_p{
  position:absolute;
  top:82px;
}
.logo_container p.logo_p img{
  max-width: 100%;
}

.orange {
  padding:20px;
}
.orange p.title {
  margin:20px 0;
  font-size: 1.17em;
  margin: 1em 0;
  font-family: 'Istok Web',sans-serif;
  font-weight: 500;
}

.bottom_container {
  position:relative;
}
.projdata {
  padding:20px 0;
}
.projdata h2{
  margin-bottom:20px;
}



/* ==========================================================================
   glyphicon
   ========================================================================== */

@font-face {
  font-family: 'Glyphicons Halflings';
  src: url('../fonts/glyphicons-halflings-regular.eot');
  src: url('../fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('../fonts/glyphicons-halflings-regular.woff') format('woff'), url('../fonts/glyphicons-halflings-regular.ttf') format('truetype'), url('../fonts/glyphicons-halflings-regular.svg#glyphicons-halflingsregular') format('svg');
}

.glyphicon {
  position: relative;
  top: 1px;
  display: inline-block;
  font-family: 'Glyphicons Halflings';
  -webkit-font-smoothing: antialiased;
  font-style: normal;
  font-weight: normal;
  line-height: 1;
}

.glyphicon-remove-sign:before {
  content: "\e083";
}
.glyphicon-remove-circle:before {
  content: "\e088";
}
.glyphicon-chevron-left:before {
  content: "\e079";
}

.glyphicon-chevron-right:before {
  content: "\e080";
}

.glyphicon-chevron-up:before {
  content: "\e113";
}

.glyphicon-chevron-down:before {
  content: "\e114";
}

.glyphicon-circle-arrow-right:before {
  content: "\e131";
}

.glyphicon-circle-arrow-left:before {
  content: "\e132";
}

.glyphicon-circle-arrow-up:before {
  content: "\e133";
}

.glyphicon-circle-arrow-down:before {
  content: "\e134";
}

/* responsive
--------------------------------------------------------------------------- */
.screen {

}
.tablet{
  display:none;
}



@media only screen and (min-width: 768px) and (max-width: 1200px) {
  /* Style adjustments for viewports that meet the condition */

  .screen {
    display:none;
  }
  .tablet{
    display:block;
  }

  #maximage {
      width:100%;
    max-height:520px;
  }

  #holder {
    width:100%;
  }
  #cycle-nav ul li a {
  width:80px;
}
}

@media only screen
and (max-device-width: 479px)
 and (orientation: portrait) {
  /* Style adjustments for viewports that meet the condition */

  #cycle-nav ul li a {
  width:40px;
}
 #maximage {
     width:100%;
    height:200px;
  }

}
@media only screen
and (max-device-width: 479px)
 and (orientation: landscape) {
  /* Style adjustments for viewports that meet the condition */

  #cycle-nav ul li a {
  width:45px;
  height:4px;
}
 #maximage {
     width:100%;
   
  }

}