/**
 * This CSS file appears to use the Block, Element, Modifier methodology (BEM)
 * Here is more info on this methodology.
 *
 * @link https://css-tricks.com/bem-101/
 * @link http://getbem.com/introduction/
 * @erodriguez 2019-02-07
 */

.form-row.full {
  display: none !important;
}

.fscr {
  font-family: 'Open Sans', sans-serif;
}

.modal-backdrop {
  opacity: 0;
  cursor: wait;
}

#fscr-stripe-card-element {
  border: 1px solid rgba(82,119,183, 0.25);
  padding: 10px;
}

.fscr .select-package-title {
  border-top: 1px dashed #BBB;
  padding-top: 30px;
  margin-bottom: 35px;
}

.fscr h3 {
  color: #232D69;  
  font-size: 20px;
  font-weight: bold;
}

.fscr button.disabled {
  cursor: wait;
}

.fscr .input-order-total {
  max-width: 120px;
  background: #F5F5F5;
  margin-right: 10px;
}

.fscr .input.readonly {
  background: #F5F5F5;
}

.fscr .buffer-bottom {
  display: block;
  margin-bottom: 10px
}

.fscr .buffer-bottom-30 {
  display: block;
  margin-bottom: 30px
}

.fscr legend {
  border: none;
}

.fscr label {
  width: 95% !important;
}

.fscr label.fscr-d-block {
  width: 100% !important;
}

.fscr textarea {
  width: 100%;
  padding: 10px;
  font-weight: normal !important;
}

.fscr select,
.fscr-lesson-package-item label select {
  color: #404040 !important;
  font-weight: normal !important;
}

.fscr * {
  box-sizing:border-box;
}

.fscr-text-center {
  text-align: center;
}

.fscr-d-none {
  display: none;
}

.fscr-d-block {
  display: block;
}

.fscr-d-inline-block {
  display: inline-block;
}

.fscr-d-flex {
  display: flex;
}

.fscr-d-flex.fscr-wrap {
  flex-wrap: wrap;
}

.fscr-justify-content-end {
  justify-content: flex-end;
}

.fscr-justify-content-between {
  justify-content: space-between;
}

.fscr-app-container {
  max-width: 750px;
  margin: 0 auto;
}

.fscr-line-break {
  margin-bottom: 25px;
}

.fscr-fieldset-wrap {
  margin: 25px 0;
}

.fscr-page-title {
  background: #F5F5F5;
  font-size: 23px;
  border-top: 1px solid #232D69 !important;
  border-bottom: 1px solid #232D69 !important;
  width: 100%;
  padding: 15px 0;
  margin-bottom: 25px;
  color: #232D69;
  font-weight: bold;
  text-align: center;
}

#fscr-stripe-card-errors,
.fscr-input-error {
  height: 16px;
  color: tomato;
  font-size: 12px;
  padding: 5px 0 0 0;
  font-weight: bold;
}

.msg--success {
  color: limegreen;
}

.msg--error {
  color: tomato;
}

.fscr-asterisk--required {
  color: tomato;
  font-size: 12px;
  vertical-align: top;
}

.fscr-input-wrap {
  margin: 5px 0;
}

.fscr-schedule-additional-info-wrapper label {
  width: 100%;
}

.fscr-schedule-additional-info-wrapper textarea,
.fscr-input-wrap textarea {
  width: 100%;
  padding: 10px;
  font-weight: normal !important;
}

.fscr-input-wrap--half {
  flex: 1 1 50%;
}

.fscr-input-wrap--half--not-flex {
  width: 50%;
}


.fscr-input {
  font-size: 14px;
  font-weight: normal;
  padding: 10px;
  width: 95%;
  border: 1px solid rgba(82,119,183, 0.25);
  box-shadow: 0 0 1px rgba(0,0,0, 0.075);
}

.fscr-input-label {
  font-weight: bold;
  padding: 0;
  margin: 0 10px;
  display: block;
}

.fscr-input-label-text {
  font-size: 16px;
  margin-bottom: 5px;
  color: #232D69;
}

.fscr-fieldset {
  border: none;
  margin: 0;
  padding: 0;
}

.fscr-parent-component {
  margin: 0 0 25px 0;
  border: 1px dashed #5277B7;
  padding: 15px;
}

.fscr-student-component {
  margin: 0 0 25px 0;
  border: 1px dashed #5277B7;
  padding: 15px;
}

.fscr-fieldset--lessons {
  margin: 25px 0 50px;
}

.fscr-fieldset--lessons legend {
  margin-bottom: 15px;
}

.fscr-multiselect-wrapper {
  margin: 15px 0;
  width: 50%;
}

.fscr-multiselect-wrapper--half {
  outline: 1px solid #EEE;
  flex: 1 1 50%;
}

.fscr-schedule-additional-info-wrapper {
  margin: 15px 0;
}

.fscr-schedule-additional-info-wrapper textarea {
  margin-top: 10px;
  margin-bottom: 25px;
  width: 100%;
}

.fscr-health-conditions-wrapper {
  margin: 15px 0;
}

.fscr-health-conditions-wrapper textarea {
  margin-top: 10px;
  margin-bottom: 25px;
  width: 100%;
}

