@charset "UTF-8";

body {
    font: 100%/1.4 Arial, Verdana, Helvetica, sans-serif;
    background-color: #e1e2df !important;
    margin: 0;
    padding: 0;
    color: #000;
}

/* ~~ Element/tag selectors ~~ */
ul,
ol,
dl {
    /* Due to variations between browsers, it's best practices to zero padding and margin on lists. For consistency, you can either specify the amounts you want here, or on the list items (LI, DT, DD) they contain. Remember that what you do here will cascade to the .nav list unless you write a more specific selector. */
    padding: 0;
    margin: 0;
}

h1,
h2,
h3,
h4,
h5,
h6,
p {
    margin-top: 0;
    /* removing the top margin gets around an issue where margins can escape from their containing div. The remaining bottom margin will hold it away from any elements that follow. */
    padding-right: 15px;
    padding-left: 15px;
    /* adding the padding to the sides of the elements within the divs, instead of the divs themselves, gets rid of any box model math. A nested div with side padding can also be used as an alternate method. */
}

a img {
    /* this selector removes the default blue border displayed in some browsers around an image when it is surrounded by a link */
    border: none;
}

/* ~~ Styling for your site's links must remain in this order - including the group of selectors that create the hover effect. ~~ */
a:link {
    color: #414958;
    text-decoration: none;
    /* unless you style your links to look extremely unique, it's best to provide underlines for quick visual identification */
}

a:visited {
    color: #4E5869;
    text-decoration: underline;
}

.login-container {
    width: 80%;
    max-width: 1260px;
    /* a max-width may be desirable to keep this layout from getting too wide on a large monitor. This keeps line length more readable. IE6 does not respect this declaration. */
    min-width: 780px;
    /* a min-width may be desirable to keep this layout from getting too narrow. This keeps line length more readable in the side columns. IE6 does not respect this declaration. */
    /*background-color: #FFF;*/
    margin: 0 auto;
    /* the auto value on the sides, coupled with the width, centers the layout. It is not needed if you set the .container's width to 100%. */
}

body>.container {
    width: 100%;
    max-width: 1440px;
    margin: 20px auto;
    min-width: 900px;
}
.limit-container {
    min-width: 1080px !important;
    max-width: 1440px !important;
}

.bg-dark-blue {
    background-color: #003C69;
}

.overflow-x-auto {
    overflow-x: auto;
  }

/* ~~ this container surrounds all other divs giving them their percentage-based width ~~ */
.header-container {
    width: 100%;
    max-width: 1440px;
    /* a max-width may be desirable to keep this layout from getting too wide on a large monitor. This keeps line length more readable. IE6 does not respect this declaration. */
    min-width: 1370px !important;
    /* a min-width may be desirable to keep this layout from getting too narrow. This keeps line length more readable in the side columns. IE6 does not respect this declaration. */
    /*background-color: #FFF;*/
    margin: 20px 0 0;
    height: 60px;
    /* the auto value on the sides, coupled with the width, centers the layout. It is not needed if you set the .container's width to 100%. */
}

/* ~~the header is not given a width. It will extend the full width of your layout. It contains an image placeholder that should be replaced with your own linked logo~~ */
.header {
    background-color: #6F7D94;
}

.top_nav {
    background-color: #003C69;
    background-repeat: no-repeat;
    background-position: center top;
    background-size: 100% 100%;
    padding-left: 24px;
    font-size: 14px;
}

.menu_n {
    position: relative;
    top: 20px;
    list-style: none;
    width: 100%;
}

.menu {
    flex-wrap: wrap;
    width: 100%;
    display: flex;
    align-items: center;
}
.tme-table-header {
    background-color: #eee;
    font-weight: 500;
    font-size: 16px !important;
}

.tme-table-header.table-header-small {
    font-size: 12px !important;
}

.menu li {
    display: inline-block;
    padding-top: 8px;
}

.menu ul {
    flex-wrap: wrap;
    display: flex;
    align-items: center;
}
.menu > li a {
    display: block;
    color: white;
    padding: 10px 10px;
    text-decoration: none;
}

.menu li a:hover {
    color: #003c69;
    background-color: #e1e2df;
    text-decoration: underline;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
}

.menu li a:focus {
    color: #003c69;
    background-color: #e1e2df;
    text-decoration: underline;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
}

.menu li .active_menu {
    text-decoration: underline;
    color: #003c69;
    background-color: #e1e2df;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
}





.menu_n {
    position: relative;
    left: 20px;
    top: 20px;
    list-style: none;
    width: 100%;
}


.menu_n li {

    position: relative;
    float: left;
    margin-right: 4px;

}

.menu_n li a {
    color: #fff;
    text-decoration: none;
    border: 0px;
    border-top-right-radius: 2px;
    border-top-left-radius: 2px;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 5px;
    padding-right: 5px;
}

.menu_n li a:hover {

    color: #003c69;
    background-color: #E6E6E6;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 5px;
    padding-right: 5px;
}

.menu_n li .active_menu {
    color: #003c69;
    background-color: #E6E6E6;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 5px;
    padding-right: 5px;
    font-size: 14px;

}




/* ~~ This is the layout information. ~~ 

1) Padding is only placed on the top and/or bottom of the div. The elements within this div have padding on their sides. This saves you from any "box model math". Keep in mind, if you add any side padding or border to the div itself, it will be added to the width you define to create the *total* width. You may also choose to remove the padding on the element in the div and place a second div within it with no width and the padding necessary for your design.

*/
.content {
    padding: 10px 0;
    margin: -2.5 auto;
}

.login-content {
    padding: 10px 0;
    margin: 4% auto 5% auto;
    width: 360px;
    height: 484px;
    /*opacity: .1;
    filter: alpha(opacity=100);
    background-color: rgba(255, 255, 255, 0.1);
    background-color:#e1e2df;
    border:none;	
    background-image: url(../images/bg-login-popup.png);*/
    background-position: top center;
    background-repeat: no-repeat;
    -moz-box-shadow: 0px 7px 30px #000;
    -webkit-box-shadow: 0px 7px 30px #000;
    box-shadow: 0px 7px 30px #000;
    /* For IE 8 */
    -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000')";
    /* For IE 5.5 - 7 */
    filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000');
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
}

.login-background-tmr {
    background-image: url(../images/bg-login-popup-tmr.png);
}

.login-background-tme {
    background-image: url(../images/bg-login-popup-tme.png);
}

/* ~~ This grouped selector gives the lists in the .content area space ~~ */
/*.content ul, .content ol {
        padding: 0 15px 15px 40px; /* this padding mirrors the right padding in the headings and paragraph rule above. Padding was placed on the bottom for space between other elements on the lists and on the left to create the indention. These may be adjusted as you wish. 
}*/
/* ~~ The footer ~~ */
.footer {
    padding: 10px 0;
    background-color: #e1e2df;
    font-size: 12px;
    margin-top: 20px;
}

.footer a {
    font-size: 12px;
    color: #00530F;
    text-decoration: underline;
}

.footer a:hover {
    font-size: 12px;
    color: #00530F;
}

.footer a:focus {
    font-size: 12px;
    color: #00530F;
}

.footer a:select {
    font-size: 12px;
    color: #00530F;
}

/* ~~ miscellaneous float/clear classes ~~ */
.fltrt {
    /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
    float: right;
    margin-left: 8px;
}

.fltlft {
    /* this class can be used to float an element left in your page. The floated element must precede the element it should be next to on the page. */
    float: left;
    margin-right: 8px;
}

.clearfloat {
    /* this class can be placed on a <br /> or empty div as the final element following the last floated div (within the #container) if the #footer is removed or taken out of the #container */
    clear: both;
    height: 0;
    font-size: 1px;
    line-height: 0px;
}

.login_title {
    font-size: 20px;
    color: black;
    margin: 190px auto 10px auto !important;
    text-align: center;
}

.user_field {
    width: 235px;
    height: 35px;
    margin: 10px 16%;
    padding: 5px;
    background-color: #fff;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
    vertical-align: top;
    border: 1px #000000 solid;
    color: #636363;
    font-size: 17px;
}

.bt_login {
    width: 247px;
    height: 40px;
    margin: 10px auto;
    padding: 5px;
    background-color: #268745;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
    border: 1px #000000 solid;
    text-align: center;
    font-size: 20px;
    color: #ffffff;
    display: block;
    text-decoration: none;
    cursor: pointer;
}

.bt_login:hover {
    background-color: #108a1c;
}

.login_field {
    color: #636363;
    font-size: 17px;
    border: none;
    height: 37px;
    width: 95%;
    margin: 0px 5px;
}

a.forgot_password {
    font-size: 13px;
    color: #cf4b17;
    margin: 10px 60px 0px 60px !important;
    text-align: left;
    font-weight: normal;
    text-decoration: none;
}

a.forgot_password:hover {
    text-decoration: underline;
}

.logo {
    width: 294px;
    float: left;
    position: absolute;
    top: 20px;
    left: 20px;
}



.login_nav {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    color: #636363;
    text-transform: uppercase;
    float: right;
    margin: 0px;
    padding: 0px;
    text-transform: none;
}

.login_nav li {
    padding: 0;
    list-style: none;
    float: right;
    height: 34px;
    margin: 0 10px ;
    width: 100%;
    /*
    list-style-type: none;
    background: url('../images/bullet-gray-dot.gif') no-repeat 1px 6px;*/
}

.login_nav li a {
    color: #323c42;
    text-decoration: none;
    border: 0px;
    margin-left: 15px;
}

.login_nav li a:hover {
    color: #323c42;
}

.welcome {
    font-size: 12px;
    color: #636363;
}

.user_name {
    color: #323c42;
    font-size: 12px;
    font-weight: bold
}

.page_title {
    color: #323c42;
    font-size: 24px;
    width: 16%;
}

.right_nav_table {
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
    border: 2px #BBBCB9 solid;
    background-color: #BBBCB9;
    vertical-align: top;
    color: #323c42;
    display: block;
    font-size: 16px;
    font-weight: bold;
    text-align: left;
    text-decoration: none;
    text-transform: none;
    line-height: 20px;
    max-width: 300px;
}

.right_nav_table a:hover, .right_nav_table a:focus {
    background-color: #cecfcc;
    color: #ffffff;
    width: 88.3%;
}

.right_nav_table a:select {
    background-color: #bbbcb9;
    width: 100%
}

a.select_right_nav {
    background-color: #bbbcb9 !important;
    color: #323C42 !important;
    width: 100%
}

