@charset "utf-8";
body{ margin:0px; }
a:link, a img{border:none;text-decoration:none;}
.wrapper{width:932px; margin:0px auto;}
.content{margin-top:520px}
.page{
	background:url(../images/bg.jpg) no-repeat top center fixed;
	background-size:100% auto;
	display:block;
}
.opacity{
	background: rgba(000,000,000,0.6);
	width: 1000px;
	margin: 0 auto;
}
.wrap{
	width:939px;
	margin:0px auto;
}

h1{
	font-size:25px;
}
h2{
	font-size:22px;
}
h3{
	font-size:20px;
}

a, a img{
	border:none;
	text-decoration:none;
	color:inherit}
input[type="button"]{
	cursor:pointer;}
ul{
	padding:0px;
	margin:0px}
li{
	list-style:none}
header 

.flag{text-align:right}
.flag li{ display:inline-block; margin:4px}

.sponsor, ul{ display:block; overflow:hidden}
header .sponsor{ background:url(../images/bg-sponsor.png) repeat-y; }
.sponsor-footer{clear:both; padding-top:5px}
.sponsor.main{}
.sponsor.co{ background: url(../images/bgsponcer-below.png);background-size: 100% ; position: relative; top: -35px;}
.sponsor-footer ul{ text-align:center}
.sponsor{height:65px; line-height:65px; text-align:left; }
.sponsor li{ display:inline-block; margin:0px 7px}
.aeg {position: relative; width: 60%;left: -11px}
.bec {position: relative; width: 60%;left: -23px}
.sponsor li img{ vertical-align:middle}
.left-content, .info-left{ float:left;}
.right-content, .info-right{ float:right;}
.info-left{}
.right-content{max-width:300px}

.video{ background:url(../images/bg_vdo.jpg) no-repeat; width:597px; height:358px; position:relative;border-radius:10px;margin: 0 auto;}
.video iframe{position:absolute; bottom:31px; right:39px}
.taylor-video{
		background:url(../images/vdo-bg.png) no-repeat;
		height: 487px; 
		width: 100%;
		background-size: 100% auto;
		text-align:center;
}
.taylor-video iframe{ 
		width:650px; 
		height:389px;
		margin:60px auto auto ;
}
.news-update{
	background:url(../images/bg-head-news.png) no-repeat;
	background-size:100% auto;
	padding:0px 0px;
	height:272px;
	display:block;
	overflow:hidden
}

.gallery-image map{ position:relative; display:block; top:-266px}
.thumbnail1, .thumbnail2{
	position: relative;
	z-index: 0;
	/*top:650px;*/
}
.thumbnail1:hover, .thumbnail2:hover{
	background-color: transparent;
	z-index: 50;
}
.thumbnail1 span{ /*CSS for enlarged image*/
	position: absolute;
	background-color: lightyellow;
	padding: 5px;
	left: -318px;
	top:-222px;
	border: 1px dashed gray;
	visibility: hidden;
	color: black;
	text-decoration: none;
}
.thumbnail1 span img{ /*CSS for enlarged image*/
	border-width: 0px;
	padding: 2px;
}
.thumbnail1:hover span{ /*CSS for enlarged image on hover*/
	visibility: visible;
	top:-355px;
	left: -318px; /*position where enlarged image should offset horizontally */
}

.thumbnail2 span, .thumbnail3 span, .thumbnail4 span, .thumbnail5 span, .thumbnail6 span, .thumbnail7 span{ /*CSS for enlarged image*/
	position: absolute;
	border: 1px dashed gray;
	visibility: hidden;
	color: black;
	text-decoration: none;
	background-color: lightyellow;
}
.thumbnail2 span img, .thumbnail3 span img,.thumbnail4 span img,.thumbnail5 span img,.thumbnail6 span img,.thumbnail7 span img{ /*CSS for enlarged image*/
	border-width: 0px;
}
.thumbnail2:hover span, .thumbnail3:hover span,.thumbnail4:hover span,.thumbnail5:hover span,.thumbnail6:hover span,.thumbnail7:hover span{ /*CSS for enlarged image on hover*/
	
}
.thumbnail2:hover span{
	visibility:visible;
	top:-95px;
	left:-90px;
}
.thumbnail3:hover span{
	visibility: visible;
	left:48px;
	top:-29px;
	}
.thumbnail4:hover span{
	visibility:visible;
	left:175px ;
	top:-120px;
	}
.thumbnail5:hover span{
	visibility:visible;
	left:270px ;
	top:-36px;
	}
.thumbnail6:hover span{
	visibility:visible;
	right:128px;
	top:-103px;
	}
.thumbnail7:hover span{
	visibility:visible;
	right:-70px;
	top:-38px;
	}
.thumbnail2 area:hover span{ visibility:visible}

