/* utility */
.p0{padding: 0 !important;}
.p5{padding: 5px !important;}
.p10{padding: 10px !important;}
.p20{padding: 20px !important;}
.p30{padding: 30px !important;}

.m0{margin: 0 !important;}
.m5{margin: 5px !important;}
.m10{margin: 10px !important;}
.m20{margin: 20px !important;}
.m30{margin: 30px !important;}

.pw5{padding: 0 5px !important;}
.pw10{padding: 0 10px !important;}
.ph5{padding: 5px 0 !important;}
.ph10{padding: 10px 0 !important;}

.mw5{margin: 0 5px !important;}
.mw10{margin: 0 10px !important;}
.mh5{margin: 5px 0 !important;}
.mh10{margin: 10px 0 !important;}
.mh20{margin: 20px 0 !important;}

.mb0{ margin-bottom: 0; } .mt0{ margin-top: 0; }
.pb0{ padding-bottom: 0; } .pt0{ padding-top: 0; }

.mb-10{ margin-bottom: 10px; } .mb-20{ margin-bottom: 20px; }
.mb-30{ margin-bottom: 30px; } .mb-40{ margin-bottom: 40px; }
.mb-50{ margin-bottom: 50px; } .mb-60{ margin-bottom: 60px; }
.mb-70{ margin-bottom: 70px; } .mb-80{ margin-bottom: 80px; }
.mb-120{ margin-bottom: 120px; }

.mt-5{ margin-top: 5px; }
.mt-10{ margin-top: 10px; } .mt-20{ margin-top: 20px; }
.mt-30{ margin-top: 30px; } .mt-40{ margin-top: 40px; }
.mt-50{ margin-top: 50px; } .mt-60{ margin-top: 60px; }
.mt-70{ margin-top: 70px; } .mt-80{ margin-top: 80px; }

.pb-10{ padding-bottom: 10px; } .pb-20{ padding-bottom: 20px; }
.pb-30{ padding-bottom: 30px; } .pb-40{ padding-bottom: 40px; }
.pb-50{ padding-bottom: 50px; } .pb-60{ padding-bottom: 60px; }
.pb-70{ padding-bottom: 70px; } .pb-80{ padding-bottom: 80px; }
.pb-120{ padding-bottom: 120px; }

.pt-10{ padding-top: 10px; } .pt-20{ padding-top: 20px; }
.pt-30{ padding-top: 30px; } .pt-40{ padding-top: 40px; }
.pt-50{ padding-top: 50px; } .pt-60{ padding-top: 60px; }
.pt-70{ padding-top: 70px; } .pt-80{ padding-top: 80px; }

.m-top-bottom{ margin: 70px 0; }

@media (max-width: 1023px) {
    .mb0-sm{ margin-bottom: 0; } .mt0-sm{ margin-top: 0; }
    .pb0-sm{ padding-bottom: 0; } .pt0-sm{ padding-top: 0; }
}

@media (min-width: 768px) and (max-width: 992px) {
    .hide-sm{ display: none; }
    .visible-sm{ display: block; }
}

@media (max-width: 767px) {
    .mb0-xs{ margin-bottom: 0; } .mt0-xs{ margin-top: 0; }
    .pb0-xs{ padding-bottom: 0; } .pt0-xs{ padding-top: 0; }
    .hide-xs, .hidden-xs{ display: none; }
    .text-center-xs { text-align: center }
}

@media (min-width: 993px) and (max-width: 1199px) {
    .mg-left-right {
        margin: 0 33px;
    }
    .hide-md{ display: none; }
}

.no-display{ display: none !important; }

.text-black{ color: #222 !important; }
.text-white{ color: #fff !important; }
.text-gray{ color: #888 !important; }
.text-dark-gray{ color: #565656 !important; }
.text-red{ color: #ce052c; }
.text-cursive{ font-family: 'Allura', cursive; }
.smaller{ font-size: 80%; }
.bigger{ font-size: 120%; }

.btn-gold{ border:1px #888888 solid; font-weight: 700; color: #888888; }
.btn-gold:hover{ background:#bda065; border:1px #bda065 solid; color:white }

.logo-footer{ position: absolute; bottom:20px; left: 50%; margin-left: -60px; z-index: 10; cursor:pointer; opacity: 0.9}
.logo-header{ position: absolute; top:20px; left: 50%; margin-left: -60px; z-index: 10; cursor:pointer; opacity: 0.9}

@media (max-width: 768px) {
    .slide-item.slick-slide.slick-current { background-position: 50% center !important; }
    .hero .wedding-announcement .couple-name-merried-text h2 { padding-left: 5px; padding-right: 5px; }

    .logo-footer img{ width: 120px; }

    .count-down-section h2 > span { font-size: 24px }
    .story-timeline .img-holder { text-align: center; }

    .story-timeline .row.icon-xs { position: relative; }
    .story-timeline .row img.icon-xs { position: absolute; width: 60px; height: 60px; right: 30px; top: 10px  }
}