/* ============ Sidebar and Navigations ============== */

.navbar {
	height: 70px !important;
}

.navbar::after {
    content: '';
    position: absolute;
    bottom: 0;
    right: 15px;
    height: 1px;
    width: calc(100% - 30px);
    background-color: rgba(180, 180, 180, 0.3);
}

.custom-sidebar {
	box-shadow: none;
	border-right: 0.5px solid #f2f2f2;
}

.sidebar .nav i {
	color: #3C4858 !important;
}

.sidebar::before, .off-canvas-sidebar nav .navbar-collapse::before {
    background-color: white;
}

.sidebar .nav li a, .sidebar .nav li .dropdown-menu a {
	padding: 6px 20px;
	margin-left: 0;
	padding-left: 16px;
}

.sidebar .nav li:first-child > a {
	padding: 6px 15px;
	margin-left: 0;
	padding-left: 16px;
}

.sidebar[data-color="green"] li.active > a {
    background-color: #4caf50;
	box-shadow: 0 2px 10px 0px rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(76, 175, 80, 0.4);
	margin-left: 0;
	padding-left: 16px;
	border-radius: 0 20px 20px 0;
}

.custom-sidebar p {
    font-weight: 500;
    letter-spacing: .01785714em;
}

.custom-navbar {
    box-shadow: none;
}

.custom-navbar h3 {
    font-weight: 400;
    display: inline;
}

.custom-navigation-image {
    border: 1px solid #555;
}

.custom-nav-username {
    font-weight: 400;
}

.sidebar-normal {
	font-weight: 500;
}

/* ============ END:- Sidebar and Navigations ============== */


/* =============== Visitors =============== */
.visitors-table {
	border: 0.5px solid #f5f5f5;
	border-radius: 4px
}

.visitors-table thead {
	color: #385898;
}

.visitors-table thead th {
	font-weight: 400 !important;
	letter-spacing: .01785714em;
}

.visitors-table th, .visitors-table td {
	border-right: 1px solid rgba(0, 0, 0, 0.06) !important;
	border-top: 1px solid rgba(0, 0, 0, 0.06) !important;
}

/* ================ Error ======================= */

.network-error {
    display: flex;
    justify-content: center;
    flex-flow: row wrap;
    margin-top: 30px;
}

.break-flex {
    flex-basis: 100%;
    width: 0px;
    height: 0px; 
    overflow: hidden;
}

.network-error p {
    font-weight: 400;
}

/* ============ END:- Errors ============== */



/* ============ Paginations ============== */

.pagination {
	margin: 0;
	text-align: center;
}

.pagination-next-prev {
	position: relative;
	top: -66px;
}

.pagination ul {
	margin: 0;
	padding: 0;
	margin-bottom: 10px;
}

.pagination ul li {
	display: inline-block;
	margin: 0;
	padding: 0;
}


.pagination ul li a,
.pagination-next-prev ul li a {
	padding: 10px 0;
	border-bottom: none;
	display: inline-block;
	color: #333;
	background-color: transparent;
	font-weight: 700;
	margin:0;
	line-height: 22px;
	-webkit-transition: all 200ms ease-in-out;
	-moz-transition: all 200ms ease-in-out;
	-o-transition: all 200ms ease-in-out;
	-ms-transition: all 200ms ease-in-out;
	transition: all 200ms ease-in-out;
	font-size: 14px;
	float: left;
}

.pagination ul li a {
	border-radius: 4px;
	width: 44px;
	height: 44px;
	padding: 0;
	line-height: 44px;
}

.pagination ul li a i {
	line-height: 44px;
	font-size: 24px;
}

.pagination ul li.blank {
	color: #a0a0a0;
	padding: 0 6px;
}

.pagination ul li a.current-page,
.pagination ul li a:hover {
	background-color: #9F9F9F;
	color: #fff;
	box-shadow: 0 2px 8px rgba(0,0,0,0.2)
}

.pagination ul li a.current-page {
	background-color: #53AC57;
	color: #fff;
	box-shadow: 0 2px 8px rgba(102,103,107,0.25)
}

