/*
 * Start Bootstrap - Landing Page (httbtn btn-defaultp://startbootstrap.com/)
 * Copyright 2013-2016 Start Bootstrap
 * Licensed under MIT (https://github.com/BlackrockDigital/startbootstrap/blob/gh-pages/LICENSE)
 */

@font-face { font-family: 'Saira-Light'; src: url('../fonts/SairaExtraCondensed-Light.ttf') format('truetype'); }
@font-face { font-family: 'OpenSans-Light'; src: url('../fonts/OpenSans-Light.ttf') format('truetype'); }
@font-face { font-family: 'Saira-Light'; src: url('../fonts/SairaExtraCondensed-Light.ttf') format('truetype'); }
@font-face { font-family: 'Saira'; src: url('../fonts/SairaExtraCondensed-Bold.ttf') format('truetype'); }
@font-face { font-family: 'Open Sans'; src: url('../fonts/OpenSans-Regular.ttf') format('truetype'); }
@font-face { font-family: 'Lato'; src: url('../fonts/Lato-Light.ttf') format('truetype'); }
body,
html 
{ 
    width: 100%;
    height: 100%;
    -webkit-text-size-adjust:100%;
    font-style:normal;   
    background-color:#f8f2e9;
}
.portfolio-item {
  margin-bottom: 10px;
border-radius:10px;

}
.card-title
    {
        color:#fff;        
        text-align:center;
        background-color:#e1b97e; 
        padding:8px; margin:0px;
        font-family: "Saira","Helvetica Neue",Helvetica,Arial,sans-serif;
         font-size:1.7em;
         text-transform:uppercase;
        
        }

  img 
{
   width:100%;
   height:auto;
    }

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: "Saira","Helvetica Neue",Helvetica,Arial,sans-serif;
    font-weight: 700;
    color:#e1b97e;
    text-transform:uppercase;  
    text-align:left;  
}
.btn
{
    background-color:#c33a32;
    color:#fff;
    padding:5px 10px 5px 10px;
    font-size:1.2em;
    font-family: "Saira","Helvetica Neue",Helvetica,Arial,sans-serif;
    }

.navbar-toggle
{
    position:relative;
    float:right;
    padding:9px 10px;
    margin-top:8px;
    margin-right:15px;
    margin-bottom:8px;
    background-color:#c33a32;
    background-image:none;
    border:1px solid transparent;
    border-radius:4px
}
                 
h1.intro, h3.intro
{
     font-family: "Saira","Helvetica Neue",Helvetica,Arial,sans-serif;
    font-weight: 700;  
    color:#fff;
    text-align:center;
    }
 h1
{
    font-size:3.7em;
    }   
    

h2
{    font-size:2.4em;
    }    

h3
{    font-size:1.8em;
     font-family: "Saira-Light","Helvetica Neue",Helvetica,Arial,sans-serif;
    }  
    
   

p {
    font-size: 1.3em;
    line-height: 2;
    color: #000;
    font-weight:normal;
    font-style:normal;  
   font-family: "OpenSans-Light","Helvetica Neue",Helvetica,Arial,sans-serif;
  
}

li.datenschutz {
    font-size: 1.2em;
    line-height: 1.4;
    color: #000;
    font-weight:normal;
    font-style:normal;  
   font-family: "OpenSans-Light","Helvetica Neue",Helvetica,Arial,sans-serif;
  
}

li.text {
    font-size: 1.3em;
    line-height: 1.9;
    color: #000;
    font-weight:normal;
    font-style:normal;  
   font-family: "OpenSans-Light","Helvetica Neue",Helvetica,Arial,sans-serif;
  
}
.navbar-nav {
    text-transform: uppercase;
    font-weight: 400;
    font-style:normal; 
    font-family: "Saira","Helvetica Neue",Helvetica,Arial,sans-serif;  

}
a.button
{
    background:#576d42;
    padding:10px;
    color:#fff;
    border-radius:2px;
    text-transform:uppercase;
      font-style:normal;  
   font-family: "Saira-Light","Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: 1.3em;
    line-height: 1.4;
    width:100%;
    }
    


