/*------------------------------------------------------------------
[Table of contents]
1. Reset
2. Global
3. Button
4. Header
5. Main Container
	5.1 About Couple
	5.2 Story
	5.3 Gallery
	5.3 Event
	5.3 RSVP
	5.3 Thanks
-------------------------------------------------------------------*/
/* =================reset css starts here================= */
* { margin:0; padding:0; }
h1, h2, h3, h4, h5, h6, p, ul, li, body, html, form, fieldset { margin:0; padding:0; outline:none; border:0 }
form, fieldset { width:100% }
img { border:0; }
a { text-decoration:none; border:0; outline:0; }
.clear { clear:both; width:auto !important }
ul { list-style:none; }
a:focus, input:focus, textarea:focus, *:focus { outline:0 !important; box-shadow:none !important; }
.nobg { background:transparent !important; }
/* =================reset css ends here================= */
/* =================global css starts here================= */
html, body{height:100%;}
body { font-size:16px; line-height:22px; font-weight:400; font-family:'Josefin Sans'; color:#000; background:#fff; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; padding-left:400px; }
.container { width:100%; max-width:1200px; }
a, input, button { text-decoration:none; color: inherit; outline:none; transition: all 0.3s ease-in; -moz-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; -webkit-transition: all 0.3s ease-in; -ms-transition: all 0.3s ease-in; }
a img { border: 0px none; }
a{color:#f35a81;}
a:hover { outline: none; color:#000; text-decoration: none; }
a:active { outline: none; text-decoration: none; }
a:focus { outline: none; outline-offset: 0px; text-decoration: none; color:inherit; }
::-webkit-input-placeholder{color:#999 !important; opacity: 1;}
::-moz-placeholder{color:#999 !important; opacity: 1;}
:-moz-placeholder{color:#999 !important; opacity: 1;}
:-ms-input-placeholder{color:#999 !important; opacity: 1;}
img { max-width: 100%; }
h1, h2, h3, h4, h5, h6 { margin:0px; padding:0px; margin-bottom:10px; line-height:100%; font-weight:400; font-family: 'Lovers Quarrel'; color:#f35a81;}
h1 { font-size: 66px;}
h2 { font-size: 48px;}
h3 { font-size: 42px;}
h4 { font-size: 36px; }
h5 { font-size: 32px; }
h6 { font-size: 26px; }
p { margin:0px; padding:0px; margin-bottom:15px; }
b { font-weight:600; }
strong { font-weight:700; }
p:last-child { margin-bottom:0; }
.large-para { font-size:24px; line-height:34px; color:#666; font-weight:600; margin-bottom:25px !important }
.mar-40 { margin-bottom:40px !important; }
.mar-30 { margin-bottom:30px !important; }
.no-mar { margin:0 !important; }
.os-animation{opacity: 0;}
.os-animation.animated{opacity: 1;}
/* =================global css ends here================= */
/* =================button css starts here================= */
.btn, .btn:focus, .btn:active { font-weight: 400 !important; padding: 8px 30px; font-size: 36px; line-height:100%; box-shadow:none; display: inline-block; vertical-align: top; box-shadow: 0 1px 0px rgba(0,0,0,0.15) !important;  font-weight:400; font-family: 'Lovers Quarrel'; text-transform:lowercase;}
.btn-default { color: #fff; background-color:#f35a81; border:0; }
.btn-default:hover, .btn-default:focus, .btn-default:active { color: #fff; background-color:#f35a81; box-shadow: 0 3px 3px rgba(0,0,0,0.15) !important; }
.btn.btn-lg { padding:18px 40px !important; }
.btn + .btn { margin-left:10px; }
/* =================button css ends here================= */
/* =================Header starts here================= */
header{width:400px;float:left;height:100%;position:fixed;left:0;top:0;bottom:0;z-index:99;background: #0f1a26 url(../images/hero-image.jpg) no-repeat center center;background-size:cover; box-shadow: 5px 0 3px 0 rgba(0, 0, 0, 0.15); text-align:center;}
header h1{  margin:0; }
header h2{color:#fff;  margin:0;}
.header-upper{width:100%; display:inline-block; vertical-align:top; padding:25px;}
.header-upper span{display:block; text-transform:uppercase; letter-spacing:5px; color:rgba(255,255,255,0.4); font-size:10px; font-weight:700;}
.header-lower{ padding:15px; position:absolute; left:0; bottom:0px; width:100%; float:left;  background:#f35a81; text-align:center; color:rgba(0,0,0,0.5);}
.header-lower:before{content:'';width:0;height:0;float:left;border-bottom: solid 120px #f35a81;border-left: solid 600px transparent;border-right: solid 0px transparent;position:absolute;right: 0;top: -80px;z-index: 9;}
.header-lower:after{content:'';width:0;height:0;float:left;border-bottom: solid 86px rgba(0,0,0,0.4);border-left: solid 600px transparent;border-right: solid 0px transparent;position:absolute;right: 0;top: -82px;z-index: 8;}
.header-content{position:relative;z-index: 10;}
header h2{margin:0; }
.header-lower em{display:block; text-transform:uppercase; letter-spacing:5px; color:rgba(0,0,0,0.4); font-size:13px; font-weight:700; }
.header-lower span{color:#fff; margin:0; font-family: 'Lovers Quarrel'; font-weight:400; line-height:100%; font-size:40px; line-height:40px; display:inline-block; padding:10px;}
.header-lower b{font-weight:700 !important; display:block; text-transform:uppercase; letter-spacing:5px; color:rgba(0,0,0,0.4); font-size:10px; line-height:12px; font-family: 'Josefin Sans';}
/* =================Header ends here================= */
/* =================Main container starts here================= */
.main-container { width:100%; float:left; height:100%;  }
.content-container { width:100%; display:inline-block; vertical-align:top; padding:50px 40px; position:relative; overflow:hidden; background:#fff8e8; box-shadow:0 0 10px rgba(0,0,0,0.07); }
.content-container.bg{background:#f0fdff;}
.content-title{text-align:center;font-size:60px;line-height:100%;color:#f35a81;transform: rotate(-10deg);}
.partition{margin:15px 0;text-align:center;position:relative;overflow:hidden;clear: both;display: inline-block;width: 100%;transform: rotate(-10deg);}
.partition:before{content:'';width: 50px;height:1px;float:left;position:absolute;top:11px;right:Calc(50% + 30px);background:rgba(0,0,0,0.1);}
.partition:after{content:'';width: 50px;height:1px;float:left;position:absolute;top:11px;left:Calc(50% + 30px);background:rgba(0,0,0,0.1);}
.partition span{display:inline-block;position:relative;z-index:99;padding:0 10px;color:#f35a81;font-size:20px;transform: rotate(10deg);}
/*couple section start*/
.couple-box{width:100%;display:inline-block;vertical-align:top;margin:0px 0 40px;text-align:center; position:relative;}
.couple-image{display:inline-block; vertical-align:top; border-radius:50%; overflow:hidden; width:180px;height:180px; box-shadow: 0 5px 5px 0 rgba(0, 0, 0, 0.15);border-radius: 50%; margin-bottom:20px;}
.couple-detail{width:100%; display:inline-block; vertical-align:top; padding:0 20px;}
.couple-detail h3{color:#f35a81; margin:0;}
.couple-detail h4{margin:0; font-family: 'Josefin Sans'; color:#000;  font-size:16px; font-weight:700; }
.couple-image{}
.social-links{width:100%; display:inline-block; vertical-align:top;}
.social-links a{display:inline-block; width:32px; height:32px; border:solid 1px #f35a81; margin:5px; line-height:33px; text-align:center; border-radius:50%; position:relative; font-size:13px;}
.social-links a:hover{color:#fff; background:#f35a81; }
.social-links a:before{content:''; width:0; height:0; float:left; border-radius:50%; border:solid 1px #f35a81; position:absolute; left:50%; top:50%; transition: all 0.2s ease-in; -moz-transition: all 0.2s ease-in; -o-transition: all 0.2s ease-in; -webkit-transition: all 0.2s ease-in; -ms-transition: all 0.2s ease-in; opacity:0;}
.social-links a:hover:before{width:36px; height:36px; left:-3px; top:-3px; opacity:1;}
/*couple section start*/
/*story section start*/
ul.story-list{width:100%;display:inline-block;position:relative;margin-top:25px;}
ul.story-list:before{content:'';width:1px;height:100%;position:absolute;top:0;left:50%;border-left: dotted 1px #f35a81;;}
ul.story-list li{width:100%; float:left;  position:relative; margin-bottom:110px;}
ul.story-list li:last-child{background:#fff8e8; margin:0; padding:40px;}
ul.story-list li:last-child .story-image{margin:0 25%;}
ul.story-list li:last-child .story-box{width:100%; text-align:center; padding-top:30px;}
ul.story-list li:last-child .story-icon:before{display:none;}
.story-icon{width:32px; height:32px;float:left;border-radius:50%;position:absolute;top: -10px;left:50%;margin-left: -16px;border: dotted 1px #f35a81;background:#fff8e8;text-align: center;line-height: 34px; font-size:16px; color: #f35a81;}
.story-image{width:50%;float:left;padding: 0px 30px;position:relative;margin-top: 0px;}
.story-image img{box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.35); border-radius: 5px;}
.story-box{width:50%; float:right; padding:0 30px; margin-top:-10px;}
.story-box h4{text-transform:lowercase;}
ul.story-list li:nth-child(even) .story-image{float:right;}
ul.story-list li:nth-child(even) .story-box{text-align:right;}
ul.story-list li:nth-child(even) .story-image:before{right:auto; left:0;}
ul.story-list li:nth-child(even) .story-image:after{right:auto; left:-6px;}
/*story section end*/
/*gallery section start*/
.gallery-container{width:100%; display:inline-block; vertical-align:top; margin-bottom:20px;}
.grid-sizer, .grid-item {width: 16.66%; }
.gutter-sizer { width: 1%; }
.grid-item {float: left; padding:3px;}
.box-item a{float:left; position:relative;}
.box-item a:hover:before{opacity:1;}
.box-item {float:left; width:100%; position:relative; overflow:hidden;}
.box-item a:before{content:''; position:absolute; left:0; top:0; right:0; bottom:0; background:rgba(0,0,0,0.4); z-index:9; opacity:0;  transition: all 0.3s ease-in; -moz-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; -webkit-transition: all 0.3s ease-in; -ms-transition: all 0.3s ease-in;}
.grid-item:hover a:before{opacity:1;}
.box-item a:after {content:"\eb3d"; font-family:'Icofont'; position:absolute; top:50%; opacity:0; z-index:10; left:50%; width:30px; height:30px; line-height:30px; margin:-15px 0 0 -15px; color:#fff; font-size:24px; -webkit-transform: scale(0.4); -moz-transform: scale(0.4); -o-transform: scale(0.4);-ms-transform: scale(0.4); transform: scale(0.4); -webkit-transition: all 200ms linear; -moz-transition: all 200ms linear; -o-transition: all 200ms linear;  -ms-transition: all 200ms linear; transition: all 200ms linear; -webkit-transition-delay: 0.3s; -o-transition-delay: 0.3s; -moz-transition-delay: 0.3s; transition-delay: 0.3s;}
.grid-item:hover a:after{ -webkit-transform: scale(1); -moz-transform: scale(1); -o-transform: scale(1); -ms-transform: scale(1); transform: scale(1); opacity:1;-webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg);}
.grid-item img {width:100%; position:relative; z-index:1; -webkit-transition: all 2000ms cubic-bezier(.19,1,.22,1) 0ms; -moz-transition: all 2000ms cubic-bezier(.19,1,.22,1) 0ms; transition: all 2000ms cubic-bezier(.19,1,.22,1) 0ms;}
.grid-item:hover img{-webkit-transform: scale(1.15); -moz-transform:scale(1.15); transform: scale(1.15);}
/*gallery section start*/
/*event section start*/
.event-box{width:100%;display:inline-block; margin-bottom:30px; text-align:center;}
.event-box-upper{width:100%; float:left;}
.event-box-upper img{width:180px;border-radius:50%; box-shadow:0 5px 5px 0 rgba(0, 0, 0, 0.15); margin-bottom:30px;}
.event-box-lower{ width:100%; float:left;}
/*event section end*/
/*RSVP section start*/
.form-group{margin-bottom:20px;}
.form-control{border:0;height: 54px;color:#666;font-size: 30px;background: #fff; box-shadow: 0 1px 0px rgba(0,0,0,0.1) !important;font-weight:400;font-family: 'Lovers Quarrel';text-transform:lowercase;text-indent: 10px;}
.form-control:focus{box-shadow: 0 1px 0px rgba(0,0,0,0.1) !important;}
select{-webkit-appearance:none;}
textarea.form-control{resize:none; height:120px !important;line-height:100%;}
label.error{font-weight:700; font-size:14px; color:#f35a81;}
.result .btn{display:none;}
#success, #error {display: none;}
#success h6, #error h6{margin-bottom:0;}
.loading{display:inline-block; vertical-align:middle; margin:15px;}
.loading img{width:16px;}
/*RSVP section end*/
/*Thanks section start*/
.thanks-container{background:#000 url(../images/thanks-img.jpg) no-repeat center center; background-size:cover; width:100%; height:100%; display:table; text-align:center; }
.thanks-content{display:table-cell; vertical-align:middle; background:rgba(0,0,0,0.7);}
.thanks-box{display:inline-block; transform: rotate(-10deg); margin-bottom:30px;}
.thanks-box h3{color:#fff; font-size:80px; line-height:100%; margin:0;}
.thanks-box h4{color:#fff; font-size:50px; line-height:100%; margin:0; color:#f35a81;}
.go-top, .go-top:focus{width:32px; height:32px; border:solid 1px #fff; line-height:33px; text-align:center; border-radius:50%;  font-size:22px; color:#fff; position:relative; display:block; margin:0 auto;}
.go-top:hover{color:#fff; background:#f35a81;  border-color:#f35a81;}
.go-top:before{content:''; width:0; height:0; float:left; border-radius:50%; border:solid 1px #f35a81; position:absolute; left:50%; top:50%; transition: all 0.2s ease-in; -moz-transition: all 0.2s ease-in; -o-transition: all 0.2s ease-in; -webkit-transition: all 0.2s ease-in; -ms-transition: all 0.2s ease-in; opacity:0;}
.go-top:hover:before{width:36px; height:36px; left:-3px; top:-3px; opacity:1;}
/*Thanks section end*/
/* =================Main container end here================= */
 
/* ============================= */
/* ! Layout for ipad lanscape */
/* ============================= */
@media only screen and (max-width: 1050px) {
body{padding-left:340px;}
header{width:340px;}
h1 { font-size: 60px;}
h2 { font-size: 42px;}
h3 { font-size: 38px;}
h4 { font-size: 34px; }
h5 { font-size: 30px; }
h6 { font-size: 24px; }
.header-upper{padding:25px 15px;}
.header-lower span{ font-size:30px; line-height:30px; padding:7px;}
.header-lower b{letter-spacing:3px;}
.header-lower{padding:15px 10px;}
.content-container{padding:50px 15px;}
.content-title{font-size:48px;}
}
/*============================= 
! Layout for ipad portrait  
============================= */
@media screen and (max-width: 992px) {
	body{padding:0;}
	header{width:100%; position:relative;}
	 .header-lower:before{border-left-width:1600px; top:-74px;}
	 .header-lower:after{border-left-width:1600px; top:-78px;}
}


/* ============================= */
/* ! Layout for mobile(lanscape) version   */
/* ============================= */
@media screen and (max-width: 767px) {
.header-lower:before{ top:-50px;}
.header-lower:after{ top:-56px;}
ul.story-list{width:100%; margin:0;}
ul.story-list li{text-align:center; padding:0 !important; padding-top:50px !important; margin-bottom:60px;}
.story-image{float:none !important; margin-bottom:30px; display:inline-block; width:100%; max-width:400px;padding:0;}
.story-image .simple-slider{margin-bottom:0;}
.story-box{width:100%; text-align:center !important; padding: 10px; background: #fff8e8;}
ul.story-list li:last-child .story-image{margin:0;}
.grid-sizer, .grid-item{width:20%;}
.content-container{padding:50px 0px;}
}


/* ============================= */
/* ! Layout for mobile(portrait) version   */
/* ============================= */

@media screen and (max-width: 479px) {
	 .header-lower:before{ top:-40px;}
	 .header-lower:after{ top:-46px;}
	 .grid-sizer, .grid-item{width:33.3%;}
	 .thanks-box h3{font-size:50px;}
	  .thanks-box h4{font-size:36px;}
}