/*
 Project Neutron
 Haystax Technology
 */

 [ng-cloak]
 {
   display: none !important;
 }
 
 body {
     color: #444;
     margin:0;
     padding:0;
     width:100%;
     overflow: hidden;
     border: 0px;
     background-image: none;
     background-color: #000;
     -webkit-background-size: cover;
     background-size: cover;
     --color-cyan3: #0097B1;
     --color-link: var(--color-cyan3);

 }
 
 h3 {
     font-size: 38px;
 }
 
 .burritodiv {
     position: absolute;
     left: 200px;
     height: 54px;
     width: 40px;
     top: 0px;
     padding-top: 35px;
     text-align: bottom;
     overflow: hidden;
 }
 
 .logoscale {
     width: 50%;
     margin-top: -4px;
     margin-left: -5px;
 }
 
 .logo  {
     display: inline-block;
     background-size: 100% auto;
     background-repeat: no-repeat;
     background-image: url('../images/toplogo.png');
     height: 36px;
     width: 200px;
 }
 
 .landinglogo, .landingimage  {
     width: 100%;
     max-width: 600px;
     height: auto;
 }
 
 .landinglogo {
     display: inline-block;
     width: 80%;

      background: url('images/haystax_landing_logo.png') no-repeat;
     background-size: contain;
     height: 110px;
 
 }
 
 .landing_content {
     position: absolute;
     background-color: #fff; /*#ecf0f1;*/
     top: 0px;
     bottom: 0px;
     left: 0px;
     right: 0px;
     padding: 0px;
     overflow: auto;
     display: none;
     text-align:center;
 }
 
 .landing_content_div {
     padding: 100px 10%;
     font-weight: 300;
     background-color: #fff;
 }
 
 .landing_content_div_B {
     background-color: #bdc3c7;
     font-weight: 300;
 }
 
 .landing_content_div h3,
 .landing_content_div_B h3,
 .landing_content_div_top h3 {
     font-weight: 300;
 }
 
 .landing_content_div_top {
     background-size: cover;
     background-color: #2c3e50;
     color: #ecf0f1;
     font-weight: 300;
 }
 
 .landing_steps {
     color: #fff;
     background-color: #bdc3c7;
     margin: auto;
     max-width: 600px;
     height: 175px;
     margin-top: 0px;
     padding-left: 0px;
     padding-right: 0px;
     -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
     border-radius: 4px;
 }
 
 .landing_step {
     opacity: 1.0;
     padding: 0px;
     padding-top: 20px;
     float: left;
     width: 120px;
     text-align: center;
 }
 
 .landing_step h2 {
     font-variant:small-caps;
     font-size: smaller;
 }
 
 
 .landing_step_image {
     width: 80px;
 }
 
 .landing_footer {
     font-size: small;
     color: #bdc3c7;
 }
 
 .largelogo {
     position: absolute;
     width: 556px;
     height: 100px;
     bottom: 50px;
     left: 40px;
     margin: auto;
     bottom: -100px;
     cursor: pointer;
 
     background: url('images/haystax_landing_logo.png') no-repeat;
     background-size: contain;
 }

 .sso-only-btn {
     padding-left: 40px;
     padding-top: 12px;
     padding-bottom: 25px;
 }
  
 .loginintrotextblockinside {
     width: 475px;
     padding-left: 40px;
     padding-top: 25px;
     font-size: 170%;
     color: #000;/*#bdc3c7;*/
     font-weight: 300;
 }
 
 
 /* Login box */
 
 .loginbox {
     position: relative;
     top: 125px;
     min-width: 410px;
     width: max-content;
     height: 75%; /*265px;*/
     margin: auto;
     padding: 0px;
     -moz-border-radius: 4px;
     webkit-border-radius: 4px;
     border-radius: 4px;
     left: 40px;
     overflow: hidden;
     z-index: 10;
 }
 
 .loginbox_header {
    position: relative;
    background-color: #616368;
    height: 100px;
    background: url('images/haystax_logo_ow_reversed.png') no-repeat;
    background-size: contain;
 }
 .loginbox_body {
    position: relative;
    background-color: #ececed;
    padding: 20px;
 }
 .loginboxlist {
     padding: 0;
     margin: 0;
 }
 
 .loginboxlist li {
     padding: 10px;
     list-style: none;
 }
 
 .sso_or_text  {
     /* text-align: center; */
     color: #34495e;
     font-family: "Roboto", "Lato", Helvetica, Arial, sans-serif;
     font-size: 15px;
 }
 
 .checks_div {
     padding: 100px 10%;
     padding-top: 300;
 
 }
 .checksbox {
     width: 410px;
     height: auto; /*265px;*/
     background-color: #ecf0f1;
     margin: auto;
     padding: 40px;
     -moz-border-radius: 4px;
     webkit-border-radius: 4px;
     border-radius: 4px;
     left: 40px;
     overflow: hidden;
 }
 
 .checksboxlist {
     padding: 0;
     margin: 0;
 }
 
 .checksboxlist li {
     list-style: none;
 }
 
 .page_content {
     position: absolute;
     background-color: #fff; /*#ecf0f1;*/
     top: 0px; /* 90px TOP OF CONTENT PAGE */
     opacity: 1.0;
     bottom: 0px;
     left: 0px;
     right: 0px;
     padding: 20px;
     overflow: auto;
     display: none;
 }
 #forgotnoticespan {
     display: none;
 }
 #inputregusernameli, #inputregpasswordli, #registerbuttonsli, #inputregnameli, #inputregorgli, #inputregphoneli, #inputregageli, #inputusepolicyli {
     display: none;
     opacity: 0;
 }

 #inputregageli, #inputusepolicyli {
     padding-top: 0px;
     padding-bottom: 0px;
 }
 #inputregpassword1, #inputregpassword2, #inputregfirstname, #inputreglastname {
     display: inline-block;
     width: 151px;
 }
 #inputregpassword1, #inputregfirstname {
     margin-right: 4px;
 }
 
 #inputforgotusernameli, #forgotbuttonsli {
     display: none;
     opacity: 0;
 }
 
 #inputresetpasswordnew_li, #inputresetpasswordconfirm_li, #resetpasswordbuttons_li {
     display: none;
     opacity: 0;
 }
 
 #inputresetpasswordnew, #inputresetpasswordconfirm, #resetpasswordbutton_submit, #resetpasswordbutton_cancel {
     opacity: 0;
 }
 
 /* Decline Invite Box */

 .declinebox {
    position: relative;
    display: none;
    width: 410px;
    height: auto;
    top: 150px;
    margin: auto;
    padding: 0px;
    -moz-border-radius: 4px;
    webkit-border-radius: 4px;
    border-radius: 4px;
    overflow: hidden;
}

 /* Nav bar */
 
 .logoutarea {
     width: 200px;
     position: absolute;
     right: 0px;
     text-align:right;
     padding-right: 20px;
     padding-top: 10px;
 }
 
 .navarea {
     padding: 20px;
     display: block;
     opacity: 1.0;
 }
 
 .navarea > .navbar {
     z-index: 999;
 }
 
 .navarea .navbar-nav {
     line-height: 1.438;
 }
 
 .navarea .navbar-nav > li a {
     font-weight: normal;
     padding: 15px;
 }
 
 .navarea .navbar-collapse {
     padding: 0px 40px 0px 21px;
 }
 
 .navarea .dropdown-toggle .caret,
 .navarea .navbar-nav .dropdown-toggle .caret {
     margin-left: 2px;
 }
 
 #navbarapplinks {
     opacity: 0;
     display: none;
     font-weight: bold;
     font-variant:small-caps;
 }
 
 .navarea .open > .dropdown-menu {
     margin-top: 8px !important;
     opacity: 1;
     visibility: visible;
 }
 
 .navarea .open > .dropdown-arrow {
     margin-top: 1px;
     opacity: 1;
 }
 
 /* App icons */
 
 .apparea {
     position: absolute;
     top: 74px;
     padding-top: 76px;
     bottom: 0px;
     overflow: scroll;
     left: 0px;
     right: 0px;
     text-align: center;
     margin: auto;
 }
 
 
 .apparea::-webkit-scrollbar {
     display: none;
 }
 
 .app {
 }
 
 .appicon {
     width: 200px;
     margin: auto;
     margin-bottom: 50px;
 }
 
 .appicon img {
     width: 200px;
 }
 
 .appbadge {
     position: absolute;
     width: 50px;
     height: 50px;
     z-index: 100;
     margin-left: 140px;
     margin-top: 40px;
     background-image: url('../images/badge.png');
     background-repeat: no-repeat;
     background-size: 50px 50px;
     padding-top: 10px;
     color: White;
     font-weight: bold;
 }
 
 .appname {
     height: 40px;
     font-size: 20px;
     color: White;
     font-weight: bold;
     font-variant:small-caps;
     text-align: center;
 }
 
 .disabled {
     opacity: 0.25;
 }
 
 #page_login {
    display: flex;
    opacity: 0;
 }
 
 #page_applist {
     display: none;
     opacity: 0;
 }
 
 #aboutbox {
     position: absolute;
     width: 360px;
     height: 500px;
     top: 100px;
     right: -360px;
     background-color: #ecf0f1;
     -webkit-border-top-left-radius: 6px;
     -webkit-border-bottom-left-radius: 6px;
     -moz-border-radius-topleft: 6px;
     -moz-border-radius-bottomleft: 6px;
     border-top-left-radius: 6px;
     border-bottom-left-radius: 6px;
     padding: 20px;
     z-index: 10;
     opacity: 0.9;
 }
 
 .aboutcontent {
     font-size: 10px;
     color: #95a5a6;
     position: relative;
     top: -40px;
     width: 320px;
     height: 440px;
     overflow: -moz-scrollbars-vertical;
     overflow-y: scroll;
     display: none;
 }
 
 .aboutimagediv {
     width: 300px;
     text-align: center;
     padding-bottom: 20px;
     padding-top: 20px;
     margin-top: 20px;
     border-top: 1px solid #bdc3c7;
 }

 .aboutheaderdiv {
    width: 300px;
    text-align: center;
    padding-bottom: 20px;
    padding-top: 20px;
    margin-top: 20px;
    border-top: 1px solid #bdc3c7;
    font-size: 20px;
    font-weight: bold;
 }
 
 .aboutimage {
     max-width: 50px;
 }
 
 .aboutpagetext p {
     font-size: 16px;
     color: #7f8c8d;
 }
 
 .aboutpagetext h3 {
     font-size: 22px;
     color: #16a085;
     padding-bottom: 10px;
 }
 
 #aboutlink {
     position: relative;
     width: 50px;
     height: 50px;
     left: -90px;
     top: -20px;
     background-image: url('../images/flask.png');
     background-repeat: no-repeat;
     background-size: 50px 50px;
     cursor: pointer;
 }
 
 .abouttooltip {
     position: relative;
     display: inline-block;
 }

 .abouttooltip .abouttiptext {
     visibility: hidden;
     width: 120px;
     background-color: #ecf0f1;
     color: #333;
     text-align: center;
     padding: 5px 0;
     border-radius: 4px;
     position: absolute;
     z-index: 1;
     top: 100%;
     left: 50%;
     margin-left: -180px;
 }

 .abouttooltip:hover .abouttiptext {
     visibility: visible;
 }

 /* CSS to layout input forms */
 .formLayout {
 }
 
 .formLayout input, textarea {
     width: 300px;
 }
 
 .formLayout label {
     width: 120px;
     text-align: right;
     padding-right: 20px;
 }
 
 .showaslink {
     cursor: pointer;
 }

 .tags {
    margin-left: 126px;
    max-width: 450px;
    text-align: left;
 }

 .addlistitem a {
    text-decoration: none;
 }

 .addlistitem {
    list-style-type: none;
 }

 .addlistitem > li {
    background-color: #bdc3c7;
    padding-left: 5px;
    margin-top: 5px;
    text-align: left;
    width: 286px;
    list-style: none;
    display: inline-block;
    color: #ffffff;
    border-radius: 4px;
    border-style: solid;
    border-width: 0px;
    margin-left: 89px;
    font-size: smaller;
 }

