<!DOCTYPE html>
<html lang="zh-TW">
<head>
	<meta charset="utf-8">
	<title>銘泉休閒農場</title>
	<style>
		
			@import url(http://fonts.googleapis.com/css?family=Julius+Sans+One|Libre+Baskerville:400,400italic);

			/* base CSS */
			*{ font-family: Microsoft JhengHei,'標楷體';}
			* {
			  -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
			  -moz-box-sizing: border-box;    /* Firefox, other Gecko */
			  box-sizing: border-box;         /* Opera/IE 8+ */
			}

			html, body {
			  padding: 0;
			  margin: 0;
			}
			body {
			  color: #325050;
			  background: #fff;
			  font-family: Microsoft JhengHei,'標楷體';
			  font-size: 70%;
			}
			h5{font-family: Microsoft JhengHei,'標楷體';
			  font-size: 1.8em;
			  text-transform: uppercase;}
			a {
			  color: #0d8ba1;
			  -webkit-transition: all 0.25s ease-out;
			  -moz-transition: all 0.25s ease-out;
			  transition: all 0.25s ease-out;
			  text-decoration: none;
			}
			  a:visited {
				color: #1a5952;
			  }
			  a:hover, a:focus {
				color: #0599c2;
				text-decoration: underline;
			  }
			abbr {
			  border: none;
			  text-transform: uppercase;
			  font-size: 0.9em;
			}
			header {
			  height: 230px;
			  padding: 20px 0 70px 0;
			  background: #7a4a0f 0% 0 url('/userUpload/images/p401.jpg') no-repeat;

			  background-attachment: fixed, fixed, fixed, scroll;
			  background-image: url(('/userUpload/images/%E9%8A%98%E6%B3%89%E8%BE%B2%E5%A0%B4_DM_2017%E6%96%B0%E7%89%88_09%20(1).jpg')), url(noise.png), url(gridlines.png), url(huntington.jpg);
			  background-position: 0 0, 0 0, -5px -25px, 0 50%;
			  background-repeat: repeat, repeat, repeat, no-repeat;
			  background-size: auto, auto, auto, cover;
			  text-align: center;
			}


			h1, h2 {
			  padding: 0 10%;
			  margin: 0;
			  color: #fff;
			  font-weight: normal;
			}
			h1 {
			  padding-top: 0;
			  padding-bottom: 5px;
			  border-bottom: none;
			  font-family: Microsoft JhengHei,'標楷體';
			  font-size: 3.2em;
			  text-transform: uppercase;
			}
			h1::before {
			  display: inline-block;
			  position: relative;
			  top: 20px;
			  content:"";
			  width: 80px;
			  height: 80px;
			  margin: -20px 20px 0 0;
			  background: url(enso.svg);
			  background-repeat: no-repeat;
			  background-size: 100%;
			  opacity: 0.6;
			}
			h2 {
			  display: block;
			  padding-top: 5px;
			  padding-bottom: 30px;
			  border-top: none;
			  color: rgba(255,255,255,0.6);
			  font-size: 1.6em;
			  font-style: italic;
			}
			h2::before {
			  content: " ";
			  padding: 50px;
			}
			h3 {
			  margin: 2em 0 0 0;
			  color: #2e484c;
			  font-family: Microsoft JhengHei,'標楷體';
			  font-size: 1.8em;
			  font-weight: normal;
			  text-transform: uppercase;
			}
			h4 {
			  margin: 2em 0 0 0;
			  color: #2e484c;
			  font-family: Microsoft JhengHei,'標楷體';
			  font-size: 1.6em;
			  font-weight: normal;
			  text-transform: uppercase;}
			p {
			  margin: 0.95em 0;
			  line-height: 2;
			}
			p::before {
				content: ' ';
				clear: right;
				display: block;
			
			}
			p1{margin: 1.2em 0;
			  line-height: 2;}

			.page-wrapper {
			  position: relative;
			}
			.summary, .preamble {
			  width: 80%;
			  margin: 0 auto;
			}
			.supporting h3, .supporting p {
			  width: 80%;
			  margin-left: auto;
			  margin-right: auto;
			}

			.summary {
			  padding-top: 2em;
			}


			/* intro block links -- download HTML/CSS */
			.intro a, .intro a:visited {
			  position: relative;
			  display: inline-block;
			  padding: 1px 10px 1px 32px;
			  margin: -1px -10px -1px -6px;
			  -webkit-border-radius: 1px;
			  -moz-border-radius: 1px;
			  border-radius: 1px;

			  color: #809b7e;
			  font-family: Microsoft JhengHei,'標楷體';
			  text-transform: uppercase;
			}
			.intro a:hover, .intro a:focus {
			  z-index: 2;
			  color: #fff;
			  background: #3d8a9f;
			  text-decoration: none;
			}

			.intro a::before {
			  display: inline-block;
			  position: absolute;
			  top: 6px;
			  left: 8px;
			  padding: 2px;
			  color: #a9b995;
			  background: #d9e1cd;
			  -webkit-border-radius: 2px;
			  -moz-border-radius: 2px;
			  -o-border-radius: 2px;

			  content: "D";
			  font-size: 16px;
			  text-indent: 0;


			  /* icomoon.io defaults */
			  font-family: Microsoft JhengHei,'標楷體';
			  speak: none;
			  font-weight: normal;
			  font-variant: normal;
			  text-transform: none;
			  line-height: 1;
			  -webkit-font-smoothing: antialiased;

			  -webkit-transition: all 0.25s ease-out;
			  -moz-transition: all 0.25s ease-out;
			  transition: all 0.25s ease-out;
			}
			  .intro a:hover::before {
				color: #fff;
				background: #357d93;
			  }


			/* coloured cutoff */
			div.participation, div.benefits {
			  background-attachment: scroll, scroll, fixed;
			  background-color: rgba(138,188,159,0.5);
			  background-image: url(contours-opaque.png), url(gridlines-opaque.png), url(bamboo.png);
			  background-repeat: repeat, repeat, no-repeat;
			  background-size: auto, auto, cover;
			}
			/* extra padding at the cutoffs */
			div.participation {
			  padding: 3em 0;
			  margin-top: 3em;
			}
			div.benefits {
			  padding-bottom: 3em;
			  margin-bottom: 3em;
			}
			div.participation h3, div.benefits h3 {
			  margin-top: 0;
			}
			div.participation p, div.benefits p {
			  margin-bottom: 0;
			}


			/* sidebar base styles */
			.sidebar {
			  background: #edf4f0;
			}
			.sidebar h3 {
			  display: none;
			}
			.sidebar a {
			  color: #607476;
			  text-decoration: none;
			}
			  .sidebar a:hover, .sidebar a:focus {
				color: #49968e;
			  }
			.sidebar ul {
			  padding: 0;
			  margin: 0;
			  list-style: none;
			  overflow: hidden;
			}


			/* shared sidebar styling */
			.design-selection ul, .zen-resources ul {
			  margin: 0;
			}
			.design-selection li, .zen-resources li {
			  float: left;
			  width: 50%;
			  padding: 1.5em 10%;
			  border-top: solid 1px #d9e3dc;
			  color: #c0cac3;
			  font-style: italic;
			}
			  .design-selection li:hover, .design-selection li:focus {
				background: -moz-linear-gradient(left,  rgba(255,255,255,0) 0%, rgba(255,255,255,0.5) 50%, rgba(255,255,255,0) 100%); /* FF3.6+ */
				background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,0)), color-stop(50%,rgba(255,255,255,0.5)), color-stop(100%,rgba(255,255,255,0))); /* Chrome,Safari4+ */
				background: -webkit-linear-gradient(left,  rgba(255,255,255,0) 0%, rgba(255,255,255,0.5) 50%, rgba(255,255,255,0) 100%); /* Chrome10+,Safari5.1+ */
				background: -o-linear-gradient(left,  rgba(255,255,255,0) 0%, rgba(255,255,255,0.5) 50%, rgba(255,255,255,0) 100%); /* Opera 11.10+ */
				background: -ms-linear-gradient(left,  rgba(255,255,255,0) 0%, rgba(255,255,255,0.5) 50%, rgba(255,255,255,0) 100%); /* IE10+ */
				background: linear-gradient(to right,  rgba(255,255,255,0) 0%, rgba(255,255,255,0.5) 50%, rgba(255,255,255,0) 100%); /* W3C */
			  }
			.design-selection li:nth-child(2n+1), .zen-resources li:nth-child(2n+1) {
			  clear: left;
			}
			.design-selection .design-name, .zen-resources a, li.viewall a {
			  display: block;
			  margin-bottom: 0.25em;
			  font-family: Microsoft JhengHei,'標楷體';
			  font-size: 1.2em;
			  font-style: normal;
			  text-transform: uppercase;
			}


			/* select a design */
			.design-selection h3 {
			  display: none;
			}
			.design-selection .designer-name {
			  color: #616857;
			  font-size: 0.9em;
			  font-style: normal;
			}



			/* archives navigation */
			.design-archives {
			  position: absolute;
			  top: 160px;
			  right: 0;
			  width: 100%;
			  height: 70px;
			  background: rgba(255,255,255,0.2);
			}
			.design-archives h3 {
			  display: none;
			}
			.design-archives ul {
			  margin: 0;
			}
			.design-archives li {
			  position: absolute;
			  top: 0;
			  padding: 0;
			  margin: 0;
			  border: none;
			  list-style: none;
			}
			.design-archives li.viewall {
			  top: 0;
			  left: 0;
			  width: 100%;
			  padding: 0 71px;
			  line-height: 50px;
			}
			.previous, .next {
			  left: 0;
			  z-index: 3;
			}
			.next {
			  left: auto;
			  right: 0;
			}
			.design-archives a, .design-archives a:visited {
			  color: rgba(255, 255, 255, 0.65);
			}
			.design-archives a:hover, .design-archives a:focus {
			  color: #fff;
			}
			.design-archives .previous a, .design-archives .next a {
			  display: block;
			  overflow: hidden;
			  width: 70px;
			  height: 70px;
			  text-indent: 100%;
			  text-decoration: none;
			  white-space: nowrap;
			}
			.design-archives .viewall a {
			  z-index: 2;
			  width: 100%;
			  min-height: 70px;
			  padding: 12px 0 0 0;
			  text-align: center;
			}
			.design-archives a::before {
			  position: absolute;
			  left: 0;
			  width: 70px;
			  height: 70px;
			  text-align: center;
			  text-indent: 0;
			  font-size: 44px;

			  /* icomoon.io defaults */
			  font-family: Microsoft JhengHei,'標楷體';
			  speak: none;
			  font-weight: normal;
			  font-variant: normal;
			  text-transform: none;
			  line-height: 70px;
			  -webkit-font-smoothing: antialiased;
			}
			.design-archives .viewall a:hover, .design-archives .viewall a:focus, .design-archives .viewall a:active,
			.design-archives a:hover::before, .design-archives a:focus::before, .design-archives a:active::before {
			  background-color: rgba(255,255,255,0.25);
			  box-shadow: inset 0 0 10px rgba(255,255,255,0.1);
			}
			.design-archives .previous a::before {
			  content: "<";
			}
			.design-archives .next a::before {
			  content: ">";
			}



			/* resources */
			.zen-resources {
			  overflow: hidden;
			  background-color: rgba(138,188,159,0.5);
			  background-image: url(bamboo.png);
			}
			.zen-resources li {
			  border-top: solid 1px #a0b9ad;
			  font-style: normal;
			}
			.zen-resources li:last-child {
			  float: none;
			  width: auto;
			  border-bottom: solid 1px #a0b9ad;
			}


			/* busting out the credits block */
			.requirements p:nth-child(5) {
			  padding-bottom: 2em;
			}
			.supporting .requirements {
			  float: none;
			  clear: both;
			  width: 100%;
			  padding-left: 0;
			  padding-right: 0;
			}
			.supporting .requirements a {
			  text-decoration: none;
			}
			  .supporting .requirements a:hover, .supporting .requirements a:focus {
				text-decoration: underline;
			  }
			.supporting .requirements h3 {
			  padding-top: 0;
			}
			.requirements p:last-child {
			  width: auto;
			  padding: 1em 12%;
			  margin: 0;
			  color: rgba(255, 255, 255, 0.4);
			  background: #3e5d67;

			  background-attachment: fixed, fixed, fixed, scroll;
			  background-image: url(contours.png), url(gridlines.png), url(noise.png), url(koi.jpg);
			  background-position: 0 0, -5px -25px, 0 0, 0 50%;
			  background-repeat: repeat, repeat, repeat, no-repeat;
			  background-size: auto, auto, auto, cover;

			  font-size: 2em;
			  font-style: italic;
			  text-align: center;
			}
			.requirements p:last-child a {
			  color: rgba(255, 255, 255, 0.7);
			  font-style: normal;
			}



			/* main footer */
			footer {
			  clear: both;
			  padding: 3em 10%;
			  color: #fff;
			  background: #134347;
			  text-align: center;
			}
			footer a {
			  display: inline-block;
			  overflow: hidden;
			  width: 40px;
			  height: 40px;
			  padding: 40px 0 0 0;
			  margin: 0 0.5em;
			  position: relative;
			  color: rgba(255, 255, 255, 0.5);
			  -webkit-transition: color 0.25s ease-out, box-shadow 0.25s ease-out;
			  -moz-transition: color 0.25s ease-out, box-shadow 0.25s ease-out;
			  transition: color 0.25s ease-out, box-shadow 0.25s ease-out;
			}
			footer a:hover, footer a:focus {
			  color: rgba(255, 255, 255, 0.3);
			  text-decoration: none;
			}
			footer a:visited {
			  color: rgba(255, 255, 255, 0.2);
			}
			footer a::before {
			  display: block;
			  position: absolute;
			  top: 3px;
			  left: 0;
			  overflow: visible;
			  font-size: 36px;
			  text-indent: 0;

			  /* icomoon.io defaults */
			  font-family: Microsoft JhengHei,'標楷體';
			  speak: none;
			  font-weight: normal;
			  font-variant: normal;
			  text-transform: none;
			  line-height: 1;
			  -webkit-font-smoothing: antialiased;
			}
			  footer a.zen-validate-html::before {content: "1";}
			  footer a.zen-validate-html:hover::before, footer a.zen-validate-html:focus::before {content: "11";}
			  footer a.zen-validate-css::before {content: "2";}
			  footer a.zen-validate-css:hover::before, footer a.zen-validate-css:focus::before {content: "22";}
			  footer a.zen-license::before {content: "3";}
			  footer a.zen-license:hover::before, footer a.zen-license:focus::before {content: "33";}
			  footer a.zen-accessibility::before {content: "a";}
			  footer a.zen-accessibility:hover::before, footer a.zen-accessibility:focus::before {content: "A";}
			  footer a.zen-github::before {content: "g";}
			  footer a.zen-github:hover::before, footer a.zen-github:focus::before {content: "G";}

			/*文末到訪人數*/     
			.total-comments-div .trackback-url { 
			BACKGROUND: url(http://counter.nsysu.edu.tw/Count.cgi?dd=16) no-repeat right bottom 
			}  

			/* low-res CSS *--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------/
			@media only screen and (max-width: 600px) {

			  /* these download links make approximately zero sense
				 on a phone without a user-accessible file system. */
			  .summary p:last-child {
				display: none;
			  }

			  /* type adjustments */
			  h1 {
				margin-top: 30px;
				font-size: 2.5em;
			  }
			  h1::before {
				width: 50px;
				height: 50px;
			  }
			  h2::before {
				padding: 25px;
			  }

			  .requirements p:last-child {
				padding: 1em 6%;
			  }

			}


			@media only screen and (max-width: 500px) {

			  header {
				height: 250px;
				padding-top: 0;
			  }
			  h1 {
				margin: 0;
			  }
			  h1::before {
				display: block;
				left: 50%;
				width: 50px;
				height: 50px;
				margin: 0 0 0 -25px;
				padding: 0 0 35px 0;
			  }
			  h2::before {
				padding: 0;
			  }

			  .design-archives {
				top: 180px;
			  }
			  .design-selection li, .zen-resources li {
				padding: 1em 5%;
			  }

			  footer a {
				margin: 0 0.5em;
			  }

			}

			@media only screen and (max-width: 320px) {

				/* adjusting the site header type size */
				h1 {
					font-size: 2em;
				}
				h2 {
					font-size: 1.3em;
				}

				/* linearizing the design list on small screens */
				.design-selection li, .zen-resources li {
					float: none;
					width: 100%;
				}

				/* adjusting footer type, icons */
				.requirements p:last-child {
					font-size: 1.4em;
				}
				footer {
					padding: 2em 5%;
				}
				footer a {
					width: 35px;
					height: 35px;
					padding: 35px 0 0 0;
					margin: 0 0.5em;
				}
				footer a::before {
					font-size: 32px;
				}

			}


			/* mid-res CSS */
			@media only screen and (max-width: 1132px) {
			  header {
				border-top: solid 10px rgba(19, 67, 71, 0.9);
			  }
			  p, li {
				font-size: 1.2em;
			  }
			}

			@media only screen and (min-width: 500px) and (max-width: 1150px) {

			  .requirements p:last-child {
				padding-bottom: 2em;
				padding-top: 2em;
			  }

			  /* page footer */
			  footer {
				padding: 3em 0;
			  }
			  footer a {
				width: 52px;
				height: 52px;
				padding: 52px 0 0 0;
				margin: 0 2em;
			  }
			  footer a::before {
				font-size: 48px;
			  }
			}


			/* high-res CSS */
			@media only screen and (min-width: 1132px) {
			  body {
				background: #ffffff;
				background: -moz-linear-gradient(left,  #ffffff 0%, #ffffff 66%, #e5ede8 66%, #e5ede8 100%);
				background: -webkit-gradient(linear, left top, right top, color-stop(0%,#ffffff), color-stop(66%,#ffffff), color-stop(66%,#e5ede8), color-stop(100%,#e5ede8));
				background: -webkit-linear-gradient(left,  #ffffff 0%,#ffffff 66%,#e5ede8 66%,#e5ede8 100%);
				background: -o-linear-gradient(left,  #ffffff 0%,#ffffff 66%,#e5ede8 66%,#e5ede8 100%);
				background: -ms-linear-gradient(left,  #ffffff 0%,#ffffff 66%,#e5ede8 66%,#e5ede8 100%);
				background: linear-gradient(to right,  #ffffff 0%,#ffffff 66%,#e5ede8 66%,#e5ede8 100%);
				font-size: 100%;
			  }
			  header {
				width: 100%;
				height: 310px;
				padding: 0 10%;
				border-top: solid 12px rgba(19, 67, 71, 0.8);
				box-shadow: inset 0 0 100px rgba(255, 255, 255, 0.3);
				vertical-align: middle;
				text-align: left;
			  }

			  header::before, header::after {
				display: block;
				content: " ";
				position: absolute;
				z-index: 3;
				top: 9px;
				left: 0;
				width: 100%;
				height: 7px;
				background: rgba(0, 39, 43, 0.2);
			  }
			  header::after {
				top: 306px;
				height: 4px;
				background: rgba(0, 39, 43, 0.075);
			  }
			  h1 {
				display: inline-block;
				position: relative;
				margin: 15px 0 0 0;
				padding: 60px 0 5px 0;
			  }
			  h1::before {
				display: inline-block;
				position: relative;
				top: 65px;
				content:  "";
				width: 125px;
				height: 125px;
				margin: -65px 40px 0 0;
				background: url(enso.svg);
				background-size: 100%;
				opacity: 0.6;

				-webkit-animation: koan 36000s infinite alternate;
				-moz-animation: koan 36000s infinite alternate;
				animation: koan 36000s infinite alternate;
			  }
			  h2 {
				display: block;
				margin: 0;
				padding: 5px 0 60px 70px;
			  }
			  p {
				font-size: 1em;
			  }

			  /* main layout blocks */
			  nav, .supporting {
				display: inline;
			  }
			  .summary, .preamble, .supporting div, .requirements h3, .requirements p {
				float: left;
				clear: left;
				width: 66%;
				padding: 1em 5% 1em 10%;
			  }
			  .explanation h3, .explanation p,
			  .participation h3, .participation p,
			  .benefits h3, .benefits p {
				width: 100%;
			  }
			  .summary {
				padding-top: 3.25em;
			  }
			  .requirements h3, .requirements p {
				margin: 0;
				padding-bottom: 0;
			  }


			  /* coloured cutoff */
			  div.participation, div.benefits {
				width: 100%;
				padding-left: 10%;
				padding-right: 38%;
				margin: 0;
			  }
			  /* extra padding at the cutoffs */
			  div.participation, div.requirements {
				padding-top: 4em;
			  }
			  div.explanation, div.benefits {
				padding-bottom: 4em;
			  }
			  .requirements p:nth-child(5) {
				padding-bottom: 4em;
			  }


			  .intro h3, .supporting h3 {
				margin-top: 0;
			  }
			  .intro p:last-child, .supporting p:last-child {
				margin-bottom: 0;
			  }


			  .requirements p:last-child {
				padding-bottom: 3em;
				padding-top: 3em;
				box-shadow: inset 0 0 100px rgba(255, 255, 255, 0.3);
			  }


			  /* sidebar styling */
			  .design-selection, .zen-resources {
				position: absolute;
				top: 360px;
				right: 0;
				width: 33.3%;
				padding: 0 0 20px 0;
				margin: 0;
				overflow: visible;
				background: transparent;
			  }
			  .sidebar li {
				float: none;
				width: auto;
				padding-left: 0;
				padding-right: 0;
				margin: 0 29.4% 0 14.7%; /* 0 10% 0 5% of total width */
			  }


			  /* select a design */
			  .design-selection li:first-child {
				border-top: 0;
			  }
			  .design-selection li:hover, .design-selection li:focus {
				background: none;
			  }

			  /* archives navigation */
			  .design-archives {
				position: absolute;
				z-index: 2;
				top: 0;
				left: 0;
				width: 100%;
				height: 310px;

				background: -moz-linear-gradient(left,  rgba(255,255,255,0) 0%, rgba(255,255,255,0) 66%, rgba(0,0,0,0.2) 66%, rgba(33,84,95,0.3) 100%); /* FF3.6+ */
				background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,0)), color-stop(66%,rgba(255,255,255,0)), color-stop(66%,rgba(33,84,95,0.3)), color-stop(100%,rgba(33,84,95,0))); /* Chrome,Safari4+ */
				background: -webkit-linear-gradient(left,  rgba(255,255,255,0) 0%,rgba(255,255,255,0) 66%,rgba(33,84,95,0.3) 66%,rgba(33,84,95,0) 100%); /* Chrome10+,Safari5.1+ */
				background: -o-linear-gradient(left,  rgba(255,255,255,0) 0%,rgba(255,255,255,0) 66%,rgba(33,84,95,0.3) 66%,rgba(33,84,95,0) 100%); /* Opera 11.10+ */
				background: -ms-linear-gradient(left,  rgba(255,255,255,0) 0%,rgba(255,255,255,0) 66%,rgba(33,84,95,0.3) 66%,rgba(33,84,95,0) 100%); /* IE10+ */
				background: linear-gradient(to right,  rgba(255,255,255,0) 0%,rgba(255,255,255,0) 66%,rgba(33,84,95,0.3) 66%,rgba(33,84,95,0) 100%); /* W3C */
			  }
			  .design-archives nav {
				display: block;
				position: absolute;
				right: 1%;
				top: 120px;
				width: 32%;
			  }
			  .design-archives li {
				margin: 0;
			  }
			  .design-archives .viewall a, .design-archives a::before {
				background: rgba(255,255,255,0.1);
				text-decoration: none;
			  }

			  .design-archives .viewall a:hover, .design-archives a:hover::before {
				background-color: rgba(255,255,255,0.2);
			  }


			  /* resources navigation */
			  .zen-resources {
				position: absolute;
				top: 1310px;
				right: 0;
				width: 34%;
				background: transparent;
			  }
			  .zen-resources h3 {
				display: none;
			  }
			  .zen-resources ul {
				width: 55.9%;
				margin: 0 29.4% 0 14.7%;
			  }
			  .zen-resources li {
				padding: 1.5em 0 1.25em 0;
				margin: 0;
			  }

			}


			@media only screen and (min-width: 1150px) {
			  /* page footer */
			  footer a {
				width: 76px;
				height: 76px;
				padding: 76px 0 0 0;
				margin: 0 3em;
			  }
			  footer a::before {
				font-size: 72px;
			  }
			}

			/*
			  Okay, look, I feel rather awful about this. But due to source order it
			  seems like the only way to pull off the separated sidebar. Perhaps
			  flexbox is the way forward here, once the syntax settles down a bit.
			*/
			@media only screen and (min-width: 1120px) {.zen-resources {top: 1490px;}}
			@media only screen and (min-width: 1240px) {.zen-resources {top: 1460px;}}
			@media only screen and (min-width: 1260px) {.zen-resources {top: 1420px;}}
			@media only screen and (min-width: 1320px) {.zen-resources {top: 1390px;}}
			@media only screen and (min-width: 1370px) {.zen-resources {top: 1360px;}}
			@media only screen and (min-width: 1520px) {.zen-resources {top: 1330px;}}
			@media only screen and (min-width: 1812px) {.zen-resources {top: 1300px;}}
			@media only screen and (min-width: 1848px) {.zen-resources {top: 1270px;}}
			@media only screen and (min-width: 2015px) {.zen-resources {top: 1240px;}}
			@media only screen and (min-width: 2115px) {.zen-resources {top: 1210px;}}
			@media only screen and (min-width: 2400px) {/* you're kidding, right? */}


			@-webkit-keyframes koan {
				from {
				  -webkit-transform: scale(1);
				opacity: 1;
				}
				to {
				  -webkit-transform: scale(3);
				opacity: 0;
				}
			}
			@-moz-keyframes koan {
				from {
				  -moz-transform: scale(1);
				opacity: 1;
				}
				to {
				  -moz-transform: scale(3);
				opacity: 0;
				}
			}
			@keyframes koan {
				from {
				  transform: scale(1);
				opacity: 1;
				}
				to {
				  transform: scale(3);
				opacity: 0;
				}
			}

			/* high-DPI adjustments */
			@media
				(min--moz-device-pixel-ratio: 1.5),
				(-o-min-device-pixel-ratio: 3 / 2),
				(-webkit-min-device-pixel-ratio: 1.5),
				(min-device-pixel-ratio: 1.5),
				(min-resolution: 1.5dppx) {

				header {
					background-image: url(contours@2x.png), url(noise.png), url(gridlines.png), url(huntington.jpg);
					background-size: 50% auto, auto, auto, cover;
				}

				.requirements p:last-child {
					background-image: url(contours@2x.png), url(gridlines.png), url(noise.png), url(koi.jpg);
					background-size: 50% auto, auto, auto, cover;
				}

				/*
					This shouldn't be necessary, but it is. Due to differences in how
					Chrome calculates gradients and % widths / padding, the archives
					spill out of the visual container at some screen sizes.
				*/
				.design-archives nav {
					right: 3%;
					width: 29%;
				}
			}

			/* icon fonts */
			@font-face {
				Microsoft JhengHei,'標楷體';
				src:url('verdemoderna.eot');
				src:url('verdemoderna.eot?#iefix') format('embedded-opentype'),
					url('verdemoderna.woff') format('woff'),
					url('verdemoderna.ttf') format('truetype'),
					url('verdemoderna.svg#verdemoderna') format('svg');
				font-weight: normal;
				font-style: normal;
			}                                                                                                               /* 1000 lines?! */
	</style>
	
	<link rel="alternate" type="application/rss+xml" title="RSS" href="http://www.csszengarden.com/zengarden.xml">

	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta name="author" content="銘泉休閒農場">
	<meta name="description" content="一顆顆菱格紋狀的鳳梨果，在貧脊礫地迎著烈陽而生，在大地刻畫著LV的菱格標誌，銘於山林，躍於農業">
	<meta name="robots" content="all">


	<!--[if lt IE 9]>
	<script src="script/html5shiv.js"></script>
	<![endif]-->
</head>

<body id="css-zen-garden">
<div class="page-wrapper">

	<section class="intro" id="zen-intro">
		<header role="banner">
			<h1>銘泉休閒農場</h1>
			<h2>自然， 就會好轉</h2>
		</header>

		<div class="summary" id="zen-summary" role="article">
			<h3>關於銘泉
			</h3>
			<p>一顆顆菱格紋狀的鳳梨果，在貧脊礫地迎著烈陽而生，在大地刻畫著LV的菱格標誌，銘於山林，躍於農業。</p>
			<h4>菱格標誌銘於山林</h4>
			<p>銘泉聞名的鳳梨是屏東的銘果，究其血脈，源自半世紀前農場第二代掌門吳木泉的紮根，憑藉獨到的技術，奪下神農獎桂冠，靠著誠信，成為台灣首批外銷日本的鳳梨農，專業耕耘的夠深，連總統、行政院長都曾走訪，在三合院喝茶，在農場吃果。
				早在鳳梨屬於酸溜的悲情年代，吳木泉堅持不用荷爾蒙等外物，不一昧追求甜度，力保果肉原有的酸甜層次，舊時代的新思維，一度被視為傻子，他卻堅持走自己的路。
				10年、20年、30年過去，天然、原味、健康已成為不可撼動的主流，而這位大武山下的農業先驅，早已身體力行半世紀。
				第三代接班人吳堅銘除了繼承血脈的DNA，更承襲父親敬天謝地的農事態度，自小浸淫的農耕技法早已內化，除有實務經驗打底，大學專攻農業管理，讓傳統農業得以升級創新。</p>
		</div>

		<div class="preamble" id="zen-preamble" role="article">
			<h3>全面有機三生農場</h3>
			<p>92年起，銘泉農場逐漸在各田區推行有機耕種，堅守果子該有的味，一步步探索食材的原味，如今20幾公頃的農地已取得有機認證，主力供應宅配與有機體系。 堅守鳳梨本業，站穩腳步後，一如父親的遠見與先行，吳堅銘跳脫農場生產者的制約，
				將部份田區規劃成生態、生活、生命共存的休閒農場。 </p>
			<p>清澈山泉蜿蜒而生的生態池，臺北赤蛙嘰嘰鳴唱；鳳蝶在百花園中曼妙起舞；魚蝦優游在莎草裡捉迷藏… 「小時候，一抬頭就看到木瓜園裡，紅嘴黑鵯或五色鳥成群結伴啄果，萬物共存是一種生活日常」。於是，吳堅銘與妻子謝美蓮攜手找回從前，要運用大學專攻的農業管理，將銘泉打造成人與自然共存的生態秘境。</p>
		</div>
	</section>

	<div class="main supporting" id="zen-supporting" role="main">
		<div class="explanation" id="zen-explanation" role="article">
			<h3>理念、願景</h3>
			<h5>一.全面推行有機農耕，保全土地健康，實踐地產地銷、減少碳排放，達到食物里程最小化。</h5>
			<h5>二.營造共好的農業環境-“農田是食物的產地同時也是生物的棲地”，實現人與自然和諧共存。</h5>
			<h5>三.發揚傳統智慧與現代科學，循環使用自然資源。</h5>
			<h5>四.結合社區活絡在地經濟，營造慢活山林與五感農場，促進人類身心愉悅與平衡。</h5>
			
		</div>

		<div class="participation" id="zen-participation" role="article">
			<h3>一句標語：</h3>
			<h5>“自然，就會好轉”
				Nature is good for you</h5>
			<p1>到銘泉，做什麼都好，眼耳鼻口手，五感全開，一刻不得閒。到銘泉，什麼都不做更好，將酸甜苦辣鹹的走味人生，
			放空再走。銘泉生態農場，就是這麼一處讓人心隨意轉，動靜皆宜的好所在，來一趟，自然就會好轉。</p1>
		</div>

		<div class="benefits" id="zen-benefits" role="article">
			<h3></h3>
		</div>

		<div class="requirements" id="zen-requirements" role="article">
			<h3>Requirements</h3>
		<div class="row">
		<div class="col-md-3"></div>
		<div class="col-md-3">
			<img class="img-thumbnail" src="/userUpload/images/05.jpg" /></div>
		<div class="col-md-3">
			<img class="img-thumbnail" src="/userUpload/images/04.jpg" /></div>
		<div class="col-md-3">
			<img class="img-thumbnail" src="/userUpload/images/03.jpg" /></div>
	</div>
			
		</div>

		<footer>
			<a href="http://validator.w3.org/check/referer" title="Check the validity of this site&#8217;s HTML" class="zen-validate-html">HTML</a>
			<a href="http://jigsaw.w3.org/css-validator/check/referer" title="Check the validity of this site&#8217;s CSS" class="zen-validate-css">CSS</a>
			<a href="http://creativecommons.org/licenses/by-nc-sa/3.0/" title="View the Creative Commons license of this site: Attribution-NonCommercial-ShareAlike." class="zen-license">CC</a>
			<a href="http://mezzoblue.com/zengarden/faq/#aaa" title="Read about the accessibility of this site" class="zen-accessibility">A11y</a>
			<a href="https://github.com/mezzoblue/csszengarden.com" title="Fork this site on Github" class="zen-github">GH</a>
			<div class="realtimeuserscounter realtimeuserscounter--styled"></div>
			<script src="https://realtimeusers.bycontrast.co/realtimeusers.js"></script>
			
		</footer>

	</div>


	<aside class="sidebar" role="complementary">
		<div class="wrapper">

			<div class="design-selection" id="design-selection">
				<h3 class="select">Select a Design:</h3>
				<nav role="navigation">
					<ul>
					<li>
						/*<a href="/221/" class="design-name">Mid Century Modern</a> by						<a href="http://andrewlohman.com/" class="designer-name">Andrew Lohman</a>
					</li>					<li>
						<a href="/220/" class="design-name">Garments</a> by						<a href="http://danielmall.com/" class="designer-name">Dan Mall</a>
					</li>					<li>
						<a href="/219/" class="design-name">Steel</a> by						<a href="http://steffen-knoeller.de" class="designer-name">Steffen Knoeller</a>
					</li>					<li>
						<a href="/218/" class="design-name">Apothecary</a> by						<a href="http://trentwalton.com" class="designer-name">Trent Walton</a>
					</li>					<li>
						<a href="/217/" class="design-name">Screen Filler</a> by						<a href="http://elliotjaystocks.com/" class="designer-name">Elliot Jay Stocks</a>
					</li>					<li>
						<a href="/216/" class="design-name">Fountain Kiss</a> by						<a href="http://jeremycarlson.com" class="designer-name">Jeremy Carlson</a>
					</li>					<li>
						<a href="/215/" class="design-name">A Robot Named Jimmy</a> by						<a href="http://meltmedia.com/" class="designer-name">meltmedia</a>
					</li>					<li>
						<a href="/214/" class="design-name">Verde Moderna</a> by						<a href="http://www.mezzoblue.com/" class="designer-name">Dave Shea</a>*/
					</li>					</ul>
				</nav>
			</div>

			<div class="design-archives" id="design-archives">
				<h3 class="archives">Archives:</h3>
				<nav role="navigation">
					<ul>
						
						<li class="viewall">
							<a href="http://ecloud.ewang.com.tw/index.php?Act=125" title="進入銘泉">
								進入銘泉							</a>
						</li>
					</ul>
				</nav>
			</div>

			/*<div class="zen-resources" id="zen-resources">
				<h3 class="resources">Resources:</h3>
				<ul>
					<li class="view-css">
						<a href="style.css" title="View the source CSS file of the currently-viewed design.">
							View This Design&#8217;s <abbr title="Cascading Style Sheets">CSS</abbr>						</a>
					</li>
					<li class="css-resources">
						<a href="http://www.mezzoblue.com/zengarden/resources/" title="Links to great sites with information on using CSS.">
							<abbr title="Cascading Style Sheets">CSS</abbr> Resources						</a>
					</li>
					<li class="zen-faq">
						<a href="http://www.mezzoblue.com/zengarden/faq/" title="A list of Frequently Asked Questions about the Zen Garden.">
							<abbr title="Frequently Asked Questions">FAQ</abbr>						</a>
					</li>
					<li class="zen-submit">
						<a href="http://www.mezzoblue.com/zengarden/submit/" title="Send in your own CSS file.">
							Submit a Design						</a>
					</li>
					<li class="zen-translations">
						<a href="http://www.mezzoblue.com/zengarden/translations/" title="View translated versions of this page.">
							Translations						</a>
					</li>
				</ul>
			</div>*/
		</div>
	</aside>


</div>

<!--

	These superfluous divs/spans were originally provided as catch-alls to add extra imagery.
	These days we have full ::before and ::after support, favour using those instead.
	These only remain for historical design compatibility. They might go away one day.
		
-->
<div class="extra1" role="presentation"></div><div class="extra2" role="presentation"></div><div class="extra3" role="presentation"></div>
<div class="extra4" role="presentation"></div><div class="extra5" role="presentation"></div><div class="extra6" role="presentation"></div>

</body>
</html>