@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;600&display=swap');

html,body {
	font-family: 'Poppins', sans-serif;
	font-weight:400;
	color:#1a1a1a;
	height: 100%;
	width: 100%;
	position: relative;
	background-color:#FFF;
}
@media (max-width: 1024px) {
	 html,body {
		 overflow-x: hidden; /*Prevent scroll on narrow devices*/ 
	}
}
.nav-link {color:#FFF}
.green-bkg {background-color:#0e9447}
.green-txt,.nav-link:hover,.navbar-nav .nav-link.active, .navbar-nav .show > .nav-link,.form-label,.form-check-label {color:#0e9447}
.form-label strong,.form-check-label strong {color:red}
#carousel-home {
	height: calc(100vh - 100px);
	color: #fff;
	text-align: center;
	background-position: center;
	background-size: cover;
	position: relative;
	margin-bottom: 80px;
	overflow: hidden;
	min-height: 620px;
}
#carousel-home::before {
  content: "";
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  opacity: .3;
  background-color: #152a33;
  width: 100%;
  height: 100%;
  z-index: 1;
  position: absolute;
}
.onda {
  height: 100px;
  width: 100%;
  position: absolute;
  left: 0;
  bottom: -1px;
  z-index: 8;
}
.onda2 {
  top: -1px;
  bottom: initial;
  transform: rotate(180deg);
}
#carousel-home .logo-big {
  height: 412px;
  width: 500px;
  position: absolute;
  right: -40px;
  bottom: 0;
  opacity: .8;
  z-index: 1;
  background-image: url(/assets/images/logo-big.png);
  background-size: cover;
}
@media (max-width:991.98px) {
 #carousel-home .logo-big {
  height:390px;
  width:473px;
  opacity:.5
 }
}
@media (max-width:767.98px) {
 #carousel-home .logo-big {
  height:280px;
  width:340px;
  opacity:.3
 }
}

#carousel-home #myCarousel {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
}
#myCarousel .carousel-item {
	height: 100vh;
  	background-repeat: no-repeat;
	background-position: 50% 50%;
	background-size: cover;
}
.navbar-brand  {width:100%}


@media (min-width: 768px) {
	.navbar-brand  {width:60%}
	#menutop .contatti {margin-right:1rem !important}
}

#menutop .btn-close {
  box-sizing: content-box;
  text-align:center;
  height: 2.5em;
  width:2.5em;
  opacity:1;
  background: transparent url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e") top/1em auto no-repeat;
}

.navbar::before {
	content: "";
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	width: 100%;
	height: 200px;
	z-index: -1;
	position: absolute;
	background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=0 ); /* IE6-9 */
	transition: all .5s ease-in-out;
}
.scroll::before {
	background-color: #FFFFFF;
	box-shadow:0 .5rem 1rem rgba(0,0,0,.15);
	height:auto
}
.navbar-toggler {
	color:#FFF;
	border:0;
	background-color:#0e9447;
	font-size:14px;
	padding:10px 15px
}
.navbar-toggler:focus {
	border:0;
	box-shadow:none
	}
