/* visuel input text et textarea */

input:focus
{

    /* border: #ff8a00 1px solid; */
    outline: none;

}



textarea:focus
{
    outline: none;
}


/* ________ Toute la page */


/* Les polices */

html, body {

    margin: 0px;
    padding: 0px;

    width: 100%;
    height: 100%;

    border: none;

}

body{

    /* background-color: aqua; */
    background-color: white;
    /* z-index: 0; */
    
}

/* ________ Le header */

header{

    /* background-color: blueviolet; */

    background-color: white;

    height: 150px;
}

#logoDrapPanier{

    background-color: #ffb12a;
    z-index: -1;

    height: 75%;
    min-height: 100px;
    width: 100%;

}

#headerNav{

    /* background-color: white; */

    height: 25%;
    width: 100%;
    max-width: 1920px;

    display: flex;
    z-index: -1;

    /* border-bottom: 1.5px solid black; */
    /* border-top: 1.5px solid black; */
    

}

/* ------ Logo - Drapeaux - Panier */

#logoDrapPanier {

    margin: 0px;
    padding: 0px;    
    display: flex;

    /* background-color: blueviolet; */

    /* background-color: white; */

    border-bottom: 1.5px solid black;
    
}

/* Logo */

#LogoHeader{

    /* width: 300px; */
    width: 15%;
    min-width: 152px;
    height: 100%;

    /* background-color: white; */
    /* background-color: darkmagenta; */


    margin: 0px;
    padding: 0px;
    text-align: center;

}

#LogoHeader img{
    
    margin-top: 5px;

}

/* Drapeaux */

#DrapHeader{
    /* background-color: white; */
    /* background-color: blue; */

    /* width: 300px; */
    display: flex;
    /* width: 16%; */
    min-width: 230px;
    /* display: inline; */

    text-align: center;
    padding-top: 80px;
}

#DrapHeader form
{

    margin-right: 5px;
    /* background-color: white; */
    height: 26px;
    width: 39px ;

}

.Drapeau{

    text-decoration: none;
    /* margin-left: 10px; */
}

#DrapFR
{

    background-image: url(../IMG_Internet/0_barre_nav/lg01_fr_hover.png);
    

}
#DrapUK
{

    background-image: url(../IMG_Internet/0_barre_nav/lg02_en_hover.png);

}
#DrapDE
{

    background-image: url(../IMG_Internet/0_barre_nav/lg05_de_hover.png);

}
#DrapIT
{

    background-image: url(../IMG_Internet/0_barre_nav/lg03_it_hover.png);

}
#DrapES
{

    background-image: url(../IMG_Internet/0_barre_nav/lg04_es_hover.png);

}



.langue_select
{
    background-repeat: no-repeat;
    cursor: pointer;

    height: 26px;
    width: 39px ;

    /* margin-top: 78px; */
    border: none;
    background-color: transparent;

}

.langue_NON_select{

    opacity: 0.5;
    background-repeat: no-repeat;
    cursor: pointer;

    height: 26px;
    width: 39px ;

    /* margin-top: 78px; */
    border: none;
    background-color: white;

}

.langue_NON_select:hover{

    opacity: 1;
    background-repeat: no-repeat;
    cursor: pointer;

    height: 26px;
    width: 39px ;

    /* margin-top: 78px; */
    border: none;
    background-color: transparent;

}

/* ------ Recherche */

/* .rechercheArt img
{

    margin-top: 78px;
} */

.rechercheArt
{

    /* background-color: cornflowerblue; */

    /* margin: auto; */
    /* padding-top: 50px; */
    margin-top: auto;
    /* margin-bottom: auto; */
    margin-left: 10px;
    margin-right: 20px;
    /* margin-bottom: 5px; */

    width: 15%;
    min-width: 150px;
    max-width: 300px;
    /* height: 50%; */

}

#btnSearch
{

    display: flex;

    /* background-color: darkmagenta; */
    /* border-radius: 15px; */
    /* border: 1px solid black; */

    padding-left: 10px;

    /* width: 50%; */
    margin-bottom: 5px;

}

#btnSearch ion-icon
{

    /* font-size: 1.2vw; */
    font-size: calc(12px + 0.6vw);
    margin-right: 5px;
    cursor: pointer;

}

/* #btnSearch ion-icon:hover
{

    color: #ff8a00;

} */

#MyTxtSearch
{

    background-color: white;
    border: 1px solid black;

    /* font-size: 0.8vw; */
    font-size: calc(12px + 0.2vw);

    width: 90%;
    max-width: 250px;

}

/* #MyTxtSearch:hover
{

    border: 1px solid  #ff8a00;

} */

.rechercheArt a
{

    color: black;
    text-decoration: none;

}

.rechercheArt a:hover
{

    /* color: #ff8a00; */
    text-decoration: underline;

}



/* .btn_search
{

    background-image: url('../IMG_Internet/0_barre_nav/search.png');
    background-repeat: no-repeat;
    cursor: pointer;

    height: 30px;
    width: 30px ;

    margin-top: 78px;
    border: none;
    background-color: transparent;

} */

/* La div masquée */

