/* ! Reset */
body, html{font-size: 18px; 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}

body{font-family: "Atma", system-ui; 
background: url(images/background.png) no-repeat center center; background-size:100% 100%;
}

@media (min-width: 768px) {
/*	body:not(:has(.only-home)) .cover--header {display:none;}
	body:has(.only-home) .header-container {min-height: 90vh;}
*/	
}

/* ! Title System */
.text-0{font-size: 5rem; 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;}
h5, .text-5{font-size: 0.8rem;}

h1, h2, h3, h4, h5, p, ol, ul{margin-bottom: 1rem;}

.fontw300{font-weight: 300;}
.fontw400{font-weight: 400;}
.fontw700{font-weight: 700;}

@media (max-width: 768px) {
    .text-0{font-size: 4rem;}
    h1, .text-1{font-size: 2.7rem;}
}

/* ! Button System */
.button{font-size: 1.2rem; text-transform: uppercase; font-weight: bold; background:#ACD8BE; color:#000;padding: 14px 25px;display: inline-block; border-radius: 4px; position: relative; opacity: 1; border: none; font-family: "Atma";}
.button:hover{background: #b9d1c3; color:#fff; transition-duration: 0.5s; cursor: pointer;}

.button img{position: absolute; top:40%; right:10px; width:40px;transform: translateY(-45%);}
.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;}
.button__label{opacity:0;}
.button--small--small{padding: 5px 10px;font-size: 0.8rem;}

.button:disabled {cursor: not-allowed; filter: alpha(opacity=65); -webkit-box-shadow: none;	box-shadow: none; opacity: .65;}	 

/* ! Animation */
/* --------------------------------------------------------- */

.slide-right{position:relative; right: -200px}
.slide-left{position:relative; left: -200px}
.slide-right-plus{position:relative; right: -200px}

.fade-up{opacity: 0; transform: translateY(3rem);}


/* ! Components -------------- */

/* ! Header */
.header-container{z-index: 99999; height: 90px;
/* per menu fisso 
position: fixed; top: 0; left: 0; width: 100%; z-index: 99; border-bottom: 1px solid #dae7ee;
/* per menu fisso */
}

.header{display: flex; justify-content: space-between; background: #acd8be; height: 90px;}
.header__hamburger{display: none;}
.header__menu{margin-bottom: 0; padding-top:80px; width: 55%; text-align: center; display: flex; align-items: center; justify-content: space-around;}
.header__menux li{display: inline-block;}

.header__menu li a{font-size: 1rem; font-weight: 700; text-transform: uppercase; background:#fff; color:#000; padding: 14px 25px;display: inline-block; border-radius: 12px; position: relative; opacity: 1; border: 1px solid #F7F7F7; box-shadow: 1px 1px 5px 1px rgba(91, 90, 91, 0.8);}
.header__menu li a:hover{color: #b9d1c3;}
.header__menu .active{color: #b9d1c3;}

.header__logo{font-weight: bold; width: 15%; padding: 50px 0 0 10px; display: flex; align-items: center;}

.header__icons{width: 15%; display: flex; justify-content: flex-end; align-items: center;}

.header__bottom{margin-top: 0px; width: 100%; display: flex; align-items: center; background: #26327a; color: white;}

@media (max-width: 768px) {
    body{padding-top: 60px;}
				
    .header-container{position: fixed; top: 0; left: 0; width: 100%; z-index: 99;	background: none; padding-top: 0px;}

 	  .header{border-radius: 0; margin-top: 0; margin-bottom: 0; padding-top: 10px; padding-bottom: 10px;}

    .header__hamburger{display:block; height: 40px; padding: 20px 10px 10px 10px;}
    .header__hamburger span{width: 33px; height: 2px; background: #000; margin-top: 5px; display: block; transition: all 0.15s cubic-bezier(.215, .61, .355, 1);}

    .menu-open .header__hamburger span:nth-child(1){transform: translateY(3px) rotate(50deg);}
    .menu-open .header__hamburger span:nth-child(2){transform: translateY(-5px) rotate(-50deg);}
    .menu-open .header__hamburger span:nth-child(3){display: none;}
    .menu-open .header__menu{height: 100vh; background: #acd8be;}
    .menu-open{overflow:hidden;}

    .header__logo{justify-content: center; width: 40%; padding: 0 10px 0 0;}

    .header__menu{display: block; z-index: 99; position:absolute; top:90px; left:0; width: 100%; background: #acd8be; height: 0; padding: 0; overflow: hidden; transition: all 1s cubic-bezier(.215, .61, .355, 1);}
    .header__menu li{display: block;}
    .header__menu li a{text-align: left; padding: 5%; border-top: 1px solid #666; margin-top: 3%;}
}


/* ! Cover */
.cover{padding: 20px; min-height: 40vh; display: flex; flex-flow: column; justify-content: center; align-items: center; text-align: center;}
.cover--dark{background:#666; height: 500px; color: #fff;}

.cover__content{max-width: 600px; margin: 0 auto}

.cover--image{min-height: 600px; color:#fff; justify-content: flex-start;  text-align: left;}
.cover--image .cover__content{max-width: 1250px; width: 100%;}
.cover--image h1, .cover--image h2{font-size: 2.4rem;}
.cover--image h3{font-size: 1.4rem;text-transform: uppercase;font-weight: normal;}

.cover--header{padding: 20px; min-height: 60vh; display: flex; flex-flow: column; justify-content: center; align-items: center; text-align: center;}
.cover-claim{padding-top: 10px; padding-bottom: 10px; z-index: 99999; 
background:linear-gradient(0deg, rgba(34,43,98,0.52), rgba(38,50,122, 0.53)), url(images/3.jpg);
background-size:cover;	min-height: 40vh; background-position: center; background-repeat: no-repeat;color: #fff;}

/* ! Cover Footer */
.cover-footer{background: #6ea4bf; padding: 20px; min-height: 200px; display: flex; flex-flow: column; justify-content: center; align-items: center; text-align: center;}
.cover-footer--dark{background:#666; height: 200px; color: #fff;}
.cover-footer__content{max-width: 600px; margin: 0 auto}
.cover-footer--image{min-height: 200px; color:#fff; justify-content: flex-start;  text-align: left;}
.cover-footer--image .cover-footer__content{max-width: 1250px; width: 100%;}
.cover-footer--image h1, .cover-footer--image h2{font-size: 2.4rem;}
.cover-footer--image h3{font-size: 1.2rem; font-weight: normal; padding: 0 1.5rem;}
.cover-footer .tiles{min-height: 400px; border-radius: 5px; color:#000; position: relative;overflow: hidden; background-color: #ecf3f7;}
.cover-footer .tiles__content{padding:10px 70px 10px; background: none;}
.cover-footer p{padding: 1.5rem;}


/* ! Slider */
.splide__slide{padding: 20px;}

/* ! Tiles */
.tiles{min-height: 350px; max-width: 350px; border-radius: 5px; color:#fff; position: relative;overflow: hidden; display:block;}
.tiles__label{position: absolute; bottom: 30px; left:30px}
.tiles__content{
  padding: 30px;
  background: rgb(255,255,255);
  background: linear-gradient(0deg, rgba(255,255,255,0) 0%, rgba(0,0,0,1) 100%);
}


/* ! Card */
.card{background: #fff; padding: 20px 0px 20px; border-radius: 5px; border: 1px solid #ACD8BE; text-align: center; height: 476px;}
/* Card libro */
.card-libro{
 background: #fff; box-shadow: 2px 2px 10px 0 rgba(0,0,0,0.1);
 display: flex; flex-direction: column; justify-content: flex-end;
 padding: 10px 0px 10px; border-radius: 5px; border: 1px solid #ACD8BE; text-align: center;
}


/* ! Footer */
.footer{background: #acd8be; padding-top: 30px;}
.footer__logo{font-weight: bold; width: 70%; padding-top: 10px; display: flex; align-items: center;}
.footer__icons{width: 100%; display: flex; justify-content:flex-start; align-items: center;}
@media (max-width: 768px) {
 .footer__logo_content{display: flex; align-items: center;}
}




/* ! Grid System */
.grid{display: flex; flex-wrap: wrap; max-width: 1250px; margin: 0 auto;}
.grid--small{max-width: 900px;}
.grid--center{justify-content: center;}
.grid--full{max-width: 100%}

.col-05{width: 5%;}
.col-10{width: 10%;}
.col-15{width: 15%;}
.col-20{width: 20%;}
.col-25{width: 25%;}
.col-30{width: 30%;}
.col-33{width: 33.33%;}
.col-35{width: 35%;}
.col-40{width: 40%;}
.col-45{width: 45%;}
.col-50{width: 50%;}
.col-60{width: 60%;}
.col-70{width: 70%;}
.col-75{width: 75%;}
.col-80{width: 80%;}
.col-90{width: 90%;}
.col-95{width: 95%;}
.col-100{width: 100%;}
.col-23{width: 23.33%;}

[class*='col-']{padding: 10px;}

@media (max-width: 768px) {
    [class*='col-']{width: 100%}
    .sma-10{width: 10%;}
    .sma-20{width: 20%;}
    .sma-25{width: 25%;}
    .sma-30{width: 30%;}
    .sma-33{width: 33.33%;}
    .sma-35{width: 35%;}
    .sma-40{width: 40%;}
    .sma-45{width: 45%;}
    .sma-50{width: 50%;}
    .sma-55{width: 55%;}
    .sma-60{width: 60%;}
    .sma-70{width: 70%;}
    .sma-80{width: 80%;}
    .sma-90{width: 90%;}
}


/* ! Form */
input[type=email], input[type=number], input[type=password], input[type=search], input[type=tel], input[type=text], input[type=url], select, textarea {
    height: 38px; padding: 6px 10px; background-color: #fcfcfc; border: 1px solid #d1d1d1; border-radius: 4px; box-shadow: none; box-sizing: border-box; width: 100%;
				opacity: 0.7; font-family: inherit; font-size: inherit;}
input[type=email], input[type=number], input[type=password], input[type=search], input[type=tel], input[type=text], input[type=url], textarea {-webkit-appearance: none; -moz-appearance: none; appearance: none;}
textarea {min-height: 65px; padding-top: 6px; padding-bottom: 6px;}
input[type=email]:focus, input[type=number]:focus, input[type=password]:focus, input[type=search]:focus, input[type=tel]:focus, input[type=text]:focus, input[type=url]:focus, select:focus, textarea:focus {border: 1px solid #d1d1d1; outline: 0; opacity: 1;}
label, legend {display: block; margin: 12px 0 10px;}
fieldset {padding: 0; border-width: 0;}
input[type=checkbox], input[type=radio] {display: inline;}
label>.label-body {display: inline-block; margin-left: 10px; font-weight: 400;}
input:valid {border-color: #d1d1d1;}
input:invalid {border-color: red;}
input:required:not(:checked) + label {color: red;}
input[type=submit] {font-family: inherit; font-size: inherit; cursor: pointer;}


input[type=file] {
    height: 38px; padding: 6px 10px; background-color: #fcfcfc; border: 1px solid #d1d1d1; border-radius: 4px; box-shadow: none; box-sizing: border-box; width: 100%;
				opacity: 0.7; font-family: inherit; font-size: inherit;}
input[type=file]:focus {border: 1px solid #d1d1d1; outline: 0; opacity: 1;}

/* checkbox */
.checkbox label:after {content: ''; display: table; clear: both;}
.checkbox .cr {position: relative; display: inline-block; border: 1px solid #a9a9a9; border-radius: .25em; width: 1.3em; height: 1.3em; float: left; margin-right: .5em;}
.checkbox .cr .cr-icon {position: absolute; font-size: .8em; line-height: 0; top: -55%; left: -55%;}
.checkbox label input[type="checkbox"] {display: none;}
.checkbox label input[type="checkbox"]+.cr>.cr-icon {opacity: 0;}
.checkbox label input[type="checkbox"]:checked+.cr>.cr-icon {opacity: 1;}
.checkbox label input[type="checkbox"]:disabled+.cr {opacity: .5;}
.checkbox :hover {cursor: pointer;}
/* checkbox */


/* ! Helpers */
.overflow{overflow: hidden;}
.br{border: 1px solid red;}
.img-res{width: 100%;}
.imgover:hover{filter:alpha(opacity=60);-moz-opacity:.60;opacity:.60;}

.m-0{margin: 0}
.mt-0{margin-top: 0;}
.mt-1{margin-top: 1rem;}
.mt-2{margin-top: 2rem;}
.mt-3{margin-top: 3rem;}
.mt-4{margin-top: 4rem;}
.mt-5{margin-top: 5rem;}

.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;}

.mr-0{margin-right: 0;}

.text-center{text-align: center}
.text-left{text-align: left}
.text-right{text-align: right}
.text-justify{text-align: justify}
@media (max-width: 768px) {
  .sma-text-center{text-align: center}
  .sma-text-left{text-align: left}
  .sma-text-right{text-align: right}
  .sma-text-justify{text-align: justify}
}

.p-0{padding: 0}
.p-05{padding: 0.5rem;}
.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;}
.pt-5{padding-top: 5rem;}

.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;}
.pb-5{padding-bottom: 5rem;}

.pr-0{padding-right: 0;}

.icon-small{width: 40px; height: 40px; padding: 8px;}
.icon-med{width: 60px;padding: 8px;}
.icon-large{width: 100px;padding: 8px;}
.icon-white{filter: invert(1);}
.icon-green{filter: invert(30%) sepia(96%) saturate(1060%) hue-rotate(89deg) brightness(91%) contrast(108%);}
.icon-100{width: 100px; height: 100px; padding: 8px;}
.icon-200{width: 200px; height: 200px; padding: 8px;}
.bg-dark{background: #000;}
.text-white{color:#fff}
.v-center{display: flex; justify-content: center; flex-flow: column}
.ai-center{align-items:center}

.font-normal{font-weight: 400;}
.font-moc {font-family: "Mountains of Christmas", serif;}

.none{display: none;}
@media (max-width: 768px) {
  .sma-none{display: none;}
}
@media (min-width: 768px) {
  .desktop-none{display: none;}
}

.hr {clear: both; border-top: solid #26327a; border-width: 1px 0 0;	margin:10px 0;	height: 0;}

.bg-grigio{background: #efefef;}
.bg-white{background: #fff;}
.bg-red{background: #FF0004;}

@media (max-width: 768px) {
.row-reverse {display: flex; flex-direction: row-reverse;}
.column-reverse {display: flex; flex-direction: column-reverse;}
}


/* label like bootstrap */
.label {display: inline; padding: .2em .6em .3em; font-size: 75%;	font-weight: 700;	line-height: 1;	color: #fff; text-align: center;	white-space: nowrap;	vertical-align: baseline;	border-radius: .25em;}
.label-danger {background-color: #d9534f;}
.label-warning {background-color: #f0ad4e;}
/* label like bootstrap */


/* dialog */
dialog {border: none; box-shadow: #00000029 2px 2px 5px 2px; border-radius: 5px; background-color: #fff; width: 50%; padding: 0;}
dialog::backdrop {background-color: rgba(0, 0, 0, 0.6);}
dialog::close {position: absolute; top: 10px; right: 10px; font-size: 20px; color: #fff; background-color: transparent; border: none; cursor: pointer;}
dialog::close:hover {color: #ff0000;}
@keyframes animate-top {
  from {top:-300px; opacity:0} 
    to {top:0; opacity:1}
}
.animate {animation-name: animate-top; animation-duration: 0.4s;}
dialog .modal-header {background-color: #ACD8BE; color: black;}
dialog .modal-title {margin: 0; line-height: 1.5;}

@media (max-width: 768px) {
 dialog{width: 80%;}
}
/* dialog */



/* end file */

