.header-image { background: url("/assets/images/new-dashboard-bg.png") no-repeat; background-size: cover; margin-top: 70px; min-height: 15em; position: relative; } .header-title { text-align: left; font-size: 1.25rem; font-weight: 300; color: #212121; padding: 0px; } .header-text-container { background: rgba(255, 255, 255, 0.7); position: absolute; bottom: 0px; padding-left: 5em; padding-right: 10em; padding-top: 2em; padding-bottom: 2em; } .explore-dmp-content { padding: 30px 15px; } .main-content { background-color: #f5f5f5; padding-top: 4.68rem; padding-bottom: 3rem; padding-left: 3rem; padding-right: 3rem; margin: 0; display: flex; flex-grow: 1; } .card { background: #ffffff 0% 0% no-repeat padding-box; box-shadow: 0px 3px 6px #00000029; border-radius: 4px; // width: 987px; margin-bottom: 3.75rem; /* height: 407px; */ opacity: 1; } .card-title { text-align: left; font: Bold 20px/30px Roboto; letter-spacing: 0px; color: #212121; padding-left: 40px; /* padding-top: 40px; */ padding-right: 55px; opacity: 1; } .card-content { text-align: left; font-weight: 300; letter-spacing: 0px; color: #212121; padding-left: 40px; padding-top: 36px; // padding-bottom: 36px; padding-right: 55px; opacity: 1; } .clear-icon { cursor: pointer; color: #212121; padding: 0.4rem; } .clear-icon:hover { background-color: #ececec !important; border-radius: 50%; padding: 0.4rem; } .normal-btn { min-width: 162px; max-width: 256px; height: 40px; cursor: pointer; background: var(--primary-color) 0% 0% no-repeat padding-box; box-shadow: 0px 3px 6px #1e202029; border-radius: 30px; border: none; color: #ffffff; opacity: 1; line-height: 1; font-size: 0.87rem; padding: 0.62rem 1.87rem; margin-left: 40px; } .yellow-btn { min-width: 162px; max-width: 256px; height: 40px; cursor: pointer; background: var(--secondary-color) 0% 0% no-repeat padding-box; border-radius: 30px; opacity: 1; border: none; color: #000000; opacity: 1; line-height: 1; font-size: 0.87rem; padding: 0.62rem 1.87rem; font-weight: 700; } .info-text { text-align: left; font-weight: 300; font-size: 1rem; letter-spacing: 0px; color: #212121; } .filter-btn { position: fixed; right: 0px; z-index: 100; width: 37px; } .filter-btn button { color: white; background-color: var(--primary-color-2); width: 37px; height: 45px; } .center-content { width: 100%; min-width: 10rem; margin: auto; padding: 0 15px; text-align: right; font-size: 0.875rem; font-weight: 600; letter-spacing: 0.02rem; color: #2d72d6; cursor: pointer; } .search-form { // font-size: 12px; text-align: left; width: 20rem; } .search-form mat-icon { color: var(--primary-color); } .empty-list { text-align: center; font-weight: 300; font-size: 1.25rem; letter-spacing: 0px; color: #212121; opacity: 0.6; } .pointer:hover { color: var(--primary-color-3); } ::ng-deep .search-form .mat-form-field-wrapper { background-color: white !important; padding-bottom: 0 !important; } ::ng-deep .sort-form .mat-form-field-wrapper { background-color: white !important; padding-bottom: 0 !important; } :host ::ng-deep .mat-form-field-appearance-outline .mat-form-field-infix { padding: 0.3rem 0rem 0.6rem 0rem !important; } :host ::ng-deep .mat-paginator-container { flex-direction: row-reverse !important; justify-content: space-between !important; background-color: #f6f6f6; height: 30px; min-height: 30px !important; } :host ::ng-deep .mat-paginator-page-size { height: 43px; } :host ::ng-deep .mat-icon-button { height: 30px !important; font-size: 12px !important; } :host ::ng-deep .mat-paginator-range-label { margin: 15px 32px 0 24px !important; } :host ::ng-deep .mat-paginator-range-actions { width: auto !important; min-width: 55% !important; min-height: 43px !important; justify-content: space-between; } :host ::ng-deep .mat-paginator-navigation-previous { margin-left: auto !important; } ::ng-deep .mat-ripple-element { background-color: #2e74b649 !important; } ::ng-deep .mat-radio-container { border-radius: 1em; background: white; } ::ng-deep .mat-radio-button .mat-radio-outer-circle { border: 1px solid #aaaaaa; } ::ng-deep .mat-radio-button.mat-accent.mat-radio-checked .mat-radio-outer-circle { border-color: #777777; // border-color: var(--primary-color-3); } ::ng-deep .mat-radio-button.mat-accent .mat-radio-inner-circle { // color: var(--primary-color-3); // background-color: var(--primary-color-3); color: #777777; background-color: #777777; } .mat-radio-button.mat-accent .mat-radio-ripple .mat-ripple-element { background-color: #2e74b649; }