.view-tenth img {
padding:4px;
max-width: 98%;
margin-top:16px;
margin-bottom:16px;
margin-left:auto;
margin-right:auto;
display:block;
border-radius:3px;
border:1px solid #444444;
   -webkit-transform: scale(1);
   -moz-transform: scale(1) rotate(0.02deg);;
   -o-transform: scale(1);
   -ms-transform: scale(1);
   transform: scale(1);
   -webkit-transition: all 0.9s;
   -moz-transition: all 0.9s;
   -o-transition: all 0.9s ease-in-out;
   -ms-transition: all 0.9s ease-in-out;
   transition: all 0.9s;
}

@media screen and (orientation: portrait) {
.view-tenth img  {
      max-width: 94%;
  }
}

@media screen and (orientation: landscape) {
.view-tenth img  {
      max-height: 72vh;
  }
}

.view-tenth .mask {
	position:fixed;
	opacity: 0.5;
	/*overflow:auto;*/
	display:inline-block;
	vertical-align:middle;
	-webkit-transform: scale(1) rotate(0.02deg);
	-moz-transform: scale(1);
	-o-transform: scale(1);
	-ms-transform: scale(1);
	transform: scale(1);
	-webkit-transition: all 0.7s linear;
	-moz-transition: all 0.7s linear;
	-o-transition: all 0.7s linear;
	-ms-transition: all 0.7s linear;
	transition: all 0.7s linear;
	-ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
	/*filter: alpha(opacity=0);*/
}

@media screen and (orientation: portrait) {
.view-tenth .mask  {
    max-width: 76%;
	height:auto;
  }
}

@media screen and (orientation: landscape) {
.view-tenth .mask  {
    max-width: 30%;
	height:auto;
  }
}

.view-tenth h2 {
	border-bottom: 1px solid rgba(0, 0, 0, 0.3);
	background: transparent;
	margin: 12px;
	color: DarkRed;
	-webkit-transform: scale(0);
	-moz-transform: scale(0);
	-o-transform: scale(0);
	-ms-transform: scale(0);
	transform: scale(0);
	-webkit-transition: all 0.7s linear;
	-moz-transition: all 0.7s linear rotate(0.02deg);
	-o-transition: all 0.7s linear;
	-ms-transition: all 0.7s linear;
	transition: all 0.7s linear;
	-ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   	filter: alpha(opacity=0);
   	opacity: 0;
}
.view-tenth p {
	/*font-family:'Open Sans', 'Myriad Pro', Arial, sans-serif;
	font-weight: 100;*/ 
	font-family: Georgia, serif;
	/*font-style: italic;*/
	font-size: 16px;
	margin: 12px;
	text-align:center;
	color: #111;
	-ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
	filter: alpha(opacity=0);
	opacity: 0;
	-webkit-transform: scale(1);
	-moz-transform: scale(1) rotate(0.02deg);
	-o-transform: scale(1);
	-ms-transform: scale(1);
	transform: scale(1);
	-webkit-transition: all 0.7s;
	-moz-transition: all 0.7s;
	-o-transition: all 0.7s linear;
	-ms-transition: all 0.7s linear;
	transition: all 0.8s;
}
.view-tenth a.info {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transform: scale(0);
   -moz-transform: scale(0);
   -o-transform: scale(0);
   -ms-transform: scale(0);
   transform: scale(0);
   -webkit-transition: all 0.8s linear;
   -moz-transition: all 0.8s linear;
   -o-transition: all 0.8s linear;
   -ms-transition: all 0.8s linear;
   transition: all 0.8s linear;
}
/*
.view-tenth:hover img {
   border-radius:4px;
   border:0px solid #000000;
   
   -webkit-transform: scale(2.5);
   -o-transform: scale(2.5);
   -ms-transform: scale(2.5);
   transform: scale(2.5);
   -moz-transform: scale(2.0) rotate(0.02deg);
   
   -webkit-transition: all 0.8s linear;
   -o-transition: all 0.8s linear;
   -ms-transition: all 0.8s linear;
   transition: all 0.8s linear;   
   -moz-transition: all 1s ease-in-out;
}*/

