*{
	margin:0;
	padding:0;
}

    .invoice-box{
        max-width:800px;
        margin:auto;
        padding:30px;
        border:1px solid #eee;
        box-shadow:0 0 10px rgba(0, 0, 0, .15);
        font-size:16px;
        line-height:24px;
        font-family:'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif;
        color:#555;
		    height: 100%;
    overflow: auto;
    }
    
    .invoice-box table{
        width:100%;
        line-height:inherit;
        text-align:left;
    }
    
    .invoice-box table td{
        padding:5px;
        vertical-align:top;
    }
    
    .invoice-box table tr td:nth-child(2){
        text-align:right;
    }
    
    .invoice-box table tr.top table td{
        padding-bottom:20px;
    }
    
    .invoice-box table tr.top table td.title{
        font-size:45px;
        line-height:45px;
        color:#333;
    }
    
/*    .invoice-box table tr.information table td{
        padding-bottom:40px;
    }*/
    
    .invoice-box table tr.heading td{
        background:#eee;
        border-bottom:1px solid #ddd;
        font-weight:bold;
    }
    
/*    .invoice-box table tr.details td{
        padding-bottom:20px;
    }*/
    
    .invoice-box table tr.item td{
        border-bottom:1px solid #eee;
    }
    
    .invoice-box table tr.item.last td{
        border-bottom:none;
    }
    
    .invoice-box table tr.total td:nth-child(2){
        border-top:2px solid #eee;
        font-weight:bold;
    }
	td.title>h1 {
    font-size: 22px;
    text-decoration: underline;
    margin: 0 auto;
	text-align:center
}
td.ref {
   width: 115px;
    float: left;
}

td.ref>h3 {
    font-weight: 500;
    float: left;
	font-size: 14px;
}
td.po {
    float: left;
    text-align: left;
}
td.po>h4 {
    font-size: 14px;
    font-weight: 400;
    text-align: left;
}
td.date1 {
    width: 45px;
    float: right;
    text-align: justify;
}
p.date {
    float: left;
    border-bottom: 1px dotted #dedede;
}
.company {
    width: 100%;
    float: left;

}
.company>h2 {
    width: auto;
    float: left;
    font-size: 14px;
	font-weight:normal;
        margin-left: 5px;
		color:#f00;
   
}
.company>h4 {
    float: left;
        margin-left: 5px;
	width: 100%;
	font-size:14px;
	font-weight:normal;
	    line-height: 18px;
}
.mobile {
    width: 100%;
    float: left;
  
}
span.kind {
    float: left;
    font-size: 14px;
    font-weight: 100;
    margin-left:5px;
	    margin-top: 15px;
}
span.kind>h5 {
    font-weight: 600;
    font-size: 14px;
}
span.name {
    float: left;
    width: auto;
	    margin-top: 15px;
}
span.name>h5 {
    font-size: 14px;
    font-weight: 500;
    padding: 0px 5px;
}
span.number {
    width: auto;
    float: left;
}
span.number>h5 {
    float: left;
    font-size: 14px;
    font-weight: 500;
}
span.number>p {
    font-size: 13px;
    margin-left: 3px;
    float: left;
}
h5.dear{
    float: left;
    margin-left: 5px;
    font-size: 14px;
    font-weight: 500;
}
h4.sub {
    font-size: 14px;
    margin-left: 3px;
    margin-top: -5px;
	font-weight:600;
}
p.txt {
    font-size: 14px;
    line-height: 16px;
    float: left;
    width: 100%;
    font-weight: 500;
margin-bottom:15px;
    margin-left: 5px;
}
table,tr,td{
	font-size:14px ;
}
    
    @media only screen and (max-width: 600px) {
        .invoice-box table tr.top table td{
            width:100%;
            display:block;
            text-align:center;
        }
        
        .invoice-box table tr.information table td{
            width:100%;
            display:block;
            text-align:center;
        }
    }