*{ font-family: 'DM Sans', sans-serif; box-sizing: border-box; } body{ margin: 0; } .container-cobertura{ display: flex; flex-direction: column; align-items: center; width: 378px; height: 209px; background-color: #FFFFFF; box-shadow: 0px 0px 36px rgba(0, 0, 0, 0.28); border-radius: 20px; margin: auto; } .title-cobertura{ font-weight: 400; font-size: 22px; margin-top: 41px; margin-bottom: 23px; } .enunciado-cobertura{ font-weight: 400; font-size: 18px; margin-bottom: 15px; } .inputs-cobertura{ display: flex; flex-direction: row; } .input-postal input{ -moz-appearance: textfield; background-color: transparent; border: none; outline: none; width: 120px; height: 20px; } .input-postal input::placeholder{ font-weight: 400; font-size: 14px; color: #000000; } .input-postal input::-webkit-inner-spin-button, input::-webkit-outer-spin-button{ -webkit-appearance: none; } .input-postal{ width: 150px; height: 38px; display: flex; flex-direction: row; align-items: center; border: 0.5px solid #000000; border-radius: 10px; margin-right: 30px; } .input-postal svg{ width: 25px; height: 20px; } #btn-cobertura{ background-color: #3F00BA; font-weight: 700; font-size: 16px; color: #FFFCFC; border: none; border-radius: 10px; width: 150px; height: 38px; cursor: pointer; } @media screen and (max-width: 520px) { .container-cobertura{ width: 300px; height: 147px; } .title-cobertura{ font-size: 18px; margin-top: 23px; margin-bottom: 11.52px; } .enunciado-cobertura{ font-size: 16px; margin-bottom: 22px; } .input-postal{ margin-right: 19px; } .input-postal, #btn-cobertura{ width: 102px; height: 30px; } .input-postal input::placeholder{ font-size: 12px; } #btn-cobertura{ font-size: 12px; } .input-postal input{ width: 80px; } .input-postal svg{ width: 18px; height: 16px; } }