h2{
			font-family: 'Playfair Display',serif;
			display: block;
			font-weight: bold;
			color: #003057;
						margin-top:1.7rem;
		}

		h3{
			font-family: 'Playfair Display',serif;
			display: block;
			display: block;
			font-size: 1.17em;
			color: #003057;
						margin-top:1rem;
									text-decoration:underline;
												font-weight: bold;
		}

		h4{
			font-family: 'Playfair Display',serif;
			display: block;
			display: block;
			font-size: 1em;
			color: #003057;
			margin-top:1rem;
			text-decoration:underline;
			font-weight: bold;
		}

		p, li, ol, ul{
			text-align: justify;
			color: #003057
		}

		.btn-primary {
        color: #1b4262;
    background-color: #d5db33;
    border-color: #d5db33;
    padding: 6px;
    margin: 10px;
    width: 160px;
    border-radius: rgb(213, 219, 51);
    font-size: 15px !important;
   /* text-shadow: 1px 1px #000; */
}



		.actividad{
			background-color: #f1f1f1;
			padding:10px;
			margin: 10px;
		}

		.actividad p, .actividad h3{
			color: #003057 !important;
			font-weight: bold;
		}

		.actividad {
  color: #222222;
  padding: 20px;
  padding-left: 50px;
  box-sizing: border-box;
  box-shadow: 0 2px 4px rgba(34, 34, 34, 0.12);
  position: relative;
  overflow: hidden;
  min-height: 120px;
  border-radius: 4px;
}

		.actividad:before {
font-family: Georgia, serif;
    content: "";
    position: absolute;
    top: -114px;
    left: 10px;
    font-size: 15em;
    color: rgba(238, 238, 238, 0.8);
    font-weight: normal;
}
.actividad:after {
    font-family: Georgia, serif;
    content: "✓";
    position: absolute;
    bottom: 0px;
    line-height: 50px;
    right: -4px;
    font-size: 10em;
    color: rgba(249, 249, 249, 0.6);
    font-weight: normal;
    z-index: 0;
}

.descargar-linea{
	background: #003056; padding: 10px; height: 48px; border-radius: 6px; color: white; text-align: left; width: 300px; margin-top: 30px
}

.introduccion-green-icon{
	float: left;
    position: relative;
    width: 30px;
    margin-right: 10px;
    height: 30px;
    background-image: url("../img/iconos/informacion_128x128.png");
    background-size: cover;
}

.linea-green-icon{
	float: left;
    position: relative;
    width: 30px;
    margin-right: 10px;
    height: 30px;
    background-image: url("../img/iconos/linea_de_tiempo_128x128.png");
    background-size: cover;
}

.lecturas-green-icon{
	float: left;
    position: relative;
    width: 30px;
    margin-right: 10px;
    height: 30px;
    background-image: url("../img/iconos/lecturas_128x128.png");
    background-size: cover;
}

.mapa-green-icon{
	float: left;
    position: relative;
    width: 30px;
    margin-right: 10px;
    height: 30px;
    background-image: url("../img/iconos/mapas_128x128.png");
    background-size: cover;
}

.actividad-green-icon{
	float: left;
    position: relative;
    width: 30px;
    margin-right: 10px;
    height: 30px;
    background-image: url("../img/iconos/actividades_128x128.png");
    background-size: cover;
}


