/* DivTable.com */
@media all and (max-width: 1024px) {
body .card_right {
    width: 67% !important;
}
}
.bbr {

    float: left;
    width: 100%;
    border: 1px solid #ccc;
    padding: 5px 4px 0;
    margin: 0 0 20px 0;
    background: #f6f6f6;

}
.SaveBtn {

    float: right;
    background: #153980;
    color: #fff;
    border: none;

}
.SaveBtn:hover {
	 background: #22b24c;
}
@media all and (max-width: 768px) {
	.m_menu {
    float: right;
    padding: 4px 7px !important;
    border-radius: 4px;
    background: #22b24c;
    color: #fff;
    border: none;
	 margin: 7px 0 0 0px;
}
table {

    border-spacing: 0;
    border-collapse: collapse;
    font-size: 11px;

}
.applicant td, .applicant th {

    border: 1px solid #ddd;
    padding: 3px !important;

}
.m_menu:hover {
	background:#153980;
	color:#fff !important;
}
.logoline {
    float: left;
    margin: 0 0 0 0px;
}
.tagline {
    color: #153980;
    padding: 4px 0 0 0;
    margin: 0;
    font-size: 20px !important;
    text-align: left;
    width: 100%;
}
.w3-main {
margin-top: 88px !important;
}
body .card_left {
    float: none !important;
    overflow: hidden;
    background: transparent;
    border-radius: 50%;
    border: 1px solid #ccc;
    padding: 3px;
    margin: 0 auto;
}
body .card_right {
    width: 100% !important;
}
body .card_right h1 {
    color: #153980;
    font-weight: 400;
    text-align: center !important;
    font-size: 31px;
    margin: 10px 0 0 0;
    padding: 0 0 0 0px !important;
    letter-spacing: 1px;
}
body .card_right__details ul li {
  
    padding: 0 !important;
}
body .card_right__details ul {
    list-style-type: none;
    padding: 0 !important;
    margin: 10px 0 0 0;
    text-align: center !important;
    width: 100%;
}
body .card_right__review p {
    color: #3d3d3d;
    font-size: 16px;
    padding: 0 0 0 0px !important;
}
.card_right__review label {
    width: auto !important;
    padding: 0 11px 0 0;
}

.tab {
    overflow: visible !important;
    margin: 15px 0 8px 0;
    float: left;
    width: 100%;
}
.w3-half1 {
    width: 100% !important;
    margin: 0 auto;
}
.MyRow2nd {
    float: left !important;
    width: 100% !important;
    padding-right: 0 !important;
	padding-bottom:7px !important;
}
.MyRowFull {
    
    padding: 0 !important;
}
.minmar {
	margin-top:30px !important;
}
.pad_b_10 {
	padding-bottom:9px !important;
}
.l_menu {
    padding: 0;
    margin-top: 40px;
}
.tabcontent {
    display: none;
    padding: 6px 0px !important;
}
.applicant {

	overflow:scroll;
}
 #CurrentTests{
    display: block;
    float: left;
    width: 100%;
    overflow: scroll;
    padding: 0px 3px !important;
}
}
.select2 {
	padding:9px;
}
.divTable{
    display: table;
    width: 100%;
}
.divTableRow {
    display: table-row;
}
.divTableHeading {
    background-color: #EEE;
    display: table-header-group;
}
.divTableCell, .divTableHead {
    border: 0px solid #999999;
    display: table-cell;
    padding: 3px 10px;
    width:50%;
}
.divTableHeading {
    background-color: #EEE;
    display: table-header-group;
    font-weight: bold;
}
.divTableFoot {
    background-color: #EEE;
    display: table-footer-group;
    font-weight: bold;
}
.divTableBody {
    display: table-row-group;
}

input,select
{
    border-radius:5px;
    padding:4px;
    font-weight: bold;
}
.boxshadow
{
    -webkit-box-shadow: 0px 0px 21px 8px rgba(0,0,0,0.38);
-moz-box-shadow: 0px 0px 21px 8px rgba(0,0,0,0.38);
box-shadow: 0px 0px 21px 8px rgba(0,0,0,0.38);
}
/*            THis is another Div as table ----------------------------------------*/
div.table
{
    display:table;
    width:100px;
    background-color:lightblue;
    border-collapse:collapse;
    border:0px solid red;
}



 .MyRow
  {
    width:50%;float:left;
  }

   .MyRow3rd
 {
    width: 33%;
    float: left;
    padding-right: 5px;
}
   .MyRowStar
  {
    width:67%;float:left;
  }
.MyRow2nd {
    float: left;
    width: 50%;
    padding-right: 7px;
}
.MyRowFull {
    width: 100%;
    float: left;
    padding: 0 0 11px 0;
}
.MyCtl {
    width: 100%;
    border: 1px solid #666;
    border-radius: 5px;
    padding: 9px;
}
   .MyCtl2
  {
    width:88%;border:1px solid black;
    border-radius:5px;
  }
  .snap
  {
    text-align:center;
    border:1px dotted green;
  }
  .attachment
  {
    width:100%;border:1px dotted green;font-weight:bold;background-color:yellow;clear:both;border-radius:5px;padding-left:4px;
  }


  
