/*=============================
         HTML reset
  =============================*/
.no-float {float: none !important;}
body, div, dl, dt, dd, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td { margin: 0; padding: 0 }
fieldset, img { border: 0 none }
address, caption, cite, code, dfn, th, var { font-style: normal; font-weight: normal }
caption, th { text-align: left }
q:before, q:after { content:"" }
abbr, acronym { border:0 }
body { font: 12px Myriad,Helvetica,Tahoma,Arial,clean,sans-serif; *font-size: 75% }
h1 {
   font-size: 1.5em;
   font-weight: normal;
   line-height: 1em;
/*   margin-top: 1em;
*/   margin-bottom:1em;
}
h2 {
   font-size: 1.1667em;
   font-weight: normal;
   line-height: 1.286em;
   margin-top: 1.929em;
   margin-bottom:0.643em;
}
h3, h4, h5, h6 {
   font-size: 1em;
   font-weight: normal;
   line-height: 1.5em;
   margin-top: 1.5em;
   margin-bottom: 0
}
p {
   font-size: 1em;
   margin-top: 1.5em;
   margin-bottom: 1.5em;
   line-height: 1.5em
}
blockquote {
   font-size: 0.916em;
   margin-top: 3.272em;
   margin-bottom: 3.272em;
   line-height: 1.636em;
   padding: 1.636em;
   border-top: 1px solid #ccc;
   border-bottom: 1px solid #ccc
}
ol li, ul li {
   font-size: 1em;
   line-height: 1.5em;
   margin: 0;
}
pre, code {
   font-size:115%;
   *font-size:100%;
   font-family: Courier, "Courier New";
   background-color: #efefef;
   border: 1px solid #ccc
}
pre { border-width: 1px 0; padding: 1.5em }
table {  font-size:100% }

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

/*=============================
         HTML5 reset
  =============================*/
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }

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

/*=============================
         Font Family
  =============================*/
@font-face {
   font-family: 'MyriadProSemibold';
   src:  url('/assets/fonts/myriad-pro/MyriadPro-Semibold.eot');
   src:  url('/assets/fonts/myriad-pro/MyriadPro-Semibold.eot?#iefix') format('embedded-opentype'),
         /* url('/assets/fonts/myriad-pro/MyriadPro-Semibold.woff') format('woff'), */
         url('/assets/fonts/myriad-pro/MyriadPro-Semibold.ttf') format('truetype'),
         url('/assets/fonts/myriad-pro/MyriadPro-Semibold.svg#MyriadProSemibold') format('svg');
   font-weight: normal;
   font-style: normal;
}
@font-face {
   font-family: 'MyriadProBold';
   src:  url('/assets/fonts/myriad-pro/MyriadPro-Bold.eot');
   src:  url('/assets/fonts/myriad-pro/MyriadPro-Bold.eot?#iefix') format('embedded-opentype'),
         /* url('/assets/fonts/myriad-pro/MyriadPro-Bold.woff') format('woff'), */
         url('/assets/fonts/myriad-pro/MyriadPro-Bold.ttf') format('truetype'),
         url('/assets/fonts/myriad-pro/MyriadPro-Bold.svg#MyriadProBold') format('svg');
   font-weight: normal;
   font-style: normal;
}
@font-face {
   font-family: 'MyriadProRegular';
   src:  url('/assets/fonts/myriad-pro/MyriadPro-Regular.eot');
   src:  url('/assets/fonts/myriad-pro/MyriadPro-Regular.eot?#iefix') format('embedded-opentype'),
         /* url('/assets/fonts/myriad-pro/MyriadPro-Regular.woff') format('woff'), */
         url('/assets/fonts/myriad-pro/MyriadPro-Regular.ttf') format('truetype'),
         url('/assets/fonts/myriad-pro/MyriadPro-Regular.svg#MyriadProRegular') format('svg');
   font-weight: normal;
   font-style: normal;
}

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

/*=============================
            Body
  =============================*/
body {
   font-family: "MyriadProRegular", "Helvetica", "Arial";
   /*width: 1024px;*/
   margin: 0 auto;
   background: var(--body);
   min-height: 100vh;
}

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

/*=============================
            Content
  =============================*/
