/* FONT
Generated by Font Squirrel (http://www.fontsquirrel.com) on June 6, 2014 */

@font-face {
    font-family: 'lato_blackitalic';
    src: url('style/fonts/lato-blackitalic-webfont.eot');
    src: url('style/fonts/lato-blackitalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('style/fonts/lato-blackitalic-webfont.woff') format('woff'),
         url('style/fonts/lato-blackitalic-webfont.ttf') format('truetype'),
         url('style/fonts/lato-blackitalic-webfont.svg#roboto_slabthin') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'lato_black';
    src: url('style/fonts/lato-black-webfont.eot');
    src: url('style/fonts/lato-black-webfont.eot?#iefix') format('embedded-opentype'),
         url('style/fonts/lato-black-webfont.woff') format('woff'),
         url('style/fonts/lato-black-webfont.ttf') format('truetype'),
         url('style/fonts/lato-black-webfont.svg#roboto_slabthin') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'lato_bolditalic';
    src: url('style/fonts/lato-bolditalic-webfont.eot');
    src: url('style/fonts/lato-bolditalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('style/fonts/lato-bolditalic-webfont.woff') format('woff'),
         url('style/fonts/lato-bolditalic-webfont.ttf') format('truetype'),
         url('style/fonts/lato-bolditalic-webfont.svg#lato_bolditalic') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'lato_bold';
    src: url('style/fonts/lato-bold-webfont.eot');
    src: url('style/fonts/lato-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('style/fonts/lato-bold-webfont.woff') format('woff'),
         url('style/fonts/lato-bold-webfont.ttf') format('truetype'),
         url('style/fonts/lato-bold-webfont.svg#lato_bold') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'lato_italic';
    src: url('style/fonts/lato-italic-webfont.eot');
    src: url('style/fonts/lato-italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('style/fonts/lato-italic-webfont.woff') format('woff'),
         url('style/fonts/lato-italic-webfont.ttf') format('truetype'),
         url('style/fonts/lato-italic-webfont.svg#lato_italic') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'lato_light';
    src: url('style/fonts/lato-light-webfont.eot');
    src: url('style/fonts/lato-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('style/fonts/lato-light-webfont.woff') format('woff'),
         url('style/fonts/lato-light-webfont.ttf') format('truetype'),
         url('style/fonts/lato-light-webfont.svg#lato_light') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'lato_regular';
    src: url('style/fonts/lato-regular-webfont.eot');
    src: url('style/fonts/lato-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('style/fonts/lato-regular-webfont.woff') format('woff'),
         url('style/fonts/lato-regular-webfont.ttf') format('truetype'),
         url('style/fonts/lato-regular-webfont.svg#lato_regular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'montserratregular';
    src: url('style/fonts/montserrat-regular-webfont.eot');
    src: url('style/fonts/montserrat-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('style/fonts/montserrat-regular-webfont.woff') format('woff'),
         url('style/fonts/montserrat-regular-webfont.ttf') format('truetype'),
         url('style/fonts/montserrat-regular-webfont.svg#montserratregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'montserratbold';
    src: url('style/fonts/montserrat-bold-webfont.eot');
    src: url('style/fonts/montserrat-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('style/fonts/montserrat-bold-webfont.woff') format('woff'),
         url('style/fonts/montserrat-bold-webfont.ttf') format('truetype'),
         url('style/fonts/montserrat-bold-webfont.svg#montserratbold') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'proximanova_black';
    src: url('style/fonts/proximanova-black-webfont.eot');
    src: url('style/fonts/proximanova-black-webfont.eot?#iefix') format('embedded-opentype'),
         url('style/fonts/proximanova-black-webfont.woff') format('woff'),
         url('style/fonts/proximanova-black-webfont.ttf') format('truetype'),
         url('style/fonts/proximanova-black-webfont.svg#proxima_novablack') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'proximanova_extrabold';
    src: url('style/fonts/proximanova-extrabold-webfont.eot');
    src: url('style/fonts/proximanova-extrabold-webfont.eot?#iefix') format('embedded-opentype'),
         url('style/fonts/proximanova-extrabold-webfont.woff') format('woff'),
         url('style/fonts/proximanova-extrabold-webfont.ttf') format('truetype'),
         url('style/fonts/proximanova-extrabold-webfont.svg#proxima_novaextrabold') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'proximanova_bold';
    src: url('style/fonts/proximanova-bold-webfont.eot');
    src: url('style/fonts/proximanova-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('style/fonts/proximanova-bold-webfont.woff') format('woff'),
         url('style/fonts/proximanova-bold-webfont.ttf') format('truetype'),
         url('style/fonts/proximanova-bold-webfont.svg#proxima_nova_rgbold') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'proximanova_boldit';
    src: url('style/fonts/proximanova-boldit-webfont.eot');
    src: url('style/fonts/proximanova-boldit-webfont.eot?#iefix') format('embedded-opentype'),
         url('style/fonts/proximanova-boldit-webfont.woff') format('woff'),
         url('style/fonts/proximanova-boldit-webfont.ttf') format('truetype'),
         url('style/fonts/proximanova-boldit-webfont.svg#proxima_nova_rgbold_italic') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'proximanova_semiboldit';
    src: url('style/fonts/proximanova-semibolditalic-webfont.eot');
    src: url('style/fonts/proximanova-semibolditalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('style/fonts/proximanova-semibolditalic-webfont.woff') format('woff'),
         url('style/fonts/proximanova-semibolditalic-webfont.ttf') format('truetype'),
         url('style/fonts/proximanova-semibolditalic-webfont.svg#proxima_nova_rgbold_italic') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'proximanova_condregular';
    src: url('style/fonts/proximanovacond-regular-webfont.eot');
    src: url('style/fonts/proximanovacond-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('style/fonts/proximanovacond-regular-webfont.woff') format('woff'),
         url('style/fonts/proximanovacond-regular-webfont.ttf') format('truetype'),
         url('style/fonts/proximanovacond-regular-webfont.svg#proxima_nova_cn_rgregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'proximanova_regitalic';
    src: url('style/fonts/proximanova-regitalic-webfont.eot');
    src: url('style/fonts/proximanova-regitalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('style/fonts/proximanova-regitalic-webfont.woff') format('woff'),
         url('style/fonts/proximanova-regitalic-webfont.ttf') format('truetype'),
         url('style/fonts/proximanova-regitalic-webfont.svg#proxima_nova_cn_rgregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'roboto_slabthin';
    src: url('style/fonts/RobotoSlab-Thin-webfont.eot');
    src: url('style/fonts/RobotoSlab-Thin-webfont.eot?#iefix') format('embedded-opentype'),
         url('style/fonts/RobotoSlab-Thin-webfont.woff') format('woff'),
         url('style/fonts/RobotoSlab-Thin-webfont.ttf') format('truetype'),
         url('style/fonts/RobotoSlab-Thin-webfont.svg#roboto_slabthin') format('svg');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'roboto_slabregular';
    src: url('style/fonts/RobotoSlab-Regular-webfont.eot');
    src: url('style/fonts/RobotoSlab-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('style/fonts/RobotoSlab-Regular-webfont.woff') format('woff'),
         url('style/fonts/RobotoSlab-Regular-webfont.ttf') format('truetype'),
         url('style/fonts/RobotoSlab-Regular-webfont.svg#roboto_slabregular') format('svg');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'roboto_slablight';
    src: url('style/fonts/RobotoSlab-Light-webfont.eot');
    src: url('style/fonts/RobotoSlab-Light-webfont.eot?#iefix') format('embedded-opentype'),
         url('style/fonts/RobotoSlab-Light-webfont.woff') format('woff'),
         url('style/fonts/RobotoSlab-Light-webfont.ttf') format('truetype'),
         url('style/fonts/RobotoSlab-Light-webfont.svg#roboto_slablight') format('svg');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'roboto_slabbold';
    src: url('style/fonts/RobotoSlab-Bold-webfont.eot');
    src: url('style/fonts/RobotoSlab-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('style/fonts/RobotoSlab-Bold-webfont.woff') format('woff'),
         url('style/fonts/RobotoSlab-Bold-webfont.ttf') format('truetype'),
         url('style/fonts/RobotoSlab-Bold-webfont.svg#roboto_slabbold') format('svg');
    font-weight: normal;
    font-style: normal;

}




/********************************************/

/* Feuille de style Web'Ethys(R) par Gildas MONJOIN pour Ogam (c)2014-2018 */

/* CORPS */
body {
	margin: 0;
	padding: 0;
	font-family: "lato_bold", "Lato Bold", Arial, Helvetica, sans-serif;
	font-family: "lato_light", "Lato", "Lato Regular", Arial, Helvetica, sans-serif;
	color: #000;
	background: #999;
	/* background: #fff; */
}

a {
	text-decoration: none;
}

a img {
	border: 0;
}

.fin {
	clear: both;
}
.clearer , .fintoufin {
	clear: both;
	height: 0px;
	line-height: 0px;
}
.wfull {
	width: 100%;
	/* max-width: 1500px; */
	padding: 0;
	margin: 0 auto;
}
.w955 {
	width: 955px;
	padding: 0;
	margin: 0 auto;
	position: relative;
}
@media screen and (max-width: 980px) {
	.w955 {
		width: auto;
		padding-left: 20px;
		padding-right: 20px;
	}
}
.w1000 {
	width: 1000px;
	padding: 0;
	margin: 0 auto;
	position: relative;
}
.wauto {
	width: auto;
	padding: 0 5%;
	margin: 0 2%;
	position: relative;
}

.hautVide {
	padding-top: 60px;
}
.basVide{
	padding-bottom: 12vh;
}

#generale {
	margin: 0 auto 0;
	position: relative;
	padding: 0px 0px 0px;
	overflow: hidden;
	background: #fff;
	/* il faudrait mettre le tracé du logo Ogam cf. "01 - PAGE E BUSINESS.jpg" */
}
@media screen and (min-width: 1500px) {
	#generale {
		/* width: 1500px; */
	}
}
@media screen and (max-width: 980px) { /* ne pas en abuser... */
	#generale {
		font-size: 1.2em;
		/*font-size: 1.4em;*/
	}
}
@media screen and (max-width: 400px) {
	#generale {
		font-size: 4.2em;
		/*font-size: 1.2em; en width=device-width*/
	}
}
/* HAUT */
header {
	height: 100px;
	background: linear-gradient(#fefefe 0%, #f6f6f6 90%, #fcfcfc 100%);
	/*border-bottom: 4px solid #fa0;*/
	position: fixed;
	z-index: 1000;
	z-index: 10000;
}
#logo {
	position: absolute;
	top: 16px;
	top: 8px;
	left: 2.5%;
	margin: 0;
	padding: 0px 0px;
	z-index: 1000001;
	color: #000;
	font-size: 12px;
}
#logo img{
	/*width: 200px;*/
	height: 86px;
}

#slogan { display: none;
	position: absolute;
	top: 80px;
	left: 37px;
	margin: 0;
	width: 350px;
	z-index: 200;
	color: #999;
	line-height: 1.3em;
	font-size: 1.2ex;
	font-style: normal;
	font-family: sans-serif;
	text-transform: uppercase;
	text-align: left;
}

#navHaut {
	z-index: 300;
	z-index: 1000000;
	position: absolute;
	right: 0px;
	top: 0px;
	margin: 0;
	padding: 0px 0px 0px;
	width: 100%;
	height: 100px;
	color: #666;
	text-align: right;
	font-family: 'montserratregular', "Montserrat", sans-serif;
	text-transform: uppercase;
	font-size: 1em;
	font-weight: normal;
	border-bottom: 1px solid #ddd;
}
@media screen and (max-width: 1100px) {
	#navHaut {
		font-size: 0.8em;
	}
}
@media screen and (max-width: 980px) {
	#navHaut {
		font-size: 0.7em;
	}
}

ul#navHaut_1 {
	z-index: 1000000;
	margin:0;
	padding:0;
	list-style-type: none;
}
ul#navHaut_1 li{
	margin:0;
	padding:0;
	padding: 0px 10px 0px 10px;
	display: inline-block;
	position: relative;
	text-align: center;
	line-height: 100px;
}
ul#navHaut_1 li a{
	padding: 38px 0px 37px 0px;
	color: #aaa;
	text-decoration: none;
	font-style: normal;
}
@media screen and (max-width: 1100px) {
	ul#navHaut_1 li a {
		color: #666;
	}
}
@media screen and (max-width: 980px) {
	ul#navHaut_1 li a {
		color: #333;
	}
}

ul#navHaut_1 li a:hover {
	color: #444;
	border-top: 3px solid #fa0;
}
ul#navHaut_1 li a.NH-actif{
	color: #fa0;
}
ul#navHaut_1 li a.NH-devis{
	color: #fff;
	background-color:  #0a8;
	padding: 14px 18px 14px 18px;
}
ul#navHaut_1 li a.NH-devis:hover{
	color: #fff;
	background-color:  #6c6;
	border: none;
}
/* sous-nav (menus déroulants) */
ul#navHaut_1 li ul {
	display:none;
}
ul#navHaut_1 li:hover ul { 
	z-index: 1000000;
	display: block;
	width: 220px;
	margin: 0;
	padding: 0px 0px 5px;
	position: absolute;
	top: 100px;
	left: -50px;
	line-height: 1.6em;
	text-align: left;
	list-style-type: none;
	text-transform: none;
	background: linear-gradient(#fff 0%, #fefefe 70%, #eee 100%);
	border-bottom: 1px solid #ccc;
	border-radius: 0px 0px 20px 20px;
	box-shadow: 0px 5px 10px -2px #ddd;
}
ul#navHaut_1 li ul li {
	display: list-item;
	margin: 0;
	padding: 0;
	font-size: 0.8em;
	font-family: 'roboto_slabregular', "RobotoSlab Regular", "Roboto Slab", serif;
	border-bottom: 1px solid #eee;
}
ul#navHaut_1 li ul li a{
	color: #999;
}
ul#navHaut_1 li ul li a:hover{
	color: #f90;
}
/* navHaut_2 */
ul#navHaut_1 li ul li:last-child {
	border-bottom: none;
}

