@import url("w3.css");
/*@import url("https://www.w3schools.com/lib/w3-theme-white.css");*/
@import url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css");


/*
************************************* COULEURS *************************************
*/

/******** **************************************/
:root {
	/* définition comme variable, utilisation var(--color-primary-0) */
	/* https://paletton.com/#uid=13i0u0kfUvA6eR6b8Gjkdr4ormT */ 
    
	--color-primary-l3: #9CA9A9; /* plus plus gris */ 
	--color-primary-l2: #B4DFDF; /* plus plus clair */ 
	--color-primary-l1: #7BBDBD; /* plus clair */
	--color-primary-0:  #4C9797; /* Main Primary color */
	--color-primary-d1: #308181; /* plus sombre*/
	--color-primary-d2: #1A6D6D; /* plus plus sombre*/
}

body {
	margin: 5px 15px;
	
	font-family: Trebuchet MS, Verdana, Arial, sans-serif;

}
/* ajustement forum */
#punindex, #punsearch, #punadmin_index, #punviewtopic {
	font-size:15px;
}
.pun {
	font-size:15px;
}

.announce-block {
	font-size: 12px;
}

/* surcharge theme w3 */
#racp-content {
	font-size: 12px; /* taille par défaut */
}

#racp-content h1:not(.pun h1) {
	font-size: 30px;
	margin: 2px;
	margin-top: 16px !important;
}
#racp-content h2:not(.pun h2) {
	font-size: 18px;
	margin: 2px;
	margin-top: 16px !important;
}
#racp-content h3:not(.pun h3) {
	font-size: 16px;
	/*margin: 2px;*/
	margin-top: 10px ;
	color: #000 !important;
	background-color: var(--color-primary-l1) !important;
	padding-left: 5px;
}
#racp-content h4:not(.pun h4) {
	font-size: 14px;
	/*margin: 2px;*/
	margin-top: 10px ;
	color: #000 !important;
	background-color: var(--color-primary-l3) !important;
	padding-left: 5px;
}
#racp-content h5:not(.pun h5) {
	font-size: 14px;
	margin: 2px;
}
#racp-content h6:not(.pun h6) {
	font-size: 13px;
	margin: 2px;
}

a[target=_blank]::after {
	content: ' \f08e';
	font-family: FontAwesome;
   
/*	display: inline-block;
	text-decoration: none;
	height: 13px;
	overflow: hidden;
	padding-left: 10px;*/
}

a.no-picto-after::after {
	content: '';
}
a.no-link {
	text-decoration: none;
}


.image-top-page, .image-bottom-page{
	width: 100%;
}
.image-bottom-page {
	margin-top: 16px;
}

div.w3-rest {
	padding-left: 15px;
}

.w3-button:hover {
	 background-color: var(--color-primary-l2) !important; /*#ccc;*/
}

/*
************************************* MENU *************************************
*/
nav {
	 width: 100%;
	 align-self: flex-start;
	 position: sticky;
	 top: 0;
	 z-index: 1000;
	 display: flex;
	 font-size: 15px;
}
nav ul {
	 list-style: none;
	 display: flex;
	 margin: 0;
	 padding: 0;
}
 nav ul li {
	 position: relative;
}

nav ul a {
	 text-decoration:none;
	 display: block;
}


/* survol lien final */ 
nav ul a:hover {
	background-color: transparent;
}
/*nav ul a:hover, */
nav ul li ul li:hover,
nav>ul>li:hover {
	 background-color: var(--color-primary-l2) ; /*#ccc;*/
}

nav>ul>li>ul>li {
	text-align: left;
	padding: 0px;
}

/* survol entete menu */
nav ul li.has-subnav:hover {
	 background-color: #fff;
}
 nav ul .subnav {
	 visibility: hidden;
	 flex-direction: column;
	 background-color: #fff;
	 position: absolute;
	 left: 0;
	 top: 99%;
	 border-radius: 0px 0px 10px 10px;
}
nav ul.subnav>li {
	background-color: transparent;
/*	border-left-color: #fac534; */
	border-left-color: var(--color-primary-l1);
	border-left-style: solid;
}	
nav ul>li.subnav:hover {
	/*border-left-color: #fac534;*/
	border-left-color: var(--color-primary-l1);
	border-left-style: solid;
}

nav ul.subnav>li:last-child {
	border-radius: 0px 0px 10px 10px;
}	
 nav ul .has-subnav:hover .subnav, nav ul .has-subnav:focus .subnav, nav ul .has-subnav:focus-within .subnav, nav ul .subnav:hover {
	 visibility: visible;
}

 .wrapper {
	 display: flex;
	 flex-wrap: wrap;
	 width: 100%;
}
nav li {
	border: none;
	display: inline-block;
	padding: 4px 16px;
	vertical-align: middle;
	text-decoration: none;
	color: inherit;
	background-color: inherit;
	text-align: center;
	cursor: pointer;
	white-space: nowrap;
}

#mininav a {
    font-size: 12px;
}

