.plusticproduct {float: left;font-size: 20px;width: 39%;}
textarea#contactPlan {width: 100% !important;}
textarea#contactRequest {width: 100% !important;}
/* ==========================================================================
  Desktop Layout: 1024px.
========================================================================== */
@media only screen and (min-width: 992px) and (max-width: 1199px) { 
.plusticproduct{float: left;
font-size: 20px;
width: 39%;}    
    
td {float: left;padding-left: 0;}    
td.tbprod {height: auto;padding-left: 10px;text-align: right;}  
tr.tbprod {display: none;height: auto;height: auto;}    
td.tbprod {height: auto;padding-left: 10px;}    
table { 
  width: 100%; 
  border-collapse: collapse; 
}
/* Zebra striping */
tr:nth-of-type(odd) {}
th { 
  background: #333; 
  color: white; 
  font-weight: bold; 
}
td, th { 
  padding: 6px; 
  border: 1px solid #ccc; 
  text-align: left; 
}/* Force table to not be like tables anymore */
	table, thead, tbody, th, td, tr { 
		display: block; 
	}
	
	/* Hide table headers (but not display: none;, for accessibility) */
	thead tr { 
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
	
	tr {margin-bottom: 10px;margin-top: 15px;}
	
	td { 
		/* Behave  like a "row" */
		border: none;
		border-bottom: 1px solid #eee; 
		position: relative;
		padding-left: 0%;
        float: left;
	}
	
	td:before { 
		/* Now like a table header */
		position: absolute;
		/* Top/left values mimic padding */
		top: 6px;
		left: 6px;
		width: 45%; 
		padding-right: 10px; 
		white-space: nowrap;
	}
	
	/*
	Label the data
	*/
    td.tbprod:nth-of-type(1) {text-align: left;}
	td:nth-of-type(1):before { content: "";text-align: left; }
	td:nth-of-type(2):before { content: "";text-align: left; }
	td:nth-of-type(3):before { content: "";text-align: left; }
	td:nth-of-type(4):before { content: "Panjang Luar  (mm)";text-align: left; }
	td:nth-of-type(5):before { content: "Lebar Luar (mm)";text-align: left; }
	td:nth-of-type(6):before { content: "Tinggi Luar (mm)";text-align: left; }
	td:nth-of-type(7):before { content: "Panjang Dalam (mm)"; text-align: left;}
	td:nth-of-type(8):before { content: "Lebar Dalam (mm)";text-align: left; }
	td:nth-of-type(9):before { content: "Tinggi Dalam (mm)";text-align: left; }
	td:nth-of-type(10):before { content: "Fitur";text-align: left; }
	td:nth-of-type(11):before { content: "Volume (L)";text-align: left; }
	td:nth-of-type(12):before { content: "Beban (kg)";text-align: left; }
  
    
}
   
    

/* ==========================================================================
  Tablet Layout: 768px.
========================================================================== */
@media only screen and (min-width: 768px) and (max-width: 991px) { 
   
.plusticproduct{float: left;
font-size: 20px;
width: 257px;}     
td {float: left;padding-left: 0;}  
tr.tbprod {display: none;height: auto;height: auto;}    
td.tbprod {height: auto;padding-left: 10px;text-align: right;}   
.tbprod {height: auto;}    
table { 
  width: 100%; 
  border-collapse: collapse; 
}
/* Zebra striping */
tr:nth-of-type(odd) {}
th { 
  background: #333; 
  color: white; 
  font-weight: bold; 
}
td, th { 
  padding: 6px; 
  border: 1px solid #ccc; 
  text-align: left; 
}/* Force table to not be like tables anymore */
	table, thead, tbody, th, td, tr { 
		display: block; 
	}
	
	/* Hide table headers (but not display: none;, for accessibility) */
	thead tr { 
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
	
	tr {margin-bottom: 10px;margin-top: 15px;}
	
	td { 
		/* Behave  like a "row" */
		border: none;
		border-bottom: 1px solid #eee; 
		position: relative;
		padding-left: 0%;
        float: left;
	}
	
	td:before { 
		/* Now like a table header */
		position: absolute;
		/* Top/left values mimic padding */
		top: 6px;
		left: 6px;
		width: 45%; 
		padding-right: 10px; 
		white-space: nowrap;
	}
	
	/*
	Label the data
	*/
    td.tbprod:nth-of-type(1) {text-align: left;}      
	td:nth-of-type(1):before { content: "";text-align: left; }
	td:nth-of-type(2):before { content: "";text-align: left; }
	td:nth-of-type(3):before { content: "";text-align: left;}
	td:nth-of-type(4):before { content: "Panjang Luar  (mm)";text-align: left; }
	td:nth-of-type(5):before { content: "Lebar Luar (mm)";text-align: left; }
	td:nth-of-type(6):before { content: "Tinggi Luar (mm)";text-align: left; }
	td:nth-of-type(7):before { content: "Panjang Dalam (mm)"; text-align: left;}
	td:nth-of-type(8):before { content: "Lebar Dalam (mm)";text-align: left; }
	td:nth-of-type(9):before { content: "Tinggi Dalam (mm)";text-align: left; }
	td:nth-of-type(10):before { content: "Fitur";text-align: left; }
	td:nth-of-type(11):before { content: "Volume (L)";text-align: left; }
	td:nth-of-type(12):before { content: "Beban (kg)";text-align: left; }
 
    
}  
    
    


/* ==========================================================================
  Wide Mobile Layout: 480px.
========================================================================== */
@media only screen and (min-width: 200px) and (max-width: 767px) {   
.plusticproduct{float: left;
font-size: 20px;
width: 257px;}     
td {float: left;padding-left: 0;}     
tr.tbprod {display: none;height: auto;height: auto;}    
.tbprod {border: 0px solid;}    
td.tbprod {border-bottom: 1px solid #ccc;
font-size: 15px;
height: auto;
padding-left: 10px;
text-align: right;}  
table { 
  width: 100%; 
  border-collapse: collapse; 
}
/* Zebra striping */
tr:nth-of-type(odd) {}
th { 
  background: #333; 
  color: white; 
  font-weight: bold; 
}
td, th { 
  padding: 6px; 
  border: 1px solid #ccc; 
  text-align: left; 
}/* Force table to not be like tables anymore */
	table, thead, tbody, th, td, tr { 
		display: block; 
	}
	
	/* Hide table headers (but not display: none;, for accessibility) */
	thead tr { 
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
	
	tr {margin-bottom: 10px;margin-top: 15px;padding-right: 10px;}
	
	td { 
		/* Behave  like a "row" */
		border: none;
		border-bottom: 1px solid #eee; 
		position: relative;
		padding-left: 0%;
        float: left; 
	}
	
	td:before { 
		/* Now like a table header */
		position: absolute;
		/* Top/left values mimic padding */
		top: 6px;
		left: 6px;
		width: 45%; 
		padding-right: 10px; 
		white-space: nowrap;
	}
	
	/*
	Label the data
	*/
    td.tbprod:nth-of-type(1) {text-align: left;}      
	td:nth-of-type(1):before { content: "";text-align: left; }
	td:nth-of-type(2):before { content: "";text-align: left; }
	td:nth-of-type(3):before { content: "";text-align: left;}
	td:nth-of-type(4):before { content: "Panjang Luar  (mm)";text-align: left; }
	td:nth-of-type(5):before { content: "Lebar Luar (mm)";text-align: left; }
	td:nth-of-type(6):before { content: "Tinggi Luar (mm)";text-align: left; }
	td:nth-of-type(7):before { content: "Panjang Dalam (mm)"; text-align: left;}
	td:nth-of-type(8):before { content: "Lebar Dalam (mm)";text-align: left; }
	td:nth-of-type(9):before { content: "Tinggi Dalam (mm)";text-align: left; }
	td:nth-of-type(10):before { content: "Fitur";text-align: left; }
	td:nth-of-type(11):before { content: "Volume (L)";text-align: left; }
	td:nth-of-type(12):before { content: "Beban (kg)";text-align: left; }

}   



/* ==========================================================================
  Mobile Layout: 320px.
========================================================================== */
@media only screen and (min-width: 200px) and (max-width: 479px) { 
.plusticproduct{float: left;
font-size: 20px;
width: 257px;} 
.plusticproduct textarea {width: 258px !important;} 
    

}

