/*Grid Servicios - Tienda*/
@media (min-width:576px) {
  .card-columns {-webkit-column-gap:0; -moz-column-gap:0; column-gap:0}
  .card-columns .card {width:100% !important}
}
.card-header {font-family:'Prata', serif; font-size:20px; text-transform:capitalize}

.card-body {display:flex; flex-direction:column; flex-wrap:wrap}
.card-body > p:nth-child(2) {flex-grow:1}
.card-body > form:nth-child(4) {margin-right:auto; margin-left:100px; margin-top:-38px}

@media (max-width: 768px) {
  .card {text-align:left}
}

@media (max-width: 576px) {
  .row .col-12.col-sm-6.col-md-4.col-lg-3.d-flex {flex-basis:auto; margin:0 auto; width:auto}
}

/*Botones*/
.btn-secondary {color:#fff; background-color:#343a40; border-color:#343a40}
.btn-secondary:hover {color:#fff; background-color:#23272b; border-color:#1d2124}
.container > form > button {margin:15px 0 0 0}
.custom-btn {line-height:1.4}

/*Servicio*/
.container-servicio {flex-wrap:wrap; text-align:center}
.foto-servicio {flex:1; padding:0 20px 0 20px}
.foto-servicio img {max-width:540px; width:100%; height:auto; border:1px solid #dadada}
.compra-servicio {flex:1; display:flex; flex-direction:column; justify-content:center; align-items:center; padding:0 30px 0 30px}
.compra-servicio p {font-family:'Nunito Sans', sans-serif; font-size:18px; text-transform:uppercase; max-width:420px}
.compra-servicio p span {line-height:20px; margin-top:20px; display:block}
.compra-servicio h1 {font-family:'Prata', serif; font-size:50px}
.compra-servicio .precio-servicio {font-family:'Nunito Sans', sans-serif; font-size:36px; margin-top:20px}
.compra-servicio button {padding:.5rem 1rem; font-size:1.5rem}
.info-servicio {width:100%; padding:0 20px 0 20px; margin-top:60px}
.info-servicio h2 {font-family:'Prata', serif; font-size:26px}

@media (min-width:768px) {
  .container-servicio {display:flex}
}

/*Tienda*/
.container-tienda {display:flex; flex-wrap:wrap; justify-content:space-evenly; align-content:center; padding-top:20px} 
.container-tienda a {display:flex; align-items:center; justify-content:center; text-align:center; width:340px; min-height:166px; margin-top:30px; padding:10px 30px 10px 30px; background:#f7f7f7; color:#343a40; font-family:'Prata', serif; font-size:26px; border:1px solid #d8d8d8; transition:transform 0.3s ease-out}
.container-tienda a:hover {background:#f1f1f1; text-decoration:none; transform:translateY(-3px)}

@media (min-width:1200px) {
  .container-tienda {justify-content:space-between}
}