/*
Theme Name: Puenta
Theme URI: www.adhabait4u.co.il
Description: Puenta Custom Theme
Author: Studio Puenta
Author URI: http://www.puenta.co.il/
Version: 1.0
*/

*{padding:0;margin:0;box-sizing: border-box;direction: rtl;font-family: 'Alef', sans-serif;}
.wrapper{max-width: 1300px;margin:0 auto;width: 90%;}
header{height: 100px;}
header .wrapper{display: flex;flex-wrap: wrap;justify-content: space-between;}
header .wrapper .logo{width: 17%;max-width: 220px;}
header .wrapper .logo img{width: 100%;}
header .wrapper .tomail{width: 66%;text-align: center;}
header .wrapper .tomail a{display: block;text-decoration: none;line-height:29px;font-size:22px;padding-top: 11px;}
header .wrapper .tomail a.callnow{font-family: 'Rubik', sans-serif;}
header .wrapper a.tel{text-decoration: none;font-size:22px;line-height:45px;}
header .wrapper .socialwrapper{width: 9%;display: flex;flex-wrap: wrap;justify-content:flex-end;padding-top: 30px;}
header .wrapper .socialwrapper a{height: 30px;width: auto;margin:0 10px;}
header .wrapper .socialwrapper a img{height: 100%;width: auto;}

