/*
-------------------------------------------------
  Theme Name:Pair Wedding Theme
  Theme URL: http://demo.anditthemes.com/html/wedding/
  Author: And_IT
  Author URL:  
  Creation Date:
  Description:A default stylesheet for Pair Wedding-Responsive Bootstrap HTML5 Template
  Version: 1.00
  Primary use: Business, responsive, bootstrap, html5, clean, modern, creative, events, wedding etc.
  Support: andimpex@gmail.com,

  ---------------------------------------------------
  Developed By: Suraiya Aysha
  Developer URL: http://ayshatech.com/

  ---------------------------------------------------

  --------------------------------------------------
  Table of Contents
  --------------------------------------------------
  1. General CSS
  2. Typography CSS
  3. Button CSS
  4. Navbar CSS
  5. Header CSS
  6. Bride And Groom Area Start CSS
  7. Love Story CSS
  8. Gallery Area CSS
  9. RSVP Area CSS
  10. Our Best Friends CSS
        10.1 - Our Best Friends 2 Style CSS
  11. Friends Says CSS
  12. Planner Logo Slider CSS
  13. Footer Area CSS
        13.1 - Footer Upper CSS
        13.1 - Footer Bottom CSS

  14. Bride And Groom Page CSS
        14.1 - Bride Groom Page Banner CSS
        14.2 - Weeding Events CSS CSS
  15. 404 Area CSS
  16. Location Page CSS
  17. Blog Page
  18. Blog Details Page CSS
  19. Responsive Design CSS

------------------------------------------------ */


/*-----------------------------------------------
            1. General Style
-------------------------------------------------*/

  * {
      margin: 0;
      padding: 0;
      border: none;
      outline: none;
  }

  body,
  html {
      height: 100%;
      margin: 0;
  }

body {
  background: #fff none repeat scroll;
  font-size: 16px;
  font-weight: normal;
  overflow-x: hidden;
  font-family: 'Playfair Display', serif;
  color: #777c87;
    letter-spacing: 0.05em;

}

p{
  line-height: 1.75;
  color: #777c87;
}

a {
  color: #101127;
}
a:hover {
    /*color: #ff4061;*/
}
/* Theme All Transitions
------------------------------- */
a, #mainNav .navbar-nav .nav-item .nav-link.section-button.btn, .testi_prev:hover, .testi_next:hover, #mainNav, .footer-about form button,
.footer-about form button:hover, .footer-about form button .footer-email-icon, .footer-about form button:hover .footer-email-icon, .widget-search form button, .widget-search form button:hover, .footer-widget.footer-gallery ul li a img, .blog-page-area .card,
.blog-page-area .card > img, #content .share-box > button, .mean-container .mean-nav ul li, .bride-groom-box .bride-groom-content a h3, .bride-groom-social a, .footer-recent-posts li a p, .footer-social a, .gallery-filter-btn label, .friend-content h3, .footer-widget.footer-recent-posts ul li a img, .friends_slide_nav span, .story-content-wrap figcaption i, .gallery-box figcaption a i,
.friend-photo-box figcaption a i,  .friends_slide_nav span i, .footer-about form button i, .footer-about form button, .wedding_slide_nav span, .lovable-poster-box a i, .error-page-area .btn.section-button, .blog-page-area a .card-title, .reply-btn:hover, .widget-recent-posts ul li a p, .single-partner-logo-box a figure::after
{
    transition: all .5s ease-in-out;
    -webkit-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    -ms-transition: all .5s ease-in-out;
}

.slow-transition, .footer-widget.footer-recent-posts ul li a figure::after, .footer-widget.footer-gallery ul li a figure::after, .widget-recent-posts ul li a figure::after, .widget-instagram ul li a figure::after, .friends-2-page-area .single-friend{
    transition: all .7s ease-in-out;
    -webkit-transition: all .7s ease-in-out;
    -moz-transition: all .7s ease-in-out;
    -o-transition: all .7s ease-in-out;
    -ms-transition: all .7s ease-in-out;
}

  ul li {
      margin: 0;
      padding: 0;
      list-style-type: none;
  }

  ul {
      margin: 0;
      padding: 0;
  }

  a,
  a > * {
      outline: none;
      cursor: pointer;
      text-decoration: none;
  }

  a:hover {
      text-decoration: none;
      color: #ff4061;
  }
  ::-moz-selection {
      background-color: #feb6c3;
  }

  ::selection {
      background-color: #feb6c3;
  }

  img::-moz-selection {
    background: transparent;
  }

  img::selection {
    background: transparent;
  }

  img::-moz-selection {
    background: transparent;
  }
  .page-link:focus {
    box-shadow: none;
  }

  /*----Form Control Reset CSS----*/

.form-control {
    border-radius: 0;
    border: 1px solid #dddddd;
    background-color: transparent;
    height: 45px;
    color: #777c87;
}
  .form-control:focus {
      background-color: transparent;
      border-color: #dddddd;
      box-shadow: none;
  }
  .form-control::-webkit-input-placeholder {
      color: #a0a3aa;
  }
  .form-control::-moz-placeholder {
      color: #a0a3aa;
  }
  .form-control:-moz-placeholder {
      color: #a0a3aa;
  }
  .form-control::-ms-input-placeholder {
      color: #a0a3aa;
  }


/*------------------------------------------
            2.  Typography
-------------------------------------------*/
h1,
h2,
h3,
h4,
h5,
h6 {
  /*font-weight: 700;*/
    font-weight: 400;
    margin: 0;
}

p{
    margin-bottom: 0;
}
figure {
    margin: 0 0 0;
}

/*--------------------------------
            2.1 Theme Color
-----------------------------------*/
.color-dark, .header-caption p, .bride-groom-social a, .friend-social a, .story-text h4, #mainNav .navbar-nav .nav-item .nav-link,
.gallery-filter-btn label, .bride-groom-content h3, .friend-content h3, .friends_slide_nav span:hover, .friends_slide_nav span:hover i, .lovable-poster-box a,
.error-page-area .btn.section-button:hover, .locations-page-area .address-box .right-part h4, .contact-heading h2, .blog-page-area nav .page-link, .blog-page-area a .card-title, #content .card-title,.block-3 h2, .leave-comment-area > h2, #content h4.author-name,
.widget-categories ul li a:hover, #content .block-1 blockquote p, .locations-page-area .address-box .right-part p a, .address-box .right-part p
{
    color: #101127;
}

.border-dark,.bride-groom-social a, .friend-social a{
    border-color:#101127;
}

.bg-deep-blue, .footer-upper-area, .wedding_slide_nav span:hover, .not-found-content .btn.section-button:hover, .contact-form-button button, .widget-search form button{
    background-color: #101127;
}

.bg-white, .rsvp-form-area form{
    background-color: #fff;
}

.color-white,
.friend-says-content h2, .friend-says-content h5, .rsvp-submit-button > button, .footer-social a, .page-banner-wrap, .gallery-box figcaption a i, .friends_slide_nav span i, .footer-about form button i, .error-page-area .btn.section-button, .contact-form-button button,
.contact-form-button button:hover, .widget-popular-tags ul li a:hover, .widget-search form button, .widget-search form button:hover{
    color: #fff;
}
.border-white, .footer-social a {
    border: 1px solid #fff;
}

.border-pink, .bride-groom-social a:hover, .friend-social a:hover{
    border-color: #ff4061;
}

.bg-pink, .rsvp-submit-button > button, .footer-about form button, .footer-widget h4::after, .widget h4.widget-title:after, .mean-container a.meanmenu-reveal span,
.wedding_slide_nav span, .error-page-area .btn.section-button, .contact-form-button button:hover, .widget-popular-tags ul li a:hover, .widget-search form button:hover{
    background-color: #ff4061;
}

.color-pink,
h2.section-heading, .bride-groom-box:hover .bride-groom-content a h3, .bride-groom-social a:hover, .story-text h5, .friend-social a:hover, .footer-social a:hover, .copyright > a:hover,
.gallery-filter-btn label.active, .gallery-filter-btn label:hover, .single-friend:hover .friend-content a > h3, .mean-container a.meanmenu-reveal, .footer-about form button:hover i, .lovable-poster-box a:hover, .not-found-content h1, .locations-page-area .address-box .right-part p a:hover, .breadcrumb li.breadcrumb-item > a:hover, .blog-page-area nav .page-link.active,
.blog-page-area .card:hover a .card-title, #content .share-box a > span.active,  #content .share-box a:hover,  #content .share-box > button:hover, #content .author-social a:hover, .reply-btn:hover,
.leave-comment-area form label > span, .widget-categories ul li a, .widget-recent-posts ul li a p:hover, .widget-recent-posts ul li a p> span, .friend-says-img span i
{
    color: #ff4061;
}

.footer-default-font-color, .footer-upper-area, .footer-about p, .footer-widget ul li a, .copyright, .footer-about p, .footer-about form .form-control, .footer-recent-posts li a p{
    color: rgba(255,255,255,.7);
}

.footer-a-hover-color, .footer-widget.footer-recent-posts ul li a p span, .copyright > a, .breadcrumb li.breadcrumb-item > a{
    color: #ff6e87;
}

.default-overlay-bg-color, .blog-page-area .blog-overlay figcaption, .story-content-wrap figcaption, .gallery-box figcaption, .events-box figcaption,
.friend-photo-box figcaption a, .wedding-events-slider .owl-item .events-box figcaption, .footer-widget.footer-recent-posts ul li a figure::after, .footer-widget.footer-gallery ul li a figure::after, .widget-recent-posts ul li a figure::after, .widget-instagram ul li a figure::after{
    background-color: rgba(255,64,97,.7);
}

