letter-spacing / Android autocomplete

Hi again,

Sorry for crossposting. But I thought it might help to not keep on extending someone else’s resolved topic’s thread.

I’m still facing some issues with the plugin. Some of them might be caused by modifications. However, I would be grateful for any hints.

-On my mobile phone the “join/submit” button is positioned just a few pixels lower than the email input field.

-I also tried to adjust the font-size and letter-spacing in the footer/copyright section relative to the the viewport width. I works in most cases. Only if the window is very wide, a line break occurs. I tried to maximize the footer section to width=100vw without success. I tried the same with the “subscribe-response”-texts. No effect at all.

-Is there way to reduce the distance/space between the headline/title and the e-mail-field+button-line beneath? Is there also a way to adjust the vertical position of both lines?

-Also on my mobile phone (Android) the active word I’m typing is underlined wich somehow ruins the “floating” character of the layout in my case. I’ve tried to suppress it. WordPress/Android wasn’t too impressed. No effect.
According to this forum it might have to do with the autocomplete function. https://stackoverflow.com/questions/2186290/disable-autocomplete-via-css
But there I couldn’t find a proper solution so far. This question might also be too off topic. Sorry for that.

.body {
    max-width: 100vw;
	width: 100vw;
    margin: 0
	overflow: hidden;
	
	font-size: calc(5px + .8vw);
	letter-spacing: 0.1vw;
	
}
.background-wrapper {
    max-width: 100%;
	width: 100%;
    margin: 0
	overflow: hidden;
}
.inner-wrap {
    max-width: 100%;
	width: 100%;
    margin: 0;
	padding-right:0vw;
	padding-left:0vw;
	overflow: hidden;
}
.inner-content {
   	max-width: 100%;
	width: 100%;
    margin: 0;
	overflow: hidden;
}
.text-logo-wrapper {
	max-width: 100%;
    
    
	overflow: hidden;
}
.text-logo {
	margin: 0.6vw;
	min-width: 0%;
    max-width: 100%;
	font-size: 2vw;
	letter-spacing: 1.75vw;
	overflow: hidden;
	text-align: center;
}

.inner-content form{
	text-align: center;
}
.cmp-subscribe input[type="submit"]{
	width: 25vw;
	margin-left: 0vw;

	margin-right: -14vw;
}
.cmp-subscribe input[type="email"]{
	margin-left: -10vw;
	width: 75vw;
}

.subscribe-response {
	text-align: center;
	font-size: calc(5px + .8vw);
		letter-spacing: 0.1vw;
}
.subscribe-overlay{
	text-align: center;
}
.copyright {
		font-size: calc(5px + .8vw);
		letter-spacing: 0.1vw;
		
	}

.footer{
	width: 100%;
	max-width: 100%;
}

input {
	display: inline;
    background: transparent!important;
	background-blend-mode: transparent!important;
}
input[type="email"] {
    font-size: 2vw;
    letter-spacing: 3vw;
	text-indent:0vw;
	font-weight: 500;
	
}
input[type="submit"] {
    font-size: 2vw;
    letter-spacing: 4.6vw;
	padding-right:0vw;
	margin-right:0vw;
	text-transform: lowercase;
	font-style: italic;
	text-align: right;
	font-weight: 500;
	color: hsl( 0, 0%, 100%);
}

input {
    border: transparent!important;
  border-bottom: none!important;
  box-shadow: none!important;
}

@media only screen and (max-width : 520px) {
    input[type="email"],
    input[type="submit"],
    .cmp-subscribe input[type="email"] {display:inline;}
}

.input-icon::before, input[type="email"], input[type="text"] {
    color: hsl( 0, 0%, 100%);

Thanks again,
Chris

The page I need help with: [log in to see the link]