﻿@font-face {
    font-family: EmbeddedSegoeUI;
    src: url('./fonts/segoeuil.eot');
    src: url('./fonts/segoeuil.ttf');
}

body {
    background: none repeat scroll 0 0 #FFFFFF;
    font-family: "Segoe UI Light",EmbeddedSegoeUI,Tahoma,Arial;
    font-size: 16px;
    font-weight: normal;
    line-height: 1.2em;
    width: 100%;
    color: #4A5866;
}

.error_dark {
    display: none;
}

.Error {
    background-color: #F8E9E9;
}

.Notifi {
    background-color: #e6ffe6;
}

.Error span {
    display: block;
    padding: 8px;
    padding-left: 12px;
    color: #B80000;
    font-weight: bold;
}

.Notifi span {
    display: block;
    padding: 8px;
    padding-left: 12px;
    color: #008000;
    font-weight: bold;
}

    .Notifi span i,
    .Error span i {
        margin-right: 10px;
        font-size: 20px;
    }

a {
    color: #FFFFFF;
    text-decoration: none;
}

body, html {
    margin: 0;
    padding: 0;
    height: 100%;
}

/* rob: dit is uitgeschakeld voor ul, ol, li omdat de inspringing anders niet klopt. */
body, div, dl, dt, dd, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td {
    margin: 0;
    padding: 0;
}

#ContainerMain {
    max-width: 1000px;
    min-width: 200px;
    height: 100%;
    margin: 0 auto;
    position: relative;
}

    #ContainerMain #Header, #ContainerMain #SubHeader, #ContainerMain #Content {
        float: left;
        width: 100%;
    }

    #ContainerMain #Header {
        margin-top: 20px;
    }

    #ContainerMain #SubHeader {
        margin-top: 4px;
    }

        #ContainerMain #SubHeader .Block {
            height: 20px !important;
            min-height: 20px !important;
        }

    #ContainerMain #Content {
    }


#LoginPage #ContainerMain #Header .BannerTopLeft {
    height: 100px;
    background-image: url('../images/MijnLCS.png');
    background-color: #FFFFFF !important;
    background-repeat: no-repeat;
    background-position: left center;
    cursor: pointer;
}


#ContainerMain .Account, #ContainerMain .GeneralButtons {
    color: #575757;
    font-size: 1em;
}

#ContainerMain .GeneralButtons {
    float: right;
}

    #ContainerMain .GeneralButtons div {
        float: left;
    }

        #ContainerMain .GeneralButtons div a {
            color: #575757;
            text-decoration: none;
            margin-right: 10px;
        }

            #ContainerMain .GeneralButtons div a span {
                margin-left: 4px;
            }


/*
#ContainerMain #Header .BannerTopLeft div
{
	display: none
}
*/

.Block {
    margin-right: 10px;
    margin-bottom: 10px;
    float: left;
    min-height: 120px;
    color: #FFFFFF;
}

    .Block.OneThird {
        width: 323px;
    }

    .Block.TwoThird {
        width: 656px;
    }

    .Block.OneSixt {
        width: 156px;
    }

    .Block.Full {
        width: 990px;
    }

    .Block .Content {
        padding-top: 10px;
        padding-left: 10px;
        padding-right: 10px;
        line-height: 18px;
    }

        .Block .Content .SubContent {
            margin-top: 12px;
            margin-bottom: 12px;
            padding: 8px;
            line-height: 18px;
        }

        .Block .Content table {
            margin-bottom: 10px;
            width: 100%;
        }

    .Block.Action .Content table {
        display: inline;
    }

    .Block .Content table table td {
        padding: 4px;
    }

    .Block .IconWrapper {
        display: none;
    }

    .Block.Selected .IconWrapper {
        display: block;
        float: right;
        margin-top: -28px;
        margin-right: 12px;
        opacity: 0.8;
    }

        .Block.Selected .IconWrapper i {
            font-size: 4em;
        }

    .Block .Content .RowHeader, .Block .Content .Row {
        padding-bottom: 10px;
    }

    .Block .Content .RowCount {
        vertical-align: top;
        width: 20px;
    }

        /* dit is de bullet */
        .Block .Content .RowCount span {
            border-radius: 50%;
            padding: 4px;
            display: block;
            text-align: center;
            font-weight: bold;
            line-height: 16px;
            font-size: 1.1em;
            background-color: #F5F401;
            color: #808000;
            margin-right: 5px;
            width: 20px;
            height: 20px;
        }

    .Block .Content .RowHeader {
        font-weight: bold;
    }

    .Block .textbox {
        /*padding: 2px;*/
    }

