@import url('https://fonts.googleapis.com/css2?family=Merriweather:wght@400;700&family=Open+Sans:wght@400;600;700&display=swap');
@import url('/core/api/unitegallery/dist/css/unite-gallery.css');
html,
body {
	background-color:#768ba1;
	font-size: 100%;
	font-family: "Open Sans", sans-serif;
	margin: 0
}
img { margin-bottom: -4px }
div { box-sizing: border-box }
.shadow {  box-shadow:0 4px 8px 0 rgba(0, 0, 0, .2), 0 6px 20px 0 rgba(0, 0, 0, .19) }
h1, h2, h3, h4, h5, h6 { font-family: "Merriweather", serif; color:#416eac; font-weight: lighter }
h1 { font-size: 200% }
h2 { font-size: 180% }
h3 { font-size: 160% }
h4, h5, h6 { font-size: 140% }
.spacer { display: none }
.header { top: 0; left: 0; width: 100%; z-index: 10 }
.top_contact {
	background-color: #124c56;
	color: #f2f2f2;
	padding: 15px 20px 15px 20px;
	text-align: center;
	position: relative
}
.top_contact a,
.top_contact a:visited {
	color: white;
	font-weight: bold;
	text-decoration: none;
}
.top_logo { background-color: #f2f2f2; display: table; width: 100%; position: relative }
.top_logo div, .top_logo nav { display: table-cell; vertical-align: bottom; white-space: nowrap }
.top_logo div {
	font-size: 140%;
	font-family: "Merriweather", serif;
	color:#416eac;
	padding: 15px 40px 15px 20px
}
/* Menu system */
.top_logo nav { width: 100%; padding: 15px 0 15px 0 }
.top_logo nav ul { margin: 0; padding: 0; list-style: none }
.top_logo nav ul ul { display: none }
.top_logo nav li { display: inline; padding-right: 20px; position: relative }
.top_logo nav a,
.top_logo nav a:visited {
	display: table-cell;
	padding-bottom: 1px;
	color: #416eac;
	text-decoration: none;
	text-transform: uppercase;
	transition: .5s;
}
.top_logo nav a:hover { color: salmon }
.top_logo nav li ul {
	position: absolute;
	left: 0;
	top: 22px;
	border: 1px solid #cccccc;
	box-shadow:0 4px 8px 0 rgba(0, 0, 0, .2), 0 6px 20px 0 rgba(0, 0, 0, .19)
}
.top_logo nav li ul li {
	background-color: white;
	display: block;
	padding: 10px;
	border-bottom: 1px solid #cccccc
}
.top_logo nav li ul li:last-child { border: none }
.top_logo nav li:hover ul { display: block }
/* End of menu system */
.banner { height: 4%; overflow: hidden; position: relative }
.banner img { width: 100%; height: auto; position: relative; z-index: 1 }
.banner_underlay {
	 position: absolute;
	 width: 32%;
	 top: 12%;
	 bottom: 6%;
	 background-color: salmon;
	 z-index: 2;
	 right: 0;
	 clip-path: polygon(0 0, 100% 0, 100% 100%, 16% 99%);
	 opacity: .9
 }
.banner_overlay {
	position: absolute;
	display: table-cell;
	vertical-align: middle;
	z-index: 3;
	right: 0;
	top: 10%;
	bottom: 10%;
	background: #6699c2;
	width: 30%;
	padding: 20px 20px 20px 70px;
	color: white;
	clip-path: polygon(0 0, 100% 0, 100% 100%, 14% 100%);
	font-size: 2vw
}
.banner_sky_rat {
	position: absolute;
	z-index: 4;
	bottom: -10px;
	right: 150px;
	height: 200px;
	width: 400px;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: contain;
	border: 1px solid transparent;
	-webkit-transform: scaleX(-1);
	transform: scaleX(-1);
}
.wrapper {
	padding-bottom: 40px;
	background: #7db9e8;
	background: -moz-linear-gradient(top,  #7db9e8 0%, #7db9e8 0%, #1e5799 100%);
	background: -webkit-linear-gradient(top,  #7db9e8 0%,#7db9e8 0%,#1e5799 100%);
	background: linear-gradient(to bottom,  #7db9e8 0%,#7db9e8 0%,#1e5799 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7db9e8', endColorstr='#1e5799',GradientType=0 );
}
.content {
	max-width: 1100px;
	margin: auto;
	padding: 20px;
	background-color: #f2f2f2;
	border-radius: 0 0 20px 20px;
	overflow: auto
}
.content_block {
	clear: both;
	background-color: #fff0fe;
	padding: 20px;
	margin-bottom: 20px;
	background-position: center center;
	background-size: cover;
	border-radius: 10px;
	transition: .5s
}
.content_block:hover {
	transform: scale(1.02)
}
.content_block h2 { margin: 0 0 20px 0; font-size: 150%; }
.content .content_block:last-child { margin-bottom: 0 }
.table { display: table }
.row { display: table-row }
.cell { display: table-cell }
.full { width: 100% }
.appartment_list .cell {
	padding: 20px;
	background-color: #dedede;
	vertical-align: middle;
}
.appartment_list .cell { background-size: cover; background-position: center center }
.appartment_list .row .cell { border-bottom: 2px solid #f2f2f2 }
.appartment_list .row .cell:first-child {
	width: 30%;
	padding: 10%
}
.appartment_list h1,
.appartment_list h2,
.appartment_list h3,
.appartment_list h4,
.appartment_list h5,
.appartment_list h6 {
	font-size: 125%;
	margin: 0
}
/* Form styles */
.button,
.button:visited,
input[type=submit],
input[type=submit]:hover {
	text-decoration: none;
	display: table-cell;
	background-color: orange;
	color: white;
	text-decoration: none;
	text-transform: uppercase;
	padding: 8px;
	font-size: inherit;
	text-align: center;
	border-radius: 5px;
	cursor: pointer;
	transition: .5s
}
.button:hover { transform: scale(1.1) }
/* End of form styles */
.follow {
	display: block;
	position: absolute;
	right: 20px;
	bottom: -20px;
	white-space: nowrap;
	z-index: 10;
	white-space: nowrap
}
.follow a,
.follow a:visited {
	display: inline-block;
	height: 40px;
	width: 40px;
	border-radius: 3px;
	background-position: center;
	background-size: cover;
	margin-left: 10px;
	transition: .5s
}
.follow a:hover { transform: scale(1.1) }

.footer {
	max-width: 1100px;
	margin: auto;
	padding: 40px;
	color: #f2f2f2;
	text-align: center
}
.footer p { margin: 5px }
.footer a,
.footer a:visited {
	color: #ffd8a5;
	text-decoration: none
}
.footer a:hover { text-decoration: underline; color: white }
.footer_nav ul { margin: 0; padding: 0; list-style: none }
.footer_nav ul ul { display: none }
.footer_nav li { display: inline-block; padding: 0 10px 0 10px }
.mobile_nav { background-color: #225474; padding: 20px 0 20px 0; display: none }
.mobile_nav ul { margin: 0; padding: 0; list-style: none }
.mobile_nav a,
.mobile_nav a:visited {
	display: block;
	padding: 20px;
	color: white;
	font-weight: bold;
	text-decoration: none;
	text-transform: uppercase;
	text-align: center
}
.mobile_nav_trigger {
	display: none;
	background-image: url(/core/icons/menu.svg);
	padding: 15px;
	background-color: #0c375d;
	border: 10px solid #0c375d;
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
}
.mobile_nav_trigger_active {
	background-image: url(/core/icons/menu-up.svg);
}
#gallery {
	margin-bottom: 20px
}
.imageAlignFull {
	width: 100%;
	margin-bottom: 30px
}
.imageAlignLeft {
	float: left !important;
	margin: 0 30px 30px 0
}
.imageAlignRight {
	float: right !important;
	margin: 0 0 30px 30px
}
@media screen and (max-width: 1024px) {
	//body, html { background-color: black }
	img { max-width: 100%; height: auto }
	.content img { margin-bottom: 20px; border-radius: 20px }
	.banner_underlay,
	.banner_overlay,
	.banner_sky_rat,
	.follow,
	nav, nav ul { display: none !important }
	h1, h2, h3, h4, h5, h6 {
		font-size: 150%;
		margin-bottom: 30px;
		font-weight: bold
	}
	.top_logo div {
		background: #7db9e8;
		background: -moz-linear-gradient(top,  #7db9e8 0%, #7db9e8 0%, #1e5799 100%);
		background: -webkit-linear-gradient(top,  #7db9e8 0%,#7db9e8 0%,#1e5799 100%);
		background: linear-gradient(to bottom,  #7db9e8 0%,#7db9e8 0%,#1e5799 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7db9e8', endColorstr='#1e5799',GradientType=0 );
		color: white;
		font-size: 150%;
		padding: 20px;
		display: block;
		text-align: center;
		width: 100%
	}
	.banner { overflow: auto }
	.footer { padding: 20px }
	.content { border-radius: 0 }
	.wrapper { padding: 0 }
	.content_block {
		background-color: white;
		background-image: none !important;
		margin-left: -20px;
		margin-right: -20px;
		border-radius: 0
	}
	.content_block:hover { transform: none }
	.appartment_list .cell { padding: 10px; display: block }
	.appartment_list .row .cell:last-child { margin-bottom: 20px }
	.appartment_list .row .cell:first-child { width: 100%; padding: 30% }
	.mobile_nav_trigger { display: block }
}