 /*
	Theme Name: 1stwebdesigner HTML5/CSS3 Layout
	Date: March 2013
	Description: Basic HTML5/CSS3 layout built on a responsive framework
	Version: 1.0
	Author: Christian Vasile
	Author URL: http://christianvasile.com
*/

/* ===========================
   ======= Body style ==== 
   =========================== */
   
body {
/*	background-image:url(images/texbg5.png); */	
/*   	background-color:#600;
*/
	background: #462C2D url(../images/bg2.png) repeat-x left top;

	color: #000305;
	font-size: 87.5%;  /* Base font size: 14px */
	font-family: "rem Helvetica", "Microsoft JhengHei", "微軟正黑體", "微软正黑体", "Hiragino Sans GB", sans-serif;
	line-height: 1.429;
	margin: 0;
	padding: 0;
	text-align: left;
 	-webkit-font-smoothing: subpixel-antialiased;
	-webkit-text-size-adjust: 100%;
    letter-spacing: 0.1em; 
	overflow-y:auto;/* ?必須 */

	}
img{
	max-width:100%;
	height:auto;
	
	}	
.body {
	clear: both; 
	margin: 0 auto; 
	width: 98%;
}
#container {
	background-image: url(../images/wrapper.jpg); /*底圖 */
	width: 100%;
	margin:0px auto ;
	padding:0px 0px 10px 0px;
	text-align:left;
}

/* ===========================
   ========= Headings ======== 
   =========================== */
h2 {font-size: 1.571em}	/* 22px */
h3 {font-size: 1.429em}	/* 20px */
h4 {font-size: 1.286em}	/* 18px */
h5 {font-size: 1.143em}	/* 16px */
h6 {font-size: 1em}		/* 14px */

h2, h3, h4, h5, h6 {
	font-weight: 400;
	line-height: 1.1;
	margin-bottom: .8em;
}

/* ===========================
   ======= Anchor style ====== 
   =========================== */
a {
	outline: 0;
	}

a img {
	border: 0px; 
	text-decoration: none;
}

a:link, a:visited {
	color: #CF5C3F;
	padding: 0 1px;
	text-decoration: none;
}

a:hover {
/*	background-color:#F00;*/	
	background-color: #CF5C3F;
	color: #fff;
	text-decoration: none;
}

li .active{
		background-color: #CF5C3F;

	}

/*==========class===============*/
.red{
	color: #F00;}
.red2{
	color: #F00;
	font-size:90%;
	}
.red110{
	font-size:110%;

	color: #F00;}
	
.fluid{
	max-width:100%;
	height:auto;
	}
.max{
	max-width:320px;
	}
.max395{
	max-width:395px;
		}
.align{
	vertical-align:middle;
	}
.em115{
	font-size:1.15em;
	
	}
/* ====display=========== */
#banner{
	display: block;
	}
#banner-phone{
	display: none;
	}

.menu-trigger {
	display: none;
}
.menu-trigger2 {
	display: none;
}

.FT-L-img {
	display: block;
	float:left;
	}
.FT-R-img {
	display:block;
	float:right;
	}
	
#mnleft{
	display:none;
		}

	
/* =======banner img==============   */	

#banner{
	margin-top:0px;
	margin-bottom:0.2%;
	border:1px solid #F00;
	
	}
.mainHeader img {
	width:100%;
	height:200px;
	margin: 0 0 0% 0;
}

/* ===========================
   ===== Main Navigation ===== 
   =========================== */
  /*  */ 
div.nav-menu {
/*		
設高度後無法容納下推
height:35px;
*/
	text-align: center;
	margin-left: 15px;
	margin-top:-3px;
	margin-bottom: 10px;
}
	
div.nav-menu ul {
	list-style: none; 
	overflow: hidden;
	border-left:#CC0 5px solid;
	
	margin-top: 0px;
	margin-bottom: 0px;
	padding-left: 0px;
	margin-left: 0px;
	
}