.invitelistitem {
    list-style-type: none;
}

 .delete-item-invite {
    float:right;
    margin-right:2px;
    padding: 2px;
    text-decoration:none;
    color: #FC6A6A !important;
 }

 .addlistitem li a {
    text-decoration: none;
    color: #ffffff;
 }

 .emailinput {
     background: white url('../images/emailinputbg.png') left no-repeat;
     padding-left: 50px;
 }
 
 /* slide in from the bottom */
 @keyframes slideOutLeft {
     to 		{ transform: translateX(-100%); }
 }

 .datatable_icon {
     width: 24px;
     height: 24px;
 }
 
 .inviteerror.email {
     color: #ff0000;
 }
 
 #errorbox {
     position: relative;
     width: 410px;
     height: 40px;
/*     bottom: 200px; */
     margin: auto;
     padding-top: 0px;
     padding-bottom: 0px;
     padding-left: 50px;
     padding-right: 50px;
     -moz-border-radius: 4px;
     webkit-border-radius: 4px;
     border-radius: 4px;
     left: 40px;
     overflow: hidden;
     z-index: 10;
     display: none;
 }
 
 #loginerror {
     display: none;
     padding-top: 0px;
     margin-top: 0px;
 }
 
 #registererror {
     display: none;
     padding-top: 0px;
     margin-top: 0px;
 }

 #selfregistererror {
    display: none;
    padding-top: 0px;
    margin-top: 0px;
}
 
 
 /* styles for the people histograms */
 .chart rect {
     stroke: #315B7E;
     fill: steelblue;
 }
 
 .chart .result {
     stroke: red;
     stroke-width:2;
     stroke-opacity: 0.8;
 }
 
 .chart .median {
     stroke: darkgray;
     stroke-width:2;
     stroke-opacity: 0.6;
 }
 
 /* styles for the people histograms */
 .peoplechart rect {
     /*stroke: #315B7E;*/
     /*fill: steelblue;*/
 }
 /*
 .peoplechart {
     color: #7f0000;
     fill: #7f0000;
 }*/
 
 .peoplechart .result {
     stroke: red;
     stroke-width:2;
     stroke-opacity: 0.8;
 }
 
 .peoplechart .median {
     stroke: darkgray;
     stroke-width:2;
     stroke-opacity: 0.6;
 }
 
 .peoplechart .tick {
     font-size: 11px;
     fill: #7f8c8d;
 }
 
 .peoplechart .axis path,.peoplechart .axis line {
     stroke: #788;
 }
 
 .axis path,
 .axis line {
     fill: none;
     stroke: #000;
     shape-rendering: crispEdges;
 }
 
 .bar {
     stroke: steelblue;
     fill: steelblue;
 }
 
 .y.axis path {
     display: none;
 }

  .profile_field {
    font-size: 15px;
    margin: 0px;
 }

 .login-modal img {
    position: relative;
    height: 130px;
    width: 130px;
    top: 60px;
    left: 188px;
    z-index: 1;
 }

 .login-modal .modal-title{
    margin-top: 40px;
}

