.tab-content p,th,td{
    color: black;
    font-size: 105%;
}
.tab-pane p,th,td{
    color: black;
    font-size: 105%;
}
.panel-body, .panel-heading, .tab-pane{
    color: black;
    font-size: 105%;
}

.page-title-breadcrumb{
    color: black;
}

.sameheight {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}

.page-content{
    color: black;
  
}

.cert-print {
    background: white;
    color: black
}

.cert-foot {
    position:fixed;
    bottom: 0;
}
.cert-footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  /* Set the fixed height of the footer here */
  height: 60px;
  background-color: #ffffff;
   background: white;
    color: black
}

.table-test tbody tr td, .table-test tbody tr th, .table-test thead tr th {
    border: 1px solid #E0E0E0 !important;
}


.table-borderless tbody tr td, .table-borderless tbody tr th, .table-borderless thead tr th {
    border: none !important;
}

.table-border-right tbody tr td, .table-border-right tbody tr th, .table-border-right thead tr th {
     border: none  !important;
     border-width: thin !important;
     border-right: 1px solid #E0E0E0 !important;
     border-left: 1px solid #E0E0E0 !important;
}

/* SLIDE THREE */  
.slideThree {
  width: 80px;
  height: 26px;
  background: #333;
  margin: 20px auto;

  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  border-radius: 50px;
  position: relative;

  -webkit-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,0.2);
  -moz-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,0.2);
  box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,0.2);
}

.slideThree:after {
  content: 'OFF';
  font: 12px/26px Arial, sans-serif;
  color: #000;
  position: absolute;
  right: 10px;
  z-index: 0;
  font-weight: bold;
  text-shadow: 1px 1px 0px rgba(255,255,255,.15);
}

.slideThree:before {
  content: 'ON';
  font: 12px/26px Arial, sans-serif;
  color: #00bf00;
  position: absolute;
  left: 10px;
  z-index: 0;
  font-weight: bold;
}

.slideThree label {
  display: block;
  width: 34px;
  height: 20px;

  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  border-radius: 50px;

  -webkit-transition: all .4s ease;
  -moz-transition: all .4s ease;
  -o-transition: all .4s ease;
  -ms-transition: all .4s ease;
  transition: all .4s ease;
  cursor: pointer;
  position: absolute;
  top: 3px;
  left: 3px;
  z-index: 1;

  -webkit-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.3);
  -moz-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.3);
  box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.3);
  background: #fcfff4;

  background: -webkit-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
  background: -moz-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
  background: -o-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
  background: -ms-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
  background: linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfff4', endColorstr='#b3bead',GradientType=0 );
}

.slideThree input[type=checkbox]:checked + label {
  left: 43px;
}

.fine-print {
  font-size: 80%;
}

.clickable { cursor: pointer; }


/* CSS used here will be applied after bootstrap.css */
.modal-header-success {
    color:#fff;
    padding:9px 15px;
    border-bottom:1px solid #eee;
    background-color: #5cb85c;

}
.modal-header-warning {
  color:#fff;
    padding:9px 15px;
    border-bottom:1px solid #eee;
    background-color: #f0ad4e;

}
.modal-header-danger {
  color:#fff;
    padding:9px 15px;
    border-bottom:1px solid #eee;
    background-color: #d9534f;

}
.modal-header-info {
    color:#fff;
    padding:9px 15px;
    border-bottom:1px solid #eee;
    background-color: #5bc0de;

}
.modal-header-primary3 {
  color:#fff;
    padding:9px 15px;
    border-bottom:1px solid #eee;
    background-color: #428bca;

}
.modal-backdrop {
    z-index: 1020!important;
}
.ui-autocomplete {
    z-index: 5000;
}


.checkcaption {
  text-align: center;
  margin-top: 10px;
}

.check {
  width: 60px;
  height: 30px;
  border: #222 solid 2px;
  position: relative;
  margin: 10px auto;
  border-radius: 15px;
}
.check input {
  visibility: hidden;
  height: 30px;
  width: 60px;
}
.check label {
  display: block;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background-color: #e74c3c;
  cursor: pointer;
  position: absolute;
  top: 18%;
  left: 12%;
  -webkit-transition: all .3s ease;
  transition: all .3s ease;
}
.check input:checked + label {
  left: 55%;
  background-color: #7b3;
}

