/* reset */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, pre, a,
abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s,
samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol,
ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr,
th, td {border:0; font-size:100%; margin:0; padding:0;}
a {outline:none;}
table {border-collapse:collapse; border-spacing:0;}
fieldset,img {border:0;}
img {vertical-align:bottom;}
del,ins {text-decoration:none;}
caption,th {text-align:left;}
/*h1,h2,h3,h4,h5,h6 {font-size:100%; font-weight:normal;}*/
q:before,q:after {content:'';}
abbr,acronym {border:0; font-variant:normal;}
sup,sub {height:0; line-height:1; vertical-align:baseline; vertical-align:bottom;
position:relative;}
sup {bottom:1ex;} sub {top:.5ex;}
legend {color:#000;}
input,button,textarea,select,optgroup,option {font-family:inherit; font-size:inherit;
  font-style:inherit; font-weight:inherit;}
input,button,textarea,select {font-size:100%;}

/* - - - - - - - - - - - - - - - - - Fonts lokal Einbinden - - - - - - - - - - - - - - - - - */

/* open-sans-300 - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/open-sans-v29-latin-300.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/open-sans-v29-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/open-sans-v29-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/open-sans-v29-latin-300.woff') format('woff'), /* Modern Browsers */
       url('../fonts/open-sans-v29-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/open-sans-v29-latin-300.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-regular - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/open-sans-v29-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/open-sans-v29-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/open-sans-v29-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/open-sans-v29-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/open-sans-v29-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/open-sans-v29-latin-regular.svg#OpenSans') format('svg'); /* Legacy iOS */
}

/* FRONTEND CSS
*********************************************/
body {
  background-color: rgb(255,255,255);
}

.padding{
  padding: 50px;
}

.clear{
  clear: both;
}

/* Container
******************************************/
#container{
  	max-width: 1140px;
	margin: 15px auto;
}

/* Left and Right
******************************************/
#left{
  width: 180px;
  height: 400px;
 
  float: left;
  margin: 95px 0px 0px 0px;
}

#right{
  width: 180px;
  height: 400px;
 
  float: right;
  margin: 95px 0px 0px 0px;
}

/* Main
******************************************/
#main{
  max-width: 640px;
  float: left;
  margin: 0px 70px 0px 70px;
}

/* Top
******************************************/
#top{
    max-width: 640px;
	height: 0px;
	margin: 0px auto;
}

#top-logo{
  width: 100px;
  height: 75px;
  float: left;
}

#top-menu{
  position: relative;
  float: right;
  width: 370px;
  margin: 35px -20px 0px 0px;
 }

/* - - - - RWD Menu - - - - - */
#top-menu ul{
  list-style: none;
}
	
#top-menu li a{
  font-family: 'Open Sans', sans-serif;
  font-size: 15px;
  display: block;
  text-decoration: none;
  text-transform: uppercase;
  float: left;
  color: rgb(113,113,115);
  padding: 0px 15px 0px 15px;
}

#top-menu ul li a:hover, #top-menu ul li.current.active a{
  color: rgb(167,167,167);
}

#top-menu ul li a.close{
  display: none;
}
#top-menu ul li a.home{
  display: none;
}

.top-menu-open{
  display: none;
}

/* Header
******************************************/
#hero{
  width: 100px;
  height: 100px;
  margin: -110px 0px 0px 530px ;
 }

#head{
  max-width: 640px;
  height: 0px;
  margin: 0px 0px 0px 0px;
}

/* Content
******************************************/
#content{
	max-width: 640px;
	margin: 0px auto;
  	padding: 50px 100px 50px 100px;
  	/*box-sizing: padding-box;*/
    /*background-color: lightblue;*/
}

/* Footer
******************************************/
#footer{
  max-width: 640px;
  min-height: 140px;
  margin: 0 auto;
  /*border-top: solid 1px rgb(167,167,167);
  margin: 20px 100px 30px 100px;
  background-color: khaki;*/
}

#footer hr{
  border: 0;
  height: 1px;
  background-image: linear-gradient(to right, rgba(113, 113, 115, 0), rgba(113, 113, 115, 0.75), rgba(113, 113, 115, 0));
}

#footer-menu{
  width: 402px;
  margin: auto;
}

#footer-menu ul{
  list-style: none;
}
	
#footer-menu li a{
  font-family: 'Open Sans', sans-serif;
  display: block;
  text-decoration: none;
  text-transform: uppercase;
  color: rgb(113,113,115);
  float: left;
  padding: 0px 15px 0px 15px;
}

#footer-menu ul li a:hover, #footer-menu ul li.current.active a{
  color: rgb( 167,167,167);
}

