web: Fix checkout-se layout.
[gnupg-doc.git] / web / donate / checkout-se.org
1 #                                                    -*- html -*-
2 #+TITLE: GnuPG - Donate - Checkout using SEPA
3 #+STARTUP: showall
4 #+SETUPFILE: "../share/setup.inc"
5
6 #+BEGIN_HTML
7 <!--custom-page-->  <!-- this disables all standard processing. -->
8   <!-- bootstrap core and site css -->
9   <link href="/share/3rdparty/bootstrap/bootstrap-gnupg.css" rel="stylesheet">
10   <link href="/share/campaign/campaign.css" rel="stylesheet">
11
12   <script defer src="/share/3rdparty/jquery/jquery.min.js"></script>
13   <script defer src="/share/3rdparty/bootstrap/bootstrap.min.js"></script>
14
15 </head>
16   <body lang="<!--LANG-->">
17     <style>
18 .control-label {
19   padding-top: 0 !important;
20 }
21
22 .form-control-static {
23   padding-top: 0 !important;
24   padding-bottom: 0 !important;
25   min-height: 0 !important;
26 }
27 .qrcode > svg {
28   max-width: 100%;
29   height: auto;
30 }
31     </style>
32
33     <!-- Fixed navbar -->
34     <nav class="navbar navbar-default navbar-fixed-top">
35       <div class="container">
36
37         <div class="navbar-header">
38           <button type="button" class="navbar-toggle collapsed"
39                   data-toggle="collapse" data-target="#navbar"
40                   aria-expanded="false" aria-controls="navbar">
41             <span class="sr-only">Toggle navigation</span>
42             <span class="icon-bar"></span>
43             <span class="icon-bar"></span>
44             <span class="icon-bar"></span>
45           </button>
46           <img class="navbar-brand" alt="GnuPG"
47                src="/share/gnupg-lock-white-250x250.png">
48         </div>
49
50         <div id="navbar" class="navbar-collapse collapse">
51           <ul class="nav navbar-nav">
52             <li><a href="/">Home</a></li>
53           </ul>
54         </div><!--/.nav-collapse -->
55       </div>
56     </nav>
57
58     <div class="camp-gutter container">
59       <div class="row">
60         <div class="col-xs-12 col-md-8 col-md-offset-2">
61
62       <div class="row">
63         <div class="col-xs-12">
64           <h2>Summary</h2>
65           <p>
66           Single Euro Payments Area credit transfers can be used to transfer
67           Euro within the 34 states of the European Union and 6 associated
68           states.
69           </p>
70         </div>
71       </div>
72
73       <div class="row">
74         <div class="col-xs-12 col-sm-9">
75           <form class="form-horizontal">
76             <div class="form-group">
77               <label class="col-xs-3 control-label">Name</label>
78               <div class="col-xs-9">
79                 <p class="form-control-static"><!--NAME--></p>
80               </div>
81             </div>
82             <div class="form-group">
83               <label class="col-xs-3 control-label">Mail</label>
84               <div class="col-xs-9">
85                 <p class="form-control-static"><!--MAIL--></p>
86               </div>
87             </div>
88             <div class="form-group">
89               <label class="col-xs-3 control-label">Message</label>
90               <div class="col-xs-9">
91                 <p class="form-control-static"><!--MESSAGE_FMT--></p>
92               </div>
93             </div>
94           </form>
95         </div>
96       </div>
97
98       <div class="row">
99         <div class="col-xs-12">
100           <p>
101           Please send your donation to this bank account:
102           </p>
103         </div>
104       </div>
105
106       <div class="row">
107         <div class="col-xs-12 col-sm-9">
108           <form class="form-horizontal">
109             <div class="form-group">
110               <label class="col-xs-3 control-label">Owner</label>
111               <div class="col-xs-9">
112                 <p class="form-control-static">g10 Code GmbH</p>
113               </div>
114             </div>
115             <div class="form-group">
116               <label class="col-xs-3 control-label">IBAN</label>
117               <div class="col-xs-9">
118                 <p class="form-control-static">DE76 3015 0200 0002 1086 03</p>
119               </div>
120             </div>
121             <div class="form-group">
122               <label class="col-xs-3 control-label">BIC</label>
123               <div class="col-xs-9">
124                 <p class="form-control-static">WELADED1KSD</p>
125               </div>
126             </div>
127             <div class="form-group">
128               <label class="col-xs-3 control-label">Reference</label>
129               <div class="col-xs-9">
130                 <p class="form-control-static"><!--SEPA_REF--></p>
131               </div>
132             </div>
133             <div class="form-group">
134               <label class="col-xs-3 control-label">Amount</label>
135               <div class="col-xs-9">
136                 <p class="form-control-static"><!--AMOUNT--> EUR</p>
137               </div>
138             </div>
139           </form>
140         </div>
141
142         <div class="col-xs-12 col-sm-3">
143           <div class="qrcode text-center">
144             <!--SEPA_QR-->
145           </div>
146         </div>
147       </div>
148
149       <div class="row">
150         <div class="col-xs-12">
151           <p>
152             Take care to give the reference number so that we can match your
153             data with your actual donation and list you as donor if desired.
154             The given reference number expires in 30 days, thus please act in
155             time.  You may send a different amount but please send at least 5
156             Euro to cover our bookkeeping costs.  Using the reference number for
157             recurring donations is also possible.
158           </p>
159           <p>
160             <strong>Thank you in advance for your donation.</strong>
161           </p>
162         </div>
163       </div>
164
165       <div class="row">
166         <div class="col-xs-12">
167           <p>
168             <a class="btn btn-default btn-sm" href="/">Continue</a>
169           </p>
170         </div>
171       </div>
172
173         </div>
174       </div>
175     </div>
176
177     <div class="camp-gutter container-fluid" id="camp-footer">
178       <div class="container">
179         <div class="row">
180           <div id="cpyright">
181             <a rel="license" href="https://creativecommons.org/licenses/by-sa/3.0/">
182               <img alt="CC-BY-SA 4.0" style="border: 0"
183                     src="/share/cc-by-sa_80x15.png"/></a>&nbsp;
184             This web page is
185             Copyright 2017 The GnuPG Project and licensed under a
186             <a rel="license" href="https://creativecommons.org/licenses/by-sa/4.0/">
187             Creative Commons Attribution-ShareAlike 4.0 International License</a>.  See
188             <a href="/copying.html">copying</a> for details.
189           </div>
190         </div>
191       </div>
192     </div>
193
194   </body>
195 </html>
196 #+END_HTML