.sabias-green-icon{
	float: left;
    position: relative;
    width: 30px;
    margin-right: 10px;
    height: 30px;
    background-image: url("../img/iconos/sabias_que_128x128.png");
    background-size: cover;
}





		.center-image{
			margin: 0 auto;
		}

		.responsive-image{
			margin: 0 auto;
			max-height: 400px;
			width: auto;
		}

		.owl-carousel .owl-item img {
     display: block; 
     width: auto;
}

		.owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span {
			/*background: #d1db0d;*/
			background: #ef980d;
		}

		.owl-theme .item{
			border-radius: 8px;
			background-color: white;
			padding: 10px;
		}

		.innert{
			background-color: #1b4262;
		}




		.owl-theme .owl-nav [class*='owl-'] {
    color: #FFF;
    font-size: 14px;
    margin: 5px;
    padding: 4px 7px;
    background: #ef980d !important;
    display: inline-block;
    cursor: pointer;
    border-radius: 3px;
    height: 30px !important;
		}



		p.quote-q{
			border-top: 1px solid #D6D6D6;
			margin-top: 2em;
			padding-top: 1.5em;
			    text-align: right;
    line-height: 0.9em;
    font-style: italic;
    border-width: 50%;
		}

		button.owl-prev span{
			top: -14px;
			position: relative;
			font-size: 2em;
		}

		button.owl-next span{
			top: -14px;
			position: relative;
			font-size: 2em;
		}

		.owl-dot{
			padding: 1px 7px 2px;
			border-width: 0;
			border-style: solid;
			border-color: rgb(255, 255, 255) rgb(209, 209, 209) rgb(186, 186, 186);
			border-image: initial;
			background:none;
		}

		.owl-theme .owl-dots .owl-dot span {
    width: 15px;
    height: 15px;
    margin: 5px 7px;
    background: #eac12f;
    display: block;
    -webkit-backface-visibility: visible;
    transition: opacity 200ms ease;
    border-radius: 30px;
}

		.btn-link:hover, .btn-link:focus {
			color: #d1db0d;
			text-decoration: none !important;

		}

		.btn-link{
			text-align: left;
		}

		.title-green{
			color: #d1db0d;
			font-weight: bold;
			padding: 0.2em 0 0 1.3em;
		}

		.title-green-icon{
			color: #d1db0d;
			font-weight: bold;
		}

		.card-header {
			padding: .25rem !important;
			margin-bottom: 0;
			background-color: #0086b2 !important;
			border: none;
			color: white !important;
		}

		.card{
			background: #0086b2;
			padding-bottom:1rem;
		}

			.card-map{
			background: #fff;
			padding-bottom:1rem;
			border: 1px solid #eee;
			    border-top-left-radius: calc(.25rem - 1px);
    border-top-right-radius: calc(.25rem - 1px);
}


		}

		.card-header a{
			color: white !important;
		}

		.btn-link {
			font-weight: 400;
			color: #ffffff;
			text-decoration: none;
		}


		.border-bottom-green{
			border-bottom: 2px solid #d1db0d;

		}
		.bd-placeholder-img {
			font-size: 1.125rem;
			text-anchor: middle;
			-webkit-user-select: none;
			-moz-user-select: none;
			-ms-user-select: none;
			user-select: none;
		}


		/* The side navigation menu */
		.sidenav {
			height: 100%; /* 100% Full-height */
			width: 0; /* 0 width - change this with JavaScript */
			position: fixed; /* Stay in place */
			z-index: 100; /* Stay on top */
			top: 0; /* Stay at the top */
			right: 0;
			background-color: #002c50; /* Black*/
			overflow-x: hidden; /* Disable horizontal scroll */
			padding-top: 60px; /* Place content 60px from the top */
			transition: 0.5s; /* 0.5 second transition effect to slide in the sidenav */
			color: white;
		}



		/* The navigation menu links */
		.sidenav a {
			padding: 8px 8px 8px 32px;
			text-decoration: none;
			color: #fff;
			display: block;
			transition: 0.3s;
			font-size: 18px;
		}

		/* When you mouse over the navigation links, change their color */
		.sidenav a:hover {
			color: #f1f1f1;
		}

		/* Position and style the close button (top right corner) */
		.sidenav .closebtn {
			position: absolute;
			top: 0;
			right: 25px;
			font-size: 36px;
			margin-left: 50px;
		}

		.blue-bar{
			background-color: #d4eae4 ;
		}

		.icon-actividades {
			position: relative;
			float: left;
			padding: 5px;
			cursor: pointer;
			width: 47px;
			height: 32px;
			background: url('../img/iconos/actividades.png') top center;
			transition: background .2s steps(1) ;
			-webkit-transition: background .2s steps(1) ;
			-ms-transition: background .2s steps(1) ;
			-o-transition:  background .2s steps(1) ;
			-moz-transition:  background .2s steps(1) ;
			background-position: 0 64px;
		} 

