/*
Author: KENYER H.
*/
@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@200;400;600&display=swap');
*{margin:0;padding:0;}
:root{
--font_title:'Oswald', sans-serif;
--font_content: 'Oswald', sans-serif;
--padding_big: 70px;
--padding_small: 35px;
}
body{background-color: #000;font-family:var(--font_title);font-size: 1rem;margin: 0;}
img{border: none; padding:0; max-width:100%; height:auto;}
.img_header img { width: 100%;}
img a{border:none;}

/* links */ 
a{color:inherit; text-decoration:none;}
a:hover{color:#000; text-decoration: underline;}

li{list-style: none;}

/* container */
.container {max-width:1200px;margin: 0 auto;padding:0;}

li{list-style: none;}

.copyright {background: #0c0c0c;color: #797474;font-size: 10px;text-align: center;padding: 5px;font-weight: 100;}
.copyright a {color: #ff4d0078;}

.header {position: relative;border-bottom: solid 12px #2ccad6;font-size: 0;}
.text_header {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width: 100%;text-align: center;display: flex;flex-direction: column-reverse;align-items: center;z-index: 100;}
.text_header h1 {font-family: var(--font_title);color: #fff;text-transform: uppercase;font-size: 4rem;}
.text_header img {width: 200px;}
.img_header {background: #000;line-height: 0;font-size: 0;}
.img_header::before {content: "";background: #000000ad;width: 100%;height: 100%;position: absolute;}

.how_book {display: flex;justify-content: space-between;flex-wrap: wrap;padding: var(--padding_big) 0;position: relative;}
.how_book h2 {color: #3d9296;text-align: center;text-transform: uppercase;font-family:var(--font_title);font-weight: 600;font-size: 2.5rem;width: 100%;}
.con_how_book {display: flex;justify-content: space-between;}
.item_how_book {background: #4c114d;width: 384px;color: #fff;padding: 4.5rem 1.5rem 1.5rem 1.5rem;box-sizing: border-box;position: relative;text-align: center;margin-top: 5rem;}

.item_how_book span {--width: 120px;position: absolute;left: 50%;top: -70px;transform: translate(-50% , 0);background: #3d9296;border: solid 10px;width: var(--width);height: var(--width);border-radius: 50%;display: flex;align-items: center;justify-content: center;text-transform: uppercase;font-size: 1.5rem;}
.con_vertical {display: flex;align-items: center;justify-content: center;}
.con_vertical b {text-transform: uppercase;display: block;}
.con_vertical p img + img {padding: 15px;}
.item_how_book p:nth-of-type(1) {padding: 1rem 0;}
.item_how_book p:nth-of-type(1) strong {font-size:1.3em}

.item_how_book.step_3 img {transform: rotate(19deg);padding-top: 1rem;}

a.prev , a.next {display: none;}

.con_tour_day {display: grid;grid-template-columns: 1fr 1fr 1fr;grid-gap: 3rem 1.5rem;}
.img_item_tour_day {position: relative;font-size: 0;}
.img_item_tour_day p {position: absolute;bottom: 1rem;right: 1rem;background: #ff8201;color: #fff;padding: 5px 15px;font-size: 1rem;}
.img_item_tour_day p sub {vertical-align: baseline;}
.item_tour_day {position: relative;background: #000;--color_day:#9e23a0;}

.item_tour_day:nth-child(-n+1){--color_day:#257478;}
.item_tour_day:nth-child(3n+4){--color_day:#257478;}
.item_tour_day:nth-child(3n){--color_day:#e66627;}

.item_tour_day img:nth-child(1){border-top-right-radius: 200px;}
.item_tour_day img:nth-child(2){position: absolute;top: 12px;right: 12px;width: 110px;}
.con_tour_day .text_item_tour_day {background: var(--color_day);color: #fff;padding: 1rem;display: grid;grid-template-columns: 1fr 1fr;grid-template-rows: 60px 40px auto 40px auto;min-height: 56%;}
.item_tour_day h2 {text-transform: uppercase;color: #ffffff;font-weight: 600;padding: 10px 0;font-family: var(--font_title);}
.text_item_tour_day h3 {text-transform: uppercase;font-weight: 400;padding: 0.7rem 0;}
.text_item_tour_day ul li {padding-bottom: 10px;line-height: 1.4;}
.text_item_tour_day ul:nth-of-type(1){display:flex;padding: 0;border: solid 1px #5656568c;padding: 11px;background: #00000085;grid-column: 1 / span 2;}
.text_item_tour_day ul:nth-of-type(1) li {list-style:none;flex-basis:50%;position:relative;background: url(./ico-clock.png)left center no-repeat;background-position-x: 0;padding: 0 0 0 30px;background-size: 20px;}
.text_item_tour_day ul:nth-of-type(2) li {list-style:none;flex-basis:50%;position:relative;background: url(./ico-globe.png)left center no-repeat;background-position-x: 0;padding-left: 25px;background-size: 13px;}
.text_item_tour_day ul:nth-of-type(3) li {list-style:none;flex-basis:50%;position:relative;background: url(./ico-check.png)left center no-repeat;background-position-x: 0;padding-left: 23px;background-size: 20px;}
.text_item_tour_day ul:nth-of-type(4) li {list-style:none;flex-basis:50%;position:relative;background: url(./ico-x.png)left center no-repeat;background-position-x: 0;padding-left: 23px;background-size: 20px;}

.text_item_tour_day h3:nth-of-type(1) {grid-column: 1 /span 2;}
.text_item_tour_day ul:nth-of-type(2) {grid-column: span 2;}
.text_item_tour_day ul:nth-of-type(3) {grid-row: 5;}
.con_tour_day a.wpp-link {background: var(--color_day);text-transform: uppercase;letter-spacing: 2px;font-size: 1.5rem;margin: 0.5rem 0;width: 100%;display: inline-flex;border-radius: 20px;justify-content: center;color: #fff;padding: 0.5rem 0;box-sizing: border-box;}

img.img_default {width: 384px;height: 324px;object-fit: scale-down;background: #3c3c3c;}

footer {background: #2c494f;color: #fff;padding: 1rem;margin-top: 8rem;}
footer .container {display: flex;justify-content: space-around;align-items: center;}
footer .container p {display: flex;align-items: center;}
footer .container p svg {padding-right: 8px;}

a.post-edit-link {color: #fff;position: fixed;top: 1rem;left: 1rem;z-index: 1000;background: #4c114d;padding: 7px 15px;border-radius: 5px;}

.item_tour_day.catalogo_habilitar_no {display: none;}
p.titulo_qr_yape {position: absolute;top: 118px;bottom: auto;right: 12px;display: flex;align-items: center;    justify-content: space-between;padding: 5px 10px;background: #257478;font-size: 15px;border-bottom-left-radius: 5px;border-bottom-right-radius: 5px;}
p.titulo_qr_yape img {border-radius: 0!important;width: 30px;padding-left: 4px;}

@media(max-width:1200px){
    :root{
        --padding_big: 60px;
        --padding_small: 35px;
    }
    html{font-size: 0.9rem;}
    .container {max-width:1024px;}
    .item_how_book {width: 330px;}
    }
@media(max-width:1024px){
:root{
        --padding_big: 50px;
        --padding_small: 35px;
    }
 html{font-size: 0.8rem;}
.container {max-width:768px;}
.header{height: 350px;}
.item_how_book {width: 250px;}
.img_header img {height: 100%;object-fit: cover;}
}

@media(max-width:768px){
:root{--padding: 25px;}
html{font-size: 0.9rem;}
.con_tour_day {grid-template-columns: 1fr 1fr;}
a.prev , a.next {display: block;}

footer .container p {font-size: 10px;}

}
@media(max-width:480px){

:root{--padding: 25px;}
html{font-size: 0.8rem;scroll-snap-type: y mandatory;}
.item_tour_day {width: 100%;min-height: 20vh!important;padding: 10px;box-sizing: border-box;padding-bottom: 50px;}
.con_tour_day {display: block;/* padding: 10px; */}
.item_tour_day:nth-child(odd) {background: #000000;}
a.prev {position: absolute;background: #3d9296;width: 50px;height: 50px;display: flex;align-items: center;justify-content: center;border-radius: 50%;top: 50%;left: 5%;}
a.next {position: absolute;background: #3d9296;width: 50px;height: 50px;display: flex;align-items: center;justify-content: center;border-radius: 50%;top: 50%;right: 5%;}
.how_book {display: flex;justify-content: center;}
footer .container {flex-direction: column;}
footer .container p {padding-bottom: 5px;}
a.wpp-link span {padding-left: 5px;}
.con_tour_day a.wpp-link {font-size: 14px;}

.img_item_tour_day p {font-size: 1.5rem;}

.item_tour_day:nth-child(1n) img{--color_day:#257478;}
.item_tour_day:nth-child(2n) img{--color_day:#9e23a0;}
.item_tour_day:nth-child(3n) img{--color_day:#e66627;}


.item_tour_day img:nth-child(1) {border: solid 5px var(--color_day);border-bottom: none;width: calc(100% - 10px);}
.item_tour_day h2 {color: #fff;padding: 5px;}
picture.img_header img {height: 98vh;object-fit: cover;width: 100%;}
header.header {height: 98vh;}
.item_tour_day img:nth-child(2) {display: none;}
p.titulo_qr_yape {display: none;}

}
@media(max-width:320px){
    :root{--padding: 35px;}
    html{font-size: 0.9rem;}
    
}
