@charset "utf-8";

*{
	margin: 0; padding: 0;
	font-family: "Gadugi", "helvetica", sans-serif;
}

/*

*************************************************************
	ACCUEIL

*/

/* Code CSS header de la page d'accueil */

/* CSS du haut de la page d'accueil */

.in-line{
	width:  100%;
	height: auto;
	margin: auto 0;
}
.in-line h1, #div-titre p{
	text-align: center;
	color: #022056;
	text-transform: uppercase;
	font-size: 25px;
	font-weight: bold;
}

.in-line a:hover{
	text-decoration: none;
	cursor: pointer;
}
.div-lng p{
	width: 100%;
	float: left;
	text-align: center;

}
.div-lng p a{

	font-size: 18px;
	color: #022056;
}
.div-lng p a:hover{
	border-top: 2px solid #025056;
}
.logo{
    width: 100px;
    top: 0;
}
.img-logo{
	text-align: center;
}
#container-fluid{
	width: 100%;
	height: auto;
	border-top: 3px solid #022056;
	border-bottom: 3px solid #022056;
}
#container{
	width: 100%;
	height: auto;
}

/* Fin du Code du haut de la page d'accueil */




/* LOGO et le Menu */

.pts-menu{
    height: 108px;
    padding: 0 20px;
    color : #384967;
}
.menu{
    float: right;
    line-height: 105px;
	font-size: 15px;
	font-weight: 450;
}
.menu a{
    color: #fff;
    text-transform: uppercase;
    text-decoration: none;
    padding: 0 10px;
    transition: 0.4s;
}
.show-menu-btn, .hide-menu-btn{
    transition: 0.4s;
    font-size: 30px;
    cursor: pointer;
    display: none;
}
.menu a:hover{
    text-decoration: none;
	background-color: #022056;
	border-radius: 5px;
	height: 15px;
	padding-top: 5px;
	padding-bottom: 5px;
}
.show-menu-btn{
    float: right;
}
.show-menu-btn i{
    line-height: 100px;
}
.menu a:hover,
.show-menu-btn:hover,
.hide-menu-btn:hover{
    color: #fff;


}
#chk{
    position : absolute;
    visibility: hidden;
	z-index: -1111;
}

@media screen and (max-width:800px) {
    .show-menu-btn, .hide-menu-btn{
        display: block;
    }

	.right-direction{

	width: auto;

}
	.img-contact1{
		visibility: hidden;
	}

	figcaption{
		margin-top: -300px;
		text-align: center;
	}
	.btn-envoi{

		margin-top: 10px;
	}
	.form-control{
		width: 90%;
	}
	.int-section-1 h5, .int-section-2 h5{
		text-align: center;
	}
	#div-logo{
		visibility: hidden;
	}
	#div-titre{
		margin-top: -55px;
	}
	.div-lng{
		margin-top: -20px;
		text-align: center
	}
	.in-line{
		margin: 0;
		padding: 0;
	}
    .menu{
        position: fixed;
        width: 100%;
        height: 100vh;
		background-color: #333;
        right: -100%;
        top: 0;
        text-align: center;
        padding: 80px 0;
        line-height: normal;
        transition: 0.7s;
    }
    .menu a{
        display: block;
        padding: 25px;
    }
	.menu a:hover{
		display: block;
		background-color: transparent;
		padding:25px;
		width: 100%;
		height: 70px;
		color: #b3b0b0;
	}
    .hide-menu-btn{
        position: absolute;
        top: 40px;
        right: 40px;
    }
    #chk:checked ~ .menu{
        right: 0;
    }
}
#img-cover{
	width: 100%;
	height: 600px;
	background: linear-gradient(rgba(0,0,51,0),rgba(0,0,51,0)), url("../images/pts2.jpg");
	background-size:cover;
	background-position: center;
}

/*  Fin du Logo et du Menu */

/* Code du titre Principal */

