/* CSS Document */

@font-face {
  font-family: 'Cuprum';
  font-style: normal;
  font-weight: normal;
  src: url('/Common/reportage/js/Cuprumie.ttf');
  src: local('Cuprum'), url('/Common/reportage/js/Cuprum.ttf') format('truetype');
}

/* Author Ashoor Namrood, Syrox */

body {
	margin:0px; padding:0px 20px 0px 20px; background-color:#393d3e; font-family:Arial, Helvetica, sans-serif; color:#ffffff; /* Always define 0px margin and padding, never use the Body tag to specify spaces. Body tags should only be used to specify backgrounds, font-family's (i.e. Arial, Verdana etc), a container class (i.e. line 39, .container) should be used to specify spaces. */
}

	body.ipad {
	}

h1 {
	margin:0px; padding:0px; font-size:22px; line-height:26px; font-weight:100; font-family: 'Cuprum', Arial, serif;  
}

	h1 span {
		color:#999999; font-size:16px; line-height:18px;
	}

h1.firefoxhone {
	font-size:18px; line-height:26px; font-family:Arial, Helvetica, sans-serif;
}

	h1.firefoxhone span {
		font-size:13px; line-height:18px; font-family:Arial, Helvetica, sans-serif;
	}

h2 {
	margin:0px; padding:0px; font-size:18px; font-weight:100; font-family: 'Cuprum', Arial, serif;  
}

h3 {
	margin:0px; padding:0px; font-size:14px; font-weight:100; font-family: 'Cuprum', Arial, serif;   color:#999999;
}

h4 {
	margin:0px; padding:0px; /* */
}

h5 {
	margin:0px; padding:0px; /* */
}

h6 {
	margin:0px; padding:0px; /* */
}

a {
	text-decoration:none; color:#ffffff; -webkit-appearance: none; outline: none;
}

a {
	text-decoration:none; color:#ffffff; -webkit-appearance: none; outline: none;
}

div, a {
	-webkit-appearance: none !important; outline: none !important;
}

a img {
	border:0px; /* This defines that any images placed inside a <a href> tag or a .NET 2.2 Hyperlink have no default "blue" border that Internet Explorer adds by default */
}

a.selected-item {
	color:#ffffff !important;
}

p {
	margin:0px; padding:0px; font-size:12px; line-height:16px; /* Rule: when specifying font-size, line-height should always be roughly 3px more, so, i.e. 11px font-size = 14px line-height. */
}

	p a {
		color:#639334; text-decoration:underline;
	}
	
		p a:hover {
			/*color:#999999;*/ text-decoration:none;
		}
		
ul {
	margin:0px; padding:0px;
}

ul li {
	margin:0px; padding:0px; list-style-type:none;
}

ul.bulletpoints {
	margin:0px 0px 15px 5px; padding:0px 0px 0px 5px;
}

ul.bulletpoints li {
	margin:0px 0px 0px 5px; padding:0px 0px 0px 5px; list-style-type:disc;
}




div.clear {
	clear:both; line-height:0pt; font-size:0px; height:0px; overflow:hidden;/* When a CSS class has an auto height (i.e. line 39, .container), it means that it'll grow in height according to the elements inside it. However, due to cross-browser differences, some browsers will not comply with this rule as they dont take into account floated elements so the DIV is 0px in height effectively. 'div.clear' is an "invisible" DIV which enforces this rule. */
}

/* ******************************** */
/* CSS Cross-browser clear solution */

* html div.clear {
	line-height:0px; .line-height:0px; 
}

div.clear {
	.line-height:0px; .margin-top:-2px; 
}

/* CSS Cross-browser clear solution */
/* ******************************** */




.container {
	width:auto; height:auto; margin:auto; /* This is used to centre an element. Some people use text-align:center but that also centers text and you have to specify an inner DIV with a left or right text align which can then get slightly messy. */
}

.container-alternative {
	width:auto; min-height:500px; height:auto !important; height:500px; margin:auto; /* This DIV is an alternative container. It works just the same as the previous container (i.e. line 39, .container), but has a minimum height defined. This means that the DIV starts off at a certain height of 500px (in this example) and increases in height should its inner elements require it to. */
}

.outerheader {
	position:relative; width:auto; height:auto; margin:auto; border-bottom:1px solid #545a5c; /* For detailed information on, CSS Positioning go to: http://webdesign.about.com/od/advancedcss/a/aa061307.htm */
}

.header {
	position:relative; width:auto; height:78px; margin:auto; border-bottom:1px solid #222424; /* For detailed information on, CSS Positioning go to: http://webdesign.about.com/od/advancedcss/a/aa061307.htm */
}

.header a.replogo {
	position:absolute; top:16px; left:30px; /* For detailed information on, CSS Positioning go to: http://webdesign.about.com/od/advancedcss/a/aa061307.htm */
}

.header .photogrphrname {
	position:absolute; top:37px; left:300px; /* For detailed information on, CSS Positioning go to: http://webdesign.about.com/od/advancedcss/a/aa061307.htm */
}

.arrowsociallist#arrowlistpopup {
	position:absolute; top:-12px; right:45px; z-index:3000; /* For detailed information on, CSS Positioning go to: http://webdesign.about.com/od/advancedcss/a/aa061307.htm */
}

.content {
	width:auto; min-height:500px; height:auto !important; height:462px; margin:auto; /* I have given the .content DIV a min-height of 500px. This means that the container-alternative DIV which I had given a min-height of 500px will now rise to 650px high when taking into account the heights of the header (100px) and the footer (50px). */
}

