/*-----Photo Album-----*/

#images {
    width: 50%;
    /*height: 350px;*/
    overflow: hidden;
    position: relative;
    margin: 20px auto;
    float:left;
}
#images img {
    width: 100%;
    position: absolute;
    top: 0;
    left: -400px;
    z-index: 1;
    opacity: 0;
    transition: all linear 500ms;
    -o-transition: all linear 500ms;
    -moz-transition: all linear 500ms;
    -webkit-transition: all linear 500ms;
}

#images img:target {
    left: 0;
    z-index: 1;
    opacity: 1;
    position: relative;
}

#images img:first-child {
    left: 0;
}

#slider {
	width:45%;
    padding: 1% 1%;
    position:relative;
    float:left;

}

#slider a {
    padding: 1% 1%;
}

/*-----END OF Photo Album-----*/

body {
font-family:arial;
min-width:320px;
}

@font-face {
  font-family: "Century Gothic";
  src: url(centurygothic.ttf) format("truetype");
}

#myBtn {
  display: none; /* Hidden by default */
  position: fixed; /* Fixed/sticky position */
  bottom: 20px; /* Place the button at the bottom of the page */
  right: 30px; /* Place the button 30px from the right */
  z-index: 99; /* Make sure it does not overlap */
  border: none; /* Remove borders */
  outline: none; /* Remove outline */
  background-color: #1b84ff; /* Set a background color */
  opacity: 0.8;
  color: white; /* Text color */
  cursor: pointer; /* Add a mouse pointer on hover */
  padding: 15px; /* Some padding */
  border-radius: 10px; /* Rounded corners */
  font-size: 18px; /* Increase font size */
}

#myBtn:hover {
    opacity: 1;
}

#par1 { font-size: 80% }
#link { font-size: 80% }
.menu .arrow .sub-menu li { font-size: 100%}
#copyright {
	font-size:70%;
	color:gray;
	text-align:left;
}

.top {
	background-color:#E7EEF1;
	width:100%;
	height: 50px;
	vertical-align:middle;
	border-style:none;
}

.bottom {
	background-color:#636e72;
	width:100%;
	vertical-align:middle;
	border-style:none;
	float:left;
	position:relative;
	padding-top:5px;
	padding-bottom:5px;
}

.topcontainer {
	float:left;
	padding-top:15px;
	padding-right:50px;

}

.toptext {
	font-family:Arial, Helvetica, sans-serif;
	color:#999999;
	font-size:17px;
	position:relative;
	float:left;
	padding-left:3px;

}

.topImg {
	margin-bottom:0px;
	margin-right:2px;
	opacity:0.4;
	position:relative;
	float:left;
}

.fbImg {
	margin-bottom:0px;
	margin-right:0px;
	opacity:0.5;
	padding-top:10px;
	padding-left:8px;
	position:relative;
	float:right;
}

.fbImg:hover
{
	opacity:1;
}

.header {
	background-color:white;
	width:100%;
	height: 120px;
	vertical-align:middle;
	border-style:none;
}

.coverimage {
	background-image: url('newimages/background.jpg');
	background-position:right;
	background-repeat: no-repeat;
	background-attachment:scroll;
	background-size: cover;
	-moz-background-size: cover;
	-webkit-background-size: cover;
	width:100%;
	border:0;
	vertical-align:middle;
	display:table;
}

.BackgroundContainer {
	width:70%;
	margin-left:15%;
	margin-right:15%;
	padding-top:30px;
	padding-bottom:30px;
	display:table-cell;
	float:left;
}

.headercontainer {
	background-color:transparent;
	width:70%;
	margin-left:15%;
	margin-right:15%;
	display:table-cell;
	float:left;
	padding-bottom:20px;
}

.bottomcontainer {
	background-color:transparent;
	width:70%;
	margin-left:15%;
	margin-right:15%;
	display:table-cell;
	float:left;
}

.LineBreak {
	color:white;
	font-size:25px;
	font-family: "Century Gothic";
}

