/* Minification failed. Returning unminified contents.
(989,32): run-time error CSS1019: Unexpected token, found ' '
(989,32): run-time error CSS1019: Unexpected token, found ' '
(989,32): run-time error CSS1042: Expected function, found ' '
(989,32): run-time error CSS1062: Expected semicolon or closing curly-brace, found ' '
(990,35): run-time error CSS1019: Unexpected token, found ' '
(990,35): run-time error CSS1019: Unexpected token, found ' '
(990,35): run-time error CSS1042: Expected function, found ' '
(990,35): run-time error CSS1062: Expected semicolon or closing curly-brace, found ' '
(1022,36): run-time error CSS1019: Unexpected token, found ' '
(1022,36): run-time error CSS1019: Unexpected token, found ' '
(1022,36): run-time error CSS1042: Expected function, found ' '
(1022,36): run-time error CSS1062: Expected semicolon or closing curly-brace, found ' '
(1023,39): run-time error CSS1019: Unexpected token, found ' '
(1023,39): run-time error CSS1019: Unexpected token, found ' '
(1023,39): run-time error CSS1042: Expected function, found ' '
(1023,39): run-time error CSS1062: Expected semicolon or closing curly-brace, found ' '
 */
/*
 * It is advised not to edit the smartadmin_production.css
 * as this will override any changes you make in the 
 * later versions of this theme. 
 * 
 * We advise that you use use this CSS to override 
 * SmartAdmin styles. 
 * 
 * Rename the stylesheet to whatever your liking so it will stay
 * unique to you with each update of SmartAdmin.
 */

/*
 * INDEX
 * 
 * - HTML
 * - BODY
 * - CUSTOM STYLES
 */
.modal-xxl{width:95%; height:95%;}

.modal-lg {
    width: 60%;
}

.modal-xl {
    width: 80%;
}

.container {width:80%;}
.logWindow {position:fixed; top:100px; left:50px; bottom:100px; right:50px; background-color:#b1adad; z-index:1000;}

#login-form.smart-form  header {background-color:transparent !important;}
#login-form.smart-form fieldset {background-color:transparent !important;}
#login-form.smart-form footer {background-color:transparent !important;}
#installerlookup-form.smart-form  header {background-color:transparent !important;}
#installerlookup-form.smart-form fieldset {background-color:transparent !important;}
#installerlookup-form.smart-form footer {background-color:transparent !important;}
#sendpassword-form.smart-form  header {background-color:transparent !important;}
#sendpassword-form.smart-form fieldset {background-color:transparent !important;}
#sendpassword-form.smart-form footer {background-color:transparent !important;}

#contactus-form.smart-form  header {background-color:transparent !important;}
#contactus-form.smart-form fieldset {background-color:transparent !important;}
#contactus-form.smart-form footer {background-color:transparent !important;}

.imgShadow {
    border: 2px solid #fff;
    box-shadow: 10px 10px 5px #232323;
    -moz-box-shadow: 10px 10px 5px #232323;
    -webkit-box-shadow: 10px 10px 5px #232323;
    -khtml-box-shadow: 10px 10px 5px #232323;
}
.hero {
    height: 100% !important;
}
#logo-lg {
    display: inline-block;
    width: 90%;
    margin-top: 5px;
    margin-left: -21%;
}

    #logo-lg img {
        width: 100%;
        height: 100%;
        padding-left: 3px
    }
.text-highlight {
    font-weight: 400;
    color: #fff;
    letter-spacing: -2px;
    font-size: 300%;
    margin-bottom: 30px;
    /*! text-shadow:0 1px 0 #ccc,0 2px 0 #bfbfbf,0 3px 0 #bbb,0 4px 0 #b9b9b9,0 5px 0 #aaa,0 6px 1px rgba(0,0,0,.1),0 0 5px rgba(0,0,0,.1),0 1px 3px rgba(0,0,0,.3),0 3px 5px rgba(0,0,0,.2),0 5px 10px rgba(0,0,0,.25),0 10px 10px rgba(0,0,0,.2),0 20px 20px rgba(0,0,0,.15); */
}
@media (max-width:767px){ .visible-lessthan-xs { display: block !important }}
@media (min-width:767px){ .visible-lessthan-xs { display: none !important }}