a.bt_right_nav {
    box-sizing: content-box;
    background-color: #003c69;
    border-radius: 0px 0px 0 0;
    color: #ffffff !important;
    display: block;
    font-size: 16px;
    font-weight: bold;
    padding: 10px;
    text-align: left;
    text-decoration: none;
    text-transform: none;
    width: 89%;
}

.horizontal-nav a.bt_right_nav {
    box-sizing: content-box;
    background-color: #e1e2df;
    border-radius: 0px 0px 0 0;
    color: #323C42 !important;
    display: block;
    font-size: 16px;
    font-weight: bold;
    margin: 0px 0 1px;
    padding: 10px;
    text-align: left;
    text-decoration: none;
    text-transform: none;
    width: 89%;
}

.horizontal-nav a.bt_right_nav-first {
    text-decoration: none;
    border-radius: 0 !important
}

.horizontal-nav a.bt_right_nav-last {
    text-decoration: none;
    margin-bottom: 0px;
    border-radius: 0 !important

}

.horizontal-nav a.bt_right_nav:hover, a.bt_right_nav:focus {
    background-color: #0000;
}

a.bt_right_nav-first {
    text-decoration: none;
    border-radius: 3px 3px 0 0;
}

a.bt_right_nav-last {
    text-decoration: none;
    border-radius: 0px 0px 3px 3px;
    margin-bottom: 0px;
}

a.bt_right_nav:hover, a.bt_right_nav:focus {
    background-color: #0000;
}

.admin_title {
    color: #000000de;
    font-size: 20px;
    width: 140px;
    font-weight: normal;
}

a.bt_post {
    background-image: url("../images/icon-post.png");
    background-position: 8px center;
    background-repeat: no-repeat;
    border: 2px solid #BBBCB9;
    border-radius: 6px 6px 6px 6px;
    color: #323c42;
    display: block;
    font-size: 16px;
    font-weight: bold;
    height: 25px;
    margin: 10px 0;
    padding: 11px 0 6px 24px;
    text-align: center;
    text-decoration: none;
    text-transform: none;
    width: 110px;
}

a.bt_sync {
    background-image: url("../images/icon-sync.png");
    background-position: 8px center;
    background-repeat: no-repeat;
    border: 2px solid #BBBCB9;
    border-radius: 6px 6px 6px 6px;
    color: #323c42;
    display: block;
    font-size: 16px;
    font-weight: bold;
    height: 25px;
    margin: 10px 0;
    padding: 11px 0 6px 24px;
    text-align: center;
    text-decoration: none;
    text-transform: none;
    width: 110px;
}

a.bt_sync:hover {
    text-decoration: none;
}

a.upload_csv {
    background-image: url("../images/icon-post.png");
    background-position: 8px center;
    background-repeat: no-repeat;
    border: 2px solid #BBBCB9;
    border-radius: 6px 6px 6px 6px;
    color: #323c42;
    display: block;
    font-size: 16px;
    font-weight: bold;
    height: 25px;
    margin: 10px 0;
    padding: 11px 0 6px 24px;
    text-align: center;
    text-decoration: none;
    text-transform: none;
    width: 110px;
}

.pagination {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    color: #636363;
    text-transform: uppercase;
    margin: 0px 0px 0px 0px;
    padding: 0px;
    text-transform: none;
    width: 23%;
    /*border:1px #cccccc solid;*/
    float: right;
}

.pagination li {
    border: 0 none;
    color: #636363;
    float: right;
    list-style: none outside none;
    margin: 0;
    padding: 0 8px;
    text-decoration: none;
    width: 15px;
}

.pagination li a {
    color: #636363;
    text-decoration: none;
    border: 0px;
    margin: 0px;
    padding: 8px;
    width: 15px;
}

.pagination li a:hover {
    color: #323c42;
    background-image: url(../images/bg-pagination-hover.png);
    background-repeat: no-repeat;
    background-position: center center;
    border: 0px;
    margin: 0px;
    padding: 8px;
    width: 15px;
}


.data_table {
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
    border: 1px #e1e2df solid;
    background-color: #ffffff;
    margin-top: 10px;
}

.corner_let_top {
    border: 2px solid #bfbebe;
    border-top-left-radius: 6px;
}

.corner_right_top {
    border: 2px solid #bfbebe;
    border-top-right-radius: 6px;
}

.left_border {
    border-left: 1px solid #000000 !important;
}

.data_table_title {
    background-color: #bfbebe;
    text-align: left;
    color: #323c42;
    font-size: 14px;
    font-weight: bold;
    padding: 5px 16px;
    text-align: left;
    border-left: 1px solid #fff !important;
}

.cobc_info {
    white-space: nowrap;
}

.active_row {
    background-color: #d5d5d5;
}

button.stop_receive_notification {
    border-radius: 8px;
    margin-left: 16%;
    color: red
}

span.stopped_receive_notification {
    color: red;
    margin-left: 12%
}

.data_date {
    width: 11%;
    font-size: 12px;
    color: #323c42;
    padding: 10px 16px;
}

.data_title01 {
    width: 36.2%;
    font-size: 14px;
    font-weight: bold;
    color: #323c42;
    padding: 10px 16px;
    text-transform: none !important;
}

.data_title01 a {
    color: #323c42;
    text-transform: none !important;
}

.data_title01 a:hover {
    color: #336888;
    text-transform: none
}

.data_url {
    width: 13.3%;
    font-size: 11px;
    color: #323c42;
    padding: 10px 16px;
}

.data_url a {
    color: #00530F;
    text-decoration: underline
}

.data_url a:hover {
    color: #00530F;
    text-decoration: underline
}

.data_attachment {
    width: 200px;
    padding: 10px 36px;
    font-size: 11px;
    color: #323c42;
    background-image: url(../images/icon-pdf.png);
    background-repeat: no-repeat;
    background-position: 0px;
}

.data_attachment a {
    text-decoration: underline;
}

.data_attachment a:hover {
    text-decoration: underline;
    color: #336888;
}

.data_detail {
    width: 7.1%;
    padding: 10px 16px;
    color: #ffffff;
    font-size: 11px;
    text-align: center
}

.data_detail a {
    color: #ffffff;
    background-color: #636363;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    padding: 5px 8px
}

.data_detail a:hover {
    color: #ffffff;
    background-color: #7aa9c7;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    padding: 5px 8px
}

.data_delete {
    width: 3.8%;
    padding: 10px 23px 10px 5px;
    text-align: center
}

.data_delete a {
    width: 3.8%;
    margin: 10px 16px;
    padding: 10px 23px 10px 5px;
    background-image: url(../images/icon-delete-list.png);
    background-repeat: no-repeat;
    background-position: center center;
    height: 10px;
    width: 10px;
    text-align: center
}

.data_delete a:hover {
    width: 3.8%;
    margin: 10px 16px;
    padding: 10px 23px 10px 5px;
    background-image: url(../images/icon-delete-hover-list.png);
    background-repeat: no-repeat;
    background-position: center center;
    height: 10px;
    width: 10px;
    text-align: center
}

.lodge {
    width: 13.4% !important
}

.address {
    width: 20.4% !important;
    font-size: 12px !important
}

.dis_off {
    width: 11.8% !important
}

.ph {
    width: 9.9% !important
}

.email {
    width: 9.8 !important
}

.data_lodge {
    width: 150px;
    font-size: 14px;
    font-weight: bold;
    color: #323c42;
    padding: 10px 16px;
    text-transform: none !important;
}

.data_lodge a {
    color: #323c42;
    text-transform: none !important;
}

.data_lodge a:hover {
    color: #336888;
    text-transform: none
}

.data_address {
    width: 245px;
    font-size: 12px;
    color: #323c42;
    padding: 10px 16px;
}

.data_dis_off {
    width: 135px;
    font-size: 11px;
    color: #323c42;
    padding: 10px 16px;
}

.data_dis_ph {
    width: 105px;
    font-size: 11px;
    color: #323c42;
    padding: 10px 0px 10px 27px;
    background-image: url(../images/icon-call.png);
    background-repeat: no-repeat;
    background-position: 14px 19px;
}

.data_email {
    width: 111px;
    font-size: 11px;
    color: #323c42;
    padding: 10px 16px;
}

.data_email a {
    color: #00530F;
    text-decoration: underline
}

.data_email a:hover {
    color: #00530F;
    text-decoration: underline
}

.data_delete01 {
    width: 42px;
    /*padding:10px 23px 10px 5px;*/
    text-align: center
}

.data_delete01 a {
    width: 42px;
    /*margin:10px 16px;*/
    padding: 10px 23px 10px 5px;
    background-image: url(../images/icon-delete-list.png);
    background-repeat: no-repeat;
    background-position: center center;
    height: 10px;
    width: 10px;
    text-align: center
}

.data_delete01 a:hover {
    width: 42px;
    /* margin:10px 16px; */
    padding: 10px 23px 10px 5px;
    background-image: url(../images/icon-delete-hover-list.png);
    background-repeat: no-repeat;
    background-position: center center;
    height: 10px;
    width: 10px;
    text-align: center
}

/*####################### custom input #############################*/
.input-wrapper {
    display: inline-block;
    position: relative;
    width: 100%;
    box-sizing: border-box;
  }
  
.custom-input {
    border: 1px solid #ccc;
    border-radius: 4px;
    padding: 10px;
    height: 40px;
    width: 100%;
    box-sizing: border-box;
}
.custom-input:focus {
    outline: none;
    border: 1px solid #007aff;
    box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.5);
  }
  
  .custom-label {
    position: absolute;
    top: -8px;
    z-index: 1;
    left: 8px;
    background-color: white;
    padding: 0 5px;
    color: #808080;
    font-size: 12px;
  }
  
input:disabled, textarea:disabled, button:disabled, select:disabled {
    cursor: not-allowed;
}
  



/*####################### POP-UP start #############################*/

#backgroundPopup {
    z-index: 1;
    position: fixed;
    display: none;
    height: 100%;
    width: 100%;
    background: #000000;
    top: 0px;
    left: 0px;
}

#toPopup {
    /*font-family: "lucida grande",tahoma,verdana,arial,sans-serif;
background: none repeat scroll 0 0 #FFFFFF;*/
    background-color: #e1e2df;
    /*border: 10px solid #ccc;*/
    border-radius: 5px 5px 5px 5px;
    color: #333333;
    display: none;
    font-size: 14px;
    left: 55%;
    margin-left: -402px;
    position: fixed;
    top: 10%;
    width: 680px;
    z-index: 2;

}


