/* RESET */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;font:inherit;vertical-align:baseline}
*{box-sizing:border-box}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}
body{line-height:1}
ol,ul{list-style:none}
blockquote,q{quotes:none}
blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}
ins{text-decoration:none}
del{text-decoration:line-through}
table{border-collapse:collapse;border-spacing:0}
a{text-decoration:none;transition:all .25s ease;color:#292929;}
a:hover{color:#1677a0;}
img{display:block;max-width:100%;height:auto}
strong{font-weight:700}
button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}
button{overflow:visible}
button,select{text-transform:none}
button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer}
button[disabled],html input[disabled]{cursor:default}
button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}
input,textarea{line-height:normal;padding:0;margin:0;outline:0;border:0;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0}
input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button{height:auto}
input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}
input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}
* html .clearfix{height:1%; overflow:visible;}
*+html .clearfix{min-height:1%;}
.clearfix:after{clear:both; content:"."; display:block; height:0; visibility:hidden; font-size:0;}
.clear{clear:both;}
/* FINE RESET */

/* FONT */
@font-face{font-family:'eurostile'; src: url('font/eurostile-webfont.eot'); src: url('font/eurostile-webfont.eot?#iefix') format('embedded-opentype'), url('font/eurostile-webfont.woff2') format('woff2'), url('font/eurostile-webfont.woff') format('woff'), url('font/eurostile-webfont.svg#eurostileregular') format('svg'); font-weight: normal; font-style: normal;}
@font-face{font-family:'novecento'; src: url('font/novecentosanscondensed-book-webfont.eot'); src: url('font/novecentosanscondensed-book-webfont.eot?#iefix') format('embedded-opentype'), url('font/novecentosanscondensed-book-webfont.woff2') format('woff2'), url('font/novecentosanscondensed-book-webfont.woff') format('woff'), url('font/novecentosanscondensed-book-webfont.svg#novecento_sans_condensedbook') format('svg'); font-weight: normal; font-style: normal;}
/* FINE FONT */

body{
  font:22px/30px 'Roboto', sans-serif;
  color: #292929;
  text-rendering: auto;
}
body.home{
  background: url(../images/bkg-linee.jpg) top center no-repeat;
  background-size: 100% auto;
}
main{
  overflow: hidden;
}
h1{
  font: 80px/95px 'eurostile' , sans-serif;
}
h2{
  font: 65px/75px 'eurostile' , sans-serif;
}
h3{
  font: 55px/65px 'eurostile', sans-serif;
}
h4{
  font-family:'eurostile', sans-serif;
  font-size: 32px;
  line-height: 40px;
  margin-top: 20px
}

p{font-weight: 300}
p.txt-curiosita{font-size: 18px; line-height: 24px}
.btn{
  display: inline-block;
  padding: 20px 60px;
  margin-top: 40px;
  font: 30px/30px 'novecento', sans-serif;
  text-transform: uppercase;
  background: #292929;
  color: #fff;
  box-shadow: 0 0 20px rgba(0, 0, 0, .1);
  transition:all .25s ease;
}
.btn:hover{
  background: #1677a0;
  color: #fff;
}
.btn.btn-gallery{
  margin-top: 10px
}

header{
  height: 180px;
  width: 100%;
  position: absolute;
  z-index: 10;
  top: 0;
  left: 0;
  padding: 0 20px;
  background: white;
  background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,0.5) 65%,  rgba(255,255,255,0) 100%);
  background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,0.5) 65%, rgba(255,255,255,0) 100%);
  background: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(255,255,255,0.5) 65%, rgba(255,255,255,0) 100%);
}
header #logo{
  height: 85px;
  width: auto;
  float: left;
  position: relative;
  top: 35px;
}
header .header__menu{
  float: right;
  margin-top: 30px;
}
header .header__menu li{
  float: left;
  margin-right: 20px;
  font: 28px/34px 'novecento' , sans-serif;
  text-transform: uppercase;
}
header .header__menu li.current_page_item a{
  color: #1677a0;
}

