.aree_modale_general {
    position: absolute;
    align-items: center;
    cursor: pointer;
}

.macchinari_modale_general {
    z-index: 4;
    opacity: 0.8;
    align-items: center;
}

.modal_area_general {
    z-index: 4;
    opacity: 0.8;
    align-items: center;
}

.rotate {
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
}


/*  PC MODAL AREAS BACKGROUNDS */
.color_back{ /* TBD: change in area */
    background-color: #fefe067a;
}

.color_back:hover
{
    background-color: #ffad007a;
}

.changecolor {
    /* TBD: change in areaSelected */
    background-color: orange;
}

.areaDisabled{
    background-color: #CCCCCC8C;
    pointer-events: none;
}

/*  PC MODAL AREAS BORDERS */
.areaCerPresent{
    border: 4px solid orange;
}

/*  MOBILE MODAL AREAS BACKGROUNDS */
.mobileAreaBgNormal {
    color: #198754 !important; /* keep this as important to override .btn:hover font-color */
    border-color: #198754;
}

/*  AREA SIZES AND POSITIONS */
#S2 {
	width: 60.4%;
	top: 80.7%;
	height: 15.4%;
	right: 16.2%;
}

#S0 {
	width: 38.8%;
	height: 7%;
	right: 16%;
	top: 14%;
}

#S1 {
    width: 64.2%;
    height: 14.8%;
    right: 16.8%;
    top: 58.9%;
}

#S3 {
	width: 5.2%;
	top: 29.5%;
	height: 50%;
	right: 9.2%;
	writing-mode: vertical-lr;
}

#S4 {
    width: 49.2%;
    height: 7.3%;
    right: 37.7%;
    top: 3%;
}

#S5 {
    width: 4%;
    top: 4.2%;
    height: 67%;
    right: 87.1%;
    writing-mode: vertical-lr;
}

#A1\&2 {
	width: 9.6%;
	height: 21%;
	right: 45%;
	top: 22.5%;
}

#A3 {
	width: 5.8%;
	height: 14.2%;
	right: 58.4%;
	top: 43%;
}

#A4 {
	width: 3.3%;
	height: 16.8%;
	right: 61.5%;
	top: 22.7%;
}

#A1 {
	width: 9.6%;
	height: 7.3%;
	right: 17%;
	top: 50%;
}

.modal-custom-size {
    max-width: 1621px;
}

.modal-custom-width {
    max-width: 2064px;
}

.modal-xl {
    max-width: 1621px;
} 

.modal-widht {
    max-width: 2064px;
}

#stage_aree_impianto {
    position: relative;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

#giacenze_aree_impianto {
	position: relative;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
    /*bottom: 100px;*/
}

.stage_aree_impianto {
    position: relative;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.stage-img {
    vertical-align: middle;
    width: 100%;
    height: auto;
}

.stage-plant-img {
    /*vertical-align: middle;
    width: 90%;
    height: auto;*/
    width: 83%;
    height: auto;
    position: relative;
}

.tileA1 {
    width: 7%;
    height: 17%;
    box-shadow: inset 0 0 25px rgb(0 0 0 / 30%);
}

.tilea12 {
    width: 6.2%;
    height: 7%;
    box-shadow: inset 0 0 25px rgb(0 0 0 / 30%);
}

.tileA3 {
    width: 7.5%;
    height: 11%;
    box-shadow: inset 0 0 25px rgb(0 0 0 / 30%);
}

.tilea4 {
    width: 8.2%;
    height: 9.5%;
    box-shadow: inset 0 0 25px rgb(0 0 0 / 30%);
}

.titles01 {
    width: 5%;
    height: 9%;
    box-shadow: inset 0 0 25px rgb(0 0 0 / 30%);
}

.titles0 {
    width: 8%;
    height: 15%;
    box-shadow: inset 0 0 25px rgb(0 0 0 / 30%);
}

.tileS3 {
    width: 6.5%;
    height: 3.2%;
    box-shadow: inset 0 0 25px rgb(0 0 0 / 30%);
}

.tileS5 {
    width: 3.7%;
    height: 2%;
    box-shadow: inset 0 0 25px rgb(0 0 0 / 30%);
}

.tilesS4 {
    width: 4%;
    height: 9.5%;
    box-shadow: inset 0 0 10px rgb(0 0 0 / 30%);
}

.titles1 {
    width: 3%;
    height: 31%;
    box-shadow: inset 0 0 25px rgb(0 0 0 / 30%);
}

#s0_part1 {
    right: 2.2%;
    width: 40.5%;
}

#s0_part2 {
    right: 54.9%;
    width: 14.5%;
}

#s0_part3 {
    right: 78.7%;
    width: 18.2%;
}

.s0_parte_general {
    background: #2ad9d380;
    position: absolute;
    cursor: pointer;
    height: 68%;
    bottom: 21%;
}

