/* ==========================================================================
   Author's custom styles : Clément CAILLARD
   ========================================================================== */
#ccpanel-container {
	position: relative;
	height: 100%;
	background: #fff;
	z-index: 60;
	font-family: abchanel-couture, Arial, Helvetica, sans-serif;
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.no-boxsizing #ccpanel-container {
	behavior: url(boxsizing.htc)/*tpa=http://www.chanel.com/css/boxsizing.htc*/;
}
.ar_ME #ccpanel-container {
	direction: RTL;
}
.zh_CN #ccpanel-container, .zh_HK #ccpanel-container {
	font-family: abchanel-couture, '华文细黑', STXiHei, '微软雅黑', 'Microsoft Yahei', '华文黑体', 'ST Heiti', 'MS黑体', 'MS Hei', sans-serif;
}
.ja_JP #ccpanel-container {
	font-family: abchanel-couture, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', 'Meiryo', 'ＭＳ Ｐゴシック', 'MS PGothic', 'Roboto', 'Droid Sans', sans-serif;
}
.ru_RU #ccpanel-container {
	font-family: abchanel-couture, sans-serif;
}
.ko_KR #ccpanel-container {
	font-family: abchanel-couture, '맑은고딕', 'Malgun Gothic', 'Apple Gothic', '돋움', Dotum, '굴림', Gulim, sans-serif;
}
.zh_TW #ccpanel-container {
	font-family: abchanel-couture, '微軟正黑體', 'Microsoft JhengHei', '儷黑 Pro', 'LiHei Pro', 'Arial Unicode MS', sans-serif;
}
#ccpanel-container a { text-decoration: none; outline:0;}

#ccpanel-content {
	position: relative;
	min-height: 100%;
	background: #fff;
}

   
/* ==========================================================================
   $NAV
   ========================================================================== */
#ccpanel-main-nav {
	position: relative;
	margin: 0 30px;
	padding: 1px 0;
	min-height: 59px;
	text-align: center;
	font-size: 13px;
	font-weight: 300;
	color: #4c4c4c;
}
#ccpanel-main-nav ul {
	display: inline-block;
	padding: 0;
	margin: 15px 10px 0;
}
#ccpanel-main-nav li {
	display: inline-block;
	padding: 0 10px 0 12px;
	line-height: 22px;
	background: url(nav_bullet.gif)/*tpa=http://www.chanel.com/img/nav_bullet.gif*/ no-repeat left center;
}
.lt-ie8 #ccpanel-main-nav ul, 
.lt-ie8 #ccpanel-main-nav li {
	display: inline;
	zoom: 1;	
}
.ar_ME #ccpanel-main-nav li {
	padding: 0 12px 0 10px;
	background-position: right center;
}
#ccpanel-main-nav li.first {
	padding: 0 12px;
	background: none;
}
#ccpanel-main-nav h1 {
	position: relative;
	display: inline;
	margin: 0;
	padding: 0;
	font-size: 13px;
	font-weight: 300;
	z-index: 1;
}
#ccpanel-main-nav a {
	color: #4c4c4c;
}
#ccpanel-main-nav a:hover {
	color: #000;
}

.ccpanel-shoponline {
	display: none;
	position: absolute;
	margin-top: 18px;
	line-height: 14px;
	color: #7f7f7f;
	font-size: 9px;
	font-weight: 300;
}
.en_US .ccpanel-shoponline {
	display: block;
	width: 286px;
}
.pt_BR .ccpanel-shoponline {
	display: block;
	width: 360px;
}
.fr_FR .ccpanel-shoponline {
	display: block;
	width: 260px;
}
.ccpanel-shoponline div,
.ccpanel-shoponline-end div {
	position: absolute;
	top: 6px;
	left: 0;
	width: 100%;
	height: 1px;
	border-top: 1px solid #7f7f7f;
}
.ccpanel-shoponline span {
	position: relative;
	background: #fff;
	padding: 0 10px;
}

