I'm trying to move the text 'Next Steps' to the right of the text similar to the example below. I have the code below but I'm not sure what I'm doing wrong or of it's the default spacing of the form builder I'm using but I'm sure there's a way to bypass it
I want the 'Next Steps' to be where the 'You May Be Wondering' is
<h1 class='next-steps'> Next Steps</h1>
<h1 class='experience'>Your Wedding Experience <br> Begins Here</h1>
<style>
h1.next-steps {
color: #1F1F1F;
font-size: 100px;
font-weight:500;
-ms-writing-mode: tb-rl;
-webkit-writing-mode: vertical-rl;
writing-mode: vertical-rl;
transform: rotate(180deg);
position: absolute;
padding-left: -40;!important;
}
h1.experience {
color: white;
font-size: 48px;
font-weight:500;
text-align: center;
position: relative;
}
<!--DEVICE RESPONSIVE--!>
@media screen and (max-width: 800px) {
h1.next-steps {
font-size: 9vw;
}
h1.experience {
font-size: 8vw;
}
}
<style>