/* ==========================================
   ROOT VARIABLES & BASE STYLES
   ========================================== */

:root{
	--services-icons-size: 35px;
}

.full-width-page .grid-child.container-component{
	grid-column: full-start / full-end !important;
}


/* ==========================================
   HEADER STYLES
   ========================================== */

.header {
	transition: all 0.2s linear;
}

.scrolled .header {
	box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.25);
}

.header .info img{
	height: 24px;
}

.header .info.tel .tel-numbers{
	display: flex;
	flex-direction: row;
	gap: 3px;
}

.header .info.tel .tel-numbers a {
	color: #4a4038 !important;
}



.header-info-tel-mobile{
	display: none;
}

.header-info-tel-mobile img {
	height: 20px;
	width: 20px;
}

.header-info-tel-mobile button{
	background: unset;
	background-color: unset;
	border: 1px solid rgba(188, 186, 185, 0.15);
	background-color: transparent;
	border-radius: 4px;
	color: #4a4038;
	font-size: 14px;
	white-space: nowrap;
}

/* popups */

div[data-popup-target]{
	cursor: pointer;
}

.popup-title {
	padding:10px 25px 10px 25px !important;
	background: #fbfbfb !important;
	color: #555;
}

.popup-content .tel-numbers {
	display: flex !important;
	flex-direction: column !important;
}

.popup-content .tel-numbers .tel-sep {
	display: none !important;
}

/* menu */

.main-menu .el-main-list .link-name {
	color: #4a4038 !important;
	font-weight: 500;
	letter-spacing: 2px;
	transition: color 0.3s ease;
}

.main-menu .el-main-list .link-name:hover {
    color: #2f2721;
}

.main-menu .el-main-list .list-inner-wrapper ul {
	border-radius: 4px;
}

.main-menu .el-main-list .list-inner-wrapper ul li a {
	padding: 14px 16px !important;
}


/* ==========================================
   HEADING STYLES H1,H2,H3,H4,H5
   ========================================== */

.styled-header {
	text-align: center;
	font-size: 28px;
	margin-bottom: 48px;
	margin-top: 0px;
	letter-spacing: 2px !important;
}

/* ==========================================
   FOOTER STYLES
   ========================================== */

.footer {
	margin-top: 0px !important;
}

.footer-banner{
	width:100%;
}

.footer-banner > .custom img{
	max-height: 450px;
   width: 100%;
   object-fit: cover;
}

.footer-before-logo{
	width: 100%;
	margin-bottom: 20px;
}

.footer-before-logo img{
	width: 190px;
}

.footer-main {
	padding-top: 48px !important;
	gap: 48px;
	align-items: flex-start !important;
	justify-content: space-between !important;
	padding-bottom: 30px !important;
	/*box-shadow: 0 -10px 30px rgba(0,0,0,0.1);*/
}

.footer-menu .active a,.footer-menu a:hover,.footer a:hover{
	color: #bcbab9 !important;
}

/* also catches the off canvas */
.footer-information {
	text-align: center;
}

.footer-menu {
	text-align: center;
}

.footer-menu ul {
	margin-top: 16px;
}

.footer-menu ul li {
	padding-top: 4px;
	padding-bottom: 4px;
	position: relative !important;
	transition: 0.4s ease !important;
}

.footer-menu ul li a {
	padding-left: 0px !important;
}

.footer-menu ul li:hover {
	padding-left: 12px !important;
}

/* company text */
.footer-text {
	text-align: center;
}

.footer-text p {
	line-height: 1.8;
	margin-top: 16px;
}

.footer-header {
	font-size: 28px;
	font-weight: 600;
	letter-spacing: 2px;
	margin-bottom: 18px;
}

/* only on footer we revert colors cause of canvas has footer-information also and a white bg */
.footer .footer-information img
{
	filter: invert(75%) sepia(4%) saturate(93%) hue-rotate(335deg) brightness(92%) contrast(94%);
	/*filter: invert(1);*/
}

.footer-information .tel-numbers .tel-sep{
	display: none;
}

.footer-information .info.tel {
	display: flex;
	align-items: center;
	justify-content: center;
}

.footer-information .tel-numbers {
	display: flex;
	flex-direction: column !important; /* its on the header off canvas also so we need it*/
}

.footer-information .mod-custom .span-location {
	margin-left: 8px;
}

/* footer after border top line */
.footer-after {
	border-top: 1px solid rgba(255,255,255, 0.4);
	padding-top: 12px !important;
	padding-bottom: 12px !important;
}

