/*--------------------------------------------------------------
TABLE OF CONTENTS:
----------------------------------------------------------------
1.0 Typography
2.0 Palette
3.0 Header
4.0 Navbar
5.0 Sidebar
6.0 Footer
7.0 Contents
	7.1 Homepage
	7.2 Listings
	7.3 Single
	7.4 Search
8.0 Pagination
9.0 Forms
10.0 Buttons
11.0 Tables
12.0 Modals
13.0 Cards
14.0 Icons
15.0 Global Classes
--------------------------------------------------------------*/

/*--------------------------------------------------------------
1.0 Typography
--------------------------------------------------------------*/
body,
button,
input,
select,
textarea {
	color: #6c757d;
	font-family: 'Lato', sans-serif;
}

h1, h2, h3, h4, h5, h6 {
	color: #262626;
	font-family: 'Lato', sans-serif;
	font-weight: 700;
}

h5 {
	font-size: 1.125rem;
}

a, a.h1, a.h2, a.h3, a.h4, a.h5, a.h6 {
	color: #262626;
	text-decoration: none;
}

a:hover, a:focus {
	color: #262626;
	text-decoration: none;
}

.breadcrumbs a {
	color: #6c757d;
	text-decoration: none;
}

.breadcrumbs a:hover, .breadcrumb a:focus,.breadcrumb > .active {
	text-decoration: none;
}

.text-dark {
	color: #262626;
}

.text-muted {
	color: #a8adb1!important;
}

/*--------------------------------------------------------------
2.0 Palette
--------------------------------------------------------------*/
.bg-main {
	background-color: #ebf1f5;
}

.bg-summersky {
	background-color: #34ace0;
}

.txt-summersky {
	color: #34ace0;
}

.bg-devil-blue {
	background-color: #227093;
}

.txt-devil-blue {
	background-color: #227093;
}

.bg-fluorescent-red {
	background-color: #ff5252;
}

.txt-fluorescent-red {
	color: #ff5252;
}

.bg-celestial-green {
	background-color: #33d9b2;
}

.txt-celestial-green {
	color: #33d9b2;
}

.bg-liberty {
	background-color: #474787;
}

.txt-liberty {
	color: #474787;
}

.bg-pumpkin {
	background-color: #ff793f;
}

.txt-pumpkin {
	color: #ff793f;
}

.bg-logo-green {
	background-color: #8bc53e;
}

.txt-logo-green {
	color: #8bc53e;
}

.border-green {
	border: 1px solid #8bc53e!important;
}

/*--------------------------------------------------------------
3.0 Header
--------------------------------------------------------------*/
#header-nav {
	background-color: #fff;
	border-bottom: 1px solid #8bc53e;
	border-bottom: 1px solid #dfe6e9;
}

.tpl-home #header-nav {
	border-bottom: 0;
}

@media screen and (max-width: 768px) {
	#header-nav, #header-nav.transparent {
		background-color: white;
		border-bottom: 1px solid #8bc53e;
	}

	.nav-item .btn {
		display: block;
		text-align: left;
	}
}

#header-nav.transparent {
	transition: 700ms;
	background-color: transparent;
}

#header-nav.solid {
	transition: 700ms;
	background-color: white;
	border-bottom: 1px solid #8bc53e;
}

.container-header {
	background-color: #ebf1f5;
	background-color: #fff;
}

#header-nav a, #header-nav a:hover, #header-nav a:active {

}

/*--------------------------------------------------------------
5.0 Sidebar
--------------------------------------------------------------*/

/*--------------------------------------------------------------
6.0 Footer
--------------------------------------------------------------*/

/*--------------------------------------------------------------
7.0 Contents
--------------------------------------------------------------*/
#place-map-wrapper, #map-wrapper {
	width: 100%;
	height: 240px;
	border: 1px solid #eee;
}

#map-wrapper {
	height: 360px;
}

@media (min-width: 1200px) {
	.container {
			max-width: 1170px;
	}
}

.sidebar-map {
	width: 100%;
	height: 372px;
	border: 1px solid #eee;
}

.featured {
	background-color: #
}

