﻿/*@font-face { font-family: "unox-icons"; src: url("../css/fonts/unox-icons/unox-icons.eot"); src: url("../css/fonts/unox-icons/unox-icons.eot?#iefix") format("eot"), url("../css/fonts/unox-icons/unox-icons.woff") format("woff"), url("../css/fonts/unox-icons/unox-icons.ttf") format("truetype"), url("../css/fonts/unox-icons/unox-icons.svg#unox-icons") format("svg"); font-weight: normal; font-style: normal; }*/

html {
    font-size: 16px;
    margin: 0px;
    padding: 0px;
    position: relative;
    height: 100%;
}

body {
    margin: 0px;
    padding: 0px;
    height: 100%;
    background-color: #fff;
    position: relative;
    height: 100%;
    line-height: 1.4rem;
    transition: background-color 300ms ease-in;
}

html, body {
    font-family: "CooperHewitt-Medium",Arial,sans-serif;
    background: #f3f3f3;
    color: #444;
}

.ViewModeDesktop {
    display: block;
    background: green;
}

.ViewModeMobile {
    display: none;
    background: red;
}

.OuterPageWrapper {
    height: 100%;
}

.InnerPageWrapper {
    float: left;
    width: 100%;
    height: 100%;
    position: absolute;
}

.InnerHeaderWrapper {
    float: left;
    width: 100%;
    font-size: 13px;
}

.OuterHeaderContentWrapper {
    float: left;
    width: 100%;
    background-color: #fff;
    height: 82px;
}

.InnerHeaderContentWrapper {
    width: 1620px;
    margin: 0px auto;
    padding-top: 0px;
    position: relative;
}

.OuterCategoriesWrapper {
    float: left;
    width: 100%;
    background-color: #262626;
    height: 47px;
}

.InnerCategoriesWrapper {
    width: 1620px;
    margin: 0px auto;
}

.OuterContentWrapper {
    float: left;
    width: 100%;
}

.InnerContentWrapper {
    width: 1620px;
    margin: 0px auto;
    padding: 0px;
    position: relative;
    background: #fff;
    box-sizing: border-box;
}

.OuterFooterWrapper {
    float: left;
    clear: both;
    width: 100%;
    position: relative;
    background-color: #f3f3f3;
    color: #888;
    padding-top: 20px;
    padding-bottom: 20px;
    margin-top: 0px;
    box-shadow: 0px -1px 4px rgba(0, 0, 0, 0.2);
}

    .OuterFooterWrapper.Bottom {
        bottom: 0px;
        position: absolute;
    }

.InnerFooterWrapper {
    width: 1620px;
    margin: 0px auto;
    font-size: 13px;
}

.MainContentWrapper {
    float: left;
    width: 100%;
    background-color: #fff;
    padding: 20px;
    box-sizing: border-box;
}

/* GLOBAL */
h1 {
    font-size: 2rem;
    margin-bottom: 1.5rem;
    line-height: 2.2rem;
    font-family: "CooperHewitt-Bold";
}

h2 {
    font-size: 1.6rem;
    margin-bottom: 1rem;
    line-height: 1.8rem;
    font-family: "CooperHewitt-Semibold";
    border-bottom: 1px solid #f3f3f3;
    padding-bottom: 5px;
}

h3 {
    font-size: 1.2rem;
    margin-bottom: 1rem;
    line-height: 1.2rem;
    font-family: "CooperHewitt-Semibold";
    border-bottom: 1px solid #f3f3f3;
    padding-bottom: 5px;
}

h5 {
    font-size: 1rem;
    margin-bottom: 1rem;
    line-height: 1rem;
    font-family: "CooperHewitt-Semibold";
    text-transform: uppercase;
}

p {
    margin-bottom: 1.2rem;
}

.Button, .GridButton {
    background: none;
    white-space: nowrap;
    border: 0px;
    margin-top: 0px;
    padding: 10px;
    padding-left: 30px;
    padding-right: 30px;
    text-align: center;
    box-sizing: border-box;
    text-transform: uppercase;
    font-size: 1rem;
    border-radius: 3px;
    color: #d01e38;
    background-color: #fafafa;
    border: 1px solid #ddd;
    cursor: pointer;
    transition: all 200ms linear;
    text-decoration: none;
    font-family: "CooperHewitt-Medium",Arial,sans-serif;
}

    .Button:hover, .GridButton:hover {
        background-color: #d01e38;
        text-decoration: none;
        color: #fff;
    }

    .Button[disabled="disabled"], .GridButtonDisabled {
        color: #aaa;
        cursor: default
    }

        .Button[disabled="disabled"]:hover, .GridButtonDisabled:hover {
            background-color: #fafafa;
            text-decoration: none;
            color: #aaa;
        }

.GridButton {
    margin-left: 20px;
}

    .GridButton div {
        padding: 0px !important;
    }

.Error {
    color: #C00000;
    background-color: #F7DDDD;
    padding: 10px;
    display: block;
    padding-left: 40px;
    position: relative;
    clear: both
}

    .Error:before {
        content: '\f056';
        font-family: 'FontAwesome5';
        position: absolute;
        left: 10px;
        top: 50%;
        margin-top: -12px;
        font-size: 24px;
        line-height: 24px;
        color: #C00000;
    }

.Success {
    color: #3c763d;
    background-color: #dff0d8;
    padding: 10px;
    display: block;
    padding-left: 40px;
    position: relative;
    clear: both
}

    .Success:before {
        content: '\f058';
        font-family: 'FontAwesome5';
        position: absolute;
        left: 10px;
        top: 50%;
        margin-top: -12px;
        font-size: 24px;
        line-height: 24px;
        color: #3c763d;
    }

.Info {
    color: #31708f;
    background-color: #d9edf7;
    padding: 10px;
    display: block;
    padding-left: 40px;
    position: relative;
    clear: both
}

    .Info:before {
        content: '\f05a';
        font-family: 'FontAwesome5';
        position: absolute;
        left: 10px;
        top: 50%;
        margin-top: -12px;
        font-size: 24px;
        line-height: 24px;
        color: #31708f;
    }

.Warning {
    color: #343a40;
    background-color: #ffe28a;
    padding: 10px;
    display: block;
    padding-left: 40px;
    position: relative;
    clear: both
}

    .Warning:before {
        content: '\f06a';
        font-family: 'FontAwesome5';
        position: absolute;
        left: 10px;
        top: 50%;
        margin-top: -12px;
        font-size: 24px;
        line-height: 24px;
        color: #343a40;
    }

.Hidden {
    display: none !important;
}

/* ICONS */
.ReportIcon {
    position: relative;
    color: #262626 !important;
    float: right;
    margin-left: 10px;
}

    .ReportIcon:hover {
        text-decoration: none !important;
        color: #d01e38 !important;
    }

    .ReportIcon:before {
        content: '\f15c';
        font-family: FontAwesome5Light;
        font-size: 24px;
    }

.ReportIconPDF:before {
    content: '\f1c1';
    font-family: FontAwesome5Light;
    font-size: 24px;
}

.ReportIconXLS:before {
    content: '\f1c3';
    font-family: FontAwesome5Light;
    font-size: 24px;
}


.InvoiceIcon {
    position: relative;
    color: #262626 !important;
    float: left;
}

    .InvoiceIcon:hover {
        text-decoration: none !important;
        color: #d01e38 !important;
    }

    .InvoiceIcon:before {
        content: '\f15b';
        font-family: FontAwesome5Light;
        font-size: 24px;
    }

    .InvoiceIcon:after {
        content: '\f155';
        font-family: FontAwesome5Light;
        font-size: 12px;
        position: absolute;
        left: 6px;
        top: 8px;
    }

/*.CardLockIcon { position: relative; color: #262626 !important; float: left; }
    .CardLockIcon:hover { text-decoration: none !important; color: #d01e38 !important; }
    .CardLockIcon:before { content: '\f389'; font-family: FontAwesome5Light; font-size: 32px; }
    .CardLockIcon:after { content: '\f30d'; font-family: FontAwesome5Solid; font-size: 12px; position: absolute; right: 6px; top: 7px; }*/

.EditIcon {
    position: relative;
    color: #262626 !important;
    float: left;
}

    .EditIcon:hover {
        text-decoration: none !important;
        color: #d01e38 !important;
    }

    .EditIcon:before {
        content: '\f040';
        font-family: FontAwesome5Light;
        font-size: 24px;
    }

