<!doctype html>
<html>
<head>

        <meta charset="utf-8"> <!-- utf-8 works for most cases -->
        <meta name="viewport" content="width=device-width"> <!-- Forcing initial-scale shouldn't be necessary -->
        <meta http-equiv="X-UA-Compatible" content="IE=edge"> <!-- Use the latest (edge) version of IE rendering engine -->
        <meta name="x-apple-disable-message-reformatting">  <!-- Disable auto-scale in iOS 10 Mail entirely -->
        <title></title> <!-- The title tag shows in email notifications, like Android 4.4. -->

        <link href="https://fonts.googleapis.com/css?family=Poppins:200,300,400,500,600,700" rel="stylesheet">
        <style>

                /* What it does: Remove spaces around the email design added by some email clients. */
                /* Beware: It can remove the padding / margin and add a background color to the compose a reply window. */
                html,
body {
        margin: 0 auto !important;
        padding: 0 !important;
        height: 100% !important;
        width: 100% !important;
        /*background: #f1f1f1;*/
        background: White
}

/* What it does: Stops email clients resizing small text. */
* {
        -ms-text-size-adjust: 100%;
        -webkit-text-size-adjust: 100%;
}

/* What it does: Centers email on Android 4.4 */
div[style*="margin: 16px 0"] {
        margin: 0 !important;
}

/* What it does: Stops Outlook from adding extra spacing to tables. */
table,
td {
        mso-table-lspace: 0pt !important;
        mso-table-rspace: 0pt !important;
}

/* What it does: Fixes webkit padding issue. */
table {
        border-spacing: 0 !important;
        border-collapse: collapse !important;
        table-layout: fixed !important;
        margin: 0 auto !important;
}

/* What it does: Uses a better rendering method when resizing images in IE. */
img {
        -ms-interpolation-mode:bicubic;
}

/* What it does: Prevents Windows 10 Mail from underlining links despite inline CSS. Styles for underlined links should be inline. */
a {
        text-decoration: none;
}

/* What it does: A work-around for email clients meddling in triggered links. */
*[x-apple-data-detectors],  /* iOS */
.unstyle-auto-detected-links *,
.aBn {
        border-bottom: 0 !important;
        cursor: default !important;
        color: inherit !important;
        text-decoration: none !important;
        font-size: inherit !important;
        font-family: inherit !important;
        font-weight: inherit !important;
        line-height: inherit !important;
}

/* What it does: Prevents Gmail from displaying a download button on large, non-linked images. */
.a6S {
        display: none !important;
        opacity: 0.01 !important;
}

/* What it does: Prevents Gmail from changing the text color in conversation threads. */
.im {
        color: inherit !important;
}

/* If the above doesn't work, add a .g-img class to any image in question. */
img.g-img + div {
        display: none !important;
}

/* What it does: Removes right gutter in Gmail iOS app: https://github.com/TedGoas/Cerberus/issues/89  */
/* Create one of these media queries for each additional viewport size you'd like to fix */

/* iPhone 4, 4S, 5, 5S, 5C, and 5SE */

@media only screen and (max-device-width:  480px){
        img.product-img{
                width: 29,75px;
                height: 29,75px;
                border-radius: 50%      
        }
        span.product-list-title{
                font-family: Roboto;
                font-style: normal;
                font-weight: 600;
                font-size: 10px;
                color: #000000;
        }
        span.product-list-name{
                font-family: Roboto;
                font-style: normal;
                font-weight: 600;
                font-size: 16px;
                line-height: 16px;
                color: #303133
        }
        span.product-list-details{
                font-family: Roboto;
                font-style: normal;
                font-weight: normal;
                font-size: 14px;
                line-height: 16px;
                color: #303133
        }
        div.header-box-white{
                width: 350.41px; 
                height: 63.74px; 
                border: 2px solid White; 
                text-align: center; 
                display: sticky; 
                align-items: center; 
                justify-content: center; 
                display: table;
        }
        body {
                margin: 0 auto !important;
                padding: 0 !important;
                height: 100% !important;
                width: 375px !important;
                background: White
        }
        div.email-container{
                max-width: 375px; 
                margin: 0 auto;
        }
        td.x-summary-table,
        td.y-summary-table{
                margin: auto !important;
                display: block;
                width: 80%;
        }       
        table.summary-table-child{
                display: block;
            width: 100%;
            height: auto;
            padding-left: 20%;
        }
        table.summary-table-child{
                background-color: #EDECED;
        }
        td.x-summary-table,
        td.y-summary-table{
                background-color: #EDECED;
        }
        th.product-list{
                white-space: nowrap;
        width: auto !important;
        }
        hr.summary-separator-responsive{
                display: block !important;
        }
        span.hello-text{
                font-size: 14px;
        }
        button.button-catalog{
                border : none;
                width: 45% !important;
                /*width : 150px;*/
                height: 57px !important;
                color: White
        }
        span.text-catalog-button{
        font-family: Roboto;
        font-style: normal;
        font-weight: normal;
        font-size: 16px;
        line-height: 22px;
        color: #FBFBFB;
        display: None;
        }
        span.text-catalog-button-mobile{
                font-family: Roboto;
                font-style: normal;
                font-weight: normal;
                font-size: 22px;
                line-height: 22px;
                color: #FBFBFB;
                display: block !important;
        }
}


        </style>

        <style>

                .primary{
        background: #17bebb;
}