/*--------------------------------
    2.3 Theme Font Family, Font Size
-----------------------------------*/
.font-playball, .bride-groom-content h3, .friend-content h3, .friend-says-content h2, .page-banner-wrap h1, .events-content h4, .not-found-content h1, .not-found-content h4{
    font-family: 'Playball', cursive;
}
.font-18, .dash_title, .time-counter > div, .story-text h5{
    font-size: 18px;
}

/*--------------------------------
   2.4 Wedding Theme Default CSS
-----------------------------------*/

/*----Theme Main Section Heading Divider----*/
h2.section-heading {
    font-size: 48px;
    margin-bottom: 9px;
    line-height: 37px;
    font-family: 'Playball', cursive;
}
h3.section-subheading {
    font-size: 17px;
    font-weight: 400;
    width: 67%;
    margin: 15px auto 60px;
    line-height: 30px;
}
.light-section-heading-color, .friends-says-area h2.section-heading, .wedding-events-area h2.section-heading, .wedding-events-area h3.section-subheading, .wedding_slide_nav span, .not-found-content h4,
.events-content h4, .events-content h6, .events-box figcaption p{
    color: #fefefe;
}
.section-overlay{
    height: 100%;
    width: 100%;
}
.page-banner-area .section-overlay, .error-page-area .section-overlay {
    background-color: rgba(16,17,39,.7);
}
section, .friends-says-area .section-overlay, .wedding-events-area .section-overlay{
    padding: 80px 0;
}
.padding-zero{
    padding: 0 0;
}
.heading-divider {
    margin-top: 19px;
}
.page-banner-wrap {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

/*All Page Banner Heading CSS*/
header.page-banner-area {
    height: 500px;
    padding-top: 80px;
}
h1.page-banner-heading {
    font-size: 55px;
}
/*Flat Icon Default Settings*/
[class^="flaticon-"]::before, [class*=" flaticon-"]::before, [class^="flaticon-"]::after, [class*=" flaticon-"]::after {
    margin-left: 0;
}

/*--------------------------------
   2.5 Defaul Image Overlay CSS
-----------------------------------*/
.bride-photo-box::after{
    content: "";
    /*background-color: rgba(16,17,39,.5);*/
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    position: absolute;
    opacity: 0;
    transition: all ease-in-out .7s;
    -webkit-transition: all ease-in-out .7s;
}

.bride-groom-photo:hover .bride-photo-box::after, .blog-page-area .card:hover .blog-overlay figcaption{
    opacity: 1;
}

.bride-groom-photo img, .story-photo-box img, .blog-page-area .blog-overlay figure img, .footer-widget.footer-recent-posts ul li figure img, .footer-widget.footer-gallery ul li figure img, .widget-recent-posts ul li figure img, .widget-instagram ul li a figure img{
    width: 100%;
    transform: scale(1.1);
    transition: all ease-in-out .7s;
    -webkit-transition: all ease-in-out .7s;
}
.bride-groom-photo:hover img, .story-photo-box:hover img, .blog-page-area .card:hover figure img, .footer-widget.footer-recent-posts ul li a:hover figure img, .footer-widget.footer-gallery ul li a:hover figure img, .widget-recent-posts ul li a:hover figure img, .widget-instagram ul li a:hover figure img{
    transform: scale(1);
}

/*------------------------------------------
            2.  Typography
-------------------------------------------*/

/*--------------------------------------------
            3. Button Style
---------------------------------------------*/
  .btn{
      padding: 0;
  }
.btn.focus, .btn:focus {
    outline: 0;
    box-shadow: 0 0 0 0;
}
button{
    background-color: transparent;
}
.btn.section-button {
    padding: 14px 43px 17px;
    font-size: 20px;
    line-height: 15px;
    box-shadow: 0 0 0 2px transparent inset, 0 0 0 2px transparent;
    -webkit-box-shadow: 0 0 0 2px transparent inset, 0 0 0 2px transparent;
    transition: .8s;
    -webkit-transition: .8s;
}
.btn.section-button:hover{
    box-shadow: 0 0 0 2px #fff inset, 0 0 0 2px #ff4061;
    -webkit-box-shadow: 0 0 0 2px #fff inset, 0 0 0 2px #ff4061;
}

  /*Round Button Effect End*/
  .testi_prev, .testi_next {
      cursor: pointer;
      line-height: 39px;
      position: absolute;
      z-index: 9;
      top: 45%;
      border-radius: 50%;
      display: flex;
      justify-content: center;
      align-items: center;
  }
  button:focus {
      outline: 0;
      outline: 0 auto -webkit-focus-ring-color;
  }
/*-------------------------------------------
           4. Navbar Area CSS
-------------------------------------------*/
.menu-section-area {
    padding: 0;
}
#mainNav {
    background-color: rgba(255,255,255,1);
    height: 80px;
    display: flex !important;
    transition: all ease .6s;
    -webkit-transition: all ease .6s;

    box-shadow: 0 0 8px 4px rgba(0,0,0,.1);
    -webkit-box-shadow: 0 0 8px 4px rgba(0,0,0,.1);
}
#mainNav .navbar-toggler {
  font-size: 12px;
  right: 0;
  padding: 13px;
  text-transform: uppercase;
  color: #fff;
  border: 0;
  background-color: #ff4061;
}
  #mainNav .navbar-nav .nav-item .nav-link {
      font-size: 15px;
      padding: 0.75em 15px;
      letter-spacing: 1px;
      position: relative;
  }
  #mainNav ul li.nav-item:last-child a.nav-link{
      padding: 0.75em 0 0.75em 15px;
  }
#mainNav .navbar-nav .nav-item .nav-link::after, .gallery-filter-btn label::after {
    position: absolute;
    content: " ";
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    height: 2px;
    border-radius: 50px;
    background: #fff;
    width: 0;
    z-index: 9;
    opacity: 0;
    -webkit-transition: all linear .3s;
    -moz-transition: all linear .3s;
    transition: all linear .3s;
}
#mainNav .navbar-nav .nav-item .nav-link.active::after, #mainNav .navbar-nav .nav-item .nav-link:hover::after,
.gallery-filter-btn label.active::after, .gallery-filter-btn label:hover::after{
    width: 60%;
    opacity: 1;
    background: #ff4061;
}

/*---- Dropdown Menu CSS ----*/
  .dropdown-toggle::after {
      display: none;
  }
  #mainNav .navbar-nav .nav-item .nav-link > i.fa-angle-down {
      padding-left: 5px;
  }
  #mainNav .navbar-nav ul.dropdown-menu {
      background-color: transparent;
      padding: 15px 0 0 0;
      width: 230px;
      border: none;
  }

  #mainNav .navbar-nav ul.dropdown-menu li {
      background-color: #101127;
  }
  #mainNav .navbar-nav .dropdown-menu a {
      color: #fff;
      font-size: 15px;
      padding: 8px 10px 8px 12px;
      border-top: 1px solid rgba(35,45,57, 1);
      display: flex;
  }
  #mainNav .navbar-nav .dropdown-menu a:hover {
      background-color: #ff4061;
      color: #fff;
  }
@media (min-width: 992px) {

}
 /* Mean Menu / Mobile Menu Style */
.mean-container .mean-bar {
    background-color: #fff;
    height: 50px;
}
.mean-container .mean-nav {
    margin-top: 0;
    height: 100%;
}
.mean-container .mean-nav ul li a.mean-expand {
    top: -5px;
}
.mobile-logo {
    position: relative;
    top: 6px;
    left: 16px;
    height: 38px;
}
.mean-container a.meanmenu-reveal {
    top: 5px;
}
  .mean-container .mean-nav ul {
      margin: 14px 0 0 0;
      background-color: transparent;
  }
  .mean-container .mean-nav ul li a{
  }
  .mean-container .mean-nav ul li a:hover {
  }
  .mean-container .mean-nav ul li.mean-last a.section-button:hover, .mean-container .mean-nav ul li.dropdown a:hover {
  }
  .mean-container .mean-nav ul li {
      background-color: #101127;
  }
  .mean-container .mean-nav ul li:hover {
      background-color: #ff4061;
  }
  .mean-container .mean-nav ul li a {
      color: #fff;
  }