header .mobile{
  width: 100%;
  height: 100%;
  display: none;
  position: fixed;
  overflow: hidden;
  top: 0;
  left: 0;
  background: rgba(255, 255, 255, 0.5);
  transition:all .25s ease;
}
header .mobile.open{display: block;}
header ul.header__mobile{
  width: 300px;
  height: 100%;
  position: absolute;
  right: -320px;
  background: #292929;
  padding: 50px;
  transition:all .4s ease;
}
header ul.header__mobile.open{right: 0;}
header ul.header__mobile li{
  margin: 5px 0;
  font: 30px/38px 'novecento' , sans-serif;
  text-transform: uppercase;
}
header ul.header__mobile li a{
  color: #fff;
}
header .menu-toggle {
  width: 40px;
  height: 30px;
  position: absolute;
  top: 35px;
  right: 20px;
  cursor: pointer;
  z-index: 200;
  display: none;
}
header .menu-toggle.on .one {
  -moz-transform: rotate(45deg) translate(7px, 7px);
  -ms-transform: rotate(45deg) translate(7px, 7px);
  -webkit-transform: rotate(45deg) translate(7px, 7px);
  transform: rotate(45deg) translate(7px, 7px);
  background: #fff;
}
header .menu-toggle.on .two {
  opacity: 0;
}
header .menu-toggle.on .three {
  -moz-transform: rotate(-45deg) translate(8px, -10px);
  -ms-transform: rotate(-45deg) translate(8px, -10px);
  -webkit-transform: rotate(-45deg) translate(8px, -10px);
  transform: rotate(-45deg) translate(8px, -10px);
  background: #fff;
}
header .one,
header .two,
header .three {
  width: 100%;
  height: 5px;
  background: #292929;
  margin: 6px auto;
  backface-visibility: hidden;
  -moz-transition-duration: 0.3s;
  -o-transition-duration: 0.3s;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
}

footer{
  margin-top: 60px;
  padding: 80px 7% 20px;
  background: #292929;
  color: #fff;
  font-weight: 300;
}
footer p,
footer .col-footer li{
  font-size: 18px;
  line-height: 24px;
  color: #fff;
}
footer .logo-footer{margin-bottom: 30px}
footer .col-footer{
  float: left;
  width: 25%;
  padding-left: 30px;
}
footer .footer-big{
  width: 50%;
  padding-left:0;
}
footer .col-footer li a,
footer .col-footer p a{
  color: #fff;
  text-transform:uppercase;
}
footer .custom-html-widget{margin-top: 33px}
footer .custom-html-widget img{
  display:inline-block;
  margin-right: 10px;
}

footer .credits{
	float:left;
	width:100%;
	text-align:center;
	padding: 10px;
	margin-top: 50px;
	font-size: 15px;
}

footer .credits a{
	color:#1677a0;
}

.fullscreen{
  height: 100vh;
  min-height: 480px;
  position: relative;
}
.fullscreen .background_image{
  position: relative;
  height: 100%;
  width: 100%;
  background-size: cover;
  background-position: center;
}
.diventa-rivenditore .fullscreen .background_image{background-position: center bottom;}
.fullscreen .scroll_down{
  position: absolute;
  bottom: 25px;
  left: 7%;
  margin-left: -17px;
  width: 110px;
  padding-top: 28px;
  padding-left: 35px;
  height: 117px;
  z-index: 10;
  font:30px/30px 'novecento', sans-serif;
}
.fullscreen .scroll_down .linea{
  height: 100%;
  position: absolute;
  top: 0;
  left: 13px;
  margin: 0;
}
.fullscreen .scroll_down .circle{
  background: #292929;
  height: 28px;
  width: 28px;
  border-radius: 28px;
  position: absolute;
  left: 0;
  bottom: 85px;
  -webkit-animation: bounce 3s ease infinite;
	-moz-animation: bounce 3s ease infinite;
	-o-animation: bounce 3s ease infinite;
	animation: bounce 3s ease infinite;
}
@keyframes bounce {
  0% { bottom: 85px }
  70% { bottom: 0px }
  100% { bottom: 85px }
}

