body {
  background-color: #f9f9f9;
}

.navbar {
  background-color: #213f7c;
  color: #fff;
  margin-bottom: 0px;
}

.navbar-default .navbar-brand,
.navbar-default .navbar-nav > li > a,
.navbar-default .navbar-text {
  color: #fff;
}

.match-pairing-option-label {
  margin-top: 7px;
}

.roll-element.ng-hide {
  display: none;
}
.roll-element.ng-hide-add,
.roll-element.ng-hide-remove {
  -webkit-transition: 0s linear all;
  transition: 0.5s ease all;
  display: block !important;
}

.roll-element.ng-hide-add-active,
.roll-element.ng-hide-remove-active {
  /* the transition is defined in the active class */
  -webkit-transition: 0.5s ease all;
  transition: 0.5s ease all;
  overflow: hidden;
}

.roll-element.ng-hide-add {
  max-height: 600px;
  opacity: 1;
}
.roll-element.ng-hide-add.ng-hide-add-active {
  max-height: 0px;
  opacity: 0;
}
.roll-element.ng-hide-remove {
  max-height: 0px;
  opacity: 0;
}
.roll-element.ng-hide-remove.ng-hide-remove-active {
  max-height: 600px;
  opacity: 1;
}

.user-info-table td {
  padding-right: 8px;
}
.btn-circle {
  width: 50px;
  height: 50px;
  text-align: center;
  padding: 6px;
  font-size: 20px;
  line-height: 1.42;
  border-radius: 25px !important;
}

.navbar-cl-admin li > a {
  padding-top: 3px;
  padding-bottom: 3px;
}
.navbar-cl-admin {
  min-height: 24px;
  padding-right: 15px;
  border: none;
  border-radius: 0px;
}

.navbar-cl-admin .navbar-nav > li > a:hover,
.navbar-cl-admin .navbar-nav > li > a:focus {
  color: inherit;
  background: inherit;
}
.admin-view-container .admin-side-menu {
  position: absolute;
  top: 26px;
  bottom: 0px;
  width: 220px;
  background: white;
  padding-top: 0px;
  bottom: 0px;
  overflow: auto;
  border-right: 1px solid #f0f0f0;
}

.admin-view-container .admin-side-menu > * {
  width: 100%;
}
.admin-view-container .admin-main-view {
  position: absolute;
  top: 26px;
  left: 220px;
  right: 0px;
  bottom: 0px;
  overflow: auto;
  overflow-x: hidden;
  padding-left: 22px;
  padding-right: 12px;
  box-sizing: border-box;
}
.admin-view-container .admin-main-view-inner {
  width: 100%;
}
.admin-view-container.side-menu-hidden .admin-side-menu {
  display: none;
}
.admin-view-container.side-menu-hidden .admin-main-view {
  left: 0px;
}

@media (max-width: 600px) {
  .admin-view-container .admin-side-menu {
    position: relative;
    top: auto;
    bottom: auto;
    width: 100%;
    background: white;
    padding-top: 0px;
    border-right: none;
  }
  .admin-view-container .admin-main-view {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    overflow-x: auto;
    padding-left: 4px;
    padding-right: 4px;
  }
}

@media print {
  .admin-view-container .admin-main-view {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    overflow-x: auto;
    padding-top: 4px;
    padding-left: 4px;
    padding-right: 4px;
  }
}

.usq-profile-picture {
  height: 128px;
  width: 128px;
}

.delete-profile-picture-overlay {
  position: absolute;
  transform: translateX(-100%);
}

.vertical-separator {
  width: 2px;
  margin: 0 10px !important;
  background-color: #b4b4b4;
  height: 40px;
}
.zero-opacity {
  opacity: 0;
}
