/*
Theme Name: net22
Theme URI: 
Author: Net22
Author URI: https://www.net22.gr/
Description: Net22
Version: 1.0
*/
.contact--list.style_3 li {
	flex-direction:column;
	row-gap:5px;
}
#footer.style_3 .footer--cols > .col--middle {
	border-color:rgba(255, 255, 255, .2);
}
.footer--cols {
	max-width: 1680px;
	margin-inline: auto;
}
.contact--form input, .contact--form textarea {
	background-color:transparent;
}
#header.style_3 {
	background-color: var(--body_bg);
}
.menu--contact.contact--list .contact--item-title {
	font-weight:600;
}
#hero .owl-dots {
	display:none;
}

.section--title, .h2, h2 {
	font-size: 33px;
}

.menu--contact.contact--list .contact--item-title {
	font-size: 23px;
}

.villa-slider-big__wrapper {
	margin-top: 100px;
}

.header--logo.header--logo-scrolled {
	opacity:0;
	pointer-events:none;
}
#header.scrolled .header--logo {
	opacity:0;
	pointer-events:none;
}
#header.scrolled .header--logo.header--logo-scrolled {
	opacity:1;
	pointer-events:auto;
}

.villa-list-wrapper .single .title {
	font-size: 25px;
	color: var(--heading_color);
}

.menu--contact.contact--list .contact--item-title {
	color: var(--heading_color);
}

#contact--hero .title {
	color: var(--heading_color);
}













/* New CSS */
.not--available {
	font-size: 16px;
	color: red;
	text-align: center;
	display: block;
	width: 100%;
}
#hero.style_wh .content {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 2;
	width: 100%;
	max-width: 775px;
}
.hero-booking-form {
	position: relative;
	background-color: var(--menu_bg);
	display: flex;
	width: 100%;
}
#loader {
	opacity: 0;
	transition: all ease-in-out 250ms;
	pointer-events: none;
	background-color: #fff;
	position: absolute;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	z-index: 2;
	top: 0;
	left: 0;
}
.lds-dual-ring::after {
	width: 44px !important;
	height: 44px !important;
	margin: 0 !important;
}
.lds-dual-ring {
	width:60px !important;
	height:60px !important;
}
.hero-booking-form .date-inputs {
	display: flex;
}
.hero-booking-form .input-container {
	display:flex;
	align-items:center;
	position: relative;
}
.hero-booking-form .input-container label {
	font-size: 15px;
	font-weight: 700;
	color: var(--menu_color);
	display: block;
	margin: 0 0 10px 15px;
	line-height: 1;
	display:none;
}
.input-container textarea,
.input-container input {
	border: none;
	margin:0;
	outline: none;
	cursor: pointer;
	background-color:transparent;
	color: var(--menu_color);
	font-size: 16px;
	font-weight: 500;
	width: 100%;
	height: 80px;
}
.input-container input::placeholder {
	opacity:1;
	color:var(--menu_color);
}
.input-container input  {
	padding: 0 15px 0 50px;
	max-width: 200px;
	min-width:200px;
}
.input-container textarea {
	resize:none;
	height:170px;
	padding: 15px;
}
.input-container > .input-container--flex {
	align-items: center;
	/* 	border-radius: 10px; */
	width: 100%;
	color: var(--menu_color);
	position: relative;
	font-size: 15px;
	font-weight: 500;
	height:100%;
	display: flex;
	gap: 7px;
	background-color: transparent;
}
.hero-booking-form .inputs-guests {
	min-width: 250px;
	cursor: auto;
	top: unset;
	bottom: calc(100% + 10px);
}
#open-guests {
	font-size: 16px;
	width: 100%;
	line-height: 1.3;
	align-self: stretch;
	display: flex;
	align-items: center;
	column-gap: 5px;
}
.hero-booking-form #open-guests {

	min-width: 200px;
	max-width: 200px;
	padding-left: 50px;
}
.input-number-with-buttons {
	display: flex;
	align-items: center;
	padding: 10px 15px;
}
.inputs-guests .btn__container {
	padding: 10px;
	display: flex;
	justify-content: flex-end;
}
.input-number-with-buttons label {
	margin:0 8px 0 0 !important;
}
.hero-booking-form .input-container .icon {
	width: 20px;
	height: 20px;
	min-width: 20px;
	min-height: 20px;
	position: absolute;
	left: 20px;
	top: 50%;
	transform: translateY(-50%);
}
.hero-booking-form .input-container:not(.input-guests__container) {
	border-right:1px solid #fff;
}
#hero.style_wh .content #wh--form-wrapper {
	margin-top: 60px;
}
.input-number-with-buttons label small {
	opacity: 0.7;
	margin-left: 2px;
}
#close-guests {
	max-width: 100%;
	width: 100%;
}
.input-number-with-buttons input[type="number"] {
	width: 60px !important;
	height: 30px !important;
	margin-inline:10px;
	min-width:unset !important;
	max-width:100% !important;
}
.hero-booking-form .input-container .input-number-with-buttons label {
	display:block;
}
.input-number-with-buttons > span {
	cursor: pointer;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	user-select: none;
	min-width: 25px;
	min-height: 25px;
	border: 1px solid var(--cta_color);
}