.ccpanel-shoponline-end {
	display: none;
	position: relative;
	margin: 11px auto 25px;
	width: 220px;
	border-bottom: 1px solid #7f7f7f;
}

/* ==========================================================================
   $FOOTER
   ========================================================================== */
.ccpanel-overlap-fix-left {
	float: left;
	padding: 0 35px 0 0;
	height: 59px;
	width: auto;
	font-size: 13px;
	font-weight: 300;
	visibility: hidden;
	overflow: hidden;
}
.ccpanel-overlap-fix-right {
	float: right;
	padding: 0 35px 0 0;
	height: 59px;
	width: auto;
	font-size: 13px;
	font-weight: 300;
	visibility: hidden;
	overflow: hidden;
}
/*.ar_ME .ccpanel-overlap-fix-left {
	padding: 0 35px 0 0;
	width: auto;
}
.ar_ME .ccpanel-overlap-fix-right {
	padding: 0;
	width: 1px;
}*/


/* ==========================================================================
   $FOOTER
   ========================================================================== */
#ccpanel-language {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 35px;
	text-align: center;
	color: #808080;
	font-size: 9px;
	font-weight: 300;
	line-height: 15px;
}
#ccpanel-language a {
	margin: 0 10px;
	color: #808080;
	font-size: 9px;
}
#ccpanel-language a:hover {
	color: #000;
}


/* ==========================================================================
   $NEWS
   ========================================================================== */
#ccpanel-wrapper-slideshow-news {
	position: relative;
	margin: 20px 0 0;
}
#ccpanel-wrapper-slideshow-news .ccpanel-slideshow {
   margin: 0;
   padding: 0;
   text-align: center;
}
#ccpanel-wrapper-slideshow-news .ccpanel-slideshow .ccpanel-slide {
    display: inline-block;
    width: 254px;
    margin: 0 24px 10px;
    overflow: hidden;
    list-style-type: none;
    vertical-align: top;
}
.lt-ie8 #ccpanel-wrapper-slideshow-news .ccpanel-slideshow .ccpanel-slide {
	display: inline;
	zoom: 1;	
}

#ccpanel-wrapper-slideshow-news h2 {
	font-size: 11px;
	color: #4c4c4c;
	font-weight: 300;
	margin: 25px 0 0;
	line-height: 11px;
}
#ccpanel-wrapper-slideshow-news h3 {
	font-size: 9px;
	color: #808080;
	font-weight: 300;
	margin: 7px 0 0;
	line-height: 12px;
}
.ja_JP #ccpanel-wrapper-slideshow-news h3 {
	font-size: 10px;
}
.lt-ie9 #ccpanel-wrapper-slideshow-news h3 {
	font-size: 9px;
}
#ccpanel-wrapper-slideshow-news a:hover h3 {
	color: #000;
}

#ccpanel-wrapper-slideshow-news .ccpanel-thumbnail {
	display: block;
	width: 100%;
	height: auto;
}
#ccpanel-wrapper-slideshow-news .ccpanel-thumbnail-over {
	display: none;
	width: 100%;
	height: auto;
}
#ccpanel-wrapper-slideshow-news a {
	display: inline-block;
	background: #fff;
}
.no-touch #ccpanel-wrapper-slideshow-news a:hover .ccpanel-thumbnail {
	display: none;
}
.no-touch #ccpanel-wrapper-slideshow-news a:hover .ccpanel-thumbnail-over {
	display: block;
}


/* ==========================================================================
   $SERVICES
   ========================================================================== */
#ccpanel-services {
	position: relative;
	padding: 0 0 35px;
	text-align: center;
}
.ccpanel-service {
	margin: 45px 0;
	font-size: 13px;
	font-weight: 300;
	color: #808080;
	text-transform: uppercase;
}
.ccpanel-service h2 {
	color: #000;
    font-size: 27px;
    font-weight: 200;
    height: 21px;
    line-height: 24px;
    margin: 0 0 8px;
}
.lt-ie8 .ccpanel-service h2 {
	height: auto;
	line-height: 27px;
}

