@import "_custom.css";
@import "_general.css";

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


:root {
  --c-primary: #C19E6B;
  --c-secondary: #F2F2F2;
  --c-tertiary: #272727;
  --c-quaternary: #FFFFFF;
  /* fuentes */
  --f-primary: "Dancing Script", cursive;
  --f-secondary: "Montserrat", sans-serif;
  /* filter */
  --f-icons: brightness(0) invert(83%) sepia(6%) saturate(2939%) hue-rotate(347deg) brightness(81%) contrast(83%);
  --f-icon2: brightness(0) invert(100%) sepia(88%) saturate(7303%) hue-rotate(242deg) brightness(89%) contrast(83%);
  /* formas */
  --bg-first: url(../../img/templates_v2/cool/textura2.jpg);
  --bg-second: url(../../img/templates_v2/cool/textura1.jpg);
  /* general */
  --c-gray: #272727;
}

body {
  font-family: var(--f-secondary);
  overflow-x: hidden !important;
  touch-action: pan-y;
  color: #212121;
}

.title{
  font-size: 45px!important;
  font-family: var(--f-primary)!important;
}

.text{
  font-size: 16px!important;
}

.btn{
  background-color: var(--c-tertiary);
  color: white;
  text-transform: uppercase;
  transition: all 0.3s;
}

.btn:hover{
  background-color: var(--c-primary);
  color: white;
}

.arrowCta {
  display: block;
  height: 13px;
  width: 13px;
  border: 11px solid transparent;
  transform: rotate(45deg);
  position: relative;
  margin: 3rem auto 0;
}
.arrowCta:after, .arrowCta:before {
  content: "";
  display: block;
  height: inherit;
  width: inherit;
  position: absolute;
  top: 0;
  left: 0;
}
.arrowCta:after {
  border-bottom: 3px solid var(--c-primary);
  border-right: 3px solid var(--c-primary);
  top: 0;
  left: 0;
  opacity: 1;
  animation: bottom-arrow 1.65s infinite;
}
.arrowCta:before {
  top: 0;
  left: 0;
  border-bottom: 3px solid var(--c-primary);
  border-right: 3px solid var(--c-primary);
  animation: top-arrow 1.65s infinite;
}
@keyframes bottom-arrow {
  0% {
    opacity: 1;
    transform: translate(0, 0);
  }
  45% {
    opacity: 0;
    transform: translate(12px, 12px);
  }
  46% {
    opacity: 0;
    transform: translate(-16px, -16px);
  }
  90% {
    opacity: 1;
    transform: translate(-6px, -6px);
  }
  100% {
    opacity: 1;
    transform: translate(-6px, -6px);
  }
}
@keyframes top-arrow {
  0% {
    transform: translate(-6px, -6px);
  }
  35% {
    transform: translate(0, 0);
  }
  90% {
    opacity: 1;
    transform: translate(0, 0);
  }
  100% {
    opacity: 1;
    transform: translate(0, 0);
  }
}
.tns-controls {
  left: 0;
  position: absolute;
  top: 50%;
  width: 100%;
}
.tns-controls [data-controls="prev"], .tns-controls [data-controls="next"] {
  background-color: transparent;
  background-position: center center;
  background-repeat: no-repeat;
  border: 0;
  height: 24px;
  padding: 0;
  position: absolute;
  width: 24px;
  filter: invert(1);
}
.tns-controls [data-controls="prev"] {
  background-image: url('https://emidica.com/img/icos/ico-arrow-prev.svg');
}
.tns-controls [data-controls="next"] {
  background-image: url('https://emidica.com/img/icos/ico-arrow-next.svg');
  right: 0;
}
.accordion-button::after {
  filter: grayscale(100%) brightness(10) invert(100%);
}
.accordion-button:not(.collapsed)::after {
  filter: grayscale(100%) brightness(10);
}
.accordion-flush .accordion-item .accordion-button, .accordion-flush .accordion-item .accordion-button.collapsed {
  box-shadow: none !important;
}

/* welcome */

#welcome .fecha{
  background-color: var(--c-primary);
  color: white;
}

#welcome .edad{
  color: var(--c-primary);
  font-size: 120px;
}

#itinerary{
  background-color: var(--c-secondary);
  padding-top: 5rem;
  padding-bottom: 5rem;
}

