﻿html {
    scroll-padding-top: 135px; /*used to allow scrolling correctly to anchors, due to fixed navbar header problem*/
}

:root {
    --colorBody: #828282;
    --colorGold: #78623d;
    --colorBrown: #958774;
    --colorOrange: #f59433;
    --colorGraySoft: #eceeed;
    --colorPetrol: #3d7984;
    --colorFooter: #58595b;
    --mainNavigationTop: 23px;
    --liLanguageRight: 67px
}

@font-face {
    font-family: 'Gothic';
    src: url('../fonts/GOTHIC.woff2') format('truetype');
}

@font-face {
    font-family: 'GothicBold';
    src: url('../fonts/GOTHICB.woff2') format('truetype');
}

@font-face {
    font-family: 'DinBlack';
    src: url('../fonts/DINGreek-Black.ttf') format('truetype');
}

@font-face {
    font-family: 'DinMedium';
    src: url('../fonts/DINGreek-Medium.ttf') format('truetype');
}

body {
    min-height: 100vh;
    font-family: 'Gothic';
    font-size: 16.5px;
    line-height: 1.7;
    color: var(--colorBody);
    position: relative;
    padding-top: 118px;
    padding-bottom: 58px; /*footer height */
    overflow-wrap: break-word;
    /*background-image: url(/Content/images/HOMEPAGE.jpg);
    background-size: cover;*/
}

    body.js-homepage,
    body.js-AdminLteBody {
        padding-top: 0;
    }

    body.js-AdminLteBody {
        padding-top: 0;
        padding-bottom: 0 !important;
    }

    body.loading {
        overflow: hidden;
    }

        body.loading .loaderSpin {
            display: block;
        }

.mce-content-body *,
.mce-content-body *:before,
.mce-content-body *:after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.js-fadeIn {
    display: none;
}

.loaderSpin {
    display: none;
    position: fixed;
    z-index: 1060; /*modal has 1050*/
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: rgba(255,255,255,.73) url(../Content/images/loading.gif) calc(50%) calc(50% - 15px) no-repeat;
    background-size: 90px;
}

a,
.ftGreen,
.itemSocial li,
.itemSocial li a,
.filterCol .form-control:not(.multiselect-search),
.modal .modal-title,
.modal-categoryContent ul li::before,
.dropdown-menu > .active > a,
.dropdown-menu > .active > a:hover,
.dropdown-menu > .active > a:focus,
.pagination > li > a,
.pagination > li > span,
.pagination > .active > a, .pagination > .active > a:focus, .pagination > .active > a:hover, .pagination > .active > span, .pagination > .active > span:focus, .pagination > .active > span:hover {
    color: var(--colorOrange);
}

    a:hover,
    a:focus,
    .pagination > li > a:focus,
    .pagination > li > a:hover,
    .pagination > li > span:focus,
    .pagination > li > span:hover {
        color: #f9ba7b;
    }

    .border-green,
    .dropdown-menu,
    .modal .modal-content,
    .modal-header,
    .modal-footer,
    .modal-categoryContent ul li::before,
    .pagination > .active > a,
    .pagination > .active > a:focus,
    .pagination > .active > a:hover,
    .pagination > .active > span,
    .pagination > .active > span:focus,
    .pagination > .active > span:hover,
    .multiselect-container > li.active label::before {
        border-color: var(--colorBody);
    }

.mce-content-body hr,
.docHtmlBody hr {
    border-color: var(--colorOrange);
}

.btn-trans,
.docHtmlBody .btn-trans {
    border: 2px solid var(--colorOrange);
    padding: 5px 15px;
    text-transform: uppercase;
    color: var(--colorOrange);
    font-family: DinMedium !important;
    font-size: 1.4em;
    line-height: 1.2 !important;
    text-align: center;
    display: inline-block;
}

.mce-content-body ul li::marker,
.docHtmlBody ul li::marker {
    color: var(--colorOrange);
}

a {
    cursor: pointer;
}

    a:focus {
        outline: none;
    }

    a, a:hover, a:active, a:visited, a:focus {
        text-decoration: none;
    }

a, button, input {
    transition: .3s all ease;
}

b, strong, .mce-content-body b, .mce-content-body strong, .mce-content-body b *, .mce-content-body strong *, .docHtmlBody b, .docHtmlBody strong, .docHtmlBody b *, .docHtmlBody strong * {
    font-weight: normal !important;
    font-family: GothicBold !important;
}

.bootbox-accept {
    font-family: GothicBold
}

blockquote {
    border-left: 5px solid #57595b;
    padding: 10px 20px;
    margin: 0 0 20px;
    font-size: inherit;
}

    blockquote p:last-child, blockquote ul:last-child, blockquote ol:last-child {
        margin-bottom: 0;
    }

.docHtmlBody .emphasis,
.mce-content-body .emphasis {
    font-size: inherit;
    background-color: var(--colorOrange);
    color: white;
    padding: 2px 4px;
    display: inline;
    font-family: GothicBold !important
}

.mce-content-body img:not(.mce-pagebreak), /*this makes the images responsive in tinyMCE editor, in combination with adding the class in the initialization function (tinymce.init) */
.docHtmlBody img /*this makes images responsive in document content view */ {
    display: block;
    max-width: 100%;
    height: auto;
}

.mce-content-body sub, .docHtmlBody sub,
.mce-content-body sup, .docHtmlBody sup {
    font-size: 75% !important;
}

.mce-content-body {
    margin: 0;
    padding: 15px 30px;
}

.docHtmlBody {
    max-width: 795px;
}

    .mce-content-body,
    .docHtmlBody,
    .mce-content-body *,
    .docHtmlBody * {
        font-family: Gothic !important;
        overflow-wrap: break-word; /*NN:used for breaking words when TinyMCE inserts &nbsp; tags instead of spaces*/
    }

        .mce-content-body p, .docHtmlBody p {
            margin: 0 0 15px;
        }

        .mce-content-body *:not(h1,h2,h3,h4,h5,h6),
        .docHtmlBody *:not(h1,h2,h3,h4,h5,h6) {
            /*font-size: 17px !important;*/
        }

        .mce-content-body h1,
        .mce-content-body h2,
        .mce-content-body h3,
        .docHtmlBody h1,
        .docHtmlBody h2,
        .docHtmlBody h3 {
            margin-top: 20px;
            margin-bottom: 10px;
        }

        .mce-content-body h4,
        .mce-content-body h5,
        .mce-content-body h6,
        .docHtmlBody h4,
        .docHtmlBody h5,
        .docHtmlBody h6 {
            /*margin-top: 10px;
            margin-bottom: 10px;*/
            margin-top: 0;
            margin-bottom: 5px;
        }

            .mce-content-body h1,
            .mce-content-body h2,
            .mce-content-body h3,
            .mce-content-body h4,
            .mce-content-body h5,
            .mce-content-body h6,
            .mce-content-body h1 *,
            .mce-content-body h2 *,
            .mce-content-body h3 *,
            .mce-content-body h4 *,
            .mce-content-body h5 *,
            .mce-content-body h6 *,
            .docHtmlBody h1,
            .docHtmlBody h2,
            .docHtmlBody h3,
            .docHtmlBody h4,
            .docHtmlBody h5,
            .docHtmlBody h6,
            .docHtmlBody h1 *,
            .docHtmlBody h2 *,
            .docHtmlBody h3 *,
            .docHtmlBody h4 *,
            .docHtmlBody h5 *,
            .docHtmlBody h6 * {
                font-family: inherit;
                font-weight: normal
            }

        .mce-content-body h3, .docHtmlBody h3, .h3Title {
            color: var(--colorBrown);
            font-family: 'DinBlack' !important;
            font-size: 33px;
            margin-top: 0;
            line-height: 1.3 !important;
        }

        .mce-content-body h5, .docHtmlBody h5 {
            color: var(--colorOrange);
            font-family: GothicBold !important;
            margin: 18px 0;
            font-size: 1.19em;
            line-height: 1.3;
        }

