/*!***************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** 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]!./app/components/BrowseBySubject/styles.css ***!
  \***************************************************************************************************************************************************************************************************************************************************************************************/
.browse-by-subject {
        clip-path: url(#browse-by-subject-responsive);

        @media(min-width:1280px) {
                clip-path: url(#browse-by-subject);
        }
}
/*!**************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** 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]!./app/components/ui/styles.css ***!
  \**************************************************************************************************************************************************************************************************************************************************************************/
.button--icon {
  gap: 0px;
}

.button--icon::after {
  margin-inline-start: 0.5rem;
  width: 1rem;
  height: 1rem;
  background-color: currentColor;
  line-height: 1;
  transition-property: transform;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 300ms;
  content: var(--tw-content);
  animation-duration: 300ms;
}

.button--arrow:hover::after {
  content: var(--tw-content);
  --tw-rotate: 45deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.button--arrow {

  &:where([dir="ltr"], [dir="ltr"] *):hover::after {
    --tw-rotate: 45deg;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  }

  &:where([dir="rtl"], [dir="rtl"] *)::after {
    --tw-scale-x: -1;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  }

  &:where([dir="rtl"], [dir="rtl"] *):hover::after {
    --tw-rotate: -45deg;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  }

  &::after {
    --arrow-up-right-icon: url('data:image/svg+xml,<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M3 13L13 3" stroke="%23F7F7F7" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/><path d="M13 13V3H3" stroke="%23F7F7F7" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>');
    mask-image: var(--arrow-up-right-icon);
  }
}
/*!************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** 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]!./app/components/LatestPublicationsSwiper/styles.css ***!
  \************************************************************************************************************************************************************************************************************************************************************************************************/
.emblor > div{
overflow: visible;
}
/*!***************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** 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]!./app/components/MainHeroSection/styles.css ***!
  \***************************************************************************************************************************************************************************************************************************************************************************************/
.hero-section__top-video{
    clip-path: url("#hero-top-video");
}
.hero-section__bottom-video{
    clip-path: url("#hero-bottom-video");
}
/*!*************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** 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]!./app/components/PublishWithUs/styles.css ***!
  \*************************************************************************************************************************************************************************************************************************************************************************************/
.publish-with-us-container,
.polygon {
  clip-path: url("#publish-with-us-container");

  @media(min-width:1280px) {
    clip-path: url("#publish-with-us-container-desktop");
  }
}

.polygon {
  position: relative;
  min-height: 570px;
  background: var(--color-white-400);

  @media(min-width:1280px) {
    min-height: 410px;
  }
}

.publish-with-us-container.relative {
  position: absolute;
  top: 2px;
  /* equal to border thickness */
  inset-inline-start: 2px;
  /* equal to border thickness */
  width: calc(100% - 4px);
  /* container height - (border thickness * 2) */
  height: calc(100% - 4px);

  /* container height - (border thickness * 2) */
  @media(min-width:1280px) {
    top: 1px;
    inset-inline-start: 1px;
    width: calc(100% - 2px);
    height: calc(100% - 2px);
  }

  background: var(--color-white-200);
}


.publish-with-us-image {
  clip-path: url("#publish-with-us-image");
}
/*!***************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** 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]!./app/components/UpComingCarouselConferences/styles.css ***!
  \***************************************************************************************************************************************************************************************************************************************************************************************************/
.emblor > div{
overflow: visible;
}
