/* ----------------------------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------- */
/* -------------------------------------- RESET -------------------------------------- */
/* ----------------------------------------------------------------------------------- */ 
html, body, div, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, p, form, fieldset, table, th, tr, td {
margin:0;
padding:0;
} 
img {
border:0;
}
/* ----------------------------------------------------------------------------------- */
/* --------------------------- Ajout de style aux balises html ----------------------- */
/* ----------------------------------------------------------------------------------- */ 
body {
background:#444;
font-family:Geneva, Arial, Helvetica, sans-serif;
font-size:14px; 
color:#000;
}
p {
text-align:justify;
line-height:20px;
}

h1 {
padding-left:10px; 
background:url('../images/bg-redray.png') top left no-repeat; 
font-size:24px;
font-weight:bold;
color:#EEE;
}
h2 {
font-size:20px;
}
h3 {
font-size:16px;
}

a {
color:#000;
text-decoration:none;
}
a:hover {
color:#000;
}
/* ----------------------------------------------------------------------------------- */
/* ---------------------------- NAVIGATION PRINCIPALE--------------------------------- */
/* ----------------------------------------------------------------------------------- */ 
#wrapper-navigation {
position:absolute;
right:20px;
bottom:2px;
height:28px;
/*width:550px;*/
}
#wrapper-navigation ul {
list-style:none;
float:right;
}
#wrapper-navigation ul li {
float:left;
display:block;
font-size:20px;
font-weight:bold;
line-height:28px;
padding-right:15px;
}
#wrapper-navigation li a {
float:left;
display:block;
color:#EEE;
}
#wrapper-navigation li a:hover {
color:#E40000;
}
/* ----------------------------------------------------------------------------------- */
/* -------------------------------------- STRUCTURE ---------------------------------- */
/* ----------------------------------------------------------------------------------- */ 
#wrapper-page {
margin : 0 auto;
width:1004px;
}
#header {
height:210px;
background:#f1f1f1 url('../images/bg-header.png') top left no-repeat; 
margin:0 auto;
position:relative;
}
#content {
overflow:hidden;
background:#fff url('../images/bg-body.png') 0 0 repeat-y;
padding:18px 0 5px 35px;
}
#footer {
height:50px;
background:#fff url('../images/bg-footer.png') top left no-repeat;
font-size:14px;
}
/* ----------------------------------------------------------------------------------- */
/* --------------------------------- DETAIL HEADER ----------------------------------- */
/* ----------------------------------------------------------------------------------- */ 
#logo {
position:absolute;
top:0;
left:0;
width:450px;
height:170px;
}
.info {
position:absolute;
top:135px;
font-weight:bold;
font-size:22px;
font-style:italic;
left:30px;
color:#EEE;
}
/* ----------------------------------------------------------------------------------- */
/* --------------------------------- DETAIL CONTENT ---------------------------------- */
/* ----------------------------------------------------------------------------------- */ 
#c1 {
float:left;
width:600px;
margin-right:20px;
}
#c2 {
float:left;
/*width:295px;*/
width:325px;
background-color:#000;
padding:10px;
}
/* ----------------------------------------------------------------------------------- */
/* ------------------------------------ COLONNES ------------------------------------- */
/* ----------------------------------------------------------------------------------- */ 
/*
détail C1
*/

/*
détail C2
*/
#c2 h2 {
color:#EEE;
}
#c2 p {
margin-top:10px;
padding-left:10px;
color:#EEE;
font-size:14px;
border-left:#d71216 solid 5px;

}

#c2 a {
color:#EEE;
text-decoration:none;
}

#c2 a:hover {
color:#EEE;
}

