@charset "utf-8";
/* ------------------------------------------------------------
cagliari-resp.css | 14.07.2024 : 15.07.2024
Author: Sebastian Saternus | e-mail: s.saternus@gmail.com
------------------------------------------------------------ */

@media (min-height:3000px) and (max-height:100vh) {
/* -- HEADER -- */
.header {background:url('../img/header.jpg') center center no-repeat; background-size:100% 100%;}
}

@media (min-width:1920px) and (max-width:100vw) {
.text {font-size:1.8vw; line-height:2.2vw;}
}

@media screen and (max-width:1099px) {
/* -- LOGO -- */
#logo {
	width:120px; height:80px; left:20px;
	border-radius:0 0 10px 10px;
	background:rgba(255,255,255,1) url('../img/logo-cagliari.jpg') center center no-repeat; background-size:auto 100%;
	z-index:98;
	}

/* -- MENU-BTN -- */
#menu-btn {
	display:block; position:fixed; width:50px; height:50px; top:20px; right:20px;
	border:3px solid rgba(40,20,0,1); border-radius:10px; box-sizing:border-box;
	background:rgba(208,186,156,1) url('../img/menu-btn.svg') center center no-repeat; background-size:50% auto;
	z-index:99;
	}
/* -- MENU -- */
#menu {display:none; width:300px; height:auto; top:100px; right:20px; background:none;}
#menu ul {
	display:block; height:auto; line-height:inherit; margin:0; padding:20px;
	border:3px solid rgba(40,20,0,1); border-radius:30px; box-sizing:border-box;
	background:rgba(208,186,156,0.6); backdrop-filter: blur(15px);
	text-align:center;
	}
#menu ul li {display:block; margin:0 0 20px;}
#menu ul li a {display:block; border-radius:10px; font-size:1.6rem;}
#menu ul li a:hover {border-radius:10px;}
.menu-last-item {margin-bottom:0px!important;}
}

@media screen and (max-width:999px) {
/* -- CONTENT -- */
.content {grid-template-columns:auto; grid-template-rows:auto 300px; height:auto;}
/* -- CONTENT-1 -- */
.content-1 .text-panel {grid-column:1; grid-row:1; margin:0;}
.content-1 .foto-panel {grid-column:1; grid-row:2; margin:0;}
/* -- CONTENT-2 -- */
.content-2 .text-panel {grid-column:1; grid-row:1; margin:0;}
.content-2 .foto-panel {grid-column:1; grid-row:2; margin:0;}
/* -- CONTENT-3 -- */
.content-3 {background:rgba(40,20,10,1);}
.content-3 .text-panel {grid-column:1; grid-row:1/3;}
.content-3 .foto-panel {display:none;}

/* -- text -- */
.text {padding:50px; font-size:1.6rem;}
.text h2 {padding:0 0 30px; font-size:2rem; line-height:30pt; color:rgba(197,77,81,1);}
.text h2 span {font-size:20pt;}

/* -- BTN -- */
.btn {
	width:auto; height:60px; line-height:60px; margin:0 50px 50px 50px;
	font-size:1.5rem;
	border-radius:5vh;
	}
/* -- LOGO: EV -- */
#logo-ev {
	width:auto; height:70px; margin:0 0 20px;
	background:url('../img/logo-espressovet.svg') left center no-repeat; background-size:auto 100%;
	}

/* -- kontakt-grid -- */
.text .contact {font-size:1rem;}
.text .contact strong {font-size:1.8rem;}
}


@media (min-width:800px) and (max-width:999px) {
/* -- HEADER -- */
.header {background:url('../img/header.jpg') center center no-repeat; background-size:100% auto;}
.header-kawa {background:url('../img/header-kawa.jpg') center top no-repeat; background-size:auto 100%;}
.header-czekolada {background:url('../img/header-czekolada.jpg') center center no-repeat; background-size:auto 100%;}
.header-herbata {background:url('../img/header-herbata.jpg') center center no-repeat; background-size:auto 100%;}
.header-kontakt {background:url('../img/header-kontakt.jpg') center center no-repeat; background-size:auto 100%;}

/* -- HEADER-SLOGAN -- */
#header-slogan {left:20px; width:auto; height:120px;}
#header-slogan h1 {font-size:3.2rem; line-height:2.2rem;}
#header-slogan h1 span {font-size:1.7rem;}
}

@media screen and (max-width:799px) {
/* -- HEADER -- */
#header {height:600px;}
.header {background:url('../img/header.jpg') center center no-repeat; background-size:auto 100%;}
.header-kawa {background:url('../img/header-kawa.jpg') center top no-repeat; background-size:auto 100%;}
.header-czekolada {background:url('../img/header-czekolada.jpg') center center no-repeat; background-size:auto 100%;}
.header-herbata {background:url('../img/header-herbata.jpg') center center no-repeat; background-size:auto 100%;}
.header-kontakt {background:url('../img/header-kontakt.jpg') center center no-repeat; background-size:auto 100%;}

/* -- HEADER-SLOGAN -- */
#header-slogan {left:20px; width:auto; height:100px;}
#header-slogan h1 {font-size:3rem; line-height:2rem;}
#header-slogan h1 span {font-size:1.5rem;}
}

@media screen and (max-width:499px) {
/* -- HEADER-SLOGAN -- */
#header-slogan {left:20px; width:auto; height:90px;}
#header-slogan h1 {font-size:2rem; line-height:1.4rem;}
#header-slogan h1 span {font-size:1.2rem;}

/* -- kontakt-grid -- */
.text .contact {font-size:0.8rem;}
.text .contact strong {font-size:1.4rem;}
}


@media screen and (max-width:399px) {
/* -- MENU -- */
#menu {width:260px;}

/* -- HEADER-SLOGAN -- */
#header-slogan {left:20px; width:auto; height:120px;}
#header-slogan h1 {font-size:1.7rem; line-height:1.4rem;}
#header-slogan h1 span {font-size:1rem;}

.text {padding:30px; font-size:1.2rem;}

/* -- kontakt-grid -- */
.text .contact {font-size:10px;}
.text .contact strong {font-size:14px;}

/* -- LOGO: EV -- */
#logo-ev {
	width:auto; height:50px; margin:0 0 20px;
	background:url('../img/logo-espressovet.svg') left center no-repeat; background-size:auto 100%;
	}

/* -- BTN -- */
.btn {font-size:16px; margin:0 30px 30px 30px;}

}

/* --- cagliari-resp.css [ 14.07.2024 ] --- */