.SmallLineBreak {
	color:white;
	font-size:6px;
	font-family: "Century Gothic";
}

.Header1 {
	color:white;
	font-size:65px;
	/*text-shadow: 3px 3px 8px #00236C;*/
	font-family: "Century Gothic";
}

.Header2 {
	color:white;
	font-size:55px;
	/*text-shadow: 3px 3px 8px #00236C;*/
	font-family: "Century Gothic";
}

.Header3 {
	color:white;
	font-size:23px;
	/*text-shadow: 3px 3px 8px #00236C;*/
}

.Header4 {
	color:white;
	font-size:18px;
	line-height:25px;
	/*text-shadow: 3px 3px 8px #00236C;*/
}

.Header5 {
	width:100%;
	color:#797d82;
	font-size:18px;
	/*text-shadow: 3px 3px 8px #00236C;*/
}

.Header6 {
	color:#454951;
	font-size:17px;
	line-height:25px;
	/*text-shadow: 3px 3px 8px #00236C;*/
}

.Header7 {
	color:#454951;
	font-size:30px;
	/*text-shadow: 3px 3px 8px #00236C;*/
}

.Header8 {
	color:white;
	background-color:#74b9ff;
	font-size:22px;
	padding:8px;
	/*text-shadow: 3px 3px 8px #00236C;*/
}

