﻿.station-history-container {
    display: inline-block;
}



<!-- -differences window-- >

div[ng-controller='differenceController'] label {
    display: inline-block;
}

div[ng-controller='differenceController'] table td {
    padding: 6px;
}

div[ng-controller='differenceController'] .error {
    font-weight: bold;
    color: red;
}

[maxwidth] {
    margin-right: 10px;
}

.btn {
    display: inline-block;
    margin-bottom: 0;
    line-height: 20px;
    color: #333333;
    text-align: center;
    text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
    vertical-align: middle;
    cursor: pointer;
    background-repeat: repeat-x;
    border: 1px solid #cccccc;
    padding: 5px;
    font-size: 10pt;
    cursor: pointer;
}

.btn-success {
    color: #ffffff;
    background-color: #51a351;
}

.btn-danger {
    color: #ffffff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
    background-color: #da4f49;
}

.btn-primary {
    color: #ffffff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
    background-color: #006dcc;
}


.modal-form-container {
    /* max-width: 90vw; */
    width: 80vw;
}

.admin-form-header h1 {
    margin-bottom: 10px;
}

.general-row-container {
    display: flex;
    align-items: center;
    margin: 1em 0;
}

    .general-row-container > :nth-child(even) {
        margin-right: 15px;
    }

    .general-row-container > :nth-child(odd) {
        margin-right: 5px;
    }

.quote-remark-row {
    display: flex;
    align-items: center;
    margin: 1em 0;
}

    .quote-remark-row > :nth-child(even) {
        margin-right: 15px;
    }

    .quote-remark-row > :nth-child(odd) {
        margin-right: 5px;
    }

.update-notifier {
    font-weight: 600;
    font-size: 1.2em;
    transition: all ease 0.5s;
}

    .update-notifier.idle {
    }

    .update-notifier.pending {
        /*animation: update-notifier-pending-anim 0.5s infinite alternate ease;*/
        color: dodgerblue;
    }

@keyframes update-notifier-pending-anim {
    from {
        opacity: 0
    }

    ; to {
        opacity: 1
    }

    ;
}

.update-notifier.success {
    border-radius: 10px;
    color: green;
    /* animation: update-notifier-success-anim 1s infinite alternate ease; */
}

@keyframes update-notifier-success-anim {
    from {
        border: 1px solid rgba(7, 149, 0, 0.25);
    }

    to {
        border: 1px solid rgb(7, 149, 0);
    }
}

.update-notifier.error {
    border-radius: 10px;
    color: red;
}

.add-remarks-container {
    box-shadow: 0px 0px 10px slategrey;
    position: fixed;
    background: lightblue;
    display: flex;
    flex-flow: column;
    align-items: center;
    padding: 10px;
}

    .add-remarks-container .remarks-button-wrapper {
        display: flex;
        width: 100%;
        margin-top: 1em;
        justify-content: space-around;
    }

        .add-remarks-container .remarks-button-wrapper button {
            border-radius: 5px;
            padding: 5px 10px;
            background: aliceblue;
        }

/* 
.crm-order-table {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 1em;
}

.crm-order-table div{
    display: flex;
}
.crm-order-table div div {
    display: flex;
    margin-top: 5px;
    width: 170px;

.checkbox-options span {
    width: 60px !important;
    display: flex;
    justify-content: space-between;
}
*/
.custom-modal {
    position: fixed;
    animation: enter-fade 0.8s ease forwards;
    background: white;
    padding: 1em;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    box-shadow: 1px 1px 10px grey;
    border-radius: 10px;
}

@keyframes enter-fade {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}


.checkbox-options span {
    width: 60px !important;
    display: flex;
    justify-content: space-between;
}

.crm-order-table {
}

    .crm-order-table tbody {
        display: flex;
        flex-flow: row wrap;
    }

        .crm-order-table tbody tr {
            display: flex;
            /* flex-flow: column wrap; */
            padding: 10px;
            /* border-right: 1px dashed grey;
    margin-bottom: 10px;
    width: 260px; */
        }

            .crm-order-table tbody tr td {
                display: flex;
                /* flex-flow: column; */
                /* margin-bottom: 5px; */
                width: 250px;
                margin-right: 10px;
            }


                .crm-order-table tbody tr td .k-numeric-wrap::before {
                    padding: 0;
                    height: 0;
                }

            .crm-order-table tbody tr.comments-row {
                display: flex;
                flex-flow: row wrap;
                border-right: none;
            }


            .crm-order-table tbody tr td.checkbox-row span {
                display: flex;
                width: 70px !important;
                justify-content: space-between;
            }


/* DateTime Picker Directive START */
.datetime-picker-container {
    background: white;
    border-radius: 4px;
    box-shadow: 0px 0px 2px dimgrey;
    margin-right: -0.5px;
    display: flex;
    transition: all 0.5s ease-out;
    width: 150px;
    justify-content: space-between;
}

    .datetime-picker-container:hover {
        box-shadow: 0px 0px 6px dimgrey;
    }

.datetime-picker-text {
    padding: 5px;
    margin-top: 1.5px;
}

.datetime-picker-icon {
    background: linear-gradient(135deg, #eeeeee 0%,#E0E0E0 100%);
    padding: 0 5px;
    color: grey;
    border-radius: 0 4px 4px 0;
    font-size: 1.5em;
    display: flex;
    justify-content: center;
    flex-flow: column;
    transition: all 0.5s ease-out;
    border-left: 0.5px solid dimgrey;
}

    .datetime-picker-icon:hover {
        background: linear-gradient(135deg, #fcfcfc 0%,rgb(238, 238, 238) 100%);
        color: dimgrey;
    }

.datetime-picker-container input {
    width: 100%;
    text-align: center;
    border: none;
    position: inherit;
    height: 25px;
}
/* DateTime Picker Directive END */
