@import url('https://fonts.googleapis.com/css?family=Hind|Montserrat|Playfair+Display');

/*
Autor: Cesar Davila
Continua 2017
Ultima actualización: octubre 2017
*/

.debug-1 {
  border: 1px red dashed;
}

.debug-2 {
  border: 1px green dashed;
}

html,
body {
  height: 100%;
}

body {
  /*margin-top: 80px;*/
  /*misma altura que el menu*/
  font-family: 'Hind', sans-serif;
  font-weight: 300;
  color: #828282;
}


/*font-family: 'Playfair Display', serif;
font-family: 'Montserrat', sans-serif;*/

h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  vertical-align: baseline;
  background: transparent;
}

h1 {
  font-family: 'Playfair Display', serif !important;
  line-height: 38px;
}

h2 {
  font-family: 'Playfair Display', serif !important;
  font-size: 25px !important;
  line-height: 30px;
}

h3 {
  font-family: 'Montserrat', sans-serif !important;
  font-size: 18px !important;
  line-height: 32px !important;
}

h4 {
  font-family: 'Playfair Display', serif !important;
  font-size: 16px !important;
  line-height: 14px !important;
}

h5 {
  font-family: 'Montserrat', sans-serif !important;
  font-size: 13px !important;
  line-height: 22px !important;
}

p {
  font-family: 'Hind', sans-serif !important;
  font-size: 16px !important;
}
ul{
  font-family: 'Hind', sans-serif !important;
  font-size: 16px !important;
}

ul i{
  color: #baa990;
}
.clear {
  clear: both;
}

.center {
  text-align: center !important;
}

.left {
  text-align: left !important;
}

.right {
  text-align: right !important;
}


/*colores textos***************************************************************************************************************************/

.text-color-1 {
  color: #ffffff !important;
}

.text-color-2 {
  color: #828282 !important;
}

.text-color-3 {
  color: #4c4c4c !important;
}

.text-color-4 {
  color: #8d7c5d !important;
}

.text-color-5 {
  color: #2a3b59 !important;
}


/* SEPARADORES* *********************************************************************************************************/

.sep-1 {
  display: block;
  height: 20px;
  border-bottom: 4px solid #d5cabb;
  width: 55px !important;
  margin-bottom: 20px;
}

.sep-2 {
  display: block;
  height: 1px;
  border-bottom: 1px solid #d5cabb;
  width: 100% !important;
  margin-top: 0px;
}
.sep-3 {
  /*centrado*/
  display: block;
  height: 25px;
  border-bottom: 4px solid #d5cabb;
  width: 55px !important;
  margin: 0 auto;
  margin-bottom: 20px;
}

.sep-4 {
  /*centrado*/
  display: block;
  height: 25px;
  border-bottom: 2px dashed #ede7e0;
  margin-bottom: 20px;
}

/* BGs * **************************************************************************************************************************/

.bg-1 {
  background-image: url("../images/bg-1.jpg");
  background-position: center;
}
.bg-2 {
  background-color: #fafafa;
}

.bg-puntos {
  background-color: #fafafa;
  background-image: url('../images/bg-puntos.png');
  background-repeat: no-repeat;
  background-position: center 90px;
}

@media only screen and (max-width: 800px) {
  .bg-puntos {
    background-image: none;
  }
}

.bg-mapa{
  background-image: url("../images/bg-mapa.png");
  background-repeat: no-repeat;
  background-position: right top;
}

.bg-color-1 {
  background-color: #ffffff;
}

.bg-color-2 {
  background-color: #fdfdfd;
}

.bg-color-3 {
  background-color: #ddd5c6;
}

.bg-color-4 {
  background-color: #2a3b59;
}

.round {
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
}

.cuadro-1{
  border: 20px solid #f3f5f8;
}

/* MAIN MENU
**********************************************************************************************************/

#menu-main {
  position: absolute;
  top: 0px;
  left: 0px;
  min-height: 200px;
  width: 320px;
  background-color: #061328;
  padding: 20px;
}