.Header8 a:hover {background-color:#0984e3;}

.Header9 {
	color:grey;
	font-size:17px;
	/*text-shadow: 3px 3px 8px #00236C;*/
}

.Header19 {
	color:grey;
	font-size:17px;
	/*text-shadow: 3px 3px 8px #00236C;*/
}

.Header10 {
	color:grey;
	font-size:19px;
	/*text-shadow: 3px 3px 8px #00236C;*/
}

.Header12 {
	color:white;
	font-size:26px;
	font-family:Arial, Helvetica, sans-serif;
	background-color: rgba(223, 230, 233,0.3);
	padding: 6px 12px;
  	border: none;
  	border-radius: 4px;
	/*text-shadow: 3px 3px 8px #00236C;*/
}

.Header13 {
	color:rgba(223, 230, 233,1.0);
	font-size:15px;
	line-height:25px;
	font-family:Arial, Helvetica, sans-serif;
	/*text-shadow: 3px 3px 8px #00236C;*/
}

.MenuTxt{
	color:grey;
	font-size:18px;
	padding:8px;
	/*text-shadow: 3px 3px 8px #00236C;*/
}

.MenuTxt:hover {background-color:rgba(251, 154, 15, 0.7);color:white}

.InfoDiv1 {
	background-color:rgba(0, 220, 250,0.8);
	width:30%;
	margin-right:1.5%;
	margin-top:10px;
	padding:1%;
	height:220px;
	float:left;
	position:relative;

}

.InfoDiv2 {
	background-color:rgba(188, 133, 53,0.9);
	width:30%;
	margin-right:1.5%;
	margin-top:10px;
	padding:1%;
	height:220px;
	float:left;
	position:relative;

}

.InfoDiv3 {
	background-color:rgba(188, 33, 53,0.9);
	width:31%;
	margin-top:10px;
	padding:1%;
	height:220px;
	float:left;
	position:relative;
	
}

.InfoDiv4 {
	height:85%;
	float:left;
	position:relative;
}

.InfoDiv5 {
	height:15%;
	width:100%;
	float:left;
	position:relative;
	text-align:center;
}

.InfoDiv6 {
	float:left;
	padding-top:10px;
	position:relative;
	width:100%;
}

.InfoDiv7 {
	float:left;
	position:relative;
	width:100%;
	margin-top:30px;
	float:inherit;
	text-align:center;
	padding-top:10px;
	padding-bottom:10px;
}

.InfoDiv9 {
	float:left;
	position:relative;
	width:60%;
	padding-bottom:50px;
}

.InfoDiv10 {
	float:left;
	position:relative;
	width:47%;
	padding-top:50px;
	padding-right:3%;
}

.InfoDiv11 {
	float:left;
	position:relative;
	width:47%;
	padding-top:50px;
	padding-left:3%;
}


.Services {
	width:49%;
	margin-right:1%;
	margin-bottom:1px;
	margin-top:10px;
	text-align: center;
	float:left;
	position:relative;
	display: inline-block;
  
  align-items: center;
}

.BottomClmn{
	width:30%;
	margin-right:1.3%;
	margin-top:5px;
	margin-bottom:5px;
	float:left;
	position:relative;
}

.logo {
	border: 0 solid #FFFFFF;
	text-align:center;
	vertical-align:middle;
	width:30%;
	
}

.logoImg {
	height:120px;
	float:left;
	position:relative;
}

.ServiceImage {
	width:100%;
	float:left;
	position:relative;
	padding-bottom:5px;
}

.Services img:hover{
    opacity: 0.8;
}

.contactImage {
	width:100%;
	float:left;
	position:relative;
	padding-bottom:20px;
}

.doctorImage {
	width:28%;
	float:left;
	position:relative;
	padding-right:2%;
	padding-bottom:10px;
}

.partyImage {
	width:50%;
	margin-left:25%;
	margin-right:25%;
	float:left;
	position:relative;
	padding-bottom:10px;
}

.roomImage1 {
	width:38%;
	float:left;
	position:relative;
	padding-right:2%;
	padding-bottom:10px;
}

.roomImage2 {
	width:38%;
	float:right;
	position:relative;
	padding-left:2%;
	padding-bottom:10px;
}

.MapDiv {
	float:left;
	position:relative;
	width:100%;
	height:500px;
}

.SendMessage{
	float:left;
	position:relative;
	width:50%;
	margin-top:20px;
}

.days{
	width:30%;
	float:left;
	text-align:left;
}

.hours{
	width:70%;
	float:left;
	text-align:left;
}


.MessageCell{
	float:left;
	position:relative;
	width:48%;
	padding-top:10px;
	padding-left:2%;
}

.MessageTxtBox{
	font-size:18px;
	width:88%;
	padding-left:3%;
	padding-right:3%;	
	padding-top:10px;
	padding-bottom:10px;
	background-color:#E4E4E4;
	border-style:none;
}

input[type=submit] {
  background-color: #74b9ff;
  color: white;
  padding: 12px 20px;
  border: none;
  cursor: pointer;
}

input[type=submit]:hover {
  background-color: #0984e3;
}

.ContactInfo{
	float:left;
	position:relative;
	width:45%;
	padding-right:5%;
	margin-top:20px;
}

.InfoCell{
	float:left;
	position:relative;
	width:100%;
	padding-top:10px;
	padding-bottom:10px;
}

.menutd {
	border-width: 0;
	width:55%;
	background-color:transparent;
	float: right;
    position: relative;
    text-align:center;
    padding-top:50px;
}

.menutbl {
	border-color: black;
	border-width: 0px;
	height:43px;
	background-color:transparent;
}

.listrow {
	border-width: 0;
	padding-left:0px;
}


@media (max-width: 1400px) {
    #par1{ font-size: 100%; }
    #tsakiridis { font-size: 130% }
    .menu { font-size: 100% }
    #link { font-size: 80% }
    .ProfilInfo {width: 85%}
    #phone{width: 30%;}
    .dehImg {width: 25%;right: 16%;}
    #panel1{width: 45%;padding-right:5%}
    #panel2{width: 50%;}
    .offer {top: 350px;font-size:95%}
    /*#images {height:450px;}*/ 
    .bottomcontainer {width:90%;margin-left:5%;margin-right:5%}
    .headercontainer {width:90%;margin-left:5%;margin-right:5%;padding-bottom:20px}
    .BackgroundContainer {width:90%;margin-left:5%;margin-right:5%;padding-top:20px;padding-bottom:20px}
    .Header1 {font-size:55px;}
    .Header2 {font-size:50px;}
    .Header3 {font-size:20px;}
    .Header4 {font-size:17px;line-height:18px;}
    .Header6 {font-size:18px;line-height:25px;}
    .Header12 {font-size:18px;}
    
    .InfoDiv1 {height:220px;}
    .InfoDiv2 {height:220px;}
 	.InfoDiv3 {height:220px;}
}

@media (max-width: 1100px) {
    #par1{ font-size: 100%; }
    #tsakiridis { font-size: 130% }
    .menu { font-size: 100% }
    #link { font-size: 80% }
    .ProfilInfo {width: 85%}
    #phone{width: 30%;}
    .dehImg {width: 25%;right: 16%;}
    #panel1{width: 45%;padding-right:5%}
    #panel2{width: 50%;}
    .offer {top: 350px;font-size:95%}
    /*#images {height:450px;}*/
    .header{height:180px;}
    .menutd {width:100%;float:left;padding-top:20px;}
    .logoImg {float:none;margin-left:auto;margin-right:auto}
    .bottomcontainer {width:90%;margin-left:5%;margin-right:5%}
    .headercontainer {width:90%;margin-left:5%;margin-right:5%;padding-bottom:20px}
    .BackgroundContainer {width:90%;margin-left:5%;margin-right:5%;padding-top:20px;padding-bottom:20px}
    .Header1 {font-size:47px;}
    .Header2 {font-size:43px;}
    .Header3 {font-size:20px;}
    .Header4 {font-size:15px;line-height:20px;}
    .Header6 {font-size:16px;line-height:22px;}
    .Header12 {font-size:18px;}
    .LineBreak {font-size:14px;}
    
    .InfoDiv1 {height:220px;}
    .InfoDiv2 {height:220px;}
 	.InfoDiv3 {height:220px;}
 	
	.InfoDiv6 {	width:100%;}
	.InfoDiv9 {	width:50%;padding-bottom:50px;}
	.doctorImage {width:28%;padding-right:2%;}
	.roomImage1 {width:48%}
	.roomImage2 {width:48%}
		
}

@media (max-width: 900px) {
    #par1{ font-size: 90% }
    #tsakiridis { font-size: 100% }
    .menu{ font-size: 90% }
    #link { font-size: 70% }
    #map {height:350px;}
    .ProfilInfo {width: 100%}
    #phone{width: 30%;}
    #panel1{width: 100%;}
    #panel2{width: 100%;}
    .offer {top: 270px;font-size:75%}
    /*#images {height:390px;}*/
    .header{height:180px;}
    .menutd {width:100%;float:left;padding-top:15px;}
	.logoImg {float:none;margin-left:auto;margin-right:auto}
	
	.top{height:115px;}
	.topcontainer {width:70%;padding-right:10px}
	.toptext {font-size:16px;}
	.fbImg {padding:0%}
		
	.bottomcontainer {width:90%;margin-left:5%;margin-right:5%}
	.headercontainer {width:90%;margin-left:5%;margin-right:5%;padding-bottom:0px}
    .BackgroundContainer {width:90%;margin-left:5%;margin-right:5%;padding-top:10px;padding-bottom:10px}
    .Header1 {font-size:34px;font-weight:600;}
    .Header2 {font-size:26px;font-weight:600;}
    .Header3 {font-size:20px;}
    .Header4, .Header6 {font-size:18px;line-height:22px;}
    .Header9 {font-size:17px;}
    .Header19 {font-size:17px;}
    .Header12 {font-size:22px;}
    .LineBreak {font-size:14px;}
    
    .InfoDiv1 {width:95%;margin-bottom:1%;height:150px;padding:2.5%;}
    .InfoDiv2 {width:95%;margin-bottom:1%;height:150px;padding:2.5%;}
 	.InfoDiv3 {width:95%;margin-bottom:1%;height:150px;padding:2.5%;}	
 	
 	.Services {width:100%;	margin:0%; margin-top:20px;	padding-bottom:5%;margin-right:0%;margin-bottom:0px;}


	.doctorImage {
	width:30%;
	padding-right:2%;
	}
	
	.partyImage {
	width:100%;
	margin-left:0%;
	margin-right:0%;
	float:left;
	position:relative;
	padding-bottom:10px;
}
	
	.roomImage1 {width:100%;padding-right:0%}
	.roomImage2 {width:100%;padding-left:0%}
	
	.InfoDiv6 {	width:100%;}
	.InfoDiv9 {	width:100%;padding-bottom:30px;}
	
	.InfoDiv10 {width:100%;padding-top:30px;padding-right:0%;}
	
	.InfoDiv11 {width:100%;padding-top:30px;padding-left:0%;}
	
	.BottomClmn {width:100%;margin-right:0%;padding-bottom:10px;}

	.SendMessage{
	width:100%;
	margin-top:10px;
	text-align:center;
	}
	
	.days{
	width:37%;
	padding-right:3%;
	text-align:right;
	}

	.hours{
	width:60%;
	}
	
	.MessageTxtBox{
	font-size:14px;
	}
	
	.ContactInfo{
	width:100%;
	padding-right:0%;
	margin-top:10px;
	text-align:center;
	}
	
	.MessageCell{
	width:100%;
	padding-top:10px;
	padding-left:0%;
	text-align:center;
	}

	.MapDiv{height:400px;}
	
	#slider {width: 100%; left:-1000px; height:1px;}
	#images {width: 100%;}
	#images img {
	width: 100%;
    position: relative;
    top: 0;
    left: 1px;
    padding-bottom:10px;
    z-index: 1;
    opacity: 1;
    transition: none;
    -o-transition: none;
    -moz-transition: none;
    -webkit-transition: none;}


}

