:root{
  --mel-white: #ffffff;
  --mel-black: #000000;
  --mel-red: #ed0404;
  --mel-yellow: #fdc332;
  --mel-yellow-trans: #fdc33255;
  --mel-blue: #0b406b;
  --mel-cyan: #9ad2cb;
  --mel-dark-cyan: #218c7e;
  --mel-med-dark-cyan: #6db9af;
  --mel-grey-light: #f6f6f6;
  --mel-grey: #cacaca;
  --mel-top-grey: #9b9b9b;
  --mel-mid-grey: #707070;
  --mel-dark-grey: #2e2e2e;
  --mel-dark-grey-hl: #4f4f4f;
  --mel-beige: #fdf4ed;

  --bg-color: #fff;
  --text-color: #1a1a1a;
  --text-grey: #3d3d3d;

  --link: #1d95b6;
  --link-hover: #286373;

  --content-nav: var(--mel-med-dark-cyan);
  --content-nav-open: var(--mel-dark-cyan);

  --cool-gradient: linear-gradient(125deg, #ff648b, #1671ff);

  /* Departments */
  --dep-ects: rgb(122, 193, 66);
  --dep-ects-trans: rgb(122, 193, 66, 0.6);
  --dep-ects-trans-dark: rgba(17, 34, 3, 0.87);
  --dep-eceo: rgb(197, 0, 110);
  --dep-eceo-trans: rgb(197, 0, 110, 0.6);
  --dep-eceo-trans-dark: rgba(24, 2, 15, 0.87);
  --dep-ecati: rgb(126, 129, 190);
  --dep-ecati-trans: rgb(126, 129, 190, 0.6);
  --dep-ecati-trans-dark: rgba(2, 6, 41, 0.87);
  --dep-epcv: rgb(247, 151, 39);
  --dep-epcv-trans: rgb(247, 151, 39, 0.6);
  --dep-epcv-trans-dark: rgba(43, 22, 2, 0.87);
  --dep-fcsea: rgb(184, 89, 20);
  --dep-fcsea-trans: rgb(184, 89, 20, 0.6);
  --dep-fcsea-trans-dark: rgba(36, 17, 4, 0.87);
  --dep-fd: rgb(226, 24, 54);
  --dep-fd-trans: rgb(226, 24, 54, 0.6);
  --dep-fd-trans-dark: rgba(35, 4, 8, 0.87);
  --dep-fefd: rgb(124, 53, 31);
  --dep-fefd-trans: rgb(124, 53, 31, 0.6);
  --dep-fefd-trans-dark: rgba(37, 12, 5, 0.87);
  --dep-fe: rgb(0, 146, 208);
  --dep-fe-trans: rgb(0, 146, 208, 0.6);
  --dep-fe-trans-dark: rgba(4, 25, 34, 0.87);
  --dep-fmv: rgb(253, 186, 48);
  --dep-fmv-trans: rgb(253, 186, 48, 0.6);
  --dep-fmv-trans-dark: rgba(37, 26, 2, 0.87);
  --dep-iss: rgb(7, 94, 84);
  --dep-iss-trans: rgb(7, 94, 84, 0.6);
  --dep-iss-trans-dark: rgba(3, 33, 29, 0.87);

  --dep-fdcp: rgb(224, 32, 58);
  --dep-fdcp-trans: rgb(224, 32, 58, 0.6);
  --dep-fdcp-trans-dark: rgba(57, 8, 15, 0.87);
  --dep-fcese: rgb(194, 20, 111);
  --dep-fcese-trans: rgb(194, 20, 111, 0.6);
  --dep-fcese-trans-dark: rgba(50, 5, 29, 0.87);
  --dep-fcaati: rgb(113, 120, 177);
  --dep-fcaati-trans: rgb(113, 120, 177, 0.6);
  --dep-fcaati-trans-dark: rgba(26, 27, 40, 0.87);
  --dep-fcnet: rgb(43, 175, 229);
  --dep-fcnet-trans: rgb(43, 175, 229, 0.6);
  --dep-fcnet-trans-dark: rgba(11, 43, 56, 0.87);
  --dep-fped: rgb(232, 122, 5);
  --dep-fped-trans: rgb(232, 122, 5, 0.6);
  --dep-fped-trans-dark: rgba(21, 11, 0, 0.87);
}

/* Sizes */
:root{
  --max-width: 1500px;
  --page-container-padding: 20px;
  --page-container-gap: 50px;
  --ul-mobile-only-pad: 30px;
  --ul-mobile-only-pad-small: 30px;

	--quick-bar-width: 50px;
  --notice-height: 40px;
  --logo-width: 300px;
  --logo-height: 35px;
  --header-height: 100px;
  --scrollbar: 17px;
}
body.header-extra-svg{
  --logo-width: 450px;
}

@media (max-width: 1500px){
	:root{
		--max-width: 1250px;
	}
}
@media (max-width: 1249px){
  :root{
    --logo-width: 200px;
    --logo-height: 25px;
    --header-height: 60px;
  }
  body.header-extra-svg{
    --logo-width: 290px;
  }
}
@media (max-width: 959px){
  :root{
    --ul-mobile-only-pad: 0px;
    --ul-mobile-only-pad-small: 0px;
  }
}
@media (max-width: 767px){
  :root{
		--quick-bar-width: 0px;
  }
}
@media (max-width: 639px){
  :root{
  	--page-container-padding: 10px;
  }
}
@media (max-width: 420px){
  :root{
    --logo-width: 170px;
    --logo-height: 22px;
  }
}

@-moz-document url-prefix() {
  :root{
    --scrollbar: 17px;
  }
}

html{
  scroll-behavior: smooth;
}
html:not(a) body{
  font-family: "Mulish", sans-serif;
}
body{
  overflow: auto;
}
*{
  box-sizing: border-box;
}
a{
  /* color: currentColor; */
  color: var(--mel-red);
}
a:not([class]):hover,
a.ul-red:hover{
  color: var(--mel-red);
}
a.focus-style:focus{
  background: var(--mel-red) !important;
  color: white !important;
  outline: none;
  padding: 0px 5px;
}
a[external]::after{
  content: url('/assets/svg/link-external.svg');
  position: absolute;
  margin-left: 5px;
}
img{
  max-width: 100%;
  max-height: 100%;
}
iframe{
	max-width: 100%;
}
html body h1, html body h2, html body h3, html body h4, html body h5, html body h6{
  font-family: Montserrat, sans-serif;
  font-weight: 800;
}
html body :not(pre) code{
  display: block;
  padding: 10px;
  background: #333;
  color: white;
  white-space: pre-wrap;
}
.link-dark{
  color: black;
}
super {
  color: var(--mel-dark-grey);
  font-size: 0.75em;
  font-weight: 600;
  top: -0.75em;
  position: relative;
}
:focus{
  outline: none !important;
}
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration {
  -webkit-appearance:none;
}

.ol-counter ol {
  counter-reset: ol-counter;
  list-style-type: none;
}
.ol-counter ol li::before {
  counter-increment: ol-counter;
  content: counters(ol-counter, ".") " ";
}

.badge-group .badge:not(:first-child){
  border-top-left-radius: 0px;
  border-bottom-left-radius: 0px;
  margin-left: 1px;
}
.badge-group .badge:not(:last-child){
  border-top-right-radius: 0px;
  border-bottom-right-radius: 0px;
}
.badge.badge-exam {
  background: var(--mel-beige);
  color: black;
  border-radius: 100px;
  padding: 5px 10px;
  font-weight: normal;
  font-size: 14px;
  border: 1px solid;
}

.ul-highlight{
  outline: 4px solid var(--mel-cyan);
  outline-offset: -4px;
}

/* TABLES */
table{
  border-collapse: collapse;
}
tr{
  border-bottom: solid;
  border-color: #e6e6e6;
  border-width: 1px 0;
}
td{
  padding-bottom: 10px;
  padding-top: 10px;
  padding-left: 10px;
}
th{
  padding-bottom: 10px;
  padding-top: 10px;
  background: #f2f2f2;
  padding-left: 10px;
}

/* HTTP ERROR */
#http-error {
  display: flex;
  flex-direction: column;
  height: 500px;
  align-items: center;
  justify-content: center;
}
#http-error h1{
  font-size: 100px;
  margin: 0;
}
#http-error p{
  font-size: 40px;
  margin: 0;
}