/*-------------------------------------------
            5. Header Area
-------------------------------------------*/
.hero-content-wrap{
    background-image: url("../img/header-bg.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}
.hero-area.zoom-burns{
    overflow: hidden;
    height: 100vh;
    background: 0 0;

    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 80px 0;

}
.zoom-burns-background {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    -webkit-animation: zoomburns 40s infinite;
    animation: zoomburns 40s infinite;
}

@-webkit-keyframes zoomburns {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
    50% {
        -webkit-transform: scale(1.15);
        transform: scale(1.15)
    }
    100% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

@keyframes zoomburns {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
    50% {
        -webkit-transform: scale(1.15);
        transform: scale(1.15)
    }
    100% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

.header-caption-heading {
    font-size: 60px;
    line-height: 53px;
    padding: 7px 0 3px;
}
.header-caption {
    width: 50%;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    min-height: 100vh;
}
.header-content {
    padding: 23px 0 0 0;
    position: relative;
}
.header-caption h6 {
	font-size: 22px;
	font-weight: 400;
}
.header-content h3 {
    font-size: 30px;
}
  .header-caption p {
      font-size: 20px;
  }
.header-content-float-img {
    left: -23%;
    top: -80%;
    height: auto;
    width: 90%;
}
/*--- Header Count Down CSS ---*/
#event-count {
    padding-top: 20%;
}
.event-count-box {
    display: inline-block;
}
.dash {
    background-color: transparent;
    text-align: center;
    padding: 17px 0;
    margin: 0 10px;
    height: 74px;
    width: 74px;
    color: #ff4061;
    border: 1px solid #ff4061;
    border-radius: 55px;
    font-size: 30px;
    line-height: 24px;
}
#event-count .event-count-box:first-child .dash {
    margin-left: 0;
}
#event-count .dash, .digit {
    display: inline-block;
    justify-content: center;
    text-align: center;
}
.count-down-area {
    padding: 90px 0;
    text-align: center;
}
.dash_title {
    margin-top: 11px;
}

/*--- Header Count Down CSS --- */
/*-------------------------------------------
            5. Header Area End
-------------------------------------------*/

/*-------------------------------------------
    6. Bride And Groom Area Start
-------------------------------------------*/
.bride-groom-content h3 {
    font-size: 30px;
    margin-top: 30px;
}
.bride-photo-box {
    border: 14px solid transparent;
    overflow: hidden;
}

.bride-groom-content p {
    margin: 14px 0 23px;
}
.footer-social ul li, .bride-groom-social ul li, .friend-social ul li{
    display: inline;
}
.bride-groom-social a, .footer-social a, .friend-social a {
    border-radius: 50px;
    width: 28px;
    height: 28px;
    text-align: center;
    line-height: 25px;
    margin-left: 8px;
    cursor: pointer;
    display: inline-block;
    font-size: 14px;
    border: 1px solid;
}
/*Bride Groom Border Style*/
.bride-border-box span {
    position: absolute;
    height: 54px;
    width: 54px;
    z-index: -1;
    transition: all ease-in-out .9s;
    -webkit-transition: all ease-in-out .9s;
}
.bride-groom-photo:hover .bride-groom-border{
    width: 60%;
    height: 60%;
}
.bride-border-box span:nth-child(1) {
    right: 0;
    top: 0;
    border-top: 5px solid;
    border-right: 5px solid;
    border-color: #ff4061;
}
.bride-border-box span:nth-child(2) {
    right: 0;
    bottom: 0;
    border-bottom: 5px solid;
    border-right: 5px solid;
    border-color: #ff4061;
}

.bride-border-box span:nth-child(3) {
    left: 0;
    bottom: 0;
    border-bottom: 5px solid;
    border-left: 5px solid;
    border-color: #ff4061;
}
.bride-border-box span:nth-child(4) {
    left: 0;
    top: 0;
    border-top: 5px solid;
    border-left: 5px solid;
    border-color: #ff4061;
}

/*--------Bride Groom Divider------*/
.bride-groom-divider {
    display: flex;
    align-items: center;
    height: 100%;
    justify-content: center;
}
.bride-divider-img {
    padding-bottom: 265px;
}
.bride-divider-img img {
    animation: pulse 2s ease-in-out infinite;
}
.bride-divider-img::after {
    position: absolute;
    content: "";
    height: 200px;
    width: 1px;
    background-color: #d8d8d8;
    bottom: 0;
    left: 50%;
}

/*Bride Groom Page Banner Area*/
.bride-groom-banner-area{
    background-image: url(../img/bride-groom-page-img/bride-groom-banner-bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

/*-------------------------------------------
   6. Bride And Groom Area End
-------------------------------------------*/

/*-------------------------------------------
            7. Love Story CSS
-------------------------------------------*/
.love-story-area {
    background-color: #f9f9f9;
}
.show-mobile-device{
    display: none;
}
.story-text h5 {
    margin: 16px 0;
}
.story-divider-img {
    display: flex;
    justify-content: center;
}
.story-photo-box {
    overflow: hidden;
    box-shadow: 0 0 16px 2px rgba(0,0,0,.2);
}

/*Story Photo Hover Effect Start*/
.story-content-wrap figcaption, .gallery-box figcaption {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
    transition: all ease-in-out .7s;
    -webkit-transition: all ease-in-out .7s;
}
.story-content-wrap figcaption a, .gallery-box figcaption a, .events-box figcaption .events-content {
    padding: 20px;
    width: 100%;
    height: 88%;
    margin: 17px;
    /*border: 1px solid #fff;*/
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 0;
}
.flaticon-unlink-1::before {
    font-size: 28px;
}
.story-photo-box:hover figcaption, .gallery-box:hover figcaption{
    opacity: 1;
}

/*Story Photo Hover Effect End*/

/*Story Box Left Side*/

.story-box {
    transition: .7s;
}
.story-text h4 {
    position: relative;
    z-index: 9;
}
.story-text h4 > span {
    position: absolute;
    color: #e4e4e4;
    font-size: 70px;
    right: 0;
    top: -38px;
    z-index: -1;
}
.story-box.story-right .story-text h4 > span {
    left: 0;
}
.story-box.story-left {
    padding-bottom: 60px;
}
.story-box.story-left .story-text {
    padding-top: 70px;
}

/*Story Box Right Side*/
.story-box.story-right {
    padding-top: 60px;
}
.story-box.story-right .story-text {
    padding-bottom: 70px;
}
/*---7.1 Lovable Memories Video Area CSS---*/
.bride-photo-box.lovable-poster-box::after {
    /*display: none;*/
    opacity: 1;
    z-index: 1;
}
.lovable-poster-box a {
    position: absolute;
    left: 47%;
    top: 44%;
    z-index: 9;
    width: 60px;
    height: 60px;
    background-color: #fff;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    -webkit-transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    -moz-transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    animation: shadow-pulse 3s infinite;
}
/*Video Play Button Effect */
@keyframes shadow-pulse
{
    0% {
        box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.7);
    }
    100% {
        box-shadow: 0 0 0 25px rgba(255, 255, 255, 0);
    }
}

@keyframes shadow-pulse-big
{
    0% {
        box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.5);
    }
    100% {
        box-shadow: 0 0 0 50px rgba(255, 255, 255, 0);
    }
}
/*Video Play Button Effect */

/*Love Story Banner CSS*/
.love-story-banner-area{
    background-image: url(../img/story-img/story-page-bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

/*-------------------------------------------
           7. Love Story CSS End
-------------------------------------------*/

/*-------------------------------------------
        8. Gallery Area Start
-------------------------------------------*/
.our-gallery-area {
    padding: 80px 0 50px;
}
.our-gallery-area.masonary-gallery-area, .our-gallery-area.classic-gallery-area {
    padding: 80px 0 50px;
}
.our-gallery-area .shuffle-wrapper .shuffle-item{
    transition-duration: 0.6s!important;
}
.flaticon-plus-symbol::before {
    font-size: 30px;
}
.our-gallery-area .col-lg-4.col-6.mb-4.shuffle-item.wow.fadeIn.shuffle-item--visible, .col-lg-4.col-6.mb-4.shuffle-item.wow.fadeIn.shuffle-item--hidden {
    transition: all ease-in-out .6s!important;
}
.vbox-overlay {
    background: rgba(16, 17, 39, 0.8) none repeat scroll 0% 0%!important;
}
/*Gallery Button Style*/

.gallery-filter-btn label {
    margin: 0 7px;
    padding: 0 9px 2px;
    cursor: pointer;
    font-size: 17px;
    line-height: 11px;
}
.gallery-filter-btn label::after{
    bottom: -9px;
}
.vbox-container {
    overflow-x: hidden;
    overflow-y: hidden;
}
.bottom-margin{
    margin-bottom: 30px;
}
/*Gallery-1 Page Banner CSS*/
.gallery-1-banner-area{
    background-image: url(../img/gallery-img/gallery-page-bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}
/*Gallery-2 Page Banner CSS*/
.gallery-2-banner-area{
    background-image: url(../img/gallery-img/classic-gallery-bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}
/*-------------------------------------------
        8. Gallery Area End
-------------------------------------------*/

/*-------------------------------------------
            9. RSVP Area CSS Start
-------------------------------------------*/
.rsvp-area {
    background-color: #f9f9f9;
    padding: 80px 0 74px;
}
.rsvp-form-area {
}
.rsvp-form-area {
    background-image: url("../img/rsvp-bg.png");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    padding: 0 64px 158px;
    margin: 0 46px;
}
.rsvp-form-area form {
    padding: 80px 53px;
    box-shadow: 2px 3px 57px 0 rgba(0,0,0,0.2);
    -webkit-box-shadow: 2px 3px 57px 0 rgba(0,0,0,0.2);
}
.rsvp-form-area .form-group.nessage-text {
    margin-bottom: 0;
}
.rsvp-submit-button button {
    background-color: #101127;
    color: #fff;
    margin: 30px 0 0;
}
.rsvp-submit-button button:hover {
    background-color: #ff4061;
}
/*-------9.1 RSVP Page Area CSS-------*/
.rsvp-area.rsvp-page-area {
    padding: 80px 0 74px;
}
/*RSVP Page Banner CSS*/
.rsvp-banner-area{
    background-image: url(../img/rsvp-page-banner-bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

/*-------------------------------------------
           9. RSVP Area CSS End
-------------------------------------------*/

/*-------------------------------------------
            10. Our Best Friends Area Start
-------------------------------------------*/
.friends-page-banner-area{
    background-image: url(../img/friends-page-banner-bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}
.our-best-friends-area {
    padding: 80px 0 16px;
}
.friend-photo-box figcaption a i.flaticon-unlink-1 {
    transform: rotate(-50deg);
}
.flaticon-unlink-1 {
    color: #fff;
}
.flaticon-unlink-1:hover {
    /*color: #ff4061;*/
}
/*----Image Roation CSS----*/
.single-friend {
    margin-bottom: 30px;
    padding-bottom: 34px;
}
.friend-box {
    overflow: hidden;
}
.friend-photo-box {
    transform: rotate(44deg);
    overflow: hidden;
}
.friend-p-wrap {
    height: 250px;
    width: 250px;
}
.friend-p-wrap img {
    transform: rotate(-44deg) scale(1.1);
    height: 250px;
    width: 255px;
    transition: all ease-in-out .7s;
    -webkit-transition: all ease-in-out .7s;
}
.single-friend:hover .friend-p-wrap img{
    transform: rotate(-44deg) scale(1);
}
/*----Image Roation CSS---*/

/*----Image Roation Hover CSS---*/
.friend-photo-box figcaption a {
    position: absolute;
    height: 100%;
    width: 100%;
    left: 0;
    top: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
}
.friend-photo-box figcaption a::after {
    position: absolute;
    left: 0;
    top: 0;
    content: "";
    height: 66%;
    width: 66%;
    margin: 44px;
    border: 1px solid #fff;
}
.single-friend:hover .friend-photo-box figcaption a{
    opacity: 1;
}
.single-friend:hover .friend-photo-box figcaption a i.flaticon-unlink-1::before:hover{
    color: #000;
}
.flaticon-unlink-1::before {
    font-size: 28px;
}
/*----Image Roation HOver CSS---*/

.friend-content h3 {
    margin-top: 30px;
}
.friend-content p {
    padding: 2px 0 13px;
}

/*---------------------------------------
    10.1 Our Best Friends 2 Style Area
----------------------------------------*/
.friends-2-page-banner-area {
    background-image: url(../img/our-best-friends-img/friends-2-page-banner-bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}
.friends-2-page-area {
    padding: 80px 0 50px;
}
.friends-2-page-area .friend-photo-box {
    transform: none;
}
.friends-2-page-area .friend-p-wrap img {
    transform: none;
}
.friends-2-page-area .friend-p-wrap img {
    transform: rotate(0) scale(1.1);
}
.friends-2-page-area .single-friend:hover .friend-p-wrap img {
    transform: rotate(0) scale(1);
}
.friends-2-page-area .friend-photo-box figcaption a i.flaticon-unlink-1 {
    transform: rotate(0);
}
.friends-2-page-area .friend-photo-box figcaption a::after {
    height: 84%;
    width: 84%;
    margin: 20px;
}
.friends-2-page-area .single-friend {
    box-shadow: 0 2px 7px 2px rgba(16,17,39,.1);
}
.friends-2-page-area .single-friend:hover {
    box-shadow: 0 2px 11px 2px rgba(16,17,39,.2);
}
/*-------------------------------------------
       10. Our Best Friends Area End
-------------------------------------------*/

/*-------------------------------------------
       11. Friends Says Area Start
-------------------------------------------*/
.friends-says-area {
    background-image: url('../img/friends-says-slider/friend-says-slide-bg.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    position: relative;
}
.friends-says-area .section-overlay{
    background-color: rgba(255,64,97, .80);
}
.single-friend-slide-box {
    width: 80%;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.friend-says-img {
    height: 188px;
    width: 188px;
    position: relative;
    margin-top: 57px;
}
.friend-says-img > img {
    border-radius: 50%;
    border: 5px solid #fff;
}
.friend-says-img span {
    background-color: #fff;
    height: 58px;
    width: 58px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    position: absolute;
    right: 0;
    bottom: 0;
}
.friend-says-img span .flaticon-left-quote-1::before {
    font-size: 36px;
}

.friend-says-content h2 {
    padding: 23px 0;
}
.friend-says-content h5 {
    line-height: 30px;
}
/*Friends Says Slider Nav Button*/
.friends_slide_nav > .testi_prev, .friends_slide_nav > .testi_next {
    top: 45%;
    border: 1px solid #fff;
    height: 59px;
    width: 59px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.friends_slide_nav > .testi_prev {
    left: 20%;
}
.friends_slide_nav > .testi_next {
    right: 20%;
}
.friends_slide_nav span svg {
    height: 20px;
    width: 20px;
    fill: #fff;
}
.friends_slide_nav span:hover svg {
    fill: #101127;
}
.friends_slide_nav span:hover {
    border-color: #101127;
}
/*Friends Says Slider Dots Button*/
.friends-says-slider .owl-dots {
    margin-top: 37px;
}

/*Common Slier Dot CSS*/
.owl-dots {
    text-align: center;
}
.owl-carousel button.owl-dot {
    background-color: #fff;
    display: inline-block;
    height: 9px;
    margin: 0 8px;
    width: 22px;
    border-radius: 15px;
}
.owl-dot.active {
    background-color: #101127 !important;
}

/*-------------------------------------------
       11. Friends Says Area End
-------------------------------------------*/

/*-------------------------------------------
       12. Planner Logo Slider Area CSS
-------------------------------------------*/
.planners-slider {
    padding: 0 25px;
}
.planners-slider .item {
    transition: all .4s ease;
}
.single-partner-logo-box a figure::after {
    background-color: rgba(255,64,97,.7);
    content: "";
    height: 100%;
    width: 100%;
    position: absolute;
    z-index: 9;
    left: 0;
    top: 0;
    opacity: 0;
}
.single-partner-logo-box a:hover figure::after {
    opacity: 1;
}
.single-partner-logo-box img {
    border: 1px solid #d0d0d0;
}
/*-------------------------------------------
       12. planners Logo Slider Area CSS
-------------------------------------------*/

/*-------------------------------------------
    13. Footer Area Start
-------------------------------------------*/
 /* ----  13.1 Footer Upper Style ---------*/

.footer-upper-area {
    padding: 72px 0 66px;
}
  .footer-about p {
      line-height: 30px;
      margin: 30px 0;
  }
  .footer-about .form-inline{
      border: 1px solid transparent;
      width: 100%;
  }
  .footer-about form .form-control{
      /*color: #fff;*/
  }
.footer-widget ul li a:hover, .footer-recent-posts li a:hover p{
    color: rgba(255,255,255,1);
}
.footer-about p {
    line-height: 30px;
    margin: 30px 0;
}
.footer-about form .form-control{
  width: calc(100% - 90px);
  border-top: 1px solid rgba(255,255,255,.7);
  border-bottom: 1px solid rgba(255,255,255,.7);
  border-right: 1px solid transparent;
  border-left: 1px solid rgba(255,255,255,.7);
  float: left;
}
.footer-about form button, .widget-search form button {
    height: 45px;
    width: 55px;
    border-radius: 0;
    padding: 0;
    float: right;
    text-align: center;
}
  .footer-about form button:hover{
      background-color: #fff;
	}
  .footer-widget h4 {
      font-size: 18px;
      line-height: 30px;
      position: relative;
      margin-bottom: 50px;
  }
  .footer-widget h4::after, .widget h4.widget-title:after {
      content: "";
      height: 1px;
      width: 38px;
      z-index: 9;
      left: 0;
      bottom: -10px;
      position: absolute;
  }
.footer-widget.quick-links ul li {
    margin-bottom: 11px;
}
.footer-widget.quick-links ul li a {
    padding: 0 0 6px;
    display: block;
}
  /* Recent Posts*/
  .footer-widget.footer-recent-posts ul li {
      margin-bottom: 8px;
  }
  .footer-widget.footer-recent-posts ul li a {
      font-size: 15px;
      line-height: 22px;
      display: flex;
      align-items: center;
  }
.footer-widget.footer-recent-posts ul li figure {
    padding-right: 15px;
    margin-right: 15px;
}
  .footer-widget.footer-recent-posts ul li a img {
      width: auto;
      height: 75px;
  }

.footer-widget.footer-recent-posts ul li figure, .footer-widget.footer-gallery ul li figure, .widget-recent-posts ul li figure, .widget-instagram ul li a figure{
    position: relative;
    overflow: hidden;
}
.footer-widget.footer-recent-posts ul li a figure::after, .footer-widget.footer-gallery ul li a figure::after, .widget-recent-posts ul li a figure::after, .widget-instagram ul li a figure::after{
    position: absolute;
    content: "";
    height: 100%;
    width: 100%;
    z-index: 9;
    left: 0;
    top: 0;
    opacity: 0;
}
.footer-widget.footer-recent-posts ul li a:hover figure::after, .footer-widget.footer-gallery ul li a:hover figure::after, .widget-recent-posts ul li a:hover figure::after, .widget-instagram ul li a:hover figure::after{
    opacity: 1;
}
  .footer-widget.footer-recent-posts ul li a p span {
      display: block;
      line-height: 25px;
      margin-top: 9px;
  }
  /*Footer Gallery*/
.footer-widget.footer-gallery ul li {
    display: flex;
    justify-content: space-between;
    float: left;
    margin-top: 7px;
    margin-bottom: 3px;
}
.footer-widget ul li:nth-child(2n+1) a {
    padding-right: 10px;
}
  /* 13.1 ----Footer Upper Style---------*/

  /* 13.2 -----Footer Bottom Style---------*/
  .footer-bottom-area {
      background-color: #0a0b19;
      padding: 30px 0;
  }
  .footer-bottom-part {
      display: flex;
      justify-content: space-between;
  }
  /* 13.2 ---- Footer Bottom Style---------*/
/*-------------------------------------------
        13. Footer Area End
-------------------------------------------*/

/*-------------------------------------------
      14. Bride And Groom Page Style Start
-------------------------------------------*/

/*14.1 ---- Bride Groom Page Banner CSS -------*/
/*---- Breadcrumb ----*/
.breadcrumb{
    background-color: transparent;
    padding: 0;
}
.breadcrumb-item.active {
    color: #fff;
}
.breadcrumb li {
    font-size: 22px;
}
.breadcrumb-item + .breadcrumb-item::before {
    padding: 0 13px;
    color: #fff;
    content: "/";
}
.breadcrumb-item + .breadcrumb-item {
    padding-left: 0;
}

/*14.2 ---- Weeding Events CSS -------*/
.wedding-events-area {
    height: 800px;
}
.wedding-events-wrapper{
    background-image: url('../img/bride-groom-page-img/wedding-events-bg.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}
.wedding-events-area .section-overlay {
    background-color: rgba(16,17,39,.80);
    max-height: 539px;
}
.events-box figcaption {
    position: absolute;
    top: 3%;
    left: 3%;
    height: 94%;
    width: 94%;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
    transition: all ease-in-out .7s;
    -webkit-transition: all ease-in-out .7s;
}
.events-box figcaption .events-content {
    flex-direction: column;
}
.events-content h4 {
    font-size: 28px;
    border-bottom: 1px solid #fefefe;
    margin-bottom: 15px;
    padding-bottom: 5px;
}
.events-content p {
    margin-top: 15px;
}
.flaticon-wedding-dinner::before , .flaticon-newlyweds:before, .flaticon-toast:before{
    font-size: 42px;
    color: #fff;
}
.events-box {
    margin: 0 15px;
}
.events-box figcaption .events-content {
    width: 87%;
    height: 85%;
}

.wedding-events-slider .owl-item {
    transform: scale(.8);
}
.wedding-events-slider .owl-item.active.center {
    transform: scale(1);
}
.wedding-events-slider .owl-item .events-box figcaption {
    opacity: 1;
}
.wedding-events-slider .owl-item.active.center .events-box figcaption {
    /*background-color: rgba(16,17,39,.8);*/
}
.wedding-events-slider .owl-item.active.center .events-box figcaption .events-content {
    width: 88%;
    height: 86%;
}
.wedding-events-slider .owl-item.active.center .events-box figcaption .events-content h6,
.wedding-events-slider .owl-item.active.center .events-box figcaption .events-content p {
    font-size: 15px;
}
.wedding_slide_nav span {
    height: 50px;
    width: 50px;
    top: 43%;
}
.wedding_slide_nav > .testi_prev {
    left: 2%;
}
.wedding_slide_nav > .testi_next {
    right: 2%;
}

/*-------------------------------------------
    14. Bride And Groom Page Style Start End
-------------------------------------------*/

/*-------------------------------------------
         15. 404 Area Start
-------------------------------------------*/
.error-page-area {
    background-image: url(../img/404-bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    height: 100vh;
}
.error-page-area .section-overlay {
    padding: 190px 0 100px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.not-found-content {
    width: 400px;
    margin: 0 auto;
    border: 6px dotted #fff;
    padding: 10px;
    height: 400px;
    border-radius: 50%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.not-found-content h1 {
    font-size: 60px;
}
.not-found-content h4 {
    width: 70%;
    margin: 0 auto;
}
.error-page-area .btn.section-button {
    margin: 33px 0 0;
    padding: 12px 15px 13px;
}

/*-------------------------------------------
        15. 404 Area End
-------------------------------------------*/

/*-------------------------------------------
    16. Location Page Style Start
-------------------------------------------*/
.location-banner-area{
    background-image: url(../img/location-page-banner-bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}
.locations-page-area {
    padding: 80px 0 80px;
}
.google-map {
    padding-top: 33px;
}
.google-map iframe {
    border: none;
    width: 100%;
    min-width: 300px;
    height: 450px;
}
  /*Location Address Part*/
.locations-page-area .address-box {
    display: flex;
    background-color: #fff;
    padding: 33px;
    align-items: center;
    margin-bottom: 30px;
}
.location-address-part .row .col-12.col-sm-12.col-md-4:first-child .address-box {
    background-color: #f7f7f7;
}
.location-address-part .row .col-12.col-sm-12.col-md-4:nth-child(2) .address-box {
    background-color: #ffeaee;
}
.location-address-part .row .col-12.col-sm-12.col-md-4:nth-child(3) .address-box {
    background-color: #fff9e6;
}

.locations-page-area .flaticon-telephone::before, .locations-page-area .flaticon-at:before, .locations-page-area .flaticon-placeholder-3:before {
    font-size: 33px;
    color: #ff4061;
}
.locations-page-area .address-box .right-part {
    padding-left: 20px;
}
.locations-page-area .address-box .right-part h4 {
    padding-bottom: 10px;
}
/*Location Form Part CSS*/
.location-form-part {
    background-color: #fff;
    padding: 71px 100px 100px;
    margin: 50px 0 100px;
    box-shadow: 0 4px 27px 1px rgba(16,17,39,0.2);
    -webkit-box-shadow: 0 4px 27px 1px rgba(16,17,39,0.2);
}
.contact-heading h2 {
    margin-bottom: 50px;
    line-height: 39px;
}
.contact-form-area .form-group, .rsvp-form-area .form-group {
    margin-bottom: 2rem;
}
.contact-form-area textarea.form-control {
    min-height: 250px;
}
.contact-form-button {
    text-align: center;
}

/*-------------------------------------------
        16. Location Page Style End
-------------------------------------------*/

/*-------------------------------------------
    17. Blog Page Style Start
-------------------------------------------*/
.blog-banner-area{
    background-image: url("../img/blog-img/blog-page-bg.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}
.blog-page-area .card {
    border: none;
    box-shadow: 0 6px 9px 0 rgba(16,17,39,.2);
    background-color: #fff;
    margin-bottom: 30px;
    overflow: hidden;
    border-radius: 0;
}
.blog-page-area .card:hover {
    box-shadow: 0 6px 9px 0 rgba(16,17,39,.3);
}
  .blog-page-area .card > img{
      width: 100%;
      height: auto;
  }

.blog-page-area .card-body {
    padding: 18px 22px 22px 22px;
}
.blog-page-area a .card-title {
    font-size: 20px;
    line-height: 30px;
}
  .blog-page-area .card-footer {
      padding: 20px 0 0 0;
      border-top:1px solid #dddddd;
      background-color: #fff;
  }
  .blog-page-area .card-footer-box {
      justify-content: space-between;
      align-items: center;
      font-size: 14px;
  }
  .blog-page-area .card-footer, .blog-page-area .card-footer .author-box a > span , .blog-page-area .card-footer-share a{
      color: #777c87;
  }
.blog-page-area .card-footer .flaticon-calendar::before {
    font-size: 14px;
}
  .blog-page-area .card-footer .author-box a > span {
      padding-left: 14px;
  }
  .blog-page-area .card-footer-share a {
      padding-left: 9px;
  }

  /*Blog Thumb Overlay Effect*/
.blog-page-area .blog-overlay {
    overflow: hidden;
    position: relative;
}
.blog-page-area .blog-overlay figcaption {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    padding: 20px;
    opacity: 0;
    transition: all ease-in-out .7s;
    -webkit-transition: all ease-in-out .7s;
}
.blog-page-area .blog-overlay figcaption::after {
    content: "";
    z-index: 9;
    position: absolute;
    height: 85%;
    width: 88%;
    left: 0;
    top: 0;
    /*border: 1px solid #fff;*/
    margin: 20px;
}

  /*Blog Thumb Pagination-----*/
  .blog-page-area nav {
      width: 100%;
      margin-top: 26px;
  }
  .blog-page-area nav .page-link {
      font-size: 16px;
      border: 1px solid transparent;
      border-radius: 50px;
      height: 35px;
      width: 35px;
      margin: 0 4px;
      text-align: center;
      line-height: 12px;
  }
  .blog-page-area nav .page-link.active {
      font-size: 16px;
      border: 1px solid #ff4061;
  }
  .blog-page-area nav ul li:first-child .page-link , .blog-page-area nav ul li:last-child .page-link {
      border: none;
      border-radius: 0;
      height: auto;
      width: auto;
      text-transform: uppercase;
  }
/*-------------------------------------------
        17. Blog Page Style End
-------------------------------------------*/

/*-------------------------------------------
    18. Blog Details Page Style Start
-------------------------------------------*/
.single-blog-banner-area{
    background-image: url(../img/blog-img/single-blog-page-banner-bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}
  /*Block 1 Style*/
#content {
    padding-right: 30px;
}
  #content .card-footer-box div {
      margin-right: 37px;
  }
  .block-1 {
  }
  #content .block-1 p {
      margin-bottom: 20px;
  }
  #content .author-box img {
      margin-right: 15px;
      height: 36px;
  }
  #content .blog-date i, #content .card-footer-share i{
      margin-right: 6px;
  }
  #content .card {
      border-radius: 0;
      box-shadow: none;
      margin-bottom: 0;
  }
  #content .card-body {
      padding: 28px 0 2px 0;
  }

   /*Blog Content Media*/
  .blog-content-media {
      margin: 0 0 35px;
      padding-top: 15px;
  }
  .blog-content-media img {
      width: 100%;
  }
#content blockquote {
    padding: 22px 60px 22px 60px;
    border-left: 5px solid #ff4061;
    margin: 5% 0;
}
#content .block-1 blockquote p {
    margin-bottom: 0;
    font-size: 20px;
}
#content .share-box {
    text-transform: capitalize;
}
  #content .share-article {
      border-top: 1px solid #ebedf3;
      border-bottom: 1px solid #ebedf3;
      padding: 40px 0;
      margin-top: 30px;
  }
  #content .share-box a ,  #content .share-box > button{
      color: #777c87;
  }
  #content .share-box > button {
      padding-right: 5px;
      cursor: pointer;
  }
  .share-box i {
      padding-right: 8px;
  }
  #content .author-details {
      padding-left: 26px;
  }
#content .author-social ul li {
    display: inline-block;
}
#content .author-social a {
    color: #777c87;
    padding: 4px 12px;
    font-size: 18px;
    display: block;
}
#content .author-details p {
    padding: 15px 0 15px;
}
#content .about-author {
  border-bottom: 1px solid #ebedf3;
  margin: 33px 0;
  padding-bottom: 33px;
}
.author-img img {
    border-radius: 50%;
}
.author-img.blog-writer img {
    height: 100px;
    width: 100px;
}
.comment-date-time {
    color: #777c87;
    font-size: 12px;
    padding-top: 4px;
    display: block;
}
  .reply-btn{
      cursor: pointer;
  }
  /*--- 22.1 Block 3 Style--- */
  #content .main-comment {
      clear: both;
  }
#content .main-comment .under-comments {
    width: 90%;
    float: right;
    min-width: 48%;
    max-width: 90%;
}
  #content .main-comment .about-author {
      border-bottom: none;
      margin: 0;
      padding: 22px 0 13px;
  }
  /*--- 22.2 Leave a Comment Style --- */
