/* Global */
html {
  background-color: #03092E;
  background-image: url('bg.jpg');
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
  background-position: center;
  position: relative;
}

/* This is where you can put in a specific font if you want to make it global */
body {
}

/* Header (This is that bar on the very top) */
header#page_header #header_bg {
	background-color: transparent;
}

header#page_header nav#user_nav {background-color: transparent; color: #FFFFFF; text-shadow: none; font-weight: bold; position: relative;}
header#page_header, header#page_header a {background-color: transparent; color: #FFFFFF !important; position: relative;}
header#page_header nav#user_nav a {background-color: transparent; color: #FFFFFF; position: relative;}
header#page_header nav#user_nav ul li:first-child {background-color: transparent; color: #FFFFFF; position: relative;}

/* Hero (The logo) */
header#page_header a#logo {}
header#page_header #hero {}
header#page_header #hero a#logo {
	background: none;
	box-shadow: none;
	position: relative;
	margin-top: -2em;
}
header#page_header #hero a#logo img {}

/* Main Content (The main box) */
#main_content {
  max-width: 900px;
  margin-bottom: 10em;
  margin-top: 2.5em;
  background-color: rgba(255,255,255,.85);
  color: #000000;
  font-family: 'Istok Web', sans-serif;
}

/* Margin fix for party images */
#main_content ul.package-horizontal li.package div.images {
	padding-right: 0em !important;
}

/* Fixing upsell image slash confirm party image margin */
#main_content li.package>div.images>img {
	padding-right: 5px !important;
}

/* The Step whatever of whatever bar */
nav.breadcrumbs { 
  background-color: #3985C3;
  color: #FFFFFF;
  text-shadow: none;
  font-size: 110%;
  font-family: 'Patua One', cursive;
}

/* The Select from all available packages bar */
#main_content section#package_select {
  color: #F68500;
  background-color: transparent;
  font-style: normal !important;
}

/* Use this if you are trying to change the weight of the font on Select from all available packages bar */
form label, form fieldset.dark-button-select legend {
}

/* The 'Date & Time' header and the other h1 and h2 headers */
h1, h2, form fieldset.container legend {
	font-family: 'Istok Web', sans-serif;
}

/* The widget box header with the month and year in it */
#datepicker .ui-widget-header {
	background-image: none;
	border: solid 1px #4D4D4D;
	background-color: #3985C3;
	color: #FFFFFF;
}

/* The widget box calendar colors */
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
	color: #777777;
}

/* The widget box date selected colors */
#date_time_select .ui-state-active {
    border: solid 1px #4D4D4D;
    background: #3985C3;
    color: #FFFFFF;
}

/* The color of the time and time zone selected message in the main box */
#main_content fieldset.time-picker legend span, #main_content form#guest_form fieldset legend span {
	color: #F68500 !important;
	font-style: normal;
	font-weight: bold;
}

/* The bar on the bottom of the main box */
#main_content footer.main-actions {
	background-color: transparent;
}

/* Change the color of the date and time header once the package has been selected */
#featured_packages.PackageResults h1 span big {
	
}

/* The background and border color of a package when the package has been selected on select time page */
#main_content #featured_packages ul.package-horizontal li.package.selected {
    border-color: #3985C3 !important;
}

/* Footer */
footer#page_footer {
  color: #FFFFFF;
  text-shadow: none;
  background-color: transparent;
  background-image: url('footer_bg.png');
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-attachment: scroll;
  background-position: center;
}

/* Adjust location of text in footer - use relative position and margins */
footer#page_footer p {
	padding: .1em;
	margin-top: 1em;
	margin-bottom: .1em;
	line-height: 1;
}

/* Adjust location of System Powered By text in footer */
footer#page_footer p.powered-by {
	margin-top: 1em;
}

/* Mess with addres and phone inserts */
footer#page_footer p.business-address, footer#page_footer p.business-phone {
	margin-top: 0em;
	margin-bottom: 0em;
	padding: .1em;
}

#PrivacyPolicy {
  color: #FFFFFF;
  padding: .1em;
}

/* Mobile */
@media only screen and (max-width: 1024px) and (min-width: 900px) {
header#page_header nav#user_nav {background-color: transparent; color: #FFFFFF; text-shadow: none; font-weight: bold; position: relative; right: -12em;}
header#page_header, header#page_header a {background-color: transparent; color: #FFFFFF !important; position: relative;}
header#page_header nav#user_nav a {background-color: transparent; color: #FFFFFF; position: relative;}
header#page_header nav#user_nav ul li:first-child {background-color: transparent; color: #FFFFFF; position: relative;}
}

@media only screen and (max-width: 899px) and (min-width: 768px) {
header#page_header nav#user_nav {background-color: transparent; color: #FFFFFF; text-shadow: none; font-weight: bold; position: relative; right: -12em;}
header#page_header, header#page_header a {background-color: transparent; color: #FFFFFF !important; position: relative;}
header#page_header nav#user_nav a {background-color: transparent; color: #FFFFFF; position: relative;}
header#page_header nav#user_nav ul li:first-child {background-color: transparent; color: #FFFFFF; position: relative;}
header#page_header #hero a#logo {box-shadow: none;}
}

@media only screen and (max-width: 767px) and (min-width: 641px) {
header#page_header nav#user_nav {background-color: transparent; color: #FFFFFF; text-shadow: none; font-weight: bold; position: relative; right: -3em;}
header#page_header, header#page_header a {background-color: transparent; color: #FFFFFF !important; position: relative;}
header#page_header nav#user_nav a {background-color: transparent; color: #FFFFFF; position: relative;}
header#page_header nav#user_nav ul li:first-child {background-color: transparent; color: #FFFFFF; position: relative;}
header#page_header #hero a#logo {box-shadow: none;}
}