.img-bordered {
    /*outline: 1px solid #ffffff;*/
}

label {
    font-family: GothicBold;
    font-weight: normal;
}

.text-bold {
    font-family: GothicBold
}

p {
    word-break: break-word;
}

h1, .h1 {
    font-size: 2.2em; /*was 36*/
}

h2, .h2 {
    font-size: 2.05em; /*was 30*/
}

h3, .h3 {
    font-size: 1.67em; /*was 24*/
}

h4, .h4, .seeMore {
    font-size: 1.33em; /*was 18*/
}

h5, .h5 {
    font-size: 1.15em; /*was 14*/
}

h6, .h6 {
    font-size: 0.88em; /*was 12*/
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    line-height: 1.3;
}

.navbar-default {
    border: 0;
    background-color: white
}

body.js-homepage .navbar-default {
    background-color: transparent;
}

.btn-primary, .btn-primary:focus, .btn-primary:active, .btn-primary:active:hover, .btn-primary:active:focus {
    background-color: var(--colorOrange);
    border-color: var(--colorOrange);
    outline: none
}

.btn-rounded {
    border-radius: 35px;
}

.btn-primary:hover {
    background-color: #54af46;
    border-color: #54af46;
}

.navbar-default.navbar-fixed-top-scroll {
    background-color: rgba(255, 255, 255, 1);
    border-bottom: 1px solid var(--colorGraySoft);
}

.row-well {
    padding-top: 60px;
    padding-bottom: 60px;
}

.row-well-md {
    padding-top: 55px;
    padding-bottom: 20px;
}

.row-well-sm {
    padding-top: 50px;
    padding-bottom: 50px;
}

.innerMenu {
    padding: 45px 0;
}

.row-well-xs {
    padding-top: 30px;
    padding-bottom: 30px;
}

.js-vegasSliderInner {
    color: white;
    font-size: 7.27vw;
    text-transform: uppercase;
    font-family: GothicBold;
    position: absolute;
    padding-top: 203px;
    padding-left: 55px;
}

.js-mainNavigation {
    padding-top: var(--mainNavigationTop);
}

.langUL {
    list-style-type: none;
    padding: 0
}

    .langUL li.js-languageLink {
        display: inline-block;
    }

.js-navbarContainer .langUL li.js-languageLink,
.js-navbarContainer .langUL li.js-languageLink a {
    color: #57585a;
}

.js-navbarContainer.invert .langUL li.js-languageLink,
.js-navbarContainer.invert .langUL li.js-languageLink a {
    color: white;
}

.js-navbarContainer .langUL li.js-languageLink.active a,
.js-navbarContainer .langUL li.js-languageLink a:hover {
    color: var(--colorOrange)
}

.navbar-default .navbar-nav.navbarMain > li.liSearch {
    background-position: left 18px;
    padding-left: 26px;
    background-size: 20px;
    position: absolute;
    right: calc(var(--liLanguageRight) + 87px);
    top: calc(var(--mainNavigationTop) - 2px);
    float: none;
}

.navbar-default .navbar-nav.navbarMain > li.liLanguage {
    position: absolute;
    top: calc(var(--mainNavigationTop) + 7px);
    right: var(--liLanguageRight);
    float: none;
}

    .navbar-default .navbar-nav.navbarMain > li.liLanguage > a,
    .tbSearch.form-control {
        font-size: 0.88em;
    }

.js-navbarContainer {
    padding: 54px 67px;
    padding-bottom: 0;
    position: relative;
}

    .js-navbarContainer.invert .liSearch {
        background-image: url('../Content/images/fakos.png');
    }

.tbSearch.form-control {
    background-color: transparent;
    border: 0;
    border-bottom: 2px solid #57585a;
    box-shadow: none !important;
    border-radius: 0;
    padding-bottom: 0;
    padding-top: 10px;
    padding-left: 2px;
    max-width: 116px;
}

.js-homepage .tbSearch.form-control {
    color: white;
    height: 30px;
}

.pubContentColFixed {
    position: sticky;
}

.productsList.flexrow {
    justify-content: flex-start;
    width: 100%;
}

/*productsList used in BO (mce-content-body)*/
.productsList img {
    display: inline !important;
    --pad: 15px;
    margin: var(--pad);
    max-width: calc(177px - 2 * var(--pad));
}

.mce-content-body .productsList img {
    max-width: calc(110px - 2 * var(--pad));
}

.cc-nb-changep,
.footerAddress a {
    color: var(--colorOrange)
}

.float-none {
    float: none
}

.lblOurTeam {
    color: white;
    text-align: center;
    font-family: GothicBold;
    font-size: 24px;
    line-height: 1.3;
    padding: 0 138px;
    margin-bottom: 50px;
}

.lblItalicNote {
    font-family: DinMedium !important;
    font-size: 0.85em;
    font-style: italic;
}

footer, body.js-homepage .navbar-default.navbar-fixed-top-scroll {
    background-color: var(--colorFooter);
    transition: all ease-in-out 0.3s;
    border: 0;
}

body.js-homepage .navbar-default.navbar-fixed-top-scroll {
    background-color: rgba(120, 98, 61, 0.85);
}

footer {
    color: white;
    padding-bottom: 15px;
    font-size: .88em;
    line-height: 1.4;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%
}

.font-bold {
    font-family: GothicBold
}

.noPadding {
    padding: 0
}

.noPaddingTop {
    padding-top: 0
}

.noPaddingBottom {
    padding-bottom: 0
}

.paddingTop15 {
    padding-top: 15px;
}

.paddingRight50 {
    padding-right: 50px;
}

.noMargin {
    margin: 0
}

.noMarginBottom {
    margin-bottom: 0
}

.noMarginTop {
    margin-top: 0 !important
}

.marginTop10 {
    margin-top: 10px
}

.marginTop15 {
    margin-top: 15px
}

.marginTop30 {
    margin-top: 30px
}

.marginBottom5 {
    margin-bottom: 5px
}

.marginBottom10 {
    margin-bottom: 10px
}

.marginBottom15 {
    margin-bottom: 15px
}

.marginBottom20 {
    margin-bottom: 20px
}

.marginBottom30 {
    margin-bottom: 30px
}

.hrSmall {
    width: 70px;
    border: 1px solid white;
    border-radius: 1px;
    margin-top: 22px;
}

.hrContact {
    width: 70px;
    border: 1px solid var(--colorBrown);
    border-radius: 1px;
    margin-top: 10px;
    margin-bottom: 15px;
    margin-left: 0
}

.hrContent {
    width: 142px;
    border-radius: 1px;
    margin-left: 0;
}

.vegas-content-scrollable {
    overflow: hidden; /*NN removed 'auto' because it showed scrollbar-y on resize*/
}

.contactArrow {
    position: relative;
    top: -30px;
    width: 27px;
}

.pubContentCol {
    padding: 30px 15px;
}

.js-slickCategories {
    padding: 0 13px;
}