/* GDPR */
#cookie-notice {
  position: fixed;
  right: 0; bottom: 0;
  z-index: 100;
  background: rgba(0,0,0,0.9);
  width: 100%;
  max-width: 550px;
  padding: 30px;
  color: white;
}
#cookie-title{
  font-size: 18px;
  font-family: Montserrat;
  margin-bottom: 10px;
  font-weight: 600;
  text-transform: uppercase;
}
#cookie-title + *{
  font-size: 14px;
  line-height: 1.2em;
}
.cookie-notice-buttons{
	display: flex;
  justify-content: flex-end;
  gap: 7px;
  margin-top: 20px;
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
}
.cookie-notice-buttons > *{
	padding: 8px 20px;
	cursor: pointer;
  border: 1px solid white;
}
.cookie-notice-buttons > .less-important{
  border-color: var(--mel-top-grey);
  color: var(--mel-top-grey);
}
.cookie-notice-buttons > *:hover{
  border-color: var(--mel-red);
  background: var(--mel-red);
  color: white;
}

#cookie-notice:not(.choose) #cookie-notice-choose,
#cookie-notice.choose #cookie-notice-start{
	display: none;
}

#cookie-notice-checks {
	display: grid;
	grid-template-columns: 1fr;
  grid-gap: 10px;
}
.cookie-notice-check{
	display: grid;
	grid-template-columns: 1fr max-content;
	cursor: pointer;
  line-height: 1em;
}

@media (max-width:550px){
  .cookie-notice-buttons{
    flex-direction: column;
    gap: 10px;
  }
}

/* RD STATION */
[id^="rd-column-"] > div{
  background: #fafafa !important;
}
@media (min-width: 960px){
  [id^="rd-form-"]{
    margin-bottom: 0 !important;
  }
  [id^="rd-form-"] > form{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    align-items: center;
    gap: 10px;

    max-width: var(--max-width) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    width: 100% !important;
  }
  [id^="rd-form-"] > form > .bricks-form__fieldset{
    display: contents !important;
  }
  [id^="rd-form-"] > form > .bricks-form__fieldset > *{
    margin: 0 !important;
  }
  [id^="rd-form-"] > form > .bricks-form__fieldset input[type="text"],
  [id^="rd-form-"] > form > .bricks-form__fieldset input[type="email"]{
    height: 46px !important;
    padding: 10px 15px !important;
  }
  [id^="rd-form-"] > form > .bricks-form__fieldset > :last-child{
    grid-column: 1/4;
    grid-row: 2/3;
  }
  [id^="rd-form-"] > form > .bricks-form__submit > button{
    height: 46px !important;
    margin: 0 !important;
  }
  [id^="rd-text-"]{
    max-width: var(--max-width) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    width: 100% !important;
    min-width: auto !important;
  }
}

body #bricks-component-BS4SYA4w6ciZsxJ3NbPRJg-wrapper,
body #bricks-component-BS4SYA4w6ciZsxJ3NbPRJg,
body #bricks-component-BS4SYA4w6ciZsxJ3NbPRJg > *{
	z-index: 9 !important;
}

#news-logo{
  display: flex;
  align-items: center;
  justify-content: center;
  height: 130px;
  padding: 23px;
  background: #25221f;
}
#news-logo svg{
  max-height: 100%;
}

/* Utils */
#back-button{
  position: absolute;
  bottom: 56px;
  right: 56px;
  width: 40px;
  height: 40px;
  fill: white;
  border: 2px solid var(--mel-white);
  border-radius: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
