
/*----------------------------------------------------------------

// Table of contents //

  - General
  - Banner
  - Nav
  - Wedding Block
  - Family Info 
  - Wedding Event
  - Our Story
  - Attending Info
  - Galler View
  - Location Info
  - Gift View
  - footer section
  - Mobile Responsive styles

------------------------------------------------------------------*/

/*---------------------------------------
   General              
-----------------------------------------*/

img {max-width:100%; }
section {padding:66px 0 0 0;}
.title-main {display:block; text-align:center; }
.title-main h2 {margin:0 0 22px 0;}
.title-main p {line-height:30px; font-size:18px; color:#666666; font-weight:500; margin:0px; }
.title-main .headin-img {display:block; text-align:center; padding:27px 0 0 0;}
::-webkit-input-placeholder {opacity:1;}
::-moz-placeholder {opacity:1;}
:-ms-input-placeholder {opacity:1;}
:-moz-placeholder {opacity:1;}

/*---------------------------------------
   Banner              
-----------------------------------------*/

.banner {background-size:cover; background-position:left top; width:100%; background-repeat:no-repeat; position:relative; height:800px; }
.banner .banner-text {position:absolute; bottom:50px; right:46px; width:700px; min-height:700px; background:url(../images/banner-textBg.png) no-repeat top left; text-align:center; background-size:100% auto;}
.banner .logo {position:absolute; top:50px; left:50px;}
.banner .banner-text .title {display:block; padding:172px 0 0 0; }
.banner .banner-text .title h1 {display:inline-block; width:100%; max-width:456px; line-height:60px; font-size:70px; color:#d81b60; margin:0px; font-weight:normal;}
.banner .banner-text .title h1 span {display:block; line-height:52px; }
.banner .banner-text .line {display:block; text-align:center; padding:16px 0 14px 0;}
.banner .banner-text .date {display:block; text-align:center; line-height:50px; font-size:36px; color:#000000; font-family: 'Redressed', cursive;}
.banner .banner-text .statest {display:block; line-height:32px; padding:17px 0 0 0; font-size:24px; color:#000000; font-weight:500; }

/*---------------------------------------
   Nav              
-----------------------------------------*/

#nav-main {
    background: #2469a5;
    padding: 22px 0 17px 0;
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    z-index: 9999;
}
#nav-main.fiexd {position:fixed; }
#nav-main ul li a .fa {padding:0 0 0 14px; font-size:14px;}
#nav-main ul li.active a .fa {color:#fff;}
#nav-main ul li a:hover .fa {color:#fff;}
#nav-main ul li:last-child .fa {display:none;}

/*---------------------------------------
   Wedding Block              
-----------------------------------------*/

.wedding-block {padding-bottom:80px; position:relative; padding-top:144px; }
.wedding-block .title-main {padding-bottom:70px;}
.wedding-block .wedding-box {display:block; width:100%; text-align:center; }
.wedding-block .wedding-box .img {width:100%; max-width:370px; border-radius:10px; overflow:hidden; display:inline-block;}
.wedding-block .wedding-box .name {display:block; text-align:center; line-height:44px; padding:54px 0 20px 0; font-size:30px; color:#000000; font-weight:bold; letter-spacing:1px; }
.wedding-block .wedding-box p {display:block; text-align:center; line-height:30px; font-size:18px; color:#666666; margin:0px; }
.wedding-block .wedding-box .social-share {display:block; padding:20px 0 0 0; text-align:center;}
.wedding-block .wedding-box .social-share ul {padding:0px; margin:0px; display:inline-block; width:auto; }
.wedding-block .wedding-box .social-share ul li {list-style:none; padding:0 5px; float:left; }
.wedding-block .wedding-box .social-share ul li a {width:36px; height:36px; background:#efefef; border-radius:50%; display:block;text-decoration:none;color:#d81b60;}
.wedding-block .wedding-box .social-share ul li a:hover {background:#d81b60; color:#fff}
.wedding-block .wedding-box .social-share ul li a .fa {display:block; text-align:center; line-height:36px;  font-size:16px; }
.wedding-block .wedding-member {position:relative; }
.wedding-member #countdowncont {position:absolute; top:0px; left:50%; margin-left:-44px; }
.wedding-member #countdowncont ul {padding:0px; margin:0px; float:left; position:relative; }
.wedding-member #countdowncont ul:after {position:absolute; top:0px; left:50%; margin-left:-2px; width:4px; background:#d81b60; content:""; height:100%;}
.wedding-member #countdowncont ul li {list-style:none; width:88px; padding:9px 0 18px 0; text-align:center; margin-bottom:22px; background:#d81b60; border-radius:5px; position:relative; z-index:2;}
.wedding-member #countdowncont ul li:last-child {margin:0px; }
.wedding-member #countdowncont ul li span {display:block; line-height:34px; font-size:30px; color:#ffffff; text-align:center; font-family: 'Redressed', cursive; padding-bottom:7px; }
.wedding-member #countdowncont ul li p {display:block; line-height:20px; font-size:14px; color:#ffffff; font-weight:500; margin:0px; text-transform:uppercase; }

/*---------------------------------------
   Family Info              
-----------------------------------------*/

.family-info {display:block; padding:0px;  }
.family-info .main-member {background-size:cover; background-position:50% 50%; background-attachment:fixed; background-repeat:no-repeat; padding:110px 0 104px 0; position:relative;}
.family-info .main-member:after {position:absolute; top:0px; left:0px; width:100%; height:100%; background:rgba(0,0,0,0.5); content:"";}
.family-info .main-member .container {position:relative; z-index:2; }
.family-info .main-member h2 {display:block; line-height:86px; text-align:center; color:#fff; padding-bottom:18px; }
.family-info .main-member span {display:block; text-align:center; line-height:32px; font-size:18px; font-weight:600; color:#ffffff; }
.family-info .family-view {padding-bottom:70px; }
.family-info .family-view .family-box {display:block; padding:60px 0 16px 0; text-align:center; }
.family-info .family-view .family-box .img {width:100%; max-width:370px; border:solid 5px #e5e5e5; border-radius:50%; overflow:hidden; display:inline-block;}
.family-info .family-view .family-box .name {display:block; text-align:center; padding:28px 0 0 0; font-size:18px; color:#000000; font-weight:600; line-height:30px;}
.family-info .family-view .family-box p {display:block; text-align:center; font-size:18px; color:#666666; line-height:30px; margin:0px; }
.family-info .family-view .family-box.small .img {max-width:234px;}
.family-info .family-view .family-box.small .name {padding:33px 0 0 0;}

/*---------------------------------------
   Wedding Event              
-----------------------------------------*/

.wedding-event {
    background: #2469a5;
    padding-bottom: 40px;
}
.wedding-event .title-main {padding-bottom:67px;}
.wedding-event .title-main h2 {color:#fff; }
.wedding-event .title-main p {color:#fff; }
.wedding-event .event-img {width:100%; max-width:637px; position:relative; }
.wedding-event .event-img .heart-img {position:absolute; top:0px; left:0px; width:100%; }
.wedding-event .event-info {display:block; }
.wedding-event .event-info h3 {display:block; line-height:42px; font-size:30px; color:#ffffff; font-weight:500; padding:20px 0 16px 0; font-family: "Raleway",sans-serif; margin:0px; background:url(../images/event-lineBg.png) repeat-x bottom left; cursor:pointer; }
.wedding-event .event-info h3 .icon {float:right; width:23px; height:42px; background:url(../images/plush-icon.png) no-repeat left center; }
.wedding-event .event-info .info-slide {display:block; padding:10px 0 13px 0; }
    .wedding-event .event-info .info-slide .info-box {
        display: inline-block;
        padding: 0 27px 0 0;
        line-height: 34px;
        font-size: 14px;
        font-weight: 500;
        color: #dcce22;
    }
.wedding-event .event-info .info-slide .info-box .fa {padding:0 10px 0 0; font-size:16px; }
.wedding-event .event-info p {font-size:14px; color:#fff; line-height:24px; margin:0 0 30px 0;}
.wedding-event .event-info .img {display:block; padding-bottom:7px;}
.wedding-event .event-content {display:none;}
.wedding-event .event-slide:first-child .event-content {display:block;}
.wedding-event .event-slide.active h3 .icon {background:url(../images/minus-icon.png) no-repeat left center; }

/*---------------------------------------
   Our Story              
-----------------------------------------*/

.our-story {padding-bottom:80px;}
.our-story .title-main {padding-bottom:67px; }
.our-story .story-tree {position:relative; padding:50px 0; width:100%; display:inline-block; }
.our-story .story-tree:after {position:absolute; top:0px; left:50%; height:100%; background:#d91a61; width:2px; margin-left:-1px; content:""; } 
.our-story .story-tree .story-box:first-child {margin-top:0px;}
.our-story .story-tree .story-box {width:44.10%; float:left; background:#efefef; position:relative; margin-top:-40px; }
.our-story .story-tree .story-box:after {border-top: 12px solid transparent;border-bottom: 12px solid transparent; border-left: 12px solid #efefef; position:absolute; top:16px; right:-12px; content:""; }
.our-story .story-tree .story-box:before {position:absolute; top:11px; right:-87px; width:34px; height:34px; background:url(../images/round-img.png) no-repeat top left; content:""; z-index:2;}
.our-story .story-tree .story-box .story {padding:12px 22px 18px 46.31%; }
.our-story .story-tree .story-box .img {position:absolute; top:0px; width:42.63%; height:100%; background-size:cover; background-position:50% 50%; background-repeat:no-repeat; }
.our-story .story-tree .story-box .story-title  {display:block; line-height:26px; font-size:18px; color:#252222; font-weight:500; padding-bottom:8px; }
.our-story .story-tree .story-box .story-date {display:block; line-height:30px; font-size:14px; color:#252222; font-weight:500; padding-bottom:6px; }
.our-story .story-tree .story-box .story-date .fa {padding:0 10px 0 0; color:#d91a61; font-size:18px; }
.our-story .story-tree .story-box p {display:block; line-height:24px; color:#666666; margin:0px; font-size:14px; }
.our-story .story-tree .story-box.right {margin-left:30%; float:right; }
.our-story .story-tree .story-box.right .img {left:auto; right:0px; }
.our-story .story-tree .story-box.right .story {padding:12px 46.31% 18px 22px; }
.our-story .story-tree .story-box.right:after { border-right: 12px solid #efefef;  border-left:none; right:auto; left:-12px; }
.our-story .story-tree .story-box.right:before { left:-86px; right:auto}

/*---------------------------------------
   Attending Info              
-----------------------------------------*/

.attending-info {background-size:cover; background-position:50% 50%; background-repeat:no-repeat; position:relative; padding-bottom:80px; background-attachment:fixed;}
.attending-info:after {position:absolute; top:0px; left:0px; width:100%; height:100%; background:rgba(0,0,0,0.7); content:""; }
.attending-info .container {z-index:3; position:relative; }
.attending-info .title-main {padding-bottom:70px;}
.attending-info .title-main h2,
.attending-info .title-main p {color:#fff;}
.attending-info .input-box {position:relative; padding-bottom:30px; }
.attending-info .input-box .icon {position:absolute; top:0px; left:0px; width:42px; }
.attending-info .select-box .icon {position:absolute; top:0px; left:0px; width:42px; z-index:9;}
.attending-info .input-box input {width:100%; border:none; background:#fff; border-radius:10px; height:60px; line-height:26px; padding:12px 20px 12px 43px; font-size:18px; color:#333333; }
.attending-info .form-error {font-weight:500; color:#f00; font-size:15px; margin:0px; line-height:30px; }
.attending-info .select-box {padding-bottom:30px; position:relative; }
.attending-info .input-box textarea {width:100%; border:none; background:#fff; border-radius:10px; height:120px; line-height:26px; padding:12px 20px 12px 43px; font-size:18px; color:#333333; resize:none; }
.attending-info .input-box.textarea .icon {top:11px; left:15px; }
.attending-info .submit-slide {display:block; width:100%; text-align:center;}
.attending-info .submit-slide .submit-btn {display:inline-block; width:100%; max-width:230px; position:relative; }
.attending-info .submit-slide .submit-btn .icon {position:absolute; top:17px; left:30px; }
.attending-info .submit-slide .submit-btn .icon .fa {color:#fff; font-size:20px; }
.attending-info .submit-slide .submit-btn input {background:#d81b60; border-radius:10px; height:60px; border:none; font-size:18px; color:#ffffff; font-weight:500; text-align:center; width:100%; padding:0 0 0 20px;}
.attending-info .submit-slide .submit-btn input:focus {outline:none; border:none; }

/*---------------------------------------
   Galler View              
-----------------------------------------*/

.galler-view  {padding-bottom:50px;}
.galler-view .title-main {padding-bottom:70px; }
.galler-view .galler-box {margin-bottom:30px; width:100%; overflow:hidden; }
.galler-view .galler-box img {width:100%; -moz-transform:scale(1.2); -ms-transform:scale(1.2); -o-transform:scale(1.2); -webkit-transform:scale(1.2); transform:scale(1.2); -moz-transition:all 1s ease-in-out 0s; -ms-transition:all 1s ease-in-out 0s; -o-transition:all 1s ease-in-out 0s; -webkit-transition:all 1s ease-in-out 0s; transition:all 1s ease-in-out 0s; }
.galler-view .galler-box:hover img { -moz-transform:scale(1); -ms-transform:scale(1); -o-transform:scale(1); -webkit-transform:scale(1); transform:scale(1);}


/*---------------------------------------
   Location Info              
-----------------------------------------*/

.location-info {padding:0px; background:#1f1d3f; display:inline-block; width:100%; position:relative; }
.location-info .map {float:right; width:50%; height:600px}

.location-info .loction-view {position:absolute; width:50%; left:0px; top:0px; height:100%; }
.location-info .loction-view .inner-view {position:absolute; top:50%; left:50%; -moz-transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); -o-transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); transform:translate(-50%,-50%); width:100%; max-width:567px; }
.location-info .title-main {padding-bottom:52px; }
.location-info .title-main h2,
.location-info .title-main p {color:#fff;}
.location-info .loction-view .info-slide {display:block; padding-bottom:14px; text-align:center;}
.location-info .loction-view .info-slide .info-box {display:inline-block; padding:0 25px 0 0;line-height:34px; font-size:14px; font-weight:500; color:#31aae9; }
.location-info .loction-view .info-slide .info-box .fa {padding:0 10px 0 0; font-size:16px; }
.location-info .loction-view p {font-size:14px; color:#f5f5f5; line-height:24px; margin:0; text-align:center;}

/*---------------------------------------
   Gift View              
-----------------------------------------*/

.gift-view {padding-bottom:75px; }
.gift-view .title-main {padding-bottom:90px;}
.gift-view .gift-logo {text-align:center; padding-bottom:20px; }

/*---------------------------------------
   Footer              
-----------------------------------------*/

#footer {
    background: #2469a5;
    padding: 54px 0 59px 0;
}
#footer .date {display:block; text-align:center; line-height:42px; font-size:36px; color:#ffffff; font-family: 'Redressed', cursive; }
#footer p {display:block; text-align:center; padding:23px 0 0 0; line-height:22px; font-size:24px; color:#ffffff; font-weight:500; margin:0px; }

/*---------------------------------------
   Mobile Responsive styles              
-----------------------------------------*/

@media (max-width: 1199px) {
.our-story .story-tree .story-box:before {right:-74px;}
.our-story .story-tree .story-box.right:before {left:-74px; }
.navbar-nav > li {padding:0 4px; }
.navbar-nav > li > a {font-size:17px; }

}

@media (max-width: 991px) {
#nav-main ul li a .fa {font-size:12px; padding:0 0 0 7px;}
.nav > li > a {font-size:16px; }
#nav-main ul li a .fa {display:none;}
.our-story .story-tree {padding-left:52px;}
.our-story .story-tree:after {left:10px; margin:0px; }
.our-story .story-tree .story-box:before {right:auto; left:-58px; }
.our-story .story-tree .story-box:after {left:-12px; right:auto; border-right:12px solid #efefef; border-left:none; }
.our-story .story-tree .story-box.right:before {left:-58px;}
.our-story .story-tree .story-box.right {margin:0px 0 20px 0; float:left; }
.our-story .story-tree .story-box {margin:0 0 20px 0; width:100%; }
.location-info .loction-view {position:static; width:100%;text-align:center; padding:20px 10px;}
.location-info .loction-view .inner-view {position:static; -moz-transform:translate(0,0); -ms-transform:translate(0,0); -o-transform:translate(0,0); -webkit-transform:translate(0,0); transform:translate(0,0);display:inline-block; }
.location-info .map {width:100%; }
.wedding-member #countdowncont ul li {margin-bottom:10px; padding-bottom:10px;}
.family-info .family-view .family-box.small .name {min-height:93px;}
}

@media (max-width: 767px) {
#nav-main {position:absolute !important; padding:10px 0; }
.nav > li {padding:5px 0 10px 0;background:url(../images/event-lineBg.png) repeat-x bottom left; }
.nav > li > a{ font-size:18px;}
.title-main h2 {font-size:45px; line-height:50px; }
.container {padding:0 20px; }
.banner .banner-text {width:440px; min-height:440px; right:20px; }
.banner .banner-text .title {padding:100px 0 0 0;}
.banner .banner-text .title h1 {font-size:40px; line-height:40px; }
.banner .banner-text .title h1 span {line-height:22px;}
.banner .banner-text .line img {max-width:50%; }
.banner .banner-text .date {font-size:26px; line-height:34px; }
.banner .banner-text .statest {font-size:16px; line-height:22px; padding:10px 0 0 0; }
.banner {height:590px; }
.wedding-member #countdowncont {position:static; margin:0px; width:100%; margin-bottom:30px; }
.wedding-member #countdowncont ul {float:none; margin-right:-2%; overflow:hidden;}
.wedding-member #countdowncont ul:after {width:95%; top:50%; left:0px; height:2px; margin:-1px 0 0 0;}
.wedding-member #countdowncont ul li {margin:0px; width:23%; margin:0 2% 0 0;float:left; }
.wedding-block .wedding-box .name {padding:20px 0 20px 0; }
.wedding-block .wedding-box {padding-bottom:20px;}
#nav-main ul li a .fa {display:inline-block;}
#nav-main ul li:last-child .fa {display:inline-block;}
.family-info .family-view .family-box.small .name {min-height:inherit;}
.banner .logo {top:20px; left:20px; }
}

@media (max-width: 479px) {
.banner {height:380px; }
.banner .banner-text {width:280px; min-height:280px; }
.banner .banner-text .title {padding:65px 0 0 0;}
.banner .banner-text .title h1 {font-size:30px; line-height:20px;}
.banner .banner-text .date {line-height:28px; font-size:20px; padding-top:10px; }
.banner .banner-text .line {padding:0}
.banner .banner-text .statest {font-size:14px; padding:0px; }
.wedding-member #countdowncont ul li span {font-size:26px;}
.wedding-member #countdowncont ul li p {font-size:12px; }
.our-story .story-tree .story-box .img {display:none; }
.our-story .story-tree .story-box .story {padding:12px 10px 18px 10px}
.our-story .story-tree .story-box.right .story {padding:12px 10px 18px 10px}
.wedding-block .wedding-box .name {font-size:26px; line-height:34px; }
section {padding:40px 0 0 0; }
.wedding-event {padding-bottom:0px;  }
.our-story {padding-bottom:40px; }
.galler-view {padding-bottom:10px; }
.gift-view .title-main{ padding-bottom:40px;}
.gift-view {padding-bottom:40px;}
.family-info .main-member h2 {font-size:50px; line-height:52px; }
}