/* HIDE MOBILE ONLY*/

.mobile {
    display: none !important; /* use on all items that you only want to show on mobile */
}
/* TYPOGRAPHY OVERRIDES */

body {
    font-size: 14px;
    line-height: 1.52em;
    min-width: 768px; /* portrait tablet */
}
/* COMMON LAYOUT STYLES */

body {
    background-color: #EBEEEF;
    background-image: url(../content/images/bg.jpg);
    background-attachment: fixed;
    background-size: 100%;
}

.gutter {
    display: block;
    overflow: hidden;
    padding: 16px;
}

.wrapper-gutter {
    display: block;
    padding: 16px;
    padding-top: 0;
}

#page-wrapper {
    display: block;
    margin: 0 auto;
    max-width: 1156px;
    overflow: hidden;
    position: relative;
    z-index: 1;
}

.content-wrapper {
    background-color: #FFFFFF;
    box-shadow: 0 0 4px 0 #999999;
    display: block;
    margin: 0 auto;
    max-width: 1088px;
    overflow: hidden;
    padding: 0 24px;
    position: relative;
    z-index: 1;
}

.container.content-wrapper {
    margin-top: 4px;
}

.primary {
    width: 60%;
    float: left;
}

.secondary {
    width: 33.3%;
    float: right;
}

.subpage .primary {
    width: 55%;
}

.subpage .secondary {
    width: 40%;
}
/* HEADER --------------------------------------------------- */

#header {
    height: 53px;
    height: 100px;
    margin: 0 auto;
    margin-top: 8px;
    margin-bottom: 8px;
    width: 100%;
    max-width: 1124px;
    background: rgba(255,255,255,0.8);
    overflow: visible;
    position: relative;
    z-index: 10;
    display: block;
    clear: both;
}

    #header .gutter {
        position: relative;
        max-width: 1088px;
        height: 53px;
        height: 100px;
        overflow: visible;
        margin: 0 auto;
        padding: 0;
    }

#homelogo {
    background-image: url(../content/images/homelogo-1-1.png);
    background-position: center center;
    background-size: 100%;
    height: 53px;
    float: left;
    width: 132px;
    margin-left: 20px;
    margin-top:22px
}
/* LANGUAGE */
.select-language {
    position: absolute;
    right: 170px;
    top: 12px;
    height: 28px;
}
.select-language a {
    display: inline-block;
    line-height: 28px;
    font-size: 13px;
    text-transform: uppercase;
    padding: 0 8px 0 32px;
    color: #333;
    background-position: left center;
    background-repeat: no-repeat;
    background-size: 28px;
}
.select-language a.lang-nb-NO {
    background-image: url(/Content/images/nb-NO.png);
}
.select-language a.lang-en-GB {
    background-image: url(/Content/images/en-gb.png);
}
body.nb-NO a.lang-nb-NO {
    text-decoration: underline;
    opacity: 0.35;
}
body.en-GB a.lang-en-GB {
    text-decoration: underline;
    opacity: 0.35;
}

/* END */
.search {
    position: absolute;
    right: 16px;
    top: 10px;
    width: 144px;
}

    .search .gutter {
        padding: 0 !important;
        height: 28px!Important;
        border: 1px solid #ccc;
        background: #fff;
    }

    .search input[type='text'] {
        border: 0px;
        float: left;
        margin: 0;
        padding: 0;
        line-height: 28px;
        height: 28px;
        width: 60%;
    }

    .search input[type='submit'] {
        background: #ccc;
        background-image: url(../Content/images/search-icon.png);
        background-position: center center;
        background-repeat: no-repeat;
        background-size: 28px;
        width: 28px;
        height: 28px;
        border: 0px;
        float: right;
        margin: 0px;
    }

        .search input[type='submit']:hover {
            cursor: pointer;
            background-color: #bbb;
        }

.breadcrumbs {
    font-size: 0.875em;
    font-style: italic;
    line-height: 2em;
    border-bottom: 1px solid #EEEEEE;
}

    .breadcrumbs .gutter {
        text-align: center;
    }
/* navigation */

.menu1 {
    position: absolute;
    right: 8px;
    bottom: 0;
    line-height: 40px;
    z-index: 4;
}

    .menu1 li {
        display: inline-block;
        float: lefT;
    }

    .menu1 a {
        display: block;
        overflow: hidden;
        padding: 0 10px;
        color: #444;
        text-transform: uppercase;
        font-weight: 500;
    }

        .menu1 a.current {
            color: #63b145;
            text-decoration: none;
            background-image: url(../content/images/menu1-bg.png);
            background-position: center 10px;
            background-repeat: no-repeat;
            text-align: center;
            min-width: 100px;
        }

