body{
line-height:1
}
.video-layout{
position:absolute;
overflow:hidden;
width:1200px;
height:775px;
background:#fff;
}

.video-ssc .video-bg{
position:absolute;
width:100%;
height:100%;
background:url(images/bg.jpg) no-repeat left center;
background-size:150% auto;
	
}


.video-ssc .video-bg00{
position:absolute;
width:100%;
height:70%;
background:url(images/bg.png) no-repeat center;
background-size:150% auto;
	filter: alpha(opacity=20);
	-moz-opacity: 0.2;
	opacity: 0.2;
	
	-webkit-transform: background-position;
	-webkit-animation-name: bg;
	-webkit-animation-duration: 20000ms;
	-moz-transform: background-position;
	-moz-animation-name: bg;
	-moz-animation-duration: 20000ms;
	transform: background-position;
	animation-name: bg;
	animation-duration: 20000ms;
	
	-webkit-animation-timing-function: linear;
	-moz-animation-timing-function: linear;
	animation-timing-function: linear;
	
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  
    -webkit-animation-delay: 1s;
  animation-delay: 1s;
  -webkit-animation-delay: 1s;
  animation-delay: 1s;
	
}

@-webkit-keyframes bg {
    from { 
    background-position:center center;-webkit-transform: background-position 0.1s linear; }
	
	50%{ background-position:left -300px;--webkit-transform: background-position 0.1s linear; }
    to { background-position:center center;--webkit-transform: background-position 0.1s linear; }
}
@-moz-keyframes bg {
    from { background-position:center center;-moz-transform: background-position 0.1s linear; }
    50% { background-position:0 -300px;-moz-transform: background-position 0.1s linear; }
    to { background-position:center center;-moz-transform: background-position 0.1s linear; }
}

 
@keyframes bg {
    from {
		background-position:center center;
        transform: background-position 0.1s linear;
    }
    50% {background-position:0 -300px;
        transform: background-position 0.1s linear;
    }
    to {background-position:center center;
        transform: background-position 0.1s linear;
    }
}


.video-ssc .video-bg22{
position:absolute;
bottom:0;
left:0;
width:100%;
height:30%;
background:url(images/bg2.png) no-repeat left bottom;
background-size:130% auto;
	filter: alpha(opacity=120);
	-moz-opacity: 1.2;
	opacity: 1.2;
	
	-webkit-transform: background-position;
	-webkit-animation-name: bg2;
	-webkit-animation-duration: 20000ms;
	-moz-transform: background-position;
	-moz-animation-name: bg2;
	-moz-animation-duration: 20000ms;
	transform: background-position;
	animation-name: bg2;
	animation-duration: 20000ms;
	
	-webkit-animation-timing-function: linear;
	-moz-animation-timing-function: linear;
	animation-timing-function: linear;
	
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
	
}

@-webkit-keyframes bg2 {
    from { 
    background-position:left bottom;-webkit-transform: background-position; }
	
	50%{ background-position:right bottom;--webkit-transform: background-position; }
    to { background-position:left bottom;--webkit-transform: background-position; }
}
@-moz-keyframes bg2 {
    from { background-position:left bottom;-moz-transform: background-position; }
    50% { background-position:right bottom;-moz-transform: background-position; }
    to { background-position:left bottom;-moz-transform: background-position; }
}

 
@keyframes bg2 {
    from {
		background-position:left bottom;
        transform: background-position;
    }
    50% {background-position:right bottom;
        transform: background-position;
    }
    to {background-position:left bottom;
        transform: background-position;
    }
}


.video .bg2{
	position:absolute;
	left:0;
	top:0;
	height:20000px;
	width:450px;
	border-right:1px solid #ddd;
	background:#eee;
}
.video-side{
	position:relative;
	float:left; width:450px; padding:0;z-index:10;
	}
.video_logo{
margin-top:50px;
text-align:center;
}
.video_logo img{
width:120px;
height:120px;
}
.video_name{
text-align:center;
font-size:40px;
margin-top:20px;
color:#FF0000;
}

.video_title{
text-align:center;
font-size:20px;
margin:20px 0;
}
.video_timer{
font-size:70px;
font-family:"DS-Digital Bold";
color:#FFFFFF;
position:relative;
left:50%;
width:300px;
margin-left:-150px;
padding:20px 0;
text-align:center;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	-webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
	-moz-box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
	box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
	background:#f44;
	
}
.video-main{float:right; width:750px;
text-align:center;}

