@import url('https://fonts.googleapis.com/css?family=Coiny|ZCOOL+QingKe+HuangYou');

body {
  background: url(back1.jpg) center center / cover no-repeat fixed;
}

#programinput {
    background: #f5f5f5;
    height: 85vh;
    padding-left: 21px;
    border-radius: 10px;
    padding-top: 7px;
}

#codeinput {
  background: #f5f5f5;
  height: 60vh;
  padding-left: 21px;
  border-radius: 10px;
  padding-top: 7px;
}

#result {
    background: #f5f5f5;
    height: 85vh;
    padding-left: 21px;
    border-radius: 10px;
    padding-top: 7px;
}

h3 {
  font-family: 'ZCOOL QingKe HuangYou', cursive;
}


textarea {
width: 100%;
height: 75vh;
}

.navbar li button {
    margin-left: 10px;
    margin-right: 10px;
}

.navbar .container {
    width: auto;
    padding: 0 0 0 12px;
}

.my-icon {
  font-size: 1.3em
}

.square_btn{
    display: inline-block;
    padding: 7px 20px;
	border-radius: 25px;
    text-decoration: none;
    color: #666;
    background-image: -webkit-linear-gradient(45deg, #FFC107 0%, #ff8b5f 100%);
    background-image: linear-gradient(45deg, #FFC107 0%, #ff8b5f 100%);
    transition: .4s;
}

.square_btn:hover {
    background-image: -webkit-linear-gradient(45deg, #FFC107 0%, #f76a35 100%);
    background-image: linear-gradient(45deg, #FFC107 0%, #f76a35 100%);
}

.button {
  margin-left: 10px;
  margin-right: 10px;
  display      : inline-block;
  border-radius: 17%;                   /* 角丸 */
  cursor       : pointer;              /* カーソル形状 */
  transition   : .3s;                  /* なめらか変化 */
}
.button:hover {
}