@font-face {
  font-family: 'Damion';
  font-weight: 400;
  font-style: normal;
  src: url('../fonts/Damion-regular/Damion-regular.eot');
  src: url('../fonts/Damion-regular/Damion-regular.eot?#iefix') format('embedded-opentype'),
       local('Damion'),
       local('Damion-regular'),
       url('../fonts/Damion-regular/Damion-regular.woff2') format('woff2'),
       url('../fonts/Damion-regular/Damion-regular.woff') format('woff'),
       url('../fonts/Damion-regular/Damion-regular.ttf') format('truetype'),
       url('../fonts/Damion-regular/Damion-regular.svg#Damion') format('svg');
}

@font-face {
  font-family: 'News Cycle';
  font-weight: 400;
  font-style: normal;
  src: url('../fonts/News-Cycle-regular/News-Cycle-regular.eot');
  src: url('../fonts/News-Cycle-regular/News-Cycle-regular.eot?#iefix') format('embedded-opentype'),
       local('News Cycle'),
       local('News-Cycle-regular'),
       url('../fonts/News-Cycle-regular/News-Cycle-regular.woff2') format('woff2'),
       url('../fonts/News-Cycle-regular/News-Cycle-regular.woff') format('woff'),
       url('../fonts/News-Cycle-regular/News-Cycle-regular.ttf') format('truetype'),
       url('../fonts/News-Cycle-regular/News-Cycle-regular.svg#NewsCycle') format('svg');
}

body {
    color: #666666;
}

/* Helpers */
.left {
    float: left;
}

.right {
    float: right;
}

.column {
    width: 50%;
    margin-top: 10px;
}

.row {
    display:inline-block;
    width:100%;
}

/* End of helpers */

/* Fonts */
h1 {
    font-family: 'Great Vibes', cursive;
    font-weight: 100;
    font-size: 45px;
    margin-bottom: 0px;
}
h2{
    font-family: 'Great Vibes', cursive;
    font-size: 27px;
    padding-top: 10px;
    font-weight: bold;
    letter-spacing: 2px;
}

.countdown h2{
    font-family: 'Open Sans', sans-serif;
    font-size: 40px;
    padding-top: 0px;
    padding: 0px;
    margin: 0px;
    text-transform: uppercase;
    font-weight: bold;
}

.navbar-collapse{
    background-color:rgba(0, 0, 0, 0.7);
}

h5{
    font-family: 'Great Vibes', cursive;
    font-size: 27px;
    padding-top: 10px;
    font-weight: bold;
    letter-spacing: 2px;
}

h5:before{
    content: "• • • ";
    font-size: 5px;
    line-height: 5px;
    margin-top: 12px;
    margin-left: -32px;
    position: absolute;
    display: inline-block;
}

h5:after{
    content: " • • •";
    font-size:5px;
    margin-top: 14px;
    position: absolute;
    margin-left: 12px;
    display: inline-block;
}

h6{
    font-size: 16px;
    font-weight: bold;
    text-transform: uppercase;
    text-align: center;
}

.directions h6{
    display: block;
}

h4{
    font-size: 21px;
    text-transform: uppercase;
    text-align: center;
}

.text-center, a.text-center{
    text-align: center;
}

.text-left{
    text-align: left;
}
hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #fff;
    margin: 1em 0;
    padding: 0; 
}

body {
    font-family: 'Open Sans', sans-serif;
}
/* End of Fonts */

.spotted{
    border-top: dotted 1px white ;
    padding-bottom: 15px;
}

.spotted-dr{
    border-top: dotted 1px #999 ;
    padding-bottom: 15px;
}

#homepage{
    background: url(/wedding/images/homepage-lg.jpg) no-repeat top center;
    background-size: 100%;

}

#wedding{
    background: url(/wedding/images/wedding.png) no-repeat top center;
    background-size: 100%;
}
#directions{
    background: url(/wedding/images/directions3.png) no-repeat top center;
    background-size: 100%;
}
#accommodations{
    background: url(/wedding/images/accommodations.png) no-repeat top center;
    background-size: 100%;
}
#registery{
    background: url(/wedding/images/registery2.png) no-repeat top center;
    background-size: 100%;
}
#contact{
    background: url(/wedding/images/contact.png) no-repeat top center;
    background-size: 100%;
}
#party{
    background: url(/wedding/images/registery.png) no-repeat top center;
    background-size: 100%;
}
.nav > li > a{
display: block;
padding: 10px 10px;
position: relative;
}
.navbar-default {
    background: none;
    width: 100%;
    margin: 0 auto;
    background-color: rgba(0, 0, 0, 0.5); 
    color: rgba(0, 0, 0, 0.5);
    height: 60px;
    position: fixed;
    z-index: 5;
}

