@charset "UTF-8";

@font-face {
    font-family: 'opensans';
    src: url('fonts/opensans/opensans-regular.eot');
    src: url('fonts/opensans/opensans-regular.eot?#iefix') format('embedded-opentype'),
         url('fonts/opensans/opensans-regular.woff2') format('woff2'),
         url('fonts/opensans/opensans-regular.woff') format('woff'),
         url('fonts/opensans/opensans-regular.ttf') format('truetype'),
         url('fonts/opensans/opensans-regular.svg#open_sansregular') format('svg');
    font-weight: normal;
    font-style: normal;
	font-display:swap;
}


@font-face {
    font-family: 'opensans';
    src: url('fonts/opensans/opensans-italic.eot');
    src: url('fonts/opensans/opensans-italic.eot?#iefix') format('embedded-opentype'),
         url('fonts/opensans/opensans-italic.woff2') format('woff2'),
         url('fonts/opensans/opensans-italic.woff') format('woff'),
         url('fonts/opensans/opensans-italic.ttf') format('truetype'),
         url('fonts/opensans/opensans-italic.svg#open_sansitalic') format('svg');
    font-weight: normal;
    font-style: italic;
	font-display:swap;
}



@font-face {
    font-family: 'opensans';
    src: url('fonts/opensans/opensans-bold.eot');
    src: url('fonts/opensans/opensans-bold.eot?#iefix') format('embedded-opentype'),
         url('fonts/opensans/opensans-bold.woff2') format('woff2'),
         url('fonts/opensans/opensans-bold.woff') format('woff'),
         url('fonts/opensans/opensans-bold.ttf') format('truetype'),
         url('fonts/opensans/opensans-bold.svg#open_sansbold') format('svg');
    font-weight: bold;
    font-style: normal;
	font-display:swap;
}



@font-face {
    font-family: 'opensans';
    src: url('fonts/opensans/opensans-bolditalic.eot');
    src: url('fonts/opensans/opensans-bolditalic.eot?#iefix') format('embedded-opentype'),
         url('fonts/opensans/opensans-bolditalic.woff2') format('woff2'),
         url('fonts/opensans/opensans-bolditalic.woff') format('woff'),
         url('fonts/opensans/opensans-bolditalic.ttf') format('truetype'),
         url('fonts/opensans/opensans-bolditalic.svg#open_sansbold_italic') format('svg');
    font-weight: bold;
    font-style: italic;
	font-display:swap;
}


@font-face {
    font-family: 'Lato';
    src: url('fonts/lato/lato-regular.eot');
    src: url('fonts/lato/lato-regular.eot?#iefix') format('embedded-opentype'),
         url('fonts/lato/lato-regular.woff2') format('woff2'),
         url('fonts/lato/lato-regular.woff') format('woff'),
         url('fonts/lato/lato-regular.ttf') format('truetype'),
         url('fonts/lato/lato-regular.svg#latoregular') format('svg');
    font-weight: normal;
    font-style: normal;
}


@font-face {
    font-family: 'Lato';
    src: url('fonts/lato/lato-italic.eot');
    src: url('fonts/lato/lato-italic.eot?#iefix') format('embedded-opentype'),
         url('fonts/lato/lato-italic.woff2') format('woff2'),
         url('fonts/lato/lato-italic.woff') format('woff'),
         url('fonts/lato/lato-italic.ttf') format('truetype'),
         url('fonts/lato/lato-italic.svg#latoitalic') format('svg');
    font-weight: normal;
    font-style: italic;
}


@font-face {
    font-family: 'Lato';
    src: url('fonts/lato/lato-bold.eot');
    src: url('fonts/lato/lato-bold.eot?#iefix') format('embedded-opentype'),
         url('fonts/lato/lato-bold.woff2') format('woff2'),
         url('fonts/lato/lato-bold.woff') format('woff'),
         url('fonts/lato/lato-bold.ttf') format('truetype'),
         url('fonts/lato/lato-bold.svg#latobold') format('svg');
    font-weight: bold;
    font-style: normal;
}