.hero-booking-form button.cta--border {
	background-color: var(--cta_color);
	border: unset;
	color: var(--cta_bg);
	flex: 1;
	width: 100%;
	min-width:170px;
	max-width: 100%;
}
.hero-booking-form button.cta--border:hover {
	background-color: var(--cta_bg);
	color: var(--cta_color);
}
.villa--card-price__el {
	display: flex;
	flex-direction: column;
	row-gap: 5px;
}
.price--text {
	display: flex;
	align-items: center;
	column-gap: 8px;
}
.offer--price {
	text-decoration: line-through;
	font-size:80%;
}
.villas--list-loop .single .col--right .price {
	display: flex;
	align-items: flex-end;
	column-gap: 35px;
}
.wh--link-trigger {
	display: flex;
	max-width: max-content;
	padding: 8px 15px 10px;
	border-radius: 15px;
	overflow: visible;
	background-color: var(--cta_color);
	color: var(--cta_bg);
	border: 1px solid var(--cta_color);
	font-size: 14px;
	line-height: 1;
}
.wh--link-trigger:hover {
	background-color: var(--cta_bg);
	color:var(--cta_color);
}
.villas--list-loop .single .col--right {
	min-width:270px;
}
.villas--list-loop .single .col--middle .cta--arrow {
	max-width:max-content;
	margin-top:25px;
}
#wh-n22-form .input-row {
	display: flex;
	column-gap:2px;
}
#wh-n22-form .input-row .input-container {
	position: relative;
	display: flex;
	align-items: center;
}
#wh-n22-form .input-row .input-container .icon {
	width: 20px;
	height: 20px;
	min-width: 20px;
	min-height: 20px;
	position: absolute;
	left: 20px;
	top: 50%;
	transform: translateY(-50%);
}
#wh-n22-form .input-row .input-container > label {
	display:none;
}
#wh-n22-form .input-container input {
	border:1px solid rgba(0, 0, 0, .4);
	height:60px;
}

#wh-n22-form .input-container > .input-container--flex {
	align-self: stretch;
	height: 100%;
}
#wh-n22-form .input-container > .input-container--flex #open-guests {
	/* 	min-width: 200px;
	max-width: 200px; */
	border:1px solid rgba(0, 0, 0, .4);
	padding-left: 50px;
	min-width: 165px;
	max-width: 165px;
	cursor:pointer;
}
#wh-n22-form .inputs-guests {
	min-width: 250px;
	cursor: auto;
	top: unset;
	bottom: calc(100% + 10px);
	cursor:pointer;
}
.wh--sticky #submit-form {
	background-color: var(--cta_color);
	border: unset;
	color: var(--cta_bg);
	flex: 1;
	width: 100%;
	cursor: pointer;
	padding: 20px;
	transition: all ease-in-out 250ms;
}
.wh--sticky #submit-form:hover {
	background-color: var(--cta_bg);
	color: var(--cta_color);
}
.wh--sticky .section--title.text-center {
	margin-bottom: 25px;
}

#wh-n22-form .input-row .input-container.guests--wrapper {
	flex: 1;
	width: 100%;
}
#wh-n22-form .input-container .input-number-with-buttons label {
	display: block;
}
#wh-n22-form .input-container label {
	font-size: 15px;
	font-weight: 700;
	color: var(--menu_color);
	display: block;
	margin: 0 0 10px 15px;
	line-height: 1;
	display: none;
}

