/*
	
Theme Name: Gesundheits Woche
Theme URI: http://webgearing.com
Description: based on the Starkers Theme.
Version: 1.0
Author: Andris Linz @ webgearing ag
Author URI: http://webgearing.com

*/

/* COLORS 
	
	grün: 		#67a34a
	hellgrau:	#f8f8f6
*/


@font-face {
font-family: 'Noteworthy Light';
font-style: normal;
font-weight: normal;
src: local('fonts/Noteworthy Light'), url('fonts/Noteworthy-Lt.woff') format('woff');
}

@font-face {font-family: "Noteworthy"; src: url("//db.onlinewebfonts.com/t/f4bc352b52c96ca087093d36bd2396bb.eot"); src: url("//db.onlinewebfonts.com/t/f4bc352b52c96ca087093d36bd2396bb.eot?#iefix") format("embedded-opentype"), url("//db.onlinewebfonts.com/t/f4bc352b52c96ca087093d36bd2396bb.woff2") format("woff2"), url("//db.onlinewebfonts.com/t/f4bc352b52c96ca087093d36bd2396bb.woff") format("woff"), url("//db.onlinewebfonts.com/t/f4bc352b52c96ca087093d36bd2396bb.ttf") format("truetype"), url("//db.onlinewebfonts.com/t/f4bc352b52c96ca087093d36bd2396bb.svg#Noteworthy") format("svg"); }


/* ------------------------- RESET ------------------------- */


body, html, h1, h2, h3, h4, h5, h6, p, ul, li, ol, img, fieldset { margin:0; padding:0; border:0; }

ul, li, ol { list-style:none; }

:focus { outline:none; }


/* ------------------------- UTILITIES ------------------------- */


.clear { clear:both; height:0;}

.floatLeft { float:left; }

.floatRight { float:right; }



/* ------------------------- MAIN-STYLES ------------------------- */

