/*
 * Use this file for your institution's branding CSS
 */

/*
 * new header 6/2025
 */
@import url('https://fonts.googleapis.com/css2?family=Libre+Franklin:wght@400;500;700&display=swap');

#maincontent.content-container {
  justify-content: center;
}
#maincontent.content-container > .container-fluid,
#maincontent.content-container > .container {
  max-width:1280px;
}
#interior-page-search-container {
  justify-content: center;
  display: flex;
}

/* ===== Header Styles ===== */
#page-header {
  font-family: 'Libre Franklin', sans-serif !important;
  font-feature-settings: 'liga' off, 'clig' off;
  display: flex;
  flex-direction: column;
  width: 100%;
  z-index: 1000;
  top: 0;
  background-color: #580F8B;
}

/* ===== Desktop Header Styles ===== */
.desktop-header {
  display: flex;
  align-items: center;
  height: 70px;
  /*padding: 12px clamp(25px, calc(25px + (80 - 25) * ((100vw - 1024px) / (1440 - 1024))), 80px);*/
  padding:0;
  width:100%;
  max-width:1280px;
}

.desktop-header-wrapper {
  margin: 0 auto;
  width: clamp(896px, 100%, 1280px);
  display: flex;
  align-items: center;
  flex-direction: row;
  gap: 12px;
}

.desktop-header-nyu-link {
  color: #FDFBFE;
  margin-left: 12px;
  font-size: 1.5625rem;
  text-decoration: none;
  font-weight: 700;
}

.desktop-header-nyu-link:hover,
.desktop-header-nyu-link:focus {
  text-decoration: none;
  color: #FDFBFE !important;
}

.desktop-header-nyu-link:active {
  text-decoration: none;
  color: #FDFBFE; !important;
}

.desktop-header-divider {
  background-color: #FDFBFE;
  width: 1px;
  height: 20px;
}

.desktop-header-title-link {
  color: #FDFBFE;;
  font-size: 1.375rem;
  text-decoration: none;
  font-weight: 400;
  line-height: 1.2;
  letter-spacing: -0.44px;
  padding-top: 2px;
}

.desktop-header-title-link:hover,
.desktop-header-title-link:focus {
  text-decoration: none;
  color: #FDFBFE !important;
}

.desktop-header-title-link:active {
  text-decoration: none;
  color: #FDFBFE !important;
}


.tablet-header {
  display: flex;
  flex-direction: column;
  width: 100%;
  align-items: center;
}

.tablet-header-logo {
  padding: 7px 0;
}

.tablet-menu-wrapper {
  background-color: #FDFBFE;
  padding: 16px;
  width: 100%;
  height: 60px;
  display: flex;
  gap: 12px;
  align-items: center;
  justify-content: center;
  z-index: 200;
}

.go-back-to-nav-wrapper[aria-hidden="true"] {
  display: none;
}

.tablet-menu-img {
  width: 40px;
  height: 20px;
  cursor: pointer;
}


.tablet-menu-icon {
  background-color: transparent;
  border: none;
  width: 42px;
  height: 40px;
  margin-top: 4px;
}

.tablet-cross-icon {
  display: none;
  font-size: 36px;
  width: 42px;
  color: #580F8B;
  background-color: #FDFBFE;
  border: none;
  cursor: pointer;
  margin-top: 4px;
}

.tablet-header-div-for-flex {
  width: 42px;
  height: 21px;
}

.tablet-header-nyu-link {
  color: #580F8B;
  font-size: 1.375rem;
  text-decoration: none;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.44px;
}

.tablet-header-nyu-link:hover,
.tablet-header-nyu-link:focus {
  text-decoration: none;
  color: #580F8B;
}

.tablet-header-nyu-link:active {
  text-decoration: none;
  color: #580F8B;
}

.tablet-header-divider {
  background-color: #580F8B;
  width: 1px;
  height: 20px;
}

.tablet-links-wrapper {
  display: flex;
  flex-direction: row;
  gap: 12px;
  align-items: center;
}

