.tmps-preferred-sources {
box-sizing: border-box;
display: grid;
grid-template-columns: 44px minmax(0, 1fr) minmax(190px, auto);
gap: 16px;
align-items: center;
width: 100%;
margin: 42px 0 10px;
padding: 18px 20px;
border: 1px solid rgba(201, 169, 110, .38);
border-radius: 8px;
background:
linear-gradient(135deg, rgba(255, 255, 255, .08), rgba(255, 255, 255, 0) 42%),
radial-gradient(circle at 8% 0%, rgba(201, 169, 110, .30), transparent 32%),
linear-gradient(135deg, #26000a 0%, #650019 58%, #7a1127 100%);
box-shadow:
inset 0 1px 0 rgba(255, 255, 255, .12),
0 18px 44px rgba(34, 12, 17, .14);
color: #fff7eb;
position: relative;
overflow: hidden;
}
.tmps-preferred-sources *,
.tmps-preferred-sources *::before,
.tmps-preferred-sources *::after {
box-sizing: border-box;
}
.tmps-preferred-sources__text {
min-width: 0;
}
.tmps-preferred-sources__mark {
display: flex;
align-items: center;
justify-content: center;
width: 44px;
height: 44px;
border: 1px solid rgba(255, 255, 255, .20);
border-radius: 50%;
background: rgba(255, 255, 255, .10);
color: #f4d894;
font-family: Georgia, 'Times New Roman', serif;
font-size: 23px;
font-weight: 700;
line-height: 1;
}
.tmps-preferred-sources__eyebrow {
display: block;
margin: 0 0 5px;
color: #f3d58a;
font-family: 'Roboto Condensed', 'Roboto', Arial, sans-serif;
font-size: 12px;
font-weight: 700;
line-height: 1.2;
letter-spacing: .08em;
text-transform: uppercase;
}
.tmps-preferred-sources p {
margin: 0;
color: rgba(255, 247, 235, .88);
font-family: 'Roboto', Arial, sans-serif;
font-size: 15px;
line-height: 1.5;
}
.tmps-preferred-sources__action {
display: flex;
flex-wrap: wrap;
gap: 7px;
align-items: center;
justify-content: flex-end;
min-width: 0;
}
.tmps-preferred-sources__action [google-add-preferred-source-btn] {
min-width: 190px;
}
.tmps-preferred-sources__fallback {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: auto;
padding: 0;
border: 0;
border-radius: 0;
color: rgba(255, 247, 235, .70) !important;
font-family: 'Roboto Condensed', 'Roboto', Arial, sans-serif;
font-size: 12px;
font-weight: 600;
line-height: 1.2;
text-decoration: underline !important;
text-decoration-color: rgba(244, 216, 148, .42) !important;
text-underline-offset: .18em;
white-space: nowrap;
}
.tmps-preferred-sources__fallback:hover,
.tmps-preferred-sources__fallback:focus {
color: #ffffff !important;
text-decoration-color: #f4d894 !important;
}
@media (max-width: 720px) {
.tmps-preferred-sources {
grid-template-columns: 38px minmax(0, 1fr);
gap: 13px;
margin-top: 32px;
padding: 16px;
}
.tmps-preferred-sources__action {
grid-column: 1 / -1;
justify-content: flex-start;
padding-left: 51px;
}
.tmps-preferred-sources__mark {
width: 38px;
height: 38px;
font-size: 20px;
}
}
@media (max-width: 420px) {
.tmps-preferred-sources__action {
align-items: flex-start;
flex-direction: column;
}
.tmps-preferred-sources__fallback {
white-space: normal;
}
}