/* ==============================================
　　Pages Module
==============================================*/
/*通用：寬100%*/
#header, #slider, #wrapper, #footer {
	width: auto;
	min-width: 950px !important;
	width: 100%;
}
/*通用：區塊居中%*/
#header, #slider, #wrapper, .container, #main, #footer {
	margin: 0px auto;
}
/*通用：字居中%*/
#header, #slider, #wrapper, #main, #footer {
	text-align: center;
}
/*通用：浮動-左%*/
#header, #slider, #wrapper, #footer,  
.navbar div.brand, #footer .community {
	float: left;
}
/*通用：基本灰字*/
#header {
	color: #666666;
}
/*通用：浮動-右%*/
#footer .info {
	float: right;
}

/* ========== 網頁區塊 ========== */
/* ---------- #index ---------- *//* ( #header + #slider/#wrapper + #footer ) */
#header {
	position: relative;	
	z-index: 10;
	height: 105px;
	background: #ffffff;
	-webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
	-moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
	box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
	border-bottom: 1px solid #cccccc;
}
#slider {
}
#wrapper {	
	display: block;
	padding-bottom: 20px;
	background: #f2f2f2;
}
#footer {
	min-height: 60px;
	height: auto !important;
	height: 100%;
	background: #000000;
}
.container  {
	/*display: inline-block; */
	display: block;
	width: 910px; /* 950 - 20*2 */
	padding: 10px 20px;
}
.about_pic {
	background: url(http://nic.tolink.com.tw/images/page_pic_about.jpg) 50% center no-repeat;
}
.service_pic {
	background: url(http://nic.tolink.com.tw/images/page_pic_service.jpg) 50% center no-repeat;
}
.content {
	display: inline-block;
	padding: 20px 0px;
	font-family: Arial;
	background-color: #ffffff;
	-webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
	-moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
	box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
	border: 1px solid #dfdfdf;
	min-height: 471px;
}
#fix {
	float: left; 
	height: 15px; 
	background: #666666; 
	line-height: 12px;
}

/* ---------- #footer ---------- */
#footer div {
	margin: 0px auto;
	width: auto;
	width: 910px; /* 950 - 20*2 */
	padding: 20px;
	display: inline-block;
}
#footer .community {
	width: 30%;
	padding-top: 5px;
}
#footer .info {
	width: 70%;
	text-align: right;
	font-size: 13px;
	line-height: 20px;
	color: #ffffff;
}