img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle }
p.add_desc { margin:10px 0 8px 0; }
.form_p { color:#717171; margin: 1px 0 5px 0; font-style:italic; float: left;}

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

/*=============================
            Forms
  =============================*/
label:focus,
div:focus,
button:focus,
input:focus,
select:focus,
textarea:focus,
a:focus,
th:focus,
li:focus,
span:focus,
td:focus,
.icon.edit:focus,
.icon.remove:focus,
.icon.add:focus,
table:focus,
.dataTables_scrollBody:focus{
    outline: 3px solid #903809;
}

.fancy-dropdown-menu li:focus {
    outline: none !important;
    border: 3px solid #903809;
}

label, input, select, button { cursor: pointer }
input[disabled], button[disabled] { cursor: default }
.form_des {
    font-size: 14px;
    font-style: italic;
    color: #73767a;
    font-family: "MyriadProRegular", "Helvetica", "Arial"
}
.required { color: #CD291F }
/*====================================================================*/
/*====================================================================*/

/*=============================
            Lists
  =============================*/
ul, ol, dl {
    list-style: none;
    padding: 0;
    margin: 0
}
/*====================================================================*/
/*====================================================================*/

/*=============================
            Rows
  =============================*/
.even { background-color: #f3f6fa }
.odd { background-color: #fff }

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

/*=============================
         CSS3 Settings
  =============================*/
.csstransforms a {
    -webkit-transition-property: background, color;
      -moz-transition-property: background, color;
       -ms-transition-property: background, color;
        -o-transition-property: background, color;
           transition-property: background, color;
    -webkit-transition-duration: 0.3s;
      -moz-transition-duration: 0.3s;
       -ms-transition-duration: 0.3s;
        -o-transition-duration: 0.3s;
           transition-duration: 0.3s;
    -webkit-transition-timing-function: ease-out;
      -moz-transition-timing-function: ease-out;
       -ms-transition-timing-function: ease-out;
        -o-transition-timing-function: ease-out;
           transition-timing-function: ease-out
}
.csstransforms a:hover {
    -webkit-transition-property: background, color;
      -moz-transition-property: background, color;
       -ms-transition-property: background, color;
        -o-transition-property: background, color;
           transition-property: background, color;
    -webkit-transition-duration: 0.3s;
      -moz-transition-duration: 0.3s;
       -ms-transition-duration: 0.3s;
        -o-transition-duration: 0.3s;
           transition-duration: 0.3s;
    -webkit-transition-timing-function: ease-out;
      -moz-transition-timing-function: ease-out;
       -ms-transition-timing-function: ease-out;
        -o-transition-timing-function: ease-out;
           transition-timing-function: ease-out
}
.csstransforms input[type="submit"] {
    -webkit-transition: background 0.3s ease-out;
      -moz-transition: background 0.3s ease-out;
       -ms-transition: background 0.3s ease-out;
        -o-transition: background 0.3s ease-out;
           transition: background 0.3s ease-out
}
.csstransforms input[type="submit"]:hover {
    -webkit-transition: background 0.3s ease-out;
      -moz-transition: background 0.3s ease-out;
       -ms-transition: background 0.3s ease-out;
        -o-transition: background 0.3s ease-out;
           transition: background 0.3s ease-out
}
.csstransforms button {
    -webkit-transition-property: background, color;
      -moz-transition-property: background, color;
       -ms-transition-property: background, color;
        -o-transition-property: background, color;
           transition-property: background, color;
    -webkit-transition-duration: 0.3s;
      -moz-transition-duration: 0.3s;
       -ms-transition-duration: 0.3s;
        -o-transition-duration: 0.3s;
           transition-duration: 0.3s;
    -webkit-transition-timing-function: ease-out;
      -moz-transition-timing-function: ease-out;
       -ms-transition-timing-function: ease-out;
        -o-transition-timing-function: ease-out;
           transition-timing-function: ease-out
}
.csstransforms button:hover {
    -webkit-transition-property: background, color;
      -moz-transition-property: background, color;
       -ms-transition-property: background, color;
        -o-transition-property: background, color;
           transition-property: background, color;
    -webkit-transition-duration: 0.3s;
      -moz-transition-duration: 0.3s;
       -ms-transition-duration: 0.3s;
        -o-transition-duration: 0.3s;
           transition-duration: 0.3s;
    -webkit-transition-timing-function: ease-out;
      -moz-transition-timing-function: ease-out;
       -ms-transition-timing-function: ease-out;
        -o-transition-timing-function: ease-out;
           transition-timing-function: ease-out
}

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

/*=============================
            Header
  =============================*/

  .user-nav {
      display:none;
      position: absolute;
      top:80px;
      width: 1px;
      height: 1px;
      padding: 0;
      margin: -1px;
      overflow: hidden;
      clip: rect(0,0,0,0);
      border: 0;
  }

  .user-nav.active {
    width: 100%;
    height: auto;
    display:block;
    margin: 0px;
    clip: initial;
    z-index: 300;
    -webkit-box-shadow: 0px 3px 9px 0px rgba(0,0,0,0.17);
    -moz-box-shadow: 0px 3px 9px 0px rgba(0,0,0,0.17);
    box-shadow: 0px 3px 9px 0px rgba(0,0,0,0.17);
  }

  .user_nav_wrap.active{
    z-index: 500;
    display:block;
  }

  .toggle-group {
    position: absolute;
    top: 20px;
    right: 15px;
  }
  .user-toggle {
    border: none;
    height: 36px;
    width: 36px;
    margin-right:5px;
    background-size: 20px;
    background-position: center;
  }

  .hamburger-toggle {
    border: none;
    height: 36px;
    width: 36px;
    background-size: 20px;
    background-position: center;
  }
  .user-toggle.white {
    background: url(/assets/images/user-solid.svg) no-repeat;
  }
  .hamburger-toggle.white {
    background: url(/assets/images/bars-solid.svg) no-repeat;
  }
  .user-toggle.black {
    background: url(/assets/images/user-solid-black.svg) no-repeat;
  }
  .hamburger-toggle.black {
    background: url(/assets/images/bars-solid-black.svg) no-repeat;
  }
  .desktop-menu {
      display: none;
  }

/* Tablet size */
@media only screen and (min-width: 576px){
  header {
      height: 140px;
      width: 100%;
      background: var(--headerBG);
      margin: 0 auto;
      position: relative;
  }

  .user-nav.active {
    width: 100%;
    height: auto;
    margin: 0px;
    clip: initial;
  }

  .toggle-group {
    position: absolute;
    /* top: 40px; */
    right: 25px;
  }
  .user-toggle {
    border: none;
    height: 50px;
    width: 50px;
    margin-right:25px;
    background-size: 36px;
    background-position: center;
  }

  .hamburger-toggle {
    border: none;
    height: 50px;
    width: 50px;
    background-size: 36px;
    background-position: center;

  }

  .desktop-menu {
      display: none;
  }
}

@media only screen and (min-width: 1024px){
  header {
      height: auto;
      min-height: 140px;
      width: 100%;
      background: var(--headerBG);
      margin: 0 auto;
      position: relative;
  }

  #banner_wrap {
    min-height: 140px;
  }

  #container {
    padding-top: 40px;
  }

  .user_nav {
    margin: 0;
  }

  .user_nav_wrap {
    display: none;
    clear: both;
    background: var(--menuBG);
    padding-top: 25px;
    height: 44px;
    padding-top: 10px;

  }

  .user-nav.active {
    width: 100%;
    height: auto;
    margin: 0px;
    clip: initial;
  }

  .logo {
      margin: var(--logo-margin);
      float: left;
      display: inline;
      max-width: 450px;
      max-height: 130px;
  }

  .toggle-group {
    position: absolute;
    top: 40px;
    right: 25px;
  }
  .user-toggle {
    background: url(/assets/images/user-solid.svg) no-repeat;
    border: none;
    height: 50px;
    width: 50px;
    margin-right:25px;
    background-size: 36px;
    background-position: center;
  }

  .hamburger-toggle {
    background: url(/assets/images/bars-solid.svg) no-repeat;
    border: none;
    height: 50px;
    width: 50px;
    background-size: 36px;
    background-position: center;

  }

  .desktop-menu {
      display: inline;
  }

  .mobile-menu {
    display: none;
  }

}

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

/*=============================
           Global Nav
  =============================*/

.global_nav { width: 100%;}
.custom_header_fields { float: right; clear: both; margin: -10px 32px 0 0 }

.global_nav ul, .custom_header_fields ul {
    background: #fff;
    width: 100%;
}
.global_nav ul li, .custom_header_fields ul li {
    color: #000;
    font-size: 18px;
    border-bottom: 1px dotted #ededed;
    margin-left: 10px;
    padding: 15px 0px;
}

.global_nav ul li:last-child, .custom_header_fields ul li:last-child {
  border-bottom: 0px;
}
.global_nav ul li p, .custom_header_fields ul li p { margin: 0 }
.global_nav ul li a span.user_name { font-family: "MyriadProSemiBold", "Helvetica", "Arial" }
.global_nav ul li a , .global_nav #clock {
    color: var(--sectionTitle);
    text-decoration: none;
    display: inline-block;
}
.global_nav ul li a.options { color: var(--sectionTitle); text-decoration: none }
.global_nav ul li a:hover { text-decoration: underline }

@media only screen and (min-width: 576px){
  .global_nav { width: 100%;}
  .custom_header_fields { float: right; clear: both; margin: -10px 32px 0 0 }

  .global_nav ul, .custom_header_fields ul {
      background: #fff;
      width: 100%;
  }
  .global_nav ul li, .custom_header_fields ul li {
      color: #000;
      font-size: 24px;
      border-bottom: 1px dotted #ededed;
      margin-left: 25px;
      padding: 15px 0px;
  }

  .global_nav ul li:last-child, .custom_header_fields ul li:last-child {
    border-bottom: 0px;
  }
  .global_nav ul li p, .custom_header_fields ul li p { margin: 0 }
  .global_nav ul li a span.user_name { font-family: "MyriadProSemiBold", "Helvetica", "Arial" }
  .global_nav ul li a , .global_nav #clock {
      color: var(--sectionTitle);
      text-decoration: none;
      display: inline-block;
  }
  .global_nav ul li a.options { color: var(--sectionTitle); text-decoration: none }
  .global_nav ul li a:hover { text-decoration: underline }

}

@media only screen and (min-width: 1024px){
  .global_nav { float: right; margin: 10px 32px 0 0; width: auto;}
  .custom_header_fields { float: right; clear: both; margin: -10px 32px 0 0 }

  .global_nav ul, .custom_header_fields ul {
      height: 20px;
      background: #fff;
      width: auto;
      padding: 6px 5px 2px;
  }
  .global_nav ul li, .custom_header_fields ul li {
      float: left;
      display: inline;
      margin-left: 3px;
      color: #000;
      font-size: 14px;
      padding: 0px 2px;
  }

  .global_nav ul li:last-child, .custom_header_fields ul li:last-child {
    border-bottom: none;
  }
  .global_nav ul li p, .custom_header_fields ul li p { margin: 0 }
  .global_nav ul li a span.user_name { font-family: "MyriadProSemiBold", "Helvetica", "Arial" }
  .global_nav ul li a , .global_nav #clock {
      color: var(--sectionTitle);
      text-decoration: none;
      display: inline-block;
  }
  .global_nav ul li a.options { color: var(--sectionTitle); text-decoration: none }
  .global_nav ul li a:hover { text-decoration: underline }

}



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

