/* Form fields */ #booking-form ul { padding-left: 0; } #booking-form li { list-style: none; } /* Buttons */ #booking-form .next-btn, #booking-form .submit-btn { background: #36b4e5; padding: 13px 20px; color: #fff; text-transform: uppercase; font-size: 18px; line-height: 24px; font-weight: bold; min-width: auto; display: inline-block; text-align: center; border-radius: 0; border: 0; transition-property: background-color; transition-duration: 0.5s; width: 100%; cursor: pointer; } #booking-form .next-btn:hover, #booking-form .submit-btn:hover { background-color: #08376B; color: #fff; } /* Progress Bar */ .progress-wrap { width: 100%; margin: auto; display: table; } .line-progress-bar { display: flex; margin: auto; width: 100%; } .line { height: 1px; width: 250px; border-bottom-style: solid; border-bottom-width: 1px; border-bottom-color: rgb(217, 217, 217); position: absolute; margin-top: 8px; } .progress-wrap div ul { display: flex; width: 250px; list-style: none; padding: 0px; margin: initial; justify-content: space-between; z-index: 1; } .progressbar-dots { display: inline-flex; border: #949494 solid 4px; background: #333333; height: 20px; width: 20px; border-radius: 0; text-align: center; justify-content: center; align-items: center; font-weight: bold; color: #d4d4d4; font-size: 20px; margin-left: 0px; color: #d4d4d4; border: 0px solid rgb(217, 217, 217); background: rgb(217, 217, 217); } .progressbar-dots span { font-size: 12px; line-height: 12px; position: relative; margin-top: 60px; white-space: nowrap; } .progressbar-dots.active { color: #36b4e5; background: #36b4e5; } /* Tab */ .tab-pane { display: none; } .tab-pane:first-child { display: block; } /* Error */ span.error { font-size: 12px; font-family: "helvetica neue", arial, sans-serif; color: #d6041d; text-transform: uppercase; display: block; margin-bottom: 10px; }