/*
	Feuille de style pour index.html
	Auteur : Pascal Guibert
	Date : 26 / 09 / 2011
	Maj : 05 / 12 / 2013
	Maj : 26/ 06 / 2022
*/
/*
@font-face {
	font-family: "Audiowide-Regular";
	src: url('Audiowide-Regular.ttf');
}
@font-face {
	font-family: "BlackOpsOne-Regular";
	src: url('BlackOpsOne-Regular.ttf');
}
@font-face {
	font-family: "Peralta-Regular";
	src: url('Peralta-Regular.ttf');
}
@font-face {
	font-family: "PressStart2P-Regular";
	src: url('PressStart2P-Regular.ttf');
}
@font-face {
	font-family: "RubikMoonrocks-Regular";
	src: url('RubikMoonrocks-Regular.ttf');
}
@font-face {
	font-family: "Tourney-Medium";
	src: url('Tourney-Medium.ttf');
}
@font-face {
	font-family: "Tourney-Thin";
	src: url('Tourney-Thin.ttf');
}
*/

@font-face {
	font-family: "ReggaeOne-Regular";
	src: url('ReggaeOne-Regular.ttf');
}

/*
@font-face {
	font-family: "Ubuntu-Regular";
	src: url('Ubuntu-Regular.ttf');
}
*/


body { 
	background-position:0px 0px;
	background-repeat:repeat;
	background-image:url('../images/geek.jpg');
	background-size:100%;
}
header, article { display:block; }

a { text-decoration:none; }
img { border:none; }

h1,h2,h3 { font-family: ReggaeOne-Regular,Verdana,Arial,sans-serif; }
h1 { font-size:1.5em; }
h2 { font-size:1.2em; }
h3 { font-size:1em; }

ul { list-style: square; }

/* Noel */
.noel { display:none; }
.noel_actif { display:initial; }

/*Page*/

#informatique { 
	max-width:44em;
	margin: 0.5em;
	padding: 0.4em;
	float: left;
}
#informatique > header > a { display:table; width:100%;}
#informatique > header > nav { display:none; }
#informatique > header > a > h1 { display:table-cell; padding:0em 0.5em; vertical-align:middle; }
#informatique > header > div > p { margin:1em 1em; }


#logo { 
	transition:all 1000ms ease 1000ms;
	transform: rotate(0deg);
	width:6em; 
	position:relative;
	top:0em;
	left:0em;
}
#logo:hover {	
	transition:all 1000ms ease 0ms;
	transform: rotate(40deg);
	top:2em;
	left:2em;
}

/* accordion */
#accordion header {
	border-top-right-radius: 2em;
}

/* Correction jqueryUI accordion */
.ui-accordion .ui-accordion-header-icon { position: absolute; left: .5em; top: 50%; margin-top: -8px;}
.ui-accordion h2 {padding-left: 1.5em; margin: 0.3em;}
.ui-accordion ul {padding-left: 2em;}

/* Article alignement image */
#informatique #article1 img { float: right; width: 8em; }
#informatique #article2 img { float: right; width: 8em; }

/* Taille Carte Openstreet */
#informatique #article3 #map_canvas { width:100%; height:25em; }


/* Carte de Visite */
#carteV { width:100%; max-width:320px; float:right; margin-bottom:1em; }

/* Contacts */ 
#article5 > a { margin:0.5em 0; }
#a3 { display: none; }

/* Nav Langues */
#article7 > nav  { text-align:right;}
#article7 > nav  img { height:2.5em;  margin-top:1em}

/* Mentions légales */
#dialog img { float: right; width: 8em; }

/* ASIDE latérale */

aside > nav { display:none; }
aside h2 { margin-left: 1em; }
aside article { 
	margin: 0.5em 0.5em;
	padding: 0.2em;
	max-width: 100%;
	width: 22em;
	float: left;
}
/*
aside > article { 
	margin:1em 1em; 
	padding:0.2em; 
	max-width:22em; 
	float:left; 
	box-shadow:5px 5px 10px #000; 
}
*/

/* Barre des applis libres */

aside > article#barre_appli > div  { display:table; font-weight:bold; font-size:0.6em;}
aside > article#barre_appli > div > a{ float:left;text-decoration:none;}
aside > article#barre_appli > div > a > figure {text-align:center;width:7em;margin:0em;padding:0.8em;}
aside > article#barre_appli > div > a > figure > img {height:5em;}


/* Barre des Amis */

aside > article#barre_amis > header { 
	background-image: url(../images/oiseaux.png),linear-gradient(to bottom, rgba(150,150,150,0.5) 35%, rgba(70,70,70,0.5) 65%);
	background-repeat:no-repeat;
	background-size:100%;
	background-clip:border-box;
}
aside > article#barre_amis ul { padding-left: 1.3em; font-size: 0.9em; } 
aside > article#barre_amis  a:hover{ color: orange}

/* Switcher de thèmes */

.switcher {float:left; margin:0.5em;}

.switcher > button { margin:0.5em 0em; }

@viewport {
   width: device-width; /* largeur du viewport */
   zoom: 1; /* zoom initial à 1.0 (et clin d'oeil aux fans d'IE6/7) */
}


@media (max-width: 640px) {
	* {
		box-sizing: border-box;
	}
	
	/* passer body (et tous les éléments de largeur fixe) en largeur automatique */

	body {
		width: auto;
		margin: 0.2em;
		padding: 0em;
	}
	
	h1 { font-size:1.3em; }
	
	#informatique { 
		max-width:100%;
		margin: 0.5em 0em;
	}
	
	.ui-accordion .ui-accordion-content {
		padding: 1em;
	}
	
	#a3 { display: inline-block; }
	
	aside article { 
		margin: 0.5em 0em;
	}
	
}

@media (max-device-width:768px) and (orientation: landscape) {

	html {
		-webkit-text-size-adjust: 100%;
		-ms-text-size-adjust: 100%;
	}
  
	#informatique { 
		max-width:100%;
		margin: 0.5em 0em;
	}
	
	#a3 { display: inline-block; }
	
}



/*  Modification Thème Jquery UI  */

.ui-widget {
	font-family: Verdana,Arial,sans-serif;
	font-size: 1em;
}
.ui-widget .ui-widget {
	font-size: 0.9em;
}

/* Misc visuals
----------------------------------*/

/* Corner radius */
.ui-corner-all,
.ui-corner-top,
.ui-corner-left,
.ui-corner-tl {
	border-top-left-radius: 2em;
}
.ui-corner-all,
.ui-corner-top,
.ui-corner-right,
.ui-corner-tr {
	border-top-right-radius: 2em;
}
.ui-corner-all,
.ui-corner-bottom,
.ui-corner-left,
.ui-corner-bl {
	border-bottom-left-radius: 2em;
}
.ui-corner-all,
.ui-corner-bottom,
.ui-corner-right,
.ui-corner-br {
	border-bottom-right-radius: 2em;
}