@media (max-width: 550px) {    
    
        
    .menu { font-size: 75% }
    
    .header{height:160px;}
    .menutd {width:100%;float:left;padding-top:10px;padding-bottom:20px}
    .logoImg {float:none;margin-left:auto;margin-right:auto;height:auto;width:100%;}
    .topcontainer {width:78%;padding-right:0px}
    .toptext {font-size:15px}
	.top{height:110px;}
	.topImg{padding-left:8px;}
	.fbImg {padding:0%;}
    
	.bottomcontainer {width:90%;margin-left:5%;margin-right:5%}
    .headercontainer {width:94%;margin-left:3%;margin-right:3%;padding-bottom:0px}
    .BackgroundContainer {width:90%;margin-left:5%;margin-right:5%;padding-top:10px;padding-bottom:10px}
    .Header1 {font-size:20px;font-weight:600;}
    .Header2 {font-size:18px;font-weight:600;}
    .Header3 {font-size:14px;}
    .Header4, .Header6 {font-size:18px;line-height:22px;}
    .Header5 {font-size:15px;}
    .Header7 {font-size:20px;}
    .Header8 {font-size:16px;}
    .Header9 {font-size:17px;}
    .Header19 {font-size:13px;}
    .Header12 {font-size:22px;}
    .LineBreak {font-size:6px;}
    
    .InfoDiv1 {width:95%;margin-bottom:1%;height:150px;padding:2.5%}
    .InfoDiv2 {width:95%;margin-bottom:1%;height:150px;padding:2.5%;}
 	.InfoDiv3 {width:95%;margin-bottom:1%;height:150px;padding:2.5%;}	
 	
 	.Services {width:100%;margin:0%;margin-top:20px;padding-bottom:5%;margin-right:0%;margin-bottom:0px;}
	
	.doctorImage {
	width:30%;
	padding-right:2%;
	}
	
	#myBtn {

	font-size: 12px; /* Increase font size */
	}
	
	.partyImage {
	width:100%;
	margin-left:0%;
	margin-right:0%;
	float:left;
	position:relative;
	padding-bottom:10px;
	}
	
	.roomImage1 {width:100%;padding-right:0%}
	.roomImage2 {width:100%;padding-left:0%}
	
	.InfoDiv6 {	width:100%;}
	.InfoDiv9 {	width:100%;padding-bottom:20px;}
	
	.InfoDiv10 {width:100%;padding-top:30px;;padding-right:0%;}
	.InfoDiv10 {width:100%;padding-top:30px;padding-left:0%;}

	
	.BottomClmn {width:100%;margin-right:0%;padding-bottom:10px;}
 	
 	.MenuTxt{
	color:grey;
	font-size:14px;
	padding:5px;
	font-weight:bold;
	/*text-shadow: 3px 3px 8px #00236C;*/
	}

	.SendMessage{
	width:100%;
	margin-top:10px;
	text-align:center;
	}
	
	.days{
	width:25%;
	padding-right:3%;
	text-align:right;
	}
	
	.hours{
	width:72%;
	}
	
	.MessageTxtBox{
	font-size:14px;
	}
	
	.ContactInfo{
	width:100%;
	padding-right:0%;
	margin-top:10px;
	text-align:center;
	}

	.MessageCell{
	width:100%;
	padding-top:15px;
	padding-left:0%;
	text-align:center;
	}

	.MapDiv{height:300px;}
	
	#slider {width: 100%; left:-1000px; height:1px;}
	#images {width: 100%;}
	#images img {
	width: 100%;
    position: relative;
    top: 0;
    left: 1px;
    padding-bottom:10px;
    z-index: 1;
    opacity: 1;
    transition: none;
    -o-transition: none;
    -moz-transition: none;
    -webkit-transition: none;}

	
}