.DeleteIcon {
    position: relative;
    color: #262626 !important;
    float: left;
}

    .DeleteIcon:hover {
        text-decoration: none !important;
        color: #d01e38 !important;
    }

    .DeleteIcon:before {
        content: '\f2ed';
        font-family: FontAwesome5Light;
        font-size: 24px;
    }

.JustSeeIcon {
    position: relative;
    color: #262626 !important;
    float: left;
}

    .JustSeeIcon:hover {
        text-decoration: none !important;
        color: #d01e38 !important;
    }

    .JustSeeIcon:before {
        content: '\f06e';
        font-family: FontAwesome5Light;
        font-size: 24px;
    }




.UpdateIcon {
    position: relative;
    color: #262626 !important;
    float: left;
}

    .UpdateIcon:hover {
        text-decoration: none !important;
        color: #3c763d !important;
    }

    .UpdateIcon:before {
        content: '\f00c';
        font-family: FontAwesome5;
        font-size: 28px;
        line-height: 38px;
    }

.CancelIcon {
    position: relative;
    color: #262626 !important;
    float: left;
}

    .CancelIcon:hover {
        text-decoration: none !important;
        color: #d01e38 !important;
    }

    .CancelIcon:before {
        content: '\f00d';
        font-family: FontAwesome5;
        font-size: 28px;
        line-height: 38px;
    }
/*.CardEditIcon:after { content: '\f040'; font-family: FontAwesome5Solid; font-size: 12px; position: absolute; right: 6px; top: 7px; }*/

.AddNewSubscriptionIcon {
    position: relative;
    color: #262626 !important;
    float: left;
    padding-left: 45px;
}

    .AddNewSubscriptionIcon:hover {
        text-decoration: none !important;
        color: #fff !important;
    }

    .AddNewSubscriptionIcon:before {
        position: absolute;
        left: 10px;
        content: '\f674';
        font-family: 'FontAwesome5';
        font-size: 24px;
    }

/* content: '\f674' */
/* LOGO */
.LogoWrapper {
    padding: 0px;
    position: absolute;
    right: 30px;
    padding-top: 0;
    margin-top: 40px;
    box-sizing: border-box;
    z-index: 999;
}

.Icon {
    text-decoration: none !important;
}

.CardLockIcon {
    position: relative;
    color: #262626 !important;
    float: left;
    line-height: 64px;
    height: 64px;
}

    .CardLockIcon:hover {
        text-decoration: none !important;
        color: #d01e38 !important;
    }

    .CardLockIcon:before {
        content: '\f389';
        font-family: FontAwesome5Light;
        font-size: 64px;
    }

    .CardLockIcon:after {
        content: '\f30d';
        font-family: FontAwesome5Solid;
        font-size: 24px;
        position: absolute;
        left: 40px;
        top: -6px;
    }

.CardOpenIcon {
    position: relative;
    color: #262626 !important;
    float: left;
    line-height: 64px;
    height: 64px;
}

    .CardOpenIcon:hover {
        text-decoration: none !important;
        color: #d01e38 !important;
    }

    .CardOpenIcon:before {
        content: '\f389';
        font-family: FontAwesome5Light;
        font-size: 64px;
    }

    .CardOpenIcon:after {
        content: '\f3c1';
        font-family: FontAwesome5Solid;
        font-size: 24px;
        position: absolute;
        left: 37px;
        top: -6px;
    }

.CardDeactivateIcon {
    position: relative;
    color: #262626 !important;
    float: left;
    line-height: 64px;
    height: 64px;
}

    .CardDeactivateIcon:hover {
        text-decoration: none !important;
        color: #d01e38 !important;
    }

    .CardDeactivateIcon:before {
        content: '\f389';
        font-family: FontAwesome5Light;
        font-size: 64px;
    }

    .CardDeactivateIcon:after {
        content: '\f057';
        font-family: FontAwesome5Solid;
        font-size: 24px;
        position: absolute;
        left: 40px;
        top: -6px;
    }

.CardCopyIcon {
    position: relative;
    color: #262626 !important;
    float: left;
    line-height: 64px;
    height: 64px;
}

    .CardCopyIcon:hover {
        text-decoration: none !important;
        color: #d01e38 !important;
    }

    .CardCopyIcon:before {
        content: '\f389';
        font-family: FontAwesome5Light;
        font-size: 64px;
    }

    .CardCopyIcon:after {
        content: '\f0c5';
        font-family: FontAwesome5Solid;
        font-size: 24px;
        position: absolute;
        left: 40px;
        top: -6px;
    }

.CardCodeIcon {
    position: relative;
    color: #262626 !important;
    float: left;
    line-height: 64px;
    height: 64px;
}

    .CardCodeIcon:hover {
        text-decoration: none !important;
        color: #d01e38 !important;
    }

    .CardCodeIcon:before {
        content: '\f389';
        font-family: FontAwesome5Light;
        font-size: 64px;
    }

    .CardCodeIcon:after {
        content: '\f084';
        font-family: FontAwesome5Solid;
        font-size: 24px;
        position: absolute;
        left: 40px;
        top: -6px;
    }

.CardChangePinIcon {
    position: relative;
    color: #262626 !important;
    float: left;
    line-height: 64px;
    height: 64px;
}

    .CardChangePinIcon:hover {
        text-decoration: none !important;
        color: #d01e38 !important;
    }

    .CardChangePinIcon:before {
        content: '\f389';
        font-family: FontAwesome5Light;
        font-size: 64px;
    }

    .CardChangePinIcon:after {
        content: '\f2f1';
        font-family: FontAwesome5Solid;
        font-size: 24px;
        position: absolute;
        left: 40px;
        top: -6px;
    }

.CardCopyCodeIcon {
    position: relative;
    color: #262626 !important;
    float: left;
    line-height: 64px;
    height: 64px;
}

    .CardCopyCodeIcon:hover {
        text-decoration: none !important;
        color: #d01e38 !important;
    }

    .CardCopyCodeIcon:before {
        content: '\f389';
        font-family: FontAwesome5Light;
        font-size: 64px;
    }


i.CopyCardIcon:after {
    content: '\f0c5';
    font-family: FontAwesome5Solid;
    font-size: 24px;
    position: absolute;
    left: 20px;
    top: -6px;
}

i.SendCardPinIcon:after {
    content: '\f084';
    font-family: FontAwesome5Solid;
    font-size: 24px;
    position: absolute;
    left: 40px;
    top: -6px;
}

/* MAIN MENU */
.MainMenuWrapper {
    float: left;
}

    .MainMenuWrapper ul {
        float: left;
    }

        .MainMenuWrapper ul li {
            float: left;
            list-style: none;
            display: inline-block;
        }

            .MainMenuWrapper ul li a {
                float: left;
                padding: 32px 20px 20px 20px;
                position: relative;
                transition-property: color;
                transition-duration: .3s;
                font-family: "CooperHewitt-Medium";
                text-decoration: none;
                text-transform: uppercase;
                color: #2e2e34;
            }

                .MainMenuWrapper ul li a:hover {
                    color: #acacb5;
                }

                .MainMenuWrapper ul li a.Selected {
                    font-family: "CooperHewitt-Bold";
                }

                    .MainMenuWrapper ul li a.Selected:after {
                        position: absolute;
                        content: "";
                        display: block;
                        bottom: 10px;
                        left: 50%;
                        transform: translateX(-50%);
                        right: 0;
                        width: 30px;
                        height: 4px;
                        background: #d1202d;
                        z-index: 12;
                    }

            .MainMenuWrapper ul li .SubMenu {
                position: absolute;
                top: 83px;
                left: 120px;
                right: 0;
                z-index: 10;
                transform-origin: top center;
                display: none;
            }

    .MainMenuWrapper > ul > li > a.Selected + .SubMenu {
        display: block;
    }

    .MainMenuWrapper > ul > li > a + .SubMenu ul {
        width: 100%;
        margin: 0 auto;
        text-align: left;
    }

        .MainMenuWrapper > ul > li > a + .SubMenu ul li a {
            display: inline-block;
            font-weight: 700;
            padding: 15px 30px 11px 30px;
            color: #ccc;
            transition-property: color;
            transition-duration: .3s;
        }

            .MainMenuWrapper > ul > li > a + .SubMenu ul li a:hover {
                color: #fff;
            }

            .MainMenuWrapper > ul > li > a + .SubMenu ul li a.Selected {
                color: #fff;
            }

                .MainMenuWrapper > ul > li > a + .SubMenu ul li a.Selected:after {
                    display: none;
                }

