body,form,figure{margin:0;padding:0}img{border:0}header,footer,nav,section,aside,article,figure,figcaption{display:block}body{font-size:100.01%}select,input,textarea{font-size:99%}#container,.inside{position:relative}#main,#left,#right{float:left;position:relative}#main{width:100%}#left{margin-left:-100%}#right{margin-right:-100%}#footer{clear:both}#main .inside{min-height:1px}.ce_gallery>ul,.content-gallery>ul{margin:0;padding:0;overflow:hidden;list-style:none}.ce_gallery>ul li,.content-gallery>ul li{float:left}.ce_gallery>ul li.col_first,.content-gallery>ul li.col_first{clear:left}.float_left,.media--left>figure{float:left}.float_right,.media--right>figure{float:right}.block{overflow:hidden}.media{display:flow-root}.clear,#clear{height:.1px;font-size:.1px;line-height:.1px;clear:both}.invisible{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.custom{display:block}#container:after,.custom:after{content:"";display:table;clear:both}
@media (max-width:767px){#wrapper{margin:0;width:auto}#container{padding-left:0;padding-right:0}#main,#left,#right{float:none;width:auto}#left{right:0;margin-left:0}#right{margin-right:0}}img{max-width:100%;height:auto}.audio_container audio{max-width:100%}.video_container video{max-width:100%;height:auto}.aspect,.responsive{position:relative;height:0}.aspect iframe,.responsive iframe{position:absolute;top:0;left:0;width:100%;height:100%}.aspect--16\:9,.responsive.ratio-169{padding-bottom:56.25%}.aspect--16\:10,.responsive.ratio-1610{padding-bottom:62.5%}.aspect--21\:9,.responsive.ratio-219{padding-bottom:42.8571%}.aspect--4\:3,.responsive.ratio-43{padding-bottom:75%}.aspect--3\:2,.responsive.ratio-32{padding-bottom:66.6666%}
header,footer,nav,section,aside,main,article,figure,figcaption{display:block}body,div,h1,h2,h3,h4,h5,h6,p,blockquote,pre,code,ol,ul,li,dl,dt,dd,figure,table,th,td,form,fieldset,legend,input,textarea{margin:0;padding:0}table{border-spacing:0;border-collapse:collapse}caption,th,td{text-align:left;text-align:start;vertical-align:top}abbr,acronym{font-variant:normal;border-bottom:1px dotted #666;cursor:help}blockquote,q{quotes:none}fieldset,img,iframe{border:0}ul{list-style-type:none}sup{vertical-align:text-top}sub{vertical-align:text-bottom}del{text-decoration:line-through}ins{text-decoration:none}body{font:12px/1 "Lucida Grande","Lucida Sans Unicode",Verdana,sans-serif;color:#000}input,button,textarea,select{font-family:inherit;font-size:99%;font-weight:inherit}pre,code{font-family:Monaco,monospace}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:400}h1{font-size:1.8333em}h2{font-size:1.6667em}h3{font-size:1.5em}h4{font-size:1.3333em}table{font-size:inherit}caption,th{font-weight:700}a{color:#00f}h1,h2,h3,h4,h5,h6{margin-top:1em}h1,h2,h3,h4,h5,h6,p,pre,blockquote,table,ol,ul,form{margin-bottom:12px}
/* 
	Roboto|Roboto+Condensed:700
	
	font-family: 'Roboto Condensed';
font-family: 'Roboto';
	
	
*/
* {
	box-sizing: border-box;
}
body {
	font-family: "Roboto";
	font-size: 100%;
	color: #888888;
}
.inner {
	max-width: 1150px;
	width: 100%;
	margin: 0 auto;
}
.inner .content-table {
	margin: 20px 0;
}

#container {
	max-width: 1600px;
	width: 100%;
	margin: 0 auto;
}

h1,
h2,
h3,
h4,
h5 {
	font-family: "Roboto Condensed";
	font-weight: 700;
	color: #222;
}
li,
p {
	line-height: 1.5rem;
}
a {
	text-decoration: none;
	color: #4a525a;
}
h1 {
	font-size: 4rem;
	margin: 0;
	padding: 145px 0 80px 0;
	color: #fff;
	text-transform: uppercase;
}
h1 span {
	display: block;
	font-size: 2rem;
	text-transform: none;
}
h1::after {
	background-color: #4a525a;
	content: "";
	display: block;
	height: 5px;
	width: 110px;
	margin-top: 8px;
}
h2 {
	font-size: 2.5rem;
	text-transform: uppercase;
}
h2::after {
	background-color: #4a525a;
	content: "";
	display: block;
	height: 5px;
	width: 60px;
	margin-top: 8px;
}
h4 {
	font-size: 1.3rem;
	text-transform: uppercase;
	color: #888888;
}
.accueil .topBanner {
	background-image: url("../../files/img/bannerHome.jpg");
	background-position: center 40%;
}
.savoir .topBanner {
	background-image: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)),
		url("../../files/img/bannerSavoir.jpg");
	background-position: center 80%;
}
.moyen .topBanner {
	background-image: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)),
		url("../../files/img/bannerMoyen.jpg");
	background-position: center 80%;
}
.clients .topBanner {
	background-image: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)),
		url("../../files/img/bannerMoyen.jpg");
	background-position: center 80%;
}
.recrutement .topBanner {
	background-image: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)),
		url("../../files/img/bannerMoyen.jpg");
	background-position: center 80%;
}
.contact .topBanner {
	background-image: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)),
		url("../../files/img/bannerMoyen.jpg");
	background-position: center 80%;
}
.mentions .topBanner {
	background-image: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)),
		url("../../files/img/bannerMoyen.jpg");
	background-position: center 80%;
}
.topBanner {
	background-attachment: scroll;
	background-repeat: no-repeat;
	background-size: cover;
}
#header {
	background: #fff;
	position: -webkit-sticky;
	position: sticky;
	top: 0;
	z-index: 999;
	box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.2);
}
header .inside {
	display: flex;
	align-items: center;
	margin: auto;
	max-width: 1600px;
}
.logo {
	min-width: 200px;
	max-width: 200px;
	padding: 0 0 0 10px;
}
.centerNav {
	width: 100%;
}
.rightBanner {
	min-width: 190px;
	max-width: 190px;
}
.rightBanner i {
	margin-right: 5px;
}
.rightBanner span {
	display: inline-block;
	background: #4a525a;
	color: #fff;
	text-transform: uppercase;
	font-family: "Roboto Condensed";
	font-weight: 700;
	padding: 12px 10px;
	border-bottom: 1px solid #fff;
	font-size: 1.2rem;
	width: 100%;
}
.ce_download i {
	margin-right: 8px;
	color: #d70a0a;
}
.ce_download a:hover {
	text-decoration: underline;
}
.rightBanner span:last-child {
	border: none;
}
.rightBanner a {
	color: #fff;
}
.mod_navigation ul {
	display: flex;
	margin: 0;
	justify-content: center;
}
.mod_navigation li {
	padding: 0 2px;
}
.mod_navigation a,
.mod_navigation strong {
	font-family: "Roboto Condensed";
	font-weight: 700;
	padding: 0 8px;
	text-transform: uppercase;
	color: #000000;
	font-size: 1.1rem;
	display: block;
}
.mod_navigation a {
	border-bottom: 5px solid #fff;
}
.mod_navigation strong,
.mod_navigation a:hover {
	border-bottom: 5px solid #4a525a;
}
.clients .introTxt {
	margin-bottom: 50px;
}
.introTxt {
	background: #4a525a;
	color: #fff;
	text-align: center;
	font-size: 1.2rem;
	padding: 32px 0 20px;
}