.login-modal .modal-dialog{
    width: 500px;
}

.login-modal .modal-header {
    clear: all;
    text-align: center;
}

.login-modal .modal-body {
    padding: 20px 50px 30px 50px;
}
 
 .errortitle {
     height: 40px;
     font-size: 32px;
     color: #7f8c8d;
     font-weight: bold;
     font-variant:small-caps;
 }
 
 .errorpagediv {
     text-align: center;
     padding: 20px;
     width: 560px;
     margin: 150px auto;
     -moz-border-radius: 4px;
     webkit-border-radius: 4px;
     border-radius: 4px;
     background-color: #ecf0f1;
 }
 
 .errormodal {
     text-align: center;
 }

 .unsubscribeblock {
     position: absolute;
     left: 35%;
     top: 30%;
     background-color: #bdc3c7;
     height: 220px;
     width: 300px;
     opacity: 0.8;
     -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
     border-radius: 4px;
     text-align: center;
     padding:30px;
     padding-top:10px;
 }

.unsubscribe_alert_header {
    background-size: contain;
    height: 50px;
}

.aboutcontent::-webkit-scrollbar,
.dropdown-menu::-webkit-scrollbar,
.globalsearch .results .details::-webkit-scrollbar,
.globalsearch .results > ul::-webkit-scrollbar {
    -webkit-appearance: none;
}

.aboutcontent::-webkit-scrollbar:vertical,
.dropdown-menu::-webkit-scrollbar:vertical,
.globalsearch .results .details::-webkit-scrollbar:vertical,
.globalsearch .results > ul::-webkit-scrollbar:vertical {
    width: 8px;
}

.aboutcontent::-webkit-scrollbar:horizontal,
.dropdown-menu::-webkit-scrollbar:horizontal,
.globalsearch .results .details::-webkit-scrollbar:horizontal,
.globalsearch .results > ul::-webkit-scrollbar:horizontal {
    height: 8px;
}

