#wrapper {
    width: 90%;
    line-height: 150%;
    text-align: center;
}

@media screen and (max-width: 700px) {
  #wrapper {
    line-height: 300%;
    text-align: center;
  }
}

#wrapper input {
    width: 100%;
    background:#FFFFFF;
    border:0;
    padding:20px;
    border-radius:6px;
    margin-bottom:10px;
    border:1px solid #eee;
    font-size:24px;
}

@media screen and (max-width: 700px) {
  #wrapper input {
    width: 90%;
    height: 100%;
    background:#FFFFFF;
    border:0;
    padding:20px;
    border-radius:6px;
    margin-bottom:10px;
    border:1px solid #eee;
    font-size:24px;
  }
}

button {
    border: none;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    background:#f26964;
    color: #ffffff;
    font-size: 24px;
    font-weight: bold;
    cursor: pointer;
    text-shadow:1px 1px 0px rgba(0,0,0,.1);
    box-shadow:0px 3px 0px #c1524e;
    width:112%;
    padding:20px;
    margin:0;
}

@media screen and (max-width: 700px) {
  button {
    border: none;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    background:#f26964;
    color: #ffffff;
    font-weight: bold;
    text-shadow:1px 1px 0px rgba(0,0,0,.1);
    box-shadow:0px 3px 0px #c1524e;
    width:108%;
    padding:20px;
    margin:0;
  }
}

img {
   width:80%; 
   height:80%;
   padding: 0px 0px 0px 40px;
}

@media screen and (max-width: 700px) {
  img {
   width:60%;
   height:40%;
   padding: 0px 0px 0px 50px;
  }
}

h1 {
  text-align:center;
  font-size:1em;
  font-weight:700;
  color:#252525;
  margin-bottom:20px;
}

span {
  font-weight:50;
}

body{
background:#fff;
}

.all {
  background:#fff;
  border-radius:15px;
  padding:20px;
  padding-top:20px;
  height: 700px;
  width:400px;
  margin:50px auto;
  box-shadow:15px 15px 0px rgba(0,0,0,.1);
  position:fixed;right:200px;
  z-index: 2;
}

@media screen and (max-width: 700px) {
  .all {
    background:#fff;
    border-radius:15px;
    padding:5px;
    padding-top:5px;
    height: 70%;
    width:70%;
    margin:50px auto;
    position:fixed;right:15%;
    box-shadow:5px 5px 0px rgba(0,0,0,.1);
    z-index: 2;
  }
}

.home-message p {
    font-size: 32px;
    color: #ffffff;
    padding: 10px 0 20px;
    margin: 0;
    font-weight: bold;

 }

@media screen and (max-width: 700px) {
.home-message p {
    font-size: 18px;
    color: #ffffff;
    padding: 5px 0 10px;
    margin: 0;
    font-weight: bold;

 }
}

.home-text-wrapper {
    position: relative; top:50%; right:20%;
    text-align: center;
}

@media screen and (max-width: 700px) {
  .home-text-wrapper {
      position: relative; top:90%;right:0%;
      text-align: center;
  }
}

.overlay{
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    z-index: 1;
    background: url(https://dev-sales.3deer.jp/img/pattern.png) repeat center center rgba(0, 0, 0, 0.7);
}