.content-gallery > ul {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
}

.content-gallery > ul img {
	max-width: 100%;
	padding: 12px;
}
.englobeImgTxt {
	display: grid;
	grid-template-columns: 1fr 1fr;
}

.englobeImgTxt > div {
	padding: 10px;
}

.englobeImgTxt .content-image {
	display: flex;
	align-items: center;
	justify-content: center;
	padding-top: 0;
	padding-bottom: 0;
}

.englobeImgTxt .content-image img {
	max-width: 100%;
}

.download-element {
	text-decoration: underline;
	margin-bottom: 30px;
}
.introTxt a {
	color: #fff;
}
.englobeImgTxt h2 {
	margin-top: 0;
}
.fullPres footer,
.contact footer,
.accueil footer {
	margin-top: 0;
}
footer {
	background: #4a525a;
	border-top: 10px solid #222222;
	margin-top: 80px;
	color: #fff;
}
.center {
	display: block;
	text-align: center;
	margin-top: 80px;
}
footer a {
	color: #fff;
}
footer .inside {
	max-width: 1150px;
	width: 100%;
	margin: 0 auto;
}
.topFooter {
	display: flex;
}
.colContact,
.colSavoir {
	width: 25%;
}
.colHoraires {
	width: 50%;
}

.colContact i {
	margin-right: 5px;
}
.copyright {
	margin: 0;
	padding: 70px 0 20px;
	text-align: center;
	font-size: 0.9rem;
}
.backSavoir {
	min-height: 300px;
	background-attachment: scroll;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}