#footer-adress{
	max-width: 640px;
	margin: 0px auto;
  	padding: 50px 100px 50px 100px;
}

#footer-adress p{
	text-align: center;
}

/* Copyright
******************************************/
#copyright{
	max-width: 640px;
    padding-bottom: 20px;
}

#copyright a, #copyright p{
    font-family: 'Open Sans', sans-serif;
    font-size: 10px;
  	text-align: center;
    text-decoration: none;
    padding-top: 15px;
    color: rgba(113,113,115,0.5);
}

/* - - - - Font anpassungen - - - - */
p, ul, ol, li{
        font-family: 'Open Sans', sans-serif;
        font-size: 15px;
  		font-size: 0.875 rem;
  		font-weight:normal;
  		line-height: 1.8;
  		text-align: left;
  		letter-spacing: 0.02em;
        vertical-align: baseline;
        color: rgb(113,113,115);  
  		list-style: none;
}

h1, h2{
        font-family: 'Open Sans', sans-serif;
  		font-size: 34px;
  		font-size: 1.875 rem;
 		font-weight: 300;
        text-transform: uppercase;
  		text-align: left;
  		letter-spacing: 0.06em;
        padding: 5px 0px 20px 0px; 
        color: rgb(167,167,167); 
}

h3{
        font-family: 'Open Sans', sans-serif;
        font-size: 24px;
  		font-size: 1.5 rem;
  		font-weight: normal;
  		letter-spacing: 0.1em;
  		padding-top: 10px;
        padding-bottom: 10px;
        color: rgb(167,167,167); 
}

h4{
        font-family: 'Open Sans', sans-serif;
        font-size: 18px;
  		font-size: 1.5 rem;
  		font-weight: normal;
  		letter-spacing: 0.1em;
  		padding-top: 10px;
        padding-bottom: 10px;
        color: rgb(167,167,167); 
}

img{
        border-width: 0;   
}

a{
        font-family: 'Open Sans', sans-serif;
        font-size: 14px;
  		text-decoration: none;
        color: rgb(167,167,167)
}

#content a:hover{
    color: rgb(113,113,115);
}

p strong{
  color: rgb(113,113,115); 
}

hr{
  border: 0;
  height: 1px;
  background-image: linear-gradient(to right, rgba(113, 113, 115, 0), rgba(113, 113, 115, 0.75), rgba(113, 113, 115, 0));
}

/*  CLASS 
******************************************/

/* Anpassungen Bilder */

.flex-box{
  	width:100%;
	/*background:#ccc;*/
	display:-webkit-flex;
	display:flex;
}

.image-left{
  width: 180px;
  flex: 1;
  display: cover;
  margin: 0px 40px 0px 0px;
}

.image-right{
  width: 180px;
  flex: 1;
  margin: 0px 0px 0px 40px;
}

/* Titelbild*/
.image-hero{
  max-width: 100%; 
  height: auto;
  object-fit: cover;
}

.box, .edit.item-page{
  width: 640px;
  padding: 0;
  margin-left: -100px;
}

.btn-toolbar{
  	margin-bottom: 25px;
  	height: 25px;
}

.btn.btn-primary, .validate-username.required, .btn{
  font-family: 'Open Sans', sans-serif;
 }

.alert.alert-message{
  font-family: 'Open Sans', sans-serif;
  margin-bottom: 25px;
}

.nav.nav-tabs {
  display: none;
}

/* Submit Button BreezingForm 
******************************************/

#bfSubmitButton{
  float: left;
  margin: 20px 0px 20px 0px;
}
  
.bfSubmitButton{
   border: 1px solid rgb(137,120,90);
   background: rgba(167,167,167, 0.8);
   padding: 13px 58px;
   -webkit-border-radius: 5px;
   -moz-border-radius: 5px;
   border-radius: 5px;
   font-family: 'Open Sans', sans-serif;
   font-size: 18px;
   text-decoration: none;
   vertical-align: center;
   color: rgb(255,255,255);
   transition: all 0.3s ease-out 0s;
}

.bfSubmitButton:hover {
   border: 1px solid rgb(104,63,107);
   background: rgb(113,113,115);
   color: rgb(255,255,255);
}

.bfSubmitButton:active {
   border: 1px solid rgb(104,63,107);
   /*text-shadow: #1e4158 0 1px 0;*/
   background: rgb(113,113,115); 
   color: rgb(255,255,255);
}

.btn.btn-primary.remodal-confirm{
   font-family: 'Open Sans', sans-serif;
}

/* Form Fields BreezingForm 
******************************************/

.ff_elm.inputbox {
  width: 450px;
}

