:root{
	
/* Font des titres */
--title-font: 'Rubik', sans-serif;

/* Couleurs principales */
--main-color:#14457a;
--second-color:#c4000f;
--flash-color:#14457a;
--third-color:#ffffff;

--success-color: #99bb3d;
--warning-color: #dc9435;
--error-color: #d31111;

/* Couleur du texte */
--text-color:#616161;
/* Taille du texte de base */
--text-size: 14px;

/* Couleur des blocs de la sidebar et des miniatures produits */
--block-bg:#F6F9FC;

/* Couleur des borders */
--border-color:#dedede;

/* Couleur du fond de page*/
--bg-color: #e9ecef;

/* Coins arrondis du site */
--radius: 0px;

/* Ombres des blocs */
--shadow: 0px 5px 10px rgba(0,0,0,.05);

/* transitions */
--transition: all ease-in-out .1s;



/* CONTENEUR PRINCIPAL DU CORPS DE PAGE */
/* Couleur du conteneur principal */
--mainSection-bg:none;
/* Ombre sous le conteneur principal (unset ou Xpx Xpx Xpx rgba(X,X,X,X)) */
--mainSection-shadow: unset;
/* Largeur du conteneur principal (1140 ou 980) */
--mainSection-width:1040px;
/* Padding du conteneur principal */
--mainSection-padding:0px;
/* margin du conteneur principal */
--mainSection-margin: 30px 0 15px 0;

/* Couleur du conteneur principal sur les pages intérieures (hors accueil) */
--pageSection-bg:none;
/* Ombre sous le conteneur principal (unset ou Xpx Xpx Xpx rgba(X,X,X,X)) */
--pageSection-shadow: unset;
/* Padding du conteneur principal */
--pageSection-padding:0px;

/* COLONNE PRINCIPALE */
/* Couleur de fond du bloc de contenu | default:none */
--mainCol-bg: none;
/* Padding du bloc de contenu | default:0px */
--mainCol-padding:0px;

/* SIDEBAR */
/* Couleur de fond de la sidebar | default:none */
--sidebar-bg: none;
/* Padding de la sidebar | default:0px */
--sidebar-padding: 0px;

/* BACKGROUND ------------------------------------------- */

/* Nom du fichier de l'image de fond du site */
--bg-img:'bg_body.jpg'; /* pour rien mettre '' */

/* Répétition du background  */
--bg-repeat:no-repeat;
/* Comportement du background (fixed ou local) */
--bg-comportement:local;

/* Positionnement du background */
/* Latéral */
--bg-posX:center;
/* Vertical */
--bg-posY:top;

/* BOUTONS ------------------------------------------- */
/* boutons principaux */
--button-radius:var(--radius);
--button-bg:var(--main-color);

--button-text:#fff;
--button-text-size:14px;
--button-border:0px;
--button-padding:7px 20px;

--button-icon-color:var(--flash-color);
--button-icon-size:14px;

--button-pin-bg:#fff;
--button-pin-border: 1px solid var(--main-color);
--button-pin-color:var(--second-color);
--button-pin-font-size:11px;
--button-pin-size:20px;

--button-hover-bg: var(--button-bg);
--button-hover-border: var(--button-border);
--button-hover-color: var(--button-text);
--button-hover-transform: scale(1.05);
--button-hover-icon-color: var(--button-icon-color);
--button-hover-pin-color: var(--button-pin-color);
--button-hover-pin-bg: var(--button-pin-bg);
--button-hover-pin-border: var(--button-pin-border);


/* boutons secondaires */
--secondary-button-radius:var(--radius);
--secondary-button-bg:#fff;

--secondary-button-text:var(--text-color);
--secondary-button-text-size:14px;
--secondary-button-border:1px solid var(--second-color);
--secondary-button-padding:7px 20px;

--secondary-button-icon-color:var(--second-color);
--secondary-button-icon-size:14px;

--secondary-button-pin-bg:#fff;
--secondary-button-pin-border: 1px solid var(--main-color);
--secondary-button-pin-color:var(--second-color);
--secondary-button-pin-font-size:11px;
--secondary-button-pin-size:20px;

--secondary-button-hover-bg: var(--secondary-button-bg);
--secondary-button-hover-border: var(--secondary-button-border);
--secondary-button-hover-color: var(--secondary-button-text);
--secondary-button-hover-transform: scale(1.05);
--secondary-button-hover-icon-color: var(--secondary-button-icon-color);
--secondary-button-hover-pin-color: var(--secondary-button-pin-color);
--secondary-button-hover-pin-bg: var(--secondary-button-pin-bg);
--secondary-button-hover-pin-border: var(--secondary-button-pin-border);


/* Onglets (dans les pages mon compte, panier, etc) */
--onglets-wrapper-bg: var(--block-bg);
--onglets-bg: transparent;
--onglets-text: var(--text-color);
--onglets-hover-bg: #fff;
--onglets-hover-text: var(--text-color);
--onglets-active-bg: #fff;
--onglets-active-text: var(--second-color);


/* HEADER ----------------------------------------------------------------------------------------------------------------------------- */
/* Border Top du site */
/* Epasseur*/
--top-border:0px;
/* Couleur */
--top-border-color: var(--flash-color);

/* Largeur du conteneur du header (1140 ou 980 ou 100%) */
--header-width:var(--mainSection-width);

/* Hauteur du header de toutes les pages */
--header-height:80px;
/* Marge sous le header */
--header-margin-bottom: 0px;

/* Couleur de fond du header */
--header-bg-color: #fff;
/* Ombre sous le header */
--header-shadow: 0px 5px 10px rgba(0,0,0,.05);

/* Widgets */
/* position (flex-start, center ou flex-end) */
--header-widgets-justify: flex-end;
--header-widgets-align: center;


/* Nom du fichier de l'image de fond du HEADER du site */
--header-bg-img:''; /* pour rien mettre '' */
--header-bg-repeat:'no-repeat';

/* Positionnement du background du HEADER */
/* Latéral */
--header-bg-posX:left;
/* Vertical */
--header-bg-posY:top;



/* PAGES PRE-LOGIN ----------------------------------------------------------------------------------------------------------------------------- */

--card-width: 500px; /* Largeur du bloc */

--card-bg: #fff; /* Background du bloc */
--card-border: 1px solid var(--border-color);




/* PAGE D'ACCUEIL ----------- */

/* Hauteur du header de la page d'accueil */
--header-index-height:350px;

/* Nom du fichier de l'image de fond du HEADER de l'INDEX du site */
--header-index-bg-img:'bg-header-bose.png'; /* pour rien mettre '' */

/* Positionnement du background du HEADER de l'INDEX */
/* Latéral */
--header-index-bg-posX:left;
/* Vertical */
--header-index-bg-posY:top;

/* Répartition du header (12 à répartir entre les 2 zones) */
/* taille de la zone du logo (de 1 à 11) */
--header-logo-cols:4;
/* taille de la zone de widget (de 1 à 11) */
--header-widget-cols: 8;

/* Alignement du logo (flex-start, center ou flex-end) */
--header-logo-justify: flex-start;

/* NAVBAR
----------------------------------------------------------------------------------------------------------------------------- */

/* Affichage de la barre de menu (Block ou none) */
--navbar-display: none;

/* Largeur du conteneur de la navbar (1140 ou 980 ou 100%) */
--navbar-width:var(--mainSection-width);

/* Couleur de fond de la navBar */
--navbar-bg:var(--main-color);

/* Bord arrondis de la navbar */
--navbar-radius:0px;



/* RESPONSIVE --------------------------------------------------------------------------------------------------------------------------- */

/* Valeur du breakpoint (taille en px à partir de laquelle on passe en mode mobile) */
--mobile-breakpoint:768;

/* Nom du fichier de l'image de fond du site en version mobile */
--mobile-bg-img:'bg-bose.jpg'; /* pour rien mettre ''

/* Nom du fichier de l'image de fond du HEADER du site en version MOBILE */
--mobile-header-bg-img:'bg-header-bose-mobile.png'; /* pour rien mettre ''

/* Taille du background du header */
--mobile-header-height:'contain';

/* Nom du fichier de l'image de fond du HEADER de l'INDEX du site en version MOBILE */
--mobile-index-header-bg-img:'bg-header-bose-mobile.png'; /* pour rien mettre ''

/* Hauteur du header de la page d'accueil en version MOBILE */
--mobile-index-header-height:200px;
/* Hauteur du header de toutes les pages en version MOBILE */
--mobile-header-height:150px;




}