#back-button:hover{
  background: var(--mel-white);
  box-shadow: 0 0 10px rgba(0,0,0,0.5);
}
#back-button svg{
  position: relative;
  top: -2px;
  right: -1px;
  width: 19px;
  height: 27px;
  fill: white;
}
#back-button:hover svg{
  fill: var(--mel-red);
}

#ul-back{
  position: absolute;
  bottom: 20px;
  right: calc(var(--quick-bar-width) + var(--page-container-padding));
}
#svg-back{
  width: 40px;
  height: 40px;
  cursor: pointer;
  border-radius: 100%;
}
#svg-back circle{
  stroke: white;
}
#svg-back.inverted circle{
  stroke: black;
}
#svg-back:hover circle{
  stroke: var(--mel-red);
  fill: white;
}
#svg-back path{
  fill: white;
}
#svg-back.inverted path{
  fill: black;
}
#svg-back:hover path{
  fill: var(--mel-red);
}

.noselect {
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Old versions of Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome, Edge, Opera and Firefox */
}

.max-width{
  width: 100%;
  max-width: var(--max-width);
  margin-left: auto;
  margin-right: auto;
}
.max-padding{
	padding: 0px var(--page-container-padding);
	padding-right: calc(var(--page-container-padding) + var(--quick-bar-width))
}
.margin-auto{
  margin-right: auto !important;
  margin-left: auto !important;
}
.color-square{
  display: inline-block;
  width: 8px;
  height: 8px;
}

.pre-wrap{
  white-space: pre-wrap;
}
.white-space-normal{
  white-space: normal;
}
.underline{
  text-decoration: underline;
}
.pad-container{
  padding: 20px !important;
}
[columns="2"]{
  columns: 2;
}
.color-invert{
  background: var(--mel-black);
  color: var(--mel-white);
}

.big-avatar{
  width: 250px;
  height: 250px;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  border-radius: 100%;
}
img.big-avatar{
  object-fit: cover;
}

.plus{
  position: relative;
  font-size: 30px;
  width: 1em; height: 1em;
  color: var(--mel-black);
}
.plus::before,
.plus::after{
  content:"";
  position: absolute;
  top:50%; left: 50%;
  transform: translate(-50%, -50%);
  background: currentColor;
}
.plus::before{
  width: 0.1em;
  height: 1em;
}
.plus::after{
  width: 1em;
  height: 0.1em;
}

.inline-list{
  display: flex;
  flex-wrap: wrap;
  padding: 0;
  margin: 0;
  margin-bottom: 20px;
}
.inline-list li{
  list-style: none;
}
.inline-list li:not(:last-child)::after{
  content: " | ";
  margin-left: 2px;
  margin-right: 4px;
}
.inline-list li.no-separator{
  margin-right: 8px;
}
.inline-list li.no-separator:not(:last-child)::after{
  display: none;
}

.mel-component-error code{
  margin-top: 10px;
}

.enroll-button {
  background: var(--mel-red);
  color: white;
  padding: 15px 20px;
  width: 100%;
  display: block;
  text-align: center;
  font-size: 18px;
}

hr.dashed{
  border-style: dashed;
  border-color: black;
}

/* BASE */
html{
  background-color: var(--bg-color);
  color: var(--text-color);
}
body{
  margin: 0;
  padding: 0;
  padding-top: var(--header-height);
  background-color: var(--bg-color);
}
body.scroll-lock{
  position: fixed;
  left: 0;
  overflow-y: scroll !important;
  width: 100%;
  height: 100%;
}
body.clear-header{
  padding-top: 0;
}
body.with-notice.show-notice.clear-header {
  padding-top: 40px;
}
body.with-notice.show-notice:not(.clear-header) {
  padding-top: calc(var(--header-height) + 40px);
}

#ul-notice:not(.show){
  display: none;
}
#ul-notice{
  position: fixed;
  width: 100%;
  color: white;
  background: var(--mel-blue);
  padding: 0px 40px;
  top: 0;
  height: var(--notice-height);
  z-index: 10000;
  line-height: var(--notice-height);
  text-align: center;
  overflow: hidden;
}
#ul-notice * {
  margin: 0;
  color: white;
}
#ul-notice a {
  color: white;
  text-decoration: underline;
}
#ul-notice [uk-close] {
  position: absolute;
  top: 0;
  right: 0;
  color: white;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.ul-notice-marquee{
  position: relative;
  display: inline-block;
  white-space: nowrap;
  transform: translateX(100%);
  animation: notice 10s linear infinite;
}
.ul-notice-marquee.no-marquee{
	transform: none;
	animation: none;
}

@keyframes notice {
  0% {
    transform: translateX(0%);
    left: 100%;
  }
  100% {
    transform: translateX(-100%);
    left: 0%;
  }
}

body header{
  position: fixed;
  top: 0; left: 0;
  width: 100%;
  display: flex;
  align-items: center;
  height: var(--header-height);
  color: var(--mel-black);
  box-shadow: 0 0 10px rgba(0,0,0,0.2);
  z-index: 1000;
  transition: color 100ms ease-in-out;
}
#ul-notice.show + script + header{
  margin-top: var(--notice-height);
}
header #logo{
  position: relative;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  width: var(--logo-width);
  background: black;
  transition: background 250ms ease-in-out;
}
header #logo > *{
  z-index: 1;
  pointer-events: none;
}
header #logo .logo-gif{
  display: none;
  position: absolute;
  top: 0; left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