/* #divacacher_search
{

    background-color:white ;
    position: absolute;
    z-index: 1;

    top: 151px;

    width: 600px;
    height: 60px;

    margin-left: 400px;
    padding: 20px; 

    font-family: 'Calibri';
    font-size: 16px;

    box-shadow: 1px 10px 10px rgba(0, 0, 0, 0.544);

} */


/* .rechercheG
{

    width: 400px;

} */

/* .div_search
{

    display: flex;
    margin-top: 20px;

} */


/* #code_search
{

    display: flex;
    font-family: 'Calibri';
    font-size: 16px;  */

    /* background-color: blueviolet; */

    /* margin: 0px; */

    /* margin-bottom: -10px; */

/* } */




/* #code_search p 
{

    margin: 0px;
    padding: 0px;
    width: 200px;

}

#code_search #txt_search 
{

    width: 110px;

}

#code_search #OK_search 
{

    cursor: pointer;

}

.rechercheD input
{

    color: black;
    background-color: transparent;
    border: none;

    cursor: pointer;

    font-family: 'Calibri';
    font-size: 16px;

}

.rechercheD input:hover
{

    text-decoration: underline;

} */

/* ------ Connection */



#header_co
{

    height: 100%;
    /* width: 120px; */
    /* background-color: aqua; */
    margin-right: 10px;

    display: flex;
    
    

}

#SectDeco
{

    /* background-color: chocolate; */
    /* height:40%; */
    text-align: center;

    align-self: flex-end;


}

#SectDeco p
{

    margin: 0px;
    font-size: 16px;
    font-weight: bold;
    /* font-style: italic; */

}

#SectDeco a 
{

    color: black;
    text-decoration: none;

}

#SectDeco a:hover, #SectDeco input:hover
{

    text-decoration: underline;
    /* color: #ff8a00; */

}



.BtnCoDeco, .BtnCo
{

    /* height: 100%; */
    display: flex;
    width: 100%;

    /* background-color: aquamarine; */


}

.BtnCoDeco input, .BtnCo input
{

    background:none;
    border: none;

    /* font-weight: bold;   */
    font-size: 14px;
    color: black;
    /* height: 100%; */
    /* width: 100%; */

    cursor: pointer;

    margin: auto;
    /* margin-bottom: 10px; */

}

.BtnCo
{

    align-self: flex-end;
    padding-bottom: 10px;

}


.BtnCo input:hover
{
    text-decoration: underline;
    /* color: #ff8a00; */
}





/* La div masquée */

/* Co */

.NomClient
{

    text-align: center;
    font-style: italic;
    color: grey;

}

.conn
{

    display: flex;
    margin-top: 10px;

}

.conn a
{

    text-decoration: none;
    color: black;

}

.conn a:hover, #Deco_btn:hover
{

    text-decoration: underline;

}

.connG, .connD
{

    width: 50%;
    padding-left: 5px;

}

.connD input
{

    border: none;
    background-color: transparent;
    padding: 0px;
    cursor: pointer;

}

/* Deco */

#id_client, #mdp_client
{

    display: flex;

}

.div_nonco p
{

    margin: 0px;
    width: 30%;

}

#forgotMdP
{

    border: none;
    background-color: transparent;
    padding: 0px;
    margin-top: 10px;
    font-family: 'Calibri';
    font-size: 14px;
    cursor: pointer;

}

#forgotMdP:hover
{

    text-decoration: underline;

}


/* Panier */

#PanierHeader{

    /* width: calc(100% - 700px);  */

    /* position: relative; */
    display: flex;

    
    /* background-color: darkgreen; */

    margin-left: 0px;
    padding-left: 0px;

    /* background-color: white; */
}

#RappelPanier{

    /* width: 280px; */
    height: 70px;

    align-self: flex-end;
    display: flex;    
    /* position: absolute; */
    /* bottom: 0px;        */
    /* margin-left: 50px; */
    border-radius: 10px 10px 0 0;
    background-color: rgba(255, 255, 255, 0.696);  
    text-decoration: none;

}

/* #RappelPanier:hover{
    
    background-color: rgba(255, 255, 255, 0.696);    
    transition: background-color 0.1s ease; 

} */

#Panier_Gauche{

    width: 210px;
    
    text-align: left;
    padding-left: 10px;

}

#titrePanier{

    color: black;
    font-size: 18px;
    font-family: Arial;
    font-weight: bold;
    padding-top: 5px;
    padding-bottom: 8px;

}

#DernierArt, #QttDerArt{

    color: black;
    font-size: 14px;
    font-family: Arial;

}

#Panier_Droite{

    width: 30px;

    color: black;
    font-size: 22px;
    font-family: Arial;
    font-weight: bold;
    text-align: center;
    padding-top: 10px;

}



/* ------ Navigation */

#headerNav {

    margin: 0px;
    padding: 0px;
    

}

#headerNav nav {
    
    text-align: center;
    
    padding-top: 0.5%;

}

#headerNav nav a
{
    font-size: 16px;
    font-family: "Calibri";
    font-weight: bold;

    text-decoration: none;

    margin-left: 50px;
    /* margin-left: 5%; */

    transition: color 0.3s ease; 
}

#headerNav nav a:hover
{
    color: rgba(255, 150, 0,1);
}


.nav_header_NON_select{

    color: black;

}

.nav_header_select{

    color: rgba(255, 150, 0,1);

}