.racp-theme-l2 {color:#000 !important; background-color:var(--color-primary-l2) !important}
.racp-theme-l1 {color:#000 !important; background-color:var(--color-primary-l1) !important}
.racp-theme    {color:#000 !important; background-color:var(--color-primary-0)  !important}
.racp-theme-d1 {color:#000 !important; background-color:var(--color-primary-d1) !important}
.racp-theme-d2 {color:#000 !important; background-color:var(--color-primary-d2) !important}
.racp-theme-l3 {color:#000 !important; background-color:var(--color-primary-l3) !important}

.racp-theme-l2-text {color:var(--color-primary-l2) !important}
.racp-theme-l1-text {color:var(--color-primary-l1) !important}
.racp-theme-text    {color:var(--color-primary-0)  !important}
.racp-theme-d1-text {color:var(--color-primary-d1) !important}
.racp-theme-d2-text {color:var(--color-primary-d2) !important}
.racp-theme-l3-text {color:var(--color-primary-l3) !important}


/* texte souligné */
.underline {
	text-decoration-line: underline;
}

.str2img {
	padding-bottom: 5px !important;
}
/*
*************************************      *************************************
*/

.racp-main {	
	margin: 8px auto auto auto;
	max-width: 1600px;
}


/*
*************************************      *************************************
*/
.flex-container {
  display: flex;
}
.flex-container > .carte_bureau {
	width: auto;
	margin: 0 20px 0 0;
}

.racp_bandeau_connexion {
	background-color: #0000003d !important;
	font-size: 14px;
}

.racp_splitter {
	width: 95%;
	margin: auto;
	text-align: center !important;
	font-weight: bold;
	border-bottom: 1px solid #ccc !important;
	border-top: 1px solid #ccc !important;
	font-size: 12px;
}

.racp_paragraphe {
	width: 95%;
	text-align : center;
	margin: auto;
	font-size: 12px;
}

.max-width-95 {
	max-width:95%
}

/************** documents ****************/

.bandeau-vert, .bandeau-rouge, .bandeau-orange, .bandeau-blanc  {
	text-align:center;
	position:absolute;
	border-left: 20px solid transparent;
	border-right: 20px solid transparent;
	border-bottom: 20px solid rgba(255, 255, 255, 0.7); /*blanc à 70% */
	height:  0;
	margin-bottom:0px;
	width: 100px;
	line-height: 18px;
	transform: rotate(-45deg) translate(-30px,-0px);
	font-family: "Arial Black", Gadget, sans-serif;
}
.bandeau-vert {
	border-bottom: 20px solid rgba(155,200,80, 0.8);
}
.bandeau-rouge {
	border-bottom: 20px solid rgba(255,0, 0, 0.8);
}
.bandeau-orange {
	border-bottom: 20px solid rgba(255, 165, 0, 0.8);
}

/* roadsign : utilisation <span class=roadsign><span>Text</span></span> */
span.racp-roadsign {
	padding:3px;
	background-color: var(--color-primary-l2) !important;
	border-radius: 4px;
	margin: 1px;
}
span.racp-roadsign>span {
	background-color: var(--color-primary-l2) !important;
	border: 1px solid #ccc !important;
	border-color: #fff !important;
	border-radius: 4px;
}

/* tableaux pages modele_19xx */
.cMonTableauRule {
	width: 100%;
	border-collapse: collapse;
	border-top: 4px solid #808080;
	border-bottom: 4px solid #808080;
	font-size: 10px
}

.cMonTableauRule th {
	border-bottom: 1px solid #808080;
	width: 100px
}

.cMonTableauRule td {
	border-bottom: 1px solid #808080;
}

/* boutique piece */
td.imgPiece:hover {
	background: none;
	z-index: 1050;
}
   
td.imgPiece span {
	display: none;
}
td.imgPiece:hover span {
	display: block;
	position: fixed;
	top: 100px;
	left: 40px;
	font-weight:normal;
	width:550px;
	background: white;
	padding: 5px;
	border: 1px solid #000000;
	border-left: 1px solid #000000;
}

.puce {
	padding-left: 10px;
	margin-left: 5px;
	padding-top: 3px;
}
.puce:before {
	content: '\2022';
	padding-left: 10px;
	margin-left: 5px;
	padding-top: 3px;
}

.english {
    font-style: italic;
    padding: 10px;
    background-color: var(--color-primary-l2) ;
    margin: 10px 50px 5px 20px;
}

/* vehicle plate option decoder */
#table_option {
	position:relative;
	background-repeat: no-repeat; 
	width:567px; 
	height:358px;
}
#table_option input {
	position:absolute; 
	background-color:transparent;
	height: 32px;
	font-size:2.1em
}
/* Customize the label (the container) */
#plate_decoder label {
  display: block;
  position: relative;
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 14px;
}

/* Hide the browser's default checkbox */
#plate_decoder label input {
  /*position: absolute;*/
  /*opacity: 0;*/
  cursor: pointer;  
  margin-right: 5px;
}


html#facebook.svg body.plugin.gecko.win.x1.Locale_fr_FR div._li div div#u_0_0_iK div div._2p3a div#u_0_4_zx._2lqg div div._2hkj div div._10b4
{
	max-height:500px;
}

.tableauTarif {
	font-variant: small-caps;
}
.tableauTarif .col_item_1 {
	background-color: #d3d3d382;
}
.tableauTarif .col_item_2 {
	background-color: lightgrey
}
.tableauTarif .border_bottom_none {
	border-bottom: none !important;
}
.tableauTarif tr.last 
{
	border-bottom: 2px #808080 solid !important;	
}