/* randstad style sheet */

body {
    color: #0F1941;
}
a {
    color: #2175d9;
}
app-root {
    background-color: #f7f5f0;
}
.color-secondary {
	color: #2175d9;
}

.r-gray {
	position: fixed;
  bottom: 0%;
}
.container {
	width: fit-content;
	padding-right: 15px;
	padding-left: 15px;
	margin-right: 0px;
	margin-left: 0px;
  padding-top: 80px!important;
}
.alert-info {
	color: #ffffff;
	background-color: #0f1941;
	border-color: #0f1941;
  margin-top: 10px;
}

.alert-dismissible {
	padding-right: 4rem
}

.alert-dismissible .close {
	position: absolute;
	top: 0;
	right: 0;
	padding: .75rem 1.25rem;
	color: inherit
}

.close {
	float: right;
	font-size: 1.5rem;
	font-weight: inherit;
	line-height: 1;
	color: #000;
	text-shadow: inherit;
	opacity: .5
}

.close:hover {
	color: #fff;
	text-decoration: none
}

.navbar-brand {
    margin-right: 0rem;
}

.btn-block {
    display: block;
    width: 100px;
}

.btn {
    border-radius: 0.25rem!important;
    text-transform: lowercase;
		font-size: .9rem;
		box-shadow: none!important;
		font-weight: 300;
		padding: 0.50rem 1rem;
}

.btn-primary {
    background-color: #2175d9!important;
    color: #fff;
}

.slogan {
    margin-right: 90px;
    font-size: 1em;
    padding-top: 3px;
}

.card {
    border-radius: 1rem;
		font-weight: inherit;
		box-shadow: none;
}

.z-depth-2 {
    box-shadow: none!important;
}

.navbar {
  box-shadow: none!important;
  font-size: 0.9rem;
  font-weight: 300;
  position: fixed;
  top: 0px;
  width: 97%;
  z-index: 2;
}

/* UI Design */
.ascending-icon-class
{
	background-image: url('../img/icons8-ascending-sorting-16.png');
	background-repeat:no-repeat;
	background-position:center center;
	background-size:cover;
	height:15px;
	width:15px;
	border: none;
	box-shadow: none;
}
.ascending-icon-class:focus
{
	outline: none;
	box-shadow: none;
}

.descending-icon-class
{
	background-image: url('../img/icons8-descending-sorting-16.png');
	background-repeat:no-repeat;
	background-position:center center;
	background-size:cover;
	height:15px;
	width:15px;
	border: none;
	box-shadow: none;
}

.descending-icon-class:focus
{
	outline: none;
	box-shadow: none;
}

.hidden-header
{
	display: none;
}

a.btn.btn-primary.download-taptoo-users {
    margin-left: 20px!important;
}

.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter,
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_processing,
.dataTables_wrapper .dataTables_paginate.paging_simple_numbers
{
    color: #828181!important;
    font-size: 0.9rem;
    text-transform: lowercase;
}
.dataTables_wrapper .dataTables_paginate.paging_simple_numbers .paginate_button.previous.disabled,
.dataTables_wrapper .dataTables_paginate.paging_simple_numbers .paginate_button.next.disabled
{
	color: #828181!important;
    font-size: .9rem;
}
/* 'Show 10 entries' datatables dropdown float right*/
div.dataTables_wrapper .dataTables_length
{
	float:right;
	padding-left: 15px;
}
/* set the inside of 'Show 10 entries' datatables dropdown to white*/
div.dataTables_wrapper .dataTables_length select
{
	background:white;
}
/* set the inside of the datatables search to white*/
div.dataTables_wrapper .dataTables_filter input[type="search"]
{
	background:white;
}

/* set bacground of entire datatable to light grey #f7f5f0 */
div.dataTables_wrapper
{
	background-color:#f7f5f0;
}


/* make select2 dropdown 250px width fixed*/
.select2-container--default
{
	width: 250px !important;
}

/* hide search tiles in select2 dropdown*/
/*.select2-selection__choice
{
	display:none;
}*/

/* reset select2 dropdown selections per column */
.reset-button {
	border: 0;
	margin-left: 5px;
}

.reset-button:focus
{
	outline: none;
	box-shadow: none;
}