#itinerary h4{
  letter-spacing: 0px;
}

#itinerary .container > div .row{
  gap: 1.5rem;
  align-items: inherit;
  justify-content: center;
}

#itinerary .container > div .col-sm-6{
  background-color: white;
  display: flex;
  align-items: center;
  justify-content: center;
}

#itinerary .container .row > div a.btn{
  border-radius: 0px;
}

#itinerary .container .row > div h3{
  letter-spacing: 0px;
  text-transform: inherit;
  color: var(--c-primary);
}

#itinerary p{
  max-width: 600px;
  margin: 0 auto;
}

#itinerary .row div > :nth-child(5){
  font-family: var(--f-primary);
  letter-spacing: 0px;
}

/* Gallery */
#gallery{
  background-color: var(--c-quaternary);
}

/* Instagram */
#instagram-cumple{
  background-color: var(--c-quaternary);
}

#instagram-cumple .title{
  color: var(--c-primary);
}
#instagram-cumple img{
  border-color: var(--c-primary) !important;
}

#instagram-cumple .bg {
  background-color: var(--c-tertiary)!important;
  border-radius: 0px;
}
#instagram-cumple .btn-ig{
  background-color: var(--c-quaternary);
  color: inherit;
  font-weight: 600;
}
#instagram-cumple .btn-ig:hover, #dresscode .btn, #confirmation .btn{
  background-color: var(--c-primary);
  color: white;
}

/* Filtro */
#instagram-filtro{
  background-color: var(--c-quaternary);
}
#instagram-filtro .instructions{
  background-color: var(--c-secondary);
  padding: 110px 40px;
  max-width: 650px;
  text-align: center;
}
#instagram-filtro .title{
  color: var(--c-primary);
}
#instagram-filtro .text{
  font-size: 16px !important;
  max-width: 480px;
}
#instagram-filtro .instructions .btn{
  background-color: var(--c-tertiary) !important;
  color: white;
  border-radius: 0px !important;
  border: 0 !important;
}


/* Video */
#video{
  background-color: var(--c-tertiary);
  color: white;
}
#video .title{
  color: var(--c-primary);
}


/* Selpix */
#selpix{
  background-color: var(--c-secondary);
}
#selpix .icons img{
  display: block!important;
}
#selpix .btn{
}
#selpix .number{
  background-color: var(--c-primary);
  color: #fff;
  height: 100px;
  width: 100px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 15px;
}
#selpix .title{
  font-size: 45px!important;
}
#selpix .status{
  text-transform: uppercase;
}


/* gifts */
#gifts{
  background-color: var(--c-tertiary) !important;
  color: #fff;
}
#gifts .bg-white{
  color: #000;
}
#gifts .pills .rounded-pill{
  border-radius: 0 !important;
  margin-bottom: 0px!important;
}
#gifts .title{
  color: var(--c-primary) !important;
}

#gifts #infoDetails{
  width: fit-content;
  margin: 0 auto;
  margin-top: 20px;
  background-color: white;
  color: #000;
  border: double 8px;
}
.nav-pills .nav-link{
  color: white;
}
.nav-pills .nav-link.active{
  background-color: white;
  color: #000;
}

/* gifts */
#playlist{
  background-color: transparent;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

