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

@import url('https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300|Open+Sans:400,600&display=swap');

/* color palette
Black - #000
Dark Gray - #191b22
Gold - #CFAC41, or #D4B556 for brighter/lighter accents
Blue - #153C9E
Blue for backgrounds (slightly darker) - #102F7D
*/

body {
	margin: 0px;
	font-family: 'Open Sans', sans-serif;
	background-color: #000;
}

main, div.main {
	background-color: #191b22;
	color: #fff;
	filter: none;
}
section {
	padding: 40px 6%;
}
a.buttonStyle {
	color: #fff;
	border: 1px solid #fff;
	text-decoration: none;
	text-transform: uppercase;
	letter-spacing: .11em;
	font-size: 15.5px;
	padding: 10px 20px;
	transition: opacity ease-in-out .6s;
}
a.buttonStyle:hover {
	color: #fff;
	opacity: .6;
}
a.basicLink {
	color: #CFAC41;
	transition: color ease-in-out .3s;
}
a.basicLink:visited {
	color: #876E22;
}
a.basicLink:hover {
	color: #E3D093;
}


br {
	margin-bottom: 6px;
}
h1 {
	font-family: 'Open Sans', sans-serif;
	font-weight: bold;
	font-size: 1.3em;
	/*color: #CFAC41;*/
	color: #ffffff;
	margin-bottom: 40px;
}

/* music player */
#bkgdMusic{
	margin: -100px 0px 0px -10px;
}
@media screen and (max-width: 600px){
	#bkgdMusic {
		margin-top: -10px;
	}
}


/* STICKY FOOTER */
html, body {
	height: 100%;
}
body {
	display: flex;
	flex-direction: column;
	background-color: #191b22;
}
div.wrapper {
	flex: 1 0 auto;
}
footer {
	flex-shrink: 0;
}


/* NAVIGATION */

#logo {
	height: 120px;
	transition: none;
}
#navLinks {
	/*margin-top: 92px;*/
	transition: none;
}

@media screen and (min-width: 1px) and (max-width: 990px){
	#logo {height: 66px;}
	#navLinks {
		margin-top: 0px;
	}
}

#officialSite {
	position: absolute;
	right: auto;
	left: 145px;
	top: 58px;
	bottom: auto;
	color: #393D4D;
	font-family: 'Open Sans Condensed', sans-serif;
	font-weight: 300;
	font-size: 1em;
	letter-spacing: .015em;
	/*float: left;
	padding-left: 12px;
	margin-top: 58px;*/
}
#officialSite.shrinkOfficial {
	/*bottom: 50px;*/
	margin-top: 0px;
}

#socialLinks h2{
	font-family: 'Open Sans Condensed', sans-serif;
	font-weight: normal;
	font-size: 25px;
	margin-top: 0px;
	color: #CFAC41;
	padding-bottom: 10px;	
	letter-spacing: .015em;
}
#socialLinks {
	border-bottom: solid 1px #191b22;
	padding-bottom: 45px;
	margin-bottom: 25px;
}
#socialLinks a {
	display: inline-block;
	transition: color .6s ease;
	color: #fff;
	font-size: 15px;
	text-decoration: none;
}
#socialLinks a:first-of-type {
	padding-right: 6%;
}
#socialLinks i {
	font-size: 20px;
	padding-right: 12px;
	position: relative;
	top: 2px;
}
#socialLinks a:hover {
	color: #CFAC41;
}

