#customers {
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  border-collapse: collapse;
  width: 100%;
}

#customers td, #customers th {
  border: 1px solid #ddd;
  padding: 8px;
}

#customers td:nth-child(even){background-color: #f2f2f2;}

#customers tr:hover {background-color: #ddd;}

#customers th {
  padding-top: 12px;
  padding-bottom: 12px;
  text-align: left;
  background-color: #43BFC7;
  color: white;
}

p.popup { font-size: 15px; margin: 0px; text-align: left;}
.popup img {width:40%;border:#666 solid 1px;margin:40px 0 0 0}

#blanket {
	background-color: #fff;
	opacity: 0.7;
	filter: alpha(opacity=0);
	position: absolute;
	z-index: 9001;
	top: 0px;
	left: 0px;
	width: 100%;
}

#popUpDiv {
	position: absolute;
	background-color: #fff;
	width: 420px;
	height: auto;
	z-index: 9002;
	padding: 20px;
	border:#333 1px solid;
	border-radius:5px;
}
.total_fields 
{
	text-align:left; 
	color:black;
	font:11px Verdana, Geneva, sans-serif; 
	padding: 5px; 
	font-weight:bold;
	border: solid 1px  #A4D1FF;
	font: normal 12px Verdana, Tahoma, sans-serif;
	background: #FFFFFF left top repeat-x;
	background: -webkit-gradient(linear, left top, left 25, from(#FFFFFF), color-stop(4%, #EEEEEE), to(#FFFFFF));
	background: -moz-linear-gradient(top, #FFFFFF, #EEEEEE 1px, #FFFFFF 25px);
	box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;/*0.1 actually means 10 %*/
	-moz-box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;
	-webkit-box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;
	outline:none;
	-webkit-border-radius: 5px 5px 5px 5px;
	-moz-border-radius: 5px 5px 5px 5px;
	border-radius: 5px 5px 5px 5px;
	outline:none;
}
.total_fields:focus { 
outline: 0;
 box-shadow: 0 0 10px #666;
	-moz-box-shadow: 0 0 10px #666;
	-webkit-box-shadow: 0 0 10px #666;
}

.ui-btn{
    font-size:16px;
    margin:.5em 0;
    padding:.7em 1em;
    display:block;
    position:relative;
    text-align:center;
    text-overflow:ellipsis;
    overflow:hidden;
    white-space:nowrap;
    cursor:pointer;
    border-width: 1px;
    border-style: solid;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none
}

.ui-corner-all{
    -webkit-border-radius:.3125em;
    border-radius:.3125em
}
/* ----------------------- TWO columns ------------------------------------ */

.column_one
{ float:left; width: 800px; padding: 5px;
  background-color: #F5F5F5;}

.column_two
{ float:left; width: 400px; padding: 2px;   
  /* background-color: #A0A0A0; */
}



body {
	font:13px/18px "Trebuchet MS", Arial, Helvetica, sans-serif;
	position:relative;
}
html, body { 
	/*height:100%;*/
        margin:0;
        padding:0;
}

table th {
    padding:5px;
    text-align: center;
    vertical-align: center;
}
table th:nth-child(1) {
    padding:5px;
    text-align: left;
    vertical-align: center;
}


#floatbody{ margin-top: 180px; 
/*height: 3000px; 
overflow: auto*/;
}

.divheaderTOP { min-width: 100%; height: 35px; display: inline-block; background-color: #fff; }
.divheaderSUB { min-width: 100%; height: 100px; display: inline-block; background-color: #fff; border-bottom: 1px solid; }
.width100 { width:100px; }
.width120 { width:120px; }
.width150 { width:150px; }

.divmenuG1
{
    cursor: pointer;
    height:40px;
    display: table-cell;
    vertical-align: top;
    line-height: 40px;
}

#parent {position: relative;}

#child {
    position: absolute;
    top: 50%;
    left: 50%;
    height: 30%;
    width: 50%;
    margin: -15% 0 0 -25%;
}


/* Global Structure---------------------------------------- */
.main {
	margin:0 auto;
	width:950px;
	position:relative;
}
.container_24 {
	position:centre;
}


label {
  display: inline-block;
  font-size: 14px;
  font-weight: bold;
}

.mobrpt {
  font-size: 1em;
}

button,input,select,textarea {
  margin: 0;
  font: inherit;
  color: inherit;
}
button {
  overflow: visible;
}
button,
select {
  text-transform: none;
}
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  cursor: pointer;
}
button[disabled],
html input[disabled] {
  cursor: default;
}
button::-moz-focus-inner,
input::-moz-focus-inner {
  padding: 0;
  border: 0;
}
.btn-login {
        background-color: #ccc;
	min-width:200px;
        height: 50px;
}
.btn-signup {
	min-width:50px;
}
.btn-RegType {
	min-width:150px;
}
.btn-default {
  color: #333;
  background-color: #fff;
  border-color: #ccc;
}
  .btn > .caret,
  .dropup > .btn > .caret {
    border-top-color: #000 !important;
  }
.btn {
  display: inline-block;
  padding: 6px 12px;
  margin-bottom: 0;
  font-size: 16px;
  font-weight: normal;
  line-height: 1.42857143;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -ms-touch-action: manipulation;
      touch-action: manipulation;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  background-image: none;
  border: 1px solid transparent;
  border-radius: 4px;
}
.btn:focus,
.btn:active:focus,
.btn.active:focus,
.btn.focus,
.btn:active.focus,
.btn.active.focus {
  outline: thin dotted;
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
}
.btn:hover,
.btn:focus,
.btn.focus {
  color: #333;
  text-decoration: none;
}
.btn:active,
.btn.active {
  background-image: none;
  outline: 0;
  -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
          box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
}

.btn-default {
  color: #333;
  background-color: #fff;
  border-color: #ccc;
}
.btn-default:hover,
.btn-default:focus,
.btn-default.focus,
.btn-default:active,
.btn-default.active,
.open > .dropdown-toggle.btn-default {
  color: #333;
  background-color: #7091bf;
  border-color: #adadad;
}

/*----- txt,links,lines,titles -----*/	

h1, h2, h3, h5, h6 {
	font-family: 'Open Sans', sans-serif;
	color:#2f2f2f;
}
h1 {
	font-size:32px;
	line-height:34px;
}
h2 {
	font-size:16px;
	line-height:16px;
}
h3 {
	font-size:14px;
	line-height:10px;
        color: #000000;
}
h4 {
	font-size:14px;
	line-height:14px;
        color: #43BFC7;
        margin: 0px 0px 5px 0px;
}
h5 {
	font-size:30px;
	margin: 15px 0px 10px 0px;
        font-family: "Arial Black", Gadget, sans-serif;
}
h6 {
	font-size:42px;
     	line-height:22px;
	margin: 0px 0px 0px 0px;
	color:#ffffff;
}
a {
	color:#303030;
	outline:none;
	cursor:pointer;
	text-decoration:none
}
a:focus {
	outline:none;
}
a:hover {
	color:#87c7d5;
	text-decoration:strong;
}

.wrapper {
	width:100%;
	overflow:hidden;
	position:relative;
}
.extra-wrap {
	overflow:hidden;
	display:block;
}
p {
	padding-bottom:7px;
}

.hbox
{
    height: 50px;
    background: #fff;
    font-size: 24px;
    text-align: center;
    padding: 0 20px;
    margin: 0px;
    display: flex;
    justify-content: center; /* align horizontal */
    align-items: center; /* align vertical */
}

.homebox
{
    height: 250px;
    background: #fff;
    font-size: 24px;
    text-align: center;
    padding: 0 0px;
    margin: 0px;
    display: flex;
    justify-content: center; /* align horizontal */
    align-items: center; /* align vertical */
}



/* ------------------- for-control textbox etc format ------------------------*/

.form-control {

  height: 34px;
  width:  300px;
  padding: 2px 2px;
  font-size: 16px;
  line-height: 1.42857143;
  margin-bottom: 10px;
  color: #555;
  background-color: #fff;
  background-image: none;
  border: 1px solid #ccc;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
          box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
  -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
       -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
          transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}
.form-control:focus {
  border-color: #66afe9;
  outline: 0;
  -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6);
          box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6);
}


/* ----------------------- THREE columns ------------------------------------ */

.left_column
{ float:left; width: 400px; padding: 2px;   
  background-color: #F5F5F5;}

.middle_column
{ float:left; width: 600px; padding: 5px;  }

.right_column
{ float:left; width: 360px; padding: 5px;}


/* ----------------------- THREE column ------------------------------------ */

.container3{
    margin: 0 auto;
    padding: 0px;
    display: table-cell;
}
#one3 {
  float:left; 
  background-color: rgb(34, 177, 76);
  margin:10px 10px;
  min-height:170px;
  width:270px;
  display:inline-block;
}
#two3 { 
  float:left; 
  background-color: rgb(176, 0, 27);
  margin:10px 10px;
  min-height:170px;
  width:270px;
  display:inline-block;
}
#three3 { 
  float:left; 
  background-color: rgb(112, 146, 190);
  margin:10px 10px;
  min-height:170px;
  width:270px;
  display:inline-block;
}

