Skip to content

Instantly share code, notes, and snippets.

@psahalot
Forked from jainnidhi/form-style7.txt
Last active October 4, 2016 18:42
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save psahalot/0d2065664468dbc8d4abc68bd36913c0 to your computer and use it in GitHub Desktop.
Save psahalot/0d2065664468dbc8d4abc68bd36913c0 to your computer and use it in GitHub Desktop.
Beaver Form Style 7
.form-style-7 {
background-image: url('https://wpbeaveraddons.com/wp-content/uploads/2016/07/explore-unsplash.jpg');
background-repeat: no-repeat;
background-size: cover;
padding: 50px;
position: relative;
}
.form-style-7:before {
content: "";
display: block;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0,0,0,0.8);
}
.form-style-7 .fl-input-group {
margin-bottom: 30px;
width: 33.33%;
float: left;
padding-right: 20px;
}
.form-style-7 .fl-phone {
padding-right: 0px;
}
.form-style-7 .fl-input-group.fl-message {
width: 100%;
float: none;
padding-right: 0;
clear: both;
}
.form-style-7 .fl-input-group input,
.form-style-7 .fl-input-group textarea {
border-radius: 0;
padding: 12px 15px;
height: auto;
background: transparent;
color: #222;
border: 2px solid #fff;
font-weight: 300;
font-size: 15px;
text-transform: uppercase;
}
.form-style-7 .fl-input-group input::-webkit-input-placeholder {
color: #fff;
}
.form-style-7 .fl-input-group textarea::-webkit-input-placeholder {
color: #fff;
}
.form-style-7 .fl-input-group input:focus,
.form-style-7 .fl-input-group textarea:focus {
border: 2px solid #e66322;
background: transparent;
}
.form-style-7 .fl-button-wrap {
position: relative;
}
.form-style-7 label {
display: none;
}
@media only screen and (max-width: 768px) {
.form-style-7 .fl-input-group {
width: 100%;
float: none;
clear: both;
padding-right: 0;
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment