#banner{   
	position: absolute;   
}     

.oneByOne1{
	margin: 0;
	width: 980px;
	height: 360px;   
	background: #EFEFEF url(../images/paven.png) repeat; 
	overflow: hidden;
}   

#banner .oneByOne_item{
	position: absolute;
	width: 980px;
	height: 360px;  
	overflow: hidden;  
}         
                      
#banner .oneByOne_item span{
	font-family: "Lucida Grande", "Lucida Sans Unicode", helvetica, verdana, arial, sans-serif;
}                                                                                              

#banner .oneByOne_item a{
	text-decoration: none;
	color: #B22222;
}

/* change the width of the slider in your own responsive media query */
@media only screen and (min-width: 980px) {
	.oneByOne1, #banner .oneByOne_item {
		width: 980px;		
	}
}

@media screen and (min-width: 768px) and (max-width: 979px) {
	.oneByOne1, #banner .oneByOne_item { width: 748px; height:275px; }
}

@media screen and (min-width: 480px) and (max-width: 767px) {
	.oneByOne1, #banner .oneByOne_item {
		width: 460px; height:169px;
	}	
}

@media only screen and (min-width: 320px) and (max-width: 479px) {
	.oneByOne1, #banner .oneByOne_item{
		width: 300px; height:110px;
	}
	
}
              

/* slide 1 */      
#banner .oneByOne_item .text{
	position: relative;
	float: left;
	margin: 0px 12px 0 54px;
	color: #333333;	
	font-size: 48px;
}
           

/* slide 2 */
#banner .oneByOne_item .text{
	clear: left;
	position: relative;
	float: left;
	margin: 140px 12px 0 580px;    
	color: #333333;
	font-size: 28px;
}          
#banner .oneByOne_item .text4{
	clear: left;
	position: relative;
	float: left;
	margin: 12px 12px 0 580px; 	
	color: #666666;
	font-size: 16px;
}                     
  
/* slide 3 */
#banner .slide3 img.wp1{
	position: absolute;
	top: 255px;
	left: 512px;
}
#banner .slide3 img.wp2{
	position: absolute;
	top: 190px;
	left: 360px;
}              
#banner .slide3 img.wp3{
	position: absolute;
	top: 64px;
	left: 80px;
}   

#banner .slide3 span.text1{
	clear: left;
	position: relative;
	float: left;
	margin: 120px 12px 0 540px;    
	background: #B22222;     
	padding: 8px;
	color: #FFFFFF;
	font-size: 40px;
} 
#banner .slide3  span.text1 a{
	color: #FFFFFF;
}         
#banner .slide3 span.text2{
	clear: left;
	position: relative;
	float: left;
	margin: 12px 12px 0 540px;
	color: #FFFFFF;  
	background: #A0522D;
	padding: 8px;
	font-size: 22px;
}                   
    

/* slide 4 */   
#banner img.wp1{
	position: absolute;
	top: 240px;
	left: 380px;
}
#banner img.wp2{
	position: absolute;
	top: 200px;
	left: 470px;
}              
#banner img.wp3{
	position: absolute;
	top: 100px;
	left: 600px;
}   

#banner .oneByOne_item span.wp1{
	clear: left;
	position: relative;
	float: left;
	margin: 120px 12px 0 60px;    
	background: #20B2AA;     
	padding: 8px;
	color: #FFFFFF;
	font-size: 40px;
} 
#banner .oneByOne_item span.wp1 a{
	color: #FFFFFF;
}         
#banner .oneByOne_item span.wp2{
	clear: left;
	position: relative;
	float: left;
	margin: 12px 12px 0 60px; 
	
	color: #FFFFFF;  
	background: #5F9EA0;
	padding: 8px;
	font-size: 16px;
}                  

/* slide 5 */
#banner .oneByOne_item img.bigImage{ 
	position: absolute;
	top: 0; 
	left: 0;

}
#banner .oneByOne_item span.slide5Txt1{ 
  	position: relative;
	float: left;
	margin: 150px 12px 0 600px;
	color: #9ACD32;	
	font-size: 24px;  
	background: #FFFFFF;
	padding: 8px;             
}
 
#banner .oneByOne_item span.slide5Txt2{ 
  	position: relative;
	clear: left;
	float: left;
	margin: 12px 12px 0 600px;
	color: #666666;	
	font-size: 12px;  
	background: #FFFFFF;
	padding: 8px;             
}