.acc-sub-title{
	font-size: 45px;
	font-family: "Mistral";
	letter-spacing: 3px;
	font-weight: bold;
	text-transform: uppercase;
	text-shadow: 5px 5px 5px #161616;
	text-align: center;
	padding-top: 120px;
	color: #fff;
}
.btn-accueil{
	text-align: center;
	margin-top: 30px;
}
.boutton-style1{
	font-size: 13px;
	width: 150px;
	height: 40px;
	border-radius: 5px;
	background-color: #022056;
	color: #fff;
	text-transform: uppercase
}
.boutton-style1:hover{
	background-color: #eeecec;
	color: #022056;
	border: 2px solid #022056;
	box-shadow: 5px 5px 10px #333;
}
.lettrine{
	color: #022056;
}


/* Fin du code du titre principal */



/* Fin du code CSS header de la page d'accueil */



/* Code des sections de la page d'accueil */



/* Section 1 */

.acc-sub-section-1 h2{
	font-size: 25px;
	text-align: center;
	text-transform: uppercase;
	padding: 65px 0 25px 0;
	margin-bottom: 40px;
	font-weight: bold;
	border-bottom: 5px solid #022056;
}
.acc-sub-section-1 p{
	font-size: 16px;
	text-align: justify;
}
.ltr:first-letter{
	font-size: 60px;
}
.col-sub-section-1, .col-sub-section-2{
	padding-bottom: 50px;
}
.ltr2{
	padding-top: 50px;
}

/* Fin Section 1 */



/* Section 2 */


.image-de-service{
	width: 100%;
	margin: 0 auto;
	font-size: 150px;
	text-align: right;
	word-spacing: 5px;
	font-family: helevetica;
	color: #fff;

}
.img-texte-acc{
	font-size: 16px;
	margin-right: 10px;
}

.img-srv{
	width: 110px;
	border: 10px double #fff;
	padding: 10px;
	border-radius: 100px;
	margin-top: 10px;

}
/* ZONE RECRUTEMENT */
.acc-section-recrutement {
	background-color: #FBF4F2 ;
}
.col-sub-section-1 .rctm {
	font-size: 1.5rem;
	text-align: center;
	color: #022055 ;
	font-family: "Rubik";
}
.col-sub-section-1 .liste {
	margin-left: 30px ;
	font-size: 1.2rem;
}
.acc-section-recrutement .col-sub-section-1 a {
	padding: 4px 6px;
	width: auto;
	background-color: #022055 ;
	color: #fff ;
	border-radius: 3px;
	cursor: pointer;
	text-decoration: none;
}
.acc-section-recrutement .col-sub-section-1 a:hover {
	background-color: #fd0000 ;
	color: #fff ;
}
.acc-section-recrutement .col-sub-section-1 img {
	width: 100% ;
}

/* FINDE LA ZNE RECRUTEMENT */

.acc-section-2{
	width: 100%;
	height: auto;
	padding: 5px 0;
	background: linear-gradient(rgba(0,0,50,0.5),rgba(0,0,50,0.5)), url("../images/pts11.jpg");
	background-size:cover;
	background-position: top;
	background-attachment: fixed;
	font-family: sans-serif;
}
.acc-sub-section-2{
	padding: 15px 0;
}
.acc-sub-section-2 h2{
	font-size: 25px;
	text-align: center;
	text-transform: uppercase;
	padding: 65px 0 25px 0;
	margin-bottom: 40px;
	font-weight: bold;
	border-bottom: 5px solid #fff;
	color: #fff;
}
.col-sub-section-2{
	width: 100%;
	padding-left: 50px;
}
.acc-sub-section-2 p{
	text-transform: uppercase;;
	font-size: 8px;
	text-align: justify;
}


/* Fin Section 2 */



/* Fin des codes des sections de la page d'accueil */


/* Section des Logos des partenaires */

/* CSS des Logos */

#large-contenaire{
	width: 100%;
	height: auto;
	text-align: center;
	background-color: #eeecec;
	padding: 50px;
}

