html {
-webkit-text-size-adjust: 100%; /* Prevent font scaling in landscape while allowing user zoom */
}

body {
-webkit-overflow-scrolling: touch;
color: #000000;
font-family: "Open Sans";
/*font-size: 62.5%;*/
}

.hauptfarbe { color: #9b876e; rgb(155, 135, 110); }
.hell { color: #f5f3f0; }
.mittel { color: #e1dbd3; rgb(225, 219, 211); }
.white { color:#FFF; }
a { color: #9b876e; }
a:hover, a:focus { color: #766957; }
.bottom_section a { color: #FFF; }
.bottom_section a:hover, .bottom_section a:focus { color: #e1dbd3; }

h1 {
font-family:"TalkingToTheMoon";
font-size: 3.0em;
font-weight: 700;
color: #000;
margin: 0px 0px 10px 0px;
}

h2 {
font-family:"TalkingToTheMoon";
font-size: 2.4em;
line-height: 1.2;
color: #000000;
margin: 0px 0px 10px 0px;
}



/* ==========================================================================
top_section, bottom_section
========================================================================== */

header i {
    margin-left: 5px
}

.top_section {
    position: relative;
    padding: 20px 0 20px 0;
    min-height: 30px;
    background: rgb(255, 255, 255);
    background-color: #FFF;
    color: #9b876e;
}
.bottom_section {
    position: relative;
    padding: 20px 0 20px 0;
    min-height: 30px;
    background: rgb(155, 135, 110);
    background-color: #9b876e;
    color: #FFF;
}
.top_section .col-md-6 { padding:0 95px; }
.bottom_section .col-md-7 { padding-left:95px; }
.bottom_section .col-md-5 { padding-right:95px; }

.top_section p.brand { margin:0; }
.top_section .nav-toggle { padding: 10px 100px 16px 0px; }

.nav-toggle span, .nav-toggle span::before, .nav-toggle span::after {
    background: #9b876e;
}

/* ==========================================================================
Hero background ist jetzt dark_section
========================================================================== */

.dark_section {
    position: relative;
    padding: 0;
    min-height: 500px;
    background: rgb(215, 175, 83) url('../../media/streifenhintergrund.jpg') no-repeat center center;
    background-size: cover;
    color: #000;
}
.dark_section a {
    color:white;
}

.light_section.app { min-height: 620px; }

.light_section {
    position: relative;
    padding: 0;
    min-height: 500px;
    background: rgb(245, 243, 240) url('../../media/streifenhintergrund_white.jpg') no-repeat center center;
    background-size: cover;
    color: #000;
}


.light_section.ringe { min-height: 560px; }
.light_section.footer { 
    position: relative;
    padding: 0;
    min-height: 350px;
    background: rgb(225, 219, 211) url('../../media/streifenhintergrund_hell.jpg') no-repeat center center;
    background-size: cover;
    color: #000; }

.karte {
    position: absolute;
    top:0px;
    left:-10px;
    width: 100%;
    height:500px;
    background: url('../../media/karte-schnur.png') no-repeat center center;
    background-size:100%;
}


.streifen {
    position: absolute;
    top: 0px;
    right: -80px;
    width: 100%;
    height: 500px;
    background: url('../../media/karte-streifen.png') no-repeat center left;
}


.hero h1 span {
    display: inline-block;
    color: #FFF;
}

.hero.willkommen h1 { margin: 100px 0 45px 0; }
.hero.willkommen .col-md-7 { position:relative; }
.hero.willkommen .col-md-5 { padding-left: 100px; }

.hero.app .col-md-7 { padding-right: 4%; padding-left:5%; }
.hero.app .col-md-7 img { width:150px; height:auto; margin-right:10px; }
.hero.app h1 { margin: 60px 0 45px 0; color: #9b876e; }

.hero.impulse .col-md-7 { padding-top:60px; padding-left:100px;padding-right:40px; }
.hero.impulse h1 { margin: 30px 0 45px 0; color: #FFF; }

.hero.ringe .col-md-7 { padding: 60px 40px 0 100px; }
.hero.ringe .col-md-5 { text-align:center; padding:100px 60px 0 20px;}
.hero.ringe h1 { margin: 30px 0 45px 0; color: #9b876e; }
.hero.ringe .col-md-5 img { width:100%;height:auto; margin-bottom:30px; }

.hero.footer .col-md-4 { padding: 60px 40px 0 0px; }
.hero.footer .col-md-4 img { padding-left:100px; }
.hero.footer h1 { margin: 0px 0 45px 100px; }
.hero.footer p.text1 { margin: 90px 0 0px 40px; }
.hero.footer p.text2 { margin: 90px 0 0px 0; }




/* ==========================================================================
Listen
========================================================================== */

.impuls ul, .impuls ol {
    padding-left: 0px;
    margin-right:40px;
    overflow:auto;
}

.impuls ul li { list-style: none;
    margin: 0;
    padding: 0 0 0 20px;
}

.impuls ol li { list-style: none;
    margin: 0;
    padding: 0 0 0 26px;
}

.impuls ul li::before { 
    font-family: 'Glyphicons Halflings';
    font-style: normal;
    font-weight: 400;
    font-size:10px;
	content: "\2212";
	color:#9b876e;
	margin-left: -16px;padding-right:6px;
}



/* ==========================================================================
Button
========================================================================== */

.dark_section .btn {
    display: inline-block;
    margin-bottom: 0;
    font-weight: 400;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    background-image: url('../../media/buttonwhite-0.png');
    border: 1px solid transparent;
    white-space: nowrap;
    padding: 10px 16px;
    font-size: 14px;
    line-height: 1.42857143;
    border-radius: 4px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-size: cover;
    background-repeat: no-repeat;
    margin-top:30px;
}
.dark_section .btn:hover {
    background-image: url('../../media/buttonwhite.png');
}

.light_section .btn {
    background-image: url('../../media/buttoncolor-0.png');
    background-size: cover;
    background-repeat: no-repeat;
    margin-top:30px;
    padding: 10px 16px;
}
.light_section .btn:hover {
    background-image: url('../../media/buttoncolor.png');
    color:#FFF;
}


.button { color:#000; }


/* ==========================================================================
Overlay
========================================================================== */

.overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 1.0);
}

.overlay-boxify {
    visibility: hidden;
    opacity: 0;
    -webkit-transition: opacity 0.5s, visibility 0s 0.5s;
    transition: opacity 0.5s, visibility 0s 0.5s;
}

.overlay ul { margin-left:60px; }

.overlay ul li a {
    display: block;
    padding: 20px 20px 0 20px;
    min-width: 20px;
    border: 0px solid #fff;
    border-radius: 0px;
    border:none;
    background-color: #FFF;
    color: #9b876e;
    text-transform: none;
    font-weight: 400;
    font-size: 14px;
    line-height: 25px;
    -webkit-transition: all 300ms ease-in-out;
    transition: all 300ms ease-in-out;
    
}
.overlay ul li a:hover { color: #766957; }


/* Cookie-Banner */

.iwcc-background {background: transparent !important;}
.iwcc-wrapper {
background: #EFEFEF !important;
max-width: 50em !important;
max-height: 60vh !important;
border: 1px solid rgba(0,0,0,.2);
border-radius: .3rem;
box-shadow: 1px 2px 4px rgba(0, 0, 0, .5);
}
.iwcc-wrapper-inner {padding: 1.5em !important;}
.iwcc-cookiegroups {padding-top: 0.5em !important;}
.iwcc-sitelinks {text-align: left !important;}
.iwcc-sitelinks a {width:auto;}
.iwcc-save-selection {background: #FFF !important;}
.iwcc-save-selection:hover { background: #999 !important; }
.iwcc-accept-all {color: #fff !important;}
.iwcc-show-box { margin-left:15px;background:#EFEFEF;float:right;color:#888 !important;}