.aboutcontent::-webkit-scrollbar-thumb,
.dropdown-menu::-webkit-scrollbar-thumb,
.globalsearch .results .details::-webkit-scrollbar-thumb,
.globalsearch .results > ul::-webkit-scrollbar-thumb {
    border-radius: 8px;
    border: 0px solid purple; /* should match background, can't be transparent */
    background-color: rgba(149, 165, 166, 0.5);
}

.forminputfields label, .forminputfields input, .forminputfields textarea {
    display:inline-block;
    margin: 0px;
}

.forminputfields .longlabel {
    line-height: 1.2;
    padding-top: 6px;
}

.forminputfileupload {
    margin-left: 128px;
    word-wrap: break-word;
}

.forminputlabel {
    color: rgba(0,0,0,.85);
    width: 125px;
    text-align: right;
    padding-right: 20px;
    vertical-align: top;
}

.forminputlabel_afterinput {
    color: #16a085;
    padding-left: 5px;
    vertical-align: top;
}

.overviewlabel {
    color: #1abc9c;
}

.not_full_width {
    width: 50%;
    display: block;
}

.not_full_width_inline {
    width: 50%;
    display:inline-block;
}

.add_dropdown_seperation li {
    margin-bottom: 5px;
}

input.error, input.ng-dirty.ng-invalid {
    border-color: #c0392b;
}

span.error, span.ng-dirty.ng-invalid {
    color: #c0392b;
    font-size: 12px;
}

span.success {
    color: #2ecc71;
    font-size: 12px;
}

span.sending {
    font-size: 12px;
}
 
 .unsubscribebody {
 }
 
 .feedback_button {
     height: 30px;
     width: 30px;
     position: fixed;
     bottom: 25px;
     right: 40px;
     z-index: 1025;
     cursor: pointer;
     *cursor: hand;
     opacity: 0.5;
 }
 
 .feedback_button:hover{
     opacity: 1.0;
 }
 
 .burrito_area {
     position: fixed;
     top: 20px;
     height: 54px;
     left: 300px;
     width: 300px;
     z-index: 1;
     overflow: hidden;
 }
 
 .burrito_button {
     height: 60px;
     width: 60px;
     position: fixed;
     top: 50px;
     left: 300px;
     z-index: 1025;
     cursor: pointer;
     *cursor: hand;
     opacity: 0;
     -webkit-transition: top 0.5s, opacity 0.5s; /* For Safari 3.1 to 6.0 */
     transition: top 0.5s, opacity 0.5s;
 }
 
 .burrito_message {
     position: fixed;
     top: 30px;
     left: 350px;
     height: 30px;
     padding-right: 10px;
     padding-top: 2px;
     background-color: #ecf0f1;
     padding-left: 10px;
     z-index: 1000;
     -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
     border-radius: 4px;
     font-size: smaller;
     border: 1px solid #bdc3c7;
     opacity: 0;
     display: none;
 }
 
 .scrollable_max_height {
     max-height: 500px;
     overflow-y: scroll;
 }
 
 .clickable {
     cursor: pointer;
     *cursor: hand;
     text-decoration: underline;
 }
 
 .clickable_plain {
     cursor: pointer;
     *cursor: hand;
 }
 
 .usage_content {
     position: absolute;
     background-color: #fff; /*#ecf0f1;*/
     top: 0px;
     bottom: 0px;
     left: 0px;
     right: 0px;
     padding: 0px;
     overflow: auto;
     display: none;
     text-align:left;
     display: block;
     top: 0px;
     opacity: 1;
 }
 
 .usage_content_div {
     padding: 5%;
     min-width: 100%;
     background-color: #f0f0f0;
 }
 
 .usage_footer {
     font-size: small;
     color: #bdc3c7;
 }
 
 .modal_login {
     width: 350px;
 }
 
 .modal_status {
     position: relative;
     width: 0px;
     height: 0px;
 }
 
 .modal_status span {
     position:absolute;
     width: 200px;
 }
 
 .typeahead_message {
     color: #1abc9c;
 }
 
 /* this hides the dropdown arrow/calendar for Chrome's input date type */
 input::-webkit-calendar-picker-indicator{
     display: none;
 }
 
 .dateinput {
     background: white url('../images/calendarinputbg.png') left no-repeat;
     padding-left: 50px;
 }
 input[type="range"] {
    display: inline-block;
    width: 40%;
    vertical-align: middle;
}
 
 /* need to figure out a way to change the text color of 'placeholder' in chrome's input date type
 input::-webkit-datetime-edit-month-field {
     color: red;
 }
 input::-webkit-datetime-edit-month-field:active,
 input::-webkit-datetime-edit-month-field:focus {
     color: blue;
 }
 */
 
 .left {
     float: left;
 }
 .right {
     float: right;
 }
 
 .hiddentitle.page_content {
    top: 20px;
 }
 .hiddentitle.navarea {
     display: hidden;
     opacity: 0;
 }

.dropdown-menu {
    overflow: -moz-scrollbars-vertical;
    overflow-y: auto;
    overflow-x: hidden;
    max-height: 300px;
    margin-bottom: 20px;
}

/* slide in from the bottom */
@keyframes slideOutLeft {
    to 		{ transform: translateX(-100%); }
}

.login.ng-leave { animation:slideOutLeft 1.5s both ease-in; }

.translucent {
    opacity: 0.5;
}

.loginerror, .registererror, .forgoterror, .inviteerror {
    color: #16a085;
    font-size: 14px;
    line-height:1.0;
    padding-top: 4px;
}