.block-3 h2 {
    margin-bottom: 20px;
}
.leave-comment-area > h2 {
    margin: 40px 0 40px;
}
  #content h4.author-name {
    font-size: 22px;
  }
  .leave-comment-area .form-group {
      margin-bottom: 33px;
  }
  .leave-comment-area textarea.form-control{
      min-height: 170px;
  }
.leave-comment-area form .btn.section-button {
    margin: 0;
}
  /* ---- 22.3 Blog Aside Area ---- */
  /*Widget Search*/
.widget-search form .form-control {
    width: calc(100% - 55px);
    float: left;
}
.widget-search .form-inline {
    border: 1px solid #101127;
    width: 100%;
}
  /*Widget Title*/
  .widget h4.widget-title {
      margin: 61px 0 43px;
  }
  .widget h4.widget-title::after {
      background-color: #2c303a;
      bottom: -9px;
  }
  /*Widget Categories*/
.widget-categories ul li a {
    display: block;
    padding: 7px 0;
    text-transform: capitalize;
}
  .widget-categories ul li a > i {
      font-size: 12px;
      padding-right: 9px;
  }

  /*Widget Recent Post*/
.widget-recent-posts ul li a {
    padding: 5px 0;
}
  .widget-recent-posts ul li:first-child a, .widget-categories ul li:first-child a {
      padding-top: 0;
  }
  .widget-recent-posts ul li:last-child a, .widget-categories ul li:last-child a  {
      padding-bottom: 0;
  }