#background-video {
    width: 100vw;
    height: 100vh;
    object-fit: cover;
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 0;
}
@media (max-width: 750px) {
    #background-video {
        display: none;
    }

    body {
        background: url("/Content/img/glass.jpg") no-repeat;
        background-size: cover;
    }
}
a.ulink:hover {
    text-decoration: underline;
}

html {background:none;}
b, strong {font-weight:700 !important;}
.strong {font-weight:700 !important;}
b label {font-weight:700 !important;}
.smart-style-2 #header {color:#c5c6ca;}
.menu-on-top #logout {display:block !important;}

.inline {display:inline !important;}
.inline-block {display:inline-block !important;}

.tooltip {display:block; z-index:10000 !important;}
.smart-form .tooltip {opacity:1;}

.pos-relative {position:relative !important;}

.hidden {display:none !important;}
.jarviswidget {margin:0 0 10px;}

#sparks {margin: 10px 30px 10px 0px;}

.forcevisible {display:block !important; }
.widgettopformbox {display:none;padding:10px}

.bootstrapWizard li {width:15%;}

.smart-form .col {padding-left:5px;padding-right:5px;}

.highlightNodeBox { vertical-align:top;border:1px solid rgba(23, 23, 23, 0.5); border-radius:20% 0 !important;
    box-shadow: 6px 6px 5px rgba(23, 23, 23, 0.5); margin:5px 5px 20px; padding:5px; width:18%;}
.highlightNodeBox small { font-size:xx-small;}
.highlightNodeBox a { text-decoration:none; }
.highlightNodeBox img {width:64px;height:64px;}
@media screen and (max-width: 450px) and (max-width: 767px) {
.highlightNodeBox {  width:40%;}
.highlightNodeBox small { font-size:xx-small;display:none;}
.highlightNodeBox h5 { font-size:smaller; }
.highlightNodeBox img {width:32px;height:32px;}

}
table.dataTable tbody tr.selected > td {background-color:#b0bed9; }
.smart-style-5 table.dataTable tbody tr.selected > td  {background-color:rgba(0,255,255,0.25); }

.highlightNodeBox:hover {
  -moz-animation: bounce 1s infinite;
  -webkit-animation: bounce 1s infinite;
  animation: bounce 1s infinite;
}

@-moz-keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    -moz-transform: translateY(0);
    transform: translateY(0);
  }
  40% {
    -moz-transform: translateY(-20px);
    transform: translateY(-20px);
  }
  60% {
    -moz-transform: translateY(-10px);
    transform: translateY(-10px);
  }
}
@-webkit-keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  40% {
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px);
  }
  60% {
    -webkit-transform: translateY(-10px);
    transform: translateY(-10px);
  }
}
@keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  40% {
    -moz-transform: translateY(-20px);
    -ms-transform: translateY(-20px);
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px);
  }
  60% {
    -moz-transform: translateY(-10px);
    -ms-transform: translateY(-10px);
    -webkit-transform: translateY(-10px);
    transform: translateY(-10px);
  }
}

@media (min-width:768px) and (max-width:979px) {
}
@media only screen and (min-width:320px) and (max-width:479px) {
    
}
@media only screen and (min-width:0) and (max-width:679px) {
    #ribbon{background-color:#474544;}
}
@media (max-width:480px){.hidden-xxs{display:none!important}}
@media (max-width:480px){.hidden-phone{display:none!important}}
@media (max-width:1024px){.hidden-tablet{display:none!important}}
@media (max-width:480px) {div.dataTables_filter input {width: 12em;}}