.multiselect {
  margin-top: 10px;
}

.multiselect__option--highlight {
  background: #333;
}

.multiselect__tag {
  background: #333;
}

.multiselect__tag-icon:focus, 
.multiselect__tag-icon:hover {
  background-color: #aaa;
}

.multiselect__tag-icon:focus:after, 
.multiselect__tag-icon:hover:after {
  color: #333;
}

.multiselect__tag-icon:after {
  color: #fff;
}

.multiselect__option--selected.multiselect__option--highlight:after {
  background: #aaa;
}

.multiselect__option--highlight:after {
  background: #aaa;
  color: #333;
}

.fscr-fade-enter-active, .fscr-fade-leave-active {
  transition: opacity .5s;
}

.fscr-fade-enter, .fscr-fade-leave-to /* .fade-leave-active below version 2.1.8 */ {
  opacity: 0;
}

.fscr-button {
  box-shadow: 0 0 2px rgba(0,0,0,0.35);
  transition: 0.2s all ease;
  border: none;
  padding: 15px 40px;
  font-size: 16px;
  font-weight: bold;
}
.fscr-button:hover {
  cursor: pointer;
}

.fscr-button--primary {
  background-color: #5277B7;
  color: #fff;
}
.fscr-button--primary:hover,
.fscr-button--primary:active,
.fscr-button--primary:focus {
  background-color: #79c142;
}

.fscr-button--danger {
  background-color: #dc3545;
  color: #fff;
}
.fscr-button--danger:hover,
.fscr-button--danger:active,
.fscr-button--danger:focus {
  background-color: #c82333;
}


label.radio--box {
  margin-right: 0;
  display: block;
  position: relative;
  margin-bottom: 0;
  width: 100%;
}

label.radio--box:hover {
  cursor: pointer;
}

.fscr-fieldset--pool-access legend .fscr-input-label-text {
  color: #283166;
}

.radio--box .fscr-input-label-text {
  background-color: #5277B7;
  padding: 15px;
  width: 75px;
  text-align: center;
  color: #fff;
  margin-bottom: 0;
  transition: 0.2s all ease;
  box-shadow: 0 0 2px rgba(0,0,0,0.35);
}

.radio--box input[type=radio] {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  display: block;
  z-index: -1;
  margin: 0;
  height: 100%;
}

.radio--box .fscr-input-label-text.selected { 
  background-color: #79c142;
}

.checkboxes--students {
  margin: 10px 0 0 0;
}

.checkbox--student {
  display: inline-block;
  margin: 5px 0;
}

.checkbox--student__text {
  font-weight: normal;
}

.checkbox--student__label:hover {    
  cursor: pointer;
}

/*
 * Page 3
 *
 */

.fscr-fieldset--durations {
  margin: 25px 0;
}

.fscr-fieldset--durations legend {
  margin-bottom: 15px;
}

.fscr-radio--durations {
  display: flex;
  justify-content: space-around;
  margin: 0;
}

.fscr-radio--duration {
  background-color: #5277B7;
  color: #fff;
  transition: 0.2s background-color ease;
  flex: 0 1 35%;
  text-align: center;
}

.fscr-radio--duration.selected {
  background-color: #283166;
  color: #fff;
}

.fscr-radio--duration label {
  color: #fff;
}

.fscr-radio--duration label:hover {
  cursor: pointer;
}

.fscr-radio--duration.selected label {
  color: #fff;
}

.fscr-radio--duration__content {
  padding: 25px 0;
}

.fscr-radio--duration__duration {
  font-size: 16px;
  font-weight: bold;
}

.fscr-radio--duration__select-text {
  padding: 15px 0;
  transition: 0.2s background-color ease;
  border-top: 1px solid #fff;
}

.fscr-radio--duration.selected .fscr-radio--duration__select-text {
  background-color: #79c142;
}

.fscr-lesson-package-list {
  list-style: none;
  margin: 0;
  padding: 0;
  justify-content: space-around;
}

.fscr-lesson-package-item {
  background-color: #5277B7;
  color: #fff;
  flex: 0 1 35%;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}

.fscr-lesson-package-item.selected {
  background-color: #283166;
  color: #fff;
}

.fscr-lesson-package-item label {
  color: #fff;
}

.fscr-lesson-package-item-bottom {
  margin-top: 10px;
}

.fscr-radio--duration__select-text--selected {
  background-color: #79c142;
}
    
/**
 * Page 4
 *
 */

.multiselect input {
  border: none !important;
}

/* Animation
-------------------------------------------*/
.icon-spinning {
  -animation: spin1 .7s infinite linear;
  -moz-animation: spin2 .7s infinite linear;
  -webkit-animation: spin3 .7s infinite linear;
}

@-webkit-keyframes spin3 {
  from { -webkit-transform: rotate(0deg);}
  to { -webkit-transform: rotate(360deg);}
}

@-moz-keyframes spin2 {
  from { -webkit-transform: rotate(0deg);}
  to { -webkit-transform: rotate(360deg);}
}

@keyframes spin1 {
  from { transform: scale(1) rotate(0deg);}
  to { transform: scale(1) rotate(360deg);}
}