.navbar-default .navbar-nav > li > a, .navbar-default .navbar-brand{
    text-transform: uppercase;
    color: #fff;
    padding-top: 20px;
    font-size: 12px;
}

.navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li:hover > a, .navbar-default .navbar-nav > .active > a{
    text-decoration: underline;
    color: #fff !important;
    background-image: url("/wedding/images/selected.png");
    background-position: center top;
    background-size: 40px 25px;
    background-repeat: no-repeat;
    background-color: transparent;
}

.center{
    margin-left: auto;
    margin-right: auto;
    display: block;
}

footer {
    width: 100%;
    display:block;
    background-color: #000;
    color: white;
    text-transform: uppercase;
    font-weight: bold;
    padding: 30px 0;
}

footer .created-by {
    margin: 0 auto;
    text-align: center;
}

.navbar-default .navbar-nav > .active > a{

    background-image: url("/wedding/images/selected.png");
    background-position: center top;
    background-size: 40px 25px;
    background-repeat: no-repeat;
    background-color: transparent;
}

.navbar-default .navbar-nav > .active > a:hover{
    background-color:transparent;
    color:black;
}
/*.selected {
    background-image: url("/images/selected.png");
    background-position: center top;
    background-size: 40px 25px;
    background-repeat: no-repeat;

}*/

/*.menu {
    margin: 0 auto;
    float: right;
    padding:30px 0 5px 0;
}

.menu a{
    padding: 20px 8px; 
    text-decoration: none;
    text-transform: uppercase;
    font-weight: 400;
    color:#fff;
}*/
/*
header .logo img {
    width: 75px;
    height: 75px;
}*/

.content {
    margin: 0 auto;
    width:100%;
    display: inline-block;
}

section {
    margin: 0 auto;
    min-height: 100px;
    padding: 20px;
}

.countdown-timer {
    margin-top: 20%;
    float:right;
    color: #fff;
    text-align: center;
    margin-bottom: 8%;
}

.countdown-timer span{
    display: inline-block;
    font-size: 20px;
    text-transform: uppercase;
}
span.days, span.hours, span.minutes{
    font-size: 35px;
    padding:0 2px 0 12px;
}
.download{
    text-decoration:underline;
    display: block;
}

.directions img{
    max-width: 100%;
}
@media (max-width:700px){
    h1{
        font-size: 23px;
        line-height: 30px;
        margin: 0px;
    }

    #countdown hr{
        display: none;
    }

    h5{
        font-size: 13px;
    }

    .countdown h2{
        font-size: 20px;
        margin-top: 0px;
    }

   .countdown-timer {
    margin-top: 20%;
    float:right;
    color: #fff;
    text-align: center;
    margin-bottom: 0%;
}
    .countdown-timer span{
    display: inline-block;
    font-size: 13px;
    text-transform: uppercase;
}
span.days, span.hours, span.minutes{
    font-size: 19px;
    padding:0 2px 0 12px;
}
}
@media (min-width:600px){
    .countdown-timer {
    margin-top: 20%;
    float:right;
    color: #fff;
    text-align: center;
    margin-bottom: 15%;
}
}

@media (min-width:1200px){
    .countdown-timer {
    margin-top: 20%;
    float:right;
    color: #fff;
    text-align: center;
    margin-bottom: 20%;
}

}
@media (min-width:767px){
    .navbar-collapse{
    background-color:rgba(0, 0, 0, 0);
}
}
@media (max-width:766px){
.navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li:hover > a, .navbar-default .navbar-nav > .active > a{
    text-decoration: underline;
    color: #fff !important;
    background-image:none;
    background-position: center top;
    background-size: 40px 25px;
    background-repeat: no-repeat;
    background-color: transparent;
}
}

@media (min-width:768px) and (max-width:791px){
    .navbar-default .navbar-nav > li > a, .navbar-default .navbar-brand {
    text-transform: uppercase;
    color: #fff;
    padding-top: 20px;
    font-size: 10px;
}
.nav > li > a {
    display: block;
    padding: 10px 7px;
    position: relative;
}
}
@media (min-width:1400px){
    .countdown-timer {
    margin-top: 20%;
    float:right;
    color: #fff;
    text-align: center;
    margin-bottom: 24%;
}
}
.countdown-timer div {
    width: auto;
    display: inline-block;
}