.show-cats {
	margin-left: 0;
	padding-left: 0;
	list-style-type: none;
	-webkit-column-count: 2;
	-moz-column-count: 2;
	column-count: 2;
	-webkit-column-gap: 20px;
	column-gap: 20px;
	-moz-column-gap: 20px;
}

.show-cats ul {
	list-style-type: none;
}

	/*--------------------------------------------------------------
	7.1 Homepage
	--------------------------------------------------------------*/
	.tpl-home #header-nav {
		background-color: transparent;
	}

	@media screen and (max-width: 768px) {
		.tpl-home #header-nav, .tpl-home #header-nav.transparent {
			background-color: white;
			border-bottom: 1px solid #8bc53e;
		}

		.tpl-home .nav-item .btn {
			display: block;
			text-align: left;
		}
	}

	.tpl-home #header-nav.transparent {
		transition: 700ms;
		background-color: transparent;
	}

	.tpl-home #header-nav.solid {
		transition: 700ms;
		background-color: white;
		border-bottom: 1px solid #8bc53e;
	}

	.tpl-home .card-title {
		text-shadow: -1px 1px 3px rgba(0,0,0,0.2), -2px 2px 6px rgba(0,0,0,0.3);
	}

	.tpl-home .card, .tpl-home .card {
		overflow: hidden;
	}

	.a-img-wrap {
		height: 220px;
		overflow: hidden;
	}

	.tpl-home .card-img-top {
		object-fit: cover;
	}

	.tpl-home .card img {
		transition: transform 0.3s ease-in-out;
	}

	.tpl-home .card:hover img {
		transform: scale(1.12);
	}

	.tpl-home .jumbotron {
		border-radius: 0;
		background-position: center top;
		background-repeat: no-repeat;
		background-size: cover;
		height: 620px !important;
	}

	/* In case card columns are used */
	@media (min-width: 34em) {
		.tpl-home .card-columns {
			-webkit-column-count: 3;
			-moz-column-count: 3;
			column-count: 3;
		}
	}

	@media (min-width: 62em) {
		.tpl-home .card-columns {
			-webkit-column-count: 4;
			-moz-column-count: 4;
			column-count: 4;
		}
	}

	.tpl-home .featured-city {
		margin-bottom: 30px;
	}

	.tpl-home .city-img {
		width: 100%;
		height: 240px;
		object-fit: cover;
		border-radius: calc(.25rem - 1px);
	}

	.tpl-home .city-name {
		left: 50%;
		top: 50%;
		transform: translate(-50%,-50%);
        color: #fff;
        font-size: 1rem;
        position: absolute;
		text-shadow: -1px 1px 3px rgba(0,0,0,0.2), -2px 2px 6px rgba(0,0,0,0.3);
	}

	/* Make select2 styles look like Bootstrap */
	.tpl-home .select2-container--default .select2-selection--single {
		background-clip: padding-box;
		background-color: #fff;
		border-radius: .25rem;
		border: 1px solid #ced4da;
		color: #495057;
		display: block;
		font-size: 1.25rem;
		height: calc(2.875rem + 2px);
		line-height: 1.5;
		padding: .375rem .75rem;
		padding: .5rem 1rem;
		transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
		width: 100%;
	}

	.tpl-home .select2-container--default .select2-selection--single .select2-selection__arrow {
		height: calc(2.875rem + 2px);
		position: absolute;
		top: 1px;
		right: 1px;
		width: 20px;
	}

	.tpl-home .select2-container--default .select2-selection--single .select2-selection__rendered {
		color: grey;
		line-height: 28px;
	}

	/*--------------------------------------------------------------
	7.2 Listings
	--------------------------------------------------------------*/
	.tpl-listings #map-col {
		margin-left: 58.33%;
		padding:0;
	}

	@media (max-width: 992px) {
		.tpl-listings #map-col {
			margin-left: 0;
			padding:0;
			margin-top:0;
			height: 300px;
		}

		.tpl-listings #sticker {
			height: 300px;
		}

		.tpl-listings #map-canvas {
			height: 300px;
		}
	}

	.tpl-listings .card {
		border: 1px solid #8bc53e;
		border: 1px solid #ced4da;
		border: 1px solid #dfe6e9;
	}

	/*--------------------------------------------------------------
	7.3 Single
	--------------------------------------------------------------*/
	.tpl-listing #business-header {
		background-color: #F8F9FA;
		background-color: #ecf0f1;
		background-color: #F8F9FA;
	}

	.tpl-listing .breadcrumbs {
		font-size: 0.85rem;
	}

	.tpl-listing .fab.fa-facebook-square {
		background: #fff;
		padding: 1px 4px 3px 4px;
		color: rgb(58, 88, 154);

	}

	.tpl-listing .fab.fa-twitter-square {
		background: #fff;
		padding: 1px 4px 3px 4px;
		color: #49b6e5;
	}

	/*--------------------------------------------------------------
	7.4 Search, Advanced Search
	--------------------------------------------------------------*/
	.tpl-search #map-col, .tpl-advanced-results #map-col {
		margin-left: 58.33%;
		padding:0;
	}

	@media (max-width: 768px) {
		.tpl-search #map-col, .tpl-advanced-results #map-col {
			margin-left: 0;
			padding:0;
			margin-top:0;
			height: 300px;
		}

		.tpl-search #sticker, .tpl-advanced-results #sticker {
			height: 300px;
		}

		.tpl-search #map-canvas, .tpl-advanced-results #map-canvas {
			height: 300px;
		}
	}

	.tpl-search .card {
		border: 1px solid #8bc53e;
		border: 1px solid #ced4da;
		border: 1px solid #dfe6e9;
	}

