/* resetti */
body {margin:0;padding:0;width:100%;font-family:'Outfit',sans-serif;color:#333;}
img {margin:0;padding:0;outline:none;width:100%;height:auto;display:block;}
div {margin:0;padding:0;}
a {text-decoration:none;color:#139;}
h1, h2, h3, h4, h5, h6 {font-weight:700;}
h1 {font-size:2rem;text-align:center;}
h3 {font-size:1.375rem;color:#444;font-weight:600;}

/* header */
.header {display:flex;margin:2rem 5%;justify-content:space-between;flex-wrap: no-wrap;}
.header .logo {min-width:6rem;display:flex;flex-direction:column;justify-content:center;}
.header .logo img {}
.header .title-cont {margin:0 2rem;max-width:36rem;display: flex;flex-direction: column;align-items: center;}
.header .site-title {margin:0 0 1rem;color:#666;}
.header .site-title-tag {margin:0;color:#1098c5;}
.header .contact {text-align:right;}
.header .icon-cont {display:flex;justify-content:flex-end;gap:0.5em;}
.header .icon-cont a {color:#5b82bd;}
.header .contact-icon {width:2em;}
header .page-nav {font-family:'Open Sans',sans-serif;background-color:#47b;}
header .main-menu {
	padding:0.25rem 0;
	margin:0 auto;
	display:flex;
	flex-wrap:wrap;
	justify-content:center;
	row-gap:0.25rem;
	column-gap:5%;
	max-width:1280px;
}
header .main-menu li {display:block;list-style:none;}
header .main-menu li a {font-size:1.05rem;color:#fff;padding:0.33rem 0.5rem;border-radius:0.125rem;display:block;transition:background-color 333ms;}
header .main-menu li a:hover {background-color:#68c;}

/* content */
/* whole area */
.page-container {padding: 1rem 2rem;background-color:#cee9df;}
/* content and sidebar */
.page-content {max-width:1280px;padding:0;margin:0 auto;display:flex;column-gap:1rem;}
/* content only */
.page-contcol {max-width:960px;display:flex;flex-direction: column;row-gap:2rem;}
/* content container */
.page-main {padding:2rem;border-radius:2rem;box-shadow:3px 3px 6px 4px #0002;background-color:#fff;}
.page-main a {border-bottom:1px solid #cee9df00; transition:color 333ms,border 333ms;}
.page-main a:hover {border-bottom:1px solid #cee9dfff;color:#35b; }

/* main column container */
.page-main.notice {}

/* text variations */
.page-content h1 {font-family:'Atma',sans-serif;}
.page-content p {font-size:1.1rem;line-height:1.5;}
.page-content ul {line-height:1.666;color:#5da176;font-weight:600;}
.page-main.notice {background-color:#b7dfd6;}
.page-main.notice h3 {margin:0;color:#3b8d77;}
.page-main.privacy h2, .page-main.privacy h3 {margin:2rem 0 1rem;text-decoration:underline;}

/* quotes */
blockquote {
	background-color:#f7c5a2;
	margin:1rem;
	padding:1rem;
	border-radius:0.5rem;
	box-shadow:1px 1px 2px #0003;
	transition: margin 333ms, box-shadow 666ms;
	font-size: 1.25rem;
}
blockquote:hover {
	margin:1.5rem 1rem;
	box-shadow:3px 5px 6px #0005;
}

/* heading images */
.page-image {border-radius:2rem;box-shadow:0px 0px 7px 3px #0005;overflow:hidden;}

/* content images */
.img-cont {margin:3rem 0 0;display:flex; gap:1rem; flex-wrap:wrap; justify-content:center;}
.img-cont img {width:47.5%;}

/* sidebar */
.page-sidebar {min-width:10rem;}
.page-sidebar .portrait {max-width:270px;margin:0 auto;border-radius:1rem;box-shadow:3px 3px 6px 4px #0002;overflow:hidden;}
.page-sidebar .portrait-cap {font-family:'Atma',sans-serif;text-align:center;font-weight:600;font-size:1.1rem;margin:0.5rem 0 1rem;}
.side-cont {max-width:12rem;margin:0 auto;padding:0;border-radius:2rem;box-shadow:3px 3px 6px 4px #0002;background-color:#fff;}
.side-cont-inner {padding:2rem;}
.side-mobile, .side-email {margin:2rem 0;text-align:center;}
.side-mobile a, .side-email a {padding:0.5rem;font-size:1.1rem;color:#ac7c61;background-color:#fee;border-radius:0.25rem;}
.side-note {text-align:center;padding:0 1rem;margin:2rem 0;max-width:32rem;}
.side-email a {font-size:1.25rem;}
.page-sidebar p {}

/* footer */
footer {margin:0;padding:0;}
.foot-card {
	display:flex;
	width:33.3%;
	margin:0 auto;
	padding:1rem 1.5rem;
	flex-direction:column;
	justify-content:space-around;
	align-items:center;
	border-radius:1rem;
	background-color:#7fcccf;
	text-align:center;
}
.foot-card h2 {margin:0;}
.foot-card p.site {color: #fff;margin:0 0 1.5rem 0;}
.foot-card p.desc {margin:0 0 1.5rem 0;}
.foot-card p.copy {color:#6a834f;margin:0;}
.foot-cont {
	background-color:#c6e8ef;
	border-top:1px solid #0003;
	margin:0;
	padding:1rem 0;
	width:100%;
}
/* scroll top */
.back-to-top {position:fixed;bottom:1rem;right:1rem;opacity:0.666;}
.back-to-top a {color:#30714b;font-size:2rem;}

/* page customisations */
.testi .page-main > blockquote:nth-child(odd) {background-color:#ebd18a;}
.priva .page-content h1, .terms .page-content h1 {font-family:inherit;}

/* contact form */
.contact-form-container {
	background-color: #b1e5d6;
	padding: 1.5rem;
	border-radius: 1rem;
	box-shadow: 2px 4px 6px #0003;
	max-width: 640px;
	width: 100%;
	margin: 3rem auto 0;
}

.form-group {margin-bottom: 1rem;}

label {
	display: block;
	margin-bottom: 0.5rem;
	font-weight: bold;
	color: #333;
	font-family: inherit;
}

input, textarea {
	width: 100%;
	padding: 0.8rem;
	border: 1px solid #ddd;
	border-radius: 4px;
	box-sizing: border-box;
	font-size: 1rem;
	font-family: inherit;
}

textarea {resize: vertical;}

/* checkboxes */
.form-group.check {display:flex;flex-wrap: wrap;flex-direction: row;justify-content: space-evenly;column-gap: 0.5rem;row-gap: 0.5rem;}
.form-group.check div {}
.form-group.check label {display:inline-block;margin:0;font-weight:400;}
.form-group.check input {margin:0;padding:0;width:auto;}

.error-message {color:#a00;font-size: 0.875rem;display: none;}

.submit-button {
	background-color: #7199a5;
	color: white;
	border: none;
	padding: 0.75rem;
	border-radius: 0.25rem;
	font-size: 1.25rem;
	cursor: pointer;
	width: 100%;
	font-family: inherit;
	transition: background-color 0.3s;
}

.submit-button:hover {background-color: #646c6e;}

/* disegno */
.disegno {position:static;background: #000;padding: 0 0.5rem;}
.disegno .cont {display: inline-flex;align-items: center;gap: 1rem;margin: 0.125rem 0;}
.disegno .logo {border-radius: 0.25rem;overflow: hidden;}
.disegno img {width:auto;max-height:2rem}
.disegno .info {color:#a19797;}

/* tablet and mobile variations */
@media (max-width: 768px) {
	.header {margin: 1rem;justify-content: center;}
	/* fits fine at 768, try below */
	/* .page-sidebar {margin: 2rem auto 1rem;}*/
	.side-cont {max-width: 270px;}
	blockquote:hover {margin:1rem;}
}
@media (max-width: 512px) {
.header {margin: 0.5rem;row-gap: 0.5rem;flex-wrap: wrap;}
.header .title-cont {margin: 0 1rem;}
.header .site-title {font-size: 1.25rem;margin: 0 0 0.5rem;}
.header .site-title-tag {font-size: 1rem;}
.header .contact {font-size: 0.667rem;}
header .main-menu {row-gap:0.5rem;column-gap:0;}
header .main-menu li a {font-size: 0.85rem;}
h2 {font-size: 1.25rem;}
h3 {font-size: 1.1rem;}
.page-container {padding: 0.5rem;}
.page-content p {font-size: 1rem;line-height: 1.5;}
.page-content {flex-direction: column;row-gap: 1rem;}
.page-contcol {row-gap:0.75rem;}
.page-main {border-radius: 1rem;padding:1.25rem;}
.contact-form-container {padding: 0.333rem;margin: 1rem auto 0;border-radius: 0.5rem;max-width: 95%;}
input, textarea {padding: 0.333rem;}
.submit-button {font-size: 1.1rem;}
.back-to-top {bottom: 0.5rem;right: 0.5rem;}
.img-cont img {width: 100%;}
.page-image {border-radius:1rem;}
blockquote {font-size:1rem;margin: 0.5rem 0;}
.page-content ul {line-height: 1.5;font-weight: 300;padding-inline-start: 1.25rem;}
td {padding:0.25rem;}
.foot-card{width:90%;padding:0.5rem 2.5%;}
}