div.nav-menu ul li {
	float: left; 
	display: inline; 
	list-style-type: none; 

}
	
div.nav-menu a:link, div.nav-menu a:visited {
	color: #FFF;  /* 字體顏色  */
	display:block;
	height: 30px; /* 底圖高 */
	padding: 5px 10px 0px 10px;  /*   */
}

div.nav-menu li a {
	background-image:url(../images/bg_grad.gif);
	display: block;
	width:90px;  /* 不能改為% */
	color: #333; /*#6600CC;*/
	font-weight: bold;
	text-align: center;
	line-height: 25px;
	border-right: #CC0 5px solid;
	font-size:1.155em;
}


.nav-menu li a:hover{
	background-image: url('s.png'); /*底色：紅  /style 81行  */
	color: #FFF;
	padding: 5px 10px 0px 10px;  /*   */

}
 

/*----------*/
div.nav-menu2 {
	background: #960;  /*#666;*/
	font-size: 1.143em;
	height:40px;
	line-height: 30px;
	margin: 0 auto 0px auto; /* ?下距   */
	text-align: center;
/*	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
*/	
}
	
div.nav-menu2 ul {
	list-style: none; 
	margin: 0 auto;
}

div.nav-menu2 li {
	text-align:left;
	display: inline;
	overflow: auto; 
	
	
}
	
div.nav-menu2 a:link, div.nav-menu2 a:visited {
	color: #333;
	display: inline-block;
	height: 30px;
	padding: 5px 10px;
	text-decoration: none;
}

div.nav-menu2 a:hover, div.nav-menu2 a:active,
div.nav-menu2 .active a:link, div.nav-menu2.active a:visited {
/*	background: #CF5C3F;
*/	
	color: #333;
	text-shadow: none !important;
}
	
div.nav-menu2 li a {
	
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	
}

/* ===========================
   ======= Content Area ====== 
   =========================== */

.mainContent {
	overflow: hidden;
	line-height: 25px;
/*	 menu 之上圓角
    border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
*/
}
.content {
	margin-left:0%;
	padding-right:1.5%;  /* 右邊界  */
	width: 76%; /* 右欄寬度 */
	float: right;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}

.topcontent {
/*	background-color: #FFF;*/	
	background-image:url(../images/texbg5.png);
	background-color: #FFF;	
	border:2px solid #CCC;
	padding:1% 3% 3% 3%;
	margin-left:1%;
	margin-bottom: 2%;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;	
}
.topcontent h1 {
	color: #C30;
	font-size:1.37em;
	margin-bottom:0;
}

.topcontent h2 {
	color: #C30;
	font-size:1.37em;
}

.post	{
	width:90%;
	margin-top: 0px;
	margin-left: 0px;
	margin-right: 15px;
	padding-right:3%;
	font-size: 1.15em;
    letter-spacing: 0.03em; 
	line-height:25px;
	text-align: justify;
	text-justify:inter-ideograph;
}

.post h1 {
	color:#0000FF;
	font-size: 1.2em;
	line-height:38px;
    padding-left:50px;
	background-image: url(images/h1bgempty.png);
	background-repeat: no-repeat;
}

.post h2 {
	font-size: 1.1em;
	line-height:30px;
	margin-left:45px;
	margin-top:0px;
	margin-bottom:0px;
}
.post h3 {
	width:100%;
	font-size: 1.1em;
	color: #F00;
	height:50px;
	line-height:38px;
	padding-left:50px;
	margin-left:15px;
	margin-top:0px;
	margin-bottom:-5px;
}
.post h5 {
	font-size: 1.1em;
	color: #00F;
	height:42px;
	line-height:38px;
    padding-left:50px;

}

.post p {             /* 內文 */
	line-height:30px; /* 行距   */
	font-size: 1.15em;
    letter-spacing: 0.03em; 
	padding-left:15px;
	padding-right:15px;
	margin-top: -8px;
}
.post ol{
	line-height:30px; /* 行距   */
	font-size: 1.15em;
	letter-spacing:1px;

	}
