/*!
Theme Name: Mash
Theme URI: http://underscores.me/
Author: Manuel Michaelis
Author URI: http://www.innsites.de
Description: Description
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: mash
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

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

Mash is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
rgba(255, 0, 0, 0.2) red 
rgba(0, 255, 0, 0.2) green 
rgba(0, 0, 255, 0.2) blue 
rgba(255, 255, 0, 0.2) yellow 
rgba(0, 0, 0, 0.2) grey 
--------------------------------------------------------------*/

@import url(//lohnunternehmen-horn.de/wp-content/themes/mash/css/wp.css);
@import url('//lohnunternehmen-horn.de/wp-content/uploads/omgf/local-stylesheet-import-62/local-stylesheet-import-62.css');
@import url('//lohnunternehmen-horn.de/wp-content/uploads/omgf/local-stylesheet-import-81/local-stylesheet-import-81.css');
@import url('https://maxcdn.bootstrapcdn.com/font-awesome/latest/css/font-awesome.min.css');
/* ================================================
    STRUKTUR
================================================ */
#page{ width: 80%;
    margin: 0 auto;
}
#masthead{
    height: 9vw;
    background-image: url(//lohnunternehmen-horn.de/wp-content/themes/mash/images/bg-header-1.jpg);
    background-size:contain;
    background-repeat: no-repeat;
    background-position: center;
background-color: #61992e; /* Old browsers */
background-color: -moz-linear-gradient(left,  #61992e 0%, #ffffff 100%); /* FF3.6-15 */
background-color: -webkit-linear-gradient(left,  #61992e 0%,#ffffff 100%); /* Chrome10-25,Safari5.1-6 */
background-color: linear-gradient(to right,  #61992e 0%,#ffffff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */

}
.site-branding{
    display: flex;
    width: 100%;
    flex-wrap: wrap;
    flex-direction: row;
}
.custom-logo-link{
    max-height: 9vw;
    order: 3;
    margin-top: -4vw;
}
.custom-logo {
    max-width: 8vw;
    height: auto !important;
}
.site-title{
    display: inline-flex;
    width: 100%;
    max-height: 75px;
    margin: 2vw 0 0 0;
}
.site-title a,
.site-title a:hover,
.site-title a:visited{
    font-family: 'Sriracha', cursive;
    font-weight: 400;
    font-size: 1.6vw;
    color: black !important;
    text-decoration: none;
    text-shadow: -1px -1px 0px #ffffff;
    margin: 0 auto;
}
.site-description{
    width: 70vw;
    max-height: 75px;
    font-family: 'Roboto';
    font-weight: 400;
    font-size: 1vw;
    text-align: center;
}
#site-navigation{
    background: #f9f8dc;
    border-top: 1px solid grey;
    border-bottom: 1px solid grey;
    padding 1vw 0;
}
#site-navigation ul li a {
	color: #00b100 !important;
    font-size: 1.2vw;
}

#site-navigation ul li a:visited {
	color: #00b100 !important;
}

#site-navigation ul li a:hover,
#site-navigation ul li a:focus,
#site-navigation ul li a:active {
	color: #212121 !important;
}
#site-navigation ul{
    display: flex;
    justify-content: space-around;
    width: 100%;
}
#primary {
    display: flex;
    flex-direction: column;
    min-height: 63vh;
}
#main {
    flex-grow: 1;
    margin-top: 3vw;
    padding: 0 3vw;
}
/* ================================================
    HOME
================================================ */
.home .site-main{
    display: flex;
    justify-content: space-between;
    margin-top: 5vw;
}
.home .entry-title{
    display: none;
}
.home .entry-content{
    display: flex;
    flex-wrap: wrap;
    width: 80vw;
    justify-content: space-around;
}
.home .wp-caption{
    width: 20%;
    font-size: 1vw;
}
.home .wp-caption:hover{
    background: rgba(97,153,46,0.5);
}
.claim{
    width: 100%;
    text-align: center;
}
.entry-title{
    font-size: 120%;
}
/* ================================================
    MASCHINENPARK
================================================ */
.galleries{
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    justify-content: space-between;
	background: white;
}
.gallerie{
    width: 18%;
	background: white;
}
.ngg-gallery-slideshow-image{
    max-width: 100% !important;
    height: auto !important;
}
.gallerie{
    font-size: 1.1vw;
}
/* ================================================
    LEISTUNG
================================================ */
#post-9 {
    padding-left: 5vw;
}
/* ================================================
    IMPRESSUM
================================================ */
.zusatz{font-size: 80%; color: grey; padding-left: 1rem;}
.source{font-size: 79%; color: grey; text-align: center;padding: 3rem 0;}
/* ===========================================================
				FUSSZEILE
   =========================================================== */
