How to remove border-radius from the input feild in the form

[Shaykoo]

Here is the CSS of the form, I just want to make input feild and submit button rectangular they are rounded now. I tried removing all the border-radius in the CSS but it still remains the same.

.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%;
  }
} 	

[Anton · Accepted solution]

try to change it to

border-radius:0px;

if this doesn't

work go the "sledgehammer" way by adding a !important to the code. Your code should look like this

border-radius:0px !important;

regards,

Anton 

[shannonhoward]

Thanks @Anton - your code worked and was super easy & helpful! 🙂