/* Meine Änderungen */

/* Farben
white: #e7e7e7;
blue: #00A3E0;
red: #CF4520;
darkblue: #323440;
skyblue: #78bde9;
*/

/* Media Queries
// Small screens
@media only screen { } /* Define mobile styles
@media only screen and (max-width: 40em) { } /* max-width 640px, mobile-only styles, use when QAing mobile issues
// Medium screens
@media only screen and (min-width: 40.063em) { } /* min-width 641px, medium screens
@media only screen and (min-width: 40.063em) and (max-width: 64em) { } /* min-width 641px and max-width 1024px, use when QAing tablet-only issues
// Large screens
@media only screen and (min-width: 64.063em) { } /* min-width 1025px, large screens
@media only screen and (min-width: 64.063em) and (max-width: 90em) { } /* min-width 1024px and max-width 1440px, use when QAing large screen-only issues
*/

html, body {
height: 100%;
background-color: #e7e7e7;
}
@media only screen and (max-width: 64.063em) {
	html, body {
		background-color: #fff;
}}
h1, h2, h3, p, a, li, button, span, label, select {
	text-rendering: auto !important;
}
.row {
	width:100%;
	max-width: 75rem;
}
.starter {
	margin-top: 30px;
}
.starter img {
	width: 100%;
}
@media only screen and (min-width: 40.063em) {
.content-wrapper-tight {
	background-color: #fff;
	padding: 1em 2em;
}
.content-wrapper {
	background-color: #fff;
	padding: 1em 5em;
}}
.abstand {
	margin-top: 30px;
}

/* Text */
h1, h2, h3, h4 {
	font-family: 'Roboto Slab', serif;
	font-weight: bold;
	color: #CF4520;
}
p, a, li {
	font-family: 'Roboto', sans-serif !important;
	font-weight: 500;
}
p {
	color: #323440;
}
a {
	color: #00A3E0;
}
.lead {
	font-size: 1.2em;
}

/* Buttons, Hairline */
button, .button {
	background-color: #00A3E0;
}
button:hover, .button:hover {
	background-color: 323440;
}
hr {
	border: 1px dotted #ddd;
}

/* Header Section */
header {
	background-color: #CF4520;
}
.top-bar, .top-bar-section li a:not(.button), .top-bar-section li a:not(.button):hover {
	background-color: #323440;
}
/* Topbar on small screens */
@media only screen and (max-width: 40em) {
.top-bar, .top-bar-section li a:not(.button), .top-bar-section li a:not(.button):hover, .top-bar.expanded .title-area {
	background-color: #CF4520;
}
.top-bar-section li a:not(.button), .top-bar-section li a:not(.button):hover {
	background-color: #323440;
}}
nav .top-bar-section {
    text-align: center;
}
.top-bar-section ul {
    display: inline-block;
}
.top-bar-section li a:not(.button) {
	color: #e7e7e7;
	font-size: 0.9em;
	  -o-transition: all 0.25s linear;
	  -ms-transition: all 0.25s linear;
	  -moz-transition: all 0.25s linear;
	  -webkit-transition: all 0.25s linear;
	  /* ...and now for the proper property */
	  transition: all 0.25s linear;
}
@media only screen and (min-width: 64.063em) {
.top-bar-section li a:not(.button) {
	font-size: 1em;
	width: 10em;
}}
.top-bar-section li a:not(.button):hover {
	color: #78bde9;
	/*background-color: #383b47 !important;*/
}
.active {
	background-color: #383b47 !important;
}
/* Logo on large Screens */
header h1 {
	background: url(../img/logo.png);
	background-size: contain;
	height: 71px;
	width: 400px;
	margin: 30px auto 25px auto;
}
/* Logo on small Screens */
nav h1 {
	position: absolute;
	background: url(../img/logo.png);
	background-size: contain;
	height: 36px;
	width: 203px;
	top: 4px;
	left: 5px;
}
header h1 span, nav h1 span {
	visibility: hidden;
}