.logoutmessage{
    color: #16a085;
    font-size: 14px;
    line-height:1.0;
    padding-top: 20px;
    padding-left: 10px;
}

.unsubscribe_alertblock {
    position: absolute;
    left: 35%;
    top: 30%;
    background-color: #bdc3c7;
    height: 300px;
    width: 300px;
    opacity: 0.8;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    text-align: center;
    padding:30px;
    padding-top:10px;
}

.unsubscribeheader {
    background-size: contain;
    height: 50px;
    margin-bottom: 20px;
}

 .globalsearch {
     width: 800px;
 }
 
 .globalsearch .results {
     width: 750px;
     margin-top: 20px;
 }
 
 .globalsearch .results .details {
     width:315px;
     height:300px;
     float:right;
     overflow: -moz-scrollbars-vertical;
     overflow-y: scroll;
 }
 
 .globalsearch .results > ul {
     width:415px;
     height:300px;
     list-style-type: none;
     padding-left: 0px;
     border-bottom: 2px solid #eef0f0;
     overflow: -moz-scrollbars-vertical;
     overflow-y: scroll;
 }
 
 .globalsearch .results > ul > li {
     padding: 2px 2px 2px 2px;
     border-top: 2px solid #eef0f0;
 }
 
 .globalsearch .results > ul > li.odd {
     background-color: #f9fafb;
 }
 
 .globalsearch .results > ul > li.even {
     background-color: #ffffff;
 }
 
 .globalsearch .results > ul > li.odd.highlighted,
 .globalsearch .results > ul > li.even.highlighted {
     background-color: rgb(255, 236, 158);
 }
 
 .highlighted{
     background-color: rgb(255, 236, 158);    
 }
 .globalsearch .results > ul > li img {
     float: left;
 }
 
 .globalsearch .results > ul > li .title {
     white-space: nowrap;
     text-overflow: ellipsis;
     overflow: hidden;
 }
 
 .itemlabel {
     color: #ecf0f1;
     font-size: 75%;
     background-color: #bdc3c7;
     display: inline-block;
     -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
     border-radius: 4px;
     padding-bottom: 0px;
     padding-left: 10px;
     padding-right: 10px;
     margin-right: 10px;
     margin-bottom: 2px;
     opacity: 1;
 }
 
 .delete_btn_span {
     float: left;
 }
 
 .devmark {
     position: absolute;
     top:0px;
     left: 0px;
     width: 100px;
     height: 100px;
     z-index: 1000;
     background-image: url('../images/devmark.png');
     background-size: 100px 100px;
 
 }
 
 @media (max-width: 1000px) {
     body {
         overflow: auto;
     }
 
     .navarea .navbar-collapse {
         padding: 0px 21px;
     }
 
     .navarea .dropdown-arrow {
         display: none;
     }
 
     #page_login {
         padding: 0px;
     }
 
     #aboutlink {
         display: none;
     }
 
     #aboutbox {
         position: relative;
         width: 100%;
         height: auto;
         margin: auto;
         top: 0px;
         right: 0px;
         left: 0px;
         -webkit-border-radius: 0px;
         -moz-border-radius: 0px;
         border-radius: 0px;
         padding: 20px;
         z-index: 10;
         opacity: 0.6;
     }
 
     .aboutcontent {
         position: relative;
         top: 0px;
         width: 90%;
         margin: auto;
         height: auto;
         display: block;
         overflow: hidden;
     }
 
     .aboutpagetext p, h3 {
         text-align: center;
     }
 
     .aboutimagediv {
         width: 300px;
         text-align: center;
         margin: auto;
     }
 
     h3 {
         font-size: 26px;
     }
 
     .loginintrotextblockinside {
         width: 90%;
         margin: auto;
         padding: 20px;
         font-size: 22px;
         color: #bdc3c7;
     }
 
     .loginbox {
         position: relative;
         width: 90%;
         height: auto;
         bottom: 0px;
         margin: 10px auto;
         margin-bottom: 50px;
         padding: 0px;
         left: 0px !important;
         left: 0px;
         right: 0px;
     }
 
     .loginboxlist li:last-child {
         padding: 10px;
     }
 
     .landinglogo {
         position: relative;
         width: 100%;
         height: auto;
         max-width: 600px;
     }
 
     .largelogo {
         position: relative;
         width: 90%;
         height: 100%;
         top: 15px;
         margin: auto;
         bottom: 0px;
         left: 0px;
         padding: 10px 0px;
         margin: auto;
         bottom: 0px !important;
         cursor: pointer;
     }
 
     .loginlogo {
         width: 100%;
     }
 
     #inputregfirstname, #inputreglastname, #inputregpassword1, #inputregpassword2  {
         width: 100%;
         margin-bottom: 20px;
     }
 
     #inputreglastname, #inputregpassword2 {
         margin-bottom: 0px;
     }
 }
 
 @media (max-width: 361px) {
     .navbar-brand {
         padding: 14px 0px 10px 15px;
         -webkit-transition: 0s;
         -moz-transition: 0s;
         transition: 0s;
     }
 
     .loginintrotextblockinside {
         font-size: 16px;
     }
 
     #li-buttons {
             list-style: default;
     }
 
     #li-buttons button {
         width: 100%;
         margin-bottom: 5px;
     }
 }
 
 .invite_info_div {
     padding-bottom: 8px;
 }
 
 /* Toggle switch */
 .slider {
   position: absolute;
   cursor: pointer;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   background-color: #ccc;
   -webkit-transition: .4s;
   transition: .4s;
 }
 
 .slider:before {
   position: absolute;
   content: "";
   height: 26px;
   width: 26px;
   left: 4px;
   bottom: 4px;
   background-color: white;
   -webkit-transition: .4s;
   transition: .4s;
 }

 .top_logo {
     display: none;
 }
 
 @media print {

    img {
        page-break-before: auto;
        /* 'always,' 'avoid,' 'left,' 'inherit,' or 'right' */
        page-break-after: auto;
        /* 'always,' 'avoid,' 'left,' 'inherit,' or 'right' */
        page-break-inside: avoid;
        /* or 'auto' */
    }

    .top_logo {
        display: inline;
    }
    
     /* print styles go here */
     .gridster-item:not([id="photos"]) {
         height: auto !important;
         width: auto !important; 
         position: static !important;
         float: none !important;
     }
 
     .gridster-item[id="photos"] {
         position: static !important;
         float: none !important;
         width: auto !important; 
         height: auto !important;
 
     }
 
     #page_content {
         position: inherit !important;
     }
 
     #page_content .header .right {
         display: none !important;
     }
 
     #page_content .header .left span a {
         display: none !important;
     }
 
     #page_content .header .left span .breadcrumbarrow {
         display: none !important;
     }
     
     #page_content .header .left span[class*="active"] {
         font-size: 24pt!important;
     }
     
 
     .widget_header_buttons {
         display: none !important;
     }
 
     .action_button {
         display: none !important;
     }
 
     .feedback_button {
         display: none !important;
     }
 
     .delete-item {
        float: right;
        margin-right: 2px;
        color: #FC6A6A !important;
        padding: 2px 6px;
        text-decoration: none;
     }
 
     .widget_edit {
         display: none !important;
     }
     
 
     .squintemdate a {
         display: none !important;
     }
 
     .squintemdate span {
         display: none !important;
     }
 
     .widgetheader {
         text-decoration: underline;
         font-size: 18pt !important;
     }
 
     .gridster-item-resizable-handler {
         display: none !important;
     }
 
     li .widget div[class*="widgetcontent"] {
         padding: 0 20px 0 !important;
         margin: 0 !important;
     }
 
     .neutron_file_delete_icon {
         display: none !important;
     }
 
     .neutron_file_default_icon {
         display: none !important;
     }
 
     a[href]:after {
         display: none !important;
     }
 
     .phototile {
         min-height: 200px !important;
         min-width: 175px !important;
         max-width: 175px !important;
         margin: 0 15px 0 !important;
     }
     
     .phototileimage {
         max-height: 150px !important;
     }
 
     #main_content {
         top: 120px;
     }

     .widget {
         border: none !important;
     }

     .tab-content > .tab-pane {
        display: block!important;
    }
}

