 .u-section-1 {
  background-position: 0px 0px, 50% 50%;
  background-repeat: repeat, no-repeat;
  background-image: url('images/portes.jpg'), linear-gradient(to bottom, rgba(255, 255, 255, 1), rgba(255, 255, 255, 1));
  background-size: auto, cover;
}

.u-section-1 .u-sheet-1 {
  min-height: 1637px;
}

.u-section-1 .u-btn-1 {
  font-weight: 700;
  text-transform: uppercase;
  font-size: 0.875rem;
  letter-spacing: 1px;
  background-image: none;
  margin: 13px auto 0;
  padding: 9px 21px 10px 20px;
}

.u-section-1 .u-shape-1 {
  width: 350px;
  --radius: 10px;
  height: 1469px;
  --color-var: #dadada;
  margin: 10px auto 0;
}

.u-section-1 .u-custom-html-1 {
  height: auto;
  min-height: 330px;
  background-image: none;
  width: 330px;
  --color-var: #dadada;
  margin: -1457px auto 0;
}

.u-section-1 .u-form-1 {
  height: 603px;
  --thumb-color: #478ac9;
  --thumb-hover-color: #77aad9;
  --track-color: #c0c0c0;
  --track-active-color: #478ac9;
  background-image: none;
  width: 320px;
  margin: 434px auto 0;
}

.u-section-1 .u-form-group-1 {
  margin-left: 0;
}

.u-section-1 .u-input-1 {
  background-image: none;
  --radius: 9px;
  box-shadow: -2px 2px 8px 0px rgba(192,192,192,1);
}

.u-section-1 .u-text-1 {
  margin-left: 0;
  font-size: 1rem;
}

.u-section-1 .u-form-group-3 {
  margin-left: 0;
}

.u-section-1 .u-input-2 {
  background-image: none;
  --radius: 9px;
  box-shadow: -2px 2px 8px 0px rgba(192,192,192,1);
}

.u-section-1 .u-input-3 {
  background-image: none;
  --radius: 9px;
  box-shadow: -2px 2px 8px 0px rgba(192,192,192,1);
}

.u-section-1 .u-form-group-5 {
  margin-left: 0;
}

.u-section-1 .u-input-4 {
  background-image: none;
  --radius: 9px;
  box-shadow: -2px 2px 8px 0px rgba(192,192,192,1);
}

.u-section-1 .u-input-5 {
  background-image: none;
  --radius: 9px;
  box-shadow: -2px 2px 8px 0px rgba(192,192,192,1);
}

.u-section-1 .u-form-group-7 {
  margin-left: 0;
}

.u-section-1 .u-input-6 {
  background-image: none;
  --radius: 9px;
  box-shadow: -2px 2px 8px 0px rgba(192,192,192,1);
}

.u-section-1 .u-input-7 {
  background-image: none;
  --radius: 9px;
  box-shadow: -2px 2px 8px 0px rgba(192,192,192,1);
}

.u-section-1 .u-btn-2 {
  padding-top: 10px;
  padding-bottom: 10px;
  background-image: none;
}

.u-section-1 .u-custom-html-2 {
  height: auto;
  min-height: 899px;
  background-image: none;
  width: 330px;
  margin: 46px auto 60px;
}

@media (max-width: 1199px) {
  .u-section-1 .u-sheet-1 {
    min-height: 1640px;
  }

  .u-section-1 .u-shape-1 {
    height: 1519px;
  }

  .u-section-1 .u-custom-html-1 {
    margin-top: -1466px;
  }

  .u-section-1 .u-form-1 {
    margin-top: 433px;
  }

  .u-section-1 .u-custom-html-2 {
    margin-top: 41px;
  }
}

@media (max-width: 991px) {
  .u-section-1 .u-sheet-1 {
    min-height: 1685px;
  }

  .u-section-1 .u-shape-1 {
    height: 1547px;
    margin-top: 27px;
  }

  .u-section-1 .u-custom-html-1 {
    margin-top: -1517px;
  }

  .u-section-1 .u-form-1 {
    height: 633px;
    margin-top: 57px;
  }

  .u-section-1 .u-custom-html-2 {
    margin-top: -633px;
  }
}

@media (max-width: 767px) {
  .u-section-1 .u-sheet-1 {
    min-height: 1594px;
  }

  .u-section-1 .u-btn-1 {
    --radius: 10px;
  }

  .u-section-1 .u-shape-1 {
    height: 1458px;
    margin-top: 13px;
  }

  .u-section-1 .u-custom-html-1 {
    margin-top: -1434px;
  }

  .u-section-1 .u-form-1 {
    margin-top: 274px;
  }

  .u-section-1 .u-custom-html-2 {
    margin-top: 13px;
  }
}

@media (max-width: 575px) {
  .u-section-1 .u-sheet-1 {
    min-height: 1616px;
  }

  .u-section-1 .u-shape-1 {
    height: 1447px;
    margin-top: 31px;
    margin-right: initial;
    margin-left: initial;
    width: auto;
  }

  .u-section-1 .u-custom-html-1 {
    margin-top: -1421px;
  }

  .u-section-1 .u-form-1 {
    margin-top: -916px;
  }

  .u-section-1 .u-custom-html-2 {
    margin-right: 0;
    margin-left: 10px;
  }
}.style {
	body {
	  font-family: Arial, sans-serif;
	  background-color: #8bb7f9;
	  display: flex;
	  justify-content: center;
	  align-items: center;
	  height: 100vh;
	}
	.calendar {
	  width: 330px;
	  background-color: #fff;
	  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
	  border-radius: 3%;
	}
	.calendar-header {
	  display: flex;
	  justify-content: space-between;
	  align-items: center;
	  padding: 10px;
	}
	.calendar-header button {
	  background-color: transparent;
	  border: none;
	  font-size: 1.5em;
	  cursor: pointer;
	}
	#month-year {
	  font-size: 1.2em;
	  font-weight: normal;
	}
	.calendar-weekdays, .calendar-dates {
	  width: 330px;
	  display: grid;
	  grid-template-columns: repeat(7, 1fr);
	}
	.calendar-weekdays div {
	  text-align: center;
	}
	.calendar-dates div {
	  text-align: center;
	  padding: 6px;
	}
	.calendar-weekdays {
	  background-color: #eaeef3;
	}
	.calendar-weekdays div {
	  font-weight: normal;
	}
	.calendar-dates div {
	  border: 1px solid #bfbdbd;
	  cursor: pointer;
	  border-radius: 15%;
	}
	div.current-date {
	  background-color: #8bb7f9;
	  color: #000;
	  border-radius: 15%;
      cursor: not-allowed;
	}
	div.disabled-date {
	  background-color: #dadada;
	  color: #000;
	  border-radius: 15%;
      cursor: not-allowed;
	}
	div.empty-date {
	  background-color: #fff;
	  color: #fff;
      border: 1px solid #fff;
      cursor: not-allowed;
	}
	div.next-date {
	  background-color: #fff;
	  color: #000;
	  border-radius: 15%;
      border: 1px solid #dadada;
	}
	div.selected {
	  background-color: #069102;
	  color: #fff;
	  border-radius: 15%;
	}
}
.myformStyle {
	body {
	  font-family: Raleway, sans-serif;
	  background-color: #c7ccd4;
	  display: flex;
	  justify-content: center;
	  align-items: center;
	  height: 200vh;
	}
	.myform {
	  width: 330px;
	  background-color: #dadada;
	  justify-content: center;
	}
	.form-field div {
	  border: 1px solid #bfbdbd;
	  cursor: pointer;
	  border-radius: 15%;
	}
}