@import "_normalize.css";
@import "_info-block.css";
@import "_menu.css";

:root {
	--pict-width: 320px;
	--pict-height: 240px;
	--max-width: 1280px;
}

body
{
	padding: 0 5%;
	margin: 0 auto;
	max-width: var(--max-width);
}

.SiteTitle1 
{
	font: 13.4pt/18pt 'Futura PT','Fira Sans',sans-serif;
	text-align: center;
	margin: 16pt 0 0 0;
	text-transform: uppercase;
}

.SiteTitle2
{
	font: 24pt/24pt 'Futura PT','Fira Sans',sans-serif;
	text-align: center;
}

.SiteTitleLic
{
	text-align: center;
	font: 12pt/14pt 'Futura PT','Fira Sans',sans-serif;
	margin: 16pt auto;
	max-width: 1024px;
}

.Logo
{	
	text-align: center;
	overflow: hidden;
	margin-top: 16px;
}

.logo-img
{
	height: 128px;
}

.footer
{
	font: 13.4pt/18pt 'Futura PT','Fira Sans',sans-serif;
	text-align: center;
	margin: 32px auto;
}

.footer p
{
	margin: 0;
	padding: 0;
}

.page-caption
{
    font-size: 20pt;
    font-weight: 600;
    margin: 16px auto;
    text-align: center;
}

.invisible
{
	display: none;
}

@media (orientation: portrait) {
	a.ApartsListItem
	{
		width: 100%;		
		margin: 1pt;
	}	
	a.msg-link img
	{
		width: 64px;
	}
	.phone-link
	{
		color: #FFF;
		font: 20pt/28pt 'Futura PT','Fira Sans',sans-serif;		
	}
	.MainArea
	{
		grid-template-areas: 
		"maMenu"
		"maList"	
		;	
		grid-auto-rows: auto;	
		grid-auto-columns: auto;
	}
	.maMenuBar
	{		
		width: 100%;
		grid-template-areas:
		"mgItem mgItem mgItem"
		"mgItem mgItem mgItem"
		"mgItem mgItem mgItem"
		"mgItemBtn mgItemBtn mgItemBtn"
		;
		/*grid-template-columns: repeat(1, 1fr);*/
	}
	.maApartsList
	{
		width: 100%;
	}
	.HeaderText
	{
		font-size: 20pt;
		margin-bottom: 12pt;
	}
	.FrmLabelCaption
	{
		font: bold 12pt/14pt "trebuchet ms", arial;
	}
	.FrmField
	{
		margin: 0 0 16pt 0;		
	}
	table.ApartInfoTbl2 td 
	{
		padding: 0 6pt;
	}
	@media (max-width: 400px) {
		.maMenuBar
		{		
			width: 100%;
			grid-template-areas:
			"mgItem mgItem"
			"mgItem mgItem"
			"mgItem mgItem"
			"mgItem mgItem"
			"mgItem mgItem"
			"mgItemBtn mgItemBtn"
			;
			/*grid-template-columns: repeat(1, 1fr);*/
		}
	}
}
 
@media (orientation: landscape) {
	@media (max-width: 1400px) {
		a.ApartsListItem
		{
			width: calc(100% / 2 - 24px);
		}
		.MainArea
		{
			display: grid;
			grid-template-areas: 
			"maMenu maList maList maList"	
			"maMenu . . ."	
			"maMenu . . ."	
			;	
			grid-auto-rows: auto;	
			grid-auto-columns: 25%;
		}
	}

	@media (max-width: 900px) {
		a.ApartsListItem
		{
			width: 100%;
		}
		.MainArea
		{
			display: grid;
			grid-template-areas: 
			"maMenu maList maList"	
			"maMenu . ."	
			"maMenu . ."	
			;	
			grid-auto-rows: auto;	
			grid-auto-columns: 33%;
		}
	}
}