/* ---------Single Page Website CSS by Kelly King ----------*/

*{ margin: 0 auto;}


body {
	background:white;
	margin: 0 0 0 0;
	font-family:georgia, times,serif;

	}
P, ul, ol, li, body
					{ font-family: 'Oswald', sans-serif;
          font-weight: 300;
          font-style: normal;
            font-size: 13pt;
            color: black;
            margin: 0px 0px 0px 0px;
					    }


					td, th
					{
					  font-family: 'Oswald', sans-serif;
            font-size: 13pt;
            font-style: normal;
            font-weight:normal;
            color: black;
            font-weight: 300;

              }
          A:link.text {color: #00ABD3; text-decoration: none; background-color:none }
					A:active.text {color: #00ABD3; text-decoration: none; background-color:none }
					A:visited.text {color: #00ABD3; text-decoration: none; background-color:none}
					A:hover.text {color: #00ABD3; text-decoration: none; background-color:none }



            h1 {
        	font-family: 'Oswald', sans-serif;
  font-weight: 700;
        	font-size: 18pt;
        	 text-transform:uppercase;
        	color: Black;
        	margin: 5px 0px 0px 0px;
        }
        h2 {
        	font-family: 'Oswald', sans-serif;
  font-weight: 700;
        	font-size: 18pt;

        	color: #e95f32;
        	margin: 5px 0px 0px 0px;
        }
        h3 {
        	font-family: 'Oswald', sans-serif;
  font-weight: 700;
        	font-size: 18pt;

        	color: #00acd3;
        	margin: 5px 0px 0px 0px;
        }
        h4 {
        	font-family: 'Oswald', sans-serif;
  font-weight: 700;
        	font-size: 18pt;

        	color: #ee87ad;
        	margin: 5px 0px 0px 0px;
        }
        h5 {
        	font-family: 'Oswald', sans-serif;
  font-weight: 700;
        	font-size: 18pt;

        	color: #c6c400;
        	margin: 5px 0px 0px 0px;
        }


/* HEADER */

header
{
        position:fixed;

        width:100%;
        height: 120px;
        background:#3a3a3a;
        z-index: 3000;



}
div#gehtlos
{
        text-align: left;
   position:absolute;
   width: 220px;
   height: 100px;
   z-index: 4000;
   left: 50%;
   padding:25px 10px 10px 0px;
   background:white;


}
div#gehtlos2
{
   text-align: left;
   position:absolute;
   width:400px;
   height: 100px;
   z-index: 3000;
   left: 50%;
   padding:50px 0px 0px 20px;
   background:white;
   margin-left: 170px;
   margin-top: 0px;

}

div#myheader
{
        position:relative;
        width:auto;
        max-width:1230px;
        margin: 0 auto 20px auto;
        background:#3a3a3a;



}
div#mylogo {
position:relative;
   display:block;
   float:right;
   padding:10px 10px 10px 10px;

}

nav
{
        position:absolute;

        bottom:20px;

}

nav ul
{
        list-style:none;
}

nav ul li
{
        display:block;

        z-index: 2000;
        float:left;
        padding-left:0px;
        padding-right:20px;

}

nav ul li a
{
        font-family: 'Oswald', sans-serif;
        font-weight: 700;
        text-transform:uppercase;
        transition: all .25s ease;
        font-size:16px;
         color: white;
         padding:0px 0px;
         text-underline: none;



}

nav ul li a:hover
{
        font-size:16px;
        color:#dc8219;
        font-weight:bold;
        text-underline: none;
        text-decoration: none;
}


#mobileMenu
{
        position: fixed;
        top: 0;
        left: 0;
        width: 300px;
        display: none;
        color: white;
}

#mobileMenu ul li
{
        display:block;
        background-color: white;

        padding: 12px 0;
        letter-spacing: 0.1em;
        text-align: center;
        text-transform: uppercase;
        border-bottom: 1px solid black;
        color: white;
}
#mobileMenu ul li a:hover
{

        color: black;

}

.toggleMobile
{
        display: none;
}
/* Mobile Navigation */



/* Mobile Navigation */
.nav-mobile {
	display:none; /* Hide from browsers that don't support media queries */
	cursor:pointer;
	position:fixed;
	top:0;
	right:0;
	background:black url(../img/nav.svg) no-repeat center center;
	height:40px;
	width:40px;
	border-radius:5px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
}

/* 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);
}



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

/* MEDIA QUERIES FOR A RESPONSIVE LAYOUT */

@media (max-width: 1024px)
{


        .container .button
        {
                display:none;
        }
        #mobileMenu
        {
                display: block;
                z-index: 99;
        }
        #mobileMenu
        {
                display: block;
                z-index: 99;
        }
        .toggleMobile
        {
                position: fixed;
                top: 10px;
                left: 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: #EDA28C;
                -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);
        }
        header nav
        {
                display:none;
        }
        header nav#imp
        {
               display: block;
        }

        div#page1 {
	      height:1000px;
	       }
        div#page4 {
	      height:1400px;
	       }
         div#page9 {
	      height:1800px;
	       }
         div#page7 {
	      height:4000px;
	       }
      div#page6 {
      height:3200px;
      }
      div#page6_inner {
      height:3200px;
      }
       div#page6_1 {
      	width:100%;


      	}
        div#page6_2 {
      	width:100%;


      	}


}
@media (max-width: 650px)
{
        P, ul, ol, li, body, td, th
					{
            font-size: 20pt;
            }


        h1, h2, h3, h4, h5 {
        	font-size: 28pt;
        }


        .container .button
        {
                display:none;
        }
        #mobileMenu
        {
                display: block;
                z-index: 99;
        }
        #mobileMenu
        {
                display: block;
                z-index: 99;
        }
        .toggleMobile
        {
                position: fixed;
                top: 10px;
                left: 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: #EDA28C;
                -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);
        }
        header nav
        {
                display:none;
        }
        div#gehtlos
        {
                display:none;
        }
        div#gehtlos2
        {
                display:none;
        }
        div#start01{
        width:80%;
        }
        div#start02{
        display:none;
        }
        div#wowslider-container1{
        float:left;
        width:80%;
        }
        div#page1 {
	      height:1300px;
	       }
        div#page3 {
	      height:1300px;
	       }
      div#page6 {
      height:3600px;
      }
      div#page6_inner {
      height:3600px;
      }
       div#page6_1 {
      	width:100%;


      	}
        div#page6_2 {
      	width:100%;


      	}
       div#ref01{
        float:left;
        width:80%;
        padding-left:25px;
        }
        div#ref01 img{
        height:320px;
        width:242px;

        }
        div#ref02 img{
        height:320px;
        width:242px;

        }
        div#ref02{
        float:left;
        width:80%;
        padding-left:25px;
        padding-top:50px;
        }
        div#page2 {
        	height:2800px;

        	}
          div#page2_inner {
        	height:2800px;

        	}
        div#prog01{
        float:left;
        width:80%;
        padding-left:25px;
        }
        div#prog02{
        float:left;
        width:80%;
        padding-left:25px;
        padding-top: 25px;
        }
        div#prog03{
         float:left;
        width:80%;
        padding-left:25px;
        padding-top: 25px;
        }
        div#page3 {
      	height:4000px;

      	}
        div#info01{
        float:left;
        width:80%;
        padding-left:25px;
        }
        div#info02{
        float:left;
        width:80%;
        padding-left:25px;
        }
        div#page4 {
      	height:2100px;
      	}
        div#page4_inner {
      	height:2100px;
      	}
        div#ver01{
        float:left;
        width:80%;
        padding-left:25px;
        }
        div#ver02{
        float:left;
        width:80%;
        padding-left:25px;
        padding-top: 50px;
        }
        div#page5 {
      	height:1000px;
      	}
        div#unter01{
        float:left;
        width:80%;
        padding-left:25px;
        }
        div#unter02{
        float:left;
        width:80%;
        padding-left:25px;
        padding-top: 50px;
        }
        div#page7 {
      	height:7000px;

      	}
        div#page8 {
      	height:1800px;

      	}
        div#page9 {
      	height:3500px;

      	}
        div#page10 {
      	height:6000px;

      	}
        div#logo {

           text-align: center;
   position:absolute;
   width: 600px;
   height: 250px;
   z-index: 2000;
   left: 50%;
   padding:0px 10px 10px 10px;

