body {
  font-size: 0.8rem;
  color: #fff;
  background-color: #000366;
  font-family: 'Raleway', sans-serif;
}
h1, h2{
  color: #777;
  font-size: 1.5em;
  font-weight: bold;
  text-align: center;
}
p, #servicios-pag span{
  font-size: 17px;
  color: #777;
}
.bg-gris{
  background-color: #E7E7E7;
}

/** HEADER **/
.header {
  background-color: #fff;
}

#logo-img { /*logo de la empresa*/
  background: url('../images/logo-grande.png') no-repeat;
  width: 198px;
  height: 100px;
  margin: 5px 20px 5px 0;
}
.brand { /*texto al lado del logo compañia */
  font-weight: bold;
  font-size: 30px;
  color: #777;
}

.brand span {
  align-items: center;
}

#nav-list a, .dropdown-menu{
  font-weight: 900;
  color: #777;
  text-decoration: none;
  font-size: 0.8rem;
  text-align: center; 
}

.dropdown-menu {
  min-width: 6rem;
}
#nav-list li {
  border-left: 1px solid #777;
  padding: 15px;
}
#nav-list li:hover, #nav-list .active {
  background: #E7E7E7;
}
#nav-list a span {
  font-size: 1.8em;
}

/** END HEADER **/
/** BODY **/
/* CUSTOMIZE THE CAROUSEL
   -------------------------------------------------- */
.carousel-control-prev, .carousel-control-next {
  height: 50px;
  width: 50px;
  margin: 2vw;
  background-color: #5a5a5a;
  border: 0;
  border-radius: 57px;
}
.carousel-caption {
  background-color: transparent;
  padding: 30px;
  font-size: 4vw;
  font-weight: bold;
}
/** Fin Carousel **/
#main-content {
  background-color: #fff;
}
#home-tiles {
  text-align: center;
}

/** END BODY **/
/*pag somos*/
#somos h1{
  color: #000366;
  text-align: left;
}
#somos p{
  color: #000;
  text-align: left;
  font-weight: bold;
}
/*pag certificaciones/reconocimientos*/

/*clientes*/

/*sugerencias*/

/*contacto*/

/*servicios */

/*porque nosotros*/
#porque-pag img{
  margin-bottom: 1rem;
}
/* FOOTER */
.panel-footer {
  margin-top: 15px;
  padding-top: 25px;
  padding-bottom: 20px;
  background-color: #222;
  border-top: 0;
}
.panel-footer div.row {
  margin-bottom: 15px;
  margin-right: auto;
  margin-left: auto;
}
#address p{
  margin: 0;
}
#address a{
  text-decoration: none;
  color: #fff;
}
#address a:hover{
  color: #777;
}

#facebook a, #twitter a, #instagram a{
  text-decoration: none;
  color: #fff;
  margin: auto 0;
}

.btn-facebook, .btn-instagram {
  background-color: #55ACEE;
}
.btn-facebook:hover, .btn-twitter:hover, .btn-facebook:active, .btn-twitter:active, .btn-facebook:focus, .btn-twitter:focus{
  background-color: #26455d;
}
.btn-twitter:active:hover, .btn-twitter.active:hover, .open>.dropdown-toggle.btn-twitter:hover, .btn-twitter:active:focus, .btn-twitter.active:focus, .open>.dropdown-toggle.btn-twitter:focus, .btn-twitter:active.focus, .btn-twitter.active.focus, .open>.dropdown-toggle.btn-twitter.focus {
  background-color: #26455d;
}
.btn-facebook:active:hover, .btn-facebook.active:hover, .open>.dropdown-toggle.btn-facebook:hover, .btn-facebook:active:focus, .btn-facebook.active:focus, .open>.dropdown-toggle.btn-facebook:focus, .btn-facebook:active.focus, .btn-facebook.active.focus, .open>.dropdown-toggle.btn-facebook.focus {
  background-color: #26455d;
}
/* END FOOTER */
/********** Large devices only **********/
@media (min-width: 1200px) {
  /** HEADER **/

  /** END HEADER **/
}
/********** Medium devices only **********/
@media (min-width: 992px) and (max-width: 1199px) {
  /** HEADER **/
  #nav-list a {
    font-size: 0.9vW;
  }
  /** END HEADER **/
}
/********** Small devices only **********/
@media (min-width: 768px) and (max-width: 991px) {
  /** HEADER **/
  #nav-list a {
    font-size: 0.65vW;
  }
  /** END HEADER **/

}
/********** Extra small devices only **********/
@media (max-width: 767px) {
  /** HEADER **/
  #nav-list a {/* lista del menu */
    text-align: left;
  }
  #nav-list li {
    border-left: 0;
  }
  .brand { /*texto al lado del logo compañia */
    font-size: 4.5vW;
  }
  /** END HEADER **/
  /** BODY **/

  /** END BODY **/

}
/********** Extra Extra small devices only **********/
@media (max-width: 630px) {
  /** HEADER **/

  /** END HEADER **/
  /** BODY **/

/** END BODY **/
}