.post ul {
	line-height:30px; /* 行距   */
	font-size: 1.15em;
	letter-spacing:1px;
	

	}

.post img {
	margin-top:0px;
	margin-left:0px;	
 }
.post table {
	font-size:120%;
}
.post-info {
  font-size:0.8em;
  filter: alpha(opacity=50);
  /* IE */
  -moz-opacity: 0.5;
  /* Mozilla */
  opacity: 0.5;
  /* CSS3 */
  margin-top:0;
  margin-bottom:2px;
	}

#ribbon{
	margin-left:12%;
	
	}
.indext40{
	text-indent: 40px;
	}
.margintop{
	margin-top:5px;
	}
/* ===========================
   ======== Sidebar ========== 
   =========================== */

.sidebar {
    background-image:url(../images/texbg5.png);
	border:2px solid #CCC;
	width:  20%;
	float: left;
	margin-left:1.5%;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;	
	background-color: #FFF;	
	padding: 2% 0%;
	margin-bottom: 2%;
}

 .sidebarr .menu	{
	width: auto;
	font-size: 0.75em;
	}
 .menu ul	{
	margin: 0;
	padding-left:0%;
	padding-top: 8px;
    }
.sidebar .menu li	{
	text-align:left;
	padding-bottom:0px; /*上下間距  */
	margin-bottom:0px; /* 上下間距 */
	margin-left:3%; /*左間際  */
	padding-left:3%;
	line-height:25px;
	list-style-type: none;
	font-size: 1.15em;
	color: #000000;
	text-decoration:none;
     }
	 
.sidebar .menu li a {
	color: #000000;
	text-decoration: none;
	display: block;
	background-image: url(images/lipng-hov.png);
    background-repeat:no-repeat;

    }

.sidebar .menu li a:hover	{
	color: #FFF;
    }
.sidebar .menu ul .active {
	background-color:#FF9966;
}
	
.sidebar img {
	max-width:96.5%;
	margin-right:1%;
	padding-right:1%;
	
	}
	
.sidebar .menu img {
	margin-top: 5px;
	margin-left: 2%;
     }
/*==========================  */ 
	
#announce{
  position: relative;
  width: 72%;
  height:45px;
  margin-left:25%;
  margin-bottom:1%;
}
#block {
  background: #CCC;
  filter: alpha(opacity=50);
  /* IE */
  -moz-opacity: 0.5;
  /* Mozilla */
  opacity: 0.5;
  /* CSS3 */
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
}
#text {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  color: #666;
}



/* ===========================
   ========= Footer ========== 
   =========================== */

.mainFooter {
	width: 93.85%;
	float: left;
	margin-top: 0%;
	margin-bottom: 1%;
	padding:2% 2% 2% 4%;
	background-image:url(../images/texbg5.png);
	background-color: #FFF;	
	border:1px solid #CCC;
 	/*background-color: #600;*/  /* #666; */
    /*	
    border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;	
	*/
	color: #333;
	text-align:center;	
	
	
     }

.mainFooter p {       /*未使用   */
	    width: 91%;
	    margin: 2% auto;
   }
.FT-D-txt{
	   margin-left:23%;
	}


/* ==================== footup ==================== */

#footup {
	background-image:url(images/texbg5.png);
	clear: both;
	display:block;
/*	background-color:#CCFF00;	
*/    width:100%;
	height:43px;
	line-height:30px;
	text-align:center;
	text-decoration:none;
}
#footup a {
		line-height: 42px;

	text-decoration:none;
}
#footup a:hover{
	color: #FFF;
	background-color:# F00;
}

