/*
	root element for the scrollable.
	when scrolling occurs this element stays still.
*/
.scrollable {

	/* required settings */
	position:relative;
	overflow:hidden;
	padding-right:10px;
	/* custom decorations */
/*	background:url(http://saqrcenter.net/img/global/gradient/h300.png) repeat-x;*/
}

/*
	root element for scrollable items. Must be absolutely positioned
	and it should have a extremely large width to accomodate scrollable items.
	it's enough that you set the width and height for the root element and
	not for this element.
*/
/*.scrollable .items {
	 this cannot be too large 
	width:20000em;
	overflow:hidden;
	position:absolute;
	float:right;
}*/
.scrollable .items {
	/* this cannot be too large */
	width:20000em;
	position:absolute;
	clear:both;
}

.items div.cont {
	float:right;
	width:560px;
}

.items div.cont div.itm {
	display:block;
	float:right;
	width:124px;
	text-align:center;
	font-size:14px;
	color:#553366;
	padding-left:0px;
	padding-right:16px;
	line-height:16px;
	cursor:pointer;
	*padding:auto 5px;
}

.items div.cont div.itm a {
	color:#553366;
	display:block;
	height:116px;
	text-decoration:none;
	position:relative;
	font-weight: bold;
}

.items div.cont div.itm span.play-small
{
    display: block;
    position: relative;
    width: 25px;
    height: 25px;
    background: url(http://www.alarabiya.net/assets/ar/images/navigator.png) no-repeat;
	position:absolute;
    top: 28px;
    left: 50px;
    cursor: pointer;
}


table.vertical-table-items td
{
	vertical-align:top;	
}

.vertical {  
	position:relative;
	overflow:hidden;	
	width: 300px;
	background:none;
	height: 900px;
}

 .vertical .items {	
	width:300px;
	position:absolute;
	clear:both;
}

.vertical .items .vertical-item
{
	border-bottom:solid 1px #ececec;
	overflow:hidden;
	min-height:78px!important;
	padding-top:11px;
	width:280px;
	margin-left:10px;
	margin-right:0px;
	display:block;
	float:none;
	clear:both;
	cursor:pointer;	
	
}

.vertical .items div {
	float:right;
	width:214px
}
.vertical-item img
{
	width:50px!important;
	height:75px!important;
	border:solid 1px #9d9d9d;
	margin-left:8px;
	float:right;
}

.special-vertical-height .vertical-item a img, .vertical-item a:hover img {
	width: 50px!important;
	height: 75px!important;
	border: solid 1px #9d9d9d;
	margin-left: 8px;
	float: right;
}

.vertical .items .vertical-item-text
{
	overflow:hidden;
	color:#666666;
	display:inline-block;
	width:215px;
	line-height:18px;
}


.items div.vertical-item-header
{
	font-weight:bold;
	clear:both;	
	display:block;
	float:none;
	margin-bottom:0px;
}

.items div.vertical-item-header a
{
	font-size:12pt;
	font-family:arabic transparent;
}

.vertical-item-container-text
{
	display:block;
	float:none;
	clear:both;	
	text-align:justify;
}

.vertical-item-text a.link-like-span
{
	color:#8d3390;
	text-decoration:none;
	float:none;
	font-weight:bold;
	clear:both;
	float:left;
	font-family:arabic transparent;
	font-size:14px;
}

.vertical-item-text a:hover
{
	text-decoration:underline;
}

.all-opinions
{
	width:50px;
	height:16px;
	display:block;
	float:left;
	background:url(http://www.alarabiya.net/assets/ar/images/navigator.png) no-repeat;
	margin:4px 10px;	
}


.vertical-item-text a
{
	color:#666666;	
	font-size:11px;
	font-family:tahoma;
	text-decoration:none;
	cursor:pointer;
	display:inline-block;
	overflow:hidden;
}


.vertical-item-text div
{
	cursor:pointer;
}
.vertical-item-text a:hover
{
	text-decoration:none;
}

.vertical-item-text a .vertical-item-header
{
	font-weight:bold;

}

.vertical-item-text .vertical-item-header
{
	font-weight:bold;

}



/**/


/* prev, next, prevPage and nextPage buttons */
a.browse {
	background:url(http://saqrcenter.net/images/sprite.gif) no-repeat;
	display:inline-block;
	width:24px;
	height:417px;
	float:right;
	margin:0;
	cursor:pointer;
	font-size:1px;
}

/* right 
a.right 				{ background-position: -13px top; clear:right; margin-right: 0px;}
a.right:hover 		{ background-position: -13px -18px; }
a.right:active 	{ background-position:-13px -36px; } 


-- left --
a.left				{ float:left; margin-left: 0px; } 
a.left:hover  		{ background-position:0 -18px; }
a.left:active  	{ background-position:0 -36px; }

a.right.disabled {
	background-position: -13px bottom;		
}

a.left.disabled {
	background-position: 0 bottom;	
	
} 
*/

/* right */
a.left 				{ background-position: -73px -42px; clear:right; margin-right: 0px;}
a.left:hover 		{ background-position: -97px -42px; }
a.left:active 	{ background-position: -97px -42px;  } 


/* left */
a.right				{ background-position: 0 -42px; float:left; margin-left: 0px; } 
a.right:hover  		{ background-position:-24px -42px; }
a.right:active  	{ background-position:-24px -42px; }


.arrowdivleft a.disabled {
	background-position: -121px -42px;		
}

.arrowdivright a.disabled {
	background-position: -48px -42px;	
	
} 

/* up and down */
a.up, a.down		{ 
	background:url(http://saqrcenter.net/images/sprite.gif) no-repeat;
	width:280px;
	height:25px;
	display:inline-block;
	padding:0;
	margin:0;
}

/* down */
a.down 				{ background-position: -146px -118px;}
a.down:hover  		{ background-position: -146px -143px; }
a.down:active  		{ background-position: -146px -143px; }
.arrowdivdown a.disabled		{ background-position: -146px -168px; }

/* up */
a.up 				{ background-position: -146px -42px; }
a.up:hover  		{ background-position: -146px -67px; }
a.up:active  		{ background-position: -146px -67px; } 
.arrowdivup a.disabled		{ background-position: -146px -92px; }


/**/


/* position and dimensions of the navigator */
.navi {
	clear: both;
    float: right;
    height: 20px;
    margin-right: 31px;
    width: auto;
}


/* items inside navigator */
.navi a {
	width:10px;
	height:10px;
	float:right;
	margin:2px;
	background:url(http://saqrcenter.net/images/sprite.gif) -68px 0 no-repeat;
	display:block;
	font-size:1px;
}

/* mouseover state */
.navi a:hover {
	background-position:-58px 0;      
}

/* active state (current page state) */
.navi a.active {
	background-position:-58px 0;       
}


.arrowdivleft,.arrowdivr{width:24px;height:417px; }
.arrowdivleft{float:right;}
.arrowdivright{float:left; margin-right:5px;}

.arrowdivup, .arrowdivdown {
    clear: both;
    height: 25px;
    margin: 10px;
    width: 280px;
}

div.items div.itm a.imgContainer, div.data-row div.itm a.imgContainer { padding:0; margin:0; height:84px; cursor:pointer; font-weight:bold; }

.archive-block {
	float: left;
	margin-left: 9px;
}

.opinion-vertical{height:458px ; position:relative;	overflow:hidden; width: 300px;}

.vertical-item
{
	border-bottom:solid 1px #ececec;
	overflow:hidden;
	min-height:78px;
	padding-top:11px;
	width:280px;
	margin-left:10px;
	margin-right:0px;
	display:block;
	float:none;
	clear:both;
	cursor:pointer;	
}
.vertical-item-text
{
	overflow:hidden;
	color:#666666;
	display:inline-block;
	width:215px;
	line-height:18px;
}