/* -- 0 RESET -- */

html, body, div, span, object, iframe, h1, h2, h3, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, fieldset, form, label, legend,  caption, tbody, tfoot, thead, article, aside, canvas, details, figcaption, ul, li, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {margin: 0; padding: 0; border: 0; font-size: 100%; font-family:'Open Sans', Arial, sans-serif;box-sizing:border-box;}
html,body {height:100%;}

/* -- 1 CLEAR -- */

.clear { clear:both;}


/* -- 2 BODY STYLES -- */

body{  margin:0; padding:0; font: 100% normal; color: #333; background:#f4f4f4; font-family: 'Open Sans', sans-serif;}
a, a:active {color: #85c008;}
a:hover {color: #85c008;}
a:visited {color: #85c008;}

p {margin:0 0 1.1em 0; line-height: 1.66em;}

table.border { set animation-webkit-transition: all 0.4s ease;-webkit-transition: all 0.4s ease;transition: all 0.4s ease;
box-shadow: inset 1px 1px 0px 0px #eeeeee;}

table.inner {width:90%;}

img.image {width:330px;}

h1 {font-family: 'Open Sans', sans-serif; font-size:5.58em; line-height: 0.96em; font-weight:700; margin:0 0 20px 0;  letter-spacing:-0px; color:#333; }
h2 {font-family: 'Dancing Script', sans-serif; font-size:2.98em; line-height: 0.96em; font-weight:700; margin:0 0 20px 0;  letter-spacing:-0px; color:#333; }
h3 {font-family: 'Open Sans', sans-serif; font-size:1.08em; line-height: 0.96em; font-weight:700; margin:20px 0 20px 0;  letter-spacing:-0px; color:#333; }
h5 {font-family: 'Open Sans Condensed', sans-serif; font-size:0.80em; line-height: 0.96em; font-weight:100; padding:0 0 10px 0; margin:0 0 30px 0;  letter-spacing:3px; color:#333; text-transform: uppercase; border-bottom:2px solid #ddd; display:inline-block; text-indent:1px;}


.genius_bar {position:fixed; width:100%; height:4px; background:red;}

.container { width:95%; max-width:1400px; margin:0 auto;}
.container_smaller { width:95%; max-width:900px; margin:0 auto;}

.nav {background:none; padding:20px; position:fixed; width:100%; transition-duration: 1s; color:#fff;  z-index:99;}
.nav ul {margin:0; padding:0;}
.nav ul li{display:inline; list-style:none; padding: 6px 20px 6px 20px; float:right;}
.nav ul li:nth-of-type(1){float:left;}
.nav ul li.menu_icon {display:none;}
.nav ul li.rsvp {background:#85c008; margin-left:20px; border-radius: 5px; color:#fff; margin-right: 20px;}
.nav ul li.logo {background:url('../../images/logo-white.png') no-repeat; background-size:200px; width:200px; height:40px;}

.nav ul li a{color:#fff; text-decoration: none;}
.nav ul li a.past-home{color: #444;}



.nav.past-home { background:#fff; color:#444; border-bottom:1px solid #eee;}
.nav ul li.logo.past-home { background:url('../../images/logo-grey.png') no-repeat; background-size:200px;}



#image { position:fixed; height: 110vh;  width: 110%; margin-left: -5%; margin-top:-3%;  background:url('../../images/budapest.png') no-repeat center center;  background-size: 100%; z-index:0;transition-duration: 2.3s; background-size: cover;}
#image.past-home {opacity:0; }
#image.hide {display:none; }


.home {height:100vh; width:100%; padding-top:180px; margin:0 auto; text-align:center; position:absolute; z-index:9;}
.home img {width:65%; max-width:380px; z-index:98;}

.button {display:inline-block; color:#fff; background:#85c008; margin:40px 0 0 0; padding: 11px 30px 11px 30px; border-radius: 5px;}


.getting_married { background:#f4f4f4; text-align:center; height:100vh; min-height:700px; padding:330px 0; z-index:9; margin-top: -400px;}
img.polaroid {width:60%; max-width:380px; margin:20px 0 40px 0; transform: rotate(4deg);}

.timeline { background:url('../../images/budapest2.png') no-repeat; background-size:cover; text-align:center; height:100vh; min-height:700px; padding:200px 0; z-index:9;}
.timeline h2 { color:#fff;}
.timeline p { color:#fff; min-width: 350px;}

.details {background:#fdfdfd; text-align:center;  min-height:700px; padding:330px 0; z-index:9;}
.col_left {width:45%; float:left; margin-right:10%; text-align:left;}
.col_right {width:45%; float:right; text-align:left;}
ul.wedding_icons {margin:0; padding:0;}
ul.wedding_icons  li {list-style:none;padding-left:100px;}
ul.wedding_icons  li.a1 {background:url('../../images/icons/rings.png') no-repeat; background-size:60px;}
ul.wedding_icons  li.a2 {background:url('../../images/icons/cake.png') no-repeat; background-size:60px;}
ul.wedding_icons  li.a3 {background:url('../../images/icons/food.png') no-repeat; background-size:60px;}
ul.wedding_icons  li.a4 {background:url('../../images/icons/bell.png') no-repeat; background-size:60px;}
ul.wedding_icons  li.a5 {background:url('../../images/icons/calendar.png') no-repeat; background-size:60px;}
ul.wedding_icons  li.a6 {background:url('../../images/icons/tux.png') no-repeat; background-size:60px;}
ul.wedding_icons  li.a7 {background:url('../../images/icons/question-mark.png') no-repeat; background-size:60px;}
ul.wedding_icons  li.a7 {background:url('../../images/icons/question-mark.png') no-repeat; background-size:60px;}
ul.wedding_icons  li.a8 {background:url('../../images/icons/gifts.png') no-repeat; background-size:60px;}
ul.wedding_icons  li.a9 {background:url('../../images/icons/city.png') no-repeat; background-size:60px;}
ul.wedding_icons  li.a10 {background:url('../../images/icons/taxi.png') no-repeat; background-size:60px;}
ul.wedding_icons  li.a11 {background:url('../../images/icons/bed.png') no-repeat; background-size:60px;}

.gifts { text-align:center; height:100vh; min-height:700px; padding:330px 0; z-index:9;}

.snap { text-align:center; height:100vh; min-height:700px; padding:330px 0; z-index:9;}

.rsvp_section { text-align:center; height:100vh; min-height:700px; padding:330px 0; z-index:9;}


.table{
  display: flex;
  flex-direction: row;
  width: 100%;
  max-width: 600px;
  margin: 0 auto;
}
.table .left, .table .right{
  width: 50%;
}
.table-item{
  padding: 10px;
  border: 1px solid #666;
  margin: 5px 5px;
}
.table-item b{
  text-transform: uppercase;
  letter-spacing: 2px;
}
.small-content{
  width: 100%;
  padding: 20px;
  max-width: 900px;
  margin: auto;
}

.number-wrapper{

}
.count-down{
  display: flex;
  list-style-type: none;
}
.count-down li{
  margin: 0 10px;
}
.word{
  font-weight: 600;
}
.word, .number{
  font-size: 25px !important;
}
.lang{
  position: absolute;
  top:20px;
  right:20px;
}
.float-left{
  float: left;
  margin-top: 20px;
  font-weight: 800;
  font-size: 18px;
}
#useful{
  margin-top:-550px;
}
/* ---------------- Mobile ---------------- */
@media only screen and (max-width: 33em) {
.genius_bar {position:fixed; width:100%; height:4px; background:purple;}

}


@media (max-width: 768px) {
  #useful{
    margin-top:-150px;
  }
  .lang{
    position: fixed;
    bottom:20px;
    right:20px;
    top: auto;
  }
  .container_full {
    margin-top: -110px;
  }
}
@media (max-width: 675px) {
  .nav ul li:nth-child(4), .nav ul li:nth-child(5), .nav ul li:nth-child(6), .nav ul li:nth-child(7){
    display: none;
  }
  #clockdiv div{
    margin: 5px 5px;
    color: #FFF;
    font-size: 15px;
  }
  #clockdiv div{
    font-size: 30px;
    color: #FFF;
  }
  .col_left, .col_right{
    width: 100%;
    float: none;
  }
  .gifty {
    width: 100%;
    position: relative;
    top: -250px;
  }
  .holding_iphone{
    background-size: 60%;
  }
  .form_col_right, .form_col_left{
    width: 100%;
    float: none;
  }

  .word, .number{
    font-size: 15px !important;
  }
.getting_married{
  margin-top: -700px;
}
.timeline p{
  font-size: 0.8em;
  min-width: auto;
}
.home{
  height: 85vh;
}
.details{
  padding: 100px 0;
}
.rsvp_section{
  padding: 0 0 100px 0;
}
#registry{
  margin-top: 100px;
  padding: 0;
}
.slick-dots, .slick-next:before, .slick-prev:before{
  display: none !important;
}
h2{
  font-size: 2.5em;
}
h3{
  line-height: 1.5;
}
}

.thankyou-bg{
  background: linear-gradient(rgba(5, 32, 88, 0.5),rgba(5, 32, 88, 0.8)),url('/images/budapest.png');
  background-repeat: no-repeat;
  background-size: cover;
}
.thankyou{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100vh;
}
.ty-logo{
  width: 300px;
  height: auto;
}
.thankyou h1{
  font-size: 2.5rem;
  color: #FFF;
  margin-top: 50px;
}
.thankyou p{
  font-size: 1.4rem;
  color: #FFF;
}
.return{
  color:#FFF !important;
  margin-top: 25px;
  font-size: 1rem;
  text-decoration: none;
}