/* This CSS file is part of the HTML5 / CSS3 tutorial on http://www.lingulo.com */

/* GLOBAL */
body
{
        background:#ffffff;
        font-family: 'Oxygen';
        color:#333333;
}

p
{
        margin:5px 0;
        line-height:25px;
}

a
{
        text-decoration:none;
        color:inherit;
        transition: color .5s ease;
}

strong
{
        font-weight:bold;
}

figcaption strong
{
        border-bottom: 1px solid #D6D0C1;
        padding-bottom:10px;
        margin: 10px 0;
        display:block;
}

figcaption
{
        line-height: 25px;
        font-size:14px;
        width:200px;
}

hr
{
        background-color: #D6D0C1;
        border:0;
        height:1px;
        margin:20px 0;
}


/* HEADER */

header
{
        position:relative;
        width:auto;
        max-width:1024px;
        height:120px;
        max-height:120px;
        margin: 0 auto 0 auto;
        background:#DDD9C3;
}

header h1
{
        margin:10px 0 0 0;
        font-size:280%;
        font-style:italic;
        color:#000000;
        font-family: 'Raleway';
}

header h2
{
        margin:0 0 0 10px;
        font-size:200%;
        color:#C000000;
        font-family: 'Oxygen';

}


nav
{

        position:relative;
        width:auto;
        max-width:1024px;
        margin: 0 auto 0 auto;
        background:#000000;
        position:absolute;
        left:0;
        right:0;
        bottom:0;
}

nav ul
{
        list-style:none;
}

nav ul li
{
        display:block;
        float:left;
        padding:3px 35px;
}

nav ul li a
{
        font-family: Arial;
        color:#DDD9C3;
        text-transform:uppercase;
        transition: all .25s ease;
}

nav ul li a:hover
{
        color:#73B61A;
}

#mobileMenu
{
         position:fixed;
         top:0;
         left:0;
         width:100%;
         display:none;
}

#mobileMenu ul li
{
         display:block;
         background-color:#333333;
         color:#DDD9C3;
         padding:3px 0;
         letter-spacing: 0.1em;
         text-align: center;
         text-transform: uppercase;
         border-bottom 1px solid #73B61A;
}

.toggleMobile
{
         display:none;
}

/* TWO COLUMNS */

#two_columns, #text_columns
{
        line-height:25px;
        font-family: Arial;
        clear:both;
        width:auto;
        max-width:1024px;
        background: #D5D0B5;
        margin:0 auto;
}

#two_columns h1
{
        font-family: Arial;
        margin-top:25%;
        font-size:28px;
        font-weight: bold;
        border-bottom: 1px solid #D6D0C1;
        padding: 20px 0;
        margin-bottom: 300px;

}

#two_columns h2
{
        font-family: Arial;
        font-size:20px;
        text-align: right;
        border-bottom: 1px solid #D6D0C1;
        padding: 0 0;
        margin-bottom: 1px;
}

#two_columns h3
{
        font-family: Arial;
        font-size:18px;
        text-align: left;
        border-bottom: 1px solid #D6D0C1;
        padding: 0 0;
        margin-bottom: 10px;
}

#two_columns h4
{
        font-family: Arial;
        font-size:15px;
        font-weight: bold;
        border-bottom: 1px solid #D6D0C1;
        padding: 0 0;
        margin-bottom: 8px;
        float: left
}

#two_columns h5
{
        font-family: Arial;
        font-size:15px;
        border-bottom: 1px solid #D6D0C1;
        padding: 0 0 0 130px;
        margin-bottom: 8px;

}

#two_columns h6
{
        font-family: Arial;
        font-size:15px;
        text-align: right;
        border-bottom: 1px solid #D6D0C1;
        padding: 0 0;
        margin-bottom: 20px;
}


.audio_regular
{
        font-family: Arial;
        font-size:15px;
        border-bottom: 1px solid #D6D0C1;
        padding: 0 0;
        margin-bottom: 8px;
}

.home_regular
{
        font-family: Arial;
        font-size:15px;
        border-bottom: 1px solid #D6D0C1;
        padding: 0 0;
}



.kontakt_regular
{
        font-family: Arial;
        font-size:12px;
        border-bottom: 1px solid #D6D0C1;
        padding: 0 0;
        margin-bottom: 8px;

}


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

#two_columns .img-item a
{
        position:relative;
        display:block;
}

