@font-face {
  font-family: 'bauerbodonistd-roman';
  src: url('../fonts/bauerbodonistd-roman.woff') format('woff');
}

/*
會依視窗縮放調整高度的物件，會參考 Tag 中的 data-height。
dom.height = window.height - data-height
*/
.Hd9ResizableVertical{

}
/*
會依視窗縮放調整寬度的物件，會參考 Tag 中的 data-width。
dom.width = window.width - data-width
*/
.Hd9ResizableHorizontal{

}
/*
會依視窗縮放調整縱軸位置的物件，會參考 Tag 中的 data-bottom。
就像 CSS 中的 bottom 一樣運作。
dom.top = window.height - data-bottom - dom.outerHeight
*/
.Hd9RepositionableVertical{

}
/*
會依視窗縮放調整橫軸位置的物件，會參考 Tag 中的 data-right。
就像 CSS 中的 right 一樣運作。
dom.left = window.width - data-right - dom.outerWidth
*/
.Hd9RepositionableHorizontal{

}
/*
會依視窗縮放調整於容器中縱軸置中的物件
*/
.Hd9RepositionableVerticalCenter{

}
/*
會依視窗縮放調整於容器中橫軸置中的物件
*/
.Hd9RepositionableHorizontalCenter{
	
}
/*
會裁切內容的容器
*/
.Hd9Clipable{
	overflow: hidden;
}
/*
可捲動內容
*/
.Hd9Scrollable{
	overflow: auto;
}
#hd9Content *{
	color: #FFF;
	font-size: 14px;
	font-family: 微軟儷黑體, 微軟正黑體, Arial, Helvetica, Geneva, sans-serif;
}

.Hd9Button{
	cursor: pointer;
}
.Hd9SliderBar{ width: 100%; height: 20px; background: url(http://resources.vogue.com.tw/images/scrollH.png) no-repeat left 0; padding-left: 10px;}
.Hd9SliderBar .Hd9SliderBarBody{ height: 20px; background: url(http://resources.vogue.com.tw/images/scrollH.png) no-repeat right -20px;}
.Hd9SliderBarThumb{ height: 20px; background: url(http://resources.vogue.com.tw/images/scrollH.png) no-repeat left -40px; padding-left: 10px; cursor: col-resize;}
.Hd9SliderBarThumb .hd9GallerySliderBarThumbBody{ height: 20px; background: url(http://resources.vogue.com.tw/images/scrollH.png) no-repeat right -60px;}
.Hd9SliderBarThumb:hover{ background-position: left -80px;}
.Hd9SliderBarThumb:hover .hd9GallerySliderBarThumbBody{ background-position: right -100px;}
.Hd9SliderBar, .Hd9SliderBarThumb{
	/*height: 20px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;*/
}

.Hd9GalleryItem, .Hd9GalleryItemMask, .Hd9GalleryItemImage{
	width: 80px;
	height: 80px;
}
.Hd9GalleryItem{ cursor: pointer;}
#hd9Gallery .Hd9Selected{
	border: 1px solid #686868;
}
.Hd9GalleryItemMask{
	background-color: #000;
	filter:alpha(opacity=50);
	-moz-opacity:0.5;
	opacity: 0.5;
}
.Hd9GalleryItemMask:HOVER{
	background-color: #000;
	filter:alpha(opacity=0);
	-moz-opacity:0;
	opacity: 0;
}
.Hd9Selected .Hd9GalleryItemMask{
	display: none;
}
.Hd9GalleryItemImage{

}


#hd9BG{
	filter: alpha(opacity=85);
	opacity : 0.85;
	background-color: #000;
}

#hd9Body{
	top: 71px;
	left: 23px;
}
#hd9Showcase, #hd9ShowcaseMask, #hd9ShowcaseInteract{
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
}


#hd9Header{
	height: 70px; border-bottom: 1px solid #616161;
}

#hd9LogoBlock{
	top: 70px;
}
#hd9Counter{
	color: #686868;
	font-size: 28px;
	line-height: 28px;
	font-family: bauerbodonistd-roman;

	top: 40px;
	left: 23px;
	width: 174px;
	height: 45px;
}
#hd9Logo, #hd9Numerator, #hd9Denominator, #hd9FractionSymbol{

}
#hd9Logo{
	width: 87px;
	height: 22px;
	top: 12px;
	left: 23px;
	background: url(http://resources.vogue.com.tw/images/skin_website2.png) no-repeat -211px -137px;
}
#hd9Numerator, #hd9Denominator, #hd9FractionSymbol{
	color: #686868;
	font-size: 40px;
	line-height: 40px;
	font-family: bauerbodonistd-roman;
}
#hd9Numerator, #hd9Denominator, #hd9FractionSymbol{
	top: 80px;
}
#hd9Numerator{
	left: 23px;
}
#hd9FractionSymbol{
	left: 88px;
}
#hd9Denominator{
	left: 102px;
}
#hd9Title{
	left: 10px;
	height: 60px;
	top: 6px;
}
#hd9Title .hd9TitleA{
	font-size: 27px;
	line-height: 30px;
	font-family: 微軟儷黑體, 微軟正黑體, Arial, Helvetica, Geneva, sans-serif;	
	color: #fff;
}
#hd9Title .hd9TitleA:HOVER{
	text-decoration: underline;
}