.ccpanel-service ul {
	margin: 0;
	padding: 0;
}
.ccpanel-service li {
	display: inline-block;
	margin: 0 10px;
}
.lt-ie8 .ccpanel-service li {
	display: inline;
	zoom: 1;	
}
.ccpanel-service a {
	color: #808080;
}
.ccpanel-service a:hover {
	color: #000;
}

#ccpanel-follow {
	position: relative;
	background: #000;
	color: #fff;
	min-height: 60px;
}
#ccpanel-follow ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
	text-align: center;
	vertical-align: top;
	height: 58px;
	border-bottom: 1px solid #3a3a3a;
}
#ccpanel-follow li {
	display: inline-block;
	width: 20%;
	min-width: 60px;
	height: 58px;
	border-left: 1px solid #3a3a3a;
	border-right: 1px solid #3a3a3a;
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.lt-ie8 #ccpanel-follow li {
	display: inline;
	zoom: 1;
}
.lt-ie9 #ccpanel-follow li {
	width: 80px;
}
.no-boxsizing #ccpanel-follow li { /* BOX-SIZING POLYFILL */
	behavior: url(boxsizing.htc)/*tpa=http://www.chanel.com/css/boxsizing.htc*/;
}
#ccpanel-follow li:first-child { border-left: none; }
#ccpanel-follow li:last-child { border-right: none; }
#ccpanel-follow li a {
	display: block;
	width: 100%;
	height: 100%;
	line-height: 58px;
	font-size: 0px;
	color: #fff;
}


