/***TABLETS to MOBILES (LANDSCAPE and PORTRAIT)
*****************************************************/
@media (max-width: 1024px) {
	.slider_nav {
    	/*display: flex;*/
    }
    .slider_nav .prev, .slider_nav .next {
        display: flex;
        align-items: center;
	}
    .slider_nav .prev {
        justify-content: start;
	}
    .slider_nav .next {
        justify-content: end;
	}
    .slider_nav .prev span.cursor, .slider_nav .next span.cursor {
        opacity: 1;
        padding: var(--spaceY) var(--spaceX);
        position: static !important;
	}
}

/***TABLETS (PORTRAIT)***/
@media (min-width: 768px) and (max-width: 1024px) {
	:root {
    	--titleSize: var(--fontSize);
    	--viewportHeight: calc(var(--vh, 1vh) * 100);
        --fullHeight: var(--viewportHeight);
    	--mainHeight: calc(100vh - var(--mainTopSpace) - var(--mainBottomSpace));
        --mainHeight: calc(var(--viewportHeight) - var(--mainTopSpace) - var(--mainBottomSpace));
    }
	body {
  		height: 100vh; /* Fallback */
  		height: var(--viewportHeight);
	}
    /*
    body > .site_name {
    	padding: var(--spaceY) var(--spaceX);
    	line-height: var(--lineHeight);
    }
    span.site_name,
    .site_name span {
    	padding: 0;
        line-height: var(--lineHeight);
	}
    */
    body#index article.thumb .thumb_media {
    	opacity: 1;
    }
    section.info_layer .info_data,
    section.info_layer .info_text,
    section.info_layer .info_img {
  		grid-column: 1 / 5;
	}
}
/***TABLETS (LANDSCAPE)***/
@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
	:root {
    	--titleSize: var(--fontSize);
    	--viewportHeight: calc(var(--vh, 1vh) * 100);
        --fullHeight: var(--viewportHeight);
    	--mainHeight: calc(100vh - var(--mainTopSpace) - var(--mainBottomSpace));
        --mainHeight: calc(var(--viewportHeight) - var(--mainTopSpace) - var(--mainBottomSpace));
    	--mainTopSpace: calc(var(--headerHeight) + var(--rowGutter)*1);
    }
    body {
  		height: 100vh; /* Fallback */
  		height: var(--viewportHeight);
	}
    /*
    body > .site_name {
    	padding: var(--spaceY) var(--spaceX);
    	line-height: var(--lineHeight);
    }
    span.site_name,
    .site_name span {
    	padding: 0;
        line-height: var(--lineHeight);
	}
    */
	body#index article.thumb .thumb_media {
    	opacity: 1;
    }
    section.info_layer .info_data,
    section.info_layer .info_text,
    section.info_layer .info_img {
  		grid-column: 1 / 5;
	}
}

/***SMALL TABLETS, MOBILES (LANDSCAPE)***/
@media (min-width: 481px) and (max-width: 767px) {
	:root {
    	--titleSize: var(--fontSize);
    	--viewportHeight: calc(var(--vh, 1vh) * 100);
        --fullHeight: var(--viewportHeight);
    	--mainHeight: calc(100vh - var(--mainTopSpace) - var(--mainBottomSpace));
        --mainHeight: calc(var(--viewportHeight) - var(--mainTopSpace) - var(--mainBottomSpace));
    	--mainTopSpace: calc(var(--headerHeight) + var(--rowGutter)*1);
  		--mainBottomSpace: calc(var(--headerHeight) + var(--rowGutter)*1);
        --footerHeight: calc(var(--headerHeight) + var(--rowGutter)*1);
    }
    body {
  		height: 100vh; /* Fallback */
  		height: var(--viewportHeight);
	}
    /*
    body > .site_name {
    	padding: var(--spaceY) var(--spaceX);
    	line-height: var(--lineHeight);
    }
    span.site_name,
    .site_name span {
    	padding: 0;
        line-height: var(--lineHeight);
	}
    */
	body#index section.thumb_grid {
    	column-count: 6;
	}
  	body#index article.thumb .thumb_media {
    	opacity: 1;
    }
    body#index article.thumb .thumb_data,
    body#project .project_header,
    body#video .project_header {
    	width: calc(50% - var(--spaceX) - var(--colGutter)*0.5);
    	top: var(--rowGutter);
    }
    section.multimedia section.thumb_grid {
    	column-count: 3;
    }
    .data {
    	grid-gap: var(--gridGap);
    }
    .data_row {
    	grid-column: 1 / 4;
        row-gap: 0 var(--colGutter);
    }
    .data_row span.credit, 
    .data_row span.name {
    	grid-column: 1 / 4;
    }
    section.info_layer .info_data,
    section.info_layer .info_text,
    section.info_layer .info_img {
  		grid-column: 1 / 5;
	}
    ul.index_list {
    	grid-column: 1 / 5;
    }
    .index_row .title {
    	grid-column: 1 / 3;
    }
    .index_row .date {
    	grid-column: 3 / 4;
    	text-align: right;
    }
}

