body{
	font-family: 'Poppins', sans-serif;
	font-size:17px;
	margin:0px;
	padding:0px;
	position:relative;
}


	.topnav{
		display:none;
	}
	
a{
	text-decoration:none;
	color:black;
}
a:visited{
	text-decoration:none;
	color:black;
}
p{
	font-size:1rem; 
	line-height:1.5rem;
	text-align:justify;
}

.border_shadow{ 
	border:1px solid silver;
	-webkit-border-radius: 0.2rem;
	-moz-border-radius: 0.2rem;
	border-radius: 0.2rem;

	box-shadow: 4px 4px 5px 0px rgba(0,0,0,0.3);
	-webkit-box-shadow: 4px 4px 5px 0px rgba(0,0,0,0.3);
	-moz-box-shadow: 4px 4px 5px 0px rgba(0,0,0,0.3);
}

#header{
	height:8rem;
	line-height:8rem;
	vertical-align:middle; 
	position:relative;
}

.header_logo{
	float:left;
	width:20%; 
	height:8rem;
	overflow:hidden;
}

.p_1{
	padding:1rem;
}

.p_l_1{
	padding-left:1rem;
}
.p_r_1{
	padding-right:1rem;
}
.p_r_2{
	padding-right:2rem;
}
#header .header_menu{
	float:left;
	width:60%;
}

#header .header_menu ul{
	float:right; 
	margin:0px;
	padding:0px;
}
#header .header_menu li{ 
	margin:0px;
	padding:0px;
	
	display:inline;
	padding-left:1em;
	padding-right:1em;
	font-size:1em;
}	 

.kiemelt_szolgaltatasok{
	font-size:1rem;
}

.kapcoslat_felvetel_button{ 
	width:70%;
	text-align:center;
	font-size:1rem;
	height:2.4rem;
	line-height:2.4rem; 
	background-color:#24AFC6;
	-webkit-border-radius: 0.2rem;
	-moz-border-radius: 0.2rem;
	border-radius: 0.2rem;
	color:white;
	cursor:hand;
	cursor:pointer;
	
	float:right;

	box-shadow: 4px 4px 5px 0px rgba(0,0,0,0.3);
	-webkit-box-shadow: 4px 4px 5px 0px rgba(0,0,0,0.3);
	-moz-box-shadow: 4px 4px 5px 0px rgba(0,0,0,0.3);
}


#header .kapcoslat_felvetel{ 
	text-align:center;
	float:left;
	width:12%;  
}
.nyelv_valaszto{ 
	position:absolute;
	top:20px;
	right:20px;
	text-align:right;
	float:right;
	width:20%;
	z-index:99999999;
}

#image_div{
	height:26.5em;
	line-height:26.5em;
	vertical-align:middle;
	text-align:center;
	background-position:center center;
	background-repeat:no-repeat;
	background-size:cover;
}

.page_title_background{
    float: left;
    position: relative;
    left: 50%;
	justify-content: center;
	text-align:center; 
	font-weight:bold; 
	height:3em;
	line-height:3em;
	margin-top:11em;
	color:white;
}
.page_title{    
	background: rgba(217, 217, 217, 0.4);
    float: left;
    position: relative;
    left: -50%;
	padding:2em;
	padding-top:0.4em;
	padding-bottom:0.4em;
	-webkit-border-radius: 0.7rem;
	-moz-border-radius: 0.7rem;
	border-radius: 0.7rem;
}
.page_title h1{ 
	margin:0px;
	padding:0px;
	font-size:3.0rem; 
	line-height:3.6rem;
	height:3.6rem;
}
.page_title h2{    
	margin:0px;
	padding:0px;
	font-size:1.6rem; 
}

.calendar{
	height: 6rem;
	background-color:#A78778;
}

.calendar_vertical_down{
	clear:both; height:1rem;
}


.calendar_content{
	margin-left:auto; 
	margin-right:auto; 
	width:50%; 
	text-align:center;
}

.calendar_elvalaszto{
	float:left; 
	width:2rem; 
	height:1rem;
}
select { 
  padding: 10px;
  border: none;
  background:white;
  background-size: 10%;
  background: url(_img/select.svg);
  background-repeat: no-repeat;
	background-position: right 3px center;
  -webkit-appearance: none;
	-webkit-border-radius: 0.7rem;
	-moz-border-radius: 0.7rem;
	border-radius: 0.7rem;
	font-size:1rem; 
}
input[type=date]{ 
  padding: 10px;
  border: none;
  background:white;
  background-size: 10%;
  background: url(_img/input_calendar.svg);
  background-repeat: no-repeat;
	background-position: right 3px center;
  -webkit-appearance: none;
  font-size:1rem;
  height:1.1rem; 
} 
 