#playlist::before{
  content: "";
  display: block;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 90%;
   background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='1511.751' height='555.259' viewBox='0 0 1511.751 555.259'%3E%3Cdefs%3E%3CclipPath id='clip-path'%3E%3Crect id='Rectángulo_1357' data-name='Rectángulo 1357' width='49.535' height='77.153' fill='%23c19e6b'/%3E%3C/clipPath%3E%3CclipPath id='clip-path-2'%3E%3Crect id='Rectángulo_1357-2' data-name='Rectángulo 1357' width='33.639' height='52.394' fill='%23c19e6b'/%3E%3C/clipPath%3E%3CclipPath id='clip-path-3'%3E%3Crect id='Rectángulo_1357-3' data-name='Rectángulo 1357' width='36.696' height='57.156' fill='%23c19e6b'/%3E%3C/clipPath%3E%3C/defs%3E%3Cg id='Grupo_3381' data-name='Grupo 3381' transform='translate(-179.709 -4457.891)'%3E%3Cg id='Grupo_3362' data-name='Grupo 3362' transform='translate(1557.77 4471.818)'%3E%3Cpath id='Trazado_7426' data-name='Trazado 7426' d='M0,74.752c1.29-4.673,3.508-8.722,7.674-11.475A16.626,16.626,0,0,1,18,60.307c1.574.091,2.257-.136,1.889-2.062C17.988,48.286,16.25,38.3,14.429,28.321c-.568-3.114-.61-3.12,2.231-4.4Q42.23,12.368,67.807.832c2.919-1.316,2.95-1.294,3.5,1.711q4.749,26.114,9.476,52.232c1.81,10.056-4.921,19.342-15.252,21.142-9.47,1.649-18.806-5.248-20.509-15.153A18.158,18.158,0,0,1,59.942,40.114a15.236,15.236,0,0,1,3.77-.11c1.691.152,1.666-.753,1.449-1.938-.978-5.345-1.923-10.7-2.923-16.039-.867-4.633-.9-4.648-5.166-2.741-9.142,4.089-18.264,8.226-27.423,12.277a2.225,2.225,0,0,0-1.5,2.915c2.532,13.819,5.109,27.633,7.422,41.49a17.81,17.81,0,0,1-12.2,19.565c-.755.245-1.513.481-2.27.721H14.334C6.55,94.267,1.854,89.276,0,81.521Z' transform='translate(0 0)' fill='%23c19e6b'/%3E%3C/g%3E%3Cg id='Grupo_3368' data-name='Grupo 3368' transform='translate(1647.663 4935.866) rotate(30)'%3E%3Cpath id='Trazado_7426-2' data-name='Trazado 7426' d='M0,46.629a11.859,11.859,0,0,1,4.787-7.158,10.371,10.371,0,0,1,6.444-1.853c.982.057,1.408-.085,1.178-1.287C11.221,30.12,10.137,23.888,9,17.666c-.354-1.942-.381-1.946,1.392-2.747q15.95-7.2,31.9-14.4c1.821-.821,1.84-.807,2.181,1.067q2.963,16.29,5.911,32.582a11.344,11.344,0,0,1-9.514,13.188c-5.908,1.029-11.731-3.274-12.793-9.452a11.327,11.327,0,0,1,9.31-12.881,9.5,9.5,0,0,1,2.352-.069c1.055.1,1.04-.47.9-1.209-.61-3.334-1.2-6.673-1.823-10.005-.541-2.89-.563-2.9-3.223-1.71-5.7,2.551-11.393,5.131-17.106,7.658a1.388,1.388,0,0,0-.936,1.818c1.58,8.62,3.187,17.237,4.63,25.881a11.11,11.11,0,0,1-7.608,12.2c-.471.153-.944.3-1.416.45H8.941A11.586,11.586,0,0,1,0,50.852Z' transform='translate(0 0)' fill='%23c19e6b'/%3E%3C/g%3E%3Cg id='Grupo_3363' data-name='Grupo 3363' transform='translate(252.517 4829.717) rotate(34)'%3E%3Cpath id='Trazado_7426-3' data-name='Trazado 7426' d='M0,63.412c1.094-3.964,2.976-7.4,6.51-9.734a14.1,14.1,0,0,1,8.763-2.52c1.335.077,1.915-.115,1.6-1.75-1.616-8.448-3.09-16.922-4.635-25.384-.482-2.641-.517-2.647,1.892-3.735Q35.824,10.491,57.52.706c2.476-1.116,2.5-1.1,2.966,1.451q4.029,22.152,8.038,44.308C70.06,55,64.35,62.873,55.586,64.4c-8.034,1.4-15.953-4.452-17.4-12.854a15.4,15.4,0,0,1,12.66-17.517,12.925,12.925,0,0,1,3.2-.094c1.435.129,1.414-.639,1.229-1.644-.83-4.535-1.631-9.075-2.48-13.606-.736-3.93-.766-3.943-4.382-2.326-7.755,3.469-15.493,6.978-23.263,10.414a1.887,1.887,0,0,0-1.273,2.472c2.148,11.723,4.334,23.441,6.3,35.2a15.108,15.108,0,0,1-10.346,16.6c-.64.208-1.283.408-1.926.612H12.159C5.556,79.966,1.573,75.733,0,69.154Z' transform='translate(0 0)' fill='%23c19e6b'/%3E%3C/g%3E%3Cg id='Grupo_3365' data-name='Grupo 3365' transform='translate(412.945 4649.843)'%3E%3Cg id='Grupo_3364' data-name='Grupo 3364' transform='translate(0 0)' clip-path='url(%23clip-path)'%3E%3Cpath id='Trazado_7427' data-name='Trazado 7427' d='M11.425,0c4.125,2.707,8.118,5.307,12.089,7.938,8.233,5.453,16.429,10.962,24.7,16.353,1.575,1.026,1.689,1.823.608,3.275-1.558,2.092-2.973,4.3-4.344,6.519-.717,1.162-1.356,1.206-2.44.466-3.841-2.622-7.735-5.166-11.613-7.733-.569-.376-1.164-.712-2.124-1.294.843,4.192,1.6,7.973,2.364,11.752,1.283,6.365,2.615,12.719,3.84,19.1A17.41,17.41,0,1,1,.331,63.026c-2.19-10.86,6.808-21.3,17.835-20.584,2.217.144,1.134-1.261,1-1.93-1.387-7.122-2.864-14.226-4.317-21.335q-1.759-8.606-3.509-17.213A2.726,2.726,0,0,1,11.425,0' transform='translate(0)' fill='%23c19e6b'/%3E%3C/g%3E%3C/g%3E%3Cg id='Grupo_3367' data-name='Grupo 3367' transform='matrix(0.883, 0.469, -0.469, 0.883, 204.306, 4457.891)'%3E%3Cg id='Grupo_3364-2' data-name='Grupo 3364' clip-path='url(%23clip-path-2)'%3E%3Cpath id='Trazado_7427-2' data-name='Trazado 7427' d='M7.758,0c2.8,1.839,5.513,3.6,8.21,5.391,5.591,3.7,11.157,7.444,16.775,11.1,1.07.7,1.147,1.238.413,2.224-1.058,1.42-2.019,2.918-2.95,4.427-.487.789-.921.819-1.657.316-2.608-1.781-5.252-3.508-7.886-5.251-.386-.255-.791-.483-1.442-.879.573,2.847,1.088,5.414,1.605,7.981.871,4.322,1.776,8.638,2.608,12.967a11.823,11.823,0,1,1-11.1-9.459c1.505.1.77-.857.682-1.31-.942-4.836-1.945-9.661-2.932-14.488Q8.892,7.179,7.7,1.334A1.851,1.851,0,0,1,7.758,0' transform='translate(0 0)' fill='%23c19e6b'/%3E%3C/g%3E%3C/g%3E%3Cg id='Grupo_3366' data-name='Grupo 3366' transform='translate(1452.428 4753.645) rotate(22)'%3E%3Cg id='Grupo_3364-3' data-name='Grupo 3364' clip-path='url(%23clip-path-3)'%3E%3Cpath id='Trazado_7427-3' data-name='Trazado 7427' d='M8.463,0c3.056,2.006,6.014,3.932,8.956,5.881,6.1,4.04,12.171,8.121,18.3,12.114,1.167.76,1.251,1.35.45,2.426-1.154,1.55-2.2,3.183-3.218,4.829-.531.861-1,.893-1.807.345-2.845-1.943-5.73-3.827-8.6-5.729-.421-.278-.863-.527-1.573-.959.625,3.106,1.187,5.906,1.751,8.706.95,4.715,1.937,9.423,2.845,14.146A12.9,12.9,0,1,1,13.457,31.441c1.642.107.84-.934.744-1.429-1.027-5.276-2.122-10.539-3.2-15.8Q9.7,7.831,8.4,1.455A2.019,2.019,0,0,1,8.463,0' transform='translate(0 0)' fill='%23c19e6b'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A");
}

