/*	Authors		Craig Rozynski craigrozynski.com, dinosaurswithlaserz.com 
							Marco Lago marcolago.com
		Version		2.0 2011-07-15 */

/* CSS Reset (customised) */

.fluid_squares {
	margin: 0;
	padding: 0;
	border: 0;
	font: inherit;
	vertical-align: baseline;
}
.fluid_squares { display: block; }
.fluid_squares a:hover, .fluid_squares a:active { outline: none; }

/* Primary Styles */
  
.fluid_squares {
}
.fluid_squares a, .fluid_squares a:link, .fluid_squares a:visited, .fluid_squares a:active {
	float: left;
	width: 100%;
	height: auto;
	background-color:4a4a4a;
}

/* Media Queries */

/* Column Control Media Queries */


	.fluid_squares {
		max-width: 1600px;
		margin: 0 auto;
		overflow: hidden;
	}
	.fluid_squares a {
		-webkit-transition: background-color .3s linear;
		-moz-transition: -color .3s linear;
		transition: background-color .3s linear;
		text-decoration:none;
		cursor: hand;
		
	}
	/*.fluid_squares a:hover { background-color: #dfdfdf; }*/
	
	.fluid_squares a,.fluid_squares  a:link, .fluid_squares a:visited, .fluid_squares a:active{
		position: relative;
		top: 0;
		overflow: hidden;
		
	}
	.articol_info {
	display:block;
	position: absolute;
	height:70%;
	width:80%;
	z-index:2;
	background-color: #313131;
	color: #FFFFFF;
	opacity:0;
	filter:alpha(opacity=0); /* For IE8 and earlier */
		-webkit-transition: opacity 0.6s ease-in;
		-moz-transition: opacity 0.6s ease-in;
		transition: opacity 0.6s ease-in;	
	padding-top: 15%;
	padding-right: 10%;
	padding-bottom: 15%;
	padding-left: 10%;
	}
	
	.fluid_squares a:hover .articol_info {
		opacity:0.9;
		filter:alpha(opacity=90); /* For IE8 and earlier */	
	}	
	


		
	.articol_imagine { 
		background-color:#d0d0d0;
		display:block; 
		position: absolute;  
		height:100%; 
		width:100%; 
	}

	
	.articol_imagine img {
		opacity:0.85;
		filter:alpha(opacity=85); /* For IE8 and earlier */
		-webkit-transition: opacity 0.1s ease-in;
		-moz-transition: opacity 0.1s ease-in;
		transition: opacity 0.1s ease-in;
		position: absolute;  
	}
	

	.articol_nou {
		display:block;
		position: absolute;
		z-index:3;
		top: 0%;
		right: 0%; 
		padding: 4%;
		display:none;
	}	


	/*alternanta culoare fundal*/
	a.link1 .articol_imagine { background-color:#d0d0d0;}
	a.link2 .articol_imagine { background-color:#a2a2a2;}
	a.link3 .articol_imagine { background-color:#bfbfbf;}
	a.link4 .articol_imagine { background-color:#999999;}
	a.link5 .articol_imagine { background-color:#dfdfdf;}
	a.link6 .articol_imagine { background-color:#bababa;}
	
	.fluid_squares a:hover .articol_imagine img { 
		opacity:0.99;
		filter:alpha(opacity=99); /* For IE8 and earlier */	
	}

	.articol_categ, .articol_categ_activ {
	display:block;
	position: absolute;
	height:80%;
	width:80%;
	z-index:2;
	background-color: #4a4a4a;
	color: #FFFFFF;
	
	
	
	-webkit-transition: background-color .4s ease-in-out, box-shadow .4s ease-in-out;
	-moz-transition: background-color .4s ease-in-out, box-shadow .4s ease-in-out;
	transition: background-color .4s ease-in-out, box-shadow .4s ease-in-out;


	padding-top: 10%;
	padding-right: 10%;
	padding-bottom: 10%;
	padding-left: 10%;
	}
	.fluid_squares a:hover .articol_categ, .articol_categ_activ  {

		background-color: #da251d;
		
		-moz-box-shadow: inset 0px 0px 50px #b91d16;
		-webkit-box-shadow: inset 0px 0px 50px #b91d16;
		box-shadow: inset 0px 0px 50px #b91d16;
	}
	.articol_mai_mult {
	display:block;
	position: absolute;
	z-index:1;
	color: #B9B9B9;
	font-size: 500%;
	font-weight:bold;
	left: 10%;
	bottom: 5%;
	letter-spacing: -1px;
	}
	
	
	/* default 4 Column */
	.fluid_squares a, .fluid_squares a:link, .fluid_squares a:visited, .fluid_squares a:hover, .fluid_squares a:active {
		width: 25%;
		margin: 0 0 0 0;
		padding-bottom: 25%;
	}
	


	.articol_categ, .articol_categ_activ {
	font-size: 180%;
	}
	.articol_info {
	font-size: 130%;
	}		
	

@media screen and (min-width:1200px) {
/* FIFE Column */
	.fluid_squares a, .fluid_squares a:link, .fluid_squares a:visited, .fluid_squares a:hover, .fluid_squares a:active {
		width: 20%;
		margin: 0 0 0 0;
		padding-bottom: 20%;
	}
		
	
	.articol_categ, .articol_categ_activ {
	font-size: 180%;
	}
	.articol_info {
	font-size: 140%;
	}	
}

/* Four Column */

@media screen and (max-width:1200px) {
	.fluid_squares a, .fluid_squares a:link, .fluid_squares a:visited, .fluid_squares a:hover, .fluid_squares a:active {
		width: 25%;
		margin: 0 0 0 0;
		padding-bottom: 25%;
	}
	.articol_categ, .articol_categ_activ {
	font-size: 180%;
	}
	.articol_info {
	font-size: 130%;
	}	
}

@media screen and (max-width:700px) {
	.category, .fluid_squares a, .fluid_squares a:link, .fluid_squares a:visited, .fluid_squares a:hover, .fluid_squares a:active {
		width: 33%;
		margin: 0 0 0 0;
		padding-bottom: 33%;
	}		
	
	.articol_categ, .articol_categ_activ {
	font-size: 160%;
	}
	.articol_info {
	font-size: 110%;
	}
}

/* Two Column */

@media screen and (max-width:400px) {
	.fluid_squares a, .fluid_squares a:link,.fluid_squares  a:visited,.fluid_squares  a:hover,.fluid_squares  a:active{
		width: 50%;
		margin: 0 0 0 0;
		padding-bottom: 50%;
	}
	
	.articol_info {
	font-size: 120%;
	}	
	.articol_categ, .articol_categ_activ {
	font-size: 160%;
	}
}



/* Galerie foto */


	/*over pentru galerie foto*/
	.articol_imagine_galerie_over {
		display:block;
		position: absolute;
		height:100%;
		width:100%;
		z-index:2;
		background-color: #313131;
		color: #FFFFFF;
		opacity:0;
		filter:alpha(opacity=0); /* For IE8 and earlier */
		-webkit-transition: opacity 0.2s ease-in;
		-moz-transition: opacity 0.2s ease-in;
		transition: opacity 0.2s ease-in;	
	}
	

	
	/*over pentru galerie foto*/
	.fluid_squares a:hover .articol_imagine_galerie_over {
		opacity:0.3;
		filter:alpha(opacity=30); /* For IE8 and earlier */	
	}


	/*default 5 pe pagina*/

	#foto_galerie a, #foto_galerie a:link, #foto_galerie a:visited, #foto_galerie a:hover, #foto_galerie a:active{
		width: 18%;
		padding-bottom: 18%;
		margin: 0 2%  15px 0;
	}	


@media screen and (min-width:1300px) {
/* 6 Column */
	
	#foto_galerie a, #foto_galerie a:link, #foto_galerie a:visited, #foto_galerie a:hover, #foto_galerie a:active{
		width: 15%;
		padding-bottom: 15%;
		margin: 0 1.66%  15px 0;
	}		
		
}
/* 5 Coloane */
@media screen and (max-width:1300px) {
	#foto_galerie a, #foto_galerie a:link, #foto_galerie a:visited, #foto_galerie a:hover, #foto_galerie a:active{
		width: 18%;
		padding-bottom: 18%;
		margin: 0 2%  15px 0;
	}	

}
/* 4 Coloane */
@media screen and (max-width:800px) {	
	#foto_galerie a, #foto_galerie a:link, #foto_galerie a:visited, #foto_galerie a:hover, #foto_galerie a:active{
		width: 23%;
		padding-bottom: 23%;
		margin: 0 2%  13px 0;
	}		
}
/* 3 Coloane */
@media screen and (max-width:500px) {
	#foto_galerie a, #foto_galerie a:link, #foto_galerie a:visited, #foto_galerie a:hover, #foto_galerie a:active{
		width: 30%;
		padding-bottom: 30%;
		margin: 0 3%  10px 0;
	}		
	
}