﻿@charset "UTF-8";



.is-displayed {
    display: block;
}

.is-displayed-flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.is-displayed-flex-imp {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
}

.is-not-displayed {
    display: none;
}

.is-displayed-mobile {
    display: none;
}

.is-displayed-tablet {
    display: none;
}

.is-displayed-phablet {
    display: none;
}


@media only screen and (max-width: 768px) {
    .is-displayed-tablet {
        display: block;
    }

    .is-not-displayed-tablet {
        display: none;
    }

    .is-displayed-flex {
        display: block !important;
    }
}

@media only screen and (max-width: 641px) {
    .mobile-display-block {
        display: block;
    }

    .is-displayed-phablet {
        display: block;
    }

    .is-not-displayed-phablet {
        display: none;
    }
}

@media only screen and (max-width: 410px) {
    .is-displayed-mobile {
        display: block;
    }

    .is-not-displayed-mobile {
        display: none;
    }
}

.is-displayed {
    display: block;
}

.is-displayed-flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.is-displayed-flex-imp {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
}

.is-not-displayed {
    display: none;
}

.is-displayed-mobile {
    display: none;
}

.is-displayed-tablet {
    display: none;
}

.is-displayed-phablet {
    display: none;
}


.clear {
    clear: both;
}

.clearfix, .centered-container, .centered-container-fullwidth, #primary-navigation .menu-level, #secondary-navigation, #breadcrumb {
    *zoom: 1;
}

    .clearfix:before, .centered-container:before, .centered-container-fullwidth:before, #primary-navigation .menu-level:before, #secondary-navigation:before, #breadcrumb:before, .clearfix:after, .centered-container:after, .centered-container-fullwidth:after, #primary-navigation .menu-level:after, #secondary-navigation:after, #breadcrumb:after {
        display: table;
        line-height: 0;
        content: "";
    }

    .clearfix:after, .centered-container:after, .centered-container-fullwidth:after, #primary-navigation .menu-level:after, #secondary-navigation:after, #breadcrumb:after {
        clear: both;
    }

/**
 * 5.0 - Animation and transitions
 * -----------------------------------------------------------------------------
 */
.border-top {
    border-top: 1px solid #E2DFDA;
}

.border-bottom {
    border-bottom: 1px solid #E2DFDA;
}

/**
 * 6.0 - Others
 * -----------------------------------------------------------------------------
 */
.underline-fade {
    border-bottom: 1px solid;
    border-bottom-color: rgba(255, 255, 255, 0.4);
}

.text-family-function {
    font-family: Roboto;
    font-size: 16px;
}


@font-face {
    font-family: 'Druk Text Web';
    src: url("../../SCB/StyleguideAssets/assets/fonts/Druk/DrukText-Medium-Web.eot");
    src: url("../../SCB/StyleguideAssets/assets/fonts/Druk/DrukText-Medium-Web.eot?#iefix") format("embedded-opentype"), url("../../SCB/StyleguideAssets/assets/fonts/Druk/DrukText-Medium-Web.woff2") format("woff2"), url("../../SCB/StyleguideAssets/assets/fonts/Druk/DrukText-Medium-Web.woff") format("woff");
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
}

.DrukText-Medium-Web {
    font-family: 'Druk Text Web';
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
}

/**
 * 1.0 - Roboto
 * -----------------------------------------------------------------------------
 * Referred to as $font-family-function
 */
@font-face {
    font-family: Roboto;
    src: url("../../SCB/StyleguideAssets/assets/fonts/Roboto/Regular/Roboto-Regular.woff2") format("woff2"), url("../../SCB/StyleguideAssets/assets/fonts/Roboto/Regular/Roboto-Regular.woff") format("woff");
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: Roboto;
    src: url("../../SCB/StyleguideAssets/assets/fonts/Roboto/Regular/Roboto-Regular.woff2") format("woff2"), url("../../SCB/StyleguideAssets/assets/fonts/Roboto/Regular/Roboto-Regular.woff") format("woff");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: Roboto;
    src: url("../../SCB/StyleguideAssets/assets/fonts/Roboto/Italic/Roboto-Italic.woff2") format("woff2"), url("../../SCB/StyleguideAssets/assets/fonts/Roboto/Italic/Roboto-Italic.woff") format("woff");
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: Roboto;
    src: url("../../SCB/StyleguideAssets/assets/fonts/Roboto/Medium/Roboto-Medium.woff2") format("woff2"), url("../../SCB/StyleguideAssets/assets/fonts/Roboto/Medium/Roboto-Medium.woff") format("woff");
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: Roboto;
    src: url("../../SCB/StyleguideAssets/assets/fonts/Roboto/Bold/Roboto-Bold.woff2") format("woff2"), url("../../SCB/StyleguideAssets/assets/fonts/Roboto/Bold/Roboto-Bold.woff") format("woff");
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: Roboto;
    src: url("../../SCB/StyleguideAssets/assets/fonts/Roboto/Bold/Roboto-Bold.woff2") format("woff2"), url("../../SCB/StyleguideAssets/assets/fonts/Roboto/Bold/Roboto-Bold.woff") format("woff");
    font-weight: bold;
    font-style: normal;
}

/**
 * 2.0 - PT Serif
 * -----------------------------------------------------------------------------
 * Referred to as $font-family-content
 */
@font-face {
    font-family: PT Serif;
    src: url("../../SCB/StyleguideAssets/assets/fonts/PT_Serif/Regular/PT_Serif-Regular.woff2") format("woff2"), url("../../SCB/StyleguideAssets/assets/fonts/PT_Serif/Regular/PT_Serif-Regular.woff") format("woff");
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: PT Serif;
    src: url("../../SCB/StyleguideAssets/assets/fonts/PT_Serif/Regular/PT_Serif-Regular.woff2") format("woff2"), url("../../SCB/StyleguideAssets/assets/fonts/PT_Serif/Regular/PT_Serif-Regular.woff") format("woff");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: PT Serif;
    src: url("../../SCB/StyleguideAssets/assets/fonts/PT_Serif/Italic/PT_Serif-Italic.woff2") format("woff2"), url("../../SCB/StyleguideAssets/assets/fonts/PT_Serif/Italic/PT_Serif-Italic.woff") format("woff");
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: PT Serif;
    src: url("../../SCB/StyleguideAssets/assets/fonts/PT_Serif/Bold/PT_Serif-Bold.woff2") format("woff2"), url("../../SCB/StyleguideAssets/assets/fonts/PT_Serif/Bold/PT_Serif-Bold.woff") format("woff");
    font-weight: 700;
    font-style: normal;
}

