@import url(bootstrap.min.css);
@import url(jquery.flexmenu.css);
@import url(flaticon.css);
@import url(bannerscollection_zoominout.css);
@import url(countdown.css);
@import url(owl.carousel.css);
@import url(animate.css);
@import url(jquery.fancybox.css);
@import url(font-awesome.min.css);
@import url(http://fonts.googleapis.com/css?family=Segoe+Script|Lato:400,700,400italic);

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

[Master Stylesheet]

Project:                The Big Date - Wedding HTML Template
Version:                1.0
Last change:            04/02/2015
Author:                 Coffeecream Themes
Assigned to:            Marcin Banaszek

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

[Color codes]

Body background:        #fff (white)
Brand color:            #bc2670 (green)
Text:                   #bbb (gray)
Header h1-h6:           #222 (dark gray)
Main nav background:    #fff (white)
Footer background:      #222 (dark gray)

a (standard):           #bc2670 (pink)
a (visited):            #bc2670 (pink)
a (active):             #bc2670 (pink)
a (hover):              #a0205f (darker pink)

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

[Table of contents]

1. Global Styles
2. Navbar
3. Slides
4. Couple
5. Countdown
6. People
7. Events
8. Blog
   8.1. Blog posts
   8.2. Image hover effect
   8.3. Widgets
	   8.3.1. Flickr Widget
	   8.3.2. Tags
	   8.3.3. Searchbox
	   8.3.4. Latest Posts
	   8.3.5. Latest Comments
   8.4. Blog comments
9. Gallery
10. Footer
11. Parallax
12. Guestbook
13. Registry
14. RSVP
15. Mobile Styles

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

/* 1. GLOBAL STYLES
-------------------------------------------------------------------*/

body {
	overflow-x: hidden;
}

h2,h3,h4,h5,h6 {
	margin: 1em 0;
	text-transform: uppercase;
}

h1 {
	color: #bc2670;
	font-family: 'Segoe Script', cursive;
	font-size: 60px;
	font-weight: normal;
	margin: 0 0 0.5em;
}

h3 {
	margin: 2em 0;
	padding-top: 1.5em;
}

h4,h5,h6 {
	font-family: "Segoe Script", Arial, sans-serif;
	font-weight: bold;
}

h6 {
	color: #bc2670;
}

hgroup {
	margin: 2em 0;
}

p {
	margin-bottom: 2em;
}

hr {
	margin: 40px 0;
}

.btn {
	font-weight: bold;
	letter-spacing: 0.2em;
	text-transform: uppercase;
}

	.btn.btn-default {
		background: none;
		border: 2px solid #fff;
		color: #fff;
	}

a,
a i,
button {
	transition: all .5s ease;
	-moz-transition: all .5s ease;
	-webkit-transition: all .5s ease;
	-o-transition: all .5s ease;
}

blockquote {
	border: 0;
	color: #bc2670;
	font-style: italic;
	margin: 2em 0;
	padding: 0;
}

	blockquote small {
		font-style: normal;
	}

iframe {
	border: 0;
	height: 300px;
	width: 100%;
}

.social-icon {
	padding: 0 10px;
}

.alert-success {
	margin-top: 15px;
}

.padding {
	padding: 0 40px;
}

.pink {
	background: #bc2670;
	color: #fff;
}

.pink .padding {
	padding: 20px 40px;
}

.pink h1 {
	color: #fff;
}

.pink h5 {
	margin-top: 2em;
}

.pink h6 {
	margin-bottom: 2em;
}

.has-error .help-block, 
.has-error .control-label, 
.has-error .radio, 
.has-error .checkbox, 
.has-error .radio-inline, 
.has-error .checkbox-inline, 
.has-error.radio label, 
.has-error.checkbox label, 
.has-error.radio-inline label, 
.has-error.checkbox-inline label {
	color: #222;
}

/* 2. NAVBAR
-------------------------------------------------------------------*/

/* 3. SLIDES
-------------------------------------------------------------------*/

.slider-tint {
	background: #000;
	height: 100%;
	left: 0;
	opacity: 0.3;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: 2;
}

/* 4. COUPLE
-------------------------------------------------------------------*/

#couple .flipper {
	overflow: hidden;
	padding: 0;
	position: relative;
}

	#couple .flipper img {
		width: 100%;
	}

	#couple .flipper .front {
		background: rgba(0,0,0,0.3);
		height: 100%;
		left: 0;
		position: absolute;
		text-align: center;
		top: 0;
		width: 100%;
	}

		#couple .flipper .front .btn {
			bottom: 40px;
			left: 40px;
			position: absolute;
		}

	#couple .flipper .back {
		background: rgba(0,0,0,0.8);
		height: 100%;
		left: 100%;
		padding: 40px;
		position: absolute;
		top: 0;
		width: 100%;
	}

	#couple .flipper h4 {
		color: #fff;
		margin: 0;
	}

	#couple .flipper h5 {
		color: #bc2670;
		margin: 5px 0 30px;
	}

