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

#contenedor{ margin:0 auto; width:80%; overflow:auto; text-align:center; display:inline; background-color:#0F0;}
#contenedor a{ cursor:pointer;}
#conferencias{ margin:0 auto; width:80%; overflow:auto; text-align:center;}

figure {
  display: block; 
  position: relative; 
  float: left; 
  overflow: hidden; 
  margin: 0 20px 20px 0;
  border:solid 4px #FFFFFF;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
  border-radius: 4px;
  -webkit-box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.5);
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.5);
    -webkit-transition: all 0.4s ease-in;
  -moz-transition: all 0.4s ease-in;
  -ms-transition: all 0.4s ease-in;
  -o-transition: all 0.4s ease-in;
  transition: all 0.4s ease-in;
}

figure .texto{ margin-top:140px;}
figure p{ font-size:12px; width:90%;}
figure h4{color:#666;}

figcaption { 
  position: absolute; 
  background: rgba(0,0,0,0.75); 
  color: white; 
  padding: 10px 20px; 
  opacity: 0;
  -webkit-transition: all 0.6s ease;
  -moz-transition:    all 0.6s ease;
  -o-transition:      all 0.6s ease;
}
figure:hover figcaption {
  opacity: 1;
}
/*figure:before { 
  content: "?"; 
  position: absolute; 
  font-weight: 800; 
  background: rgba(255,255,255,0.75); 
  text-shadow: 0 0 5px white;
  color: black;
  width: 24px;
  height: 24px;
  -webkit-border-radius: 12px;
  -moz-border-radius:    12px;
  border-radius:         12px;
  text-align: center;
  font-size: 14px;
  line-height: 24px;
  -moz-transition: all 0.6s ease;
  opacity: 0.75;	
}
figure:hover:before {
  opacity: 0;
}*/

figure:hover {
	transform:scale(1.05);
border:solid 4px  #000066;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
  border-radius: 4px;
  -webkit-box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.5);
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.5);
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -ms-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}
figure:hover h4{ color:#000;}
.cap-left:before {  bottom: 10px; left: 10px; }
.cap-left figcaption { bottom: 0; left: -30%; }
.cap-left:hover figcaption { left: 0; }

.cap-right:before { bottom: 10px; right: 10px; }
.cap-right figcaption { bottom: 0; right: -30%; }
.cap-right:hover figcaption { right: 0; }

.cap-top:before { top: 10px; left: 10px; }
.cap-top figcaption { left: 0; top: -30%; }
.cap-top:hover figcaption { top: 0; }

.cap-bot:before { bottom: 10px; left: 10px; }
.cap-bot figcaption { left: 0; bottom: -30%;}
.cap-bot:hover figcaption { bottom: 0; }

.cap-left{position:relative;
  height:300px;
  width:300px;
  margin:20px;
  float:left;}
.cap-left img {
	padding-bottom:170px;
	position:absolute;
  left:0;
  -webkit-transition: opacity 0.6s  ease-in-out;
  -moz-transition: opacity 0.6s ease-in-out;
  -o-transition: opacity 0.6s ease-in-out;
  transition: opacity 0.6s ease-in-out;}
.cap-left img.top:hover {
  opacity:0;
}
.cap-right{position:relative;
  height:300px;
  width:300px;
  margin:20px;
  float:right;}
  
.cap-right img {
	position:absolute;
  left:0;
  -webkit-transition: opacity 0.6s  ease-in-out;
  -moz-transition: opacity 0.6s ease-in-out;
  -o-transition: opacity 0.6s ease-in-out;
  transition: opacity 0.6s ease-in-out;
}
.cap-right img.top:hover {
  opacity:0;
}


@media (max-width: 979px) {
	.cap-left{ float:none; margin:auto; top:20px;}
	.cap-right{float:none; margin:auto; top:20px;}
}