.pagination .pagination-arrow a { background-color: #f0f0f0; }

/* ============ END:- Paginations ============== */


/* ============  Table ============== */

.table td {
    color: #202124;
    font-weight: 400;
    font-size: 15px;
}

td a {
	cursor: pointer;
}

.table-head-title {
	font-weight: bold;
	letter-spacing: .01785714em;

}

.table-action-icons {
    color: #444;
    cursor: pointer;
}

.table-hover {
	cursor: pointer;
}

.fa-2x {
    font-size: 1.4em;
}

.badge {
    font-size: 80%;
    padding: 0.35em 0.5em;
}

.tooltip-inner {
	padding-top: 5px;
	padding-bottom: 5px;
	font-size: 12px;
}

.disabled-rows {
	background-color: rgba(184, 27, 127, 0.07);
}

.declined-or-expired-rows {
	background-color: lightpink;;
}

.draft-rows {
    background-color:  #ffffe0;
}

.schedule-rows {
    background-color: #F0F8FF;
}

.states-dailog {
	font-weight: 500;
}

/* ============ END:- Table ============== */


/* ============ Dropdown ============== */

.select_input {
	background-color: #fff;
	color: #363636;
	border: .5px solid #999;
	padding: 5px 20px;
}
.select_input:hover {
	background-color: #fff;
	color: #363636;
	border: .5px solid #999;
}
.select_input:focus {
	background-color: #fff;
	color: #363636;
	border: .5px solid #999;
}
.select_input:active {
	background-color: #fff;
	color: #363636;
	border: .5px solid #999;
}
.open>.btn.dropdown-toggle,
.show>.btn.dropdown-toggle {
	background-color: #fff;
	color: #363636;
	border: .5px solid #999;
}

.open>.btn.dropdown-toggle:hover,
.open>.btn.dropdown-toggle:focus,
.open>.btn.dropdown-toggle.focus,
.show>.btn.dropdown-toggle:hover,
.show>.btn.dropdown-toggle:focus,
.show>.btn.dropdown-toggle.focus	
{
	background-color: #f0f0f0;
	color: #363636;
	border: .5px solid #444;

}

/* ============ END:- Dropdown ============== */

/* ============ File upload Button ============== */

.file_upload_input {
	background-color: #f9f9f9;
	border: 0.5px solid #d3d3d3;
	border-radius: 4px;
	overflow: hidden;
	color: #444;
	font-weight: 400;
	font-size: 14px;
	padding: 5px 10px;
	cursor: pointer;
}

/* ============ END:- File Upload button ============== */



/* ============ Image-container ============== */

.img-thumbnail {
	border: 1px solid #d3d3d3;
	box-shadow: none;
	border-radius: 4px;
	max-height: 200px;
	width: 90%;
	cursor: pointer;
}

.browse_button {
	background-color: #f9f9f9;
	border: 0.5px solid #d3d3d3;
	box-shadow: none;
	border-radius: 4px;
	overflow: hidden;
	color: #444;
	font-weight: 400;
	font-size: 14px;
	padding: 5px 10px;
	width: 90%;
}

.browse_button:hover {
	box-shadow: 0 2px 8px rgba(238, 234, 234, 0.2);
	border-radius: 4px;
	overflow: hidden;
}
/* ============ END:- Image-container ============== */



/* ============ Input ============== */

.bmd-form-group .bmd-label-static {
	color: #666; 
	font-size: 13px;
}

.select_label {
	color: #666; 
	font-size: 13px;
	margin-bottom: 0;
}

.form-control {
	color: #202124;
}

.form-control:focus {
	color: #202124;
}
/* ============ END:- Input ============== */


/* ============ Button ============== */

.blue-color {
	background-color: #0686E4
}

.disable-enable-detials {
	text-transform: initial;
	font-size: 14px;
}

.intel-tel-hide {
	display: none;
}

#intel-tel-valid-msg {
	color: #4BB543;
	font-size: 12px;
}

#intel-tel-error-msg {
	color: #ff0000;
	font-size: 12px;
}

/* ============ END:- Button ============== */

.nav-tabs .nav-item .nav-link.active {
	transition: 0.3s background-color 0.2s;
	border-bottom: 2px dotted #0069D9 !important;
}

