/**{outline: 1px solid red;}*/

.portada{
	background-image: url('../img/programas/capacitacion-alt/port-capa.jpg');
	background-size: cover;
	background-position: top center;
	width: 100%;
	height: 450px; 
	margin-top: 80px;
	position:relative;
}
.portada h4{
	text-align: center;
    font-weight: 500;
    color: white;
    font-size: 25px; margin-top: 0px;
    text-shadow: 1px 2px 1px black;
}
.portada img{ width: 40%; padding: 5px;}
.portada .box-in {
	padding: 20px; 
	background: linear-gradient( 0deg, rgba(67,86,99,.7), rgba(255,255,255,.5));
 	height: auto; width:100%; top: 67.5%; position:absolute; bottom:0px; }
/*.portada .logo{float: right; margin-top: 23.5%; margin-right: 1%;  }
.portada .logo img{float: right; width: 60%; }*/
/*-------submenu----------*/
.section-info .submenu #accordion{background: transparent; margin-bottom: 0;}
.section-info .submenu ._Title{border: none; margin-bottom: 4px;}
.section-info .submenu #accordion .spacy{background-color: rgb(229,229,229); height:30px;width:100%;}
.section-info .submenu #accordion h4{text-transform: uppercase; font-weight: 300; text-shadow: 0 1px 1px #000; font-size:15px; color: #fff;}
.section-info .submenu #accordion h3{text-transform: none; font-size: 14px; padding-left: 15px; text-shadow: 0 0 0 #000; font-weight:400; }
.section-info .submenu #accordion .glyphicon { margin-right:10px; }
.section-info .submenu #accordion .panel {border-radius: 0px; background: transparent; margin-top: 0px;}
.section-info .submenu #accordion .panel-mg-top{margin-top: 0px;}
.section-info .submenu #accordion .panel-body { padding:0px;}
.section-info .submenu #accordion .panel-body .table_1 h5 i { font-size:10px; width: 10px;}
.section-info .submenu #accordion .pd-bottom {margin-bottom: 5px; margin-top: -5px;}
.section-info .submenu #accordion .panel-body .table {margin-bottom: 0px; }
.section-info .submenu #accordion .panel-heading { border-radius: 0px; background:rgb(50,57,70);}
.section-info .submenu #accordion .panel-heading .fa {width:16px; margin-left:-20px; }
.section-info .submenu #accordion .panel-collapse .panel-body .table_1 h5{ color: #fff; background:transparent;
border-bottom:1px solid rgba(50,57,70,.5); margin: 0px; padding: 8px 15px;}
.section-info .submenu #accordion .panel-collapse .panel-body .table_1 .bottom{border-bottom:0px;}
.section-info .submenu #accordion .panel-collapse .panel-body .table_1:hover{background-color: rgba(251,65,65,.8); }
.section-info .submenu #accordion .panel-collapse .panel-body .table_1:hover a{color: #fff; font-weight: 500; }
.section-info .submenu #accordion .panel-body .table_1 h5 { padding-left: 15px; }
.section-info .submenu #accordion .panel-body .table_1 h5 a{color: #00000c; text-decoration: none;}
.section-info .submenu #accordion .panel-body .table_1 .active a{color:rgb(251,65,65); font-weight: bold;}
.section-info .submenu #accordion .tipo-programa{border-left: none; border-right: none; border-top: none; 
border-radius: 2px; color: rgb(50,57,70); background: #f5f5f5; box-shadow: inset -1px -1px 4px 0px rgb(50,57,70);}
.section-info .submenu #accordion .mg-bottom{margin-bottom: 5px;}
.section-info .submenu #accordion .panel-hover a{text-decoration: none;}
.section-info .submenu #accordion .panel-hover:hover{background-color: rgba(251,65,65,.7); box-shadow: none;}
.section-info .submenu #accordion .panel-hover:hover h3{color:#fff; text-shadow: 0 0px 1px rgba(251,65,65,.9); }