body.clear-header.scroll header #logo:hover .logo-gif,
body:not(.clear-header) header #logo:hover .logo-gif{
  display: block;
}
body.header-extra-svg header #logo{
  /* justify-content: space-around; */
}
body.header-extra-svg header #logo svg{
  max-height: 70%;
  margin-left: 20px;
}
body.clear-header.blur-header header #logo{
  backdrop-filter: blur(10px);
}
body.clear-header.blur-header:not(.scroll) header #logo{
  background: rgba(0,0,0,0.5);
}
header #logo img{
  height: var(--logo-height);
}
header a{
  color: currentColor;
}
header #header-rest{
  flex-grow: 1;
  flex-shrink: 0;
  position: relative;
  display: flex;
  height: 100%;
  padding: 20px;
  background: white;
  transition: background 250ms ease-in-out;
}
body.clear-header:not(.black-header):not(.scroll):not(.scroll-lock) header{
  color: white;
}
body.clear-header:not(.scroll):not(.scroll-lock) header{
  box-shadow: none;
}
body.clear-header:not(.scroll):not(.scroll-lock) header,
body.clear-header:not(.scroll):not(.scroll-lock) header #logo,
body.clear-header:not(.scroll):not(.scroll-lock) header #header-rest{
  background: none;
}
body.clear-header header #header-open-search svg{
  transition: fill 250ms ease-in-out;
}
body.clear-header:not(.black-header):not(.scroll):not(.scroll-lock) header #header-open-search svg{
  fill: white;
}
body.clear-header:not(.scroll):not(.scroll-lock) header #header-close-side-menu{
  background: var(--mel-black);
}
body.clear-header:not(.black-header):not(.scroll):not(.scroll-lock) header #header-search a{
  color: var(--mel-black);
}
body.clear-header:not(.black-header):not(.scroll):not(.scroll-lock) header #header-lang a:not(.lang-selected){
  color: white;
}
#header-logo-right{
  display: flex;
  align-items: center;
  justify-content: center;
  max-width: 140px;
  width: 100%;
  height: 100%;
  padding: 15px 20px;
  transition: background 250ms ease-in-out;
}

body:not(.clear-header) #header-logo-right,
body.clear-header.scroll #header-logo-right,
body.clear-header.scroll-lock #header-logo-right{
  background: #1caacb;
}

@media (max-width: 1400px){
  #header-logo-right{
    display: none;
  }
}


#header-menu{
  display: flex;
  align-items: center;
}
#header-menu a{
  position: relative;
  padding: 10px 10px;
  margin: 0px 10px;
  font-size: 18px;

  overflow: hidden;
  text-decoration: none;
  /* transition: color 100ms ease-in-out; */
}
#header-menu a.cool-gradient{
  padding-left: 15px;
  padding-right: 15px;
}

#header-menu a::before{
  content:"";
  position: absolute;
  width: 100%;
  height: 2px;
  bottom: 0; left: 0;
  background: var(--mel-red);
  transform: translateX(-102%);
  transition: transform 100ms ease-in-out;
}
#header-menu a.cool-gradient::before{
  content: none;
}
#header-menu a:hover::before{
  transform: translateX(0);
}
#header-menu a:hover{
  text-decoration: none;
  color: var(--mel-red);
  /* border-top: 2px solid transparent;
  border-bottom: 2px solid var(--mel-red); */
}
#header-open-side-menu{
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0px 5px;
  padding: 10px;
  cursor: pointer;
}
#header-open-side-menu:hover{
  color: var(--mel-red);
}
#header-open-side-menu > :not(:last-child){
  width: 90px;
  text-align: right;
  font-size: 14px;
  font-weight: 600;
}
#header-open-side-menu:not(.active) > :nth-child(2){
  display: none;
}
#header-open-side-menu.active > :nth-child(1){
  display: none;
}
#header-right{
  margin-left: auto;
  display: flex;
  align-items: center;
}
#header-lang{
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: auto;
}
#header-lang a{
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  color: var(--mel-black);
  transition: color 100ms ease-in-out;
}
#header-lang .lang-selected{
  background: var(--mel-white);
  color: var(--mel-black);
  border:2px solid var(--mel-black);
  pointer-events: none;
}

#header-open-search{
  flex-shrink: 0;
  display: flex;
  align-items: center;
  padding: 10px;
  margin: 0px 10px;
}
#header-open-search svg{
  width: 27px;
  height: 27px;
  fill: var(--mel-black);
}
#header-open-search svg{
  transition: fill 250ms ease-in-out;
}
#header-open-search:hover svg,
body.clear-header:not(.black-header):not(.scroll) header #header-open-search:hover svg{
  fill: var(--mel-red);
}

#header-search{
  position: absolute;
  top: 0; left: 0;
  width: 100%;
  height: 100%;
  background: white;
  transition: transform 100ms ease-in-out;
}
#header-search:not(.open){
  transform: translateY(-100%);
}
#header-search #header-search-input-wrapper{
  display: flex;
  align-items: center;
  width: 100%;
  height: 100%;
  padding: 20px;
  overflow: hidden;
}
#header-search #header-search-input-wrapper input{
  width: 100%;
  padding: 35px 10px;
  font-size: 20px;
  outline: none;
  border: 0;
}
#header-search #header-search-input-wrapper input + a{
	flex-shrink: 0;
	display: flex;
	align-items: center;
	gap: 10px;

  margin: 5px;
  padding: 10px;
	text-decoration: none;
}
#header-search #header-search-input-wrapper input + a > :first-child{
  font-size: 14px;
	font-weight: 600;
}
#header-search #header-search-input-wrapper input + a > :last-child{
  display: inline-block;
}