@font-face {
    font-family: 'Lato';
    src: url('fonts/lato/lato-bolditalic.eot');
    src: url('fonts/lato/lato-bolditalic.eot?#iefix') format('embedded-opentype'),
         url('fonts/lato/lato-bolditalic.woff2') format('woff2'),
         url('fonts/lato/lato-bolditalic.woff') format('woff'),
         url('fonts/lato/lato-bolditalic.ttf') format('truetype'),
         url('fonts/lato/lato-bolditalic.svg#latobold_italic') format('svg');
    font-weight: bold;
    font-style: italic;

}




html {
font-size: 62.5%;
}

body {
font-size: 18px;
font-size: 1.8rem;
font-family: opensans, Arial, sans-serif;
text-align:center;
background-color:rgb(243, 243, 243);

}

#content {
width:90%;
height:auto;
margin:1.1em auto 0px auto;
padding:1em;
padding:1em 1em 5em 1em;
border-radius:1em;
font-family: opensans, Arial, sans-serif;
background-color:rgb(243, 243, 243);
}

#content h1 {
margin-bottom:0em;
margin:0.3em 0px 0px 0px;
font-size: 3.6rem;
}

#content h1 a:link, #content h1 a:visited {
color:#00f !important;
text-decoration:none;
}

#content h1 a:hover, #content h1 a:active {
color:#f00 !important;
text-decoration:underline;
}

#content th a:link, #content th a:visited {
color:#00f !important;
text-decoration:none;
}

#content th a:hover, #content th a:active {
color:#f00 !important;
text-decoration:underline;
}



.longinput {
width:40vw;
border:2px solid #ccc;
border-radius:10px;
font-size:1em;
margin:0px auto 0px auto;
padding:0.1em 0.3em 0.1em 0.3em;
}

.loginput {
border:1px solid #ccc;
border-radius:10px;
font-size:1em;
padding:0.1em 0.3em 0.1em 0.3em;
}


/*default msbox - red...*/
#msbox {
width:60px;
height:60px;
margin:30px auto 0px auto;
background-color:#f00;
border-radius:30px;
}


/*mobile portrait - msbox green...*/
@media screen and (orientation:portrait) {

#msbox {
background-color:#0f0;
}

.longinput {
width:70vw;
}

.delnudge {
margin:-0.3em 0px 0px 0px !important;
}


}


/*mobile landscape - msbox blue...*/
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 480px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape) {

#msbox {
background-color:#00f;
}

.longinput {
width:60vw;
}

.delnudge {
margin:1em 0px 0px 0px;
}

}

.loginButton {
font-size:1em;
padding:0.2em 0.3em 0.2em 0.3em;
border-radius:0.5em;
cursor:pointer;
background-color:#fff;
box-shadow:none !important;
border:2px solid #ccc;
color:#000;
margin:0.5em 0px 0px 0px;
}

.loginButton:hover {
border:2px solid #000;
color:#00f;
}

.datepicker {
font-size:1em;
margin:-2em 0px 0px 0px;
padding:0px 0px 2em 0px;
}


.submitButton {
font-size:1em;
padding:0.2em 0.3em 0.2em 0.3em;
border-radius:0.5em;
cursor:pointer;
background-color:#fff;
box-shadow:none !important;
border:2px solid #ccc;
color:#000;
margin:0.5em 0px 0px 0px;
}

.submitButton:hover {
border:2px solid #000;
}

p {
margin:1em 0px 1.2em 0px;
}

p a:link, p a:visited {
color:#00f;
text-decoration:none;
}

p a:hover, p a:active {
color:#f00;
text-decoration:underline;
}

