@import url(https://fonts.googleapis.com/css?family=Roboto:400,300,600,400italic); * { margin: 0; padding: 0; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -webkit-font-smoothing: antialiased; -moz-font-smoothing: antialiased; -o-font-smoothing: antialiased; font-smoothing: antialiased; text-rendering: optimizeLegibility; } body { font-family: "Roboto", Helvetica, Arial, sans-serif; font-weight: 100; font-size: 12px; line-height: 30px; color: #777; background: #939598; } .container { max-width: 700px; width: 100%; margin: 0 auto; position: relative; margin-top: 30px; } .container_index { max-width: 500px; width: 100%; margin: 0 auto; position: relative; margin-top: 30px; } #td_absage { font-size: 17px; } .artikel { width: 180px; } .einheit { width: 50px; } .menge { width: 20px; } .ep { width: 80px; } .gp { width: 80px; } .action { width: 150px; } #new_item { max-width: 220px; } #new_amount { width: 60px; height: 45px; border: 1px solid silver; font: 400 22px/24px "Roboto", Helvetica, Arial, sans-serif; text-align: center; } .edit_amount { width: 100px; height: 45px; border: 1px solid silver; font: 400 22px/24px "Roboto", Helvetica, Arial, sans-serif; text-align: center; } @media only screen and (max-width: 1000px) { .container { max-width: 100%; width: 100%; margin: 0 auto; position: relative; margin-top: 100px; } .container_index { max-width: 50%; width: 100%; margin: 0 auto; position: relative; margin-top: 100px; } #td_absage { font-size: 19px; } .artikel { width: 240px; } .einheit { width: 60px; } .menge { width: 90px; } .ep { width: 120px; } .gp { width: 120px; } .action { width: 230px; } #new_amount { width: 80px; height: 55px; border: 1px solid silver; font: 400 22px/24px "Roboto", Helvetica, Arial, sans-serif; } .edit_amount { width: 100px; height: 55px; border: 1px solid silver; font: 400 22px/24px "Roboto", Helvetica, Arial, sans-serif; } } #contact input[type="text"], #contact input[type="email"], #contact input[type="tel"], #contact input[type="url"], #contact input[type="password"], #contact select[type="verein"], #contact textarea, #contact button[type="submit"] { font: 400 22px/24px "Roboto", Helvetica, Arial, sans-serif; } #contact select[type="position"] { font: 400 22px/24px "Roboto", Helvetica, Arial, sans-serif; } @media only screen and (max-width: 1000px) { #contact button[type="submit"] { font: 400 28px/28px "Roboto", Helvetica, Arial, sans-serif; } #contact select[type="position"] { font: 400 28px/28px "Roboto", Helvetica, Arial, sans-serif; } } #contact { background: #F9F9F9; padding: 25px; margin: 0 0; box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.2), 0 5px 5px 0 rgba(0, 0, 0, 0.24); font-size: 22px; } #contact h3 { display: block; font-size: 30px; font-weight: 300; margin-bottom: 10px; text-align: center; } #contact h4 { margin: 5px 0 15px; display: block; font-size: 16px; font-weight: 400; text-align: center; } fieldset { border: medium none !important; margin: 0 0 10px; min-width: 100%; padding: 0; width: 100%; } #bestellung input[type="text"] { width: 100%; border: 1px solid #ccc; background: #FFF; margin: 0 0 5px; padding: 10px; } @media only screen and (max-width: 1000px) { #bestellung th, td { font-size: 26px; } } #contact input[type="text"], #contact input[type="email"], #contact input[type="tel"], #contact input[type="url"], #contact input[type="password"], #contact select[type="verein"], #contact select[type="position"], #contact textarea { width: 100%; border: 1px solid #ccc; background: #FFF; margin: 0 0 5px; padding: 10px; } #contact input[type="text"]:hover, #contact input[type="email"]:hover, #contact input[type="tel"]:hover, #contact input[type="url"]:hover, #contact input[type="password"]:hover, #contact select[type="verein"]:hover, #contact select[type="position"]:hover, #contact textarea:hover { -webkit-transition: border-color 0.3s ease-in-out; -moz-transition: border-color 0.3s ease-in-out; transition: border-color 0.3s ease-in-out; border: 1px solid #aaa; } #contact textarea { height: 100px; max-width: 100%; resize: none; } #contact button[type="submit"] { cursor: pointer; width: 100%; border: none; background: #294a8b; color: #FFF; margin: 0 0 5px; padding: 10px; font-size: 15px; } @media only screen and (max-width: 1000px) { #contact button[type="submit"] { font: 400 28px/28px "Roboto", Helvetica, Arial, sans-serif; } } #contact button[type="submit"]:hover { background: #2D2D50; -webkit-transition: background 0.3s ease-in-out; -moz-transition: background 0.3s ease-in-out; transition: background-color 0.3s ease-in-out; } #contact button[type="submit"]:active { box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.5); } .copyright { text-align: center; } #contact input:focus, #contact textarea:focus { outline: 0; border: 1px solid #aaa; } #bestellung th, td { padding: 10px; } ::-webkit-input-placeholder { color: #888; } :-moz-placeholder { color: #888; } ::-moz-placeholder { color: #888; } :-ms-input-placeholder { color: #888; } .del_button { background-color: red !important; }