/*productos_css_v1.0_06/26/2017*/
/* SECTION CABECERA */
.titulo-section{
	/* margin-top:100px; */
	background:url('../img/header-bg2.jpg') top center;
	background-size:cover;
}
.titulo-section h2{
	color:var(--blanco-1);
	text-shadow:1px 0px 3px var(--negro-1);
	padding:90px 0px;
}
.titulo-section .btn{
	text-shadow:0px 0px 0px var(--negro-1);
}
.btn-danger {
    background-color: #d7130d;
}
/* fin section cabecera
-------------------------------------------
*/

.line{
	margin: 10px 0px;
}

.container h3{
	margin-top:10px; 
	margin-bottom:10px;
	font-size:1.05rem;
}
.pt-6{
	padding-top:5.4em;
}

h3{margin-bottom:20px; font-weight:bold; color:#fff; text-shadow:1px 1px 0 rgba(0,0,0,0.2);}
.btn-default{background:#DFC717; color:#fff; font-weight:700; text-shadow:1px 1px 0 rgba(0,0,0,0.2); font-size:14px;}
.card{box-shadow:2px 2px 20px rgba(0,0,0,0.3); border:none; margin-bottom:30px;}
.card-01 .card-body{position:relative; padding-top:40px;}
.card-01 .badge-box{position:relative; width:auto; height:auto; text-align:center;}
.card-01 .badge-box{background:#555; color:#fff; border-radius: 0 25px 25px 0;  width:auto; height:auto; text-align:center;}
.card-01.height-fix{height:455px; overflow:hidden;}
.card-01.height-fix .card-img-top{width: 100% !important;}

.profile-box{background-size:cover; float:left; width:100%; text-align:center; padding:30px 0; position:relative; overflow:hidden;}
.profile-box:before{filter: blur(10px);background:url("https://images.pexels.com/photos/195825/pexels-photo-195825.jpeg?h=350&auto=compress&cs=tinysrgb") no-repeat; background-size:cover; width:120%; position:absolute; content:""; height:120%; left:-10%;top:0;z-index:0;}
.profile-box img{width:170px; height:170px; position:relative; border:5px solid #fff;}
.social-box i {border:1px solid #DFC717; color:#DFC717; width:30px; height:30px; border-radius:50%;line-height:30px;}
.social-box i:hover{background:#DFC717; color:#fff;}
.social-box a{margin: 0 5px;}
.video-foreground{float:left;width:100%; height:500px;}

.card-01.height-fix .card-img-overlay{top:unset; color:#fff;
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#636363+0,636363+0,353535+100&0+0,1+64 */
background: -moz-linear-gradient(top, rgba(99,99,99,0) 0%, rgba(70,70,70,1) 35%, rgba(53,53,53,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(99,99,99,0) 0%,rgba(70,70,70,1) 35%,rgba(53,53,53,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(99,99,99,0) 0%,rgba(70,70,70,1) 35%,rgba(53,53,53,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00636363', endColorstr='#353535',GradientType=0 ); /* IE6-9 */
}
.card-01.height-fix .fa{color: #fff;font-size: 22px;margin-right: 18px;};

/*flipper-card*/
.card-flipper {
  position: relative;
  float: left;
  width: 100%;
  text-align: center;
}

.card__front,
.card__back {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.card__back .card{
    width:100%;
    height:65vh;
}

.card__front,
.card__back {
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  -webkit-transition: -webkit-transform 0.3s;
          transition: transform 0.3s;
}

.card__front {
  background-color: #ff5078;
}

.card__back {
  background-color: #1e1e1e;
  -webkit-transform: rotateY(-180deg);
          transform: rotateY(-180deg);
}
.side-bar .nav-tabs{border-bottom:none;}
.side-bar .nav-tabs .nav-link {color: #aeaeae; text-transform: uppercase; border: none;}
.side-bar .nav-tabs .nav-link.active, .side-bar .nav-tabs .nav-link:hover{border-bottom:2px solid #ff0000;  text-transform: uppercase; color: #222}
.sidebar-tabing .media{margin-top: 20px}
.sidebar-tabing img{width: 120px;height: 100px;}
.sidebar-tabing .title-small {line-height: 23px; margin-top: 5px; font-size: 18px}
.heading-large {border-bottom: 2px solid #222; color: #222; float: left; width: 100%; padding:0 0 6px; margin:0 0 18px; text-align: left;}
.heading-large::before, .heading-large::after{background: transparent;}

@media (min-width: 768px){
}
@media (max-width: 997px){
	.pt-6{
		padding-top:0em;
	}
}
@media (max-width: 767px){
	.pt-6{
		margin-top:4.6rem;
	}
}