#navHautOnglet {
	display: none;
}

@media screen and (max-width: 980px) {
	header {
		height: auto;
		background: linear-gradient(#fefefe 0%, #f6f6f6 90%, #fcfcfc 100%);
		border-bottom: 4px solid #fa0;
		position: fixed;
		position: relative; /* pb avec lemenu déroulant */
		z-index: 10000;
	}
	#logo {
		display: inline-block;
		position: relative;
		left: auto;
		top: auto;
		margin: 5px 0px 0px 0px;
		padding: 0px 0px 0px 5px;
		text-align: left;
	}
	#logo img{
		/*width: 500px;*/
		height: 90px;
		height: 150px;
		transition: 0.8s;
	}

	#navHaut {
		position: relative;
		margin: 10px 0px 0px;
		padding: 0px 10px 0px;
		width: auto;
		height: auto;
		text-align: center;
		font-size: 3em;
		font-weight: normal;
		/*border-bottom: 1px solid #ddd;*/
	}
	#navHaut ul#navHaut_1{
		height: 0px;
		overflow: hidden;
	}
	#navHaut ul#navHaut_1.navHautDeploy {
		height: auto;
		/*font-size: 12px;*/
	}
	ul#navHaut_1 {
		margin:0;
		padding:0;
		list-style-type: none;
	}
	ul#navHaut_1 li{
		margin:0;
		padding: 17px 0px 17px 0px;
		display: block;
		position: relative;
		text-align: center;
		line-height: 1.2em;
		border-top: 2px solid #eee;
	}
	ul#navHaut_1:first-child{
		border: none;
	}
	ul#navHaut_1 li a{
		padding: 0px 0px 0px 0px;
		color: #aaa;
		text-decoration: none;
		font-style: normal;
	}
	ul#navHaut_1 li a:hover {
		color: #444;
		border-top: none;
	}
	ul#navHaut_1 li a.NH-actif{
		color: #fa0;
	}
	ul#navHaut_1 li a.NH-devis{
		color: #aaa;
		background-color:  transparent;
		padding: 14px 18px 14px 18px;
	}
	ul#navHaut_1 li a.NH-devis:hover{
		color: #fff;
		background-color:  #6c6;
		border: none;
	}
	ul#navHaut_1 li ul ,
	ul#navHaut_1 li:hover ul {
		z-index: 1000000;
		display: block;
		width: 100%;
		margin: 0;
		padding: 0px 0px 5px;
		position: relative;
		top: auto;
		left: auto;
		line-height: 1.6em;
		text-align: left;
		list-style-type: none;
		text-transform: none;
		background: linear-gradient(#fff 0%, #fefefe 70%, #eee 100%);
		border-bottom: 1px solid #ccc;
		border-radius: 0px 0px 20px 20px;
		box-shadow: 0px 5px 10px -2px #ddd;
	}
	ul#navHaut_1 li ul li {
		line-height: 1.6em;
		font-size: 0.7em;
		font-family: inherit;
		border-bottom: 0px solid #eee;
	}
	/* bouton "ouvrir menu tablette" */
	#navHautOnglet {
		display: inline-block;
		position: absolute;
		top: 20px;
		right: 30px;
		width: auto;
		height: auto;
		margin: 0px;
		padding: 0px 0.2em;
		border: 4px solid #ccc;
		border-radius: 15%;
		line-height: 1em;
		color: #999;
		font-size: 67px;
		font-size: 117px;
		text-align: center;
		cursor: pointer;
	}
}