/**
 * 3.0 - PT Druk !! NOT IMPLEMENTED
 * -----------------------------------------------------------------------------
 * Referred to as $font-family-numbers
 */
/**
 * 4.0 - Material Icons
 * -----------------------------------------------------------------------------
  */
@font-face {
    font-family: Material Icons;
    src: url("../../SCB/StyleguideAssets/assets/fonts/Material_Design_Icons/Regular/Material_Design_Icons-Regular.woff2") format("woff2"), url("../../SCB/StyleguideAssets/assets/fonts/Material_Design_Icons/Regular/Material_Design_Icons-Regular.woff") format("woff");
}


html {
    font-family: "PT Serif", verdana, sans-serif;
    font-weight: 400;
    color: #222222;
    font-size: 62.5%;
}

body {
    font-size: 18px;
    font-size: 1.8rem;
    line-height: 30px;
    line-height: 3rem;
}

@media only screen and (max-width: 768px) {
    body {
        font-size: 16px;
        font-size: 1.6rem;
        line-height: 26px;
        line-height: 2.6rem;
    }
}

/**
 * 5.0 - Links
 * -----------------------------------------------------------------------------
 */
a, .link-style, .link-button {
    color: #1E00BE;
    text-decoration: none;
    padding-bottom: 0;
}

    a:hover, .link-style:hover, .link-button:hover {
        text-decoration: none;
        /*         color: $color-link-hover; */
    }

    a:active, .link-style:active, .link-button:active {
        text-decoration: none;
        /* color: $color-text; */
    }

    a.link-text-color, .link-text-color.link-style, .link-text-color.link-button {
        color: #222222;
        text-decoration: none;
    }

        a.link-text-color:hover, .link-text-color.link-style:hover, .link-text-color.link-button:hover {
            text-decoration: underline;
            color: #1E00BE;
        }

.xhtmlText a, .xhtmlText .link-style, .xhtmlText .link-button {
    font-family: "Roboto";
    font-weight: 500;
}

.xhtmlText a, .xhtmlText .link-style, .xhtmlText .link-button, .box a, .box .link-style, .box .link-button, .box-inline a, .box-inline .link-style, .box-inline .link-button, p a, .xhtmlText ul li a, #faktacontent ul li a, p .link-style, .xhtmlText ul li .link-style, #faktacontent ul li .link-style, p .link-button, .xhtmlText ul li .link-button, #faktacontent ul li .link-button, section a, section .link-style, section .link-button {
    border-bottom: 1px solid rgba(30, 0, 190, 0.2);
}

    .xhtmlText a:hover, .xhtmlText .link-style:hover, .xhtmlText .link-button:hover, .box a:hover, .box .link-style:hover, .box .link-button:hover, .box-inline a:hover, .box-inline .link-style:hover, .box-inline .link-button:hover, p a:hover, .xhtmlText ul li a:hover, #faktacontent ul li a:hover, p .link-style:hover, .xhtmlText ul li .link-style:hover, #faktacontent ul li .link-style:hover, p .link-button:hover, .xhtmlText ul li .link-button:hover, #faktacontent ul li .link-button:hover, section a:hover, section .link-style:hover, section .link-button:hover {
        border-bottom: 1px solid #1e00be;
    }

#footer .columns a, #footer .columns .link-style, #footer .columns .link-button {
    border-bottom: 1px solid rgba(255, 255, 255, 0.6);
}

    #footer .columns a:hover, #footer .columns .link-style:hover, #footer .columns .link-button:hover {
        border-bottom: 1px solid white;
    }

.reversed-decoration, .link-tag, #breadcrumb a, #breadcrumb .link-style, #breadcrumb .link-button {
    text-decoration: none;
}

    .reversed-decoration:hover, .link-tag:hover, #breadcrumb a:hover, #breadcrumb .link-style:hover, #breadcrumb .link-button:hover, .reversed-decoration:focus, .link-tag:focus, #breadcrumb a:focus, #breadcrumb .link-style:focus, #breadcrumb .link-button:focus {
        text-decoration: none;
    }


/**
 * 7.0 - Lists
 * -----------------------------------------------------------------------------
 */
ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

/**
 * 4.0 - Paragraphs and paragraph content
 * -----------------------------------------------------------------------------
 */
p, .xhtmlText ul li, #faktacontent ul li, .p {
    font-family: "PT Serif";
    font-weight: normal;
}

.ingress, .ingress p, .ingress .xhtmlText ul li, .xhtmlText ul .ingress li, .ingress #faktacontent ul li, #faktacontent ul .ingress li {
    font-size: 24px;
    font-size: 2.4rem;
    line-height: 38px;
    line-height: 3.8rem;
    font-family: "Roboto";
    font-weight: normal;
    display: block;
}

@media only screen and (max-width: 768px) {
    .ingress, .ingress p, .ingress .xhtmlText ul li, .xhtmlText ul .ingress li, .ingress #faktacontent ul li, #faktacontent ul .ingress li {
        font-size: 20px;
        font-size: 2rem;
        line-height: 30px;
        line-height: 3rem;
    }
}

p, .xhtmlText ul li, #faktacontent ul li, .p {
    margin: 0 0 24px 0;
}

.ingress {
    /*     margin-bottom: 30px;
    margin-bottom: 3rem; */
    margin-bottom: 30px;
    margin-bottom: 3rem;
}

/* p:last-child {
    margin-bottom:  $margin-large;
}
 */
p + h2, .xhtmlText ul li + h2, #faktacontent ul li + h2, ul + h2, figure + h2 {
    margin-top: 36px;
}