div#timeline {
  background-color: #6ab0de;
  margin-top: 55px;
  margin-bottom: 55px;
  height: 10px;
  width: 100%;
  position: relative;
}
div#timeline .inside {
  position: absolute;
  height: 4px;
  background-color: #fff;
  width: 0%;
  top: 3px;
  left: 0;
}
div#timeline .dot {
  z-index: 99;
  -webkit-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  position: absolute;
  top: -15px;
  text-align: center;
  cursor: pointer;
}
div#timeline .dot:nth-child(1) {
  left: 20%;
  background-color: #2c3e50;
}
div#timeline .dot:nth-child(2) {
  left: 40%;
  background-color: #e74c3c;
}
div#timeline .dot:nth-child(3) {
  left: 60%;
  background-color: #7b3;
}
div#timeline .dot:nth-child(4) {
  left: 80%;
  background-color: #20638f;
}
div#timeline .dot:hover {
  -webkit-transform: scale(1.2);
          transform: scale(1.2);
}
div#timeline .dot date {
  font-family: roboto;
  font-size: 1.5rem;
  display: block;
  position: relative;
  top: -60px;
  text-align: center;
}
div#timeline .dot span {
  display: inline-block;
  margin-top: 10px;
  width: 20px;
  height: 20px;
  background-color: #fff;
  position: relative;
  border-radius: 50%;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
}

article {
  display: none;
  position: relative;
  top: 30px;
  max-width: 960px;
  background-color: #fff;
  padding: 20px;
  margin: auto;
}
article date {
  display: block;
  text-align: right;
}
article h2 {
  font-family: merriweather, sans-serif;
  font-size: 5rem;
  padding: 10px 0;
  border-bottom: solid #111 2px;
  margin-bottom: 20px;
}
article p {
  line-height: 130%;
}

div.mask {
  display: none;
  left: 0;
  top: 0;
  position: fixed;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.7);
  z-index: 99999;
}
div.mask article {
  position: relative;
  top: -100%;
  margin-top: 50px;
  max-width: 960px;
  background-color: #fff;
  padding: 20px;
  margin: auto;
  box-shadow: 0 0 30px rgba(0, 0, 0, 0.4);
}
div.mask article date {
  display: block;
  text-align: right;
}
div.mask article h2 {
  font-family: merriweather, sans-serif;
  font-size: 5rem;
  padding: 10px 0;
  border-bottom: solid #111 2px;
  margin-bottom: 20px;
}
div.mask article p {
  line-height: 130%;
}


.timeline {
  list-style-type: none;
  display: flex;
  align-items: center;
  justify-content: center;
}

.li {
  transition: all 200ms ease-in;
}

.timestamp {
  margin-bottom: 20px;
  padding: 0px 40px;
  display: flex;
  flex-direction: column;
  align-items: center;
  font-weight: 100;
}

.status {
  padding: 0px 40px;
  display: flex;
  justify-content: center;
  border-top: 2px solid #D6DCE0;
  position: relative;
  transition: all 200ms ease-in;
}
.status h4 {
  font-weight: 600;
}
.status:before {
  content: "";
  width: 25px;
  height: 25px;
  background-color: white;
  border-radius: 25px;
  border: 1px solid #ddd;
  position: absolute;
  top: -15px;
  left: 42%;
  transition: all 200ms ease-in;
}

.li.complete .status {
  border-top: 2px solid #66DC71;
}
.li.complete .status:before {
  background-color: #66DC71;
  border: none;
  transition: all 200ms ease-in;
}
.li.complete .status h4 {
  color: #66DC71;
}

@media (min-device-width: 320px) and (max-device-width: 700px) {
  .timeline {
    list-style-type: none;
    display: block;
  }

  .li {
    transition: all 200ms ease-in;
    display: flex;
    width: inherit;
  }

  .timestamp {
    width: 100px;
  }

  .status:before {
    left: -8%;
    top: 30%;
    transition: all 200ms ease-in;
  }
}

