body
{

	font: 80% Arial;
	color: navy;	
	display: block;
	font-weight:bold;
}

a1 {
    letter-spacing: 5px;
    color: blue;
    text-shadow: -1px 0 yellow, 0 1px yellow, 1px 0 yellow, 0 -1px yellow;
}

.my-fluid-container {
    padding-left: 15px;
    padding-right: 15px;
    margin-left: auto;
    margin-right: auto;
    width: 98%;
}

.flex-container {
  display: flex;
  width: 75px;
  flex-wrap: nowrap;
}

.flex-container > a {
  background-color: #f1f1f1;
  width: 100%;
  margin: 1px;
  text-align: center;
  line-height: 100%;
  font-size: 12px;
}

 /* tooltip basic link styles */
  .tooltipAlpha a:link,
  .tooltipAlpha a:visited {
    position:relative;
    text-decoration:underline;
  }
  .tooltipAlpha a:hover {
    text-decoration:none; /* remove underline on tooltip text */
  }
  .tooltipAlpha a:hover:before {
    display:block;
    background:#efe;
    background:-webkit-gradient(linear, 0 0, 0 100%, from(#cfc), to(#efe));
    background:-moz-linear-gradient(#cfc, #efe);
    background:-o-linear-gradient(#cfc, #efe);
    background:linear-gradient(#cfc, #efe);
    content:attr(data-tooltip);
    position:absolute;
    color:blue;
    bottom:20px;/* ensure link is still visible under tooltip */
    right:0px;
    width:12em; /* a reasonable width to wrap the tooltip text */
    text-align:center;
    padding:4px;
    border:0px solid #9c9;
    -webkit-border-radius:6px;
    -moz-border-radius:6px;
    border-radius:6px;
  }
  .tooltipAlpha {
    position:relative;
    visibility:hidden;
  }
  .tooltipAlpha a:link,
  .tooltipAlpha a:visited {
    position:relative;
    visibility:visible;
  }
  /* styles shared by both triangles */
  .tooltipAlpha:hover:before,
  .tooltipAlpha a:hover:after {
    content:"";
    position:absolute;
    border-style:solid;
    z-index:800; /* makes arrows appear above link text */
  }

  /* outer triangle: for border */
  .tooltipAlpha:hover:before {
    visibility:visible;
    bottom:6px; /* value = border-width*3 */
    right:40px; /* horizontal position of arrow */
    border-width:16px 16px 0;
    border-color:#9c9 transparent;
  }
  /* inner triangle: for fill */
  .tooltipAlpha a:hover:after {
    bottom:9px; /* value = 3 more than border-width*3 */
    right:12px; /* 2 more than above */
    border-width:14px 14px 0;
    border-color:#efe transparent;
  }

 .divprogress {
    position: relative;
    text-align: center;
    color: white;
}
.centered {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}