Button styles are are not possible to change in ionic 3 project - css

Question

When I try to change ionic button styles on these components even by using !important or using new custom classes it doesn't change anything. Here is the code:
<ion-content padding>
<ion-list>
<button ion-button block class=" custbtnnew" (click)=" SelectImage()">
Select
</button>
<br>
<button style="margin-top:20px;" ion-button block class="custbtnnew" (click)="UploadImage()">
Upload
</button>
</ion-list>
<div *ngIf="images" class="group">
<ion-grid>
<ion-row>
<ion-col col-6 col-md-4 col-lg-3 col-xl-2 class="created_group" *ngFor="let image of images">
<div class="container">
<div class="imgs">
<img class="imgBg"
src="URL">
<button *ngIf="images" ion-button clear (click)="SetProfileImage(image)" class="imgBtn">
Set As Default
</button>
<button *ngIf="images" ion-button clear (click)="Delete(image)" class="imgBtn">
Delete Image
</button>
</div>
</div>
</ion-col>
</ion-row>
</ion-grid>
</div>
</ion-content>
CSS
.custbtnnew {
border-radius: 40px !important;
background: -webkit-gradient(linear, left top, right top, from(#DD2476), to(#FF512F));
background: linear-gradient(to right, #DD2476, #FF512F);
}
What can cause such an issue and how can be it get changed?

Answer 1

you may need a page declaration around your .scss
page-home {
.custbtnnew {
border-radius: 40px !important;
background: -webkit-gradient(linear, left top, right top, from(#DD2476), to(#FF512F));
background: linear-gradient(to right, #DD2476, #FF512F);
}
}