@charset "utf-8";
/* CSS Document */

* {
	padding: 0px;
	margin: 0px;	
}
.clear {
	clear:both;	
}
.preload-imgs {
	position: absolute;
	bottom:200%;
	height:1px;
	width:1px;
}
body {
	position: relative;
	background:#dddddd;
}
h1 {
	font-size:70%;	
}
.temp-invitation {

}
.top-container {
	background: #7d85ea url(images/kdb-invitation-bg-m.jpg) repeat;		
	padding: 35px;	
	
}

.bottom-container {	
	position:relative;
	padding: 0px 0px 50px ;
	background:#dddddd ;
	
}

/*----------------
----------------
backgrounds
------------
------------*/

/*----------------
----------------
header
------------
------------*/
.header {
	
	height: 133px;
	width: 100%;
	padding: 10px 0px 0px 0px;
	border-bottom: 3px solid #020238;
	background: #09415d; /* Old browsers */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzA5NDE1ZCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwNzJlNDIiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top, #09415d 0%, #072e42 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#09415d), color-stop(100%,#072e42)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #09415d 0%,#072e42 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #09415d 0%,#072e42 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #09415d 0%,#072e42 100%); /* IE10+ */
background: linear-gradient(top, #09415d 0%,#072e42 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#09415d', endColorstr='#072e42',GradientType=0 ); /* IE6-8 */
}
.header-subcontainer{
	width:900px;
	margin:0 auto;
}
.logo-container {
	background: url(images/KDB-final-Logo.png) no-repeat;
	width:260px;
	height:140px;
	float: left;
	display: block;
}
.app-title-container {
	background: url(images/kdb-evitation-creator.png) no-repeat;
	width:262px;
	height:29px;
	margin: 20px 0px 0px 30px;
	display: block;
	float:left;
}



/*----------------
------------------
invitation design
-------------------
--------------------*/

/***------------------
invitation navigation
-------------------------***/
.invitation-navigation-container {
	height:100px;
	width:100%;
	position:relative;
	
}


.invitation-navigation-container ul{
	list-style:none;	
	width:585px;
	margin: 0 auto;
	padding: 0px 0px 0px 0px;
	display:block;
	
	
}
.invitation-navigation-container ul li {
	float:left;	
	margin: 0px 0px 0px 0px;
	position:relative;	
}
.invitation-navigation-container ul li > a {
	text-indent:-9999px;
	cursor:pointer;	
}

/*-----------
invitation steps hover out
----------------
.invitation-navigation-container ul li > span{
	position:absolute;
	top:100%;
	left: 100px;
}
*/
.invitation-navigation-container ul li > span {
	display:none;	
}
.invitation-nav-edit-event .step-icon {
	position:absolute;
	background: url(images/step-1-bg.png) no-repeat;
	width:78px;
	height:26px;
	text-indent:-9999px;
	top:110%;
	left: 85px;	
}
.invitation-nav-add-guest .step-icon {
	background: url(images/step-2-bg.png) no-repeat;
	width:78px;
	height:26px;
	text-indent:-9999px;
	position:absolute;
	top:110%;
	left: 70px;	
}
.invitation-nav-finalize .step-icon {
	background: url(images/step-3-bg.png) no-repeat;
	width:78px;
	height:26px;
	text-indent:-9999px;
	position:absolute;
	top:110%;
	left: 30px;	
}

/*---------
Nav next icons
-------------*/
.step-next-icon-container {
	position:relative;	
	margin: 10px 0px 0px 0px;
}
.next-icon {
	position:absolute;
	background:url(images/next-text.png) no-repeat;
	width:48px;
	height:15px;
	left:120%;
	top:5px;
	text-indent:-9999px;	
}


/*-------
invitation navigation items
------------*/
/*.invitation-nav-menu {
	background: url(images/nav-menu-link-bg.png) no-repeat;
	width:243px;
	height:51px;
	
}

.invitation-nav-edit-event {
	position:absolute;
	top:5px;
	left: 80px;
	z-index:3;	
}
.invitation-nav-add-guest {
	position:absolute;
	top:5px;
	left: 270px;
	z-index:2;	
}
.invitation-nav-finalize {
	position:absolute;
	top:5px;
	left: 470px;
	z-index:1;	
}
*/
/*-------------
invitation navigation buttons
----------------*/
a.edit-event-button {
	display:block;	
	margin: 0px -20px 0px 0px;
	background: url(images/edit-event-button.png) no-repeat;
	padding: 0px 0px 0px 0px;
	width:210px;
	height:48px;
	position:relative;
	z-index:3;
}
a.add-guest-button {
	display:block;
	padding: 0px;
	background: url(images/add-guests-button.png) no-repeat;
	margin: 0px -15px 0px 0px;
	width:213px;
	height:48px;
	position:relative;
	z-index:2;
		
}
a.finalize-button {
	display:block;
	padding: 0px;
	margin: 0px 0px 0px -2px;
	background: url(images/finalize-button.png) no-repeat;
	width:199px;
	height:48px;
	position:relative;
	z-index:1;
	
}
/*-------------
invitation navigation buttons inactive
----------------*/
a.edit-event-button-inactive{
	display:block;	
	margin: 0px -20px 0px 0px;
	background: url(images/edit-event-button-inactive.png) no-repeat !important;
	padding: 0px 0px 0px 0px;
	width:210px;
	height:48px;
	position:relative;
	z-index:3;
}
a.add-guest-button-inactive {
	display:block;
	padding: 0px;
	background: url(images/add-guests-button-inactive.png) no-repeat;
	margin: 0px -15px 0px 0px;
	width:213px;
	height:48px;
	position:relative;
	z-index:2;
		
}
a.finalize-button-inactive {
	display:block;
	padding: 0px;
	margin: 0px 0px 0px -2px;
	background: url(images/finalize-button-inactive.png) no-repeat;
	width:199px;
	height:48px;
	position:relative;
	z-index:1;
	
}

/*----------------
-----------------
invitation main
------------------*/


#invitation-wrapper {
	width:100%;
	color:white;	
}

