*[type="choice-tree"] {
    position:relative;
    padding: 45px 0;
}

*[type="choice-tree"] .choice-tree-target {
    margin-top: 45px;
    max-height: 999999px;
}

*[type="choice-tree"] .choice-tree-target .DataBinding {
    display: none;
}

*[type="choice-tree"]:before {
    content: "";
    display: block;
    position: absolute;
    bottom: 0;
    left: calc(100% - 1200px - (100vw - 1200px + 100%) / 2);
    width: calc(1200px - 100% + (100vw - 1200px + 100%) / 2);
    height: 100%;
    background: inherit;
}

*[type="choice-tree"]:after {
    content: "";
    position: absolute;
    bottom: 0;
    right: calc((1200px - 100vw) / 2 + 9px);
    width: calc((100vw - 1200px) / 2 - 9px);
    height: 100%;
    height: 100%;
    background: inherit;
}

@media screen and (max-width:1280px) {
	*[type="choice-tree"]:after {
		right: -2.6%;
		width: 2.6%;
    }
}

@media screen and (max-width:1019px) {
	*[type="choice-tree"]:after {
		right: calc((950px - 100vw) / 2 + 9px);
		width: calc((100vw - 950px) / 2 - 9px);
    }
}

.choice-tree.opened {
    background: inherit;
}

.choice-tree.opened > * {
    background: inherit;
}

.choice-tree.opened *[comment="Пошаговый выбор"] {
    display: flex;
    flex-direction: column;
}

.choice-tree.opened .List {
    min-width: 100%;
    margin-top: 10px;
    border-color: #7f8083;
}

.choice-tree.opened .List:first-child {
    margin-top: 0;
}

.choice-tree.opened .List:last-child {
    margin-top: 0;
}

.choice-tree.opened .List .DataBinding {
    display: inline-block;
    font-size: 1.125em;
    font-weight: bold;
    /*margin: 2px 10px 4px 10px;*/
    margin: 2px 10px 4px 0;
    min-height: 1em;
    cursor: pointer;
}

.choice-tree.opened .List .DataBinding:after {
    content: "\2191";
    margin-left: 5px;
}

.choice-tree.opened .List *[comment="Список выбора"] {
    display: flex;
    flex-wrap: wrap;
}

.choice-tree.opened .List *[comment="Список выбора"] > .SelectionField {
    display: flex;
    align-items: center;
    font-size: 1.125em;
    width: calc((100% - 20px * 2 - 20px * 2 * 3 - 1px * 2 * 3) / 3);
    margin: 20px 20px 0 0;
    padding: 20px;
    background: #ebebeb;
    cursor: pointer;
}

.choice-tree.opened .List:first-child *[comment="Список выбора"] > .SelectionField {
    display: none;
}

.ViewContainer:nth-child(even) .choice-tree.opened .List *[comment="Список выбора"] > .SelectionField {
    background: #ffffff;
}

*[type="choice-tree"] .choice-tree.opened .List *[comment="Список выбора"] > .SelectionField:hover {
    background: #b81819;
    color: #ffffff;
}

*[type="choice-tree"] .choice-tree.opened .List *[comment="Список выбора"] > .SelectionField.choiced {
    background: #b81819;
    color: #ffffff;
}

.contrast0 *[type="choice-tree"] .choice-tree.opened .List *[comment="Список выбора"] > .SelectionField.choiced,
.contrast1 *[type="choice-tree"] .choice-tree.opened .List *[comment="Список выбора"] > .SelectionField.choiced,
.contrast2 *[type="choice-tree"] .choice-tree.opened .List *[comment="Список выбора"] > .SelectionField.choiced,
.contrast3 *[type="choice-tree"] .choice-tree.opened .List *[comment="Список выбора"] > .SelectionField.choiced {
    background: inherit;
    color: inherit;
}

.contrast0 *[type="choice-tree"] .choice-tree.opened .List *[comment="Список выбора"] > .SelectionField.choiced {
    border: 1px solid #000000;
}

.contrast1 *[type="choice-tree"] .choice-tree.opened .List *[comment="Список выбора"] > .SelectionField.choiced {
    border: 1px solid #ffffff;
}

.contrast2 *[type="choice-tree"] .choice-tree.opened .List *[comment="Список выбора"] > .SelectionField.choiced {
    border: 1px solid #333365;
}

.contrast3 *[type="choice-tree"] .choice-tree.opened .List *[comment="Список выбора"] > .SelectionField.choiced {
    border: 1px solid #ffff80;
}

