/*
Theme Name: Nextframe
Theme URI: https://vittoriaservizi.info
Author: Mario Rossi
Author URI: https://miosito.com
Description: Our fantastic base theme
Version: 1.0
Requires at least: 5.0
Tested up to: 5.4
Requires PHP: 7.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: nextframe
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.
*/


/* ! Reset */
/*------------------------------------------------------------------*/

body,
html {
	font-size: 16px;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Helvetica Neue", Arial, sans-serif;
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}

*,
*:before,
*:after {
	box-sizing: border-box;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
ol,
ul {
	margin: 0;
	padding: 0;
}

ol,
ul {
	list-style-type: none;
}

img {
	height: auto;
}

a {
	text-decoration: none;
}

hr {
	border: none;
	border-bottom: 1px solid #ddd;
}


/* Colore dei link */

a {
	text-decoration: none;
	color: #f75e47;
}

p {
	line-height: 1.3;
}


/* Utilizzato per spaziare le cose */

.spacer {
	height: 70px;
}


/* ! Title System */
/*------------------------------------------------------------------*/

.text-0 {
	font-size: 5rem !important;
	line-height: 1;
}

h1,
.text-1 {
	font-size: 3.4rem;
}

h2,
.text-2 {
	font-size: 2.2rem;
}

h3,
.text-3 {
	font-size: 1.5rem;
}

h4,
p,
.text-4 {
	font-size: 1rem;
}

h1,
h2,
h3,
h4,
p,
ol,
ul {
	margin-bottom: 1rem;
}

@media (max-width: 768px) {

	.text-0 {
		font-size: 4rem;
	}

}


/*
.button--small{padding: 10px 20px;font-size: 1rem;}
.button--round{background: #fff; color:#000; padding: 15px 30px; border-radius: 100px; font-weight: bold;}
.button--round:hover{background: #000; color:#fff;}
.button--round-outline{background: transparent; color:#fff; padding: 15px 30px; border-radius: 100px; font-weight: bold;border: 1px solid #fff}
.button--round-outline:hover{background: #fff; color:#000;}
*/


/* ! Header */
/*------------------------------------------------------------------*/

.header-container {
	background: #fff;
	position: fixed;
	top: 0;
	z-index: 9999;
	width: 100%;
	max-width: 1400px;
}

.logged-in .header-container {
	top: 30px;
}

.header {
	display: flex;
	justify-content: space-between;
	width: 100%;
	max-width: 1250px;
	margin: 0 auto;
}

.header li a {
	color: #fff;
	background-color: green;
	padding: 10px;
	border-radius: 25px;
	display: block;
}

.header__menu {
	margin-bottom: 0;
}

.header__menu li {
	display: inline-block;
}

.header a.header__logo {
	font-weight: bold;
	padding: 0;
}

.header__logo img {
	height: 50px;
	margin: 10px;
}

.header__hamburger {
	display: none;
}


@media (max-width: 768px) {

	.header__hamburger {
		display: block;
		width: 40px;
		height: 35px;
		margin-top: 9px;
		margin-right: 4px;
	}

	.header__hamburger span {
		width: 33px;
		height: 2px;
		background: #fff;
		margin-top: 8px;
		display: block;
		transition: all 0.15s cubic-bezier(.215, .61, .355, 1);
	}

	.header__menu {
		position: absolute;
		top: 48px;
		left: 0;
		width: 100%;
		background: #333;
		height: 0;
		overflow: hidden;
		transition: all 1s cubic-bezier(.215, .61, .355, 1);
	}

	.header__menu li {
		display: block;
	}

	.menu-open .header__hamburger span:nth-child(1) {
		transform: translateY(5px) rotate(45deg);
	}

	.menu-open .header__hamburger span:nth-child(2) {
		transform: translateY(-5px) rotate(-45deg);
	}

	.menu-open .header__menu {
		height: 100vh;
	}

	.menu-open {
		overflow: hidden;
	}

}


/* ! Index */
/*------------------------------------------------------------------*/


/* ! Single */
/*------------------------------------------------------------------*/


/* ! Footer */
/*------------------------------------------------------------------*/

.site-footer-modern {
	background: #f4f4f4;
	border-top: 4px solid #55ad6c;
	padding: 50px 40px 25px;
	font-size: 15px;
}

.site-footer-modern__inner {
	max-width: 1100px;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	gap: 60px;
}

.site-footer-modern__inner > div {
	flex: 1;
}

.site-footer-modern h3 {
	font-size: 22px;
	color: #55ad6c;
	margin: 0 0 15px 0;
	font-weight: 600;
}

.site-footer-modern h4 {
	font-size: 17px;
	color: #222;
	margin: 0 0 15px 0;
	font-weight: 700;
}

.site-footer-modern p {
	font-size: 15px;
	line-height: 1.6;
	margin: 0 0 5px 0;
}

.site-footer-modern a {
	color: #16852a;
	text-decoration: none;
}

.site-footer-modern a:hover {
	text-decoration: underline;
}


/* Parte inferiore del footer */

.site-footer-modern__bottom {
	max-width: 1100px;
	margin: 30px auto 0;
	padding-top: 20px;
	border-top: 1px solid #d5d5d5;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 30px;
}

.site-footer-modern__links {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px;
}


/* Pulsante telefono */

.site-footer-modern__cta {
	display: inline-block;
	background: #55ad6c;
	color: #fff !important;
	padding: 12px 22px;
	border-radius: 30px;
	font-weight: 700;
	text-decoration: none !important;
	transition: opacity 0.2s ease;
}

.site-footer-modern__cta:hover {
	opacity: 0.9;
	text-decoration: none;
}


/* Footer mobile */

@media (max-width: 768px) {

	.site-footer-modern {
		padding: 40px 25px 25px;
	}

	.site-footer-modern__inner {
		flex-direction: column;
		gap: 25px;
	}

	.site-footer-modern__bottom {
		flex-direction: column;
		align-items: flex-start;
		gap: 20px;
	}

	.site-footer-modern__cta {
		width: 100%;
		text-align: center;
	}

}


/* ! Grid System */
/*------------------------------------------------------------------*/

.grid {
	display: flex;
	flex-wrap: wrap;
	max-width: 1400px;
	margin: 0 auto;
	box-shadow:
		0 4px 8px 0 rgba(0, 0, 0, 0.2),
		0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.grid--small {
	max-width: 900px;
}

.grid--center {
	justify-content: center;
}

.grid--full {
	max-width: 100%;
}

.grid--footer {
	display: flex;
	flex-wrap: wrap;
	max-width: 1400px;
	margin: 0 auto;
}


.col-20 {
	width: 20%;
}

.col-25 {
	width: 25%;
}

.col-30 {
	width: 30%;
}

.col-33 {
	width: 33.33%;
}

.col-40 {
	width: 40%;
}

.col-50 {
	width: 50%;
}

.col-60 {
	width: 60%;
}

.col-70 {
	width: 70%;
}

.col-80 {
	width: 80%;
}

.col-90 {
	width: 90%;
}

.col-100 {
	width: 100%;
}


[class*='col-'] {
	padding: 0;
}

.grid--full [class*='col-'],
.grid .grid [class*='col-'] {
	padding: 0;
}


@media (max-width: 768px) {

	[class*='col-'] {
		width: 100%;
	}

	.sma-33 {
		width: 33.33%;
	}

	.sma-50 {
		width: 50%;
	}

	.sma-25 {
		width: 25%;
	}

}


/* ! Helpers */
/*------------------------------------------------------------------*/

.br {
	border: 1px solid red;
}

.img-res {
	width: 100%;
}

.video-res {
	width: 100%;
	height: 100%;
	overflow: hidden;
}

.video-res video {
	width: 100%;
	height: 100%;
	object-fit: cover;
}


.mt-0 {
	margin-top: 0;
}

.mt-1 {
	margin-top: 1rem;
}

.mt-2 {
	margin-top: 2rem !important;
}

.mt-3 {
	margin-top: 3rem !important;
}

.mt-4 {
	margin-top: 4rem;
}


.ml-0 {
	margin-left: 0;
}

.ml-1 {
	margin-left: 1rem;
}

.ml-2 {
	margin-left: 2rem !important;
}

.ml-3 {
	margin-left: 3rem !important;
}

.ml-4 {
	margin-left: 4rem;
}


.mr-0 {
	margin-right: 0;
}

.mr-1 {
	margin-right: 1rem;
}

.mr-2 {
	margin-right: 2rem !important;
}

.mr-3 {
	margin-right: 3rem !important;
}

.mr-4 {
	margin-right: 4rem;
}


.mb-0 {
	margin-bottom: 0;
}

.mb-1 {
	margin-bottom: 1rem;
}

.mb-2 {
	margin-bottom: 2rem;
}

.mb-3 {
	margin-bottom: 3rem;
}

.mb-4 {
	margin-bottom: 4rem;
}


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

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

.text-right {
	text-align: right;
}


.p-0 {
	padding: 0;
}

.p-1 {
	padding: 1rem;
}

.p-2 {
	padding: 2rem;
}

.p-3 {
	padding: 3rem;
}

.p-4 {
	padding: 4rem;
}


.pt-0 {
	padding-top: 0;
}

.pt-1 {
	padding-top: 1rem;
}

.pt-2 {
	padding-top: 2rem;
}

.pt-3 {
	padding-top: 3rem;
}

.pt-4 {
	padding-top: 4rem;
}


.pb-0 {
	padding-bottom: 0;
}

.pb-1 {
	padding-bottom: 1rem;
}

.pb-2 {
	padding-bottom: 2rem;
}

.pb-3 {
	padding-bottom: 3rem;
}

.pb-4 {
	padding-bottom: 4rem;
}


.icon-small {
	width: 40px;
	padding: 8px;
}

.icon-white {
	filter: invert(1);
}

.bg-dark {
	background: #000;
}

.text-white {
	color: #fff;
}

.text-dark {
	color: #000;
}

.v-center {
	display: flex;
	justify-content: center;
	flex-flow: column;
	align-items: flex-start;
}

.font-normal {
	font-weight: 400;
}


.none {
	display: none;
}

@media (max-width: 768px) {

	.sma-none {
		display: none;
	}

}

@media (min-width: 768px) {

	.desktop-none {
		display: none;
	}

}


/* ! Wordpress Styles */
/*------------------------------------------------------------------*/

input,
textarea {
	border: 3px solid #ddd;
	border-radius: 3px;
	padding: 10px;
}

input[type=submit],
button {
	border: 3px solid #ddd;
	background: #ddd;
	border-radius: 3px;
	padding: 10px;
}


.form-search {
	width: 100%;
	border: 3px solid #ddd;
	border-radius: 100px;
	padding-left: 15px;
}

.form-search input {
	width: calc(100% - 40px);
	border: none;
}

.form-search button {
	padding: 0;
	background: transparent;
	border: none;
}

.form-search img {
	width: 25px;
	margin-bottom: -8px;
}


/*
Il calc viene utilizzato per spostare l'immagine, in .alignfull:
prima viene centrata con 50% e poi viene allineata a sinistra
con il -50vw in modo che sia a tutto schermo e responsive.

Stesso discorso per .alignwide, ma viene spostata di -45vw
in modo da lasciare del margine ai lati.
*/

.alignfull {
	width: 100vw;
	/* margin-left: calc(50% - 50vw); */
	margin: 0;
}

.alignfull video {
	max-width: 1400px;
}

.alignwide {
	width: 90vw;
	margin-left: calc(50% - 45vw);
}