.temp-invitation {
	background:white url(images/invitation-bg.jpg) no-repeat;
	color:black;	
	position:relative;
	width:540px;
	height: 300px;
	margin: 0px auto;
	display:block;
}
.kdb-stamp {
	background:url(images/stamp.jpg) no-repeat;
	display:block;
	width:111px;
	height:122px;	
	position:absolute;
	top: 10px;
	left:20px;
}
/*-----invitation contact-------*/
.invitation-contact {
	margin: 10px 0px 10px 0px;

}

.invitation-date {
	margin: 10px 0px 10px 0px;
}
.invitation-data-wrapper ul.invitation-contact {
	list-style:none;
	position:absolute;
	top: 90px;
	left:10px;	
}

.invitation-data-wrapper ul.invitation-contact li {
	float:left;
	margin: 0px 20px 0px 0px;	
}

#event-title-i {
	font-size:25px;
}
#event-type-i {
	font-size: 20px;		
}
.host-title {
	font-style: italic;
	text-decoration:underline;
	font-size: 17px;
}
.date-title {
	font-style: italic;
	text-decoration:underline;
	font-size: 17px;
}

.invitation-data-wrapper {
	position:absolute;
	top: 150px;
	left: 250px;	
}
/*----------- 
-----------------------
invitation-form 
-----------------------
------------------*/

.form-container {
	width: 830px;
	margin: 0px auto;
	padding: 30px 35px 40px;
/*	border:1px solid black;
*/	border-radius: 10px;
	border:1px solid #bebebe;
	display: block;
	background:#f8f8f8 ;
}
/*-------- main form wrapper---------*/
.invitation-wForm {
	
	margin: 0px 0px 0px 0px;
}
.invitation-wForm li {
	margin: 10px 0px 10px 0px; 	
}
.invitation-wForm li > label {
	width:120px;
	display:block;
	text-align:left;
	font-size:14px;
	font-weight:400;
	color:#717171;
	float:left;
	margin: 0px 0px 0px 0px;
}
.invitation-wForm li > label + input {
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	-o-border-radius: 5px;
	
	border: 1px solid #c5c5c5;
	width: 250px;	
	height:23px;
}
.invitation-wForm input, .invitation-wForm select {
	float:left;
}
.invitation-wForm ul {
	font-family:Verdana, Geneva, sans-serif;
	font-size:25px;
	list-style:none;
		
}

