@charset "utf-8";


/* Open Sans Condensed - Navi */
@import url('https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300&display=swap');

/* Asap Condensed - Overlay title text - Home */
@import url('https://fonts.googleapis.com/css?family=Asap+Condensed&display=swap');

/* Kaushan Script - Title on Gray BG - Home */
@import url('https://fonts.googleapis.com/css?family=Kaushan+Script&display=swap');

/* Pompiere - Text on Gray BG - Home */
@import url('https://fonts.googleapis.com/css?family=Pompiere&display=swap');

/* Bellota Text - Middle Contents - Home */ 
@import url('https://fonts.googleapis.com/css?family=Bellota+Text&display=swap');

/* Roboto Condensed */
@import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed&display=swap');


html, body {
	font-family: 'Open Sans Condensed', sans-serif !important;
}


body {
	position: relative;
	color: #333;
	background-color: #fff;
}


.clear {
  clear: both;
}

a.red, .red {
	color: #FF0000 !important;
	text-decoration: none;
}

a.red:hover {
	color: #096fa9 !important;
	text-decoration: none;
	transition: all .4s ease 0s;
	cursor:pointer;
}

/** Gradient BG Color https://cssgradient.io/ **/
.bg_grad { /* Linear #30b4d0 and #058ac1 */
	background: rgb(48,180,208);
	background: -moz-linear-gradient(0deg, rgba(48,180,208,1) 0%, rgba(5,138,193,1) 100%);
	background: -webkit-linear-gradient(0deg, rgba(48,180,208,1) 0%, rgba(5,138,193,1) 100%);
	background: linear-gradient(0deg, rgba(48,180,208,1) 0%, rgba(5,138,193,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#30b4d0",endColorstr="#058ac1",GradientType=1);
}

/******************************************/

.row {
	text-align: center;
}

.row-L {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
       flex-wrap: wrap;
	margin-right: -15px;
	margin-left: -15px;
	text-align: left;
}



/*******************************/

.top_icons {
	float: left;
	width: 100px;
	position: relative;
}

.top_icons a {
	color: #FFFFFF !important;
	text-decoration: none;
}

.top_icons a:hover {
	color: #ccff00 !important;
	text-decoration: none;
	transition: all .4s ease 0s;
	cursor:pointer;
}




/* ==================================================
	NAVI
================================================== */

nav {
	letter-spacing: 1.2px
}


/* Bootstrap 4 navbar Transitions background color on Scroll */

.nav-bg {
  	transition: 600ms ease;
	background-color: rgba(51, 51, 51, 0.7) !important;
}

.nav-bg.scrolled {
	background-color: #333333 !important;
}

/****************************/

@media (min-width: 990px) {
	.nav-bg {
  		transition: 600ms ease;
		background-color: transparent !important;
	}
}

/****************************/

.navbar-dark {
	color: #ccff00 !important;
}

.navbar-dark .navbar-nav .nav-link {
	color: rgba(255, 255, 255, 1.0) !important;
	-webkit-transition: all .4s ease-in-out;
	-moz-transition: all .4s ease-in-out;
	-o-transition: all .4s ease-in-out;
	transition: all .4s ease-in-out;
	font-weight: bold;
}

.navbar-dark .navbar-nav .nav-link:hover,
.navbar-dark .navbar-nav .nav-link:focus {
	color: rgba(204, 255, 0, 1.0) !important;
}

.navbar-dark .navbar-nav .nav-link.disabled {
	color: rgba(255, 255, 255, 1.0) !important;
}

.navbar-dark .navbar-nav .show > .nav-link,
.navbar-dark .navbar-nav .active > .nav-link,
.navbar-dark .navbar-nav .nav-link.show,
.navbar-dark .navbar-nav .nav-link.active {
	color: #ccff00 !important;
}

.navbar-dark .navbar-toggler {
	color: rgba(255, 255, 255, 0.0);
	border-color: rgba(255, 255, 255, 0.0);
}

/*********************************************/

/*** To change color "hamburger icon" change value in the SVG data
stroke='rgba(255,102,203, 0.5)'

.navbar-light .navbar-toggler-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0, 0, 0, 0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}
***/

.navbar-toggler:focus,
.navbar-toggler:active {
    outline: 0;
}

.navbar-toggler span {
   display: block;
   background-color: #FFFFFF;
   height: 3px;
   width: 25px;
   margin-top: 4px;
   margin-bottom: 4px;
   -webkit-transform: rotate(0deg);
   -moz-transform: rotate(0deg);
   -o-transform: rotate(0deg);
   transform: rotate(0deg);
   opacity: 1;
}

.navbar-toggler span:nth-child(1),
.navbar-toggler span:nth-child(3) {
   -webkit-transition: transform .35s ease-in-out;
   -moz-transition: transform .35s ease-in-out;
   -o-transition: transform .35s ease-in-out;
   transition: transform .35s ease-in-out;
}

.navbar-toggler:not(.collapsed) span:nth-child(1) {
    margin-top: 0px;
    -webkit-transform: rotate(135deg);
    -moz-transform: rotate(135deg);
    -o-transform: rotate(135deg);
    transform: rotate(135deg);
    opacity: 0.9;
}

.navbar-toggler:not(.collapsed) span:nth-child(2) {
    height: 12px;
    visibility: hidden;
    background-color: transparent;
}

.navbar-toggler:not(.collapsed) span:nth-child(3) {
    margin-top: -22px;
    -webkit-transform: rotate(-135deg);
    -moz-transform: rotate(-135deg);
    -o-transform: rotate(-135deg);
    transform: rotate(-135deg);
    opacity: 0.9;
}


/*------- Dropdown Navi -------*/

.dropdown-menu {
	background-color: rgba(90, 90, 90, 0.7) !important;
	
}

.dropdown-menu a {
	color: #FFFFFF !important;
	text-decoration: none;
}

.dropdown-menu a:hover {
	color: #ccff00 !important;
	background-color: rgba(51, 51, 51, 0.7) !important;
	text-decoration: none;
	transition: all .4s ease 0s;
	cursor:pointer;
}


/* Slidenav 4.1.0-alpha.2 ( https://github.com/tightcode/slidenav ) */
.dropdown-menu.collapsing {
  display: block;
}

/* Original 767.98px */
@media (max-width: 989.98px) {
  .dropdown-menu {
    padding: 0;
    margin-top: 0!important;
    border: 0!important;
  }
  .dropdown-menu:before {
    content: "";
    display: block;
    padding-top: .5rem;
  }
  .dropdown-menu:after {
    content: "";
    display: block;
    padding-bottom: .5rem;
  }
}

/* Original 768px */
@media (min-width: 990px) {
  .dropdown>div {
    position: absolute;
    clip: rect(0.5rem, 9999px, 9999px, -9999px);
  }
  .dropdown-menu {
    height: auto!important;
    transition: transform .35s ease!important;
  }
  .dropdown-menu.collapse, .dropdown-menu.sliding {
    transform: translate(0, -100%);
  }
  .dropdown-menu.collapse:not(.show) {
    display: block;
  }
  .dropdown-menu.collapse.show {
    transform: translate(0, 0);
  }
}




/* ==================================================
	Responsive BG Full Width with Overlay
================================================== */


#top-viewport {
	position: relative;
	margin-top: 0;
	width: 100%;
	height: auto;
	overflow: hidden;
	z-index: -1;
	/*background-color: #FFFFFF;*/
}


/**** Adjust top of image under Navi ****/

.adjust-top {
	position: relative;
	margin-top: 0;
	z-index: -1; 
}

@media (min-width: 990px) {
	.adjust-top {
		position: relative;
		margin-top: -56px !important;
	}
}


/*----------------------------------*/

.ovarlay_bg { 
	position: absolute;
	max-height: 100%;
	max-width: 100%;
	width: auto;
	height: auto;
	z-index: 10;
	left: 0;
	bottom: 0;
}

.overlay_content {
	position: absolute;
   top: 55%;
   left: 0;
   width: 100%;
   text-align: center;
	z-index: 11;
}

h1.overlay_title, h2.overlay_text {
	font-family: 'Asap Condensed', sans-serif;
	color: #FFFFFF;
	text-shadow: 1px 1px 5px #666666, 0 5px 10px #666666;
}

/* on Home page*/
h1.overlay_title {
	font-size: 7vw !important;
}
h2.overlay_text {
	font-size: 5vw !important;
}

/*----------------------------------*/



/* ==================================================
	BG Gray Middle Contents - Home Page
================================================== */

.bg-gray {
	background-color: #EEEEEE;
}

h1.mid_title {
	font-family: 'Kaushan Script', cursive;
	color: #096fa9;
	font-size: 30px !important;
}

h3.mid_text {
	font-family: 'Pompiere', cursive;
	color: #333333;
	font-size: 24px !important;
	line-height: 36px;
}

/*----------------------------------*/





/* ==================================================
	Adjust Top Position of Section for Responsive Scrollspy
================================================== */

section {
	margin-top: -240px;
	padding-top: 240px;
	/*padding-bottom: 200px;*/
}


@media (min-width: 990px) {
	section {
		margin-top: 0;
		padding-top: 0;
	}
}



/* ==================================================
	ANIMATE
================================================== */


.box-text {
	font-family: 'Bellota Text', cursive;
	padding: 50px 50px 50px 50px;
}

.box-img1, .box-img2, .box-img3, .box-img4, .box-img5 {
	width: 100%;
	display: block;	
	position: relative;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	 
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	overflow: hidden;
	
	background-repeat: no-repeat;
	background-position: center center;
	height: 460px;
}

.box-img1 {
	background-image: url(../images/pic_01.jpg);
}
.box-img2 {
	background-image: url(../images/pic_02.jpg);
}
.box-img3 {
	background-image: url(../images/pic_03.jpg);
}
.box-img4 {
	background-image: url(../images/pic_04.jpg);
}
.box-img5 {
	background-image: url(../images/pic_05.jpg);
}

h1.title {
	color:#323336;
	font-family: 'Bellota Text', cursive;
	font-size: 45px;
	line-height: 50px;
	font-weight: normal;
	padding-bottom: 30px;
}


@media only screen and (max-width : 1024px) {
  .box-text {
    padding: 50px 50px 50px 50px;
  }
}

@media only screen and (max-width : 768px) {
	h1.title {
		font-size: 30px;
		line-height: 30px;
	}
	.box-text{
		padding:100px 30px 100px 30px;
	}
}





/* ==================================================
	FOOTER
================================================== */

/**-- Contact Info --**/

.bg-blue {
	background-color: #096fa9;
}

a.wt, .wt {
	color: #FFFFFF !important;
	text-decoration: none;
}

a.wt:hover {
	color: #ccff00 !important;
	text-decoration: none;
	transition: all .4s ease 0s;
	cursor:pointer;
}

.title-md {
	font-family: 'Asap Condensed', sans-serif;
	font-size: 22px;
	font-weight: bold;
	letter-spacing: 1.25pt;
}

hr {
	height: 1px;
	border: none;
	color: #fff;
	background-color: #fff;
	width: 95%;
	text-align: center;
	margin: 0 auto;
}

/*---------------------*/

footer {
	padding-top: 50px;
	padding-bottom: 50px;
	/*font-family: 'Josefin Sans', sans-serif;*/
}


/******** Font Awesome icon Color on FOOTER  *********/

a.icon_gray, .icon_gray {
	color: #323336 !important;
	text-decoration: none;
}

a.icon_gray:hover {
	color: #97999c !important;
	text-decoration: none;
	transition: all .4s ease 0s;
	cursor:pointer;
}



/* ==================================================
	LOCATIONS
================================================== */

.loc-title, .loc-text {
	color:#323336;
	font-family: 'Bellota Text', cursive;
	text-align: center;
}

.loc-title {
	font-size: 30px;
	font-weight: normal;
	padding: 30px 0 20px 0;
}

.loc-text {
	font-size: 24px !important;
	font-weight: bold;
	text-shadow: 1px 1px 5px #FFF, 0 5px 10px #FFF;
	letter-spacing: 1.25pt;
}

@media only screen and (max-width : 768px) {
	.loc-text {
		font-size: 42px !important;
	}
}



/* ==================================================
	PACKING TIPS - Accordion Collapse Icons
================================================== */

/* Font Awesome 5 Not Working Without font-weight: 900; */

.accordion .card-header:after {
	font-family: "Font Awesome\ 5 Free"; 
	content: "\f068";
	float: right;
	font-weight: 900; /* NEED THIS to WORK */
}
.accordion .card-header.collapsed:after {
    /* symbol for "collapsed" panels */
	content: "\f067";
	font-weight: 900; /* NEED THIS to WORK */
}

.card {
	font-family: 'Bellota Text', cursive;
}

.font-slim {
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 18px;
}

@media only screen and (max-width : 320px) {
	.font-slim {
		font-size: 13px;
	}
}

/* ==================================================
	CONTACT INFO
================================================== */

.bg-yellow {
    background-color: #fbf18e;
}

.box-contact {
	font-family: 'Bellota Text', cursive;
	padding-top:80px;
	padding-bottom:80px;
}

.box-contact-form {
	font-family: 'Bellota Text', cursive;
	padding-top:80px;
	padding-bottom:80px;
	padding-left: 50px;
	padding-right: 50px;
}

.form-border {
   box-shadow: none !important;
   outline: none !important;
	border-bottom: thin solid #333333;
	border-left: none;
	border-top: none;
	border-right: none;
	background-color: #eeeeee;
}

.form-border:focus {
	background-color: #eeeeee;
	transition: all .4s ease 0s;
}

.form-control {
	border-radius:0;
}

.form-control:focus {
	border-color: #6495ed; /* #80bdff */
	transition: all .4s ease 0s;
}


/**** Change Placeholder Text Color when input ****/
.form-control:focus::-webkit-input-placeholder {
	color: #cccccc;
	opacity: 1;
 	transition: all .4s ease 0s;
}

.form-control:focus::-moz-placeholder {
	color: #cccccc;
	opacity: 1;
	transition: all .4s ease 0s;
}

.form-control:focus:-ms-input-placeholder {
	color: #cccccc;
	opacity: 1;
	transition: all .4s ease 0s;
}

.form-control:focus::-ms-input-placeholder {
	color: #cccccc;
	opacity: 1;
	transition: all .4s ease 0s;
}

.form-control:focus::placeholder {
	color: #cccccc;
	opacity: 1;
	transition: all .4s ease 0s;
}


.btn:hover {
	/*background-color: #eeeeee;*/
	transition: all .4s ease 0s;
}


.mb-40 {
	margin-bottom: 40px !important;
}

.mb-30 {
	margin-bottom: 30px !important;
}


@media only screen and (max-width : 768px) {
	
  .box-contact {
  		padding-top:40px;
  		padding-bottom:40px;
  	}
  	
	.row-sm-fix {
		margin-right: -30px;
    	margin-left: -30px; 
	}
	
}


@media only screen and (max-width : 320px) {
	.row-sm-fix {
		margin-right: -20px;
    margin-left: -20px; 
	}
}


/*--- SPAM Honey-Pot 2 of 3 ---*/
/* https://elasticemail.com/blog/marketing_tips/how-to-prevent-bots-from-spamming-your-sign-up-forms/ */
.dispnon {
	display: none
}

/******************************/



/* #GMAPS 1 #NEW
=====================================================*/
#google-map {
  height: 600px;
  position: relative;
  background-color: #eee !important;
  z-index: 1;
}
.gmnoprint, .gm-style-cc {
  /* display:none !important; */
}
.google-map-container {
	text-align:center;
	padding-top: 25px;
}