.leftpartcontent {
    max-width: 25em;
    width: 25em;
    flex-shrink: 0;
    flex-grow: 0;
}

@media screen and (min-width: 980px) {

    .withleftpart {
        -moz-display: flex;
        -webkit-display: flex;
        -ms-display: flex;
        display: flex;
        -moz-align-items: flex-start;
        -webkit-align-items: flex-start;
        -ms-align-items: flex-start;
        align-items: flex-start	;
        -moz-flex-direction: row;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -moz-justify-content: flex-start;
        -webkit-justify-content: flex-start;
        -ms-justify-content: flex-start;
        justify-content: flex-start;
        -moz-flex-wrap: nowrap;
        -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        margin: 0 auto!important;
        max-width: calc(1200px + 25em);
    }

    .withleftpart .leftpartcontent.fixed {
        position: fixed;
        width: 25em;
        bottom:0;
        overflow-x: hidden;
        overflow-y: auto;
        z-index: 1;
    }
    .withleftpart .leftpartcontent.fixed.atend {
        position: relative;
        align-self: flex-end;
        bottom: auto!important;
        top: auto!important;

    }
    .withleftpart .leftpartcontent.fixed.atstart {
        bottom: auto;
    }
    .withleftpart .leftpartcontent.fixed + * {
        padding-left: 25em;
    }
    .withleftpart .leftpartcontent.fixed.atend +*{
        margin-left: inherit;
        width: 100%;
    }

    .leftpartcontent .banners {
        -moz-flex-direction: column;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -moz-justify-content: flex-start;
        -webkit-justify-content: flex-start;
        -ms-justify-content: flex-start;
        justify-content: flex-start;
        -moz-align-items: flex-start;
        -webkit-align-items: flex-start;
        -ms-align-items: flex-start;
        align-items: flex-start;
        margin: 2em 0;

        /*
            background-image: -moz-linear-gradient(to right top, #581f80, #8447a8);
            background-image: -webkit-linear-gradient(to right top, #581f80, #8447a8);
            background-image: -ms-linear-gradient(to right top, #581f80, #8447a8);
            background-image: linear-gradient(to right, #fff, transparent, #fff);
        */

        z-index: 1;
    }

    .leftpartcontent .banners .action {
        color: #fff;
        max-width: 100%;
        border-radius: 0 4em 4em 0;
        margin-right: 0;
        padding: 0.5em 2em 0.5em 1em;
    }

    body.is-loading .leftpartcontent .banners .action {
        -moz-transform: translateX(-3.5em) translateY(0);
        -webkit-transform: translateX(-3.5em) translateY(0);
        -ms-transform: translateX(-3.5em) translateY(0);
        transform: translateX(-3.5em) translateY(0);
    }

    .leftpartcontent .style-white .inner.light {
        padding-right: 0;
    }
}
.filters {
    display: -moz-flex;
    display: -webkit-flex;
    display: -ms-flex;
    display: flex;
    -moz-flex-direction: column;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -moz-justify-content: flex-start;
    -webkit-justify-content: flex-start;
    -ms-justify-content: flex-start;
    justify-content: flex-start;
    -moz-align-items: stretch;
    -webkit-align-items: stretch;
    -ms-align-items: stretch;
    align-items: stretch;
    -moz-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
.filters .properties {
    padding:  1em;
    white-space: nowrap;
    font-size: 0.9em;
}
#filters h2 {
    padding: 0;
    margin:0;
}

@media screen and (max-width: 980px) {
    #filters h2:after {
        -moz-osx-font-smoothing: grayscale;
        -webkit-font-smoothing: antialiased;
        font-family: FontAwesome;
        font-style: normal;
        font-weight: normal;
        text-transform: none !important;
        content: "\f204";
        margin-left: 0.25em;
        font-size: 1.5em;
        position: absolute;
        margin-top: -0.25em;
        cursor: pointer;
        line-height: 1.25em;
    }
    #filters.clicked h2:after {
        content: "\f205";
    }
    #filters .filters .properties {
        display: none;
        min-width: 15em;
    }
    #filters.clicked .filters .properties {
        display: block;
    }
}
.filters .properties .title {
    font-weight: bold;
    margin-bottom: 0.5em;
}
.style-white .filters .properties .title  {
    color: rgba(0,0,0,0.9);
}