.navbar-toggler-icon {
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 1%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e")
}
.offcanvas.offcanvas-end {
	background-color:#333
}
.offcanvas.offcanvas-end {
	width:100vw; /*viewport width*/
}
@media (min-width: 768px) {
	 .offcanvas.offcanvas-end {
		 width:60vw; /*viewport width*/
	}
}
@media (min-width: 1024px) {
	 .offcanvas.offcanvas-end {
		 width:35vw; /*viewport width*/
	}
}
.nav-link::after {
    display: block;
    height: 2px;
    width: 50%;
	margin:4px auto;
    content: " ";
    background-image: linear-gradient(to right,#9fd5b6 1px,transparent 1px,transparent 7px,#9fd5b6 7px);
    background-size: 8px 2px;
    background-repeat: repeat-x;
}
.block-btn {
	position: absolute;
	top: -25px;
	left:-5px;
	z-index: 1;
}
.catalogo .btn {
  height: 130px;
  width: 130px;
  position: relative;
  background: none;
  border: none;
  padding: 0;
  z-index: 8;
  display: flex;
  align-items: center;
  text-align: center;
  vertical-align: middle;
}
.catalogo .btn::before{
    content: "";
    background-color: #0e9447;
    height: 129px;
    width: 129px;
    display: block;
    border-radius: 50%;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    -moz-transition:background-color .2s ease-in;
    -o-transition:background-color .2s ease-in;
    -webkit-transition:background-color .2s ease-in;
}
.catalogo .btn:hover::before{
    background-color: #095a2c;
}
.btn span .btn-text {
  line-height: 22px;
  padding: 0 10px;
  z-index: 1;
  text-align: center;
  width: 100%;
  color: #fff;
}

.values .item {
  height: 450px;
  width: 100%;
  border: 1px solid #000;
  border-radius: 200px;
  padding: 30px 20px;
  text-align: center;
  transition: all ease 0.4s;
  overflow: hidden;
}
@media (max-width:1199.98px) {
 .values .item {
  height:400px;
  border-radius:100px
 }
}
@media (max-width:991.98px) {
 .values .item {
  height:auto;
  border-radius:30px
 }
}
.values .item .icon {
  height: 95px;
  width: 95px;
  border-radius: 50%;
  background: #0e9447;
  margin: 10px auto;
	text-align:center
}
@media (max-width:991.98px) {
 .values .item .icon {
  margin:5px auto 20px auto
 }
}
.values .item .icon img {
  padding: 25px;
  display: block;
  fill: #fff;
}
.values .item h2 {
  font-size: 18px;
  font-weight:600;
  padding: 10px 0px;
  color: #0e9447;
  margin-bottom:0
}
@media (min-width:991.98px) {
 	.values .item p {
	font-size:14px
	}
}

.values .item:hover {
 transition:all ease 0.4s;
 background-color:#333
}
.values .item:hover h2,
.values .item:hover p {
 color:#fff
}
.numbers::before {
    content: "";
    background-color: #042914;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 0;
    width: 100%;
    opacity: .9;
}
.numbers {
  background-image:url(/assets/images/rotoli.jpg);
  background-size: cover;
  background-position: center;
  position: relative;
  min-height: 600px;
}
.numbers .container-fluid {
	position:relative;
	z-index:20;
	padding-top:115px
}
.numbers .fs-1 {font-weight:600}
@media (min-width: 1200px) {
	.numbers .display-1 {
	  font-size: 7rem;
	  font-weight:600	
	}
}
.footer {
	font-size:14px;
	padding-top:100px
}
.footer .small {
	font-size:13px;
}
.footer a:hover {
	text-decoration:underline !important
}
/*HEADER PAGINE*/
#header::before {
  content: "";
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  opacity: .4;
  background-color: #152a33;
  width: 100%;
  height: 100%;
  z-index: 1;
  position: absolute;
}
#header {
  height: calc(60vh - 100px);
  min-height: 500px;
  color: #fff;
  text-align: center;
  background-position: center;
  background-size: cover;
  position: relative;
  margin-bottom: 80px;
  overflow: hidden;
}
.numbers.company {
  background-image:url(/assets/images/magazzino.jpg);
  background-size: cover;
  background-position: center;
  position: relative;
  min-height: 600px;
}
.numbers.company .container,.numbers.qualita .container {
	position:relative;
	z-index:20;
	padding-top:115px;
	padding-bottom:40px
}

.company .owl-carousel .item {
	height:250px;
	position:relative
}
.company .owl-carousel .item p {
	font-size:18px
}
.company .owl-carousel .item:before {
 content:"";
 height:1px;
 width:100%;
 position:absolute;
 bottom:0;
 left:0;
 right:0;
 background-color:#fff;
 opacity:.4
}
.company .owl-carousel .item:after {
 content:"";
 height:20px;
 width:20px;
 background-color:#0e9447;
 position:absolute;
 bottom:-9px;
 left:0;
 right:0;
 margin:auto;
 border-radius:20px;
 z-index:11
}
.company .owl-carousel .item.sotto {
 margin-top:250px;
padding-top:20px
}
.company .owl-carousel .item.sotto:before {
 content:"";
 top:-1px;
 bottom:initial
}
.company .owl-carousel .item.sotto:after {
 content:"";
 top:-12px;
 bottom:initial
}
.company .owl-carousel .item .primo {
	position:absolute;
	z-index:12
}
.company .owl-carousel .item .bottom {
	position:absolute;
	bottom:5px;
	left:50%;
	transform:translateX(-50%);
	width:100%
}
.company .owl-carousel .owl-nav button.owl-prev,.company .owl-carousel .owl-nav button.owl-next {
	color:#FFF;
	font-size:70px
}
.valori {	background-color:#ececec}
.valori  .icon {
 height:70px;
 width:70px;
 min-height:70px;
 min-width:70px;
 border-radius:50%;
 background:#0e9447;
}
@media (max-width:991.98px) {
.valori  .icon {
  margin:20px auto
 }
}
.valori  .icon img {
 padding:16px;
 display:block;
 stroke:#fff
}
.valori p {font-size:15px}
#storia {	
	margin-top:100px;
	padding-top:50px
	}
#storia .owl-nav button.owl-prev,#storia .owl-nav button.owl-next {
	color:#0e9447;
	font-size:70px
}
#storia .owl-nav button.owl-prev:hover,#storia .owl-nav button.owl-next:hover {
	background-color:transparent;
	color:#333
	}
.icons {width:65%}
.icons.bigger {width:95%}