/***MOBILES (PORTRAIT)***/
@media (max-width: 480px) {
	:root {
    	--titleSize: var(--fontSize);
    	--viewportHeight: calc(var(--vh, 1vh) * 100);
        --fullHeight: var(--viewportHeight);
    	--mainHeight: calc(100vh - var(--mainTopSpace) - var(--mainBottomSpace));
        --mainHeight: calc(var(--viewportHeight) - var(--mainTopSpace) - var(--mainBottomSpace));
    	--mainTopSpace: calc(var(--headerHeight) + var(--rowGutter)*2);
  		--mainBottomSpace: calc(var(--headerHeight) + var(--rowGutter)*2);
        --footerHeight: calc(var(--headerHeight) + var(--rowGutter)*2);
    }
    body {
  		height: 100vh; /* Fallback */
  		height: var(--viewportHeight);
	}
    /*
    body > .site_name {
    	padding: var(--spaceY) var(--spaceX);
    	line-height: var(--lineHeight);
    }
    span.site_name,
    .site_name span {
    	padding: 0;
        line-height: var(--lineHeight);
	}
    */
	body#index section.thumb_grid {
    	column-count: 3;
	}
	body#index article.thumb .thumb_media {
    	opacity: 1;
    }
    body#index article.thumb .thumb_data,
    body#project .project_header,
    body#video .project_header {
        width: 100%;
        top: calc(var(--spaceY) + var(--rowGutter)*2);
        left: 0;
        padding: 0 var(--spaceX);
	}
    main#content.move_to_slider section.multimedia {
  		left: calc((100% - (var(--colGutter)*0.5) + var(--spaceX))*-1);
	}
    main#content.move_to_data section.multimedia {
    	left: calc((200% - (var(--colGutter)*0.5) + var(--spaceX))*-1);
    }
    main#content.move_to_data section.data {
    	left: var(--spaceX);
    }
    section.multimedia section.thumb_grid {
        width: calc(100% - var(--spaceX));
        column-count: 3;
	}
    section.multimedia .slides,
    section.multimedia .video_media {
    	margin-left: calc((100% - var(--colGutter)*0.5) + var(--spaceX));
        z-index: 100;
    }
    section.multimedia .slides .slide {
    	/*height: calc(100% - var(--rowGutter)*2);*/
    	grid-column: 1 / 9;
        /*margin-top: var(--rowGutter);*/
    }
    section.multimedia .slider_footer {
    	padding: calc(var(--rowGutter)*2) var(--spaceY) var(--spaceX);
    }
    .project_footer {
		padding: calc(var(--rowGutter)*2) var(--spaceX) var(--spaceY);
        background: linear-gradient(0deg, rgba(252,252,252,1) 0%, rgba(252,252,252,0.7)70%, rgba(252,252,252,0) 100%);  
        transition-property: opacity, transform;
    	transition-duration: var(--transitionDuration);
    }
    .project_footer.hide_mobile,
    .images_button.hide_mobile,
    .read_button.hide_mobile,
    .close_button_read.hide_mobile {
    	opacity: 0;
    	pointer-events: none;
	}
    .data {
    	width: calc(100% - var(--spaceX));
        /*grid-gap: var(--gridGap);*/
    }
    .data_row {
    	/*grid-column: 1 / 4;*/
        grid-column: 1 / 5;
        row-gap: 0 var(--colGutter);
    }
    /*
    .data_row span.credit, 
    .data_row span.name {
    	grid-column: 1 / 4;
    }
    */
    .data_text {
    	grid-column: 1 / 5;
    }
    section.info_layer .info_data,
    section.info_layer .info_text,
    section.info_layer .info_img {
  		grid-column: 1 / 5;
	}
    nav.index_layer,
    nav.videos_layer,
	section.info_layer {
		width: 100%;
    }
    ul.index_list {
    	grid-column: 1 / 5;
    }
    .index_row .title {
    	grid-column: 1 / 3;
    }
    .index_row .date {
    	grid-column: 3 / 4;
    	text-align: right;
    }
}