/*------------------COOKIE-----------------*/
.infoCookie{
	opacity:0.2;
	z-index:100;
	position: fixed;
	background-color : rgba(0,0,0,1);
	width: 250px;
	right: 10px;
	top:10px;
	color: white;
	font-size: small;
	text-align: center;
	vertical-align : middle;
	
    transition : opacity 0.5s ease-in;
    -webkit-transition : opacity 0.5s ease-in;
}
.infoCookie:hover
{
	opacity:0.9;
}
/*------------------BODY----------------------------------*/
a {/*delete classic underline on url*/
    text-decoration : none;
    -webkit-text-decoration : none;/* Chrome, Safari, Opera */
}
body {
	background-color:rgb(255,92,92);
	background-image: url("chamonix-informatique.jpg");
	background-size:cover;
	background-repeat:no-repeat;
	background-attachment: fixed;
}
.Principale{
 	background-color:rgba(255,92,92,0.3);
	position:relative;
	min-width:800px;
	width : 50%;
	min-height:900px;
    margin-left : auto;
    margin-right : auto;
	text-align:center;
    font-family : 'Times New Roman',Calibri,Arial;
	color:white;
    border: solid 1px transparent;
	overflow:hidden;
	
    transition : box-shadow 0.5s ease-in,border 0.5s ease-in,background-color 0.5s ease-in;
    -webkit-transition : box-shadow 0.5s ease-in,border 0.5s ease-in,background-color 0.5s ease-in;
}
.Principale:hover{
 	background-color:rgba(255,92,92,0.9);
	box-shadow: 10px 10px 5px rgb(63,63,63);
    border: solid 1px black;
}
/*------------------HEADER-------------------------------*/
header {
	text-align: center;
	font-size:50px;
}
/*------------------PAGE-------------------------------*/
.coffee {
	position:absolute;
	left:-25px;top:50%;
	width:200px;
	border-radius:25px;
	
    transition : box-shadow 0.5s ease-in,width 0.5s ease-in;
    -webkit-transition : box-shadow 0.5s ease-in,width 0.5s ease-in;
}
.laptop {
	position:absolute;
	right:0px;top:100px;
	width:200px;
	
    transition : box-shadow 0.5s ease-in,width 0.5s ease-in;
    -webkit-transition : box-shadow 0.5s ease-in,width 0.5s ease-in;
}
.telephone {
	position:absolute;
	right:10%;bottom:100px;
	width:100px;
	
    transition : box-shadow 0.5s ease-in,width 0.5s ease-in;
    -webkit-transition : box-shadow 0.5s ease-in,width 0.5s ease-in;
}
.stylo {
	position:absolute;
	left:25px;top:30%;
	width:150px;
	-ms-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    transition : box-shadow 0.5s ease-in,width 0.5s ease-in;
    -webkit-transition : box-shadow 0.5s ease-in,width 0.5s ease-in;
}
.laptop:hover, .coffee:hover {
	width:250px;
}
.telephone:hover {
	width:150px;
}
.page .slogant{
	z-index:10;
	position:absolute;
	left:10%;right:10%;
	top:250px;
	font-size:40px;
	font-weight:bold;
	font-style:italic;
	-ms-transform: rotate(-10deg);
    -webkit-transform: rotate(-10deg);
    transform: rotate(-10deg);
}
/*------------------FOOTER-------------------------------*/
footer{
	position:absolute;
	bottom:10px;
	left:0;right:0;
	font: 20px bold italic;
	color:black;
}
footer .techInfo{
	font-size:small;
}
footer .techInfo a {
	text-decoration:none;
	color:black;
}