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

html{scroll-behavior: smooth;}

body{margin: 0px; padding: 0px; font-family: 'Futura LT Light'; overflow-x:hidden;font-size: 14px;letter-spacing: 1px;}  
p{color:#000; font-size: 15px; letter-spacing: 1px; font-weight: 660;}
a{text-decoration: none; color: #000;}
details{cursor: pointer;}
summary{color:#9a9a9a;} 


[type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner, button::-moz-focus-inner {
  padding: 0;
  border-style: none;
}
.button.-accent::after {
  border: 1px solid #fff !important;
  border-radius: 10px;
}
.button:hover::after {
  opacity: 1;
}
.button::after {
  opacity: .4;
  transition: all .2s cubic-bezier(.165,.84,.44,1);
}
.button::after {
  content: "";
  position: absolute;
  top: .3125rem;
  bottom: .3125rem;
  right: .3125rem;
  left: .3125rem;
}

.button.-accent:hover {
  color: #333;
}

.button.-md {
  min-width: 10rem;
  padding: 1.20rem 2rem; 
}
[type="button"]:not(:disabled), [type="reset"]:not(:disabled), [type="submit"]:not(:disabled), button:not(:disabled) {
  cursor: pointer;
}
.elementor *, .elementor ::after, .elementor ::before {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.mt-20 {
  margin-top: 1.25rem !important;
}
.text-white {
  color: black;
}
.mb0 {
  margin-bottom: 0px !important;
}
.mt0 {
  margin-top: 0px !important;
}
.button {
  position: relative;
  display: inline-block;
  border: 0; 
  font-size: 16px;
  line-height: 1;
  font-weight: 400;
  text-transform: uppercase;
  text-align: center;
  transition: all .3s cubic-bezier(.165,.84,.44,1);
  opacity: 0.7;
  letter-spacing: 1px;
  border-radius: 10px;
  background: #878787; 
  color: #fff;
  font-weight: bold;
  letter-spacing: 1px;
}
[type="button"], [type="reset"], [type="submit"], button {
  -webkit-appearance: button;
}
button {
  padding: unset;
  margin: unset;
    margin-top: unset;
  border: unset;
  border-radius: unset;
  background-color: unset;
}
button, select {
  text-transform: none;
}
button, input {
  overflow: visible;
}
button, input, optgroup, select, textarea {
  margin: 0;
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
}
button {
  border-radius: 0;
}

.btn:hover{
  box-shadow: 0px 0 7px #4b4b4b31;
}
.btn{
  box-shadow: 0px 0 7px #0606063d; 
}

.background {
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  overflow: hidden;
  will-change: transform;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  height: 140vh;
  position: fixed;
  width: 100%;
  transform: translateY(30vh);
  transition: all 1.2s cubic-bezier(0.22, 0.44, 0, 1);
}
.about_bg::before{
  content: unset !important;
}
.background:before {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.3);
}
.background:first-child {
  background-image: url(..//images/banner_1.jpg);
  transform: translateY(-15vh);
}
.background:first-child .content-wrapper {
  transform: translateY(15vh);
}
.background:nth-child(2) {
  background-image: url(..//images/banner_2.jpg);
}
.background:nth-child(3) {
  background-image: url(..//images/banner_3.jpg);
}

.page-id-16 .foot_right .gmap .wp-block-image img {
	max-width: 192px;
	margin-bottom: 5px;
}
.page-id-16 .foot_main .foot_left .foot_left_one {
    margin-bottom: 50px;
}
.page-id-16 .foot_main .foot_right {
	display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

/* Set stacking context of slides */
.background:nth-child(1) {
  z-index: 3;
}

.background:nth-child(2) {
  z-index: 2;
}

.background:nth-child(3) {
  z-index: 1;
}

.footer_content-wrapper {
  text-align:unset !important;
  color: unset !important;
  text-transform: unset !important;
  font-family: unset !important;
}
.content-wrapper {
  height: 98vh; 
  display: flex; 
  justify-content: center;
  text-align: center;
  flex-flow: column nowrap;
  color: #fff;
  font-family: 'Alkalami', serif;
  text-transform: uppercase;
  transform: translateY(40vh);
  will-change: transform;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  transition: all 1.7s cubic-bezier(0.22, 0.44, 0, 1);
}
.content-title { 
  font-size: 20vh; 
  line-height: 1.4; 
  color: #2f2f2f0d !important;  
} 
.contact_foot_right{ 
  height: 237px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.background.up-scroll {
  transform: translate3d(0, -15vh, 0);
}
.background.up-scroll .content-wrapper {
  transform: translateY(15vh);
}
.background.up-scroll + .background {
  transform: translate3d(0, 30vh, 0);
}
.background.up-scroll + .background .content-wrapper {
  transform: translateY(30vh);
}

.background.down-scroll {
  transform: translate3d(0, -130vh, 0);
}
.background.down-scroll .content-wrapper {
  transform: translateY(40vh);
}
.background.down-scroll + .background:not(.down-scroll) {
  transform: translate3d(0, -15vh, 0);
}
.background.down-scroll + .background:not(.down-scroll) .content-wrapper {
  transform: translateY(16vh);
}

nav { 
	margin:0 auto; 
  width:100%;
  height:auto;
  display:block;
}
nav ul {
	margin:0;
  padding:0;
  list-style-type:none;
	float: right;
} 

nav ul li {
	position:relative; 
	margin:0;
	float:left;
  display:inline-block;
}

nav ul li a {color:black;display: block; padding: 20px 20px;  text-decoration: none;  font-family: 'Futura LT Regular';  text-transform:uppercase;  font-size: 10px;  letter-spacing:2px;}

.product_submenu{
text-align: center !important; 
}

nav ul li:hover { 
  cursor: pointer;
}

nav ul .sub_menu:hover {
  cursor: pointer;
  background-color: #f2f2f2;
}

nav ul li a:hover {
  cursor: pointer;
  color: #535456 !important;
}

nav ul li ul {
	display:none; 
  position:absolute;
  left:0;
  float:left;
  background-color: #e0e0e0;
	margin: 0px 15px 0px;
}

nav ul li ul li {
	width:100%;
  border-bottom:1px solid rgba(255,255,255,.3);
}

nav ul li:hover ul {
  display:block;
}

.gelato_change{padding: 50px 0px !important; display: block !important; height: unset !important;}
.footer_home{display: flex !important; align-items: flex-end !important;}
.footer_wrapper{display: unset !important; width: 100% !important;}
.about_home{max-width:1140px !important ;margin-bottom: 32px !important; margin-top: 180px !important; display: flex !important; justify-content: center !important; align-items: center !important;}
.flex_social{display: flex; align-items: center; filter: invert(100%);} 
.menu_space{margin-right: 110px;} 
a.more-link{font-size: 14px; text-transform: lowercase; font-weight: bold; color:#fd0; display: inline-block; transition: all .4s ease;    text-decoration: none;    letter-spacing: 1px; }
a.more-link i{display: inline-block; vertical-align: -3px; font-size: 20px; margin-left: 10px;}
a.more-link:hover { color: #34964D; -webkit-transform: translateX(5px);transform: translateX(5px);}
.about_main span{font-size:56px; color: #cbcbcb;}
.about_main h2{ margin-top:-20px;} 
.banner_bg_1{background: #bfbfbf url("../images/banner_1.jpg") no-repeat fixed;background-size: contain;}
.banner_bg_2{background: #bfbfbf url("../images/banner_2.jpg") no-repeat fixed;}
.banner_bg_3{background: #bfbfbf url("../images/banner_3.jpg") no-repeat fixed;}
.banner_bg_gry{background-color:#bfbfbf }
.banner_bg_white{background-color:#FFF }
.full-wrap {height: 100%;  width: 100vw;  background-size: contain;  background-position: 50% 50%;}
.full-vh{position: relative;  height: 100vh;  width: 100vw;  background-color: transparent;}
.page_wraper{width:100%;}
.top_strip{width:100%; background-color:#BFBFBF; height:10px;}  
.container{width:1240px; margin:0 auto; }
.pro_container{width:1000px; margin:0 auto; }
.box_shadow{box-shadow: 1px 1px 4px 0 rgba(0,0,0,0.1);}
.active a{color: #535456;}
.active_line{border-bottom: solid 1px #CCC; width: 32%;margin: -26px auto;} 
.product_active_line{border-bottom: solid 1px #CCC; width: 62%; margin: 0 auto; display: block; padding-top: 4px;}

.header .logo {display: block; float: left; padding: 2px 20px; text-decoration: none;}  
.logo img{width: 150px;}
.fixed{position:fixed; top:0px; left:0px; z-index: 999;background-color: #FFF;width: 100%;box-shadow: 1px 1px 4px 0 rgba(0, 0, 0, 0.18);}   
 .full_size{width: 100% !important;}
.banner_support{background-color:#bfbfbf; padding:121px 0px;}   
.banner_support1{background-color:#fff; padding:120px 0px;}   
.banner{width:100%; position: relative;margin-top: 105px;} 
.banner_text{width:100%; text-align:center;}  
.banner_text img{width:90% !important;}  
.pera_banner{width:100%;}
.pera_banner img{ width:100%;}
.menu_top{margin-top:75px !important;}  
.menu_tops{margin-top:105px !important;}  
.menu_top1{margin-top:75px !important;}    
.wc{display: none;}
.gelato_line:before {top: 63px !important; right: 58% !important;}  
.gelato_line:after {top: 63px !important; left: 58% !important;} 
.stix_line:before{top: 61px !important; right: 55% !important;}
.stix_line:after{top: 61px !important; left: 55% !important;}   
.line:before {content: ''; width: 50px; height: 2px; background: #4444449e; position: absolute; top: 31px; right: 59%;} 
.line:after {content: ''; width: 50px; height: 2px; background: #4444449e; position: absolute; top: 31px; left: 59%;} 
.line1:before {content: ''; width: 50px; height: 2px; background: #888888c4; position: absolute; top: 31px; right: 55%;} 
.line1:after {content: ''; width: 50px;height: 2px; background: #888888c4; position: absolute; top: 31px; left: 55%;} 
.line2:before {content: '';  width: 50px; height: 2px; background: #888888c4; position: absolute; top: 19px; left: 57%;} 
.line2:after {content: '';  width: 50px; height: 2px; background: #888888c4;  position: absolute; top: 19px; right: 57%;} 
.contact_line1:before {content: ''; width: 50px; height: 2px; background: #4444449e; position: absolute; top: 20px; right: 75%;}  
.contact_line1:after {content: ''; width: 50px; height: 2px; background: #4444449e; position: absolute; top: 20px; left: 75%;}  

.contact_line2:before {content: ''; width: 50px; height: 2px; background: #4444449e; position: absolute; top: 19px; right: 68%;}  
.contact_line2:after {content: ''; width: 50px; height: 2px; background: #4444449e; position: absolute; top: 19px; left: 68%;}    
 
.contact_line3:before {content: ''; width: 60px; height: 2px; background: #888888c4; position: absolute; top: 17px; right: 59%;}  
.contact_line3:after {content: ''; width: 60px; height: 2px; background: #888888c4; position: absolute; top: 17px; left: 59%;}    
 
.mobile_view{display: none;}
.desktop_view{display: block;}

.animation{background: url("../images/line-bg.png") repeat-y; background-clip: border-box;  -webkit-background-clip: text;  background-clip: text; -webkit-text-fill-color: transparent; -webkit-animation: aitf 80s linear infinite;  -webkit-transform: translate3d(0, 0, 0);  -webkit-backface-visibility: hidden;}
.animation1 h1 {background: url("../images/line_bg_1.png") repeat-y; background-clip: border-box;  -webkit-background-clip: text;  background-clip: text; -webkit-text-fill-color: transparent; -webkit-animation: aitf 80s linear infinite; -webkit-transform: translate3d(0, 0, 0); -webkit-backface-visibility: hidden;}
.animation1 h1 a img {background: url("../images/line_bg_1.png") repeat-y; background-clip: border-box;  -webkit-background-clip: text;  background-clip: text; -webkit-text-fill-color: transparent; -webkit-animation: aitf 80s linear infinite; -webkit-transform: translate3d(0, 0, 0); -webkit-backface-visibility: hidden;}
.animation2 h1 {background: url("../images/line-bg_2.png") repeat-y; background-clip: border-box; -webkit-background-clip: text;  background-clip: text; -webkit-text-fill-color: transparent; -webkit-animation: aitf 80s linear infinite; -webkit-transform: translate3d(0, 0, 0);  -webkit-backface-visibility: hidden;}
.flex{display: flex; justify-content: space-evenly; align-items: center; flex-direction: row; margin-top: 30px; }
.center{margin: 30px auto auto; width: 60%;}
.div{display: flex; justify-content: center; align-items: center; flex-direction: column;}
.div div{width: 13px; height: 13px; border-radius: 50%; border: 2px solid white;}
.bdr div{border: 2px solid #BFBFBF;}
.div1 div{background-color: #398FB9;}
.div2 div{background-color: #5FBB3F;}
.div3 div{background-color: #FFBF00;}
.div4 div{background-color: #9B83BB;}
.div5 div{background-color: #43FFFC;}
.stix_margin{margin-left: 17px !important;}
.stix_mb0{margin-bottom: 0px !important;}
.banner_text3{width:100%; text-align:center} 
.banner_text3 img{width:60% !important;} 
.banner img{width:100%; margin:0px; } 
.mobile_banner{display: none;}
.pro_thum{width:33%; text-align:center;}
.pro_thum img{width:50%; transition: all 1s ease;}
.pro_thum img:hover{-webkit-transform: translateX(5px); transform: translateX(25px)}
.pro_thum p{width:100%;} 
.products_banner_main{display:flex; justify-content: space-evenly;width: 90%;margin: 0 auto;max-width: 1300px;} 
.stix_pro_thum{width:33%; text-align:center;}
.stix_pro_thum img{width:40%; transition: all 1s ease;}
.stix_pro_thum img:hover{-webkit-transform: translateX(5px); transform: translateX(25px)}
.stix_pro_thum p{ width:100%;} 
.flexs{display: flex; justify-content: space-evenly; flex-direction: row; margin-bottom: 30px;  }
.home_about{display: flex; margin-top:50px;}
.home_about_left{width:70%;}
.home_about_left h2{font-size:30px;text-transform: uppercase;letter-spacing: 1px;padding-left: 60px;}  
.home_about_left h2::before {content: ''; width: 50px; height: 2px; background: #888888c4; position: absolute; left: 218px; bottom: 48%;}
.home_about_left h2::after {content: ''; width: 50px; height: 2px; background: #888888c4; position: absolute; left: 0px; bottom: 48%;} 
.side_part{background-color:#000; width:10px; height:125px;}
.contact_flex{display:flex; justify-content:center; align-items:flex-start; height: 394.4px;}
.contact_design_left{width:50%;}  
.contact_design_left h1{font-size: 30px ;text-transform: uppercase; text-align: center; letter-spacing: 1px; margin-bottom: 25px; margin-top: 21px;} 
.home_about_left p{font-size: 14px;line-height: 24px;letter-spacing: 1px;margin: 0px;margin-bottom: 10px;} 
.home_about_left h3{font-size: 23px;line-height: 30px;letter-spacing: 1px;margin-top: 0px;padding-top: 0px;}  
.home_about_right{width:30%;text-align: center;}  
.home_about_right img{width:70%; margin-top:50px;  transition: all 1s ease;}
.home_about_right img:hover{-webkit-transform: translateX(5px); transform: translateX(25px)}
.foot{background-color:#868686; padding:30px 20px 20px 20px; color:#FFF;}  
.foot_main{display: flex;}
.foot_left{width:60%;display: flex;flex-wrap: wrap;} 
.foot_left_one{width:50%;}
.foot_left_one h6{font-size:14px;text-transform: uppercase; margin:0px 0px 10px 0px; letter-spacing:2px;font-weight: 500; transition: all .4s ease;}  
.foot_left_one h6:hover { color: white !important; -webkit-transform: translateX(5px);  transform: translateX(5px);}
.foot_left_one p{text-align:left;  letter-spacing:2px; font-size:14px;margin: 0px;transition: all .4s ease;}  
.foot_left_one a{color:#FFF; text-decoration:none; font-weight: 100;} 
.foot_left_one p:hover { color: white !important; -webkit-transform: translateX(5px); transform: translateX(5px);}
.foot_right{width:40%;text-align: center;color: #FFF;}    
.foot_right h5{transition: all .4s ease; text-align:center; font-size:14px;text-transform: uppercase; margin:0px 0px 20px 0px; letter-spacing:1px;letter-spacing: 2px;font-weight: 100;} 
.foot_right h5:hover { color: white !important; -webkit-transform: translateX(5px);  transform: translateX(5px);}
.foot_right p{text-align:center;  letter-spacing:1px; font-size:12px;color: #FFF;font-weight: normal;}
.display_flex{display:flex}
.social{margin-right:10px !important; width:26px; }
.social img{width:100%;} 
.hd_mr_10{margin-right:10px !important;}
.fade {opacity:0; transition: 1s all ease-out;}
.products_welcome{width:100%; padding:10px; text-align:center;}
.products_welcome h2{font-size:30px;text-transform: uppercase; letter-spacing:1px; }
.products_welcome p{letter-spacing:1px; margin-bottom: 24.48px; margin-top: 21px;} 
.products_banner{width:100%; margin:0px; padding:30px 0px; background-color:#BFBFBF; text-align:center; } 
.products_banner h1{font-size:50px;text-transform: uppercase; text-align:center; letter-spacing:1px;margin-bottom: 25px;letter-spacing: 4px; margin-top:0px; background: url("../images/line_bg_1.png") repeat-y;  background-clip: border-box; -webkit-background-clip: text; background-clip: text;  -webkit-text-fill-color: transparent; -webkit-animation: aitf 80s linear infinite; -webkit-transform: translate3d(0, 0, 0);  -webkit-backface-visibility: hidden; }
.products_banner h2{font-size:30px;text-transform: uppercase; text-align:center; letter-spacing:1px; margin-bottom: 25px;}
.products_banner p{letter-spacing:1px; font-size:16px; font-family: unset; /*width: 100%;*/ width: auto; font-weight: 100; padding: 0 15px;}  
.font_weight_500{font-weight:500} 
.explore_btn{background-color:#FFF; padding:5px; text-transform:uppercase; display:inline-block; width:150px; text-align:center; border: solid 1px #bfbfbf;}
.products_stix{width:100%; margin:0px; padding:30px 0px; background-color:#FFF; text-align:center;}
.products_stix h1{font-size:50px;text-transform: uppercase; text-align:center; letter-spacing:4px; margin-top: 0px; background: url("../images/line-bg_2.png") repeat-y; background-clip: border-box; -webkit-background-clip: text;  background-clip: text; -webkit-text-fill-color: transparent; -webkit-animation: aitf 80s linear infinite;  -webkit-transform: translate3d(0, 0, 0); -webkit-backface-visibility: hidden;}
.products_stix p{letter-spacing:1px; font-size:16px; font-family:unset; font-weight: 100;}
.products_title{width:100%; margin:0px; padding:0px 0px; background-color:#BFBFBF; text-align:center;} 
.products_title h2{font-size:50px;text-transform: uppercase; text-align:center; letter-spacing:1px; margin: 0px; padding-top:30px; background: -webkit-linear-gradient(#7B3906, #DCC0B3); -webkit-background-clip: text;  -webkit-text-fill-color: transparent;}
.products_title h3{font-size:50px;text-transform: uppercase; text-align:center; letter-spacing:1px; margin-bottom:0px; padding-top:30px;  background: -webkit-linear-gradient(#eee, #333 );  -webkit-background-clip: text;  -webkit-text-fill-color: transparent;margin: 0px;}
.contact_banner{width:100%; margin:0px; padding:30px 0px; background-color:#cbcbcb;height: 84vh;display: flex;justify-content: center;align-items: center;}      
.contact_banner h2{font-size:30px;text-transform: uppercase; text-align:center; letter-spacing:1px; margin-bottom: 25px;}   
.contact_banner p{letter-spacing:1px; font-size:13px; text-align: center;color: #000;font-weight: 100;}  
.inquiry_form {width: 100%; margin-bottom: 15px; font-size:15px;text-align: center;}  
.inquiry_form input, .inquiry_form textarea, .inquiry_form select {border: 1px solid #e6e6e6; color: #000; font-size:13px;  opacity: 1; padding: 13px 13px; text-decoration: none; width: 300px;background-color: transparent;border-radius: 10px;letter-spacing: 1px;  box-shadow: 0 5px 40px rgba(186, 186, 186, 0.6); font-weight: 900;}


.inquiry_form input:hover, .inquiry_form input:focus {background-position: 0 -400px; color: #333;}
.inquiry_form input[type="checkbox"], .inquiry_form input[type="radio"] {background: none; border: medium none; vertical-align: bottom; width: auto;}

.inquiry_form input.button {width: 150px; cursor: pointer;}
.store_location{text-align:center; width: 100%; font-weight:bold}  
.store_location h1{text-align:center; width: 100%; font-size: 25px;}  
.store_location span{text-align:center; width: 100%; font-weight:bold}  
.follow{width:28px;margin-left: 10px;}
.follow img{width:100%; margin-left:10px !important; padding-left:10px;} 
.zoetto-get-in-touch{justify-content: center;align-items: center; flex-direction: column;width: 50%;text-align: center;letter-spacing: 1px;}
.zoetto-get-in-touch h3{color:#2C2C2C;font-size: 18px;letter-spacing: 1px;line-height: 34px;}
.zoetto-get-in-touch h1 { font-size: 30px; text-transform: uppercase; text-align: center; letter-spacing: 1px; margin-bottom: 20px; margin-top: 21px;}
.gelato_gry{background-color:#BFBFBF; padding:30px 0px;height: 92vh;display: flex;align-items: center;justify-content: center;} 
.gelato_white{background-color:#FFF; padding:30px 0px;height: 92vh;display: flex;align-items: center;}  
.gelato_main{width:100%; display:flex;justify-content: space-between;}  
.gelato_thum{text-align:center; width:50%;} 
.gelato_thum img{text-align:center; width:40%; transition: all 1s ease;} 
.gelato_thum img:hover{    -webkit-transform: translateX(5px);   transform: translateX(25px)}  
.gelato_thum h5{font-size:22px; padding:0px; margin:0px; letter-spacing:1px;} 
.gelato_thum h6{font-family: 'Roboto', sans-serif; font-size:16px; padding:0px; margin:0px; letter-spacing:1px;} 
.gelato_thum p{ font-size:15px; letter-spacing:1px;line-height: 25px;} 

.stix_main{width:100%; display:flex;justify-content: space-between;} 
.stix_thum{text-align:center; width:50%;}
.stix_thum img{text-align:center; width:36%; transition: all 1s ease;}
.stix_thum img:hover{-webkit-transform: translateX(5px);   transform: translateX(25px)} 
.stix_thum h5{ font-size:22px; padding:0px; margin:0px; letter-spacing:1px;} 
.stix_thum h6{font-size:16px; padding:0px; margin:0px; letter-spacing:1px;} 
.stix_thum p{ font-size:15px; letter-spacing:1px; line-height: 25px; margin-bottom: 25px;} 
.mobile_br{display: none;}
.explore_btn {cursor: pointer;  position: relative;  padding: 8px 20px;  background: white;  font-size: 17px; border-top-right-radius: 10px;  border-bottom-left-radius: 10px;  transition: all 1s;  letter-spacing:1px;margin-top: 16px;}
.explore_btn:after, .explore_btn:before {content: " ";  width: 15px;  height: 15px;  position: absolute;  border: 0px solid #fff;  transition: all 1s;}
.explore_btn:after {top: -1px;  left: -1px;  border-top: 2px solid #a8a8a8;  border-left: 2px solid #a8a8a8;  }
.explore_btn:before {bottom: -1px;  right: -1px;  border-bottom: 2px solid #a8a8a8;  border-right: 2px solid #a8a8a8;}
.explore_btn:hover {border-top-right-radius: 0px;  border-bottom-left-radius: 0px; border-top-right-radius: 10px;  border-bottom-left-radius: 10px; }
.explore_btn:hover:before, .explore_btn:hover:after { width: 100%;  height: 100%;border-top-right-radius: 10px;  border-bottom-left-radius: 10px;}
.data-container {display: flex;  justify-content: center;  align-items: center;}
.contact_logo{width:100%;align-items: center; }
.contact_logo img{width:40%;}  
.bold{font-weight:bold !important;}  
#button {display: inline-block;  background-color: #BFBFBF; width: 30px; height: 30px; text-align: center; border-radius:4px; position: fixed; bottom:15px; right: 15px;  transition: background-color .3s,   opacity .5s, visibility .5s;  opacity: 0;  visibility: hidden;  z-index: 1000;}
#button::after {content: "\f077"; font-family: FontAwesome; font-weight: normal; font-style: normal; font-size: 1em; line-height: 30px; color: #fff;}
#button:hover {cursor: pointer;  background-color: #aaa;}
#button:active {background-color: #555;}
#button.show {opacity: 1;  visibility: visible;}
#back-to-top {position: fixed; bottom: 5px; right: 16px; z-index: 9999; width: 32px; height: 32px; text-align: center; line-height: 30px; background-color: #f9f9f9; color: #000; cursor: pointer; border: 0; border-radius: 2px; text-decoration: none; transition: opacity 0.2s ease-out; opacity: 0;border: 1px solid #0202020f;}
#back-to-top:hover {background-color: rgba(255, 255, 255, 0.8); color: #000;} 
#back-to-top.show {opacity: 1;} 
@-webkit-keyframes aitf {0% {background-position: 0% 50%;}   100% {background-position: 100% 50%;}}
.hu__hu__:hover {animation: hu__hu__ infinite 10s ease-in-out; -webkit-animation-duration: 17s; animation-duration: 17s; } 
@keyframes hu__hu__ { 50% { transform: translateY(30px) }}
.heartbeatSlow:hover {animation-name: heartbeatSlow; animation-iteration-count: infinite; animation-duration: 5s }
@keyframes heartbeatSlow { 35%, 65% { transform: scale(1.1) }}
.fadeInLeftBig {-webkit-animation-name: fadeInLeftBig;  animation-name: fadeInLeftBig;  -webkit-animation-duration: 3s;  animation-duration: 3s;  -webkit-animation-fill-mode: both;  animation-fill-mode: both;  } 
@-webkit-keyframes fadeInLeftBig {
  0% {opacity: 0;  -webkit-transform: translate3d(-2000px, 0, 0);  transform: translate3d(-2000px, 0, 0);  }
  100% {  opacity: 1;  -webkit-transform: none;  transform: none;  }
  }
  @keyframes fadeInLeftBig {
  0% { opacity: 0;  -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); }
  100% {opacity: 1;  -webkit-transform: none;  transform: none;  }
  } 
.swing {-webkit-transform-origin: bottom center; -ms-transform-origin: bottom center; transform-origin: bottom center; -webkit-animation-name: swing;  animation-name: swing;  -webkit-animation-duration: 20s;  animation-duration: 20s;  -webkit-animation-fill-mode: both;  animation-fill-mode: both;  animation-iteration-count: infinite;  }
  @-webkit-keyframes swing {
  20% {-webkit-transform: rotate3d(0, 0, 1, 12deg); transform: rotate3d(0, 0, 1, 15deg);}
  40% {-webkit-transform: rotate3d(0, 0, 1, -7deg); transform: rotate3d(0, 0, 1, -10deg);}
  60% {-webkit-transform: rotate3d(0, 0, 1, 2deg); transform: rotate3d(0, 0, 1, 5deg);}
  80% { -webkit-transform: rotate3d(0, 0, 1, -2deg); transform: rotate3d(0, 0, 1, -5deg);}
  100% {-webkit-transform: rotate3d(0, 0, 1, 0deg); transform: rotate3d(0, 0, 1, 0deg);}
  }
  @keyframes swing {
  20% { -webkit-transform: rotate3d(0, 0, 1, 12deg); transform: rotate3d(0, 0, 1, 15deg);}
  40% {-webkit-transform: rotate3d(0, 0, 1, -7deg); transform: rotate3d(0, 0, 1, -10deg);}
  60% {-webkit-transform: rotate3d(0, 0, 1, 2deg); transform: rotate3d(0, 0, 1, 5deg);}
  80% {-webkit-transform: rotate3d(0, 0, 1, -2deg); transform: rotate3d(0, 0, 1, -5deg);}
  100% {-webkit-transform: rotate3d(0, 0, 1, 0deg); transform: rotate3d(0, 0, 1, 0deg);}
  }
.tada {-webkit-animation-name: tada;  animation-name: tada;  -webkit-animation-duration: 15s;  animation-duration: 15s;  -webkit-animation-fill-mode: both;  animation-fill-mode: both;   animation-iteration-count: infinite;  }
  @-webkit-keyframes tada {
  0% { -webkit-transform: scale3d(1, 1, 1);  transform: scale3d(1, 1, 1);}
  10%, 20% {-webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg); transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);}
  30%, 50%, 70%, 90% {-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);}
  40%, 60%, 80% {-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);}
  100% { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); }
  }
  @keyframes tada {
  0% { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1);}
  10%, 20% {-webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg); transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);}
  30%, 50%, 70%, 90% {-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);}
  40%, 60%, 80% { -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);}
  100% {-webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); }
  } 
.shake {-webkit-animation-name: shake; animation-name: shake; -webkit-animation-duration: 11s; animation-duration: 11s; -webkit-animation-fill-mode: both; animation-fill-mode: both; animation-iteration-count: infinite;}
  @-webkit-keyframes shake {0%, 100% {  -webkit-transform: translate3d(0, 0, 0);  transform: translate3d(0, 0, 0);}
  10%, 30%, 50%, 70%, 90% { -webkit-transform: translate3d(-10px, 0, 0);  transform: translate3d(-10px, 0, 0);}
  20%, 40%, 60%, 80% {-webkit-transform: translate3d(10px, 0, 0);  transform: translate3d(10px, 0, 0);}
  }
  @keyframes shake {
  0%, 100% { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0);}
  10%, 30%, 50%, 70%, 90% { -webkit-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0); }
  20%, 40%, 60%, 80% {-webkit-transform: translate3d(10px, 0, 0); transform: translate3d(10px, 0, 0);}
  } 
.bounce {-webkit-animation-name: bounce;  animation-name: bounce;  -webkit-transform-origin: center bottom;  -ms-transform-origin: center bottom;  transform-origin: center bottom;  -webkit-animation-duration: 5s;  animation-duration: 5s;  -webkit-animation-fill-mode: both;  animation-fill-mode: both;  animation-iteration-count: infinite;  }
 @-webkit-keyframes bounce {
  0%, 20%, 53%, 80%, 100% { -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); }
  40%, 43% {  -webkit-transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); -webkit-transform: translate3d(0, -30px, 0); transform: translate3d(0, -30px, 0);  }
  70% {-webkit-transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); -webkit-transform: translate3d(0, -15px, 0); transform: translate3d(0, -15px, 0); }
  90% {-webkit-transform: translate3d(0,-4px,0); transform: translate3d(0,-4px,0); }
  }
  @keyframes bounce {
  0%, 20%, 53%, 80%, 100% { -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0);}
  40%, 43% {-webkit-transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); -webkit-transform: translate3d(0, -30px, 0); transform: translate3d(0, -30px, 0);}
  70% { -webkit-transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); -webkit-transform: translate3d(0, -15px, 0); transform: translate3d(0, -15px, 0); }
  90% { -webkit-transform: translate3d(0,-4px,0); transform: translate3d(0,-4px,0); }
  } 
  
.whatsapp{ width:65px;position: fixed;right: 4px;bottom: 50px;z-index: 99999999;text-align: center;}    
.whatsapp img{ width:50px;}  
.whatsapp p{ /*! width:50px; */margin: 0px;color: #34bc48;} 
    
@media (min-width: 48em) {
 .header li {float: left;}
.header li a {padding: 30px;} 
.header .menu {clear: none; float: right; max-height: none;}  
.header .menu-icon {display: none;}  
}
@media only screen and (min-width: 768px) and (max-width:1800px) {
.container{width: 95%; margin:0 auto; height: auto;  max-width: 1200px;} 
.container_menu{width:100% !important; margin:0 auto; height: auto; max-width: unset !important;}
} 
@media only screen and (min-width:1500px) and (max-width:1950px) {
.content-wrapper {height: 93vh;}
} 
@media only screen and (min-width: 620px) and (max-width:1024px) {  
  .mobile_banner {
    display: block !important;
    padding: 0px 0px !important;
    margin-top: 74px;
  }
  .menu_tops {
    margin-top: 10px !important;
  }
  .gelato_gry, .gelato_gry {
    padding: 70px 0px !important;
    height: unset;
  }
  .gelato_white, .gelato_white {
    padding: 70px 0px !important;
    height: unset;
  }
  .contact_banner {margin-bottom: 40px !important;height: unset !important;}
  .mres_t0{margin-top: 0px !important;}
  .flex_social{display: none;}
  .mobile_banner{display: block !important;}
  .mobile_view{display: block !important;}
  .desktop_view{display: none !important;}
} 

@media only screen and (min-width: 620px) and (max-width:1200px) {
.gelato_line::after {top: 64px !important; left: 64% !important;} 
.gelato_line::before {top: 64px !important; right: 64% !important;}
.stix_line::after { top: 64px !important; left: 58% !important;}
.stix_line::before { top: 64px !important; right: 58% !important;}
.line2::before {top: 19px !important; left: 62% !important;}
.line2::after {top: 19px !important; right: 62% !important;}
.line::after {top: 31px; left: 64%;}
.line::before {  top: 31px;right: 64%;}
.line1::after {top: 31px !important; left: 58% !important;}
.line1::before {top: 31px !important; right: 58% !important;} 
.contact_line1::after { top: 17px !important; left: 90% !important; } 
.contact_line1::before { top: 17px !important; right: 91% !important; }
.contact_line3::before {top: 16px !important; right: 66% !important;}
.contact_line3::after {top: 16px !important; left: 66% !important;}
.contact_line2::after {top: 17px !important; left: 78% !important;}
.contact_line2::before {top: 17px !important; right: 79% !important;} 
.active_line {margin: -19px auto;}

.center {margin: 25px auto auto !important; width: 100% !important;} 
.products_banner_main {display: flex !important; justify-content: space-evenly !important; flex-direction: row !important;}
.products_banner_main img{    width: 80% !important;}
.mobile_space{margin-bottom: 0px;  }
.width{width: 100% !important;}
.mobile_spaces{margin-bottom: 0px !important;}
.mobile_space p{margin-top: 16px !important;  }
.mres-t10{margin-top: 16px !important; }
.gelato_gry, .gelato_gry {padding: 70px 0px !important;}
.gelato_white , .gelato_white{padding: 70px 0px !important; }
.stix_main, .gelato_main { display: flex !important; justify-content: space-betwee !important; flex-direction: row !important;}
.stix_thumm, .gelato_thum {width: 50%;}
.mres-b30{ margin-bottom: 0px;}
.br{display: none; }
.brs{display: block !important; }
.stix_thum h5, .gelato_thum h5{margin: 12px 0px 0px; }
.stix_thum p{ font-size: 14px; padding: 6px; margin-bottom: 25px; }
.stix_margin p{padding-bottom: 7px !important;}
.gelato_thum p{ font-size: 14px; padding: 6px;}
.mobile_gelato{ display: flex; justify-content: center;}
.mg{ width: 50%; }
.none{display: none !important;}
.mres_t7{margin-top: 7px;}
.wc{display: block;}
}
@media screen and (max-width: 360px){
.home_about_left h2::before {
  left: 229px !important;
  bottom: 49% !important;
}
.home_about_left h2::after {
  left: 26px !important;
  bottom: 49% !important;
}
}
@media screen and (max-width: 730px) {
  .top_space{padding-top:  10px !important;}
  .flex_social{display: none;}
  .menu_space{margin-right: 0px !important;} 
  .mobile_view{display: block;}
  .desktop_view{display: none;} 
.mres_t0{margin-top: 0px !important;}
.res_flex{display: flex; flex-direction: column !important; justify-content: center; align-items: center;}
.zoetto-get-in-touch h1 { margin-top: 20px !important;}
.contact_banner {margin-bottom: 40px !important;}
.home_about_right img {margin-top: 0px !important;} 
.contact_flex { display: flex; justify-content: center; align-items: flex-start; flex-direction: column;}
.contact_design_left {width: 100%;}
.zoetto-get-in-touch {width: 100%;margin-top: 30px;} 
.about_main span {font-size: 35px;}  
.res_fs18{font-size: 18px !important;}
.res_fs22{font-size: 22px !important;}
.about_main h2 { margin-top: 27px !important;}
.pro_thum {width: 100%;}
.stix_pro_thum {width: 100%;}
.wc{display:none;}
.wcs{display:block;}
.brs{display: none;}
.mobile_br{display: block;}
.mres_t7{margin-top: 14px !important;}
.gelato_line::after {top: 64px !important; left: 79% !important;}
.gelato_line::before {top: 64px !important; right: 79% !important;}
.stix_line::after { top: 64px !important; left: 65% !important;}
.stix_line::before { top: 64px !important; right: 65% !important;}
.line2::before {top: 19px !important; left: 78% !important;}
.line2::after {top: 19px !important; right: 78% !important;}
.line::after {top: 31px ; left: 81% ;}
.line::before {  top: 31px ;right: 81% ;}
.line1::after {top: 31px !important; left: 66% !important;}
.line1::before {top: 31px !important; right: 66% !important;}
.contact_line1::after { top: 15px !important; left: 88% !important }
.contact_line1::before { top: 15px !important; right: 88% !important }
.contact_line3::before {width: 50px !important; top: 16px !important; right: 82% !important;}
.contact_line3::after {width: 50px !important; top: 16px !important; left: 82% !important;}
.contact_line2::after {top: 15px !important; left: 78% !important;}
.contact_line2::before {top: 15px !important; right: 78% !important;}
.home_about_left h2::after {  left: 31px; bottom: 49% !important;}
.home_about_left h2::before { left: 262px ; bottom: 49% !important;} 
.nbanner{display: none !important;  }
.mobile_banner{display: block !important;    padding: 0px 0px !important; margin-top: 140px;} 
.top_strip {height: 12px !important;}
.header li a {padding: 20px 10px 11px;}
.width{width: 100% !important;} 
.active_line {border-bottom: solid 1px #CCC; width: 50%; margin: 0px auto 10px;}
.home_about {margin-top: 16px !important; padding: 0 8px;} 
.home_about_left {margin-bottom: 30px !important;} 
.home_about_left h2 {font-size: 26px !important; text-align: center; padding-left: unset;}   
.home_about_left p { letter-spacing: 1px; text-align: justify;margin-bottom: 20px;} 
.foot_left_one {margin-bottom: 35px !important; }
.foot_left_one p {  word-wrap: break-word;  padding-left: 2px;} 
.center {margin: 25px auto auto !important; width: 100% !important;} 
.none{display: none !important;}
.inquiry_form input, .inquiry_form textarea, .inquiry_form select {width: 90%;}
.contact_banner h1 {font-size: 24px;}
.contact_banner h2 {font-size: 21px;} 
.m_text{font-size: 25px !important;} 
.zoetto-get-in-touch h3 {font-size: 18px; margin: 15px;}
.mres-b25{ margin-bottom: 25px !important; }
.products_banner_main { display: flex !important; justify-content: space-evenly !important; flex-direction: column; }
.products_banner_main img{width: 45% !important; } 
.mobile_space{ margin-bottom: 45px;}
.mobile_spaces{margin-bottom: 50px;}
.mobile_space p{margin-top: 10px;}
.mres-t10{ margin-top: 10px;}
.gelato_gry, .gelato_gry { padding: 60px 0px;height: unset !important;} 
.gelato_white, .gelato_white{padding: 60px 0px;height: unset !important;} 
.stix_main, .gelato_main {display: flex; justify-content: space-between; flex-direction: column;}
.stix_thum, .gelato_thum{width: 100%;} 
.stix_thum p{ font-size: 14px; padding: 6px 9px; margin-bottom: 25px; }
.stix_margin p{padding-bottom: 7px !important;}
.mres-b30{margin-bottom: 45px;} 
.br{display: none;}
.stix_thum h5, .gelato_thum h5 {margin: 12px 0px 0px; }
.products_welcome {padding: 0px; }
.menu_top { 
  margin-top: 148px !important; 
}
.menu_tops {
  margin-top: 10px !important; 
}
.menu_top1 {
  margin-top: 135px !important;
}
}
@media only screen and (min-width: 440px) and (max-width:767px) {
  .home_about_right img {width: 65% !important;  display: block !important;  margin: auto !important; }
}
@media screen and (max-width: 767px) {
  .header .logo {display: flex !important; float: unset !important;  padding: 2px 20px; text-decoration: none;justify-content: center !important;}
  .container_width{
    width: 100% !important;
  }

.container{width:90%; margin:0 auto; }
.home_about_left {width: 100%;}
.home_about_right {width: 100%;}
.home_about {display: flex; margin-top: 50px;  flex-wrap: wrap;} 
.foot{padding:20px 0px;}  
.foot_left {width: 100%; display: flex;  flex-wrap: wrap;}
.foot_right {width: 100%;}
.foot_main {flex-wrap: wrap;}
.foot_right h5 { margin: 20px 0px 20px 0px; }
.logo img {width: 140px;margin: 10px auto;}
.box_shadow {box-shadow: 1px 1px 4px 0 rgba(0,0,0,0.1);}
nav ul {width: 100%;display: flex;justify-content: space-evenly;}
nav ul li ul { margin: 0px 8px 0px;}
.page-id-16 .foot_right .gmap .wp-block-image img {
  max-width: 126px;
  margin-bottom: 5px;
}
.page-id-16 .foot_main .foot_right {
  height: 237px;
}
.foot_left_one ul.menu li a {
  padding-left: 2px;
}
.menu-item-180 a{
	padding-left:0px !important;
}
.res_fs18 h2{
	font-size:18px;
}
.product_active_line {
  margin-bottom: 14px;
}
.active_line {
  border-bottom: solid 1px #CCC;
  width: 46%;
  margin: -7px auto 25px;
}
.page-template-contact-template .active_line{
	margin: 0px auto 10px !important;
}
.wpcf7-spinner {
  display: none !important;
}
.contact_design_left h1 {
  margin-top: 24px;
}
	.stix_pro_thum .stix-content {
  padding: 0px 0px !important;
}
	.products_banner p {
  padding: 0 0px !important;
}
}

.inquiry_form input::placeholder{
  opacity: 1 !important;
  color: #000 !important;
  font-weight: 900 !important;
}

/* custom css */
.menu_space .product_submenu:hover {
  background-color: #f2f2f2;
}

.foot_left_one ul.menu {
  list-style-type: none;
  padding-left: 0;
	margin:0;
	
}
.foot_left_one ul.menu li:hover {
  color: white !important;
    -webkit-transform: translateX(5px);
    transform: translateX(5px);
}

.foot_left_one ul.menu li {
    text-align: left;
    letter-spacing: 2px;
    font-size: 14px;
    margin: 0px;
    transition: all .4s ease;
}


