m/*
Theme Name: stark_im_alter
Theme URI: http://stark_im_alter.de
Author: 
Author URI: 
Description: stark_im_alter
Version: 0.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: black, brown, orange, tan, white, yellow, light, one-column, two-columns, right-sidebar, flexible-width, custom-header, custom-menu, editor-style, featured-images, microformats, post-formats, rtl-language-support, sticky-post, translation-ready
Text Domain: stark_im_alter
*/


/* ===========================Layout Allgemein========================== */

html{
	width:100%; 
	height:100%;
	color: #626263;
	font-family: Helvetica, Helvetica Neue, Arial, sans-serif;
	font-size: 17px;
	line-height: 23px;
	margin:0;
	padding:0;
	}
	
body{
	width:100%; 
	height:100%;
	margin:0;
	padding:0;
	border-top:11px solid #4c8dff;
		}

#page{
	width:100%;
	height:auto;
	min-height:100%;
	margin:0 auto;
	}
	
#wrapper{
	width:100%;
	min-height:100%;
	float:left;
	}	
.wrapper01{
	width:100%;
	min-height:100%;
	float:left;
	border-top:1px solid #e2e2e2;
	}	
#main{
	padding-bottom:300px;
	overflow:hidden;
	}



/* ===========================Header========================== */
	
header#head{
	width:100%;
	height:110px;
	padding:14px 0 14px 0;
}

.header-con{
	width:990px;
	margin:0 auto;
	overflow:hidden;
	padding:0;
	}

#logo{
	width:15.15%;
	height:110px;
	margin-left:25px;
	margin-right:35px;
	float:left;
	}

.menu-button{display:none;}
	
#navi{
	width:680px;
	height:110px;
	padding-right:0px;
	float:right;}

#navi .menu-hauptmenue-container ul{
	padding:0;
	margin:0;
	}
	
#navi .menu-hauptmenue-container ul li{
	width:168px;
	height:110px;
	padding:0;
	float:left;
	text-decoration:none;
	list-style-type:none;
	text-align:center;
	line-height: 18px;
	letter-spacing: ;
	font-family: Helvetica, Helvetica Neue, Arial, sans-serif;
	font-weight: bold;
	font-size: 20px;
	text-align: center;
	border-left:1px solid white;
	border-right:1px solid white;
	}

#navi .menu-hauptmenue-container ul li a{
	width:168px;
	height:65px;
	padding:45px 0 0 0 ;
	float:left;
	color:#717171;
	}

#navi .menu-hauptmenue-container ul li a:hover, #navi .menu-hauptmenue-container ul li:hover, #navi .menu-hauptmenue-container ul li.current_page_item > a:link, #navi .menu-hauptmenue-container ul li.current_page_item > a:visited, #navi .menu-hauptmenue-container ul li.current_page_item > a:active,
#navi .menu-hauptmenue-container ul li.current_page_ancestor > a:link, #navi .menu-hauptmenue-container ul li.current_page_ancestor > a:hover, #navi .menu-hauptmenue-container ul li.current_page_ancestor > a:visited, #navi .menu-hauptmenue-container ul li.current_page_ancestor > a:active{
	background:#9fd904;
	text-decoration:none;
	color:white;
	}
/*========== UNTERMENU ==========*/
#navi .menu-hauptmenue-container ul li ul.sub-menu {
	width:165px;
	position:absolute;
	margin:0;
	padding:0;		
	border:none;
	display:none;
	z-index:105;
	  top: 135px;
	  border-top:14px solid #fff;
	}	
#navi .menu-hauptmenue-container ul li ul.sub-menu li{
	height:auto;
	clear:both;
	border-top:none;
	}	
#navi .menu-hauptmenue-container ul li:hover ul.sub-menu{
	display:block;
	}	
	
/*========== untermenü Farbe, Größe, Border und Textausrichtung ==========*/
#navi .menu-hauptmenue-container ul li ul.sub-menu li a{
	background-color:#fff;
	padding: 20px 15px;
	margin-bottom:0px;
	font-size:16px;
	color:#717171;
	height:20px;
	border-top:none;
	border-right:2px solid #fff;
	border-left:2px solid #fff;
	border-bottom:2px solid #fff;
	width:138px;	/*+m										<---Festebreite für unterpunkte */
	text-align:center;	/*+m									<---Text links Anschlage */
	}
