@font-face {
font-family: 'SemanaSerif-Black';
src: url(https://multimedia.elpais.com.co/2024/style/fuentes-semana/SemanaSerif-Black.ttf);
}
@font-face {
font-family: 'SemanaSerif-ExtraBold';
src: url(https://multimedia.elpais.com.co/2024/style/fuentes-semana/SemanaSerif-ExtraBold.ttf);
}
@font-face {
font-family: 'SemanaSerif-Bold';
src: url(https://multimedia.elpais.com.co/2024/style/fuentes-semana/SemanaSerif-Bold.ttf);
}
@font-face {
font-family: 'SemanaSerif-BoldItalic';
src: url(https://multimedia.elpais.com.co/2024/style/fuentes-semana/SemanaSerif-BoldItalic.ttf);
}
@font-face {
font-family: 'SemanaSerif-Medium';
src: url(https://multimedia.elpais.com.co/2024/style/fuentes-semana/SemanaSerif-Medium.ttf);
}
@font-face {
font-family: 'SemanaSerif-Regular';
src: url(https://multimedia.elpais.com.co/2024/style/fuentes-semana/SemanaSerif-Regular.ttf);
}
@font-face {
font-family: 'SemanaSerif-RegularItalic';
src: url(https://multimedia.elpais.com.co/2024/style/fuentes-semana/SemanaSerif-RegularItalic.ttf);
}
@font-face {
font-family: 'SemanaSerif-Light';
src: url(https://multimedia.elpais.com.co/2024/style/fuentes-semana/SemanaSerif-Light.ttf);
}
@font-face {
font-family: 'SemanaSans-Black';
src: url(https://multimedia.elpais.com.co/2024/style/fuentes-semana/SemanaSans-Black.ttf);
}
@font-face {
font-family: 'SemanaSans-ExtraBold';
src: url(https://multimedia.elpais.com.co/2024/style/fuentes-semana/SemanaSans-ExtraBold.ttf);
}
@font-face {
font-family: 'SemanaSans-Bold';
src: url(https://multimedia.elpais.com.co/2024/style/fuentes-semana/SemanaSans-Bold.ttf);
}
@font-face {
font-family: 'SemanaSans-Light';
src: url(https://multimedia.elpais.com.co/2024/style/fuentes-semana/SemanaSans-Light.ttf);
}
@font-face {
font-family: 'SemanaSans-Medium';
src: url(https://multimedia.elpais.com.co/2024/style/fuentes-semana/SemanaSans-Medium.ttf);
}
@font-face {
font-family: 'SemanaSans-Regular';
src: url(https://multimedia.elpais.com.co/2024/style/fuentes-semana/SemanaSans-Regular.ttf);
}
.body {
font-family: 'SemanaSans-Regular';
font-weight: 400;
font-style: normal;
line-height: 200%;
}
.main {
width: 100%;
margin: 160px auto;
text-align: left;
}
.centrar{
display: flex;
justify-content: center;
z-index: 1;
}	
h1 {
margin-bottom: 30px;
font-size: 44px;
}
h2 {
margin-bottom: 5px;
font-size: 21px;
margin-top: 10px;
line-height: 24px;
text-align: left;
font-family: 'SemanaSans-Medium';
font-weight: 500;
font-style: normal;
color: #1d1e1f;
}
h3 {
font-size: 15px;
font-family: 'SemanaSans-Medium';
font-weight: 300;
font-style: normal;
text-align: left;
line-height: 20px;
color: #6b6d70;
}
p {
font-size: 17px;
color: #6b6d70;
}
.linea{
width: 80%;
height: 1px;
border-bottom: 1.5px solid #4C342A;
}
.img-fondo{
transform: scale(2.5);
}
/*-------------------------------1-------------------------*/
.btn {
margin-top: 30px;
padding: 2.2% 5.5%;
display: inline-block;
-webkit-transition: all linear 0.15s;
transition: all linear 0.15s;
border-radius: 3px;
background: #fff;
font-size: 22px;
font-weight: bold;
text-decoration: none;
text-transform: uppercase;
color: #333;
}
.btn:hover {
opacity: 0.75;
}
.popup-wrap {
width: 100%;
height: 100%;
display: none;
justify-content: center;
position: absolute;
top: 0px;
left: 0px;
content: "";
z-index: 1;
}
.popup-box {
display: flex;
flex-direction: column;
align-items: left;
width: 90%;
max-width: 220px;
padding: 1.5%;
position: absolute;
top:37%;
left: 6%;
box-shadow: 0px 2px 16px rgba(0, 0, 0, 0.5);
border-radius: 3px;
background: #fff;
text-align: left;
overflow: hidden;
border-radius: 9px;
border: 1px solid #D0855D;
}
.popup-box .close-btn {
width: 20px;
height: 20px;
display: inline-block;
position: absolute;
top: 17px;
right: 10px;
font-size: 18px;
-webkit-transition: all ease 0.5s;
transition: all ease 0.5s;
border-radius: 1000px;
background: #306866;
font-weight: bold;
text-decoration: none;
color: #fff;
line-height: 18px;
font-family: "montserrat", sans-serif;
font-weight: 300;
font-style: normal;
}
/*
.popup-box .close-btn:hover {
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
}*/
.transform-in, .transform-out {
display: flex;
-webkit-transition: all ease 0.5s;
transition: all ease 0.5s;
}
.fondo-popup{
background-repeat: no-repeat;
top: 0;
display: flex;
position: absolute;
height: 100%;
width: auto;
}
/*-----------------------------------2----------------------------------------*/
.btn2 {
margin-top: 30px;
padding: 2.2% 5.5%;
display: inline-block;
-webkit-transition: all linear 0.15s;
transition: all linear 0.15s;
border-radius: 3px;
background: #fff;
font-size: 22px;
font-weight: bold;
text-decoration: none;
text-transform: uppercase;
color: #333;
}
.btn2:hover {
opacity: 0.75;
}
.popup-wrap2 {
width: 100%;
height: 100%;
display: none;
justify-content: center;
position: absolute;
top: 0px;
left: 0px;
content: "";
z-index: 1;
}
.popup-box2 {
display: flex;
flex-direction: column;
align-items: left;
width: 90%;
max-width: 220px;
padding: 1.5%;
position: absolute;
top:37%;
left: 6%;
box-shadow: 0px 2px 16px rgba(0, 0, 0, 0.5);
border-radius: 3px;
background: #fff;
text-align: left;
overflow: hidden;
border-radius: 9px;
border: 1px solid #D0855D;
}
.popup-box2 .close-btn2 {
text-align: center;
width: 20px;
height: 20px;
display: inline-block;
position: absolute;
top: 17px;
right: 10px;
font-size: 18px;
-webkit-transition: all ease 0.5s;
transition: all ease 0.5s;
border-radius: 1000px;
background: #306866;
font-weight: bold;
text-decoration: none;
color: #fff;
line-height: 18px;
font-family: "montserrat", sans-serif;
font-weight: 300;
font-style: normal;
}
/*
.popup-box .close-btn:hover {
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
}*/
.transform-in2, .transform-out2 {
display: flex;
-webkit-transition: all ease 0.5s;
transition: all ease 0.5s;
}
/*-----------------------------------3----------------------------------------*/
.btn3 {
margin-top: 30px;
padding: 2.2% 5.5%;
display: inline-block;
-webkit-transition: all linear 0.15s;
transition: all linear 0.15s;
border-radius: 3px;
background: #fff;
font-size: 22px;
font-weight: bold;
text-decoration: none;
text-transform: uppercase;
color: #333;
}
.btn3:hover {
opacity: 0.75;
}
.popup-wrap3 {
width: 100%;
height: 100%;
display: none;
justify-content: center;
position: absolute;
top: 0px;
left: 0px;
content: "";
z-index: 1;
}
.popup-box3 {
display: flex;
flex-direction: column;
align-items: left;
width: 90%;
max-width: 220px;
padding: 1.5%;
position: absolute;
top:37%;
left: 6%;
box-shadow: 0px 2px 16px rgba(0, 0, 0, 0.5);
border-radius: 3px;
background: #fff;
text-align: left;
overflow: hidden;
border-radius: 9px;
border: 1px solid #D0855D;
}
.popup-box3 .close-btn3 {
text-align: center;
width: 20px;
height: 20px;
display: inline-block;
position: absolute;
top: 17px;
right: 10px;
font-size: 18px;
-webkit-transition: all ease 0.5s;
transition: all ease 0.5s;
border-radius: 1000px;
background: #306866;
font-weight: bold;
text-decoration: none;
color: #fff;
line-height: 18px;
font-family: "montserrat", sans-serif;
font-weight: 300;
font-style: normal;
}
/*
.popup-box .close-btn:hover {
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
}*/
.transform-in3, .transform-out3 {
display: flex;
-webkit-transition: all ease 0.5s;
transition: all ease 0.5s;
}
.fondo-popup3{
background-repeat: no-repeat;
top: 0;
display: flex;
position: absolute;
height: 100%;
width: auto;
}
/*-----------------------------------4----------------------------------------*/
.btn4 {
margin-top: 30px;
padding: 2.2% 5.5%;
display: inline-block;
-webkit-transition: all linear 0.15s;
transition: all linear 0.15s;
border-radius: 3px;
background: #fff;
font-size: 22px;
font-weight: bold;
text-decoration: none;
text-transform: uppercase;
color: #333;
}
.btn4:hover {
opacity: 0.75;
}
.popup-wrap4 {
width: 100%;
height: 100%;
display: none;
justify-content: center;
position: absolute;
top: 0px;
left: 0px;
content: "";
z-index: 1;
}
.popup-box4 {
display: flex;
flex-direction: column;
align-items: left;
width: 90%;
max-width: 220px;
padding: 1.5%;
position: absolute;
top:37%;
left: 6%;
box-shadow: 0px 2px 16px rgba(0, 0, 0, 0.5);
border-radius: 3px;
background: #fff;
text-align: left;
overflow: hidden;
border-radius: 9px;
border: 1px solid #D0855D;
}
.popup-box4 .close-btn4 {
text-align: center;
width: 20px;
height: 20px;
display: inline-block;
position: absolute;
top: 17px;
right: 10px;
font-size: 18px;
-webkit-transition: all ease 0.5s;
transition: all ease 0.5s;
border-radius: 1000px;
background: #306866;
font-weight: bold;
text-decoration: none;
color: #fff;
line-height: 18px;
font-family: "montserrat", sans-serif;
font-weight: 300;
font-style: normal;
}
/*
.popup-box .close-btn:hover {
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
}*/
.transform-in4, .transform-out4 {
display: flex;
-webkit-transition: all ease 0.5s;
transition: all ease 0.5s;
}
.fondo-popup4{
background-repeat: no-repeat;
top: 0;
display: flex;
position: absolute;
height: 100%;
width: auto;
}
/*-----------------------------------5----------------------------------------*/
.btn5 {
margin-top: 30px;
padding: 2.2% 5.5%;
display: inline-block;
-webkit-transition: all linear 0.15s;
transition: all linear 0.15s;
border-radius: 3px;
background: #fff;
font-size: 22px;
font-weight: bold;
text-decoration: none;
text-transform: uppercase;
color: #333;
}
.btn5:hover {
opacity: 0.75;
}
.popup-wrap5 {
width: 100%;
height: 100%;
display: none;
justify-content: center;
position: absolute;
top: 0px;
left: 0px;
content: "";
z-index: 1;
}
.popup-box5 {
display: flex;
flex-direction: column;
align-items: left;
width: 90%;
max-width: 220px;
padding: 1.5%;
position: absolute;
top:37%;
left: 6%;
box-shadow: 0px 2px 16px rgba(0, 0, 0, 0.5);
border-radius: 3px;
background: #fff;
text-align: left;
overflow: hidden;
border-radius: 9px;
border: 1px solid #D0855D;
}
.popup-box5 .close-btn5 {
text-align: center;
width: 20px;
height: 20px;
display: inline-block;
position: absolute;
top: 17px;
right: 10px;
font-size: 18px;
-webkit-transition: all ease 0.5s;
transition: all ease 0.5s;
border-radius: 1000px;
background: #306866;
font-weight: bold;
text-decoration: none;
color: #fff;
line-height: 18px;
font-family: "montserrat", sans-serif;
font-weight: 300;
font-style: normal;
}
/*
.popup-box .close-btn:hover {
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
}*/
.transform-in5, .transform-out5 {
display: flex;
-webkit-transition: all ease 0.5s;
transition: all ease 0.5s;
}
.fondo-popup5{
background-repeat: no-repeat;
top: 0;
display: flex;
position: absolute;
height: 100%;
width: auto;
}
/*-----------------------------------6----------------------------------------*/
.btn6 {
margin-top: 30px;
padding: 2.2% 5.5%;
display: inline-block;
-webkit-transition: all linear 0.15s;
transition: all linear 0.15s;
border-radius: 3px;
background: #fff;
font-size: 22px;
font-weight: bold;
text-decoration: none;
text-transform: uppercase;
color: #333;
}
.btn6:hover {
opacity: 0.75;
}
.popup-wrap6 {
width: 100%;
height: 100%;
display: none;
justify-content: center;
position: absolute;
top: 0px;
left: 0px;
content: "";
z-index: 1;
}
.popup-box6 {
display: flex;
flex-direction: column;
align-items: left;
width: 90%;
max-width: 220px;
padding: 1.5%;
position: absolute;
top:37%;
left: 6%;
box-shadow: 0px 2px 16px rgba(0, 0, 0, 0.5);
border-radius: 3px;
background: #fff;
text-align: left;
overflow: hidden;
border-radius: 9px;
border: 1px solid #D0855D;
}
.popup-box6 .close-btn6 {
text-align: center;
width: 20px;
height: 20px;
display: inline-block;
position: absolute;
top: 17px;
right: 10px;
font-size: 18px;
-webkit-transition: all ease 0.5s;
transition: all ease 0.5s;
border-radius: 1000px;
background: #306866;
font-weight: bold;
text-decoration: none;
color: #fff;
line-height: 18px;
font-family: "montserrat", sans-serif;
font-weight: 300;
font-style: normal;
}
/*
.popup-box .close-btn:hover {
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
}*/
.transform-in6, .transform-out6 {
display: flex;
-webkit-transition: all ease 0.5s;
transition: all ease 0.5s;
}
.fondo-popup6{
background-repeat: no-repeat;
top: 0;
display: flex;
position: absolute;
height: 100%;
width: auto;
}
/*-----------------------------------7----------------------------------------*/
.btn7 {
margin-top: 30px;
padding: 2.2% 5.5%;
display: inline-block;
-webkit-transition: all linear 0.15s;
transition: all linear 0.15s;
border-radius: 3px;
background: #fff;
font-size: 22px;
font-weight: bold;
text-decoration: none;
text-transform: uppercase;
color: #333;
}
.btn7:hover {
opacity: 0.75;
}
.popup-wrap7 {
width: 100%;
height: 100%;
display: none;
justify-content: center;
position: absolute;
top: 0px;
left: 0px;
content: "";
z-index: 1;
}
.popup-box7 {
display: flex;
flex-direction: column;
align-items: left;
width: 90%;
max-width: 220px;
padding: 1.5%;
position: absolute;
top:37%;
left: 6%;
box-shadow: 0px 2px 16px rgba(0, 0, 0, 0.5);
border-radius: 3px;
background: #fff;
text-align: left;
overflow: hidden;
border-radius: 9px;
border: 1px solid #D0855D;
}
.popup-box7 .close-btn7 {
text-align: center;
width: 20px;
height: 20px;
display: inline-block;
position: absolute;
top: 17px;
right: 10px;
font-size: 18px;
-webkit-transition: all ease 0.5s;
transition: all ease 0.5s;
border-radius: 1000px;
background: #306866;
font-weight: bold;
text-decoration: none;
color: #fff;
line-height: 18px;
font-family: "montserrat", sans-serif;
font-weight: 300;
font-style: normal;
}
/*
.popup-box .close-btn:hover {
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
}*/
.transform-in7, .transform-out7 {
display: flex;
-webkit-transition: all ease 0.5s;
transition: all ease 0.5s;
}
.fondo-popup7{
background-repeat: no-repeat;
top: 0;
display: flex;
position: absolute;
height: 100%;
width: auto;
}
/*-----------------------------------8----------------------------------------*/
.btn8 {
margin-top: 30px;
padding: 2.2% 5.5%;
display: inline-block;
-webkit-transition: all linear 0.15s;
transition: all linear 0.15s;
border-radius: 3px;
background: #fff;
font-size: 22px;
font-weight: bold;
text-decoration: none;
text-transform: uppercase;
color: #333;
}
.btn8:hover {
opacity: 0.75;
}
.popup-wrap8 {
width: 100%;
height: 100%;
display: none;
justify-content: center;
position: absolute;
top: 0px;
left: 0px;
content: "";
z-index: 1;
}
.popup-box8 {
display: flex;
flex-direction: column;
align-items: left;
width: 90%;
max-width: 220px;
padding: 1.5%;
position: absolute;
top:37%;
left: 6%;
box-shadow: 0px 2px 16px rgba(0, 0, 0, 0.5);
border-radius: 3px;
background: #fff;
text-align: left;
overflow: hidden;
border-radius: 9px;
border: 1px solid #D0855D;
}
.popup-box8 .close-btn8 {
text-align: center;
width: 20px;
height: 20px;
display: inline-block;
position: absolute;
top: 17px;
right: 10px;
font-size: 18px;
-webkit-transition: all ease 0.5s;
transition: all ease 0.5s;
border-radius: 1000px;
background: #306866;
font-weight: bold;
text-decoration: none;
color: #fff;
line-height: 18px;
font-family: "montserrat", sans-serif;
font-weight: 300;
font-style: normal;
}
/*
.popup-box .close-btn:hover {
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
}*/
.transform-in8, .transform-out8 {
display: flex;
-webkit-transition: all ease 0.5s;
transition: all ease 0.5s;
}
.fondo-popup8{
background-repeat: no-repeat;
top: 0;
display: flex;
position: absolute;
height: 100%;
width: auto;
}
.popup-box .close-btn{
text-align: center;
}
/*-----------------------------------9----------------------------------------*/
.btn9 {
margin-top: 30px;
padding: 2.2% 5.5%;
display: inline-block;
-webkit-transition: all linear 0.15s;
transition: all linear 0.15s;
border-radius: 3px;
background: #fff;
font-size: 22px;
font-weight: bold;
text-decoration: none;
text-transform: uppercase;
color: #333;
}
.btn9:hover {
opacity: 0.75;
}
.popup-wrap9 {
width: 100%;
height: 100%;
display: none;
justify-content: center;
position: absolute;
top: 0px;
left: 0px;
content: "";
z-index: 1;
}
.popup-box9 {
display: flex;
flex-direction: column;
align-items: left;
width: 90%;
max-width: 220px;
padding: 1.5%;
position: absolute;
top:37%;
left: 6%;
box-shadow: 0px 2px 16px rgba(0, 0, 0, 0.5);
border-radius: 3px;
background: #fff;
text-align: left;
overflow: hidden;
border-radius: 9px;
border: 1px solid #D0855D;
}
.popup-box9 .close-btn9 {
text-align: center;
width: 20px;
height: 20px;
display: inline-block;
position: absolute;
top: 17px;
right: 10px;
font-size: 18px;
-webkit-transition: all ease 0.5s;
transition: all ease 0.5s;
border-radius: 1000px;
background: #306866;
font-weight: bold;
text-decoration: none;
color: #fff;
line-height: 18px;
font-family: "montserrat", sans-serif;
font-weight: 300;
font-style: normal;
}
.transform-in9, .transform-out9 {
display: flex;
-webkit-transition: all ease 0.5s;
transition: all ease 0.5s;
}
.fondo-popup9{
background-repeat: no-repeat;
top: 0;
display: flex;
position: absolute;
height: 100%;
width: auto;
}
/*-----------------------------------10----------------------------------------*/
.btn10 {
margin-top: 30px;
padding: 2.2% 5.5%;
display: inline-block;
-webkit-transition: all linear 0.15s;
transition: all linear 0.15s;
border-radius: 3px;
background: #fff;
font-size: 22px;
font-weight: bold;
text-decoration: none;
text-transform: uppercase;
color: #333;
}
.btn10:hover {
opacity: 0.75;
}
.popup-wrap10 {
width: 100%;
height: 100%;
display: none;
justify-content: center;
position: absolute;
top: 0px;
left: 0px;
content: "";
z-index: 1;
}
.popup-box10 {
display: flex;
flex-direction: column;
align-items: left;
width: 90%;
max-width: 220px;
padding: 1.5%;
position: absolute;
top:37%;
left: 6%;
box-shadow: 0px 2px 16px rgba(0, 0, 0, 0.5);
border-radius: 3px;
background: #fff;
text-align: left;
overflow: hidden;
border-radius: 9px;
border: 1px solid #D0855D;
}
.popup-box10 .close-btn10 {
text-align: center;
width: 20px;
height: 20px;
display: inline-block;
position: absolute;
top: 17px;
right: 10px;
font-size: 18px;
-webkit-transition: all ease 0.5s;
transition: all ease 0.5s;
border-radius: 1000px;
background: #306866;
font-weight: bold;
text-decoration: none;
color: #fff;
line-height: 18px;
font-family: "montserrat", sans-serif;
font-weight: 300;
font-style: normal;
}
.transform-in10, .transform-out10 {
display: flex;
-webkit-transition: all ease 0.5s;
transition: all ease 0.5s;
}
.fondo-popup10{
background-repeat: no-repeat;
top: 0;
display: flex;
position: absolute;
height: 100%;
width: auto;
}
/*-----------------------------------11----------------------------------------*/
.btn11 {
margin-top: 30px;
padding: 2.2% 5.5%;
display: inline-block;
-webkit-transition: all linear 0.15s;
transition: all linear 0.15s;
border-radius: 3px;
background: #fff;
font-size: 22px;
font-weight: bold;
text-decoration: none;
text-transform: uppercase;
color: #333;
}
.btn11:hover {
opacity: 0.75;
}
.popup-wrap11 {
width: 100%;
height: 100%;
display: none;
justify-content: center;
position: absolute;
top: 0px;
left: 0px;
content: "";
z-index: 1;
}
.popup-box11 {
display: flex;
flex-direction: column;
align-items: left;
width: 90%;
max-width: 220px;
padding: 1.5%;
position: absolute;
top:37%;
left: 6%;
box-shadow: 0px 2px 16px rgba(0, 0, 0, 0.5);
border-radius: 3px;
background: #fff;
text-align: left;
overflow: hidden;
border-radius: 9px;
border: 1px solid #D0855D;
}
.popup-box11 .close-btn11 {
text-align: center;
width: 20px;
height: 20px;
display: inline-block;
position: absolute;
top: 17px;
right: 10px;
font-size: 18px;
-webkit-transition: all ease 0.5s;
transition: all ease 0.5s;
border-radius: 1000px;
background: #306866;
font-weight: bold;
text-decoration: none;
color: #fff;
line-height: 18px;
font-family: "montserrat", sans-serif;
font-weight: 300;
font-style: normal;
}
.transform-in11, .transform-out11 {
display: flex;
-webkit-transition: all ease 0.5s;
transition: all ease 0.5s;
}
.fondo-popup11{
background-repeat: no-repeat;
top: 0;
display: flex;
position: absolute;
height: 100%;
width: auto;
}
/*-----------------------------------12----------------------------------------*/
.btn12 {
margin-top: 30px;
padding: 2.2% 5.5%;
display: inline-block;
-webkit-transition: all linear 0.15s;
transition: all linear 0.15s;
border-radius: 3px;
background: #fff;
font-size: 22px;
font-weight: bold;
text-decoration: none;
text-transform: uppercase;
color: #333;
}
.btn12:hover {
opacity: 0.75;
}
.popup-wrap12 {
width: 100%;
height: 100%;
display: none;
justify-content: center;
position: absolute;
top: 0px;
left: 0px;
content: "";
z-index: 1;
}
.popup-box12 {
display: flex;
flex-direction: column;
align-items: left;
width: 90%;
max-width: 220px;
padding: 1.5%;
position: absolute;
top:37%;
left: 6%;
box-shadow: 0px 2px 16px rgba(0, 0, 0, 0.5);
border-radius: 3px;
background: #fff;
text-align: left;
overflow: hidden;
border-radius: 9px;
border: 1px solid #D0855D;
}
.popup-box12 .close-btn12 {
text-align: center;
width: 20px;
height: 20px;
display: inline-block;
position: absolute;
top: 17px;
right: 10px;
font-size: 18px;
-webkit-transition: all ease 0.5s;
transition: all ease 0.5s;
border-radius: 1000px;
background: #306866;
font-weight: bold;
text-decoration: none;
color: #fff;
line-height: 18px;
font-family: "montserrat", sans-serif;
font-weight: 300;
font-style: normal;
}
.transform-in12, .transform-out12 {
display: flex;
-webkit-transition: all ease 0.5s;
transition: all ease 0.5s;
}
.fondo-popup12{
background-repeat: no-repeat;
top: 0;
display: flex;
position: absolute;
height: 100%;
width: auto;
}
/*-----------------------------------13----------------------------------------*/
.btn13 {
margin-top: 30px;
padding: 2.2% 5.5%;
display: inline-block;
-webkit-transition: all linear 0.15s;
transition: all linear 0.15s;
border-radius: 3px;
background: #fff;
font-size: 22px;
font-weight: bold;
text-decoration: none;
text-transform: uppercase;
color: #333;
}
.btn13:hover {
opacity: 0.75;
}
.popup-wrap13 {
width: 100%;
height: 100%;
display: none;
justify-content: center;
position: absolute;
top: 0px;
left: 0px;
content: "";
z-index: 1;
}
.popup-box13 {
display: flex;
flex-direction: column;
align-items: left;
width: 90%;
max-width: 220px;
padding: 1.5%;
position: absolute;
top:37%;
left: 6%;
box-shadow: 0px 2px 16px rgba(0, 0, 0, 0.5);
border-radius: 3px;
background: #fff;
text-align: left;
overflow: hidden;
border-radius: 9px;
border: 1px solid #D0855D;
}
.popup-box13 .close-btn13 {
text-align: center;
width: 20px;
height: 20px;
display: inline-block;
position: absolute;
top: 17px;
right: 10px;
font-size: 18px;
-webkit-transition: all ease 0.5s;
transition: all ease 0.5s;
border-radius: 1000px;
background: #306866;
font-weight: bold;
text-decoration: none;
color: #fff;
line-height: 18px;
font-family: "montserrat", sans-serif;
font-weight: 300;
font-style: normal;
}
.transform-in13, .transform-out13 {
display: flex;
-webkit-transition: all ease 0.5s;
transition: all ease 0.5s;
}
.fondo-popup13{
background-repeat: no-repeat;
top: 0;
display: flex;
position: absolute;
height: 100%;
width: auto;
}
/*-----------------------------------fin----------------------------------------*/
.iframe{
width: 100%;
height: 290px;
overflow: hidden;
border: 1.5px solid #c8ad89;
}
.transform-in {
display: flex;
/*
-webkit-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
*/
}
.transform-out {
display: flex;
/*
-webkit-transform: translate(-50%, -50%) scale(0.5);
transform: translate(-50%, -50%) scale(0.5);
*/
}
@media(max-width:1400px){
.popup-box{
max-width: 220px;
}
.popup-box2{
max-width: 220px;
}
.popup-box3{
max-width: 220px;
}
.popup-box4{
max-width: 220px;
}
.popup-box5{
max-width: 220px;
}
.popup-box6{
max-width: 220px;
}
.popup-box7{
max-width: 220px;
}
.iframe{
width: 100%;
border-radius: 9px;
}
.linea{
width: 70%;
}
}
@media(max-width:768px){
.linea{
width: 80%;
}
.popup-box{
width: 80%;
padding: 15px;
margin-top: 5%;
}
.popup-box2{
width: 80%;
padding: 15px;
margin-top: 5%;
}
.popup-box3{
width: 80%;
padding: 15px;
margin-top: 5%;
}
.popup-box4{
width: 80%;
padding: 15px;
margin-top: 5%;
}
.popup-box5{
width: 80%;
padding: 15px;
margin-top: 5%;
}
.popup-box6{
width: 80%;
padding: 15px;
margin-top: 5%;
}
.popup-box7{
width: 80%;
padding: 15px;
margin-top: 5%;
}
.iframe{
width: 100%;
height: 200px;
border-radius: 9px;
}
h2{
margin-bottom: 10px;
margin-top: 10px;
font-size: 21px;
}
h3{
font-size: 14px;
line-height: 19px;
}
}
/* 9 al 13 (copian estructura de 8) */
.popup-wrap9,
.popup-wrap10,
.popup-wrap11,
.popup-wrap12,
.popup-wrap13 {
width: 100%;
height: 100%;
display: none;
justify-content: center;
position: absolute;
top: 0;
left: 0;
z-index: 1;
}

.popup-box,
.popup-box2,
.popup-box3,
.popup-box4,
.popup-box5,
.popup-box6,
.popup-box7,
.popup-box8,
.popup-box9,
.popup-box10,
.popup-box11,
.popup-box12,
.popup-box13 {
display: flex;
flex-direction: column;
width: 90%;
max-width: 220px;
padding: 1.5%;
position: absolute;
top:37%;
left: 6%;
background: #fff;
border-radius: 9px;
border: 1px solid #D0855D;
}

.popup-box9 a,
.popup-box10 a,
.popup-box11 a,
.popup-box12 a,
.popup-box13 a {
position: absolute;
top: 17px;
right: 10px;
}
figure .icono9{
position: absolute;
transform: translate(2px , 2px);
height: 13px;
width: 13px;
left: 60%;
top: 55%;
}

figure .icono10{
position: absolute;
transform: translate(2px , 2px);
height: 13px;
width: 13px;
left: 65%;
top: 60%;
}

figure .icono11{
position: absolute;
transform: translate(2px , 2px);
height: 13px;
width: 13px;
left: 70%;
top: 50%;
}

figure .icono12{
position: absolute;
transform: translate(2px , 2px);
height: 13px;
width: 13px;
left: 75%;
top: 45%;
}

figure .icono13{
position: absolute;
transform: translate(2px , 2px);
height: 13px;
width: 13px;
left: 80%;
top: 40%;
}
/* COLORES POR ICONO */
/* COLORES SUAVIZADOS */
figure .icono1 { background: #c7bca9; }
figure .icono2 { background: #a5b773; }
figure .icono3 { background: #d5d16c; }
figure .icono4 { background: #468c60; }
figure .icono5 { background: #d49a50; }
figure .icono6 { background: #8f6e96; }
figure .icono7 { background: #b49b7b; }
figure .icono8 { background: #51608c; }
figure .icono9 { background: #9f617a; }
figure .icono10 { background: #b46e6e; }
figure .icono11 { background: #b46f99; }
figure .icono12 { background: #6396aa; }
figure .icono13 { background: #e4d374; }

/* ARO ANIMADO */
.icono1::after { border-color: #c8bba8; }
.icono2::after { border-color: #a3b86a; }
.icono3::after { border-color: #d6d36a; }
.icono4::after { border-color: #3f8f5c; }
.icono5::after { border-color: #d79a4a; }
.icono6::after { border-color: #8e6a97; }
.icono7::after { border-color: #b59a78; }
.icono8::after { border-color: #4a5c8f; }
.icono9::after { border-color: #a05a7a; }
.icono10::after { border-color: #b96a6a; }
.icono11::after { border-color: #b86a9a; }
.icono12::after { border-color: #5f98ad; }
.icono13::after { border-color: #e6d46a; }
.icono{
position: absolute;
border: 0.5px solid #ffffff;
border-radius: 50%;
height: 13px;
width: 13px;
z-index: 1;

/* 👇 SOMBRA SUAVE */
box-shadow: 0 2px 6px rgba(0,0,0,0.45);
}
[class^="popup-box"] p {
line-height: 1.2;
margin-bottom: 4px;
}
/*----------------------------------1--------------------------------------*/
.popup-box{
top: 57%;
left: 25%;
}

/*----------------------------------2--------------------------------------*/
.popup-box2{
top: 29%;
left: 15%;
}

/*----------------------------------3--------------------------------------*/
.popup-box3{
top: 59%;
left: 66%;
}

/*----------------------------------4--------------------------------------*/
.popup-box4{
top: 40%;
left: 43%;
}

/*----------------------------------5--------------------------------------*/
.popup-box5{
top: 28%;
left: 19%;
}

/*----------------------------------6--------------------------------------*/
.popup-box6{
top: 24%;
left: 47%;
}

/*----------------------------------7--------------------------------------*/
.popup-box7{
top: 64%;
left: 30%;
}

/*----------------------------------8--------------------------------------*/
.popup-box8{
top: 45%;
left: 5%;
}

/*----------------------------------9--------------------------------------*/
.popup-box9{
top: 57%;
left: 60%;
}

/*----------------------------------10--------------------------------------*/
.popup-box10{
top: 31%;
left: 23%;
}

/*----------------------------------11--------------------------------------*/
.popup-box11{
top: 65%;
left: 40%;
}

/*----------------------------------12--------------------------------------*/
.popup-box12{
top: 34%;
left: 60%;
}

/*----------------------------------13--------------------------------------*/
.popup-box13{
top: 27%;
left: 51%;
}
@media (max-width: 768px){
.popup-box,
.popup-box2,
.popup-box3,
.popup-box4,
.popup-box5,
.popup-box6,
.popup-box7,
.popup-box8,
.popup-box9,
.popup-box10,
.popup-box11,
.popup-box12,
.popup-box13 {
top: 68%;
left: 12%;
max-width: 300px;
}
h2{
margin: 4px 0;
}
}
/* POSICIONES MOBILE */
@media (max-width: 768px){

figure .icono1{
left: 75%;
top: 67.4%;
}

figure .icono2{
left: 5%;
top: 27.4%;
}

figure .icono3{
left: 67%;
top: 48.8%;
}

figure .icono4{
left: 71%;
top:  36.8%;
}

figure .icono5{
left: 24%;
top: 27.6%;
}

figure .icono6{
left: 68%;
top: 44.6%;
}

figure .icono7{
left: 32.3%;
top: 48.7%;
}

figure .icono8{
left: 28.3%;
top: 40.7%;
}

figure .icono9{
left: 59.7% !important;
top: 58% !important;
}

figure .icono10{
left: 45.3% !important;
top: 33% !important;
}

figure .icono11{
left: 81% !important;
top: 59% !important;
}

figure .icono12{
left: 70%;
top: 42%;
}

figure .icono13{
left: 75%;
top: 38%;
}

}
[class^="popup-wrap"]{
pointer-events: none;
}

[class^="popup-box"]{
pointer-events: auto;
}

#overlay{
pointer-events: none;
}