.tabs-tab {
	color: #444 !important; 
	border-radius: 0;
}


/* ============= SNACKBAR ================ */

#snackbar {
	visibility: hidden;
	min-width: 250px;
	margin-left: -125px;
	background-color: #333;
	font-weight: 400;
	color: #fff;
	text-align: center;
	border-radius: 2px;
	padding: 12px;
	border-radius: 2px;
	position: fixed;
	z-index: 1;
	left: 50%;
	bottom: 30px;
	font-size: 17px;
}
  
#snackbar.show {
	visibility: visible;
	-webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s;
	animation: fadein 0.5s, fadeout 0.5s 2.5s;
}

@-webkit-keyframes fadein {
	from {bottom: 0; opacity: 0;} 
	to {bottom: 30px; opacity: 1;}
}

@keyframes fadein {
	from {bottom: 0; opacity: 0;}
	to {bottom: 30px; opacity: 1;}
}

@-webkit-keyframes fadeout {
	from {bottom: 30px; opacity: 1;} 
	to {bottom: 0; opacity: 0;}
}

@keyframes fadeout {
	from {bottom: 30px; opacity: 1;}
	to {bottom: 0; opacity: 0;}
}

/* =========== END:- SNACKBAR ============ */


/* =============  */

#disable-enable-state {
	border-bottom: 1px dashed #666;
}

.disable-enable-detials {
	font-weight: 400;
	font-size: 16px;
}


.alert {
	padding: 10px;
}

.alert {
	width: 25%;
}

/* =========== DASHBOARD ================= */

.dashboard-card-1 {
	box-shadow: none;
	border: 0.5px solid #3CB371;
}

.dashboard-card-3 {
	box-shadow: none;
	border: 0.5px solid #d3d3d3;
	border-radius: 4px;
	margin-top: 35px;
}

.dashboard-visit-number {
	font-weight: 400;
}

.dashboard-visitors-numbers-helpText {
	text-align: center;
	color: #777;
	font-weight: bold;
	font-family: "Roboto", "Helvetica", "Arial", sans-serif;
}

.dashboard-visitors-card {
	box-shadow: none;
	border: 0.5px solid #3CB371;
	background-color:#fff;
	box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2), 0 6px 10px 0 rgba(0, 0, 0, 0.19);
}

.dashboard-visitors-numbers-icon {
	font-size: 72px;
	margin-top: 70px;
	align-items: center;
}

.dashboard-visitors-numbers-iconImg{
	margin-top: 80px;
}

@media only screen and (max-width: 768px) {

	.dashboard-visitors-numbers-icon {
		margin-top: 10px;
	}

	.dashboard-visitors-numbers-iconImg {
		margin-top: 5px;
	}

}

.dashboard-city-container {
	border: 0.5px solid #3CB371;
	/* box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2), 0 1px 10px 0 rgba(0, 0, 0, 0.19); */
	border-radius: 4px;
	padding: 5px;
	margin: 35px auto;
}	

.avg-visitors-text {
	font-weight: 400;
	margin: 10px 20px;
	font-size: 96px;
}

.dashboard-visitors-total-visitors-helpText {
	color: #fff;
	font-weight: 400;
	font-size: 16px;
	text-align: right;
	margin-right: 20px;
	border-radius: 50%;
	border-radius: 0 20px 20px 0;
}

#top-cities-title {
	font-weight: 400;
	margin-top: 20px;
	margin-left: 10px;
}

.bold-font {
	font-weight: bold;
}
/* ######### 	CHART ########### */

.apex-charts {
	margin: 35px auto;
	border: 0.5px solid  #999 /*#3CB371*/;
	background-color: #fff;
	border-radius: 4px;
	padding: 5px;
}


/* =========== END:- DASHBOARD ============ */


/* ============ INTTELTEL INPUT ============== */

.intel-num-hide {
	display: none;
}

.intel-num-valid-msg {
	color: #4BB543;
	font-size: 12px;
}

.intel-num-error-msg {
	color: #ff0000;
	font-size: 12px;
}

/* ============ END:- INTTELTEL INPUT ============== */

.text-brandGreen {
	color: #008000; /* somaliland green */
}