:root {
    --eurac-red: #df1b12;
}

a {
    text-decoration: none;
}

a, a:visited, a:hover, a:active {
    color: inherit;
}

html {
    font-family: "Inter", ui-sans-serif, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}

.hidden {
    display: none !important;
}

*:focus {
    outline: none;
}

header {
    padding: 2rem;
    position: sticky;
    z-index: 100;
}

header svg {
    transform: scale(1.1);
    padding-left: 1rem;
}

body, html {
    margin: 0;
    padding: 0;
    height: 100%;
    /* overflow: auto; olga: se lo metto, non ho più l'animazione che scompare che non va bene lo scroll */ 
    scroll-behavior:smooth;
    color: #333;
}

html,
body {
  /* overflow-y: scroll; must be scroll, not auto */
  -webkit-overflow-scrolling: touch;
}


/* COMPONENTS  */
.video-background-mobile {
    /* display: none; */
    position: fixed;
    /* top: 0; */
    left: -50%;
    width: max-content;
    height: 100%;
    z-index: -1;
}

.video-background {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    z-index: -1;
    /* overflow: hidden; */
}

video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.content {
    position: relative;
    z-index: 1;
    padding-top: 1rem;
    color: #636363;
    min-height: 100vh;
    /* overflow: scroll; */
}

.content:last-of-type {
    margin-bottom: 20%;
}

.text-grey {
    color: #636363;
}

.eurac-red {
    color: var(--eurac-red);
}

button {
    background-color: transparent;
    color: #8C9091;
    background-color: #f9f9f9;
    border-radius: 1rem;
    border: 1.5px solid #8C9091;
    padding: 0.5em 1.5rem;
    text-align: center;
    margin: 0.8rem 0.5rem;
    cursor: pointer;
}

button:hover {
    background-color: white;
} 

/* DASH ICONS */

/* .logos--swagger {
  display: inline-block;
  width: 21px;
  height: 21px;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath fill='%2385ea2d' d='M127.999 249.895c-67.215 0-121.9-54.68-121.9-121.896S60.785 6.102 128 6.102c67.214 0 121.899 54.685 121.899 121.9c0 67.214-54.685 121.893-121.9 121.893'/%3E%3Cpath fill='%23173647' d='M127.999 12.202c63.954 0 115.797 51.842 115.797 115.797c0 63.952-51.843 115.797-115.797 115.797c-63.952 0-115.797-51.845-115.797-115.797S64.047 12.202 127.999 12.202m0-12.202C57.419 0 0 57.42 0 127.999s57.42 127.998 127.999 127.998S256 198.577 256 128C256 57.419 198.578 0 127.999 0'/%3E%3Cpath fill='%23173647' d='M80.598 86.619c-.394 4.38.146 8.909-.146 13.338c-.345 4.431-.887 8.811-1.773 13.192c-1.23 6.25-5.12 10.976-10.482 14.914c10.436 6.793 11.616 17.324 12.304 28.006c.345 5.76.197 11.567.788 17.276c.443 4.429 2.165 5.562 6.745 5.708c1.87.048 3.786 0 5.956 0v13.683c-13.535 2.313-24.708-1.525-27.467-12.992c-.887-4.184-1.478-8.467-1.673-12.798c-.297-4.578.195-9.155-.148-13.732c-.985-12.553-2.61-16.785-14.618-17.376v-15.602a24 24 0 0 1 2.608-.443c6.596-.345 9.4-2.364 10.828-8.86c.69-3.641 1.084-7.333 1.23-11.074c.494-7.136.297-14.42 1.525-21.507C67.997 68.163 74.3 63.24 84.785 62.65c2.952-.149 5.955 0 9.35 0v13.98c-1.427.1-2.658.294-3.937.294c-8.515-.297-8.96 2.607-9.6 9.695m16.39 32.386h-.196c-4.923-.245-9.155 3.593-9.403 8.515c-.246 4.972 3.592 9.206 8.515 9.45h.59c4.875.296 9.056-3.447 9.352-8.319v-.491c.1-4.971-3.886-9.055-8.857-9.155m30.862 0c-4.774-.148-8.763 3.593-8.909 8.318c0 .297 0 .543.051.837c0 5.365 3.641 8.812 9.155 8.812c5.414 0 8.812-3.544 8.812-9.106c-.051-5.366-3.646-8.91-9.109-8.86m31.602 0c-5.02-.1-9.206 3.89-9.352 8.91a9.03 9.03 0 0 0 9.055 9.054h.1c4.528.788 9.106-3.592 9.402-8.858c.243-4.874-4.186-9.106-9.205-9.106m43.363.737c-5.711-.245-8.567-2.164-9.992-7.581a55 55 0 0 1-1.624-10.582c-.395-6.596-.346-13.241-.789-19.837c-1.033-15.651-12.352-21.114-28.794-18.41V76.92c2.607 0 4.626 0 6.645.049c3.495.048 6.153 1.379 6.496 5.268c.345 3.543.345 7.136.69 10.73c.692 7.139 1.083 14.372 2.314 21.41c1.085 5.809 5.07 10.14 10.04 13.684c-8.71 5.857-11.27 14.223-11.714 23.626c-.245 6.448-.394 12.944-.736 19.443c-.297 5.905-2.362 7.824-8.318 7.972c-1.674.05-3.298.198-5.169.297v13.93c3.495 0 6.694.196 9.892 0c9.942-.592 15.947-5.415 17.918-15.063a126 126 0 0 0 1.476-16.045c.343-4.923.297-9.894.788-14.766c.737-7.63 4.232-10.78 11.862-11.27c.739-.1 1.427-.246 2.118-.492v-15.604c-1.282-.149-2.17-.295-3.103-.346'/%3E%3C/svg%3E");
} */