/* sort datatable */
.sort-button, .reset-button, .filter-button {
	border: 0;
  background-color: transparent;
  color: #828181!important;
  font-size: 0.8rem;
  cursor: pointer;
}

.table tbody tr:nth-child(odd)
{
	background-color: #e9f1fb
}

.table tbody tr:nth-child(even)
{
	background-color: #FFF
}

/* element occupies no space opacity 0, max-width 1px, equivalent to display:none except size of div is retained*/
.div_class
{
	position: fixed;
	opacity: 0;
	max-width: 1px;
}
/* element opens to full width and opacity 1. So it displays */
.div_class.open
{
	position: static;
	max-width: none;
	opacity: 1;
}

/* added color */
table th {
	font-size: .9rem;
	font-weight: 400;
	color:#828181;
}
/* added color */
table td {
	font-size: .9rem;
	font-weight: 300;
	color:#0F1941;
	/* font-weight: bold; */
}

/* Each datatable row is 50px height*/
table.dataTable tbody tr {
	height:50px;
}


/* dropdown menu to left of caret */
.dropdown .dropdown-menu {
	display: none;
	transform: translate3d(-100%, 10px, 0)!important;
  /* position: absolute;
  top: 100%;
  left: 0;
  z-index: 1000;
  display: none;
  float: left;
  min-width: 10rem;
  padding: 0.5rem 0;
  margin: 0.125rem 0 0;
  font-size: 1rem;
  color: #212529;
  text-align: left;
  list-style: none;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid rgba(0, 0, 0, .15); */
  border-radius: 0.5rem;
}

.nav-link {
    /* padding: 0.5rem 1rem; */
		margin: 0.5rem 0.8rem!important;
		padding-top: 0.5rem!important;
		padding-bottom: 0!important;
		padding-right: 0!important;
		padding-left: 0!important;
}

/* color and font-weight */
.nav-link.active[_ngcontent-c1],
.navbar.navbar-light .navbar-nav .nav-item .nav-link.active {
	color:#0F1941;
	border-bottom: 1px solid #0F1941;
}
/* color and font-weight */
@media (max-width:991px) {
	.nav-link.active[_ngcontent-c1],
	.navbar.navbar-light .navbar-nav .nav-item .nav-link.active {
	  color: #0F1941;
  	border-bottom: 0px;
	}
}

/* width:auto added */
li.dropdown-item, a.dropdown-item {
	font-weight: 300;
	width: 100%;
  color: #2175d9!important;
  padding: 0.6rem!important;
  margin: 0rem!important;
}

/* width:auto added */
li.dropdown-item, a.dropdown-item:hover {
  background-color: #e9f1fb;
}

.visible {
	visibility: visible;
}
.invisible {
	visibility: hidden;
}

/* changed to visibility: hidden. This is so the div element always occupies the same space whether visible or hidden*/
#selectedRecordsActions {
	visibility: hidden;
	position: relative;
	z-index:1;
	padding-top:25px;
	height:1px;
}

#selectedRecordsActions a {
  display: inline-block;
  color: #2175d9!important;
  padding: 0.4rem 0.3rem!important;
  border-radius: 50%!important;
}

#selectedRecordsActions a:hover {
  background-color: #e9f1fb;
}

.nav-actions-modified {
	display: inline-block;
	margin: 0 10px;
}

/* remove the default sort icons of datatables */
.dataTable > thead > tr > th[class*="sort"]:before,
.dataTable > thead > tr > th[class*="sort"]:after {
    content: "" !important;
}

/* #f7f5f0 */
.container-fluid {
	width: 100%;
	padding-right: 15px;
	padding-left: 15px;
	margin-right: auto;
	margin-left: auto;
	background-color:#f7f5f0;
  padding-top: 80px!important;
}

.navbar.navbar-light .breadcrumb .nav-item .nav-link,
.navbar.navbar-light .navbar-nav .nav-item .nav-link {
	color: #0F1941;
	transition: .35s;
}

.navbar.navbar-light .breadcrumb .nav-item.active>.nav-link,
.navbar.navbar-light .navbar-nav .nav-item.active>.nav-link {
  color: #0F1941;
}