p.monospaced {
font-family: monospace, monospace;
background-color:#fff;
width:max-content;
max-width:75%;
margin:0px auto 0px auto;
padding:0.2em 0.4em 0.2em 0.4em;
white-space: normal;
word-break: break-word;
}

div.monospaced {
overflow:auto;
margin:0px auto 0px auto;
}

.clipboard {
width:1.4em;
height:auto;
margin:0px auto -0.3em auto;
}

.clipboard:hover {
cursor:pointer;
filter: invert(49%) sepia(43%) saturate(821%) hue-rotate(91deg) brightness(95%) contrast(91%);
}

.aboveicon {
margin:1.5em 0px 0.5em 0px;
}


.hiddeninput {
display:none;
}





.iconlinkto {
width:1.4em;
height:auto;
margin:0px auto -0.3em auto;
margin:0.3em auto 0px auto;
filter: invert(8%) sepia(100%) saturate(7433%) hue-rotate(248deg) brightness(96%) contrast(142%);
}

.iconlinkto:hover {
cursor:pointer;
filter: invert(8%) sepia(100%) saturate(7433%) hue-rotate(248deg) brightness(96%) contrast(142%);
}

.logout {
width:1.4em;
height:auto;
margin:0px auto -0.3em auto;
margin:0.3em auto 0px auto;
filter: invert(49%) sepia(43%) saturate(821%) hue-rotate(91deg) brightness(95%) contrast(91%);
}

.logout:hover {
cursor:pointer;
filter: invert(11%) sepia(93%) saturate(7470%) hue-rotate(357deg) brightness(93%) contrast(117%);
}


.goprofile {
width:1.4em;
height:auto;
margin:0px auto -0.3em auto;
margin:0.3em auto 0px auto;
filter: invert(49%) sepia(43%) saturate(821%) hue-rotate(91deg) brightness(95%) contrast(91%);
}

.goprofile:hover {
cursor:pointer;
filter: invert(8%) sepia(100%) saturate(7433%) hue-rotate(248deg) brightness(96%) contrast(142%);
}


/*************************************BEGIN: TOOLTIP STYLES*/





.icon-tooltip {
position: relative;
display: inline-block;
}

.icon-tooltip .icon-tooltiptext {
visibility: hidden;
background-color: #555;
color: #fff;
text-align: center;
border-radius: 6px;
padding: 5px;
position: absolute;
z-index: 1;
bottom: 150%;
left: 50%;
opacity: 0;
transition: opacity 0.2s;
font-size:0.7em;
}

.icon-tooltip .icon-tooltiptext::after {
content: "";
position: absolute;
top: 100%;
left: 50%;
margin-left: -5px;
border-width: 5px;
border-style: solid;
border-color: #555 transparent transparent transparent;
}

.icon-tooltip:hover .icon-tooltiptext {
visibility: visible;
opacity: 1;
}




.icon-tooltip-left {
position: relative;
display: inline-block;
}

.icon-tooltip-left .icon-tooltip-lefttext {
visibility: hidden;
background-color: #555;
color: #fff;
text-align: center;
border-radius: 6px;
padding: 5px;
position: absolute;
z-index: 1;
top: 100%;
left: 50%;
top:5px;
opacity: 0;
transition: opacity 0.2s;
font-size:0.7em;
}


.icon-tooltip-left .icon-tooltip-lefttext::after {
content: " ";
position: absolute;
top: 30%;
left: 100%;
margin-left: 0px;
border-width: 5px;
border-style: solid;
border-color: transparent transparent transparent black;
}

.icon-tooltip-left:hover .icon-tooltip-lefttext {
visibility: visible;
opacity: 1;
}

div#frontlogin {
/*display:none;*/
}


/*Touch devices only...*/
@media (hover: none) {
.icon-tooltip-left .icon-tooltip-lefttext::after {
    display:none;
  }
.icon-tooltip-left:hover .icon-tooltip-lefttext {
    display:none;
  }

div#frontlogin {
display:block;
}


