.agroshow_title{
    width: 30%;
    color: #fff;
    background: rgb(222,73,57);
    background: linear-gradient(119deg, rgba(222,73,57,1) 0%, rgba(240,142,56,1) 100%);
 clip-path: polygon(0 0, 100% 10%, 97% 72%, 5% 91%);
}
.number{
    color: rgb(222,73,57);
}
.side-bar{
    position: fixed;
    width: 10%;
    z-index: 5;
    backdrop-filter: blur(2px);
   
    top: 50%;
    left: 92%;
    background-color: #aaaa;
    border-radius: 20px;
    animation: slideAnimation .5s linear;

}
.map-icon{
    width: 50%;
}
.icon{
    width: 70%;
    padding: 20px 0;
}
.icon:hover{
    transform: scale(1.1);
    transition: .2s linear;
    filter: drop-shadow(2px 2px 10px #000);
}
@keyframes slideAnimation {
    0%{
        transform: scale(0);
    }
    
    100%{
        transform: scale(1)
    }
    
}

@media (max-width: 1199px){
    .agroshow_title{
        width: 40%;
        
    }
}
@media (max-width: 991px){
    .agroshow_title{
        width: 50%;
        
    }.icon{
        width: 90%;
        padding: 20px 0;
    }
}
@media (max-width: 767px){
    .agroshow_title{
        width: 70%;
        
    }
    .icon{
        width: 90%;
        padding: 20px 0;
    }
}
@media (max-width: 510px){
    .agroshow_title{
        width: 100%;
        
    }
    .icon{
        width: 70%;
        padding: 20px 0;
    }
    .side-bar{
        position: fixed;
        width: 25%;
        top: 50%;
        left: 80%;
        background-color: #aaaa;
        border-radius: 20px;
        animation: slideAnimation .5s linear;
    
    }
}