/***DESKTOPS (X-LARGE SCREEN)
*****************************************************/
@media (min-width: 1920px) {  
}

/***DESKTOPS (LARGE SCREEN)
*****************************************************/
@media (min-width: 1600px) {
}

/***NOTEBOOKS (MEDIUM SCREEN)
*****************************************************/
@media (min-width: 1024px) and (max-width: 1599px) {
}

/***FROM TABLETS TO MOBILES
*****************************************************/
@media (max-width: 1023px) {
    :root {
        /***VIEWPORT HEIGHT***/
        --viewportHeight: calc(var(--vh, 1vh) * 100);
        /***FONT SIZE***/
        --fontSizeSmall: 0.6rem;
        --fontSizeMedium: 1.25rem;
        --fontSizeLarge: 2.5rem;
        /***SPACES***/
    	--spaceY: calc(var(--fontSizeMedium) * 0.3);
    	--spaceX: calc(var(--fontSizeMedium) * 0.6);
        --mainTopSpace: calc(var(--headerHeight) + var(--rowGutterMedium) - var(--spaceY));
        --gridGap: calc(var(--spaceY)*2) var(--colGutter);
        /***SIZES***/
        --headerHeight: calc(var(--spaceY)*2.2 + var(--rowGutterMedium));
        --newsWidth: calc((var(--colWidth) * 9) + (var(--spaceX) * 10));
    }
    body {
        height: 100vh; /* Fallback */
        height: var(--viewportHeight);
    }
    header {
        padding: calc(var(--spaceY)*1.2) var(--spaceX) var(--spaceY);
	}
    section.list .list_media.cover_project {
    	display: none;
    }
}

/***TABLETS (PORTRAIT)
*****************************************************/
@media (min-width: 481px) and (max-width: 1023px) {
	section.list .list_projects {
    	grid-column: 7/13;
    }
}

/***SMALL TABLETS, MOBILES (LANDSCAPE)
*****************************************************/
@media (min-width: 481px) and (max-width: 767px) {
}

/***TABLETS, MOBILES (LANDSCAPE)
*****************************************************/
@media (min-width: 481px)  {
    .mobile:not(.list_item) {
    	display: none;
    }
}