#two_columns article.column1
{
        font-family: Arial;
        margin: 50px 0;
        font-size:30px;
        float:left;
        width:auto;
        max-width: 550px;
}

#one_column, #text_column
{
        line-height:25px;
        font-family: Arial;
        clear:both;
        width:auto;
        max-width:1024px;
        min-height:600px;
        background: #D5D0B5;
        margin:0 auto;
}

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

#one_column .img-item a
{
        position:relative;
        display:block;
}

#one_column article.column
{
        font-family: Arial;
        margin: 0 auto;
        font-size:30px;
        width:auto;
        max-width: 550px;
}

.thumb-screen
{
        display:block;
        position:absolute;
        top:0;
        left:0;
        width:100%;
        height:100%;
        background: #000 center center no-repeat;
        z-index:99;
        opacity: 0;
        transition: opacity .5s ease;
}

.thumb-screen:hover
{
        opacity:0.5;
}


/* FORMULAR */


label {
    font-family: Arial;
    font-size: 15px;
    width: 120px;
    display: block;
    float: left;
}

sprotect {
	display:none;
}

input
{
        font-family: Arial;
        font-size:15px;
        padding: 7px;
        outline: 0;
        width:245px;
        border-radius:10px;
}


input[type=submit]
{
        width:auto;
        padding: 5px 18px;
        line-height:25px;
        text-shadow:none;
        cursor:pointer;
        box-shadow: none;
        background: #333333;
        color: #fff;
}

input[type=reset]
{
        width:auto;
        padding: 5px 18px;
        line-height:25px;
        text-shadow:none;
        cursor:pointer;
        box-shadow: none;
        background: #333333;
        color: #fff;
}

input[type=zurueck]
{
        width:auto;
        padding: 5px 18px;
        line-height:25px;
        text-shadow:none;
        cursor:pointer;
        box-shadow: none;
        background: #333333;
        color: #fff;
}

input, textarea {
    -moz-border-radius:10px; /* Firefox */
    -webkit-border-radius:10px; /* Safari, Chrome */
    -khtml-border-radius:10px; /* Konqueror */
    border-radius:10px; /* CSS3 */
}




/*TABLE */

.bold td {
         background: #333333;
         border: 0 solid #040;
         border-collapse: collapse;
         font-family: Arial;
         font-weight: bold;
         color:#ababab;
         font-size: 15px;
         text-align: left;
         padding: 5px;
}

.regular td {
         background: #DDD9C3;
         border-bottom: 1px solid #040;
         border-collapse: collapse;
         font-family: Arial;
         font-size: 15px;
         text-align: left;
         padding: 5px;
}


/* FOOTER */

footer
{
        position:relative;
        clear:both;
        width:auto;
        max-width: 1024px;
        height:200px;
        background:#333333;
        margin:0 auto;
}

footer .wrapper
{
        line-height:25px;
        margin: 0 auto;
        padding-top:30px;
        width:auto;
        max-width:900px;
        font-size:14px;
}


footer .wrapper .column
{
        font-family: Arial;
        text-align: center;
        color:#ababab;
        float:left;
        width:400px;
        margin-right:20px;
}

footer .wrapper .column.midlist ul li
{
        display:block;
        width:auto;
        padding:0 0 10px 25px;
        margin-bottom:10px;
        border-bottom: 1px solid #444444;
        background:url(img/arrowright2.png) left 6px no-repeat;
}

footer .wrapper .column.midlist ul li a:hover
{
        color:#fff;
}

footer .wrapper .column.rightlist ul li
{
        display:block;
        width:auto;
        margin-bottom:15px;
}

footer .wrapper .column.rightlist ul li a span
{
        margin-left:95px;
        display:block;
}

footer .wrapper .column.rightlist ul li a img
{
        transition: border .25s ease;
        float:left;
        border:3px solid #444444;
}

footer .wrapper .column.rightlist ul li a img:hover
{
        border-color: #5e5e5e;
}

footer .wrapper .column.rightlist h2
{
        font-family: Arial;
        font-size:18px;
        text-align: center;
        padding: 0 0;

}

footer .wrapper .column.rightlist h6
{
        font-family: Arial;
        font-size:14px;
        font-style:italic;
        text-align: right;
        padding: 0 0;

}


/* SKIPLINK */
.go-top {
        position: fixed;
        bottom: 2em;
        right: 2em;
        text-decoration: none;
        color: white;
        background-color: rgba(0, 0, 0, 0.3);
        font-size: 12px;
        padding: 1em;
        display: none;
}