@media (min-width: 990px) {
	
	main, div.main {	
		padding-top: 160px;
	}
	#topNav {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		z-index: 100;
		padding-left: 6%;
		padding-bottom: 5px;
		padding-top: 5px;
	}
	#logo {
		height: 120px;
		float: left;
		transition: height 1s ease;
	}
	#logoLink {
		width: 185px;
	}
	#logo.shrinkLogo {
		height: 80px;
		display: inline-block;
	}
	/* float nav right on larger screens*/
	#officialSite, #navLinks {
		padding-right: 11%;
		float: right;
	}
	#officialSite {
		position: static;
		font-size: 1.7em;
		margin-top: 35px;
		display: block;
		margin-right: 12px;
		width: 50%;
		transition: margin ease 1s;
	}
	#officialSite span {
		float: right;
	}
	#officialSite.shrinkOfficial {
		margin-top: 20px;
	}
	#navLinks {
		margin-top: 20px;
		transition: margin ease 1s;
	}
	#navLinks.shrinkNav {
		margin-top: 0px;
	}
	#navLinks a.navHide {
		display: none;
	}
	#topNav {
		border-bottom: 1px solid #191919;
	}
	.topnav a.nav {
		transition: border ease .6s;
		border-bottom: 3px #000 solid;
	}
	.topnav a.nav:hover {
		border-bottom: 3px #153C9E solid;
	}
}

	.topnav {
	  background-color: #000;
	  overflow: hidden;
	  font-weight: 600;
	}
	.topnav a {
	 float: left;
	 display: block;
	 color: #fff;
	 text-align: center;
	 padding: 14px 16px;
	 text-decoration: none;
	 font-size: 15px;
	}
	.topnav a.active {
	 	color: #CFAC41; /*CFAC41*/
	}
	/* Hide the link that should open and close the topnav on small screens */
	.topnav .icon {
		display: none;
	} 
	/* When the screen is less than 600 pixels wide, hide all links, except for the first one ("Home"). Show the link that contains should open and close the topnav (.icon) */
	@media (max-width: 990px) {
		.topnav a {display: none;}
		.topnav #logoLink {display: block;}
		.topnav a.icon {
			float: right;
			display: block;
			position: fixed;
			top: 0px;
			right: 0px;
		}
		.topnav a.nav:hover {
			background-color: #2A2D39;
		}
		#navLinks span.spaceLeft {
			margin-left: 10px;
		}
	}

	/* The "responsive" class is added to the topnav with JavaScript when the user clicks on the icon. This class makes the topnav look good on small screens (display the links vertically instead of horizontally) */
	@media (max-width: 990px) {
	  .topnav.responsive {position: relative;}
	  .topnav.responsive a.icon {
		position: absolute;
		right: 0;
		top: 0;
	  }
	  .topnav.responsive a {
		float: none;
		display: block;
		text-align: left;
	  }
	} 

/*************** HEADER ***************/


/* Header with image bkgd */
#headerImg {
	background-color: #191b22;
	box-sizing: border-box;
	width: 100%;
}
div.leftImg {
	width: 100%;
	box-sizing: border-box;
	height: 200px;
	margin-right: 0px;
	margin-left: 0px;
	padding: 200px 6% 40px;
}

img {
	max-width: 100%;
}

#headerImg h1 {
	margin-top: 60px;
	margin-left: -6%;
}


img.titleImg {
	max-width: 85%;
	margin-left: -6%;
	padding-top: 74px;
}

/* Position text and adjust img height based on screen size*/
@media (min-width: 600px){
	#headerImg h1 {
		margin-left: 0px;
		margin-top: 240px;
	}
	#headerImg {
		padding: 40px 6% 100px 0px; 
	}
	div.leftImg{
		height: 400px;
	
	}
	/* home page only */
	img.titleImg {
		margin-top: 140px;
		margin-left: 0px;
		padding-top: 0px;
		width:215px;
	}
}
@media (min-width: 1200px){
	div.leftImg{
		height: 450px;
	}
	#headerImg h1 {
		margin-top: 280px;
	}
	/* home page only */
	img.titleImg {
		margin-top: 170px;
		margin-left: 6%;
		width: 300px;
	}
}

/* Set Image for Each Page */
div#tpHeader {
	background-image: url(../img/tpHeader.png);
	background-size: cover;
	background-position: center top;
	display: static;
}
div#bookHeader {
	background-image: url(../img/singing.jpg);
	background-size: cover;
	background-position: left center;
	display: static;
}


/* Booking page styles*/

p.author {
	font-size: .9em;
	margin-bottom: 40px;
}

/* Quote style*/
div.quote {
	padding-right: 6%;
	padding-left: 6%;
	font-style: italic;
	padding-top: 40px;
}
div.quote p:last-of-type{
	font-style: normal;
}

/* FOOTER */

footer{
	background-color: #000;
	margin: 0px;
	padding: 6%;
	padding-top: 50px;
	padding-bottom: 20px;
	text-align: center;
	color: #6E7584;
	font-size: 15px;
}




/* HOME PAGE STYLES */


