@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@200;300;500;800&display=swap');
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
html {/* font-size: 62.5%*/ font-size: 10px }
body { font-family: 'Manrope', sans-serif; color: #111; font-weight: 500; background-color: #ddd;  }
.body { background-color: #fff; max-width: 300rem; margin: 0 auto; overflow: hidden; }
ul, li, h1, h2, h3, h4, h5, p { list-style: none; }
a { font-size: 1.6rem; text-decoration: none; color: #111; outline: none }
a:focus, input:focus, textarea:focus, select:focus {outline: none!important }
b { font-weight: 600!important; }
p { line-height: 1.4; font-size: 1.5rem;  }
.h3 { line-height: 1.8; font-size: 5rem;  }
.container { max-width: 164rem; margin: 0 auto; padding: 0; width: 100%; }
button { letter-spacing: 1px; cursor: pointer; background-color: transparent; border: none; font-family: 'Manrope', sans-serif; }
input, textarea, select { letter-spacing: 0.4px ; font-family: 'Manrope', sans-serif; }
.center { text-align: center; }
.clear { clear: both; }
.flex { display: flex; flex-wrap: wrap; }
.clearfix::after { content:""; display: table; clear: both; }
.upper { text-transform: uppercase; }
.fff {color: #fff}
.bggreen { background-color: #97C123 }
.green { color: #97C123 }
.bgfff { background-color: #fff; }
.bgred { background-color: #D9000D }
.red { color: #D9000D }
.gray { color: #999999 }
.bgeee { background-color: #eee }
.pr { position: relative; z-index: 1 }
.thin { font-weight: 200 }
.light { font-weight: 300 }
.semibold { font-weight: 500 }
.bold { font-weight: 700 }
.bggradient { background: rgb(179,200,43); background: linear-gradient(-90deg, rgba(179,200,43,1) 0%, rgba(150,193,35,1) 100%); }

::-moz-selection  {
background: rgba(151,193,35,0.5);
}
::selection   {
background: rgba(151,193,35,0.5);
}

/*TOP BUTTON*/
.div-back-to-top { max-width: 300rem; width: 100%; left: 0; right: 0; bottom: 0; margin: 0 auto; position: fixed;  }
.back-to-top { text-align: center; position: absolute; z-index: 200; bottom: 0.8rem; right: 0.5rem; display: inline-block; padding: 1.5rem 1.2rem 1.4rem; margin: 1em; background-color: #97C123; border-radius: 50%; }
.back-to-top img { width: 1.8rem; }
.back-to-top:hover {cursor: pointer; background-color: #111; }

.cta { font-size: 1.5rem; transition: 0.5s; text-align: center; padding: 1.2rem 1.5rem}
.cta:hover { box-shadow: 0 3px 20px rgba(0,0,0,0.17) }
.ctaa { font-size: 2rem; transition: 0.5s;}
.ctaa img { width: 7rem }
.trans { transition: 0.5s }

.shadow { box-shadow: 0 3px 20px rgba(0,0,0,0.17)}
.shadow2 {box-shadow: 0 5px 15px rgba(0,0,0,0.4);}
.t1 { font-size: 5rem; line-height: 1.2 }
.t2 { font-size: 2rem; line-height: 1.1 }
.t3 { font-size: 3rem; line-height: 1.2; letter-spacing: 1px }

::-webkit-input-placeholder { /* Edge */color: #aaa; font-style: italic; opacity: 1;}
:-ms-input-placeholder { /* Internet Explorer 10-11 */color: #aaa; font-style: italic; opacity: 1;}
::placeholder {color: #aaa; font-style: italic; opacity: 1;}
header { z-index: 1; padding: 5rem 0; position: absolute; top: 0; width: 100%; left: 0 }
header .header .logo { width: 15rem }
header .flex { justify-content: space-between; align-items: center; }
header .menu { display: flex; }
header .menu li { padding-left: 6rem; }
header .menu li a { color: #fff; font-size: 1.1rem; font-weight: 800; text-shadow: 0 0 5px rgba(0,0,0,0.2); }

.sticky { position: fixed; padding: 2rem 0; top: 0; width: 100%; max-width: 300rem; margin: 0 auto; right: 0; left: 0; z-index: 1; background-color: #222; box-shadow: 0 0 30px rgba(0,0,0,0.4)}
.hidden-sticky { height: 4rem; width: 100% }

.bgimg video { width: 100%; height: 100%; object-fit: cover; object-position: center; position: absolute; top: 0; left: 0; opacity: 0.8 }
.bgimg .img { width: 100%; height: 100%; object-fit: cover; object-position: center; position: absolute; top: 0; left: 0; opacity: 0.35 }
.bgimg .img.mobile { display: none; }
.bgimg { background-color: #000; position: relative; height: 100vh; min-height: 60rem; justify-content: center; align-items: center; }
.bgimg .txt { position: relative; justify-content: center; }
.bgimg .txt .title { justify-content: center; align-items: flex-end; font-size: 15rem; font-weight: 500 }
.bgimg .txt .squares { margin-right: 2.5rem; }
.bgimg .txt .title .squares { margin-left: 2rem }
.bgimg .txt .title .squares .sq { height: 1.8rem; width: 1.8rem; margin: -6.3rem 1px 0 1px }
.bgimg .txt .p .squares .sq { height: 7px; width: 7px; margin: -2.8rem 0 0 }
.bgimg .txt .p { align-items: flex-end; }
.bgimg .txt .p p { font-size: 7rem; font-weight: 300 }
.bgimg .go img { width: 1.8rem }
.bgimg .go { position: absolute; bottom: -2.5rem; left: 0; right: 0; margin: 0 auto; text-align: center; }

.s1 { padding: 14rem 0 }
.s1 .flex { justify-content: space-between; }
.s1 .flex .cl { width: 25%; margin: 14rem 0 0 }
.s1 .t1 { padding: 0 5% }
.s1 .flex .green { font-size: 3rem; margin-bottom: 4rem}
.s1 p { font-size: 4.2rem; letter-spacing: -1px; line-height: 1.2 }
.s2 { position: relative; min-height: 100vh }
.s2 .bggradient { position: relative; width: 55%; height: 70vh; }
.s2 .txt { position: absolute; transform: translate(-50%, -50%); left: 50%; top: 50%; width: 60% }
.s2 .txt p { font-size: 5.5rem; margin-bottom: 2rem }
.s2 .img { position: absolute; bottom: 0; right: 0; width: 53%; object-fit: cover; object-position: center;}
.s2.png { margin-top: 10rem }
.s2.png .img { position: absolute; bottom: 8rem; right: 0; width: 56%; object-fit: cover; object-position: center;}

.s2 .txt:hover img { padding-left: 2rem }
.s2 .txt img { transition: 0.5s }

.s3 { justify-content: space-between; padding: 15rem 6% 0; align-items: center; }
.s3 .img { width: 50% }
.s3 .txt { width: 40% }
.s3 .txt p { font-size: 2.3rem; line-height: 1.6; margin: 3rem 0 4.5rem; width: 45rem }
.s3.reverse { flex-direction: row-reverse; }

footer { border-top: 1px solid #111; padding: 6rem 0 5rem ; justify-content: space-between; align-items: flex-start;}
footer img { width: 13rem; margin-bottom: 2rem }
footer a { font-size: 1.2rem; margin-left: 5rem}

.credits { justify-content: space-between; }
.credits p, .credits a { font-size: 1.2rem; color: #aaa; padding-bottom: 2rem }

.menuresponsive, .searchimg2, #mySidenav, #mySidenav2 { display: none; }

.news { margin: 6rem 0; width: 100% }
#slide { width: 100%; position: relative; margin-top: 15rem; }
#slide .i360 { width: 6rem; position: absolute; bottom: 4rem; left: 0; right: 0; margin: 0 auto }
#slide .splide__arrow[disabled] { opacity: 1;}
#slide .splide__pagination { display: block!important; width: 100%!important }
#slide .splide__pagination__page { display: none; padding: 0;width: 8px;height: 8px;border-radius: 50%;background: #ddd;margin: 3rem 4px 0;cursor: pointer;display: block;}
#slide .splide__pagination__page:focus {outline: none;}
#slide .splide__pagination__page.is-active {background: #666;border: 1px solid #666;width: 9px;height: 9px;}
#slide .my-arrows {position: absolute; bottom: 4.3rem; max-width: 25rem; width: 100%; z-index: 1; margin: 0 auto; left: 0; right: 0;}
#slide .my-arrows button:focus {outline: none;}
#slide .my-prev { transform: rotate(180deg);}
#slide .my-next { margin-top: 0; padding: 0; position: absolute; right: 0; }
#slide .my-next svg { width: 100%}
#slide .my-next svg path {fill:#2b2d2d; cursor: pointer; width: 100%}
#slide .img { width: 100% }
#slide .splide__slide { display: inline-block; overflow: hidden; }
.splide__arrow { height: 3rem }

#workarea { width: 50%; position: relative; }
#workarea .i360 { width: 6rem; position: absolute; bottom: 4rem; left: 0; right: 0; margin: 0 auto }
#workarea .splide__arrow[disabled] { opacity: 1;}
#workarea .splide__pagination { display: block!important; width: 100%!important }
#workarea .splide__pagination__page { display: none; padding: 0;width: 8px;height: 8px;border-radius: 50%;background: #ddd;margin: 3rem 4px 0;cursor: pointer;display: block;}
#workarea .splide__pagination__page:focus {outline: none;}
#workarea .splide__pagination__page.is-active {background: #666;border: 1px solid #666;width: 9px;height: 9px;}
#workarea .my-arrows {position: absolute; bottom: 45%; width: 95%; z-index: 1; margin: 0 auto; left: 0; right: 0;}
#workarea .my-arrows button:focus {outline: none;}
#workarea .my-prev { transform: rotate(180deg);}
#workarea .my-next { margin-top: 0; padding: 0; position: absolute; right: 0; }
#workarea .my-next svg { width: 100%}
#workarea .my-next svg path, #workarea .my-prev svg path {fill:#97C123; cursor: pointer; width: 100%}
#workarea .img { width: 100% }
#workarea .splide__slide { display: inline-block; overflow: hidden; }

#cucina { width: 50%; position: relative; }
#cucina .i360 { width: 6rem; position: absolute; bottom: 4rem; left: 0; right: 0; margin: 0 auto }
#cucina .splide__arrow[disabled] { opacity: 1;}
#cucina .splide__pagination { display: block!important; width: 100%!important }
#cucina .splide__pagination__page { display: none; padding: 0;width: 8px;height: 8px;border-radius: 50%;background: #ddd;margin: 3rem 4px 0;cursor: pointer;display: block;}
#cucina .splide__pagination__page:focus {outline: none;}
#cucina .splide__pagination__page.is-active {background: #666;border: 1px solid #666;width: 9px;height: 9px;}
#cucina .my-arrows {position: absolute; bottom: 45%; width: 95%; z-index: 1; margin: 0 auto; left: 0; right: 0;}
#cucina .my-arrows button:focus {outline: none;}
#cucina .my-prev { transform: rotate(180deg);}
#cucina .my-next { margin-top: 0; padding: 0; position: absolute; right: 0; }
#cucina .my-next svg { width: 100%}
#cucina .my-next svg path, #cucina .my-prev svg path {fill:#97C123; cursor: pointer; width: 100%}
#cucina .img { width: 100% }
#cucina .splide__slide { display: inline-block; overflow: hidden; }

#thinkarea { width: 50%; position: relative; }
#thinkarea .i360 { width: 6rem; position: absolute; bottom: 4rem; left: 0; right: 0; margin: 0 auto }
#thinkarea .splide__arrow[disabled] { opacity: 1;}
#thinkarea .splide__pagination { display: block!important; width: 100%!important }
#thinkarea .splide__pagination__page { display: none; padding: 0;width: 8px;height: 8px;border-radius: 50%;background: #ddd;margin: 3rem 4px 0;cursor: pointer;display: block;}
#thinkarea .splide__pagination__page:focus {outline: none;}
#thinkarea .splide__pagination__page.is-active {background: #666;border: 1px solid #666;width: 9px;height: 9px;}
#thinkarea .my-arrows {position: absolute; bottom: 45%; width: 95%; z-index: 1; margin: 0 auto; left: 0; right: 0;}
#thinkarea .my-arrows button:focus {outline: none;}
#thinkarea .my-prev { transform: rotate(180deg);}
#thinkarea .my-next { margin-top: 0; padding: 0; position: absolute; right: 0; }
#thinkarea .my-next svg { width: 100%}
#thinkarea .my-next svg path, #thinkarea .my-prev svg path {fill:#97C123; cursor: pointer; width: 100%}
#thinkarea .img { width: 100% }
#thinkarea .splide__slide { display: inline-block; overflow: hidden; }

.videoanimation { width: 100%; margin-top: 10rem }

.formprodotto { justify-content: space-between; padding: 8rem 20% }
.formprodotto form input, .formprodotto form textarea { font-size: 1.4rem; width: 100%; background-color: transparent; padding: 0 0 2rem; margin-bottom: 2rem; border:0; border-bottom: 2px solid #999; color: #eee }
.formprodotto .txt { width: 49%; text-align: right; padding: 0 10% 0 0% }
.formprodotto .txt .title { font-size: 3rem; margin-bottom: 2rem }
.formprodotto form { width: 49% }
.formprodotto ::-webkit-input-placeholder { /* Edge */color: #aaa; font-style: normal; opacity: 1;}
.formprodotto :-ms-input-placeholder { /* Internet Explorer 10-11 */color: #aaa; font-style: normal; opacity: 1;}
.formprodotto ::placeholder {color: #aaa; font-style: normal; opacity: 1;}
.formprodotto .ctab { font-size: 1.5rem }

/*pages*/
header.headerpage { position: relative; z-index: 2; }
header.headerpage .menu li a { color: #111; text-shadow: none }
header.headerpage .menu li a.cta { color: #fff }
header.headerpage .sticky { background-color: #fff }
.txtmain { padding: 0 5%; margin-top: 15rem }
.t11 { font-size: 12rem; line-height: 1; padding-bottom: 3rem;}
.t11 span { display: block; }
.txtsmall { width: 90%; max-width: 70rem; margin: 10rem auto 15rem }
.txtsmall p { font-size: 1.8rem; margin-top: 1.5rem }
.txtsmall .faq { margin: 8rem 0 }
.t22 { font-size: 7rem; margin: 5rem 0 }
.t23 { font-size: 6rem; margin: 0; color: 000 }
.page .s3 { margin: 0 }
.scopri { padding: 4rem 0; margin: 0 0 10rem }
.scopri .container { padding: 0 5% }
.scopri p { letter-spacing: 1px; margin-bottom: 2rem }
.scopri img { transition: 0.5s }
.scopri:hover img { margin-left: 2rem }
.attrezzature { margin: 15rem 5% }
.attrezzature .row { padding: 3rem 1rem; align-items: center; border-bottom: 1px solid #97C123 }
.attrezzature .t1 {font-size: 4rem}
.attrezzature .row .bl { border-right: 1px solid #97C123; padding-right: 4rem; margin-right: 3.33%; justify-content: space-between; align-items: center; width: 30% }
.attrezzature .row .bl:last-child { border-right: 0 }
.attrezzature .row:last-child { border-bottom: 0 }
.attrezzature .row .bl img { width: 50%; }
.attrezzature .row .bl p { font-size: 1.8rem; width: 48% }
.attrezzature .linegreen { height: 1px; background-color: #97C123; width: 100%; margin: 2rem 0 }
.attrezzature .row .bl.nl { border-right: none; padding-right: 0 }
.attrezzature .row .bl.nl img { width: 46% }
.attrezzature { position: relative; }
.scarica p { font-size: 2rem }
.scarica img { width: 6.3rem }
.scarica { position: absolute; right: 0; top: 0.5rem }
.scarica:hover img { margin-left: 5px }

.contatti { margin: 12rem 0 0 0 }
.contatti .row { padding: 3rem 0rem; align-items: center; border-bottom: 0px solid #fff }
.contatti .t1 {font-size: 3.5rem}
.contatti .row .bl { border-right: 1px solid #fff; padding-right: 1rem; margin-right: -5%; justify-content: space-between; align-items: left; width: 33% }
.contatti .row .bl:last-child { border-right: 0 }
.contatti .row:last-child { border-bottom: 0 }
.contatti .row .bl img { width: 45%; }
.contatti .row .bl p { font-size: 1.4rem; width: 48% }
.contatti .linegreen { height: 1px; background-color: #97C123; width: 100%; margin: 2rem 0 }
.contatti .row .bl.nl { border-right: none; padding-right: 0 }
.contatti .row .bl.nl img { width: 46% }
.contatti { position: relative; }

#mySidenav2 { display: block; z-index: 1000;}
.page .sidenav { height: 100%; width: 0; position: fixed; z-index:1; top: 0; right: 0; overflow-x: hidden; transition: 0.5s; }
.page .sidenav a {}
.page .sidenav .closebtn { width: 3rem; opacity: 1; position: absolute; top: 3rem; right: 0; left: 0; margin: 0 auto; text-align: center;}
.page .sidenav .flexnav { background-color: rgba(0,0,0,0.95); width: 100%; text-align: center; }
.page .sidenav .flexnav .bg { margin: 0 auto; padding: 10rem 0; width: 90%; min-height: 100vh; height: 100%; }
.page .sidenav .flexnav .bg .divblock { color: #fcfcf5; display: block; padding: 2rem 0; font-weight: lighter; }
.page .sidenav .flexnav a { font-size: 1.6rem!important; font-weight: bold; text-transform: uppercase; display: block; margin: 4rem; color: #fff }
.page .sidenav .flexnav .logo { margin: 0 0 2rem }

.txtmain { position: relative; }
.txtmain .newp {font-size: 1.8rem;
line-height: 1.6;
margin: 3rem 0 4.5rem;
max-width: 100rem; width: 100%;}
.openform {position: absolute; right: 0; top: 30%}
.openform img { width: 22rem; }
.t4 { font-size: 3rem } 
.txtmain .t11a { font-size: 10rem; display: block; margin-bottom: 2.5rem;}
.flexcontatti { padding: 15rem 5%; justify-content: space-between; }
.flexcontatti .cl { width: 50% }
.flexcontatti .cl p { font-size: 5rem }
.flexcontatti .cl .txt { margin-top: 7rem }
.flexcontatti .cl .txt .t1 { margin-bottom: 5px }

.form ::-webkit-input-placeholder { /* Edge */color: #fff; font-style: normal; opacity: 0.7;}
.form :-ms-input-placeholder { /* Internet Explorer 10-11 */color: #fff; font-style: normal; opacity: 0.7;}
.form ::placeholder {color: #fff; font-style: normal; opacity: 0.7;}
.form input, .form textarea { width: 100%; margin: 2rem 0; padding: 1rem 0; background-color: transparent; color: #fff; font-size: 1.8rem; font-family: 'Manrope', sans-serif; border:none; border-bottom: 1px solid #fff }
.form {max-width: 80rem; width: 100%; margin: 0 auto }
.form p { color: #fff; font-size: 2rem; margin: 2rem 0; }
.form button { margin-top: 6rem }

#calendar {max-width: 1100px; width: 100%; font-size: 1.5rem; margin: 15rem auto 0; font-family: 'Manrope', sans-serif!important; }
#calendar th { border:0; }
#calendar .fc-scrollgrid, .fc-theme-standard td, .fc-theme-standard th { border:0!important; }
.fc-direction-ltr .fc-daygrid-week-number { display: none; }
.fc .fc-daygrid-day-top { justify-content: center; }
.fc .fc-toolbar-title { font-size: 7rem!important; margin-left: -4rem!important; color: #97C123; margin-bottom: 2rem!important; text-transform: uppercase; }
.fc .fc-col-header-cell-cushion { font-size: 3rem; font-weight: 300; padding-bottom: 4rem }
.fc .fc-daygrid-day-number { font-size: 5rem; font-weight: 600 }
.fc-header-toolbar { font-size: 1.2rem; border-bottom: 1px solid #555 }
.fc-event-title-container, .fc-daygrid-day-bottom { text-align: center; }

.ricorda .scarica { position: relative; }
.ricorda { justify-content: space-between; padding: 8rem 0; max-width: 110rem; margin: 1rem auto; border-top: 1px solid #555 }
.ricorda .ric { position: relative; max-width: 45rem; padding: 4.5rem; border:1px solid #97c123; }
.ricorda .ric p { font-size: 2.4rem }
.ricorda .ric .title { font-size: 2rem; margin-bottom: 2rem }
.ricorda .ric img { width: 7rem; position: absolute; top: -4rem; left:-3.5rem }

.error .t11 { font-size:20rem}
.error .cta { margin-top: 8rem; display: inline-block; }
.error .txtsmall .faq { padding: 0rem 0; margin-top: 6rem }
.error .txtsmall { margin-top: 1rem }

.pwap { color: #888; font-size: 3rem; margin-top: 7rem; line-height: 1.2 }
.wap { color: #888 }
.wap img { width: 4.1rem;
vertical-align: middle;
margin-right: 1rem;
margin-top: -6px; }

/*landing*/
.landing .txtmain { margin-bottom: 7rem }
.landing .tlanding { font-size: 7rem;}
.landing .slanding { padding: 8rem 6.5% }
.landing .slanding .flex { justify-content: space-between; align-items: center; }
.landing .slanding .flex img { width: 50% }
.landing .slanding .flex .txt { width: 45% }
.landing .slanding .flex .txt p { font-size: 2rem;line-height: 1.6;margin: 3rem 0 4.5rem;max-width: 45rem; width: 90% }
.landing .slanding .flex .txt a { font-size: 2rem;line-height: 1.6; font-weight: bold; text-decoration: underline; }
.landing .slanding .txt2 { background-color: rgba(255,255,255,0.3); margin-top: 7rem; padding: 5% }
.landing .slanding .txt2 p { font-size: 3rem; margin-bottom: 4rem }
.landing .slanding .txt2 li { margin: 4rem 0; justify-content: space-between; align-items: flex-start; font-size: 1.8rem }
.landing .slanding .txt2 li span { width: 89%; text-align: left; }
.landing .slanding .txt2 li span.n { margin-top: -11px; width: 10%; text-align: right; font-size: 5rem; font-weight: bold; }
.landing .slanding .txt2 p.psmall { font-size: 2rem; margin-bottom: 0 }
.landing .slanding .txt2 p.psmall a { font-size: 2rem; font-weight: bold; text-decoration: underline; }
.landing .slanding .txt2 .list li { margin: 1rem 0; font-size: 2.5rem }
.landing .slanding .txt2 .list { margin-bottom: 5rem }

/*style check box*/
.containercheck { text-align: left;
  margin-top: 3rem; font-size: 1.4rem;
  display: block;
  position: relative;
  padding-left: 3rem;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default checkbox */
.containercheck input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom checkbox */
.checkmark {
  position: absolute;
  top: -1px;
  left: 0;
  height: 2rem;
  width: 2rem;
  background-color: #eee;
  border-radius: 0rem;
}

/* On mouse-over, add a grey background color */
.containercheck:hover input ~ .checkmark {
  background-color: #ccc;
}

/* When the checkbox is checked, add a blue background */
.containercheck input:checked ~ .checkmark {
  background-color: #97C123;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.containercheck input:checked ~ .checkmark:after {
  display: block;
}

/* Style the checkmark/indicator */
.containercheck .checkmark:after {
  left: 0.6rem;
  top: 0.2rem;
  width: 0.5rem;
  height: 1rem;
  border: solid white;
  border-width: 0 0.3rem 0.3rem 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

@media (max-width: 1500px) {
header { padding: 4rem 0 }
.s2 .txt { width: 60rem }
.txtmain .t11a { font-size: 6.5vw }
}

@media (max-width: 1200px) {
.t11 { font-size: 9vw }
.faqq .t11 { font-size: 10rem }
}

@media (max-width: 1024px) {
html { font-size: 9px }
header { padding: 2rem 0 }
header .menu { display: none; }
.menuresponsive { display: block; z-index:2; position: fixed; top: 3.5rem; right: 2rem; font-size: 1.4rem }
/*sidenav*/
.menuresponsive { width: 4rem; background-image: url(../img/menu.svg); height: 3rem; background-size: contain; background-repeat: no-repeat; }
header.headerpage .menuresponsive { background-image: url(../img/menu0.svg); }
#mySidenav { display: block; z-index: 1000;}
.sidenav { height: 100%; width: 0; position: fixed; z-index:1; top: 0; right: 0; overflow-x: hidden; transition: 0.5s; }
.sidenav a {}
.sidenav .closebtn { width: 3rem; opacity: 1; position: absolute; top: 3rem; right: 2.5rem; margin: 0 auto; text-align: center;}
.sidenav .flexnav { background-color: rgba(0,0,0,0.8); width: 100%; text-align: center; }
.sidenav .flexnav .bg { margin: 0 auto; padding: 10rem 0; wrdth: 90%; min-height: 100vh; height: 100%; }
.sidenav .flexnav .bg .divblock { color: #fcfcf5; display: block; padding: 2rem 0; font-weight: lighter; }
.sidenav .flexnav a { font-size: 1.6rem!important; font-weight: bold; text-transform: uppercase; display: block; margin: 4rem; color: #fff }
.sidenav .flexnav .logo { margin: 0 0 2rem }

.bgimg .txt .p .squares .sq { display: none; }
.bgimg .txt .title { flex-direction: column; align-items: center; justify-content: center; }
.bgimg .txt .title .squares .sq { margin: 2rem 1px 2.5rem; width: 2vw; height: 2vw}
.bgimg .txt .p { display: block; }
.bgimg .txt .title { font-size: 15vw; }
.bgimg .txt .p p { font-size: 6vw }

.s1 .flex { flex-direction: column; text-align: left; }
.s1 .flex .cl { width: 50rem; max-width: 90%; margin: 9rem auto 0 }

.s2 .bggradient { width: 100% }
.s2 .txt { width: 50rem }
.s2 .img { width: 100%; position: relative; }
.s3 { padding: 14rem 0 0 }
.s3 .txt { width: 45% }
.s3 .txt p { width: 90% }

.txtmain { text-align: left; margin-left: 2rem; margin-right: 1rem; }
.attrezzature { margin: 10rem 0 }
.attrezzature .row .bl { padding-right: 1rem; margin-right: 2%; width: 31.33% }
.ricorda .ric { margin-left: 3rem }
}

@media (max-width: 900px) {
.fc .fc-toolbar-title { margin-bottom: 0rem!important; padding-top: 0; margin-top: -1.6rem!important }
.fc .fc-col-header-cell-cushion { font-size: 1.5rem;}
.fc .fc-daygrid-day-number { font-size: 3rem; padding: 3rem 0;}
.fc-daygrid-day { padding-bottom: 4rem!important }
.fc .fc-toolbar { flex-direction: column; justify-content: center; padding-bottom: 3rem; }
.hidden-sticky { height: 6rem }
#calendar { background-color: #eee; padding: 5rem 0; margin: 8rem 0 }
}

@media (max-width: 768px) {
.s3 { flex-direction: column-reverse; }
.s3 .txt { text-align: left; padding-left: 2rem; width: 100%; margin-bottom: 5rem }
.s3 .txt p { margin: 3rem 0 4rem 0 }
.s3 .img { width: 90%; max-width: 60rem }
.txtmain { text-align: left; margin-left: 2rem; margin-right: 1rem; }
.t22 { font-size: 7vw; margin: 3rem 0 }
.t23 { font-size: 7vw; margin: 3rem 0 }     
.s3.reverse { flex-direction: column-reverse; }
.page .s3 { padding: 8rem 0 }
#slide { margin-top: 0; margin-bottom: 10rem }
.attrezzature .t1 { text-align: center; }
.attrezzature .row .bl { border: none; margin: 1.5rem 0; padding: 1.5rem 0; border-bottom: 1px solid #97C123; width: 48%; padding-right: 0!important; margin-right: 0!important }
.attrezzature .row .bl img { width:50%!important }
.attrezzature .row { justify-content: space-between; }
.attrezzature .linegreen { display: none; }
.scopri { text-align: center; }
.openform { position: relative; margin-top: 5rem; display: block; }
.flexcontatti .cl p { font-size: 4rem }
#slide .i360 { bottom: -8rem }
#slide .my-arrows { bottom: -8rem }
.splide__arrow { height: 3.5rem }
.bgimg .img { display: none; }
.bgimg .img.mobile { display: block!important; filter: saturate(0); }
.videoanimation {margin-top: 5rem}
#workarea { width: 90% }
#workarea img { width: 100%; max-width: 100% }
#cucina { width: 90% }
#cucina img { width: 100%; max-width: 100% }
#thinkarea { width: 90% }
#thinkarea img { width: 100%; max-width: 100% }
.landing .tlanding { font-size: 7vw; line-height: 1.2; padding: 4rem 1rem 0 }
.landing .slanding .sl.flex { flex-direction: column-reverse; }
.landing .slanding .sl.flex img { width: 100% }
.landing .slanding .sl.flex .txt { width: 100%; text-align: center; }
.landing .slanding .sl.flex .txt p { max-width: 100%; width: 100% }
.landing .slanding .txt2 li span.n { font-size: 3rem }
.landing .slanding .txt2 p { font-size: 2.4rem }
.landing .slanding .txt2 { padding: 8% }
}


@media (max-width: 600px) {
.bgimg .txt .p p { font-size: 8vw }
.t1 { font-size: 4rem }
.s1 p { font-size: 3.2rem }
.s2 .txt { width: 100%; text-align: center; }
.s2 .txt p { font-size: 8vw }
.s2 .txt img { width: 50% }
.s2 .bggradient { height: 50vh }
.s2 { height: auto; min-height: auto }
footer { flex-direction: column; justify-content: center; align-items: center; text-align: center; }
footer p { margin-top: 5rem }
footer a { margin: 0 2rem }
.credits { text-align: center; }
.s2 .txt:hover img { margin-left: 0 }
header .logo { margin: 5px 1rem 0 }
.bgimg .img { height: 100% }
.bgimg { height: 80vh }
.scopri .t1 { font-size: 3rem }
.attrezzature .t1 { font-size: 3rem }
.scarica { margin: 0 10%; width: 80%; padding: 1rem; display: inline-block; margin-bottom: 6rem; position: relative; text-align: center; background-color: #97C123; }
.scarica p { color: #fff }
.scarica img { display: none; }
.flexcontatti .cl { width: 100%; text-align: center; margin: 5rem 0; }
.flexcontatti { padding: 4rem 0 }
.flexcontatti .cl .txt { margin-top: 3rem }
.txtmain .t4 { margin-bottom: 4rem; text-align: left; margin-left: 2rem; margin-right: 1rem; }
.flexcontatti .cl p { font-size: 3.3rem }
.ricorda { display: block; text-align: center; margin-bottom: 0; padding-bottom: 0 }
.ricorda .ric { margin: 0 auto 5rem; max-width: 45rem; width: 80%}
.pwap { font-size: 1.8rem; margin-bottom: 1rem }
.wap { margin-top: 1rem; display: block; }
.wap img { width: 3rem; margin-top: -2.7px; margin-right: 3px }
footer a { display: block; margin: 5px 0; text-align: center; }
}

@media (max-width: 400px) {
.attrezzature .row .bl { width: 100%!important }
}

.bounce {-webkit-animation: bounce 2s;animation: bounce 2s;-webkit-animation-iteration-count: infinite;animation-iteration-count: infinite;}

@-webkit-keyframes bounce {
  0%,
  25%,
  50%,
  75%,
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  40% {
    -webkit-transform: translateY(-20px);
            transform: translateY(-20px);
  }
  60% {
    -webkit-transform: translateY(-12px);
            transform: translateY(-12px);
  }
}

@keyframes bounce {
  0%,
  25%,
  50%,
  75%,
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  40% {
    -webkit-transform: translateY(-20px);
            transform: translateY(-20px);
  }
  60% {
    -webkit-transform: translateY(-12px);
            transform: translateY(-12px);
  }
}

mark {
  background-color: #97c123;
  color: #000000;
}
