.caja-titulo{
display: flex;
width: 100%;
justify-content: center;
}
.caja-rombo{
display: flex;
width: 100%;
justify-content: center;
}
.titulo-atlas{
font-family: "anth", sans-serif;
font-weight: 700;
font-style: normal;
font-size: 27px;
text-align: center;
color: white;
margin-left: 10%;
margin-right: 10%;
background: #5798A3;
padding-left: 10px;
padding-right: 10px;
}
.linea-parrafo1{
position: absolute;
width: 300px;
top: 40px;
justify-content: center;
}
Una historia de la infamia
Para el Atlas de la corrupción en Colombia 1953-1990, SEMANA examinó más de 5.000 documentos del Departamento de Estado y de la embajada americana en Bogotá. Esos documentos reposan en el National Archives en las afueras de Washington D. C. Se ha dicho que ese archivo es la caja negra de la historia de Colombia por la detallada y abundante documentación que contiene sobre personajes y sucesos de la vida nacional.La información del especial no se encuentra en internet. Los personajes no cuentan con biografía en Wikipedia o están reseñados de manera superficial. El Atlas se formó con los archivos diplomáticos de Estados Unidos, sentencias judiciales, otros archivos oficiales y privados colombianos, recortes de prensa, fotocopias de documentos y fotografías impresas en papel, es decir, con material del mundo predigital. No todo está en Google.El Atlas de la corrupción en Colombia 1953-1990 no es la enciclopedia de la corrupción, que ocuparía varios volúmenes, sino un repaso de algunos casos sonados y emblemáticos de esos 37 años. Esos casos se presentan, según la fecha en que ocurrieron, de acuerdo con los nueve periodos presidenciales desde 1953 hasta 1990, así:
@font-face {
font-family: 'SemanaSerif-Regular';
src: url(https://multimedia.elpais.com.co/2024/style/fuentes-semana/SemanaSerif-…);
}
/* Contenedor principal del título */
.contenedor-titulo01 {
display: flex;
width: 100%;
justify-content: center;
}
/* Estilos del título */
.titulo01-principal {
font-family: 'SemanaSerif-Regular';
font-weight: 300;
font-style: normal;
font-size: 17px;
text-align: center;
color: #737373;
margin: 0 10%;
padding: 0 10px;
text-transform: none;
}
/* Línea decorativa */
*Seleccione uno de los presidentes para acceder a su información detallada.
*{
margin: 0;
padding: 0;
box-sizing: border-box;
}
body{
background: white;
font-size: 16px;
font-family: 'Open Sans', sans-serif;
font-family: 'Montserrat', sans-serif;
}
.fondo-blanco{
width: 1080px;
height: 850px;
}
.contenedor-g{
width: 100%;
margin: 0 auto;
max-height: 860px;
margin-top: 20px;
}
.contenedor-g-grilla{
display: flex;
justify-content: center;
}
.grilla{
display: grid;
grid-template-columns: auto auto auto ;
position: absolute;
width: 100%;
max-width: 1110px;
height: 100%;
}
.caja-item{
display: flex;
justify-content: center;
}
figure{
width: 100%;
position: relative;
}
figure .fondo {
width: 100%;
vertical-align: top;
border-radius: 10px;
top: -0.1%;
}
figure .mapa {
width: 100%;
vertical-align: top;
border-radius: 0;
top: -0.1%;
}
figure .icono1{
position: absolute;
width: 31%;
max-width: 270px;
transition: .3s ease all;
cursor: pointer;
}
figure .icono2{
position: absolute;
width: 31%;
max-width: 270px;
transition: .3s ease all;
cursor: pointer;
}
figure .icono3{
position: absolute;
width: 31%;
max-width: 270px;
transition: .3s ease all;
/*cursor: pointer;*/
}
figure .icono4{
position: absolute;
width: 31%;
max-width: 270px;
transition: .3s ease all;
/*cursor: pointer;*/
}
figure .icono5{
position: absolute;
width: 31%;
max-width: 270px;
transition: .3s ease all;
/*cursor: pointer;*/
}
figure .icono6{
position: absolute;
width: 31%;
max-width: 270px;
transition: .3s ease all;
/*cursor: pointer;*/
}
figure .icono7{
position: absolute;
width: 31%;
max-width: 270px;
transition: .3s ease all;
/*cursor: pointer;*/
}
figure .icono8{
position: absolute;
width: 31%;
max-width: 270px;
transition: .3s ease all;
/*cursor: pointer;*/
}
figure .icono9{
position: absolute;
width: 31%;
max-width: 270px;
transition: .3s ease all;
/*cursor: pointer;*/
}
img{
border-radius: 15px;
}
figcaption .tooltip{
font-size:12px;
}
@media (max-width: 768px){
.gps{
opacity: 0;
width: 100%;
content:url("instruccion_mb.png");
}
.mapa_mb{
width: 100%;
content:url("img1_mb.jpg");
}
.tooltip{
transition: 0.2s ease all;
}
.fondo-blanco{
width: 100%;
}
}
/*-------------------------INSTRUCCION--------------------*/
.caja{
/*background-color: green;*/
width: 100%;
height: 136px;
}
.espacio{
height: 0;
}
.texto_tamano{
display: flex;
justify-content: center;
align-content: center;
margin: 0;
}
.texto{
font-size: 16px;
font-family: 'Open Sans', sans-serif;
font-family: 'Montserrat', sans-serif;
color: #664654;
font-size: 19px;
font-weight: 400;
margin-top: -5px;
}
.anim_mar{
/* background: #89767E;*/
width: 100%;
height: 80px;
}
.cursor{
position: absolute;
z-index: 1;
width: 35px;
height: 35px;
margin: 25px;
opacity: 0;
}
.gps{
width: 100%;
position: absolute;
/*z-index: 100;*/
opacity: 0;
}
::-webkit-scrollbar{
display: none;
}
.pantalla{
width: 1920px;
max-width: 1920px;
height: 800px;
left: 50%;
}
.grilla-sello{
display: grid;
grid-template-columns: auto auto auto;
position: absolute;
width: 70%;
height: 70%;
}
.fren{
z-index: 1;
}
img{
width: 100%;
}
/*---------------------------------------------------------------------------*/
@keyframes mianimacion_gps{
0%{
opacity: 0%;
}
93%{
pointer-events: all;
opacity: 0%;
}
100%{
pointer-events: none;
opacity: 0%;
}
}
@media(max-width:768px){
.contenedor-g{
height: 1080px;
max-height: none;
}
.grilla{
grid-template-columns: auto auto;
width: 100%;
height: 126%;
}
.pantalla{
height: 490px;
width: 1000px;
}
figure .icono1{
max-width: 211px;
width: 50%;
}
figure .icono2{
max-width: 211px;
width: 50%;
}
figure .icono3{
max-width: 211px;
width: 50%;
}
figure .icono4{
max-width: 211px;
width: 50%;
}
figure .icono5{
max-width: 211px;
width: 50%;
}
figure .icono6{
max-width: 211px;
width: 50%;
}
figure .icono7{
max-width: 211px;
width: 50%;
}
figure .icono8{
max-width: 211px;
width: 50%;
}
figure .icono9{
max-width: 211px;
width: 50%;
}
figure .icono1A{
height: 25px;
width: 25px;
left: 53.3%;
top: 50.2%;
}
figure .icono2A{
height: 25px;
width: 25px;
left: 60.4%;
top: 53.7%;
}
figure .icono3A{
height: 25px;
width: 25px;
left: 63.4%;
top: 47.8%;
}
figure .icono4A{
height: 25px;
width: 25px;
left: 65.6%;
top: 51.6%;
}
figure .icono5A{
height: 25px;
width: 25px;
left: 68%;
top: 54.4%;
}
figure .icono6A{
height: 25px;
width: 25px;
left: 54.8%;
top: 55.9%;
}
}
.stick{
width: 100%;
height: 100%;
display: flex;
justify-content: center;
}
const images2 = document.querySelectorAll('.gps');
observer2 = new IntersectionObserver((entries2) => {
entries2.forEach(entry2 => {
if(entry2.isIntersecting) {
entry2.target.style.animation = `mianimacion_gps 3s ${entry2.target.dataset.delay} forwards ease-out`;
}
else {
entry2.target.style.animation = 'none';
}
})
})
images2.forEach(image2 => {
observer2.observe(image2)
})
Menú Sticky
.contenedor-menu010 {
width: 100%;
font-family: Arial, sans-serif;
margin: auto;
padding: 0;
height: 30px;
}
.navegacion010 {
color: white;
padding: 15px;
text-align: center;
margin: auto;
width: 100%;
position: fixed;
top: 50px;
opacity: 0;
transition: opacity 0.3s ease-in-out;
z-index: 2;
overflow-x: auto;
white-space: nowrap;
-webkit-overflow-scrolling: touch;
left: 0;
}
.navegacion010 ul {
width: 100%;
max-width: 720px;
background: #538485;
list-style: none;
margin: auto;
padding: 15px;
display: flex;
line-height: 16px;
justify-content: center;
-webkit-box-shadow: 0px 10px 28px -17px rgba(16,36,3,0.72);
-moz-box-shadow: 0px 10px 28px -17px rgba(16,36,3,0.72);
box-shadow: 0px 10px 28px -17px rgba(16,36,3,0.72);
}
.navegacion010 ul li {
margin: 0 15px;
flex-shrink: 0;
}
.navegacion010 ul li a {
color: white;
text-decoration: none;
font-size: 13px;
}
.contenido010 {
font-size: 9px;
color: white;
}
.la-contra{
transform: none !important;
}
@media (max-width: 1200px) {
.navegacion010 {
justify-content: flex-start;
padding-left: 10px;
}
.navegacion010 ul {
display: flex;
justify-content: flex-start;
overflow-x: auto;
padding-left: 10px;
padding-right: 10px;
}
.navegacion010 ul li:first-child {
margin-left: 10px;
}
.navegacion010 ul li:last-child {
margin-right: 10px;
}
}
Rojas Pinilla
Lleras Camargo
León Valencia
Lleras Restrepo
Pastrana Borrero
López Michelsen
Turbay Ayala
Betancur Cuartas
Barco Vargas
Bienvenido
window.addEventListener('scroll', function() {
var barraNavegacion010 = document.getElementById('barra-navegacion010');
var seccionBienvenida010 = document.getElementById('seccion-bienvenida010');
var posicionBienvenida010 = seccionBienvenida010.getBoundingClientRect().top;
if (posicionBienvenida010
{
const rect = el.getBoundingClientRect();
if (rect.top < viewportHeight - 50) {
el.classList.add("visible-obj");
}
});
requestAnimationFrame(checkVisibility);
}
document.addEventListener("DOMContentLoaded", () => {
requestAnimationFrame(checkVisibility);
});
})();