/* Global styling such as font face, headings have been set in Bootstrap Customiser */
    
    @colorOne: #dddddd;
    /* Colour Accent One */
    
    @colorTwo: #aeaeae;
    /* Colour Button Border */
    
    @colorThree: #333333;
    /*Colour Main Text Colour*/
    
    @colorFour: #cdd6dd;
    /*Colour Accent Border Colour*/
    
    @colorFive: ##777777;
    /*Colour Accent Text Colour*/
    
    @cookieTextColour: white;
    /*Colour Cookie Text Colour*/
    
    @cookieBackgroundColour: #363636;
    /*Colour Cookie Background Colour*/
    
    @previewTextColour: white;
    /*Preview Mode Text Colour*/
    
    @previewBackgroundColour: #282828;
    /*Preview Mode Background Colour*/
    
    @previewButtonColour: #595959;
    /*Preview Mode Button Colour*/
    /******************************** 
     * GLOBAL ELEMENT CONFIG / UTILS 
     ********************************/
    
    small {
        display: block;
    }
    label:hover {
        cursor: pointer;
    }
    img {
        max-width: 100%;
    }
    ul {
        margin: 0;
    }
    ul li a {
        display: block;
        width: 100%;
        padding: 0;
    }
    button,
    a {
        -webkit-transition: all .5s ease;
        -moz-transition: all .5s ease;
        -o-transition: all .5s ease;
        transition: all .5s ease;
        &:hover,
        &:focus {}
    }
    a:link,
    a:visited,
    a:hover,
    a:focus,
    a:active {
        text-decoration: none
    }
    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
        margin: 0;
    }
    h1,
    h2,
    h3 {
        margin-bottom: 0.5em;
    }
    h1 {
        font-size: 1.5em;
    }
    h3 {
        font-size: 1.2em;
    }
    button {
        border: none;
        background: none
    }
    /* Setting Form and Button Styles */
    
    input[type="text"],
    input[type="password"],
    input[type="email"],
    input[type="number"],
    select,
    input[type="submit"],
    textarea,
    input[type="button"],
    .button {
        margin: 0px;
        border-radius: 2px;
        border: 1px solid @colorTwo;
        color: @colorThree;
        padding: 0.1em .2em;
    }
    input[type="submit"],
    input[type="button"],
    button,
    .button {
        background: @colorOne;
    }
    /******** 
     * UTILS 
     ********/
    
    .button-lg {
        font-size: 1.3em;
        padding: .3em .2em
    }
    .action-button-cont {
        margin-top: 1em;
        text-align: center;
    }
    .center {
        text-align: center;
    }
    .footer-links span,
    .footer-links span a {
        color: @colorThree!important;
    }
    .table.borderless td,
    .table.borderless tbody {
        border: none!important;
    }
    table {
        font-size: inherit;
    }
    .printlink:before {
        content: "\f02f  ";
        font-family: "FontAwesome"
    }
    /*this makes the light-box on the detail page responsive*/
    
    #lightbox {
        max-width: 100%;
    }
    #body {
        padding-top: 3em;
    }
    footer ul,
    nav ul,
    .CRMCategoryList ul {
        padding: 0;
        list-style: none;
    }
    /*/end of GLOBAL ELEMENT CONFIG */
    /***********************
     * GLOBAL DISPLAY:NONE;
     ***********************/
    
    .CRMFullBasket .basketLinePrice,
    .CRMFullBasket .basketLineCode,
    .CRMFullBasket tfoot,
    .CRMOrderSummaryLinesTable .code,
    .CRMOrderSummaryLinesTable .unitprice,
    .CRMOrderSummaryLinesTable .image,
    .CRMCheckoutLineList .basketImage,
    .CRMCheckoutLineList .basketLineCode,
    .CRMCheckoutLineList .basketLinePrice,
    .CRMCheckoutLineList tfoot,
    .CRMCheckoutLineList .basketLineImage,
    .CRMOrderStatus .os_header_ref,
    .CRMOrderStatus .os_header_price,
    .CRMOrderStatus .os_line_price,
    .CRMOrderStatus .os_line_ref,
    .CRMOrderStatus .os_header_invoiced,
    .CRMOrderStatus .os_line_invoiced,
    .CRMListLineItems .code,
    .CRMListLineItems .lastordered,
    .divManage .contactauthority,
    .divManage .contactleftcompany,
    .divManage .contactonhold,
    .CRMListBaskets .ordered,
    .CRMListBaskets .createdby,
    .CRMListBaskets .created,
    .CRMListBaskets .ref,
    .CRMListBaskets .status,
    .CRMListBaskets .linecount,
    .CRMFullLineList .basketImage,
    .CRMFullLineList .basketLineCode,
    .CRMFullLineList .basketLinePrice,
    .CRMFullLineList tfoot,
    .basketLineImage,  
    .CRMProdItemSummaryStock .v, 
    .CRMProdItemDetailStock .v  {
        display: none;
    }
    #home-mini-basket {
        display: none;
    }
    #cookieok_bar {
        font-family: inherit!important;
        padding: 1em 0!important;
        text-align: center!important;
        border-bottom: none!important;
        color: @cookieTextColour!important;
        background: @cookieBackgroundColour!important;
        transition: all .3s ease-in-out!important;
        font-size: 13px!important;
    }
    #cookieok_bar a {
        color: white!important;
    }
    /***********************
    * PREVIEW MODE 
    ***********************/
    
    .preview-mode {
        background: @previewBackgroundColour;
        padding: .7em .5em;
        border-bottom: 1px solid aliceblue;
        z-index: 13;
        position: fixed;
        width: 100%;
        margin-bottom: 0em;
    }
    .preview-mode input[value="Exit Preview Mode"] {
        border: none;
        background: @previewButtonColour;
        color: @previewTextColour;
        padding: .5em;
        border-radius: 3px;
        margin: 0;
    }
    .preview-mode::after {
        content: "\f05a  You are currently in Preview Mode";
        font-size: 13px;
        color: @previewTextColour;
        position: absolute;
        margin-left: 15px;
        margin-top: 5px;
        font-family: FontAwesome, arial;
    }
    .in-preview {
        padding-top: 50px!important;
    }
    /* /end PREVIEW MODE */
    /***********************
    * PORTAL LOGIN PAGE
    ***********************/
    
    #login-box > div {
        width: 18em;
        margin-left: auto;
        margin-right: auto;
        padding-top: 2em;
    }
    /* /end of PORTAL LOGIN PAGE */
    /***********************
    * HEADER
    ***********************/
    
    .site-title h1 {
        margin: 0;
    }
    ul#main-menu {
        display: none;
    }
    ul#main-menu li {
        padding: 0em .5em;
    }
    .loggedout,
    .loggedin,
    #view-basket {
        display: inline-block;
    }
    .loggedout,
    .loggedin {
        margin-right: 1em;
    }
    div#header-cont {
        padding-top: 1em;
    }
    #greetings-cont {
        text-align: center;
    }
    header .row {
        padding-bottom: 1em
    }
    .search-bar-cont #CRMProdSearch select {
        width: 100%
    }
    .search-bar-cont #CRMProdSearch input[type="text"] {
        width: ~"calc(100% - 46px)";
    }
    .search-bar-cont #CRMProdSearch select,
    .search-bar-cont #CRMProdSearch input[type="text"] {
        margin-bottom: .3em
    }
    /*/end of HEADER*/
    /***********************
    * FOOTER
    ***********************/
    
    .footer-logo-cont {
        text-align: center;
        padding-bottom: 1em
    }
    footer {
        padding: 4em 1em 5em 1em;
    }
    ul#footer-menu {
        text-align: center;
        margin-bottom: .5em;
    }
    ul#footer-menu li {
        display: inline-block;
        padding-right: 3.5em;
    }
    div#body {
        padding-bottom: 3em;
    }
    /*/end FOOTER*/
    /***********************
    * BODY
    ***********************/
    
    #mid-col {
        padding-top: 1em
    }
    .mini-basket h3 {
        margin-top: 0;
    }
    #mini-basket-cont,
    #side-news-cont {
        margin-top: 2em
    }
    /***********************
    * HOME PAGE
    ***********************/
    
    .home .CRMProdItemList .CRMProdItemSummary {
        min-height: 14.4em;
    }
    .single-item-slider {
        display: none;
    }
    /***************************************************
     * CATEGORY LIST, PRODUCT LIST AND PRODUCT DETAIL
    ****************************************************/
    
    #category-list-cont .CRMCategoryList h3 {
        display: inline-block;
    }
    #category-list-cont .CRMCategoryList h3:hover {
        cursor: pointer;
    }
    #category-list-cont .CRMCategoryList h3:after {
        display: inline-block;
        content: "  \f0d7";
        font-family: "FontAwesome";
        transition: all 300ms ease;
        margin-left: .2em;
    }
    #category-list-cont .CRMCategoryList h3.menu-open:after {
        -webkit-transform: rotate(180deg);
        -moz-transform: rotate(180deg);
        -o-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
        transform: rotate(180deg);
    }
    #category-list-cont .CRMCategoryList ul {
        display: none
    }
    .CRMCategoryList > ul > li > a {
        border-top-left-radius: 5px;
        border-top-right-radius: 5px;
        font-weight: 700;
        color: black;
        border-bottom: 1px solid @colorFour;
    }
    .CRMCategoryList ul li a {
        padding: .4em;
    }
    #home-categories-list .CRMCategoryList > ul > li {
        display: inline-block;
        vertical-align: top;
        border: 1px solid @colorFour;
        border-radius: 5px;
    }
    .CRMCategoryList > ul > li ul a {
        border-bottom: 1px solid @colorFour;
        color: @colorFive;
    }
    .CRMCategoryList > ul > li ul a:hover {
        background: @colorFour;
    }
    /* prevents last link having a double border */
    
    .CRMCategoryList > ul > li ul li:nth-last-of-type(1) a {
        border-bottom: 0;
    }
    #home-categories-list .CRMCategoryList > ul > li {
        margin-bottom: 2em;
    }
    .CRMCategoryThumbList ul {
        list-style: none;
        padding: 0;
    }
    .CRMProdItemSummaryDesc {
        width: 98%;
    }
    /* If text is greater than the width of the parent div, show ... */
    
    .CRMProdItemSummaryDesc,
    .CRMCategoryList a,
    .CRMMiniLineRow {
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
    }
    .CRMCategoryThumbList ul,
    .CRMProdItemList {
        list-style-type: none;
    }
    .CRMCategoryThumbList ul li,
    .CRMProdItemList .CRMProdItemSummary,
    .home .CRMProdItemList .CRMProdItemSummary{
        vertical-align: top;
        border: 1px solid @colorFour;
        margin-top: .5em;
        margin-bottom: .5em;
        display: block;
        margin-left: auto;
        margin-right: auto;
        text-align: center;
        padding: 1em;
    }
    .CRMCategoryThumbList ul li{
        width: 85%;
        min-height: 14em;
    }
    .home .CRMProdItemList .CRMProdItemSummary {
        min-height: 20em;
    }
    .CRMProdItemAddToBasket .addqty {
        display: inline-block;
        width: 3em;
        margin-right: .2em;
        height: 1.8em;
        vertical-align: bottom;
        margin-top: .3em;
    }
    .searchpagenav {
        font-size: 1.1em;
        color: @colorFive;
        padding: .5em;
        margin-top: 2em;
        text-align: center;
        clear: both;
        a {
            border: 1px solid @colorFour;
            border-radius: 4px;
            padding: .2em .5em;
            color: @colorThree;
            background: @colorOne;
        }
    }
    /***********************
    * PRODUCT DETAIL
    ***********************/
    
    .enlargelink:after {
        content: "  \f00e";
        font-family: "FontAwesome"
    }
    .CRMProdItemList.CRMProdItemModeS .CRMProdItemDetail > div {
        display: inline-block;
        vertical-align: top;
    }
    .CRMProdItemDetailDesc {
        font-size: 2em;
    }
    .CRMProdItemDetailCost {
        font-size: 1.4em;
    }
    /***********************
    * MINI BASKET
    ***********************/
    
    .CRMMiniLineSummary .CRMMiniLineRow a {
        color: @colorThree
    }
    .CRMMiniLineSummary .CRMMiniLineRow {
        border-bottom: 1px solid @colorFour;
        padding: .2em .5em
    }
    .CRMMiniLineSummary .CRMMiniLineRow:nth-child(odd) {
        background: @colorFour;
    }
    .CRMMiniLineQty,
    .CRMMiniBasketAmount {
        font-weight: bold;
    }
    .CRMMiniLineQty:after {
        content: "x ";
        font-weight: bold;
    }
    .CRMMiniBasketLines,
    .CRMMiniBasketAmount {
        margin: .5em 0em
    }
    #CRMMiniBasketBubble {
        text-align: center;
        padding: .5em;
        background: @colorOne;
    }
    #CRMMiniBasketBubble a {
        color: @colorThree;
    }
    .bubbleCloseTop:after {
        content: "\f00d";
        position: absolute;
        top: 0;
        right: 0;
        font-family: "FontAwesome";
    }
    .bubbleControls,
    .bubbleText,
    .bubbleCloseTop {
        display: inline-block;
        position: relative;
    }
    .bubbleText {
        margin-left: 1em;
        margin-right: 1em;
    }
    .bubbleCloseTop a {
        display: block;
        width: 4.6em;
    }
    .bubbleText:after {
        content: "  \f00c";
        font-family: "FontAwesome";
    }
    .bubbleControls span {
        margin-right: 1em
    }