.invite_advanced div {
    width: 150px;
    float: left;
    margin-left: 30px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    font-size: 14px;
    padding-top: 4px;
}

.invite_advanced_groups div {
    width: 275px;
}

.invite_advanced label, .invite_advanced input, .invite_advanced textarea {
    margin-left: 10px;
    margin-top: 10px;
}

.invite_label {
    font-size: 16px;
}

.invite_advanced_label {
    font-size: 12px;
}

.datagroup_label {
    font-size: 16px;
}

.footer_text {
    position:absolute;
    bottom: 0px;
    left: 80px; right: 80px;
    color: #FF0000;
    padding-left: 10px;
    padding-right: 10px;
    height: 25px;
    font-weight: bold;
    font-variant:small-caps;
    font-size: 14px;
    z-index: 1025;
    border-radius: 25px;
    background-color: rgba(172,184,185, .4);
    width: -moz-fit-content;
    width: -webkit-fit-content;
    width: fit-content;
    margin: auto;
    overflow-wrap: break-word;
    text-align: center;
}

.footer_text .left {
    float: left;
}

.footer_text .right {
    float: right;
    color: #95A5A6;
    font-weight:normal;
    font-variant:normal;
    font-size: 20px;
    padding-right: 120px;
}

.required_field {
    color: red;
}

.itemlabel.redacted {
    background-color: #2980b9;
}

.itemlabel.dacted {
    background-color: #e74c3c;
}

.forminputlabel.redacted {
	color: #ecf0f1;
    background-color: #2980b9;
	display: inline-block;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	padding-bottom: 0px;
	padding-left: 10px;
	padding-right: 10px;
	margin-right: 10px;
	margin-bottom: 2px;
    width: 116px;
}

.forminputlabel.dacted {
	color: #ecf0f1;
    background-color: #e74c3c;
	display: inline-block;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	padding-bottom: 0px;
	padding-left: 10px;
	padding-right: 10px;
	margin-right: 10px;
    margin-bottom: 2px;
    width: 90px;
}

.page_status span {
    vertical-align: -webkit-baseline-middle;
}

.page_status span img {
    width: 15px;
    height: 15px
}

/* Toggle switch */
.switch {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 34px;
  float: right;
}

.switch input {
    display:none;
}

input:checked + .slider {
  background-color: #2980b9;
}

input:focus + .slider {
  box-shadow: 0 0 1px #2980b9;
}

input:checked + .slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;
}


/* Notifcation Styling */
.notification-wrapper{
    padding-top: 10px;
}

.notification-wrapper .arrow{
    margin-top: 0!important;
}
.notification-read{
    vertical-align: middle;
    width: 30px;
    border-radius: 5px;
    border: none;
    background-size: cover;
    background-image: url(../images/icon_bell_off.png);
    height: 30px;
}
.notification-unread{
    vertical-align: middle;
    width: 30px;
    border-radius: 5px;
    border: none;
    background-size: cover;
    background-image: url(../images/icon_bell_on.png);
    height: 30px;
}

.notification-popover .arrow{
    display: none;
}

.carousel-control span {
    position: absolute;
    bottom: 0;
    color: olive;
  }
  
.carousel-control.left,
.carousel-control.right {
    background: none !important;
}