#header-search-results{
  display: none;
  position: absolute;
  left: 0; bottom: 0;
  width: 100%;
  height: calc(100vh - var(--header-height));
  background: var(--mel-beige);
  transition: transform 250ms ease-in-out;
  z-index: -1;
}
#header-search-results.open{
  transform: translateY(100%);
}
.header-search-results-wrapper{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  padding: 50px;
  grid-gap: 100px;
}
.header-search-result-group h3 {
  padding: 20px 0px;
  border-bottom: 1px solid var(--mel-grey);
  font-size: 20px;
  text-transform: uppercase;
}
.header-search-result-group-inner{
  padding: 20px;
}
.header-search-result-group-inner > * {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.header-search-result-group-inner > * > a.underline{
  color: var(--mel-blue);
  display: inline-block;
  margin-top: 10px;
}

#header-quick-search {
  position: absolute;
  bottom: calc(var(--header-height) + 1px);
  left: 0;
  width: 100%;
	height: calc(100vh - var(--header-height));
  padding-left: var(--logo-width);
  pointer-events: none;
  transition: transform 250ms ease-in-out;
	overflow: auto;
  z-index: -1;
  color: black;
}
#header-quick-search.open{
  transform: translateY(calc(100% + var(--header-height)));
}
#header-quick-search-inner{
  width: 100%;
  background: var(--mel-white);
  pointer-events: all;
}
#header-quick-search-inner:not(:empty){
  padding: 5px 15px;
  box-shadow: 0px 0px 0px 1px black;
}
#header-quick-search-inner .search-result{
  max-width: 1000px;
  font-size: 12px;
  padding: 10px 15px;
  margin: 4px 0px;
  text-decoration: none;
}
#header-quick-search-inner .search-result:focus-within{
  background: var(--mel-beige);
}
#header-quick-search-inner a.search-result:hover{
  background: var(--mel-beige);
}
#header-quick-search-inner .relation{
  font-size: 1em;
}



#header-close-side-menu{
  position: absolute;
  top: 0; left: 0;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  width: 100%;
  height: 100%;
  padding: 20px;
  background: white;
  transition: transform 100ms ease-in-out;
}
#header-close-side-menu:not(.open){
  transform: translateY(-100%);
}
#header-close-side-menu > #header-close-side-menu-button{
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 10px;
  cursor: pointer;
  text-decoration: underline;
}
#header-close-side-menu > #header-close-side-menu-button:hover{
  color: var(--mel-red);
}
#header-side-menu{
  position: absolute;
  bottom: var(--header-height); left: 0;
  z-index: -1;
  width: 100%;
  height: 100vh;
  padding: 5vw;
  padding-top: calc(5vw + var(--header-height));
  background: var(--mel-black);
  color: var(--mel-white);
  overflow-y: auto;
  transition: transform 250ms ease-in-out;
}
#header-side-menu.open{
  transform: translateY(100%);
}
#header-side-menu-list{
  padding: 0;
  column-count: 3;
  gap: 5vw;
}
.header-side-menu-item{
  display: inline-grid;
  width: 100%;
  break-inside: avoid;
  margin-bottom: 20px;
}
.header-side-menu-parent{
  position: relative;
  font-family: "Mulish", sans-serif;
  font-size: 3vw;
  font-weight: 500;
  text-transform: uppercase;
  color: white;
  /* border-bottom: 4px solid var(--mel-blue); */
}
.header-side-menu-parent::before{
  content: "";
  position: absolute;
  right: 100%; top: 0;
  width: 0.2em;
  height: 100%;
  margin-right: 0.2em;
  background: var(--mel-red);
}
.header-side-menu-item a{
  font-family: "Mulish", sans-serif;
  font-weight: 500;
  text-transform: capitalize;
}
.header-side-menu-item ul{
  padding: 0;
  font-size: 2vw;
}
.header-side-menu-item li{
  list-style: none;
}

/* Top Banner */
#top-banner{
  position: relative;
  display: flex;
  align-items: center;
  padding: 50px var(--page-container-padding);
  /* commented out for faqs */
  /* padding-right: 150px; */
  max-width: var(--max-width);
  margin: auto;
}
#top-banner.ul-tall{
  height: 70vh;
}
#top-banner h1{
  color: black;
}
#top-banner h1 + p{
  font-family: Montserrat;
  font-weight: 600;
  color: #333;
}


#top-banner #animated-institution{
  position: absolute;
  top: -10%; left: 0;
  width: 100%; height: 130%;
  opacity: 0.7;
  pointer-events: none;
}
#animated-institution path{
  stroke-width: 1px;
}
#animated-institution.dark path{
  stroke: black;
}

/* Cool Gradient */
.cool-gradient{
  color: white !important;
  background-image: var(--cool-gradient);
  background-size: 150% 150%;
  background-position: center;
  transition: background-position 250ms ease-in-out !important;
}
.cool-gradient:hover{
  color: white !important;
  background-image: var(--cool-gradient);
  background-position: 0;
  transition: background-position 0ms ease-in-out !important;
}
.ul-button-cool{
  font-size: 18px;
  line-height: 1em;
  padding: 15px 20px;
  width: 300px;
  border: 0;
}
.ico-ext::after{
  content: url('/assets/svg/link-external.svg');
  filter: invert(1);
  margin-left: 10px;
}

/* Top Search */
.top-search{
  background: var(--mel-cyan);
  padding: 100px 0px;
}
.top-search h1{
  text-align: center;
  color: white;
}
.top-search .search-wrapper{
  display: flex;
  justify-content: center;
}

/* Api Search */
.api-search{
  position: relative;
  width: 500px;
}
.api-search input{
  position: relative;
  z-index: 1;
  width: 100%;
  height: 40px;
  padding: 0px 20px;
  border: none;
  border-radius: 20px;
  background: white;
  outline: none !important;
}
.api-search.open input{
  border-radius: 20px 20px 0px 0px;
}
.api-search .api-search-results{
  position: absolute;
  top: 100%; left: 0;
  width: 100%;
  height: 400px;
  background: white;
  box-shadow: 0px 0px 20px rgba(0,0,0,0.5);
  margin-top: 5px;
  border-radius: 0px 0px 20px 20px;
  overflow: auto;
}
.api-search:not(.open) .api-search-results{
  display: none;
}

/* Slideshow */
.ul-slideshow{
  position: relative;
  height: calc(80vh - var(--header-height));
}
.ul-slideshow-item:not(.active){
  display: none;
}
.ul-slideshow-item-img{
  position: absolute;
  width: 100%;
  height: 100%;
}
.ul-slideshow-item-img img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.ul-slideshow-text{
  height: 100%;
  position: absolute;
  padding-bottom: 150px;
  display: flex;
  align-items: center;
  padding-left: 50px;
  padding-right: 20px;
}

