Facebook
From Chartreuse Guinea Pig, 4 Years ago, written in Plain Text.
Embed
Download Paste or View Raw
Hits: 215
  1. <!DOCTYPE html>
  2. <html lang="en">
  3.  
  4.   <head>
  5.     <meta charset="UTF-8">
  6.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  7.     <meta http-equiv="X-UA-Compatible" content="ie=edge">
  8.     <title>maczfit landing</title>
  9.     <link href="https://fonts.googleapis.com/css?family=Quicksand:400,600,700&display=swap&subset=latin-ext" rel="stylesheet">
  10.     <style>
  11.       html,
  12.       body {
  13.         box-sizing: border-box;
  14.         padding: 0;
  15.         margin: 0;
  16.       }
  17.  
  18.       .wrapper {
  19.         max-width: 690px;
  20.         width: 100%;
  21.         min-width: 280px;
  22.         margin: 0 auto;
  23.         background-color: #f9f9f9;
  24.         font-family: 'Quicksand', sans-serif;
  25.         color: #0c2340;
  26.       }
  27.  
  28.       /* navigation section  */
  29.  
  30.       .navigation {
  31.         height: 120px;
  32.         ;
  33.         display: flex;
  34.         flex-direction: row;
  35.         justify-content: center;
  36.         align-items: center;
  37.       }
  38.  
  39.       .logo-link {}
  40.  
  41.       .navigation-logo {
  42.         height: 98px;
  43.         width: 151px;
  44.         background-image: url(https://s3-eu-west-1.amazonaws.com/salesmanagoimg/36ah1dxt6fpehf53/bz0skjq3it4c2v3k/xu0omopz1ingba0j.png);
  45.         background-position: center;
  46.         background-size: contain;
  47.         cursor: pointer;
  48.       }
  49.  
  50.       .navigation-text {
  51.         font-size: 16px;
  52.         margin-left: 20px;
  53.         font-weight: 700;
  54.       }
  55.  
  56.       /* main content  */
  57.  
  58.       .content-box {
  59.         padding: 10px 20% 20px 5%;
  60.         font-weight: 600;
  61.       }
  62.  
  63.       .middle-paragraph {
  64.         margin-bottom: 0;
  65.       }
  66.  
  67.       .bottom-paragraph {
  68.         margin-top: 0;
  69.       }
  70.  
  71.       .company-name {
  72.         font-size: 15px;
  73.         font-weight: 700;
  74.       }
  75.  
  76.       /* button  */
  77.  
  78.       .btn-link {
  79.         text-decoration: none;
  80.       }
  81.  
  82.       .btn {
  83.         background-color: #122e51;
  84.         color: #fff;
  85.         font-family: 'Quicksand', sans-serif;
  86.         font-size: 16px;
  87.         border: 1px solid #122e51;
  88.         border-radius: 18px;
  89.         padding: 8px 25px;
  90.         margin: 10px 0;
  91.         cursor: pointer;
  92.       }
  93.  
  94.       /* bottom-pic  */
  95.  
  96.       .bottom {
  97.         height: 280px;
  98.       }
  99.  
  100.       .pic-link {
  101.         text-decoration: none;
  102.         cursor: pointer;
  103.       }
  104.  
  105.       .picture {
  106.         height: 100%;
  107.         background-image: url(https://s3-eu-west-1.amazonaws.com/salesmanagoimg/36ah1dxt6fpehf53/bz0skjq3it4c2v3k/u7uavn6nys7acwnl.png);
  108.         background-position: top center;
  109.         background-size: contain;
  110.         background-repeat: no-repeat;
  111.         z-index: 2;
  112.       }
  113.  
  114.       @media only screen and (max-width: 870px) {
  115.  
  116.         .top-paragraph,
  117.         .middle-paragraph {
  118.           text-align: justify;
  119.         }
  120.  
  121.         .content-box {
  122.           padding: 10px 5% 20px 5%;
  123.           font-weight: 600;
  124.         }
  125.  
  126.         .picture {
  127.           background-size: 130%;
  128.         }
  129.       }
  130.  
  131.       @media only screen and (max-width: 600px) {
  132.  
  133.         .navigation-text {
  134.           font-size: 14px;
  135.         }
  136.  
  137.         .picture {
  138.           background-size: 180%;
  139.         }
  140.  
  141.         .top-paragraph,
  142.         .middle-paragraph,
  143.         .bottom-paragraph {
  144.           font-size: 14px;
  145.         }
  146.  
  147.         .company-name {
  148.           font-size: 13px;
  149.         }
  150.  
  151.         .content-title {
  152.           font-size: 25px;
  153.         }
  154.  
  155.         .content-paragraph-title {
  156.           font-size: 18px;
  157.         }
  158.  
  159.         .btn {
  160.           padding: 5px 15px;
  161.           margin: 8px 0;
  162.           font-size: 15px;
  163.         }
  164.       }
  165.     </style>
  166.   </head>
  167.  
  168.   <body>
  169.     <div class="wrapper">
  170.       <nav class="navigation"><a href="https://www.maczfit.pl/" class="logo-link">
  171.           <div class="navigation-logo"></div>
  172.         </a>
  173.         <div class="navigation-text">Catering dietetyczny z dostawą.</div>
  174.       </nav>
  175.       <main class="content-box">
  176.         <h1 class="content-title">Twoja opinia jest dla nas ważna!</h1>
  177.         <h2 class="content-paragraph-title">Hej!</h2>
  178.         <p class="top-paragraph">Dawno Cię u nas nie było i strasznie nas ciekawi dlaczego! Może zechcesz poświęcić nam dosłownie kilka minut na króciutką ankietę. Nasze pracowite Rzodkiewki stale coś poprawiają i ulepszają, żeby móc zaoferować Ci najlepszy produkt na rynku!</p>
  179.         <p class="middle-paragraph">Udział w ankiecie jest zupełnie dobrowolny, jeżeli wyrażasz zgodę</p>
  180.         <p class="bottom-paragraph">to kliknij, o tutaj:</p>
  181.         <a href="https://www.maczfit.pl/" class="btn-link"><button class="btn">Wypełnij ankietę</button></a>
  182.         <p class="company-name">Team maczfit</p>
  183.       </main>
  184.       <footer class="bottom"><a href="https://www.maczfit.pl/" class="pic-link">
  185.           <div class="picture"></div>
  186.         </a></footer>
  187.     </div>
  188.     </td>
  189.     </tr>
  190.     <tr>
  191.       <td height="40"> </td>
  192.     </tr>
  193.     <tr>
  194.       <td>
  195.         <div align="center" style="padding-right: 0px; padding-left: 0px; padding-bottom: 0px;">
  196.           <div style="display: table; max-width: 320px;">
  197.             <!--[if (mso)|(IE)]><table width="320" cellpadding="0" cellspacing="0" border="0"><tr><td style="border-collapse:collapse; padding-right: 10px; padding-left: 10px; padding-bottom: 0px;"  align="center"><table width="100%" cellpadding="0" cellspacing="0" border="0" style="border-collapse:collapse; mso-table-lspace: 0pt;mso-table-rspace: 0pt; width:320px;"><tr><td width="32" style="width:32px; padding-right: 10px;" valign="top"><![endif]-->
  198.             <table align="left" border="0" cellspacing="0" cellpadding="0" style="border-collapse: collapse; table-layout: fixed; border-spacing: 0px; vertical-align: top; margin-right: 0px; width: 45px; height: 45px;">
  199.               <tbody>
  200.                 <tr style="vertical-align: top;">
  201.                   <td align="left" valign="middle" style="word-break: break-word; border-collapse: collapse !important; vertical-align: top;"><a href="https://www.facebook.com/maczfit/" title="Facebook" target="_blank"> <img src="https://s3-eu-west-1.amazonaws.com/salesmanago/000creator/set30_140_30/round_grey/facebook.png" alt="Facebook" title="Facebook" width="45" style="outline: none; text-decoration: none; -ms-interpolation-mode: bicubic; clear: both; display: block !important; border: none; height: auto; float: none; max-width: 45px !important;" /> </a>
  202.                     <div style="line-height: 5px; font-size: 1px;"> </div>
  203.                   </td>
  204.                 </tr>
  205.               </tbody>
  206.             </table>
  207.             <!--[if (mso)|(IE)]></td><td width="32" style="width:32px; padding-right: 10px;" valign="top"><![endif]-->
  208.             <table align="left" border="0" cellspacing="0" cellpadding="0" style="border-collapse: collapse; table-layout: fixed; border-spacing: 0px; vertical-align: top; margin-right: 0px; width: 45px; height: 45px;">
  209.               <tbody>
  210.                 <tr style="vertical-align: top;">
  211.                   <td align="left" valign="middle" style="word-break: break-word; border-collapse: collapse !important; vertical-align: top;"><a href="https://www.instagram.com/maczfit/" title="Instagram" target="_blank"> <img src="https://s3-eu-west-1.amazonaws.com/salesmanago/000creator/set30_140_30/round_grey/istagram.png" alt="Instagram" title="Instagram" width="45" style="outline: none; text-decoration: none; -ms-interpolation-mode: bicubic; clear: both; display: block !important; border: none; height: auto; float: none; max-width: 45px !important;" /> </a>
  212.                     <div style="line-height: 5px; font-size: 1px;"> </div>
  213.                   </td>
  214.                 </tr>
  215.               </tbody>
  216.             </table>
  217.             <!--[if (mso)|(IE)]></td><td width="32" style="width:32px; padding-right: 10px;" valign="top"><![endif]-->
  218.             <table align="left" border="0" cellspacing="0" cellpadding="0" style="border-collapse: collapse; table-layout: fixed; border-spacing: 0px; vertical-align: top; margin-right: 0px; width: 45px; height: 45px;">
  219.               <tbody>
  220.                 <tr style="vertical-align: top;">
  221.                   <td align="left" valign="middle" style="word-break: break-word; border-collapse: collapse !important; vertical-align: top;"><a href="https://www.youtube.com/channel/UCOwLB2l-sLCUFDoYfm_S7-w/videos" title="YouTube" target="_blank"> <img src="https://s3-eu-west-1.amazonaws.com/salesmanago/000creator/set30_140_30/round_grey/youtube.png" alt="YouTube" title="YouTube" width="45" style="outline: none; text-decoration: none; -ms-interpolation-mode: bicubic; clear: both; display: block !important; border: none; height: auto; float: none; max-width: 45px !important;" /> </a>
  222.                     <div style="line-height: 5px; font-size: 1px;"> </div>
  223.                   </td>
  224.                 </tr>
  225.               </tbody>
  226.             </table>
  227.             <!--[if (mso)|(IE)]></td><td width="32" style="width:32px; padding-right: 10px;" valign="top"><![endif]-->
  228.             <table align="left" border="0" cellspacing="0" cellpadding="0" style="border-collapse: collapse; table-layout: fixed; border-spacing: 0px; vertical-align: top; margin-right: 0px; width: 45px; height: 45px;">
  229.               <tbody>
  230.                 <tr style="vertical-align: top;">
  231.                   <td align="left" valign="middle" style="word-break: break-word; border-collapse: collapse !important; vertical-align: top;"><a href="https://pl.pinterest.com/maczfit0/" title="Pinterest" target="_blank"> <img src="https://s3-eu-west-1.amazonaws.com/salesmanago/000creator/set30_140_30/round_grey/pinterest.png" alt="Pinterest" title="Pinterest" width="45" style="outline: none; text-decoration: none; -ms-interpolation-mode: bicubic; clear: both; display: block !important; border: none; height: auto; float: none; max-width: 45px !important;" /> </a>
  232.                     <div style="line-height: 5px; font-size: 1px;"> </div>
  233.                   </td>
  234.                 </tr>
  235.               </tbody>
  236.             </table>
  237.             <!--[if (mso)|(IE)]></td><td width="32" style="width:32px; padding-right: 10px;" valign="top"><![endif]-->
  238.             <table align="left" border="0" cellspacing="0" cellpadding="0" style="border-collapse: collapse; table-layout: fixed; border-spacing: 0px; vertical-align: top; margin-right: 0px; width: 45px; height: 45px;">
  239.               <tbody>
  240.                 <tr style="vertical-align: top;">
  241.                   <td align="left" valign="middle" style="word-break: break-word; border-collapse: collapse !important; vertical-align: top;"><a href="https://www.linkedin.com/company/ordersen-sp-z-o-o-" title="LinkedIn" target="_blank"> <img src="https://s3-eu-west-1.amazonaws.com/salesmanago/000creator/set30_140_30/round_grey/linkedin.png" alt="LinkedIn" title="LinkedIn" width="45" style="outline: none; text-decoration: none; -ms-interpolation-mode: bicubic; clear: both; display: block !important; border: none; height: auto; float: none; max-width: 45px !important;" /> </a>
  242.                     <div style="line-height: 5px; font-size: 1px;"> </div>
  243.                   </td>
  244.                 </tr>
  245.               </tbody>
  246.             </table>
  247.             <!--[if (mso)|(IE)]></td><td width="32" style="width:32px; padding-right: 0;" valign="top"><![endif]-->
  248.             <table align="left" border="0" cellspacing="0" cellpadding="0" style="border-collapse: collapse; table-layout: fixed; border-spacing: 0px; vertical-align: top; margin-right: 0px; width: 45px; height: 45px;">
  249.               <tbody>
  250.                 <tr style="vertical-align: top;">
  251.                   <td align="left" valign="middle" style="word-break: break-word; border-collapse: collapse !important; vertical-align: top;"><a href="https://twitter.com/MACZFIT" title="Twitter" target="_blank"> <img src="https://s3-eu-west-1.amazonaws.com/salesmanago/000creator/set30_140_30/round_grey/twitter.png" alt="Twitter" title="Twitter" width="45" style="outline: none; text-decoration: none; -ms-interpolation-mode: bicubic; clear: both; display: block !important; border: none; height: auto; float: none; max-width: 45px !important;" /> </a></td>
  252.                 </tr>
  253.               </tbody>
  254.             </table>
  255.             <!--[if (mso)|(IE)]></td></tr></table></td></tr></table><![endif]-->
  256.           </div>
  257.         </div>
  258.       </td>
  259.     </tr>
  260.     <tr>
  261.       <td>
  262.         <div style="font-size: 12px; line-height: 14px; color: #555555; font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif; text-align: left;">
  263.           <p style="margin: 0; font-size: 12px; line-height: 14px; text-align: center;"><span style="font-size: 10px; line-height: 12px;">Otrzymujesz tę wiadomość, ponieważ jesteś w bazie klientów Maczfit.</span></p>
  264.           <p style="margin: 0; font-size: 12px; line-height: 14px; text-align: center;"><span style="font-size: 10px; line-height: 12px;">Jeśli chcesz się wypisać z listy odbiorców, kliknij <a style="color: #0068a5; text-decoration: underline;" href="$opt-out$" target="_blank" rel="noopener">tutaj.</a></span></p>
  265.           <p style="margin: 0; font-size: 12px; line-height: 14px; text-align: center;"><span style="font-size: 10px; line-height: 12px;">Nr decyzji Państwowego Instytutu Sanitarnego odbioru Sanitarnego dla zakładu Cateringu Dietetycznego Maczfit HZN. 4400.3.126.2016 z dnia 22.11.2016</span></p>
  266.         </div>
  267.       </td>
  268.     </tr>
  269.     </tbody>
  270.     </table>
  271.     </div>
  272.     </center>
  273.  
  274.   </body>
  275.  
  276. </html>