.tablet-header-title-link {
  color: #746F76;
  font-size: 1.375rem;
  text-decoration: none;
  font-weight: 400;
  letter-spacing: -0.44px;
  line-height: 1.2;
}

.tablet-header-title-link:hover,
.tablet-header-title-link:focus {
  text-decoration: none;
  color: #580F8B;
}

.tablet-header-title-link:active {
  text-decoration: none;
  color: #580F8B;
}

/* ===== Mobile Header Styles ===== */

.mobile-header {
  display: flex;
  flex-direction: column;
  width: 100%;
  align-items: center;
}

.mobile-header-logo {
  padding: 7px 0;
}

.mobile-menu-wrapper {
  background-color: #FDFBFE;
  padding: 10px 10px 10px 16px;
  width: 100%;
  height: 64px;
  display: flex;
  gap: 18px;
  align-items: center;
}

.mobile-menu-icon {
  background: transparent;
  border: none;
  cursor: pointer;
  height: fit-content;
  padding-top: 5px;
}

.mobile-menu-img {
  width: 28px;
  height: 21px;
}

.mobile-links {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.mobile-header-nyu-link {
  color: #580F8B;
  font-size: 1rem;
  text-decoration: none;
  font-weight: 700;
  text-decoration: none;
}

.mobile-header-nyu-link:hover,
.mobile-header-nyu-link:focus {
  text-decoration: none;
  color: #580F8B;
}

.mobile-header-nyu-link:active {
  text-decoration: none;
  color: #580F8B;
}

.mobile-header-title-link {
  color: #746F76;
  font-size: 1rem;
  text-decoration: none;
  font-weight: 400;
  text-decoration: none;
  line-height: 1.25;
}

.mobile-header-title-link:hover,
.mobile-header-title-link:focus {
  text-decoration: none;
  color: #746F76;
}

.mobile-header-title-link:active {
  text-decoration: none;
  color: #746F76;
}

@media screen and (min-width: 1024px) {
  .mobile-header {
    display: none;
  }
}

@media screen and (min-width: 1024px) {
  .tablet-header {
    display: none;
  }
}


@media screen and (max-width: 1024px) {
  .desktop-header {
    display: none;
  }
}

@media screen and (max-width: 800px) {
  #interior-page-search-form-container {
    width:80%;
  }
}

@media screen and (max-width: 600px) {
  .tablet-header {
    display:none;
  }
}
@media screen and (min-width: 599px) and (max-width: 1023px) {
  .mobile-header {
    display: none;
  }
}

@media screen and (max-width: 520px) {
  .tablet-header-nyu-link {
    font-size:1.25rem;
  }
  .tablet-header-title-link {
    font-size:1.25rem;
  }
}




/**
 * end new header styles 
 **/



.faq-item {
  margin:4em 0em;
}

.logos-container {
  background: #580f8b;
  padding:0 !important;
  display:flex;
  justify-content:center;
}

.logo-container.secondary {
  float:right;
}
.logo-container.secondary img {
  width:95px;
}
#frontpage-search-container {
  background-image: url("/img/institution/abstract-bg-crop1.jpg");
  background-size: cover;
}

#interior-page-search-container {
  background-image: url("/img/institution/abstract-bg-crop2.jpg");
  background-size: cover;
  height:80px;
  position:relative;
}

#interior-page-search-form-container {
  margin:0;
  width:100%;
  max-width:1280px;
  display:flex;
  align-items:center;
  justify-content:right;
}

#interior-page-search-form-container #keyword-search-form.input-group {
  width:40%;
  max-width:500px;
  margin: 0;
}

.menu-bar {
  display:flex;
  justify-content: center;
}

.menu-bar-container {
  width:100%;
  max-width:1280px;
}

.menu-bar-container .menu-links {
  padding-left:0;
  margin-left:-1.5em;
}


.login-highlighted-link {
    font-size:1.25em;
    margin-top:.7em;
    display:inline-block;
}
.login-highlighted-link i {
    font-size:.8em;
    padding-left:.25em;
}
#homepage-explainer-container {
  width:60%;
  margin: 3em auto;
}