#frontlogin {
width:50%;
height:auto;
margin:0px auto 0px auto;
background-color:transparent;
}

#frontlogin p {
margin:0.3em 0px 0em 0px;
}

}





.icon-tooltip-right {
position: relative;
display: inline-block;
}

.icon-tooltip-right .icon-tooltip-righttext {
visibility: hidden;
width: 70px;
background-color: #555;
color: #fff !important;
text-align: center;
border-radius: 6px;
padding: 5px;
position: absolute;
z-index: 1;
top:5px;
right: 50%;
margin-right: -100px;
opacity: 0;
transition: opacity 0.2s;
font-size:0.7em;
}

.icon-tooltip-right .icon-tooltip-righttext::after {
content: "";
position: absolute;
top: 30%;
right: 100%;
margin-right: 0px;
border-width: 5px;
border-style: solid;
border-color: #555 transparent transparent transparent;
border-color: transparent transparent black transparent;
border-color: transparent black transparent transparent;
}

.icon-tooltip-right:hover .icon-tooltip-righttext {
visibility: visible;
opacity: 1;
color: #fff !important;
}

@media (hover: none) {
.icon-tooltip-right .icon-tooltip-righttext::after {
    display:none;
  }
.icon-tooltip-right:hover .icon-tooltip-righttext {
    display:none;
  }
}





.icon-tooltip-right-login {
position: relative;
display: inline-block;
}

.icon-tooltip-right-login .icon-tooltip-right-logintext {
visibility: hidden;
width: 100px;
background-color: #555;
color: #fff;
text-align: center;
border-radius: 6px;
padding: 5px;
position: absolute;
z-index: 1;
/*bottom: 150%;*/
top:5px;
right: 50%;
margin-right: -130px;
/*margin:0px auto 0px auto;*/
opacity: 0;
transition: opacity 0.2s;
font-size:0.7em;
}

.icon-tooltip-right-login .icon-tooltip-right-logintext::after {
content: "";
position: absolute;
top: 30%;
right: 100%;
margin-right: 0px;
border-width: 5px;
border-style: solid;
border-color: #555 transparent transparent transparent;
border-color: transparent transparent black transparent;
border-color: transparent black transparent transparent;
}

.icon-tooltip-right-login:hover .icon-tooltip-right-logintext {
visibility: visible;
opacity: 1;
}


/*************************************END: TOOLTIP STYLES*/


.login-button {
background-color:#f2f2f3;
color:#000;
font-size:0.9em;
border:1px solid #000;
border-radius:0.5em;
margin:0.5em auto 0px auto;
font-size:1.2em;
padding:0.2em 0.3em 0.3em 0.3em;
}

.login-button:hover {
background-color:#fff;
color:#00f;
border:1px solid #000;
cursor:pointer;
}

.logged-in-button {
background-color:#12a915;
color:#fff;
font-size:0.9em;
border:1px solid #000;
border-radius:0.5em;
margin:0.6em auto 0px auto;
padding:0.1em 0.3em 0.2em 0.3em;
}

.logged-in-button:hover {
background-color:#fff;
color:#00f;
border:1px solid #000;
cursor:pointer;
}

/*///////////////////////////////////*/



table {
  background: white;
  border-collapse: collapse;
  margin: 1.25em 0 0;
  width: 100%;
max-width:100%;
}

table tr,
table th,
table td {
  border: none;
  border-bottom: 1px solid #e4ebeb;
  font-family: 'Lato', sans-serif;
font-size:1em;

}

table th,
table td {
  padding: 10px 12px;
  text-align: left;

}

table th {
  background: #fff;
  color: #000;
  text-transform: uppercase;
}

table tr td {
  background: #eaf3f5;
  color: #000;
}



table tr:nth-of-type(2n+2) td {
  background: #ffffff;
}

