
/* ---- Typography and font sizes ---- */
html {
	direction:rtl;
	unicode-bidi:embed;
}
body {
	/*font-family: "Traditional Arabic", serif*/
	font-family: "Simplified Arabic", "Arabic Transparent", "Traditional Arabic", "Arial (Arabic)", "Times New Roman (Arabic)", "AGA Arabesque", "NaskhTT", "Akhbar MT", "Courir New (Arabic)", "Decotype Naskh",  "Mudir MT",  "Simplified Arabic fixed", "Tahoma (Arabic)", "Andalus", "Monotype Koufi", "Decotype Naskh Extension", "Decotype Naskh Special", "Decotype Naskh Swashed", "Decotype Naskh Variants", "Decotype Naskh Thuluth", "Simplified Arabic backslanted", "Traditional Arabic Backslanted",  Arial,Helvetica,sans-serif;

}

/* ---- General tags ---- */
body.resources #content{
	margin:10px 15px 0 0
}

#primary-content li,
#secondary-content li,
#tertiary-content li,
#headerband li {
	background:transparent url(../display_images/bullets/bullet_mirror.gif) no-repeat scroll right 0.6em;
	padding-right:9px;
	padding-left:0;
	text-align: right;
}
#primary-content .teaserList li ul {
float: right;
}
#primary-content .teaserList li ul li {
	background:transparent url(../display_images/bullets/bullet_mirror.gif) no-repeat scroll right 0.6em !important;
	padding-right:9px !important;
	padding-left:0 !important;
	text-align: right !important;
}
.popup #primary-content ul.twocol li{
	padding-right:3%;
}
body.resources #secondary-content{
	padding:0 0 0 15px;
}
#wrapper #primary-content li.contractList h3 {
	background-image:url(../display_images/icons/icon_minus.gif) !important;
	background-position:right 0.6em !important;
	padding-right:12px !important;
	padding-left:0 !important;
}
#wrapper #primary-content li.contractedList h3 {
	background-image: url(../display_images/icons/icon_plus.gif) !important;
}


h1, h2, h3, h4, h5, h6, p, blockquote, div, ul, li, ol, form {
	text-align: right;
}

h2 {
	font-size: 1.2em;
}
h3 {
	font-size: 1em;
}
.docicon {
	background-position:top right;
	padding-right:20px;
	padding-left: 0;
}

ul#expandedpagecontrols li {
	margin:0 10px 0 0 !important;
}
	ul#expandedpagecontrols li.backToTop {
		float:right;
		margin:0pt !important;
	}

/* arrow link in titles floated right */
#primary-content .moreLink, #secondary-content .moreLink{
	padding:0 10px 10px 0;
	float:left;
}
#primary-content a.moreLink, #secondary-content a.moreLink{
	background-image: url(../display_images/bullets/bullet_mirror.gif);
	background-position: 0 10px;}

* html #primary-content a.moreLink{
	padding-left:15px !important;
	padding-right:0 !important;
}

/* --- moreInfoLink link, like moreinfo link, but for right col teaser lists --- */
.moreInfoLink{
		text-align:left !important;
		background-image:none !important;
	}
	.moreInfoLink a{
		background: transparent url(../display_images/bullets/bullet_mirror.gif) no-repeat scroll right center;
		padding-right:9px;
		text-align:left;
	}
/* ---- Page structure overrides ---- */

/* header */
ul#languageselecter {
	float: left;
	margin-left: 0;
	padding-left: 10px;
    padding: 3px 0 0 0;
}
	ul#languageselecter li {
		float: left;
		padding:4px 6px 0px 6px;
	}

		ul#languageselecter li a:link,
		ul#languageselecter li a:visited,
		ul#languageselecter li a:hover,
		ul#languageselecter li a:active {
			float: left; /* this is needed to make IE 6 and opera respect the padding on the links */
            text-indent: 5000px;
		}

#header #icrclogo {
	position:absolute;
	left: 900px;
	text-indent:-5000px;
	overflow: hidden;
}

#header #currentsection {
	left:auto;
	right: 150px;
	text-align: right;
	font-size: 5em;
	top: 50px
}
.popup #header #currentsection{
	font-size:2.05em;
	font-weight:normal;
	top:0;
	right:0;
	padding:0;
	margin:10px 10px 0px 10px;
	color:#F4F0E7 !important;
	line-height:0.75em !important;
}