.CRMProdItemSummaryVariationLink a {
    background-color: #000080;
    padding: 5px 10px;
    color: #fff;
    border-radius: 5px;
}
    
    /***********************
    * CHECKOUT PROCESS
    ***********************/
    
    #view-basket a:after {
        content: "  \f07a";
        font-family: "FontAwesome";
    }
    /* GUEST CHECKOUT */
    
    .CRMGuestCheckout form {
        position: relative;
    }
    .CRMGuestCheckout form input[type="Submit"] {
        position: absolute;
        right: 0;
    }
    .CRMGuestCheckout label {
        padding: 0em .5em;
    }
    .CRMGuestEmailField {
        padding: 2em 2em 2em 2em;
        background: @colorOne;
        margin-bottom: 2em;
    }
    .CRMGuestOptions > div {
        padding: .5em 0em;
    }
    .CRMGuestOptions input[type="radio"] {
        vertical-align: middle;
    }
    /*/end of GUEST CHECKOUT*/
    
    #checkout-stages {
        font-size: 1.3em;
        li {
            display: inline-block;
            padding: .5em .6em;
        }
    }
    .CRMOrderSummaryHeader,
    .checkouthdrdetails,
    .checkouthdraddress {
        .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: none;
        }
    }
    .selected {
        font-weight: bold;
    }
    .basketcontrols input {
        margin-left: .3em
    }
    form[name="paymentselection"] {
        text-align: right;
    }
    form[name="paymentselection"] input.CRMBuyButton {
        margin-top: 1em;
    }
    textarea[name="deliverynotes1"] {
        resize: none;
        overflow-x: hidden;
        overflow-y: scroll;
        height: 12em;
    }
    .checkouthdraddress input[type="text"],
    .checkouthdraddress textarea,
    .checkouthdraddress select {
        width: 17em;
    }
    .CRMHeaderBasketCheckout .CRMBasketButton {
        text-align: right;
    }
    form[name="paymentselection"] {
        background: @colorOne;
        padding: 1em
    }
    /***********************
    * REG FORMS
    ***********************/
    
    .CRMUserRegFormInput {
        padding: .3em 0em
    }
    .CRMUserRegFormInput label {
        display: inline-block;
        width: 13em;
    }
    .CRMUserRegFormSubmit {
        text-align: right
    }
    .CRMUserRegFormBasic {
        text-align: center;
    }
    .CRMUserRegFormBasic {
        padding: 1em;
        background: @colorFour
    }
    /***********************
    * LOGIN
    ***********************/
    
    #inputUser,
    #inputPassword,
    #submitLogin {
        padding-bottom: .5em
    }
    /***********************
    * BREADCRUMBS
    ***********************/
    
    .cmsbiscuit,
    .cmsbiscuitseperator {
        display: inline-block;
    }
    .cmsbiscuitseperator {
        padding: 0em .5em
    }
    /***********************
    * QUICK ORDER CHECK
    ***********************/
    
    #qopform,
    #qopbulklink {
        display: none;
    }
    #qopmain:after {
        content: "Sorry - To use the quick order pad, please use a device with a large screen such as a tablet in landscape or a laptop.";
    }

