/*
Theme Name: 
Description: 
Author: Merkwert - Agentur für nachhaltige Kommunikation
Author URI: www.merkwert.de
*/
/* HTML5 display definitions
   ========================================================================== */

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary
{
display: block;
}

audio,
canvas,
progress,
video {
  display: inline-block; /* 1 */
  vertical-align: baseline; /* 2 */
}

audio:not([controls]) {
  display: none;
  height: 0;
}

[hidden],
template {
  display: none;
}

/**
 * Correct overflow not hidden in IE 9/10/11.
 */

svg:not(:root) {
  overflow: hidden;
}
/* =========== Anfang ============= */
* {
   margin: 0;
   padding: 0;
	}

html {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
*, *:before, *:after {
  -webkit-box-sizing: inherit;
  -moz-box-sizing: inherit;
  box-sizing: inherit;
  }

html,
body
{
min-height: 100%;
    
}

ul {
	list-style-type: none; 
	}
body
{
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#849fb4+0,547e8e+50,849fb4+100 */
background: #a0b1c3; /* Old browsers */
/* background:  -moz-linear-gradient(top, #e1e9d7 0%,#dde8d6 50%, #a0b1c3 100%);
background:  -webkit-linear-gradient(top, #dce5d4 0%,#dde8d6 50%, #a0b1c3 100%); 
background: linear-gradient(to bottom, #e1e9d7 0%,#dde8d6 50%, #a0b1c3 100%); 
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a0b1c3', endColorstr='#a0b1c3',GradientType=0 ); 
background-repeat: no-repeat;   
background-attachment: fixed;
background-position: top;    */
text-align: left;

}

/* =========== clearfix ============= */
    .clearfix:after {
       visibility: hidden;
       display: block;
       font-size: 0;
       content: " ";
       clear: both;
       height: 0;
       }
    * html .clearfix             { zoom: 1; } /* IE6 */
    *:first-child+html .clearfix { zoom: 1; } /* IE7 */
				
/* =========== Schriften  ============= */				
/* catamaran-regular - latin */
@font-face {
  font-family: 'Catamaran';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/catamaran-v17-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/catamaran-v17-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/catamaran-v17-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/catamaran-v17-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('fonts/catamaran-v17-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/catamaran-v17-latin-regular.svg#Catamaran') format('svg'); /* Legacy iOS */
}

/* catamaran-600 - latin */
@font-face {
  font-family: 'Catamaran';
  font-style: normal;
  font-weight: 600;
  src: url('fonts/catamaran-v17-latin-600.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/catamaran-v17-latin-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/catamaran-v17-latin-600.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/catamaran-v17-latin-600.woff') format('woff'), /* Modern Browsers */
       url('fonts/catamaran-v17-latin-600.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/catamaran-v17-latin-600.svg#Catamaran') format('svg'); /* Legacy iOS */
}

/* open-sans-regular - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/open-sans-v34-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/open-sans-v34-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/open-sans-v34-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/open-sans-v34-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('fonts/open-sans-v34-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/open-sans-v34-latin-regular.svg#OpenSans') format('svg'); /* Legacy iOS */
}

/* open-sans-600 - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 600;
  src: url('fonts/open-sans-v34-latin-600.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/open-sans-v34-latin-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/open-sans-v34-latin-600.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/open-sans-v34-latin-600.woff') format('woff'), /* Modern Browsers */
       url('fonts/open-sans-v34-latin-600.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/open-sans-v34-latin-600.svg#OpenSans') format('svg'); /* Legacy iOS */
}



h1,h2,h3,h4
{
font-family: 'Catamaran', sans-serif;
letter-spacing: 0.1em;    
font-weight: 400; 
color: #596B7D;     
hyphens:auto;
}
h1 {
color: #FFF;
text-shadow: 0px 1px 1px #596b7d; 
}
p
{
font-family: 'Open Sans', sans-serif;
color: #596B7D;   
}
/* =========== header ============= */				
header
{
position: fixed;
left: 0;
top: 0;    
z-index: 9999;
height: auto;
background-color: #f8f9fa;  
width: 100%;    
margin: 0 0 2em 0;    
}

header.sticky
{
height: 3em;  
background-color: transparent;
}

#logo
{
display: block;
margin: 1em 2em 2em 0;  
width: 12em;
height: auto;
opacity: 1;    
}

header.sticky #logo
{
opacity: 0;
}

#social-link
{
position: absolute;
top: 2em;
left: calc(100% - 2.5em);   
}

.fa-twitter-square,
.fa-blog
{
color: #fff;
font-size: 1.5em;    
}
.fa-twitter-square:hover,
.fa-twitter-square:focus,
.fa-twitter-square:active,
.fa-blog:hover,
.fa-blog:focus,
.fa-blog:active
{
color:  #cc7620;   
}
.fa-twitter-square
{
margin: 0 0 1em 0;    
}