.footer {
	width:auto; height:50px; margin:auto; /* padding-top:10px; */
}


.footer p {
font-size:11px; line-height:14px;
}


/* sitwide elements */

.mainimagearea {
	padding:12px 0px 0px 0px; height:auto; width:auto;
}

	.mainimagearea img {
		margin-right:10px; float:left; /*opacity:.10;filter: alpha(opacity=10); -moz-opacity:0.10;*/
	}

	
	.mainimagearea img.firstimageno {
		margin-right:10px; /* opacity:1;filter: alpha(opacity=100); -moz-opacity:1;*/
	}
	

	.biomainimagearea img {
		margin-right:10px; /*opacity:.10;filter: alpha(opacity=10); -moz-opacity:0.10;*/
	}
	

	#leadingFeatureContainer img {
		margin-right:10px; /*opacity:.10;filter: alpha(opacity=10); -moz-opacity:0.10;*/
	}
	

.portfoliolinks {
	padding:0px 0px 0px 0px; height:auto; width:auto;
}

	.portfoliolinks ul { 
		margin:0px; margin:0px;
	}
	
		.portfoliolinks ul li {
			margin:0px; padding:0px 10px 0px 0px; float:left;
		}
		
			.portfoliolinks ul li a {
				margin:0px; margin:0px;
			}
			
				.portfoliolinks ul li a img {
					margin:0px; margin:0px; opacity:.60;filter: alpha(opacity=60); -moz-opacity:0.60; border:1px solid #393d3e;
				}
				
				.portfoliolinks ul li a:hover img {
					opacity:1;filter: alpha(opacity=100); -moz-opacity:1; border:1px solid #639334;
				}
				
	.portfoliolinks img.firstimageno {
		margin-right:10px; /* opacity:1;filter: alpha(opacity=100); -moz-opacity:1;*/
	}
	


.buttonbox {
	padding:15px 5px 5px 10px; height:auto; width:auto; display:block; float:left;
}

.featuresbb {
	padding:83px 15px 5px 20px; width:170px; position: absolute; right:0px; top:0px;
}




a.arrowlink {
	display:block; height:20px; padding:5px 5px 5px 37px; font-family: 'Cuprum', Arial, serif; font-size:16px; line-height:20px;
}

	a.arrowlink:hover {
		color:#999999;
	}

	.arrowdown {
		background:url(/Images/reportage/reportagelayout/big-arrow-down.gif) 0% 50% no-repeat;
	}

	.arrowleft {
		background:url(/Images/reportage/reportagelayout/big-arrow-left.gif) 10px 50% no-repeat;
	}

	.arrowright {
		background:url(/Images/reportage/reportagelayout/big-arrow-right.gif) 10px 50% no-repeat;
	}

	.arrowup {
		background:url(/Images/reportage/reportagelayout/big-arrow-up.gif) 0% 50% no-repeat;
	}

form {
	display:inline;
}

.news-items-pb {
	padding-bottom:105px; position:relative; height:auto; width:auto;
}

.news-items-pb .buttonbox {
	position:absolute; bottom:10px; left:40px; height: 30px;
}

.cursorRight{
   	cursor:url(/common/reportage/css/icons/next.cur), default;
}
.cursorLeft{
   	cursor:url(/common/reportage/css/icons/prev.cur), default;
}
.cursorPlus{
    cursor:url(/common/reportage/css/icons/plus.cur), default;
}
.cursorMinus{
    cursor:url(/common/reportage/css/icons/minus.cur), default;
}
.cursorNormal{
    cursor:default;
}

.down{
    background-image:url(../icons/down.png);
}
.up{
    background-image:url(../icons/up.png);
}


#thumbsContainer{
    height:79px;
    display:block;
    margin: 0;   
}
#thumbsWrapper img{
    float:left;
    margin-right:3px;
    display:block;
    cursor:pointer;
    opacity:0.4;
    filter:progid:DXImageTransform.Microsoft.Alpha(opacity=40);
	border:1px solid #393d3e;
}


#loading{
    display:none;
    width:50px;
    height:50px;
    position:absolute;
    top:40%;
    left:50%;
    margin-left:-24px;
    background:transparent url(../icons/loading.gif) no-repeat top left;
}


/* LOCATION TAGS */
/*.map-controls { height:25px; padding:5px; background:url(../../../Images/reportage/reportagelayout/bg.png) 0 0 repeat; }*/
.continent-tag { 
	float:left;
}
.location-options { 
	float:right; padding-right:4px;
}
.continent-tag p { 
	float:left; padding-right:15px; line-height:20px;
}
.continent-tag .continentdrop {
	float:left; width:120px; border:1px solid #ffffff !important; margin-right:15px !important; height:23px; line-height:20px; 
}
.continent-tag input {
	float:left; width:200px; height:21px; line-height:16px !important; border:0px !important; padding:0px 0px 2px 5px; font-size:12px !important;
}
.location-options p { 
	float:left; padding-right:10px; line-height:20px;
}

.location-options label { font-size:12px !important; cursor:pointer; }
.location-options table { float:left; }
.location-options input { display:none; }
.location-options span label { background:url(../../../Images/reportage/reportagelayout/marker.png) 0 0 no-repeat; padding:0px 5px 0px 17px; margin-right:5px; opacity: 0.5; filter: alpha(opacity=50); }
.location-options span.radio-two label { background:url(../../../Images/reportage/reportagelayout/camera.png) 0 0 no-repeat; padding-left:22px;  }
.location-options span:hover label, .location-options span.active label { opacity: 1; filter: alpha(opacity=100); }