/*
Theme Name: falk-itqm
Author: Sebastian Falk
Author URI: http://www.falk-itqm.de/
Description: A small and easy responsive Layout
Tags: responsive, blank
*/

/********************************************/
/********************************** FONTS ***/
/********************************************/
	
@font-face { font-family: 'Droid Sans'; src: url('../fonts/DroidSans.ttf') format('truetype'); }
body { font-family: 'Droid Sans',Verdana,Arial;}

/********************************************/
/********************* RESETS  & SETTINGS ***/
/********************************************/

body {margin: 0; padding: 0; position: relative;}
#seite {position:relative;}
a {text-decoration: none; color: #000; outline: none;}
a:hover {text-decoration: none;}
img {border: none; border: 0;}
h1, h2, h3 {padding:0; margin:0;}
p {margin: 0; padding: 0;}
.clear {clear: both;}
.left {float:left;}
.right {float:right;}
.alignright {float: right; padding: 1em; padding-right: 0; padding-top: 0; width: 48%;}
.alignleft {float: left; padding: 1em; padding-left: 0; padding-top: 0; width: 48%;}

/********************************************/
/********************************* LISTEN ***/
/********************************************/

li, ul {list-style: none; color: #333;}
ul {margin:0; padding:0;}
.content-wrapper ul {margin-bottom: 1em; color: #333;}
.content-wrapper li {margin-left: 1em; padding-bottom: 0.25em; list-style: disc; font-size: 0.875em; line-height: 1.5em;}
.content-wrapper p {}

/********************************************/
/**************************** 100% Layout ***/
/********************************************/

html, body, #seite {height:100%;}
#wrapper-100-pc-layout  {min-height:100%;}
#footer-sektion {height: 3.25em; margin: -3.25em auto 0; position: absolute; width: 100%; overflow: hidden;}
#footer-inhalt {height:3.25em;}
#content-inhalt-rechts  {margin-bottom: 2em;}
#content-inhalt-links {margin-bottom: 2em;}

/********************************************/
/**************************** LAYOUT/TYPO ***/
/********************************************/

body {color: #333; }
h1 {color: #333; font-size: 1.5em; font-weight: bold; padding-bottom: 0.75em; text-align: center;}
h2.as_h1 {color: #333; font-size: 1.5em; padding-bottom: 0.75em; text-align: center; font-weight: bold;}
h2 {color: #333; font-size: 1.25em; font-weight: normal; padding-bottom: 0.5em;}
h3 {color: #333; font-size: 1.125em; font-weight: normal; padding-bottom: 1em;}
p {color: #333; font-size: 0.875em; padding-bottom: 1em; text-align: left; line-height: 1.5em;}
a {color: #333; font-weight: 400;}
a:hover, a:active, a:focus {color: #87A438;}
ul.checklist li {background: url('icons/check.jpg') 0 2px no-repeat; font-size: 1em; margin-bottom: 1em; padding-left: 1.5em;}
.red {color: #ff0000;}
.geo {color: #fff; height: 0;}
strong {color: #444;}
em {color: #333; font-size: 1.25em; line-height: 1.25em; font-style: italic; font-weight: 400; max-width: 65%; display: block;}
em:before {content:'„'; padding-right: 0.25em; font-size: 1.125em;}
em:after {content:'“'; padding-left: 0.25em; font-size: 1.125em;}
table {margin-left: -0.125em; padding-bottom: 1em; font-size: 0.875em; padding-bottom: 0;}
table strong {padding-right: 1em;}
table td {padding-right: 1em; vertical-align: top;}
#content-inhalt-rechts table {padding-bottom: 1em;}
#content-inhalt-rechts a {border-bottom: 1px dotted #333;}
#content-inhalt-rechts a:hover, #content-inhalt-rechts a:active, #content-inhalt-rechts a:focus {border-bottom: none;}

/********************************************/
/***************************** STRUCTURAL ***/
/********************************************/

/* HEADER */
#header-sektion {position:relative; z-index: 100; background-color: #a9ea30; box-shadow: 1px 2px 3px #333; background-image: url("../images/header-top.jpg");}
#header-inhalt {margin: 0 auto; width: 60em; position:relative;}
/* LOGO */
#logo {float: left;}
#logo img {margin-bottom: 1em; margin-top: 2.75em; position: relative; z-index: 999;}
/* SLOGAN / SCHMUCKBILD */
#slogan {padding: 1em 0; text-align: right;}
#slogan .main {font-size: 1.25em; color: #066D4E; line-height: 1.25em;}
#slogan h1 {font-size:1em; font-weight: normal; text-transform: none; margin-bottom: 0; padding-bottom: 0; text-align: right;}
#slogan h1 span.main {font-size: 1.25em; color: #066D4E; }
#slogan .additional {color: #000; display: block; font-size: 1.25em; font-weight: bold; margin-top: 0.5em;}
/* KONTAKTBLOCK - POSITIONIERUNG */
#kontaktblock { background-color: #a9ea30; margin-bottom: 1em; margin-left: -1em; margin-top: 1em; width: 14em; padding: 1em; box-shadow: 1px 2px 3px #333;}
#kontaktblock h3 {text-align: left;}
/* KOPFNAVIGATION */
#kopfnavigation {float: right; margin-bottom: 0.25em;}
#kopfnavigation li { float: left; }
#kopfnavigation ul.children { display: none; }
#kopfnavigation a { padding-left: 0.75em; color: #333; font-size: 1.125em; text-transform: uppercase;}
#kopfnavigation li.current_page_item a, #kopfnavigation li.current_page_parent a {color: #aa0a56; }
#kopfnavigation a:hover, #kopfnavigation a:active, #kopfnavigation a:focus {color: #aa0a56;}
/* SCHMUCKBILD */
#schmuckbild-sektion {background-color: #AFDEE6; position:relative;}
#schmuckbild-inhalt {margin: 0 auto; background-color: #D2D7DB; position:relative; max-height: 20em; overflow: hidden;}
#schmuckbild-inhalt img {width:100%;}
/* INHALT */
#content-sektion {position:relative;} 
#content-inhalt {margin: 0 auto; width: 60em; position:relative; padding: 3em 0 0; margin-bottom: 2em; min-height: 15em;}
#content-inhalt-rechts {float: right; width: 42.5em; }
#content-inhalt-rechts .content-wrapper {padding: 2em; background-color: rgba(255,255,255, 0.65); box-shadow: 1px 2px 3px #333;}
#content-inhalt-links {float: left; width: 15em; padding: 1em;}
/* LINNKE SEITENNAVIGATION */
#navigation-links {margin-bottom: 1em; margin-left: -1em; margin-top: -1em; width: 16em; box-shadow: 1px 2px 3px #333;}
#navigation-links .page_item_has_children .children {display: none;}
#navigation-links .page_item_has_children .children li a {padding-left: 2em;}
#navigation-links .page_item_has_children.current_page_item .children {display: block;}
#navigation-links .page_item a {color: #fff; display: block; margin-bottom: 3px;}
#navigation-links .page_item_has_children.current_page_parent .children {display: block;}
#navigation-links .children a {padding-left: 2em;}
#navigation-links .page_item a {background-color: #a9ea30; color: #333; font-size: 1em; padding: 0.5em 1em; font-weight: 400;}
#navigation-links .current_page_item a, #navigation-links .page_item a:hover, #navigation-links .page_item a:active, #navigation-links .page_item a:focus, #navigation-links .current_page_parent a {color: #004d4d; background-color: #89ca10;}
#navigation-links .children .current_page_item a, #navigation-links .children a:hover, #navigation-links .children a:active, #navigation-links .children a:focus {font-weight:normal; background-color: #a9ea30;}

#navigation-links .page_item_has_children.current_page_item a {font-weight:normal;}
#navigation-links .page_item_has_children.current_page_item ul a {font-weight:normal;}
/* FOOTER */
#footer-sektion {background-color: #a9ea30; position:relative; box-shadow: -1px -2px 3px;} 
#footer-inhalt {margin: 0 auto; width: 60em; position:relative;}
/* FOOTER NAVIGATION */
#footer-inhalt {color: #fff; font-style: italic; font-weight: 400;}
#footer-inhalt a {color: #333; font-style: normal; font-weight: 400; padding: 1em 1.25em 1em 0; display: block; float: left;}
.copyright {float: right; padding: 1em 1.25em 1em 0; font-style: normal; display: block; color: #333; font-size: 1em;	}

/********************************************/
/************************* MEDIA-ELEMENTE ***/
/********************************************/

.attachment-post-thumbnail {border: 0.25em solid #e0e9c5; /*box-shadow: 1px 2px 3px #333;*/ float: right; height: auto; margin: -3em -4em 0.5em 1.25em; max-width: 40%;
-ms-transform: rotate(4deg); /* IE 9 */
-webkit-transform: rotate(4deg); /* Chrome, Safari, Opera */
transform: rotate(4deg);}

/********************************************/
/****************** Contactform & Captcha ***/
/********************************************/

.wpcf7-text, .wpcf7-textarea {padding:0.25em; border: none; border: 1px solid #cecece; width: 98%; font-size: 1em; }
.wpcf7-captchar {border: none; border: 1px solid #cecece; width: 65px; padding:0.25em; height: 16px;}
.wpcf7-captchar, .wpcf7-captchac {float: left; margin-top: 0.5em; margin-bottom: 0.5em; margin-right: 1em;}
.wpcf7-submit, .call-top-action a {background-color: #3ea20e; border: medium none; color: #fff; cursor: pointer; display: inline-block; font-size: 1em; margin: 1em 0; padding: 0.5em; border-bottom: none !important;}
.wpcf7-submit:hover, .call-top-action a:hover, .wpcf7-submit:active, .call-top-action a:active, .wpcf7-submit:focus, .call-top-action a:focus {border: none; padding: 0.5em; font-size: 1em; background-color: #1E8200; color: #fff; cursor: pointer;}
textarea {font-size: 0.875em; font-family: Arial;}
div.wpcf7-response-output {margin: 0 !important; width: 90%;}
.captcha-question {width: 75%;}

#gmeg_map_canvas {height: 20em; margin-bottom: 1em;}
.geo {display: none;}

/********************************************/
/******************** Plugin CookieChoice ***/
/********************************************/

#cookieChoiceInfo {z-index: 999999 !important; background-color: #40AD28 !important; color: #fff !important; padding: 1em !important; border: 1px solid #333 !important;}
#cookieChoiceInfo span {display: block !important; margin-bottom: 1em;}
#cookieChoiceInfo a {color: #fff !important; padding: 0.25em 0.5em; border: 1px solid #309D18; background-color: #50BD38;}
#cookieChoiceInfo a:hover {background-color: #309D18; border: 1px solid #333;}

/********************************************/
/********************* GIMMICKS OTHERWISE ***/
/********************************************/

.tram {background-color: #ffcc00; border-radius: 1em; color: #000; font-weight: bold; margin-bottom: 0.25em; padding: 0.25em 0.5em; text-align: center; width: 1.25em;}

/********************************************/
/******************** PRE-MOBIL-(P)RESETS ***/
/********************************************/

/*ELTERN/ALLE*/
#mobil-navigation {display: none;}
#mobil-navigation ul, #mobil-navigation li {list-style:none; margin: 0; padding: 0;}
#mobil-navigation .page_item {width: 100%; background-color: #A9EA30; text-align: left; border-bottom: 1px solid #fff;}
#mobil-navigation .page_item a {text-decoration: none; padding: 1em; display: block; color: #333; text-transform: none;}
#mobil-navigation .page_item a:hover, #mobil-navigation .page_item a:active, #mobil-navigation .page_item a:focus, #mobil-navigation .current_page_item a {background-color: #89CA10; color: #333;}
#mobil-navigation .page_item_has_children.current_page_item a {font-weight:normal;}
#mobil-navigation .page_item_has_children.current_page_item ul a {font-weight:normal;}
/* KINDER */
/*Kinder abschalten wenn nicht aktiv*/
#mobil-navigation .children {display: block;}
#mobil-navigation .children { margin: 0; padding: 0; width: 100%; text-align: left;}
#mobil-navigation .page_item_has_children.current_page_item .children {display:block;}
#mobil-navigation .current_page_ancestor.current_page_parent .children {display:block;}
#mobil-navigation .children .page_item { background-color: #97B448; border: none; border-top: 1px solid #fff;}
#mobil-navigation .page_item_has_children .page_item a { padding-left: 2em;}
#mobil-navigation-titel {padding: 1em; display: block; color: #fff; font-size: 1.125em; text-align: center; background-color: #3ea20e; display: none; font-style: italic; font-weight: 400; border-bottom: 1px solid #fff; box-shadow: -1px -2px 3px #333;}
/* ID-NAVIGATION / MENÜ / TOP */
#to-top-button a {padding: 1em; display: block; color: #fff; font-size: 1.125em; font-style: italic; }
#to-top-button {text-align: center; background-color: #3ea20e; display: none; }
#to-menu-button a {padding: 1em; display: block; color: #fff; font-size: 1.125em;}
#to-menu-button {text-align: left; background-color: #3ea20e; display: none;}
#to-top-button a:hover, #to-menu-button a:hover, #to-top-button a:active, #to-menu-button a:active, #to-top-button a:focus, #to-menu-button a:focus {background-color: #333;}
/* AFTER ICONSET */
#to-menu-button a {display:inline-block;}
#to-menu-button a img {width: 1.25em; height: 1.25em; padding: 0.25em 0em;}

.startseite-praxis.left {width: 48%; height: auto; float: left; border: 0.25em solid #e0e9c5;}
.startseite-praxis.right {width: 48%; height: auto; float: right; border: 0.25em solid #e0e9c5;}

/********************************************/
/********************************** MOBIL ***/
/********************************************/

@media only screen and (min-width : 12.5em) and (max-width : 60em)
{
	
	/*****************/
	/****** RESET UP */
	/*****************/
	#header-inhalt, #content-inhalt, #footer-inhalt, #copyright-inhalt, #schmuckbild-inhalt, #content-inhalt-rechts, #content-inhalt-links {width: auto;}
	html, body, #seite, #content-sektion, #content-inhalt, #content-inhalt-rechts, #content-inhalt-links, #content-inhalt-rechts .content-wrapper {height:auto; min-height:auto; position: relative;}
	#copyright-sektion, #footer-sektion, #kopfnavigation, #navigation-links {display: none;}
	#content-inhalt {margin: 0 auto;}
	
	/*****************/
	/********* ITEMS */
	/*****************/
	/* TABLES */
	table tr {width: 100%;}
	table td {margin-bottom: 0.25em; width: 100%; display: block;}
	/* LISTS */
	#content-inhalt-rechts li  {max-width: 85%;}
	
	/*****************/
	/* LAYOUT / TYPO */
	/*****************/
	h1, h2, h3 {margin-bottom: 0.5em; padding: 0 !important; text-transform: none;}
	p {text-align: left;}
	em {max-width: 100%;}
	
	/*****************/
	/**** STRUCTURAL */
	/*****************/
	#header-sektion {margin-bottom: 0em;}
	#logo {width: 100%; margin: 1.5em auto 0; text-align:center;}
	#logo img {max-width: 20em; width: 80%; margin-top: 0;}
	#slogan {padding: 1em; text-align: center;}
	#schmuckbild-inhalt {height: auto;}
	#wrapper-100-pc-layout, .content-wrapper  {min-height:auto; height: auto; position: relative;}
	#content-sektion {margin-bottom: 0em;}
	#content-inhalt-rechts, #content-inhalt-links {float: none; clear: both; position: relative;}
	#content-inhalt-rechts, #content-inhalt-rechts .content-wrapper {background-color: #fff;}
	#content-inhalt {padding:1em;}
	#content-inhalt-links {margin: 0 auto; padding: 0; background-color: #fff;}
	#content-inhalt-rechts {margin-bottom: 0em;}
	#content-inhalt-rechts .content-wrapper {padding: 0; }
	#content-inhalt-rechts .content-wrapper {box-shadow: none;}
	
	/*****************/
	/**** MOBIL-NAVI */
	/*****************/
	#mobil-navigation, #to-top-button, #to-menu-button, #mobil-navigation-titel {display: block; text-align: center;}
		
	/*****************/
	/** KONTAKTBLOCK */
	/*****************/
	#kontaktblock {display: none;}
	
	/******************/
	/* CONTACT-FORM-7 */
	/******************/
	.wpcf7 {max-width: 98%;}
	.wpcf7-acceptance {display: block; margin: 1em 0; margin-top: 1.5em; }
	.wpcf7-submit {margin-bottom: 0 !important; }
	div.wpcf7-validation-errors {margin-bottom: 1em !important; max-width: 85%; font-size: 0.875em !important;}
	span.wpcf7-not-valid-tip {font-size: 0.875em !important; padding-top: 0.5em !important;}
	
	/******************/
	/* CALL TO ACTION */
	/******************/
	.call-top-action a, .wpcf7-submit {border: 1px solid #88888a; margin-bottom: 1.35em; margin-top: 0.5em;}
	a.call-top-action-mobil {display:block;}
	#schmuckbild-inhalt .call-top-action {top:0;left:0;position:relative; text-align: center; padding: 1em 0 2em;}
	#schmuckbild-inhalt .call-top-action a {display: inline; }
	
	/******************/
	/********** MEDIA */
	/******************/
	.attachment-post-thumbnail {margin: 1em;}
	
	/******************/
	/*** HIDE BG_PICS */
	/******************/
	#supersized, #fsb_image {display: none !important;}
	
	#header-sektion {background-image: none;}
	#slogan h1 {text-align:center !important;}
	
}

@media only screen and (min-width : 12.5em) and (max-width : 30em)
{
	.startseite-praxis.left, .startseite-praxis.right {float: left; width: 100%; height: auto; margin-bottom: 1em;}
	
}

@media only screen and (min-width : 12.5em) and (max-width : 21.5em)
{
.attachment-post-thumbnail {display: none;}
	img.alignright {display: none;}
	img.alignleft {display: none;}
}