.bio{ font-size:18px}
.bio h1{ font-style:bold}
.bio h2{margin:0px}
.bio h3{ margin-top:5px}
.bio p{text-indent:1em}

.ads-banner{ width:300px;}
.social-content-fb{	
	background:rgba(255,255,255,0.98);
	border-radius:5px;
	}
.social-content-tw{
	width:315px;
	height:420px;
	}
.social-content-tw iframe{
	width:88%;
	padding:10px 13px;
}
.customisable-border{
	border:1px solid #EE4599;
	}
.timeline-header .customisable-border{
	background:#EE4599}
.customisable-highlight{
	color:#fff}
.register-group, .countdown{
	float:left;}
.promotion{
	overflow:hidden}	

.title {
    border: none;    
    padding: 0px;
    font-family: Arial; 
    font-size: 16px; 
    font-weight: normal;  
    color: #cd0263;      
    background: transparent;
	}

.gallery-image{}
.gallery{
	overflow:hidden;
	text-indent:0px;}
.gallery li{
	float:left;
	width:186px !important;
	height:179px;
	margin:0px 2px;
	padding:0px}
.gallery li img{
	width:100%;
	height:100%;}


/****************************************wrap-campaign*******************************************/
.wrap-campaign{
	font-family: 'RSU';
	width:802px;
	background:url(../images/bg-cam-page.png);
	margin:10px auto;
	-moz-border-radius:15px;  
  	border-radius: 15px;  
  	-webkit-border-radius: 15px;
	box-shadow: 0 0 0 8px rgba(239,33,106,0.7);
	padding:0px 0px 10px;}
.head-campaign{
	clear:both}
.gallery-group{ overflow:hidden}
.gallery-group li, .picture, .picture img, .picture_info, .picture_info img, .information{
	-moz-border-radius:10px;  
  	border-radius: 10px;  
  	-webkit-border-radius: 10px;
	}
.gallery-group li{
	width:156px;
	height:246px;
	padding:1px;
	background:url(../images/bg-profile.png) no-repeat;
	margin:10px 21px;
	float:left;}
.picture img{
	width:100%;
	height:auto;}
.info{
	font-size:16px;
	line-height:19px;
	color:#fff;
	margin:3px;}
.info_list{
	margin:2px 3px}

.note{
	margin:20px;
	padding:5px 0px;
	border-top:1px dotted #e11f83;
	color:#402c31;
	font-size:14px;
	}
.information,.fb-comment{	
	margin:10px auto;}
.information{
	background:#ef216a;
	width:518px;
	height:262px;
	padding:5px;
	}
.information .info, .picture_info{
	float:left}
.information .info{
	font-size:22px;
	line-height:30px;
	margin-left:10px;}
.fb-comment{
	width:530px;
	border:1px solid #ef216a;}
.fb-comment, .title-comment{
	border-top-left-radius:10px;
	border-top-right-radius:10px;}	
.title-comment{
	padding:3px 7px;	
	background:#ef216a;
	color:#fff;
	font-size:24px;
	}
#detail-content{
	clear: both;
	height: 420px;
	padding: 10px 15px;
	margin:0px 0px;
	color: #FFF;
	line-height: 23px;
	padding: 15px 59px;
	background: url(../images/bg-content-taylor.png) no-repeat;
	text-align: left;
	
	}
	
#detail-content ul{
	text-align:right;
	display:inherit;
	}
#detail-content a{
	color:#06F;
	}
#detail-content a:link{
	color:#06F;
	font-weight:bold;
	text-decoration: underline;
	}
#detail-content a:hover{
	color: #00F;
	font-weight: bold;
	text-decoration: underline;
	}
.bio{ width:480px; height:517px; background:rgba(0,0,0,0.8); overflow:auto; padding:8px; border-radius:10px}

.left{ 
	text-align:left;
	line-height:5px;
	color:#000;
	position:relative;
	top:64px;
	height: 462px;
	}

#gallery_scroll{margin:10px 0;width:100%;height:104px;position:relative;clear:both}
#gallery_scroll .scrollable{height:104px;margin:0 40px;overflow:hidden;position:relative}
#gallery_scroll a.scroll_left,#gallery_scroll a.scroll_right{cursor:pointer;top:0;width:40px;height:104px;position:absolute;background-position:50% 50%;background-repeat:no-repeat}
#gallery_scroll a.scroll_left{left:0;background-image:url(http://www.sonicbang.net/skin/sonicbang/artist/img/left.png)}
#gallery_scroll a.scroll_right{right:0;background-image:url(http://www.sonicbang.net/skin/sonicbang/artist/img/right.png)}
#gallery_scroll a.scroll_left:hover{background-image:url(http://www.sonicbang.net/skin/sonicbang/artist/img/left-hover.png)}
#gallery_scroll a.scroll_right:hover{background-image:url(http://www.sonicbang.net/skin/sonicbang/artist/img/right-hover.png)}
#gallery_scroll .scrollable img{height:100px}
#gallery_scroll .scrollable a{display:inline-block;float:left;background-color:#FFF;padding:2px;margin:0 2px;box-shadow:0 0 5px rgba(0,0,0,0.5)}
.artist_img>img{border:5px solid #FFF;box-shadow:2px 2px 3px rgba(0,0,0,0.5)}
#artist_mv>div.banner>a{margin-bottom:5px;display:inline-block}

#slide-avril {
width: 220px;
height: 290px;
font-size: 0;
display: inline-block;
overflow: hidden;
margin: 70px 34px;
}
#slide-avril a{ margin:0px; padding:0px 3px}


