.ffs_bootstrap .ff-el-group { font-size: 1rem; } .ffs_bootstrap .ff-el-group input[type=email], .ffs_bootstrap .ff-el-group input[type=number], .ffs_bootstrap .ff-el-group input[type=tel], .ffs_bootstrap .ff-el-group input[type=password], .ffs_bootstrap .ff-el-group input[type=text], .ffs_bootstrap .ff-el-group input[type=url], .ffs_bootstrap .ff-el-group textarea { display: block; width: 100%; padding: 0.375rem 0.75rem; line-height: 1.5; color: #495057; background-color: #fff; background-clip: padding-box; border: 1px solid #ced4da; border-radius: 0.25rem; transition: border-color 0.15s ease-in-out, box-shadow 0.15s; } .ffs_bootstrap .ff-el-group input[type=email]:focus, .ffs_bootstrap .ff-el-group input[type=number]:focus, .ffs_bootstrap .ff-el-group input[type=tel]:focus, .ffs_bootstrap .ff-el-group input[type=password]:focus, .ffs_bootstrap .ff-el-group input[type=text]:focus, .ffs_bootstrap .ff-el-group input[type=url]:focus, .ffs_bootstrap .ff-el-group textarea:focus { color: #495057; background-color: #fff; border-color: #80bdff; outline: 0; box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25); } .ffs_bootstrap .ff-el-group .iti--allow-dropdown input { padding-right: 6px; padding-left: 52px; margin-left: 0; } .ffs_bootstrap .ff-el-group .ff-el-help-message { color: #6c757d; font-size: 80%; font-weight: 400; font-style: normal; } .ffs_bootstrap .ff-el-group input[readonly] { background: #e9ecef !important; cursor: pointer; } .ffs_bootstrap .ff-el-group .ff-el-input--content select, .ffs_bootstrap .ff-el-group .ff-el-input--content .choices__list--single, .ffs_bootstrap .ff-el-group .ff-el-input--content .choices[data-type*=select-multiple] { border: 1px solid #ced4da; border-radius: 0.25rem; height: calc(2.25rem + 2px); padding: 0.375rem 1.75rem 0.375rem 0.75rem; line-height: 1.5; background: white; color: #495057; height: 38px; } .ffs_bootstrap .ff-el-group .ff-el-input--content select:focus, .ffs_bootstrap .ff-el-group .ff-el-input--content .choices__list--single:focus, .ffs_bootstrap .ff-el-group .ff-el-input--content .choices[data-type*=select-multiple]:focus { color: #495057; background-color: #fff; border-color: #80bdff; outline: 0; box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25); } .ffs_bootstrap .ff-el-group .ff-el-input--content .choices__list--dropdown { border: 1px solid #212529; color: #495057; } .ffs_bootstrap .ff-el-group .ff-el-input--content .choices__inner { border-radius: 0; border: 0; } .ffs_bootstrap .ff-el-group .ff-el-input--content .choices[data-type*=select-multiple] { padding: 0; } .ffs_bootstrap .ff-el-group .ff-el-input--label label { color: #212529; font-size: 15px; } .ffs_bootstrap .ff-el-group .ff-el-form-check-label { color: #212529; font-size: 15px; } .ffs_bootstrap .ff-el-group.ff-el-is-error .ff-el-form-control { border-color: #dc3545; } .ffs_bootstrap .ff-el-group input[type=checkbox] { -webkit-appearance: checkbox; } .ffs_bootstrap .ff-el-group input[type=radio] { -webkit-appearance: radio; } .ffs_bootstrap .ff-el-group input[type=checkbox], .ffs_bootstrap .ff-el-group input[type=radio] { transform: scale(1); margin-top: -4px; width: 23px; height: 10px; margin-right: 0px; cursor: pointer; font-size: 12px; position: relative; text-align: left; border: none; box-shadow: none; } .ffs_bootstrap .ff-el-group input[type=checkbox]:before, .ffs_bootstrap .ff-el-group input[type=radio]:before { content: none; } .ffs_bootstrap .ff-el-group input[type=checkbox]:after, .ffs_bootstrap .ff-el-group input[type=radio]:after { content: " "; background-color: #fff; display: inline-block; margin-left: 3px; padding-bottom: 3px; color: #212529; width: 15px; height: 15px; visibility: visible; border: 1px solid #212529; padding-left: 1px; border-radius: 0.25rem; padding-top: 1px; transition: all 0.1s ease; background-size: 9px; background-repeat: no-repeat; background-position: center center; position: absolute; box-sizing: border-box; } .ffs_bootstrap .ff-el-group input[type=checkbox]:checked:after, .ffs_bootstrap .ff-el-group input[type=radio]:checked:after { border-width: 1px; background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E"); background-color: #007bff; transition: all 0.3s ease-out; color: #fff; border-color: #007bff; } .ffs_bootstrap .ff-el-group input[type=radio]:after { border-radius: 50%; font-size: 10px; padding-top: 1px; padding-left: 2px; } .ffs_bootstrap .ff-el-group input[type=radio]:checked:after { background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='%23fff'/%3E%3C/svg%3E"); } .ffs_bootstrap .ff-el-image-holder { text-align: center; } .ffs_bootstrap .ff-el-image-holder.ff_item_selected .ff-el-image-input-src { border: 4px solid #007bff; } .ffs_bootstrap .fluent-address > .ff-el-input--label { display: block; line-height: 30px; font-size: 18px; border-bottom: 1px solid #212529; color: #212529; margin-bottom: 15px; } .ffs_bootstrap .ff_net_table tbody tr td:first-of-type { border-left: 1px solid #212529; } .ffs_bootstrap .ff_net_table tbody tr td { border: 1px solid #212529; border-right-width: 0px; } .ffs_bootstrap .ff_net_table tbody tr td input[type=radio]:checked + label { background-color: #007bff; color: #fff; } .ffs_bootstrap .ff_net_table tbody tr td label:hover:after { border: 1px solid #007bff; } .ffs_bootstrap .ff_net_table tbody tr td:last-of-type { border-right-width: 1px; } .ffs_bootstrap .ff_net_table thead tr span { color: #495057; } .ffs_bootstrap .ff-el-progress-bar { background-color: #007bff; } .ffs_bootstrap button.ff-btn-next { background: #007bff; color: white; padding: 6px 20px; font-weight: bold; border-color: #007bff; } .ffs_bootstrap button.ff-btn-next:hover { background: white; color: #007bff; } .ffs_bootstrap button.ff-btn-prev { background: white; color: #212529; border-color: #212529; } .ffs_bootstrap .ff-step-titles li:before { content: ""; width: 20px; height: 20px; border-radius: 50%; } .ffs_bootstrap .ff-step-header { background: #f0f0f3; padding: 20px 0px; margin-bottom: 0px; } .ffs_bootstrap .ff-step-container { border: 5px solid #f0f0f3; border-radius: 5px; } .ffs_bootstrap .fluentform-step.active { padding: 20px; }