@charset "utf-8";
/* CSS Document */

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

GENERAL

***************************************/
/* FIXE LE HEADER */
html, body, .maincontainer, {
    height: 100%;
	font: 100%/1.618 sans-serif;
	text-transform:none;
}
.asteriskField{
    color: red !important;
}

.maincontainer {
    position: relative;
}

.proper-content {
    padding-top: 94px; /* >= navbar height */
}
/* FIXE LE HEADER */

* {
	font-family: 'Lato', sans-serif;
	color:#192d38;
	text-transform:none;
}

p, h1, h2, h3, h4, h5, h6, span, a {
	font-family: 'Lato', sans-serif;
}

p {
	font-size:12px;
}

.alignjustify {
	text-align: justify;
}

.alignleft {
	text-align: justify;
}

.arrowbackground {
	background:url(../img/fleche.png) center top no-repeat;
}

.arrowgreybackground {
	background: url(../img/flechegrey.png) center top no-repeat;
}

.arrowwhitebackground {
	background: url(../img/flechewhite.png) center top no-repeat;
}

.bluebackgroundbloc {
	background-color:#1E8BF0;
	color:#FFF;
}

.whitebackgroundbloc {
	background-color:#fff;
}

.greybackgroundbloc {
	background-color: #F1F1F1;
}