/* 5. COUNTDOWN
-------------------------------------------------------------------*/

#countdown {
	padding: 200px 0 160px;
}

	#countdown h1 {
		color: #fff;
	}

	#countdown h5 {
		color: #bc2670;
	}

/* 6. PEOPLE
-------------------------------------------------------------------*/

#people {
	padding: 70px 0 100px;
}

	#people h5 {
		margin-top: 2em;
	}

	#people h6 {
		margin-bottom: 2em;
	}

/* 7. EVENTS
-------------------------------------------------------------------*/

#events {
	background: #bc2670;
	color: #fff;
}

	#events .row {
		margin: 0;
	}

	#events .col-md-6 {
		padding: 0;
	}

	#events .padding {
		padding: 40px;
	}

	#events h4 {
		color: #fff;
		margin-bottom: 5px;
	}

	#events h5 {
		margin-bottom: 1em;
	}

	#events .flipper {
		overflow: hidden;
		padding: 0;
		position: relative;
	}

		#events .flipper img {
			width: 100%;
		}

		#events .flipper .front {
			background: rgba(0,0,0,0.3);
			height: 100%;
			left: 0;
			position: absolute;
			text-align: center;
			top: 0;
			width: 100%;
		}

			#events .flipper .front .btn {
				left: 50%;
				margin: -33px 0 0 -109px;
				position: absolute;
				top: 50%;
			}

		#events .flipper .back {
			background: rgba(0,0,0,0.8);
			height: 100%;
			left: 100%;
			padding: 40px;
			position: absolute;
			top: 0;
			width: 100%;
		}

			#events .flipper .back iframe {
				height: 100%;
				left: 0;
				position: absolute;
				top: 0;
				width: 100%;
			}

			#events .flipper .back p {
				bottom: 15px;
				left: 0;
				margin: 0 10%;
				position: absolute;
				text-align: center;
				width: 80%;
			}

.map-canvas {
	color: #222;
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
}

/* 8. BLOG
-------------------------------------------------------------------*/