ul + h3, p + h3, .xhtmlText ul li + h3, #faktacontent ul li + h3, figure + h3, p + h4, .xhtmlText ul li + h4, #faktacontent ul li + h4, p + figcaption, .xhtmlText ul li + figcaption, #faktacontent ul li + figcaption, p + .figure-caption, .xhtmlText ul li + .figure-caption, #faktacontent ul li + .figure-caption, ul + h4, ul + figcaption, ul + .figure-caption, figure + h4, figure + figcaption, figure + .figure-caption {
    margin-top: 24px;
}

quote, blockquote {
    padding: 0 36px 0 30px;
    border-left: 6px solid #91289B;
    color: #91289B;
    display: block;
    font-size: 30px;
    font-size: 3rem;
    line-height: 44px;
    line-height: 4.4rem;
    font-weight: normal;
    margin: 24px 0 48px 0;
}

    quote .secondary, blockquote .secondary {
        font-size: 18px;
        font-size: 1.8rem;
        font-weight: normal;
    }



/**
 * 7.0 - Lists
 * -----------------------------------------------------------------------------
 */
ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

article ul {
    margin-left: 0;
    margin-top: 0;
    padding: 0 2rem;
}

ul.no-list-style {
    list-style: none;
    margin: 0;
    padding: 0;
}

.ul-list-large li {
    margin-bottom: 8px;
}


/**
 * 9.0 - Figure
 * -----------------------------------------------------------------------------
 */
/**
 * 9.0 - Classes
 * -----------------------------------------------------------------------------
 * Transformations, alignment
 */
.text-uppercase {
    text-transform: uppercase;
}

.text-align-right {
    text-align: right;
}

.text-align-left {
    text-align: left;
}

.text-align-center {
    text-align: center;
}

.text-semibold {
    font-weight: bold;
}

.text-strong {
    font-weight: bold;
}

.text-small, #secondary-navigation {
    font-size: 14px;
    font-size: 1.4rem;
}

.text-italic {
    font-style: italic;
}

.text-red {
    color: #CC0000;
}

.text-black {
    color: #222222;
}



/**
 * Buttons
 *
 * Description: Contains styling for buttons. 
 * Version: 1.0
 *
 * Comments:
 * -----------------------------------------------------------------------------
 */
button, .button, .more-button, .more-button-primary {
    font-family: "Roboto";
    line-height: 1;
    font-size: 18px;
    font-size: 1.8rem;
    border-radius: 60px;
    border-radius: 6rem;
    padding: 14px 28px;
    padding: 1.4rem 2.8rem;
    border: solid 1px #1E00BE;
    border: solid 0.1rem #1E00BE;
    border: 1px solid transparent;
    /* height: 48px; */
    text-decoration: none;
    cursor: pointer;
    font-weight: 500;
    display: inline-block;
    color: #FFFFFF;
    background: #1E00BE;
    position: relative;
}

    button:hover, .button:hover, .more-button:hover, .more-button-primary:hover {
        background: #462ec9;
    }

.smallbutton, .link-button, .search-box-button, .produkt-publikation-list-button {
    padding: 13px 24px 11px 24px;
    padding: 1.3rem 2.4rem 1.1rem 2.4rem;
    font-size: 14px;
    font-size: 1.4rem;
    /* height: 36px;> */
}

    .smallbutton.active, .active.link-button, .active.search-box-button, .active.produkt-publikation-list-button {
        padding-left: 34px;
    }

        .smallbutton.active:before, .active.link-button:before, .active.search-box-button:before, .active.produkt-publikation-list-button:before {
            left: 14px;
            top: 12px;
        }

.tinybutton {
    padding: 6px 12px;
    padding: 0.6rem 1.2rem;
    font-size: 12px;
    font-size: 1.2rem;
}

    .tinybutton.active {
        padding-left: 24px;
    }

        .tinybutton.active:before {
            left: 7px;
            top: 6px;
        }

.search-box-button {
    color: #FFFFFF;
}

.circle-down-gray {
    background: url("/StyleguideAssets/Scb/Img/Icons/pil_down_gray.png") 0 3px no-repeat;
    padding-left: 35px;
}

/*#endregion*/
/*#region HTML, body, * */
html {
    height: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

body {
    position: relative;
    margin: 0;
    background: #fff;
}

@media only screen and (max-width: 768px) {
    body {
        padding-top: 70px;
    }
}

@media only screen and (max-width: 768px) {
    #mainContent {
        -ms-word-wrap: break-word;
        word-wrap: break-word;
        margin-left: 10px;
        margin-right: 10px;
        padding-top: 20px;
    }
}

*, *:before, *:after {
    -webkit-box-sizing: inherit;
    box-sizing: inherit;
}

/*#endregion*/
/*#region Accessibility */
#mainContentAreaLink {
    position: absolute;
    top: -9999px;
    left: -9999px;
}

    #mainContentAreaLink:focus {
        position: absolute;
        top: 0;
        left: 0;
    }

#mainContentArea {
    display: block;
    height: 0;
    width: 0;
    padding: 0;
    background-image: none;
    clear: both;
}

/*#endregion*/
/*#region Images */
img {
    height: auto;
    /*     width: 100%; */
    max-width: 100%;
}

/*#endregion*/
#scb-logotype {
    display: block;
    position: absolute;
    top: 18px;
    left: 36px;
}

    #scb-logotype img {
        height: 54px;
        width: auto;
    }

@media only screen and (max-width: 768px) {
    #scb-logotype {
        top: 18px;
        left: 30px;
    }

        #scb-logotype img {
            height: 33px;
            width: 33px;
        }
}

#header {
    background: #FFFFFF;
    overflow: inherit;
    width: 100%;
    /* border-bottom: 1px solid $scb-color-light-gray; */
    -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.15);
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.15);
}

    #header .search-box {
        position: absolute;
        top: 54px;
        right: 36px;
        width: 425px;
    }