#toPopup1 {
    /*font-family: "lucida grande",tahoma,verdana,arial,sans-serif;
background: none repeat scroll 0 0 #FFFFFF;*/
    background-color: #e1e2df;
    /*border: 10px solid #ccc;*/
    border-radius: 5px 5px 5px 5px;
    color: #333333;
    display: none;
    font-size: 14px;
    left: 55%;
    margin-left: -402px;
    position: fixed;
    top: 10%;
    width: 680px;
    z-index: 2;

}


div.loader {
    background: url("../images/loading.gif") no-repeat scroll 0 0 transparent;
    height: 32px;
    width: 32px;
    display: none;
    z-index: 9999;
    top: 40%;
    left: 50%;
    position: absolute;
    margin-left: -10px;
}

div.close {
    /* background: url("../images/closebox.png") no-repeat scroll 0 0 transparent;
     bottom: 24px;*/
    cursor: pointer;
    /*float: right;
    height: 30px;
    left: 27px;
    position: relative;
    width: 30px;*/
    margin-left: 20.3%;
    width: 90%;
}

span.ecs_tooltip {
    background: none repeat scroll 0 0 #000000;
    border-radius: 2px 2px 2px 2px;
    color: #FFFFFF;
    display: none;
    font-size: 11px;
    height: 16px;
    opacity: 0.7;
    padding: 4px 3px 2px 5px;
    position: absolute;
    right: -62px;
    text-align: center;
    top: -51px;
    width: 93px;
}

span.arrow {
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 7px solid #000000;
    display: block;
    height: 1px;
    left: 40px;
    position: relative;
    top: 3px;
    width: 1px;
}

div#popup_content {
    margin: 0px;
}

div#popup_header {
    display: flex;
    align-items: center;
    background-color: #003C69;
    color: #ffffff;
    height: 47px;
    line-height: 47px;
    border-radius: 5px 5px 0px 0px;
}

p.popup_form_title {
    margin-bottom: 0;
}

div#popup_forms_hell {
    padding: 30px 0px 0px 0px;
    width: 100%;
    float: left;
    box-sizing: unset;
}

/*.popup_form_title{color:#d7e1e3; font-size:20px; margin:-6px 41px -6px 20px ; width:50px; /*padding:12px 20px; float:left}*/
.popup_form_radio {
    font-size: 12px;
    color: #ffffff;
    width: 270px;
    float: left
}

.popup_field_label {
    color: #323c42;
    font-size: 14px;
    font-weight: bold;
    float: left;
    width: 27%;
    display: inline-block;
    padding-right: 10px;
}

.label_field_label {
    color: #323c42;
    font-size: 14px;
    font-weight: bold;
    float: left;
    width: 27%;
    display: inline-block;
    padding-right: 10px;
    padding-left: 15px;
}

.group-label {
    margin: -15px 0 0 12px;
    width: auto;
    font-size: 30px;
}

.popular_stop_container {
    float: right;
    display: flex;
    flex-direction: row;
    width: 30%
}

.popular_stop_container span {
    display: flex;
    width: 100%;
    margin-left: 40px
}

.popular_stop_container input {
    display: flex;
    width: 50%
}

.popup_field_label_right {
    color: #323c42;
    font-size: 14px;
    font-weight: bold;
    float: left;
    margin-top: 10px
}

.popup_field {
    color: #323c42;
    font-size: 14px;
    float: left;
    width: 66%;
    height: 25px;
    margin: 0px 0 10px 0;
    padding: 5px;
    background-color: #fff;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
    vertical-align: top;
    border: 1px #c1c2c0 solid;
    box-sizing: unset;

}

.popup_field_checkbox {
    color: #323c42;
    font-size: 14px;
    float: left;
    width: 10%;
    height: 25px;
    margin: 0px 0 20px 0;
    padding: 5px;
    background-color: #fff;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
    vertical-align: top;
    border: 1px #c1c2c0 solid;

}

.popup_field_date {
    width: 221px;
    margin-right: 25%;
    position: relative;
    z-index: 1000;
}

.popup_field_summary {
    height: 40px
}

.popup_field_content {
    height: 70px;
}

.popup_field_image {
    width: 223px;
    margin-right: 3%;
    padding: 20px;
}

.popup_field_pdf {
    width: 223px;
    margin-right: 3%
}

.popup_bt {
    margin-left: 20.3%;
    width: 90%;
}

.send_message_bt{
    margin-left: 73.3%;
    width: 10%;
    clear: both;
    float: left;
}

.popup_driver_btn {
    width: 90%;
}

bt_browse {
    border: 1px solid #000;
    border-radius: 6px 6px 6px 6px;
    color: #000;

    float: left;
    font-size: 16px;
    font-weight: bold;
    height: 22px;
    /*margin: 10px 0;*/
    margin-right: 2%;
    padding: 7px 5px;
    text-align: center;
    text-decoration: none;
    text-transform: none;
    width: 80px;
    -webkit-box-shadow: 0 0 1px 1px #fff inset;
    -moz-box-shadow: 0 0 1px 1px #fff inset;
    box-shadow: 0 0 1px 1px #fff inset;
}

bt_browse:hover {
    -webkit-box-shadow: 0 0 1px 0px #979b8f inset;
    -moz-box-shadow: 0 0 1px 0px #979b8f inset;
    box-shadow: 0 0 1px 0px #979b8f inset;
}

a.bt_form {
    border: 1px solid #000;
    border-radius: 6px 6px 6px 6px;
    color: #fff;
    background-color: #003C69;
    display: block;
    float: left;
    font-size: 16px;
    font-weight: bold;
    height: 22px;
    /*margin: 10px 0;*/
    padding: 10px 15px 9px 15px;
    text-align: center;
    text-decoration: none;
    text-transform: none;
    width: 80px;
    -webkit-box-shadow: 0 0 1px 1px #4b4849 inset;
    -moz-box-shadow: 0 0 1px 1px #4b4849 inset;
    box-shadow: 0 0 1px 1px #4b4849 inset;
}

.bt_form {
    border: 1px solid #000;
    border-radius: 6px 6px 6px 6px;
    background-color: #003C69;
    display: block;
    float: left;
    font-size: 16px;
    font-weight: bold;
    /*margin: 10px 0;*/
    margin-right: 4%;
    padding: 10px 20px;
    color: #fff;
    text-align: center;
    text-decoration: none;
    text-transform: none;
    width: 145px;
    -webkit-box-shadow: 0 0 1px 1px #4b4849 inset;
    -moz-box-shadow: 0 0 1px 1px #4b4849 inset;
    box-shadow: 0 0 1px 1px #4b4849 inset;
}



.bt_form_p {
    cursor: pointer;
    border: 1px solid #000;
    border-radius: 6px 6px 6px 6px;
    color: #fff;
    background-color: #003C69;

    float: left;
    font-size: 16px;
    font-weight: bold;
    min-width: 150px;
    /*margin: 10px 0;*/
    margin-right: 4%;
    padding: 10px;
    text-align: center;
    text-decoration: none;
    text-transform: none;

    -webkit-box-shadow: 0 0 1px 1px #4b4849 inset;
    -moz-box-shadow: 0 0 1px 1px #4b4849 inset;
    box-shadow: 0 0 1px 1px #4b4849 inset;
}

.bt_form_p.disable {
    background-color: #BBBBBB;
    color: grey;
    border-color: #BBBBBB;
}

a.bt_form:hover {
    -webkit-box-shadow: 0 0 1px 0px #fff inset;
    -moz-box-shadow: 0 0 1px 0px #fff inset;
    box-shadow: 0 0 1px 0px #fff inset;
    background-color: #453d3f;
    color: #de9172
}

/*####################### POP-UP end #############################*/

/*###################### Date Picker #############################*/
/*! jQuery UI - v1.10.1 - 2013-02-15
* http://jqueryui.com
* Includes: jquery.ui.core.css, jquery.ui.accordion.css, jquery.ui.autocomplete.css, jquery.ui.button.css, jquery.ui.datepicker.css, jquery.ui.dialog.css, jquery.ui.menu.css, jquery.ui.progressbar.css, jquery.ui.resizable.css, jquery.ui.selectable.css, jquery.ui.slider.css, jquery.ui.spinner.css, jquery.ui.tabs.css, jquery.ui.tooltip.css
* Copyright (c) 2013 jQuery Foundation and other contributors Licensed MIT */

.ui-helper-hidden {
    display: none
}

.ui-helper-hidden-accessible {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px
}

.ui-helper-reset {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    line-height: 1.3;
    text-decoration: none;
    font-size: 100%;
    list-style: none
}

.ui-helper-clearfix:before,
.ui-helper-clearfix:after {
    content: "";
    display: table;
    border-collapse: collapse
}

.ui-helper-clearfix:after {
    clear: both
}

.ui-helper-clearfix {
    min-height: 0
}

.ui-helper-zfix {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    position: absolute;
    opacity: 0;
    filter: Alpha(Opacity=0)
}

.ui-front {
    z-index: 100
}

.ui-state-disabled {
    cursor: default !important
}

.ui-icon {
    display: block;
    text-indent: -99999px;
    overflow: hidden;
    background-repeat: no-repeat
}

.ui-widget-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.ui-accordion .ui-accordion-header {
    display: block;
    cursor: pointer;
    position: relative;
    margin-top: 2px;
    padding: .5em .5em .5em .7em;
    min-height: 0
}

.ui-accordion .ui-accordion-icons {
    padding-left: 2.2em
}

.ui-accordion .ui-accordion-noicons {
    padding-left: .7em
}

.ui-accordion .ui-accordion-icons .ui-accordion-icons {
    padding-left: 2.2em
}

.ui-accordion .ui-accordion-header .ui-accordion-header-icon {
    position: absolute;
    left: .5em;
    top: 50%;
    margin-top: -8px
}

.ui-accordion .ui-accordion-content {
    padding: 1em 2.2em;
    border-top: 0;
    overflow: auto
}

.ui-autocomplete {
    position: absolute;
    top: 0;
    left: 0;
    cursor: default
}

.ui-button {
    display: inline-block;
    position: relative;
    padding: 0;
    line-height: normal;
    margin-right: .1em;
    cursor: pointer;
    vertical-align: middle;
    text-align: center;
    overflow: visible
}

.ui-button,
.ui-button:link,
.ui-button:visited,
.ui-button:hover,
.ui-button:active {
    text-decoration: none
}

.ui-button-icon-only {
    width: 2.2em
}

button.ui-button-icon-only {
    width: 2.4em
}

