#invitation{
    background: #9B9D8F;
    height: 100%;
    margin:0px;
    padding:0px;
    overflow-x:hidden;
    animation: 0.6s ease-in 0s 1 fadeInY;
}

/* The Modal RSVP (background) */
.modalRSVP {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 99; /* Sit on top */
  padding-top: 25vh; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content */
.modal-contentRSVP {
  background-color: rgba(255,255,255,0.8);
  margin: auto;
  padding: 20px;
  border: none;
  border-radius: 1rem;
  width: 80%;
}

/* The Close Button */
.closeRSVP {
  color: #aaaaaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.closeRSVP:hover,
.closeRSVP:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}

.attend-form{
    text-align: left;
    justify-content:flex-start;
    align-items: flex-start;
    /*margin:5vh 5vw;*/
    /*height: 60%;*/
    width: 100%;
    padding:1rem;
    font-family:'Cormorant';
    color: #25282F;
}

.attend-form input[type=text], input[type=number]{
    width: 100%;
    margin-bottom:20px;
    border-radius: 0.5rem;
    padding: 0.5rem 0.5rem;
    border:none;
}

.attend-form .form-group p{
    float:left;
    margin:0 auto;
    margin-right:10px;
}

.attend-form .form-group input[type=number]{
    width:30%;
    margin:0 auto;
}

.modal-button-containerRSVP{
    margin-top:20px;
    display: flex;
    flex-direction: column;
    text-align: center;
    justify-content:center;
    align-items: center;
    width: 100%;
    padding:0.8rem;
}

.modal-button-containerRSVP button{
    width: 100%;
    background:#25282F;
    font-size: 1rem;
    padding: 0.5rem 1rem;
    border-radius: 1rem;
    border:none;
    text-align:center;
    font-family:"Cormorant SC" !important;
    color:white;
    
}

/* The Modal (background) */
.modalQR {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 99; /* Sit on top */
  padding-top: 25vh; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */

}

/* Modal Content */
.modal-contentQR {
  background-color: rgba(255,255,255,0.8);
  margin: auto;
  padding: 20px;
  /*border: 1px solid #888;*/
  border-radius:1rem;
  width: 80%;
  color: #4A4E58;
}

.modal-titleQR{
    text-align:center;
    margin-bottom:10px;
    margin-top:36px;
    font-size:1.3rem;
      font-family: 'Cormorant SC' !important;
}

.modal-isiQR{
   display: flex;
    flex-direction: column;
    text-align: center;
    justify-content:center;
    align-items: center;
    font-family: 'Bell MT' !important;
    color: #4A4E58;
    font-size:1.2rem;
}

.modal-imageQR{
    width:18.75rem;
    height:18.75rem;
}

/* The Close Button */
.closeQR {
  color: #aaaaaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.closeQR:hover,
.closeQR:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}

.first{
    display: flex;
    flex-direction: column;
    text-align: center;
    justify-content:center;
    align-items: center;
    align-content: space-between;
    background:white;
    background-size: cover;
	background-repeat: no-repeat;
	background-position: bottom center;
}

.first-content{
    height:200vh;
    width:100vw;
    top:0px;
    background-position: top center;
    background-size: cover;
	background-repeat: no-repeat;
    position: relative;
    bottom: 0px;
}

.first-text{
    margin-top:152vh;
    margin-bottom:1vh;
    text-align:center;
    color: #B08177;
}

.first-wedinfo{
    margin:0 auto;
    text-align:center;
    font-family: "Cormorant SC" !important;
    font-style: normal;
    font-size:1.25rem;
}

.first-name{
    /*  position: absolute;*/
    margin:0 auto;
    text-align:center;
    font-family: "Cormorant SC" !important;
    font-style: normal;
    font-size:2.125rem;
    letter-spacing: 0.2rem;
}

.first-date{
    margin:0 auto;
    text-align:center;
    font-family: "Cormorant SC" !important;
    font-style: normal;
    font-size: 2rem;
    color: #C2A894;
}

.first-hastag{
    text-align:center;
    font-family:"Cormorant" !important;
    color: #B08177;
    font-size:1.625rem;
    margin:auto;
}

.first-quote{
    text-align:center;
    font-family:"Cormorant" !important;
    color: #605852;
    font-size:1.25rem;
    padding: 0rem 1rem;
}

.first2-quote{
    text-align:center;
    font-family:"Cormorant SC" !important;
    color: #605852;
    font-size:1.25rem;
    padding: 0rem 1rem;
}

.first2{
    height:170vh;
    display: flex;
    flex-direction: column;
    text-align: center;
    justify-content:center;
    align-items: center;
    align-content: space-between;
    background: #FCF5E5;
    background-size: cover;
	background-repeat: no-repeat;
	background-position: bottom center;
}

.first-photo{
    z-index:7;
    height:100vh;
    width:100vw;
    padding-bottom: 30vh;
    position: relative;
    /*background:#D9C2B0;*/
    /*background:url('../image/bg-first-hp.JPG');*/
    background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}

.first2-content{
    height:45vh;
    padding-top:2vh;
    width:100vw;
    /*z-index:9;*/
    /*background: #FCF5E5;*/
    position: relative;
}

.first-dateinfo{
    margin-top:2vh;
    text-align:center;
    font-size:2.5rem;
    font-family:"Great Vibes" !important;
    color:#855983;
}

.countdown{
    justify-content:center;
    align-items: center;
    text-align:center;
    display: flex;
    flex-direction: row;
    align-content: space-between;
}

.countdown-item-1, .countdown-item-2, .countdown-item-3, .countdown-item-4{
  width: 6.25rem;
  height: 6.25rem;
  /*background: #DBD9CF;*/
  /*border-radius: 50%;*/
  font-size:1.5rem;
  margin:1rem;
  color: white;
  font-family: "Cormorant" !important;
    letter-spacing: 0.2rem;
}

.countdown-item-1 p, .countdown-item-2 p, .countdown-item-3 p, .countdown-item-4 p{
  font-size:2rem;
  margin-top:-0.32rem;
  font-family: "Cormorant SC", normal !important;
  color: #855983;
}

.ourStory{
    /*height:140vh;*/
    /*background:url('../image/second-profile.jpg');*/
    background-size: cover;
	background-repeat: no-repeat;
	background-position: top;
}

.second{
    height:175vh;
    /*height:45rem;*/
    /*display: flex;*/
    /*flex-direction: row;*/
    /*background:url('../image/second-detail.jpg');*/
    background-size: cover;
	background-repeat: no-repeat;
	background-position: top;
}

.third{
    height:150vh;
    /*margin:2.5vh;*/
    display: flex;
    flex-direction: column;
    text-align: center;
    justify-content:center;
    align-items: center;
    align-content: space-between;
    flex-direction: column;
    background: #FCF5E5;
    background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}

.third-top{
    height:180vh;
    width:100vw;
    background: #FCF5E5;
    background:url('../image/third-gallery.jpg');
    background-size: cover;
	background-repeat: no-repeat;
	background-position: top;
}

.third-bottom{
    /*height:100vh;*/
    height:120vw;
    width:100vw;
    /*background:url('../image/second-bg.png');*/
    background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}

.fourth{
    height:200vh;
    /*margin:2.5vh;*/
    display: flex;
    flex-direction: column;
    font-size: 1.875rem;
    text-align: center;
    justify-content:center;
    align-items: center;
    background:white;
    /*background:url('../image/details acara.png');*/
    background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}

.fourth a{
    text-decoration:none;
}

.fourth-details2{
    height:200vh;
    width:95vw;
    margin-left:2.5vw;
    margin-right:2.5vw;
    background:white;
    /*margin:2.5vh;*/
    /*background:url('../image/details acara - 2.png');*/
    /*background:url('../image/detail event.gif');*/
    background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}

.fourth-details{
    /*margin:0 auto;*/
    display:inline-block;
   position:relative;
   text-align:left;
   font-family:"Alta Regular" !important;
    /*font-family: 'Alta_R';*/
    color:#4F6279;
    letter-spacing: 0.2rem;
}

.fourth-content1{
    margin:0 10vw;
    font-size:0.8rem;
    text-align:center;
    font-family: 'Alta_R';
    color:black;
    letter-spacing: 0.2rem;
}

.fourth-content2{
    /*margin:0 auto;*/
    font-size:1.25rem;
    color:#4F6279;
    text-align:center;
    font-family: 'Alta_R';
    letter-spacing: 0.2rem;
}

.fourth-content3{
    margin:0 auto;
    text-align:center;
    font-family: 'Alta_R';
    color:black;
    font-size:1rem;
    letter-spacing: 0.2rem;
}

.fourth-content4{
    margin:0 auto;
    text-align:center;
    font-family: 'Alta_R';
    color:black;
    font-size:1rem;
    letter-spacing: 0.2rem;
}

.fourth-content5{
    margin:0 auto;
    color:#4F6279;
    font-size:1rem;
    text-align:center;
    font-family: 'Alta_R';
    letter-spacing: 0.2rem;
}

.fourth-content6{
    /*margin:0 auto;*/
    margin-top:5vh;
    text-align:center;
    font-family: 'Alta_R';
    font-size:1.25rem;
    color:#4F6279;
    letter-spacing: 0.2rem;
}

.fourth-content7{
    margin:0 auto;
    text-align:center;
    font-family: 'Alta_R';
    color:black;
    font-size:1rem;
    letter-spacing: 0.2rem;
}

.fourth-content8{
    margin:0 auto;
    text-align:center;
    font-family: 'Alta_R';
    color:black;
    font-size:1rem;
    letter-spacing: 0.2rem;
}

.fourth-content9{
    margin:0 auto;
    text-align:center;
    font-family: 'Alta_R';
    color:#4F6279;
    font-size:1rem;
    letter-spacing: 0.2rem;
}

.fourth-button{
    margin-top:-10vh;
    background:#A6A998;
    font-size:1.25rem;
    padding: 1.25rem 2rem 0 2rem;
    border-top-left-radius: 4.375rem;
    border-top-right-radius: 4.375rem;
    line-height: 3.5rem;
    text-align:center;
    /*font-family: 'Alta_R';*/
    font-family:"Alta Regular" !important;
    color:white;
    letter-spacing: 0.2rem;
}

.fifth{
    height:250vh;
    display: flex;
    flex-direction: column;
    justify-content:center;
    align-items: center;
    /*background:url('../image/fifth-bg.png');*/
    background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}

.fifth-photo{
    height:200vh;
    width:100vw;
    background: #FCF5E5;
}

.fifth-photo1{
    height:100vh;
    width:100vw;
    /*background:#25282F;*/
    /*background:url('../image/fifth-photo-1.png');*/
    /*background:url('../image/bg-fifth-1-hp.webp');*/
    background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}
.fifth-photo2{
    height:100vh;
    width:50vw;
    /*background:#25282F;*/
    /*background:url('../image/bg-fifth-2-hp.jpg');*/
    /*background:url('../image/bg-fifth-2-hp.webp');*/
    background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
    display: table-cell;
}
.fifth-photo3{
    height:100vh;
    width:50vw;
    /*background:white;*/
    /*background:url('../image/bg-fifth-3-hp.jpg');*/
    /*background:url('../image/bg-fifth-3-hp.webp');*/
    background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
    display: table-cell;
}
.fifth-content{
    height:50vh;
    width:100vw;
    background:url('../image/bg-fifth-content.jpg');
    background-size: cover;
    /*background-size: contain;*/
	background-repeat: no-repeat;
	background-position: top;
    /*display: flex;*/
    /*flex-direction: column;*/
    /*justify-content:center;*/
    /*align-items: center;*/
}

.fifth-content1{
    text-align:center;
    /*margin-top:10vh;*/
    margin-bottom:0px;
    font-family: 'Cormorant SC';
    font-size:3.5rem;
    color:#B08177;
}

.fifth-content2{
    text-align:center;
    font-family: 'Cormorant' bold;
    font-size:1.5rem;
    color:#B08177;
    /*margin-bottom:8vh;*/
}

.fifth-button{
    margin:0 auto;
    text-align:center;
    color:#392B20;
}

.fifth-button1, .fifth-button2{
    background:#EEE8AD;
    margin-left:2vw;
    margin-right:2vw;
    text-decoration: none;
    padding: 0.7rem 1rem;
    border-radius:1rem;
    cursor:pointer;
    border: 0px;
    font-family:"Cormorant SC" !important;
    width: 20vw;
    color:#392B20;
    font-size:1.75rem;
}

.sixth{
    height:130vh;
    display: flex;
    flex-direction: column;
    /*justify-content:center;*/
    align-items: center;
    /*background:url('../image/sixth-wish.jpg');*/
    background-size: cover;
	background-repeat: no-repeat;
	background-position: top center;
}

.sixth-top{
    height:100vh;
    width:100vw;
    display: flex;
    flex-direction: column;
    align-content: center;
    justify-content: center;
    align-items: center;
}

.sixth-top-form{
    margin:8vh 8vw;
    padding: 1.2em 1.2em;
    border-radius: 1em;
    /*background: #DFD998;*/
    /*text-align:center;*/
}


.sixth-top-title{
    margin-top:1vh;
    text-align:center;
    /*font-family:"Cormorant SC", bold !important;*/
    font-size:1.375rem;
    color:#855983;
}


.sixth-top-button-container{
    display: flex;
    flex-direction: column;
    justify-content:center;
    align-items: center;
    width:100%;
}

.sixth-top-button{
    /*margin-top:15vh;*/
    background:#855983;
    font-size: 1.25rem;
    border-radius: 1rem;
    border:none;
    text-align:center;
    color:white;
    text-decoration:none;
    padding:0.625rem;
    border-radius:0.5rem;
    cursor:pointer;
}

.sixth-comment{
    margin:0.5vh 5vw 5vh;
    width:85vw;
    height:70vh;
    overflow-y: scroll;
}

.sixth-comment-content{
    margin:5vw 5vw;
    padding:5vw;
    background:#F3F2F0;
    opacity:75%;
    border:none;
    border-radius: 1rem;
    font-family:"Cormorant" !important;
    color: #472346;
}

.sixth-comment-content h4{
    margin-bottom: 2px;
    font-size:1.25rem;
}

.sixth-comment-content p{
    margin-top: 2px;
    margin-bottom: 1px;
    font-size:1.25rem;
}

.sixth-bottom{
    height:40vh;
    width:100vw;
    padding: 0vh 10vw;
    display: flex;
    flex-direction: column;
    justify-content:center;
    align-items: center;
    background:#BE8D82;
}

.sixth-bottom-title{
    /*font-family: 'Alta_R';*/
    font-family:"Cormorant SC" !important;
    width: 90%;
    text-align: center;
    color:#F3F2F0;
    font-size:1.75rem;
}

.sixth-bottom-content{
    font-family: 'Cormorant';
    color:#F3F2F0;
    width: 90%;
    text-align: center;
    font-size:1rem;
}

.sixth-bottom-button{
    /*letter-spacing: 0.1875rem;*/
    text-decoration:none;
    /*color:#855983;*/
    margin:1.8rem;
    padding:0.625rem;
    font-size:1.25rem;
    font-family:"Cormorant SC" !important;
    border-radius:1rem;
    cursor:pointer;
    border: 0px;
    width:20vw;
}


.seventh{
    /*height:200vh;*/
    /*background:url('../image/seventh-bg.png');*/
    background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
    
}

.seventh-content{
    height:50vh;
    background:url('../image/seventh-closing.jpg');
    background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
    
}

.seventh-top{
    height:100vh;
    background:white;
    /*background:url('../image/bg-seventh-hp.JPG');*/
    background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}

.seventh-photo1{
    height:100vh;
    width:33vw;
    background:white;
    /*background:url('../image/bg-seventh-hp.JPG');*/
    background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	display: table-cell;
}

.seventh-photo2{
    height:100vh;
    width:34vw;
    background:white;
    /*background:url('../image/bg-seventh-hp.JPG');*/
    background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	display: table-cell;
}

.seventh-photo3{
    height:100vh;
    width:33vw;
    background:white;
    /*background:url('../image/bg-seventh-hp.JPG');*/
    background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	display: table-cell;
}

.seventh-text-1{
    margin-top:0;
    padding-top:5vh;
    text-align:center;
    color:#616747;
    font-family:'Southland Regular';
    font-size:5rem;
}

.seventh-content iframe{
    width:70vw;
    height:60vh;
    background:white;
}

.footer{
    height:20vh;
    width:100vw;
    display: flex;
    flex-direction: column;
    justify-content:center;
    align-items: center;
    background:#CBC3BA;
}

.footer-image{
    height:3.063rem;
    width:6.125rem;
    margin:0 auto;
}

.footer-text{
    margin:0 auto;
    color:white;
    text-align:center;
    font-size:1rem;
    letter-spacing: 0.2rem;
}

@media only screen and (max-width: 1000px)  {
.first{
    height:100vh;
    /*margin:2.5vh;*/
    display: flex;
    flex-direction: column;
    /*font-size: 1.875rem;*/
    text-align: center;
    justify-content:center;
    align-items: center;
    align-content: space-between;
    /*background:url('../image/first-bg.png');*/
    /*background:grey;*/
    background-size: cover;
	background-repeat: no-repeat;
	background-position: bottom center;
}

.first-photo{
    z-index:7;
    height:50vh;
    width:100vw;
    margin:0 auto;
    position: relative;
    /*background:#D9C2B0;*/
    /*background:url('../image/bg-first-hp.JPG');*/
    background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}


.first-content{
    height:50vh;
    width:100vw;
    /*z-index:9;*/
    top:0px;
    /*background:url('image/opening.jpg');*/
    background-position: top center;
    background-size: cover;
	background-repeat: no-repeat;
    /*background: rgba(0, 0, 0, 0.2);*/
    position: relative;
    bottom: 0px;
}

.first-text{
    margin:5vh auto;
    text-align:center;
    font-size:1rem;
}

.first-date{
    /*  position: absolute;*/
    margin:0 auto;
    text-align:center;
    /*font-family: 'Alta_R';*/
    font-family:"Alta Regular" !important;
    /*color:white;*/
    font-size:1.5rem;
    letter-spacing: 0.2rem;
}

.first2-text{
    margin-top:10vh;
}

.first2-were{
    text-align:center;
    /*font-family: 'Alta_R';*/
    font-family:"Alta Regular" !important;
    color:black;
    letter-spacing: 0.2rem;
    font-size:1rem;
}

.first-hashtag{
    margin:0 auto;
    text-align:center;
    /*color:white;*/
    font-size:1.5rem;
    /*letter-spacing: 0.2rem;*/
    margin-top:2rem;
    /*font-family:"Glacial_I_R" !important;*/
}

.countdown{
    justify-content:center;
    align-items: center;
    text-align:center;
    display: flex;
    flex-direction: row;
    align-content: space-between;
}

.countdown-item-1, .countdown-item-2, .countdown-item-3, .countdown-item-4{
  width: 5rem;
  height: 5rem;
  /*background: #D9C2B0;*/
  /*border-radius: 50%;*/
  /*font-size:1rem;*/
  margin:0.75rem;
  font-style:italic;
    color: white;
    letter-spacing: 0.2rem;
}

.countdown-item-1 p, .countdown-item-2 p, .countdown-item-3 p, .countdown-item-4 p{
  /*margin-top:0.625rem;*/
  font-size:1.5rem;
  margin-top:0rem;
}

.ourStory{
    /*height:200vw;*/
    /*background:url('../image/bg-ourStory-2.png');*/
    /*background:url('../image/bg-ourStory-3.webp');*/
    background-size: contain;
	background-repeat: no-repeat;
	background-position: top;
}

.second{
    /*height:200vw;*/
    /*height:60vh;*/
    /*height:45rem;*/
    display: flex;
    flex-direction: row;
    /*background:url('../image/second-bg.png');*/
    background-size: contain;
	background-repeat: no-repeat;
	background-position: top;
}

.third{
    /*height:150vh;*/
    /*margin:2.5vh;*/
    display: flex;
    flex-direction: column;
    font-size: 1.875rem;
    text-align: center;
    justify-content:center;
    align-items: center;
    /*align-content: space-between;*/
    flex-direction: column;
    /*background:url('../image/third-bg.gif');*/
    background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}

.third-top{
    /*height:100vh;*/
    width:100vw;
    /*background:black;*/
    background: #9B9D8F;
    /*background:url('../image/third-bg.png');*/
    background-size: cover;
	background-repeat: no-repeat;
	background-position: top;
}

.third-bottom{
    /*height:50vh;*/
    width:100vw;
    /*background:url('../image/second-bg.png');*/
    background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}
    
}

@media only screen and (max-width: 600px)  {
.first{
    height:178vh;
    /*margin:2.5vh;*/
    display: flex;
    flex-direction: column;
    /*font-size: 1.875rem;*/
    text-align: center;
    justify-content:center;
    align-items: center;
    align-content: space-between;
    background:url('../image/first-background.jpg');
    background-size: cover;
	background-repeat: no-repeat;
	background-position: bottom center;
}

.first-photo{
    z-index:7;
    height:50vh;
    width:100vw;
    margin:0 auto;
    position: relative;
    /*background:#D9C2B0;*/
    /*background:url('../image/bg-first-hp.JPG');*/
    padding:0;
    background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}

.first-content{
    height:97vh;
    width:100vw;
    /*z-index:9;*/
    /*background: #FCF5E5;*/
    position: relative;
    /*background:url('../image/opening.jpg');*/
    background-position: top center;
    background-size: cover;
	background-repeat: no-repeat;
    /*background: rgba(0, 0, 0, 0.2);*/
    bottom: 0px;
}

.first-text{
    margin-top:65vh;
    margin-bottom:1vh;
    text-align:center;
    color: #B08177;
}

.first-wedinfo{
    margin:0 auto;
    text-align:center;
    font-family: "Cormorant SC" !important;
    font-style: normal;
    font-size:0.9rem;
}

.first-name{
    /*  position: absolute;*/
    margin:0 auto;
    text-align:center;
    font-family: "Cormorant SC" !important;
    font-style: normal;
    font-size:1.75rem;
    letter-spacing: 0.2rem;
}

.first-date{
    /*  position: absolute;*/
    margin:0 auto;
    text-align:center;
    font-family: "Cormorant SC" !important;
    font-style: normal;
    font-size: 1rem;
    color: #C2A894;
}

.first-hastag{
    text-align:center;
    font-family:"Cormorant" !important;
    color: #B08177;
    font-size:1rem;
    margin:auto;
}

.first-quote{
    text-align:center;
    font-family:"Cormorant" !important;
    color: #605852;
    font-size:0.8rem;
    padding: 0rem 1rem;
}

.first2-quote{
    text-align:center;
    font-family:"Cormorant SC" !important;
    color: #605852;
    font-size:0.8rem;
    padding: 0rem 1rem;
}

 .first2{
    height:50vh;
    display: flex;
    flex-direction: column;
    text-align: center;
    justify-content:center;
    align-items: center;
    align-content: space-between;
    background: #FCF5E5;
    background-size: cover;
	background-repeat: no-repeat;
	background-position: bottom center;
}

.first2-content{
    height:90vh;
    padding-top:2vh;
    width:100vw;
    /*z-index:9;*/
    /*background:url('../image/first2-background.jpg');*/
    position: relative;
    background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}

.first-dateinfo{
    margin-top:2vh;
    text-align:center;
    font-size:1.375rem;
    font-family:"Cormorant" !important;
    color:#ffffff;
}

.countdown{
    justify-content:center;
    align-items: center;
    text-align:center;
    display: flex;
    flex-direction: row;
    align-content: space-between;
}

.countdown-item-1, .countdown-item-2, .countdown-item-3, .countdown-item-4{
  width: 4rem;
  height: 4rem;
  font-size:0.9rem;
  margin:0.5rem;
    color: #CBCEC3;
  font-family: "Bell MT", normal !important;
  /*font-weight: 800;*/
}

.countdown-item-1 p, .countdown-item-2 p, .countdown-item-3 p, .countdown-item-4 p{
  /*margin-top:0.313rem;*/
  font-size:1.5rem;
  margin-top:-1rem;
  font-family: "Bell MT", normal !important;
  color: #CBCEC3;
}

.ourStory{
    height:200vh;
    background:url('../image/second-profile.jpg');
    background-size: cover;
	background-repeat: no-repeat;
	background-position: top;
}


.second{
    height:270vh;
    /*height:45rem;*/
    display: flex;
    flex-direction: column;
    text-align: center;
    justify-content:center;
    align-items: center;
    align-content: space-between;
}

.second-story1{
    height:90vh;
    background:url('../image/second-top.jpg');
    background-size: cover;
	background-repeat: no-repeat;
	/*background-position: top;*/
	background-position: bottom center;
}

.second-story2{
    height:180vh;
    background:url('../image/second-bottom.jpg');
    background-size: cover;
	background-repeat: no-repeat;
	background-position: top;
}

.second-detail1{
    height:70vh;
    background:url('../image/second-detail1.png');
    background-size: cover;
	background-repeat: no-repeat;
	background-position: top;
}

.second-detail2{
    height:70vh;
    background:url('../image/second-detail2.png');
    background-size: cover;
	background-repeat: no-repeat;
	background-position: top;
}

.third{
    /*height:210vh;*/
    /*padding-top:82vh;*/
    height:240vh;
    padding-top:92vh;
    display: flex;
    flex-direction: column;
    text-align: center;
    justify-content: space-around;
    align-items: center;
    align-content: space-between;
    background:url('../image/third-bg.jpg');
    background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}

.third-top{
    height:110vh;
    width:100vw;
    background: #FCF5E5;
    background:url('../image/third-gallery.jpg');
    background-size: cover;
	background-repeat: no-repeat;
	background-position: top;
}

.third-bottom{
    /*height:30vh;*/
    width:70vw;
    /*background:url('../image/second-bg.png');*/
    background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}

.fourth{
    height:100vh;
    /*margin:2.5vh;*/
    display: flex;
    flex-direction: column;
    font-size: 1.875rem;
    text-align: center;
    justify-content:center;
    align-items: center;
    background:white;
    background:url('../image/detail-acara.jpg');
    background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}

.fourth-details2{
    height:100vh;
    width:95vw;
    margin-left:2.5vw;
    margin-right:2.5vw;
    /*margin:2.5vh;*/
    /*background:url('../image/details acara - 2.png');*/
    /*background:url('../image/detail event.gif');*/
    background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}

.fourth-details{
    /*margin:0 auto;*/
    display:inline-block;
   position:relative;
   text-align:left;
    font-family: 'Alta_R';
    color:#4F6279;
    letter-spacing: 0.2rem;
}

.fourth-date{
    /*margin:0 auto;*/
    text-align:center;
    font-family: 'Southland';
    color:black;
    font-weight:bold;
    font-size:2rem;
    /*letter-spacing: 0.2rem;*/
}

.fourth-date sup{
    font-family: 'Alta_R';
    color:black;
    font-size:0.75rem;
    letter-spacing: 0.2rem;
}

.fourth-content1{
    margin:0 10vw;
    font-size:0.8rem;
    text-align:center;
    font-family: 'Alta_R';
    color:black;
    letter-spacing: 0.2rem;
}

.fourth-content2{
    /*margin:0 auto;*/
    font-size:1.25rem;
    color:#4F6279;
    text-align:center;
    font-family: 'Alta_R';
    letter-spacing: 0.2rem;
}

.fourth-content3{
    margin:0 auto;
    text-align:center;
    font-family: 'Alta_R';
    color:black;
    font-size:1rem;
    letter-spacing: 0.2rem;
}

.fourth-content4{
    margin:0 auto;
    text-align:center;
    font-family: 'Alta_R';
    color:black;
    font-size:1rem;
    letter-spacing: 0.2rem;
}

.fourth-content5{
    margin:0 auto;
    color:#4F6279;
    font-size:1rem;
    text-align:center;
    font-family: 'Alta_R';
    letter-spacing: 0.2rem;
}

.fourth-content6{
    /*margin:0 auto;*/
    margin-top:5vh;
    text-align:center;
    font-family: 'Alta_R';
    font-size:1.25rem;
    color:#4F6279;
    letter-spacing: 0.2rem;
}

.fourth-content7{
    margin:0 auto;
    text-align:center;
    font-family: 'Alta_R';
    color:black;
    font-size:1rem;
    letter-spacing: 0.2rem;
}

.fourth-content8{
    margin:0 auto;
    text-align:center;
    font-family: 'Alta_R';
    color:black;
    font-size:1rem;
    letter-spacing: 0.2rem;
}

.fourth-content9{
    margin:0 auto;
    text-align:center;
    font-family: 'Alta_R';
    color:#4F6279;
    font-size:1rem;
    letter-spacing: 0.2rem;
}

.fourth-button{
    margin-top:-10vh;
    background:#A6A998;
    font-size:1.25rem;
    padding: 1.25rem 2rem 0 2rem;
    border-top-left-radius: 4.375rem;
    border-top-right-radius: 4.375rem;
    line-height: 3.5rem;
    text-align:center;
    /*font-family: 'Alta_R';*/
    font-family:"Alta Regular" !important;
    color:white;
    letter-spacing: 0.2rem;
}

.fifth{
    height:40vh;
    display: flex;
    flex-direction: column;
    /*justify-content: space-around;*/
    align-items: center;
    /*align-content: space-between;*/
    background: #25282F;
    background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
    
}

.fifth-photo{
    height:60vh;
    width:70vw;
}

.fifth-photo1{
    height:45vh;
    width:70vw;
    /*background:white;*/
    /*background:url('../image/bg-fifth-1-hp.jpg');*/
    background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}
.fifth-photo2{
    height:45vh;
    width:70vw;
    /*background:white;*/
    /*background:url('../image/bg-fifth-2-hp.jpg');*/
    background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
    display: table-cell;
}
.fifth-photo3{
    height:45vh;
    width:70vw;
    /*background:white;*/
    /*background:url('../image/bg-fifth-3-hp.jpg');*/
    background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
    display: table-cell;
}

.fifth-content{
    height:40vh;
    width:100vw;
    background:url('../image/bg-fifth-content.jpg');
    background-size: cover;
    /*background-size: contain;*/
	background-repeat: no-repeat;
	background-position: center;
}

.fifth-content1{
    text-align:center;
    /*margin-top:2vh;*/
    margin-bottom:2vh;
    /*font-family: 'Southland Regular';*/
    font-family: 'Cormorant SC';
    font-size:2.5rem;
    color:#CBCEC3;
}

.fifth-content2{
    text-align:center;
    font-family: 'Cormorant' bold;
    font-size:0.9rem;
    color:#CBCEC3;
    /*margin-bottom:2vh;*/
}

.fifth-button{
    margin:0 auto;
    text-align:center;
    color:#392B20;
}

.fifth-button1, .fifth-button2{
    text-decoration:none;
    background: #F3F2F0;
    color: #3E4047;
    margin:1.8rem;
    padding:0.625rem;
    font-size:1rem;
    font-family:"Cormorant", italic !important;
    border-radius:0.5rem;
    cursor:pointer;
    width: fit-content;
}

.sixth{
    height:178vh;
    display: flex;
    flex-direction: column;
    /*justify-content:center;*/
    align-items: center;
    background-size: cover;
	background-repeat: no-repeat;
	background-position: top center;
}

.sixth-top{
    height:45vh;
    display: flex;
    background:url('../image/sixth-top.png');
    background-size: cover;
	background-repeat: no-repeat;
	background-position: top center;
}

.sixth-top-form{
    margin:8vh 1vh 4vw;
    padding: 0.7em 0.7em;
    /*text-align:center;*/
}

.sixth-top-title{
    margin-top:2vh;
    text-align:center;
    font-family:"Cormorant" bold !important;
    font-size:1.5rem;
    color:#4A4E58;
}

.sixth-top-form textarea {
    padding: 0.4rem 0.8rem;
    width: 100%;
    margin-bottom:1vh;
    background: #F3F2F0;
    border: none;
    border-radius: 0.5rem;
}

.sixth-top-form input {
    padding: 0.4rem 0.8rem;
    width: 100%;
    margin-bottom:1vh;
    background: #F3F2F0;
    border: none;
    border-radius: 0.5rem;
}

.sixth-top-button-container{
    display: flex;
    flex-direction: column;
    justify-content:center;
    align-items: center;
    width:100%;
}

.sixth-top-button{
    text-decoration:none;
    background: none;
    border-color: #4A4E58;
    border: solid 1px;
    color: #4A4E58;
    margin:1.2rem;
    padding:0.625rem;
    font-size:1rem;
    font-family:"Cormorant", italic !important;
    border-radius:0.5rem;
    cursor:pointer;
    width: fit-content;
}

.sixth-comment{
    margin:12vh 5vw 5vh;
    width:85vw;
    height:70vh;
    overflow-y: scroll;
}

.sixth-comment-content{
    margin:5vw 5vw;
    padding: 5vw;
    background:#F3F2F0;
    opacity:75%;
    border:none;
    border-radius: 1rem;
    font-family:"Cormorant" !important;
    color: #472346;
}

.sixth-comment-content h4{
    margin-bottom: 2px;
    font-size:1rem;
}

.sixth-comment-content p{
    margin-top: 2px;
    margin-bottom: 1px;
    font-size:1rem;
}

.sixth-bottom{
    height:45vh;
    display: flex;
    flex-direction: column;
    justify-content:center;
    align-items: center;
    background:url('../image/gift-bg.png');
    background-size: cover;
	background-repeat: no-repeat;
	background-position: top center;
}

.sixth-bottom-title{
    /*font-family: 'Alta_R';*/
    font-family:"Cormorant SC" !important;
    width: 90%;
    text-align: center;
    color:#F3F2F0;
    font-size:1.5rem;
}

.sixth-bottom-content{
    font-family: 'Cormorant';
    color:#F3F2F0;
    width: 90%;
    text-align: center;
    font-size:1rem;
}

.sixth-bottom-button{
    /*letter-spacing: 0.1875rem;*/
    text-decoration:none;
    background: none;
    border-color: #CBCEC3;
    border: solid 1px;
    color: #CBCEC3;
    margin:1.2rem;
    padding:0.625rem;
    font-size:1rem;
    font-family:"Cormorant", italic !important;
    border-radius:0.5rem;
    cursor:pointer;
    width: fit-content;
}

.sixth-wishes{
    height:88vh;
    width:100vw;
    display: flex;
    flex-direction: column;
    align-content: center;
    justify-content: center;
    align-items: center;
    background:url('../image/sixth-wishes.png');
    background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}

.seventh{
    /*height:120vh;*/
    /*background:url('../image/seventh-bg.png');*/
    background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
    
}

.seventh-content{
    height:80vh;
    background:url('../image/seventh-closing.png');
    background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
    
}

.seventh-text-1{
    margin-top:0;
    padding-top:5vh;
    text-align:center;
    color:#616747;
    font-family:'Southland Regular';
    font-size:2.5rem;
}

.seventh-content iframe{
    height:50vh;
    width:70vw;
    
}

.footer{
    height:20vh;
    width:100vw;
    display: flex;
    flex-direction: column;
    justify-content:center;
    align-items: center;
    background:#6B6C60;
}

.footer-image{
    height:3.063rem;
    width:6.125rem;
    margin:0 auto;
}

.footer-text{
    margin:0 auto;
    color:white;
    text-align:center;
    font-size:0.75rem;
    letter-spacing: 0.2rem;
}

/* The container */
.containers {
  display: block;
  position: relative;
  padding-left: 2rem;
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 1.5remx;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default radio button */
.containers input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}

/* Create a custom radio button */
.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: #eee;
  border-radius: 50%;
}

/* On mouse-over, add a grey background color */
.containers:hover input ~ .checkmark {
  background-color: #ccc;
}

/* When the radio button is checked, add a blue background */
.containers input:checked ~ .checkmark {
  background-color: #2196F3;
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the indicator (dot/circle) when checked */
.containers input:checked ~ .checkmark:after {
  display: block;
}

/* Style the indicator (dot/circle) */
.containers .checkmark:after {
 	top: 9px;
	left: 9px;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: white;
}
}