/*!**********************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[13].oneOf[12].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[13].oneOf[12].use[3]!./src/components/UWrapper/UWrapper.css ***!
  \**********************************************************************************************************************************************************************************************************************************************************************************/
/* This is a workaround for Storybook. Comment this if you dont develop. */
/* @import url('../../app/globals.css'); */

.universal-tile {
  background-color: var(--tile-background);
  border-radius: 15px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
  padding: 20px;
  border: 1px solid transparent;
}

.universal-tile.error {
  border-color: var(--color-red);
}

.universal-tile-title {
  margin-bottom: 20px;
  color: var(--text-dark);
  text-align: center;
}

.universal-tile-content {
  text-align: center;
}

.universal-tile-content .wmde-markdown {
  text-align: left;
}

.universal-tile-link {
  display: block;
  transition: transform 0.2s;
  color: var(--text-regular);
}

.universal-tile-link:hover {
  transform: scale(1.05);
}
.universal-tile-link:hover .universal-tile {
  border: 2px solid var(--main);
}

.universal-tile-link:hover .universal-tile-title {
  text-decoration: underline;
}

.universal-tile-error-message {
  color: var(--color-dark-red);
  text-align: center;
  margin-bottom: 20px;
}

/*!**************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[13].oneOf[12].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[13].oneOf[12].use[3]!./src/components/HomePages/BeforeLogin.css ***!
  \**************************************************************************************************************************************************************************************************************************************************************************************/
.before-login-back-link {
  margin-bottom: 35px;
}

.welcome-message-container {
  margin-bottom: 40px;
}

.welcome-message-container .universal-tile-content {
  text-align: left;
}

.welcome-message-row-first {
  display: flex;
  padding-bottom: 15px;
}

.welcome-message-row-first div {
  flex: 1 1;
  font-size: 1.25rem;
  color: var(--text-dark);
}

.welcome-message-row-second {
  display: flex;
}

.welcome-message-row-second div {
  padding-right: 30px;
}

.welcome-message-description-1 {
  margin-bottom: 15px;
}

.home-tile-container {
  display: flex;
  gap: 30px;
  min-height: 400px;
  margin-bottom: 40px;
}

.home-tile-container .home-tile-content,
.home-tile-container .home-tile-content .universal-tile-link {
  flex: 1 1;
  display: flex;
  flex-direction: column;
}

.home-tile-content .universal-tile {
  flex: 1 1;
}

.home-tile-content .universal-tile-content {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.home-tile-content .home-tile-icon-container {
  flex: 1 1;
}

.home-tile-content .home-tile-icon {
  font-size: 7.5rem;
  position: relative;
  top: 50%;
  transform: translate(0, -50%);
}

.home-tile-content.registration .home-tile-icon {
  color: var(--color-dark-red);
}

.home-tile-content.guides .home-tile-icon {
  color: var(--main);
}

.home-tile-content .home-tile-buttons button {
  margin: 0 8px;
}

.partners-container .universal-tile-content {
  display: flex;
  gap: 20px;
  justify-content: center;
}

.partners-content {
  width: 120px;
}

.partners-description {
  font-size: 0.75rem;
  font-style: italic;
}

.youtube-video {
  width: 100%;
  height: 100%;
  border: none;
  border-radius: 10px;
}

.home-page-video-description {
  margin-bottom: 15px;
}

/*!*************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[13].oneOf[12].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[13].oneOf[12].use[3]!./src/components/HomePages/AfterLogin.css ***!
  \*************************************************************************************************************************************************************************************************************************************************************************************/
.home-page-container {
  display: flex;
  flex-wrap: wrap;
  gap: 15px 30px;
  margin-top: 15px;
}

.home-page-container .home-page-item {
  flex: 1 1;
}

.home-page-container .home-page-item.placeholder {
  visibility: hidden;
}

.home-page-container .universal-tile {
  height: 280px;
}

.home-page-container .universal-tile-content {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.home-page-container .tile-icon-container {
  flex: 1 1;
}

.home-page-container .tile-icon {
  font-size: 7.5rem;
  position: relative;
  top: 50%;
  transform: translate(0, -50%);
}

.home-page-container .tile-icon.guides {
  color: var(--main);
}

.questionnarie-greeting {
  margin-bottom: 15px;
}

.questionnarie-description {
  margin-bottom: 10px;
}

.questionnarie-acceptance {
  margin-bottom: 10px;
}

.questionnarie-checkbox {
  margin-bottom: 25px;
}

.questionnarie-checkbox input {
  margin-right: 7px;
}

.questionnarie-buttons {
  text-align: center;
}

.questionnarie-buttons .further-button {
  margin-right: 15px;
}

.dashboard-modal {
  text-align: center;
}

.dashboard-modal .modal {
  width: 650px;
}

.dashboard-modal-text {
  margin-bottom: 20px;
  font-size: 20px;
  margin-top: 20px;
}

.dashboard-modal-icon {
  font-size: 56px;
  margin-bottom: 30px;
}

.before-login-back-link {
  margin-bottom: 35px;
}