#navi .menu-hauptmenue-container ul li ul.sub-menu li a:hover{
	background:#9fd904;
	color:#fff;
	}
/*========== MOBILE MENU-BUTTON ==========*/
.menu-button{
	width:100%;
	padding: 50px 0 15px 0;
  background-color: #fff;
	display:none;
  overflow: hidden;
  padding-top: 50px;
	}
.menu-toggle{
	color: #fff;
  background-color: #4c8dff;
  border: 1px solid #4c8dff;
  display: block;
  cursor: pointer;
  border-radius: 50%;
  width: 60px;
  height: 60px;
  margin: 0 auto;
  text-align: center;
  line-height: 3.8em;
  font-weight: bold;
	}
[data-icon]:before{
	content: attr(data-icon);
	speak:none;
	display:inline-block;
	font-size:250%;
	font-weight:normal;
	}	

.clearfix:before, clearfix:after{
	content: "";
	display:table;
	}
clearfix:after{
	clear:both;
	}
.clearfix{
	zoom:;
	}


.con{
	width:800px;
	padding:50px 0 50px 25px;
	}
		
	
#content{
	width:990px;
	height:auto;
	padding: 0 ;
	margin:0 auto;
	padding-bottom:45px;
		}

#content ul{padding-left:20px; margin-left:0px; display:inline-block; margin-top:0;}

#content ul li{
	list-style:disc;
	list-style-image:url(images/list-style-img.gif);
	color:#030303;
	
	}

.single-content-center{
	width:900px;
	height:auto;
	margin:0 auto;
	padding: 54px 45px 45px 45px;
	text-align:center;
	font-size:17px;
	font-weight:normal;
	}	
.single-content-center img{
	width:175px;
	}
.dreispalter{
	width:900px;
	height:auto;
	padding: 0 45px 50px 45px;
	text-align:center;
	overflow:hidden;
	}	

.dreispalter_spalte{
	width:260px;
	padding:20px;
	float:left;
	}
.dreispalter_spalte img{
	width:70px;
	}

/*ÜBER UNS*/

#mitglieder-content{
	width:100%;
	height:auto;
	background-color:#e2e2e2;
	}
.mitglieder{
	width:900px;
	height:auto;
	padding:45px 45px 75px 45px;
	margin:0 auto;
	overflow:hidden;
	}
.mitglied{
	width:430px;
	padding:0 10px 0 10px;
	height:auto;
	float:left;
	text-align:center;
	}
#content .mitglieder .mitglied h3{
	width:70%;
	padding-right:10%;
	background-size:contain;
	text-align:center;
	display:inline-block;
	margin:10px 0 0 0;
	padding:0;
	}
.mitglied img {
    width: 275px;
	border:1px solid #ddd;
}
/* PROJEKT */

.projekt-wrapper{
	width:100%;
	height:auto;
	background-color:#fff;
	
	}

.projekt-wrapper:nth-child(even){background-color:#e2e2e2;}
	
.projekt{
	width:990px;
	height:auto;
	padding: 0 ;
	margin:0 auto;

	}

/* FOOTER */

footer{
	width:100%;
	height:auto;
	color:#fff;
	line-height: 150%;
	clear:both;
	background-color:#4d90fe;
	}
	
#footer-content{
	width:990px;
	height:auto;
	margin:0 auto;
	padding-bottom:30px;
	}	
	
#footer-left{
	width:32.5%;
	height:auto;
	padding:20px 2.5% 2.5% 0;
	float:left;
	color:#fff;
	}

.social-media{}
	
.social-media a:nth-child(1){margin-right:0px;}	

.routenplaner{margin-top:15px;}	
	
.copyright{	}
	

	
#footer-right{
	width:62.5%;
	height:auto;
	padding:0 0% 2.5% 2.5%;
	float:left;
	}

<!-- formular -->



form.wpcf7-form div#name-email{
	width:100%;
	height:auto;
	float:left;
	}

