html {
	height:100%;
}
body.kiosk {
	overflow:hidden;
	display: block;
    /* flex-direction: column; */
    height: 100%;
    /* min-height: 100vh; */
}
.ios-noscroll {
	overflow:hidden !important;
}

#dealerQuoteForm label {
	display: block;
	position: relative
}

#dealerQuoteForm {
	display: none;
	position: relative
}

#dealerQuoteForm input {
	width: 100%;
	padding: 3px;
	font-size: 20px
}

#dealerQuoteForm div {
	margin-bottom: 10px
}

#dealerQuoteForm label.error {
	display: inline-block;
	color: #f00;
	padding-left: 10px;
}

.quote-input-wrap {
	max-width:500px;
	width:100%;
	margin-left:auto;
	margin-right:auto;
}

#modal-parts-body {
	position:relative;
}

#ajaxRequestSent {
	position: absolute;
	text-align: center;
	width: 100%;
	font-size: 25px;
	top: 50%;
	display:none
}

#emailMe, #send2myEmailSent {
	display:none;
}

#dockBuilderWorking {
	width:125px;
	height:125px;
	position:relative;
	margin:auto;
	top:35%;
	display:none;
}

#dockBuilderWorking .barLoading {
	background-color:#00E220;
	border:3px solid #000;
	opacity:1;
}

#threeBarLoading {
	width:125px;
	height:125px;
	display:block;
	position:relative;
	margin:auto;
	top:35%;
}

#threeBarLoading .barLoading {
	background-color:#0397D6;
	border:3px solid #0397D6;
}

.barLoading {
	float:left;
	height:150px;
	margin-left:7px;
	width:30px;
	opacity:.1;
	animation-name:barBounce;
	-o-animation-name:barBounce;
	-ms-animation-name:barBounce;
	-webkit-animation-name:barBounce;
	-moz-animation-name:barBounce;
	animation-duration:1.5s;
	-o-animation-duration:1.5s;
	-ms-animation-duration:1.5s;
	-webkit-animation-duration:1.5s;
	-moz-animation-duration:1.5s;
	animation-iteration-count:infinite;
	-o-animation-iteration-count:infinite;
	-ms-animation-iteration-count:infinite;
	-webkit-animation-iteration-count:infinite;
	-moz-animation-iteration-count:infinite;
	animation-direction:normal;
	-o-animation-direction:normal;
	-ms-animation-direction:normal;
	-webkit-animation-direction:normal;
	-moz-animation-direction:normal;
	transform:scale(.7);
	-o-transform:scale(.7);
	-ms-transform:scale(.7);
	-webkit-transform:scale(.7);
	-moz-transform:scale(.7)
}

.barLoading_1 {
	animation-delay:.45s;
	-o-animation-delay:.45s;
	-ms-animation-delay:.45s;
	-webkit-animation-delay:.45s;
	-moz-animation-delay:.45s
}

.barLoading_2 {
	animation-delay:.6s;
	-o-animation-delay:.6s;
	-ms-animation-delay:.6s;
	-webkit-animation-delay:.6s;
	-moz-animation-delay:.6s
}

.barLoading_3 {
	animation-delay:.75s;
	-o-animation-delay:.75s;
	-ms-animation-delay:.75s;
	-webkit-animation-delay:.75s;
	-moz-animation-delay:.75s
}

@keyframes barBounce {
	0% {
		transform:scale(1.2);
		opacity:1
	}
	100% {
		transform:scale(.7);
		opacity:.1
	}
}

@-o-keyframes barBounce {
	0% {
		-o-transform:scale(1.2);
		opacity:1
	}
	100% {
		-o-transform:scale(.7);
		opacity:.1
	}
}

@-ms-keyframes barBounce {
	0% {
		-ms-transform:scale(1.2);
		opacity:1
	}
	100% {
		-ms-transform:scale(.7);
		opacity:.1
	}
}

@-webkit-keyframes barBounce {
	0% {
		-webkit-transform:scale(1.2);
		opacity:1
	}
	100% {
		-webkit-transform:scale(.7);
		opacity:.1
	}
}

@-moz-keyframes barBounce {
	0% {
		-moz-transform:scale(1.2);
		opacity:1
	}
	100% {
		-moz-transform:scale(.7);
		opacity:.1
	}
}

.toast {
	/* opacity: 1 !important */
}

.dock-builder-loading {
	background: transparent
		url(/assets/themes/dock_builder/images/misc/ajax-loader-dots.gif)
		no-repeat top center;
	padding-top: 42px
}

#jsGrid .jsgrid-grid-body {
	height: 360px !important
}

#dockBuilderWrap {
	height: 100%;
	width: 100%;
	overflow: hidden;
	position: relative
}

#divCanvas {
	overflow: auto;
	width: 100%;
	height: 850px;
	position: relative;
	/* border: 1px solid #fff; */
}