.Bleugivrebackgroundbloc {
	/*background-color:#00bcc4;*/
        background-color:#3BA2EA;
}
.bluebackgroundbloc p { color:#FFF; }
.bluebackgroundbloc h1 { color:#FFF; }
.bluebackgroundbloc h2 { color:#FFF; }
.bluebackgroundbloc h3 { color:#FFF; }

.bluebackgroundbloc p {
	font-size:12px;
	font-weight:normal;
}

h1 {
	padding:78px 0;
	/*font-weight: 300;*/
	line-height:50px;
	font-size:32px;
	text-transform:uppercase;
}

h1 span {
	background:url(../img/bg-tittlecover.png);
	color:#FFF;
	padding:2px;
	text-transform:uppercase;
}

.spaceh1 {
	display:inline-block;
	width:10px;
}

div.bloccover {
	float:left;
	color:#FFF;
	padding:0 5px 0px 5px;
	margin-bottom:80px;
	text-align:center;
	height:90px;
	background:url(../img/bg-tittlecover.png);
}

div.line-tittlecover {
	background:url(../img/bg-tittlecover.png) repeat; 
	width:1px; 
	height:90px; 
	float:left;
	 padding-top:10px;
}

.bloccover50 { width:49.8%; }
.bloccover25 { width:24.8%; }
.bloccover33 { width:33%; }

div.bloccover sup { 
	color:#FFF;
	font-size:17px;
}

div.bloccover h6 {
	font-size:32px;
}

div.bloccover h6 span {
	font-size:15px;
	font-weight:300;
	color:#FFF;
}

h2 {
	font-size:22px;
	font-weight:normal;
	margin:0;
	padding:30px 0 15px 0;
	text-transform:uppercase;
}
h6 {
	text-transform:uppercase;
}
	

p.emphase {
	font-size:12px;
	/*font-weight:300;*/
	padding:0px 0 15px 0;
}

h3 {
	font-size:32px;
	margin:50px 0 30px;
	text-transform:uppercase;
	font-weight: normal;
}

h3 span {
	font-size:24px;
	text-transform:uppercase;
	font-weight:300;
	display:inline-block;
	margin-top:10px;
}

h4 {
font-size:16px;
color:#00539f;
margin:20px 0;
}

div.separation {
	border-top:1px solid #003566;
	text-align:center;
}

div.separation img {
	margin-top:-1px;
}

hr.standart {
	border-bottom:1px solid #333;
	width:20%;
}

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

HEADER / NAVBAR

***************************************/
.navbar-default {
	background:#FFF;
	border-bottom:1px solid #00539f;
	padding:20px 0 20px 0;
	position:relative;
}

div.header {
	padding:0;
}

div.logo {
	float:left;
}

.fixed-header {
  position: fixed;
  right: 0;
  left: 0;
  z-index: 1030;
}

div.headercontainer {
	position:relative;
}

div.lang {
	position:absolute;
	right:0;
	top:-15px;
	color:#999999;
	font-size: 12px;
	margin-right:10%;
}

div.lang select {
	border:0px;
}

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

FOOTER 

***************************************/
div.overallfooter {
	border-top:2px solid #003566;
	background-color:#FFF;
}

div.footer {
	padding-top:40px;
	padding-bottom:40px;
}

div.footer p {
	font-size:13px;
	color:#003566;
}

div.footer h5 {
	font-size:20px;
	color:#003566;
	padding-bottom:15px;
	text-transform:uppercase;
}

div.footer h5 img {
	margin:10px 0 15px 0;
}

div.footer ul {
	padding:0;
}

div.footer li {
	color:#003566;
	list-style:none;
}

div.footer a {
	color:#003566;
	text-decoration:none;
}

div.footer a:hover {
	text-decoration:underline;
}

a.footermenu {
	display:block;
}

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

HOME PAGE

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

/** COVER **/
.coverindex {
	background:url(../img/bg-index2.jpg) no-repeat center top fixed;
}

h1.homepage {
	font-size:22px;
	font-weight:300;
	margin:0;
	padding:10px 0;
	text-transform: uppercase;
}

h2.homepage {
	font-size:32px;
	font-weight:300;
	margin:0;
	padding:80px 0;
	line-height:45px;
	text-transform: uppercase;
}

h2.homepage span {
	background:url(../img/bg-tittlecover.png);
	color:#FFF;
	padding:2px;
	text-transform: uppercase;
}

/** SECTION METIER **/
div.metier {
	margin-top:30px;
	margin-bottom:30px;
}

div.metier .bloc p {
	color:#838383;
	margin-top:10px;
}

span.roll {
	background:url(../img/link.png) center center no-repeat #000;
	height: 170px;
	position: absolute;
	width: 170px;
	z-index: 10;	
	-webkit-box-shadow: 0px 0px 4px #000;
	-moz-box-shadow: 0px 0px 4px  #000;
	box-shadow: 0px 0px 4px  #000; 
	border-radius: 100px;
 	-webkit-border-radius: 100px;
 	-moz-border-radius: 100px;
}

img.roller {
	border-radius: 100px;
 	-webkit-border-radius: 100px;
 	-moz-border-radius: 100px;
	border:3px solid #999;
}

h2.centerline{
	text-align:center;
	background-image:url(../img/lineh2.gif);
	background-position:center;
	background-repeat:repeat-x;
	font-size:22px;
	padding:0;
	text-transform:uppercase;
}

h2.centerline span{ background-color:white; display: inline-block; padding:0 15px; text-transform:uppercase; }


/* SECTION AGREMENT */
.agrementtitle h3, span {
	text-transform:uppercase;
}

.blocagrement .bloc3 h5 {
	color:#00539f;
	margin:0 0 15px 0;
	font-size:19px;
	text-transform:uppercase;
}


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

PAGE PRESENTATION

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

/** SECTION ACHAT **/
div.typeproduitbloc div {
	float:left;
	height:180px;
}

div.typeproduitbloc h6 {
	font-weight:bold;
	text-transform: uppercase;
	letter-spacing: 0.8px; 

}


/** SECTION TRANSITAIRE **/
div.transitairebloc div.bloc {
	float:left;
	width:300px;
	margin-right:35px;
}

div.transitairebloc div.bloc h5 {
	color:#00539f;
	font-size:29px;
	text-transform:uppercase;
}
div.transitairebloc div.bloc h5 span {
	color:#00539f;
	font-size:17px;
	line-height:25px;
	text-transform:uppercase;
}

div.marging {
	margin:0 45px;
}

.transitairebloc2 h5 {
	color:#00539f;
	font-size:29px;
}
.transitairebloc2 h5 span {
	color:#00539f;
	font-size:17px;
	line-height:25px;
}

h5 sup {
	color:#266dad;
	font-size:15px;
}

.iconentrepot {
	background:url(../img/icon-entrepot.png) no-repeat right top;
}

.iconcommande {
	background:url(../img/icon-commandes.png) no-repeat right top;
}

.iconmarchandise {
	background:url(../img/icon-marchandises.png) no-repeat right top;
}

.iconcolis {
	background:url(../img/icon-colis.png) no-repeat right top;
}

.iconmaritime {
	background:url(../img/icon-maritime.png) no-repeat right top;
}

.iconaerien {
	background:url(../img/icon-aerien.png) no-repeat right top;
}

.iconroutier {
	background:url(../img/icon-routier.png) no-repeat right top;
}


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

PAGE ACHAT VENTE

*********************************************/
.coverachat {
	background:url(../img/bg-achat-vente.jpg) no-repeat center top fixed;
}

.produitsfr {
	background:url(../img/produits-francias.png) no-repeat bottom center;
	display:inline-block; padding-bottom:7px;
}

.centraleachat h2.centerline2{
	text-align:center;
	background-image:url(../img/line2h2.gif);
	background-position:top;
	background-repeat:repeat-x;
	font-size:24px; 
}

.centraleachat h2.centerline2 span{ background-color:#f2f2f2; display: inline-block; margin:-25px 50px 0 50px; }

.gammesproduits_bloc {
	float:left;
	background-color:#FFF;
	-moz-box-shadow: 0px 0px 3px 1px #cfcfcf;
	-webkit-box-shadow: 0px 0px 3px 1px #cfcfcf;
	-o-box-shadow: 0px 0px 3px 1px #cfcfcf;
	box-shadow: 0px 0px 3px 1px #cfcfcf;
	filter:progid:DXImageTransform.Microsoft.Shadow(color=#cfcfcf, Direction=NaN, Strength=3);
	text-align:left;
	/*height:405px;*/
	margin:22px;
	color:#2d333d;
}

.gammesproduits_bloc h6 {
	font-size:14px;
	margin:10px 20px;
	font-weight:bold;
	text-transform:uppercase;
}
	
.gammesproduits_bloc p {
	margin:0px 20px;
	padding:10px 0;
	border-bottom:1px solid #f2f2f2;
}

.buttoncatalogue {
	width:95%;
	background-color:#003566;
	border:1px solid #003566;
	font-size:24px;
	padding: 20px auto;
	margin:25px auto;
	-moz-box-shadow: 0px 0px 3px 1px #cfcfcf;
	-webkit-box-shadow: 0px 0px 3px 1px #cfcfcf;
	-o-box-shadow: 0px 0px 3px 1px #cfcfcf;
	box-shadow: 0px 0px 3px 1px #cfcfcf;
	filter:progid:DXImageTransform.Microsoft.Shadow(color=#cfcfcf, Direction=NaN, Strength=3);
}

.nosservices h4 {
	font-size:20px;
	color:#00539f;
	font-weight:bold;
	margin-bottom:25px;
}
.nosservices li {
	list-style:disc;
	text-align:left;
	font-size:18px;
	margin:10px 0px;
}

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

PAGE LOGISTIQUE

*********************************************/
.coverlogistique {
	background:url(../img/bg-logistique.jpg) no-repeat center top fixed;
}

.prestationlogistique .bloc {
	background-color:#FFF;
	width:225px;
	height:220px;
	padding:20px;
	float:left;
	margin:12px 0;
	-moz-box-shadow: 0px 0px 3px 1px #cfcfcf;
	-webkit-box-shadow: 0px 0px 3px 1px #cfcfcf;
	-o-box-shadow: 0px 0px 3px 1px #cfcfcf;
	box-shadow: 0px 0px 3px 1px #cfcfcf;
	filter:progid:DXImageTransform.Microsoft.Shadow(color=#cfcfcf, Direction=NaN, Strength=3);
}

.prestationlogistique .bloc h6 {
	color:#00539f;
	font-size:18px;
	font-weight:bold;
	text-transform:uppercase;
}

.prestationlogistique .bloc h6.small {
	font-size:15px;
	text-transform:uppercase;
}

.prestationlogistique .bloc p {
	font-size:12px;
}

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

PAGE TRANSIT

*********************************************/
.covertransit {
	background:url(../img/bg-transit.jpg) no-repeat center top fixed;
}

.blocstransit { 
}

.blocstransit .bloc1 {
	width:250px;
	height:190px;
	float:left;
	background:#FFF;
	margin:20px 0;
	-moz-box-shadow: 0px 0px 3px 1px #cfcfcf;
	-webkit-box-shadow: 0px 0px 3px 1px #cfcfcf;
	-o-box-shadow: 0px 0px 3px 1px #cfcfcf;
	box-shadow: 0px 0px 3px 1px #cfcfcf;
	filter:progid:DXImageTransform.Microsoft.Shadow(color=#cfcfcf, Direction=NaN, Strength=3);
}

.blocstransit h6 {
	font-size:16px;
	margin:10px 0;
	text-transform:uppercase;
}

.blocstransit .bloc2 {
	width:415px;
	height:343px;
	float:left;
	background:#FFF;
	margin:10px 0;
	padding:30px;
	text-align:left;
	-moz-box-shadow: 0px 0px 3px 1px #cfcfcf;
	-webkit-box-shadow: 0px 0px 3px 1px #cfcfcf;
	-o-box-shadow: 0px 0px 3px 1px #cfcfcf;
	box-shadow: 0px 0px 3px 1px #cfcfcf;
	filter:progid:DXImageTransform.Microsoft.Shadow(color=#cfcfcf, Direction=NaN, Strength=3);
}

.blocstransit .bloc2 h5 {
	color:#00539f;
	margin:0 0 15px 0;
	font-size:22px;
	text-transform:uppercase;
}

.blocstransit .bloc2 ul {
	margin:0;
	padding:0;
}
.blocstransit .bloc2 li {
	list-style:none;
	padding:10px 0;
	border-bottom:1px solid #CCC;
}



.buttoncotation {
	width:100%;
	font-size:20px;
	padding: 20px auto;
	margin:25px auto;
	background-color:#003566;
	-moz-box-shadow: 0px 0px 3px 1px #cfcfcf;
	-webkit-box-shadow: 0px 0px 3px 1px #cfcfcf;
	-o-box-shadow: 0px 0px 3px 1px #cfcfcf;
	box-shadow: 0px 0px 3px 1px #cfcfcf;
	filter:progid:DXImageTransform.Microsoft.Shadow(color=#cfcfcf, Direction=NaN, Strength=3);
}
/*********************************************

PAGE CARRIERE

*********************************************/
.covercarrierebg {
	background:url(../img/bg-carriere.jpg) no-repeat center top fixed;
}

div.covercarriere {
	height:337px;
}

div.carriere .bloc {
	width:45%;
	float:left;
	height:230px;
}

div.carriere .bloc h5 {
	font-size:20px;
	color:#00539f;
	font-weight:bold;
	margin-bottom:25px;
	text-transform:uppercase;
}	

div.covercarriere h1 {
	margin:80px 0;
	text-transform:uppercase;
}

div.candidature {
	width:100%;
	background:#FFF;
	-moz-box-shadow: 0px 0px 3px 1px #cfcfcf;
	-webkit-box-shadow: 0px 0px 3px 1px #cfcfcf;
	-o-box-shadow: 0px 0px 3px 1px #cfcfcf;
	box-shadow: 0px 0px 3px 1px #cfcfcf;
	filter:progid:DXImageTransform.Microsoft.Shadow(color=#cfcfcf, Direction=NaN, Strength=3);
	margin-bottom:20px;
}
div.offre {
	background:url(../img/bg--titre-emploi.png) repeat-x top #FFF;
	-moz-box-shadow: 0px 0px 3px 1px #cfcfcf;
	-webkit-box-shadow: 0px 0px 3px 1px #cfcfcf;
	-o-box-shadow: 0px 0px 3px 1px #cfcfcf;
	box-shadow: 0px 0px 3px 1px #cfcfcf;
	filter:progid:DXImageTransform.Microsoft.Shadow(color=#cfcfcf, Direction=NaN, Strength=3);
	margin-bottom:20px;
	padding:30px 20px 20px 20px;
	float:left;

}

div.offre h6, div.candidature h6 {
	background-color:#0aace5;
	font-size:18px;
	padding:15px 0;
	color:#FFF;
}

div.offre p, strong {
	color:#989fa9;	
}

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

PAGE CONTACT

*********************************************/
.covercontactbg {
	background:url(../img/bg-contact.jpg) no-repeat center top fixed;
}

div.covercontact {
	height:335px;
}

div.covercontact div.adresselh {
	float:left;
	text-align:left;
	margin-top:70px;
}

div.covercontact div.adresseparis {
	float:right;
	text-align:right;
	margin-top:70px;
}

div.covercontact h5 {
	font-size:32px;
	color:#FFF;
	background:url(../img/bg-tittlecover.png);
	display:inline-block;
	padding:5px 10px;
	font-weight:300;
}

div.covercontact h6 {
	font-size:19px;
	color:#FFF;
	background:url(../img/bg-tittlecover.png);
	display:inline-block;
	padding:5px 10px;
	font-weight:300;
}

div.covercontact div.adresseparis {
	float:right;
}

div.contact .form1, div.contact .form2 {
	width:50%;
	float:left;
	text-align:left;
	padding-left:7%;
}

div.contact .form3 {
	width:100%;
	text-align:left;
	padding:0 7%;
	margin-top:20px;
}


div.contact .form1 h5, div.contact .form2 h5, div.contact .form3 h5 {
	font-size:18px;
}

div.contact .form1 .requis, div.contact .form2 .requis {
	font-size:12px;
	margin:30px 0;
}

div.contact label.champs {
	display:block;
	font-size:13px;
	color:#999;
	width:80%;
}

div.contact input.text, div.contact  select {
	width:80%;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	margin: 0;
	border: 1px solid #aaa;
	padding:10px 10px;
	margin-right:20px;
	margin-bottom:20px;
	font-size:14px; 
}

div.contact textarea {
	resize: none;
	width:100%;
	padding:10px;
	border: 1px solid #aaa;
	display: inline-block;
	font-size:16px;
	height:197px;
}

div.contact .file {
	margin:5px 0 27px 0;
}

label.valid {
	width: 24px;
	height: 24px;
	background: url(../img/valid.png) center center no-repeat;
	display: inline-block;
	text-indent: -9999px;
}

label.error {
	font-weight: bold;
	color: red;
	font-size:12px;
	margin-top:-17px;
}
.modal_contact {
	font-size:14px;
	text-transform:none;
	
}
.modal_contact p {
	margin:30px 80px;
	padding:0 0 0 30px;
	
	text-align: justify;
	text-transform:uppercase;
	color:#093;
}

.modal_contact p.error {
	background:url(../img/error.png) no-repeat left center;
}
.modal_contact p.success {
	background:url(../img/valid.png) no-repeat left center;
}


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

PAGE COTATION

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

.hidefield {
    display:none;
}

.cotation-form h5 {
	text-align:left;
	border:1px solid #6F0
}

.moisannee {
	width:20%;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	margin: 0;
	border: 1px solid #aaa;
	padding:10px 10px;
	margin-right:20px;
	margin-bottom:20px;
	font-size:14px;
}


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

PAGE LOGIN CATAlOGUE

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

.covercataloguebg {
	background:url(../img/bg-catalogue.jpg) no-repeat center top fixed;
}



div.covercatalogue h1 {
	margin:80px 0;
}

div.catalogue {
	padding-bottom:20px;
	text-align:left;
}

div.catalogue input.text {
	width:60%;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	margin: 0;
	border: 1px solid #aaa;
	padding:10px 10px;
	margin-right:20px;
	margin-bottom:20px;
	font-size:14px; 
}

span.lostpassword {
	display:block; 
	margin-top:-20px; 
	margin-bottom:10px;
}

button.red {
	background-color:#d50917;
	color:#FFF;
} 
button.green {
	background-color:#54ab2e;
	color:#FFF;
}



/* Style for the contact form and status messages */



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

TEST

****************************/
div.line1px {
	background:url(../img/fleche-1px.png) no-repeat center;
	height:26px;
	margin-top:-25px;
}
div.line1pxgrey {
	background:url(../img/fleche-1px-grey.png) no-repeat center;
	height:26px;
	margin-top:-25px;
}


