Inboxes

Create an inbox to save and track emails. It's free!

+New inbox

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "//www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en" xmlns="//www.w3.org/1999/xhtml">
 <head>
  <meta content="width=device-width" name="viewport"/>
  <meta content="text/html; charset=utf-8" http-equiv="Content-Type"/>
  <title>
   Calendly
  </title>
  <style>
   /* -------------------------------------
  GLOBAL
  ------------------------------------- */
  * { font-family: "Proxima Nova", "proxima-nova", Helvetica, Arial sans-serif }

  img {
    max-width: 100%;
  }
  .collapse {
    margin:0;
    padding:0;
  }
  body {
    -webkit-font-smoothing:antialiased;
    -webkit-text-size-adjust:none;
    width: 100%!important;
    height: 100%;
  }

  /* -------------------------------------
  ELEMENTS
  ------------------------------------- */
  .user-customizable-area p { font-size: 16px; margin-top: 12px }

  p.publisher-updated-field, p.updated-field, .user-customizable-area p.event-field {
    margin-top: 0px;
    margin-bottom: 0px;
    line-height: 22px;
  }

  p.publisher-updated-field {
    color: #666A73;
  }

  p.updated-field, .user-customizable-area p.event-field {
    font-size: 14px;
  }

  a, a:visited, a:link { color: #4d9bd7; text-decoration: none;}

  .btn {
    text-decoration:none;
    color: #FFF;
    background-color: #666;
    padding:10px 16px;
    font-weight:bold;
    margin-right:10px;
    text-align:center;
    cursor:pointer;
    display: inline-block;
  }

  p.callout {
    padding: 10px 0;
    margin-bottom: 0px;
  }
  .callout a {
    font-weight:bold;
    color: #2BA6CB;
  }

  table.social {
    /* 	padding:15px; */
    background-color: #ebebeb;

  }
  .social .soc-btn {
    padding: 3px 7px;
    font-size:12px;
    margin-bottom:10px;
    text-decoration:none;
    color: #FFF;font-weight:bold;
    display:block;
    text-align:center;
  }
  a.fb { background-color: #3B5998!important; }
  a.tw { background-color: #1daced!important; }
  a.gp { background-color: #DB4A39!important; }
  a.ms { background-color: #000!important; }

  .sidebar .soc-btn {
    display:block;
    width:100%;
  }

  /* -------------------------------------
  BODY
  ------------------------------------- */
  table.body-wrap { width: 80%; margin: 20px auto 0;}

  .error-notification {
    background-color: rgba(227, 22, 0, 0.1);
    font-size: 14px;
    line-height: 1.57;
    text-align: left;
    color: #4d5055;
    padding: 20px;
  }

  /* -------------------------------------
  FOOTER
  ------------------------------------- */
  table.footer-wrap { width: 80%;	clear:both!important; margin: 0 auto;}
  .footer-wrap .container td.content  p { border-top: 1px solid rgb(215,215,215); padding-top:15px;}
  .footer-wrap .container td.content p {
    font-size:10px;
    font-weight: bold;

  }


  /* ---------------------------------------------------
  RESPONSIVENESS
  Nuke it from orbit. It's the only way to be sure.
  ------------------------------------------------------ */

  /* Set a max-width, and make it display as block so it will automatically stretch to that width, but will also shrink down on a phone or something */
  .container {
    display:block!important;
    max-width:600px!important;
    margin:0 auto!important; /* makes it centered */
    clear:both!important;
  }

  /* This should also be a block element, so that it will fill 100% of the .container */
  .content {
    padding:15px;
    max-width:600px;
    margin:0 auto;
    display:block;
  }

  /* Let's make sure tables in the content area are 100% wide */
  .content table { width: 100%; }


  /* Odds and ends */
  .column {
    width: 300px;
    float:left;
  }
  .column tr td { padding: 15px; }
  .column-wrap {
    padding:0!important;
    margin:0 auto;
    max-width:600px!important;
  }
  .column table { width:100%;}
  .social .column {
    width: 280px;
    min-width: 279px;
    float:left;
  }

  /* Be sure to place a .clear element after each set of columns, just to be safe */
  .clear { display: block; clear: both; }


  /* -------------------------------------------
  PHONE
  For clients that support media queries.
  Nothing fancy.
  -------------------------------------------- */
  @media only screen and (max-width: 600px) {

    a[class="btn"] { display:block!important; margin-bottom:10px!important; background-image:none!important; margin-right:0!important;}

    div[class="column"] { width: auto!important; float:none!important;}

    table.social div[class="column"] {
      width:auto!important;
    }

  }
  </style>
 </head>
 <body bgcolor="#ffffff" style="background-color: #ffffff">
  <div class="main-wrapper" style="padding: 20px 0; margin: 0 auto; max-width: 600px;">
   <table class="body-wrap" style="margin: 0 auto; padding-bottom: 20px; border-bottom: 1px dashed #dadada;">
    <tr>
     <td style="text-align: center;">
      <p>
       <img alt="Calendly" height="50" src="https://inboxflows.com/_/image/http%253A%252F%252Fassets.calendly.com%252Fassets%252Femails%252Flogo-email-header-bf5b520caa9ce340db28579b758ee14277f7cb1d44412d667a32934fae15ca96.png/?inbox_flows_img_sig=eyJwYXRoIjoiaHR0cCUzQSUyRiUyRmFzc2V0cy5jYWxlbiJ9:1kXOYR:SP7O-FvDZv0ND8ALtVRe_Wgc9v6I6DLG0OT-qKhrRvk" width="55"/>
      </p>
     </td>
    </tr>
   </table>
   <!-- BODY -->
   <table class="body-wrap" style="margin: 30px auto 0; font-size: 16px;">
    <tr>
     <td style="color: #4d5055; line-height: 22px;">
      <p style="margin-bottom: 12px;">
       Hi Sarah Jonas,
      </p>
      <p style="margin-bottom: 12px;">
       A new event has been scheduled.
      </p>
      <p style="margin-bottom: 12px;">
       <strong style="font-size: 14px;">
        Event Type:
       </strong>
       <br/>
       Product chat
      </p>
      <p style="margin-bottom: 12px;">
       <strong style="font-size: 14px;">
        Invitee:
       </strong>
       <br/>
       James Jonas
      </p>
      <p style="margin-bottom: 12px;">
       <strong style="font-size: 14px;">
        Invitee Email:
       </strong>
       <br/>
       <a>
        ead9711a@uifeed.com
       </a>
      </p>
      <p style="margin-bottom: 12px;">
       <strong style="font-size: 14px;">
        Event Date/Time:
       </strong>
       <br/>
       10:30am - Wednesday, 15 May 2019 (Auckland Time)
      </p>
      <p style="margin-bottom: 12px;">
       <strong style="font-size: 14px;">
        Description:
       </strong>
       <br/>
       A chat about products
      </p>
      <p style="margin-bottom: 12px;">
       <strong style="font-size: 14px;">
        Location:
       </strong>
       <br/>
       Skype
      </p>
      <p style="margin-bottom: 12px;">
       <strong style="font-size: 14px;">
        Invitee Time Zone:
       </strong>
       <br/>
       Auckland Time
      </p>
      <strong style="font-size: 14px;">
       Date &amp; Time:
      </strong>
      <p class="publisher-updated-field" style="color: #939393; text-decoration: line-through">
       Former:
12:30pm - Thursday, 16 May 2019 (Auckland Time)
      </p>
      <p class="publisher-updated-field" style="color: #666A73">
       <strong style="color: #30BF5B">
        Updated:
       </strong>
       10:30am - Wednesday, 15 May 2019 (Auckland Time)
      </p>
      <p style="margin: 30px 0 12px;">
       Questions:
      </p>
      <p>
       <strong style="font-size: 14px;">
        What is the meaning of life?
       </strong>
       <br/>
      </p>
      <p>
       Don't know
      </p>
      <p>
       <strong style="font-size: 14px;">
        Which product do you want to talk about?
       </strong>
       <br/>
      </p>
      <p>
       Calendly
      </p>
      <p style="margin-bottom: 12px; color: #e41600;">
       <strong style="font-size: 14px;">
        Rescheduled by Sarah Jonas
       </strong>
       <br/>
       <span>
        Reason - Fancied it
       </span>
      </p>
     </td>
    </tr>
   </table>
   <!-- /BODY -->
   <!-- FOOTER -->
   <table class="footer-wrap" style=" width: 80%; margin: 30px auto; border-top: 1px dashed #dadada;">
    <tr>
     <td style="color: #a8a8a8; padding-top: 15px;">
      <!-- FOOTER CONTENT -->
      <p style="font-size: 12px; text-align: left;">
       Sent from
       <a>
        Calendly
       </a>
      </p>
      <!-- /FOOTER CONTENT -->
     </td>
    </tr>
   </table>
   <!-- /FOOTER -->
  </div>
  <img alt="" border="0" height="1" src="https://inboxflows.com/_/image/https%253A%252F%252Fu720154.ct.sendgrid.net%252Fwf%252Fopen%253Fupn%253DX2veue1TaqgZLujStN4eXXBbADFbrQLE1nLxXuHyW36nf6EGL3eYGyr8ovS0I9fEXY-2BL06xa1d0vTNizxgKWnBAUQjWtROYgxqTBXlcC5MkXRYIF4o9Yoh46q5Rs9xeWEL3NnrT7vXZLOi9hP2tbC-2FFED4ZQE8x-2Fd76rUpchZkyD1HHy9C5h9dL6De0WwLlE76ddXmKrhLKT7jYq5x3Y7uWxCV7o-2BKUVdIQQE37rHHeBqo9LzhBRwqMLvNcCw9HNl4TiyjAKJiPyYnJeMI6jww-3D-3D/?inbox_flows_img_sig=eyJwYXRoIjoiaHR0cHMlM0ElMkYlMkZ1NzIwMTU0LmN0LiJ9:1kXOYR:NZXi_ephQ-LSlAA8ocvlsEIhZ7qN94tnDlS3KkZ2TBU" style="height:1px !important;width:1px !important;border-width:0 !important;margin-top:0 !important;margin-bottom:0 !important;margin-right:0 !important;margin-left:0 !important;padding-top:0 !important;padding-bottom:0 !important;padding-right:0 !important;padding-left:0 !important;" width="1"/>
 </body>
</html>