@font-face {
    font-family: poorfarm;
    src: url(../.../fonts/poorfarmv.5-regular-2015-webfont.eot);
    src: url(../../fonts/poorfarmv.5-regular-2015-webfont.eot?#iefix) format('embedded-opentype'), url(../fonts/poorfarmv.5-regular-2015-webfont.woff2) format('woff2'), url(../fonts/poorfarmv.5-regular-2015-webfont.woff) format('woff'), url(../fonts/poorfarmv.5-regular-2015-webfont.ttf) format('truetype'), url(../fonts/poorfarmv.5-regular-2015-webfont.svg#poorfarm_v.5_regularregular) format('svg');
    font-weight: 400;
    font-style: normal;
}
* {
    margin: 0;
    padding: 0;
}

html {
    height: 100%;
}
body {
	font-family: "Sarala",sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.6;
    font-style: normal;
    word-wrap: break-word;
}
p {
	color: grey;
}
p b {
	color: #b8894f;
}
@media (max-width: 900px) {
	p {
		font-size: 14px;
	}
}
#heading {
	text-transform: uppercase;
	color: #1e73be;
	font-weight: normal;
}

#msform {
    text-align: center;
    position: relative;
    margin-top: 20px;
}

#msform fieldset {
    background: white;
    border: 0 none;
    border-radius: 0.5rem;
    box-sizing: border-box;
    width: 100%;
    margin: 0;
    padding-bottom: 20px;

    /*stacking fieldsets above each other*/
    position: relative;
}

.form-card {
	text-align: left;
}

/*Hide all except first fieldset*/
#msform fieldset:not(:first-of-type) {
    display: none;
}

#msform input[type=text], #msform textarea, #msform select {
    padding: 8px 15px 8px 15px;
    border: 1px solid #afacac;
    border-radius: 4px;
    margin-bottom: 20px;
    margin-top: 2px;
    width: 100%;
    box-sizing: border-box;
    color: #2C3E50;
    background-color: #fff;
    font-size: 16px;
    letter-spacing: 1px;
    
}

#msform input[type=text]:focus, #msform textarea:focus, #msform select:focus {
    border: 1px solid #fbaf41;
    outline-width: 0;
    background-color: #f4f4f4;
    box-shadow: 0px 0px 3px #fbaf41;
}
/*Next Buttons*/
#msform .action-button {
    min-width: 140px;
	background-color: #b44733;
    color: white;
    border: 0 none;
	border-radius: 40px;
    cursor: pointer;
    padding: 5px 5px 3px;
    margin: 15px 0px 10px 5px;
    float: right;
    font-family: poorfarm;
	text-transform: uppercase;
	font-size:30px;
}

#msform .action-button:hover, #msform .action-button:focus {
    background-color: #fbaf41;
    color: #2a2a2a;
}

/*Previous Buttons*/
#msform .action-button-previous {
    min-width: 170px;
    background: #616161;
    color: white;
    border: 0 none;
	border-radius: 40px;
    cursor: pointer;
    padding: 5px 5px;
    margin: 15px 5px 10px 0px;
    float: right;
    font-family: poorfarm;
	text-transform: uppercase;
	font-size:30px;
}

#msform .action-button-previous:hover, #msform .action-button-previous:focus {
    background-color: #fbaf41;
    color: #2a2a2a;
}

#msform .step2 .action-button-previous, #msform .step2 .action-button {
    margin-top: 18px;
}
/*The background card*/
.card {
    z-index: 0;
    border: none;
    position: relative;
}

/*FieldSet headings*/
.fs-title {
    font-size: 22px;
    color: #b44733;
    margin-bottom: 15px;
    font-weight: normal;
    text-align: left;
    font-weight: bold;
}
@media (max-width: 900px) {
	.fs-title {
		font-size: 18px;
		font-weight: bold;
	}
}
.blue-text {
	color: #1e73be;
    font-weight: normal;
}
.red-text {
	color: #b44733;
    font-weight: normal;
}