.go-top:hover {
        background-color: rgba(0, 0, 0, 0.6);
}


/* SLIDESHOW */
/* Prevent the slideshow from flashing on load */
.slidesjs-container
{
        border-top: 1px #d6d0c1 solid;
}
#slides
{
  display: none
}

/* Center the slideshow */
.container
{
        width:auto;
        margin: 0 auto;
        position:relative;
}

/* Show active item in the pagination */
.slidesjs-pagination .active
{
  color:red;
}

#slider_content1 p .responsive_button, #slider_content2 p .responsive_button, #slider_content3 p  .responsive_button
{
        display:none;
        color:#000;
}


/* MISC */
.clear
{
        clear:both;
}
.hidden
{
        position:absolute;
        clip: rect(1px 1px 1px 1px); /* IE6 & 7 */
          clip: rect(1px, 1px, 1px, 1px);
}


/* MEDIA QUERIES FOR A RESPONSIVE LAYOUT */



@media (max-width: 765px)
{

         #mobileMenu
         {
         display:block;
         z-index:99;
         }

         .toggleMobile
         {
         position: fixed;
         top: 10px;
         right: 10px;
         display: block;
         width: 40px;
         height: 36px;
         cursor: pointer;
         z-index: 999;
         }

         .toggleMobile span.menu1, .toggleMobile span.menu2, .toggleMobile span.menu3
         {
         display: block;
         position: absolute;
         width: 40px;
         height: 8px;
         left: 0;
         background: #000000;
         -webkit-transition: all 0.35s cubic-bezier(0.75, 0.25, 0.10, 0.95);
         transition: all 0.35s cubic-bezier(0.75, 0.25, 0.10, 0.95);
         }

         .toggleMobile span.menu1
         {
         top: 0;
         }
         .toggleMobile span.menu2
         {
         top: 14px;
         }
         .toggleMobile span.menu3
         {
         top: 28px;
         }


         .toggleMobile.active span.menu1
         {
         top: 14px;
         -webkit-transform: rotate(45deg);
         -moz-transform: rotate(45deg);
         -o-transform: rotate(45deg);
         -ms-transform: rotate(45deg);
         transform: rotate(45deg);
         -webkit-transition: all 0.35s cubic-bezier(0.75, 0.25, 0.10, 0.95);
         transition: all 0.5s cubic-bezier(0.75, 0.25, 0.10, 0.95);
         }
         .toggleMobile.active span.menu2
         {
         -webkit-transform: rotate(-45deg);
         -moz-transform: rotate(-45deg);
         -o-transform: rotate(-45deg);
         -ms-transform: rotate(-45deg);
         transform: rotate(-45deg);
         -webkit-transition: all 0.35s cubic-bezier(0.75, 0.25, 0.10, 0.95);
         transition: all 0.5s cubic-bezier(0.75, 0.25, 0.10, 0.95);
         }
         .toggleMobile.active span.menu3
         {
         opacity: 0;
         -webkit-transition: opacity 0.35s cubic-bezier(0.75, 0.25, 0.10, 0.95);
         transition: opacity 0.35s cubic-bezier(0.75, 0.25, 0.10, 0.95);
         }


        .container
        {
                height:1px;
                top: -1500px;
        }
        header
        {
                height:120px;
        }
        nav
        {
                display:none;

        }

        footer
        {
                padding-bottom:70px;
                height: auto;
        }
        footer .wrapper
        {
                width: 350px;
                margin: 0 auto;
        }
        footer .wrapper .column
        {
                margin-top:30px;
                float:none;
                font-size: 14px;
                width: auto;
        }

}



/* KEYFRAMES */

@keyframes stylie-transform-keyframes {
  0% {transform:translateX(30px) translateY(46px) rotate(0deg) translate(-50%, -50%);animation-timing-function: cubic-bezier(.25,.25,.75,.75);}
  100% {transform:translateX(260px) translateY(-150px) rotate(0deg) translate(-50%, -50%);}
}

@keyframes stylie-transform2-keyframes {
  0% {transform:translateX(40px) translateY(40px) rotate(0deg) translate(-50%, -50%);animation-timing-function: cubic-bezier(.25,.25,.75,.75);}
  100% {transform:translateX(50px) translateY(40px) rotate(0deg) translate(-50%, -50%);}
}