[SalesForce] Image stored in Static resource not getting displayed in lightning component

I have a lightning component that shows the image of a car from the static resource. I have uploaded this zip file which contains images of cars as a Static resource. following is the code of the lightning component.

<aura:component implements="flexipage:availableForAllPageTypes" access="global" >
    <aura:attribute name ="car" type="Car__c" access="public" 
                    default= "{
                              'sObjectType' : 'Car__c',
                              'Name' : 'Aditya',
                              'Picture__c' : '/resource/cars/luxury/ford_mustang.jpeg'}"/>
    
    <lightning:button variant="neutral" >
        <div style="{# 'background-image:url(' + v.car.Picture__c + ') '}" class="innertile">
            <div class="lower-third">
                <h1 class="slds-truncate">{!v.car.Contact__r.Name}</h1>
            </div>
        </div>
    </lightning:button>
</aura:component>

and CSS file

.THIS .tile{
    position:relative;
    display:inline-block;
    width:100%;
    height:500px;
    padding: 1px !important;
}

.THIS .innertile{
    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
    width:100%;
    height:100%;
}

.THIS .lower-third {
    position:absolute;
    bottom:0;
    left:0;
    right:0;
    color:#FFFFFF;
    background-color:rgba(0,0,0, .4);
    padding:6px 8px;
}

Note: Picture__c is a URL(255) field.

and when I run the code, the image is not getting displayed. Please refer to the below screenshot.

am I missing anything? Please advise.