body {
   font-family: Helvetica, Arial, sans-serif;
   background: white;
   color: black;
   margin: 0 auto;
   text-align: center;
   font-size: 16px;
}
.title {
   font-size: 40px; 
   margin: 0;
   padding: 0;
}
.crap {
   width: 550px;
   margin: auto;
   text-align: left;
   padding-bottom: 10px;
}
.twenty {
   width: 550px;
   margin: auto;
   text-align: left;
   padding-bottom: 10px;
}

input[type=submit] {
   font-size: 20px;
   margin: 10px;
   border: 1px solid black;
   padding: 5px;
   border-radius: 5px;
}
input[type=text], textarea {
   font-size: 20px;
   margin: 10px;
   border: 1px solid black;   
   padding: 5px;
   border-radius: 5px;
   width: 600px;
}
small {
   font-size: 12px;
}
h2 {
   margin: 0;
}
@media only screen and (min-device-width : 320px) and (max-device-width: 1024px) {
    body {
        width: 100%;
        font-size: 28px;
    }
    .title {
        font-size: 48px;
    }
    input[type=submit] {
        font-size: 36px;
    }
    input[type=text], textarea {
        width: 90%;
    }
    .crap {
        width: 95%;
        font-size: 14px;
    }
    .twenty {
        width: 95%;
        font-weight: bold;
        font-size: 24px;
        text-align: center;
    }
    .twenty a {
        font-size: 28px;
    }
}