@font-face {
    font-family: 'forza-bold';
    src: url('inc/Forza-Bold.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'forza-book';
    src: url('inc/Forza-Book.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}
.forza-bold {
    font-family: 'forza-bold', sans-serif;
}

.forza-book {
    font-family: 'forza-book', sans-serif;
}
body {
	    font-family: "Inter", sans-serif!important;
        font-optical-sizing: auto;
        font-weight: 400;
        font-style: normal;
        font-size:1em;
        color:#242424;
        font-smooth: antialiased;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }
    h1,h2,h3,h4,h5,h6 {
        font-family: 'forza-bold', sans-serif;
    }
    h1{
        font-size:clamp(2rem, 4.5vw, 54px);
    }
    h5{
        font-size:clamp(1.5rem, 4.5vw, 32px);
    }
    .form-frame {
        width:600px;
        max-width:90vw;
        margin-left:auto;
        margin-right:auto;
		padding:1rem .375rem;
    }
	input.form-control, select.form-select {
		border: 1px solid #D8d8d8;
		padding: .5rem!important;
	}
	input.form-control:focus, select.form-select:focus {
		border: 1px solid #212121;
		box-shadow: none;
	}
	label .blab {
		cursor: pointer;
		font-weight: 700;
		color:#848484;
	}
	label .blab:hover {
		color:#212121;
	}
	.form-note {
	    font-size:.95rem;
	}
	.step-title {
       /* font-family:"Inter",sans-serif;*/
        font-family: 'forza-bold', sans-serif;
        font-size:clamp(1.05rem, 7.5vw, 28px);
		font-weight: 700;
		margin-bottom: 1em;
		text-align:center;
	}
	.form-step {
		display: none;
		opacity: 0;
		transition: opacity 0.4s ease;
	}
	.form-step.active {
		display: block;
		opacity: 1;
	}
	
	.subheadline {
	    text-align:center;
		font-size: .8rem;
		margin-bottom: 1em;
		font-family: "Inter", sans-serif!important;
	}
.topline {text-transform:uppercase; font-weight:700; font-family: 'forza-bold', sans-serif;
        }
.bg-f4 {background-color: #f4f4f4;}	
	label {color:#282828; font-size:clamp(9px, 3.5vw, 14px); font-weight:400; }
	input.form-control,select.form-select {border-radius:2px; border:1px solid #484848;
	padding-top: .75rem;
    padding-bottom: .75rem;
    padding-left: 1rem;
    padding-right: 1rem;}
	input.form-control:focus, select.form-select:focus {
    border-radius:2px;
    border: 1px solid rgba(24,24,24,.15);
		box-shadow: 1px 2px 3px 0 rgba(24,24,24,.25);
}
.border-5050 {border-color:#7a7a7a;}
 #drop-zone {
      border: 2px dashed #242424;
      padding: 40px;
      text-align: center;
      color: #242424;
      cursor: pointer;
    }

    #drop-zone.dragover {
      background-color: #e9f5ff;
    }

    #preview img {
      max-width: 100%;
      height: auto;
      margin-top: 15px;
    }

    .preview-info {
      margin-top: 15px;
      font-size: 0.9rem;
      color: #6c757d;
    }
#drop-zone-inline {
  border: 1px solid #242424!important;
  background-color: #fff;
  cursor: pointer;
}

#drop-zone-inline.dragover {
  background-color: #C41230;
  border: 2px dashed #242424;
}

#drop-zone-inline.dragover .text-muted {
  color:#ffffff;
}

#inline-preview img {
  max-width: 100%;
  height: auto;
  margin-top: 15px;
}


.progress-steps .circle {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    line-height: 31px;
    text-align: center;
    font-weight: bold;
    border: 2px solid #505050;
    background-color: white;
    color: #000;
}

.progress-steps .circle {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  line-height: 30px;
  text-align: center;
  font-weight: bold;
  border: 2px solid #505050;
  background-color: white;
  color: #000;
  transition: all 0.3s ease;
}

.progress-steps .circle.active {
  border-color: #d71920;
  background-color: #d71920;
  color: #fff;
}

.progress-steps .circle.completed {
  background-color: #6c757d;
  border-color: #6c757d;
  color: #fff;
}

.progress-steps .circle.completed i {
  font-size: 18px;
}
ul.list-unstyled li {font-size:clamp(.85rem, 5vw,16px);}
ul.list-unstyled li:before {content: '\2022 '; padding-right:.75em;}


.form-check-input[type="checkbox"] {
  width: 1.25em;
  height: 1.25em;
  margin-top: 0.15em;
  vertical-align: top;
  appearance: none;
  -webkit-appearance: none;
  background-color: #fff;
  border: 2px solid #ccc;
  border-radius: 0.25em;
  transition: all 0.2s ease-in-out;
  cursor: pointer;
  position: relative;
}

.form-check-input[type="checkbox"]::after {
  content: '';
  position: absolute;
  top: 2px;
  left: 5px;
  width: 4px;
  height: 9px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
  opacity: 0;
  transition: opacity 0.2s ease;
}
input::placeholder {opacity: 0.2;}
.form-check-input[type="checkbox"]:checked {
  background-color: #505050;
  border-color: #505050;
}

.form-check-input[type="checkbox"]:checked::after {
  opacity: 1;
}


.form-check-input[type="checkbox"]:focus {
  outline: none;
  box-shadow: 0 0 0 0.25rem rgba(50,50,50, 0.25);
}

.form-check-input[type="checkbox"]:active {
  background-color: #e0eaff;
}

.form-check-input.is-valid {
  border-color: #198754;
  background-color: #198754;
}

.form-check-input.is-valid::after {
  border-color: #fff;
}

.form-check-input.is-valid:focus {
  box-shadow: 0 0 0 0.25rem rgba(25, 135, 84, 0.25);
}

.form-check-input.is-invalid {
  border-color: #dc3545;
  background-color: #dc3545;
}

.form-check-input.is-invalid::after {
  border-color: #fff;
}

.form-check-input.is-invalid:focus {
  box-shadow: 0 0 0 0.25rem rgba(220, 53, 69, 0.25);
}