/*--------------------------------------------------------------
8.0 Pagination
--------------------------------------------------------------*/
.page-item.active .page-link {
	color: #fff;
	background-color: #34ace0;
	border-color: #34ace0;
}

.page-link {
	color: #34ace0;
	border: 1px solid #dee2e6;
}

/*--------------------------------------------------------------
9.0 Forms
--------------------------------------------------------------*/

/*
Add fontawesome font-family to input fields so that it can be used as placeholder
*/

input, select {
	font-family: 'FontAwesome', 'Lato', sans-serif;
}

/*
Placeholder color
*/

::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
	opacity: 0.5; /* Firefox */
	font-family: "Lato", sans-serif;
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
	/*color: red;*/
}

::-ms-input-placeholder { /* Microsoft Edge */
	/*color: red;*/
}

/*
Input group prepend/append overwrite Bootstrap styles
*/

.input-group-text {
	font-weight: 400;
	color: #333;
	text-align: center;
	background-color: #fff;
}

/* Make select2 styles look like Bootstrap */
.select2-container--default .select2-selection--single {
	background-clip: padding-box;
	background-color: #fff;
	border-radius: .25rem;
	border: 1px solid #ced4da;
	border: 1px solid #dfe6e9;
	color: #495057;
	display: block;
	font-size: 1.25rem;
	height: calc(2.25rem + 2px);
	line-height: 1.5;
	padding: .375rem .75rem;
	transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
	width: 100%;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
	height: calc(2.85rem + 2px);
	position: absolute;
	top: 1px;
	right: 1px;
	width: 20px;
}

/* Main search select2 styles */
#mainSearch {
	background-color: #ced4da;
	background-color: #dfe6e9;
	z-index: 1100;
}

.select2-dropdown {
	z-index: 1101;
}

#mainSearch .select2 {
	position: relative;
	-ms-flex: 1 1 auto;
	flex: 1 1 auto;
	width: 1%;
	margin-bottom: 0;
}

#mainSearch  .select2-container--default .select2-selection--single .select2-selection__rendered {
	text-align: left;
	color: #6C7592;
	line-height: 1.5;
}

#mainSearch  .select2-container--default .select2-selection--single {
	background-color: #fff;
	border: 1px solid #aaa;
}

#mainSearch .select2-container--default .select2-selection--single {
	background-clip: padding-box;
	background-color: #fff;
	border-radius: .25rem;
	border: 1px solid #ced4da;
	border: 1px solid #dfe6e9;
	color: #495057;
	display: block;
	font-size: 1.25rem;
	height: calc(2.85rem + 2px);
	line-height: 1.5;
	padding: .375rem .75rem;
	transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
	width: 100%;
}

#mainSearch .select2-selection .select2-selection--single {
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
}