#playlist .container{
  position: relative;
  z-index: 2;
}

#playlist .container h3{
  text-transform: inherit;
}

@media screen and (max-width: 900px) {
  #playlist{
    background-repeat: repeat;
    background-size: 115%;
  }
}

/* dresscode */
#dresscode{
  background-color: var(--c-tertiary);
}
#dresscode .title{
  color: var(--c-primary);
}
#dresscode .container .text{
  color: white;
}
#dresscode .bg-gold{
  text-transform: uppercase;
  font-weight: 800;
}
#dresscode .btn{
  text-transform: uppercase;
  background-color: #fff !important;
  color: #000 !important;
}
#dresscode .dresscode{
  background-color: var(--c-primary);
}

/* transport */
#transport{
  background-color: var(--c-secondary);
}
#transport .form-control{
  background-color: var(--c-primary);
  color: #fff;
  border: 0 !important;
}
#transport .form-control::placeholder{
  color: #fff;
}
#transport .btn{
  text-transform: uppercase;
}



#recomendations{
  background-color: var(--c-primary) !important;
}
#recomendations .accordion-button::after{
  filter: brightness(0) !important;
}
#recomendations .accordion-flush .accordion-item{
  border-radius: 8px;
}


#confirmation .title{
  color: var(--c-primary) !important;
}
#confirmation .btn-light{
  background-color: var(--c-primary) !important;
  text-transform: uppercase !important;
  color: #fff;
}