.chaudroB {
	background-image: url(../../files/admin/savoir-faire/backChaudronnerie.jpg);
}
.pliageB {
	background-image: url(../../files/admin/savoir-faire/backPliage.png);
}
.soudureB {
	background-image: url(../../files/admin/savoir-faire/backSoudure.jpg);
}
.poinconnageB {
	background-image: url(../../files/admin/savoir-faire/backPoinconnageB.jpg);
}
.laserB {
	background-image: url(../../files/admin/savoir-faire/decoupe-laser.jpg);
}
.assemblageB {
	background-image: url(../../files/admin/savoir-faire/assemblage-montage.png);
}
#article-7 .inner {
	display: flex;
	align-items: center;
}
#article-7 .inner strong {
	color: #4a525a;
}
#article-7 a {
	color: #888888;
}
/*Formulaire*/
.widget-text {
	margin-bottom: 12px;
	width: 50%;
	float: left;
	padding: 0 1rem;
}
.widget-textarea,
.widget-submit {
	padding: 0 1rem;
}
.widget-text label,
.widget-textarea label {
	display: none;
}
textarea {
	min-height: 130px;
}
input[type="text"],
input[type="password"],
input[type="date"],
input[type="datetime"],
input[type="email"],
input[type="number"],
input[type="search"],
input[type="tel"],
input[type="time"],
input[type="url"],
input:not([type]),
textarea {
	width: 100%;
	display: inline-block;
	padding: 0.5em;
	background: none;
	border: none;
	border-bottom: 1px solid #000;
	-moz-transition: all 0.15s linear;
	-webkit-transition: all 0.15s linear;
	-o-transition: all 0.15s linear;
	transition: all 0.15s linear;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
form button,
input[type="submit"],
.button {
	display: inline-block;
	padding: 10px 20px 10px 20px;
	margin-bottom: 0;
	text-align: center;
	vertical-align: middle;
	line-height: 16px;
	font-size: 1em;
	color: #fff;
	cursor: pointer;
	border: 1px solid #7bb93d;
	background-color: #7bb93d;
	-moz-transition: background 0.15s linear;
	-webkit-transition: background 0.15s linear;
	-o-transition: background 0.15s linear;
	transition: background 0.15s linear;
	text-transform: uppercase;
}
.widget.widget-submit {
	text-align: right;
}
.widget {
	margin-bottom: 20px;
}
input[type="text"]:focus,
input[type="password"]:focus,
input[type="date"]:focus,
input[type="datetime"]:focus,
input[type="email"]:focus,
input[type="number"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="time"]:focus,
input[type="url"]:focus,
input:not([type]):focus,
textarea:focus {
	outline: 0;
	border-color: #205a9a;
}
.widget-checkbox {
	color: #000;
	padding: 0 1rem;
	width: 100%;
	clear: both;
}
.widget-checkbox a {
	color: #000;
}
.ce_form.block {
	width: 60%;
	padding: 65px 10px 30px;
	margin-right: 50px;
}
.englobeContact {
	display: flex;
	align-items: center;
}
.txtContact {
	padding-left: 50px;
}
.txtContact a {
	color: #888888;
}
#nav_mobile_trigger {
	display: none;
	background: #4a525a;
	color: #fff;
	text-transform: uppercase;
	font-family: "Roboto Condensed";
	font-weight: 700;
	padding: 12px 10px;
	border-top: 1px solid #fff;
	font-size: 1.2rem;
	min-width: 190px;
	max-width: 190px;
	float: right;
	width: 100%;
}
#article-1 .inner {
	padding-left: 0;
	padding-right: 0;
}
#table_42 {
	margin: 45px auto 0;
	max-width: 800px;
}
table {
	width: 100%;
	margin-bottom: 10px;
	border: 1px solid;
	border-collapse: collapse;
	border-color: #d4cbc5;
}
th {
	padding: 1%;
	text-align: left;
	background-color: #4a525a;
	color: #fff;
}
th,
td {
	border-right: 1px solid;
	border-bottom: 1px solid;
	border-color: #888888;
	vertical-align: top;
}
.odd td {
	background-color: #f6f6f6;
}
td {
	padding: 8px;
}
/*Fin Formulaire*/
@media only screen and (max-width: 1150px) {
	.inner,
	footer .inside,
	#article-1 .topBanner .inner {
		padding-left: 15px;
		padding-right: 15px;
	}
}
@media only screen and (max-width: 1050px) {
	.mod_navigation a,
	.mod_navigation strong {
		padding: 0 5px;
		font-size: 1rem;
	}
}
/*ipad paysage*/
@media only screen and (max-width: 965px) {
	.mod_navigation {
		display: none;
	}
	#nav_mobile_trigger {
		display: block;
	}
	.rightBanner span.contactTop {
		display: none;
	}
	.rightBanner {
		display: flex;
		flex-direction: column-reverse;
	}
}
@media only screen and (max-width: 770px) {
	#article-7 .inner {
		display: flex;
		align-items: center;
		flex-direction: column-reverse;
	}
	#article-7 .ce_text {
		text-align: center;
		margin-top: 15px;
	}
	.ce_form.block {
		width: 100%;
		padding: 65px 0 30px;
		margin-right: 0;
	}
	.clients .ce_gallery > ul li {
		width: 33.333%;
	}
	.txtR,
	.txtL {
		padding: 0 10px;
	}
}
@media only screen and (max-width: 450px) {
	.txtR {
		padding: 25px 10px;
	}
	.topFooter {
		display: block;
	}
	.colContact,
	.colSavoir {
		width: 100%;
		text-align: center;
	}
	.colHoraires {
		width: 100%;
		text-align: center;
	}
}

