﻿@charset "UTF-8";
/* CSS Document */
*{
    padding:0px;
    margin:0px;
}
body	{background-color:#F3F3F3;
		text-align:center;
		font-family:"Montserat", Arial, sans-serif;
}

/* Schriften */

p	{
	color:#666;
  font-family:"Montserat", Arial, sans-serif;
  font-style: normal;
	font-size: 18px;
  font-variant: normal;
}
/* DENKHAUS Schrift */
h1	{
	font-family:"Lucida Grande", Arial, sans-serif;
	font-size:36px;
	color:#999999;
	letter-spacing: 0.5em;
	text-shadow: 2px 2px 2px #CCC;
}
/* für NEUE MÄRKTE */
h2	{
	font-family:"Lucida Grande", Arial, sans-serif;
	font-size:24px;
  line-height:2.0em;
	color:#999999;
}

h3	{font-family:"Lucida Grande", Arial, sans-serif;
font-size:20px;
	color:#999999;
	font-style:"normal";
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif
}
h4	{
	color:#09F;
	font-size:16px;
	font-family: "Lucida Grande", Arial, sans-serif;
}

h5	{
	color:#09F;
	font-size:14px;
	font-family: "Lucida Grande", Arial, sans-serif;
}

64	{
	color:#09F;
	font-size:10px;
	font-family: "Lucida Grande", Arial, sans-serif;
}

a	{text-decoration: none;
	color:#000;
}
a:hover	{color:#999999;
}
.feld h2	{
	font-size:24px;
	color:#09F;
	font-style: normal;
	font-variant:normal;
}
/* Navi */
	.navi	{
		text-align:center;
		background-color: #000;        /* Hintergrundfarbe für die Navigation */
  		padding: 4px 0;                   /* Innenabstand: oben/unten 4px, li/re 0 */
  		margin-top: 3px;                        /* Keinen Außenabstand */
	}
	.navi a {color: #fff;                  /* Schriftfarbe schwarz */
  			text-decoration: none;         /* Unterstreichung entfernen */
  			padding: 4px 12px;
			border-left:#FFF, 3px;              /* oben/unten 4px, re/li 8px */
	}
        .navi a:hover {
            color: #6c757d;
        }

/* div-Boxen */

	/* Seiten Hintergrund */
	.seite	{background-color:#FFFFFF;
		max-width:975px;
		min-width:640;
		text-align:center;
		padding-top:10px;
		overflow-x:hidden;
		margin-left:auto;
		margin-right:auto;
	}

	/*Kopf der Seite für Logo */
	.header {height: 120px;
			text-align:center;
	}


	/* Tittelbild_index nur auf den Startseiten verwendet index.html, willkommen.html und willkommen_denkhaus.html*/
	.tibild_index	{background:url(images/DENKHAUS_wissen.jpg);
					max-width:975px;
					min-width:640px;
					height:492px;
					overflow: hidden;
	}
	.willkommen_bild	{background:url(images/index1_97360362_S_950.jpg);
						max-width:auto;
						height:389px;
						overflow: hidden;
	}

	.willkommen_bild_akademie	{background:url(images/denkhaus_ost_kapelle_sonne_975.png);
						max-width:auto;
						height:389px;
						overflow: hidden;
	}
	.zeitstrahl_denkhaus	{background:url(images/zeitstrahl_denkhaus.png);
						max-width:auto;
						height:389px;
						overflow: hidden;
	}





	.logoraster_content {
		max-width:950px;
		min-width:640;
		text-align:center;
		padding-top:10px;
		overflow-x:hidden;
		margin-left:auto;
		margin-right:auto;
	}

	.txt	{
	float:right;
	text-align:right;
	position:absolute;
	height:40px;
	top:510px;
	left:443px;
	overflow:hidden;
	}
	.txt_Homepage	{
	float:left;
	text-align:center;
	font-family:"Lucida Grande", Arial, sans-serif;
	color:#FFF;
	font-size:26px;
	position:fixed;
	height:40px;
	top:50px;
	left:595px;
	top:530px;
	overflow:hidden;
	}

	/* neue Beiträge anlegen */
	div .feld	{width:auto;
				padding-left:20px;
				padding-right:20px;
        line-height:190%;
				margin-left:auto;
				margin-right:auto;
	}

	div .table	{width:640px;
	}
	div .feld_bild {width:auto;
				padding-left:0px;
				padding-right:0px;
				margin-left:auto;
				margin-right:auto;
	}


/* id */
	/*id zentrieren */
	#center {text-align:center;
	}
	/*id links */
	#links {text-align:left;
	}
	/*id rechts */
	#rechts	{text-align:right;
	}

/* Tabellen */

	/* Formular */
	tabel .formular	{border:0px;
					width: 400px;
	}
	tr .formular	{height:35px;
	}

/* Wortauszeichnung*/
.wortauszeichnung
{font-size:24px;
color:#0F0
}

/* Slideshow */

@import 'bourbon';
/*---- NUMBER OF SLIDE CONFIGURATION ----*/
$num-of-slide: 5;

.wrapper {
    max-width: 60em;
    margin: 1em auto;
    position: relative;
}