.s1_class_general {
    background: #2ad9d380;
    position: absolute;
    cursor: pointer;
    height: 63.5%;
    bottom: 16%;
}

.s2_class_general {
    background: #2ad9d380;
    position: absolute;
    cursor: pointer;
    height: 50%;
    bottom: 19%;
}

.s4_class_general {
    background: #2ad9d380;
    position: absolute;
    cursor: pointer;
    height: 46%;
    bottom: 28%;
}

#s1-1 {
    right: 2.4%;
    width: 14.5%;
}

#s1-2 {
    right: 21.7%;
    width: 16%;
}

#s1-3 {
    right: 42.3%;
    width: 16%;
}

#s1-4 {
    right: 62.9%;
    width: 16%;
}

#s1-5 {
    right: 83.5%;
    width: 13%;
}

#s2-1 {
    right: 3.9%;
    bottom: 19%;
    width: 8.6%;
    height: 49.4%;
}

#s2-2 {
    right: 15%;
    width: 6.6%;
}

#s2-3 {
    right: 24%;
    width: 6.8%;
}

#s2-4 {
    right: 33%;
    width: 7%;
}

#s2-5 {
    right: 42.3%;
    width: 23%;
}

#s2-6 {
    right: 67.5%;
    width: 7%;
}

#s2-7 {
    right: 76.7%;
    width: 6.9%;
}

#s2-8 {
    right: 85.8%;
    width: 6.9%;
}

#s4-1 {
    right: 3.4%;
    width: 46.5%;
}

#s4-2 {
    right: 50.5%;
    width: 46.4%;
}

.class_of_div {
    width: 8%;
    height: 11%;
    box-shadow: inset 0 0 25px rgb(0 0 0 / 30%);
}

.ckboxContainer {
    width: 100%;
    height: 100%;
    border: 1px solid black;
}

.container_all_check_pos {
    align-content: center;
    justify-content: center;
    display: flex;
    align-items: center;
    text-align: center;

}

.drpdownArrow {
    top: 51%;
    position: absolute;
    left: 70%;
    display: flex;
    -webkit-transform: rotate(90deg);
    font-size: 36px;
    transform: rotate(90deg);
}

.styleCheck {
    transform: scale(2);
    justify-content: center;
    align-items: center;
    text-align: center;
}

.check_drop {
    display: none;
    position: absolute;
    background: white;
}

.dropdown-menu input[type="checkbox"]:disabled ~ label {
    opacity: .5;
}

.show {
    display: block;
}

#MagazzinoS0,
#MagazzinoS2 {
    display: none;
}

.color_quadrato {
    background-color: yellow;
    position: absolute;
    z-index: 110;
    border: 1px solid black;
}

#sottozone_buttons {
    margin-top: 10px;
}

.list-group-item-ubi .dropdown-item .form-check-input,
.list-group-item-ubi .dropdown-item .form-label {
    cursor: pointer;
}

.dropdown-menu {
    position: absolute;
    z-index: 1000;
    display: none;
    font-size: 1rem;
    color: #212529;
    list-style: none;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0,0,0,.5);
    border-radius: .25rem;
    min-width: auto;
    width: 120px;
    left: -1px;
    padding: 0;
}

.dropdown-item {
    display: grid;
    grid-auto-flow: column;
    grid-column-gap: 6px;
  }

.back {
    background-color: rgba(242, 255, 0, 0.51);
    position: absolute;
    z-index: 100;
}

.hilight_column_mobile {
    outline-color: yellow;
    outline-style: solid;
    outline-width: 4px;
    position: absolute;
    z-index: 105;
}

#mySelectOptions {
    display: none;
    border: 0.5px #7c7c7c solid;
    background-color: #ffffff;
    /*max-height: 150px; */
    overflow-y: scroll;
    position: absolute;
    width: 60%;
    z-index: 2;
}

#mySelectOptions label {
    display: block;
    font-weight: normal;
    white-space: nowrap;
    min-height: 1.2em;
    background-color: #ffffff00;
    padding: 0 2.25rem 0 0.75rem;
}

#mySelectOptions label:hover {
    background-color: #1e90ff;
}

.hidden_buttons {
    display: none !important;
}

.opacity_button {
    opacity: 0.7;
    min-height: 1%;
    height: 30%;
}

/*  SIZES MACCHINARI PC */
#M1 {
    right: 45.1%;
    top: 47.2%;
    width: 9.4%;
    height: 9%;
}

#M2 {
    right: 36%;
    top: 15.8%;
    width: 12%;
    height: 6%;
}

#M3{
    right: 27.4%;
    top: 44.7%;
    width: 14%;
    height: 11%;
}

#M4 {
    right: 54.6%;
    top: 22.7%;
    width: 6.9%;
    height: 16.7%;
}

#M5 {
    right: 58.2%;
    top: 14%;
    width: 10.6%;
    height: 8.3%;
}

#M6 {
    right: 17.2%;
    top: 25%;
    width: 9.3%;
    height: 24%;
}

