#wsp_background{
  z-index: 100000;
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,0.7);
}

#wsp_warning_window{
  z-index: 100010;
  position: fixed;
  left: 25%;
  top: 20%;
  width: 50%;
  height: 50%;
  background-color: white;
}

.wsp_header{
  height: 20%;
  width: 100%;
  position: absolute;
  left: 0;
  top: 0;
  float: left;

}
.wsp_body{
  height: 80%;
  width: 100%;
  position: absolute;
  top: 20%;
  left: 0;
  font-size: 2.9vh;
  line-height: 4.5vh;
  padding: 5%;
}

.wsp_button{
  height: 50px;
  width: 40%;
  right: 5%;
  bottom: 12%;
  position: absolute;
  text-align: center;
  line-height: 50px;
  font-size: 25px;
  cursor: pointer;
  font-weight: bold;
  color: white;
}

.wsp_icon{
  height: 100%;
  width: 10vh;
  position: relative;
  float: left;
  padding: 2.5vh;
}

.wsp_icon .material-icons{
  font-size: 5vh;
  color: white;
}

.wsp_title{
  height: 100%;
  font-size: 5vh;
  line-height: 10vh;
  margin-left: 30px;
  color: white;
}


@media only screen and (max-width: 1200px) {

  #wsp_warning_window{
    z-index: 100010;
    position: fixed;
    left: 5vh;
    top: 10%;
    right: 5vh;
    width: auto;
    height: 80%;
    background-color: white;
  }

  .wsp_header{
    height: 12.5%;
  }
  .wsp_body{
    height: 87.5%;
    top: 12.5%;
  }

  .wsp_button{
    width: auto;
    right: 5vw;
    left: 5vw;
    bottom: 5vw;
  }


}