/* ----------變化前---------- */
.cbp-af-header {
	position: fixed;
	left: 0;
	width: 100%;
	background:rgba(255, 255, 255, 0.9)!important;
	opacity: 0.9;
	filter:alpha(opacity=90);
    -moz-opacity:0.9;
	z-index: 9999;
/*	overflow: hidden;*/
	-webkit-transition: height 0.3s;
	-moz-transition: height 0.3s;
	transition: height 0.3s;
}
.cbp-af-header .cbp-af-inner {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0;
}
.cbp-af-header h1,
.cbp-af-header nav {
	display: inline-block;
	position: relative;
}

.cbp-af-header h1,
.cbp-af-header nav a {
}
.cbp-af-header h1 {
	max-width: 330px;
	color: #ffffff;
	margin: 0;
	float: left;
	padding: 10px 0;
}
.cbp-af-header h1 img {
	width: 100%;
	border: none;
}
.cbp-af-header nav {
	padding: 40px 0 10px 0;
	float: right;
}
.cbp-af-header nav a {
	color: #000000;
	font-weight: 700;
	padding: 10px 20px;
	display: inline-block;
}
.cbp-af-header nav a:hover {
	color: #333333;
}

/* ----------變化後 Transitions and class for reduced height---------- */
.cbp-af-header h1,
.cbp-af-header nav a {
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}
.cbp-af-header.cbp-af-header-shrink {
	background: rgba(255, 255, 255, 0.9)!important;
    opacity: 0.9;
    filter: alpha(opacity=90);
    -moz-opacity: 0.9;
	-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5);
	-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5);
	box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5);
}
.cbp-af-header.cbp-af-header-shrink h1,
.cbp-af-header.cbp-af-header-shrink nav a {
}
.cbp-af-header.cbp-af-header-shrink h1 {
	max-width: 230px;
}
.cbp-af-header.cbp-af-header-shrink nav {
	padding: 25px 0 0px 0;
}

/*1000-1280dpi 針對1920寬螢幕以及筆電最高寬度解析度(多數)到1366和1400*/
@media only screen and (max-width: 1280px){
.cbp-af-header nav a {
    padding: 10px 10px;
}
}

/*960-1024dpi 針對老舊型電腦1024x768解析度使用者以及iPad平板(橫式)*/
@media only screen and (max-width: 1024px){
}

@media only screen and (max-width: 960px){
.cbp-af-header .cbp-af-inner {
	display: none;
}
}

/*720-780dpi 針對各廠牌平板解析度使用(直式)*/
@media only screen and (max-width: 780px){
}

/*520-640dpi 針對各廠牌智慧型手機螢幕解析度使用；除非有使用寬度百分比自動縮放，可省略設定*/
@media only screen and (max-width: 656px){
}

/*320-480dpi 針對各廠牌智慧型手機螢幕解析度使用(直式)*/
@media only screen and (max-width: 480px){
}