#greeting{
  background-color: var(--c-primary);
  color: #fff;
}

#countdown .number{
  font-family: var(--f-primary);
  color: white;
}

#countdown{
  background-image: none !important;
}

#hashtag{
  background-color: var(--c-tertiary);
  color: white;
}
#countdown .countdown-text{
  color: var(--c-primary);
}

#hashtag{
  background-color: var(--c-secondary);
  color: inherit;
}

#hashtag .btn{
  display: none;
}

#hashtag .hashtag-phrase{
  background-color: var(--c-primary);
}

#hashtag a.btn:hover{
  background-color: var(--c-quaternary);
  color: #212121;
}

.form-control{
  background-color: white;
  color: #000;
  font-size: 14px;
  padding-top: 12px;
  padding-bottom: 12px;
  border-radius: 0;
}

.form-control::placeholder{
  color: #000;
}

#phrase{
  position: relative;
  background-color: transparent;
}

#phrase .container{
  position: relative;
}

#confirmation{
  background-color: var(--c-tertiary)!important;
  padding-top: 3rem!important;
  padding-bottom: 3rem;
  color: white;
}

#confirmation .container{
  padding-top: 3rem;
  padding-bottom: 3rem;
}

#confirmation form{
  margin-bottom: 0px!important;
  padding-top: 0px!important;
  padding-bottom: 0px!important;
}
#confirmation .btn{
  background-color: var(--c-quaternary);
    color: #000;
}

.form-check-input:checked{
  background-color: var(--c-primary);
  border-color: var(--c-primary);
}

#schedule{
  background-color: var(--c-primary);
}
#schedule .container h4{
  text-transform: inherit!important;
}
#schedule .text{
  max-width: 600px;
  margin: 0 auto;
}

.icon img{
  width: 70px;
  height: 70px;
  filter: var(--f-icons);
  display: none;
}

#recomendations .icon img, #selpix .icon img{
  filter: brightness(0) invert(99%) sepia(7%) saturate(0%) hue-rotate(261deg) brightness(115%) contrast(100%);
}

#gifts .tns-controls [data-controls="prev"], #gifts .tns-controls [data-controls="next"]{
  filter: invert(0);
}

#hashtag .text{
  color: #000;
}

@media (max-width: 480px){
  #welcome .edad{
    font-size: 60px;
  }
  #itinerary .container > div .row .col-sm-6{
    grid-row-end: 1;
    padding: 40px 10px;
  }
  #itinerary .container > div .row{
    gap: 50px;
  }
  #countdown .number{
    font-size: 35px;
    color: white;
  }
  #phrase p{
    margin-bottom: 0px;
  }
  .title{
    font-size: 38px!important;
  }
  #dresscode .container, #gifts .container{
    padding-top: 1rem;
    padding-bottom: 1rem;
  }
  #welcome::before{
    content: "";
    display: block;
    background-image: url(/img/icons/angles-down-solid.svg);
    width: 60px;
    height: 60px!important;
    background-repeat: no-repeat;
    position: absolute;
    z-index: 2;
    bottom: 1rem;
    left: 0;
    right: 0;
    margin: 0 auto;
    filter: var(--f-icons) drop-shadow(4px 4px 3px rgba(0, 0, 0, 0.5));
  }
}