@charset "utf-8";
/* CSS Document */

body{
	background-color: #f2f2f2;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
 	line-height: 1.5;
 	color: #555;
	margin:0;
	padding:0;
	}
	
p {
  display: block;
  -webkit-margin-before: 1em;
  -webkit-margin-after: 1em;
  -webkit-margin-start: 0px;
  -webkit-margin-end: 0px;
}

a{
	  text-decoration: none;
	  color:inherit;
}

a:hover{
	color:#3a3c3d;
}

.footer_m:hover{
	color:#cf2056;
	}

.pink_txt{
	color:#cf2056;
}

.margin20{
	margin:0 0 20px 0;
	}
	
#container {
  width: 100%;
  padding: 50px 0 100px 0;
}

#content {
  float: left;
  width: 100%;
  margin-bottom:90px;
}

/*Primary*/

#primary{
	width: auto;
  	margin: 0 40px 0 205px;
  	float: left;
  	position:relative;
	}
	
.pieces_container{
position: relative;

}

.pieces{
	width: 230px;
  height: 290px;
  margin: 0 0 20px 25px;
  padding: 0;
  float: left;
  background-color:#FFF;
  position:relative;
  box-shadow: 1px 1px 1px #dfdfdf;
}

.about_photo{
	margin: 0 0 20px 25px;
  float: left;
    padding: 15px;
  background-color:#FFF;
  position:relative;
  box-shadow: 1px 1px 1px #dfdfdf;
	}

.about_me{
	background-color:#FFF;
	width: 485px;
	margin: 0 0 20px 25px;
	  float: left;
  position:relative;
  box-shadow: 1px 1px 1px #dfdfdf;
  padding: 20px 15px 15px 15px;
}

.piece_title{
  font-size: 12px;
  border: none;
  margin: 0;
  padding: 20px 15px 15px 15px;
  line-height: 16px;
  margin: 0;
  color: #66696d;
  font-weight:bold;
	}

.piece_descr{
	  padding: 0 15px 20px 15px;
  font-size: 11px;
  line-height: 16px;
}


.arrow{
  right: 15px;
  background-image:url(images/arrow.gif);
  width: 22px;
  height: 11px;
 position:absolute;
  top: 159px;
	}

/*Main Menu*/

#menu_bar {
  position: fixed;
  width: 150px;
  left: 0;
  margin: 0 0 0 40px;
  
}

.logo{
	display:block;
	color:#7b7d80;
	}
	
.seperator {
	overflow:auto;
  display:block;
  outline-color:#F00;
  outline-width:thick;
}

.line {
  border-bottom: 1px solid #d6d6d6;
  float: left;
  width: 20px;
}

.menu_title{
	color: #3a3c3d;
	font-size: 12px;
 	margin: 0 0 10px 0;
  	line-height:20px;
	padding:0;
	display:block;
	font-weight:normal;
	}	
	
.menu{
  list-style: none;
  margin: 0;
  padding: 0;
  line-height: 18px;
  color:#96999d;
	}
	
#footer{
	text-align:center;
	clear: both;
background:#3a3c3d;
position:fixed;
bottom:0px;
right:0px;
left:0px;
color:#CCC;
	}
	
		/*meuq van guido!!*/
	.piece_thumb_img{
		width	:230px;
		height	:170px;
		position:relative;
		display: inline-block;
	}
	
	.piece_thumb_text{
		display:none;
		}
	
	.overlay{
		position:absolute;
		background-image:url(images/zoomIcon.png);
		background-repeat:no-repeat;
		opacity:0;
		transition: opacity .25s ease-in-out;
   		-moz-transition: opacity .25s ease-in-out;
   		-webkit-transition: opacity .25s ease-in-out;
		background-position:center;
		top:0;
		left:0;
		width	:100%;
		height	:170px;
		cursor:pointer;


	}
	.overlay:hover{
		opacity:1;
	}
	
	#preloaderContainer{
		/*position:absolute;*/
		position:fixed;
		top:0;
		left:0;
		width:100%;
		height:100%;
		background-color:rgba(00,00,00,0.8);
		opacity:0;
		z-index:99;
		
		display:table;
	}
	#imageView{
		position:fixed;
		top:0;
		left:0;
		width:100%;
		height:100%;
		opacity:1;
		
		display:table;
		background-color:rgba(00,00,00,0);
		z-index:100;
	}
		#center, #preloaderCenter{
		display:table-cell;
		vertical-align:middle;
		text-align:center;
	}
	#overlayImageBox{
		margin:0 auto;
		/*width:-moz-fit-content;*/
		height:auto;
		padding:10px;
		background-color:white;
		opacity:1;
		position:relative;
		text-align:center;
	}

	
	#overlayImage{
		display:block;
	}
	
	#image-description{
		text-align: left;
    	padding: 5px 0 0 5px;
		font-style:italic;
		}
	
	#closeBox{
		position:absolute;
		width:25px;
		height:25px;
		top:0;
		right:0;
		background-image:url(images/cross.gif);
		background-repeat:no-repeat;
		background-position:bottom left;
		background-color:white;
		cursor:pointer;
		z-index:10;
	}
	
	.fs-overlay-button {
		position:absolute;
		bottom:0;
		right:0;
		top:0;
		left:0;
		background-image:url(images/fullscreen-512.png);
		background-repeat:no-repeat;
		background-position:top left;
		cursor:pointer;
}
	
	#thumbHolder{
		margin:0 auto;
		width:-moz-fit-content;
	}

	.thumb{
		display:inline-block;
		/*width:50px;*/
		height:60px;
		margin:20px 15px 0px 15px;	
		cursor:pointer;
		border: solid 7px #FFF;
		transition: opacity .25s ease-in-out;
   		-moz-transition: opacity .25s ease-in-out;
   		-webkit-transition: opacity .25s ease-in-out;
	}
	.chosen{
		opacity:0.5;
	}
	#preloader{
		width:50px;
		height:50px;
	}