@charset "UTF-8";
/**********************************/
/*****                        *****/
/***** Auteur : Yann Choinard *****/
/***** c/o MERYAN PRODUCTIONS *****/
/*****                        *****/
/*****       Site GWNT        *****/
/*****                        *****/
/*****  Date : Juillet 2019   *****/
/*****                        *****/
/**********************************/

/** ARCHIVE
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	flex-flow: row wrap;
**/

* {
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
			box-sizing: border-box;
  }

.t0{padding: 10px 20px;	text-align: center;	font-family: 'Dosis'; font-size: 2.2em; color: #777;}

.t1{padding: 10px 20px;	text-align: center;	font-family: 'Dosis'; font-size: 1.6em;	font-weight: 600; color: #777;}

.t1n{padding: 10px 20px;	text-align: justify; font-family: 'Dosis'; font-size: 20px; color: #333;}

.t2{padding: 10px 20px;	text-align: center;	font-family: 'Dosis';	font-size: 1.4em; font-style: italic; font-weight: 600;	color: #777;}

.t3{padding: 10px 20px;	text-align: center;	font-family: 'Dosis'; font-size: 1.3em;	color: #777;}

.t3u{padding: 10px 20px; text-decoration: none;	text-align: center;	font-family: 'Dosis'; font-size: 1.3em;	color: #777;}

.t3j{padding: 10px 20px;	text-align: justify;	font-family: 'Dosis'; font-size: 1.4em;	color: #777;}

h1{
	font-family: 'Dosis';
	text-align: center;
	font-size: 40px;
	color: #666;
}

body{
	margin: 0px 0px;
	padding: 0px 0px;
	font-family: 'Dosis', 'Source code pro', verdana, calibri, serif, arial, time new roman;
	font-size: 13px;
	background-color: #fff;
}

/*********************/
/*****   BANNER  *****/
/*****           *****/
/***** ANIMATION *****/
/*********************/


/**************************/
/*****     BANNER     *****/
/*****                *****/
/*****  Mise en page  *****/
/**************************/

.container-banner{
	box-shadow: 2px 2px 4px #333;
	background: linear-gradient(8deg, #b6a9ff, #fefffe, #b6a9ff);
}

.container-banner-prt{
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	align-items: center;
}

.container-banner-chld{
	margin: 5px 20px;
	text-align: center;
}

.im-logo{
	transform: scale(0.8);
}

.typo-slog{
	font-family: 'Dosis';
	font-size: 40px;
	text-shadow: 2px 2px 2px #666;
	font-weight: bold;
	color: #6c70a1;
}

.typo-sub-slog{
	font-family: 'Dosis';
	font-size: 28px;
	text-shadow: 2px 2px 2px #666;
	font-weight: bold;
	color: #6c70a1;
}

.pict-btn-reseau{
	padding: 2px 0px;
	/*box-shadow: 2px 2px 4px #333;*/
}
/**********************************************************************************************/
/**********************************************************************************************/

/**********************************************/
/*****     Page HOME ==> Présentation     *****/
/**********************************************/
/***   Article de présentation générale   ***/
.container-text-presentation{
	margin: 20px auto;
	width: 80%;
	border: 1px solid #000;
	background: #fff;
}

/***   Présentation des activités   ***/
.container-activite-prt{
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	flex-flow: row wrap;
	justify-content: space-around;
	align-items: center;
	margin: 20px 20px;
	padding: 0px 20px;
}

.container-activite-chld{
	padding: 0px 20px;
	max-width: 340px;
	border-radius: 3px;
	box-shadow: 0px 0px 10px #666;
	background: #fff;
}

/*******************************************/
/*****     Page CARTOGRAPHIE ==> VISUEL 3D     *****/
/*****                                         *****/
/*****     CARTO - Base Carto Home             *****/
/***************************************************/
.container-presentation-inbivi-prt{
	margin: 10px auto;
	padding: 10px 10px;
	width: 80%;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	flex-flow: row wrap;
	justify-content: space-around;
	background: #fff;
	box-shadow: 0px 0px 20px #333;
}

.container-presentation-inbivi-chld{
	max-width: 600px;
}

.base-home-child-pict-01{
	box-shadow: 4px 4px 6px #333;
}

.base-home-child-pict-02{
	margin-top: 30px;
	max-height: 100px;
	box-shadow: 4px 4px 6px #333;
}
/***********************************************************************/
/***********************************************************************/

/******************************************/
/*****     CARTO - Spécifications     *****/
/******************************************/
.container-specification{

}

.container-specification-inbivi-prt{
	margin: 10px auto;
	padding: 10px 10px;
	width: 80%;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	flex-flow: row wrap;
	justify-content: space-around;
	background: #fff;
	box-shadow: 0px 0px 20px #333;
}

.base-specif-acc-txt{
	padding: 10px 10px;
	max-width: 240px;
	text-align: center;
	font-variant: small-caps;
}

.base-specif-acc-txt-01{
	font-family: calibri;
	font-size: 24px;
	color: #333;
}

.base-specif-acc-txt-02{
	font-family: calibri;
	font-size: 20px;
	color: #333;
	max-width: 180px;
}

.btn-specif-tk{
	padding: 10px 20px;
	font-family: calibri;
	font-size: 20px;
	color: #333;
	background-color: #e8e8ff;
	border: 1px solid #000;
	box-shadow: 2px 2px 4px #333;
	cursor: pointer;
}

.btn-specif-tk:hover{
	background-color: #ffe8e8;
}

.specif-tk-txt{
	font-family: calibri;
	font-size: 18px;
	font-style: italic;
	font-weight: bold;
	color: #333;
}

.suite{
	font-family: calibri;
	font-size: 18px;
	font-style: italic;
}

/*************************************************/
/***** CARTO - Galerie Folio / Documentation *****/
/*************************************************/
.container-documentation{
	width: 80%;
	margin: auto;
}

.container-documentation-prt{
	padding: 10px 20px;
	background: #fff;
	box-shadow: 0px 0px 20px #333;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	flex-flow: row wrap;
	justify-content: space-around;
}

.container-documentation-chld{
	padding: 10px 20px;
	background: #fff;
	box-shadow: 0px 0px 20px #333;
	cursor: pointer;
	text-align: center;
}

.pict-folio{
	text-align: center;
}

.txt-folio{
	padding: 10px 10px;
	font-family: calibri;
	font-size: 20px;
	font-variant: small-caps;
	color: #333;
}

.text-docu-download{
	text-decoration: none;
	font-family: calibri;
	font-size: 20px;
	font-variant: small-caps;
	color: #333;
}

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

/***************************************************/
/*****     CARTO - Exemples d'applications     *****/
/***************************************************/
.container-exemple{
	margin: auto;
	width: 80%;
}

.container-exemple-prt{
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	flex-flow: row wrap;
	justify-content: space-around;
	box-shadow: 0px 0px 20px #333;
}

.container-exemple-chld{
	max-width: 300px;
}

.container-slide-exemple{
	margin: 10px auto;
	padding: 20px 20px;
	border: 1px solid #333;
	font-size: 15px;
}

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

/************************************/
/*****     CARTO - Shoxroom     *****/
/************************************/
.container-showroom{
	width: 80%;
	margin: auto;
}

.container-showroom-prt{
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	flex-flow: row wrap;
	justify-content: space-around;
}

.container-showroom-chld{
	padding: 10px 10px;
	margin: 20px auto;
	border: 1px solid #000;
	box-shadow: 2px 2px 8px #333;
	text-align: center;
}

.btn-video{
	text-decoration: none;
	color: #333;
	font-family: calibri;
	font-size: 16px;
}

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

/***********************************/
/***** Page HYDROLIENNE MARINE *****/
/***********************************/
.container-hydromar-presentation{
	width: 80%;
	margin: 20px auto;
}

.container-hydromar-presentation-prt{
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	flex-flow: row wrap;
	justify-content: space-around;
	box-shadow: 0px 0px 20px #333;
}

.container-hydromar-presentation-chld{
	max-width: 320px;
}

.div-align{
	text-align: center;
}

.container-hydromer-general{
	width: 80%;
	margin: 20px auto;
}

.container-hydromer-general-prt{
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	flex-flow: row wrap;
	justify-content: space-around;
	box-shadow: 0px 0px 20px #333;
}

.container-hydromer-general-chld{
max-width: 320px;
}





















.base-hydromer-acc-css{
	margin: 10px auto;
	padding: 10px 20px;
	width: 80%;
	border: 1px solid #000;
	border: 1px solid #000;
	box-shadow: 2px 2px 2px #666;
	background-color: #e8e8ff;
}

.hydromer-acc-css-title-01{
	text-align: center;
	font-family: calibri;
	font-size: 34px;
	font-variant: small-caps;
	color: #333;
}

.hydromer-acc-css-title-02{
	margin: 10px auto;
	width: 70%;
	text-align: center;
	font-family: calibri;
	font-size: 30px;
	font-variant: small-caps;
	color: #333;
}

.base-hydromer-acc-parent{
	margin: 10px auto;
	padding: 10px 10px;
	width: 100%;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	flex-flow: row wrap;
	justify-content: space-around;
}

.base-hydromer-acc-child{
	margin: 0px 20px;
	padding: 10px 10px;
	text-align: center;
	border: 1px solid #000;
	box-shadow: 2px 2px 2px #666;
}

.base-hydromer-acc-child-txt{
	margin: 0px 20px;
	padding: 10px 10px;
	text-align: center;
}

.hydromer-acc-child-pict-video{
	font-family: calibri;
	font-size: 22px;
	color: #5555ff;
	font-style: italic;
}

.hydromer-acc-child-txt{
	font-family: calibri;
	font-size: 24px;
	color: #333;
}

.txt-hydromer-download{
	font-family: calibri;
	font-size: 22px;
	color: #5555ff;
	font-style: italic;
}


/***** HYDROLIENNE MARINE Container 1er FLEX Généralité *****/

.base-hydro-gen{
	margin: 10px auto;
	padding: 10px 10px;
	width: 80%;
	border: 1px solid #000;
	box-shadow: 2px 2px 2px #666;
	background-color: #ffe8e8;
}

.base-hydro-gen-parent{
	margin: 10px auto;
	padding: 10px 10px;
	width: 100%;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	flex-flow: row wrap;
	justify-content: space-around;
}

.base-hydro-gen-child{
	margin: 10px 20px;
	padding: 10px 10px;
	width: 240px;
	text-align: center;
	font-family: calibri;
	font-size: 22px;
	background-color: #fff;
	border: 1px solid #000;
	box-shadow: 2px 2px 2px #666;
}

/****************************/
/***** Section Download *****/
/****************************/

.base-hydromer-caractk{
	margin: 0px auto;
	width: 80%;
	background-color: #fff;
	border: 1px solid #000;
	box-shadow: 2px 2px 2px #666;
}

.bsps{
	color: #0000ff;
	font-style: italic;
}

.hydromer-download{
	font-weight: bold;
}

.txt-hydromer-download{
	text-decoration: none;
	color: #333;
}

.flex-child-hydromer-gen{
	padding: 5px 10px;
	width: 480px;
	margin: 10px 10px;
	font-size: 15px;
	text-align: center;
	background-color: #fff;
	border: 1px solid #000;
	box-shadow: 2px 2px 2px #666;
}

.flex-parent-hydromer-caractk{
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
  	flex-flow: row wrap;
	justify-content: space-around;
	padding: 10px 200px;
	text-align: center;
}

.flex-pict-hydromer{
	margin: 10px 10px;
}

.title-caractk{
	padding: 10px 20px;
	margin: 15px auto;
	width: 60%;
	text-align: center;
	font-family: calibri;
	font-variant: small-caps;
	font-size: 32px;
	color: #333;
	border: 1px solid #000;
	cursor: pointer;
	background-color: #e8e8ff;
}

.txt-title-caractk{
	text-align: center;
	font-family: calibri;
	font-variant: small-caps;
	font-size: 32px;
	color: #333;
	text-decoration: none;
}

.base-txt-hydromer-caractk{
	margin: 15px auto;
	padding: 10px 40px;
	max-width: 50%;
	border: 1px solid #000;
	box-shadow: 2px 2px #333 inset;
	font-family: calibri;
	font-size: 20px;
}

.click-detail{
	font-family: calibri;
	font-size: 14px;
	font-style: italic;
}



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

/*************************************/
/***** Page HYDROLIENNE FLUVIALE *****/
/*************************************/

/**************************************/
/***** SECTION Intro - Généralité *****/
/**************************************/

.base-hydroflu-gen{
	margin: 10px auto;
	width: 80%;
	background-color: #e8e8ff;
	border: 1px solid #000;
	box-shadow: 2px 2px 2px #666;
}

.base-hydroflu-gen-txt01{
	padding: 10px 20px;
	text-align: center;
	font-family: calibri;
	font-size: 34px;
	font-variant: small-caps;
	color: #333;
}

.base-hydroflu-gen-parent{
	margin: 10px auto;
	padding: 10px 10px;
	width: 100%;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	flex-flow: row wrap;
	justify-content: space-around;
}

.base-hydroflu-gen-child{
	margin: 10px 20px;
	padding: 10px 10px;
	width: 240px;
	text-align: center;
	font-family: calibri;
	font-size: 22px;
	background-color: #fff;
	border: 1px solid #000;
	box-shadow: 2px 2px 2px #666;
}
/**
hydroflu-gen-pict-video

hydroflu-gen-txt-download-video

hydroflu-btn-video


hydroflu-gen-txt01

hydroflu-gen-txt02


hydroflu-gen-pict-docu

hydroflu-gen-txt-download-docu

hydroflu-btn-docu

/***************************************/
/***** Section Utilisation interne *****/
/***************************************/

.base-flu-intro-flex{
	margin: 10px auto;
	padding: 10px 10px;
	width: 90%;
	border: 1px solid #000;
	background-color: #fff;
	box-shadow: 2px 2px 4px #333;
}

.flu-util-intern-flex-child{
	margin: 10px 20px;
	padding: 10px 20px;
	font-family: calibri;
	font-size: 28px;
	color: #333;
	text-align: center;
	font-variant: small-caps;
}

.flu-base-cont-util-intern{
	padding: 0;
	margin: 0;
	list-style: none;
  
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
  
	-webkit-flex-flow: row wrap;
	justify-content: space-around;
}

.flu-sample-util{
	margin: 10px 20px;
	padding: 10px 10px;
	width: 140px;
	font-family: calibri;
	font-size: 18px;
	color: #333;
	text-align: center;
	border: 1px solid #000;
	cursor: pointer;
}


.flu-util-intern-argu{
	font-family: calibri;
	font-size: 22px;
	color: #333;
	text-align: center;
	font-variant: small-caps;
}

.flu-title-caract-tk{
	margin: 10px 20px;
	padding: 10px 20px;
	font-family: calibri;
	font-size: 28px;
	color: #333;
	text-align: center;
	font-variant: small-caps;
}

.flu-cont-caract-tk{
	margin: 10px auto;
	padding: 10px 10px;
	width: 80%;
	font-family: calibri;
	font-size: 22px;
	color: #333;
	text-align: center;
	border: 1px solid #000;
	cursor: pointer;
	font-weight: bold;
}

.details{
	font-size: 14px;
	font-style: italic;
}

.flu-txt-caract-tk{
	margin: 10px auto;
	padding: 10px 10px;
	width: 80%;
	font-family: calibri;
	font-size: 18px;
	color: #333;
	text-align: center;
	background-color: #f6f7ff;
}




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

/*************************************/
/***** Page PYRO BIO *****/
/*************************************/

/**************************************/
/***** SECTION Intro - Généralité *****/
/**************************************/

.pyro-base-present-parent{
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
  
	-webkit-flex-flow: row wrap;
	justify-content: space-around;
	margin: 0px auto;
	padding: 10px 20px;
	list-style: none;
	text-align: center;
	width: 80%;
	background-color: #fff;
	border: 1px solid #000;
	box-shadow: 2px 2px 4px #333;
}

.pyro-base-present-child{
	margin: 10px auto;
	padding: 10px 20px;
	font-family: calibri;
	font-size: 28px;
	color: #333;
	text-align: center;
	font-variant: small-caps;
}

.pyro-base-systus-child{
	border: 1px solid #000;
	box-shadow: 2px 2px 4px #333;
}

.pyro-img-logo-01{
	padding: 10px 20px;
	max-width: 100%;
	max-height: 120px;
}

.title-pyro-base-systus{
	font-family: calibri;
	font-size: 32px;
	color: #333
}

.detail-btn{
	font-family: calibri;
	font-size: 16px;
	font-style: italic;
	cursor: pointer;
}

.txt-pyro-base-systus-01{
	font-family: calibri;
	font-size: 20px;
	color: #333
	font-variant: small-caps;
}

.txt-pyro-base-systus-02{
	font-family: calibri;
	font-size: 18px;
	color: #333
}


/****************************************/
/***** SECTION Systeme - Généralité *****/
/****************************************/

.pyro-base-systus-parent{
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
  
	-webkit-flex-flow: row wrap;
	justify-content: space-around;
	margin: 10px auto;
	padding: 10px 20px;
	list-style: none;
	text-align: center;
	width: 80%;
	background-color: #fff;
	border: 1px solid #000;
	box-shadow: 2px 2px 4px #333;
}

.pyro-base-systus-child{
	margin: 10px auto;
	padding: 10px 20px;
	width: 300px;
	font-family: calibri;
	font-size: 28px;
	color: #333;
	text-align: center;
	font-variant: small-caps;
}

.txt-pyro-base-systus-01{
	margin: 10px auto;
	padding: 10px 20px;
	font-family: calibri;
	font-size: 28px;
	color: #333;
	text-align: center;
	font-variant: small-caps;
	text-decoration: none;
}









#flex-container {
	display: flex;
	flex-direction: row;
}

#flex-container > .flex-item {
	flex: auto;
}

#flex-container > .raw-item {
	width: 5rem;
}
#flex-container {
	width: 100%;
	font-family: Consolas, Arial, sans-serif;
}

#flex-container > div {
	border: 1px solid #f00;
	padding: 1rem;
}

#flex-container > .raw-item {
	border: 1px solid #000;
}

/********************************/
/*****     Form Contact     *****/
/********************************/
.container-form-contact{
	margin: 10px 20px;
	font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
}