/*=============================
           User Nav
  =============================*/

.main-menu {
    background: white;
    float: left;
    overflow: hidden;
    position: absolute;
    top:80px;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    clip: rect(0,0,0,0);
    display: none;
    border: 0;
    -webkit-box-shadow: 0px 3px 9px 0px rgba(0,0,0,0.17);
    -moz-box-shadow: 0px 3px 9px 0px rgba(0,0,0,0.17);
    box-shadow: 0px 3px 9px 0px rgba(0,0,0,0.17);
}

.main-menu.active {
  width: 100%;
  height: auto;
  margin: 0px;
  clip: initial;
  display: block;
}


.user_nav { width: 100%; }
.user_nav ul {
    margin: 0;
    padding: 0
}
.user_nav ul li {
  width: 100%;
  padding: 15px 0px;
  border-bottom: 1px dotted #ededed;
  color: #000;
  font-size: 14px
}
.user_nav ul li:last-child { border-bottom: 0px; }
.user_nav ul li a {
    margin-left: 10px;
    padding: 15px 0px;
    color: var(--sectionTitle);
    text-decoration: none;
    font-size: 18px;
    font-family: "MyriadProRegular", "Helvetica", "Arial"
}

.user_nav_help_drop {
    background-color:#fff;
    position: absolute;
    z-index: 500;
    width: 165px;
    height:auto !important;
    top: 100%;
    right: 0;
    padding:5px 10px 0 10px !important;
    border: 1px solid #ccc;
    display:none;
}
.user_nav_help_drop li {float: left; border-bottom:1px solid #ccc; }
.user_nav_help_drop li:last-child { float:left !important; border-bottom:none;}
.user_nav_help_drop li a {
    display:block !important;
    background-color:#fff !important;
    font-family:"MyriadProSemibold","Helvetica","Arial" !important;
    padding:15px 0 8px 15px !important;
    width:150px !important;
    margin:0 !important;
    text-align: left !important;
    color:#464646 !important;
}
.user_nav_help_drop li a:hover {color:var(--primary) !important;}
.user_nav_help { position:relative; }
.user_nav_help:hover .user_nav_help_drop { display:block; }

@media only screen and (min-width: 576px){

  .main-menu {
    background: #e7e7e8;
    float: left;
    overflow: hidden;
    position: absolute;
    top:125px;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    clip: rect(0,0,0,0);
    border: 0;
    display: none;
  }

  .main-menu.active {
    width: 100%;
    height: auto;
    margin: 0px;
    clip: initial;
    display: block;
  }


  .user_nav { width: 100%; }
  .user_nav ul {
    margin: 0;
    padding: 0
  }
  .user_nav ul li {
    width: 100%;
    padding: 15px 0px;
    border-bottom: 1px dotted #ededed;
    color: #000;
    font-size: 24px
  }
  .user_nav ul li:last-child { border-bottom: 0px; }
  .user_nav ul li a {
      margin-left: 25px;
      padding: 15px 0px;
      color: #000;
      text-decoration: none;
      font-size: 24px;
      font-family: "MyriadProSemiBold", "Helvetica", "Arial"
  }

  .user_nav_help_drop {
      background-color:#fff;
      position: absolute;
      z-index: 500;
      width: 165px;
      height:auto !important;
      top: 100%;
      right: 0;
      padding:5px 10px 0 10px !important;
      border: 1px solid #ccc;
      display:none;
  }
  .user_nav_help_drop li {float: left; border-bottom:1px solid #ccc; }
  .user_nav_help_drop li:last-child { float:left !important; border-bottom:none;}
  .user_nav_help_drop li a {
      display:block !important;
      background-color:#fff !important;
      font-family:"MyriadProSemibold","Helvetica","Arial" !important;
      padding:15px 0 8px 15px !important;
      width:150px !important;
      margin:0 !important;
      text-align: left !important;
      color:#464646 !important;
  }
  .user_nav_help_drop li a:hover {color:var(--primary) !important;}
  .user_nav_help { position:relative; }
  .user_nav_help:hover #user_nav_help_drop { display:block; }
}

@media only screen and (min-width: 1024px){
 #user_nav_wrap {
        width: 1024px;
        background: var(--menuBG);
        height: 44px;
        padding-top: 10px;
        float: left
    }
    .user_nav_wrap {display: block;}
    #user_nav { width: 960px; margin: 0 auto }
    #user_nav ul {
        margin: 0;
        height: 34px;
        padding: 0;
    }
    #user_nav ul li {
        float: left;
        display: inline;
    }
    #user_nav ul li:last-child { float: right }
    #user_nav ul li a {
        width: 128px;
        height: 25px;
        display: inline-block;
        color: var(--sFont);
        text-decoration: none;
        text-transform: uppercase;
        text-align: center;
        padding-top: 9px;
        margin-left: 5px;
        font-size: 14px;
        font-family: "MyriadProBold", "Helvetica", "Arial";
    }
    #user_nav ul li:first-child a { margin-left: 0 }
    #user_nav ul li:last-child a { width: 63px }
    .csstransforms #user_nav ul li a { background: var(--secondary); color: var(--sFont);}
    .csstransforms #user_nav ul li a:hover {
      background: var(--menuActive);
      color: var(--menuActiveFont);
    }
    .no-csstransforms #user_nav ul li a {
      background: var(--secondary);
      color: var(--sFont);
    }
    .no-csstransforms #user_nav ul li a:hover {
      background: var(--menuActive);
      color: var(--menuActiveFont);
    }
    #user_nav ul li a.current {
      background: var(--menuActive);
      color: var(--menuActiveFont);
    }
    #user_nav_help_drop {
        background-color:#fff;
        position: absolute;
        z-index: 500;
        width: 165px;
        height:auto !important;
        top: 100%;
        right: 0;
        padding:5px 10px 0 10px !important;
        border: 1px solid #ccc;
        display:none;
    }
    #user_nav_help_drop li {float: left; border-bottom:1px solid #ccc; }
    #user_nav_help_drop li:last-child { float:left !important; border-bottom:none;}
    #user_nav_help_drop li a {
        display:block !important;
        background-color:#fff !important;
        font-family:"MyriadProSemibold","Helvetica","Arial" !important;
        padding:15px 0 8px 15px !important;
        width:150px !important;
        margin:0 !important;
        text-align: left !important;
        color:var(--secondary) !important;
    }
    #user_nav_help_drop li a:hover {color:var(--primary) !important;}
    #user_nav_help { position:relative; }
    #user_nav_help:hover #user_nav_help_drop { display:block; }

}

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

/*=============================
            Section
  =============================*/
#section_wrap {
    width: 100%;
    background: #fff;
    float: left;
    padding-bottom: 50px;
    padding-top:50px;
}
section[role="main"] {
    width: 960px;
    margin: 0 auto;
    position: relative;
}
#reports section[role="main"],
#people section[role="main"],
#account section[role="main"],
#accounts section[role="main"],
#systems section[role="main"],
#tags section[role="main"],
#peoplesearch section[role="main"],
#demographics section[role="main"],
#departments section[role="main"],
#accountgroups section[role="main"],
#identifications section[role="main"],
#labels section[role="main"],
#roles section[role="main"],
#rules section[role="main"],
#institution section[role="main"],
#tenders section[role="main"],
#updates section[role="main"],
#themes section[role="main"],
#datatools section[role="main"],
#datatools3 section[role="main"],
#connections section[role="main"],
#schedules section[role="main"],
#translator section[role="main"],
#places section[role="main"],
#settings section[role="main"],
#mealperiods section[role="main"],
#help section[role="main"],
#webreader section[role="main"],
#preferences section[role="main"],
#global_preferences section[role="main"],
#casprefs section[role="main"],
#discounts section[role="main"],
#peoplegroups section[role="main"],
#person section[role="main"],
#activities section[role="main"],
#eligibility_pools section[role="main"],
#activity section[role="main"],
#cronjobs section[role="main"]
#pax_templates section[role="main"],
#activity section[role="main"]
{ padding-top: 40px; }

