.headerwrapper, .contentarea {
  max-width: 90%;
  width: 100%;
  margin: 10px auto; }

.page-title, .section-title, .section-title-sub, .customization-bar {
  font-family: "Lato", sans-serif;
  font-weight: 300;
  border-bottom: 1px solid #D9D8D9;
  padding-bottom: 10px;
  margin-bottom: 20px;
  float: left;
  width: 100%; }

.datacontainer .datatable td {
  padding: 10px;
  clear: none;
  margin: 1px;
  min-height: 35px;
  overflow: auto;
  white-space: nowrap; }

@media (max-width: 1080px) {
  .headerwrapper, .contentarea {
    max-width: 100%;
    width: 100%;
    margin: 10px auto; } }

@keyframes growShrink {
  0% {
    width: 0px;
    height: 0px; }
  50% {
    width: 9px;
    height: 9px; }
  100% {
    width: 0px;
    height: 0px; } }

@keyframes fadeIn {
  from {
    opacity: 0; }
  to {
    opacity: 1; } }

/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block; }

body {
  line-height: 1.4; }

ol, ul {
  list-style: none; }

blockquote, q {
  quotes: none; }

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none; }

table {
  border-spacing: 0; }

strong, b {
  font-weight: bold; }

a {
  text-decoration: none; }

/* Page grid */
.row {
  float: left;
  width: 100%; }

.col05 {
  float: left;
  width: 5%; }

.col10 {
  float: left;
  width: 10%; }

.col15 {
  float: left;
  width: 15%; }

.col20 {
  float: left;
  width: 20%; }

.col25 {
  float: left;
  width: 25%; }

.col30 {
  float: left;
  width: 30%; }

.col33 {
  float: left;
  width: 33%; }

.col35 {
  float: left;
  width: 35%; }

.col40 {
  float: left;
  width: 40%; }

.col45 {
  float: left;
  width: 45%; }

.col50 {
  float: left;
  width: 50%; }

.col55 {
  float: left;
  width: 55%; }

.col60 {
  float: left;
  width: 60%; }

.col65 {
  float: left;
  width: 65%; }

.col70 {
  float: left;
  width: 70%; }

.col75 {
  float: left;
  width: 75%; }

.col80 {
  float: left;
  width: 80%; }

.col85 {
  float: left;
  width: 85%; }

.col90 {
  float: left;
  width: 90%; }

.col100 {
  float: left;
  width: 100%; }

@media (max-width: 1260px) {
  .col35,
  .col40,
  .col60,
  .col65 {
    width: 100%;
    padding-bottom: 30px; } }

@media (max-width: 767px) {
  .col30,
  .col40,
  .col50,
  .col60,
  .col70 {
    width: 100%; }
  .mcol50 {
    float: left;
    width: 50%; } }

input[type="text"],
input[type="number"],
input[type="email"],
input[type="password"],
input[type="date"] {
  border: 0;
  box-shadow: none;
  margin: 0;
  font-size: 20px;
  font-weight: 300;
  color: #666666;
  width: inherit;
  float: left; }

input[type="text"][disabled],
input[type="number"][disabled],
input[type="email"][disabled],
input[type="password"][disabled],
input[type="date"][disabled] {
  background: rgba(193, 192, 193, 0.3) url("/static/images/icon-lock.png") no-repeat right 10px top 50%; }