.countdown-info {
    width:35%;
    margin: 0 auto;
}

.countdown-info img {
    display:inline-block;
    width: 60px;
    height: 30px;
}

.countdown-info h5 {
    display:inline-block;
    margin: 0;
    font-size: 20px;
}

.callout{
    border-top: 2px solid #999;
    border-bottom:2px solid #999;
}

.callout2{
    border-top: 2px solid #999;
    border-bottom:2px solid #999;
    background-color: #eee;
}

.how-we-met {
    width: 100%;
}

.how-we-met h2, .the-proposal h2{
    font-family: 'Great Vibes', cursive;
    font-weight: 100;
    text-align: center;
    text-transform: none;
    font-size: 45px;
}

.how-we-met .item {
    width: 100%;
    display: inline-block;
    margin-top: -10px;
    margin-bottom: -10px;
}

.how-we-met .item:first-of-type {
    margin-top: 10px;
}

.how-we-met .item:last-of-type {
    margin-bottom: 10px;
}

.how-we-met .timeline .left {
    margin-left: 12%;
}

.how-we-met .timeline .right {
    margin-right: 12%;
}

.cd-timeline-content {
        border-radius: 8px;
        background-color: #eee;
}

.how-we-met .item article {
    width: 30%;

    border-radius: 8px;
    background-color: gold;

    padding: 10px;

    /*height: 20px;*/
    overflow: hidden;
    transition: height 1s;
}

/*.how-we-met .item article:hover {
    height:100px;
    transition: height 1s;
}*/

.how-we-met .item article.in-view {
    height:100px;
    transition: height 1s;
}

.how-we-met .item section {
    width: auto;
    min-height: 0px;
    margin: 0;
    padding: 0;
}

.how-we-met .item header {
    width: 100%;
    margin: 0px 0px 10px 0px;

    border-bottom: solid 1px black;
}

.the-proposal {
    display:block;
    background-image: url(/wedding/images/proposal.jpg);
}

.the-proposal h2, .the-proposal p{
    color: white;
}
.the-proposal img, .registry img{
    max-width: 100%;
    border: 3px solid white;
}

.column {
    width: 50%;
    margin-top: 10px;
}

.proposal-img {
    float:right;
    width: 80%;
    height: auto;
    padding: 15px 15px 15px 30px;

    border-left: dotted 2px gold;
}

.schedule{
    margin-top:36%;
    text-align: center;
    margin-bottom: 5%;
}
.wedding-party{
    margin-top:6%;
    text-align: center;
    margin-bottom: 5%;
}
.gallery{
    margin-top:6%;
    text-align: center;
    margin-bottom: 5%;
}
.directions{
    margin-top:36%;
    text-align: center;
    margin-bottom: 5%;
}

.accommodations{
    margin-top:45%;
    margin-bottom: 5%;
}
.contact{
    margin-top:36%;
    text-align: center;
    margin-bottom: 5%;
}
.registry{
    margin-top:36%;
    margin-bottom: 5%;
}
.accommodations h1, .contact h1{
    text-align: center;
}
.schedule h1, .registry h1, .contact h1, .directions h1{
color:white;
}

.schedule h5 {
    font-size: 30px;
    margin:10px;
}

.ceremony-date {
    font-size: 20px;
    text-transform: uppercase;
    margin:0;
}

.ceremony-time {
    margin-top:4px;
    font-size: 14px;
    text-transform: uppercase;
}

.ceremony-date sup {
    font-size: 8px;
}

.wedding-party section {
    min-height: 0px;
    margin: 0;
    padding:0;
    text-align: center;
}

.wedding-party h3 {
    margin: 0;
    padding: 0;
}

.reception-subheading {
    width: 100%;
    display: inline-block;
    margin: 0 auto;
}

.directions {
    text-align: center;
}


.directions .trolley p {
    max-width: 100%;
    width: 65%;
    text-align: left;
}

span.trolley-time {
    min-width:85px;
    display:inline-block;
}

p.trolley-note {
    margin-top:10px;
}
.registry {
    text-align: center;
}

#galleria{height:500px}


.navbar-default .navbar-toggle .icon-bar {
    background-color: #fff;
}

.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus{
    background-color: #000 !important;
}