/*Step Count*/
.steps {
	font-size: 22px;
    color: #b44733;
    margin-bottom: 10px;
    font-weight: normal;
    text-align: right;
    font-weight: bold;
}
@media (max-width: 900px) {
	.steps {
		font-size: 18px;
		font-weight: bold;
	}
}
/*Field names*/
.col-form-label {
	color:#2a2a2a;
	font-weight: bold;
}
/* Date Picker customization */
.datepicker-inline {
    width: 100%;
}
.datepicker table {
    width: 100%;
}
.datepicker td,th{
    text-align: center;
    padding: 5px 8px;
}
.datepicker{
    background-color: #b8894f !important;
	color: #fff;
	font-weight:bold;
	padding: 8px 12px 15px 12px;
}
.datepicker .datepicker-switch:hover, .datepicker .next:hover, .datepicker .prev:hover, .datepicker tfoot tr th:hover {
    color: #b47f3d;
}
.datepicker th {
    font-weight:normal;
}
.datepicker tbody:after {
  line-height:.8em;
  content:".";
  color:#c39153;
  display:block;
}
.datepicker .datepicker-switch {
    font-weight:bold;
}
.datepicker .datepicker-switch:hover, .datepicker .next:hover, .datepicker .prev:hover, .datepicker tfoot tr th:hover {
    background: #fff;
}
.datepicker table tr td.day:hover {
    color: #b47f3d;
    background-color:#fff;
}
.datepicker table tr td.new, .datepicker table tr td.old {
    color: rgba(255, 255, 255, 0.6);
}
.datepicker table tr td.disabled, .datepicker table tr td.disabled:hover {
    color: #caa268;
    background-color: transparent;
}
.datepicker table tr td.new:hover {
    color: #b47f3d;
    background-color:#fff;
}
.datepicker table tr td.active, .datepicker table tr td.active.disabled, .datepicker table tr td.active.disabled:hover, .datepicker table tr td.active:hover {
    background-image: none;
    background-repeat: none;
    filter: none;
    border-color: none;
    text-shadow: none;
    background-color: #fbaf41 !important;
    color: #2a2a2a !important;
}
.datepicker table tr td.today, .datepicker table tr td.today.disabled, .datepicker table tr td.today.disabled:hover, .datepicker table tr td.today:hover {
    background-color: #fff;
    background-image: none;
    background-repeat: none;
    filter: none;
    border-color: none;
    text-shadow: none;
    background-color: rgba(255, 255, 255, 0.1);
    color: #fff;
}
.datepicker table tr td.today.active, .datepicker table tr td.today.disabled, .datepicker table tr td.today.disabled.active, .datepicker table tr td.today.disabled.disabled, .datepicker table tr td.today.disabled:active, .datepicker table tr td.today.disabled:hover, .datepicker table tr td.today.disabled:hover.active, .datepicker table tr td.today.disabled:hover.disabled, .datepicker table tr td.today.disabled:hover:active, .datepicker table tr td.today.disabled:hover:hover, .datepicker table tr td.today.disabled:hover[disabled], .datepicker table tr td.today.disabled[disabled], .datepicker table tr td.today:active, .datepicker table tr td.today:hover, .datepicker table tr td.today:hover.active, .datepicker table tr td.today:hover.disabled, .datepicker table tr td.today:hover:active, .datepicker table tr td.today:hover:hover, .datepicker table tr td.today:hover[disabled], .datepicker table tr td.today[disabled] {
    color: #1e73be;
    background-color:#fff;
}
.datepicker table tr td.day.active, .datepicker table tr td.day.active:hover {
    color: #fff;
}
.datepicker tfoot tr th.today {
    background: #b44733;
    color:#fff;
    font-weight: bold;
}
.datepicker tfoot tr th.today:hover {
    background-color: #fbaf41;
    color: #2a2a2a;
}
.datepicker table tr td span.disabled:hover {
    color: rgba(255, 255, 255, 0.6);
}
.datepicker table tr td span.old {
    color: #999;
}
.datepicker table tr td span.new {
    color: rgba(255, 255, 255, 0.6);
}
.datepicker table tr td span.disabled,.datepicker table tr td span.old,
.datepicker table tr td span.disabled:hover,.datepicker table tr td span.old:hover {
    color: #d1aa71;
}
.datepicker table tr td span.focused, .datepicker table tr td span:hover {
    color: #b47f3d;
    background-color: #fff;
}
.datepicker table tr td span.old:not(.disabled) {
	color: rgba(255, 255, 255, 0.6);
}
.datepicker table tr td span.active.active {
	background-image: linear-gradient(to bottom,#f3c888,#fbaf41);
    color: #fff !important;
}

/* Time Step */
/* Accordion Styles */
.accordion-body {
	background-color:#f2f2f2;
}
.accordion-button {
	color: #1e73be;
    font-weight: bold;
}
.accordion-button:hover {
	color: #1e73be;
    font-weight: bold;
    background-color:#e3eeff;
}
.accordion-button::after {
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23e2332a'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}
/* Radio Check box styles */
.row.select-time {
	margin-bottom: 25px;
}
.time-label {
    background: #e3d0af;
    color: #2a2a2a;
    border-radius: 4px;
	padding: 6px;
    margin-bottom:5px;
	text-align: center;
    font-weight: bold;
}
.form-check-wrapper {
	border: 1px solid #c0bfbf;
    border-radius: 4px;
    margin-bottom:2px;
    background-color: #fff;
    cursor:pointer;
    pointer-events: auto;
}
.form-check-wrapper:hover {
    border: 1px solid #fbaf41;
    outline-width: 0;
    background-color: #fff0de;
    box-shadow: 0px 0px 3px #fbaf41;
}
.form-check-wrapper.disabled {
    border: 1px solid #e1e1e1;
    outline-width: 0;
    background-color: #fff;
    box-shadow: 0px 0px 0px #1e73be;
    pointer-events: none;
}
.form-check-wrapper.disabled:hover {
    border: 1px solid #e1e1e1;
    outline-width: 0;
    background-color: #fff;
    box-shadow: 0px 0px 0px #1e73be;
}
.form-check {
    padding-left: 2em;
}
.form-group-checkboxes {
	border: 1px solid #b8894f;
    border-width: 1px 0px;
    padding: 15px 25px 10px;
    background-color: #f6f6f6;
    margin-top: 10px;
    margin-bottom: 25px;
}        
@media (max-width: 500px) {
	.form-group-checkboxes {
	    padding: 20px 15px;
	} 
}
.form-group-checkboxes .form-check {
    padding-left: 1.5em;
}
.form-check .form-check-input {
    margin-top: 13px;
    cursor: pointer;
    pointer-events: auto;
    border-color: #afacac;
}
.form-check-wrapper.disabled .form-check .form-check-input {
    pointer-events: none;
    opacity: 0;
}
.form-check .form-check-label {
	width:100%;
	padding: 9px 0 7px 0;
    display: flex;
    justify-content: space-between;
    cursor:pointer;
    pointer-events: auto;
}
.form-check .form-check-label span {
	display:inline-block;
}
.form-check .form-check-label span:last-of-type {
	color: #b8894f;
}
.form-check-wrapper.disabled .form-check .form-check-label span:last-of-type {
	color: #909294;
}
.form-check .form-check-label span:first-of-type {
	justify-content: flex-start;
}
.form-check .form-check-label span {
	justify-content: flex-end;
	padding-right: 10px;
}
@media (max-width: 500px) {
	.form-check {
	    margin-bottom: 0;
	}
	.form-check .form-check-label {
		font-size:14px;
		line-height: 1.4;
	}
	.form-check .form-check-input {
	    margin-top: 9px;
	}
	.form-check .form-check-label {
	    padding: 8px 0 8px 0;
	}
}
/* Standard Check box styles */
.form-check-input:checked {
    background-color: #fbaf41;
    border-color: #fbaf41;
}
.form-check-input:focus {
    border-color: #fbaf41;
    outline: 0;
    box-shadow: 0 0 0 0.25rem rgb(254 226 186);
}
/*Icon progressbar*/
#progressbar {
    margin-bottom: 30px;
    overflow: hidden;
    color: lightgrey;
    padding-left:0px;
}

#progressbar .active {
    color: #c39153;
}