#vip {
	background-color: #102F7D;
}
@media (max-width: 600px) {
	#vip img {
		margin: 20px auto;
		text-align: center;
		height: 100px;
		display: block;
	}
	#vip p, #vip a.buttonStyle {
		text-align: center;
		margin-right: auto;
		margin-left: auto;
		clear:both;
		display: block;
	}
	
}
@media (min-width: 600px){
	#vip {
		height: 220px
	}
	#vip img{
		float: left;
		margin: 10px 6% 20px 40px;
	}
	#vip p{
		margin: 90px 6% 30px 40px;
	}
}
/* Carousel styles */
#carousel {
	background-color: #000;
}
#carousel {
	padding: 80px;
}
#carousel .blue-star {
	padding: 12px;
	background-image: url(../img/stars/star-blue.png);
	background-size: contain; 
}
#carousel .gold-star {
	padding: 12px;
	background-image: url(../img/stars/star-gold.png);
	background-size: contain; 
}
#carousel .gold-star-blur {
	padding: 18px;
	background-image: url(../img/stars/star-gold-blur.png);
	background-size: contain; 
}
#carousel .red-star {
	padding: 12px;
	background-image: url(../img/stars/star-red.png);
	background-size: contain; 
}
button.owl-prev, button.owl-next {
	position: relative;
	top: -155px;
	font-size: 90px !important;
	color: rgba(134,134,134,0.40) !important;
	margin: 0px -80px;
	transition: color .3s ease;
}

@media screen and (min-width: 600px){
	button.owl-prev, button.owl-next {
		top: -225px;
	}
}
@media screen and (min-width: 1200px){
	button.owl-prev, button.owl-next {
		top: -305px;
	}
}
button.owl-prev:hover, button.owl-next:hover {
	background-color: rgba(49,49,49,0.00) !important;
	color: rgba(134,134,134,0.80) !important;

}
button.owl-prev {
	float: left;
}
button.owl-next {
	float: right;
}
div.owl-nav {
	margin: 2px -80px;
}


/* FORMS */
label {
	font-size: .95em;
	display: block;
	margin: 5px 0px 5px 0px;
}
input[type="text"], input[type="tel"], input[type="date"], input[type="email"] {
	width: 100%;
	max-width: 700px;
	margin-bottom: 15px;
	height: 25px;
	padding-left: 15px;
	font-size: 1em;
}
input[type="date"] {
	font-family: "Open Sans", sans-serif;
	
}
input[type="checkbox"] {
	display: inline;
	margin: 5px 7px 0px;
	float: left;
}

input:focus {
	 box-shadow: 0 0 0 0.2rem rgba(90,90,90,0.50) !important;
}
fieldset.type input#temps {
	margin-top: 10px;
}
legend {
	margin-bottom: 5px;
	color: #fff;
}
fieldset {
	border: none;
	padding: 0px;
}

input[type="submit"] {
	text-align: center;
	border: solid 1px #fff;
	background-color: #191b22;
	color: #fff;
	text-transform: uppercase;
	letter-spacing: .15em;
	padding: 10px 20px;
	transition: opacity ease-in-out .6s;
	margin: 10px auto;
	font-size: 15.5px;
	
	cursor: pointer;
}
input[type="submit"]:hover, input[type="submit"]:focus {
	opacity: .6;
}
#submit {
	margin-top: 35px;
}


/* VIDEO */
@media screen and (max-width: 600px) {
	section#video iframe {
		width: 356px;
		height: 209px;
	}
}

/* THANK YOU */

.thanksHead {
	text-align: center;
}
.thanksHead h1 {
	margin: 40px 0px 0px;
}
.thanksText {
	margin-bottom: 15px;
	font-size: 4em;
	font-weight: normal;
	text-shadow: 0px 0px 6px #D4B556;
	color: #CFAC41;
	-webkit-text-stroke: #D4B556 4px;
	-webkit-text-fill-color: #191b22;
	paint-order: stroke fill;
	text-transform: uppercase;
	letter-spacing: 0.08em;
}

hr {margin-bottom: 40px; padding: 0px 16%; border-bottom: solid 1px #191B22;}
		

#redCarpet {
	background: linear-gradient(rgba(0,0,0,0.0), rgba(0,0,0,0.0), rgba(0,0,0,0.0), rgba(0,0,0,0.0), rgba(0,0,0,.9)), url(../img/redCarpet2.jpg);
	background-size: cover;
	background-position: top center;
	background-repeat: no-repeat;
	height: 300px;
	margin-top: 60px;	
}


/* ACKNOWLEDGEMENTS PAGE */
a#ackLink {
	color: white;
	text-decoration: none;
}
a#ackLink p {
	transition: opacity .6s ease;
}
a#ackLink:hover p{
	opacity: .6;
}
#ackLink div {
	margin: 40px 4%;
	border-left: 5px solid #000;
	padding: 1.4% 12% 1.4% 4%;
	background-color: #2A2D39;
	display: inline-block;
}