.details-order-body{
        border-left: 3em solid transparent;
        border-right : 3em solid transparent;
}
.details-order-head{
        border-left: 3em solid transparent;
        border-right : 3em solid transparent;
}
.color-green-pod{
        color:#36A18B;
}
.bg-green-pod{
        background-color:#36A18B;
}
button.button-catalog{
        border : none;
        width: 30%;
        height: 45px;
        color: White
}
span.hello-text{
        color: #303133;
        font-family: Roboto;
        font-style: normal;
        font-weight: normal;
        font-size: 16px;
        line-height: 131.19%
}
span.text-thanks-order{
        font-family: Roboto;
        font-style: normal;
        font-weight: 500;
        font-size: 30px;
        line-height: 35px;
        text-transform: capitalize;
        color: #FBFBFB;
}
span.text-summary-title{
        font-family: Roboto;
        font-style: normal;
        font-weight: bold;
        font-size: 20px;
        line-height: 23px;
        color: #36A18B;
}
span.text-summary-bold{
        color: #000000;
        font-weight: 500;
        font: Roboto;
        font-size: 16px;
        line-height: 18.75px;
        font-style: normal;
        text-transform: capitalize;
}
span.text-summary-bold-no-capitalize{
        color: #000000;
        font-weight: 500;
        font: Roboto;
        font-size: 16px;
        line-height: 18.75px;
        font-style: normal;
}
span.text-summary{
        color: #000000;
        font-family: Roboto;
        font-style: normal;
        font-weight: normal;
        font-size: 16px;
        line-height: 19px;
        text-transform: capitalize;
}
span.text-final-prices{
        color: #000000;
        font-family: Roboto;
        font-style: normal;
        font-weight: normal;
        font-size: 16px;
        line-height: 19px;
}
span.text-farmer-contact{
        color: #000000;
        font-family: Roboto;
        font-style: normal;
        font-weight: normal;
        font-size: 16px;
        line-height: 19px;
}
span.text-farmer-contact-title{
        font-family: Roboto;
        font-style: normal;
        font-weight: bold;
        font-size: 16px;
        line-height: 22px;
        color: #36A18B;
}
span.text-business-name{
        font-family: Roboto;
        font-style: normal;
        font-weight: 500;
        font-size: 22px;
        line-height: 26px;
        text-transform: capitalize;
        color: #000000;
}
span.product-list-title{
        font-family: Roboto;
        font-style: normal;
        font-weight: 600;
        font-size: 16px;
        /*line-height: 73px;*/
        color: #000000;
}
span.product-list-name{
        font-family: Roboto;
        font-style: normal;
        font-weight: 600;
        font-size: 16px;
        line-height: 73px;
        color: #000000;
}
span.product-list-details{
        font-family: Roboto;
        font-style: normal;
        font-weight: 400;
        font-size: 14px;
        line-height: 16px;
        color: #303133;
}
span.summary-text-green{
        font-family: Roboto;
        font-style: normal;
        font-weight: 500;
        font-size: 16px;
        line-height: 19px;
        text-transform: capitalize;
        color: #36A18B;
}
span.text-catalog-button{
        font-family: Roboto;
        font-style: normal;
        font-weight: normal;
        font-size: 16px;
        line-height: 22px;
        color: #FBFBFB;
}
span.text-catalog-button-mobile{
        font-family: Roboto;
        font-style: normal;
        font-weight: normal;
        font-size: 22px;
        line-height: 22px;
        color: #FBFBFB;
        display: None;
}