.logo-img{
	width: 230px;
	margin: 3px;
}
#large-contenaire h5{
	margin-bottom: 50px;
	text-transform: uppercase;
	font-weight: bold;
}

/* Fin du CSS des Logos */


/* Fin de la section des Logos des partenaires */



/*

***********************************************************************
	FIN PAGE ACCUEIL
*/




/*

***********************************************************************
PAGE A PROPOS

*/

#int-page-img-cover{
	width: 100%;
	height: 230px;
	background: linear-gradient(rgba(0,0,51,0.5),rgba(0,0,51,0.5)), url("../images/pts1.jpg");
	background-size:cover;
	background-position: center;
}

.int-sub-section-1{
	width: 100%;
	height: auto;
	padding: 40px 0;
}
.int-sub-section-1 h1{
	font-size: 25px;
	text-align: center;
	text-transform: uppercase;
	padding: 20px 0 15px 0;
	margin-bottom: 40px;
	font-weight: bold;
	border-bottom: 5px solid #022056;
}
.int-sub-section-1 h5{ /* ode de la colonne des sections internes */

	text-transform: uppercase;
	font-weight: bold;
	color: #022056;
}
.int-sub-section-1 h4, .int-sub-section-2 h4{
	font-size: 18px;
	text-transform: uppercase;
	font-weight: bold;
	margin-bottom: 25px;
}
.int-sub-section-1-line-1 h6{
	color: #022056;
	background-color: #fff;
	text-align: center;
	padding: 10px 5px;
	font-size: 18px;
	font-family: "gudea";
	border-top-left-radius: 30px;
	border-top-right-radius: 30px;
}
.font-politiques{
	text-align: center;
	font-size: 30px;
}
.hse-2{
	padding: 20px;
}
.hse-2 h6:hover {
	color: #fff;
	background-color: #022056;
	cursor: pointer;
}
.hse-2 p{
	padding: 15px;
	text-align: left;
	font-size: 14px;
	border: 1px solid #022056;
	border-bottom-right-radius: 30px;
	border-bottom-left-radius: 30px;
}

.int-sub-section-2 h5{
	color: #022056;
	text-transform: uppercase;
	font-weight: bold;
}
.int-sub-section-2 h4{
	font-size: 18px;
	font-weight: bolder;
}

.int-section-2{
	width: 100%;
	background-color: #eeecec;
}

.int-sub-section-2 p{
	font-size: 16px;
	text-align: justify;
}
.int-sub-section-2{
	width: 100%;
	padding: 50px 0;
}
.pts{
	color: #022056;
}
.font-icon{
	color: #022056;
}
.lireplus{
	font-style: italic;
}

/* Zones des politiques QHSE */

.int-sub-section-politiques h1{
	font-size: 25px;
	text-align: center;
	text-transform: uppercase;
	padding: 20px 0 15px 0;
	margin: 40px 0;
	font-weight: bold;
	border: 5px solid #022056;
	color: #fff;
	background-color: #022056;
	border-radius: 10px;
}
.int-sub-section-pol-row{
	padding: 20px;
	text-align: justify;
	font-size: 16px;
	border-top: 1px solid #000;
}

.int-sub-section-pol-row ul{
	padding-left: 50px;
}
.politiques-localisation{
	text-align: center;
	text-transform: uppercase;
	font-weight: bold;
	font-size: 14px;
}
.pol-left{
	width: 100%;
	float: left;
}
.pol-right{
	width: 100%;
	float: right;
}
.int-sub-section-pol-row h3{
	font-size: 18px;
	font-weight: bold;
	text-transform: uppercase;
	margin: 30px 0 15px 0;
	text-decoration: underline;
}


/* Fn de la zone des politiques QHSE  */

/*

***********************************************************************
FIN PAGE A PROPOS

*/



/*

***********************************************************************
DEBUT DE LA PAGE DE EQUIPEMENTS

*/