.rowHow {
    background-image: url(../Content/images/Icons-bg1.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    position: relative;
    --pad: 30px;
    padding: var(--pad) 0;
}

.floatCat {
    position: absolute;
    top: 190px;
    left: 0;
    right: 0;
    margin: auto;
}

ul.ulStyledList /*used on Members page via Document's html*/ {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: justify;
    justify-content: flex-start;
    flex-flow: wrap;
    list-style-type: none;
    padding: 0
}

    ul.ulStyledList li {
        margin-bottom: 10px;
        position: relative;
        text-align: center;
    }

        ul.ulStyledList li a {
            padding: 15px;
        }

.mce-content-body ul.ulStyledList {
    display: block;
    list-style-type: initial;
    padding-left: 40px
}

    .mce-content-body ul.ulStyledList li {
        padding: 0;
        margin-bottom: 0;
        text-align: left;
        margin: 0;
        border: 0;
        width: 100%
    }

        .mce-content-body ul.ulStyledList li a {
            padding: 0;
            background-image: none;
            font-size: inherit;
            color: inherit;
            display: inline;
        }

            .mce-content-body ul.ulStyledList li a,
            .mce-content-body ul.ulStyledList li a:hover {
                background-color: transparent;
            }

                .mce-content-body ul.ulStyledList li a[data-mce-selected="inline-boundary"] {
                    background-color: #bfe6ff;
                }

.itemContentImage {
    padding-bottom: calc(52.37% + 15px); /*add shifted width*/
}


.slick-arrow {
    z-index: 1;
}

    .slick-arrow:before {
        opacity: 1;
    }

.js-slickCategories .slick-arrow {
    width: 40px;
    height: 40px;
}

    .js-slickCategories .slick-arrow:before {
        content: ' ';
        background-image: url(../Content/images/arrowdown.png);
        background-repeat: no-repeat;
        background-size: contain;
        display: block;
        height: 100%;
    }

.js-slickCategories .slick-prev:before {
    transform: rotate( 90deg );
}

.js-slickCategories .slick-next:before {
    transform: rotate(-90deg);
}

.js-slickVideos .slick-arrow {
    width: 44px;
    height: 44px;
}

    .js-slickVideos .slick-arrow:before {
        content: ' ';
        background-image: url(../Content/images/arrowdownMed.png);
        background-repeat: no-repeat;
        background-size: contain;
        display: block;
        height: 100%;
    }

.js-slickVideos .slick-prev:before {
    transform: rotate( 90deg );
}

.js-slickVideos .slick-next:before {
    transform: rotate( -90deg );
}

a.slickCategory {
    padding: 40px 15px;
    padding-top: 45px;
    padding-bottom: 25px;
    position: relative;
    height: 100%;
    align-items: center;
    cursor: pointer;
    text-align: center;
    color: inherit
}

    a.slickCategory:hover,
    .divCategoryBack:hover {
        color: white
    }

.ftSizeCategory {
    font-size: 1.2em;
    line-height: 1.2;
    margin-bottom: 0;
    margin-top: 15px;
    text-transform: uppercase;
}

.slickCatImage {
    margin-bottom: 5px;
    padding: 0 30px;
    max-width: 207px;
}

.archiveImageOuter.bgImage {
    margin: 15px 0;
    background-size: contain !important;
    padding-bottom: 50%
}

.archiveImageOuter .videoPlayIcon {
    padding-top: 18px;
}

    .archiveImageOuter .videoPlayIcon img {
        width: 66px;
    }

.fancybox-iframe {
    border: 5px solid #6fc062;
}

.imgHover {
    transition: all ease-in-out 0.3s;
}

a:hover .imgHover {
    transform: scale(1.301,1.301); /*zoom-in*/
    transform-origin: center 80px;
}

.storageSecBody {
    color: white;
    font-size: 1.3em;
    line-height: 1.45;
    padding: 5vw 32px;
    max-width: 550px;
}

    .storageSecBody.customersBody {
        max-width: 770px;
        float: right;
        margin-right: 30px;
    }

.storageGraphic {
    background-repeat: no-repeat;
    background-image: url('../Content/images/premises-bg.png');
    position: absolute;
    right: 41px;
    top: -152px;
    background-size: 100%;
    --wh: 316px;
    width: var(--wh);
    height: var(--wh);
}

.divCategoryBack {
    border-radius: 50%;
    text-align: center;
    padding: 27px 0;
    color: white;
    display: block;
    margin: auto;
    --wh: 262px;
    width: var(--wh);
    height: var(--wh);
}

    .divCategoryBack:hover {
        background-color: var(--colorOrange);
    }

    .divCategoryBack img {
        width: 135px;
    }

a.divCategoryBack:hover .imgHover {
    transform: scale(calc(165/177),calc(165/177)); /*zoom-out*/
}

a.brochureRow {
    color: inherit;
    border-bottom: 1px solid;
    float: left;
    width: 100%
}

    a.brochureRow:hover {
        background-color: var(--colorGraySoft);
    }


a.newsRow {
    color: inherit;
    margin-top: 9px;
    display: block
}

    a.newsRow.bordered {
        border: 4px solid #57585a;
    }

    a.newsRow:hover {
        background-color: hsl(120, 2%, 94%)
    }

    a.newsRow:first-child {
        margin-top: 0
    }

    a.newsRow.noImage .titleVideo {
        color: #57585a;
        font-family: Gothic
    }

    a.newsRow .bgImageDoc {
        height: 250px;
    }

    a.newsRow .newsRowText {
        padding: 0 1.3vw;
        padding-bottom: 10px;
        display: -webkit-box;
        display: -moz-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: justify;
        -moz-box-pack: justify;
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between;
        flex-direction: column;
    }

    a.newsRow .bgImageDoc .newsRowText {
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        margin: auto;
        padding-bottom: 30px;
        background-color: rgba(0, 0, 0, 0.3);
        transition: 0.5s all ease-in-out;
        justify-content: flex-end;
    }

    a.newsRow:hover .bgImageDoc .newsRowText {
        background-color: rgba(0, 0, 0, 0.1);
    }

.modal .modal-content {
    border-radius: 0;
    border-top-width: 7px;
    border-left: 0;
    border-right: 0;
    border-bottom: 0;
}

.modal .modal-title {
    font-family: GothicBold
}

.modal-header {
    border-bottom-width: 1px;
    padding: 10px 24px;
}

.modal-footer {
    padding: 22px 24px;
    border-top-width: 1px;
}

.modal .modal-body {
    padding: 15px 24px;
}

.modal-md .modal-body {
    padding: 25px 40px;
}

.modal ol {
    list-style: none;
    counter-reset: my-awesome-counter;
}

    .modal ol > li {
        counter-increment: my-awesome-counter;
    }

        .modal ol > li::before {
            content: counter(my-awesome-counter) ". ";
            font-family: GothicBold
        }

.modal li {
    margin: 5px 0;
}

.modal-categoryContent ul li::before {
    content: '\f00c';
    font-family: 'Font Awesome 5 Free';
    font-size: 0.6em;
    font-weight: 900;
    padding: 3px;
    margin-right: 0;
    position: relative;
    top: -1px;
    left: -9px;
    margin-left: -22px;
    border: 3px solid;
    border-radius: 6px;
    background-color: #edeeed
}

.modal-categoryContent ul li::marker {
    content: '';
}

.videoRow {
    padding: 35px;
}

.bgImageDoc {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: top;
    height: 228px;
    position: relative;
    transition: 0.5s height ease-in-out, 0.5s margin-bottom ease-in-out;
}

.videoPlayIcon {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    padding-top: 50px;
    padding-left: 2vw;
    padding-right: 2vw;
    background-color: rgba(0, 0, 0, 0.42);
    transition: 0.5s all ease-in-out;
}

    .videoPlayIcon:hover {
        background-color: rgba(0, 0, 0, 0.3);
    }

    .videoPlayIcon img {
        width: 92px;
        transition: 0.5s all ease-in-out;
    }

.js-slickVideos .pubCol {
    top: 10px;
    transition: 0.5s all ease-in-out;
    position: relative;
    border-bottom: 18px solid transparent;
}

    .js-slickVideos .pubCol:hover {
        top: 0px;
    }

        /*works if used with .js-slickVideos .pubCol border-bottom*/
        .js-slickVideos .pubCol:hover .bgImageDoc {
            height: 246px;
            margin-bottom: -18px;
        }

        .js-slickVideos .pubCol:hover .videoPlayIcon img {
            transform: scale(1.25,1.25);
            transform-origin: center;
        }

.titleVideo {
    color: white;
    font-family: GothicBold;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    position: relative;
    word-break: break-word;
    margin-top: 25px;
}

.no-border {
    border: 0 !important
}

.addressDetailsCol {
    font-size: 0.99em;
}

.addressDetailsCol {
    margin-bottom: 15px
}

    .addressDetailsCol img {
        max-width: 66px;
        margin-bottom: 25px;
    }

.js-innerMenuItems a {
    flex: 1;
    min-width: 0;
    max-width: 255px;
    border-bottom: 1px solid #57585a;
    padding: 10px 17px;
    color: #57585a;
    text-align: center;
}

    .js-innerMenuItems a:hover {
        background-color: #e4e7e6;
    }

    .js-innerMenuItems a.active {
        color: white;
        background-color: var(--colorOrange);
        border-top-color: #57585a;
    }

        .js-innerMenuItems a.active:before {
            content: " ";
            width: 100%;
            border-top: 6px solid #57585a;
            position: absolute;
            left: 0;
            top: 0;
        }

    .js-innerMenuItems a img {
        display: inline-block;
    }

.js-innerMenuItems {
    max-width: 1804px;
}

    .js-innerMenuItems a div {
        display: inline-block;
        white-space: pre-wrap;
        vertical-align: middle;
        padding-top: 5px;
        padding-left: 10px;
        vertical-align: middle;
        width: 137px;
        max-width: 100%;
    }

.docHtmlBody.fixedColImage {
    max-width: 560px;
    float: left;
    padding-right: 30px;
}

.servicesContentText {
    padding: 100px 144px;
    padding-right: 30px;
    padding-bottom: 15px;
}

.productsContent {
    max-width: initial;
}

.coffeeServicesMenuOuter {
    background-color: var(--colorOrange);
    width: 450px;
}

.ulSideMenu {
    list-style-type: none;
    padding: 0
}

    .ulSideMenu li {
        border-bottom: 1px solid rgba(255, 255, 255, 0.55);
        background-image: url(../Content/images/menu-triangle.png);
        background-size: 36px;
        background-position: left 64px center;
        background-repeat: no-repeat;
    }

        .ulSideMenu li.active,
        .ulSideMenu li:hover {
            background-color: #f4a65c;
            background-image: url('../Content/images/menu-triangle-hover.png');
        }

        .ulSideMenu li a {
            padding: 15px 85px;
            padding-left: 120px;
            color: var(--colorFooter);
            text-transform: uppercase;
            font-size: 1.45em;
            display: block
        }

        .ulSideMenu li.active a {
            color: var(--colorPetrol);
        }

.js-contentText {
    background-image: url('images/who we are bullet.png');
    background-repeat: no-repeat;
    background-position: 0px 7px;
    background-size: 24px;
    padding-left: 45px;
    padding-right: 15px;
    padding-bottom: 0;
}

.js-innerMenuItems a div {
    font-size: 1.05em;
    line-height: 1.2;
    text-align: left;
}

.itemSocial {
    font-size: 25px;
    list-style-type: none;
    padding: 0;
}

    .itemSocial li {
        display: inline-block;
        width: auto;
        padding: 0 3px;
        padding-top: 2px;
        cursor: pointer;
    }

        .itemSocial li,
        .itemSocial li a {
            transition: .3s all ease;
        }

            .itemSocial li:hover, .itemSocial li:hover a {
                color: #6c6d6f;
            }

.pnlfollowUs {
    padding-top: 15px;
}

    .pnlfollowUs ul {
        list-style-type: none;
        padding: 0;
        margin: 0
    }

        .pnlfollowUs ul li {
            display: inline-block;
            vertical-align: top;
        }

            .pnlfollowUs ul li a {
                padding: 0 9px;
            }

                .pnlfollowUs ul li a i {
                    font-size: 1.5em;
                    color: #e2e3e2;
                }

    .pnlfollowUs.contactfollowUs ul li a {
        padding-right: 22px;
        padding-left: 0;
    }

        .pnlfollowUs.contactfollowUs ul li a i {
            color: #6c6d6f;
            font-size: 2.0em;
        }


.navbar-brand {
    height: auto;
    padding: 0px 15px;
    transition: none
}

.js-homepage .navbar-brand {
    margin-top: 0;
}

.navbar-brand,
.js-homepage .navbar-fixed-top-scroll .navbar-brand {
    margin-top: -34px;
}

.navbar-default .navbar-toggle {
    background-color: var(--colorOrange);
    border-color: transparent;
    border-radius: 0;
}

    .navbar-default .navbar-toggle .icon-bar {
        background-color: white;
    }

    .navbar-default .navbar-toggle:hover,
    .navbar-default .navbar-toggle:focus {
        background-color: #f8b068;
    }

/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}

