#WarningBanner { background: url('../Images/WarningBannerBk.png') repeat-x transparent; border-bottom: 2px solid #000; }
#WarningBanner div { background: url('../Images/YellowBang.gif') no-repeat transparent 0 5px; }
#WarningBanner div div { height: 44px; background: url('../Images/WarningBannerBk.png') repeat-x transparent; margin-left: 60px; font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif; font-size: 15px; padding-top: 15px; color: #fff; font-weight: bold;  }
#WarningBanner .Wrapper { position: relative; min-width: 1000px; margin: 0 auto; overflow: hidden; width: 1000px; }
#WarningBanner .CloseButton { position: absolute; right: 10px; top : 3px; font-size: 11px; margin: 0; padding: 0; font-weight: normal; }
#WarningBanner .CloseButton:hover { text-decoration: underline; cursor:pointer; }

.col-grid  > div{ display: inline-block; vertical-align: top; text-align:left; }
.col-5 { width: 5%; }
.col-10 { width: 10%; }
.col-15 { width: 15%; }
.col-20 { width: 20%; }
.col-25 { width: 25%; }
.col-30 { width: 30%; }
.col-33 { width: 33.3%; }
.col-35 { width: 35%; }
.col-40 { width: 40%; }
.col-45 { width: 45%; }
.col-50 { width: 50%; }
.col-55 { width: 55%; }
.col-60 { width: 60%; }
.col-65 { width: 65%; }
.col-70 { width: 70%; }
.col-75 { width: 75%; }
.col-80 { width: 80%; }
.col-85 { width: 85%; }
.col-90 { width: 90%; }
.col-95 { width: 95%; }
.col-100 { width: 100%; }

[data-tooltip] { position: relative; z-index: 999; cursor: pointer; }
[data-tooltip]:before,[data-tooltip]:after { display: none; pointer-events: none; }
[data-tooltip]:before { position: absolute; bottom: 100%; left: 50%; margin: 0 0 5px -80px; padding: 7px; width: 160px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; background-color: #000; background-color: hsla(0, 0%, 20%, 0.9); color: #fff; content: attr(data-tooltip); text-align: center; font-size: 14px; line-height: 1.2; }
[data-tooltip]:after { position: absolute; bottom: 100%; left: 50%; margin:0 0 0 -5px; width: 0; border: 5px solid transparent; border-top-color: hsla(0, 0%, 20%, 0.9); border-bottom: none; content: " "; font-size: 0; line-height: 0; }
[data-tooltip-location="bottom"]:before { top: 100%;  bottom: auto; left: 50%; margin-top: 5px; }
[data-tooltip-location="bottom"]:after { top: 100%;  bottom: auto; left: 50%; border: 5px solid transparent; border-bottom-color: hsla(0, 0%, 20%, 0.9); border-top: none; }
[data-tooltip-location="left"]:before { right: 100%;  left: auto;  top: 0; bottom: auto; margin: -50% 5px auto auto; }
[data-tooltip-location="left"]:after { right: 100%;  left: auto; top: 50%; bottom: auto; margin: -5px 0 0 -5px; border: 5px solid transparent; border-left-color: hsla(0, 0%, 20%, 0.9); border-right: none; }
[data-tooltip-location="right"]:before { left: 100%;  right: auto;  top: 0; bottom: auto; margin: -50% auto auto 5px; }
[data-tooltip-location="right"]:after { left: 100%;  right: auto; top: 50%; bottom: auto; margin: -5px -5px 0 0; border: 5px solid transparent; border-right-color: hsla(0, 0%, 20%, 0.9); border-left: none; }
.showToolTip:before, .showToolTip:after { display: block; }