@-webkit-keyframes puff-in-center{0%{-webkit-transform:scale(2);transform:scale(2);-webkit-filter:blur(2px);filter:blur(2px);opacity:0}100%{-webkit-transform:scale(1);transform:scale(1);-webkit-filter:blur(0);filter:blur(0);opacity:1}}@keyframes puff-in-center{0%{-webkit-transform:scale(2);transform:scale(2);-webkit-filter:blur(2px);filter:blur(2px);opacity:0}100%{-webkit-transform:scale(1);transform:scale(1);-webkit-filter:blur(0);filter:blur(0);opacity:1}}
@-webkit-keyframes fade-in{0%{opacity:0}100%{opacity:1}}@keyframes fade-in{0%{opacity:0}100%{opacity:1}}

@import url('https://fonts.googleapis.com/css2?family=Libre+Franklin:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Libre+Baskerville:ital,wght@0,400;0,700;1,400&display=swap');

@media only screen and (orientation:portrait){
    
    html
    {
        overflow-x: hidden;
    }
    
    
    body:before 
    {
    content: "";
    display: block;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: -10;
    background: url(assets/background-mobile.png) no-repeat center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
        
    }

    body
    {
        margin: 0;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        color: #fff;
    }
    
    h1
    {
        font-family: 'Libre Baskerville', serif;
        font-size: 4vh;
        font-weight: normal;
        font-style: normal;
        font-stretch: normal;
        line-height: 1.25;
        letter-spacing: normal;
        text-align: left;
        color: #9b9b9b;
    }
    
    h2
    {
        font-family: 'Libre Franklin', sans-serif;
        font-size: 2.4vh;
        font-weight: 600;
        font-style: normal;
        font-stretch: normal;
        line-height: 1;
        letter-spacing: normal;
        text-align: center;
        color: #ffffff;
        text-transform: uppercase;
        
    }
     
    p
    {
        font-family: 'Libre Franklin', sans-serif;
        font-size: 2.4vh;
        font-weight: 300;
        font-style: normal;
        font-stretch: normal;
        line-height: 1.39;
        letter-spacing: normal;
        text-align: center;
        color: #ffffff;
    }
    
    p a
    {
        color: #ffffff;
        display: block;
        text-decoration: underline;
    }
    
    nav
    {
        height: 100vh;
        width: 100vw;
        background-image: url(assets/background-mobile.png);
        background-size: 105%;
        padding: 12vh 20vw;
        position: fixed;
        top: 0;
        display: none;
        margin: 0;
        
        z-index: 10;
        animation: slide-in-right;
    }
    
    nav ul li
    {
        
        font-family: 'Libre Franklin', sans-serif;
        font-weight: 700;
        font-style: normal;
        font-stretch: normal;
        line-height: 2.25;
        letter-spacing: normal;
        text-align: right;
        color: #ffffff;
        text-transform: uppercase;
        
        width: 100%;
        display: block;
        margin: 2vh 0;
    }
    
    nav ul li span
    {
        display: block;
        font-family: 'Libre Baskerville', serif;
        font-weight: normal;
        font-style: italic;
        font-stretch: normal;
        line-height: 1.33;
        letter-spacing: normal;
        text-align: right;
        color: #d3d3d3;
        
        text-transform: none;
    }
    
    nav ul li a
    {
        padding: 0;
    }
    
    nav ul .soc-med a
    {
        display: inline;
        font-size: 3.5vh;
        padding: 0;
        margin-left: 10vw;
        color: #e00000;
    }
    
    #menu-open
    {
        color: #fff;
        font-size: 3.5vh;
        position: fixed;
        z-index: 5;
        right: 7vw;
        top: 3vh;
        background-color: rgba(0,0,0,0.5);
        height: 5vh;
        width: 5vh;
        border-radius: 5vh;
        text-align: center;
    }
    
    #menu-close
    {
        color: #fff;
        font-size: 3.5vh;
        position: fixed;
        z-index: 15;
        right: 7vw;
        top: 3vh;
        background-color: rgba(0,0,0,0.5);
        height: 5vh;
        width: 5vh;
        border-radius: 5vh;
        text-align: center;
    }
    
    .active-btn
    {
        font-family: 'Libre Franklin', sans-serif;
        font-size: 2vh;
        font-weight: 700;
        font-style: normal;
        font-stretch: normal;
        line-height: 2.25;
        color: #ffffff;
        text-transform: uppercase;
        margin-right: 1vw;
        cursor: pointer;
    }
    
    .clickable-btn
    {
        font-family: 'Libre Franklin', sans-serif;
        font-size: 2vh;
        font-weight: 700;
        font-style: normal;
        font-stretch: normal;
        line-height: 2.25;
        color: #e00000;
        text-transform: uppercase;
        text-decoration: underline;
        margin-left: 1vw;
        cursor: pointer;
    }
    
    .tip
    {
        padding: 8vh 8vw;
    }
    
    .tip p
    {
        text-align: left;
    }
    
    .cta
    {
        padding: 0 8vw;
    }
    
    .cta-elem
    {
        color: #ffffff;
        text-align: center;
        padding: 7vh 3.5vw !important;
        margin: 1vh 0;
        border: solid 0.1vh #9b9b9b;
        border-radius: 1vh;
    }
    
    .cta-elem .elem-header
    {
        
        height: 6vh;
        text-align: center;
    }
    
    .cta-elem .elem-logo
    {
        height: 100%;
        margin-right: 3vw;
    }
    
    .cta-elem h2
    {
        margin: 0;
        display: inline;
        
    }
    
    .cta-elem p
    {
        
        font-family: 'Libre Baskerville', serif;
        text-align: center;
    }
    
    .cta-elem .dwnld-app
    {
        width: 45%;
    }
    
    .cta-elem a
    {
        text-transform: uppercase;
        text-decoration: underline;
        color: #ffffff;
        margin-top: 3vh;
    }
    
    .cta-elem .contact
    {
        display: block;
    }
    
    #signal .elem-header
    {
        padding: 0 22.5vw;
    }
    
    #whatsapp .elem-header
    {
        padding: 0 19vw;
    }
    
    #telegram .elem-header
    {
        padding: 0 19vw;
    }
    
    #email .elem-header
    {
        padding: 0 23vw;
    }
    
    #email img
    {
        height: 80%;
    }
    
}

