a {
		color:#75C699;
	}
	
	a:hover, a:active {
		color:#5DA078;
	}
	
	nav.top-right {
		position:absolute;
		right:5px;
		top:5px;
		z-index:1000;
		width:100%;
	}
	
	nav.top-right ul {
		width:100%;
		/*position:absolute;
		right:0;*/
	}
	
	nav.top-right ul {
		list-style: none;
	}
	
	nav.top-right ul li {
		float:right;
		margin-left:5px;
		font-size:20px;
		margin-bottom:5px;
	}
	

	.logo-home .img {
		position:absolute;
		text-align:center;
	}
	
	.logo-home img {
		max-width:100%;
		max-height:100%;
	}
	
	nav.main-menu {
		overflow:auto;
		position:absolute;
	}
	
	nav.main-menu ul {
		list-style:none;
		margin:0;
		padding:0;
	}
	
	nav.main-menu ul li {
		display:block;
		background-color:#75C699;
		float:left;
		border-radius:5px;
		box-shadow: 5px 5px 10px #ddd;
	}
	
	nav.main-menu ul li:hover, nav.main-menu ul li:active {
		background-color:#5DA078;
	}
	
	nav.main-menu a {
		color:white;
		display:block;
		width:100%;
		height:100%;
		position:relative;
	}
	
	nav.main-menu a img {
		max-width:50%;
		max-height:90%;
		display:block;
		margin:auto;
		position:absolute;
	}
	
	nav.main-menu a span {
		display:block;
		position:absolute;
		bottom:0;
		left:0;
		width:100%;
		text-align:center;
		font-size:18px;
		padding-bottom:5px;
		padding-top:5px;
		/*background-color:rgba(255, 255, 255, 0.75);
		color:#5DA078;*/
	}
	
	@media all and (orientation: portrait){
		
		.logo-home {
			width:50%;
			margin:auto;
			position:absolute;
			top:0;
			left:0;
		}
		
		.logo-home .img {
			max-height:90%;
			margin:auto;
			display:block;
		}
		
		.logo-home .img em {
			display:none;
		}
		
		nav.main-menu {
			width:100%;
			bottom:0;
			left:0;
		}
		
		nav.main-menu ul li {
			width:46%;
			margin:2%;
		}
		
	}
	
	@media all and (orientation: landscape){
	
		.logo-home {
			width:30%;
			height:100%;
			position:absolute;
			top:0;
			left:0;
		}
		
		.logo-home .img {
			max-width:80%;
			max-height:50%;
			display:block;
			margin:auto;
		}
		
		nav.main-menu {
			right:0;
			top:0;
		}
		
		nav.main-menu ul li {
			width:30%;
			margin-right:3%;
			margin-bottom:3%;
		}
		
	}
	body.int-background {
		background-color:#75C699;
		color:#fff;
	}
	body.int-background a {
		color:#C54D4E;
	}
	body.int-background a:hover, body.int-background a:active {
		color:#A33D3D;
	}
	body.int-background nav.top-right a {
		color:#fff;
	}
	body.int-background nav.top-right a:hover, body.int-background nav.top-right a:active {
		color:#fff !important;
	}
	
	.elem-info tr th, .elem-info tr td {
		width:50%;
	}
	
	
	/* ****************************** */
	/*           Exercices            */
	/* ****************************** */
	
	.exercice-option {
		list-style-type:none;
		padding:0;
	}
	
	.exercice-option li{
		width:45%;
		height:50px;
		background-color:#75C699;
		float:left;
		border-radius:5px;
		box-shadow: 5px 5px 10px #ddd;
		margin:2%;
	}
	
	.exercice-option li a{
		display:block;
		width:100%;
		height:100%;
		color: #fff;
		text-align:center;
		font-size:200%;
		line-height:50px;
	}
	
	.exercice-option li a:hover, .exercice-option li a:active{
		text-decoration:none;
		background-color:#5DA078;
	}
		
	.exercice-full {
		width:100%;
		height:100%;
		position:absolute;
		top:0;
		left:0;
	}
	
	.exercice-full .c {
		width:90%;
		height:90%;
		margin:auto;
	}
	
	.exercice-full .question {
		font-size:250%;
		width:100%;
		text-align:center;
		margin-bottom:2%;
	}
	
	.exercice-full #form_answer {
		width:100%;
		margin-bottom:2%;
	}
	
	.exercice-full #form_answer .form-group { text-align:center; width:100%; }
	
	.exercice-full #form_answer input {
		max-width:79%;
		display:inline-block;
		font-size:200%;
	}
	
	.exercice-full #form_answer button {
		max-width:19%;
		display:inline;
		font-size:200%;
		/*margin-top:-3%;*/
	}
	
	.exercice-full .count {
		position:absolute;
		font-size:200%;
		top:10%;
		right:5%;
	}
	
	@media all and (orientation: landscape){
		
		.exercice-full .info {
			width:70%;
		}
	}
	
	@media all and (orientation: portrait){
		
		.exercice-full #form_answer button {
			margin-top:-3%;
		}
		
		.exercice-full .info {
			width:45%;
		}
		
	}
	
	/* ****************************** */
	/*       Tableau périodique       */
	/* ****************************** */
	
	ul#tableau {
		position:relative;
		top:30px;
		left:0;
		width:100%;
		list-style-type:none;
		padding:0;
		margin:0;
	}
	
	ul#tableau a{
		color:#333;
	}
	
	ul#tableau a.non-metaux li				{ background-color:#b9d196; } ul#tableau a.non-metaux:hover li, 				ul#tableau a.non-metaux:active li					{ background-color:#b0db72; }
	ul#tableau a.gaz-rare li					{ background-color:#efe07c; } ul#tableau a.gaz-rare:hover li, 				ul#tableau a.gaz-rare:active li					{ background-color:#f0dc54; }
	ul#tableau a.metal-alcalain li			{ background-color:#eeeeee; } ul#tableau a.metal-alcalain:hover li, 			ul#tableau a.metal-alcalain:active li				{ background-color:#dedede; }
	ul#tableau a.metal-alcalino-terreux li	{ background-color:#d3d3d3; } ul#tableau a.metal-alcalino-terreux:hover li, 	ul#tableau a.metal-alcalino-terreux:active li		{ background-color:#c4c4c4; }
	ul#tableau a.metalloides li				{ background-color:#90e6c7; } ul#tableau a.metalloides:hover li, 				ul#tableau a.metalloides:active li				{ background-color:#7fe5c0; }
	ul#tableau a.halogene li					{ background-color:#e5cc7f; } ul#tableau a.halogene:hover li, 				ul#tableau a.halogene:active li					{ background-color:#e1c571; }
	ul#tableau a.metal-pauvre li				{ background-color:#8db7b6; } ul#tableau a.metal-pauvre:hover li, 			ul#tableau a.metal-pauvre:active li				{ background-color:#7eafad; }
	ul#tableau a.metaux-pauvres li			{ background-color:#8db7b6; } ul#tableau a.metaux-pauvres:hover li, 			ul#tableau a.metaux-pauvres:active li				{ background-color:#7eafad; }
	ul#tableau a.metaux-de-transition li		{ background-color:#71abe1; } ul#tableau a.metaux-de-transition:hover li,		ul#tableau a.metaux-de-transition:active li		{ background-color:#559bdc; }
	ul#tableau a.lanthanides li				{ background-color:#548cc0; } ul#tableau a.lanthanides:hover li,				ul#tableau a.lanthanides:active li				{ background-color:#4987c0; }
	ul#tableau a.actinides li					{ background-color:#4a7aa7; } ul#tableau a.actinides:hover li,				ul#tableau a.actinides:active li					{ background-color:#3c71a2; }
	ul#tableau a.non-defini li				{ background-color:#7d93a7; } ul#tableau a.non-defini:hover li,				ul#tableau a.non-defini:active li					{ background-color:#6684a0; }
	ul#tableau a.halogene---metalloide li		{ background-color:#9fa97f; } ul#tableau a.halogene---metalloide:hover li,	ul#tableau a.halogene---metalloide:active li		{ background-color:#909c6c; }
	
	ul#tableau li .num-atomique {
		width:100%;
		position:absolute;
		top:0;
		left:0;
		text-align:left;
		font-size:90%;
		padding-left: 5%;
		padding-top: 5%;
		margin:0;
	}
	
	ul#tableau li .symbole {
		width:100%;
		position:absolute;
		top:15px;
		left:0;
		text-align:center;
		font-size:1.6em;
	}
	
	ul#tableau li .nom {
		width:100%;
		position:absolute;
		top:45px;
		left:0;
		text-align:center;
		font-size:50%;
	}
	
	ul#tableau li {
		background-color:red;
		float:left;
		width:5.4184%; /* 100 / 18 = 5.55555 */
		height:70px;
		border-right: solid 1px #333;
		border-bottom: solid 1px #333;
		position:relative;
	}
	
	ul#tableau li#element_1,
	ul#tableau li#element_2,
	ul#tableau li#element_3,
	ul#tableau li#element_4,
	ul#tableau li#element_5,
	ul#tableau li#element_6,
	ul#tableau li#element_7,
	ul#tableau li#element_8,
	ul#tableau li#element_9,
	ul#tableau li#element_21,
	ul#tableau li#element_22,
	ul#tableau li#element_23,
	ul#tableau li#element_24,
	ul#tableau li#element_25,
	ul#tableau li#element_26,
	ul#tableau li#element_27,
	ul#tableau li#element_28,
	ul#tableau li#element_29,
	ul#tableau li#element_30,
	ul#tableau li#element_58_71,
	ul#tableau li#element_58,
	ul#tableau li#element_59,
	ul#tableau li#element_60,
	ul#tableau li#element_61,
	ul#tableau li#element_62,
	ul#tableau li#element_63,
	ul#tableau li#element_64,
	ul#tableau li#element_65,
	ul#tableau li#element_66,
	ul#tableau li#element_67,
	ul#tableau li#element_68,
	ul#tableau li#element_69,
	ul#tableau li#element_70,
	ul#tableau li#element_71 {
		border-top: solid 1px #333;
	}
	
	ul#tableau li#element_1,
	ul#tableau li#element_2,
	ul#tableau li#element_3,
	ul#tableau li#element_5,
	ul#tableau li#element_11,
	ul#tableau li#element_13,
	ul#tableau li#element_19,
	ul#tableau li#element_22,
	ul#tableau li#element_37,
	ul#tableau li#element_40,
	ul#tableau li#element_55,
	ul#tableau li#element_58,
	ul#tableau li#element_87,
	ul#tableau li#element_90{
		border-left: solid 1px #333;
	}
	
	ul#tableau li#element_1 {
		margin-right:89.16721725463866476957%;
		position:relative;
		bottom:20px	;
	}
	ul#tableau li#element_4 {
		margin-right:56.6638927459716%;
	}
	ul#tableau li#element_12 {
		margin-right:56.6638927459716%;
	}
	ul#tableau li#element_21 {
		margin-right:2.4916886%;
	}
	ul#tableau li#element_39 {
		margin-right:2.4916886%;
	}
	ul#tableau li#element_57 {
		margin-right:2.4916886%;
	}
	ul#tableau li#element_89 {
		margin-right:2.4916886%;
	}
	
	ul#tableau li#element_58, 
	ul#tableau li#element_59, 
	ul#tableau li#element_60, 
	ul#tableau li#element_61, 
	ul#tableau li#element_62, 
	ul#tableau li#element_63, 
	ul#tableau li#element_64, 
	ul#tableau li#element_65, 
	ul#tableau li#element_66, 
	ul#tableau li#element_67, 
	ul#tableau li#element_68, 
	ul#tableau li#element_69, 
	ul#tableau li#element_70, 
	ul#tableau li#element_71 {
		position:absolute;
		top:510px;
	}
	ul#tableau li#element_58 { left:16.2552%; }
	ul#tableau li#element_59 { left:21.6746%; }
	ul#tableau li#element_60 { left:27.092%; }
	ul#tableau li#element_61 { left:32.5104%; }
	ul#tableau li#element_62 { left:37.9288%; } 
	ul#tableau li#element_63 { left:43.3472%; } 
	ul#tableau li#element_64 { left:48.7656%; } 
	ul#tableau li#element_65 { left:54.184%; } 
	ul#tableau li#element_66 { left:59.6024%; } 
	ul#tableau li#element_67 { left:65.0208%; } 
	ul#tableau li#element_68 { left:70.4392%; } 
	ul#tableau li#element_69 { left:75.8576%; } 
	ul#tableau li#element_70 { left:81.276%; } 
	ul#tableau li#element_71 { left:86.6944%; }
	
	
	ul#tableau li#element_90, 
	ul#tableau li#element_91, 
	ul#tableau li#element_92, 
	ul#tableau li#element_93, 
	ul#tableau li#element_94, 
	ul#tableau li#element_95, 
	ul#tableau li#element_96, 
	ul#tableau li#element_97, 
	ul#tableau li#element_98, 
	ul#tableau li#element_99, 
	ul#tableau li#element_100, 
	ul#tableau li#element_101, 
	ul#tableau li#element_102, 
	ul#tableau li#element_103 {
		position:absolute;
		top:580px;
	}
	ul#tableau li#element_90 { left:16.2552%; }
	ul#tableau li#element_91 { left:21.6746%; }
	ul#tableau li#element_92 { left:27.092%; }
	ul#tableau li#element_93 { left:32.5104%; }
	ul#tableau li#element_94 { left:37.9288%; } 
	ul#tableau li#element_95 { left:43.3472%; } 
	ul#tableau li#element_96 { left:48.7656%; } 
	ul#tableau li#element_97 { left:54.184%; } 
	ul#tableau li#element_98 { left:59.6024%; } 
	ul#tableau li#element_99 { left:65.0208%; } 
	ul#tableau li#element_100 { left:70.4392%; } 
	ul#tableau li#element_101 { left:75.8576%; } 
	ul#tableau li#element_102 { left:81.276%; } 
	ul#tableau li#element_103 { left:86.6944%; }
	
	ul#tableau li#element_58_71, ul#tableau li#element_90_103  {
		width:2.4916886%;
		text-align:center;
	}
	ul#tableau li#element_58_71 {
		left:16.2552%;
		top:-140px;
	}
	ul#tableau li#element_90_103 {
		left:13.7636%;
		top:-70px;
	}
	
	@media only screen 
		and (min-width : 321px) {
		
		ul#tableau li {
			width:5.4184%;
			height:70px;
		}
		
		ul#tableau li#element_1 {
			margin-right:89.16721725463866476957%;
		}
		ul#tableau li#element_4 {
			margin-right:56.662393569946%;
		}
		ul#tableau li#element_12 {
			margin-right:56.662393569946%;
		}
		ul#tableau li#element_21 {
			margin-right:2.4871%;
		}
		ul#tableau li#element_39 {
			margin-right:2.4871%;
		}
		ul#tableau li#element_57 {
			margin-right:2.4871%;
		}
		ul#tableau li#element_89 {
			margin-right:2.4871%;
		}
		
	}
	@media only screen 
		and (min-width : 730px) {
		
		ul#tableau li {
			width:5.4184%;
			height:70px;
		}
		
		ul#tableau li#element_1 {
			margin-right:89.1665%;
		}
		ul#tableau li#element_4 {
			margin-right:56.6594%;
		}
		ul#tableau li#element_12 {
			margin-right:56.6594%;
		}
		ul#tableau li#element_21 {
			margin-right:2.48%;
		}
		ul#tableau li#element_39 {
			margin-right:2.48%;
		}
		ul#tableau li#element_57 {
			margin-right:2.48%;
		}
		ul#tableau li#element_89 {
			margin-right:2.48%;
		}
		
	}
	@media only screen 
		and (min-width : 1224px) {
		
		ul#tableau li {
			width:5.4184%;
			height:70px;
		}
		
		ul#tableau li#element_1 {
			margin-right:89.1652%;
		}
		ul#tableau li#element_4 {
			margin-right:56.65%;
		}
		ul#tableau li#element_12 {
			margin-right:56.65%;
		}
		ul#tableau li#element_21 {
			margin-right:2.47%;
		}
		ul#tableau li#element_39 {
			margin-right:2.47%;
		}
		ul#tableau li#element_57 {
			margin-right:2.47%;
		}
		ul#tableau li#element_89 {
			margin-right:2.47%;
		}
	}