/* ----------------------------------- generalites ----------------------------------- */
* {margin: 0; padding: 0}
body {
	background-color: #FFF;
	position: relative;
	font-weight: normal;
	font-size: 14px;
	color: #555;
	font-family: 'Verdana','Arial','Lucida Grande','Lucida','Helvetica','Helvetica New',sans-serif;
	line-height: 20px;
	margin: 10px 60px 20px 60px;
}
a {text-decoration: none; outline: none;}
a:link, a:visited {color: #6D7BAC;}
a:hover, a:active, a:focus {color: #7DBEDF; outline: none;}

/* img {border: 0; vertical-align: bottom;}*/
img {border: 0;}

.alignGauche {text-align: left}
.alignCentre {text-align: center}
.alignDroite {text-align: right}
.valignHaut {vertical-align: top}
.valignCentre {vertical-align: middle}
.valignBas {vertical-align: bottom}

.fontSerif {font-family: 'Times', 'Times New Roman', 'Palatino', 'Georgia', serif}
.fontSans {font-family: 'Verdana','Arial','Lucida Grande','Lucida','Helvetica','Helvetica New',sans-serif}
.fontMono {font-family: 'Consolas','Courier New','Monaco','Andale Mono','Lucida Console','courier','courier new',monospace}

/* -------------------------------------- pages -------------------------------------- */
.gras {font-weight: bold;}
.italique {font-style: italic;}

li.large {margin-top: 8px; padding-left: 30px;}

div.titre {
	font-size: 16px;
	color: #888;
	margin: 35px 0 15px 0;
	width: 100%;
	border-bottom: 1px solid #BBB;
	padding-bottom: 4px;
}

#main {
		margin: 20px auto; /* centrage */
		min-width: 780px;
		max-width: 1200px;
	}
	table#header {width: 100%; height: 80px}
		#logo {width: 120px;}
			#logo img {
				width: 120px;
				height: 80px;
			}
		#titrePage {
				text-align: right;
				vertical-align: top;
				padding-top: 39px;
				font-size: 16px;
				color: #000;
			}
		#corps {
			margin: 0px 0 10px 150px; /* 120 logo + 30 */
		}

.infosApple {
	border: solid 1px #DDDDDD;
	border-radius: 8px;
	padding: 10px;
	background-color: #FBFBEF;
	text-align: justify;
	font-size: 12px;
	line-height: 17px;
	color: #777777;
}

/* ---------------------------------- image modale ----------------------------------- */
#modal-background {
	background-color: rgba(0,0,0,0.6);
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9998;
	display: none;
}
div.modal-bloc {
		max-width: 50%;
		max-height: 50%;
		position: fixed;
		inset: 0 0 0 0;
		display: block;
		margin: auto;
	}
	table.modal-structure {
			width: 100%;
			height: 100%;
			border-collapse: collapse;
			z-index: 9999;
			background-color: #555;
		}
		tr.modal-header {
				background-color: #BBBBBB;
				height: 30px;
				vertical-align: middle;
			}
			#modal-title {
				padding-left: 15px;
				border-right: 1px solid #CCCCCC;
				color: #333333;
				font-size: 14px;
				width: 93%;
			}
			td.modal-close {
					text-align: center;
					font-family: 'Lucida Grande,Lucida,Helvetica','Helvetica New','Verdana','Arial',sans-serif;
					font-size: 18px;
					font-style: normal;
					font-weight: bold;
					text-shadow: 1px 1px 1px #888;
					color: #FFF;
					cursor: pointer;
				}
				td.modal-close:hover {text-shadow: -1px -1px 1px #888;}
		td.modal-content {
				vertical-align: middle;
				text-align: center;
				padding: 6px;
				width: 100%;
				height: 100%;
			}
			#modal-img {
				max-width: 100%;
				height: auto;
			}

/* --------------------------------- softwares liste --------------------------------- */
div.soft {
		margin-top: 20px;
		width: 100%;
	}
	table.softable {
			border-collapse: collapse;
			width: 100%;
			margin-bottom: 40px;
			border-top: solid 1px #AAAAAA;
		}
		td.icn {
			width: 90px;
			padding-top: 12px;
		}
		td.nom {
			width: 60%;
			padding-bottom: 12px;
			padding-top: 8px;
			font-weight: bold;
			height: 22px;
		}
		td.desc {
/*			padding-left: 30px;*/
			padding-bottom: 15px;
			font-size: 12px;
		}
		td.pict {
				padding-left: 20px;
				padding-top: 12px;
				padding-right: 14px;
				text-align: right;
			}
			td.pict img {
				max-width: 100%; height: auto;
				border: solid 1px #B6BFE1;
				border-radius: 6px;
				padding: 6px;
			}
			td.pict img:hover {border: solid 1px #6D7BAC;}
		td.dls {
				vertical-align: middle;
	/*			padding-left: 60px;*/
			}
			table.dlstable {
					border-collapse: collapse;
					width: 100%;
				}
				td.platform {
					white-space: nowrap;
					padding-right: 16px;
					text-align: right;
					font-size: 12px;
					color: #777777;
					vertical-align: text-bottom;
				}
				td.dl {
					white-space: nowrap;
					padding-right: 16px;
					text-align: left;
					vertical-align:text-bottom;
				}

/* --------------------------------------- DLs --------------------------------------- */
table.dl_tableau {
		border-collapse: separate;
		border-spacing: 16px 2px;
		font-size: 11px;
	}
	.dl_tableau td {vertical-align: text-bottom;}
	td.dl_famille {
		font-weight: bold;
		padding-top: 30px;
		font-size: 13px;
	}
	td.dl_procForm {
		padding-left: 40px;
	}
	td.dl_nom {
		font-size: 13px;
	}