/*------ INFO ------*/
/*
FILENAME: structure.css 
DATE CREATED: 23 November 2009
PROJECT: Sapo Campus - Universidade de Aveiro 
USED BY: SAPO Campus Services
AUTHOR: Pedro Correia - pedroncorreia@ua.pt
RESET: file reset.css, eric meyer's css reset
*/
/*------ END INFO ------*/

/* general declarations */

.clear { clear: both; }

#mrec1 {
	margin: 10px 0 10px 0;
}

html {
	font-family: Arial, Helvetica, Sans-Serif;
	font-size: 16px;
}

body {
	font-size: 62.5%; /* 1em = 10px */
	padding: 0 2em;
	background-color: white;
}

/*esconder barras no inicio para evitar flash of unstyled content*/
#campusBarTop {
        display: block;
        visibility: hidden;
        height: 52px;
        overflow: hidden;
 }

 #campusBarFooter {
        display: none;
 }

#wrappergeral {
	width: 955px;
	margin: 0 auto;
}

a,
a:link { 
	text-decoration: none;
	color: #AAD22D;
}

a:visited { color:#5F5F5F; }

a:hover {
	text-decoration: none; 
	cursor: pointer;
	/*color: white;*/
	color: #5F5F5F;
}

.avatar1 {
	height: 17px;
	width: 10px;
	display: inline-block;
	background: transparent url(/imgs/campus/avatar1.png) no-repeat;
}

/* title, logo */
div#title h1#siteLogo {
	background:transparent url(/imgs/campus/logo_fotos_beta.png) no-repeat scroll 0 0;
	float:right;
	height:43px;
	margin:0.5em 0 0;
	padding:0;
	text-indent:-9999em;
	width:239px;
}

div#title h2#pageTitle {
	background:transparent url(/imgs/campus/avatar.png) no-repeat scroll 0 0;
	float:left;
	font-size:1.6em;
	font-weight:bold;
	margin:0.9em 0 0 0;
	padding:0 0 0 1.3em;
	color: #7F8182;
	height: 20px;
}

/* rightside and leftside menus */
div#subnav {
    float: left;
    width: 100%;
    margin: 22px 0 30px 0;
    position: relative;
	z-index: 1; /*This is for IE 7*/
    /*z-index: 1000;*/
}

div#subnav ul li a span.dropdownarrow {
	background-image: url(/imgs/campus/sprites.png);
	background-position: -300px -10px;
	width: 20px;
	height: 20px;
	position: absolute;
	right: 0px;
	top: 0px;
	text-indent: 9999px;
}

div#subnav ul li a:hover span.dropdownarrow,
div#subnav ul li a:active span.dropdownarrow,
div#subnav ul li a.hover span.dropdownarrow {
	background-image: url(/imgs/campus/sprites.png);
	background-position: -280px -30px;
	width: 20px;
	height: 20px;
	position: absolute;
	right: 0px;
	top: 0px;
	text-indent: 9999px;
}

div#subnav div.menu-container {
	position: absolute; 
	width: 95px;
	top: 20px;
	left: 0;
	border-top: 1px solid white;
}

/* leftside menus */

/* level one */
ul#contentsubnav                        { position: relative; width: 100%; }
ul#contentsubnav  li                      { float: left; width: 95px; margin-right: 3px; font-size: 1.2em; position: relative; }
ul#contentsubnav  a:hover		            { color: #fff; }
ul#contentsubnav  li a                    {  display: block; float: left; width: 88px; font-weight: bold; color: White; background-color: rgb(95, 95, 95); padding: 4px 0px 4px 7px; position: relative; z-index: 2000; }
ul#contentsubnav  li a:hover,
ul#contentsubnav  li a.hover              { background-color: rgb(170, 210, 45); position: relative; }

/* level two */
ul#contentsubnav  ul 						{ display: none; position: absolute; top: 0; left: 0; width: 126px; z-index: 1000; border-top: 1px solid white; }
ul#contentsubnav  ul li 					{ font-weight: normal; }
ul#contentsubnav  ul li a					{ display: block; font-size: 11px; background: rgb(95, 95, 95) !important; font-weight: normal;} 
ul#contentsubnav  ul li a:hover			{ display: block; background: rgb(170, 210, 45) !important; } 
			