@media (max-width:480px){#logo-group{width:100px!important}}

.profile-carousel .carousel-inner {max-height:100px;}

.breadcrumbnav {display:inline-block;margin:0;padding:11px 5px 11px 0 !important;vertical-align:top;}
.breadcrumbnav > li {display: inline-block;}
.breadcrumbnav, .breadcrumbnav a { color: #bbb !important ;text-decoration:none!Important;} 
.breadcrumbnav a:hover { color: #ffd600 !important ;}   
#ribbon .nodename {color: #ffd600 !important ;}                                                                                                            
/*.breadcrumbnav li:last-child, .breadcrumbnav>.active{color:#E4E4E4}                                                                                                            
.breadcrumbnav li:last-child a, .breadcrumbnav>.active a{color:red;}
    */
.openfolder {display:inline-block;}
nav ul .active > a {color: yellow !important;}

.document-pic {text-align:right;}

.txt-color-lightgrey{color:#E4E4E4 !important;}

#extr-page body
{
    position: absolute;
    width: 100%;
}

#extr-page .page-footer
{
    padding:15px;
} 
.padding-top-0 {
  padding-top: 0 !important;
}
.padding-top-5 {
  padding-top: 5px !important;
}
.padding-bottom-0 {
  padding-bottom: 0 !important;
}
.padding-bottom-5 {
  padding-bottom: 5px !important;
}
.padding-left-5 {
  padding-left: 5px !important;
}
.padding-left-10 {
  padding-left: 10px !important;
}
.padding-right-5 {
  padding-right: 5px !important;
}
.padding-right-10 {
  padding-right: 10px !important;
}
.margin-top-0 {
  margin-top: 0 !important;
}
.margin-top-5 {
  margin-top: 5px !important;
}
.margin-bottom-0 {
  margin-bottom: 0 !important;
}
.margin-bottom-5 {
  margin-bottom: 5px !important;
}
.margin-left-5 {
  margin-left: 5px !important;
}
.margin-left-10 {
  margin-left: 10px !important;
}
.margin-right-5 {
  margin-right: 5px !important;
}
.margin-right-10 {
  margin-right: 10px !important;
}
.margin-right-15 {
  margin-right: 15px !important;
}
/*.smart-form {
    .input {
        input {
            padding: 4px 10px !important;
        }
    }
}*/
/* SmartForm Bootstrap Validation */
#extr-page h4.paragraph-header {
  width: auto;
}
#extr-page .smart-form .alert {
  margin: 4px;
}
#extr-page .smart-form .alert li {
  margin-left: 14px;
  list-style: none;
}
#extr-page .smart-form .alert li:before {
  content: "\f071";
  font-family: FontAwesome;
  position: absolute;
  left: 14px;
}
#extr-page .smart-form div + fieldset {
  padding-top: 15px;
}


body {-webkit-overflow-scrolling:touch !important;}
#preview-containerIOS {-webkit-overflow-scrolling:touch  !important;}
#preview-container {-webkit-overflow-scrolling:touch  !important;}

.pagePreviewIOS 
{
    width: 95%; /* fallback if needed */
    height: 95%; /* fallback if needed */
    overflow:hidden;
}

.pagePreviewIOS  img
{
    width: 400px;
    height: 600px;
    border:1px solid rgba(23, 23, 23, 0.5);
    box-shadow: 10px 10px 5px rgba(23, 23, 23, 0.5);
}
.pagePreview 
{
    width: 95%; /* fallback if needed 
    width: calc(100% - 20px);*/
    height: 95%; /* fallback if needed 
    height: calc(100% - 20px);*/
    overflow:hidden;
}

.pagePreview  img
{
    width: 100%;
    height: 100%;
    border:1px solid rgba(23, 23, 23, 0.5);
    box-shadow: 10px 10px 5px rgba(23, 23, 23, 0.5);
}
.pagePreviewCopyright {
position:absolute;
top:0px;
left:0px;
right:0px;
bottom:0px;
}
#preview-remote:hover {
    opacity:1;
}
.smart-style-5 .bg-color-darken .preview-remote{
    background:none repeat scroll 0 0 rgba(0, 0, 0, 0.83) !important;
}
#preview-remote {
    position:fixed;
    z-index:1000;
    background: rgba(33, 33, 33, 0.9);
    width:auto;
    /*height:200px;*/
    padding:10px;
    text-align:center;
    border-radius:10% 10% !important;
    bottom:50px;
    left:40%; /*fallback*/
    left:calc(50% - 100px);
    opacity:0.8;
}
#preview-remote span {color:#FFF;}
#preview-zoom-slider{width:100px; display:inline-block;}
#preview-pager {
    width:70px; 
    display:inline-block;
    padding-left:10px;
    border-left:1px solid rgba(255, 255, 255, 0.9)
}
#pageCounter {width:70px; display:inline-block;}

