.hero .img_promo{    
    width: 148px;
    height: 148px;
    position: absolute;
    right: 20px;
    bottom: 360px;
    z-index: 2;
}
@media (max-width:1100px) {
    .hero .img_promo{    
        right: 30px;
        bottom: auto;
        top: 60px;
        left: auto;
        z-index: 2;
}   
.hero .container .wrap .left .logo {
        max-width: none;
        text-align: left;
        font-size: 20px;
    }
}
@media (max-width:830px) {
    .hero .img_promo{    
    width: 120px;
    height: 120px;
}
}
@media (max-width: 700px) {
    .hero .container .wrap .right {
        text-align: left;
    }
    .hero .container .wrap .left {
        padding-left: 20px;
    }
}
@media (max-width:600px) {
    .hero .img_promo{    
    width: 100px;
    height: 100px;
        top: 80px;
}
}
@media (max-width:479px) {
    .hero .img_promo{   
    right: 20px;
    bottom: auto;
    top: 100px;
    left: auto;
}  
.hero .container .wrap .right .pre {
        position: relative;
        z-index: 3;
        max-width: 180px;
    }
}