* { box-sizing: border-box; }
.patb { padding-top: 10px; padding-bottom: 10px; }
.patb20 { padding-top: 20px; padding-bottom: 20px; }
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; /* ie 6/7 */ }
.relative { position: relative; }
.tbofleft { float: left; }
.tbofright { float: right; }
.tboleft { text-align: left; }
.tboright { text-align: right; }
.tbocenter { text-align: center; }
.tbocontainerfull {width: 100%; float: left; margin: 0 auto;}
.tbocontainer { width: 100%; margin: 0 auto;}
.tbofullwidth { width: 100% !important; float: left; }
.tborow { width: 100%; float: left; padding-left: 8px; padding-right: 8px; }
.tborowinner {width:100%; float:left;}
.tbo { float: left; padding: 0 8px; }
.resize_x{ resize:vertical;}
.resize_y{ resize:horizontal;}
.s1, .s2, .s3, .s4, .s5, .s6, .s7, .s8, .s9, .s10, .s11, .s12 { display: none; }
.m1, .m2, .m3, .m4, .m5, .m6, .m7, .m8, .m9, .m10, .m11, .m12 { display: none; }
.l1, .l2, .l3, .l4, .l5, .l6, .l7, .l8, .l9, .l10, .l11, .l12 { display: block; }
@media screen and (max-width: 767px) { .tbocontainer { width: 100%; } .mpad0{padding:0px !important;}
  .s1, .s2, .s3, .s4, .s5, .s6, .s7, .s8, .s9, .s10, .s11, .s12 { display: block !important; }
  .m1, .m2, .m3, .m4, .m5, .m6, .m7, .m8, .m9, .m10, .m11, .m12 { display: none; }
  .l1, .l2, .l3, .l4, .l5, .l6, .l7, .l8, .l9, .l10, .l11, .l12 { display: none; }
  .s1 { width: 8.333%; }
  .s2 { width: 16.666%; }
  .s3 { width: 25%; }
  .s4 { width: 33.33%; }
  .s6 { width: 50%; }
  .s12 { width: 100%; }
  .s5 { width: 41.66%; }
  .s7 { width: 58.33%; }
  .s8 { width: 66.66%; }
  .s9 { width: 75%; }
  .s10 { width: 83.33%; }
  .s11 { width: 91.66%; } }
@media screen and (min-width: 768px) and (max-width: 991px) { .tbocontainer { width: 100%; }
  .s1, .s2, .s3, .s4, .s5, .s6, .s7, .s8, .s9, .s10, .s11, .s12 { display: none; }
  .m1, .m2, .m3, .m4, .m5, .m6, .m7, .m8, .m9, .m10, .m11, .m12 { display: block !important; }
  .l1, .l2, .l3, .l4, .l5, .l6, .l7, .l8, .l9, .l10, .l11, .l12 { display: none; }
  .m1 { width: 8.333%; }
  .m2 { width: 16.666%; }
  .m3 { width: 25%; }
  .m4 { width: 33.33%; }
  .m6 { width: 50%; }
  .m12 { width: 100%; }
  .m5 { width: 41.66%; }
  .m7 { width: 58.33%; }
  .m8 { width: 66.66%; }
  .m9 { width: 75%; }
  .m10 { width: 83.33%; }
  .m11 { width: 91.66%; } }
@media screen and (min-width: 992px) { .s1, .s2, .s3, .s4, .s5, .s6, .s7, .s8, .s9, .s10, .s11, .s12 { display: none; }
  .m1, .m2, .m3, .m4, .m5, .m6, .m7, .m8, .m9, .m10, .m11, .m12 { display: none; }
  .l1, .l2, .l3, .l4, .l5, .l6, .l7, .l8, .l9, .l10, .l11, .l12 { display: block !important; }
  .l1 { width: 8.333%; }
  .l2 { width: 16.666%; }
  .l3 { width: 25%; }
  .l4 { width: 33.33%; }
  .l6 { width: 50%; }
  .l12 { width: 100%; }
  .l5 { width: 41.66%; }
  .l7 { width: 58.33%; }
  .l8 { width: 66.66%; }
  .l9 { width: 75%; }
  .l10 { width: 83.33%; }
  .l11 { width: 91.66%; } }