.menu2 {
    overflow: hidden;
    position: relative;
    z-index: 10;
    margin: 0 auto;
    width: 100%;
    max-width: 1034px;
    text-align: right;
    line-height: 28px;
    margin-bottom: -4px;
    margin-top: 8px;
}

    .menu2 li {
        display: inline-block;
    }

    .menu2 a {
        display: block;
        padding: 0 1em 0 1em;
        color: #333;
        border: 1px solid transparent;
    }

        .menu2 a.current {
            background: #fff;
            border-top: 1px solid #ddd;
            border-left: 1px solid #ddd;
            border-right: 1px solid #ddd;
            font-weight: 400;
            color: #4B5C66;
            text-decoration: none;
        }

#header-ornament {
    left: 148px;
    position: absolute;
    top: 0;
    z-index: 2;
}
/* sharing/social media */

a.share {
    width: 25px;
    height: 25px;
}
/* footer */

#footer {
    font-size: 0.875em;
    margin: 0 auto;
    max-width: 1072px;
    overflow: hidden;
    padding: 0 24px 24px;
    position: relative;
    padding-top: 16px; /*border-bottom: 1px solid #ddd;    box-shadow: 0px 1px 0px #fff;*/
    background: rgba(255,255,255,0.8);
}

.footerbox {
    display: inline-block;
    float: left;
    width: 33.334%;
    position: relative;
    z-index: 4;
}

    .footerbox .gutter {
        padding-top: 0;
    }

#footer-ornament {
    position: absolute;
    right: 0;
    top: 0;
    z-index: 0;
}

#footerlogo {
    position: absolute;
    right: 16px;
    bottom: 8px;
}
/* HOME PAGE */ /* billboard     NOTE: different layout on billboards - home vs start pages */ /* generic styling */

#billboard {
    display: block;
    overflow: hidden;
    margin-bottom: 16px;
    background-color: #fff;
    box-shadow: 0 0 4px 0 #999999;
    margin-top: 4px;
}

.billboard-text ul {
    max-width: 80%;
    margin: 0 auto;
}

    .billboard-text ul li {
        background-image: url(../content/images/bullet.png);
        background-position: left center;
        background-repeat: no-repeat;
        padding-left: 15px;
        padding-bottom: 3px;
        text-align: left;
    }
/* global home page  */

body.Frontpage.Home .teaserItem img,
body.Frontpage.Hjem .teaserItem img {
    width: 50%;
    float: right;
}

body.Frontpage.Home .billboard-text,
body.Frontpage.Hjem .billboard-text {
    display: block;
    overflow: hidden;
    width: 45%;
    padding: 2.5%;
    float: left;
    text-align: center;
    font-size: 1em;
}

    body.Frontpage.Home .billboard-text h1,
    body.Frontpage.Hjem .billboard-text h1 {
        text-transform: uppercase;
        font-weight: 500;
    }

    body.Frontpage.Home .billboard-text p,
    body.Frontpage.Hjem .billboard-text p {
        font-size: 1.32em;
        line-height: 1.44em;
        text-align: center !important;
    }

.teaserNav {
    left: 30px;
    bottom: 15px;
    position: absolute;
    z-index: 5;
   

}

/* surfactants home page */

body.Surfactants .teaserItem, body.Functionalmaterials .teaserItem,
body.Tensider .teaserItem, body.Tekniskeprodukter .teaserItem {
    position: relative;
}

    body.Surfactants .teaserItem img, body.Functionalmaterials .teaserItem img,
    body.Tensider .teaserItem img, body.Tekniskeprodukter .teaserItem img {
        position: relative;
        z-index: 0;
    }

body.Surfactants .billboard-text, body.Functionalmaterials .billboard-text,
body.Tensider .billboard-text, body.Tekniskeprodukter .billboard-text {
    max-width: 66.7%;
    position: absolute;
    right: 0px;
    bottom: 0px;
    z-index: 2;
    text-align: right;
}

    body.Surfactants .billboard-text .gutter,
    body.Tensider .billboard-text .gutter  {
        padding: 16px 32px 16px 40px;
        color: #fff;
        text-align: right !important;
    }

    body.Functionalmaterials .billboard-text .gutter,
    body.Tekniskeprodukter .billboard-text .gutter {
        padding: 16px 32px 16px 40px;
        color: #fff;
        text-align: right !important;
    }

        body.Functionalmaterials .billboard-text .gutter h1, body.Surfactants .billboard-text .gutter h1,
        body.Tekniskeprodukter .billboard-text .gutter h1, body.Tensider .billboard-text .gutter h1  {
            font-size: 4em;
            margin: 0;
        }