/*--------------------------------------------------------------
10.0 Buttons
--------------------------------------------------------------*/
.delete_pic, .delete_existing_pic {
	cursor: pointer;
}

.social-btn {
	background-color: #eee;
	border-radius: 100%;
	color: #fff;
	display: inline-block;
	font-size: 18px;
	height: 36px;
	padding: 4px 0;
	text-align: center;
	width: 36px;
}

.social-btn.facebook {
	background: #3b5998;
}

.social-btn.twitter {
	background: #55acee;
}

.btn-primary {
	color: #fff;
	background-color: #34ace0;
	border-color: #34ace0;
}

.btn-primary:hover {
	color: #fff;
	background-color: #227093;
	border-color: #227093;
}

.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show>.btn-primary.dropdown-toggle {
	color: #fff;
	background-color: #227093;
	border-color: #227093;
}

.btn-outline-secondary {
	border-color: #ced4da;
	border-color: #dfe6e9;
}

.btn-outline-secondary:hover {
	border-color: #ced4da;
	border-color: #dfe6e9;
}

/*--------------------------------------------------------------
11.0 Tables
--------------------------------------------------------------*/

/*--------------------------------------------------------------
12.0 Modals
--------------------------------------------------------------*/
.modal {
	z-index: 2000;
}

/*--------------------------------------------------------------
13.0 Cards
--------------------------------------------------------------*/
.card-featured {
	background-color: #ebf1f5;
}

.card-img {
    width: 100%;
    height: 192px;
    object-fit: cover;
}

.card {
	border: 1px solid #8bc53e; /* green */
	border: 1px solid #ced4da;
	border: 1px solid #dfe6e9;
	border-radius: .25rem;
}

.card-header {
	padding: .75rem 1.25rem;
	margin-bottom: 0;
	background-color: #fff;
	border-bottom: 1px solid #ced4da;
	border-bottom: 1px solid #dfe6e9;
}

.card-footer {
	padding: .75rem 1.25rem;
	background-color: #fff;
	border-top: 1px solid #ced4da;
	border-top: 1px solid #dfe6e9;
}

/*--------------------------------------------------------------
14.0 Icons
--------------------------------------------------------------*/
.icon-wrapper72 {
	display: inline-block;
	font-size: 48px;
	height: 72px;
	line-height: 72px;
	text-align: center;
	vertical-align: middle;
	width: 72px;
}

.icon-wrapper36 {
	display: inline-block;
	font-size: 24px;
	height: 36px;
	line-height: 36px;
	text-align: center;
	vertical-align: middle;
	width: 36px;
}

.la {
	text-rendering: optimizeLegibility;
}

/*--------------------------------------------------------------
15.0 Global Classes
--------------------------------------------------------------*/
hr {
	border-top: 1px solid #ced4da;
	border-top: 1px solid #dfe6e9;
}

img {
	height: auto;
	max-width: 100%;
}

#profile-pic-wrapper {
	width: 150px;
}

#twitter-widget-0 {
    display: inline-block;
    vertical-align: middle;
}

.animated {
    -webkit-animation-duration: 0.1s;
    animation-duration: 0.1s;
}

.zebra>div:nth-child(odd), .white-box {
	background-color: #fff;
	border: 1px solid #eee;
	border-radius: 4px;
}

/* edit in place buttons */
.editable {
	display: inline;

}

.dummy {
	padding-top: 100%;
}

.container-img {
	background-size: cover;
	background-repeat: no-repeat;
	background-position: 50% 50%;
}

.date-sm {
	font-size: 75%;
}

svg.icon {
    width: 18px;
    height: 18px;
}

.page-item {
	margin-bottom: 5px;
}

.fb_iframe_widget {
    display: inline-block;
    position: relative;
    vertical-align: middle;
    top: -2px;
}

.vertical-align {
    display: flex;
    align-items: center;
}

.shadow-a {
	box-shadow: 3px 12px 24px 2px rgba(0,0,0,.02);
}

.cat-name-figure {
	background-color: #0003;
	color: #fff;
	font-size: 0.75rem;
	font-weight: 700;
	position: absolute;
	right: 24px;
	text-transform: uppercase;
	top: 24px;
}