.fa-angle-double-left {
    left: 5px !important;
}
#myCarousel .carousel-inner {
    margin-bottom: 0px;
}
  
#myCarousel p,
#myCarousel-2 p {
    text-align: left;
}
  
blockquote {
    background: #f9f9f9;
    border-left: 2px solid rgba(255,165,0,0.33);
}
  
.popover.bottom>.arrow:after {
    top: 3px;
}

.notification-popover{
    min-width: 375px;
}

.popover-openup {
    min-width: 630px;
}

.notification-popover .popover-content{
padding:0;
}

.notification-popover .item{
    padding:10px;
}

.notification-popover .carousel-inner > .item {
    position: relative;
    display: none;
    -webkit-transition: none;
    -moz-transition: none;
    -o-transition: none;
    transition: none;
}

.notification-popover .carousel-inner > .active{
    display: block;
}

.notification-popover .close{
    font-size: 15px;
}

.notification-popover hr{
    margin-top: 10px;
    margin-bottom: 10px;
    border: 0;
    border-top: 1px solid #000;
    opacity: .2;
}
.notification-date{
    font-size: 75%;
    opacity: .5;
}
.carousel-controls .left{
    color: #000;
    opacity: .2;
    position: absolute;
    padding: 0!important;
    bottom: 5px;
    left: 10px;
} 
.carousel-controls .right{
    color: #000;
    opacity: .2;
    position: absolute;
    padding: 0!important;
    bottom: 5px;
    right: 10px;
}
.carousel-controls{
    height: 10px;
}
.carousel-controls .left:hover{
    opacity: .5;
} 
.carousel-controls .right:hover{
   opacity: .5;
}
.notification-content{
    height: 120px;
    overflow-y: auto;
}
.notification-label{
    color: #fff;
    background-color: #f1c40f;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    font-size: 12px;
    padding: 5px;
    margin-left: 5px;
}
.notification-label img{
    height: 21px;
    padding-bottom: 2px;
    padding-right: 5px;
}
.notification-badge{
    position: absolute;
    width: 50px;
    left: 15px;
    top: 1px;
    padding-right: 25px;
    height: 50px;
    z-index: 100;
    /* margin-left: 140px; */
    /* margin-top: 40px; */
    background-image: url(../images/badge.png);
    background-repeat: no-repeat;
    background-size: 25px 25px;
    /* padding-top: 10px; */
    color: White;
    font-weight: bold;
}

.notification-list{
border-top: 2px solid #ddd;
}

.first-notification {
    border:none;
}
.ellipsis {
    text-overflow: ellipsis;
  
    /* Required for text-overflow to do anything */
    white-space: nowrap;
    overflow: hidden;
  }

.invite_block {
    display: inline;
}

.forminputlabel_invite {
    width: 120px;
    padding-right: 20px;
    vertical-align: top;
}

.invitelistitem > li {
    padding-left: 5px;
    width: 286px;
    display: inline-block;
    font-size: 14px;
    background-color: #bdc3c7;
    padding: 7px;
    margin-top: 10px;
    text-align: left;
    list-style: none;
    color: #ffffff;
    border-radius: 4px;
    border-style: solid;
    border-width: 0px;
    margin-left: 83px;
 }

.f15 {
    font-size: 15px;
}

.f14 {
    font-size: 14px;
}

.f12 {
    font-size: 12px;
}

.p10 {
    padding: 10px;
}

.m10 {
    margin: 10px;
}

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

.p20-bottom {
    padding-bottom: 20px;
}

.otp-footer {
    text-align: left;
    display: inline-block;
    float: left;
    font-size: 15px;
    max-width: 70%;
}

.otp-more {
    width: 400px;
    font-size: 12px;
}

.bottom-nag {
    z-index: 5000 !important;
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    background-color: black !important;
    color: white !important;
    height: 20vh;
    opacity: .85;
}

.bottom-login-nag {
    z-index: 5000 !important;
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    background-color: black !important;
    color: white !important;
    height: 15vh;
    opacity: .85;
}

.bottom-text-nag {
    font-size: 14px;
    max-width: 80rem !important;
    margin-left: auto !important;
    margin-right: auto !important;
    margin-top: 10px;
}

.bottom-close-nag {
    color: white !important;
    position: absolute !important;
    right: 10em !important;
    top: 2em !important;
    opacity: .9;
}

.bottom-confirm-nag {
    padding: 20px;
    text-align: center;
}

#fi-visibility #visibility div {
    width: 50%;
    display: inline-block;
}

#incidents-visibility #visibility div {
    width: 50%;
    display: inline-block;
}

.excelexporterror {
    color: #e74c3c;
    font-size: 16px
}

.excellistitem {
    padding-left: 30px;
    font-size: 16px;
}

/*Fusion app colors
-----------------------------------*/

.fusion_highlight_number {
    color: #1abc9c;
    font-size: 130%;
    font-weight: bold;
}

.fusion_highlight_number a {
    color: #1abc9c;
}
.fusion_highlight_number a:hover {
    color: #2accac;
}

.fusion_highlight_footnote {
    color: #95a5a6;
    font-size: x-small;
    font-style: italic;
}

/*Dashboard app colors
-----------------------------------*/

.dashboard_highlight_number {
    color: #1abc9c;
    font-size: 130%;
    font-weight: bold;
}

.dashboard_highlight_number a {
    color: #1abc9c;
}
.dashboard_highlight_number a:hover {
    color: #2accac;
}

.dashboard_highlight_footnote {
    color: #95a5a6;
    font-size: x-small;
    font-style: italic;
}



/* App Icons */

.app-icon {
    height: 200px;
    width: 200px;
    background-size: cover;
}


