.winderCat{
display: grid;
grid-template-columns: 1fr 1fr 1fr;
grid-gap: 10px 10px;
}

.winderCat .winder{
display: grid;
height: 100%;
position: relative;
grid-template-columns: 45% 53%;
align-items: flex-end;
border: 2px solid #ECEFF0;
padding: 20px 0px 70px 24px;
box-sizing: border-box;
transition: all 0.5s ease-out 0s;
background-color: #FFFFFF;
z-index: 1;
}

.winderCat .winder:hover{
box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.2);
}

.winderCat .winder .winderLeft{
position: relative;
z-index: 1;
}

.winderCat .winder .winderRight{
position: relative;
z-index: 0;
text-align: right;
padding-top: 15px;
}

.winderCat .winder .winderRight img{
max-height: 270px;
max-width: 150px;
min-height: 200px;
}

.winderCat .winder .titleWinder{
position: absolute;
top:5px;
left: 24px;
display: block;
color: #6ABA57;
z-index: 1;
}
.winderCat .winder .titleWinder>span{
display: block;

}
.winderCat .winder .titleWinder>span.sp1{
font-size: 28px;
font-weight: 700;
}
.winderCat .winder .titleWinder>span.sp2{
font-size: 20px;
font-weight: 700;
}

.winderCat .spWinder{
display: block;
position: relative;
}

.winderCat .spWinder .zamowFlaga{
font-size: 18px;
font-weight: 700;
color: #FFFFFF;
padding: 12px 24px 12px 24px;
display: inline-block;
background-color: #C9441F;
border-radius: 5px;
border: 1px solid #C9441F;
transition: all 0.5s ease-out 0s;
white-space: nowrap;

}

.winderCat .spWinder .zamowFlagaA{
position: absolute;
bottom: 20px;
left: 24px;
z-index: 2;
}

.winderCat .spWinder .zamowFlaga:hover{
color: #C9441F;
background-color: #FFFFFF;
}

.winderCat .winder .zamowFlaga:before{
display: inline-block;
width: 26px;
height: 24px;
vertical-align: middle;
margin-right: 8px;
background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAYCAYAAADkgu3FAAAABHNCSVQICAgIfAhkiAAAAtlJREFUSEulls9SGkEQxr+eRbBy0dxSlfjnDYyHSOUkieSuTwA+QdYncH2D9QkCT6A5ByOeUpiD5A1Ak6rcApdUibvTqR52dFwWWCt7mpoZ+kd3f909hJzft8qLdfKKh0RUZ+aGUvHx1pdf3Zw/B8276ALMXcYPEDbGS7Q9xEdvWj/b8+xMBX2vvqrErGriQQIYKIr3xKjAlVcMQFTLC5wAGQC8QwIqYwA3AT4FKR+MDRCHxUgdb7Z7g6cA70ETgCQ0HN3uv23/7gnz8sPL16w9XzyRPHE8OpKzq8r68qigfYB8AEsAumAOy2fXTRtSSgGGiYFQLtjwuEZl3/VkFpAZPYI+KJ/dnFKnusY2B4Del003sYkY/ERtJx7ppk2+ewbGuaL4WM46Oyu7gPoEwrLYKrf6ZEHDxPiSKImYG67bcuaGh4ErV22Pzhh/iLCe2BO7Sy7oohjRrhvnsdsczAMCOvTAQ1dADP7M0chXhVIDwPYjULnVNypLJ3YaUO52dlYbVuIAhmBRJ9UU4ncmhNU1qa9skM2PAO9UvKtJBURYEyDAYSlWTbOvVO2+BAAUI3oukpecPwnkCuLy/UrdAp39oYDB3AWpEwmP8fJ/QNZ4p7oaAHQoOShFqi4eSHloeOe5QTq6ratCsaajUdMWaLp/WaMAH5Vb14GcuyC7nhk6ozpPh+mqd2GzQKYsgE0JZzFSYZKvbDFIi4nv4oHtCKT1/tbXG5Go+bJApi1xoe0CHkKdobpx6EpdKUZF0YEAF7E4kH82CzRrPEzKmzGQrrzw964xerawR8y9dCua5lEWKKnFj2DypQ2Zgk3CIYndBmPA4FPblfOIwb2TBjCjT9C+aaqpsIyBZgw9jIF5oUsDAFyQ1g03v5mDT8PLBKbFMDHmgQuFOMga7TNHuWZVvx/XzEZ99nFi14m3UwE2GrkeJ+77IJW3uYDcIHvx0fuAuanjUTCtg2Qp8R8ZQYo3evMVRgAAAABJRU5ErkJggg==') 50% 50% no-repeat;
filter: brightness(0%) invert(100%);
transition: all 0.5s ease-out 0s;
}

.winderCat .winder .zamowFlaga:hover:before{
filter: brightness(100%) invert(0%);
}

.winderCat .winder .cenaSp{
display: block;
margin-bottom: 25px;
}
.winderCat .winder .cenaSp>span{
display: block;
white-space: nowrap;
}
.winderCat .winder .cenaSp>span.txtW{
font-weight: 400;
font-size: 18px;
color: #647883;
}
.winderCat .winder .cenaSp>span.cena{
font-size: 30px;
font-weight: 700;
color: #6ABA57;
}

.winderCat .winder .wysSp{
display: block;
margin-bottom: 25px;
}
.winderCat .winder .wysSp>span{
display: block;
white-space: nowrap;
}
.winderCat .winder .wysSp>span.txtW{
font-weight: 400;
font-size: 18px;
color: #647883;
}
.winderCat .winder .wysSp>span.wys{
font-size: 30px;
font-weight: 700;
color: #647883;
}

@media screen and (max-width:1390px){
.winderCat{grid-template-columns: 1fr 1fr}
}

@media screen and (max-width:1200px){
.winderCat{grid-template-columns: 1fr 1fr 1fr}
}

@media screen and (max-width:1160px){
.winderCat .winder .titleWinder > span.sp1 {font-size: 24px;}
}

@media screen and (max-width:1030px){
.winderCat .winder {grid-template-columns: 1fr;padding: 15px 15px 70px 15px;justify-content: center}
.winderCat .spWinder .zamowFlagaA{margin-left: 30%;}
.winderCat .winder .titleWinder {position: static;order: 1;margin-bottom: 15px;text-align: center}
.winderCat .winder .titleWinder > span {display: inline-block}
.winderCat .winder .titleWinder > span.sp1 {margin-right: 10px;font-size: 23px}
.winderCat .winder .titleWinder > span.sp2 {font-size: 19px;font-weight: 400;}
.winderCat .winder .winderLeft {order: 3;display: flex;flex-wrap: wrap;justify-content: center}
.winderCat .winder .winderRight {order:2;text-align: center}
.winderCat .winder .wysSp {width: 50%;text-align: center}
.winderCat .winder .cenaSp {width: 50%;text-align: center}
.winderCat {grid-template-columns: 1fr 1fr;}
}
@media screen and (max-width:700px){
.winderCat {grid-template-columns: 1fr;justify-items: center;}
.winderCat .winder {max-width: 400px}
.content-text img {max-width: 65%;}
}