@media screen and (max-width: 400px) {
	header {
		height: auto;
		background: linear-gradient(#fefefe 0%, #f6f6f6 90%, #fcfcfc 100%);
		border-bottom: 4px solid #fa0;
		position: relative;
	}
	#logo {
		display: block;
		position: relative;
		margin: 0;
		padding: 0px 0px 10px;
		text-align: center;
		transition: 0.8s;
	}
	#logo img{
		width: 300px;
		height: auto;
	}

	#navHaut {
		margin: 10px 0px;
		padding: 0px 10px 0px;
		height: auto;
		text-align: center;
		font-size: 1.6em;
		font-weight: normal;
		border-bottom: 1px solid #ddd;
	}
	ul#navHaut_1 {
		margin:0;
		padding:0;
		list-style-type: none;
	}
	ul#navHaut_1 li{
		margin:0;
		padding: 10px 0px 10px 0px;
		display: block;
		position: relative;
		text-align: center;
		line-height: 1.2em;
		border-top: 1px solid #ccc;
	}
	ul#navHaut_1 li a{
		padding: 0px 0px 0px 0px;
		color: #aaa;
		text-decoration: none;
		font-style: normal;
	}
	ul#navHaut_1 li a:hover {
		color: #444;
		border-top: 3px solid #fa0;
	}
	ul#navHaut_1 li a.NH-actif{
		color: #fa0;
	}
	ul#navHaut_1 li a.NH-devis{
		color: #aaa;
		background-color:  transparent;
		padding: 14px 18px 14px 18px;
	}
	ul#navHaut_1 li a.NH-devis:hover{
		color: #fff;
		background-color:  #6c6;
		border: none;
	}
}

/****************/
/*	BAS 		*/
/****************/

footer  {
	clear: both;
	margin: 0 auto;
	padding: 20px 0px 40px;
	background: #4c4c4c /*url(style/fond_bas.png) repeat-x center bottom scroll*/;
	/*border-bottom: 5px solid #333;*/
	text-align: center;
}
#logo_bas {
	position: relative;
	z-index: 2000;
	display: inline-block;
	margin: -67px auto 0;
	border-radius: 50%;/*border: 1px solid #fff;*/
	width: 112px;
	height: 110px;
	padding: 0px 0px;
	background-color: #4c4c4c;
}
#logo_bas img {
	vertical-align: bottom;
	width: 80px;
	height: 113px;
	margin-top: 15px;
}
.col_bas {
	float:left;
	width: 250px;
	margin: 10px 40px 0px 10px;
	padding: 5px;
	text-align: left;
}

address {
	margin: 30px 0px 0px;
	padding: 0px;
	line-height: 1.4em;
	height: 50px;
	color: #eee;
	font-size: 0.9em;
	font-weight: normal;
	font-style: normal;
}
.picto_adress {
	float: left;
	margin: 0px 20px 20px 0px;
}
#add_tel {
	clear: both;
	line-height: 2.6em;
	padding: 0px 0px 0px 2px;
	color: #eee;
	font-size: 1em;
}
#add_email {
	clear: both;
	height: 30px;
	line-height: 1em;
	padding: 0px 0px 0px 2px;
	color: #eee;
	font-size: 0.9em;
}
#add_email a{
	color: #eee;
}
#add_email a:hover{
	color: #fc0;
}
#navBas {
	margin: 0px 0px 0px 0px;
	padding: 0px 5px 8px 0px;
	line-height: 1.2em;
	text-align: left;
	color: #999;
	font-weight: normal;
	font-style: normal;
}
#navBas a {
	font-size: 0.9em;
	color: #ccc;
	padding: 0px;
}
#navBas a:hover {
	color: #fff;
}
#navBas a#add_raison {
	font-weight: bold;
	font-size: 1.4em;
	font-style: italic;
	color: #fff;
}

#navReseaux {
	margin: 20px 0px 0px;
}
#navReseaux img{
	opacity: 0.5;
	transition: 0.6s;
}
#navReseaux a:hover img{
	opacity: 1;
	transition: 0.1s;
}

/*    	    Signature 	        */

#siteWeb{
	padding: 20px 0px 0px;
	text-align: left;
	line-height: 1.4ex;
}
#siteWeb a {
	text-decoration: none;
	font-size: 10px;
	color: #888;
    text-shadow: none;  
    text-shadow: 1px 1px 0 #000;  
}
#siteWeb a:hover {
	text-decoration: none;
	color: #999;
	color: #ccc;
}

/*************/
/* STRUCTURE */
/*************/


#corps {
	margin: 0px 0px;
	padding: 100px 0px 0px;
}
@media screen and (max-width: 980px) {
	#corps {
		margin: 0px 0px;
		/*padding: 194px 0px 0px; si header fixed*/
		padding: 0px 0px 0px;
		font-size: 1.8em;
	}
	.corps_accueil {
		font-size: 0.556em;
		font-size: 1em;
	}
}
@media screen and (max-width: 640px) {
	#corps {
		font-size: 1.4em;
	}
}
@media screen and (max-width: 400px) {
	#corps {
		margin: 0px 0px;
		padding: 0px 0px 0px;
	}
}


/* fil d'ariane */
#filAriane {
	margin: 17px 0px 10px;
	padding: 10px 0px 0px 0px;
	font-size: 0.9em;
	color: #666;
}
#filAriane a {
	color: #666;
	padding: 0px 4px;
}
#filAriane a:hover {
	/*text-decoration: underline;*/
	color: #fc0;
}
#filAriane strong {
	color: #c90;
	font-weight: normal;
	padding: 0px 4px;
}


/************************/
/*			Pages		*/
/************************/

/* page d'accueil */


/* en-tête */
#acc_bloc_intro {
	position: absolute;
	right: 0;
	top: calc(110px - 1vh);
	width: 100vw; 
	text-align: right;
	z-index: 1010;
	background: linear-gradient(to right, rgba(255,255,255,0), rgba(255,255,255,0.6), rgba(255,255,255,0.6));
	background: linear-gradient(to right, rgba(20,80,200,0), rgba(20,80,200,0.6), rgba(20,80,200,0.6));
	background: linear-gradient(to right, rgba(46,88,148,0) 0%, rgba(46,88,148,0.6) 50%, rgba(46,88,148,0.6) 90%, rgba(46,88,148,0) 100%);
}
#acc_bloc_intro h1{
	margin: 0 0 0 auto;
	padding: 1.5em 3em 1.5em 4em;
	/* background-color: rgba(255,255,255,0.6);  */
	/* text-shadow: 2px 2px #fff; */
	font-family: 'roboto_slablight', "RobotoSlab Regular", "Roboto Slab";
	font-family: proximanova_regitalic, sans-serif;
	font-family: lato_light, sans-serif;
	font-variant: small-caps;
	width: 45vw;
	color: #37c;
	color: #036;
	color: #fff;
	font-size: calc(1em + 1.5vw);
	font-weight: 400;
	text-align: right;
	letter-spacing: 4px;
	line-height: 1.2em;
}
@media screen and (max-width: 1024px) {
	#acc_bloc_intro {
		top: 0;
		height: 100%;
	}
}


/* busi */
#acc_bloc_busi {
	position: relative;
	margin: 0px 0px 0px;
	padding: 25px 0px 25px;
	height: 780px;
	width: 100%;
	background: url("style/fond-e_business.png") no-repeat center center scroll;
	background-size: 100% 100%;
}
#acc_fleches_busi {
	position: absolute;
	top: 140px;
	left: 140px;
	margin: 0;
	z-index: 200;
}
#acc_cont_busi {
	position: absolute;
	top: 325px;
	left: 140px;
	z-index: 300;
	width: 400px;
}
#acc_illus_busi {
	position: absolute;
	top: -10%;
	right: -15%;
	margin: 0;
	width: 84%;
	max-width: 1320px;
	z-index: 200;
}
@media screen and (min-width: 1500px) {
	#acc_illus_busi {
		right: -15%;
	}
}
@media screen and (max-width: 1100px) {
	#acc_illus_busi {
		right: -25%;
	}
}
@media screen and (max-width: 980px) {
	#acc_bloc_busi {
		height: auto;
	}
	#acc_fleches_busi {
		display: none;
		position: relative;
	}
	#acc_cont_busi {
		position: relative;
		width: auto;
		top: 0;
		left: 0;
		padding: 80px 0px 0px 80px;
	}
	#acc_illus_busi {
		position: relative;
		width: 70%;
	}
}

/* com */
#acc_bloc_com {
	position: relative;
	margin: 0px 0px 0px;
	padding: 25px 0px 25px;
	height: 780px;
	width: 100%;
	/*background: url("style/fond+illus-com_visuelle.png") no-repeat left center scroll; il faut sortir le stylet de l'image de fond !!*/
	background: url("style/fond-com_visuelle.png") no-repeat center center scroll;
	background-size: 100% 100%;
}
#acc_fleches_com {
	position: absolute;
	top: 140px;
	right: 670px;
	margin: 0;
	z-index: 200;
}
#acc_cont_com {
	position: absolute;
	top: 125px;
	right: 120px;
	right: 7%;
	z-index: 300;
	width: 450px;
}
#acc_illus_com {
	position: absolute;
	bottom: 2%;
	left: 2%;
	margin: 0;
	width: 48%;
	max-width: 723px;
	z-index: 200;
}
@media screen and (min-width: 1500px) {
	#acc_illus_com {
		left: 8%;
	}
}
@media screen and (max-width: 980px) {
	#acc_bloc_com {
		height: auto;
	}
	#acc_fleches_com {
		position: relative;
		display: none;
	}
	#acc_cont_com {
		position: relative;
		width: auto;
		top: 0;
		left: 0;
		padding: 80px 0px 0px 80px;
	}
	#acc_illus_com {
		position: relative;
		width: 60%;
		margin-top: 20px;
	}
}