/* primary navigation */
ul#navprimary{
	text-align: right;
	padding-left:0;
	padding-right:132px;
}
	ul#navprimary li.resources a{
		width:110px;
	}
	ul#navprimary li {
		float: right;
	}
		ul#navprimary li a:link,
		ul#navprimary li a:visited,
		ul#navprimary li a:hover,
		ul#navprimary li a:active {
			text-align: right;
			padding:7px 10px 0 0;
			font-size: 19px; /* arabic fonts need to be bigger */
			white-space: nowrap;
			border-width:0 1px 0 0;
		}
		ul#navprimary li.last a {
			border-left: 1px solid white !important;
		}
		ul#navprimary li.last ul a {
			border-left: none;
		}
		ul#navprimary li ul{
			top:33px;
		}
		ul#navprimary li.whoweare ul, ul#navprimary li.whoweare .dropdown_shim{
			right:130px;
		}
		ul#navprimary li.whatwedo ul, ul#navprimary li.whatwedo .dropdown_shim {
			right:232px;
		}
		ul#navprimary li.wherewework ul, ul#navprimary li.wherewework .dropdown_shim{
			right:333px;
		}
		ul#navprimary li.warandlaw ul, ul#navprimary li.warandlaw .dropdown_shim{
			right:448px;
		}
		ul#navprimary li.resources ul, ul#navprimary li.resources .dropdown_shim{
			right:566px;
		}

		ul#navprimary li a.warandlaw {
			/* in arabic this is longer than normal */
			width: 105px
		}
        ul#navprimary li ul a:link, 
        ul#navprimary li ul a:visited, 
        ul#navprimary li ul a:hover, 
        ul#navprimary li ul a:active {
            border: none !important;
        }
/* search */
#wrapper{
	position: relative;
}
form#headersearch {
	position: absolute;
	left:0px;
	float: left;
	text-align: left;
	width: 280px;
	margin: 5px 0 0 0;
}
	form#headersearch div {
		text-align: right;
	}
	form#headersearch label,
	form#headersearch #searchkeywords,
	form#headersearch .button {
		float: right;
	}
	form#headersearch label {
		font-size: 1.3em;
		width: 40px;
	}
	form#headersearch .button {
		margin: 3px 5px 3px 10px;
	}
	form#headersearch #searchkeywords {
		direction:rtl !important;
		unicode-bidi:embed;
		text-align: right;
		width: 90px;
	}
	form#headersearch p{
		float: right;
		line-height: 1.2em;
		display: block;
		margin: 0;
		padding:5px 0 0 5px;
		width: auto;

	}


/* Page controls and breadcurmb */
#contentheader {
	float: left;
}
	#contentheader #archivedStatus{
		margin-right:15px;
		float:right;
		border: solid 1px #eaebeb; 
		color:#ee2d24;
		padding-top:2px; 
		padding-bottom:2px;
		padding-left:5px;
		padding-right:2px;
	}
		#contentheader #archivedStatus img{
			vertical-align:bottom;
			margin-left:3px;
		}
		#contentheader #archivedStatus span{
			font-weight: bold;
		}

ul#breadcrumb {
	text-align: right;
	float: right;
	direction: ltr; /* direction rtl collapses padding in firefox! */
	font-size: 13px
}
	ul#breadcrumb ul {
		float: left;
		display: block !important;
		width: 70%; /* this is not very robust [sorry] and may need changing depending on the arabic for 'home' if the other list items drop below*/
	}
		ul#breadcrumb li {
			background-image: url(../display_images/bullets/bullet_mirror.gif);
			background-repeat: no-repeat;
			background-position: right 50%;
			margin-right: 5px;
		}
			ul#breadcrumb li ul {
				display: inline;
				float: right;
			}
				ul#breadcrumb li ul li {
					padding: 0 10px 0 0;
					display: block;
					float:right;
					height: 1.3em;
				}
				
	ul#breadcrumb li a:link,
	ul#breadcrumb li a:visited,
	ul#breadcrumb li a:hover,
	ul#breadcrumb li a:active {
		float: right;
	}
	
	#content.threecol ul#breadcrumb {
		margin-right:198px;
		padding-left: 0px;
		width: 500px;
	}
	* html #content.threecol ul#breadcrumb {
		/* there is no other way than this - buggy rtl calculation doubling the margin in ie6!*/
		margin-right:100px;
	}
	#content.threecol ul#breadcrumb .first {

	}

ul.pagecontrols {
	float: left;
}
	ul.pagecontrols li {
		float: left;
	}

		ul.pagecontrols li.first {
			margin-left: 0 !important;
		}

