pyc-website
main website for pyc inc.
git clone https://9o.is/git/pyc-website.git
base-dev.html
(23228B)
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2 <html xmlns="http://www.w3.org/1999/xhtml">
3 <head>
4 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
5 <title><span class="ptitle"></span></title>
6 <style type="text/css">
7 /* /\/\/\/\/\/\/\/\/ CLIENT-SPECIFIC STYLES /\/\/\/\/\/\/\/\/ */
8 #outlook a{padding:0;} /* Force Outlook to provide a "view in browser" message */
9 .ReadMsgBody{width:100%;} .ExternalClass{width:100%;} /* Force Hotmail to display emails at full width */
10 .ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div {line-height: 100%;} /* Force Hotmail to display normal line spacing */
11 body, table, td, p, a, li, blockquote{-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%;} /* Prevent WebKit and Windows mobile changing default text sizes */
12 table, td{mso-table-lspace:0pt; mso-table-rspace:0pt;} /* Remove spacing between tables in Outlook 2007 and up */
13 img{-ms-interpolation-mode:bicubic;} /* Allow smoother rendering of resized image in Internet Explorer */
14
15 /* /\/\/\/\/\/\/\/\/ RESET STYLES /\/\/\/\/\/\/\/\/ */
16 body{margin:0; padding:0;}
17 img{border:0; height:auto; line-height:100%; outline:none; text-decoration:none;}
18 table{border-collapse:collapse !important;}
19 body, #bodyTable, #bodyCell{height:100% !important; margin:0; padding:0; width:100% !important;}
20
21 /* /\/\/\/\/\/\/\/\/ TEMPLATE STYLES /\/\/\/\/\/\/\/\/ */
22
23 /* ========== Page Styles ========== */
24
25 #bodyCell{padding:20px;}
26 #templateContainer{width:600px;}
27
28 /**
29 * @tab Page
30 * @section background style
31 * @tip Set the background color and top border for your email. You may want to choose colors that match your company's branding.
32 * @theme page
33 */
34 body, #bodyTable{
35 /*@editable*/ background-color:#FFFFFF;
36 }
37
38 /**
39 * @tab Page
40 * @section background style
41 * @tip Set the background color and top border for your email. You may want to choose colors that match your company's branding.
42 * @theme page
43 */
44 #bodyCell{
45 /*@editable*/ border-top:4px solid #FFFFFF;
46 }
47
48 /**
49 * @tab Page
50 * @section email border
51 * @tip Set the border for your email.
52 */
53 #templateContainer{
54 /*@editable*/ border:1px solid #BBBBBB;
55 }
56
57 /**
58 * @tab Page
59 * @section heading 1
60 * @tip Set the styling for all first-level headings in your emails. These should be the largest of your headings.
61 * @style heading 1
62 */
63 h1{
64 /*@editable*/ color:#202020 !important;
65 display:block;
66 /*@editable*/ font-family:Helvetica;
67 /*@editable*/ font-size:26px;
68 /*@editable*/ font-style:normal;
69 /*@editable*/ font-weight:bold;
70 /*@editable*/ line-height:100%;
71 /*@editable*/ letter-spacing:normal;
72 margin-top:0;
73 margin-right:0;
74 margin-bottom:10px;
75 margin-left:0;
76 /*@editable*/ text-align:left;
77 }
78
79 /**
80 * @tab Page
81 * @section heading 2
82 * @tip Set the styling for all second-level headings in your emails.
83 * @style heading 2
84 */
85 h2{
86 /*@editable*/ color:#404040 !important;
87 display:block;
88 /*@editable*/ font-family:Helvetica;
89 /*@editable*/ font-size:20px;
90 /*@editable*/ font-style:normal;
91 /*@editable*/ font-weight:bold;
92 /*@editable*/ line-height:100%;
93 /*@editable*/ letter-spacing:normal;
94 margin-top:0;
95 margin-right:0;
96 margin-bottom:10px;
97 margin-left:0;
98 /*@editable*/ text-align:left;
99 }
100
101 /**
102 * @tab Page
103 * @section heading 3
104 * @tip Set the styling for all third-level headings in your emails.
105 * @style heading 3
106 */
107 h3{
108 /*@editable*/ color:#606060 !important;
109 display:block;
110 /*@editable*/ font-family:Helvetica;
111 /*@editable*/ font-size:16px;
112 /*@editable*/ font-style:italic;
113 /*@editable*/ font-weight:normal;
114 /*@editable*/ line-height:100%;
115 /*@editable*/ letter-spacing:normal;
116 margin-top:0;
117 margin-right:0;
118 margin-bottom:10px;
119 margin-left:0;
120 /*@editable*/ text-align:left;
121 }
122
123 /**
124 * @tab Page
125 * @section heading 4
126 * @tip Set the styling for all fourth-level headings in your emails. These should be the smallest of your headings.
127 * @style heading 4
128 */
129 h4{
130 /*@editable*/ color:#808080 !important;
131 display:block;
132 /*@editable*/ font-family:Helvetica;
133 /*@editable*/ font-size:14px;
134 /*@editable*/ font-style:italic;
135 /*@editable*/ font-weight:normal;
136 /*@editable*/ line-height:100%;
137 /*@editable*/ letter-spacing:normal;
138 margin-top:0;
139 margin-right:0;
140 margin-bottom:10px;
141 margin-left:0;
142 /*@editable*/ text-align:left;
143 }
144
145 /* ========== Header Styles ========== */
146
147 /**
148 * @tab Header
149 * @section preheader style
150 * @tip Set the background color and bottom border for your email's preheader area.
151 * @theme header
152 */
153 #templatePreheader{
154 /*@editable*/ background-color:#3E648D;
155 /*@editable*/ border-bottom:1px solid #CCCCCC;
156 }
157
158 /**
159 * @tab Header
160 * @section preheader text
161 * @tip Set the styling for your email's preheader text. Choose a size and color that is easy to read.
162 */
163 .preheaderContent{
164 /*@editable*/ color:#ffffff;
165 /*@editable*/ font-family:Helvetica;
166 /*@editable*/ font-size:10px;
167 /*@editable*/ line-height:125%;
168 /*@editable*/ text-align:left;
169 }
170
171 /**
172 * @tab Header
173 * @section preheader link
174 * @tip Set the styling for your email's preheader links. Choose a color that helps them stand out from your text.
175 */
176 .preheaderContent a:link, .preheaderContent a:visited, /* Yahoo! Mail Override */ .preheaderContent a .yshortcuts /* Yahoo! Mail Override */{
177 /*@editable*/ color:#ffffff;
178 /*@editable*/ font-weight:normal;
179 /*@editable*/ text-decoration:underline;
180 }
181
182 /**
183 * @tab Header
184 * @section header style
185 * @tip Set the background color and borders for your email's header area.
186 * @theme header
187 */
188 #templateHeader{
189 /*@editable*/ background-color:#FFFFFF;
190 }
191
192 /**
193 * @tab Header
194 * @section header text
195 * @tip Set the styling for your email's header text. Choose a size and color that is easy to read.
196 */
197 .headerContent{
198 /*@editable*/ color:#505050;
199 /*@editable*/ font-family:Helvetica;
200 /*@editable*/ font-size:20px;
201 /*@editable*/ font-weight:bold;
202 /*@editable*/ line-height:100%;
203 /*@editable*/ padding-top:10px;
204 /*@editable*/ padding-right:10px;
205 /*@editable*/ padding-bottom:10px;
206 /*@editable*/ padding-left:10px;
207 /*@editable*/ text-align:left;
208 /*@editable*/ vertical-align:middle;
209 }
210
211 /**
212 * @tab Header
213 * @section header link
214 * @tip Set the styling for your email's header links. Choose a color that helps them stand out from your text.
215 */
216 .headerContent a:link, .headerContent a:visited, /* Yahoo! Mail Override */ .headerContent a .yshortcuts /* Yahoo! Mail Override */{
217 /*@editable*/ color:#EB4102;
218 /*@editable*/ font-weight:normal;
219 /*@editable*/ text-decoration:underline;
220 }
221
222 #headerImage{
223 height:auto;
224 max-width:160px;
225 }
226
227 /* ========== Body Styles ========== */
228
229 /**
230 * @tab Body
231 * @section body style
232 * @tip Set the background color and borders for your email's body area.
233 */
234 #templateBody{
235 /*@editable*/ background-color:#FFFFFF;
236 }
237
238 /**
239 * @tab Body
240 * @section body text
241 * @tip Set the styling for your email's main content text. Choose a size and color that is easy to read.
242 * @theme main
243 */
244 .bodyContent{
245 /*@editable*/ color:#505050;
246 /*@editable*/ font-family:Helvetica;
247 /*@editable*/ font-size:16px;
248 /*@editable*/ line-height:150%;
249 padding-top:20px;
250 padding-right:20px;
251 padding-bottom:20px;
252 padding-left:20px;
253 /*@editable*/ text-align:left;
254 }
255
256 /**
257 * @tab Body
258 * @section body link
259 * @tip Set the styling for your email's main content links. Choose a color that helps them stand out from your text.
260 */
261 .bodyContent a:link, .bodyContent a:visited, /* Yahoo! Mail Override */ .bodyContent a .yshortcuts /* Yahoo! Mail Override */{
262 /*@editable*/ color:#3E648D;
263 /*@editable*/ font-weight:normal;
264 /*@editable*/ text-decoration:underline;
265 }
266
267 .bodyContent img{
268 display:inline;
269 height:auto;
270 max-width:560px;
271 }
272
273 /* ========== Column Styles ========== */
274
275 .templateColumnContainer{width:260px;}
276
277 /**
278 * @tab Columns
279 * @section column style
280 * @tip Set the background color and borders for your email's column area.
281 */
282 #templateColumns{
283 /*@editable*/ background-color:#FFFFFF;
284 /*@editable*/ border-top:1px solid #FFFFFF;
285 /*@editable*/ border-bottom:1px solid #CCCCCC;
286 }
287
288 /**
289 * @tab Columns
290 * @section left column text
291 * @tip Set the styling for your email's left column content text. Choose a size and color that is easy to read.
292 */
293 .leftColumnContent{
294 /*@editable*/ color:#505050;
295 /*@editable*/ font-family:Helvetica;
296 /*@editable*/ font-size:14px;
297 /*@editable*/ line-height:150%;
298 padding-top:0;
299 padding-right:20px;
300 padding-bottom:20px;
301 padding-left:20px;
302 /*@editable*/ text-align:left;
303 }
304
305 /**
306 * @tab Columns
307 * @section left column link
308 * @tip Set the styling for your email's left column content links. Choose a color that helps them stand out from your text.
309 */
310 .leftColumnContent a:link, .leftColumnContent a:visited, /* Yahoo! Mail Override */ .leftColumnContent a .yshortcuts /* Yahoo! Mail Override */{
311 /*@editable*/ color:#3E648D;
312 /*@editable*/ font-weight:normal;
313 /*@editable*/ text-decoration:underline;
314 }
315
316 /**
317 * @tab Columns
318 * @section right column text
319 * @tip Set the styling for your email's right column content text. Choose a size and color that is easy to read.
320 */
321 .rightColumnContent{
322 /*@editable*/ color:#505050;
323 /*@editable*/ font-family:Helvetica;
324 /*@editable*/ font-size:14px;
325 /*@editable*/ line-height:150%;
326 padding-top:0;
327 padding-right:20px;
328 padding-bottom:20px;
329 padding-left:20px;
330 /*@editable*/ text-align:left;
331 }
332
333 /**
334 * @tab Columns
335 * @section right column link
336 * @tip Set the styling for your email's right column content links. Choose a color that helps them stand out from your text.
337 */
338 .rightColumnContent a:link, .rightColumnContent a:visited, /* Yahoo! Mail Override */ .rightColumnContent a .yshortcuts /* Yahoo! Mail Override */{
339 /*@editable*/ color:#3E648D;
340 /*@editable*/ font-weight:normal;
341 /*@editable*/ text-decoration:underline;
342 }
343
344 .leftColumnContent img, .rightColumnContent img{
345 display:inline;
346 height:auto;
347 max-width:260px;
348 }
349
350 /* ========== Footer Styles ========== */
351
352 /**
353 * @tab Footer
354 * @section footer style
355 * @tip Set the background color and borders for your email's footer area.
356 * @theme footer
357 */
358 #templateFooter{
359 /*@editable*/ background-color:#FFFFFF;
360 /*@editable*/ border-top:1px solid #FFFFFF;
361 }
362
363 /**
364 * @tab Footer
365 * @section footer text
366 * @tip Set the styling for your email's footer text. Choose a size and color that is easy to read.
367 * @theme footer
368 */
369 .footerContent{
370 /*@editable*/ color:#808080;
371 /*@editable*/ font-family:Helvetica;
372 /*@editable*/ font-size:10px;
373 /*@editable*/ line-height:150%;
374 padding-top:20px;
375 padding-right:20px;
376 padding-bottom:20px;
377 padding-left:20px;
378 /*@editable*/ text-align:left;
379 }
380
381 /**
382 * @tab Footer
383 * @section footer link
384 * @tip Set the styling for your email's footer links. Choose a color that helps them stand out from your text.
385 */
386 .footerContent a:link, .footerContent a:visited, /* Yahoo! Mail Override */ .footerContent a .yshortcuts, .footerContent a span /* Yahoo! Mail Override */{
387 /*@editable*/ color:#606060;
388 /*@editable*/ font-weight:normal;
389 /*@editable*/ text-decoration:underline;
390 }
391
392 /* /\/\/\/\/\/\/\/\/ MOBILE STYLES /\/\/\/\/\/\/\/\/ */
393
394 @media only screen and (max-width: 480px){
395 /* /\/\/\/\/\/\/ CLIENT-SPECIFIC MOBILE STYLES /\/\/\/\/\/\/ */
396 body, table, td, p, a, li, blockquote{-webkit-text-size-adjust:none !important;} /* Prevent Webkit platforms from changing default text sizes */
397 body{width:100% !important; min-width:100% !important;} /* Prevent iOS Mail from adding padding to the body */
398
399 /* /\/\/\/\/\/\/ MOBILE RESET STYLES /\/\/\/\/\/\/ */
400 #bodyCell{padding:10px !important;}
401
402 /* /\/\/\/\/\/\/ MOBILE TEMPLATE STYLES /\/\/\/\/\/\/ */
403
404 /* ======== Page Styles ======== */
405
406 /**
407 * @tab Mobile Styles
408 * @section template width
409 * @tip Make the template fluid for portrait or landscape view adaptability. If a fluid layout doesn't work for you, set the width to 300px instead.
410 */
411 #templateContainer{
412 max-width:600px !important;
413 /*@editable*/ width:100% !important;
414 }
415
416 /**
417 * @tab Mobile Styles
418 * @section heading 1
419 * @tip Make the first-level headings larger in size for better readability on small screens.
420 */
421 h1{
422 /*@editable*/ font-size:24px !important;
423 /*@editable*/ line-height:100% !important;
424 }
425
426 /**
427 * @tab Mobile Styles
428 * @section heading 2
429 * @tip Make the second-level headings larger in size for better readability on small screens.
430 */
431 h2{
432 /*@editable*/ font-size:20px !important;
433 /*@editable*/ line-height:100% !important;
434 }
435
436 /**
437 * @tab Mobile Styles
438 * @section heading 3
439 * @tip Make the third-level headings larger in size for better readability on small screens.
440 */
441 h3{
442 /*@editable*/ font-size:18px !important;
443 /*@editable*/ line-height:100% !important;
444 }
445
446 /**
447 * @tab Mobile Styles
448 * @section heading 4
449 * @tip Make the fourth-level headings larger in size for better readability on small screens.
450 */
451 h4{
452 /*@editable*/ font-size:16px !important;
453 /*@editable*/ line-height:100% !important;
454 }
455
456 /* ======== Header Styles ======== */
457
458 #templatePreheader{display:none !important;} /* Hide the template preheader to save space */
459
460 /**
461 * @tab Mobile Styles
462 * @section header image
463 * @tip Make the main header image fluid for portrait or landscape view adaptability, and set the image's original width as the max-width. If a fluid setting doesn't work, set the image width to half its original size instead.
464 */
465 #headerImage{
466 height:auto !important;
467 /*@editable*/ max-width:160px !important;
468 /*@editable*/ width:100% !important;
469 }
470
471 /**
472 * @tab Mobile Styles
473 * @section header text
474 * @tip Make the header content text larger in size for better readability on small screens. We recommend a font size of at least 16px.
475 */
476 .headerContent{
477 /*@editable*/ font-size:20px !important;
478 /*@editable*/ line-height:125% !important;
479 }
480
481 /* ======== Body Styles ======== */
482
483 /**
484 * @tab Mobile Styles
485 * @section body text
486 * @tip Make the body content text larger in size for better readability on small screens. We recommend a font size of at least 16px.
487 */
488 .bodyContent{
489 /*@editable*/ font-size:18px !important;
490 /*@editable*/ line-height:125% !important;
491 }
492
493 /* ======== Column Styles ======== */
494
495 .templateColumnContainer{display:block !important; width:100% !important;}
496
497 /**
498 * @tab Mobile Styles
499 * @section column image
500 * @tip Make the column image fluid for portrait or landscape view adaptability, and set the image's original width as the max-width. If a fluid setting doesn't work, set the image width to half its original size instead.
501 */
502 .columnImage{
503 height:auto !important;
504 /*@editable*/ max-width:480px !important;
505 /*@editable*/ width:100% !important;
506 }
507
508 /**
509 * @tab Mobile Styles
510 * @section left column text
511 * @tip Make the left column content text larger in size for better readability on small screens. We recommend a font size of at least 16px.
512 */
513 .leftColumnContent{
514 /*@editable*/ font-size:16px !important;
515 /*@editable*/ line-height:125% !important;
516 }
517
518 /**
519 * @tab Mobile Styles
520 * @section right column text
521 * @tip Make the right column content text larger in size for better readability on small screens. We recommend a font size of at least 16px.
522 */
523 .rightColumnContent{
524 /*@editable*/ font-size:16px !important;
525 /*@editable*/ line-height:125% !important;
526 }
527
528 /* ======== Footer Styles ======== */
529
530 /**
531 * @tab Mobile Styles
532 * @section footer text
533 * @tip Make the body content text larger in size for better readability on small screens.
534 */
535 .footerContent{
536 /*@editable*/ font-size:14px !important;
537 /*@editable*/ line-height:115% !important;
538 }
539
540 .footerContent a{display:block !important;} /* Place footer social and utility links on their own lines, for easier access */
541 }
542 </style>
543 </head>
544 <body leftmargin="0" marginwidth="0" topmargin="0" marginheight="0" offset="0">
545 <center>
546 <table align="center" border="0" cellpadding="0" cellspacing="0" height="100%" width="100%" id="bodyTable">
547 <tr>
548 <td align="center" valign="top" id="bodyCell">
549 <!-- BEGIN TEMPLATE // -->
550 <table border="0" cellpadding="0" cellspacing="0" id="templateContainer">
551 <tr id="pteaser-wrapper">
552 <td align="center" valign="top">
553 <!-- BEGIN PREHEADER // -->
554 <table border="0" cellpadding="0" cellspacing="0" width="100%" id="templatePreheader">
555 <tr>
556 <td valign="top" class="preheaderContent" style="padding-top:10px; padding-right:20px; padding-bottom:10px; padding-left:20px;" mc:edit="preheader_content00">
557 <span id="pteaser"></span>
558 </td>
559 </tr>
560 </table>
561 <!-- // END PREHEADER -->
562 </td>
563 </tr>
564 <tr id="logo-wrapper">
565 <td align="center" valign="top">
566 <!-- BEGIN HEADER // -->
567 <table border="0" cellpadding="0" cellspacing="0" width="100%" id="templateHeader">
568 <tr>
569 <td valign="top" class="headerContent">
570 <img id="logo" src="" style="max-width:160px;" id="headerImage" mc:label="header_image" mc:edit="header_image" mc:allowdesigner mc:allowtext />
571 </td>
572 </tr>
573 </table>
574 <!-- // END HEADER -->
575 </td>
576 </tr>
577 <tr>
578 <td align="center" valign="top">
579 <!-- BEGIN BODY // -->
580 <table border="0" cellpadding="0" cellspacing="0" width="100%" id="templateBody">
581 <tr>
582 <td valign="top" class="bodyContent" mc:edit="body_content">
583 <h1 id="ptitle-wrapper"><span class="ptitle"></span></h1>
584 <h3 id="psubtitle-wrapper"><span id="psubtitle"></span></h3>
585 <span id="pbody"></span>
586 </td>
587 </tr>
588 </table>
589 <!-- // END BODY -->
590 </td>
591 </tr>
592 <tr>
593 <td align="center" valign="top">
594 <!-- BEGIN COLUMNS // -->
595 <table border="0" cellpadding="0" cellspacing="0" width="100%" id="templateColumns">
596 <tr mc:repeatable>
597 <td align="center" valign="top" class="templateColumnContainer" style="padding-top:20px;">
598 <table border="0" cellpadding="20" cellspacing="0" width="100%">
599 <tr id="pleftcolumn"></tr>
600 </table>
601 </td>
602 <td align="center" valign="top" class="templateColumnContainer" style="padding-top:20px;">
603 <table border="0" cellpadding="20" cellspacing="0" width="100%">
604 <tr id="prightcolumn"></tr>
605 </table>
606 </td>
607 </tr>
608 </table>
609 <!-- // END COLUMNS -->
610 </td>
611 </tr>
612 <tr>
613 <td align="center" valign="top">
614 <!-- BEGIN FOOTER // -->
615 <table border="0" cellpadding="0" cellspacing="0" width="100%" id="templateFooter">
616 <tr>
617 <td valign="top" class="footerContent" mc:edit="footer_content00">
618 <a id="twitter-link" href="#">Follow on Twitter</a> <a id="facebook-link" href="#">Friend on Facebook</a> <a id="gplus-link" href="#">+1 on Google Plus</a>
619 </td>
620 </tr>
621 <tr>
622 <td valign="top" class="footerContent" style="padding-top:0;" mc:edit="footer_content01">
623 <em>Copyright © 2014 PYC, inc., All rights reserved.</em>
624 </td>
625 </tr>
626 </table>
627 <!-- // END FOOTER -->
628 </td>
629 </tr>
630 </table>
631 <!-- // END TEMPLATE -->
632 </td>
633 </tr>
634 </table>
635 </center>
636 </body>
637 </html>