<style>

	/* styles généraux */

	html{
		height:100%;
		width:100%;
	}

	body {
		width:100%;
		min-height:100%;
		margin:0;
		padding:0;
		font-family:sans-serif;
		font-size:16px;
		color:white;
		background:black;
	}
	
	*{
		font-family:sans-serif;
		font-size:16px;
		box-sizing:border-box;
		-ms-box-sizing:border-box;
		-moz-box-sizing:border-box;
		-webkit-box-sizing:border-box;
	}
	
	label{
		width:100%;
	}

	input[type=password]  {
		color:black;
		width: 100%;
		padding: 8px;
		border: 1px solid #ccc;
		border-radius: 4px;
		box-sizing: border-box;
		margin-top: 6px;
		margin-bottom: 16px;
	}
	
	input[type=text], select, textarea, p, span, a, div  {
		color:white;
	}

	input[type=text], select, textarea {
		color:black;
	}
	
	input[type=text], textarea {
		width: 100%;
		padding: 8px;
		border: 1px solid #ccc;
		border-radius: 4px;
		box-sizing: border-box;
		margin-top: 6px;
		margin-bottom: 16px;
	}
	
	input[type=submit]:hover {
		background-color: #45a049;
	}
	
	a:hover{
		opacity:0.6;
	}
	
	textarea {
		resize: vertical;
	}
	
	h1{font-size: 140%} h2{font-size: 120%} h3{font-size: 100%} h4{font-size: 80%} h5{font-size: 60%} h6{font-size: 60%}

	/* styles spécifiques pages */

	#page {
		width:70%;
		margin:0 auto;
	}
		
	#img_sit{
		width:150px;
		display:inline;
	}
			
	#menug{
		position:absolute;
		display:inline;
		top:35px;
		list-style-type:none;
	}
	#menug li {
		display:inline;
		margin-right:20px;
		cursor:pointer;
		text-align:center;
	}
	
	#tit_sit {
		float:left;
		margin:28px 0 0 15px;
		/*font-size:160%;*/
		font-weight:bold;
	}
	
	#decon {
		float:right;
		text-decoration:none;
	}
	
	#decon img {
		vertical-align:middle;
		width:32px;
	}
	
	#messer {
		clear:both;
		width:100%;
		margin: 15px 0 15px 0;
		text-align:left;
	}

	.tit_page {
		width:100%;
		vertical-align:middle;
		border-radius:4px;
		line-height:34px;
		background:#f97c00;
		color:black;
	}
	
	.tit_page span{
		position:relative;
		top:0.7px;
		color:black;
	}
	
	.img_titre {
		margin-top:-2px;
		width:34px;
		vertical-align:middle;
	}
	
	.liencal{
		margin-left:6px;
		border:2px solid black;
		border-radius:4px;
		background:black;
		cursor:pointer;
		color:white;
	}
	
	.liencal a{
		text-decoration:none;
	}
	
	.liencal:hover{
		font-weight:bold;
	}
	
	.img_titre2{
		width:31px;
		float:right;
		margin:2px 10px 0 0;
	}
	
	.img_loader{
		position:relative;
		left:5px;
		top:-5px;
		left:-10px;
		width:60px;
		vertical-align:middle;
	}

	.sous_titre{
		margin-left:20px;
		color:#f97c00;
	}
	
	.libmois{
		margin-left:20px;
		border:1px solid orange;
		width:340px;
		padding:5px;
		color:#f97c00;
		border-radius: 4px;
	}

	.emoj{
		position:relative;
		top:-2px;margin-right:10px;
		cursor:pointer;
	}
	
	/* styles formulaires standards */
	
	.formuls {
		margin:0 auto;
		width:85%
	}
	
	.colformg{
		float:left;
		width:49%
	}
	
	.colformd{
		float:right;
		width:49%
	}
	
	.colformgm{
		float:left;
		width:14%
	}
	
	.colformdm{
		float:right;
		width:84%
	}
	
	.colformig{
		width:360px;
	}
	
	.colformid{
		width:100%;
		clear:both;
		float:left;
		margin-left:140px;
		}

	.explist select{
		width:100%
	}
	
	#nbcarrest {
		font-size:85%;
	}	

	.listagd{
		padding:3px;margin-left:5%;
	}

	.presta{
		position:relative;
		overflow:hidden;
		height:auto;
		max-width:360px;
		text-align:justify;
	}
	
	/* style formulaire de connexion */
	
	#lig_logo{
		text-align:center;
	}
	
	#logo_agcf2 {
		width:200px;
	}
	
	#fconnex {
		width:300px;
		margin:0 auto;
	}

	.btn {
		background-color: #4CAF50;
		color: black;
		border: none;
		border-radius: 4px;
		cursor: pointer;
		line-height:30px;
		width:130px;
		text-align:center;
	}

	.btn:hover {
		background-color: #45a049;
	}
	
	.btng {
		float:left;
	}
	
	.btnd {
		float:right;
	}

	.btnag {
		width:200px;
	}
	
	.blocvid{
		display:block;
		width:340px;
		margin-left:auto;
		margin-right:auto;
		border:1px solid white;
	 }
	 
	.vid{
		border:1px solid #444444;
		width:320px;
		height:240px;
	}
	#tblvid{
		margin-left:50px;
	}
	/* style pied de page */
	
	#pied {
		clear:both;
		position:relative;
		float:left;
		margin:20px 0 0 0;
		width:100%;
		height:auto;
		border-top: 3px solid #f97c00;
		text-align:center;
	}
	
	/* Styles VIEWPORT*/
		@media screen and (max-width: 1200px) {
		
		#page {
			width:98%;
			margin:0;
			display:block;
		}
		
	}
	
	@media (max-device-width:768px) and (orientation: landscape) {
	
		html {
		   -webkit-text-size-adjust: 100%;
		   -ms-text-size-adjust: 100%;
		}
		
	}

	@media screen and (max-width: 768px) {

		#page {
			width:98%;
			margin:0 auto;
			display:block;
		}

		#img_sit{
			display:block;
			margin: auto;
		}

		#menug {
			width:100%;
			position:relative;
			top:-15px;
		}
	
		#menug li{
			display:block;
			width:250px;
			cursor:pointer;
			text-align:center;
			color:black;
			background:white;
			border:2px solid white;
			line-height:170%;
			font-size:80%;
			margin:5px auto 0 auto;
			border-radius: 10px;
		}
		
		.lgspace{
			display:none;
		}
		
		.formuls {
			width:100%;
			margin:0;
		}

		.colformg, .colformd, .colformgm, .colformdm, .colformig{
			width:100%;
			clear:both;
			float:left;
		}
		
		.colformid{
			margin-left:15px;
		}
	
		.lvide {
			display:none;
		}
		
		#decon{
			float:left;
			margin:0;
		}
		
		#tit_sit {
			margin:28px 0 50px 15px;
			font-size:100%;
		}
		
		.col1, .col2, .col3, .colinsc {
			width:100%;
		}
		
		.col1{
			text-align:left;
		}
		
		.col3{
			position:relative;
			float:left;
			margin-top:15px;
		}
		
		.colinscg, .colinscd {
			width:100%;
			clear:both;
		}
		
		.tit_even{
			width:100%;
			float:left;
			margin-top:8px;
		}
		
		.desc_even{
			width:100%;
			font-size:90%;
		}
		
		.sous_titre, .libmois{
			width:100%;
			float:left;
			margin-left:0;
		}		
		.col3{
			display:none;
		}

		.col33{
			display:block;
		}
		
		.listagd{
			margin:10px 0 0 0;
			font-size:14px;
		}

		.btnag {
			width:250px;
		}
		
		.blocvid{
			margin-left:auto;
			margin-right:auto;
		 }
	 
		.vi{
			display:block;
			margin-left:auto;
			margin-right:auto;
		}
		.presta{
			width:100%;
		}
		#tblvid{
			width:100%;
			margin:0;
		}
	}
	
</style>