#int-page-img-eqpmnt{
	width: 100%;
	height: 230px;
	background: linear-gradient(rgba(0,0,51,0.5),rgba(0,0,51,0.5)), url("../images/pts10.jpg");
	background-size:cover;
	background-position: right;
}

.img-equipment{
	width: 100%;
	border-radius: 5px;
	border: 2px solid #022056;
}
.int-sub-section-1-line-1 ul, .int-sub-section-2 ul{
	padding: 0 0 0 50px;
}



/*

***********************************************************************
FIN DE LA PAGE DE EQUIPEMENTS

*/



/*

***********************************************************************
PAGE DE CONTACT

*/
#cover-img-cnt{
	width: 100%;
	height: 230px;
	background: linear-gradient(rgba(0,0,51,0.5),rgba(0,0,51,0.5)), url("../images/pts7.jpg");
	background-size:cover;
	background-position: center;
}


/* CSS des boutons de la page de contact */

.btn-contact{
	width: 250px;
	border-radius: 300px;
	background-color: #022056;
	border: 2px solid #022056;
	padding: 5px;
	margin: 15px 0;
}
.btn-contact:hover{
	background-color: #254f9c;
	border: 2px solid #254f9c;
}
.contact-page-btn{
	text-align: center;
	word-spacing: 50px;
	border-radius: 10px;
}
.contact-page-btn a{
	text-decoration: none;

}
.btn-contact i{
	text-align: left;
	color: #fff;
	font-size: 25px;
	margin-bottom: 5px;
}
.btn-contact h6{
	text-align: center;
	color: #fff;
	text-transform: uppercase;
	font-size: 10px;
}
.btn-action{
	color: #fff;
	text-transform: uppercase;
}




/* Fin du CSS des boutons de la page de contact */


/*
**********************************************************************
PAGE NOUS JOINDRE

*/

#div-line-cnt{
	background-color: #eeecec;
	padding: 30px 10px;
	border-radius: 10px;
}
.form-group{
	margin: 5px;
}
.form-control{
	border: 1px solid #022056;
}
.bloc-message{
	width: 100%;
}
.submit{
	width: 100%;
	margin-top: 10px;
	font-weight: bold;
	text-transform: uppercase;
	background-color: #022056;
	color: #fff;
	border: 1px solid #fff;
}
.submit:hover{

	background-color: #254f9c;
	color: #fff;
	border: 1px solid #fff;
}
.img-contact1{
	width: 100%;
	border-radius: 5px;
	margin: 60px 0 25px 0;
}
.formulaire h5{
	color: #022056;
	font-size: 24px;
}
figcaption{
	color: #022056;
}
figure h6{
	width: auto;
	margin-bottom: 10px;
	margin-top: 5px;
	text-decoration: underline;
	text-transform: uppercase;
	padding-bottom: 5px;
}
.left-direction{
	width: 100%;
	text-align: left;
	font-family: Times New Roman;
	font-size: 14px;
	color: #022056;
}
.right-direction{
	text-align: right;
	font-family: Times New Roman;
	font-size: 14px;
	color: #022056;
}
.direction a{
	color: #4a566a;
	text-decoration: none;
}
.direction a:hover{
	color: #022056;
	text-decoration: none;
}




/*
**********************************************************************
FIN DE LA PAGE NOUS JOINDRE

*/




/*
**********************************************************************
POSTULER

*/

#int-page-img-post{
	width: 100%;
	height: 230px;
	background: linear-gradient(rgba(0,0,51,0.5),rgba(0,0,51,0.5)), url("../images/pts9.jpg");
	background-size:cover;
	background-position: top;
}

.int-page-post{
	padding-top: 55px;
}
#div-line-post{
	background-color: #eeecec;
	padding: 20px 10px;
	border-radius: 10px;
	width: 100%;
	height: auto;
}

#div-line-post h5{
	color: #022056;
}

.mymap{
	width: 100%;
	height: 350px;
	margin-top: 50px;
	border: none;
	position: relative;
	border-radius: 5px;
}
.container-image{
}
.container-figure{
}