/* general page structure */
#maincol, #tertiary-content {
	float: right;
	border-width:0 0 0 1px;
}
#tertiary-content {
	margin: 0 10px 0 0; /* a happy medium for cross browser positioning */
}
#secondary-content, #primary-content {
	float: left;
}
.popup #primary-content{
	float:right;
}
.popup #secondary-content{
	float:left;
	padding:0 !important;
}
#content.threecol { /* if theres a bug its probs here, im not sure about these selectors in IE */
	background-position: 210px 0 !important;
}

/* footer */
#footer .address {
	background-position: bottom right;
	float:right;
	padding-left:0;
	padding-right:90px;
	margin-right: 40px;
}

#lastupdate {
	clear:left;
	float:left;
	margin:0;
	padding:0 0 0 15px;
	text-align:left;
}
ul#navprimaryfooter,
ul#footerlinks {
	float:left;
	margin:0 0pt 10px;
	padding:0 0 0 40px;
	text-align:left;
	width: 50%;
}
	ul#navprimaryfooter li,
	ul#footerlinks li {
		position:relative;
		text-align:left;
		padding: 0 6px 0 1px;
		float: left;
	}

/* ---- Secondary content overrides (teasers and auto content etc) ---- */

/* ---- Tertiary content overrides (navigation etc) ---- */
/* navigation */
ul#navsecondary {
	text-align: right
}
	ul#navsecondary li ul li {
		background-image:url(../display_images/bullets/bullet_mirror.gif);
		background-position: right 0.8em;
		padding-right: 10px
	}

/* donate */
p.functionProminant a.donate:link,
p.functionProminant a.donate:visited,
p.functionProminant a.donate:hover,
p.functionProminant a.donate:active {
	background-image:url(../display_images/backgrounds/donate_mirror.gif);
	background-position: top left !important;
	text-align: right;
	padding-right: 10px !important;
	padding-left: 74px !important;
}
	body.whoweare p.functionProminant a.donate:link,
	body.whoweare p.functionProminant a.donate:visited,
	body.whoweare p.functionProminant a.donate:hover,
	body.whoweare p.functionProminant a.donate:active{
		background-image:url(../display_images/backgrounds/donate_whoweare_mirror.gif);
	}
	body.whatwedo p.functionProminant a.donate:link,
	body.whatwedo p.functionProminant a.donate:visited,
	body.whatwedo p.functionProminant a.donate:hover,
	body.whatwedo p.functionProminant a.donate:active{
		background-image:url(../display_images/backgrounds/donate_whatwedo_mirror.gif);
	}
	body.wherewework p.functionProminant a.donate:link,
	body.wherewework p.functionProminant a.donate:visited,
	body.wherewework p.functionProminant a.donate:hover,
	body.wherewework p.functionProminant a.donate:active{
		background-image:url(../display_images/backgrounds/donate_wherewework_mirror.gif);
	}
	body.resources p.functionProminant a.donate:link,
	body.resources p.functionProminant a.donate:visited,
	body.resources p.functionProminant a.donate:hover,
	body.resources p.functionProminant a.donate:active{
		background-image:url(../display_images/backgrounds/donate_resources_mirror.gif);
	}
	body.warandlaw p.functionProminant a.donate:link,
	body.warandlaw p.functionProminant a.donate:visited,
	body.warandlaw p.functionProminant a.donate:hover,
	body.warandlaw p.functionProminant a.donate:active{
		background-image:url(../display_images/backgrounds/donate_warandlaw_mirror.gif);
	}
	body.mediaroom p.functionProminant a.donate:link,
	body.mediaroom p.functionProminant a.donate:visited,
	body.mediaroom p.functionProminant a.donate:hover,
	body.mediaroom p.functionProminant a.donate:active{
		background-image:url(../display_images/backgrounds/donate_mirror.gif);
	}

.functionTeaser a.resources {
	background-image:url(../display_images/icons/greenarrow_arabic.gif);
}
.functionTeaser a.email {
	background-image:url(../display_images/icons/pinkAt_arabic.gif);
}
.functionTeaser a.seeAlso {
	background-image:url(../display_images/icons/orangeRightArrow_arabic.gif);
	background-position: 99% 0.3em !important;
}
input.arrow {
	background-image:url(../display_images/arrow_search_mirror.gif);
}

/* function teasers */
.functionTeaser a{
	background-position: 98% 0.3em !important;
	text-align: right;
	padding:0.2em 2.5em 0.2em 3px !important;
}
	.functionTeaser a.slideshow{
		background:url(../display_images/icons/slideshow_play_arabic.gif) no-repeat scroll right center !important;
		text-align: right;
		margin-right:5px;
		line-height:normal !important;
		padding:3px 25px 3px 10px !important;
	
	}
	