.div3image
{
    max-width: 100%;
    height: 270px;
    
}


/* ----------------------- DIV Menu Side by side ------------------------- */
.divBTNmenu{
  float:left; 
  width:150px;
  padding: 5px 10px 5px 10px;
  cursor: pointer;
  text-align:center;
  display:inline-block;

}

.divmenusection{
    min-width: 100%; 
    float:left;
    margin: 0px;
    padding: 0px;
    display: table-cell;   
}
.divmenu{
  float:left; 
  width:120px;
  padding: 5px 10px 5px 10px;
  margin: 5px;
  cursor: pointer;
  text-align:center;
  display:inline-block;
  border-style: solid;
  border-color: #5DADE2;
  border-radius: 10px;
}
.divmenusearch{
  float:right; 
  padding: 5px 10px 0px 2px;
  margin: 0px;
  cursor: pointer;
  display:inline-block;
  background-color: #FF9900;
}
.divmenu:hover{
   background-color:#5DADE2;
}

.divmenulabelcounter{
  float:left; 
  padding: 5px 5px 0px 5px;
  margin: 0px;
  line-height: 25px;
  text-align:center;
  vertical-align: middle;
  display:inline-block;
  border-color: #5DADE2;
}
.divmenulabel{
  float:left; 
  padding: 0px 1px 0px 1px;
  margin: 0px;
  width: 135px;
  cursor: pointer;
  text-align:left;
  vertical-align: middle;
  display:inline-block;
  border-style: solid;
  border-color: #5DADE2;
}
.divmenucounter{
  float:right; 
  padding: 0px 2px 1px 2px;
  margin: 3px;
  font-size: 140%;
  font-weight:bold;
  text-align:center;
  color: #5DADE2;
  background-color:#DCDCDC;
  display:inline-block;
  border-style: solid;
  border-color: #DCDCDC;
}
.divmenulabelcounter:hover{
   background-color:#5DADE2;
}
div:focus {
    background-color:red;
}