/* market */
#acc_bloc_market {
	position: relative;
	margin: 0px 0px 0px;
	padding: 25px 0px 25px;
	height: 780px;
	width: 100%;
	background: url("style/fond-marketing.png") no-repeat center center scroll;
	background-size: 100% 100%;
}
#acc_fleches_market {
	position: absolute;
	top: 140px;
	left: 140px;
	margin: 0;
	z-index: 200;
}
#acc_cont_market {
	position: absolute;
	top: 325px;
	left: 140px;
	z-index: 300;
	width: 400px;
}
#acc_illus_market {
	position: absolute;
	top: 5%;
	left: 0px;
	margin: 0;
	width: 117%;
	max-width: 1748px;
	z-index: 200;
}
@media screen and (min-width: 1500px) {
	#acc_illus_com {
		left: 8%;
	}
}
@media screen and (max-width: 980px) {
	#acc_bloc_market {
		height: auto;
	}
	#acc_fleches_market {
		display: none;
		position: relative;
	}
	#acc_cont_market {
		position: relative;
		width: auto;
		top: 0;
		left: 0;
		padding: 80px 0px 0px 80px;
	}
	#acc_illus_market {
		position: relative;
		width: 110%;
		top: 0;
		left: 0;
		margin-left: -200px;
	}
}

/* liens ext */

.acc_bloc_ext {
	background: linear-gradient(#fff 0%, #ddd 50%, #ccc 75%, #eee 100%);
}

/* reclame */
.acc_bloc_reclame {
	position: relative;
	margin: 0px 0px 0px;
	padding: 25px 0px 70px;
	height: auto;
	width: 100%;
	background: #f80 url("style/fond_degrade.png") left bottom no-repeat fixed;
	background-size: 100% 105%;
	background-size: cover;
}
.acc_bloc_reclame p {
	color: #fff;
	text-align: center;
	font-size: 2em;
}
.acc_bloc_reclame p b{
	font-weight: normal;
	font-family: "lato_blackitalic", "Lato Bold Italic", "lato_bolditalic", Arial, Helvetica, sans-serif;
}



/* pages services */


#bloc_entete_1 {
	position: relative;
	margin: 0;
	padding: 67px 0px 67px 4%;
	background: url("style/fond-titre-rubrique.jpg") no-repeat center center scroll;
	background-size: 100% 100%;
	/*font-size: 0.9em;
	height: 350px;*/
}
@media screen and (max-width: 980px) {
	#bloc_entete_1 {
		margin: 0;
		padding: 17px  4% 67px 4%;
	}
}

#serv_rub_intro {
	/* font-weight: bold; */
	margin: 0px 0px;
	padding: 50px 10px;
	font-size: 1.6em;
	border-bottom: 1px solid #ccc;
	/* 2021 */
	text-align: center;
	line-height: 1.6em;
	color: #666;
	font-family: 'lato_light';
	letter-spacing: 1px;
}
#serv_rub_intro span{
	font-weight: normal;
	font-family: 'lato_bold';
	text-transform: none;
	font-variant: small-caps;
	display: block;
	margin: 1em auto 0;
	font-style: italic;
}
@media screen and (max-width: 980px) {
	#serv_rub_intro {
		padding: 20px 40px;
		font-size: 0.8em;
		line-height: 1.3em;
		text-transform: none;
	}
	#serv_rub_intro span{
		display: block;
		margin: 20px 0px;
		font-weight: normal;
		text-transform: none;
		font-variant: small-caps;
	}
}

.serv_rub_service {
	margin: 0px 0px 0px 0px;
	padding: 40px 20px 120px 170px;
	font-size: 1.2em;
}
.serv_rub_service .titre_4{
	padding-left: 100px;
}
.serv_rub_service p{
	padding-left: 100px;
	color: #666;
	line-height: 1.8em;
}
.serv_rub_service b {
	font-family: 'lato_italic';
	font-size: 1.2em;
}
.serv_rub_service table{
	margin-left: 100px;
}
@media screen and (max-width: 980px) {
	.serv_rub_service {
		margin: 0px 0px 0px 0px;
		padding: 30px 10px 30px 40px;
		font-size: 1.2em;
	}
	.serv_rub_service .titre_4{
		padding: 4px 0px 20px 96px;
		font-size: 1.2em;
		line-height: 1.2em;
	}
	.serv_rub_service p{
		padding-right: 20px;
		text-align: justify;
	}
	.serv_rub_service table{
		margin: 10px 10px 10px 0px;
	}
}
@media screen and (max-width: 640px) {
	.serv_rub_service {
		margin: 20px 0px 30px 0px;
		padding: 20px 0px 10px 30px;
		font-size: 1em;
	}
	.serv_rub_service .titre_4{
		margin: 0px 0px 0px 0px;
		padding: 15px 0px 30px 100px;
		font-size: 1.1em;
		line-height: 1.2em;
	}
	.serv_rub_service p{
		margin: 0px 5px 0px 0px;
	}
	.serv_rub_service table{
		margin: 10px 10px 10px 0px;
	}
}

.picto_rond_1 {
	background-image: url("style/picto_rond_1.png");
}
.picto_rond_2 {
	background-image: url("style/picto_rond_2.png");
}
.picto_rond_3 {
	background-image: url("style/picto_rond_3.png");
}
.picto_rond_4 {
	background-image: url("style/picto_rond_4.png");
}
.picto_rond_animationlogo {
	background-image: url("style/pictos/ico_animationlogo.png");
}
.picto_rond_campagnedepub {
	background-image: url("style/pictos/ico_campagnedepub.png");
}
.picto_rond_catalogueenligne {
	background-image: url("style/pictos/ico_catalogueenligne.png");
}
.picto_rond_chartegraphique {
	background-image: url("style/pictos/ico_chartegraphique.png");
}
.picto_rond_cms {
	background-image: url("style/pictos/ico_cms.png");
}
.picto_rond_communitymanagement {
	background-image: url("style/pictos/ico_communitymanagement.png");
}
.picto_rond_clients {
	background-image: url("style/pictos/ico_crm.png");
}
.picto_rond_developpement {
	background-image: url("style/pictos/ico_developpement.png");
}
.picto_rond_demandededevisenligne {
	background-image: url("style/pictos/ico_demandededevisenligne.png");
}
.picto_rond_marketingparlejeu {
	background-image: url("style/pictos/ico_marketingparlejeu.png");
}
.picto_rond_modulesdecom {
	background-image: url("style/pictos/ico_modulesdecom.png");
}
.picto_rond_newsletter {
	background-image: url("style/pictos/ico_newsletter.png");
}
.picto_rond_outilsdegestion {
	background-image: url("style/pictos/ico_outilsdegestion.png");
}
.picto_rond_print {
	background-image: url("style/pictos/ico_print.png");
}
.picto_rond_redactionnel {
	background-image: url("style/pictos/ico_redactionnel.png");
}
.picto_rond_referencement {
	background-image: url("style/pictos/ico_referencement.png");
}
.picto_rond_sitevitrinecorporate {
	background-image: url("style/pictos/ico_sitevitrinecorporate.png");
}
.picto_rond_tournagevideo {
	background-image: url("style/pictos/ico_tournagevideo.png");
}
.picto_rond_cahier {
	background-image: url("style/pictos/ico_cahier.png");
}
.picto_rond_financement {
	background-image: url("style/pictos/ico_euro.png");
}
.picto_rond_retd {
	background-image: url("style/pictos/ico_recherche.png");
}
.picto_rond_maintenance {
	background-image: url("style/pictos/ico_maintenance.png");
}
.picto_rond_conseil {
	background-image: url("style/pictos/ico_conseil.png");
}
.picto_rond_ticket {
	background-image: url("style/pictos/ico_etiquette.png");
}
/* le produit mis en valeur */
.serv_rub_service_far { 
	margin: 70px 0px 50px 0px;
	padding: 40px 40px 40px 45%;
	font-size: 1.6em;
	color: #fff;
	background: #ff9900;
	position: relative;
}
.serv_rub_service_far .titre_4{
	color: #fff;
}
.serv_rub_service_far .illus_service_far{
	position: absolute;
	top: -50px;
	left: -39%;
	width: 83%;
}
@media screen and (max-width: 980px) {
	.serv_rub_service_far { 
		margin: 70px 0px 50px 0px;
		padding: 30px 30px 40px 0;
		font-size: 1.4em;
		color: #fff;
	}
	.serv_rub_service_far .titre_4{
		padding: 30px 30px 40px 45%;
		color: #fff;
	}
	.serv_rub_service_far p{
		padding: 40px 30px 40px 40px;
		font-size: 0.8em;
		text-align: justify;
	}
	.serv_rub_service_far .illus_service_far.ill_far_com{
		top: -100px;
	}
	.serv_rub_service_far .illus_service_far.ill_far_market{
		top: -120px;
		left: -30%;
		width: 80%;
	}
}
@media screen and (max-width: 640px) {
	.serv_rub_service_far { 
		margin: 120px 0px 50px 0px;
		padding: 0px 30px 20px 0;
		font-size: 1.2em;
		color: #fff;
	}
	.serv_rub_service_far .titre_4{
		padding: 30px 30px 40px 45%;
		color: #fff;
	}
	.serv_rub_service_far p{
		padding: 10px 20px 20px 40px;
		font-size: 0.9em;
	}
	.serv_rub_service_far .illus_service_far.ill_far_com{
		top: -100px;
	}
	.serv_rub_service_far .illus_service_far.ill_far_market{
		top: -110px;
		left: -35%;
		width: 80%;
	}
}