@media only screen and (min-width: 1024px){

}

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

/*=============================
            Inputs
  =============================*/
input[type="text"],
input[type="password"],
input[type="number"],
input[type="search"],
input[type="email"] {
    padding: 5px 10px;
    border: 1px solid #b6b6b3;
    color: #464646;
    margin: 10px 0;
    /* next 2 lines added by Joe May 19, 2020 to fix something
      that then negatively affects multiple other pages */
    clear: both;
    float: left;
}

input[id="template_filter"] {
  background: url(/assets/images/system.png) no-repeat scroll 138px -1373px transparent;
}

.meal input[type="text"]
{
  margin-left: 40px;
}
input[type="submit"] {
    color: #fff;
    padding:7px 12px 4px;
    border: none;
    font-family: "MyriadProBold", "Helvetica", "Arial";
}
input[type="email"] { width: 200px; }

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

/*=============================
            Sidebar
  =============================*/

.section-menu-wrap {
  width: 100%;
}
#sidebar_wrap {
    width: 100%;
    float: left;
    margin: 0 20px 0 0;
    display: inline;
    overflow: hidden;
    position: relative;
    left: 7px;
}

/*#sidebar {*/
/*    background-color: #e7e7e8;
    width:100%;
    margin: 0 20px 22px 0
}*/
#sidebar ul { margin: 0; padding: 0 }
#sidebar ul li {
    background-color: #e7e7e8;
    line-height: 1em;
    text-transform: uppercase;
    list-style: none;
    border-bottom: 1px solid #ccc
}
#sidebar ul li:last-child { border-bottom: 0 }

#sidebar ul li a {
    background-color: #e7e7e8;
    color: #464646;
    line-height: 1em;
    text-transform: uppercase;
    list-style: none;
    border-bottom: 1px solid #ccc;
    border: none;
    display: block;
    padding: 16px 0 13px 20px;
    text-decoration: none;
    font-family: "MyriadProSemibold", "Helvetica", "Arial";
    font-size: 14px;
    width: 100%;
    text-align: left;
}

.section-menu {
  position: relative;
  float: right;
  background: none;
  color: var(--sectionTitle);
  border: 1px solid var(--sectionTitle);
  padding: 5px;
  margin: 10px;
  z-index: 2;
  width: 50px;
  height: 30px;

}

#sidebar, .mobile_sidebar {
    /* background: #e7e7e8; */
    margin: 0 20px 22px 0;
    float: left;
    overflow: hidden;
    position: absolute;
    top:129px;
    width: 1px;
    height: 0px;
    padding: 0;
    margin: -1px;
    clip: rect(0,0,0,0);
    border: 0;
    z-index: 1;
}

#sidebar.active, .mobile_sidebar.active {
  width: 100%;
  height: 100%;
  margin: 0px;
  clip: initial;
  overflow: visible;
  position: static;
}

.menu_button {
    background-color: #e7e7e8;
    color: #464646;
    line-height: 1em;
    text-transform: uppercase;
    list-style: none;
    border-bottom: 1px solid #ccc;
    border: none;
    display: block;
    padding: 16px 0 13px 20px;
    text-decoration: none;
    font-family: "MyriadProSemibold", "Helvetica", "Arial";
    font-size: 14px;
    width: 100%;
    text-align: left;
}

.menu_button[aria-expanded="true"] {
  background-image: url(/assets/images/chevron-circle-up-solid.svg);
  background-size: 15px;
}

.menu_button[aria-expanded="false"] {
  background-image: url(/assets/images/chevron-circle-down-solid.svg);
  background-size: 15px;
}

.menu_button.show {
  background-repeat: no-repeat;
  -webkit-transition-property: none;
  -moz-transition-property: none;
  -ms-transition-property: none;
  -o-transition-property: none;
  transition-property: none;
  background-position: 95%;
  background-size: 15px;
  /*background-position: 335px -1057px;*/


}

#sidebar_wrap.active-menu {
  background: #e7e7e8;
}

.close-menu {
  border: none;
  background: url(/assets/images/times-circle-regular.svg) no-repeat;
  background-position-x: center;
  transition-duration: unset !important;
}

/* Desktop Size */
@media (min-width: 992px){
	#sidebar_wrap {
		width: 166px;
	}

	#sidebar,.mobile_sidebar {
	/* 	background: #e7e7e8; */
		margin: 0 20px 22px 0;
		float: left;
		overflow: hidden;
		position: relative;
		top:0px;
		width: 166px;
		height: auto;
		padding: 0;
		margin: -1px;
		clip: auto;
		border: 0;
		z-index: 1;
	}

	#sidebar ul li a, #sidebar button {
		display: block;
		padding: 16px 0 13px 16px;
		text-decoration: none;
		font-family: "MyriadProSemibold", "Helvetica", "Arial";
		font-size: 14px;
		line-height: 1em;
	}

	.menu_button.show {
		background-size: 14px;
		background-position: 93%;
	}
	.mobile-menu, .section-menu {
		display: none;
	}

	#sidebar.active {
		height: auto;
	}
}

@media only screen and (max-width: 990px){
  /* this is here to display the menu for smaller screens */
  #sidebar_wrap {
    width: 100%;
  }

  #sidebar {
    width: 100%;
    position: static;
  }
  #sidebar_profile {
    width: 100%!important;
  }
  .menu_button.show {
    background-size: 25px;
    background-position: 95%;
  }

  .section-menu {
    font-size: 24px;
    width: 90px;
    height: 45px;
  }

  #sidebar {
    top: 180px;
  }

 /* #sidebar ul li a, #sidebar_profile ul li button {
     font-size: 24px;
    line-height: 40px;
  }*/
  #sidebar_wrap.active-menu {
    background: none;
  }
  header {
      height: 140px;
      width: 100%;
      background: var(--headerBG);
      margin: 0 auto;
      position: relative;
  }
  .logo {
      margin: var(--logo-margin);
      float: left;
      display: inline;
      max-width: 50%;
  }
}
@media only screen and (max-width: 767px){
  .section-menu {
    font-size: 24px;
    margin: 10px;
  }
  .user_nav ul li { padding: 0; }
  .user_nav ul li a {
    width: 90%;
    display: block;
  }
  #account #sidebar_wrap {
    display: none;
  }
}

.csstransforms #sidebar a { color: #464646; background-color:#e7e7e8; margin: 0; width: auto;}
.csstransforms #sidebar a:hover { color: var(--sectionTitle); background-color:#eee}
.no-csstransforms #sidebar a { color: #464646; background-color:#e7e7e8 }
.no-csstransforms #sidebar a:hover { color: var(--sectionTitle); background-color:#eee}
#sidebar a.current { color: var(--sectionTitle); background-color:#eee}

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