/*anyado clase para emular hover con una clase*/
.view-tenth.didascalia-active img {
   border-radius:4px;
   border:0px solid #000000;
   
   -webkit-transform: scale(2.5);
   -o-transform: scale(2.5);
   -ms-transform: scale(2.5);
   transform: scale(2.5);
   -moz-transform: scale(2.0) rotate(0.02deg);
   
   -webkit-transition: all 0.8s linear;
   -o-transition: all 0.8s linear;
   -ms-transition: all 0.8s linear;
   transition: all 0.8s linear;   
   -moz-transition: all 1s ease-in-out;
}

/*
.view-tenth:hover .mask {
	background-color: rgba(255, 255, 255, 0.95);
	-ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
	opacity: 0.9;
	height:auto;
	border-radius: 4px;
	border:1px solid #000000;
	-webkit-box-shadow: 0 0 15px 2px #444;
    -moz-box-shadow: 0 0 15px 2px #444;
    box-shadow: 0 0 15px 2px #444;
    /*overflow:auto;*/
    
    /*
   -webkit-transform: scale(1.01);
   -moz-transform: scale(1.01) rotate(0.02deg);
   -o-transform: scale(1.01);
   -ms-transform: scale(1.01);
   transform: scale(1.01);
   -webkit-transition: all 0.7s linear;
   -moz-transition: all 0.7s linear;
   -o-transition: all 0.7s linear;
   -ms-transition: all 0.7s linear;
   transition: all 0.7s linear;
}*/


.view-tenth.didascalia-active .mask {
	background-color: rgba(255, 255, 255, 0.95);
	-ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
	opacity: 0.9;
	height:auto;
	border-radius: 4px;
	border:1px solid #000000;
	-webkit-box-shadow: 0 0 15px 2px #444;
    -moz-box-shadow: 0 0 15px 2px #444;
    box-shadow: 0 0 15px 2px #444;
    /*overflow:auto;*/
   -webkit-transform: scale(1);
   -moz-transform: scale(1) rotate(0.02deg);
   -o-transform: scale(1);
   -ms-transform: scale(1);
   transform: scale(1);
   -webkit-transition: all 0.7s linear;
   -moz-transition: all 0.7s linear;
   -o-transition: all 0.7s linear;
   -ms-transition: all 0.7s linear;
   transition: all 0.7s linear;
}


@media screen and (orientation: portrait) {
.view-tenth.didascalia-active .mask  {
    max-width: 86%;
	height:auto;
	margin-top:150px;
  }
}

@media screen and (orientation: landscape) {
.view-tenth.didascalia-active .mask  {
    max-width: 35%;
	height:auto;
  }
}

/*.view-tenth:hover span {
	display:none;
}*/

/*
.view-tenth:hover h2,.view-tenth:hover p,.view-tenth:hover a.info {
   overflow:auto;
   -webkit-transform: scale(1.01);
   -moz-transform: scale(1.01) rotate(0.02deg);
   -o-transform: scale(1.01);
   -ms-transform: scale(1.01);
   transform: scale(1.01);
   -webkit-transition: all 0.7s linear;
   -moz-transition: all 0.7s linear;
   -o-transition: all 0.7s linear;
   -ms-transition: all 0.7s linear;
   transition: all 0.7s linear;
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;

}*/
				
				
.view-tenth.didascalia-active h2,.view-tenth.didascalia-active p,.view-tenth.didascalia-active a.info {
   overflow:auto;
   -webkit-transform: scale(1);
   -moz-transform: scale(1) rotate(0.02deg);
   -o-transform: scale(1);
   -ms-transform: scale(1);
   transform: scale(1);
   -webkit-transition: all 0.7s linear;
   -moz-transition: all 0.7s linear;
   -o-transition: all 0.7s linear;
   -ms-transition: all 0.7s linear;
   transition: all 0.7s linear;
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;

}

	
		
	/*Pongo aqui una cosa del boton que luego hay que cambiar: */
		
	#didascalia-button.button-active{
		
	background : none;
	background-color : azure;
	color : teal;
		
}