/* header des rubrique : titres et grosses fleches */

.entete_1_titre {
	float: left;
}
.rub_titre_busi {
	margin: 35px 2% 10px 0px;
}
.rub_titre_com {
	margin: 25px 4% 0px 0px;;
}
.rub_titre_market {
	margin: 35px 6% 10px 0px;
}
@media screen and (max-width: 980px) {
	.rub_titre_busi, .rub_titre_com, .rub_titre_market {
		margin: 0px 4% 0px 4%px;
	}
}

/* animation des grosses fleches */
@-webkit-keyframes AutoSlide_1 {
    0% {opacity: 0.4;}
	25%, 75% {opacity: 1;}
    100% {opacity: 0.5;}
}
@-moz-keyframes AutoSlide_1 {
    0% {opacity: 0.5;}
	25%, 75% {opacity: 1;}
    100% {opacity: 0.5;}
}
@keyframes AutoSlide_1 {
    0% {opacity: 0.4;}
	30%, 60% {opacity: 1;}
    100% {opacity: 0.4;}
}

.entete_1_fleches {
	float: left;
}
.fleche_anim {
	opacity: 0.4;
	-webkit-animation-duration: 2s;
	-moz-animation-duration: 2s;
	animation-duration: 2s;
	/*CSS3 webkit keyframes animation*/
	-webkit-animation-name: AutoSlide_1;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-timing-function: ease-in-out;
	/*CSS3 moz keyframes animation*/
	-moz-animation-name: AutoSlide_1;
	-moz-animation-iteration-count: infinite;
	-moz-animation-timing-function: ease-in-out;
	/*CSS3 W3C keyframes animation*/
	animation-name: AutoSlide_1;
	animation-iteration-count: infinite;
	animation-timing-function: ease-in-out;
}
.fleche_busi {
	margin: 25px 4% 25px 0px;
}
.fleche_com {
	margin: 30px 7% 30px 0px;
}
.fleche_market {
	margin: 25px 7% 25px 0px;
}
@media screen and (max-width: 980px) {
	.fleche_busi, .fleche_com, .fleche_market {
		margin: 30px 0px 0px 20px;
	}
}
@media screen and (max-width: 640px) {
	.fleche_busi, .fleche_com, .fleche_market {
		margin: 20px 0px 0px 10px;
		width: 90px;
	}
}

#col_menu {
	float: right;
	width: 300px;
	margin: 0px 0px 20px 50px;
}
#col_menu_corps {
	background-color: #efefef;
	padding: 0px 0px 20px 0px;
	border: 1px solid #e0e0e0;
}
#nav_serv {
	padding: 0px 0px 40px 0px;
}

/* page témoignage */

.tem_txt {
	margin: 0px 0px 20px;
	padding: 0px;
}
.tem_txt  blockquote{
	margin: 2px 0px 30px;
	font-size: 1.6em;
	color: #444;
}
.tem_txt  blockquote sub{
	color: #fa0;
	font-weight: bold;
	line-height: 1.4ex;
	font-size: 1.7em;
}


/* page actualités */

.rap_actu {
	display: block;
	margin: 10px 0px 10px;
	padding: 20px 0px 20px;
	background-color: transparent;
	transition: 0.6s;
}
.rap_actu:hover {
	background-color: #F3F3F3;
}
.rap_actu_titre {
	margin: 10px 0px 0px;
	padding: 0px 0px 5px 40px;
	line-height: 1.2em;
	font-family: 'montserratregular', "Montserrat", sans-serif;
	font-size: 1.6em;
	font-weight: normal;
	font-style: normal;
	text-transform: uppercase;
	color: #fa0;
	background: url("style/ico-bulle.png") no-repeat left 4px scroll;
	transition: 0.4s;
}
.rap_actu_titre  a{
	color: #fa0;
}
.rap_actu_titre  a:hover{
	color: #f90;
}
.rap_actu:hover .rap_actu_titre {
	margin-left: 40px;
	color: #f90;
}
.rap_actu_intro {
	margin: 4px 40px;
	padding: 0px;
	font-size: 1.6em;
	color: #666;
}
.rap_actu_date {
	font-family: 'montserratbold', "Montserrat Bold", "Montserrat", sans-serif;
	font-size: 0.6em;
	text-transform: uppercase;
	color: #555;
}

.rap_voir_all {
	color: #7cc576;
	text-decoration: none;
	font-family: 'montserratregular', "Montserrat", sans-serif;
	text-transform: uppercase;
	padding-left: 0px;
	transition: 0.4s;
}
.rap_voir_all:hover {
	padding-left: 20px;
	color: #393;
}
.rap_voir_all span {
	font-size: 1.4em;
}
/* 2nde version */
.acc_actu_rap_lien {
	display: block;
	clear: both;
	height: 214px;
	padding: 40px 0px 40px 0px;
	border-top: 1px solid #fff;
	border-bottom: 1px solid #fff;
	background: transparent;
	transition: 0.4s;
}
.acc_actu_rap_lien:first-child {
	border-top: 1px solid #fff;
}
.acc_actu_rap_lien:last-child {
	border-bottom: 1px solid #fff;
}
.acc_actu_rap_lien:hover{
	background: #eee;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	padding: 40px 0px 40px 40px;
}

.acc_actu_img_cadre {
	float: left;
	display: block;
	margin: 0px 14px 10px 0px;
	padding: 10px;
	width: 250px;
	height: 150px;
	border: 1px solid #fff;
	transition: 0.6s;
}
.acc_actu_img {
	display: inline-block;
	margin: 0px;
	padding: 0px;
	width: 250px;
	height: 150px;
	overflow: hidden;
}
.acc_actu_img img {
	width: 250px;
}
.acc_actu_rap_lien:hover .acc_actu_img_cadre  {
	margin-right: 30px;
	background: #ccc;
	border: 1px solid #bbb;
}

.acc_actu_txt_glob {
	float: left;
	display: block;
	margin: 10px 0px 0px 14px;
	padding: 0px 0px;
	width: 520px;
	height: 210px;
	overflow: hidden;
}
.acc_actu_date {
	display: block;
	color: #999;
	font-size: 0.9em;
	margin: 0px 0px 10px;
	padding: 0px 0px 0px 18px;
	background: url("style/trombone.png") no-repeat left center scroll;
}
.acc_actu_txt{
	display: block;
	/*height: 110px;
	overflow: hidden;*/
}
.acc_actu_titre {
	display: block;
	color: #999;
	font-size: 1.4em;
	margin: 0px;
	font-family: open_sanssemibold, sans-serif;
	text-transform: uppercase;
}
.acc_actu_intro {
	display: block;
	margin: 10px 0px;
	padding: 0px;
	color: #666;
	font-size: 1em;
	font-family: 'lato_light';
	line-height: 1.4em;
}
.acc_actu_plus {
	display: block;
	color: #f90;
	font-family: open_sansbold, sans-serif;
	font-size: 0.9em;
	margin: 8px 0px 0px;
	padding: 0px 0px 0px 14px;
	background: url("style/fleche_1.png") no-repeat left center scroll;
	text-transform: uppercase;
}

@media screen and (max-width: 980px) {
	.acc_actu_titre {
		line-height: 1em;
	}
	.acc_actu_intro {
		display: none;
	}
	.acc_actu_plus {
		display: none;
	}
}


/*		CONSULT		*/

#actu_article {
	margin: 55px auto 70px;
}
.actu_img {
	float: right;
	margin: 10px 0px 10px 40px;
	padding: 10px;
	width: 400px;
	background: #eee;
	border: 1px solid #ccc;
}
.actu_date {
	font-size: 0.8em;
	font-weight: normal;
	font-style: italic;
	color: #999;
}
.actu_clefs {
	
}
.actu_clefs a{
	color: #c30;
	color: #909396;
	font-family: lato_italic, sans-serif;
	font-size: 0.8em;
	padding: 0 1em 0 0;
}
.actu_clefs a::before {
	content: "\00023";
	padding: 0 0 0 0;
}
.actu_clefs a:hover{
	color: #036;
}