/*=============================
            Footer
  =============================*/

  footer {
      clear: both;
      width: 100%;

  }

  .site-footer{
    width: 100%;
    min-height: 120px;
    color: #686868;
    font-size:12px;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
          box-sizing: border-box;
          margin-top:25px;
                    background: #e7e7e8;
    z-index: -1;
  }

  .site-footer a {
    color: #767676;
    text-decoration: none;
  }

  .site-footer .footer-nav {
    float: left;
    width: 100%;
    padding-top: 17px;
    background: #e7e7e8;
    padding-bottom: 15px;
    margin-bottom: 5px;

  }

  .site-footer .footer-nav ul {
    display: flex;
    margin: auto;
    justify-content: space-between;
    width: 90%;


  }
  .site-footer .footer-nav li {
    /* display: inline-block; */
    float: left;
    padding: 5px;
    font-size: 14px;

  }
  .site-footer .footer-nav li:hover {cursor: pointer;}
  .site-footer .footer-nav li a {
    display:block;
    width:100%;
    padding-left: 25px;
  }
  /* background: url('/assets/images/system.png') 0 0 no-repeat;  } */
  .site-footer .footer-nav li.foot-email a {
    /* background-position: 0 -252px; */
    background: url('/assets/images/system.png') 0 -252px no-repeat;
    width:55px;
  }
  .site-footer .footer-nav li.foot-chat a {
    /* background-position: 0 -305px;  */
    background: url('/assets/images/system.png') 0 -305px no-repeat;
  }
  .site-footer .footer-nav li.foot-phone a {
    background: url('/assets/images/system.png') 0 -353px no-repeat;
  }

  .site-footer .copyright {
    margin-top: 10px;
    padding-top: 5px;
    width: 80%;
    margin: auto;
    border-top: 1px solid #767676;
    text-align: center;
    margin-top: 15px;
    padding-top: 15px;
  }

  .site-footer .copyright p {
    margin: 0;
  }

  .site-footer .footer-logo {
    height: 20px;
    text-align: center;
  }

  .site-footer .footer-logo p {
    margin: 0;
  }

  .site-footer .footer-logo img{
    position: relative;
  }


/* Desktop Size */
@media only screen and (min-width: 992px){
footer {
      clear: both;
      width: 100%;

  }

  .site-footer{
    width: 100%;
    padding-left: 0px;
    padding-right: 0px;
    background: transparent;
    color: #686868;
    font-size:12px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    position: relative;
    background: #e7e7e8;
    min-height: 50px;
  }

  .site-footer a {
    color: #676767;
    text-decoration: underline;
  }

  .site-footer .footer-nav {
    float: left;
    width: auto;
    padding-top: 17px;
    margin-bottom: 0px;
    padding-bottom: 0px;
    width: 40%;
  }

  .site-footer .footer-nav ul {
    display: block;
    margin: auto;
    justify-content: initial;
    width: 100%;
    padding-left: 32px;
  }
  .site-footer .footer-nav li {
    float: left;
    height: 20px;
    font-size: 12px;

  }
/*   .site-footer .footer-nav li:hover {cursor: initial;}
  .site-footer .footer-nav li a {display:block; width:100%;background: url('/assets/images/system.png') 0 0 no-repeat;padding-left: 25px; }
  .site-footer .footer-nav li.foot-email a {
    background-position: 0 -252px;
    width:55px;
  }
  .site-footer .footer-nav li.foot-chat a { background-position: 0 -305px;width:60px; }
  .site-footer .footer-nav li.foot-phone { background: url('/assets/images/system.png') 0 -350px no-repeat;padding-left:20px; } */


  .site-footer .copyright {
    padding-top: 0px;
    width: auto;
    float: left;
    margin-left: 0px;
    border-top: none;
    text-align: left;
    margin-top: 5px;
    padding-top: 17px;
  }

  .site-footer .copyright p {
    margin: 0;
    margin-left: 15px;
    font-size: 12px;

  }

  .site-footer .copyright-wrap {
    width: 60%;
    background: #e7e7e8;
  }

  .site-footer .footer-logo {
    float: right;
    padding-right: 32px;
    padding-top: 17px;
    height: 20px;
    width: 150px;
  }

  .site-footer .footer-logo p {
    margin: 0;
    font-size: 12px;

  }

  .site-footer .footer-logo img{
    position: relative;
    padding-left: 5px;
  }

  .copyright-wrap {
    background: #e7e7e8;
    display: inline-block;
    width: auto;
    float: right;
    padding-bottom: 10px;
  }
}

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