.ui-button-icons-only {
    width: 3.4em
}

button.ui-button-icons-only {
    width: 3.7em
}

.ui-button .ui-button-text {
    display: block;
    line-height: normal
}

.ui-button-text-only .ui-button-text {
    padding: .4em 1em
}

.ui-button-icon-only .ui-button-text,
.ui-button-icons-only .ui-button-text {
    padding: .4em;
    text-indent: -9999999px
}

.ui-button-text-icon-primary .ui-button-text,
.ui-button-text-icons .ui-button-text {
    padding: .4em 1em .4em 2.1em
}

.ui-button-text-icon-secondary .ui-button-text,
.ui-button-text-icons .ui-button-text {
    padding: .4em 2.1em .4em 1em
}

.ui-button-text-icons .ui-button-text {
    padding-left: 2.1em;
    padding-right: 2.1em
}

input.ui-button {
    padding: .4em 1em
}

.ui-button-icon-only .ui-icon,
.ui-button-text-icon-primary .ui-icon,
.ui-button-text-icon-secondary .ui-icon,
.ui-button-text-icons .ui-icon,
.ui-button-icons-only .ui-icon {
    position: absolute;
    top: 50%;
    margin-top: -8px
}

.ui-button-icon-only .ui-icon {
    left: 50%;
    margin-left: -8px
}

.ui-button-text-icon-primary .ui-button-icon-primary,
.ui-button-text-icons .ui-button-icon-primary,
.ui-button-icons-only .ui-button-icon-primary {
    left: .5em
}

.ui-button-text-icon-secondary .ui-button-icon-secondary,
.ui-button-text-icons .ui-button-icon-secondary,
.ui-button-icons-only .ui-button-icon-secondary {
    right: .5em
}

.ui-buttonset {
    margin-right: 7px
}

.ui-buttonset .ui-button {
    margin-left: 0;
    margin-right: -.3em
}

input.ui-button::-moz-focus-inner,
button.ui-button::-moz-focus-inner {
    border: 0;
    padding: 0
}

.ui-datepicker {
    width: 17em;
    padding: .2em .2em 0;
    display: none
}

.ui-datepicker .ui-datepicker-header {
    position: relative;
    padding: .2em 0
}

.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
    position: absolute;
    top: 2px;
    width: 1.8em;
    height: 1.8em
}

.ui-datepicker .ui-datepicker-prev-hover,
.ui-datepicker .ui-datepicker-next-hover {
    top: 1px
}

.ui-datepicker .ui-datepicker-prev {
    left: 2px
}

.ui-datepicker .ui-datepicker-next {
    right: 2px
}

.ui-datepicker .ui-datepicker-prev-hover {
    left: 1px
}

.ui-datepicker .ui-datepicker-next-hover {
    right: 1px
}

.ui-datepicker .ui-datepicker-prev span,
.ui-datepicker .ui-datepicker-next span {
    display: block;
    position: absolute;
    left: 50%;
    margin-left: -8px;
    top: 50%;
    margin-top: -8px
}

.ui-datepicker .ui-datepicker-title {
    margin: 0 2.3em;
    line-height: 1.8em;
    text-align: center
}

.ui-datepicker .ui-datepicker-title select {
    font-size: 1em;
    margin: 1px 0
}

.ui-datepicker select.ui-datepicker-month-year {
    width: 100%
}

.ui-datepicker select.ui-datepicker-month,
.ui-datepicker select.ui-datepicker-year {
    width: 49%
}

.ui-datepicker table {
    width: 100%;
    font-size: .9em;
    border-collapse: collapse;
    margin: 0 0 .4em
}

.ui-datepicker th {
    padding: .7em .3em;
    text-align: center;
    font-weight: bold;
    border: 0
}

.ui-datepicker td {
    border: 0;
    padding: 1px
}

.ui-datepicker td span,
.ui-datepicker td a {
    display: block;
    padding: .2em;
    text-align: right;
    text-decoration: none
}

.ui-datepicker .ui-datepicker-buttonpane {
    background-image: none;
    margin: .7em 0 0 0;
    padding: 0 .2em;
    border-left: 0;
    border-right: 0;
    border-bottom: 0
}

.ui-datepicker .ui-datepicker-buttonpane button {
    float: right;
    margin: .5em .2em .4em;
    cursor: pointer;
    padding: .2em .6em .3em .6em;
    width: auto;
    overflow: visible;
    font-size: 16px;
}

.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current {
    float: left
}

.ui-datepicker.ui-datepicker-multi {
    width: auto
}

.ui-datepicker-multi .ui-datepicker-group {
    float: left
}

.ui-datepicker-multi .ui-datepicker-group table {
    width: 95%;
    margin: 0 auto .4em
}

.ui-datepicker-multi-2 .ui-datepicker-group {
    width: 50%
}

.ui-datepicker-multi-3 .ui-datepicker-group {
    width: 33.3%
}

.ui-datepicker-multi-4 .ui-datepicker-group {
    width: 25%
}

.ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header,
.ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header {
    border-left-width: 0
}

.ui-datepicker-multi .ui-datepicker-buttonpane {
    clear: left
}

.ui-datepicker-row-break {
    clear: both;
    width: 100%;
    font-size: 0
}

.ui-datepicker-rtl {
    direction: rtl
}

.ui-datepicker-rtl .ui-datepicker-prev {
    right: 2px;
    left: auto
}

.ui-datepicker-rtl .ui-datepicker-next {
    left: 2px;
    right: auto
}

.ui-datepicker-rtl .ui-datepicker-prev:hover {
    right: 1px;
    left: auto
}

.ui-datepicker-rtl .ui-datepicker-next:hover {
    left: 1px;
    right: auto
}

.ui-datepicker-rtl .ui-datepicker-buttonpane {
    clear: right
}

.ui-datepicker-rtl .ui-datepicker-buttonpane button {
    float: left
}

.ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current,
.ui-datepicker-rtl .ui-datepicker-group {
    float: right
}

.ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header,
.ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header {
    border-right-width: 0;
    border-left-width: 1px
}

.ui-dialog {
    position: absolute;
    top: 0;
    left: 0;
    padding: .2em;
    outline: 0
}

.ui-dialog .ui-dialog-titlebar {
    padding: .4em 1em;
    position: relative
}

.ui-dialog .ui-dialog-title {
    float: left;
    margin: .1em 0;
    white-space: nowrap;
    width: 90%;
    overflow: hidden;
    text-overflow: ellipsis
}

.ui-dialog .ui-dialog-titlebar-close {
    position: absolute;
    right: .3em;
    top: 50%;
    width: 21px;
    margin: -10px 0 0 0;
    padding: 1px;
    height: 20px
}

.ui-dialog .ui-dialog-content {
    position: relative;
    border: 0;
    padding: .5em 1em;
    background: none;
    overflow: auto
}

.ui-dialog .ui-dialog-buttonpane {
    text-align: left;
    border-width: 1px 0 0 0;
    background-image: none;
    margin-top: .5em;
    padding: .3em 1em .5em .4em
}

.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
    float: right
}

.ui-dialog .ui-dialog-buttonpane button {
    margin: .5em .4em .5em 0;
    cursor: pointer
}

.ui-dialog .ui-resizable-se {
    width: 12px;
    height: 12px;
    right: -5px;
    bottom: -5px;
    background-position: 16px 16px
}

.ui-draggable .ui-dialog-titlebar {
    cursor: move
}

.ui-menu {
    list-style: none;
    padding: 2px;
    margin: 0;
    display: block;
    outline: none
}

.ui-menu .ui-menu {
    margin-top: -3px;
    position: absolute
}

.ui-menu .ui-menu-item {
    margin: 0;
    padding: 0;
    width: 100%
}

.ui-menu .ui-menu-divider {
    margin: 5px -2px 5px -2px;
    height: 0;
    font-size: 0;
    line-height: 0;
    border-width: 1px 0 0 0
}

.ui-menu .ui-menu-item a {
    text-decoration: none;
    display: block;
    padding: 2px .4em;
    line-height: 1.5;
    min-height: 0;
    font-weight: normal
}

.ui-menu .ui-menu-item a.ui-state-focus,
.ui-menu .ui-menu-item a.ui-state-active {
    font-weight: normal;
    margin: -1px
}

.ui-menu .ui-state-disabled {
    font-weight: normal;
    margin: .4em 0 .2em;
    line-height: 1.5
}

.ui-menu .ui-state-disabled a {
    cursor: default
}

.ui-menu-icons {
    position: relative
}

.ui-menu-icons .ui-menu-item a {
    position: relative;
    padding-left: 2em
}

.ui-menu .ui-icon {
    position: absolute;
    top: .2em;
    left: .2em
}

.ui-menu .ui-menu-icon {
    position: static;
    float: right
}

.ui-progressbar {
    height: 2em;
    text-align: left;
    overflow: hidden
}

.ui-progressbar .ui-progressbar-value {
    margin: -1px;
    height: 100%
}

.ui-progressbar .ui-progressbar-overlay {
    background: url("../images/loading.gif");
    height: 100%;
    filter: alpha(opacity=25);
    opacity: 0.25
}

.ui-progressbar-indeterminate .ui-progressbar-value {
    background-image: none
}

.ui-resizable {
    position: relative
}

.ui-resizable-handle {
    position: absolute;
    font-size: 0.1px;
    display: block
}

.ui-resizable-disabled .ui-resizable-handle,
.ui-resizable-autohide .ui-resizable-handle {
    display: none
}

.ui-resizable-n {
    cursor: n-resize;
    height: 7px;
    width: 100%;
    top: -5px;
    left: 0
}

.ui-resizable-s {
    cursor: s-resize;
    height: 7px;
    width: 100%;
    bottom: -5px;
    left: 0
}

.ui-resizable-e {
    cursor: e-resize;
    width: 7px;
    right: -5px;
    top: 0;
    height: 100%
}

.ui-resizable-w {
    cursor: w-resize;
    width: 7px;
    left: -5px;
    top: 0;
    height: 100%
}

.ui-resizable-se {
    cursor: se-resize;
    width: 12px;
    height: 12px;
    right: 1px;
    bottom: 1px
}

.ui-resizable-sw {
    cursor: sw-resize;
    width: 9px;
    height: 9px;
    left: -5px;
    bottom: -5px
}

.ui-resizable-nw {
    cursor: nw-resize;
    width: 9px;
    height: 9px;
    left: -5px;
    top: -5px
}

.ui-resizable-ne {
    cursor: ne-resize;
    width: 9px;
    height: 9px;
    right: -5px;
    top: -5px
}

