SharePoint Online Classic - Increase size of promoted link tiles to 275px using CSS

Promoted links are challenging. Removing one of the color codes made no difference. My problem seems to be with the div.ms-tileview-tile-detailsBox element. If I could get this to be transparent when at rest, my code would be "perfect" and yes, I tried setting background-color:transparent.

Here is my current code and any help is appreciated:

<style type="text/css">

  /*  tile row height */
.ms-promlink-body {
    height: 285px;
    width: 870px;
  }

  /*  tile dimensions, including space between tiles */
.ms-tileview-tile-root {
    width: 285px !important;
    height: 285px !important;
  }

/*  tile overlay dimensions - the standard blue background */
.ms-tileview-tile-content {
    width: 275px !important;
    height: 275px !important;
  }

 /* image dimensions */
.ms-tileview-tile-content img {
    width:275px !important;
    height:275px !important;
}

  /*  title and description overlay dimensions */
div.ms-tileview-tile-detailsBox {
    width: 275px !important;
    height: 275px !important;
    }

 /*  title and description text  */
 .ms-tileview-tile-detailsListMedium {
    height: 275px;
    padding: 4px 7px 7px;
    font-size: 14px;
    line-height: 17px;
  }

.ms-tileview-tile-titleMediumCollapsed {
    height: 275px;
    overflow: hidden;
    vertical-align: bottom;
    top: 275px !important; 
}

  /*  title text when description not shown  */
.ms-tileview-tile-titleTextMediumCollapsed {
    width: 275px;
    height: 40px;
    position: absolute;
    top: 130px; 
    left: 0px;
    padding: 4px 7px;
    font-size: 14px;
    line-height: 17px;
    background-color: rgba(0, 0, 0, 0.3);
  }

 </style>