a:hover.button
{
    text-decoration:none;
    background:#b6c4a8;
    color:#576d42;
    }
    
.navcolor
{
    background:#e1b97e;
    color:#fff;
    }

 .nav>li>a.kids {           
         color:#c33a32;
         font-size:1.8em;
         margin: 0 20px 0 20px;
    }
    
    .nav>li>a:hover.kids {           
         color:#fff;font-size:1.8em;
    }
    .nav>li>a:active.kids {           
         color:#fff;font-size:1.8em;
    }
    a:hover.kids {           
         color:#c33a32;font-size:1.8em;
    }
 .activeKids {           
         
         color:#fff;font-size:1.8em;
    }

.intro-header {
    margin-top: 40px; /* If you're making other pages, make sure there is 50px of padding to make sure the navbar doesn't overlap content! */
    padding-bottom: 0px;
    text-align: center;
    color: #f8f8f8;
    background: url(../img/background.jpg) no-repeat center center;
    background-size: cover;
   
}


.intro-message > h1, .intro-message-Kids > h1 {
    margin: 0;
    text-shadow: 2px 2px 3px rgba(0,0,0,0.6);
    font-size: 4em;
    font-family: "Lato","Helvetica Neue",Helvetica,Arial,sans-serif;
    font-weight: 700;  
    color:#fff;
}

.intro-message > h3, .intro-message-Kids > h3 {
    text-shadow: 2px 2px 3px rgba(0,0,0,0.6);
    font-family: "Lato","Helvetica Neue",Helvetica,Arial,sans-serif;
    font-weight: 700;  
    color:#fff;
}
.intro-divider {
    width: 400px;
    border-top: 1px solid #f8f8f8;
    border-bottom: 1px solid rgba(0,0,0,0.2);
}


.footerText
{ font-size: 1em;
    line-height: 1.2em;
    color: #fff;
    margin:0;
    padding:5px;
}

a.footernav
{
    color:#fff;
    font-family: "Saira-Light","Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size:1.2em;
    }
    a:hover.footernav
{
    color:#c33a32;

    }

hr {
    max-width: 400px;
    border-color: #999999;
}

hr.footer {
    max-width: 100%;
    border-color: #999999;
}

.tagline-divider {
    margin: 15px auto 3px;
    max-width: 250px;
    border-color: #999999;
}

.intro-text {
    text-transform: uppercase;
    font-size: 1.25em;
    font-weight: 400;
    letter-spacing: 1px;
}

.img-border {
    float: none;
    margin: 0 auto 0;
    border: #999999 solid 1px;
}

.img-left {
    float: none;
    margin: 0 auto 0;
}

footer {
    background-color: #c33a32;    
}

.copyright
{
     background-color: #e1b97e;
     padding:5px;
    }
    
a
{
    color:#c33a32;
    }
    
    a:hover
{
     color:#e1b97e;
    text-decoration:none;   
    
    }
    
    
     a:active
{
     color:#314b20;
    text-decoration:none;   
    
    }
    
    
a.indexbanner
{ color:#fff;
    }
    
        a:hover
{
     color:#c33a32;
    text-decoration:none;   
    
    }
    h4
{
    font-size:1.3em;
    font-weight:lighter;
    line-height:1.4em;
    
    }

.brand-before,
.brand-name {
   
    color:#567045;
    
}

.brand-before {
    margin: 15px 0;
}

.brand-name {
    margin: 0;
    font-size: 2em;
    
}
.banner h2 {
    margin: 0;
    text-shadow: 2px 2px 3px rgba(0,0,0,0.6);
    font-size: 3em;
}

.banner ul {
    margin-bottom: 0;
}


