﻿.Hint{
position: absolute;
top: 68px;
left: -18px;
border-radius: 2px;
width: 200px;
height: 35px;
background: rgb(34, 34, 34) none repeat scroll 0% 0%;
display: none;
text-align: center;
opacity: 0.94;
}
.Hint span{
    text-align:center; font-family:"Open Sans",sans-serif; font-size:15px; font-weight:400; color:#d6d6d6; line-height:30px;
}
.NotifPanel{
   position:absolute;
   margin-top:20px;
   display:none;
   height:300px; width:280px; background:#222222; left:-40px;
   z-index:-1;
}
.pLink {
    -webkit-animation:ease-in 1s steps(1, start) 1s;
    animation:ease-in 1s steps(1, start) 1s;
    -moz-animation:ease-in 1s steps(1, start) 1s;
}
.P1{
width: 32px;
height: 32px;
position: absolute;
transform: rotate(50deg);

margin-left: 10px;
margin-top: 3px;
background:url(../images/pLink2.png) -6px -2px no-repeat;
}
.P1:hover{
background:url(../images/pLink2.png) -6px -46px no-repeat;
}
.P2{
width: 32px;
height: 32px;
position: absolute;
left: 65px;
top: 28px;
background:url(../images/pLink2.png) -7px -2px no-repeat;
}
.P2:hover{
background:url(../images/pLink2.png) -7px -46px no-repeat;
}
.P3{
width: 32px;
height: 32px;
position: absolute;
left: 120px;
top: 0px;
transform: rotate(-50deg);
background:url(../images/pLink2.png) -101px -2px  no-repeat;
}
.P3:hover{
background:url(../images/pLink2.png) -101px -46px no-repeat;
}
.NotifPan {
top: 78px;
left: 32px;
position: absolute;
display: none;
z-index:99999;
}

#logolink img{
    width: 104px; position: absolute; border-radius: 50%;z-index:999999;
    top:0px; left:60px; height:104px;
}
.beacon {
    position: absolute;
    border-radius: 50%;
    z-index: 999999999;
    -webkit-transform: translateX(-50%) translateY(-50%);
    z-index: 999999999;
    display: block !important;
left: 40px;
top: 20px;
}
.beacon:before{
position: absolute;
content: "";
left: 0px;
top: 0px;
background-color: transparent;
border-radius: 50%;
height: 70px;
width: 70px;
box-shadow: 0px 0px 12px 12px rgb(248, 186, 1);
margin-top: -4px;
margin-left: 37px;
z-index: 999999998;
  -webkit-animation:active 1.4s infinite linear;
  animation:active 1.4s infinite linear;

}

@-webkit-keyframes active{
  0%{
    -webkit-transform:scale(1.31);
    opacity:1;
  }
  60%{
    -webkit-transform:scale(1.39);
    opacity:0;
  }
  100%{
    opacity:0;
  }
}
@keyframes active{
  0%{
    transform:scale(1.31);
    opacity:1;
  }
  60%{
    transform:scale(1.39);
    opacity:0;
  }
  100%{
    opacity:0;
  }
}


.circle {
    position:relative;
    top:-2px;
}
.arc_q {
    position: absolute;
    top: -115px;
    left: -10px;
    width: 180px;
    height: 180px;
    border-radius: 50%;
    border: 38px solid;
    border-color: transparent #222 transparent transparent;
    transform: rotate(95deg);
    -webkit-transform: rotate(95deg);
    -moz-transform: rotate(95deg);
    -ms-transform: rotate(95deg);
    -o-transform: rotate(95deg);
}
.arc_cover {
    position:absolute;
    top:0;
    left:0;
    width:160px;
    height:160px;
	background-color: transparent;
}

