/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 13 juil. 2021, 15:05:44
    Author     : webmaster
*/

   /* fenetre ajout produit au panier */
    .maskScreen {
        position:fixed;
        z-index:100;
        visibility:visible; /*visible; /*hidden;*/
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        width :100vw;
        height :100vh;
        background-color: rgba(0,0,0,0.5);
    }
    .confirmWindow {
        display : flex;
        flex-flow:wrap;
        justify-content: space-around;
        /*align-items: center;*/
        width :30vw;
        height :25vw;
        border : 10px solid ;
        border-radius : 16px;
        border-color : #dd0f19;
        background-color: rgba(241,142,0,0.9);
        color:#000000;
    }
    .confirmWindow > .msg {
        display: flex;
        width : 30vw;
        justify-content: center;
        align-items: center;
        /*border: 1px solid white;*/
      
    }
    .confirmWindow > .item-link, .confirmWindow > .basket-link  {
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        align-items: center;
        color:#000000;
        /*border: 1px solid white;*/
    }
    
    .confirmWindow > .item-link > img, .confirmWindow > .basket-link >img {
        display : flex;
        max-width: 6vw;
        /*border:1px solid blue;*/
    }
    .confirmWindow > .item-link > p, .confirmWindow > .basket-link >p {
        /*border:1px solid blue;*/
        color:#000000;
    }
    
    
    /* popup pour la connexion b2b */
    
    .logWindow {
        display : flex;
        flex-flow:column; /*wrap;*/
        justify-content: space-between; /*center;*/
        align-items: center;
        min-width :30vw;
        min-height :22vw;
        border : 10px solid ;
        border-radius : 16px;
        border-color : #dd0f19;
        background-color: rgba(241,142,0,0.9); /* #dd0f19*/
        color:#000000;
        
    }
    .clear-top {
        display : flex;
        min-width: 30vw;
        justify-content: flex-end;
    }
    .clear-top a img {
        display: flex;
        max-width : 1.8em;
    }
    .logWindow > top {
        display : flex;
        min-width: 30vw;
        justify-content: center; 
    }
    .logWindow > top > p {
        display: flex;
        justify-content: center;
        min-width: 24vw;
        border : 1px solid black;
    }
    .logWindow > top > p.title {
        padding : 0.5em;
        background: black;
        color:white;
        border-radius: 6px;
    }
    .logWindow > bottom {
        min-width: 30vw;
        text-align: center;
        padding-top: 2em;
    }
    
    .B2BForm {
        display: flex;
    }

    .B2BForm> form {
    /* occupe la largeur restante */
        display:flex;
        flex-flow:column;
        min-width: 22vw;
        justify-content: center;
        align-items: center;
    }


    .B2BForm .inputLog,.B2BForm .inputPwd {
        display: flex ;
        /*max-width: 16vw;*/
        justify-content: flex-start;
        padding : 0.8em 0em;
    } 

    .inputLog > input, .inputPwd > input{
        display: flex;	
        min-width:18vw;
        padding-left : 1.5em;
        border-radius: 6px;
        height : 1.5em; /*1.7vw;*/
    }

    .imgSub > input {
        display: flex;
        width:4vw;
        /*height :3vw;*/
    }
    
    /*------------------------ media-queries ----------------------*/

    @media screen and (max-width: 960px) {
        
    /**************** popup ajout panier ***************/
    .confirmWindow {
        width :45vw;
        height :30vw;
    }
        
    .confirmWindow > .msg {

        width : 45vw;
    }   
     
    /* ********************* popup login b2b ********************/
        .clear-top {
        min-width: 45vw;
        }
        .logWindow {
            width : 45vw;
            /*height : 30vw;*/
        }
        
        
    
        .B2BForm {
            max-width: 40vw;
        }
    
        .B2BForm > form {
            max-width: 36vw;
        }
    
        .B2BForm > form > p {
            max-width: 30vw;
        }
    
        .inputLog > input, .inputPwd > input{
            width:26vw;
            padding-left : 1.5em;
            border-radius: 6px;
            height : 1.5em; /*1.7vw;*/
        }
        
    }
    
    @media screen and (max-width: 640px) {
        
    .confirmWindow {
        width : 90vw;
        height : 40vw;
    }
        
    .confirmWindow > .msg {

        width : 80vw;
    }   

        
    .logWindow {
        width :88vw;
        min-height :66vw;
    }
    .clear-top {
        min-width: 88vw;
    }
     .logWindow > top > p {
        min-width: 50vw;
     }
    .B2BForm {
        max-width: 80vw;
    }

    .B2BForm > form {
        max-width: 78vw;
    }
    
    
        .B2BForm > form > p {
            max-width: 80vw;
        }
        
        
    
        .inputLog > input, .inputPwd > input{
            min-width:50vw;
            /*padding-left : 1.5em;*/
            border-radius: 6px;
            height : 1.5em; /*1.7vw;*/
        }
    
        .imgSub > input {
            display: flex;
            width:12vw;
            /*height :10vw;*/
        }
    }