/*----- Menu -----*/

.clearfix:after {
    display:block;
    clear:both;
}

/*----- Menu Outline -----*/

.menu-wrap {
    width:100%; 
}
 
.menu {
    width:100%;
    background-color:transparent;
    float:left;
}

.menu li {
    list-style:none;
    margin-left:0px;
    background-color:transparent;
    float:left;
}
 
.menu a {
    transition:all linear 0.15s;
    color:white;
}
 
.menu li:hover > a, .menu .current-item > a {
    text-decoration:none;
    color:white;
}
 
.menu .arrow {
    line-height:0%;
}
 
/*----- Top Level -----*/
.menu > ul > li {
    float:left;
    display:inline-block;
    position:relative;
    font-weight:bold;
    color:gray;
    background-color:transparent;
    
}
 
.menu > ul > li > a {
    padding:10px 10px;
    display:inline-block;
    color:gray;
}
 
.menu > ul > li:hover > a, .menu > ul > .current-item > a {
    background:#74b9ff;
}
 
/*----- Bottom Level -----*/
.menu li:hover .sub-menu {
	position:absolute;
    z-index:2;
    opacity:1;
}
 
.sub-menu {
    width:150%;
    padding:0px 0px;
    position:absolute;
    top:100%;
    left:0px;
    z-index:-1;
    opacity:0;
    transition:opacity linear 0.15s;
    box-shadow:0px 2px 3px rgba(0,0,0,0.2);
    background:#D90000;
    color:white;
}
 
.sub-menu li {
    display:block;
}
 
.sub-menu li a {
    padding:10px 12px;
    display:block;
    color:white;
}
 
.sub-menu li a:hover, .sub-menu .current-item a {
    background:#333333;
}

/*-----End of Bottom Level -----*/

#menu, a, img, li{
  transition: all 0.5s;
  -moz-transition: all 0.5s; /* Firefox 4 */
  -webkit-transition: all 0.5s; /* Safari and Chrome */
  -o-transition: all 0.5s; /* Opera */
}

a {
color: #000000;
text-decoration:none;
}

a img {
    border: 0;
}

a:link {
color: #000000;
}

a:visited {
color: #000000;
}

a:hover {
color: #000080;
}

a:active {
	color: #000000;
}