.MinHeight {
    min-height: 120px;
}

.NoMinHeight {
    min-height: inherit !important;
}


.Column.OneThird {
    width: 333px;
}

.Column.OneSixt {
    width: 156px;
}

.Column.TwoThird {
    width: 666px;
}

.Column.Full {
    width: 1000px;
}

.FloatLeft {
    float: left;
}

.FullWidth {
    width: 100% !important;
}

.NoFullWidth {
    width: Auto !important;
}

.NoRightMargin {
    margin-right: 0px !important;
}


.Button {
    cursor: pointer;
    position: relative;
    transition: all 0.3s ease-out 0s;
}

    .Button.Block.OneSixt {
        width: 140px;
        line-height: 1.25em;
    }

        .Button.Block.OneSixt.LargeButton {
            width: 156px;
        }

    .Button:hover {
        opacity: 0.8;
    }

    .Button.NoPointer {
        cursor: default !important;
    }

        .Button.NoPointer:hover {
            opacity: 1;
        }

    .Button .Header, .Block .Header {
        padding: 10px;
        font-size: 1.2em;
    }

    .Button .Image {
        width: 100%;
        text-align: center;
        margin-top: 30px;
    }

        .Button .Image img {
            width: 50px;
            opacity: 0.9;
        }

    .Button .NoImage {
        margin-top: 20px;
        width: 100%;
        height: 4.2em;
    }

    .Button .Icon {
        /*position: absolute;*/
        font-size: 4.2em;
        width: 100%;
        text-align: center;
        margin-top: 20px;
    }

    .Button .Count {
        float: right;
        margin-top: 5px;
        margin-right: 5px;
    }

        .Button .Count span {
            padding: 4px;
            display: block;
            text-align: center;
            font-weight: bold;
            line-height: 20px;
            padding-left: 8px;
            padding-right: 8px;
            font-size: 18px;
        }


    .Button .Text {
        /*position: absolute;*/
        bottom: 0px;
        width: 100%;
        text-align: center;
        margin-bottom: 14px;
        font-size: 0.9em;
        font-weight: bold;
    }

/********* Active *********/

.Active {
    background-color: #78BA00;
}

    .Active .Header {
        background-color: #4B7500;
    }

    .Active .Even, .Active.Even {
    }

    .Active .Odd, .Active.Odd {
        background-color: #619600;
    }

/********* Blue *********/

.Action {
    background-color: #2572EB;
}

    .Action .Header {
        background-color: #174793;
    }

    .Action .Even, .Action.Even {
    }

    .Action .Odd, .Action.Odd {
        /*background-color: #2166D3*/
        background-color: #1855C3;
    }



.Block.Action.List {
    margin-bottom: 0.2em;
    min-height: 0px;
}

    .Block.Action.List .Header {
        padding: 0.1em;
    }

    .Block.Action.List .Content {
        padding: 0.1em;
    }

.Block.Information.List {
    margin-bottom: 0.2em;
    min-height: 0px;
}

    .Block.Information.List .Header {
        padding: 0.1em;
    }

    .Block.Information.List .Content {
        padding: 0.1em;
    }

/********* Form *********/