/* OFF CANVAS ICONS OF FOOTER INFORMATION */

.header .el-offcanvas .footer-information .info img{
	height: 26px;
	width: auto;
}

/* ==========================================
   BUTTON STYLES
   ========================================== */

.btn {
	display: block;
	width: 100%;
	background-color: #44535f;
	color: #fff;
	font-size: 20px;
	transition: 0.4s ease;
	padding: 7px 12px;
	border-radius: 0px;
}

.btn:hover {
	background-color: #38454F;
	transform: translateY(-2px);
	color: #fff !important;
}

.btn span::before {
	content: '';
}

.btn-transparent {
	border: 2px solid #44535f;
	background: rgba(255, 255, 255, 0.75);
	backdrop-filter: blur(12px);
	color: #4a4038;
	display: flex;
	align-items: center;
	justify-content: center;
}

.btn-gray {
  border: 2px solid #bcbab9;
  background: rgba(255, 255, 255, 0.75);
  backdrop-filter: blur(12px);
  color: #000;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #bcbab9;
}

/*.btn-gray:hover {
	background-color: #38454F;
	color: #fff !important;
}*/
/* ==========================================
   ROOM SERVICES STYLES
   ========================================== */

.room-services-title{
	font-weight: 500;
	font-size: 1.35rem;
}

/*.room-services-items > ul{
	padding: 0;
	columns: 2;
}

.room-service-item{ 
	display: flex; 
	align-items: center; 
	margin: 15px 0;	
}

div.room-services-items .room-service-item:before{
	display: inline-flex;
	content: '';
	width: var(--services-icons-size);
	height: var(--services-icons-size);
	background-size: var(--services-icons-size) var(--services-icons-size);
	background-repeat: no-repeat;
	background-position: center;
	justify-content: center;
	align-items: center;
	margin-right: 10px;
	overflow: auto;
}

.room-services-items .view::before { background: url('/images/icons/room/view.svg'); }
.room-services-items .cleaning::before { background: url('/images/icons/room/cleaning.svg'); }
.room-services-items .jacuzzi::before { background: url('/images/icons/room/jacuzzi.svg'); }
.room-services-items .kitchen::before { background: url('/images/icons/room/kitchen.svg'); }
.room-services-items .wifi::before { background: url('/images/icons/room/wifi.svg'); }
.room-services-items .tv::before { background: url('/images/icons/room/tv.svg'); }
.room-services-items .washing-machine::before { background: url('/images/icons/room/washing-machine.svg'); }
.room-services-items .dryer::before { background: url('/images/icons/room/dryer.svg'); }
.room-services-items .iron::before { background: url('/images/icons/room/iron.svg'); }
.room-services-items .treasury::before { background: url('/images/icons/room/treasury.svg'); }
.room-services-items .heating::before { background: url('/images/icons/room/heating.svg'); }
.room-services-items .aircondition::before { background: url('/images/icons/room/aircondition.svg'); }
.room-services-items .smoke-detector::before { background: url('/images/icons/room/smoke-detector.svg');}
.room-services-items .office::before { background: url('/images/icons/room/office.svg'); }
.room-services-items .dining-room::before { background: url('/images/icons/room/dining-room.svg'); }
.room-services-items .dishwasher::before { background: url('/images/icons/room/dishwasher.svg'); }
.room-services-items .coffee::before { background: url('/images/icons/room/coffee.svg'); }
.room-services-items .balcony::before { background: url('/images/icons/room/balcony.svg'); }
.room-services-items .parking::before { background: url('/images/icons/room/parking.svg'); }
.room-services-items .hair-dryer::before { background: url('/images/icons/room/hair-dryer.svg'); }
.room-services-items .pets::before { background: url('/images/icons/room/pets.svg'); }
.room-services-items .smoking::before { background: url('/images/icons/room/smoking.svg'); }
.room-services-items .fireplace::before { background: url('/images/icons/room/fireplace.svg'); }
.room-services-items .hydromassage::before { background: url('/images/icons/room/hydromassage.svg'); }
.room-services-items .minibar::before { background: url('/images/icons/room/minibar.svg'); }
.room-services-items .kettle::before { background: url('/images/icons/room/kettle.svg'); }
.room-services-items .sofa-bed::before { background: url('/images/icons/room/sofa-bed.svg'); }
.room-services-items .bathrobes::before { background: url('/images/icons/room/bathrobes.svg'); }
.room-services-items .towel::before { background: url('/images/icons/room/towel.svg'); }
.room-services-items .ceiling-fan::before { background: url('/images/icons/room/ceiling-fan.svg'); }
.room-services-items .cradle::before { background: url('/images/icons/room/cradle.svg'); }
*/

