/* CSS de la page détail des vph */

/* Définit l'image de fond du container Body */
.block-body
{
    background-color : white;
    background : url('../../img/topFormulaire.png') no-repeat;
    background-size: 1493px;
    margin-top : -15px;
    background-position-x: center;
}

/* Définit le style du formulaire */
.policeDetail
{
    font-family : 'Quicksand', sans-serif;
}

/* Définit le style du titre du Formulaire */
.policeDetail .titreDetail
{
    text-align : center;
    height : 150px;
    color : white;
}

/* position du titre du Formulaire */
.policeDetail .titreDetail .titreMainDetail
{
    position : relative;
}

/* Ligne sous le titre du formulaire */
.policeDetail .titreDetail .titreMainDetail .ligneMainDetail
{
    width : 50px;
    text-align : center;
    position : absolute;
    border-bottom : 3px solid white;
    right : 50%;
    margin : 15px -25px 5px 0px;
}

/* Style du sous titre en dessous de la ligne du titre principal */
.policeDetail .titreDetail .titreMainDetail .sousTitreMainDetail
{
    font-size : 17px;
    font-weight : lighter;
    text-align : center;
    margin-top : 25px;
}

/* Définit les marges du chemin de la page */
.policeDetail .marginPath, .policeDetail .marginPathBouton
{
    margin-top : 350px;
    margin-bottom : 20px;
}

@media (max-width:991px)
{
    .policeDetail .marginPathBouton
    {
        margin-top : 10px;
        margin-bottom : -20px;
    }
}

/* Met la couleur de la police du lien du chemin en noir */
.lienAccueil
{
    color : black;
}

/* Définit le style du nom de Page où on est */
.page
{
    color : #36636e;
    font-weight : bold;
    position : relative;
    border-bottom : 2px solid #386873;
}

/* Ajoute une ligne en dessous de la div */
.rowVphDetail
{
    border-bottom : 1px solid lightgrey;
    padding-bottom : 20px;
    margin-bottom : -10px;
}

.rowVphDetail .detailBlockImage
{
    margin-top : 50px;
    margin-bottom : 20px;
}

/* Centre l'image si elle ne prend pas toute la place de la div */
.rowVphDetail .detailImagePrincipale
{
    text-align : center;
    min-height : 100%;
    min-width : 100%;
}

.carousel-indicators li 
{
    border: 1px solid #999;
    background-color: rgba(70,70,70,.25);
}

/* Gère la taille max de l'image principale */
.rowVphDetail .detailImagePrincipale .detailStyleImgPrincipale
{
    max-height : 400px;
    max-width : 400px;
}

/* Marge entre l'image principale et les images secondaires */
.rowVphDetail .detailImagesSecondaire
{
    margin-top : 20px;
}

/* Gère la taille du caroussel */
.rowVphDetail .detailImagesSecondaire .detailStyleImageSecondaire
{
    max-height : 100px;
    width : 100%;
}

.rowVphDetail .detailImagesSecondaire .detailStyleImageSecondaire .detailIndicateursImgSecondaire
{
    margin-bottom : -50px;
}

/* Gère la taille des images du carrousel */
.rowVphDetail .detailImagesSecondaire .detailStyleImageSecondaire .detailStyleImgSecondaire
{
    max-height : 100px;
    padding-left : 50%;
    margin-left : -50px;
}

/* Permet de ne pas afficher d'erreur */
.glyphicon-chevron-left:before
{
    content : "";
}

/* Permet de ne pas afficher d'erreur */
.glyphicon-chevron-right:before
{
    content : "";
}

/* Titre du vph en Gras */
.rowVphDetail .detailTitreVph
{
    font-weight : bold;
}

/* Style du sous titre Fiche */
.rowVphDetail .detailFiche
{
    font-size : 18px;
}

/* Style du sous titre Maj */
.rowVphDetail .detailMaj
{
    font-size : 18px;
    color : #386873;
}

/* Marge entre les boutons Ajouter/moi ma sélection et Print et le titre et sous titre */
.rowVphDetail .detailBoutonFicheProduit
{
    margin-top : 15px;
    margin-left : -15px;
}

/* Style du bouton Ajouter à ma sélection */
.rowVphDetail .detailBoutonFicheProduit .detailBoutonSelect
{
    border-radius : 4px;
}

/* Style du bouton Voir ma sélection */
.rowVphDetail .detailBoutonFicheProduit .detailBoutonViewSelect
{
    border-radius : 4px;
    background-color : #386871;
    border-color : #386871;
}

.rowVphDetail .detailFicheProduit
{
    margin-top : 20px;
    padding-left : 0px;
    padding-right : 0px;
}