/*---------contente-------------*/
.section-info{background-image: url(../img/fondo-bg.jpg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  width: 100%;
  position: relative;}
.section-info .capacitacion-info {padding: 30px;}
.section-info .capacitacion-info .titulo{background-color: rgb(50,57,70); padding: 12px 1em; color: white; margin:0 0 15px 0;
	font-size: 30px; font-weight: 500; text-shadow: 0 1px 1px #000;}
.section-info .capacitacion-info h4{font-size: 16px; font-weight: 600; color: rgb(40, 46, 58);}

figure {
  -webkit-transition: all 200ms;
  transition: all 200ms;
  display: inline-block;
  background: rgb(67,86,99);
  width: 100%;
  height: 214px;
  overflow: hidden;
  position: relative;
  border: 6px solid rgb(67,86,99) ;  /*#143c3c*/
}
figure:hover {border-width: 9px;}
figure:hover .title {
  -webkit-transform: translate(0, 100px);
          transform: translate(0, 100px);
}
figure:hover img {
  -webkit-transform: scale(1.5);
          transform: scale(1.5);
}
figure:hover .description {
  opacity: 1;
  -webkit-transform: translateY(-60px);
          transform: translateY(-60px);
}
figure:hover .iconos {
  -webkit-transform: translateY(-80px);
          transform: translateY(-80px);
  opacity: 1;
}
figure .title {
	margin: 0px;
  position: absolute;
  bottom: 0px;
  padding: 5px;
  width: 100%;
  text-align: center;
  color: #fff; font-weight: 100;
  font-size: 17px;
  -webkit-transition: all 400ms;
  transition: all 400ms;
  background: rgba(67, 86, 99, 0.9);
}
figure img {width: 100%; position: absolute;-webkit-transition: all 500ms; transition: all 500ms;}
.description {
  width: 80%;
  opacity: 0;
  height: 100px;
  position: absolute;
  top: 45%;
  left: 10%;
  font-size: 13px;
  color: white;
  background: rgba(67,86,99,.6);
  -webkit-transition: all 300ms;
  transition: all 300ms;
  text-align: center;
  padding: 7px;
}
.iconos {
  list-style-type: none;
  margin: 0;
  padding: 0;
  opacity: 0;
  -webkit-transition: all 500ms;
  transition: all 500ms;
  position: absolute;
  bottom: -80px;
  height: 50px;
  width: 100%;
  text-align: center;
}
.iconos li {display: inline; margin: 5px;position: relative;}
.iconos i {font-size: 25px; color: #fff;}
.iconos i:after { top: -20px; left: -4px; position: absolute; content: ""; width: 120%; height: 230%;  opacity: 0;
  -webkit-transition: all 500ms;
  transition: all 500ms;
  -webkit-transform: scale(1.2);
          transform: scale(1.2);
}
.iconos i:before {width: 100px;height: 100px; border-radius: 100px; background: rgb(67, 86, 99); padding: 8px 10px;}
.iconos i:hover {color:white ;cursor: pointer;}
.iconos i:hover:before {background: black;}
.iconos i:hover:after {opacity: 1;-webkit-transform: scale(1); transform: scale(1);}


.modal-header-primary {
    color:#fff;
    padding:0px 15px;
    border-bottom:1px solid #eee;
    background-color: rgba(21,56,116,.7);
    -webkit-border-top-left-radius: 5px;
    -webkit-border-top-right-radius: 5px;
    -moz-border-radius-topleft: 5px;
    -moz-border-radius-topright: 5px;
     border-top-left-radius: 5px;
     border-top-right-radius: 5px;
}
.talleres .btn{padding: 0px 5px;}
.section-info .capacitacion-info .talleres .taller{margin-bottom: 10px;}
.section-info .capacitacion-info .talleres .taller .modal-body hr{border-top: 1px solid gray; margin:0 0 15px;}
.section-info .capacitacion-info .talleres .taller .gallery img{width: 100%; }
.section-info .capacitacion-info .talleres .taller .gallery {margin: 10px 0px 140px;}
.section-info .capacitacion-info .talleres .taller .modal-footer{margin-top: 0px;}
.section-info .capacitacion-info .talleres .taller .modal-footer .btn{background:rgba(21,56,116,.8);color: #fff; }
.section-info .capacitacion-info .line{margin: 10px 0px; border-top:1px solid rgb(67, 86, 99);  }

@media only screen and (min-width: 992px ) and (max-width: 1199px){
	.description {font-size: 12px; padding: 3px;}
}
@media only screen and (min-width: 421px ) and (max-width: 520px){
	.description {font-size: 12px; padding: 3px; width: 90%; left: 5%;}
}
@media (max-width: 500px){
  .section-info .capacitacion-info .titulo{font-size: 25px; text-align: center;}
}
@media only screen and (min-width: 200px ) and (max-width: 289px){
	.description {font-size: 13px; padding: 3px; width: 90%; left: 5%;}
}
@media( max-width: 500px ){.section-info .capacitacion-info .titulo{font-size: 25px; text-align: center;} }
@media (max-width: 420px){
	.section-info .capacitacion-info .talleres .col-xs-6{width: 100%;}
	.section-info .capacitacion-info .talleres .taller .gallery img{margin-bottom:10px; }
}

/*------------responsive large------*/
@media only screen and (min-width: 1921px ) and (max-width: 2600px){
  .portada{ height: 550px;}
  .portada h4{font-size: 40px;}
  .portada .box-in { top: 60.5%; }
}
@media only screen and (max-width: 2540px){.portada .box-in {top: 60.8%;} }
@media only screen and (max-width: 1950px) {.portada .box-in {top: 65.7%;} }
@media only screen and (max-width: 1920px){.portada .box-in { top: 62.6%; } }
@media only screen and (max-width: 1600px) {.portada .box-in {top: 68.4%;} }
@media only screen and (max-width: 1440px) {.portada .box-in {top: 66.9%;} }
@media only screen and (max-width: 1366px) {.portada .box-in {top: 65.9%;} .portada img{ width: 45%;} }
@media only screen and (max-width: 1093px) {.portada .box-in {top: 68.8%;}
@media only screen and (max-width: 1024px) {.portada .box-in {top: 68.5%;} .portada img{ width: 50%;} .portada h4{font-size: 25px;} }
@media only screen and (max-width: 768px) {.portada .box-in {top: 70%;} .portada img{ width: 60%;} }
@media only screen and (max-width: 450px) {.portada .box-in {top: 65%;} .portada img{ width: 100%;} }
@media only screen and (max-width: 425px) {.portada .box-in {top: 66.9%;} .portada img{ width: 100%;} .portada h4{font-size: 23px; }
@media only screen and (max-width: 375px) {.portada .box-in {top: 68%;} }
@media only screen and (max-width: 320px) {.portada .box-in {top: 69%;} }

