/* mod_RoomSelector */

.mod-mm {
    display: none;
    background-color: #DCDCDC;
    position: absolute;
    z-index: 2;
}

.mod-mm.open {
    display: block;
}

/*mrs-head */

.mmm-head {
    position: relative;
    top: 0rem;
    left: 0rem;
}

.mmm-head .txt {
    text-align: left;
    font-size: 1.5rem;
    line-height: 1.8125rem;
    height: 1.8125rem;
    font-family: Verdana;
    letter-spacing: 0rem;
}

.mmm-head .bttClose {
    height: 1rem;
    width: 1rem;
    position: absolute;
}

.mmm-head .bttClose .ico {
    height: 1rem;
    width: 1rem;
    cursor: pointer;
}

/* SELECT */
/* kein gemeinsamen code */

.mmm-main {
    background-color: #fff;
}

.mmm-tab {
    display: none;
    height: 100%;
    overflow: auto;
}

.mmm-tab.act {
    display: block;
}

.mm-tbl {
    display: none;
}

.mm-tbl.act {

    display: flex;
    justify-content: center;
    flex-direction: row;
}

.mm-w-clm {
    display: inline-block;
    width: 190px;
    margin-top: 22px;
}

.clm-line {
    cursor: pointer;
}

.clm-line,
.clm-line-dummy {
    height: 18px;
    margin-bottom: 6px;
    display: flex;
}

.clm-line .checkBox {
    height: 18px;
    width: 18px;
    background-color: #DCDCDC;
    display: inline-block;
}

.clm-line.act .checkBox {
    background-color: var(--az-color);
}

.clm-line .txt {
    display: inline-block;
    height: 18px;
    line-height: 18px;
    vertical-align: top;
    margin-left: 0.5rem;
}

.btt-aplly {
    position: absolute;
    bottom: 37px;
    right: 1rem;
    width: 102px;
    height: 31px;
    cursor: pointer;
    background-color: var(--az-color);
    color: #fff;
    line-height: 31px;
    text-align: center;
    box-shadow: 0px 0px 10px #00000029;
    border-radius: 24px;
}

.mm-win-chip {
    position: relative;
}

.mod-mm-btts {
    display: none;
}

.mod-mm-btts.act {
    position: absolute;
    right: 66px;
    top: 8px;
    display: flex;
}

.bttMM {
    width: 54px;
    height: 54px;
    background: #FFFFFF 0% 0% no-repeat padding-box;
    opacity: 1;
    border-radius: 27px;
    cursor: pointer;
    display: inline-block;
    margin-left: 0.5rem;
}

.btt-mm-win .ico {
    width: 29px;
    height: 24px;
    margin-left: 12.5px;
    margin-top: 15px;
}

.btt-mm-fur .ico {
    width: 29px;
    height: 23px;
    margin-left: 12.5px;
    margin-top: 15.5px;
}

.btt-mm-bak .ico {
    width: 29px;
    height: 22px;
    margin-left: 12.5px;
    margin-top: 16px;
}


@media (min-width: 992px) {
    /* DESKTOP ONLY */

    .mod-mm {
        padding: 1rem 0 0 0;
        top: 4rem;
        width: 65rem;
        height: calc(100% - 5rem);
    }
}

@media (min-width: 768px) {
    /* DESKTOP AND TABLET */

    .mmm-head {
        width: calc(100% - 1rem);
        height: 3.6875rem;
        margin: 0 0 0 1rem;
    }

    .mmm-head .bttClose {
        top: 0.125rem;
        right: 1rem;
    }

    .mmm-main {
        width: 100%;
        height: calc(100% - 4.6875rem);
        position: absolute;
        left: 0rem;
        top: 4.6875rem;
        overflow: auto;
    }

    .mm-r-main {
        height: 100%;
    }

    .mmm-th {
        height: 100%;
    }

    .mm_chip_wrap {
        width: 236px;
    }

    .mm_chip {
        height: auto;
    }

    .clm-h {
        margin-bottom: 1rem;
    }

    .mm-win-chip {
        width: calc((100% - 96px) / 4);
        display: inline-block;
        margin-left: 1rem;
        margin-bottom: 1rem;
        position: relative;
        cursor: pointer;
    }

    .mm-win-chip img {
        width: 100%;
    }

    .mm-r-sel {
        background-color: #DCDCDC;
        height: 100%;
        overflow: auto;
    }

    .mm-content {
        height: 100%;
    }

    .mm-r-tables {
        height: 257px;
        width: 100%;
        background-color: #fff;
        overflow: auto;
    }

    .mm-r-pic {
        display: none;
    }


    .mm_chip.act .mcAct,
    .mm-win-chip.act .mcAct {
        display: block;
        position: absolute;
        height: 100%;
        width: 100%;
        border: 0.2rem solid var(--az-color);
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        -moz-box-sizing: border-box;
    }

    .mm-d-1 {
        height: calc(100% - 257px);
    }

    .mod-mm-btts.act {
        right: 200px;
        top: 77px;
    }
}

