*{
   -webkit-user-select: none; /* Safari */
   -ms-user-select: none; /* IE 10 and IE 11 */
   user-select: none; /* Standard syntax */
}

::-webkit-scrollbar {
    width: 5px;
    /* display: none; */
} 
::-webkit-scrollbar-track {
    background: #888;
}
::-webkit-scrollbar-thumb {
    background: #2b2a2a;
    border-radius: 5px;
}
:disabled{
    background-color: #eee;
    color: #999 !important;
    cursor: not-allowed !important;
}
:disabled::placeholder {
    color: #999 !important;
}
.swal-title, .swal-text{font-family: var(--font-1);}
.swal-modal{border-radius: 10px;}
#btnOpen, #btnOpen2{
    background-color: #64594f;
    color: antiquewhite;
    font-size: 20px;
    font-family: 'ZainBold';
    width: 220px;
    height: 50px;
    z-index: 1;
    border-radius: 13px;
    border: none;
    transition: all 0.1s ease-in-out;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
    align-content: center;
}
#btnOpen:hover, #btnOpen2:hover{
    background-color: #7a6b5f;
    color: #ffffff;
    font-size: 23px;
}
#btnOpen:active, #btnOpen2:active{
    font-size: 24px;
}
#letter *{
    transition: all 0.1s ease-in-out;
}
#letter{
    border: 2px solid antiquewhite;
    border-radius: 5px;
    width: 30px;
    height: 17px;
    margin-top: 4px;
    transition: all 0.1s ease-in-out;
}
#btnOpen:hover #letter{
    margin-top: 12px;
}
#letterTriangle{
    width: 0;
    height: 0;
    border-left: 15px solid transparent;
    border-right: 15px solid transparent;
    border-top: 12px solid antiquewhite;
}
#letterTriangleShade{
    width: 0;
    height: 0;
    border-left: 15px solid transparent;
    border-right: 15px solid transparent;
    border-top: 11px solid #64594f;
    position: absolute;
    top: 17px;
}
#btnOpen:hover #letterTriangleShade{
    top: 24px;
}
#btnOpen:hover #letterTriangle{
    border-top: none;
    border-bottom: 12px solid antiquewhite;
    margin-top: -12px;
}
.hide{
    opacity: 0 !important;
    z-index: 0 !important;
}
.invitationBody{
    margin: 0;
    background-size: cover;
    background-attachment: fixed;
    /* backdrop-filter: blur(5px); */
    overflow: hidden;
    overflow-y: scroll;
    scroll-behavior: smooth;
    transition: all 0.5s ease-in-out;
}
/* .invitationItem *{transition: all 0.5s linear;} */
.invitationItem img{pointer-events: none;}
.invitation{
    transition: all 0.5s ease-in-out;
    opacity: 0;
    padding-top: 30px;
    position: relative;
    margin: auto;
    scroll-behavior: smooth;
    overflow-x: hidden;
    /* height: 100vh; */
    /* scroll-snap-type: y proximity; */
}
.invitation.opened{
    opacity: 1;
    padding-top: 0;
}
.invitation>div{
    position: relative;
    scroll-snap-align: start;
    width: 500px;
    margin: auto;
    background-color: var(--background-color-1);
    color: var(--text-color-1);
    font-family: var(--font-1);
    /* overflow: hidden; */
}
.invitation>.full{
    height: 100vh;
}
.invitation>.Cover{
    height: 100dvh;
    transition: all 0.5s ease-in-out;
}
.invitation>.show{
    display: block;
}
.iframeCircleDiv{
    position: fixed;
    opacity: 1;
    bottom: 25px;
    right: 25px;
    width: 200px;
    height: 200px;
    border-radius: 100%;
    box-shadow: 0px 0px 1px 3px #9e8777; 
    overflow: hidden;
    transition: all 0.5s ease-in-out;
    z-index: 11;
}
#iframeCircle{
    margin-top:50%;
    animation: rotateRight 21s linear;
    animation-iteration-count: infinite;
    animation-play-state: paused;
}
#playPauseBtn{
    width: 105%;
    height: 105%;
    background-color: #ffffff00;
    border-radius: 50%;
    cursor: pointer;
}

#welcomeAnimation{
    position: fixed;
    top: 45%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding: 20px 10px;
    color: #d1798d;
    font-size: x-large;
    font-weight: 600;
    font-family: 'DancingScript';
    text-align: center;
    z-index: 999;
    width: 90%;
    -webkit-animation: text-shadow-drop-bl 1.3s both, changeColor1 1.3s both;
    animation: text-shadow-drop-bl 1.3s both, changeColor1 1.3s both;
}
@media screen and (max-width: 500px) {
    .invitation>div{
        width: 100vw;
    }
    .iframeCircleDiv{
        width: 70px;
        height: 70px;
        right: unset;
        left: 5px;
        bottom: 5px;
    }
}