/* ==========================================
   APARTMENTS PAGE STYLES
   ========================================== */

.apartment-page .container-page-header {
	height: 500px;
}

.apartments-page .blog-item {
	background-color: #fff !important;
	box-shadow: none !important;
}

.apartments-page .blog-items {
	gap: 3em !important;
	margin-top: 32px;
	margin-bottom: 32px;
}

.apartments-page .blog-item .left.item-image {
	height: 500px;
	flex: 0 0 500px !important;
	overflow: hidden;
}

.apartments-page .blog-item .left.item-image a {
	display: block;
	width: 100%;
	height: 100%;
}

.apartments-page .blog-item .left.item-image img {
	width: 100%;
	height: 100%;
	max-height: none !important;
	object-fit: cover;
	transition: transform 0.4s ease;
}

.apartments-page .blog-item .left.item-image:hover img {
	transform: scale(1.1);
}

/*.apartments-page .blog-item .item-content {
	background: rgba(255, 255, 255, 0.75);
	backdrop-filter: blur(12px);
	width: 90%;
	margin: -60px auto 0;
	position: relative;
	z-index: 10;
	font-size: 18px;
	color: #4a4038;
	line-height: 1.6;
	border: 1px solid #ddd;
	box-shadow: 0 2px 6px rgba(0,0,0,0.05);
	padding: 24px;    
}*/
.apartments-page .blog-item .item-content{
	order: -1;
}

.apartments-page .blog-item .readmore{
	display: none;
}

.apartments-page .blog-item .item-content h2 {
	text-align: center;
}

.apartments-page .blog-item .item-content h2 a {
	color: #4a4038 !important;
	font-size: 28px !important;
}

.apartments-page .blog-item .item-content ul {
	display: none;
/*	display: grid !important;
	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
	column-gap: 16px;
	row-gap: 16px;
	list-style-type: none;
	padding: 0px;
	margin-top: 8px;*/
}

.apartments-page .blog-item .item-content ul li {
	display: flex;
	align-items: center;
}

.apartments-page .blog-item ul li::before {
	content: '';
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	margin-right: 10px;
}

.apartments-page .blog-item ul li.krevatia::before {
	background-image: url('/images/icons/room/sofa-bed.svg');
}

.apartments-page .blog-item ul li.episkeptes::before {
	background-image: url('/images/icons/room/people.svg');
}

.apartments-page .blog-item ul li.tetragonika-metra::before {
	background-image: url('/images/icons/room/area.svg');
	min-width: 24px;
}

.apartments-page .blog-item ul li.ypnodomatia::before {
	background-image: url('/images/icons/room/room.svg');
}

.apartments-page .blog-item ul li.bania::before {
	background-image: url('/images/icons/room/jacuzzi.svg');
}

.apartments-page .blog-item ul li.tetragonika-metra span {
	white-space: nowrap;
}

.apartments-page .blog-item .item-content .readmore a {
	display: block;
	width: 100%;
	margin: 8px auto -4px;
	background-color: #44535f;
	color: #fff;
	font-size: 20px;
	transition: 0.4s ease;
	padding: 7px 12px;
	border-radius: 0px;
}

.apartments-page .blog-item .item-content .readmore a span::before {
	content: '';
}

.apartments-page .blog-item .item-content .readmore a:hover {
	background-color: #38454F;
	transform: translateY(-2px);
	color: #fff;
}

.apartments-page .blog-item .item-content .btn,
.apartments-page .blog-item .item-content .btn-secondary,
.apartments-page .blog-item .item-content .btn:hover,
.apartments-page .blog-item .item-content .btn-secondary:hover {
	border: none !important;
	outline: none !important;
}


/* ==========================================
   APARTMENT DETAIL PAGE STYLES
   ========================================== */
.apartment-page .grid-child.container-component {
  grid-column: full-start / full-end !important;
}

.apartment-page .other-rooms{
	max-width: 1600px;
	margin-left: auto !important;
	margin-right: auto !important;
}

.apartment-main-content-outer{
	padding: 20px;
	max-width: 1600px;
	margin: 0 auto;
}


.apartment-main-content{
	margin-bottom: 48px;
}

.apartment-body .apartment-title {
	font-size: 56px;
	font-weight: 600;
	margin-top: 48px;
	margin-bottom: 48px;
}