table.bt tfoot th,
table.bt tfoot td,
table.bt tbody td {
  font-size: 1em;

  padding: 0;
}

table.bt tfoot th:before,
table.bt tfoot td:before,
table.bt tbody td:before {
  background: #56a2cf;
  color: white;
  margin-right: 10px;
  padding: 2px 10px;
}

table.bt tfoot th .bt-content,
table.bt tfoot td .bt-content,
table.bt tbody td .bt-content {
  display: inline-block;
  padding: 2px 5px;
}

table.bt tfoot th:first-of-type:before,
table.bt tfoot th:first-of-type .bt-content,
table.bt tfoot td:first-of-type:before,
table.bt tfoot td:first-of-type .bt-content,
table.bt tbody td:first-of-type:before,
table.bt tbody td:first-of-type .bt-content {
  padding-top: 10px;
}

table.bt tfoot th:last-of-type:before,
table.bt tfoot th:last-of-type .bt-content,
table.bt tfoot td:last-of-type:before,
table.bt tfoot td:last-of-type .bt-content,
table.bt tbody td:last-of-type:before,
table.bt tbody td:last-of-type .bt-content {
  padding-bottom: 10px;
}

/*
 * Example 2:
 * Container breakpoint
 */
.clearfix::before,
.clearfix::after {
 content: " ";
 display: table;
}

.clearfix::after {
 clear: both;
}

.col-sm-3 {
  padding-top: 1em;
}

@media (min-width: 768px) {
  .col-sm-3,
  .col-sm-9 {
    float: left;
  }

  .col-sm-3 {
    padding-left: 2em;
    width: 25%;
  }
  .col-sm-9 {
    width: 75%;
  }
}

/*
 * Example 5:
 * Media query over js resize
 */
@media only screen and (max-width: 568px) {
  #table-no-resize thead {
    display: none;
  }

  #table-no-resize tbody td {
    border: none !important;
    display: block;
    font-size: .8125rem;
    padding: 0;
    vertical-align: top;

    /* IE 9 */
    float: left\9;
    width: 100%\9;
  }

  #table-no-resize tbody td:before {
    background: #56a2cf;
    content: attr(data-th) ": ";
    color: white;
    display: inline-block;
    font-weight: bold;
    margin-right: 10px;
    padding: 2px 10px;
    width: 6.5em;
  }

  #table-no-resize tbody td .bt-content {
    display: inline-block;
    padding: 2px 5px;
  }

  #table-no-resize tbody td:first-of-type:before,
  #table-no-resize tbody td:first-of-type .bt-content {
    padding-top: 10px;
  }

  #table-no-resize tbody td:last-of-type:before,
  #table-no-resize tbody td:last-of-type .bt-content {
    padding-bottom: 10px;
  }
}

/*
 * Example 6:
 * Two axis styling
 */
table.two-axis tr td:first-of-type {
  background: #cadde1;
}

@media only screen and (max-width: 568px) {
  table.two-axis tr td:first-of-type,
  table.two-axis tr:nth-of-type(2n+2) td:first-of-type,
  table.two-axis tr td:first-of-type:before {
    background: #3584b3;
    color: #ffffff;
  }

  table.two-axis tr td:first-of-type {
    border-bottom: 1px solid #e4ebeb;
  }

  table.two-axis tr td:first-of-type:before {
    padding-bottom: 10px;
  }
}

/*
 * Example 7:
 * Max height
 */
.bt-wrapper.active {
  margin-top: 1.5em;
}
.bt-wrapper.active table {
  margin: 0;
}


