:root {
  --blue: #007bff;
  --indigo: #6610f2;
  --purple: #6f42c1;
  --pink: #e83e8c;
  --red: #dc3545;
  --orange: #fd7e14;
  --yellow: #ffc107;
  --green: #28a745;
  --teal: #20c997;
  --cyan: #17a2b8;
  --white: #fff;
  --gray: #6c757d;
  --gray-dark: #343a40;
  --primary: #007bff;
  --secondary: #6c757d;
  --success: #28a745;
  --info: #17a2b8;
  --warning: #ffc107;
  --danger: #dc3545;
  --light: #f8f9fa;
  --dark: #343a40;
}

.logo {
	background-image: url(./assets/img/logo.png);
}

.jf-c {
	display: flex;
	align-items: center;
	justify-content: center;
}

.jf-sb {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.swal2-popup {
	width: auto !important;
	max-width: 420px !important;
	min-width: 300px !important;
	height: auto !important;
	border-radius: 2px !important;
	padding: 12px !important;
}

.swal2-icon {
	font-size: 9px !important;
}

.swal2-title {
	font-size: 18px !important;
}

.swal2-content {
	font-size: 13px !important;
}

.swal2-styled {
	padding: 6px 18px !important;
	background: #297C9E !important;
	box-shadow: none !important;
}

.swal2-styled.swal2-confirm {
	border-radius: 3px !important;
	font-size: 13px !important;
	font-weight: 700; !important;
}

.swal2-styled.swal2-cancel {
	border-radius: 3px !important;
	font-size: 13px !important;
	font-weight: 700; !important;
}

.screens h3 {
	background: #297C9E;
	color: white;
	width:90%;
	margin:20px auto;
	font-size:14px;
	font-weight:700;
	padding:10px;
	border-radius:3px;
	box-shadow:none;
}

.add_accounts {
      width: auto;
      margin: auto;
      text-align: center;
}

.add_accounts td {
  padding: 8px;
  border-top: 1px solid #d8d8d8;
  font-size: 13px;

}

.add_accounts td select {
  width: 160px;
  border: 1px solid #dddddd;
  border-radius: 3px;
  color: #555;
  padding: 4px;
}

.add_accounts td input {
  width: 160px;
  border: 1px solid #dddddd;
  border-radius: 3px;
  color: #555;
  padding: 4px;
}


.logos {
	background: #FFFFFF;
	width: 100%;
	max-width: 140px;
	height: 100px;
	border: 2px solid #DDDDDD;
	padding: 5px;
	margin: 10px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.main-header, .main-sidebar {
	background-color: #297C9E;
}

.brand-link {
  background-color: #297C9E !important;
}

.nav-link {
  color: #FFFFFF !important;
}

.nav-link.active {
  background: rgba(255, 255, 255, 0.1) !important;
}

@media(max-width: 768px){

	.listado thead {
		display: none;
		padding: 0px;
	}

	.listado tr {
		display: flex;
		flex-direction: column;
		border-bottom: 2px solid rgba(0,104,140,0.3);
		padding: 5px;
	}

	.listado td {
		display: flex;
		align-items: center;
		justify-content: flex-start;
		height: auto;
		font-size: 13px;
		font-weight: 500;
		color: #777;
		padding: 2px 10px;
		border: none;
	}

	.listado td[data-label]::before {
		content: attr(data-label);
		margin-right: 5px;
	}

}