margin-left: -300px;
margin-top: 0px;


        }
}




/* 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%);}
}



#start01{
float:left;
width:70%;
padding-left:25px;
}
#start02{
float:right;
width:30%;
padding-left:25px;
}
#ref01{
float:left;
width:50%;
padding-left:25px;
}
#ref02{
float:right;
width:50%;
padding-left:25px;
padding-top: 80px;
}
#prog01{
float:left;
width:33%;
padding-left:25px;
}
#prog02{
float:left;
width:37%;
padding-left:60px;
}
#prog03{
float:right;
width:30%;
padding-left:20px;
}
#wir01{
float:left;
width:100%;
padding-left:25px;
}
#ort01{
float:left;
width:100%;
padding-left:25px;
}
#fahrzeuge01{
float:left;
width:100%;
padding-left:25px;
}
#ausbildung01{
float:left;
width:100%;
padding-left:25px;
}
#kontakt{
float:left;
width:100%;
padding-left:25px;
}
#info02{
float:right;
width:50%;
padding-left:25px;
}
#ver01{
float:left;
width:50%;
padding-left:25px;
}
#ver02{
float:right;
width:50%;
padding-left:25px;
padding-top: 70px;
}
#unter01{
float:left;
width:50%;
padding-left:25px;
}
#unter02{
float:right;
width:50%;
padding-left:25px;
padding-top: 80px;
}
#page6_1 {
	width:40%;
  float:left;
  padding-left:25px;

	}
  #page6_2 {
	width:60%;
  float:right;
  padding-left:25px;
  padding-top:50px;
	}
#page1 {
	height:1200px;

	background:white;
	padding-top:120px;
  width:100%;
        min-width:768px;
  margin-left: auto;
    margin-right: auto;
	}
  #page1_inner {
	height:1100px;

	background:white;

  max-width:1200px;
        min-width:768px;
        margin-left: auto;
    margin-right: auto;
	}




  #page4 {
	height:1400px;
  width:100%;
        min-width:768px;
	background:#dd811a;
	padding-top:60px;
  color: white;
  margin-left: auto;
    margin-right: auto;
	}
  #page4_inner {
	height:1400px;
  max-width:1200px;
        min-width:768px;
	background:#dd811a;
  color: black;
  margin-left: auto;
    margin-right: auto;
	}

  #page5 {
	height:800px;
  width:100%;
        min-width:768px;
	background:white;
	padding-top:60px;
  color: white;
  margin-left: auto;
    margin-right: auto;
	}
  #page5_inner {
	height:800px;
  max-width:1200px;
        min-width:768px;
	background:white;
  color: black;
  margin-left: auto;
    margin-right: auto;
	}
   #page6 {
	height:3200px;
  width:100%;
        min-width:768px;
	background:#dd811a;
	padding-top:60px;
  color: white;
  margin-left: auto;
    margin-right: auto;
	}
  #page6_inner {
	height:3200px;
  max-width:1200px;
        min-width:768px;
	background:#dd811a;
  color: black;
  margin-left: auto;
    margin-right: auto;
	}
   #page7 {
	height:3500px;
  width:100%;
        min-width:768px;
	background:white;
	padding-top:60px;
  color: white;
  margin-left: auto;
    margin-right: auto;
	}
  #page7_inner {
	height:3500px;
  max-width:1200px;
        min-width:768px;
	background:white;
  color: black;
  margin-left: auto;
    margin-right: auto;
	}
  #page8 {
	height:1100px;
  width:100%;
        min-width:768px;
	background:#dd811a;
	padding-top:60px;
  color: white;
  margin-left: auto;
    margin-right: auto;
	}
  #page8_inner {
	height:1100px;
  max-width:1200px;
        min-width:768px;
	background:#dd811a;
  color: black;
  margin-left: auto;
    margin-right: auto;
	}
     #page9 {

	height:1600px;
  width:100%;
        min-width:768px;
	background:#dd811a;
	padding-top:100px;
  color: white;
  margin-left: auto;
    margin-right: auto;
	}
  #page9_inner {
	height:1600px;
  max-width:1200px;
        min-width:768px;
	background:#dd811a;
  color: black;
  margin-left: auto;
    margin-right: auto;
	}
       #page10 {

	height:1900px;
  width:100%;
        min-width:768px;
	background:#dd811a;
	padding-top:100px;
  color: white;
  margin-left: auto;
    margin-right: auto;
	}
  #page10_inner {
	height:1900px;
  max-width:1200px;
        min-width:768px;
	background:#dd811a;
  color: black;
  margin-left: auto;
    margin-right: auto;
	}
  #Aus01 {
	height:30px;
  width:500px;
  min-width:300px;
	background:#3a3a3a;
	padding-top:3px;
  padding-left:30px;
  color: white;
  margin-left: 30px;
  margin-right: auto;
  margin-top: 7px;
	}
  #Aus02 {
  float:right;
	padding-top:5px;
  padding-right:30px;
  color: white;
  font-family: 'Oswald', sans-serif;
  font-size:13px;
	}
   #Tel {
	height:45px;
  width:330px;
  min-width:300px;
	background:white;

	padding-top:3px;
  padding-left:30px;
  border-radius: 30px;
  margin-left: 30px;
  margin-right: auto;
  margin-top: 7px;
          font-family: 'Oswald', sans-serif;
          font-weight: 700;
        	font-size: 20pt;
        	text-transform:uppercase;
        	color: Black;
	}
  #Aus01:hover  {
  background:#dd811a;
  color: white;
	}
  div#Aus01 a:link { color: white; }
  div#Aus01 a:visited { color: white; }
  div#Aus01 a:hover { color: #3a3a3a; }
  div#Aus01 a:active { color: white; }

  #footer {

	height:100px;
	width:100%;
	background:#3a3a3a;
	padding-top:0px;
  margin-left: auto;
    margin-right: auto;
	}
  #footer_inner {
	max-width:1150px;
  min-width:768px;
  font-family: 'Oswald', sans-serif;
  font-weight: 300;
   word-spacing: 3px;
        transition: all .25s ease;
         font-size:14px;
         color: white;
         padding:20px 0px;
         margin-left: auto;
    margin-right: auto;

	}