.app-icon- {
    background-image: url('images/app_icon_dashboard2.png');
}

.app-icon-assets {
    background-image: url('../images/app_icon_assets3.png');
    
}

.app-icon-assessments {
    background-image: url('../images/app_icon_assessments2.png');
}

.app-icon-incidents {
    background-image: url('../images/app_icon_incidents2.png');
}

.app-icon-fieldinterviews {
    background-image: url('../images/app_icon_fieldinterviews2.png');
}

.app-icon-fieldreports {
    background-image: url('../images/app_icon_fieldreports2.png');
}

.app-icon-map {
    background-image: url('../images/app_icon_map2.png');
}

.app-icon-threatstreams {
    background-image: url('../images/app_icon_threatstreams2.png');
}

.app-icon-dashboard {
    background-image: url('../images/app_icon_dashboard2.png');
}

.app-icon-events {
    background-image: url('../images/app_icon_events2.png');
}

.app-icon-fusion-events {
    background-image: url('../images/app_icon_processed_data2.png');
}

.app-icon-timeline {
    background-image: url('../images/app_icon_timeline.png');
}

.app-icon-models {
    background-image: url('../images/app_icon_model.png');
}

.app-icon-fusion {
    background-image: url('../images/app_icon_fusion.png');
}

.app-icon-search {
    background-image: url('../images/app_icon_search.png');
}

.dropdown-arrow-neutron {
    right: unset;
    top: 104% !important;
    left: 5px !important;
}

#address_modal {
    background-color: rgba(0,0,0,0.5);
}

#address_modal .address_select_modal {
    width: 580px;
    top: 50px;
}

#address_list {
    margin-left: 50px;
    max-width: 450px;
}

#address_list .address_list_item {
    cursor: pointer;
    margin: 5px;
    padding: 5px;
    -webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
    font-size: 90%;
}

.address-odd {
    background-color: rgba(0, 0, 0, 0.05);
}

.address-even {
    background-color: rgba(0, 0, 0, 0.10);
}

.choose_one_label {
    color: black;
}

.action_button_notification {
    width: 30px;
    height: 30x;
    cursor: pointer;
}

.mb20 {
    margin-bottom: 20px !important;
}

#form_new_notification .checkbox {
    vertical-align: middle;
}

#form_new_notification .attachDatetimePicker .form-control {
    height: 42px;
}

#form_new_notification .label-default {
    display: inline-block;
    font-size: 80% !important;
}

#form_new_notification .forminputfields {
    font-size: 80% !important;
}

.notification-popover .popover {
    background-color: #edeff1;
    max-width: unset;
}

.notification-popover .carousel {
    width: unset !important;
    top: unset !important;
}

.notification-popover .carousel-inner {
    margin-left: unset !important;
}

.line-thru {
    text-decoration: line-through;
}

.buttonMessage {
    position: absolute;
    right: -10px;
    top: 10px;
}

/* Angular login page NEW HAYSTAX CS 2023 */
#aboutlink {
    background-image: url('../../images/rocket_launch_ltgray.png');
}

.loginboxlist {
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
}

.loginbox_header {
    display: flex;
    background-color: rgba(0,0,0,0.5);
    height: 100px;
    align-self: center;
}

.loginbox_header_logo {
    margin: auto;
    background: url('images/haystax_logo_ow_reversed.png') no-repeat;
    background-size: contain;
    background-position: center;
    width: 90%;
    height: 90%;
}

.loginintrotextblock {
    background-color: #bdc3c7;
    opacity: 1.0;
    display: flex;
    flex-direction: column;
    width: 100%;
    height: auto;
    bottom: 50px;
    margin: auto;
    position: absolute;
    padding: 10px 10px;
    border-radius: 0;
}

.loginintrotextblockinside {
    width: 700px;
    font-weight: 300;
    font-size: 170%;
    padding-top: 20px;
    padding-bottom: 20px;
    text-align: center;
    align-self: center;
}

#inputusername, #inputpassword, #inputforgotusername, #inputregusername {
    border-radius: 2px;
    border-width: 0.5px;
    height: 36px;
}

#inputregfirstname, #inputreglastname, #inputregpassword1, #inputregpassword2 {
    border-radius: 2px;
    border-width: 0.5px;
    height: 36px;
    width: 171px;
}

.btn-login-landing {
    font-size: 18px;
    background-color: #616368;
    color: #ddd;
    font-weight: normal;
    padding: 10px 25px;
    line-height: 1.4;
    border-radius: 2px;
}

.btn-login-landing:hover, .btn-login-landing:active {
    background-color: #686F86;
    color: #ffffff;
}

.btn-login, .btn-sso {
    width: 100%;
    height: 36px;
    border-radius: 2px;
    padding: 0px 15px;
    background-color: #616368;
}

.btn-login:hover, .btn-login:active, .btn-login:focus, .btn-login:active:hover, .btn-sso:hover, .btn-sso:active, .btn-sso:focus, .btn-sso:active:hover {
    background-color: #6A6F80;
}


.btn-cancel, #buttonforgotsubmit, #buttonregisterregister, #buttonregisteraccept {
    height: 36px;
    border-radius: 2px;
    padding: 0px 15px;
}

a.reset-link {
    display: flex;
    font-size: small;
    align-self: end;
    cursor: pointer;
    padding-right: 10px;
}

.sso-only-box {
    position: relative;
    width: 410px;
    height: auto;
    top: 150px;
    margin: auto;
    -moz-border-radius: 4px;
    webkit-border-radius: 4px;
    border-radius: 4px;
    overflow: hidden;
    z-index: 10;
}

.sso-only-btn {
    padding-left: unset;
}

#page_login {
    min-width: 1024px;
}

.declinemsg {
    text-align: center;
}
