.container{
    max-width: 1320px;
}
.img-sec{
    position: relative;
    overflow: hidden;
    margin-bottom: var(--m40);
}
.attr:hover span.view {
    right: 0;
}
.img-sec img{
    width: 100%;
    height: 350px;
    object-fit: cover;
} 
.head-sec{
    text-align: center;
    margin-bottom: var(--m40);
}
.img-sec h3.title-name {
    position: absolute;
    top: 0;
    left: 0;
    padding: var(--p15);
    color: var(--white-color);
    background: var(--link-color);
    font-size: var(--f20);
}
span.view {
    position: absolute;
    bottom: 0;
    right: -122px;
    padding: var(--p15);
    color: var(--white-color);
    background: var(--secondary-color);
    transition: .4s ease-in-out;
}
.img-sec h3:before {
    border-color: #d67118 transparent transparent;
}.img-sec h3:before {
    position: absolute;
    left: 100%;
    border-style: solid;
    border-width: 44px 12px 0 0;
    border-color: var(--link-color) transparent transparent;
    content: '';
    top: 0;
}