/*
    .left-section {
    width: 170px;
    height: 99vh;
    background-color: white;
    border: 1 px solid black;
    border: 1px solid black;
    border-right: 0px;
    }
    

.draggable-element{

    width: 150px;
    height: 50px;
    background-color: orange;
    text-align: center;
    padding-top: 15px;
    margin: auto;
    border: 1px solid black;
    margin-top: 10px;
    margin-bottom:5px;
    margin-left: 5px;
    padding-left: 3px;
    padding-right: 3px;
    font-size: 12px;
    font-weight: 600;
    
    }
    */
    
       /*
    .droppable-container .draggable-element{
        width: 25%;
        height: 50px;
        font-size: 16px;
    }
    

    
     .draggable-element:hover {
    //  background-color: yellow;
    cursor: move;

}
    */

/*
.select-container {
    width: 100%;
    box-sizing: border-box;
    padding-bottom: 10px;
    font-size: 19px;
    text-align: center;
    height: 62px;
 
}
 
    
    .category-select{
    height: 50px;
    font-size: 16px;
    text-align: center;
    padding: 6px;
    }
   */
/*
    .right-section {
      flex: 1;
      display: flex;
      flex-wrap: wrap;
    }
    */

/*
    .box {
    flex: 1 0 50%;
     
    background-color: #eee;
    border: 1px solid black;
    box-sizing: border-box;
    height: calc(60vh / 2);
    overflow-y: auto;
    display: flex;
    flex-flow: column;

    }
*/
    .box:nth-child(1),
    .box:nth-child(2) {
      order: 1;
    }

    .box:nth-child(3),
    .box:nth-child(4) {
      order: 2;
    }

/*
.top-box{
 /&   max-height: 70vh	;
    overflow: auto;
        min-height: 66%	;

}
*/
    /* update the intersecting div */
    .intersecting-div {
position: absolute;
    top: calc(50% - 25px);
    left: calc(50% + 0px);
    width: 170px;
    height: 50px;
    background-color: lightgray;
    z-index: 1000;
    border: 2px solid black;
    }
    
        .column-container {
 
    box-sizing: border-box;
    min-width: 172px;
 
    margin: 3px;
    }
    
   /* 
    .column-header {
    color: white;
    font-weight: bold;
     text-align: center;

    font-size: 20px;
    background-color: beige;
    border: 1px solid black;

    text-align: center;
    align-items: center;
    padding: 10px;

    flex: 0 1 auto;
    }
    
    
        .column-footer {
   
flex: 0 1 26px;
    text-align: center;

    padding-top: 5px;
    }
    
*/
    
        /*
        .droppable-container {
  
    min-height: calc(100vp*.25);
    
    border: 1px solid black;

    overflow-y: auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    -webit-overflow-scrolling: touch;

    background-color: beige;
    border-top: 1px black dashed;

    max-height: 34hv;

    max-height: 80vp;

    min-height: 120px;
    flex: 1 1 auto;
    }
    */


.sourceContainterForNeeds{
      max-height:  calc(100vh - 72px);
    }
    
.impNeedsNotMet{
        background-color: #d10404;
    }
    
.impNeedsMet{
        background-color: #1fc253;
    }
    
.lessImpNeedsNotMet{
        background-color: lightsalmon;
    }
    
.lessImpNeedsMet{
        background-color: lightgreen;
    }
    
.importantIdentify{
background-color: #B6E2D3;
}    
    
.maybeImportantIdentify{
    background-color: #ffcbc42b;
}    
    
.highPriority {
background-color: ;lightgreen;

}    

.mediumPriority{
      background-color: #ffcbc42b;
}

.lowPriority{
      background-color: #e89287;
      
}

.notNeeded {
      background-color: lightgrey;
      color: white;
      font-weight: bold;
}    
    
.auto{
   background-color:#EF7C8E;
    color: white;
   font-weight: bold;
          
}       

.connect{
   background-color: #FAE8E0;
} 

.honest {
   background-color: #B6E2D3;
} 

.peac{
   background-color: #D8A7B1;

}    
    

.phys {
   background-color: #9DA993;
   color: white;
   font-weight: bold;    
}     

 
.play{
   background-color: #E3E8E9;
    
}     

 
 
.purp{
   background-color: #BCA88E;
   color: white;
   font-weight: bold;
}     



.needDef{
     text-align: left;
    margin-top: 30px;
    margin-left: auto;
    margin-right: auto;
    border: 1px solid black;

    border-radius: 10px;
 /* background-color: white;  */
  /*   color: black;   */
    font-weight: 600;
    max-width: 572px;
    padding-right: 22px;
    padding-top: 10px;
    padding-left: 22px;
    padding-bottom: 10px;
    overflow-y: auto;
    min-height: 125px;
 }   
 
 
 .tableOfImportanceID{
    margin-top:25px;
 }