/*
Theme Name: Heinz Hühnerbraterei
Theme URI: http://underscores.me/
Author: Barry Norman
Author URI: http://www.barrynorman.de
Description: Description
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: heinz-huehnerbraterei
Tags:

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

Heinz Hühnerbraterei is based on Underscores http://underscores.me/, (C) 2012-2015 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.
*/

/* http://meyerweb.com/eric/tools/css/reset/
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
    display: block;
}

body {
    line-height: 1;
}

ol, ul {
    list-style: none;
}

blockquote, q {
    quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
    content: '';
    content: none;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

/**
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    contenteditable attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that are clearfixed.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */
.clearfix:before,
.clearfix:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.clearfix:after {
    clear: both;
}

/**
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */
.clearfix {
    *zoom: 1;
}

/* fonts */

@font-face {
    font-family: 'droid_serifbold';
    src: url('fonts/droidserif-bold-webfont.eot');
    src: url('fonts/droidserif-bold-webfont.eot?#iefix') format('embedded-opentype'),
    url('fonts/droidserif-bold-webfont.woff2') format('woff2'),
    url('fonts/droidserif-bold-webfont.woff') format('woff'),
    url('fonts/droidserif-bold-webfont.ttf') format('truetype'),
    url('fonts/droidserif-bold-webfont.svg#droid_serifbold') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'open_sanssemibold';
    src: url('fonts/opensans-semibold-webfont.eot');
    src: url('fonts/opensans-semibold-webfont.eot?#iefix') format('embedded-opentype'),
    url('fonts/opensans-semibold-webfont.woff2') format('woff2'),
    url('fonts/opensans-semibold-webfont.woff') format('woff'),
    url('fonts/opensans-semibold-webfont.ttf') format('truetype'),
    url('fonts/opensans-semibold-webfont.svg#open_sanssemibold') format('svg');
    font-weight: normal;
    font-style: normal;
}

/* START */

html {
    background: url(img/bg.jpg) no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

a {
    color: #1c1409;
}

a:hover {
    color: black;
}

#content {
    background: url(img/content_bg.jpg) no-repeat center center fixed;
    max-width: 960px;
    width: 90%;
    min-height: 550px;
    margin: 35px auto 0 auto;
}

#header {
    position: relative;
    margin: 0 auto;
}

.logo-wrapper {
    background: url(img/paulaner.png) no-repeat right;
    background-size: contain;
    max-height: 133px;
}

.lang-switcher {
    display: inline-block;
    position: absolute;
    top: 10px;
    right: 230px;
}

.logo-top {
    z-index: 9;
    position: relative;
    top: 0;
    left: -40px;
}

@media only screen and (max-width: 600px) {
    .logo-top {
        top: 10%;
        left: 0;
        width: 60%;
    }
}

@media only screen and (max-width: 450px) {
    .logo-top {
        top: 30%;
        left: 0;
        width: 60%;
    }
}

.header-image {
    position: relative;
    text-align: center;
    top: -25px;
    z-index: 1;
}

.header-image img {
    -webkit-box-shadow: 0px 3px 18px -4px rgba(0,0,0,0.82);
    -moz-box-shadow: 0px 3px 18px -4px rgba(0,0,0,0.82);
    box-shadow: 0px 3px 18px -4px rgba(0,0,0,0.82);
    border: 2px solid white;
    width: 95%;
    max-width: 898px;
}

/* SLICK CUSTOMIZATION */
.slick-slide img {
    display: inline-block;
}

.slick-slider {
    margin-bottom: 0;
}

.slick-list {
    padding-bottom: 20px;
}

.slick-dots {
    bottom: 30px;
}

.slick-slide {
    outline: none;
}

.slick-dots li button {
    font-size: 0;
    line-height: 0;
    display: block;
    width: 20px;
    height: 20px;
    padding: 5px;
    cursor: pointer;
    color: transparent;
    border: 0;
    outline: none;
    background: transparent;
}

.slick-dots li button:before {
    font-family: 'slick';
    font-size: 13px;
    line-height: 20px;
    position: absolute;
    top: 0;
    left: 0;
    width: 20px;
    height: 20px;
    content: '•';
    text-align: center;
    opacity: 1;
    color: white;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.slick-dots li button:hover:before, .slick-dots li button:focus:before {
    opacity: 1;
    color: black;
}

.slick-dots li.slick-active button:before {
    opacity: 1;
    color: black;
}

/* SLICK CUSTOMIZATION */

/* NAVIGATION MOBILE & DESKTOP */
#main-nav {
    font-family: 'Roboto Slab', serif;
    font-size: 12px;
    position: relative;
    color: white;
    height: 62px;
    z-index: 2;
}