#secondary-header {
    background: #FFFFFF;
    overflow: inherit;
    width: 100%;
    border-bottom: 1px solid #E2DFDA;
}

    #secondary-header .centered-container {
        height: 105px;
    }

    #secondary-header p, #secondary-header .xhtmlText ul li, .xhtmlText ul #secondary-header li, #secondary-header #faktacontent ul li, #faktacontent ul #secondary-header li {
        font-family: "PT Serif";
        font-size: 30px;
        font-weight: bold;
    }

@media only screen and (max-width: 768px) {
    header#header {
        position: fixed;
        top: 0;
        min-height: 70px;
        max-height: 100%;
        z-index: 9999;
        -webkit-transition: top 0.2s ease-in-out;
        transition: top 0.2s ease-in-out;
        overflow-y: scroll;
    }

        header#header a, header#header .link-style, header#header .link-button {
            border-bottom: none;
        }

        header#header .centered-container {
            padding: 20px 0 0 0;
        }

        header#header form.search-box {
            position: static !important;
            margin: 48px 0 0 0;
            width: 100% !important;
            border-top: 1px solid #E2DFDA;
            padding: 24px;
            background-color: #F8F7F6;
        }

    body#body.nav-up header {
        top: -70px;
    }

    body#body.nav-down .selection-wrapper.sticky {
        -webkit-transition: top 0.2s ease-in-out;
        transition: top 0.2s ease-in-out;
        top: 70px;
    }
}

#menu-buttons-mobile {
    position: absolute;
    top: 26px;
    right: 45px;
    font-family: "Roboto";
    font-size: 14px;
    font-size: 1.4rem;
    line-height: 20px;
    line-height: 2rem;
}

    #menu-buttons-mobile a, #menu-buttons-mobile .link-style, #menu-buttons-mobile .link-button {
        color: #222222;
    }

    #menu-buttons-mobile .button-mobile {
        padding: 2px 20px 2px 25px;
        text-decoration: none;
    }

        #menu-buttons-mobile .button-mobile:after {
            font-family: 'Material Icons';
            font-size: 22px;
            font-size: 2.2rem;
            line-height: 22px;
            line-height: 2.2rem;
            margin-left: 8px;
            position: absolute;
            top: -2px;
        }

        #menu-buttons-mobile .button-mobile.search:after {
            content: "search";
        }

        #menu-buttons-mobile .button-mobile.menu:after {
            content: "menu";
        }

        #menu-buttons-mobile .button-mobile.menu.is-active:after {
            content: "close";
        }

/**
 * 1.0 - Clear
 * -----------------------------------------------------------------------------
 */
.clear {
    clear: both;
}

.clearfix, .centered-container, .centered-container-fullwidth, #primary-navigation .menu-level, #secondary-navigation, #breadcrumb {
    *zoom: 1;
}

    .clearfix:before, .centered-container:before, .centered-container-fullwidth:before, #primary-navigation .menu-level:before, #secondary-navigation:before, #breadcrumb:before, .clearfix:after, .centered-container:after, .centered-container-fullwidth:after, #primary-navigation .menu-level:after, #secondary-navigation:after, #breadcrumb:after {
        display: table;
        line-height: 0;
        content: "";
    }

    .clearfix:after, .centered-container:after, .centered-container-fullwidth:after, #primary-navigation .menu-level:after, #secondary-navigation:after, #breadcrumb:after {
        clear: both;
    }

#primary-navigation {
    margin-top: 120px;
    /*     &:hover{
        ul li a{
            color: black;
        }
    }
 */
}

    #primary-navigation .is-current-page-parent a, #primary-navigation .is-current-page-parent .link-style, #primary-navigation .is-current-page-parent .link-button, #primary-navigation .is-current-page a, #primary-navigation .is-current-page .link-style, #primary-navigation .is-current-page .link-button {
        border-bottom: 6px solid #000000;
        color: #000000;
    }

    #primary-navigation .menu-level-1 .menu-level {
        display: none;
    }

    #primary-navigation .menu-item {
        float: left;
        text-align: center;
        font-family: "Roboto";
    }

    #primary-navigation a, #primary-navigation .link-style, #primary-navigation .link-button {
        display: block;
        padding: 0 0 18px 0;
        margin: 0 30px 0px 0;
        text-decoration: none;
        line-height: 1;
        color: #1E00BE;
        font-weight: 500;
        border-bottom: 6px solid #FFFFFF;
    }

        #primary-navigation a:hover, #primary-navigation .link-style:hover, #primary-navigation .link-button:hover, #primary-navigation a:focus, #primary-navigation .link-style:focus, #primary-navigation .link-button:focus {
            color: #000000;
        }

    #primary-navigation ul {
        list-style: none;
        margin: 0;
        padding: 0;
    }