.ui-selectable-helper {
    position: absolute;
    z-index: 100;
    border: 1px dotted black
}

.ui-slider {
    position: relative;
    text-align: left
}

.ui-slider .ui-slider-handle {
    position: absolute;
    z-index: 2;
    width: 1.2em;
    height: 1.2em;
    cursor: default
}

.ui-slider .ui-slider-range {
    position: absolute;
    z-index: 1;
    font-size: .7em;
    display: block;
    border: 0;
    background-position: 0 0
}

.ui-slider.ui-state-disabled .ui-slider-handle,
.ui-slider.ui-state-disabled .ui-slider-range {
    filter: inherit
}

.ui-slider-horizontal {
    height: .8em
}

.ui-slider-horizontal .ui-slider-handle {
    top: -.3em;
    margin-left: -.6em
}

.ui-slider-horizontal .ui-slider-range {
    top: 0;
    height: 100%
}

.ui-slider-horizontal .ui-slider-range-min {
    left: 0
}

.ui-slider-horizontal .ui-slider-range-max {
    right: 0
}

.ui-slider-vertical {
    width: .8em;
    height: 100px
}

.ui-slider-vertical .ui-slider-handle {
    left: -.3em;
    margin-left: 0;
    margin-bottom: -.6em
}

.ui-slider-vertical .ui-slider-range {
    left: 0;
    width: 100%
}

.ui-slider-vertical .ui-slider-range-min {
    bottom: 0
}

.ui-slider-vertical .ui-slider-range-max {
    top: 0
}

.ui-spinner {
    position: relative;
    display: inline-block;
    overflow: hidden;
    padding: 0;
    vertical-align: middle
}

.ui-spinner-input {
    border: none;
    background: none;
    color: inherit;
    padding: 0;
    margin: .2em 0;
    vertical-align: middle;
    margin-left: .4em;
    margin-right: 22px
}

.ui-spinner-button {
    width: 16px;
    height: 50%;
    font-size: .5em;
    padding: 0;
    margin: 0;
    text-align: center;
    position: absolute;
    cursor: default;
    display: block;
    overflow: hidden;
    right: 0
}

.ui-spinner a.ui-spinner-button {
    border-top: none;
    border-bottom: none;
    border-right: none
}

.ui-spinner .ui-icon {
    position: absolute;
    margin-top: -8px;
    top: 50%;
    left: 0
}

.ui-spinner-up {
    top: 0
}

.ui-spinner-down {
    bottom: 0
}

.ui-spinner .ui-icon-triangle-1-s {
    background-position: -65px -16px
}

.ui-tabs {
    position: relative;
    padding: .2em
}

.ui-tabs .ui-tabs-nav {
    margin: 0;
    padding: .2em .2em 0
}

.ui-tabs .ui-tabs-nav li {
    list-style: none;
    float: left;
    position: relative;
    top: 0;
    margin: 1px .2em 0 0;
    border-bottom: 0;
    padding: 0;
    white-space: nowrap
}

.ui-tabs .ui-tabs-nav li a {
    float: left;
    padding: .5em 1em;
    text-decoration: none
}

.ui-tabs .ui-tabs-nav li.ui-tabs-active {
    margin-bottom: -1px;
    padding-bottom: 1px
}

.ui-tabs .ui-tabs-nav li.ui-tabs-active::before,
.tab-slider--trigger.active::before {
    content: '';
    position: absolute;
    width: calc(100% + 2px);
    height: 4px;
    bottom: 0;
    left: -1px;
    background-color: #eed009;
}

.ui-tabs .ui-tabs-nav li.ui-tabs-active a,
.ui-tabs .ui-tabs-nav li.ui-state-disabled a,
.ui-tabs .ui-tabs-nav li.ui-tabs-loading a {
    cursor: text
}

.ui-tabs .ui-tabs-nav li a,
.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-active a {
    cursor: pointer
}

.ui-tabs .ui-tabs-panel {
    display: block;
    border-width: 0;
    padding: 1em 1.4em;
    background: none
}

.ui-tooltip {
    padding: 8px;
    position: absolute;
    z-index: 9999;
    max-width: 300px;
    -webkit-box-shadow: 0 0 5px #aaa;
    box-shadow: 0 0 5px #aaa
}


body .ui-tooltip {
    border-width: 2px
}

/*! jQuery UI - v1.10.1 - 2013-02-15
* http://jqueryui.com
* Includes: jquery.ui.theme.css
* Copyright 2013 jQuery Foundation and other contributors; Licensed MIT */
.ui-widget {
    font-family: Verdana, Arial, sans-serif;
    font-size: 1.1em
}

.ui-widget .ui-widget {
    font-size: 1em
}

.ui-widget input,
.ui-widget select,
.ui-widget textarea,
.ui-widget button {
    font-family: Verdana, Arial, sans-serif;
    font-size: 1em
}

.ui-widget-content {
    border: 1px solid #aaa;
    background: #fff url(../images/ui-bg_flat_75_ffffff_40x100.png) 50% 50% repeat-x;
    color: #222
}

.ui-widget-content a {
    color: #222
}

.ui-widget-header {
    border: 1px solid #aaa;
    background: #ccc
        /*url(../images/ui-bg_highlight-soft_75_cccccc_1x100.png)*/
        50% 50% repeat-x;
    color: #222;
    font-weight: bold
}

.ui-widget-header a {
    color: #222
}

.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default {
    border: 1px solid #d3d3d3;
    background: #e6e6e6
        /*url(../images/ui-bg_glass_75_e6e6e6_1x400.png)*/
        50% 50% repeat-x;
    font-weight: normal;
    color: #555
}

.ui-state-default a,
.ui-state-default a:link,
.ui-state-default a:visited {
    color: #555;
    text-decoration: none
}

.ui-state-hover,
.ui-widget-content .ui-state-hover,
.ui-widget-header .ui-state-hover,
.ui-state-focus,
.ui-widget-content .ui-state-focus,
.ui-widget-header .ui-state-focus {
    border: 1px solid #999;
    background: #dadada url(../images/ui-bg_glass_75_dadada_1x400.png) 50% 50% repeat-x;
    font-weight: normal;
    color: #212121
}

.ui-state-hover a,
.ui-state-hover a:hover,
.ui-state-hover a:link,
.ui-state-hover a:visited {
    color: #212121;
    text-decoration: none
}

.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active {
    border: 1px solid #aaa;
    background: #fff url(../images/ui-bg_glass_65_ffffff_1x400.png) 50% 50% repeat-x;
    font-weight: normal;
    color: #212121
}

.ui-state-active a,
.ui-state-active a:link,
.ui-state-active a:visited {
    color: #212121;
    text-decoration: none
}

.ui-state-highlight,
.ui-widget-content .ui-state-highlight,
.ui-widget-header .ui-state-highlight {
    border: 1px solid #fcefa1;
    background: #fbf9ee url(../images/ui-bg_glass_55_fbf9ee_1x400.png) 50% 50% repeat-x;
    color: #363636
}

.ui-state-highlight a,
.ui-widget-content .ui-state-highlight a,
.ui-widget-header .ui-state-highlight a {
    color: #363636
}

.ui-state-error,
.ui-widget-content .ui-state-error,
.ui-widget-header .ui-state-error {
    border: 1px solid #cd0a0a;
    background: #fef1ec url(../images/ui-bg_glass_95_fef1ec_1x400.png) 50% 50% repeat-x;
    color: #cd0a0a
}

.ui-state-error a,
.ui-widget-content .ui-state-error a,
.ui-widget-header .ui-state-error a {
    color: #cd0a0a
}

.ui-state-error-text,
.ui-widget-content .ui-state-error-text,
.ui-widget-header .ui-state-error-text {
    color: #cd0a0a
}

.ui-priority-primary,
.ui-widget-content .ui-priority-primary,
.ui-widget-header .ui-priority-primary {
    font-weight: bold
}

.ui-priority-secondary,
.ui-widget-content .ui-priority-secondary,
.ui-widget-header .ui-priority-secondary {
    opacity: .7;
    filter: Alpha(Opacity=70);
    font-weight: normal
}

.ui-state-disabled,
.ui-widget-content .ui-state-disabled,
.ui-widget-header .ui-state-disabled {
    opacity: .35;
    filter: Alpha(Opacity=35);
    background-image: none
}

.ui-state-disabled .ui-icon {
    filter: Alpha(Opacity=35)
}

.ui-icon {
    width: 16px;
    height: 16px;
    background-position: 16px 16px
}

.ui-icon,
.ui-widget-content .ui-icon {
    background-image: url(../images/ui-icons_222222_256x240.png)
}

.ui-widget-header .ui-icon {
    background-image: url(../images/ui-icons_222222_256x240.png)
}

.ui-state-default .ui-icon {
    background-image: url(../images/ui-icons_888888_256x240.png)
}

.ui-state-hover .ui-icon,
.ui-state-focus .ui-icon {
    background-image: url(../images/ui-icons_454545_256x240.png)
}

.ui-state-active .ui-icon {
    background-image: url(../images/ui-icons_454545_256x240.png)
}

.ui-state-highlight .ui-icon {
    background-image: url(../images/ui-icons_2e83ff_256x240.png)
}

.ui-state-error .ui-icon,
.ui-state-error-text .ui-icon {
    background-image: url(../images/ui-icons_cd0a0a_256x240.png)
}

.ui-icon-carat-1-n {
    background-position: 0 0
}

.ui-icon-carat-1-ne {
    background-position: -16px 0
}

.ui-icon-carat-1-e {
    background-position: -32px 0
}

.ui-icon-carat-1-se {
    background-position: -48px 0
}

.ui-icon-carat-1-s {
    background-position: -64px 0
}

.ui-icon-carat-1-sw {
    background-position: -80px 0
}

.ui-icon-carat-1-w {
    background-position: -96px 0
}

.ui-icon-carat-1-nw {
    background-position: -112px 0
}

.ui-icon-carat-2-n-s {
    background-position: -128px 0
}

.ui-icon-carat-2-e-w {
    background-position: -144px 0
}

.ui-icon-triangle-1-n {
    background-position: 0 -16px
}

.ui-icon-triangle-1-ne {
    background-position: -16px -16px
}

.ui-icon-triangle-1-e {
    background-position: -32px -16px
}

.ui-icon-triangle-1-se {
    background-position: -48px -16px
}

.ui-icon-triangle-1-s {
    background-position: -64px -16px
}

.ui-icon-triangle-1-sw {
    background-position: -80px -16px
}

