@import url('https://fonts.googleapis.com/css2?family=Raleway&display=swap');
.typing > .static-txt {
     color: mediumpurple;
}

.typing > .dynamic-txt {
     color: var(--primary);
     font-size:50px;
     height:70px;
     line-height:70px;
     overflow:hidden;
     margin-left:0 0 0 15px;
     padding-left: 15px;
}
.dynamic-txt > li {
     list-style:none;
     font-weight:500;
     position: relative;
     animation: slide 6s steps(2) infinite;
}
@keyframes slide{
     100% {
          top: -70px;
     }
}
.dynamic-txt li span {
     margin: 5px 0;
     line-height: 70px;
     color: darkblue;
     font-family: "Inter", Sans-serif;
     font-size: 3.5vw;
     font-weight: 700;
}

.dynamic-txt li span::after {
     position:absolute;
     content:'';
     left:0;
     height:100%;
     width:100%;
     line-height:70px;
     background:white;
     border-left: 2px solid var(--primary);
     animation: typing 3s steps(10) infinite;
}

@keyframes typing {
     40%,60% {left: calc(100% + 30px);}
     100% {left:0;}
}
.page-content {
     display: block;
     margin: 50px 0;
}
.banner-caption h4 {
     color: #7680a4;
     font-family: "Inter", Sans-serif;
     font-size: 1.2vw;
     font-weight: 600;
     text-transform: uppercase;
}
.banner-caption h2 {
     color: mediumpurple;
     opacity: 0.5;
     font-family: "Inter", Sans-serif;
     font-size: 3.5vw;
     font-weight: 700;
}
.banner-caption p {
     text-align: left;
     color: #7680A4;
     font-family: "Inter", Sans-serif;
     font-size: 1.3vw;
     font-weight: 500;
     line-height: 30px;
}
.wizard-v1-content {
     margin: 0 auto;
     width: 80%;
      background: none;
     box-shadow: none;
     -o-box-shadow: none;
     -ms-box-shadow: none;
     -moz-box-shadow: none;
      -webkit-box-shadow: none;
      border-radius: 0;
     -o-border-radius: none;
     -ms-border-radius: 10px;
     -moz-border-radius: 10px;
      -webkit-border-radius: 10px;
}
.form-register .steps li.current a .step-icon, .form-register .steps li.current a:active .step-icon, .form-register .steps .done::before, .form-register .steps li.done a .step-icon, .form-register .steps li.done a:active .step-icon {
     background: mediumpurple;
}
.actions ul li a {
     font-family: "Inter", Sans-serif;
     font-size: 1.5vw;
     font-weight: 700;
     letter-spacing: 0px;
     fill: white;
     background-color: mediumpurple;
     border-radius: 10px 10px 10px 10px;
     padding: 18px 40px 18px 40px;
     color: white;
}
.form-register .content {
     background: none;
     padding: 0;
}
.inner .form-row .form-holder label {
     color: black;
}
label span {
     color: red;
}
.inner .form-row .form-holder input:not([type="checkbox"]), .inner .form-row .form-holder select {
     outline: 1px solid lightgray;
     background: none;
     color: black;
     padding: 30px 25px;
}
.banner-caption {
     width: 80%;
     margin: 0 auto;
}
.actions ul li:first-child a {
     color: white;
}
.actions ul li {
     width: auto;
}
.actions ul li a i {
     margin-left: 10px;
}
.actions ul li a i.fa.fa-hand-o-left {
     margin-right: 10px;
     margin-left: 0;
}
button#btn-start-recording, button#btn-stop-recording{
     font-family: "Inter", Sans-serif;
     font-size: 1.5vw;
     font-weight: 700;
     letter-spacing: 0px;
     fill: white;
     background-color: mediumpurple;
     border-radius: 10px 10px 10px 10px;
     padding: 15px 30px;
     color: white;
     border: 1px solid mediumpurple;
}
.form-holder.form-holder-2 p {
     font-size: 14px;
     font-weight: 500;
     color: black;
     padding-bottom: 11px;
     display: block;
}
.form-holder.form-holder-2 p a:hover {
     color: blue;
}
#box > p:nth-child(4) > span-nth-child(2) {
     position: relative;
     right: 3px;
}
#box > p:nth-child(4) > span:nth-child(3) {
     position: relative;
     right: 6px;
}
@media (max-width: 540px) {
     .banner-caption {
          width: 100%;
     }
     .wizard-v1-content{
          width: 100%;
     }
     .wizard-v1-content .wizard-form {
          width: 100%;
          padding: 40px 0;
     }
     .form-register .steps li, .form-register .steps li.current {
          padding-right: 30px;
     }
     .banner-caption h4 {
          font-size: 3.5vw;
     }
     .banner-caption h2 {
          font-size: 8vw;
     }
     .typing-custom {
          font-size: 8vw !important;
     }
     .banner-caption p {
          font-size: 4vw;
          line-height: 20px;
     }
     .actions ul li a {
          font-size: 4vw;
     }
     .form-register .steps li::before {
          left: 54%;
     }
     .dynamic-txt li span {
          font-size: 8.5vw;
     }
     .typing {
          display: block;
     }
}