/* reset */

html, body, .page, .main, header { border: 0; padding: 0; margin: 0; }
html, body{ min-height: 100%; }

body * { box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; }
#colorbox { box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box; }


/****************************************************************

	PAGE GENERALE
	
*****************************************************************/

/* Commun */

.page { padding: 50px 2%; }
.wrapper { clear: both; float: left; width: 70%; overflow: hidden; }
.content { min-height: 350px; }
.aside { float: right; width: 25%; overflow: hidden; margin-top: 0px; }


/* Pages cartes */

.page_carte .page {
	position:absolute;
	top: 51px; bottom: 0;
	right: 0; width: 300px;
	overflow: hidden;
	z-index: 2;
	padding: 0;
	background: #FAFAFA;
	box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, .2);
}
.page_carte .page:hover{ overflow: auto; }

.page_carte .page .main, .page_sommaire .page .footer { padding: 20px; padding-right: 10px; width: 280px; }
.page_carte .wrapper, .page_sommaire .aside { float: none; width: 280px; padding-right: 20px; }

.page_carte .page{ display: none; }
.page_carte #carte {
	position:absolute;
	top: 50px; bottom: 0;
	right: 0; left: 0;
	z-index: 1;
}


/* Page camera */


#documents_portfolio li {
	display: inline;
	}


/* Page sommaire */

.page_sommaire .page { display: block; }
.page_sommaire #carte { top: 50px; bottom: 0; right: 300px; left: 0px;}
	

/* elements de contenu */

.main h1 { border-bottom: solid 1px #DDD; }

.arbo { font-size: 12px; color: #999; }
.arbo strong, .arbo a { font-weight: normal; color: #999; text-decoration: none; }
.arbo a:hover { text-decoration: underline; }


/* footer */

.footer{
	margin-top: 3em; margin-bottom: 1em; padding-top: 1em;
	border-top: solid 1px #DDD;
}


/* Media queries page */

@media screen and (max-width: 960px) {
	/* une seule colonne pour le contenu */
	.aside { width:100%; float: left; padding-left: 0 !important;}
	.wrapper { width: 100%; float: left; }
}

@media screen and (max-width: 640px) {
	.page_sommaire .page { display:none; }
	.page_sommaire #carte { right: 0px; }
}

@media screen and (orientation:landscape) and (max-width: 480px) { 
	.page_sommaire #carte, .page_carte #carte{ left: 50px; top: 0px; }
	.page { padding: 10px; padding-left: 60px;}
}