.Form {
    background-color: #ED2E25;
}

    .Form .Header {
        background-color: #A01D0B;
    }

    .Form .Even, .Form.Even, .Form .grid-table .row_even {
        background-color: #CE250E;
    }

    .Form .Odd, .Form.Odd, .Form .grid-table .row_odd {
        /*background-color: #E52910;*/
        /*background-color: #D52910;*/
    }

    .Form .formrow_header, .Form .grid-table th {
        background-color: #C2230E !important;
    }

    .Form .Content {
        line-height: 2em;
    }

/********* Grid *********/

.Grid {
    background-color: #2572EB;
}

    .Grid .Header {
        background-color: #174793;
    }

    .Grid .grid-table {
        border-spacing: 0em;
        border-collapse: collapse;
    }

        .Grid .grid-table th {
            padding: 0.5em;
        }

        .Grid .grid-table td {
            padding-left: 0.5em;
            padding-top: 0.2em;
            padding-bottom: 0.2em;
        }

        .Grid .Table .Header, .Grid .grid-table th {
            background-color: #1C56B3;
        }

        .Grid .Odd, .Grid.Odd, .Grid .grid-table .row_odd {
            /*background-color: #2166D3;*/
        }

        .Grid .Even, .Grid.Even, .Grid .grid-table .row_even {
            background-color: #1E5CBD;
        }

        .Grid .grid-table i.fa, .Grid .grid-table i.Pictos {
            color: #D0D0D0;
        }



.text-table {
    border-spacing: 0px;
    border-collapse: collapse;
}

    .text-table td {
        vertical-align: top;
        padding-left: 0.5em;
    }

        .text-table td:first-child {
            padding-left: 0em;
        }

/********* Explanation *********/

.Explanation {
    background-color: #78BA00;
    color: #FFFFFF;
}

    .Explanation .Header {
        background-color: #4B7500;
        color: #F0F0F0;
    }

    .Explanation .Even {
        background-color: #619600;
    }

    .Explanation .Odd {
        background-color: #6CA700;
    }

/********* Notification *********/

.Notification {
    background-color: #78BA00;
    color: #000000;
}

    .Notification .Header {
        background-color: #4B7500;
        color: #F0F0F0;
    }

    .Notification .Even {
        background-color: #619600;
    }

    .Notification .Odd {
        background-color: #6CA700;
    }


/********* Approve/ cancel requests *******/
.Accepted {
    background-color: #619600;
}

    .Accepted .Header {
        background-color: #4B7500;
    }

    .Accepted .Odd {
        background-color: #619600;
    }

    .Accepted .Even {
        background-color: #6CA700;
    }

.Canceled {
    background-color: #BB1D48;
}

    .Canceled .Header {
        background-color: #8B0D38;
    }

.Canceled {
    background-color: #BB1D48;
}

    .Canceled .Header {
        background-color: #8B0D38;
    }

/********* LargeButton *********/

.SmallButton .icon {
    height: 16px;
    width: 16px;
    /*font-size:16px;*/
}

.MediumButton.Wide {
    height: 50px;
    width: 50px;
}

.LargeButton {
    background-color: #FFBA01;
}

    .LargeButton.Ok {
        color: #189A00;
    }

    .LargeButton.NotOk {
        color: #BB1D28;
    }

    .LargeButton.Inactive {
        background-color: #806A51;
    }

    .LargeButton .Header {
        background-color: #9A7101;
    }

    .LargeButton .Even {
    }

    .LargeButton .Odd {
        background-color: #C69101;
    }

    .LargeButton.Disabled {
        /*background-color: #BA8901;*/
        background-color: lightgray;
        cursor: default;
        opacity: 1.0;
    }

    .LargeButton.Wide {
        width: 320px;
    }
/********* Information *********/

.Information {
    background-color: #78BA00;
    color: #FFFFFF;
}

    .Information .StickOut {
        color: #000000;
    }

    .Information .Header {
        background-color: #4B7500;
        color: #F0F0F0;
    }

    .Information .Even {
        background-color: #619600;
    }

    .Information .Odd {
        /*background-color: #6CA700;*/
    }