.subcollsIcons {
    display: -moz-flex;
    display: -webkit-flex;
    display: -ms-flex;
    display: flex;
    -moz-flex-direction: row;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -moz-justify-content: flex-start;
    -webkit-justify-content: flex-start;
    -ms-justify-content: flex-start;
    justify-content: flex-start;
    -moz-align-items: flex-start;
    -webkit-align-items: flex-start;
    -ms-align-items: flex-start;
    align-items: flex-start;
    -moz-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
.subcollsIcons > * {
    margin: 0.5em 0;
    text-transform: uppercase;
    letter-spacing: 0px;
    width: 33%;
    text-align: center;
    padding: 1em;

    display: -moz-flex;
    display: -webkit-flex;
    display: -ms-flex;
    display: flex;
    -moz-flex-direction: column;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -moz-justify-content: center;
    -webkit-justify-content: center;
    -ms-justify-content: center;
    justify-content: center;
    -moz-align-items: stretch;
    -webkit-align-items: stretch;
    -ms-align-items: stretch;
    align-items: stretch;
    -moz-flex-wrap: nowrap;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    text-align: center;
    /*text-decoration:none;*/



}
.subcollsIcons .circle {
    background-color: rgba(242,242,242,0.7);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    width: 100%;
    height: 200px;

    border: 1px solid #e0e0e0;
    /*box-shadow: 0 0 25px 0px #ddd;*/
    margin: 0 auto;
    line-height: 9em;
}



.subcollsIcons .circle:not([style*=background-image]):before {
    /*-moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    text-transform: none !important;
    content: "\f164";
    text-decoration: none;
    font-size: 3em;*/
    color: #fff;
    display: inline-block;
    content: 'скоро';
    font-weight: bold;
    font-size: 2em;
}
.subcollsIcons > *:hover {
    text-decoration: underline;
}
.subcollsIcons .circle + * {
    font-size: 0.8em;
    margin-top: 1em;
    text-decoration: none;
    letter-spacing: 1px;
    font-weight: bold;
}
.subcollsIcons .circle:not([style*=background-image]) + * {
    margin-top: 0;
    text-decoration: underline;
}

/*
.inner  .inner.subcolls.alone .circle {
    display: block!important;
}
.inner  .inner.subcolls.alone .circle + * {
    margin-top: 1em;
}
*/
.withleftpart .showOnSmallScreen {
    display: none;
}
.withleftpart .hideOnSmallScreen {
    display: block;
}

.withleftpart .leftpartcontent + * {
    width: 100%;
}

@media screen and (min-width: 980px) {
    .withleftpart .leftpartcontent + * .inner {
        padding:0 2em 0 2em;
        min-width: auto;
    }
}

@media screen and (max-width: 980px) {
    .withleftpart .showOnSmallScreen {
        display: block;
    }
    .withleftpart .hideOnSmallScreen {
        display: none;
    }
    .withleftpart {
        -moz-flex-direction: column;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }
    .withleftpart .leftpartcontent {
        width: 100%;
        max-width: none;
    }

    .filters {

        -moz-flex-direction: row;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
    }

    .subcollsIcons {

        -moz-justify-content: center;
        -webkit-justify-content: center;
        -ms-justify-content: center;
        justify-content: center;

    }
}

.relatedmenu {
    margin: 0 -1em;

    display: -moz-flex;
    display: -webkit-flex;
    display: -ms-flex;
    display: flex;
    -moz-flex-direction: row;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -moz-justify-content: flex-start;
    -webkit-justify-content: flex-start;
    -ms-justify-content: flex-start;
    justify-content: flex-start;
    -moz-align-items: stretch;
    -webkit-align-items: stretch;
    -ms-align-items: stretch;
    align-items: stretch;
    -moz-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;

}

.relatedmenu ul {
    list-style: none;
    padding: 0;
    vertical-align: top;
    margin: 1em 0;
}
.relatedmenu li {
    margin: 0;
    padding: 0.25em 0;
    line-height: 1.2em;
    font-size: 1em;
}
.relatedmenu li .icon {
    margin-right: 0.3em;
}
.relatedmenu li.current a {
    font-weight: bold;
    text-decoration: none;
}

@media screen and (max-width: 980px) {
    .relatedmenu ul {
        display: inline-block;
        margin: 1em;
    }
}