/*
Theme Name: 082013p666
Theme URI: 
Description: 18.08.2013
Version: 1.0
Author: bastien jannot-jerome
Author URI: bastien jannot-jerome
Tags: flexible-width, three-columns, valid HTML5, valid XHTML, widgets
*/

/* begin Page */
@charset "utf-8";

body {

background-image: url("https://www.pavillon666.fr/p666-head.jpg");
background-image: linear-gradient(to bottom, rgba(0,0,0,0.1), rgba(0,0,10,80)), url("https://www.pavillon666.fr/p666-head.jpg");
background-position: top;
	
color: #ffffff;
   font-size: 15px;
   font-family: Arial, 'Arial Unicode MS', Helvetica, Sans-Serif;
   font-weight: normal;
   font-style: normal;
   width: 100%;
       	margin: 0; /* il est conseillé de mettre à zéro la marge et le remplissage de l'élément body, pour tenir compte des différentes valeurs par défaut des navigateurs */
    	padding: 0;
}

h1 {
  font-size: 100px;
	 text-align:center;
	display: block;
}



/* entreelien bouton */

a.external {
    position: relative;
    display: inline-block;
    padding: 20px 40px;         /* Grand bouton */
    background-color: #8B0000;  /* Rouge foncé */
    color: white;               /* Texte blanc de base */
    text-decoration: none;
    font-weight: 700;           /* Texte bien en gras */
    font-size: 2rem;            /* Taille de police augmentée */
    border-radius: 10px;
    overflow: hidden;
    transition: background-color 0.3s ease, color 0.3s ease;
}

a.external::before {
    content: "EXPLORER";
    transition: content 0.3s ease;
    color: white; /* Texte blanc par défaut */
}

a.external:hover::before {
    content: "EXPLORE";
    color: white; /* Assure que le texte reste blanc au hover */
}


/* Rendre l'image responsive */
.responsive {
    max-width: 100%;
    height: auto;
    display: block; /* Supprime les espaces blancs sous l'image */
    margin: 0 auto; /* Centre l'image si nécessaire */
}


/* Version responsive-bis : Limite la hauteur à 500px tout en restant responsive */
.responsive-bis {
    max-width: 100%;     /* L'image ne dépasse jamais la largeur de son conteneur */
    max-height: 500px;   /* La hauteur est limitée à 500px */
    height: auto;        /* Maintient les proportions de l'image */     /* Supprime l'espace sous l'image */
    margin: 0 auto;      /* Centrer l'image si nécessaire */
}

.responsive-pub {
    max-width: 100%;
    height: auto;
    display: block;
    border: 2px solid #8B0000; /* Rouge foncé */
}
/* tableaux */

table {
font-family: Arial, 'Arial Unicode MS', Helvetica, Sans-Serif;
font-size: 15px;
border-color: none;
}

.grey {
border-style: solid; 
border-width: 0px; 
}

.greydark {
border-style: solid; 
border-width: 0px; 
   background: #535159;
   background: rgba(83, 81, 89, 0.5);
   padding:6px 3px;
   margin:0 auto;
}

.zero {
border-width: 0px; 
border-color: none;
background-color: none;
}

.red2010 {
border-width: 0px; 
border-color: none;
   background: #721314;
   background: rgba(114, 19, 20, 0.5);
}
.black {
border-width: 0px; 
border-color: none;
   background: #000000;
   background: rgba(0, 0, 0, 0.5);
}

.image {
float: left;
}

a img { /* ce sélecteur élimine la bordure bleue par défaut affichée dans certains navigateurs autour d'une image lorsque celle-ci est entourée d'un lien. */
	border: none;
}

a:link {
   font-size: 15px;
   font-family: Arial, 'Arial Unicode MS', Helvetica, Sans-Serif;
   font-weight: normal;
  font-style: normal;
   text-decoration: none;
   color: #FF0000;
}
a:visited {
   font-size: 15px;
   font-family: Arial, 'Arial Unicode MS', Helvetica, Sans-Serif;
   font-weight: normal;
   font-style: italic;
   text-decoration: none;
   color: #FFFFFF;
}
a:hover, a:active, a:focus {
   font-size: 15px;
   font-family: Arial, 'Arial Unicode MS', Helvetica, Sans-Serif;
   font-weight: normal;
   font-style: italic;
   text-decoration: none;
   color: #C21F22;
}