@media only screen and (max-width: 768px) {
    #primary-navigation {
        margin: 50px 0 0 0;
        position: relative;
        top: auto;
        left: auto;
        width: 100%;
        background-color: #F8F7F6;
        padding-top: 12px;
        padding-bottom: 12px;
        border-top: 1px solid #E2DFDA;
    }

        #primary-navigation:hover ul li a, #primary-navigation:hover ul li .link-style, #primary-navigation:hover ul li .link-button {
            color: #1E00BE;
        }

        #primary-navigation a, #primary-navigation .link-style, #primary-navigation .link-button {
            color: #1E00BE;
            font-size: 14px;
            font-size: 1.4rem;
            line-height: 20px;
            line-height: 2rem;
            font-weight: normal;
            width: 100%;
            text-align: left;
            padding: 12px 54px 12px 24px;
            /*             &:active{
                background-color: #303030 !important;
            }
 */
        }

        #primary-navigation .is-current-page-parent a, #primary-navigation .is-current-page-parent .link-style, #primary-navigation .is-current-page-parent .link-button, #primary-navigation .is-current-page a, #primary-navigation .is-current-page .link-style, #primary-navigation .is-current-page .link-button {
            border-bottom: none;
            color: #1E00BE;
        }

        #primary-navigation .menu-item {
            float: none;
            position: relative;
        }

            #primary-navigation .menu-item.is-parent > a:after, #primary-navigation .menu-item.is-parent > .link-style:after, #primary-navigation .menu-item.is-parent > .link-button:after {
                line-height: 24px;
                line-height: 2.4rem;
                font-size: 16px;
                font-size: 1.6rem;
                font-weight: bold;
                position: absolute;
                right: 24px;
                top: 12px;
                content: "\e145";
                font-family: "Material icons";
                -webkit-font-feature-settings: 'liga' 1;
                font-feature-settings: 'liga' 1;
            }

            #primary-navigation .menu-item.is-current-page-parent > a, #primary-navigation .menu-item.is-current-page-parent > .link-style, #primary-navigation .menu-item.is-current-page-parent > .link-button {
                border: none;
                color: #1E00BE;
                font-weight: 500;
            }

                #primary-navigation .menu-item.is-current-page-parent > a:after, #primary-navigation .menu-item.is-current-page-parent > .link-style:after, #primary-navigation .menu-item.is-current-page-parent > .link-button:after {
                    content: "\e15b";
                }

            #primary-navigation .menu-item.is-current-page > a, #primary-navigation .menu-item.is-current-page > .link-style, #primary-navigation .menu-item.is-current-page > .link-button {
                background: rgba(0, 0, 0, 0.03);
                color: #222222;
                border-left: 4px solid black;
                /*                     &:after {
                        color: #fff;
                    }
 */
            }

        #primary-navigation .menu-level-1 {
            /*> .menu-item {
                > a {
                    border-top: #7C7C7C;
                    background: $scb-color-medium-purple;
                    
                }

                &:first-child a {
                    background: $scb-color-purple;
                }
            }*/
        }

            #primary-navigation .menu-level-1 .menu-level {
                display: block;
            }

        #primary-navigation .menu-level-2 > .menu-item > a, #primary-navigation .menu-level-2 > .menu-item > .link-style, #primary-navigation .menu-level-2 > .menu-item > .link-button {
            padding-left: 44px;
        }

        #primary-navigation .menu-level-2 > .menu-item.is-current-page > a, #primary-navigation .menu-level-2 > .menu-item.is-current-page > .link-style, #primary-navigation .menu-level-2 > .menu-item.is-current-page > .link-button {
            padding-left: 40px;
        }

        #primary-navigation .menu-level-3 > .menu-item > a, #primary-navigation .menu-level-3 > .menu-item > .link-style, #primary-navigation .menu-level-3 > .menu-item > .link-button {
            padding-left: 64px;
        }

        #primary-navigation .menu-level-3 > .menu-item.is-current-page > a, #primary-navigation .menu-level-3 > .menu-item.is-current-page > .link-style, #primary-navigation .menu-level-3 > .menu-item.is-current-page > .link-button {
            padding-left: 60px;
        }

        #primary-navigation .menu-level-4 > .menu-item > a, #primary-navigation .menu-level-4 > .menu-item > .link-style, #primary-navigation .menu-level-4 > .menu-item > .link-button {
            padding-left: 84px;
        }

        #primary-navigation .menu-level-4 > .menu-item.is-current-page > a, #primary-navigation .menu-level-4 > .menu-item.is-current-page > .link-style, #primary-navigation .menu-level-4 > .menu-item.is-current-page > .link-button {
            padding-left: 80px;
        }
}

#secondary-navigation {
    position: absolute;
    top: 18px;
    right: 36px;
    line-height: 1;
    /*     &:hover{
        ul li a{
            color: $scb-color-light-gray;
        }
    } */
}

    #secondary-navigation ul {
        list-style: none;
        margin: 0;
        padding: 0;
    }

    #secondary-navigation .menu-item {
        float: left;
        margin-left: 24px;
        font-family: "Roboto";
    }

        #secondary-navigation ul li a, #secondary-navigation ul li .link-style, #secondary-navigation ul li .link-button, #secondary-navigation .menu-item span {
            text-decoration: none;
            font-size: 14px;
            font-size: 1.4rem;
            line-height: 20px;
            line-height: 2rem;
            font-weight: 500;
            border-bottom: none;
        }

            #secondary-navigation ul li a:hover, #secondary-navigation ul li .link-style:hover, #secondary-navigation ul li .link-button:hover, #secondary-navigation .menu-item span:hover {
                color: black;
            }

@media only screen and (max-width: 768px) {
    #secondary-navigation {
        position: relative;
        top: auto;
        left: auto;
        right: auto;
        width: 100%;
        padding: 24px 15px;
        background: #F8F7F6;
        border-top: none;
        /*         li.menu-item:first-child {
            margin-left: $margin-medium-plus;
        }
 */
    }

        #secondary-navigation ul {
            list-style: none;
            margin: 0;
            padding: 0;
        }

        #secondary-navigation ul {
            padding: 24px 0 0 0;
            border-top: 1px solid #E2DFDA;
        }

        #secondary-navigation li.menu-item {
            margin: 0 3px 6px 3px;
        }

        #secondary-navigation .menu-item {
            font-family: "Roboto";
            line-height: 1;
            border-radius: 60px;
            border-radius: 6rem;
            padding: 6px 12px 6px 12px;
            padding: 0.6rem 1.2rem 0.6rem 1.2rem;
            font-size: 14px;
            font-size: 1.4rem;
            /* height: 48px; */
            text-decoration: none;
            cursor: pointer;
            font-weight: 500;
            display: inline-block;
            position: relative;
            background-color: #e4e1f7;
            border: none;
        }

            #secondary-navigation .menu-item a, #secondary-navigation .menu-item .link-style, #secondary-navigation .menu-item .link-button {
                color: #1E00BE;
                font-weight: 500;
            }

            #secondary-navigation .menu-item:active {
                color: #FFFFFF;
                background-color: rgba(255, 255, 255, 0.18);
            }

            #secondary-navigation .menu-item.active {
                background-color: rgba(255, 255, 255, 0.18);
                color: #FFFFFF;
            }

                #secondary-navigation .menu-item.active:hover {
                    background-color: rgba(255, 255, 255, 0.18);
                }

            #secondary-navigation .menu-item.is-inactive {
                border: none;
                color: #7A7671;
            }
}

#scb-logotype {
    display: block;
    position: absolute;
    top: 18px;
    left: 36px;
}

    #scb-logotype img {
        height: 54px;
        width: auto;
    }

