header.inicio {
  /*background-image: url("../imagenes/fondo.jpg") !important;
  background-position: top left !important;
  background-size: cover !important;*/
  /*height: 100vh;*/
  /*min-height: 775px;*/
  padding-top: 0;
  padding-bottom: 0;
  /*opacity: 0.6;*/
}

@font-face {
  font-family: 'Helsinki';
  src: url("../fonts/Helsinki-Regular.woff");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'Helsinki';
  src: url("../fonts/Helsinki-Light.woff");
  font-weight: 300;
  font-style: normal; }

@font-face {
  font-family: 'Helsinki';
  src: url("../fonts/Helsinki-Extralight.woff");
  font-weight: 200;
  font-style: normal; }

@font-face {
  font-family: 'Helsinki';
  src: url("../fonts/Helsinki-Thin.woff");
  font-weight: 100;
  font-style: normal; }

*:not(i) {
	font-family: 'Helsinki', 'Tahoma' !important;
}


#mainNav {
  background-color: #a5c715;
  position: absolute;
  width: 100%;
}

@media (max-width: 767px) {
  header.inicio {
    margin-top: 19px;
  }
}

header.inicio * {
  opacity: 1.0;
}

header.inicio h1 {
  color: #fff;
}

section.contact {
  background: none;
  background-color: #a5c715 !important;
	clear: both;
}

section#destacamos {
	background-color: #fff !important;
}

section.features .section-heading {
  margin-bottom: 10px !important;
}

#mainNav.navbar-shrink .navbar-nav > li > a, #mainNav.navbar-shrink .navbar-nav > li > a:focus  {
  color: #fff;
}

#mainNav .navbar-nav > li > a, #mainNav .navbar-nav > li > a:focus {
  color: #fff;
}

#mainNav .navbar-nav > li.active > a, #mainNav .navbar-nav > li.active > a:focus,  #mainNav .navbar-nav > li > a:hover {
  color: #333;
}

#mainNav.navbar-shrink .navbar-nav > li > a:focus:hover, #mainNav.navbar-shrink .navbar-nav > li > a:hover {
  color: #333;
  text-decoration: underline;
}

#mainNav .navbar-toggler {
  color: #fff;
  margin-right: 0 !important;
}

footer {
  clear: both;
}

footer p {
  text-align: center;
}

footer p, footer ul li a {
  color: #fff;
}

body#contenido #mainNav {
    background-color: #000;
}

div.rastro_migas {
  background-color: #ddd;
  width: 100%;
}

div#rastro_migas {
  margin: 65px auto 0;
  background-color: transparent;
  color: #555;
  float: none;
  display: block;
}

section#features {
  padding-bottom: 35px;
}

section.features .feature-item img.noticia {
  border-radius: 15px;
}

section.features .feature-item h3 {
  font-size: 25px;
  margin-top: 20px;
}

div#rastro_migas p, div#rastro_migas p a {
  color: #555;
}

div#rastro_migas p a:hover {
  color: #000;
}

section#pagina {
  margin: 20px 0 100px 0;
}

article#sidebar {
  float: left;
  text-align: center;
}

article#sidebar h4 {
  font-size: 13px;
  width: 70%;
  margin-left: 15%;
  margin-top: 15px;
}

article#sidebar a.btn {
  font-size: 12px;
  padding: 5px;
}

article#sidebar div.noticia {
  margin-bottom: 30px;
}

article#sidebar a:hover {
  opacity: 0.8;
}

article#principal div.noticia p.noticia {
  clear: none;
}

section.atencion {
  margin: 0 0 20px 0;
  padding: 20px 0 10px 0;
  background-color: #eee;
  border-radius: 50px;
}

article#principal h2 {
  font-weight: bold;
  font-size: 19px;
}

article#principal img {
  width: 100%;
  max-width: 100%;
  height: auto !important;
  padding: 1px;
  border: 1px solid #ddd;
}

section.atencion p {
  text-align: center;
}