/* ---- Content block overides (Primary)---- */
.mainTeaserWithScrolling img {
	float:right;
	margin-right: 0;
	margin-left: 10px;
}
.teaserList li img {
	float:right;
	margin-left:10px;
	margin-right:0;
}
.teaserList li p.small {
	float:right;
}
#primary-content .teaserList.horizontal li {
	float:right;
}
	#primary-content .horizontal li.even {
		clear:left;
		margin-right:25px !important;
		width:255px;
	}
	#primary-content .horizontal li.odd {
		clear:left;
		margin-right:0 !important;
		width:260px;
	}
#primary-content a.moreLink:link,
#primary-content a.moreLink:visited,
#primary-content a.moreLink:hover,
#primary-content a.moreLink:active {
	position:absolute;
	top:0;
	left:0;
	right:auto;
	background:transparent url(../display_images/bullets/bullet_mirror.gif) no-repeat scroll right center;
	padding:0 10px 0 0 !Important;
}
.bullet {
	background:url(../display_images/bullets/bullet_mirror.gif) right center no-repeat !important;
	padding-right:10px !important;
	float:right;
}
#primary-content .hascolumns {
	 padding: 0;
	 width: 544px; /* clearing folat for IE on highlight box only needs to be done when inner image si floated*/
	 overflow: hidden;
}

	h2.highlightheader{
		margin: 0 !important;
		height: 1.8em
	}
	.hascolumns ul {
		width: 50%;
		margin: 10px 10px 0 0;
	}
	.hascolumns p.bullet {
		float: right;
		width: 40%;
		margin: 10px;
	}
	.highlightbox .columnIllustration {
		float:left;
		margin-right:20px;
		clear: both;
		margin: 10px 0 10px 10px;
	}
.scroller {
	direction: rtl;
}
	.scrollernav {
		left: 0;
		right: auto;
		width:40px;
		direction:rtl !important;
	}
	
	.caroufredsel_wrapper {
		left: 30px !important;
	}
	#buttonNav.btnavigation  {
		left: 0;
		right: auto;
		width:80px;
		direction:rtl !important;
	}
	
	.scrollernav a.previous, .scrollernav a.next, .scrollernav a.lightboxprevious, .scrollernav a.lightboxnext {
		display:block !important;
		text-indent: -5000px !important;
	}

	.scrollernav a.previous, .scrollernav a.lightboxprevious{
		margin:0;
		float:right;
		background-image:url(../display_images/buttons/arrowswoosh_right_active.gif) !important;
	}
	.scrollernav a.next, .scrollernav a.lightboxnext{
		background-image:url(../display_images/buttons/arrowswoosh_left_active.gif) !important;
	}
	
	.scroller .teaserList{
	}
		.scroller .teaserList li{
			float: right;
			padding-left:50px !important;
			margin-right:0px !important;
		}

		.scroller .teaserList h3{
			
		}
.tabbed{

}
.tabbed ul.tabs li{
	float:right !important;
	padding:6px 5px !important;
	width:73px !important;
	margin-right:0px !important;
	margin-left:1px !important;
}
.inline{
	float:right;
}
.popup #footer .address{
	float:left;
	padding:0;
	margin:0;
}
.popup ul#navprimaryfooter{
	float:right !important;
}

#gallery_preview{
	float:right;
	margin-left:30px;
	margin-right:0px;
}

#gallery_text{
	float:left;
}
ul#gallery{
	float:left;
}
	ul#gallery li{
		float:right;
	}
#lightbox{
}
	#lightboxTitle{
		text-align:right;
	}
	#lightboxDetails{
	
	}	
		#lightboxCaption{
			float:right;
			width:370px;
		}
		#lightboxCopyright{
			float:right;
		}
		#lightboxDownload{
			clear:right;
			text-align:right;
			float:right;
		}
		#keyboardMsg{
			left:10px;
			right:auto;
			float:left; 
		}
		#lightbox_gallery_pager{
			float:left;
			width:120px;
		}

.highlights_More a.moreLink {
	  background-image: url("../display_images/bullets/bullet_mirror.gif");
    background-position: right center;
    left: 0;
    padding: 0 10px 0 0;
    position: absolute;
    right: auto;
    text-align: left;
    top: 0;
}

.share-button {
    float: left;
    margin-bottom: 10px;
    margin-left: 10px;
}

.share-button .fb-share, .share-button .tw-share, .share-button .share_text {
    margin-right: 4px;
}
