:root {
  --main-bg-color: #f1ffed;
}

html{
	background-color:var(--main-bg-color);
	padding-top:10px;
	font-size:100%;
}

body { 
	max-width:1200px;
    margin: 0 auto; 
	font-size:1em;
}
.wrap-calendar{
	margin: 0 auto; 
	width:100%;
	max-width: 900px;
	float:left;
}
.calendar{
	width:100%;
	display:table;
	border-collapse: separate;
	border-spacing: 4px;
}
.row{
	width:100%;
	margin-bottom:3px;
	display:table-row;
}
.day{
	width:14.28%;
	display:table-cell;
	border-radius:5px;
	background-color:#ffffff;
	border: 1px solid #c70923;
	height:70px;
	color:#FFFFFF;
	padding-bottom:3px;
}
.today{
	background-color: #ffd3d3;
}

.otherMonth{
	background-color: #DDDDDD;
	border-color: #666666;
}

.day-title{
	width:14.28%;
	border-radius: 5px;
	display:table-cell;
	font-weight: bold;
	background-color:#9c000d;
	text-align:center;
	color:#FFFFFF;
}

.day-nb{
	width:100%;
	text-align:center;
	background-color: #c70923;
	cursor:pointer;
}

.day-nb.otherMonth{
	background-color: #AAAAAA;
}
.day-nb.selected{
	background-color: #fef200;
	color: black;
}


.CACA{
	background-color:#fc000f;
}
.JM{
	background-color:#00EE00;
}
.VE{
	background-color:#0000FF;
}
.FE{
	background-color:#000000;
}
.event{
	width:100%;
	margin-top:2px;
	font-size:0.8em;
	cursor:pointer;
}
.event span{ 
	display:block;
	margin-left : 5px;
}
.start{
	width:95%;
	margin-left:5%;
	border-top-left-radius:5px;
	border-bottom-left-radius:5px;
}
.end{
	width:95%;
	margin-right:5%;
	border-top-right-radius:5px;
	border-bottom-right-radius:5px;
}
.start.end{  
	width:90%;
	margin-left:5%;
	margin-right:5%;
	border-radius:5px;
}
.legende{ 
	float:left;
	margin: 0px 2px 2px 0px ;
	padding: 3px ;
	border: 1px solid #DDDDDD; 
	border-radius:5px;
	cursor:pointer;
}
.legende.check{
	background-color:#DDDDDD;
}

.etiquette{
	width:20px;
	height:8px;
	border-radius:4px;
	display: inline-block;
	margin:2px;
}

.clear{
	clear:both;
}

.number{
	width:50px;
	appearance: none;
}

input.saveBtn{
	padding:3px;
	max-width:300px;
}

.list{
	float:left;
}
.dateModify{
	color:#777777;
}
.list textarea{
	width:100%;
	resize: none;
	
}