.kiosk #divCanvas {
	/* height:100%; */
}
.kiosk .btn.btn-primary {
    background-color: #0397D6;
    border-color: #0397D6;
    color: #fff;
}
.kiosk .btn.btn-primary:hover {
    background-color: #0076A8;
    border-color: #0076A8;
}

#divCanvas.sandFill {
	background-color:#fbe9a1;
}
/*
element.style {
    height: 1279px;
    background-image: url(/assets/themes/dock_builder/images/backgrounds/beach_3250x1800.jpg);
    background-size: 100% 720px;
    background-repeat: no-repeat;
}
*/
#divCanvas.dropHere {
	border: 5px solid #00E220
}

#accordionPanel {
	overflow: auto;
	width: 250px;
	position: relative;
	margin-right: -253px;
	float: right
}

#canvasControls {
	position: relative;
	display: block;
	text-align: center;
	padding: 5px;
	padding-top:0;
}

#dockBuilderBoxWrap {
	margin: 0;
	/* border: 1px solid #004B8D; */
	background-color: #004B8D;
	padding: 3px;
	position: relative;
	box-sizing: border-box
}

#dockBuilderBoxWrap.expand {
	position: fixed;
	top: 0;
	left: 0;
	width: 100% !important;
	height: 100% !important;
	z-index: 2000
}
.kiosk #dockBuilderBoxWrap.expand {
	position:relative;
}
.noPointerEvents {
	pointer-events:none;
}
#dropZoneOuter {
	position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* background-color: rgba(0,0,0,0.3); */
	display:none;
	z-index:3000;
}
#dropZoneInner {
	position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 10px;
    border: 5px dashed #00E220;
}
#dropZoneInner.dragEnter {
	border-color:5px solid #00E220;
}
#dropZoneInner.dragLeave {
	border-color:5px solid #f89406;
}
#dropZoneInner2 {
	position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 5px solid #000;
}

#quoteFormLoading {
	position: absolute;
	width: 100%;
	height: 100%;
	min-height: 100%;
	background: rgba(255, 255, 255, .7);
	top: 0;
	left: 0;
	display: none;
	z-index: 5000
}

#quoteFormLoading.ajaxRequestComplete {
	background: rgba(255, 255, 255, 1);
}

#dockBuilderMask {
	display: block;
	position: absolute;
	z-index: 5000;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	min-height: 100%;
	background-color: rgba(255, 255, 255, .8);
	vertical-align: middle;
	text-align: center
}

#dockBuilderMask .dockBody {
	border: 5px solid #000;
	background: #fff;
	display: inline-block;
	max-width: 500px;
	width: 100%;
	max-height: 500px;
	overflow: auto;
	margin: 0;
	padding: 20px;
	color: #000;
	margin-top: 15%
}

#dockBuilderBox {
	margin: 0;
	padding: 0;
	position: relative;
	padding-right: 253px;
	box-sizing: border-box
}

.menuMaxHeight {
	max-height: 600px;
	overflow: auto
}
#accordion.full-size .menuMaxHeight {
	max-height: calc(100vh - 300px);
}

#accordion {
	overflow: hidden;
	max-height: 870px
}
#accordion.full-size {
	max-height: calc(100vh - 10px);
}
#accordion ul {
	border: none;
	margin-left: 1px
}

#accordion ul li.list-group-item {
	overflow: auto
}

#accordion .panel-default {
	border-color:#004B8D;
}
#accordion .list-group-item {
	padding:0;
	display:flex;
	flex-direction:row;
	flex-wrap:nowrap;
}
#accordion .list-group-item span {
	flex-grow:1;
	width:50%;
}
.partsMenuText {
	font-size: 16px;
	line-height: 18px;
	color: #000;
	padding:15px;
}
.partsMenuImg {
	text-align: center;
}
.img-drag-drop {
	z-index:4000;
	-webkit-user-select: none;
	touch-action:none;
	user-select:none;
	width:auto;
	max-width:80px;
	height:auto;
	max-height:120px;
	padding:15px;
}
.img-drag-drop.touchactive {
    position: absolute;
    border-radius: 15px;
    border: 3px dashed #0f0;
    background-color: rgba(0,255,0,.4);
}

#accordion li span.partsMenuImg img {
	cursor: pointer
}

#accordion .panel-title {
	text-transform: uppercase;
	font-weight: bold
}

#accordion .panel-default>.panel-heading {
	background-color: #eaeaea
}

#accordion .panel-collapse.collapse.in {
	border-top: 1px solid #ddd
}

#accordion .panel-heading {
	padding: 0
}
#accordion .panel {
	border:unset;
}

#accordion .panel-heading a {
	padding: 3px 10px;
	display: block;
	text-decoration: none;
	background-color: #0397D6;
	color: #fff;
	font-size:25px;
	line-height:35px;
}