.logos--swagger  {
  display: inline-block;
  width: 21px;
  height: 21px;
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M12 0C5.383 0 0 5.383 0 12s5.383 12 12 12c6.616 0 12-5.383 12-12S18.616 0 12 0m0 1.144c5.995 0 10.856 4.86 10.856 10.856S17.996 22.856 12 22.856S1.144 17.996 1.144 12S6.004 1.144 12 1.144M8.37 5.868a7 7 0 0 0-.423.005c-.983.056-1.573.517-1.735 1.472c-.115.665-.096 1.348-.143 2.017q-.018.526-.115 1.038c-.134.609-.397.798-1.016.83a3 3 0 0 0-.244.042v1.463c1.126.055 1.278.452 1.37 1.629c.033.429-.013.858.015 1.287c.018.406.073.808.156 1.2c.259 1.075 1.307 1.435 2.575 1.218v-1.283c-.203 0-.383.005-.558 0c-.43-.013-.591-.12-.632-.535c-.056-.535-.042-1.08-.075-1.62c-.064-1.001-.175-1.988-1.153-2.625c.503-.37.868-.812.983-1.398c.083-.41.134-.821.166-1.237c.028-.415-.023-.84.014-1.25c.06-.665.102-.937.9-.91c.12 0 .235-.017.369-.027v-1.31q-.239-.001-.454-.006m7.593.009a4.3 4.3 0 0 0-.813.06v1.274c.245 0 .434 0 .623.005c.328.004.577.13.61.494c.032.332.031.669.064 1.006c.065.669.101 1.347.217 2.007c.102.544.475.95.941 1.283c-.817.549-1.057 1.333-1.098 2.215c-.023.604-.037 1.213-.069 1.822c-.028.554-.222.734-.78.748c-.157.004-.31.018-.484.028v1.305c.327 0 .627.019.927 0c.932-.055 1.495-.507 1.68-1.412q.117-.748.138-1.504c.032-.461.028-.927.074-1.384c.069-.715.397-1.01 1.112-1.057a1 1 0 0 0 .199-.046v-1.463c-.12-.014-.204-.027-.291-.032c-.536-.023-.804-.203-.937-.71a5 5 0 0 1-.152-.993c-.037-.618-.033-1.241-.074-1.86c-.08-1.192-.794-1.753-1.887-1.786m-6.89 5.28a.844.844 0 0 0-.083 1.684h.055a.83.83 0 0 0 .877-.78v-.046a.845.845 0 0 0-.83-.858zm2.911 0a.81.81 0 0 0-.834.78c0 .027 0 .05.004.078c0 .503.342.826.859.826c.507 0 .826-.332.826-.853c-.005-.503-.342-.836-.855-.831m2.963 0a.86.86 0 0 0-.876.835c0 .47.378.849.849.849h.009c.425.074.853-.337.881-.83c.023-.457-.392-.854-.863-.854'/%3E%3C/svg%3E");
  background-color: currentColor;
  -webkit-mask-image: var(--svg);
  mask-image: var(--svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
}

.mdi--github {
  display: inline-block;
  width: 21px;
  height: 21px;
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M12 2A10 10 0 0 0 2 12c0 4.42 2.87 8.17 6.84 9.5c.5.08.66-.23.66-.5v-1.69c-2.77.6-3.36-1.34-3.36-1.34c-.46-1.16-1.11-1.47-1.11-1.47c-.91-.62.07-.6.07-.6c1 .07 1.53 1.03 1.53 1.03c.87 1.52 2.34 1.07 2.91.83c.09-.65.35-1.09.63-1.34c-2.22-.25-4.55-1.11-4.55-4.92c0-1.11.38-2 1.03-2.71c-.1-.25-.45-1.29.1-2.64c0 0 .84-.27 2.75 1.02c.79-.22 1.65-.33 2.5-.33s1.71.11 2.5.33c1.91-1.29 2.75-1.02 2.75-1.02c.55 1.35.2 2.39.1 2.64c.65.71 1.03 1.6 1.03 2.71c0 3.82-2.34 4.66-4.57 4.91c.36.31.69.92.69 1.85V21c0 .27.16.59.67.5C19.14 20.16 22 16.42 22 12A10 10 0 0 0 12 2'/%3E%3C/svg%3E");
  background-color: currentColor;
  -webkit-mask-image: var(--svg);
  mask-image: var(--svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
}

.eos-icons--application-outlined {
  display: inline-block;
  width: 21px;
  height: 21px;
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cdefs%3E%3Cpath id='eosIconsApplicationOutlined0' fill='%23000' d='m9 18l.7-.7l.7-.7l-1.3-1.3L7.8 14l1.3-1.3l1.3-1.3l-.7-.7L9 10l-2 2l-2 2l2 2zm4.6-1.4l.7.7l.7.7l2-2l2-2l-2-2l-2-2l-.7.7l-.7.7l1.3 1.3l1.3 1.3l-1.3 1.3z'/%3E%3C/defs%3E%3Cpath fill='%23000' d='M1 3v2h22V3a2 2 0 0 0-2-2H3a2 2 0 0 0-2 2m3.007 1.008a1 1 0 1 1 .999-1a1 1 0 0 1-1 1m2.997-.001a1 1 0 1 1 1-1a1 1 0 0 1-1 1M1 6v14a2 2 0 0 0 2 2h18a2 2 0 0 0 2-2V6Zm20 14H3V8h18Z'/%3E%3Cuse href='%23eosIconsApplicationOutlined0'/%3E%3Cuse href='%23eosIconsApplicationOutlined0'/%3E%3C/svg%3E");
  background-color: currentColor;
  -webkit-mask-image: var(--svg);
  mask-image: var(--svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
}

.ic--round-close {
  display: inline-block;
  width: 21px;
  height: 21px;
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M18.3 5.71a.996.996 0 0 0-1.41 0L12 10.59L7.11 5.7A.996.996 0 1 0 5.7 7.11L10.59 12L5.7 16.89a.996.996 0 1 0 1.41 1.41L12 13.41l4.89 4.89a.996.996 0 1 0 1.41-1.41L13.41 12l4.89-4.89c.38-.38.38-1.02 0-1.4'/%3E%3C/svg%3E");
  background-color: currentColor;
  -webkit-mask-image: var(--svg);
  mask-image: var(--svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
}

.mingcute--search-line {
  display: inline-block;
  width: 21px;
  height: 21px;
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cpath d='m12.593 23.258l-.011.002l-.071.035l-.02.004l-.014-.004l-.071-.035q-.016-.005-.024.005l-.004.01l-.017.428l.005.02l.01.013l.104.074l.015.004l.012-.004l.104-.074l.012-.016l.004-.017l-.017-.427q-.004-.016-.017-.018m.265-.113l-.013.002l-.185.093l-.01.01l-.003.011l.018.43l.005.012l.008.007l.201.093q.019.005.029-.008l.004-.014l-.034-.614q-.005-.018-.02-.022m-.715.002a.02.02 0 0 0-.027.006l-.006.014l-.034.614q.001.018.017.024l.015-.002l.201-.093l.01-.008l.004-.011l.017-.43l-.003-.012l-.01-.01z'/%3E%3Cpath fill='%23000' d='M10.5 2a8.5 8.5 0 1 0 5.262 15.176l3.652 3.652a1 1 0 0 0 1.414-1.414l-3.652-3.652A8.5 8.5 0 0 0 10.5 2M4 10.5a6.5 6.5 0 1 1 13 0a6.5 6.5 0 0 1-13 0'/%3E%3C/g%3E%3C/svg%3E");
  background-color: currentColor;
  -webkit-mask-image: var(--svg);
  mask-image: var(--svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
}

.mingcute--paper-line {
  display: inline-block;
  width: 21px;
  height: 21px;
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none'%3E%3Cpath d='m12.593 23.258l-.011.002l-.071.035l-.02.004l-.014-.004l-.071-.035q-.016-.005-.024.005l-.004.01l-.017.428l.005.02l.01.013l.104.074l.015.004l.012-.004l.104-.074l.012-.016l.004-.017l-.017-.427q-.004-.016-.017-.018m.265-.113l-.013.002l-.185.093l-.01.01l-.003.011l.018.43l.005.012l.008.007l.201.093q.019.005.029-.008l.004-.014l-.034-.614q-.005-.018-.02-.022m-.715.002a.02.02 0 0 0-.027.006l-.006.014l-.034.614q.001.018.017.024l.015-.002l.201-.093l.01-.008l.004-.011l.017-.43l-.003-.012l-.01-.01z'/%3E%3Cpath fill='%23000' d='M16 3a3 3 0 0 1 2.995 2.824L19 6v10h.75c.647 0 1.18.492 1.244 1.122l.006.128V19a3 3 0 0 1-2.824 2.995L18 22H8a3 3 0 0 1-2.995-2.824L5 19V9H3.25a1.25 1.25 0 0 1-1.244-1.122L2 7.75V6a3 3 0 0 1 2.824-2.995L5 3zm0 2H7v14a1 1 0 1 0 2 0v-1.75c0-.69.56-1.25 1.25-1.25H17V6a1 1 0 0 0-1-1m3 13h-8v1c0 .35-.06.687-.17 1H18a1 1 0 0 0 1-1zm-7-6a1 1 0 1 1 0 2h-2a1 1 0 1 1 0-2zm2-4a1 1 0 1 1 0 2h-4a1 1 0 0 1 0-2zM5 5a1 1 0 0 0-.993.883L4 6v1h1z'/%3E%3C/g%3E%3C/svg%3E");
  background-color: currentColor;
  -webkit-mask-image: var(--svg);
  mask-image: var(--svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
}

.fa--lock {
  display: inline-block;
  width: 7.37px;
  height: 9px;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1152 1408'%3E%3Cpath fill='%23fff' d='M320 640h512V448q0-106-75-181t-181-75t-181 75t-75 181zm832 96v576q0 40-28 68t-68 28H96q-40 0-68-28t-28-68V736q0-40 28-68t68-28h32V448q0-184 132-316T576 0t316 132t132 316v192h32q40 0 68 28t28 68'/%3E%3C/svg%3E");
}

/* end DASH ICONS */


/* CARDS PAGE  */
.tools {
    width: 90vw;
    margin: 0 auto;
    min-height: 200vh;
}

.cards-stack {
    /* background: lightblue; */
    display: flex;
    justify-content: center;
    gap: 1rem;
    max-width: 1350px;
    min-height: 100vh;;
    margin: 0 auto;
}

.cards-menu ul {
    border-left: 3px solid #b2b5b575;
    list-style: none;
    margin-top: 1rem;
    padding-right: 1rem;
    padding-left: 0;
    position: sticky;
    top: calc(4rem + 23px);
    display: flex;
    flex-direction: column;

    /* backdrop-filter: blur(10px);
    border-top-right-radius: 1rem;
    border-bottom-right-radius: 1rem; */
}

.cards-menu li {
    white-space: nowrap;
    margin: 0;
    padding-left: 2rem;
    margin-left: -3px;
    color: inherit;
}

.cards-menu li:has(a.active) {
    border-left: 3px solid var(--eurac-red);
}

.cards-menu li:has(a.active) p, 
.cards-menu li:has(a.active) h4 {
    margin-left: -3px;
}

.cards-menu p, .cards-menu h4 {
    margin-block-start: 0.5em;
    margin-block-end: 0.5em;
    /* font-size: smaller; */
}

.cards-menu li.sub-menu-item {
    padding-left: 2.5rem;
}

.cards-menu li.sub-sub-menu-item {
    padding-left: 3rem;
}

.links-page h1 {
    width: 80%;
    margin: 2rem auto;
}

.cards-wrap {
    /* background: pink; */
    padding: 2rem;
    flex-grow: 1;
}

.cards {
    display: flex;
    flex-wrap: wrap;
     /* justify-content: space-between;  */
    /* row-gap: 2rem;  */
    gap: 2rem;
    max-width: 950px;
}

h1:not(.hidden) + .cards,
h2:not(.hidden) + .cards ,
h3:not(.hidden) + .cards  {
    margin-bottom: 5rem;
}

.card {
    /* width: 30%; */
    width: calc(30% - 8px);
    padding: 4px;
    min-height: 400px;
    background-color: #f2f2f2;
    /* background-color: #f9f9f9; */
    border-radius: 10px;
    display: flex;
    /* align-items: center; */
    justify-content: center;
    /* overflow: hidden; */
    /* perspective: 1000px; */
    box-shadow: 0 0 0 5px #ffffff80;
    /* border: 2px solid #e0e0e0; */
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.card p {
    font-size: small;
    line-height: 20px;
}
a:has( div.badge-login) {
    display: flex;
    flex-direction: row-reverse;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
    gap: 4px;
}

a:has( div.badge-login) h3 {
    flex-grow: 1;
}

.badge-login {
    background-color: var(--eurac-red); 
    color: white;
    padding: 4px 8px;
    font-size: calc(0.6875rem * 1);
    border-radius: 1rem;
    text-transform: uppercase;
}   

.badge-login .fa--lock{
    padding-right: 6px;
}

/* FOOTER */
footer {
    background-color: #f9f9f9;
    background-color: rgba(255, 255, 255, 0.7);
    padding: 1rem 2rem;
    padding-bottom: 2rem;
    margin-top: 5rem;
}
.footer_content {
    display: flex;
    gap: 3rem;
    max-width: 1350px;
    margin: 0 auto;
}

.footer_col {
    /* max-width: 50%; */
    /* width: 33%; */
}

.text-12px {
    font-size: .75rem;
}

.contacts-wrap {
    display: flex;
    flex-direction: column;
    white-space: nowrap;
}

/* animations */

.animate-card {
    animation: image-appear ease-in both;
    animation-timeline: view();
    animation-range: entry 5% 50vh;
}

@keyframes image-appear {
    from {
        filter: saturate(0) contrast(1) brightness(.5) blur(5px);
        opacity: 0;
        scale: .8;
        translate: 0 4rem;
    }
}


/* SEARCH BAR */
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
}

.search_icon-wrapper svg {
    background-color: rgba(245, 245, 245, 0.7);
    border-radius: 3px;
    box-shadow: 0px 0px 0px 0.5rem rgba(245, 245, 245, 0.7);
}

.tags-background {
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 1.4s;
}

.overlay-display.tags-background {
    display: flex;
    opacity: 1;
}

#tags_cloud {
    display: block;
    max-width: 100vw;
    max-height: 100vh;
    margin: auto;
}

.overflow-block {
    overflow: hidden;
}
.overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.3);
    backdrop-filter: blur(5px);
    display: none;
}

.overlay-display {
    display: block;
    z-index: 1000;
}

.search-bar-form {
    display: none;
    z-index: 1100;
}

button.search_btn {
    border: none;
    padding: 0;
    margin: 0;
    background-color: #f5f5f5;
}

.search-bar-content {
    display: flex;
    align-items: flex-start;
    position: sticky;
    z-index: 100;
    top: 2rem;
}

.search-bar-form input {
    height: 26px;
    border: none;
    background-color: #f5f5f5;
}

@keyframes fadeInUp {
    to {
        opacity: 1;
    }
}

.search-bar-content.show-input .search-bar-form {
    display: flex;
    justify-content: space-between;
    text-align: center;
    opacity: 0;
    animation: fadeInUp 1.5s ease-out forwards;
    background-color: #f5f5f5;
    padding: 1rem;
    border-radius: 8px;

    position: fixed; 
    top: 10vh;
    left: 25%;
    right: 25%;
}

input:focus-visible {
    border: none !important;
}

.tag-list {
    color: white;
}

#tags_cloud.hovered span:hover {
    color: var(--eurac-red) !important;
    cursor: pointer;
}


/* MEDIA */
@media screen and (min-width: 1471px) {
    .video-background-tools video {
        opacity: 0.5;
    }

}

@media screen and (max-width: 1400px) {
    .card {
        width: 45%;
    }

}

@media screen and (max-width: 1024px) {
    .card {
        width: 45%;
    }

}

@media screen and (max-width: 992px) {
    .background-hover {
        display: none;
    }

    .card {
        width: 45%;
    }

    .cards-wrap {
        margin-right: -5rem;
    }

    .cards-menu {
        display: none;
    }

    header {
        width: 100%;
    }
    .tools-scroll header {
        background-color: #f5f5f5;
    }

    .video-background, .video-background-tools {
        display: none;
    }

    .footer_content {
        flex-direction: column;
    }

    body {
        background-color: #f5f5f5;
    };
    
}

@media screen and (max-width: 768px) {
    .search-bar-content.show-input .search-bar-form {
        top: 2rem;
        left: 2rem;
        right: 2rem;
        z-index: 1001;
    }

    #tags_cloud {
        margin-top: 2rem;
        height: 200vh !important;
    }
}


@media screen and (max-width: 576px) {
    .card {
        width: 100%;
    }

    .cards-wrap {
        margin-right: -3rem;
    }

}
/* 
Device	Width Range	Example Media Query
Extra small	< 576px	
Small (mobile)	≥ 576px	
Medium (tablet)	≥ 768px	
Large (laptop)	≥ 992px
Extra large	≥ 1200px	
XXL (4K, etc)	≥ 1400px	*/