/*
Theme Name: Impreza Child
Template: Impreza
Version: 1.0
Author:	UpSolution
Theme URI: http://impreza.us-themes.com/
Author URI: http://us-themes.com/
*/
/*-------------
--0---------0--
--0---------0--
--0-------- 0--
--0---------0--
--0----0----0--
--0---0-0---0--
--0--0---0--0--
--0-0-----0-0--
--0---------0--
---------------
Webmodus GmbH
Rain 21
5000 Aarau
---------------
www.webmodus.ch
---------------
-------------*/

/** Allgemein **/
/** Bereich Header **/
/** Bereich Slider **/
/** Bereich Before Main **/
/** Bereich Main **/
/** Bereich After Main **/
/** Bereich Bottom **/
/** Bereich Footer **/
/** Kontaktformular **/

/** Accordion **/
.panel {
    background-color: transparent;
    display: none;
    overflow: hidden;
}
.panel p {
    padding:1rem 0 !important;
}
.panel .panel-bild-container {
    display:flex;
    flex-flow:row wrap;
    justify-content:space-between;
    padding-bottom:1rem !important;
}
.panel .panel-bild-container a {
    width:30%;
    padding:0.5rem 0;
}
.accordion:after {
    content: '\02795'; /* Unicode character for "plus" sign (+) */
    font-size: 13px;
    color: #777;
    float: right;
    margin-left: 5px;
}
.active-accordion:after {
    content: "\2796"; /* Unicode character for "minus" sign (-) */
}
/*LANGUAGE*/
.polylang_langswitcher{
    list-style: none;
    display: flex;
    justify-content: end;
    flex-flow: row-reverse nowrap;
    align-items: center;
    justify-content: center;
}
.polylang_langswitcher li{
    text-align: center;
    width: 40px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #93bf1b;
}
.polylang_langswitcher a{
    text-transform: uppercase;
    color: white;
    font-weight: 300;

}
.polylang_langswitcher .lang-item-first{
    margin:0px !important;
    margin-left: 10px !important;
}
.polylang_langswitcher .current-lang a {
    color:#3f3f3f !important;
}
.polylang_langswitcher a:hover {
    color:#3f3f3f !important;
}

/*LANGUAGE END*/
/*PRODUCT*/
.product-container{
    width: 100%;
    display: flex;
    flex-flow: row wrap;
}
.product-row{
    width: 100%;
    display: grid;
grid-template-columns: 30% 40% 26%;
grid-gap: 2%;
    grid-auto-rows: minmax(100px, auto);
}
.product-row h2{
    margin-top: 0 !important;
    margin-bottom: 0.75em !important;
    font-size: 2.154em !important;
    font-weight: 300 !important;
}
.product-row .product-title-beschreibung, .product-row .product-content-kategorie{
    color:#3f3f3f;
}
.product-row .product-title-beschreibung{
    margin-bottom: 1.5rem !important;
    display: block;
}

.product-col-1{
    grid-row: 1;
    width: 100%;
}
.product-col-1 img{
  height: 220px !important;
object-fit: cover;
	width:100%;
	box-shadow: inset 0 0 0 4px rgba(0,0,0,0.1)
}
.product-col-1 figure {
	position:relative;
	line-height:0px !important;
}
.product-col-1 figure::before {
	display: block;
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 2;
box-shadow: inset 0 0 0 4px rgba(0,0,0,0.1);
content: " ";
}