#menu-main ul {
  font-family: 'Playfair Display', serif !important;
  font-style: italic;
  font-size: 14px !important;
  line-height: 26px;
  letter-spacing: 0.1em;
}

#menu-main li {
  position: relative;
  left: -40px;
  list-style-type: none;
  padding: 0;
  margin: 0;
}

#menu-main li a {
  display: block;
  color: #fff;
  text-decoration: none;
  -webkit-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
  transition: all 0.2s linear;
}

#menu-main li a:hover {
  display: block;
  color: #baa890;
  text-decoration: none;
  margin-left: 10px;
  -webkit-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
  transition: all 0.2s linear;
}

#menu-main li a:hover:after {
  content: " +";
  -webkit-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
  transition: all 0.2s linear;
}


/* LINKS  **********************************************************************************************************/

.link-1 {
  color: inherit;
  text-decoration: none;
  -webkit-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
  transition: all 0.2s linear;
}

.link-1:hover {
  color: #182269;
  text-decoration: none;
  -webkit-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
  transition: all 0.2s linear;
}

.link-2 {
  color: inherit;
  text-decoration: none;
  -webkit-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
  transition: all 0.2s linear;
}

.link-2:hover {
  color: #c4baad;
  text-decoration: none;
  -webkit-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
  transition: all 0.2s linear;
}

.link-scale {
  transition: all .2s ease-in-out;
}

.link-scale:hover {
  transform: scale(1.1);
}

.padding {
  padding: 20px;
}

.no-padding{
  padding: 0px !important;
  margin:  0px !important;
}

/* viñetas : bullets **********************************************************************************************************/

ul.vineta-2 {
  font-family: 'Hind', sans-serif !important;
  font-size: 16px !important;
  list-style-type: none;
  padding: 0;
  margin: 0;
}

ul.vineta-2 li {
  background: url("../images/vineta-2.png") no-repeat left top;
  line-height: 32px;
  padding-left: 15px;
  padding-top: 0px;
}


/* ALERTA **********************************************************************************************************/

.alerta {
  background-color: #cfe4f1;
  font-family: 'Ruda', sans-serif;
  font-size: 14px !important;
  color: #396a99;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  padding: 20px;
  margin: 10px 0 10px 0;
  width: 100%;
}


/* TOP NAV : header **********************************************************************************************************/

#top-nav {
  background-color: #fff;
  height: 80px;
  border-bottom: 1px #efefef solid;
  text-align: center;
  font-family: 'Ruda', sans-serif;
}

#top-nav .area-menu {
  width: 155px;
  height: 80px;
  border-right: 1px #efefef solid;
  line-height: 80px;
  float: left;
}

#top-nav .area-menu .menu-titulo {
  color: #c1c1c1;
}

#top-nav .area-datos {
  width: 135px;
  height: 80px;
  border-left: 1px #efefef solid;
  line-height: 22px;
  float: right;
  text-align: right !important;
  padding: 15px 15px 0 0;
}

#top-nav .area-datos .t1 {
  color: #1aa4db;
  font-size: 14px;
}

#top-nav .area-datos .t2 {
  color: #5d5d5d;
  font-size: 14px;
}

@media only screen and (max-width: 500px) {
  #logo {
    width: 150px !important;
  }
  #top-nav .area-datos {
    display: none;
  }
}


/* AREAS DE PRACTICA * *********************************************************************************************************/

.sec-externa{
  padding-top:125px;
  background-image: url("../images/bg-mapa-2.png");
  background-position: 380px 90px;
  background-repeat: no-repeat;
}


/*ALINEACIÓN VERTICAL: truco para mostrar contenido del DIV en el fondo de este*/

.myrow {
  font-size: 0;
}

.myrow>* {
  float: none;
  display: inline-block;
  font-size: 14px;
}

.myrow>*:last-child {
  vertical-align: bottom;
}

.myrow p:last-child {
  margin-bottom: 0;
  /* optional */
}