/* ===============================================================
TABLE OF CONTENTS

01. RESET CSS
02. BASIC
03. INDEX PAGE

=================================================================*/


/* ===============================================================
01. RESET CSS
=================================================================*/
/* http://meyerweb.com/eric/tools/css/reset/
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}



/* My additions */
a {
	text-decoration: none;
}

/* For anchor links to land */

[id*='anchor'] {
	display: block;
	height: 2vmin;
	margin-top: -2vmin;
	visibility: hidden;
}

/* End of Reset */

/* ===============================================================
02. BASIC
=================================================================*/

@import url('https://fonts.googleapis.com/css2?family=Roboto+Slab:wght@100..900&display=swap');

.roboto-slab-<uniquifier> {
  font-family: "Roboto Slab", serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}

@font-face {
	font-family: GFSArtemisia, serif;
	src: url(assets/fonts/GFSArtemisia.otf);
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: GFSArtemisia, serif;
	src: url(assets/fonts/GFSArtemisiaBold.otf);
	font-weight: bold;
	font-style: normal;
}

@font-face {
	font-family: GFSArtemisia, serif;
	src: url(assets/fonts/GFSArtemisiaBoldIt.otf);
	font-weight: bold;
	font-style: italic;
}

@font-face {
	font-family: GFSArtemisia, serif;
	src: url(assets/fonts/GFSArtemisiaIt.otf);
	font-weight: normal;
	font-style: italic;
}

body {
	font-size: 9px;
	font-size: calc(8px + 1.65vmin);
	line-height: 1.25;
	font-family: Roboto Slab, Serif;

	color: #111111;
	background-color: #e9e1c5;
}

.siteWideOpeningHours {
    position: fixed;
    padding: 20vh 10vw;
    width: 80vw;
    z-index: 9999;
    height: 100vh;

    text-align: center;
    font-family: GFSArtemisia, Serif;

    color: #ffffff;

    background-color: #670000;
}

#siteWideOpeningHours {
	display: none;
}

.siteWideOpeningHours__pic {
	width: 80%;
	display: block;
	padding-left: 6vw;
}

.siteWideOpeningHours__pic > svg {
	width: 100%;
	margin: auto;
	display: block;
}

.siteWideOpeningHours__title {
	width: 80%;
	display: block;
	margin: 4vmin auto;

	font-size: 1.5em;
	font-weight: bold;
	font-style: italic;

	color: #f2dd9c;
}

.siteWideOpeningHours__main-text {
	width: 80%;
	display: block;
	margin: 4vmin auto;


}


.sitewideHeader {
	background-color: #670000;
}

.sitewideHeader__25Icon {
	display: block;
	position: fixed;
	right: 0;
	z-index: 999;
}

.sitewideHeader__25Icon__img {
	width: 20vmin;
	height: 20vmin;
}

.sitewideHeader__logo {
	height: 18vmin;
    display: block;
    padding: 2vmin 3vmin 2vmin 0.5vmin;
}

.sitewideHeader__logo > svg {
    height: 100%;
    margin: auto;
    display: block;
}

.sitewideHeader__subtitle {
    padding: 0.5vmin 2vmin 1vmin;
    
    text-align: center;
    font-size: 0.75em;
    font-style: italic;
    font-family: GFSArtemisia, Serif;
    color: #ffffff;

	color: #ffffff;
}

.sitewideHeader__div {
	overflow: hidden;
	height: 10vmin;
}

.sitewideHeader__div__menuEdgeLeft,
.sitewideHeader__div__menuEdgeRight {
	background-color: red;
	display: block;
	width: 7vmin;
	height: 10vmin;
	position: absolute;
}

.sitewideHeader__div__menuEdgeLeft {
	right: 0;

    background: -moz-linear-gradient(90deg, rgba(103, 0, 0, 0) 0%, rgb(103, 0, 0) 100%);
    background: -webkit-linear-gradient(90deg, rgba(103, 0, 0, 0) 0%, rgb(103, 0, 0) 100%);
    background: linear-gradient(90deg, rgba(103, 0, 0, 0) 0%, rgb(103, 0, 0) 100%);
}

.sitewideHeader__div__menuEdgeRight {
	left: 0;
    background: -moz-linear-gradient(90deg, rgb(103, 0, 0) 0%, rgba(103, 0, 0, 0) 100%);
    background: -webkit-linear-gradient(90deg, rgb(103, 0, 0) 0%, rgba(103, 0, 0, 0) 100%);
    background: linear-gradient(90deg, rgb(103, 0, 0) 0%, rgba(103, 0, 0, 0) 100%);
}

