/*SCREEN WIDTH 81 REM (DESKTOP/LAPTOP)*/

#container	{
	max-width: 78rem;
	margin: 0 auto;
}	

/*PLACES (SECONDARY NAVIGATION)*/

.places	{
	width: 10.5rem;
	font-size: 100%;
	left: calc(50% - 39rem - 4px);
	border-left: 4px solid #21253e;
	border-right: 4px solid #21253e;
	top: 17rem;
}	

#logo	{
	width: 10.5rem;
	left: calc(50% - 39rem - 4px);
	border-left: 4px solid #21253e;
	border-right: 4px solid #21253e;
}

header	{
	margin-left: 10.5rem;
}

#banner	{
	width: 100%;
	max-width: 67.5rem;
	overflow: hidden;
	height: 15rem;
}	

#title	{
	width: 55%;
	position: absolute;
	left: 22.5%;
	top: 60%;
}

/*PRIMARY NAVIGATION*/

nav	{
	margin-left: 10.5rem;
	font-size: 100%;
	width: 67.5rem;
}

nav li	{
	padding: .8rem 2rem;
}

/*CONTENT*/

#content	{
	padding: 1rem 2rem;
	margin-left: 10.5rem;
}

h2	{
	font-size: 1.5rem;
}

h3, h4	{
	font-size: 1.2rem;
	
}	
/*THE WIDTH OF THE QUOTE AND H3 DEPENDS ON THE FIRST IMAGE ON THE PAGE (PORTRAIT OR LANDSCAPE)*/

#quote.wide	{
	width: calc(60% - 4rem - 4px);
}

h3.wide	{
	width: calc(60% - 2rem - 2px);
	clear: left;
}	

#quote.narrow	{
	width: calc(50% - 4rem - 4px);
}

h3.narrow	{
	width: calc(50% - 2rem - 2px);
	clear: left;
}

/*IMAGES*/	

figure.portrait	{
	width: 40%;
}	

figure.small	{
	width: 25%;
}
	
figure.landscape	{
	width: 50%;
}

/*OBJECT ZOOM (POP-UP WINDOWS)*/
.pop_up	{
	left: calc(50% - 28rem - 4px);
	right: calc(50% - 39rem);
	padding-left: 3rem;
	padding-right: 3rem;
}	

.standard 	{
	width: 60%;	
}	

/*IF HIGH-RESOLUTION IMAGE IS NOT AVAILABLE*/
.reduced	{
	width: 35%;
}	

/*FOOTER*/
footer	{
	margin-left: 12.5rem;
}