@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@200&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@900&display=swap');

/*    ******  Generales *****   */

html {
    /* 1 */
    -webkit-text-size-adjust: 100%;
    margin: 0;
    padding: 0;
    /* 2 */
}

body {
    background-color: #1e2023;
    margin: 0 !important;
    padding: 0;
    font-family: 'Noto Serif JP', serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    cursor: default;
}

body.last-slide .dimmerColor .dimmerBorder-bottom-right,
body.last-slide .dimmerColor .dimmerBorder-bottom-left {
    width: 50%;
}


/* Cookies*/

.boton-subir,
.politicas-cookie {
    position: fixed;
    z-index: 9;
}

.politicas-cookie {
    display: none;
    background-color: #c8ad73;
    width: 30rem;
    height: 3rem;
    right: 0;
    bottom: 0;
    left: 0;
    padding: 10px;
    text-align: center;
    border-radius: 30px;
    left: auto;
    margin-right: 2.5rem;
    margin-bottom: 3rem;
}

.politicas-cookie a {
    color: #c8ad73;
}

@media (max-width: 767px) {
    .politicas-cookie {
        width: 20rem;
        height: 5rem;
        padding-bottom: 12px;
        left: auto;
        right: auto;
        margin-left: 3%;
        margin-bottom: 18%;
    }
}

.info-cookie {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: center;
    color: #000;
    font-size: 0.6em;
    margin-bottom: 0;
    margin-top: 0;
    font-family: 'Noto Serif JP', serif;
}

.link-politica-cookie {
    color: #000 !important;
    margin: 0 5px;
    font-weight: bold;
    text-decoration: underline;
}

.boton-cookie {
    color: #000 !important;
    margin: 0 5px;
    font-weight: bold;
}


/*  Sección 1 y 2  */

.img-back-slider1 {
    background-color: #cca562;
    background-image: url('../assets/img/Background-Slide1.jpg');
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    padding-top: 5rem;
    padding-bottom: 5rem;
    height: 100vh;
}

.img-back-terms {
    background-color: #cca562;
    background-image: url('../assets/img/Textura-terms-and-conditions2.jpg');
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    padding-top: 1rem;
    padding-bottom: 1rem;
    height: 100%;
}

.img-back-terms1 {
    background-color: #cca562;
    background-image: url('../assets/img/Background-terms-and-conditions2.jpg');
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    padding-top: 1rem;
    padding-bottom: 1rem;
    height: 100%;
}

.back-timeline {
    background-color: #cca562;
    background-image: url('../assets/about/Background-TImeline.jpg');
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    padding-top: 5rem;
    padding-bottom: 5rem;
}

@media (max-width: 767px) {
    .back-timeline {
        background-image: url('../assets/about/Background-TImeline-Movil1.jpg');
        background-position: center;
        background-attachment: fixed;
        background-repeat: repeat;
        background-size: contain;
    }
    .img-back-terms {
        background-image: url('../assets/about/Background-TImeline-Movil1.jpg');
        background-position: center;
        background-attachment: fixed;
        background-repeat: repeat;
        background-size: contain;
    }
}

.img-back-contact1 {
    background-color: #cca562;
    background-image: url('../assets/contact/Background-Slide-contact.jpg');
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    padding-top: 5rem;
    padding-bottom: 5rem;
}

.img-back-alexandra-section1 {
    background-color: #cca562;
    background-image: url('../assets/alexandraTV/background-slide-1.jpg');
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    padding-top: 5rem;
    padding-bottom: 5rem;
    height: 100%;
}

@media (max-width: 767px) {
    .img-back-alexandra-section1 {
        background: url('../assets/alexandraTV/background-slide-1-overlay.jpg');
        background-repeat: no-repeat;
        background-position: left;
        padding-top: 0;
        margin-top: 0;
    }
}

.img-back-events {
    background-color: #cca562;
    background-image: url('../assets/events/background-3.jpg');
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    padding-top: 5rem;
    padding-bottom: 5rem;
}

.img-back-events-slider4 {
    background-color: #cca562;
    background-image: url('../assets/events/Background-slide4.jpg');
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    padding-top: 5rem;
    padding-bottom: 5rem;
}

@media (max-width: 767px) {
    .img-back-slider1 {
        background: url('../assets/img/Background-Slide1-Overlay3.jpg');
        background-position: right;
        background-repeat: no-repeat;
        background-position: top center;
        padding-top: 0;
        margin-top: 0;
    }
    .img-back-events-slider4 {
        background-image: url('../assets/events/Textura-Movil.jpg');
        width: 300px;
        max-width: 400px;
        background-size: contain;
        background-repeat: repeat;
    }
    .img-back-contact1 {
        /* background-image: url('../assets/contact/Background-Slide1-overlay.jpg');
        background-position: right;
        background-repeat: no-repeat;
        background-position: top center;
        padding-top: 0;
        margin-top: 0; */
        background: url('../assets/contact/Background-Slide1-overlay.jpg');
        background-position: right;
        background-repeat: no-repeat;
        background-position: top center;
        padding-top: 0;
        margin-top: 0;
    }
    .img-back-slider1-events {
        background-color: white;
        background-position: right;
        background-repeat: no-repeat;
        background-position: top center;
        padding-top: 0;
        margin-top: 0;
    }
}

.img-sec2 {
    margin-left: 0;
}

.main1 {
    height: 100vh;
}

.slider1-home {
    padding-top: 5% !important;
}

.section2 {
    margin-top: 10%;
    margin-bottom: 5%;
    margin-bottom: 0px;
}

.text-slider-1 {
    color: #cca562;
    text-align: justify;
    font-family: 'Noto Serif JP', serif;
}

@media (min-width: 1450px) {
    .img-back-slider1 {
        height: 100%;
    }
    .main1 {
        height: 100vh;
        padding-top: 35vh;
    }
    .text-slider-1,
    .text-slider-2 {
        font-size: 1.4rem;
    }
    .img-sec2 {
        margin-left: 20%;
    }
}

@media (max-width: 767px) {
    .img-sec2 {
        padding: 20px;
    }
    .main1 {
        height: 100%;
    }
}

@media (max-width: 767px) {
    .text-slider-1,
    .text-slider-2 {
        margin: 2rem;
    }
}

.text-slider-2 {
    color: #cca562;
    text-align: justify;
    font-family: 'Noto Serif JP', serif;
    font-size: 1.2rem;
}


/*Footer*/