div.row
{
    display:table-row;
}

div.cell
{
    display:table-cell;
    border:0px solid red;
}

div.colspan,div.colspan+div.cell
{
    border:0;
}

div.colspan>div
{
    width:1px;
}

div.colspan>div>div
{
    position:relative;
    width:99px;
    overflow:hidden;
}




   .tt
     {
        border:1px solid grey;
        padding-top: 1px;
        font-size:14px;
        width:100px;
        text-align:right;
     }
      .txt
     {
        border:1px solid grey;
        padding-top: 1px;
        font-size:14px;
        
        text-align:left;
     }
       .txt1
     {
        border:1px solid black;
        padding-top: 1px;
        font-size:14px;
        
        text-align:left;
     }
     .DelBtn
     {
        border:1px dotted rgb(64,150,238);
        padding-top: 1px;
        font-size:14px;
        width:50px;
        background-color:brown;

     }
     .AddItem
     {
        border:1px solid rgb(64,150,238);
        padding-top: 1px;
        font-size:14px;
        width:50px;
 
     }
      .SaveBtn
     {
        border:1px solid rgb(64,150,238);
        padding-top: 1px;
        font-size:14px;
        width:50px;

     }
    .EditBtn
     {
        border:1px solid rgb(64,150,238);
        padding-top: 1px;
        font-size:14px;

     }
        .LeftCol
    {
        color:white;font-size:20px;
        width:220px;
        text-align: left;
    }
    .RightCol
    {
        color:white;font-size:20px; 
        width:20px;
        text-align: right;
    }
    .boxShadow
    {
        -webkit-box-shadow: 0px 0px 18px 1px rgba(0,0,0,0.75);
        -moz-box-shadow: 0px 0px 18px 1px rgba(0,0,0,0.75);
      box-shadow:0px 0px 6px 1px rgba(0,0,0,0.2);
    }


        #snackbar {
    visibility: hidden; /* Hidden by default. Visible on click */
    min-width: 250px; /* Set a default minimum width */
    margin-left: -125px; /* Divide value of min-width by 2 */
    background-color: #333; /* Black background color */
    color: #fff; /* White text color */
    text-align: center; /* Centered text */
    border-radius: 2px; /* Rounded borders */
    padding: 16px; /* Padding */
    position: fixed; /* Sit on top of the screen */
    z-index: 1; /* Add a z-index if needed */
    left: 50%; /* Center the snackbar */
    bottom: 30px; /* 30px from the bottom */
}

/* Show the snackbar when clicking on a button (class added with JavaScript) */
#snackbar.show {
    visibility: visible; /* Show the snackbar */

/* Add animation: Take 0.5 seconds to fade in and out the snackbar.
However, delay the fade out process for 2.5 seconds */
    -webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s;
    animation: fadein 0.5s, fadeout 0.5s 2.5s;
}

/* Animations to fade the snackbar in and out */
@-webkit-keyframes fadein {
    from {bottom: 0; opacity: 0;}
    to {bottom: 30px; opacity: 1;}
}

@keyframes fadein {
    from {bottom: 0; opacity: 0;}
    to {bottom: 30px; opacity: 1;}
}

@-webkit-keyframes fadeout {
    from {bottom: 30px; opacity: 1;}
    to {bottom: 0; opacity: 0;}
}

@keyframes fadeout {
    from {bottom: 30px; opacity: 1;}
    to {bottom: 0; opacity: 0;}
}

/* ======================================================For Tab Control */

.tab {
    overflow: hidden;
 background:#f6f6f6;
}
.l_menu {
    padding: 0;
	margin-top:76px;
}
.w3-main {
	margin-top:92px !important;
}
.l_menu a {
    border-bottom: 1px solid #ccc;
    padding: 15px 16px !important;
    color: #153980;
}
/* Style the buttons that are used to open the tab content */
.tab button {
    background-color: inherit;
	background: #153980;
    float: left;
    border: none;
    outline: none;
    cursor: pointer;
    padding: 11px 18px;
    transition: 0.3s;
    color: #fff;
    letter-spacing: 0.5px;
    font-size: 15px;
    margin: 0 3px 0 0;
}

/* Change background color of buttons on hover */
.tab button:hover {
    background-color: #1dae48;
}

/* Create an active/current tablink class */
.tab button.active {
    background-color: #1dae48;
}

/* Style the tab content */
.tabcontent {
    display: none;
    padding: 6px 12px;
    border: 1px solid #ccc;
    border-top: none;
	background:#fff;
}

.tablinks
{
  font-size:20px;
  font-weight: bold;

}



