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

	Theme Name: Eternity
	Theme URI: http://demo.themechills.com/eternity
	Description: A beautiful landing page template for all wedding occasions.
	Author: ThemeChills
	Author URI: http://www.themechills.com

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

	1.	Overrides
	2.	Main Content Styles
	3.	Sidebar Styles
	4.	Forms - Base Styles
	5.	Image Gallery
	6.	Footer Styles
	7.	Helpers

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

@font-face {
    font-family: 'ostrich_sansbold';
    src: url('../fonts/ostrich-bold-webfont.eot');
    src: url('../fonts/ostrich-bold-webfontd41d.eot?#iefix') format('embedded-opentype'),
         url('../fonts/ostrich-bold-webfont.woff') format('woff'),
         url('../fonts/ostrich-bold-webfont.ttf') format('truetype'),
         url('../fonts/ostrich-bold-webfont.svg#ostrich_sansbold') format('svg');
    font-weight: normal;
    font-style: normal;

}

/*-----------------------------------------------------------------------------------*/
/*	1.	Overrides
/*-----------------------------------------------------------------------------------*/

body {
	color: #000000;
	font-family: 'Roboto Slab', serif;
	text-align: center;
}
a {
	color:#FF007F;
	-webkit-transition: all 300ms ease-out;
	-moz-transition: all 300ms ease-out;
	transition: all 300ms ease-out;
}
a:hover {
	color:#FF007F;
}
img {
	width: 100%;
	height: auto;
}

/*==== Headings ====*/

h1,
h2,
h3,
h4,
h5,
h6 {	
	color:#FF007F;
	font-family: 'ostrich_sansbold','Helvetica Neue', Helvetica, sans-serif;
	font-weight: normal;
	line-height: 1.5;
}

/*==== The Grid ====*/

.row,
.row .row {
	height: 100%;
	max-width: 100%;
	margin:0;
}

/*-----------------------------------------------------------------------------------*/
/*	2.	Main Content Styles
/*-----------------------------------------------------------------------------------*/

header {
	margin-top: 0.5em;
}
blockquote {
	border-left: none;
	padding: 4em 2em;	
	margin-bottom: 0;
	text-align: left;
}
blockquote:before {
	content: "";
	position: absolute;
	height: 100%;
	top: 0;
	right: 0;
	width: 1px;
	background:#d9d9d9;
}
blockquote.caption-2:before {
	background:none
}
.subline {
	padding: 1em 0.5em 0;
}
.section-title-container {	
	text-align: center;
	margin: 6em 0 2em;
}
.section-title {	
	border-bottom: 4px double #100040;
	display: inline-block;
	text-align: center;
	font-size: 4em;
	line-height: 1.2;
	margin: 0;
	width: 100%;
}
.section-title em {
	color:#100040;
	font-family: 'Playfair Display', serif;
	font-size: 0.5em;
}
.hearts {
	background:url(../img/icon-hearts.png) no-repeat center bottom;	
	display: block;
	height: 2em;
	position: relative;
	z-index: 4;
	bottom: 20px;
}
.divider {
	border-bottom:1px solid #e4e4e4;
}

/*==== Date Block ====*/

.date-container {
	padding: 1.5em;
}
.date-container.col-1 {
	border-bottom:1px solid #e4e4e4;
}
.date-container .day-date,
.date-container .day-time,
.date-container .day-address {
	font-size: 1em;
}
.date-container span {
	display:block;
}
.date-container .date {
	font-family: 'Roboto Slab', serif;
}
.date-container .accent {
	color:#FF007F;
	font-family: 'ostrich_sansbold','Helvetica Neue', Helvetica, sans-serif;
	font-weight: normal;
}
.date-container .day-location {
	font-size: 3.750em;
	margin: 10px 0 5px;
}
.date-container .day-year {
	font-size: 12em;
}
.date-container, .subline, .side-nav {
	color: #100040;
	font-family: 'Roboto Slab', serif;
	font-weight:bold;	
	text-transform: uppercase;	
}
.date-container .day-meta {
	font-family: 'Playfair Display', serif;
	font-style: italic;
	text-transform: lowercase;
	font-weight: normal;
	font-size: 1.45em;
	margin-top: 15px;
}

/*==== Callout ====*/

.callout {
	clear:both;
	text-align: center;
	margin: 4em 0 6em;
}
.callout .button {
	margin-bottom: 0;
}

/*==== Sections ====*/

div[id*="section-"] {
	overflow: hidden;
	text-align: center;
}
.section-odd {
	background:#f7f7f7;
}
.btn-label {
	margin-left: 0.5em;
}

/*==== Block Grid ====*/

