<template>
		<v-flex xs6 class="right">
            <v-layout row>
                <v-flex pl-2 pr-2 pt-0 pb-2 md12>
                    <v-card color="blue lighten-3">
                        <v-layout align-center row>
							<v-flex  text-md-left justify-start row fill-height pt-2 pb-2>
                           		<div class="flex display-1 font-weight-medium pt-1 pb-1 pl-2"><kbd>TOTAL</kbd></div>
							</v-flex>
							<v-flex  text-md-right justify-start row fill-height pt-2 pb-2>
                           		<div class="flex display-2 font-weight-medium pt-1 pb-1 pr-2"><kbd>1.200.000</kbd></div>
							</v-flex>
                        </v-layout>
                    </v-card>
                </v-flex>
            </v-layout>
            <v-layout row>
                <v-flex pl-2 pt-1 pr-2 xs12 sm12 md12>
                <v-card>
                    <table>
		<tr>
			<th class="text-md-center pt-2 pb-2"> # </th>
			<th class="text-md-center pt-2 pb-2">PEMERIKSAAN</th>
			<th class="text-md-center pt-2 pb-2">BRUTO</th>
			<th class="text-md-center pt-2 pb-2">DISKON</th>
			<th class="text-md-center pt-2 pb-2">TOTAL</th>
			
		</tr>
		<tr>
			<td class="text-md-center"> <v-icon color = "red" >delete</v-icon> </td>
			<td class="text-md-left pl-3">SGOT</td>
			<td class="text-md-right pr-2">50.000</td>
			<td class="text-md-right pr-2">5.000</td>
			<td class="text-md-right pr-2">45.000</td>
			
		</tr>
		<tr>
			<td class="text-md-center"> <v-icon color = "red" >delete</v-icon> </td>
			<td class="text-md-left pl-3">SGPT</td>
			<td class="text-md-right pr-2">50.000</td>
			<td class="text-md-right pr-2">5.000</td>
			<td class="text-md-right pr-2">45.000</td>
			
		</tr>



<tfoot>
	<tr>
		<th style="background:#03a9f43d" colspan="3" class="text-md-right pr-2 pt-2 pb-2">SUB TOTAL</th>
		<th style="background:#03a9f43d" class="text-md-right pr-2 pt-2 pb-2" colspan="2">100.000</th>

	</tr>

	<tr>
		<th colspan="3"  class="text-md-right pr-2 pt-1 pb-1">DISKON PEMBULATAN</th>
		<th class="text-md-right pr-2 pt-1 pb-1"  colspan="2">10.000</th>

	</tr>
</tfoot>



	</table>
    </v-card>
                </v-flex>
            </v-layout>
		</v-flex>

    
</template>
<style scoped>
.nota {
		font-size: 2em;
		font-weight: bold;
		text-align: left;
}
.total {
		font-size: 2em;
		font-weight: bold;
		text-align: right;
}
table {
  font-family: arial, sans-serif;
  border-collapse: collapse;
  width: 100%;
  background:white;
}

table, th, td {
  border: 1px solid black;
  border-collapse: collapse;
  padding-top: 2px;
  padding-bottom: 2px;
}
table>tr>td {
  padding: 8px;
}
table>tr>td:first {
  padding-left:15px!important;
}




.vintage-text{
	text-shadow: 0px -2px 0px #fff, 0px 2px 3px #fff;
}

</style>
<script>
module.exports = {
    data: () => ({
      mous: ['Foo', 'Bar', 'Fizz', 'Buzz'],
	  custom: false,
	  value: ''
    })
}
</script>