[type="date"]::-webkit-inner-spin-button {
  display: none;
}

[type="date"]::-webkit-calendar-picker-indicator {
  opacity: 0;
}

.calendar_mobil_content{
	float:left;
}
.calendar_button{ 
	font-size:1rem;
	height:2.4rem;
	line-height:2.4rem;
	float:left;
	background-color:#24AFC6;
	-webkit-border-radius: 0.2rem;
	-moz-border-radius: 0.2rem;
	border-radius: 0.2rem;
	color:white;
	cursor:hand;
	cursor:pointer;

	box-shadow: 4px 4px 5px 0px rgba(0,0,0,0.3);
	-webkit-box-shadow: 4px 4px 5px 0px rgba(0,0,0,0.3);
	-moz-box-shadow: 4px 4px 5px 0px rgba(0,0,0,0.3);
}
 
.calendar_button input[type=submit]{
	background-color:transparent;
	border:0px;
	font-size:1rem;
	color:white;
}
.calendar_input{ 
	float:left;
	background-color:white;
	-webkit-border-radius: 0.2rem;
	-moz-border-radius: 0.2rem;
	border-radius: 0.2rem;
	text-align:left;
	padding-right:1rem;
}
 
 
 
 
#content{
	margin-top:2rem;
}
 

#content h1{ 
	margin:0px;
	padding:0px;
	font-size:2.2rem; 
	line-height:2.2rem; 
	font-weight:500;
	text-align:center;
}

#content h2{ 
	margin:0px;
	padding:0px;
	font-size:2.2rem; 
	line-height:2.2rem; 
	font-weight:500;
	text-align:center;
}
#content h4{ 
	margin:0px;
	padding:0px;
	font-size:1.1rem; 
	line-height:1.1rem;
	font-weight:500;
	text-align:left;
}

.kiemelt_kepek{
	display: flex;
	width:90%;
	margin-left:auto;
	margin-right:auto;
}
.kiemelt_kepek p{
	font-size:1rem; 
	line-height:1.2rem;
	text-align:justify;
}

.kiemelt_kepek h3{
	margin:0px;
	padding:0px;
	font-size:1.2rem; 
	line-height:1.2rem; 
}
.kiemelt_kep{ 
	width:25%; 
	flex:1;
}

.szoba{
	float:left;
	width:31%;
	margin-left:1%;
	margin-right:1%;
	margin-bottom:2rem;
}
.szoba h1{
	text-align:left !important;
	font-size:1.2rem !important;
	font-weight:500 !important;
}
.szoba h2{
	text-align:left !important;
	font-size:1rem !important;
	font-weight:400 !important;	
}

#kep_galeria{
	position:fixed; 
	width:45%;  
	left: 50%; /* 1. move it to the right 50% of the width of the page; now the left side of the element is exactly in the middle */
	margin-left: -22%;
	height:78%; 
	background-color:white;
	text-align:center;
}
.galeria_elemek{
	cursor:hand;
	cursor:pointer;
	vertical-align:middle;
	font-weight:600;
	font-size:3rem;
}

#kep_galeria h1{
	text-align:left !important;
	font-size:1.2rem !important;
	font-weight:500 !important;
}
.galeria_image{
	height:75%;
}
#kep_hatter{
	width:100%;
	height:100%;
	background: rgba(255,255,255,0.6);
	position:absolute;
	top:0px;
	left:0px;
}
#footer{
	border-top:0.2rem solid #24AFC6;
	border-bottom:2rem solid #24AFC6;

}

#footer .footer_logo{
	text-align:center;
	float:left; width:23%; 
}
#footer .contact{
	text-align:center;
	float:left; width:26%;
}
#footer .links{
	text-align:center;
	float:left; width:20%;
} 
#footer .information{
	text-align:center;
	float:left; width:15%;
}
#footer .social_media{
	text-align:right;
	float:left; width:14%;
}
#footer h1{
	font-size:1.6rem;	
	text-align:left;
}
#footer p{
	font-size:1rem;	
	text-align:left;
}
#footer a{
	text-decoration:none;
}
#footer .logo{
	text-align:center;
	float:left; width:20%;
}

.page_title_mobil{
	display:none;
}