div#subnav li.stretch div.menu-container { width: 126px; }
div#subnav li.more-options { border-top: 1px solid white; }
			
ul#contentsubnav li.stretch { width: 126px; }
ul#contentsubnav li.stretch a { width: 118px; }

div#subnav ul#contentsubnav li p { border-top: 1px solid white; }

/* rightside menus */
div#subnav ul#usersubnav { float: right; }

/* level one */
ul#usersubnav { position: relative; width: 300px; }
ul#usersubnav li { float: right; width: 98px; font-size: 1.2em; position: relative; }
ul#usersubnav .subnav { margin-right: 3px; }
ul#usersubnav a:hover { color: white; }
ul#usersubnav li a {  display: block; float: left; width: 89px; font-weight: bold; color: White; background-color: rgb(95, 95, 95); padding: 4px 0px 4px 7px; position: relative; z-index: 1000; }
ul#usersubnav li a:hover,
ul#usersubnav li a.hover { background-color: rgb(170, 210, 45); position: relative; }

/* level two */
ul#usersubnav  ul 						{ display: none; position: absolute; top: 0; left: 0; width: 81px; z-index: 1000; border-top: 1px solid white; }
ul#usersubnav  ul li 					{ font-weight: normal; width: 81px; margin: 0 0 0 0; }
ul#usersubnav  ul li a					{ display: block; font-size: 11px; background: rgb(95, 95, 95) !important; width: 74px; font-weight: normal;} 
ul#usersubnav  ul li a:hover			{ display: block; background: rgb(170, 210, 45) !important; } 

div#subnav ul#usersubnav div.menu-container { width: 81px; }

div#subnav ul#usersubnav li p { border-top: 1px solid white; }