@media (min-width: 768px){
  .seven-cols .col-md-1,
  .seven-cols .col-sm-1,
  .seven-cols .col-lg-1  {
    width: 100%;
    *width: 100%;
  }
}

@media (min-width: 992px) {
  .seven-cols .col-md-1,
  .seven-cols .col-sm-1,
  .seven-cols .col-lg-1 {
    width: 14.285714285714285714285714285714%;
    *width: 14.285714285714285714285714285714%;
  }
}

/**
 *  The following is not really needed in this case
 *  Only to demonstrate the usage of @media for large screens
 */    
@media (min-width: 1200px) {
  .seven-cols .col-md-1,
  .seven-cols .col-sm-1,
  .seven-cols .col-lg-1 {
    width: 14.285714285714285714285714285714%;
    *width: 14.285714285714285714285714285714%;
  }
}

@media print { 
    .alert-info {

  background-color: #d9edf7 !important; ;
  border-color: #d9edf7 !important; ; 
}
 .alert-danger {

  background-color: #d9534f !important; ;
  border-color: #d9534f !important; ; 
}
.alert-success {

  background-color: #dff0d8 !important; ;
  border-color: #dff0d8 !important; ; 
}
.alert-warning {

  background-color: #fcf8e3 !important; ;
  border-color: #fcf8e3 !important; ; 
}
}

.btn-white { 
  color: #000000; 
  background-color: #FFFFFF; 
  border-color: #FFFFFF; 
} 
 
.btn-white:hover, 
.btn-white:focus, 
.btn-white:active, 
.btn-white.active, 
.open .dropdown-toggle.btn-white { 
  color: #000000; 
  background-color: #FFFFFF; 
  border-color: #FFFFFF; 
} 
 
.btn-white:active, 
.btn-white.active, 
.open .dropdown-toggle.btn-white { 
  background-image: none; 
} 
 
.btn-white.disabled, 
.btn-white[disabled], 
fieldset[disabled] .btn-white, 
.btn-white.disabled:hover, 
.btn-white[disabled]:hover, 
fieldset[disabled] .btn-white:hover, 
.btn-white.disabled:focus, 
.btn-white[disabled]:focus, 
fieldset[disabled] .btn-white:focus, 
.btn-white.disabled:active, 
.btn-white[disabled]:active, 
fieldset[disabled] .btn-white:active, 
.btn-white.disabled.active, 
.btn-white[disabled].active, 
fieldset[disabled] .btn-white.active { 
  background-color: #FFFFFF; 
  border-color: #FFFFFF; 
} 
 
.btn-white .badge { 
  color: #FFFFFF; 
  background-color: #000000; 
}

.match-content { width: auto; }

.btn-primary-outline {
  background-color: transparent;
  border-color: #ccc;
}

.btn-blax { 
  color: #ffffff; 
  background-color: #000000; 
  border-color: #000000; 
} 
 
.btn-blax:hover, 
.btn-blax:focus, 
.btn-blax:active, 
.btn-blax.active, 
.open .dropdown-toggle.btn-blax { 
  color: #ffffff; 
  background-color: #000000; 
  border-color: #000000; 
} 
 
.btn-blax:active, 
.btn-blax.active, 
.open .dropdown-toggle.btn-blax { 
  background-image: none; 
} 
 
.btn-blax.disabled, 
.btn-blax[disabled], 
fieldset[disabled] .btn-blax, 
.btn-blax.disabled:hover, 
.btn-blax[disabled]:hover, 
fieldset[disabled] .btn-blax:hover, 
.btn-blax.disabled:focus, 
.btn-blax[disabled]:focus, 
fieldset[disabled] .btn-blax:focus, 
.btn-blax.disabled:active, 
.btn-blax[disabled]:active, 
fieldset[disabled] .btn-blax:active, 
.btn-blax.disabled.active, 
.btn-blax[disabled].active, 
fieldset[disabled] .btn-blax.active { 
  background-color: #000000; 
  border-color: #000000; 
} 