.block-grid li {
	margin-bottom: 0.88em;
}
.block-grid .block-logo {
	background-color: #FFF;
	border-radius: 10px;
	display: table-cell;
	height: 10em;
	text-align: center;
	padding: 4em;
	vertical-align: middle;
	width: 50%;	
}
.block-logo:hover {
	background-color: #FFF;
	cursor: pointer;
}
.block-logo img {
	opacity: .5;
	-webkit-filter: grayscale(1);
	-webkit-transition: all .6s ease; /* Fade to color for Chrome and Safari */
    -webkit-backface-visibility: hidden; /* Fix for transition flickering */
}
.block-logo:hover img {
	opacity: 1;
	-webkit-filter: grayscale(0)
}
.visible-img img {
	width: auto;
}

/*==== Content Block ====*/

.content-block {
	margin: 2em 0 6em;
	line-height: 2em;
}

/*-----------------------------------------------------------------------------------*/
/*	3.	Sidebar Styles
/*-----------------------------------------------------------------------------------*/

aside {
	width: 100%;
	height: 30em;
	top: 0;
	right: 0;
	bottom: auto;
	position: relative!important;
	z-index: 997;
}
aside .postfix.button {
	line-height:0.125em;
	padding:1.43em 0;
}
.side-nav {
	background-color:#FF007F; /* fallback */
	background: #FF007F; 
	margin: 0;
	padding:0;
}
.side-nav li { 
	margin:0;
}
.side-nav li a {
	color:#fff;
	border-top: 1px solid #fb918a;
	display: block;
	padding: 1.25em;
}
.side-nav li.active a,
.side-nav li a:hover {	
	background-color:#fff;
	color:#FF007F;
}
.side-nav-container {
	margin: 0 auto;
	width: 59%;
}
.shadow {	
	-webkit-box-shadow: 0 0 1.5em #6e6e6e;
	   -moz-box-shadow: 0 0 1.5em #6e6e6e;
			box-shadow: 0 0 1.5em #6e6e6e;
}
.logo {		
	margin:5em auto;
}
.logo a {
	background-color: #FF007F; /* fallback */
	background-color: #100040;
	color: #fff;
	display: block;
	font-size: 2.5em;
	letter-spacing: -12px;
	border-radius: 30px;
}
.ribbon {
	background:none;
	display: block;
	height: 8px;
	opacity: 0.9;
}

/* Global Buttons */

button, .button {
	background-color: #FF007F;
	border-color: transparent;
	-webkit-box-shadow: none;
		    box-shadow: none;
	text-transform: uppercase;
	padding: 1.250em 1.5em;
}
button:hover, 
button:focus, 
.button:hover, 
.button:focus {
	background-color:#FF007F;
}

/* High Quality/Definition Images */

.hd {
	margin-bottom: 1em;
}

/*-----------------------------------------------------------------------------------*/
/*	4.	Forms - Base Styles
/*-----------------------------------------------------------------------------------*/

input[type="text"],
input[type="password"],
input[type="date"],
input[type="datetime"],
input[type="datetime-local"],
input[type="month"],
input[type="week"],
input[type="email"],
input[type="number"],
input[type="search"],
input[type="tel"],
input[type="time"],
input[type="url"],
textarea {
	background-color: #F5F5F6;
	border: 1px solid #F5F5F6;
	border-radius: 3px; 
	height: 38px;
	color: #818b92;
	-webkit-font-smoothing: antialiased;
	-webkit-appearance: none;
	-webkit-box-shadow: none;
			box-shadow: none;
	-webkit-transition: .25s ease-in;
	   -moz-transition: .25s ease-in;
		    transition: .25s ease-in;
}
input[type="text"]:focus, 
input[type="password"]:focus, 
input[type="date"]:focus, 
input[type="datetime"]:focus, 
input[type="datetime-local"]:focus, 
input[type="month"]:focus, 
input[type="week"]:focus, 
input[type="email"]:focus, 
input[type="number"]:focus, 
input[type="search"]:focus, 
input[type="tel"]:focus, 
input[type="time"]:focus, 
input[type="url"]:focus, 
textarea:focus {
	background-color: #FFF;
	border:1px solid #FF007F;
	-webkit-box-shadow: none;
	   -moz-box-shadow: none;
		    box-shadow: none;
} 

label {
	text-align: left;
	margin-bottom: 0.5em;
}

/*==== RSVP ====*/

.rsvp-form {
	margin:2em 0 4em;
}
.rsvp-form fieldset {
	border-color:#100040;
	padding: 2em 0.5em;
	margin: 1em 1em 3em;
}
.rsvp-form legend {
	font-weight: normal;
	padding: 0 1em;
	line-height: 1.4;
}
.rsvp-form div[class*="large-"] {
	padding-left:0.9375em!important;
	padding-right:0.9375em!important;
}
.rsvp-attendance label {
	text-align:center;
	display: inline-block;
}
.rsvp-attendance .radio-label {
	display: block;
	margin-top: 1em;
}