.ul-slideshow-nav{
  position: absolute;
  bottom: 0;
  display: grid;
  grid-auto-columns: 1fr;
  grid-auto-flow: column;
  width: 100%;
}
.ul-slideshow-nav-item{
  position: relative;
  padding: 20px;
}
.ul-slideshow-nav-bar {
  position: absolute;
  height: 10px;
  background: gray;
  width: 100%;
  bottom: 0;
  left: 0;
}
.ul-slideshow-nav-load {
  height: 100%;
}
.ul-slideshow-nav-item.active .ul-slideshow-nav-load{
  background: var(--mel-red);
}

.ul-slideshow.ul-light .ul-slideshow-nav-item,
.ul-slideshow.ul-light .ul-slideshow-nav-item p,
.ul-slideshow.ul-light .ul-slideshow-nav-item h5{
  color: black;
}
.ul-slideshow.ul-dark .ul-slideshow-nav-item,
.ul-slideshow.ul-dark .ul-slideshow-nav-item p,
.ul-slideshow.ul-dark .ul-slideshow-nav-item h5{
  color: white;
}
.ul-slideshow-nav-item:hover{
  text-decoration: none;
}


/* home h1 */
.home-section h1,
#index-indicator-title h1{
  font-weight: 800;
  font-size: 50px;
  color: black;
  line-height: 1em;
}
#index-indicator-title p{
	line-height: 1.3em;
}

/* Indicators */
#index-indicators{
  display: grid;
  grid-template-areas: "a b c" "a d e";
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: 1fr 1fr;
  /* background: rgba(0,0,0,0.5); */
  /* background-size: cover; */
  /* grid-gap: 20px; */
  /* padding: 50px; */
}
#index-indicator-title{
  grid-area: a;
  /* font-weight: 600; */
  /* font-size: 60px; */
  line-height: 1em;
  max-width: 400px;
  margin-right: 20px;
  margin-bottom: 20px;
}
.index-indicator {
  text-align: right;
  padding: 5vw 2vw;
  border: 1px solid currentColor;
  /* cursor: pointer; */
  color: black;
  transform: translateY(0px);
  transition: background 100ms ease-in-out;
}
.index-indicator:hover{
  background: var(--mel-red);
  color: var(--mel-red);
  text-decoration: none;
}
.index-indicator .index-indicator-inner{
  position: relative;
  width: 100%;
  height: 100%;
}
.index-indicator .index-indicator-inner * {
  /* color: white; */
}
.index-indicator h3 {
  font-family: Montserrat, sans-serif;
  font-weight: 600;
  font-size: 5vw;
  transition: transform 100ms ease-in-out, color 100ms ease-in-out;
}
.index-indicator:hover h3{
  transform: translateY(-2.5vw);
  color: white;
}
.index-indicator h3 svg{
  position: absolute;
  left: 0; top: 0.2em;
  width: 0.6em;
  height: 0.6em;
  padding: 5px;
  border-radius: 100%;
  background: var(--mel-red);
  fill: var(--mel-white);
  transition: background 100ms ease-in-out, fill 100ms ease-in-out;
}
.index-indicator:hover h3 svg{
  fill: var(--mel-red);
  background: var(--mel-white);
}
.index-indicator h3 > *{
  display: block;
  line-height: 1em;
}
.index-indicator h3 small {
  font-size: 1.3vw;
}
.index-indicator p{
  position: absolute;
  bottom: 0;
  right: 0;
  font-size: 1vw;
  line-height: 1.1em;
  opacity: 0;
  transition: opacity 100ms ease-in-out, transform 100ms ease-in-out, color 100ms ease-in-out;
}
.index-indicator:hover p{
  opacity: 1;
  transform: translateY(2.5vw);
  color: white;
}

/* home section */
.home-section{
  padding: 90px 50px;
}
.home-section-cols{
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 50px;
}
.home-section-cols-notice{
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  margin-top: 20px;
}

/* */
.bg-beige{
  background: var(--mel-beige);
}
.bg-red{
  background: var(--mel-red);
}

/* home form */
.home-form{
  width: 100%;
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 50px;
}
.home-form input:not([type="checkbox"]):not([type="radio"]), .home-form textarea {
  width: 100%;
  display: block;
  margin: 10px 0px;
  padding: 8px 10px;
  border: none;
  border-bottom: 1px solid var(--mel-mid-grey);
}
.home-form input:focus, .home-form textarea:focus{
  outline: none;
}
.home-form > :last-child{
  display: grid;
  align-content: flex-end;
}
.home-form textarea{
	margin-bottom: 0;
}
html body .home-form button{
  padding: 10px;
	background: white;
	padding: 15px;
	border: 1px solid black;
	font-size: 16px;
	font-weight: 600;
	text-transform: uppercase;
  transition: background 100ms ease-in-out, color 100ms ease-in-out;
}
html body .home-form button:hover{
  background: black !important;
  color: white !important;
  transition: 100ms ease-in-out;
}

/* */
.breadcrumbs{
  padding: 10px;
  background: #eee;
  margin: 0;
  background: none;
}
.breadcrumbs a{
  text-decoration: none;
}
.breadcrumbs span{
  opacity: 0.8;
}
.breadcrumbs li{
  display: inline;
  list-style: none;
}
.breadcrumbs li:not(:last-child)::after{
  content: " /";
}


.share-button{
  border: 1px solid var(--mel-grey) !important;
  display: inline-flex !important;
	justify-content: center;
	width: 42px;
	height: 42px;
}
.share-popup{
  position: absolute;
  z-index: 100;
  top: 100%;
  left: 0;
  background: white;
  border: 1px solid black;
  padding: 10px;
  margin-left: -1px;
}
.share-popup input{
  padding: 5px 10px;
}
.share-popup button{
  display: flex;
  align-items: center;
  background: white;
  border: none;
  width: 100%;
  padding: 5px;
  text-align: left;
  margin-top: 5px;
}
.share-popup button:hover{
  background: #eee;
}
.share-popup button svg{
  margin-right: 5px;
  width: 25px;
}