.sitewideHeader__div__menu {
    padding-bottom: 3vmin;
    height: 20vmin;

	white-space: nowrap;
    overflow-x: scroll;
    overflow-y: hide;
    -webkit-overflow-scrolling: touch;

    text-align: center;
}

.sitewideHeader__div__menu__item {
	display: inline-block;
    margin: 1.75vmin 0.15vmin;
}

.sitewideHeader__div__menu__item:nth-child(3) {
	padding-left: 5vmin;
}

.sitewideHeader__div__menu__item:last-child {
	padding-right: 5vmin;
}

.sitewideHeader__div__menu__item__aHref {
    padding: 0.5vmin 1.5vmin;;

	color: #ffeba2;

    border-radius: 1vmin;
}

.sitewideHeader__div__menu__item:nth-child(7) a::after {
    content: "(Κάθε Πέμπτη)";
    color: #e9e1c5;
    position: relative;
    font-size: 0.75em;
    text-align: center;
    font-family: GFSArtemisia, Serif;
    font-style: italic;
    font-weight: bold;
}


/* Footer */

.siteWideFooter {
    display: block;
    padding: 5vmin;
    margin-bottom: 20.2vmin;

    background-color: #670000;
    color: white;
}

.siteWideFooter__header {

}

.siteWideFooter__header__picture {
	display: block;
	width: 25vmin;
	padding-bottom: 3vmin;
}

.siteWideFooter__textBlock {

}

.siteWideFooter__textBlock__title {
	margin-bottom: 2vmin;

	text-transform: uppercase;

	color: #ffeba2;
}

.siteWideFooter__textBlock__p {
	margin-bottom: 6vmin;
}

.siteWideFooter__textBlock__p__aHref {
	display: block;
	padding: 1vmin 1vmin 1vmin 0;
	color: #ffffff;
}

.siteWideFooter__textBlock__hours {
	display: grid;
	grid-template-columns: max-content max-content;
	grid-column-gap: 5%;
}

.siteWideFooter__textBlock__hours > span:last-child {
	text-decoration: line-through;
}

.siteWideFooter__siteCredit {
	margin: 20vmin auto 0;
	display: block;
	padding: 1vmin 3vmin;
	width: max-content;
	
	font-size: 0.75em;

	color: #b3afa2;
	background-color: #450000;
}

@media (orientation: landscape) {
	.siteWideFooter  {
		margin-bottom: 0;
	}

	.siteWideFooter__textBlock  {
		display: grid;
		grid-template-columns: 45% 45%;
		grid-column-gap: 5%;
	}

	.siteWideFooter__textBlock > * {
		text-align: right;
	}

	.siteWideFooter__textBlock > *:first-child {
		text-align: left;
	}

	.siteWideFooter__textBlock__hours {
		float: right;
	}
}

/* Call to Action */

.sitewideCallToAction {
    position: fixed;
    bottom: 0; 
    width: 80vw;
    padding: 0 10vw;
    height: 20vmin;
    display: grid;
    grid-template-columns: 26% 26% 26%;
    grid-column-gap: 12%;
    background-color: #670000;
    border-top: 0.2vmin solid white;
}


.sitewideCallToAction__button {
 	text-align: center;
	color: white;
}


.sitewideCallToAction__button__icon {
	font-size: 8vmin;
    padding: 3vmin;
}

.sitewideCallToAction__button__text {
 	line-height: 1;
 	font-size: 0.9em;
}

/*@media (orientation: landscape) {
	.sitewideCallToAction {
		display: none;
	}
}
*/

/* ===============================================================
03. INDEX PAGE
=================================================================*/

.indexPage {
	
}

.indexPage__menuSection {
	display: block;
    height: max-content;
	width: 90vw;
	margin: 5vmin auto;

	background-color: white;

	overflow: hidden;
    border-radius: 2vmin;
}

.indexPage__menuSection--kontosouvli {
	background-color: #e9e1c5;
	border: 0.2vmin solid #670000;
}

.indexPage__menuSection__header {
	
}

.indexPage__menuSection--kontosouvli .indexPage__menuSection__header::before {
    content: 'Κάθε Πέμπτη';
    position: absolute;
    padding: 3vmin 7vmin;

    font-family: GFSArtemisia, serif;
    font-style: italic;
    font-size: 1.5em;
    font-weight: bold;
    
    color: #f2dd9c;
}

.indexPage__menuSection__header__pic {
	width: 100%;
	height: 45vmin;
	display: block;
	overflow: hidden;
}

.indexPage__menuSection__header__pic__img {
	object-fit: cover;
    width: 100%;
}

