/* CSS Document */


.select2-drop-active {
    z-index: 100000 !important;
}

.caption {
	height: unset;
	overflow: unset;
}

.jq-ry-rated-group.jq-ry-group {
    visibility: hidden;
}

.side-navigation {
    display: block;
    max-width: 300px;
}

.side-navigation > .col-md-3 {
    display: block;
}

button.btn.dark-btn {
    background-color: #067324;
}

header.jumbotron.hero-spacer {
    background-color: #034001;
}

#mc_embed_signup {
	background-color: inherit !important;
}

.header.parallax {
	height: 900px;
}

.parallax {
	height: 400px;
	background-attachment: fixed;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	position: relative;
	z-index: -1;
}

img.main-head-logo {
    max-width: 300px;
}

.white {
    color: #FFFFFF;
    text-decoration: none;
}

.white:hover {
    color: #FFFFFF;
}

.red {
    color: #FF0000;
}

.main-booking {
    font-size: 30px;
}

.align-center {
    width: 350px;
    text-align: center;
}

.parallax::before {
    content: ' ';
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: rgba(0,0,0,0.6);
    opacity: 1;
    z-index: 1;
}

.contact-map {
    position: relative;
}

.booking-form {
    background-color: #FFFFFF;
    padding: 10px;
    border: 2px solid;
    border-radius: 10px;
}

.contact-map .caption {
    left: 25%;
    top: 50%;
    z-index: 10000;
    position: absolute;
    transform: translate(-50%, -50%);
}

.booking-form .btn {
    border: 1px solid;
    border-radius: 15px;
}

.login-page {
    min-height: 600px;
    width: 100%;
    position: relative;
}

.login-form {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    padding: 20px;
    background-color: #FFFFFF;
    border-radius: 20px;
    margin: 60px;
}

.login-page-dark {
    background-color: #222;
}

.footer-wrapper {
    color: #FFF !important;
    text-align: center;
    padding: 20px;
}

span.yellow {
    color: #ffc107;
}

.green {
    color: #00FF00;
    text-decoration: none;
}

.contact-form {padding: 50px;}

.contact-form h2 {
    text-align: center;
}

.nav.sticky-top a.nav-link {
    color: #FFFFFF;
}

.large-text {
    font-size: 9rem;
}

.medium-text {
    font-size: 4rem;
}

.hamburger-element {
	width: 35px;
	height: 30px;
	position: fixed;
	top: 50px;
	right: 50px;
	cursor: pointer;
	display: none;
	flex-direction: column;
	justify-content: space-around;
}

.line {
	width: 100%;
	height: 3px;
	background-color: lawngreen;
	transition: all 0.8s
}

.mobile-navbar {
	width: 100%;
	height: auto;
	position: fixed;
	top: -1000px;
	right: 0;
	left: 0;
	transition: top 0.8s;
	z-index: 20000;
	padding: 0;
	box-sizing: content-box;
	margin-top: 0;
}

.mobile-navbar.change {
	top: 0;
}

 .line-1.change {
	transform: rotateZ(-405deg) translate(-8px,6px);
}

.line-2.change {
	opacity: 0;
}

.line-3.change {
	transform: rotate(405deg) translate(-8px,-6px);
}

.modal-content .ng-scope {
	z-index: 1000;
}

.modal-backdrop.fade.in {
    opacity: .5 !important;
}

.modal.fade.ng-isolate-scope.in {
    z-index: 1050 !important;
    opacity: 1 !important;
}

.modal-dialog {
    margin-top: 100px;
}

@media only screen and (max-width: 800px) {
    .contact-map .caption {
		left: 50%;
	}
}

@media only screen and (max-width: 760px) {
	.caption {
		max-width: 100%;
	}

	img.main-head-logo {
		max-width: 100%;
	}

	.caption .align-center {
		width: 100%;
	}

	.main-booking {
		font-size: unset
	}
}

@media only screen and (max-width: 500px) {
	.hamburger-element {
		display: flex !important;
		z-index: 30000000;
	}
	.nav-main {
	display: none;
	}

	.contact-map {
		padding-top: 100px;
	}

	.contact-map > iframe {
		height: 800px;
	}

	.mobile-navbar > ul.nav.sticky-top.justify-content-center.navbar-dark.bg-dark {
		padding-top: 10px;
		display: block;
		border-radius: 10px;
	}

    .supp-page {
    	padding-top: 100px;
    }
}





.mobile-navbar-menu-bg {
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    height: 100px;
    background-color: #343a40;
    z-index: 19000;
}

.small-img > img.main-head-logo {
    max-width: 150px;
    margin: 5px auto;
}

.caption.small-img {
    text-align: center;
}