@extends('layout.padrao')
@section('title', 'Tabex BL Preview')
@section('content')

<!-- Botao para dowload do pdf -->
<div class="row w-100 col-lg-12 col-sm-12 col-md-12">
    <div class="col" style="text-align: end; margin-bottom: 10px; margin-right: 4%;">
        <button class="btn-pdf" value="PDF print" id="btnPrint" onclick="CriaPDF()">
            Download <i class="far fa-file-pdf"></i>
        </button>
    </div>
</div>

<div class="row w-100 col-lg-12 col-sm-12 col-md-12" id="pdf">
    <style>
        table.table-bordered {
            border: 2px solid black;
            margin-top: 20px;
        }

        table.table-bordered>thead>tr {
            border: 2px solid black;
            background: #fff;
            color: black;
        }

        table.table-bordered>tbody>tr>td,
        .table-bordered>tbody>tr>th,
        .table.table-bordered>tbody>tr,
        .table-bordered>thead>tr>th,
        table-bordered>tbody>tr>th {
            border: 1px solid black !important;
        } 

        label, p, tr, .sealNumber, .descriptionOfPackages {
            font-size: 10px !important;
        }

        .lateral-superior-esquerda-redonda {
            border-radius: 15px 0px 0px 0px;
        }

        .lateral-superior-direita-redonda {
            border-radius: 0px 15px 0px 0px;
        }

        .lateral-inferior-esquerda-redonda {
            border-radius: 0px 0px 0px 15px;
        }

        .lateral-inferior-direita-redonda {
            border-radius: 0px 0px 15px 0px;
        }
    </style>

    <div class="row tamanhoPDF" style="width: 90%; margin-left: 5%">
        <!-- Logo -->
        <div class="col borderBackground lateral-superior-esquerda-redonda noBordersBottom">
            <div class="row">
                <div style="min-width: 130px">
                    <img src="{!! asset('/image/MSC300.png') !!}" alt="logo" style="padding:6px; width: 130px;">
                </div>
                <div class="col">
                    <h5>MEDITERRANEAN SHIPPING COMPANY S.A.</h5>
                    <p style="font-weight: bold">12-14, chemin Rieu, 1208 GENEVA, Switzerland</p>
                    <p style="margin-top: -10px; font-weight: bold">Website: www.msc.com</p>
                    <p style="text-align: end">SCAC Code: MEDU</p>
                </div>
            </div>
        </div>
        <div class="col-6 borderBackground lateral-superior-direita-redonda noBordersLeft noBordersBottom">
            <div class="row">
                <div class="col-6">
                    <h5 style="font-weight: bold">
                        BILL OF LADING No. <Br /><Br />
                        NON-NEGOTIABLE COPY <Br />
                    </h5>
                </div>
                <div class="col">
                    <h5 style="font-weight: bold">
                        <label name="billOfLandingNoLabel" style="font-size: 14px !important">TESTE</label>
                    </h5>
                    <h6 style="text-align: end">
                        <p>"Port-To-Port" or "Combined</p>
                        <p style="margin-top: -10px;">Transport"(see Clause 1)</p>
                    </h6>
                </div>
                <div class="w-100"></div>
                <div class="col-6 borderBackground noBordersLeft noBordersBottom" style="height: 60px">
                    <p>
                        NO.& SEQUENCE OF ORIGINAL B/L's
                    </p>
                    <div style="text-align: center">
                        <label class="fontNormal" name="noSequenceOriginalBlLabel">TESTE</label>
                    </div>
                </div>
                <div class="col borderBackground noBordersLeft noBordersBottom" style="border-right: none">
                    <p>
                        NO. OF RIDER PAGES
                    </p>
                    <div style="text-align: center">
                        <label class="fontNormal" name="noRiderPagesLabel">TESTE</label>
                    </div>
                </div>
            </div>
        </div>

        <div class="w-100"></div>
        <div class="col-6 borderBackground noBordersBottom" style="height: 130px">
            <p style="margin-top: 10px">SHIPPER</p>
            <div class="shipperLabel">
                <div class="marginForLabel">
                    <label class="miniTexts" name="shipperTitleLabel">TESTE</label>
                </div>
                <div class="marginForLabel">
                    <label class="miniTexts" for="shipperCnpjLabel">CNPJ:</label>
                    <label class="miniTexts" name="shipperCnpjLabel">TESTE</label>
                </div>

                <div class="marginForLabel">
                    <label class="miniTexts" name="shipperAddressLabel">TESTE</label>
                </div>
                <div class="marginForLabel">
                    <label class="miniTexts" for="shipperPhoneLabel">PHONE/FAX:</label>
                    <label class="miniTexts" name="shipperPhoneLabel">TESTE</label>
                </div>
                <div class="marginForLabel">
                    <label class="miniTexts" name="shipperMailLabel">TESTE</label>
                </div>
            </div>
        </div>
        <div class="col borderBackground noBordersLeft noBordersBottom">
            <p style="margin-top: 10px">CARRIER'S AGENTS ENDORSEMENTS: (Include Agent(s) at POD)</p>
            <b>
                <p class="miniTexts">SHIPPER'S LOAD, COUNT AND SEALED</p>
                <p class="miniTexts" style="margin-top: -10px;">FCLFCL</p>
            </b>
        </div>

        <div class="w-100"></div>
        <div class="col-6 borderBackground noBordersBottom" style="height: 130px">
            <p style="margin-top: 10px">CONSIGNEE: This B/L is not negotiable unless marked "To Order" or "To Order of
                ..." here</p>
            <div class="consigneeLabel">
                <div class="marginForLabel">
                    <label class="miniTexts" name="consigneeTitleLabel">TESTE</label>
                </div>
                <div class="marginForLabel">
                    <label class="miniTexts" name="consigneeLabel1">TESTE</label>
                </div>
                <div class="marginForLabel"><label class="miniTexts" name="consigneeLabel2">TESTE</label>
                </div>
                <div class="marginForLabel"><label class="miniTexts" name="consigneeLabel3">TESTE</label></div>
            </div>
        </div>
        <div class="col borderBackground fontNormal noBordersLeft noBordersBottom noBordersTop">
            <label class="miniTexts" for="lloydsImoNumberLabel" style="margin-top: 35px">Lloyds/IMO Number:</label>
            <label class="miniTexts" name="lloydsImoNumberLabel">TESTE</label>
            <b>
                <p class="miniTexts" style="margin-top: -5px;">
                    LINER TERMS BOTH ENDS - LILO / FREIGHT AS PER AGREEMENT
                </p>
            </b>
        </div>

        <div class="w-100"></div>
        <div class="col-6 borderBackground noBordersBottom" style="height: 164px">
            <p style="margin-top: 10px">
                NOTIFY PARTIES : (No responsibility shall attach to Carrier or to his Agent for
                failure to notify - see
                Clause 20)
            </p>
            <div class="notifyPartiesLabel">

                <div class="marginForLabel"><label class="miniTexts" name="notifyPartiesTitleLabel">TESTE</label></div>
                <div class="marginForLabel"><label class="miniTexts" name="notifyPartiesLabel1">TESTE</label></div>
                <div class="marginForLabel"><label class="miniTexts" name="notifyPartiesLabel2">TESTE</label></div>
                <div class="marginForLabel"><label class="miniTexts" name="notifyPartiesLabel3">TESTE</label></div>

            </div>
        </div>
        <div class="col borderBackground fontNormal noBordersLeft noBordersBottom noBordersTop">
            <div class="row">
                <div class="col-6">
                    <p>PORT OF DISCHARGE AGENT:</p>
                    <div class="marginForLabel">
                        <label class="miniTexts" name="portDischargeAgentLabel1">TESTE</label>
                    </div>
                    <div class="marginForLabel">
                        <label class="miniTexts" name="portDischargeAgentLabel2">TESTE</label>
                    </div>
                    <div class="marginForLabel">
                        <label class="miniTexts" name="portDischargeAgentLabel3">TESTE</label>
                    </div>
                    <div class="marginForLabel">
                        <label class="miniTexts" name="portDischargeAgentLabel4">TESTE</label>
                    </div>
                    <div class="marginForLabel">
                        <label class="miniTexts" for="portDischargeAgentLabel5">Phone :</label>
                        <label class="miniTexts" name="portDischargeAgentLabel5">TESTE</label>
                    </div>
                    <div class="marginForLabel">
                        <label class="miniTexts" for="portDischargeAgentLabel6">Fax :</label>
                        <label class="miniTexts" name="portDischargeAgentLabel6">TESTE</label>
                    </div>
                </div>
                <div class="col-6" style="text-align: center">
                    <div class="codigo" style="margin-top: 20px;"></div>
                </div>
            </div>

        </div>

        <div class="w-100"></div>
        <div class="col-4 borderBackground noBordersBottom" style="height: 74px">
            <p style="margin-top: 10px">
                VESSEL AND VOYAGE NO (see Clause 8 & 9)
            </p>
            <div class="vesselAndVoyageNoLabel">
                <label name="vesselAndVoyageNoLabel">TESTE</label><br />
            </div>
        </div>
        <div class="col-4 borderBackground noBordersLeft noBordersBottom">
            <p style="margin-top: 10px">
                PORT OF LOADING
            </p>
            <div class="portOfLoadingLabel">
                <label name="portOfLoadingLabel">TESTE</label><br />
            </div>
        </div>
        <div class="col-4 borderBackground noBordersLeft noBordersBottom">
            <p style="margin-top: 10px">
                PLACE OF RECEIPT: (Combined Transport ONLY - see Clause 1 & 5.2)
            </p>
            <div class="placeOfReceiptLabel">
                <label name="placeOfReceiptLabel">TESTE</label><br />
            </div>
        </div>

        <div class="w-100"></div>
        <div class="col-4 borderBackground lateral-inferior-esquerda-redonda" style="height: 77px">
            <div class="row">
                <div class="col-4">
                    <p style="margin-top: 10px">
                        BOOKING REF.
                    </p>
                    <div class="bookingRefLabel">
                        <label name="bookingRefLabel">TESTE</label><br />
                    </div>
                </div>
                <div class="col-4">
                    <p style="margin-top: 10px; text-align: center">
                        (or)
                    </p>
                </div>
                <div class="col-4">
                    <p style="margin-top: 10px">
                        SHIPPER'S REF.
                    </p>
                    <div class="shippersRefLabel">
                        <label name="shippersRefLabel">TESTE</label><br />
                    </div>
                </div>
            </div>
        </div>
        <div class="col-4 borderBackground noBordersLeft">
            <p style="margin-top: 10px">
                PORT OF DISCHARGE
            </p>
            <div class="portOfDischargeLabel">
                <label name="portOfDischargeLabel">TESTE</label><br />
            </div>
        </div>
        <div class="col-4 borderBackground lateral-inferior-direita-redonda noBordersLeft">
            <p style="margin-top: 10px">
                PLACE OF DELIVERY : (Combined Transport ONLY - see Clause 1 & 5.2)
            </p>
            <div class="placeOfDeliveryLabel">
                <label name="placeOfDeliveryLabel">TESTE</label><br />
            </div>
        </div>

        <div class="w-100"></div>
        <!-- Logo -->
        <div class="col" style="text-align:end; position:absolute; padding-right: 10%; margin-top: 890px; z-index:9;">
            <img src="{!! asset('/image/tabex_export_transp_marcadagua.png') !!}" alt="logo"
                style="padding:12px; width: 300px; opacity: 0.3;">
        </div>

        <div class="w-100"></div>
        <div class="col-12 borderBackground"
            style="margin-top: 12px; height: 40px; text-align: center; border-radius: 15px 15px 0px 0px;">
            <p style="margin-top: 12px; font-size: 13px">
                <b style="letter-spacing: 2px;">
                    PARTICULARS FURNISHED BY THE SHIPPER - NOT CHECKED BY CARRIER - CARRIER NOT RESPONSIBLE
                </b>
                <b>
                    (see Clause 14)
                </b>
            </p>
        </div>

        <div class="w-100"></div>
        <div class="col-12 borderBackground noBordersTop">
            <div class="row" style="text-align: center">
                <div class="col-sm-3 borderBackground noBordersTopLeftBottom">
                    <b>
                        <p style="margin-top:10px">Container Numbers, Seal</p>
                        <p style="margin-top:-5px">Numbers and Marks</p>
                    </b>
                </div>
                <div class="col-sm-5 borderBackground noBordersTopLeftBottom">
                    <b>
                        <p style="margin-top:10px">Description of Packages and Goods</p>
                    </b>
                    <p style="margin-top:-5px">Continued on attached Bill of Lading Rider pages(s), if applicable)</p>
                </div>
                <div class="col-sm-2 borderBackground noBordersTopLeftBottom">
                    <b>
                        <p style="margin-top:10px">Gross Cargo</p>
                        <p style="margin-top:-5px">Weight</p>
                    </b>
                </div>
                <div class="col-sm-2 borderBackground noBordersTopLeftBottom noBordersRight">
                    <b>
                        <p style="margin-top:15px">Measurement</p>
                    </b>
                </div>
            </div>
        </div>

        <div class="w-100"></div>
        <div class="col-12 borderBackground noBordersTop" style="border-radius: 0px 0px 15px 15px;">
            <div class="row">
                <div
                    class="col-sm-3 borderBackground noBordersTopLeftBottom heightParticularsFurnished lateral-inferior-esquerda-redonda">
                    <label class="fontNormal" name="containerNumberLabel" style="margin-top:10px">TESTE</label>
                </div>
                <div class="col-sm-5 borderBackground noBordersTopLeftBottom heightParticularsFurnished">
                    <b>
                        <p style="margin-top:10px">Please see attached RIDER for Container / Cargo Description(s).</p>
                    </b>
                    <label class="fontNormal" name="descriptionPackagesLabel1" style="margin-top:-5px">
                        2 x 40' HIGH CUBE
                    </label>

                    <div class="tableTotal" style="margin-left: 15%">
                        <table>
                            <tbody>
                                <tr>
                                    <th class="fontNormal" name="totalItems">Total Items :</th>
                                    <td name="totalItemsTd">TESTE</td>
                                </tr>
                                <tr>
                                    <th class="fontNormal" name="totalGross">Total Gross Weight :</th>
                                    <td name="totalGrossTd">TESTE</td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
                <div class="col-sm-2 borderBackground noBordersTopLeftBottom heightParticularsFurnished">
                    <label class="fontNormal" name="grossCargoWeightLabel" style="margin-top:10px">TESTE</label>
                </div>

                <div
                    class="col-sm-2 borderBackground noBordersTopLeftBottom noBordersRight heightParticularsFurnished lateral-inferior-direita-redonda">
                    <label class="fontNormal" name="measurementLabel" style="margin-top:10px">TESTE</label>
                </div>
            </div>
        </div>

        <div class="w-100"></div>
        <div class="col-12 borderBackground" style="margin-top: 5px; border-radius: 15px 15px 0px 0px;">
            <p style="margin-top: 10px">
                FREIGHT & CHARGES
                Cargo shall not be delivered unless Freight & Charges are paid (see Clause 16)
            </p>
            <div class="row">
                <div class="col-7 borderBackground noBordersLeft noBordersBottom">

                    <div class="freightTable" style="margin-top: 5px">
                        <table class="table table-bordered" style="height: 175px;">
                            <thead style="font-size: 10px">
                                <tr>
                                    <th scope="col" style="text-align: center">FREIGHT & CHARGES</th>
                                    <th scope="col" style="text-align: center">BASIS</th>
                                    <th scope="col-2" style="text-align: center">RATE</th>
                                    <th scope="col-3" style="text-align: center">PREPAID</th>
                                    <th scope="col" style="text-align: center">COLLECT</th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr>
                                    <th class="fontNormal" id="pg1FreightCharges" name="pg1FreightCharges" scope="row">TESTE</th>
                                    <td id="pg1Rate" name="pg1Rate">TESTE</td>
                                    <td id="pg1Unit" name="pg1Unit">TESTE</td>
                                    <td id="pg1Currency" name="pg1Currency">TESTE</td>
                                    <td id="pg1Prepaid" name="pg1Prepaid">TESTE</td>
                                </tr>
                                <tr>
                                    <th class="fontNormal" id="pg1FreightCharges" name="pg1FreightCharges" scope="row">TESTE</th>
                                    <td id="pg1Rate" name="pg1Rate">TESTE</td>
                                    <td id="pg1Unit" name="pg1Unit">TESTE</td>
                                    <td id="pg1Currency" name="pg1Currency">TESTE</td>
                                    <td id="pg1Prepaid" name="pg1Prepaid">TESTE</td>
                                </tr>
                                <tr>
                                    <th class="fontNormal" id="pg1FreightCharges" name="pg1FreightCharges" scope="row">TESTE</th>
                                    <td id="pg1Rate" colspan="2" name="pg1Rate">TESTE</td>
                                    <td id="pg1Currency" name="pg1Currency">TESTE</td>
                                    <td id="pg1Prepaid" name="pg1Prepaid">TESTE</td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
                <div class="col">
                    <p style="font-size: 8px !important">
                        RECEIVED by the Carrier in apparent good order and condition (unless otherwise
                        stated herein) the total number or quantity of Containers or other packages or units
                        indicated in the box entitled Carrier s Receipt for carriage subject to all the terms
                        and conditions hereof from the Place of Receipt or Port of Loading to the Port of
                        Discharge or Place of Delivery, whichever is applicable. IN ACCEPTING THIS BILL
                        OF LADING THE MERCHANT EXPRESSLY ACCEPTS AND AGREES TO ALL
                        THE TERMS AND CONDITIONS, WHETHER PRINTED, STAMPED OR
                        OTHERWISE INCORPORATED ON THIS SIDE AND ON THE REVERSE SIDE OF
                        THIS BILL OF LADING AND THE TERMS AND CONDITIONS OF THE
                        CARRIER S APPLICABLE TARIFF AS IF THEY WERE ALL SIGNED BY THE
                        MERCHANT.
                    </p>
                    <p style="font-size: 8px !important">
                        If this is a negotiable (To Order / of) Bill of Lading, one original Bill of Lading, duly
                        endorsed must be surrendered by the Merchant to the Carrier (together with
                        outstanding Freight and charges) in exchange for the Goods or a Delivery Order. If
                        this is a non-negotiable (straight) Bill of Lading, the Carrier shall deliver the Goods
                        or issue a Delivery Order (after payment of outstanding Freight and charges)
                        against the surrender of one original Bill of Lading or in accordance with the
                        national law at the Port of Discharge or Place of Delivery whichever is applicable.
                    </p>
                    <p style="font-size: 8px !important">
                        IN WITNESS WHEREOF the Carrier or their Agent has signed the number of Bills
                        of Lading stated at the top, all of this tenor and date, and wherever one original Bill
                        of Lading has been surrendered all other Bills of Lading shall be void.
                    </p>

                </div>
            </div>
        </div>

        <div class="w-100"></div>
        <div class="col-12">
            <div class="row">
                <div class="col-3 borderBackground noBordersTop noBordersRight">
                    <p style="margin-top: 10px; margin-bottom: -3px"><b>DECLARED VALUE</b> 
                    (Only applicable if Ad Valorem
                    </p>
                    <p style="margin-bottom: -1px">charges paid - see
                        Clause 7.3)</p>
                    <label name="declaredValueLabel">TESTE</label>
                </div>
                <div class="col-4 borderBackground noBordersTop">
                    <p style="margin-top: 10px; margin-bottom: -2px"><b>CARRIER'S RECEIPT</b>
                        (No. of Cntrs or Pkgs rcvd by Carrier - see Clause 14.1)</p>
                    <label name="declaredValueLabel">TESTE</label>
                </div>
                <div class="col borderBackground noBordersTop noBordersLeft noBordersBottom">
                    <p style="margin-top: 10px; margin-bottom: -3px"><b>SIGNED</b> on behalf of the Carrier MSC
                        Mediterranean Shipping
                        Company S.A.</p>
                    <p>by MSC - Mediterranean Shipping do Brasil Ltda. As Agent</p>
                </div>
            </div>
        </div>
        <div class="w-100"></div>
        <div class="col-12">
            <div class="row">
                <div class="col-3 borderBackground noBordersTop noBordersRight lateral-inferior-esquerda-redonda">
                    <p style="margin-top: 10px; margin-bottom: -2px"><b>PLACE AND DATE OF ISSUE</b></p>
                    <label name="placeLabel" style="margin-bottom: -1px">TESTE</label><br />
                    <label class="dateLabelSize" name="dateLabel">TESTE</label>
                    <p style="text-align:end; margin-top: -10px">Standard Edition - 02/2015</p>
                </div>
                <div class="col-4 borderBackground noBordersTop">
                    <p style="margin-top: 10px; margin-bottom: -1px"><b>SHIPPED ON BOARD DATE</b></p>
                    <label class="dateLabelSize" name="boardDateLabel">TESTE</label>
                    <p style="text-align:center;">TERMS CONTINUED ON REVERSE</p>
                </div>
                <div class="col borderBackground noBordersTop noBordersLeft lateral-inferior-direita-redonda"
                    style="text-align: center">
                    <div class="assinatura"></div>
                </div>
            </div>
        </div>

        <!-- Pagina 2 -->
        <div class="col borderBackground" style="margin-top: 50px; border-radius: 15px 0px 0px 15px;">
            <div class="row">
                <div style="min-width: 130px">
                    <img src="{!! asset('/image/MSC300.png') !!}" alt="logo" style="padding:6px; width: 130px;">
                </div>
                <div class="col">
                    <h5>MEDITERRANEAN SHIPPING COMPANY S.A.</h5>
                    <p style="font-weight: bold">12-14, chemin Rieu, 1208 GENEVA, Switzerland</p>
                    <p style="margin-top: -10px; font-weight: bold">Website: www.msc.com</p>
                    <p style="text-align: end">SCAC Code: MEDU</p>
                </div>
            </div>
        </div>
        <div class="col-6 borderBackground noBordersLeft" style="margin-top: 50px; border-radius: 0px 15px 15px 0px;">
            <div class="row">
                <div class="col-6">
                    <h5 style="font-weight: bold">
                        BILL OF LADING No. <Br /><Br />
                        RIDER PAGE <Br /><Br />
                        Page 1 of 1
                    </h5>
                </div>
                <div class="col">
                    <h5 style="font-weight: bold">
                        <label name="billOfLandingNoLabel" style="font-size: 14px !important">TESTE</label>
                    </h5>
                </div>
            </div>
        </div>

        <div class="w-100"></div>
        <div class="col-12 borderBackground noBordersTop"
            style="height: 40px; text-align: center; border-radius: 15px 15px 0px 0px;">
            <p style="margin-top: 12px; font-size: 13px">
                <b style="letter-spacing: 2px;">
                    CONTINUATION PARTICULARS FURNISHED BY THE SHIPPER - NOT CHECKED BY CARRIER - CARRIER NOT RESPONSIBLE
                </b>
                <b>(see Clause 14)</b>
            </p>
            <div style="text-align: center">
                <label class="fontNormal" name="noSequenceOriginalBlLabel">TESTE</label>
            </div>
        </div>
        <div class="w-100"></div>
        <div class="col-12 borderBackground noBordersTop">
            <div class="row" style="text-align: center">
                <div class="col-sm-3 borderBackground noBordersTopLeftBottom">
                    <b>
                        <p style="margin-top:10px">Container Numbers, Seal</p>
                        <p style="margin-top:-5px">Numbers and Marks</p>
                    </b>
                </div>
                <div class="col-sm-5 borderBackground noBordersTopLeftBottom">
                    <b>
                        <p style="margin-top:10px">Description of Packages and Goods</p>
                    </b>
                    <p style="margin-top:-5px">Continued on attached Bill of Lading Rider pages(s), if applicable)</p>
                </div>
                <div class="col-sm-2 borderBackground noBordersTopLeftBottom">
                    <b>
                        <p style="margin-top:10px">Gross Cargo</p>
                        <p style="margin-top:-5px">Weight</p>
                    </b>
                </div>
                <div class="col-sm-2 borderBackground noBordersTopLeftBottom noBordersRight">
                    <b>
                        <p style="margin-top:15px">Measurement</p>
                    </b>
                </div>
            </div>
        </div>

        <div class="w-100"></div>
        <!-- Logo -->
        <div class="col"
            style="text-align:center; position:absolute; padding-right: 10%; margin-top: 2000px; z-index:9;">
            <img src="{!! asset('/image/tabex_export_transp_marcadagua.png') !!}" alt="logo"
                style="padding:12px; width: 600px; opacity: 0.3;">
        </div>

        <div class="w-100"></div>
        <div class="col-12 borderBackground noBordersTop" name="" style="border-radius: 0px 0px 15px 15px;">
            <!-- dados da tabela: duplicar a row -->
            <div class="row" name="dadosTabela">
                <div class="col-sm-3 borderBackground noBordersTopLeftBottom heightParticularsFurnished lateral-inferior-esquerda-redonda"
                    style="height: 480px;">
                    <label name="containerNumberPg2Label" style="margin-top:10px">TESTE</label><br />
                    <label name="infoNumberPg2Label" style="margin-top:5px">TESTE</label>
                    <div class="sealNumber" style="margin-top:15px;">
                        <b> Seal Number: </b>
                    </div>
                    <label name="sealNumberPg2Label" style="margin-top:5px">TESTE</label>
                </div>

                <div class="col-sm-5 borderBackground noBordersTopLeftBottom" style="height: 480px;">
                    <div class="descriptionOfPackages" style="margin-top:10px">
                        <label name="numberOfBagsLabel">26</label>
                        <label for="hcContaining">Bag(s) of</label>
                        <label name="hcContaining">02 X 40 HC</label>
                        <label>CONTAINING:</label>
                    </div>
                    <div class="descriptionOfPackages">
                        <label for="pg2CommodityLabel">COMMODITY:</label>
                        <label name="pg2CommodityLabel">TESTE</label>
                    </div>
                    <div class="descriptionOfPackages">
                        <label for="pg2QtdLabel">QUANTITY:</label>
                        <label name="pg2QtdLabel">TESTE</label>
                    </div>
                    <div class="descriptionOfPackages">
                        <label for="pg2QtdLabel">QUANTITY:</label>
                        <label name="pg2QtdLabel">TESTE</label>
                    </div>
                    <div class="descriptionOfPackages">
                        <label for="pg2netWeightLabel">NET WEIGHT:</label>
                        <label name="pg2netWeightLabel">TESTE</label>
                    </div>
                    <div class="descriptionOfPackages">
                        <label for="pg2TotalOctabinLabel">TOTAL 52 OCTABINS:</label>
                        <label name="pg2TotalOctabinLabel">TESTE</label>
                    </div>
                    <div class="descriptionOfPackages">
                        <label for="pg2TotalGrossWeightLabel">TOTAL GROSS WEIGHT:</label>
                        <label name="pg2TotalGrossWeightLabel">TESTE</label>
                    </div>
                    <div class="descriptionOfPackages">
                        <label for="pg2OriginLabel">ORIGIN:</label>
                        <label name="pg2OriginLabel">TESTE</label>
                    </div>
                    <div class="descriptionOfPackages">
                        <label for="pg2PackingLabel">PACKING:</label>
                        <label name="pg2PackingLabel">TESTE</label>
                    </div>
                    <div class="descriptionOfPackages">
                        <label for="pg2WoodenPackageLabel">WOODEN PACKAGE:</label>
                        <label name="pg2WoodenPackageLabel">TESTE</label>
                    </div>
                    <div class="descriptionOfPackages">
                        <label for="pg2DueLabel">DUE:</label>
                        <label name="pg2DueLabel">TESTE</label>
                    </div>
                    <div class="descriptionOfPackages">
                        <label for="pg2RucLabel">RUC:</label>
                        <label name="pg2RucLabel">TESTE</label>
                    </div>
                    <div class="descriptionOfPackages">
                        <label for="pg2NcmLabel">NCM:</label>
                        <label name="pg2NcmLabel">TESTE</label>
                    </div>
                    <div class="descriptionOfPackages">
                        <label for="pg2NcmLabel">NCM:</label>
                        <label name="pg2NcmLabel">TESTE</label>
                    </div>
                    <div class="descriptionOfPackages">
                        <label for="pg2HsCodeLabel">HS CODE:</label>
                        <label name="pg2HsCodeLabel">TESTE</label>
                    </div>
                    <div class="descriptionOfPackages">
                        <label name="pg2NameLabel">'FREIGHT PREPAID'</label>
                    </div>
                    <div class="descriptionOfPackages">
                        <label name="pg2FreeDaysLabel">14</label>
                        <b> FREE DAYS AT DESTINATION PORT CONTAINER DETENTION </b>
                    </div>
                    <div class="descriptionOfPackages">
                        <label for="pg2CtnrLabel">CTNR:</label>
                        <label name="pg2CtnrLabel">TESTE</label>
                        <label for="pg2TareLabel">TARE:</label>
                        <label name="pg2TareLabel">TESTE</label>
                    </div>
                    <div class="descriptionOfPackages">
                        <label for="pg2AddressLabel">*</label>
                        <label name="pg2AddressLabel">TESTE</label>
                        <label for="pg2TaxIdLabel">TAX ID:</label>
                        <label name="pg2TaxIdLabel">TESTE</label>
                    </div>
                    <div class="descriptionOfPackages">
                        <label for="pg2Address2Label">**</label>
                        <label name="pg2Address2Label">TESTE</label>
                        <label for="pg2TaxId2Label">TAX ID:</label>
                        <label name="pg2TaxId2Label">TESTE</label>
                    </div>
                    <div class="descriptionOfPackages">
                        <label name="pg2NumberLabel">TESTE</label>
                    </div>

                </div>
                <div class="col-sm-2 borderBackground noBordersTopLeftBottom heightParticularsFurnished"
                    style="text-align: center; height: 480px;">
                    <label class="fontNormal" name="grossCargoWeightPg2Label" style="margin-top:10px">TESTE</label>
                    <label class="fontNormal">kgs.</label>
                </div>
                <div class="col-sm-2 borderBackground noBordersTopLeftBottom noBordersRight heightParticularsFurnished lateral-inferior-direita-redonda"
                    style="text-align: center; height: 480px;">
                    <label class="fontNormal" name="measurementPg2Label" style="margin-top:10px">TESTE</label>
                    <label class="fontNormal">cu. m</label>
                </div>
            </div>

            <div class="row" name="dadosTabela">
                <div class="col-sm-3 borderBackground noBordersTopLeftBottom heightParticularsFurnished lateral-inferior-esquerda-redonda"
                    style="height: 200px;">
                    <label name="containerNumberPg2Label" style="margin-top:10px">TESTE</label><br />
                    <label name="infoNumberPg2Label" style="margin-top:5px">TESTE</label>
                    <div class="sealNumber" style="margin-top:15px;">
                        <b> Seal Number: </b>
                    </div>
                    <label name="sealNumberPg2Label" style="margin-top:5px">TESTE</label>
                </div>

                <div class="col-sm-5 borderBackground noBordersTopLeftBottom" style="height: 200px;">
                    <div class="descriptionOfPackages" style="margin-top:10px">
                        <label name="numberOfBagsLabel">26</label>
                        <label for="hcContaining">Bag(s) of</label>
                        <label for="pg2CommodityLabel">COMMODITY:</label>
                        <label name="pg2CommodityLabel">TESTE</label>
                    </div>
                    <div class="descriptionOfPackages">
                        <label for="pg2CtnrLabel">CTNR:</label>
                        <label name="pg2CtnrLabel">TESTE</label>
                        <label for="pg2TareLabel">TARE:</label>
                        <label name="pg2TareLabel">TESTE</label>
                    </div>
                    <div class="descriptionOfPackages">
                        <label name="pg2NumberLabel">TESTE</label>
                    </div>

                </div>
                <div class="col-sm-2 borderBackground noBordersTopLeftBottom heightParticularsFurnished"
                    style="text-align: center; height: 200px;">
                    <label class="fontNormal" name="grossCargoWeightPg2Label" style="margin-top:10px">TESTE</label>
                    <label class="fontNormal">kgs.</label>
                </div>
                <div class="col-sm-2 borderBackground noBordersTopLeftBottom noBordersRight heightParticularsFurnished lateral-inferior-direita-redonda"
                    style="text-align: center; height: 200px;">
                    <label class="fontNormal" name="measurementPg2Label" style="margin-top:10px">TESTE</label>
                    <label class="fontNormal">cu. m</label>
                </div>
            </div>

            <div class="row" name="totalRow">
                <div class="col-sm-3 borderBackground noBordersTopLeftBottom"></div>
                <div class="col-sm-5 borderBackground noBordersTopLeftBottom" style="text-align: end; margin-top: 2px">
                    Total:</div>
                <div class="col-sm-2 borderBackground noBordersLeft" style="text-align: center;">
                    <label name="totalGrossCargoLabel">TESTE</label>
                    <label>kgs.</label>
                </div>
                <div class="col-sm-2 borderBackground noBordersLeft noBordersRight" style="text-align: center;">
                    <label name="totalMeasurementLabel">TESTE</label>
                    <label>cu. m</label>
                </div>
            </div>

            <div class="row" name="endRow">
                <div class="col-sm-3 borderBackground noBordersTopLeftBottom lateral-inferior-esquerda-redonda"
                    style="height: 350px"></div>
                <div class="col-sm-5 borderBackground noBordersTopLeftBottom" style="height: 350px"></div>
                <div class="col-sm-2 borderBackground noBordersTopLeftBottom" style="height: 350px"></div>
                <div class="col-sm-2" style="height: 350px"></div>
            </div>
        </div>

        <div class="w-100"></div>
        <div class="col-12" style="margin-top: 5px">
            <div class="row">
                <div class="col-3 borderBackground noBordersRight"
                    style="border-radius: 15px 0px 0px 15px; height: 130px">
                    <p style="margin-top: 10px; margin-bottom: -1px">
                        <b>PLACE AND DATE OF ISSUE</b>
                    </p>
                    <label name="placeLabel">TESTE</label><br />
                    <label class="dateLabelSize" name="dateLabel">TESTE</label>
                </div>
                <div class="col-4 borderBackground" style="height: 130px">
                    <p style="margin-top: 10px; margin-bottom: 25px">
                        <b>SHIPPED ON BOARD DATE</b>
                    </p>
                    <div style="text-align: center">
                        <label class="dateLabelSize" name="boardDateLabel">TESTE</label>
                    </div>
                </div>
                <div class="col borderBackground noBordersLeft"
                    style="border-radius: 0px 15px 15px 0px; height: 130px;">
                    <p style="margin-top: 10px; margin-bottom: -3px"><b>SIGNED</b> on behalf of the Carrier MSC
                        Mediterranean Shipping
                        Company S.A.
                    </p>
                    <p>by MSC - Mediterranean Shipping do Brasil Ltda. As Agent</p>
                    <div class="assinatura" style="text-align: center"></div>
                </div>
            </div>
        </div>

        <div class="w-100"></div>
        <div class="col-12" style="margin-top: 5px">
            <div class="row">
                <div class="col-3">
                </div>
                <div class="col-4">
                    <p>Standard Edition - 02/2015</p>
                </div>
                <div class="col">
                </div>
            </div>
        </div>
    </div>
</div>

@include('blMsc.script')
@endSection