html {background:#fff;}

body {font-family: 'Roboto', Helvetica, Arial, sans-serif; letter-spacing:.08em;  color:#2A3618; background:linear-gradient(#aabc42,#c9d486,#fff);}


/* BUTTON */


.button {padding:10px 20px !important; background:#2A3618 !important; text-transform:uppercase !important; font-size:14px !important; border:#2A3618 2px solid !important; font-weight:normal !important; display:inline-block; line-height:14px !important;}

.button span, .button {color:#fff !important;}

.button:hover, .button:hover {cursor:pointer !important; background:#67a34a !important; border:#67a34a 2px solid !important; }

.button:hover span, .button:hover {color:#fff !important;}


/* BUTTON Highlight */

.button-highlight {padding:20px 40px !important; background:#67a34a !important; text-transform:uppercase !important; font-size:18px !important; border:#67a34a 2px solid !important; font-weight:normal !important; display:inline-block; line-height:14px !important;}

.button-highlight span, .button-highlight {color:#fff !important;}

.button-highlight:hover, .button-highlight:hover {cursor:pointer !important; background:#252e46 !important; border:#252e46 2px solid !important; }

.button-highlight:hover span, .button-highlight:hover {color:#fff !important;}



.button-weiss {padding:10px 20px !important; background:#fff !important; text-transform:uppercase !important; font-size:14px !important; border:#fff 2px solid !important; font-weight:normal !important;}

.button-weiss span, .button-weiss {color:#252e46 !important;}

.button-weiss:hover, .button-weiss:hover {cursor:pointer !important; background:transparent !important;  }

.button-weiss:hover span, .button-weiss:hover {color:#fff !important;}


/* ------------------------- TYPO ------------------------- */


h1	{font-size:80px; font-weight:900; line-height:80px; margin:0 0 26px 0; text-transform:uppercase; color:#ffe647; text-shadow:#67a34a 0px 0px 3px; font-family: 'Noteworthy', Helvetica, Arial, sans-serif; hyphens:auto;}
 
h2 	{font-size:35px; font-weight:700; line-height:45px; margin:0 0 26px 0; color:#ffe647; font-family: 'Noteworthy Light', Helvetica, Arial, sans-serif;}

h3 	{font-size:26px; font-weight:700; line-height:34px; margin:0 0 26px 0; font-family: 'Noteworthy Light', Helvetica, Arial, sans-serif; hyphens:auto;}

h4 	{font-size:26px; font-weight:700; line-height:32px; margin:0 0 26px 0; font-family: 'Noteworthy', Helvetica, Arial, sans-serif; color:#67a34a;}

h5 	{font-size:18px; font-weight:700; line-height:30px; margin:0 0 26px 0;}

h6 	{font-size:18px; font-weight:400; line-height:30px; margin:0 0 26px 0;}

p 	{font-size:16px; line-height:26px; font-weight:400; margin:0 0 13px 0; }

p strong {font-weight:700;}

a 	{text-decoration:none; color:#67a34a; transition: all ease 0.3s;}

a:hover {text-decoration:none; color:#7e7e7e; transition: all ease 0.3s;}

hr {border:none; border-bottom:#dd3333 1px solid; height:1px; background:transparent; margin:0 0 13px 0; width:33%; min-width:150px;}

ul {margin:0 0 0 15px;}

ul li {list-style:square; padding:0 0 0 5px; margin:0 0 5px 0;}

/* ------------------------- HEADER ------------------------- */


header {width:calc(100% - 52px); padding:0 26px; background:#fff;}

header .inner {width:1024px; margin: 0 auto;}


/* LOGO AREA */


#logo-area {float:left; width:auto;}

#logo-area img {height:65px; width:auto;  border-radius:0;}

#logo-area .widget-container {margin:0; padding:26px 0;}


/* MENU AREA */


#menu-area {height:117px; width:auto; float:right; text-align:right; padding:0;}


/* ------------------------- NAVIGATION ------------------------- */


#nav_menu-2 {height:117px; position:relative; }

#nav_menu-2 .menu {height:117px;}

#nav_menu-2 li {display:inline-block; line-height:117px; position:relative;}

#nav_menu-2 li a {color:#222; font-size:12px; transition: all ease 0.3s; padding:0 0 0 26px; font-weight:400; text-transform:uppercase; display:block;}

#nav_menu-2 li.menu-item-has-children a {padding:0 13px 0 26px; margin:0 13px 0 0;}

#nav_menu-2 li a:hover {color:#67a34a; transition: all ease 0.3s;}

#nav_menu-2 li.current-menu-item a, #nav_menu-2 li.current-menu-ancestor > a {color:#67a34a; transition: all ease 0.3s;}

#nav_menu-2 li.menu-item-has-children a:after {position:absolute; right:0; top:55px; content: "\f107"; display: inline-block; font-family: FontAwesome; font-style: normal; font-weight: 400; line-height: 1; color:rgba(0,0,0,0.2); }

#nav_menu-2 .sub-menu {display:none; transition: all ease 0.3s; background:#67a34a;}

#nav_menu-2 li.menu-item-has-children:hover .sub-menu {display:block; transition: all ease 0.3s; position:absolute; top:117px; width:auto; z-index:999; }

#nav_menu-2 li.menu-item-has-children:hover .sub-menu li {display:block; line-height:50px; width:auto; min-width:200px; text-align:left;}

#nav_menu-2 li.menu-item-has-children:hover .sub-menu li a {color:#fff;}

#nav_menu-2 li.menu-item-has-children:hover .sub-menu li.current-menu-item a {font-weight:900;}

#nav_menu-2 li.menu-item-has-children .sub-menu li a:after {content: "";}








#mobile-toggle {display:none;}

#mobile-close {float:right; line-height:104px;}

#mobile-toggle img, #mobile-close img {border-radius:0;}

#overlay-menu {position:fixed; top:0; left:0; bottom:0; right:0; background:#fff; display:none; z-index:999999; overflow:scroll; padding:0 26px;}


#overlay-menu #menu-mobile {margin:0;}

#overlay-menu #menu-mobile li {list-style:none;}

#overlay-menu #menu-mobile li a {display:block; line-height:52px; border-bottom:rgba(0,0,0,0.2) 1px solid; color:#222; width:100%; position:relative;}

#overlay-menu #menu-mobile li a:hover {color:#67a34a;}

#overlay-menu #menu-mobile li.menu-item-has-children a:after {position:absolute; right: 10px; top: 50%; margin-top: -6px; content: "\f107"; display: inline-block; font-family: FontAwesome; font-style: normal; font-weight: 900; line-height: 1; color:#67a34a); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}

#overlay-menu #menu-mobile li.menu-item-has-children .sub-menu li a:after {content:"";}

#overlay-menu #menu-mobile li.menu-item-has-children .sub-menu {display:none;}

#overlay-menu #menu-mobile li.menu-item-has-children .sub-menu.active {display:block;}


/* ------------------------- MAIN ------------------------- */


#main {width:1024px; padding:0 0 100px 0; margin:0 auto; min-height:600px;}

#main.ohneSlider {padding:60px 0;}


/* ------------------------- HOME ------------------------- */

/* TEASERPOSTS */


.teaserposts {width:100%;}

.teaserpost {width:calc(33% - 26px); margin:0 26px 26px 0; float:left;}

.teaserpost:last-child {margin:0 0 0 0;}

.teaser-bild {width:100%; margin:0 0 26px 0;}

.teaser-bild img {width:100%; height:auto; transition: all 0.5s; filter:grayscale(0); }

.teaser-bild img:hover { transition: all 0.5s; filter:grayscale(60%);}

.teaser-text {width:100%;}

.teaser-text h3 {margin-bottom:13px;}

.teaser-text p {margin-bottom:13px;}

/* ------------------------- FORMULAR ------------------------- */

input[type="text"], input[type="email"] {padding:10px; line-height:18px; border:#333 1px solid; background:#fff; color:#333; margin:0 0 10px 0; width:calc(100% - 20px);}

textarea {border:#333 1px solid; padding:10px; height:100px; font-family:Arial, Helvetica, sans-serif; font-size:12px; line-height:24px; margin:0 0 10px 0; background:#fff; color:#333; width:calc(100% - 20px);}

label {color:#333; padding:0 5px; margin:0 0 10px 0; font-weight:400; display:block;}

input[type="button"] {font-family:"AkkuratRegular", "Helvetica Neue", Helvetica, Arial, sans-serif; color:#333; background:#fff; border:#333 1px solid; padding:10px 20px; font-size:12px; line-height:18px; text-transform:uppercase; letter-spacing:.08em; transition: all ease 0.3s;}

input[type="button"]:hover {background:#333; color:#fff; border:#333 1px solid; transition: all ease 0.3s; cursor:pointer;}

.nf-before-form-content {margin:0 0 20px 0;}

select { color:#329bfd; border:none; overflow: hidden; background: url(images/arrowdown.png) no-repeat right #efefef; width:calc(100% - 15px); padding:10px;}

.nf-error-msg {color:#329bfd !important; background:#efefef; padding:10px;}

.nf-form-title h3 {font-size:42px; font-weight:900; line-height:52px; margin:0 0 30px 0; text-transform:uppercase;}

.nf-form-fields-required {font-size:16px; line-height:22px; font-weight:300; margin:0 0 13px 0; letter-spacing:.06em;}

/* ------------------------- PAGE ------------------------- */

.so-widget-sow-image h3.widget-title {padding:26px 0 0 0; margin:0; font-size:16px; text-transform:uppercase;}

h3.widget-title, .footer-img h3.widget-title {font-size:28px; font-weight:400; line-height:38px; margin:0 0 30px 0; padding:0; text-transform:none;}

.rev_slider span {letter-spacing:.05em !important;}

/* ------------------------- ACCORDION ------------------------- */

.panel {margin:0 0 5px 0;}

.panel_titel {display:block; background:#efefef; padding:10px; color:#329bfd; font-weight:700; text-transform:uppercase;}

.panel_titel:hover {cursor:pointer; color:#efefef; background:#329bfd;}

.panel_titel.current {color:#efefef; background:#329bfd;}

.panel_inhalt {padding:10px;}

.panel_inhalt img {width:calc(100% - 20px); height:auto;}


/* ------------------------- AKTUELL ------------------------- */


.aktuell-container {overflow:hidden;}

.aktuell {width:100%; border-bottom:#333 1px solid; margin:0 0 30px 0; padding:0 0 30px 0;}

.aktuell-bild {width:calc(50% - 15px); margin:0 15px 0 0; float:left;}

.aktuell-bild img {width:100%; height:auto;}

.aktuell-titel {width:calc(50% - 15px); margin:0 0 0 15px; float:left;}

h1.tp-caption {font-size:38px !important; font-weight:700 !important; line-height:44px !important; }

.aktuell-titel p > a.button {display:inline-block; margin:13px 0 0 0;}


/* ------------------------- PORTFOLIO ------------------------- */


/* LISTE */

#portfolio {width:100%; padding:0; margin:0 auto;}

.portfolio-item {width:calc(33% - 26px); margin:26px 13px 0 13px; display:inline-block; position:relative; vertical-align:middle;}

.portfolio-item .content {padding:52px 26px; color:#fff; opacity:0; transition: all ease 0.3s; background:rgba(0, 0, 0, 0.6); min-height:300px; position:relative; height:100%;}

.portfolio-item .content a {width:100%; height:100%; display:inline-block;}

.portfolio-item .content h3 {color:#fff; letter-spacing:.08em; margin:0 0 13px 0; font-size:16px; line-height:26px; font-weight:300; position:relative; left: -26px; transition: all ease 0.5s;}

.portfolio-item .content h2 {color:#fff; letter-spacing:.04em; margin:0; font-size:32px; line-height:38px; position:relative; right: -26px; transition: all ease 0.5s;}

.portfolio-item:hover .content {opacity:1; transition: all ease 0.3s;}

.portfolio-item:hover .content h3 {left:0;}

.portfolio-item:hover .content h2 {right:0;}

.sow-features-feature ul li {list-style:none;}



/* ------------------------- GALLERY ------------------------- */


.gallery .gallery-caption {display:none;}

.gallery dt {float:left; margin:0 10px 10px 0;}


/* ------------------------- FOOTER ------------------------- */



footer {background:#67a34a; padding:30px 0; color:#fff; width:100%;}

footer .inner {width:1024px; margin:0 auto;}

#first-footer-widget-area {width:100%; margin:0;}

footer a {color:#fff;}

footer a:hover {color:#333;}



@media screen and (max-width: 1200px) {
	
	#menu-area {display:none;}
	
	/*header {height:90px;}*/
	
	#logo-area img {height:52px; width:auto;}
	
	#mobile-toggle {display:block; float:right; line-height:104px;}
	
	#mobile-toggle:hover {cursor:pointer;}
}


/* ----- RESPONSIVE TABLET STYLES ----- */


@media screen and (max-width: 1023px) { 
	
	header .inner {width:calc(100% - 80px); margin:0 40px;}
	
	#main {width:calc(100% - 80px); padding:0 40px 26px; margin:0 auto; min-height:500px;}
	
	footer .inner {width:calc(100% - 80px);}

		

	.portfolio-item {width:calc(50% - 29px); margin:26px 13px 0 13px; display:inline-block; position:relative; vertical-align:middle;}


}


/* ----- RESPONSIVE MOBILE STYLES ----- */


@media screen and (max-width: 687px) { 
		
	header .inner {width:calc(100% - 52px); margin:0 auto;}
	
	/*#logo-area {width:170px;}*/
	
	#logo-area img {height:52px; width:auto;}
	
	#menu-area {width:calc(100% - 170px); margin:0 auto; padding:0;}
		
	#main {width:calc(100% - 40px); padding:0 20px 26px; margin:0 auto; min-height:500px;}
	
	h1	{font-size:42px; font-weight:700; line-height:42px; margin:0 0 26px 0; }

	h2 	{font-size:26px; font-weight:700; line-height:32px; margin:0 0 26px 0;	}
	
	h3 	{font-size:24px; font-weight:700; line-height:30px; margin:0 0 26px 0; }
	
	h4 	{font-size:20px; font-weight:700; line-height:28px; margin:0 0 26px 0; }
	
	h5 	{font-size:18px; font-weight:700; line-height:26px; margin:0 0 26px 0;}
	
	h6 	{font-size:18px; font-weight:400; line-height:26px; margin:0 0 26px 0;}
	
	p 	{font-size:16px; line-height:24px; font-weight:300; margin:0 0 13px 0; letter-spacing:.06em;}
		
	footer .inner {width:calc(100% - 40px); margin:0 auto;}
	
	.portfolio-item {width:100%; margin:26px 13px 0 13px; display:inline-block; position:relative; vertical-align:middle;}
	
	
	.aktuell-bild {width:100%; clear:both; margin:0 0 30px 0;}
	
	.aktuell-titel {width:100%; clear:both;}
	
	h1.tp-caption {font-size:18px !important; font-weight:700 !important; line-height:24px !important; }
	
	.teaserposts {width:100%;}
	
	.teaserpost {width:100%; margin:0 0 26px 0; clear:both;}
			
}