@media (min-width: 768px) and (max-width: 991px) and (min-height: 481px) {
    /* TABLET ONLY */

    /* .mod-rs {
        padding: 1rem 0 0 0;
        top: 4rem;
        width: 100%;
        height: calc(100% - 5rem);
    } */
}

@media (orientation: portrait) and (max-width: 768px) and (max-height: 1280px) {

    /* PHONE HOCH */
    .mod-mm {
        padding: 0.9rem 0 0 0;
        top: 3.3rem;
        width: 100%;
        height: calc(100% - 7.2rem);
    }

    .mmm-head {
        margin: 0 0.6rem;
        height: 2.7875rem;
    }

    .mmm-head .bttClose {
        top: 0rem;
        right: 0rem;
    }

    .mmm-main {
        height: calc(100% - 2.7875rem);
    }

    .mmm-th {
        height: 100%;
    }

    .mm_chip_wrap {
        width: calc((100% - 30px)/2);
    }

    .mm_chip {
        position: relative;
        padding: 0px;
        text-align: center;
        cursor: pointer;
        width: 100%;
    }

    .mm_chip img {
        width: 100%;
    }

    /* MM0 */

    .mm-win-chip {
        width: calc((100% - 32px) / 7);
    }

    .mm-win-chip img {
        width: 100%;
    }

    .mm-r-sel {
        display: flex;
        width: calc(100% - 20px);
        margin-left: 10px;
        margin-right: 10px;
        flex-direction: row;
        justify-content: space-between;
    }

    .mm-r-pic {
        display: block;
        /* height: 247px; */
        width: calc(100% - 20px);
        margin-left: 10px;
        margin-bottom: 1rem;
        margin-top: 1rem;
    }



    .mm-win-chip.act .mcAct {
        display: block;
        position: absolute;
        height: 100%;
        width: 100%;
        border: 1px solid var(--az-color);
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        -moz-box-sizing: border-box;
    }

    .mm-win-chip.act .mcAct .ico {
        display: none;
    }

    .mm-tbl.act {
        display: flex;
        justify-content: flex-start;
        flex-direction: row;
        margin-left: 10px;
        margin-right: 10px;
    }

    .btt-aplly {
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translateX(-50%);
        bottom: 60px;
        margin-left: 50%;
        margin-top: 2rem;
        margin-bottom: 2rem;
        position: initial;
    }

    .clm-h {
        margin-bottom: 18px;
    }

    .mm-r-pic img {
        width: 100%;
    }

    .mod-mm-btts.act {
        left: 10px;
        top: 64px;
        right: unset
    }

}

@media (orientation: landscape) and (max-width: 915px) and (max-height: 480px) {

    /* PHONE QUER */
    .mod-mm {
        padding: 0rem 0 0 0;
        top: 0rem;
        width: calc(100% - 3.375rem);
        height: calc(100% - 0rem);
        z-index: 22;
    }


    .mrs-head {
        width: calc(100% - 1rem);
        height: 2.625rem;
        margin: 0;
    }

    .mmm-head .txt {
        padding-top: 0.8125rem;
        margin-left: 10px;
    }

    .mmm-head .bttClose {
        top: 0.9375rem;
        right: 0.75rem;
    }

    .mm_chip_wrap {
        width: calc((100% - 50px)/4);
    }

    .mm_chip {
        position: relative;
        padding: 0px;
        text-align: center;
        cursor: pointer;
        width: 100%;
    }

    .mm_chip img {
        width: 100%;
    }



    /* MM0 */
    .mmm-main {
        height: calc(100% - 54px);
        top: 54px;
    }

    .mmm-head {
        height: 54px;
    }

    .mm_chip_wrap {
        margin: 12px 0px 0px 10px;
    }

    .mm-win-chip {
        width: calc((100% - 32px) / 7);
        margin-left: 2px;
        margin-bottom: 0px;
        position: relative;
        cursor: pointer;
        height: max-content;
    }

    .mm-win-chip img {
        width: 100%;
    }

    .mm-r-sel {
        display: flex;
        width: calc(100% - 20px);
        margin-left: 10px;
        margin-right: 10px;
        flex-direction: row;
        justify-content: space-between;
        height: auto;
        background-color: transparent;
        height: calc(100% - 279px);
    }

    .mm-r-pic {
        display: block;
        height: 247px;
        width: calc(100% - 20px);
        margin-left: 10px;
        margin-bottom: 1rem;
        margin-top: 1rem;
    }



    .mm-win-chip.act .mcAct {
        display: block;
        position: absolute;
        height: 100%;
        width: 100%;
        border: 1px solid var(--az-color);
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        -moz-box-sizing: border-box;
    }

    .mm-win-chip.act .mcAct .ico {
        display: none;
    }

    .mm-tbl.act {
        display: flex;
        justify-content: flex-start;
        flex-direction: row;
        margin-left: 10px;
        margin-right: 10px;
    }

    .btt-aplly {
        bottom: 22px;
        right: 22px;
    }

    .clm-h {
        margin-bottom: 18px;
    }

    .mm-r-pic img {
        width: 100%;
    }

    .mm-d-1 {
        width: 370px;
        display: inline-block;
        height: 100%;
    }

    .mm-d-2 {
        display: inline-block;
        vertical-align: top;
    }

    .mm-w-clm {
        display: inline-block;
        width: 190px;
        margin-top: 14px;
    }



    .mod-mm-btts.act {
        position: absolute;
        right: 66px;
        top: 8px;
        display: flex;
    }

    .mm-r-main {
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        flex-wrap: nowrap;
    }


}

