@font-face {
    font-family: '29LTRiwaya-Regular';
    src: url('/static/fonts/29LTRiwaya-Regular.woff2') format('woff2'),
         url('/static/fonts/29LTRiwaya-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Kage-DemiBold';
    src: url('/static/fonts/Kage-DemiBold.woff2') format('woff2'),
         url('/static/fonts/Kage-DemiBold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'RaileyRegular';
    src: url('/static/fonts/RaileyRegular.woff2') format('woff2'),
         url('/static/fonts/RaileyRegular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}


#img-2-a{
    position: inherit;
    z-index: -2;
}

.box-nombre{
    position: relative;
    max-width: 420px;
    margin-top: 15vh;
}

#nombre{
    position: absolute;
    display: inline-block;
    left: 50%;
    transform: translateX(-50%);
    bottom: -60px;
    color: var(--color1);
    font-size: 5rem;
    font-family: 'RaileyRegular';

}

#nombre-sombra{
    position: absolute;
    bottom: -65px;
    left: 50%;
    transform: translateX(calc(-50% + 2px));
    font-family: 'RaileyRegular';
    font-size: 5rem;
    color: gray;
    z-index: -1;
}

main{
    /*padding: 5% 5%;*/
    overflow: hidden;
    padding-bottom: 15vh;
    color: var(--color1);
}

span{
    font-size: 1.2rem;
}

:root{
    --color1: #00bf63;
    --color-fondo: #e8fffa;
}

.italic{
    font-style: italic;
}

/*/img/Cumple/juguetes/girl/fondoRosa.webp*/
body{
    background-image: url("/static/img/Cumple/dinos/boy/dinoRex/fondo.png");
    background-repeat: repeat;
    background-color: var(--color-fondo);
    width: 100%;
    overflow-x: hidden;
    margin: 0;
    min-height: 100vh;
    width: 100vw;
    font-family: '29LTRiwaya-Regular', sans-serif;
}

.img-fondo-section{
    position: absolute;
    /*width: 400px;*/
    z-index: -1;
}

main section{
    position: relative;
    overflow-x: visible;
    text-align: center;
    margin: auto;
    height: 100vh ;
    display: flex;
    align-items: center;
    flex-direction: column;
    /*justify-content: center;*/
    width: 100%;
    /*padding-top: 3rem;*/
    max-height: 800px;
}

#img-1{
    left: 50%;
    transform: translateX(-50%);
    bottom: 0;
}

#img-2{
    left: 50%;
    transform: translateX(-50%);
    bottom: 0;
}

#img-3{
    left: 50%;
    transform: translateX(-50%);
    bottom: 0;
}

.s-3{
    padding-top: 40px;
}

.s-2, .s-3{
    justify-content: start;
}

.sevillana-regular {
  font-family: "Sevillana", cursive;
  font-weight: 400;
  font-style: normal;
}

.forum-regular {
  font-family: "Forum", serif;
  font-weight: 400;
  font-style: normal;
}

.title{
    font-size: 2.5rem;
    color: var(--color1);
    margin-top: 15vh;
}

.title-s1{
    color: var(--color1);
    font-size: 7rem;
    margin: 0;
    font-family: 'Kage-DemiBold';
    height: 80px;
    position: relative;
    top: -2rem;
}

.anios{
    font-size: 2rem;
    margin: 0;
    color: var(--color1);
}

.text-s1{
    font-size: 1.4rem;
    color: var(--color1);
    width: 50%;
    max-width: 200px;
}

.title-s2{
    /*margin-top: 100px;*/
    font-size: initial;
}

.box-text{
    color: var(--color1);
    display: grid;
    align-items: center;
    grid-auto-columns: 1fr 1fr 1fr;
}

.day{
    grid-column: 1;
}

.number{
    font-family: 'Kage-DemiBold';
    grid-column: 2;
    font-size: 5rem;
    margin: 0;
}

.month{
    grid-column: 3;
}

#horario{
    color: var(--color1);
    margin-top: 0;
}

.title-s3{
    /*margin-top: 0;*/
    font-family: 'Kage-DemiBold';
    font-size: 4rem;
    margin-bottom: 0;
}

.direccion{
    font-weight: initial;
}

.mapa{
    width: 100px;
}

.mapa img{
    margin: 1px;
    width: 100%;
    height: 100%;
}

/*@media (min-width: 1024px) {
    .img-fondo-section{
    position: absolute;
    height: 100%;
    width: 600px;
    z-index: -1;
}
}*/