/* sly effects CSS*/
.wrap {
    position: relative;
}
.frame {
    height: 250px;
    line-height: 250px;
    overflow: hidden;
}
.frame ul {
    font-size: 30px;
    height: 100%;
    list-style: outside none none;
    margin: 0;
    padding: 0;
}
.frame ul li {
    background: none repeat scroll 0 0 #333;
    color: #ddd;
    cursor: pointer;
    float: left;
    height: 100%;
    margin: 0 1px 0 0;
    padding: 0;
    text-align: center;
    width: 150px;
}
.frame ul li.active {
    background: none repeat scroll 0 0 #a03232;
    color: #fff;
}
.scrollbar {
    background: none repeat scroll 0 0 #aaa;
    height: 2px;
    line-height: 0;
    margin: 0 0 1em;
}
.scrollbar .handle {
    background: none repeat scroll 0 0 #DDD;
    cursor: pointer;
    height: 100%;
    width: 100px;
}
.scrollbar .handle .mousearea {
    height: 20px;
    left: 0;
    position: absolute;
    top: -9px;
    width: 100%;
}
.controls {
    margin: 5px 0;
    text-align: center;
}
.effects {
    height: 100px;
    line-height: 50px;
    perspective: 800px;
    perspective-origin: 50% 50%;
}
.effects ul {
    transform-style: preserve-3d;
}
.effects ul li {
    margin: 0 -20px;
    position: relative;
    transform: rotateY(70deg) scale(0.9);
    transition: transform 300ms ease-out 0s;
}
.effects ul li.active {
    transform: scale(1);
    z-index: 10;
}
.effects ul li.active ~ li {
    transform: rotateY(-70deg) scale(0.9);
}



#thumbnails .selected {
    border: 1px solid #0091d9 !important;
    position: relative;
}
#thumbnails .selected:before {
    color: #fff;
    content: "";
    display: block;
    font-family: FontAwesome;
    position: absolute;
    right: 4px;
    top: 3px;
    z-index: 2;
}
#thumbnails .selected:after {
    border-left: 35px solid rgba(0, 0, 0, 0);
    border-top: 35px solid #0091d9;
    content: "";
    display: block;
    height: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 0;
    z-index: 1;
}
#thumbnails {
    background-color: rgba(0, 0, 0, 0.85);
    box-sizing: border-box;
    color: #fff;
    display: none;
    height: auto;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 907;
}
#thumbnails ul {
    border-bottom: 1px solid #423f3f;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
    list-style: outside none none;
    margin: 0;
    padding: 15px 20px 10px;
}
#thumbnails ul li {
    display: inline-block;
    width: auto;
}
#thumbnails ul li .jarvismetro-tile {
    border: medium none;
    border-radius: 0;
    margin: 0 3px 3px;
}
#thumbnails ul li .jarvismetro-tile:hover {
    color: #fff;
    text-decoration: none;
}
#thumbnails ul li .jarvismetro-tile:active, #thumbnails ul li .jarvismetro-tile:focus {
    left: 0;
    top: 0;
}
.thumbnails-on #response-btn {
    display: none !important;
}
.thumbnails-on #left-bar .navbar, .thumbnails-on #main .navbar {
    border: medium none !important;
}

.no-border {  border:0px !important;}

.dropdown-menu      {padding:2px !important; }
.dropdown-menu ul   {padding:2px !important; }
.dropdown-menu li   {padding:2px !important; }
.dropdown-menu li:after, .dropdown-menu li:before {  border:0px !important;}
.dropdown-menu li span {  border:0px !important;}
.tree li {padding-right:0px;}


.bootstrap-tagsinput .label 
{
    color:white;
    display:inline-block;
    line-height:1;
}
.bootstrap-tagsinput input
{
    display:inline-block !important;
    line-height:1 !important;
    border:0px !important;
}
.smart-style-5 .bootstrap-tagsinput input {background:transparent !important;}
.bootstrap-tagsinput .tag [data-role="remove"] {height:1em;}
 
.profile-picimg {
    border: 5px solid #fff;
    border-radius: 0;
    display: inline-block;
    left: 10px;
    margin-bottom: -30px;
    max-width: 100px;
    position: relative;
    text-align: right;
    top: -30px;
    z-index: 4;
}


/* ------------------------------------- 
    Avatar and JCrop customization
---------------------------------------- */

#previewavatar-pane {
    position: absolute;
    bottom: -90px;
    z-index: 1;
    display: block;
    border: 3px #AAA solid;
}

    #previewavatar-pane .previewavatar-container {
        overflow: hidden;
        width: 64px;  /* ToDo - size of the crop window*/
        height: 64px; /* ToDo - size of the crop window*/
    }

.upload-progress {
    border: 1px #bbb solid;
    padding: 0;
}

.upload-percent-value {
    padding-left: 10px;
    position: absolute;
}