.widget-recent-posts ul li a p {
    line-height: 21px;
    width: 84%;
    padding-left: 10px;
    font-size: 14px;
}
  .widget-recent-posts ul li a p > span {
      display: block;
      padding-top: 6px;
  }
  /*Widget Popular Tags*/
  .widget-popular-tags ul li {
      display: inline-block;
  }
.widget-popular-tags ul li a {
    background-color: #fff;
    display: block;
    float: left;
    padding: 5px 12px;
    margin: 1px;
    font-size: 14px;
    border: 1px solid #edeeef;
    color: #777c87;
    text-transform: capitalize;
}
  /*Widget Instagram */
  .widget-instagram ul li {
      display: flex;
      float: left;
  }
  .widget-instagram ul li a:last-child img {
      padding-right: 0;
  }
.widget-instagram ul li a figure {
    margin-bottom: 8px;
    margin-right: 8px;
}
/*-------------------------------------------
    18. Blog Details Page Style End
-------------------------------------------*/

/*-------------------------------------------
    19. Responsive Design CSS
-------------------------------------------*/

/*=====================================
    Extra Large Screen
========================================*/

  @media only screen and (min-width: 1920px){
  }

/*=====================================
    For Large Screen
========================================*/

  /*------Max 1200px Width Screen------*/

  @media only screen and (max-width: 1775px) {

  }