@media only screen and (max-width: 768px) {
    #scb-logotype {
        top: 18px;
        left: 30px;
    }

        #scb-logotype img {
            height: 33px;
            width: 33px;
        }
}

#header {
    background: #FFFFFF;
    overflow: inherit;
    width: 100%;
    /* border-bottom: 1px solid $scb-color-light-gray; */
    -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.15);
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.15);
}

    #header .search-box {
        position: absolute;
        top: 54px;
        right: 36px;
        width: 425px;
    }

@media only screen and (max-width: 768px) {
    header#header {
        position: fixed;
        top: 0;
        min-height: 70px;
        max-height: 100%;
        z-index: 9999;
        -webkit-transition: top 0.2s ease-in-out;
        transition: top 0.2s ease-in-out;
        overflow-y: scroll;
    }

        header#header a, header#header .link-style, header#header .link-button {
            border-bottom: none;
        }

        header#header .centered-container {
            padding: 20px 0 0 0;
        }

        header#header form.search-box {
            position: static !important;
            margin: 48px 0 0 0;
            width: 100% !important;
            border-top: 1px solid #E2DFDA;
            padding: 24px;
            background-color: #F8F7F6;
        }

    body#body.nav-up header {
        top: -70px;
    }

    body#body.nav-down .selection-wrapper.sticky {
        -webkit-transition: top 0.2s ease-in-out;
        transition: top 0.2s ease-in-out;
        top: 70px;
    }
}

#menu-buttons-mobile {
    position: absolute;
    top: 26px;
    right: 45px;
    font-family: "Roboto";
    font-size: 14px;
    font-size: 1.4rem;
    line-height: 20px;
    line-height: 2rem;
}

    #menu-buttons-mobile a, #menu-buttons-mobile .link-style, #menu-buttons-mobile .link-button {
        color: #222222;
    }

    #menu-buttons-mobile .button-mobile {
        padding: 2px 20px 2px 25px;
        text-decoration: none;
    }

        #menu-buttons-mobile .button-mobile:after {
            font-family: 'Material Icons';
            font-size: 22px;
            font-size: 2.2rem;
            line-height: 22px;
            line-height: 2.2rem;
            margin-left: 8px;
            position: absolute;
            top: -2px;
        }

        #menu-buttons-mobile .button-mobile.search:after {
            content: "search";
        }

        #menu-buttons-mobile .button-mobile.menu:after {
            content: "menu";
        }

        #menu-buttons-mobile .button-mobile.menu.is-active:after {
            content: "close";
        }

/* ==========================================================================       
   layout.scss
   
   SMACSS om vad som är layout css - https://smacss.com/book/type-layout
   ========================================================================== */
.clear {
    clear: both;
}

.clearfix, .centered-container, .centered-container-fullwidth, #primary-navigation .menu-level, #secondary-navigation, #breadcrumb {
    *zoom: 1;
}

    .clearfix:before, .centered-container:before, .centered-container-fullwidth:before, #primary-navigation .menu-level:before, #secondary-navigation:before, #breadcrumb:before, .clearfix:after, .centered-container:after, .centered-container-fullwidth:after, #primary-navigation .menu-level:after, #secondary-navigation:after, #breadcrumb:after {
        display: table;
        line-height: 0;
        content: "";
    }

    .clearfix:after, .centered-container:after, .centered-container-fullwidth:after, #primary-navigation .menu-level:after, #secondary-navigation:after, #breadcrumb:after {
        clear: both;
    }

.centered-container {
    position: relative;
    width: 100%;
    max-width: 1440px;
    margin: 0 auto;
    padding: 0 36px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}


/*#region Footer */
#footer {
    padding: 0 0 1px;
    position: relative;
    color: #FFFFFF;
    background: #222222;
    float: left;
    width: 100%;
    margin-top: 0px;
}

    #footer ul {
        list-style-type: none;
    }

    #footer h2, #footer .h2 {
        font-family: "Roboto";
        font-weight: 600;
        font-size: 18px;
        font-size: 1.8rem;
        line-height: 30px;
        line-height: 3rem;
        margin: 0px;
        margin: 0rem;
        margin-bottom: 24px;
    }

    #footer h5, #footer .h5 {
        font-family: "Roboto";
        font-weight: 300;
        font-size: 14px;
        font-size: 1.4rem;
        line-height: 22px;
        line-height: 2.2rem;
        margin: 0px;
        margin: 0rem;
        margin-bottom: 0;
    }

    #footer .footer-top {
        background: #91289B;
    }

        #footer .footer-top .footer-top-item {
            padding: 60px 10px;
            width: calc(100% / 7.1);
            text-align: center;
            float: left;
        }

            #footer .footer-top .footer-top-item:hover img {
                opacity: 0.8;
            }

            #footer .footer-top .footer-top-item a, #footer .footer-top .footer-top-item .link-style, #footer .footer-top .footer-top-item .link-button, #footer .footer-top .footer-top-item a p, #footer .footer-top .footer-top-item .link-style p, #footer .footer-top .footer-top-item .link-button p, #footer .footer-top .footer-top-item a .xhtmlText ul li, .xhtmlText ul #footer .footer-top .footer-top-item a li, #footer .footer-top .footer-top-item .link-style .xhtmlText ul li, .xhtmlText ul #footer .footer-top .footer-top-item .link-style li, #footer .footer-top .footer-top-item .link-button .xhtmlText ul li, .xhtmlText ul #footer .footer-top .footer-top-item .link-button li, #footer .footer-top .footer-top-item a #faktacontent ul li, #faktacontent ul #footer .footer-top .footer-top-item a li, #footer .footer-top .footer-top-item .link-style #faktacontent ul li, #faktacontent ul #footer .footer-top .footer-top-item .link-style li, #footer .footer-top .footer-top-item .link-button #faktacontent ul li, #faktacontent ul #footer .footer-top .footer-top-item .link-button li, #footer .footer-top .footer-top-item a p.text-strong, #footer .footer-top .footer-top-item .link-style p.text-strong, #footer .footer-top .footer-top-item .link-button p.text-strong, #footer .footer-top .footer-top-item a .xhtmlText ul li.text-strong, .xhtmlText ul #footer .footer-top .footer-top-item a li.text-strong, #footer .footer-top .footer-top-item .link-style .xhtmlText ul li.text-strong, .xhtmlText ul #footer .footer-top .footer-top-item .link-style li.text-strong, #footer .footer-top .footer-top-item .link-button .xhtmlText ul li.text-strong, .xhtmlText ul #footer .footer-top .footer-top-item .link-button li.text-strong, #footer .footer-top .footer-top-item a #faktacontent ul li.text-strong, #faktacontent ul #footer .footer-top .footer-top-item a li.text-strong, #footer .footer-top .footer-top-item .link-style #faktacontent ul li.text-strong, #faktacontent ul #footer .footer-top .footer-top-item .link-style li.text-strong, #footer .footer-top .footer-top-item .link-button #faktacontent ul li.text-strong, #faktacontent ul #footer .footer-top .footer-top-item .link-button li.text-strong {
                display: block;
                color: #FFFFFF;
                font-family: "Roboto";
                font-weight: 500;
                line-height: 30px;
                line-height: 3rem;
                font-size: 18px;
                font-size: 1.8rem;
                margin: 0;
                border: none;
            }