.ui-icon-triangle-1-w {
    background-position: -96px -16px
}

.ui-icon-triangle-1-nw {
    background-position: -112px -16px
}

.ui-icon-triangle-2-n-s {
    background-position: -128px -16px
}

.ui-icon-triangle-2-e-w {
    background-position: -144px -16px
}

.ui-icon-arrow-1-n {
    background-position: 0 -32px
}

.ui-icon-arrow-1-ne {
    background-position: -16px -32px
}

.ui-icon-arrow-1-e {
    background-position: -32px -32px
}

.ui-icon-arrow-1-se {
    background-position: -48px -32px
}

.ui-icon-arrow-1-s {
    background-position: -64px -32px
}

.ui-icon-arrow-1-sw {
    background-position: -80px -32px
}

.ui-icon-arrow-1-w {
    background-position: -96px -32px
}

.ui-icon-arrow-1-nw {
    background-position: -112px -32px
}

.ui-icon-arrow-2-n-s {
    background-position: -128px -32px
}

.ui-icon-arrow-2-ne-sw {
    background-position: -144px -32px
}

.ui-icon-arrow-2-e-w {
    background-position: -160px -32px
}

.ui-icon-arrow-2-se-nw {
    background-position: -176px -32px
}

.ui-icon-arrowstop-1-n {
    background-position: -192px -32px
}

.ui-icon-arrowstop-1-e {
    background-position: -208px -32px
}

.ui-icon-arrowstop-1-s {
    background-position: -224px -32px
}

.ui-icon-arrowstop-1-w {
    background-position: -240px -32px
}

.ui-icon-arrowthick-1-n {
    background-position: 0 -48px
}

.ui-icon-arrowthick-1-ne {
    background-position: -16px -48px
}

.ui-icon-arrowthick-1-e {
    background-position: -32px -48px
}

.ui-icon-arrowthick-1-se {
    background-position: -48px -48px
}

.ui-icon-arrowthick-1-s {
    background-position: -64px -48px
}

.ui-icon-arrowthick-1-sw {
    background-position: -80px -48px
}

.ui-icon-arrowthick-1-w {
    background-position: -96px -48px
}

.ui-icon-arrowthick-1-nw {
    background-position: -112px -48px
}

.ui-icon-arrowthick-2-n-s {
    background-position: -128px -48px
}

.ui-icon-arrowthick-2-ne-sw {
    background-position: -144px -48px
}

.ui-icon-arrowthick-2-e-w {
    background-position: -160px -48px
}

.ui-icon-arrowthick-2-se-nw {
    background-position: -176px -48px
}

.ui-icon-arrowthickstop-1-n {
    background-position: -192px -48px
}

.ui-icon-arrowthickstop-1-e {
    background-position: -208px -48px
}

.ui-icon-arrowthickstop-1-s {
    background-position: -224px -48px
}

.ui-icon-arrowthickstop-1-w {
    background-position: -240px -48px
}

.ui-icon-arrowreturnthick-1-w {
    background-position: 0 -64px
}

.ui-icon-arrowreturnthick-1-n {
    background-position: -16px -64px
}

.ui-icon-arrowreturnthick-1-e {
    background-position: -32px -64px
}

.ui-icon-arrowreturnthick-1-s {
    background-position: -48px -64px
}

.ui-icon-arrowreturn-1-w {
    background-position: -64px -64px
}

.ui-icon-arrowreturn-1-n {
    background-position: -80px -64px
}

.ui-icon-arrowreturn-1-e {
    background-position: -96px -64px
}

.ui-icon-arrowreturn-1-s {
    background-position: -112px -64px
}

.ui-icon-arrowrefresh-1-w {
    background-position: -128px -64px
}

.ui-icon-arrowrefresh-1-n {
    background-position: -144px -64px
}

.ui-icon-arrowrefresh-1-e {
    background-position: -160px -64px
}

.ui-icon-arrowrefresh-1-s {
    background-position: -176px -64px
}

.ui-icon-arrow-4 {
    background-position: 0 -80px
}

.ui-icon-arrow-4-diag {
    background-position: -16px -80px
}

.ui-icon-extlink {
    background-position: -32px -80px
}

.ui-icon-newwin {
    background-position: -48px -80px
}

.ui-icon-refresh {
    background-position: -64px -80px
}

.ui-icon-shuffle {
    background-position: -80px -80px
}

.ui-icon-transfer-e-w {
    background-position: -96px -80px
}

.ui-icon-transferthick-e-w {
    background-position: -112px -80px
}

.ui-icon-folder-collapsed {
    background-position: 0 -96px
}

.ui-icon-folder-open {
    background-position: -16px -96px
}

.ui-icon-document {
    background-position: -32px -96px
}

.ui-icon-document-b {
    background-position: -48px -96px
}

.ui-icon-note {
    background-position: -64px -96px
}

.ui-icon-mail-closed {
    background-position: -80px -96px
}

.ui-icon-mail-open {
    background-position: -96px -96px
}

.ui-icon-suitcase {
    background-position: -112px -96px
}

.ui-icon-comment {
    background-position: -128px -96px
}

.ui-icon-person {
    background-position: -144px -96px
}

.ui-icon-print {
    background-position: -160px -96px
}

.ui-icon-trash {
    background-position: -176px -96px
}

.ui-icon-locked {
    background-position: -192px -96px
}

.ui-icon-unlocked {
    background-position: -208px -96px
}

.ui-icon-bookmark {
    background-position: -224px -96px
}

.ui-icon-tag {
    background-position: -240px -96px
}

.ui-icon-home {
    background-position: 0 -112px
}

.ui-icon-flag {
    background-position: -16px -112px
}

.ui-icon-calendar {
    background-position: -32px -112px
}

.ui-icon-cart {
    background-position: -48px -112px
}

.ui-icon-pencil {
    background-position: -64px -112px
}

.ui-icon-clock {
    background-position: -80px -112px
}

.ui-icon-disk {
    background-position: -96px -112px
}

.ui-icon-calculator {
    background-position: -112px -112px
}

.ui-icon-zoomin {
    background-position: -128px -112px
}

.ui-icon-zoomout {
    background-position: -144px -112px
}

.ui-icon-search {
    background-position: -160px -112px
}

.ui-icon-wrench {
    background-position: -176px -112px
}

.ui-icon-gear {
    background-position: -192px -112px
}

.ui-icon-heart {
    background-position: -208px -112px
}

.ui-icon-star {
    background-position: -224px -112px
}

.ui-icon-link {
    background-position: -240px -112px
}

.ui-icon-cancel {
    background-position: 0 -128px
}

.ui-icon-plus {
    background-position: -16px -128px
}

.ui-icon-plusthick {
    background-position: -32px -128px
}

.ui-icon-minus {
    background-position: -48px -128px
}

.ui-icon-minusthick {
    background-position: -64px -128px
}

.ui-icon-close {
    background-position: -80px -128px
}

.ui-icon-closethick {
    background-position: -96px -128px
}

.ui-icon-key {
    background-position: -112px -128px
}

.ui-icon-lightbulb {
    background-position: -128px -128px
}

.ui-icon-scissors {
    background-position: -144px -128px
}

.ui-icon-clipboard {
    background-position: -160px -128px
}

.ui-icon-copy {
    background-position: -176px -128px
}

.ui-icon-contact {
    background-position: -192px -128px
}

.ui-icon-image {
    background-position: -208px -128px
}

.ui-icon-video {
    background-position: -224px -128px
}

.ui-icon-script {
    background-position: -240px -128px
}

.ui-icon-alert {
    background-position: 0 -144px
}

.ui-icon-info {
    background-position: -16px -144px
}

.ui-icon-notice {
    background-position: -32px -144px
}

.ui-icon-help {
    background-position: -48px -144px
}

.ui-icon-check {
    background-position: -64px -144px
}

.ui-icon-bullet {
    background-position: -80px -144px
}

.ui-icon-radio-on {
    background-position: -96px -144px
}

.ui-icon-radio-off {
    background-position: -112px -144px
}

.ui-icon-pin-w {
    background-position: -128px -144px
}

.ui-icon-pin-s {
    background-position: -144px -144px
}

.ui-icon-play {
    background-position: 0 -160px
}

.ui-icon-pause {
    background-position: -16px -160px
}

.ui-icon-seek-next {
    background-position: -32px -160px
}

.ui-icon-seek-prev {
    background-position: -48px -160px
}

.ui-icon-seek-end {
    background-position: -64px -160px
}

.ui-icon-seek-start {
    background-position: -80px -160px
}

.ui-icon-seek-first {
    background-position: -80px -160px
}

.ui-icon-stop {
    background-position: -96px -160px
}

.ui-icon-eject {
    background-position: -112px -160px
}

.ui-icon-volume-off {
    background-position: -128px -160px
}

.ui-icon-volume-on {
    background-position: -144px -160px
}

.ui-icon-power {
    background-position: 0 -176px
}

.ui-icon-signal-diag {
    background-position: -16px -176px
}

.ui-icon-signal {
    background-position: -32px -176px
}

.ui-icon-battery-0 {
    background-position: -48px -176px
}

.ui-icon-battery-1 {
    background-position: -64px -176px
}

.ui-icon-battery-2 {
    background-position: -80px -176px
}

.ui-icon-battery-3 {
    background-position: -96px -176px
}

.ui-icon-circle-plus {
    background-position: 0 -192px
}

.ui-icon-circle-minus {
    background-position: -16px -192px
}

.ui-icon-circle-close {
    background-position: -32px -192px
}

.ui-icon-circle-triangle-e {
    background-position: -48px -192px
}

.ui-icon-circle-triangle-s {
    background-position: -64px -192px
}

.ui-icon-circle-triangle-w {
    background-position: -80px -192px
}

.ui-icon-circle-triangle-n {
    background-position: -96px -192px
}

.ui-icon-circle-arrow-e {
    background-position: -112px -192px
}

.ui-icon-circle-arrow-s {
    background-position: -128px -192px
}

.ui-icon-circle-arrow-w {
    background-position: -144px -192px
}

.ui-icon-circle-arrow-n {
    background-position: -160px -192px
}

.ui-icon-circle-zoomin {
    background-position: -176px -192px
}

.ui-icon-circle-zoomout {
    background-position: -192px -192px
}

.ui-icon-circle-check {
    background-position: -208px -192px
}

.ui-icon-circlesmall-plus {
    background-position: 0 -208px
}

.ui-icon-circlesmall-minus {
    background-position: -16px -208px
}