.BurgerMenu {
    box-sizing: content-box;
    width: 25px;
    height: 20px;
    padding: 35px 0 22px 0;
    display: none;
    position: relative;
    margin-left: 20px;
}

    .BurgerMenu > span {
        height: 2px;
        background: #000;
        width: 100%;
        display: block;
    }

        .BurgerMenu > span:not(:last-child) {
            margin-bottom: 5px;
        }

/* VIEW MODE */
.ViewModeWrapper {
    float: right;
    display: none;
}

    .ViewModeWrapper .ViewModeItem {
        padding: 15px;
        padding-left: 50px;
        padding-right: 20px;
        float: left;
        position: relative;
        color: #2d2d2d;
        font-size: 1.2rem;
        font-weight: 700;
        background-color: #fff;
        border: 1px solid #d01e38;
        text-transform: uppercase;
        border-top: 0;
        margin-right: 20px;
    }

        .ViewModeWrapper .ViewModeItem.Selected {
            background-color: #d01e38;
            border: 1px solid #d01e38;
            color: #fff;
            border-top: 0;
        }

        .ViewModeWrapper .ViewModeItem a {
            color: #2d2d2d;
            text-decoration: none;
        }

        .ViewModeWrapper .ViewModeItem.Selected a {
            color: #fff;
            text-decoration: none;
        }

    .ViewModeWrapper .Driver:before {
        content: url('/img/icon_driver.png');
        position: absolute;
        left: 10px;
        top: 10px;
    }

    .ViewModeWrapper .Owner:before {
        content: url('/img/icon_owner.png');
        position: absolute;
        left: 10px;
        top: 10px;
    }

    .ViewModeWrapper .Accounting:before {
        content: url('/img/icon_accounting.png');
        position: absolute;
        left: 10px;
        top: 11px;
    }

    .ViewModeWrapper .ViewModeItem.Selected .Driver:before {
        content: url('/img/icon_driver_white.png');
        position: absolute;
        left: 10px;
        top: 10px;
    }

    .ViewModeWrapper .ViewModeItem.Selected .Owner:before {
        content: url('/img/icon_owner_white.png');
        position: absolute;
        left: 10px;
        top: 10px;
    }

    .ViewModeWrapper .ViewModeItem.Selected .Accounting:before {
        content: url('/img/icon_accounting_white.png');
        position: absolute;
        left: 10px;
        top: 11px;
    }

