Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- /********** Contact Form 7 Style *************/
- .wpcf7 input[type="text"],
- .wpcf7 input[type="email"],
- .wpcf7 textarea {
- outline:none;
- display:block;
- width:380px;
- padding:4px 8px;
- border:1px dashed #DBDBDB;
- color:#3F3F3F;
- font-family:'Droid Sans', Tahoma, Arial, Verdana sans-serif;
- font-size:14px;
- /*border-radius*/
- -webkit-border-radius:2px;
- -moz-border-radius:2px;
- border-radius:2px;
- /*transition*/
- -webkit-transition:background 0.2s linear, box-shadow 0.6s linear;
- -moz-transition:background 0.2s linear, box-shadow 0.6s linear;
- -o-transition:background 0.2s linear, box-shadow 0.6s linear;
- transition:background 0.2s linear, box-shadow 0.6s linear;
- }
- .wpcf7 input[type="submit"],
- .wpcf7 input[type="button"] {
- background-color:#725f4c;
- width:100%;
- text-align:center;
- text-transform:uppercase;
- }
- div#wpcf7-f201-p203-o1{
- background-color: #fbefde;
- border: 1px solid #f28f27;
- padding:20px;
- }
- #wpcf7-f201-p203-o1 input[type="text"],
- #wpcf7-f201-p203-o1 input[type="email"],
- #wpcf7-f201-p203-o1 textarea {
- background:#725f4c;
- color:#FFF;
- font-family:lora, "Open Sans", sans-serif;
- font-style:italic;
- }
- #wpcf7-f201-p203-o1 input[type="submit"],
- #wpcf7-f201-p203-o1 input[type="button"] {
- background-color:#725f4c;
- width:100%;
- text-align:center;
- text-transform:uppercase;
- }
- /* Here comes to good stuff : content styling */
- div.wpcf7 {
- position: relative;
- width: 440px;
- z-index: 100;
- padding: 30px !important;
- border: 1px solid #383838;
- background: #D1D1D1;
- background: -moz-repeating-linear-gradient(-45deg, #EFC1CB, #EFC1CB 30px, #F2F2F2 30px, #F2F2F2 40px, #C2E8F5 40px, #C2E8F5 70px, #F2F2F2 70px, #F2F2F2 80px);
- background: -webkit-repeating-linear-gradient(-45deg, #EFC1CB, #EFC1CB 30px, #F2F2F2 30px, #F2F2F2 40px, #C2E8F5 40px, #C2E8F5 70px, #F2F2F2 70px, #F2F2F2 80px);
- background: -o-repeating-linear-gradient(-45deg, #EFC1CB, #EFC1CB 30px, #F2F2F2 30px, #F2F2F2 40px, #C2E8F5 40px, #C2E8F5 70px, #F2F2F2 70px, #F2F2F2 80px);
- background: repeating-linear-gradient(-45deg, #EFC1CB, #EFC1CB 30px, #F2F2F2 30px, #F2F2F2 40px, #C2E8F5 40px, #C2E8F5 70px, #F2F2F2 70px, #F2F2F2 80px);
- -webkit-border-radius: 8px;
- -moz-border-radius: 8px;
- border-radius: 8px;
- -webkit-box-shadow: 0px 1px 6px #3F3F3F;
- -moz-box-shadow: 0px 1px 6px #3F3F3F;
- box-shadow: 0px 1px 6px #3F3F3F;
- }
- /** my "fake" background that will hover the stripes **/
- div.wpcf7:after {
- background:#F9F9F9;
- margin:10px;
- position: absolute;
- content :" ";
- bottom: 0;
- left: 0;
- right: 0;
- top: 0;
- z-index: -1;
- border:1px #E5E5E5 solid;
- -webkit-border-radius:8px;
- -moz-border-radius:8px;
- border-radius:8px;
- }
- /*** form styling **/
- /** Styling the send button **/
- input[type=submit] {
- cursor:pointer;
- background:none;
- border:none;
- font-family:'Alice', serif;
- color:#767676;
- font-size:18px;
- padding:10px 4px;
- border:1px solid #E0E0E0;
- text-shadow: 0px 1px 1px #E8E8E8;
- background: rgb(247, 247, 247);
- background: -moz-linear-gradient(top, rgba(247, 247, 247, 1) 1%, rgba(242, 242, 242, 1) 100%);
- background: -webkit-gradient(linear, left top, left bottom, color-stop(1%, rgba(247, 247, 247, 1)), color-stop(100%, rgba(242, 242, 242, 1)));
- background: -webkit-linear-gradient(top, rgba(247, 247, 247, 1) 1%, rgba(242, 242, 242, 1) 100%);
- background: -o-linear-gradient(top, rgba(247, 247, 247, 1) 1%, rgba(242, 242, 242, 1) 100%);
- background: -ms-linear-gradient(top, rgba(247, 247, 247, 1) 1%, rgba(242, 242, 242, 1) 100%);
- background: linear-gradient(top, rgba(247, 247, 247, 1) 1%, rgba(242, 242, 242, 1) 100%);
- -webkit-border-radius:5px;
- -moz-border-radius:5px;
- border-radius:5px;
- -webkit-box-shadow:0px 1px 1px #FFF inset, 0 0 0px 5px #EAEAEA;
- -moz-box-shadow:0px 1px 1px #FFF inset, 0 0 0px 5px #EAEAEA;
- box-shadow:0px 1px 1px #FFF inset, 0 0 0px 5px #EAEAEA;
- -webkit-transition:all 0.2s linear;
- -moz-transition:all 0.2s linear;
- -o-transition:all 0.2s linear;
- transition:all 0.2s linear;
- }
- input[type=submit]:hover {
- color:#686868;
- border-color: #CECECE;
- background: rgb(244, 244, 244);
- background: -moz-linear-gradient(top, rgba(244, 244, 244, 1) 0%, rgba(242, 242, 242, 1) 100%);
- background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(244, 244, 244, 1)), color-stop(100%, rgba(242, 242, 242, 1)));
- background: -webkit-linear-gradient(top, rgba(244, 244, 244, 1) 0%, rgba(242, 242, 242, 1) 100%);
- background: -o-linear-gradient(top, rgba(244, 244, 244, 1) 0%, rgba(242, 242, 242, 1) 100%);
- background: -ms-linear-gradient(top, rgba(244, 244, 244, 1) 0%, rgba(242, 242, 242, 1) 100%);
- background: linear-gradient(top, rgba(244, 244, 244, 1) 0%, rgba(242, 242, 242, 1) 100%);
- -webkit-box-shadow:0px 1px 1px #FFF inset, 0 0 0px 5px #E0E0E0;
- -moz-box-shadow:0px 1px 1px #FFF inset, 0 0 0px 5px #E0E0E0;
- box-shadow:0px 1px 1px #FFF inset, 0 0 0px 5px #E0E0E0;
- }
- input[type=submit]:active, input[type=submit]:focus {
- position:relative;
- top:1px;
- color:#515151;
- background: rgb(234, 234, 234);
- background: -moz-linear-gradient(top, rgba(234, 234, 234, 1) 0%, rgba(242, 242, 242, 1) 100%);
- background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(234, 234, 234, 1)), color-stop(100%, rgba(242, 242, 242, 1)));
- background: -webkit-linear-gradient(top, rgba(234, 234, 234, 1) 0%, rgba(242, 242, 242, 1) 100%);
- background: -o-linear-gradient(top, rgba(234, 234, 234, 1) 0%, rgba(242, 242, 242, 1) 100%);
- background: -ms-linear-gradient(top, rgba(234, 234, 234, 1) 0%, rgba(242, 242, 242, 1) 100%);
- background: linear-gradient(top, rgba(234, 234, 234, 1) 0%, rgba(242, 242, 242, 1) 100%);
- -webkit-box-shadow:0px -1px 1px #FFF inset, 0 0 0px 5px #E0E0E0;
- -moz-box-shadow:0px -1px 1px #FFF inset, 0 0 0px 5px #E0E0E0;
- box-shadow:0px -1px 1px #FFF inset, 0 0 0px 5px #E0E0E0;
- }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement