h1{font-size: 30pt; color: black;}
h3{font-size: 20pt; color: red;}

/*環境*/
.environment{
    display: flex;
    width:100%;
    padding: 10pt;
}
.environment div{
    padding: 10pt;
}
.environment form{
    margin: 10pt;
}
/*サブ環境*/
.sub-environment{
    display: flex;
}
.sub-environment label{
    margin-left: 30pt;
    width: 100%;
    font-size: 12pt;
}
/*わざ*/
@media (min-width:520pt) {
    .moves{
        display: flex;
    }
    #move1{
        width: 33%;
    }
    #move2{
        width: 33%;
    }
    #move3{
        width: 33%;
    }
}
.moves form{
    background-color: rgb(182, 255, 153);
    padding: 10pt;
    margin: 5pt;
}

/*ポケモン*/
.poke-name{
    width: 150pt;
}
#form1{
    background-color: rgb(255, 197, 149);
    padding: 10pt;
    margin: 5pt;
}
.options{
    font-size: 12pt;
}

#form2{
    background-color: rgb(142, 246, 250);
    padding: 10pt;
    margin: 5pt;
}
table{
    border: none;
    border-collapse: collapse;
    table-layout: auto;
    width: 100%;
    text-align: center;
}
@media (min-width:1000pt) {
    .pokemon{
        display: flex;
    }
    #form1{
        width: 50%;
    }
    #form2{
        width: 50%;
    }
}

/*環境のラジオボタン*/
input[type="radio"]{
    display: none;  /* ラジオボタンを非表示にする */
}
input[type="radio"]:checked + label{
    background: gray;
}
.label:hover{
    background-color: darkgrey;
}
.label{
    display: block; /*ブロックレベル要素か*/
    float:left;
    font-size: 15pt;
    width: 60pt;
    height: 25pt;
    padding: 5pt;
    text-align: center;
    margin: 0pt; /*ラベル外側の余白*/
    border: 2pt solid black; /*ラベルの境界線*/
}

/*フッター*/
footer{
    border-top: solid 1pt lightgray;
    text-align: center;
}