.page-container { height: 100%; display: flex; flex-direction: column; background-color: #b4e8fd; } .flex-row { flex-direction: row; display: flex; width: 100%; } button { border-radius: 10px; font-size: 15px; width: 81%; background: #0b5fa4 0 0 no-repeat padding-box !important; margin: 2%; } .font-body-xsmall-bold { font-size: 0.812rem; line-height: 1.125rem; letter-spacing: 1px; font-family: "Raleway VariableFont"; text-transform: uppercase; } #generateLetter { padding: 5%; margin-bottom: 2.5em; height: auto; } #generateLetter .align-middle { width: 100% !important; } #generateLetter .align-middle .input-field { width: 100%; } #generateLetter .align-middle button { margin-right: 2%; } #generateLetter ::ng-deep .mat-form-field-underline, #generateLetter ::ng-deep .mat-form-field-ripple { background-color: blue !important; } #generateLetter .align-middle { padding: 3% 0%; } #generateLetter .generateLetterL3 { position: absolute; top: 1%; left: 5%; background: white !important; } #generateLetter .generateLetterL0L1 { position: absolute; top: 1%; left: 5%; background: white !important; } #generateLetter .table { width: 100%; table-layout: fixed; word-break: break-all; font-size: 0.688 rem; } .downloadStatus { background: white !important; } .align-right{ align-items: flex-end; width: 50%; } .align-left{ width: 40%; } .icon{ width: 50%; height: 50%; margin:auto 50%; text-align: center; align-items: flex-end; } .content{ border:1px solid black; padding: 1%; }