ul#rates {
	list-style:none;
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding:0;
}
ul#rates li .rate--cols .rate--col-left .title {
	font-size: 18px;
	line-height:1.3;
	font-weight: 600;
	display:block;
	margin-bottom:12px;
}
ul#rates li .rate--cols .rate--col-left .text.editor {
	font-size:14px;
}
ul#rates li .rate--cols .rate--col-left {
	max-width: 225px;
}
ul#rates li .rate--cols {
	justify-content:space-between;
	column-gap:20px;
}
ul#rates li .rate--cols .rate--col-middle {
	align-self: stretch;
}
ul#rates li .rate--cols .rate--col-middle .final---price-el {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	font-size:18px;
	font-weight:600;
	line-height:1.2;
}
@media(min-width:1551px) {
	ul#rates li .rate--cols .rate--col-middle .final---price-el .offer--price {
		font-size: 70%;	
	}	
}
ul#rates li .rate--cols .rate--col-right .rate--policies {
	display: block;
	margin: 10px auto 0;
	font-size: 14px;
	cursor:pointer;
	line-height: 1;
	text-align: center;
	transition:all ease-in-out 250ms;
}
ul#rates li .rate--cols .rate--col-right .rate--policies:hover {
	color:var(--cta_color);
}
ul#rates > li {
	padding:15px;
	background-color:#eaeaea;
}
ul#rates li .rates-informations {
	margin-top: 20px;
	display:none;
	max-width:400px;
}
ul#rates li .rates-informations > div:not(:last-child) {
	margin-bottom: 15px;
}
ul#rates li .rates-informations > div > strong {
	display:block;
	line-height:1;
	margin-bottom:5px;
	font-size:15px;
}
ul#rates li .rates-informations > div {
	font-size:14px;
}
ul#rates li .rates-informations > div ul {
	margin:0;

}
.input-container input.has--error, .input-container input.has--error::placeholder {
	color: red !important;
}
.left--right-wrapper .inner .price {
	margin-top: 35px;
	display: flex;
	align-items: center;
	column-gap: 40px;
	border-block: 1px solid var(--cta_color);
	padding-block: 15px;
	justify-content: space-between;
}
#wh-n22-form .input-container input {
	max-width: 165px;
	min-width: 165px;
}
@media(max-width:1550px) {
	ul#rates li .rate--cols .rate--col-left .text.editor {
		font-size: 13px;
	}
	#wh-n22-form .input-container input {
		max-width: 140px;
		min-width: 140px;
	}
	.template--the-villa__about--info .cols .col--right {
		max-width: 425px;
		min-width: 425px;
	}
	.input-container input {
		padding: 0 15px 0 40px;
		max-width: 160px;
		min-width: 160px;
	}
	#wh-n22-form .input-container > .input-container--flex #open-guests,
	.input-container textarea, .input-container input {
		font-size:14px;
	}
	#wh-n22-form .input-container > .input-container--flex #open-guests {
		padding-left:40px;
	}
	#wh-n22-form .input-row .input-container .icon {
		width: 16px;
		height: 16px;
		min-width: 16px;
		min-height: 16px;
		left: 14px;
	}
	.input-number-with-buttons input[type="number"] {
		width: 40px !important;
	}
	#wh-n22-form .inputs-guests {
		transform: unset;
		left: unset;
		right: 0;
	}
	ul#rates li .rate--cols .rate--col-middle .final---price-el {
		font-size: 16px;
	}
	ul#rates li .rate--cols .rate--col-left {
		max-width: 200px;
	}
	.picker__holder {
		min-width: 240px;
	}
	ul#rates li .rate--cols .rate--col-left .title {
		font-size: 16px;
		margin-bottom:8px;
	}
	#wh-n22-form .input-container > .input-container--flex #open-guests {
		min-width: 140px;
		max-width: 140px;
	}

	ul#rates li .rate--cols {
		column-gap:12px;
	}
	.nagivation--wrapper .main--menu li a {
		font-size:18px;
	}
	.nagivation--wrapper .main--menu {
		row-gap:10px;
	}
	.menu--contact.contact--list .contact--item-title {
		font-size: 18px;
	}
	.menu--contact.contact--list li a {
		font-size: 16px;
	}
	.menu--contact.contact--list {
		row-gap: 15px;
		margin-bottom: 20px;
	}
	.nagivation--wrapper .navigation {
		margin-bottom: 20px;
	}
}
@media(max-width:1150px) {
	.template--the-villa__about--info .cols {
		flex-direction: column;
		row-gap: 50px;
	}
	.template--the-villa__about--info .cols .col--right {
		margin-inline: auto;
	}
}
@media(max-width:991px) {
	#hero.style_wh .content {
		max-width: 550px;
	}
	.hero-booking-form {
		flex-direction: column;
	}
	.input-container input,
	#open-guests {
		font-size: 15px;
	}
	.input-container input {
		height: 65px;
	}
}
@media(max-width:767px) {
	#header.has--sticky-logo .header--logo, .header--logo {
		left: 20px;
		transform: unset;
		top: 20px;
	}
	.hero-booking-form .date-inputs {
		flex-direction: column;
	}
	.hero-booking-form .input-container:not(.input-guests__container) {
		border-right:unset;
		border-bottom:1px solid #fff;
	}
	#hero.style_wh .content {
		max-width: 90vw;
	}
	.input-container input {
		height: 50px;
	}
	.hero-booking-form .input-container {
		min-height: 50px;
	}
}
@media(max-width:570px) {
	ul#rates li .rate--cols .rate--col-middle .final---price-el {
		font-size: 16px;
	}
	.section--title, .h2, h2 {
		font-size: 25px;
	}
	.villa-slider-big__wrapper {
		margin-top:70px;
	}
	.villa-slider-big__wrapper .single .image {
		height: 400px;
	}
	body:not(.villas-template-template-the-villa) .input-container input {
		padding-left:50px;
	}
	.template--the-villa__about--info .cols .col--right {
		max-width:100%;
		width:100%;
		min-width:unset;
	}
	#wh-n22-form .input-row {
		flex-direction: column;
		row-gap: 2px;
	}
	.input-container input {
		max-width: 100%;
		min-width: unset;
	}
	#wh-n22-form .input-container > .input-container--flex #open-guests {
		min-height: 60px;
	}
	.buttons__container {
		margin: 2px 0 16px;
	}
	ul#rates li .rate--cols {
		flex-wrap:wrap;
		row-gap: 16px;
	}
	/* 	ul#rates li .rate--cols .rate--col-middle .final---price-el {
	justify-content: flex-start;
	align-items: flex-start;
	text-align: left;
} */
	ul#rates li .rate--cols .rate--col-right .rate--policies {
		margin-top: 20px;
		text-align: left;
	}
	.left--right-wrapper .inner .price {
		column-gap:20px;
	}
	#wh-n22-form .input-container input {
		max-width:100%;
		min-width:unset;
	}
	#wh-n22-form .input-container > .input-container--flex #open-guests {
		min-width:unset;
		max-width:unset;
	}
}