/* container and area */
#container {
	position: relative;
	float: left;
	width: 100%;
}
	
	#cleft {
		float: left;
		position: relative;
		width: 620px;
	}
	
	.area {
		/*float: left;*/
		overflow: hidden;
		width: 620px;
		margin-bottom: 20px;
	}
	
		/* headerbar */
		.area .header {
			float: left;
			width: 100%;
		}
		
			.area .header a, .area .header a:link { color:#5F5F5F; }
			.area .header a:visited { color:#9B9B9B; }
			.area .header a:hover { color: white; }
		
				.area .header .line1 {
					position: relative;
					display: block;
					width: 100%;
					height: 20px;
					background-color: rgb(235, 235, 235);
				}
				
					.area .header .line1 .title {
						margin-right: 3px;
						color: #555;
						display: block;
						font-size: 1.1em;
						font-weight: bold;
						padding: 4px 0 0 7px;
						float: left;
						width: 88px; /* +2 px padding = 84*/
						height: 16px;
					}
					
					.area .header .line1 .info {
						color: rgb(95, 95, 95);
						display: inline;
						font-size: 1.1em;
						font-weight: normal;
						float: left;
						padding: 4px 0 0 4px;
					}
					
					.area .header .line1 .nav {
						display: inline;
						float: right;
						color: rgb(95, 95, 95);
						font-size: 1.1em;
						padding: 5px 0 2px 0;
					}
					
							.navicon {
								background-image: url(/imgs/campus/sprites_nav.png);
								background-repeat: no-repeat;
								float: left;
								height: 13px;
								width: 13px;
								margin-right: 4px;
								text-indent: -9999px;
								vertical-align: -3px;
							}
							
							a.navicon:hover { background-color: transparent; }
							
								a.arrowleft { background-position: -21px -370px; }
								
								a.arrowleft.inactive {
									background-position: -2px -370px;
									cursor: default;
								}
									
									a.arrowleft.inactive:hover {
										cursor: default;
									}
									
									a.arrowleft:hover {
										background-position: -2px -370px;
									}
									
								a.arrowright { background-position: -22px -354px; }
								
								a.arrowright.inactive {
									background-position: -3px -354px;
									cursor: default;
								}
								
									a.arrowright.inactive:hover {
										cursor: default;
									}
								
									a.arrowright:hover { background-position: -3px -354px; }
									
								a.close { background-position: -22px -402px; }
									a.close:hover { background-position: -3px -402px; }
									
								a.shut { background-position: -22px -386px; }								
									a.shut:hover { background-position: -3px -386px; }		
					
				.area .header .line2 {
					position: relative;
					height: 16px;
					margin-top: 5px;
					color: rgb(95, 95, 95);				
				}
				
					.area .header .line2 .vis {
						display: inline;
						position: absolute;
					}
					
							.visicon {
								background-image: url(/imgs/campus/sprites.png);
								width: 15px;
								height: 15px;
								display: block;
								float: left;
								text-indent: 9999px;
								overflow: hidden;
							}
					
								.vis1 { background-position: -200px 20px; }
									.vis1.active { background-position: -200px 40px; }									
									.vis1:hover { background-position: -200px 0px; }
									
								.vis2 {	background-position: -220px 20px; }
									.vis2.active { background-position: -220px 40px; }									
									.vis2:hover { background-position: -220px 0px; }									

								.vis3 {	background-position: -240px 20px; }
									.vis3.active { background-position: -240px 40px; }										
									.vis3:hover { background-position: -240px 0px; }
														
							.spacer {
								background-image: url(/imgs/campus/sprites.png);
								background-position: -60px -20px;
								width: 2px;
								height: 10px;
								display: block;
								float: left;
								margin: 0 2px 0 2px;
							}
							
					.area .header .line2 .numbers {
						display: inline;
						position: relative;
						margin-left: 98px;
					}
					
					.area .header .line2 .sort {
						display: inline;
						position: absolute;
						right: 0px;
					}
					
					.area .header .line2 .sort a:hover { color: #AAD22D; }
		
		/* main content */
		.area .content.fit{
			color: rgb(155, 155, 155);
			width: 620px;
      float: left;
			margin: 10px 0 0 0;
		}
		
		.area .content{
			color: rgb(155, 155, 155);
      		float: left;
			margin-top: 10px;
			width: 100%;
		}
		
  		#recentes .content > div,
  		#votadas .content > div,
  		#voted .content > div,
  		#maisvistas .content > div,
  		#maiscomentadas .content > div,
  		#contentbox_albums, 
  		#contentbox {
  		  margin-right: -40px;
      }
    
    .area .tagsbox > div,
    .area .content .favoritosbox,
    .area .content .tags {
      margin-right: 0;
      width: 100%;
    }
    
    .area .myphotosbox{
      margin-right: -40px;
    }
    
   
		.area .tags {
			width: 585px; 
		}
		
	
				
		.area .footer {
			margin: 0 auto;
			width: 585px;
			clear: both;
		}
				
			.area .footer .pag {
				color:#9B9B9B;
				font-size:1em;
				text-align:center;
			}
			
				.area .footer .pag u {
					padding:2px 6px;
				}
				
				.area .footer .pag p.sapo_pagination span.sapo_pagination_current {
					background-color:#AAD22D;
					color:white;
					margin-left:2px;
					padding:2px 6px;
				}
				
				.area .footer .pag a, .area .footer .pag p.sapo_pagination a {
					border:0 none;
					padding:2px 6px;
				}
				
				.area .footer .pag a:hover, .area .footer .pag p.sapo_pagination a:hover {
					background-color:#AAD22D;
					color:white;
				}

				
	/* sidebar */
	.sidebar {
		width: 300px;
		position: relative;
		float: right;
	}
	
		.sidebar a,
		.sidebar a:link { 
			color: gray;
			text-decoration: none;
		}
		
		.sidebar a:visited {
			color:#9B9B9B;
			text-decoration: none;
		}
		
		.sidebar a:hover {
			background-color:#AAD22D; color: white; text-decoration: none;
		}
	
		.sidebar .search {
			background-color: #EBEBEB;
			height: 20px;
			display: block;
			position: relative;
			color: #5F5F5F;
		}
		
			.sidebar .search a {
				float: left;
				display: block;
				position: relative;
			}
			
			.sidebar .search a.sidehome {
				background-image: url(/imgs/campus/homesmall.png);
				background-repeat: no-repeat;
				height: 11px;
				width: 11px;
				margin-left: 4px;
				text-indent: -9999px;
				position: relative;
				bottom: -5px;
				left: 10px;
				background-color: #EBEBEB;
				color: white;
				display: block;
				float: left;
			}
			
				.sidebar .search .sidehome:hover,
				.sidebar .search .sidehome:focus {
					background-image: url(/imgs/campus/homesmallhover.png);
				}
				
				
				
				
				
			.sidebar .search .form {
				float: left;
				position: absolute;
				right: 10px;
				top: 3px;
				height: 12px;
			}
			
			.sidebar .search input {
				border: medium none;
				font-size: 10px;
				position: relative;
				float: left;
				height: 12px;
			}
				
			.sidebar .search a.searchlink {
				background-image: url(/imgs/campus/searchsmall.png);
				background-repeat: no-repeat;
				height: 11px;
				width: 11px;
				margin-left: 4px;
				text-indent: -9999px;
				position: relative;
				bottom: -2px;
				color: white;
				display: block;
				float: left;
			}
			
			.sidebar .search input.manage {
				border: medium none;
				font-size: 10px;
				position: relative;
				float: left;
				height: 12px;
				top: 3px;
				left: 103px;
			}
				
			.sidebar .search a.searchlink.manage {
				background-image: url(/imgs/campus/searchsmall.png);
				background-repeat: no-repeat;
				height: 11px;
				width: 11px;
				margin-left: 4px;
				text-indent: -9999px;
				position: relative;
				top: 5px;
				color: white;
				display: block;
				float: left;
				left: 103px;
			}
			
				.sidebar .search a:hover,
				.sidebar .search a:focus {
					background-image: url(/imgs/campus/searchsmallhover.png);
					background-color: none;
				}
				
						
				
			.sidebar .searchform .form {
				float: left;
				position: absolute;
				right: 10px;
				top: 3px;
				height: 12px;
			}
			
			.sidebar .searchform input {
				border: medium none;
				font-size: 10px;
				position: relative;
				float: left;
				height: 12px;
			}
				
			.sidebar .searchform .searchlink {
				margin-left: 4px;				
				position: relative;
				bottom: -2px;				
				float: left;
			}
			
			.sidebar .searchform input.manage {
				border: medium none;
				font-size: 10px;
				position: relative;
				float: left;
				height: 12px;
				top: 3px;
				left: 103px;
			}
				
			.sidebar .searchform a.searchlink.manage {
				background-image: url(/imgs/campus/searchsmall.png);
				background-repeat: no-repeat;
				height: 11px;
				width: 11px;
				margin-left: 4px;
				text-indent: -9999px;
				position: relative;
				top: 5px;
				color: white;
				display: block;
				float: left;
				left: 103px;
			}
			
				.sidebar .searchform a:hover,
				.sidebar .searchform a:focus {
					background-image: url(/imgs/campus/searchsmallhover.png);
					background-color: #EBEBEB;
				}
				
		.sidebar .sidebarcontent { margin-top: 10px; }

#cleft .content p.fotoPlus {
	height: 25px;
	margin-bottom: 10px;
}

#cleft .content p.fotoPlus a {
	display: block;
	height: 25px;
	width: 25px;
	background: transparent url('/imgs/campus/fotoPlus.png') 0 0 no-repeat;
	text-indent: -9999px;
	float: right;
	/*margin-right: 36px;*/
}

#cleft .content .fotoeditimg p.fotoPlus a {
	/*margin-right: 10px;*/
}

#cleft .content p.fotoPlus a:hover { background: transparent url('/imgs/campus/fotoPlus.png') 0 0 no-repeat; }
#cleft .content p.fotoPlus a#realSize { background-position: 0 -24px;}
#cleft .content p.fotoPlus a#realSize:hover { background-position: 0 0;}