.inputbox {
   border: 1px solid rgb(196,196,196);
   background: rgb(255,255,255);
   -webkit-border-radius: 3px;
   -moz-border-radius: 3px;
   border-radius: 3px;
   color: #c4c4c4;
   padding: 5px;
   margin-bottom:20px;
   font-family: 'Open Sans', sans-serif;
   font-size: 14px;
   text-decoration: none;
}

.inputbox-field {
   border: 1px solid #c9b7a2;
   background: #e4d5c3;
   -webkit-border-radius: 3px;
   -moz-border-radius: 3px;
   border-radius: 3px;
   color: #c9b7a2;
   padding:6px;
   margin-bottom:20px;
}

.inputbox:focus {
   background: rgb(255,255,255);
   color: #737373;
}

.control-label{
  font-family: 'Open Sans', sans-serif;
  font-size: 14px;
  font-weight:normal;
  line-height: 1.8;
  text-align: justify;
  letter-spacing: 0.02em;
  vertical-align: baseline;
  color: rgb(96,96,96);   
}

#ff_elem4_calendarButton, #ff_elem5_calendarButton{
  width: 26px;
  height: 40px;
  background-repeat: no-repeat;
  background-image: url("../images/calendar.png");
  background-color: rgb(255,255,255);
  border: none;
}

#bfLabel5{
  margin-right: 6px; /*gleicher Abstand Kalender-Felder*/
}

/* BreezingForm QuickMode
******************************************/

.bfQuickMode input[type=text], 
.bfQuickMode textarea, 
.bfQuickMode select, 
.bfQuickMode .uneditable-input {
    max-width: 80%;
    width: 100%;
}

.bfPage{
  margin: 0 auto;
  padding: 0px;
  /*background-color: rgb(236,234,236);
  border: solid 2px rgb(183,161,122);*/
}

.bfQuickMode.controls.control-label {
    min-width: 800px;
    vertical-align: text-top;
    width: 100%;
}

.bfElemWrap.bfLabelLeft{
  font-family: 'Open Sans', sans-serif;
  font-size: 14px;
  color: rgb(76,76,76);
  text-decoration: none;
  margin-bottom: 20px;
}

.bfRequired{
  display: none;
}

.ff_elem{
   border: 1px solid rgb(196,196,196);
   background: rgb(255,255,255);
   -webkit-border-radius: 3px;
   -moz-border-radius: 3px;
   border-radius: 3px;
   color: #c4c4c4;
   padding: 5px;
   /*margin-bottom:20px;*/
   font-family: 'Open Sans', sans-serif;
   font-size: 14px;
   text-decoration: none;
}

.bfError{
   font-family: 'Open Sans', sans-serif;
   font-size: 14px;
   font-size: 0.875 rem;
   font-weight:normal;
   line-height: 1.8;
   text-align: justify;
   letter-spacing: 0.02em;
   vertical-align: baseline;
   color: rgb(195,22,34);   
}

/* - - - - - - - - - - - - - - - - - - - - - Media Queries - - - - - - - - - - - - - - - - - - - - -  */
@media screen and (max-width: 1140px) {
  
  
    /* Container
    ******************************************/
    #container{
        max-width: 640px;
    }
 
    /* Left and Right
    ******************************************/
    #left, #right{
      display: none;
    }

    /* Main
    ******************************************/
    #main{
      max-width: 640px;
      margin: auto;
      float: none;
    }
  
}