#colophon{position: sticky;  bottom: 0; width: 100%;  background: #f9f8dc; padding: 0.5rem 5%;
}
#colophon a{text-decoration: none;}
.site-info{width: 100%; color: #00b100;
border-top: 1px solid grey; border-bottom: 1px solid grey; margin: 1rem 0; padding-bottom: 0.5rem;}
.site-info a, .site-info a:visited{color: #00b100 !important;}
.site-info a:hover{color: black !important;}
/* ===========================================================
				ACCORDION
   =========================================================== */
.accordion {
    width:100%;
}
.accordion ul {
    list-style:none;
    margin:0;
    padding:0;    
}
.accordion li {
    margin:0;
    padding:0;
}
.accordion [type=radio], .accordion [type=checkbox] {
    display:none;
}
.accordion label {
    display:block;
    font-size:100%;
	font-weight: bold;
    background:rgba(249,248,220,0.8);/*grey*/

    cursor:pointer;
    text-transform:uppercase;
}
.accordion ul li label:hover, .accordion [type=radio]:checked ~ label, .accordion [type=checkbox]:checked ~ label {
    background:rgba(249,248,220,0.8);/*grey*/

}
.accordion .content {
	margin-top: 1rem;
    -webkit-transition: all .5s ease-out;
    -moz-transition: all .5s ease-out;
}
.accordion p {

    margin:0 0 10px;
}
.accordion label{color: #00b100}

.vertical ul li {
    overflow:hidden;
    margin:0 0 1px;
}
.vertical ul li label {
    padding:10px;
}
.vertical [type=radio]:checked ~ label, .vertical [type=checkbox]:checked ~ label {
    border-bottom:0;
}
.vertical ul li label:hover {}
.vertical ul li .content {
    height:0px;
    border-top:0;
    transition: all .5s ease-out;
}
.vertical [type=checkbox]:checked ~ label ~ .content {
    height:auto;
    
}
.fl{position: relative; float: left;}
.impr-line{width: 100%; margin-bottom: 0.5rem;}
.aussage{width: 20%;clear: both;}
.wert{display: block; width: 80%;}
.wert p{margin-bottom: 0; margin-top: 0;}
.block{width: 100%; margin-bottom: 20px;}
.site-info a:hover{color: #ff6622;}
.line{display: flex; justify-content:space-around; flex-wrap: wrap; width: 100%;}
.f-box{min-width: 10%; text-align: center; white-space: normal; margin: 1rem 1rem 0 0;}
.fa{font-size: 150%; margin-right: 2rem;}
#flexcol{display: flex; justify-content:space-between; flex-wrap: wrap; width: 100%;}
.footerbox{flex-basis:50%;color: silver; font-size: 90%;}
.footerbox h2{color:#219296; margin-bottom: 1rem;}

.wpcf7-submit{
    font-size: 1vw !important;
}
/* **************************************************
	MOBILE Navigation
************************************************** */
body { 
  -webkit-animation: bugfix infinite 1s; 
}
@-webkit-keyframes bugfix { 
  from { padding: 0; } 
  to { padding: 0; } 
}

/* weiter */
#mobilemenue{
    position:relative;

    width: 100%;
	height: auto;
	margin: 0 auto;
	right:0;
	display: none;
    z-index: 12000;
}
#mobilemenue li{
	/*margin-bottom: 1rem;*/
	background:rgba(128,128,128,0.1);/*gray*/
}
#mobilemenue a{
	display: block;
	font-size: 90%;
    color: black;
	padding: 0.25rem;
}
#button {
	display: none;
}
label { 
  cursor: pointer;
  user-select: none;
}
#mobilemenue label {
      position: relative;
      width: 100%;
	  height: 3rem;
	  margin-bottom: 1rem;
	  background-color: transparent;
    width:100% !important;
    text-align: right;
	
}
#mobilemenue label:after {
        position: relative;
        content: "NAVIGATION \2261";
		font-size: 100%;
		font-weight: 400;
		color: #ec644a;
		line-height: 180%;
		right: 2rem;
    }
.oben{
    position: absolute;
    right: -500px;
    top:2rem;
	margin-top: 1rem;
	border: 1px solid silver;
    transition: all .5s ease-in-out;
    -webkit-transition: all .5s ease-in-out;
    background: #f4f2f2;
}
input:checked ~ .oben {
    right: 5%;
}
.oben ul{
    display: flex;
    flex-direction: column;
    list-style:none;
    padding: 0;
    margin:0;
}
.oben ul ul{
    margin-left:0.5rem
}
.oben ul li {background: f4f2f2;}
.oben .parent {}
.oben .sub-menu {
    visibility: hidden;
    height: 0rem;
    transition: all .125s ease-in;
    -webkit-transition: all .125s ease-in;
}
.oben ul li:hover .sub-menu {
    visibility: visible;
    height:auto;
    background:rgba(128,128,128,0.1);/*gray*/
}
@media screen and (max-width: 1024px) {
    #page{ width: 100%;}
    #masthead{
    height: 11vw;
    background-size:cover;
}
    .site-branding{height: 11vw;}
    .home .entry-content{width: 100%;}
    .claim{width: 100%;}
}
@media screen and (max-width: 768px) {
    .home .wp-caption{
        width: 50% !important;
        font-size: 100%;
    }
    .wp-caption img[class*="wp-image-"] {
        width:90%;
    }

}
@media screen and (max-width: 760px) {
    #site-navigation{display:none;}
    #mobilemenue{ display: flex;}
    .galleries{
    display: flex;
    flex-wrap: no-wrap;
    width: 100%;
    justify-content: center;
	background: white;
}
.gallerie{
    width: 90%;
	font-size: 100%;
    padding-bottom: 3rem;
    margin-bottom: 3rem;
    border-bottom: 1px solid grey;
}
    .wpcf7-submit{
    font-size: 100% !important;
}
    
}

@media screen and (max-width: 620px) {
    .site-info{font-size:1.2vw;}
}