@font - face {
    font - family: 'Open Sans';
    src: url(.. / src / css / 'Open Sans' - Regular - webfont.eot);
    src: url(.. / src / css / 'Open Sans' - Regular - webfont.eot# iefix) format("embedded-opentype"), url(.. / src / css / 'Open Sans' - Regular - webfont.woff) format("woff"), url(.. / src / css / 'Open Sans' - Regular - webfont.ttf) format("truetype"), url(.. / src / css / 'Open Sans' - Regular - webfont.svg# 'Open Sans'regular) format("svg");
    font - weight: 400;
    font - style: normal
}
@font - face {
    font - family: 'Open Sans' - bold;
    src: url(.. / src / css / 'Open Sans' - Bold - webfont.eot);
    src: url(.. / src / css / 'Open Sans' - Bold - webfont.eot# iefix) format("embedded-opentype"), url(.. / src / css / 'Open Sans' - Bold - webfont.woff) format("woff"), url(.. / src / css / 'Open Sans' - Bold - webfont.ttf) format("truetype"), url(.. / src / css / 'Open Sans' - Bold - webfont.svg# 'Open Sans'bold) format("svg");
    font - weight: 700;
    font - style: normal
}
@font - face {
    font - family: 'Open Sans' - medium;
    src: url(.. / src / css / 'Open Sans' - Semibold - webfont.eot);
    src: url(.. / src / css / 'Open Sans' - Semibold - webfont.eot# iefix) format("embedded-opentype"), url(.. / src / css / 'Open Sans' - Semibold - webfont.woff) format("woff"), url(.. / src / css / 'Open Sans' - Semibold - webfont.ttf) format("truetype"), url(.. / src / css / 'Open Sans' - Semibold - webfont.svg# 'Open Sans'medium) format("svg");
    font - weight: 700;
    font - style: normal
}
@font - face {
    font - family: 'Open Sans' - italic;
    src: url(.. / src / css / 'Open Sans' - Italic - webfont.eot);
    src: url(.. / src / css / 'Open Sans' - Italic - webfont.eot# iefix) format("embedded-opentype"), url(.. / src / css / 'Open Sans' - Italic - webfont.woff) format("woff"), url(.. / src / css / 'Open Sans' - Italic - webfont.ttf) format("truetype"), url(.. / src / css / 'Open Sans' - Italic - webfont.svg# 'Open Sans'italic) format("svg");
    font - weight: 400;
    font - style: italic
}
@font - face {
    font - family: 'Open Sans' - light;
    src: url(.. / src / css / 'Open Sans' - Light - webfont.eot);
    src: url(.. / src / css / 'Open Sans' - Light - webfont.eot# iefix) format("embedded-opentype"), url(.. / src / css / 'Open Sans' - Light - webfont.woff) format("woff"), url(.. / src / css / 'Open Sans' - Light - webfont.ttf) format("truetype"), url(.. / src / css / 'Open Sans' - Light - webfont.svg# 'Open Sans'light) format("svg");
    font - weight: 400;
    font - style: normal
}.loader {
        position: absolute;top: 0;left: 0;width: 100 % ;height: 100 %
    }.loader > .icon {
        display: inline - block;width: 57 px;height: 57 px;background - image: url(.. / src / img / preloader.gif);position: absolute;left: 50 % ;top: 50 % ;transform: translate(-50 % , -50 % ); - webkit - background - size: cover; - moz - background - size: cover; - o - background - size: cover;background - size: cover
    }.THRON - recommendation - wall - noitem {
        font - family: 'Open Sans';
        background - color: none;
        cursor: default;
        width: 100 % ;
        height: 30 px;
        top: 50 % ;
        color: red;
        position: relative;
        text - align: center;
        vertical - align: middle
    }.THRON - recommendation - wall -
    default {
        font - family: 'Open Sans';width: 100 % ;height: 100 % ;overflow: hidden;padding: 0;min - height: 200 px;min - width: 200 px
    }.THRON - recommendation - wall -
    default.k - loading - image {
        background - image: url('https://hub-cdn.thron.com/shared/assets/preloader/F39900.gif');
        background - size: 50 px;
        background - repeat: no - repeat;
        background - position: center;
        height: 100 % ;
        width: 50 px;
        margin: auto;
        position: relative
    }.THRON - recommendation - wall -
    default.k - loading - text {
        display: none
    }.THRON - recommendation - wall -
    default.k - loading - color {
        display: none
    }.THRON - recommendation - wall - item -
    default {
        background - color: #fff;font - family: 'Open Sans';cursor: default;overflow: hidden;position: relative
    }.THRON - singol - item - class1 {
        width: 200 px;height: 200 px
    }.THRON - singol - item - class2 {
        width: 200 px;height: 400 px
    }.THRON - singol - item - class3 {
        width: 400 px;height: 400 px
    }.THRON - recommendation - wall - item -
    default: hover.THRON - item - hover - container {
        opacity: 1
    }.THRON - recommendation - wall - item -
    default.THRON - item - image - container {
        position: absolute; - webkit - transition: all .3 s linear; - moz - transition: all .3 s linear; - o - transition: all .3 s linear;transition: all .3 s linear; - webkit - filter: grayscale(50 % ); - moz - filter: grayscale(50 % ); - o - filter: grayscale(50 % );filter: grayscale(50 % );cursor: pointer;max - width: 100 % ;max - height: 100 %
    }.THRON - recommendation - wall - item -
    default.THRON - item - href {
        font - family: 'Open Sans';
        width: 100 % ;
        height: 100 %
    }.THRON - recommendation - wall - item -
    default.THRON - item - image - container {
        font - family: 'Open Sans';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background - position: center center;
        background - repeat: no - repeat;
        background - size: cover
    }.THRON - recommendation - wall - item -
    default: hover.THRON - item - image - container {
        -webkit - transition: all 1.6 s linear; - moz - transition: all 1.6 s linear; - o - transition: all 1.6 s linear;
        transition: all 1.6 s linear; - moz - transform: scale(1.1); - webkit - transform: scale(1.1); - o - transform: scale(1.1); - ms - transform: scale(1.1);
        transform: scale(1.1); - webkit - filter: grayscale(0); - moz - filter: grayscale(0); - o - filter: grayscale(0);
        filter: none;
        font - family: 'Open Sans'
    }.THRON - recommendation - wall - item -
    default.THRON - item - hover - container {
        position: absolute;bottom: 0;left: 0;height: 80 % ;width: 100 % ;opacity: 0;font - family: 'Open Sans';background - image: -webkit - gradient(linear, 50 % 0, 50 % 100 % , color - stop(0, rgba(0, 0, 0, 0)), color - stop(50 % , rgba(0, 0, 0, .5)), color - stop(100 % , rgba(0, 0, 0, .7)));background - image: -moz - linear - gradient(top, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, .5) 50 % , rgba(0, 0, 0, .7) 100 % );background - image: -webkit - linear - gradient(top, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, .5) 50 % , rgba(0, 0, 0, .7) 100 % );background - image: linear - gradient(to bottom, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, .5) 50 % , rgba(0, 0, 0, .7) 100 % ); - moz - transition: all .4 s ease - out; - o - transition: all .4 s ease - out; - webkit - transition: all .4 s ease - out;transition: all .4 s ease - out
    }.THRON - recommendation - wall - item -
    default.THRON - item - information {
        position: absolute;bottom: 0;width: 100 % ;max - height: 60 px;overflow: hidden;transition - property: all;transition - duration: .4 s;font - family: 'Open Sans'
    }.THRON - recommendation - wall - item -
    default: hover.THRON - item - information {
        background - color: rgba(255, 255, 255, .76);
        max - height: 300 px;
        transition - property: all;
        transition - duration: .6 s
    }.THRON - recommendation - wall - item -
    default.THRON - item - information > .THRON - item - title {
        display: inline - block;position: relative;top: 4 px;padding: 0 10 px;height: 50 px;width: calc(100 % -20 px);overflow: hidden;color: #fff;font - size: 19 px;font - weight: 700;font - family: 'Open Sans';text - shadow: 0 0 3 px #000;line-height:50px;font-family:'Open Sans';word-wrap:break-word;font-family:'Open Sans'}.THRON-recommendation-wall-item-default .THRON-item-information>.THRON-item-title>.title{position:absolute;word-wrap:break-word;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:50px;font-family:'Open Sans';width:calc(100% - 22px);font-family:'Open Sans'}.THRON-recommendation-wall-item-default .THRON-item-information>.THRON-item-title>.type-layer{opacity:0;position:absolute;right:7px;top:7px;font-family:'Open Sans'}.THRON-recommendation-wall-item-default .THRON-item-information>.THRON-item-title>.type-layer>.icon{display:inline-block;width:35px;height:35px}.THRON-recommendation-wall-item-default .THRON-item-information>.THRON-item-title>.type-layer>.icon.IMAGE{background:url(../src/img/title-image.png) no-repeat}.THRON-recommendation-wall-item-default .THRON-item-information>.THRON-item-title>.type-layer>.icon.AUDIO{background:url(../src/img/title-audio.png) no-repeat}.THRON-recommendation-wall-item-default .THRON-item-information>.THRON-item-title>.type-layer>.icon.VIDEO{background:url(../src/img/title-video.png) no-repeat}.THRON-recommendation-wall-item-default .THRON-item-information>.THRON-item-title>.type-layer>.icon.PAGELET{background:url(../src/img/title-pagelet.png) no-repeat}.THRON-recommendation-wall-item-default .THRON-item-information>.THRON-item-title>.type-layer>.icon.PLAYLIST{background:url(../src/img/title-playlist.png) no-repeat}.THRON-recommendation-wall-item-default .THRON-item-information>.THRON-item-title>.type-layer>.icon.DOCUMENT{background:url(../src/img/title-document.png) no-repeat}.THRON-recommendation-wall-item-default:hover .THRON-item-information>.THRON-item-title>.type-layer{opacity:1}.THRON-recommendation-wall-item-default:hover .THRON-item-information>.THRON-item-title{background-color:# f8a63e;font - family: 'Open Sans'
    }.THRON - recommendation - wall - item -
    default: hover.THRON - item - information > .THRON - item - title > .title {
        width: calc(100 % -65 px);font - family: 'Open Sans'
    }.THRON - recommendation - wall - item -
    default.THRON - item - information > .THRON - item - description {
        font - family: 'Open Sans';
        max - height: 120 px;
        line - height: 13 px;
        color: #070707;font-family:'Open Sans';font-size:13px;margin:10px;word-wrap:break-word;line-height:20px;text-overflow:ellipsis;overflow:hidden}.THRON-recommendation-wall-item-default .THRON-item-information>.THRON-item-bottom{text-align:right}.THRON-recommendation-wall-item-default .THRON-item-information>.THRON-item-bottom>.icon{display:inline-block;width:25px;height:25px;background:url(../src/img/item-right-arrow.png) no-repeat;margin:5px}