.Limited {
    max-height: 150px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.Inactive {
    background-color: #BB1D48;
}

    .Inactive .Header {
        background-color: #8B0D38;
    }

.Column {
    float: left;
}

.AmountWrapper {
    /*position: relative;
	height: 70px;*/
    white-space: nowrap;
}

.AmountEuro {
    /*position: absolute;*/
    display: inline-block;
    font-size: 4.0em;
    vertical-align: middle;
    opacity: 0.15;
    margin-left: 12px;
    margin-top: -5px;
    line-height: 100%;
}

    .AmountEuro .fa {
        margin-left: 0.25em;
        font-size: 1.2em;
    }

.AmountNumber {
    /*position: absolute;*/
    display: inline-block;
    letter-spacing: 2px;
    font-weight: bold;
    font-size: 2.8em;
    margin-left: 0.2em;
    padding-top: 6px;
    line-height: 100%;
}

    .AmountNumber .Pending {
        display: inline-block;
        font-size: smaller;
    }

.AmountCaption {
    margin-left: 6.0em;
    display: inline-block;
    font-size: 1em;
}

.AmountText {
    text-transform: uppercase;
    font-size: 0.8em; /*margin-left: 56px*/
}


/*
.AmountEuro i
{
	font-size: 4.8em;
	color: #FFFFFF;
	opacity: 0.15
}
*/

.FloatRight {
    float: right;
}

.ButtonGroup {
    float: right;
}

/* dit moeten ook grote buttons worden.
.ButtonGroup.Block, .ButtonGroup .Button
{
	min-height: 40px !important;
}

.ButtonGroup .Button .Icon
{
	float: none;
	font-size: 1.0em;
	position: relative;
	margin-top: 4px;
	width: auto
}

.ButtonGroup .Button
{
	margin: 10px;
	padding: 6px
}

.Block .ButtonGroup .Button
{
	margin-top: 0px;
	margin-right: 0px;
	background-color: #F5B401 !important
}


.ButtonGroup .Button .Text
{
	float: none;
	font-size: 0.9em;
	position:relative;
	margin-top: 0px;
	margin-bottom: 0px;
	width: auto
}
*/

.Form {
    clear: both;
}

.grid-table th {
    padding-bottom: 2px;
    text-align: left;
}

.grid-table td {
    padding: 2px;
    text-align: left;
}

.grid-table .list_icon {
    width: 16px;
}

.Block.OneSixt.Button.MediumButton {
    width: 125px;
    float: right;
}

.grid-table tfoot td, .grid-table tr.Footer td {
    border-top: 1px solid #203028;
}

/* ---------------- FAQ Categorieen ----------- */

.FACList a {
    color: #000000;
}

.FACList {
    background-color: #A0B0C0;
}

.ResourceList, .ResourceEdit {
    background-color: #2166D3;
}

.FACList .Header {
    /*padding: 4px;*/
    background-color: #174793;
}

.FACList .Row {
    padding: 4px;
    font-weight: bold;
    /*color: #000000;*/
}

    .FACList .Row .Row {
        font-style: italic;
    }

        .FACList .Row .Row .GeneralText {
            font-style: normal;
        }


/* ---------------- FAQ onderwerpen ----------- */

.FAQList {
    margin-top: 4px;
    background-color: #90A0B0;
}

    .FAQList .Header {
        padding: 4px;
        background-color: #8090A0;
    }

    .FAQList .Row {
        padding: 4px;
        font-weight: bold;
        color: #FFFFFF;
    }

    .FAQList a {
        color: #000000;
    }

    .FAQList .Row {
        padding: 4px;
    }

    .FAQList .GeneralText {
        margin-top: 4px;
        padding: 4px;
        background-color: #8090A0;
        float: none;
        font-weight: normal;
        color: #FFFFFF;
    }

.InlineEdit {
    float: right;
    padding-top: 3px;
}

    .InlineEdit i {
        font-size: 1.5em;
    }

.ButtonBack {
    margin-left: 14px;
}

    .ButtonBack span {
        cursor: pointer;
    }

    .ButtonBack i {
        margin-right: 4px;
    }

.OneThird .formrow_label {
    width: auto !important;
}

.positive {
    color: #080;
}

.negative {
    color: #800;
}

.datepick-popup {
    background-color: #000000;
}

.datepick-cmd.datepick-cmd-prev {
}

.datepick-cmd.datepick-cmd-prev {
}

.datepick-cmd.datepick-cmd-prev {
}

.datepick-month-header {
    font-size: 12px;
    height: 30px;
}

    .datepick-month-header select {
        height: 28px;
        padding: 2px;
    }


.datepick-month-year {
}

TR.HideOnPhone {
    display: table-row;
}

TD.HideOnPhone {
    display: table-cell;
}

TH.HideOnPhone {
    display: table-cell;
}

TR.HideOnScreen {
    display: none;
}

SPAN.HideOnScreen {
    display: none;
}

.textboxinline {
    padding: 2px;
}

.Advertisement {
    cursor: pointer;
}

/* Berichtencentrum */

.Message {
    cursor: pointer;
    background-color: #e6f6e6;
    color: #081009;
    border: 2px solid black;
    font-size: 16px;
    min-height: 0px;
}

    .Message .Header {
        background-color: #0a441d;
        color: #F0F0F0;
    }

    .Message .Content {
        padding-bottom: 10px;
    }

.fa.overlap {
    color: #FFBA01;
    position: absolute;
    right: 32px;
    bottom: 46px;
    font-size: 0.85em;
}

.fa-plus.add {
    position: absolute;
    right: 28px;
    bottom: 51px;
    font-size: 0.8em;
}

.fa.small {
    font-size: 0.3em;
}

.fa.rbcorner {
    position: absolute;
    right: 44px;
    bottom: 64px;
}

.fa.fa-share-alt {
    color: #CC9400;
    position: absolute;
    right: 41px;
    bottom: 53px;
    font-size: 0.5em;
}

.fa.fa-reply {
    color: #CC9400;
}

[tooltip]:before {
    position: absolute;
    left: 50px;
    top: 50px;
    content: attr(tooltip);
    opacity: 0;
    background-color: #174793;
    width: 200px;
    z-index: 1;
    padding: 5px;
}

[tooltip]:hover:before {
    opacity: 1;
}

.MarkDelete {
    color: #FF8080;
}

a.TermsAndConditions {
    font-weight: bold;
    text-decoration: underline;
}

input.TermsAndConditions {
    outline-style: none !important;
    border-style: none !important;
    /*transform: scale(1.5);*/
}


.Coupon {
    text-align: center;
    margin-top: 1em !important;
    border: 2px dashed white;
    padding: 10px;
    box-sizing: border-box;
}

    .Coupon .CouponName {
        font-size: 18px;
    }

    .Coupon .LabelChoice {
        font-size: 15px;
    }

    .Coupon .CouponProducts {
        margin-top: 0.5em !important;
        font-weight: normal;
    }

        .Coupon .CouponProducts .ProductName {
            font-size: 20px;
            margin-top: 10px;
        }


.MiniForm .form_table input {
    width: auto;
}

.MiniForm .form_table textarea {
    width: auto;
}


.FixedButtonBar {
    display: inline-block;
}

    .FixedButtonBar.Button {
        display: inline-block;
    }

.Block.Hidden {
    display: none;
}

.HREFButtonCollection {
    line-height: 2.5em;
}

.HREFButton {
    border: 1px solid gray;
    border-radius: 0.5em;
    padding: 0.5em;
    margin: 0.5em;
    white-space: nowrap;
}

.price {
    white-space: nowrap;
}

table.bon th {
    vertical-align: top;
    line-height: 1.2em;
}

table.bon td {
    padding: 0.5em;
}
