/*
    DEMO STYLE
*/

@import "https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700";

body {
	font-family: "Avenir Next", sans-serif;
	background: #fafafa;
}


p {
	font-family: 'Poppins', sans-serif;
	font-size: 1.1em;
	font-weight: 300;
	line-height: 1.7em;
	color: #999;
}

.esri-layer-list-panel p {
	font-family: 'Poppins', sans-serif;
	font-size: 0.9em;
	font-weight: 300;
	line-height: 1.7em;
	color: #1a7d1f;
}

a,
a:hover,
a:focus {
	color: inherit;
	text-decoration: none;
	transition: all 0.3s;
}
::-webkit-scrollbar {
	-webkit-appearance: none;
	width: 7px;
}

::-webkit-scrollbar-thumb {
	border-radius: 4px;
	background-color: #238551;
	-webkit-box-shadow: 0 0 1px rgba(255,255,255,.5);
}



/*page preloader*/
.preloader {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(255, 255, 255, 0.99);
	z-index: 13000;
	height: 100%;
}

.no-js .preloader,
.lt-ie9 .preloader,
.lt-ie10 .preloader {
	display: none;
}

.preloader_image {
	width: 100px;
	height: 100px;
	position: absolute;
	left: 50%;
	top: 50%;
	background: url(../images/preloader.gif) no-repeat 50% 50% transparent;
	margin: -50px 0 0 -50px;
}


.navbar {
	margin: 25px;
	padding: 15px 10px;
	background: #f3f3f3;
	border: none;
	border-radius: 0;
	/* margin-bottom: 40px; */
	box-shadow: 0 1px 2px rgb(0 0 0 / 30%);
}

.navbar-btn {
	box-shadow: none;
	outline: none !important;
	border: none;
}

.line {
	width: 100%;
	height: 1px;
	border-bottom: 1px dashed #ddd;
	margin: 40px 0;
}

/* ---------------------------------------------------
    SIDEBAR STYLE
----------------------------------------------------- */

.wrapper {
	display: flex;
	width: 100%;
}

#sidebar {
	width: 275px;
	position: fixed;
	top: 0;
	left: 0;
	height: 100vh;
	z-index: 999;
	background: #f3f3f3;
	color: #323232;
	transition: all 0.3s;
}

	#sidebar.active {
		margin-left: -275px;
	}

	#sidebar .sidebar-header {
		padding: 20px;
		background: #28a745;
	}

	#sidebar ul.components {
		padding: 0px 0;
	}

	#sidebar ul li a {
		padding: 12px;
		font-size: 1em;
		display: block;
	}

		#sidebar ul li a:hover {
			color: #2eb135;
			background: #fff;
			font-weight:bold;
		}

	#sidebar ul li.active > a,
	a[aria-expanded="true"] {
		color: #2eb135;
		background: #fff;
	}

a[data-toggle="collapse"] {
	position: relative;
}

.dropdown-toggle::after {
	display: block;
	position: absolute;
	top: 50%;
	right: 20px;
	transform: translateY(-50%);
}

.dropdown-indicadores::after {
	display: none;
	position: absolute;
	top: 50%;
	right: 20px;
	transform: translateY(-50%);
}

ul ul a {
	font-size: 0.9em !important;
	padding-left: 30px !important;
	background: #6d7fcc;
}

button.btn.btn-secondary.btn-help {
    color: #fff;
    background-color: #238551;
    border-color: #238551;
    float: right;
    margin-right:15px;
    font-size:0.85em;
    margin-bottom: 5px;
}

a.article-filter {
	font-size: 10px !important;
	padding-left: 13px !important;
	background: #e7efe9;
	border-radius:55px;
	width:36px;
	line-height:10px;
	margin-bottom:12px;
}

ul.CTAs {
	padding: 20px;
}

	ul.CTAs a {
		text-align: center;
		font-size: 0.9em !important;
		display: block;
		border-radius: 5px;
		margin-bottom: 5px;
	}

a.download {
	background: #d6d6d6;
	color: #2eb135;
}

a.article,
a.article:hover {
	background: #6e6e6e !important;
	color: #fff !important;
}

button.btn.ok-filter-button
{
    border: 1px solid transparent;
    padding: 0.25rem;
    font-size: 0.8rem;
    color: green;
    line-height: 1;
    border-radius: 55px;
    float:right;
    margin-right:5px;

}
button.btn.cancel-filter-button
{
	border: 1px solid transparent;
    padding: 0.25rem;
    font-size: 0.8rem;
    color: #343a40;
    line-height: 1;
    border-radius: 55px;
    margin-bottom:8px;
    float:right;

}


/* ---------------------------------------------------
    CONTENT STYLE
----------------------------------------------------- */

#content {
	width: calc(100% - 275px);
	padding: 0px;
	min-height: 100vh;
	transition: all 0.3s;
	position: absolute;
	top: 0;
	right: 0;
}

	#content.active {
		width: 100%;
	}


.navbar-collapse span {
	font-size: 0rem;
	margin-left: 0px;
}

.navbar-collapse button {
	margin-bottom: 0px;
}

.navbar-collapse svg {
	vertical-align: middle;
	margin-left: -3px;
}
#languajeBtns {
margin-left:10px;
}

.btn-group-toggle > .btn {
	margin-bottom: 0;
	padding: 10px;
	border-radius: 35px;
	border: 0px solid;
}
.webmap-title {
	font-size: 1.1rem;
	margin-left: 8px;
	font-weight: bold;
	white-space: break-spaces;
}

