.eventsList { padding: 2rem; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-around; width: 100%; background: radial-gradient( farthest-side at top left, rgba(196, 181, 46, 0.795), transparent ), radial-gradient( farthest-side at bottom right, rgba(196, 181, 46, 0.795), transparent ); } .list{ background-image: rgb(206, 196, 53); // background: // radial-gradient( // farthest-side at bottom left, // rgba(255, 0, 255, 0.5), // transparent // ), // radial-gradient( // farthest-corner at bottom right, // rgba(255, 50, 50, 0.5), // transparent 400px // ), // radial-gradient( // farthest-corner at top left, // rgba(255, 50, 50, 0.5), // transparent 400px // ), // radial-gradient( // farthest-corner at top right, // rgba(196, 181, 46, 0.795), // transparent // ); } .heading { padding: 1rem; display:flex; flex-direction: row; justify-content: space-around; // border: rgb(145, 143, 143) 0.15rem solid; font-family: "Pacifico", cursive; font-size: 2.5rem; color: rgb(255, 255, 255); background: radial-gradient( circle at top left, rgba(5, 5, 5, 0.795), transparent ), radial-gradient( circle at bottom right, rgba(68, 67, 60, 0.795), transparent ); -webkit-text-stroke-width: 1px; letter-spacing: 1px; -webkit-text-stroke-color: black; } .event { // text-overflow: ellipsis; overflow: hidden; // white-space: nowrap; position: relative; padding: 1.5rem; width: 18rem; margin: 1rem; height: 22rem; border-radius: 3rem 0rem 0rem 0rem; } .example-header-image { background-image: url("../../assets/images/logo.jpg"); background-size: cover; } .eventImage { display: flex; flex-direction: row; justify-content: space-around; width: 100%; } // .mat-button.register, .mat-raised-button.register{ // background-color:#327ac7; // } .mat-button.mat-primary, .mat-icon-button.mat-primary, .mat-stroked-button.mat-primary { color: black; } .mat-button.mat-primary:hover, .mat-icon-button.mat-primary:hover, .mat-stroked-button.mat-primary:hover { background-color: #3480eb; color: white; border-radius: 2rem; } .tag { font-size: 50%; font-weight: 100; margin-left: 1rem; height: 1rem; } .controls{ position: absolute; bottom: 1rem; right: 1rem; }