section {
    padding: 20px 0;
}
.modal-header{
  background: #796aee;
  color: #fff;
}
textarea.textarea-material {
  width:100%;
  border:none;
  border-bottom:1px solid #eee;
  padding:10px 0
 }
 textarea.textarea-material.is-invalid {
  border-color:#dc3545 !important
 }
 textarea.textarea-material:focus{border-color:#796AEE; outline: none;}
 textarea.textarea-material ~ label {
  color:#aaa;
  position:absolute;
  top:14px;
  left:0;
  cursor:text;
  -webkit-transition:all 0.2s;
  transition:all 0.2s;
  font-weight:300
 }
 textarea.textarea-material ~ label.active {
  font-size:1.0 rem; 
  top:-20px;
  color:#796AEE
}
textarea.textarea-material.is-invalid ~ label {
  color:#dc3545
}
textarea.textarea-material:focus{border-color:#796AEE}
input.input-material ~ label.active {
  font-size:1.0 rem !important; 
  top:-20px;
  color:#796AEE
 }

 @media screen and (max-width: 767px) {
  .modal-dialog{
    max-width:95% !important;
  }
}

@media 
only screen and (max-width: 760px),
(min-device-width: 768px) and (max-device-width: 1024px)  {

	.tablemobile, .theadmobile, .tbodymobile, .thmobile, .tdmobile, .trmobile { 
		display: block; 
	}
	
	.theadmobile .trmobile { 
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
	
	.trmobile { border: 1px solid #ccc; }
	
	.tdmobile { 
		border: none;
		border-bottom: 1px solid #eee; 
		position: relative;
    padding-left: 50%; 
    font-family: "Poppins",sans-serif;
    font-size: 14px;
    padding-left: 10;
    padding-bottom: 5px;
    padding-top: 5px;
    font-weight: bold;
	}
	
	.tdmobile:before { 
		position: absolute;
		top: 6px;
		left: 6px;
		width: 45%; 
		padding-right: 10px; 
    white-space: nowrap;
    font-weight: bold;
    
	}
  
  
	.tdmobile:nth-of-type(1):before { content: "Code";}
	.tdmobile:nth-of-type(2):before { content: "Nama Barang / Berat"; }
	.tdmobile:nth-of-type(3):before { content: "Price"; }
	.tdmobile:nth-of-type(4):before { content: "%"; }
	.tdmobile:nth-of-type(5):before { content: "Qty"; }
	.tdmobile:nth-of-type(6):before { content: "Total Price"; }
	.tdmobile:nth-of-type(7):before { content: "Action"; }
}