@media only screen and (max-width: 1600px){
	.calendar_content{
		width:70%; 
	}
}
@media only screen and (max-width: 1200px){
	.calendar_content{
		width:90%; 
	}
}
@media only screen and (max-width: 1000px){
	.calendar{  
	} 
	
	.calendar_vertical_down{
		clear:both; height:0.3rem;
	}

	.calendar_mobil_content{ 
		float: none;
		width:100%; 
		margin-left:auto;
		margin-right:auto;
	}
	
	.calendar_content{
		width:100%;
	}
	.calendar_elvalaszto{
		width:1%;
	}
	.calendar_input{ 
		float:left;
		width:27%;
	}
	
	
	.calendar_button{ 
		font-size:.8rem;
		height:1.8rem;
		line-height:1.8rem;  
		
		float: none;
		
		width:50%;
		margin-left:auto;
		margin-right:auto;
	}
	
	select { 
	  padding: 0.4rem; 
	  background-size: 11% !important; 
		background-position: right 2px center; 
		-webkit-border-radius: 0.7rem;
		-moz-border-radius: 0.7rem;
		border-radius: 0.7rem;
		font-size:.7rem; 
	}
	input[type=date]{ 
	  padding: 0.4rem; 
	  padding-left: 0.2rem; 
	  padding-right: 0.2rem; 
	  background-size: 13% !important; 
		background-position: right 2px center;
	  -webkit-appearance: none;
	  font-size:.5rem;
	  height:.8rem;
	} 
	.mobil_br{
		float: none;
		clear:both;
		height:0.6rem;
	}
	
}