.actu_intro {
	margin: 0px 0px 20px;
	padding: 0px;
	font-size: 1.2em;
	line-height: 1.6em;
	color: #333;
}
.actu_txt {
	margin: 37px 0px 20px 0px;
	padding: 0px 0px 0px 0px;
	font-family: open_sanssemibold, sans-serif;
    font-family: 'lato_light', sans-serif;
	font-size: 1.2em;
	text-align: justify;
	line-height: 1.6em;
	color: #333;
}
.actu_lien {
	display: inline-block;
	margin: 2em 0px;
	padding: 0em 2em 0em 0em;
    font-style: italic;
	font-size: 0.9em;
	color: #369;
	color: #5c595c;
	border: 1px solid #258;
}
.actu_lien span {
	display: inline-block;
	margin: 0px 2em 0px 0px;
	padding: 1em 2em 1em 2em;
	color: #258;
	background: #e0e3e6;
}
.actu_lien:hover {
	color: #555;
	color: #fff;
	background: #258;
}


/************************/
/*	CORPS page CONTACT 
(les colones sont : "col_plan", "col_adresse" et "col_message")	*/
/************************/

#col_plan {
	display: block;
	float: left;
	width: 300px;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
}
#carte {
	display: none;
	position: absolute;
	top: 111px;
	left: 50px;
	height: 500px;
	width: 600px;
	border: 1px solid #000;
	z-index: 1000;
}
.fermer-carte {
	background: #000;
	line-height: 16px;
	height: 18px;
	padding-right: 1px;
	color: #ccc;
	font-size: 11px;
	font-weight: bold;
	text-align: right;
}
.fermer-carte a {
	color: #ccc;
	display: block;
}
.fermer-carte a:hover {
	color: #fff;
	text-decoration: none;
}
.cadreX {
	border: 1px #aaa solid;
	padding: 0px 3px;
}

#col_adresse {
	display: block;
	margin: 0px 0px 0px 0px;
	padding: 0px;
}
.raisonSociale {
	margin: 0px 0px 0px 20px;
	font-size: 1.4em;
	font-weight: normal;
	color: #666;
}
.coordonnees {
	margin: 0px 0px 40px 20px;
	font-size: 14px;
}


/*	formulaire	 */

#col_message {
	/*width: 955px;*/
	margin: 0px auto 40px auto;
	padding: 0px 0px 0px 0px;
}

.form_message {
}
.form_contact {
	width: 500px;
	margin: 0px 0px 40px 0px;
}
.form_devis {
	/*width: 955px;*/
}
.form_devis p {
	margin: 10px 0px 10px 0px;
	padding: 0px 0px 0px 0px;
	line-height: 1.2em;
}
.form_message fieldset.jeux_1 {
	float: left;
	width: 280px;
	border: 1px solid #ccc;
	margin: 0px 1% 10px 0px;
	padding: 2px 10px 10px;
}
@media screen and (max-width: 980px) {
	.form_message fieldset.jeux_1 {
		float: none;
		width: auto;
		border: 1px solid #ccc;
		margin: 0px 1% 10px 0px;
		padding: 2px 10px 10px;
	}
}
.form_message fieldset.jeux_1 legend{
	color: #f5bb02;
	font-weight: bold;
	padding: 0px 1em;
}

.form_message label {
	display: block;
	border: 1px solid #e0e0e0;
	background: #efefef;
	margin: 0px 0px 1vh;
	padding: 1vh 1em;
	font-size: 0.9em;
	color: #888;
}
.form_message label.labWilde {
	background: transparent;
	border: none;
}
.form_message label.labSmart {
	background: transparent;
	border: none;
	display: inline;
	padding: 1px 4px 1px 4px;
}

.form_message .entree {
	background: transparent;
	line-height: 11px;
	padding: 0;
	border: 0;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1em;
	width: 75%;
}
.form_message .selectionWilde {
	background: transparent;
	line-height: 11px;
	padding: 0;
	border: 0;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1em;
	width: 83%;
}
.form_message .selectionLite {
	background: transparent;
	line-height: 11px;
	padding: 0;
	border: 0;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1em;
}

.form_message .codespam {
	background: #dfdfdf;
	line-height: 1em;
	padding: 0px 4px;
	border: 1px solid #ccc;
	font-size: 1em;
	width: 2ex;
}
.form_message .area {
	height: 40px;
	width: 100%;
	font-size: 1em;
	font-family: Arial, Helvetica, sans-serif;
}
.form_message .area_2 { /* non utilisé */
	height: 60px;
}
.form_message .area_3 {
	height: 135px;
}
.form_message #Envoyer {
	display: block;
	width: 100%;
	background: #999;
	background: #fa0;
	border: 1px solid #8f8f8f;
	border-bottom: 1px solid #808080;
	border-right: 1px solid #838383;
	border: none;
	/*background: none;*/
	margin: 0px;
	padding: 0px 6px 0px;
	line-height: 1.8em;
	height: 2.2em;
	color: #fff;
	font-size: 1em;
	font-weight: normal;
	text-align: center;
	cursor: pointer;
}
.form_message #Envoyer:hover {
	background: linear-gradient(#fd6 0%, #fc0 30%, #f90 60%, #c60 100%);
	background: #6c6;
	background: #0a8;
	border: 1px solid #fc0;
	border-bottom: 1px solid #c90;
	border-right: 1px solid #f90;
	border: none;
}


label.labinline {
	display: inline;
}
label.labinline input{
	width: auto;
	border: none;
}


/****************************/
/* 			PARTENAIRES		*/
/****************************/

/* le conteneur */
.rap_lien {
	display: block;
	clear: left;
	color: #000;
	border-bottom: 1px solid #eee;
	padding: 30px 40px;
}
.rap_lien.rap_lien_2 {
	background: #fefcf6;
}
.rap_lien:last-child {
	border-bottom: none;
}

/* les contenus */
.rap_lien_img {
	float: left;
	width: 200px;
	margin: 0px 60px 0px 0px;
}
.rap_lien_img img {
	width: 200px;
}
.rap_lien_contenu {
	float: left;
	width: 600px;
	margin: 0px 0px 0px 0px;
}
.rap_lien_titre {
	font-family: 'roboto_slabregular', "RobotoSlab Regular", "Roboto Slab", serif;
	font-size: 2.4em;
	margin: 0px;
	color: #000;
}
.rap_lien_intro {
	font-family: 'lato_italic';
	font-size: 1.2em;
	line-height: 1.6em;
	color: #666;
	margin: 1vh 0px;
}
.rap_lien_texte {
	font-size: 1em;
	line-height: 1.8em;
	margin: 15px 0px;
	color: #666;
	font-family: "lato_light";
	letter-spacing: 1px;
}

@media screen and (max-width: 980px) {
	.rap_lien {
		text-align: center;
	}
	.rap_lien_img {
		float: none;
		margin: 0px 0px 20px 0px;
		width: auto;
	}
	.rap_lien_contenu {
		float: none;
		margin: 20px 40px 20px 40px;
		width: auto;
	}
}



/****************************/
/* 			TITRES 			*/
/****************************/

/*
.titre-page {
	width: 500px;
	height: 130px;
	margin: 26px 0px 24px;
	margin: 0px 0px 4px;
	padding: 5px 0px 17px 0px;
	padding: 50px 200px 20px 67px;
	font-size: 28px;
	font-weight: normal;
	font-style: italic;
	text-align: center;
	color: #333;
	color: #fff;
	font-family: serif;
	background: url(style/fond_bulle.png) no-repeat left center scroll;
}
*/
.titre-page {
	margin: 0px 0px 16px;
	padding: 0px 0px 0px 0px;
	font-size: 2.7em;
	font-weight: normal;
	font-style: italic;
	text-align: left;
	line-height: 1em;
	color: #000;
	background: none;
}
.titre-page  small{
	font-weight: normal;
	color: #aaa;
	font-size: 22px;
}

.titre-page-contact {
	width: auto;
	height: auto;
	margin: 26px 0px 24px;
	padding: 5px 0px 17px 0px;
	font-size: 28px;
	font-weight: normal;
	font-style: italic;
	text-align: left;
	color: #333;
	font-family: serif;
	/*border-top: 1px solid #333;*/
	border-bottom: 1px solid #ccc;
}