/*--------Max 1680px Width Screen---------*/
@media only screen and (max-width: 1680px) {
    .header-content-float-img {
        left: -18%;
        top: -86%;
        height: auto;
        width: 80%;
    }
    .header-caption-heading {
        font-size: 41px;
        line-height: 42px;
        padding: 0 0 0;
    }
    .header-content h3 {
        font-size: 26px;
    }
}

/*--------Max 1366px Width Screen---------*/

@media only screen and (max-width: 1366px) {
    .header-content-float-img {
        left: -18%;
        top: -66%;
        width: 71%;
    }
    #event-count {
        padding-top: 16%;
    }

    /*Default for Max 1366px Width Devices*/
    body {
        font-size: 14px;
    }

    h2.section-heading {
        font-size: 41px;
    }
    h3.section-subheading {
        font-size: 16px;
    }
    #mainNav .navbar-nav .dropdown-menu a {
        font-size: 14px;
    }

    /*Other Page Banner*/
    h1.page-banner-heading {
        font-size: 46px;
    }
    .breadcrumb li {
        font-size: 20px;
    }
    .friend-says-content h5 {
        font-size: 18px;
    }
    .blog-page-area a .card-title {
        font-size: 19px;
        min-height: 61px;
    }
    #content .card-title {
        font-size: 30px;
    }
    .widget h4.widget-title {
        margin: 35px 0 36px;
        font-size: 23px;
    }
    #content .block-1 blockquote p {
        font-size: 18px;
    }
    #content h4.author-name {
        font-size: 19px;
    }
    .block-3 h2 {
        font-size: 28px;
    }
    .btn.section-button {
        padding: 12px 41px 14px;
        font-size: 17px;
    }
    #mainNav .navbar-nav .nav-item .nav-link {
        font-size: 14px;
    }
    .footer-widget h4 {
        font-size: 17px;
    }
    .footer-widget.footer-recent-posts ul li a {
        font-size: 14px;
    }
    .form-control {
        height: 40px;
    }
    .footer-about form button, .widget-search form button {
        height: 40px;
    }
    .bride-groom-content h3 {
        font-size: 28px;
    }
    .events-content h4 {
        font-size: 25px;
    }
    .story-text h4 {
        font-size: 21px;
    }
    .story-text h5 {
        font-size: 15px;
    }
    .gallery-filter-btn label {
        font-size: 15px;
    }
}


/*--------Max 1200px Width Screen---------*/

  @media only screen and (max-width: 1200px) {
  }

/*--------Min 1200px Width Screen--------*/
  @media only screen and (min-width: 1200px) {

  }

/*=====================================
    For Medium Screen
========================================*/

  @media only screen and (min-width: 992px) and (max-width: 1199px){

      section, .friends-says-area .section-overlay, .wedding-events-area .section-overlay {
          padding: 50px 0;
      }
      /*Main Menu Bar*/
      .mobile_menu{
          display: none!important;
      }
      #mainNav .navbar-nav .nav-item .nav-link, #mainNav ul li.nav-item:last-child a.nav-link {
          padding: 0 8px;
          font-size: 14px;
      }
      #mainNav .navbar-nav .nav-item .nav-link::after {
          bottom: -6px;
      }
      #mainNav .navbar-nav ul.dropdown-menu {
          padding: 26px 0 0 0;
      }
      /*Header Area*/
      .hero-content-wrap {
          height: 106vh;
      }
      .header-content-float-img {
          width: 85%;
      }
      .our-gallery-area {
          padding: 50px 0 20px;
      }
      .rsvp-area {
          padding: 50px 0 44px;
      }
      /*Footer*/
      .footer-widget.footer-gallery ul li figure img {
          height: 58px;
      }
      /*Page Banner CSS*/
      header.page-banner-area {
          height: 430px;
      }
      .wedding-events-area {
          height: 668px;
      }
      .story-divider-img img {
          height: 520px;
      }
      .our-best-friends-area {
          padding: 50px 0 0;
      }
      .friends-says-slider .owl-dots {
          margin-top: 18px;
      }
      .friend-p-wrap {
          height: 210px;
          width: 210px;
      }
      .friend-p-wrap img {
          height: 210px;
          width: 210px;
      }
      .friend-photo-box figcaption a::after {
          height: 60%;
          width: 60%;
      }
      h3.section-subheading {
          margin: 30px auto 45px;
      }
      .single-friend {
          margin-bottom: 12px;
      }
      .blog-page-area nav {
          margin-top: 10px;
      }
      #content blockquote {
          padding: 10px 60px 10px 54px;
          margin: 5% 0;
      }
      .leave-comment-area > h2 {
          margin: 20px 0 37px;
      }
      /*Blog Page Area*/
      .blog-page-area .card-body {
          padding: 30px 10px 22px 10px;
      }
      .blog-page-area a .card-title {
          font-size: 18px;
      }
      .trainers-page-area {
          padding: 60px 0 50px;
      }
      .widget-popular-tags ul li a {
          padding: 6px 12px;
      }
      .widget-instagram ul li a img {
          height: 53px;
      }
      .locations-page-area {
          padding: 50px 0 0;
      }
      .locations-page-area .address-box {
          margin-bottom: 0;
      }
      .friends-2-page-area .single-friend {
          margin-bottom: 30px;
      }

  }

