.mask-box{
 width: 100%;
 height: 100%;
 position: fixed;
 top: 0;
 left: 0;
 display: none;
}

.mask{
 padding: 15px;
 background-color: #ffffff;
 position: absolute;
 top: 50%;
 left: 50%;
 margin-top: -158px;
 margin-left: -151px;
 text-align: center;
 box-shadow: 0px 6px 8px rgba(205, 205, 205, 0.35);
}

.mask>div{
 text-align: left;
}

.mask>div:nth-of-type(2){
 font-size: 16px;
 color: #383838;
}

.mask>#shareqrcode{
 width: 200px;
 height: 200px;
 margin: 10px auto;
}

.mask>div:nth-of-type(3){
 font-size: 16px;
 color: #888888;
}

.close {
 width: 40px;
 height: 40px;
 text-align: center;
 position: absolute;
 top: 0;
 right: 0;
}

.close>div{
 width: 15px;
 height: 0;
 border-bottom: 1px solid #383838;
 position: relative;
 top: 20.5px;
 left: 8px;
}

.close>div:first-of-type {
 transform: rotate(45deg);
 -webkit-transform: rotate(45deg);
 -moz-transform: rotate(45deg);
}

.close>div:last-of-type {
 transform: rotate(-45deg);
 -webkit-transform: rotate(-45deg);
 -moz-transform: rotate(-45deg);
 top: 19.5px;
}