input {
    display: none;
}

.inner {
    width: percentage($num-of-slide);
    line-height: 0;
}

article {
    width: percentage(1/$num-of-slide);
    float: left;
    position: relative;

    img {
        width: 100%;
    }
}

/*---- SET UP CONTROL ----*/
.slider-prev-next-control {
    height: 50px;
    position: absolute;
    top: 50%;
    width: 100%;
    @include transform(translateY(-50%));

    label {
        display: none;
        width: 40px;
        height: 40px;
        border-radius: 50%;
        background: #fff;
        opacity: 0.7;

        &:hover {
            opacity: 1;
        }
    }
}

.slider-dot-control {
    position: absolute;
    width: 100%;
    bottom: 0;
    text-align: center;

    label {
        cursor: pointer;
        border-radius: 5px;
        display: inline-block;
        width: 10px;
        height: 10px;
        background: #bbb;
        @include transition(all 0.3s);

        &:hover {
            background: #ccc;
            border-color: #777;
        }
    }
}

/* Info Box */
.info {
    position: absolute;
    font-style: italic;
    line-height: 20px;
    opacity: 0;
    color: #000;
    text-align: left;
    @include transition(all 1000ms ease-out 600ms);

    h3 {
        color: #fcfff4;
        margin: 0 0 5px;
        font-weight: normal;
        font-size: 1.5em;
        font-style: normal;
    }

    &.top-left {
        top: 30px;
        left: 30px;
    }

    &.top-right {
        top: 30px;
        right: 30px;
    }

    &.bottom-left {
        bottom: 30px;
        left: 30px;
    }

    &.bottom-right {
        bottom: 30px;
        right: 30px;
    }
}

/* Slider Styling */
.slider-wrapper {
    width: 100%;
    overflow: hidden;
    border-radius: 5px;
    box-shadow: 1px 1px 4px #666;
    background: #fff;
    background: #fcfff4;
    @include transform(translateZ(0));
    @include transition(all 500ms ease-out);

    .inner {
        @include transform(translateZ(0));
        @include transition(all 800ms cubic-bezier(0.77, 0, 0.175, 1));
    }
}

/*---- SET POSITION FOR SLIDE ----*/
%bind-prev-next-button {
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
    margin: 0;
    line-height: 38px;
    font-size: 3em;
    display: block;
    color: #777;
}

%bind-next-button {
    @extend %bind-prev-next-button;
    content: "\f105";
    padding-left: 15px;
}

%bind-next-label {
    display: block;
    float: right;
    margin-right: 5px;
}

%bind-prev-label {
    display: block;
    float: left;
    margin-left: 5px;
}

%bind-prev-button {
    @extend %bind-prev-next-button;
    content: "\f104";
    padding-left: 8px;
}

%bind-background-active-dot {
    background: #333;
}

%bind-opacity-info {
    opacity: 1;
}

@for $i from 1 through $num-of-slide {
    #slide#{$i}:checked {
        & ~ .slider-wrapper .inner {
            margin-left: percentage(1 - $i);
        }

        & ~ .slider-dot-control label:nth-child(#{$i}) {
            @extend %bind-background-active-dot;
        }

        & ~ .slider-wrapper article:nth-child(#{$i}) .info {
            @extend %bind-opacity-info;
        }
    }
}

@for $i from 1 through ($num-of-slide - 1) {
    #slide#{$i}:checked {
        & ~ .slider-prev-next-control label:nth-child(#{$i +1}) {
            @extend %bind-next-label;

            &::after {
                @extend %bind-next-button;
            }
        }
    }
}

#slide#{$num-of-slide}:checked ~ .slider-prev-next-control label:nth-child(1) {
    @extend %bind-next-label;

    &::after {
        @extend %bind-next-button;
    }
}

@for $i from 2 through $num-of-slide {
    #slide#{$i}:checked {
        & ~ .slider-prev-next-control label:nth-child(#{$i - 1}) {
            @extend %bind-prev-label;

            &::after {
                @extend %bind-prev-button;
            }
        }
    }
}

#slide#{1}:checked ~ .slider-prev-next-control label:nth-child(#{$num-of-slide}) {
    @extend %bind-prev-label;

    &::after {
        @extend %bind-prev-button;
    }
}

/*---- TABLET ----*/
@media only screen and (max-width: 850px) and (min-width: 450px) {
    .slider-wrapper {
        border-radius: 0;
    }
}

/*---- MOBILE----*/
@media only screen and (max-width: 450px) {
    .slider-wrapper {
        border-radius: 0;
    }

    .slider-wrapper .info {
        opacity: 0;
    }
}

@media only screen and (min-width: 850px) {
    body {
        padding: 0 80px;
    }
}
.blau_in_wort {
	color: #09F;
	font-family: "Lucida Grande", Arial, sans-serif;
}
.wort_rot {
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-style: oblique;
	line-height: normal;
	font-weight: bold;
	font-variant: normal;
	color: #C30;
}
.corona_index	{font-family:"Lucida Grande", Arial, sans-serif;
font-size:18px;
	color:#FFF;
	font-style:normal;
}
