/*
Theme Name: Template-C
Theme URI: http://www.diestelkamp-consulting.de
Author: Diestelkamp Consulting GmbH
Author URI: http://www.diestelkamp-consulting.de
Description: Agentur für kreatives Design und professionelle Optimierung von Webseiten und Onlineshops.
Version: 2.0
License: 
License URI: 
Tags: Template-C
Text Domain: Template-C
This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/

/* Notebook 13", 15", 17" */
@media only screen and (max-width: 1440px) {
	.logo { float:left; margin:0 !important;  padding: 0; }
	.intro {
		padding: 6.5em 0 !important;
		background-color: #ffffff !important;
		background-position: center top !important; /* horizontal vertical */
		background-attachment: fixed !important;
		-webkit-background-size: contain !important; -moz-background-size: contain !important;
		-o-background-size: contain !important; background-size: contain !important;
	}
	.intro h2 { font-size: 2.2em !important; }
	.intro h3 { font-size: 1.6em !important; }
	.introbutton {
		margin-top: 0.5em !important;
		padding: 0.6em 1.2em !important;
		font-size: 1em !important;
	}
}

/* Netbook 10", 12" */
@media only screen and (min-width: 960px) and (max-width: 1279px) {
	.logo { float:left; margin:0 !important;  padding: 0; }
	.intro {
		padding: 5.8em 0 !important;
		background-color: #ffffff !important;
		background-position: center 20% !important; /* horizontal vertical */
		background-attachment: scroll !important;
		-webkit-background-size: cover !important; -moz-background-size: cover !important;
		-o-background-size: cover !important; background-size: cover !important;
	}
	.intro h2 { font-size: 1.8em !important; }
	.intro h3 { font-size: 1.4em !important; }
	.introbutton {
		margin-top: 0.5em !important;
		padding: 0.6em 1em !important;
		font-size: 0.9em !important;
	}
}

/* Tablet */
@media only screen and (max-width: 959px) {
	.logo { float:left; margin:0 !important;  padding: 0; }
	.intro {
		padding: 5em 0 !important;
		background-color: #ffffff !important;
		background-position: center 10% !important; /* horizontal vertical */
		background-attachment: scroll !important;
		-webkit-background-size: cover !important; -moz-background-size: cover !important;
		-o-background-size: cover !important; background-size: cover !important;
	}
	.intro h2 { font-size: 1.8em !important; }
	.intro h3 { font-size: 1.4em !important; }
	.introbutton {
		margin-top: 0.5em !important;
		padding: 0.5em 1em !important;
		font-size: 0.9em !important;
		line-height: 1 !important;
	}
	
	.header {
	position: relative !important;
	padding: 0 0 1em 0 !important;	
}



/* Bis 959 px, 960px - 10" Notebook */
.socials { display: none; }							/* Vertecken der Elementen */
#headermenu { display: none; }
#navigation { display: none; }
#searchmap { display: none; }
#mini-navigation  { display: block !important; }	/* Aktivierung der Elementen */
#mini-search { display: block !important; }
	
.menu-button {
	display: block !important;
	position: absolute;
	z-index: 10;
	top: 0;
	right: 0.5em;
	float:right;
	cursor: pointer;
	padding: 0;
	margin: 0;
	font-size: 3em;
	background: #ffffff;
	color: #9A9A9A; }
  
.menu-button .one-page { position: fixed; top: 0; right: 5%; padding-right: 45px; }
.menu-button .touch-button { display: none; } /* Pfeile nach unten */
	
/* Wprdpress-Menu Class, abhaengig von Menuename in WP */	
#menu-mobile {
	position:relative;
	width: 100%;
	overflow: hidden;
	margin: 0 auto;
	margin-top: 2em;
	text-align:center;
	max-height: 0;
    -webkit-transition: none;
    -moz-transition: none;
    -ms-transition: none;
    transition: none;
    -webkit-transform-style: preserve-3d;
    z-index: 999; }
    
#menu-mobile.opacity { opacity: 0; } /* hidden */

#menu-mobile.flexnav-show {
	max-height: 2000px;
	opacity: 1;
    -webkit-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -ms-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out; }
    
#menu-mobile.one-page { position: fixed; top: 50px; right: 5%; max-width: 200px; }
#menu-mobile li { position: relative; overflow: hidden; font-size: 0.9em; margin: 0; }
  
#menu-mobile li a {
	display: block;
	position: relative;
	text-align:left;
	overflow: hidden;
	padding: 0.5em;
    z-index: 2;
    color: #4c4c4c;
    background: #FFFFFF;
    border-bottom: 1px solid #ddd; }
    
#menu-mobile li ul { width: 100%; margin:0; padding:0; font-size: 1em;}
#menu-mobile li ul li { font-size: 100%; position: relative; overflow: hidden; }
#menu-mobile li ul.flexnav-show li { overflow: visible; }
#menu-mobile li ul li a { display: block; background: #f2f2f2; }
#menu-mobile ul li ul li a { background: #eeeeee; }
#menu-mobile ul li ul li ul li a { background: #e2e2e2; }

/* Pfeilen zur Untermenus */
#menu-mobile .touch-button {
	display: inline-block;
    position: absolute;
    top: 0;
    right: 0;
    width: 50px;
    height: 35px;
    text-align: center;
    background: #ffffff;
    background: rgba(0, 0, 0, 0.05);
    z-index: 999; }
    
#menu-mobile .touch-button:hover { cursor: pointer; }
#menu-mobile .touch-button .navicon { position: relative; top: 0.2em; font-size: 20px; color: #9A9A9A; }
}

/* Tablet  - Hochformat */
@media only screen and (max-width: 767px) {
	.socials { float: right; margin: 0; padding: 0; }
	.logo { float:left; margin:0 !important;  padding: 0; }
	.intro {
		padding: 3.8em 0 !important;
		background: url("../images/1920x785.jpg") no-repeat !important;
		background-color: #ffffff !important;
		background-position: center top !important; /* horizontal vertical */
		background-attachment: scroll !important;
		-webkit-background-size: cover !important; -moz-background-size: cover !important;
		-o-background-size: cover !important; background-size: cover !important;
	}
	.intro h2 { font-size: 1.4em !important; }
	.intro h3 { font-size: 1em !important; }
	.introbutton {
		margin-top: 0.4em !important;
		padding: 0.6em 0.8em !important;
		font-size: 0.8em !important;
		font-weight: normal !important;
	}
}

/* Mobile */
@media only screen and (max-width: 479px) {
	.logo { float:left; margin:0 !important;  padding: 0; }
	.socials { float: right; margin: 0.5em 0 0 0; padding: 0; }
	.intro {
		padding: 1.8em 0 !important;
		background: url("../images/1920x785.jpg") no-repeat !important;
		background-color: #ffffff !important;
		background-position: center top !important; /* horizontal vertical */
		background-attachment: scroll !important;
		-webkit-background-size: contain !important; -moz-background-size:  contain !important;
		-o-background-size: contain !important; background-size: cover !important;
	}
	.intro h2 { font-size: 1em !important; }
	.intro h3 { font-size: 0.8em !important; }
	.introbutton {
		padding: 0.3em 0.6em !important;
		font-weight: normal !important;
		line-height: 1.5 !important;
	}
}