/*======================================
        Tablet layout
=========================================*/

  @media only screen and (max-width: 992px) {
      .story-box.story-left .story-text {
          padding-top: 40px;
      }
      .story-box.story-right .story-text {
          padding-bottom: 40px;
      }
      .story-box.story-right {
          padding-top: 40px;
      }
      .friends-2-page-area .single-friend {
          margin-bottom: 30px;
      }
  }

  @media only screen and (max-width: 991px) {

        /*Header CSS*/
      .header-content-float-img {
          display: none;
      }
    /*Bride Groom CSS*/
      .bride-groom-area .col-2.col-sm-2.col-md-2.col-lg-2 {
          display: none;
      }

  }


  @media only screen and (max-width: 768px) {
      /*Main Menu Bar*/
      #mainNav {
          display: none !important;
      }

      /*Header CSS*/
      .hero-area.zoom-burns {
          padding: 0;
      }

  }

  @media only screen and  (max-width: 991px){
      /*Header Area*/
      .hero-area.zoom-burns {
          padding: 25px 0 0;
      }
      header.page-banner-area {
          height: 350px;
          padding-top: 62px;
      }
      /*header*/
      .hero-content-wrap.zoom-burns-background {
          background-size: inherit!important;
      }
      .header-caption {
          width: 100%;
          justify-content: center;
      }
      .dash {
          color: #fff;
          background-color: #ff4061;
      }

      /*Friends Area*/
      .friend-p-wrap img {
          transform: rotate(0) scale(1.1);
          height: auto;
          width: 100%;
      }
      .friend-photo-box {
          transform: rotate(0);
      }
      .single-friend:hover .friend-p-wrap img {
          transform: rotate(0) scale(1);
      }
      .friend-p-wrap {
          height: 100%;
          width: 100%;
      }
      .friend-photo-box figcaption a::after {
          height: 80%;
          width: 80%;
          margin: 33px;
      }
      /*Friend Area CSS*/
      .friend-photo-box svg {
          transform: rotate(0);
      }
  }

  @media only screen and (min-width: 768px) and (max-width: 991px){

      section, .friends-says-area .section-overlay, .wedding-events-area .section-overlay {
          padding: 50px 0;
      }
      h3.section-subheading {
          margin: 25px auto 35px;
          width: 80%;
      }
      /*Main Menu Bar*/
      #mainNav{
          display: none!important;
      }
      /*Header Area*/
      .hero-area.zoom-burns {
          padding: 25px 0 0;
      }
      header.page-banner-area {
          height: 350px;
          padding-top: 56px;
      }

      /*Bride Groom Area*/
      .bride-groom-content h3 {
          font-size: 30px;
          margin-top: 25px;
      }
      /*Story CSS*/
      .story-box.story-left {
          padding-bottom: 40px;
      }
      .story-box.story-right {
          padding-top: 40px;
      }
      .story-divider-img img {
          height: 454px;
      }

      /*RSVP Area CSS*/
      .rsvp-area {
          padding: 50px 0 20px;
      }
      .single-friend {
          margin-bottom: 20px;
      }
      .friends-says-slider .owl-dots {
          margin-top: 16px;
      }
      .rsvp-form-area {
          padding: 0 51px 56px;
          margin: 0 38px;
          background-size: contain!important;
      }
      .rsvp-form-area form {
          padding:37px 50px;
      }
      .rsvp-area.rsvp-page-area {
          padding: 50px 0 20px;
      }
      .leave-comment-area > h2 {
          margin: 12px 0 30px;
      }
      /*Gallery*/
      .our-gallery-area {
          padding: 50px 0 20px;
      }
      .our-gallery-area.masonary-gallery-area, .our-gallery-area.classic-gallery-area {
          padding: 50px 0 20px;
      }
      .our-best-friends-area {
          padding: 50px 0 0;
      }
      .wedding-events-area {
          height: 710px;
      }
      .widget-search .form-inline {
          width: 50%;
          margin-top: 33px;
      }
      .footer-about .form-inline {
          width: 75%;
      }
      /*Footer Area*/
      .footer-widget {
          border-top: 1px solid #2f414a;
          margin-top: 30px;
      }
      .footer-widget > h4 {
          margin-top: 30px;
          margin-bottom: 30px;
      }
      .footer-widget.footer-gallery ul li {
          justify-content: left;
      }
      .footer-widget.quick-links {
          margin-top: 0;
          border: none;
      }
      .footer-widget.quick-links > h4 {
          margin-top: 0;
      }
      /*Blog Area Style*/
      .blog-page-area a .card-title {
          font-size: 18px;
      }
      .blog-page-area nav {
          margin-top: 6px;
      }
      /*Location Page Area*/
      .locations-page-area {
          padding: 50px 0 0;
      }
      .locations-page-area .location-address-part {
          padding-bottom: 50px;
      }
      .google-map {
          padding-top: 15px;
      }
      .address-cover-main::before {
          left: 18px;
      }
      .locations-page-area .flaticon-telephone::before, .locations-page-area .flaticon-at::before, .locations-page-area .flaticon-placeholder-3::before {
          font-size: 23px;
      }
      .locations-page-area .address-box .right-part h4 {
          font-size: 20px;
      }
      .locations-page-area .address-box {
          padding: 15px;
          min-height: 170px;
      }

  }

/*=======================================
        For Small Devices
=========================================*/
  @media only screen and (max-width: 767px) {

      section, .friends-says-area .section-overlay, .wedding-events-area .section-overlay {
          padding: 50px 0;
      }
      p , .footer-widget.quick-links ul li a{
          font-size: 15px;
      }
      h3.section-subheading {
          width: 100%;
          margin: 28px auto 38px;
      }
    /*Header Area*/
      header.page-banner-area {
          height: 376px;
          padding-top: 57px;
      }
      h3.section-subheading {
          width: 100%;
      }
      .our-gallery-area {
          padding: 50px 0 20px;
      }
      .rsvp-area {
          padding: 50px 0 44px;
      }
      .our-best-friends-area {
          padding: 50px 0 0;
      }
      /*Gallery CSS*/
      .gallery-box figcaption svg, .friend-photo-box svg {
          height: 30px;
          width: 30px;
      }
      .wedding-events-area {
          height: 655px;
      }
      /*Love Story CSS*/
      .story-text h4 {
          font-size: 21px;
      }
      .story-box.story-right {
           padding-top: 37px;
       }
      .story-box.story-left {
          padding-bottom: 37px;
      }
      .story-divider-img img {
          height: 517px;
      }
      .events-content h4 {
          font-size: 20px;
      }
      .flaticon-wedding-dinner::before, .flaticon-newlyweds::before, .flaticon-toast::before {
          font-size: 24px;
      }
      .wedding-events-slider .owl-item.active.center .events-box figcaption .events-content h6, .wedding-events-slider .owl-item.active.center .events-box figcaption .events-content p {
          font-size: 14px;
      }
      .wedding-events-area {
          height: 616px;
      }
      #content .card-footer-box div {
          margin-right: 18px;
      }
      .blog-page-area .card-footer-box {
          font-size: 13px;
      }
      #content blockquote {
          padding: 15px 24px 18px 37px;
      }
      /*Footer Area*/
      .footer-widget {
          border-top: 1px solid #2f414a;
          margin-top: 30px;
      }
      .footer-widget > h4 {
          margin-top: 30px;
          margin-bottom: 30px;
      }
      .footer-widget.footer-gallery ul li {
          justify-content: left;
      }
      .footer-widget.quick-links {
          margin-top: 0;
          border: none;
      }
      .footer-widget.quick-links > h4 {
          margin-top: 0;
      }
      .footer-widget.footer-gallery ul li a img, .widget-instagram ul li a img , .footer-widget.footer-recent-posts ul li a img{
          height: 60px;
          width: auto;
      }
      .footer-widget.footer-recent-posts ul li a p span {
          line-height: 13px;
          margin-top: 3px;
          font-size: 12px;
      }
      /*Error Page*/
      .error-page-area img {
          height: 182px;
      }
      .footer-widget.footer-recent-posts ul li a img {
          margin-right: 7px;
      }
      .footer-widget.footer-recent-posts ul li {
          margin-bottom: 10px;
      }
      /*Blog Page Area*/
      .blog-page-area .card-footer .author-box a > span {
          padding-left: 5px;
      }
      .blog-page-area .card-body {
          padding: 22px 8px 22px 8px;
      }
      .blog-page-area .card > img{
          width: 100%;
          height: auto;
      }
      /*Contact Page Area*/
      .address-cover-main::before {
          display: none;
      }
      .address-cover-main {
          padding-left: 0;
          margin-top: 37px;
      }
      .contact-form-area form .row .col-sm-6:first-child {
          padding-right: 15px;
      }
      .address-box {
          width: 76%;
      }
      /*Single Blog Page Area*/
      .blog-comments-section {
          padding-left: 0;
      }
      #content .main-comment .under-comments {
          width: 86%;
      }
      #sidebar.sidebar.wedding-widget-area {
          border-top: 1px solid #bababa;
          margin-top: 50px;
          padding-top: 40px;
      }
      .gallery-2-area .gallery-menu button {
          margin: 4px 4px;
      }
      .gallery-filter-btn label {
          font-size: 16px;
      }
      /*RSVP Area CSS*/
      .rsvp-form-area form {
          padding: 35px 35px;
      }
      .rsvp-form-area {
          padding: 0 0 85px;
          margin: 0 25px;
      }
      /*Friends Area CSS*/
      .friend-photo-box figcaption a::after {
          margin: 25px;
      }
      .friend-says-content h5 {
          line-height: 28px;
          font-size: 16px;
      }
      .friend-photo-box figcaption a i.flaticon-unlink-1 {
          transform: rotate(0deg);
      }
      .locations-page-area .address-box {
          margin: 0 auto 30px;
      }
      .locations-page-area {
          padding: 50px 0 50px;
      }
      .lovable-poster-box a {
          left: 44%;
          top: 35%;
      }

  }

  /*========================================
            For large mobile
  =========================================*/

