/*
 * Freeline: what this theme adds after freeline.css and responsive.css.
 *
 * Almost all of it was inline style="" in the old markup. Moving it here is what lets the widgets
 * print clean html, and it is the same declarations - the page should not move by a pixel.
 *
 * The .fl-ff-* classes are the brand fonts as a choice in the panel (title_font / subtitle_font).
 * They carry !important because they replace inline font-family declarations, which beat any
 * stylesheet rule; freeline.css sets font-family on several of these headings with !important too.
 */

/* ------------------------------------------------------------------ the brand faces */

.fl-ff-thunder-thin       { font-family: 'Thunder-ThinLC' !important; }
.fl-ff-thunder-extralight { font-family: 'Thunder-ExtraLightLC' !important; }
.fl-ff-thunder-light      { font-family: 'Thunder-LightLC' !important; }
.fl-ff-thunder            { font-family: 'Thunder-LC' !important; }
.fl-ff-thunder-semibold   { font-family: 'Thunder-SemiBoldLC' !important; }
.fl-ff-thunder-bold       { font-family: 'Thunder-BoldLC' !important; }
.fl-ff-thunder-black      { font-family: 'Thunder-BlackLC' !important; }
.fl-ff-montserrat         { font-family: 'Montserrat', sans-serif !important; }

/*
 * Inside a Thunder line, bold is the next cut up rather than a synthesised bold - which is how the
 * old content wrote "ARTIC LINE BLACK / BERGEN" with two spans of two fonts. Those spans lost their
 * style attribute on the way in (inline markup keeps no attributes), and <b> took their place.
 */
.fl-ff-thunder-thin b, .fl-ff-thunder-extralight b { font-family: 'Thunder-LC' !important; font-weight: normal; }
.fl-ff-thunder-light b, .fl-ff-thunder b            { font-family: 'Thunder-SemiBoldLC' !important; font-weight: normal; }
.fl-ff-thunder-semibold b, .fl-ff-thunder-bold b    { font-family: 'Thunder-BlackLC' !important; font-weight: normal; }

/* ------------------------------------------------------------------ header */

#top-menu .header-language .dropdown-menu { width: 174px; }

/* ------------------------------------------------------------------ title_split */

/* Every title the old content styled had display:block; a span needs it for a max-width to apply. */
.jnf-title-split-widget .fl-title { display: block; }

.jnf-title-split-widget .fl-split-text { min-height: auto !important; height: auto !important; }

.jnf-title-split-widget .fl-split-media {
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.jnf-title-split-widget .fl-secondary-image {
    position: absolute;
    bottom: 15px;
    right: 15px;
    max-width: 300px;
    z-index: 1;
}

/* ------------------------------------------------------------------ title_simple and the 404 */

.fl-title-simple .fl-title-light   { font-weight: 300; }
.fl-title-simple .fl-subtitle-under { line-height: 25px; margin-top: 20px; }

/* The subtitle set in columns on a wide screen; one column below 1200px, as --text-col-3 did. */
.fl-text-cols-2 { column-count: 2; column-gap: 40px; }
.fl-text-cols-3 { column-count: 3; column-gap: 40px; }
@media (max-width: 1200px) {
    .fl-text-cols-2, .fl-text-cols-3 { column-count: 1; }
}

.fl-not-found { color: #000; margin-top: 100px; min-height: 600px; }

/* ------------------------------------------------------------------ newsletter */

.fl-newsletter { position: relative; background-repeat: no-repeat; background-position: center; background-size: cover; }

/* ------------------------------------------------------------------ logo_list */

.fl-logo-small .client-box-image  { height: 60px; }
.fl-logo-medium .client-box-image { height: 100px; }
.fl-logo-large .client-box-image  { height: 150px; }

/* ------------------------------------------------------------------ contacts */

.fl-contacts .fl-subtitle      { font-size: 20px; font-weight: 300; }
.fl-contacts .fl-contact-text  { line-height: 160%; }
.fl-contacts .fl-contacts-image { max-width: 200px; }

.form_contact_widget .fl-contact-message { min-height: 100%; }

/* ------------------------------------------------------------------ footer */

.fl-footer { background: #1a1c22; border-top: 1px solid #66676b; }
.fl-footer .fl-footer-col { padding-top: 64px; }
.fl-footer .footer-logo { max-width: 240px; }
.fl-footer .fl-footer-social { padding-top: 30px; }
.fl-footer .fl-footer-link { font-size: 13px; line-height: 28px; }
.fl-footer .fl-footer-newsletter-title { line-height: 120%; }
.fl-footer .fl-footer-newsletter-title .font-weight-200 { font-weight: 200 !important; }
.fl-footer .fl-footer-contact { line-height: 120%; }
.fl-footer .fl-footer-contact p { font-size: 13px; }
.fl-footer .fl-footer-bottom { border-top: 1px solid #474747; padding-top: 30px; }
.fl-footer .fl-footer-copyright { font-size: 13px; font-weight: 200; }
.fl-footer .fl-jnf-mark { margin-left: 8px; }
.fl-footer .fl-tagline { font-family: 'Thunder-ThinLC'; letter-spacing: 1.3px; font-style: italic; }
.fl-footer .fl-tagline b { font-family: 'Thunder-BoldLC'; font-weight: normal; }
.fl-footer .fl-footer-small { font-size: 13px; }