.copy-input{
	display: grid;
	grid-template-columns: auto max-content;
	align-items: center;
	max-width: 400px;
	margin: auto;
	border: 1px solid var(--mel-grey);
}
.copy-input label{
	display: grid;
	padding: 0px 15px;
	margin: 0;
}
.copy-input label span{
	font-size: 14px;
	color: var(--mel-mid-grey);
}
.copy-input input{
	border: none;
}
.copy-input button{
  display: grid;
  align-items: center;
  justify-items: center;
	width: 60px;
	height: 60px;
	border: none;
	background: none;
	border-left: 1px solid var(--mel-grey);
}
.copy-input button svg{
  grid-column: 1;
  grid-row: 1;
	fill: var(--mel-red);
  transition: opacity 100ms ease-in-out;
}
.copy-input:not(.ok) button svg:last-child{
  opacity: 0;
}
.copy-input.ok button svg:first-child{
  opacity: 0;
}

.social-container{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	margin-top: 10px;
}
.uk-icon.share-social {
	width: 45px;
	height: 45px;
  border-radius: 0;
  color: white;
}
.share-social[uk-icon="facebook"] {
  background: #4267B2;
}
.share-social[uk-icon="twitter"] {
  background: #1da1f2;
}

/* FOOTER */
#ul-footer-top {
  background: black;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
}
#ul-footer-top > #ul-footer-logo{
	align-self: center;
	justify-self: center;
	width: 50%;
}
.mail-form{
	position: relative;
	display: grid;
	padding: 40px;
  transition: background 250ms ease-in-out;
}
.mail-form:hover,
.mail-form:focus-within{
	background: var(--mel-red);
  transition: background 0ms ease-in-out;
}
.mail-form > svg{
	position: absolute;
	top: 20px; right: 20px;
}
.mail-form h3{
	margin-top: 0;
	color: white;
  transition: none;
}
.mail-form.mail-form-white h3{
  font-size: 30px;
  color: black;
  transition: color 250ms ease-in-out !important;
}
.mail-form input[type="text"],
.mail-form input[type="email"]{
	background: none;
	color: white;
	border: 0;
	border-bottom: 1px solid white;
	font-size: 20px;
	padding: 10px 0px;
	margin: 15px 0px;
  transition: none;
}
.mail-form.mail-form-white input[type="text"],
.mail-form.mail-form-white input[type="email"]{
	color: black;
	border-bottom: 1px solid black;
  transition: border-bottom 250ms ease-in-out, color 250ms ease-in-out !important;
}
.mail-form input[type="text"]::-webkit-input-placeholder,
.mail-form input[type="email"]::-webkit-input-placeholder{
	color: rgba(255, 255, 255, 0.7);
}
.mail-form.mail-form-white input[type="text"]::-webkit-input-placeholder,
.mail-form.mail-form-white input[type="email"]::-webkit-input-placeholder{
	color: rgba(0, 0, 0, 0.7);
}
.mail-form label{
	margin: 15px 0px;
	color: white;
  transition: none;
}
.mail-form.mail-form-white label{
  color: black;
  transition: color 250ms ease-in-out !important;
}
.mail-form label a{
	color: white;
	text-decoration: underline;
  transition: none;
}
.mail-form.mail-form-white label a{
  color: black;
  transition: color 250ms ease-in-out !important;
}
.mail-form label a:hover{
	color: white;
}
.mail-form button{
  text-transform: uppercase;
  font-weight: 600;
  width: 250px !important;
  justify-self: center;
  transition: background 250ms ease-in-out, color 250ms ease-in-out !important;
}
.mail-form.mail-form-white button{
  background: black;
  color: white;
}
.mail-form button:hover{
  background: black !important;
  color: white !important;
  border-color: transparent !important;
}
.mail-form:hover button,
.mail-form:focus-within button{
  background: black !important;
  color: white !important;
  transition: background 0ms ease-in-out !important;
}
.mail-form .simple-check input:checked + span{
  background: transparent;
  border: 2px solid white;
  transition: none;
}
.mail-form.mail-form-white .simple-check input:checked + span{
  border-color: black;
  transition: border-color 250ms ease-in-out !important;
}
.mail-form.mail-form-white .simple-check > input:checked + span::before{
  background: black;
  transition: background 250ms ease-in-out !important;
}

.mail-form.mail-form-small{
  padding: 0px;
  padding-top: 20px;
  padding-bottom: 60px;
}
.mail-form.mail-form-small button{
  position: absolute;
  bottom: 0;
  width: 100% !important;
  background: black;
  height: 50px;
  font-size: 18px;
}
.mail-form.mail-form-white:hover,
.mail-form.mail-form-white:focus-within{
	background: white;
}




.ul-footer-social{
	padding-left: 0;
  margin: 0;
	color: white;
}
.ul-footer-social > li{
	list-style:none;
  transition: background 250ms ease-in-out;
}
.ul-footer-social > li > *{
	display: flex;
	align-items: center;
	list-style:none;
	padding: 0px 70px 0px 20px;
	height: 60px;
	border-bottom: 1px dashed var(--mel-yellow);
	color: white;
}
.ul-footer-social > li > *:hover{
	color: white;
	text-decoration: none;
}
.ul-footer-social > li:hover{
	background: var(--mel-red);
  transition: background 0ms ease-in-out;
}
.ul-footer-social > li > * > :first-child{
	font-size: 18px;
	font-weight: 600;
}
.ul-footer-social > li > * > :nth-child(2){
	display: flex;
	margin-left: auto;
	align-self: stretch;
}
.ul-footer-social > li > * > :nth-child(2) > a{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 70px;
	color: white;
}
.ul-footer-social > li > * > :nth-child(2) > a:hover{
	background: white;
	color: var(--mel-red);
	text-decoration: none;
}
.ul-footer-social > li > * > :nth-child(2) > a > svg{
	width: 20px;
	fill: currentColor;
}
.ul-footer-social > li > * > :last-child > svg{
	width: 30px;
	height: 30px;
	margin-left: 20px;
	fill: white;
}