.btn-indicadores
{
	left:15px;
	border-radius:50px;
	color: #1a7d1f;
}
.btn-indicadores:hover
{
	left:15px;
	border-radius:50px;
	color: #fff;
	background-color:#2eb135e6;
}
.navbar .btn-info {
    color: #fff;
    background-color: #4c4c4c;
    border-color: #4c4c4c;
}
.navbar .btn-info:hover {
    color: #f8f9fac4c;
    background-color: #323232;
    border-color: #323232;
}

/* ---------------------------------------------------
    RIGHT PANEL
----------------------------------------------------- */
#panelPrint .overlay {
	height: 60%;
	width: 0;
	position: fixed;
	z-index: 1;
	top: 120px;
	right: 28px;
	background-color: rgb(0,0,0);
	background-color: #f8f9fa;
	overflow-x: hidden;
	transition: 0.2s;
	box-shadow: 1px 1px 3px rgb(0 0 0 / 10%);
}
.overlay {
	height: 83%;
	width: 0;
	position: fixed;
	z-index: 1;
	top: 120px;
	right: 28px;
	background-color: rgb(0,0,0);
	background-color: #f8f9fa;
	overflow-x: hidden;
	transition: 0.2s;
	box-shadow: 1px 1px 3px rgb(0 0 0 / 10%);
}

.overlay-content {
	position: relative;
	top: 25%;
	width: 50%;
	text-align: center;
	margin-top: 30px;
}

.overlay a {
	padding: 8px;
	text-decoration: none;
	font-size: 36px;
	color: #f3f3f3;
	display: block;
	transition: 0.3s;
}
.indicadoresContainer a {
	font-size: 16px;
	padding: 0px 0px;
}
.indicadoresContainer
{
	padding: 15px 25px;
	background-color:#dee2e6;
}

.overlay a:hover, .overlay a:focus {
	color: #f1f1f1;
}

.overlay .closebtn {
	position: absolute;
	top: 0px;
	right: 10px;
	font-size: 30px;
}

li.divider {
	border-right: 1px solid #dee2e6;
	border-top: 0px solid #dee2e6;
}

.panel-collapse-body {
	padding:7px;
}


#pageShare,#pageLayers .panel-collapse-body {
	padding:0px;
}
#pageShare
{
	background: #f8f9fa;
	border-radius:5px;
	cursor:pointer;
}

#pageShare .panel-collapse-body {
	padding:0px;
}

.widgets-hidden {
display:none !important;
}

img.share-panel-img {
    height: 32px;
    margin: 0px 20px;
}

#panelIndicadores .nav-link,
#panelIndicadores_compare .nav-link
{
	font-size:1rem;

}
#panelIndicadores .nav-link.active, .nav-link:focus, .nav-link:hover ,
#panelIndicadores_compare .nav-link.active, .nav-link:focus, .nav-link:hover{
	border: 0px !important;
	border-bottom: 3px solid !important;
    border-color: #2eb13500 #dee2e600 #238551 !important;
	background-color: #28a745 !important;
	color:#f3f3f3 !important;
	font-weight:bold;
}
#panelIndicadores .nav-link,
#panelIndicadores_compare .nav-link{
	color:#f3f3f3 !important;
}
#panelIndicadores .tab-content,
#panelIndicadores_compare .tab-content
{
	padding: 5px 5px;
	overflow-y: auto;
	height: calc(100% - 53px);
}


/***---- PANEL MODAL HELP ----*/
.modal-backdrop.show {
	z-index: auto;
}

/***------PANEL ESTADISTICOS-------*/
.panel-group .list-group {
	margin-bottom: 0;
}

.panel-group .list-group .list-group-item {
	border-radius: 0;
	border-left: none;
	border-right: none;
}

.panel-group .list-group .list-group-item:last-child {
	border-bottom: none;
}

#listMuniInidicadores canvas, #listBarrioIndicadores canvas, #listBarrioIndicadoresCompare canvas {
	margin: 15px 0px;
	font-family: 'Poppins' !important;
}
#listMuniInidicadores img, #listBarrioIndicadores img, #listBarrioIndicadoresCompare img{
	width: 38px;
	margin-right: 15px;
	margin-top: 4px;
	float: left;
}

.list-group-item {
	position: relative;
	display: block;
	padding: 0.3rem 1.25rem;
	margin-bottom: 0px;
	background-color: #ececec;
	border: 1px solid rgba(0,0,0,.125);
}
.list-group-item-canvas{
    position: relative;
    display: block;
    padding: 0.0rem 0.5rem;
    margin-bottom: 0px;
    background-color: #f8f9fa;
    border: 0px solid rgba(0,0,0,.125);
    border-left:1px solid rgba(0,0,0,.125);
    border-right:1px solid rgba(0,0,0,.125);
}



/* ---------------------------------------------------
    MEDIAQUERIES
----------------------------------------------------- */
@media (max-width: 768px) {
	#sidebar {
			margin-left: -275px;
		}

			#sidebar.active {
				margin-left: 0;
			}

		#content {
			width: 100%;
		}

			#content.active {
				width: calc(100% - 275px);
			}

		#sidebarCollapse span {
			display: none;
		}

		.mapCollapsed {
			width: 100% !important;
		}

		.navbar-collapse span {
			font-size: 1rem;
			margin-left: 10px;
			margin-right: 5px;
		}

		#languajeBtns {
			margin-left: 40%;
			margin-top:15px;
			z-index: 0;
		}


		.overlay a {
			font-size: 20px
		}

		.overlay .closebtn {
			position: absolute;
			top: 0px;
			right: 5px;
			font-size: 20px;
		}


		.dropdown-toggle-widgets {
			left: 29%;
			margin-top: 25px;
		}

		li.divider {
			border-right: 0px solid #dee2e6;
			border-top: 1px solid #dee2e6;
		}

	}


	.modal-dialog{
	  max-width: 60%!important;
	}