.nav-l {
    z-index: 1;
    position: absolute;
    background-image: url(img/nav_l.png);
    width: 93px;
    height: 50px;
    left: -10px;
}

.nav-main {
    position: absolute;
    height: 50px;
    width: 100%;
    max-width: 1024px;
    background-image: url(img/nav_bg.png);
    text-align: center;
    line-height: 45px;
}

.nav-r {
    z-index: 1;
    position: absolute;
    background-image: url(img/nav_r.png);
    width: 93px;
    height: 50px;
    right: -11px;
}

.nav-main ul#desktop-nav {
    margin: 0;
    list-style-type: none;
    text-align: center;
    padding: 0 75px;
}

.nav-main ul#desktop-nav li {
    display: inline;
    padding-left: 5%;
}

.nav-main ul#desktop-nav li:first-child {
    display: inline;
    padding-left: 0;
}

.nav-main ul#desktop-nav li a {
    color: white;
}

.nav-main ul#desktop-nav li.current-menu-item a {
    font-weight: bold;
    color: #bc8a5c;
}

.nav-main ul#desktop-nav li.current-page-ancestor a {
    font-weight: bold;
    color: #bc8a5c;
}

.nav-main ul#desktop-nav li a:hover {
    font-weight: bold;
    color: #bc8a5c;
}

.nav-main ul#desktop-nav li a:active {
    color: white;
}

a, a:active {
    text-decoration: none;
}

/* Mobile Nav START */
@media only screen and (max-width: 768px) {
    #main-nav ul#desktop-nav {
        display: none;
    }

    .lang-switcher {
        display: none;
    }
}

@media only screen and (min-width: 769px) {
    #mobile-nav-wrapper {
        display: none;
    }
}

#mobile-nav-wrapper {
    color: white;
    cursor: pointer;
}

#mobile-nav-wrapper a {
    color: white;
    display: inline-block;
    width: 100%;
}

#mobile-nav-wrapper a:hover {
    color: #bc8a5c;
}

#nav-mobile li.current-menu-item a {
    font-weight: bold;
    color: #bc8a5c;
}

#nav-mobile li.current-page-ancestor a {
    font-weight: bold;
    color: #bc8a5c;
}

#nav-mobile {
    background-image: url(img/mobile_menu_bg.jpg);
    background-size: contain;
    height: 100%;
    display: none;
    position: relative;
    top: -3px;
}

#nav-mobile li {
    border-bottom: 1px dashed rgb(87, 45, 28);
    border-bottom: 1px dashed rgba(87, 45, 28, .5);
}

/* Content START */
section.main {
    color: #795522;
    padding: 0 30px;
}

section.main h1.headline {
    color: #a59078;
    font-family: 'Lusitana', serif;
    font-size: 21px;
    font-style: italic;
    display: table;
    white-space: nowrap;
    text-align: center;
    margin-bottom: 20px;
    padding: 0 40px 0;
    margin-top: -20px;
}

@media only screen and (max-width: 460px) {
    section.main h1.headline {
        padding: 0;
    }
}

section.main h1.headline:before, h1.headline:after {
    color: #a59078;
    content: "";
    display: table-cell;
    width: 50%;
    background: url(data:image/gif;base64,R0lGODlhAQABAPAAAKWQeP///yH5BAAAAAAALAAAAAABAAEAAAICRAEAOw==) repeat-x left center;
}

/* Headlines and Lists */
section.main h1,h2,h3,h4,h5,h6 {
    font-family: droid_serifbold, serif;
    padding: 10px 0;
}

section.main h1{
    font-size: 24px;
}

section.main h2 {
    font-size: 22px;
}

section.main h3 {
    font-size: 20px;
}

section.main h4 {
    font-size: 18px;
}

section.main h5 {
    font-size: 16px;
}

section.main h6 {
    font-size: 14px;
}

section.main ul li {
    padding: 0 0 0 10px;
}

section.main article {
    font-family: open_sanssemibold, serif;
    font-size: 13px;
    line-height: 20px;
    padding-bottom: 30px;
}

section.main article p {
    margin: 10px 0;
}

section.main article p img {
    max-width: 100%;
    margin-top: 30px;
}

section.main.two-columns article {
    float: left;
    width: 48%;
    /*min-width: 320px;*/
    padding-right: 4%;
}

section.main.two-columns section {
    float: left;
    width: 48%;
    /*min-width: 320px;*/
}

section.main.two-columns section.image-right {
    text-align: center;
}

section.main.two-columns section.image-right img {
    min-width: 200px;
    width: 100%;
}

section.image-bottom {
    margin: 10px 0;
}

section.image-bottom img {
    width: 100%;
    margin: 0 auto;
}

@media only screen and (max-width: 880px) {
    section.main.two-columns article {
        width: 100%;
    }
    section.main.two-columns section {
        width: 100%;
    }
}

/* Sub-Navigation START */
.subnav {
    font-family: 'Roboto Slab', serif;
    font-size: 13px;
    margin-bottom: 40px;
    text-align: center;
}

.subnav ul {
}

.subnav ul li:first-child {
    display: inline;
    padding-left: 0;
}

.subnav ul li {
    display: inline;
    padding-left: 25px;
}

.subnav ul li a {
    color: #a59078;
}

.subnav ul li.current_page_item a {
    color: black;
}

.subnav ul li a:hover {
    color: black;
}

/* Footer START */
footer {
    padding: 50px 0 20px 0;
    font-family: open_sanssemibold, serif;
    font-size: 10px;
    color: #795522;
}

#footer-nav {
    display: inline-block;
}

