!!!
%html{:lang => "fr" }
  %head
    %meta{ :"http-equiv" => "Content-Type", :content => "text/html; charset=utf-8" }
    :css
      body{
      font-family:Lato, arial,helvetica,sans-serif;
      font-size:16px;
      padding:0;
      margin:0;
      color:#222222;
      
      }
      p{
        margin:15px 0px;
      }
      hr{
      border:0px;
      border-top:1px solid #eeeeee;
    
      }
      a {
      color: #4f81b8;text-decoration: none;
      }
      
      a:hover, a:focus {
      color: #4f81b8;text-decoration: underline;
      }

      img{
        max-width:100%;
        
      }
    :scss
      table{
        border-collapse:collapse;
        td{
          vertical-align:top;
          padding:5px;
          
        }
        img{
          display:block;
        }
      }
      
      .order_table td{
        border-top:1px solid #F0F0F0;
        border-bottom:1px solid #F0F0F0;
      }
  %body{:style => "background:#F0F0F0;"}
    %center
      .top{:style => "text-align:center;margin-top:10px;"}
        =link_to image_tag("http://#{HOSTNAME}/logo.png", :style => "width:160px;margin:10px 0px"), "http://#{HOSTNAME}"
      .inner{:style => "border-radius:5px;width:800px;text-align:left;margin:7px auto;background:white;"}
        .content{:style => "padding:15px;line-height:22px;"}= yield
    
        .bottom{:style => "background:#F0F0F0;padding:10px;text-align:center;font-size:13px;"}
          
          %p{:style => "color:#525252;"}