#progressbar li {
    list-style-type: none;
    font-size: 15px;
    width: 33.33333%;
    float: left;
    position: relative;
    font-weight: 400;
}

/*Icons in the ProgressBar*/
#progressbar #date:before {
    font-family: 'Font Awesome 6 Free';
    content: "\f073";
}

#progressbar #time:before {
    font-family: 'Font Awesome 6 Free';
    content: "\f017";
}

#progressbar #details:before {
    font-family: 'Font Awesome 6 Free';
    content: "\f007";
}

#progressbar #done:before {
    font-family: 'Font Awesome 6 Free';
    content: "\f00c";
}

/*Icon ProgressBar before any progress*/
#progressbar li:before {
    width: 50px;
    height: 50px;
    line-height: 45px;
    display: block;
    font-size: 20px;
    color: #ffffff;
    background: lightgray;
    border-radius: 50%;
    margin: 0 auto 10px auto;
    padding: 2px;
}

/*ProgressBar connectors*/
#progressbar li:after {
    content: '';
    width: 100%;
    height: 2px;
    background: lightgray;
    position: absolute;
    left: 0;
    top: 25px;
    z-index: -1;
}

/*Color number of the step and the connector before it*/
#progressbar li.active:before, #progressbar li.active:after {
    background: #c39153;
}

/*Animated Progress Bar*/
.progress {
	height: 20px;
}

.progress-bar {
	background-color: #c39153;
}

/*Fit image in bootstrap div*/
.fit-image{
    width: 100%;
    object-fit: cover;
}

.under18 {
	margin-top:-10px;
	margin-bottom:10px;
	line-height:1.3em;
}

.container-fluid .card, #msform {
    margin-top: 0px;
}