/*------------------------Landscape desktop-----------------------------*/



@media only screen and (orientation:landscape) and (min-width : 800px){    
    
    body
    {
        background-image: url(assets/background-desktop.png);
        background-size: 115%;
        background-repeat: no-repeat;
        background-attachment: fixed;
        background-position: center;
        margin: 0;
        padding: 0 0 5vh 0;
        color: #fff;
    }
    
    h1
    {
        font-family: 'Libre Baskerville', serif;
        font-size: 2.5vw;
        font-weight: normal;
        font-style: normal;
        font-stretch: normal;
        line-height: 1.25;
        letter-spacing: normal;
        text-align: left;
        color: #9b9b9b;
    }
    
    h2
    {
        font-family: 'Libre Franklin', sans-serif;
        font-size: 1.65vw;
        font-weight: 600;
        font-style: normal;
        font-stretch: normal;
        line-height: 1;
        letter-spacing: normal;
        text-align: center;
        color: #ffffff;
        text-transform: uppercase;
        
    }
     
    p
    {
        font-family: 'Libre Franklin', sans-serif;
        font-size: 1.5vw;
        font-weight: 300;
        font-style: normal;
        font-stretch: normal;
        line-height: 1.39;
        letter-spacing: normal;
        text-align: left;
        color: #ffffff;
    }
    
    p
    {
        font-family: 'Libre Franklin', sans-serif;
        font-size: 2.4vh;
        font-weight: 300;
        font-style: normal;
        font-stretch: normal;
        line-height: 1.39;
        letter-spacing: normal;
        text-align: center;
        color: #ffffff;
    }
    
    p a
    {
        color: #ffffff;
        display: block;
        text-decoration: underline;
    }
    
    nav
    {
        height: 8vh;
        width: 100vw;
        background: transparent;
        
        padding: 0 10vw 0 12.5vw;
        
        z-index: 5;
    }
    
    nav ul li
    {
        
        font-family: 'Libre Franklin', sans-serif;
        font-weight: 700;
        font-style: normal;
        font-stretch: normal;
        line-height: 2.25;
        letter-spacing: normal;
        text-align: center;
        color: #5f5f5f;
        text-transform: uppercase;
        margin: 3vh 3vw 0 3vw;
    }
    
    nav ul li span
    {
        display: none;
    }
    
    nav ul .soc-med
    {
        margin-right: 0;
        margin-left: 0;
        margin-top: 2.5vh;
    }
    
    nav ul li a
    {
        padding: 0;
    }
    
    nav ul .soc-med a
    {
       display: inline;
        font-size: 1.13vw;
        padding: 0;
        margin-left: 3vw;
        color: #e00000;
        text-align: left;
    }
    
    .active-btn
    {
        font-family: 'Libre Franklin', sans-serif;
        font-size: 1.32vw;
        font-weight: 700;
        font-style: normal;
        font-stretch: normal;
        line-height: 2.25;
        color: #ffffff;
        text-transform: uppercase;
        margin-right: 1vw;
        cursor: pointer;
    }
    
    .clickable-btn
    {
        font-family: 'Libre Franklin', sans-serif;
        font-size: 1.32vw;
        font-weight: 700;
        font-style: normal;
        font-stretch: normal;
        line-height: 2.25;
        color: #e00000;
        text-transform: uppercase;
        text-decoration: underline;
        margin-left: 1vw;
        cursor: pointer;
    }
    
    .tip
    {
        padding: 8vh 25vw;
    }
    
    .tip p
    {
        text-align: left;
    }
    
    .cta
    {
        padding: 0 20vw 3vh 20vw;
    }
    
    .cta-elem
    {
        width: 47.97% !important;
        color: #ffffff;
        text-align: center;
        padding: 7vh 2vw !important;
        margin: 1vh !important;
        border: solid 0.1vh #9b9b9b;
        border-radius: 1vh;
    }
    
    .cta-elem .elem-header
    {
        
        height: 4vh;
        text-align: center;
    }
    
    .cta-elem .elem-logo
    {
        height: 100%;
        margin-right: 1.3vw;
    }
    
    .cta-elem h2
    {
        margin: 0;
        display: inline;
        
    }
    
    .cta-elem p
    {
        
        font-family: 'Libre Baskerville', serif;
        font-size: 1.2vw;;
        text-align: center;
    }
    
    .cta-elem p span
    {
        
        color: #000;
    }
    
    .cta-elem .dwnld-app
    {
        width: 45%;
    }
    
    .cta-elem a
    {
        text-transform: uppercase;
        text-decoration: underline;
        color: #ffffff;
        margin-top: 3vh;
    }
    
    .cta-elem .contact
    {
        display: block;
    }
    
    #signal .elem-header
    {
        padding: 0 29%;
    }
    
    #whatsapp .elem-header
    {
        padding: 0 23%;
    }
    
    #whatsapp .elem-header img
    {
        height: 75%;
    }
    
    #telegram .elem-header
    {
        padding: 0 23%;
    }
    
    #email .elem-header
    {
        padding: 0 31%;
    }
    
    #email .elem-header img
    {
        height: 60%;
    }
    
}


/*------------------------Landscape mobile-----------------------------*/



@media only screen and (orientation:landscape) and (max-width : 800px){    


}