#hd9Description{
	width: 300px;
	top: 20px;	
	font-size: 14px;
	line-height: 18px;
	color: #FFF;
	font-family: 微軟儷黑體, 微軟正黑體, Arial, Helvetica, Geneva, sans-serif;	
}


#hd9Footer{
	left: 0px;
	border-top: 1px solid #616161;
	background: #000;
	height: 120px;
}
#hd9Gallery{
	top: 10px;
	left: 64px;
	height: 82px;
}
#hd9GalleryPreButton, #hd9GalleryNextButton{
	top: 27px;
	width: 40px;
	height: 60px;
	filter:alpha(opacity=50);
	-moz-opacity:0.5;
	opacity: 0.5;
}
#hd9GalleryPreButton:HOVER, #hd9GalleryNextButton:HOVER{
	filter:alpha(opacity=100);
	-moz-opacity:1;
	opacity: 1;
}
#hd9GalleryPreButton{
	left: 24px;
	background: url(http://resources.vogue.com.tw/images/skin_website2.png) no-repeat 0 -45px;
}
#hd9GalleryNextButton{
	background: url(http://resources.vogue.com.tw/images/skin_website2.png) no-repeat -40px -45px;
}
#hd9GallerySliderBar, #hd9GallerySliderBarThumb{

}
#hd9GallerySliderBar{
	bottom: 1px;
	left: 66px;
	height: 20px;
}

#hd9FooterSwitch{ width: 100%; height: 40px; background: #000 url(http://resources.vogue.com.tw/images/skin_website2.png) no-repeat center -255px; cursor: pointer; opacity: 0.5;}
#hd9FooterSwitch:hover{ background-position: center -295px; background-color: #333;}
/*關起來的按鈕*/
#hd9FooterSwitch.Hd9Selected{ width: 100%; height: 40px; background: #000 url(http://resources.vogue.com.tw/images/skin_website2.png) no-repeat center -494px; cursor: pointer; opacity: 0.5;}
#hd9FooterSwitch.Hd9Selected:hover{ background-position: center -534px; background-color: #333;}


#hd9ReadMoreBlock{
	left: 0px;
	height: 350px;
}
#hd9ReadMoreTitle{
	text-align: center;
	font-size: 36px;
	font-family: bauerbodonistd-roman;
}
#hd9ReadMoreItemBlock{
	top: 40px;
	width: 880px;
	vertical-align: top;
}
.hd9ReadMoreItem{
	display: inline-block;
	vertical-align: top;
	width: 270px;
	margin: 0px 10px;
}
.hd9ReadMoreItemImgBlock{
	padding: 10px;
	border:#686868 1px solid; 
}
.hd9ReadMoreItemImg{
	width: 250px;
	height: 250px;
}
.hd9ReadMoreItemTitle{
	text-align: left;
	font-family: 新細明體;
	color: #fff;
}

#hd9BackViewButton{
	width: 69px;
	height: 100px; 
	filter:alpha(opacity=50);
	-moz-opacity:0.5;
	opacity: 0.5;
	left: 23px;
	background: url(http://resources.vogue.com.tw/images/skin_website2.png) no-repeat -886px -105px;
}


#hd9Close{
	top: 12px;
	width: 90px;
	height: 22px;
	line-height: 22px;
	font-size: 20px;
	color: #ca0008;
	padding-right: 25px;
	background: url(http://resources.vogue.com.tw/images/skin_website.png) no-repeat right -757px;
	text-align: right;
	font-family: bauerbodonistd-roman;
}
#hd9Close:HOVER{
	color: #e11921;
}
#hd9CloseLabel{

}
#hd9CloseButton{
	left: 50px;
	font-size: 12px;
	border-width: 1px;
	border-style: solid;
}