.titre_1 {
	margin: 5px 0px 0px;
	padding: 0px 0px 0px 0px;
	line-height: 1em;
	font-family: "proximanova_extrabold", "Proximanova Extrabold", Arial, Helvetica, sans-serif;
	font-size: 3.5em;
	font-weight: normal;
	font-style: normal;
	/*text-transform: uppercase;*/
	color: #303030;
}
.titre_1.titre_page {
	font-size: 3em;
}
@media screen and (max-width: 980px) {
	.titre_1.titre_page {
		font-size: 2.4em;
	}
}
@media screen and (max-width: 640px) {
	.titre_1.titre_page {
		line-height: 0.8em;
		font-size: 2em;
		margin: 0px 0px 30px;
	}
}
.titre_2 {
	margin: 5px 0px 0px;
	padding: 0px 0px 0px 0px;
	line-height: 1em;
	font-family: "lato_light";
	font-size: 1.7em;
	font-weight: normal;
	font-style: italic;
	color: #303030;
}
.titre_2.sous_titre_page {
	font-size: 1.4em;
}
@media screen and (max-width: 980px) {
	.titre_2.sous_titre_page {
		font-size: 1.2em;
	}
}
.titre_2 a{
	color: #fa0;
}
.titre_2 a:hover{
	color: #f60;
}
.titre_3 {
	margin: 30px 0px 0px;
	padding: 0px 0px 0px 0px;
	font-size: 2em;
	font-weight: normal;
	font-style: normal;
	color: #243;
	line-height: 1em;
}
.titre_4 { /* titres avec picto à gauche */
	line-height: 77px;
	font-family: "Lato-Bold", "Lato Bold", Arial, Helvetica, sans-serif;
	font-size: 1.7em;
	font-weight: bold;
	font-style: normal;
	color: #ffaa00;
	background-position: left top;
	background-repeat: no-repeat;
	
}

.titre_5 {
	margin: 10px 0px 10px;
	padding: 0px 0px 0px;
	line-height: 1.4em;
	font-family: 'montserratbold', "Monserrat Bold", "Monserrat", Arial, Helvetica, sans-serif;
	font-size: 1.1em;
	font-weight: normal;
	font-style: normal;
	color: #fff;
	text-align: left;
	text-transform: uppercase;
}
.titre_5 a  {
	color: #fff;
}
.titre_6 {
	margin: 40px 0px 20px;
	padding: 0px 0px 0px 0px;
	line-height: 1.0em;
	font-family: 'montserratregular', "Montserrat", sans-serif;
	font-family: 'montserratbold', "Monserrat Bold", "Monserrat", Arial, Helvetica, sans-serif;
	font-size: 2em;
	font-weight: normal;
	font-style: normal;
	text-transform: uppercase;
	text-align: left;
	color: #4c4c4c;
}
.titre_7 {
	margin: 10px 0px 40px;
	padding: 0px 0px 0px 0px;
	line-height: 1.2em;
	font-family: 'montserratbold', "Monserrat Bold", "Monserrat", Arial, Helvetica, sans-serif;
	font-size: 1.6em;
	font-weight: normal;
	font-style: normal;
	text-transform: uppercase;
	text-align: left;
	color: #fa0;
}
.titre_8 {
	margin: 30px 0px 20px;
	padding: 0px 0px 0px 20px;
	line-height: 1em;
	font-family: 'montserratbold', "Monserrat Bold", "Monserrat", Arial, Helvetica, sans-serif;
	font-size: 1em;
	font-weight: bold;
	font-style: normal;
	text-transform: uppercase;
	text-align: left;
	color: #fa0;
}
.titre_9 {
	margin: 30px 0px 0px;
	padding: 0px 0px 0px 0px;
	line-height: 1em;
	font-family: 'montserratbold', "Monserrat Bold", "Monserrat", Arial, Helvetica, sans-serif;
	font-size: 1em;
	font-weight: bold;
	font-style: normal;
	text-transform: uppercase;
	text-align: left;
	color: #fa0;
}

.fondG {
	background: url(style/guepard-d.png) no-repeat left 5px scroll;
	padding-top: 26px;
}
.fondGC {
	background: url(style/guepard-g.png) no-repeat center 6px scroll;
	padding-top: 26px;
}

/* paragraphes */

.commentaire_1 {
	font-size: 0.8em;
	font-style: italic;
	font-weight: normal;
	color: #999;
}
.txt_page_intro {
	font-size: 1.1em;
	font-weight: bold;
	text-align: justify;
	color: #444;
	margin: 0px 0px 40px;
}
.article {
	margin: 0px 0px 30px;
}
.page_intro_1 {
	margin: 0px 0px 20px;
	font-size: 0.8em;
	font-style: italic;
	font-weight: normal;
	color: #666;
}
.txt_redac { /* pour tout bloc/section largement sans mise en forme */
	line-height: 1.8em;
}

/*	alignement textes et images	 */

.alignD {
	float: right;
	margin: 0px 0px 20px 40px;
}
.alignG {
	float: left;
	margin: 0px 40px 20px 0px;
}
.alignC {
	text-align: center;
}
.alignJ {
	text-align: justify;
}

.cadre_1 {
	border: 1px solid #333;
}
.cadre_2 {
	background-color: #eee;
	padding: 4px;
	box-shadow: 0px 0px 2px 2px #ddd inset;
	border: 1px solid #ccc;
}
.cadre-3 {
	margin: 0px 0px 0px 0px;
	padding: 0px 7px 7px 0px;
	background: url(style/ombre-3.gif) no-repeat right bottom scroll;
}
.cadre-4 {
	margin: 0px 0px 0px 0px;
	padding: 0px 11px 11px 0px;
	background: url(style/ombre-4.gif) no-repeat right bottom scroll;
}


/*	lignes de separation	*/

.ligne_1 {
	clear: both;
	margin: 10px 0px;
	padding: 0px;
	line-height: 1px;
	background: #000;
	border: none;
	border-top: 1px solid #000;
	border-bottom: 1px solid #222;
}
.ligne_2 {
	clear: both;
	margin: 5px 0px;
	padding: 0px;
	line-height: 1px;
	border: none;
	border-bottom: 1px dashed #ccc;
}
.ligne-3 {
	margin: 50px 0px;
	padding: 4px;
	line-height: 8px;
	border: none;
	border: 0;
	border-color: transparent;
	background: url(style/ombre-3.png) no-repeat center center scroll;
}

/* petites colonnes */
.bloc_1 {
	margin: 0px 0 10px 0;
	padding: 5px 0px 5px 0;
	width: 49%;
	float: left;
}
.bloc_2 {
	margin: 0px 0px 10px 0;
	padding: 5px 0 5px 5%;
	width: 46%;
	float: left;
}
.col_list_1 {
	width: 170px; 
	float: left;
}
.col_list_2 {
	width: 250px; 
	float: left;
}
.col_list_1 ul, .col_list_2 ul{
	margin: 0px 5px 20px 5px;
	padding: 0px 0px 0px 10px;
}

.pave_1 { /* non utilisé */
	margin: 30px 0px 40px;
	padding: 8px 4px 10px 4px;
	line-height: 22px;
	font-size: 20px;
	font-weight: normal;
	text-align: center;
	border: 1px dashed #bbb;
	box-shadow: 2px 2px 5px #999;
	background: #eee;
	color: #222;
}
.pave_1 strong{
	color: #222;
}
.pave_2 { /* 2021 : n'est plus utilisé */
	margin: 0px 40px 0px 40px;
	padding: 5px 10px 5px 10px;
	text-align: center;
	font-size: 1.4em;
	line-height: 1.3em;
	color: #666;
	text-transform: uppercase;
}

.medaillon_1 {
	display: inline-block;
	width: 180px;
	height: 180px;
	margin: 0px 40px 0px 40px;
	padding: 20px 20px 20px 20px;
	/*background: #fff;
	color: #999;
	background: #999;*/
	color: #fff;
	text-align: center;
	border-radius: 50%;
	font-family: "lato_blackitalic", "Lato Bold Italic", "lato_bolditalic", Arial, Helvetica, sans-serif;
	font-size: 0.7em;
}
.medaillon_1 img{
	filter: invert(100%);
}
@media screen and (max-width: 980px) {
	.medaillon_1 {
		display: block;
		width: auto;
		height: auto;
		margin: 0px auto;
		font-size: 1.2em;
	}
	.medaillon_1 img{
		display: block;
		margin: 0px auto;
		width: 150px;
	}
}
/* tables */

.tableau_1 {
	border: 1px solid #000;
	border-collapse: collapse;
}
.tableau_1 td{
	border: 1px solid #666;
	padding: 2px 8px;
}
tr.thead2 td{
	padding: 20px 8px;
	font-weight: bold;
}

/* listes */

.liste_1 { /* gros picto domaines d'activité - pas encore utilisé pour Ogam */
	margin: 20px 0px 80px;
	padding: 40px 0px 40px 0px;
	text-align: center;
	background-color: #F6F6F6;
}
.liste_1 li {
	display: inline-block;
	list-style: none;
	list-style-image: none;
	width: 160px;
	height: 10px;
	margin: 0px 10px;
	padding: 0px 0px 0px 0px;
	line-height: 2.2em;
	font-family: 'montserratbold', "Montserrat Bold", "Montserrat", sans-serif;
	font-size: 1.2em;
	text-align: center;
	text-transform: uppercase;
	color: #4c4c4c;
}
.liste_1 li a {
	color: #ccc;
}
.liste_1 li a:hover{
	color: #333;
}