.ccpanel-share-facebook { background: #000 url(icon-facebook.png)/*tpa=http://www.chanel.com/img/icon-facebook.png*/ no-repeat center center; }
.ccpanel-share-instagram { background: #000 url(icon-instagram.png)/*tpa=http://www.chanel.com/img/icon-instagram.png*/ no-repeat center center; }
.ccpanel-share-twitter { background: #000 url(icon-twitter.png)/*tpa=http://www.chanel.com/img/icon-twitter.png*/ no-repeat center center; }
.ccpanel-share-google-plus { background: #000 url(icon-google.png)/*tpa=http://www.chanel.com/img/icon-google.png*/ no-repeat center center; }
.ccpanel-share-youtube { background: #000 url(icon-youtube.png)/*tpa=http://www.chanel.com/img/icon-youtube.png*/ no-repeat center center; }
.ccpanel-share-renren { background: #000 url(icon-renren.png)/*tpa=http://www.chanel.com/img/icon-renren.png*/ no-repeat center center; }
.ccpanel-share-weibo { background: #000 url(icon-weibo.png)/*tpa=http://www.chanel.com/img/icon-weibo.png*/ no-repeat center center; }
.ccpanel-share-youku{ background: #000 url(icon-youku.png)/*tpa=http://www.chanel.com/img/icon-youku.png*/ no-repeat center center; }

@media all and (-webkit-min-device-pixel-ratio: 1.5),
 all and (-o-min-device-pixel-ratio: 3/2),
 all and (min--moz-device-pixel-ratio: 1.5),
 all and (min-device-pixel-ratio: 1.5) {  
  	.recent .ccpanel-share-facebook { background-image: url(icon-facebook@2x.png)/*tpa=http://www.chanel.com/img/icon-facebook@2x.png*/; background-size: 78px 78px; }
  	.recent .ccpanel-share-instagram { background-image: url(icon-instagram@2x.png)/*tpa=http://www.chanel.com/img/icon-instagram@2x.png*/; background-size: 78px 78px; }
	.recent .ccpanel-share-twitter { background-image: url(icon-twitter@2x.png)/*tpa=http://www.chanel.com/img/icon-twitter@2x.png*/; background-size: 78px 78px; }
	.recent .ccpanel-share-google-plus { background-image: url(icon-google@2x.png)/*tpa=http://www.chanel.com/img/icon-google@2x.png*/; background-size: 78px 78px; }
	.recent .ccpanel-share-youtube { background-image: url(icon-youtube@2x.png)/*tpa=http://www.chanel.com/img/icon-youtube@2x.png*/; background-size: 78px 78px; }
	.recent .ccpanel-share-renren { background-image: #000 url(icon-renren@2x.png)/*tpa=http://www.chanel.com/img/icon-renren@2x.png*/; background-size: 78px 78px; }
	.recent .ccpanel-share-weibo { background-image: #000 url(icon-weibo@2x.png)/*tpa=http://www.chanel.com/img/icon-weibo@2x.png*/; background-size: 78px 78px; }
	.recent .ccpanel-share-youku{ background-image: #000 url(icon-youku@2x.png)/*tpa=http://www.chanel.com/img/icon-youku@2x.png*/; background-size: 78px 78px; }
}

#ccpanel-mobile-services {
	position: relative;
	background: #000;
	color: #fff;
	padding-top: 25px;
	text-transform: uppercase;
}
#ccpanel-mobile-services ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
	text-align: center;
}
#ccpanel-mobile-services li {
	display: inline-block;
	padding: 0 12px;
	height: 40px;
}
.lt-ie8 #ccpanel-mobile-services li {
	display: inline;
	zoom: 1;	
}
#ccpanel-mobile-services li a {
	color: #fff;
	font-size: 11px;
	font-weight: 300;
	line-height: 25px;
}


/* ==========================================================================
   $CHINESE AUTH
   ========================================================================== */
#chinese-auth {
	display: none;
	position: absolute;
    bottom: 21px;
    right: 30px;
    line-height: 12px;
    z-index: 1;
}
.chinese-context #chinese-auth {
	display: block;
}
#chinese-auth a {
	font-family: Simhei, Arial, helvetica, sans-serif;
    color: #808080;
    font-size: 9px;
    line-height: 12px;
}
#chinese-auth-logo {
    background: url("chinese_trade.jpg")/*tpa=http://www.chanel.com/img/chinese_trade.jpg*/ no-repeat 3px -6px;
    margin-left: 20px;
    padding-top: 30px;
}


/* ==========================================================================
   Helper classes
   ========================================================================== */
.valign-fix {
	display: inline-block;
    *display: inline;
    zoom: 1;
    vertical-align: middle;
    font-size: 0px;
}
.valign-fix + .after {
    display: inline-block;
    *display: inline;
    zoom: 1;
    vertical-align: middle;
    height: 100%;
    content: "";
}

.mobile-show { display: none; }


/* ==========================================================================
   Media Queries
   ========================================================================== */
/*@media all and (min-width: 361px) and (max-width: 640px) {*/
@media all and (min-width: 1px) and (max-width: 640px) {
	#ccpanel-content { background-color: #000; }
	
	#ccpanel-main-nav {
		margin: 0;
		font-size: 25px;
		padding-top: 20px;
		color: #000;
		background-color: #fff;
		padding-bottom: 30px;
	}
	#ccpanel-main-nav ul {
		display: block !important;
		margin: 14px 0 0;
	}
	.lt-ie8 #ccpanel-main-nav ul {
		margin-top: 40px;
	}
	#ccpanel-main-nav #ccpanel-push {
		margin-top: 45px;
	}
	#ccpanel-main-nav li {
		display: block !important;
		padding: 7px 0 !important;
		line-height: 30px;
		background: none !important;
		text-align: center;
	}
	#ccpanel-main-nav h1 {
		display: block;
		font-size: 25px;
		text-align: center;
	}
	#ccpanel-main-nav a {
		color: #000;
	}

	.ccpanel-shoponline {
		display: block;
		position: relative;
		margin: 20px auto 5px;
		width: 220px !important;
	}
	.ccpanel-shoponline-end {
		display: block;
	}
		
	#ccpanel-wrapper-slideshow-news,
	#ccpanel-services {
		display: none;
	}
	.mobile-show {
		display: block;
	}
	
	#ccpanel-language {
		position: relative;
		height: 30px;
		color: #fff;
		font-size: 11px;
		font-weight: 300;
		line-height: 25px;
		background: #000;
		padding-bottom: 20px;
	}
	#ccpanel-language a {
		color: #fff;
		font-size: 11px;
	}
	#ccpanel-language a:hover {
		color: #fff;
	}
	
	#chinese-auth {
		position: relative;
		text-align: center;
	    bottom: auto;
	    right: auto;
	    margin-top: -10px;
	    padding-bottom: 15px;
	}
	#chinese-auth-logo {
	    background: url("chinese_trade_mobile.jpg")/*tpa=http://www.chanel.com/img/chinese_trade_mobile.jpg*/ no-repeat right center;
	    padding-top: 0;
	    padding-right: 22px;
	}

	.ccpanel-overlap-fix-left, 
	.ccpanel-overlap-fix-right {
		display: none;
	}
}
@media all and (min-width: 641px) and (max-width: 768px) {
	#ccpanel-main-nav, #ccpanel-main-nav h1 { font-size: 9px; }
	.ccpanel-overlap-fix-left, .ccpanel-overlap-fix-right { display: none;}
	#ccpanel-main-nav ul { margin-left: 20px; margin-right: 20px; }
	.en_US .ccpanel-shoponline { width: 212px; }
	.pt_BR .ccpanel-shoponline { width: 262px; }
	.fr_FR .ccpanel-shoponline { width: 194px; }
	
	.ccpanel-service { margin: 35px 0; }
	.ccpanel-service h2 { font-size: 25px; }

	#ccpanel-main-nav { position: relative; margin: 0 30px 20px; }
		
	#ccpanel-wrapper-slideshow-news {
		margin: 0;
	}
}
@media all and (min-width: 769px) and (max-width: 960px) {
	#ccpanel-main-nav, #ccpanel-main-nav h1 { font-size: 11px; }
	.ccpanel-overlap-fix-left, .ccpanel-overlap-fix-right { display: none; }
	#ccpanel-main-nav ul { margin-left: 20px; margin-right: 20px; }
	.en_US .ccpanel-shoponline { width: 248px; }
	.pt_BR .ccpanel-shoponline { width: 312px; }
	.fr_FR .ccpanel-shoponline { width: 228px; }
	
	.ccpanel-service { margin: 35px 0; }
	.ccpanel-service h2 { font-size: 25px; }
	
	#ccpanel-main-nav { position: relative; margin-bottom: 20px; }
		
	#ccpanel-wrapper-slideshow-news {
		margin: 0;
	}
}
@media all and (min-width: 961px) and (max-width: 1152px) {
	#ccpanel-main-nav, #ccpanel-main-nav h1, .ccpanel-overlap-fix-left, .ccpanel-overlap-fix-right { font-size: 12px; }
	.en_US .ccpanel-shoponline { width: 268px; }
	.pt_BR .ccpanel-shoponline { width: 336px; }
	.fr_FR .ccpanel-shoponline { width: 246px; }
}
@media all and (min-width: 1153px) and (max-width: 1280px) {
	#ccpanel-main-nav, #ccpanel-main-nav h1, .ccpanel-overlap-fix-left, .ccpanel-overlap-fix-right { font-size: 12px; }
	.en_US .ccpanel-shoponline { width: 268px; }
	.pt_BR .ccpanel-shoponline { width: 336px; }
	.fr_FR .ccpanel-shoponline { width: 246px; }
}
@media all and (min-width: 1281px) and (max-width: 1440px) {
	#ccpanel-main-nav, #ccpanel-main-nav h1, .ccpanel-overlap-fix-left, .ccpanel-overlap-fix-right { font-size: 11px; }
	#ccpanel-main-nav ul { margin-left: 20px; margin-right: 20px; }
	.en_US .ccpanel-shoponline { width: 248px; }
	.pt_BR .ccpanel-shoponline { width: 312px; }
	.fr_FR .ccpanel-shoponline { width: 228px; }
}