.billboard-text .gutter p {
    text-align: right !important;
    font-size: 2em;
    line-height: 1.24em;
}
/* home page cta */

.Frontpage .homepage-cta {
    display: block;
    overflow: hidden;
    clear: both;
    text-align: center;
    border-bottom: 4px solid #EBEEEF;
}

.homepage-cta div.box {
    width: 50%;
    display: inline-block;
    overflow: hidden;
    float: left;
}

.homepage-cta h3 a {
    font-size: 1em;
    background-image: url(../Content/images/caret-white-32.png);
    background-position: right center;
    background-repeat: no-repeat;
    margin-bottom: 0.5em;
    font-weight: 500;
    padding: 0.15em 0 0.15em 16px;
}

.homepage-cta h3 a {
    color: #ffffff;
    display: block;
    text-transform: uppercase;
}

.homepage-cta a h3:hover {
    text-decoration: underline;
}

.homepage-cta .box h3 a {
    background-color: #52483f;
}

.homepage-cta .box:first-child h3 a {
    background-color: #136582;
}
/* featured items */

.featured-items {
    display: block;
    overflow: hidden;
    border-bottom: 4px solid #EBEEEF;
}

    .featured-items h3 {
    }

.Frontpage .number-1 .featured-item {
    width: 100%;
    display: block;
    overflow: hidden;
}

.Frontpage .number-2 .featured-item {
    width: 50%;
    float: left;
    display: block;
    overflow: hidden;
}

.featured-item .panorama {
    width: 40%;
    float: right;
    margin: 0 0 0 10px;
}
/* custom colors for surfactants / functional materials on home page */

.item-Surfactants .readmore, .item-Functional .readmore,
.item-Tensider .readmore, .item-Functional .readmore {
    display: none;
}

body.Surfactants .featured-item, body.Functionalmaterials .featured-item, body.Company .featured-item,
body.Tensider .featured-item, body.Tekniskeprodukter .featured-item, body.Omunger .featured-item {
    width: 33.3%;
    float: left;
    text-align: center;
}

    body.Surfactants .featured-item a h3, body.Functionalmaterials .featured-item a h3, body.Company .featured-item a h3,
    body.Tensider .featured-item a h3, body.Tekniskeprodukter .featured-item a h3, body.Omunger .featured-item a h3 {
        color: #ffffff;
        margin-bottom: 0.5em;
        text-transform: uppercase;
        font-weight: 500;
    }

    body.Surfactants .featured-item h3,
    body.Tensider .featured-item h3 {
        background-color: #136582;
    }

    body.Functionalmaterials .featured-item h3,
    body.Tekniskeprodukter .featured-item h3 {
        background-color: #52483f;
    }

    body.Company .featured-item h3,
    body.Omunger .featured-item h3 {
        background-color: #333;
    }
/* HOMEPAGE BLURB */

body.Frontpage.Home .homepage-blurb,
body.Frontpage.Hjem .homepage-blurb {
    padding-bottom: 16px;
    position: relative;
}

.homepage-blurb h1 {
    font-size: 1.44em;
    padding-top: 1%;
    padding-bottom: 1%;
}

.homepage-blurb {
    position: relative;
    overflow: visible;
}

    .homepage-blurb .gutter {
        width: 56%;
        float: left;
        padding-bottom: 24px;
    }

    .homepage-blurb .introtext {
        font-size: 1em;
        line-height: 1.52em;
    }

    .homepage-blurb .Thumbnail {
        width: 30%;
        min-width: 300px;
        position: absolute;
        right: -16px;
        top: -16px;
    }

.Surfactants .homepage-blurb, .Functionalmaterials .homepage-blurb, .Company .homepage-blurb,
.Tensider .homepage-blurb, .Tekniskeprodukter .homepage-blurb, .Omunger .homepage-blurb {
    background-color: #F5F6F7;
    border-top: 1px solid #EBEEEF;
    border-bottom: 1px solid #EBEEEF;
    display: block;
    margin-left: -24px;
    margin-right: -24px;
    margin-top: 16px;
    overflow: hidden;
    position: relative;
}

    .Surfactants .homepage-blurb .gutter, .Functionalmaterials .homepage-blurb .gutter, .Company .homepage-blurb .gutter,
    .Tensider .homepage-blurb .gutter, .Tekniskeprodukter .homepage-blurb .gutter, .Omunger .homepage-blurb .gutter {
        padding: 16px 40px;
    }