/* ----- #header -> navbar ----- */
.navbar {
	width: auto;
	width: 920px; /* 950 - 20*2 + 10(右凸出) */
	*display: inline-block;
}
/*
.navbar .pbrand {
	position: relative;
	top: 0px;
	right: 21px; /*17*
	text-align: right;
}
*/
.navbar div.brand {
	margin-top: 25px; 
}
.navbar ul.nav {
	float: right; 
	margin: 0px;
	margin-top: 30px; 
	padding: 0px;
	list-style-type: none;
}
.navbar .nav > li {
	float: left; 
	margin: 0px;
	padding: 0px;
}
.cc1 {
	font-family: 'Droid Sans', Verdana, Geneva, sans-serif;
}
.cc2 {
	font-size: 15px;
	font-family: 'Droid Sans', 微軟正黑體, Verdana, Geneva, sans-serif; 
}
.navbar .nav > li > a {
	white-space: nowrap; 
	width: 102px; /*98*/
	display: block;
	font-size: 15px;
	padding: 8px 5px 8px 5px !important;
	border-top:none !important;
	/*border-bottom: 4px solid transparent;*/
	/*color: #ffffff !important;*/
	color: #666666 !important;
	text-align: center;
	text-shadow: none;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.navbar .nav > li.home > a {
	width: 60px;
}
.navbar .nav > li.active > a {
	/*border-bottom: 4px solid #d63833;*/
}
.navbar .nav > li.active > a > span {
	color: #d63833;
}
.navbar .nav > li > a:hover, .navbar .nav > li.active > a:hover {
	color: #ffffff;
	background: #d63833 !important;
	/*border-bottom: 4px solid #d63833;*/
}
.navbar .nav > li > a:hover span, .navbar .nav > li.active > a:hover span {

	color: #ffffff;
}
.navbar .nav .caret {
	margin-top: 8px;
	border-top-color: #666666;
	border-bottom-color: #666666 ;
}
.navbar .nav li a:hover .caret {
  margin-top: 8px;
  border-top-color: #fff !important;	
  border-bottom-color: #fff !important;	
}
/* ----- #header -> navbar -> menu_sub_css(下拉選單) ----- */
.menu_sub_css {
	list-style-type: none;	
	display: block;
	position: absolute;
	top: 72%;
	left: 100;
	z-index: 1000;
	float: left;
	min-width: 111px;
	padding: 8px 0px 5px 0px;
	margin: 0px;
	list-style: none;
	background-color: #ffffff;
	border: 1px solid #ccc;
	border: 1px solid rgba(0, 0, 0, 0.2);
	border-right-width: 2px;
	border-bottom-width: 2px;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	-webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
	-moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
	box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
	-webkit-background-clip: padding-box;
	-moz-background-clip: padding;
	background-clip: padding-box;
}
.have_2menu > .menu_sub_css {
	display:none;
	width: 135px; /*129*/
	white-space: nowrap; 
}
.navbar .nav > li:hover ul {
	/* 觸動第一層時，顯示第二層 */
	/*visibility:visible;*/
}
.menu_sub_css a  span {
	display: block;
	padding: 4px 10px;
	font-family: 'Droid Sans', 微軟正黑體, Verdana, Geneva, sans-serif; 
	font-size: 13px;
	color: #666666 !important;
}
.menu_sub_css a:hover  span {
	color: #ffffff !important;
	background: #d63833;
}
.navbar .nav > li > .menu_sub_css:after {
	content: '';
	display: inline-block;
	border-left: 6px solid transparent;
	border-right: 6px solid transparent;
	border-bottom: 6px solid #ffffff;
	position: absolute;
	top: -6px;
	left: 10px;
}


/* ----- #slider -> slider-wrapper ----- */
.slider-wrapper {
	position: relative;
	width: 100% !important;
	z-index: 0;
	background: #f2f2f2;
	overflow: hidden;
}
.da-slider {
	position: relative;
	text-align: center;
	max-height: 600px;
}
.slider-info {
	position: relative;
	margin: 0px auto;
	max-width: 1070px;
}
.slider-info h2 {
	position: absolute;
	z-index: 10;
	top: 205px;
	*top: 415px;
	left: 8%;
	color: #000000;
	font-size: 50px;
	line-height: 46px;
	font-family: 'Tw Cen MT', 'Arial Narrow', Arial, sans-serif !important;
	font-weight: 100 !important;
}
.slider-info p {
	position: absolute;
	z-index: 10;
	width: 400px;
	top: 255px;
	left: 11%;
	color: #000000;
	font-size: 20px;
	line-height: 28px;
	height: 80px;
	font-family: 'Times New Roman' !important;
	font-weight: bold;
}
.slider-info div {
	position: absolute;
	z-index: 5;
	top: 190px;
	left: 5%;
	width: 500px;
	height: 170px;
	padding: 10px;
	filter:alpha(opacity=70);
	-moz-opacity:0.7;
	opacity: 0.7;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
	background: #ffffff;
}


/* ----- #wrapper -> container ----- */
.page-title {
	padding: 30px 0px 15px 35px;
	color: #666666;
	font-weight: bold;
}
.page-title span {
	color: #d63833;
}
.navsub {
	margin-bottom: 15px;
	padding: 10px 20px;
	font-size: 18px;
	color: #666666;
	background: #ede5e5;
}
.navsub a {
	color: #666666;
}
.navsub a:hover {
	color: #d63833;
}
#frame_area {
	width: 280px;
	height: 496px;
	overflow:auto;
}
.pagination {
	margin-top: 20px;
	text-align: center;
}


/* ----- #wrapper -> container -> photo_box ----- */
.photo_box {
	padding: 7px; border: 1px solid #cccccc; text-align: center;
}
.photo_box a:hover .left {
	border-right-color: #999999 !important;
}
.photo_box a:hover .right {
	border-left-color: #999999 !important;
}


/* ==============================================
　　RESET
==============================================*/
/* caret */
.category .caret {
	margin-top: 8px;
	border-top-color: #666666;
	border-bottom-color: #666666 ;
}
.photo_box .caret {
	margin-top: 10px;
	border: 10px solid #ffffff;
}
.photo_box .caret.left {
	border-right: 8px solid #0e4375;
}
.photo_box .caret.right {
	border-left: 8px solid #0e4375;
}