.box_mod_offer{
background-color: rgba(208,204,204,0.32);
}
.div_mod_offer{
max-width: 100%;
box-sizing:border-box;
}

.ofertyDetailParent{
padding: 60px 0px;
box-sizing:border-box;
}
.ofertyDetailParent .oferta{
width: 33.333%;
display: inline-block;
vertical-align: top;
padding: 8px 8px 20px 8px;
box-sizing:border-box;
}
.ofertyDetailParent .oferta .oferta2{
box-sizing:border-box;
line-height: 1;
position: relative;
transition: box-shadow 0.5s ease-out 0s;
z-index: 0;
}

.ofertyDetailParent .oferta .oferta2 .stopkaOff{
position: absolute;
bottom: -12px;
height:12px;
width: 100%;
}
.ofertyDetailParent .oferta .oferta2 .stopkaOff>div{
width:40%;
height:100%;
background-color: #FFFFFF;
position:relative;
transition: all 0s ease-out 0s;
}

.ofertyDetailParent .oferta .oferta2 .stopkaOff>div.st1{
float: left;
}
.ofertyDetailParent .oferta .oferta2 .stopkaOff>div.st2{
float: right;
}

.ofertyDetailParent .oferta .oferta2 .stopkaOff>div.st1:after{
content: "";
position: absolute;
right: -20px;
height: 180%;
top: -1px;
border-radius: 100%;
box-shadow: 9px 0px 0px 0px rgba(255,255,255,1);
width: 17px;
transform: rotate(-126deg);

}

.ofertyDetailParent .oferta .oferta2 .stopkaOff>div.st2:after{
content: "";
position: absolute;
left: -20px;
height: 180%;
top: -1px;
border-radius: 100%;
box-shadow: 9px 0px 0px 0px rgba(255,255,255,1);
width: 17px;
transform: rotate(-48deg);
transition: box-shadow 0s ease-out 0s;
}

.ofertyDetailParent .offerA{
display: block;
padding: 0px 20px 20px 9px;
background-color: #FFFFFF;
box-sizing:border-box;
transition: box-shadow 0s ease-out 0s;
}

.ofertyDetailParent .oferta .oferta2:hover{
box-shadow:0px 34px 84px 0 rgba(0,0,0,0.43);
z-index: 1;
}

.ofertyDetailParent .oferta2:hover .offerA{
background-color: #f1f0f0;
}

.ofertyDetailParent .oferta .oferta2:hover .stopkaOff>div{
background-color: #f1f0f0;
}

.ofertyDetailParent .oferta .oferta2:hover .stopkaOff>div.st1:after,.ofertyDetailParent .oferta .oferta2:hover .stopkaOff>div.st2:after{
box-shadow: 9px 0px 0px 0px #f1f0f0;
}

.ofertyDetailParent .oferta .oferta2:hover .stopkaOff>div{

}

.ofertyDetailParent .topOffer{
display: table;
width: 100%;
margin-bottom: 5px;
}



.ofertyDetailParent .topOffer .icoOff{
display: table-cell;
vertical-align: middle;
width: 55px;
height: 80px;
position: relative;
transition: all 0.5s ease-out 0s;
}

.ofertyDetailParent .topOffer .icoOff .icoOff1,.ofertyDetailParent .topOffer .icoOff .icoOff2{
display: inline-block;
width: 44px;
height: 41px;
position: absolute;
top:0px;
left:0px;
right:0px;
bottom: 0px;
margin: auto;
background-repeat: no-repeat;
transition: all 0.5s ease-out 0s;
}
.ofertyDetailParent .topOffer .icoOff .icoOff1{
background-position: 0px 0px;
opacity:1;
}
.ofertyDetailParent .topOffer .icoOff .icoOff2{
background-position: 0px -41px;
opacity:0;
}

.ofertyDetailParent .offerA:hover .topOffer .icoOff .icoOff1{
opacity:0;
}
.ofertyDetailParent .offerA:hover .topOffer .icoOff .icoOff2{
opacity:1;
}

.ofertyDetailParent .offerA:hover .topOffer .icoOff{
background-color: #8b2939;
}



.ofertyDetailParent .topOffer .tytulOffer{
display: table-cell;
vertical-align: middle;
box-sizing:border-box;
padding: 0px 0px 0px 16px;
color: #676c6f;
font-size: 15px;
text-transform: uppercase;
line-height: 1.5em;
position: relative;
}
.ofertyDetailParent .topOffer .tytulOffer:after{
content: "";
width: 85%;
height: 1px;
background-color: #f1f0f0;
position: absolute;
left: 16px;
bottom: 0px;
}

.ofertyDetailParent .zajawka{
display: table;
width: 100%;
height: 100px;
}

.ofertyDetailParent .zajawka>span{
display: table-cell;
vertical-align: middle;
box-sizing:border-box;
padding: 0px 20px;
text-align: center;
font-size: 13px;
color: #676c6f;
line-height: 1.7em;
font-weight: 300;
}
.ofertyDetailParent .zajawka>span>span{

}


@media screen and (max-width:1040px){
.ofertyDetailParent {padding: 25px 0px;}
.ofertyDetailParent .oferta {width: 50%;}	
}
@media screen and (max-width:630px){
.ofertyDetailParent .oferta {width: 100%;}
}