.cart-contents{position: relative;display: flex !important;flex-flow: column nowrap;justify-content: center;}
.cart-contents:before{font-family: 'Font Awesome 5 Free';font-weight: 900;content: "\f290" !important;font-size: 30px;color: #000;line-height: 100px;text-align: left;}
.cart-contents:hover{text-decoration: none;}
.cart-contents-count{position: absolute;top:76px;right: 16px;transform: translateY(-105%) translateX(25%);font-weight: normal;font-size: 12px;line-height: 22px;height: 22px;width: 22px;vertical-align: middle;text-align: center;color: #000;background: #bbb;border-radius: 50%;padding: 1px;}
.cart{width: 4%;}
.cart ul{list-style: none;}

#mainbanner{height:370px;background-attachment: fixed;background-size: cover;background-position: top center;animation: breath 20s linear infinite;}
@keyframes breath {
  0%   { background-size: 100% auto; }
  50% { background-size: 120% auto; }
  80% { background-size: 110% auto; }
  100% { background-size: 100% auto; }
}
#mainbanner .wrapper{position: relative;}
#mainbanner .inner{position: absolute;left:0;top:100px;right:0;margin:0 auto;}
#mainbanner .inner h1{text-align: center;font-size:35px;line-height:35px;color:#fff;}
#mainbanner .inner a{display:block;text-align: center;padding:10px;color:#fff;text-decoration: none;font-size: 18px;width:25%;margin:0 auto;margin-top:25px;position: relative;-webkit-transform: perspective(1px) translateZ(0);transform: perspective(1px) translateZ(0);-webkit-transition-duration: 0.3s;transition-duration: 0.3s;-webkit-transition-property: transform;transition-property: transform;}
#mainbanner .inner a:before{pointer-events: none;position: absolute;z-index: -1;content: '';top: 100%;left: 5%;height: 10px;width: 90%;opacity: 0;background: -webkit-radial-gradient(center, ellipse, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 80%);background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 80%);-webkit-transition-duration: 0.3s;transition-duration: 0.3s;-webkit-transition-property: transform, opacity;transition-property: transform, opacity;}
#mainbanner .inner a:hover{-webkit-transform: translateY(-5px);transform: translateY(-5px);}
#mainbanner .inner a:hover:before{opacity: 1;-webkit-transform: translateY(5px);transform: translateY(5px);}

#aboutus{padding:50px 0;}
#aboutus .aboutwrapper{display: flex;flex-wrap: wrap;justify-content: space-between;}
#aboutus .aboutwrapper .right{width:15%;}
#aboutus .aboutwrapper .right img{width: 100%;display: block;}
#aboutus .aboutwrapper .left{width:80%;border-right: 1px solid #9e9e9e;padding-right: 3%;}
#aboutus .aboutwrapper .left h3{font-size: 25px;position: relative;margin-bottom: 30px;}
#aboutus .aboutwrapper .left h3:after{height: 1px;margin-top: 0;content: " ";background-color: #000;width: 100px;position: absolute;bottom: 0%;right: 0%;}
#aboutus .aboutwrapper .left p{margin-bottom: 10px;font-size: 18px;}

#products{padding: 65px 0;}
#products h4{text-align: center;font-size: 20px}
#products h3{font-size: 25px;position: relative;margin-bottom: 30px;text-align: center;}
#products h3:after{height: 1px;margin-top: 0;content: " ";background-color: #000;width: 100px;position: absolute;bottom: 0%;right: 0%;left:0;margin:0 auto;}
#products ul{list-style: none;display: flex;flex-wrap: wrap;justify-content:flex-start;}
#products ul li{width: 19%;margin-bottom:35px;margin-left: 1%;}
#products ul li .image{position: relative;overflow: hidden;margin-bottom:10px;}
#products ul li .image img{width: 100%;height: auto;transition: 0.5s ease all;}
#products ul li .image:hover img{transform: scale(1.2);}
#products ul li .image .hover{position: absolute;width: 100%;background-color: rgba(255,255,255,.75);height:0;transition:0.5s ease all;top:-20px;overflow: hidden;padding:10px;text-align: center;}
#products ul li .image .hover p{font-size: 17px;}
#products ul li:hover .hover{height: 100%;top:0;}
#products ul li h4{text-align: center;font-size: 20px;}
#products ul li span.price{display: block;text-align: center;font-size: 17px;}
#products ul li a{display: block;width:60%;padding:10px 0;text-align: center;text-decoration: none;font-size: 20px;color:#fff;margin:0 auto;margin-top: 15px;transition:0.5s ease all;}
#products ul li a:hover{background-color: #000 !important;}

#contactus{padding:20px 0;}
#contactus form{display: flex;flex-wrap: wrap;justify-content:center;width: 70%;margin:0 auto;}
#contactus form .right{width:40%;margin-left:5px;}
#contactus form .left{width:40%;margin-right:5px;}
#contactus form .right label{width:100%;margin-bottom: 10px;}
#contactus form label input{height: 35px;border:none;padding-right: 7px;direction: rtl;text-align: right;font-size:17px;width: 100%;outline: none;margin-bottom: 10px;}
#contactus form textarea{width: 100%;height:80px;resize: none;padding-right: 7px;font-size: 17px;margin-bottom:4px;outline: none;}
#contactus form input[type=submit]{width:50%;font-size: 17px;text-align: center;height: 35px;border:none;background-color: #fff;cursor: pointer;}

footer{padding:40px 0;text-align: center;margin-bottom: 40px;}
footer .logo{width: 120px;margin:0 auto;}
footer .logo img{width: 100%;height: auto;}
footer p{font-size: 18px;}
footer a{display: block;text-decoration: none;color:#000;font-size:20px;font-weight: 600;}
footer a.callnow{font-family: 'Rubik', sans-serif;}
.footersocials{padding:15px 0;position: fixed;width:100%;bottom:0;background-color: #e9dcb8;}
.footersocials h6{text-align: center;font-size: 16px;}
.footersocials .socialwrapper{display: flex;flex-wrap: wrap;justify-content: center;}
.footersocials .socialwrapper a{height: 25px;width: 25px;margin:0 10px;text-align: center;}
.footersocials .socialwrapper a img{height: 100%;width:auto;}
a.wsup{width:100px;height: 70px;background-color: #54b848;background-image: url('img/wsup.svg');background-repeat: no-repeat;background-position: center;top:100px;right:0;position: fixed;background-size: 50%;}

.footerlogo{margin-bottom:40px;padding:10px 0;text-align: center;}
.footerlogo h4{text-align: center;}
.footerlogo img{width: 70px;height: auto;}

.yith-quick-view-content.woocommerce div.summary form.cart{display: flex;width: 100%;}
.yith-wcqv-head .yith-quick-view-close{text-indent: 99999px;}

@media screen and (min-width:1440px) and (max-width:1600px) {}
@media screen and (min-width:1280px) and (max-width:1439px) {
	#mainbanner{height: 380px;}
}
@media screen and (min-width:1025px) and (max-width:1279px) {}
@media screen and (min-width:769px) and (max-width:1024px) {
	#products ul li .image{height: 130px;}
	#mainbanner{animation:none;}
}
@media screen and (min-width:461px) and (max-width:768px) {
	header .wrapper .logo{width: 50%;}
	#mainbanner{height: 370px;animation:none;}
	#aboutus .aboutwrapper .right{width: 30%;}
	#aboutus .aboutwrapper .left{width: 66%;}
	#products ul li{width: 48%;}
}
@media screen and (max-width:460px){
	header{height: 80px;}
	header .wrapper .logo{width:40%;}
	header .wrapper .logo img{width: 100%;padding-top: 10px;}
	header .wrapper a.tel{font-size:18px;line-height:40px;}
	header .wrapper .socialwrapper{justify-content: flex-end;padding-top: 24px;width: 22%;display: none;}
	header .wrapper .socialwrapper a{height: 24px;margin:0 8px;}
	header .wrapper .tomail{width:49%;}
	header .wrapper .tomail a{font-size: 16px;line-height: 16px;padding-top: 15px;}
	.cart-contents:before{line-height: 69px;}
	.cart-contents-count{top:61px;}
	.cart{width: 8%;}
	#mainbanner{height: 310px;background-position: top center;animation:none;}
	#mainbanner .inner{width: 100%;top:50px;}
	#mainbanner .inner a{width: 75%;}
	#contactus form{width: 100%;display: block;}
	#contactus form .right,#contactus form .left{width: 100%;margin:0;}
	#contactus form label{width: 100%;}
	#contactus form label input{margin-bottom: 10px;}
	#contactus form input[type=submit]{width: 100%;}
	#aboutus{padding:20px 0;}
	#aboutus .aboutwrapper .right{width: 100%;text-align: center;}
	#aboutus .aboutwrapper .right img{width: 30%;margin:0 auto;}
	#aboutus .aboutwrapper .left{text-align: center;width:100%;margin-top: 15px;border:none;}
	#aboutus .aboutwrapper .left h3:after{right:0;left:0;margin:0 auto;}
	#products{padding:20px 0;}
	#products ul li{width: 100%;}
	footer{padding:20px 0;}
	.footersocials .socialwrapper a{width: 31px;height: 31px;}
}
@media screen and (min-width:360px) and (max-width:459px){}
@media screen and (min-width:320px) and (max-width:359px){
	header .wrapper a.tel{font-size: 17px;}
	header .wrapper .socialwrapper{width: 24%;}
}