.bulky-items {
    border: 1px red solid;
    padding: 10px;
    background-color: #F9E7E7;
    color: red;
    margin-bottom: 10px;
    border-radius: 15px;
}

.extraImgContainer {
    overflow: hidden;
    position: relative;
    width: 100%%;
    height: 100px;
    margin-top: 10px;
}

ul.productImageList {
    max-height: 120px;
    width: 100%;
    position: absolute;
    text-align: left;
    left: 15px;
    padding: 0;
    z-index: 90;
    transition: all 1s;
}

.defaultProductImage {
    list-style: none;
    display: inline-block;
    float: left;
    max-height: 120px;
    width: 110px;
    text-align: center;
    position: relative;
    top: 0;
    left: 0;
    margin: 4px 0;
}
.del-type.b {
    border: red 1px solid;
    border-radius: 5px;
    width: 125px;
    display: inline-block;
    color: red;
    padding: 5px;
    background-color: #fdcece;
    text-align: center;
    margin-bottom: 5px;
}
.del-type.f {
    border: green 1px solid;
    border-radius: 5px;
    padding: 5px;
    background-color: #d5ffd5;
    color: green;
    text-align: center;
    margin-bottom: 5px;
    display: inline-block;
    width: 125px;
}

.CRMCategoryList ul ul ul {
    padding-left: 20px;
}