.ui-icon-circlesmall-close {
    background-position: -32px -208px
}

.ui-icon-squaresmall-plus {
    background-position: -48px -208px
}

.ui-icon-squaresmall-minus {
    background-position: -64px -208px
}

.ui-icon-squaresmall-close {
    background-position: -80px -208px
}

.ui-icon-grip-dotted-vertical {
    background-position: 0 -224px
}

.ui-icon-grip-dotted-horizontal {
    background-position: -16px -224px
}

.ui-icon-grip-solid-vertical {
    background-position: -32px -224px
}

.ui-icon-grip-solid-horizontal {
    background-position: -48px -224px
}

.ui-icon-gripsmall-diagonal-se {
    background-position: -64px -224px
}

.ui-icon-grip-diagonal-se {
    background-position: -80px -224px
}

.ui-corner-all,
.ui-corner-top,
.ui-corner-left,
.ui-corner-tl {
    border-top-left-radius: 4px
}

.ui-corner-all,
.ui-corner-top,
.ui-corner-right,
.ui-corner-tr {
    border-top-right-radius: 4px
}

.ui-corner-all,
.ui-corner-bottom,
.ui-corner-left,
.ui-corner-bl {
    border-bottom-left-radius: 4px
}

.ui-corner-all,
.ui-corner-bottom,
.ui-corner-right,
.ui-corner-br {
    border-bottom-right-radius: 4px
}

.ui-widget-overlay {
    background: #aaa url(../images/ui-bg_flat_0_aaaaaa_40x100.png) 50% 50% repeat-x;
    opacity: .3;
    filter: Alpha(Opacity=30)
}

.ui-widget-shadow {
    margin: -8px 0 0 -8px;
    padding: 8px;
    background: #aaa url(../images/ui-bg_flat_0_aaaaaa_40x100.png) 50% 50% repeat-x;
    opacity: .3;
    filter: Alpha(Opacity=30);
    border-radius: 8px
}


/*################################ TimePicker Start ##################################*/

.ui-timepicker-div .ui-widget-header {
    margin-bottom: 8px;
}
abbr {
    text-decoration: none !important;
}

.ui-timepicker-div dl {
    text-align: left;
}

.ui-timepicker-div dl dt {
    height: 25px;
    margin-bottom: -25px;
    font-size: 16px;
}

.ui-timepicker-div dl dd {
    margin: 0 10px 10px 65px;
    font-size: 16px;
}

.ui-timepicker-div td {
    font-size: 90%;
}

.ui-tpicker-grid-label {
    background: none;
    border: none;
    margin: 0;
    padding: 0;
}

.ui-timepicker-rtl {
    direction: rtl;
}

.ui-timepicker-rtl dl {
    text-align: right;
}

.ui-timepicker-rtl dl dd {
    margin: 0 65px 10px 10px;
}

/*################################ TimePicker End ##################################*/






#loading {
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    position: fixed;
    display: block;
    opacity: 0.7;
    background-image: url('../source/fancybox_overlay.png');
    z-index: 99;
    text-align: center;
    z-index: 9999999999999999999;
}

#loading-image {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 100;
    background-image: url('../source/fancybox_sprite@2x.png');
    background-size: 80px 152px;
    /*The size of the normal image, half the size of the hi-res image*/
    background-position: 0 -108px;

}

.footer-link {
    text-align: center;
    padding-top: 10px;
}

.generate-excel {
    border: 1px solid #000;
    border-radius: 6px 6px 6px 6px;
    color: #000000;
    background-color: #BFBEBE;
    float: left;
    margin-left: 10px;
    font-size: 14px;
    padding: 10px;
    text-align: center;
    text-decoration: none;
    text-transform: none;
    cursor: pointer;
}


.float-right {
    float: right;
}

.passeger_fieldset {
    margin-bottom: 20px;
    border: 2px solid #BBBCB9;
    border-radius: 6px 6px 6px 6px;
}

.passenger_save_btn {
    margin-left: 400px;
    cursor: pointer;
    display: block;
    width: 500px;
    height: 50px;
}

.passenger_route_stop {
    padding-top: 20px;
    height: 45px;
}

table.dataTable tr.odd {
    background-color: #E2E4FF;
}

table.dataTable tr.even {
    background-color: white;
}

.message-read {
    color: blue !important;
}

/*smartcard add/edit*/

#add_edit_smart_card {
    min-height: 450px;
}

.item_block {
    clear: both;
}

.item_block select {
    min-width: 432px;
}

.item_block textarea {
    margin-bottom: 5px;
}

#add_edit_smart_card .bt_form {
    width: 200px;
}

.short_text {
    width: 430px;
    min-height: 100px;
}

.smartcard_container {
    display: none;
}

/*popup stop-order*/
.stop-order-container {
    margin: auto;
    text-align: center;
    width: 1300px;
}

.stop-order-container .content {
    padding: 10px;
}

.stop-order-container .description {
    text-align: left;
    /*font-weight: bold;*/
}

.stop-order-container .description span {
    font-weight: bold;
}

.stop-order-container header {
    text-align: left;
    background: grey;
    color: white;
}

.stops-list {
    display: inline-block;
    border: 2px solid grey;
    margin-right: 10px;
    float: left;
    width: 625px;
    height: 620px
}

.stops-order {
    display: inline-block;
    border: 2px solid grey;
    float: left;
    width: 625px;
    height: 540px;
}

#stops_order_filter,
#stops_list_filter {
    margin-right: 20px
}

.buttons-area button {
    margin-top: 10px;
    margin-right: 25px;
    width: 100px;
    line-height: 30px;
    font-size: 18px;
    position: absolute;
    bottom: 10px;
    right: 0;
}

#stops_list td:first-child {
    text-align: left
}

#stops_list td:nth-child(2) {
    text-align: center
}

#stops_order td:nth-child(2) {
    text-align: left
}

#stops_order td:nth-child(1) {
    text-align: center
}

#stops_order_filter,
#stops_list_filter,
#example_filter,
#example1_filter {
    margin-bottom: 10px !important
}

/*@JIRA TSM-240*/
.btn-tracking-bus, .btn-send-message {
    width: 20px;
    height: 20px;
    cursor: pointer;
}
.btn-send-message {
    width: 20px;
}
button.btn-tracking-bus, button.btn-send-message {
    border: none;
    background-color: transparent;
}

/*@JIRA TSM-424*/
a.btn-public-view {
    width: 83%;
    padding: 5px 10px;
    border: 1px solid;
    background-color: honeydew;
    text-align: center;
    margin-top: 0;
    display: inline-block;
}

iframe[name='JSD widget'] {
    display: block;
    right: unset;
    left: 10px;
    bottom: 10px;
}

.BeaconFabButtonFrame {
    bottom: 20px !important;
}

.generate_report {
    margin-top: 20px;
}

.freeze_table_container {
    max-width: 100%;
    max-height: 900px;
    overflow: scroll;
    position: relative;
    font-size: .75rem;
    font-family: Roboto, sans-serif;
}

.freeze_table table {
    position: relative;
    table-layout: fixed;
    border-collapse: collapse;
}

.freeze_table td,
.freeze_table th {
    padding: 0.25em;
    min-width: 8em;
}

.freeze_table thead th {
    position: -webkit-sticky;
    /* for Safari */
    position: sticky;
    top: 0;
    background: #eee;
    border-right: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    height: 60px;
    color: rgba(0, 0, 0, .87);
    z-index: 1;
}

.freeze_table thead th:first-child {
    left: 0;
    z-index: 99;
}

.freeze_table tbody th {
    position: -webkit-sticky;
    position: sticky;
    left: 0;
    background: #eee;
    border-bottom: 1px solid #ddd;
    width: 100px;
    z-index: 9;
}

a.zones_travelled_chart {
    width: 200px;
}

.dataTables_wrapper {
    padding-top: 25px;
}

.freeze_table {
    text-align: center;
}

.freeze_table input {
    text-align: center;
}

.freeze_table th {
    text-align: center;
}

.freeze_table .v-text-field {
    margin: 0;
    padding: 0
}

.freeze_table td {
    border-right: 1px solid #eee;
    border-bottom: 1px solid #eee;
}

.v-card-handbook {
    height: 100%;
}
.v-card-expand {
    height: 100%;
}
.v-btn {
    text-transform: none;
  }
.v-application .btn-handbook {
    float: right;
}
.mpa {
    padding-bottom: 25px;
}
div.v-card__actions {
    padding: 0;
}
.v-btn-handbook {
    background-color: #67C4F1;
    color: white;
}
.v-btn-handbook span.v-btn__content {
    color: white;
}
.alertify .ajs-dialog {
    top: 50%;
    transform: translateY(-50%);
    margin: auto;
}

.paginate_button {
    cursor: pointer;
}
.paginate_button::after {
    content: " ";
}
/* TME-239 */
.manual_token {
    color: #1e73fe;
    font-size: 16px;
}

.input_manual_token {
    color: #003C69;
    border: 1px solid #003C69;
    text-align: center;
    font-weight: bold;
    width: 240px;
    height: 30px;
    font-size: 16px;
    margin-top: -10px;
    -webkit-text-fill-color: #003C69;
}

.alertify-notifier.ajs-right {
    z-index: 999999;
}
.bt_form:hover {
    cursor: pointer;
}
.bt_form:disabled {
    opacity: 0.3;
}

.alertify .ajs-modal { 
    z-index: 9999 !important;
}

.dataTables_filter input{
    margin-left: 5px;
    height: 30px;
    font-size: 15px;
}

.hidden-text,
.hidden-text label {
    font-size: 0 !important;
    font-weight: 700;
    padding: 0 !important;
    margin: 0 !important;
}

.hidden-text span.v-btn__content {
    color: #003C69;
}

.hidden-element {
    display: block;
    width: 0;
    height: 0;
    overflow: hidden;
    padding: 0 !important;
    margin: 0 !important;
}
.skip-link {
    position: absolute;
    left: -10000px;
    top: auto;
    width: 1px;
    height: 1px;
    overflow: hidden;
    background-color: #003C69;
    padding: 5px;
    text-decoration: underline;
    color: white !important;
}

.skip-link:focus {
    position: static;
    width: auto;
    height: auto;
}

.theme--light.v-data-table .v-data-table__empty-wrapper {
    color: #000 !important;
}

body .v-application .primary {
    background-color: #003C69 !important;
    border-color: #003C69 !important;
}

