@import url('https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900');

* {margin: 0px; padding: 0px; box-sizing: border-box;}
body {font-family: 'Roboto', sans-serif; font-size: 16px;}

/* width */
::-webkit-scrollbar {width: 8px;}
/* Track */
::-webkit-scrollbar-track {background: #f1f1f1; }
/* Handle */
::-webkit-scrollbar-thumb {background: #434249; }
/* Handle on hover */
::-webkit-scrollbar-thumb:hover {background: #000; }

/* To remove arrow from type number Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* To remove arrow from type number Firefox */
input[type=number] {
  -moz-appearance: textfield;
}

.clear {display: block; clear: both;}

.alertSucc {display: inline-block; padding: 10px 20px; background: green; color: #fff; font-size: 14px; font-weight: 700; position: fixed; top: 72px; right: 20px; border-radius: 6px; border: 1px solid #fff;}
.alertErr {display: inline-block; padding: 10px 20px; background: red; color: #fff; font-size: 14px; font-weight: 700; position: fixed; top: 72px; right: 20px; border-radius: 6px; border: 1px solid #fff;}

.loginBg {background: url(../../images/LoginBg.jpg) center no-repeat; background-size: cover; height: 100vh;}
.loginWrap {display: block; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 90%; max-width: 500px; text-align: center; padding: 20px 0; border: 2px solid #f3f3f3; background: #fff; border-radius: 12px; box-shadow: 0 0 10px rgba(0,0,0,.5);}
.loginWrap .logo {display: block; margin: 0 0 32px; background: #fff; padding: 12px 0;}
.loginWrap .logo img {height: 60px;}
.loginWrap h3 {font-weight: 500; font-size: 24px; margin: 0 0 20px;}
.loginWrap .field {display: block; margin: 0 0 20px;}
.loginWrap .form {margin: 0 32px;}

input[type=text], input[type=date], input[type=email], input[type=number], input[type=password], input[type=submit], select, textarea {display: block; width: 100%; height: 42px; background: #fff; border: 0; padding: 0 8px; outline: 0; border-radius: 6px;}
input[type=file] {display: block; width: 100%; height: 42px; background: #eee; border: 0; padding: 10px 8px;}
textarea {height: 80px; padding: 8px 8px;}
.field .btn { background: #f05a30; color: #fff; text-transform: uppercase; cursor: pointer;}

/*.aLeftSec {display: block; width: 220px; height: 100%; background: #07003c; color: #fff; padding: 0 0; overflow: auto; float: left; position: fixed; top: 0; left: 0; border-top-right-radius: 8px; border-bottom-right-radius: 8px;}
.aLeftSec .logo {display: block; padding: 12px; text-align: center;}
.aLeftSec .logo img {max-width: 100%; max-height: 52px;}
.aLeftSec h4 {font-size: 16px; font-weight: 500; text-transform: uppercase; margin: 0 0 8px; padding: 8px 20px; background: #363b3f;}
.aLeftSec nav {display: block; margin: 0 0 4px; font-size: 14px; max-height: calc(100% - 80px - 52px); overflow: auto;}
.aLeftSec nav ul {display: block;}
.aLeftSec nav ul li {font-size: 16px; font-weight: 500; display: block; color: #fff; text-decoration: none;}
.aLeftSec nav ul li a {color: inherit; text-decoration: none; padding: 12px 32px 12px 20px; display: block; position: relative; font-weight: 300; color: #fff; transition: all ease-in-out .2s; font-size: 15px; }
.aLeftSec nav ul li a i {display: inline-block; vertical-align: top; margin-right: 2px; width: 20px; text-align: center;}
.aLeftSec nav ul li.sub.open, .aLeftSec nav ul li.active.open {background: #dad8ee;}
.aLeftSec nav ul li.open a {color: #000;}
.aLeftSec nav ul li.sub > a::before {content: ''; display: block; width: 8px; height: 12px; position: absolute; top: 15px; right: 10px; background: url(../images/arrow.png) center no-repeat; transition: all ease-in-out .2s;}
.aLeftSec nav ul li.sub.open > a::before {transform: rotate(90deg);}
.aLeftSec nav ul li ul li {border: 0;}
.aLeftSec nav ul li ul li a {color: inherit; text-decoration: none; padding: 6px 20px; display: block; font-weight: 300; font-size: 14px; text-transform: none; line-height: normal;}
.aLeftSec nav ul li ul li a::before {content: ''; display: inline-block; vertical-align: top; width: 4px; height: 4px; background: #6d6e71; margin-right: 12px; margin-top: 6px;}
.aLeftSec nav ul li ul {display: none; padding-bottom: 12px;}

.aLeftSec .mCSB_scrollTools {width: 10px;}
.aLeftSec .mCS-light-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .aLeftSec .mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {width: 10px; background: #454545;}
.aLeftSec .mCSB_scrollTools .mCSB_draggerContainer {background: #ccc;}

.aLeftSec .profile {display: block; width: 100%; padding: 12px 20px; position: absolute; bottom: 0; left: 0; font-weight: 300;}
.aLeftSec .profile a {text-decoration: none;}
.aLeftSec .profile .profileBtn {color: #e0dfe8; line-height: 28px;}
.aLeftSec .profile .profileBtn i {display: inline-block; vertical-align: top; width: 28px; height: 28px; line-height: 28px; text-align: center;}
.aLeftSec .profile .profileBtn .profileIcon {border: 1px solid #e0dfe8; border-radius: 50%;}
.aLeftSec .profile .profileBtn .user {display: inline-block; vertical-align: top;width: calc(100% - (2 * 28px) - 8px - 8px); margin: 0 4px; font-size: 12px; line-height: normal; vertical-align: middle;}
.aLeftSec .profile .dd {display: none; position: absolute; bottom: 100%; left: 12px; background: #e0dfe8; width: calc(100% - (2 * 12px)); border-radius: 8px; padding: 12px 0; font-size: 14px;}
.aLeftSec .profile.active .dd {display: block;}
.aLeftSec .profile .dd ul {display: block;}
.aLeftSec .profile .dd ul li {display: block;}
.aLeftSec .profile .dd ul li a {display: block; color: #000; padding: 6px 12px;}*/

.aLeftSec {display: block; background: #526cf4; color: #fff; padding: 12px 20px;}
.aLeftSec .logo {display: inline-block; width: calc(120px - 4px); vertical-align: top;}
.aLeftSec .logo img {width: 100%;}
.aLeftSec nav {display: inline-block; width: calc(100% - 120px - 216px - 4px); vertical-align: top; text-align: center; margin-bottom: -28px;}
.aLeftSec nav ul {display: block;}
.aLeftSec nav ul::after {content: ''; display: block; clear: both;}
.aLeftSec nav ul li {display: inline-block; /*float: left;*/ vertical-align: top; position: relative;}
.aLeftSec nav ul li a {display: block; padding: 24px 16px; color: #fff; text-decoration: none; font-size: 15px; font-weight: 300;}
.aLeftSec nav ul li.active {border-bottom: 4px solid #526cf4; }
.aLeftSec nav ul li.active > a {background: #eeeef6; color: #000; border-top-left-radius: 20px; border-top-right-radius: 20px; overflow: hidden; font-weight: 500;}
.aLeftSec nav ul li ul {display: none; position: absolute; top: calc(100% + 4px); left: 50%; transform: translateX(-50%); background: #fff; border-radius: 8px; box-shadow: 0 0 4px rgba(0,0,0,.2); z-index: 1; width: 200px; text-align: left; padding: 12px 0;}
.aLeftSec nav ul li ul::before {content: ''; display: block; position: absolute; top: -8px; left: 50%; transform: translateX(-50%); width: 0; 
  height: 0; 
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  
  border-bottom: 8px solid #fff;}
.aLeftSec nav ul li.open ul {display: block;}
.aLeftSec nav ul li ul li {display: block;}
.aLeftSec nav ul li ul li a {display: block; padding: 8px 20px; color: #000; font-size: 15px; transition: all ease-in-out .2s;}
.aLeftSec nav ul li ul li a:hover {background: #526cf4; color: #fff;}
.aLeftSec nav ul li.sub > a::after {content: '\f078'; font-weight: 900; font-family: 'Font Awesome 5 Free'; display: inline-block; margin-left: 4px;}
.aLeftSec .proNLogout {display: inline-block; width: calc(216px - 4px); vertical-align: top;}
.aLeftSec .proNLogout::after {content: ''; display: block; clear: both;}
.aLeftSec .proNLogout .profile {display: inline-block; vertical-align: top; background: #4661e6; width: calc(160px - 4px); padding: 4px; border-radius: 20px; position: relative; float: left;}
.aLeftSec .proNLogout .profile .profileBtn {color: inherit; text-decoration: none;}
.aLeftSec .proNLogout .profile .profileIcon {display: inline-block; vertical-align: top; width: 32px; line-height: 32px; text-align: center; background: #fff; color: #000; border-radius: 50%;}
.aLeftSec .proNLogout .profile .user {display: inline-block; vertical-align: top; width: calc(100% - 32px - 8px); position: relative; padding-right: 16px;}
.aLeftSec .proNLogout .profile .user i {font-size: 14px; position: absolute; right: 0; top: 50%; transform: translateY(-50%);}
.aLeftSec .proNLogout .profile .user .name {display: block; font-size: 14px;}
.aLeftSec .proNLogout .profile .user .lab {display: block; font-size: 12px; color: #86a4fa;}
.aLeftSec .proNLogout .profile .user .name, .aLeftSec .proNLogout .profile .user .lab {text-wrap: nowrap; text-overflow: ellipsis; width: 100%; overflow: hidden;}
.aLeftSec .proNLogout .profile .dd {display: none; position: absolute; top: calc(100% + 8px); left: 50%; transform: translateX(-50%); background: #fff; border-radius: 12px; width: 200px; z-index: 1; box-shadow: 0 0 4px rgba(0,0,0,.2); padding: 12px 0;}
.aLeftSec .proNLogout .profile.active .dd {display: block;}
.aLeftSec .proNLogout .profile.active .dd::before {content: ''; display: block; position: absolute; top: -8px; left: 50%; transform: translateX(-50%); width: 0; 
  height: 0; 
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  
  border-bottom: 8px solid #fff;}
.aLeftSec .proNLogout .profile.active .dd ul {display: block;}
.aLeftSec .proNLogout .profile.active .dd ul li {display: block;}
.aLeftSec .proNLogout .profile.active .dd ul li a {display: block; text-decoration: none; padding: 8px 20px; font-size: 14px; color: #000;}
.aLeftSec .proNLogout .profile.active .dd ul li a:hover {background: #526cf4; color: #fff;}
.aLeftSec .proNLogout .logout {line-height: 40px; color: #fff; text-decoration: none; background: #4661e6; border-radius: 8px; display: inline-block; width: 40px; text-align: center; float: right;}


.aRightSec {display: block; padding: 20px; overflow: auto; background: #ebeffa;}
.aRightSec .rightSecInner {padding: 20px 32px; background: #fff; border-radius: 12px;}

.aRightSec .userInfo {display: block; padding: 10px 20px; text-align: right;}
.aRightSec .userInfo a {display: inline-block; margin: 0 10px; color: #333; text-decoration: none; font-size: 14px;}
.aRightSec .pageTitle {display: block; position: relative;}
.aRightSec .pageTitle::after {content: ''; display: block; clear: both;}
.aRightSec .pageTitle h3 {font-size: 24px; font-weight: 400; margin: 0 0 0; float: left; line-height: 38px;}


.mCSB_inside > .mCSB_container {margin-right: 10px;}


.formSecWrap {display: block; padding: 32px 0;}
.formSecWrap.bgw {background: #fff;}
.formSecWrap h2 {font-size: 20px; font-weight: 400; margin: 0 0 10px;}
.formSecWrap h3 {font-size: 18px; font-weight: 400; margin: 0 0 10px; display: inline-block; line-height: 26px;}
.formSecWrap h4 {font-size: 16px; font-weight: 400; margin: 0 0 10px;}
.formSecWrap .filter {display: inline-block; margin-left: 12px; font-size: 12px; color: #f05a30; cursor: pointer;}
.formSecWrap .filter::before {content: '+'; display: inline-block; margin-right: 4px; width: 8px;}
.formSecWrap .filter.open::before {content: '-';}

.col3 {display: block; margin-bottom: 12px;}
.col3::after {content: ''; display: block; clear: both;}
.col3 .row {display: block;}
.col3 .row::after {content: ''; display: block; clear: both;}
.col3 .col {display: inline-block; width: calc(33.33% - 4px - 2%); margin-left: 3%; margin-bottom: 20px;}
.col3 .col:nth-child(3n+1) {margin-left: 0;}

.formSingleCol {display: block; width: 100%; max-width: 500px; background: #fff; margin: 0 auto; padding: 20px;border-radius: 10px; box-shadow: 0 0 4px rgba(0,0,0,.2);}
.formSingleCol.big {max-width: 800px;}
.formSingleCol .field {margin: 0 0 20px;}
.formSingleCol .field::after {content: ''; display: block; clear: both;}

.table {display: table; width: 100%;}
.table .th {display: table-row;}
.table .th .td {display: table-cell;}

.txtC {text-align: center;}

.formMess {display: block; font-size: 14px; font-weight: 600;}
.formMess.success, .formMess.error {margin: 0 0 20px;}
.formMess.processing {color: blue;}
.formMess.success {color: green;}
.formMess.error {color: red;}

/*for pagination*/
.pagination {display: block; text-align: right; margin: 0 0 20px;}
.pagination ul {display: block;}
.pagination ul li {display: inline-block; margin: 0 2px;}
.pagination ul li a {display: block; min-width: 27px; line-height: 27px; text-align: center; border: 1px solid #526cf4; border-radius: 4px; font-size: 14px; font-weight: 500; text-decoration: none; color: #526cf4; background: #fff; padding: 0 4px;}
.pagination ul li a.active, .pagination ul li a:hover {background: #526cf4; color: #fff;}

/*for Table formatting with div */
.reportTable {display: table; width: 100%; margin: 0 0 20px; background: #fff; font-size: 14px; line-height: 22px;}
.reportTable .row {display: table-row;}
.reportTable .row .col {display: table-cell; padding: 8px 8px; border-bottom: 1px solid #eee; font-weight: 400;}
.reportTable .row .col a {color: blue; text-decoration: none;}

.reportTable .row.head .col {background: #ebeffa; font-weight: 500;}
.reportTable .row .col.sno {width: 50px;}
.reportTable .row .col.actionW {width: 154px;}
.reportTable .row .col.action .testCharge {display: block; border: 2px solid #f3f3f3; border-radius: 4px;}
.reportTable .row .col.action span, .reportTable .row .col.action a {display: inline-block; margin: 0 4px;}
.reportTable .row .col.action label, .reportTable .row .col.action i {display: inline-block;}
.reportTable .row .col.action i {display: inline-block; width: 16px; height: 16px;}
.reportTable .row .col.action i.edit {background: url(../images/EditIcon.png) center no-repeat;}
.reportTable .row .col.action i.delete {background: url(../images/DeleteIcon.png) center no-repeat;}
.reportTable .row .col.action .cbsm input[type=checkbox] {display: none;}
.reportTable .row .col.action .cbsm input[type=checkbox] ~ label {width: 16px; height: 16px; border: 1px solid #6d6e71; border-radius: 4px; position: relative;}
.reportTable .row .col.action .cbsm input[type=checkbox]:checked ~ label::before {content: ''; display: block; width: 16px; height: 16px; background: url(../images/CheckedIcon.png) center no-repeat; position: absolute; top: -1px; left: -1px;}
.reportTable .row .col .update {color: #f05a30;}
/*.reportTable .row.searchRow .col {background: #f3f3f3; padding: 6px 4px;}*/
.reportTable .row .col.actionW label {display: inline-block;}


.formSecWrap .form input[type=text], .formSecWrap .form  input[type=email], .formSecWrap .form  input[type=number], .formSecWrap .form  input[type=password], .formSecWrap .form  select, .formSecWrap .form  textarea{height: 40px; padding: 0 8px; border: 2px solid #dcdcdc; border-radius: 6px;}
.formSecWrap .form input[type=text]:focus, .formSecWrap .form input[type=email]:focus, .formSecWrap .form input[type=number]:focus, .formSecWrap .form input[type=password]:focus, .formSecWrap .form select:focus, .formSecWrap .form textarea:focus {border-color: blue;}
.formSecWrap .form input[type=text].err, .formSecWrap .form input[type=email].err, .formSecWrap .form input[type=number].err, .formSecWrap .form input[type=password].err, .formSecWrap .form select.err, .formSecWrap .form textarea.err {border-color: red;}

.formSecWrap .form  textarea {padding: 8px; min-height: 200px;}

.col3 {display: block;}
.col3 .field {display: inline-block; width: calc(33.33% - 4% - 4px); margin-right: 4%; margin-bottom: 32px; vertical-align: top;}
.col3 .merg2 {width: calc(66.66% - 4% - 4px);}
.col3 .merg3 {width: calc(100% - 4% - 4px);}
.col2 .field {display: inline-block; width: calc(50% - 4% - 4px); margin-right: 4%; margin-bottom: 32px; vertical-align: top;}

.formSecWrap .form label {font-size: 14px; padding: 4px 0; display: block;}
.formSecWrap .form .field {margin-bottom: 12px;}
.formSecWrap .form .field .mb0 {margin-bottom: 0;}
.formSecWrap .form .checkbox {padding: 5px 0; }
.formSecWrap .form .checkbox label {display: inline-block; vertical-align: middle;}

.formSecWrap .form .tncPdf {display: block; margin-bottom: 32px;}
.formSecWrap .form .tncPdf label {display: inline-block; vertical-align: middle;}
.formSecWrap .form .tncPdf input[type=file] {display: inline-block; vertical-align: middle; width: 33.33%; background: none; border-bottom: 1px solid #333;}
.formSecWrap .form .tncPdf a {color: #f05a30; font-size: 12px; display: inline-block; margin-left: 12px;}
.formSecWrap .form input[type=submit] {background: #526cf4; color: #fff; text-transform: uppercase; border: 0; font-size: 12px; cursor: pointer; border-radius: 6px;}
.formSecWrap .form .addMoreBtn {display: inline-block; color: #f05a30; font-size: 12px; margin-bottom: 32px; cursor: pointer;}
.formSecWrap .form input[type=submit].half {display: inline-block; vertical-align: top; width: calc(50% - 4px);}

.rightbtn {float: right;}
.rightbtn a {display: inline-block; font-size: 14px; padding: 12px 28px; background: #516cf7; color: #fff; text-decoration: none; border-radius: 20px;}

.searhWrap {display: block;}
.searhWrap > span {display: inline-block; padding: 0 12px; background: #f05a30; color: #fff; cursor: pointer; font-size: 12px; margin-bottom: 12px;}
.searhWrap .searchForm {margin: 0 0 12px; display: none;}
.searhWrap.open .searchForm {display: block;}
.searhWrap .searchForm .field {display: inline-block; width: calc(25% - 4px - 2%); vertical-align: top; margin: 0 0 8px; margin-right: 2%;}
.searhWrap .searchForm input[type=text], .searhWrap .searchForm input[type=submit], .searhWrap .searchForm select {display: block; width: 100%; padding: 0; background: none; border-bottom: 1px solid #333; height: 25px; font-size: 12px;}
.searhWrap .searchForm input[type=submit] {background: #f05a30; color: #fff; border: 0; width: auto; padding: 0 20px; display: inline-block; vertical-align: top;}

.searhWrap .searchForm .fromto::after {content: ''; display: block; clear: both;}
.searhWrap .searchForm .fromto input[type=text].from {width: calc(50% - 10px); float: left;}
.searhWrap .searchForm .fromto input[type=text].to {width: calc(50% - 10px); float: right;}
.searhWrap .searchForm input[type=text].calender {background: url(../images/calender.png) 100% center no-repeat;}

.noOfRows {display: inline-block; float: left; width: 200px; font-size: 12px;}
.noOfRows span {display: inline-block; vertical-align: middle; margin-right: 4px;}
.noOfRows select {display: inline-block; vertical-align: middle; width: 64px; height: 27px; border: 1px solid #526cf4; border-radius: 4px;}

/* New CSS added here*/
.labListToSelect {display: block; padding: 32px; text-align: center;}
.labListToSelect .labListing {display: block; width: 100%; max-width: 500px; margin: 0 auto; box-shadow: 0 0 4px rgba(0,0,0,.4); padding: 20px 20px 40px; border-radius: 8px; background: #fff; box-shadow: 0 0 10px rgba(0,0,0,.5);}
.labListToSelect .labListing h3 {font-size: 20px; margin-bottom: 20px; font-weight: 400; text-transform: uppercase;}
.labListToSelect .labListing .logo img {height: 60px;}
.labListToSelect .labListing .logo {margin-bottom: 20px;}
.labListToSelect .labListing ul {display: block; text-align: left;}
.labListToSelect .labListing ul li {display: block; margin-bottom: 20px;}
.labListToSelect .labListing ul li a {display: block; padding: 10px 20px; font-size: 18px; font-weight: 300; background: #f9f9f9; border-radius: 8px; color: inherit; text-decoration: none; border: 1px solid #ccc;}
.labListToSelect .labListing ul li a:hover {background: #fff;}
.labListToSelect .labListing .createNew {display: block;}
.labListToSelect .labListing .createNew a {display: block; padding: 10px 20px; font-size: 16px; font-weight: 300; background: #f05a30; border-radius: 8px; color: #fff; text-decoration: none;}

.selectedLab {display: inline-block; float: right; border-radius: 4px; width: 320px; position: relative; height: 38px; font-size: 14px;}
.selectedLab ul {display: block; padding-top: 35px; position: absolute; top: 0; left: 0; width: 100%;}
.selectedLab ul li {display: none;  width: 100%; box-shadow: 0 0 4px rgba(0,0,0,.4);}
.selectedLab ul li.selected {display: block; position: absolute; top: 0; left: 0;}
.selectedLab ul li.selected a {background: #07003c; color: #fff;}
.selectedLab ul li a {display: block; padding: 8px 12px; background: #fff; color: inherit; text-decoration: none; border-radius: 4px; position: relative;}
.selectedLab ul.open li {display: block;}
.selectedLab ul li.selected a::before {content: ''; display: block; width: 6px; height: 9px; background: url(../images/arrow.png) center no-repeat; position: absolute; right: 12px; top: 12px;}

.form .submit {display: block; text-align: right;}
.form .submit .field {width: calc(33.33% - 4% - 4px); display: inline-block; margin-right: 4%;}

/*For Test Page*/
.left {float: left;} .right {float: right;}
.testForm {display: block;}
.testForm::after {display: block; content: ''; clear: both;}
.testForm .left, .testForm .right {display: block; width: 46%;}
.tat {padding-top: 12px;}
.tat .field {display: inline-block; width: calc(25% - 4px - 2%); vertical-align: top; margin-left: 2.66%;}
.tat .field:nth-child(4n+1) {margin-left: 0;}
.submit input[type=submit] {display: inline-block; height: 28px; text-align: center; background: #454545; color: #fff; cursor: pointer; border: 0; }

.paramList {max-height: 218px; overflow: auto; padding-right: 4px;}
.paramList span {display: block; padding: 10px; background: #f3f3f3; margin: 2px 0; padding: 6px 8px; border-radius: 4px; font-size: 14px; cursor: pointer; transition: all ease-in-out .2s;}
.paramList span:hover, .paramList span.active {background: #ccc;/* color: #fff;*/}

.actButtons {display: block; padding-top: 12px;}
.actButtons button {display: inline-block; padding: 4px 8px; width: 140px; text-align: center; background: blue; color: #fff; cursor: pointer; border: 0; border-radius: 4px;}

.popW {display: none; width: 100%; height: 100%; position: fixed; top: 0; left: 0; background: rgb(0,0,0,.8);}
.popW label {font-size: 12px;}
.popW .popI {display: block; width: 96%; max-width: 400px; max-height: 80%; position: absolute; top: 50%; left: 50%; background: #fff; transform: translate(-50%, -50%); overflow: auto; padding: 20px;}
.popW .popI .close {line-height: 32px; width: 32px; background: #454545; color: #fff; font-size: 18px; text-align: center; position: absolute; top: 0; right: 0; cursor: pointer;}
.popW .popI .close::before {content: 'X';}
.minMax .field {display: inline-block; width: calc(48% - 4px); vertical-align: top;}
.minMax .field:nth-child(2) {margin-left: 4%;}

.popW.paramFrom .popI {max-width: 800px;}
.popW.paramFrom .popI .col2 .field {display: inline-block; width: calc(50% - 2% - 4px); margin: 0 0 8px; vertical-align: top;}
.popW.paramFrom .popI .field {margin-bottom: 8px;}
.popW.paramFrom .popI .col2 .field:nth-child(2n) {margin-left: 4%;}
.popW.paramFrom .popI .col2 .field.edi {margin-left: 0; width: 100%;}

.testForm input[type=text], .testForm input[type=email], .testForm input[type=number], .testForm input[type=password], .testForm input[type=submit], .testForm select, .testForm textarea {height: 32px;}
.form .field input[type=text], .form .field input[type=email], .form .field input[type=number], .form .field input[type=password], .form .field select, .form .field textarea {height: 40px; border: 2px solid #dcdcdc; padding: 0 8px; border-radius: 6px;}
.form .field input[type=submit] {height: 40px; border: 0; border-radius: 6px;}
.form .field input[type=submit]:focus {background: blue;}

.form .field input[type=text]:focus, .form .field input[type=email]:focus, .form .field input[type=number]:focus, .form .field input[type=password]:focus, .form .field select:focus, .form .field textarea:focus {border-color: blue;}

.form .field .txt {display: block; line-height: 32px;border-bottom: 1px solid #333; min-height: 32px;}

.loginForm .form .field input[type=text], .loginForm .form .field input[type=password] {height: 42px;}

.addmore {display: block; margin-bottom: 20px;}
.addmore a {color: #f05a30; text-decoration: none; font-size: 12px;}

.ui-datepicker .ui-datepicker-title select {display: inline-block; height: auto; margin: 0 2px !important; padding: 4px;}

.formSecWrap .form .testReportupdate .Numeric {height: 32px;}

.formSecWrap .form .radio input {display: inline-block; vertical-align: middle;}
.formSecWrap .form .radio label {display: inline-block; margin-right: 8px; vertical-align: middle;}

.grouping {font-size: 15px; margin-bottom: 8px;}

.radioInline .radio {display: inline;}

.testaddition {display: table; width: 100%; border-radius: 4px; font-size: 12px; border-top: 1px solid #ccc; border-left: 1px solid #ccc; margin-bottom: 20px;}
.testaddition .r {display: table-row; width: 100%;}
.testaddition .r .c {display: table-cell; padding: 4px; border-bottom: 1px solid #ccc; border-right: 1px solid #ccc;}
.testaddition .r.head .c {font-weight: 700; padding: 12px 4px; background: #f3f3f3;}
.testaddition .r .c:nth-child(1) {width: 32px;}
.testaddition .removeTestBtn {display: block; width: 28px; line-height: 28px; text-align: center; background: red; color: #fff; text-decoration: none; border-radius: 50%;}

.addtestrow {text-align: right; margin-bottom: 12px; font-size: 12px;}
.addtestrow a {background: red; color: #fff; text-decoration: none; padding: 8px 20px; border-radius: 4px;}

.patientDetails {margin-bottom: 20px; padding: 12px; background: #f3f3f3; border-radius: 8px;}
.patientDetails span {display: block;}
.patientDetails .pic {display: inline-block; width: calc(100px - 4px); vertical-align: middle;}
.patientDetails .pic img {width: 100%; padding: 4px; border: 1px solid #ccc; background: #fff; border-radius: 8px;}
.patientDetails .txt {display: inline-block; width: calc(100% - 20px - 100px - 4px); vertical-align: middle; margin-left: 20px; font-size: 14px;}
.patientDetails .txt .name { font-size: 18px; font-weight: 700; margin-bottom: 4px;}
.patientDetails .txt .other { color: blue;}
.patientDetails .txt .uid {color: red;}
.formSecWrap .patientDetails.fixed {position: fixed; top: 0; width: calc(100% - ((20px + 32px) * 2)); z-index: 1;}

.testReportupdate .test { padding: 20px; border: 1px solid #f3f3f3; box-shadow: 0 0 4px rgb(0 0 0 / 40%); margin-bottom: 12px;}
.testReportupdate .test h3 {padding: 8px 12px; background: #f3f3f3; border-radius: 8px; display: block; color: #005d99;}
.testReportupdate .test .reportTable {padding: 12px 20px; border: 2px solid #f3f3f3; border-radius: 8px;}
.testReportupdate .test .reportTable .row {display: table-row; border: 1px solid #f3f3f3; border-radius: 4px;}
.testReportupdate .test .reportTable .row:hover {background: #f3f3f3;}
.testReportupdate .test .reportTable .row .col {display: table-cell; vertical-align: top; padding: 5px 8px; border: 0;}
.testReportupdate .test .reportTable .row .col.param {width: calc(180px - 4px);}
.testReportupdate .test .reportTable .row .col.input {width: calc(100% - ((200px + 4px) * 3));}
.testReportupdate .test .reportTable .row .col.unit {width: calc(180px - 4px);}
.testReportupdate .test .reportTable .row .col.default {width: calc(180px - 4px);}
.testReportupdate .test .reportTable .row .col.bold {width: calc(100px - 4px); line-height: normal;}
.testReportupdate .test .reportTable .row .col.bold label {display: inline-block; vertical-align: middle; padding: 0;}
.testReportupdate .test .reportTable .row .col.bold input {display: inline-block; vertical-align: middle;}
.testReportupdate .test .grouping {font-weight: 600; color: #005d99;}

.sm {font-size: 11px; line-height: normal; display: inline-block; padding: 4px 0;}

.testReportList .row {display: block; padding: 8px; border: 2px solid #f3f3f3; margin-bottom: 12px; background: #f1f1f1; border-radius: 8px; border: 1px solid #000; transition: all ease-in-out .2s; position: relative;}
.testReportList .row:hover {transform: scale(1.01); background: #e7ebff; box-shadow: 0 0 4px rgba(0,0,0,.2);}
.testReportList .row .col {display: inline-block; vertical-align: middle; padding: 0; border: 0;}
.testReportList .searchRow {background: #ebeffa;}
.testReportList .searchRow .col {margin-right: 8px;}
.testReportList .searchRow .col input[type=text] {border-radius: 6px;}
.testReportList .row.head .col {background: none; color: #454545; vertical-align: middle;}

.testReportList .row .col.sno {width: calc(60px - 4px);}
.testReportList .row .col.printcta {width: calc(212px - 4px);}
.testReportList .row .col.date {width: calc(100px - 4px);}
.testReportList .row .col.action {width: calc(100px - 4px);}
.testReportList .row .col.pic {width: calc(80px - 4px); }
.testReportList .row .col.pic img {width: 100%; padding: 4px; border: 2px solid #f3f3f3; border-radius: 12px; background: #fff;}
.testReportList .row .col.patient {width: calc(100% - 60px - 212px - 80px - 100px - 100px - 4px); padding-left: 12px;}
.testReportList .row .col {font-size: 15px;}
.testReportList .row .opts {text-align: right;}
.testReportList .row .opts a {display: inline-block; margin-right: 8px; color: inherit; text-decoration: none; transition: all ease-in-out .2s;}
.testReportList .row .opts a.edit:hover {color: green;}
.testReportList .row .opts a.delete:hover {color: red;}
.testReportList .row .billing {padding-top: 12px; font-size: 14px; font-weight: 500;}

.testReportList .row .col.patient a {font-size: 14px; font-weight: 500; color: blue; text-decoration: none;}
.testReportList .row .col.patient div.name {font-size: 16px; font-weight: 500; color: blue; text-decoration: none;}
.testReportList .row .col.patient div.name span {color: red;}
.testReportList .row .col.patient a span {color: red;}
.testReportList .row .col.printcta a {display: inline-block; padding: 2px 8px; border-radius: 4px; background: #526cf4; color: #fff; text-decoration: none; font-size: 14px; margin: 0 2px 4px;}
.testReportList .row .col.printcta a i {margin-right: 4px;}

.testReportList .row .col.action > a {display: block; padding: 6px 8px; background: #526cf4; color: #fff; text-decoration: none; border-radius: 4px; margin: 2px 0; text-align: center;}
.testReportList .row .col.action a.sm {font-size: 14px;}


.srchInput {position: relative;}
.formSecWrap .testaddition input[type=text] {border: 1px solid #ccc; border-radius: 8px; padding: 0 8px;}
.formSecWrap .testaddition .tdis {width: 80px;}
.srchInput .sDd {position: absolute; top: 100%; left: 0; min-width: 100%; z-index: 1; background: #fff; border: 1px solid #ccc;}
.srchInput .sDd span {display: block; padding: 6px 8px; border-bottom: 1px solid #ccc; font-size: 14px; cursor: pointer;}
.srchInput .sDd span.active {background: lightblue;}
.srchInput .sDd span i {display: inline-block; float: right; color: red; font-style: normal;}
.srchInput .sDd span i::before {content: 'X';}

.eidtParam {padding: 8px; border: 1px solid #f3f3f3; border-radius: 4px; display: table-caption;}
.eidtParam:hover {background: #f3f3f3;}

.nfilter {display: block; margin-bottom: 12px;}
.nfilter input[type=text] {display: inline-block; width: 600px; border: 2px solid #f3f3f3; height: 38px;}
.nfilter input[type=submit] {display: inline-block; width: 100px; height: 38px; background: blue; color: #fff;}

.setChargesForm .submit {text-align: right;}
.setChargesForm .submit input[type=submit] { display: inline-block; width: auto; background: #f05a30; color: #fff; text-transform: uppercase; border: 0; font-size: 12px; cursor: pointer; border-radius: 6px; height: 40px; padding: 0 32px;}

.oneColForm {display: block; max-width: 800px;}
.oneColShort {display: block; max-width: 500px;}

.col4 {display: block; margin-bottom: 12px;}
.col4::after {content: ''; display: block; clear: both;}
.col4 .row {display: block;}
.col4 .row::after {content: ''; display: block; clear: both;}
.col4 .field {display: inline-block; width: calc(25% - 4px - 2%); margin-left: calc((8% / 3)); margin-bottom: 20px; vertical-align: top;}
.col4 .field:nth-child(4n+1) {margin-left: 0;}
.form .oneColForm .submit {text-align: right;}
.form .oneColForm .submit input[type=submit] {display: inline-block; width: auto; padding: 0 32px; height: 40px;}
.oneColForm .checkbox input[type=checkbox] {margin-top: 5px; float: left; margin-right: 8px;}
.oneColForm .checkbox label {font-size: 15px;}

.sqradio input[type=radio] {display: none;}
.sqradio input[type=radio] ~ label {display: inline-block; position: relative; padding: 0; padding-left: 24px; min-height: 16px;}
.sqradio input[type=radio] ~ label::before {content: ''; display: block; width: 16px; height: 16px; position: absolute; top: 0; left: 0; border: 1px solid #07003c; border-radius: 2px;}
.sqradio input[type=radio]:checked ~ label::after {content: '\f00c'; display: block; width: 16px; height: 16px; position: absolute; top: -1px; left: 2px; font-family: "Font Awesome 6 Free"; font-weight: 900; font-size: 14px;}

.report4ctas button {display: inline-block; width: auto; min-width: 200px; height: 40px; border-radius: 6px; border: 1px solid #fff;}
.report4ctas button:nth-child(1), .report4ctas button:nth-child(2) {background: none; border: 1px solid green; color: green;}
.report4ctas button:nth-child(3), .report4ctas button:nth-child(4) {background: green; border: 1px solid green; color: #fff;}

.report4ctas input[type=submit] {display: inline-block; width: auto; min-width: 120px; height: 32px; border-radius: 6px; border: 1px solid #fff;}
.report4ctas input[type=submit]:nth-child(1), .report4ctas input[type=submit]:nth-child(2) {background: none; border: 1px solid green; color: green;}
.report4ctas input[type=submit]:nth-child(3), .report4ctas input[type=submit]:nth-child(4) {background: green; border: 1px solid green; color: #fff;}

.reportFilter {display: block; padding: 20px; background: #ebeffa; border-radius: 8px; margin-bottom: 20px;}
.reportFilter label {font-size: 14px; margin-bottom: 4px; display: block;}
.reportFilter .field {display: inline-block; width: calc(48% - 4px); vertical-align: top; margin-bottom: 8px;}
.reportFilter .field:nth-child(2n) {margin-left: 4%;}
.reportFilter .chosen-container-single .chosen-single {line-height: 42px; background: #fff; border: 0; height: 42px; border-radius: 0; font-size: 14px; color: #000; padding: 0 8px; border-radius: 6px; box-shadow: none;}
.reportFilter .chosen-container-single .chosen-single div b {width: 12px; height: 20px; margin-top: 8px;}
.reportFilter .chosen-container {max-width: 100%;}
.reportFilter .cta {text-align: right;}
.reportFilter .cta input[type=submit], .reportFilter .btn {display: inline-block; width: auto; cursor: pointer; background: blue; color: #fff;}
.reportFilter .btn {border: 0; height: 42px; line-height: 42px; padding: 0 8px; border-radius: 6px; margin: 0 4px;}

.totalrecords {font-size: 14px; font-weight: 600; margin-bottom: 12px;}

.testReportList .testsname {}
.testReportList .testsname span {display: inline-block; padding: 4px 4px; border-radius: 4px; /* border: 1px solid #ccc; */ line-height: normal; font-size: 12px;}
.testReportList .testsname span.Pending {background: red; color: #fff;}
.testReportList .testsname span.Save {background: yellow; color: black;}
.testReportList .testsname span.Approve {background: green; color: #fff;}
.testReportList .billing_details {padding: 10px 20px;}
.testReportList .billing_details span {display: inline-block; margin-right: 12px;}
.testReportList .row .opts {position: absolute; bottom: 12px; right: 12px;}

.testReportList .regdate {display: block; position: absolute; top: 0; right: 0; padding: 8px 12px; font-size: 13px; font-weight: 500; color: red;}

.selectPathologist {display: block; margin: 40px; padding: 32px; background: #f3f3f3;}

.printSetting {padding: 20px; background: #f9f9f9; border-radius: 12px; margin-bottom: 20px;}

.reportTable .row .col .importTestbtn {padding: 4px 12px; border-radius: 4px; background: blue; color: #fff; font-size: 12px; text-transform: uppercase;}
.reportTable .row .col .importTestbtn.disabled {color: #ccc; background: #f3f3f3; cursor: not-allowed;}

.approvedBy {padding: 12px 0;}
.approvedBy h4, .approvedBy select {display: inline-block;}
.approvedBy h4 {margin-right: 12px;}
.approvedBy select {width: 280px;}

.menuBtn {display: none; color: #fff; font-size: 14px; float: right; padding: 10px 20px; cursor: pointer; border-radius: 6px;}
.menuBtn .icon {display: inline-block; font-family: "Font Awesome 6 Free"; font-weight: 900;}
.menuBtn .icon::before {content: '\f0c9';}
body.showMenu .menuBtn .icon::before {content: '\f00d';}
body.showMenu .menuBtn {background: #fff; color: #07003c;}
.mob {display: none !important;}

.roleSec {display: block; margin-bottom: 12px; border: 2px solid #f0f0f0; padding: 12px; border-radius: 8px;}
.roleSec .checkboxes {display: block;}
.roleSec .checkboxes .checkbox {display: inline-block; margin-right: 20px;}
.roleSec .checkboxes .checkbox input[type=checkbox] {display: none;}
.roleSec .checkboxes .checkbox input[type=checkbox] ~ label {display: block; position: relative; padding-left: 20px;}
.roleSec .checkboxes .checkbox input[type=checkbox] ~ label::after {content: ''; display: block; width: 12px; height: 12px; border: 1px solid #454545; border-radius: 2px; position: absolute; top: 3px; left: 0;}
.roleSec .checkboxes .checkbox input[type=checkbox]:checked ~ label::before {content: ''; display: block; width: 8px; height: 8px; background: green; border-radius: 2px; position: absolute; top: 6px; left: 3px;}

.phistory .printcta {width: 200px;}
.reportTable.phistory .printcta a { display: inline-block; padding: 2px 4px; border-radius: 4px; background: blue; color: #fff; text-decoration: none; font-size: 12px; margin: 0 2px 4px;}
.phistory .date {width: 104px;}
.phistory .testName {display: inline-block; margin-bottom: 4px; padding: 2px 12px; font-size: 12px; border: 1px solid #ccc; margin-right: 4px; border-radius: 4px;}

.reportTable .row .col a.importAllTestbtn { padding: 10px 12px; border-radius: 4px; background: blue; color: #fff; font-size: 12px; text-transform: uppercase; float: right;}
.fr {float: right;}

.ctas {padding-top: 12px;}
.ctas a, .reportTable .row .col .ctas a {display: inline-block; padding: 4px 12px; font-size: 11px; border: 1px solid red; color: red; border-radius: 4px; line-height: normal;}

#PrintAndWhatsapp .radios {display: block; margin-bottom: 20px;}
#PrintAndWhatsapp .radios .radio {display: inline-block; margin: 0 8px;}
#PrintAndWhatsapp .radios .radio input[type=radio] {display: none;}
#PrintAndWhatsapp .radios .radio input[type=radio] ~ label {display: block; padding: 8px 20px 8px 32px; border: 1px solid green; color: green; border-radius: 8px; font-size: 12px; cursor: pointer; position: relative;}
#PrintAndWhatsapp .radios .radio input[type=radio] ~ label::before {content: ''; display: block; width: 12px; height: 12px; border: 1px solid green; border-radius: 50%; position: absolute; top: 8px; left: 12px;}
#PrintAndWhatsapp .radios .radio input[type=radio]:checked ~ label::before {background: green;}
/*#PrintAndWhatsapp .radios .radio input[type=radio]:hover ~ label {background: green; color: #fff;}*/
#PrintAndWhatsapp .submit {display: block;}
#PrintAndWhatsapp .field {/* display: block; */ margin-bottom: 12px;}
#PrintAndWhatsapp .field label {font-size: 14px; margin-bottom: 4px; display: block;}
#PrintAndWhatsapp .submit input[type=submit] {display: inline-block; width: auto; background: blue; color: #fff; border-radius: 4px; padding: 8px 32px;}



.alert {position: fixed; bottom: 32px; right: 32px; display: inline-block; max-width: calc(100% - 64px); padding: 12px 32px; color: #fff; border-radius: 8px; border: 2px solid #fff; box-shadow: 0 0 8px rgba(0,0,0,.5);}
.alert i {display: inline-block; font-style: normal; cursor: pointer; color: #000; width: 20px; text-align: right;}
.alert.Succ {background: green;}
.alert.Err {background: red;}
.alert.Pro {background: blue;}

.tList {display: block; max-width: 600px; margin: 0 auto; font-size: 14px; margin-bottom: 20px; text-align: left;}
.tList ul {display: block;}
.tList ul li {display: block; margin: 8px 0;}
.tList span.red, .tList span.green {font-size: 12px; font-weight: 500;}

.formSecWrap h3.mb-0, .mb-0 {margin-bottom: 0;}

.red {color: red;}
.green {color: green;}

.dateFilter {display: block; /*text-align: center;*/ font-size: 14px; background: #fff; padding: 12px; border-radius: 12px;}
.advFilter {margin-top: 20px;}
.dateFilter .date, .dateFilter .status, .dateFilter .advFilterBtn, .dateFilter .date span, .dateFilter .date input, .dateFilter .status .radio {display: inline-block; vertical-align: middle;}
.dateFilter .date input[type=text], .dateFilter .select select {width: 124px; background: #f3f3f3 url(../images/calender.png); background-position: 90% center; background-repeat: no-repeat; border-radius: 12px;}
.dateFilter .date input[type=date] {width: 124px; background: #f3f3f3; border-radius: 12px;}
.dateFilter .select {display: inline-block; }
.dateFilter .select .rrd {width: 400px; display: inline-block; margin: 0 4px;}
.dateFilter .select .rrd .chosen-container {width: 100% !important;}
.dateFilter .select .rrd .chosen-container-single .chosen-single {background: #f3f3f3; margin: 0;}
.dateFilter .status .radio input[type=radio] {display: none;}
.dateFilter .status .radio input[type=radio] ~ label {display: block; padding: 8px 20px 8px 32px; background: #f3f3f3; border-radius: 12px; position: relative; cursor: pointer;}
.dateFilter .status .radio input[type=radio] ~ label::before {content: ''; display: block; width: 15px; height: 15px; border: 1px solid blue; border-radius: 50%; position: absolute; top: 8px; left: 8px;}
.dateFilter .status .radio input[type=radio]:checked ~ label {background: blue; color: #fff;}
.dateFilter .status .radio input[type=radio]:checked ~ label::before {background: #fff;}
.dateFilter .status .radio input[type=radio]:checked ~ label::after {content: ''; display: block; width: 7px; height: 7px; background: blue; border-radius: 50%; position: absolute; top: 13px; left: 13px;}
.dateFilter .date, .dateFilter .status, .dateFilter a {margin: 0 12px;}
.dateFilter .date span, .dateFilter .status span {margin-right: 4px;}
.dateFilter a {text-decoration: none; color: red;}
.advFilter {display: none;}
.advFilterHide {cursor: pointer;}

.addMulDefault {padding: 8px 0; font-size: 13px;}
.addMulDefault a {text-decoration: none; color: blue;}
.formSecWrap h3.block {display: block;}
.accorDefVal .item .content {display: none; padding: 12px; border: 1px solid #ccc; border-radius: 12px; margin-bottom: 12px; font-size: 14px;}
.accorDefVal .item .content::after {content: ''; display: block; clear: both;}
/*.accorDefVal .item.active .content {display: block;}*/
.accorDefVal .item h5 {display: block; padding: 8px 12px; background: #f2f2f2; border-radius: 12px; margin-bottom: 2px; font-size: 15px; cursor: pointer; position: relative;}
.accorDefVal .item h5:hover {color: blue;}
.accorDefVal .item h5 .lnks {position: absolute; top: 7px; right: 14px; color: blue;}
.accorDefVal .item h5 .lnks a {color: blue;}
.accorDefVal .item h5 a:hover {color: darkblue;}
.DVList {width: 340px; /*float: right;*/ margin-bottom: 4px;}
.DVList::after {content: ''; display: block; clear: both;}
.DVList label {width: 100px; display: inline-block; float: left; line-height: 20px; padding: 0 !important;}
.DVList .DVListSelect {width: 240px; float: right; height: 20px !important; padding: 0 2px  !important; display: inline-block;}

.reportIdField {display: block; width: 200px;}

.alignRightField {display: none;}
.edi .alignRightField {display: block; padding: 8px 0 0;}

.popupWrap {display: block; position: fixed; top: 0; left: 0; background: rgba(0,0,0,.5); width: 100%; height: 100%; z-index: 1000;}
.popupWrap .inner { position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); padding: 32px; background: #fff; width: 90%; max-width: 500px; border-radius: 12px;}
.popupWrap .inner .close { position: absolute; top: 0; right: 0; width: 36px; text-align: center; line-height: 36px; font-size: 24px; cursor: pointer;}
.popupWrap .inner h3 {font-size: 20px; margin-bottom: 12px;}
.popupWrap .inner .listWrap {max-height: calc(100vh - 100px - 160px); overflow: auto;}
.popupWrap .inner .list {display: table; width: 100%; border-top: 1px solid #f1f1f1;}
.popupWrap .inner .list .item {display: table-row;}
.popupWrap .inner .list .item span {display: table-cell; font-size: 13px; padding: 4px 0; border-bottom: 1px solid #f1f1f1;}
.popupWrap .inner .list .item.head span {font-weight: 600;}
.popupWrap .inner .list .item span.age {width: 90px;}
.popupWrap .inner .list .item span.gender {width: 64px;}
.popupWrap .inner .list .item span.action {text-align: center; width: 80px}
.popupWrap .inner .list .item span.action a {color: blue; display: inline-block; padding: 4px 12px; text-decoration: none;}
.popupWrap .inner .list .item span.action a:hover {background: blue; color: #fff;}
.popupWrap .inner .ignoreCta {text-align: left; padding-top: 12px;}
.popupWrap .inner .ignoreCta a {display: inline-block; padding: 4px 12px; color: #fff; border: 0; background: blue; border-radius: 5px; font-size: 13px; text-decoration: none;}

.updateReportDateBtn {display: inline-block; border: 2px solid #fff; font-size: 16px; vertical-align: middle; padding: 4px 12px; color: #000; transition: all ease-in-out .2s; border-radius: 8px;}
.updateReportDateBtn:hover {border: 2px solid #ccc;}

.updateDatesFormWrap {position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,.8); display: none;}
.updateDatesFormWrap .updateDatesFormInner {position: absolute; top: 50%; left: 50%; width: 90%; max-width: 420px; background: #fff; transform: translate(-50%, -50%); padding: 20px; border-radius: 20px;}
.updateDatesFormWrap .updateDatesForm .testname {font-size: 20px; margin-bottom: 12px; font-weight: 500;}
.updateDatesFormWrap .updateDatesForm .field {margin-bottom: 20px;}
.updateDatesFormWrap .updateDatesForm .field .date, .updateDatesFormWrap .updateDatesForm .field .time {display: inline-block; width: calc(50% - 4px); vertical-align: top;}
.updateDatesFormWrap .updateDatesForm .field label {display: block; font-size: 14px; margin-bottom: 2px;}
.updateDatesFormWrap .updateDatesForm .field .date input[type=text] {display: block; width: 100%; height: 32px; border: 1px solid #ccc; padding: 0 8px; border-radius: 5px;}
.updateDatesFormWrap .updateDatesForm .field .time select {display: inline-block; width: calc(33.33% - 4px); height: 32px; border: 1px solid #ccc; padding: 0 8px; border-radius: 5px;}
.updateDatesFormWrap .close {position: absolute; top: 0; right: 0; line-height: 40px; width: 40px; text-align: center; cursor: pointer;}
.updateDatesFormWrap .close:hover {color: red;}
/*.updateDatesFormWrap .updateDatesForm .submit .btn {display: inline-block; width: auto;}*/

.expMess {position: fixed; bottom: 0; left: 0; width: 100%; padding: 4px 20px; background: #ffc3c3; border: 1px solid #ff2424; font-size: 12px; color: red; font-weight: 600; text-align: center;}

.loader {position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(255,255,255,.5);}
.loader img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}

.packSelectedTests {margin-bottom: 20px;}
.packSelectedTests .sortable .st {margin-bottom: 4px; padding: 8px 32px; background: #f3f3f3; font-size: 15px; position: relative;}
.packSelectedTests .sortable .st .del {position: absolute; right: 12px; top: 50%; cursor: pointer; transform: translateY(-50%);}
.packSelectedTests .sortable .st .move {position: absolute; left: 12px; top: 50%; cursor: pointer; transform: translateY(-50%);}
.packSelectedTests .sortable .st .del:hover {color: red;}
.addTestToPackW .btn { background: #526cf4; color: #fff; text-transform: uppercase; border: 0; font-size: 12px; cursor: pointer; border-radius: 6px; height: 32px; padding: 0 20px;}
.addTestToPackW select#addTestToPack {display: inline-block; width: calc(100% - 66px - 8px);}

.reportFilter .col3 .field {width: calc(33.33% - 2% - 4px); margin: 0 0 20px;}
.reportFilter .col3 .field:nth-child(3n+2) {margin: 0 3% 20px;}


.balance-table { width: 100%; border-collapse: collapse; margin: 20px 0; font-size: 13px;}
.balance-table th, .balance-table td { padding: 8px; border: 1px solid #ddd; }
.balance-table th { background-color: #f5f5f5; }
.export-btn { margin-left: 10px; padding: 6px 12px; background: #4CAF50; color: white; text-decoration: none; border-radius: 4px; }

.balance-table.fixed thead {position: fixed; top: 0;}

@media only screen and (max-width: 820px) {
    .aLeftSec {width: 100%; height: auto; border-radius: 0; z-index: 1;}
    .aLeftSec nav, .aLeftSec .proNLogout {display: none;}
    .aLeftSec .logo {text-align: left; display: block; width: 100%;}
    .aLeftSec .logo::after {content: ''; display: block; clear: both;}
    .aLeftSec .logo a {display: inline-block; float: left;}
    .aLeftSec .logo .menuBtn {display: inline-block;}
    body.showMenu .aLeftSec nav, body.showMenu .aLeftSec .proNLogout {display: block;}
    body.showMenu .aLeftSec {z-index: 2; height: 100%;}
    .aLeftSec .logo img {max-height: 36px;}
    
    .loginWrap .logo img, .labListToSelect .labListing .logo img {height: 40px;}
    .aRightSec {margin-left: 0;}
    .rightbtn {float: none; width: 100%; margin-bottom: 6px; text-align: center;}
    
    body.showMenu {height: 100%; overflow: hidden;}
    .aRightSec .userInfo {display: none;}
    
    body.showMenu .aLeftSec nav {display: block;}
    .aLeftSec nav {width: 100%; margin: 0; text-align: left; padding-top: 12px;}
    .aLeftSec nav ul li {display: block; }
    .aLeftSec nav ul li a {padding: 12px 16px; margin-bottom: 2px;}
    .aLeftSec nav ul li.active > a {border-radius: 0; border-top-right-radius: 12px; border-bottom-right-radius: 12px;}
    .aLeftSec nav ul li.sub > a::after {position: absolute; top: 14px; right: 12px; transform: rotate(-90deg);}
    
    .aLeftSec nav ul li.open ul {position: static; transform: none; width: 100%; margin-bottom: 6px;}
    .aLeftSec nav ul li ul::before {display: none;}
    
    .aLeftSec .proNLogout .profile .dd {position: static; transform: none; width: 100%; margin: 6px 0;}
    .aLeftSec .proNLogout .profile.active .dd::before {display: none;}
    
    .aLeftSec .proNLogout {width: 100%; padding-top: 6px;}
    .aLeftSec .proNLogout .profile {min-width: calc(160px - 4px); width: calc(100% - 80px - 4px);}
    .col4 .field {width: calc(50% - 4px - 2%); margin-left: calc((8% / 1));}
}
@media only screen and (max-width: 620px) {
    .aRightSec .pageTitle {padding: 12px 0;}
    .formSecWrap {padding: 0 0;}
    .aRightSec .pageTitle h3 {font-size: 18px;}
    .formSecWrap h3 {font-size: 16px;}
    .selectedLab {width: 50%; font-size: 12px;}
    .testReportList .row.searchRow .col, .testReportList .row.searchRow .col.sno {width: 100%; margin-bottom: 4px; display: block;}
    .testReportList .row.searchRow .col:nth-child(4) ~ .col {display: none;}
    .testReportList .row .col.sno {display: none;}
    .testReportList .row .col.patient {width: calc(100% - 80px - 4px);}
    .testReportList .row .col.printcta, .testReportList .row .col.date, .testReportList .row .col.action {width: 100%;}
    .testReportList .row .col.action a {display: inline-block;}
    .testReportList .row .col.date::before {content: 'Registration date: ';}
    .testReportList .row .col.printcta a, .testReportList .row .col.action a {padding: 4px 12px; font-size: 13px;}
    .testReportList .row .col {padding: 4px;}
    .testReportList .row {border-radius: 12px;}
    .col3 .field {width: 100%;}
    .col3 .field .col3 .field {width: calc(33.33% - 4% - 4px);}
    .resultWrap .reportTable {font-size: 12px;}
    .reportTable .row.head {display: none;}
    .reportTable.testReportList .row.head {display: block;}
    .reportTable {display: block;}
    .reportTable .row {display: block; margin-bottom: 8px; border: 2px solid #f2f2f2; border-radius: 8px; padding: 12px;}
    .reportTable .row .col {display: block; width: 100%; border: 0; padding: 0; font-size: 13px; margin: 0 0 8px;}
    
    .patientDetails {font-size: 14px;}
    .patientDetails .pic {width: calc(64px - 4px);}
    .patientDetails .txt {width: calc(100% - 12px - 64px - 4px); margin-left: 12px;}
    .col2 .field {width: 100%;}
    .patientDetails .txt .name {font-size: 14px;}
    .patientDetails .txt .other, .patientDetails .txt .uid {font-size: 12px;}
    .patientDetails .col2 .field {margin-bottom: 12px;}
    .mob {display: inline-block !important;}
    
    .testReportupdate .test .reportTable .row .col {padding: 0; display: block;}
    .testReportupdate .test .reportTable .row .col.input {width: 100%;}
    .testReportupdate .test .reportTable .row .col.unit, .testReportupdate .test .reportTable .row .col.default {width: calc(50% - 4px);}
    .report4ctas button {width: calc(50% - 4px - 20px); margin: 0 10px 10px;}
    .testReportupdate .test .reportTable .row .col.param {width: 100%;}
    .col4 .field {width: calc(100%); margin: 0 0 12px;}
    .DVList, .DVList .DVListSelect {width: 100%;}
}