.icon-informacion {
			position: relative;
			float: left;
			padding: 5px;
			cursor: pointer;
			width: 47px;
			height: 32px;
			background: url('../img/iconos/informacion.png') top center;
			transition: background .2s steps(1) ;
			-webkit-transition: background .2s steps(1) ;
			-ms-transition: background .2s steps(1) ;
			-o-transition:  background .2s steps(1) ;
			-moz-transition:  background .2s steps(1) ;
			background-position: 0 64px;
		} 

		.icon-lectura {
			position: relative;
			float: left;
			padding: 5px;
			cursor: pointer;
			width: 47px;
			height: 32px;
			background: url('../img/iconos/lecturas.png') top center;
			transition: background .2s steps(1) ;
			-webkit-transition: background .2s steps(1) ;
			-ms-transition: background .2s steps(1) ;
			-o-transition:  background .2s steps(1) ;
			-moz-transition:  background .2s steps(1) ;
			background-position: 0 64px;
		} 

				.icon-linea {
			position: relative;
			float: left;
			padding: 5px;
			cursor: pointer;
			width: 47px;
			height: 32px;
			background: url('../img/iconos/linea-del-tiempo.png') top center;
			transition: background .2s steps(1) ;
			-webkit-transition: background .2s steps(1) ;
			-ms-transition: background .2s steps(1) ;
			-o-transition:  background .2s steps(1) ;
			-moz-transition:  background .2s steps(1) ;
			background-position: 0 64px;
		} 


		.icon-mapa {
			position: relative;
			float: left;
			padding: 5px;
			cursor: pointer;
			width: 47px;
			height: 32px;
			background: url('../img/iconos/mapas.png') top center;
			transition: background .2s steps(1) ;
			-webkit-transition: background .2s steps(1) ;
			-ms-transition: background .2s steps(1) ;
			-o-transition:  background .2s steps(1) ;
			-moz-transition:  background .2s steps(1) ;
			background-position: 0 64px;
		} 

				.icon-inicio, .icon-regresar {
			position: relative;
    float: left;
    padding: 5px;
    cursor: pointer;
    width: 120px;
    height: 32px;
    background: url('../img/iconos/inicio.png') top center;
     
    background-position: 0 0;
    top: -5px;
    right: 10px;
    background-repeat: no-repeat;		} 

	/*	.icon-inicio:after, .icon-regresar:after{
			    content: "Ir al módulo";
    width: 100px;
    float: left;
    position: relative;
    left: 52px;
		} */



		.icon-sabias {
			position: relative;
			float: left;
			padding: 5px;
			cursor: pointer;
			width: 47px;
			height: 32px;
			background: url('../img/iconos/sabias-que.png') top center;
			transition: background .2s steps(1) ;
			-webkit-transition: background .2s steps(1) ;
			-ms-transition: background .2s steps(1) ;
			-o-transition:  background .2s steps(1) ;
			-moz-transition:  background .2s steps(1) ;
			background-position: 0 64px;
		} 


		 



		.icon-actividades:hover {
			-webkit-animation: play .2s steps(1) 1;
			-moz-animation: play .2s steps(1) 1;
			-ms-animation: play .2s steps(1) 1;
			-o-animation: play .2s steps(1) 1;
			animation: play .2s steps(1) 1;
			background-position: 0 -32px;
		}

		.icon-informacion:hover{
			-webkit-animation: in-play .2s steps(1) 1;
			-moz-animation: in-play .2s steps(1) 1;
			-ms-animation: in-play .2s steps(1) 1;
			-o-animation: in-play .2s steps(1) 1;
			animation: in-play .2s steps(1) 1;
			background-position: 0 -32px;
		}

				.icon-lectura:hover{
			-webkit-animation: lec-play .2s steps(1) 1;
			-moz-animation: lec-play .2s steps(1) 1;
			-ms-animation: lec-play .2s steps(1) 1;
			-o-animation: lec-play .2s steps(1) 1;
			animation: lec-play .2s steps(1) 1;
			background-position: 0 -32px;
		}

				.icon-mapa:hover{
			-webkit-animation: map-play .2s steps(1) 1;
			-moz-animation: map-play .2s steps(1) 1;
			-ms-animation: map-play .2s steps(1) 1;
			-o-animation: map-play .2s steps(1) 1;
			animation: map-play .2s steps(1) 1;
			background-position: 0 -32px;
		}

					.icon-sabias:hover{
			-webkit-animation: sab-play .2s steps(1) 1;
			-moz-animation: sab-play .2s steps(1) 1;
			-ms-animation: sab-play .2s steps(1) 1;
			-o-animation: sab-play .2s steps(1) 1;
			animation: sab-play .2s steps(1) 1;
			background-position: 0 -32px;
		}

			 

			.icon-inicio:hover{
			-webkit-animation: ni-play .2s steps(1) 1;
			-moz-animation: ni-play .2s steps(1) 1;
			-ms-animation: ni-play .2s steps(1) 1;
			-o-animation: ni-play .2s steps(1) 1;
			animation: ni-play .2s steps(1) 1;
			background-position: 0 -32px;
		}