@media(max-width:767px) 
{

  .intro-message {
    position:relative;
    padding-top: 3%;
    padding-bottom: 3%;
  
}

.intro-header {
    margin-top: 50px; /* If you're making other pages, make sure there is 50px of padding to make sure the navbar doesn't overlap content! */

}


    .intro-message > h1 {
        font-size: 1.8em;
        margin-top:30px;
    }
    
    .intro-message-Kids > h1 {
        font-size: 1.8em;
        margin-top:100px;
    }
      .intro-message > h3 {
        font-size: 1em;
    }
    
      .intro-message-Kids > h3 {
        font-size: 1em;
    }

    .intro-divider {
        width: 100%;
    }
    
    .activeKids {           
         background:#3a4754;
         color:#fff;
    }
    
    .card-title
    {
      
         font-size:1.2em;

        
        }
p
{
    line-height:1.2em;
    font-size:1.2em;
    }

li.text
{
    line-height:1.2em;
    font-size:1.2em;
    }
a.button
{ 
    font-size: 1em;
    line-height: 1.4;  
    }
a.buttonKids
{
    font-size: 1em;
    line-height: 1.4;
    }

    .banner h2 {
        margin: 0;
        text-shadow: 2px 2px 3px rgba(0,0,0,0.6);
        font-size: 3em;
    }

   h1
{
    font-size:2.7em;
   
    } 
 
    h1.portal
{
    font-size:1.2em;
    line-height:1.2em;
    margin-top:20px;   
    } 
    
      h4.portal
{
    font-size:1em;
    line-height:1.2em;
   } 
hr.portal {
    max-width: 200px;
    border-color: #999999;
}
p.abstandbanner
{
    height:20px;
    
    }
    
.navbar-default 
.navbar-nav 
.open 
.dropdown-menu>li>a{color:#3a4754;}
   
.navbar-default 
.navbar-nav 
.open 
.dropdown-menu>li>a:focus,
.navbar-default 
.navbar-nav 
.open 
.dropdown-menu>li>a:hover
{
    color:#fff;background-color:#3a4754
 }
 
.navbar-default 
.navbar-nav 
.open 
.dropdown-menu>.active>a,
.navbar-default 
.navbar-nav 
.open 
.dropdown-menu>.active>a:focus,
.navbar-default 
.navbar-nav 
.open 
.dropdown-menu>.active>a:hover
    {
        color:#fff;
     }
        
        
.activeKids {           
background:#8cacbb;
color:#fff;
    }
  

}
@media(max-width:1200px) 
{
     
h2
{
    font-size:1.8em;
    font-weight:normal;
    }   
     h4.TextSlider
 {   
     font-size:1.1em;
     line-height:0.3em;
     font-weight:lighter;
   margin:0;     
     }
 a.button
{ 
    font-size: 1em;
   }
a.buttonKids
{
    font-size:0.5em;
    }
    abstandbanner
    { height:0px;
   }

 h1.portal
{
    font-size:1.7em;
    line-height:1.2em;
    margin-top:20px;   
    } 
    hr.portal {
    max-width: 250px;
    border-color: #999999;
}
} 

.footerText
{ font-size: 1.1em;
    line-height: 1.2em;
    color: #fff;
    margin:0;
    padding:5px;
}

  ul.links 
{    
     list-style:none;
   padding-left: 0;
    }
    
     li.linkButton
{ 
    font-family:'Open Sans','Helvetica Neue',Helvetica,Arial,sans-serif;
  text-align:center;
    line-height:25px;
    color:#fff;   
    margin-top:10px;
    border:1px solid #c2c0c3;
    list-style-position:outside;
    background-color:#314b20;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    
    }
    
         li.linkButtonKids
{ 
    font-family:'Open Sans','Helvetica Neue',Helvetica,Arial,sans-serif;
  text-align:center;
    line-height:25px;
    color:#fff;   
    margin-top:10px;
    border:1px solid #c2c0c3;
    list-style-position:outside;
    background-color:#546372;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    
    }
    
  ul.links a.kids:hover
{
    font-size:1em;
    font-family:'Open Sans','Helvetica Neue',Helvetica,Arial,sans-serif;    
    line-height:25px;
    text-align:center;
    color:#1a2735;   
    text-decoration:none;
    }
 
      li.images
{ 
    font-family:'Open Sans','Helvetica Neue',Helvetica,Arial,sans-serif;
    line-height:35px;
    color:#000;   
    margin-top:10px;
   font-size:16px;
    list-style-position:inside;
    list-style-image:url(../img/pfeil.jpg);
  
    }
    
      ul.links a
{ 
     font-size:1em;
    font-family:'Open Sans','Helvetica Neue',Helvetica,Arial,sans-serif;
    line-height:25px;
    list-style:none;   
    text-align:center;
    color:#fff;   
    
    }
    
     ul.links a:hover
{
    font-size:1em;
    font-family:'Open Sans','Helvetica Neue',Helvetica,Arial,sans-serif;    
    line-height:25px;
    text-align:center;
    color:#ddf3ce;   
    text-decoration:none;
    }
hr {
    max-width: 400px;
    border-color: #999999;
}


.address-bar {
    display: none;
    
}

.img-full {
    min-width: 100%;
}


.tagline-divider {
    margin: 15px auto 3px;
    max-width: 250px;
    border-color: #999999;
}

.box {
    margin-bottom: 20px;
    padding: 30px 15px;
    background: #fff;
    background: rgba(255,255,255,0.9);
}

.intro-text {
    text-transform: uppercase;
    font-size: 1.25em;
    font-weight: 400;
    letter-spacing: 1px;
}

.img-border {
    float: none;
    margin: 0 auto 0;
    border: #999999 solid 1px;
}

.img-left {
    float: none;
    margin: 0 auto 0;
}

footer {
    background-color: #c33a32;
    
}
a.footer{color:#fff;}
input, textarea
{
    width:100%;
    position:relative;
    margin:10px 0px 10px 0px;
    }

     a:active
{
     color:#314b20;
    text-decoration:none;   
    
    }
    
   .abstandbanner
    { height:50px;
        }
    
@media screen and (min-width:768px) 
{
    .top-divider {
        margin-top: 0;
    }

    .img-left {
        float: left;
        margin-right: 25px;
    }

    .address-bar {
        display: inherit;
        margin: 0;
        padding: 0 0 40px;
        text-align: center;
        text-shadow: 1px 1px 2px rgba(0,0,0,0.5);
        text-transform: uppercase;
        font-size: 1.25em;
        font-weight: 400;
        letter-spacing: 3px;
        color: #fff;
    }  

    .navbar-nav {
        font-size:0.64em;    
    }    
    .nav>li>a {        
         padding:0.3em;
         line-height:41px;}
         
   .dropdown:hover .dropdown-menu {
    display: block;
    margin-top: 0; 
 }
 .intro-header {
    margin-top: 50px; /* If you're making other pages, make sure there is 50px of padding to make sure the navbar doesn't overlap content! */

}

  .intro-message {
    position:relative;
    padding-top: 8%;
    padding-bottom: 8%;
  
}
  
}

@media screen and (min-width:992px) {   

.intro-header {
    margin-top: 50px; /* If you're making other pages, make sure there is 50px of padding to make sure the navbar doesn't overlap content! */

}

  .intro-message {
    position:relative;
    padding-top: 8%;
    padding-bottom: 8%;
  
}
    .navbar-nav {
        font-size:0.79em;    
    }    
    .nav>li>a {        
         padding:6px;
         line-height:36px;
      
    }
     a.button
{ 
    font-size: 1.0em;
   }
a.buttonKids
{
    font-size: 1.0em;
    }
    
   
} 
  @media screen and (max-width:992px) {   

     a.button
{ 
    font-size: 0.6em;
   }
a.buttonKids
{
    font-size: 0.6em;
    }
.abstandbanner
    { height:25px;
   }

 h1.portal
{
    font-size:1.5em;
    line-height:1.2em;
    margin-top:20px;   
    } 
    hr.portal {
    max-width: 250px;
    border-color: #999999;
}
} 
    


@media screen and (min-width:1200px) {   

.intro-header {
    margin-top: 55px; /* If you're making other pages, make sure there is 50px of padding to make sure the navbar doesn't overlap content! */

}

  .intro-message {
    position:relative;
    padding-top: 17%;
    padding-bottom: 17%;
  
}
    
     .navbar-nav {
        font-size:0.97em;    
    }    
    .nav>li>a {        
         padding:9px;
         line-height:35px;
    }
     .box:after {
        content: '';
        display: table;
        clear: both;
    }
     
}