/*********
Foppa Gastro OVERLAY
*********/
@font-face {
    font-family: 'Catamaran';
    src: url('/themes/foppagastro.ch/fonts/Catamaran-Medium.woff2') format('woff2'),
        url('/themes/foppagastro.ch/fonts/Catamaran-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
}

.foppa-overlay {
	position: absolute;
    top: 0px;
	width: 100%;
	z-index: 1000;
}

.foppa-overlay-content {
	/*background: white;*/
	z-index: 100;
	padding-top: 60px; /*vorher 40px*/
	padding-bottom: 60px;
	text-align: left;
	display: none;
}

.foppa-overlay-content .content-block-center {
	display: flex;
}

.foppa-overlay p,
.foppa-overlay span,
.foppa-overlay a {
	color: #fff;
	font-size: 1rem;
	font-family: 'Catamaran', Arial, Helvetica, sans-serif !important;
	font-weight: 500;
	line-height: 1rem;
}

.foppa-overlay span {
	display: inline-block;
}

/*.foppa-overlay p,
.foppa-overlay a span,
.foppa-overlay a,
.close-overlay-lasche a span {
	color: #fff;
}*/

.foppa-overlay-content .foppa-logo {
	text-align: center;
}



/*.overlay-black .foppa-overlay-content p {
	color: #fff;
}
*/

.foppa-overlay-content h2 {
	font-size: 2rem;
}

.foppa-overlay-content h3 {
	font-size: 1.5rem;
	margin-top: 0;
}

.foppa-overlay-content h2,
.foppa-overlay-content h3 {
	text-transform: uppercase;
	color: #a0914b;
	border-bottom: 7px solid #a0914b;
    padding-bottom: 20px;
	display: block;
}

.foppa-overlay-content .overlay-logo {
	height: 70px;
	padding-bottom: 40px;
}

.foppa-overlay-content .btn {
	border: 0;
	padding: 0;
}

.foppa-overlay-content .btn a,
.foppa-overlay-content .btn a:link {
	background: #a0914b;
	font-size: 1.25rem;
	border: 0px;
}

/*.foppa-overlay-content .btn a:hover, 
.foppa-overlay-content .btn a:active,
.foppa-overlay-content .btn a:focus {	
	background: #000;
}*/

.foppa-overlay-content .btn a:hover, 
.foppa-overlay-content .btn a:active,
.foppa-overlay-content .btn a:focus {
	background: #fff;
	color: #a0914b;
}

.foppa-overlay-content {
	z-index: 900;
	position: fixed;
	width: 100%;
}

.foppa-overlay-lasche {
	/*background: #fff;*/
	color: #000;
	border-bottom-left-radius: 25px;
	border-bottom-right-radius: 25px;
	
	position: absolute; /*vorher absolute*/
	top: 0px;
    right: 125px;
	display: inline-block;
	
	padding: 20px;
	/*box-shadow: -3px 0px 0px 0px black;*/ 
	
	
}

.foppa-overlay-lasche a {
	display: block;
}

.foppa-overlay .close-overlay-lasche:hover a span,
.foppa-overlay .close-overlay-lasche a:hover span
.foppa-overlay .close-overlay-lasche:hover a:hover span {
	color: #a0914b;
}

.foppa-overlay-lasche img {
	height: 50px;
}

/*LIST*/
.foppa-overlay-content ul.list.fuenf-spalten.logos {
	display: flex;
   /* flex-wrap: wrap;*/
    align-items: center;
	margin-bottom: 30px;
	justify-content: space-between;
}

.foppa-overlay-content ul.list.fuenf-spalten.logos li {
	/*width: 14%;*/
    margin-right: 0; /*vorher 7.5%*/
	margin-bottom: 30px;
	width: auto;
}

.foppa-overlay-content ul.list.fuenf-spalten.logos li:nth-child(5n) {
	margin-right: 0px;
}

.foppa-overlay-content ul.list.fuenf-spalten.logos svg {
	height: 35px;
	min-height: 25px;
    max-height: 50px;
   
	width: auto;
	max-width: 100%;
}


/*.foppa-overlay .list.drei-spalten li {
    width: 25%;
    margin-right: 12.5%;
    margin-bottom: 12.5%;
    float: left;
}

.foppa-overlay .list.drei-spalten li:nth-child(3n) {
	margin-right: 0;
} */

/*.foppa-overlay .list.drei-spalten li:nth-last-child(-n+3){
	margin-bottom: 0% !important;
}*/

.foppa-overlay .grid-1.last-grid {
	margin-right: 0;
}

.foppa-overlay .grid-1:nth-child(2n) {
	margin-right: 5%;
}

.foppa-overlay-content .grid-2 {
	width: 100%;
	margin-right: 0px;
	margin-bottom: 0px;
}

.foppa-overlay-content .grid-2.small-grid {
	width: 80%;
    margin-left: auto;
    margin-right: auto;
}

svg.foppa-layer-logo {
/*	height: 70px;*/
	width: 80px; /*vorher 90px*/
}

.grid-2 svg.foppa-logo.foppa-layer-logo {
	/*height: 70px;*/
	width: 150px;
	padding-bottom: 60px; /*vorher 40px*/
}

.foppa-logo .bildelement polygon {
	fill: #a0914b;
}

/*.overlay-white .foppa-overlay .foppa-overlay-content,
.overlay-white .foppa-overlay .foppa-overlay-lasche {
	background: white !important;
}*/

/*.overlay-black .foppa-overlay .foppa-overlay-content,
.overlay-black .foppa-overlay .foppa-overlay-lasche {
	background: black !important; 
}*/


.overlay-lasche-white .foppa-overlay .foppa-overlay-lasche {
	background: white !important;
	/*box-shadow: 0px 0px 4px 1px black; */
}

.overlay-lasche-black .foppa-overlay .foppa-overlay-lasche {
	background: black !important; 
}

.foppa-overlay .foppa-overlay-content {
	background: black !important;
	border-bottom: 1px solid white;
}

/*.overlay-black .foppa-overlay .foppa-overlay-lasche {
	box-shadow: -3px 0px 0px 0px white; 
}*/

/*.overlay-white .foppa-logo .textelement path,
.overlay-white .foppa-logo .claim path,
.overlay-white .basilik-logo .textelement path,
.overlay-white .suesswinkel-logo path,
.overlay-white .nayan-logo polygon,
.overlay-white .nayan-logo path,
.overlay-white .nannini-logo path,
.overlay-white .danoi-logo path,
.overlay-white .danoi-logo polygon,
.overlay-white .danoi-logo rect {
	fill: black;
}*/

.basilik-logo .textelement path,
.suesswinkel-logo path,
.nayan-logo polygon,
.nayan-logo path,
.nannini-logo path,
.danoi-logo path,
.danoi-logo polygon,
danoi-logo rect {
	fill: white; /*vorher white*/
}
.foppa-overlay-content .foppa-logo .textelement path,
.foppa-overlay-content .foppa-logo .claim path {
	fill: white;
}
.foppa-layer-logo .textelement path,
.foppa-layer-logo .claim path {
	fill: black;
}


.overlay-lasche-black .foppa-layer-logo .textelement path,
.overlay-lasche-black .foppa-layer-logo .claim path {
	fill: white;
}


.close-overlay-lasche {
	background: #a0914b;
	border-top-left-radius: 25px;
	border-top-right-radius: 25px;
	
	position: absolute;
	right: 125px;
	display: grid; /*vorher inline-block*/
	bottom: 0px;
	padding: 20px 25px; /*vorher  25px 30px;*/
	z-index: 1000;
	text-align: center;
	
	cursor: pointer;
}

.close-overlay-lasche:hover {
	background: #000;
}

.close-overlay-lasche a {
	text-decoration: none;
}

.close-overlay-lasche:hover a,
.close-overlay-lasche:hover a:hover {
	color: #fff;
}

svg.icon-close {
	width: 30px; /*vorher 35px*/
	text-align: center;
	display: block;
	padding-bottom: 10px; /*vorher 15px*/
	margin-left: auto;
	margin-right: auto;
}

svg.icon-close rect,
svg.icon-close rect {
	fill: #fff !important;
}

.close-overlay-lasche:hover a svg.icon-close rect,
.close-overlay-lasche:hover a:hover svg.icon-close rect {
	fill:  #fff !important;
}

.close-overlay-lasche:hover {
	background: #fff;
}
.close-overlay-lasche:hover a,
.close-overlay-lasche:hover a:hover {
	background: #fff;
	color: #a0914b;
}

.close-overlay-lasche:hover a svg.icon-close rect,
.close-overlay-lasche:hover a:hover svg.icon-close rect  {
	fill: #a0914b !important;
}

.foppa-overlay.open-layer .foppa-overlay-lasche {
	display: none !important;
}

.foppa-overlay-content .content-block-center {
   width: 100%;
    max-width: 1600px;
    margin-left: auto;
    margin-right: auto;
}

body.noscroll .overlay-lasche-white .foppa-overlay .foppa-overlay-lasche {
	display: none;
}




/*RESPONSIVE*/
@media only screen and (min-width: 600px) and (max-width: 1690px) {
.foppa-overlay-content .content-block-center {
    margin-left: 45px;
    margin-right: 45px;
    width: auto;
}
}

/* Responsive */
/*@media 
only screen and (min-width : 1024px) and (max-width : 1500px) {
	.foppa-overlay .grid-2.small-grid {
		width: 100% !important;
		margin-right: 0;
	
}}*/

@media 
only screen and (min-width : 600px) and (max-width : 1240px) {
	.foppa-overlay .grid-2.small-grid {
		width: 80%;
		margin-left: auto;
    	margin-right: auto;
		margin-bottom: 0px;
	}
	.foppa-overlay .grid-2 {
		margin-bottom: 0px;
	}
	.close-overlay-lasche {
		padding: 18px 20px; /*vorher 20px 22.5px*/
		
	}
	svg.foppa-layer-logo {
		width: 70px; /*vorher 75px*/
	}
	svg.icon-close {
   		 width: 25px;
		padding-bottom: 10px;
	}
}

/*@media 
only screen and (min-width : 600px) and (max-width : 1023.9px) {
	.foppa-overlay .grid-2.small-grid {
		width: 100%;
		margin-right: 0;
	}
}*/

@media only screen and (min-width: 600px) and (max-width: 879.9px) {
	.foppa-overlay-lasche,
	.close-overlay-lasche {
		right: 50px;
	}
	
	
	
	.foppa-overlay ul.list.fuenf-spalten.logos {
		justify-content: center !important;
		flex-wrap: wrap;
		
		margin-bottom: 50px; /*vorher 60px*/
	}
	.foppa-overlay ul.list.fuenf-spalten.logos li {
	
		width: 28.333%;
		margin-right: 7.5%;	
		text-align: center;
	}
	
	.foppa-overlay ul.list.fuenf-spalten.logos li:nth-child(3n) {
		margin-right: 0px;
	}
	
}



@media 
only screen and (min-width : 0px) and (max-width : 599.9px) {
	.foppa-overlay {
		display: none;
	}
	/*.foppa-overlay-lasche,
	.close-overlay-lasche {
		right: 20px;
	}
	
	.foppa-overlay .grid-2.small-grid {
		width: 100%;
		margin-right: 0;
	}
	.foppa-overlay .grid-1,
	.foppa-overlay .grid-1:nth-child(2n) {
		width: 100%;
		margin-right:0px;
	}
	.foppa-overlay .grid-1.last-grid {
		margin-top: 30px;
	}*/
}

@media only screen and (min-device-width : 0px) and (max-device-width : 815px) and (orientation : landscape) {
	.foppa-overlay {
		display: none;
	}
}

/*NAYAN*/
@media only screen and (min-width: 600px) and (max-width: 879.9px) {
.overlay-lasche-white.nayan-lasche .foppa-overlay-lasche,
.overlay-lasche-white.nayan-lasche .close-overlay-lasche {
	right: 90px !important;
}
}

@media only screen and (min-width: 880px) and (max-width: 1690px) {
.overlay-lasche-white.nayan-lasche .foppa-overlay-lasche,
.overlay-lasche-white.nayan-lasche .close-overlay-lasche{
	right: 90px !important;
}
}
