body{
    font-family: sans-serif;
    font-size: medium;
    margin: 0;
    }

#items{
    list-style: none;

}
#optionItems {
        list-style: none;
    }

ul {

    display: inline;

}

li {
    padding:0px;
    margin:5px;
    border: 1px solid black;
    width: auto;  
    display: inline-block;  
    vertical-align: middle;
}



.action {
    background-color: pink;
}
.verb { 
    background-color:lightblue;
}

input[type=text]{
    padding-right: 2px;
    padding-left: 2px;
    width:20px;

        }

#textMeasureDiv{
    visibility: hidden;
    display: inline-block;
    width: auto;
    border: 1px solid black;
    
}

#titlediv {

width: 100vw;
height: auto;
background-color: lightblue;
text-align: center;
border: 1px solid black;
padding: 5px;
margin: 0px 0px 5px 0px;

}

#flowcharttitlediv{

text-align: center;
border: 1px solid black;
margin:5px;
padding: 5px;;

}

#flowchartdiv{
    padding: 0 15px 0 15px ;
}

#layoutNameInput {
    outline: none;
    width:auto;
    text-align: center;
    min-width: 100px ;
}

.blockDiv{
    /* border: 1px solid black; */
    position: relative;
    float: left;
    text-align: center;
    padding:4px;
    margin:0px;
    user-select: none;
    width:auto;
    white-space: nowrap;
}


.topRightCloseButtonDiv{
    float:left;    
    vertical-align: middle;
    width:15px;
    height:15px;
    text-align: center;
    padding-bottom: 3px;
    background-color: lightGrey;
    user-select: none;
               
}

.topRightCloseButtonDiv:hover {
    background-color: red;
}

.blockParameterName{
    display: inline;
    margin:10px;
}

#inkscapeCommandLine{
    text-align: center;
    padding:10px;
    margin : 10px;  
    border:1px solid black;
    word-wrap: break-word;
}

#buttonDiv {
    text-align: center;
}

#rightPane {
    width: 71vw;
    float:right;
    border:1px solid black;
    margin: 5px 10px 0px 0px;
    height: 85vh;
}

#leftPane {
    width: 25vw;
    float:left;
    border:1px solid black;
    margin: 5px 0px 0px 10px;
    height: 85vh;
    overflow-y: hidden;
    
}

#chooseListDiv {
    width: 90%;
    border:1px solid black;
    margin: 10px auto 5px auto;
    padding:10px;
}

#chooseListTableDiv {
    width: 90%;
    border:1px solid black;
    margin: 10px auto 5px auto;
    padding:10px;
}

#searchTableDiv {
    margin: 15px auto 10px auto;    
    border:1px solid black;
    padding: 10px;
        
}

#searchInput {
    border:1px solid black;
    outline: none;
    width: 90%;
}

#searchSpan {
    margin-right: 5px;
}

#listTableDiv {
    margin: 15px 0 0 0;
    height: 70vh;
    overflow-y: scroll;
    user-select: none;
}

.listTableCell {
    border-bottom: 1px dotted grey;
}

.hiddenCheckboxButtonToggler{
    display: none;
  }
  
  .checkBoxLabel{
    user-select: none;
    padding:3px;
    border: 1px solid black;
    /* border-radius: 2px; */
  }
  
  .hiddenCheckboxButtonToggler:checked + .checkBoxLabel{
  background-color:lightgreen;
  }

  .flexDistribute {
    display: flex;
    justify-content: space-between;
}

.displayNone {
    display:none;
}

/* Dropdown css
*****************
*****************
*/
#dropdowntitlediv {
    border: 1px solid black;
    background-color:lightsteelblue;
    display:table-cell;
    vertical-align: middle;
	width:100vw;
	height:26px;
    margin: 5px 0 0 0;
    padding:0px;
}

.dropbtn {
    background-color: lightsteelblue;
    color: black;
    padding: 2px;
    font-size: 16px;
    height: ;
    border: none;
    cursor: pointer;
        }
.dropdown {
    position: relative;
    display: block;
    float: left;
    margin-right:15px;
    white-space: nowrap;
     
}

.dropdownTitle {
    position: relative;
    float: left;
    margin-right:3px;
    font-weight:bold;
    border: 1px solid black;
}

.dropdown-content {
    display: none;
    position: absolute;
    background-color: white;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
    font-size: 14px;
    border-style:solid;
    border-width:1px 1px 1px 1px;
    border-radius: 1px ;
    user-select: none;
    overflow-y: scroll;
    height: 80vh;
}

.dropdown-content a {
    color: black;
    padding: 12px 10px;
    text-decoration: none;
    display: block;
 }

.dropdown-content a:hover {
	
	background-color: #f1f1f1;
	border-radius: 1px;	
	
}

.dropdown:hover .dropdown-content {
    display: block;
}

.dropdown:hover .dropbtn {
    background-color: lightblue;
}

.dropdownSpan {

margin-left: 15px;
font-style: italic;

}
/*
**********************
**********************
End of Dropdown css */

#dropDownMenuPane{
    overflow-y: scroll;
    height: 80vh;
}

.aquaButton {
    background-color:aqua;
    border-radius: 2px;
    border: 1px solid black;
    padding: 1px;
    font-weight: bold;
    font-size:medium;
    outline: none;
    user-select: none;
    }
.lightBlueButton {
    background-color:lightBlue;
    border-radius: 2px;
    border: 1px solid black;
    padding: 1px;
    font-weight: bold;
    font-size:medium;
    outline: none;
    user-select: none;
    }
    
    input[type="file"] {
    display:none;
    }