.ul-inline li {
    display: inline
}

.navbar-default .navbar-nav.navbarMain > li > a {
    color: #57585a;
    line-height: 18px;
    text-transform: uppercase;
    padding: 5px 15px;
}

.navbar-default .navbar-nav.navbarMain > li > a,
.tbSearch.form-control {
    font-size: 0.95em;
}

.js-navbarContainer.invert .navbar-nav.navbarMain > li > a {
    color: white;
}

.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus {
    background-color: transparent;
}

.navbar-fixed-top-scroll .navbar-nav.navbarMain > li > a {
    color: #57585a;
}

.navbar-default .navbar-nav.navbarMain > li.active > a {
    background-color: var(--colorOrange);
    color: white;
}

.js-navbarContainer.invert .navbar-nav.navbarMain > li.active > a {
    background-color: transparent; /*hsl(82, 37%, 45%)*/
}

.navbar-default .navbar-nav.navbarMain > li > a:hover,
.navbar-default .navbar-nav.navbarMain > li > a:focus {
    background-color: var(--colorGraySoft);
}

.navbar-default .navbar-nav.navbarMain > li.active > a:hover,
.navbar-default .navbar-nav.navbarMain > li.active > a:focus {
    color: var(--colorBody)
}

.js-homepage .navbar-default .navbar-nav.navbarMain > li > a:hover,
.js-homepage .navbar-default .navbar-nav.navbarMain > li > a:focus {
    /*background-color: rgba(130, 132, 135, 0.5);*/
    background-color: transparent;
    color: rgba(255, 255, 255, 0.73);
}

.contactInner {
    padding: 80px 8vw;
    padding-right: 15vw;
    padding-bottom: 20px !important;
}

.addressRoad {
    font-size: 14px;
    line-height: 1.5;
    color: #818282;
}

.bgImage-contact {
    text-shadow: 0 0 10px rgba(0, 0, 0, 0.56);
}

.bgImage-home {
    background-position: center;
    padding-bottom: 51.5%;
}

body.pageStorage {
    padding-bottom: 58px;
}

.bgImage-storage {
    background-image: url('../Content/images/section-photo-storage.jpg');
    padding-bottom: 30.04%;
    background-position: right;
}

.js-servicesPage .js-mainContainer {
    flex: 1
}

.valign-center {
    align-self: center;
}

.contactInner-sm {
    padding: 80px 4.5vw
}

.enText {
    color: #57585a;
    display: none;
}