.indexPage__menuSection__header__decor {
	display: block;
	width: 1.5vmin;
	height: 45vmin;
	margin: -45vmin auto 0 3vmin;
	position: relative;

	background-image: url(assets/romvos.png);
	background-repeat: repeat-y;
	background-size: contain;
}

.indexPage__menuSection__header__title {
	padding: 5vmin 5vmin 0;

	font-weight: bold;
	font-size: 1.45em;

	color: #670000;
	
}

.indexPage__menuSection__header__desc {
	padding: 0 5vmin;

	font-style: italic;
	font-family: GFSArtemisia, serif;
	font-weight: bold;

	color: #bc635a;
}

.indexPage__menuSection__header__specialDesc {
	padding: 0 5vmin;
	
	font-style: italic;
	font-family: GFSArtemisia, serif;
	font-weight: bold;

	color: #bc635a;
}

.indexPage__menuSection__pricelist {
	display: block;
	padding: 5vmin 5vmin;
	width: 100%;
}

.indexPage__menuSection__pricelist--doublePrice {
	display: block;
	padding: 5vmin 5vmin;
	width: 100%;
}


.indexPage__menuSection__pricelist__headerRow {
	display: grid;
    grid-template-columns: auto 10vmin;
    width: 80vmin;
}

.indexPage__menuSection__pricelist__headerRow__product {
	
}

.indexPage__menuSection__pricelist__headerRow__price {
	font-size: 0.6em;
	text-transform: uppercase;
	text-align: right;
	padding: 0 1vmin;
}

.indexPage__menuSection__pricelist__productRow {
	display: grid;
    grid-template-columns: auto 10vmin;
    width: 80vmin;
	padding: 1.25vmin 0;

    border-bottom: 0.1vmin dotted #000000;
}

.indexPage__menuSection__pricelist__productRow:last-child {
    border-bottom: 0 solid transparent;
}

.indexPage__menuSection__pricelist--doublePrice .indexPage__menuSection__pricelist__headerRow, 
.indexPage__menuSection__pricelist--doublePrice .indexPage__menuSection__pricelist__productRow {
	grid-template-columns: auto 10vmin 10vmin;
}

.indexPage__menuSection__pricelist__headerRow__price:last-child {
	color: #ad4236;
}


.indexPage__menuSection__pricelist__productRow--double {
	display: grid;
    grid-template-columns: auto 10vmin 10vmin;
    width: 80vmin;
	padding: 1.25vmin 0;

    border-bottom: 0.1vmin dotted #000000;
}

.indexPage__menuSection__pricelist__productRow__product {
	color: #670000;
}

.indexPage__menuSection__pricelist__productRow__product__name {
	display: inline-block;

	font-weight: bold;
}

.indexPage__menuSection__pricelist__productRow__product__mentions {
	display: inline-block;
	padding: 0 1vmin;

	font-size: 0.85em;

	color: #c2912a;
}

.indexPage__menuSection__pricelist__productRow__product__specialMentions {
	display: inline-block;
	padding: 0 1vmin;

	font-size: 0.85em;
	font-family: GFSArtemisia, Serif;
	font-style: italic;
	font-weight: bold;

	color: #984a2f;
}

.indexPage__menuSection__pricelist__productRow__product__desc {
	font-size: 0.85em;

	color: black;
}

.indexPage__menuSection__pricelist__productRow__highPrice {
	padding: 0 1vmin;
	text-align: right;
}

.indexPage__menuSection__pricelist__productRow__lowPrice {
	padding: 0 1vmin;
	text-align: right;

	color: #ad4236;
}

.indexPage__menuSection__ingredients {
	padding: 0vmin 5vmin 5vmin;
	line-height: 1.35;
}


.indexPage__menuSection__ingredients__h {
	font-size: 0.9em;
	font-family: GFSArtemisia, Serif;
	font-weight: bold;
	font-style: italic;

	color: #670000;
}

.indexPage__menuSection__ingredients__items {
	font-size: 0.8em;

	color: #c2912a;
}

.indexPage__menuSection__extras {
	padding: 0vmin 5% 5vmin;

    line-height: 1.35;
    text-align: left;
}

.indexPage__menuSection__extras__pricelist {
	width: 50%;
}
.indexPage__menuSection__extras__pricelist__headerRow {

	font-size: 0.9em;
	font-family: GFSArtemisia, Serif;
	font-weight: bold;
	font-style: italic;
	
	color: #670000;
}

.indexPage__menuSection__extras__pricelist__headerRow__item {

}

.indexPage__menuSection__extras__pricelist__headerRow__item:last-child {
    width: 100%;
    display: block;
    text-align: center;
}

.indexPage__menuSection__extras__pricelist__productRow {
	font-size: 0.8em;

	color: #c2912a;
}
.indexPage__menuSection__extras__pricelist__productRow__name {

}