.video-prev-issue{

text-align:center;
font-size:20px;
margin:100px 0 0;
}
.video_issue,.video_prev_issue{
	color:#FF0000;
}
.video-open{
/*width:500px;
margin:20px auto;*/
	position:relative;
	z-index:6;
	display: inline-block;
	*display: inline;
	*zoom: 1;
	padding: 20px;
	margin:140px 0 130px;
	font-size: 14px;
	text-align: center;
	text-shadow: 0 1px 1px rgba(255,255,255,0.75);
	vertical-align: middle;
	
	-webkit-border-radius: 40px;
	-moz-border-radius: 40px;
	border-radius: 40px;
	-webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
	-moz-box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
	box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
	
	border: 10px solid #F7E626;
	
	
	color: #f44!important;
	text-shadow: 0 -1px 0 rgba(0,0,0,0.25);
	background-color: #f44;
/*	background-image: -moz-linear-gradient(top,#444444,#222222);
	background-image: -webkit-gradient(linear,0 0,0 100%,from(#444444),to(#222222));
	background-image: -webkit-linear-gradient(top,#444444,#222222);
	background-image: -o-linear-gradient(top,#444444,#222222);
	background-image: linear-gradient(to bottom,#444444,#222222);
	background-repeat: repeat-x;
	border-color: #222222 #222222 #000000;
	border-color: rgba(0,0,0,0.1) rgba(0,0,0,0.1) rgba(0,0,0,0.25);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff444444',endColorstr='#ff222222',GradientType=0);*/

}
.video-open-layout{
	display: inline-block;
	*display: inline;
	*zoom: 1;
	padding: 0;
	margin: 5px;
	position:relative;
	width:100px;
	height:100px;
}
.video-open .video-ball{
/*width:500px;
margin:20px auto;*/
  font: normal 11px "Helvetica Neue", Helvetica, sans-serif;
  font-weight:bold;color: #f44!important;
	display: inline-block;
	*display: inline;
	*zoom: 1;
	padding: 0;
	width:100%;
	height:100%;
	line-height:100px;
	overflow:hidden;
	font-size: 80px;
	text-align: center;
	text-shadow: 0 1px 1px rgba(255,255,255,0.75);
	vertical-align: middle;
	
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	-webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
	-moz-box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
	box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
	
	border: 1px solid #cccccc;
	border-bottom-color: #b3b3b3;	
	
		background-color: #f5f5f5;
	*background-color: #e6e6e6;
	background-image: -moz-linear-gradient(top,#ffffff,#ccc);
	background-image: -webkit-gradient(linear,0 0,0 100%,from(#ffffff),to(#ccc));
	background-image: -webkit-linear-gradient(top,#ffffff,#ccc);
	background-image: -o-linear-gradient(top,#ffffff,#ccc);
	background-image: linear-gradient(to bottom,#ffffff,#ccc);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff',endColorstr='#ffcccccc',GradientType=0);
	background-repeat: repeat-x;
	border-color: #e6e6e6 #e6e6e6 #bfbfbf;
	border-color: rgba(0,0,0,0.1) rgba(0,0,0,0.1) rgba(0,0,0,0.25);


}
.video-open .video-ball li{
line-height:inherit;
}
.video-open .video-dx,.video-open .video-ds{
/*width:500px;
margin:20px auto;*/
  font: normal 11px "Helvetica Neue", Helvetica, sans-serif;
  font-weight:bold;
  color: #f44!important;
	display: inline-block;
	*display: inline;
	*zoom: 1;
	padding: 0;
	width:100%;
	height:100%;
	line-height:100px;
	overflow:hidden;
	font-size: 60px;
	text-align: center;
	text-shadow: 0 0px 3px rgba(247,230,38,0.75);
	vertical-align: middle;

	-webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
	-moz-box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
	box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
	
	border2: 1px solid #222;
	
	
/*		background-color: #fff;
		
	filter: alpha(opacity=40);
	-moz-opacity: 0.4;
	opacity: 0.4;*/

}
.video-dx{
	position:absolute;
	top:-135px;
	left:0;
}

.video-ds{
	position:absolute;
	bottom:-135px;
	left:0;
}
.video-xt,.video-zh,.video-lh{
position:relative;
text-align1:left;
font-size:20px;
padding:10px 0;
}

.video-number{
display:none;
}
.video-roll2:nth-child(2)
{
animation-delay: 4s; /* W3C บอ Opera */
-moz-animation-delay: 4s;/* Firefox */
-webkit-animation-delay: 4s; /* Safari บอ Chrome */
}


.video_sound {
	display: inline-block;
	height: 50px;
	width:50px;
	background: url(images/vulebtn.png) no-repeat 0 8%;
	background-size: 90%;
	cursor: pointer;
	position: absolute;
	right: 10px;
	top:-90px;;
}
.video_sound_off{
	background-position-y: -60px !important;
}