button, #leftEndBtn, #leftBtn, #rightBtn, #rightEndBtn, #rollBtn, #unrollBtn, #createModeOrder {
    position: relative;
}
button.report {
    cursor: pointer;
    height: 20px;
    width: 20px;
    cursor: pointer;
    display: inline-block;
    background: url("/img/report2.jpg") no-repeat scroll center transparent;
    background-size: contain;
}
input[type="checkbox"] {
    padding: 3% 0;
    height: 14px;
    width: 14px;
    vertical-align: middle;
}
.arrow{
    padding:0;
    margin-bottom:0;
    margin-top:0;
    vertical-align:middle;
    background-color:white;
}
.modalClientPhotoBlock {
    display: inline-block;
}
#orderNavigation {
    display: inline-block;
    position: relative;
    left: 200px;
    top: 0px;
}

#orderDataHide {
    display: inline-block;
    position: relative;
    left: 500px;
    top: 0px;
}

fieldset.external{
    border-color:lightblue;
}
fieldset.internal{
    border-color:lightpink;
}
i {
    font-style: normal;
}
img {
    border: none;
    border-radius:6px;
}

    img.modal-content {
        border: none;
    }

    img#pagePhoto {
        display: none;
    }

#car img {
    height: 180px;
    border-radius: 6px;
    display: block;
}

#master img {
    height: 180px;
    border-radius: 6px;
    display: block;
}

input {
    border: none;
    border-radius: 4px;
    padding: 3px;
    max-width: 280px;
}
input#OrderId {
    width: 40px;
    background-color: lightpink;
    text-align: center;
    position: relative;
    left: 0px;
}
input#editClientPage {
    width: 30px;
    border: 1px solid #186999;
}

#car {
    display: inline-block;
    vertical-align: top;
}

#client {
    display: inline-block;
}
.active{
    display:inline-block;
}
.contact {
    background-color: WhiteSmoke;
    background-clip: padding-box;
    border-radius: 5px;
    border: 1px;
    display:none;
}
.items {
    width: 70%;
    height: 80%;
    display: none;
    margin:200px;
    margin-top: 100px;
    background-color: whitesmoke;
    box-shadow: 2px 2px 6px #888;
    border-radius:6px;
}
.modal.items{
    display:block;
}
.modal.contact {
    display: block;
}
.allOrderLines{
    padding-left:5px;
    display: block;
}
.itemsClose {
    position: absolute;
    right: 4%;
    top: 1%;
    font: bold 20px arial;
    color: rosybrown;
    border-bottom-left-radius: 50%;
    border-bottom-right-radius: 50%;
    border-top-left-radius: 50%;
    border-top-right-radius: 50%;
    border: 2px solid;
    height: 35px;
    width: 35px;
    cursor: pointer;
}
.orderLineArrow {
    background: url(/img/triangular-unselected-20.png) 6px no-repeat;
}
.buttonOrderLine {
    margin: 0;
    padding: 0;
}
.oredrLineUnit {
    margin: 0;
    padding: 0;
}
.orderLineReport {
    margin: 0;
    padding: 0;
    display:none;
}
.orderLineReport.active {
    margin: 0;
    padding: 0;
    display: block;
}
.orderLineField{
    background-color:white;
}
    .orderLineField.selected {
        background-color: pink;
    }
.divUnit{
    display:inline-block;
}
.orderLine {
    display: block;     
    border: 1px solid lightgrey;
    padding-left: 5px;

    padding:0;
    box-shadow:none;
}
    .orderLine.selected{
        background-color:pink;
    }
    .orderLine.selected button.orderLineField {
        background-color: pink;
    }
.orderLines {
    display: inline-block;
    width: fit-content;
}
.trans {
    width: 65px;
    display: inline-block;
    padding: 0;
    margin: 0;
    padding: 3px;
}
.trans.hide{
    display:none;
}
i.trans {
    background-color:white;
    margin:0;
    vertical-align: middle;
    font-weight:600;
}
input.trans {
    vertical-align: middle;
}
legend button.addImage{
    height:18px;
    width:18px;
}
.legendButtons{
    display:inline-block;
    background-color:white;
    opacity:1;
}
fieldset button.editImage {
    height: 18px;
    max-width: 18px;
    margin:0;
}
.plusTran{
    padding:0;
    box-shadow:none;
}
.plusTran.selected{
    background-color:pink;
}
.minusTran {
    padding: 0;
    box-shadow: none;
}
.minusTran.selected {
    background-color: pink;
}
/*.plusTranSelected{
    background-color:pink;
}
    .plusTranSelected input {
        background-color: pink;
    }
.minusTranSelected {
    background-color: pink;
}
    .minusTranSelected input {
        background-color: pink;
    }*/

.officeAddImage {
    cursor: pointer;
    height: 20px;
    width: 20px;
    cursor: pointer;
    display: inline-block;
    background: url("/img/plus.png") no-repeat scroll center transparent;
    background-size: contain;
}
.officeEditImage {
    cursor: pointer;
    height: 20px;
    width: 20px;
    cursor: pointer;
    display: inline-block;
    background: url("/img/edit.png") no-repeat scroll center transparent;
    background-size:contain;
    display:inline-block;
}
    .officeEditImage.edit {
        display: none;
    }
.officeSaveImage {
    cursor: pointer;
    height: 20px;
    width: 20px;
    cursor: pointer;
    display: inline-block;
    background: url("/img/ok1.png") no-repeat scroll center transparent;
    background-size: contain;
    display:none;
}
    .officeSaveImage.edit{
        display:inline-block;
    }
.officeCancelImage {
    cursor: pointer;
    height: 20px;
    width: 20px;
    cursor: pointer;
    display: inline-block;
    background: url("/img/escape20.png") no-repeat scroll center transparent;
    background-size: contain;
    display:none;
}
    .officeCancelImage.edit {
        display: inline-block;
    }
.tranHeader fieldset input{
    font-weight:600;
}
#master {
    position: relative;
    vertical-align: top;
    display: inline-block;
}

#order {
    display: inline-block;
}

#orderData {
    display: inline-block;
    width: 270px;
    vertical-align: top;
}