 
  input[type=text], select {
	size:34;
	padding: 5px;
	margin: 8px 0;
	border: solid 1px gray;
	border-radius: 5px;
  }

  input[type=button],input[type=reset] {
  	/*padding: 8px; */
	padding:  .375rem .75rem;
  }
  

 .btn{
 	font-weight: 400;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	user-select:none;
	border: 1px solid transparent;
	padding: .375rem .75rem;
	font-size: 1rem;
	line-height: 1.5;
	border-radius: .25rem;
	text-transform: none;
 }


 .bg-primary{ 	background-color: #007bff;	color: #fff; 	border-color: #007bff; }

.bg-primary:hover {  background-color: #035cbb; }

.bg-danger { background-color:red;  color: #fff; border-color:red; }
.bg-danger:hover {  background-color:#c40000; }

.bg-dark { background-color:#000; border-color:#000; color:#fff;}
.bg-body { background-color:#eef6ff; }
.bg-white { background-color:#fff;  }

.body-border { border:solid 2px #dee2e6; border-radius:20px; }

.text-primary{ color:#800080; }
.text-white{ color:#fff; }
.text-dark { color:#000; }
.text-muted { color: #6c757d !important; }

.container{ max-width: 1250px; margin: auto; }

.pt-1{ padding-top: .25rem;}
.pt-2{ padding-top: .5rem;}
.pt-3{ padding-top: .75rem;}
.pt-4{ padding-top: 1rem;}
.pt-5{ padding-top: 1.25rem;}

.pb-1{ padding-bottom: .25rem;}
.pb-2{ padding-bottom: .5rem;}
.pb-3{ padding-bottom: .75rem;}
.pb-4{ padding-bottom: 1rem;}
.pb-5{ padding-bottom: 1.25rem;}

.py-0 {  padding-top: 0;  padding-bottom: 0; }
.py-1 {  padding-top: .25rem;  padding-bottom: .25rem; }
.py-2 {  padding-top: .5rem;  padding-bottom: .5rem; }
.py-3 {  padding-top: .75rem;  padding-bottom: .75rem; }
.py-4 {  padding-top: 1rem;  padding-bottom: 1rem; }
.py-5 {  padding-top: 1.25rem;  padding-bottom: 1.25rem; }

.mt-0{ margin-top: 0;}
.mt-1{ margin-top: .25rem;}
.mt-2{ margin-top: .5rem;}
.mt-3{ margin-top: .75rem;}
.mt-4{ margin-top: 1rem;}
.mt-5{ margin-top: 1.25rem;}

.mb-0{ margin-bottom: 0;}
.mb-1{ margin-bottom: .25rem;}
.mb-2{ margin-bottom: .5rem;}
.mb-3{ margin-bottom: .75rem;}
.mb-4{ margin-bottom: 1rem;}
.mb-5{ margin-bottom: 1.25rem;}

.my-1 {  margin-top: .25rem;  margin-bottom: .25rem; }
.my-2 {  margin-top: .5rem;  margin-bottom: .5rem; }
.my-3 {  margin-top: .75rem;  margin-bottom: .75rem; }
.my-4 {  margin-top: 1rem;  margin-bottom: 1rem; }
.my-5 {  margin-top: 1.25rem;  margin-bottom: 1.25rem; }

.d-none { display:none; }
.border-top { border-top: 1px solid #dee2e6; }
.justify-content-center { -webkit-box-pack: center !important; -ms-flex-content: center !important; justify-content: center !important; }
.d-flex { display: flex !important; }
.flex-wrap { flex-wrap: wrap !important; }
.justify-content-between { -webkit-box-pack: justify !important; -ms-flex-pack: justify !important; justiy-content: space-between !important; } 
.align-items-center  { -webkit-box-align: center !important; -ms-flex-align:center !important; align-items: center !important; } 


.row { display:-ms-flexbox;display: flex; flex-wrap:wrap; margin-right: -15px; margin-left: -15px; } 
.col-12 { -webkit-box-flex:0; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width:100%; }
.col-6 { -webkit-box-flex:0; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width:50%; }

.bd-callout{   margin-top: 1.25rem; margin-bottom: 1.25rem; border: 1px solid rgb(238,238,238); border-left-width: .25rem; border-radius:.25rem;  }
.bd-callout-warning{ border-left-color: #f0ad4e; }

.text-center{ text-align:center;}
.text-left{ text-align:left;}
.text-right{ text-align:right;}
.text-justify{ text-align:justify;}
.text-decoration-none { text-decoration:none; } 
.underline { text-decoration:underline; } 



.ml-0{ margin-left: 0;}
.ml-1{ margin-left: .25rem;}
.ml-2{ margin-left: .5rem;}
.ml-3{ margin-left: .75rem;}
.ml-4{ margin-left: 1rem;}
.ml-5{ margin-left: 1.25rem;}

.mr-0{ margin-right: 0;}
.mr-1{ margin-right: .25rem;}
.mr-2{ margin-right: .5rem;}
.mr-3{ margin-right: .75rem;}
.mr-4{ margin-right: 1rem;}
.mr-5{ margin-right: 1.25rem;}


.mx-0{ margin-left: 0; margin-right: 0;}
.mx-1{ margin-left: .25rem; margin-right: .25rem;}
.mx-2{ margin-left: .5rem; margin-right: .5rem;}
.mx-3{ margin-left: .75rem; margin-right: .75rem;}
.mx-4{ margin-left: 1rem; margin-right: 1rem;}
.mx-5{ margin-left: 1.25rem; margin-right: 1.25rem;}

.pl-0{ padding-left: 0;}
.pl-1{ padding-left: .25rem;}
.pl-2{ padding-left: .5rem;}
.pl-3{ padding-left: .75rem;}
.pl-4{ padding-left: 1rem;}
.pl-5{ padding-left: 1.25rem;}

.pr-0{ padding-right: 0;}
.pr-1{ padding-right: .25rem;}
.pr-2{ padding-right: .5rem;}
.pr-3{ padding-right: .75rem;}
.pr-4{ padding-right: 1rem;}
.pr-5{ padding-right: 1.25rem;}


.px-0{ padding-left: 0; padding-right: 0;}
.px-1{ padding-left: .25rem; padding-right: .25rem;}
.px-2{ padding-left: .5rem; padding-right: .5rem;}
.px-3{ padding-left: .75rem; padding-right: .75rem;}
.px-4{ padding-left: 1rem; padding-right: 1rem;}
.px-5{ padding-left: 1.25rem; padding-right: 1.25rem;}




.main-table { padding-left:1rem; padding-right:1rem; } 


@media only screen and (max-width: 50em) {
  thead th:not(:first-child) {
    display: none;
  }
  table{
  	width: 100%;
  }
  td, th {
	width:100%;
    display: block;
    clear: both;
  }
  td[data-th]:before {
    content: attr(data-th);
    float: left;
  }
  
  #tabs-1,#tabs-2,#tabs-3,#tabs-4{
  padding:0;
  width:100%;
  }
  
  input[type=text],select,font,textarea,.ui-id-1,.ui-id-2,.ui-id-3,.ui-id-4 {
	width:98%;
  }
  
  img{
	display: block;
	margin-left: auto;
	margin-right: auto;
  }

  .col-6 { -webkit-box-flex:0; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width:100%; }
  .main-table { padding-left:0; padding-right:0; }  
}