table {
  width: 100%;
}
.table {
  margin: 30px 0;
  border-collapse: collapse;
  border-spacing: 0;
  empty-cells: show;
  border: 1px solid #e0e0e0;
}
.table caption {
  color: #333;
  font-style: italic;
  font-size: 85%;
  line-height: 1;
  padding: 1em 0;
  text-align: center;
}
.table td,
.table th {
  border-left: 1px solid #e0e0e0;
  border-width: 0 0 0 1px;
  font-size: inherit;
  margin: 0;
  overflow: visible;
  padding: 0.5em 1em;
  font-weight: normal;
}
.table td:first-child,
.table th:first-child {
  border-left-width: 0;
}
.table thead,
.table tfoot {
  background-color: #f05050;
  color: #fff;
  text-align: left;
  vertical-align: bottom;
}
.table thead td,
.table tfoot td,
.table thead th,
.table tfoot th {
  border-color: #fff;
}
.table td {
  background-color: transparent;
}
.table_striped tr:nth-child(2n-1) td {
  background-color: #ececec;
}
.table_bordered td {
  border-bottom: 1px solid #e0e0e0;
}
.table_bordered tbody > tr:last-child > td,
.table_bordered thead > tr:last-child > td {
  border-bottom-width: 0;
}
.table_horizontal td,
.table_horizontal th {
  border-width: 0 0 1px 0;
  border-bottom: 1px solid #e0e0e0;
}
.table_horizontal tbody > tr:last-child > td,
.table_horizontal thead > tr:last-child > td {
  border-bottom-width: 0;
}

span.bt-content a:link, span.bt-content a:visited {
color:#00f;
text-decoration:none;
}

span.bt-content a:hover, span.bt-content a:active {
color:#f00;
text-decoration:underline;
}

.apinote {
display:inline-block;
font-size: 0.8em;
width:max-content;
background-color:#3a3a3a;
padding:0.1em 0.2em 0.1em 0.2em;
/*margin:0.4em 0px 0px 0px;*/
margin:0.3em 0px 0px 0px;
color:#fff;
border-radius:0.2em;
}


/*mobile portrait...*/
@media screen and (orientation:portrait) {

.apinote {
padding:0em 0.2em 0em 0.2em !important;
margin:-0.5em 0em 0em 0em !important;
}

}
.pushover-state-icon {
margin:0px 0px 5px 0px;
}

/* Container for the switch */
.switch {
  position: relative;
  display: inline-block;
  width: 50px;
  height: 24px;
}

/* Hide default checkbox */
.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

/* The slider background */
.slider {
  position: absolute;
  cursor: pointer;
  top: 0; left: 0; right: 0; bottom: 0;
  background-color: #ccc;
  transition: .4s;
  border-radius: 28px;
}

/* The circular knob */
.slider:before {
  position: absolute;
  content: "";
  height: 16px; width: 16px;
  left: 8px; bottom: 4px;
  background-color: white;
  transition: .4s;
  border-radius: 50%;
}

/* Toggle state: Checked colors */
input:checked + .slider {
  background-color: #06aa6d;
}

/* Move the knob on check */
input:checked + .slider:before {
  transform: translateX(20px);
}

.truncate {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100px; /* Adjust based on your column width */
word-break: break-all;
}
.expanded {
  white-space: normal;
  max-width: none;
}

.long-url-cell {
word-break: break-all;
}


.delnudge {
margin:-1em 0px 0px 0px;
}

/* Container cell needs relative positioning */
  .tooltip-cell {
    position: relative;
    cursor: help;
    max-width: 150px; /* Limits cell width */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis; /* Adds "..." to long links */
word-break: break-all;
  }

  /* The actual tooltip popup */
  .tooltip-cell:hover::after {
    content: attr(data-tooltip); /* Pulls text from the attribute */
    position: absolute;
    z-index: 10;
    bottom: 125%; /* Positions it above the cell */
    left: 50%;
    transform: translateX(-50%);
    background-color: #ccc;
    color: #000;
    padding: 8px;
    border-radius: 4px;
    font-size: 0.85em;
    white-space: normal; /* Allows text to wrap inside the tooltip */
    width: 250px; /* Tooltip width */
    box-shadow: 0 2px 10px rgba(0,0,0,0.2);
  }