div.kontakt-name input, div.kontakt-email input{width:100%; margin-bottom:10px;  background-color:#f5f5f5; border:none;}

div.kontakt-name{
	width:47%;
	height:auto;
	float:left;
	padding-right:4%;
	}

div.kontakt-email{
	width:47%; 
	height:auto;
	float:left; }		

div.kontakt-text{ width:98%; clear:both;}

.wpcf7-textarea, span.your-message{width:100%; height:90px; background-color:#f5f5f5; border:none;}


footer ::-webkit-input-placeholder { color:#4d90fe; }
footer ::-moz-placeholder { color:#4d90fe; } /* firefox 19+ */
footer :-ms-input-placeholder { color:#4d90fe; } /* ie */
footer input:-moz-placeholder { color:#4d90fe; }



#footer-top h1{
	color:#fff;
	margin-top:25px;
	padding:0;
	text-align:center;
	}

footer input{ width:100%; height:30px;}

footer input.wpcf7-submit{width:100px; height:50px; background:#4f4e4f;}
	
#footer-right textarea:focus{outline: none !important;}

footer .kontakt-formular h3{color:white; margin-bottom:5px;}

footer .kontakt-formular p{margin:12px 0 17px 0;}

footer .kontakt-formular{overflow:hidden; width:100%; }

.felder-links, .felder-rechts{width:62%; float:left;}

.felder-links{ width: 31%; padding-right:7%;}

#footer-top{
	overflow:hidden;
	}

footer span.wpcf7-not-valid-tip{
	font-size:11px;
	}
.wpcf7-response-output{display:none;}
#footer-right .div.wpcf7-response-output{margin:0  !important; padding:0; position:relative; z-index:5;}

footer #footer-right .googlemap{
	width:100%;
	height:265px;
	padding-top:25px;
	}
footer #footer-right .googlemap .gm-style-iw{
	color:black;
	}
.footer-navigation-wrapper{
	width:100%;
	height:45px;
	padding-top:20px;
	clear:both;
	overflow:hidden;
	background-color:white;
	}
	
nav#footer, ul#menu-footer-menue{
	width:990px;
	height:auto;
	clear:both;
	margin:0 auto;
	color:black;
	overflow:hidden;
	padding: 0;
	display:none;
	}	
	
ul#menu-footer-menue li{
	padding:0;
	float:left;
	list-style-type:none;
	}

ul#menu-footer-menue li a:link, ul#menu-footer-menue li a:visited, ul#menu-footer-menue li a:active, ul#menu-footer-menue li a:hover{ text-decoration:none; color:#4d90fe;}

footer a:link, footer a:active, footer a:hover, footer a:visited{color:#fff; text-decoration:none;}


/* ALLGEMEIN */

a:link, a:active, a:hover, a:visited{color:#4d90fe; text-decoration:none;}


h1{
	font-size:25px; 
	font-family:Arial, Helvetica,  sans-serif; 
	padding:0; 
	margin:0;
	font-weight:bold; 
	letter-spacing:0.015em; 
	color: #3d3d3d;
	line-height:150%;
	}
	
h2{font-size:1.3em; color: #3d3d3d; font-weight:normal; 
	line-height:150%;}

h3{font-size:20px;color: #3d3d3d;}

input:focus{border:1px solid #9ea7b3;}

.start-einleitung{font-size:18px; line-height:30px;}

/*extra content*/

.headbild p, img.alignnone{padding:0; margin:0; display:inline;}

@media screen and (max-width:1118px){
#wrapper .projekt-wrapper .single-content-center{
	font-size:13px;
	}	
	
}

@media screen and (max-width:1000px){ 
#logo{	width:15.15%;}
header#head, .header-con, #content, .projekt{ width:100%;}
.single-content-center, .dreispalter, .mitglieder{width:90%; padding:5% 5% 5% 5%;}
.dreispalter_spalte{width:27%;padding:0 3% 3% 3%;}
.mitglied{width:45%; padding:2.5%;}
#footer-content{width:90%; padding:4% 5% 5% 5%;}
#mitglieder-content .mitglieder .mitglied h3{	width:70%;}
nav#footer, ul#menu-footer-menue{
	padding-left:2.5%;
	width:97.5%;
	}
	#footer-top h1{margin:0; padding:0;}
	.con{
	width:90%;
	padding:5%;
	}
	#navi{
	width:70%;
	padding-right:0px;
	}
	
#navi .menu-hauptmenue-container ul li{
	width:22%;
	}

#navi .menu-hauptmenue-container ul li a{
	width:100%;
	}
}

