.vanity_panel{
  margin-top: 20px;
  margin-bottom:20px;
  width:100%;
  height:100%;
  border-top:1px solid #f5f5f5;
  overflow:hidden;
  -webkit-box-shadow: 0px 3px 3px 0px rgba(195, 197, 199, 1);
    -moz-box-shadow:    0px 3px 3px 0px rgba(195, 197, 199, 1);
    box-shadow:         0px 3px 3px 0px rgba(195, 197, 199, 1);
  
}

.leftcol{
	width:30%;
	float:left;
}

h3{
  font-family: 'Roboto', sans-serif;
  font-size: 24px;
  padding-left:10px;
  color: #0971b8;
  text-transform: uppercase;
  text-align:center;
  font-weight: 700;
  margin-bottom: 15px;
}
@import url(https://fonts.googleapis.com/css?family=Roboto:400,500,300,700);
table{
  width:100%;
  table-layout: fixed;
  font-family: 'Roboto', sans-serif;
  
}
.tbl-header{
  background-color: rgba(42, 166, 242, 1);
  background: -webkit-linear-gradient(left, #2aa6f2, #0e84d3);
  background: linear-gradient(to right, #2aa6f2, #0e84d3);
 }
 
.tbl-header .title-one{
	font-family: 'Roboto', sans-serif;
	padding-left:33%;
	font-size:12px;
	font-weight:600;
	text-transform:uppercase;
	letter-spacing:2px;
	text-align:center;
	color:#ffffff;
}

.tbl-header .title-two{
	font-family: 'Roboto', sans-serif;
	padding:12px;
	margin-top:0px;
	font-size:11px;
	font-weight:300;
	text-transform:uppercase;
	letter-spacing:1px;
	text-align:center;
	color:#ffffff;
}

.tbl-header .comp-pan{
	display:inline-block;
	font-family: 'Roboto', sans-serif;
	color:#fff;
	width:50%;
	margin-left:23%;
	margin-top:10px;
	margin-bottom:-27px;
	padding:5px;
	font-size:11px;
	letter-spacing:1px;
	border-radius:4px;
	border: 1px solid rgba(42, 166, 242, 1);
	text-align:center;
}

/* for buttons in single strip */
.panbut{
	display:block;
	margin-top:10px;
	margin-left:3%;
	margin-bottom:0;
	width:300px;
	height:30px;
	background:#004b7d;
	border-radius: 4px;
	text-align:center;
	
}

.button-one{
	display:inline-block;
	position:relative;
	padding-top:11px;
	padding-bottom:4px;
	width:60px;	
    background:none;
    color: #f2f2f2;
    border-radius: 2px;
	font-size:9px;
	font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 1px;
    -moz-transition: all 0.2s;
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
	text-decoration:none;
}
.button-one1{
	display:inline-block;
	position:relative;
	padding-top:11px;
	padding-bottom:4px;
	width:60px;	
    background:none;
    border-radius: 2px;
	font-size:9px;
	font-weight:bold;
    text-transform: uppercase;
    letter-spacing: 1px;
    -moz-transition: all 0.2s;
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
	text-decoration:none;
	background:#f2f2f2;
	color:#0069b0;
}
.button-two{
	display:inline-block;
	position:relative;
		padding-top:11px;
	padding-bottom:4px;	
	width:60px;
    background:none;
    color: #17be27;
	display: inline-block;
    border-radius: 2px;
	font-size:9px;
	font-weight:bold;
    text-transform: uppercase;
    letter-spacing: 1px;
    -moz-transition: all 0.2s;
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
	text-decoration:none;
}
.button-two1{
	display:inline-block;
	position:relative;
	padding-top:11px;
	padding-bottom:4px;
	width:60px;
    background:none;
	background:#17be27;
	color:#f2f2f2;
	display: inline-block;
    border-radius: 2px;
	font-size:9px;
	font-weight:bold;
    text-transform: uppercase;
    letter-spacing: 1px;
    -moz-transition: all 0.2s;
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
	text-decoration:none;
}
.button-three {
	display: inline-block;
	position:relative;
		padding-top:11px;
	padding-bottom:4px;
	width:60px;
	height:auto;
    background:none;
    color: #f4b907;
    border-radius: 2px;
	font-size:9px;
	font-weight:bold;
    text-transform: uppercase;
    letter-spacing: 1px;
    -moz-transition: all 0.2s;
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
	text-decoration:none;
}
.button-three1 {
	display: inline-block;
	position:relative;
		padding-top:11px;
	padding-bottom:4px;
	width:60px;
	height:auto;
    background:none;
	background:#f4b907;
	color:#f2f2f2;
    border-radius: 2px;
	font-size:9px;
	font-weight:bold;
    text-transform: uppercase;
    letter-spacing: 1px;
    -moz-transition: all 0.2s;
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
	text-decoration:none;
}

.button-four {
	display: inline-block;
	position:relative;padding-left:5px;
		padding-top:11px;
	padding-bottom:4px;
	width:60px;
    background:none;
    color: #15d9e5;
    border-radius: 3px;
	font-size:9px;
	font-weight:bold;
    text-transform: uppercase;
    letter-spacing: 1px;
    -moz-transition: all 0.2s;
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
	text-decoration:none;
}
.button-four1 {
	display: inline-block;
	position:relative;
	padding-top:11px;
	padding-bottom:4px;
	width:60px;
    background:none;
	background:#15d9e5;
	color:#0069b0;
    border-radius: 3px;
	font-size:9px;
	font-weight:bold;
    text-transform: uppercase;
    letter-spacing: 1px;
    -moz-transition: all 0.2s;
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
	text-decoration:none;
}

.button-five{
	display:inline-block;
	position:relative;
		padding-top:11px;
	padding-bottom:4px;
	width:60px;	
    background:none;
    color: #f2f2f2;
    border-radius: 2px;
	font-size:9px;
	font-weight:bold;
    text-transform: uppercase;
    letter-spacing: 1px;
    -moz-transition: all 0.2s;
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
	text-decoration:none;
}
.button-five1{
	display:inline-block;
	position:relative;
		padding-top:11px;
	padding-bottom:4px;
	width:60px;	
    background:none;
 background:#f2f2f2;
	color:#0069b0;
    border-radius: 2px;
	font-size:9px;
	font-weight:bold;
    text-transform: uppercase;
    letter-spacing: 1px;
    -moz-transition: all 0.2s;
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
	text-decoration:none;
}

.button-one:hover{
	border-radius:2px;
	border-right:0px;
	border-bottom: 1px solid #f2f2f2;
}
.button-two:hover{
    border-bottom: 1px solid #17be27;
}
.button-three:hover {
	border-radius: 2px;
	border-left:0px;
    border-bottom: 1px solid #f4b907;
}
.button-four:hover {
	border-radius: 2px;
	border-left:0px;
    border-bottom: 1px solid #15d9e5;
}
.button-five:hover {
	border-radius: 2px;
	border-left:0px;
    border-bottom: 1px solid #f2f2f2;
}
.button-one:focus{
	background:#f2f2f2;
	color:#0069b0;
	
}
.button-two:focus{
	background:#17be27;
	color:#f2f2f2;
}

.button-three:focus{
	background:#f4b907;
	color:#f2f2f2;
}

.button-four:focus{
	background:#15d9e5;
	color:#0069b0;
	
}
.button-five:focus{
 background:#f2f2f2;
	color:#0069b0;
	
}

.panbut1{
	display:block;
	margin-top:50px;
	margin-left:0%;
	margin-bottom:0;
	width:150px;
	height:30px;
	background:#004b7d;
	border-radius: 4px;
	text-align:center;
	
}
.button1-one{
	display:inline-block;
	position:relative;
	padding:5px;
	width:150px;	
    background:none;
    color: #f2f2f2;
    border-radius: 0;
	font-size:12px;
	font-weight:bold;
    text-transform: uppercase;
    letter-spacing: 1px;
    -moz-transition: all 0.2s;
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
	text-decoration:none;
}

.button1-one:hover{
	border-radius:4px;
	border-right:0px;
	border-bottom: 1px solid #06F;
}
.button1-one:focus{
	background:#f2f2f2;
	color:#0069b0;	
}

.button1-oneactive{
	display:inline-block;
	position:relative;
	padding:6px;
	width:150px;	
    background:none;
 background: #0C0;
	color: #FFF;
    border-radius: 4px;
	font-size:12px;
	font-weight:bold;
    text-transform: uppercase;
    letter-spacing: 1px;
    -moz-transition: all 0.2s;
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
	text-decoration:none;
}



.tbl-content{
  height:460px;
  overflow-x:auto;
  margin-top: 0px;
  background-color: rgba(42, 166, 242, 1);
  background: -webkit-linear-gradient(left, #2aa6f2, #0e84d3);
  background: linear-gradient(to right, #2aa6f2, #0e84d3);
  /*border: 1px solid rgba(42, 166, 242, 1);*/
}

.t1td-first{
  padding: 10px 0 27px 10px;
  text-align: left;
  vertical-align:middle;
  font-weight: 700;
  font-size: 12px;
  letter-spacing:1px;
  color: #fff;
  border-bottom: solid 1px rgba(42, 166, 242, 1);
}
.t1td{
  padding: 27px 0 27px 10px;
  text-align: left;
  vertical-align:middle;
  font-weight: 700;
  font-size: 12px;
  letter-spacing:1px;
  color: #fff;
  border-bottom: solid 1px rgba(42, 166, 242, 1);
}
.t1tds{
  text-align: center;
  vertical-align:middle;
  font-weight: 600;
  font-size: 11px;
  color: #fff;
  border-bottom: solid 1px rgba(42, 166, 242, 1);
}

.t1tds .diamond{
	display:inline-block;
	padding:5px;
	width:65px;
	text-align:center;
	border-radius:4px;
	background:#17be27;
	color:#f2f2f2;
}
.t1tds .silver{
	display:inline-block;
	padding:5px;
	width:65px;
	text-align:center;
	border-radius:4px;
	padding:5px;
	background:#f2f2f2;
	color:#0069b0;
}
.t1tds .gold{
	display:inline-block;
	padding:5px;
	width:65px;
	text-align:center;
	border-radius:4px;
	padding:5px;
	background:#f4b907;
	color:#f2f2f2;
}
.t1tds .regular{
	display:inline-block;
	padding:5px;
	width:65px;
	text-align:center;
	border-radius:4px;
	padding:5px;
	background:#15d9e5;
	color:#f2f2f2;
}
.t1td2{
  text-align: left;
  vertical-align:middle;
  font-weight: 300;
  font-size: 12px;
  color: #fff;
  border-bottom: solid 1px rgba(42, 166, 242, 1);
}






/* for tag show and hide */

.displayText {
	display:inline-block;
	margin-left:5px;
	margin-bottom:0;
	font-size:10px;
	width:40px;
	padding:5px;
	background:#004b7d;
	border-radius: 2px;
	text-align:center;
	text-decoration:none;
	color:#f4b907;  
}
.displayText:focus{
	color:#f4b907;
}

 
input {
  width: calc(100% - 10px);
  min-height: 5px;
  padding-left: 5px;
  padding-right: 5px;
  letter-spacing: .5px;
  border: 0;
  font-size:10px;
  background:none;
  border-bottom: 1px dashed #dbdbdb; }
  input:focus {
    outline: none;
    border-color: #fbcf34; }
	input:placeholder {
		font-size:9px;
		color:#ebeced;
	}
	
.selectreg {
	width:90%;
	padding-top:17px;
	padding-right:2px;
	margin-top:5px;
	margin-right:5px;
	border:none;
    border-bottom:1px dashed #dbdbdb;
    background:none;
}


.selectreg option{
  	background: none;
	border: none;
	color: #0971b8;
	-webkit-appearance: none;
	-webkit-appearance: button;
	-webkit-appearance: checkbox;
	-webkit-appearance: scrollbarbutton-up;
}

selectreg:valid {
    border-bottom: 2px solid #24cf5f; }
selectreg:focus {
    outline: none;
    border-color: #fbcf34; }
/*span{
	font-size:12px;
	color:#0971b8;
}*/
	

	  
.searchbut {
	display:block;
	margin-top:30px;
  color: #ffffff;
  background-color: #0971b8;
  padding: 12px 25px;
  font-size: 12px;
  letter-spacing: 1px;
  text-transform: uppercase;
  border: 0;
  border-radius: 2px;
  outline: 0;
  box-shadow: 3px 3px 20px rgba(0, 0, 0, 0.2);
  -webkit-transition: all .2s;
  transition: all .2s; }
.searchbut:hover, .searchbut:active, .searchbut:focus {
    -webkit-transform: scale(1.1);
            transform: scale(1.1); }
			
			
			.searchbutactive {
	display:block;
	margin-top:30px;
  color: #ffffff;
  background-color: #F90;
  padding: 12px 25px;
  font-size: 12px;
  letter-spacing: 1px;
  text-transform: uppercase;
  border: 0;
  border-radius: 2px;
  outline: 0;
  box-shadow: 3px 3px 20px rgba(0, 0, 0, 0.2);
  -webkit-transition: all .2s;
  transition: all .2s; }
			
/* for radio button */

.mf-has-error .mf-radio-hint,
.mf-has-error .mf-radio-button {
  color: #d9534f;
}

.mf-is-success .mf-radio-hint {
  color: #259337;
}

.mf-radio-block,
.mf-radio-inline {
  position: relative;
  margin-top: 1.5rem;
  margin-bottom: 1.5rem;
  text-align: left;
}

.mf-radio-inline .mf-radio {
  display: inline-block;
  margin-right: 5px;
  padding-left:15px;
}

.mf-radio-legend {
  margin: 0 0 0.125rem 0;
  font-weight: 600;
  padding-left:15px;
  font-size: 11px;
  text-transform:uppercase;
  color: #939393;
}

.mf-radio-hint {
  margin: 0.125rem 0;
  font-weight: 400;
  font-size: 0.8rem;
  color: #b3b3b3;
  -webkit-transition: color 0.28s ease;
  transition: color 0.28s ease;
}

.mf-radio {
  margin-bottom: 0.125rem;
}
.mf-radio label {
  position: relative;
  cursor: pointer;
  padding-left: 1.5rem;
  text-align: left;
  color: #939393;
  display: block;
}
.mf-radio label:hover .mf-radio-button {
  color: #337ab7;
  font-size:11px;
}
.mf-radio label span {
  display: block;
  padding-left:5px;
  font-size:12px;
  -webkit-transform: translateY(0);
          transform: translateY(0);
}
.mf-radio input {
  width: auto;
  opacity: 0.0001;
  position: absolute;
  left: 0;
  margin: 0;
  padding: 0;
}
.mf-radio input:checked ~ .mf-radio-button::after {
  -webkit-transform: scale(0.5);
          transform: scale(0.5);
}
.mf-radio input:checked ~ .mf-radio-button::before {
  color: #337ab7;
}

.mf-radio-button {
  position: absolute;
  top: 0;
  left: 0;
  cursor: pointer;
  display: block;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  color: #999;
}
.mf-radio-button::before, .mf-radio-button::after {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  margin: 0.25rem;
  width: 1.5rem;
  height: 1.5rem;
  -webkit-transition: -webkit-transform 0.28s ease;
  transition: -webkit-transform 0.28s ease;
  transition: transform 0.28s ease;
  transition: transform 0.28s ease, -webkit-transform 0.28s ease;
  border-radius: 50%;
  border: 0.125rem solid currentColor;
}
.mf-radio-button::after {
  -webkit-transform: scale(0);
          transform: scale(0);
  background-color: #337ab7;
  border-color: #337ab7;
}

/* radio button ends */
	


/* for right side column */

.rightcol{
	width:70%;
	height:100%;
	float:right;
	-webkit-box-shadow: 0px 3px 3px 0px rgba(195, 197, 199, 1);
    -moz-box-shadow:    0px 3px 3px 0px rgba(195, 197, 199, 1);
    box-shadow:         0px 3px 3px 0px rgba(195, 197, 199, 1);
}

.tbl2-header{
	height:136px;
	/*background-color:#2aa6f2;*/
  background-color: rgba(254, 205, 7, 1);
  background: -webkit-linear-gradient(left, #f5f2f2, #ffffff, #f5f2f2);
  background: linear-gradient(to right, #f5f2f2, #ffffff, #f5f2f2);
  
 }
.tbl2-header .title{
	font-family: 'Roboto', sans-serif;
	font-size:18px;
	font-weight:700;
	text-align:center;
	color:#28a6f2;
}

.tbl2-header .boxs{
	font-family: 'Roboto', sans-serif;
	width:50%;
	margin-top:10px;
	padding:5px;
	font-size:10px;
	border-radius:4px;
	border: 1px solid rgba(42, 166, 242, 1);
	text-align:center;
}
.tbl2-content{
  height:auto;
  overflow:hidden;
  margin-top: 0px;
  background-color: rgba(254, 205, 7, 1);
  background: -webkit-linear-gradient(left, #f5f2f2, #ffffff, #f5f2f2);
  background: linear-gradient(to right, #f5f2f2, #ffffff, #f5f2f2);
  /*border: 1px solid rgba(42, 166, 242, 1);*/
}

.tbl2-content th{
  padding: 20px 15px;
  font-weight: 500;
  font-size: 12px;
  color: #fff;
  text-transform: uppercase;
}

.t2td{
  padding: 26px 0 26px 10px;
  overflow:hidden;
  text-align: left;
  vertical-align:middle;
  font-weight: 300;  
  font-size: 14px;
  font-weight:700;
  color:#fff;
  border-bottom: solid 1px rgba(42, 166, 242, 1);
  background-color: rgba(0, 75, 125, 1);
  background: -webkit-linear-gradient(left, #004b7d, #05609c, #004b7d);
  background: linear-gradient(to right, #004b7d, #05609c, #004b7d);
}

.t2td-last{
  padding: 26px 0 33px 10px;
  overflow:hidden;
  text-align: left;
  vertical-align:middle;
  font-weight: 300;  
  font-size: 14px;
  font-weight:700;
  color:#fff;
  background-color: rgba(0, 75, 125, 1);
  background: -webkit-linear-gradient(left, #004b7d, #05609c, #004b7d);
  background: linear-gradient(to right, #004b7d, #05609c, #004b7d);
}
.t2tditem{
  overflow:hidden;
  text-align: center;
  vertical-align:middle;  
  font-size: 12px;
  color:#505253;
  background-color:none;
  border-top:1px solid rgba(42, 166, 242, 1);
  
}



.t2tditem .button {
  color: #ffffff;
  width:70px;
  background:#0a9d23;
  padding: 5px 5px;
  font-size: 12px;
  letter-spacing: 1px;
  text-transform:capitalize;
  color:#fff;
  border-radius: 4px;
  border:1px solid #0a9d23;
  outline: 0;
   }
 .t2tditem .button:hover, .button:active, .button:focus {
	  box-shadow: 3px 3px 20px rgba(0, 0, 0, 0.2);
    -webkit-transform: scale(1.1);
            transform: scale(1.1); }



/* demo styles */

/* for custom scrollbar for webkit browser*/

::-webkit-scrollbar {
    width: 10px;
	
	
} 
::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 10px rgba(0,0,0,0.3); 
} 
::-webkit-scrollbar-thumb {
	background:#fce29b;
	border-radius:10px;
    -webkit-box-shadow: inset 0 0 10px rgba(255, 192, 23, 1); 
}