.slide_home .background_image{
  width: 50%;
}
.slide_home .claim{
  position: absolute;
  padding-left: 20px;
  width: 50%;
  top: 50%;
  transform: translateY(-50%);
  right: 0%;
  font: 98px/110px 'eurostile', sans-serif;
}

.linea{
  display: block;
  width: 2px;
  background: #292929;
  height: 145px;
  margin: 50px auto;
}

.standard-text{padding: 0 7%;}
.standard-text.standard-home{padding-bottom: 100px;}
.standard-text h2{margin-bottom:25px}
.standard-text p{margin-bottom:15px;}
.standard-text p:last-child{margin-bottom: 0}
.standard-text .social img{
  display: inline-block;
  margin-right: 10px;
}

.installazioni .btn{display: none}
.installazioni .btn-gallery{display: inline-block; margin-top: 20px}
.installazioni .selezione_kokedama .text h2{display: none}

.blocco_nero{
  padding: 125px 20% 125px 7%;
  margin-bottom: 140px;
  background: #292929 url(../images/bkg-black.jpg) center right no-repeat;
  background-size: auto 100%;
  color: #fff
}
.blocco_nero h2{
  margin-bottom: 10px;
}
.blocco_nero p{
  width: 75%
}

.selezione_fogliein{
  padding: 0 7%;
}
.selezione_fogliein h2{
  margin-bottom: 15px;
}
.selezione_fogliein img{
  box-shadow: 0 0 20px rgba(0, 0, 0, .2);
  max-width: 100%;
  height: auto;
}
.selezione_fogliein img.img_selezione{
  position: relative;
}
.selezione_fogliein .float_left{
  float: left;
  width: 50%;
  position: relative;
  z-index: 1;
}
.selezione_fogliein .float_right{
  float: right;
  width: 50%
}
.selezione_fogliein .block_text{
  margin-top: 60px;
}
.selezione_fogliein img.img1{
  top: -200px;
  margin-bottom:-200px;
  left: 3%;
  max-width: 90%;
}
.selezione_fogliein img.img2{
  max-width: none;
  width: auto;
  margin-top:100px;
  left: -17%
}
.selezione_fogliein img.img3{
  margin-top:65px;
}

.selezione_kokedama{
  padding-left: 7%;
  position: relative;
}
.selezione_kokedama article{
    margin-bottom: 60px;
    position: relative;
}
.selezione_kokedama .text{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 40%;
  z-index: 2;
}
.selezione_kokedama img{
  float: right;
  box-shadow: 0 0 20px rgba(0, 0, 0, .2);
  max-width: 1000px;
}

.list-2 li{
  width: 80%;
  /*float: left;*/
  margin: 0 auto 2%
}
.list-2 li .img-kokedama{
  width: 48%;
  height: auto;
  float: left;
}
.list-2 li .text-trattamento{
  width: 48%;
  float: right;
  padding: 25px 25px 25px 0;
}
.list-2 li .icon{
  margin: 0 0 10px;
  display:block;
  vertical-align: top;
}
.list-2 li .icon img,
.list-2 li .icon svg{
  display: inline-block;
  margin-right: 5px;
  vertical-align: middle;
  height: 60px;
  width: auto;
}
.list-2 li .icon p{
  font-size: 20px;
  line-height: 26px;
  margin-top: 10px;
}

