.page {max-width:1024px;margin:auto;position:relative;} .kws {width:100%;height:auto;margin:auto;} .ta-container {-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;} .ta-container label {font-weight:bold; text-transform:none;} .ta-container textarea {width:100%;height:200px;padding:5px;border:5px solid #0085c6;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;} .ta-container.first {margin:0 1% 0 0;} .ta-container.first, .ta-container.middle, .ta-container.last {float:left;width:18.4%;padding:0;} .ta-container.middle {margin:0 1%;} .ta-container.last {margin:0 0 0 1%;} .ex {font-size:12px;color:#666;} .keyword-list-output {text-align:left;font-size:100%;max-width:100%;margin:15px auto;padding:0;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;} .keyword-list-output textarea {width:100%;height:350px;padding:5px;border:5px solid #0085c6;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;} .keyword-list-output textarea:focus, .ta-container textarea:focus {border:4px solid #A5C7FE;} .button-container {width:100%;height:41px;overflow:hidden;margin:0;padding:0;} .button-container button {height:41px;margin:0;font-size:20px;line-height:24px;padding:0;} .button-container button#submit {width:150px;} a.keyword-list-anchor {background:blue;color:#fff;font-weight:bold;text-decoration:underline;margin:20px 0 0 0;font-size:20px;line-height:24px;padding:7px 10px;vertical-align:middle;border:silver;} .legend {list-style:none;margin:0;padding:0;} .req {color:red;} .fa-asterisk {color:red;} .fa-info {color:green;} h2 {font-size: 110%;margin-top: 5px;padding: 8px 10px;line-height: 1.1em !important;background: none repeat scroll 0% 0% #004080;color: #F8F8F8;} .form-container {max-width:1024px;margin:0 auto 20px 0;padding:0 0 20px 0;} #coding {border:5px solid #000;} #coding:focus {border:5px solid #000;} ul {margin:10px 0 20px 32px;list-style:disc;line-height:29px;} .code-snippet {max-width:1024px;text-align:center;font-size:120%;font-weight:normal;word-break:break-all;color:#000;margin:auto;padding:15px;background:lightgreen;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;} .top-bar {background:#000;} .top-bar, .oc-button {font-size:100%;color:#e5e5e5;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;margin-top:10px;padding:0 10px;height:41px;}  input[type=submit] {width:150px;height:41px;margin:10px 0 0 0;font-size:20px;line-height:24px;padding:0;} .oc-button {position:relative;background:#004080;margin-bottom:10px;} .oc-button h2 {z-index:0;line-height:2;} button, .one-more {vertical-align:middle;height:41px;cursor:pointer;z-index:1;font-size:16px;font-weight:normal;padding:0 10px;} .buttons {position:absolute;top:0;right:0;width:300px;text-align:right;} .oc {font-size:120%;line-height:28px;border:5px solid #004080;} .oc:focus {border:5px solid gray;} #reset {vertical-align:middle;height:41px;width:100px;cursor:pointer;z-index:1;font-size:16px;font-weight:normal;} .refine {text-decoration:none;} @media only screen and (max-width:680px) { .input_1 {width:100%;} .oc {font-size:110%;line-height:26px;} } @media only screen and (max-width:767px) { .ta-container.first, .ta-container.middle, .ta-container.last {float:none;width:100%;margin:15px auto;padding:0;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;} .ta-container textarea {margin:auto; text-align:left; } } @media only screen and (min-width:320px) and (max-width:480px) { .ta-container textarea {font-size:20px;height:150px;} } @media only screen and (min-width:481px) and (max-width:767px) { .ta-container textarea {height:150px;} } @media only screen and (min-width:768px) and (max-width:1024px) { .ta-container textarea {height:100px;} }