@import url("https://fonts.googleapis.com/css?family=Nunito:400,700");

html{
	height:100%;
	tab-size:4;
}

body{
	font-family: "Nunito", sans-serif;
	color: #666666;
	min-height: 100%;
	margin:0px;
	padding:0px;
}


#header{
	background-color: #fc6736;
	height: 130px;
	display: grid;
	grid-template-columns: 20% 80%;
}

#logo{
	padding:20px;
	display:flex;
	grid-column:1;
}

#title-banner{
	grid-column:2;
	text-align: center;
	display: flex;
}

#title-box{
	margin: auto;
	margin-left: 20%;
	text-align: center;
}

.main-title{
	font-size: 2rem;
	font-weight: 600;
	color: #FFFFFF;
}

.subtitle{
	font-size: 1.25rem;
	font-style: italic;
	font-weight: 400;
	color: #FFFFFF;
}

#main-box{
	min-height: 100%;
	display:grid;
	grid-template-columns: auto 340px
}

#aside{
	position: fixed;
	right: 0px;
	top: 130px;
	height: auto;
	overflow: auto;
	max-height: calc(100vh - 130px);
	width: 300px;
	padding: 40px;
}

#aside a{
	color:#888888;
}

.aside-box{
	/*border: solid 1px #666666;*/
	box-shadow: 0 2px 3px rgba(10,10,10,.1),0 0 0 1px rgba(10,10,10,.1);
	margin-bottom: 40px;
}
.aside-title{
	background-color: #fc6736;
	padding: 10px;
	color: #FFFFFF;
	font-size: 1.25rem;
	text-align: left;
	font-weight: bold;
}

.aside-content{
	padding: 10px;
	color:#888888;
	font-size: 1rem;
	overflow: auto;
}

#main-content{
	min-height: 100%;
	overflow: auto;
	grid-column:1;
	padding:40px;
}


/* #fc6736; /*Orange*/
/* #58302a; /*Maron*/
/* #d9d84c; /*Jaune*/
/* #af3094; /*Violet*/
/* #4db79b; /*Vert*/
/* #24b9ff; /*Bleu*/



/*.objectifs > .block-content > p > a, .reminder > .block-content > p> a, .summary > .block-content > p> a,  .additional >.block-content > p > a{
    color: #FFFFFF;
}*/

.block a, .block a:hover{
    color: #FFFFFF;
    background-color: 	inherit;
    text-decoration: underline
}
.block.null a, .block.null a:hover {
    color: #6060A0;
    background-color: 	inherit;
    text-decoration: underline
}

.example a, .example a:hover{
    color: #000000;
    background-color: 	inherit;
    text-decoration: underline
}

.block h5 a, .block h5 a:hover {
	color: #FFFFFF;
    text-decoration: none;
}

.block.null h5 a, .block.null h5 a:hover {
    color: #6060A0;
    text-decoration: none;
}


.objectifs{
	background-color: #fc6736; /*Orange*/
	color: #ffffff;
}

.objectifs code{
    color: #DDDDDD;
}

.example{
	background-color: #DEDEDE;/*#d9d84c; /*Jaune*/
	color: #444444;
}

.example code{
    color: #222222;
}

.exercise{
	background-color: #58302a; /*Maron*/
	color: #FFFFFF;
}

.exercise code{
    color: #DDDDDD;
}

.answer{
	background-color: #909090;/*#4db79b; /*Vert*/;
	color: #000000;
}

.answer code{
    color: #222222;
}

.summary{
	background-color: #fc6736; /*Orange*/
	color: #FFFFFF;
}

.summary code{
    color: #DDDDDD;
}


.help{
	background-color: #909090;/*#af3094; /*Violet*/
	color: #FFFFFF;
}

.help code{
	color: #EEEEEE;/*#0099FF;*/
}

.reminder{
	background-color: #fc6736;/*#24b9ff; /*Bleu*/
	color: #ffffff;
}

.reminder code{
    color: #DDDDDD;
}

.note{
	background-color: #909090;/*#24b9ff; /*Bleu*/
	color: #444444;
}

.note code{
    color: #222222;
}

.sandfirst{
	background-color: #fc6736; /*Orange*/
	color: #FFFFFF;
}

.sandfirst code{
    color: #DDDDDD;
}

.additional{
	background-color: #fc6736;/*#af3094; /*Violet*/
	color: #FFFFFF;
}

.additional code{
    color: #DDDDDD;
}

.table{
	background-color: #999999;
	color: #000000;
}

.table code{
    color: #222222;
}

.figure{
	background-color: #999999;
	color: #000000;
}

.close{
	color: #FFFFFF;
}

.close:hover{
	color: #FFFFFF;
}

#footer{
	text-align: center;
}

.modal-content{
	overflow: auto;
	height: auto;
	max-height: 90vh;
}
		
	
	
.sourceCode code {
    color : #333333;
}
		
a, a:hover {
    color: #6060A0;
    text-decoration: none; 
    background-color: 	inherit;
    text-decoration: underline
}

html [type="button"] {
    -webkit-appearance: none;
}