/*=============================
   JavaScript Specific Styles
  =============================*/

    /*=============================
         Password Checker
      =============================*/
    .no-match { color: #FF7B78 !important }
    .pwd_match {float: left;
      clear: both;
      position: relative;
      left: 20px;
      top: -5px;
      /* color: red; does not meet WCAG standards */
	    color: #E00000; /*meets AA standards*/;
      visibility: hidden;
    }
    #password_confirm.no-match + .pwd_match {
      visibility: visible;
    }
    #operator_builder input[type="password"] + .pwd_match {
      top: -25px; /* operator page */
    }
    .password_strength {
        float: left;
        display: inline-block;
        clear: both;
        margin: 8px 0 0 0px;
        font: 14px "MyriadProRegular", "Helvetica", "Arial";
        width: 60%;
    }
    .strength { font-family: "MyriadProSemiBold", "Helvetica", "Arial"; display: inline }
    .meter {
        display: inline;
        width: 60%;
        height: 8px;
        background: #ccc;
        font-size: 12px;
        margin: 0;
        float: left;
        clear: both;
        margin-top: 5px;
    }
    .pw_strength {
      position: relative;
      float: left;
      margin-left: 25px;
    }

    .password-container p {
      clear: both;
    }

	.password_group {
	  position: relative;
	  clear: left;
	  float: left;
	  display: inline-block;
	  height: 165px;
	}

	.password_group input[type="text"] {
	  clear: both;
	  float: left;
	}

	.password_strength_wrap {
	  position: relative;
	  float: left;
	  margin-left: 25px;
	  display: flex;
	  flex-flow: column;
	}
	.password-update fieldset div, .disable-atrium-login fieldset div {
	  display: block;
	  clear: both;
	  float: left;
	}
	.password-container .password_strength_wrap p {
	  margin: 0px;
	  margin-top: 10px;
	  flex: 1;
	  width: 80%;
	}


	@media only screen and (min-width: 991px){
		.password_strength_wrap {
			width: 50%; /* hack for mobile devices */
		}

		.meter {
			width: 60%;
		}

	}

	@media only screen and (max-width: 767px){
		.password_group {
		  display: block;
		  float: none;
		}
		.password_strength_wrap, .pw_strength {
		  margin-left: 0px;
		  margin-bottom: 10px;
		  top: 0;
		}
	}

    .strong { background: #39b54a }
    .medium { background: #ffff00 }
    .weak { background: #ff7b7b }

    /*=============================
         Modal Style Overrides
      =============================*/
    .ui-button-text-only .ui-button-text { padding: 7px 1em 4px 1em !important;}

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

    /*=============================
         Request Error Modal
      =============================*/
    #request_error { display: none }
    #request_error p { margin: 0 }

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

    /*=============================
               Row states
      =============================*/
    .active_wrap { background-color: #FAF7D1 !important } /* needs to be important to override bg styles */

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

    /*=============================
        Styled Select
      =============================*/
    .select-replace-cover { cursor: pointer }
    /*.select-replace-cover { padding-top: 5px } /* plugin offset so things look right for most dropdowns, but you will have to do some work :) */

    /*=============================
        jScrollPane
      =============================*/
    .jScrollPane_list { max-height: 500px; width: 100% !important; height: auto;}
    .jScrollPane_list_small { max-height: 250px; width: 768px; }
    .jspContainer { overflow: hidden; position: relative }
    .jspPane { position: absolute }
    .jspVerticalBar {
        position: absolute;
        top: 0; right: 0;
        width: 9px;
        height: 100%;
    }
    .jspHorizontalBar {
        position: absolute;
        bottom: 0; left: 0;
        width: 100%;
        height: 0px;
        background: #ccc;
    }
    .jspVerticalBar *,
    .jspHorizontalBar * { margin: 0; padding: 0 }
    .jspCap { display: none }
    .jspHorizontalBar .jspCap { float: left }
    .jspTrack { background: #ccc; position: relative }
    .jspDrag {
        background: #ababab;
        position: relative;
        top: 0; left: 0;
        cursor: pointer
    }
    .jspHorizontalBar .jspTrack,
    .jspHorizontalBar .jspDrag { float: left; height: 100% }
    .jspArrow {
        background: #50506d;
        text-indent: -20000px;
        display: block;
        cursor: pointer
    }
    .jspArrow.jspDisabled { cursor: default; background: #80808d }
    .jspVerticalBar .jspArrow { height: 16px }
    .jspHorizontalBar .jspArrow {
        width: 16px;
        float: left;
        height: 100%
    }
    .jspVerticalBar .jspArrow:focus { outline: none }
    .jspCorner {
        background: #eeeef4;
        float: left;
        height: 100%
    }
    /* Yuk! CSS Hack for IE6 3 pixel bug :( */
    * html .jspCorner { margin: 0 -3px 0 0 }
    /*rules for the plot target div.  These will be cascaded down to all plot elements according to css rules*/

    /*====================================================================*/
    /*====================================================================*/
   /*=============================
            DataTables
    =============================*/
      /*=============================
                  Table
       =============================*/
      table.dataTable {
         margin: 0 auto;
         clear: both;
         width: 100%;
         border-collapse: collapse;
      }
      table.dataTable thead th {
         padding: 11px 18px 9px 12px;
         font-family: "MyriadProBold","Helvetica",Arial;
         cursor: pointer;
         color: #fff;
         background: #757679;
      }
      table.dataTable tfoot th {
         padding: 3px 18px 3px 10px;
         border-top: 1px solid #000;
         font-weight: bold
      }
      table.dataTable td, table.dataTable tbody th { padding: 6px 12px; }
      table.dataTable td.center,
      table.dataTable td.dataTables_empty { text-align: center }
      table.dataTable tr.odd { background-color: #fff }
      table.dataTable tr.even { background-color: #f3f6fa }
      table.dataTable tr.odd td.sorting_1 { background-color: #ffffff }
      /*table.dataTable tr.odd td.sorting_2 { background-color: #DADCFF }*/
      table.dataTable tr.odd td.sorting_3 { background-color: #E0E2FF }
      table.dataTable tr.even td.sorting_1 { background-color: #F4FBFE }
      /*table.dataTable tr.even td.sorting_2 { background-color: #F2F3FF }*/
      table.dataTable tr.even td.sorting_3 { background-color: #F9F9FF }
      table.dataTable td:last-child { border-right: none }
      table.dataTable td:first-child { border-left: none }

      /*=============================
               Table wrapper
       =============================*/
      .dataTables_wrapper {
         position: relative;
         clear: both;
         *zoom: 1
      }
      /*=============================
             Page length menu
       =============================*/
      .dataTables_length { float: left; margin-bottom: 5px; }
      /*=============================
                Filter
       =============================*/
      .dataTables_filter { float: right; text-align: right }
      /*=============================
            Table information
       =============================*/
      .dataTables_info {
         clear: both;
         float: left;
         display: inline;
         margin-top: 18px;}
      .pagination_divider { margin:0 0 15px 0;}
      /*=============================
               Pagination
       =============================*/
      .dataTables_paginate {
         float: right;
         text-align: right;
         padding-top: 7px;
         padding-bottom: 10px;
         }

      /* Two button pagination - previous / next */
      .paginate_disabled_previous,
      .paginate_enabled_previous,
      .paginate_disabled_next,
      .paginate_enabled_next {
         height: 19px;
         float: left;
         cursor: pointer;
         *cursor: hand;
         color: #111 !important;
         padding-top: 4px;
      }
      .paginate_disabled_previous:hover,
      .paginate_enabled_previous:hover,
      .paginate_disabled_next:hover,
      .paginate_enabled_next:hover { text-decoration: none !important }
      .paginate_disabled_previous:active,
      .paginate_enabled_previous:active,
      .paginate_disabled_next:active,
      .paginate_enabled_next:active { outline: none }
      .paginate_disabled_previous,
      .paginate_disabled_next { color: #666 !important }
      .paginate_disabled_previous,
      .paginate_enabled_previous { padding-left: 23px }
      .paginate_disabled_next,
      .paginate_enabled_next { padding-right: 23px; margin-left: 10px }
      .paginate_enabled_previous { background: url('/assets/images/back_enabled.png') no-repeat top left }
      .paginate_enabled_previous:hover { background: url('/assets/images/back_enabled_hover.png') no-repeat top left }
      .paginate_disabled_previous { background: url('/assets/images/back_disabled.png') no-repeat top left }
      .paginate_enabled_next { background: url('/assets/images/forward_enabled.png') no-repeat top right }
      .paginate_enabled_next:hover { background: url('/assets/images/forward_enabled_hover.png') no-repeat top right }
      .paginate_disabled_next { background: url('/assets/images/forward_disabled.png') no-repeat top right }

        /* Full number pagination */
      .paging_full_numbers { height: 25px; line-height: 0px; margin: 25px 0 0 0;}

      /* .paging_full_numbers button { border-width: 0px } */

      /* .paging_full_numbers button:active */
      .paging_full_numbers a:active{ outline: none }

      /* .paging_full_numbers button:hover */
      .paging_full_numbers a:hover{ text-decoration: none }

      /* .paging_full_numbers button.paginate_button,
      .paging_full_numbers button.paginate_active */
      .paging_full_numbers a.paginate_button,
      .paging_full_numbers a.paginate_active{
         padding: 3px 6px;
         margin: 0 3px;
         cursor: pointer;
         color: #333 !important;
      }

      /* .paging_full_numbers button.paginate_button */
      .paging_full_numbers a.paginate_button{ background-color: #ddd }

      /* .paging_full_numbers button.paginate_button:hover */
      .paging_full_numbers a.paginate_button:hover{
          background-color: var(--primary);
          color: var(--pFont) !important;
          text-decoration: none !important
      }

      /* .paging_full_numbers button.paginate_active */
      .paging_full_numbers a.paginate_active, 
      .paging_full_numbers a.paginate_button.current { background-color: var(--primary); color:var(--pFont) !important; }
      /*=============================
          Processing indicator
       =============================*/
      .dataTables_processing {
         position: absolute;
         top: 50%;
         left: 50%;
         width: 250px;
         height: 30px;
         margin-left: -125px;
         margin-top: -15px;
         padding: 14px 0 2px 0;
         border: 1px solid #ddd;
         text-align: center;
         color: #767676;
         font-size: 14px;
         background-color: white
      }
      /*=============================
                Sorting
       =============================*/
      table.dataTable .sorting_asc { background: url('/assets/images/sort_asc.png') no-repeat center right; background-color:#666 }
      table.dataTable .sorting_desc { background: url('/assets/images/sort_desc.png') no-repeat center right; background-color:#666 }
      table.dataTable .sorting_asc_disabled { background: url('/assets/images/sort_asc_disabled.png') no-repeat center right }
      table.dataTable .sorting_desc_disabled { background: url('/assets/images/sort_desc_disabled.png') no-repeat center right }
      table.dataTable th:active { outline: none }
      /*=============================
               Scrolling
       =============================*/
      .dataTables_scroll {
        clear: both;
        max-width: 100%;
        /* overflow: scroll;*/
      }
      .dataTables_scrollBody { *margin-top: -1px }

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

      /*=============================
                 Loader
       =============================*/
       /* #loader { background: url(/assets/images/ajax-loader.gif) no-repeat scroll 0 0 transparent } original loader image */
       #loader , #progressbar {
            display: none;
            z-index: 1000;
         }

         .spinner {
            background: url(/assets/images/loading-sm.gif) no-repeat scroll 0 0 transparent;
            margin: 19px 0 0 170px;
            padding-left: 31px;
            font-size: 20px;
            font-family: "MyriadProBold", "Helvetica", "Arial";
            position:absolute;
            z-index: 1000;
         }


/*=============================
  End JavaScript Specific Styles
 =============================*/

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

/*=============================
   non-semantic helper classes
 =============================*/
/* For image replacement */
.ir { border:0; font: 0/0 a; text-shadow: none; color: transparent; background-color: transparent }
/* Hide from both screenreaders and browsers: h5bp.com/u */
.hidden { display: none !important; visibility: hidden }
/* Hide only visually, but have it available for screenreaders: h5bp.com/v */
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px }
/* Extends the .visuallyhidden class to allow the element to be focusable when
 * navigated to via the keyboard: h5bp.com/p */
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto }
/* Hide visually and from screenreaders, but maintain layout */
.invisible { visibility: hidden }
/* Contain floats: h5bp.com/q */
.clearfix:before, .clearfix:after { content: ""; display: table }
.clearfix:after { clear: both }
.clearfix { *zoom: 1 }

/*=============================
   Name duplicate alarm
 =============================*/
.not_available {
    color: #CD291F;
    float: left;
    margin: 12px 0 0 5px;
    display: none;
}


/*=============================
   List Page Members Icon
==============================*/

.people_icon {
	font: 14px "MyriadProSemiBold", "Helvetica", "Arial";
	color:#6D6E71;
        background: url(/assets/images/system.png) no-repeat scroll 0 -2242px transparent;
	padding: 4px 0 10px 22px;
  border: none;
}

.people_icon:hover {color: #0B66A8; cursor: pointer;}

.members {
   position: absolute;
   top: 17px;
   right: 20px;
}

/*=============================
   List Page Places - # of readers
==============================*/

.readers {
   position: absolute;
   top: 17px;
   right: 20px;
   color:#6D6E71;
   font: 14px "MyriadProSemiBold", "Helvetica", "Arial";
}

.readers:hover {color: #0B66A8; cursor: pointer;}

/*=============================
   Notice Modal
==============================*/

#notice {
      font: 18px "MyriadProSemiBold", "Helvetica", "Arial";
      text-align: center;
      display: none; /* so it is hidden on load */
}

/*=============================
   Denied Modal
==============================*/
.blocker, .id_blocker {
  width: 90%;
  height: 100%;
  position: absolute;
  z-index: 9999;
  cursor: pointer;
}

.id_blocker {
  top: 100px;
  width: 195px;
  height: 29px;
}

#denied { display: none; }

.file-container.regular {
    overflow: hidden;
    margin: 10px;
}
.file-container.regular input[type="text"]:disabled{
  background: #FFFFFF;
  width: 200px;
  margin-bottom: 0px;
}

.file-container.regular  [type=file] {
    position: absolute;
    top: 20px;
    height: 30px;
    right: 0;
    margin: 0;
    padding: 0;
    font-size: 20px;
    opacity: 0;
    filter: alpha(opacity=0);
    cursor: pointer;
}
.file-container.regular .file-icon{
    background: url(/assets/images/system.png) no-repeat scroll 4px -2490px transparent;
    padding: 5px 10px 5px 20px;
    margin-left: 10px;
    background-color: #DDDDDD;
    cursor: pointer;
}

input[type="submit"].disabled, input[type="submit"]:hover.disabled{
   transition: none;
   color: #777777;
   opacity: 0.75;
   background: repeating-linear-gradient(
      -45deg,
      #666666,
      #000000 4px
    );
}

/*=======================================
 Inline editing
 ========================================*/
.inline{
   display: inline-block;
}
.inline .icon {
   height: 16px;
   width: 16px;
   cursor: pointer;
   display: inline-block;
}
button.icon {padding: 1px 6px; /*override iOS defaults */}
.inline .icon.edit{
   background: url(/assets/images/ui-icons_0f1e29_256x240.png) no-repeat scroll -64px -110px transparent;
}
.inline .icon.remove, .icon.remove {
   background: url(/assets/images/ui-icons_0f1e29_256x240.png) no-repeat scroll -80px -126px transparent;
}
.inline .icon.add {
   background: url(/assets/images/ui-icons_0f1e29_256x240.png) no-repeat scroll -16px -126px transparent;
}
.inline .form{
   display: none;
}
.inline .status{
   margin-top: 10px;
}
.response.status{
   margin-top: 10px;
   clear: both;

}
.response.ajax-loader, .table-cell.ajax-loader,
#generic_delete_message.ajax-loader, #photo_delete_confirm.ajax-loader {
   background: url(/assets/images/ajax-loader.gif) no-repeat scroll center 0 transparent;
   height: 20px;
}
.table{
   display: table;
}
.table-row{
   display: table-row;
}
.table-cell{
   display: table-cell;
   padding: 5px;
}
.table-cell.label{
   font-family: "MyriadProSemibold", "Helvetica", "Arial";
}
.table-cell.ajax-loader{
   min-width: 200px;
}
select{
  border: 1px solid #b6b6b3;
  color: #464646;
  background: #FFFFFF url("/assets/images/reports.png") no-repeat scroll right -263px;
  font-size: 12px;
  margin: 0px;
  padding: 5px 35px 5px 2px;
  -webkit-appearance: none;
  -moz-appearance: none;
}
.message { clear: both; }
select.slim{
   background: #FFFFFF url("/assets/images/reports.png") no-repeat scroll 32px -201px;
   width: 45px;
   padding: 5px;
}
.ui-widget select.sub-select{
   margin-left: 0px;
}
.ui-datepicker .ui-datepicker-title select{
   font-size: 0.8em !important;
}
#login_as_modal{
   display: none;
}

.widget_head h2 {
  margin: 0;
  color: #fff;
  float: left;
  padding: 8px 0px 8px 20px;
  font-family: "MyriadProSemiBold", "Helvetica", "Arial";
}
/*
 modifying scrollbar properties
 doesn't work for firefox
 */
::-webkit-scrollbar {
      width: 10px;
      height: 10px;
}
::-webkit-scrollbar-track {
      background-color: #CCCCCC;
}
::-webkit-scrollbar-thumb {
      background-color: #ABABAB;
      height: auto;
}
::-webkit-scrollbar-button {
    display: block;
    height: 0;
    width: 0;
    background-color: transparent;
}
::-webkit-scrollbar-corner {
      background-color: #E6E7E8;
}

input[name="simple_search"] {
    margin: 0px;
}

.reset-button-t_mod_z {
   border: none;
   margin: 0;
   padding: 0;
   width: auto;
   overflow: visible;

   background: transparent;

   /* inherit font & color from ancestor */
   color: inherit;
   font: inherit;

   /* Normalize `line-height`. Cannot be changed from `normal` in Firefox 4+. */
   line-height: normal;

   /* Corrects font smoothing for webkit */
   -webkit-font-smoothing: inherit;
   -moz-osx-font-smoothing: inherit;

   /* Corrects inability to style clickable `input` types in iOS */
   -webkit-appearance: none;
}

.item_id {
    background: #464646;
    padding: 7px 10px 5px 10px;
    border: 0;
    margin-right: 10px;
    text-decoration: none;
    color: #fff;
    text-transform: uppercase;
    font-family: "MyriadProBold", "Helvetica", "Arial";
    position: absolute;
    right: 5px;
    top: 10px;
    width: 40px;
    border-radius: 10px;
    text-align: center;
}
#reason { color: black; }
/** Updated jquery ui js. So need to make some css changes to ui-dialog */
.ui-widget-overlay {
	z-index: 1;
	position: fixed;
}
#section_wrap {
	 z-index: 0;
	 position: relative;
}
.ui-dialog {
/* 	z-index: 10!important;*/
  outline: none !important;
}
.ui-dialog .ui-button.ui-dialog-titlebar-close{
  border: 0;
}
.ui-dialog-buttonset .ui-button{
  border: 0;
  color: #fff;
  padding: 7px 1em 4px 1em;
}
.ui-icon-refresh {
  width: 16px;
  height: 16px;
  background-image: url(/assets/images/ui-icons_0f1e29_256x240.png);
  background-position: -64px -80px;
  border: 0;
}
button.ui-icon {
  display: inline;
  float: right;
  cursor: pointer;
  padding: 8px;
  background-color: #fff;
  margin-top: 1px;
  margin-right: 0;
}
button.ui-icon:hover {
  background-color: #fff;
}
.ui-icon-plus {
  width: 16px;
  height: 16px;
  background-image: url(/assets/images/ui-icons_0f1e29_256x240.png);
  background-position: -16px -128px;
}
a.ui-icon {
  display: inline;
  float: right;
  cursor: pointer;
  background-color: inherit;
  margin-left: 2px;
}

.my-2 {
  margin-top:2rem;
  margin-bottom:2rem;
}

body.loading {
  opacity: .7;
}

body.loading #loading {
  position:fixed;
  top:50%;
  left:50%;
  transform:translate(-50%, -50%);
  z-index:1000;
  display:block;
}

body.loading #loading span {
  background-image: url(/assets/images/loading-sm.gif);
  padding-left: 31px;
  font-size: 20px;
  font-family: "MyriadProBold", "Helvetica", "Arial";
  position: absolute;
  z-index: 1000;
  background-size: contain;
  background-repeat: no-repeat;
}

#loading {
  display:none;
}

/**
 * There are other css rules that seems to affect this element
 * Reset it to standard select2 css
 */
.select2-container--default .select2-selection--multiple .select2-selection__choice {
  padding:0 !important;
  padding-left:20px !important;
}

/**
 * utility classes
 */


 /** Text Classes **/
 .text-right {
   text-align:right;
 }

 .text-center {
   text-align:center;
 }
 /** End Text Classes **/

 /** Float Classes **/
 .float-none {
   float:none !important;
 }

 .float-left {
   float:left !important;
 }

 .float-right {
   float:right !important;
 }
 /** End Float Classes **/

 /** Flexbox classes **/
.d-flex {
  display:flex;
}

.d-none {
  display:none;
}

.d-flex.align-items-end {
  align-items:end;
}

.d-none {
  display:none;
}

.d-flex.justify-content-space-between {
  justify-content: space-between;
}

.d-flex.justify-content-space-around {
  justify-content: space-around;
}

.d-flex.justify-content-space-evenly {
  justify-content: space-evenly;
}

.d-flex.align-items-center {
  align-items:center;
}

.d-flex.justify-content-end {
  justify-content:end;
}

.d-flex.flex-direction-column {
  flex-direction: column;
}
/** End Flexbox classes **/

/** Display classes **/
.d-block {
  display:block;
}

.d-inline-block {
  display:inline-block !important;
}
/** End Display classes **/

/** Margin classes **/
/** Margin pixel styles **/
.mt-15 {
  margin-top:15px !important;
}

.mr-10 {
  margin-right:10px !important;
}

.mb-10 {
  margin-bottom:10px !important;
}

.mt-10 {
  margin-top:10px !important;
}

.mt-0 {
  margin-top:0px !important;
}

.ml-10 {
  margin-left:10px !important;
}

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

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

.my-0 {
  margin-top:0;
  margin-bottom:0;
}

.mb-5 {
  margin-bottom:5px;
}

/** Margin rem styles **/
.mr-1 {
  margin-right:1rem !important;

}
.mr-2 {
  margin-right:2rem !important;
}

.mt-1 {
  margin-top:1rem !important;
}

.ml-1 {
  margin-left:1rem !important;
}

.ml-2 {
  margin-left:2rem !important;
}

.mt-1 {
  margin-top:1rem !important;
}

/** Margin reset classes */
.mr-0 {
  margin-right:0 !important;
}

.m-0 {
  margin:0 !important;
}
/** End margin classes **/

/** Padding classes **/
.p-15 {
  padding:15px;
}
/** End padding classes **/

/** Cursor classes */
.c-pointer {
  cursor:pointer;
}

.ui-datepicker-trigger:after {
  visibility:hidden;
  content:'<span class="sr-only">Select Date</span>';
}

/** font classes **/
.font-bold {
  font-family: "MyriadProBold", "Helvetica", "Arial";
}
.font-size-14 {
  font-size:14px;
}
/** End font classes **/

/** Button Classes **/
.btn {
  width: 128px;
  height: 35px;
  display: inline-block;
  color: var(--sFont);
  text-decoration: none;
  text-transform: uppercase;
  text-align: center;
  font-size: 14px;
  font-family: "MyriadProBold", "Helvetica", "Arial";
}

.btn-primary {
  background: var(--secondary);
  color: var(--sFont);
}

.btn-primary:hover {
  background: var(--menuActive);
  color: var(--menuActiveFont);
}

.btn.btn-small {
  font-size:10px !important;
  height:auto !important;
  padding: 7px 12px 4px;
  width:auto;
}

form .btn.btn-small {
  font-size:13px !important;
}

form a.btn {
  border:2px solid var(--secondary);
}
/** End Button Classes **/

label.app-styled {
  color: #464646 !important;
  font-family: "MyriadProSemiBold", "Helvetica", "Arial" !important;
  font-size: 14px !important;
  float: left !important;
  clear: both !important;
  margin-bottom: 0px !important; 
  display: inline !important;
  width: 100% !important;
}

.bg-1 {
  background-color:#f3f6fa;
}

.operator_account_id {
  background: var(--secondary);
  padding: 7px 10px 5px 10px;
  border: 0;
  margin-right: 10px;
  text-decoration: none;
  color: var(--sFont);
  text-transform: uppercase;
  font-family: "MyriadProBold", "Helvetica", "Arial";
  width: 40px;
  border-radius: 10px;
  text-align: center;
  position:relative;
  top:5px;
  display:inline-block;
}

a.ajax_lib {
  text-decoration: underline;
  cursor:pointer;
}

/*Overwriting the width for Q-tips used in person profile*/
.qtip, .qtip {
    max-width: 400px !important;
}

.border-none {
  border:0 !important;
}
.alert-danger {
  color: #721c24;
  background-color: #f8d7da;
  border-color: #f5c6cb;
}

.alert {
    position: relative;
    padding: .75rem 1.25rem;
    margin-bottom: 1rem;
    border: 1px solid transparent;
    border-radius: .25rem;
}

.alert-info {
    color: #0c5460;
    background-color: #d1ecf1;
    border-color: #bee5eb;
}

.alert-secondary {
    color: #383d41;
    background-color: #e2e3e5;
    border-color: #d6d8db;
}

.list-id {
  background: var(--secondary);
    padding: 6px 10px 6px 10px;
    border: 0;
    margin-right: 10px;
    text-decoration: none;
    color: var(--sFont);
    text-transform: uppercase;
    font-family: "MyriadProBold", "Helvetica", "Arial";
    position: absolute;
    right: 5px;
    top: 10px;
    width: 30px;
    border-radius: 10px;
    text-align: center;
}