.upload-percent-bar {
    background-color: #bbb;
    height: 20px;
}
.margin-10 {margin:10px !important;}
.padding-10 {padding:10px !important;}
.margin-20 {margin:20px !important;}
.padding-20 {padding:20px !important;}
.padding-top-50 {padding-top:50px !important;}
.padding-top-100 {padding-top:100px !important;}
.padding-bottom-100 {padding-bottom:100px !important;}

@media (max-width:480px) {
    .avatartarget {
        width:200px;
    }
}

.editable-disabled:hover {text-decoration:none !important;cursor:default!important;}

time.icon {width:45px;}
.chat-body li.message .message-text {display:block;}
/* Drop Zone styles*/
.dz-details {width:200px;}

#loadingResultsDiv-div-wait {
    /*content: url(/content/img/ajax-loader.gif);*/
    text-align: center;
    padding: 10px;
    margin: 20px;
    font-weight: 700;
    font-size: 16px; 
    height: 100px;
    z-index: 10000;
    width: 100%;
    position: relative;
    display: none;
    color:#555;
}
#loadingResultsDiv-div-wait.waitactive  {display:block !important;}
#loadingResultsDiv-div-wait.waitactive:hover{cursor:wait!important}

#loadingEventsDiv-div-wait {
    /*content: url(/content/img/ajax-loader.gif);*/
    text-align: center;
    padding: 10px;
    margin: 20px;
    font-weight: 700;
    font-size: 16px;
    height: 100px;
    z-index: 10000;
    width: 100%;
    position: relative;
    display: none;
    color: #555;
}

#loadingEventsDiv-div-wait.waitactive {display: block !important; }
#loadingEventsDiv-div-wait.waitactive:hover { cursor: wait !important;}

#loadingCameraEventsDiv-div-wait {
    /*content: url(/content/img/ajax-loader.gif);*/
    text-align: center;
    padding: 10px;
    margin: 20px;
    font-weight: 700;
    font-size: 16px;
    height: 100px;
    z-index: 10000;
    width: 100%;
    position: relative;
    display: none;
    color: #555;
}

#loadingCameraEventsDiv-div-wait.waitactive {display: block !important; }
#loadingCameraEventsDiv-div-wait.waitactive:hover { cursor: wait !important;}


#loadingChecksDiv-div-wait {
    /*content: url(/content/img/ajax-loader.gif);*/
    text-align: center;
    padding: 10px;
    margin: 20px;
    font-weight: 700;
    font-size: 16px;
    height: 100px;
    z-index: 10000;
    width: 100%;
    position: relative;
    display: none;
    color: #555;
}
#loadingChecksDiv-div-wait.waitactive {display: block !important; }
#loadingChecksDiv-div-wait.waitactive:hover { cursor: wait !important;}

#global-div-wait {
    /*content: url(/content/img/ajax-loader.gif);*/
    top: 0px;
    text-align: center;
    padding-top: 100px;
    font-weight: 700;
    font-size: 16px; 
    background: rgba(255,255,255,.6);
    height: 100%;
    z-index: 10000;
    width: 100%;
    position: absolute;
    display: none;
    color:#555;
}
#global-div-wait.waitactive  {display:block !important;}
#global-div-wait.waitactive:hover{cursor:wait!important}


.local-div-wait {
    top: 0px;
    text-align: center;
    padding-top: 10px;
    font-weight: 600;
    font-size: 16px; 
    background: rgba(255,255,255,.2);
    height: 100px;
    z-index: 10000;
    width: 100%;
    position: relative;
    display: block !important;
    color:#555;
}
 

#ribbon {color:#fff;}
#ribbon li {color:#000;}
.smart-style-1 #ribbon {color:#000;}
.smart-style-2 #ribbon {color:#000;}
.smart-style-3 #ribbon {color:#000;}

.smart-style-1  #ribbon .nodename {color:darkblue !important;}
.smart-style-1  .breadcrumbnav, .smart-style-1 .breadcrumbnav a  {color:black !important;}
.smart-style-1  .breadcrumbnav a:Hover  {color:darkblue !important;}

.smart-style-2  #ribbon .nodename {color:darkblue !important;}
.smart-style-2  .breadcrumbnav, .smart-style-2 .breadcrumbnav a  {color:darkgray !important;}
.smart-style-2  .breadcrumbnav a:Hover  {color:darkblue !important;}