.choice-tree.opened .List *[comment="Список выбора"] > .SelectionField:nth-child(-n+3) {
    margin-top: 0;
}

.choice-tree.opened .List *[comment="Список выбора"] > .SelectionField:nth-child(3n+3) {
    margin-right: 0;
}

.choice-tree.opened .selectmode .List.leafsonly{
    display: none;
}

.choice-tree.opened .List.leafsonly .DataBinding {
    display: none;
}

.choice-tree.opened .List.leafsonly + .List .DataBinding {
    display: none;
}

.choice-tree.opened .List.leafsonly *[comment="Список выбора"] > .SelectionField:last-child {
    display: none;
}

.choice-tree.opened:before {
    content: attr(title);
    display: block;
    margin: 0 0 1em 0;
    font-size:1.125em;
}

.choice-tree.opened .List:last-child .DataBinding {
    display: none;
}

.contrast0 .choice-tree.opened .List *[comment="Список выбора"] > .SelectionField:before,
.contrast1 .choice-tree.opened .List *[comment="Список выбора"] > .SelectionField:before,
.contrast2 .choice-tree.opened .List *[comment="Список выбора"] > .SelectionField:before,
.contrast3 .choice-tree.opened .List *[comment="Список выбора"] > .SelectionField:before {
    display: none;
}

.contrast0 .choice-tree.opened .List *[comment="Список выбора"] > .SelectionField {
    background: #ffffff;
}

.contrast0 .choice-tree.opened .List *[comment="Список выбора"] > .SelectionField:hover {
    background: #ffffff;
    border: 1px solid #000000;
    color: #000000;
}

.contrast1 .choice-tree.opened .List *[comment="Список выбора"] > .SelectionField {
    background: #000000;
}

.contrast1 .choice-tree.opened .List *[comment="Список выбора"] > .SelectionField:hover {
    background: #000000;
    border: 1px solid #ffffff;
}

.contrast2 .choice-tree.opened .List *[comment="Список выбора"] > .SelectionField {
    background: #ffff80;
}

.contrast2 .choice-tree.opened .List *[comment="Список выбора"] > .SelectionField:hover {
    background: #ffff80;
    border: 1px solid #333365;
    color: #333365;
}

.contrast3 .choice-tree.opened .List *[comment="Список выбора"] > .SelectionField {
    background: #333365;
}

.contrast3 .choice-tree.opened .List *[comment="Список выбора"] > .SelectionField:hover {
    background: #333365;
    border: 1px solid #ffff80;
    color: #ffff80;
}

/*begin default*/
.choice-tree.default {
    display: inline-block;
    background: inherit;
}

.choice-tree.default > * {
    background: inherit;
}
.choice-tree.default *[comment="Пошаговый выбор"] {
    display: flex;
    flex-direction: column;
}

.choice-tree.default .List {
    min-width: 100%;
    margin-top: 10px;
    border: 1px solid;
    border-radius: 10px;
    border-color: #7f8083;
    background: inherit;
}

.contrast0 .choice-tree.default .List {
    background: #ffffff !important;
}

.contrast1 .choice-tree.default .List {
    background: #000000 !important;
}

.contrast2 .choice-tree.default .List {
    background: #ffff80 !important;
}

.contrast3 .choice-tree.default .List {
    background: #333365 !important;
}

.choice-tree.default .List:first-child {
    margin-top: 0;
}

.choice-tree.default .List:last-child {
    margin-top: 0;
}

.choice-tree.default .List .DataBinding {
    font-size: 1.125em;
    margin: 2px 10px 4px 10px;
    min-height: 1em;
    cursor: pointer;
}

.choice-tree.default .List .DataBinding:after {
    float: right;
    margin-left: 10px;
    font-weight: bold;
    content: "\2193";
}

.choice-tree.default .List *[comment="Список выбора"] {
    width: 100%;
}

.choice-tree.default .List *[comment="Список выбора"] > .SelectionField {
    display: none;
    padding: 2px 10px 2px 10px;
    cursor: pointer;
}

.choice-tree.default .List *[comment="Список выбора"] > .SelectionField:last-child {
    padding-bottom: 4px;
    border-radius: 0 0 10px 10px;
}

.choice-tree.default .List:last-child *[comment="Список выбора"] > .SelectionField {
    display: block;
}

.choice-tree.default .List *[comment="Список выбора"] > .SelectionField:hover {
    background: #b81819;
    color: #ffffff !important;
}
/*end default*/