@media (max-width: 500px) {
  a.btn {
    letter-spacing: 1px;
    padding: 15px;
  }

  .container > .navbar-header, .container-fluid > .navbar-header, .container > .navbar-collapse, .container-fluid > .navbar-collapse {
    background-color: #000;
  }

  div#navbarResponsive ul {
    width: 100%;
  }

  div#navbarResponsive ul li {
    margin-bottom: 5px;
  }

  div#navbarResponsive ul li a {
    padding-top: 2px;
    padding-bottom: 2px;
  }
}



/* Home Page Carousel */

.slick-slide img {
  width: 100%;
}

.slick-prev {
  z-index: 100 !important;
  left: 25px !important;
}

.slick-next {
  z-index: 100 !important;
  right: 25px !important;
}

.h-100 {
  margin-top: -30%;
  margin-bottom: 30%;
}

section.download {
  margin-top: 0;
  background: none;
  background-color: #a5c715 !important;
  padding: 50px 0;
  border-top: 1px solid #fff;
}

section.download h4 {
  margin-bottom: 15px;
}

section.download div.destacado img.img-responsive {
  max-width: 100%;
  border: 1px solid #fff;
}

section.download div.destacado h5 {
  margin-top: 10px;
}

section.download div.destacado a,
section.download div.destacado i {
  color: #fff;
}

@media (max-width: 767px) {
  section.download div.destacado {
    margin-bottom: 30px;
  }
}

section.enlaces_interes {
  padding: 20px 0;
}

section.enlaces_interes h3 {
  width: 100%;
  text-align: center;
}

section.enlaces_interes ul {
  width: 100%;
  list-style-type: none;
  margin: 20px 0 40px 0;
  padding: 0;
  float: left;
}

section.enlaces_interes ul li {
  width: 30%;
  text-align: center;
  float: left;
  margin: 10px 1.5%;
  background-color: #a5c715;
  border-radius: 20px;
  padding: 10px;
}

section.enlaces_interes ul li a,
section.enlaces_interes ul li i {
  color: #fff;
}

section.enlaces_interes ul li a:hover {
  text-decoration: none;
}

section.enlaces_interes ul li:hover {
  background-color: #333;
  cursor: pointer;
}

@media (max-width: 767px) {
  section.enlaces_interes ul li {
    width: 100%;
  }
}

.btn-outline.active, .btn-outline:active, .btn-outline:focus, .btn-outline:hover {
  background-color: #a5c715 !important;
  border-color: #a5c715 !important;
}

#mainNav.navbar-shrink, body#contenido #mainNav {
  background-color: #a5c715;
position: fixed;
top: 0;
left: 0;
}


.carousel {
  height: 50%;
}

.carousel .item,
.carousel .item.active,
.carousel .carousel-inner {
  height: 100%;
}

.carousel .fill {
  width: 100%;
  height: 100%;
  background-position: center;
  background-size: cover;
}


footer ul {
  margin-bottom: 0;
  display: table;
  margin: 0 auto;
}

thead {
  background-color: #ddd;
}

.table thead th {
  text-align: center;
  vertical-align: middle;
}

table.table {
  margin-bottom: 2rem;
}

p.destacado-peq {
  font-size: 12px;
  line-height: 17px;
  text-align: center;
}

p.botones_admin img {
	max-width: 100% !important;
	width: auto !important;
}

#mainNav .navbar-nav > li.active > a,
#mainNav .navbar-nav > li > a.active {
	color: #333 !important;
}

@media (min-width: 992px) {
	ul.menu_principal_submenu {
		display: none;
		position: absolute !important;
		background-color: #000;
	}

	ul.menu_principal_submenu li {
		clear: both !important;
		display: block !important;
		color: #fff !important;
		padding: 10px !important;
	}

	ul.menu_principal_submenu li a {
		color: #fff !important;
		text-align: left !important;
		padding-left: 0 !important;
	}

	ul.menu_principal_submenu li span {
		color: #fff !important;
		text-decoration: underline !important;
	}
	
	ul.menu_principal_submenu.visible {
		display: block !important;
	}
}

nav.navbar ul > li:first-child > a > i {
    font-size: 18px;
}

body#contacto section#pagina,
body#contacto section#pagina article#principal {
  position: static;
}