body{
        font-family: 'Roboto';
        font-weight: 400;
        font-size: 15px;
        line-height: 1.8;
        color: rgba(0,0,0,.4);
}
img.bussines-img{
        width: 100px;
        height: 100px;
        border-radius: 50%;
}
img.product-img{
        width: 70px;
        height: 70px;
        border-radius: 50% 
}
div.header-box-white{
        width: 615.18px; 
        height: 63.74px; 
        border: 2px solid White; 
        text-align: center; 
        display: sticky; 
        align-items: center; 
        justify-content: center; 
        display: table;
}
div.email-container{
        max-width: 700px; 
        margin: 0 auto;
}
table.summary-table{
        border: collapse;
        margin-left: auto;
        margin-right: auto;

}
table.summary-table-child{
        background-color: #EDECED;
}
td.x-summary-table,
td.y-summary-table{
        background-color: #EDECED;
}
hr.summary-separator-responsive{
        display: none;
}
.circle{
        border-radius: 50%;
        width: 20px;
        height: 20px;
        /*padding:5px;*/
        display: inline-block;
        background: #36A18B;
        color: White;
        text-align: center;
        justify-content: center;
        align-items: center;
        font: Roboto;
}

        </style>


</head>
<body 
width="100%" 
style="margin: 0; padding: 0 !important; mso-line-height-rule: exactly; background-color: #FFFFFF;">
        <center>
                <div class="email-container">
                        <table 
                        align="center" 
                        role="presentation" 
                        cellspacing="0" cellpadding="0" border="0" width="700px" 
                        style="margin: auto;"
                        class='main-table'>
                                <tr>
                                        <td valign="top" class="bg_white" style="padding: 1em 2.5em 0 2.5em;">
                                                <table role="presentation" border="0" cellpadding="0" cellspacing="0" width="100%">
                                                        <tr>
                                                                <td class="logo" style="text-align: center;">
                                                                        
                                                                                <img class="bussines-img"
                                                                                src="https://image-service-prod-uploads-resized.s3.eu-west-1.amazonaws.com/Rx5nIrX0cgXwpXwDaqbgj1BHE6f2/profile/pics/IMG-0007.JPG">
                                                                        
                                                                </td>
                                                        </tr>
                                                </table>
                                        </td>
                                </tr>
                                <tr>
                                        <td style="padding-top: 10px;">
                                                 
                                        </td>
                                </tr>
                                <tr style="height: 101px; background: #36A18B; color : White;">
                                        <td style="padding-left: 42.41px ;height : 63.74px; width: 615.18px; text-align: center;" valign="center">
                                                <div class = 'header-box-white'>
                                                        <span class="text-thanks-order"
                                                        style="display: table-cell; vertical-align: middle;">
                                                                CATÁLOGO
                                                        </span>
                                                </div>
                                        </td>
                                </tr>
                                <tr>
                                        <td style="text-align: left;justify-content: left; padding-left: 24px; padding-right: 24.48px; padding-top: 40.57px; padding-bottom: 20px">
                                                <span class="hello-text">
                                                        ¡Hola BAH ESTRECHO!
                                                        <br>
                                                        Ya tenemos preparado tu catálogo.
                                                        

                                                                La validez para realizar el pedido es de
                                                                <br>
                                                                 13/09/2021 a 21/09/2021.
                                                                 
                                                        
                                                         <br><br>
                                                         <!-- "Haz tu pedido online" check in mobile phone -->
                                                         Para empezar a hacer tu pedido haz click en el botón "Haz tu pedido online" que encontrarás más abajo. Una vez dentro del catálogo selecciona los productos que quieras pedir, elige el método de pago y método de entrega que te resulten más convenientes y confirma tu pedido. Al finalizar tu compra recibirás un mail de confirmación. En cuanto podamos, confirmaremos la disponibilidad de los productos y recibirás una última notificación confirmando el estado de tu pedido, así como si ha sufrido alguna modificación.
                                                         <br><br>
                                                         Si tienes algún problema, no dudes en contactar con nosotros respondiendo a este email indicando como te podemos ayudar. Muchas gracias por tu confianza.
                                                         <br>
                                                         Atentamente,
                                                         <br>
                                                         El equipo de Terra i Xufa.
                                                         <br>
                                                        Gracias por confiar en nosotros.
                                                </span>
                                        </td>
                                </tr>
                                <table border="0" cellpadding="10" cellspacing="0" width="100%">
                                        <tbody>
                                                <tr>
                                                        <td 
                                                        style="text-align: center; padding-top: 40px; padding-bottom: 25px">
                                                                <a href="https://tienda-terraixufa.pod.coop/977/">
                                                                        <button style="border-radius : 5px;" 
                                                                        class="bg-green-pod button-catalog">
                                                                                <span class="text-catalog-button">
                                                                                        Haz tu pedido online
                                                                                </span>
                                                                                <span class="text-catalog-button-mobile">
                                                                                        ¡haz tu pedido!
                                                                                </span>
                                                                        </button>
                                                                </a>
                                                        </td>
                                                </tr>
                                                <hr width="100%" style="border-top: 1px solid #bbb;">
                                                <tr>
                                                        <td  style="text-align: center;">
                                                                <span style="font-size: 20px; font-weight: bold; font-family: Roboto;">
                                                                        También puedes realizar tu pedido en Excel
                                                                </span>
                                                        </td>
                                                </tr>
                                        </tbody>
                                </table>
                                <table border="0" cellpadding="10" cellspacing="0" width="100%">
                                        <tbody>
                                                <tr>
                                                        <td style="text-align : right;">
                                                                <span class="circle">
                                                                        1
                                                                </span>
                                                        </td>
                                                        <td colspan="2" style="text-align : left;">
                                                                <span class="hello-text">
                                                                        Descarga el excel adjunto en este documento.
                                                                </span>
                                                        </td>
                                                </tr>
                                                <tr>
                                                        <td style="text-align : right;">
                                                                <span class="circle">
                                                                        2
                                                                </span>
                                                        </td>
                                                        <td colspan="2" style="text-align : left;">
                                                                <span class="hello-text">
                                                                        Rellénalo con el pedido que quieres realizar.
                                                                </span>
                                                        </td>
                                                </tr>
                                                <tr>
                                                        <td style="text-align : right;">
                                                                <span class="circle">
                                                                        3
                                                                </span>
                                                        </td>
                                                        <td colspan="2" style="text-align : left;">
                                                                <span class="hello-text">
                                                                        Adjúntalo en este mismo correo y envíanoslo.
                                                                </span>
                                                        </td>
                                                </tr>
                                                <tr>
                                                        <td style="text-align : right;">
                                                                <span class="circle">
                                                                        4
                                                                </span>
                                                        </td>
                                                        <td colspan="2" style="text-align : left;">
                                                                <span class="hello-text">
                                                                        ¡Pedido procesado!
                                                                </span>
                                                        </td>
                                                </tr>
                                        </tbody>
                                </table>
                                <br>
                                <hr width="100%" style="border-top: 1px solid #bbb;">
                                <table role="presentation" border="0" cellpadding="10" cellspacing="0" width="90%">
                                        <tbody>
                                                
                                                <tr>
                                                        <td >
                                                                <span style="font-family: Roboto;">
                                                                        ¿No quieres recibir más correos como este? Envíanos un mail a pedidos@terraixufa.com y te daremos de baja.
                                                                </span>
                                                        </td>
                                                </tr>
                                        </tbody>
                                </table>
                                <table role="presentation" border="0" cellpadding="20" cellspacing="0" width="90%">
                                        <tbody>
                                                <tr>
                                                        <td>
                                                                 
                                                        </td>
                                                        <td>
                                                                <a href="https://pod.coop" style="padding-right: 7px">
                                                                        <img src="https://pod-public.s3.eu-west-1.amazonaws.com/assets/icons/email_templates/webLogo.png">
                                                                </a>
                                                                <a href="https://www.instagram.com/plantondemand_es/?hl=es" style="padding-right: 7px">
                                                                        <img src="https://pod-public.s3-eu-west-1.amazonaws.com/assets/icons/email_templates/instagram.png">
                                                                </a>
                                                                <a href="https://www.facebook.com/plantondemand" style="padding-right: 7px">
                                                                        <img src="https://pod-public.s3-eu-west-1.amazonaws.com/assets/icons/email_templates/facebook.png">
                                                                </a>
                                                                <a href="https://www.linkedin.com/company/plant-on-demand" style="padding-right: 7px">
                                                                        <img src="https://pod-public.s3-eu-west-1.amazonaws.com/assets/icons/email_templates/linkedin.png">
                                                                </a>
                                                        </td>
                                                        <td>
                                                                 
                                                        </td>
                                                </tr>
                                                <tr>
                                                        <td style="text-align: center; justify-content: center;" colspan="3">
                                                                <img src="https://pod-public.s3-eu-west-1.amazonaws.com/assets/icons/email_templates/podFooter.png" style="padding-right: 25px">
                                                        </td>
                                                </tr>
                                        </tbody>
                                </table>
                </table>
                </div>
</body>
</html>