.apartment-body .apartment-description {
	color: #4a4038;
	line-height: 1.6;
}

.apartment-body .apartment-description p:last-child{
	margin-bottom: 0 !important;
}

.apartment-body .room-services {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap:20px;
}

.apartment-body .room-services-title {
	text-align: center;
	/*margin-bottom: 15px;*/
}

.apartment-body .room-services-title h2 {
	font-size: 28px !important;
	color: #4a4038 !important;
	text-align: left;
	text-indent: 25px;
	margin-bottom: 15px;
}

.apartment-body .room-services-items{
	background: #e7e6e6;
	height: min-content;
	padding: 10px;
}

.apartment-images-slider .slider{
	max-height: 60vh;
	background: #bcbab9;
}

.apartment-images-slider .slide {
    position: relative;
    overflow: hidden;
}

.apartment-images-slider .slide::before {
    content: "";
    position: absolute;
    inset: 0;

    background: inherit;
    background-size: cover;
    background-position: center;

    filter: blur(20px);
    transform: scale(1.1);
}

.apartment-images-slider .slide img {
    position: relative;
    z-index: 1;
    width: 100%;
    height: 100%;
    object-fit: contain !important;
}

/*.apartment-body .room-services-items ul {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	row-gap: 32px;
}*/

/*.apartment-body .room-services-items li {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	text-align: center;
	gap: 8px;
	font-size: 18px;
	color: #4a4038;
	font-weight: 500;
	transition: 0.4s ease;
}

.apartment-body .room-services-items li:hover {
	opacity: 0.9;
}*/

.apartment-body .ypiresies-title {
	margin-bottom: 48px;
	margin-top: 48px;
}

.apartment-body .ypiresies-title h2 {
	font-size: 28px !important;
	color: #4a4038;
}

.apartment-body .accordion {
	margin-bottom: 48px;
	overflow: hidden;
}

.apartment-body .accordion-item {
	color: #4a4038;
	margin-bottom: 16px;
	border: 1px solid #ddd !important;
	box-shadow: 0 2px 8px rgba(0,0,0,0.05);
}

.apartment-body .accordion-button {
	color: #4a4038;
	font-weight: 500;
	padding: 18px;
}

.apartment-body .accordion-button:focus {
	box-shadow: none !important;
}

.apartment-body .accordion-body {
	padding: 24px;
}

.apartment-body .accordion-body table td {
	border: 1px solid #ddd;
}

.apartment-body .accordion-collapse {
	transition: all .4s ease;
}

.apartment-body .h2-gallery {
	text-align: center;
	margin-bottom: 48px;
}

.apartment-body .h2-gallery h2 {
	font-size: 28px !important;
	color: #4a4038;
}


/* ==========================================
   OTHER ROOMS MODULE STYLES
   ========================================== */

.other-rooms .mod-articles-items{
	display: flex;
}

.other-rooms .mod-articles-items li {
	flex: 1;
}

.other-rooms .mod-articles-items li .item-image img {
	max-height: 300px;
}

.other-rooms.slider .mod-articles-item-content h4 {
	text-align: center;
	margin-bottom: 16px;
}

.other-rooms.slider .mod-articles-item-content ul {
	display: none;
	/*display: grid !important;
	grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
	width: 90%;
	margin: -40px auto 32px;
	position: relative;
	column-gap: 8px;
	row-gap: 8px;
	list-style-type: none;
	padding: 36px 36px 104px 36px;
	z-index: 10;
	background: rgba(255, 255, 255, 0.75);
	backdrop-filter: blur(12px);
	border: 1px solid #ddd;
	box-shadow: 0 2px 6px rgba(0,0,0,0.05);*/
}

.other-rooms.slider .mod-articles-item-content .readmore {
	display: none;
}

.other-rooms.slider .mod-articles-item-content ul li {
	display: flex;
	align-items: center;
	color: #4a4038;
}

.other-rooms.slider .mod-articles-item-content ul li h4 a {
	color: #4a4038 !important;
}

.other-rooms.slider .mod-articles-item-content ul li::before {
	content: '';
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	margin-right: 10px;
}

.other-rooms.slider .mod-articles-item-content ul li.episkeptes::before {
	background-image: url('/images/icons/room/people.svg');
}

.other-rooms.slider .mod-articles-item-content ul li.ypnodomatia::before {
	background-image: url('/images/icons/room/room.svg');
}

.other-rooms.slider .mod-articles-item-content ul li.krevatia::before {
	background-image: url('/images/icons/room/sofa-bed.svg');
}