body#page-top section#destacamos div.col-12.col-sm-3 {
  position: static;
  /*max-width: 20%;*/
  max-width: 25%;
}

body#page-top section#destacamos div.col-12.col-sm-3 img {
  max-width: 100%;
}

@media (max-width: 767px) {
  .fa-phone {
    font-size: 20px !important;
  }
  #mainNav .navbar-brand {
    letter-spacing: 0px !important;
  }
  .navbar-brand {
    font-size: 15px !important;
  }
  body#page-top section#destacamos div.col-12.col-sm-3 {
    max-width: 100%;
  }
}

p.botones_admin img {
  max-width: 100% !important;
  width: auto !important;
}

img.imagen_admin {
  width: auto !important;
}

body.itinerario-botanico article#principal h2 {
  text-transform: none;
  font-style: italic;
}

body.itinerario-botanico a.anterior:before {
  content: "\f060";
  font-family: FontAwesome;
  margin: 0 5px 0 0;
}

body.itinerario-botanico a.siguiente:after {
  content: "\f061";
  font-family: FontAwesome;
  margin: 0 0 0 5px;
}

body.itinerario-botanico a.menu:before {
  content: "\f276";
  font-family: FontAwesome;
  margin: 0 5px 0 0;
}

body.contenido-id-77 div.row {
  clear: both;
  margin-top: 0;
  margin-bottom: 50px;
}

body.contenido-id-77 div.row div.col-12.col-sm-3 img {
  border: 0 !important;
}

body.contenido-id-77 div.row div.col-12.col-sm-3 a:last-of-type {
  text-align: center;
  width: 100%;
  display: inline-block;
  margin: 10px 0;
}

@media screen and (max-width: 767px) {
  body.itinerario-botanico table {
    width:100%;
  }
  /* Force table to not be like tables anymore */
  body.itinerario-botanico table,
  body.itinerario-botanico thead,
  body.itinerario-botanico tbody,
  body.itinerario-botanico th,
  body.itinerario-botanico td,
  body.itinerario-botanico tr {
    display: block;
  }

  /* Hide table headers (but not display: none;, for accessibility) */
  body.itinerario-botanico thead tr {
    position: absolute;
    top: -9999px;
    left: -9999px;
  }

  body.itinerario-botanico tr {
    margin: 0 0 1rem 0;
  }

  body.itinerario-botanico tr:nth-child(odd) {
    /*background: #ccc;*/
  }

  body.itinerario-botanico td {
    /* Behave  like a "row" */
    border: none;
    border-bottom: 1px solid #eee;
    position: relative;
    padding-left: 50%;
  }

  body.itinerario-botanico td:before {
    /* Now like a table header */
    position: absolute;
    /* Top/left values mimic padding */
    top: 0;
    left: 6px;
    width: 45%;
    padding-right: 10px;
    white-space: nowrap;
  }

  /*
  Label the data
You could also use a data-* attribute and content for this. That way "bloats" the HTML, this way means you need to keep HTML and CSS in sync. Lea Verou has a clever way to handle with text-shadow.
  */
  body.itinerario-botanico td:nth-of-type(1):before { content: "Reino"; padding: 0.75rem; background-color: #ddd; }
  body.itinerario-botanico td:nth-of-type(2):before { content: "División"; padding: 0.75rem; background-color: #ddd; }
  body.itinerario-botanico td:nth-of-type(3):before { content: "Clase"; padding: 0.75rem; background-color: #ddd; }
  body.itinerario-botanico td:nth-of-type(4):before { content: "Orden"; padding: 0.75rem; background-color: #ddd; }
  body.itinerario-botanico td:nth-of-type(5):before { content: "Familia"; padding: 0.75rem; background-color: #ddd; }
  body.itinerario-botanico td:nth-of-type(6):before { content: "Tribu"; padding: 0.75rem; background-color: #ddd; }
  body.itinerario-botanico td:nth-of-type(7):before { content: "Género"; padding: 0.75rem; background-color: #ddd; }
  body.itinerario-botanico td:nth-of-type(8):before { content: "Especie"; padding: 0.75rem; background-color: #ddd; }
}