.CDMS_dropBox{
    width: 100%;
    height: fit-content;

    display: flex;
    flex-direction: column;

    border-radius: 1ch;
}
.CDMS_dropBox .mainService, .CDMS_dropBox .submainService{
    width: 100%;
    height: fit-content;

    padding: 0 .5rem;

    display: flex;
    align-items: stretch;
    gap: .5rem;

    user-select: none;

    border-top: 1.5px solid rgb(255, 255, 255);
    background-color: rgb(18, 130, 110);

    color: white;

    cursor: pointer;

    transition: all .1s ease;
}
.CDMS_dropBox .submainService{
    border-top: .5px solid rgb(255, 255, 255);
    padding: .5rem;
    padding-left: var(--dropMenuServices_paddingLeftForParents, 0rem);
}
.CDMS_dropBox .mainService.opened, .CDMS_dropBox .submainService.opened{
    background-color: rgb(18, 105, 90);
}
.CDMS_dropBox .mainService .boxIcon, .CDMS_dropBox .submainService .boxIcon{
    width: fit-content;

    padding: .5rem .5rem;

    display: flex;
    justify-content: center;
    align-items: center;
}
.CDMS_dropBox .mainService .boxIcon .icon, .CDMS_dropBox .submainService .boxIcon .icon{
    width: 2.5rem;
    height: 2.5rem;
}
.CDMS_dropBox .mainService .boxName, .CDMS_dropBox .submainService .boxName{
    width: 100%;

    display: flex;
    align-items: center;
}
.CDMS_dropBox .mainService .boxName .name, .CDMS_dropBox .submainService .boxName .name{
    font-size: 1rem;
    font-family: 'Manrope', sans-serif;
    font-weight: 500;
}
.CDMS_dropBox .mainService .boxDropButton, .CDMS_dropBox .submainService .boxDropButton{
    width: fit-content;

    display: flex;
    align-items: center;
}
.CDMS_dropBox .mainService .boxDropButton .dropButton, .CDMS_dropBox .submainService .boxDropButton .dropButton{
    width: 2rem;
    height: 2rem;

    transition: all .5s ease;
}
.CDMS_dropBox .mainService .boxDropButton .dropButton.opened, .CDMS_dropBox .submainService .boxDropButton .dropButton.opened{
    transform: rotate(180deg);
}

@media (hover: hover){
    .CDMS_dropBox .mainService:hover, .CDMS_dropBox .submainService:hover{
        transform: scale(1.003);
        background-color: rgb(18, 105, 90);
    }
    .CDMS_dropBox .mainService:active, .CDMS_dropBox .submainService:active{
        transform: scale(1);
    }
}
@media (hover: none) {
    .CDMS_dropBox .mainService:active, .CDMS_dropBox .submainService:active{
        transform: scale(.99);
        background-color: rgb(18, 105, 90);
    }
}

.CDMS_dropBox .listServices{
    width: 100%;
    height: 0;

    display: flex;
    flex-direction: column;

    overflow: hidden;
}
.CDMS_dropBox .listServices.opened{
    height: auto;
}
.CDMS_dropBox .listServices > *{
    opacity: 0;
    transform: translateY(-40px);
}
.CDMS_dropBox .listServices.opened > *{
    transition: opacity .1s ease, transform .15s ease;
    opacity: 1;
    transform: translateY(0px);
}
.CDMS_dropBox .listServices.opened > :nth-child(1)  { transition-delay: 0.0s; }
.CDMS_dropBox .listServices.opened > :nth-child(2)  { transition-delay: 0.1s; }
.CDMS_dropBox .listServices.opened > :nth-child(3)  { transition-delay: 0.2s; }
.CDMS_dropBox .listServices.opened > :nth-child(4)  { transition-delay: 0.3s; }
.CDMS_dropBox .listServices.opened > :nth-child(5)  { transition-delay: 0.4s; }
.CDMS_dropBox .listServices.opened > :nth-child(6)  { transition-delay: 0.5s; }
.CDMS_dropBox .listServices.opened > :nth-child(7)  { transition-delay: 0.6s; }
.CDMS_dropBox .listServices.opened > :nth-child(8)  { transition-delay: 0.7s; }
.CDMS_dropBox .listServices.opened > :nth-child(9)  { transition-delay: 0.8s; }
.CDMS_dropBox .listServices.opened > :nth-child(10) { transition-delay: 0.9s; }
.CDMS_dropBox .listServices.opened > :nth-child(11) { transition-delay: 1.0s; }
.CDMS_dropBox .listServices.opened > :nth-child(12) { transition-delay: 1.1s; }
.CDMS_dropBox .listServices.opened > :nth-child(13) { transition-delay: 1.2s; }
.CDMS_dropBox .listServices.opened > :nth-child(14) { transition-delay: 1.3s; }
.CDMS_dropBox .listServices.opened > :nth-child(15) { transition-delay: 1.4s; }
.CDMS_dropBox .listServices.opened > :nth-child(16) { transition-delay: 1.5s; }
.CDMS_dropBox .listServices.opened > :nth-child(17) { transition-delay: 1.6s; }
.CDMS_dropBox .listServices.opened > :nth-child(18) { transition-delay: 1.7s; }
.CDMS_dropBox .listServices.opened > :nth-child(19) { transition-delay: 1.8s; }
.CDMS_dropBox .listServices.opened > :nth-child(20) { transition-delay: 1.9s; }
.CDMS_dropBox .listServices.opened > :nth-child(n+21) { transition-delay: 1.9s; }

/*****************CDMS_serviceItem*****************/
.CDMS_serviceItem{
    width: 100%;
    height: fit-content;

    padding: .5rem .5rem;

    border-top: 1px solid rgb(56, 56, 56);

    display: flex;
    align-items: stretch;
    gap: 1rem;

    user-select: none;

    background-color: rgb(255, 255, 255);

    color: rgb(56, 56, 56);

    cursor: pointer;

    transition: all .1s ease;
}
.CDMS_serviceItem:active{
    transform: scale(.995);
    background-color: rgb(240, 240, 240);
}

@media (hover: hover){
    .CDMS_serviceItem:hover{
        background-color: rgb(240, 240, 240);
    }
}

.CDMS_serviceItem .boxTextPrice{
    width: 100%;

    display: flex;
    flex-direction: column;
    gap: .5rem;
}
.CDMS_serviceItem .boxTextPrice .boxName{
    width: 100%;

    display: flex;
    align-items: center;
}
.CDMS_serviceItem .boxTextPrice .boxName .name{
    font-size: 1rem;
    font-family: 'Manrope', sans-serif;
    font-weight: 400;
}
.CDMS_serviceItem .boxTextPrice .boxPrice{
    width: 100%;

    display: flex;
    justify-content: flex-end;
}
.CDMS_serviceItem .boxTextPrice .boxPrice .price{
    font-size: 1rem;
    font-family: 'Roboto Mono', sans-serif;
    font-weight: 300;
}
.CDMS_serviceItem .boxSelectButton{
    width: fit-content;

    margin-left: auto;

    display: flex;
    align-items: center;
}
.CDMS_serviceItem .boxSelectButton .boxIcon{
    width: 2rem;
    height: 2rem;
}
.CDMS_serviceItem .boxSelectButton .boxIcon svg{
    transition: all .2s ease;
}
.CDMS_serviceItem.selected .boxSelectButton .boxIcon svg{
    stroke: red;
    transform: rotate(45deg);
}