/* Mobile menu CSS */
#mobile-menu {
	display: none;
	position: relative;
}

@media only screen and (max-width: 1050px) {
	body {
		position: relative;
		overflow-x: hidden;
	}

	#home_link {
		flex-grow: 1;
	}

	#mobile-menu ul {
		display: flex;
		flex-direction: column;

		position: absolute;
		margin: 0;
		left: 0;
		top: 0;

		min-width: 100%;
		height: 100vh;
	}

	#mobile-menu ul li a,
	#mobile-menu ul li strong {
		display: block;
		width: 100%;
		padding: 20px;
		border-bottom: 1px solid #015888;
	}

	#mobile-menu ul li:hover {
		background-color: lightgray;
	}

	#mobile-menu {
		display: block;
		position: absolute;
		left: 0;
		top: 0;
		margin: 0;
		min-width: 80vw;
		height: 100vh;
		background-color: white;

		z-index: 99;

		transform-origin: 0% 0%;
		transform: translate(-150%, 0);

		transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1);
	}

	/* and let's slide it in from the right */
	#mobile-menu.open {
		transform: none;
		position: fixed;
	}

	.close-mobile-menu {
		position: absolute;
		top: 10px;
		right: 10px;
		color: #015888;
		font-size: 25px;
		cursor: pointer;
	}
}

