<!--コンタクト------------------>     
   <section id="Contact">
        <h2 class="page-title">Contact</h2>
        <form action="#">
            <div>
                <label for="name">お名前</label>
                <input type="text" id="neme" name="your-name">
            </div>
    
            <div>
                <label for="email">メールアドレス</label>
                <input type="email" id="email" name="your-email">
            </div>

            <div>
                <label for="message">メッセージ</label>
                <textarea id="message" name="your-message"></textarea>
            </div>
            <input type="submit" class="button" value="送信">
        </form>
    </section>  

 

/*--コンタクト------------------*/  
form div {
  background-color: rgb(43, 144, 226);
  margin-bottom: 14px;
}
label{
  background: rgb(8, 62, 107);
  font-size: 1.125rem;
  margin-bottom: 10px;
  display: block;
}

 

/*inputタグの各属性は[]で囲んで指定*/
input[type="text"],
input[type="email"],
textarea {
  background: rgba(255,255,255,.5); /*半透明の指定*/
  border: 1px #fff solid;
  border-radius: 5px;
  padding: 10px;
  font-size: 1rem;
}

input[type="text"],
input[type="email"]
{
  width: 100%;
  max-width: 240px;
}


textarea {
width: 100%;
max-width: 480px;
height: 6rem;
}


input[type="submit"] {
  background-color: rgb(25, 211, 108);
  border: none;
  cursor: pointer;/*マウスポインターが要素の上にいるときに表示されるマウスカーソルの種類を設定*/
  line-height:1;
}

.mailbotan{
  background: rgb(139, 182, 218);
  border: 1px #0c0c0c solid;
}