.popbox {
  margin:0px auto;
  text-align:center;
  position:relative;
  z-index : 10000000;
  visibility : hidden;
}
.popboxDemo {
  margin-bottom: 10px;
  margin-top: -4px;
  text-align: right;
  position: relative;
  z-index: 10000000;
  visibility: visible;
  top: 10%;
  right: 57px;
}

.collapse {     
  position:relative;
  z-index: 1000000;
  right: 0px;
  float: right;
  width: 299px;
  margin-top: 35px;
  margin-right: 10px;
}

.collapse_info {
  display: block;
	top: 10px !important;
	left: 1px !important;
	padding: 5px !important;
}

.open {
  /* background:#DDD;
  border:solid 1px #FFF;
  border-radius:5px;
  box-shadow: 0px 0px 5px #CCC;
    background:-webkit-gradient(linear,left top,left bottom,from(#f4f4f4),to(#e8e8e8));
  background:-moz-linear-gradient(top,#f4f4f4,#e8e8e8);
  background:linear-gradient(top,#f4f4f4,#e8e8e8); */
  padding:8px;
  top: 12px;
  position: fixed;
  right: 220px;
}

.box {
  font-family: Roboto;
  display:block;
  display:none;
  background:#FFF;
  background-color: #ffffff;
  border:solid 1px #BBBBBB;
  border-radius:5px;
  box-shadow:0px 0px 15px #999;
  position:absolute;
  margin: 75px 30px 5px -180px !important;
  width:94%;
  float:right;
  box-shadow: 0 24px 24px 0 rgba(0, 0, 0, 0.24), 0 0 24px 0 rgba(0, 0, 0, 0.12);
}
  
.signoutbox {
  font-family: Roboto;
  display:block;
  background:#FFF;
  background-color: #ffffff;
  border:solid 1px #BBBBBB;
  border-radius:5px;
  box-shadow:0px 0px 15px #999;
  position:absolute;
  margin: 85px 30px 5px 19px !important;
  width:94%;
  float:right;
  box-shadow: 0 24px 24px 0 rgba(0, 0, 0, 0.24), 0 0 24px 0 rgba(0, 0, 0, 0.12);
}

.box a.close {
  color:red;
  font-size:12px;
  font-family:arial;
  text-decoration:underline;
}

.arrow {
  width: 0;height: 160px;
  overflow: hidden;
  position: absolute;
  left: 50%;
  margin-left: -27px;
  top: -170px;
  left: 300px !important;
  height: 0;
  border-left: 11px solid transparent;
  border-right: 11px solid transparent;
  border-bottom: 11px solid #FFF;
  position:absolute;
  right:18px !important;
  top:-10px;
  z-index:1001;
  left: 260px !important;
}

.arrow-border {
  width: 0;
  height: 0;
  
  position:absolute;
  top:-12px;
  z-index:1000;
}

.all_info{
  width:100%;
  float:left;
}

.info1 {
  width:30%;
  float:left;
  text-align:center;
  font-size: 60px;
  color: #000000;
}

.info2 {
  width:65%;
  float:right;
  font-size: 12px;
  white-space: nowrap;
  overflow: hidden; 
  text-overflow: ellipsis; 
  text-align:left;
  margin:10px 0px;
      
}
.info2 > div{
  white-space: nowrap; 
  overflow: hidden; 
  text-overflow: ellipsis; 
}

.but{
  /* width:90px; background-color:#EDEDED;
  color:#959696; */ 
  padding:5px; 
  /* border: #959696;
  border-radius: 3px; */
  background-color: #fff;
  cursor: pointer;
  color: rgba(0, 0, 0, 0.54);
  font-family: Roboto;
  font-size: 14px;
  font-weight: 500;
  margin-top:10px;
  background-color: #fff;
  border: 0px solid #959696;
}

.but:hover{
  /* width:90px; background-color:#7070db;
  color:#ffffff; padding:5px;border:none;
  border-radius: 3px; */
  cursor: pointer;
  color: rgba(0, 0, 0, 0.54);
  font-family: Roboto;
  font-size: 14px;
  font-weight: 500;
  margin-top:10px;
  background-color: #fff;
  border: 0px solid #959696;
}