.smart-style-3  #ribbon .nodename {color:darkblue !important;}
.smart-style-3  .breadcrumbnav, .smart-style-2 .breadcrumbnav a  {color:darkgray !important;}
.smart-style-3  .breadcrumbnav a:Hover  {color:darkblue !important;}


.smart-style-5.fixed-ribbon #ribbon {background:none repeat scroll 0 0 rgba(0, 0, 50, 0.5) !important}


/*Hide input number spin buttons*/
input[type='number'] { -moz-appearance:textfield !important; }
input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none !important;}

ul.ColVis_collection {
    width: 227px;
}

.btn-prev {border-radius:0px !important;}
.btn-next {border-radius:0px !important;}


.menu-on-top .menu-item-parent {max-width:77px; min-width:55px;}

.dt-buttons {float:right;}
td.details-control {
   /* background: url('../resources/details_open.png') no-repeat center center;*/
    cursor: pointer;
}
tr.shown td.details-control {
   /* background: url('../resources/details_close.png') no-repeat center center;*/
}
.table > tbody > tr > td, .table > tbody > tr > th, .table > tfoot > tr > td, .table > tfoot > tr > th, .table > thead > tr > td, .table > thead > tr > th {padding:8px;}
.table-striped > tbody > tr:nth-of-type(2n+1) {background-color:#FFF;}
.table-striped > tbody > tr:nth-of-type(2n) {background-color:#f9f9f9;}

table.dataTable tbody tr.selected, table.dataTable tbody th.selected, table.dataTable tbody td.selected {color:black !important;}



.bg-color-lightteal {
 background-color:rgba(86,138,137,.5)!important
}

.bounce2 {
  -moz-animation: bounce 1s infinite;
  -webkit-animation: bounce 1s infinite;
  animation: bounce 1s infinite;
}

@-moz-keyframes bounce2 {
  0%, 20%, 50%, 80%, 100% {
    -moz-transform: translateY(0);
    transform: translateY(0);
  }
  40% {
    -moz-transform: translateY(-20px);
    transform: translateY(-20px);
  }
  60% {
    -moz-transform: translateY(-10px);
    transform: translateY(-10px);
  }
}
@-webkit-keyframes bounce2 {
  0%, 20%, 50%, 80%, 100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  40% {
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px);
  }
  60% {
    -webkit-transform: translateY(-10px);
    transform: translateY(-10px);
  }
}
@keyframes bounce2 {
  0%, 20%, 50%, 80%, 100% {
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  40% {
    -moz-transform: translateY(-20px);
    -ms-transform: translateY(-20px);
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px);
  }
  60% {
    -moz-transform: translateY(-10px);
    -ms-transform: translateY(-10px);
    -webkit-transform: translateY(-10px);
    transform: translateY(-10px);
  }
}

.issueresolved {color:rgba(23, 23, 23, 0.5)}

      
.timelineOrder{ min-height:200px;}
       
.timelineGroupStatus {background-color: rgba(152, 219, 217, 0.50) !important; }
.timelineVehicle {background-color:rgba(76, 76, 181, 0.20) !important;}
.TL_Status {background-color: rgba(82, 180, 63, 0.70) !important;}
.TL_Special {background-color: rgba(63, 159, 180, 0.70) !important;}
.TL_Note {background-color: rgba(24, 121, 177, 0.70) !important;}
.TL_CallLog {background-color: rgba(224, 238, 42, 0.7) !important;}
.TL_Issue {background-color: rgba(239, 42, 58, 0.7) !important;}
.TL_Status.disabled {
    background: repeating-linear-gradient( 135deg, #b270703d, #b270703d 10px, #e0acac14 10px, #e0acac14 20px ) !important;
}

.TL_Special.disabled {
    background: repeating-linear-gradient( 135deg, #b270703d, #b270703d 10px, #e0acac14 10px, #e0acac14 20px ) !important;
}

.TL_Note.disabled {
    background: repeating-linear-gradient( 135deg, #b270703d, #b270703d 10px, #e0acac14 10px, #e0acac14 20px ) !important;
}

.TL_CallLog.disabled {
    background: repeating-linear-gradient( 135deg, #b270703d, #b270703d 10px, #e0acac14 10px, #e0acac14 20px ) !important;
}

.TL_Issue.disabled {
    background: repeating-linear-gradient( 135deg, #b270703d, #b270703d 10px, #e0acac14 10px, #e0acac14 20px ) !important;
}


.select2-results__option[data-nonstdcosts="True"] {
    color: red;
}

.select2-results__option  {
    color: blue;
}
.redColor {
    background: linear-gradient(to right, red, red);
}

.hiddenFilter1 {
    display: none
}
.hiddenFilter2 {
    display: none
}
.hiddenFilter3 {
    display: none
}
.hiddenFilter4 {
    display: none
}

.disabled {
    color: #656363 !important;
    border: 1px solid #d0d0d0 !important;
    background: #f1eded !important;
    background: -webkit-linear-gradient(top,#fff 0,#f9f9f9 89%,#fafafa 100%);
    background: -moz-linear-gradient(top,#fff 0,#f9f9f9 89%,#fafafa 100%);
    background: -ms-linear-gradient(top,#fff 0,#f9f9f9 89%,#fafafa 100%);
    background: -o-linear-gradient(top,#fff 0,#f9f9f9 89%,#fafafa 100%);
    background: linear-gradient(top,#fff 0,#f9f9f9 89%,#fafafa 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#fafafa', GradientType=0);
}

.inlineselect2 {
    min-width: 200px;
}

.ajax-dropdown {position:relative;}
.ajax-notifications {
    position: relative;
    width: 100%;
    padding: 10px;
    background: none;
    height: 385px;
    top: -40px;
    border: 1px solid #cecece;
    color: midnightblue;
}
.ajax-dropdown > :last-child {
    line-height: 22px;
    position: relative;
    top: -35px;
}

/* DEVICE CHECK PAGE*/


#interactive.viewport { 
    width: 100vw;
    height: 100vh;
    position: fixed;
    top: 120px;
    bottom: 0;
    left: 0;
    right: 0;
    background-color:#0e0e0ee7;
}

    #interactive.viewport canvas, video { 
        width: 100vw;
        height: 100vh;
        position: fixed;
        top: 120px;
        bottom: 0;
        left: 0;
        right: 0;
    }

.videoOverlay {
     
    width: 100vw;
    height: auto;
    position: fixed;
    left: 0;
    right: 0;
    z-index:100;
    padding:20px;
}
.manualCheckDiv {
    position: fixed;
    left: 10vw;
    right: 10vw;
    top:40vh;
    height: auto;
    min-height: 80px;
    z-index: 100;
    padding: 20px;
    background-color: #73a4ce91;
}
#serialInput {
    width: calc(100% - 120px );
    width: -moz-calccalc(100% - 120px );
    width: -webkit-calccalc(100% - 120px );
    line-height: 2;
    font-size: xx-large;
    background: transparent;
}
.scanResult {
    position: fixed;
    bottom:0;
    left: 0;
    right: 0;
    height: auto;
    min-height: 80px;
    z-index: 100;
    padding: 10px;
    margin: 10px;
    background-color: #75b9f367;
    border: 1px solid #040a37f2;
}
#optionZone{opacity:0.6;}

#interactive.viewport canvas.drawingBuffer, video.drawingBuffer {
    margin-left: 0px;
}
@media(max-width:979px) {
    #interactive.viewport {
        top: 50px;
    }
    #interactive.viewport canvas, video {
        top: 50px;
    }
    #serialInput {
        width: calc(100% - 80px );
        width: -moz-calccalc(100% - 80px );
        width: -webkit-calccalc(100% - 80px );
        line-height: 1;
        font-size: large;
        background: transparent;
        min-height: 30px;
    }

    .manualCheckDivBtn {
        width: 30px !important;
        height: 30px !important;
        text-align: center !important;
        padding: 6px 0 !important;
        font-size: 12px !important;
        line-height: 18px !important;
    }
    .manualCheckDiv {
        position: fixed;
        left: 5vw;
        right: 5vw;
        top: 40vh;
        height: auto;
        min-height: 40px;
        z-index: 100;
        padding: 10px;
        background-color: #73a4ce91;
    }
}
    @media (max-width: 603px) {
    }

.thumbnailBlock{border:solid 1px darkgrey; padding:5px;}

.MessageBoxContainer input {
    color: darkblue;
}

.MessageBoxContainer textarea {
    color: darkblue;
}
.smart-style-3 .page-footer,
.smart-style-3 .superbox-show {
    background: #f78c40;
}
 

#SearchOrderNumberStr:invalid {
    color: red;
}