/*
	racoon-glisse.css
	Création: 18/10/2019
	Modification: 21/11/2019
	Description: 
	Camille FRONTON
*/

#racoon-glisse{
	width:400px;
	height:500px;
	margin-left:auto;/*margin-top:2em;*/
	margin-right:auto;
	background-color:#dbe2ff;
	display:block;
	
	padding:0.4em;
	overflow:auto;
	-webkit-border-radius: 0.5em;
	border-radius: 0.5em;
	-moz-border-radius: 0.5em;
}
#racoon-glisse h3{
	font-size:95%;
	margin:0px;
}
#racoon-glisse a{
	text-decoration:none;
	color:#70beef;
	font-size:110%;
	font-weight:bold;
	padding:0.4em;
	background-color:#696bd2;
	margin-top:0.2em;
	margin-bottom:0.2em;
}
#racoon-glisse a:hover{
	background-color:#7076ef;
	color:#efcd70;
}

#clickMoi,#clickMoi2,#clickMoi3{
	display:block;
}

#glisseMoi,
#glisseMoi2,
#glisseMoi3{
	margin-top:0.2em;
	margin-bottom:2em;
	width:95%;
	height:auto;
	background-color:#fff;
	margin-left:auto;
	margin-right:auto;
	padding:0.4em;
}

/*------------------------------ Responsive  ------------------------------------------*/
@media screen and (min-width:360px) and (max-width:768px){
		#racoon-glisse{
		width:100%;
		height:auto; /*500px;*/
		background-color:#dbe2ff;
		display:block;
		
		padding:0.4em;
		overflow:auto;
		-webkit-border-radius: 0.5em;
		border-radius: 0.5em;
		-moz-border-radius: 0.5em;
	}
	#racoon-glisse a{
		text-decoration:none;
		color:#70beef;
		font-size:105%;
		font-weight:bold;
		padding:0.2em;
		background-color:#696bd2;
		margin-top:0.2em;
		margin-bottom:0.2em;
	}
	#racoon-glisse a:hover{
		background-color:#7076ef;
		color:#efcd70;
	}
	
	#clickMoi,#clickMoi2,#clickMoi3{
		display:block;
	}
	
	#glisseMoi,
	#glisseMoi2,
	#glisseMoi3{
		margin-top:0.2em;
		margin-bottom:1em;
		width:95%;
		height:auto;
		background-color:#fff;
		margin-left:auto;
		margin-right:auto;
		padding:0.2em;
	}

}

/*
@media (min-width:481px) and (max-width:780px){
		#racoon-glisse{
		width:100%;
		/*height:500px;/
		background-color:#dbe2ff;
		display:block;
		
		padding:0.4em;
		overflow:auto;
		-webkit-border-radius: 0.5em;
		border-radius: 0.5em;
		-moz-border-radius: 0.5em;
	}
	#racoon-glisse a{
		text-decoration:none;
		color:#70beef;
		font-size:105%;
		font-weight:bold;
		padding:0.2em;
		background-color:#696bd2;
		margin-top:0.2em;
		margin-bottom:0.2em;
	}
	#racoon-glisse a:hover{
		background-color:#7076ef;
		color:#efcd70;
	}
	
	#clickMoi,#clickMoi2,#clickMoi3{
		display:block;
	}
	
	#glisseMoi,
	#glisseMoi2,
	#glisseMoi3{
		margin-top:0.2em;
		margin-bottom:1em;
		width:95%;
		height:auto;
		background-color:#fff;
		margin-left:auto;
		margin-right:auto;
		padding:0.2em;
	}

}
*/

.arrondi-Hautdroit{
	-webkit-border-top-right-radius: 0.5em 0.5em;
	border-top-right-radius: 0.5em 0.5em;
	-moz-border-radius-topright: 0.5em 0.5em;
}
.arrondi-Hautgauche{
	-webkit-border-top-left-radius: 0.5em 0.5em;
	border-top-left-radius: 0.5em 0.5em;
	-moz-border-radius-topleft: 0.5em 0.5em;
}
.arrondi-Basdroit{
	-webkit-border-bottom-right-radius: 0.5em 0.5em;
	border-bottom-right-radius: 0.5em 0.5em;
	-moz-border-radius-bottomright: 0.5em 0.5em;
}
.arrondi-Basgauche{
	-webkit-border-bottom-left-radius: 0.5em 0.5em;
	border-bottom-left-radius: 0.5em 0.5em;
	-moz-border-radius-bottomleft: 0.5em 0.5em;
}
.ombreBoite{
	box-shadow: 1px 1px 12px #555;
	-moz-box-shadow: 1px 1px 12px #555;
	-webkit-box-shadow: 1px 1px 12px #555;
}