Alright, that works nice. But there is one problem. I am editing existing form in hubspot and the feilds like input feild has rounded corners and the submit button too has rounded corner, I just want to make them rectangle. Tried removing all the border-radius from the form CSSbut nothing is changing
.sign-up-form .hs-fieldtype-text {
display: inline-block;
border-radius:100px;
}
.sign-up-form .hs-form .hs-form-field{
display: none;
border-radius:100px;
}
.sign-up-form .show-error-msg a {
color: #ff3366;
}
.show-error-msg a:hover {
color: #e94362;
}
.sign-up-form .hs_cos_wrapper_type_module {
display: inline-block;
width: 600px;
height: 150px;
position: relative;
}
.sign-up-form .show-success-msg {
height: auto;
display: flex;
justify-content: center;
align-items: center;
text-align: center;
background-color:#D3D3D3;
margin:auto;
}
.sign-up-form .show-success-msg .main-text {
font-size: 16px;
margin-right:150px;
border-radius:100px;
}
.sign-up-form .show-success-msg .sub-text {
font-weight: 300;
font-size: 14px;
/* margin-bottom: 10px; */
margin-right:150px;
/* background-color:#ffffff;
color: #000000; */
}
.sign-up-form .show-success-msg ul.checkmark li {
font-size: 30px;
list-style-type: none;
margin-bottom: 1em;
padding: .25em 0 0 2.5em;
position: relative;
margin:auto;
}
.sign-up-form .show-success-msg ul.checkmark li:before {
content: " ";
display: block;
/* border: .8em #11BB88;
border-radius: .8em; */
height: 0;
width: 0;
position: absolute;
left: 43%;
top: 50%;
margin-top: -0.5em;
}
.sign-up-form .show-success-msg ul.checkmark li:after {
content: " ";
display: block;
width: 0.4em;
height: .8em;
/* border: none #fff;
border-width: 0 .2em .2em 0; */
position: absolute;
left: 46%;
top: 70%;
margin-top: -0.2em;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
margin-right:300px;
}
.sign-up-form .show-error-msg {
display: in-block;
justify-content: center;
align-items: center;
background-color: rgba(255, 153, 0, 0.20999999344348907);
/* border: 1px none #FF9900;
border-radius: 1px; */
padding: 10px;
text-align: center;
color: #FF9900;
}
a {
text-decoration: underline !important;
}
.sign-up-form .hs_error_rollup {
display: none;
}
.sign-up-form .hs-form input[type="email"] {
border-radius: 6px !important;
border: 1px none #bcbcbc !important;
width: 300px !important;
border-top-right-radius: 0 !important;
border-bottom-right-radius: 0 !important;
line-height: 22px !important;
}
.sign-up-form .reload-text {
font-weight: 300;
cursor: pointer;
margin-bottom: 0;
}
.sign-up-form .hs-input:not([type="radio"]):not([type="checkbox"]):focus, #hs-pwd-widget-password:focus {
box-shadow: none !important;
}
.sign-up-form .hs_terms_and_conditions {
padding: 0 !important;
padding-left: 8px !important;
}
.sign-up-form .hs-form-booleancheckbox-display {
color: #bcbcbc;
font-weight: 300;
}
.sign-up-form .hs-form .hs-error-msgs label{
color: #bcbcbc;
font-weight: 300;
}
.sign-up-form .hs-submit .actions {
position: absolute;
right: 25%;
top: 13px;
}
body .sign-up-form .hs-button.primary,
.sign-up-form input[type="submit"],
.sign-up-form input[type="button"] {
border-radius: 0;
border-top-right-radius: 6px;
border-bottom-right-radius: 6px;
margin: 0;
padding: 10px 30px;
width: 150px;
font-size: 14px;
font-weight: initial;
float:right !important;
}
::-webkit-input-placeholder { /* Webkit Browsers */
color: #bcbcbc;
}
:-moz-placeholder { /* Firefox 18- */
color: #bcbcbc;
}
::-moz-placeholder { /* Firefox 19+ */
color: #bcbcbc;
}
:-ms-input-placeholder { /* IE10 */
color: #bcbcbc;
}
.hs-input:-moz-placeholder {
color: #bcbcbc;
}
.hs-input::-webkit-input-placeholder {
color: #bcbcbc;
}
@media only screen and (max-width: 600px) {
.sign-up-form .hs_cos_wrapper_type_module {
width: 300px;
}
.sign-up-form .hs-submit .actions {
position: initial;
}
.body .sign-up-form .hs-button.primary,
body input[type="submit"],
body input[type="button"] {
/* border-radius: 6px !important; */
width: 100% !important;
float: right !important;
}
.sign-up-form .hs-form input[type="email"] {
/* border-radius: 0 !important; */
}
.sign-up-form .hs_terms_and_conditions {
padding-left: 4px !important;
margin: 15px 0;
}
.field > .input {
padding: 0 !important;
}
li.hs-form-booleancheckbox {
margin: 15px 0;
position: relative;
}
.hs-form-booleancheckbox-display {
font-size: 14px;
margin-left: 25px;
}
input[type="radio"], input[type="checkbox"] {
position: absolute;
top: 5%;
left: 0;
zoom: 1.5;
}
.sign-up-form .show-success-msg ul.checkmark li:before {
left: 35%;
}
.sign-up-form .show-success-msg ul.checkmark li:after {
left: 42%;
}
}