/* ------------------------------------------------------
Variables for easy find and replace

primary colour - #A52219
accent colour - #F7971D
accent colour - hover : #E18A1B
font body - #333
font accent - #555
font highlight - #777


/* ------------------------------------------------------
**** navigation menu
------------------------------------------------------ */

/* ---- Mobile header ---- */
.skin--red #mobile-header {
    background-color: #A52219;
}

@media screen and (min-width: 769px) {
    .skin--red #frankenmenu-list .mega-menu .container {
        background-color: #941E16;
    }
    .skin--red #frankenmenu-list .mega-menu .container:after {
        background-color: #941E16;
    }
}

@media all and (max-width: 768px) {
.skin--red #frankenmenu-list .menu-item.menu-current-item > a {
    border-left: 10px solid #F7971D;
    }

.skin--red #frankenmenu-list a {
    color: #333333;
    border-left: 10px solid #A52219;
    }
}

/* ------------------------------------------------------
**** line decals
------------------------------------------------------ */
.skin--red .line-decal {
    background-color: #A52219;
}

.skin--red .line-decal--case-study {
    background-color: #fff;
}

.skin--red .text-link--arrows #double-arrows .cls-1 {
    fill: #A52219;
}

.skin--red blockquote:before,
.skin--red blockquote:after {
    color: #A52219;
}

.skin--red a:hover,
.skin--red a:active,
.skin--red a:focus {
    color: #E18A1B;
}

 /* ---- Expando ---- */
 .skin--red  .expando-open {
    color: #A52219;
}

 /* ---- Links ---- */
 .skin--red a {
    color: #A52219;
}

.skin--red .promo__container__header a {
    color: #333;
}

.skin--red .footer__quicklinks a:hover {
    color: #555;
}

.skin--red .section__heading--inline a {
    color: #333;
}

.skin--red .footer__contact__detail a {
    color: #555;
}

.skin--red .text-link--arrows:hover a {
    color: #333;
}

.skin--red .text-link--arrows:hover #double-arrows .cls-1 {
    fill: #333;
}

.skin--red .breadcrumb > li:before {
    content: url(../images/icon_singular-arrow--red.svg);
}

.skin--blue .breadcrumb > li:first-child:before {
    content: none;
}

.skin--red .breadcrumb a:hover,
.skin--red .breadcrumb a:active,
.skin--red .breadcrumb a:focus {
    color: #777;
}

/* ------------------------------------------------------
**** background
------------------------------------------------------ */
/* Dark Red*/
.skin--red .bg-primary_colour {
    background-color: #A52219;
    color: #fff;
}

/* Orange */
.skin--red .bg-accent_colour {
    background-color: #F7971D;
    color: #fff;
}

/* ------------------------------------------------------
**** buttons
------------------------------------------------------ */
.skin--red a.button {
    color: #555;
}
.skin--red a.button:hover {
    color: #fff;
}
.skin--red .button:after {
    content: url(../images/icon_button--arrows--red.svg);
}
.skin--red .button:before {
    background-color: #F7971D;
}
/* coloured button */
.skin--red .button--icon--colour .button--icon__content::after {
    background-image: url(../images/icon_button_arrows--red.svg);
}

.skin--red .button--icon--colour .button--icon__content::before {
    background-image: url(../images/icon_button_arrows--red--hover.svg);
}

/* white button */
.skin--red .button--icon--white .button--icon__content::after {
    background-image: url(../images/icon_button_arrows__inverse--red.svg);
}
.skin--red .button--icon--white .button--icon__content::before {
    background-image: url(../images/icon_button_arrows__inverse--red--hover.svg);
}

.skin--red .button--icon--white .button--icon__content:hover::after {
    background-image: url(../images/icon_button_arrows__inverse--red.svg);
}
.skin--red .button--icon--white .button--icon__content:hover::before {
    background-image: url(../images/icon_button_arrows__inverse--red--hover.svg);
}

.skin--red .button--icon--colour .button--icon__icon__background{
    background: #F7971D;
}

.skin--red .button--icon--colour:hover .button--icon__icon__background {
    background-color: #E18A1B;
 }

 .skin--red .button--icon--colour:hover .button--icon__content--active .button--icon__icon__background {
    background-color: #E18A1B;
}

/* ---- Forms ---- */

.skin--red .daterangepicker .applyBtn {
    background-color: #A52219;
}

.skin--red .field-input .textbox.file-upload__area--dragenter {
    border-color: #A52219;
}

/* Submit Bar */

 .skin--red .submit-bar .button:hover {
     background-color: #E18A1B;
}

 .skin--red  .submit-bar .button {
     background-color: #F7971D;
}

 /* ---- Header ---- */
 .skin--red .header__nav__wrapper:after {
    background-color: #A52219;
}

.skin--red .header__nav__wrapper--inner:before {
    background-color: #F7971D;
}

.skin--red .header__logo--container--inner:before {
    background: #A52219;
}

/* ---- Hero banner ---- */
.skin--red .hero-banner__text__container {
    background-color: rgba(165, 34, 25, 0.9);
}

/* ---- Footer ---- */
.skin--red  #footer {
    border-top: 10px solid #A52219;
}

/* Footer svg icons are inline html colour controlled */

/* ---- Sidebar ---- */
.skin--red .sidebar-linklist__item__sublist__item a {
    border-left: 5px solid #A52219;
}

.skin--red .sidebar-linklist__item__sublist__item:hover a {
    border-left: 5px solid #F7971D;
}
.skin--red .sidebar-linklist__item__button:before {
    content: url(../images/icon_singular-arrow--red.svg);
}

/* ---- Widgets ---- */
.skin--red  .widget-CaseStudy {
    background: #A52219;
}

.skin--red .widget-RelatedLinks li.depth1 > a {
    border-left: 10px solid #A52219;
}

.skin--red .widget-RelatedLinks li.depth1 > a:before {
    content: url(../images/icon_double-arrows--nav-red--hover.svg);
}

.skin--red .widget-RelatedLinks li.depth1 > a:after {
    content: url(../images/icon_double-arrows--nav-red.svg);
}

.skin--red .widget-RelatedLinks li.depth1.on > a {
    border-left: 10px solid #F7971D;
}

.skin--red .widget-RelatedLinks li.depth2 {
    border-left: 10px solid #A52219;
}

.skin--red .widget-RelatedLinks li.depth2.on > a {
    color: #A52219;
}

/* ---- Slick Slider ---- */
.skin--red .slick-dots .slick-active button {
    background-color: #F7971D;
}

.skin--red .sponsors-list__img-wrap:after {
    background-color: #A52219;
}

/* ---- Blog Posts ---- */
.skin--red .post-hub__item:before {
    background-color: #A52219;
}

.skin--red .post-hub__item:after {
    background-color: #A52219;
}

.skin--red .post-hub-filterlist__button,
.skin--red .post-view__cloud--categories a.button {
    background-color: #F7971D;
    color: #fff;
}

.skin--red .post-hub-filterlist__button:hover,
.skin--red .post-view__cloud--categories a.button:hover {
    background-color: #E18A1B;
}
.skin--red .post-hub-filterlist__button:after,
.skin--red .post-view__cloud--categories a.button:after {
    content: " ";
    background: url(../images/icon_singular-arrow--white.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: auto;
    background-color: transparent;
}