header.sticky #social-link
{
display: none;
visibility: hidden;
}
.navbar
{
position: relative;
top: -2.5em;
background: rgba(255,255,255,0.7);    
}

header.sticky .navbar
{
transform: translateY(-8em);
-moz-box-shadow: 0 2px 3px 0px rgba(0, 0, 0, 0.16);
-webkit-box-shadow: 0 2px 3px 0px rgba(0, 0, 0, 0.16);
box-shadow: 0 2px 3px 0px rgba(0, 0, 0, 0.16); 
width: 100%;    
}

#beschreibung
{
display: block;
width: 100%;
padding: 0.5em; 
position: relative;
top: -2em;
}


header.sticky #beschreibung
{
display: none;
visibility: hidden;
}

#beschreibung ul li
{
color: #596B7D;    
}
.navbar-light .navbar-nav .nav-link,
.fa-home
{
color: #596B7D;    
margin: 0 0 0 1em;
}

#menu-main li
{
height: auto;
}

#menu-main li:last-child
{
border-right: none;    
}

#menu-main li a
{
-webkit-transition: all 0.5s ease;
}

#menu-main li.current-menu-item a
{
position: relative;
left: 1em;
color:#6a9ab0;
top: 0;    
}

#menu-main li a:hover
{
color:#6a9ab0; 
}

/* =========== Positionierung main ============= */
main
{
margin-top: 30em;
padding: 2em 0.5em 2em 0.5em;    
background: rgba(255,255,255,0.7);
border-radius: 2em;    
}

header.sticky ~ main
{
transform: translateY(-22em);   
}

/* =========== Startseite ============= */

body.home main
{
background: transparent;
box-shadow: none;   
}

/*body.home .wrapper-teaser:before
{
content: 'Portfolio';  
background: #608698; 
display: inline-block;  
color: #fff;
padding: 2px;   
height: 30px;    
position: relative;
top:1em;
left: 0;  
z-index: 999;    
padding: 0.125em 0.25em;
border-radius: 0.25em;    
}*/




@keyframes drift {
  from { transform: rotate(0deg); }
  from { transform: rotate(360deg); }
}

body.home .col-md
{
background-size: cover;    
padding: 10px;  
box-shadow: 25px 25px 50px 0 white inset, -25px -25px 50px 0 white inset;  
border: 15px solid #fff8e1;  
transition: all 1s;    
border-radius: 2em;
margin: 0 0 1em 0;  
}
.kachel-1
{
background: url(images/Kachel-1-800_570.png);     
}
.kachel-2
{
background: url(images/Kachel-2-800_570.png);   
}
.kachel-3
{
background: url(images/Kachel-3-800_570.png);  
}
.kachel-4
{
background: url(images/Kachel-4-800_570.png);  
}

.kachel-5
{
background: url(images/Kachel-5-800_570.png);  
}
.kachel-6
{
background: url(images/Kachel-6-800_570.png);  
}
body.home .col-md:hover,
body.home .col-md:focus,
body.home .col-md:active
{
transform: scale(1.05);
}

body.home .col-md h2
{
color: #596B7D;   
text-shadow: 1px 1px #fff;    
}

.teaser_home li
{
background: rgba(255,255,255,0.7);
color: #596B7D; 
margin: 0.5em;
padding: 0 0.5em;
width: auto;
border-radius: 1em;
display: inline-grid;
font-size: 1.125em;    
}

#news-bubble
{
background: #fff8e1;
box-shadow: 25px 25px 50px 0 white inset, -25px -25px 50px 0 white inset; 
animation:greenPulse 5s infinite;
-webkit-animation:greenPulse 5s infinite;
-moz-animation:greenPulse 5s infinite;
-o-animation:greenPulse 5s infinite;    
position: relative;
z-index: 999; 
margin: 0 0 2em 0;   
border-radius: 2em;    
}

.inner-bubble 
{
line-height: 1.1em;
font-size: 100%;
margin: 0;
padding:0.5em 1em 1em 1em;
}   

.trenner
{
margin: 1em 0 0 0;  
padding: 0 0 0 0.5em;    
color: #fff;  
text-shadow: 0px 1px 1px  #596B7D;     
}

.wp_rss_retriever
{
background: rgba(255,255,255,0.7);
padding: 5px;
box-shadow: 25px 25px 50px 0 white inset, -25px -25px 50px 0 white inset;     
margin: 2em 0 0 0;
position: relative;
z-index: 20;
border-radius: 2em;
animation:greenPulse 5s infinite;
-webkit-animation:greenPulse 5s infinite;
-moz-animation:greenPulse 5s infinite;
-o-animation:greenPulse 5s infinite;      
}