.navbar-nav .nav-item .nav-link:hover {
  color:#0F1941!important;
	border-bottom: 1px solid #0F1941;
  transition: none!important;
}

.sync-button {
	color: #2175d9!important;
	padding: 0.4rem 0rem !important;
	border-radius: 50%!important;
  border: 0px!important;
}

a.sync-button:hover {
	background-color: #e9f1fb;
}

.table td, .table th {
    padding: 0.75rem;
    vertical-align: top;
    border-top: 0px;
    border-top-width: 0px;
}

table.dataTable.no-footer {
    border-bottom: 0px;
    border-bottom-width: 0px;
		margin-bottom: 1.5rem;
}

table.dataTable thead th, table.dataTable tfoot th {
    font-weight: normal!important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button {
		border: 0px;
}


.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover,
.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    color: #0F1941 !important;
		border: 0px;
    border-bottom: 3px solid #828181;
    background-color: transparent!important;
		background: inherit!important;
}

.fa, .fas {
    color: #2175d9;
    margin: 0 0.2rem;
}

.fa-sync {
    margin: 0!important;
}

.btn-primary-startpage {
    background-color: transparent!important;
    border: .06em solid #b9bbc2;
  	border-radius: 0.5em;
		font-size: 1.2rem;
		font-weight: 300;
    color: #0F1941!important;
		padding: 0.5rem 1rem 0.5rem 1rem;
    text-align: left;
}

.helper-text-startpage {
  font-size: 0.8rem;
  color: #828181;
}

.info-startpage {
    background-color: #ecf3fc!important;
    border: .08em solid #2175d9;
  	border-radius: 0.4rem;
		font-size: 0.8rem;
		font-weight: 300;
    color: #0F1941!important;
		padding: 0.5rem;
    text-align: left;
}

.org-selector {
  padding: 0.5rem!important;
  border-radius: 0.3rem!important;
  border: .06em solid #b9bbc2;
  width: auto;
  min-width: 14rem;
}

.dropdown.show .fadeInDropdown {
    top: 1.5rem!important;
    left: 3rem!important;
}

table.dataTable thead th, table.dataTable tbody td {
    padding: 8px 10px!important;
}

/* filtered search style */

.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: #e9f1fb;
    color: inherit;
}

.select2-container--default .select2-results__option[aria-selected=true] {
    background-color: #e9f1fb;
}

.select2-container {
  font-size: 0.9rem;
}

.reset-button {

}

table.dataTable thead>tr>th.sorting,
table.dataTable thead>tr>th.sorting_asc,
table.dataTable thead>tr>th.sorting_desc,
table.dataTable thead>tr>th.sorting_asc_disabled,
table.dataTable thead>tr>th.sorting_desc_disabled,
table.dataTable thead>tr>td.sorting,
table.dataTable thead>tr>td.sorting_asc,
table.dataTable thead>tr>td.sorting_desc,
table.dataTable thead>tr>td.sorting_asc_disabled,
table.dataTable thead>tr>td.sorting_desc_disabled {
    cursor: auto;
}

.logout-Auth0 {
  height: 2.5rem;
  margin-left: auto;
}

.fas-signout, a.download-taptoo-users .fa-download, .fa-plus,
.fa-caret-down, .fa-sync-white {
  color: #fff;
  margin: 0;
}

.profile-txt {
  font-size: 0.8rem;
}

/* modal window changes */
.btn-red {
    background-color: #2175d9!important;
    color: #fff;
}

.modal-dialog .modal-content {
    border: 0;
    border-radius: 1rem;
}

.modal-content .close {
    position: absolute;
    right: 1.5rem;
    top: 1.2rem;
    color: #2175d9;
    opacity: 1;
}

.close:hover {
}

.modal-header, .modal-footer{
    border: 0px;
}
.modal-title {
  margin-top: 3rem;
  font-size: 2rem;
  text-transform: lowercase;
}

.sync-tooltip {
  font-size: 0.8rem;
}

.form-control-label {
  text-transform: lowercase;
}

table.dataTable thead.sticky-header {
  background-color: #F7F5F0!important;
  top: 70px;
  position: sticky;
  z-index: 1;
}

table.dataTable thead.top-63 {
  top: 63px!important;
}

table.dataTable thead.top-56 {
  top: 56px!important;
}