.list-3 li{
 float: left;
 width: 32%;
 margin-bottom:2%;
 position: relative;
}
.list-3 li:nth-child(3n+2){
  margin-left:2%;
  margin-right:2%;
}
.list-3 li h3{
  position: absolute;
  width: 100%;
  bottom: 0;
  left: 0;
  text-align: center;
  word-break: break-all;
  padding: 25px 15px;
  background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,0.8) 100%);
  background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,0.8) 100%);
  background: linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(255,255,255,0.8) 100%);
}
.list-3 li img{
  width: 100%;
  height: auto;
}

/*.list-4{padding: 0 1%}*/
.list-4 li{
 float: left;
 width: 23%;
 position: relative;
 margin:2% 1%
}
.list-4 li h3{
  position: absolute;
  width: 100%;
  bottom: 0;
  left: 0;
  text-align: center;
  word-break: break-all;
  padding: 25px 15px;
  background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,0.8) 100%);
  background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,0.8) 100%);
  background: linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(255,255,255,0.8) 100%);
}
.list-4 li img{
  width: 100%;
  height: auto;
  transition:all .25s ease;
}
.list-4 li img.filter{
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%);
}
.list-4 li:hover img.filter{
  -webkit-filter: grayscale(0%);
  filter: grayscale(0%);
}

.trattamento h2.standard-text{}
.punti-vendita .trattamento .list-4{padding: 0 7%; margin-bottom: 30px}
.punti-vendita .trattamento .list-4 li{margin: 0 0 10px 0; padding: 0 1% 0 0; width: 33%;}

@media screen and (max-width: 1024px){
	.punti-vendita .trattamento .list-4 li{margin: 0 0 10px 0; padding: 0 1% 10px 0; width: 33%;}
}

@media screen and (min-width: 1920px){
	.punti-vendita .trattamento .list-4 li{margin: 0 0 10px 0; padding: 0 1% 10px 0; width: 20%;}
}

.cont-float .text-left{width: 48%; float:left;}
.cont-float .text-right{width: 48%; float:right;}