@media screen and (min-width: 991px) and (max-width: 1180px) { .tbocontainer { width: 92%; } }

/*error sucess alert msg*/
.tboerror, .tbosuccess, .tboalert {width:100%; float:left; padding:8px; text-align:center; border-radius:8px; -webkit-border-radius:8px; font-size:12px;}
.tboerror {background:#fee4e4; border:2px solid #fecccc; color:#e50000;}
.tbosuccess {background:#ebfde9; border:2px solid #c2fcbb; color:#179a05;}
.tboalert {background:#fff8e1; border:2px solid #fee89a; color:#bf9504;}
input[type="text"].invalid, textarea.invalid, select.invalid{border: 1px solid #f00;}
input[type="text"].valid:focus, textarea.valid:focus, select.valid:focus{border: 1px solid #04a10b;}
/*added by baliram*/
.mar0{ margin:0px !important;}
.pad0{ padding:0px !important;}
.tboInput { border:1px solid #e0e0e0;padding: 6px; border-radius: 5px; height:35px;}
.stickyTable th{ position:sticky; top:0px;}
.overflowAuto{ overflow:auto;}

/*=============loader css=============*/
.spinnermain { display: inline-block; vertical-align: middle; }
.loadingNew { text-align: left; display: block; position: relative; }
.spinnerbox { border-radius: 50%; -webkit-border-radius: 50%; border: 4px solid #e7e7e7; box-sizing: border-box; text-indent: -99em; overflow: hidden; height: 100%; width: 100%; position: absolute; }
.spinnerNew { -webkit-animation: 3s linear infinite spinContainer; animation: 3s linear infinite spinContainer; display: block; height: 100%; position: absolute; -webkit-transform: rotate(0); transform: rotate(0); width: 100%; }
    .spinnerNew i { -webkit-animation: 3s ease-in infinite spinProgress; animation: 3s ease-in infinite spinProgress; border: 3px solid #004684; border-radius: 50%; box-sizing: border-box; display: block; height: 100%; overflow: hidden; position: absolute; text-indent: -999em; -webkit-transform: rotate(0); transform: rotate(0); width: 100%; }
.sloader { height: 20px; width: 20px; }
    .sloader .spinnerNew { clip: rect(0,22px,22px,11px); }
        .sloader .spinner i { clip: rect(0,11px,22px,0); }
.mloader { height: 40px; width: 40px; }
    .mloader .spinnerNew { clip: rect(0,42px,42px,21px); }
        .mloader .spinner i { clip: rect(0,21px,42px,0); }
.lloader { height: 60px; width: 60px; }
    .lloader .spinnerNew { clip: rect(0,62px,62px,31px); }
        .lloader .spinnerNew i { clip: rect(0,31px,62px,0); }
.pos_fixLoader{ z-index: 99999999; position: fixed; top: 0; bottom: 0; left: 0; right: 0; margin: auto; }
.whiteLoader .spinnerNew i { border: 3px solid #ffffff; }

@-webkit-keyframes spinContainer { 0% { -webkit-transform: rotate(0); transform: rotate(0) }
    50% { -webkit-transform: rotate(540deg); transform: rotate(540deg) }
    100% { -webkit-transform: rotate(1080deg); transform: rotate(1080deg) }
}

@keyframes spinContainer {
    0% { -webkit-transform: rotate(0); transform: rotate(0) }
    50% { -webkit-transform: rotate(540deg); transform: rotate(540deg) }
    100% { -webkit-transform: rotate(1080deg); transform: rotate(1080deg) }
}

@-webkit-keyframes spinProgress {
    0%,100%,50% { -webkit-transform: rotate(0); transform: rotate(0) }
    25%,75% { -webkit-transform: rotate(180deg); transform: rotate(180deg) }
}

@keyframes spinProgress {
    0%,100%,50% { -webkit-transform: rotate(0); transform: rotate(0) }
    25%,75% { -webkit-transform: rotate(180deg); transform: rotate(180deg) }
}