form.custom .radio {
	border: solid 5px #e6e6e6;
	height: 29px;
	width: 30px;
}
form.custom .custom.radio.checked:before {
	top: 4px;
	left: 5px;
	background-color: #e6e6e6;
	width: 10px;
	height: 10px;
}
form.custom .dropdown {
	text-align: left;
}

/*==== Error Handling ====*/

[data-abide] .error small.error, 
[data-abide] span.error, 
[data-abide] small.error {
	display: block;
	padding: 0.875em 0.25em;
	margin-top: 1em;
	margin-bottom: 1em;
	font-size: 0.75em;
	font-weight: normal;
	background: #c60f13;
	color: white; 
}
[data-abide] span.error, 
[data-abide] small.error {
	display: none; 
}
span.error, small.error {
	display: block;
	padding: 0.375em 0.25em;
	margin-top: 0;
	margin-bottom: 1em;
	font-size: 0.75em;
	font-weight: bold;
	background: #c60f13;
	color: white; 
}
.error input,
.error textarea,
.error select {
	border-color: #c60f13;
	background-color: rgba(198, 15, 19, 0.1);
	margin-bottom: 0; 
}
.error input:focus,
.error textarea:focus,
.error select:focus {
  	background: #fafafa;
  	border-color: #999999; 
}
.error label,
.error label.error {
  	color: #c60f13; 
}
.error > small,
.error small.error {
	display: block;
	padding: 0.375em 0.25em;
	margin-top: 0;
	margin-bottom: 1em;
	font-size: 0.75em;
	font-weight: bold;
	background: #c60f13;
	color: white; 
}
.error span.error-message {
	display: block; 
}
input.error,
textarea.error {
	border-color: #c60f13;
	background-color: rgba(198, 15, 19, 0.1);
	margin-bottom: 0; 
}
input.error:focus,
textarea.error:focus {
	background: #fafafa;
	border-color: #999999; 
}
.error select {
  	border-color: #c60f13;
  	background-color: rgba(198, 15, 19, 0.1); 
}
.error select:focus {
	background: #fafafa;
	border-color: #999999; 
}
label.error {
	color: #c60f13; 
}

/*==== Notification Panel ====*/

.message-panel {
	background-color: #ffffe0;
	border-color: #e6db55;
	padding: 1em;
	font-size: 0.850em;
	margin: 0 0 2em;
}


/*-----------------------------------------------------------------------------------*/
/*	5.	Image Gallery
/*-----------------------------------------------------------------------------------*/

.carousel li {
	position: relative;
	margin: 0;
	max-width:100%;
	width: 100%;
}
.carousel img {
	max-width: 100%;
	height: auto;
}
.overlay-label {
	background-color: rgba( 222, 103, 95, 0.7);
	display: inline;
	left: 0px;
	text-transform: uppercase;
	font-weight: 300;
	letter-spacing: 3px;
	opacity: 0;
	margin: 0px;	
	position: absolute;
	top: 0px;
	width: 100%;
	height: 100%;
	text-align: center;
	padding-top: 45%;
	color: white;
	font-size: 15px;
	-webkit-transition: all .4s;
	   -moz-transition: all .4s;
	        transition: all .4s;

}
.overlay-label:hover {
	opacity: 1;
}

/* Navigation */

.top-bar {
	position: relative;
	top: 0;
	width: 100%;
	z-index: 997;
	text-align: left;
}
.top-bar .name {
	color:#fff;
	font-weight: bold;
	line-height: 3em;
	padding-left: 1em;
	margin-right: 1em;
}
.top-bar-section ul li {
	border-bottom: 1px dotted #222222;
}
.top-bar-section ul li > a {
	background: #111111;
	font-weight: normal;
}
.top-bar-section ul li:first-child {
	display: none;
}

/*-----------------------------------------------------------------------------------*/
/*	6.	Footer Styles
/*-----------------------------------------------------------------------------------*/

footer {
	overflow: hidden;	
	text-transform: uppercase;
	text-align: center;
	padding: 2em;
}
footer p {
	font-size: 0.750em;
	margin-bottom: 0;
}
footer a {
}
.copyright {
	margin-bottom: 0.650em;
}

/*-----------------------------------------------------------------------------------*/
/*	7.	Helpers
/*-----------------------------------------------------------------------------------*/

.wrapper {
	padding: 0 1em!important;
}
.sep {
	margin: 3em 0 2em;
}
.preloader {
	background:url(../img/status.gif) no-repeat center center; 
	min-height:400px;
}