.footer-left {
    text-align: center;
}

footer ul li {
    display: inline;
}

.wiesnwirte-logo {
text-align: center;
    margin: 20px 0 0 0;
}

.wiesnwirte-logo img {
width: 125px;
}

/* FORM */
.form-left {
    float: left;
    width: 48%;
    min-width: 320px;
    padding-right: 4%;
}

.form-right {
    float: left;
    width: 48%;
    min-width: 320px;
}

input, textarea, select {
    background: rgb(215, 215, 214);
    background: rgba(215, 215, 214, .5);
    border: 1px solid #979694;
    height: 24px;
    width: 250px;
    margin-top: 5px;
    margin-bottom: 20px;
    color: #573d18;
    padding: 5px;
    font-size: 14px;
}

input[type="checkbox"] {
    width: 20px;
}

textarea {
    height: 100px;
    width: 250px;
}

input[type="submit"] {
    height: 35px;
    width: 150px;
    font-weight: bold;
}

#responsive-form{
        width:100%;
}
.form-row{
	width: 100%;
}
.column-half, .column-full {
	float: left;
	position: relative;
        padding: 0 0.65rem;
	width:100%;
	-webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box
}

.column-third {
	float: left;
	position: relative;
	width:50%;
        padding: 0 0.65rem;
	-webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box
}

.column-quarter {
	float: left;
	position: relative;
	width:50%;
        padding: 0 0.65rem;
	-webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box
}

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

/**---------------- Media query ----------------**/
@media only screen and (min-width: 48em) { 
	.column-half{
		width: 50%;
	}
	.column-third{
		width: 25%;
	}
	.column-quarter{
		width: 33%;
	}
}

@media only screen 
  and (max-device-width: 480px)
  and (-webkit-min-device-pixel-ratio: 2) {
.column-quarter{
		width: 100%;
	}
}

.wpcf7 input[type="checkbox"] {
	height: auto;
	margin: 0;
}
.wpcf7 input[type="text"], .wpcf7 input[type="email"], .wpcf7 input[type="tel"], .wpcf7 textarea {
	width: 100%;
	padding: 8px;
	border-radius: 3px;
	-webkit-box-sizing: border-box;
	 -moz-box-sizing: border-box;
	      box-sizing: border-box
}
.wpcf7 input[type="number"] {
	width: 100%;
	padding: 0 5px;
	border-radius: 3px;
	-webkit-box-sizing: border-box;
	 -moz-box-sizing: border-box;
	      box-sizing: border-box
}
.wpcf7 input[type="text"]:focus{
	background: #fff;
}
.wpcf7 textarea:focus{
	background: #fff;
}
.wpcf7 input[type="email"]:focus {
    background: #fff;
}
.wpcf7 input[type="tel"]:focus {
    background: #fff;
}
.wpcf7-submit{
	float: left;
	padding: 8px 20px;
	cursor: pointer;
	height: 35px;
    	width: 150px;
    	font-weight: bold;
}
.wpcf7-submit:hover{
}
span.wpcf7-not-valid-tip{
	text-shadow: none;
	font-size: 12px;
	padding: 5px;
}
div.wpcf7-validation-errors { 
	text-shadow: none;
	border: transparent;
	padding: 5px;
	text-align: center;
	margin: 0;
	font-size: 12px;
}
div.wpcf7-mail-sent-ok{
	text-align: center;
	text-shadow: none;
	padding: 5px;
	font-size: 12px;
	margin: 0;
}
.wpcf7-select {
	width: 100%;
}
div.wpcf7 {
	margin-top: 25px;
}
.form-section-label {
	width: 100%;
	margin-top: 10px;
	padding-left: 8px;
}
.div.wpcf7-mail-sent-ok {
    border: none;
}

div.wpcf7 img.ajax-loader {
    padding: 15px 0 0 15px;
}

img.aligncenter {
    clear: both;
    display: block;
    margin: 0 auto;
}