/* FORM */
.Form {
    float: left;
    width: 100%;
    margin-bottom: 30px;
    clear: left;
}

    .Form.Col2 {
        width: 50%;
    }

    .Form .FormRow {
        float: left;
        width: 100%;
        clear: left;
    }

        .Form .FormRow.Half {
            float: left;
            width: 49%;
        }

    .Form .FormGroup {
        float: left;
        width: 100%;
    }

        .Form .FormGroup.Small {
            width: 100px;
            margin-right: 10px;
        }

        .Form .FormGroup.Large {
            width: calc(100% - 110px);
            margin-right: 0px;
        }

        .Form .FormGroup.Half {
            float: left;
            width: 50%;
            margin-right: 0px;
            clear: left;
        }

        .Form .FormGroup.Col2 {
            float: left;
            width: 49%;
            margin-right: 2%;
            margin-bottom: 10px;
        }

        .Form .FormGroup.Col3 {
            float: left;
            width: 32%;
            margin-right: 2%;
        }

            .Form .FormGroup.Col3:nth-child(3n) {
                margin-right: 0;
            }

        .Form .FormGroup.Col4 {
            float: left;
            width: 24.75%;
            margin-right: 1%;
        }

        .Form .FormGroup.Col2:nth-child(2n) {
            margin-right: 0;
        }

        .Form .FormGroup.Span2Col {
            float: left;
            width: 64%;
        }

            .Form .FormGroup.Span2Col.CustomCsvInfo {
                background-color: #efefef;
                padding: 20px 0 20px 20px;
            }

    .Form .FormRow.Max .FormGroup.Col2:nth-child(2n) {
        margin-right: 2%;
    }

    .Form .FormRow.Max .FormGroup.Col2.NoRightMargin {
        margin-right: 0;
    }

    .Form .OptionWrapper {
        float: right;
        width: 48%;
        clear: right;
        padding-bottom: 20px;
    }

        .Form .OptionWrapper.ChangePinCode {
            padding-bottom: 30px;
        }

        .Form .OptionWrapper.Max .TextWrapper {
            /*width: 100px !important;*/
        }

    .Form label {
        text-transform: uppercase;
        font-size: 0.8rem;
        float: left;
        clear: left;
        font-family: "CooperHewitt-SemiBold";
        padding-left: 8px;
    }

    .Form span.Text {
        float: left;
        clear: left;
        border: 1px solid #ddd;
        padding: 8px;
        border-radius: 3px;
        display: inline-block;
        width: 100%;
        background: #fff;
        margin-bottom: 10px;
        box-sizing: border-box;
    }

    .Form input[type=text] {
    }

    .Form .TextWrapper {
        float: left;
        clear: left;
        border: 1px solid #ddd;
        padding: 8px;
        border-radius: 3px;
        display: inline-block;
        width: 100%;
        background: #fff;
        margin-bottom: 10px;
        box-sizing: border-box;
        position: relative;
    }

        .Form .TextWrapper input[type=text], .Form .TextWrapper input[type=password] {
            float: left;
            width: 100%;
            box-sizing: border-box;
            border: none;
            background: none;
            font-family: "CooperHewitt-Medium",Arial,sans-serif;
            font-size: 1rem;
        }

        .Form .TextWrapper.Disabled:after {
            content: '\f023';
            font-family: FontAwesome5Light;
            font-size: 16px;
            position: absolute;
            right: 10px;
            top: 50%;
            margin-top: -10px;
        }

        .Form .TextWrapper.Disabled input[type=text] {
            float: left;
            padding-right: 20px;
        }


        .Form .TextWrapper.UserIcon {
            padding-left: 32px;
        }

            .Form .TextWrapper.UserIcon:before {
                content: '\f007';
                font-family: FontAwesome5Light;
                font-size: 16px;
                position: absolute;
                left: 10px;
                top: 50%;
                margin-top: -10px;
            }

        .Form .TextWrapper.KeyIcon {
            padding-left: 32px;
        }

            .Form .TextWrapper.KeyIcon:before {
                content: '\f084';
                font-family: FontAwesome5Light;
                font-size: 16px;
                position: absolute;
                left: 10px;
                top: 50%;
                margin-top: -10px;
            }

    .Form span:empty:before {
        content: '\200b';
    }

    .Form input[type=checkbox] {
        display: none;
    }

    .Form .CheckboxWrapper label {
        -webkit-touch-callout: none; /* iOS Safari */
        -webkit-user-select: none; /* Safari */
        -khtml-user-select: none; /* Konqueror HTML */
        -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
        user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
    }

    .Form input[type=checkbox] + label {
        padding-left: 24px;
        position: relative;
        margin-left: 2px;
        margin-bottom: 5px;
        color:#000;
    }

    /**tha 12.09.2023*/
    /*.Form .CarWash input[type=checkbox] + label { background-color:yellow; }*/
    .Highlight { background-color:yellow; }

    /**tha*/
    /*.Form input[type=checkbox] + label.Disabled.Hor { clear:none; margin-right:10px;}*/
    

        .Form input[type=checkbox] + label:not(.Disabled) {
            cursor: pointer;
        }

    .Form label.Disabled::before { left: 0; top: -1px; content: '\f0c8'; font-family: 'FontAwesome5Light'; font-size: 20px; margin-right: 5px; color:#ddd; /*float: left;*/ }
    .Form label.Disabled { color:#ddd;}

    .Form input[type=checkbox] + label::before { position: absolute; left: 0; top: -1px; content: '\f0c8'; font-family: 'FontAwesome5Light'; font-size: 20px; margin-right: 5px;color:#000; /*float: left;*/ }
    

    .Form input[type=checkbox]:checked + label::before {
        content: '\f14a';
        font-family: 'FontAwesome5Light';
    }

    .Form h5 {
        float: left;
        margin-top: 0px;
        margin-bottom: 10px;
        width: 100%;
    }

    .Form .ActionWrapper {
        clear: both;
        margin-top: 10px;
    }

.ActionIcon {
    background: none;
    text-decoration: none;
    border: 0px;
    margin-top: 0px;
    text-align: center;
    box-sizing: border-box;
    text-transform: uppercase;
    font-size: 1rem;
    border-radius: 3px;
    color: #d01e38;
    cursor: pointer;
    transition: all 200ms linear;
    margin-right: 20px;
}

    .ActionIcon:hover {
        text-decoration: none;
        color: #fff;
    }

    .ActionIcon:last-child {
        margin-right: 0;
    }

    .ActionIcon.First {
        margin-left: 0;
    }

.Form .DropDownListWrapper {
}

    .Form .DropDownListWrapper .CustomDropDownListOuterWrapper {
        float: left;
        clear: left;
        margin-bottom: 20px;
        padding-left: 8px;
        width: 100%;
    }

        .Form .DropDownListWrapper .CustomDropDownListOuterWrapper .CustomDropDownListInnerWrapper .Selected span {
            margin-left: 0;
        }

.Form .Button {
    margin-right: 20px;
}

    .Form .Button:last-child {
        margin-right: 0px;
    }

/* ACCOUNT */
.AccountWrapper {
    float: right;
    position: absolute;
    right: 150px;
    top: 42px;
}

    .AccountWrapper label {
        float: left;
        padding-top: 10px;
        padding-right: 10px;
    }

    .AccountWrapper .CustomDropDownListOuterWrapper {
        line-height: 20px !important;
    }

/* USER INFO */
.UserInfoWrapper {
    float: left;
    clear: right;
    position: relative;
    padding-top: 16px;
    margin-left: 10px;
    z-index: 11;
}

    .UserInfoWrapper label {
        float: left;
        padding-top: 7px;
        padding-right: 20px;
    }

    .UserInfoWrapper .UserInfoContent .User {
        float: right;
        cursor: pointer;
        white-space: nowrap;
        padding-left: 10px;
        
        text-overflow: ellipsis;
        transition-property: color;
        transition-duration: .3s;
    }

        .UserInfoWrapper .UserInfoContent .User:hover {
            color: #fff;
        }

        .UserInfoWrapper .UserInfoContent .User:before {
            float: left;
            content: '\f2bd';
            font-size: 24px;
            font-family: 'FontAwesome5Light';
            padding-right:5px;
        }

    /*.UserInfoWrapper .UserInfoContent .User:before { float: right; content: '\f107'; font-size: 32px; font-family: 'FontAwesome5'; padding-left: 5px; }*/
    .UserInfoWrapper .CustomerMenu {
        display: none;
        position: absolute;
        background: #fff;
        border: 1px solid #ccc;
        z-index: 99;
        left: -10px;
        top: 47px;
        color: #262626;
        text-transform: uppercase;
        border-radius: 3px;
        border-top-left-radius: 0;
        border-top-right-radius: 0;
    }

        .UserInfoWrapper .CustomerMenu.Selected {
            display: block;
        }

        .UserInfoWrapper .CustomerMenu li {
            float: right;
            clear: right;
            width: 100%;
            border: 0px;
            margin-left: 0px;
            box-sizing: border-box;
            padding-left: 0;
        }

            .UserInfoWrapper .CustomerMenu li span, .UserInfoWrapper .CustomerMenu li a {
                padding: 5px;
                cursor: pointer;
                display: block;
                width: 100%;
                color: #262626;
                box-sizing: border-box;
                padding-left: 20px;
                white-space: nowrap;
                padding-right: 20px;
                transition: background linear 200ms;
                text-decoration: none;
            }

                .UserInfoWrapper .CustomerMenu li span:hover, .UserInfoWrapper .CustomerMenu li a:hover {
                    background-color: #eee;
                }

        .UserInfoWrapper .CustomerMenu:after {
            content: '';
            width: 0;
            height: 0;
            border-left: 8px solid transparent;
            border-right: 8px solid transparent;
            border-bottom: 8px solid #fff;
            position: absolute;
            top: -8px;
            left: 23px;
        }

        .UserInfoWrapper .CustomerMenu:before {
            content: '';
            width: 0;
            height: 0;
            border-left: 9px solid transparent;
            border-right: 9px solid transparent;
            border-bottom: 9px solid #bbb;
            position: absolute;
            top: -9px;
            left: 22px;
        }


/* CATEGORY MENU */
.InnerCategoriesWrapper {
    color: #ccc;
}

    .InnerCategoriesWrapper nav {
    }

        .InnerCategoriesWrapper nav ul {
        }

            .InnerCategoriesWrapper nav ul li {
                float: left;
                padding: 15px 30px 11px 30px;
                text-transform: uppercase;
                font-weight: 400;
            }

/* LANGUAGE */
.LanguageWrapper {
    position: absolute;
    top: 30px;
    left: 1000px;
    /*left: 900px;*/
}

    .LanguageWrapper a.Selected {
        border-radius: 50%;
        background: #fff;
        display: inline-block;
        overflow: hidden;
        width: 24px;
        height: 24px;
        position: relative;
        cursor: pointer;
    }

    .LanguageWrapper img {
        position: absolute;
        top: -11px;
        left: -8px;
    }

    .LanguageWrapper select {
        display: none;
    }

/* FOOTER */
.OuterFooterWrapper .FooterItem {
    float: left;
    width: 33.3%;
    padding: 20px;
    box-sizing: border-box;
    color: #1f2833;
    line-height: 1.4rem;
}

    .OuterFooterWrapper .FooterItem a {
        color: #1f2833;
    }

    .OuterFooterWrapper .FooterItem:last-child {
        float: right;
    }

.Facebook {
    background-image: url(/img/spritemap.png);
    background-position: -134px -66px;
    width: 25px;
    height: 25px;
    text-decoration: none;
    display: block;
}

/* CUSTOM DROPDOWNLIST */
select.CustomDropDownList {
    display: none;
}

.CustomDropDownListOuterWrapper {
    float: left;
    width: 300px;
    padding: 5px;
    color: #2e2e34;
    padding-left: 10px;
    padding-right: 10px;
    font-size: 0.9rem;
    line-height: 25px;
    background: #fff;
    box-sizing: border-box;
    border: 1px solid #c6c6c6;
    position: relative;
    border-radius: 3px;
    margin-right: 0px;
}

    .CustomDropDownListOuterWrapper.Large {
        width: 500px;
    }
.CountryCodeWrapper .CustomDropDownListOuterWrapper {
    width: 100px;}
/*.CountryCodeWrapper .CustomDropDownListOuterWrapper {
    width: 100px;
    color: #2e2e34;
    padding-left: 0px;
    padding-right: -20px;
    font-size: 1rem;
    line-height: 15px;
    background: #fff;
    box-sizing: border-box;
    border: none;
    position: relative;
    border-radius: 3px;
    margin-right: 0px;
    font-family: "CooperHewitt-Medium",Arial,sans-serif;
}

.CountryCodeWrapper .CustomDropDownListInnerWrapper .Selected:before {
    position: absolute;
    width: 15px;
    top: 0;
    bottom: 0;
    right: 0px;
    text-align: center;
    color: #232323;
    padding-top: 5px;
    content: '\f107';
    font-size: 15px;
    font-family: 'FontAwesome5';
    padding-left: 0px;
    background-color: #fff;
    border-bottom-right-radius: 3px;
    border-top-right-radius: 7px;
}

.CountryCodeWrapper .CustomDropDownListInnerWrapper .Selected {
    float: left;
    width: 100%;
    cursor: pointer;
}
*/

.FormGroup.CountryCodeWrapper {
    display: grid;
    grid-template-columns: auto 1fr;
}
    .FormGroup.CountryCodeWrapper label {
        grid-column-start: 1;
        grid-column-end: 3;
    }
    .FormGroup.CountryCodeWrapper .CountryCodeWrapper {
        display: inline-block;
    }
.CustomDropDownListInnerWrapper {
}

    .CustomDropDownListInnerWrapper .Selected {
        float: left;
        width: 100%;
        cursor: pointer;
    }

        .CustomDropDownListInnerWrapper .Selected.SingelValue {
            cursor: default
        }

        .CustomDropDownListInnerWrapper .Selected:before {
            position: absolute;
            width: 30px;
            top: 0;
            bottom: 0;
            right: 0px;
            text-align: center;
            color: #232323;
            padding-top: 8px;
            content: '\f107';
            font-size: 20px;
            font-family: 'FontAwesome5';
            padding-left: 0px;
            background-color: #fff;
            border-bottom-right-radius: 3px;
            border-top-right-radius: 7px;
        }

        .CustomDropDownListInnerWrapper .Selected.SingelValue:before {
            content: '';
        }

        .CustomDropDownListInnerWrapper .Selected span {
            float: left;
            padding-top: 3px;
            margin-left: 5px;
            white-space: nowrap;
            width: calc(100% - 30px);
            overflow: hidden;
            text-overflow: ellipsis;
            margin-right: 0px;
        }

    .CustomDropDownListInnerWrapper .Items {
        position: absolute;
        z-index: 990;
        background: #fff;
        min-width: 100%;
        left: 0px;
        top: 45px;
        box-sizing: border-box;
        padding: 0px;
        border: 1px solid #ccc;
        display: none;
        border-radius: 3px;
    }

        .CustomDropDownListInnerWrapper .Items .ItemsContent {
            max-height: 300px;
            overflow: auto;
        }

        .CustomDropDownListInnerWrapper .Items.Active {
            display: block;
        }

        .CustomDropDownListInnerWrapper .Items .Item {
            float: left;
            width: 100%;
            text-align: left;
            padding: 10px;
            box-sizing: border-box;
            padding-top: 10px;
            padding-bottom: 6px;
            cursor: pointer;
            border-bottom: 1px solid #eee;
            padding-right: 20px;
        }

            .CustomDropDownListInnerWrapper .Items .Item.Selected {
                color: #d01e38;
                font-family: "CooperHewitt-Semibold";
                background: #eee;
            }

                .CustomDropDownListInnerWrapper .Items .Item.Selected:before {
                    display: none;
                }

            .CustomDropDownListInnerWrapper .Items .Item:hover {
                background: #eee;
            }

        .CustomDropDownListInnerWrapper .Items:after {
            content: '';
            width: 0;
            height: 0;
            border-left: 8px solid transparent;
            border-right: 8px solid transparent;
            border-bottom: 8px solid #fff;
            position: absolute;
            top: -8px;
            right: 6px;
        }

        .CustomDropDownListInnerWrapper .Items:before {
            content: '';
            width: 0;
            height: 0;
            border-left: 9px solid transparent;
            border-right: 9px solid transparent;
            border-bottom: 9px solid #bbb;
            position: absolute;
            top: -9px;
            right: 5px;
        }

/* Textbox */
.CustomTextbox {
    float: left;
    width: 100%;
    padding: 5px;
    color: #2e2e34;
    padding-left: 10px;
    padding-right: 10px;
    font-size: 0.9rem;
    line-height: 25px;
    background: #fff;
    box-sizing: border-box;
    border: 1px solid #c6c6c6;
    position: relative;
    border-radius: 3px;
    margin-right: 0px;
    margin-bottom: 20px;
}

/* BOX FRONTPAGE */
.BoxWrapper {
    float: left;
    width: 100%;
    margin-bottom: 40px;
}

    .BoxWrapper h2 {
        font-size: 1.4rem;
        font-weight: 400;
        border-bottom: 1px solid #d01e38;
        padding-bottom: 5px;
        margin-bottom: 10px;
        text-transform: uppercase;
    }

    .BoxWrapper .BoxItem {
        float: left;
        width: 500px;
        border: 1px solid #eee;
        height: 180px;
        margin-right: 60px;
        box-sizing: border-box;
        padding: 30px;
        padding-left: 100px;
        position: relative;
    }

        .BoxWrapper .BoxItem:last-child {
            margin-right: 0px;
        }

        .BoxWrapper .BoxItem.CardIcon:before {
            content: '\f09d';
            font-family: 'FontAwesome5Light';
            position: absolute;
            left: 30px;
            font-size: 40px;
        }

        .BoxWrapper .BoxItem.InvoiceIcon:before {
            content: '\f1ec';
            font-family: 'FontAwesome5Light';
            position: absolute;
            left: 30px;
            font-size: 40px;
        }

        .BoxWrapper .BoxItem.ContactIcon:before {
            content: '\f007';
            font-family: 'FontAwesome5Light';
            position: absolute;
            left: 30px;
            font-size: 40px;
        }

        .BoxWrapper .BoxItem.MapIcon:before {
            content: '\f279';
            font-family: 'FontAwesome5';
            position: absolute;
            left: 30px;
            font-size: 40px;
        }

        .BoxWrapper .BoxItem.GasPumpIcon:before {
            content: ' ';
            background-image: url('/img/icon_gas_pump.svg');
            background-size: 40px 40px;
            position: absolute;
            left: 30px;
            display: block;
            width: 40px;
            height: 40px;
        }

        .BoxWrapper .BoxItem.AccountIcon:before {
            content: '\f085';
            font-family: 'FontAwesome5';
            position: absolute;
            left: 30px;
            font-size: 40px;
        }

/* CAMPAIGN */
.CampaignWrapper {
    float: left;
    width: 100%;
    border: 1px solid #eee;
    box-sizing: border-box;
    margin-bottom: 40px;
    margin-top: 20px;
    height: 312px;
}

    .CampaignWrapper .ImageWrapper {
        float: left;
        width: 50%;
    }

        .CampaignWrapper .ImageWrapper img {
            max-width: 100%;
        }

    .CampaignWrapper .TextWrapper {
        float: left;
        width: 50%;
        box-sizing: border-box;
        padding: 50px;
    }

        .CampaignWrapper .TextWrapper h1 {
            font-size: 2rem;
            text-transform: uppercase;
            margin-bottom: 20px;
            border-bottom: 1px solid #d01e38;
            padding-bottom: 10px;
        }

/* ScrollToTop */
.ScrollToTopWrapper {
    position: fixed;
    height: 40px;
    bottom: 0px;
    right: 100px;
    z-index: 999;
    background: #d1202d;
    width: 180px;
    display: none;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
}

    .ScrollToTopWrapper .ScrollToTopContent {
        float: left;
        padding: 10px;
        font-size: 1rem;
        color: #fff;
        cursor: pointer;
        display: block;
        white-space: nowrap;
    }

        .ScrollToTopWrapper .ScrollToTopContent:before {
            content: '\f062';
            font-family: 'FontAwesome5Light';
            float: left;
            padding-right: 5px;
        }

/* TOOLTIP */
.IPBTooltip {
    position: absolute !important;
    z-index: 999;
    left: 0;
    top: 0;
    max-width: 300px;
    width: auto;
    font-weight: 400;
    line-height: 12px;
    white-space: nowrap;
    display: block;
    background: #fff !important;
    padding: 5px 8px 5px 8px;
    border-radius: 3px;
    font-size: 12px;
    border: 1px solid #ddd;
    color: #2e2e34;
    transition: opacity 200ms linear;
    opacity: 0;
}

    .IPBTooltip.Active {
        opacity: 1;
    }

    .IPBTooltip.Multiline {
        white-space: normal;
        line-height: 1rem;
        width: 300px;
    }

    .IPBTooltip::after {
        content: "";
        position: absolute;
        border-width: 5px;
        border-style: solid;
    }

    .IPBTooltip::before {
        content: "";
        position: absolute;
        border-width: 6px;
        border-style: solid;
    }

    .IPBTooltip.BOTTOM::before {
        margin-left: -6px;
        bottom: 100%;
        left: 50%;
        border-color: transparent transparent #ddd transparent;
    }

    .IPBTooltip.BOTTOM::after {
        margin-left: -5px;
        bottom: 100%;
        left: 50%;
        border-color: transparent transparent #ededed transparent;
    }

    .IPBTooltip.TOP::before {
        margin-left: -6px;
        top: 100%;
        left: 50%;
        border-color: #ddd transparent transparent transparent;
    }

    .IPBTooltip.TOP::after {
        margin-left: -5px;
        top: 100%;
        left: 50%;
        border-color: #ededed transparent transparent transparent;
    }

    .IPBTooltip.LEFT::before {
        margin-top: -6px;
        top: 50%;
        left: 100%;
        border-color: transparent transparent transparent #ddd;
    }

    .IPBTooltip.LEFT::after {
        margin-top: -5px;
        top: 50%;
        left: 100%;
        border-color: transparent transparent transparent #ededed;
    }

    .IPBTooltip.RIGHT::before {
        margin-top: -6px;
        top: 50%;
        right: 100%;
        border-color: transparent #ddd transparent transparent;
    }

    .IPBTooltip.RIGHT::after {
        margin-top: -5px;
        top: 50%;
        right: 100%;
        border-color: transparent #ededed transparent transparent;
    }

td.dxgv {
    overflow: visible !important;
}
/* GRID FIX */
table.dxgvTable_Moderno {
    overflow: visible !important;
    position: static !important;
}
/* GRID FIX */


/* FILTERWRAPPER */
.FilterWrapper {
    float: left;
    width: 100%;
    margin-bottom: 40px;
    background: #fefefe;
    padding: 20px;
    margin-left: -20px;
    border-top: 1px solid #f3f3f3;
    border-bottom: 1px solid #f3f3f3;
}

    .FilterWrapper h2 {
        border-bottom: 0;
        padding-bottom: 0px;
    }

    .FilterWrapper label {
        float: left;
        padding-top: 10px;
        margin-right: 20px;
        text-transform: uppercase;
    }

    .FilterWrapper .DateEditWrapper {
        float: left;
        margin-right: 40px;
    }

    .FilterWrapper .CustomDropDownListOuterWrapper {
        width: 110px;
        margin-right: 40px;
        margin-bottom: 20px;
    }

    .FilterWrapper .ButtonsWrapper {
        float: left;
    }

        .FilterWrapper .ButtonsWrapper .Button {
            float: left;
            margin-top: -1px;
            margin-right: 40px;
            margin-left: 0px;
        }

    .FilterWrapper .TextWrapper {
        border: 1px solid #ddd;
        padding: 8px;
        border-radius: 3px;
        display: inline-block;
        width: 200px;
        background: #fff;
        margin-bottom: 10px;
        box-sizing: border-box;
        float: left;
        margin-right: 20px;
    }

        .FilterWrapper .TextWrapper input[type=text]{
           
            width: 100%;
            box-sizing: border-box;
            border: none;
            background: none;
            font-family: "CooperHewitt-Medium",Arial,sans-serif;
            font-size: 1rem;
            
        }


.DateEditWrapper .dxeButtonEditSys.dxeButtonEdit_Moderno {
    background-color: #fff;
}

.DateEditWrapper .dxeEditArea_Moderno.dxeEditAreaSys {
    background-color: #fff;
    font-size: 1rem;
    font-family: "CooperHewitt-Medium",Arial,sans-serif;
    line-height: 1.2rem;
    height: 24px;
}
/* SUMMARY */
.SummaryWrapper {
    float: left;
    width: 100%;
    margin-bottom: 20px;
}

    .SummaryWrapper h2 {
        border-bottom: 1px solid #f3f3f3;
        padding-bottom: 5px;
    }

    .SummaryWrapper .SummaryCurrencyWrapper {
        float: left;
        width: 100%;
        background-color: #fafafa;
        padding: 10px;
        box-sizing: border-box;
        margin-bottom: 10px;
    }

        .SummaryWrapper .SummaryCurrencyWrapper:last-of-type {
            margin-bottom: 0;
        }

        .SummaryWrapper .SummaryCurrencyWrapper .CurrencyHeader {
            margin-bottom: 5px;
            text-transform: uppercase;
        }

            .SummaryWrapper .SummaryCurrencyWrapper .CurrencyHeader .value {
                font-family: "CooperHewitt-Semibold";
                position: relative;
            }

    .SummaryWrapper .SummaryItem {
        float: left;
        margin-bottom: 20px;
    }

        .SummaryWrapper .SummaryItem.Col3 {
            width: 33.33%;
        }

        .SummaryWrapper .SummaryItem label {
            display: block;
            text-transform: uppercase;
            color: #888;
            margin-bottom: 5px;
        }

        .SummaryWrapper .SummaryItem span {
            display: block;
            font-size: 1.4rem;
            font-family: "CooperHewitt-Semibold";
        }

    .SummaryWrapper .Button {
        float: right;
    }

/* GRID */
.GridWrapper {
    background: #fff;
}

    .GridWrapper h2 {
        margin-bottom: 0;
        border-bottom: 0;
        padding-bottom: 5px;
    }

.GridWrapper-CardTransactions {
    position: relative;
    float: left;
    width: 100%;
}

    .GridWrapper-CardTransactions .GridButtonRow {
        position: relative;
    top: 0px;
    left: 0px;
}

    .GridWrapper-CardTransactions .btnSaveGridLayout {
        position: absolute;
        top: 20px;
        left: 160px;
        padding: 7px 30px;
    }
    .GridWrapper-CardTransactions .btnClearFilters {
        position: absolute;
        top: 20px;
        left: 352px;
        padding: 7px 30px;
    }

.GridLess {
    font-size: 0.9rem;
}

.Grid {
    width: 100%;
    font-size: 1rem;
}

    .Grid .dxgvGroupPanel_Moderno {
        border-top: 1px Solid #f3f3f3;
    }

        .Grid .dxgvGroupPanel_Moderno table table {
            width: 80px !important;
        }

    .Grid .dxgvHeader_Moderno {
        font-weight: 600 !important;
        text-transform: uppercase;
        font-size: 0.8rem;
    }

    .Grid td.dxgv {
        vertical-align: middle !important;
    }

    .Grid a.Icon span:not(.IPBTooltip) {
        display: none;
    }
    /* Remove blank space */
    .Grid .NoWrap {
        white-space: nowrap;
        float: left;
        width: 50px;
    }

    .Grid .AdaptivityFix td {
        border-bottom: 1px solid #d1d1d1 !important;
    }

    .Grid .dxgvAIC {
        text-align: right;
    }

    .Grid .GridHeaderDownload table {
        display: none;
    }
    /*.Grid table td:nth-child(1) {}
.Grid table td:nth-child(2) {width:100px;}
.Grid table td:nth-child(3) {width:100px;}
.Grid .DueDate {width:100px !important;}
.Grid table td:nth-child(8) {width:90px;}*/

    /*.Grid.Invoice tr.dxgvArm td:nth-child(1) { }

    .Grid.Invoice tr.dxgvArm td:nth-child(8) { width: 70px !important; }*/

    .Grid.OpenInvoice td.Actions {
        width: 60px !important;
    }

    .Grid.OpenInvoice tr.dxgvArm td:nth-child(5) {
        width: 120px !important;
    }
    /*.Grid.OpenInvoice tr.dxgvArm td:nth-child(10) {width:50px !important;  }*/
    /*.Grid.Kort .NoWrap a:nth-child(9) { margin-right: 0px; }*/
    /*.Grid.Kort tr.dxgvArm td:nth-child(7) {width:120px !important; }*/


    .Grid.Kort td.Actions {
        width: 40px !important;
    }

    .Grid.Kort .NoWrap {
        width: 25px;
    }

        .Grid.Kort .NoWrap a {
            margin-right: 0px;
        }

    .Grid.Kort.Bombrikker .NoWrap {
        width: 60px;
    }

        .Grid.Kort.Bombrikker .NoWrap .DeleteIcon {
            margin-left: 10px;
        }

    .Grid.Users tr.dxgvArm td:nth-child(4) {
        width: 110px;
    }

    .Grid.Users .NoWrap {
        width: 80px !important;
    }

    .Grid.Users .EditIcon {
        margin-right: 20px;
        margin-left: 10px;
    }

    .Grid.OpenInvoice .Actions .dx-wrap.dx-ellipsis {
        display: none !important
    }

    .Grid.OpenInvoice .NoWrap {
        width: 25px;
    }

    .Grid.Invoice .NoWrap {
        width: 75px !important;
    }

    .Grid.Reports {
        margin-bottom: 20px;
        float: left;
        width: 100%;
    }

    .Grid.ReportUsers {
        margin-top: 20px;
        float: left;
        width: 100%;
    }

        .Grid.ReportUsers td.Actions {
            width: 100px !important;
        }

        .Grid.ReportUsers .NoWrap {
            width: 90px !important;
        }

        .Grid.ReportUsers .NoWrap {
            width: 90px;
        }

            .Grid.ReportUsers .NoWrap a {
            }

        .Grid.ReportUsers .EditIcon {
            margin-right: 20px;
            margin-left: 10px;
        }

        .Grid.ReportUsers .UpdateIcon {
            margin-right: 20px;
            margin-left: 17px;
        }

    .Grid .InfoColumn {
        width: 50px
    }

    .Grid .dxgvInlineEditRow_Moderno td {
        font-size: 1rem;
    }

    .Grid .dxgvEmptyDataRow_Moderno td {
        border-bottom: 1px solid #ddd !important;
    }

.dxbDisabled_Office2010Silver {
    color: #bbb !important;
}

    .dxbDisabled_Office2010Silver:hover {
        color: #bbb !important;
    }

/* MIN SIDE */
.UserDetailInfoWrapper {
    float: left;
    width: 100%;
}

.UserChangePasswordWrapper {
    float: left;
    width: 100%;
}

/* KORT */
.CardDetailWrapper {
    background: #fefefe;
    /*border-top: 1px solid #f3f3f3;*/
    padding: 20px;
    width: 100%;
    padding-bottom: 0;
    margin-bottom: 20px;
    border-bottom: 1px solid #f3f3f3;
    float: left;
    margin-left: -20px;
}

/* BESTILLING */
.OrderCardWrapper {
    background: #fefefe;
    border-top: 1px solid #f3f3f3;
    padding: 20px;
    width: 100%;
    padding-bottom: 0;
    margin-bottom: 20px;
    border-bottom: 1px solid #f3f3f3;
    float: left;
    margin-left: -20px;
}

/* BRUKERE */
.NewUserWrapper {
    float: left;
    width: 100%;
    margin-bottom: 20px;
}

.UserDetailsWrapper {
    background: #fefefe;
    border-top: 1px solid #f3f3f3;
    padding: 20px;
    width: 100%;
    padding-bottom: 0;
    margin-bottom: 20px;
    border-bottom: 1px solid #f3f3f3;
    float: left;
    margin-left: -20px;
}

/* LOGIN */
.LoginWrapper {
    float: left;
    width: 49%;
    margin-right: 2%;
}

.LoginInfoWrapper {
    float: left;
    width: 49%;
}

/* CUSTOM POPUP */
.CustomPopupOuterWrapper {
    position: fixed;
    z-index: 9999;
    opacity: 0;
    left: 0px;
    top: 0px;
    bottom: 0px;
    right: 0px;
    background-color: rgba(52,73,94,0.5);
    text-align: center;
    transition: opacity 500ms ease-in-out;
}

.CustomPopupInnerWrapper {
    min-width: 200px;
    max-width: 400px;
    display: inline-block;
    box-shadow: 0px 2px 5px rgba(0,0,0,0.5);
    border: 10px solid #34698e;
    background-color: #fff;
    padding: 20px;
    border-radius: 10px;
    position: relative;
    padding-bottom: 10px;
}

div.userMessage {
    text-align: left;
}

div.userMessageColored {
    color: red;
}

.CustomPopupOuterWrapper.Active {
    opacity: 1;
}

.CustomPopupOuterWrapper .CustomPopupContent.Hidden {
    display: none;
}

.CustomPopupOuterWrapper .CustomPopupContent {
    display: inline;
}

    .CustomPopupOuterWrapper .CustomPopupContent h1 {
        margin-top: 0px;
        border-bottom: solid 1px #444;
        padding-bottom: 20px;
        font-size: 1.4rem;
        font-weight: bold;
        padding-left: 50px;
        text-align: left;
    }

    .CustomPopupOuterWrapper .CustomPopupContent .Form {
        text-align: left;
    }

    .CustomPopupOuterWrapper .CustomPopupContent p {
        text-align: left;
    }

        .CustomPopupOuterWrapper .CustomPopupContent p b {
            font-weight: 700;
        }

    .CustomPopupOuterWrapper .CustomPopupContent .Button {
        float: left;
        margin-top: 0px;
        width: 100%;
        margin-bottom: 10px;
    }

        .CustomPopupOuterWrapper .CustomPopupContent .Button.Disabled {
            color: #aaa;
            pointer-events: none;
        }

    .CustomPopupOuterWrapper .CustomPopupContent .CloseButton {
        float: left;
        margin-top: 0px;
        width: 100%;
    }

.CustomPopupContent:before {
    font-family: FontAwesome5;
    position: absolute;
    left: 20px;
    top: 25px;
    padding-right: 6px;
    font-size: 48px;
}

.CustomPopupContent.SUCCESS:before {
    content: '\f058';
    color: #3c763d;
}

.CustomPopupContent.ERROR:before {
    content: '\f056';
    color: #a94442;
}

.CustomPopupContent.INFO:before {
    content: '\f05a';
    color: #31708f;
}

.CustomPopupContent.WARNING:before {
    content: '\f06a';
    color: #8a6d3b;
}

.CustomPopupContent .CallbackMessageWrapper {
    float: left;
    width: 100%;
}

/* ADMIN LINK */
.AdminLinkWrapper {
    position: absolute;
    right: 150px;
    top: 10px;
}

    .AdminLinkWrapper a {
        text-decoration: none;
        text-transform: uppercase;
        color: #2e2e34;
        transition-property: color;
        transition-duration: .3s;
        font-family: "CooperHewitt-Bold";
    }

        .AdminLinkWrapper a:hover {
            color: #acacb5;
        }

        .AdminLinkWrapper a:before {
            content: '\f33b';
            font-family: FontAwesome5Light;
            font-size: 24px;
            float: right;
            padding-left: 6px;
        }

/* IFRAME YOUTUBE */
.FrameWrapper {
    float: left;
    width: 50%;
    text-align: center;
}

    .FrameWrapper .iFrameYoutube {
        width: 560px;
        height: 315px;
        width: 790px;
        height: 444px;
    }

.FrontPageWrapper {
    float: left;
    width: 50%;
    padding-right: 40px;
    box-sizing: border-box;
}
.FrontPageWrapperFull { float: left; width: 100%; padding-right: 40px; box-sizing: border-box;margin-top:40px; /*position:absolute;top:95px;*/ }



    .FrontPageWrapper ul, .InfoPageWrapper ul {
        padding-left: 40px;
        font-size: 1.2rem;
    }

        .FrontPageWrapper ul li {
            float: left;
            width: 100%;
            position: relative;
            margin-bottom: 20px;
        }

            .FrontPageWrapper ul li:before, .InfoPageWrapper ul li:before {
                font-family: FontAwesome5Light;
                content: '\f058';
                font-size: 1.4em;
                position: absolute;
                margin-left: -40px;
            }

.InfoPageWrapper h3 {
    margin-top: 40px;
    border-bottom: none;
}

.InfoPageWrapper h4 {
    margin-top: 20px;
    font-family: "CooperHewitt-Semibold";
    font-size: 1.0rem;
}

.InfoPageWrapper b {
    font-family: "CooperHewitt-Semibold";
    /*text-transform: uppercase;*/
}

.InfoPageWrapper ul li {
    width: 100%;
    margin-bottom: 15px;
    font-size: 1rem;
}

.AddNewSubscription {
    float: left;
    width: 100%;
    margin-bottom: 0px;
    background: #fefefe;
    padding: 20px;
    margin-left: -20px;
    border-top: 1px solid #f3f3f3;
    border-bottom: 1px solid #f3f3f3;
}

.AddNewWrapper {
    float: left;
    width: 100%;
    margin-bottom: 20px;
}

.AddNewIcon {
    position: relative;
    float: left;
    text-decoration: none !important;
    margin-right: 20px !important;
    padding-left: 40px !important;
}

    .AddNewIcon:hover {
    }

    .AddNewIcon:before {
        content: '\f040';
        font-family: FontAwesome5Light;
        font-size: 24px;
        position: absolute;
        left: 10px;
    }

.pincode-important-notice {
    border-left: 5px solid #d1202d;
    padding-left: 10px;
}

    .pincode-important-notice .pincode-important-notice-label {
        font-family: "CooperHewitt-Semibold";
    }

.CustomCsvInfo {
    width: calc(100% - 40px) !important;
    color: #343a40;
    background-color: #ffe28a;
    padding: 10px;
    display: block;
    padding-left: 40px;
    position: relative;
    -webkit-animation: IpbBlink 700ms 2 alternate; /* Safari 4+ */
    -moz-animation: IpbBlink 700ms 2 alternate; /* Fx 5+ */
    -o-animation: IpbBlink 700ms 2 alternate; /* Opera 12+ */
    animation: IpbBlink 700ms 2 alternate;
}

    .CustomCsvInfo:before {
        content: '\f06a';
        font-family: 'FontAwesome5';
        position: absolute;
        left: 10px;
        top: 50%;
        margin-top: -12px;
        font-size: 24px;
        line-height: 24px;
        color: #343a40;
    }

@keyframes IpbBlink {
    to {
        background-color: #faa21b;
    }
}

.fake-password-input {
    -webkit-text-security: disc;
}

.MassUpdateButtonPanel {
    margin-top: 20px;
    margin-bottom: 20px;
}

    .MassUpdateButtonPanel input {
        margin-right: 20px;
    }


dl.confirmInfo {
    display: inline-block;
    width: 100%;
}

    dl.confirmInfo dt {
        width: 45%;
        clear: left;
        float: left;
        text-align: left;
    }

    dl.confirmInfo dd {
        width: 45%;
        float: left;
        text-align: left;
    }

table.infoprices {
    width: 60%;
    margin-bottom: 30px;
    
}

    table.infoprices tr.header td {
        background-color: #ddd;
    }

    table.infoprices td {
        padding: 5px;
        border: solid black 2px;
    }
    table.infoprices td.noborder {
        
        border: none;
    }

        table.infoprices td p {
            margin: 0;
            font-size: 0.8rem;
        }

        table.infoprices td.right {
            width: 10%;
            text-align: right;
        }

.cardBlock {
    display: flex;
    gap: 30px;
    align-items: flex-start;
}

    .cardBlock .customerList {
        display: flex;
        gap: 10px;
        flex-direction: column;
    }
/*  .cardBlock .kjedeSperreItem {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 30px;
        flex-direction: column;
    }*/
.cardBlock label {
    white-space: nowrap;
}
.Form .kjedeSperreList label {
    white-space: nowrap;
}

.kjedeSperreList {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 20px;
    align-items: center;
}

.KundeCheckboxSperrevalg table.kunder tr {
 /*   display: grid;
    grid-template-columns: 1fr 1fr 1fr;*/
}

.KundeCheckboxSperrevalg table.kunder td {
    width: 140px;
    font-size: 12px;
    font-family: "CooperHewitt-SemiBold";
    text-align: center;
    white-space: nowrap;
}
.smaller {
    
    text-transform: uppercase
}
.smaller td {
    
    padding-right:10px;
}


.Form .KundeCheckbox input[type=checkbox] + label {
    margin-bottom: 2px;
    margin-top: 2px;
}


.StoreMulitpleCustomers {
    border-bottom: 1px solid red;
}

.OneColumn {
    float: left;
    clear: left;
    display: flex;
    flex-direction: column;
    width: 24%;
}

    .OneColumn > * {
        width: 100%;
        float: left;
        margin-right: 2%;
        margin-bottom: 5px;
    }

.FullColumn label.Mandatory:after {
    content: '\f06a';
    font-family: 'FontAwesome5';
    position: absolute;
    color: #343a40;
    padding-left: 5px;
}

.miljoGrid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    float: left;
    gap: 5px;
    justify-items: center;
    /*align-items: center;*/
}

.co2Avtrykk {
    /* grid-column: 1 / 3;*/
}

.kvantumliter {
    /* justify-content: center;*/
}

.EstimertInfo {
    grid-column: 1 / 3;
    font-style: italic;
}

.productComment {
    padding-top: 10px;
    width: 90%;
}

.FilterWrapper.miljo {
    border-top: none;
    border-bottom: none;
    margin-bottom: 0px;
    padding-top: 0px;
}

    .FilterWrapper.miljo p {
        text-transform: uppercase;
    }

    .FilterWrapper.miljo .filterelements {
    }
/*Listepriser*/
.graph {
    padding-bottom: 5px;
}

.stacked {
    display: flex;
    flex-direction: column;
}
.InvoiceHeader {
    display: flex;
    flex-direction: row;
    float: left;
    justify-content: space-between;
    width: 100%;
}
.cardHeader {
    display: flex;
    justify-content: space-between;
}
.cardHeader img {
    height:32px;}
.left {
    clear: both;
}
.timerow {
    /*display: flex;*/
    clear: both;
}
.CustomDropDownListOuterWrapper.ddlTimeTo, .CustomDropDownListOuterWrapper.ddlTimeFrom {
    /*border: 1px solid red;*/
    margin-top:5px;
    margin-right: 0px;
    float:right;
}

.TilpassStyleMarginBottom { padding-bottom: 20px;}

/*thomas carwashclasses - info txt*/
.cmedium { font-family: 'CooperHewitt-Medium',Arial,sans-serif; color: #4A4A4A; font-size: 19.2px; margin-bottom: 40px; line-height: 1.8rem; width: 1284px; }
.cbook { font-family: 'CooperHewitt-Book',Arial,sans-serif; color: #4A4A4A; font-size: 16px; margin-bottom: 40px; width: 1284px; line-height: 1.8rem;clear:both; }
/*.csemibold_title { font-family: 'CooperHewitt-SemiBold',Arial,sans-serif; color: #4A4A4A; margin-bottom: 20px; margin-top: 80px; font-size: 25.6px; float: left; clear: both; }*/
.csemibold_title { font-family: 'CooperHewitt-SemiBold',Arial,sans-serif; color: #4A4A4A; margin-bottom: 40px; margin-top: 60px; font-size: 25.6px; float: left; clear: both; }
.csemibold_title_nomargin { font-family: 'CooperHewitt-SemiBold',Arial,sans-serif; color: #4A4A4A; margin-bottom: 0px; margin-top: 40px; font-size: 25.6px; float: left; clear: both; }
.csemibold_txt { font-family: 'CooperHewitt-SemiBold',Arial,sans-serif; color: #4A4A4A; margin-top: 40px;   font-size: 19.2px; float: left; clear: both; }
.csemibold_txt_nomargin { font-family: 'CooperHewitt-SemiBold',Arial,sans-serif; color: #4A4A4A; margin-top: 0px; font-size: 19.2px; float: left; clear: both; }
.dbutton { border: 1px solid #E5E5E5; width: 295px; height: 27px; background: #FAFAFA 0% 0% no-repeat padding-box; border-radius: 3px; opacity: 1; text-align: center; margin-top: 14px; padding-top: 7px; float: left; margin-right: 10px;font-size:14px;}
    .dbutton a { text-decoration: none; }
.dbutton_large { border: 1px solid #E5E5E5; width: 350px; height: 27px; background: #FAFAFA 0% 0% no-repeat padding-box; border-radius: 3px; opacity: 1; text-align: center; margin-top: 14px; padding-top: 7px; float: left; margin-right: 10px; font-size: 14px; }
    .dbutton_large a { text-decoration: none; }
.images { clear: both; float: left; width: 1350px; }
.bilder { width: 25%; float: left; padding: 0; padding-bottom: 20px; box-sizing: border-box; padding-right: 10px; }
.bilder2 { box-sizing: border-box;border: 1px solid #4A4A4A; border-radius: 20px; opacity: 1; float: left; margin-right: 28px; margin-bottom: 40px; }

.CarWashOuterwrapper {
    max-width: 500px;
}

.CarWashOuterwrapper p { 
    text-align:center !important;
}

table.cardListTable {
    border: 1px solid rgb(221, 221, 221);
    margin-bottom: 20px;
    border-collapse: collapse;
    width:100%;
}

    table.cardListTable td {
        padding: 10px;
        border: 1px solid rgb(221, 221, 221);
    }

    table.cardListTable td.expired {
        color: firebrick;
        text-align: center;
    }

        table.cardListTable td.notexpired {
            color: forestgreen;
            text-align: center;
        }

div.ConsentPanel 
{
    margin: -20px 0 20px 0;
}
}

.pagerInfo {
    display: flex;
    gap: 30px;
    align-items: baseline;
    color: #666;
    font-size: 0.9rem;
}


    .pagerInfo .custom-pager {
        margin-top: 10px;
        display: flex;
        gap: 6px;
        align-items: center;
    }

        .pagerInfo .custom-pager a {
            text-decoration: none;
            cursor: pointer;
            color: #666;
        }

            .pagerInfo .custom-pager a.disabled, .pagerInfo .custom-pager a.disabled:hover {
                cursor: default;
                color: #ccc;
            }

            .pagerInfo .custom-pager a:hover {
                color: #000;
            }


        .pagerInfo .custom-pager .pager-link {
            padding: 4px 8px;
            border: 1px solid #ccc;
            text-decoration: none;
            background: #f9f9f9;
            cursor: pointer;
        }

            .pagerInfo .custom-pager .pager-link:hover {
                background: #e0e0e0;
            }

            .pagerInfo .custom-pager .pager-link.active {
                font-weight: bold;
                background: #007acc;
                color: white;
                border-color: #007acc;
            }

.FormGroup.Col20Percent
{
    width: 15%;
    margin-right: 5px;
}

.Button.SearchBtn {
    margin-top : 22px;
    margin-right: 2px;
}