.index-blocks{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 50px;
	font-family: Montserrat;
  overflow: auto;
}
.index-blocks h3 {
	margin-top: 0;
}
.index-blocks svg {
	width: 40px;
	height: 40px;
	fill: var(--mel-red);
}
.index-blocks > * > a:last-child{
  display: inline-block;
  margin-top: 10px;
}

/* Campus */
#campus{
  overflow: hidden;
  height: calc(100vh - var(--header-height));
  background: linear-gradient(to right, #fff, #ded3cd);
}
#campus-wrapper{
  position: relative;
  display: inline-block;
}
#campus > #campus-wrapper > img{
  min-height: 100%;
}
#campus > #campus-wrapper > svg{
  position: absolute;
  top: 0; left: 0;
}
#campus > #campus-wrapper > svg.grey > :not(.selected){
  filter: grayscale(100%);
}

@media (max-width: 1249px){
  header #header-rest,
	#header-search #header-search-input-wrapper{
    padding: 10px;
  }
  #header-menu a{
    font-size: 16px;
    padding: 5px;
  }
  #header-open-side-menu > :not(:last-child){
    display: none;
  }

	#ul-footer-top > #ul-footer-logo{
		display: none;
	}
	#ul-footer-top {
	  grid-template-columns: repeat(2, 1fr);
	}
}
@media (max-width: 1199px){

  #index-indicators{
    height: auto;
    grid-template-areas:
      "a a"
      "b c"
      "d e"
    ;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: max-content repeat(2, 1fr);
  }
  #index-indicator-title{
    grid-area: a;
    padding: 0;
    max-width: none;
  }
  .index-indicator{
    padding: 40px;
  }
  .index-indicator h3{
    font-size: 30px;
  }
  .index-indicator h3 svg{
    top: 0;
  }
  .index-indicator h3 small {
    font-size: 16px;
  }
  .index-indicator p {
    font-size: 14px;
    line-height: 1.1em;
    margin: 0;
  }

  .index-indicator:hover h3{
    transform: translateY(-20px);
  }
  .index-indicator:hover p{
    transform: translateY(10px);
  }

}
@media (max-width: 959px){
  #header-menu{
    display: none;
  }
  #header-open-search{
    margin-left: auto;
  }
  #header-right{
    margin-left: 0px;
  }
  #header-quick-search{
    padding-left: 0px;
  }


  .home-form{
    grid-template-columns: 1fr;
    grid-gap: 20px;
  }

  .ul-slideshow-text{
    height: 100%;
    position: absolute;
    padding-bottom: 150px;
    display: flex;
    align-items: center;
    padding-left: 20px;
    padding-right: 20px;
    padding-bottom: 40px;
  }
  .ul-slideshow .uk-width-large{
    width: auto;
  }
  .ul-slideshow-nav-item > *:not(.ul-slideshow-nav-bar){
    display: none;
  }
  .ul-slideshow-nav-bar{
    width: 80%;
    margin: 10px 10%;
  }
  .ul-slideshow-nav-item.active .ul-slideshow-nav-load{
    background: var(--mel-yellow);
  }
	.max-padding{
		padding: 0px var(--page-container-padding);
		padding-right: var(--page-container-padding);
	}

	.ul-footer-social > li > *{
		padding: 0px 20px;
	}

  .index-blocks{
    grid-template-columns: repeat(2, 1fr);
    justify-items: center;
  }
  .index-blocks *:last-child{
    grid-column: 1/3;
    width: 50%;
  }
}
@media (max-width: 767px){
	#cookie-notice > *{
		flex-direction: column;
		align-items: flex-start;
	}
  .home-section-cols{
    grid-template-columns: 1fr;
  }

	#ul-footer-top {
	  grid-template-columns: repeat(1, 1fr);
	}
}
@media (max-width: 639px){
  #ul-notice.show + script + header #header-search{
    margin-top: var(--notice-height);
  }
  #header-search{
    position: fixed;
    top: var(--header-height);
    width: 100%;
    height: var(--header-height);
    transition: none;
  }
  #header-search:not(.open){
    transform: translateY(calc(-2 * var(--header-height)));
  }

	#header-quick-search {
		height: calc(100vh - 2*var(--header-height));
	}
  #header-quick-search.open{
    transform: translateY(calc(100% + 2*var(--header-height)))
  }
	#header-search #header-search-input-wrapper input + a > :first-child{
		display: none;
	}

  #news-logo{
    height: 92px;
    padding: 16px;
  }

  #index-indicators{
    height: auto;
    grid-template-areas: none;
    grid-template-columns: 1fr;
    grid-template-rows: 1fr;
    padding: 30px;
  }
  #index-indicator-title{
    grid-area: 1;
  }
  .index-indicator:not(:nth-child(2)){
    border-top: none;
  }

  .index-blocks{
    grid-template-columns: repeat(1, 1fr);
  }
  .index-blocks *:last-child{
    grid-column: 1/2;
    width: 100%;
  }
}


@media (min-width: 640px){
  .index-indicator:nth-child(n+4){
    border-top: none;
  }
  .index-indicator:nth-child(2n+3){
    border-left: none;
  }
}
@media (min-width: 1250px){
  #header-side-menu{
    padding: 62.5px;
    padding-top: var(--header-height);
  }
  #header-side-menu-list{
    gap: 62.5px;
  }
  .header-side-menu-parent{
    font-size: 37.5px;
  }
  .header-side-menu-item ul{
    font-size: 25px;
  }
}
@media (min-width: 1366px){
  .index-indicator{
    padding: 80px 32px;
  }
  .index-indicator h3{
    font-size: 80px;
  }
  .index-indicator h3 small {
    font-size: 20px;
  }
  .index-indicator:hover h3{
    transform: translateY(-32px);
  }
  .index-indicator p{
    font-size: 16px;
  }
  .index-indicator:hover p{
    transform: translateY(32px);
  }
}