@media screen and (max-width:850px){ 	
#navi .menu-hauptmenue-container ul li{
	width:22%;
	font-size: 16px;
	}
#mitglieder-content .mitglieder .mitglied h3{	width:90%;}
}

@media screen and (max-width:680px){ 
#logo{	width:100%; text-align:center;clear:both; margin:0; padding:0;}
#menu-hauptmenue{width:100%; height:auto;}
header#head{height:auto;}
#navi{ width:100%; height:auto;  clear:both; padding-top:14px; padding-right:0; margin:0 auto;}
#navi .menu-hauptmenue-container ul li{
	width:100%;
	margin-right:0%;
	border:none;
	font-size: 20px;
	height:auto;
	}
#navi .menu-hauptmenue-container ul li:last-child{margin-right:0;}

/*========== UNTERMENU ==========*/
#navi .menu-hauptmenue-container ul li ul.sub-menu, #navi .menu-hauptmenue-container ul li ul.sub-menu li, #navi .menu-hauptmenue-container ul li:hover ul.sub-menu, #navi .menu-hauptmenue-container ul li ul.sub-menu li a{
	width:100%;
	position:static;
	}	
#navi .menu-hauptmenue-container ul li ul.sub-menu li a{
	border:none;  
	box-sizing: border-box; 
	-webkit-box-sizing:border-box;
  padding: 20px 15px;
  height: 55px;
  background-color: #e2e2e2;
  border-top:1px solid #FFFFFF;
  border-bottom:1px solid #ffffff;}
.menu-button{display:block;}
	.js #navi .menu-hauptmenue-container .nav-menu{display:none;}
	.js #navi .menu-hauptmenue-container .nav-menu.toggle-on{display:block;}	


.dreispalter_spalte, .mitglied, #footer-left, #footer-right{width:90%; padding:5%; clear:both;}
#mitglieder-content .mitglieder .mitglied h3{	width:60%;}
#footer-right h1{margin-left:0;}
#footer-left{padding-bottom:0;}

nav#footer, ul#menu-footer-menue{
	padding-left:2.5%;
	width:97.5%;
	}
#content .mitglieder .mitglied h3{
	width:80%;
	}
}

@media screen and (max-width:480px){ 

#mitglieder-content .mitglieder .mitglied h3{	width:70%;}
}

@media screen and (max-width:400px){ 
#content .mitglieder .mitglied h3{
	width:90%;
	}
#navi .menu-hauptmenue-container ul li a{	font-size:16px;
	}
#mitglieder-content .mitglieder .mitglied h3{	width:85%;}
}







/*=========AKTIVITÄTEN=========*/
.entry {
  overflow:hidden;
  border-bottom: 1px solid #9ea7b3;
  padding: 30px 0 15px 0px;
}
.article-snippet img {
  width: 40%;
  float: left;
  padding: 0 20px 10px 0;
  box-sizing:border-box;
  -webkit-box-sizing:border-box;
}
.article-snippet {
  width: 100%;
}
.article-snippet h2 {
  margin-top: 0px;
  color:#999999;
    font-size: 25px;
	line-height:130%;
}
.con.article-start {
  padding: 0;
  width: 100%;
}
.entrymeta {
  font-size: 12px;
}
/*page*/
a.page.larger, .wp-pagenavi a:visited, .wp-pagenavi a:active, .wp-pagenavi a:hover, .wp-pagenavi a:link {
  background-color: #4d90fe;
  border: 1px solid #4d90fe;
}

@media screen and (max-width:680px){ 
.article-snippet img {
  width: 100%;
  padding: 0 0px 20px 0px;
}
}