.other-rooms.slider .mod-articles-item-content ul li.bania::before {
	background-image: url('/images/icons/room/jacuzzi.svg');
}

.other-rooms.slider .mod-articles-item-content ul li.tetragonika-metra::before {
	background-image: url('/images/icons/room/area.svg');
	min-width: 28px;
}

.other-rooms.slider .mod-articles-item-content ul li.tetragonika-metra span{
	white-space: nowrap;
}

.other-rooms.slider .readmore .btn,
.other-rooms.slider .readmore .btn-secondary,
.other-rooms.slider .readmore .btn:hover,
.other-rooms.slider .readmore .btn-secondary:hover {
	border: none;
	outline: none;
}

.other-rooms.slider .readmore a {
	display: block;
	width: 78%;
	margin: -88px auto 0px;
	color: #fff;
	background: #44535f;
	font-size: 20px;
	transition: 0.4s ease;
	padding: 7px 12px;
	position: relative;
	z-index: 10;
	border-radius: 0px;
}

.other-rooms.slider .readmore a:hover {
	background: #38454F;
	transform: translateY(-2px);
	color: #fff;
}


/* ==========================================
   CONTENT PAGES (Locations & Info)
   ========================================== */

.milos-page .com-content-article__body h2,
.pollonia-page .com-content-article__body h2,
.prosvasi-page .com-content-article__body h2,
.xrisimesplirofories-page .com-content-article__body h2 {
	margin-top: 48px;
	margin-bottom: 48px;
	font-size: 32px;
}

.milos-page .com-content-article__body p:first-child,
.pollonia-page .com-content-article__body p:first-child,
.prosvasi-page .com-content-article__body p:first-child,
.xrisimesplirofories-page .com-content-article__body p:first-child {
	margin-top: 48px;
}

.milos-page .com-content-article__body p,
.pollonia-page .com-content-article__body p,
.prosvasi-page .com-content-article__body p,
.xrisimesplirofories-page .com-content-article__body p {
	color: #4a4038;
	line-height: 1.6;
	max-width: 1300px;
}

.milos-page .com-content-article__body p:last-child,
.pollonia-page .com-content-article__body p:last-child,
.prosvasi-page .com-content-article__body p:last-child,
.xrisimesplirofories-page .com-content-article__body p:last-child {
	margin-bottom: 48px;
}


/* ==========================================
   TOPOTHESIA PAGE STYLES
   ========================================== */

.topothesia-page .com-content-category-blog {
	margin-top: 48px;
	margin-bottom: 48px;
}

.topothesia-page .blog-item {
	background-color: #fff !important;
	box-shadow: none !important;
}

.topothesia-page .blog-item .item-content h2 {
	font-size: 28px !important;
	color: #4a4038 !important;
	text-align: center;
}

.topothesia-page .blog-item .item-content {
	background: rgba(255, 255, 255, 0.75);
	backdrop-filter: blur(12px);
	color: #4a4038;
	line-height: 1.6;
	border: 1px solid #ddd;
	box-shadow: 0 2px 6px rgba(0,0,0,0.05);
	padding: 28px;
}

.topothesia-page .blog-items {
	gap: 1.5em !important;
}

/* language switcher */
/*.language-switcher li{
	padding: 0 !important;
}
.language-switcher a{
	display: block !important;
	width: 100% !important;
}*/

/* ==========================================
   RESPONSIVE STYLES
   ========================================== */

@media screen and (max-width: 992px) { 

	.apartment-main-content {
	  margin-bottom: 48px;
	  gap: 25px;
	}

	.apartment-body .room-services-title h2 {
		text-indent: 0px;
	}

	.header-info-tel-mobile {
		display: block;
	}	

	.header-info-tel {
		display: none;
	}

	.header .info.location {
		font-size: 14px;
	}

	.header .info.location img {
		width: 20px;
		height: 20px;
	}

	/*.room-services-items > ul {
		columns: 1;
	}*/

	.apartments-page .blog-item .left.item-image {
		height: 400px;
		flex: 0 0 400px !important;
	}

	/* language switcher */

/*	.language-switcher .dropdown-toggle{
		background: unset;
		border: 1px solid #555;
		border-radius: 4px;
		padding: 5px 12px;
		color: #555;
	}

	.language-switcher .btn:hover {
		color: #4a4038 !important;
	}*/


	.footer-after{
		text-align: center;
	}
}

@media (max-width: 460px) {

	.styled-room-mod .accordion-body {
		padding: 12px;
	}

}
