.translation-preview { position: relative; display: flex; flex-flow: row; justify-items: flex-end; color: #ffffff; .translation-section { display: flex; flex: 1 1 auto; font-size: 1.1em; .translate-text { margin: 10px 10px 10px 30px; max-height: 100px; word-break: break-all; white-space: pre-wrap; overflow-y: auto; display: flex; flex: 1 1 auto; } .btn-translation-send { /* min-width: 80px; background-color: rgb(255, 255, 255,0.1); border-radius: 0; border: none;*/ background-color: #ffffff; color: #333333; border-radius: 0; width: 40px; height: 40px; border-radius: 50%; margin-right: 20px; padding: 0; min-width: 40px; align-self: center; } .btn-close-translatebox { height: 100%; stroke: #ffffff; border: none; display: flex; justify-content: center; justify-items: center; margin-left: auto; svg { width: 40px; } } } } ::ng-deep .translationForm { position: relative; display: flex; padding: 0 40px; justify-items: flex-end; align-content: space-between; /*background-color: rgba(30, 167, 185, 0.1); border-top: 1px solid rgba(30, 167, 185, 0.3); border-bottom: 1px solid rgba(30, 167, 185, 0.3);*/ .text-language { display: inline-flex; margin-right: 20px; font-weight: 600; font-size: 1em; justify-content: center; align-items: center; margin-right: 20px; } .select-language { display: inline-flex; width: 300px; flex: 0 1 auto; margin-right: 20px; .mat-form-field-wrapper { width: 100%; line-height: 0.8em; .mat-form-field-infix { padding: 0.2em 0 0; } } .mat-form-field-underline { bottom: 0.8em; } } .mat-slide-toggle { display: inline-flex; width: 120px; height: unset; &.simpleview { margin-right: 20px; margin-left: auto; } &.preview { } } }