.absolute{
    position: absolute;
}
.arc{
    height: 90%;
    width: 93%;
    background: #ffffff99;
    /* backdrop-filter: blur(4px); */
    position: absolute;
    bottom: 5%;
    right: 50%;
    transform: translateX(50%);
    border-radius: 300px 300px 0px 0px;
    border: solid 3px #cc874d;
}
.calendar{
    background: #fdcbff;
    width: 55%;
    height: 30%;
    padding: 20px;
    padding-top: 0px;
    border-radius: 10px;
    margin: auto;
    display: flex;
    flex-wrap: wrap;
    align-content: stretch;
    justify-content: center;
    flex-direction: row;
    font-family: 'SourGummy';
}
.calendarHead{
    font-weight: bold;
    color: white;
}
.calendarDate{
    font-weight: bold;
    width: 100% !important;
    text-align: left;
    padding-left: 25px;
    padding-top: 20px;
    padding-bottom: 15px;
    font-family: 'SourGummy';
    color: #b32828;
    font-size: larger;
}
.calendar>div{
    width: calc(100% / 7);
    margin: auto;
}
.calendar>div:nth-child(7n+2), .calendar>div:nth-child(7n+8){
    color: red;
}
.calendarWeddingIcon{
    position: absolute;
    width: 20px;
    right: -13px;
    top: 0px;
    animation: heartBeat 3s linear(0 0%, 0 2.27%, 0.02 4.53%, 0.04 6.8%, 0.06 9.07%, 0.1 11.33%, 0.14 13.6%, 0.25 18.15%, 0.39 22.7%, 0.56 27.25%, 0.77 31.8%, 1 36.35%, 0.89 40.9%, 0.85 43.18%, 0.81 45.45%, 0.79 47.72%, 0.77 50%, 0.75 52.27%, 0.75 54.55%, 0.75 56.82%, 0.77 59.1%, 0.79 61.38%, 0.81 63.65%, 0.85 65.93%, 0.89 68.2%, 1 72.7%, 0.97 74.98%, 0.95 77.25%, 0.94 79.53%, 0.94 81.8%, 0.94 84.08%, 0.95 86.35%, 0.97 88.63%, 1 90.9%, 0.99 93.18%, 0.98 95.45%, 0.99 97.73%, 1 100%) 0s infinite;
}
.calendarWeddingIcon:last-child{
    animation-delay: .4s;
    animation-timing-function: 2s;
    top: unset;
    left: -10px;
    bottom: -4px;
}
.calendarWeddingDay{
    position: relative;
    font-size: xx-large;
    font-weight: bold;
    margin: -8px 0px !important;
    color: #b700ff !important;
}
.centerAbsolute{
    position: absolute;
    right: 50%;
    transform: translateX(50%);
    width: 100%;
    text-align: center;
}
.centerAbsolute2{
    position: absolute;
    right: 50%;
    bottom: 50%;
    transform: translate(50%, 50%);
    width: 100%;
    text-align: center;
}
.coments::-webkit-scrollbar-track{
    background-color: var(--text-color-2);
    border-radius: 5px;
}
.coments::-webkit-scrollbar-thumb{
    background-color: var(--background-color-3);
    border-radius: 5px;
}
.coments{
    background-color: var(--background-color-1);
    padding-left: 40px;
    text-align: left;
    font-family: Zain;
    color: var(--text-color-1);
    height: calc(100vh - 250px);
    overflow-y: scroll;
}
.comentsItem{
    font-family: var(--font-1);
    background-color: var(--background-color-2);
    margin-bottom: 25px;
    border-left: 3px solid var(--text-color-2);
    padding-left: 15px;
}
.comentsItemName{
    font-family: ZainBold;
}
.countdown{
    padding: 10px 30px;
    display: flex;
    justify-content: space-evenly;
}
.countdown h1{
    text-align: center;
    margin: 0;
}
.countdownLabel{
    color: var(--background-color-3);
    margin: 0;
}
.opened{
    opacity: 1 !important;
    animation: unset !important;
}
.error{
    border-color: red !important;
    box-shadow: 0px 0px 10px 0px #ff00005e !important;
    opacity: 1 !important;
    animation: inputInvalid 0.2s !important;
}
.guestName{
    background: #ffffff80;
    color: #1e1e1e;
    width: fit-content;
    padding: 0px 30px;
    border-radius: 26px;
    justify-self: center;
}

