:root {
  --color-light-gray: #f6f6f6;
  --color-white: white;
  --color-blue: #034ea2;
  --color-gray: #484848;
}

* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  /* font-family: 'Roboto', sans-serif; */
}

/* ---- Header ------ */
.header {
  background: var(--color-light-gray);
  font-size: 0.8rem;
}

a {
  text-decoration: none;
}

.link-gradient-effect {
  color: #686868;
  background: #f6f6f6;
  background-image: linear-gradient(
    to right,
    #f6f6f6 0%,
    #f6f6f6 50%,
    #034ea2 50%,
    #034ea2 100%
  );
  background-size: 200% 100%;
  transition: background-position 0.5s;
}

.link-gradient-effect:hover {
  background-position: -100% 0;
  color: white;
}

.linksocial-gradient-effect {
  color: #686868;
  background: #f6f6f6;
  background-image: linear-gradient(
    to right,
    #f6f6f6 0%,
    #f6f6f6 50%,
    #ffffff 50%,
    #ffffff 100%
  );
  background-size: 200% 100%;
  transition: background-position 0.5s;
}

.linksocial-gradient-effect:hover {
  background-position: -100% 0;
  color: #034ea2;
}

.menu-gradient-effect {
  color: #000000;
  background: #ffffff;
  background-image: linear-gradient(
    to right,
    #ffffff 0%,
    #ffffff 50%,
    #034ea2 50%,
    #034ea2 100%
  );
  background-size: 200% 100%;
  transition: background-position 0.5s;
}

.menu-gradient-effect:hover {
  background-position: -100% 0;
  color: white;
}

/* ---- END Header ------ */

/* ---- Carousel ------ */

/* Estilos para el texto en el Carousel.Caption */
.carousel-caption {
  position: absolute;
  top: 120px;
  padding: 1rem;
  background-color: rgba(0, 0, 0, 0);
  color: white;
  background-color: none;
  width: 30%;
  text-align: start;
}

.carousel-caption h3 {
  color: #484848;
  background: none;
  font-weight: 600;
  font-size: 3vw;
}

.carousel-caption p {
  color: #484848;
  background: none;
  font-size: 1vw;
}

.carousel-item img {
  object-fit: cover;
  height: 500px;
}


/* ---- END Carousel ------ */

/* ---- Section Acerca de Nosotros ------ */

.section-nosotros h3 {
  color: #333;
  font-size: 35px;
  margin: 0;
  position: relative;
  padding: 0 0 20px;
}

.section-nosotros span {
  color: #034ea2;
}

.section-nosotros h3:after {
  position: absolute;
  content: "";
  display: block;
  height: 2px;
  width: 150px;
  background: #333;
  left: 0;
  right: 0;
  bottom: 6px;
}

.section-nosotros p {
  font-size: 16px;
}

/* ---- END Section Acerca de Nosotros ------ */

/* ---- Section Especialidades ------ */

.section-padding {
  padding: 100px 0;
  position: relative;
  float: left;
  width: 100%;
}

.section-title {
  margin-bottom: 80px;
}

.section-title h3 {
  color: #333;
  font-size: 35px;
  margin: 0;
  text-transform: capitalize;
  position: relative;
  padding: 0 0 20px;
}

.section-title h3:after {
  position: absolute;
  content: "";
  display: block;
  height: 2px;
  width: 120px;
  background: #333;
  margin: 0 auto;
  left: 0;
  right: 0;
  bottom: 6px;
}

.section-title span {
  color: #034ea2;
}

.section-title p {
  margin-top: 25px;
}

.section-title.section-title-left h3:after {
  margin: 0;
}

