.panel {
  margin-bottom: 20px;
  background-color: #fff;
  border: 1px solid transparent;
  border-radius: 4px;
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
          box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
}

.panel-heading {
  padding: 10px 15px;
  border-bottom: 1px solid transparent;
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
}

.panel-heading > div {
  display: flex;
}


.panel-footer {
  padding: 5px 5px;
  background-color: #f5f5f5;
  border-top: 1px solid #ddd;
  border-bottom-right-radius: 3px;
  border-bottom-left-radius: 3px;
}


.panel-blue {border-color: #0C2C52;}
.panel-blue .panel-heading {border-color: #0C2C52;    color: #fff;    background-color: #0C2C52;}
.panel-blue a {color: #0C2C52;}
.panel-blue a:hover {color: #0C2C52;}

.panel-green {border-color: #5cb85c;}
.panel-green .panel-heading {border-color: #5cb85c;    color: #fff;    background-color: #5cb85c;}
.panel-green a {color: #5cb85c;}
.panel-green a:hover {color: #3d8b3d;}

.panel-red {border-color: #d9534f;}
.panel-red .panel-heading {border-color: #d9534f;    color: #fff;    background-color: #d9534f;}
.panel-red a {color: #d9534f;}
.panel-red a:hover {color: #b52b27;}

.panel-yellow {border-color: #f0ad4e;}
.panel-yellow .panel-heading {border-color: #f0ad4e;    color: #fff;    background-color: #f0ad4e;}
.panel-yellow a {color: #f0ad4e;}
.panel-yellow a:hover {color: #df8a13;}

.panel-yellow {border-color: #f0ad4e;}
.panel-yellow .panel-heading {border-color: #f0ad4e;    color: #fff;    background-color: #f0ad4e;}
.panel-yellow a {color: #f0ad4e;}
.panel-yellow a:hover {color: #df8a13;}

.panel-gray {border-color: #404040;}
.panel-gray .panel-heading {border-color: #404040;    color: #fff;    background-color: #404040;}
.panel-gray a {color: #404040;}
.panel-gray a:hover {color: #AEAEAE;}


.panel-white {border-color: #eee;}
.panel-white .panel-heading {border-color: #eee;    color: #404040;    background-color: #eee;}
.panel-white a {color: #eee;}
.panel-white a:hover {color: #AEAEAE;}