/*typographic*/
@import url('https://fonts.googleapis.com/css2?family=Archivo:wght@100;900&display=swap');
html, body  {font-family: 'Archivo', serif;font-variation-settings: 'wght' 400;}
.fw-thin       {font-variation-settings: 'wght' 100;}
.fw-extralight {font-variation-settings: 'wght' 200;}
.fw-light      {font-variation-settings: 'wght' 300;}
.fw-regular    {font-variation-settings: 'wght' 400;}
.fw-medium     {font-variation-settings: 'wght' 500;}
.fw-semibold   {font-variation-settings: 'wght' 600;}
.fw-bold       {font-variation-settings: 'wght' 700;}
.fw-extrabold  {font-variation-settings: 'wght' 800;}
.fw-black      {font-variation-settings: 'wght' 900;}

/*color text*/
.text-red {color:#AE161E;}
.text-blu {color:#20343d !important;}
a.text-red, a.text-red:hover {color:#AE161E;}
a.text-blu, a.text-blu:hover {color:#20343d !important;}

/*margin*/
@media all and (min-width: 1024px) {
    .container-fluid {padding-left:20px;padding-right:20px;}
}
@media all and (min-width: 1280px) {
    .container-fluid {padding-left:40px;padding-right:40px;}
}
@media all and (min-width: 1440px) {
    .container-fluid {padding-left:80px;padding-right:80px;}
}
@media all and (min-width: 1820px) {
    .container-fluid {padding-left:140px;padding-right:140px;}
}

/*animation*/
.animation  {
	-webkit-transition:	all 0.75s ease-in-out;
	-moz-transition:	all 0.75s ease-in-out;
	-o-transition:		all 0.75s ease-in-out;
	-ms-transition:		all 0.75s ease-in-out;
	transition:			all 0.75s ease-in-out;
}

/*header*/
#logo {width:180px;height:auto;transition:all 0.3s ease-in-out;}
#logo .svg-container {position:relative;width:180px;height:60px;}
#logo .svg-container svg {position:absolute;top:0;left:0;width:180px;height:60px;fill:#000000;opacity:1;}
#logo a {position: absolute;top:0px;left:0px;right:0px;bottom:0px;z-index:9;text-indent:-9999px;display:block;}

/*nav*/
.nav a {color:#FFF;border-bottom:1px solid rgba(0,0,0,0);transition: all 0.3s ease-in-out;}
.nav a:hover {color:#FFF;border-bottom:1px solid #FFF;}
.nav.lang a.active, .nav.lang a.active:hover {text-decoration:line-through;cursor:default;opacity:0.5;}

/*over logo*/
.over-logo {width:300px;height:180px;transition:all 0.3s ease-in-out;position:absolute;top:50%;left:50%;transform: translate(-50%, -50%);z-index:3;}
.over-logo .svg-container {position:relative;width:300px;height:180px;}
.over-logo .svg-container svg {position:absolute;top:0;left:0;width:300px;height:180px;fill:#FFF;opacity:1;}

/*light head*/
#header-wrapper.light #logo .svg-container svg {fill:#FFF;transition: all 0.3s ease;}

/*background*/
#background {
    position:fixed;
    top:0px;
    left:0px;
    right:0px;
    bottom:0px;
    background:#FFF;
    z-index:-1;
}
#background figure {
    position:absolute;
    top:0px;
    right:0px;
    bottom:0px;
    /*width:60%;*/
    width:55%;
    overflow:hidden;
    clip-path: polygon(25% 0%, 100% 0%, 100% 100%, 0% 100%);
    background-image:url(../img/bg-azienda-2-grey.jpg);
    background-repeat:no-repeat;
    background-size:cover;
    background-position:bottom right;
}
#background figure::after {
    content: "";
    position:absolute;
    top:0px;left:0px;right:0px;bottom:0px;
    z-index:1;
    background: rgb(255,255,255);
    background: radial-gradient(circle, rgba(255,255,255,0) 0%, rgba(0,0,0,0.95) 100%);
}
#fim-wrapper-image figure {
    position:absolute;
    top:0px;
    right:0px;
    bottom:0px;
    left:0px;
    width:100%;
    z-index:1;
    overflow:hidden;
    clip-path: polygon(25% 0%, 100% 0%, 100% 100%, 0% 100%);
    background-image:url(../img/bg-fim.jpg);
    background-repeat:no-repeat;
    background-size:contain;
    background-position: bottom left;
    background-attachment: fixed;
}
#silc-wrapper-image figure {
    position:absolute;
    top:0px;
    right:0px;
    bottom:0px;
    left:0px;
    width:100%;
    z-index:1;
    overflow:hidden;
    clip-path: polygon(25% 0%, 100% 0%, 100% 100%, 0% 100%);
    background-image:url(../img/bg-silc.jpg);
    background-repeat:no-repeat;
    background-size:contain;
    background-position: bottom left;
    background-attachment: fixed;
}



/*link site*/
a.link-site {text-decoration:none;position:relative;color:#000}
a.link-site::after  {content:"";width:2px;height:100%;position:absolute;top:0px;left:0px;bottom:0px;background:#000;}
a.link-site::before {content:"";width:2px;height:100%;position:absolute;top:0px;right:0px;bottom:0px;background:#000;}
a.link-site::after, a.link-site::before {transform: skew(-10deg, -10deg);transition: all 0.3s ease-in-out;}
a.link-site:hover::after,  a.link-site:hover::before {transform: skew(-25deg, -25deg);}
a.link-site.text-blu {color:#20343d;}
a.link-site.text-blu::after  {background:#20343d;}
a.link-site.text-blu::before {background:#20343d;}
a.link-site.text-red {color:#AE161E;}
a.link-site.text-red::after  {background:#AE161E;}
a.link-site.text-red::before {background:#AE161E;}

/*scroll down*/
a.go-down {display:block;width:60px;height:60px;position:absolute;bottom:3rem;}
a.go-down::after {content:"";display:block;width:60px;height:60px;position:absolute;top:0px;left:1px;background:#000;z-index:1;transform: skew(-10deg, 0deg);transition: all 0.3s ease-in-out;}
a.go-down:hover::after {transform: skew(-25deg, 0deg);}
a.go-down.text-red::after {background:#AE161E;}
a.go-down.text-blu::after {background:#20343d;}
a.go-down span {display:block;width:60px;height:60px;position:relative}
a.go-down span::after  {content:"";width:2px;background:#FFF;position:absolute;top:15px;left:50%;bottom:20px;margin-left:-1px;z-index:2;}
a.go-down span::before {content:"";width:10px;height:10px;border-top:2px solid #FFF;border-right:2px solid #FFF;position:absolute;bottom:15px;left:25px;transform:rotate(135deg);z-index:2;}

/*footer*/
#footer-wrapper p a {color:#000;border-bottom:1px solid rgba(0,0,0,0);transition: all 0.3s ease-in-out;text-decoration:none;}
#footer-wrapper p a:hover {color:#000;border-bottom:1px solid #000;}
#footer-wrapper .svg-container {position:relative;width:110px;height:60px;overflow:hidden;}
#footer-wrapper .svg-container svg {position:absolute;top:0;left:0;width:110px;height:60px;fill:#000000;opacity:1;}
#footer-wrapper .svg-container svg.red {fill:#AE161E;}
#footer-wrapper .svg-container svg.blu {fill:#20343d;}
#footer-wrapper .svg-container a {display:block;position:absolute;top:0px;left:0px;right:0px;bottom:0px;z-index:3;text-indent:-9999px;}
#footer-wrapper .space {width:50px;height:60px;position:relative;}
#footer-wrapper .space::after {content:"";position:absolute;top:10px;bottom:10px;left:50%;margin-left:-1px;width:2px;background:#000;transform: skew(-15deg, -15deg);}

/*form*/
.form-control:focus {color:#fff;background-color:#000 !important;border-color: transparent;box-shadow:none;}
.form-check-input:focus {box-shadow:none;}
.btn.btn-form {background:#000;border-top:1px solid #FFF;border-bottom:1px solid #FFF;color:#FFF;}
.btn.btn-form:hover {background:#FFF;color:#000}
.form-check-input.is-invalid~.form-check-label, .was-validated .form-check-input:invalid~.form-check-label {color:#dc3545 !important;}
.form-control.is-invalid, .was-validated .form-control:invalid {background-color:rgba(86,21,27,0.25) !important;}

/*mappa*/
#map {width:100%;cursor:default;height:450px;margin:0px;}
#map .gmnoprint {display: block !important;}
#map .gm-style-cc {display: none !important;}
#map a[href^="https://maps.google.com/maps"], #map a[href^="https://www.google.com/maps"] {display:none !important;}

/*loading*/
#loading {position:fixed;top:0px;left:0px;right:0px;bottom:0px;z-index:9999;}
#loading .left-box  {position:absolute;top:0px;left:0px;bottom:0px;width:60%;background:#20343d;clip-path: polygon(0 0, 100% 0, 75% 100%, 0 100%);}
#loading .right-box {position:absolute;top:0px;right:0px;bottom:0px;width:60%;background:#AE161E;clip-path: polygon(25% 0, 100% 0, 100% 100%, 0 100%);}
#loading.loaded .left-box, #loading.loaded .right-box {transition: all 0.5s ease-in-out;}
#loading.loaded .left-box  {transform:translateX(-100%);}
#loading.loaded .right-box {transform:translateX(100%);}
#loading.loaded {transition: all 0.5s ease-in-out;}

/*logo movile over*/
.mobile-logo {display:none;}

/*responsive*/
@media all and (max-width: 1280px) {
    .over-logo {width:220px;height:140px;}
    .over-logo .svg-container {width:220px;height:140px;}
    .over-logo .svg-container svg {width:220px;height:140px;}
}

@media all and (max-width: 1024px) {
    html, body {font-size:12px;}
    .justify-content {justify-content: center!important;}
    #background figure {width:55%;}
    #header-wrapper {position:absolute !important;}
    .nav a {color:#000;}
    .nav.lang {margin:0px !important;}
    #logo {width:120px;}
    #logo .svg-container {width:120px;height:40px;}
    #logo .svg-container svg {width:120px;height:40px;}
    #background figure {top:0px;right:0px;left:0px;bottom:0px;width:100%;clip-path:none;opacity:.1;}
    #fim-wrapper-image, #silc-wrapper-image {display:none;}
    #fim-wrapper  {background-image:url(../img/bg-fim.jpg);background-size:cover;background-position:center;background-attachment:scroll;background-repeat:no-repeat;}
    #silc-wrapper {background-image:url(../img/bg-silc.jpg);background-size:cover;background-position:center;background-attachment:scroll;background-repeat:no-repeat;}
    a.go-down {display:none;}    
    .mobile-logo {display:block;}
    .mobile-logo svg {width:45%;max-width:180px; height:auto;fill:#FFF;margin:0px 0px 20px 0px;}
    .company-text {height:auto !important;min-height:auto !important;padding:15rem 0px;}
    .company-text .absolute {position:relative !important;height:auto !important;min-height:auto !important}
    .company-text h2 {display:none;}
    .company-text h5 {display:none;}
    .company-text p {color:#FFF;}
    a.link-site {color:#FFF !important;}
    a.link-site::after  {background:#FFF !important;}
    a.link-site::before {background:#FFF !important;}
    #contatti {height:100% !important;padding:40px 0px;}
    #contatti .min-vh-100 {height:auto !important;min-height:auto !important;}
    #map {margin:0px 0px 40px 0px;height:300px;}
    #footer-wrapper .space {width:40px;height:50px;}
    #footer-wrapper .svg-container, #footer-wrapper .svg-container svg {width:80px;height:50px;}

    #fim-wrapper a.text-blu, #fim-wrapper a.text-blu:hover {color:#FFF !important}
    #silc-wrapper a.text-red, #silc-wrapper a.text-red:hover {color:#FFF !important}
    

}

@media all and (max-width:640px) {
    #footer-wrapper .col-md-4 {text-align:center;}
    #footer-wrapper p {margin-left:0px !important;margin-right:0px !important;text-align:center;margin-top:10px !important;}
    #loading .left-box  {top:0px;bottom:auto;left:0px;right:0px;width:100%;height:60%;background:#20343d;clip-path: polygon(0 0, 100% 0%, 100% 75%, 0% 100%);}
    #loading .right-box {top:auto;bottom:0px;left:0px;right:0px;width:100%;height:60%;background:#AE161E;clip-path: polygon(0 25%, 100% 0%, 100% 100%, 0% 100%);}
    #loading.loaded .left-box  {transform:translateY(-100%);}
    #loading.loaded .right-box {transform:translateY(100%);}
}

/*template update*/
.halfwindow {display: block;width: 55%;height: 100vh;top: 0px;bottom: 0px;left: 45%;right: 0px;}
#fim-wrapper-image figure {background-position: bottom right;}
#silc-wrapper-image figure {background-position: bottom right;}
#fim-wrapper #fim-wrapper-image {left:auto;right:-65%}
#fim-wrapper.enter-frame #fim-wrapper-image {left:auto;right:0%}
#silc-wrapper #silc-wrapper-image {left:auto;right:-65%}
#silc-wrapper.enter-frame #silc-wrapper-image {left:auto;right:0%}

/*require*/
.form-check-label.required {color:#AE161E !important;}


.form-control.validate.required  {
    background-color: rgba(86,21,27,0.5) !important;
    border-color: #dc3545 !important;
    padding-right: calc(1.5em + .75rem) !important;
    background-image: url("data:image/svg+xml,<svg viewBox='0 0 16 16' fill='%23dc3545' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' d='M8.982 1.566a1.13 1.13 0 0 0-1.96 0L.165 13.233c-.457.778.091 1.767.98 1.767h13.713c.889 0 1.438-.99.98-1.767L8.982 1.566zM8 5c.535 0 .954.462.9.995l-.35 3.507a.552.552 0 0 1-1.1 0L7.1 5.995A.905.905 0 0 1 8 5zm.002 6a1 1 0 1 1 0 2 1 1 0 0 1 0-2z' clip-rule='evenodd'/></svg>") !important;
    background-repeat: no-repeat !important;
    background-position: right calc(.375em + .1875rem) center !important;
    background-size: calc(.75em + .375rem) calc(.75em + .375rem) !important;
}

/*
@media all and (max-width: 1024px) {
    html, body {font-size:12px;}
    #background figure {width:55%;}
}

@media all and (max-width:768px) {
    #header-wrapper {position:absolute !important;}
    .nav a {color:#000;}
    .nav.lang {margin:0px !important;}
    #logo {width:120px;}
    #logo .svg-container {width:120px;height:40px;}
    #logo .svg-container svg {width:120px;height:40px;}
    #background figure {top:0px;right:0px;left:0px;bottom:0px;width:100%;clip-path:none;opacity:.1;}
    #fim-wrapper-image, #silc-wrapper-image {display:none;}
    #fim-wrapper  {background-image:url(../img/bg-fim.jpg);background-size:cover;background-position:center;background-attachment:scroll;background-repeat:no-repeat;}
    #silc-wrapper {background-image:url(../img/bg-silc.jpg);background-size:cover;background-position:center;background-attachment:scroll;background-repeat:no-repeat;}
    a.go-down {display:none;}    
    .mobile-logo {display:block;}
    .mobile-logo svg {width:45%;max-width:180px; height:auto;fill:#FFF;margin:0px 0px 20px 0px;}
    .company-text {height:auto !important;min-height:auto !important;padding:15rem 0px;}
    .company-text .absolute {position:relative !important;height:auto !important;min-height:auto !important}
    .company-text h2 {display:none;}
    .company-text h5 {display:none;}
    .company-text p {color:#FFF;}
    a.link-site {color:#FFF !important;}
    a.link-site::after  {background:#FFF !important;}
    a.link-site::before {background:#FFF !important;}
    #contatti {height:100% !important;padding:40px 0px;}
    #contatti .min-vh-100 {height:auto !important;min-height:auto !important;}
    #map {margin:0px 0px 40px 0px;height:300px;}
    #footer-wrapper .space {width:40px;height:50px;}
    #footer-wrapper .svg-container, #footer-wrapper .svg-container svg {width:80px;height:50px;}
}
*/