/* Comment by pritam : The Modal (background) : this style tag temparary added here : this will move to purchase.css once the code update to the laterst version*/
.listView
{
    overflow: initial;
}
.disp-none-imp
{
    display: none !important;
}
.modal
{
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 9999; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content/Box */
.modal-content
{
    background-color: #fefefe;
    margin: 3% auto; /* 15% from the top and centered */
    padding: 20px;
    border: 1px solid #888;
    width: 80%; /* Could be more or less, depending on screen size */
}
.modal-right
{
    text-align: right;
}

.modal-footer
{
    text-align: right;
}

.top20
{
    margin-top: 15%;
}
/* The Close Button */
.close
{
    color: #aaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
}

.close:hover, .close:focus
{
    color: black;
    text-decoration: none;
    cursor: pointer;
}

/* Style the tab 
        div.tab
        {
            overflow: hidden;
            border: 1px solid #ccc;
            background-color: #f1f1f1;
        }*/

/* Style the buttons inside the tab */


/* Change background color of buttons on hover */


/* Style the tab content */


#tblSupplierRateList thead th
{
    -webkit-box-flex: 1;
    box-sizing: border-box;
    -webkit-flex: 1;
    flex: 1;
}
#tblSupplierRateList tbody td
{
    -webkit-box-flex: 1;
    box-sizing: border-box;
    -webkit-flex: 1;
    flex: 1;
}
.table-custom-class thead tr
{
    display: table-row !important;
}
.table-custom-class tbody tr
{
    display: table-row !important;
}
.table-custom-class tbody tr td
{
    white-space: unset;
}
.width34
{
    width: 34px !important;
}
.width44
{
    width: 44px !important;
}
.width65
{
    width: 65px !important;
}
.width220
{
    min-width: 220px !important;
}
.container
{
    width: 100%;
}
.fixed
{
    top: 0px;
    position: fixed;
    width: auto;
    display: none;
    border: none;
    width: 97% !important;
}
#bgDiv
{
    position: fixed;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
    overflow: hidden;
    padding: 0;
    margin: 0;
    background-color: Black;
    filter: alpha(opacity=25);
    opacity: 0.5;
    z-index: 1000;
}
#Progress
{
    top: 45%;
    left: 40%;
    text-align: center;
    position: fixed;
    background-color: transparent;
    width: 300px;
    z-index: 1001;
}
.width60imp
{
    width: 60px !important;
}
.importwork
{
    overflow: auto;
    vertical-align: bottom;
}
.width16
{
    width: 16px;
}
.table-custom-class .chosen-container
{
    position: absolute;
}
.table-custom-class .chosen-container
{
    width: 22% !important;
    margin-top: -11px;
}
#contentMain_gvSalesOrder_ddlMaterial_0_chosen .chosen-single
{
    overflow: hidden !important;
    /*width: 70% !important;*/
}
.max-width80{max-width: 80px;}
.selectmargin  .chosen-container{margin: 0px 20px !important;}
.tdminwdith300{min-width:300px;}

@media (min-width:769px) and (max-width:1024px)
{
    .maxwidth150{max-width:150px;} 
     .maxwidth80{max-width:80px;} 
     .tdminwdith300{min-width:200px;}
     .col-md-tdwidth200{min-width:200px;}
}

.col-md-tdwidth200 {min-width:200px; }

material-icons {cursor:pointer;}
.select2-container {
    width: 100% !important;
    max-width:250px !important;
}
.AddMaterialRow{ cursor:pointer;}
.RemoveLine{ cursor:pointer;}
/**************datepicker*****************/
.ui-datepicker-material-header {display: block;background-color: #284B72;color: white;text-align: center;width: 325px;}
.ui-datepicker-material-header .ui-datepicker-material-day {background-color: #1F3A58;padding: 10px;font-size: 1rem;}
.ui-datepicker-material-header .ui-datepicker-material-date {padding: 20px;}
.ui-datepicker-material-header .ui-datepicker-material-date .ui-datepicker-material-month,
.ui-datepicker-material-header .ui-datepicker-material-date .ui-datepicker-material-day-num,
.ui-datepicker-material-header .ui-datepicker-material-date .ui-datepicker-material-year {padding: 5px;}
.ui-datepicker-material-header .ui-datepicker-material-date .ui-datepicker-material-month {font-size: 2rem;text-transform: uppercase;}
.ui-datepicker-material-header .ui-datepicker-material-date .ui-datepicker-material-day-num {font-size: 4.5rem;}
.ui-datepicker-material-header .ui-datepicker-material-date .ui-datepicker-material-year {font-size: 1.8rem;font-weight: 200;color: rgba(255, 255, 255, 0.4);}
.ui-datepicker {padding: 0;border: none;-webkit-box-shadow: 0 12px 36px 16px rgba(0, 0, 0, 0.24);box-shadow: 0 12px 36px 16px rgba(0, 0, 0, 0.24);width: 325px; z-index:9999 !important;}
.ui-corner-all {border-radius: 0;}
.ui-widget-header {border: 0;}
.ui-datepicker-header {text-align: center;background: white;padding-bottom: 15px;font-weight: 300;}
.ui-datepicker-header .ui-datepicker-prev,
.ui-datepicker-header .ui-datepicker-next,
.ui-datepicker-header .ui-datepicker-title {border: none;outline: none;margin: 5px;}
.ui-datepicker-prev.ui-state-hover,.ui-datepicker-next.ui-state-hover {/*border: none;*/outline: none; border:solid thin #ccc; cursor:pointer;}

.ui-datepicker-calendar .ui-state-default {background: none;border: none;text-align: center;height: 30px;width: 30px;line-height: 36px;}
.ui-datepicker-calendar .ui-state-highlight {color: #284B72;}
.ui-datepicker-calendar .ui-state-active {border-radius: 50%;line-height:33px;background-color: #18AACC !important;color:#fff !important;color: white;}
.ui-datepicker-calendar .ui-state-highlight{border-radius: 50%;line-height:33px;background-color: #fdffa6 !important;color:#212121 !important;color: white;}
.ui-widget-content{ text-align:center;}
.ui-datepicker-close{ display:none;}
.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current{ float:none;background: #0485a3;color: #fff;border-radius: 3px;line-height: 20px;text-transform: capitalize;}
.ui-datepicker-buttonpane .ui-datepicker-close:hover, .ui-datepicker-buttonpane .ui-datepicker-current:hover{ background:#18aacc !important; }
.ui-datepicker .ui-datepicker-buttonpane{ border-top:solid thin #ccc; }
.ui-datepicker-calendar thead th {color: #999999;font-weight: 200;}
.ui-datepicker-buttonpane {border: none;}
.ui-datepicker-buttonpane .ui-state-default {background: white;border: none;}
.ui-datepicker-buttonpane .ui-datepicker-close,.ui-datepicker-buttonpane .ui-datepicker-current {background: white;color: #284B72;text-transform: uppercase;border: none;opacity: 1;font-weight: 200;outline: none;}
.ui-datepicker-buttonpane .ui-datepicker-close:hover,.ui-datepicker-buttonpane .ui-datepicker-current:hover {background: #b4cbe5;}
.ui-datepicker select.ui-datepicker-month, .ui-datepicker select.ui-datepicker-year{width: 35%;color: #737373;    border-color: #a6a6a6;}
.calendaricon{position: absolute;right: 35px;font-size: 16px;color: #108fad; z-index:1;}
.inputNew{ position:relative; z-index:5;}