.v-application .v-list-item:not(.v-list-item--active):hover,
.v-application .v-list-item:not(.v-list-item--active):focus,
.v-application .v-list-item.v-list-item--active  {
    background-color: #003C69 !important;
    border-color: #003C69 ;
    color: #FFF !important;
}

.v-list-item:not(.v-list-item--active):hover > div,
.v-list-item:not(.v-list-item--active):focus > div,
.v-list-item.v-list-item--active > div {
    color: #FFF;
}

.pt-20{
    padding-top: 80px !important;
}

/* .v-list-item.v-list-item--link:hover > div,
.v-list-item.v-list-item--link:focus > div, */
.v-list-item:hover .v-list-item__title,
.v-list-item:focus .v-list-item__title {
    text-decoration: underline !important;
}

.v-data-footer .v-btn__content {
    color: inherit;
}

.use-vue .v-btn {
    text-transform: inherit;
}

.use-vue .v-application .success {
    background-color: #005856 !important;
}

.popup_form_title {
    padding-right: 0.938rem;
    padding-left: 0.938rem;
}

#btn-close {
    border: none;
    background-color: transparent;
}

.jconfirm .jconfirm-box .jconfirm-buttons {
    text-transform: inherit;
}

.jconfirm .jconfirm-box .jconfirm-buttons button.btn-blue {
    background-color: #003C69 !important;
    border-color: #003C69 !important;
}

.alertify .ajs-footer .ajs-buttons .ajs-button.ajs-ok {
    color: #003C69 !important;
}

abbr {
    text-decoration: none;
}

.ui-state-disabled, .ui-widget-content .ui-state-disabled, .ui-widget-header .ui-state-disabled {
    opacity: 0.7 !important;
    text-decoration: line-through !important;
}

/* Start - Custom style for dataTable */
.bootstrap-select>.dropdown-toggle.bs-placeholder, .bootstrap-select>.dropdown-toggle.bs-placeholder:active, .bootstrap-select>.dropdown-toggle.bs-placeholder:focus, .bootstrap-select>.dropdown-toggle.bs-placeholder:hover {
    color: #1d1616;
}

body .dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
body .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover,
body .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:active {
    color: #333 !important;
    cursor: not-allowed !important;
}

/* End - Custom style for dataTable */

.mw-5 {
    min-width: 24px !important;
}

.v-input__slot legend span {
    color: #003C69;
}

.theme--light.v-btn--disabled, 
.theme--light.v-btn.v-btn--disabled,
.theme--light.v-btn.v-btn--disabled .v-btn__loading, 
.theme--light.v-btn.v-btn--disabled .v-icon {
    color: #0000008a !important;
    cursor: not-allowed;
    pointer-events: inherit;
}

.theme--light.v-label--is-disabled {
    opacity: 0.8;
}

.theme--light.v-list-item .v-list-item__mask {
    color: rgba(0,0,0,.8) !important;
}

.v-tab {
    text-transform: inherit !important;
}

.border-form {
    border: 2px solid #BBBCB9; 
    border-radius: 6px;
}

.theme--light.v-date-picker-table th {
    color: #003C69 !important;
}

.v-application .v-btn--outlined.accent--text {
    color: #003C69 !important;
    caret-color: #003C69 !important;
}

.v-application .accent.v-btn--active {
    background-color: #003C69 !important;
    border-color: #003C69 !important;
  }

.v-application .accent.v-btn--active .v-btn__content {
    color: #FFF;
}

.line-clamp {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;  
}

.module {
    width: 180px;
    overflow: hidden;
}

.cursor-pointer {
    cursor: pointer;
}

.chosen-container .chosen-results li.highlighted {
    background-color: #003C69 !important;
}

.alertify-notifier .ajs-message.ajs-error {
    background: #8A2C2C !important;
}

.alertify-notifier .ajs-message.ajs-success {
    background: #003C69 !important;
}

.text-message {
    background-color:yellow;
    height: fit-content;
}

.customDialogStyle.ui-dialog .ui-dialog-titlebar {
    padding: .4em 1em;
    position: relative;
    background-color: #003C69 !important;
    color: #FFF !important;
}

.customDialogStyle.ui-widget .ui-widget {
    font-size: 1em;
    background-color: #003C69 !important;
    color: #FFF !important;
}

.customDialogStyle.ui-widget .ui-dialog-titlebar-close {
    display: none;
}

#tripRevenue_wrapper .fg-toolbar.ui-corner-bl,
div#tripRevenue_paginate,
div#tripRevenue_paginate a {
    background-color: #FFF !important;
    opacity: 1 !important;
}

#tripRevenue_paginate .ui-state-disabled {
    color: #757575 !important;
}

#tripRevenue_paginate .ui-state-disabled:hover,
#tripRevenue_paginate .ui-state-disabled:active {
    cursor: not-allowed;
}

#tripRevenueModal .close > span {
    color: #003C69;
}






/*####################### style left menu report #############################*/
.table-report {
    padding-left: 24px;
    padding-right: 12px;
}

.table-report .page_title {
    width: 25%;
}

.table-report .right_nav_table {
    background-color: #003C69;
    border: none;
    border-radius: inherit;
}

.table-report .right_nav_table a {
    background-color: #003C69;
    border: none;
    border-left: 4px solid #003C69;
    border-radius: inherit;
    min-height: 40px;
    padding: 0 0 0 8px;
    display: flex;
    align-items: center;
    font-size: 14px;
    letter-spacing: 0.5px;
    font-weight: 400;
}

.table-report .right_nav_table a.sub_left_menu {
    margin-left: 24px;
}

.table-report .bt_right_nav,
.table-report .bt_right_nav-last,
.table-report .bt_right_nav:hover {
    width: auto !important;
}

.table-report .select_right_nav,
.table-report .bt_right_nav:hover,
.table-report .bt_right_nav:focus {
    color: #003c69 !important;
    background-color: #ffffff !important;
    border-color: #003C69 !important;
    
}

.table-report .bt_right_nav:hover {
    text-decoration: underline;
}

.table-report .bt_right_nav.more-padding {
    padding-bottom: 10px;
}

.smartcard__timeout div,
.smartcard__timeout .v-input__slot,
.smartcard__timeout,
.input-small .v-input__slot {
    max-height: 36px;
    min-height: 36px !important;
}

.smartcard__timeout .v-input__slot {
    background-color: white !important;
}

.smartcard__timeout .v-text-field--outlined .v-label {
    top: 8px !important;
}   

#up-load-kml:focus +label {
    border: 1px solid black;
    padding-right: 5px;
}

.tableContract button,
#tableCommodity button {
    border: none;
    background-color: white;
}
.d-flex {
    display: flex !important;
}

.onoffswitch input {
    opacity: 0;
    display: block !important;
    position: absolute;
}

.onoffswitch input:focus ~ label {
    border: 2px solid #000;
}

.onoffswitch input:focus ~ label .onoffswitch-switch {
    border: 2px solid #000;
}

/* Custom hover button style */

.v-btn:before {
    transition: 0s all !important;
}

.theme--light.v-btn.v-btn--icon:focus:before,
.theme--light.v-btn.v-btn--text:focus:before,
.theme--light.v-btn.v-btn--text:hover:before {
    opacity: .24 !important;
}

.theme--light.v-btn.v-btn--icon:hover:before,
.theme--light.v-btn.v-btn--rounded:hover:before,
.v-btn.v-btn--icon.v-btn--round:hover:before,
.v-btn.v-btn--icon.v-btn--round:focus:before {
    opacity: .08 !important;
}

.v-btn:hover::before,
.v-btn:focus::before {
    opacity: 1 !important;
}

.v-btn:focus,
.btn-lg:focus,
.bt_form:focus,
.bt_import_blue:focus,
.table-report .bt_right_nav:focus,
.bt_form_p:focus  {
    outline-offset: 2px;
    outline: 2px solid #000;
}

.v-btn.primary:focus,
.btn-lg:focus,
.bt_form:focus,
.bt_import_blue:focus,
.bt_form_p:focus,
#generate_qld_report:focus,
#generate_od_1:focus {
    outline-color: #091832;
}

.v-btn.primary:hover::before,
.v-btn.primary:focus::before,
.btn-lg:hover,
.btn-lg:focus,
.bt_form:hover,
.bt_form:focus,
.bt_import_blue:hover,
.bt_import_blue:focus,
.bt_form_p:hover,
.bt_form_p:focus
#generate_qld_report:hover,
#generate_qld_report:focus,
#generate_od_1:hover,
#generate_od_1:focus {
    background: #091832 !important;
}

.bt_form.bt_cancel_red:hover,
.bt_form.bt_cancel_red:focus {
    background: #6e1b11 !important;
}

.v-btn.v-btn--outlined:focus {
    outline-color: #003C69;
}

.v-btn.v-btn--outlined:hover::before,
.v-btn.v-btn--outlined:focus::before {
    background: #003C69;
}

.v-btn.v-btn--outlined:hover,
.v-btn.v-btn--outlined:focus {
    color: #fff !important;
}

.v-btn.error:focus {
    outline-color: #6e1b11;
}

.v-btn.error:hover::before,
.v-btn.error:focus::before {
    background: #6e1b11;
}

.v-btn.success:focus {
    outline-color: #004241;
}

.v-btn.success:hover::before,
.v-btn.success:focus::before {
    background: #004241;
}

.v-application .v-icon.primary--text:hover,
.v-application .v-icon.primary--text:focus,
.v-application .v-btn--icon.primary--text:hover,
.v-application .v-btn--icon.primary--text:focus {
    color: #091832 !important;
}
.v-icon:focus {
    outline-offset: 2px;
    outline: 2px solid currentColor !important;
    border-radius: 100%;    
    transition: none;
}

.v-btn.normal:hover::before,
.v-btn.normal:focus::before {
    background: #c3c3c3;
}

.h-100 {
    height: 100%;
}

body .bg-primary {
    background-color: #003C69 !important;
}

body h1 {
    font-size: 2em;
}

.v-data-table caption {
    padding: 16px;
    text-align: left;
    border-bottom: 1px solid #0000001f;
    margin-bottom: 16px;
    font-weight: bold;
}

.underline {
    text-decoration: underline !important;
}

.underline:hover,
.underline:focus {
    color: #003C69;
}

.switch-icon:focus {
    outline-offset: 2px;
    outline: 2px solid #091832;
    box-shadow: none;
}

.panel-heading h1,
.panel-heading h2 {
    margin-bottom: 0;
    padding-left: 0;
}

.limit-width {
    max-height: 40px;
}

.alert-message p{
    margin-bottom: 0 !important;
}