.icon-linea:hover{
			-webkit-animation: ni-play .2s steps(1) 1;
			-moz-animation: ni-play .2s steps(1) 1;
			-ms-animation: ni-play .2s steps(1) 1;
			-o-animation: ni-play .2s steps(1) 1;
			animation: ni-play .2s steps(1) 1;
			background-position: 0 -32px;
		}


		@-webkit-keyframes play {
			0% { background-position:    0px 0; }
			100% { background-position: 0 -32px; }
		}

		@-moz-keyframes play {
			0% { background-position:    0px 0; }
			100%  { background-position: 0 -32px; }
		}

		@-ms-keyframes play {
			0%{ background-position:    0px 0; }
			100%  { background-position: 0 -32px; }
		}

		@-o-keyframes play {
			0% { background-position:    0px 0; }
			100%  { background-position: 0 -32px; }
		}

		@keyframes play {
			0% { background-position:    0px 0; }
			100%  { background-position: 0 -32px; }
		}

		/*in-*/

		@-webkit-keyframes in-play {
			0% { background-position:    0px 0; }
			100% { background-position: 0 -32px; }
		}

		@-moz-keyframes in-play {
			0% { background-position:    0px 0; }
			100%  { background-position: 0 -32px; }
		}

		@-ms-keyframes in-play {
			0%{ background-position:    0px 0; }
			100%  { background-position: 0 -32px; }
		}

		@-o-keyframes in-play {
			0% { background-position:    0px 0; }
			100%  { background-position: 0 -32px; }
		}

		@keyframes in-play {
			0% { background-position:    0px 0; }
			100%  { background-position: 0 -32px; }
		}
		/*in-*/

/*ni-*/

		@-webkit-keyframes ni-play {
			0% { background-position:    0px 0; }
			100% { background-position: 0 -32px; }
		}

		@-moz-keyframes ni-play {
			0% { background-position:    0px 0; }
			100%  { background-position: 0 -32px; }
		}

		@-ms-keyframes ni-play {
			0%{ background-position:    0px 0; }
			100%  { background-position: 0 -32px; }
		}

		@-o-keyframes ni-play {
			0% { background-position:    0px 0; }
			100%  { background-position: 0 -32px; }
		}

		@keyframes ni-play {
			0% { background-position:    0px 0; }
			100%  { background-position: 0 -32px; }
		}
		/*ni-*/


		/*lec-*/

		@-webkit-keyframes lec-play {
			0% { background-position:    0px 0; }
			100% { background-position: 0 -32px; }
		}

		@-moz-keyframes lec-play {
			0% { background-position:    0px 0; }
			100%  { background-position: 0 -32px; }
		}

		@-ms-keyframes lec-play {
			0%{ background-position:    0px 0; }
			100%  { background-position: 0 -32px; }
		}

		@-o-keyframes lec-play {
			0% { background-position:    0px 0; }
			100%  { background-position: 0 -32px; }
		}

		@keyframes lec-play {
			0% { background-position:    0px 0; }
			100%  { background-position: 0 -32px; }
		}
		/*lec-*/

		/*map-*/

		@-webkit-keyframes map-play {
			0% { background-position:    0px 0; }
			100% { background-position: 0 -32px; }
		}

		@-moz-keyframes map-play {
			0% { background-position:    0px 0; }
			100%  { background-position: 0 -32px; }
		}

		@-ms-keyframes map-play {
			0%{ background-position:    0px 0; }
			100%  { background-position: 0 -32px; }
		}

		@-o-keyframes map-play {
			0% { background-position:    0px 0; }
			100%  { background-position: 0 -32px; }
		}

		@keyframes map-play {
			0% { background-position:    0px 0; }
			100%  { background-position: 0 -32px; }
		}
		/*map-*/


	/*sab-*/

		@-webkit-keyframes sab-play {
			0% { background-position:    0px 0; }
			100% { background-position: 0 -32px; }
		}

		@-moz-keyframes sab-play {
			0% { background-position:    0px 0; }
			100%  { background-position: 0 -32px; }
		}

		@-ms-keyframes sab-play {
			0%{ background-position:    0px 0; }
			100%  { background-position: 0 -32px; }
		}

		@-o-keyframes sab-play {
			0% { background-position:    0px 0; }
			100%  { background-position: 0 -32px; }
		}

		@keyframes sab-play {
			0% { background-position:    0px 0; }
			100%  { background-position: 0 -32px; }
		}
		/*sab-*/


	/*reg-*/

		@-webkit-keyframes reg-play {
			0% { background-position:    0px 0; }
			100% { background-position: 0 -32px; }
		}

		@-moz-keyframes reg-play {
			0% { background-position:    0px 0; }
			100%  { background-position: 0 -32px; }
		}

		@-ms-keyframes reg-play {
			0%{ background-position:    0px 0; }
			100%  { background-position: 0 -32px; }
		}

		@-o-keyframes reg-play {
			0% { background-position:    0px 0; }
			100%  { background-position: 0 -32px; }
		}

		@keyframes reg-play {
			0% { background-position:    0px 0; }
			100%  { background-position: 0 -32px; }
		}
		/*reg-*/


		/* Feel free to change duration  */ 
		.animated  {
			-webkit-animation-duration : 1000 ms  ;
			animation-duration : 1000 ms  ;
			-webkit-animation-fill-mode : both  ;
			animation-fill-mode : both  ;
		}  
		/* .owl-animated-out - only for current item */ 
		/* This is very important class. Use z-index if you want move Out item above In item */ 
		.owl-animated-out {
			z-index : 1 
		}