@media only screen and (max-width: 768px) {
    #footer .footer-top ul {
        padding: 30px 0;
    }

    #footer .footer-top .footer-top-item {
        width: 33%;
        padding: 15px 10px 0px 10px;
    }
}

@media only screen and (max-width: 641px) {
    #footer .footer-top .footer-top-item {
        width: 50%;
    }

        #footer .footer-top .footer-top-item:nth-child(2n +3) {
            clear: both;
        }
}

#footer .footer-bottom {
    margin: 72px auto 60px auto;
    max-width: 1440px;
}

@media only screen and (max-width: 641px) {
    #footer .footer-bottom h4, #footer .footer-bottom figcaption, #footer .footer-bottom .figure-caption {
        margin: 36px 0 12px 0;
    }
}

@media only screen and (max-width: 641px) {
    #footer .footer-bottom {
        margin: 12px auto 48px auto;
    }
}

#footer .footer-bottom ul {
    margin: 24px 0 0 0;
    padding: 0;
}

#footer .footer-bottom li {
    margin-bottom: 12px;
}

    #footer .footer-bottom li:last-child {
        margin-bottom: 0;
    }

#footer .footer-bottom p, #footer .footer-bottom .xhtmlText ul li, .xhtmlText ul #footer .footer-bottom li, #footer .footer-bottom #faktacontent ul li, #faktacontent ul #footer .footer-bottom li, #footer .footer-bottom a, #footer .footer-bottom .link-style, #footer .footer-bottom .link-button, #footer .footer-bottom a p, #footer .footer-bottom .link-style p, #footer .footer-bottom .link-button p, #footer .footer-bottom a .xhtmlText ul li, .xhtmlText ul #footer .footer-bottom a li, #footer .footer-bottom .link-style .xhtmlText ul li, .xhtmlText ul #footer .footer-bottom .link-style li, #footer .footer-bottom .link-button .xhtmlText ul li, .xhtmlText ul #footer .footer-bottom .link-button li, #footer .footer-bottom a #faktacontent ul li, #faktacontent ul #footer .footer-bottom a li, #footer .footer-bottom .link-style #faktacontent ul li, #faktacontent ul #footer .footer-bottom .link-style li, #footer .footer-bottom .link-button #faktacontent ul li, #faktacontent ul #footer .footer-bottom .link-button li, #footer .footer-bottom a p.text-strong, #footer .footer-bottom .link-style p.text-strong, #footer .footer-bottom .link-button p.text-strong, #footer .footer-bottom a .xhtmlText ul li.text-strong, .xhtmlText ul #footer .footer-bottom a li.text-strong, #footer .footer-bottom .link-style .xhtmlText ul li.text-strong, .xhtmlText ul #footer .footer-bottom .link-style li.text-strong, #footer .footer-bottom .link-button .xhtmlText ul li.text-strong, .xhtmlText ul #footer .footer-bottom .link-button li.text-strong, #footer .footer-bottom a #faktacontent ul li.text-strong, #faktacontent ul #footer .footer-bottom a li.text-strong, #footer .footer-bottom .link-style #faktacontent ul li.text-strong, #faktacontent ul #footer .footer-bottom .link-style li.text-strong, #footer .footer-bottom .link-button #faktacontent ul li.text-strong, #faktacontent ul #footer .footer-bottom .link-button li.text-strong {
    display: block;
    color: #FFFFFF;
    font-family: "Roboto";
    font-weight: normal;
    line-height: 20px;
    line-height: 2rem;
    font-size: 14px;
    font-size: 1.4rem;
}

#footer .footer-bottom a, #footer .footer-bottom .link-style, #footer .footer-bottom .link-button {
    font-weight: 500;
}

#footer .footer-bottom p:last-child, #footer .footer-bottom .xhtmlText ul li:last-child, .xhtmlText ul #footer .footer-bottom li:last-child, #footer .footer-bottom #faktacontent ul li:last-child, #faktacontent ul #footer .footer-bottom li:last-child {
    margin-bottom: 0;
}

#footer .footer-bottom .columns {
    padding-right: 2%;
}

#footer .columns a, #footer .columns .link-style, #footer .columns .link-button {
    display: inline;
    color: #FFFFFF;
    text-decoration: none;
}

#footer .copyright {
    text-align: center;
    clear: both;
    font-family: "Roboto";
    font-size: 14px;
    font-size: 1.4rem;
    line-height: 20px;
    line-height: 2rem;
    margin: 0px;
    margin: 0rem;
    max-width: 440px;
    margin: 72px auto;
}

    #footer .copyright img {
        margin-bottom: 18px;
    }

@media only screen and (max-width: 641px) {
    #footer .copyright {
        max-width: 80%;
        font-size: 12px;
        font-size: 1.2rem;
        line-height: 18px;
        line-height: 1.8rem;
    }
}