#blog {
	padding: 70px 0 100px;
}

	/* 8.1. BLOG POSTS
	-------------------------------------------------------------------*/

	#blog h5 {
		margin-top: 2em;
	}

	#blog h6 {
		margin-bottom: 2em;
	}

	.post {
	}

		.post h3 {
			margin: 0;
		}

			.post small {
				display: block;
				margin-bottom: 1em;
			}

	.date-day {
		border: 1px solid #e7e7e7;
		color: #222;
		font-size: 3em;
		font-weight: 900;
	}

	.comments {
		letter-spacing: 0;
		margin: 15px 0;
		padding-left: 0;
		padding-right: 0;
		width: 100%;
	}

	/* 8.2. IMAGE HOVER EFFECT
	-------------------------------------------------------------------*/

	.img-hover {
		overflow: hidden;
		position: relative;
		-webkit-transition: all 0.35s ease-in-out;
		-moz-transition: all 0.35s ease-in-out;
		transition: all 0.35s ease-in-out;
	}

		.img-hover img {
			height: 100%;
			width: 100%;
			-webkit-transition: all 0.35s ease-in-out;
			-moz-transition: all 0.35s ease-in-out;
			transition: all 0.35s ease-in-out;
			-webkit-transform: scale(1);
			-moz-transform: scale(1);
			-ms-transform: scale(1);
			-o-transform: scale(1);
			transform: scale(1);
		}

		.img-hover a .info {
			background: #bc2670;
			background: rgba(188,38,112,0.75);
			bottom: 0;
			left: 0;
			opacity: 0;
			pointer-events: none;
			position: absolute;
			right: 0;
			top: 0;
			visibility: hidden;
			-webkit-backface-visibility: hidden;
			backface-visibility: hidden;
			-webkit-transition: all 0.35s ease-in-out;
			-moz-transition: all 0.35s ease-in-out;
			transition: all 0.35s ease-in-out;
			-webkit-transform: translateY(100%);
			-moz-transform: translateY(100%);
			-ms-transform: translateY(100%);
			-o-transform: translateY(100%);
			transform: translateY(100%);
		}

			.img-hover a .info i {
				color: #fff;
				left: 50%;
				margin: -21px 0 0 -19px;
				position: absolute;
				top: 50%;
			}

			.img-hover a:hover img {
				-webkit-transform: scale(1.2);
				-moz-transform: scale(1.2);
				-ms-transform: scale(1.2);
				-o-transform: scale(1.2);
				transform: scale(1.2);
			}

			.img-hover a:hover .info {
				visibility: visible;
				opacity: 1;
				-webkit-transform: translateY(0);
				-moz-transform: translateY(0);
				-ms-transform: translateY(0);
				-o-transform: translateY(0);
				transform: translateY(0);
			}

	/* 8.3. WIDGETS
	-------------------------------------------------------------------*/

	.widget {
		margin-bottom: 60px;
	}

		.widget h5 {
			border-bottom: 1px solid #bc2670;
			margin: 0 0 1em;
			padding-bottom: 1em;
		}

			.widget h5 i {
				color: #ddd;
				margin-right: 10px;
			}

		.widget ul {
			list-style: none;
			margin: 0;
			padding: 0;
		}

			.widget ul li a {
				border-bottom: 1px solid #e7e7e7;
				color: #bbb;
				display: block;
				padding: 7px 0 7px 25px;
				position: relative;
			}

				.widget ul li a:hover {
					color: #222;
				}

				.widget ul li a i {
					left: 10px;
					position: absolute;
					top: 14px;
				}

					.widget ul li a:hover i {
						left: 0px;
					}

		/* 8.3.1. FLICKR WIDGET
		-------------------------------------------------------------------*/

		#flickr {
			display: table;
		}

			#flickr li {
				border: 0;
				float: left;
				padding: 0 1px 1px 0;
				width: 33%;
			}

				#flickr li a {
					padding: 0;
				}

				#flickr li img {
					width: 100%;
				}

		/* 8.3.2. TAGS
		-------------------------------------------------------------------*/

		.tag {
			background: #f0f0f0;
			border-radius: 3px;
			display: inline-block;
			font-size: 0.7em;
			font-weight: bold;
			margin: 0 2px 4px 0;
			padding: 1px 5px;
			text-transform: uppercase;
		}

		/* 8.3.3. SEARCHBOX
		-------------------------------------------------------------------*/

		#search input {
			height: 40px;
			padding: 5px 10px;
			width: 155px;
		}

		#search button {
			height: 40px;
			padding: 5px 10px;
			width: 50px;
		}

		/* 8.3.4. LATEST POSTS
		-------------------------------------------------------------------*/

		.latest-post {
			border-bottom: 1px solid #e7e7e7;
			padding: 20px 0;
		}

			.latest-post h6 {
				font-size: 1.1em;
				margin: 0;
				text-transform: none;
			}

			.latest-post p {
				margin: 0;
			}

			.latest-post .meta {
				font-size: 0.8em;
				margin-bottom: 1em;
			}

		/* 8.3.5. LATEST COMMENTS
		-------------------------------------------------------------------*/

		.latest-comment {
			border-bottom: 1px solid #e7e7e7;
			padding: 20px 0;
		}

			.latest-comment h6 {
				font-size: 1.1em;
				margin: 0 0 1em;
				text-transform: none;
			}

			.latest-comment p {
				margin: 0;
			}

			.latest-comment .meta {
				font-size: 0.8em;
			}

	/* 8.4. BLOG COMMENTS
	-------------------------------------------------------------------*/

	.media {
		margin-top: 50px;
	}

		.media p.meta {
			margin-bottom: 0.5em;
		}

/* 9. GALLERY
-------------------------------------------------------------------*/

#gallery .row {
	margin: 0;
}

.gallery {
	list-style: none;
	margin: 0;
	padding: 0;
}

	.gallery li {
		float: left;
		padding: 0;
		position: relative;
	}

		.gallery li a,
		.gallery li a img {
			display: block;
			position: relative;
		}

		.gallery li a {
			overflow: hidden;
		}

			.gallery li a div {
				position: absolute;
				background: #bc2670;
				background: rgba(188,38,112,0.75);
				padding: 30px;
				width: 100%;
				height: 100%;
			}

				.gallery li a div h4,
				.gallery li a div p {
					color: #fff;
					margin: 0;
				}