#hd9PreButton, #hd9NextButton{
	width: 69px;
	height: 100px; 
	filter:alpha(opacity=50);
	-moz-opacity:0.5;
	opacity: 0.5;
	z-index: 50;
}
#hd9PreButton:HOVER, #hd9NextButton:HOVER, #hd9BackViewButton:HOVER{
	filter:alpha(opacity=100);
	-moz-opacity: 1;
	opacity: 1;
}
#hd9PreButton{
	left: 23px;
	background: url(http://resources.vogue.com.tw/images/skin_website2.png) no-repeat -886px -105px;
}
#hd9NextButton{
	background: url(http://resources.vogue.com.tw/images/skin_website2.png) no-repeat -955px -105px;
}
#hd9NextButton.hd9More{
	background: url(http://resources.vogue.com.tw/images/skin_website2.png) no-repeat -817px -105px;
}


#hd9OptionBar{ color: #666;}
#hd9OptionMessageButton, #hd9OptionFullSizeButton, #hd9OptionShareButton, #hd9OptionMagnifierButton, #hd9OptionZoomMinusButton, #hd9OptionZoomPlusButton, #hd9OptionFullArticleButton, #hd9OptionPinButton{ width: 50px; height: 43px; background: url(http://resources.vogue.com.tw/images/skin_website2.png) no-repeat;}

#hd9ControllWrapper{ left: -20px;}
#hd9ControllWrapper > div{ float: left; margin-right: 5px;}
#hd9OptionMessageButton, #hd9OptionFullSizeButton{}
#hd9OptionMessageButton{ background-position: -674px 0;}
#hd9OptionMessageButton:hover{ background-position: -674px -43px;}
#hd9OptionFullSizeButton{}
#hd9OptionFullSizeButton.zoomIn{ background-position: -208px 0;}
#hd9OptionFullSizeButton.zoomIn:hover{ background-position: -208px -43px;}
#hd9OptionFullSizeButton.zoomOut{ background-position: -258px 0;}
#hd9OptionFullSizeButton.zoomOut:hover{ background-position: -258px -43px;}
#hd9OptionFullArticleButton{ background-position: -458px 0;}
#hd9OptionFullArticleButton:hover{ background-position: -458px -43px;}
#hd9OptionPinButton{ background-position: -508px 0;}
#hd9OptionPinButton:hover, #hd9OptionPinButton.selected{ background-position: -508px -43px;}

#hd9OptionShareButton{ background: none;}
#hd9OptionShareButton .v-widget-shareBtn-open{ right: 45px;}
#hd9OptionShareButton:HOVER{
	color: #fff;
}

#hd9OptionZoomMinusButton, #hd9OptionZoomPlusButton{ line-height: 45px; background: url(http://resources.vogue.com.tw/images/opacity_gray.png) repeat; font-family: 'bauerbodonistd-roman'; font-size: 16px; text-align: center; color: #aaa; font-family: bauerbodonistd-roman;}
#hd9OptionMagnifierButton{ background-position: -558px 0;}
#hd9OptionZoom{}
#hd9OptionZoomBar, #hd9OptionZoomBarThumb{}
#hd9OptionZoomBar{ left: 50px; width: 260px; height: 43px; background: url(http://resources.vogue.com.tw/images/opacity_gray.png) repeat;}
#hd9OptionZoomBar.Hd9SliderBar{ border: 0;}
#hd9OptionZoomMinusButton{ left: 0px; background-position: -308px 0; cursor: default;}
/*#hd9OptionZoomMinusButton:hover{ background-position: -308px -43px;}*/
#hd9OptionZoomPlusButton{ left: 310px; background-position: -358px 0; cursor: default;}
/*#hd9OptionZoomPlusButton:hover{ background-position: -358px -43px;}*/
#hd9OptionZoomBarScroll, #hd9OptionZoomBarThumb{ top: 13px;}
#hd9OptionZoomBarScroll{ width: 250px;}


#hd9Sidebar, #hd9MessageBoard, #hd9ShareBar, #hd9SidebarAd{
	width: 320px;
}
#hd9Sidebar{
	top: 71px;
}
#hd9MessageBoard{
	height: 120px;
}
#hd9ShareBar{
	height: 20px;
}
#hd9SidebarAd{
	height: 250px;
}