.entry-content .wpcf7 { max-width: 400px; width: 100%; margin-left: auto; margin-right: auto; } .entry-content .wpcf7 .better-input .wpcf7-form-control-wrap { position: relative; background-color: rgba(255, 255, 255, 0.8); border: none; border-radius: 2px; margin-bottom: 10px; display: block; margin-top: 1.75em; color: #999; backdrop-filter: blur(5px); -webkit-backdrop-filter: blur(5px); font-family: Open Sans; font-weight: 400; font-size: 16px; line-height: 1; font-style: normal; font-variant: normal; } .entry-content .wpcf7 .better-input .betterInput { color: inherit; text-transform: inherit; letter-spacing: inherit; font-family: inherit; font-weight: inherit; font-size: 1em; line-height: 1; font-style: normal; font-variant: normal; } .entry-content .wpcf7 .better-input .betterInput *::placeholder { color: rgba(0, 0, 0, 0); opacity: 0; } .entry-content .wpcf7 .better-input .betterInput *:-ms-input-placeholder { color: rgba(0, 0, 0, 0); } .entry-content .wpcf7 .better-input .betterInput *::-ms-input-placeholder { color: rgba(0, 0, 0, 0); } .entry-content .wpcf7 .better-input .betterInput *:-moz-input-placeholder { color: rgba(0, 0, 0, 0); } .entry-content .wpcf7 .better-input .betterInput *::-moz-input-placeholder { color: rgba(0, 0, 0, 0); } .entry-content .wpcf7 .better-input .betterInput * { color: inherit; border: 0; padding: 1px 2px; background: transparent; resize: none; } .entry-content .wpcf7 .better-input .betterInput label { transition: all 0.5s cubic-bezier(0.76, 0, 0.24, 1); -o-transition: all 0.5s cubic-bezier(0.76, 0, 0.24, 1); -moz-transition: all 0.5s cubic-bezier(0.76, 0, 0.24, 1); -webkit-transition: all 0.5s cubic-bezier(0.76, 0, 0.24, 1); } .entry-content .wpcf7 .better-input .betterInput input { height:unset; line-height:unset; } .entry-content .wpcf7 .better-input .betterInput input, .entry-content .wpcf7 .better-input .betterInput select, .entry-content .wpcf7 .better-input .betterInput textarea { color: inherit; font-size: inherit; font-weight: inherit; font-family: inherit; padding: 0.75em 0.5em; width: 100%; } .entry-content .wpcf7 .better-input .betterInput input:focus, .entry-content .wpcf7 .better-input .betterInput select:focus, .entry-content .wpcf7 .better-input .betterInput textarea:focus { outline: none; } .entry-content .wpcf7 .better-input .betterInput textarea { height: 100px; } .entry-content .wpcf7 .better-input .betterInput select { display: block; width: 100%; margin-bottom: 5px; } .entry-content .wpcf7 .better-input .betterInput label { position: absolute; width: 100%; top: 0; transform: translateY(1.1em) translateX(0.5em); left: 0; pointer-events: none; color: inherit; font-size: 0.9em; font-weight: inherit; font-family: inherit; } .entry-content .wpcf7 .better-input .betterInput .req { color: #ff4136; transition: 0.3s color cubic-bezier(0.76, 0, 0.24, 1); -o-transition: 0.3s color cubic-bezier(0.76, 0, 0.24, 1); -moz-transition: 0.3s color cubic-bezier(0.76, 0, 0.24, 1); -webkit-transition: 0.3s color cubic-bezier(0.76, 0, 0.24, 1); } .entry-content .wpcf7 .better-input .betterInput *:focus:not(:placeholder-shown) + label, .entry-content .wpcf7 .better-input .betterInput *:focus + label, .entry-content .wpcf7 .better-input .betterInput *:focus:not(:placeholder-shown) + label .req, .entry-content .wpcf7 .better-input .betterInput *:focus + label .req { color: #fff; } .entry-content .wpcf7 .better-input .betterInput *:not(:placeholder-shown) + label, .entry-content .wpcf7 .better-input .betterInput *:not(:placeholder-shown) + label .req { color: #ddd; } .entry-content .wpcf7 .better-input .betterInput *:focus + label, .entry-content .wpcf7 .better-input .betterInput *:not(:placeholder-shown) + label { transform: translateY(-1.3em); font-size: 0.8em; } .entry-content .wpcf7 .better-input input[type="submit"] { background-color: #001f3f; color: #fff; border: none; border-radius: 2px; display: block; margin: 25px auto 0; height: 2em; width: 10em; font-family: Open Sans; font-weight: 700; font-size: 20px; line-height: 1; font-style: normal; font-variant: normal; text-align: center; text-transform: uppercase; transition: background-color 0.3s linear, color 0.3s linear; -o-transition: background-color 0.3s linear, color 0.3s linear; -moz-transition: background-color 0.3s linear, color 0.3s linear; -webkit-transition: background-color 0.3s linear, color 0.3s linear; } .entry-content .wpcf7 .better-input input[type="submit"]:hover { background-color: #fff; color: #001f3f; } .container-custom { position: relative; padding-top: 30px; &:before { content: ' '; position: absolute; width: 130vw; background-color: #001f3f; left: -21vw; z-index: -1; height: 100%; } h2 { color: #fff; } p { color: #fff !important; } }