#M7 {
    right: 37.5%;
    top: 23%;
    width: 3.5%;
    height: 14%;
}

#M8 {
    right: 64.2%;
    top: 43.1%;
    width: 4.2%;
    height: 14%;
}

#M9 {
    right: 64.9%;
    top: 22.7%;
    width: 3.6%;
    height: 16.7%;
}

@media only screen and (max-width: 989px) {
    #A1 {
        right: 10.2%;
        top: 50%;
        width: 11.7%;
        height: 7.3%;
    }
    #A1\&2 {
        right: 44.1%;
        top: 22.8%;
        width: 11.7%;
        height: 20.9%;
    }
    
    #A3 {
        right: 60.2%;
        top: 43.2%;
        width: 7.2%;
        height: 13.8%;
    }
    
    #A4 {
        right: 63.8%;
        top: 22.8%;
        width: 4.1%;
        height: 16.4%;
    }
    
    #S0 {
        right: 9%;
        top: 14%;
        width: 47.1%;
        height: 6.8%;
    }

    #S1 {
        right: 10%;
        top: 59%;
        width: 77.6%;
        height: 14.7%;
    }

    #S2
    {
        right: 9.4%;
        top: 80.8%;
        width: 72.7%;
        height: 15.5%;
    }
    
    #S3 {
        right: 0.8%;
        top: 29.8%;
        width: 6.6%;
        height: 49.9%;
        writing-mode: horizontal-tb;
    }

    #S4
    {
        width: 49.2%;
        height: 7.3%;
        right: 37.7%;
        top: 3%;
    }
    
    #S5 {
        width: 4%;
        top: 4.2%;
        height: 67%;
        right: 87.1%;
        writing-mode: horizontal-tb;
    }

    #s0_part1 {
        right: 2.2%;
        width: 40.5%;
    }
    
    #s0_part2 {
        right: 54.9%;
        width: 13.5%;
    }
    
    #s0_part3 {
        right: 78.7%;
        width: 19.5%;
    }
    #s1-1 {
        right: 2.3%;
        width: 14.8%;
    }
    
    #s1-2 {
        right: 21.9%;
        width: 15.7%;
    }
    
    #s1-3 {
        right: 42.4%;
        width: 15.8%;
    }
    
    #s1-4 {
        right: 63%;
        width: 15.9%;
    }
    
    #s1-5 {
        right: 83.7%;
        width: 12.9%;
    }
    
    #s2-1 {
        right: 5.9%;
        bottom: 23%;
        width: 4.5%;
        height: 52%;
    }
    
    #s2-2 {
        right: 13%;
        width: 7%;
    }
    
    #s2-3 {
        right: 22.5%;
        width: 7%;
    }
    
    #s2-4 {
        right: 32%;
        width: 7%;
    }
    
    #s2-5 {
        right: 41.5%;
        width: 22.5%;
    }
    
    #s2-6 {
        right: 66.5%;
        width: 7%;
    }
    
    #s2-7 {
        right: 76%;
        width: 7%;
    }
    
    #s2-8 {
        right: 85.6%;
        width: 7%;
    }

    #M1 {
        right: 44%;
        top: 47%;
        width: 11.6%;
        height: 9%;
    }
    
    #M2 {
        right: 33.7%;
        top: 15.5%;
        width: 13%;
        height: 7%;
    }
    
    #M3 {
        right: 22.5%;
        top: 44.5%;
        width: 17%;
        height: 12%;
    }
    
    #M4 {
        right: 55.8%;
        top: 22.7%;
        width: 8%;
        height: 17%;
    }
    
    #M5 {
        right: 59.9%;
        top: 14%;
        width: 13%;
        height: 8%;
    }
    
    #M6 {
        right: 12%;
        top: 25%;
        width: 10%;
        height: 23%;
    }
    
    #M7 {
        right: 35.3%;
        top: 23.5%;
        width: 4.1%;
        height: 13.6%;
    }
    
    #M8 {
        right: 67%;
        top: 43%;
        width: 5.3%;
        height: 14%;
    }

    #M9 {
        right: 68%;
        top: 22.8%;
        width: 5%;
        height: 17%;
    }
}

@media only screen and (max-width: 719px) {
    .input-group {
        flex-direction: column;
    }
    .input-group>.form-control, .input-group>.form-select {
        width: 100%;
    }
    .input-group:not(.has-validation)>.dropdown-toggle:nth-last-child(n+3), .input-group:not(.has-validation)>:not(:last-child):not(.dropdown-toggle):not(.dropdown-menu) {
        border-top-right-radius: 5px;
        border-bottom-right-radius: 0;
        border-top-left-radius: 5px;
        border-bottom-left-radius: 0;
    }
    .input-group>:not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback) {
        margin-left: 0;
        border-top-right-radius: 0;
        border-bottom-right-radius: 5px;
        border-top-left-radius: 0;
        border-bottom-left-radius: 5px;
    }
}