.indexPage__menuSection__extras__pricelist__productRow__price {
    width: 100%;
    display: block;
    text-align: center;
}

.indexPage__menuSection__meatlessSanwich {
	display: block;
    margin: 0 2.5vw 2.5vw;
    padding: 2vmin;

    background-color: #f2dd9c;
    border-radius: 1.5vmin;
}

.indexPage__menuSection__meatlessSanwich__title {
	font-weight: bold;
	font-size: 1.45em;

	color: #670000;
}

.indexPage__menuSection__meatlessSanwich__pricelist {
	display: block;
	padding: 2vmin 0 0;
	width: 100%;
}

.indexPage__menuSection__meatlessSanwich__pricelist__productRow {
	display: grid;
	grid-template-columns: auto 10vmin 10vmin;
	padding: 1.25vmin 0;
}

.indexPage__menuSection__meatlessSanwich__pricelist__productRow:first-child {
	border-bottom: 0.1vmin dotted #000000;
}

.indexPage__menuSection__meatlessSanwich__pricelist__productRow__product {

}

.indexPage__menuSection__meatlessSanwich__pricelist__productRow__product__name {
	display: inline-block;
	font-weight: bold;

	color: #670000;
}

.indexPage__menuSection__meatlessSanwich__pricelist__productRow__product__desc {
	font-size: 0.85em;
	color: black;
}

.indexPage__menuSection__meatlessSanwich__pricelist__productRow__highPrice {
	padding: 0 1vmin;
	text-align: right;
}

.indexPage__menuSection__specialSouvlaki {
	width: max-content;
	margin: 0vmin 5% 3vmin;
	border-radius: 1vmin;
	padding: 2.5% 5%;

	font-size: 0.85em;
	font-family: GFSArtemisia, Serif;
	font-style: italic;
	font-weight: bold;
	
	background-color: #f2dd9c;
	color: #670000;
}

.indexPage__menuSection__specialMenuMerides {
	width: 90%;
	margin: 0vmin 5% 3vmin;
	border-radius: 1vmin;

	font-weight: bold;

	background-color: #f2dd9c;
	color: #670000;
}

.indexPage__menuSection__specialMenuMerides__pricelist {
    padding: 3vmin 0% 3vmin 4%;
    display: block;

}

.indexPage__menuSection__specialMenuMerides__pricelist__row {
	display: grid;
	grid-template-columns: auto 10vmin 10vmin;
	padding: 1vmin 0;
}

.indexPage__menuSection__specialMenuMerides__pricelist__row__name {
    padding-right: 3vmin;
}

.indexPage__menuSection__specialMenuMerides__pricelist__row__price {

}

@media (orientation: landscape) {
	.indexPage {
        width: 90vw;
        display: grid;
        grid-template-columns: 48% 48%;
        grid-column-gap: 4%;
        margin: auto;
	}
	.indexPage__menuSection {
		width: 100%;
	}


	.indexPage__menuSection__header {
		
	}

	.indexPage__menuSection__header__pic {
		height: 35vmin;
	}

	.indexPage__menuSection__header__pic__img {

	}

	.indexPage__menuSection__header__title {
		padding-left: 2.5vw;
	}

	.indexPage__menuSection__header__desc {
		padding-left: 2.5vw;
	}

	.indexPage__menuSection__header__specialDesc {
		padding-left: 2.5vw;
	}

	.indexPage__menuSection__pricelist {
		padding: 5vmin 2.5vw;
	}

	.indexPage__menuSection__pricelist__headerRow {
		width: 38.2vw;
	}

	.indexPage__menuSection__pricelist__headerRow__product {
		
	}

	.indexPage__menuSection__pricelist__headerRow__price {
	}

	.indexPage__menuSection__pricelist__productRow {
		width: 38.2vw;
	}

	.indexPage__menuSection__pricelist__productRow--double {
	    grid-template-columns: auto 10vmin 10vmin;
	    width: 38.2vw;
	}


	.indexPage__menuSection__pricelist__productRow__product {
	}

	.indexPage__menuSection__pricelist__productRow__product__name {
	}

	.indexPage__menuSection__pricelist__productRow__product__mentions {
	}

	.indexPage__menuSection__pricelist__productRow__product__specialMentions {
	}

	.indexPage__menuSection__pricelist__productRow__product__desc {

	}

	.indexPage__menuSection__pricelist__productRow__highPrice {

	}

	.indexPage__menuSection__pricelist__productRow__lowPrice {

	}

	.indexPage__menuSection__ingredients {
		padding: 0vmin 2.5vw 5vmin;
	}
}