/* .owl-animated-in - only for upcoming item
/* This is very important class. Use z-index if you want move In item above Out item */ 
.owl-animated-in {
	z-index : 0 
}
/* .fadeOut is style taken from Animation.css and this is how it looks in owl.carousel.css:  */ 
.fadeOut  {
	-webkit-animation-name : fadeOut  ;
	animation-name : fadeOut  ;
}  
@-webkit-keyframes  fadeOut  {
	0% {
		opacity : 1   ;
	}  
	100% {
		opacity : 0   ;
	}  
}
@keyframes  fadeOut  {
	0% {
		opacity : 1   ;
	}  
	100% {
		opacity : 0   ;
	}  
}

/* On smaller screens, where height is less than 450px, change the style of the sidenav (less padding and a smaller font size) */
@media screen and (max-width: : 450px) {
	.sidenav {padding-top: 15px;}
	.sidenav a {font-size: 18px;}
}

.menu-lateral{
	    padding: 15px;
    height: 55px;
    background: #002c50;
    position: fixed;
    border-bottom-left-radius: 7px;
    z-index: 50;
    cursor: pointer;
    right: 0;
    color: white;
    font-size: 18px;
}

@media (min-width: 768px) {
	.bd-placeholder-img-lg {
		font-size: 3.5rem;
	}
}

@media print {  
  @page {
    size: 200mm 240mm; /* landscape */
    /* you can also specify margins here: */
    margin: 25mm;
    margin-right: 10mm; /* for compatibility with both A4 and Letter */
  }
}

 @media print {
	.print {background-color: white;
        height: 100%;
        width: 60%;
        position: fixed;
        top: 0;
        left: 0;
        margin: 0;
        padding: 15px;
        font-size: 14px;
        line-height: 18px;}
	.menu-lateral, .btn-print {display:none;}
	.owl-nav {display:none;}
	/*.item {display:block; width: 70% !important; height: 120% !important; padding-bottom: 50px; margin-bottom: 50px;}*/
	.blue-bar { background-color: #d4eae4; padding:10px; margin:10px;}
	
		.actividad{
			background-color: #f1f1f1;
			padding:10px;
			margin: 10px;
		}

		.actividad p, .actividad h3{
			color: #003057 !important;
			font-weight: bold;
		}

		.actividad {
  color: #222222;
  padding: 20px;
  padding-left: 50px;
  box-sizing: border-box;
  box-shadow: 0 2px 4px rgba(34, 34, 34, 0.12);
  position: relative;
  overflow: hidden;
  min-height: 120px;
  border-radius: 4px;
}

		.actividad:before {
font-family: Georgia, serif;
    content: "";
    position: absolute;
    top: -114px;
    left: 10px;
    font-size: 15em;
    color: rgba(238, 238, 238, 0.8);
    font-weight: normal;
}
.actividad:after {
    font-family: Georgia, serif;
    content: "✓";
    position: absolute;
    bottom: 0px;
    line-height: 50px;
    right: -4px;
    font-size: 10em;
    color: rgba(249, 249, 249, 0.6);
    font-weight: normal;
    z-index: 0;
}

}