input[type="text"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
input[type="date"]:focus {
  background: rgba(192, 191, 192, 0.15); }

input[type="file"].fileuploadbutton {
  float: left;
  margin-top: -33px;
  height: 33px;
  opacity: 0;
  cursor: pointer; }

input[type="text"].rounded-border,
input[type="number"].rounded-border {
  height: 25px;
  border: 1px solid #CCCCCC;
  font-size: 13px;
  padding: 1px 3px;
  border-radius: 4px;
  margin-top: -2px; }
  input[type="text"].rounded-border.error,
  input[type="number"].rounded-border.error {
    border: 1px solid #FD4B18; }

input.full-width {
  width: 100% !important; }

input.standard-width {
  width: 90% !important; }

input:focus {
  outline: none; }

input.short {
  padding: 0 0 0 10px !important;
  width: 110px !important; }

input.medium {
  padding: 0 0 0 10px !important;
  width: 300px; }

input.invalid {
  color: #FD4B18 !important; }

input.input-bg {
  background: rgba(192, 191, 192, 0.15); }

input.bottom-margin {
  margin-bottom: 10px; }

/* We use this to get basic styling on all basic form elements */
/* line 421, ../bower_components/foundation/scss/foundation/components/_forms.scss */
input[type="text"], input[type="password"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="month"], input[type="week"], input[type="email"], input[type="number"], input[type="search"], input[type="tel"], input[type="time"], input[type="url"], input[type="color"], textarea {
  padding: 2px 0;
  height: 37px; }

.checkbox input[type="checkbox"],
.radio input[type="radio"] {
  position: absolute;
  left: -9999px; }

.checkbox span:before {
  content: '';
  float: left;
  width: 20px;
  height: 20px;
  border: 2px solid #C1C0C1;
  border-radius: 5px;
  margin: 0px 10px 0 0; }

.radio span:before {
  content: '';
  float: left;
  width: 20px;
  height: 20px;
  border: 2px solid #C1C0C1;
  border-radius: 15px;
  margin: 0px 10px 0 0; }

.radio.radio-horizontal {
  float: left;
  width: 100%;
  margin-bottom: 5px; }

.radio.thin span:before {
  border: 1px solid #C1C0C1; }

.radio.no-margin {
  margin: 0; }

.radio.mini span:before {
  width: 15px;
  height: 15px; }

.compact .checkbox span:before {
  width: 20px;
  height: 20px;
  margin-top: -2px;
  border: 1px solid #C1C0C1;
  background-color: #FFFFFF; }

.compact .checkbox.mini span:before {
  width: 15px;
  height: 15px; }

.compact .radio span {
  font-size: 15px;
  margin-right: 10px; }
  .compact .radio span:before {
    width: 15px;
    height: 15px;
    border-radius: 15px;
    margin: 5px 8px 0 0; }

.checkbox input[type=checkbox]:checked + span:before {
  background: #fff url("/static/images/checkbox-on.png") no-repeat center; }

.checkbox.mini input[type=checkbox]:checked + span:before {
  background-size: 20px 20px; }

.radio input[type=radio]:checked + span:before {
  background: #fff url("/static/images/radio-on.png") no-repeat center; }

.datarow input[type="checkbox"] {
  margin: 0 7px 0 0; }

label {
  cursor: pointer; }

.custom-dd {
  float: right;
  height: 33px;
  overflow: hidden;
  background: url(/static/images/select-arrow.png) right -19px no-repeat #fff;
  border: 1px solid #ccc;
  margin-left: 15px;
  margin-top: -5px;
  border-radius: 4px; }
  .custom-dd span {
    float: left; }
  .custom-dd.no-left-margin {
    margin-left: 0; }
  .custom-dd select {
    float: left;
    min-width: 300px;
    font-family: "Lato", sans-serif;
    background: transparent;
    padding: 6px 10px 0;
    font-size: 18px;
    border: 0;
    border-radius: 0;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    color: #666666;
    outline: none; }
  .custom-dd.short select {
    min-width: 150px; }
  .custom-dd.small {
    height: 28px;
    background: url(/static/images/select-arrow-small.png) right -14px no-repeat #fff;
    margin-left: 0;
    margin-top: 0; }
    .custom-dd.small select {
      min-width: 235px;
      font-size: 14px; }
      .custom-dd.small select.fixed {
        width: 177px; }
      .custom-dd.small select.short {
        min-width: 177px;
        width: 177px; }
    .custom-dd.small.wide select {
      width: 235px; }
  .custom-dd.full-width {
    width: 100%; }
    .custom-dd.full-width select {
      min-width: 100%; }
  .custom-dd.mini {
    height: 21px;
    background: url(/static/images/select-arrow-small.png) right -18px no-repeat #fff;
    margin-left: 0;
    margin-top: -11px; }
    .custom-dd.mini select {
      min-width: 175px;
      font-size: 13px;
      padding-top: 2px; }
    .custom-dd.mini.full-width select {
      width: 100%; }
  .custom-dd.multi {
    height: 28px;
    background: url(/static/images/select-arrow-small.png) right -14px no-repeat #fff;
    margin-left: 0;
    margin-top: 0;
    width: 100%; }
  .custom-dd.operator {
    height: 28px;
    background: #f6cb3d;
    margin-left: 0;
    margin-top: 0; }
    .custom-dd.operator select {
      min-width: 20px;
      font-size: 27px;
      margin-top: -10px;
      color: #FFFFFF; }
  .custom-dd.rounded-border {
    border-radius: 4px;
    float: left;
    margin-top: -4px; }
    .custom-dd.rounded-border.right {
      float: right; }
    .custom-dd.rounded-border.top-margin {
      margin-top: 5px; }

.custom-dd-operator .custom-dd.small {
  min-width: 138px;
  width: 146px;
  background: #FFFFFF; }

.custom-dd-multi {
  float: left;
  overflow: hidden;
  border: 1px solid #ccc;
  margin-left: 15px;
  margin-top: -5px; }
  .custom-dd-multi select {
    float: left;
    min-width: 300px;
    font-family: "Lato", sans-serif;
    background: transparent;
    padding: 6px 10px 0;
    font-size: 18px;
    border: 0;
    border-radius: 0;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    color: #423E3F;
    outline: none; }
  .custom-dd-multi.small {
    margin-left: 0;
    margin-top: 0; }
    .custom-dd-multi.small select {
      min-width: 235px;
      font-size: 14px; }
      .custom-dd-multi.small select option {
        padding: 5px 0; }
    .custom-dd-multi.small.full-width select {
      width: 100%; }
  .custom-dd-multi.full-width {
    width: 100%; }
  .custom-dd-multi.compact select {
    height: 55px;
    width: 100%;
    background: #FFFFFF; }
    .custom-dd-multi.compact select option {
      padding: 4px 0; }
    .custom-dd-multi.compact select:hover::-webkit-scrollbar {
      width: 8px;
      height: 40px; }
    .custom-dd-multi.compact select:hover::-webkit-scrollbar-thumb {
      background: #BDBDBC;
      -webkit-border-radius: 5px;
      -moz-border-radius: 5px;
      -ms-border-radius: 5px;
      border-radius: 5px;
      height: 40px; }
  .custom-dd-multi.rounded-border {
    border-radius: 4px; }

.datatable .custom-dd, .datatable .custom-dd-multi {
  border-radius: 4px; }

.custom-dd-lock {
  background: rgba(193, 192, 193, 0.3) url(/static/images/icon-lock.png) no-repeat right 10px top 50%; }

.custom-if {
  float: right;
  margin: -3px 0 0 15px; }
  .custom-if.date {
    float: left;
    margin: 0 5px 0 0;
    font-size: 10px;
    width: 47%; }
  .custom-if.search {
    margin: -6px 0 0 15px; }

.custom-if-bg {
  padding: 5px !important;
  margin: 2px 0;
  font-size: 12px;
  float: left;
  width: 89%;
  background: rgba(192, 191, 192, 0.15);
  border-radius: 5px; }
  .custom-if-bg span {
    margin-bottom: 5px;
    font-size: 12px; }
  .custom-if-bg input[type="text"].rounded-border {
    height: 18px;
    width: 85%; }

textarea {
  width: 100%;
  min-height: 100px;
  margin-top: 10px;
  border-color: #CCCCCC; }
  textarea.no-margin {
    margin: 0; }
  textarea.short {
    min-height: 60px; }
  textarea.rounded-border {
    border-radius: 4px; }

.account-attribute .option {
  font-size: 14px;
  margin-top: 3px;
  float: right; }
  .account-attribute .option span:before {
    width: 15px;
    height: 15px; }
  .account-attribute .option .radio {
    margin-right: 10px; }

.account-attribute .custom-dd {
  height: 28px;
  margin-top: 0;
  padding: 0 0 2px;
  background-position: right -21px; }
  .account-attribute .custom-dd.mini {
    height: 24px;
    background-position: right -16px; }
  .account-attribute .custom-dd.margin {
    margin: 0 20px; }
  .account-attribute .custom-dd select {
    font-size: 16px; }

.account-attribute button {
  float: right; }

.account-attribute input[type=date] {
  width: 51%;
  float: right;
  height: 18px;
  font-size: 14px; }

.account-attribute input[type=text] {
  height: 25px;
  width: 94%;
  border: 1px solid #CCCCCC;
  font-size: 13px;
  padding: 1px 5px;
  border-radius: 4px; }

.account-attribute .custom-date input[type=date] {
  height: 25px;
  width: 80%;
  border: 1px solid #CCCCCC;
  font-size: 13px;
  padding: 1px 5px;
  border-radius: 4px;
  margin-top: -2px; }

.account-attribute .custom-date.left-align input[type=date] {
  float: left;
  margin-left: 5px; }

.dropcheck {
  width: 300px;
  position: absolute;
  background: #fff;
  padding: 10px 15px 20px 15px;
  box-sizing: border-box;
  box-shadow: 1px 3px 5px rgba(0, 0, 0, 0.09), 1px 3px 5px rgba(0, 0, 0, 0.09), -3px 2px 5px rgba(0, 0, 0, 0.09);
  z-index: 97;
  border-radius: 5px;
  white-space: pre-wrap; }
  .dropcheck li {
    float: left;
    width: 100%;
    padding: 5px 0 5px 0;
    border-bottom: 1px dotted rgba(122, 121, 121, 0.2); }
    .dropcheck li span {
      float: left;
      width: 90%; }

.custom-slider {
  -webkit-appearance: none;
  width: 97%;
  height: 8px;
  background: #BDBDBC;
  opacity: 0.7;
  -webkit-transition: .2s;
  transition: opacity .2s;
  border-radius: 20px;
  margin: 5px 0 15px 0; }
  .custom-slider:hover {
    opacity: 1; }
  .custom-slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 15px;
    height: 15px;
    background: #F7BE00;
    cursor: pointer;
    border-radius: 20px; }
  .custom-slider::-moz-range-thumb {
    width: 25px;
    height: 25px;
    background: #4CAF50;
    cursor: pointer; }

@font-face {
  font-family: 'icomoon';
  src: url("/static/fonts/icomoon.eot?8d9ejb");
  src: url("/static/fonts/icomoon.eot?#iefix8d9ejb") format("embedded-opentype"), url("/static/fonts/icomoon.woff?8d9ejb") format("woff"), url("/static/fonts/icomoon.ttf?8d9ejb") format("truetype"), url("/static/fonts/icomoon.svg?8d9ejb#icomoon") format("svg");
  font-weight: normal;
  font-style: normal; }

[class*=" icon-"], [class^=icon-] {
  float: left;
  font-family: icomoon;
  font-size: 30px;
  margin-right: 6px;
  speak: none;
  font-style: normal;
  font-weight: 400;
  font-variant: normal;
  text-transform: none;
  line-height: 0.9;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  border: none;
  color: #666666; }
  [class*=" icon-"]:hover, [class^=icon-]:hover {
    color: #666666;
    opacity: 1; }
  [class*=" icon-"].active, [class^=icon-].active {
    color: #F7BE00;
    opacity: 1; }
  [class*=" icon-"].rightalign, [class^=icon-].rightalign {
    float: right; }
  [class*=" icon-"].small, [class^=icon-].small {
    font-size: 20px;
    margin-top: 4px; }
  [class*=" icon-"].mini, [class^=icon-].mini {
    font-size: 14px;
    margin-top: 5px; }
  [class*=" icon-"].smallright, [class^=icon-].smallright {
    position: absolute;
    right: 8px;
    font-size: 20px;
    top: 10px; }
  [class*=" icon-"].smallrightalign, [class^=icon-].smallrightalign {
    float: right;
    font-size: 20px; }
  [class*=" icon-"].smallleft, [class^=icon-].smallleft {
    font-size: 20px; }
  [class*=" icon-"].smallrelative, [class^=icon-].smallrelative {
    position: relative;
    font-size: 20px;
    margin-top: -20px; }
  [class*=" icon-"].miniright, [class^=icon-].miniright {
    font-size: 14px;
    float: right;
    margin: 2px 0px 0 10px; }
    [class*=" icon-"].miniright.right25, [class^=icon-].miniright.right25 {
      right: 25px; }
  [class*=" icon-"].mediumright, [class^=icon-].mediumright {
    font-size: 16px;
    float: right;
    margin: 2px 0px 0 10px; }
    [class*=" icon-"].mediumright.right25, [class^=icon-].mediumright.right25 {
      right: 25px; }
  [class*=" icon-"].disabled, [class^=icon-].disabled {
    pointer-events: none; }
  [class*=" icon-"].background, [class^=icon-].background {
    opacity: .05;
    font-size: 300px; }
  [class*=" icon-"].error, [class^=icon-].error {
    color: #FD4B18; }
  [class*=" icon-"].success, [class^=icon-].success {
    color: #2DB200; }
  [class*=" icon-"].highlight, [class^=icon-].highlight {
    color: #F9A408; }
  [class*=" icon-"].icon-reverse, [class^=icon-].icon-reverse {
    background: #000000;
    padding: 5px;
    color: #FFFFFF;
    position: relative;
    top: -5px; }

button[class*=" icon-"], button[class^=icon-] {
  cursor: pointer;
  outline: none;
  background: #FFFFFF; }
  button[class*=" icon-"].nobg, button[class^=icon-].nobg {
    background: transparent; }

a[class*=" icon-"], a[class^=icon-] {
  cursor: pointer;
  outline: none; }

.icon-checkmark:before {
  content: "\e903"; }

.icon-bubble2:before {
  content: "\e96e"; }

.icon-table2:before {
  content: "\ea71"; }

.icon-stack:before {
  content: "\e92e"; }

.icon-user:before {
  content: "\e971"; }

.icon-user-plus:before {
  content: "\e973"; }

.icon-users:before {
  content: "\e972"; }

.icon-circle-up:before {
  content: "\ea41"; }

.icon-circle-down:before {
  content: "\ea43"; }

.icon-search:before {
  content: "\e986"; }

.icon-info:before {
  content: "\ea0c"; }

.icon-sort:before {
  content: "\e900"; }

.icon-sort-alpha-asc:before {
  content: "\ea48"; }

.icon-sort-alpha-desc:before {
  content: "\ea49"; }

.icon-plus:before {
  content: "\ea0a"; }

.icon-minus:before {
  content: "\ea0b"; }

.icon-close:before {
  content: "\ea0f"; }

.icon-cog:before {
  content: "\e994"; }

.icon-pencil:before {
  content: "\e905"; }

.icon-enlarge2:before {
  content: "\e98b"; }

.icon-shrink2:before {
  content: "\e98c"; }

.icon-stats-dots:before {
  content: "\e99b"; }

.icon-stats-bars:before {
  content: "\e99c"; }

.icon-stats-bars2:before {
  content: "\e99d"; }

.icon-arrow-right:before {
  content: "\ea34"; }

.icon-arrow-right2:before {
  content: "\ea3c"; }

.icon-link:before {
  content: "\e9cb"; }

.icon-spinner11:before {
  content: "\e984"; }

.icon-loop2:before {
  content: "\ea2e"; }

.icon-bin:before {
  content: "\e9ac"; }

.icon-power:before {
  content: "\e9b5"; }

.icon-eye:before {
  content: "\e9ce"; }

.icon-eye-plus:before {
  content: "\e9cf"; }

.icon-aid-kit:before {
  content: "\e998"; }

.icon-warning:before {
  content: "\ea07"; }

.icon-download:before {
  content: "\e960"; }

.icon-user-minus:before {
  content: "\e974"; }

.icon-lab:before {
  content: "\e9aa"; }

.icon-testtube:before {
  content: "\e907"; }

.icon-arrow-up2:before {
  content: "\ea3a"; }

.icon-arrow-down2:before {
  content: "\ea3e"; }

.icon-man:before {
  content: "\e9dc"; }

.icon-woman:before {
  content: "\e9dd"; }

.icon-filter:before {
  content: "\ea5b"; }

.icon-pie-chart:before {
  content: "\e99a"; }

.icon-shield:before {
  content: "\e9b4"; }

.icon-sort-amount-desc:before {
  content: "\ea4d"; }

.icon-enlarge:before {
  content: "\e989"; }

.icon-shrink:before {
  content: "\e98a"; }

.icon-cogs:before {
  content: "\e995"; }

.icon-accessibility:before {
  content: "\e9b2"; }

.icon-target:before {
  content: "\e9b3"; }

.icon-list-numbered:before {
  content: "\e9b9"; }

.icon-copy:before {
  content: "\e92c"; }

.icon-history:before {
  content: "\e94d"; }

.icon-database:before {
  content: "\e964"; }

.icon-embed2:before {
  content: "\ea80"; }

.icon-file-text:before {
  content: "\e922"; }

.icon-flag:before {
  content: "\e9cc"; }

.icon-dice:before {
  content: "\e915"; }

.icon-question:before {
  content: "\ea09"; }

.icon-testtube {
  font-weight: bold;
  font-size: 42px;
  margin-top: -8px;
  margin-right: -3px; }

.icon-badge:before {
  content: "\e906"; }

.icon-magic-wand:before {
  content: "\e997"; }

.icon-blocked:before {
  content: "\ea0e"; }

.icon-popout:before {
  content: "\e904"; }

.icon-profile:before {
  content: "\e923"; }

.icon-barcode:before {
  content: "\e937"; }

.icon-lock:before {
  content: "\e98f"; }

.icon-unlocked:before {
  content: "\e990"; }

.filter-bar.active .icon-plus:before {
  content: "\ea0f"; }

.button {
  background-color: #F7BE00;
  color: #fff;
  display: block;
  padding: 17px 32px;
  text-align: center;
  color: #FFFFFF;
  cursor: pointer;
  outline: none;
  border-radius: 4px; }
  .button.disabled {
    pointer-events: none;
    opacity: 0.7; }
  .button:hover {
    background-color: #F9A408; }
  .button.top-margin {
    margin-top: 20px; }
  .button.thin {
    padding: 2px 20px;
    font-size: 18px;
    font-weight: 300; }
  .button.button-anchor {
    border-radius: 0;
    padding: 8px 10px; }

.multibutton .button:first-child {
  float: left;
  padding-right: 12px;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0; }

.multibutton .button:nth-child(2) {
  float: left;
  padding-right: 12px;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0; }

.multibutton.min-width {
  width: 110px; }

button {
  background: transparent;
  border: none;
  outline: none;
  padding: 0;
  font-family: "Lato", sans-serif;
  line-height: 28px;
  cursor: pointer; }
  button.button {
    font-size: 20px;
    font-weight: 300; }
    button.button.full {
      width: 100%; }
    button.button.thin {
      padding: 2px 20px; }
    button.button.thinner {
      padding: 0 18px;
      font-size: 16px; }
      button.button.thinner.icon {
        padding: 7px 5px 7px 7px; }
    button.button.small {
      font-size: 17px;
      background-color: #F7BE00;
      font-weight: 400;
      line-height: 22px; }
    button.button.icon {
      padding: 8px 8px 8px 10px;
      background-color: #F9A408;
      margin-right: 0px; }
    button.button.right {
      float: right; }
    button.button.active {
      background-color: #F9A408;
      outline: none;
      border: none; }
  button.option {
    color: #666666;
    font-weight: 300; }
  button.filter-buttons {
    margin: 0 0 0 10px;
    padding: 3px 25px;
    background: #C1C0C1;
    color: #FFF;
    font-size: 18px;
    border: none;
    line-height: normal;
    border-radius: 4px; }
    button.filter-buttons.custom {
      border-top-left-radius: 20px;
      border-bottom-right-radius: 20px;
      margin: 0;
      font-size: 19px; }
    button.filter-buttons.mini {
      padding: 0px 20px; }
    button.filter-buttons:hover, button.filter-buttons.active {
      background-color: #F7BE00;
      outline: none;
      border: none; }
  button.small, button.smallright, button.miniright {
    background: transparent; }
  button.link {
    color: #666666;
    font-size: 16px;
    text-align: left; }
  button.tips span {
    display: none;
    float: left;
    margin-right: 5px;
    text-transform: capitalize;
    font-family: "Lato", sans-serif;
    color: #666666;
    font-size: 12px; }
    button.tips span.infotip {
      position: absolute;
      width: 225px;
      height: auto;
      text-transform: initial;
      background: #FFFFFF;
      padding: 10px 5px 10px 15px;
      top: 0;
      text-align: left;
      left: 64px;
      border: double #D9D8D9;
      border-radius: 20px;
      box-sizing: border-box;
      box-shadow: 1px 3px 5px rgba(0, 0, 0, 0.09), 1px 3px 5px rgba(0, 0, 0, 0.09), -3px 2px 5px rgba(0, 0, 0, 0.09);
      z-index: 100;
      line-height: 17px; }
      button.tips span.infotip.left-align {
        left: -235px; }
      button.tips span.infotip.top-align {
        top: -50px; }
    button.tips span.infotip-icon {
      position: absolute;
      width: auto;
      height: auto;
      text-transform: initial;
      background: #FFFFFF;
      padding: 10px 15px 10px 15px;
      border: double #D9D8D9;
      border-radius: 20px;
      box-sizing: border-box;
      box-shadow: 1px 3px 5px rgba(0, 0, 0, 0.09), 1px 3px 5px rgba(0, 0, 0, 0.09), -3px 2px 5px rgba(0, 0, 0, 0.09);
      z-index: 100;
      line-height: 17px;
      text-transform: capitalize; }
  button.tips:hover span {
    display: block; }

.customization-bar .button {
  padding: 10px 50px; }

.caret-right-img a {
  font-size: 16px;
  font-weight: 400;
  line-height: 1.4;
  color: #f7be00;
  display: block;
  position: relative;
  padding: 0 0 0 16px; }
  .caret-right-img a:before {
    content: "";
    background: url(/static/images/caret-right-rail.png) no-repeat;
    display: inline-block;
    width: 9px;
    height: 13px;
    position: absolute;
    top: 4px;
    left: 0; }

/* Index 

1. Common
2. List
2. Title
3. Wrapper
4. Border

*/
/* Common */
body {
  font-family: "Lato", sans-serif;
  color: #666666; }

.relative {
  position: relative; }

.fadedisplay {
  opacity: .5; }

.opacity0 {
  opacity: 0; }

.fadeItem {
  animation: fadeIn 1s linear; }

.arccontainer {
  min-height: 450px; }

.column.large-12 {
  width: 100%; }

.column.large-6 {
  width: 50%; }

.column.large-4 {
  width: 33.33%; }

.column.large-3 {
  width: 25%; }

.column.large-2 {
  width: 16.66%; }

.column.large-1 {
  width: 8.33%; }

/* List */
ul.list {
  line-height: 1.6;
  margin-left: 30px;
  list-style-type: disc; }

ul.columns {
  width: 100%;
  float: left;
  padding-bottom: 30px; }
  ul.columns li {
    float: left;
    width: 25%;
    margin: 8px 0;
    font-size: 17px; }
    ul.columns li label {
      text-transform: capitalize; }
  ul.columns.compact li {
    font-size: 15px;
    position: relative; }
    ul.columns.compact li label {
      width: 80%;
      float: left; }
    ul.columns.compact li .miniright {
      margin-top: -5px;
      margin-right: 10px; }

ul.columns-right li {
  float: right;
  width: auto;
  margin-left: 30px; }

ul.horizontal li {
  float: left;
  margin-left: 20px; }
  ul.horizontal li.right-margin {
    margin-left: 0px;
    margin-right: 20px; }

ul.hidelist {
  display: none; }

ul.margin-list li {
  margin-bottom: 5px; }

ul.border-list li {
  border-bottom: 1px dotted #D9D8D9; }

ul a.link {
  color: #666666;
  font-size: 16px;
  text-align: left; }

/* Error text color*/
.error-message {
  color: #FD4B18; }
  .error-message.small {
    font-size: 15px; }
  .error-message.lower-case {
    text-transform: capitalize; }
  .error-message input[type="text"] {
    border-color: #FD4B18; }

.success-message {
  color: #2DB200; }
  .success-message.small {
    font-size: 15px; }
  .success-message.lower-case {
    text-transform: capitalize; }

.invalid {
  color: #FD4B18; }

.duplicate {
  color: #F9A408; }

.donotmatch {
  color: #FD4B18; }

.line-through {
  text-decoration: line-through; }
  .line-through button {
    display: none; }

.hide {
  display: none !important; }

/* Title */
.page-title {
  font-size: 35px;
  color: #000000; }
  .page-title.sub {
    font-size: 30px; }
  .page-title.small {
    font-size: 25px; }
  .page-title h1 {
    float: left; }
  .page-title .right-title {
    font-family: "Lato", sans-serif;
    font-weight: 300;
    font-size: 15px;
    float: right;
    margin: 28px 0 0 0; }
  .page-title.no-border {
    border-bottom: none;
    padding-bottom: 0; }
  .page-title.padding-top {
    padding-top: 30px; }

.section-title {
  font-size: 20px; }
  .section-title .right-title {
    font-family: "Lato", sans-serif;
    font-weight: 300;
    float: right; }

.section-title-sub {
  font-size: 16px;
  border-style: none;
  width: 100%; }
  .section-title-sub.sub {
    font-size: 14px; }
    .section-title-sub.sub.no-margin {
      padding: 5px;
      margin-bottom: 5px; }
  .section-title-sub .right-title {
    font-family: "Lato", sans-serif;
    font-weight: 300;
    font-size: 14px;
    float: right; }
  .section-title-sub.no-margin {
    padding: 5px;
    margin-bottom: 10px; }
  .section-title-sub.active {
    color: #F9A408; }
  .section-title-sub.title-wrapper {
    padding: 10px 5px 5px 5px;
    margin: 0 0 5px 0; }

.background {
  background-color: rgba(192, 191, 192, 0.15); }

.section-title-right {
  float: right; }

.question-title {
  font-size: 15px;
  color: #413E3F;
  margin: 0 5px 5px 0; }
  .question-title .success-message,
  .question-title .error-message {
    margin-left: 10px; }

.small-font {
  font-size: 14px; }

.disclaimer {
  font-size: 11px; }

/* Wrapper */
.wrapper-generic {
  padding: 30px; }

.wrapper-right {
  padding-right: 30px; }

.wrapper-center {
  text-align: center; }

.wrapper {
  padding: 0 20px; }

.wrapper-left-text {
  text-align: left; }

.wrapper-right-text {
  text-align: right; }

.wrapper-wide {
  padding: 0 40px; }

/* Border */
.border-top {
  border-top: 1px solid #D9D8D9; }

.border-right {
  border-right: 1px solid #D9D8D9;
  margin-right: -1px; }

.border-left {
  border-left: 1px solid #D9D8D9;
  margin-left: -2px; }

.border-bottom {
  float: left;
  width: 100%;
  border-bottom: 1px solid #D9D8D9; }

.border-bottom-success {
  border-bottom: 3px solid #2DB200 !important; }

.border-bottom-error {
  border-bottom: 3px solid #FD4B18 !important; }

.bottom-padding {
  padding-bottom: 40px; }

.top-padding {
  padding-top: 20px; }

.padding-3 {
  padding: 3px; }

.no-margin {
  margin: 0; }

.no-top-margin {
  margin-top: 0; }

.no-bottom-margin {
  margin-bottom: 0; }

.no-right-margin {
  margin-right: 0; }

.no-padding {
  padding: 0 !important; }

.no-left-padding {
  padding-left: 0 !important; }

.left-margin {
  margin-left: 10px; }

.right-margin {
  margin-right: 10px; }

.top-margin {
  margin-top: 10px; }

.top-margin-short {
  margin-top: 5px; }

.bottom-margin {
  margin-bottom: 10px; }

.no-left-margin {
  margin-left: 0 !important; }

.proband {
  background-color: #add8e6 !important; }

.currentprofile {
  background-color: #efcd5c5e !important; }

.capitalize {
  text-transform: capitalize; }

.flex {
  display: flex; }

.pointer {
  cursor: pointer; }

.min-height {
  height: 225px; }

.filter-options {
  display: none;
  border: 1px solid #D9D8D9;
  float: left;
  width: 100%; }
  .filter-options.active {
    display: block; }

.customization-bar {
  padding-top: 10px;
  margin-bottom: 10px; }
  .customization-bar.filter {
    padding-top: 20px;
    padding-bottom: 25px;
    margin-bottom: 0; }
    .customization-bar.filter .option {
      margin-right: 30px; }
      .customization-bar.filter .option .error-message {
        margin-left: 10px; }
  .customization-bar.appliedfilter .option {
    font-size: 16px; }
  .customization-bar .search-label {
    float: left; }
  .customization-bar .search-terms {
    text-transform: capitalize; }
    .customization-bar .search-terms em {
      color: #F9A408; }
      .customization-bar .search-terms em.nohighlight {
        color: #666666; }
  .customization-bar.no-border {
    border-bottom: none;
    padding-bottom: 0; }
  .customization-bar.no-padding {
    padding: 0; }
  .customization-bar .right {
    float: right; }
  .customization-bar.block {
    border: 1px solid #D9D8D9;
    margin: 20px 1.5%;
    width: 30%;
    position: relative;
    padding-bottom: 15px;
    min-height: 142px; }
    .customization-bar.block .option-max {
      min-height: 290px; }
    .customization-bar.block .option {
      width: 90%;
      margin: 0 0 0 4%; }
      .customization-bar.block .option span {
        font-size: 15px;
        margin: 10px 0 10px 0;
        float: left; }
        .customization-bar.block .option span.no-margin {
          margin-bottom: 0px; }
      .customization-bar.block .option .custom-dd {
        margin: 0;
        float: left;
        width: 100%; }
        .customization-bar.block .option .custom-dd select {
          width: 100%; }
      .customization-bar.block .option .custom-if {
        width: 100%;
        float: left;
        margin: 0 0 10px 0; }
        .customization-bar.block .option .custom-if input {
          border-bottom: 1px solid #D9D8D9; }
      .customization-bar.block .option .checkbox span:before {
        margin-top: -5px; }
      .customization-bar.block .option .radio {
        margin: 20px 20px 0 0;
        float: left; }
        .customization-bar.block .option .radio span:before {
          margin-top: -5px; }
      .customization-bar.block .option.close-filter {
        position: absolute;
        top: 10px;
        right: 10px;
        width: 20px; }
      .customization-bar.block .option.half {
        width: 50%;
        margin: 0; }

.option {
  cursor: pointer;
  font-size: 20px;
  float: left;
  margin: 10px 10px 0;
  /* button {
		&.filter-buttons {
		    margin: 0 0 0 10px;
		    padding: 3px 25px;
		    background: $pagination-gray;
		    color: #FFF;
		    cursor: pointer;
		    font-size: 18px;
		    border: none;

		    &:hover, &.active {
				background-color: $light-orange;
				outline: none;
				border: none;
			}
		}
	} */ }
  .option.right {
    float: right; }
  .option:hover {
    color: #F7BE00; }
  .option.no-link {
    cursor: text !important; }
    .option.no-link:hover {
      color: #666666; }
  .option.fullwidth {
    width: 100%;
    margin-top: 30px; }
  .option.no-margin {
    margin: 0; }
  .option.center-margin {
    margin-top: 5px; }
  .option.small {
    font-size: 18px; }

.section {
  float: left;
  width: 100%;
  padding-bottom: 20px;
  padding-top: 20px; }
  .section p {
    margin-bottom: 20px; }
  .section.error-callout {
    background-color: #fcd6d6;
    border: 1px solid #FF0000;
    transition: background-color 500ms; }
  .section.message a {
    color: #000000;
    text-decoration: underline; }

.boxcontainer {
  width: 100%;
  float: left;
  padding: 0;
  background-color: #FFFFFF;
  margin-bottom: 30px;
  height: 100px;
  border-radius: 6px;
  transition-property: all;
  transition-duration: 0.5s;
  transition-timing-function: cubic-bezier(0, 1, 0.5, 1); }
  .boxcontainer.shadow {
    box-shadow: 1px 3px 5px rgba(0, 0, 0, 0.09), 1px 3px 5px rgba(0, 0, 0, 0.09), -3px 2px 5px rgba(0, 0, 0, 0.09); }
  .boxcontainer.animation {
    overflow-y: scroll;
    height: 660px;
    /* approximate max height */
    transition-property: all;
    transition-duration: 0.5s;
    transition-timing-function: cubic-bezier(0, 1, 0.5, 1); }
    .boxcontainer.animation.auto {
      height: 100%; }
    .boxcontainer.animation .fixedheight {
      height: 525px;
      overflow: scroll; }
    .boxcontainer.animation.no-scroll {
      overflow: initial; }
  .boxcontainer.autoheight {
    height: auto; }
    .boxcontainer.autoheight .fixedheight {
      height: auto;
      overflow: scroll; }
  .boxcontainer.flexheight {
    min-height: 150px; }
  .boxcontainer.short {
    overflow-y: scroll;
    height: 370px;
    /* approximate max height */
    transition-property: all;
    transition-duration: 0.5s;
    transition-timing-function: cubic-bezier(0, 1, 0.5, 1); }
    .boxcontainer.short .fixedheight {
      height: 90px;
      overflow: scroll; }
      .boxcontainer.short .fixedheight .option {
        margin: 10px 9px 0 0; }
  .boxcontainer .auto-scroll {
    overflow: scroll; }

.message-box {
  width: 70%;
  margin: 20px auto; }

/* Change Password */
.status-box {
  padding: 30px 60px;
  border-bottom: 1px solid #D9D8D9;
  text-align: center; }
  .status-box .error-message {
    display: block;
    color: #FFFFFF;
    background-color: #FD4B18;
    padding: 20px;
    transition: background-color 500ms; }
  .status-box .success-message {
    display: block;
    color: #FFFFFF;
    background-color: #2DB200;
    padding: 20px;
    transition: background-color 500ms; }

.tooltip {
  position: absolute;
  top: 0;
  padding: 10px;
  background: #FFF;
  opacity: 0;
  font-size: 12px; }

#tooltip {
  position: absolute;
  width: 200px;
  height: auto;
  padding: 10px;
  background-color: white;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  box-shadow: 1px 3px 5px rgba(0, 0, 0, 0.09), 1px 3px 5px rgba(0, 0, 0, 0.09), -3px 2px 5px rgba(0, 0, 0, 0.09); }
  #tooltip.hidden {
    opacity: 0; }
  #tooltip span {
    text-transform: capitalize; }

.lightbox {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #FFFFFF;
  z-index: 999;
  width: 50%;
  height: auto;
  cursor: default; }
  .lightbox.full {
    width: 90%; }
  .lightbox table {
    background: #FFFFFF;
    border: solid 1px #DDDDDD;
    margin-bottom: 1.25rem;
    table-layout: auto; }
    .lightbox table tr th, .lightbox table tr td {
      color: #222222;
      font-size: 0.875rem;
      padding: 0.5625rem 0.625rem;
      text-align: left;
      border: 1px solid #ccc; }
    .lightbox table tr:nth-of-type(even) {
      background: #F9F9F9; }

/* Loading icons */
.loading-sign {
  text-align: center;
  margin: 30px; }
  .loading-sign.light {
    margin: 0 10px; }
    .loading-sign.light div {
      float: right;
      width: 80px; }
    .loading-sign.light.mini {
      font-size: 14px; }
    .loading-sign.light.top-align {
      margin-top: -8px !important;
      float: right; }
  .loading-sign.center {
    margin: 15px 10px 0px; }
    .loading-sign.center div {
      width: 100%; }
  .loading-sign.right {
    float: right; }
  .loading-sign span {
    display: inline-block;
    width: 0px;
    height: 0px;
    background: #F7BE00;
    border-radius: 50%;
    margin: 1% 5px;
    animation: growShrink 1.5s infinite;
    animation-delay: 0s; }
    .loading-sign span:nth-child(2) {
      animation-delay: 0.25s; }
    .loading-sign span:nth-child(3) {
      animation-delay: 0.5s; }
    .loading-sign span:nth-child(4) {
      animation-delay: 0.75s; }
    .loading-sign span:nth-child(5) {
      animation-delay: 0.1s; }

.overflowbox {
  width: 99%;
  overflow: auto; }
  .overflowbox.boxshadow {
    box-shadow: 15px 0 15px 1px rgba(0, 0, 0, 0.2); }

.text-truncate {
  width: 225px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  float: left; }
  .text-truncate:hover {
    width: 325px;
    overflow: visible;
    white-space: normal;
    height: auto;
    background-color: #fff;
    border: double #D9D8D9;
    border-radius: 20px;
    padding: 10px;
    position: absolute;
    z-index: 100; }

.notes-section {
  float: left;
  width: 99%;
  height: 500px;
  overflow: auto;
  padding-right: 30px;
  border-bottom: 1px solid #D9D8D9; }
  .notes-section.short {
    min-height: 300px;
    height: 350px; }
  .notes-section .notes-block {
    float: left;
    width: 100%;
    padding: 10px;
    border-bottom: 1px solid #D9D8D9;
    font-size: 14px; }
    .notes-section .notes-block .notes-date {
      float: left;
      width: 30%; }
    .notes-section .notes-block .notes-by {
      float: left;
      width: 10%;
      text-transform: uppercase; }
    .notes-section .notes-block .notes-text {
      float: left;
      width: 60%;
      padding-left: 10px;
      box-sizing: border-box; }
  .notes-section.stack .notes-block {
    border-bottom: none;
    box-shadow: 0 5px 10px rgba(122, 121, 121, 0.2);
    margin: 5px 0;
    border-radius: 6px; }
    .notes-section.stack .notes-block .notes-date {
      width: 90%;
      border-bottom: 1px solid rgba(122, 121, 121, 0.2);
      padding: 0 0 7px 0; }
    .notes-section.stack .notes-block .notes-by {
      float: right;
      border-bottom: 1px solid rgba(122, 121, 121, 0.2);
      padding: 0 0 7px 0; }
    .notes-section.stack .notes-block .notes-text {
      float: left;
      width: 100%;
      padding: 10px 0;
      box-sizing: border-box; }

.ror_dashboard .chart .section {
  min-height: 600px; }

#sankey-chart {
  width: 1160px;
  margin: 0 auto; }

.popupmodal {
  position: absolute;
  border: double #D9D8D9;
  border-radius: 20px;
  background: #FFFFFF;
  width: 380px;
  padding: 20px;
  box-sizing: border-box;
  box-shadow: 1px 3px 5px rgba(0, 0, 0, 0.09), 1px 3px 5px rgba(0, 0, 0, 0.09), -3px 2px 5px rgba(0, 0, 0, 0.09);
  z-index: 100; }
  .popupmodal .section-title {
    margin-bottom: 0px; }
  .popupmodal .popup-title {
    float: left; }
    .popupmodal .popup-title.label {
      background-color: #F8F8F8;
      width: 100%;
      padding: 5px 10px;
      box-sizing: border-box;
      margin-bottom: 5px;
      border-bottom: 1px solid #D9D8D9;
      text-transform: capitalize; }
    .popupmodal .popup-title .popup-title-right {
      float: right; }
  .popupmodal .popup-attribute {
    float: left;
    width: 100%;
    font-size: 14px;
    padding: 8px 10px;
    box-sizing: border-box;
    border-bottom: 1px solid #D9D8D9; }
    .popupmodal .popup-attribute .title {
      float: left;
      width: 25%; }

.remove-option button {
  display: none; }

.remove-option:hover button {
  display: block; }

/* Header */
.headerwrapper {
  min-height: 80px; }
  .headerwrapper .site-logo {
    float: left;
    padding: 10px 0 5px 0; }
    .headerwrapper .site-logo a {
      float: left; }
  .headerwrapper h4.menu-lebel {
    font-size: 20px;
    font-weight: 400;
    border-bottom: 1px dotted #fff;
    padding: 0 0 10px 0;
    color: #FFFFFF; }
  .headerwrapper ul.settings-menu-list {
    padding: 5px 0; }
    .headerwrapper ul.settings-menu-list li a {
      background: url("/static/images/caret-right-rail.png") 20px center no-repeat;
      font-size: 16px;
      padding: 5px 0; }
      .headerwrapper ul.settings-menu-list li a:hover {
        background-color: #7A7979; }
      .headerwrapper ul.settings-menu-list li a span {
        display: block;
        margin-left: 35px; }
  .headerwrapper .responsive-menu {
    display: none; }
  .headerwrapper .user-menu {
    float: right; }
    .headerwrapper .user-menu .user-row {
      text-align: right;
      min-width: 400px;
      height: 33px;
      border-bottom: 1px solid #D9D8D9;
      margin-top: 5px; }
      .headerwrapper .user-menu .user-row .user-profile {
        float: right;
        width: auto;
        padding: 0 15px 0 0;
        height: 33px;
        border-right: 1px solid #D9D8D9; }
      .headerwrapper .user-menu .user-row .user-alerts {
        float: right;
        width: 80px;
        height: 33px;
        border-right: 1px solid #D9D8D9; }
        .headerwrapper .user-menu .user-row .user-alerts .alerts-button {
          float: right;
          height: 15px;
          background: url("/static/images/bell-sprite.png") 0 0 no-repeat;
          font-size: 10px;
          font-weight: 400;
          color: #fff;
          margin: 7px 15px;
          padding: 0 0 0 22px; }
          .headerwrapper .user-menu .user-row .user-alerts .alerts-button span {
            background-color: #FD4B18;
            -webkit-border-radius: 4px;
            border-radius: 4px;
            position: relative;
            padding: 1px 10px;
            width: 25px; }
            .headerwrapper .user-menu .user-row .user-alerts .alerts-button span::before {
              content: "";
              display: block;
              width: 0;
              height: 0;
              border-style: solid;
              border-width: 3px 3px 3px 0;
              border-color: transparent #FD4B18 transparent transparent;
              position: absolute;
              left: -3px;
              top: 50%;
              -webkit-transform: translateY(-50%);
              -ms-transform: translateY(-50%);
              transform: translateY(-50%); }
      .headerwrapper .user-menu .user-row .user-settings {
        color: #FFFFFF;
        float: right;
        width: 45px;
        height: 26px;
        padding-top: 7px;
        position: relative; }
        .headerwrapper .user-menu .user-row .user-settings a {
          font-size: 14px;
          font-weight: 300;
          float: left;
          width: 100%;
          height: 20px;
          color: #FFFFFF;
          text-decoration: none; }
          .headerwrapper .user-menu .user-row .user-settings a span.icon-cog {
            color: #666666;
            font-size: 15px;
            margin: 0 0 0 10px; }
        .headerwrapper .user-menu .user-row .user-settings:hover {
          background-color: #888888; }
          .headerwrapper .user-menu .user-row .user-settings:hover span.icon-cog {
            color: #FFFFFF; }
          .headerwrapper .user-menu .user-row .user-settings:hover .settings-menu-dropdown {
            display: block; }
        .headerwrapper .user-menu .user-row .user-settings .settings-menu-dropdown {
          display: none;
          width: 250px;
          position: absolute;
          top: 100%;
          right: 0;
          background-color: #888;
          z-index: 30;
          text-align: left;
          padding-bottom: 10px; }
          .headerwrapper .user-menu .user-row .user-settings .settings-menu-dropdown h4.menu-lebel {
            padding: 10px 20px; }
          .headerwrapper .user-menu .user-row .user-settings .settings-menu-dropdown a span {
            display: block; }
    .headerwrapper .user-menu .community-row {
      text-align: right;
      padding: 15px 0; }
  .headerwrapper .main-menu {
    float: right;
    text-transform: uppercase; }
    .headerwrapper .main-menu .login-row {
      height: 33px; }
      .headerwrapper .main-menu .login-row .btn-login-main-menu {
        floar: left;
        margin-left: 20px;
        color: #666666; }
        .headerwrapper .main-menu .login-row .btn-login-main-menu:before {
          content: "";
          display: block;
          width: 13px;
          height: 11px;
          background: url(/static/images/log-in-icon-sprite.png) no-repeat;
          position: relative;
          top: 16px;
          left: -20px; }
        .headerwrapper .main-menu .login-row .btn-login-main-menu:hover {
          color: #F7BE00; }
          .headerwrapper .main-menu .login-row .btn-login-main-menu:hover:before {
            background-position: 0px -11px; }
  .headerwrapper .mobile-nav {
    display: none; }
  .headerwrapper.generic {
    max-width: 960px; }

/* Site Navigation */
.navwrapper {
  margin: 30px auto;
  clear: both; }
  .navwrapper .nav-bar {
    width: 100%;
    min-height: 25px;
    background-color: #F7BE00;
    color: #FFFFFF;
    text-align: center;
    /* Portal menu */ }
    .navwrapper .nav-bar ul {
      margin: 0;
      padding: 0;
      text-align: center; }
      .navwrapper .nav-bar ul li {
        text-transform: uppercase;
        list-style-type: none;
        display: inline-block;
        padding: 20px 15px;
        margin: 0 5px; }
        .navwrapper .nav-bar ul li.active {
          background-color: #F9A408; }
        .navwrapper .nav-bar ul li a {
          color: #FFFFFF;
          text-decoration: none;
          padding: 10px 15px; }
    .navwrapper .nav-bar .portal-nav {
      float: left;
      position: absolute;
      height: 62px;
      overflow: hidden;
      background-color: #fc822f;
      padding-left: 5%;
      padding-right: 20px;
      text-align: right; }
      .navwrapper .nav-bar .portal-nav:hover {
        height: auto; }
      .navwrapper .nav-bar .portal-nav li {
        width: 200px;
        font-style: italic;
        border-bottom: 1px solid #F7BE00;
        box-sizing: content-box; }
        .navwrapper .nav-bar .portal-nav li a {
          padding: 0; }
          .navwrapper .nav-bar .portal-nav li a:first-letter {
            font-size: 200%; }
    .navwrapper .nav-bar .arrow-right {
      width: 0;
      height: 0;
      border-top: 31px solid transparent;
      border-bottom: 31px solid transparent;
      border-left: 32px solid #fc822f;
      position: absolute;
      left: 100%; }
    .navwrapper .nav-bar .container {
      position: relative;
      width: 290px; }
  .navwrapper.generic .nav-bar {
    min-height: 170px; }

/* Content Area */
.contentarea .contentwrapper {
  width: 100%;
  float: left;
  padding: 0;
  box-shadow: 1px 3px 5px rgba(0, 0, 0, 0.09), 1px 3px 5px rgba(0, 0, 0, 0.09), -3px 2px 5px rgba(0, 0, 0, 0.09);
  background-color: #FFFFFF;
  border-radius: 6px; }

.contentarea .content {
  padding: 0 30px; }

.contentarea.generic {
  max-width: 960px; }
  .contentarea.generic .contentwrapper {
    margin-top: -170px;
    min-height: 300px;
    padding: 0;
    width: 100%; }
  .contentarea.generic.displaynav .contentwrapper {
    margin-top: -140px; }
  .contentarea.generic .content {
    padding: 0; }

/* Footer */
.footerwrapper {
  margin: 30px auto;
  font-weight: 300;
  float: left;
  width: 100%; }
  .footerwrapper .footer-bar {
    background-color: #423E3F;
    color: #CCCCCC;
    padding: 15px 5%;
    text-align: center; }

/* Summary Statistics */
.statusyear {
  position: relative;
  /* top: 100px; */
  top: -10px;
  width: 325px;
  margin: 0 auto; }
  .statusyear .icon {
    position: relative;
    left: 25px; }
  .statusyear .years {
    position: absolute;
    background: #FFF;
    height: 25px;
    overflow: hidden;
    opacity: 0.8;
    z-index: 100; }
  .statusyear .year {
    padding: 0 0 10px 0;
    float: left;
    width: 100%;
    font-size: 13px;
    cursor: pointer;
    color: #666666; }
    .statusyear .year.displayyear {
      font-size: 15px; }
  .statusyear.open .years {
    height: auto; }

.funnelcontainer {
  min-height: 500px; }

#statistics-gauge {
  clear: both; }
  #statistics-gauge g.hidden line, #statistics-gauge g.hidden path {
    display: none; }
  #statistics-gauge g text {
    fill: #666666; }

.datafont {
  font-family: Consolas, Menlo, Courier, monospace; }
  .datafont td {
    font-size: 13px; }

.datalist.auto {
  float: left;
  overflow: auto;
  height: 425px; }

.datalist .datarow {
  margin-bottom: 10px;
  float: left;
  width: 100%; }
  .datalist .datarow .dataitem {
    float: left;
    width: 30%;
    text-align: center;
    padding: 10px 6px 8px;
    box-sizing: border-box;
    background: rgba(122, 121, 121, 0.2);
    box-shadow: 3px 3px 5px 1px rgba(0, 0, 0, 0.2);
    font-size: 12px; }
  .datalist .datarow .datatext {
    float: left;
    width: 70%;
    padding: 0 20px 20px;
    box-sizing: border-box;
    font-size: 14px; }

.datacontainer {
  min-height: 500px;
  position: relative;
  float: left;
  width: 100%;
  transition-property: all;
  transition-duration: 0.5s;
  transition-timing-function: cubic-bezier(0, 1, 0.5, 1); }
  .datacontainer.short {
    min-height: 200px; }
  .datacontainer .scroll-right,
  .datacontainer .scroll-left {
    display: block;
    position: absolute;
    height: 100%;
    width: 12px;
    z-index: 5; }
  .datacontainer .scroll-left {
    left: 0;
    box-shadow: 15px 0 15px -15px rgba(0, 0, 0, 0.8) inset;
    z-index: 100; }
  .datacontainer .scroll-right {
    right: 0;
    box-shadow: -15px 0 15px -15px rgba(0, 0, 0, 0.8) inset; }
  .datacontainer .datadisplay {
    width: 100%;
    overflow: auto;
    padding-bottom: 10px;
    max-height: 500px;
    position: relative;
    z-index: 4; }
    .datacontainer .datadisplay::-webkit-scrollbar {
      width: 8px;
      height: 10px;
      border-top: 1px solid #D9D8D9;
      border-bottom: 1px solid #D9D8D9; }
    .datacontainer .datadisplay::-webkit-scrollbar-thumb {
      background: #BDBDBC;
      -webkit-border-radius: 5px;
      -moz-border-radius: 5px;
      -ms-border-radius: 5px;
      border-radius: 5px; }
    .datacontainer .datadisplay.long {
      max-height: 800px; }
  .datacontainer .datatable {
    width: 2350px; }
    .datacontainer .datatable.auto {
      width: 100%; }
    .datacontainer .datatable tr.active {
      color: #F9A408;
      background-color: #F9F9F9; }
    .datacontainer .datatable td {
      border: 1px solid rgba(122, 121, 121, 0.2); }
    .datacontainer .datatable .headerrow {
      font-size: 14px;
      text-transform: capitalize; }
      .datacontainer .datatable .headerrow.top-row td {
        background-color: #ffcc71;
        position: sticky;
        top: -1px;
        z-index: 98; }
      .datacontainer .datatable .headerrow.sub-row td {
        background-color: #ffe89b;
        position: sticky;
        top: 36px; }
      .datacontainer .datatable .headerrow.search-row td {
        background-color: #fff5d3;
        position: 36px;
        padding: 5px 10px; }
        .datacontainer .datatable .headerrow.search-row td input {
          height: 25px;
          width: 94%;
          border: 1px solid #ccc;
          font-size: 13px;
          padding: 1px 3px;
          border-radius: 4px; }
          .datacontainer .datatable .headerrow.search-row td input.date {
            font-size: 10px; }
          .datacontainer .datatable .headerrow.search-row td input.operator {
            width: 65%; }
        .datacontainer .datatable .headerrow.search-row td input[type="checkbox"] {
          width: 7%;
          float: left;
          height: 16px; }
        .datacontainer .datatable .headerrow.search-row td .miniright {
          float: left;
          margin: 9px 0 0 -20px; }
        .datacontainer .datatable .headerrow.search-row td .search-operator {
          min-width: 165px; }
        .datacontainer .datatable .headerrow.search-row td .datecontainer .miniright {
          margin: 0 0 0 -14px; }
      .datacontainer .datatable .headerrow.padding-right td {
        padding-right: 50px; }
    .datacontainer .datatable .datarow {
      background-color: #FFFFFF; }
      .datacontainer .datatable .datarow td {
        font-size: 15px;
        cursor: pointer; }
        .datacontainer .datatable .datarow td:nth-child(-n+3) {
          background-color: #FFFFFF; }
      .datacontainer .datatable .datarow:hover {
        background-color: #D9D8D9; }
        .datacontainer .datatable .datarow:hover td {
          color: #F9A408;
          background-color: #F9F9F9; }
        .datacontainer .datatable .datarow:hover [class*=" icon-"], .datacontainer .datatable .datarow:hover [class^=icon-] {
          color: #FD4B18; }
          .datacontainer .datatable .datarow:hover [class*=" icon-"].warning, .datacontainer .datatable .datarow:hover [class^=icon-].warning {
            opacity: 1;
            color: #FD4B18;
            transform: translate(0, 0) scale(1.1); }
    .datacontainer .datatable.nolink td {
      cursor: default; }
    .datacontainer .datatable.fixedcol td {
      min-width: 110px;
      text-transform: none; }
      .datacontainer .datatable.fixedcol td .datecontainer {
        min-width: 235px; }
      .datacontainer .datatable.fixedcol td.min-width {
        min-width: 300px;
        white-space: normal; }
      .datacontainer .datatable.fixedcol td.min-width-short {
        min-width: 200px;
        white-space: normal; }
      .datacontainer .datatable.fixedcol td.preline {
        white-space: pre-line; }
    .datacontainer .datatable .datafont td {
      font-size: 13px; }
    .datacontainer .datatable.querybuilder td, .datacontainer .datatable.screening td, .datacontainer .datatable.ror td {
      text-transform: capitalize; }
      .datacontainer .datatable.querybuilder td:first-child, .datacontainer .datatable.screening td:first-child, .datacontainer .datatable.ror td:first-child {
        position: sticky;
        left: 0px;
        z-index: 98; }
      .datacontainer .datatable.querybuilder td.no-caps, .datacontainer .datatable.screening td.no-caps, .datacontainer .datatable.ror td.no-caps {
        text-transform: none; }
    .datacontainer .datatable.querybuilder .headerrow.top-row td:first-child, .datacontainer .datatable.screening .headerrow.top-row td:first-child, .datacontainer .datatable.ror .headerrow.top-row td:first-child {
      z-index: 99; }
  .datacontainer.generic {
    min-height: auto; }
    .datacontainer.generic .datatable {
      width: 99%; }
      .datacontainer.generic .datatable .sub-row td {
        position: relative;
        top: 0; }

.expandedtable {
  left: 0;
  width: 100%; }
  .expandedtable.full {
    position: absolute; }
    .expandedtable.full .datacontainer, .expandedtable.full .datadisplay {
      max-height: 1000px; }

table.basic {
  background: #FFFFFF;
  border: solid 1px #DDDDDD;
  margin: 15px;
  table-layout: auto; }
  table.basic.basic-center {
    margin: 15px auto;
    width: 98%; }
  table.basic tr th, table.basic tr td {
    font-size: 0.875rem;
    padding: 0.5625rem 0.625rem;
    text-align: left;
    border: 1px solid #ccc; }
    table.basic tr th.min-width, table.basic tr td.min-width {
      min-width: 100px;
      width: 200px; }
    table.basic tr th.max-width, table.basic tr td.max-width {
      min-width: 100px;
      width: 300px; }
  table.basic tr:nth-of-type(even) {
    background: #F9F9F9; }
  table.basic.sticky-col th:first-child,
  table.basic.sticky-col td:first-child {
    position: sticky;
    left: 0px;
    z-index: 98;
    background-color: #FFFFFF; }

.summarytable {
  font-size: 13px; }
  .summarytable .col19 {
    float: left;
    width: 19%;
    margin: 2px;
    padding: 5px 0;
    background-color: rgba(229, 192, 86, 0.2); }
    .summarytable .col19.no-bg {
      background-color: transparent; }
    .summarytable .col19.combined-total {
      height: 39px;
      position: relative;
      top: -33px;
      padding-top: 20px; }
  .summarytable .col24 {
    float: left;
    width: 24%;
    margin: 2px;
    padding: 5px 0;
    background-color: rgba(229, 192, 86, 0.2); }
  .summarytable .col49 {
    float: left;
    width: 49%;
    margin: 1px 1px 0 1px;
    padding: 6px 0; }
  .summarytable .col98 {
    float: left;
    width: 98%;
    margin: 0px 4px 8px 1px;
    padding: 5px 2px; }
    .summarytable .col98 span {
      display: block;
      padding: 5px 10px; }
  .summarytable .col100 {
    padding: 5px 0;
    background-color: rgba(229, 192, 86, 0.2); }
  .summarytable.bg-green .col24,
  .summarytable.bg-green .col49 {
    background-color: rgba(67, 158, 107, 0.2); }
  .summarytable.bg-blue col24,
  .summarytable.bg-blue .col49 {
    background-color: rgba(67, 90, 158, 0.2); }
  .summarytable .border {
    background-color: rgba(229, 192, 86, 0.2);
    border: 1px solid rgba(67, 92, 158, 0.3); }
  .summarytable .top-left-radius {
    border-top-left-radius: 6px; }
  .summarytable .top-right-radius {
    border-top-right-radius: 6px; }
  .summarytable .border-bottom {
    border-left: 1px solid rgba(67, 92, 158, 0.3);
    border-bottom: 1px solid rgba(67, 92, 158, 0.3);
    border-right: 1px solid rgba(67, 92, 158, 0.3); }
  .summarytable .bottom-radius {
    border-bottom-right-radius: 6px;
    border-bottom-left-radius: 6px; }

.accountdetails .account-attribute {
  float: left;
  width: 100%;
  padding: 10px;
  border-bottom: 1px solid #D9D8D9;
  border-radius: 6px; }
  .accountdetails .account-attribute .attribute-name {
    font-size: 22px;
    width: 100%; }
  .accountdetails .account-attribute .attribute-title {
    float: left;
    width: 25%;
    font-size: 14px; }
    .accountdetails .account-attribute .attribute-title.col3 {
      width: 33%; }
  .accountdetails .account-attribute .attribute-value {
    float: left;
    width: 75%;
    padding-left: 10px;
    box-sizing: border-box; }
    .accountdetails .account-attribute .attribute-value.col2 {
      width: 50%; }
    .accountdetails .account-attribute .attribute-value.col3 {
      width: 33%; }
    .accountdetails .account-attribute .attribute-value.col4 {
      width: 25%; }
    .accountdetails .account-attribute .attribute-value.col5 {
      width: 20%; }
    .accountdetails .account-attribute .attribute-value.col6 {
      width: 16%; }
    .accountdetails .account-attribute .attribute-value.col8 {
      width: 12%; }
    .accountdetails .account-attribute .attribute-value.col10 {
      width: 10%; }
    .accountdetails .account-attribute .attribute-value.col12 {
      width: 8%; }
    .accountdetails .account-attribute .attribute-value.link a {
      color: #666666; }
    .accountdetails .account-attribute .attribute-value.link:hover {
      color: #F7BE00;
      cursor: pointer; }
    .accountdetails .account-attribute .attribute-value.title-font-size {
      font-size: 14px; }
  .accountdetails .account-attribute.attribute-scroll {
    min-height: 300px;
    overflow-y: scroll; }
  .accountdetails .account-attribute.attribute-scroll-hr {
    overflow: scroll;
    display: -webkit-box; }
  .accountdetails .account-attribute.evencol .attribute-title {
    width: 50%; }
  .accountdetails .account-attribute.evencol .attribute-value {
    width: 50%; }
  .accountdetails .account-attribute.label {
    background-color: #f8f8f8;
    text-transform: uppercase;
    width: 100%; }
    .accountdetails .account-attribute.label .attribute-label, .accountdetails .account-attribute.label .attribute-title {
      width: 100%; }
    .accountdetails .account-attribute.label .small {
      margin-top: 0; }
    .accountdetails .account-attribute.label.control .attribute-label {
      float: left;
      width: 50%;
      margin-top: 5px; }
    .accountdetails .account-attribute.label.control .lower-case {
      text-transform: capitalize; }
    .accountdetails .account-attribute.label.error-message {
      text-transform: capitalize; }
  .accountdetails .account-attribute.sub-label {
    padding: 6px 10px;
    font-size: 14px; }
  .accountdetails .account-attribute.username {
    background-color: #f8f8f8;
    width: 100%;
    font-size: 22px; }
  .accountdetails .account-attribute.warning {
    background-color: #fff3d9; }
  .accountdetails .account-attribute.no-border {
    border-bottom: none; }
  .accountdetails .account-attribute.no-padding {
    padding: 0; }
  .accountdetails .account-attribute:last-child {
    border-bottom: none; }
  .accountdetails .account-attribute .option {
    margin: 0; }
  .accountdetails .account-attribute.multiple {
    padding: 8px 10px;
    font-size: 14px; }
    .accountdetails .account-attribute.multiple .attribute-value {
      padding-top: 5px;
      padding-bottom: 5px; }
    .accountdetails .account-attribute.multiple .more-attribute .attribute-value {
      border-top: 1px dotted #D9D8D9; }
  .accountdetails .account-attribute.multiple-rows {
    height: auto; }
  .accountdetails .account-attribute.fullwidth .attribute-title {
    display: none; }
  .accountdetails .account-attribute.fullwidth .attribute-value {
    width: 100%;
    padding-left: 0px; }
  .accountdetails .account-attribute.capitalize {
    text-transform: capitalize; }
  .accountdetails .account-attribute.no-bottom-border {
    border-bottom: none; }
  .accountdetails .account-attribute .wrapper-generic {
    padding: 3px 10px 0; }
  .accountdetails .account-attribute .miniright {
    float: left;
    margin: 9px 0 0 -20px; }
  .accountdetails .account-attribute .miniright-icon {
    float: right;
    margin: inherit; }

.accountdetails.caps .account-attribute .attribute-value {
  text-transform: uppercase; }

.accountdetails .associatedaccount {
  float: left;
  border-bottom: 1px solid #D9D8D9; }
  .accountdetails .associatedaccount:last-child {
    border-top: none; }

.accountdetails .primaryaccount, .accountdetails .associatedaccount {
  display: none; }

.accountdetails.animation .primaryaccount, .accountdetails.animation .associatedaccount {
  display: block;
  width: 100%; }

.statistics .statsnumber {
  float: left;
  padding-bottom: 20px; }

.statistics .statblock {
  float: left;
  width: 40%;
  min-height: 65px;
  margin: 15px 14px 0 0;
  padding: 10px 7px;
  box-shadow: 15px 0 15px 1px rgba(0, 0, 0, 0.2);
  text-align: center;
  border-radius: 6px; }
  .statistics .statblock .subblock {
    width: 100%; }
    .statistics .statblock .subblock.digit {
      font-size: 25px; }
    .statistics .statblock .subblock.label {
      text-transform: uppercase;
      font-size: 11px; }

.statistics .plotgraph.center-img {
  text-align: center; }

.statistics .plotgraph.plot1 img {
  width: 100%; }

.statistics .plotgraph.plot2 img {
  width: 50%; }

.statistics .plotgraph.plot3 img {
  width: 33%; }

.statistics .plotgraph.plot5 img {
  width: 20%; }

.statistics .plotgraph.zoomoption {
  float: left;
  padding-bottom: 30px;
  margin-top: 10px; }
  .statistics .plotgraph.zoomoption img {
    transition: transform .2s; }
    .statistics .plotgraph.zoomoption img:hover {
      transform: scale(2); }

.statistics .plotgraph.placeholder {
  display: flex;
  align-items: center;
  justify-content: center; }

/* Query Builder */
#query-builder {
  text-align: center;
  stroke-width: 2px;
  stroke: #646273;
  float: left;
  background: #fff url(/static/images/family-tree.png) no-repeat -5px 4px;
  background-size: 937px 446px; }
  #query-builder circle, #query-builder rect {
    cursor: pointer; }
    #query-builder circle.disabled, #query-builder rect.disabled {
      cursor: not-allowed; }

#symbolgroup {
  float: right;
  margin-right: 20px;
  margin-top: -10px; }
  #symbolgroup text {
    border: 1px solid orange;
    font-size: 14px;
    fill: #646273;
    stroke: none; }

.geneticdxscat text, .studiescat text, .surveycat text {
  font-size: 12px;
  background-color: #666;
  cursor: pointer; }
  .geneticdxscat text.dragged, .studiescat text.dragged, .surveycat text.dragged {
    fill: red; }

.relationorder {
  min-width: 35px;
  float: left; }

.popupmodal.querypopup {
  width: 60%;
  min-height: 650px;
  background-color: #F8F8F8;
  overflow: hidden; }
  .popupmodal.querypopup .checkbox span:before {
    border: 1px solid #C1C0C1;
    background-color: #FFFFFF; }
  .popupmodal.querypopup .radio span:before {
    border: 1px solid #C1C0C1; }
  .popupmodal.querypopup .notes-section .notes-block,
  .popupmodal.querypopup .notes-section textarea {
    font-size: 14px; }

.popupmodal.wide {
  width: 70%; }

.popupmodal .definitiontoolinfo {
  padding: 10px;
  position: absolute;
  top: 100px;
  width: 20%;
  background: white;
  border: 1px solid #D9D8D9;
  border-radius: 10px;
  font-size: 14px;
  z-index: 1; }

.queryselectorsection {
  max-height: 450px;
  width: 100%;
  overflow-y: overlay;
  overflow-x: hidden;
  float: left; }
  .queryselectorsection.medium-short {
    max-height: 400px; }
  .queryselectorsection.semi-short {
    max-height: 350px; }
  .queryselectorsection.short {
    max-height: 200px; }
  .queryselectorsection:hover::-webkit-scrollbar, .queryselectorsection.scrollbar-visible::-webkit-scrollbar {
    width: 8px;
    height: 10px; }
  .queryselectorsection:hover::-webkit-scrollbar-thumb, .queryselectorsection.scrollbar-visible::-webkit-scrollbar-thumb {
    background: #BDBDBC;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    border-radius: 5px; }

.queryblock {
  padding-right: 20px; }
  .queryblock ul li {
    float: left;
    width: 100%;
    padding: 3px 0;
    font-size: 14px; }
    .queryblock ul li button {
      display: none; }
    .queryblock ul li span {
      width: 80%;
      float: left; }
      .queryblock ul li span.autowidth {
        width: auto; }
      .queryblock ul li span.mediumright {
        font-size: 12px; }
    .queryblock ul li:hover {
      color: #F9A408; }
      .queryblock ul li:hover button {
        display: block; }
  .queryblock.selection input[type="checkbox"] {
    float: left;
    width: 20px; }
  .queryblock.selection input[type="range"] {
    float: left;
    width: 98%; }
  .queryblock.selection ul {
    float: left;
    width: 90%;
    padding: 0 0 20px 0; }
    .queryblock.selection ul li {
      padding: 1px;
      margin-left: 31px; }
      .queryblock.selection ul li:first-child {
        margin-left: 0px; }
      .queryblock.selection ul li.bottom-padding {
        padding-bottom: 5px; }
    .queryblock.selection ul.sub {
      width: 80%; }

.queryselector {
  float: left;
  width: 50%;
  padding: 10px 20px 0 0;
  box-sizing: border-box;
  min-height: 65px;
  margin: 0 0 5px 0; }
  .queryselector .field {
    float: left;
    font-size: 14px;
    margin-right: 10px;
    width: 50%;
    box-sizing: border-box;
    text-transform: capitalize; }
    .queryselector .field [class*=" icon-"],
    .queryselector .field [class^=icon-] {
      float: none;
      margin-left: 10px; }
    .queryselector .field .survey {
      font-size: 11px;
      color: #7A7979;
      width: 100%;
      float: left; }
  .queryselector .checkbox span:before {
    border: 1px solid #C1C0C1;
    background-color: #FFFFFF; }
  .queryselector .radio span:before {
    border: 1px solid #C1C0C1; }
  .queryselector input.fullwidth {
    width: 80%; }
  .queryselector .selector {
    float: left;
    width: auto; }
    .queryselector .selector input {
      min-width: 183px; }
      .queryselector .selector input.operator {
        min-width: 138px;
        width: 138px; }
    .queryselector .selector .custom-dd.small select {
      min-width: 190px;
      width: 190px; }
    .queryselector .selector .custom-dd.operator {
      margin-top: -3px;
      margin-left: 3px; }
  .queryselector.fullwidth {
    width: 100%; }
  .queryselector.compact {
    padding: 10px 10px 0 0;
    box-sizing: border-box;
    min-height: 35px; }
    .queryselector.compact .field {
      width: 90%;
      box-sizing: border-box; }
      .queryselector.compact .field .mini {
        margin-top: 0; }

.slider-section {
  position: absolute;
  right: 0;
  top: 70px;
  height: 80%;
  width: 20px;
  background: #F8F8F8;
  transition-property: all;
  transition-duration: 0.5s;
  transition-timing-function: cubic-bezier(0, 1, 0.5, 1); }
  .slider-section.expand {
    width: 50%;
    transition-property: all;
    transition-duration: 0.5s;
    transition-timing-function: cubic-bezier(0, 1, 0.5, 1); }
    .slider-section.expand.semi {
      width: 75%; }
  .slider-section .slider-title {
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    white-space: nowrap;
    display: block;
    bottom: 0;
    width: 20px;
    height: 10px;
    top: 0;
    position: relative; }
    .slider-section .slider-title.top {
      top: 5%; }
    .slider-section .slider-title.middle {
      top: 45%; }
  .slider-section .slider-content .notes-section {
    width: auto; }

.output-section [class*=" icon-"].miniright, .output-section [class^=icon-].miniright {
  font-size: 14px;
  float: right;
  margin: 5px 3px 0 0; }

.output-section .compact .checkbox span:before {
  margin: 0px 7px 0 0; }

pre {
  padding: 0 0 20px 0;
  font-size: 12px;
  float: left; }

p.code {
  padding: 0 0 20px 0;
  font-size: 12px;
  float: left;
  word-break: break-all; }

#id-tidytree svg {
  transition: transform .2s; }
  #id-tidytree svg:hover {
    background: #fff;
    float: left;
    transform: translate(-200px, 10px) scale(1.5); }

.query-option-selector {
  margin: -100px 31px 0 0;
  float: right; }

/* TODO - Needed in query modifier */
.templink {
  fill: none;
  stroke: red;
  stroke-width: 3px; }

@media (max-width: 1260px) {
  ul.columns li {
    width: 33%; }
  .customization-bar.block {
    width: 46%; }
  .primaryaccount .border-left, .associatedaccount .border-left {
    border-left: none; }
  .statistics .col30, .statistics .col40, .statistics .col50, .statistics .col60, .statistics .col70 {
    width: 100%; }
  .statistics .statblock {
    width: 16%; }
  .navwrapper .nav-bar ul {
    text-align: left; }
    .navwrapper .nav-bar ul li {
      padding: 20px 0px;
      margin: 0; }
      .navwrapper .nav-bar ul li:first-child {
        margin-left: 250px; }
  .navwrapper .nav-bar .portal-nav {
    text-align: right; }
    .navwrapper .nav-bar .portal-nav li {
      width: 186px; }
      .navwrapper .nav-bar .portal-nav li:first-child {
        margin-left: 0px; }
  .navwrapper .nav-bar .container {
    width: 215px; }
  .queryselector {
    width: 100%; } }

@media (max-width: 1080px) {
  .headerwrapper {
    max-width: 100%;
    min-height: 70px; }
    .headerwrapper .site-logo {
      width: 40%; }
      .headerwrapper .site-logo img {
        width: 60%;
        height: auto;
        padding-left: 30px; }
    .headerwrapper .user-menu {
      margin-right: 30px; }
  ul.columns li {
    width: 50%; }
  ul.columns-right li {
    width: 100%; }
  .customization-bar .option.right span:first-child {
    display: none; } }

@media (max-width: 767px) {
  .button {
    margin-bottom: 30px; }
  .status-box {
    margin: 30px 0; }
  .question-title .error-message {
    display: block;
    margin-left: 0; }
  .section:last-child {
    padding-bottom: 30px; }
  .mobile-border-bottom {
    float: left;
    width: 100%;
    border-bottom: 1px solid #D9D8D9;
    margin-top: 30px; }
  .headerwrapper .site-logo {
    width: 45%;
    height: 65px; }
    .headerwrapper .site-logo img {
      width: 70%;
      height: auto; }
  .headerwrapper ul.settings-menu-list li a {
    background-position: 10px center; }
    .headerwrapper ul.settings-menu-list li a span {
      margin-left: 25px; }
  .headerwrapper .user-menu {
    display: none; }
  .headerwrapper .mobile-nav {
    display: block; }
    .headerwrapper .mobile-nav .menu-btn {
      float: right;
      margin-top: 30px;
      margin-right: 30px;
      cursor: pointer; }
      .headerwrapper .mobile-nav .menu-btn div.title {
        float: right;
        color: #423E3F;
        margin-top: -6px;
        text-transform: uppercase; }
      .headerwrapper .mobile-nav .menu-btn div.icon {
        float: right;
        width: 14px;
        margin-left: 10px; }
      .headerwrapper .mobile-nav .menu-btn .icon span {
        display: block;
        position: relative;
        width: 14px;
        height: 2px;
        margin: 6px 0 0 0;
        background: #423E3F;
        z-index: 99;
        color: #423E3F; }
        .headerwrapper .mobile-nav .menu-btn .icon span:before, .headerwrapper .mobile-nav .menu-btn .icon span:after {
          display: block;
          width: 14px;
          height: 2px;
          margin: 0;
          background: #423E3F;
          z-index: 99;
          color: #423E3F;
          content: '';
          position: absolute; }
        .headerwrapper .mobile-nav .menu-btn .icon span:before {
          top: -4px; }
        .headerwrapper .mobile-nav .menu-btn .icon span:after {
          bottom: -4px; }
    .headerwrapper .mobile-nav .menu-btn.open .icon span {
      background: none; }
      .headerwrapper .mobile-nav .menu-btn.open .icon span:before {
        top: 0;
        transform: rotate(45deg); }
      .headerwrapper .mobile-nav .menu-btn.open .icon span:after {
        top: 0;
        transform: rotate(-45deg); }
  .headerwrapper .responsive-menu {
    display: none;
    position: relative;
    background-color: #7A7979;
    margin-bottom: 20px; }
    .headerwrapper .responsive-menu.active {
      display: block; }
    .headerwrapper .responsive-menu a {
      display: block;
      color: #FFFFFF;
      font-size: 18px;
      font-weight: 100;
      padding: 4px 0; }
      .headerwrapper .responsive-menu a:hover {
        color: #D9D8D9; }
    .headerwrapper .responsive-menu .responsive-menu-main-nav {
      background-color: #888888;
      padding: 20px; }
      .headerwrapper .responsive-menu .responsive-menu-main-nav ul {
        border-top: 1px solid #6D6C6C;
        border-bottom: 1px solid #A0A0A0; }
        .headerwrapper .responsive-menu .responsive-menu-main-nav ul li {
          border-bottom: 1px solid #6D6C6C;
          border-top: 1px solid #A0A0A0;
          padding: 0; }
          .headerwrapper .responsive-menu .responsive-menu-main-nav ul li.active a {
            color: #F9A408; }
    .headerwrapper .responsive-menu .responsive-menu-logged-in {
      padding: 20px; }
    .headerwrapper .responsive-menu .responsive-menu-user-profile,
    .headerwrapper .responsive-menu .responsive-menu-community-profile {
      float: right;
      margin-top: 15px;
      font-size: 16px;
      font-weight: 100; }
    .headerwrapper .responsive-menu:after {
      content: "";
      position: absolute;
      bottom: -14px;
      right: 3.25rem;
      width: 0;
      height: 0;
      border-style: solid;
      border-width: 14px 13px 0;
      border-color: #7a7979 transparent transparent; }
  .navwrapper .nav-bar .primary-nav li {
    display: none;
    margin: 0;
    text-align: left; }
  .navwrapper .nav-bar .primary-nav li.active {
    display: block;
    background-color: #F7BE00;
    margin-left: 260px; }
  .option {
    margin: 10px 0 0 0; }
    .option button.filter-buttons {
      padding: 3px 15px;
      margin-bottom: 5px; }
  .customization-bar.block {
    width: 97%; }
    .customization-bar.block .option-max {
      min-height: auto; }
  .customization-bar.apply-buttons .option {
    width: 100%;
    float: left; }
    .customization-bar.apply-buttons .option .button {
      width: 100%; }
  .primaryaccount .wrapper-wide, .associatedaccount .wrapper-wide {
    padding: 0; }
  .datatable tr td {
    position: static !important; }
  .datatable.screening tr td {
    position: relative !important; }
  .statistics .statblock {
    width: 40%; }
  .accountdetails .account-attribute {
    box-sizing: border-box; }
  .notes-section {
    box-sizing: border-box;
    width: 100%; } }

@media (max-width: 600px) {
  .wrapper-wide {
    padding: 0 20px; }
  .headerwrapper .site-logo {
    position: relative; }
    .headerwrapper .site-logo img {
      width: 100%;
      padding-left: 15px;
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      margin: auto; }
  .navwrapper {
    margin: 0; }
  ul.columns li {
    width: 100%; }
  .option {
    font-size: 18px; }
    .option button.filter-buttons {
      padding: 3px 8px; }
    .option:last-child {
      margin-right: 0px; }
  .customization-bar.filter .option {
    margin-right: 10px; }
  .customization-bar.pageoption .custom-dd {
    margin-right: 10px; }
  .lightbox {
    width: 75%; }
  select.smallfont {
    font-size: 14px; } }