.header-open-times {
    color: #000080;
}
    /*******************
     * MEDIA QUERIES
     *******************/
    /*@media(min-width:400px) {}*/
    /* Small devices (tablets, 768px and up) */
    
    @media(min-width:550px) {
        /*HEADER*/
        .search-bar-cont #CRMProdSearch input[type="text"] {
            width: inherit;
        }
        .search-bar-cont #CRMProdSearch select,
        .search-bar-cont #CRMProdSearch input[type="text"] {
            margin-bottom: 0;
        }
        .search-bar-cont #CRMProdSearch select {
            max-width: 12em
        }
        /*/end of HEADER*/
        /* PRODUCT LIST AND CATEGORY */
        .CRMCategoryThumbList ul li,
        .home .CRMProdItemList .CRMProdItemSummary {
            width: 48.7%;
            display: inline-block;
            margin: .3em .2em;
        }

        /*Delivery Charges "Large Bulky Orders align fix*/
        td:first-child {
            width: 100px;
        }


    }

        /*Delivery Charges "Large Bulky Orders align fix*/
        /* For smaller screens */

        @media(max-width: 549px) {
        #table-align-fix {
            transform: translateY(-17px);
        }
    }




    @media (min-width: 768px) {
        /*HEADER*/
        #mobile-menu {
            display: none;
        }
        ul#main-menu {
            display: block;
            display: flex;
    max-height: 57px;
        }
        ul#main-menu li {
            display: inline-block;
            text-align: center;
            flex-grow: 1;
        }
        ul#main-menu li:nth-of-type(1) {
            padding-left: 0;
        }
        #mid-col {
            padding-top: 0em
        }
        /* CATEGORY AND PRODUCT LIST */
        .CRMCategoryThumbList ul li,
        .home .CRMProdItemList .CRMProdItemSummary {
            width: 31.9%;
        }
        /* QUICK ORDER PAD */
        #qopform,
        #qopbulklink {
            display: block;
        }
        #qopmain:after {
            content: "";
        }
        .orderpadrows input,
        .orderpad button {
            padding: 0.1em .2em!important;
            margin: 0px!important;
            border-radius: 2px!important;
            border: 1px solid @colorTwo;
            color: @colorThree;
            background: transparent!important;
            line-height: normal;
            display: inline-block;
            vertical-align: inherit!important;
        }
        .orderpad button {
            background: @colorOne!important;
        }
        #qopmain .prodblock {
            line-height: normal;
        }
        span.prodblock input {
            display: inline-block;
            vertical-align: middle
        }
        .addrow button {
            margin-right: .2em!important
        }
    }
    /* Medium devices (desktops, 992px and up) */
    
    @media (min-width: 992px) {
        #greetings-cont {
        text-align: right;
        }
        .action-button-cont {
            text-align: right;
        }
        h1 {
            font-size: 2em;
        }
        h3 {
            font-size: 1.5em;
        }
        .search-bar-cont {
            text-align: right;
        }
        /*BODY*/
        #mid-col {
            padding-right: 0;
            margin-right: 0;
        }
        #left-col {
            padding-left: 0;
            margin-left: 0;
        }
        /* HOME PAGE */
        .home .CRMProdItemList .CRMProdItemSummary {
            width: 24.4%;
        }
        /* CATEGORY AND PRODUCT LIST */
        #category-list-cont .CRMCategoryList h3:hover {
            cursor: auto;
        }
        #category-list-cont .CRMCategoryList h3:after {
            content: "";
        }
        #category-list-cont .CRMCategoryList ul {
            display: block
        }
        #home-categories-list .CRMCategoryList > ul > li {
            margin-bottom: 0em;
        }
        .CRMCategoryThumbList ul li:nth-of-type(4n - 7) {
            margin-left: 0;
        }
        .CRMCategoryThumbList ul li:nth-of-type(4n) {
            margin-right: 0;
        }
        .CRMProdItemList .CRMProdItemSummary:nth-of-type(2n) {
            margin-left: 0
        }
        .CRMProdItemList .CRMProdItemSummary:nth-of-type(4n + 5) {
            margin-right: 0;
        }
        .CRMCategoryThumbList ul li,
        .home .CRMProdItemList .CRMProdItemSummary {
            width: 24.1%;
        }
        /*FOOTER*/
        .footer-logo-cont {
            text-align: left;
            padding-bottom: 0
        }
    }
    /* Large devices (desktops, 1200px and up) */
    /*@media (min-width: 1200px) {}*/
    /* Add Print styles here */
    /*@media print{}*/