.divLoggedInLayout {
    position: absolute;
    right: 50px;
    top: 0px;
    z-index: 1031; /*navbar-fixed-top is 1030*/
    text-align: right;
    background-color: #f2f3f2;
    padding: 0px 9px;
    margin-bottom: 0;
    line-height: 1.3;
}

body.js-homepage .navbar-default.navbar-fixed-top-scroll .divLoggedInLayout {
    background-color: rgba(0, 0, 0, 0.6);
    color: white
}

.divLoggedInLayout li:after {
    content: ' | ';
}

.divLoggedInLayout li:last-child:after {
    content: ' ';
}

.divLoggedInLayout, .divLoggedInLayout a {
    font-size: 0.9em;
}

.contactRowTop {
    margin-bottom: 60px;
}

.contactForm {
    margin-bottom: 30px;
}

    .contactForm label.error {
        color: #bd0000;
        margin-bottom: 0;
        margin-top: 2px;
        font-size: 0.66em;
        font-family: GothicBold;
    }

.form-control {
    font-size: 0.95em;
    border-radius: 0;
    box-shadow: none !important;
}

.contactForm .form-control,
.customForm .form-control {
    padding: 8px;
    border: 0;
    border-bottom: 2px solid var(--colorBrown);
    background-color: transparent;
}

.contactForm .form-control {
    padding: 12px 20px;
    font-size: 1em;
}

.contactForm textarea.form-control {
    border: 2px solid var(--colorBrown);
}

.captchaDiv .form-control {
    font-size: 0.83em;
    padding: 20px;
    border: 0;
    background-color: rgba(255, 255, 255, 0.51);
}

.captchaDiv {
    max-width: 100%;
    width: 325px;
    text-align: center;
    background-color: #e4e0dd;
    padding: 15px;
    /*float: right;*/
    margin-top: 10px;
    margin-bottom: 10px;
}

    .captchaDiv .realperson-challenge {
        color: var(--colorGold);
    }

    .captchaDiv .realperson-regen {
        padding-top: 6px;
        padding-bottom: 5px;
        color: hsla(0, 0%, 50%, 1);
    }

.seeMore {
    color: #57585a;
}

    .seeMore img {
        margin-left: 8px;
        position: relative;
        top: -2px;
        transform: rotate(90deg)
    }

.contactForm textarea.form-control {
    resize: none;
    padding-top: 15px;
    margin-top: 31px;
}

a.btnSubmitContact {
    border-radius: 35px;
    background-color: var(--colorGold);
    border-color: var(--colorGold);
    padding: 5px 90px;
    font-size: 1.3em;
}

    a.btnSubmitContact,
    a.btnSubmitContact :focus {
        color: white;
    }

        a.btnSubmitContact:hover {
            background-color: var(--colorBrown);
            border-color: var(--colorBrown);
        }

.slides {
    padding-bottom: 50.31%;
    position: relative;
    left: -15px;
    width: calc(100% + 30px);
    height: 803px;
}

.js-menuLogo {
    width: 144px;
    position: relative;
}

.ds-inline-block {
    display: inline-block
}

.position-relative {
    position: relative;
}

.liSearch {
    background-image: url('../Content/images/fakosGrey.png');
    background-position: left 15px;
    background-repeat: no-repeat;
    padding-left: 36px;
    background-size: 26px;
    padding-bottom: 9px;
    margin-left: 7px;
}

.divSearchMembers {
    background-image: url(../Content/images/members.png);
    background-position: -4px 7px;
    background-repeat: no-repeat;
    padding-left: 40px;
    background-size: 39px;
    padding-bottom: 9px;
    margin-bottom: 20px;
    position: relative
}

    .divSearchMembers .js-clearMembersFilter {
        position: absolute;
        right: 0
    }



.divSearchMembers {
    width: 287px;
    max-width: 100%;
}

    .divSearchMembers .tbSearch.form-control {
        max-width: initial;
        font-size: 0.98em;
        padding-right: 20px;
    }

/*not on homepage*/
.js-navbarContainer.invert .tbSearch.form-control {
    border-bottom-color: white
}

.tbSearch.form-control::placeholder {
    color: hsl(220, 0%, 60%)
}

.contactForm .form-control::placeholder {
    color: #808285;
    font-family: Gothic;
}

/*on homepage*/
.js-navbarContainer.invert .tbSearch.form-control::placeholder {
    color: hsla(255, 0%, 100%, 0.55);
}


.organizationBox {
    width: 358px;
    height: 287px;
}

.bgImage {
    background-size: cover !important; /*!important used for native print*/
    background-repeat: no-repeat;
}

.bgImage-services {
}

.bgImage-contact {
    background-image: url('images/contact-us-photo.jpg');
    background-position: top center;
}

.bgImage-news {
    background-image: url('images/everything.jpg');
    background-position: bottom;
    padding: 40px;
    padding-bottom: 50%;
}

.bgGrayLight {
    background-color: var(--colorGraySoft)
}

.bgGray {
    background-color: #e2e3e2
}

.bgPetrol {
    background-color: var(--colorPetrol)
}

.bgGold {
    background-color: var(--colorGold)
}

.bgGray-light,
.mce-content-body,
.modal .modal-content {
}

.ftOrange {
    color: #e4ac5b
}

.ftWhite {
    color: white
}

.flexrow {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

    .flexrow.justify-normal {
        -webkit-justify-content: initial;
        justify-content: initial;
    }

.flexrow-wrap {
    flex-wrap: wrap;
    -webkit-flex-wrap: wrap; /* ipad */
}

.flexrowchild-fill {
    flex: 1;
}

.flex-direction-column {
    flex-direction: column
}

.flex-align-center {
    align-items: center
}

a.divWhereWhyBack {
    background-size: cover;
    background-repeat: no-repeat;
    padding-bottom: 33%;
    background-position: center;
    text-align: center;
    color: white;
    font-family: 'GothicBold';
    font-size: 1.6em;
    line-height: 1.45;
    position: relative;
    text-transform: uppercase;
}

.divWhereWhy {
    position: relative
}

.divWhereWhyInner {
    background-color: rgba(0, 0, 0, 0.3);
    transition: all ease-in-out .3s;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    padding-bottom: 5vw;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -webkit-justify-content: center;
    -ms-flex-pack: justify;
    justify-content: center;
    align-items: flex-end;
}

a.divWhereWhyBack:hover .divWhereWhyInner {
    background-color: rgba(0, 0, 0, 0);
}

.socialIcons {
    list-style-type: none;
    position: absolute;
    bottom: 20px;
    left: 0
}

    .socialIcons li {
        margin-bottom: 25px
    }

        .socialIcons li img {
            width: 37px
        }

.btn, .btn-primary, .btn-primary:hover, .btn-primary:focus, .btn-primary:active:focus {
    border-radius: 0;
    background-color: var(--colorOrange);
    border-color: var(--colorOrange);
    color: #48494b;
}

    .btn:focus, .btn:active:focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn.active.focus, .bootstrap-select .dropdown-toggle:focus, .bootstrap-select > select.mobile-device:focus + .dropdown-toggle {
        outline: none !important;
    }

/*#region NN Commons */

.alert {
    border-radius: 0;
}

#goTopSpan {
    color: #ffffff;
    background-color: var(--colorOrange);
    padding: 5px 6px;
    padding-right: 4px;
}

.pagination > li > a,
.pagination > li > span {
    padding: 6px 8px;
}

.pagination > .disabled > a,
.pagination > .disabled > a:focus,
.pagination > .disabled > a:hover,
.pagination > .disabled > span,
.pagination > .disabled > span:focus,
.pagination > .disabled > span:hover {
    color: #333;
    background-color: transparent;
    border-color: transparent;
}

.pagination > li > a:focus,
.pagination > li > a:hover,
.pagination > li > span:focus,
.pagination > li > span:hover {
    background-color: transparent;
    border-color: transparent;
}