.rowVphDetail .detailOngletProduit
{
    background-color : lightgrey;
}

#ongletsFicheDetails li
{
    background-color : #aaaaaa;
    border-left : 2px solid lightgrey;
    border-radius : 0px 0px 0px 0px;
}

#ongletsFicheDetails li a
{
    color : black;
    font-weight : bold;
    border-radius : 0px;
    margin-right : -2px;
}

/* Couleur de fond des div de contenu */
#contentFicheDetails div
{
    background-color : lightgrey;
    /*padding-top : 5px;*/
}

#contentFicheDetails #tab4 li
{
    margin-left : -9px;
    margin-right : -9px;
    padding-bottom : 15px;
}

/* Style des onglets au hover */
#ongletsFicheDetails .active a, #ongletsFicheDetails li a:hover
{
    background-color : #386871;
    color : white;
    font-weight : bold;
    border : 1px solid #386871;
}

/* Pas de bordure sur la class nav-tabs */
.nav-tabs
{
    border : none;
}

/* Style des div qui contiennent le texte des onglets */
.detailContentProduit div
{
    padding-top : 10px;
}

.overflowResponsive
{
    max-height : 450px;
    overflow-x: auto;
}

/* Style des onglets actif */
.detailOngletActif
{
    background-color : #386871;
    color : white;
    font-weight : bold;
}

/* Met en gras le titre des onglets */
.detailFicheProduit .detailContentProduit .list-group-item h4
{
    font-weight : bold;
}

/* Marge entre les Fabricants + Distributeurs et le dessus */
.detailDivFabDistri
{
    margin-top : 50px;
    border : none;
}

/* Style Accessoire */
.accessoire
{
    font-weight : bold;
    display : inline-block;
}

/* Style de la valeur de l'accessoire */
.dispoAccessoire
{
    display : inline-block;
}

/* Adapte la taille de la police des label */
.label
{
    font-size: 100%;
}

/* Adapte le défaut du panel info */
#tab5 .panel-info, #tab5 .panel-warning, #tab5 .panel-danger
{
    padding-top : 0px;
}

/* Adapte la couleur de fond du panel heading du info */
#tab5 .panel-info .panel-heading
{
    background-color : #d9edf7;
}

/* Adapte la couleur de fond du panel heading du warning */
#tab5 .panel-warning .panel-heading
{
    background-color : #fcf8e3;
}

/* Adapte la couleur de fond du panel heading du danger */
#tab5 .panel-danger .panel-heading
{
    background-color : #f2dede;
}

/* Adapte la couleur de fond du panel heading */
#tab5 .panel-body
{
    background-color : #ffffff;
}

/* Met en position relative le titre du titre des détails */
.detailFicheProduit .detailContentProduit .detailTitreDetail
{
    position : relative;
    margin-bottom : 13px;
}
.tabDetail p.valueDetail {
  margin: 0 0 2px !important;
}

/* Style de la ligne en dessous du titre des détails */
.detailFicheProduit .detailContentProduit .detailLigneTitreDetail
{
    width : 50px;
    position : absolute;
    border-bottom : 2px solid #386871;
    margin-top : 4px;
    padding-top : 0px;
}

/* Permet de mettre une séparation entre les panels et la fin de la div */
.tabDetail
{
    padding-bottom : 10px;
}

/* Met la position en relative du titre Fabricant */
.detailTitreFabricant
{
    position : relative;
    font-weight : bold;
}

/* Style de la ligne en dessous du titre Fabricant */ 
.detailLigneTitreFabricant
{
    width : 50px;
    position : absolute;
    border-bottom : 2px solid #386871;
    margin-top : 4px;
    padding-top : 0px;
}

/* Met une ligne entre la div Fabricant et Ditributeur */
.detailBlocFabricant
{
    border-right : 1px solid lightgrey;
}

/* Met la position en relative du titre Distributeur */
.detailTitreDistributeur
{
    position : relative;
    font-weight : bold;
}

/* Style de la ligne en dessous du titre Distributeur */ 
.detailLigneTitreDistributeur
{
    width : 50px;
    position : absolute;
    border-bottom : 2px solid #386871;
    margin-top : 4px;
    padding-top : 0px;
}

/* Style de la div des infos des distributeurs */
.detailBoutonImpression
{
    cursor : pointer;
}

/* Rend les labels responsives */
.list-group-item p .pull-right
{
    width : 100%;
}

@media (max-width:767px)
{
    .list-group-item p .pull-right
    {
        font-size : 11px;
    }
}

.detailBoutonImpression
{
    width : 1.8em;
    height : 100%;
    margin-left : 5px;
}