@media(min-width:992px) {
	.villa--card-price__el {
		flex-direction: row;
		align-items: center;
		column-gap: 15px;
	}
}
.template--the-villa__about--info .cols .col--left > h2.section--title {
	margin-bottom: 25px;
}

@media(max-width:1150px) {
	.template--the-villa__about--info .cols .col--left > h2.section--title {
		text-align:center;
	}
}


body:not(.page-template-template-contact) #header:not(.scrolled) .cta--arrow {
	border-color:#fff;
}
body:not(.page-template-template-contact) #header:not(.scrolled) .cta--arrow svg path {
	stroke:#fff;
}
body:not(.page-template-template-contact) #header:not(.scrolled) #burger,
body:not(.page-template-template-contact) #header:not(.scrolled) .cta--arrow,
body:not(.page-template-template-contact) #header:not(.scrolled) .languages--wrapper.next .next--lang {
	color:#fff;
}
body:not(.page-template-template-contact) #header:not(.scrolled) .header--logo:not(.header--logo-scrolled) {
	filter: invert(1);
}
#hero .slider--controls > span svg path,
#hero .slider--controls > span svg circle {
	stroke:#fff;
}
body.page-template-template-villa-archive #hero {
	overflow:unset;
}

.location--map-panel__body.relative {
	display: flex;
	justify-content: space-between;
	column-gap: 20px;
}
.location--map-panel__body a {
	justify-content:flex-start;
}
.take--me-there svg {
	width: 16px;
	height: 16px;
	display:block;
}
.take--me-there {
	z-index: 1;
	display: flex;
	font-size:65% !important;
	column-gap:6px;
	line-height: 1;
	align-items: center;
	font-weight: 400;
	transition:all ease-in-out 250ms;
}
.take--me-there:hover {
	color:var(--cta_color);
}


html[lang="el"] #open-guests,
html[lang="el"] .input-container textarea, 
html[lang="el"] .input-container input {
	font-size:14px;
}
html[lang="el"] #wh-n22-form .input-container > .input-container--flex #open-guests #total-guests {
	letter-spacing: -1.5px;
}
@media(max-width:1550px) and (min-width:768px) {
	html[lang="el"] #wh-n22-form .input-container > .input-container--flex #open-guests,
	html[lang="el"] #wh-n22-form .input-container input:not(input[type="number"]) {
		padding-left:35px !important;
		font-size:13.5px;
		column-gap:3px;
	}
}
@media (min-width:768px){
	.tripadvisor {
    padding-left: 80px;
}
}