.MyBtn
{
   background-image: none;
  border: none;
 /* font: 100%/1.5em "Varela Round", sans-serif;*/
  margin: 0;
  padding: 0;
  transition: all .3s;
  background: #33cc77;
  color: #fff;
  display: block;
  margin: 0 auto;
  padding: 4px 0;
  width: 175px;
}

.MyBtnApply
{
   background-image: none;
  border: none;
 /* font: 100%/1.5em "Varela Round", sans-serif;*/
  margin: 0;
  padding: 0;
  transition: all .3s;
  background: #008CBA;
  color: #fff;
  display: block;
  margin: 0 auto;
  padding: 4px 0;
  width: 175px;
}





body {
  background: #e2e2e2;
  width: 100%;
overflow-x:hidden;
}
body .card {
    width: 100%;
    height: 240px;
    background: transparent;
   
    left: 0;
    right: 0;
    margin: auto;
    top: 0;
    bottom: 0;
    border-radius: 0px;
    padding: 0px 16px 0 16px;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
  
}
body .card_left {
    width: 220px;
    height: 220px;
    float: left;
    overflow: hidden;
    background: transparent;
    border-radius: 50%;
    border: 1px solid #ccc;
    padding: 0px;
}
body .card_left img {
    width: 101%;
    height: auto !important;
    position: relative;
    min-height: 220px;
    margin: -1px -1px -1px -1px;
}
body .card_right {
 width: 77%;
float: right;


 /* border-radius: 0 10px 10px 0;
  -webkit-border-radius: 0 10px 10px 0;
  -moz-border-radius: 0 10px 10px 0;*/
}
.cnic li span {
    letter-spacing: 1px;
	color: #0db14b;
}
.cnic {
    margin: 0 0 10px 0 !important;
}
body .card_right h1 {
    color: #153980;
    font-weight: 400;
    text-align: left;
    font-size: 36px;
    margin: 10px 0 0 0;
    padding: 0 0 0 40px;
    letter-spacing: 1px;
}
body .card_right__details ul {
  list-style-type: none;
  padding: 0 0 0 40px;
  margin: 10px 0 0 0;
}
body .card_right__details ul li {
  display: inline;
  color: #e3e3e3;
 
  font-weight: 400;
  font-size: 14px;
  padding: 0 40px 0 0;
}
body .card_right__rating__stars {
  position: relative;
  right: 160px;
  margin: 10px 0 10px 0;
  /***** CSS Magic to Highlight Stars on Hover *****/
  /* hover previous stars in list */
}
body .card_right__rating__stars fieldset, body .card_right__rating__stars label {
  margin: 0;
  padding: 0;
}
body .card_right__rating__stars .rating {
  border: none;
}
body .card_right__rating__stars .rating > input {
  display: none;
}
body .card_right__rating__stars .rating > label:before {
  margin: 5px;
  font-size: 1.25em;
  display: inline-block;
  content: "\f005";
 
}
body .card_right__rating__stars .rating > .half:before {
  content: "\f089";
  position: absolute;
}
body .card_right__rating__stars .rating > label {
  color: #ddd;
  float: right;
}
body .card_right__rating__stars .rating > input:checked ~ label,
body .card_right__rating__stars .rating:not(:checked) > label:hover,
body .card_right__rating__stars .rating:not(:checked) > label:hover ~ label {
  color: #FFD700;
}
body .card_right__rating__stars .rating > input:checked + label:hover,
body .card_right__rating__stars .rating > input:checked ~ label:hover,
body .card_right__rating__stars .rating > label:hover ~ input:checked ~ label,
body .card_right__rating__stars .rating > input:checked ~ label:hover ~ label {
  color: #FFED85;
}
body .card_right__review p {
    color: #3d3d3d;
    font-size: 16px;
    padding: 0 40px 0 40px;
    letter-spacing: 1px;
    margin: 12px 0 0px 0;
    line-height: 14px;
    float: left;
    width: 100%;
}
.card_right__review label {
    width: 19%;
}
body .card_right__review a {
  text-decoration: none;
 
  font-size: 20px;
  padding: 0 0 0 40px;
  color: #ffda00;
  margin: 0;
}
body .card_right__button {
  padding: 0 0 0 40px;
  margin: 30px 0 0 0;
}
body .card_right__button a {
  color: #ffda00;
  text-decoration: none;
  font-family: 'Montserrat', sans-serif;
  border: 2px solid #ffda00;
  padding: 10px 10px 10px 40px;
  font-size: 12px;
  
  background-size: 12px 12px;
  background-repeat: no-repeat;
  background-position: 7% 50%;
  border-radius: 5px;
  -webkit-transition-property: all;
  transition-property: all;
  -webkit-transition-duration: .5s;
  transition-duration: .5s;
}
body .card_right__button a:hover {
  color: #000000;
  background-color: #ffda00;
  
  background-size: 12px 12px;
  background-repeat: no-repeat;
  background-position: 10% 50%;
  cursor: pointer;
  -webkit-transition-property: all;
  transition-property: all;
  -webkit-transition-duration: .5s;
  transition-duration: .5s;
}