@media only screen and (max-width: 766px){
    .wedding-events-area {
        height: 623px;
    }
}
  @media only screen and (min-width: 480px) and (max-width: 766px){
      /*Bride and Groom CSS*/
      .bride-groom-box {
          margin-bottom: 30px;
          padding-bottom: 30px;
          border-bottom: 1px solid #dddddd;
      }
      .bride-groom-content h3 {
          font-size: 30px;
          margin-top: 30px;
      }
      /*Love Story Area CSS*/
      .story-divider-img{
          display: none;
      }
      .story-photo-box.show-large-device{
          display: none;
      }
      .show-mobile-device{
          display: block;
      }
      .story-box.story-right .story-text {
          padding-top: 70px;
      }

      /*Gallery Area CSS*/
      .gallery-filter-btn label {
          margin: 0 3px;
          padding: 2px 7px;
      }
      .story-content-wrap figcaption a, .gallery-box figcaption a {
          margin: 11px;
      }
      /*Friend Area CSS*/
      .friend-photo-box figcaption a::after {
          margin: 22px;
          width: 89%;
          height: 89%;
      }
      /*Friend Says Area CSS*/
      .friend-says-img {
          height: 130px;
          width: 130px;
      }
      .friends_slide_nav > .testi_prev, .friends_slide_nav > .testi_next {
          top: 39%;
      }

      /*Footer Area*/
      .footer-widget, .footer-widget.quick-links {
          border-top: 1px solid #2f414a;
          margin-top: 30px;
      }
      .footer-widget > h4, .footer-widget.quick-links > h4 {
          margin-top: 30px;
          margin-bottom: 30px;
      }
      .footer-widget.footer-gallery ul li a img{
          padding-right: 10px;
      }
      .footer-widget ul li:nth-child(2n+1) a {
          padding-right: 0;
      }
      .footer-social a, .friend-social a {
          width: 26px;
          height: 26px;
          margin-left: 2px;
      }
      /*Blog Page Area*/
      .blog-page-area .card-body {
          padding: 22px 8px 22px 8px;
      }
      .blog-page-area .card-footer .author-box a > span {
          padding-left: 5px;
      }
      .blog-page-area a .card-title {
          font-size: 15px;
      }
      /*Single Blog Page Area*/
      #content .card-footer-box div {
          margin-right: 18px;
      }
      .blog-page-area a .card-title {
          min-height: 51px;
          margin-bottom: 0;
      }
      .leave-comment-area > h2 {
          margin: 10px 0 20px;
      }
      .leave-comment-area .form-group {
          margin-bottom: 16px;
      }
      .google-map {
          padding-top: 20px;
      }
      .lovable-memories-area {
          padding: 50px 0 1px;
      }

  }

@media only screen and (max-width:480px){
    .wedding-events-area {
        height: 846px;
    }
}

/*=========================================
        For very little mobile
=========================================*/
  @media only screen and (min-width:300px) and (max-width:479px){
    /*Header Area*/
      .header-caption-heading {
          font-size: 48px;
          line-height: 50px;
      }
      h3.section-subheading {
          width: 90%;
      }
      .hero-content-wrap.zoom-burns-background {
          height: 106vh;
      }
      /*Bride And Groom CSS*/
       .bride-groom-box{
           margin-bottom: 45px;
        }
      .bride-groom-content h3 {
          margin-top: 14px;
      }
      .bride-groom-area {
          padding: 50px 0 0;
      }

      #content h4.author-name {
          margin-bottom: 8px;
      }
      .leave-comment-area > h2 {
          margin: 10px 0 20px;
      }
      .leave-comment-area .form-group {
          margin-bottom: 16px;
      }
      /*Love Story Area CSS*/
      .love-story-area .col-2.col-sm-2.col-md-2.col-lg-2{
          /*display: none;*/
      }
      .story-photo-box.show-large-device{
          display: none;
      }
      .show-mobile-device{
          display: block;
      }
      .story-divider-img{
          display: none;
      }
      .story-box.story-right .story-text {
          padding-top: 26px;
      }
      .story-box.story-left .story-text {
          padding-top: 26px;
      }
      .story-box.story-right .story-text {
          padding-bottom: 26px;
          padding-top: 26px;
      }
      .love-story-area {
          padding: 50px 0 20px;
      }
      /*Footer Area*/
      .footer-widget, .footer-widget.quick-links {
          border-top: 1px solid #2f414a;
          margin-top: 30px;
      }
      .footer-widget > h4, .footer-widget.quick-links > h4 {
          margin-top: 30px;
          margin-bottom: 30px;
      }
      .footer-widget.footer-gallery ul li {
          justify-content: left;
      }
      .footer-bottom-part {
          align-items: center;
      }
      .copyright {
          width: 60%;
      }
      .footer-social {
          width: 40%;
          text-align: right;
      }
      /*About Us Page Area*/

      /*Blog Page Area*/
      .blog-page-area .card-footer .author-box a > span {
          padding-left: 6px;
      }
      .blog-page-area nav .page-link {
          font-size: 14px;
          height: 25px;
          width: 25px;
          padding: 5px;
          line-height: 8px;
      }
      .blog-page-area nav .page-link.active {
           font-size: 14px;
      }
      .blog-page-area nav {
          margin-top: 5px;
      }
      /*Contact Us Page Area*/
      .address-box {
          width: 100%;
      }
      /*Single Blog Page Area*/
      .blog-page-area #content .block-1 .card-footer-box {
          flex-direction: column;
          width: 100%;
      }
      #content .card-footer-box div {
          margin-right: 0;
          margin-bottom: 10px;
      }
      .blog-content-media img {
          width: 100%;
      }
      #content blockquote {
          padding: 24px 13px 25px 26px;
      }
      #content .share-article {
          padding: 20px 0;
          flex-direction: column;
      }
      #content .share-box {
          margin-bottom: 20px;
      }
      #content .author-details p {
          font-size: 15px;
      }
      .author-img img {
          height: 53px;
      }
      #content .author-details {
          padding-left: 12px;
      }
      .author-details div.d-flex {
          flex-direction: column !important;
          align-items: start !important;
      }
      .btn.section-button {
          padding: 10px 33px 10px;
          font-size: 14px;
      }
      .friends_slide_nav > .testi_next {
          right: 0;
      }
      .friends_slide_nav > .testi_prev {
          left: 0;
      }
      .friends_slide_nav > .testi_prev, .friends_slide_nav > .testi_next {
          top: 38%;
          height: 45px;
          width: 45px;
      }
      h1.page-banner-heading {
          font-size: 42px;
      }
      .wedding-events-area {
          height: 728px;
      }
      #content .card-title {
          font-size: 24px;
      }
      /*Gallery Area CSS*/
      .gallery-filter-btn label {
          margin: 0 2px;
      }
      #mainNav .navbar-nav .nav-item .nav-link::after, .gallery-filter-btn label::after {
          bottom: 0;
      }
      .gallery-filter-btn label {
          font-size: 13px;
          padding: 9px 3px;
      }
      .footer-social a {
          width: 24px;
          height: 24px;
          line-height: 20px;
          font-size: 12px;
      }
      .locations-page-area {
          padding: 50px 0 50px;
      }
      .locations-page-area .address-box {
          padding: 25px;
      }
      #sidebar.sidebar.wedding-widget-area {
          margin-top: 33px;
          padding-top: 33px;
      }
      .our-gallery-area.masonary-gallery-area, .our-gallery-area.classic-gallery-area {
          padding: 50px 0 20px;
      }
      .our-gallery-area .mb-5, .our-gallery-area.masonary-gallery-area .mb-5 , .our-gallery-area.classic-gallery-area .mb-5{
          margin-bottom: 25px !important;
      }
      .rsvp-area.rsvp-page-area {
          padding: 50px 0 44px;
      }
      .footer-upper-area {
          padding: 52px 0 56px;
      }
      .single-friend {
          margin-bottom: 10px;
      }
      .not-found-content {
          width: 250px;
          height: 250px;
      }
      .google-map {
          padding-top: 15px;
      }
      .lovable-memories-area {
          padding: 50px 0 1px;
      }
      .lovable-poster-box a {
          width: 40px;
          height: 40px;
      }
      .lovable-poster-box a .flaticon-play-button::before {
          font-size: 15px;
      }
  }
  /*-------------------------------------------
        24. Responsive Design End
  -------------------------------------------*/