#accordion .panel-heading a:hover {
	color: #fff;
	background-color: #0076A8
}

#getDealerQuote {
	display: none
}

#canvasControls button {
    font-size: 35px;
    line-height: 35px;
    padding: 3px 8px;
    margin-left: 1px;
	min-width:40px;
}
#canvasControls .btn-group {
    margin-right: 2px;
    margin-left: 2px;
	margin-top:5px;
}

#canvasControls button i {
	font-size: 23px;
	line-height: 23px;
	padding: 0
}

#dockBuilderBoxHeader {
	color: #fff;
	font-size: 28px;
	line-height: 24px;
	overflow: auto;
	background-color: #004B8D;
	padding: 3px;
	margin-bottom: 3px;
	text-align:center;
}
.dockBuilderBoxTitle {
	float:left;
}

#dockBuildWidthLength {
    font-size: 17px;
    line-height: 18px;
    padding: 3px 10px;
    display: none;
    text-transform: uppercase;
    border: 1px solid #0397D6;
    border-radius: 15px;
    margin-left: -230px;
	cursor:default;
}

#dockBuilderBoxHeader i {
    float: right;
    color: #fff;
    background-color: #0397D6;
    font-size: 16px;
	line-height:16px;
    padding: 5px 7px;
    cursor: pointer;
}

#dockBuilderBoxHeader i:hover {
	background-color: #0076A8;
}

@keyframes fadeInOut {
	50% {
		opacity: .3;
	}
}

@keyframes borderBlink {
	50% { border-color: #000; }
}

.canvasBorderBlink {
	animation: borderBlink 1s linear infinite;
}
#dropZoneOuter.canvasBorderBlinkOn {
	display:block !important;
}
#dropZoneInner.canvasBorderBlink {
	border: 5px solid #f89406;
}

.canvasFlasher {
	animation: fadeInOut 1s linear infinite;
}

.save-canvas, .delete-saved-canvas {
	display:none;
}
.save-canvas.save-to-db, .save-canvas.save-to-local, .delete-saved-canvas.delete-from-db, .delete-saved-canvas.delete-from-local {
	display:inline-block;
}

.ios-content .btn.btn-primary.wa-button-selected {
	background-color:#fff;
	border-color:#fff;
	color: #0397D6;
}

.hide-email-only {
	display:none;
	text-align:left;
}
.show-email-only {
	display:block;
}
.default-footer-view .hide-email-only {
	display:block;
}
.default-footer-view .show-email-only {
	display:none;
}
.email-me-only {
    display: block;
    width: 100%;
	text-align:left;
}
#emailMeOnly {
    max-width: 200px;
    display: inline-block;
}
.create-my-account {
	width:100%;
	display:block;
	padding-top:5px;
}
.create-my-account label {
	cursor:pointer;
}
.create-my-account label:hover {
	text-decoration:underline;
}

/*
#accordion .pwc_boat_ports .list-group-item {
    flex-direction: column;
}
#accordion .pwc_boat_ports .list-group-item span {
    flex-grow: 2;
    width: 100%;
    margin-top: -10px;
}
#accordion .pwc_boat_ports .list-group-item span img.img-drag-drop {
    max-height: 200px;
    max-width: 90px;
    transform: rotate(90deg);
    padding-bottom: 0;
    padding-top: 0;
}
*/

/* Define the "system" font family */
@font-face {
  font-family: system;
  font-style: normal;
  font-weight: 300;
  src: local(".SFNSText-Light"), local(".HelveticaNeueDeskInterface-Light"), local(".LucidaGrandeUI"), local("Ubuntu Light"), local("Segoe UI Light"), local("Roboto-Light"), local("DroidSans"), local("Tahoma");
}

/* Print Styles */
@media print {
	header.ios-header {display:none !important}
	footer.ios-footer {display:none !important}
	.ios-woo-breadcrumb {display:none !important}
	#dockBuilderBoxWrap {display:none !important}
	#print-modal {display:block !important;opacity:1 !important;position:relative !important}
	#print-modal .modal-lg {max-width:1280px !important;width:100% !important}
	#print-modal .modal-header {padding:15px 0 !important; margin-bottom:15px !important}
	#print-modal .modal-body {padding:0 !important}
	#print-modal .modal-content {border:none !important}
	#print-modal .modal-dialog {
	    -webkit-transform: none !important;
	    -ms-transform: none !important;
	    -o-transform: none !important;
	    transform: none !important;
	    -webkit-transition: none !important;
	    -moz-transition: none !important;
	    -o-transition: none !important;
	    transition: none !important;
	}
	#print-modal, #print-modal td, #print-modal th, #print-modal .modal-header {font-family: system !important}
	    .no-print, .no-print *
	    {
	        display: none !important;
	    }

}