/* - - - - - - - - - - - - - - - - - - - - - Media Queries - - - - - - - - - - - - - - - - - - - - -  */
@media screen and (max-width: 640px) {

          /*auto Anpassung in ios der schriften verindern*/
          html{
            -webkit-text-size-adjust: 100%;
            -ms-text-size-adjust: 100%;
          }

        /* Container
        ******************************************/  
        #container{
            margin: 0 0;
        }

        /* Top
        ******************************************/  
         #top{
            height: 72px;
            width: 100%;
            z-index: 99999;
            margin: 0px auto;
            background-color: rgb(255,255,255);
            transition: all 1s ease-in-out;
        }

        #top-logo{
         	display: none;
        }

        #top-menu{
          position: fixed;
          z-index: 99999;
          top: -200%;
          left: 0;
          float: none;
          width: 100%;
          margin: 0;
          padding: 0;
          background-color: rgba(255,255,255,0.8);
          -webkit-transition: all 1s ease-in-out;
          -moz-transition: all 1s ease-in-out;
          -o-transition: all 1s ease-in-out;
          -ms-transition: all 1s ease-in-out;
          transition: all 1s ease-in-out;
      }

      #top-menu:target{
          top: 0;
        }  

      /* - - - - RWD Menu - - - - - */

        #top-menu ul{
          list-style: none;
        }

        #top-menu li a{
          font-size: 18px;
          display: block;
          text-decoration: none;
          text-align: center;
          float: none;
          color: rgb(113,113,115);
          padding: 12px 15px 12px 15px;
        }

       	/* #top-menu ul li a:hover, #top-menu ul li.current.active a{
          color: rgb(113,133,115);
          background-color: rgba(255,255,255,0.9);
          border: none;
        }*/

        #top-menu ul li a.close{
          display: block;
        }

        #top-menu ul li a.home{
        display: block;
      	}

        .top-menu-open{
          /*position: fixed;*/
          width: 100%;
          top: 0;
          left: 0;
          font-family: 'Open Sans', sans-serif;
          font-weight: 300;
          display: block;
        }

        .top-menu-open a{
          padding: 10px 15px;
          display: block;
          font-size: 2.5em;
          text-align: right;
          text-decoration: none;
          color: rgb(113,113,115);
          background-color: rgb(255,255,255);
          background-repeat: no-repeat;
          background-position: left;
          background-size: contain;
          background-image: url("../images/logo-mobil-01.jpg"); 
        }

        #top-menu-2{
          margin: -20px 0px 0px 0px;  
        }

         /* Header
        ******************************************/
        #head{
          float: none;
          width: 100%;
          height: 200px;
          margin: 0;
          padding: 0;
        }

        #hero{
          	width: 100px;
  			height: 100px;
          	margin: -110px 0px 0px 10px ;
        }

         /* Content
        ******************************************/
        #content{
          padding: 50px 25px 25px 25px;
        }  

        /* Footer
        ******************************************/
        #footer{
          margin: 0;
          padding: 15px 0;
          background-color: rgba(167,167,167,0.1);
        }  
  
        #footer hr{
        	display:none;
      	}
  
		#footer-menu{
          width: 100%;
          margin: 25px 0px;
        }

        #footer-menu ul li a{
          text-align: center;
          display: block;
          float: none;
          color: rgb(113,113,115);
          padding: 10px 0px 10px 0px;
          margin: 0px 30px 0px 30px;
          border-top: 2px solid rgba(167,167,167,0.2);
          /*background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));*/
        }

        #footer-adress{
          width: 100%;
          float: none;
          padding: 0px 0px;
          margin: 0 auto;
        }

        #footer-adress p{
            text-align: center;  
        }

        #copyright{
          background-color: rgba(167,167,167,0.1);
        }

        /* - - - - Font anpassungen - - - - */
        p, ul, ol, li{
                font-family: 'Open Sans', sans-serif;
                font-size: 14px;
                font-weight:normal;
                line-height: 1.8;
                text-align: left;
                letter-spacing: 0.02em;
                vertical-align: baseline;
                color: rgb(167,167,167);   
        }

        h1, h2{
                font-family: 'Open Sans', sans-serif;
                font-size: 24px;
                font-weight: 300;
                text-transform: uppercase;
                text-align: left;
                letter-spacing: 0.06em;
                padding: 5px 0px 40px 0px; 
                color: rgb(167,167,167); 
        }

        h3{
                font-family: 'Open Sans', sans-serif;
                font-size: 20px;
                font-weight: normal;
                letter-spacing: 0.1em;
                padding-top: 10px;
                padding-bottom: 10px;
                color: rgb(167,167,167); 
        }

  
       /* - - - - - - - - - CLASS - - - - - - - - - - - - - */

  		.flex-box{
  			width:100%;
			padding: 0px;
        	margin-left: 0px;
		}
  
        .image-left{
            width: 250px;
            float: left;
            margin: 0px;
      	}

        .image-right{
            width: 250px;
          	float: left;
            margin: 0px;
        }

  		.image-hero{
    		height: 200px;
  		}

      .box{
        width: 100%;
        padding: 0;
        margin-left: 0px;
      }

        /* - - - - - - - - - -  BreezingForm QuickMode - - - - - - - - - */

        #bfSubmitButton{
        width: 98%;
      }
  
  		.rc-anchor-normal {
    		height: 74px;
    		width: 250%;
		}
  		
     /* #bfLabel4.control-label{
		width: 120px;
        float: left;
      }
  
      #ff_elem4_calendarButton, #ff_elem5_calendarButton {
        width: 26px;
        height: 40px;
        float: right;
        margin-left: 400px;
        background-repeat: no-repeat;
        background-image: url("../images/calendar.png");
        background-color: rgb(255,255,255);
        border: none;
      }*/
  
  
  
  
}