.wp_rss_retriever_item
{
display: block;
width: 100%; 
list-style-type: none;
padding: 1em 1em 0.5em 1em;  
text-indent: .125em;  
  
}



.wp_rss_retriever_title
{
font-size: 1.1em;    
font-family: 'Catamaran', sans-serif;
display: inline-block !important;
}

.wp_rss_retriever_title:link,
.wp_rss_retriever_title:visited
{
color: #596B7D; 
border-right: 1px solid transparent; 
padding-right: 0.5em;     
}

.wp_rss_retriever_title:hover,
.wp_rss_retriever_title:active,
.wp_rss_retriever_title:focus
{
color:  #cc7620; 
border-right: 4px solid #cc7620;  
   
}

.wp_rss_retriever_title:before
{
font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f35d";
display: inline-block;
font-style: normal;
font-variant: normal;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
position: relative;
left: -0.5em;
}

.wp-rss-template-container ul li a:hover:before
{
color: #cc7620;     
}


@keyframes greenPulse {
  0% {box-shadow:0 0 30px #98abbc}
  50% {box-shadow:0 0 80px #b4c2ce}
  100% {box-shadow:0 0 30px #98abbc}
}

div#beaker span.glow {
  width:100%;
  height:100%;background:#fff;
  position:relative;
  display:block;
  border-radius:200px;
  animation:greenPulse 2s infinite;
  -webkit-animation:greenPulse 2s infinite;
  -moz-animation:greenPulse 2s infinite;
  -o-animation:greenPulse 2s infinite;
}
/*  ========== inhalte ============= */

body.page main
{
width: 100%;
   
}


body.page main h1
{
color: #fff;
background: #608698;      
display: inline-block;
padding: 0.125em 0.75em;
position: relative;
left: -0.75em;
margin: 0 0 1em 0;    
}

body.page main ul li
{
 color: #596B7D; 
font-size: 1.1em;   
list-style-type: disc;
margin: 0 0 0 1em; 
list-style-position: outside;    
}
main h3
{
margin: 1em 0 0.5em 0;
border-left: 5px solid #596B7D;
padding: 0 0 0 0.25em;    
transition: border 1s;    
}

.mPS2id-target + h3,
.mPS2id-target + h4
{
border-left: 5px solid #cc7620;
background: #fff;
}

main a:link,
main a:visited
{
color: #cc7620;  
transition: all 1s;     
}

main a:hover
{
text-decoration: none;
color:  #cc7620;
}

.wpforms-container
{
color: #596B7D;  
}

/* =========== Spoiler ============= */	
.otfm-sp__f5f5f5 .otfm-sp__title
{
color: #596B7D;       
}

/* =========== footer ============= */				
footer
{
padding: 1em 1em 0 1em;
position: fixed;
bottom: 0;
background: rgba(255,255,255,0.9);
width: 100%;
margin: 2em 0 0 0;
box-shadow: 25px 25px 50px 0 white inset, -25px -25px 50px 0 white inset;      
}


#menu-service-footer li
{
display: inline-block;
margin: 0 1em 0 0;    
}

#menu-service-footer li a:link,
#menu-service-footer li a:visited
{
color: #596B7D;
}
/* =========== images ============= */

img		{
		border:0;
		max-width: 100%;
		height: auto;
		}
		
/* ==========================================================================
   media Queries - mobile devices
   ========================================================================== */
@media only screen and (min-width: 486px) {
/* =========== Positionierung main ============= */
main
{
margin-top: 25em;
}

header.sticky ~ main
{
transform: translateY(-16em);   
} 
} 

@media only screen and (min-width: 768px) {
 /* =========== Positioinerung main ============= */	  
main
{
margin-top: 20em;
}       
       
header.sticky ~ main
{
transform: translateY(-10em);
}          
/* =========== header ============= */				
header
{
left: 50%;
top: 0;
transform: translate(-50%, 0);
width: 100%;
background: transparent;    
}

header h2,
header p
{
color: #fff;    
text-shadow: 0px 1px 1px  #596B7D;
}
       
       
#beschreibung
{
display: inline-block;
width: 50%;
left: 35%;    
top: -11em;
position: relative;
}
       
#beschreibung ul li
{
color: #fff;    
}       
header.sticky .fa-twitter-square
{
left: calc(100% +17em);  
top: 3.5em;    
}       
    
#logo 
{
margin-left: 0;
width: 15em;
}
       
.navbar-light .navbar-nav .nav-link,
.fa-home
{
margin: 0;
}

.navbar
{
top: -8em; 
}

header.sticky .navbar
{
transform: translateY(-4em);
}
       
#menu-main li
{
height: 30px;
border-right: 1px solid #6a9ab0; 
}

#menu-main li:last-child
{
border-right: none;    
}

#menu-main li a
{
-webkit-transition: all 0.5s ease;
}

#menu-main li.current-menu-item a
{
position: relative;

left: 0;    
color:#6a9ab0;  
border-bottom:2px solid #cc7620;       
}

    
#menu-main li a:hover
{
color:#6a9ab0; 
border-bottom:2px solid #cc7620;      
}       
/* =========== Startseite ============= */       
       
.wp_rss_retriever_list
{
display: flex;
}
       
.wp_rss_retriever_item
{
display: inline-block;
width: calc(100%/3); 
padding: 1em 1em 1em 0.5em;  
  
}

}

 @media only screen and (min-width: 992px) {

body.home main
{
margin-top: 20em;
  
}       
header.sticky ~ main
{
transform: translateY(-10em);
} 
     
/* =========== wrapper ============= */

.wrapper
{
max-width: 980px;
margin: 0 auto;
}   
     
.social-link
{
position: absolute;
top: 2em;
left: calc(100% - 2em);
  
}

.fa-blog ,
.fa-twitter-square
{
font-size: 2em;  
     }
header.sticky .fa-twitter-square
{
left: calc(100% + 1em);  
top: 0.5em;    
} 
     
     
.page main
{
margin-top: 20em;    
}    

.page main article
{
width: 70%;    
 }
     
}

 @media only screen and (min-width: 1200px) {
  
   
}
@media only screen and (min-width: 1500px) {

body.home main
{
margin-top: -2em;    
}
#news-bubble
{
background: #fff8e1;
top: 14em;   
left: 95%;    
box-shadow: 25px 25px 50px 0 white inset, -25px -25px 50px 0 white inset; 
display:block;
float:left;
padding: 16%;
width:auto;
height:auto;
border-radius:50%;
-moz-border-radius:50%;
-webkit-border-radius:50%;
-khtml-border-radius: 50%;
animation:greenPulse 5s infinite;
  -webkit-animation:greenPulse 5s infinite;
  -moz-animation:greenPulse 5s infinite;
  -o-animation:greenPulse 5s infinite;      
z-index: 999999;
    }
       
.inner-bubble 
{
position: absolute;
width: 80%;
top: 50%;
line-height: 1.1em;
font-size: 100%;
margin: 0;
overflow: hidden;
transform: translate(-45%, -50%)
}

.wrapper-teaser
{
clear: both;
position: relative;
 
}        
  
}

/* =WordPress Core
-------------------------------------------------------------- */
.alignnone {
    margin: 0.3125em 1.25em 1.25em 0;
}

.aligncenter,
div.aligncenter {
    display: block;
    margin: 0.3125em auto 0.3125em auto;
}

.alignright {
    float:right;
    margin: 0.3125em 0 1.25em 1.25em;
}

.alignleft {
    float: left;
    margin: 0.3125em 1.25em 1.25em 0;
}

a img.alignright {
    float: right;
    margin: 0.3125em 0 1.25em 1.25em;
}

a img.alignnone {
    margin: 0.3125em 1.25em 1.25em 0;
}

a img.alignleft {
    float: left;
    margin: 0.3125em 1.25em 1.25em 0;
}

a img.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto
}

.wp-caption {
    background: #fff;
    border: 0.0625em solid #f0f0f0;
    max-width: 96%; /* Image does not overflow the content area */
    padding: 0.3125em 0.1875em 0.625em;
    text-align: center;
}

.wp-caption.alignnone {
    margin: 0.3125em 1.25em 1.25em 0;
}

.wp-caption.alignleft {
    margin: 0.3125em 1.25em 1.25em 0;
}

.wp-caption.alignright {
    margin: 0.3125em 0 1.25em 1.25em;
}

.wp-caption img {
    border: 0 none;
    height: auto;
    margin: 0;
    max-width: 98.5%;
    padding: 0;
    width: auto;
}

.wp-caption p.wp-caption-text {
    font-size: 0.6875em;
    line-height: 1.0625em;
    margin: 0;
    padding: 0 0.25em 0.3125em;
}

/* Text meant only for screen readers. */
.screen-reader-text {
	clip: rect(0.0625em, 0.0625em, 0.0625em, 0.0625em);
	position: absolute !important;
	height: 0.0625em;
	width: 0.0625em;
	overflow: hidden;
}

.screen-reader-text:hover,
.screen-reader-text:active,
.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 0.1875em;
	box-shadow: 0 0 0.125em 0.125em rgba(0, 0, 0, 0.6);
	clip: auto !important;
	color: #21759b;
	display: block;
	font-size: 0.875em;
	font-size: 0.875rem;
	font-weight: bold;
	height: auto;
	left: 0.3125em;
	line-height: normal;
	padding: 0.9375em 1.4375em 0.875em;
	text-decoration: none;
	top: 0.3125em;
	width: auto;
	z-index: 100000; /* Above WP toolbar. */
}