/*-----------
Main form containers
----------*/

.event-info-container {	
	margin: 0px 0px 0px 0px;
}
.invitation-wForm label {
	padding: 0px 0px 0px 20px;
}
.event-main-info {
	float:left;	
}
.event-info-container > h1, .add-friends-wrapper > li  h1, h1  {
	margin: 0px 0px 20px 0px;
	display:block;	
	
	letter-spacing:3px;
	font-family: calibri;
	/* font-family:Arial, Helvetica, sans-serif; */
	font-weight:bold;
	font-size:24px;
	color:#717171;
	
	}
.contact-details-tButton {
	margin: 40px 0px 20px 0px;
}

.divider-bar {
	background: url(images/divider-bar.png) no-repeat;
	width:359px;
	height:9px;
	margin: 50px 0px 50px 0px;	
	opacity:.5;
	display:none;
}

/*side bar right with date and special message*/
.date-wrapper {
	float:right;	
}

.instructions-button img{
	width:350px;
	margin: 20px 0px 0px 0px;
}

/*------------------------------
--------------------------------
Finalize module
--------------------------------
----------------*/
.finalize-wrapper > li p{
	font-size: 16px;
	padding-right: 30px;
	
	width:560px;
	float: left;
}
.finalize-vBar {
	background: grey;
	float:left;
	margin: -30px 0px 0px 0px;
	opacity:.5;
	width:2px;
	height:167px;
}
.submit-button {
	background: url(images/finalize-send-button.png) no-repeat;
	width: 160px;
	height: 89px;
	border: none;
	margin: 0px 20px 10px 0px ;
	padding: 5px 10px;	
	float:right !important;
	text-indent: -9999px;
	
}
/*------- next button container -----*/
.next-button-container {
	width:900px;
	margin: 0 auto;	
}
.next-button {
	background:url(images/next-button.png) no-repeat;
	width:76px;
	height:40px;	
	display:block;
	border-radius:3px;
	margin: 20px 0px 0px;
	text-indent:-9999px;
	cursor:pointer;
	float:right;
	
}






/*invitation bar*/
.bar-party-mWrapper {
	width: 800px;
	margin: 0 auto;	
}

.bar-party-container {
	float:left;	
}

.bar-party-data-wrapper  {
	float:right;	
	background:black;
	padding: 10px 20px;
	height:300px;
	width:260px;
	
}

.bar-party-data-wrapper ul {
	list-style:none;
}





/***-----------------
----------------------------
Thank you page
------------------
------------------***/

.thank-you-text-container {
	width:715px;
	height: 120px;
	margin: 40px auto 0px;
	background: url(images/thankyou-text.png) no-repeat;
	display: block;
	text-indent: -9999px;
}



.facebook-icon {
	background: url(images/facebook-small.png) no-repeat;
	width:40px;
	height:40px;
	display:block;
	float:left;
}

a.facebook-icon:hover {
	background: url(images/facebook-small-hover.png) no-repeat;
	width:40px;
	height:40px;
	display:block;	
}
.twitter-icon {
	background: url(images/twitter-small.png) no-repeat;
	width:40px;
	height:40px;
	display:block;
	float:left;	
}
a.twitter-icon:hover {
	background: url(images/twitter-small-hover.png) no-repeat;
	width:40px;
	height:40px;
	display:block;	
	
}
 .youtube-icon {
	background: url(images/youtube-small.png) no-repeat;
	width:40px;
	height:40px;
	display:block;	
	float:left;
	
}
a.youtube-icon:hover {
	background: url(images/youtube-small-hover.png) no-repeat;
	width:40px;
	height:40px;
	display:block;	
	
}
 .foursquare-icon {
	background: url(images/foursquare-small.png) no-repeat;
	width:40px;
	height:40px;
	display:block;	
	float:left;
}
a.foursquare-icon:hover {
	background: url(images/foursquare-small-hover.png) no-repeat;
	width:40px;
	height:40px;
	display:block;	
	
}