/***MOBILES (PORTRAIT)
*****************************************************/
@media (max-width: 480px) {
    .desktop {
    	display: none;
    }
    body.scroll_less {
        overflow: hidden;
    }
    header.mobile {
    	display: flex;
        column-gap: var(--colGutter);
        flex-wrap: wrap;
        justify-content: space-between;
    }
    header.mobile .site_name,
    header.mobile .menu_button,
    header.mobile .filter_button {
    	flex: 1;
    }
    body#objects header.mobile .site_name a,
    body#object header.mobile .site_name a {
    	color: var(--paletteBlack);
    }
    header.mobile .menu_button {
    	width: 75%;
        text-align: right;
    }
    header.mobile .filter_button {
    	width: 100%;
        text-align: right;
    }
    nav.menu_mobile:not(.on) {
       display: none; 
    }
    nav.menu_mobile.on {
        display: flex;
    }
    nav.menu_mobile {
       position: fixed;
       top: var(--headerHeight);
       left: 0;
       flex-direction: column;
       justify-content: space-between;
       width: 100%;
       height: calc(100vh - var(--headerHeight));
       height: calc(var(--viewportHeight) - var(--headerHeight));
       padding: calc(var(--rowGutterMedium) - var(--spaceY)) var(--spaceX) var(--rowGutterMedium);
       background: var(--paletteBlack);
       line-height: 1;
    }
    body#index main.content {
    	flex-direction: column;
        height: calc(100vh - var(--headerHeight));
        height: calc(var(--viewportHeight) - var(--headerHeight));
    }
    article.col_item .item_data span.title {
    	opacity: 1;
    }
    section.objects_col,
    section.projects_col {
    	width: 100vw;
    	height: calc(100vh - var(--headerHeight)) * 0.5);
        height: calc((var(--viewportHeight) - var(--headerHeight)) * 0.5);
    }
    body#objects nav.menu_mobile,
    body#object nav.menu_mobile {
    	background: var(--paletteYellow);
    }
    body#objects nav.menu_mobile a,
    body#object nav.menu_mobile a {
    	color: var(--paletteBlack);
    }
    body#objects nav.menu_mobile a:hover,
    body#object nav.menu_mobile a:hover {
    	color: var(--hoverColor);
    }
    nav.menu_mobile ul {
       display: flex;
       flex-direction: column;
    }
    nav.menu_mobile ul li.menu_item.hide {
       display: none;
    }
    nav.menu_mobile ul li.menu_item.active span,
    nav.menu_mobile ul li.menu_item.active a,
    nav.menu_mobile ul li.menu_item a:hover {
       color: var(--hoverColor);
    }
    section.list .list_categories {
		position: static;
        grid-column: 1 / 7;
    }
    body#projects section.list .list_objects {
		position: static;
        grid-column: 7 / 13;
    }
    body#object section.list .list_objects {
		position: static;
        grid-column: 1 / 13;
        font-size: var(--fontSizeLarge);
    }
    section.list .list_projects {
    	position: static;
    	grid-column: 1 / 13;
    }
    section.data_text .data_sheet,
    section.data_text .text {
    	grid-column: 1 / 13;
    }
    body#projects section.list .list_projects {
        margin-top: var(--rowGutterMedium);
    }
    body#project section.list .list_projects .list_item {
        font-size: var(--fontSizeLarge);
        line-height: var(--lineHeightLow);
    }
    .reel.project {
    	height: auto;
    }
    .reel .reel_stack {
    	display: inherit;
        height: 100%;
    }
    .reel .reel_stack .stack_content {
    	flex-direction: column;
        row-gap: calc(var(--spaceY)*2);
    }
    .reel_nav {
    	display: none;
    }
    .related_entries {
    	margin-top: calc(var(--rowGutterMedium) * 4);
    	row-gap: calc(var(--spaceY)*2);
    }
    .related_entries .related_objects, .related_entries .related_projects {
    	grid-column: span 12;
    }
    .related_objects .related_item .item_data {
    	grid-column: 1 / 4;
        order: 1;
    }
    .related_objects .related_item .item_media {
   		grid-column: 4 / 7;
        order: 2;
    }
    .related_projects .related_item .item_media {
    	grid-column: 4 / 7;
    }
    section.grid .thumb {
    	grid-column: span 6;
    }
    section.grid .thumb .thumb_data {
    	opacity: 1;
    }
    body#objects section.grid .thumb .thumb_data > span,
    body#object section.stack_row .thumb .thumb_data > span {
    	text-align: center
    } 
    section.stack_row .thumb {
    	width: calc(var(--colWidth) * 12 + var(--spaceX) * 11);
    }
    .studio_stack {
    	grid-column: 1 / 13;
	}
    body#studio main.content .list_studio {
    	display: none;
    }
    .studio_stack section:not(#highlights):not(#collections) .section_content .content_row,
    .studio_stack .large_stack .section_button, .studio_stack .large_rows_stack .section_button {
    	grid-template-columns: var(--gridTemplate);
	}
    .studio_stack .section_content .content_row .row_year,
    .studio_stack .section_content .content_row .row_data,
    .studio_stack .section_content .content_row .row_data p {
    	white-space: normal;
    	overflow: hidden;
    	text-overflow: initial;
    }
    .studio_stack .section_content .content_row .row_year {
    	grid-column: 1 / 4;
	}
    .studio_stack .section_content .content_row .row_data {
    	grid-column: 4 / 13;
    }
    .studio_stack .large_stack .section_button .empty_col, .studio_stack .large_rows_stack .section_button .empty_col {
    	grid-column: 1 / 4;
    }
    .studio_stack .large_stack .section_button .button_col, .studio_stack .large_stack .section_button .button_col,
    .studio_stack .large_stack .section_button .empty_col, .studio_stack .large_rows_stack .section_button .button_col {
    	grid-column: 4 / 13;
	}
    .reel.studio .reel_stack {
        padding-inline: var(--spaceX);
        padding-bottom: var(--rowGutterMedium);
    }
    .reel.studio .content_slide .slide_media {
    	height: auto;
    }
}