.galleryTiles{
    --x-size: 3;
    --y-size: 3;
    /* one photos normal size are 3x3 tiles */
    --tile-multiply: 3; /* how many tiles per one photo tile */
    --big-tile-width: 100%;
    --gap: 4px;
    --tile-size: calc((var(--big-tile-width) / var(--x-size) / var(--tile-multiply)) - var(--gap));
    aspect-ratio: var(--y-size) / var(--x-size);
    padding: 0;
    margin: auto;
    padding-bottom: calc((var(--y-size) - var(--x-size)) * var(--tile-multiply) * (var(--tile-size) + var(--gap)));
    list-style-type: none;
    display: grid;
    justify-content: center;
    gap: var(--gap);
    grid-template: repeat(calc(var(--y-size)*var(--tile-multiply)), var(--tile-size)) / repeat(calc(var(--x-size)*var(--tile-multiply)), var(--tile-size));
}
.galleryTiles li {
	padding: 0;
	position: relative;
	max-inline-size: 100%;
	grid-column: var(--x1, auto) / var(--x2, auto);
	grid-row: var(--y1, auto) / var(--y2, auto);
	overflow: hidden;
}
.galleryTiles img {
    height: 100%;
	min-width: 100%;
	object-fit: cover;
    object-position: center;
}
.galleryTiles img.bottom {object-position: bottom;}
.galleryTiles img.top {object-position: top;}
.galleryTiles img.left {object-position: left;}
.galleryTiles img.right {object-position: right;}
.filter-invert{
    filter: invert(1) !important;
}
.filter-purple{
    filter: invert(72%) sepia(37%) saturate(742%) hue-rotate(199deg) brightness(86%) contrast(81%) !important;
}
.fontWeightNormal *{
    font-weight: normal;
}
.formInput{
    width: 95%;
    padding: 20px;
    border-radius: 25px;
    margin-bottom: 20px;
    background-color: #ffffffb5;
    color: var(--background-color-4);
    border: none;
    box-sizing: content-box;
}
.formButton{
    width: 100%;
    padding: 20px;
    border-radius: 25px;
    margin-bottom: 20px;
    background-color: #e2bdb4;
    color: var(--text-color-3);
    border: none;
    cursor: pointer;
}
.frameCircle1{
    /* background-image: url('../img/frames/frame 2.png'); */
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    margin: auto;
    height: 0;
    width: 34%;
    padding: 13%;
    padding-bottom: calc(34% + 13%);
}
.frameCircle1>div{
    width: 100%;
    height: 0;
    padding-bottom: 100%;
    margin-left: -6%;
    background-size: cover;
    background-position: center;
    border-radius: 100%;
}
.markerColor ::marker{
    color: var(--marker-color);
}
.navbar1{
    position: absolute !important;
    bottom: 35px;
    left: 5px;
    width: 70px !important;
    height: 300px;
    background-color: var(--text-color-3) !important;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    flex-direction: column;
    border-radius: 10px;
}
.navbarItem{
    cursor: pointer;
}
.navbarItem>img{
    width: 30px;
}
.retroBorder{
    position: absolute;
    border: 5px solid #bfb46c;
    height: 88%;
    width: 115%;
    transform: rotate(2deg);
    filter: drop-shadow(2px 4px 6px #7b7979);
}
.retroBorder.reverse{
    transform: rotate(-2deg);
    border-color: #7c6f3c;
}
.style1{
    font-size: 30px;
    font-family: MeaCulpa;
    color: #422b16;
    text-shadow: 5px 5px 20px #a7a7a7;
}
.style2{
    font-size: 25px;
    color: #422b16;
    text-shadow: 5px 5px 20px #a7a7a7;
}
.style3{
    font-size: 25px;
    color: #3d0d0d;
}
.table1{
    width: 380px;
    max-width: 95%;
    place-self: center;
    border: 2px solid var(--text-color-2);
    border-radius: 60px;
    padding: 0px 35px;
    border-spacing: 10px;
}
.table1 td{
    padding: 10px;
}

/* BLEACHED-CEDAR */
.cedar.coments::-webkit-scrollbar-track{
    background-color: var(--background-color-5);
    border-radius: 5px;
}
.cedar.coments::-webkit-scrollbar-thumb{
    background-color: var(--background-color-4);
    border-radius: 5px;
}
.cedar.coments{
    width: calc(95% - 50px);
    margin-top: 35px;
    padding-right: 10px;
    height: 60vh;
    background-color: var(--background-color-2);
}
.cedar.comentsItem{
    background-color: var(--background-color-3);
    border-radius: 10px;
    padding: 10px;
    margin-bottom: 15px;
}
        
/* FLORIA */
.floriaGallery{
    padding: 20px 0px;
    padding-top: 10%;
    width: 100%;
    height: 60%;
    display: -webkit-inline-box;
    gap: 20px;
    overflow-x: auto;
    overflow-y: visible;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    /* cursor: grab; */
    transition: all 0.3s ease-in-out;
}
.floriaGallery::-webkit-scrollbar{display: none;}
.floriaGalleryItem{
    width: 95%;
    height: 100%;
    background-position: center;
    background-size: cover;
    background-color: var(--background-color-4);
    scroll-snap-align: center;
    border-radius: 50px;
    box-shadow: 2px 4px 9px 0px #474747;
}

.floriaFilms{
    padding: 20px 0px;
    margin-top: 8%;
    width: 100%;
    height: 23%;
    display: -webkit-inline-box;
    overflow: auto;
    justify-content: center;
    align-items: center;
    scroll-snap-type: x mandatory;
    gap: 15px;
}
.floriaFilms::-webkit-scrollbar{display: none;}
.floriaFilmItem{
    transition: all 0.5s linear;
    width: 118px;
    height: 90%;
    background-color: white;
    background-position: center;
    background-size: cover;
    background-clip: content-box;
    background-repeat: no-repeat;
    scroll-snap-align: center;
    border-radius: 20px;
    box-shadow: 2px 4px 9px 0px #474747;
    margin: auto;
}
.floriaFilmItem.active{
    box-shadow: 4px 6px 11px 0px #474747;
    height: 100%;
}
.floriaFormInput{
    background-color: white;
    border: 3px solid var(--background-color-2);
    box-shadow: 0 4px 4px #00000030;
    font-style: unset;
    font-family: Caudex;
    color: var(--text-color-1);
    width: calc(100% - 40px);
    padding: 15px 20px;
    margin-bottom: 10px;
}
.floriaFormInput::placeholder {
    color: var(--text-color-1);
    opacity: 1;
}
.floriaComments::-webkit-scrollbar-track{
    background-color: var(--background-color-1);
    border-radius: 5px;
}
.floriaComments::-webkit-scrollbar-thumb{
    background-color: #6288c2ff;
    border-radius: 5px;
}
.floriaComments{
    border: 20px solid var(--background-color-4);
    width: calc(88% - 40px);
    margin: auto;
    height: 300px;
    background-color: var(--background-color-4);
    font-family: 'Caudex';
    color: var(--text-color-1);
    padding: 15px 20px;
    border-radius: 30px;
    position: relative;
    z-index: 1;
}
.floriaCommentsItem{
    background-color: white;
    border-radius: 20px;
    padding: 20px;
}
.flori.copyBtn{
    background-color: transparent;
    border: none;
    cursor: pointer;
    padding: 0;
    margin: 0;
    width: 18px;
    height: 18px;
    vertical-align: sub;
}
/* FLORIA END */

/* LAVENDER-BLUSH LB */
.LBgallery{
    position: relative;
    padding: 10%;
    margin: auto;
    margin-top: 5%;
    width: 30%;
    height: 30%;
    overflow: clip;
}
.LBgalleryItem{
    position: absolute;
    left: 6%;
    top: 6%;
    width: 88%;
    height: 88%;
    background-size: cover;
    background-position: center;
    border-radius: 15px;
    box-shadow: 0 5px 10px #00000050;
    z-index: 0;
    opacity: 0;
    transition: all 1.5s ease;
}
.LBgalleryItem.left{
    left: 100%;
}
.LBgalleryItem.right{
    right: 100%;
}
.LBgalleryItem.center{
    opacity: 1;
    z-index: 1;
}
.LBrundown{
    margin: -10px 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
}
.LBrundownItem:nth-child(odd){
    padding-right: 5px;
    padding-left: 25px;
    border-right: 1px solid #81818180;
}
.LBrundownItem:nth-child(even){
    padding-top: 36%;
    padding-left: 5px;
    padding-right: 25px;
    border-left: 1px solid #81818180;
}
.LBrundownItem:nth-child(even) hr{
    margin-left: -5px;
    width: 50%;
    border: 1px dashed #81818180;
}
.LBrundownItem:nth-child(odd) hr{
    margin-right: -5px;
    width: 50%;
    border: 1px dashed #81818180;
}
.lavenderBlush.coments::-webkit-scrollbar-track{
    background-color: var(--text-color-2);
    border-radius: 5px;
}
.lavenderBlush.coments::-webkit-scrollbar-thumb{
    background-color: var(--background-color-2);
    border-radius: 5px;
}
.lavenderBlush.coments{
    width: calc(80% - 40px);
    margin: -12px auto;
    height: 52vh;
    background-color: var(--background-color-1);
    padding: 15px 15px;
    border-radius: 18px;
    border: 10px solid var(--background-color-1);
}
.lavenderBlush.comentsItem{
    font-family: var(--font-1);
    background-color: var(--background-color-2);
    color: var(--text-color-4);
    border-radius: 15px;
    padding: 10px 15px;
}
.lavenderBlush.comentsItemName{
    font-family: initial;
    /* color: var(--text-color-3); */
    font-weight: bold;
}
.lavenderBlush.comentsItemConfirm{
    font-style: italic;
    margin-bottom: 10px;
}
.lavenderBlush.formInput{
    color: var(--text-color-1);
    background-color: white;
    border: 1px solid #023059;
    box-shadow: 0 4px 4px #00000030;
    font-style: unset;
    font-family: var(--font-1);
    width: calc(90% - 40px);
    padding: 15px 20px;
    margin-bottom: 10px;
}
.lavenderBlush.formInput::placeholder{
    color: var(--text-color-1);
    opacity: 1;
}
/* LAVENDER-BLUSH LB - END */

/* IMITA */
.invitation>.imita{
    box-shadow: 2px 0px 20px 2px #00000085;
}
.gallery.imita{
    padding: 10px;
    width: 100%;
    display: -webkit-inline-box;
    gap: 10px;
    overflow-x: auto;
    overflow-y: visible;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    transition: all 0.3s ease-in-out;
}
.gallery.imita::-webkit-scrollbar{display: none;}
.galleryItem.imita{
    width: 90%;
    height: 500px;
    border: 14px solid white;
    border-bottom: 36px solid white;
    background-position: center;
    background-size: cover;
    background-color: var(--background-color-5);
    scroll-snap-align: center;
    box-shadow: 2px 4px 9px 0px #474747;
}
.imitaFilms{
    margin-top: 20px;
    width: 100%;
    background-color: #ffffff;
    display: -webkit-inline-box;
    overflow: auto;
    justify-content: center;
    align-items: center;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    border-top: 7px solid black;
    border-bottom: 7px solid black;
    transition: all 0.3s ease-in-out;
    box-shadow: 2px 4px 9px 0px #474747;
    /* cursor: pointer; */
}
.imitaFilms::-webkit-scrollbar{display: none;}
.filmItem{
    width: 118px;
    height: 170px;
    background-color: white;
    border: 5px solid #000000;
    border-left: none;
    border-right: none;
    border-top-width: 8px;
    border-top-style: dashed;
    border-bottom-width: 8px;
    border-bottom-style: dashed;
    background-position: center;
    background-size: cover;
    background-clip: content-box;
    background-repeat: no-repeat;
    box-shadow: inset 0px 0px 0px 6px black;
    scroll-snap-align: center;
}
.formInput.imita {
    background-color: var(--background-color-2);
    color: var(--text-color-3);
}
.formInput.imita::placeholder {
    color: var(--text-color-3);
    opacity: 1;
}
.imita .coments::-webkit-scrollbar-track{
    background-color: var(--background-color-3);
    border-radius: 5px;
}
.imita .coments::-webkit-scrollbar-thumb{
    background-color: var(--text-color-3);
    border-radius: 5px;
}
/* IMITA END */

/* NAVY */
.navyComments::-webkit-scrollbar-track{
    background-color: var(--text-color-4);
    border-radius: 5px;
}
.navyComments::-webkit-scrollbar-thumb{
    background-color: var(--background-color-2);
    border-radius: 5px;
}
.navyComments{
    width: calc(88% - 40px);
    margin: auto;
    height: 55vh;
    background-color: var(--background-color-4);
    font-family: var(--font-1);
    color: var(--text-color-1);
    padding: 15px 20px;
    border-radius: 18px;
}
.navyCommentsItem{
    font-family: var(--font-1);
    background-color: var(--background-color-2);
    color: var(--text-color-4);
    border-radius: 15px;
    padding: 20px;
}
.navyCommentsItemName{
    font-family: initial;
    color: var(--text-color-2);
    font-weight: bold;
}
.navyCommentsItemConfirm{
    font-style: italic;
    margin-bottom: 10px;
}
.navyFormInput{
    background-color: white;
    border: 1px solid var(--background-color-2);
    box-shadow: 0 4px 4px #00000030;
    font-style: unset;
    font-family: var(--font-1);
    color: var(--text-color-3);
    width: calc(100% - 40px);
    padding: 15px 20px;
    margin-bottom: 10px;
}
.navyFormInput::placeholder{
    color: var(--text-color-3);
    opacity: 1;
}
.navyGallery{
    margin-top: -30px;
    padding: 12% 27px;
    width: 70%;
    height: 40vh;
    display: -webkit-inline-box;
    gap: 60px;
    overflow-x: auto;
    overflow-y: visible;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
}
.navyGallery::-webkit-scrollbar{display: none;}
.navyGalleryItem{
    width: 95%;
    height: 100%;
    background-position: center;
    background-size: cover;
    background-color: var(--background-color-2);
    scroll-snap-align: center;
    border-radius: 15px;
    border: 3px solid #b3d5f2;
    box-shadow: 0px 0px 10px black;
    position: relative;
}
/* NAVY END */

/* UMBRAE */
.umbrae.formInput{
    color: var(--text-color-1);
    background-color: white;
    border: 1px solid var(--text-color-3);
    border-radius: 4px;
    box-shadow: 0 4px 4px #0000005e;
    font-style: unset;
    font-family: var(--font-1);
    width: calc(90% - 40px);
    padding: 15px 20px;
    margin-bottom: 10px;
}
.umbrae.formInput::placeholder{
    color: var(--text-color-1);
    opacity: 1;
}
.umbrae.coments::-webkit-scrollbar-track{
    background-color: var(--background-color-3);
}
.umbrae.coments::-webkit-scrollbar-thumb{
    background-color: var(--background-color-2);
}
.umbrae.coments{
    background-color: unset;
    padding-right: 20px;
    width: 75%;
    margin: auto;
    position: relative;
    z-index: 2;
}
.umbrae.comentsItem{
    border-radius: 10px;
    padding: 20px;
    color: var(--text-color-3);
}
.umbrae .countdownLabel{
    color: var(--background-color-2);
}
/* UMBRAE END */

/* TEMPLATE */
.font15{font-size: 15px;}.font16{font-size: 16px;}.font17{font-size: 17px;}.font18{font-size: 18px;}.font19{font-size: 19px;}.font20{font-size: 20px;}.font21{font-size: 21px;}.font22{font-size: 22px;}.font23{font-size: 23px;}.font24{font-size: 24px;}.font25{font-size: 25px;}.font26{font-size: 26px;}.font27{font-size: 27px;}.font28{font-size: 28px;}.font29{font-size: 29px;}.font30{font-size: 30px;}.font31{font-size: 31px;}.font32{font-size: 32px;}.font33{font-size: 33px;}.font34{font-size: 34px;}.font35{font-size: 35px;}.font36{font-size: 36px;}.font37{font-size: 37px;}.font38{font-size: 38px;}.font39{font-size: 39px;}.font40{font-size: 40px;}.font41{font-size: 41px;}.font42{font-size: 42px;}.font43{font-size: 43px;}.font44{font-size: 44px;}.font45{font-size: 45px;}.font46{font-size: 46px;}.font47{font-size: 47px;}.font48{font-size: 48px;}.font49{font-size: 49px;}.font50{font-size: 50px;}.font51{font-size: 51px;}.font52{font-size: 52px;}.font53{font-size: 53px;}.font54{font-size: 54px;}.font55{font-size: 55px;}.font56{font-size: 56px;}.font57{font-size: 57px;}.font58{font-size: 58px;}.font59{font-size: 59px;}.font60{font-size: 60px;}.font61{font-size: 61px;}.font62{font-size: 62px;}.font63{font-size: 63px;}.font64{font-size: 64px;}.font65{font-size: 65px;}.font66{font-size: 66px;}.font67{font-size: 67px;}.font68{font-size: 68px;}.font69{font-size: 69px;}.font70{font-size: 70px;}.font71{font-size: 71px;}.font72{font-size: 72px;}.font73{font-size: 73px;}.font74{font-size: 74px;}.font75{font-size: 75px;}.font76{font-size: 76px;}.font77{font-size: 77px;}.font78{font-size: 78px;}.font79{font-size: 79px;}.font80{font-size: 80px;}.font81{font-size: 81px;}.font82{font-size: 82px;}.font83{font-size: 83px;}.font84{font-size: 84px;}.font85{font-size: 85px;}.font86{font-size: 86px;}.font87{font-size: 87px;}.font88{font-size: 88px;}.font89{font-size: 89px;}.font90{font-size: 90px;}.font91{font-size: 91px;}.font92{font-size: 92px;}.font93{font-size: 93px;}.font94{font-size: 94px;}.font95{font-size: 95px;}.font96{font-size: 96px;}.font97{font-size: 97px;}.font98{font-size: 98px;}.font99{font-size: 99px;}.font100{font-size: 100px;}
.marginTopBottom0{margin-top: 0px;margin-bottom: 0px;}.marginTopBottom5{margin-top: 5px;margin-bottom: 5px;}.marginTopBottom10{margin-top: 10px;margin-bottom: 10px;}.marginTopBottom15{margin-top: 15px;margin-bottom: 15px;}.marginTopBottom20{margin-top: 20px;margin-bottom: 20px;}.marginTopBottom25{margin-top: 25px;margin-bottom: 25px;}.marginTopBottom30{margin-top: 30px;margin-bottom: 30px;}.marginTopBottom35{margin-top: 35px;margin-bottom: 35px;}.marginTopBottom40{margin-top: 40px;margin-bottom: 40px;}.marginTopBottom45{margin-top: 45px;margin-bottom: 45px;}.marginTopBottom50{margin-top: 50px;margin-bottom: 50px;}.marginTopBottom55{margin-top: 55px;margin-bottom: 55px;}.marginTopBottom60{margin-top: 60px;margin-bottom: 60px;}.marginTopBottom65{margin-top: 65px;margin-bottom: 65px;}.marginTopBottom70{margin-top: 70px;margin-bottom: 70px;}.marginTopBottom75{margin-top: 75px;margin-bottom: 75px;}.marginTopBottom80{margin-top: 80px;margin-bottom: 80px;}.marginTopBottom85{margin-top: 85px;margin-bottom: 85px;}.marginTopBottom90{margin-top: 90px;margin-bottom: 90px;}.marginTopBottom95{margin-top: 95px;margin-bottom: 95px;}.marginTopBottom100{margin-top: 100px;margin-bottom: 100px;}.marginTopBottom105{margin-top: 105px;margin-bottom: 105px;}.marginTopBottom110{margin-top: 110px;margin-bottom: 110px;}.marginTopBottom115{margin-top: 115px;margin-bottom: 115px;}.marginTopBottom120{margin-top: 120px;margin-bottom: 120px;}.marginTopBottom125{margin-top: 125px;margin-bottom: 125px;}.marginTopBottom130{margin-top: 130px;margin-bottom: 130px;}.marginTopBottom135{margin-top: 135px;margin-bottom: 135px;}.marginTopBottom140{margin-top: 140px;margin-bottom: 140px;}.marginTopBottom145{margin-top: 145px;margin-bottom: 145px;}.marginTopBottom150{margin-top: 150px;margin-bottom: 150px;}.marginTopBottom155{margin-top: 155px;margin-bottom: 155px;}.marginTopBottom160{margin-top: 160px;margin-bottom: 160px;}.marginTopBottom165{margin-top: 165px;margin-bottom: 165px;}.marginTopBottom170{margin-top: 170px;margin-bottom: 170px;}.marginTopBottom175{margin-top: 175px;margin-bottom: 175px;}.marginTopBottom180{margin-top: 180px;margin-bottom: 180px;}.marginTopBottom185{margin-top: 185px;margin-bottom: 185px;}.marginTopBottom190{margin-top: 190px;margin-bottom: 190px;}.marginTopBottom195{margin-top: 195px;margin-bottom: 195px;}.marginTopBottom200{margin-top: 200px;margin-bottom: 200px;}
.paddingTopBottom10{padding-top: 10px;padding-bottom: 10px;}.paddingTopBottom15{padding-top: 15px;padding-bottom: 15px;}.paddingTopBottom20{padding-top: 20px;padding-bottom: 20px;}.paddingTopBottom25{padding-top: 25px;padding-bottom: 25px;}.paddingTopBottom30{padding-top: 30px;padding-bottom: 30px;}.paddingTopBottom35{padding-top: 35px;padding-bottom: 35px;}.paddingTopBottom40{padding-top: 40px;padding-bottom: 40px;}.paddingTopBottom45{padding-top: 45px;padding-bottom: 45px;}.paddingTopBottom50{padding-top: 50px;padding-bottom: 50px;}.paddingTopBottom55{padding-top: 55px;padding-bottom: 55px;}.paddingTopBottom60{padding-top: 60px;padding-bottom: 60px;}.paddingTopBottom65{padding-top: 65px;padding-bottom: 65px;}.paddingTopBottom70{padding-top: 70px;padding-bottom: 70px;}.paddingTopBottom75{padding-top: 75px;padding-bottom: 75px;}.paddingTopBottom80{padding-top: 80px;padding-bottom: 80px;}.paddingTopBottom85{padding-top: 85px;padding-bottom: 85px;}.paddingTopBottom90{padding-top: 90px;padding-bottom: 90px;}.paddingTopBottom95{padding-top: 95px;padding-bottom: 95px;}.paddingTopBottom100{padding-top: 100px;padding-bottom: 100px;}.paddingTopBottom105{padding-top: 105px;padding-bottom: 105px;}.paddingTopBottom110{padding-top: 110px;padding-bottom: 110px;}.paddingTopBottom115{padding-top: 115px;padding-bottom: 115px;}.paddingTopBottom120{padding-top: 120px;padding-bottom: 120px;}.paddingTopBottom125{padding-top: 125px;padding-bottom: 125px;}.paddingTopBottom130{padding-top: 130px;padding-bottom: 130px;}.paddingTopBottom135{padding-top: 135px;padding-bottom: 135px;}.paddingTopBottom140{padding-top: 140px;padding-bottom: 140px;}.paddingTopBottom145{padding-top: 145px;padding-bottom: 145px;}.paddingTopBottom150{padding-top: 150px;padding-bottom: 150px;}.paddingTopBottom155{padding-top: 155px;padding-bottom: 155px;}.paddingTopBottom160{padding-top: 160px;padding-bottom: 160px;}.paddingTopBottom165{padding-top: 165px;padding-bottom: 165px;}.paddingTopBottom170{padding-top: 170px;padding-bottom: 170px;}.paddingTopBottom175{padding-top: 175px;padding-bottom: 175px;}.paddingTopBottom180{padding-top: 180px;padding-bottom: 180px;}.paddingTopBottom185{padding-top: 185px;padding-bottom: 185px;}.paddingTopBottom190{padding-top: 190px;padding-bottom: 190px;}.paddingTopBottom195{padding-top: 195px;padding-bottom: 195px;}.paddingTopBottom200{padding-top: 200px;padding-bottom: 200px;}

@media screen and (max-width: 500px) {
    /* .galleryTiles{--scale: 0.7;} */
    #btnOpen, #btnOpen2{
        font-size: 16px;
    }

    .calendarWeddingDay{
        font-size: x-large;
    }
    .navbar1{
        width: 50px !important;
        height: 200px;
        bottom: 20px;
    }
    .navbarItem>img{ width: 20px;}

    .style1{
        font-size: 25px;
    }
    .style2{
        font-size: 20px;
    }
    .style3{
        font-size: 20px;
    }
    .font15{font-size: 10px;}.font16{font-size: 11px;}.font17{font-size: 12px;}.font18{font-size: 13px;}.font19{font-size: 14px;}.font20{font-size: 15px;}.font21{font-size: 16px;}.font22{font-size: 17px;}.font23{font-size: 18px;}.font24{font-size: 19px;}.font25{font-size: 20px;}.font26{font-size: 21px;}.font27{font-size: 22px;}.font28{font-size: 23px;}.font29{font-size: 24px;}.font30{font-size: 25px;}.font31{font-size: 26px;}.font32{font-size: 27px;}.font33{font-size: 28px;}.font34{font-size: 29px;}.font35{font-size: 30px;}.font36{font-size: 31px;}.font37{font-size: 32px;}.font38{font-size: 33px;}.font39{font-size: 34px;}.font40{font-size: 35px;}.font41{font-size: 36px;}.font42{font-size: 37px;}.font43{font-size: 38px;}.font44{font-size: 39px;}.font45{font-size: 40px;}.font46{font-size: 41px;}.font47{font-size: 42px;}.font48{font-size: 43px;}.font49{font-size: 44px;}.font50{font-size: 45px;}.font51{font-size: 46px;}.font52{font-size: 47px;}.font53{font-size: 48px;}.font54{font-size: 49px;}.font55{font-size: 50px;}.font56{font-size: 51px;}.font57{font-size: 52px;}.font58{font-size: 53px;}.font59{font-size: 54px;}.font60{font-size: 55px;}.font61{font-size: 56px;}.font62{font-size: 57px;}.font63{font-size: 58px;}.font64{font-size: 59px;}.font65{font-size: 60px;}.font66{font-size: 61px;}.font67{font-size: 62px;}.font68{font-size: 63px;}.font69{font-size: 64px;}.font70{font-size: 65px;}.font71{font-size: 66px;}.font72{font-size: 67px;}.font73{font-size: 68px;}.font74{font-size: 69px;}.font75{font-size: 70px;}.font76{font-size: 71px;}.font77{font-size: 72px;}.font78{font-size: 73px;}.font79{font-size: 74px;}.font80{font-size: 75px;}.font81{font-size: 76px;}.font82{font-size: 77px;}.font83{font-size: 78px;}.font84{font-size: 79px;}.font85{font-size: 80px;}.font86{font-size: 81px;}.font87{font-size: 82px;}.font88{font-size: 83px;}.font89{font-size: 84px;}.font90{font-size: 85px;}.font91{font-size: 86px;}.font92{font-size: 87px;}.font93{font-size: 88px;}.font94{font-size: 89px;}.font95{font-size: 90px;}.font96{font-size: 91px;}.font97{font-size: 92px;}.font98{font-size: 93px;}.font99{font-size: 94px;}.font100{font-size: 95px;}
}