.text-footer {
    color: #c8ad73;
    font-family: 'Noto Serif JP', serif;
}

@keyframes mover {
    0% {
        transform: translate(-100%);
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@keyframes mover-center {
    0% {
        transform: translateY(100%);
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@keyframes mover-right {
    0% {
        transform: translate(100%);
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

.text-footer-center {
    color: #c8ad73;
    font-family: 'Noto Serif JP', serif;
    font-weight: 900;
    font-size: 18px;
}

.text-footer-center-p {
    color: #c8ad73;
    font-family: 'Noto Serif JP', serif;
    font-size: 14px;
}

.text-footer-left {
    color: #c8ad73;
    font-family: 'Noto Serif JP', serif;
    font-size: 1rem;
    text-align: center;
}

.redes {
    width: 40px;
    height: 40px;
    margin-top: 0.9rem;
}

.text-footer-left1 {
    font-size: 1.7rem;
    text-align: center;
}


/******************  Cursor   *****/

.cursor {
    width: 6px;
    height: 6px;
    background: #c8ad73;
    border-radius: 50%;
    position: absolute;
    z-index: 10000000;
}


/*  Banner  */

.site-content {
    max-width: 1100px;
    height: 100vh;
    margin-left: auto;
    margin-right: auto;
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
}

@media (max-width: 767px) {
    .site-content {
        height: 65vh;
    }
}

.site-content__headline {
    font-weight: 200;
    color: #ffffff;
    font-size: calc(2vw + 10px);
}

a {
    color: #cca562 !important;
}

.justify-content-center1 {
    -ms-flex-pack: center !important;
    position: absolute;
    right: 40% !important;
    height: 30px;
    width: 30px;
    position: fixed;
    z-index: 11;
    left: 40%;
    top: 0%;
}

.justify-content-center2 {
    position: fixed;
    z-index: 9;
    display: flex;
    justify-content: center;
    float: none;
    padding-left: 25px;
    padding-top: 10px;
}

.justify-content-center3 {
    -ms-flex-pack: center !important;
    position: absolute;
    right: 40% !important;
    height: 30px;
    width: 30px;
    z-index: 9;
    left: 45.5%;
    top: 70%;
}


/*--------------------Menu ***********/

.menu-icon {
    position: fixed;
    z-index: 11;
    bottom: 0;
    cursor: pointer;
    padding-bottom: 10px;
}

@media (min-width: 1450px) {
    .menu-icon {
        top: 95vh;
    }
}

@media (max-width: 767px) {
    .menu-icon {
        padding-bottom: 0;
    }
}

.menu-icon:hover {
    transition: ease-in 2s;
}

.nav {
    position: fixed;
    z-index: 10;
}

.nav:before,
.nav:after {
    content: "";
    position: fixed;
    width: 100vw;
    height: 100vh;
    background: rgba(234, 234, 234, 0.2);
    z-index: -1;
    -webkit-transition: -webkit-transform cubic-bezier(0.77, 0, 0.175, 1) 0.8s;
    transition: -webkit-transform cubic-bezier(0.77, 0, 0.175, 1) 0.8s;
    transition: transform cubic-bezier(0.77, 0, 0.175, 1) 0.8s;
    transition: transform cubic-bezier(0.77, 0, 0.175, 1) 0.8s, -webkit-transform cubic-bezier(0.77, 0, 0.175, 1) 0.8s;
    -webkit-transform: translateX(0%) translateY(-100%);
    transform: translateX(0%) translateY(-100%);
}

.nav:after {
    background: white;
    -webkit-transition-delay: 0s;
    transition-delay: 0s;
}

.nav:before {
    -webkit-transition-delay: .1s;
    transition-delay: .1s;
}

.nav__content {
    position: fixed;
    top: 50%;
    -webkit-transform: translate(0%, -50%);
    transform: translate(0%, -50%);
    width: 100%;
    text-align: center;
    font-size: calc(2vw + 10px);
    font-weight: 200;
    visibility: hidden;
}

.nav__list-item {
    position: relative;
    padding-top: 2rem;
    -webkit-transition-delay: 1s;
    transition-delay: 1s;
    opacity: 0;
    -webkit-transform: translate(-100%, 0%);
    transform: translate(-100%, 0%);
    -webkit-transition: opacity 300ms ease-in, -webkit-transform 300ms ease-in;
    transition: opacity 300ms ease-in, -webkit-transform 300ms ease;
    transition: opacity 300ms ease-in, transform 300ms ease-in;
    transition: opacity 300ms ease-in, transform 300ms ease-in, -webkit-transform 300ms ease-in;
    transition: opacity 300ms ease-in, transform 300ms ease-in, -webkit-transform 300ms ease-in;
    margin-right: 25px;
    font-family: 'Noto Serif JP', serif;
    text-align: right;
    font-size: 30px;
    padding-right: 1.5rem;
    color: #cca562;
}

@media (max-width: 767px) {
    .nav__list-item {
        font-size: 18px;
    }
    .slider-banner img {
        width: 100vw;
        height: 350px;
        display: block;
        object-fit: cover;
    }
}

.boder-right1 {
    border-right: 1px solid #cca562!important;
}

@media (max-width: 767px) {
    .boder-right1 {
        border-right: 1px solid transparent !important;
    }
}

.nav__list-item:before {
    content: "";
    position: absolute;
    background: transparent;
    width: 20px;
    height: 1px;
    top: 100%;
    -webkit-transform: translate(0%, 0%);
    transform: translate(0%, 0%);
    -webkit-transition: all .3s ease-in;
    transition: all .3s ease-in;
    z-index: -1;
}

body.nav-active .menu-icon__line {
    background-color: transparent;
    -webkit-transform: translateX(0px) rotate(-45deg);
    transform: translateX(0px) rotate(-45deg);
}

body.nav-active .menu-icon__line-left {
    -webkit-transform: translateX(1px) rotate(45deg);
    transform: translateX(1px) rotate(45deg);
}

body.nav-active .menu-icon__line-right {
    -webkit-transform: translateX(-2px) rotate(45deg);
    transform: translateX(-2px) rotate(45deg);
}

body.nav-active .nav .nav__content {
    visibility: visible;
}

body.nav-active .nav:before,
body.nav-active .nav:after {
    -webkit-transform: translateX(0%) translateY(0%);
    transform: translateX(0%) translateY(0%);
}

body.nav-active .nav:after {
    -webkit-transition-delay: .1s;
    transition-delay: .1s;
}

body.nav-active .nav:before {
    -webkit-transition-delay: 0s;
    transition-delay: 0s;
}

body.nav-active .nav__list-item {
    opacity: 1;
    -webkit-transform: translateX(0%);
    transform: translateX(0%);
    -webkit-transition: opacity .6s ease, color .6s ease, -webkit-transform .6s ease;
    transition: opacity .6s ease, color .6s ease, -webkit-transform .6s ease;
    transition: opacity .6s ease, transform .6s ease, color .6s ease;
    transition: opacity .6s ease, transform .6s ease, color .6s ease, -webkit-transform .6s ease;
}

body.nav-active .nav__list-item:nth-child(0) {
    -webkit-transition-delay: 0.5s;
    transition-delay: 0.5s;
}

body.nav-active .nav__list-item:nth-child(1) {
    -webkit-transition-delay: 0.6s;
    transition-delay: 0.6s;
}

body.nav-active .nav__list-item:nth-child(2) {
    -webkit-transition-delay: 0.7s;
    transition-delay: 0.7s;
}

body.nav-active .nav__list-item:nth-child(3) {
    -webkit-transition-delay: 0.8s;
    transition-delay: 0.8s;
}

body.nav-active .nav__list-item:nth-child(4) {
    -webkit-transition-delay: 0.9s;
    transition-delay: 0.9s;
}

body.nav-active .nav__list-item:nth-child(5) {
    -webkit-transition-delay: 1s;
    transition-delay: 1s;
}

body.nav-active .nav__list-item:nth-child(6) {
    -webkit-transition-delay: 1.1s;
    transition-delay: 1.1s;
}

body.nav-active .nav__list-item:nth-child(7) {
    -webkit-transition-delay: 1.3s;
    transition-delay: 1.3s;
}


/* ******************* Spotlight ***********/

.focus {
    position: absolute;
    width: 100%;
    height: 100%;
}

@media (max-width: 767px) {
    .focus {
        visibility: hidden;
    }
    .focus-responsive {
        /* background-color: rgba(234, 234, 234, 0.8);
        width: 100%;
        height: auto;
        z-index: 14; */
        visibility: hidden;
    }
}


/* ******************* Video background sección1 Home ***********/


/*  Sección About video Banner */

.myVideo1 {
    width: auto;
    height: 100%;
    position: fixed;
    margin: 0;
    padding: 0;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    z-index: -2;
    background-size: cover;
}

@media (max-width: 767px) {
    .myVideo1 {
        background-image: url('../assets/about/bannerAboutPic.png');
        height: 100%;
        width: auto;
        background-attachment: fixed;
        background-repeat: no-repeat;
        transform: none;
        padding: 0;
        margin: 0;
    }
    .myVideo1 video {
        display: none;
    }
}


/*  Video Home y Contact */

.myVideo {
    height: 100vh;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -2;
    object-fit: cover;
    overflow: hidden;
}


/* ******************* Lineas doradas decorativas ***********/

.dimmerColor {
    pointer-events: none;
    width: 100vw;
    height: 100%;
    position: absolute;
    position: fixed;
    top: 0;
    z-index: 4;
}

.dimmerColor .preload-screen {
    background: black;
    position: fixed;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 1;
    cursor: initial;
}

.dimmerColor .preload-screen .logo {
    -webkit-transform: translateY(-webkit-calc(50vh - 5.5em)) scale(0.5);
    -ms-transform: translateY(calc(50vh - 5.5em)) scale(0.5);
    transform: translateY(calc(50vh - 5.5em)) scale(0.5);
    height: 11em;
    opacity: 0;
    display: block;
}

.dimmerColor .preload-screen .logo svg {
    height: 100% !important;
}

.dimmerColor .preload-screen .logo path {
    fill: #c8ad73;
}

.dimmerColor .dimmerBorder {
    height: -webkit-calc(100% - 4.5em);
    height: calc(100% - 4em);
    width: -webkit-calc(100% - 4.5em);
    width: calc(100% - 4.5em);
    position: absolute;
    margin: 2em;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    z-index: 2;
}

.dimmerColor .dimmerBorder div {
    position: absolute;
    background: rgba(200, 173, 115);
    -webkit-transform-origin: left top;
    -ms-transform-origin: left top;
    transform-origin: left top;
}

.dimmerColor .dimmerBorder .dimmerBorder-top-left,
.dimmerColor .dimmerBorder .dimmerBorder-top-right,
.dimmerColor .dimmerBorder .dimmerBorder-bottom-left,
.dimmerColor .dimmerBorder .dimmerBorder-bottom-right {
    width: 50%;
    -webkit-transform: scaleX(0);
    -ms-transform: scaleX(0);
    transform: scaleX(0);
}

.dimmerColor .dimmerBorder .dimmerBorder-top-left {
    height: 2px;
    background: -webkit-gradient(linear, left top, right top, color-stop(20vw, rgba(200, 173, 115)), color-stop(43vw, rgba(200, 173, 115, 0)));
    background: -o-linear-gradient(left, rgba(78, 69, 49) 20vw, rgba(200, 173, 115, 0) 43vw);
    background: linear-gradient(to right, rgba(200, 173, 115) 20vw, rgba(200, 173, 115, 0) 43vw);
    animation-duration: 0.6s;
    animation-name: slidein;
}

@keyframes slidein {
    from {
        transform: matrix(0, 0, 0, 1, 0, 0);
    }
    10% {
        transform: matrix(0.10, 0, 0, 1, 0, 0);
    }
    20% {
        transform: matrix(0.20, 0, 0, 1, 0, 0);
    }
    30% {
        transform: matrix(0.30, 0, 0, 1, 0, 0);
    }
    50% {
        transform: matrix(0.50, 0, 0, 1, 0, 0);
    }
    75% {
        transform: matrix(0.75, 0, 0, 1, 0, 0);
    }
    100% {
        transform: matrix(1, 0, 0, 1, 0, 0);
        visibility: visible;
    }
}

@media all and (max-width: 1024px) {
    .dimmerColor .dimmerBorder .dimmerBorder-top-left {
        background: -webkit-gradient(linear, left top, right top, color-stop(35vw, rgba(200, 173, 115)), color-stop(40vw, rgba(200, 173, 115, 0)));
        background: -o-linear-gradient(left, rgba(200, 173, 115) 35vw, rgba(200, 173, 115, 0) 40vw);
        background: linear-gradient(to right, rgba(200, 173, 115) 35vw, rgba(200, 173, 115, 0) 40vw);
    }
}

@media all and (max-width: 567px) {
    .dimmerColor .dimmerBorder .dimmerBorder-top-left {
        background: -webkit-gradient(linear, left top, right top, color-stop(30vw, rgba(200, 173, 115)), color-stop(35vw, rgba(200, 173, 115, 0)));
        background: -o-linear-gradient(left, rgba(200, 173, 115) 30vw, rgba(200, 173, 115, 0) 35vw);
        background: linear-gradient(to right, rgba(200, 173, 115) 30vw, rgba(200, 173, 115, 0) 35vw);
    }
}

.dimmerColor .dimmerBorder .dimmerBorder-top-right {
    -webkit-transform-origin: right;
    -ms-transform-origin: right;
    transform-origin: right;
    height: 2px;
    right: 0;
    background: -webkit-gradient(linear, right top, left top, color-stop(20vw, rgba(200, 173, 115)), color-stop(20vw, rgba(200, 173, 115, 0)));
    background: -o-linear-gradient(right, rgba(200, 173, 115) 20vw, rgba(200, 173, 115, 0) 43vw);
    background: linear-gradient(to left, rgba(200, 173, 115) 20vw, rgba(200, 173, 115, 0) 43vw);
    animation-duration: 1.2s;
    animation-name: slidein3;
}

@keyframes slidein3 {
    from {
        visibility: visible;
        transform: matrix(0, 0, 0, 1, 0, 0);
    }
    10% {
        transform: matrix(0.10, 0, 0, 1, 0, 0);
    }
    20% {
        transform: matrix(0.20, 0, 0, 1, 0, 0);
    }
    30% {
        transform: matrix(0.30, 0, 0, 1, 0, 0);
    }
    40% {
        transform: matrix(0.40, 0, 0, 1, 0, 0);
    }
    50% {
        transform: matrix(0.50, 0, 0, 1, 0, 0);
    }
    75% {
        transform: matrix(0.75, 0, 0, 1, 0, 0);
    }
    to {
        transform: matrix(1, 0, 0, 1, 0, 0);
    }
}

.dimmerColor .dimmerBorder .dimmerBorder-top-right:after {
    content: "";
    height: 100%;
    width: 100%;
    position: absolute;
}

@media all and (max-width: 1024px) {
    .dimmerColor .dimmerBorder .dimmerBorder-top-right {
        background: -webkit-gradient(linear, right top, left top, color-stop(35vw, rgba(200, 173, 115)), color-stop(40vw, rgba(200, 173, 115, 0)));
        background: -o-linear-gradient(right, rgba(200, 173, 115) 35vw, rgba(200, 173, 115, 0) 40vw);
        background: linear-gradient(to left, rgba(200, 173, 115) 35vw, rgba(200, 173, 115, 0) 40vw);
    }
}

@media all and (max-width: 567px) {
    .dimmerColor .dimmerBorder .dimmerBorder-top-right {
        background: -webkit-gradient(linear, right top, left top, color-stop(30vw, rgba(200, 173, 115)), color-stop(35vw, rgba(200, 173, 115, 0)));
        background: -o-linear-gradient(right, rgba(200, 173, 115) 30vw, rgba(200, 173, 115, 0) 35vw);
        background: linear-gradient(to left, rgba(200, 173, 115) 30vw, rgba(200, 173, 115, 0) 35vw);
    }
}

.dimmerColor .dimmerBorder .dimmerBorder-bottom-left {
    height: 2px;
    bottom: 0;
    width: 47.5%;
    animation-duration: 1.2s;
    animation-name: slidein4;
}

@keyframes slidein4 {
    from {
        visibility: visible;
        transform: matrix(0, 0, 0, 1, 0, 0);
    }
    10% {
        transform: matrix(0.10, 0, 0, 1, 0, 0);
    }
    20% {
        transform: matrix(0.20, 0, 0, 1, 0, 0);
    }
    30% {
        transform: matrix(0.30, 0, 0, 1, 0, 0);
    }
    40% {
        transform: matrix(0.40, 0, 0, 1, 0, 0);
    }
    50% {
        transform: matrix(0.50, 0, 0, 1, 0, 0);
    }
    75% {
        transform: matrix(0.75, 0, 0, 1, 0, 0);
    }
    to {
        transform: matrix(1, 0, 0, 1, 0, 0);
    }
}

@media all and (max-width: 768px) {
    .dimmerColor .dimmerBorder .dimmerBorder-bottom-left {
        width: 45.5%;
    }
}

@media all and (max-width: 567px) {
    .dimmerColor .dimmerBorder .dimmerBorder-bottom-left {
        width: 42%;
    }
}

.dimmerColor .dimmerBorder .dimmerBorder-bottom-right {
    -webkit-transform-origin: right;
    -ms-transform-origin: right;
    transform-origin: right;
    height: 2px;
    width: 47.5%;
    right: 0;
    bottom: 0;
    animation-duration: 0.6s;
    animation-name: slidein1;
}

@keyframes slidein1 {
    from {
        visibility: visible;
        transform: matrix(0, 0, 0, 1, 0, 0);
    }
    10% {
        transform: matrix(0.10, 0, 0, 1, 0, 0);
    }
    20% {
        transform: matrix(0.20, 0, 0, 1, 0, 0);
    }
    30% {
        transform: matrix(0.30, 0, 0, 1, 0, 0);
    }
    40% {
        transform: matrix(0.40, 0, 0, 1, 0, 0);
    }
    50% {
        transform: matrix(0.50, 0, 0, 1, 0, 0);
    }
    75% {
        transform: matrix(0.75, 0, 0, 1, 0, 0);
    }
    to {
        transform: matrix(1, 0, 0, 1, 0, 0);
    }
}

@media all and (max-width: 768px) {
    .dimmerColor .dimmerBorder .dimmerBorder-bottom-right {
        width: 45.5%;
    }
}

@media all and (max-width: 567px) {
    .dimmerColor .dimmerBorder .dimmerBorder-bottom-right {
        width: 42%;
    }
}

.dimmerColor .dimmerBorder .dimmerBorder-bottom-right:after {
    content: "";
    height: 100%;
    width: 100%;
    position: absolute;
}

.dimmerColor .dimmerBorder .dimmerBorder-left {
    height: 100%;
    width: 2px;
    animation-duration: 0.6s;
    animation-name: slidein5;
    -webkit-transform: scaleY(0);
    -ms-transform: scaleY(0);
    transform: scaleY(0);
}

@keyframes slidein5 {
    from {
        visibility: visible;
        transform: matrix(1, 0, 0, 0, 0, 0);
    }
    10% {
        transform: matrix(1, 0, 0, 0.10, 0, 0);
    }
    20% {
        transform: matrix(1, 0, 0, 0.20, 0, 0);
    }
    30% {
        transform: matrix(1, 0, 0, 0.30, 0, 0);
    }
    40% {
        transform: matrix(1, 0, 0, 0.40, 0, 0);
    }
    50% {
        transform: matrix(1, 0, 0, 0.50, 0, 0);
    }
    75% {
        transform: matrix(1, 0, 0, 0.75, 0, 0);
    }
    to {
        transform: matrix(1, 0, 0, 1, 0, 0);
    }
}

.dimmerColor .dimmerBorder .dimmerBorder-right {
    height: 100%;
    width: 2px;
    right: 0;
    animation-duration: 0.6s;
    animation-name: slidein6;
    -webkit-transform-origin: bottom;
    -ms-transform-origin: bottom;
    transform-origin: bottom;
    -webkit-transform: scaleY(0);
    -ms-transform: scaleY(0);
    transform: scaleY(0);
}

@keyframes slidein6 {
    from {
        visibility: visible;
        transform: matrix(1, 0, 0, 0, 0, 0);
    }
    10% {
        transform: matrix(1, 0, 0, 0.10, 0, 0);
    }
    20% {
        transform: matrix(1, 0, 0, 0.20, 0, 0);
    }
    30% {
        transform: matrix(1, 0, 0, 0.30, 0, 0);
    }
    40% {
        transform: matrix(1, 0, 0, 0.40, 0, 0);
    }
    50% {
        transform: matrix(1, 0, 0, 0.50, 0, 0);
    }
    75% {
        transform: matrix(1, 0, 0, 0.75, 0, 0);
    }
    to {
        transform: matrix(1, 0, 0, 1, 0, 0);
    }
}

header a {
    height: 100%;
}

header .logo {
    z-index: 1;
    top: 2.75em;
    margin: 0 auto;
    height: 5.5em;
    pointer-events: all;
}

header .logo object {
    width: 28.6em;
    height: 3.1em;
    margin: -0.7em 0 0 -0.7em;
}

header .logo svg {
    height: 100%;
}

header .logo svg path {
    fill: #c8ad73;
}

header .logo a {
    display: inline-block;
    position: relative;
    cursor: pointer;
}

header .logo a:after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}


/*********************** Testimonios Slider  *******/

.slider {
    width: 98%;
    margin: auto;
    height: 350px;
    position: relative;
    z-index: 1;
}

@media (max-width: 767px) {
    .slider {
        width: 79vw;
        margin: auto;
        padding-right: 1.5%;
    }
}

@media (min-width: 1450px) {
    .slider {
        width: 98%;
        margin: auto;
        height: 600px;
        position: relative;
        z-index: 1;
        padding-top: 40px;
        margin-bottom: 40px;
    }
}

.slider ul,
.slider ul li {
    width: 100%;
    height: 100%
}

.slider ul {
    position: relative;
    overflow: hidden;
    border-radius: 15px
}

.slider ul li {
    position: absolute;
    top: 0;
    left: -100%;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    color: #fff;
    font-family: serif;
}

.slider ul li:first-of-type {
    background-image: url("../assets/img/testimonio/Card1.jpg");
}

.slider ul li:nth-of-type(2) {
    background-image: url("../assets/img/testimonio/Card2.jpg")
}

.slider ul li:nth-of-type(3) {
    background-image: url("../assets/img/testimonio/Card3.jpg")
}

.slider ul li:nth-of-type(4) {
    background-image: url("../assets/img/testimonio/Card4.jpg")
}

.slider ul li:nth-of-type(5) {
    background-image: url("../assets/img/testimonio/Card5.jpg")
}

.slider ul li:nth-of-type(6) {
    background-image: url("../assets/img/testimonio/Card6.jpg")
}

.slider ul li:nth-of-type(7) {
    background-image: url("../assets/img/testimonio/Card7.jpg")
}

.slider ul li:nth-of-type(8) {
    background-image: url("../assets/img/testimonio/Card8.jpg")
}

.slider ul li:nth-of-type(9) {
    background-image: url("../assets/img/testimonio/Card9.jpg")
}

.slider ul li:nth-of-type(10) {
    background-image: url("../assets/img/testimonio/Card10.jpg")
}

.slider ul li:nth-of-type(11) {
    background-image: url("../assets/img/testimonio/Card11.jpg")
}

.slider ul li:last-of-type {
    background-image: url("../assets/img/testimonio/Card12.jpg")
}

.slider .controll {
    width: 40px;
    height: 40px;
    position: absolute;
    top: 44%;
    border-bottom: 3px solid #c8ad73;
    border-left: 3px solid #c8ad73;
    cursor: pointer;
    color: #333;
    z-index: 30;
}

@media (max-width: 767px) {
    .slider .controll {
        visibility: hidden;
    }
}

.slider .controll:first-of-type {
    transform: rotate(45deg);
    left: 20px;
    z-index: 30;
    cursor: pointer;
}

.slider .controll:last-of-type {
    transform: rotate(225deg);
    right: 20px;
    z-index: 30;
    cursor: pointer;
}

.slider .controll:hover,
.slider .controll.active {
    border-color: rgb(133, 133, 133);
    z-index: 30;
    cursor: pointer;
}

.slider ol {
    text-align: center;
    padding-top: 10px
}

.slider ol li {
    display: inline-block;
    margin-right: 5px;
}

.slider ol .fa {
    font-size: 20px;
    color: #333;
    cursor: pointer;
    font-weight: normal;
}

.slider ol li:hover .fa:before,
.slider ol li.active .fa:before {
    content: "\f111"
}


/*********************** Testimonios Slider Alexandra TV  *******/

.slider1 {
    width: 98%;
    margin: auto;
    height: 350px;
    position: relative;
    z-index: 1;
}

@media (max-width: 767px) {
    .slider1 {
        width: 79vw;
        margin: auto;
        padding-right: 1.5%;
    }
}

@media (min-width: 1450px) {
    .slider1 {
        width: 98%;
        margin: auto;
        height: 600px;
        position: relative;
        z-index: 1;
        padding-top: 40px;
        margin-bottom: 40px;
    }
}

.slider1 ul,
.slider1 ul li {
    width: 100%;
    height: 100%
}

.slider1 ul {
    position: relative;
    overflow: hidden;
    border-radius: 15px
}

.slider1 ul li {
    position: absolute;
    top: 0;
    left: -100%;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    color: #fff;
    font-family: serif;
}

.slider1 ul li:first-of-type {
    background-image: url("../assets/alexandraTV/Card13.jpg");
}

.slider1 ul li:nth-of-type(2) {
    background-image: url("../assets/alexandraTV/Card14.jpg")
}

.slider1 ul li:nth-of-type(3) {
    background-image: url("../assets/alexandraTV/Card15.jpg")
}

.slider1 ul li:nth-of-type(4) {
    background-image: url("../assets/alexandraTV/Card16.jpg")
}

.slider1 ul li:nth-of-type(5) {
    background-image: url("../assets/alexandraTV/Card17.jpg")
}

.slider1 ul li:nth-of-type(6) {
    background-image: url("../assets/alexandraTV/Card18.jpg")
}

.slider1 ul li:nth-of-type(7) {
    background-image: url("../assets/alexandraTV/Card19.jpg")
}

.slider1 ul li:nth-of-type(8) {
    background-image: url("../assets/alexandraTV/Card20.jpg")
}

.slider1 ul li:nth-of-type(9) {
    background-image: url("../assets/alexandraTV/Card21.jpg")
}

.slider1 ul li:nth-of-type(10) {
    background-image: url("../assets/alexandraTV/Card22.jpg")
}

.slider1 .controll {
    width: 40px;
    height: 40px;
    position: absolute;
    top: 44%;
    border-bottom: 3px solid #c8ad73;
    border-left: 3px solid #c8ad73;
    cursor: pointer;
    color: #333;
    z-index: 30;
}

@media (max-width: 767px) {
    .slider1 .controll {
        visibility: hidden;
    }
}

.slider1 .controll:first-of-type {
    transform: rotate(45deg);
    left: 20px;
    z-index: 30;
    cursor: pointer;
}

.slider1 .controll:last-of-type {
    transform: rotate(225deg);
    right: 20px;
    z-index: 30;
    cursor: pointer;
}

.slider1 .controll:hover,
.slider1 .controll.active {
    border-color: rgb(133, 133, 133);
    z-index: 30;
    cursor: pointer;
}

.slider1 ol {
    text-align: center;
    padding-top: 10px
}

.slider1 ol li {
    display: inline-block;
    margin-right: 5px;
}

.slider1 ol .fa {
    font-size: 20px;
    color: #333;
    cursor: pointer;
    font-weight: normal;
}

.slider1 ol li:hover .fa:before,
.slider1 ol li.active .fa:before {
    content: "\f111"
}


/* .slider ul li.active {
  z-index: 999;
  left: 0
} */

@media(max-width: 490px) {
    h1 {
        font-size: 45px
    }
}

@media(max-width: 350px) {
    h1 {
        font-size: 25px
    }
}

.boton-test {
    width: 260px;
    height: 50px;
    background-color: #c8ad73;
    background-image: url('../assets/img/testimonio/Hover-button-love.png');
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}

.boton-test:hover {
    background-color: #fff;
    border: 1px #c8ad73;
    background-image: url('../assets/img/testimonio/button-love.png');
}

.boton-learn {
    width: 260px;
    height: 50px;
    background-color: #c8ad73;
    background-image: url('../assets/img/Learn-more.png');
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}

.boton-learn:hover {
    background-color: #fff;
    border: 1px #c8ad73;
    background-image: url('../assets/img/Hover-learn-more.png');
}

.boton-tv {
    width: 260px;
    height: 50px;
    background-color: #c8ad73;
    background-image: url('../assets/img/go-to-alexandra-tv.png');
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}

.boton-tv:hover {
    background-color: #fff;
    border: 1px #c8ad73;
    background-image: url('../assets/img/Hover-go-to-alexandra-tv.png');
}

.boton-contact {
    width: 260px;
    height: 50px;
    background-color: #c8ad73;
    background-image: url('../assets/contact/Contact-us_.png');
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    border: transparent;
    outline: transparent;
}

.boton-contact:hover {
    background-color: #fff;
    border: 1px #c8ad73;
    background-image: url('../assets/contact/Contact-us-Hover.png');
    border: transparent;
    outline: transparent;
}

.boton-contact-events {
    width: 260px;
    height: 50px;
    background-color: #c8ad73;
    background-image: url('../assets/events/Botton-form-slide3.png');
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    border: transparent;
    outline: transparent;
}

.boton-contact-events:hover {
    background-color: #fff;
    border: 1px #c8ad73;
    background-image: url('../assets/events/Hover-botton-form-slide3.png');
    border: transparent;
    outline: transparent;
}

.boton-contact-events-final {
    width: 260px;
    height: 50px;
    background-color: #c8ad73;
    background-image: url('../assets/events/Boton-slide-4.png');
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    border: transparent;
    outline: transparent;
}

.boton-contact-events-final:hover {
    background-color: #fff;
    border: 1px #c8ad73;
    background-image: url('../assets/events/Hover-slide-4.png');
    border: transparent;
    outline: transparent;
}

.boton-contact-large {
    width: 260px;
    height: 50px;
    background-color: #c8ad73;
    background-image: url('../assets/events/boton-form-slide2.png');
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    border: transparent;
    outline: transparent;
}

.boton-contact-large:hover {
    background-color: #fff;
    border: 1px #c8ad73;
    background-image: url('../assets/events/Hover.boton-form-slide2.png');
    border: transparent;
    outline: transparent;
}

.send-contact {
    width: 260px;
    height: 50px;
    background-color: #c8ad73;
    background-image: url('../assets/contact/Send-message-white.png');
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    border: transparent;
    outline: transparent;
}

.send-contact:hover {
    background-color: #fff;
    border: 1px #c8ad73;
    background-image: url('../assets/contact/Send-message-beige.png');
    border: transparent;
    outline: transparent;
}


/* *********** Seccion 4 ************
.style1:hover{
  background-color: #c8ad73;
  border-radius: 50%;
  
}
*/


/*  Sección 5  */

.hoverDoIt {
    background-image: url(../assets/img/seccion5/Foto-slide5-.jpg);
    width: 97%;
    height: 97%;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    transition-property: background-image;
    transition-duration: 0.8s;
    transition-timing-function: linear;
    transition-delay: 0.2s;
}

.hoverDoIt:hover {
    background-image: url(../assets/img/seccion5/Hover-Foto-slide5-.jpg);
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}

@media (max-width: 767px) {
    .hoverDoIt {
        width: 300px;
        height: 300px;
        margin: 0;
        padding: 0;
        margin-left: 30px;
        margin-bottom: 100px;
        display: block;
    }
}


/* .img-back-sec5 {
    background-image: url('../assets/img/seccion5/Background-Slide5.jpg');
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    height: 100vh;
}
.slider5-home{
    padding-top: 10%;
}
@media (max-width: 767px) {
    .img-back-sec5 {
        height: 190vh;
    }
} */

.slider5-home {
    padding-top: 10%;
    padding-bottom: 10%;
}


/* .img-back-sec5 {
    background-image: url('../assets/img/seccion5/Background-Slide5.jpg');
    background-attachment: fixed;
    background-position: center;
    background-size: cover;
    height: 100%;
    width: 100%;
}

@media (max-width: 767px) {
    .img-back-sec5 {
        background-image: url('../assets/img/Background-Slide1-Overlay3.jpg') !important;
        background-position: left center;
        background-repeat: repeat;
        padding-top: 0;
        margin-top: 0;
    }
} */

.back-slide1-shop {
    background-color: #cca562;
    background-image: url('../assets/shop/background-slide-1-overlay.jpg');
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    padding-top: 5rem;
    padding-bottom: 5rem;
    height: 100%;
}

@media (max-width: 767px) {
    .back-slide1-shop {
        /* background: url('../assets/shop/background-slide-1-overlay.jpg');
        background-position: right;
        background-repeat: no-repeat;
        background-position: top center;
        background-size: cover;
        padding: 0 !important;
        margin: 0 !important;
        height: 100%; */
        background: url('../assets/shop/background-slide-1-overlay.jpg');
        background-position: right;
        background-repeat: repeat;
        background-position: top center;
        padding-top: 0;
        margin-top: 0;
    }
}

.img-back-sec5 {
    background-color: #cca562;
    background-image: url('../assets/img/seccion5/Background-Slide5.jpg');
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    padding-top: 5rem;
    padding-bottom: 5rem;
    height: 100%;
}

@media (max-width: 767px) {
    .img-back-sec5 {
        background: url('../assets/img/Background-Slide5-Overlay.jpg');
        background-position: right;
        background-repeat: no-repeat;
        background-position: top center;
        padding-top: 0;
        margin-top: 0;
    }
}

@media (min-width: 1400px) {
    .img-back-sec5 {
        width: 98%;
        height: 100%;
        display: block;
        object-fit: cover;
    }
}


/*    SECTION ABOUT    */

.img-back-slider2 {
    background-color: white;
    background-image: url('../assets/about/Background-Slide2-About-1920x1080.jpg');
    background-position: left;
    background-repeat: no-repeat;
    margin-bottom: 5rem;
    background-size: cover;
}

@media (max-width: 767px) {
    .img-back-slider2 {
        background-image: url('../assets/about/seccion1-phone-back.jpg');
        background-position: left;
        background-repeat: no-repeat;
        z-index: -10;
    }
}


/* testimoniales  */

.img-back-test {
    background-color: #cca562;
    background-image: url('../assets/alexandraTV/Background-fecha.jpg');
    background-position: center;
    background-attachment: fixed;
    background-repeat: repeat;
    padding-top: 5rem;
    padding-bottom: 5rem;
    height: 100%;
}

@media (max-width: 767px) {
    .img-back-test {
        background: url('../assets/alexandraTV/Background-fecha.jpg');
        background-position: right;
        background-repeat: repeat;
        background-position: top center;
        padding-top: 15px;
        margin-top: 0;
    }
}


/* Slider About  */

#container-slider {
    height: 60vh;
    background-color: white !important;
}

.main-slider {
    background-image: url('../assets/about/Slider2.png');
    background-position: center;
    background-repeat: no-repeat;
    color: white;
    height: 100%;
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    background-color: white !important;
}

.main-slider1 {
    background-image: url('../assets/events/Slider.jpg');
    background-repeat: no-repeat;
    background-position: center;
    color: white;
    height: 100%;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
}

.rectangulo {
    background-color: #cca562;
    height: 210px;
    padding: 10px;
}

.section-3 {
    margin-top: 30vh;
}

@media (max-width: 767px) {
    #container-slider {
        height: 100vh;
    }
    .main-slider {
        margin-top: 20px;
        background-position-x: right;
    }
    .rectangulo {
        padding: 10px;
        height: 100%;
    }
    .section-3 {
        margin-top: 5vh;
    }
}

@media (min-width: 1920px) {
    #container-slider {
        height: 50vh;
    }
    .section-3 {
        margin-top: 0;
    }
}

.img-back-slider5-about {
    background-color: #cca562;
    background-image: url('../assets/about/Background-slide6.jpg');
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    padding-top: 5rem;
    padding-bottom: 5rem;
}

.about-section5 {
    height: 100%;
    padding-top: 5%;
    padding-bottom: 5%;
}


/* @media (min-width: 1920px) {
    .about-section5 {
        height: 40vh;
        padding-top: 10vh;
    }
} */

@media (max-width: 767px) {
    .img-back-slider5-about {
        background: url('../assets/about/Background-slide6-Overlay.jpg') !important;
        background-position: center center!important;
        background-attachment: fixed;
        background-repeat: no-repeat;
    }
    .about-section5 {
        padding-top: 50px;
        padding-bottom: 50px;
        height: 100%;
    }
}


/*! Text-aligns */

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

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

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

@media (max-width: 767px) {
    .align-left,
    .align-center,
    .align-right,
    .mbr-section-btn,
    .mbr-section-title {
        text-align: center;
    }
}


/*  Contact Section */


/* PQR   */

.container-pqr {
    max-width: 80%;
    margin: 0 auto;
    padding: 70px 0 20px;
    width: 100%;
}

.acc h3 {
    margin: 0.4rem;
    cursor: pointer;
    position: relative;
    font-size: 1.2rem;
    color: white !important;
    text-decoration: none !important;
    background-color: #cca562;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 2rem;
    font-family: 'Noto Serif JP', serif;
    font-size: 1.2rem;
}

.acc h3:after {
    content: '+';
    position: absolute;
    right: 20px;
    font-size: 40px;
    top: 50%;
    transform: translateY(-50%);
}

.acc.active h3:after {
    content: '-';
    border-left: 1px solid #c8ad73;
}

.content-pqr {
    background-color: #fff;
    display: none;
}

.content-inner {
    padding: 15px;
}

.content-pq * {
    margin-top: 0;
    line-height: 1.5;
}

.acc {
    border-bottom: 1px solid #fff;
}

.answer {
    font-family: 'Noto Serif JP', serif;
    text-align: justify;
    color: #cca562;
}


/* .section-pqr {
    width: 100%;
    height: auto;
    background-color: white;
    display: flex; */


/* align-items: center; */


/* justify-content: center;
} */


/* .container-preguntas {
    width: 100%;
    max-width: 802rem;
    margin: 0 auto;
    padding: 0 1.5rem;
}

.accordion-item {
    background-color: white;
    border-radius: .4rem;
    margin-bottom: 1rem;
    padding: 1rem;
    box-shadow: .5rem 2px .5rem rgba(0, 0, 0, 0.1);
}

.acordion-link {
    font-size: 1.2rem;
    color: white !important;
    text-decoration: none !important;
    background-color: #cca562;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1rem;
    font-family: 'Noto Serif JP', serif;
    text-align: justify;
}

.acordion-link i {
    color: white;
    padding: .5rem;
}

.acordion-link .fa-times {
    display: none;
}

/* .answer {
    max-height: 0;
    overflow: hidden;
    position: relative;
    transition: max-height 650ms;
    font-family: 'Noto Serif JP', serif;
    text-align: justify;
} */


/* .answer::before {
    content: "";
    position: absolute;
    width: .2rem;
    height: 100%;
    background-color: #cca562;
    top: 50%;
    left: 0;
    transform: translateY(50%);
    overflow: visible;
}

.answer p {
    color: #cca562;
    font-size: 1rem;
    padding: 2rem;
} */


/* @media (max-width: 767px) {
    .answer p,
    .acordion-link {
        font-size: 0.9rem;
    }
}

.accordion-item:target .answer {
    max-height: 40rem;
}

.accordion-item:target .acordion-link .fa-plus {
    display: none;
} */


/*  Piramide de 5 pisos jeje*/


/* 
.piramide {
    background-color: #EFEFEF;
    width: 100%;
    height: 100vh;
    padding-top: 10vh;
}

.shape {
    margin: 0 auto;
}

.one {
    width: 0;
    height: 0;
    border-left: 3.8vw solid transparent;
    border-right: 3.8vw solid transparent;
    border-bottom: 7vh solid #9E9E9E;
}

.one:hover {
    border-bottom: 7vh solid #CFCFCF;
}

.two {
    border-bottom: 10vw solid black;
    border-left: 8vw solid transparent;
    border-right: 8vw solid transparent;
    height: 0;
    width: 23.5vw;
}

.two:hover {
    border-bottom: 10vw solid #92DCF4;
}

.three {
    border-bottom: 100px solid #1DB259;
    border-left: 65px solid transparent;
    border-right: 65px solid transparent;
    height: 0;
    width: 250px;
}

.three:hover {
    border-bottom: 100px solid #51D988;
}

.four {
    border-bottom: 100px solid black;
    border-left: 80px solid transparent;
    border-right: 80px solid transparent;
    height: 0;
    width: 380px;
}

.four:hover {
    border-bottom: 100px solid #51D988;
}

.five {
    border-bottom: 100px solid purple;
    border-left: 80px solid transparent;
    border-right: 80px solid transparent;
    height: 0;
    width: 580px;
}

.five:hover {
    border-bottom: 100px solid #51D988;
} */


/* Shop*/

.base-cuadro {
    width: 20vw;
    height: 20vh;
    background-color: rgba(255, 255, 255, 0.5);
    /* filter: blur(8px); */
    border: 1px solid #cca562;
    transition: ease-in-out 0.5s;
}

.base-cuadro p {
    color: #cca562;
    font-size: 1.2rem;
    font-family: 'Noto Serif JP', serif;
    transition: ease-in-out 0.5s;
    padding-top: 20%;
    margin-left: 20%;
    font-weight: bold;
    text-align: right;
    visibility: hidden;
}

.base-cuadro:hover p {
    color: white;
    visibility: visible;
}

.base-cuadro:hover {
    background-color: #cca562;
}

.base-cuadro-masculino {
    width: 20vw;
    height: 20vh;
    background-color: rgba(0, 0, 0, 0.5);
    /* filter: blur(8px); */
    border: 1px solid #cca562;
    transition: ease-in-out 0.5s;
}

.base-cuadro-masculino p {
    color: #cca562;
    font-size: 1.4rem;
    font-family: 'Noto Serif JP', serif;
    transition: ease-in-out 0.5s;
    padding-top: 20%;
    margin-left: 40%;
    font-weight: bold;
    text-align: right;
    visibility: hidden;
}

.base-cuadro-masculino:hover p {
    color: #cca562;
    visibility: visible;
}

.base-cuadro-masculino:hover {
    background-color: black;
}

.back-section4-shop {
    background-image: url('../assets/shop/Background-Slide4-shop.jpg');
    background-attachment: fixed;
    background-position: center;
    background-size: cover;
    height: 100%;
    width: 100%;
}

@media (max-width: 767px) {
    .back-section4-shop {
        background-image: url('../assets/about/Background-TImeline-Movil1.jpg');
        width: 300px;
        max-width: 400px;
        background-size: contain;
        background-repeat: repeat;
    }
}

.hover-title-shop {
    width: 20vw;
    height: 20vh;
    background-color: rgba(255, 255, 255, 0.5);
    /* filter: blur(8px); */
    border: 1px solid #cca562;
    transition: ease-in-out 0.5s;
}

.hover-title-shop p {
    color: white;
    font-size: 1.2rem;
    font-family: 'Noto Serif JP', serif;
    transition: ease-in-out 0.5s;
    font-weight: bold;
    padding-top: 10%;
    text-align: center;
    visibility: hidden;
}

.hover-title-shop:hover p {
    visibility: visible;
}

.hover-title-shop:hover {
    background-color: #cca562;
}

.hover-title-shop:hover img {
    display: none;
}


/* POP-UP LENGUAGE   */

.title-lenguage {
    color: #cca562;
    font-family: 'Noto Serif JP', serif;
    align-content: center;
    justify-content: center;
    text-align: center;
}