/* root element for scrollable */
.vertical {

    /* required settings */
    position:relative;
    overflow:hidden;
    height: 292px;
    width: 100%;
    float: right;                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                 top: 8px;
    left: 0px;
}

/* root element for scrollable items */
.vertical .items {
    position:absolute;

    /* this time we have very large space for height */
    height:20000em;
    margin: 0px;
}

.vertical .items div {
  float: right;
}

/* single scrollable item */
.vertical .items .item {
     margin:2px 0;
     padding: 0 5px;
     font-size:12px;
     height: 269px;
}

/* elements inside single item */
.vertical .items  a img {
    float:right;
    margin: 3px;
    height: 90px;
     
    width: 120px;
}
.vertical h3{margin: 5px 0;font-size: 10pt;font-family:gss;color: #123b4f;}
.vertical .items  a{color: #315565;font-size: 87%;}
.Vslideartical span{width: 318px;display:block;}

/*
root element for video items. Must be absolutely positioned
and it should have a extremely large width to accommodate video
items.  it's enough that you set width and height for the root element
and not for this element.
*/

 
/*
a single item. must be floated in horizontal scrolling.  typically,
this element is the one that *you* will style the most.

.scrol .items div {

}*/
.Vslideartical{text-align: right;width: 446px;border: 1px solid #dde0e5;padding: 0;border-radius: 5px;margin-top: 1px;background-color:#f8f8f8;
  background: -webkit-linear-gradient(bottom, #f1f1f1, #ffffff); background: -moz-linear-gradient(bottom, #f1f1f1, #ffffff);filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f1f1f1'); background: -o-linear-gradient(bottom, #f1f1f1, #ffffff);height: 94px;}
.Vslideartical:hover{border: 1px solid #ffe0e5 ;background-color:#fff;
 background: -webkit-linear-gradient(bottom, #ffffff, #f1f1f1); background: -moz-linear-gradient(bottom, #ffffff, #f1f1f1);filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f1f1f1', endColorstr='#ffffff'); background: -o-linear-gradient(bottom, #ffffff, #f1f1f1);}

.new{
    margin:0 0 5px 0;
    font-size:13px;
    color:#fff;
    font-weight:bold;
    font-family:Tahoma;
}
.new:hover{
    
    color:#EEF805;
  
}

/* the action buttons above the scrollable */
#actions {
   position:relative;
	
   top: 20px;
	z-index:100;
}

#actions a:hover{cursor:pointer;}
#actions .next,#actions .prev {
	position:absolute;
	top: 280px;
	left: 16px;
	width: 445px;
	height: 13px;
	display:block;
	z-index:101;
	background:#349dd6 url(images/down.png) no-repeat top center;
	background-position: top center;
	}

#actions .next {
	top: -25px;
	background:#349dd6 url(images/up.png) no-repeat top center ;
}
#actions .next:hover {background-color:#75c8f6;background-position: bottom center;}
#actions .prev:hover{background-color:#75c8f6;background-position: bottom center;}
.videos{height: 364px;}
#VideoSite{width: 950px;padding:4px }
#VideoSite .l{float:left; width: 485px;height: 302px;background-color: black;}
#VideoSite .r{width: 463px;padding-top: 0px;height: 316px;float:right; }