input[type="text"],
input[type="email"],
input[type="submit"]{
  width: 100%;
  height: 50px;
  border:1px solid #292929;
  color: #292929;
  margin-bottom: 20px;
  padding: 0 20px
}
textarea{
  width: 100%;
  height: 300px;
  padding: 20px;
  border:1px solid #292929;
  color: #292929;
  resize: none;
  margin-bottom: 20px;
}
input[type="submit"]{
  background: #292929;
  border: 0;
  color: #fff;
  text-align: center;
  text-transform: uppercase;
  color: #DDDDDD;
  transition:all .25s ease;
}
input[type="submit"]:hover{background:#1677a0;}

::-webkit-input-placeholder{color: #292929;}
::-moz-placeholder{color:#292929;}
:-ms-input-placeholder{color: #292929;}
:-moz-placeholder {color: #292929;}

.g-recaptcha{margin-bottom: 20px}
.accettazione{margin-bottom: 20px; font-size: 14px}
.accettazione span.wpcf7-list-item{margin: 0}


#post-404{
  padding-top: 200px;
  padding-bottom: 200px;
}

.social a{
 display: inline-block;
 width: 50px;
 height: 50px;
 text-align: center;
 line-height: 50px;
 font-size: 26px;
 border-radius: 100%;
 border: 3px solid #000;
 margin-right: 3px;
 box-sizing: content-box;
}

footer .social a{
  color: #fff;
  border-color: #fff;
}

.social a:hover,
footer .social a:hover{
  border-color: #1677a0;
  background: #1677a0;
  color: #fff;
}


.fancybox-navigation .fancybox-button{
  opacity: 1 !important;
  visibility: visible !important;
  background: #1677a0;
  width: 50px;
  height: 50px;
}

.fancybox-toolbar{
  opacity: 1 !important;
  visibility: visible !important;
}

.fancybox-toolbar .fancybox-button{
  background: #1677a0;
  width: 50px;
  height: 50px;
}

.cookie-law-cont .ctcc-left-side{font-size: 14px; line-height: 18px;}
.cookie-law-cont button#catapultCookie{font-size: 20px; padding: 6px 20px;}

@media screen and ( max-width:1280px ){
  header #logo{float: none;}
  header .header__menu{display: none;}
  header .menu-toggle{display: block;}

  .selezione_fogliein img.img2{width: 110%}
  .selezione_kokedama .text{left: -5%;}
  .list-2 li{width: 100%}
}

@media screen and ( max-width:1024px ){
  h1{
    font-size: 70px;
    line-height: 80px;
  }
  h2{
    font-size: 55px;
    line-height: 65px;
  }
  h3{
    font-size: 45px;
    line-height: 55px;
  }

  footer .col-footer{width: 50%; margin-top:30px; padding-left:0; padding-right:30px}
  footer .footer-big{width: 100%; margin:0; padding-right:0;}

  .cont-float .text-left{width: 100%; margin-bottom: 40px;}
  .cont-float .text-right{width: 100%}

  .blocco_nero{
    padding-right: 7%;
  }
  .blocco_nero p{width: 100%}

  .selezione_fogliein .float_right,
  .selezione_fogliein .float_left{width: 100%;}

  .selezione_kokedama{padding-right:7%;}
  .selezione_kokedama img{float: none}
  .selezione_kokedama .text{
    position: relative;
    top: 0;
    left: 0;
    transform: translateY(0%);
    width: 100%;
    margin-top: 20px;
  }
}

@media screen and ( max-width:768px ){
  .slide_home .background_image{width: 100%}
  .slide_home .claim{
    width: 100%;
    padding: 60px 2%;
    font-size: 80px;
    line-height: 65px;
    text-align: center;
    background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,0.8) 20%, rgba(255,255,255,0.8) 80%, rgba(255,255,255,0) 100%);
    background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,0.8) 20%, rgba(255,255,255,0.8) 80%, rgba(255,255,255,0) 100%);
    background: linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(255,255,255,0.8) 20%, rgba(255,255,255,0.8) 80%, rgba(255,255,255,0) 100%);
  }


  .list-2 li .img-kokedama{width: 100%;}
  .list-2 li .text-trattamento{width: 100%;}

  .list-4 li{width: 48%;}
  .punti-vendita .trattamento{padding-left: 20px; padding-right: 20px;}
  .punti-vendita .trattamento .list-4 li{width: 50%; padding: 0 0.5%}
}

@media screen and ( max-width:480px ){
  header,
  .standard-text,
  .blocco_nero,
  .selezione_fogliein,
  .selezione_kokedama,
  section.trattamento,
  footer{padding-left:20px; padding-right:20px;}

  h1{
    font-size: 60px;
    line-height: 70px;
  }
  h2{
    font-size: 45px;
    line-height: 55px;
  }
  h3{
    font-size: 35px;
    line-height: 45px;
  }
  h4{
    font-size: 26px;
    line-height: 34px;
  }

  header #logo{height: 65px}

  footer .col-footer{width: 100%; padding-right: 0;}

  .fullscreen .scroll_down{left: 17px; margin-left: 0}

  .list-2 li{margin-bottom:25px}
  .list-2 li .img-kokedama{width: 100%;}
  .list-2 li .text-trattamento{width: 100%; padding:25px 20px}
  .list-2 li .icon{display:block;}

  .list-4 li,
  .punti-vendita .trattamento .list-4 li{width: 100%;}

  .selezione_fogliein img.img1{top: -80px; margin-top: -140px;}
}

@media screen and ( max-width:320px ){
  body{
    font-size: 20px;
    line-height: 28px;
  }
  h1{
    font-size: 52px;
    line-height: 60px;
    margin-bottom: 25px;
  }
  h2{
    font-size: 38px;
    line-height: 46px;
  }
  h3{
    font-size: 30px;
    line-height: 38px;
  }
  h4{
    font-size: 24px;
    line-height: 30px;
  }
}