.gallery-avril{background:url(../images/avril-gallery.png);width: 290px;height: 470px;}
.gallery{
	margin:10px auto; 
	width:98%; 
	overflow: hidden; 
	padding:0px;
	position:relative}
.fancybox{
	float:left;
	margin:3px;
	position:relative}
.time-table{background:rgba(255,255,255,0.95)}

.next{ margin-left:13px}
.news{
	background:#FFF;
	float:left;
	clear:both;
	margin:0px 0px 5px 0px;
	width:100%;}

/* This CSS is just for presentational purposes. */
#wrap {
      margin: 0 auto;
      padding: 1em;
}

/* This CSS is used for the Show/Hide functionality. */
.more {
  display: none;
  /*border-top: 1px solid #666;*/
  /*border-bottom: 1px solid #666;*/ 
}
a.showLink, a.hideLink {
  	text-decoration: none;
  	color: #36f;
  	padding-left: 8px;
	text-align:center;
  	/*background: transparent url(down.gif) no-repeat left;*/
	opacity:0.8;
	filter:alpha(opacity=80); 
}
/*a.hideLink {
  	background: transparent url(up.gif) no-repeat left;
}*/
a.showLink:hover, a.hideLink:hover {
  	opacity:1.0;
	filter:alpha(opacity=100); 
}
.container{ background:rgba(255,255,255,0.98);border-radius:5px;overflow:hidden}
h4{margin:0px;background:#000;color:#fff;padding:3px 8px}
.container li{margin:10px; color:#222}
.inner{background:url(../images/bg_meet.png) no-repeat top right; float:left;width:100% }
.remark{float:left;width:100% ;font-size:14px;}
.remark li{color:red}
/* Original 1024px (landscape) ----------- */
.ticket-info{width:625px; background: url(../images/bg1.png) no-repeat; background-size:100% auto;display:block; float:left;border-radius: 10px}
#let-me-go img{ max-width:100%; width:auto}
#let-me-go .btn {width:292px; height:70px}

.clearfix{ display:block; height:20px; clear:both}
.gallery-taylor{background: url(../images/site-taylo_11.png);
width: 99%;
height: 400px
}
.gallery-taylor a {	
	display:block;
	float:left;
}
.gallery-taylor .gall1{	
	margin-top: 127px;
	margin-left: 59px;}
.gallery-taylor .gall2{
	margin-top: 150px;
	margin-left: 23px;
}
.gallery1{

width: 381px;
height: 207px;
position: relative;
top: 120px;
left: 54px;

}

.gallery2{
width: 329px;
height: 226px;
position: relative;
top: -58px;
left: 452px;
}
.blank{
	height:850px;
	display:block;
}

/* slide Vdo */
div.guide {margin:12px 24px;}
div.guide span {color:#ff0000; font:italic 14px Arial, Helvetica, sans-serif;}
div.guide p {color:#000000; font:14px Arial, Helvetica, sans-serif;}
div.guide pre {color:#990000;}
div.guide p.title {color:#df501f; font:18px Arial, Helvetica, sans-serif;}
.vdo{
width: 932px;
margin: 0 auto;
background: url('../images/vdo-bg.png') no-repeat;
}
.html5gallery-container-0{
width: 695px!important;
margin: 0 auto;
height: 292px;
margin-left: -61px;
}
#html5-player-messages {
float: left;
width: 500px;
}
.html5gallery-box-0 {
display: block;
position: relative;
text-align: left;
top: 12px;
width: 500px!important;
height: 300px!important;
}
#html5gallery-elem-video-0{
width: 500px!important;
height: 300px!important;
}
.test {
	font-size:35px;
	color:#F00;
	text-align:center;
}
.time-table2{ clear:both;display:block}
.date,.city,.venue{display:table;border:1px solid;height:40px;float:left;padding:3px;}
.date{width:105px;}
.city{width:195px;}
.venue{width:170px}
.h{background:#991b46;line-height:40px;}