.icon_background {
    background-color: rgba(0, 0, 0, 0.12);
    border-radius: 48px;
    height: 96px;
    width: 96px;
    display: inline-block;
    position: relative;
    margin-bottom: 6px;
}

    .icon_background .material-icons {
        position: absolute;
        top: 50%;
        left: 50%;
        font-size: 48px;
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }

.footer-top-item a:hover, .footer-top-item .link-style:hover, .footer-top-item .link-button:hover {
    text-decoration: none;
}

    .footer-top-item a:hover .icon_background, .footer-top-item .link-style:hover .icon_background, .footer-top-item .link-button:hover .icon_background {
        background-color: rgba(0, 0, 0, 0.18);
    }

.footer_logo {
    width: 40px;
    height: auto;
}

.footer-vision-logo p, .footer-vision-logo .xhtmlText ul li, .xhtmlText ul .footer-vision-logo li, .footer-vision-logo #faktacontent ul li, #faktacontent ul .footer-vision-logo li {
    font-family: "PT Serif";
    font-size: 30px;
    font-weight: bold;
}

.footer-vision-logo img {
    height: 24px;
}

/*#endregion*/
.search-box-wrapper {
    margin: 6px 0 24px;
    padding: 30px;
    position: relative;
    background: #F8F7F6;
}

.search-box {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.search-box-field-gray {
    width: 85%;
    padding-right: 12px;
    position: relative;
}

    .search-box-field-gray border-top-ra .search-box-button {
        border-color: #FFFFFF;
        background-color: #FFFFFF;
        color: #1E00BE;
    }

    .search-box-field-gray input {
        width: 100%;
        padding: 15px 18px 15px 48px;
        line-height: 26px;
        line-height: 2.6rem;
        font-size: 18px;
        font-size: 1.8rem;
        height: 60px;
        font-family: "Roboto";
        background-color: #F8F7F6;
        border: 1px solid #E2DFDA;
    }

        .search-box-field-gray input::-webkit-input-placeholder {
            color: #7A7671;
        }

        .search-box-field-gray input:-moz-placeholder {
            color: #7A7671;
        }

        .search-box-field-gray input::-moz-placeholder {
            /* Firefox 19+ */
            color: #7A7671;
        }

        .search-box-field-gray input:-ms-input-placeholder {
            color: #7A7671;
        }

        .search-box-field-gray input:focus {
            border-top: 1px solid #B1ADA5;
            border-left: 1px solid #B1ADA5;
            border-right: 1px solid #B1ADA5;
            border-bottom: 1px solid #E2DFDA;
            border-bottom-left-radius: 0;
            border-bottom-right-radius: 0;
            -webkit-box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.15);
            box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.15);
        }

    .search-box-field-gray::after {
        position: absolute;
        left: 18px;
        top: 15px;
        font-family: 'Material Icons';
        font-size: 24px;
        font-size: 2.4rem;
        content: "\e8b6";
        color: #222222;
    }

.search-box-field {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    padding-right: 10px;
    position: relative;
}

    .search-box-field .search-box-button {
        border-color: #FFFFFF;
        background-color: #FFFFFF;
        color: #1E00BE;
    }

    .search-box-field input {
        width: 100%;
        padding: 7px 8px 5px 42px;
        line-height: 28px;
        line-height: 2.8rem;
        font-size: 16px;
        font-size: 1.6rem;
        height: 42px;
        font-family: "Roboto";
        -webkit-box-shadow: inset 0 0px 0px 0 rgba(0, 0, 0, 0.3);
        box-shadow: inset 0 0px 0px 0 rgba(0, 0, 0, 0.3);
        border: 1px solid #E2DFDA;
    }

        .search-box-field input::-webkit-input-placeholder {
            color: #7A7671;
        }

        .search-box-field input:-moz-placeholder {
            color: #7A7671;
        }

        .search-box-field input::-moz-placeholder {
            /* Firefox 19+ */
            color: #7A7671;
        }

        .search-box-field input:-ms-input-placeholder {
            color: #7A7671;
        }

    .search-box-field::after {
        position: absolute;
        left: 11px;
        top: 8px;
        font-family: 'Material Icons';
        font-size: 24px;
        font-size: 2.4rem;
        content: "\e8b6";
        color: #222222;
    }

/* ==========================================================================       
   grid.scss
       
    * Skeleton V2.0.4
    * Copyright 2014, Dave Gamache
    * www.getskeleton.com
    * Free to use under the MIT license.
    * http://www.opensource.org/licenses/mit-license.php
    * 12/9/2014
    * Sass Version by Seth Coelen https://github.com/whatsnewsaes    
   
   ========================================================================== */
.container {
    position: relative;
    width: 100%;
    max-width: 1440px;
    margin: 0 auto;
    padding: 0 20px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.row.row--line-top {
    border-top: 1px solid #E2DFDA;
    padding-top: 36px;
}

.row.top-line {
    margin-top: 60px;
    padding-top: 60px;
}

aside.wide-aside {
    margin-bottom: 36px;
}

/* #pageContent .row{
    margin-bottom: $margin-large;
  }
   */
.column,
.columns {
    width: 100%;
    float: left;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

/* @media (min-width: $bp-larger-than-phablet) { */
@media (min-width: 768px) {
    .column,
    .columns {
        margin-left: 2%;
    }

        .column:first-child,
        .columns:first-child {
            margin-left: 0;
        }

    .three.columns {
        width: 23.5%;
    }
}

.container:after,
.row:after {
    content: "";
    display: table;
    clear: both;
}


@media only screen and (max-width: 768px) {
    .is-displayed-tablet {
        display: block;
    }

    .is-not-displayed-tablet {
        display: none;
    }

    .is-displayed-flex {
        display: block !important;
    }
}

@media only screen and (max-width: 641px) {
    .mobile-display-block {
        display: block;
    }

    .is-displayed-phablet {
        display: block;
    }

    .is-not-displayed-phablet {
        display: none;
    }
}

@media only screen and (max-width: 410px) {
    .is-displayed-mobile {
        display: block;
    }

    .is-not-displayed-mobile {
        display: none;
    }
}