/*  ===================================================================================================== */
/* ===================================== 原設 max-width:480px =========================================== */
	@media screen and (max-width: 779px) {
		
	/*   --------menu-----------  */	
		
		div.nav-menu {
			display: none;
		}
		
		div.nav-expanded {
			display: block;
		}
		
		div.nav-menu ul li {
			float: none;
			border-bottom: 2px solid #d5dce4;
		}
		
		div.nav-menu ul li:last-child {
			border-bottom: none;
		}
		
	/*   -------menu2------------  */	
		
		div.nav-menu2 {
			display: none;
		}
		
		div.nav-expanded {
			display: block;
		}
		
		div.nav-menu2 ul li {
			float: none;
			border-bottom: 2px solid #d5dce4;
		}
		
		div.nav-menu2 ul li:last-child {
			border-bottom: none;
		}
	
	}
/*======================================================================================================================*/

/* ================================================================================================================================================================
   ====== Media Queries ====== 
   ================================================================================================================================================================ */

						  @media only screen and (min-width : 150px) and (max-width : 780px)
						  {
							  
						  body{
								  }
								  
						  .body {
								  clear: both; 
								  margin: 0 auto; 
								  width: 100%;
								  font-size: 90%;
							  }
						  #container {
							  margin:0x auto ;
							  padding:0.5% 0px 10px 0px; /* banner圖片  清除banner ing 上緣間隙    */
						  }
							  
						  /* ----------------------------*/	
						  .sidebar{
								  display:none;
								  }
								  
						  /* -------------------  */	
						  .mainHeader img {
								  width: 98.5%;  /* banner圖片  寬度縮減.可增加邊界   */
								  height: auto;
								  margin-bottom: 0%;
							  }
								  
								  
						  /*  -------banner------------  */	
						  #banner{
								  display:none;
							  }
						  #banner-phone{
							  display: block;
							  margin-left:1%;       /* banner圖片 左邊界 */
							  }
						  
						  /*  -----menu bar--------------  */	
							  
						  #mnright{
								  display:block;
								  width:49%;
						  /*	    background:#C93; */	    
								  float:right;
								  margin-right:1%;
								  }
						  #mnleft{
								  display:block;
								  width:49%;
						  /*	    background: #9C0; */	    
								  float:left;
								  margin-left:1%;
								  }
						  /*----------trigger-----------------------*/
						  .menu-trigger {
								  display:block;
								  color: #305782;
								  background-color:#d5dce4;
								  padding:8px;
								  text-align:center;
								  font-size: 83%;
								  cursor:pointer;
								  border-top-right-radius:5px;
								  -moz-border-top-right-radius: 5px;
								  -webkit-border-top-right-radius: 5px;
						  
							  }
						  .menu-trigger2 {
								  display:block;
								  color:#305782;
								  background-color: #CCF;
								  padding: 8px;
								  text-align:center;
								  font-size:83%;
								  cursor: pointer;
								  border-top-left-radius:5px;
								  -moz-border-top-left-radius: 5px;
								  -webkit-border-top-left-radius: 5px;
						  
							  }
							  
						  /* ----------menu--------右側(主選單)  下板------------ */
						  
							  div.nav-menu {
                                  /* background: #666; */								  
								  background-color:#96F;  /* !!!  #666; /#96F */
								  font-size: 1.143em;
								  height: 320px;  /* 高度 *//* !!! 333px;/320px  */
								  line-height: 30px; /*  */
								  margin-left:0;
								  margin-top:0;  /*  調整  */
								  margin-bottom: 0;
								  border-bottom-right-radius:5px;
								  border-bottom-left-radius:5px;
							  
							  /*	
								  border-radius: 5px;
								  -moz-border-radius: 5px;
								  -webkit-border-radius: 5px;*/
							  }
								  
						  div.nav-menu ul {
								  display:block;
								  list-style: none; 
								  margin: 0 auto;
								  padding-left: 0;
							  }
							  
						  div.nav-menu li {
								  margin-left: 0 auto;
								  width: 100%;
							  }
							  
						  div.nav-menu a:link, div.nav-menu a:visited {
								  color: #FFF;
								  display: block;
								  padding: 5px 0; /* li 間距  */
								  text-decoration: none;
							  }
							  
						  div.nav-menu a:active,
						  div.nav-menu .active a:link, div.nav-menu .active a:visited {
								  background: #CF5C3F;
								  color: #fff;
								  text-shadow: none !important;
							  }
								  
						  .div.nav-menu li a {
								  
						  /*			
								  border-radius: 5px;
								  -moz-border-radius: 5px;
								  -webkit-border-radius: 5px;
						  */		
							  }
						  
						  /* --------menu2------左側(癌症解秘)  下板-----  */	
						  
						  div.nav-menu2 {
								  background-color:#96F;/* !!! #666  /#F96F*/
								  font-size: 1.1em;
								  height: 320px;  /*下板總高度 *//* !!!333px; /320px */
								  line-height:28px; /* ??? li全體上下  *//* !!! 28px /56px */
								  margin:0;
								  border-bottom-right-radius:5px;
								  border-bottom-left-radius:5px;
								  
						  /*	  border-radius: 5px;
								  -moz-border-radius: 5px;
								  -webkit-border-radius: 5px;
						  */		
							  }
								  
						  div.nav-menu2 ul {
								  display:block;
								  list-style: none; 
								  margin: 0 auto;
								  padding: 0;
							  }
							  
						  div.nav-menu2 li {
							  display:block; /* ====多加==== ! 呈現分隔 ====(注意 784 和 797) =====    */
							  width: 100%;
							  }
						
						  div.nav-menu2 a:link, div.nav-menu2 a:visited {
								  color: #FFF;
								  display: block;
								  padding: 0;
								  text-decoration: none;
							  }
							  
						  div.nav-menu2 a:active,
						  div.nav-menu2.active a:link, div.nav-menu2 .active a:visited {  
                                  /* ===== 但未加====	height: 21px; li 的間距 =========  */
								  background: #CF5C3F;
								  color: #fff;
								  text-shadow: none !important;
							  }
								  
						  .div.nav-menu2 li a {

						  /*		
								  border-radius: 5px;
								  -moz-border-radius: 5px;
								  -webkit-border-radius: 5px;
						  */		
							  }
						  
						 .div nav-menu2 a:hover {  /* 無作用 ?  */
							/*	background-color:#F00;*/	
								/*background-color: #FFF; /#CF5C3F;*/
								color: #F00;
								text-decoration: none;
							}

						
						  
						  
						  /*   ------content-------------  */	
							  
						  .mainContent {
								  overflow: hidden;
								  line-height: 25px;
							  }
						  .content {
								  width: 100%;
								  float: left;
							  }	
							  
						  .topcontent {
								  background-color: #FFF;
								  padding: 2% 5%;
								  margin-bottom: 0%;
								  border:none;  /* 不加 border */
								  
						  }
						  .post	{
							  width:97%;
							  margin-top: 0px;
							  font-size: 1.15em;
							  margin-left: 0px;
							  margin-right: 15px;
							  padding-right:3%;
							  text-align: justify;
							  text-justify:inter-ideograph;
						  }
						  #ribbon{
							  margin-left:3%;
							  }
						  
						  .post-info {
								  display: none;
							  }
						  
						  /*   -------footer------------  */	
								  
						  .mainFooter {
								  width: 93.5%;
								  float: left;
								  margin: 0% 2% 0 0%; /* 左設1%會漏出底色  */
								  padding-left: 3%;
								  padding-right:3%;
								  background-image: url(../images/texbg5.png);
						  /*		background-color: #FFF;	
						  */		
								  border:1px solid #CCC;
								  /*border-radius: 5px;
								  -moz-border-radius: 5px;
								  -webkit-border-radius: 5px;	
								  */
								  color: #333;
								  
							  }
							  
						  .mainFooter p {
								  width: 86%;
								  margin: 2% auto;
							  }
							  
						  .FT-L-img {
								 display:none;
							  }
						  .FT-R-img {
								 display:none;
							  }
						  .FT-D-txt{
								 margin-left:0%;
							  
							  }
						  #writer{
								  display:none;
								  }
						  #announce{
							  display:none;
							  }
						  #footup{
							  display:none;
							  
							  }
						  }
