/* GLOBAL HTML LAYOUT
=============================================================================*/

html {
	font-size: 8pt;
	-webkit-font-smoothing: antialiased;
	-webkit-text-size-adjust: none; /* avoid text resize on iOS */
}

body {
	margin: 0;
	padding: 0;
	
	color: #222;
	font-family: 'customFont', 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif;
	
	background-color: #eee; 
	overflow-x: hidden;
}

a {	color: inherit;	text-decoration: inherit; }

.hidden { display: none; }

/* ELEMENTS
=========================================================*/

#container {
	position: fixed;

	left: 0;
	right: 0;
	bottom: 0;

	overflow-y: scroll;
	overflow-x: hidden;
}

#page {
	margin: 0px auto 0px;
	box-shadow: 0 0 10px rgba(0,0,0,0.5);

	transform-origin: 0 0;
	-webkit-transform-origin: 0 0;
}

article {
	position: relative; 		
	cursor: pointer;
}

article::before {
	opacity: 0;
	content: '';
	position: absolute;
	
	top: 5px;
	left: 0;
	right: 0;
	bottom: 5px;

	border: 1px solid #06A;
	border-radius: 1px;

	background-color: rgba(0,0,0,0.05);
	background-size: 1.5cm 1.5cm;
	background-repeat: no-repeat;
	background-position: center center;
	
	background-image: url('../images/tools_minus.svg');
	
	border-radius: 5px;
}

article.summary::before {
	background-image: url('../images/tools_plus.svg');
}

article:hover::before {
	opacity: 0.5;
}