/* ----------------------------------------------------------------------------------- */
/* --------------------------------- DETAIL FOOTER ----------------------------------- */
/* ----------------------------------------------------------------------------------- */ 
}
#footer .left {
float:left;
padding-left:11px;
color:#EEE;
}
#footer .right {
float:right;
padding-right:11px;
color:#EEE;
}
#footer .left a {
}
#footer .left a:hover {
text-decoration:underline;
font-weight:bold;
}
/* ----------------------------------------------------------------------------------- */
/* ----------------------------------- FORMULAIRE ------------------------------------ */
/* ----------------------------------------------------------------------------------- */ 
/*.form label {
display:block;
width:200px;
float:left;
margin-right:20px;
text-align:right;
font-size:16px;
color:black;
line-height:30px;
}
.form fieldset {
border:0;
}
/*
.form div {
padding-bottom:10px;
}
.form textarea {
height:250px;
width:300px;
padding:0px;
border:#ccc solid 1px;
border-top:#ccc solid 2px;
font-size:16px;
resize: vertical;
}
/*
.form input[type="text"], .form input[type="email"] {
height:20px;
width:300px;
border:#ccc solid 1px;
border-top:#ccc solid 2px;
line-height:20px;
font-size:18px;
}

.form .submit {
height:30px;
width:300px;
border:0;
line-height:30px;
font-size:16px;
background-color:#b70100;
color:#fff;
cursor:pointer;
}
*/
#form_list_region {
width:302px;
padding:0px;
}

	.form .submit:hover {color:#000}

/* ----------------------------------------------------------------------------------- */
/* ---------------------------------- SIMPLE LIGHTBOX -------------------------------- */
/* ----------------------------------------------------------------------------------- */ 

/* ----------------------------------------------------------------------------------- */
/* --------------------------------- TOOLS ------------------------------------------- */
/* ----------------------------------------------------------------------------------- */ 
.encadre {
background-color:#d7e5f0;
border:#bec7ce solid 1px;
padding:5px;
}
a.lk {
color:#fff;
text-decoration:none;
}
a.lk:hover {color:#000;}

a.lk2 {
font-weight:bold;
background:#d81114;
height:20px;
padding:0 20px;
line-height:20px;
display:block;
color:#fff;
text-align:center;
}
a.lk2:hover {
background-color:#ff0000;
color:#000;

}


.sep {
height:20px;
font-size:0;
line-height:0;
}
.sep2 {
height:10px;
font-size:0;
line-height:0;
}
.clearFix {
clear:both;
}
.erreur {
border:red solid 2px;
padding:5px;
background-color:pink;
color:#000;
margin-bottom:15px;
}
.ok {
border:orange solid 2px;
padding:5px;
background-color:#f9e4b8;
color:#000;
margin-bottom:15px;
}
/* lien customisé utilisé dans les différentes section */

/*
Tableau
*/
.tableau {
border-collapse:collapse;
width:100%;
}
.tableau td, .tableau th {
width:33%;
text-align:center;
vertical-align:top;
}
/* ----------------------------------------------------------------------------------- */
/* --------------------------------- PAGE DETAIL ------------------------------------- */
/* ----------------------------------------------------------------------------------- */ 

/**
 *  Carousel
 */
.jcarousel-skin-showroom .jcarousel-container { border:#bec7ce solid 1px; }
.jcarousel-skin-showroom img.visuel { width:127px; height:98px; border:0; } 
.jcarousel-skin-showroom .jcarousel-direction-rtl { direction:rtl; }
.jcarousel-skin-showroom .jcarousel-container-horizontal { width:538px; padding: 10px 30px; }
.jcarousel-skin-showroom .jcarousel-clip-horizontal { width: 538px; height:98px; }
.jcarousel-skin-showroom .jcarousel-item {  width:127px; height:98px; }
.jcarousel-skin-showroom .jcarousel-item-horizontal {margin-left:0; margin-right:10px;  }
.jcarousel-skin-showroom .jcarousel-direction-rtl .jcarousel-item-horizontal {margin-left:0; margin-right:0; }
.jcarousel-skin-showroom .jcarousel-item-placeholder { background: #fff; color: #000; }
/**
 *   Carousel Horizontal Buttons
 */
.jcarousel-skin-showroom .jcarousel-next-horizontal { position: absolute; top: 37px; right:0; width:30px; height:30px; cursor: pointer; background: transparent url(../images/next-horizontal.png) no-repeat 0 0; }
.jcarousel-skin-showroom .jcarousel-direction-rtl .jcarousel-next-horizontal { left:5px; right: auto; background-image: url(../images/prev-horizontal.png); }
.jcarousel-skin-showroom .jcarousel-next-horizontal:hover { background-position: -30px 0; }
.jcarousel-skin-showroom .jcarousel-next-horizontal:active { background-position: -60px 0; }
.jcarousel-skin-showroom .jcarousel-next-disabled-horizontal,
.jcarousel-skin-showroom .jcarousel-next-disabled-horizontal:hover,
.jcarousel-skin-showroom .jcarousel-next-disabled-horizontal:active { cursor: default; background-position: -90px 0; }
.jcarousel-skin-showroom .jcarousel-prev-horizontal { position: absolute; top:37px; left:0; width:30px; height:30px; cursor:pointer; background: transparent url(../images/prev-horizontal.png) no-repeat -90px 0; }   
.jcarousel-skin-showroom .jcarousel-direction-rtl .jcarousel-prev-horizontal { left: auto; right: 5px; background-image: url(../images/next-horizontal.png); }
.jcarousel-skin-showroom .jcarousel-prev-horizontal:hover {  background-position: -30px 0; }
.jcarousel-skin-showroom .jcarousel-prev-horizontal:active { background-position: -60px 0; }
.jcarousel-skin-showroom .jcarousel-prev-disabled-horizontal,
.jcarousel-skin-showroom .jcarousel-prev-disabled-horizontal:hover,
.jcarousel-skin-showroom .jcarousel-prev-disabled-horizontal:active { cursor: default; background-position: 0 0; }
/**
 * background-color:#d7e5f0;
 */
#carousel-view {  border-top:#bec7ce solid 1px; border-left:#bec7ce solid 1px; border-right:#bec7ce solid 1px; text-align:center; padding:15px 0; }
#carousel-view img { height:300px; }



/* ----------------------------------------------------------------------------------- */
/* ------------------------------- Perso TT by MiX ----------------------------------- */
/* ----------------------------------------------------------------------------------- */ 

.descr_title
{
	font-size: 16px;
	font-weight: bold;
}


.descr_txt{font-size: 14px;}


#link_partenaires
{
	-webkit-border-horizontal-spacing: 0px;
}

/* Renvoi sur LBC de Type-Top */ 
#link_lbc
{
/*	height: auto; /*43px;*/
/*	width: auto; /*600px;*/
/*	font-size: 24px;
*/	font-weight: normal;
	text-align: center;
	border: #F60 solid 10px;
	color: #F60;
}

	#link_lbc:hover
	{
		color: #FB0;
		border-color: #FB0;
	}

	#link_lbc:active
	{
		color: #FC0;
		border-color: #FC0;
	}

/* Changement d'image Norauto / Auto5 */ 
#logo_norauto, #logo_auto5
{
	background-image: url(/images/logo_part_norauto5.png);
	background-repeat: no-repeat;
	overflow: hidden;
	height: 70px;
	width: 142px;
	float: left;
}

	#logo_auto5
	{
		background-position: 0 0;
	}

	#logo_norauto
	{
		background-position: -142px 0;
	}

	#logo_auto5:hover
	{
		background-position: 0 -70px;
	}

	#logo_norauto:hover
	{
		background-position: -142px -70px;
	}

/* Tableau listing des remorques*/ 
.tab_rem
{
	padding: 3px;
	width: 600px;
	text-align: center;
	background-color: #000;
}

	.tab_rem tr	{background-color: #FFF;}

		.tab_rem tr:nth-child(even) {background-color: #CCC;}

		/* Changement de couleur et mise en gras lorsque survolé */ 
		.tab_rem tr:hover
		{
			font-weight: bold;
			color: #FFF;
			background-color: #F99;
		}

	.tab_rem th	
	{
		font-weight: bold;
		color: #FFF;	
		background-color: #000;
	}

	.tab_rem td
	{
		height: 18px;
		color: #000;
	}

/* Tableau des congés */ 
#tab_vacs
{
	height: 43px;
	width: 600px;
	font-size: 24px;
	font-weight: normal;
	text-align: center;
	border: #000 solid 10px;
	color: #FFF;
	background-color: #F00;
}

/* Tableau des tarifs de location */ 
#tarif_loc
{
	height: 90px;
	width: 600px;
	font-size: 16px;
	font-weight: bold;
	text-align: center;
	border: #000 solid 2px;
	color: #FFF;
	background-color: #000;
}

	/* Colorisation rouge - Tarifs location */
	.red
	{
		font-weight: normal;
		background-color: #900;
	}


/* Effets d'ombre en contour */ 
	.shadowFFF:hover{	filter: drop-shadow(0 0 10px #FFF);}

	.shadow000:hover{	filter: saturate(125%)	drop-shadow(0 0 10px #000);}


/* Tableau Lexique de rem'vérif */
#tab_presta_lex
{
	width: 150px;
	height : 20px;
	font-size: 16px;
	font-weight: bold;
	text-align: center;
	border: #000 solid 5px;
	color: #FFF;
	background-color: #000;
}

	/* <TH> de g_html_presta_lex - Rouge */
	#tab_presta_lex th	
	{
		font-weight: bold;
		color: #FFF;	
		background-color: #900;
	}

/* Tooltip - Popup sur texte */
.tooltip 
{
    position: relative;
    display: inline-block;
    /*border-bottom: 1px dotted black;*/
}

	/* Texte caché au chargement */
	.tooltip .tooltiptext 
	{
		visibility: hidden;
		width: 370px;
		background-color: #444;
		color: #fff;
		text-align: center;
		padding: 10px 0;
		border-radius: 6px;

		/* Position du texte caché */
		position: absolute;
		z-index: 1;
		bottom: 125%;
		left: 50%;
		margin-left: -60px;

		/* Apparition fade in */
		opacity: 0;
		transition: opacity 0.3s;
	}

	/* Fleche de la bulle */
	.tooltip .tooltiptext::after 
	{
		content: "";
		position: absolute;
		top: 100%;
		left: 10%;
		margin-left: -5px;
		border-width: 5px;
		border-style: solid;
		border-color: #555 transparent transparent transparent;
	}

	/* Apparition du texte au survol */
	#tab_presta_lex tr:hover .tooltiptext 
	{
		visibility: visible;
		opacity: 1;
	}


/* Tableau pleine page */
#tab_full_page
{
	width: 100%;
	border-collapse: collapse;
	border: 1px solid black;
}

	#tab_full_page td, #tab_full_page th
	{
		border: 1px solid black; 
		padding: 7px;
	}
	
	
/************************************************************************/
/************************************************************************/
/***            Ajout Arve et Giffre INFOGESTION                      ***/
/************************************************************************/
/************************************************************************/
fieldset {
/*
    display: block;
    margin-inline-start: 2px;
    margin-inline-end: 2px;
    padding-block-start: 0.35em;
    padding-inline-start: 0.75em;
    padding-inline-end: 0.75em;
    padding-block-end: 0.625em;
    min-inline-size: min-content;
    border-width: 2px;
    border-style: groove;
    border-color: rgb(192, 192, 192);
    border-image: initial;
*/
    border-style: none; /*groove;*/
/*    border-color: rgb(192, 192, 192);
    border-image: initial;*/
}

*, ::after, ::before {
    box-sizing: border-box;
}

form {
    display: block;
	padding: 12px;
}

.form label {
    display: block;
    width: 200px;
    float: left;
    margin-right: 20px;
/*    text-align: right;*/
    text-align: left;
    font-size: 16px;
    color: black;
    line-height: 30px;
}

.div-form  {
    display: block;
}

.div-form-select   {
    /*display: inline;*/
}

.div-form-select label  {
    /*display: inline;*/
	float: none;
}

.form-row {
    display: flex;
    flex-wrap: wrap;
    margin-right: -5px;
    margin-left: -5px;
    padding-right: 5px;
    padding-left: 5px;	
    margin-bottom: 1rem;
}

.form-group {
    margin-bottom: 1rem;
}

.col-md-6 {
    position: relative;
    width: 100%;
	margin: 0px;
}


label {
    display: inline-block;
    margin-bottom: 0.5rem;
}

#label-inputRGPD {
	width: 100%;
	display: inline;
}

.input {
    padding-left: 12px;
/*	width: 100%;*/
}

.input-select {
    padding-left: 0px;
/*	width: 100%;*/
}

.form-select {
	width: 15px;
}


.invalid-feedback {
    color: red;
	font-style: italic;
	/*display: none; */
	visibility: hidden;
}

.invalid-feedback-select {
    padding-left: 15px;
/*	width: 100%;*/
}

.form-control {
    display: block;
    width: 100%;
    height: calc(1.5em + 0.75rem + 2px);
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: 0.25rem;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

textarea.form-control {
    height: auto;
}

button, input, select {
    overflow: visible;
}
button, input, optgroup, select, textarea {
    margin: 0;
    font-family: inherit;
}

#div-form-antibot {
	visibility: hidden;
}

.stopprod {
	
}

.ribbon {
  width: 150px;
  height: 150px;
  overflow: hidden;
  position: absolute;
}
.ribbon::before,
.ribbon::after {
  position: absolute;
  z-index: -1;
  content: '';
  display: block;
  border: 5px solid #2980b9;
}
.ribbon span {
  position: absolute;
  display: block;
  width: 225px;
  padding: 15px 0;
  background-color: #3498db;
  box-shadow: 0 5px 10px rgba(0,0,0,.1);
  color: #fff;
  font: 700 18px/1 'Lato', sans-serif;
  text-shadow: 0 1px 1px rgba(0,0,0,.2);
  text-transform: uppercase;
  text-align: center;
}

/* top left*/
.ribbon-top-left {
  top: -10px;
  left: -10px;
}
.ribbon-top-left::before,
.ribbon-top-left::after {
  border-top-color: transparent;
  border-left-color: transparent;
}
.ribbon-top-left::before {
  top: 0;
  right: 0;
}
.ribbon-top-left::after {
  bottom: 0;
  left: 0;
}
.ribbon-top-left span {
  right: -25px;
  top: 30px;
  transform: rotate(-45deg);
}

/* top right*/
.ribbon-top-right {
  top: -10px;
  right: -10px;
}
.ribbon-top-right::before,
.ribbon-top-right::after {
  border-top-color: transparent;
  border-right-color: transparent;
}
.ribbon-top-right::before {
  top: 0;
  left: 0;
}
.ribbon-top-right::after {
  bottom: 0;
  right: 0;
}
.ribbon-top-right span {
  left: -25px;
  top: 30px;
  transform: rotate(45deg);
}

/* bottom left*/
.ribbon-bottom-left {
  bottom: -10px;
  left: -10px;
}
.ribbon-bottom-left::before,
.ribbon-bottom-left::after {
  border-bottom-color: transparent;
  border-left-color: transparent;
}
.ribbon-bottom-left::before {
  bottom: 0;
  right: 0;
}
.ribbon-bottom-left::after {
  top: 0;
  left: 0;
}
.ribbon-bottom-left span {
  right: -25px;
  bottom: 30px;
  transform: rotate(225deg);
}

/* bottom right*/
.ribbon-bottom-right {
  bottom: -10px;
  right: -10px;
}
.ribbon-bottom-right::before,
.ribbon-bottom-right::after {
  border-bottom-color: transparent;
  border-right-color: transparent;
}
.ribbon-bottom-right::before {
  bottom: 0;
  left: 0;
}
.ribbon-bottom-right::after {
  top: 0;
  right: 0;
}
.ribbon-bottom-right span {
  left: -25px;
  bottom: 30px;
  transform: rotate(-225deg);
}

.ribbon-1 {
  position: fixed;
  background: #08769b;
  box-shadow: 0 0 0 999px #08769b;
  clip-path: inset(0 -100%);
}
.r-left {
  inset: 0 auto auto 0; /* top and left equal to 0 */
  transform-origin: 100% 0; /* OR top right */
  transform: translate(-29.3%) rotate(-45deg);
}
.r-right {
  inset: 0 0 auto auto; /* top and right equal to 0 */
  transform-origin: 0 0; /* OR top left */
  transform: translate(29.3%) rotate(45deg);
}

.box-ribbon {
	max-width:295px;
  height:200px;
  margin:0 auto 0;
  /*background:lightblue;*/
  position:relative;
}

@media (min-width: 768px)
{
	.col-md-6 {
		flex: 0 0 50%;
		max-width: 50%;
	}
}