@charset "UTF-8";
/* CSS Document */

.ui-header h1.ui-title { font-variant: small-caps; margin: .6em 10% .8em; font-size: 20px; text-shadow: 2px 2px 4px #555; }
.ui-footer .ui-title { margin-bottom: .0em; }

h2 { text-align: center; }
h4 img { vertical-align: middle; padding-bottom: 5px; padding-left: 20px; }
.ombre { margin-top: 10px;
	filter: progid;
	zoom: 1;
	webkit-box-shadow: 1px 1px 12px #555;
	moz-box-shadow: 1px 1px 12px #555;
	box-shadow: 1px 1px 12px #555;
	border: 10px solid #FFF;
}
p.image { text-align: center; }
a { text-decoration: none; }
.ui-header-fixed > .ui-btn-icon-notext, .ui-header-fixed.ui-fixed-hidden > .ui-btn-icon-notext { top: 12px; }

/* *** Menu *** */
ul.menu { list-style: none; padding-left: 0; }
ul.menu li { display: block; float: left; }
ul.menu li div { display: table-cell; height: 620px; width: 497px; vertical-align: middle; text-align: center; }
ul.menu li img { margin: 10px; }
.ui-mobile a img.ombre { border-width: 10px;
	webkit-box-shadow: 1px 1px 12px #AAA;
	moz-box-shadow: 1px 1px 12px #AAA;
	box-shadow: 1px 1px 12px #AAA;
}
.menu li h5 { font-size: 16px; margin: 5px; }

ul.menu4 li div { height: 300px; }
ul.menu6 li div { height: 300px; width: 330px; }
.ui-popup p { font-size: 12px; }
div.ps-toolbar, div.ps-caption {
	color: #000;
	text-shadow: 2px 2px 4px #555;
	background: -webkit-gradient(linear, left top, left bottom, from( #FFFFFF /*{b-bar-background-start}*/), to( #bfbfbf /*{b-bar-background-end}*/));
	background: -webkit-linear-gradient( #FFFFFF /*{b-bar-background-start}*/, #bfbfbf /*{b-bar-background-end}*/);
	background: -moz-linear-gradient( #FFFFFF /*{b-bar-background-start}*/, #bfbfbf /*{b-bar-background-end}*/);
}

/* *** Plan *** */
#geo .ui-content, #geo-centre .ui-content { padding: 10px; }
.plan { float: left; position: relative; width: 748px; height: 615px; }
.plan img { position: absolute; top: 0; left: 0; }
ul.menu-geo { float: right; width: 180px; }
ul.menu-geo li { display: list-item; float: none; text-align: right; }
.ui-body-b a.ui-link.zone.on, .ui-body-b a.ui-link.zone.on:visited { color: #7cc4e7; }
.legende { position: absolute; bottom: 50px; right: 10px; width: 220px; font-size: 11px; text-align: right; }
#geo-centre .legende { left: 10px; text-align: left; width: 440px; }
#geo-centre ul.menu-geo { margin-top: 0; }
#geo-centre ul.menu-geo li h5 { font-size: 12px; }
.boule { width: 18px; height: 18px; position: absolute; top: 0px; left: 0px; z-index: 1000; display: none; background: url("../images/boule.png") center no-repeat; }

/* *** Crédits *** */
#credits .ui-grid-b { width: 80%; margin: auto; }
#credits .ui-grid-b p { font-size: 14px;; }
#credits .ui-grid-b .ui-block-b p.center { text-align: center; }
#credits .ui-grid-b.bloc1 .ui-block-c p { margin-top: 65px; }
#credits .ui-grid-b.bloc2 .ui-block-c p { margin-top: 25px; }
#credits .ui-grid-b .ui-block-c {  }

@media only screen and (orientation:portrait) {
   /* portrait styles here */
	ul.menu li div { height: 310px; width: 720px; }
	ul.menu4 li div { height: 400px; width: 360px; }
	ul.menu6 li div { height: 280px; width: 360px; }
	ul.menu-geo { float: left; width: auto; }
	ul.menu-geo li { display: block; float: left; text-align: left; width: 242px; }
	#geo-centre ul.menu-geo { margin-top: 10px; margin-bottom: 0; }
	#geo-centre ul.menu-geo li { width: 180px; }
	#geo-centre .legende { right: 10px; text-align: right; left: auto; }
	#credits .ui-grid-b h3 { margin-top: 100px; }
}
@media only screen and (max-device-width: 480px) {
    /* iPhone CSS rules here */
	.ui-content { padding: 5px; }
	.ui-header-fixed > .ui-btn-icon-notext, .ui-header-fixed.ui-fixed-hidden > .ui-btn-icon-notext { top: 7px; }
	.ui-header h1.ui-title { font-size: 16px; }
	.ui-footer .ui-title { margin: .3em 15px .4em; font-size: 12px; }
	.ui-footer img { zoom: .5; }
	.ui-mobile a img.ombre { border-width: 5px; }
	ul.menu { margin: 0; }
	#home ul.menu { margin: auto; width: 300px; }
	ul.menu li div { height: 200px; width: 300px; }
	ul.menu li div img { height: 165px; width: 200px; margin: 0; }
	ul.menu4 { margin-top: 60px; }
	ul.menu4 li div { height: 160px; width: 155px; vertical-align: text-top; }
	ul.menu4 li div img { height: 89px; width: 140px; }
	ul.menu6 li div { height: 140px; width: 155px; }
	ul.menu6 li div img { height: 89px; width: 140px; }
	.plan { zoom: .4; }
	ul.menu-geo { width: 300px; }
	ul.menu-geo li { display: block; float: left; text-align: left; width: 100px; }
	ul.menu-geo li h5 { font-size: 12px; }
	#geo-centre ul.menu-geo { margin-top: 0; margin-bottom: 10px; }
	#geo-centre ul.menu-geo li { width: 150px; }
	.legende { position: absolute; bottom: 30px; right: 10px; width: 300px; font-size: 11px; text-align: right; }
	#geo-centre .legende { width: 250px; }
	.boule { width: 24px; height: 24px; background-size: 150%; }
	#credits .ui-grid-b { width: 100%; }
	#credits .ui-grid-b h3 { font-size: 12px; margin-top: 30px; }
	#credits .ui-grid-b h4 { font-size: 10px; }
	#credits .ui-grid-b p { font-size: 10px; }
	#credits .ui-grid-b p a { font-size: 9px; }
	#credits .ui-grid-b img { zoom: .4; }
	#credits .ui-grid-b.bloc1 .ui-block-c p { margin-top: 10px; }
	#credits .ui-grid-b.bloc2 .ui-block-c p { margin-top: 10px; }
}
@media only screen and (max-device-width: 480px) and (orientation:landscape) {
	#home .ui-content { padding: 35px 15px 15px 15px; }
	#home ul.menu { margin: auto; width: 440px; }
	ul.menu li h5 { font-size:12px; }
	ul.menu li div { height: 150px; width: 220px; }
	ul.menu li div img { height: 124px; width: 150px; margin: 0; }
	ul.menu4 { margin: auto; width: 470px; margin-top: 20px; }
	ul.menu4 li div { height: 120px; width: 235px; vertical-align: text-top; }
	ul.menu4 li div img { height: 89px; width: 140px; }
	ul.menu6 { margin: auto; width: 465px; }
	ul.menu6 li div { height: 140px; width: 155px; }
	ul.menu6 li div img { height: 89px; width: 140px; }
	ul.menu-geo { width: 160px; }
	ul.menu-geo li { width: 80px; }
	.legende { width: 160px; }
	#credits .ui-grid-b h3 { margin-top: 5px; margin-bottom: 5px; }
	#credits .ui-grid-b h4 { margin: 0; }
	#credits .ui-grid-b p { margin: 0; }
	#credits .ui-grid-b.bloc2 .ui-block-c p { margin-top: 0; }
}

@media screen and (device-height: 568px) and (-webkit-min-device-pixel-ratio: 2) {
    /* iPhone 5 only */
	#home ul.menu { margin-top: 40px; }
	#geo ul.menu-geo { margin-top: 40px; }
}

@media screen and (device-height: 568px) and (-webkit-min-device-pixel-ratio: 2) and (orientation:landscape) {
    /* iPhone 5 only */
	#home ul.menu { margin-top: 20px; }
	#geo ul.menu-geo { margin-top: 0; }
}

/* *** Galerie *** */
.gallery { list-style: none; padding: 0; margin: 0; }
.gallery:after { clear: both; content: "."; display: block; height: 0; visibility: hidden; }
.gallery li { float: left; width: 142px; height: 100px; text-align: center; }
.gallery.medium li { float: left; width: 247px; height: 180px; }
.gallery li a { display: block; margin: 5px; text-align: center; }
.gallery li img { display: block; width: auto; height: auto; margin: auto;
	filter: progid;
	zoom: 1;
	webkit-box-shadow: 1px 1px 12px #555;
	moz-box-shadow: 1px 1px 12px #555;
	box-shadow: 1px 1px 12px #555;
	border: 5px solid #FFF;
 }

@media only screen and (orientation:portrait) {
   /* portrait styles here */
	.gallery li { width: 147px; }
	.gallery.medium li { float: left; width: 245px; height: 180px; }
}
@media only screen and (max-device-width: 480px) {
	.gallery li { width: 155px; }
	.gallery.medium li { width: 300px; }
}
@media only screen and (max-device-width: 480px) and (orientation:landscape) {
	.gallery li { width: 156px; }
	.gallery.medium li { width: 227px; }
}
@media screen and (device-height: 568px) and (-webkit-min-device-pixel-ratio: 2) {
    /* iPhone 5 only */
}
@media screen and (device-height: 568px) and (-webkit-min-device-pixel-ratio: 2) and (orientation:landscape) {
    /* iPhone 5 only */
	.gallery li { width: 186px; }
	.gallery.medium li { width: 279px; }
}