.pagination > li > a,
.pagination > li > span {
    background-color: transparent;
    border-color: transparent;
}

.pagination > li > a, .pagination > li > span {
    font-size: 1.05em;
    border-radius: 0 !important;
}

.pagination > .active > a,
.pagination > .active > a:focus,
.pagination > .active > a:hover,
.pagination > .active > span,
.pagination > .active > span:focus,
.pagination > .active > span:hover {
    background-color: transparent;
    padding: 6px 8px;
}

.pagination > li.PagedList-skipToNext a {
    padding-right: 0;
}

.pagination > li.PagedList-skipToLast a,
.pagination > li.PagedList-skipToFirst a,
.pagination > li.PagedList-skipToPrevious a,
.pagination > li.PagedList-skipToNext a {
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
}

.filterCol .form-control:not(.multiselect-search) {
    height: 40px;
    border: 2px solid #5b5a57;
    background-color: transparent
}

.multiselect-container.dropdown-menu {
    background-color: #e2e3e2;
}

table {
    page-break-inside: auto;
}

tr {
    page-break-inside: avoid;
    page-break-after: auto;
}

thead {
    display: table-header-group;
}

tfoot {
    display: table-footer-group;
}

.panel {
    border-radius: 0;
}

.breadcrumb {
    background-color: transparent;
    border-radius: 0;
    padding: 0
}

.datepicker .datepicker-switch:hover, .datepicker .next:hover, .datepicker .prev:hover, .datepicker tfoot tr th:hover {
    background: #f2f3f2;
}

.datepicker td, .datepicker th {
    border-radius: 0;
}

.datepicker th {
    font-weight: normal;
}

.mce-content-body table, .docHtmlBody table {
    border-collapse: separate !important;
    border-spacing: 10px;
}

.dropdown-menu .inner::-webkit-scrollbar {
    width: 5px;
}

.dropdown-menu .inner::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-color: #a48d61;
}

.dropdown-menu .inner::-webkit-scrollbar-track {
    border-radius: 10px;
    background-color: #d8cebb;
}

.dropdown-menu {
    border-radius: 0;
}

    .dropdown-menu > .active > a,
    .dropdown-menu > .active > a:hover,
    .dropdown-menu > .active > a:focus {
        background-color: transparent;
    }

.filterCol {
    margin-bottom: 20px;
    margin-top: 10px;
}

    .filterCol .multiselect {
        padding: 9px 12px;
        white-space: normal;
    }

.multiselect.dropdown-toggle {
    width: inherit;
    font-size: 0.95em;
}

a.filterLink, .js-clearAllFilters {
    /*color: #b34747;*/
}

.js-clearAllFilters {
    font-size: 13px;
    font-family: 'GothicBold';
}

a.filterLink {
    position: relative;
    top: 0px;
    margin-left: 6px;
}

.filtersTitle {
    display: block;
    font-weight: normal;
    /*font-size: 0.9em;*/
    margin-bottom: 10px;
    position: relative;
}

.multiselect-search {
    background-color: white;
}

.multiselect-container .input-group {
    margin: 5px 0;
}

.multiselect-container.dropdown-menu {
    -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.18);
    box-shadow: 0px 3px 7px rgba(0, 0, 0, 0.12);
    min-width: 100%;
}

.dropdown-menu {
    padding: 10px;
}

.datepicker-dropdown:before {
    border-bottom-color: #4a983e;
}

.btnMultiselect {
    width: 100%;
}

.btn-group.open > .multiselect.dropdown-toggle.btn-default,
.bootstrap-select.open > .dropdown-toggle.btn-default,
.multiselect.dropdown-toggle:hover,
.bootstrap-select > .dropdown-toggle:hover {
    color: #fff;
    background-color: #506e2b;
    border-color: #506e2b;
}

.multiselect-container .multiselect-reset .input-group {
    width: 100%;
    margin: 0;
    margin-top: 4px;
}

.multiselect-container > li {
    padding: 0;
}

    .multiselect-container > li > a > label.checkbox, .multiselect-container > li > a > label.radio {
        margin: 0;
    }

    .multiselect-container > li > a.multiselect-all label {
        font-weight: normal;
        font-family: GothicBold
    }

    .multiselect-container > li.active > a > label {
        font-family: GothicBold;
    }

    .multiselect-container > li > a > label {
        padding: 0px 20px 0px 28px;
        font-family: 'Gothic';
    }

        .multiselect-container > li > a > label > input[type=checkbox] {
            display: none;
        }

        .multiselect-container > li > a > label:before {
            border: 1px solid #d0d2d0;
            border-radius: 3px;
            width: 18px;
            height: 18px;
            text-indent: 2.5px !important;
            line-height: 1.4 !important;
            background: #f7f8f7 !important;
            margin-bottom: 0 !important;
            cursor: pointer;
            content: " ";
            font-family: 'Font Awesome 5 Free';
            font-size: 11px;
            font-weight: 900;
            left: 0;
            top: 1px;
            position: absolute;
        }

    .multiselect-container > li.active label::before {
        content: "\f00c";
    }

.input-group-addon,
.btn.multiselect-clear-filter,
.multiselect-reset .btn-block {
    border-color: #cccccc;
}

.input-group-addon,
.btn.multiselect-clear-filter,
.multiselect-reset .btn-block,
.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus {
    background-color: #eee;
}

.btn.multiselect-clear-filter,
.multiselect-reset .btn-block {
    color: #545454;
}

.multiselect-reset .btn-block {
    font-size: 13px;
    margin-bottom: 5px
}

.input-group-addon {
    border-radius: 0;
}
/*#endregion */

@media print {
    body {
        padding: 0;
    }

    .pnlDocumentContent {
        width: 100%;
        margin: 0
    }

    a[href]:after {
        content: none !important;
    }

    .col-full-height {
        min-height: 0 !important;
    }

    .row-well {
        padding: 0 !important;
    }

    .js-postContent .flexrow {
        display: block;
    }

    blockquote {
        border-color: transparent;
        border-left-color: #57595b;
    }

    .btnPrint, footer, .dataTables_length, .dataTables_filter, .panel-heading, .dataTables_info, .dataTables_paginate, .downloadOriginal, #goTop, .navLayoutcontainer, .pubContentColFixed, .docContentVideoIframe, .breadcrumb, .divLoggedInLayout, .itemSocial {
        display: none !important
    }

    .pubContentColFixed {
        position: initial !important;
        max-width: initial !important;
        padding-left: 0 !important;
    }

    .pubContentCol .itemMonth {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }

    .docHtmlBody, .pubContentCol {
        max-width: 100%;
    }

    .table {
        margin-bottom: 0 !important;
    }

    .table-bordered th, .table-bordered td {
        border: 0 !important;
    }

    .table-bordered {
        border: 0 !important;
    }

    .panel,
    .table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td {
        border: 0 !important
    }

    .panel-body {
        padding: 0px 5px !important;
    }
}

@media screen and (max-width: 1644px) {
}

@media screen and (max-width: 1439px) {
    :root {
        --liLanguageRight: 21px;
    }

    .js-navbarContainer {
        padding: 54px 25px;
        padding-bottom: 0;
    }

    .navbar-default .navbar-nav.navbarMain > li > a {
        padding: 5px 11px;
    }
}

