#thesvg
{
	overflow: auto;
	margin-top: 2em;
	margin-bottom: 2em;
}

.alert{
	background: #ffeff0;
}

.code-block {
	font-family: monospace;
	background: #effff0;
}
.code-block-err {
	font-family: monospace;
	background: #ffeff0;
}

.hide{
	display: none;
}

.grabbable {
	cursor: move;
	cursor: -moz-grab;
	cursor: -webkit-grab;
	cursor: grab;
	max-height: 1200px;
}

.icons svg {
	display: inline;
	width: 24px;
	height: 24px;
}

.social svg{
	fill: white;
	margin-left: 1em;
}

.social {
	display: inline;
	float: right;
}


/*
.zoomable {

	transition: transform .3s;
	transform-origin: left top;
}

.grabbable:active {
	cursor: -moz-grabbing;
	cursor: -webkit-grabbing;
	cursor: grabbing;
}
*/

:root{


	--esiee-blue: #004682;
	--esiee-dark-blue: #0f273b;
	--esiee-red: #d2213c;
	--esiee-pink: #e83583;
	--esiee-orange: #ef7d00;
	--esiee-yellow: #fbba00;
	--esiee-dark-green: #00936e; /* RGB(0, 147, 110) */ 
	--esiee-green: #92c56e;
	--esiee-purple: #8b4a97; /* RGB(139, 74, 151) */
	--esiee-blue-cyan: #1eafd0; /* RGB(30, 175, 208) */
	--esiee-blue-sky: #0097d7; /* RGB(0, 151, 215) */

	 /*font-family: 'TT Norms Regular'; */

	--shadow-box-color: var(--esiee-blue);	
	--h1-color:  var(--esiee-blue);
	--h2-color:  var(--esiee-blue);
	--h3-color:  var(--esiee-red);
	--h4-color:  var(--esiee-blue);
}


.content h1{
	color: var(--h1-color);
       	opacity: 0.6;	
}
.content h2{
	color: var(--h2-color);
}
.content h3{
	color: var(--h3-color);
}
.content h4{
	color: var(--h4-color);
}

/*
@font-face {
	font-family: 'TT Norms Regular';
	font-style: normal;
	font-weight: normal;
	src: local('TT Norms Regular'), url('fonts/TTNorms-Regular.otf') ;
}

*/

/* le milieu */
.content {
	max-width: 1250px;
	box-shadow: 2px 2px 8px 0 var(--shadow-box-color) ;
	margin-top : 10px;
	margin-bottom : 10px;
	margin-left: auto;
	margin-right: auto;
	padding: 10px;
	min-width: 0;
	flex-grow: 1;

}


/* la barre de titre */
#header {
/*	background-color:      var(--esiee-blue);*/
	color : white;

	height: 61px;
	width: 100%;
	padding: 0 0 0 0 ;	
	margin: 0 0 0 0 ;

	background-image: url("eiffel-bg-top.jpg");

/*	opacity:1;*/

	position: fixed;
	top: 0;
	
	box-shadow: 0px 0px 0px 0 var(--shadow-box-color) ;
	z-index:2;
}
#header .content{
	border: none;
	box-shadow: 0 0 0 0  ;
	font-size: 30px;
	font-weight:bold;
	padding:0;
	align-items: center;
}
#header2 .content{
	border: none;
	box-shadow: 0 0 0 0  ;
	font-size: 20px;
	padding:0;
}
#header2 {

	z-index:1;

	background-image: url("eiffel-bg-bottom.jpg");
	height: 61px;

/*	background-color:      var(--esiee-pink);*/
	color : white;
	
	padding-top: 0px;
	padding-bottom: 1px;
	
	margin: 0;
	margin-bottom: 20px;

	opacity:1;

	position: absolute;
	top: 61px;
	width: 100%;
}

#maincontent{

	height: 150%;
/*	position:absolute;
	top: 130px;
	bottom: 61px;
*/
	margin-top: 150px;
	margin-bottom: 150px;

}

body{
	padding: 0;
	margin: 0;
}

textarea{
	width: 100%;
}

#footer {
	background-color:      var(--esiee-dark-blue);
	color : white;
	padding-top: 5px;
	padding-bottom: 5px;
	margin: 0;
	margin-top: 10%;
	position: fixed;
	width: 100%;
	bottom: 0;
	
}
#footer a {
	text-decoration: none;
}
#header2 a {
	text-decoration: none;
}

#footer .content{
	border: none;
	box-shadow: 0 0 0 0  ;
}



#lastmod {
	opacity: 0.6;
	margin-top: 4em;
	margin-bottom: 2em;
}


ul{

	list-style-image: url("arrow-right-6.png");	

}