Loading...
*/
.loader,
.loader::after,
.loader::before {
background: var(--main-colour);
animation: load1 1s infinite ease-in-out;
width: 1em;
height: 4em;
}
.loader {
color: var(--main-colour);
text-indent: -9999em;
margin: 88px auto;
position: relative;
font-size: 11px;
transform: translateZ(0);
animation-delay: -0.16s;
}
.loader.invert {
color: var(--accent-colour);
}
.loader::after,
.loader::before {
position: absolute;
top: 0;
content: "";
}
.loader::before {
left: -1.5em;
animation-delay: -0.32s;
}
.loader::after {
left: 1.5em;
}
@keyframes load1 {
0%, 100%, 80% {
box-shadow: 0 0;
height: 4em;
}
40% {
box-shadow: 0 -2em;
height: 5em;
}
}
/* html-documentation
Most Read Content
The quick brown fox jumps over the lazy dog. The quick
brown fox jumps over the lazy dog. The quick brown fox
jumps over the lazy dog. The quick brown fox jumps over
the lazy dog. The quick brown fox jumps over the lazy dog.
The quick brown fox jumps over the lazy dog. The quick
brown fox jumps over the lazy dog. The quick brown fox
jumps over the lazy dog. The quick brown fox jumps over
the lazy dog. The quick brown fox jumps over the lazy dog.
The quick brown fox jumps over the lazy dog. The quick
brown fox jumps over the lazy dog.
Commented Content
The quick brown fox jumps over the lazy dog. The quick
brown fox jumps over the lazy dog. The quick brown fox
jumps over the lazy dog. The quick brown fox jumps over
the lazy dog. The quick brown fox jumps over the lazy dog.
The quick brown fox jumps over the lazy dog. The quick
brown fox jumps over the lazy dog. The quick brown fox
jumps over the lazy dog. The quick brown fox jumps over
the lazy dog. The quick brown fox jumps over the lazy dog.
The quick brown fox jumps over the lazy dog. The quick
brown fox jumps over the lazy dog.
*/
.mar-tab {
padding: 0 10px;
}
@media (min-width: 992px) {
.mar-tab {
padding: 0;
}
}
.mar-tab__headings {
list-style: none;
display: flex;
justify-content: flex-start;
align-items: center;
padding: 0;
width: 100%;
position: relative;
margin: 0 20px 24px 0;
overflow-x: auto;
}
.mar-tab__headings::after {
content: "";
height: 1px;
background-color: #9DA0A4;
width: 100%;
display: block;
position: absolute;
bottom: 1px;
}
.mar-tab__heading-line {
display: block;
z-index: 1;
width: 0;
height: 4px;
background: transparent;
}
.mar-tab__heading-link {
font-family: var(--heading-font);
font-size: var(--font-size-l);
font-weight: var(--font-weight-bold);
color: #000000;
margin-top: 15px;
text-decoration: none;
opacity: 0.6;
}
.mar-tab__heading-link:hover {
text-decoration: none;
cursor: pointer;
color: #000000;
}
.mar-tab__heading-real-link {
font-family: var(--body-font);
font-size: var(--font-size-l);
font-weight: var(--font-weight-bold);
color: #000000;
margin-top: 15px;
text-decoration: none;
opacity: 0.6;
}
.mar-tab__heading-real-link:hover {
text-decoration: none;
cursor: pointer;
color: #000000;
}
.mar-tab__heading-item {
display: flex;
flex-direction: column;
align-items: flex-start;
justify-content: flex-start;
font-family: var(--heading-font);
}
.mar-tab__heading-item:not(:last-child) {
margin-right: 30px;
}
.mar-tab__heading-item::before {
content: none;
}
.mar-tab__heading-item.mar-tab--active .mar-tab__heading-line {
width: 100%;
background: var(--accent-colour);
z-index: 1;
}
.mar-tab__heading-item.mar-tab--active .mar-tab__heading-link {
color: #000000;
font-family: var(--heading-font);
opacity: 1;
}
.mar-tab__heading-item.mar-tab--active .mar-tab__heading-real-link {
color: #000000;
opacity: 1;
}
.mar-tab__heading-item h2 {
margin-bottom: 0;
}
.mar-tab__body {
display: none;
margin: 20px;
}
.mar-tab__body.mar-tab--active {
display: block;
}
.nav {
display: flex;
flex-wrap: wrap;
padding-left: 0;
margin-bottom: 0;
list-style: none;
}
.nav-tabs {
border-bottom: 1px solid #DEE2E6;
}
.nav-tabs .nav-item {
margin-bottom: -1px;
}
.nav-tabs .nav-link {
display: block;
padding: 0.5rem 1rem;
border: 1px solid transparent;
border-top-left-radius: 0.25rem;
border-top-right-radius: 0.25rem;
}
.nav-tabs .nav-link:hover {
border-color: #E9ECEF #E9ECEF #DEE2E6;
}
.nav-tabs .nav-link.disabled {
color: #6C757D;
background-color: transparent;
border-color: transparent;
}
.nav-tabs .nav-link.active,
.nav-tabs .nav-item.show .nav-link {
color: #495057;
background-color: #FFFFFF;
border-color: #DEE2E6 #DEE2E6 #FFFFFF;
}
.tab-content > .tab-pane {
display: none;
}
.tab-content > .active {
display: block;
}
.btn-group-vertical {
position: relative;
display: inline-flex;
vertical-align: middle;
flex-direction: column;
align-items: flex-start;
justify-content: center;
}
.admin-links-container {
position: absolute;
z-index: 8;
min-width: 220px;
bottom: 35px;
right: 0;
margin-right: 5px;
background: #FFFFFF;
min-height: 160px;
font-size: var(--font-size-xxs);
border-radius: 3px;
box-shadow: 0 0 5px 2px rgba(0, 0, 0, 0.5);
padding: 10px;
display: none;
grid-template-columns: 50% 50%;
font-family: var(--global-font);
}
.admin-links-container__actions {
float: left;
}
.admin-links-container__actions div {
padding-bottom: 6px;
}
.admin-links-container__actions div a {
color: #188AE2 !important;
font-weight: var(--font-weight-bold);
font-family: var(--global-font);
}
.admin-links-container__info {
display: flex;
flex-direction: column;
color: #6C757D;
letter-spacing: 0;
line-height: 13px;
float: right;
}
.admin-links-container__info div {
display: flex;
flex-direction: column;
padding-bottom: 6px;
}
.admin-links-container__info div .link-label,
.admin-links-container__info div .info-answer {
font-family: var(--global-font);
}
.admin-links-container__info div .link-label {
font-weight: var(--font-weight-bold);
}
.admin-links-container__info div .info-answer {
text-transform: capitalize;
}
.admin-links-container.show {
display: grid;
gap: 5px;
z-index: 9;
}
.admin-links-container .copy-to-article-link-btn {
cursor: pointer;
}
.admin-links-toggler {
position: absolute;
right: 0;
bottom: 0;
background-color: #E5F7D3;
color: #212529;
border-radius: 5px;
display: block;
padding: 3px 6px;
height: 26px;
font-size: var(--font-size-xs);
margin-top: 1px;
margin-right: 5px;
cursor: pointer;
font-family: var(--global-font);
z-index: 3;
}
.admin-social-stats {
display: flex;
padding: 0;
}
.admin-social-stats__item {
display: flex;
align-items: center;
list-style: none;
margin: 0 5px;
}
.admin-social-stats__item svg {
margin-right: 3px;
}
.comments-icon {
position: relative;
font-family: var(--global-font);
font-size: 10px;
color: #000000;
font-weight: var(--font-weight-regular);
margin-top: 4px;
text-align: center;
margin-left: 10px;
float: right;
z-index: 1;
display: inline-block;
background-color: #E6E6E9;
border: 1px solid #CCCFD6;
border-radius: 2px;
padding: 0 5px;
line-height: 16px;
height: 18px;
min-width: 15px;
}
.comments-icon .count {
margin: 0;
padding: 0;
line-height: 17px;
display: flex;
justify-content: center;
align-items: center;
font-size: 10px;
min-width: 15px;
}
.comments-icon::before, .comments-icon::after {
position: absolute;
border-width: 6px 0 0 10px;
border-style: solid;
width: 0;
transform: rotate(270deg);
}
.comments-icon::before {
content: "";
margin-top: -30px;
padding-top: 0;
bottom: -2px;
left: -2px;
border-color: #E6E6E9 transparent;
display: block;
z-index: 3;
}
.comments-icon::after {
content: "";
border-color: #CCCFD6 transparent;
bottom: -5px;
left: -3px;
z-index: 2;
}
.comments-icon:hover {
text-decoration: none;
color: #000000;
}
.mar-upvote {
display: flex;
justify-content: center;
align-items: center;
border: none;
background: transparent;
cursor: pointer;
-webkit-user-select: auto;
user-select: auto;
}
.mar-upvote__icon {
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
width: 22px;
height: 22px;
border-radius: 100%;
background: #2EAA6D;
}
.mar-upvote__icon svg {
width: 11px;
height: 12px;
fill: #FFFFFF;
}
.mar-upvote__icon svg path {
fill: #FFFFFF;
}
.mar-upvote__count {
margin-left: 5px;
font-size: var(--font-size-xs);
font-weight: var(--font-weight-bold);
color: #333333;
}
.mar-upvote:disabled {
cursor: none;
-webkit-user-select: none;
user-select: none;
pointer-events: none;
}
.mar-upvote:disabled .mar-upvote__icon {
background: #9DA0A4;
}
.mar-upvote:disabled .mar-upvote__icon svg {
fill: #FFFFFF;
}
.mar-upvote:disabled .mar-upvote__icon svg path {
fill: #FFFFFF;
}
.mar-form-elements__title {
margin-bottom: 10px;
font-weight: var(--font-weight-bold);
}
.mar-form-elements__form-group {
position: relative;
display: block;
margin-bottom: 15px;
}
.mar-form-elements__form-group--inline {
display: flex;
justify-content: space-between;
align-items: flex-start;
flex-wrap: wrap;
margin-bottom: 15px;
}
.mar-form-elements__form-group:last-child {
margin-bottom: 0;
}
.mar-form-elements__form-control {
width: 100%;
}
.mar-form-elements__form-control:focus, .mar-form-elements__form-control:focus-within, .mar-form-elements__form-control:focus-visible {
outline: none;
border: 1px solid #188AE2;
}
.mar-form-elements__form-group-inline {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 15px;
}
.mar-form-elements__form-check-inline {
display: flex;
justify-content: flex-start;
align-items: center;
position: relative;
cursor: pointer;
padding-left: 25px;
margin-right: 5px;
white-space: nowrap;
}
.mar-form-elements__form-check-inline:hover input ~ .mar-form-elements__form-check-inline__form-check-toggle {
background-color: #CCCCCC;
}
.mar-form-elements__form-check-inline:last-child {
margin-right: 0;
}
.mar-form-elements__form-check-toggle {
position: absolute;
top: 0;
left: 0;
height: 18px;
width: 18px;
background-color: transparent;
border: 1px solid #CCCFD6;
border-radius: 50%;
}
.mar-form-elements__form-check-toggle::after {
content: "";
position: absolute;
display: none;
top: 4px;
left: 4px;
width: 8px;
height: 8px;
border-radius: 50%;
background: #FFFFFF;
box-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
}
.mar-form-elements__form-checkmark-toggle {
position: absolute;
top: 0;
left: 0;
height: 18px;
width: 18px;
background-color: transparent;
border: 1px solid #CCCFD6;
border-radius: 3px;
}
.mar-form-elements__form-checkmark-toggle::after {
content: "";
position: absolute;
display: none;
left: 6px;
top: 1px;
width: 5px;
height: 10px;
border: solid white;
border-width: 0 2px 2px 0;
transform: rotate(45deg);
}
.mar-form-elements__form-group--error .mar-form-elements__form-error {
font-family: var(--global-font);
font-size: var(--font-size-xs);
line-height: 17px;
color: #9D0D13;
display: block;
margin-top: 7px;
margin-left: 5px;
}
.mar-form-elements__form-group--error .mar-form-elements__form-control,
.mar-form-elements__form-group--error .mar-form-elements__form-check-toggle,
.mar-form-elements__form-group--error .mar-form-elements__form-checkmark-toggle {
border: 1px solid #9D0D13;
}
.mar-form-elements__form-group--error-top {
border: 1px solid #9D0D13;
padding: 10px;
width: 100%;
}
.mar-form-elements__form-group--error-top .mar-form-elements__form-error {
margin-top: 0;
margin-bottom: 5px;
}
.mar-form-elements__form-group--error-top .mar-form-elements__form-error:last-child {
margin-bottom: 0;
}
.mar-form-elements__form-check-input {
position: absolute;
opacity: 0;
cursor: pointer;
}
.mar-form-elements__form-check-input:checked ~ .mar-form-elements__form-check-toggle {
background-color: #188AE2;
border: 1px solid #188AE2;
}
.mar-form-elements__form-check-input:checked ~ .mar-form-elements__form-check-toggle::after {
display: block;
}
.mar-form-elements__form-check-input:checked ~ .mar-form-elements__form-checkmark-toggle {
background-color: #188AE2;
border: 1px solid #188AE2;
}
.mar-form-elements__form-check-input:checked ~ .mar-form-elements__form-checkmark-toggle::after {
display: block;
}
.mar-form-elements label, .mar-form-elements__form-check-label {
display: block;
font-family: var(--heading-font);
font-size: var(--font-size-s);
color: #000000;
line-height: 20px;
margin-bottom: 5px;
}
.mar-form-elements__label-title {
font-weight: var(--font-weight-bold);
display: inline-block;
}
.mar-form-elements__form-upload-group {
position: relative;
}
.mar-form-elements__form-upload-group input {
opacity: 0;
width: 0.1px;
height: 0.1px;
position: absolute;
}
.mar-form-elements__form-upload-group label {
position: relative;
padding: 8px 10px;
background: #FFFFFF;
border: 1px dashed var(--accent-colour);
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
color: #595959;
font-size: var(--font-size-xs);
line-height: 17px;
cursor: pointer;
transition: transform 0.2s ease-out;
width: 100%;
height: 85px;
}
.mar-form-elements__form-upload-group label .plus-icon {
background: var(--accent-colour);
display: flex;
align-items: center;
justify-content: center;
width: 24px;
height: 24px;
border-radius: 100%;
color: #000000;
font-size: var(--font-size-m);
z-index: 3;
transition: all 0.8s cubic-bezier(0.075, 0.82, 0.165, 1);
cursor: pointer;
}
.mar-form-elements__form-upload-group label .text {
display: inline-block;
z-index: 3;
margin-top: 5px;
padding: 4px 10px 3px;
}
.mar-form-elements__form-upload-group label img {
position: absolute;
top: 0;
left: 0;
z-index: 2;
width: 100%;
height: 100%;
object-fit: cover;
}
.mar-form-elements__form-upload-group.active label {
border: 2px solid #2EAA6D;
}
.mar-form-elements__form-upload-group.dropped label .plus-icon {
transform: rotate(135deg);
}
.mar-form-elements__form-upload-group.dropped label .text {
background: rgba(255, 255, 255, 0.5);
}
.mar-form-elements__form-upload-group.dropped label .text:hover {
background: rgb(255, 255, 255);
}
.mar-form-elements__form-upload-group.mar-form-elements__form-group--error label {
border: 1px solid #9D0D13;
}
.mar-form-elements input {
display: flex;
flex-direction: row;
align-items: center;
padding: 8px 10px;
background: #FFFFFF;
border-radius: 2px;
border: 1px solid #E6E6E9;
box-sizing: border-box;
font-family: var(--global-font);
font-size: var(--font-size-xs);
color: #333333;
line-height: 20px;
height: 36px;
}
.mar-form-elements input[type=checkbox],
.mar-form-elements input[type=radio] {
box-sizing: border-box;
flex-basis: auto;
margin: 0 10px 0 0;
padding: 0;
width: 22px;
height: 22px;
cursor: pointer;
}
.mar-form-elements select {
-webkit-appearance: none;
appearance: none;
border: 1px solid #E6E6E9;
width: 100%;
padding: 8px 10px;
margin: 0;
font-family: var(--global-font);
font-size: var(--font-size-xs);
color: #000000;
height: 36px;
line-height: 20px;
background: url("https://api.iconify.design/ph/caret-down.svg?color=333") no-repeat 98% center/contain;
background-size: 16px 16px;
}
.mar-form-elements select::after {
content: "";
width: 0;
height: 0;
border-left: 6px solid transparent;
border-right: 6px solid transparent;
border-top: 6px solid #333333;
position: absolute;
top: 40%;
right: 5px;
z-index: 5;
}
.mar-form-elements select:active {
background-size: 16px 16px;
}
.mar-form-elements textarea {
min-height: 85px;
}
.mar-alert {
position: relative;
padding: 10px 15px;
color: #FFFFFF;
opacity: 0;
transform: opacity 0.35s ease-in-out;
}
.mar-alert--active {
opacity: 1;
}
.mar-alert--success {
background: #2EAA6D;
}
.mar-alert--info {
background: #188AE2;
}
.mar-alert--error {
background: #9D0D13;
}
.mar-alert__message {
color: #FFFFFF;
}
.mar-alert__close {
position: absolute;
top: 10px;
right: 10px;
cursor: pointer;
}
.breaking-news-alert {
position: fixed;
bottom: 0;
left: 0;
background: #9D0D13;
width: 100%;
z-index: 9999999;
padding: 10px 11px 12px;
border-top: 1px solid #000000;
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.breaking-news-alert:empty {
display: none;
}
.breaking-news-alert--has-ad {
bottom: 75px;
z-index: 8;
}
@media (min-width: 768px) {
.breaking-news-alert--has-ad {
bottom: 0;
}
}
.breaking-news-alert a {
text-decoration: none;
color: #FFFFFF;
}
.breaking-news-alert__headline {
order: 3;
margin-top: 6;
grid-column: span 2/span 2;
}
.breaking-news-alert__headline h2 {
margin: 0;
line-height: 20px;
}
.breaking-news-alert__headline a {
font-family: var(--global-font);
font-size: var(--font-size-s);
font-weight: var(--font-weight-semibold);
}
.breaking-news-alert__label {
text-transform: uppercase;
margin: 0;
align-self: center;
order: 1;
}
.breaking-news-alert__label a {
font-family: var(--global-font);
font-size: var(--font-size-xs);
font-weight: var(--font-weight-bold);
}
.breaking-news-alert__close {
display: flex;
justify-content: flex-end;
align-items: center;
order: 2;
}
.breaking-news-alert__close svg {
font-size: var(--font-size-l);
}
.breaking-news-alert__close span {
font-family: var(--global-font);
font-size: var(--font-size-xs);
font-weight: var(--font-weight-regular);
display: block;
padding-left: 10px;
}
@media (min-width: 992px) {
.breaking-news-alert {
display: flex;
justify-content: flex-start;
align-items: center;
}
.breaking-news-alert__headline {
order: 2;
grid-column: unset;
margin-top: 0;
}
.breaking-news-alert__headline a {
font-size: var(--font-size-m);
}
.breaking-news-alert__label {
border-right: 1px solid #FFFFFF;
margin-right: 10px;
padding-right: 10px;
order: 1;
}
.breaking-news-alert__close {
order: 3;
margin-left: auto;
}
}
.block {
position: relative;
}
.block-heading {
font-size: var(--font-size-l);
font-weight: var(--font-weight-bold);
font-family: var(--header-font);
color: #000000;
text-transform: var(--text-transform-heading);
margin-bottom: 25px;
margin-top: 0;
padding-top: 0;
cursor: default;
}
.block-heading.heading-double-underline {
display: inline-block;
text-align: center;
font-size: var(--font-size-m);
border-bottom: 4px double #9DA0A4;
margin: auto;
padding-bottom: 0;
margin-bottom: 10px;
}
.block-heading {
line-height: 120%;
width: fit-content;
position: relative;
}
@media (min-width: 768px) {
.block-heading {
font-size: var(--font-size-xl);
}
}
.block-heading::after {
content: "";
height: 4px;
background: var(--accent-colour);
width: 100%;
display: block;
position: absolute;
}
.block-heading--sub {
text-transform: capitalize;
}
#BlockArticleContainer .most-read {
display: block;
}
@media (min-width: 992px) {
#BlockArticleContainer .most-read {
display: block;
}
}
#BlockArticleContainer .block-most-popular-right-column .most-read {
display: block;
}
#po-overlay-articlegate-full-width-scroll-below {
display: none;
}
#po-overlay-articlegate-full-width-scroll-below,
.po-overlay-articlegate-full-width-full-article-scroll-below {
position: -webkit-sticky;
position: sticky;
top: 0;
left: 0;
bottom: -1000px;
width: 100vw;
align-self: start;
margin-left: calc(-100vw + 100%);
margin-right: calc(-100vw + 100%);
z-index: 9999999;
will-change: transform;
}
@media (min-width: 1200px) {
.block-article-display--standard #block-outbrain-inline-pull {
max-width: 700px;
margin-left: auto;
}
}
.block-article-display--live #block-outbrain-inline-pull {
max-width: 920px;
}
.block-article-display__wrapper {
width: 100%;
}
@media (min-width: 768px) {
.block-article-display__wrapper {
margin: auto;
max-width: 992px;
}
}
@media (min-width: 1400px) {
.block-article-display__wrapper {
max-width: 1290px;
}
}
.block-article-display__wrapper .most-read {
margin: 0 10px;
}
@media (min-width: 992px) {
.block-article-display__wrapper .most-read {
margin: 0;
}
}
.block-article-display__article-container {
width: 100%;
}
@media (min-width: 768px) {
.block-article-display__article-container {
margin: auto;
padding-right: 15px;
padding-left: 15px;
}
}
@media (min-width: 1400px) {
.block-article-display__article-container {
padding-right: 10px;
padding-left: 10px;
}
}
.block-article-display__article-container .mar-label__text::after {
display: none;
}
.block-article-display .teads-inread {
margin-bottom: 25px;
}
.block-article-display .article-row-container {
display: flex;
flex-direction: column;
}
@media (min-width: 992px) {
.block-article-display .article-row-container {
display: grid;
grid-template-columns: 1fr 300px;
gap: 20px;
}
}
.block-article-display .article-row-container--right {
display: none;
margin: 0;
}
@media (min-width: 576px) {
.block-article-display .article-row-container--right {
display: grid;
grid-template-columns: 345px 1fr;
gap: 15px;
height: 100%;
align-content: baseline;
position: relative;
}
}
@media (min-width: 768px) {
.block-article-display .article-row-container--right {
grid-template-columns: 1fr;
gap: 0;
margin: 0;
}
}
.block-article-display .article-row-container--right__article-display-page-only {
display: none;
margin: 0;
}
@media (min-width: 576px) {
.block-article-display .article-row-container--right__article-display-page-only {
display: grid;
gap: 15px;
height: 100%;
align-content: baseline;
position: relative;
}
}
@media (min-width: 768px) {
.block-article-display .article-row-container--right__article-display-page-only {
grid-template-rows: auto auto 1fr !important;
gap: 0;
margin: 0;
}
}
.block-article-display .article-row-container--right__article-display-page-only #DFP_on_scroll {
position: -webkit-sticky;
position: sticky;
top: 80px;
min-height: 600px;
}
.block-article-display .article-row-container--right__article-display-page-only .mar-tab__heading-link {
font-size: var(--font-size-l);
font-family: var(--heading-font);
}
@media (min-width: 992px) {
.block-article-display .article-row-container--right__article-display-page-only .mar-tab__heading-link {
font-size: 20px;
}
}
.block-article-display .article-row-container--right .premium-mpu-container {
margin-top: 0;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: center;
}
.block-article-display .article-row-container--right .mar-tab__heading-link {
font-size: var(--font-size-l);
font-family: var(--heading-font);
}
@media (min-width: 992px) {
.block-article-display .article-row-container--right .mar-tab__heading-link {
font-size: var(--font-size-m);
}
}
@media (min-width: 768px) {
.block-article-display .article-row-container--left {
min-width: 418px;
}
}
.block-article-display .article-row-container__column {
display: flex;
flex-direction: column;
}
@media (min-width: 992px) {
.block-article-display .article-row-container__column {
justify-content: center;
}
}
.block-article-display .article-row-container .sponsored-content-footer {
margin-bottom: 25px;
padding: 0 var(--spacing-400);
}
@media (min-width: 768px) {
.block-article-display .article-row-container .sponsored-content-footer {
padding: 0;
}
}
.block-article-display__ugc-cta {
padding: 20px;
background: var(--main-colour);
color: #FFFFFF;
margin-bottom: 25px;
}
.block-article-display__ugc-cta a {
color: #FFFFFF;
text-decoration: underline;
font-weight: var(--font-weight-bold);
}
@media (min-width: 576px) {
.block-article-display__ugc-cta {
padding: 20px 25px;
}
}
@media (min-width: 1200px) {
.block-article-display__ugc-cta {
max-width: 700px;
margin-left: auto;
}
}
.block-article-display__ugc-cta-desc h1,
.block-article-display__ugc-cta-desc p {
color: #FFFFFF;
}
.block-article-display__ugc-cta-desc h1 {
font-weight: var(--font-weight-bold);
margin: 0 0 10px;
}
.block-article-display__ugc-cta-btn {
color: #000000 !important;
display: block;
padding: 5px 10px;
margin: 10px 0;
font-size: var(--font-size-m);
width: 100%;
}
@media (min-width: 576px) {
.block-article-display__ugc-cta-btn {
width: 300px;
}
}
.block-article-display.gbl #article {
display: flex;
flex-direction: column;
}
.block-article-display.gbl .block-article-content {
grid-template-columns: auto;
gap: 0 !important;
}
.block-article-display.gbl .block-article-content .hidden {
display: none !important;
}
.block-article-display.gbl .block-article-content .article-body p,
.block-article-display.gbl .block-article-content .article-body a {
line-height: var(--standard-line-height);
}
@media (min-width: 992px) {
.block-article-display.gbl .block-article-content .article-body p,
.block-article-display.gbl .block-article-content .article-body a {
font-size: var(--font-size-m);
}
}
.block-article-display.gbl .block-article-content .article-body .article-first-paragraph {
font-weight: var(--font-weight-regular);
}
.block-article-display.gbl h2 {
display: inline-block;
font-family: var(--heading-font);
font-size: var(--font-size-xl);
font-weight: var(--font-weight-semibold);
line-height: 1.28;
padding: 11px 0 0;
margin-left: 10px;
margin-right: 10px;
margin-bottom: 20px;
}
@media (min-width: 576px) {
.block-article-display.gbl h2 {
margin-left: 0;
margin-right: 0;
}
}
.block-article-display.gbl h3 {
font-family: var(--heading-font);
font-size: var(--font-size-l);
font-weight: var(--font-weight-semibold);
line-height: 1.6;
margin: 15px 0 0;
}
.block-article-display.gbl .block-article-content__bottom-tags-and-social {
display: flex;
justify-content: space-between;
align-items: center;
gap: 20px;
margin: 0;
}
@media (min-width: 576px) {
.block-article-display.gbl .block-article-content__bottom-tags-and-social {
margin: 0;
}
}
@media (min-width: 1200px) {
.block-article-display.gbl .block-article-content__spacing {
max-width: unset;
}
}
.block-article-display.gbl .block-article-display__article-container {
max-width: 835px;
}
.block-article-display.gbl .block-article-display__article-container .article-tags {
font-family: var(--global-font);
font-size: 11px;
font-weight: var(--font-weight-semibold);
background-color: transparent;
padding: 0;
border: none;
border-bottom: 1px solid var(--accent-colour);
border-radius: 0;
}
.block-article-display.gbl .block-article-display__article-container .social-bar.gbl .social-bar__button {
display: grid;
place-items: center;
width: 36px;
height: 36px;
color: #000000;
background: var(--accent-colour);
}
.block-article-display.gbl .mar-article__headline-container {
display: flex;
flex-direction: column;
}
.block-article-display.gbl .mar-article__headline-container h1 {
margin-top: 5px;
}
@media (max-width: 575px) {
.block-article-display.gbl .mar-article__headline-container .mar-article__article-tags div:nth-child(2),
.block-article-display.gbl .mar-article__headline-container .mar-article__article-tags div:nth-child(3) {
display: block;
}
}
@media (min-width: 576px) {
.block-article-display.gbl .mar-article__headline-container {
display: block;
}
}
.block-article-display.gbl .article-hero {
order: 2;
}
.block-article-display.gbl .article-hero .mar-article-image {
margin-bottom: 20px;
}
.block-article-display.gbl .article-row-container {
display: block;
flex-direction: initial;
order: 3;
}
@media (min-width: 992px) {
.block-article-display.gbl .article-row-container {
display: block;
}
}
@media (min-width: 992px) {
.block-article-display.gbl .mar-article__headline {
font-size: 38px;
}
}
.block-article-display.gbl .block-article-display__is-sponsored {
display: none;
font-size: var(--font-size-s);
font-weight: var(--font-weight-bold);
margin: 15px 10px;
}
@media (min-width: 576px) {
.block-article-display.gbl .block-article-display__is-sponsored {
display: block;
}
}
@media (min-width: 768px) {
.block-article-display.gbl .block-article-display__is-sponsored {
margin-left: 0;
margin-right: 0;
}
}
.block-article-display.gbl .sponsored-content p {
font-family: var(--body-font);
font-weight: var(--font-weight-bold);
}
@media (min-width: 992px) {
.block-article-display.gbl .sponsored-content p {
font-size: var(--font-size-m);
}
}
@media (min-width: 576px) {
.block-article-display.gbl .sponsored-content {
margin-left: 0;
margin-right: 0;
}
}
.block-article-display.gbl .author-details__name-container {
font-size: var(--font-size-xxs);
}
.block-article-display.gbl .author-details__img {
margin-right: 10px;
}
.block-article-display.cpa .skimlinks-disclaimer {
padding: 0 10px;
}
@media (min-width: 768px) {
.block-article-display.cpa .skimlinks-disclaimer {
padding: 0;
}
}
.block-article-display.young-reporter .mar-article__article-tags {
margin-bottom: 10px;
}
@media (min-width: 576px) {
.block-article-display.young-reporter .mar-article__article-tags {
margin-top: 15px;
margin-bottom: 5px;
}
}
.block-article-display.young-reporter .mar-article__timestamp {
padding: 0 10px;
margin-bottom: 15px;
}
@media (min-width: 768px) {
.block-article-display.young-reporter .mar-article__timestamp {
padding: 0;
margin-bottom: 25px;
}
}
.block-article-display.young-reporter .responsive-margins {
margin-bottom: 25px;
}
@media (min-width: 576px) {
.block-article-display.young-reporter .responsive-margins {
margin-bottom: 10px;
}
}
.block-article-display.young-reporter .young-reporter-author {
max-width: 200px;
line-height: 1.2;
}
.block-article-display.young-reporter .block-article-content__info-container {
margin-bottom: 25px;
}
.block-article-display.young-reporter .young-reporter-callout {
display: flex;
flex-direction: column;
align-items: center;
background: #F2F2F3;
padding: 10px;
margin-bottom: 25px;
text-align: center;
order: 3;
}
.block-article-display.young-reporter .young-reporter-callout img {
height: 90px;
}
.block-article-display.young-reporter .young-reporter-callout a {
text-decoration: underline;
}
@media (min-width: 576px) {
.block-article-display.young-reporter .young-reporter-callout {
flex-direction: row;
text-align: left;
}
}
.mar-leaderboard--top {
background-color: #FFFFFF;
padding: 5px;
position: -webkit-sticky;
position: sticky;
top: 0;
z-index: 3000079;
}
@media (min-width: 576px) {
.mar-leaderboard--top {
display: none;
}
}
@media (max-width: 575px) {
#comments-standalone .block-article-content .article-link {
display: flex;
justify-content: center;
}
}
#comments-standalone .article-row-container__column {
display: contents;
}
#comments-standalone .article-row-container--comments {
display: grid;
grid-template-columns: 1fr 300px;
gap: 40px;
}
#comments-standalone .comments-standalone__headline {
display: flex;
flex-direction: column;
}
@media (max-width: 991px) {
#comments-standalone .comments-standalone__headline {
padding: 0 10px;
}
}
#comments-standalone .comments-standalone__headline a span {
background: linear-gradient(to right, var(--accent-colour), var(--accent-colour)), linear-gradient(to right, #9DA0A4, #9DA0A4, #9DA0A4);
background-size: 100% 2px, 0 2px;
background-position: 100% 100%, 0 100%;
background-repeat: no-repeat;
color: #000000;
font-weight: var(--font-weight-bold);
line-height: var(--standard-line-height);
position: relative;
transition: background-size 200ms;
width: auto;
}
#comments-standalone .comments-standalone__headline a span:hover,
#comments-standalone .comments-standalone__headline a span a:active,
#comments-standalone .comments-standalone__headline a span a:focus {
background-size: 0 2px, 100% 2px;
text-decoration: none;
}
#comments-standalone .comments-standalone__headline a span:visited {
color: #595959;
}
#comments-standalone .comments-standalone__headline .timestamp {
color: #333333;
font-size: var(--font-size-xxs);
font-weight: var(--font-weight-regular);
}
#comments-standalone .comments-standalone__headline h1 {
margin-top: 5px;
}
#comments-standalone .comments-standalone__headline .mar-article__headline {
padding: 0;
font-family: var(--headlines-font);
font-size: var(--font-size-xxl);
}
#comments-standalone .comments-standalone__headline .author-container {
padding: 10px 0;
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: 1px solid #E6E6E9;
}
@media (max-width: 575px) {
#comments-standalone .comments-standalone__headline .author-container {
flex-direction: column;
gap: 20px;
align-items: flex-start;
}
}
#comments-standalone .comments-standalone__headline .author-container .social-bar {
width: auto;
}
#comments-standalone .comments-standalone__headline h4 {
margin: 0;
padding: 10px 0;
font-family: var(--body-font);
font-size: var(--font-size-m);
font-weight: var(--font-weight-semibold);
}
@media (max-width: 575px) {
#comments-standalone .comments-standalone .article-link {
display: flex;
justify-content: center;
}
}
#comments-standalone #standard-mpu-2-container {
min-height: 250px;
}
#comments-standalone .article-comments {
max-width: unset;
}
.comment-standalone .block-article-content__info-container {
display: none;
}
@media (min-width: 1400px) {
.comment-standalone {
display: flex;
flex-direction: column;
margin: 15px 0 25px;
gap: 15px;
order: 2;
padding-left: 10px;
padding-right: 10px;
}
}
/* ArticleCommentsViaFoura.html */
.viafoura-comments {
width: 100vw;
padding: 0 10px;
}
@media (min-width: 1200px) {
.viafoura-comments {
max-width: 700px;
margin-left: auto;
}
}
@media (min-width: 576px) {
.viafoura-comments {
width: 100%;
}
}
@media (min-width: 768px) {
.viafoura-comments {
padding: 0;
}
}
.viafoura-comments textarea,
.viafoura-comments input {
color: #000000;
}
.viafoura-comments--inline {
display: flex;
align-items: center;
flex-flow: wrap;
gap: 15px;
}
@media (min-width: 768px) {
.viafoura-comments--inline {
padding: 0;
gap: 25px;
}
}
.viafoura-comments__container {
width: 100%;
}
@media (min-width: 768px) {
.viafoura-comments__container {
margin: auto;
padding-right: 15px;
padding-left: 15px;
}
}
@media (min-width: 1400px) {
.viafoura-comments__container {
padding-right: 10px;
padding-left: 10px;
}
}
.viafoura-comments__container .mar-label__text::after {
display: none;
}
.viafoura-comments__text--inline {
margin-right: 5px;
display: inline-block;
font-family: var(--global-font);
font-weight: var(--font-weight-bold);
font-size: var(--font-size-xs);
height: 22px;
cursor: pointer;
white-space: nowrap;
margin-left: 10px;
background: linear-gradient(to right, var(--accent-colour), var(--accent-colour)), linear-gradient(to right, #9DA0A4, #9DA0A4, #9DA0A4);
background-size: 100% 2px, 0 2px;
background-position: 100% 100%, 0 100%;
background-repeat: no-repeat;
transition: background-size 200ms;
}
.viafoura-comments__text--inline:hover,
.viafoura-comments__text--inline a:active,
.viafoura-comments__text--inline a:focus {
background-size: 0 2px, 100% 2px;
text-decoration: none;
}
.viafoura-comments__text--inline:visited {
color: #595959;
}
.viafoura-comments__moderation-rules {
margin-bottom: 25px;
background: #FFFFFF;
box-shadow: 0 5px 5px rgba(0, 0, 0, 0.05);
border-radius: 5px;
}
.viafoura-comments__moderation-rules--disabled {
background: transparent;
padding-left: 0;
padding-right: 0;
}
.viafoura-comments__moderation-rules-title {
font-size: var(--font-size-m);
font-weight: var(--font-weight-bold);
margin: 0;
padding: 15px 20px;
color: #FFFFFF;
background: var(--main-colour);
text-transform: uppercase;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
}
.viafoura-comments__moderation-rules-body {
padding: 20px;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
border: 1px solid #CCCFD6;
}
.viafoura-comments__moderation-rules-text {
font-size: var(--font-size-s);
color: #333333;
margin-top: 0;
margin-bottom: 25px;
}
.viafoura-comments__moderation-rules-text:last-child {
margin-bottom: 0;
}
.viafoura-comments__moderation-rules .mar-btn {
max-width: 180px;
margin-top: 0;
margin-bottom: 0;
}
.viafoura-comments__order-sort-header {
position: relative;
display: flex;
justify-content: space-between;
}
@media (max-width: 575px) {
.viafoura-comments__order-sort-header {
flex-wrap: wrap;
align-items: flex-start;
margin-bottom: 25px;
gap: 10px;
}
}
.viafoura-comments__order-sort-header .viafoura-comments__order-sort-header-btn {
display: flex;
justify-content: center;
align-items: center;
height: 30px;
white-space: nowrap;
color: #FFFFFF;
background: #188AE2;
padding: 10px 15px;
}
.viafoura-comments__order-sort-header .-sortby {
margin-left: auto;
}
.viafoura-comments__order-sort-header .-sortby .mar-form-elements__form-group---inline {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 0;
width: 230px;
}
.viafoura-comments__order-sort-header .-sortby .mar-form-elements__form-group---inline label {
width: 45%;
margin-bottom: 0;
margin-right: 5px;
}
.viafoura-comments__order-sort-header .-sortby .mar-form-elements__form-group---inline select {
width: 55%;
background-color: #FFFFFF;
}
@media (max-width: 575px) {
.viafoura-comments__order-sort-header .-sortby {
min-width: unset;
margin: 0;
}
.viafoura-comments__order-sort-header .-sortby .mar-form-elements__form-group > label {
text-align: left;
}
}
.viafoura-comments .user-message {
background-color: var(--main-colour);
margin-bottom: 25px;
padding: 20px;
font-size: var(--font-size-m);
color: #FFFFFF;
}
.viafoura-comments .user-message a {
color: #FFFFFF;
text-decoration: underline;
}
.viafoura-comments .user-message p a {
background: linear-gradient(to right, #9DA0A4, #9DA0A4), linear-gradient(to right, var(--accent-colour), var(--accent-colour), var(--accent-colour));
background-size: 100% 2px, 0 2px;
background-position: 100% 100%, 0 100%;
background-repeat: no-repeat;
font-weight: var(--font-weight-bold);
position: relative;
transition: background-size 200ms;
width: auto;
text-decoration: none;
}
.viafoura-comments .user-message p a:hover, .viafoura-comments .user-message p a:active, .viafoura-comments .user-message p a:focus {
background-size: 0 2px, 100% 2px;
}
.viafoura-comments .user-message .post-comment a {
font-weight: var(--font-weight-bold);
}
.viafoura-comments .user-message .post-comment > p:not(:last-child) {
margin-bottom: 15px;
}
.viafoura-comments .user-message .comment-status {
position: relative;
}
.viafoura-comments .user-message .comment-status--bg {
background: #F2F2F3;
padding: 20px;
}
.viafoura-comments .user-message .comment-status span {
display: block;
margin-bottom: 15px;
}
.viafoura-comments .user-message .verification-prompt-container .inner-prompt-container {
margin-bottom: 10px;
}
.viafoura-comments .user-message .verification-prompt-container .show-extra-info {
margin-top: 5px;
cursor: pointer;
}
.viafoura-comments .user-message .verification-prompt-container .extra-info {
margin-top: 15px;
}
.viafoura-comments .user-message .verification-prompt-container .extra-info a {
color: white;
font-weight: normal;
cursor: pointer;
text-decoration: underline;
}
.viafoura-comments .user-message .verification-prompt-container .more-info {
margin-top: 10px;
}
.viafoura-comments .user-message .verification-prompt-container .mar-btn {
display: block;
margin-left: auto;
}
.viafoura-comments .user-message .mar-alert {
width: 100%;
margin-bottom: 10px;
opacity: 1;
}
.viafoura-comments .user-message .mar-alert a {
color: white;
border-bottom: 1px solid var(--accent-colour);
}
.viafoura-comments .user-message .mar-form-elements {
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
}
.viafoura-comments .user-message .mar-form-elements__title {
font-weight: var(--font-weight-regular);
margin-top: 0;
margin-bottom: 8px;
}
.viafoura-comments .user-message .mar-form-elements__title,
.viafoura-comments .user-message .mar-form-elements .post-comment-form-textarea,
.viafoura-comments .user-message .mar-form-elements .post-comment-form-checkbox,
.viafoura-comments .user-message .mar-form-elements .post-comment-form-btn {
flex-basis: 100%;
}
.viafoura-comments .user-message .mar-form-elements .post-comment-form-btn {
text-align: right;
margin-bottom: 20px;
width: 100%;
}
@media (min-width: 768px) {
.viafoura-comments .user-message .mar-form-elements .post-comment-form-checkbox,
.viafoura-comments .user-message .mar-form-elements .post-comment-form-btn {
flex-basis: 50%;
}
.viafoura-comments .user-message .mar-form-elements .post-comment-form-btn {
max-width: 180px;
text-align: right;
margin-left: auto;
}
}
.viafoura-comments .comment-container {
position: relative;
}
.viafoura-comments .comment-container .comment {
padding: 27px 0;
border-bottom: 1px solid #CCCFD6;
}
.viafoura-comments .comment-container .comment__header {
display: flex;
justify-content: flex-start;
align-items: flex-end;
}
.viafoura-comments .comment-container .comment__username {
font-size: var(--font-size-m);
font-weight: var(--font-weight-bold);
color: #000000;
display: flex;
align-items: center;
}
.viafoura-comments .comment-container .comment__suspend-btn {
font-size: var(--font-size-xs);
font-family: var(--global-font);
color: #9D0D13;
background: transparent;
border: none;
margin-bottom: 2px;
}
.viafoura-comments .comment-container .comment .admin-user {
margin-left: 5px;
display: none;
position: relative;
}
@media (min-width: 576px) {
.viafoura-comments .comment-container .comment .admin-user {
display: flex;
justify-content: flex-start;
align-items: center;
}
}
.viafoura-comments .comment-container .comment .admin-user [data-icon="bx:bxs-left-arrow"] {
width: 26px;
height: 26px;
}
.viafoura-comments .comment-container .comment .admin-user [data-icon="bx:bxs-left-arrow"] path {
fill: var(--alt-colour);
}
.viafoura-comments .comment-container .comment .admin-user__text {
display: flex;
align-items: center;
background: var(--alt-colour);
height: 22px;
text-transform: capitalize;
padding-right: 13px;
padding-left: 5px;
position: relative;
left: -6px;
color: #FFFFFF;
font-family: var(--body-font);
font-weight: var(--font-weight-semibold);
white-space: nowrap;
}
.viafoura-comments .comment-container .comment .admin-user__text span {
margin-top: 2px;
}
.viafoura-comments .comment-container .comment .mobile-admin-user {
display: block;
}
@media (min-width: 576px) {
.viafoura-comments .comment-container .comment .mobile-admin-user {
display: none;
}
}
.viafoura-comments .comment-container .comment__posted, .viafoura-comments .comment-container .comment__user-id, .viafoura-comments .comment-container .comment__last-updated {
font-size: var(--font-size-xxs);
font-family: var(--global-font);
color: #595959;
}
.viafoura-comments .comment-container .comment__posted {
margin-left: auto;
}
.viafoura-comments .comment-container .comment__user-id {
margin-top: 5px;
}
.viafoura-comments .comment-container .comment__body {
margin-bottom: 25px;
}
.viafoura-comments .comment-container .comment__text {
display: block;
font-size: var(--font-size-s);
color: #333333;
margin: 10px 0;
white-space: break-spaces;
}
.viafoura-comments .comment-container .comment__text .user-alias {
display: flex;
flex-direction: column;
align-items: flex-start;
margin-bottom: 5px;
}
@media (min-width: 576px) {
.viafoura-comments .comment-container .comment__text .user-alias {
align-items: center;
flex-direction: row;
}
}
.viafoura-comments .comment-container .comment__text .user-alias .admin-user [data-icon="clarity:avatar-solid"] {
height: 17px;
width: 17px;
margin-right: 5px;
}
.viafoura-comments .comment-container .comment__text .user-alias .admin-user [data-icon="clarity:avatar-solid"] path:first-of-type {
fill: #595959;
}
.viafoura-comments .comment-container .comment__text .user-alias .admin-user [data-icon="clarity:avatar-solid"] path:nth-of-type(2n) {
fill: none;
}
.viafoura-comments .comment-container .comment__text blockquote {
font-size: var(--font-size-s);
font-weight: var(--font-weight-regular);
}
@media (min-width: 992px) {
.viafoura-comments .comment-container .comment__text blockquote {
margin-right: 40px;
}
}
.viafoura-comments .comment-container .comment__actions {
display: flex;
justify-content: space-between;
align-items: center;
}
.viafoura-comments .comment-container .comment__actions--left {
text-align: left;
display: flex;
}
.viafoura-comments .comment-container .comment__actions--left button {
margin-right: 5px;
}
.viafoura-comments .comment-container .comment__actions--right {
text-align: right;
display: flex;
position: relative;
}
.viafoura-comments .comment-container .comment__actions--right button {
font-size: var(--font-size-xs);
background: 0;
border: none;
margin-right: 10px;
padding: 0;
}
.viafoura-comments .comment-container .comment__actions--right .edit-comment {
color: #2EAA6D;
}
.viafoura-comments .comment-container .comment__actions--right .delete-comment {
color: #9D0D13;
}
.viafoura-comments .comment-container .comment__actions--right .comment-report {
margin-right: 20px;
color: #595959;
}
.viafoura-comments .comment-container .comment__actions--right .comment-report:hover {
color: #9D0D13;
cursor: pointer;
}
.viafoura-comments .comment-container .comment__actions--right .mar-upvote {
margin-right: 0;
}
.viafoura-comments .comment-container .comment--left button:last-child, .viafoura-comments .comment-container .comment--right button:last-child {
margin-right: 0;
}
.viafoura-comments .comment-container .comment .comment {
border-bottom: none;
background: transparent;
padding: 20px;
padding-bottom: 0;
margin: 25px 0 0;
border-top: 1px solid #CCCFD6;
}
.viafoura-comments .comment-container .comment .comment__text {
color: #000000;
white-space: pre-line;
}
.viafoura-comments .comment-container .comment .comment__last-updated {
color: #595959;
}
.viafoura-comments .comment-container .comment .nested-comment {
padding-left: 10px;
padding-right: 0;
}
.viafoura-comments .comment-container .comment .comment-quote {
font-size: var(--font-size-s);
font-weight: var(--font-weight-regular);
padding: 10px 0 10px 10px;
}
.viafoura-comments .comment-container .comment .comment-quote strong {
display: block;
font-weight: var(--font-weight-bold);
padding-bottom: 5px;
}
.viafoura-comments .comment-container .comment .removed-indentation {
left: -30px;
}
.viafoura-comments .report-container .mar-alert {
margin-bottom: 20px;
}
.viafoura-comments .report-container .report-form {
position: relative;
}
.viafoura-comments .report-container .report-form__header {
font-size: var(--font-size-s);
font-weight: var(--font-weight-bold);
color: #000000;
margin-top: 0;
margin-bottom: 15px;
display: flex;
justify-content: space-between;
align-items: center;
}
.viafoura-comments .report-container .report-form__cancel {
font-size: var(--font-size-xs);
color: #333333;
margin: 0;
padding: 0;
}
.viafoura-comments .report-container .report-form__submit {
margin-left: auto;
}
.viafoura-comments .reply-container .reply-form {
position: relative;
}
.viafoura-comments .reply-container .reply-form__header {
display: flex;
justify-content: flex-start;
align-items: center;
margin-bottom: 15px;
}
.viafoura-comments .reply-container .reply-form__username {
width: 49%;
font-size: var(--font-size-s);
font-weight: var(--font-weight-bold);
color: #000000;
}
.viafoura-comments .reply-container .reply-form__quote {
position: relative;
}
.viafoura-comments .reply-container .reply-form__quote blockquote {
margin-top: 0;
margin-bottom: 0;
color: #595959;
}
@media (min-width: 992px) {
.viafoura-comments .reply-container .reply-form__quote blockquote {
margin-right: 40px;
}
}
.viafoura-comments .reply-container .reply-form__quote blockquote [data-icon="clarity:avatar-solid"] {
height: 17px;
width: 17px;
margin-right: 5px;
}
.viafoura-comments .reply-container .reply-form__quote blockquote .user-alias {
display: flex;
flex-direction: column;
align-items: flex-start;
margin-bottom: 5px;
}
@media (min-width: 576px) {
.viafoura-comments .reply-container .reply-form__quote blockquote .user-alias {
align-items: center;
flex-direction: row;
}
}
.viafoura-comments .reply-container .reply-form__quote strong {
color: #595959;
}
.viafoura-comments .reply-container .reply-form__quote-user {
font-weight: var(--font-weight-semibold);
margin-bottom: 15px;
}
.viafoura-comments .reply-container .reply-form__quote-content {
font-weight: var(--font-weight-regular);
margin-bottom: 25px;
}
.viafoura-comments .reply-container .reply-form__quote-user, .viafoura-comments .reply-container .reply-form__quote-content {
font-size: var(--font-size-s);
color: #333333;
}
.viafoura-comments .reply-container .reply-form__cancel {
font-size: var(--font-size-xs);
font-weight: var(--font-weight-bold);
color: #333333;
margin-left: auto;
width: 49%;
text-align: right;
}
.viafoura-comments .reply-container .reply-form__reply-to {
font-size: var(--font-size-xs);
font-family: var(--global-font);
margin-bottom: 5px;
}
.viafoura-comments .reply-container .reply-form__submit {
margin-left: auto;
}
.viafoura-comments .edit-container .edit-form {
position: relative;
}
.viafoura-comments .edit-container .edit-form__header {
display: flex;
justify-content: flex-start;
align-items: center;
margin-top: 0;
margin-bottom: 15px;
}
.viafoura-comments .edit-container .edit-form__title {
width: 49%;
font-size: var(--font-size-s);
font-weight: var(--font-weight-bold);
color: #000000;
}
.viafoura-comments .edit-container .edit-form__cancel {
font-size: var(--font-size-xs);
font-weight: var(--font-weight-bold);
color: #333333;
margin-left: auto;
width: 49%;
text-align: right;
}
.viafoura-comments .edit-container .edit-form__textarea-label {
font-size: var(--font-size-xxs);
font-family: var(--global-font);
margin-bottom: 10px;
color: #595959;
}
.viafoura-comments .edit-container .edit-form__submit {
margin-left: auto;
}
.viafoura-comments .delete-container .delete-alert {
display: flex;
justify-content: space-between;
align-items: center;
padding: 15px 20px;
margin: 15px 0;
}
.viafoura-comments .delete-container .delete-alert__actions {
display: flex;
justify-content: space-between;
align-items: center;
}
.viafoura-comments .delete-container .delete-alert__confirm {
margin-right: 15px;
}
.viafoura-comments .delete-container .delete-alert__cancel {
color: #FFFFFF;
font-size: var(--font-size-xs);
font-weight: var(--font-weight-bold);
}
.viafoura-comments .report-container,
.viafoura-comments .reply-container,
.viafoura-comments .edit-container {
margin-top: 25px;
background: #F2F2F3;
padding: 20px;
}
.viafoura-comments .mar-btn:hover,
.viafoura-comments .viafoura-comments__order-sort-header-btn:hover {
text-decoration: none;
}
.viafoura-comments .comment-status a {
font-weight: var(--font-weight-bold);
}
/* OTP Mobile verification */
.mar-modal__body select {
border-radius: 5px;
margin-top: 5px;
width: 100%;
}
.mar-modal__body .mobile-number {
border-radius: 5px;
margin-top: 5px;
}
.mar-modal__body input[type=number]::-webkit-inner-spin-button,
.mar-modal__body input[type=number]::-webkit-outer-spin-button {
margin: 0;
}
.mar-modal__body .otp-error-text {
color: #9D0D13;
font-weight: 700;
line-height: 22.4px;
}
.mar-modal__body .modal-email-info {
margin-top: 10px;
}
.otp-fields-container {
display: flex;
justify-content: flex-start;
gap: 10px;
}
.otp-fields-container .otp-field {
height: 36px;
width: 36px;
min-width: 36px;
padding: 5px 0;
text-align: center;
}
#otp-resend {
cursor: pointer;
text-decoration: underline;
}
.otp-resend-msg-1,
.otp-resend-msg-2,
.otp-resend-msg-3 {
font-weight: var(--font-weight-bold);
}
.otp-resend-msg-1,
.otp-resend-msg-2 {
color: #188AE2;
}
.otp-resend-msg-3 {
color: #9D0D13;
}
/* End OTP Mobile verification */
/* Viafoura instance */
.viafoura * {
font-family: var(--global-font) !important;
}
.viafoura .user-message {
margin-bottom: 25px;
}
.viafoura .user-message .post-comment a {
font-weight: var(--font-weight-bold);
}
.viafoura .user-message .post-comment > p:not(:last-child) {
margin-bottom: 15px;
}
.viafoura .user-message .comment-status {
position: relative;
}
.viafoura .user-message .comment-status span {
display: block;
margin-bottom: 15px;
}
.viafoura .user-message .verification-prompt-container {
color: white;
}
.viafoura .user-message .verification-prompt-container .inner-prompt-container {
background-color: var(--main-colour);
margin-bottom: 10px;
padding: 10px;
}
.viafoura .user-message .verification-prompt-container .show-extra-info {
margin-top: 5px;
cursor: pointer;
}
.viafoura .user-message .verification-prompt-container .extra-info {
margin-top: 15px;
}
.viafoura .user-message .verification-prompt-container .extra-info a {
color: white;
font-weight: normal;
cursor: pointer;
text-decoration: underline;
}
.viafoura .user-message .verification-prompt-container .more-info {
margin-top: 10px;
}
.viafoura .user-message .verification-prompt-container .mar-btn {
display: block;
margin-left: auto;
}
.viafoura .user-message .mar-alert {
width: 100%;
margin-bottom: 10px;
opacity: 1;
}
.viafoura .user-message .mar-alert a {
color: white;
border-bottom: 1px solid var(--accent-colour);
}
.viafoura .realtime-bar .vf-button.is-cta {
padding: 2px 20px !important;
background-color: var(--accent-colour) !important;
border-radius: 20px;
color: #000000 !important;
font-family: var(--body-font);
font-size: var(--font-size-xs);
font-weight: var(--font-weight-semibold);
text-transform: capitalize;
}
.viafoura .vf-post-form__sign-out-action, .viafoura .vf-post-form__sign-in-action {
text-decoration: underline;
text-decoration-thickness: 1px;
-webkit-text-decoration-color: var(--accent-colour);
text-decoration-color: var(--accent-colour);
text-underline-offset: 3px;
}
.viafoura .vf-post-form__sign-out-action:hover, .viafoura .vf-post-form__sign-in-action:hover {
-webkit-text-decoration-color: var(--accent-colour) !important;
text-decoration-color: var(--accent-colour) !important;
}
.viafoura .vf-follow-button {
border: 1px solid #CCCFD6 !important;
border-radius: 100px !important;
color: #333333 !important;
font-family: var(--body-font) !important;
font-size: var(--font-size-xs) !important;
font-weight: var(--font-weight-bold) !important;
height: 24px !important;
line-height: var(--standard-line-height) !important;
padding: 2px 15px !important;
text-transform: capitalize !important;
}
.viafoura .vf-follow-button:hover {
border-color: #CCCFD6 !important;
color: #333333 !important;
}
.viafoura .vf-follow-button .vf-follow-button__text {
display: block;
}
.viafoura .vf-load-more__button {
color: #000000 !important;
}
.viafoura .vf-load-more__button .vf-loader-button__content {
line-height: var(--standard-line-height) !important;
}
.viafoura .vf-load-more__button:hover {
color: #000000 !important;
}
.viafoura .vf-settings-button:hover:not([disabled]) {
color: #000000 !important;
}
.viafoura .vf3-comments__bottom-action button {
text-transform: lowercase !important;
}
.viafoura .vf3-comments__bottom-action button::first-letter {
text-transform: uppercase !important;
}
.viafoura .vf-terms_and_conditions {
color: #595959 !important;
font-size: var(--font-size-xs) !important;
margin-bottom: 20px;
}
.viafoura .vf-terms_and_conditions a:hover, .viafoura .vf-terms_and_conditions a:active, .viafoura .vf-terms_and_conditions a:focus {
background-size: 0 2px, 100% 2px;
text-decoration: none;
}
.viafoura .vf-terms_and_conditions a:visited {
color: #595959;
}
.viafoura .vf-terms_and_conditions a span {
background: linear-gradient(to right, var(--accent-colour), var(--accent-colour)), linear-gradient(to right, #9DA0A4, #9DA0A4, #9DA0A4);
background-size: 100% 2px, 0 2px;
background-position: 100% 100%, 0 100%;
background-repeat: no-repeat;
color: #000000;
font-weight: var(--font-weight-bold);
line-height: var(--standard-line-height);
position: relative;
transition: background-size 200ms;
width: auto;
}
.viafoura .vf-terms_and_conditions a span:hover,
.viafoura .vf-terms_and_conditions a span a:active,
.viafoura .vf-terms_and_conditions a span a:focus {
background-size: 0 2px, 100% 2px;
text-decoration: none;
}
.viafoura .vf-terms_and_conditions a span:visited {
color: #595959;
}
.viafoura .vf-profile-header__button-container button {
border: 1px solid #CCCFD6 !important;
border-radius: 100px !important;
color: #333333 !important;
display: block;
font-family: var(--body-font) !important;
font-size: var(--font-size-xs) !important;
font-weight: var(--font-weight-bold) !important;
height: 24px !important;
line-height: var(--standard-line-height) !important;
padding: 0 15px !important;
text-transform: capitalize !important;
}
.viafoura .vf-profile-header__button-container button:hover {
border-color: #CCCFD6 !important;
color: #333333 !important;
}
.viafoura .vf-accent-border-colour {
border-color: var(--accent-colour) !important;
}
.viafoura .vf-expanding-hover-light::before {
border-color: var(--accent-colour) !important;
}
.viafoura .vf-dropdown-button {
border: none !important;
}
.viafoura .vf-dropdown-button:hover {
background-color: var(--accent-colour) !important;
}
.viafoura .vf-dropdown-button:hover span {
color: #000000 !important;
}
.viafoura .vf-dropdown-button svg {
stroke: #000000 !important;
}
.viafoura .vf-dropdown.focused > .vf-dropdown__text-trigger {
background-color: var(--accent-colour) !important;
}
.viafoura .vf-icon-mod {
color: #FFFFFF !important;
background-color: #2EAA6D !important;
font-family: var(--global-font) !important;
font-size: 11px !important;
}
.viafoura .vf-custom-badge {
background-color: #188AE2 !important;
border-radius: 0 !important;
padding: 2px 5px !important;
}
.viafoura .vf-custom-badge--Staff {
background-color: #06558E !important;
}
.viafoura .vf-custom-badge--Subscriber {
background-color: var(--alt-colour) !important;
}
.viafoura .vf-custom-badge span {
color: #FFFFFF !important;
font-family: var(--global-font) !important;
font-size: 11px;
}
.viafoura .vf-pin-badge {
display: inline-block;
border: 1px solid #F5CE68;
background: #FFFFFF;
padding: 0 10px 0 8px;
color: #333333;
}
.viafoura .vf-pin-badge svg {
fill: #333333;
width: 12px;
height: 14px;
aspect-ratio: 6/7;
}
.viafoura .vf-pin-badge__text {
font-family: var(--global-font);
font-size: 11px;
font-weight: var(--font-weight-semibold);
}
.viafoura .vf3-comment--pinned::before {
background-color: transparent !important;
}
.viafoura .vf-post-name-button__username {
font-family: var(--header-font) !important;
color: #333333 !important;
font-size: var(--font-size-m) !important;
font-weight: var(--font-weight-bold) !important;
}
.viafoura .vf-editors-pick-badge__text {
color: #8E1D84 !important;
font-family: var(--global-font) !important;
font-size: 11px !important;
font-weight: var(--font-weight-semibold) !important;
}
/* End Viafoura instance */
/* Viafoura Ads */
.mar-leaderboard--top {
position: -webkit-sticky;
position: sticky;
top: 0;
z-index: 3000079;
}
@media (min-width: 576px) {
.mar-leaderboard--top {
display: none;
}
}
/* End Viafoura Ads */
/* ViafouraCommentsDisplay.html */
.viafoura-comments-standalone__headline {
display: flex;
flex-direction: column;
}
@media (max-width: 991px) {
.viafoura-comments-standalone__headline {
padding: 0 10px;
}
}
.viafoura-comments-standalone__headline a span {
background: linear-gradient(to right, var(--accent-colour), var(--accent-colour)), linear-gradient(to right, #9DA0A4, #9DA0A4, #9DA0A4);
background-size: 100% 2px, 0 2px;
background-position: 100% 100%, 0 100%;
background-repeat: no-repeat;
color: #000000;
font-weight: var(--font-weight-bold);
line-height: var(--standard-line-height);
position: relative;
transition: background-size 200ms;
width: auto;
}
.viafoura-comments-standalone__headline a span:hover,
.viafoura-comments-standalone__headline a span a:active,
.viafoura-comments-standalone__headline a span a:focus {
background-size: 0 2px, 100% 2px;
text-decoration: none;
}
.viafoura-comments-standalone__headline a span:visited {
color: #595959;
}
.viafoura-comments-standalone__headline .timestamp {
color: #333333;
font-family: var(--global-font);
font-size: var(--font-size-xxs);
font-weight: var(--font-weight-bold);
text-transform: uppercase;
}
.viafoura-comments-standalone__headline h1 {
margin-top: 5px;
}
.viafoura-comments-standalone__headline .mar-article__headline {
padding: 0;
font-family: var(--headlines-font);
font-size: var(--font-size-xxl);
font-weight: var(--font-weight-bold);
}
.viafoura-comments-standalone__headline .author-container {
padding: 10px 0;
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: 1px solid #E6E6E9;
}
@media (max-width: 575px) {
.viafoura-comments-standalone__headline .author-container {
flex-direction: column;
gap: 20px;
align-items: flex-start;
}
}
.viafoura-comments-standalone__headline .author-container .social-bar {
width: auto;
}
.viafoura-comments-standalone__headline h4 {
margin: 0;
padding: 10px 0;
font-family: var(--body-font);
font-size: var(--font-size-m);
font-weight: var(--font-weight-semibold);
}
@media (max-width: 575px) {
.viafoura-comments-standalone .article-link {
display: flex;
justify-content: center;
}
}
.viafoura-comments-standalone .viafoura-container {
display: flex;
flex-direction: column;
}
@media (min-width: 992px) {
.viafoura-comments-standalone .viafoura-container {
display: grid;
grid-template-columns: 1fr 300px;
gap: 40px;
}
}
.viafoura-comments-standalone .viafoura-container--right {
display: none;
margin: 0;
}
@media (min-width: 768px) {
.viafoura-comments-standalone .viafoura-container--right {
display: grid;
height: 100%;
align-content: baseline;
position: relative;
grid-template-rows: auto auto 1fr !important;
gap: 0;
margin: 0;
}
}
.viafoura-comments-standalone .viafoura-container--right #DFP_on_scroll {
position: -webkit-sticky;
position: sticky;
top: 80px;
min-height: 600px;
}
.viafoura-comments-standalone .viafoura-container--right .premium-mpu-container {
margin-top: 0;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: center;
}
.viafoura-comments-standalone .viafoura-container--right .mar-tab__heading-link {
font-size: var(--font-size-l);
font-family: var(--heading-font);
}
@media (min-width: 992px) {
.viafoura-comments-standalone .viafoura-container--right .mar-tab__heading-link {
font-size: var(--font-size-m);
}
}
@media (min-width: 768px) {
.viafoura-comments-standalone .viafoura-container--left {
min-width: 418px;
}
}
.viafoura-comments-standalone .viafoura-container__column {
display: flex;
flex-direction: column;
}
@media (min-width: 992px) {
.viafoura-comments-standalone .viafoura-container__column {
justify-content: center;
}
}
.viafoura-comments-standalone #standard-mpu-2-container {
min-height: 250px;
}
.viafoura-comments-standalone .viafoura-comments {
max-width: unset;
}
.viafoura-comments-standalone .viafoura .vf-comment-header {
margin: 20px 0;
}
.viafoura-comments-standalone .viafoura .vf-comment-header .vf-heading-text {
font-size: 0px;
}
.viafoura-comments-standalone .viafoura .vf-comment-header .vf-heading-text::after {
content: "Comments";
border-bottom: 4px solid var(--accent-colour);
font-family: var(--header-font);
font-size: var(--font-size-l) !important;
font-weight: var(--font-weight-bold);
visibility: visible;
}
.viafoura-comments-standalone .viafoura .vf-comment-header .vf-button.is-link {
font-size: var(--font-size-xxs) !important;
color: #333333 !important;
text-transform: capitalize !important;
font-family: var(--body-font);
padding: 0 10px !important;
}
.viafoura-comments-standalone .viafoura .vf-tabbed-nav .vf-nav-button span {
font-family: var(--body-font) !important;
font-weight: var(--font-weight-bold);
text-transform: capitalize;
font-size: var(--font-size-m);
}
.viafoura-comments-standalone .viafoura .vf-dropdown-button--icon-right .vf-dropdown-button__text {
text-transform: capitalize !important;
font-family: var(--global-font);
color: #000000;
}
.viafoura-comments-standalone .viafoura .vf3-conversations-list--comments--list {
background: #F2F2F3;
margin-bottom: 10px;
}
.viafoura-comments-standalone .viafoura .vf3-conversations-list--comments--list .vf-content-layout {
padding: 10px !important;
}
.viafoura-comments-standalone .viafoura .vf3-conversations-list--comments--list .vf-content-layout__right .vf-label {
display: block !important;
font-size: var(--font-size-xxs) !important;
}
.viafoura-comments-standalone .viafoura .vf3-conversations-list--comments--list .vf-content-layout__right .vf-comment__read-more:hover {
color: #333333 !important;
}
.viafoura-comments-standalone .viafoura .vf3-conversations-list--comments--list .vf-comment__edited-badge {
background-color: #FFFFFF !important;
border-radius: 3px;
padding: 2px 5px !important;
}
.viafoura-comments-standalone .viafoura .vf3-conversations-list--comments--list .vf-comment__edited-badge span {
font-family: var(--global-font) !important;
color: #595959 !important;
font-size: 11px !important;
line-height: 1 !important;
}
.viafoura-comments-standalone .viafoura .vf3-conversations-list--comments--list .vf-deleted-badge {
background-color: #9D0D13 !important;
border-radius: 3px;
padding: 2px 5px !important;
}
.viafoura-comments-standalone .viafoura .vf3-conversations-list--comments--list .vf-deleted-badge span {
font-family: var(--global-font) !important;
color: #FFFFFF !important;
font-size: 11px !important;
line-height: 1 !important;
}
.viafoura-comments-standalone .viafoura .vf3-conversations-list--pinned--list {
background: #F2F2F3;
margin-bottom: 10px;
border: 1px solid #F5CE68;
}
.viafoura-comments-standalone .viafoura .vf3-conversations-list--pinned--list .vf3-comment--pinned .vf-post-name-button__username {
font-family: var(--headlines-font);
color: #333333;
font-size: var(--font-size-m);
font-weight: var(--font-weight-bold);
}
.viafoura-comments-standalone .viafoura .vf3-conversations-list--pinned--list .vf3-comment--pinned::before {
display: none;
}
.viafoura-comments-standalone .viafoura .vf-button span {
font-family: var(--body-font);
}
.viafoura-comments-standalone .viafoura .vf-button span .vf-reply-to__reply-name,
.viafoura-comments-standalone .viafoura .vf-button span .vf-reply-to--entered {
color: #000000 !important;
}
.viafoura-comments-standalone .viafoura .vf-button span .vf-reply-to__reply-name:hover,
.viafoura-comments-standalone .viafoura .vf-button span .vf-reply-to--entered:hover {
color: #000000 !important;
}
.viafoura-comments-standalone .viafoura .vf-reply-to__reply-name,
.viafoura-comments-standalone .viafoura .vf-reply-to--entered {
color: #000000 !important;
}
.viafoura-comments-standalone .viafoura .vf-reply-to__reply-name:hover,
.viafoura-comments-standalone .viafoura .vf-reply-to--entered:hover {
color: #000000 !important;
}
.viafoura-comments-standalone .viafoura .vf-post-details__time {
font-family: var(--global-font);
font-size: 11px !important;
font-weight: var(--font-weight-semibold) !important;
color: #333333 !important;
}
.viafoura-comments-standalone .viafoura .vf-button.vf-reply-to {
font-family: var(--global-font);
color: #333333 !important;
font-size: var(--font-size-xxs) !important;
}
.viafoura-comments-standalone .viafoura .vf-threaded-content-indicator--light-primary {
color: #000000 !important;
text-transform: capitalize;
}
.viafoura-comments-standalone .viafoura .vf-threaded-content-indicator--light-primary:hover {
color: #000000 !important;
}
.viafoura-comments-standalone .viafoura .vf-threaded-content-indicator--light-primary:hover svg {
stroke: #000000 !important;
}
.viafoura-comments-standalone .viafoura .vf-threaded-content-indicator--light-primary .vf-label.vf-label-upper {
text-transform: capitalize;
}
.viafoura-comments-standalone .viafoura .vf-comment__content-editor p span {
font-family: var(--body-font) !important;
font-size: var(--font-size-s);
line-height: var(--standard-line-height);
}
.viafoura-comments-standalone .viafoura .vf-comment__bottom-actions .vf-button {
text-transform: capitalize !important;
font-size: var(--font-size-xxs) !important;
font-weight: var(--font-weight-bold) !important;
color: #333333 !important;
position: relative;
padding: 0 0 2px !important;
line-height: var(--standard-line-height);
background: linear-gradient(to right, var(--accent-colour), var(--accent-colour)), linear-gradient(to right, #9DA0A4, #9DA0A4, #9DA0A4);
background-size: 100% 2px, 0 2px;
background-position: 100% 100%, 0 100%;
background-repeat: no-repeat;
transition: background-size 200ms;
width: auto;
}
.viafoura-comments-standalone .viafoura .vf-comment__bottom-actions .vf-button:hover,
.viafoura-comments-standalone .viafoura .vf-comment__bottom-actions .vf-button a:active,
.viafoura-comments-standalone .viafoura .vf-comment__bottom-actions .vf-button a:focus {
background-size: 0 2px, 100% 2px;
text-decoration: none !important;
}
.viafoura-comments-standalone .viafoura .vf-comment__bottom-actions .vf-button.vf-icon-button {
text-decoration: none !important;
background: none !important;
}
.viafoura-comments-standalone .viafoura .vf-comment__bottom-actions .vf-button.vf-icon-button::before {
display: none !important;
}
.viafoura-comments-standalone .viafoura .vf-comment__bottom-actions .vf-content-actions__right-actions .vf-button {
text-decoration: none !important;
margin-left: 5px !important;
}
.viafoura-comments-standalone .viafoura .vf3-comments__bottom-action {
font-size: var(--font-size-xs);
font-weight: var(--font-weight-semibold);
line-height: 17.77px;
padding: 5px 20px;
height: auto !important;
display: flex !important;
align-items: center !important;
justify-content: center;
}
.viafoura-comments-standalone .viafoura .vf3-comments__bottom-action::after {
content: "";
display: flex !important;
justify-content: center;
align-items: center;
position: absolute !important;
height: 1px;
width: 100%;
border-style: none;
background-color: #9DA0A4;
}
.viafoura-comments-standalone .viafoura .vf3-comments__bottom-action button {
color: #000000 !important;
z-index: 2 !important;
padding: 5px 15px !important;
font-size: var(--font-size-xs);
line-height: 1;
text-decoration: none !important;
background-color: var(--accent-colour) !important;
font-family: var(--body-font);
font-weight: var(--font-weight-semibold);
text-align: center;
border-radius: 100px !important;
border: 0 !important;
width: auto;
text-transform: capitalize;
cursor: pointer;
}
.viafoura-comments-standalone .viafoura .vf3-comments__bottom-action button:hover {
color: #000000 !important;
}
.viafoura-comments-standalone .viafoura .vf3-comments__bottom-action .vf-load-more {
display: flex !important;
justify-content: center;
align-items: center;
position: absolute !important;
z-index: 1 !important;
height: 1px;
width: 100%;
border-style: none;
background-color: #9DA0A4;
}
.viafoura-comments-standalone .viafoura .vf3-comments__bottom-action .vf-load-more button {
z-index: 2 !important;
padding: 5px 15px !important;
font-size: var(--font-size-xs);
line-height: 1;
text-decoration: none !important;
background-color: var(--accent-colour) !important;
font-family: var(--body-font);
font-weight: var(--font-weight-semibold);
text-align: center;
border-radius: 100px !important;
border: 0;
width: auto;
text-transform: capitalize;
cursor: pointer;
}
.viafoura-comments-standalone .viafoura .vf-content-focus-container-modal__header {
background: #F2F2F3 !important;
}
.viafoura-comments-standalone .viafoura .vf-content-focus-container-modal__header-text {
font-family: var(--global-font) !important;
font-size: var(--font-size-m) !important;
font-weight: var(--font-weight-semibold) !important;
color: #333333 !important;
text-transform: capitalize;
}
.viafoura-comments-standalone .viafoura .vf-content-focus-container--default.vf-content-focus-container--focused {
background: #F2F2F3 !important;
box-shadow: 0 4px 15px 0 rgba(0, 0, 0, 0.5) !important;
}
.viafoura-comments-standalone .viafoura .vf-content-focus-container--default.vf-content-focus-container--reply-form--is-focused {
padding-bottom: 10px;
}
.viafoura-comments-standalone .viafoura .vf-content-focus-container--default.vf-content-focus-container--reply-form--is-focused .content-focus-container__footer .vf-content-editor-actions {
background: #F2F2F3 !important;
padding: 0 10px !important;
border-radius: 0 !important;
}
.viafoura-comments-standalone .viafoura .vf-content-actions__left-actions {
color: #333333 !important;
font-family: var(--global-font) !important;
font-size: var(--font-size-xxs) !important;
font-weight: var(--font-weight-bold) !important;
text-transform: capitalize !important;
}
.viafoura-comments-standalone .viafoura .vf-content-actions__right-actions button {
font-size: 10px !important;
font-family: var(--global-font) !important;
-webkit-text-decoration-line: underline !important;
text-decoration-line: underline !important;
text-transform: capitalize !important;
}
.viafoura-comments-standalone .viafoura .vf-content-editor-form__textarea {
padding: 8px 10px;
padding-top: 8px !important;
font-family: var(--global-font);
background-color: #FFFFFF !important;
border: 1px solid #CCCFD6 !important;
border-radius: 3px !important;
}
.viafoura-comments-standalone .viafoura .vf-editor-area--with-limit {
padding-right: 0 !important;
}
.viafoura-comments-standalone .viafoura .vf-content-editor-actions {
padding: 0 10px 10px 10px !important;
gap: 10px;
}
.viafoura-comments-standalone .viafoura .vf-content-editor-actions button {
height: 24px !important;
padding: 0 15px !important;
border-radius: 100px !important;
font-family: var(--body-font) !important;
font-size: var(--font-size-xs) !important;
font-weight: var(--font-weight-bold) !important;
text-transform: capitalize;
cursor: pointer;
}
.viafoura-comments-standalone .viafoura .vf-content-editor-actions button.is-link {
background-color: rgba(255, 255, 255, 0.8) !important;
color: #333333 !important;
border: 1px solid #CCCFD6 !important;
}
.viafoura-comments-standalone .viafoura .vf-content-editor-actions button.is-cta {
background-color: var(--alt-colour) !important;
border-color: var(--alt-colour) !important;
color: #FFFFFF !important;
}
.viafoura-comments-standalone .viafoura .vf-back-button {
padding: 10px 15px !important;
}
.viafoura-comments-standalone .viafoura .vf-back-button__icon-wrapper {
background-color: #FFFFFF !important;
border-color: rgba(0, 0, 0, 0) !important;
}
.viafoura-comments-standalone .viafoura .vf-back-button__icon-wrapper:hover {
border-color: #CCCFD6 !important;
}
.viafoura-comments-standalone .viafoura .vf-back-button:hover {
color: #333333 !important;
fill: #333333 !important;
}
.viafoura-comments-standalone .viafoura .vf-close-button__wrapper {
top: 10px !important;
right: 15px !important;
}
.viafoura-comments-standalone .viafoura .vf-close-button__wrapper .vf-icon-button {
background-color: #FFFFFF !important;
}
.viafoura-comments-standalone .viafoura .vf-close-button__wrapper .vf-icon-button:hover {
color: #333333 !important;
border: 1px solid #CCCFD6 !important;
}
.viafoura-comments-standalone .viafoura .vf-default-avatar {
background: #BC7A16 !important;
}
.viafoura-comments-standalone .viafoura .vf-default-avatar__name {
font-family: var(--global-font) !important;
}
.vf-tray-widget {
padding: 20px;
}
.vf-tray-widget .vf-tray-navigation .vf-flex-nav span {
font-size: var(--font-size-xs) !important;
}
.vf-tray-widget .vf-tray-navigation > nav {
border-bottom: none !important;
}
.vf-tray-widget .vf-tray-navigation > nav .vf-nav-label {
font-weight: var(--font-weight-bold) !important;
}
.vf-tray-widget .vf-tray-navigation > nav .vf-tray-close {
width: 20px !important;
height: 20px !important;
border-radius: 100px !important;
background-color: var(--accent-colour) !important;
border: none !important;
}
.vf-tray-widget .vf-tray-navigation > nav .vf-tray-close svg {
fill: #000000 !important;
}
.vf-tray-widget .vf-tray-navigation > nav .vf-tray-navigation .vf-tray-nav-button {
font-family: var(--body-font) !important;
font-size: var(--font-size-xs) !important;
font-weight: var(--font-weight-bold) !important;
}
.vf-tray-widget .vf-tray-navigation .vf-notification-section .vf-label {
font-family: var(--body-font) !important;
font-size: var(--font-size-xs) !important;
font-weight: var(--font-weight-bold) !important;
text-transform: lowercase;
}
.vf-tray-widget .vf-tray-navigation .vf-notification-section .vf-label::first-letter {
text-transform: capitalize;
}
.vf-tray-widget .vf-tray-navigation .vf-notification-section .vf-notification .vf-item-layout__content p, .vf-tray-widget .vf-tray-navigation .vf-notification-section .vf-notification-record .vf-item-layout__content p {
font-family: var(--headlines-font) !important;
font-size: var(--font-size-xs) !important;
font-weight: var(--font-weight-semibold) !important;
}
.vf-tray-widget .vf-tray-navigation .vf-notification-section .vf-notification .vf-item-layout__content .vf-num-comments::before, .vf-tray-widget .vf-tray-navigation .vf-notification-section .vf-notification-record .vf-item-layout__content .vf-num-comments::before {
background: url("/resources/responsive-static/mds/images/icons/message.svg") no-repeat center/contain;
content: "";
height: 18px;
margin-right: 3px;
opacity: 0.8;
width: 18px;
}
.vf-tray-widget .vf-tray-navigation .vf-notification-section .vf-notification .vf-item-layout__content .vf-num-comments svg, .vf-tray-widget .vf-tray-navigation .vf-notification-section .vf-notification-record .vf-item-layout__content .vf-num-comments svg {
display: none;
}
.vf-tray-widget .vf-tray-navigation .vf-notification-section .vf-notification, .vf-tray-widget .vf-tray-navigation .vf-notification-section .vf-notification-record {
text-decoration: none !important;
}
.vf-tray-widget .vf-tray-navigation .vf-notification-section .vf-notification .vf-notification,
.vf-tray-widget .vf-tray-navigation .vf-notification-section .vf-notification .vf-notification-record,
.vf-tray-widget .vf-tray-navigation .vf-notification-section .vf-notification .vf-notification p,
.vf-tray-widget .vf-tray-navigation .vf-notification-section .vf-notification .vf-notification-record p, .vf-tray-widget .vf-tray-navigation .vf-notification-section .vf-notification-record .vf-notification,
.vf-tray-widget .vf-tray-navigation .vf-notification-section .vf-notification-record .vf-notification-record,
.vf-tray-widget .vf-tray-navigation .vf-notification-section .vf-notification-record .vf-notification p,
.vf-tray-widget .vf-tray-navigation .vf-notification-section .vf-notification-record .vf-notification-record p {
text-decoration: none !important;
}
.vf-tray-widget .vf-tray-navigation .vf-notification-section .vf-notification .vf-notification:hover,
.vf-tray-widget .vf-tray-navigation .vf-notification-section .vf-notification .vf-notification-record:hover,
.vf-tray-widget .vf-tray-navigation .vf-notification-section .vf-notification .vf-notification p:hover,
.vf-tray-widget .vf-tray-navigation .vf-notification-section .vf-notification .vf-notification-record p:hover, .vf-tray-widget .vf-tray-navigation .vf-notification-section .vf-notification-record .vf-notification:hover,
.vf-tray-widget .vf-tray-navigation .vf-notification-section .vf-notification-record .vf-notification-record:hover,
.vf-tray-widget .vf-tray-navigation .vf-notification-section .vf-notification-record .vf-notification p:hover,
.vf-tray-widget .vf-tray-navigation .vf-notification-section .vf-notification-record .vf-notification-record p:hover {
color: black !important;
}
.vf-tray-widget .vf-profile-header {
padding: 25px 0 !important;
}
.vf-tray-widget .vf-profile-header__name {
font-family: var(--global-font) !important;
font-size: var(--font-size-m) !important;
font-weight: var(--font-weight-semibold) !important;
}
.vf-tray-widget .vf-profile-header .vf-default-avatar {
background: #BC7A16 !important;
}
.vf-tray-widget .vf-profile-header .vf-default-avatar__name {
font-family: var(--global-font) !important;
}
.vf-tray-widget .vf-profile-overview .vf-counts-list {
justify-content: space-between !important;
}
.vf-tray-widget .vf-profile-overview .vf-counts-list li {
padding-top: 0 !important;
}
.vf-tray-widget .vf-profile-overview .vf-counts-list li .vf-label {
font-family: var(--global-font) !important;
font-size: var(--font-size-xxs) !important;
font-weight: var(--font-weight-regular) !important;
text-transform: capitalize;
}
.vf-tray-widget .vf-activity-list__list-item {
margin-bottom: 10px !important;
}
.vf-tray-widget .vf-activity-list__list-item .record {
padding: 10px !important;
border-bottom: none !important;
border-radius: 5px !important;
border-top: 1px solid #E6E6E9 !important;
background-color: #F2F2F3 !important;
}
.vf-tray-widget .vf-activity-list__list-item .record__col {
margin: 0 !important;
}
.vf-tray-widget .vf-activity-list__list-item .record__col p {
font-family: var(--global-font) !important;
font-size: var(--font-size-xs) !important;
}
.vf-tray-widget .vf-activity-list__list-item .record__col p .vf-article-title {
font-weight: var(--font-weight-bold) !important;
font-style: normal !important;
}
.vf-tray-widget .vf-activity-list__list-item .record__col .timestamp {
color: #9DA0A4 !important;
font-family: var(--global-font) !important;
font-size: 11px !important;
font-weight: var(--font-weight-semibold) !important;
text-transform: uppercase;
align-items: center !important;
}
.vf-tray-widget .vf-user-profile {
padding: 0 20px !important;
}
.vf-tray-widget .vf-notification-record {
padding: 0 !important;
border-bottom: none !important;
margin: 20px 0;
}
.vf-tray-widget .vf-notification-record__identifier-col {
display: none !important;
}
.vf-tray-widget .vf-notification-record__content {
flex-direction: row !important;
}
.vf-tray-widget .vf-notification-record__content .vf-item-layout__image {
width: 90px !important;
height: 90px !important;
}
.vf-tray-widget .vf-community-content {
padding: 0 20px !important;
}
.vf-tray-widget .vf-community-content .vf-expanding-hover-light::before {
display: none !important;
}
.vf-tray-widget .vf-community-content .vf-none {
border-radius: 5px;
background-color: #F2F2F3 !important;
text-align: center;
padding: 10px !important;
font-family: var(--global-font) !important;
color: #333333 !important;
font-size: var(--font-size-m) !important;
font-weight: var(--font-weight-regular) !important;
line-height: var(--standard-line-height) !important;
}
.vf-tray-widget .vf-community-content .vf-tabbed-nav {
border: none !important;
text-transform: capitalize !important;
background-color: #FFFFFF !important;
}
.vf-tray-widget .vf-community-content .vf-tabbed-nav button {
font-family: var(--global-font) !important;
font-size: var(--font-size-xxs) !important;
font-weight: var(--font-weight-bold) !important;
}
.vf-tray-widget .vf-settings-controls {
margin: 0 !important;
}
.vf-tray-widget .vf-settings-controls .vf-button.is-cta {
border-radius: 100px;
width: auto;
margin: 0 auto;
padding: 4px 20px !important;
font-family: var(--body-font) !important;
font-size: var(--font-size-xs) !important;
font-weight: var(--font-weight-semibold) !important;
}
.vf-tray-widget .vf-avatar-update {
padding: 0 20px !important;
}
.vf-tray-widget .vf-avatar-update .vf-avatar-file-wrapper .vf-button {
color: var(--gray-dark);
border-radius: 100px;
max-width: 120px !important;
min-width: unset !important;
padding: 2px 10px !important;
font-family: var(--body-font) !important;
font-size: var(--font-size-xs) !important;
font-weight: var(--font-weight-semibold) !important;
text-transform: capitalize !important;
}
.vf-comments-trending-articles .vf-trending-articles__header {
border-bottom: 4px solid var(--accent-colour);
border-top-style: hidden !important;
border-top-width: 0px;
font-family: var(--header-font) !important;
font-size: var(--font-size-l) !important;
font-weight: var(--font-weight-bold) !important;
line-height: 120%;
margin: 20px 0;
text-transform: capitalize !important;
width: max-content;
}
.vf-comments-trending-articles .vf-trending-article-list__item .vf-item-layout__image {
width: 90px !important;
height: 90px !important;
}
.vf-comments-trending-articles .vf-trending-article-list__item .vf-item-layout__content {
gap: 5px;
}
.vf-comments-trending-articles .vf-trending-article-list__item .vf-item-layout__title {
font-family: var(--headlines-font) !important;
font-size: var(--font-size-s) !important;
font-weight: var(--font-weight-semibold) !important;
color: #333333 !important;
}
.vf-comments-trending-articles .vf-trending-article-list__item .vf-item-layout .vf-num-comments {
font-family: var(--global-font) !important;
font-size: var(--font-size-xxs) !important;
margin-top: 5px;
}
.vf-comments-trending-articles .vf-trending-article__comment-count {
padding-left: 22px;
position: relative;
}
.vf-comments-trending-articles .vf-trending-article__comment-count::before {
content: "";
width: 18px;
height: 18px;
background: url("/resources/responsive-static/mds/images/icons/message.svg") no-repeat center/contain;
position: absolute;
left: 0;
top: 0;
opacity: 0.8;
}
.vf-comments-trending-articles .vf-trending-article__comment-count svg {
display: none;
}
.vf-comments-trending-articles .vf-trending-article:hover .vf-item-layout__title {
color: #000000 !important;
text-decoration: none !important;
}
.v3-comments__post-form .vf-post-form__new-content {
padding: 10px !important;
border-radius: 5px !important;
background-color: var(--main-colour) !important;
}
.v3-comments__post-form .vf-post-form__new-content .vf-content-layout__left .vf-avatar .vf-default-avatar__name {
border: 1px solid #FFFFFF;
border-radius: 50%;
}
.v3-comments__post-form .vf-post-form__new-content .vf-content-layout__right {
border: none !important;
border-radius: 0 !important;
}
.v3-comments__post-form .vf-post-form__new-content .vf-content-layout__right::before {
display: none !important;
}
.v3-comments__post-form .vf-post-form__new-content .vf-content-layout__right::after {
display: none !important;
}
.v3-comments__post-form .vf-post-form__new-content .vf-content-layout__right .vf-new-content__content-editor-slot-wrapper {
background-color: var(--main-colour) !important;
}
.v3-comments__post-form .vf-post-form__new-content .vf-content-layout__right .vf-new-content__content-editor-wrapper {
min-height: unset !important;
padding-top: 0 !important;
padding-bottom: 0 !important;
padding-left: 0 !important;
}
.v3-comments__post-form .vf-post-form__new-content .vf-content-layout__right .vf-new-content__content-editor-wrapper .vf-editor-area--with-limit {
padding-right: 0 !important;
padding-bottom: 10px !important;
}
/* End ViafouraCommentsDisplay.html */
.article-comments {
width: 100vw;
padding: 0 10px;
}
@media (min-width: 1200px) {
.article-comments {
max-width: 700px;
margin-left: auto;
}
}
@media (min-width: 576px) {
.article-comments {
width: 100%;
}
}
@media (min-width: 768px) {
.article-comments {
padding: 0;
}
}
.article-comments textarea,
.article-comments input {
color: #000000;
}
.article-comments--inline {
display: flex;
align-items: center;
flex-flow: wrap;
gap: 15px;
}
@media (min-width: 768px) {
.article-comments--inline {
padding: 0;
gap: 25px;
}
}
.article-comments__text--inline {
align-items: center;
background-color: var(--accent-colour);
border-radius: 100px;
display: flex;
font-family: var(--global-font);
font-size: var(--font-size-xs);
font-weight: var(--font-weight-bold);
gap: var(--spacing-200);
padding: var(--spacing-100) var(--spacing-300);
white-space: nowrap;
}
.article-comments__text--inline span {
font-family: var(--global-font);
line-height: 100%;
}
.article-comments__text--inline:hover,
.article-comments__text--inline a:active,
.article-comments__text--inline a:focus {
text-decoration: none;
}
.article-comments__text--inline:visited {
color: #595959;
}
.article-comments__moderation-rules {
margin-bottom: 25px;
background: #FFFFFF;
box-shadow: 0 5px 5px rgba(0, 0, 0, 0.05);
border-radius: 5px;
}
.article-comments__moderation-rules--disabled {
background: transparent;
padding-left: 0;
padding-right: 0;
}
.article-comments__moderation-rules-title {
font-size: var(--font-size-m);
font-weight: var(--font-weight-bold);
margin: 0;
padding: 15px 20px;
color: #FFFFFF;
background: var(--main-colour);
text-transform: uppercase;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
}
.article-comments__moderation-rules-body {
padding: 20px;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
border: 1px solid #CCCFD6;
}
.article-comments__moderation-rules-text {
font-size: var(--font-size-s);
color: #333333;
margin-top: 0;
margin-bottom: 25px;
}
.article-comments__moderation-rules-text:last-child {
margin-bottom: 0;
}
.article-comments__moderation-rules .mar-btn {
max-width: 180px;
margin-top: 0;
margin-bottom: 0;
}
.article-comments__order-sort-header {
position: relative;
display: flex;
justify-content: space-between;
margin-bottom: 20px;
}
@media (max-width: 575px) {
.article-comments__order-sort-header {
flex-wrap: wrap;
align-items: flex-start;
margin-bottom: 25px;
gap: 10px;
}
}
.article-comments__order-sort-header .article-comments__order-sort-header-btn {
display: flex;
justify-content: center;
align-items: center;
height: 30px;
white-space: nowrap;
color: #FFFFFF;
background: #188AE2;
padding: 10px 15px;
}
.article-comments__order-sort-header .-sortby {
margin-left: auto;
}
.article-comments__order-sort-header .-sortby .mar-form-elements__form-group---inline {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 0;
width: 230px;
}
.article-comments__order-sort-header .-sortby .mar-form-elements__form-group---inline label {
width: 45%;
margin-bottom: 0;
margin-right: 5px;
}
.article-comments__order-sort-header .-sortby .mar-form-elements__form-group---inline select {
width: 55%;
background-color: #FFFFFF;
}
@media (max-width: 575px) {
.article-comments__order-sort-header .-sortby {
min-width: unset;
margin: 0;
}
.article-comments__order-sort-header .-sortby .mar-form-elements__form-group > label {
text-align: left;
}
}
@media (max-width: 575px) {
.article-comments__order-sort-header .-sortby {
min-width: unset;
margin: 0;
}
.article-comments__order-sort-header .-sortby .mar-form-elements__form-group > label {
text-align: left;
}
}
.article-comments .post-comment-container {
margin-bottom: 25px;
background: var(--main-colour);
padding: 20px;
border-radius: 5px;
}
.article-comments .post-comment-container .comment-disclaimer {
color: #FFFFFF;
}
.article-comments .post-comment-container .comment-disclaimer a {
color: #FFFFFF;
}
.article-comments .post-comment-container .post-comment a {
font-weight: var(--font-weight-bold);
}
.article-comments .post-comment-container .post-comment > p:not(:last-child) {
margin-bottom: 15px;
}
.article-comments .post-comment-container .comment-status {
position: relative;
color: #FFFFFF;
}
.article-comments .post-comment-container .comment-status a {
color: #FFFFFF;
}
.article-comments .post-comment-container .comment-status span {
display: block;
margin-bottom: 15px;
}
.article-comments .post-comment-container .verification-prompt-container {
color: white;
}
.article-comments .post-comment-container .verification-prompt-container .inner-prompt-container {
background-color: var(--main-colour);
margin-bottom: 10px;
padding: 10px;
}
.article-comments .post-comment-container .verification-prompt-container .show-extra-info {
margin-top: 5px;
cursor: pointer;
}
.article-comments .post-comment-container .verification-prompt-container .extra-info {
margin-top: 15px;
}
.article-comments .post-comment-container .verification-prompt-container .extra-info a {
color: white;
font-weight: normal;
cursor: pointer;
text-decoration: underline;
}
.article-comments .post-comment-container .verification-prompt-container .more-info {
margin-top: 10px;
}
.article-comments .post-comment-container .verification-prompt-container .mar-btn {
display: block;
margin-left: auto;
}
.article-comments .post-comment-container .mar-alert {
width: 100%;
margin-bottom: 10px;
opacity: 1;
}
.article-comments .post-comment-container .mar-alert a {
color: white;
border-bottom: 1px solid var(--accent-colour);
}
.article-comments .post-comment-container .mar-form-elements {
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
}
.article-comments .post-comment-container .mar-form-elements__title {
font-weight: var(--font-weight-regular);
margin-top: 0;
margin-bottom: 8px;
color: #FFFFFF;
}
.article-comments .post-comment-container .mar-form-elements__form-check-label {
color: #FFFFFF;
}
.article-comments .post-comment-container .mar-form-elements__title,
.article-comments .post-comment-container .mar-form-elements .post-comment-form-textarea,
.article-comments .post-comment-container .mar-form-elements .post-comment-form-checkbox,
.article-comments .post-comment-container .mar-form-elements .post-comment-form-btn {
flex-basis: 100%;
}
.article-comments .post-comment-container .mar-form-elements .post-comment-form-btn {
text-align: right;
margin-bottom: 20px;
width: 100%;
}
@media (min-width: 768px) {
.article-comments .post-comment-container .mar-form-elements .post-comment-form-checkbox,
.article-comments .post-comment-container .mar-form-elements .post-comment-form-btn {
flex-basis: 50%;
}
.article-comments .post-comment-container .mar-form-elements .post-comment-form-btn {
max-width: 180px;
text-align: right;
margin-left: auto;
}
}
.article-comments .comment-container {
position: relative;
}
.article-comments .comment-container .comment {
padding: 10px;
background: #F2F2F3;
margin-bottom: 10px;
}
.article-comments .comment-container .comment__header {
display: flex;
justify-content: flex-start;
align-items: flex-end;
}
.article-comments .comment-container .comment__username {
font-size: var(--font-size-m);
font-weight: var(--font-weight-bold);
color: #000000;
display: flex;
align-items: center;
}
.article-comments .comment-container .comment__suspend-btn {
font-size: var(--font-size-xs);
font-family: var(--global-font);
color: #9D0D13;
background: transparent;
border: none;
margin-bottom: 2px;
}
.article-comments .comment-container .comment .admin-user {
margin-left: 5px;
display: none;
position: relative;
}
@media (min-width: 576px) {
.article-comments .comment-container .comment .admin-user {
display: flex;
justify-content: flex-start;
align-items: center;
}
}
.article-comments .comment-container .comment .admin-user [data-icon="bx:bxs-left-arrow"] {
width: 26px;
height: 26px;
}
.article-comments .comment-container .comment .admin-user [data-icon="bx:bxs-left-arrow"] path {
fill: var(--alt-colour);
}
.article-comments .comment-container .comment .admin-user__text {
display: flex;
align-items: center;
background: var(--alt-colour);
height: 22px;
text-transform: capitalize;
padding-right: 13px;
padding-left: 5px;
position: relative;
left: -6px;
color: #FFFFFF;
font-family: var(--body-font);
font-weight: var(--font-weight-semibold);
white-space: nowrap;
}
.article-comments .comment-container .comment .admin-user__text span {
margin-top: 2px;
}
.article-comments .comment-container .comment .mobile-admin-user {
display: block;
}
@media (min-width: 576px) {
.article-comments .comment-container .comment .mobile-admin-user {
display: none;
}
}
.article-comments .comment-container .comment__posted, .article-comments .comment-container .comment__user-id, .article-comments .comment-container .comment__last-updated {
font-size: var(--font-size-xxs);
font-family: var(--global-font);
color: #595959;
}
.article-comments .comment-container .comment__posted {
margin-left: auto;
}
.article-comments .comment-container .comment__user-id {
margin-top: 5px;
}
.article-comments .comment-container .comment__body {
margin-bottom: 25px;
}
.article-comments .comment-container .comment__text {
display: block;
font-size: var(--font-size-s);
color: #333333;
margin: 10px 0;
white-space: break-spaces;
}
.article-comments .comment-container .comment__text .user-alias {
display: flex;
flex-direction: column;
align-items: flex-start;
margin-bottom: 5px;
}
@media (min-width: 576px) {
.article-comments .comment-container .comment__text .user-alias {
align-items: center;
flex-direction: row;
}
}
.article-comments .comment-container .comment__text .user-alias .admin-user [data-icon="clarity:avatar-solid"] {
height: 17px;
width: 17px;
margin-right: 5px;
}
.article-comments .comment-container .comment__text .user-alias .admin-user [data-icon="clarity:avatar-solid"] path:first-of-type {
fill: #595959;
}
.article-comments .comment-container .comment__text .user-alias .admin-user [data-icon="clarity:avatar-solid"] path:nth-of-type(2n) {
fill: none;
}
.article-comments .comment-container .comment__text blockquote {
font-size: var(--font-size-s);
font-weight: var(--font-weight-regular);
}
@media (min-width: 992px) {
.article-comments .comment-container .comment__text blockquote {
margin-right: 40px;
}
}
.article-comments .comment-container .comment__actions {
display: flex;
justify-content: space-between;
align-items: center;
}
.article-comments .comment-container .comment__actions--left {
text-align: left;
display: flex;
}
.article-comments .comment-container .comment__actions--left button {
margin-right: 5px;
}
.article-comments .comment-container .comment__actions--right {
text-align: right;
display: flex;
position: relative;
}
.article-comments .comment-container .comment__actions--right button {
font-size: var(--font-size-xs);
background: 0;
border: none;
margin-right: 10px;
padding: 0;
}
.article-comments .comment-container .comment__actions--right .edit-comment {
color: #2EAA6D;
}
.article-comments .comment-container .comment__actions--right .delete-comment {
color: #9D0D13;
}
.article-comments .comment-container .comment__actions--right .comment-report {
margin-right: 20px;
color: #595959;
}
.article-comments .comment-container .comment__actions--right .comment-report:hover {
color: #9D0D13;
cursor: pointer;
}
.article-comments .comment-container .comment__actions--right .mar-upvote {
margin-right: 0;
}
.article-comments .comment-container .comment--left button:last-child, .article-comments .comment-container .comment--right button:last-child {
margin-right: 0;
}
.article-comments .comment-container .comment .comment {
border-bottom: none;
background: transparent;
padding: 20px;
padding-bottom: 0;
margin: 25px 0 0;
border-top: 1px solid #CCCFD6;
}
.article-comments .comment-container .comment .comment__text {
color: #000000;
white-space: pre-line;
}
.article-comments .comment-container .comment .comment__last-updated {
color: #595959;
}
.article-comments .comment-container .comment .nested-comment {
padding-left: 10px;
padding-right: 0;
}
.article-comments .comment-container .comment .comment-quote {
font-size: var(--font-size-s);
font-weight: var(--font-weight-regular);
padding: 10px 0 10px 10px;
}
.article-comments .comment-container .comment .comment-quote strong {
display: block;
font-weight: var(--font-weight-bold);
padding-bottom: 5px;
}
.article-comments .comment-container .comment .removed-indentation {
left: -30px;
}
.article-comments .report-container .mar-alert {
margin-bottom: 20px;
}
.article-comments .report-container .report-form {
position: relative;
}
.article-comments .report-container .report-form__header {
font-size: var(--font-size-s);
font-weight: var(--font-weight-bold);
color: #000000;
margin-top: 0;
margin-bottom: 15px;
display: flex;
justify-content: space-between;
align-items: center;
}
.article-comments .report-container .report-form__cancel {
font-size: var(--font-size-xs);
color: #333333;
margin: 0;
padding: 0;
}
.article-comments .report-container .report-form__submit {
margin-left: auto;
}
.article-comments .reply-container .reply-form {
position: relative;
}
.article-comments .reply-container .reply-form__header {
display: flex;
justify-content: flex-start;
align-items: center;
margin-bottom: 15px;
}
.article-comments .reply-container .reply-form__username {
width: 49%;
font-size: var(--font-size-s);
font-weight: var(--font-weight-bold);
color: #000000;
}
.article-comments .reply-container .reply-form__quote {
position: relative;
}
.article-comments .reply-container .reply-form__quote blockquote {
margin-top: 0;
margin-bottom: 0;
color: #595959;
}
@media (min-width: 992px) {
.article-comments .reply-container .reply-form__quote blockquote {
margin-right: 40px;
}
}
.article-comments .reply-container .reply-form__quote blockquote [data-icon="clarity:avatar-solid"] {
height: 17px;
width: 17px;
margin-right: 5px;
}
.article-comments .reply-container .reply-form__quote blockquote .user-alias {
display: flex;
flex-direction: column;
align-items: flex-start;
margin-bottom: 5px;
}
@media (min-width: 576px) {
.article-comments .reply-container .reply-form__quote blockquote .user-alias {
align-items: center;
flex-direction: row;
}
}
.article-comments .reply-container .reply-form__quote strong {
color: #595959;
}
.article-comments .reply-container .reply-form__quote-user {
font-weight: var(--font-weight-semibold);
margin-bottom: 15px;
}
.article-comments .reply-container .reply-form__quote-content {
font-weight: var(--font-weight-regular);
margin-bottom: 25px;
}
.article-comments .reply-container .reply-form__quote-user, .article-comments .reply-container .reply-form__quote-content {
font-size: var(--font-size-s);
color: #333333;
}
.article-comments .reply-container .reply-form__cancel {
font-size: var(--font-size-xs);
font-weight: var(--font-weight-bold);
color: #333333;
margin-left: auto;
width: 49%;
text-align: right;
}
.article-comments .reply-container .reply-form__reply-to {
font-size: var(--font-size-xs);
font-family: var(--global-font);
margin-bottom: 5px;
}
.article-comments .reply-container .reply-form__submit {
margin-left: auto;
}
.article-comments .edit-container .edit-form {
position: relative;
}
.article-comments .edit-container .edit-form__header {
display: flex;
justify-content: flex-start;
align-items: center;
margin-top: 0;
margin-bottom: 15px;
}
.article-comments .edit-container .edit-form__title {
width: 49%;
font-size: var(--font-size-s);
font-weight: var(--font-weight-bold);
color: #000000;
}
.article-comments .edit-container .edit-form__cancel {
font-size: var(--font-size-xs);
font-weight: var(--font-weight-bold);
color: #333333;
margin-left: auto;
width: 49%;
text-align: right;
}
.article-comments .edit-container .edit-form__textarea-label {
font-size: var(--font-size-xxs);
font-family: var(--global-font);
margin-bottom: 10px;
color: #595959;
}
.article-comments .edit-container .edit-form__submit {
margin-left: auto;
}
.article-comments .delete-container .delete-alert {
display: flex;
justify-content: space-between;
align-items: center;
padding: 15px 20px;
margin: 15px 0;
}
.article-comments .delete-container .delete-alert__actions {
display: flex;
justify-content: space-between;
align-items: center;
}
.article-comments .delete-container .delete-alert__confirm {
margin-right: 15px;
}
.article-comments .delete-container .delete-alert__cancel {
color: #FFFFFF;
font-size: var(--font-size-xs);
font-weight: var(--font-weight-bold);
}
.article-comments .report-container,
.article-comments .reply-container,
.article-comments .edit-container {
background: #F2F2F3;
padding: 20px;
margin-top: 25px;
}
.article-comments .mar-btn:hover,
.article-comments .article-comments__order-sort-header-btn:hover {
text-decoration: none;
}
.mar-modal__body select {
border-radius: 5px;
margin-top: 5px;
width: 100%;
}
.mar-modal__body .mobile-number {
border-radius: 5px;
margin-top: 5px;
}
.mar-modal__body input[type=number]::-webkit-inner-spin-button,
.mar-modal__body input[type=number]::-webkit-outer-spin-button {
margin: 0;
}
.mar-modal__body .otp-error-text {
color: #9D0D13;
font-weight: 700;
line-height: 22.4px;
}
.mar-modal__body .modal-email-info {
margin-top: 10px;
}
.otp-fields-container {
display: flex;
justify-content: flex-start;
gap: 10px;
}
.otp-fields-container .otp-field {
height: 36px;
width: 36px;
min-width: 36px;
padding: 5px 0;
text-align: center;
}
#otp-resend {
cursor: pointer;
text-decoration: underline;
}
.otp-resend-msg-1,
.otp-resend-msg-2,
.otp-resend-msg-3 {
font-weight: var(--font-weight-bold);
}
.otp-resend-msg-1,
.otp-resend-msg-2 {
color: #188AE2;
}
.otp-resend-msg-3 {
color: #9D0D13;
}
.comment-status a {
font-weight: var(--font-weight-bold);
}
.viafoura .post-comment-container {
margin-bottom: 25px;
}
.viafoura .post-comment-container .post-comment a {
font-weight: var(--font-weight-bold);
}
.viafoura .post-comment-container .post-comment > p:not(:last-child) {
margin-bottom: 15px;
}
.viafoura .post-comment-container .comment-status {
position: relative;
}
.viafoura .post-comment-container .comment-status span {
display: block;
margin-bottom: 15px;
}
.viafoura .post-comment-container .verification-prompt-container {
color: white;
}
.viafoura .post-comment-container .verification-prompt-container .inner-prompt-container {
background-color: var(--main-colour);
margin-bottom: 10px;
padding: 10px;
}
.viafoura .post-comment-container .verification-prompt-container .show-extra-info {
margin-top: 5px;
cursor: pointer;
}
.viafoura .post-comment-container .verification-prompt-container .extra-info {
margin-top: 15px;
}
.viafoura .post-comment-container .verification-prompt-container .extra-info a {
color: white;
font-weight: normal;
cursor: pointer;
text-decoration: underline;
}
.viafoura .post-comment-container .verification-prompt-container .more-info {
margin-top: 10px;
}
.viafoura .post-comment-container .verification-prompt-container .mar-btn {
display: block;
margin-left: auto;
}
.viafoura .post-comment-container .mar-alert {
width: 100%;
margin-bottom: 10px;
opacity: 1;
}
.viafoura .post-comment-container .mar-alert a {
color: white;
border-bottom: 1px solid var(--accent-colour);
}
.most-read {
margin: 0;
font-family: var(--heading-font);
}
.most-read .mar-tab--active.most-read__list {
display: grid;
margin-bottom: 0;
grid-template-columns: repeat(1, minmax(245px, 1fr));
gap: 0 15px;
}
@media (min-width: 576px) {
.most-read .mar-tab--active.most-read__list {
gap: 0 20px;
}
}
@media (min-width: 576px) {
.most-read .mar-tab--active.most-read__list {
grid-template-columns: repeat(2, 1fr);
}
}
.most-read .mar-tab--active.most-read__list .most-read__list-item {
min-width: unset;
gap: 20px;
}
.most-read .mar-tab--active.most-read__list .most-read__list-item .headline {
margin: 0;
}
.most-read .mar-tab--active.most-read__list .most-read__list-item a {
color: #333333;
font-family: var(--headlines-font);
font-size: var(--font-size-s);
}
.most-read .mar-tab--active.most-read__list .most-read__list-item a:hover {
color: #000000;
text-decoration: none;
}
.most-read .mar-tab--active.most-read__list .most-read__list-item::before {
padding-top: 0;
font-size: 30px;
min-width: 35px;
text-align: center;
line-height: 100%;
margin: 0;
}
@media (min-width: 768px) {
.most-read .mar-tab--active.most-read__list {
column-count: 2;
}
}
@media (min-width: 1200px) {
.most-read .mar-tab--active.most-read__list {
column-count: unset;
margin-left: 0;
margin-right: 0;
}
}
.most-read .read-more-cta {
margin-top: 0;
font-family: var(--body-font);
}
.most-read__cta-container {
text-align: center;
margin-top: 5px;
}
.most-read--hide {
display: none !important;
}
@media (min-width: 768px) {
.most-read .most-read__body.most-read__body--one-column .mar-tab--active.most-read__list {
display: grid;
}
.most-read .most-read__body.most-read__body--one-column .mar-tab--active.most-read__list .most-read__list-item a {
max-width: 100%;
}
}
@media (max-width: 767px) and (min-width: 576px) {
.most-read .most-read__body.most-read__body--one-column .mar-tab--active.most-read__list {
display: block;
column-count: 2;
}
}
@media (min-width: 576px) {
.block-most-popular-right-column {
display: none;
}
}
@media (min-width: 768px) {
.block-most-popular-right-column {
display: block;
}
}
.block-most-popular-right-column .mar-tab__headings {
margin: 0 15px 24px 0;
}
@media (max-width: 575px) {
.block-most-popular-right-column .mar-tab__headings {
margin: 0;
}
}
.block-most-popular-right-column .most-read__list-item a {
max-width: 220px !important;
}
.block-most-popular-right-column .most-read__body.most-read__body--one-column .mar-tab--active.most-read__list {
display: grid;
grid-template-columns: repeat(1, minmax(245px, 1fr));
}