@media screen and (max-width: 1199px) {

    :root {
        --liLanguageRight: 18px;
        --mainNavigationTop: 0px;
    }

    .innerMenu {
        padding: 26px 0;
    }

    .js-innerMenuItems a {
        padding: 10px 5px;
    }

        .js-innerMenuItems a div {
            padding-left: 0;
            padding-right: 0;
            width: 100%;
            text-align: center;
        }

    .navbar-default .navbar-nav.navbarMain > li > a {
        padding: 5px 7px;
    }

    .divCategoryBack {
        --wh: 213px;
        padding: 21px 0;
    }

        .divCategoryBack img {
            width: 100px;
        }

    .ftSizeCategory {
        font-size: 1.05em;
    }

    .docHtmlBody,
    .docHtmlBody.fixedColImage {
        max-width: initial;
    }

        .docHtmlBody.fixedColImage {
            padding-right: 0;
        }

    .servicesContentText {
        padding-left: 50px;
        padding-right: 50px;
    }

    .addressDetailsOuterCol {
        border-top: 1px dotted #8f9194;
        padding-top: 40px;
    }

    .storageGraphic {
        right: 0;
        background-position-x: 70px;
    }

    .js-menuLogo {
        width: 130px;
    }

    .js-navbarContainer {
        padding-left: 5px;
        padding-top: 45px;
    }

    .navbar-brand {
        padding-right: 0;
        margin-top: 0;
        padding-left: 30px;
    }

    .contactInner {
        padding: 6vw 3vw;
    }

    .contactInner-sm {
        padding: 6vw 3vw;
    }

    .js-slickCategories .slick-arrow {
        width: 30px;
        height: 30px;
    }

    .js-mainNavigation {
        padding-top: 0;
        max-width: calc(100% - 130px);
        text-align: right;
    }

    .navbar-nav > li {
        float: none;
        display: inline-block;
        margin-top: 3px;
    }

    .navbar-brand, .js-homepage .navbar-fixed-top-scroll .navbar-brand {
        margin-top: -22px;
    }
}

@media screen and (max-width: 991px) {

    :root {
        --liLanguageRight: 26px;
    }

    .coffeeServicesMenuOuter {
        width: 320px;
    }

    .docHtmlBody.fixedColImage {
        padding-right: 0;
    }

    .js-innerMenuItems a {
        flex: 1;
        padding: 10px 1px;
    }

    .ulSideMenu li {
        background-size: 36px;
        background-position: left 20px center;
    }

        .ulSideMenu li a {
            padding: 15px 20px;
            padding-left: 70px;
            font-size: 1.2em;
        }

    .modal ol {
        padding-left: 0;
    }

    .archiveImageOuter .videoPlayIcon {
        padding-top: 12vw;
    }

    .servicesContentText {
        padding-left: 25px;
        padding-right: 25px;
    }

    .flexrow-md {
        display: block
    }

        .flexrow-md .pubContentColFixed {
            position: initial;
            padding-top: 0;
        }

        .flexrow-md .col-full-height {
            min-height: 0;
        }

    .row-well-md {
        padding-top: 50px;
        padding-bottom: 50px;
    }

    .innerMenu {
        padding: 25px 0;
    }

    .js-innerMenuItems a div {
        font-size: 0.85em;
        line-height: 1.25;
        width: 100%;
        padding-left: 0;
        padding-right: 0;
        padding-top: 7px;
        padding-bottom: 0;
        text-align: center;
    }

    .lblOurTeam {
        padding: 0 30px;
    }

    a.newsRow .bgImageDoc {
        height: auto;
        padding-bottom: 52.37%;
    }

    .divLoggedInLayout {
        right: 250px;
    }

    a.slickCategory {
        padding-left: 0;
        padding-right: 0
    }

    .modal-md .modal-body {
        padding: 20px 20px;
    }

    .divCategoryBack {
        --wh: 230px;
        padding: 30px 0;
    }

        .divCategoryBack img {
            width: 100px
        }

    .navbar-default .navbar-nav.navbarMain > li > a,
    .langUL,
    .tbSearch.form-control {
        font-size: 0.96em;
    }

    .navbar-default .navbar-nav.navbarMain > li > a {
        padding: 4px 15px
    }

    .js-innerMenuItems a img {
        zoom: 0.8;
    }

    .productsList img {
        max-width: calc(155px - 2 * var(--pad));
    }
}