/* COMPANY HOME PAGE */

body.Company #billboard,
body.Omunger #billboard {
    position: relative;
}

    body.Company #billboard img,
    body.Omunger #billboard img {
        z-index: 0;
        position: relative;
    }

body.Company .billboard-text,
body.omunger .billboard-text {
    position: absolute;
    left: 0px;
    bottom: 0px;
    z-index: 2;
    color: #ffffff;
}

    body.Company .billboard-text .gutter,
    body.Omunger .billboard-text .gutter {
        background: rgba(0, 0, 0, 0.5);
        padding: 16px 32px 32px 40px;
        color: #fff;
    }
/* LISTING ITEMS - column widths */

#list-wrapper {
    display: block;
    overflow: hidden;
}

.page-list-item {
    display: inline-block;
    overflow: hidden;
}

.col-1 .page-list-item {
    width: 100%;
}

.col-2 .page-list-item {
    width: 50%;
    float: left;
}

.col-3 .page-list-item {
    width: 33.3%;
    float: left;
}

.col-4 .page-list-item {
    width: 25%;
    float: left;
}

.list-image {
    width: 40%;
    float: right;
    vertical-align: bottom;
    margin-left: 16px;
    border: 1px solid #ddd;
}

.col-2 .list-image {
    margin-top: 0.5em;
}
/* DETAIL VIEW */

.Page .block-item {
    padding-top: 16px;
}

.hero {
    margin-top: 24px;
    margin-bottom: -16px;
}
/* SIDEBAR */

.sidebar-image-gallery img {
    width: 100%;
    vertical-align: bottom;
    margin-bottom: 1em;
}
/* PAGE */

body.Page .secondary {
    padding-top: 16px;
    padding-bottom: 8px;
}
/* POST */

.post {
    display: block;
    overflow: hidden;
    clear: both;
}

    .post h1 {
        margin-top: 0.5em;
    }

    .post .primary {
        width: 70%;
    }

    .post .secondary {
        width: 30%;
    }

.post-hero {
    display: block;
    overflow: hidden;
    margin-top: 0.5em;
}

    .post-hero img {
        vertical-align: bottom;
    }
/* SITEMAP */

#sitemap-wrapper {
    margin-top: 4px;
}

.bodytext table.contacts {
    background: #fff;
    border-collapse: separate;
    margin-bottom: 1em;
    border: 1px solid #ddd;
    font-size: 1em;
    width: 100%;
}
/* SEARCH RESULT */

body.SearchResult .content-wrapper {
    margin-top: 0.5em;
}
/* custom table style for contacts */

.bodytext table.contacts th, .bodytext table.contacts td {
    padding: 0;
    border: 0;
    background: transparent;
    padding: 0.25em 0.5em 0.25em 0.5em;
    vertical-align: middle;
}

.bodytext table.contacts tr:nth-child(odd) td {
    background: #f4f4f4;
}

.bodytext table.contacts tr td:first-child {
    width: 29%;
    border-right: 1px solid #ddd;
}

.bodytext table.contacts tr td:nth-child(2) {
    width: 29%;
    border-left: 1px solid #fff;
    border-right: 1px solid #ddd;
}

.bodytext table.contacts tr td:nth-child(3) {
    width: 15%;
    border-left: 1px solid #fff;
    border-right: 1px solid #ddd;
    white-space: nowrap;
}

.bodytext table.contacts tr td:nth-child(4) {
    width: 24%;
    border-left: 1px solid #fff;
}
/* OVERRIDES FOR RETINA SCREENS */

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    #homelogo {
    }

    .search input[type="submit"] {
    }
}
/* ADJUSTING LAYOUT DEPENDING ON SCREEN WIDTH */

@media only screen and (max-width: 976px) {
    body {
        font-size: 14px;
    }

    .menu1, .menu2, menu3 {
        font-size: 13px;
    }

    .search {
        right: 8px;
        width: 136px;
    }

    .wrapper-gutter {
        padding: 0px;
    }

    .content-wrapper {
        padding: 0 8px 0 8px;
    }

    #footer {
        margin-top: 0px;
        padding: 16px 8px 8px 8px;
    }

    .homepage-blurb .Thumbnail {
        right: 0px;
        top: 0px;
    }
    /* sidebar */

    .sidebar-image-gallery .gutter {
        padding-right: 16px;
        padding-left: 0px;
    }
}