.single-blog-home {
  border: 1px solid #ddd;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}

.single-blog-home:hover {
  border-color: #034ea2;
}

.single-blog-home-img {
  position: relative;
}

.single-blog-home-meta {
  background: #f5f5f5;
  padding: 5px;
  border-radius: 6px;
  position: absolute;
  left: 20px;
  right: 20px;
  bottom: -15px;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}

.single-blog-home:hover .single-blog-home-meta {
  background: #034ea2;
  color: #fff;
}

.single-blog-home-meta span {
  text-transform: capitalize;
  display: inline-block;
  padding-right: 15px;
  border-right: 1px solid #ccc;
}

.single-blog-home-meta span:last-child {
  border: none;
}

.single-blog-home h5 {
  margin: 45px 0 15px;
  text-transform: uppercase;
}

.single-blog-home p,
.single-blog-home h5 {
  padding: 0 0 0 20px;
}

a.blog-home-rmbtn {
  display: block;
  text-align: right;
  font-weight: 600;
  font-size: 14px;
  margin: 20px;
}

a.blog-home-rmbtn i {
  font-weight: 600;
}

/* ---- END Section Especialidades ------ */


@media (max-width: 800px) {
  
  .menu-gradient-effect {
    font-size: 13px;
  }

  .carousel-caption p {
    font-size: 1.3vw;
  }

  .carousel-caption {
    width: 40%;
  }


}

@media (max-width: 480px) {
  .menu-link {
    font-size: 0.7rem;
  }

  .section-nosotros h3, .section-title h3 {
    font-size: 22px;
  }

  .section-nosotros p, .section-title p {
    font-size: 16px;
  }

  .carousel-item img {
    height: 200px;
  }

  .carousel-caption {
    top: 40px;
    width: 50%;
  }

  .carousel-caption h3 {
    font-size: 4vw;
  }

  .carousel-caption p, #img-box {
    display: none;
  }

  .menu-gradient-effect {
    font-size: 8px;
  }

  #servicios-footer{
    display: none;
  }


}

/* ---- Alerta ------ */

.alert-message {
  line-height: 20px;
  font-size: 15px;
  padding-bottom: 12px;
}

.unstyled {
  margin: 0;
  list-style: none;
}

.unstyled a,
.unstyled #test {
  width: 120px;
  text-decoration: none;
  padding: .5em 1em;
  background-color: #213347;
  border-radius: 4px;
  display: block;
  margin-bottom: .5em;
  font-size: 15px;
  font-weight: 300;
  font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

.unstyled a:hover,
.unstyled #test:hover {
  background-color: #f25c5d;
}

.cf,
.alert {
  zoom: 1;
}

.cf:before,
.alert:before,
.cf:after,
.alert:after {
  display: table;
  content: "";
  line-height: 0;
}

.cf:after,
.alert:after {
  clear: both;
}

#alerts {
  width: 400px;
  top: 12px;
  right: 50px;
  position: fixed;
  z-index: 9999;
  list-style: none;
}

.alert {
  width: 100%;
  margin-bottom: 8px;
  display: block;
  position: relative;
  border-left: 4px solid;
  right: -50px;
  opacity: 0;
  line-height: 1;
  padding: 0;
  transition: right 400ms, opacity 400ms, line-height 300ms 100ms, padding 300ms 100ms;
  display: table;
}

.alert:hover {
  cursor: pointer;
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.3);
}

.open {
  right: 0;
  opacity: 1;
  line-height: 2;
  padding: 3px 15px;
  transition: line-height 200ms, padding 200ms, right 350ms 200ms, opacity 350ms 200ms;
}

.alert-title {
  font-weight: bold;
}

.alert-block {
  width: 80%;
  width: -webkit-calc(100% - 10px);
  width: calc(100% - 10px);
  text-align: left;
}

.alert-block em,
.alert-block small {
  font-size: .75em;
  opacity: .75;
  display: block;
}

.alert i {
  font-size: 2em;
  width: 1.5em;
  max-height: 48px;
  top: 50%;
  margin-top: -12px;
  display: table-cell;
  vertical-align: middle;
}

.alert-success {
  color: #fff;
  border-color: #539753;
  background-color: #8fbf2f;
}

.alert-error {
  color: #fff;
  border-color: #dc4a4d;
  background-color: #f25c5d;
}

.alert-trash {
  color: #fff;
  border-color: #dc4a4d;
  background-color: #f25c5d;
}

.alert-info {
  color: #fff;
  border-color: #076d91;
  background-color: #3397db;
}

.alert-warning {
  color: #fff;
  border-color: #dd6137;
  background-color: #f7931d;
}

/* ---- END Alerta ------ */