.divmenulabelupload{
  float:left; 
  padding: 5px 5px 0px 5px;
  margin: 0px;
  line-height: 30px;
  width: 190px;
  text-align:center;
  vertical-align: middle;
  display:inline-block;
  cursor: pointer;
  background-color:#00CC66;
  border-color: #5DADE2;
}
.divmenulabelupload:hover{
   background-color:#5DADE2;
}


.textwidth120 { display: inline-block; width: 135px; height:25px; }



/********************************* TABLE for List**********************************/

table.table-list  {
    border:none;
    border-collapse: separate; 
    border-spacing:0px;
    text-align: right;

}
.table-list td {
    padding:5px;
    font-size:13px;
    text-align: right;
    vertical-align: top;
    
}
.table-list th {
    background-color: #483f3f;
    color: #ffffff;
    padding:5px;
    text-align: center;
    vertical-align: top;
}
.table-list td:first-child { text-align: left;}
.table-list tr:hover {background-color: #f5f5f5}
.table-list tr:nth-child {background-color: #f5f5f5}
.table-list tr:last-child {border-bottom: 1px solid #999999}

th {
    font-weight:bold;
    text-align:left;
    padding:5px;
}


.table-list td a:hover{
    text-decoration: underline;
}


/* Sortable tables */
table.sortable thead {
    background-color:#aed6f1;
    color:#666666;
    font-weight: bold;
    cursor: default;
}


table.sortable th:not(.sorttable_sorted):not(.sorttable_sorted_reverse):not(.sorttable_nosort):after { 
    content: " \25B4\25BE" 
}




/* ----------------------- TWO column ------------------------------------ */

.container2{
    margin: 0 auto;
    padding: 0px;
    display: table-cell;
}
#one2 {
  float:left; 
  margin:10px 10px;
  padding: 5px;
  width:320px;
  display:inline-block;
}
#two2 { 
  float:left; 
  margin:10px 10px;
  padding: 5px;
  width:320px;
  display:inline-block;
}

#two2wide { 
  float:left; 
  margin:10px 10px;
  padding: 5px;
  width:600px;
  display:inline-block;
}

