:root 
{
	--theme: #1c4e2d;
    --bg:#1a1c22;
    --panel: #0a0a0a;
	--bn: #242424;
	--font_white: #cfcfcf;
}

body {
    background-color: var(--bg);
    color: var(--font_white);
}

.page{
    width: 550px;
    margin: auto;
}
.tabs{
    background-color: var(--panel);
    color: var(--font_white);
    width: 100%;
   
}
.tabs button{
    background-color: var(--panel);
    color: white;
    border-color: white;
    outline-style: none;
    border-style: none;
    border-width: 1px;  
    cursor: pointer;
    font-size:1.2em;
}
.tabs button:hover{
    background-color: var(--bn);
}
.console span{
		padding:2px;
		color: green;
		font-size:8px;
}

.selected {
    border-style: solid !important;
    border-bottom-style: none !important;
    background-color: var(--bn) !important;
}

.pages{
    background-color: var(--bn)
}

.instruction{
    color: cyan;
    font-size: 1.2em;
    margin: auto;
    text-align: center;
    margin-bottom: 2%;
}

input.column.date {
    width: 100px;
}

.block {
    margin: 2%;;

}
.block div input{
    outline: none;
    border-width: 1px;
    border-color: white;
    border-style: solid;
    width: 80px;
}

.label{
    background-color: var(--bn);
    color: #54df31;
    border-color: #226a0f !important;
    pointer-events: none; 
    font-size: 1em;
    
} 

.label2{
    background-color: var(--bn);
    color: #54df31;
    border-color: var(--bn) !important;
    pointer-events: none; 
    font-size: 1em;
    
} 

.img {
    width:80%; 
    background-color:#304a4a;
}

.column {
    float: left;
    width: 50%;
    margin-bottom: 1%;
    
  }
  
  .row:after {
    content: "";
    display: table;
    clear: both;
  }

  .column2 {
    float: left;
    width: 25%;
    margin-bottom: 1%;
    
  }

  input .class2{
    margin-right: 1%;
  }
  
  .row:after {
    content: "";
    display: table;
    clear: both;
  }

  .link{
    text-decoration: underline;
    cursor: pointer;

  }

  .select_shim_l{
    background-color: var(--panel);
    width: 99.5%;
    margin: auto;
    line-height: 1.5em;
    border: 1px solid;
    font-size: 0.75em;
    display: grid;
    cursor: pointer;
    overflow-y: auto;
    height: 90px;
}

.select_shim_r{
    background-color: var(--panel);
    width: 99.5%;
    margin: auto;
    line-height: 1.5em;
    border: 1px solid;
    font-size: 0.75em;
    display: grid;
    cursor: pointer;
    overflow-y: auto;
    height: 90px;

}


.select_shim_l span:nth-child(even){
    background: rgb(39, 39, 39);
}

.select_shim_r span:nth-child(even){
    background: rgb(39, 39, 39);
}

.c_title_r{
    margin-top: 3%;
    margin-bottom: 1%;
    text-align: center;
    font-size: 2.3em;
    color: aquamarine;
    position: relative;
}

.c_img_r2{
    width: 25%;
}

.c_img_r3{
    width: 20%;
}

::-webkit-scrollbar-thumb {

}

.shim_canvas
{
    background-color: #254c4c;
    margin: auto;
    text-align: center;

}

.show_l{
    background-color:darkcyan !important;
}
.show_r{
    background-color:darkcyan !important;
}

[data-style=mypops] + .popover {
background: #4194ca;
}
[data-style=mypops] + .popover.bottom .arrow:after {
border-bottom-color: #4194ca;
}
[data-style=mypops] + .popover-content {
}
.parts {
list-style: none;
background-color: var(--panel);
position: absolute;
width: 150px;
left:43%;
z-index: 1;
top: 19%;
border: #242424 1px solid;
}

.parts_lh {
    margin-left: 3%;
}

.copy{
    background-color: transparent;
    border: none;
    cursor: pointer;
}



.center {
    text-align: center;
    width: 100%;
}

.shim_label{
    white-space: pre;
}

.load_list{
    background-color: var(--panel);
    width: 100%;
    margin: auto;
    line-height: 1.5em;
    border: 1px solid;
    font-size: 1em;
    display: grid;
    cursor: pointer;
    text-transform: uppercase;
    height: 30%;
    overflow-y: auto;
    align-content: flex-start;
}
.load_list span:nth-child(even){
    background: rgb(39, 39, 39);
}

.show_list{
    background-color:darkcyan !important;
}


@media print {
    @page { margin: 0; }
    body { margin: 0cm; }
  }


  @media (orientation: portrait) {
    .select_shim_l{
        background-color: var(--panel);
        width: 99.5%;
        margin: auto;
        line-height: 1.5em;
        border: 1px solid;
        font-size: 0.4em;
        display: grid;
        cursor: pointer;
        overflow-y: auto;
        height: 90px;
    }
    
    .select_shim_r{
        background-color: var(--panel);
        width: 99.5%;
        margin: auto;
        line-height: 1.5em;
        border: 1px solid;
        font-size: 0.4em;
        display: grid;
        cursor: pointer;
        overflow-y: auto;
        height: 90px;
    }

    .tabs{
        background-color: var(--panel);
        color: var(--font_white);
        width: 100%;
        height: 4%;
        vertical-align:middle;
    }
    #s_lshim{
        font-size: 15px;
    }
    #s_rshim{
        font-size: 15px;
    }
    #ca{
        display: none; 
    }
    .instruction{
        color: cyan;
        font-size: 18px;
        margin: auto;
        text-align: center;
        margin-bottom: 2%;
    }
    label{
        font-size: 15px;
    }
	
	.shim_label{
    white-space: pre;
	font-size: 15px;
	}

  }

  /* width */
::-webkit-scrollbar {
    width: 6px;
  }
  
  /* Track */
  ::-webkit-scrollbar-track {
    background: #000000; 
  }
   
  /* Handle */
  ::-webkit-scrollbar-thumb {
    background: #58ca8a; 
  }
  
  /* Handle on hover */
  ::-webkit-scrollbar-thumb:hover {
    background: #d3ffe6; 
  }
  