@media only screen and (max-width: 600px){
	body{
		font-size:10px;  
	}

	p{
		font-size:.7rem !important; 
		line-height:1.2rem;
		text-align:justify;
	}

	#image_div{ 
	} 
	
	.page_title{
		display:none;
	}
	
	.page_title_mobil{
		display:block;
	}
		
	.page_title_mobil h1{ 
		margin:0px;
		padding:0px;
		font-size:1.3rem; 
		line-height:1.3rem; 
		text-align:center;
	}
	.page_title_mobil h2{    
		margin:0px;
		padding:0px;
		font-size:.8rem;
		font-weight:500;		
		text-align:center;
		max-width:60%;
		margin-left:auto;
		margin-right:auto;
		margin-top:0.5rem;
	}

	.header_menu{ 
		display:none;
	}
	.header_logo{ 
		display:block;
		width:100%;
		text-align:center;
		height:8rem;
	}
	.logo{
		height:5rem;
		margin-top:1rem;
	}
	.kapcoslat_felvetel{ 
		display:none;
	}
	.nyelv_valaszto{ 
		display:none;
	}
	
	
	.calendar{  
	} 
	
	.calendar_vertical_down{
		clear:both; height:0.3rem;
	}

	.calendar_mobil_content{ 
		float: none;
		width:100%; 
		margin-left:auto;
		margin-right:auto;
	}
	
	.calendar_content{
		width:100%;
	}
	.calendar_elvalaszto{
		width:1%;
	}
	.calendar_input{ 
		float:left;
		width:27%;
	}
	
	
	.calendar_button{ 
		font-size:.8rem;
		height:1.8rem;
		line-height:1.8rem;  
		
		float: none;
		
		width:50%;
		margin-left:auto;
		margin-right:auto;
	}
	
	select { 
	  padding: 0.4rem; 
	  background-size: 11% !important; 
		background-position: right 2px center; 
		-webkit-border-radius: 0.7rem;
		-moz-border-radius: 0.7rem;
		border-radius: 0.7rem;
		font-size:.7rem; 
	}
	input[type=date]{ 
	  padding: 0.4rem; 
	  padding-left: 0.2rem; 
	  padding-right: 0.2rem; 
	  background-size: 13% !important; 
		background-position: right 2px center;
	  -webkit-appearance: none;
	  font-size:.5rem;
	  height:.8rem;
	} 
	.mobil_br{
		float: none;
		clear:both;
		height:0.6rem;
	}
	
	#content{ 
		 
	}
	
	

	#content h1{ 
		margin:0px;
		padding:0px;
		font-size:1.2rem; 
		line-height:1.3rem;
		font-weight:500;
		text-align:center;
	}

	#content h2{ 
		margin:0px;
		padding:0px;
		font-size:1rem; 
		line-height: 1rem;
		font-weight:500;
		text-align:center;
	}
	#content h3{ 
		margin:0px;
		padding:0px;
		font-size:0.9rem; 
		line-height: 1rem;
		font-weight:500;
		text-align:center;
	}
	#content h4{ 
		margin:0px;
		padding:0px;
		font-size: 0.8rem; 
		line-height: 0.9rem;
		min-height:1.1rem;
		font-weight:500;
		text-align:left;
	}

	#footer{
		border-top:0.2rem solid #24AFC6;
		border-bottom:2rem solid #24AFC6;
		padding-left:1rem;
		padding-right:1rem;
	}
	#footer .footer_logo{
		text-align:center;
		float:left; width:50%; 
	}
	#footer .footer_logo img{
		width:60% !important; 
	}
	
	
	#footer .contact{
		text-align:center;
		float:left; width:50%;
	}
	#footer .links{
		text-align:center;
		float:left; width:50%;
		
	} 
	#footer .information{
		text-align:center;
		float:left; width:50%;
	}
	#footer .social_media{
		text-align:right;
		float:left; width:100%;
	}
	
	#footer .social_media img{
		width:6%;
	}
	
	 
	#footer h1{
		font-size:1rem;	
		text-align:left;
	} 
	#footer p{
		font-size:0.6rem;	
		line-height:0.7rem;	
		text-align:left;
	}
	#footer a{
		text-decoration:none;
	}
	#footer .logo{
		text-align:center;
		float:left; width:20%;
	}
 
	
	.szoba{
		float:left;
		width:98%;
		margin-left:1%;
		margin-right:1%;
		margin-bottom:2rem;
	}

	.szoba h1{
		text-align:left !important;
		font-size:1rem !important;
		font-weight:500 !important;
	}
	.szoba h2{
		text-align:left !important;
		font-size:.7rem !important;
		font-weight:400 !important;	
	}
	.szoba p{ 
		font-size:.8rem !important;
		line-height:.9rem !important;
		font-weight:400 !important;	
	}
	
	.szoba_galeria h1{
		text-align:left !important;
		font-size:1rem !important;
		font-weight:500 !important;
	}
	.szoba_galeria h2{
		text-align:left !important;
		font-size:.7rem !important;
		font-weight:400 !important;	
	}
	
	.szoba_galeria p{ 
		font-size:.8rem !important;
		line-height:.9rem !important;
		font-weight:400 !important;	
	}
	
	
	#kep_galeria{ 
		width:90%;  
		left: 50%; /* 1. move it to the right 50% of the width of the page; now the left side of the element is exactly in the middle */
		margin-left: -45%;
		height:70%; 
		background-color:white;
		text-align:center;
	}
	
	.galeria_image{
		height:55%;
	}

	/* Style the navigation menu */
		.topnav {
		  display:inline; 
		  overflow: hidden; 
		  position: relative;
		  z-index:9999999999999;
		  font-size:1.3em; 
		}

		/* Hide the links inside the navigation menu (except for logo/home) */
		.topnav #myLinks { 
		  position:fixed;
		  width:50%;
		  top:20px;
		  left:20px;
		  background: rgba(36,175,198,0.8);
		  display: none;  
			-webkit-border-radius: 0.4rem;
			-moz-border-radius: 0.4rem;
			border-radius: 0.4rem;
		  
		  
		}
		 
		
		/* Style navigation menu links */
		.topnav .radius{
		  text-decoration: none;
		  font-size: 1.2em;
		  display: block;
		  min-width:300px;
		}
 

		/* Add a grey background color on mouse-over */
		.topnav .a{ 
			width:100%;
			font-size:1rem;
			height:2rem;
			line-height:2rem;
			font-weight:400;
			vertical-align:middle;
			border-bottom:1px solid white;
			color:white !important;
		}
		.topnav a{  
			color:white !important;
		}
		/* Add a grey background color on mouse-over */
		.topnav a:hover { 
			/*background-color:white;*/
		}
  
		.hazirend_div{
			width:90% !important;
		}
		
		.kiemelt_kepek{
			display: block; 
			width:300%;
		}

		.kiemelt_kep{ 
		}
		
		.rolunk_hatter{
			display:none;
		}
		
		.mobil_box{
			width:100% !important;
			position:relative !important;
			top : 0px !important;
		}
		
		.mobil_elvalaszto{
			clear:both;
			height:1rem;
		}
		
		.center{
			text-align : center !important;
		}
		 
		.kiemelt_szolgaltatasok{
			font-size:.8rem;
		}

}