body {
  /*background:#ecc7ad;*/
  background:rgba(255, 255, 250, 1);
  margin:0;
  padding:0;
  color:black;
  font-family: 'Montserrat', sans-serif;
}

video, img {
  max-width:100%;
  width:100%;
  height:auto;
}

#logo {
  position:absolute;
  top:25px;
  left:50%;
  transform:translate(-50%, 0);
  z-index:10;
  transition:all 0.3s ease;
}

#logo:hover {
  transform:translate(-50%, 0) scale(1.2);
  transform-origin:center;
}

#logo:hover a:before, #logo:hover a:after {
  transform:scale(0.8);
}

#logo a {
  position:relative;
}

#logo a:before {
  content : "";
  position:absolute;
  left: -100px;
  top:7px;
  background-color:#fff;
  height:2px;
  width:100px;
  transition: all 0.3s ease;
}

#logo a:after {
  content : "";
  position:absolute;
  left: 70px;
  top:7px;
  background-color:#fff;
  height:2px;
  width:100px;
  transition: all 0.3s ease;
}

#logo img {
  height:75px;
  width:auto;
}

#hero {
  height:120vh;
  width:100%;
  position:relative;
  top:0;
  left:0;

  background-size:cover;
  background-position:center center;
}

#hero .fader {
  background: rgb(255,255,255);
  background: -webkit-linear-gradient(rgba(255, 255, 250, 1) 75%, rgba(255,255,250,1) 99%);
  background: -o-linear-gradient(rgba(255,255,250,0) 75%, rgba(255,255,250,1) 99%);
  background: linear-gradient(rgba(255,255,250,0) 75%, rgba(255,255,250,1) 99%);
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
}

#hero h1 {
  position: absolute;
  top: 50%;
  left: 20%;
  font-weight: bold;
  color: #fff;
  font-size: 80px;
  font-family: 'Dancing Script', cursive;
}

h2 {
  margin-bottom:20px;
  font-family: 'Dancing Script', cursive;
  font-size:60px;
  text-align:center;
  color:#cdb470;
}

h3 {
  margin-bottom:20px;
}

.content {
  margin:50px 0;
}

.mariage_row {
  margin-bottom:50px;
}

.video_container {
  width:100%;
  height:auto;
  border-radius:30px;
  overflow:hidden;
}

.video_container .video_thumbnail {

}

.video_container.active .video_thumbnail {
  display:none;
}

.video_container .video_player {
  display:none;
}

.video_container.active .video_player {
  display:block;
}


.content video {
  border-radius:30px;
}

.content .video_thumbnail {
  border-radius:30px;
}

.video_btns {
  display:flex;
  justify-content:center;
  flex-direction:column;
  align-items:center;
}

.video_ctas {
}

.video_cta {
  display: flex;
  width: auto;
  font-size: 15px;
  color: white;
  background: #e5cc86;
  border-radius: 10px;
  cursor: pointer;
  align-items: center;
  justify-content: center;
  padding: 10px 20px;
  text-transform: uppercase;
  font-weight: 600;
  letter-spacing: 3px;
  transition: all 0.3s ease;
  margin-top:20px;
}

.wedding_video {
  display:none;
}

.video_cta:hover {
  padding:10px 30px;
  background:#cdb470;
}

.video_download {
  display: flex;
  width: auto;
  font-size: 12px;
  color: white;
  background: #cdb470;
  border-radius: 10px;
  border-top-right-radius:0;
  border-top-left-radius:0;
  cursor: pointer;
  align-items: center;
  justify-content: center;
  padding: 10px 20px;
  text-transform: uppercase;
  font-weight: 600;
  letter-spacing: 3px;
  transition: all 0.3s ease;
  text-decoration:none;
}

.video_download:hover {
  padding:10px 30px;
  background:#a78f4e;
  color:white;
}

.photo_posts {
  display:flex;
  flex-direction:row;
  flex-wrap:wrap;
}

.photo_posts .photo_post {
  display:flex;
  flex-direction:column;
  padding:10px;
  margin-bottom:30px;
}

.photo_posts .photo_post .photo_post_thumbnail {
  text-decoration:none;
  overflow:hidden;
  width:auto;
  height:250px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:10px;
}

.photo_posts .photo_post .photo_post_thumbnail img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: all 0.3s ease;
}

.photo_posts .photo_post:hover .photo_post_thumbnail img {
  transform:scale(1.2);
  transform-origin:center center;
}

.photo_posts .photo_post .photo_post_title {
  text-decoration:none;
  font-size:25px;
  font-weight:bold;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  margin-top:10px;
  font-family: 'Dancing Script', cursive;
  color:#cdb470;
}


.download_link {
  display: flex;
  font-size: 15px;
  color: white;
  background: #e5cc86;
  border-radius: 10px;
  cursor: pointer;
  align-items: center;
  justify-content: center;
  padding: 10px 20px;
  text-transform: uppercase;
  font-weight: 600;
  letter-spacing: 3px;
  transition: all 0.3s ease;
  width:fit-content;
  text-decoration:none;
  margin:0 auto;
  margin-top:20px;
}

.download_link:hover {
  padding:10px 30px;
  background:#cdb470;
  color: white;
}

.navigation {
  display:flex;
  flex-direction:row;
  align-items:center;
  justify-content:space-between;
  margin-top:50px;
}

.navigation .previous_post, .navigation .next_post {
  display:flex;
  flex-direction:column;
  margin-bottom:50px;
}

.navigation .previous_post .previous_post_thumbnail, .navigation .next_post .next_post_thumbnail {
  text-decoration:none;
  overflow:hidden;
  width:auto;
  height:250px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:10px;
}

.navigation .previous_post .previous_post_thumbnail img, .navigation .next_post .next_post_thumbnail img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: all 0.3s ease;
}

.navigation .previous_post:hover .previous_post_thumbnail img, .navigation .next_post:hover .next_post_thumbnail img {
  transform:scale(1.2);
  transform-origin:center center;
}

.navigation .previous_post .previous_post_title, .navigation .next_post .next_post_title {
  text-decoration:none;
  font-size:20px;
  font-weight:bold;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  margin-top:10px;
  font-family: 'Dancing Script', cursive;
}

@media (max-width:768px){
  h1 {
    font-size:30px;
  }
}
