/* Futuramente será trocado para max-width: 1199px quando definirmos propriedades para xl */ @media (max-width: 576px) { :root { --font-size-small: 1rem; --font-size-extra-small: .875rem; --font-size-button: .83rem; --font-size-medium: 1.5rem; --font-size-large: 1.875rem; --font-weight-regular: 400; --font-weight-medium: 500; --font-weight-bold: 700; --available-space-width: 100%; --container-width: 100%; --content-width: 100%; --container-margin: 15%; --color-white: #ffffff; --color-green: #567955; --color-light-grey: #DBDBDB; --color-grey: #AFAFAF; --color-dark-grey: #707072; --border-radius: 6px; --button-border: none; --button-border-radius: var(--border-radius); --button-font-weight: 700; --button-background-color: black; --button-display: flex; --button-align-items: center; --button-justify-content: center; --button-padding: 16px; --search-toolbar-button-padding: 16px 16px 16px 0px; --input-search-border-radius: var(--border-radius); --input-search-padding: 6px; --header-width: 100%; --header-height: 150px; --header-background-color: var(--color-white); --header-logo-width: 200px; --header-logo-padding: var(--padding-2) var(--padding-3); --header-menu-width: auto; --header-menu-height: 100%; --header-menu-item-width: 33.33%; --header-menu-item-padding: 15px; --header-menu-text-transform: uppercase; --header-menu-item-font-size: var(--font-size-button); --header-menu-item-font-weight: var(--font-weight-bold); --header-nav-menu-container-display: none; --main-width: 100%; --filters-bar-toogle-button-background-color: var(--color-light-grey); --filters-bar-toogle-button-font-family: var(--secondary-font-family); --filters-bar-toogle-button-font-color: var(--primary-color); --filters-bar-toogle-button-font-size: var(--font-size-button); --filters-bar-toogle-button-font-weight: var(--font-weight-medium); --filters-bar-toggle-button-white-space: nowrap; --filters-bar-toggle-button-display: flex; --filters-bar-toggle-button-y-alignment: center; --filters-bar-toggle-button-gap: var(--padding-2); --filters-bar-toggle-button-margin: 0 var(--margin-2); --simple-search-input-width: 50%; --simple-search-input-height: 44px; --simple-search-input-box-shadow: none; --simple-search-input-border: 1px solid var(--color-text); --simple-search-input-border-radius: 6px 0 0 6px; --simple-search-button-background-color: var(--color-text); --simple-search-button-padding: 10px; --simple-search-button-width: 44px; --simple-search-button-height: 44px; --page-title-font-size: var(--font-size-large); --page-title-font-weight: var(--font-weight-bold); --page-title-text-transform: uppercase; --page-title-section-container-width: 100%; --page-title-section-container-display: flex; --page-title-section-container-justify-content: center; --page-title-section-container-padding: 0px var(--padding-4); --page-title-section-container-margin: 0 var(--container-margin); --browse-section-width: 100%; --browse-section-background-color: #F2F2F2; --browse-section-padding-bottom: 40px; --browse-section-justify-content: center; --browse-section-flex-direction: row; --browse-section-display: flex; --browse-section-margin: auto; --browse-section-content-padding: 0 var(--padding-4); --groupers-bar-width: var(--content-width); --groupers-bar-padding-top: 20px; --groupers-bar-padding-bottom: 40px; --groupers-bar-breadcrumb-padding-bottom: 15px; --groupers-bar-breadcrumb-item-margin-left: 6px; --groupers-bar-breadcrumb-item-font-color: var(--primary-color); --groupers-bar-breadcrumb-item-background-color: var(--color-grey); --groupers-bar-breadcrumb-item-border-radius: var(--border-radius); --groupers-bar-breadcrumb-item-padding-top: 3px; --groupers-bar-breadcrumb-item-padding-bottom: 3px; --groupers-bar-breadcrumb-item-padding-left: 10px; --groupers-bar-breadcrumb-item-padding-right: 10px; --groupers-bar-breadcrumb-item-text-transform: uppercase; --groupers-bar-buttons-section-width: 100%; --groupers-bar-button-margin-right: 10px; --groupers-bar-button-padding: 10px; --groupers-bar-button-font-size: var(--font-size-medium); --groupers-bar-button-font-weight: var(--font-weight-regular); --groupers-bar-button-border-radius: var(--border-radius); --groupers-bar-button-text-transform: uppercase; --browse-section-results-info-width: var(--container-width); --browse-section-results-info-padding-bottom: 20px; --browse-section-results-info-text-align: right; --browse-section-results-width: var(--container-width); --browse-section-results-flex-direction: column; --browse-section-results-gap: var(--padding-3); --filters-bar-width: 100%; --filters-bar-padding: 20px; --filters-bar-background-color: var(--color-white); --filters-bar-border-radius: var(--border-radius); --filters-bar-margin-right: 32px; --filters-bar-title-font-size: var(--font-size-medium); --filters-bar-title-font-weight: var(--font-weight-bold); --filters-bar-button-padding: 6px 10px; --filters-bar-button-background-color: var(--primary-color); --filters-bar-button-font-weight: var(--font-weight-bold); --browse-list-width: 100%; --browse-list-item-background-color: var(--color-white); --browse-list-item-width: var(--available-space-width); --browse-list-item-info-attributes-word-break: break-word; --browse-list-item-image-container-background-color: var(--color-light-grey); --browse-list-item-image-container-width: auto; --modal-body-background-color: var(--color-grey); --footer-logo-width: var(--logo-width); --footer-logo-height: var(--logo-height); --footer-padding: 60px 100px 0 100px; --footer-width: 100%; --footer-display: flex; --footer-display-orientation: column; --footer-x-alignment: center; --footer-content-max-width: 1240px; --footer-content-width: 100%; --home-sections-container-display: flex; --home-sections-container-flex-direction: column; --home-section-padding: 40px 20px; --home-section-y-alignment: start; --home-section-x-alignment: center; --home-section-display: flex; --home-section-min-height: auto; --home-section-height: auto; --landing-home-section-title-font-size: 32px; --landing-home-section-title-line-height: auto; --home-section-title-width: auto; --home-section-title-font-size: 52px; --home-section-title-font-family: var(--primary-font-family); --home-section-highlights-background-color: #f4f4f4; --home-section-highlights-home-collections-list-item-background-color: var(--color-red); --home-section-highlights-home-collections-list-item-color: var(--color-white); --home-section-highlights-home-section-title-color: var(--color-text); --home-section-highlights-home-section-textual-content-p-color: var(--color-text); --library-home-collections-list-item-background-color: var(--color-green); --library-home-section-title-color: var(--color-text); --library-home-section-textual-content-p-color: var(--color-text); --library-home-section-background-color: white; --library-home-section-content-height: 100vh; --library-home-section-textual-content-height: auto; --library-home-section-textual-content-background-color: var(--color-tertiary); --library-home-section-textual-content-padding: var(--home-section-padding); --home-section-content-width: 1240px; --home-section-content-display: flex; --home-section-content-flex-direction: row; --home-section-content-align-items: center; --home-section-content-align-content: center; --home-section-content-justify-content: space-around; --home-section-content-not-about-gap: var(--padding-2); --home-grid-content-flex-direction: column; --home-section-about-height: auto; --home-section-about-background-size: auto; --home-section-about-x-alignment: start; --home-collections-items-section-height: auto; --home-collections-items-section-padding: 40px 50px; --home-collections-items-section-background-color: #D7D4DB; --home-collections-items-section-display: flex; --home-collections-items-section-x-alignment: center; --home-collections-items-section-display-orientation: column; --home-collections-items-section-home-section-title-width: 100%; --home-section-textual-content-width: 100%; --home-section-textual-content-flex: 1 1 0; --home-section-textual-content-display: flex; --home-section-textual-content-flex-direction: column; --home-section-textual-content-align-items: flex-start; --home-section-textual-content-text-align: left; --home-section-textual-content-padding: var(--padding-3); --landing-home-section-textual-content-padding: 0 5%; --about-home-section-content-flex-direction: column; --about-home-section-content-height: 100%; --about-home-section-content-width: 100%; --about-home-section-content-y-alignment: start; --about-home-section-content-x-alignment: start; /* highlights section */ --highlights-home-section-background-color: white; --highlights-home-section-height: 100vh; --highlights-home-section-title-color: var(--color-primary); --highlights-home-section-content-height: 100vh; --highlights-home-section-content-width: 100%; --highlights-home-section-content-y-alignment: start; --highlights-home-section-textual-content-height: auto; --highlights-home-section-textual-content-background-color: var(--color-tertiary); --highlights-home-section-textual-content-padding: var(--home-section-padding); --highlights-home-section-textual-content-p-color: var(--color-text); --highlights-home-section-textual-content-p-font-weight: var(--font-weight-6); --highlights-home-section-textual-content-p-font-size: var(--font-size-5); --highlights-home-collections-list-item-background-color: var(--color-green); /* Access-browse section (timeline) */ --access-browse-background-image: url("../images/section-timeline.png"); --access-browse-background-repeat: no-repeat; --access-browse-background-position: right center; --access-browse-background-size: 50% auto; --access-browse-home-section-textual-content-text-align: left; --access-browse-home-section-textual-content-title-font-size: var(--font-size-8); --access-browse-home-section-textual-content-text-font-size: var(--font-size-6); --access-browse-home-section-textual-content-text-text-align: left; --access-browse-home-section-background-color: var(--color-purple); --access-browse-home-section-justify-content: center; --access-browse-home-section-gap: var(--padding-2); --access-browse-home-section-color: white; --access-browse-home-section-height: auto; --access-browse-home-section-content-justify-content: center; --access-browse-home-section-content-align-items: center; --access-browse-home-section-content-flex-direction: column; --access-browse-home-section-content-width: auto; --home-collections-list-display: flex; --home-collections-list-flex-direction: column; --home-collections-list-padding-left: 0px; --home-collections-list-width: 40%; --home-collections-list-list-style: none; --home-collections-list-gap: 10px; --home-collections-list-item-border: none; --home-collections-list-item-color: #ffffff; --home-collections-list-item-background-color: var(--primary-color); --home-collections-list-item-padding: 16px; --home-collections-list-item-border-radius: 6px; --home-collections-list-item-text-transform: uppercase; --home-collections-items-list-display: flex; --home-collections-items-list-flex-wrap: wrap; --home-collections-items-list-padding-left: 0px; --home-collections-items-list-item-display: flex; --home-collections-items-list-item-width: 100%; --home-collections-items-list-item-padding: 10px; --home-collections-items-list-item-list-style: none; --home-collections-items-list-item-image-width: 25%; --home-collections-items-list-item-image-height: 120px; --home-collections-items-list-item-image-img-object-fit: cover; --home-collections-items-list-item-image-img-max-width: 100%; --home-collections-items-list-item-image-img-height: 120px; --home-collections-items-list-item-image-img-border-radius: 6px; --home-collections-items-list-item-caption-width: 75%; --home-collections-items-list-item-caption-padding-left: 20px; --home-collections-items-list-item-caption-font-size: var(--font-size-small); --home-collections-items-list-item-caption-font-weight: var(--font-weight-medium); --search-toolbar-container-width: var(--container-width); --search-toolbar-container-height: 56px; --search-toolbar-container-background-color: var(--color-light-grey); --search-toolbar-container-display: flex; --search-toolbar-container-padding: 0px var(--padding-2); --search-toolbar-content-display: flex; --search-toolbar-content-align-items: center; --search-toolbar-content-justify-content: end; --search-toolbar-content-width: var(--content-width); --search-toolbar-content-height: 100%; /*--search-toolbar-content-background-color: #f5f5f5;*/ --search-toolbar-content-margin: auto; --search-toolbar-content-padding: 20px; --icon-label-button-display: flex; --header-nav-hamburger-menu-button-display: block; --header-nav-hamburger-menu-button-background-color: transparent; --header-nav-hamburger-menu-button-padding: var(--padding-2); --header-nav-hamburger-menu-button-margin: 0 var(--margin-2) 0 0; /*--header-nav-hamburger-menu-button-align-self: flex-end;*/ --pagination-bar-page-item-display: none; --nav-pagination-bar-display: flex; --nav-pagination-bar-flex-direction: column; --nav-pagination-bar-justify-content: center; --pagination-bar-display: none; --pagination-bar-justify-content: center; --pagination-bar-page-selector-section-width: 100%; --modal-dialog-height: 100vh; --modal-dialog-margin: 0; --modal-body-flex-direction: column; --summary-info-width: 100%; --summary-images-height: 30vh; --summary-images-no-image-found-width: 100%; --summary-images-no-image-found-background-color: var(--color-text); --summary-images-no-image-found-display: flex; --summary-images-no-image-found-justify-content: center; --summary-images-no-image-found-align-items: center; --summary-images-no-image-found-flex-shrink: 0; --info-page-text-content-width: auto; --info-page-text-content-padding: var(--padding-3) var(--padding-5) var(--padding-8); --header-margin: 0; --browse-list-item-info-label-font-size: var(--font-size-1); --browse-list-item-info-type--font-size: var(--font-size-1); --research-line-page-margin: 0 var(--container-margin); --section-home-margin-top: -206px; --align-start: center; --header-hamburguer-position: fixed !important; --footer-element-width-1:100% !important; --footer-element-width-2:100% !important; --footer-last-element-width: var(--footer-element-width); --container-max-width: 100% !important; --justify-content-between: center !important; --page-title-container-flex-row: row wrap !important; --w1-4: 100% !important; --w1-5: 100% !important; --filters-width: 100% !important; --browse-section-result-width: 100% !important; --object-fill: cover !important; --object-cover: cover !important; --footer-1-element-width: 78% !important; } }