#two3wide { 
  float:left; 
  margin:10px 10px;
  padding: 5px;
  width:800px;
  display:inline-block;
}


/* ----------------------- Seting up media screen size ------------------------------------ */


    .homebkgimage
    {       
        background-image: url('images/indexbkg1.png');        
        background-size:cover;
        margin-left: 0;      
        margin-right: 0;   
        width: 100%;
        height: 600px;
        float:left; 
        color: #000000;    
    }  

    .homelink
    {
        color:#488AC7;
        font-size: 16px;
    }

    
@media (min-width: 992px) {
    .divpad50{
        padding-left: 50px;
        padding-top: 100px;
    }
    .container3{
        width: 880px;
    }
    .container2{
       width: 700px;
    }
    .menumobile
    {
        display: none;
    }
    .menupc
    {
        display: block;
        width: 250px;
    }

}

@media (min-width: 480px) and (max-width: 991px) {
    .divpad50{
        padding-left: 50px;
        padding-top: 100px;
    }
    .container3{
        width: 880px;
    }
    .container2{
       width: 700px;
    }
    .menumobile
    {
        display: none;
    }
    .menupc
    {
        display: block;
        width: 250px;
    }
    

}


@media (max-width: 479px) {
    .divpad50{
        padding-left: 10px;
        padding-top: 35px;
    }
    .container3{
        width: 280px;
    }
    .container2{
       width: 320px;
    }
    .menumobile             /*----------- show menu icon if its mobile phone ------------- */
    {
        display: block;
    }
    .menupc                 /*----------- hide main menu if its mobile phone ------------- */
    {
        display: none;
        width: 250px;
    }
h5 {
	font-size:20px;
	margin: 5px 0px 2px 0px;
        font-family: "Arial Black", Gadget, sans-serif;
}
.middle_column
{ float:left; width: 400px; padding: 1px;  }

}
/*anam */


.containerTab {
  padding: 20px;
  color: white;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}

/* Closable button inside the image */
.closebtn {
  float: right;
  color: white;
  font-size: 35px;
  cursor: pointer;
}

/* Style the button that is used to open and close the collapsible content - ANAM */
.collapsible {
  background-color: #eee;
  color: #444;
  cursor: pointer;
  padding: 18px;
  width: 100%;
  border: none;
  text-align: left;
  outline: none;
  font-size: 15px;
}

/* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
.active, .collapsible:hover {
  background-color: #ccc;
}

/* Style the collapsible content. Note: hidden by default */
.content {
  padding: 0 18px;
  display: none;
  overflow: hidden;
  background-color: #f1f1f1;
}