/*
 * these are korteweb enhancements to standard ACE stylesheet
 */


/* remove printed link url for links (bootstrap adds this by default */
@media print {
  a[href]:after {
    content: "";
  }
}
.badge-success_dnk { background:#669966 !important; color:white !important; }
.badge-info_dnk { background:#998067 !important; color:white; }
.badge-warning_dnk { background:#663300 !important; color:white !important; }
.badge-danger_dnk { background:#f8a75d !important; color:white; }
.badge-deeporange_dnk { background:#ff8c00 !important; color:white; } 
.badge-notice_dnk { background:#ffffc0 !important; color:black; }
.badge-yikes_dnk { background:#dc2a02 !important; color:white !important; }
.badge-male_dnk { background:#5899E9 !important; color:white !important; }
.badge-female_dnk { background:#FFA7B7 !important; color:white !important; }
.timeline-avatar-dnk { width:60px !important; max-width: 60px !important; height:60px; margin-right:8px; float:right; }
.timeline-initials-dnk { width:60px !important; max-width: 60px !important; height:60px; margin-right:8px; float:right; font-weight:bold; padding:10px 2px 0px 2px; color:white; margin-right:8px; }
.btn-separated { margin-right:4px; margin-bottom:4px; }
.label-separated { margin-right:4px; margin-bottom:4px; }
.btn-indented { margin-left:18px; margin-bottom:8px; }

td.warnred { background:#ff80ab; }
td.warngreen { background:#1de9b6; }

// this from https://davidwalsh.name/css-vertical-text
.vertical-text {
  -ms-transform: rotate(270deg);
  -moz-transform: rotate(270deg);
  -webkit-transform: rotate(270deg);
  transform: rotate(270deg);

  -ms-transform-origin: left top 0;
  -moz-transform-origin: left top 0;
  -webkit-transform-origin: left top 0;
  transform-origin: left top 0;

  float: left;
  background: #ffffc0; color:red;
}

/* similar to standard alerts, but louder.  apply to any div */
alert_dnk_orange { border: 1px solid #dc2a02; background: #dc2a02; color: white; padding: 12px; margin-bottom: 12px; font-size: 1.1em; }

/* class printButNoXS shows on printer, but is hidden on screen XS */
/* needed because chrome reports 555px width for printer */
@media print {
   div.printButNoXS {
      display:block !important;
   }
   th.printButNoXS,
   td.printButNoXS {
      display: table-cell !important;
   }
} 
@media screen {
   .printButNoXS {
      display:none !important;
   }
   th.printButNoXS,
   td.printButNoXS {
   display: none !important;
   }
}
@media screen and (min-width: 768px) {
   .printButNoXS {
      display:block !important;
   }
   th.printButNoXS,
   td.printButNoXS {
   display: table-cell !important;
   }
}
/* hide dataTables search box on printer */
@media print {
   .dataTables_filter, .dataTables_info { display: none; }
} 

/* 
 * enhanced bootstrap panels with "poppier" colors  
 * note that standard bootstrap panels (including panel-primary) still work
 */

/* this is the same as material green darken-3 */
.panel-dnk-success {
  border-color: #2e7d32;
}
.panel-dnk-success > .panel-heading {
  color: white;
  background-color: #2e7d32;
  border-color: #2e7d32;
}
.panel-dnk-success > .panel-heading .badge {
  color: white;
  background-color: #2e7d32;
}

/* this is the same as material blue lighten-2 */
.panel-dnk-info {
  border-color: #64b5f6;
}
.panel-dnk-info > .panel-heading {
  color: white;
  background-color: #64b5f6;
  border-color: #64b5f6;
}
.panel-dnk-info > .panel-heading .badge {
  color: white;
  background-color: #64b5f6;
}

/* this is the same as material deep-orange lighten-1 */
.panel-dnk-warning {  
  border-color: #ff7043;
}
.panel-dnk-warning > .panel-heading {
  color: white;
  background-color: #ff7043;
  border-color: #ff7043;
}
.panel-dnk-warning > .panel-heading .badge {
  color: white;
  background-color: #ff7043;
}

/* this is the same as material red darken-4 */
.panel-dnk-danger {
  border-color: #b71c1c;
}
.panel-dnk-danger > .panel-heading {
  color: white;
  background-color: #b71c1c;
  border-color: #b71c1c;
}
.panel-dnk-danger > .panel-heading .badge {
  color: white;
  background-color: #b71c1c;
}

/* this is the same as material teal lighten-1 */
.panel-dnk-teal {
  border-color: #26a69a;
}
.panel-dnk-teal > .panel-heading {
  color: white;
  background-color: #26a69a;
  border-color: #26a69a;
}
.panel-dnk-teal > .panel-heading .badge {
  color: white;
  background-color: #26a69a;
}

/* this is the same as material  purple lighten-1 */
.panel-dnk-purple {
  border-color: #7e57c2;
}
.panel-dnk-purple > .panel-heading {
  color: white;
  background-color: #7e57c2;
  border-color: #7e57c2;
}
.panel-dnk-purple > .panel-heading .badge {
  color: white;
  background-color: #7e57c2;
}

/* this is the same as material  brown lighten-2 */
.panel-dnk-brown {
  border-color: #a1887f;
}
.panel-dnk-brown > .panel-heading {
  color: white;
  background-color: #a1887f;
  border-color: #a1887f;
}
.panel-dnk-brown > .panel-heading .badge {
  color: white;
  background-color: #a1887f;
}

/* 
 * big (0.75in) circular badges 
 */
.circleBadge {
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    width: 84px;
    padding: 8px;
    margin: auto;
    position: relative;
}
.circleBadgeRed {
    border: 2px solid red;
    background: red;
    color: white;
}
.circleBadgeGreen {
    border: 2px solid green;
    background: green;
    color: white;
}
.circleBadgeBlue {
    border: 2px solid blue;
    background: blue;
    color: white;
}
.circleBadgeOrange {
    border: 2px solid DarkOrange;
    background: DarkOrange;
    color: white;
}
.circleBadgePurple {
    border: 2px solid Purple;
    background: Purple;
    color: white;
}
.circleBadge249a {
    border: 2px solid #21b6a8;
    background: #21b6a8;
    color: white;
}
.circleBadge249b {
    border: 2px solid #177F75;
    background: #177F75;
    color: white;
}
.circleBadge249c {
    border: 2px solid #B6212D;
    background: #B6212D;
    color: white;
}
.circleBadge249d {
    border: 2px solid #7F171F;
    background: #7F171F;
    color: white;
}
.circleBadge249e {
    border: 2px solid #B67721;
    background: #B67721;
    color: white;
}
.circleBadge249f {
    border: 2px solid #7F5417;
    background: #7F5417;
    color: white;
}
.circleBadge178a {
    border: 2px solid #EF597B;
    background: #EF597B;
    color: white;
}
.circleBadge178b {
    border: 2px solid #FF6D31;
    background: #FF6D31;
    color: white;
}
.circleBadge178c {
    border: 2px solid #73B66B;
    background: #73B66B;
    color: white;
}
.circleBadge178d {
    border: 2px solid #FFCB18;
    background: #FFCB18;
    color: white;
}
.circleBadge178e {
    border: 2px solid #29A2C6;
    background: #29A2C6;
    color: white;
}
.circleBadge .height_fix {
    margin-top: 100%;
}
.circleBadge .thenumber {
    position: absolute;
    left: 0;
    top: 30%;
    height: 100%;
    width: 100%;
    text-align: center;
    font-size: 32px;
    font-weight: bold;
    margin-top: -16px; /* Note, this must be half the font size */
}
.circleBadge .reducednumber {
    position: absolute;
    left: 0;
    top: 30%;
    height: 100%;
    width: 100%;
    text-align: center;
    font-size: 26px;
    font-weight: bold;
    margin-top: -13px; /* Note, this must be half the font size */
}
.circleBadge .thelabel {
    position: absolute;
    left: 0;
    top: 65%;
    height: 100%;
    width: 100%;
    text-align: center;
    font-size: 12px;
    font-weight: bold;
    margin-top: -6px; /* Note, this must be half the font size */
}
.circleBadge .thelabelsmaller {
    position: absolute;
    left: 0;
    top: 65%;
    height: 100%;
    width: 100%;
    text-align: center;
    font-size: 10px;
    font-weight: bold;
    margin-top: -5px; /* Note, this must be half the font size */
}
.circleBadge .thelabel_line1 {
    position: absolute;
    left: 0;
    top: 60%;
    height: 100%;
    width: 100%;
    text-align: center;
    font-size: 12px;
    font-weight: bold;
    margin-top: -6px; /* Note, this must be half the font size */
}
.circleBadge .thelabel_line2 {
    position: absolute;
    left: 0;
    top: 80%;
    height: 100%;
    width: 100%;
    text-align: center;
    font-size: 12px;
    font-weight: bold;
    margin-top: -6px; /* Note, this must be half the font size */
}


.circleBadgeCompLogo {
    -webkit-border-radius: 20%;
    -moz-border-radius: 20%;
    width:100%;
    border-radius: 20%;
    padding: 8px;
    margin: auto;
    position: relative;
}
.circleBadgeCompLogo .height_fix {
    margin-top: 100%;
}





.circleBadge .oneTextLine {
    position: absolute;
    left: 0;
    top: 40%;
    height: 100%;
    width: 100%;
    text-align: center;
    font-size: 24px;
    font-weight: bold;
    margin-top: -12px; /* Note, this must be half the font size */
}
.circleBadge .TextLine1 {
    position: absolute;
    left: 0;
    top: 32%;
    height: 100%;
    width: 100%;
    text-align: center;
    font-size: 16px;
    font-weight: bold;
    margin-top: -8px; /* Note, this must be half the font size */
}
.circleBadge .TextLine2 {
    position: absolute;
    left: 0;
    top: 59%;
    height: 100%;
    width: 100%;
    text-align: center;
    font-size: 16px;
    font-weight: bold;
    margin-top: -8px; /* Note, this must be half the font size */
}

/*
 * callouts have thickish bar on left to highlight
 * see for example http://cpratt.co/twitter-bootstrap-callout-css-styles/
 * and a set of sample css at: https://codepen.io/chrisdpratt/pen/IAymB
 * i modified this to NOT have top, right, bottom borders by default,
 *     but can add them by adding class bs-callout-bordered
 */

.bs-callout-bordered {
    border: 1px solid #eee;
    border-radius: 3px;
}

.bs-callout {
    padding: 6px 6px 8px 10px;
    margin: 12px 0;
    border-left-width: 5px;
    border-left-color: #eee;
    border-left-style: solid;
}
.bs-callout h4 {
    margin-top: 0;
    margin-bottom: 5px;
}
.bs-callout p:last-child {
    margin-bottom: 0;
}
.bs-callout code {
    border-radius: 3px;
}
.bs-callout+.bs-callout {
    margin-top: -5px;
}
.bs-callout-default {
    border-left-color: #777;
}
.bs-callout-default h4 {
    color: #777;
}
.bs-callout-primary {
    border-left-color: #428bca;
}
.bs-callout-primary h4 {
    color: #428bca;
}
.bs-callout-success {
    border-left-color: #5cb85c;
}
.bs-callout-success h4 {
    color: #5cb85c;
}
.bs-callout-danger {
    border-left-color: #d9534f;
}
.bs-callout-danger h4 {
    color: #d9534f;
}
.bs-callout-warning {
    border-left-color: #f0ad4e;
}
.bs-callout-warning h4 {
    color: #f0ad4e;
}
.bs-callout-info {
    border-left-color: #5bc0de;
}
.bs-callout-info h4 {
    color: #5bc0de;
}

/*
 * simple label and formfield pairs for login forms and small forms
 */
div.f_row {
   /* nothing special */
} 
div.f_row span.help { font-size: 0.8em; color:red; }
 
div.f_label {
    display:block;
    font-weight:bold;
    text-align:left;
    float: left;
    width: 100px;
    padding-left: 8px;
}

div.f_field {
   display:block;
   margin-left: 100px;
    /* float: left; */
   padding: 0px;
   min-height: 1em;
}