/* 10. FOOTER
-------------------------------------------------------------------*/

footer {
	background: #222;
	padding: 30px 0;
}

	footer h5 {
		color: #fff;
		margin: 1em;
	}

	footer p {
		margin: 0;
	}

/* 11. PARALLAX
-------------------------------------------------------------------*/

.parallax {
	background-attachment: fixed;
	background-position: 50% 50%;
	background-repeat: no-repeat;
	background-size: cover;
	margin: 0 auto;
	padding: 150px 0;
	position: relative;
	width: 100%;
}

	.parallax h3,
	.parallax h4 {
		color: #fff;
	}

	.parallax hr {
		border-color: #444;
	}

.tint {
	background: rgba(0,0,0,0.75);
	display: block;
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
}

#countdown {
	background-image: url(../images/watch.jpg);
}

#thanks {
	background-image: url(../images/thanks.jpg);
}

#yes {
	background-image: url(../images/yes.jpg);
}

#guestbook-home {
	background-image: url(../images/guestbook.jpg);
}

#intro {
	background-image: url(../images/intro.jpg);
}

/* 12. GUESTBOOK
-------------------------------------------------------------------*/

#guestbook {
	padding: 70px 0;
}

	#guestbook blockquote {
		border: 1px solid #e7e7e7;
		color: #222;
		font-size: 1em;
		margin: 0 0 30px;
		padding: 30px;
	}

		#guestbook blockquote small {
			font-size: 0.9em;
		}

		#guestbook .quote-icon {
			color: #bc2670;
			font-size: 1.5em;
			line-height: 1em;
			position: relative;
			top: 12px;
		}

			#guestbook .quote-icon i {
				background: #fff;
				padding: 0 10px;
			}

#guestbook-home {
	padding: 70px 0;
}

	#guestbook-home h1 {
		color: #fff;
	}

	#guestbook-home h5 {
		color: #bc2670;
	}

	#guestbook-home blockquote {
		margin: 20px auto 40px auto;
		max-width: 650px;
	}

/* 13. REGISTRY
-------------------------------------------------------------------*/

#registry {
	padding: 100px 0;
}

#registry a {
	opacity: 0.2;
	filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 10+, Firefox on Android */
    filter: gray; /* IE6-9 */
    -webkit-filter: grayscale(100%); /* Chrome 19+, Safari 6+, Safari 6+ iOS */
}

#registry a:hover {
	opacity: 1;
	filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'1 0 0 0 0, 0 1 0 0 0, 0 0 1 0 0, 0 0 0 1 0\'/></filter></svg>#grayscale");
    -webkit-filter: grayscale(0%);
}

/* 14. RSVP
-------------------------------------------------------------------*/

#rsvp {
	background: #bc2670;
	color: #fff;
	padding: 100px 0;
}

	#rsvp h1 {
		color: #fff;
	}

/* 15. THANKS
-------------------------------------------------------------------*/

#thanks {
	padding: 200px 0 140px;
}

	#thanks h1 {
		color: #fff;
	}

	#thanks h5 {
		color: #bc2670;
	}

/* 15. MOBILE SITES
-------------------------------------------------------------------*/

	/* 15.1. Big Screens
	-------------------------------------------------------------------*/
	@media (min-width: 1200px) {

		#couple .row {
			display: table;
		}

		#couple [class*="col-"] {
			float: none;
			display: table-cell;
			vertical-align: top;
		}

	}

	/* 15.1. Laptop Screens
	-------------------------------------------------------------------*/
	@media (min-width: 992px) {

		#events .row {
			display: table;
		}

		#events [class*="col-"] {
			float: none;
			display: table-cell;
			vertical-align: top;
		}

	}

	/* 15.1. Regular Tablets
	-------------------------------------------------------------------*/
	@media (max-width: 991px) {
	}

	/* 15.2. Small Tablets
	-------------------------------------------------------------------*/
	@media (max-width: 767px) {
	}

	/* 15.3. Smartphones
	-------------------------------------------------------------------*/
	@media (max-width: 480px) {

		body {
			font-size: 14px;
			line-height: 2em;
		}

		.gallery li a div h4,
		.gallery li a div p {
			display: none;
		}

		.parallax {
			padding: 80px 0;
		}

		.date-day {
			padding: 20px 0;
		}

	}