/* Slider */
.container .columns {
	padding: 0;
}
.orbit-container .orbit-slides-container {
	max-height: 450px !important;
	overflow: hidden;
}
.example-orbit img {
	min-width: 100%;
}
.slider-image-1, .slider-image-2, .slider-image-3 {
	width: 100%;
	height: 450px;
	background-image: url(../img/kinderberatung_slider.jpg);
	background-position: 0 50%;
	background-size: cover;
}
.slider-image-2 {
	background-image: url(../img/mediation_slider.jpg);
}
.slider-image-3 {
	background-image: url(../img/mentaltraining_slider.jpg);
}
.slider-content {
    position: absolute;
    width: 26em;
    top: 3em;
    left: 13%;
}
.slider-content-down {
	top: 8em;
}
.slider-content-right {
	position: absolute;
	width: 26em;
    top: 5em;
    right: 12% !important;;
    text-align: right;
}
.slider-content h2, .slider-content h3, .slider-content p, .slider-content-right h2, .slider-content-right h3, .slider-content-right p {
	color: #e7e7e7;
}
.orbit-container .orbit-timer {
	visibility: hidden;
}

/* Call to Action mit Zitat */
.panel {
	border-left: 5px solid #CF4520;
}
blockquote {
	font-style: italic;
	border-left: none;
  	quotes: "\201C""\201D""\2018""\2019";
}
blockquote p {
	display inline;
	font-size: 1.3em;
	margin-bottom: 0;
}
blockquote:before {
 	color: #ccc;
  	content: open-quote;
  	font-size: 4em;
  	line-height: 0.1em;
  	margin-right: 0.25em;
  	vertical-align: -0.4em;
}
@media only screen and (min-width: 64.063em) {
	blockquote cite {
	font-size: 1em;
	margin-top: -10px;
}}
.call-to-action {
	margin-top: 10px;
}

/* Kundenstatements */
.statements p {
	margin-bottom: 0.3em;
}
.statements .small-8 {
	margin-top: 1em;
}

/* Kontakt */
#map_canvas {
	background-color: #e7e7e7;
	margin-top: 10px;
	margin-bottom: 1em;
	min-height: 300px;
	width: 100%;
}
#map_canvas iframe {
	border: none;
}
.link-to-gmaps {
	margin-bottom: 2em;
}

/* Neuigkeiten Blog */
.blog {
	padding: 0 4em;
}
.blog img {
	margin-left: 2em;
}

/* Footer */
.wrapper {
min-height: 100%;
height: auto !important;
height: 100%;
margin: 0 auto -7em;
}
.footer {
	background-color: #323440;
}
.footer, .push {
	height: 7em;
	clear: both;
}
.footer-logo {
	background: url(../img/logo_round.png) no-repeat;
	background-size: contain;
	display: inline-block;
	width: 48px;
	height: 48px;
	font-size: 1em !important;
	margin-right: 10px;
	float: none !important;
}
.footer-logo span {
	visibility: hidden;
}
.footer p, .footer ul a {
	display: inline-block;
	color: #666;
	font-size: 0.85rem;
}
.footer a, .footer ul a {
	color: #00A3E0;
}
.footer p a:hover, .footer ul a:hover {
	text-decoration: none;
  	border-bottom: 1px #00A3E0 dotted;
	color: #00A3E0;
}
@media only screen and (max-width: 40em) { .footer p {
	text-align: right;
	float: right;
}}
.footer hr {
	border: 1px dotted #444;
}

.typekit-badge {
	visibility: hidden !important;
}

/* Rolling Link Effekt */
.roll-link {
display: inline-block;
overflow: hidden;
vertical-align: top;
-webkit-perspective: 600px;
-moz-perspective: 600px;
-webkit-perspective-origin: 50% 50%;
-moz-perspective-origin: 50% 50%;}
.roll-link:hover {text-decoration:none;}
.roll-link span {
display: block;
position: relative;
padding: 0 2px;
-webkit-transition: all 400ms ease;
-moz-transition: all 400ms ease;
-webkit-transform-origin: 50% 0%;
-moz-transform-origin: 50% 0%;
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;}
.roll-link:hover span {
background: #CF4520;
-webkit-transform: translate3d( 0px, 0px, -30px ) rotateX( 90deg );
-moz-transform: translate3d( 0px, 0px, -30px ) rotateX( 90deg );}
.roll-link span:after {
content: attr(data-title);
display: block;
position: absolute;
left: 0;
top: 0;
padding: 0 2px;
color: #fff;
background: #CF4520;
-webkit-transform-origin: 50% 0%;
-moz-transform-origin: 50% 0%;
-webkit-transform: translate3d( 0px, 105%, 0px ) rotateX( -90deg );
-moz-transform: translate3d( 0px, 105%, 0px ) rotateX( -90deg );}