/* MAIN END */


.mm0_roomblock {
    /* border-bottom: 1px solid #000; */
    position: relative;
}

.mm0_roomblock.act {
    background-color: rgba(196, 196, 196, 0.8);
}

.mm0_roomblock.act .mm0_button {
    display: inline;
}

#new_mm0_content {}

.mm0_roomblock_element {
    display: inline-block;
    margin: 15px 12px 15px 12px;
    position: relative;
    vertical-align: top;
}

.mm0_roomblock_element .mm0_radioinputdiv {
    margin: 3px 1px 3px 1px;
    cursor: pointer;
}

.mm0_roomblock_element .mm0_radioinputdiv input {
    margin: 3px 10px 3px 3px;
}

.mm0_roomblock_element_choiseblock {
    margin-top: 0;
    min-width: 180px;
}

.mm0_button {
    display: none;
    float: right;
    height: 25px;
    line-height: 25px;
    background-color: var(--dg-color);
    color: #fff;
    padding-left: 8px;
    padding-right: 8px;
    margin-right: 15px;
    margin-top: 9px;
    cursor: pointer;
    position: absolute;
    right: 10px;
    bottom: 10px;
}

.mm0_radioinputdiv.act {
    background-color: rgba(86, 86, 86, 0.8);
    color: var(--az-color);
}

.mm0_button.act,
.mm0_button:hover {
    background-color: var(--az-color);
}

.mix_match_header {
    color: #fff;
}

.mix_match_header_0_titlebox {
    position: absolute;
    top: 11px;
    left: 15px;
    font-weight: 600;
}

#btt_mix_match_bar {
    display: inline-block;
    position: relative;
    /* left: 20px; */
    height: 25px;
    line-height: 25px;
    background-color: var(--az-color);
    color: #fff;
    padding: 5px 20px 5px 20px;
    margin-left: 10px;
    margin-right: 30px;
    cursor: pointer;
}


.btt_mm:hover,
#btt_mm_0.act {
    background-position: -55px 0px;
}

#btt_mm_1 {
    background-position: 0px -110px;
}

#btt_mm_1:hover,
#btt_mm_1.act {
    background-position: -55px -110px;
}

#btt_mm_2 {
    background-position: 0px -165px;
}

#btt_mm_2:hover,
#btt_mm_2.act {
    background-position: -55px -165px;
}

.mix_match {
    position: absolute;
    width: 450px;
    height: 350px;
    overflow-x: hidden;
    overflow-y: auto;
    background-color: rgba(255, 255, 255, 0.8);
    padding: 0px;
    display: none;
}

.mix_match_header {
    height: 41px;
    width: 100%;
    background-color: rgba(86, 86, 86, 0.8);
}

.mix_match_content {
    -webkit-overflow-scrolling: touch;
}

.mm0_rule {
    background-color: #000;
    height: 1px;
    width: 100%;
    border: 0;
    margin: 0;
    padding: 0;
}

#mm_0,
#mm_1,
#mm_2 {
    padding: 0px;
}

.mm_chip_wrap {
    display: inline-block;
    margin: 5px 0px 0px 10px;
    position: relative;
}

.mm_chip {
    position: relative;
    padding: 0px;
    text-align: center;
    overflow: hidden;
    cursor: pointer;
    background-position: center center;
}