.product-col-2{
    grid-row: 1;
}
.product-col-3{
    grid-row: 1;
    display: flex;
    justify-content: center;
    align-items: flex-end;
    flex-flow: column;
    gap: 20px;
}
.product-divider{
    margin-top: 1rem;
    margin-bottom: 2rem;
}
.product-button{
    background: linear-gradient(to bottom, #accf37 0%,#80b014 100%);
    color: #ffffff;
    transition: 300ms all;
    padding: 10px 20px;
	text-shadow: 0 -1px 0 #81a022;
	text-transform:uppercase;
	font-size:12px;
}
.product-button:hover{
    background: #747474;
    color: #ffffff !important;
	text-shadow: none;
}
@media screen and (max-width: 810px) {
	.product-col-1 img{
		height:185px !important;
	}
				.product-col-2 h2{
		font-size:24px !important;
	}
		.product-col-2 p{
		font-size:14px !important;
	}
			.product-col-2 span{
		font-size:15px !important;
	}
	.product-button{
   		min-width: 175px !important;
		font-size: 13px !important;
}
}
@media screen and (max-width: 600px) {
	.product-col-1 img{
  height: auto !important;
}
    .product-row{
        width: 100%;
        display: flex;
        flex-flow:column nowrap;
    }
    .product-col-3{
        align-items: flex-start;
    }
	.product-col-2{
		margin: 20px 0;
	}

}
/*PRODUCT END*/
/*Sitelist*/
.webmodus-title{
    margin-bottom: 1em;
    border-bottom: 1px solid #dfdfdf;
    color: #3f3f3f;
    font-size: 1.5em;
    font-weight: 300;
}
.webmodus-title > h6 {
    border-bottom: 2px solid #93bf1b;
    width: fit-content;
}
.webmodus-link-container{
    margin: -10px 0px 20px 0px;
}
.webmodus-link{
    color: #3f3f3f !important;
    font-size: 14px;
	display:flex;
	flex-flow:row nowrap;
	gap:4px;
}
.webmodus-link:hover{
    color: #93bf1b !important;
}
.webmodus-link > img{
    width: 18px;
	height: 18px;
    margin-top: 1px;
}
/*Sitelist END*/
/******************************************************/
/** MEDIA QUERIES START **/
/******************************************************/
/** Laptop**/
@media screen and (max-width: 1200px) {
    /** Allgemein **/
    /** Bereich Header **/
    /** Bereich Slider **/
    /** Bereich Before Main **/
    /** Bereich Main **/
    /** Bereich After Main **/
    /** Bereich Bottom **/
    /** Bereich Footer **/
}

/** Landscape Tablet**/
@media screen and (max-width: 991px) {
    /** Allgemein **/
    /** Bereich Header **/
    /** Bereich Slider **/
    /** Bereich Before Main **/
    /** Bereich Main **/
    /** Bereich After Main **/
    /** Bereich Bottom **/
    /** Bereich Footer **/
}

/** Tablet**/
@media screen and (max-width: 900px) {
    /** Allgemein **/
    /** Bereich Header **/
    /** Bereich Slider **/
    /** Bereich Before Main **/
    /** Bereich Main **/
    /** Bereich After Main **/
    /** Bereich Bottom **/
    /** Bereich Footer **/
    /** Accordion **/
    .panel .panel-bild-container a {
        width:48%;
    }
}

/** Mini Tablet**/
@media screen and (max-width: 768px) {
    /** Allgemein **/
    /** Bereich Header **/
    /** Bereich Slider **/
    /** Bereich Before Main **/
    /** Bereich Main **/
    /** Bereich After Main **/
    /** Bereich Bottom **/
    /** Bereich Footer **/
}

/** Mobile Landscape **/
@media screen and (max-width: 660px) {
    /** Allgemein **/
    /** Bereich Header **/
    /** Bereich Slider **/
    /** Bereich Before Main **/
    /** Bereich Main **/
    /** Bereich After Main **/
    /** Bereich Bottom **/
    /** Bereich Footer **/
}

/** Mobile Smartphone Gross **/
@media screen and (max-width: 480px) {
    /** Allgemein **/
    /** Bereich Header **/
    /** Bereich Slider **/
    /** Bereich Before Main **/
    /** Bereich Main **/
    /** Bereich After Main **/
    /** Bereich Bottom **/
    /** Bereich Footer **/
}

/** Mobile Smartphone Mini **/
@media screen and (max-width: 320px) {
    /** Allgemein **/
    /** Bereich Header **/
    /** Bereich Slider **/
    /** Bereich Before Main **/
    /** Bereich Main **/
    /** Bereich After Main **/
    /** Bereich Bottom **/
    /** Bereich Footer **/
}


/******************************************************/
/** MEDIA QUERIES ENDE **/
/******************************************************/