.blob { /*! object for Pulse animation */
	background: transparent;
	border-radius: 50%;
	margin: 10px;
	height: 50px;
	width: 50px;

    box-shadow: 0 0 0 0 rgba(0,110,154, 1);
	transform: scale(1);
	animation: pulse 2s infinite;
}

.blob2 { /*! test object for Pulse animation */
	background: transparent;
	border-radius: 50%;
	margin: 10px;
	height: 30px;
	width: 30px;

    box-shadow: 0 0 0 0 rgba(0,110,154, 1);
	transform: scale(1);
	animation: pulse2 2s infinite;
	display: none;
}

 /*! Styling Overides for default Bootstrap Popover CSS */
.popoverPulse {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1060;
    display: none;
    max-width: 20rem!important;
    padding: 1px;
    text-align: left;
    white-space: normal;
    background-color: transparent;
    -webkit-background-clip: padding-box;
          background-clip: padding-box;
    border: 1px solid #ccc;
    border: 1px solid rgba(0, 0, 0, .2);
    border-radius: 6px;
    -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
          box-shadow: 0 5px 10px rgba(0, 0, 0, .2);

}
.popoverPulse.top {
  margin-top: -10px;
}
.popoverPulse.right {
  margin-left: 10px;
}
.popoverPulse.bottom {
  margin-top: 10px;
}
.popoverPulse.left {
  margin-left: -10px;
}
.popoverPulse-title {
    padding: 8px 14px 0 10px;
    margin: 0;
    background-color: #fffff780;
    border-bottom: 0px solid #ebebeb;
    border-radius: 5px 5px 0 0;
    text-transform: uppercase;
    font-size: 1.25rem;
    font-weight: bold;
    color: #006c9b;
    line-height: 18px;
}
.popoverPulse-content {
    padding: 5px 9px 14px;
    background-color: #ffffff80!important;
    font-size: 1.25rem;
    border-radius: 0 0 5px 5px;
}
/*
        .popoverPulse .arrow {
            display: none;
        }
*/
.popoverPulse > .arrow,
.popoverPulse > .arrow:after {
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  border-color: transparent;
  border-style: solid;
  display: none;
}
.popoverPulse > .arrow {
  border-width: 11px;
}
.popoverPulse > .arrow:after {
  content: "";
  border-width: 10px;
}
.popoverPulse.top > .arrow {
  bottom: -11px;
  left: 50%;
  margin-left: -11px;
  border-top-color: #999;
  border-top-color: rgba(0, 0, 0, .25);
  border-bottom-width: 0;
}
.popoverPulse.top > .arrow:after {
  bottom: 1px;
  margin-left: -10px;
  content: " ";
  border-top-color: #fff;
  border-bottom-width: 0;
}
.popoverPulse.right > .arrow {
  top: 50%;
  left: -11px;
  margin-top: -11px;
  border-right-color: #999;
  border-right-color: rgba(0, 0, 0, .25);
  border-left-width: 0;
}
.popoverPulse.right > .arrow:after {
  bottom: -10px;
  left: 1px;
  content: " ";
  border-right-color: #fff;
  border-left-width: 0;
}
.popoverPulse.bottom > .arrow {
  top: -11px;
  left: 50%;
  margin-left: -11px;
  border-top-width: 0;
  border-bottom-color: #999;
  border-bottom-color: rgba(0, 0, 0, .25);
}
.popoverPulse.bottom > .arrow:after {
  top: 1px;
  margin-left: -10px;
  content: " ";
  border-top-width: 0;
  border-bottom-color: #fff;
}
.popoverPulse.bottom {
    margin-top: -1.5rem !important;
    margin-left: -5rem !important;
    animation: popoverBottom linear 1s;
    animation-iteration-count: 1;
    transform-origin: 50% 50%;
}
.popoverPulse.left > .arrow {
  top: 50%;
  right: -11px;
  margin-top: -11px;
  border-right-width: 0;
  border-left-color: #999;
  border-left-color: rgba(0, 0, 0, .25);
}
.popoverPulse.left > .arrow:after {
  right: 1px;
  bottom: -10px;
  content: " ";
  border-right-width: 0;
  border-left-color: #fff;
}

 /*! animation keyframes (bottom) */
@keyframes popoverBottom{
  0% {
    opacity:0;
    transform:  translate(50px,0px)  ;
  }
  100% {
    opacity:1;
    transform:  translate(0px,0px)  ;
  }
}
.popoverPulse.top {
    margin-top: 1.5rem!important;
    margin-left: 5rem!important;
    animation: popoverTop linear 1s;
    animation-iteration-count: 1;
    transform-origin: 50% 50%;
}

/*! animation keyframes (top) */
@keyframes popoverTop{
  0% {
    opacity:0;
    transform:  translate(-50px,0px)  ;
  }
  100% {
    opacity:1;
    transform:  translate(0px,0px)  ;
  }
}

/*! Styling Overides for default Bootstrap Button CSS */
.btn-default {
    font-weight:bold;
    color: rgb(0,110,154);
    background-color: transparent;
    cursor: pointer;
    border: 2px solid rgb(0,110,154);
}
.btn-default:hover {
    color: #f00;
    background-color: #ffffff80;
    border-color: #adadad;
}
.btn-default.active, .btn-default:active, .open > .dropdown-toggle.btn-default {
    color: #fff0/*!#333*/;
    background-color: #e6e6e680;
    border-color: #adadad;
}
.btn-default.focus, .btn-default:focus {
    color: #f00;
    background-color: #e6e6e680;
    border-color: rgb(0, 110, 154);
    animation: none;
}

/*! Pulse icons */
#driver {
    position: absolute;
    top: 42.67%;
    left: 64.5%;
    z-index: 1000;
}
#mount {
    position: absolute;
    top: 13.6%;
    left: 29.9%;
    z-index: 1000;
}
#lens {
    position: absolute;
    top: 44.3%;
    left: 39.4%;
    z-index: 1000;
}
#test1 {
    position: absolute;
    top: 70%;
    left: 10%;
    z-index: 1000;
    display: none;
}
#test2 {
    position: absolute;
    top: 85%;
    left: 10%;
    z-index: 1000;
    display: none;
}

/*! Pulse icon Dashed-circle position and sizing */
#test1 img, #driver img, #mount img, #lens img {
   position: absolute;
   top: 50%;
   left: 50%;
   width: 50px;
   height: 50px;
   margin-top: -25px; /* Half the height */
   margin-left: -25px; /* Half the width */
}

/*! Pulse icon animation testing */
@keyframes pulse {
	0% {
		transform: scale(0.95);
		box-shadow: 0 0 0 0 rgba(0,110,154, 0.7);
	}

	70% {
		transform: scale(1);
		box-shadow: 0 0 0 10px rgba(0,110,154, 0);
	}

	100% {
		transform: scale(0.95);
		box-shadow: 0 0 0 0 rgba(0,110,154, 0);
	}
}

@keyframes pulse2 {
    0% {
        opacity: 0;
        transform: scale(0.5)
      }
    33% {
        opacity: 1;
        transform: scale(1)
      }
    100% {
        opacity: 0;
        transform: scale(1.5)
      }
}