File: //home/madepabj/gamepointpk.com/wp-content/themes/groovy/assets/scss/base/_forms.scss
/* @group Forms */
input[type="text"],
input[type="password"],
input[type="email"],
input[type="tel"],
input[type="url"],
input[type="search"],
textarea,
select,
.inputbox{
display: block;
background: $input-bg-color;
border: 1px solid transparent;
color: $text-color;
font-size: 14px;
font-family: $title-font-family;
line-height: 1.8;
letter-spacing: 0.25px;
padding: 15px 25px;
height: 45px;
width: 100%;
margin-bottom: 20px;
box-sizing: border-box;
outline: 0;
border: 1px solid $border-color;
border-radius: 5px;
@include transition;
@include placeholder{
color: $text-color;
};
&:focus{
box-shadow: 0px 0px 0px 2px $secondary-color;
}
}
.inputbox{
&.rounded{
border-radius: $large-border-radius;
}
&.large{
height: 60px;
padding: 15px 45px;
font-size: 15px;
letter-spacing: 0.5px;
}
}
textarea{
width: 100%;
height: 170px;
resize: none;
padding-top: 25px;
padding-bottom: 25px;
}
input[type="submit"], button[type="submit"]{
@include button;
font-family: $title-font-family;
font-size: 18px;
padding: 12px 35px;
font-weight: 600;
@include transition(300ms, 'bezier');
}
select{
max-width: 100%;
height: auto;
padding-right: 25px;
background: $input-bg-color url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAUBAMAAABohZD3AAAAA3NCSVQICAjb4U/gAAAAD1BMVEX///8AAAAAAAAAAAAAAABRO2rwAAAABXRSTlMAESIzRJTdRHwAAAAJcEhZcwAACxIAAAsSAdLdfvwAAAAcdEVYdFNvZnR3YXJlAEFkb2JlIEZpcmV3b3JrcyBDUzbovLKMAAAAY0lEQVQYlVXOyRGAIBBE0QYNgIMBWJYBcDAAFvOPSYRZ5zL1Tv3xvPY6dueC4JyA27AB2IzzMIx/4hDW6Sg+p8EJfVESCpkTEpkSGpMSshg6DkmoxlHHOaFbjoTiHHR83UX/A5M3KIMZPyPWAAAAAElFTkSuQmCC') no-repeat 97% center !important;
background-size: 9px 6px !important;
font: $font-size $font-family;
outline: 0;
cursor: pointer;
appearance: none;
option{
color: #222;
background: #fff;
}
}
button{
@include transition(300ms, 'bezier');
}
form p{ padding-bottom: 15px; font-size: 13px; }
// Search Form
form.search-form{
position: relative;
z-index: 1;
input.search-field{
padding-right: 50px;
}
.submit{
position: absolute;
right: 20px;
top: 50%;
color: $main-color;
background: none;
transform: translateY(-50%);
padding: 0;
border: 0;
box-shadow: none;
backface-visibility: hidden;
height: 20px;
line-height: 17px;
svg{
@include transition;
}
}
.submit:hover svg{ fill: $black; }
}
/* @end */
/* @group Contact Form 7 Basic Support */
.wpcf7{
p{ padding: 0 !important; margin-bottom: $grid-gap; }
label{ @extend .title; @extend .usmall; }
span.wpcf7-form-control-wrap{ display: block; margin-top: half($grid-gap); }
span.wpcf7-not-valid-tip{
color: $main-color;
}
.ajax-loader{
margin-left: half($grid-gap) !important;
vertical-align: baseline !important;
}
.wpcf7-response-output{
clear: both;
border: 0 !important;
background: $black;
color: #fff;
padding: 10px 15px !important;
font-size: 16px;
text-align: center;
margin: 0 0 $grid-gap !important;
position: relative;
border-radius: $small-border-radius;
&.wpcf7-mail-sent-ok{
background: #13ab51;
}
}
form.sent{
.wpcf7-response-output{
background: #13ab51;
}
}
}
/* @end */