@media screen and (max-width: 767px) {

    body {
        padding-top: 88px;
        padding-bottom: calc(110px + 30px); /*footer height + bottom spacing*/
    }

        body:not(.mce-content-body) {
            font-size: 15px;
            background-image: none !important;
            padding-bottom: 88px;
        }

    html {
        scroll-padding-top: 110px; /*for jumping to section id# correctly (fixed navbar header)*/
    }

    footer {
        text-align: center;
        padding-bottom: 10px;
        height: 88px;
        font-size: 11px;
    }

    .bgImage-storage {
        padding-bottom: 52.04%;
    }

    .bgImage-home {
        padding-bottom: 100%;
    }

    .bgImage-services {
        padding-bottom: 100%;
    }

    .mce-content-body h3, .docHtmlBody h3, .h3Title {
        font-size: 28px;
    }

    .pnlfollowUs {
        padding-top: 10px;
    }

    .liCreatedBy {
        display: none
    }

    .liCreatedBy-xs {
        display: inline-block !important
    }

    .lblOurTeam {
        font-size: 16px;
    }

    .coffeeServicesMenuOuter {
        width: 100%;
    }

    .docHtmlBody,
    .docHtmlBody.fixedColImage {
        max-width: initial;
    }

    .js-innerMenuItems a {
        max-width: initial;
    }

        .js-innerMenuItems a img {
            display: inline-block;
        }

    .slides {
        height: 460px;
    }

    .vegas-slide-inner {
        background-position: right !important;
    }

    .productsList img {
        max-width: calc(138px - 2 * var(--pad));
    }

    .storageSecBody {
        font-size: 1.1em;
        padding: 9vw 15px;
    }

    .navbar-nav > li {
        float: none;
        display: block;
        margin-top: 0;
    }

    .ulSideMenu li {
        background-size: 36px;
        background-position: left 28px center;
    }

        .ulSideMenu li a {
            padding: 10px 58px;
            padding-left: 83px;
        }

    .js-vegasSliderInner {
        font-size: 16vw;
        line-height: 1.0;
        padding-top: 150px;
        padding-left: 34px;
    }

    .servicesContentText {
        margin-top: 30px;
    }

    .servicesContentText {
        padding: 0vw 30px;
    }

    .navbar-default .navbar-nav.navbarMain > li.liSearch {
        right: 21px;
    }

    .navbar-default .navbar-nav.navbarMain > li.liLanguage {
        top: 1px;
        right: 160px;
    }

    .js-homepage h2 {
        font-size: 1.7em
    }

    .js-homepage h3 {
        font-size: 1.2em;
    }

    .hrSmall {
        margin-top: 10px;
    }

    .row-well {
        padding-top: 8vw;
        padding-bottom: 8vw;
    }

    .row-well-md {
        padding-top: 8vw;
        padding-bottom: 8vw;
    }

    .row-well-sm {
        padding-top: 15px;
        padding-bottom: 15px;
        background-size: auto;
    }

    .innerMenu {
        padding: 15px 0;
    }

    .navbar-nav {
        margin: 0px -15px;
        max-width: initial;
        border-bottom: 1px solid #cccccc;
    }

    a.slickCategory {
        padding-bottom: 30px;
    }

    .contactForm {
        margin-top: 15px;
    }

    .pnlfollowUs.contactfollowUs ul li a {
        padding: 0 10px;
    }

        .pnlfollowUs.contactfollowUs ul li a i {
            font-size: 2.8em;
        }

    .addressDetailsOuterCol {
        padding-top: 0;
        border: 0
    }

    .addressDetailsCol {
        padding-top: 20px;
        padding-bottom: 5px;
        border-top: 1px solid #f2f3f2;
        margin-top: 0;
        margin-bottom: 0;
        text-align: center;
    }

        .addressDetailsCol img {
            max-width: initial;
            margin-bottom: 15px;
            margin-left: auto;
            margin-right: auto;
        }

    .addressDetailsCol {
        font-size: 1.1em;
    }

    .captchaDiv {
        width: 100%;
    }

    a.btnSubmitContact {
        display: block;
    }

    .modal ul {
        padding-left: 31px;
    }

    .modal ol ul {
        padding-left: 30px;
    }

    body.js-homepage .js-navbarContainer .navbar-collapse {
        background-color: var(--colorFooter);
        border-color: transparent;
    }

    .js-homepage .navbar-fixed-top-scroll .navbar-brand {
        margin-top: 0;
    }

    .flexrow:not(.flexrow-xs) {
        display: block
    }

    .divProducts {
        min-height: calc(100vh - 257px - 103px);
    }

    .js-innerMenuItems a {
        padding: 10px 15px;
        display: block;
        text-align: left;
    }

        .js-innerMenuItems a div {
            font-size: 1.05em;
            padding-left: 15px;
            width: auto;
            text-align: left;
        }

            .js-innerMenuItems a div br {
                display: none
            }

    .divLoggedInLayout {
        left: 0;
        right: 0;
        text-align: center;
        border-bottom: 1px dashed white;
        top: 0px;
        line-height: 1.1;
    }

    .contactArrow {
        top: -10px;
    }

    .imgCol {
        padding-left: 30px;
        padding-right: 30px;
    }

    .js-contentText {
        padding-left: 15px;
        padding-right: 15px;
        background-image: none !important;
    }

    .partnersPage .js-contentText {
        padding-left: 0;
        padding-right: 0;
    }

    .js-menuLogo {
        width: 107px;
    }

    .videoPlayIcon {
        padding-left: 7vw;
        padding-right: 7vw;
    }

    .archiveImageOuter .videoPlayIcon {
        padding-top: calc(50% - 25vw);
    }

    .titleVideo {
        line-height: 1.3;
    }

    .divWhereWhyInner {
        padding-bottom: 55px;
    }

    a.newsRow .newsRowText {
        padding-left: 4vw;
        padding-right: 4vw;
    }

    .archiveImageOuter {
        width: 100%;
    }

    .js-navbarContainer {
        padding-top: 15px;
        padding-left: 15px;
        padding-right: 15px;
        padding-bottom: 0;
    }

        .js-navbarContainer .navbar-brand {
            margin-top: 0;
            padding-left: 15px;
        }

        .js-navbarContainer .navbar-header {
            margin-bottom: 13px;
        }

    .navbar-fixed-top .navbar-collapse, .navbar-fixed-bottom .navbar-collapse {
        max-height: 380px;
    }

    .navbar-default .navbar-nav.navbarMain > li > a {
        text-align: center;
        font-size: 1.1em;
        padding: 11px 6px;
    }

    .langUL {
        margin-top: 9px;
        margin-bottom: 7px;
    }

    .navbar-default .navbar-nav.navbarMain > li.liLanguage {
        position: initial;
        text-align: center;
    }

    .langUL, .tbSearch.form-control {
        font-size: 1.1em;
    }

    .navbar-default .navbar-nav.navbarMain > li.liSearch {
        position: relative;
        right: auto;
        top: 0;
        padding-bottom: 5px;
        margin: auto;
        width: 160px;
        max-width: 100%;
    }

    .tbSearch.form-control {
        max-width: 100%;
    }

    .divSearchMembers {
        width: 100%;
    }

    .filterCol {
        margin-bottom: 5px;
        margin-top: 5px;
    }

    .filtersTitle {
        margin-bottom: 2px;
    }

    .navbar-nav .liLanguage.open .dropdown-menu {
        position: static;
        float: none;
        text-align: center;
        background-color: rgba(255, 255, 255, 0.8);
        border: 0;
        padding: 0;
    }

        .navbar-nav .liLanguage.open .dropdown-menu > li {
            display: inline-block
        }

            .navbar-nav .liLanguage.open .dropdown-menu > li > a {
                padding: 7px 15px;
            }

    .divCategoryBack {
        display: block;
        --wh: 250px;
    }

        .divCategoryBack img {
            width: 135px;
        }

    .floatCat {
        position: relative;
        top: 0;
    }

    .divWhereWhy {
        margin-top: 0;
    }

    .socialIcons {
        padding-left: 15px;
        bottom: 7vw;
    }

        .socialIcons li img {
            width: 40px;
        }

    a.divWhereWhyBack {
        padding-bottom: 66%;
    }

    .bgImage-contact {
        padding-bottom: 80%;
    }

    .contactInner img {
        width: 60px
    }

    .bgImage-news {
        padding-bottom: 92%;
        margin-bottom: 20px
    }

    .pubContentColFixed {
        padding-top: 15px;
        padding-bottom: 15px;
        position: initial;
    }

    .contactInner {
        padding: 3vw 3vw;
    }

    .divSearchMembers {
        margin-top: 0;
    }
}

@media (min-width: 768px) {

    body.partnersPage,
    body.contactPage,
    body.js-servicesPage,
    body.js-postContent,
    body.js-archivePage {
        padding-bottom: 58px;
    }

    footer {
        height: 58px
    }

    .modal-md {
        width: 723px;
    }

    .navbar-default {
        height: 118px;
    }

    .col-full-height {
        min-height: calc(100vh - 118px - 58px); /* minus header and footer heights*/
    }

    ol ul {
        padding-left: 30px;
    }

    .js-innerMenuItems a {
        border-right: 1px solid #57585a;
    }

        .js-innerMenuItems a:first-child {
            border-left: 1px solid #57585a;
        }

    .sectionSubHeader {
        padding: 0 70px;
        color: var(--colorFooter);
        font-size: 1.63em;
        line-height: 1.57;
    }

    .pubContentColFixed {
        top: 8vh;
        /* width: inherit; */
        /* max-width: 320px; */
        /*padding-bottom: 250px;*/ /*removed because causes unnecessary height to page when little content*/
        padding-top: 1vw;
        z-index: 1;
    }

    .archiveCSearchImg {
        margin-bottom: 15px
    }
}

@media (min-width: 992px) {

    .modal-md {
        width: 950px; /*NN  */
    }

    .archiveImageOuter {
        width: 180px;
    }

    .extPad30 {
        padding: 0 30px;
    }

    .modal ul,
    .modal ol {
        padding-right: 17px;
    }

    .modal.modal-categoryContent ol {
        padding-left: 5px;
    }
}

@media (min-width: 1200px) {
    .addressDetailsOuterCol {
        border-left: 3px solid #57585a
    }

    .addressDetailsCol {
        padding-left: 3.5vw;
        padding-right: 0
    }
}

@media (min-width: 1400px) {

    .container-ext-md,
    .container-ext {
        width: 1320px; /*NN new Bootstrap 5 xxl col*/
    }

    .divWhereWhy:before {
        content: ' ';
        position: absolute;
        background-color: var(--colorGold);
        left: -80px;
        right: -80px;
        top: 13%;
        bottom: 0;
        margin: auto;
        width: calc(100% + 160px);
        height: 63%;
    }
}

@media (min-width: 1600px) {

    .container-ext-md {
        width: 1420px; /*NN  */
    }

    .container-ext {
        width: 1580px; /*NN  */
    }

    .modal-lg {
        width: 1350px; /*NN  */
    }
}

@media (min-width: 1721px) {

    .container-ext {
        width: 1680px; /*NN  */
    }
}

@media (min-width: 2560px) {

    .pubContentCol {
        padding-left: 0;
        padding-right: 10px;
        margin: auto;
    }
}
