/* Responsive: σε κινητά -> 1 στήλη */
@media (max-width: 768px) {
	.image-item {
		flex: 1 1 100%;
		max-width: 100%;
	}
	#last-viewed-toast {
		right:0.5rem !important;
		left:0.5rem !important;
	}
}


/* HEADER RESIZE - START */
@media screen and (min-width: 960px) {
	.header_description {
		max-width: 960px;
		font-size: clamp(0.8em, 1em, 1.1em);
		line-height: calc(1em + 70%);
	}
}
@media screen and (min-width: 730px) {
	.sitetitle { 
		margin: 0.5vh 0px 1vh 0px !important;
	}	
}

@media screen and (max-width: 710px) {
	.sitetitle { 
		padding: 0.1em 0em 0.1em 0em !important;
		font-size: 150% !important;
	}	
	.header_description {
		width: 99%;
        font-size: calc(97% - 0.1vw);
        line-height: calc(3.3vw + 0.05vh);
	}
}
@media screen and (max-width: 420px) {
	.sitetitle { 
		font-size: 4.9vw !important;
		padding: 0.15em 0em 0em 0em !important;
	}	
	.header_description {
        line-height: calc(3.7vw + 0.1vh);
		letter-spacing: -0.1px;
	}
}
@media screen and (max-width: 320px) {
	.sitetitle { 
		padding: 0.15em 0em 0em 0em !important;
	}	
	.header_description {
        font-size: calc(85% - 0.1vw);
        line-height: calc(4.8vw + 0.02vh);
        letter-spacing: -0.3px;
    }
}
/* HEADER RESIZE - END */

@media screen and (min-width: 601px) { /* menu formatting */
    .nav { width: 215px; /* aligns down arrow correctly when menu is either expanded or contracted */ }
    .expand { padding-right: 2px; /* adds a bit of space next to the down arrow in submenus */ }
	.nav a span:first-child::before, button.dropdown-btn span::before { /* menu links break up evenly from 600px upwards */
		content: "\a";
		white-space: pre;
	}
}

@media screen and (max-width: 600px) {	/* formatting for mobile view res */
	.row { display: block !important; }
	.colleft { display: contents !important; }
    .colright { padding-top: 10px; padding-left: 0px !important; }
    h2 { width: 90%; }
    h2::before { 
        display: block; 
        content: " "; 
        margin-top: -1px; 
        height: 1px; 
        visibility: hidden; 
        pointer-events: none;
    }
	.nav { display: table !important; width: 100%; padding-right: 0px !important; } 
    .nav a span::before, button.dropdown-btn span::before { /* changes line breaks in menu */
        content: "";
        white-space: normal;
	}
	.nav a:not(:first-child), .dropdown .dropdown-btn  { display: none; }
	.nav a:nth-child(2) { margin-top: 5px; }
	.nav a.icon {
		background-color: #0a2f4ead;
		color: #ff9550;
		font-weight: 700;
		text-align: left;
		display: block;
        border-top: none;
        border-radius: 5px;
        box-shadow: 0px 3px 5px #b7b7b7;
		padding: 5px 10px 3px;
		margin-top: 0px;
		letter-spacing: 0.4px;
	}
	.dropdown-container { background: none !important; }
	.dropdown-container a:first-child { display: none; padding-bottom: 0px; }
	.nav.responsive {
		position: relative;
        display: inline-grid !important;
		background: linear-gradient(0deg, rgba(69, 104, 121, 0.24) 25%, rgba(180, 207, 230, 0.25) 65%, rgba(214, 215, 214, 0) 100%) !important;
        width: 100%;
        margin-top: 0px;
		border-radius: 3px;
		padding: 0px;
	}
	.nav.responsive .icon {
        display: block;
        text-align: left;
		color: white;
	}
	.nav.responsive a, .nav.responsive button {
		text-align: left;
		display: -webkit-box;
		padding-left: 10px;
		padding-right: 10px;		
	}
	.nav.responsive .dropdown { float: none; }
	.nav.responsive .dropdown-container {
		position: relative;
		background: none;
		padding-left: 10px;
		padding-bottom: 0px;
	}
	.nav.responsive .dropdown .dropdown-btn {
		display: block;
		width: 100%;
		text-align: left;
  }
    .page-content span.nav_level2 { /* changes vertical to horizontal display in last element of nav_level2 in page */
        writing-mode: vertical-rl;
        text-orientation: upright;        
    }
    .page-content div.row div div:last-child .nav_level2, .page-content div.row div.interview div:nth-last-child(2) span.nav_level2 { /* changes vertical to horizontal display in last element of nav_level2 in page */
        writing-mode: initial;
        text-orientation: initial;        
    }
}