MINI

C:/siak/TOOL SIAK/siak73/app/Siak/application/views/register_online/SendMail/
files >> C:/siak/TOOL SIAK/siak73/app/Siak/application/views/register_online/SendMail/doRespondPelaporan.php
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
		<meta name="viewport" content="width=device-width" />
		<title><?php echo $title;?></title>
		<style type="text/css">
			/* -------------------------------------
					GLOBAL RESETS
			------------------------------------- */
			img {
				border: none;
				-ms-interpolation-mode: bicubic;
				max-width: 100%; }

			body {
				background-color: #f6f6f6;
				font-family: sans-serif;
				-webkit-font-smoothing: antialiased;
				font-size: 15px;
				line-height: 1.4;
				margin: 0;
				padding: 0; 
				-ms-text-size-adjust: 100%;
				-webkit-text-size-adjust: 100%; }

			table {
				border-collapse: separate;
				mso-table-lspace: 0pt;
				mso-table-rspace: 0pt;
				width: 100%; }
				table td {
					font-family: sans-serif;
					font-size: 15px;
					vertical-align: top; }

			/* -------------------------------------
					BODY & CONTAINER
			------------------------------------- */

			.body {
				background-color: #f6f6f6;
				width: 100%; }

			/* 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;
				margin: 0 auto !important;
				/* makes it centered */
				max-width: 800px;
				width: 800px!important;
				padding: 8px;
				width: auto !important;
			}

			/* This should also be a block element, so that it will fill 100% of the .container */
			.content {
				box-sizing: border-box;
				display: block;
				margin: 0 auto;
				max-width: 610px;
				width: 610px!important;
				padding: 10px; }

			/* -------------------------------------
					HEADER, FOOTER, MAIN
			------------------------------------- */
			.main {
				background: #fff;
				border-radius: 3px;
				width: 100%; }

			.wrapper {
				box-sizing: border-box;
				padding: 20px; }

			.footer {
				clear: both;
				padding-top: 10px;
				text-align: center;
				width: 100%; }
				.footer td,
				.footer p,
				.footer span,
				.footer a {
					color: #999999;
					font-size: 12px;
					text-align: center; }

			/* -------------------------------------
					TYPOGRAPHY
			------------------------------------- */
			h1,
			h2,
			h3,
			h4 {
				color: #000000;
				font-family: sans-serif;
				font-weight: 400;
				margin: 0;
			}

			h1 {
				font-size: 35px;
				font-weight: 300;
				text-align: center;
				text-transform: capitalize; }

			p,
			ul,
			ol {
				font-family: sans-serif;
				font-size: 15px;
				font-weight: normal;
				margin: 0;
				margin-bottom: 15px; }
				p li,
				ul li,
				ol li {
					list-style-position: inside;
					margin-left: 5px; }

			a {
				color: #3498db;
				text-decoration: underline; }

			/* -------------------------------------
					BUTTONS
			------------------------------------- */
			.btn {
				box-sizing: border-box;
				width: 100%; }
				.btn > tbody > tr > td {
					padding-bottom: 15px; }
				.btn table {
					width: auto; }
				.btn table td {
					background-color: #ffffff;
					border-radius: 5px;
					text-align: center; }
				.btn a {
					background-color: #ffffff;
					border: solid 1px #3498db;
					border-radius: 5px;
					box-sizing: border-box;
					color: #3498db;
					cursor: pointer;
					display: inline-block;
					font-size: 15px;
					font-weight: bold;
					margin: 0;
					padding: 12px 25px;
					text-decoration: none;
					text-transform: capitalize; }

			.btn-primary table td {
				background-color: #3498db; }

			.btn-primary a {
				background-color: #3498db;
				border-color: #3498db;
				color: #ffffff; }

			/* -------------------------------------
					OTHER STYLES THAT MIGHT BE USEFUL
			------------------------------------- */
			.last {
				margin-bottom: 0; }

			.first {
				margin-top: 0; }

			.align-center {
				text-align: center; }

			.align-right {
				text-align: right; }

			.align-left {
				text-align: left; }

			.clear {
				clear: both; }

			.mt0 {
				margin-top: 0; }

			.mb0 {
				margin-bottom: 0; }

			.preheader {
				color: transparent;
				display: none;
				height: 0;
				max-height: 0;
				max-width: 0;
				opacity: 0;
				overflow: hidden;
				mso-hide: all;
				visibility: hidden;
				width: 0; }

			.powered-by a {
				text-decoration: none; }

			hr {
				border: 0;
				border-bottom: 1px solid #f6f6f6;
				margin: 20px 0; }

			/* -------------------------------------
					RESPONSIVE AND MOBILE FRIENDLY STYLES
			------------------------------------- */
			@media only screen and (max-width: 620px) {
				table[class=body] h1 {
					font-size: 28px !important;
					margin-bottom: 10px !important; }
				table[class=body] p,
				table[class=body] ul,
				table[class=body] ol,
				table[class=body] td,
				table[class=body] span,
				table[class=body] a {
					font-size: 16px !important; }
				table[class=body] .wrapper,
				table[class=body] .article {
					padding: 10px !important; }
				table[class=body] .content {
					padding: 0 !important; }
				table[class=body] .container {
					padding: 0 !important;
					width: 100% !important; }
				table[class=body] .main {
					border-left-width: 0 !important;
					border-radius: 0 !important;
					border-right-width: 0 !important; }
				table[class=body] .btn table {
					width: 100% !important; }
				table[class=body] .btn a {
					width: 100% !important; }
				table[class=body] .img-responsive {
					height: auto !important;
					max-width: 100% !important;
					width: auto !important; }}

			/* -------------------------------------
					PRESERVE THESE STYLES IN THE HEAD
			------------------------------------- */
			@media all {
				.ExternalClass {
					width: 100%; }
				.ExternalClass,
				.ExternalClass p,
				.ExternalClass span,
				.ExternalClass font,
				.ExternalClass td,
				.ExternalClass div {
					line-height: 100%; }
				.apple-link a {
					color: inherit !important;
					font-family: inherit !important;
					font-size: inherit !important;
					font-weight: inherit !important;
					line-height: inherit !important;
					text-decoration: none !important; } 
				.btn-primary table td:hover {
					background-color: #34495e !important; }
				.btn-primary a:hover {
					background-color: #34495e !important;
					border-color: #34495e !important; }
				.logo{
					width: 55px!important;
					height: 57px!important;
					margin-top: 1px;
				}
				.line-height0{
					line-height: 0;
				}
				.padding-top-10{
					padding-top: 10px;
				}
				.center{
					text-align: center;
				}
				.left{
					text-align: left;
				}
				.right{
					text-align: right;
				}
				.dashline{
					border-top:1px solid #555555 !important;
					border-right:none!important;
					border-bottom:3px solid #555555 !important;
					border-left:none!important;
					height: 2px!important;
				}
				.indent-paragraf{
					text-indent: 34px;
				}
				.justify{
					text-align: justify;
				}
				.grey-cascade{
					color: #555555 !important;
				}
				.no-space{
					padding: 0;
					margin: 0;
				}
				.tautan{
					color: #95A5A6;
					font-size: 13px;
					text-decoration: none;
					font-style: italic;
				}
				.penting{
					color: #e35b5a;
					text-decoration: none;
					font-weight: bold;
				}
			}
		</style>
	</head>
	<body class="">
		<table border="0" cellpadding="0" cellspacing="0" class="body">
			<tr>
				<td>&nbsp;</td>
				<td class="container">
					<!-- START CENTERED WHITE CONTAINER -->
					<div class="content">
						<table class="main">
							<!-- START MAIN CONTENT AREA -->
							<tr>
								<td class="wrapper">
									<table border="0" cellpadding="0" cellspacing="0">
										<tr>
											<td width="13%" rowspan="3">
												<img src="http://siakcapil.tangerangselatankota.go.id:80/assets/disduk/3674/img_logo.png" class="logo" width="55" height="55" />
												<!-- <img src="http://drive.google.com/uc?export=view&id=0B66cbWUxkwo6MWtNZzFqUXlRSGM" class="logo" width="55" height="55" /> -->
												<!-- <img src="http://localhost:80/capil_online/assets/disduk/3674/img_logo.png" class="logo" /> -->
											</td>
											<td width="87%" class="left" colspan="2">
												<h3 class="grey-cascade"><?php echo strtoupper($kantor1);?></h3>
											</td>
										</tr>
										<tr>
											<td colspan="2">
												<h5 class="no-space grey-cascade"><?php echo strtoupper($kantor2);?></h5>
											</td>
										</tr>
										<tr><td colspan="2">&nbsp;</td></tr>
										<tr>
											<td colspan="3" class="dashline"></td>
										</tr>
									</table>
								</td>
							</tr>
							<tr>
								<td id="pendaftaran" class="wrapper">
									<table border="0" cellpadding="0" cellspacing="0">
										<tr>
											<td colspan="3">
												<h4 class="grey-cascade">Yang terhormat, <br/><?php echo $recipient;?></h4><br/>
											</td>
										</tr>
										<tr>
											<td colspan="3">
												<p class="indent-paragraf justify grey-cascade">
													Anda telah berhasil melakukan pendaftaran <?php echo $perihal;?> pada website Sistem Pendaftaran Online Terintegrasi Dinas Kependudukan dan Pencatatan Sipil <?php echo $wilayah;?>. Silahkan mendatangi Kantor Dinas Kependudukan dan Pencatatan Sipil pada tanggal yang sudah ditentukan (<?php echo $kunjungan;?>) untuk memproses permohonan anda, dengan membawa materai Rp.6000,-
												</p>
											</td>
										</tr>
										<?php
											if($dokumen != ""):
												$variable =explode(';', $dokumen);
										?>
										<tr>
											<td colspan="3" align="left">
												<p class="justify grey-cascade">membawa dokumen persyaratan diantaranya sebagai berikut:</p>
												<ol class="grey-cascade">
													<?php
															foreach($variable as $no => $desc):
													?>
													<li><?php echo $desc;?></li>
													<?php
															endforeach;
													?>
												</ol>
											</td>
										</tr>
										<?php
											endif;
										?>
										<tr>
											<td colspan="3">
												<p class="justify grey-cascade">Dan, harap anda menunjukan <span class="penting">tiket antrian</span> yang kami sertakan di-dalam email ini.</p>
											</td>
										</tr>
										<tr>
											<td colspan="3">
												<p class="justify grey-cascade">Terima kasih</p>
											</td>
										</tr>
									</table>
								</td>
							</tr>
							<!-- END MAIN CONTENT AREA -->
						</table>

						<!-- START FOOTER -->
						<div class="footer">
							<table border="0" cellpadding="0" cellspacing="0">
								<tr>
									<td class="content-block">
										<span class="apple-link"><?php echo $kantor_alamat1;?></span>
										<br /><?php echo $kantor_alamat2;?>
										<br /><?php echo $kantor_alamat3;?>
										<br />Telp. <?php echo $kantor_telp;?>
									</td>
								</tr>
								<tr>
									<td class="content-block powered-by">
										<a href="#">Sistem Pendaftaran Online Terintegrasi</a> @ <?php echo date('Y');?>
									</td>
								</tr>
							</table>
						</div>
						<!-- END FOOTER -->
					<!-- END CENTERED WHITE CONTAINER -->
					</div>
				</td>
				<td>&nbsp;</td>
			</tr>
		</table>
	</body>
</html>