.liste_2 {
	margin: 20px 0px 40px 20px;
	padding: 5px 0px 5px 0px;
}
.liste_2.liste_ebusiness {
	float: left;
	margin: 25px 0px 10px 0px;
}
.liste_2 li {
	margin: 0px 0px 0px 0px;
	padding: 5px 0px 5px 5px;
	line-height: 1.2em;
	font-weight: normal;
	font-size: 1em;
	color: #666;
}
#bloc_entete_1 .liste_2 li {
	letter-spacing: 2px;
}
.liste_2 li a {
	color: #000;
}
.liste_2 li a:hover{
	color: #2c2;
}
@media screen and (max-width: 980px) {
	.liste_2 {
		margin: 20px 0px 10px 10px;
		padding: 10px 0px 5px 10px;
		list-style-position: inside;
	}
	.liste_2.liste_ebusiness {
		float: left;
		margin: 20px 0px 0px 10px;
	}
	.liste_2 li {
		line-height: 1.2em;
		font-size: 1em;
		font-size: 4vw;
		color: #666;
	}
	.liste_2 li a {
		color: #000;
	}
	.liste_2 li a:hover{
		color: #2c2;
	}
}
@media screen and (max-width: 640px) {
}

.liste_3 {
	margin: 3px 0px 20px 0px;
	padding: 3px 0px 5px 5px;
}
.liste_3 li {
	margin: 0px 0px 0px 12px;
	padding: 0px 0px 0px 8px;
	list-style-type: circle;
	line-height: 1.4em;
	font-weight: normal;
	font-size: 13px;
	color: #fff;
}

ul#acc_serv_list {
	width: 310px;
	list-style: none;
	list-style-image: none;
	margin: 0px 0px 0px 0px;
	padding: 0px;
	border-top: 1px solid #f00;
}
ul#acc_serv_list li  {
	list-style: none;
	list-style-image: none;
	margin: 0px 0px 0px 0px;
	padding: 10px 0px 10px 4px;
	border-bottom: 1px solid #900;
	line-height: 60px;
	font-size: 16px;
	font-weight: normal;
}
ul#acc_serv_list li a {
	color: #ccc;
}
ul#acc_serv_list li a:hover{
	color: #f00;
}
ul#acc_serv_list li  img{
	float: right;
}

.serv_list_complete { /* attention liste récursive */
	
}
.serv_list_complete a { 
	color: #000;
}
.serv_list_complete a:hover{ 
	color: #fc0;
}

/*	liens et bouton */

.lien_1 {
	color: #e80;
	text-decoration: none;
}
.lien_1:hover {
	color: #f90;
}

.lien_2 {
	color: #7cc576;
	text-decoration: none;
	font-family: 'montserratregular', "Montserrat", sans-serif;
	text-transform: uppercase;
}
.lien_2:hover {
	color: #393;
}
.lien_2 span {
	font-size: 1.4em;
}

/* Boutons */
.bt_1 {
	display: inline-block;
	padding: 0px 22px;
	color: #fff;
	text-transform: uppercase;
	text-align: center;
	font-size: 0.8em;
	line-height: 3.0em;
}
.bt_1:hover {
	text-decoration: none;
	background-color: #666;
}
@media screen and (max-width: 1024px) {
	.bt_1 {
		margin: 20px 0px;
		padding: 0px 60px;
		font-size: 1.5em;
		line-height: 2.0em;
	}
}
.bt_2 {
	display: inline-block;
	padding: 0px 22px;
	text-transform: uppercase;
	text-align: center;
	font-size: 0.8em;
	line-height: 3.0em;
	color: #666;
	border: 1px solid #666;
}
.bt_2:hover {
	text-decoration: none;
	color: #fff;
	border: 1px solid #eee;
}
.bt_2_2 {
	color: #999;
	border: 1px solid #999;
}

/* Liens */
.lien_4 {
	display: block;
	font-family: 'montserratregular', "Montserrat", sans-serif;
	background-color: #7cc576;
	background-color: #0a8;
	border: 1px solid #098;
	box-shadow: 0px 0px 5px 5px #098 inset;
	text-align: center;
	line-height: 4em;
	text-transform: uppercase;
	color: #fff;
}
.lien_4:hover {
	text-decoration: none;
	background-color: #097;
	box-shadow: none;
}

.lien_retour {
	display: inline-block;
	margin: 10px 0px 20px;
}

/* couleurs génériques */
.txt_coul_0 {
	color: #777;
}
.txt_coul_1 {
	color: #ff9e00;
}
.fond_coul_1 {
	background-color: #ffad00;
}
.txt_coul_2 {
	color: #00bd9a;
}
.fond_coul_2 {
	background-color: #00ad8d;
}
.txt_coul_3 {
	color: #f75769;
}
.fond_coul_3 {
	background-color: #f75769;
}
.txt_coul_4 {
	color: #786;
}
.fond_coul_4 {
	background-color: #786;
}

/* autres paragraphes */
p.comment {
	font-size: 0.8em;
	font-weight: normal;
}
.alert_bad {
	color: #f30;
	font-weight: bold;
}
.alert_good {
	color: #c90;
	color: #7cc576;
	font-weight: bold;
}

/* afficher les légendes sur les photos */
.aff_info {
	position: relative;
	z-index: 100;
}
.aff_info span{
	display: none;
}
.aff_info span i{
	font-size: 0.7em;
}
.aff_info:hover span{
	display: inline-block; 
	z-index: 200;
	position: absolute; 
	bottom: 5px; 
	left: 5px; 
	margin: 0px 5px 5px 0px;
	padding: 20px;
	background-color: rgba(255, 255, 255, 0.5); 
	color: #000;
}

/* effets seuls */
.eff_on_rotate {
	transition: 1s;
}
.eff_on_rotate:hover {
	transform:scaleX(-1);
	transition: 0.6s;
}

/* POP UP */
#popup {
	display: none;
	position: absolute;
	bottom: 0px;
	left: 0px;
	border: 1px solid #ccc;
	z-index: 1000;
	text-align: center;
}
#popup .fermer_popup {
	display: none; 
}
#popup:hover .fermer_popup {
	display: inline-block; 
	background: rgba(255,255,255,0.5);
	position: absolute; 
	top: 4px; 
	right: 4px; 
	z-index: 1400;
	line-height: 16px;
	height: 18px;
	padding: 2px 8px 2px;
	margin: 0px;
	color: #666;
	font-size: 11px;
	font-weight: normal;
	text-align: right;
}


/* 	OG-DIAP 1.2 */
/* diaporama css */

/* contenant */
.og_diap_contenant {
    position: relative;
    margin:  0px;
}
.og_diap_contenant figcaption {  
	display: inline-block; 
	z-index: 200;
	position: absolute; 
	bottom: 5px; 
	left: 5px; 
	margin: 0px 5px 5px 0px;
	padding: 20px;
	background-color: rgba(255, 255, 255, 0.5); 
	color: #000;
}
.og_diap_contenant figcaption i{
	font-size: 0.7em;
}
/*
.og_diap_contenant figcaption {  
    position:absolute;  
    left:0; right:0; bottom: 5px;  
    padding: 20px;  
    margin:0;  
    border-top: 1px solid rgb(225,225,225);  
    text-align:center;  
    letter-spacing: 0.05em;  
    word-spacing: 0.05em;  
    font-family: Georgia, Times, serif;  
    background: #fff;  
    background: rgba(255,255,255,0.7);  
    color: #555;  
    text-shadow: -1px -1px 0 rgba(255,255,255,0.3);  
} 
*/

/* contenu parachute */
.og_diap_parachute {
    position: absolute;
	top: 0px;
	left: 0px;
    margin: 0;            
    padding: 0;
}
.og_diap_parachute figure {
  	z-index: 400;
    position: absolute;
	top: 0px;
	left: 955px; /* doit correspondre à diap_width, donc il faut le mettre dans la fonction qui construit les diap, donc le code ira dans la page Html et non ici */
	margin: 0;
    padding: 0;
	transition: 1s;
}
.og_diap_parachute figcaption {  
	z-index: 500;
}
/* contenu défilant */
.og_diap_contenu { /*display: none;*/
    position: absolute;
	top: 0;
    left: 0;
    margin: 0;            
    padding: 0;
}
.og_diap_contenu figure {
	z-index: 100;
    display: inline;
    position: relative;
	margin: 0;
    padding: 0;
}
/* bt nav */
.og_diap_nav_1 {
	z-index: 600;
	position: absolute;
	bottom: 10px;
	right: 10px;
}
.og_diap_bt {
	display: inline-block;
	background: rgba(255, 255, 255, 0.5);
	border: 1px solid #fff;
	border-radius: 4px;
	padding: 2px;
	height: 4px;
	width: 4px;
	line-height: 4px;
	font-size: 1px;
	box-shadow: -1px -1px 1px 1px #ddd inset, 
		1px 1px 1px 1px #999 inset,
		1px 1px 2px 0px #666
		;
}
.og_diap_bt:hover {
	cursor: pointer;
}