@media only screen and (max-width: 640px) {
html {}
	
header#page_header nav#user_nav {background-color: transparent; color: #FFFFFF; text-shadow: none; font-weight: bold; position: relative; margin-right: 0em;}
header#page_header, header#page_header a {background-color: transparent; color: #FFFFFF !important; position: relative;}
header#page_header nav#user_nav a {background-color: transparent; color: #FFFFFF; position: relative;}
header#page_header nav#user_nav ul li:first-child {background-color: transparent; color: #FFFFFF; position: relative;}
header#page_header a#logo {}
header#page_header #hero {}
header#page_header #hero a#logo {box-shadow: none; margin-top: -2em;}
header#page_header #hero a#logo img {}

/* This makes the ugly gray haze the mobile version applies a smaller area, so it only goes slightly past the login stuff. We then need to factor for the lower amount of space taken up by the smaller header by pushing the Main Content box down. */
header#page_header {height: 30px;}
#main_content {margin-top: 12em !important;}

@media only screen and (max-width: 400px) {
#main_content {margin-top: 11em !important;}
}

/* Make all the footer info work on small screens */
@media only screen and (max-width: 640px){
footer#page_footer p.business-name, footer#page_footer p.powered-by {
margin-top: .5em;
margin-bottom: 0em;
margin-right: .5em;
margin-left: 0em;
padding: .1em;
}

footer#page_footer p.business-address, footer#page_footer p.business-phone {
margin: 0em;
font-size: 70%;
padding: .1em;
}
}

}

/* Buttons */
button.btn-success, input[type="button"].btn-success, input[type="submit"].btn-success, input[type="reset"].btn-success, .btn.btn-success, .table tbody tr td.is-actions a.btn-success, table tbody tr td.is-actions a.btn-success, form fieldset.dark-button-select input[type='radio']+label.btn-success, form fieldset.dark-button-select input[type='radio']+legend.btn-success, #main_content fieldset.time-picker input[type='radio']+label.btn-success, #main_content fieldset.time-picker form fieldset.dark-button-select input[type='radio']+legend.btn-success, form fieldset.dark-button-select #main_content fieldset.time-picker input[type='radio']+legend.btn-success, #main_content form#guest_form fieldset input[type='radio']+label.btn-success, #main_content form#guest_form fieldset.dark-button-select input[type='radio']+legend.btn-success, body.authentication a#account_create {
	background-image: none !important;
	background-color: #3985C3 !important;
	color: #FB9A25 !important;
	text-shadow: none !important;
	font-family: 'Patua One', cursive;
}

button.btn-success:hover, button.btn-success:active, button.btn-success.active, input[type="button"].btn-success:hover, input[type="button"].btn-success:active, input[type="button"].btn-success.active, input[type="submit"].btn-success:hover, input[type="submit"].btn-success:active, input[type="submit"].btn-success.active, input[type="reset"].btn-success:hover, input[type="reset"].btn-success:active, input[type="reset"].btn-success.active, .btn.btn-success:hover, .table tbody tr td.is-actions a.btn-success:hover, table tbody tr td.is-actions a.btn-success:hover, form fieldset.dark-button-select input[type='radio']+label.btn-success:hover, form fieldset.dark-button-select input[type='radio']+legend.btn-success:hover, #main_content fieldset.time-picker input[type='radio']+label.btn-success:hover, #main_content fieldset.time-picker form fieldset.dark-button-select input[type='radio']+legend.btn-success:hover, form fieldset.dark-button-select #main_content fieldset.time-picker input[type='radio']+legend.btn-success:hover, #main_content form#guest_form fieldset input[type='radio']+label.btn-success:hover, #main_content form#guest_form fieldset.dark-button-select input[type='radio']+legend.btn-success:hover, body.authentication a#account_create:hover, .btn.btn-success:active, .table tbody tr td.is-actions a.btn-success:active, table tbody tr td.is-actions a.btn-success:active, form fieldset.dark-button-select input[type='radio']+label.btn-success:active, form fieldset.dark-button-select input[type='radio']+legend.btn-success:active, #main_content fieldset.time-picker input[type='radio']+label.btn-success:active, #main_content fieldset.time-picker form fieldset.dark-button-select input[type='radio']+legend.btn-success:active, form fieldset.dark-button-select #main_content fieldset.time-picker input[type='radio']+legend.btn-success:active, #main_content form#guest_form fieldset input[type='radio']+label.btn-success:active, #main_content form#guest_form fieldset.dark-button-select input[type='radio']+legend.btn-success:active, body.authentication a#account_create:active, .btn.btn-success.active, .table tbody tr td.is-actions a.btn-success.active, table tbody tr td.is-actions a.btn-success.active, form fieldset.dark-button-select input[type='radio']+label.btn-success.active, form fieldset.dark-button-select input[type='radio']+legend.btn-success.active, #main_content fieldset.time-picker input[type='radio']+label.btn-success.active, #main_content fieldset.time-picker form fieldset.dark-button-select input[type='radio']+legend.btn-success.active, form fieldset.dark-button-select #main_content fieldset.time-picker input[type='radio']+legend.btn-success.active, #main_content form#guest_form fieldset input[type='radio']+label.btn-success.active, #main_content form#guest_form fieldset.dark-button-select input[type='radio']+legend.btn-success.active, body.authentication a.active#account_create {
	background-image: none !important;
	background-color: #3985C3 !important;
	color: #FFFFFF !important;
	text-shadow: none !important;
	font-family: 'Patua One', cursive;
}

/* The color of the Confirm Package message at the bottom of Step 2 */
#ConfirmUpsell_footnote {
	color: #555555;
}