.homepage-explainer-item {
  margin:4em 0em;
}

.homepage-explainer-icon img {
  width:100%;
  max-width:100px;
}

.homepage-explainer-text {
  display:inline-block;
  margin-top:auto;
  margin-bottom:auto;
  text-align:left;
}

/* survey CSS */

    .survey-tab {
        position:fixed;
        bottom:-60px;
        right:60px;
        color:white;
        font-size:1.25em;
        padding-top:11px;
        z-index:1;
        text-align:center;
        vertical-align:middle;
        width:140px;
        height:50px;
        transition:height 0.15s;
        transition:width 0.15s;
        background: #580f8b;
        border-radius:5px;
    }
.icon-envelope {
    font-size:1.25em;
    padding-right:.5em;

}
    .survey-tab:hover {
        cursor:pointer;
        background:#6f2c9e;
    }
    .survey-tab.grown {
        width:120px;
    }


    .x-out-survey {
        position:absolute; 
        top:70px; 
        left:-63px; 
        border-top-left-radius:10px; 
        border-bottom-left-radius: 10px; 
        background: black; 
        width:63px; 
        color: white; 
        font-size:3em; 
        text-align:center;
        
    }
    .x-out-survey:hover {
        background:gray;
        cursor:pointer;
    }
    .survey-container {
        position:fixed; 
        bottom:0px; 
        right:-63px;
        width:770px; 
        height:760px; 
        z-index:10;
        display:none;
    }
    .survey-iframe-container {
        position:absolute;
        bottom:0px;left:0px;
        border:5px solid black;
    }


#page-header {
    background: #580f8b;
}

.internal-dataset {
  color:purple;
}

#footer_logo img {
  width:125px;
  margin-left:1em;
}

.footer-wrapper {
  max-width:1280px;
}

#sidenav {
  padding:.25em;
  margin-top:1em;
  position:sticky;
  top:42px;
}

.about-page-column {
  padding-top:2em;
  height:auto;
}

.how-to-screenshot {
  max-width:70%;
  border:1px solid black;
  margin-bottom:3em;
}
.how-to-page-column {
  padding-top:2em;
  height: 7000px;
}
.how-to-hr {
  border-top:1px solid #bbb;
  margin-bottom:7em;
}
.how-to-item-container {
  padding:1em;
}
.section-intro {
  font-size: 1.2em;
}
.how-to-item-container p,
.how-to-item-container ul,
.how-to-item-container img {
  margin-left:2.5em;
}
.how-to-item-container p,
.how-to-item-container ul {
  color:#585656;
}
.how-to-section-header {
  margin-top:2em;
}
.how-to-item-header {
  margin-bottom:1em;
  border-bottom:1px solid #c7c7c7;
}
.about-anchor-links-header {
  font-size:1.5em;
  color:gray;
  padding-right:.75em;
  vertical-align:middle;
}

.sidenav-anchor-link {
  vertical-align:middle;
  display:inline-block;
  font-weight:bold;
  font-size:.9em;
  text-transform:uppercase;
  color:#717171;
  padding:1em;
  border-left:3px solid #580f8b;
  letter-spacing:0.5px;
}
.sidenav-anchor-link:hover {
  color:#717171;
  text-decoration:none;
  border-left:3px solid #9bb8d3;

}
.sidenav-anchor-link:focus {
  border-left:3px solid #9bb8d3;
}

.about-page-section {
  margin-bottom:7em;
}

.about-page-section h2 {
  margin-bottom:1em;
}

.team-bio-section {
  clear:both;
  margin-bottom:5em;
  overflow:hidden;
}

.team-bio-picture {
  float:left;
  margin-right:1.5em;
  border:1px solid #b9b9b9
}

.team-bio-section h4 {
  margin:0em;
}

.team-bio-jobtitle {
  margin-top:0em;
  margin-bottom:1.5em;
  color:gray;
}

@media only screen and (max-width: 1020px) {
  #frontpage-submit-dataset {
    display:none;
  }
}