@charset "utf-8";
body, html {

  margin: 0px;
	padding: 0px;
  font-family:Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif";
  font-size: 15px;
	color: white;
}


p
{
	margin: 0px;
	padding: 5px;
	text-align: center;
}

a:link
{
color:white;
}
a:visited
{
color:white;
}
a:hover
{
color:white;
}


.bg 
{
  background-image:url(images/GreeceSeaChurches.jpg);
  width:100%;
 height: 100%; 
  background-position:center;
  background-repeat: no-repeat;
  background-size: cover;
background-attachment: fixed;
} 

.header
{
	width:100%;	
	font-size: 60px;
	text-align: center;
	font-variant-caps:small-caps;
	text-shadow:3px 3px 3px #000000;
	font-weight: bold;
	color: #ffffff;
}

#navbox
{
	display:inline;
	width:100%;
	height:45px;
    margin: 0px;
	
}
.nav ul 
{
  list-style:none;
  background-color:#494949;
  text-align: center;
  padding: 0px;
  margin: 0px;
}

.nav li 
{
 
  display:inline-flex;
  font-family: 'Oswald', sans-serif;
  font-size:16px;
  line-height: 45px;
  height: 45px;
  padding-left:10px;
  padding-right:10px; 
}
 
.nav a 
{
  text-decoration: none;
  color: #fff;
  display: block;
  
}
 
.nav a:hover 
{
  color:#ffffff;
  border-bottom: 5px solid #FA9F1E;
}
 
.nav a.active 
{
  color:#0C3;
  background-color:#39C;
  cursor: default;
}

.textshadow
{
	font-family: 'Oswald', sans-serif;
  	font-size:42px;
	text-shadow:-5px -5px 5px #FFFFFF;
}


#banner
{
	width:100%;
	height:auto;
	background-color:rgba(30,118,225,0.90);
	margin: 0px;
	padding-bottom: 10px;
	box-sizing: border-box;
}




.title1
{
	
	font-size: 38px;
	text-align: center;
	font-variant-caps:small-caps;	
	
}

.title2
{

	font-size: 30px;
	text-align: center;
	font-variant-caps:small-caps;

}

.title3
{
	text-align: center;
}

#Space
{
	width:100%;
	height:50px;
	margin: 0px;
	
}

#info-box
{
	width:100%;
	height:auto;
	background-color:rgba(30,118,225,0.90);	
	margin: 0px;
	box-sizing: border-box;
	padding-bottom: 10px;
}

.info
{
	padding:0% 5% 0% 5%;
	text-align: center;
}

img
{
  display: block;
  margin-left: auto;
  margin-right: auto;
}

#menu
{
	width:98%;
	height:auto;
	-webkit-columns:4;
	columns: 4;
	column-rule-style: solid;
	column-rule-color: cornflowerblue;
	background-color:rgba(30,118,225,0.90);	
	padding: 0% 1%x 0% 1%;
	margin: 0px;
	font-size:14px;
	box-sizing:border-box;
	
}

.menu-title
{
	font-weight: 800;
	color:rgba(11,27,65,1.00);
	font-size: 22px;
	 
}

.menu-item
{
	font-weight:700;
	font-size:16px;
	text-align: left;
	padding: 0px 0px 3px 0px;
	color: rgba(255,160,3,1.00)
}

.menutitle2
{
	-webkit-column-span: all;
	-moz-column-span: all;
	font-size: 34px;
	text-align: center;
	font-variant-caps:small-caps;
	column-span: all;
	padding-bottom: 15px;
}
li
{
	text-decoration: none;
}

li.menu
{
	break-inside: avoid;
	list-style: none;
	padding-bottom: 15px;	
}

#entertainment
{
	width:98%;
	height:auto;
	column-count: 2;
	column-rule-style: solid;
	column-rule-color: cornflowerblue;
	background-color:rgba(30,118,225,0.90);	
	padding: 0% 1% 0% 1%;
	margin: 0px;
	font-size:14px;
	box-sizing: border-box;
	text-align: center;

	
}

li.entertainment
{
	break-inside: avoid;
	list-style: none;
	padding-bottom: 15px;	
}





@media (max-width: 1920px){
#menu
{
	width:98%;
	height:auto;
	column-count: 4;
	column-rule-style: solid;
	column-rule-color: cornflowerblue;
	background-color:rgba(30,118,225,0.90);	
	margin: 0px;
	font-size:14px;
	padding: 0% 1% 0% 1%;
	box-sizing: border-box;
}


@media (max-width: 667px){
#menu
	{
	width:98%;
	height:auto;
	column-count: 2;
	column-rule-style: solid;
	column-rule-color: cornflowerblue;
	background-color:rgba(30,118,225,0.90);	
	padding: 0% 1% 0% 1%;
	font-size:14px;
		margin: 0px;
		box-sizing: border-box;
	}
	
	.header
{
	width:100%;	
	font-size: 40px;
	text-align: center;
	font-variant-caps:small-caps;
	text-shadow:3px 3px 3px #000000;
	font-weight: bold;
	color: #ffffff;
}

}

@media ( max-width : 375px ){
#menu
	{
	width:98%;
	height:auto;
	column-count: 1;
	column-rule-style: solid;
	column-rule-color: cornflowerblue;
	background-color:rgba(30,118,225,0.90);	
	padding: 0% 1% 0% 1%;
	font-size:14px;
	margin: 0px;
	}
	
.header
{
	width:100%;	
	font-size: 30px;
	text-align: center;
	font-variant-caps:small-caps;
	text-shadow:3px 3px 3px #000000;
	font-weight: bold;
	color: #ffffff;
}