/*
**********************************************************************
FIN DE LA PAGE POSTULER

*/




/*

***********************************************************************
FIN DE LA PAGE DE CONTACT

*/



/*

***********************************************************************
PAGE NOS REALISATIONS

*/
#cover-img-realisation{
	width: 100%;
	height: 230px;
	background: linear-gradient(rgba(0,0,51,0.5),rgba(0,0,51,0.5)), url("../images/pts6.jpg");
	background-size:cover;
	background-position: center;
}
.img-title{
	text-align: center;
	font-size: 22px;
}
.img-title:hover{
	text-decoration: underline;
}





/*

***********************************************************************
FIN DE LA PAGE NOS REALISATIONS

*/

/*
***********************************************************************
PAGE NOS SERVICES
*/

#int-page-services{

	width: 100%;
	height: 230px;
	background: linear-gradient(rgba(0,0,51,0.5),rgba(0,0,51,0.5)), url("../images/pts17.jpg");
	background-size: cover;
	background-position: center;

}


.pts-services{
	width: 100%;
	height: 150px;
	border-radius: 5px;
}
.vente-fitting{
	width: 70px;
	height: 30px;
	background-color: #022056;
	color: #fff;
	border: 2px solid #022056;
	text-align: center;
	margin: 0 auto;
}









/*
***********************************************************************
FIN DE LA PAGE NOS SERVICES
*/

/* Code du Footer */

.footer{
 	border-top: 10px solid #022056;
	height: auto;
	background: linear-gradient(rgba(0,0,50,0.5),rgba(0,0,50,0.5)), url("../images/ptsimg2.jpg");
	background-size:cover;
	background-position: top;
	font-family: sans-serif;
	color: #fff;
}
.sub-footer .pied-de-page{
    padding-left: 65px;
    padding-top: 15px;
}
.footer-texte{
    text-align: center;
    padding: 5px 0 5px 0;
}
.sub-footer .pied-de-page h4{
    color: #fff;
}
.span-foot{
    margin-left: 45%;
    padding: 10px;
	cursor: pointer;
}
.sub-footer .fa-linkedin-in, .sub-footer .fa-facebook-f{
    font-size: 20px;
    color: #384967;
    text-align: center;
    letter-spacing: 20px;

}
.sub-footer .fa-linkedin-in:hover, .sub-footer .fa-facebook-f:hover{
    font-size: 20px;
    color: #fff;
    text-align: center;
    letter-spacing: 20px;

}
.sub-footer .pied-de-page strong{
    text-decoration: underline;
}
.sub-footer .ft, .sub-footer .ft a{
    text-align: center;
    padding: 5px 3px;
    color: #b3b0b0;
    font-weight: 700;
    font-size: 14px;
}
.span-foot{
    padding: 10px;
}
.icons-langage{
    height: 20px;
    margin-top: -40px;
}
#bas-de-page{
	width: 100%;
	height:auto;
	background-color: #333;
	color: #fff;
	font-size: 14px;
	font-family: "gudea";
	margin-bottom: 0;
}

/* Fin du code du Footer */



/* CSS des LightBox */


.gallery{
	margin: 20px 60px;
}
.gallery img{
	transition: 1s;
	padding: 10px;
	width: 200px;
	height: 200px;
}
.gallery img:hover{
	filter: grayscale(100%);
	transform: scale(1.1);
}
.align-gallery{
	text-align: center;
}
.gallery a:hover{
	text-decoration: none;
}

/* CODES DES PAGES D'ERREUR */

/* Page 404 */


.erreur-404 p, .erreur-404 i{
	font-size: 40px;


}
.line-erreur-404 p{
	text-align: center;
	font-size: 50px;
	border-top: 1px solid #000;
	padding: 60px 0;
	font-weight: 700;
}
.erreur-404 i{
	color: dark;
}


/* Fin de la page 404 */




/* FIN DES CODES DES PAGES D'ERREUR */