@font-face { font-family: 'icon-font'; src: url('/css/fonts/icons.eot'); src: url('/css/fonts/icons.eot') format('embedded-opentype'), url('/css/fonts/icons.woff') format('woff'), url('/css/fonts/icons.ttf') format('truetype'), url('/css/fonts/icons.svg#icons') format('svg'); font-weight: 400; font-style: normal }[class*=icon-]:before { display: inline-block; font-family: 'icon-font'; font-style: normal; font-weight: 400; line-height: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale }.icon-addfriend:before{content:'\0041';}.icon-filter:before{content:'\0042';}.icon-arrow_down:before{content:'\0043';}.icon-menu:before{content:'\0044';}.icon-menu:before{content:'\0045';}.icon-heart:before{content:'\0046';}.icon-camera:before{content:'\004f';}.icon-cookie:before{content:'\0053';}.icon-download:before{content:'\0054';}.icon-email:before{content:'\0055';}.icon-eye:before{content:'\0056';}.icon-facebook:before{content:'\0057';}.icon-gear:before{content:'\0058';}.icon-gplus:before{content:'\0059';}.icon-like:before{content:'\005a';}.icon-lupe:before{content:'\0061';}.icon-menu:before{content:'\0062';}.icon-newest:before{content:'\0063';}.icon-pendingfriend:before{content:'\0064';}.icon-play:before{content:'\0065';}.icon-present:before{content:'\0066';}.icon-twitter:before{content:'\0068';}.icon-sort:before{content:'\0069';}.icon-question:before{content:'\006a';}.icon-close:before{content:'\006b';}.icon-info:before{content:'\006c';}.icon-poll:before{content:'\006d';}.icon-rotate:before{content:'\006e';}.icon-chain:before{content:'\006f';}.icon-unlocked:before{content:'\0070';}.icon-locked:before{content:'\0071';}.icon-location:before{content:'\0072';}.icon-channel:before{content:'\0073';}.icon-user:before{content:'\0074';}.icon-snackbox:before{content:'\0075';}/*.icon-trash:before{content:'\0076';}*/.icon-share:before{content:'\0077';}.icon-edit:before{content:'\0078';}.icon-filter:before{content:'\0079';}.icon-analysis:before{content:'\007a';}.icon-classroom:before{content:'\0030';} :root {    --tile-margin: 7px;    --tile-width: 209px;}/* Reset and base styles */* {    margin: 0;    padding: 0;    outline: none;    -webkit-font-smoothing: antialiased;    -moz-osx-font-smoothing: grayscale;    -webkit-tap-highlight-color: transparent;    -webkit-box-sizing: border-box;    -moz-box-sizing: border-box;    box-sizing: border-box;    font-family: 'Titillium Web', Helvetica, sans-serif;}/* Links and buttons */a,.btn,.categories ul a {    text-decoration: none;}/* Text colors */.black,.blue,.darkGrey,.lightBlue,.pink {    color: #fff !important;}/* Text overflow */.snackTitle,.stats label,a.channelThumbnail {    white-space: nowrap;    overflow: hidden;    text-overflow: ellipsis;}/* Specific elements */.item .text,.loginbox .btn input,.menu .button,.sortBar .text,.sortBar .types .type,.userCenter.login .loginBtn div,.userInfo,body,div#footer-content,html,ul.pages {    font-family: 'Titillium Web', Helvetica, sans-serif;}/* Draggable elements */[draggable] {    user-select: none;    -webkit-user-drag: element;}/* Reset styles for body and html */body,html {    padding: 0;    margin: 0 auto;    position: relative;    min-height: 100%;    height: 100%;    display: block;    width: 100%;    -webkit-overflow-scrolling: touch;    background: #f4f4f4;    overflow: auto;    text-size-adjust: 100%;}/* Menu items */.menuItems {    overflow: auto;}/* Buttons */.btn {    background-color: #fff;    border: none;    width: auto;    cursor: pointer;}/* Logo */div#logo {    background: url(../images/ls-logo.png) left no-repeat;    width: 100%;    margin: 10px;    position: relative;    height: 70px;    background-size: auto 100%;}/* Positioning */.fixed {    position: fixed;}.relative {    position: relative;}.absolute {    position: absolute;}/* Float */.floatLeft {    float: left;}.floatRight {    float: right !important;}/* Padding */.padding5 {    padding: 5px;}.angular-google-map {    position: relative;    width: 100%;    height: 100%;    padding-bottom: 16px;}.padding20 {    padding: 20px;}.padding2 {    padding: 2px;}.noPadding {    padding: 0 !important;}.black {    background-color: #000 !important}.darkGrey {    background-color: #333 !important}.pink {    background-color: #f39 !important}.lightBlue {    background-color: #6cf !important}.blue {    background-color: #369 !important}.blueText {    color: #369 !important}.lightRedText {    color: var(--main-color) !important}.redText {    color: var(--main-color)}.red {    background-color: var(--main-color) !important;    color: #fff !important;}.menuBtn,div#sidebarWrapper {    display: none}.menu-secondary {    position: relative;    width: 100%;    height: 45px;    overflow: visible;    border-bottom: 1px solid #e5e5e5;    border-top: 1px solid #e5e5e5;    z-index: 1;    background: #fff;    text-align: center;    line-height: 0;    display: block;    margin: 0;    margin-top: 10px}.secondary-background {    background: #fff;    position: absolute;    width: 100%;    left: 0;    bottom: 0;    height: 45px;    border-bottom: 1px solid #e5e5e5;    border-top: 1px solid #e5e5e5;    z-index: 1}.button span,.menuItems {    -webkit-transition: all 250ms ease-in-out;    -o-transition: all 250ms ease-in-out}.plus,.trash {    background-repeat: no-repeat;    background-position: center;    -moz-background-size: 100% 100%;    -o-background-size: 100% 100%}.menuOpen .menu:after {    opacity: 1 !important}.menu {    position: relative;    display: block;    float: none;    margin: 0 auto;    width: 615px;    z-index: 2}.menu-buttons {    display: inline-block;    position: relative}.menu-buttons.filter {    display: block;    position: absolute;    right: 0;    top: 0;    height: 45px;    line-height: 45px}.snackPlayerActive .menu-secondary {    display: none}.menu-secondary .menu-buttons .button {    width: auto;    cursor: pointer;    font-size: 14pt;    color: #525252;    position: relative;    margin: 0 25px;    display: inline-block;    height: 30px}.menu-secondary .menu-buttons {    width: auto;    margin: 0 auto;    max-width: 100%}[ng-click] {    cursor: pointer}span.menu-divider {    position: relative;    display: inline-block;    margin: 0 20px;    border-left: 1px solid #dedede;    width: 1px;    height: 41px}.menu .menu-buttons .button {    width: auto;    cursor: pointer;    font-size: 14pt;    color: rgba(129, 0, 55, .65);    position: relative;    margin: 0 25px;    display: inline-block;    line-height: 15px}.button.active.main:after {    position: absolute;    content: "";    height: 15px;    background: url('/images/arrow_down_main_menu.png') no-repeat center;    left: 50%;    z-index: 4;    -moz-background-size: auto 100%;    -o-background-size: auto 100%;    background-size: auto 100%;    bottom: -25px;    margin-left: -18px;    width: 36px}.menu-secondary .button.active.secondary:after {    position: absolute;    content: "";    height: 15px;    background: url('/images/arrow_down_main_menu.png') no-repeat center;    left: 50%;    z-index: 1;    -moz-background-size: auto 100%;    -o-background-size: auto 100%;    background-size: auto 100%;    width: 50px;    margin-left: -25px;    bottom: -28px}.menu-secondary .button.active {    color: var(--main-color);}.menu-icon {    font-size: 23px;    display: inline-block;    max-height: 34px;    color: #525252;    position: relative;    top: 0;    line-height: 0;    overflow: hidden;    width: 27px;    height: 27px}.menu-text {    margin-top: 0;    font-size: 15px;    color: #525252;    font-weight: 600;    display: block}.active .menu-icon {    color: var(--main-color);}.active .menu-text {    color: var(--main-color);}.button span {    content: "";    opacity: 0;    border: 22px solid;    position: absolute;    bottom: -23px;    left: 50%;    margin-left: -15px;    background-color: transparent;    width: 0;    height: 0;    border-width: 0 15px 12px;    border-color: transparent transparent #363636;    -moz-transition: all 250ms ease-in-out;    -webkit-transition: all 250ms ease-in-out;    -o-transition: all 250ms ease-in-out;    transition: all 250ms ease-in-out}.menuItems .friend,.searchbar input#filter_input {    -webkit-border-radius: 8px 0;    -moz-border-radius: 8px 0}.menuItems,.menuItems .item {    height: 100%;    position: relative}.button.active span {    opacity: 1}.menu.open,.menuOpen .menuItems,.open .menuItems {    max-height: 45px}.snackPlayerActive .menu,.snackPlayerActive .menuItems {    max-height: 0 !important;    -webkit-transition: none;    -moz-transition: none;    -o-transition: none;    transition: none}.border,.menuItems,.removeAnswer {    -moz-transition: all 250ms ease-in-out}.menuItems {    display: block;    white-space: nowrap;    width: 100%;    text-align: center;    -webkit-transition: all 250ms ease-in-out;    -moz-transition: all 250ms ease-in-out;    -o-transition: all 250ms ease-in-out;    transition: all 250ms ease-in-out;    margin: 0;    position: absolute;    top: 0;    line-height: 45px;    overflow: visible}.border,.removeAnswer {    -webkit-transition: all 250ms ease-in-out;    -o-transition: all 250ms ease-in-out}.menuItems .item {    width: auto;    cursor: pointer;    margin: 3px 20px 0 20px;    display: inline-block}.item .icon {    width: 33px;    position: relative;    padding: 5px;    margin: 0 auto;    display: block;    height: 42px;    color: #9e9e9e;    font-size: 25px;    -moz-background-size: 27px auto;    -o-background-size: 27px auto;    background-size: 27px auto;    background-repeat: no-repeat;    background-position: center}.marginLeft10 {    margin-left: 10px}.item.selected .icon {    color: #fff}.menuItems .friend {    width: 50px;    height: 50px;    display: inline-block;    overflow: hidden;    -webkit-border-radius: 8px 0;    -moz-border-radius: 8px 0;    border-radius: 8px 0;    border: 2px solid #fff}.menuItems .friend img.icon {    width: 47px}.item .text {    color: #9e9e9e;    font-size: 12.5px;    text-align: center;    line-height: 12px;}.item.active .text {    color: var(--main-color);}.item.selected .text {    color: #fff}.icon.selected {    color: #fff !important}.mainContent {    margin-top: 30px}.filters {    position: fixed;    right: 0;    width: 320px;    height: 100%;    top: 0;    bottom: 0;    background: #fff;    overflow: auto;    z-index: 10000;    padding: 0 16px;    -webkit-transition: all .3s cubic-bezier(.25, .46, .45, .94);    -moz-transition: all .3s cubic-bezier(.25, .46, .45, .94);    -o-transition: all .3s cubic-bezier(.25, .46, .45, .94);    transition: all .3s cubic-bezier(.25, .46, .45, .94);    -webkit-transform: translate3d(320px, 0, 0);    -moz-transform: translate3d(320px, 0, 0);    transform: translate3d(320px, 0, 0)}.filters.open {    -webkit-transform: translate3d(0, 0, 0);    -moz-transform: translate3d(0, 0, 0);    transform: translate3d(0, 0, 0);    -webkit-box-shadow: -5px 0 21px -8px #8e8e8e;    -moz-box-shadow: -5px 0 21px -8px #8e8e8e;    box-shadow: -5px 0 21px -8px #8e8e8e}.filters-filter {    position: relative;    float: left;    width: 100%;    height: auto;    margin: 16px 0}h3.filters-title {    text-align: left;    color: #525252;    margin: 5px 0;    font-weight: 400;    text-transform: uppercase;    font-size: 18px}.filter-sort {    position: relative;    float: left;    text-align: center}.filter-sort div:nth-of-type(2) {    border-left: 2px solid #525252;    border-right: 2px solid #525252}.filter-sort-item {    position: relative;    display: inline-block;    color: #525252;    padding: 0 7px;    height: 13px;    font-weight: 600;    line-height: 14px;    font-size: 14px;    cursor: pointer}.filter-sort-item.active {    color: var(--main-color);}.filter-categories {    position: relative;    float: left;    width: 100%}.filter-categories .categories-holder {    position: relative;    float: left;    border: 1px solid #e0e0e0;    background: #fbfbfb;    width: 100%;    text-align: center;    overflow: auto}.filter-categories .item {    width: 31%;    display: block;    height: 65px;    margin: 12px 0;    cursor: pointer;    float: left;}.business .filter-categories .item {    width: calc(100% / 3);    height: 70px;    cursor: pointer;    padding: 8px 12px;    background: #fbfbfb;    margin: 0px;    color: #000;    border: 1px dotted rgba(177, 177, 177, 0.1607843137254902);    text-overflow: ellipsis;    vertical-align: top;    text-align: center;    display: block;    float: left;    text-overflow: ellipsis;    overflow: hidden;    table-layout: fixed;    position: relative;}.business .filter-categories .item.active {    background: var(--main-color);}.business .filter-categories .item.active .text {    color: white;}.business .filter-categories .item .text {    color: #9e9e9e;    font-size: 12.5px;    text-align: center;    vertical-align: middle;    line-height: 16px;    display: table-cell;    white-space: normal;}.filter-categories .item.select-all .icon-cookie {    font-size: 34px;    position: relative;    display: inline-block;    color: #9e9e9e;    line-height: 0;    top: 3px}.filter-categories .item.select-all.active .icon-cookie {    color: var(--main-color);}.categories-selector {    position: relative;    float: left}.categories-selector div:nth-of-type(1) {    cursor: pointer}.filters-close {    position: relative;    float: right;    width: 34px;    height: 34px;    text-align: center;    font-size: 34px;    font-weight: lighter;    line-height: 27px;    background: var(--main-color);    -webkit-border-radius: 7px 0;    -moz-border-radius: 7px 0;    border-radius: 7px 0;    color: #fff;    cursor: pointer;    -webkit-transition: all .3s;    -moz-transition: all .3s;    -o-transition: all .3s;    transition: all .3s;}.filters-close:hover {    background: #d32f2f}.plus {    background-image: url('/images/icons/plus.png');    -moz-background-size: 100% 100%;    -o-background-size: 100% 100%;    background-size: 100% 100%}.trash {    background-image: url('/images/icons/editor/btn_trash.png');    -moz-background-size: 100% 100%;    -o-background-size: 100% 100%;    background-size: 100% 100%}.edit,.up {    -moz-background-size: 100% 100%;    -o-background-size: 100% 100%;    background-repeat: no-repeat;    background-position: center}.edit {    background-image: url('/images/icons/editor/btn_edit.png');    -moz-background-size: 100% 100%;    -o-background-size: 100% 100%;    background-size: 100% 100%}.up {    background-image: url('/images/icons/editor/btn_up.png');    -moz-background-size: 100% 100%;    -o-background-size: 100% 100%;    background-size: 100% 100%}.down {    background-image: url('/images/icons/editor/btn_down.png');    background-repeat: no-repeat;    background-position: center;    -moz-background-size: 100% 100%;    -o-background-size: 100% 100%;    background-size: 100% 100%}.disabled {    color: #d8d8d8;    cursor: default !important}a.black {    color: #000 !important;    background: 0 0 !important;    font-size: 14px}a:focus.white {    color: #000}a:hover.white {    color: #2d2d2d}.marginTop5 {    margin-top: 5px}.marginTop10 {    margin-top: 10px}.marginBottom10 {    margin-bottom: 10px}.marginLeft5 {    margin-left: 5px}.border {    -webkit-transition: all 250ms ease-in-out;    -moz-transition: all 250ms ease-in-out;    -o-transition: all 250ms ease-in-out;    transition: all 250ms ease-in-out}.tile .getHiddenUrl,.tile .getHiddenUrl .removeHiddenLink {    -webkit-transition: all .3s ease-in-out;    -moz-transition: all .3s ease-in-out;    -o-transition: all .3s ease-in-out}.borderNoBottom {    border: 2px solid #ccc;    border-bottom: none}.box {    text-align: center}ul.list {    list-style: none;    padding-left: 0}.box.slim {    width: 230px;    overflow: hidden}.box.normal {    width: 420px;    left: 39%;    bottom: 0;    height: 92%}.box.wide {    width: auto;    height: auto}.box.extraWide {    width: 760px;    height: auto}.approveContainer {    overflow: scroll;    position: fixed;    left: 0;    right: 0;    top: 0;    bottom: 0;    background: url('/images/background_pattern.png') !important}.notApproved {    position: absolute;    z-index: 100;    top: 0;    left: 0;    width: 209px;    height: 158px !important;    background: url('/images/waiting.png') center no-repeat rgba(0, 0, 0, .11);    -moz-background-size: auto auto;    -o-background-size: auto auto;    background-size: auto auto}.tile .snackTile {    width: 100%;    height: 157px;    background-position: center;    background-repeat: no-repeat;    -moz-background-size: 40px;    -o-background-size: 40px;    background-size: 40px;    position: relative;}.snackCardHolder {    moz-transform: scale(0);    -webkit-transform: scale(0);    -o-transform: scale(0);    -ms-transform: scale(0);    -moz-transform: scale(0);    transform: scale(0);    -webkit-transition: all .3s ease-in-out;    -moz-transition: all .3s ease-in-out;    -o-transition: all .3s ease-in-out;    background: rgba(255, 255, 255, .34);    position: fixed;    z-index: 9971;    left: 0;    right: 0;    top: 0;    bottom: 0;    text-align: center}.snackCardHolder.open {    -moz-transform: scale(1);    -webkit-transform: scale(1);    -o-transform: scale(1);    -ms-transform: scale(1);    transform: scale(1)}.snackCardHolder:before {    content: "";    vertical-align: middle;    height: 100%;    display: inline-block;    margin-left: -.25em}.show-my-location.icon-location {    position: absolute;    z-index: 9947;    width: 50px;    height: 50px;    right: 60px;    background: #fff;    top: 7px;    -webkit-border-radius: 100%;    -moz-border-radius: 100%;    border-radius: 100%;    -webkit-box-shadow: 0 3px 10px -6px #000;    -moz-box-shadow: 0 3px 10px -6px #000;    box-shadow: 0 3px 10px -6px #000;    cursor: pointer;    text-align: center;    font-size: 28px;    color: #9c9c9c}.show-my-location.icon-location:before {    line-height: 50px}.show-my-location.icon-location.active {    color: #4caf50}.range-holder {    position: absolute;    width: 150px;    left: -50px;    top: 60px;    background: #fff;    padding: 3px;    -webkit-border-radius: 3px;    -moz-border-radius: 3px;    border-radius: 3px;    -webkit-box-shadow: 0 3px 10px -6px #000;    -moz-box-shadow: 0 3px 10px -6px #000;    box-shadow: 0 3px 10px -6px #000;    text-align: center}.range-holder:after {    content: "";    position: absolute;    border-width: 0 12px 8px;    border-color: rgba(255, 255, 255, 0) transparent #fff;    top: -8px;    right: 63px;    border-style: solid;    z-index: 10}.range-holder input[type=range] {    margin: 0;    padding: 0;    width: 100%;    display: inline-block}.range-text {    position: relative;    display: block;    text-align: center;    width: 100%;    font-size: 15px;    color: #656565}.tile .category {    height: 30px;    width: 30px;    display: block;    position: absolute;    -moz-background-size: contain;    -o-background-size: contain;    background-size: contain;    background-repeat: no-repeat;    top: 10px;    opacity: .8;    left: 10px;    z-index: 6}.tile .featured {    position: absolute;    z-index: 1;    text-align: center;    width: 100%;    top: 0;    left: 0;    background: #890043;    color: #fff;    font-size: .7em;    text-transform: uppercase;    letter-spacing: 2px}.tile .getHiddenUrl .hiddenUrl {    position: relative;    font-size: 14px;    height: auto;    width: 100%;    background: #f1f1f1;    word-break: break-all;    line-height: 20px;    color: #000;    border: 1px solid #e8e8e8;    padding: 5px;    margin: 2px 0 3px}.tile .getHiddenUrl:not(.active):hover {    -webkit-transform: scale(1.1, 1.1);    -moz-transform: scale(1.1, 1.1);    -ms-transform: scale(1.1, 1.1);    -o-transform: scale(1.1, 1.1);    transform: scale(1.1, 1.1)}.tile .getHiddenUrl.active {    width: 100%;    z-index: 100;    height: 100%;    -webkit-border-radius: 0;    -moz-border-radius: 0;    border-radius: 0;    left: 0;    padding-right: 0;    top: 0}.tile .getHiddenUrl {    overflow: hidden;    position: absolute;    top: -1px;    left: -1px;    width: 30px;    height: 30px;    line-height: 30px;    background: #fff;    -webkit-border-radius: 0 0 100%;    -moz-border-radius: 0 0 100%;    border-radius: 0 0 100%;    text-align: center;    z-index: 1000;    font-size: 1.1em;    padding-right: 4px;    -webkit-box-shadow: 0 0 9px -5px #000;    -moz-box-shadow: 0 0 9px -5px #000;    box-shadow: 0 0 9px -5px #000;    color: #000;    -webkit-transition: all .3s ease-in-out;    -moz-transition: all .3s ease-in-out;    -o-transition: all .3s ease-in-out;    transition: all .3s ease-in-out}.tile .isShared {    color: var(--main-color) !important}.tile .getHiddenUrl .hiddenLinkExplanation {    position: relative;    margin: 0;    font-size: 15px;    color: #000;    line-height: 16px}.tile .getHiddenUrl .removeHiddenLink {    position: relative;    margin: 0 auto;    font-size: 1.5em;    color: #c30000;    -webkit-transition: all .3s ease-in-out;    -moz-transition: all .3s ease-in-out;    -o-transition: all .3s ease-in-out;    transition: all .3s ease-in-out}.rotateCover,.tile .getHiddenUrl .addHiddenLink {    -webkit-transition: all .3s ease-in-out;    -moz-transition: all .3s ease-in-out}.tile .getHiddenUrl .removeHiddenLink:hover {    color: #980000}.tile .getHiddenUrl .customSelect {    width: 80%;    margin: 0 auto 10px}.tile .getHiddenUrl .addHiddenLink {    position: relative;    margin: 0 auto;    font-size: 1.5em;    color: #c1769c;    -o-transition: all .3s ease-in-out;    -webkit-transition: all .3s ease-in-out;    -moz-transition: all .3s ease-in-out;    transition: all .3s ease-in-out}.tile .getHiddenUrl .addHiddenLink:hover {    color: #ac688a}.tile .getHiddenUrl .removeHiddenLinkText {    font-size: 14px;    color: #000;    text-align: left}.customSelect,.elementTools,ul.pages,ul.pages li {    text-align: center}.tile .getHiddenUrl .timeLeftText {    color: #000;    margin: 0;    font-size: 14px}.tile .getHiddenUrl .timeLeft {    color: #000}ul.pages {    position: relative;    width: 100%;    height: 30px;    float: left;    list-style: none;    overflow: hidden;    overflow-x: auto}ul.pages li {    position: relative;    min-width: 25px;    margin-left: 5px;    width: auto;    height: 25px;    background: #fff;    color: #ccc;    border: 1px solid #ccc;    cursor: pointer;    line-height: 25px;    -webkit-border-radius: 5px;    -moz-border-radius: 5px;    border-radius: 5px;    display: inline-block}ul.pages li.active {    border-color: #860d4c;    color: #860d4c}div#snackActions > button {    float: right;    margin-top: 10px;    margin-right: 4px}div.editArea {    margin-top: 25px;    width: 100%;    border-right: none;    float: left;    height: auto;    background: url('/images/icons/editor/pattern_1.png') center;    position: relative;    overflow: visible;    transform: translate3d(0, 0, 0)}div#editorToolsWrapper {    position: relative;    float: right;    width: 768px;    height: 100%;    z-index: 9999}div#editorWrapper {    position: fixed;    top: 69px;    bottom: 33px;    width: 1024px;    margin-left: -512px;    left: 50%;    z-index: 9999;    background: 0 0;    max-width: 100%;    overflow: visible}#editorWrapper div#sClose {    top: 0 !important}.ui-sortable-placeholder {    background: rgba(240, 240, 240, .6) !important;    visibility: visible !important}.customSelect {    width: 200px;    position: relative;    height: 30px;    color: #fff;    border: 1px solid #656565;    background-color: #6f6f6f;    cursor: pointer;    z-index: 4;    float: right}.snackCat .customSelect {    margin-top: 3px}.customSelect span.icon-arrow_down {    position: absolute;    top: 0;    right: 0;    cursor: pointer;    z-index: 11;    background: #6f6f6f;    width: 26px;    height: 30px;    line-height: 35px}.customSelect:hover {    background-color: #656565}.customSelect .items {    max-height: 30px;    overflow: hidden;    background-color: #6f6f6f;    position: absolute;    width: 100%;    text-align: left;    height: 30px}.customSelect.open .items {    max-height: 151px;    overflow: auto;    -webkit-box-shadow: 0 4px 16px -5px #000;    -moz-box-shadow: 0 4px 16px -5px #000;    box-shadow: 0 4px 16px -5px #000;    height: auto;    padding-top: 30px}.customSelect.open .items div {    position: relative}.customSelect .items div {    min-height: 30px;    -webkit-box-shadow: 0 3px 10px -7px #000 inset;    -moz-box-shadow: 0 3px 10px -7px #000 inset;    box-shadow: 0 3px 10px -7px #000 inset;    background-color: #6f6f6f;    line-height: 30px;    padding-left: 8px;    position: absolute;    width: 100%;    left: 0;    top: 0;    white-space: nowrap;    height: auto;    overflow: hidden}.customSelect .items .selected {    position: absolute !important;    top: 0;    left: 0;    width: 100%;    z-index: 10}.customSelect.open {    z-index: 10}.openTools {    display: none}div#dialogHeader {    width: 768px;    background-color: #fff;    height: 67px;    position: fixed;    top: 0;    z-index: 9999;    left: 50%;    margin-left: -256px;    -webkit-box-shadow: -7px -1px 56px -24px #000, 7px -1px 56px -24px #000;    -moz-box-shadow: -7px -1px 56px -24px #000, 7px -1px 56px -24px #000;    box-shadow: -7px -1px 56px -24px #000, 7px -1px 56px -24px #000}#dialogHeader input {    left: 20px;    top: 20px;    position: absolute;    width: 626px;    display: block;    right: 122px;    background-color: #f2f2f2;    -webkit-border-radius: 2px;    -moz-border-radius: 2px;    border-radius: 2px;    border: 1px solid #eaeaea;    font-size: 16px;    text-align: center;    color: var(--main-color)}div.editorTools button {    width: 50px;    height: 50px}.editorTools {    width: 100%;    position: relative;    margin-bottom: 3px;    background: #414141;    border-bottom: 2px solid #595959;    top: 0;    z-index: 9999;    overflow: hidden;    padding-bottom: 30px;    padding-top: 115px}.snackIcon,.snackIcon.edit {    background-repeat: no-repeat}.snackIcon,.snackIcon.edit,.snackSelect {    background-position: center}.editTools {    position: fixed;    z-index: 10000; /* left: 50%; */    width: 768px;    left: 50%;    -webkit-box-shadow: -7px -1px 56px -24px #000, 7px -1px 56px -24px #000;    -moz-box-shadow: -7px -1px 56px -24px #000, 7px -1px 56px -24px #000;    box-shadow: -7px -1px 56px -24px #000, 7px -1px 56px -24px #000;    top: 69px;    -webkit-transform: translate3d(-256px, 0%, 0);    -moz-transform: translate3d(-256px, 0%, 0);    transform: translate3d(-256px, 0%, 0);}.editTools .editorElements,.editTools .snackCat {    margin: 0 !important;    display: flex !important;    flex-direction: row;}.channelSelect {    width: 100%;    position: relative;    float: left;    height: auto;    background: #fefefe;    border-bottom: 1px solid #595959;    max-height: 25px;    text-align: center;    overflow: hidden;    -webkit-transition: all .3s ease-in-out;    -moz-transition: all .3s ease-in-out;    -o-transition: all .3s ease-in-out;    transition: all .3s ease-in-out}.channelSelect span {    background: #fff;    width: 100%;    position: relative;    display: inline-block;    cursor: pointer;    color: #880042}.channelSelect.open {    max-height: 500px;    padding-top: 0}.channelSelect.open span {    padding-bottom: 6px}.channelSelect .close {    opacity: 0}.channelSelect.open .close {    opacity: 1;    position: relative;    bottom: 0;    right: 0;    float: left;    width: 100%;    height: 25px;    background: #d6d6d6;    text-align: center;    line-height: 16px;    color: #fff;    font-size: 35px;    cursor: pointer;    -webkit-transition: all .3s ease-in-out;    -moz-transition: all .3s ease-in-out;    -o-transition: all .3s ease-in-out;    transition: all .3s ease-in-out}.channelSelect.open .close:hover {    background: #d32f2f}.channelSelect .item {    position: relative;    float: left;    width: 100%;    height: 25px;    cursor: pointer}.channelSelect .item:hover {    background: #f3f3f3}.editorOverlay {    position: fixed;    top: 0;    left: 0;    right: 0;    bottom: 0;    background: url('/images/background_pattern.png') !important}.editorTools .editorElements {    width: 100%;    float: right;    background-color: #a06986;    margin-bottom: 5px;    display: none}.editorElements span.infoLine {    display: none}.editorTools .editorElements {    display: flex;    flex-direction: column;}.editorElements__container {    display: flex;    flex-direction: row;    width: 100%;}.editor-element {    width: 25%;    display: inline-block;    margin: 0 !important;    border: none;    position: relative;    background-color: var(--main-color) !important;    -moz-background-size: auto 40px !important;    -o-background-size: auto 40px !important;    background-size: auto 40px !important;    height: 80px;    cursor: pointer;    background-repeat: no-repeat !important;    background-position: center !important}.hint {    display: none !important;    position: absolute !important;    left: 50%;    width: auto !important;    top: 92px;    z-index: 10;    text-align: center;    background-color: var(--shaded-color) !important;    font-size: 16px !important;    color: #fff !important;    height: auto !important;    -webkit-border-radius: 3px;    -moz-border-radius: 3px;    border-radius: 3px;    -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, .25);    -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, .25);    box-shadow: 0 1px 4px rgba(0, 0, 0, .25);    transform: translate3d(-50%, 0, 0);    padding: 0 7px;}.hint:before {    position: absolute;    content: "";    top: -10px;    width: 0;    left: 50%;    margin-left: -10px;    height: 0;    border-style: solid;    border-width: 0 10px 10px 10px;    border-color: transparent transparent var(--shaded-color) transparent;}.editor-element.textbox {    background-image: url('/images/icons/editor/textbox.png');    overflow: visible}.editor-element.mc {    background-image: url('/images/icons/editor/mc.png')}.editor-element.img {    background-image: url('/images/icons/editor/image.png')}.editor-element.mc-img {    background-image: url('/images/icons/editor/mc_image.png')}.editor-element.ai__assistent__editor__button {    background-image: url('/images/book_128.png')}.editor-element.poll {    background-image: url('/images/icons/editor/poll.png')}.editor-element.active {    background-color: var(--shaded-color) !important;}.snackCat {    width: 50%;    float: left;    padding: 10px;    background-color: #a06986;    margin-bottom: 5px;    height: 80px;    display: none}.snackCat select {    width: 250px;    float: right}.tooltip {    width: auto;    min-height: 30px;    -webkit-border-radius: 4px;    -moz-border-radius: 4px;    border-radius: 4px;    position: absolute;    z-index: 9999;    background-color: #c31b09;    border: 1px solid #ba1a09;    -webkit-box-shadow: 0 2px 15px -5px #000;    -moz-box-shadow: 0 2px 15px -5px #000;    box-shadow: 0 2px 15px -5px #000;    padding: 4px;    text-align: left;    top: 13px;    line-height: initial;    cursor: pointer}.tooltip:after {    content: "";    position: absolute;    width: 0;    height: 0;    border-style: solid;    border-width: 15px 15px 0;    top: 100%;    border-color: #c31b09 transparent transparent;    left: 3px}.tooltip.visible {    display: block !important}.previewPic,.previewPic img {    position: relative;    margin: 0 auto;    height: auto}.tooltipText {    color: #fff;    text-align: left}.previewPic {    width: 100%;    opacity: 1;    z-index: 151;    -webkit-box-shadow: 0 19px 29px -28px #3f3f3f;    -moz-box-shadow: 0 19px 29px -28px #3f3f3f;    box-shadow: 0 19px 29px -28px #3f3f3f;    cursor: pointer;    overflow: hidden;    background-image: url('/images/icons/editor/pattern_2.png');    border: 2px dashed #a0a0a0;    background-position: center;    max-width: 600px;    max-height: 450px;    -moz-background-size: 50px;    -o-background-size: 50px;    background-size: 50px}.previewPic img {    display: block;    width: 100%;    background: url('/images/icons/editor/image.png') center no-repeat}.previewPic label {    width: 100%;    height: 100%;    z-index: 2;    cursor: pointer;    background: 0 0;    position: absolute;    top: 0;    left: 0}.rotateCover,.saveRotateCover {    z-index: 1000;    -webkit-border-radius: 100%;    -moz-border-radius: 100%;    border-radius: 100%;    width: 50px;    height: 50px;    background: #fff;    bottom: 5px;    font-size: 2em;    -o-transition: all .3s ease-in-out;    position: absolute;    text-align: center}.previewPic:hover label {    -webkit-box-shadow: 0 0 0 6px rgba(244, 244, 244, 1);    -moz-box-shadow: 0 0 0 6px rgba(244, 244, 244, 1);    box-shadow: 0 0 0 6px rgba(244, 244, 244, 1)}.previewPic input {    display: none}.rotateCover {    box-shadow: 0 0 13px -3px #000;    -moz-box-shadow: 0 0 13px -3px #000;    -webkit-box-shadow: 0 0 13px -3px #000;    right: 5px;    line-height: 59px;    -webkit-transition: all .3s ease-in-out;    -moz-transition: all .3s ease-in-out;    -o-transition: all .3s ease-in-out;    transition: all .3s ease-in-out}.saveRotateCover,img.smiley {    -webkit-transition: all .3s ease-in-out}.rotateCover:hover {    -moz-transform: rotate(180deg);    -webkit-transform: rotate(180deg);    -o-transform: rotate(180deg);    -ms-transform: rotate(180deg);    transform: rotate(180deg)}.saveRotateCover {    box-shadow: 0 0 13px -3px #000;    -moz-box-shadow: 0 0 13px -3px #000;    -webkit-box-shadow: 0 0 13px -3px #000;    right: 60px;    line-height: 59px;    color: green;    -moz-transition: all .3s ease-in-out;    -webkit-transition: all .3s ease-in-out;    -o-transition: all .3s ease-in-out;    transition: all .3s ease-in-out}img.smiley,input.snackFilter {    -moz-transition: all .3s ease-in-out;    -o-transition: all .3s ease-in-out}.mcAnswer .col-md-10 {    line-height: 23px}.saveRotateCover:hover {    box-shadow: 0 9px 10px -1px #000;    -moz-box-shadow: 0 9px 10px -1px #000;    -webkit-box-shadow: 0 9px 10px -1px #000}canvas#previewPicCan {    position: absolute;    top: 0;    left: 0;    width: 600px;    cursor: move;    height: 450px;    z-index: 0}.coverOverlay {    width: 100%;    height: 100%;    position: absolute;    left: 0;    top: 0;    background: url('/images/coverOverlay.png') top left no-repeat;    opacity: .5;    -moz-background-size: 600px 450px;    -o-background-size: 600px 450px;    background-size: 600px 450px;    z-index: 30}div#toolArea {    width: 100%;    height: 85%;    overflow: hidden;    background-color: #fff;    overflow-y: auto;    margin-bottom: 25px}div#toolArea textarea {    background: #e0e0e0}.element-image,.element-mc,.element-mc_image,.element-meta,.element-textbox {    background-color: #fafafa;    margin-top: 10px;    cursor: pointer}.element-image {    padding: 0;    width: 203px}.element-selected-true {    box-shadow: 0 0 0 2px green}.contentContainer.editor {    top: 77px}.contentContainer.editor div#editArea {    top: 82px}.contentContainer.editor div#dialogArea {    top: 77px}.editor-headline {    margin-bottom: 5px;    margin-left: 1px;    color: #fff}.editor-good-bad-box {    height: 120px;    border: 1px solid #d3d3d3;    -webkit-border-radius: 3px;    -moz-border-radius: 3px;    border-radius: 3px;    position: relative;    float: left;    width: 100%;    margin: 0 auto}.editor-bad-box,.editor-good-box {    width: 50%;    padding: 7px;    overflow-y: auto;    height: 100%}.editor-good-box {    float: left;    border-right: 1px solid #d3d3d3;    background-color: #f3fffd}.editor-bad-box {    background-color: #fff2f2}.cropArea,.cropAreaSmall {    overflow: hidden;    margin-top: 5px}.cropArea {    padding: 5px;    width: 100%;    display: inline-block;    text-align: center}div.cropArea.imageUploadBtn {    width: 100%;    min-height: 220px;    border: 2px dashed #fff;    background: url('/images/icons/editor/pattern_2.png') center;    cursor: pointer;    position: relative}.cropArea.imageUploadBtn label {    position: absolute;    top: 0;    left: 0;    right: 0;    width: 100%;    height: 100%;    cursor: pointer;    font-size: 24px;    color: #fff;    font-weight: 600;    line-height: 220px;    z-index: 7}.cropArea.imageUploadBtn label:hover {    background: rgba(74, 74, 74, .47)}img.croppedImage {    width: auto;    position: relative;    max-width: 100%}.cropAreaSmall {    background: #e4e4e4;    width: 500px;    height: 300px}.sourceImageArea {    margin-top: 5px;    text-align: center}.sourceImageArea img {    border: 1px solid #d3d3d3;    -webkit-border-radius: 3px;    -moz-border-radius: 3px;    border-radius: 3px;    padding: 5px}#commentArea > div {    height: 34px;    margin-bottom: 10px;    padding: 5px;    border: 1px solid #d3d3d3;    -webkit-border-radius: 3px;    -moz-border-radius: 3px;    border-radius: 3px}#commentArea > div > input {    height: 22px;    width: 98%;    border: 1px solid #d3d3d3}#commentArea > div > span.glyphicon {    padding-top: 3px;    float: right;    cursor: pointer}.editor-buttons {    position: relative;    width: 100%;    margin-left: 0;    float: left;    border-top: 1px solid #fff;    background-color: #404040;    z-index: 9978;    transform: translate3d(0, 0, 0)}.editor-buttons button {    width: 50%;    background-color: transparent;    border: none;    border-right: 1px solid #fff;    height: 30px;    font-size: 18px;    color: #fff;    float: left;    cursor: pointer;    transform: translate3d(0, 0, 0)}.editor-buttons button:hover {    background-color: rgba(255, 255, 255, .11)}.editor-checkboxes {    width: 100%;    float: left;    margin-top: 20px;    margin-bottom: 23px}.imgBox {    border: 1px solid #d3d3d3;    -webkit-border-radius: 2px;    -moz-border-radius: 2px;    border-radius: 2px;    margin-left: auto;    margin-right: auto;    display: block;    margin-top: 10px;    cursor: pointer}span.smiley {    color: #a0a0a0;    position: relative;    display: inline;    padding-left: 36px}.emoji-type_container {    display: flex;    align-items: center;    position: relative;    align-self: center;    text-align: center;    height: 34px;}.emoji-type_container img.smiley {    display: flex;    vertical-align: middle;    width: 21px;    position: relative;    height: 21px;}img.smiley {    width: 21px;    transition: all .3s ease-in-out}.smiley-chooser {    position: relative;    cursor: pointer;    flex: 1;}ul.smiley-container {    position: relative !important;    list-style: none !important;    background-color: #fff;    top: 0;    right: 0;    margin: 0 !important;    height: 195px !important;    line-height: 1;    width: 100% !important;    z-index: 9985;    overflow-y: auto;    border: none;    padding: 0 !important;}.smiley-chooser.open-smiley-box:after,.smiley-chooser.open-smiley-box:before {    position: absolute;    top: 50%;    border-style: solid;    border-width: 12px 0 12px 13px;    display: block;    margin-top: -10px;    content: ""}.smiley-chooser.open-smiley-box:before {    right: 36px;    border-color: transparent transparent transparent rgba(174, 174, 174, 1);    z-index: 299}.smiley-chooser.open-smiley-box:after {    right: 37px;    border-color: transparent transparent transparent #d7d7d7;    z-index: 300}.skin-selector img, .smiley-chooser li {    /* float: left; */    width: 21px;    height: 21px;    position: relative;    margin: 3px;    text-align: center;    font-size: 31px;    color: #a0a0a0;    display: inline-block;    user-select: none;}.ic,input.snackFilter {    position: absolute;    height: 100%;    bottom: 0}.open-smiley-container {    opacity: 1 !important;    display: block !important}.ic {    width: 50px;    right: 0;    top: 0;    z-index: 440;    /* background: url('/images/icons/editor/smiley.png') center no-repeat; */    -moz-background-size: 20px;    -o-background-size: 20px;    /* background-size: 20px; */    text-align: center;    font-size: 16px;    display: flex;    justify-content: center;    align-items: center;}.ic:hover {    background-color: #dfdfdf;}input.snackFilter {    width: 40%;    padding: 3px;    line-height: 30px;    border: 0;    font-size: 18px;    color: #fff;    background: #000;    -webkit-transition: all .3s ease-in-out;    -moz-transition: all .3s ease-in-out;    -o-transition: all .3s ease-in-out;    transition: all .3s ease-in-out;    outline: 0}input.snackFilter:focus {    -webkit-box-shadow: 0 0 33px -15px #dadada inset !important;    -moz-box-shadow: 0 0 33px -15px #dadada inset !important;    box-shadow: 0 0 33px -15px #dadada inset !important}.bubble {    position: relative;    width: 94%;    height: auto;    padding: 6px;    min-height: 30px;    background: #d3d3d5;    -webkit-border-radius: 8px;    -moz-border-radius: 8px;    border-radius: 8px;    line-height: 37px}.wrongBox {    color: red !important}.wrongBox textarea::-webkit-input-placeholder {    color: red !important}.wrongBox textarea:-moz-placeholder {    color: red !important}.wrongBox textarea::-moz-placeholder {    color: red !important}.wrongBox textarea:-ms-input-placeholder {    color: red !important}.rightBox {    color: green !important}.rightBox textarea::-webkit-input-placeholder {    color: green !important}.rightBox textarea:-moz-placeholder {    color: green !important}.rightBox textarea::-moz-placeholder {    color: green !important}.rightBox textarea:-ms-input-placeholder {    color: green !important}.bubbleR.wrong {    background: #e75b5b !important}.bubbleR.wrong:after {    border-color: transparent transparent transparent #e75b5b}.bubbleR.right {    background: #83f48b !important}.bubbleR.right:after {    border-color: transparent transparent transparent #83f48b}.bubbleRight:after {    content: "";    position: absolute;    top: 41%;    right: -14px;    border-style: solid;    border-width: 15px 0 15px 15px;    display: block;    width: 0;    z-index: 0;    border-color: transparent rgba(92, 184, 92, 0)}.bubble input,.bubbleFb,.bubbleLogoImg,.bubbleRight {    position: relative}.bubbleRight {    text-align: center;    line-height: 38px;    font-size: 18px;    display: block;    color: #fff;    background: #d3d3d5;    width: 94%;    float: right;    height: auto;    padding: 6px;    margin-bottom: 18px;    min-height: 40px;    margin-top: 13px;    -webkit-border-radius: 8px;    -moz-border-radius: 8px;    border-radius: 8px;    cursor: pointer}.bubbleFb,.bubbleGplus {    height: 43px !important;    padding: 0;    text-align: center;    cursor: pointer}.bubbleRight.blue {    background: #9fd9e1 !important}.bubbleRight.green {    background-color: #94cf95}.bubbleLogoImg {    height: 20px;    top: 5px}.bubbleGplus {    background-image: url('/images/icons/google.png');    width: 100%;    -webkit-box-shadow: 0 0;    -moz-box-shadow: 0 0;    box-shadow: 0 0;    -moz-border-radius: 6px;    display: block;    float: left}.bubbleTwitter,.mc-image label,.stats {    -moz-border-radius: 0}.bubbleGplus:after {    border-color: transparent !important}.bubbleTwitter {    text-align: center;    background-color: #4099ff !important;    cursor: pointer;    width: 33%;    float: left;    -webkit-border-radius: 0;    -moz-border-radius: 0;    border-radius: 0;    border-left: 5px solid #fff;    border-right: 5px solid #fff}.bubbleFb:after,.bubbleTwitter:after {    border-color: transparent !important}.bubbleTwitter:hover {    background-color: #59a6ff !important}.bubbleFb {    -webkit-box-shadow: 0 0;    -moz-box-shadow: 0 0;    box-shadow: 0 0;    width: 100%;    display: block;    margin: 0;    -webkit-border-radius: 5px;    -moz-border-radius: 5px;    border-radius: 5px;    background-image: url('/images/facebook.png');    position: relative}.login-logo {    width: 250px}.loginbox,.loginbox .logo {    position: relative;    width: 60%}.loginbox {    margin: 0 auto;    color: var(--main-color);    background: #fff;    padding: 30px;    -webkit-border-radius: 8px;    -moz-border-radius: 8px;    position: absolute;    border-radius: 8px;    left: 50%;    top: 50%;    transform: translate3d(-50%, -50%, 0);    width: 540px;    max-width: 100%;}.clearfix:after {    content: " ";    display: block;    height: 0;    clear: both}.addRemoveMcImg:after,.header:after {    content: ""}.loginbox a {    width: 100%;    text-align: center}.loginbox .logo {    display: block;    margin: 0 auto 50px;    height: auto;    left: inherit;    float: none}.login_pic {    position: fixed;    left: 0;    top: 0;    right: 0;    background: url('/images/login_pic.jpg') no-repeat;    bottom: 0;    -moz-background-size: cover;    -o-background-size: cover;    background-size: cover}.loginbox .btn,.classroom-block .btn,.classroom-prompt_modalwrapper .btn,.report__register__container .btn,.report__list .btn {    position: relative;    margin: 4px auto;    width: 97%;    padding: 7px;    -webkit-border-radius: 4px;    -moz-border-radius: 4px;    border-radius: 4px;    border: 1px solid #e9e9e9;    background: #e0e0e0;    font-size: 18px;    color: #5e6164;    text-align: center;    font-family: 'Titillium Web', Helvetica;    clear: both;}.btn input {    width: 100%;    background: rgba(194, 196, 196, 0);    font-size: 18px;    border: none;    text-align: left}.loginbox .link {    color: var(--main-color);    position: relative;    display: block;    text-align: center;    height: auto;    width: auto;    float: right;    margin: 0 auto}.loginData,.loginOr,.socialLogin {    padding: 7px;    float: left}.loginData {    width: 100%}.loginOr {    width: 100%;    text-align: center;    font-size: 21px}.socialLogin {    width: 100%;    text-align: center}.hdn {    display: none}.inputError-true {    color: #c00 !important}.profileHeader {    position: fixed;    right: 60px;    z-index: 5000;    text-align: center;    left: 60px;    background: #f9fcff;    -webkit-box-shadow: 0 0 14px -7px #000;    -moz-box-shadow: 0 0 14px -7px #000;    box-shadow: 0 0 14px -7px #000}.profile-content,.snackIcon,img.profilePic {    position: relative;    float: left}img.profilePic {    background: #fff;    -webkit-border-radius: 0 0 37px;    -moz-border-radius: 0 0 37px;    border-radius: 0 0 37px;    height: 60px}.tools div {    width: 45px;    display: inline-block;    margin-left: 5px;    cursor: pointer}.user-block {    height: auto;    position: relative;    display: block;    vertical-align: middle;    text-align: center;    clear: both;    padding: 15px 0}.user-data {    position: relative;    display: block;    width: 100%;    vertical-align: middle;    height: auto;    padding-left: 10px}.user-data .overlay {    -webkit-transition: .2s all;    -o-transition: .2s all;    -moz-transition: .2s all;    transition: .2s all;    opacity: 0;    visibility: hidden}.save {    color: #fff;    position: relative;    width: 220px;    display: inline-block;    padding: 6px;    text-align: center;    height: 50px;    line-height: 36px;    z-index: 222;    visibility: hidden;    opacity: 0;    -webkit-transition-duration: .3s;    -moz-transition-duration: .3s;    -o-transition-duration: .3s;    transition-duration: .3s;    -webkit-transition-property: opacity, visibility;    -o-transition-property: opacity, visibility;    -moz-transition-property: opacity, visibility;    transition-property: opacity, visibility;    margin-top: 32px;    margin-bottom: 20px;    border-radius: 4px;}.user-data .border {    position: absolute;    left: 50%;    bottom: 0;    height: 1px;    width: 0;    background: var(--main-color);    background: -moz-linear-gradient(left, #f4f4f4 0, var(--main-color) 51%, #f4f4f4 100%);    background: -webkit-linear-gradient(left, #f4f4f4 0, var(--main-color) 51%, #f4f4f4 100%);    background: -webkit-gradient(linear, left top, right top, from(#f4f4f4), color-stop(51%, var(--main-color)), to(#f4f4f4));    background: -o-linear-gradient(left, #f4f4f4 0, var(--main-color) 51%, #f4f4f4 100%);    background: linear-gradient(to right, #f4f4f4 0, var(--main-color) 51%, #f4f4f4 100%);    opacity: 0}.dashboard .user-data .user-name span {    position: relative;    display: inline-block;    width: 80% !important}.changed .overlay {    background: rgba(155, 155, 155, .6);    opacity: 1;    visibility: visible}.user-data .tooltip {    top: auto;    display: inline-block;    left: 10%;    bottom: -webkit-calc(100% + 5px);    bottom: -moz-calc(100% + 5px);    bottom: calc(100% + 5px)}.save-button {    position: relative;    display: inline-block;    width: auto;    padding: 4px;    background: #0f0;    display: none;    -webkit-transition: .3s all;    -o-transition: .3s all;    -moz-transition: .3s all;    transition: .3s all}.user-data input:focus:valid ~ .save-button {    display: inline-block}.user-block:before {    vertical-align: middle;    height: 100%;    display: inline-block;    margin-left: -.25em;    position: relative;    top: 0}.user-name {    text-align: center;    color: var(--main-color);    font-weight: 600;    margin: 11px 0;}.user-data .input {    border: none;    background: 0 0;    color: #323232;    font-weight: 600;    text-align: left;    font-size: 13pt;    padding: 7px 0 0 0;    width: 80%;    -moz-background-size: 22px;    -o-background-size: 22px;    position: relative;    -webkit-transition: .3s all;    -o-transition: .3s all;    -moz-transition: .3s all;    transition: .3s all;    display: inline-block}.user-points {    position: relative;    width: 100%;    text-align: center;    height: 30px;    line-height: 30px;    font-weight: 400;    margin: 6px 0}.user-points:before {    content: "";    background: url('/images/golden_coin_small.png?') no-repeat center;    width: 30px;    height: 30px;    display: block;    -moz-background-size: 100%;    -o-background-size: 100%;    background-size: 100%;    position: relative;    left: 0;    top: 0;    display: inline-block;    margin: 0 10px}.user-points > span {    top: -9px;    position: relative;    color: var(--main-color);    font-weight: 600;    font-size: 15px;    margin: 0 2px;}.user-date {    width: 100%;    text-align: center;    font-size: 12px;    display: block;    position: relative}.user-stats {    position: relative;    margin: 0 auto;    width: 100%;    max-width: 400px;    display: block;    text-align: center;    font-size: 10pt;    padding: 16px 0}.stat {    width: auto;    display: inline-block;    text-align: center;    line-height: 25px !important;    font-weight: 600;    color: var(--main-color) !important;    height: 100% !important;    font-size: inherit}.user-stats .stat {    -o-text-overflow: initial !important;    text-overflow: initial !important}.data .snackIcon.icon-share {    width: 100%;    color: #000}.data .snackIcon.icon-share:before {    top: 4px;    position: relative}.stat span:nth-of-type(1) {    color: var(--main-color) !important;    font-weight: 600;    margin: 0 2px;}.stat span:nth-of-type(2) {    margin: 0 2px}.stat span {    display: inline-block;    width: 100%}.user-pic:after {    content: "";    opacity: 0;    -webkit-transition: all .3s;    -o-transition: all .3s;    -moz-transition: all .3s;    transition: all .3s;    -moz-background-size: 35px;    -o-background-size: 35px;    background-size: 35px;    position: absolute;    display: block;    width: 100%;    height: 100%;    left: 0;    top: 0;    z-index: 5;    background-repeat: no-repeat;    background-position: center}.user-pic.editable:after {    content: "";    display: none}.userInfo {    width: 100%;    color: #000;    z-index: 9000;    height: auto;    font-size: 13px;    padding-right: 40px;    float: left}.userInfo span {    width: auto;    float: left}.userInfo div {    cursor: pointer}.username {    color: #373737;    font-size: 16px;    font-weight: 400;    float: none;    text-align: center}.profile-content {    margin-top: 55px;    padding: 5px;    width: 90%;    margin-left: 35px;    left: 0;    height: 100%}.snackIcon {    cursor: pointer;    z-index: 2;    height: 33px;    -webkit-transition: all .1s ease-in-out;    -moz-transition: all .1s ease-in-out;    -o-transition: all .1s ease-in-out;    transition: all .1s ease-in-out;    -moz-background-size: auto 100%;    -o-background-size: auto 100%;    background-size: auto 100%;    border: none;    background-color: #f5f5f5;    position: relative;    display: inline-block;    font-size: 20px;    float: none;    width: auto !important;    border: none;    box-shadow: none;    flex-grow: 1;}.snackTools .snackIcon:before {    line-height: 33px}.snackIcon.edit {    background-image: url('/images/icons/edit.png');    -moz-background-size: 40px 40px;    -o-background-size: 40px 40px;    background-size: 40px 40px}.snackIcon.delete {    background-image: url('/images/icons/trash.png')}.snackIcon.icon-share.shared {    color: #8bc34a}.snack:hover .snackIcon,.snack:hover .snackSelect {    opacity: 1 !important}.snackSelect {    opacity: 0;    position: absolute;    width: 30px;    height: 30px;    top: 5px;    left: 5px;    z-index: 10000;    -webkit-border-radius: 100%;    -moz-border-radius: 100%;    border-radius: 100%;    background-image: url('/images/icons/selection.png');    -moz-background-size: 100%;    -o-background-size: 100%;    background-size: 100%;    -webkit-transition: all .1s ease-in-out;    -moz-transition: all .1s ease-in-out;    -o-transition: all .1s ease-in-out;    transition: all .1s ease-in-out}.snackSelect.selected {    background-image: url('/images/icons/selected.png') !important;    opacity: 1 !important}::-webkit-scrollbar-track {    -webkit-box-shadow: inset 0 0 2px rgba(0, 0, 0, .07);    background-color: #f5f5f5}::-webkit-scrollbar {    width: 5px;    background-color: #f5f5f5;    height: 5px}::-webkit-scrollbar-thumb {    background-color: rgba(0, 0, 0, .34);    -webkit-border-radius: 9px;    border-radius: 9px}::-webkit-scrollbar-thumb:hover {    background-color: rgba(0, 0, 0, .64)}div#profileHeader {    left: 0;    position: fixed;    background: #000;    right: 0;    color: #fff;    z-index: 900}.element-selected-true.mcImageBubble {    padding: 6px;    border-color: #52af39}.mc-answer-line {    width: 100% !important;    position: relative;    float: left;    text-align: right;    margin: 0 !important;    display: flex;    gap: 10px;}.addFromHeader,.categories,.mc-image,.notificationButton,div#footer,div#footer-content {    text-align: center}.removeAnswer, .classroom-prompt_remove-snack {    -moz-background-size: 100% auto;    -o-background-size: 100% auto;    background-size: 100% auto;    -webkit-transition: all 250ms ease-in-out;    -moz-transition: all 250ms ease-in-out;    -o-transition: all 250ms ease-in-out;    transition: all 250ms ease-in-out;    top: 9px;    display: inline-block;    position: absolute;    z-index: 1111;    left: -12px;    bottom: -12px;    width: 25px;    height: 25px;    text-align: center;    line-height: 17px;    top: auto;    background: rgba(255, 255, 255, .78);    -webkit-border-radius: 100%;    -moz-border-radius: 100%;    border-radius: 100%;    border: 2px solid #fff;    font-weight: 600;    -webkit-box-shadow: 0 0 7px -3px rgba(0, 0, 0, .61);    -moz-box-shadow: 0 0 7px -3px rgba(0, 0, 0, .61);    box-shadow: 0 0 7px -3px rgba(0, 0, 0, .61);    -webkit-transform-origin: center;    -moz-transform-origin: center;    -ms-transform-origin: center;    -o-transform-origin: center;    transform-origin: center}.addAnswer:hover, .removeAnswer:hover, .classroom-prompt_remove-snack:hover {    -moz-transform: rotate(-90deg) !important;    -webkit-transform: rotate(-90deg) !important;    -o-transform: rotate(-90deg) !important;    -ms-transform: rotate(-90deg) !important;    transform: rotate(-90deg) !important}.removeAnswer:before, .classroom-prompt_remove-snack:before {    content: "×";    position: relative;    display: inline-block;    color: #404040;    font-size: 21px}.end {    position: relative;    width: 100%;    height: 60px;    background: 0 0;    line-height: 60px;    color: #b9b9b9;    bottom: 0;    left: 0}div#footer {    position: fixed;    background: #373737;    height: 33px;    width: 100%;    bottom: 0;    left: 0;    line-height: 40px;    z-index: 9999}div#footer .social-like {    position: relative;    display: block;    text-align: center;    line-height: 32px;    float: right}.social-like a,.social-like span {    display: inline-block;    vertical-align: middle;    margin: 0 6px;    line-height: 0}.mc-image,.mc-image img {    height: 125px;    cursor: pointer}div#footer-content {    position: relative;    margin: 0 auto;    width: 100%;    color: #d9d9d9 !important;    padding-left: 43px;    padding-right: 50px}.mc-image {    float: right !important;    width: 100px;    background: url('/images/icons/editor/image.png') center no-repeat #e8e9e8;    -moz-background-size: 80% auto;    -o-background-size: 80% auto;    background-size: 80% auto;    position: relative}.mc-image img {    width: 125px}.mc-image input {    display: none}.mc-image label {    width: 98%;    -webkit-border-radius: 0;    -moz-border-radius: 0;    border-radius: 0}.mc-image:hover {    background: url('/images/icons/editor/image.png') center no-repeat #444 !important;    -moz-background-size: 80% auto !important;    -o-background-size: 80% auto !important;    background-size: 80% auto !important}.mc-image-container img {    width: 100px;    background: #ebebeb;    position: relative;    -webkit-border-radius: 0 !important;    -moz-border-radius: 0 !important;    border-radius: 0 !important}.addRemoveMcImg {    width: 30px;    height: 30px;    display: block;    position: absolute;    cursor: pointer;    -webkit-border-radius: 100%;    -moz-border-radius: 100%;    border-radius: 100%;    bottom: -4px;    right: -14px;    z-index: 1000}.addRemoveMcImg:after {    position: relative;    width: 30px;    float: left;    height: 30px;    -moz-background-size: 30px;    -o-background-size: 30px;    background-size: 30px;    background-image: url('/images/icons/editor/plus.png');    background-repeat: no-repeat;    background-color: transparent;    background-position: center;    -webkit-transition: all 250ms ease-in-out;    -moz-transition: all 250ms ease-in-out;    -o-transition: all 250ms ease-in-out;    transition: all 250ms ease-in-out}.contentContainer,.logo {    -webkit-transition: all 250ms ease-in-out;    -moz-transition: all 250ms ease-in-out;    -o-transition: all 250ms ease-in-out}.addRemoveMcImg:hover:after {    -webkit-transform-origin: 50% 50%;    -moz-transform-origin: 50% 50%;    -ms-transform-origin: 50% 50%;    -o-transform-origin: 50% 50%;    transform-origin: 50% 50%;    -moz-transform: rotate(90deg);    -webkit-transform: rotate(90deg);    -o-transform: rotate(90deg);    -ms-transform: rotate(90deg);    transform: rotate(90deg)}.addRemoveMcImg.rem:after {    behavior: url(-ms-transform.htc);    -moz-transform: rotate(45deg);    -webkit-transform: rotate(45deg);    -o-transform: rotate(45deg);    -ms-transform: rotate(45deg)}.imageBubble {    -webkit-border-radius: 12px;    -moz-border-radius: 12px;    border-radius: 12px}.mc-image-container {    height: 99px;    width: 200px;    position: relative}.mc-overlay {    width: 89px;    top: 13px;    left: 8px;    height: 81px;    z-index: 5;    position: absolute;    -moz-background-size: 100% 100% !important;    -o-background-size: 100% 100% !important;    background-size: 100% 100% !important}.mc-image-element {    position: relative;    float: left;    width: 100px;    height: 100px;    cursor: pointer}.mc-img-right {    background: url('/images/right.png') center no-repeat}.mc-img-wrong {    background-image: url('/images/wrong.png');    background-position: center;    background-repeat: no-repeat}.modal .cropArea {    height: 324px}.sortBarIos {    display: none}.header {    width: 100%;    position: fixed;    left: 0;    height: auto;    z-index: 9997;    top: 0;    background: #fff;    background-repeat-x: repeat;    display: block !important;    overflow: visible !important;    text-align: center;    transform: translate3d(0, 0, 0)}.header.slim {    height: 67px}.snackPlayerActive .secondary-background {    display: none}.snackPlayerActive .header {    height: 67px}.header:after {    position: absolute;    bottom: -14px;    height: 14px;    width: 100%;    left: 0}.logo,.searchbar {    width: auto;    position: relative;    float: left}html.snackPlayerActive {    overflow: hidden !important}.snackPlayerActive .logo {    left: 50% !important;    margin-left: -472px;}.snackPlayerActive .button-holder {    display: none}.snackPlayerActive .menu {    display: none}.snackPlayerActive .menu-secondary {    display: none}.snackPlayerActive div#learningSnacksSearchbar {    display: none !important}.logo {    height: 55px;    -moz-background-size: auto 100%;    -o-background-size: auto 100%;    outline: 0;    border: none;    background: #fff;    -webkit-transition: all 250ms ease-in-out;    -moz-transition: all 250ms ease-in-out;    -o-transition: all 250ms ease-in-out;    transition: all 250ms ease-in-out;    position: absolute;    left: 43px;    top: 32px;    transform: translate3d(0, -50%, 0);    display: block;}.logo img {    height: 100%}.searchbar input#filter_input {    width: 235px;    -webkit-border-radius: 8px 0;    -moz-border-radius: 8px 0;    border-radius: 8px 0;    border: 1px solid #e0e0e0;    background: url('/images/icons/lupe.png') 4px no-repeat #f4f4f4;    height: 34px;    padding-left: 33px;    font-weight: 400;    font-size: 16px;    -moz-background-size: 24px;    -o-background-size: 24px;    background-size: 24px;    color: #777}.addFromHeader,.loginBtn {    width: 35px;    height: 35px;    -webkit-border-radius: 8px 0;    -moz-border-radius: 8px 0;    cursor: pointer}.button-holder {    position: absolute;    width: auto;    top: 14px;    right: 50px}.addFromHeader {    position: relative;    background: var(--main-color);    color: #fff;    -webkit-border-radius: 100%;    -moz-border-radius: 100%;    border-radius: 100%;    line-height: 28px;    font-size: 30px;    font-weight: lighter;    float: left;    margin: 0 8px;}.mobileIcon.icon-lupe {    height: 35px;    width: 35px;    background-color: var(--main-color);    top: 0;    color: #fff;    font-size: 18px;    z-index: 5;    text-align: center;    cursor: pointer;    display: inline-block;    -webkit-transition: all 250ms ease-in-out;    -moz-transition: all 250ms ease-in-out;    -o-transition: all 250ms ease-in-out;    transition: all 250ms ease-in-out;    -webkit-transform: translate3d(0, 0, 0);    -moz-transform: translate3d(0, 0, 0);    transform: translate3d(0, 0, 0);    position: relative;    float: left;    -webkit-border-radius: 100%;    -moz-border-radius: 100%;    border-radius: 100%;    margin: 0 8px;}.mobileIcon.icon-lupe:before {    line-height: 35px}.snackPlayerActive .addFromHeader,.snackPlayerActive .searchbar,.snackPlayerActive .userCenter {    display: none}.loginBtn,.notification a {    overflow: hidden;    display: block;    -webkit-mask-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAA5JREFUeNpiYGBgAAgwAAAEAAGbA+oJAAAAAElFTkSuQmCC)}.loginBtn {    position: relative;    -webkit-border-radius: 8px 0;    -moz-border-radius: 8px 0;    border-radius: 8px 0}.profilepic-small {    position: absolute;    top: -2px;    left: 0;    width: 37px;    height: 37px;    -moz-background-size: cover;    -o-background-size: cover;    background-size: cover;    background-position: center;    background-color: #fff;    border-radius: 100%;    border: 2px solid #fff;    -webkit-box-shadow: 0 1px 4px 0 rgba(0, 0, 0, .37);    -moz-box-shadow: 0 1px 4px 0 rgba(0, 0, 0, .37);    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, .37);    -webkit-border-radius: 100%;    -moz-border-radius: 100%;    border-radius: 100%}.login .profilepic-small {    display: none}a.logoutBtn {    cursor: pointer;    position: fixed;    top: 12px;    width: 46px;    height: 46px;    left: 14%}.logoutBtn img {    width: 100%}.notification a {    position: relative;    float: left;    -webkit-border-radius: 8px 0;    -moz-border-radius: 8px 0;    border-radius: 8px 0;    width: 44px;    height: 44px;    background-color: #fff;    margin-top: 12px;    border: 1px solid #dbdbdb}.notification .username {    margin-top: 17px}.notificationButtons {    position: absolute;    right: 0;    height: auto;    width: auto;    top: 9px}.notificationButton {    position: absolute;    cursor: pointer;    min-width: 18px;    height: 18px;    width: auto;    top: 22px;    line-height: 21px;    font-size: 13px;    border: none;    right: -10px;    color: #fff;    -webkit-border-radius: 13px;    -moz-border-radius: 13px;    border-radius: 4px;    background: var(--main-color)}.notificationButton img {    width: 14px;    margin-top: 3px;    display: inline-block}.notificationButton:hover {    background: var(--main-color);    color: #fff;    font-weight: semibold}.userCenter {    width: auto;    height: auto;    position: relative;    display: block;    cursor: pointer;    float: left;    margin: 0 8px}.userCenter.login {    background-color: var(--main-color);    min-width: 85px;    height: 35px;    background-image: url('/images/arrow_left.png');    background-repeat: no-repeat;    background-position: 6px center;    border: none;    padding-left: 15px;    margin: 0 7px;    -webkit-border-radius: 8px 0;    -moz-border-radius: 8px 0;    border-radius: 8px 0;}.userCenter .loginBtn div {    display: none}.userCenter.login .loginBtn div {    display: block;    color: #fff;    font-size: 15px;    text-align: center;}.userCenter.login .loginBtn {    width: 100%;    line-height: 35px;    padding: 0 5px;}.userCenter.login img {    display: none}.contentContainer {    -webkit-transition: all 250ms ease-in-out;    -moz-transition: all 250ms ease-in-out;    -o-transition: all 250ms ease-in-out;    transition: all 250ms ease-in-out;    position: fixed;    float: left;    left: 6%;    height: auto;    background: #f4f4f4;    overflow: auto;    right: 6%;    bottom: 0;    margin-bottom: 20px;    top: 115px}.sortBar .types .type.sort-indicator:after,.stats {    -webkit-transition: all 250ms ease-in-out;    -moz-transition: all 250ms ease-in-out;    -o-transition: all 250ms ease-in-out}.contentContainer.login {    top: 65px}.categories {    color: #860d4c;    float: left;    padding: 9px}.categories ul {    list-style: none;    padding: 0;    margin: 0;    text-align: left}.headerContainer,.mainContent {    height: 100%;    text-align: center;    width: 100%;    position: relative;    padding-top: 8px;    display: inline-block;    z-index: 2;    background: #fff}.headerContainer {    min-height: 65px;}.mainContent {    padding: 0}.categories ul a {    color: #fff}.container {    width: 100%;    position: relative;    margin: 0 auto;    min-height: 100%}.fab {    position: fixed;    width: 55px;    height: 55px;    -webkit-border-radius: 40px;    -moz-border-radius: 40px;    border-radius: 40px;    -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .16), 0 2px 10px 0 rgba(0, 0, 0, .12);    -moz-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .16), 0 2px 10px 0 rgba(0, 0, 0, .12);    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .16), 0 2px 10px 0 rgba(0, 0, 0, .12);    cursor: pointer;    z-index: 5555;    -webkit-transform: translate3d(0, 0, 0);    -moz-transform: translate3d(0, 0, 0);    transform: translate3d(0, 0, 0)}.approvement {    background: url('/images/icons/approve.png') no-repeat center #fff;    right: 10px;    bottom: 55px;    -moz-background-size: contain;    -o-background-size: contain;    background-size: contain;    z-index: 5556}.headerContainer a:active,.headerContainer a:link,.headerContainer a:visited {    outline: 0;    border: none}.mainContent {    background: 0 0;    z-index: 2;    -webkit-transform: perspective(0);    -moz-transform: perspective(0);    transform: perspective(0);    overflow: visible;    padding-bottom: 40px;    margin-top: 125px}.title {    width: 100%;    height: 40px;    font-size: 25px;    color: #890043;    font-weight: semibold;    position: relative;    margin-bottom: 60px}.title span {    background: #f4f4f4;    z-index: 34;    position: relative;    padding: 0 10px}.title hr {    background: var(--main-color);    height: 2px;    position: absolute;    left: 9px;    right: 9px;    margin: -1px 0 0;    z-index: 2;    width: auto;    top: 50%}.sortBar,.sortBar hr {    position: relative}.sortBar {    float: right;    width: 49%}.sortBar hr {    display: block;    background-color: #8d044a;    height: 1px;    margin: 0}.mobileIcon,.snackLink {    display: none}.sortBar .text {    width: 30%;    float: left;    color: #6c6c6c;    font-size: 22px;    font-weight: 400;    line-height: 22px;    text-align: left}.newSnacksDig,.sortBar .types .type,a.channelThumbnail,a.channelname {    text-align: center;    float: left}.sortBar .types {    width: 100%;    float: left}.sortBar .types .type {    width: 33%;    font-size: 14px;    font-weight: semibold;    cursor: pointer;    position: relative;    line-height: 35px;    color: #a5406f}.sortBar .types .type.sort-indicator:after {    position: absolute;    width: 26px;    height: 12px;    background: url(../images/icons/active_filter.png) no-repeat;    background-position-y: 0;    -moz-background-size: 100% 100%;    -o-background-size: 100% 100%;    background-size: 100% 100%;    -webkit-transition: all 250ms ease-in-out;    -moz-transition: all 250ms ease-in-out;    -o-transition: all 250ms ease-in-out;    transition: all 250ms ease-in-out;    left: 50%;    content: "";    top: -2px;    margin-left: -12px;    background-position-x: center}.newSnacksDig {    position: relative;    width: 100%;    background: #fff;    padding: 3px;    border: 2px solid #e0e0e0}.shareSnack,.snackLink {    position: absolute;    top: 0}.shareSnack {    opacity: 0;    width: 25px;    height: 30px;    right: 0;    background: url('/images/link.png') center no-repeat;    -moz-background-size: 90% auto;    -o-background-size: 90% auto;    background-size: 90% auto;    z-index: 500;    cursor: pointer;    -webkit-transition: all .2s ease-in-out;    -moz-transition: all .2s ease-in-out;    -o-transition: all .2s ease-in-out;    transition: all .2s ease-in-out}.tile img {    width: 100%;    margin: 0 auto;    display: block;    max-width: 210px}.channel,.snack {    position: relative;    width: 209px;    display: inline-block;    cursor: pointer;    overflow: hidden;    margin: 11px;    -webkit-border-radius: 5px;    -moz-border-radius: 5px;    border-radius: 5px;    -webkit-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .3);    -moz-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .3);    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .3);    background: #fff;    -webkit-transform: perspective(0);    -moz-transform: perspective(0);    transform: perspective(0);    padding-bottom: 33px}.channel img,a.channelThumbnail {    display: block;    position: relative}.user,.userProfile {    -webkit-transform: perspective(0)}.channel-info, .classroom-info {    position: absolute;    height: 25px;    width: 100%;    left: 0;    top: 132px;    background: rgba(255, 255, 255, .7);    z-index: 5;}.channel-info .data, .classroom-info .data {    width: 50%;    position: relative;    float: left;    display: flex;    height: 100%;    text-align: center;    vertical-align: middle;    line-height: 0;    color: var(--main-color);    font-size: 14px;    font-weight: 600;    flex-direction: row;    justify-content: center;    align-items: center;}.icon:before {    background-repeat: no-repeat;    background-position: center;    -moz-background-size: 18px;    -o-background-size: 18px;    background-size: 18px;    content: "";    width: 20px;    height: 19px;    position: relative;    display: block;    top: 0}span.icon.eye:before {    background-image: url('/images/icons/svg/view.svg');    -moz-background-size: 23px;    -o-background-size: 23px;    background-size: 23px;    width: 28px}.channel-bottom, .classroom-bottom {    height: 33px;    width: 100%;    position: relative;    float: left}.channel-data .icon,.channel-info .icon,.classroom-data .icon,.classroom-info .icon {    position: relative;    display: inline-block;    height: 18px;    min-width: 20px;    line-height: 12px !important}.channelimgHolder {    overflow: hidden;    height: 245px}.channelimgHolder .customImage {    height: 157px !important}.channelimgHolder img {    max-height: 220px;    overflow: hidden}a.channelname {    font-size: 1.1em;    font-weight: semibold;    border-top: 1px solid #fafafa;    position: relative;    width: 100%}.channel img {    width: 211px;    height: auto;    margin: 0 auto;    z-index: 1;    left: -2px}.tile .userPic img,.user,.userProfile,div.addSnack {    display: inline-block}.user {    width: auto;    height: auto;    margin: 10px;    text-align: center;    cursor: pointer}.userPic {    position: relative;    width: 160px;    height: 160px;    -webkit-border-radius: 100%;    -moz-border-radius: 100%;    border-radius: 100%;    overflow: hidden;    background-color: #fff;    -webkit-box-shadow: 0 1px 4px 0 rgba(0, 0, 0, .37);    -moz-box-shadow: 0 1px 4px 0 rgba(0, 0, 0, .37);    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, .37);    border: 3px solid #fff;    cursor: pointer;    margin-bottom: 11px;    transition: all .3s ease-in-out;    -webkit-transition: all .3s ease-in-out;    -moz-transition: all .3s ease-in-out;    -o-transition: all .3s ease-in-out}.user:hover .userPic {    -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .2), 0 6px 10px 0 rgba(0, 0, 0, .3);    -moz-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .2), 0 6px 10px 0 rgba(0, 0, 0, .3);    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .2), 0 6px 10px 0 rgba(0, 0, 0, .3)}.snack:hover .shareSnack {    opacity: 1}.snackTitle {    color: var(--main-color);    position: relative;    white-space: pre-wrap;    overflow: hidden;    word-wrap: normal;    font-size: 14px;    display: inline-block;    -o-text-overflow: ellipsis;    text-overflow: ellipsis;    text-align: left;    line-height: 17px;    vertical-align: middle;    font-weight: 400;    width: 100%;    word-break: break-all;}.snackUserName {    font-family: 'Titillium Web', Verdana, serif;    color: #666;    font-size: 10px;    width: 100%;    position: absolute;    float: left;    height: auto;    margin-top: 10px;    bottom: 0;    left: 0}.snackData {    position: relative;    width: 100%;    height: 55px;    padding: 9px 11px;    text-align: left;    float: left;    -o-text-overflow: ellipsis;    text-overflow: ellipsis;    overflow: hidden;    display: flex;    justify-content: flex-start;    align-items: center;}.snackInfo {    height: 25px;    position: absolute;    left: 0;    top: 132px}.stars,.views {    text-align: center;    line-height: 12px;    font-size: 14px;    position: relative;    font-weight: 600;    float: left;    width: 50%;    height: 25px;    color: var(--main-color);    -webkit-user-select: none;    display: flex;    justify-content: center;    align-items: center;}.snackInfo {    width: 100%;    background: rgba(255, 255, 255, .7);    font-family: 'Titillium Web', Helvetica !important;    z-index: 101}.snackTools {    position: relative;    width: 100%;    float: left;    background: #f5f5f5;    height: 33px;    z-index: 107;    display: flex;    align-content: space-between;    justify-content: space-around;}.snack-submit.submitted {    height: 33px;    background: #ff9800;    color: #fff;    font-size: 19px;    cursor: help;    line-height: 32px;    font-weight: 600}.snack-submit.submitted:hover:after,.snack-submit.submitted:hover:before {    opacity: 1}.snack-submit.submitted:after {    -webkit-transition: all .3s ease-in-out;    -moz-transition: all .3s ease-in-out;    -o-transition: all .3s ease-in-out;    transition: all .3s ease-in-out;    opacity: 0;    content: "Snack wurde eingereicht und kann nicht mehr geändert werden. Snack wird geprüft ...";    position: absolute;    width: 130px;    left: 50%;    margin-left: -68px;    top: -93px;    background-color: #ff9800;    -webkit-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .3);    -moz-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .3);    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .3);    font-size: 12px;    -webkit-border-radius: 3px;    -moz-border-radius: 3px;    border-radius: 3px;    line-height: normal;    padding: 3px}.snack-submit.submitted:before {    -webkit-transition: all .3s ease-in-out;    -moz-transition: all .3s ease-in-out;    -o-transition: all .3s ease-in-out;    transition: all .3s ease-in-out;    opacity: 0;    content: "";    width: 0;    height: 0;    border-style: solid;    border-width: 10px 15px 0 15px;    border-color: #ff9800 transparent transparent transparent;    position: absolute;    top: -11px;    left: 50%;    z-index: 1;    margin-left: -15px}.snack-submit.submitted.approved:before {    border-color: #388e3c transparent transparent transparent}.snack-submit.submitted.approved:after {    background-color: #388e3c;    content: "Ihr Snack wurde freigegeben.";    top: -53px}.snack-submit.submitted.approved {    background: #388e3c}.tile.profile .snackInfo {    bottom: 33px}.links a,.message,.stars,.tile .username,.views {    font-family: 'Titillium Web', Helvetica;}.icon-eye.eye,.star {    position: relative;    font-size: 18px;    display: inline-block;    margin: 0 3px}.icon-eye.eye:before {    /* line-height: inherit; */    /* top: 7px; */    /* position: relative; */}.star:before {    top: 2px;    position: relative}.star {    width: 20px;    height: 20px;    /* top: 3px; */    /* margin: 0 3px; */    /* -webkit-transform: perspective(10000px); */    -moz-transform: perspective(10000px);    /* transform: perspective(10000px); */    -webkit-transition: .3s all;    -o-transition: .3s all;    -moz-transition: .3s all;    transition: .3s all;}.star:before {    /* content: ""; */    color: #000;    background-image: url('/images/icons/svg/heart.svg');    background-repeat: no-repeat;    background-position: center;    -moz-background-size: 18px;    -o-background-size: 18px;    background-size: 18px;    width: 20px;    left: 0;    height: 18px;    /* top: 2px; */    position: absolute;    z-index: 2;    -webkit-transition: .3s all;    -o-transition: .3s all;    -moz-transition: .3s all;    transition: .3s all;}.starred .star:before {    background-image: url('/images/icons/svg/heart_filled.svg')}.starred .star {    color: #bf7399;    -webkit-border-radius: 100%;    -moz-border-radius: 100%;    border-radius: 100%}@-webkit-keyframes pulsate {    to {        border: solid 20px red;        opacity: 0;        left: -5px;        top: -5px    }}@-moz-keyframes pulsate {    to {        border: solid 20px red;        opacity: 0;        left: -5px;        top: -5px    }}@-o-keyframes pulsate {    to {        border: solid 20px red;        opacity: 0;        left: -5px;        top: -5px    }}@keyframes pulsate {    to {        border: solid 20px red;        opacity: 0;        left: -5px;        top: -5px    }}.icon-eye.eye {    color: #000;    font-size: 23px}.fav,.views {    position: relative;    float: left}.channelStats,.friendInfo,.notificationBar,.snackPic,.stats,.tile .userPic,.tile .username {    text-align: center}.fav {    width: 38px;    background: url('/images/icons/svg/star.svg') 4px no-repeat;    -moz-background-size: auto 28px;    -o-background-size: auto 28px;    background-size: auto 28px}hr {    width: 100%;    background: #eeeeef;    border: 0;    height: 1px;    margin: 0}.slideContainer {    position: absolute;    top: 0;    left: 0;    width: 100%;    height: 240px;    overflow: hidden}::-webkit-input-placeholder {    color: #9c9c9c}:-moz-placeholder {    color: #9c9c9c}::-moz-placeholder {    color: #9c9c9c}:-ms-input-placeholder {    color: #9c9c9c}.btn input::-webkit-input-placeholder {    color: #9c9c9c}.btn input:-moz-placeholder {    color: #9c9c9c;    opacity: 1}.btn input::-moz-placeholder {    color: #9c9c9c;    opacity: 1}.btn input:-ms-input-placeholder {    color: #9c9c9c}.background {    position: fixed;    top: 0;    left: 0;    right: 0;    bottom: 0;    background: #fff !important;    background: -moz-linear-gradient(top, rgba(255, 255, 255, 1) 8%, rgba(255, 255, 255, 1) 36%, rgba(255, 255, 255, 1) 36%, rgba(204, 204, 204, 1) 100%) !important;    background: -webkit-gradient(linear, left top, left bottom, color-stop(8%, rgba(255, 255, 255, 1)), color-stop(36%, rgba(255, 255, 255, 1)), color-stop(36%, rgba(255, 255, 255, 1)), color-stop(100%, rgba(204, 204, 204, 1))) !important;    background: -webkit-linear-gradient(top, rgba(255, 255, 255, 1) 8%, rgba(255, 255, 255, 1) 36%, rgba(255, 255, 255, 1) 36%, rgba(204, 204, 204, 1) 100%) !important;    background: -o-linear-gradient(top, rgba(255, 255, 255, 1) 8%, rgba(255, 255, 255, 1) 36%, rgba(255, 255, 255, 1) 36%, rgba(204, 204, 204, 1) 100%) !important;    background: -webkit-gradient(linear, left top, left bottom, color-stop(8%, rgba(255, 255, 255, 1)), color-stop(36%, rgba(255, 255, 255, 1)), color-stop(36%, rgba(255, 255, 255, 1)), to(rgba(204, 204, 204, 1))) !important;    background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 8%, rgba(255, 255, 255, 1) 36%, rgba(255, 255, 255, 1) 36%, rgba(204, 204, 204, 1) 100%) !important}.tile {    position: relative;    width: 209px;    height: auto;    text-align: center;    margin: 7px;    display: inline-block;    border-radius: 8px;    background: #fff;    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .3);    overflow: hidden;    vertical-align: top;    transition: .45s ease transform;    -moz-backface-visibility: hidden;    backface-visibility: hidden;    transform: translateZ(0);    flex-shrink: 0;}.tile:hover {    transform: scale3d(1.02, 1.02, 1.02);}.tile a {    position: relative;    width: 100%;    height: auto;    display: block;    float: left}.snackIcon.icon-edit {    position: relative;    display: inline-block;    float: none;    height: 33px;    color: black;}.stats {    background-color: #f7f7f7;    line-height: 31px;    color: var(--main-color);    z-index: 9999;    overflow: hidden}.stats {    position: absolute;    -webkit-transform: translate3d(0, 212px, 0);    -moz-transform: translate3d(0, 212px, 0);    transform: translate3d(0, 212px, 0);    width: 209px;    height: 100%;    right: 0;    top: 0;    -webkit-border-radius: 0;    -moz-border-radius: 0;    border-radius: 0;    cursor: pointer;    -webkit-transition: all 250ms ease-in-out;    -moz-transition: all 250ms ease-in-out;    -o-transition: all 250ms ease-in-out;    transition: all 250ms ease-in-out}.user.profile {    height: 283px}.profile .stats {    height: 285px}.channelStats,.loadMore {    -webkit-border-radius: 0;    cursor: pointer}.channel-data, .classroom-data {    height: auto;    position: absolute;    bottom: 0;    width: 100%;    background: #fff;    left: 0;    -webkit-box-shadow: inset 0 1px #f3f3f3;    -moz-box-shadow: inset 0 1px #f3f3f3;    box-shadow: inset 0 1px #f3f3f3;}.channel-name, .classroom-name {    height: 55px;    display: flex;    text-align: center;    padding: 4px;    justify-content: center;    align-items: center;}.channel-data h2, .classroom-data h2 {    font-size: 16px;    width: 209px;    color: var(--main-color);    height: auto;    margin: 0;    font-weight: 400;    display: table-cell;    vertical-align: middle;    text-align: center;    max-width: 100%}.folder .channel-data h2 {    font-size: 14px;}.channel-data .data, .classroom-data .data {    width: 50%;    display: block;    position: relative;    height: 100%;    top: 0;    text-align: center;    float: left;    background: #f5f5f5;    display: block;    line-height: 0;    color: var(--main-color);    font-size: 14px;    font-weight: 600}.channel-data .data div, .classroom-data .data div {    /* width: auto; */    display: inline-block;    /* padding: 0; */    height: 100%;    color: #0c0c0c;    /* font-size: 24px; */    top: 0;    vertical-align: top;}.data-holder {    position: relative;    float: left;    width: 100%;    height: 35px;    padding: 2px 0}.channel-data .data .icon, .classroom-data .data .icon {    margin: 0 3px;    height: 21px;    top: 3px;}.channel-data .data .icon:before, .classroom-data .data .icon:before {    position: relative;    width: 25px;    height: 20px;    left: 0;    top: -3px;    display: block}.channel-data .data div.icon-star:before, .classroom-data .data div.icon-star:before {    top: 4px}.icon.icon-cookie:before {    content: "";    background: url('/images/icons/svg/cookie_contour.svg') no-repeat center;    -moz-background-size: contain;    -o-background-size: contain;    background-size: contain;    top: 4px !important}.stats label {    position: absolute;    width: 100%;    float: left;    height: 33px;    cursor: pointer;    left: 0;    top: 0;    padding-right: 27px;    -o-text-overflow: ellipsis;    text-overflow: ellipsis;    white-space: nowrap;    overflow: hidden}.stats label:before {    position: absolute;    right: 8px;    top: 8px}.stats.showStats {    transform: translate3d(0, 0, 0);    -webkit-transform: translate3d(0, 0, 0);    -moz-transform: translate3d(0, 0, 0);    padding: 2px}.tile.profile .stats.showStats {    transform: translate3d(0, -250px, 0);    -webkit-transform: translate3d(0, -250px, 0);    -moz-transform: translate3d(0, -250px, 0)}.stats table {    width: 100%;    border-collapse: collapse;    font-size: 14px;    float: left;    position: relative}.scrollWrapper {    position: absolute;    top: 33px;    height: 175px;    overflow: auto;    left: 0;    width: 209px}.stats table td:nth-child(1) {    width: 50%;    border-right: 1px solid #eaeaea}.stats table tr {    border-bottom: 1px solid #eaeaea}.channel {    padding-bottom: 33px}.channelStats td:nth-child(1) {    font-size: 21px}.tile .userPic {    -webkit-border-radius: 8px 8px 0 0;    -moz-border-radius: 8px 8px 0 0;    border-radius: 8px 8px 0 0;    height: 220px;    width: 209px;    position: relative;    overflow: hidden;    cursor: pointer}.tile .userPic div {    -moz-background-size: cover;    -o-background-size: cover;    background-size: cover;    background-repeat: no-repeat;    background-position: center}.tile.profile {    height: 283px}.tile.profile .userPic {    height: 250px}.tile .username {    position: relative;    float: left;    color: #891245;    cursor: pointer;    font-weight: semibold;    font-size: .9em;    width: 100%;    margin: 0;    padding: 2px}.butons {    z-index: 9999;    position: fixed;    top: 8px;    left: 10%}.butons div {    width: 50px;    height: 50px}.element-selected-true {    border-color: #52af39}.loginBtn img {    height: 35px;    background: #fff;    margin: 0 auto;    position: relative}.tailLeft:after,.tailLeft:before {    content: "";    position: absolute;    z-index: 10;    left: 10px;    border-style: solid;    border-width: 0 2px 2px 0;    border-color: #d3d3d5}.tailLeft:before {    bottom: -23px;    width: 31px;    height: 32px;    background: rgba(211, 211, 213, 1);    -webkit-border-bottom-right-radius: 80px 50px;    -moz-border-radius-bottomright: 80px 50px;    border-bottom-right-radius: 80px 89px;    display: block}.tailLeft:after {    top: 100%;    width: 11px;    height: 21px;    background: #fff;    -webkit-border-bottom-right-radius: 40px 50px;    -moz-border-radius-bottomright: 40px 50px;    border-bottom-right-radius: 28px 40px;    display: block}.tailRight:after,.tailRight:before {    content: "";    position: absolute;    z-index: 10;    right: 10px;    border-style: solid;    border-color: #94cf95;    display: block}.tailRight:before {    bottom: -23px;    width: 31px;    height: 32px;    border-width: 2px 0 0 2px;    background: #94cf95;    -webkit-border-bottom-left-radius: 80px 50px;    -moz-border-radius-bottomleft: 80px 50px;    border-bottom-left-radius: 80px 89px}.tailRight:after {    top: 100%;    width: 11px;    height: 21px;    border-width: 0 0 0 2px;    background: #fff;    -webkit-border-bottom-left-radius: 40px 50px;    -moz-border-radius-bottomleft: 40px 50px;    border-bottom-left-radius: 28px 40px}.bubbleRight.blue.tailRight:before {    border-color: #a0dbe6;    background: rgba(161, 220, 231, 1)}.bubbleRight.blue.tailRight:after {    border-color: #a0dbe6}.bubbleRight.green.tailRight:before {    background: #94cf95;    border-color: #94cf95}.bubbleRight.green.tailRight:after {    border-color: #94cf95}.snack.tailRight:after,.snack.tailRight:before {    content: "";    z-index: 10;    right: 10px;    border-style: solid;    border-color: #ebebeb;    position: absolute;    display: block}.snack.tailRight:before {    bottom: -23px;    width: 31px;    height: 32px;    border-width: 2px 0 0 2px;    background: #ebebeb;    -webkit-border-bottom-left-radius: 80px 50px;    -moz-border-radius-bottomleft: 80px 50px;    border-bottom-left-radius: 80px 89px}.loadMore,.notificationBar,.notificationBar hr,.userInfoLine {    background: #fff}.snack.tailRight:after {    top: 100%;    width: 11px;    height: 21px;    border-width: 0 0 0 2px;    background: #fff;    -webkit-border-bottom-left-radius: 40px 50px;    -moz-border-radius-bottomleft: 40px 50px;    border-bottom-left-radius: 28px 40px}.loadMore {    width: 100%;    -moz-border-radius: 0;    -webkit-border-radius: 0;    border-radius: 0;    border: none;    border-top: 1px solid #000;    padding: 0;    margin: 0;    line-height: 25px;    -webkit-box-shadow: 0 -10px 13px -11px;    -moz-box-shadow: 0 -10px 13px -11px;    box-shadow: 0 -10px 13px -11px}.fadeOut {    opacity: 0 !important}.slide {    position: absolute;    top: 0;    left: 0;    -webkit-transition: all .4s ease-in-out;    -moz-transition: all .4s ease-in-out;    -o-transition: all .4s ease-in-out;    transition: all .4s ease-in-out;    opacity: 1}.snackPic {    overflow: hidden;    width: 100%;    position: relative;    height: 157px !important;    -moz-background-size: cover;    -o-background-size: cover;    background-size: cover;    background-repeat: no-repeat;    margin: 0 auto;    background-position: center;    -webkit-mask-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAA5JREFUeNpiYGBgAAgwAAAEAAGbA+oJAAAAAElFTkSuQmCC);    -webkit-border-radius: 5px 5px 0 0;    -moz-border-radius: 5px 5px 0 0;    border-radius: 5px 5px 0 0;    border-bottom: 1px solid #e8e8e8;}.snackPic.qr {    -ms-interpolation-mode: nearest-neighbor;    image-rendering: -webkit-optimize-contrast;    image-rendering: -moz-crisp-edges;    image-rendering: -o-pixelated;    image-rendering: pixelated;    -moz-background-size: 132px;    -o-background-size: 132px;    background-size: 132px}.notificationBar {    height: auto;    position: absolute;    z-index: 9999;    top: 45px;    right: 0;    width: auto;    -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, .25);    -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, .25);    box-shadow: 0 1px 4px rgba(0, 0, 0, .25);    padding-bottom: 0;    border: 1px solid #e6e6e6;    -webkit-border-radius: 4px;    -moz-border-radius: 4px;    border-radius: 4px;    background-color: rgba(255, 255, 255, 0);    min-width: 170px;    visibility: hidden;    opacity: 0;    -webkit-transition: .3s all;    -o-transition: .3s all;    -moz-transition: .3s all;    transition: .3s all}.notificationBar:after,.notificationBar:before {    content: "";    width: 0;    position: absolute;    height: 0;    border-style: solid;    z-index: 10}.notificationBar:before {    border-width: 0 14px 10px;    border-color: transparent transparent #e6e6e6;    top: -10px;    right: 5px}.notificationBar:after {    border-width: 0 12px 8px;    border-color: transparent transparent #fff;    top: -8px;    right: 7px}.notificationBarLine {    width: 100%;    float: left;    height: auto;    overflow: hidden}.userInfoLine {    width: 250px;    height: 50px;    position: relative;    float: left;    margin-left: 0;    margin-top: 0;    border-bottom: 1px solid #dfdfdf;    -webkit-border-radius: 8px 0 0;    -moz-border-radius: 8px 0 0;    border-radius: 8px 0 0}.text-line:first-child {    -webkit-border-radius: 3px 3px 0 0;    -moz-border-radius: 3px 3px 0 0;    border-radius: 3px 3px 0 0}.notificationBar:last-child {    -webkit-border-radius: 0 0 3px 3px !important;    -moz-border-radius: 0 0 3px 3px !important;    border-radius: 0 0 3px 3px !important}.text-line {    position: relative;    width: auto;    font-size: 14px;    height: 35px;    color: #8c8c8c;    font-weight: 600;    line-height: 35px;    -webkit-box-shadow: inset 0 -1px 0 0 #e6e6e6;    -moz-box-shadow: inset 0 -1px 0 0 #e6e6e6;    box-shadow: inset 0 -1px 0 0 #e6e6e6;    cursor: pointer;    background-color: #fff;    display: block}.text-line:hover {    background-color: #fff;    color: var(--main-color);}.userInfoLine a {    overflow: hidden;    position: relative;    float: left;    -webkit-border-radius: 8px 0;    -moz-border-radius: 8px 0;    border-radius: 8px 0;    -webkit-mask-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAA5JREFUeNpiYGBgAAgwAAAEAAGbA+oJAAAAAElFTkSuQmCC);    width: 44px;    height: 44px;    background-color: #fff;    margin-top: 3px;    margin-bottom: 3px;    display: block;    margin-left: 3px;    border: 1px solid #dbdbdb}.userInfoLine a img {    -webkit-border-radius: 8px 0 0;    -moz-border-radius: 8px 0 0;    border-radius: 8px 0 0;    height: 44px;    float: left}.userInfoLine .username {    color: #000;    font-size: 16px;    line-height: 50px;    margin-left: 20px;    cursor: pointer}.notificationBar .notification {    position: relative;    float: left;    width: 100%;    margin-bottom: 1px;    background: #fff;    padding: 0 5px 5px;    -webkit-box-shadow: 0 1px 0 0 #e6e6e6;    -moz-box-shadow: 0 1px 0 0 #e6e6e6;    box-shadow: 0 1px 0 0 #e6e6e6}.notificationBar .notification .notificationButton {    position: relative;    color: #000;    border: none;    float: left;    cursor: pointer;    width: 33px;    height: 33px;    top: inherit;    right: inherit;    margin-right: 0;    margin-bottom: 0;    margin-left: 4px;    background-color: transparent !important}.snackPreviewOverlay,div.logout {    position: absolute;    z-index: 100;    right: 0;    top: 0}.notification img {    float: left}.notificationBar h5 {    margin: 0 auto;    background: #fff;    color: #8c8c8c;    font-size: 14px;    font-weight: 600}.snackPreviewOverlay {    left: 0;    bottom: 0;    background: url('/images/categories/ca_overlay.png');    -moz-background-size: 100% 100%;    -o-background-size: 100% 100%;    background-size: 100% 100%}.noselect,.noselect * {    -webkit-touch-callout: none;    -webkit-user-select: none;    -moz-user-select: none;    -ms-user-select: none;    user-select: none}.noselect input,.noselect textarea {    -webkit-touch-callout: text !important;    -webkit-user-select: text !important;    -moz-user-select: text !important;    -ms-user-select: text !important;    user-select: text !important}.messagesContainer {    position: fixed;    top: 0;    right: 0;    left: 0;    width: 100%;    text-align: right;    z-index: 10002}.message {    position: relative;    z-index: 9999;    padding: 8px;    width: 100%;    float: left;    text-align: center;    height: auto;    color: #fff;    cursor: pointer;    padding-right: 38px}.message.success {    background: #4caf50;    border: 1px solid #388e3c}.message.error {    background: #e74c3c;    border: 1px solid #c30000}.message.info {    background: #03a9f4;    border: 1px #0288d1}.message-close {    position: absolute;    right: 0;    top: 0;    height: 100%;    width: 35px;    text-align: center;    font-size: 20px;    background: rgba(0, 0, 0, .1);    cursor: pointer}.message.warning {    background: #ff5722;    border: 1px solid #e64a19}.message div.icon {    top: -10px;    left: 0;    width: 25px;    min-height: 43px;    margin-right: 10px;    position: relative;    height: 100%;    float: left}.cropAreaWrapper,.modalWindow {    width: 768px;    position: relative;}.customImage {    -moz-background-size: cover;    -o-background-size: cover;    background-size: cover;    background-position: center}.user-pic {    position: relative;    display: block;    margin: 0 auto;    width: 106px;    -webkit-border-radius: 120px;    -moz-border-radius: 120px;    border-radius: 120px;    -webkit-box-shadow: 0 1px 4px 0 rgba(0, 0, 0, .37);    -moz-box-shadow: 0 1px 4px 0 rgba(0, 0, 0, .37);    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, .37);    border: 3px solid #fff;    height: 106px !important;    vertical-align: middle;    cursor: pointer;    -moz-background-size: cover;    -o-background-size: cover;    background-size: cover;    background-color: white;}.user-pic > div {    -webkit-border-radius: 120px;    -moz-border-radius: 120px;    border-radius: 120px;    -moz-background-size: cover !important;    -o-background-size: cover !important;    background-size: cover !important}.preloader {    margin: 0 auto;    position: relative;    display: block}.progress {    position: absolute;    width: 100%;    height: 10px;    left: 0;    top: 50%;    margin-top: -5px;    background: #c30000;    z-index: 5;    background: -webkit-gradient(linear, right top, left top, from(var(--main-color)), to(var(--main-color)));    background: -webkit-linear-gradient(right, var(--main-color), var(--main-color));    background: -moz-linear-gradient(right, var(--main-color), var(--main-color));    background: -o-linear-gradient(right, var(--main-color), var(--main-color));    background: linear-gradient(270deg, var(--main-color), var(--main-color));    -moz-background-size: 1400% 1400%;    -o-background-size: 1400% 1400%;    background-size: 1400% 1400%;    -webkit-animation: AnimationName 7s ease infinite;    -moz-animation: AnimationName 7s ease infinite;    -o-animation: AnimationName 7s ease infinite;    animation: AnimationName 7s ease infinite}@-webkit-keyframes AnimationName {    0% {        background-position: 0 50%    }    50% {        background-position: 100% 50%    }    100% {        background-position: 0 50%    }}@-moz-keyframes AnimationName {    0% {        background-position: 0 50%    }    50% {        background-position: 100% 50%    }    100% {        background-position: 0 50%    }}@-o-keyframes AnimationName {    0% {        background-position: 0 50%    }    50% {        background-position: 100% 50%    }    100% {        background-position: 0 50%    }}@keyframes AnimationName {    0% {        background-position: 0 50%    }    50% {        background-position: 100% 50%    }    100% {        background-position: 0 50%    }}.progress div {    width: 25%;    height: 0;    margin: 0;    padding: 0;    background: #9c2560;    float: left}.modalWindow {    padding-bottom: 22px;    max-width: 99%;    background: #000;    z-index: 9999;    left: 50% !important;    margin-left: -257px;    top: 50% !important;    position: fixed;    transform: translateY(-50%);    box-shadow: 0 2px 15px 2px rgba(0, 0, 0, 0.38);    max-height: 100%;}.userProfile {    width: 100%;    left: 0;    top: 0;    position: absolute}.userProfile {    background: #f2e9ee;    border: 1px solid #d9bbc7;    -webkit-border-radius: 5px;    -moz-border-radius: 5px;    border-radius: 5px;    -moz-transform: perspective(0);    -webkit-transform: perspective(0);    transform: perspective(0);    padding: 7px;    height: 244px;    -webkit-box-shadow: none;    -moz-box-shadow: none;    box-shadow: none;    overflow: hidden;    margin-left: 23px;    margin-bottom: 22px}.userProfile .waitingForResponse {    top: 5px}.userProfile hr {    background: #e5d0d9;    margin-top: 12px;    position: relative;    float: left;    margin-bottom: 4px}.bigProfilePic {    height: 100%;    position: absolute;    width: 100%;    overflow: hidden}div.addSnack {    width: 45px;    height: 45px;    cursor: pointer;    position: relative;    border: none;    background: url('/images/icons/plus.png') center no-repeat;    -moz-background-size: auto 100%;    -o-background-size: auto 100%;    background-size: auto 100%;    margin-left: 5px}.bigProfilePic img {    position: relative;    cursor: pointer;    height: auto;    overflow: hidden;    background: 0 0;    margin: 17% auto 0;    width: 100px;    display: block;    -webkit-border-radius: 8px 0;    -moz-border-radius: 8px 0;    border-radius: 8px 0}img.plusIcon {    position: fixed;    z-index: 9999;    width: 25px;    right: 38px;    cursor: pointer;    top: 36px}.channels-widget {    position: absolute;    height: auto;    width: 200px !important;    left: 50%;    background-color: #e8e8e8;    margin-left: -100px !important;    bottom: 50px;    -webkit-box-shadow: 0 0 8px -2px rgba(0, 0, 0, .48);    -moz-box-shadow: 0 0 8px -2px rgba(0, 0, 0, .48);    box-shadow: 0 0 8px -2px rgba(0, 0, 0, .48);    -webkit-border-radius: 4px;    -moz-border-radius: 4px;    border-radius: 4px}.channels-widget:after,.channels-widget:before {    border-style: solid;    border-width: 12px 12px 0;    content: "";    position: absolute;    z-index: 1000;    left: 50%;    margin-left: -12px}.channels-widget:after {    border-color: #fff rgba(232, 233, 232, 0) transparent transparent;    bottom: -10px}.channels-widget:before {    border-color: #e8e8e8 rgba(232, 233, 232, 0) transparent transparent;    bottom: -12px}.channels-widget.revert {    bottom: initial;    top: 129%;    color: #000;    z-index: 100}.channels-widget.revert:after,.channels-widget.revert:before {    border-style: solid;    border-width: 0 12px 12px;    content: "";    position: absolute;    z-index: 1000;    bottom: initial;    left: 50%;    margin-left: -12px}.channels-widget.revert:before {    border-color: rgba(255, 255, 255, 0) rgba(232, 233, 232, 0) #e8e8e8 transparent;    top: -11px}.channels-widget.revert:after {    border-color: rgba(255, 255, 255, 0) rgba(232, 233, 232, 0) #fff transparent;    top: -10px}.channels-widget .wrapper {    position: relative;    float: left;    width: 100%;    height: auto;    margin: 0 auto;    max-height: 300px;    overflow: auto}.list-channel {    width: 100% !important;    height: 50px;    position: relative;    margin: 0 auto !important;    float: left;    background-color: #fff;    line-height: 50px;    font-size: 16px;    font-weight: 300;    cursor: pointer;    -webkit-box-shadow: 0 -2px 8px -6px #000 inset;    -moz-box-shadow: 0 -2px 8px -6px #000 inset;    box-shadow: 0 -2px 8px -6px #000 inset}.tools,.tools img {    width: 100%}.list-channel:hover {    background-color: #f9f8f8}.tools {    position: fixed;    left: 0;    bottom: 33px;    height: 50px;    background: #f4f4f4;    -webkit-box-shadow: 0 0 34px -13px #000;    -moz-box-shadow: 0 0 34px -13px #000;    box-shadow: 0 0 34px -13px #000;    z-index: 20;    overflow: visible;    padding-top: 2px;    -webkit-transform: perspective(0);    -moz-transform: perspective(0);    transform: perspective(0)}.activities {    width: 200px;    height: auto;    border: 1px solid #000}.editOverlay {    position: absolute;    top: 0;    left: 0;    right: 0;    width: 100%;    bottom: 0;    -webkit-border-radius: 0;    -moz-border-radius: 0;    border-radius: 0;    height: 100%;    cursor: pointer;    overflow: hidden;    z-index: 4}.editOverlay:hover {    background: url('/images/change.png') center no-repeat rgba(0, 0, 0, .33);    -moz-background-size: 24% auto;    -o-background-size: 24% auto;    background-size: 24% auto}.rankingContainer {    position: absolute;    width: 20px;    left: 4px;    top: 0}.rankingContainer .snackRankStar {    width: 20px;    height: 20px;    -moz-background-size: 90% auto;    -o-background-size: 90% auto;    background-size: 90% auto}.smiley-box {    background: #e0e0e0;    z-index: 9979;    display: flex !important;}div#copyright {    float: left;    height: 33px;    line-height: 33px;}.footer-content-data {    position: relative;    float: left;    width: auto;    font-size: 14px;    line-height: 35px}a.footer-impressum, a.footer-feedback {    position: relative;    float: left;    color: #fff;    font-weight: 400;    height: auto;    line-height: inherit;    cursor: pointer}span.footer-divider {    width: 1px;    height: 14px;    margin: 0 15px;    background: #fff;    display: block;    position: relative;    float: left;    top: 12px}.links {    float: right;    margin-right: 25px;    color: #d9d9d9;    height: 33px;    line-height: 33px;}.links a {    margin-right: 10px;    color: #d9d9d9;    cursor: pointer}.links a:hover {    text-decoration: underline}.customCheckbox {    width: 100%; /* float: left; */    height: 30px;    position: relative;    cursor: pointer;}.loginbox .customCheckbox {    width: 97%;    float: none;    height: 30px;    position: relative;    margin: 0 auto 10px}.customCheckbox input {    display: none}.customCheckbox label {    width: 28px;    height: 28px;    position: absolute;    left: 0;    top: 0;    border: none;    -webkit-border-radius: 5px;    -moz-border-radius: 5px;    cursor: pointer}.customCheckbox label.checked {    background: url('/images/icons/editor/check_on.png') center no-repeat rgba(255, 255, 255, 0);    -moz-background-size: 100% auto;    -o-background-size: 100% auto;    background-size: 100% auto}.customCheckbox label.unchecked {    background: url('/images/icons/editor/check_off.png') center no-repeat rgba(255, 255, 255, 0);    -moz-background-size: 100% auto;    -o-background-size: 100% auto;    background-size: 100% auto}label.unchecked.noselect.pause {    -moz-background-size: 100% auto;    -o-background-size: 100% auto;    background-size: 100% auto}label.checked.noselect.pause {    -moz-background-size: 100% auto;    -o-background-size: 100% auto;    background-size: 100% auto}.mc-answer-line .customCheckbox {    position: relative;    top: 9px;    width: 30px;    display: inline-block;    float: none;    margin-right: 2px}.customCheckbox span {    margin-left: 30px}.customCheckbox .text {    position: relative;    width: auto;    margin-left: 30px;    border: none;    display: inline-block;}.row {    position: relative;    float: left;    width: 100%}.flexbox-container {    display: -webkit-box;    display: -webkit-flex;    display: -moz-box;    display: -ms-flexbox;    display: flex;    -webkit-box-pack: center;    -webkit-justify-content: center;    -moz-box-pack: center;    -ms-flex-pack: center;    justify-content: center;    -webkit-box-align: center;    -webkit-align-items: center;    -moz-box-align: center;    -ms-flex-align: center;    align-items: center;    -webkit-align-content: center;    -ms-flex-line-pack: center;    align-content: center}td,th {    font-size: 16px;    border: 1px solid #e6e6e6;    border-collapse: collapse;    position: relative}input[type=range].slider {    -webkit-appearance: none;    width: 100%;    margin: 6.8px 0}input[type=range].slider:focus {    outline: 0}input[type=range].slider::-webkit-slider-runnable-track {    width: 100%;    height: 6.4px;    cursor: pointer;    -webkit-box-shadow: 0 0 .3px #000, 0 0 0 #0d0d0d;    box-shadow: 0 0 .3px #000, 0 0 0 #0d0d0d;    background: #cdcdcd;    -webkit-border-radius: 2.8px;    border-radius: 2.8px;    border: 0 solid #000}input[type=range].slider::-webkit-slider-thumb {    -webkit-box-shadow: 0 0 0 #670000, 0 0 0 #810000;    box-shadow: 0 0 0 #670000, 0 0 0 #810000;    border: 0 solid #ff1e00;    height: 20px;    width: 13px;    -webkit-border-radius: 2px;    border-radius: 2px;    background: rgba(193, 118, 156, .93);    cursor: pointer;    -webkit-appearance: none;    margin-top: -6.8px}input[type=range].slider:focus::-webkit-slider-runnable-track {    background: #dadada}input[type=range].slider::-moz-range-track {    width: 100%;    height: 6.4px;    cursor: pointer;    -moz-box-shadow: 0 0 .3px #000, 0 0 0 #0d0d0d;    box-shadow: 0 0 .3px #000, 0 0 0 #0d0d0d;    background: #cdcdcd;    -moz-border-radius: 2.8px;    border-radius: 2.8px;    border: 0 solid #000}input[type=range].slider::-moz-thumb {    -moz-box-shadow: 0 0 0 #670000, 0 0 0 #810000;    box-shadow: 0 0 0 #670000, 0 0 0 #810000;    border: 0 solid #ff1e00;    height: 20px;    width: 13px;    -moz-border-radius: 2px;    border-radius: 2px;    background: rgba(193, 118, 156, .93);    cursor: pointer}input[type=range].slider::-ms-track {    width: 100%;    height: 6.4px;    cursor: pointer;    background: 0 0;    border-color: transparent;    color: transparent}input[type=range].slider::-ms-fill-lower {    background: silver;    border: 0 solid #000;    border-radius: 5.6px;    box-shadow: 0 0 .3px #000, 0 0 0 #0d0d0d}input[type=range].slider::-ms-fill-upper {    background: #cdcdcd;    border: 0 solid #000;    border-radius: 5.6px;    box-shadow: 0 0 .3px #000, 0 0 0 #0d0d0d}input[type=range].slider::-ms-thumb {    box-shadow: 0 0 0 #670000, 0 0 0 #810000;    border: 0 solid #ff1e00;    width: 13px;    border-radius: 2px;    background: rgba(193, 118, 156, .93);    cursor: pointer;    height: 6.4px}input[type=range].slider:focus::-ms-fill-lower {    background: #cdcdcd}input[type=range].slider:focus::-ms-fill-upper {    background: #dadada}.animated {    -webkit-animation-duration: 1s;    -moz-animation-duration: 1s;    -o-animation-duration: 1s;    animation-duration: 1s;    -webkit-animation-fill-mode: both;    -moz-animation-fill-mode: both}.colorpicker-color {    width: 50px;    height: 50px;    display: inline-block;    cursor: pointer;    -webkit-transition: .3s all;    -o-transition: .3s all;    -moz-transition: .3s all;    transition: .3s all}.colorpicker-color:hover {    -webkit-transform: scale3d(1.1, 1.1, 1);    -moz-transform: scale3d(1.1, 1.1, 1);    transform: scale3d(1.1, 1.1, 1);    -webkit-box-shadow: 0 0 2px rgba(0, 0, 0, .4);    -moz-box-shadow: 0 0 2px rgba(0, 0, 0, .4);    box-shadow: 0 0 2px rgba(0, 0, 0, .4)}.colorpicker {    text-align: left;    line-height: 0;    position: relative;    padding: 0;    z-index: 1;    max-width: 32px;    overflow: hidden;    max-height: 32px;    top: 7px;    height: 158px;    -webkit-border-radius: 2px;    -moz-border-radius: 2px;    border-radius: 2px;    width: 208px;    background: #fff;    -webkit-transition: all .3s;    -o-transition: all .3s;    -moz-transition: all .3s;    transition: all .3s;    float: left}.colorpicker.open {    max-width: 208px;    max-height: 160px;    padding: 4px;    z-index: 5;    position: absolute}.footer-language {    position: relative;    float: left;    line-height: inherit}select.language-select {    position: relative;    right: 0;    height: auto;    background: url('/images/icons/svg/arrow_down.svg') no-repeat right #373737;    color: #d2d2d2;    background: #373737;    border: none;    font-weight: 600;    cursor: pointer;    float: right;    -webkit-appearance: none;    appearance: none;    padding-right: 15px;    color: #ffffff;    line-height: normal;    -moz-background-size: 15px;    -o-background-size: 15px;    background-size: 15px;    -ms-appearance: none;    -moz-appearance: none;    margin-left: 10px;    margin: auto 0;    float: none;}.profile-poll-snack {    position: relative;    display: block;    width: 100%;    height: auto;    float: left;    padding: 18px 0}.profile-poll-element {    position: relative;    display: inline-block}.profile-poll-scroll {    overflow-y: hidden;    overflow-x: auto;    white-space: nowrap}.profile-poll-snack h2 {    margin: 0;    margin-bottom: 5px;    font-size: 16px}.playlist-snacks {    position: relative;    white-space: nowrap;    text-align: left;    display: inline-block}.playlist {    display: inline-block;    position: relative;    overflow: hidden;    padding: 0 33px;    width: 100%;    text-align: left;    margin-bottom: 5px}.playlist-arrow {    position: absolute;    top: 0;    width: 33px;    height: 100%;    cursor: pointer;    z-index: 6;    background-position: center;    background-repeat: no-repeat;    -moz-background-size: auto;    -o-background-size: auto;    background-size: auto;    -webkit-transition: all .3s;    -o-transition: all .3s;    -moz-transition: all .3s;    transition: all .3s;    background-color: rgba(244, 244, 244, .78)}.playlist-arrow.right {    right: 0;    background: url('/images/arrow-r.png');    background-position: center;    background-repeat: no-repeat;    -moz-background-size: auto;    -o-background-size: auto;    background-size: auto}.playlist-arrow.left {    left: 0;    background: url('/images/arrow-l.png');    background-position: center;    background-repeat: no-repeat;    -moz-background-size: auto;    -o-background-size: auto;    background-size: auto}.playlist-title {    position: relative;    display: block;    width: 100%;    float: left}.playlist-title h2 {    position: relative;    display: inline-block;    color: #767676;    -webkit-transition: .3s all;    -o-transition: .3s all;    -moz-transition: .3s all;    transition: .3s all;    cursor: pointer;    margin: 0;    font-size: 24px;    font-weight: 700}.playlist-title h2:hover {    color: var(--main-color)}.playlist-title-arrow {    position: absolute;    width: 10px;    height: 20px;    right: -14px;    top: 4px;    display: block;    -webkit-transition: .3s all;    -o-transition: .3s all;    -moz-transition: .3s all;    transition: .3s all}span.playlist-title-text {    position: relative;    display: inline-block;    margin: 2px 7px 7px 7px}.playlist-title-arrow:after,.playlist-title-arrow:before {    content: "";    position: absolute;    display: block;    left: 0;    top: 3px;    width: 2px;    height: 7px;    -webkit-transform-origin: center;    -moz-transform-origin: center;    -ms-transform-origin: center;    -o-transform-origin: center;    transform-origin: center;    background: #767676;    -webkit-transition: .3s all;    -o-transition: .3s all;    -moz-transition: .3s all;    transition: .3s all}.playlist-title-arrow:before {    -webkit-transform: translate3d(11px, 3px, 0) rotate(140deg);    -moz-transform: translate3d(11px, 3px, 0) rotate(140deg);    transform: translate3d(4px, 1px, 0) rotate(140deg)}.playlist-title-arrow:after {    -webkit-transform: translate3d(11px, 10px, 0) rotate(-140deg);    -moz-transform: translate3d(11px, 10px, 0) rotate(-140deg);    transform: translate3d(4px, 6px, 0) rotate(-140deg)}.open .playlist-title-arrow {    -webkit-transform: rotate(90deg);    -moz-transform: rotate(90deg);    -ms-transform: rotate(90deg);    -o-transform: rotate(90deg);    transform: rotate(90deg)}.playlist.open {    overflow: hidden}.playlist.open .playlist-snacks {    width: 100% !important;    -webkit-transition: none;    -o-transition: none;    -moz-transition: none;    transition: none;    white-space: normal;    text-align: center;    padding: 0 !important}.playlist.open .playlist-arrow {    display: none}.playlist .add-snack {    position: relative;    display: inline-block;    width: 209px;    height: 245px;    -webkit-border-radius: 0;    -moz-border-radius: 0;    border-radius: 0;    border: 1px solid #ebe8e8;    -webkit-border-radius: 4px;    -moz-border-radius: 4px;    border-radius: 4px;    margin: 7px;    background: url('/images/icons/svg/plus.svg') no-repeat center #f1f1f1;    -moz-background-size: 33px;    -o-background-size: 33px;    background-size: 33px;    cursor: pointer;    -webkit-transition: .3s all;    -o-transition: .3s all;    -moz-transition: .3s all;    transition: .3s all;    -webkit-box-shadow: 0 0 0 0 transparent;    -moz-box-shadow: 0 0 0 0 transparent;    box-shadow: 0 0 0 0 transparent}.playlist .add-snack:hover {    -webkit-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .3);    -moz-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .3);    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .3);    border-color: transparent}.edit-playlist {    position: relative;    float: left;    height: 36px;    line-height: 46px;    font-size: 19px;    margin: 0 7px 0 0;    cursor: pointer}.dashboard-menu {    position: relative;    width: 100%;    background: #fff;    height: 50px;    white-space: nowrap;    text-align: center;    z-index: 9988;    -webkit-box-shadow: inset 0 1px 0 0 #f4f4f4;    -moz-box-shadow: inset 0 1px 0 0 #f4f4f4;    box-shadow: inset 0 1px 0 0 #f4f4f4;    overflow: auto;    display: block}.dashboard-menu-item {    position: relative;    display: inline-block;    height: 100%;    padding: 5px;    background: #fdfdfd;    min-width: 100px;    -webkit-box-shadow: 1px 0 0 0 #f6f6f6, -1px 0 0 0 #f9f9f9;    -moz-box-shadow: 1px 0 0 0 #f6f6f6, -1px 0 0 0 #f9f9f9;    box-shadow: 1px 0 0 0 #f6f6f6, -1px 0 0 0 #f9f9f9;    text-align: center;    line-height: 44px;    color: #525252;    font-size: 17px}.dashboard-menu-item:first-of-type {    -webkit-box-shadow: 1px 0 0 0 #f6f6f6, -1px 0 0 0 #fff;    -moz-box-shadow: 1px 0 0 0 #f6f6f6, -1px 0 0 0 #fff;    box-shadow: 1px 0 0 0 #f6f6f6, -1px 0 0 0 #fff}.dashboard-menu-item:last-of-type {    -webkit-box-shadow: 1px 0 0 0 #fff, -1px 0 0 0 #f6f6f6;    -moz-box-shadow: 1px 0 0 0 #fff, -1px 0 0 0 #f6f6f6;    box-shadow: 1px 0 0 0 #fff, -1px 0 0 0 #f6f6f6}.dashboard-menu-item.active {    color: #5f5f5f;    background: #f2f2f2}.dashboard-menu-item:hover {    background: #525252;    color: #d7d7d7}.poll-holder {    width: -webkit-calc(100% - 20px);    width: -moz-calc(100% - 20px);    width: calc(100% - 20px);    position: relative;    display: block;    text-align: center;    vertical-align: top}.poll-holder h2 {    color: #767676;    font-size: 20px;    margin: 0;    height: 43px}.poll-container {    width: 320px;    display: inline-block;    position: relative;    -webkit-box-shadow: 1px 6px 11px -7px rgba(139, 139, 139, .72);    -moz-box-shadow: 1px 6px 11px -7px rgba(139, 139, 139, .72);    box-shadow: 1px 6px 11px -7px rgba(139, 139, 139, .72);    padding: 10px;    text-align: center;    height: auto;    background: rgba(255, 255, 255, .6);    margin: 10px;    vertical-align: top}.poll-scroll {    position: relative;    display: block;    width: 100%;    white-space: nowrap;    text-align: center;    overflow: auto}.ps-scrollbar-x-rail {    height: 2px !important}.ps-scrollbar-x {    height: 2px !important;    bottom: 0 !important;    background: rgba(169, 169, 169, .55) !important}.edit-playlist-container {    position: fixed;    left: 0;    right: 0;    top: 0;    bottom: 0;    z-index: 10000;    background: rgba(255, 255, 255, .34);    text-align: center;    vertical-align: middle;    visibility: hidden;    opacity: 0;    -webkit-transition: .3s all;    -o-transition: .3s all;    -moz-transition: .3s all;    transition: .3s all}.edit-playlist-container.active {    opacity: 1;    visibility: visible}.edit-playlist-window {    position: relative;    display: inline-block;    max-width: 100%;    width: 820px;    background: #fff;    padding: 6px;    -webkit-border-radius: 4px;    -moz-border-radius: 4px;    border-radius: 4px;    -webkit-box-shadow: 0 0 24px 0 #969696;    -moz-box-shadow: 0 0 24px 0 #969696;    box-shadow: 0 0 24px 0 #969696;    max-height: 100%;    vertical-align: middle}table.edit-playlist-table {    width: 100%;    min-width: 520px;    border-collapse: collapse}.edit-playlist-container:before {    content: "";    vertical-align: middle;    height: 100%;    display: inline-block;    margin-left: -.25em}.edit-playlist-container .save {    position: relative;    width: auto;    min-width: 120px;    left: auto;    margin: 9px 0;    bottom: 0;    display: inline-block}.edit-playlist-table-scroll {    position: relative;    width: 100%;    max-height: 620px;    overflow: auto}td.edit-playlist-snack-cover {    width: 75px;    height: 75px;    background-position: center !important;    -moz-background-size: cover !important;    -o-background-size: cover !important;    background-size: cover !important}.edit-playlist-table-row th:first-of-type {    width: 75px}.edit-playlist-table td:nth-of-type(4),.edit-playlist-table-row th:nth-of-type(4) {    width: 50px}input.edit-playlist-search {    position: relative;    width: 100%;    border: none;    padding: 6px;    text-align: center}.edit-playlist-close {    position: absolute;    width: 30px;    height: 30px;    background: #fff;    cursor: pointer;    text-align: center;    top: -9px;    right: -9px;    -moz-background-size: contain;    -o-background-size: contain;    background-size: contain;    -webkit-border-radius: 30px;    -moz-border-radius: 30px;    border-radius: 30px;    z-index: 56;    -webkit-box-shadow: 6px -5px 5px -4px rgba(150, 150, 150, .29);    -moz-box-shadow: 6px -5px 5px -4px rgba(150, 150, 150, .29);    box-shadow: 6px -5px 5px -4px rgba(150, 150, 150, .29);    font-size: 28px;    line-height: 23px;    text-align: center;    color: #aeaeae}.edit-playlist-table label {    position: absolute;    left: 0;    top: 0;    width: 100%;    height: 100%;    cursor: pointer;    -webkit-transition: .3s all cubic-bezier(.25, .46, .45, .94);    -o-transition: .3s all cubic-bezier(.25, .46, .45, .94);    -moz-transition: .3s all cubic-bezier(.25, .46, .45, .94);    transition: .3s all cubic-bezier(.25, .46, .45, .94);    -moz-background-size: 35px;    -o-background-size: 35px;    background-size: 35px;    background: #f2f2f2 no-repeat center;}label.active {    background-image: url('/images/icons/correct.png');    background-color: #4caf50}.snack-options, .classroom-options {    visibility: hidden;    position: absolute;    right: 1px;    width: 209px;    bottom: -100%;    -webkit-box-shadow: 0 2px 6px -2px rgba(156, 156, 156, .68);    -moz-box-shadow: 0 2px 6px -2px rgba(156, 156, 156, .68);    box-shadow: 0 2px 6px -2px rgba(156, 156, 156, .68);    z-index: 106;    -webkit-transition: .3s all cubic-bezier(.65, .05, .36, 1);    -o-transition: .3s all cubic-bezier(.65, .05, .36, 1);    -moz-transition: .3s all cubic-bezier(.65, .05, .36, 1);    transition: .3s all cubic-bezier(.65, .05, .36, 1)}.snack-options.active, .classroom-options.active {    visibility: visible;    bottom: 48px;    top: auto !important;    top: unset !important;    height: auto !important;}.snack-options:before, .classroom-options:before {    content: "";    width: 0;    height: 0;    border-style: solid;    border-width: 10px 11px 0 11px;    border-color: #e2e2e2 transparent transparent transparent;    position: absolute;    bottom: -11px;    right: 22px;    -webkit-transition: .3s all;    -o-transition: .3s all;    -moz-transition: .3s all;    transition: .3s all}.snack-options:after, .classroom-options:after {    content: "";    width: 0;    height: 0;    border-style: solid;    border-width: 10px 10px 0 10px;    border-color: #fff transparent transparent transparent;    position: absolute;    bottom: -9px;    right: 23px;    -webkit-transition: .3s all;    -o-transition: .3s all;    -moz-transition: .3s all;    transition: .3s all;    z-index: 10000}.snack-option, .classroom-option {    position: relative;    float: left;    height: auto;    z-index: 21;    width: 100%;    background-position: left;    line-height: 33px;    padding: 7px;    border-bottom: 1px solid #efefef;    -moz-background-size: auto 28px;    -o-background-size: auto 28px;    background-size: auto 28px;    background-position: 20px center;    background-repeat: no-repeat;    color: black;}div.snack-option:last-of-type, div.classroom-option:last-of-type {    border: none}.snack-option.icon-duplicate {    background-image: url('/images/icons/duplicate.png')}.snack-option.icon-history {    background-image: url('/images/icons/version_history.png');    background-size: 19px;    background-position: 25px center;    color: black;}.snack-option.icon-trash, .classroom-option.icon-trash, .snackIcon.icon-trash {    background-image: url('/images/icons/trash.png');    -moz-background-size: auto 25px;    -o-background-size: auto 25px;    background-size: auto 25px;    background-position: 22px center}.snackIcon.icon-trash {    background-position: center;    background-size: 21px;}.icon-more:before {    content: 'A';    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAB8klEQVRoQ+1YzW7TQBCeWSU5l3N7aHmLJO2pqKDmsDu+oD4FBwjiCSpRlQtPgbC061uawqlNBG8BUnkAeIFMtciWrEggu54lWbQ+rSx75vuZXX02QuQXRo4fEoFNOxjMASI6ZOaRJ6iUWlprlyHIihOYTCaPBoNBDgDHa4Cvmfl5URQ/JYmIEyCizxV4RPzGzL7HvgfNzPOiKJ5tLQGt9ZFS6qYE+MI5996vsyx7ycyX5f2Rc+6LFAlRB4wxrxHxrVfeWvu4DlJrfaeU2gOAqXOuItOZhygBIpoCwAUAfHfOHdTQIRHdAcDuVhPQWo/8ieOBI+Ira+07vzTGvEHE8/L+0Fr7tbP0ZQFRB3xNY8wVIj7169Vq9UMp5Xt45f01c86dSoH/LYhksZLADgB8qEjU6s96vd5Znue/JHuKE6jAEdEQAMbl2Cwkx6YuQDACkir/rVYi8K+U/lOf5MB/60DUcbrf739ExCdr7sQRp40xnyrw0cVpPzYAcJvidIuTQfQYrb4Hoo3TWZaNmXkRdZwmojkAnKQ43XAfiO6Bes8UpzftQMP+nR8LNkKdkTUskAg0FCrYY8EcSHG6oWfiDqQ43VD56jFRB6L/O53idMvxCfJzN8Xpli6IbuIUp1uqH2QPPABDp1eCjVAnVC1ejp7APe7OGkCyRJfXAAAAAElFTkSuQmCC) no-repeat center;    -moz-background-size: 25px;    -o-background-size: 25px;    background-size: 25px;    width: 11px;    height: 33px;    display: inline-block;    position: relative;    color: transparent}.smiley-box-wrapper {    width: 256px !important;    min-height: 130px;    position: absolute;    right: 50px;    top: -8px;    display: block;    box-shadow: 0 0 5px 0 #404040;    z-index: 500;}.smiley-types {    position: relative;    float: left;    width: 100%;    height: 37px;    background: #fff;    text-align: left;    line-height: 0;    z-index: 9999;    overflow: auto;    white-space: nowrap;    border-bottom: 1px solid #e1e1e1;    overflow: hidden;    overflow-x: auto;}.smiley-types span {    position: relative;    /* padding: 0 6px; */    /* margin: 0 3px; */    align-items: center;    height: 36px;    display: inline-flex;    text-align: center;    justify-content: center;    top: 0;    width: 32px;}.smiley-types span.active {    /* background: #ededed */    box-shadow: inset 0 -3px 0 0 var(--main-color);}.snack-option:hover, .classroom-option:hover {    background-color: #fbfbfb}.snackIcon:first-of-type {    -webkit-box-shadow: none;    -moz-box-shadow: none;    box-shadow: none}.poll-holder .poll-container canvas {    width: 160px;    float: none;    display: inline-block;    height: 160px;    margin: 7px 0}.poll-holder .poll-container .pollQuestionsWrapper {    max-height: 160px !important;    max-width: 350px !important;    float: none;    height: auto !important;    width: auto !important}.poll-holder .poll-container .pollQuestionsWrapper:before {    content: "";    vertical-align: middle;    height: 100%;    display: inline-block;    margin-left: -.25em}/*.snackData:before {    content: "";    vertical-align: middle;    height: 100%;    display: inline-block;    margin-left: -.25em}*/.poll-scroll .poll {    display: inline-block;    float: none}.poll-scroll .pollQuestionsWrapper {    display: inline-block;    float: none}.poll-scroll .pollQuestions {    display: inline-block;    vertical-align: top}.poll-scroll .pollQuestion {    width: auto;    display: block;    float: none}.customSelect.open span.icon-arrow_down {    right: 7px}.snack-option.icon-export {    background-image: url('/images/icons/export.png?')}.snack-options.active.export .snack-options-holder {    -webkit-transform: translate3d(0, -127px, 0);    -moz-transform: translate3d(0, -127px, 0);    transform: translate3d(0, -127px, 0)}.snack-options-holder, .classroom-options-holder {    position: relative;    display: block;    z-index: 10;    height: auto !important;    background: #fff;    float: left;    -webkit-transition: .3s all;    -o-transition: .3s all;    -moz-transition: .3s all;    transition: .3s all;    -webkit-transition-delay: 0s;    -moz-transition-delay: 0s;    -o-transition-delay: 0s;    transition-delay: 0s;    width: 100%}.snack-export {    position: absolute;    bottom: 0;    right: 0;    width: 100%;    background: #f9f9f9;    z-index: 1;    height: auto;    border-top: 1px solid #e9e9e9}.snack-export.active {    -webkit-transform: translate3d(0, 0, 0);    -moz-transform: translate3d(0, 0, 0);    transform: translate3d(0, 0, 0)}.snack-export .snack-option {    padding-left: 7px;    line-height: 17px;    border-bottom: 1px solid rgba(224, 224, 224, .56);    font-size: 13px;    background: #f9f9f9;    color: black;    text-decoration: none;}.line {    position: relative;    display: block;    float: left;    width: 100%}.dashboard {    position: fixed;    top: 0;    right: 0;    left: 0;    bottom: 0;    background: #f4f4f4;    z-index: 6000;    text-align: center;    vertical-align: middle;    visibility: hidden;    opacity: 0;    -webkit-transition: .3s all;    -o-transition: .3s all;    -moz-transition: .3s all;    transition: .3s all}.dashboard-header {    position: relative;    display: block;    width: 100%;    /* display: none */}.dashboard-user-data {    position: relative;    display: block;    width: 100%;    text-align: left;    padding: 5px 15px;    background: #fff}.dashboard-user-data .user-pic {    width: 50px;    height: 50px !important;    display: inline-block;    cursor: default}.dashboard-user-data .username {    margin: 0 10px;    font-weight: 600}.dashboard-close {    position: absolute;    right: 0;    top: 0;    width: 50px;    height: 50px;    text-align: center;    line-height: 50px;    font-size: 40px;    font-weight: 300}.dashboard-profile {    display: inline-block;    position: relative;    background: 0 0;    width: 100%;    max-width: 600px;    margin-top: 65px}.dashboard .user-name {    margin: 0;    padding: 10px 0;    min-height: 66px}.dashboard .user-data {    padding: 15px 0 0 0;    background: rgba(255, 255, 255, .51)}.dashboard .user-points {    margin: 0;    height: auto;    padding: 6px 0;    background: rgba(255, 255, 255, .33)}.dashboard.active {    opacity: 1;    visibility: visible}.userCenter:hover .notificationBar {    visibility: visible;    opacity: 1}select::-ms-expand {    display: none}.dashboard-container {    position: relative;    display: block;    width: 100%;    height: 100%;    overflow: auto;    padding: 110px 0 65px;}.noscroll {    overflow: hidden}.user-date {    color: var(--main-color) !important;}.dashboard-edit-profilepic {    position: absolute;    right: -35px;    width: 22px;    height: 22px;    background: url('/images/icons/edit_pen.png') no-repeat right;    -moz-background-size: contain;    -o-background-size: contain;    background-size: contain;    top: 0;    cursor: default}.playlist-scroller {    position: relative;    display: inline-block;    white-space: nowrap}.playlist.open .playlist-scroller {    white-space: normal}.tile:after {    content: "";    position: absolute;    left: 0;    top: 0;    width: 100%;    height: 100%;    -webkit-transition-duration: .3s;    -moz-transition-duration: .3s;    -o-transition-duration: .3s;    transition-duration: .3s;    background: 0 0;    visibility: hidden;    opacity: 0;    background: #fff;    z-index: 6667;    -webkit-transition-property: opacity, visibility;    -o-transition-property: opacity, visibility;    -moz-transition-property: opacity, visibility;    transition-property: opacity, visibility;    -webkit-border-radius: 8px;    -moz-border-radius: 8px;    border-radius: 8px}.tile.transluscent:after {    visibility: visible;    opacity: .6}.dashboard .user-date {    display: inline-block;    width: auto;    font-size: 14px;    font-weight: 400;    color: #000 !important;    top: -9px}.dashboard .user-stats {    background: rgba(255, 255, 255, .55);    max-width: 100%}.dashboard .user-block {    background: rgba(255, 255, 255, .34);    max-width: 100%}.dashboard .stat span {    margin: 0 !important}.dashboard .stat span:first-of-type {    font-size: 20px}.user-points-mobile {    display: none}.input span {    position: absolute !important;    left: 0 !important;    top: -moz-calc(100% - 30px);    display: block !important;    width: auto !important;    color: #b6b6b6;    -webkit-transition: .3s all;    -o-transition: .3s all;    -moz-transition: .3s all;    transition: .3s all;    top: 0;    transform: translate3d(0, 8px, 0);    transform-origin: top left}.input input {    background: 0 0;    width: 100%;    border: none;    font-size: inherit}.input input ~ span.active,.input input ~ span.active {    color: var(--main-color);    transform: translate3d(0, -15px, 0) scale3d(.8, .8, .8);}.user-data .save {    visibility: visible;    opacity: 1}.playlist-toggle {    position: absolute;    right: 20px;    bottom: 7px;    cursor: pointer;    font-size: 17px;    color: #9e9e9e;    z-index: 555}.user-data .input input {    /*    background: url('/images/icons/edit_pen.png') no-repeat right;*/    -moz-background-size: 22px;    -o-background-size: 22px;    background-size: 22px;    padding-right: 30px;    z-index: 55;    position: relative;    display: block;    border-bottom: 1px solid #d1d1d1;}.user-name span {    width: auto !important;    position: relative;    display: inline-block}span.crown {    position: relative;    display: inline-block;    width: 25px !important;    height: 22px;    margin: 0 1px}span.crown:before {    content: "";    position: absolute;    left: 0;    bottom: -2px;    width: 25px;    height: 22px;    background: url('/assets/crown_2.png?1') no-repeat center;    -moz-background-size: contain;    -o-background-size: contain;    background-size: contain}input:invalid {    -webkit-box-shadow: none;    -moz-box-shadow: none;    box-shadow: none}.scroll-top {    position: fixed;    bottom: 45px;    right: 9px;    background: #fff;    text-align: center;    width: 55px;    height: 55px;    z-index: 5555;    -webkit-border-radius: 55px;    -moz-border-radius: 55px;    border-radius: 55px;    background: url('/images/icons/arrow_up.png') no-repeat center #fff;    -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .16), 0 2px 10px 0 rgba(0, 0, 0, .12);    -moz-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .16), 0 2px 10px 0 rgba(0, 0, 0, .12);    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .16), 0 2px 10px 0 rgba(0, 0, 0, .12);    -webkit-transform: translateZ(0);    -moz-transform: translateZ(0);    transform: translateZ(0);}.close {    position: fixed;    height: 50px;    width: 50px;    color: #fff;    z-index: 550;    font-size: 60px;    line-height: 50px;    text-align: center;    top: 10px;    right: 10px}.smiley-box .smiley-box-container-wrapper {    border: 2px solid #d3d3d3;    position: relative;    border-radius: 3px;    height: 100%;    width: 100%;    display: flex;}.smiley-box .smiley-box-container {    width: 100%;    min-height: 55px;    border-radius: 3px;    resize: none;    border-right: none;    position: relative;    background-color: #fff;    /* margin-right: 35px; */    padding: 0 55px 0 0;    height: 100%;    display: flex;    flex-direction: column;}.smiley-box textarea {    outline: 0 !important;    width: 100%;    resize: none;    border: 0;    position: relative;    display: block;    color: inherit;    height: 100%;    padding: 5px;    margin-top: 0;    flex-shrink: 0;    flex-grow: 1;}.disable-hover {    pointer-events: none}.user-data .user-name.current-pw input {    background: 0 0}.editorElements {    position: relative;    display: inline-block;    width: 100%;    text-align: center;    z-index: 9999;    display: none}#dialogArea > ul > li > div {    clear: both;    float: none !important;    position: relative;    display: table;    table-layout: fixed;}.loginbox .bubble {    margin: 4px 5px}.socialLogin .bubble {    width: 45%;    display: inline-block;    float: none;    min-width: 215px;    border-radius: 0;    vertical-align: top;    background-size: 30px;    background-position: center;    background-repeat: no-repeat;    background-color: #fff;    box-shadow: 0 0 0 1px #e2e2e2}.socialLogin .bubble:hover {    background-color: #f9f9f9}.loginbox .btn.red {    margin-top: 17px}.site-information {    position: fixed;    top: 0;    left: 0;    width: 100%;    height: 100%;    background: rgba(0, 0, 0, .54);    z-index: 55555;    overflow: hidden;    visibility: hidden;    opacity: 0;    transition: 450ms all;}.site-information pre {    top: 50%;    left: 50%;    width: 768px;    max-width: 100%;    position: absolute;    transform: translate3d(-50%, -50%, 0);    background: #fff; /* padding: 15px; */    max-height: 90vh;    overflow: hidden;    -webkit-overflow-scrolling: inherit;    white-space: normal;    line-height: 1.2; /* padding-top: 66px; */    display: block;}.site-information.active {    visibility: visible;    opacity: 1}.site-information .close {    position: absolute;    display: block;    color: #000;    float: right;    line-height: 47px;    top: 0;    right: 0;    height: 59px;    font-size: 50px;    font-weight: lighter;}.site-information h2 {    position: relative;    top: 0;    left: 0;    padding: 15px;    width: 100%;    margin: 0;    display: block;    border-bottom: 1px solid #e8e8e8;}.site-information_scroller {    position: relative;    display: block;    overflow: auto;    padding: 15px;    white-space: pre-line;    max-height: calc(90vh - 66px);}.copy-snack_modalwrapper, .classroom-prompt_modalwrapper {    position: fixed;    top: 0;    left: 0;    right: 0;    bottom: 0;    width: 100%;    height: 100%;    background: rgba(255, 255, 255, 0.49);    z-index: 9999;}.copy-snack_modal, .classroom-prompt_modal, .classroom-prompt_link-error, .clasroom-prompt-help_window {    position: absolute;    left: 50%;    top: 50%;    width: 640px;    max-width: 100%;    max-height: 100%;    /* min-height: 400px; */    background: white;    transform: translate3d(-50%, -50%, 0);    padding: 15px;    border-radius: 4px;    box-shadow: 0 0 7px 0px #0000008a;    text-align: center;    overflow: auto;    cursor: default;}.classroom-prompt_checkbox-wrapper {    display: inline-block;    margin: 0 !important;    width: 50%;}.classroom-prompt_checkbox {    display: inline-block;    margin: 10px auto;}.copy-snack_cc-icon {    position: relative;    display: block;    width: 100%;    background: url('/images/icons/svg/by-sa.svg') no-repeat center;    height: 52px;    background-size: auto 40px;}.copy-snack_title, .classroom-prompt_title {    position: relative;    display: block;    width: 100%;    font-size: 17px;    font-weight: bold;}.copy-snack_allowed {    position: relative;    display: block;    width: 100%;    font-size: 25px;    font-weight: bold;}span.copy_snack_share__title,span.copy_snack_edit__title {    position: relative;    display: inline-block;    font-weight: bold;    font-size: 23px;}.copy-snack_checkbox-label {    display: inline-block;    width: auto;    position: relative;    margin: 10px 0;}.copy-snack_checkbox-label:before {    position: absolute;    display: block;    width: 30px;    height: 30px;    border-radius: 0;    border: 1px solid black;    content: "";    right: 0;    top: 50%;    transform: translate3d(40px, -50%, 0);}.copy-snack_checkbox-label.active:after {    content: "";    position: absolute;    width: 30px;    height: 30px;    color: #fff;    font-family: sans-serif;    font-weight: bold;    right: 0;    transform: translate3d(39px, -50%, 0);    top: 50%;    background: url('/images/icons/correct.png') no-repeat center;    background-size: 25px;}.copy-snack_checkbox-label.active {    background: transparent;}.copy-snack_checkbox-label.active:before {    background: #4caf50;    border: 1px solid white;    box-shadow: 0 0 0 1px #4caf50;}.copy-snack_button {    position: relative;    display: block;    margin: 10px auto !important;    min-width: 140px;    height: 52px;    background: var(--main-color);    line-height: 52px;    border: 1px solid white;    color: white; /* box-shadow: 0 0 0 1px #4caf50; */    font-size: 20px;    width: 260px;    margin-top: 15px;    cursor: pointer;    transition: 450ms all;}.copy-snack_button[disabled] {    background: lightgrey;    box-shadow: none;    cursor: default;}.copy-snack_modal > div, .classroom-prompt_modal > div {    margin: 13px 0;    z-index: 55;}.copy-snack_modal__close, .classroom-prompt_modal__close {    position: absolute;    right: 0;    top: 0;    width: 32px;    height: 32px;    font-size: 30px;    margin: 0 !important;    text-align: center;    line-height: 32px;    color: #515151;    cursor: pointer;    z-index: 5555;}.classroom-button.absolute {    position: absolute;    right: 0;    top: 0;    z-index: 1;}.classroom-button.absolute .snackIcon.icon-more {    width: 33px !important;}.snackIcon.icon-more.oer.classroom {    position: relative;}.version-history_table table {    position: relative;    display: table;    margin: 0 auto;    border-collapse: collapse;}.version-history_table table td {    padding: 10px;    text-align: left;}.copy-snack_modal .customCheckbox.noselect {    display: inline-block;    width: auto;    float: none;    white-space: nowrap;}.version-history_table table tr:nth-child(even) {    background: var(--main-color);    color: white;}.version-history_table table tr:nth-child(odd) {    background: white;}.version-history_table table tr:nth-child(even) td a {    color: white;}.version-history_table table tr:nth-child(odd) td a {    color: black;}.history_snack-title {    color: var(--main-color);}.format-help_button-container {    display: block;    position: relative;    float: right;}.formating-help_container h2 {    line-height: 1.2;}div#mailfield {    border: none;}.business .filter-categories .item:after {    content: "";    position: absolute;    width: 100%;    top: 0;    left: 0;    height: 100%;    box-shadow: inset 0 0 0 10px #fbfbfb;    z-index: 222;}.business .filter-categories .item.active:after {    box-shadow: inset 0 0 0 10px var(--main-color);}.category-inner {    position: relative;    display: table;    height: 100%;    width: 100%;}.tooltip.clean {    position: relative;    display: block;    min-height: 0;    box-shadow: none;    border: none;    background: transparent;    color: red;    font-size: 13px;    top: 0 !important;    margin: 0;    left: 0 !important;    padding: 0;}.tooltip.clean:after {    content: none;}.tooltip.clean .tooltipText {    color: red;}.classroom-block {    position: relative;    min-width: 320px;    max-width: 100%;    display: inline-block;}.classroom-prompt_snack-table {    position: relative;    border: none;    width: 100%;    margin: 0 auto;    padding-left: 20px;}.classroom-prompt_snack-table td {    border: none;    width: 100%;}td.classroom-prompt_snack-table__code {    width: 80px;    font-size: 14px;}td.classroom-prompt_snack-table__index {    width: 30px;    font-size: 14px;}td.classroom-prompt_snack-table__code input {    border: none;    width: 100%;    position: relative;    font-size: 16px;}.classroom.classroom_school-class {    position: relative;    display: table;    width: 100%;    height: 100%;}.classroom.classroom_school-class .classroom_school-class_text {    font-weight: bold;    color: rgba(255, 255, 255, 0.64);    font-size: 46px;    vertical-align: middle;    text-align: center;    display: table-cell;}.classroom-bottom .data {    width: 100%;    color: black;}.classroom-bottom .data .snackIcon:before {    line-height: 34px;}.menu-icon.icon-classroom {    font-size: 34px;    width: auto;}.tile .code-overlay {    position: absolute;    left: 0;    top: 0;    width: 100%;    height: 100%;    background: transparent;    z-index: 55;}.tile .code-overlay div {    position: absolute;    left: 50%;    top: 50%;    color: rgba(255, 255, 255, 0.64);    font-size: 46px;    transform: translate(-50%, -50%);    font-family: 'PT-mono';}.classroom-block .btn, .classroom-block .btn input {    text-align: center;}.classroom-pin-block:before {    content: "";    position: relative;    display: block;    width: 100%;    height: 250px;    background: url('/images/classroom.png') no-repeat center / cover;}.classroom-snack-count {    color: var(--main-color);}.classroom-edit {    font-size: 20px;}.print-btn {    background: url('/images/icons/print.png') no-repeat center;    width: 45px;    height: 45px;    z-index: 69 !important;    float: left;    cursor: pointer;    position: absolute;    top: 0;    right: 0;}.playlist.business .playlist-arrow.right {    background-image: url('/images/business_arrow-r.png');}.playlist.business .playlist-arrow.left {    background-image: url('/images/business_arrow-l.png');}.skin-selector {    position: relative;    display: block;    height: 51px;    text-align: right;    padding-top: 6px;    padding-right: 10px;    border-top: 1px solid #e1e1e1;}.active-emoji {    position: absolute;    display: block;    width: 45px;    height: 45px;    left: 9px;    top: 3px;}.skin-selector img {    width: 32px;    height: 32px;}.active-emoji img {    width: 45px;    height: 45px;}.skin-selector div {    width: 25px;    height: 25px;    border-radius: 100%;    border: 2px solid #d6d5d5;    position: relative;    display: inline-block;    margin: 0 2px;}.emoji-selector-footer {    display: block;    position: relative;    background: white;}.snack-comments_container {    position: fixed;    top: 0;    width: 768px;    height: 100%;    background: transparent;    z-index: 10000;    /* box-shadow: inset 2px 0px 8px -1px #a3a3a370; */    left: 50%;    margin-left: -256px;    transform: translateY(120%);    transition: .45s transform ease;    padding-bottom: 35px;}.snack-comments_container.visible {    transform: translateY(0);}.snack-comment {    position: relative;    display: block;    width: 100%;    padding: 0 10px;    border-bottom: 1px solid #efefef;}.snack-comment .snack-comment {    margin: 0;    border: none;    padding-right: 0;}pre.snack-comment_text {    padding: 5px 10px 5px 5px;    line-height: 1.2;}.snack-comment .giphy-gif {}.comment-footer {    display: inline-block;    text-align: right;    /* padding: 0 10px; */    width: 100%;    white-space: nowrap;    height: 18px;    margin-top: 6px;}.comment-footer > div {    position: relative;    display: inline-block;    font-size: 12px;    vertical-align: top;}.snack-comments_header h2 {    margin: 0;    text-align: center;    background: transparent;    display: table-cell;    vertical-align: middle;}.add-comment .add-comment_button-container {    white-space: nowrap;}.add-comment button:hover {    background: #7d2753;}.snack-comments {    overflow: visible;}.smiley-box-wrapper.vertical {    top: 0;    transform: translateY(-100%);    right: 0;}.smiley-chooser.open-smiley-box.vertical:after, .smiley-chooser.open-smiley-box.vertical:before {    position: absolute;    top: 50%;    border-style: solid;    border-width: 13px 12px 0 12px;    display: block;    margin-top: -10px;    content: ""}.smiley-chooser.open-smiley-box.vertical:before {    right: 5px;    border-color: rgba(174, 174, 174, 1) transparent transparent transparent;    z-index: 299;    top: 0px;    margin: 0;}.smiley-chooser.open-smiley-box.vertical:after {    right: 5px;    border-color: #d7d7d7 transparent transparent transparent;    z-index: 300;    top: 0;    margin: 0;}.comment-footer_left-block {    font-size: 11px !important;    padding: 0 5px;    float: left;    color: #a7a7a7;    text-align: left;}.snack-comment.selected {    background: rgb(240, 240, 240);    color: black;}.snack-comments-scroller {    position: absolute;    display: block;    width: 100%;    overflow: auto;    z-index: 22;    background: white;    transition: .45s all;    top: 67px;    bottom: 77px;    border-top: 1px solid #d2d2d2;}.snack-comments-scroller.smaller {    height: calc(100% - 88px);}.snack-comment .youtube-wrapper {    max-width: 100%;}.add-comment_button {    text-align: center;    width: 100%;    bottom: 0;    position: absolute;    left: 0;    background: #b4b4b4;    color: white;    padding: 0;}.add-comment {    position: absolute;    display: block;    height: 45px;    /* border-top: 2px solid #a6a6a6; */    z-index: 55;    bottom: 32px;    left: 0;    width: 100%;}.kommentare-button {    line-height: 65px;    position: relative;    display: block;    cursor: pointer;}.add-comment_post {    width: 100px;    color: white;    background: #9c3368;    display: inline-block;    border: none;    position: relative;    height: 45px;    line-height: 45px;    vertical-align: top;    font-size: 17px;}.comment-input-box {    position: relative;    width: calc(100% - 100px);    display: inline-block;}.comment-input-box .smiley-box textarea {    background: #9c3368;    border: 1px solid #9c3368;    color: white;    font-size: 17px;    height: 58px;}.comment-input-box .smiley-box-container {    background: #9c3368;}.comment-input-box .smiley-box .smiley-box-container-wrapper {    border-color: #9c3368;    border-radius: 0;    background: #9c3368;}.close-comments_button {    position: absolute;    /* left: 45px; */    top: 0;    width: 45px;    height: 67px;    background: url("/images/icons/svg/arrow_left.svg") no-repeat center;    background-size: 20px;    /* transform: rotate(90deg); */    cursor: pointer;    transform-origin: left top;}.answer-preview {    position: absolute;    top: 1px;    transform: translateY(-100%);    display: block;    width: 100%;    left: 0;    background: #9c3368;    border-radius: 4px 4px 0 0;    white-space: normal;    color: white;    padding: 7px 30px 7px 7px;}.snack-comments_header {    height: 67px;    box-shadow: inset 0px -1px 7px -6px #a6a6a6;    display: table;    width: 100%;    background: white;}.cancel-answer {    position: absolute;    display: block;    height: 40px;    font-size: 28px;    color: white;    line-height: 40px;    top: 50%;    transform: translateY(-50%);    width: 30px;    right: 0;    text-align: center;    font-weight: bold;}.answer-preview_text {    position: relative;    display: block;    background: rgba(255, 255, 255, 0.31);    padding: 8px;}.add-comment .ic {    background: url('/images/icons/editor/smiley_white.png') no-repeat center #9c3368;    background-size: 20px;}.add-comment .smiley-chooser {    background: transparent;}.user-indicator {    position: absolute;    height: 100%;    width: 5px;    border-radius: 0;    top: 0;    left: 0;}.snack-comment .snack-comment .user-indicator {    left: 5px;}.comment-footer_answer,.comment-footer_delete {    margin: 0 2px;    color: #a7a7a7;}input.edit-textinput {    width: 100%;    background: transparent;    border: none;    font-size: 14px;    padding: 5px;}.add-comment input.edit-textinput {    color: white;    font-size: 16px;    height: 41px;}span.comment-user {    width: 140px;    overflow: hidden;    text-overflow: ellipsis;    display: inline-block;    white-space: nowrap;    vertical-align: bottom;}span.comment-time {    display: inline-block;    vertical-align: bottom;}.add-comment input.edit-textinput::-webkit-input-placeholder {    color: #fff;}.add-comment input.edit-textinput:-moz-placeholder {    color: #fff;}.add-comment input.edit-textinput::-moz-placeholder {    color: #fff;}.add-comment input.edit-textinput:-ms-input-placeholder {    color: #fff;}.classroom-help {    color: black;    text-decoration: none;}.classroom-prompt_snack-table .customCheckbox {    width: 30px;    display: inline-block;    vertical-align: middle;}.classroom-prompt_snack-table input {    width: 100%;    border: none;    font-size: 15px;    background: #e0e0e0;    padding: 8px;    border-radius: 5px;}.classroom-prompt.classroom-prompt_remove-snack {    display: inline-block;    position: relative;    left: auto;    top: auto;    bottom: auto;}.classroom-prompt_snack-table input.code-input {    background: transparent;    text-align: center;    font-family: 'PT-mono';}.swap-classroom-snacks {    position: absolute;    left: 160px;    bottom: -6px;    width: 20px;    height: 20px;    transform: translate(-50%, 50%);    background: url('/images/icons/svg/swap.svg') no-repeat center #ffffff;    background-size: 10px;    z-index: 22;    border-radius: 100%;    box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.32);    cursor: pointer;}.linked {    position: absolute;    width: 32px;    height: 38px;    background: url('/images/emoji/svg/1f517.svg') no-repeat center;    z-index: 56;    background-size: 19px;    right: 0;    top: 0;}.classroom-prompt_link-error ol {    text-align: left;}.classroom-prompt_link-error h3,.classroom-prompt_link-error h4 {    margin: 0;}.classroom-prompt_link-error h4 {    font-weight: normal}.classroom-prompt_help_button {    position: relative;    display: inline-block;    width: 13px;    height: 13px;    border-radius: 100%;    background: var(--main-color);    cursor: help;    top: -7px;    color: white;    font-size: 11px;    line-height: 1.2;    text-align: center;}.classroom-prompt_link-error {    text-align: left;    padding-left: 25px;}.clasroom-prompt-help_window {    text-align: left;}.classroom-prompt.classroom-prompt_remove-snack {    width: 19px;    height: 19px;    position: absolute;    display: block;    left: -23px;    top: 10px;}.classroom-prompt_remove-snack:before {    position: absolute;    left: 2px;    top: 5px;    line-height: 0;    display: block;    height: 5px;}.classroom-prompt_snack-table > li {    position: relative;    margin: 13px 0;}.classroom-prompt__item {    display: flex;    align-items: flex-start;    justify-content: space-between;}.classroom-prompt_snack-table {    padding-left: 30px;    text-align: left;    list-style: none;}span.classroom-prompt_snack-table__title {    width: 320px;    display: flex;    position: relative;}span.classroom-prompt_snack-table__code {    position: relative;    display: flex;    flex-direction: column;    width: 65px;    justify-content: center;    align-items: center;}.classroom-prompt_modal h2 {    text-align: left;    font-weight: normal;    position: relative;}.classroom-prompt_modal {    padding: 15px 28px;}.classroom-prompt_modalwrapper .btn {    width: 100%;}.classroom-prompt_snack-table--headline {    padding-left: 30px;    display: flex;    justify-content: space-between;    line-height: 1;}span.classroom-prompt_snack-table--headline_title {    width: 320px !important;    line-height: 1;}span.classroom-prompt_snack-table__state {    position: relative;    width: 80px;    text-align: center;    display: flex;    flex-direction: column;    align-items: center;}.classroom-propmpt__snack-table__item-wrapper {    position: relative;    display: flex;    justify-content: space-between;}span.classroom-prompt_snack-table__code--title,span.classroom-prompt_snack-table__state--title {    display: none;}.classroom-prompt_snack-table--headline span {    width: 80px;}.classroom-prompt_snack-table--headline span:last-of-type {    width: 65px;}.classroom-prompt_title {    font-size: 20px;}.classroom-pin.btn, .classroom-input.btn {    margin: 13px 0;}span.classroom-prompt_item-counter {    position: absolute;    left: 0;    transform: translate(-150%, -50%);    top: 50%;}ol.classroom-prompt_snack-table {    padding-left: 0px;}span.classroom-prompt_item-counter {    position: relative;    display: inline-block;    width: 35px;    transform: none;    top: initial;    left: initial;    text-align: center;    background: #e0e0e0;    padding: 6px;    height: 39px;    border-radius: 5px 0 0 5px;    font-size: 19px;    vertical-align: top;    line-height: 1.3;}.classroom-prompt_snack-table__title input {    width: calc(100% - 40px);    border-radius: 0 5px 5px 0;}.classroom-prompt_button {    margin-top: 20px !important;    width: 320px !important;    display: inline-block;    max-width: 100%;}.change__password__title, .change__password__title h2 {    width: 80%;    margin: 0 auto;    display: block;    text-align: left;}.folder__create__button {    position: relative;    border: 1px solid #cccccc;    height: 245px;    display: inline-flex;    flex-direction: column;    justify-content: center;    text-align: center;    align-items: center;    cursor: pointer;    background: transparent;    transition: all .45s ease;    color: black;}.folder__create__button:hover {    background: rgba(255, 255, 255, 1);}.folder__create__button img {    width: 70px;    margin-bottom: 20px;}.folder__create__button span {    font-size: 16px;}.dialog {    position: fixed;    left: 0;    right: 0;    text-align: center;    bottom: 0;    top: 0;    z-index: 10000;    background: rgba(255, 255, 255, 0.8);    transition: all 450ms ease-in-out;    overflow: auto;    display: flex;    justify-content: center;    align-items: center;}.dialog__container {    width: 100%;    height: auto;    vertical-align: middle;    display: inline-block;    background: #fff;    border-radius: 4px;    box-shadow: 0 0 14px -3px #000;    /*! overflow: hidden; */    max-width: 505px;    position: relative;    /*! max-height: 100%; */}.dialog__header {    color: #000;    border-bottom: 1px solid #C3C3C3;    margin: 0;    padding: 12px 5px;    font-size: 20px;    height: 56px;    position: relative;    display: flex;    align-items: center;    justify-content: center;}.dialog__content {    padding: 16px 24px;    min-height: 225px;}.dialog__close {    position: absolute;    right: 0px;    height: 100%;    display: flex;    align-items: center;    justify-content: center;    top: 50%;    transform: translateY(-50%);    font-size: 22px;    cursor: pointer;    width: 50px;    color: #b1b1b1;    border: none;    background: none;}.dialog__close svg {    width: 1em;    height: 1em;    overflow: visible;    display: inline-block;}.dialog__content__title {    font-size: 18px;    text-align: left;}.dialog__input {    width: 100%;}.dialog__input input {    width: 100%;    text-align: left;    border: none;    color: #000;    font-size: 14px;    padding: 7px;    margin: 12px 0;    height: 50px;    background: #F0F0F0;    border-radius: 3px;    outline: #b8b8b8;}.dialog__button {    width: 100%;    height: 50px;    background: var(--main-color);    cursor: pointer;    color: white;    font-size: 18px;    display: flex;    font-weight: bold;    justify-content: center;    align-items: center;    border-radius: 3px;    text-decoration: none;    margin: 12px 0;    border: none;    transition: .45s ease background, .45s ease color;}.dialog__button[disabled] {    background: var(--light-color);    color: var(--shaded-color);    cursor: default;}.dialog__header h2 {    height: 100%;    display: flex;    justify-content: center;    align-content: center;    text-align: center;}.dialog__header h2 span {    color: #000;    font-size: 20px;}img.folder-meta__icon {    width: 120px;}.folder-meta__content {    display: flex;    flex-direction: column;    height: 100%;    justify-content: flex-start;    align-items: flex-start;}.folder-meta {    display: inline-flex;    gap: 25px;    position: relative;    width: 100%;    flex-direction: column;    justify-content: space-between;    align-items: flex-start;    padding: 32px;    margin-bottom: 10px;}.folder__meta__back-button {    cursor: pointer;    display: flex;    justify-content: flex-start;    align-content: center;    /*! gap: 15px; */    font-size: 20px;}.folder__meta__back-arrow {    color: var(--main-color);}.folder__meta-row {    display: flex;    gap: 25px;    height: 100px}.folder-meta__title {    font-size: 24px;    font-weight: bold;}.folder-meta__actions {    display: flex;    gap: 20px;    margin-top: 15px;}button.folder-meta__action {    border: none;    color: var(--main-color);    font-weight: bold;    background-position: left center;    background-size: 18px auto;    cursor: pointer;    transition: .45s ease transform;    background-color: transparent;    background-repeat: no-repeat;    position: relative;    display: flex;    justify-content: space-between;    align-items: center;    gap: 5px;    height: 20px;}button.folder-meta__action:hover {    transform: scale(1.05)}button.folder-meta__action span.icon-trash {    background-image: url('/images/icons/trash.png');    background-size: auto 17px;    background-position: center;    background-repeat: no-repeat;}.folder-meta__count-red {    color: var(--main-color);    font-weight: bold;}.main-bg {    background: var(--main-color)}button.folder {    border: none;}.folder-bottom {    display: flex;    justify-content: space-between;    align-items: center;}.folder-bottom .data {    display: flex;    justify-content: center;    align-items: center;    gap: 4px;}.folder-bottom .snackIcon, .folder-bottom .icon {    position: relative;    top: auto !important;    left: auto !important;    display: flex;    align-items: center;    justify-content: center;    height: 100% !important;}.folder-bottom .snackIcon:before, .folder-bottom .icon:before {    position: relative;    top: auto !important;    left: auto !important;}.folder .channelimgHolder img {    width: 40%;    height: auto !important;}.folder .channelimgHolder {    display: flex;    justify-content: center;    align-items: flex-start;    padding-top: 20%;    max-height: 100% !important;    height: 245px;}.icon-add-snack {    background: url('/images/icons/svg/add_snack.svg') no-repeat 22px center;    background-size: 25px auto;}.simple__snack {    position: relative;    display: flex;    justify-content: space-between;    align-items: center;    height: 55px;    width: 100%;    gap: 7px;}.simple__snack__cover {    position: relative;    width: 75px;    height: 55px;    box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.3);    margin-left: 8px;}.simple__snack__data {    position: relative;    display: flex;    flex-direction: column;    justify-content: flex-start;    align-items: flex-start;    width: 100%;    padding-left: 15px;    text-align: left;}.dialog__snack__list {    display: flex;    flex-direction: column;    justify-content: flex-start;    align-items: flex-start;    width: 100%;    gap: 5px;    position: relative;    height: 300px;    overflow: auto;    padding: 5px 0;}.simple__snack_views {    font-size: 16px;    font-weight: bold;}.simple__snack__title {    font-size: 14px;}.folder-meta__action > span:first-of-type {    width: 17px;    height: 100%;    display: inline-block;}.snack__overview__container {    text-align: center;    padding: 0 7px;    margin-bottom: 40px;}.snack__overview__container > h2 {    position: relative;    display: inline-block;    color: #767676;    -webkit-transition: .3s all;    -o-transition: .3s all;    -moz-transition: .3s all;    transition: .3s all;    cursor: pointer;    margin: 0;    font-size: 24px;    font-weight: 700}.snack__overview__container--inner {    text-align: center;}.add-snacks-folder {    align-items: flex-start;}@media (min-width: 1024px) {    .snack__overview__container {        padding: 0 30px;    }    .folder-meta {        margin-bottom: 32px;    }    .add-snacks-folder {        align-items: center;    }}.breadcrumbs__back {    display: flex;    justify-content: center;    align-items: center;    margin-right: 10px;    cursor: pointer;}.breadcrumbs__back::before {    border-style: solid;    border-width: 4px 4px 0 0;    content: '';    display: inline-block;    height: 10px;    position: relative;    transform: rotate(225deg);    vertical-align: top;    width: 10px;    color: var(--main-color);}.different-folder {    position: absolute;    left: 85px;    width: 30px;    text-align: center;    z-index: 5;    color: black;    font-weight: bold;} @media screen and (min-width: 1024px) {    .editor-element:hover {        border: none;        background-color: var(--shaded-color) !important    }    .editor-element:hover .hint {        display: inline-block !important    }}@media screen and (max-width: 1400px) {    .snack-settings.open {        right: 50%;        margin-right: -25px    }    .snack-settings {        bottom: 50px    }    .snack-settings {        right: 10px    }    .scroll-top {        bottom: 120px;        right: auto;        transform: translate3d(-10px, 0, 0);        right: 0;    }}@media screen and (max-width: 1024px) {    .snack-settings {        bottom: 50px    }    .playlist-title h2:hover {        color: #767676    }    .snack-option.icon-history {        background-position: 13px    }    .loginbox .logo {        transform: none !important;    }    .snack-comments_container {        width: 100%;        height: 100%;        left: 0;        margin-left: 0;    }    .snack-comments_header {        height: 35px;    }    .close-comments_button {        height: 35px;    }    .snack-comments_header h2 {        font-size: 17px;    }    .snack-comments-scroller {        /* height: calc(100% - 69px); */        top: 36px;    }    .add-comment {        /* height: 51px; */        bottom: 32px;    }    .comment-input-box {        height: 100%;    }    .comment-input-box .smiley-box textarea {        height: 46px;    }    .add-comment_post {        /* height: 51px; */        /* line-height: 51px; */    }}@media screen and (max-width: 1024px) and (orientation: portrait) {    .editorOverlay {        background: #fff !important    }    .mainContent {        width: 100%;        margin-top: 0;        -webkit-box-shadow: none !important;        -moz-box-shadow: none !important;        box-shadow: none !important    }    .menuOpen .mainContent {        margin-top: 60px    }    .menuButtons .button {        margin-left: 8px    }    .contentContainer {        top: 95px;        left: 0;        right: 0    }    .categories {        width: 100% !important;        height: auto    }    .categories .list li {        width: 33%;        float: left    }    .menu {        top: 0;        padding-top: 0;        padding: 15px 0    }    .site-information pre {        height: 100%;        max-height: 100%;        white-space: normal    }    .site-information_scroller {        max-height: calc(100% - 66px)    }    .comment-input-box {        /* height: 100%; */    }    .comment-input-box .smiley-box textarea {        height: 48px;    }    .add-comment_post {        /* height: 52px; */        /* line-height: 52px; */    }}@media screen and (max-width: 1023px) {    .mobile-sidebar-container {        position: relative;        width: 100%;        height: auto;        float: left;        padding: 0 0 40px 0;        min-height: 100%;        text-align: center    }    .snack-comments-scroller {        /* padding-bottom: 45px; */        /* height: calc(100% - 69px); */    }    .add-comment {        /* height: 52px; */        bottom: 0px;    }    .sidebar-user-line {        position: relative;        display: inline-block;        width: auto;        height: 45px;        white-space: nowrap    }    .sidebar-bottom-line {        position: absolute;        display: block;        height: auto;        text-align: left;        bottom: 0;        width: 100%;        line-height: 30px    }    .sidebar-logo {        width: 100%;        position: relative;        display: block;        float: left;        height: 65px;        background-image: url(/images/ls_logo.png);        -moz-background-size: 185px;        -o-background-size: 185px;        background-size: 185px;        background-position: center;        background-repeat: no-repeat    }    .sidebar-user-line .username {        font-weight: 600;        text-align: left;        position: relative;        height: 45px;        display: inline-block;        cursor: default;        vertical-align: middle;        margin: 0 15px;        padding-top: 8px    }    .sidebar-user-data {        position: relative;        float: left;        display: block;        width: 100%;        overflow: hidden;        background: #f6f6f6;        padding: 0 10px;        text-align: left    }    .sidebar-user-line .username span {        position: relative;        height: auto;        color: #414141;        vertical-align: middle    }    .sidebar-user-line .username span:before {        content: "";        vertical-align: middle;        height: 100%;        display: inline-block;        margin-left: -.25em    }    .sidebar-logout {        position: absolute;        right: 17px;        font-size: 14px;        color: var(--main-color);        bottom: 15px;        display: block;        height: 25px;        line-height: normal;        z-index: 555    }    div#sidebarContainer {        position: fixed;        top: 0;        z-index: 10000;        left: 0    }    .data-holder {        height: auto    }    .channel-data h2 {        height: auto;        font-size: 15px    }    img.folder-meta__icon {        width: 60px;        height: 50px;    }    .folder-meta__title {        font-size: 16px;    }    .folder-meta__count {        font-size: 14px;    }    .folder-meta__actions {        gap: 2px;        justify-content: center;        align-items: flex-start;    }    .folder .channel-data h2 {        height: auto;    }    .sidebar-user-data .line.arrow:after {        content: "";        position: relative;        display: inline-block;        width: 9px;        height: 12px;        background-position: center;        -moz-background-size: 6px;        -o-background-size: 6px;        background-size: 6px;        background-image: url(/images/arrow-r-small.png);        margin-left: 4px;        background-repeat: no-repeat    }    a.sidebar-impressum, a.sidebar-feedback {        position: relative;        color: #a0a0a0;        display: block;        padding-left: 0;        font-size: 14px;        width: 100%;        float: left    }    .sidebar-language {        white-space: nowrap;        position: relative;        display: block;        float: left;        padding-left: 10px    }    .sidebar-social-buttons {        position: relative;        display: block;        float: left;        height: 30px    }    .sidebar-social-buttons a {        font-size: 27px;        color: #323232;        margin: 0 4px;        height: auto;        line-height: 0    }    .sideBarLine.social-like span {        margin: 0    }    span.sidebar-map-icon {        display: block;        width: 37px;        height: 34px;        font-size: 30px;        position: absolute;        left: 42px;        top: 0;        background: url("/images/icons/map.png") no-repeat center;        background-size: 32px    }    .sidebar-map-button {        color: #323232;        font-size: 17px    }    .user-pic:after {        background-position: center 80px;        -moz-background-size: 19px;        -o-background-size: 19px;        background-size: 19px;        opacity: 1 !important    }    .sidebar-user-data .line {        margin: 7px 0;        padding-left: 0    }    .loginBtn {        display: none    }    span.menu-divider {        display: none    }    .menu-buttons {        display: none    }    .menu-secondary .button.active.secondary:after {        display: none    }    .menu-buttons.main {        display: block;        height: 100%;        width: 100%    }    .menu .menu-buttons .button {        width: auto;        margin: 0 10px    }    .button.active.main:after {        display: none    }    .menu-buttons.filter {        display: none    }    .profilepic-small {        display: none    }    .headerMenusOverlay,    .mobileSidebar {        background-color: #fff;        position: absolute;        left: 0;        top: 0    }    .tile .snackTile {        width: 100%;        height: 113px;        background-position: center;        background-repeat: no-repeat;    }    .snack-option {        font-size: 12px;    }    .snackInfo {        top: 88px    }    .addFromHeader {        display: none    }    .tools {        -webkit-transition: background 250ms ease-in-out, -webkit-transform 250ms ease-in-out;        -moz-transition: background 250ms ease-in-out, -moz-transform 250ms ease-in-out;        -o-transition: background 250ms ease-in-out, -o-transform 250ms ease-in-out;        transition: background 250ms ease-in-out, -webkit-transform 250ms ease-in-out;        -moz-transition: background 250ms ease-in-out, transform 250ms ease-in-out, -moz-transform 250ms ease-in-out;        -o-transition: background 250ms ease-in-out, transform 250ms ease-in-out, -o-transform 250ms ease-in-out;        transition: background 250ms ease-in-out, transform 250ms ease-in-out;        transition: background 250ms ease-in-out, transform 250ms ease-in-out, -webkit-transform 250ms ease-in-out, -moz-transform 250ms ease-in-out, -o-transform 250ms ease-in-out;        -webkit-transform: translate3d(0, 0, 0);        -moz-transform: translate3d(0, 0, 0);        transform: translate3d(0, 0, 0);        bottom: 0    }    .headerMenusOverlay {        width: 100%;        height: 54px;        z-index: 3    }    div#sidebarWrapper {        display: block    }    .mobileSidebar {        width: 270px;        height: 100%;        padding: 10px;        overflow: auto    }    .sideBarLine,    .sideBarUserInfo {        height: auto;        width: 100%;        position: relative;        float: left;        display: block    }    .channelimgHolder img,    .editorTools,    .searchbar,    .sideBarUserInfo,    .snackPic,    .subMenu,    div#editArea {        overflow: hidden    }    .sideBarUserInfo {        padding: 10px 2px;        text-align: center    }    .sideBarLine {        line-height: 30px;        text-align: left;        color: #323232;        text-decoration: none;        cursor: pointer;        font-size: 15px;        white-space: nowrap;        padding-left: 10px    }    .sideBarLine .button {        width: 100%;        float: left;        position: relative;        display: block;        height: 40px;        color: #525252    }    .subMenu {        height: auto;        background-color: #fff;        max-height: 0;        -webkit-box-shadow: none !important;        -moz-box-shadow: none !important;        box-shadow: none !important    }    .subMenu.open {        max-height: 300px;        overflow: auto;        -webkit-transform: translate3d(0, 0, 0);        -moz-transform: translate3d(0, 0, 0);        transform: translate3d(0, 0, 0)    }    .subMenu .list-channel {        -webkit-box-shadow: none;        -moz-box-shadow: none;        box-shadow: none;        border-bottom: 1px solid #efefef;        height: 35px;        line-height: 35px;        color: #000    }    .sidebarFriendButton,    .sidebarFriendButton.accept {        -webkit-box-shadow: -1px 0 0 rgba(140, 140, 140, .51) inset;        -moz-box-shadow: -1px 0 0 rgba(140, 140, 140, .51) inset;        box-shadow: -1px 0 0 rgba(140, 140, 140, .51) inset    }    .sidebarFriend .username {        position: relative;        width: auto;        float: left;        top: 13px;        margin-left: 10px    }    .sidebarFriend a {        position: relative;        float: left;        width: 55px;        height: 55px;        overflow: hidden;        border: 2px solid #fff;        background-color: #fff;        -webkit-box-shadow: 0 1px 4px 0 rgba(0, 0, 0, .37);        -moz-box-shadow: 0 1px 4px 0 rgba(0, 0, 0, .37);        box-shadow: 0 1px 4px 0 rgba(0, 0, 0, .37);        -webkit-border-radius: 60px;        -moz-border-radius: 60px;        border-radius: 60px;        background-position: center;        -moz-background-size: cover;        -o-background-size: cover;        background-size: cover;        display: block;        background-repeat: no-repeat    }    .sidebarFriend,    .sidebarFriendButtons {        width: 100%;        height: auto;        position: relative;        float: left    }    .sidebarFriend {        padding: 2px    }    .sidebarFriendButtons {        background-color: #fff;        text-align: center;        font-size: 25px;        margin: 4px 0    }    .sidebarFriendButton {        position: relative;        float: left;        width: 50%;        text-align: center;        color: var(--main-color);        background-color: #fff;        height: 100%    }    .friendRequestCount {        position: absolute;        top: 17px;        right: 5px;        min-width: 20px;        height: 20px;        background-color: var(--main-color);        -webkit-border-radius: 20px;        -moz-border-radius: 20px;        border-radius: 20px;        text-align: center;        color: #fff;        line-height: 20px;        font-size: 13px;        padding: 0;        margin: 0    }    .sidebarFriendButton.decline {        -webkit-box-shadow: 1px 0 0 rgba(140, 140, 140, .51) inset;        -moz-box-shadow: 1px 0 0 rgba(140, 140, 140, .51) inset;        box-shadow: 1px 0 0 rgba(140, 140, 140, .51) inset    }    .subMenu .item {        position: relative;        float: left;        width: 55px;        height: 70px;        color: #000 !important    }    .subMenu .item .text {        line-height: 1;        color: #000    }    a.sideBarLine.login {        height: 40px;        color: #fff;        font-size: 20px;        background-color: #a5356d;        text-align: center;        line-height: 40px;        padding: 0    }    .mobileSideBarOpen .mobileIcon.icon-menu,    div#sideBarOverlay {        background-color: rgba(0, 0, 0, 0)    }    .sideBarLine.create {        font-size: 16px;        font-weight: 600;        text-align: center;        line-height: 43px;        color: #fff;        min-height: 43px;        background: var(--main-color);        padding: 0 5px;        margin: 10px 0    }    .sideBarLine.create span {        margin-right: 15px;        font-size: 1.4em;        position: absolute;        left: 5px;        color: var(--main-color);        top: 7px;        line-height: inherit    }    .sideBarLine.create span.icon-cookie:before {        line-height: 70px    }    .subMenu .item .icon {        color: #000    }    .item.selected .icon {        color: #878787 !important    }    .item.selected .text {        color: #878787 !important    }    .subMenu .item .icon.selected {        color: #c1c1c1 !important    }    .sideBarLine.openSubMenu {        max-height: 100%;        height: auto !important;        line-height: initial    }    .sideBarLine.cat {        height: auto    }    .sidebar-user-line .profilePic {        position: relative;        float: none;        width: 40px;        height: 40px;        overflow: hidden;        border: 2px solid #fff;        background: #fff;        -webkit-box-shadow: 0 1px 4px 0 rgba(0, 0, 0, .37);        -moz-box-shadow: 0 1px 4px 0 rgba(0, 0, 0, .37);        box-shadow: 0 1px 4px 0 rgba(0, 0, 0, .37);        -webkit-border-radius: 60px;        -moz-border-radius: 60px;        border-radius: 60px;        background-position: center;        -moz-background-size: cover;        -o-background-size: cover;        background-size: cover;        display: inline-block;        top: 3px;        vertical-align: middle;        left: 3px    }    .sideBarUserInfo .profilePic img {        width: 100%;        margin: 0 auto;        height: auto;        position: relative;        float: left    }    .sideBarUserInfo .username {        position: relative;        float: none;        margin: 0;        text-align: left;        width: auto;        color: var(--main-color);        line-height: 1;        display: block;        font-size: 1.2em;        text-align: center;        padding: 2px    }    .header,    .subMenu {        -webkit-box-shadow: 0 1px 29px -5px rgba(0, 0, 0, .2);        -moz-box-shadow: 0 1px 29px -5px rgba(0, 0, 0, .2);        box-shadow: 0 1px 29px -5px rgba(0, 0, 0, .2);        height: auto    }    .header.slim {        height: auto    }    .desktopMenuOpen .mainContent {        margin-top: 100px    }    .userPic {        width: 120px;        height: 120px;        margin: 7px auto    }    html.mobileSideBarOpen {        overflow: hidden !important    }    .mobileSideBarOpen #sidebarWrapper {        -webkit-transform: translate3d(0, 0, 0);        -moz-transform: translate3d(0, 0, 0);        transform: translate3d(0, 0, 0)    }    div#sideBarOverlay {        -webkit-transition: background 250ms ease-in-out, -webkit-transform 250ms ease-in-out;        -moz-transition: background 250ms ease-in-out, -moz-transform 250ms ease-in-out;        -o-transition: background 250ms ease-in-out, -o-transform 250ms ease-in-out;        transition: background 250ms ease-in-out, -webkit-transform 250ms ease-in-out;        -moz-transition: background 250ms ease-in-out, transform 250ms ease-in-out, -moz-transform 250ms ease-in-out;        -o-transition: background 250ms ease-in-out, transform 250ms ease-in-out, -o-transform 250ms ease-in-out;        transition: background 250ms ease-in-out, transform 250ms ease-in-out;        transition: background 250ms ease-in-out, transform 250ms ease-in-out, -webkit-transform 250ms ease-in-out, -moz-transform 250ms ease-in-out, -o-transform 250ms ease-in-out    }    .mobileIcon,    .sortBarIos {        -webkit-transition: all 250ms ease-in-out;        -moz-transition: all 250ms ease-in-out;        -o-transition: all 250ms ease-in-out    }    .mobileSideBarOpen div#sideBarOverlay {        position: fixed;        -webkit-transform: translate3d(270px, 0, 0);        -moz-transform: translate3d(270px, 0, 0);        -ms-transform: translate3d(270px, 0, 0);        -o-transform: translate3d(270px, 0, 0);        transform: translate3d(270px, 0, 0);        width: 100%;        background-color: rgba(0, 0, 0, .3);        height: 100%;        z-index: 11000    }    .mobileIcon {        height: 40px !important;        width: 40px !important;        background-color: #fff !important;        top: 0 !important;        color: var(--main-color) !important;        font-size: 1.55em !important;        z-index: 5 !important;        text-align: center !important;        cursor: pointer !important;        display: inline-block !important;        -webkit-transition: all 250ms ease-in-out !important;        -moz-transition: all 250ms ease-in-out !important;        -o-transition: all 250ms ease-in-out !important;        transition: all 250ms ease-in-out !important;        -webkit-transform: translate3d(0, 0, 0) !important;        -moz-transform: translate3d(0, 0, 0) !important;        transform: translate3d(0, 0, 0) !important;        position: relative !important    }    .mobileIcon.icon-lupe {        float: right    }    .mobileIcon.icon-lupe:before {        line-height: 40px    }    .button-holder {        top: 3px;        right: 0    }    .menuToggle.icon-menu.mobileIcon {        position: relative;        float: left;        top: -5px !important    }    .sortBarIos {        top: 0;        padding-top: 7px;        -webkit-transition: all 250ms ease-in-out;        -moz-transition: all 250ms ease-in-out;        -o-transition: all 250ms ease-in-out;        transition: all 250ms ease-in-out;        z-index: 0;        display: block;        -webkit-transform: translate3d(0, -60px, 0);        -moz-transform: translate3d(0, -60px, 0);        transform: translate3d(0, -60px, 0);        position: absolute    }    #sidebarWrapper,    div#learningSnacksSearchbar:before {        -webkit-transition: all 250ms ease-in-out;        -moz-transition: all 250ms ease-in-out;        -o-transition: all 250ms ease-in-out;        top: 0    }    .menuOpen.sort .sortBarIos {        -webkit-transform: translate3d(0, 43px, 0);        -moz-transform: translate3d(0, 43px, 0);        transform: translate3d(0, 43px, 0);        -webkit-box-shadow: 0 1px 29px rgba(0, 0, 0, .51);        -moz-box-shadow: 0 1px 29px rgba(0, 0, 0, .51);        box-shadow: 0 1px 29px rgba(0, 0, 0, .51)    }    .sortToggle {        position: absolute;        right: 40px;        text-align: right;        padding-right: 2px    }    .loginOr,    .menuItems,    .notificationButton,    .openTools,    .searchbar input {        text-align: center    }    .searchToggle {        position: absolute;        right: 0    }    .mobileIcon:before {        position: relative;        display: inline-block;        vertical-align: middle;        line-height: 40px    }    div#footer {        display: none    }    .angular-google-map {        position: relative;        width: 100%;        height: 100%;        padding-bottom: 0 !important    }    .show-my-location.icon-location {        left: 6px;        bottom: 24px;        top: inherit    }    .range-holder {        top: 0;        left: 60px    }    .range-holder:after {        border-width: 12px 8px 12px 0;        border-color: rgba(255, 255, 255, 0) #fff rgba(255, 255, 255, 0);        top: 13px;        left: -7px;        right: inherit    }    #sidebarWrapper {        position: fixed;        height: 100%;        background-color: rgba(0, 0, 0, .51);        -webkit-transform: translate3d(-100%, 0, 0);        -moz-transform: translate3d(-100%, 0, 0);        transform: translate3d(-100%, 0, 0);        z-index: 9998;        max-width: 100%;        width: 100%;        -webkit-transition: all 250ms ease-in-out;        -moz-transition: all 250ms ease-in-out;        -o-transition: all 250ms ease-in-out;        transition: all 250ms ease-in-out    }    .menuOpen .mainContent {        -webkit-transform: translate3d(0, 53px, 0);        -moz-transform: translate3d(0, 53px, 0);        transform: translate3d(0, 53px, 0);        margin-top: 0    }    .menuOpen.search .searchbar {        -webkit-transform: translate3d(0, 43px, 0);        -moz-transform: translate3d(0, 43px, 0);        transform: translate3d(0, 43px, 0);        -webkit-box-shadow: 0 1px 29px rgba(0, 0, 0, .51);        -moz-box-shadow: 0 1px 29px rgba(0, 0, 0, .51);        box-shadow: 0 1px 29px rgba(0, 0, 0, .51);        z-index: -1    }    .userCenter {        position: fixed;        right: initial;        top: 0;        background: #fff;        -webkit-border-radius: 0;        -moz-border-radius: 0;        border-radius: 0;        border: none;        display: none    }    .butons div {        width: 35px;        height: 35px    }    .rankingContainer {        width: 25px    }    .rankingContainer .snackRankStar {        width: 25px;        height: 25px    }    .fab.approvement {        bottom: 25px;        right: auto;        left: 10px    }    .scroll-top {        bottom: 65px;        right: 5px;        left: auto;        transform: translate3d(0, 0, 0)    }    .snack .getHiddenUrl .hiddenLinkExplanation {        font-size: 13px    }    .snack .getHiddenUrl {        font-size: 15px    }    .snack .getHiddenUrl div {        margin-top: 0;        margin-bottom: 0;        padding: 1px;        height: 20px    }    .snack .getHiddenUrl div:nth-of-type(2) {        opacity: 0;        -webkit-transition: all .3s ease-in-out;        -moz-transition: all .3s ease-in-out;        -o-transition: all .3s ease-in-out    }    .snack .getHiddenUrl.active div:nth-of-type(2) {        opacity: 1    }    .snackPic {        height: 113px !important    }    .notApproved {        width: 100%;        height: 113px !important    }    .editTools {        display: block;        position: absolute;        width: 100%;        bottom: 0;        top: 0;        left: 0;        right: 0;        margin-left: 0;        margin-top: 0;        display: none    }    .editorElements {        display: flex;        flex-direction: column;    }    .userInfo.likedCount {        display: none    }    .stars,    .views {        width: 50%    }    .snackData {        padding: 0px 7px;        height: 44px;    }    .snackTitle {        -o-text-overflow: ellipsis;        text-overflow: ellipsis;        overflow: hidden;        width: 100%;        max-height: 37px;    }    .playlist .add-snack,    .tile {        height: 190px;        width: 151px;        margin: 4px    }    :root {        --tile-margin: 4px;        --tile-width: 151px;    }    .channel-info, .classroom-info {        top: 88px;    }    .classroom-info {        top: 88px;    }    .channel-data .data div {        width: 100%;        margin: 0 !important;        line-height: 0;        display: block    }    .channel-data .data .stat {        top: 0;        line-height: 33px !important    }    .channelimgHolder {        max-height: 176px;        height: 154px;        line-height: 0    }    .channel-data .data .icon:before {        display: block;        height: 16px;        font-size: 23px    }    .channelimgHolder .customImage {        height: 113px !important    }    .channel-name, .classroom-name {        height: 44px    }    .channelimgHolder img {        max-height: 300px;        width: 170px;        left: -9px    }    .tile.profile {        height: 239px    }    .profile .userStats {        -webkit-transform: translate3d(0, 206px, 0);        -moz-transform: translate3d(0, 206px, 0);        transform: translate3d(0, 206px, 0)    }    .stats.showStats {        -webkit-transform: translate3d(0, 0, 0) !important;        -moz-transform: translate3d(0, 0, 0) !important;        transform: translate3d(0, 0, 0) !important    }    .stats {        height: 201px;        width: 151px;        -webkit-transform: translate3d(0, 157px, 0);        -moz-transform: translate3d(0, 157px, 0);        transform: translate3d(0, 157px, 0)    }    .profile .stats {        height: 250px    }    .profile .stats.showStats {        -webkit-transform: translate3d(0, -207px, 0) !important;        -moz-transform: translate3d(0, -207px, 0) !important;        transform: translate3d(0, -207px, 0) !important    }    .userStats table {        font-size: 12px    }    .stats .scrollWrapper {        width: 151px;        height: 175px    }    .profile .stats .scrollWrapper {        height: 205px    }    .tile .userPic {        width: 100%;        height: 175px;        max-height: 275px    }    .tile.profile .userPic {        height: 206px    }    .tile .userPic img {        height: 207px;        margin-left: -30px;        position: relative    }    .userProfile {        width: 151px;        height: 241px !important;        margin: 0 3px 21px    }    .userProfile.smaller {        height: 208px !important    }    .userProfile hr {        margin-top: 4px    }    .editOverlay {        height: auto    }    .bigProfilePic img {        width: 100%;        margin-top: 5%    }    .logo {        height: 45px;        right: auto;        z-index: 4;        left: 50%;        display: block;        float: none;        position: absolute;        /* margin-top: 4px!important; */        transform: translate3d(-50%, -50%, 0);        top: 26px;    }    .notificationButton {        min-width: 22px;        height: 22px;        width: auto;        top: 30px;        line-height: 25px;        font-size: 14px;        border: none;        right: 0;        color: #fff;        -webkit-border-radius: 13px;        -moz-border-radius: 13px;        border-radius: 13px;        background: var(--main-color)    }    .editorTools,    div#editArea {        -webkit-transition: all .3s ease-in-out;        -moz-transition: all .3s ease-in-out;        -o-transition: all .3s ease-in-out    }    .searchbar input::-webkit-input-placeholder {        color: var(--main-color)    }    .searchbar input:-moz-placeholder {        color: var(--main-color)    }    .searchbar input::-moz-placeholder {        color: var(--main-color)    }    .searchbar input:-ms-input-placeholder {        color: var(--main-color)    }    div#editorWrapper {        top: 0 !important;        position: relative;        left: 0;        margin: 0;        bottom: 0;        height: auto    }    div#editorToolsWrapper {        width: 100%;        clear: both;        float: none;        min-height: 100%;        height: auto    }    .approveContainer {        top: 55px    }    .openTools {        position: absolute;        display: block !important;        left: 50%;        width: 35px;        height: 20px;        background-color: #8a006a;        bottom: 0;        margin-left: -17px;        -webkit-border-radius: 7px 7px 0 0;        -moz-border-radius: 7px 7px 0 0;        border-radius: 7px 7px 0 0;        background-repeat: no-repeat;        background-position: center;        -moz-background-size: 18px 18px;        -o-background-size: 18px 18px;        background-size: 18px 18px;        cursor: pointer;        color: #fff    }    #dialogHeader input {        width: 70%;        position: relative;        margin: 0 auto;        left: 0 !important;        top: 50%;        border: none;        transform: translate3d(0, -50%, 0)    }    div#lsMenuToggle {        top: 2px !important    }    #editorWrapper div#sClose {        line-height: 31px !important    }    div#dialogHeader {        width: 100%;        left: 0;        right: 0;        margin-left: auto;        height: 40px;        -webkit-box-shadow: 0 2px 2px 0 rgba(142, 142, 142, .18);        -moz-box-shadow: 0 2px 2px 0 rgba(142, 142, 142, .18);        box-shadow: 0 2px 2px 0 rgba(142, 142, 142, .18)    }    .editorTools {        -webkit-transition: all .3s ease-in-out;        -moz-transition: all .3s ease-in-out;        -o-transition: all .3s ease-in-out;        transition: all .3s ease-in-out;        width: 100%;        left: 0;        height: auto;        margin: 0;        padding-bottom: 15px;        padding-top: 2px;        border: none    }    .editorTools .snackCat {        width: 100%;        background-color: transparent;        display: block;        position: absolute;        top: 0;        z-index: 156    }    .editorTools .editorElements {        text-align: center;        width: 100%;        position: absolute;        bottom: 0;        padding: 0;        border: none;        margin: 0;        -webkit-box-shadow: 0 0 10px -2px #000;        -moz-box-shadow: 0 0 10px -2px #000;        box-shadow: 0 0 10px -2px #000;        -webkit-transform: translate3d(0, 0, 0);        -moz-transform: translate3d(0, 0, 0);        transform: translate3d(0, 0, 0);        display: flex;        flex-direction: column;        position: absolute    }    .editorElements span.infoLine {        width: 100%;        height: 30px;        display: block;        float: left;        color: #fff;        background-color: var(--main-color)    }    .editorElements.sticky {        position: fixed;        bottom: inherit !important;        top: 40px;        z-index: 9999;        left: 0;        width: 100%    }    .editor-element {        height: 60px;        -webkit-box-shadow: -1px 0 0 0 #fff;        -moz-box-shadow: -1px 0 0 0 #fff;        box-shadow: -1px 0 0 0 #fff    }    .hint {        top: 72px    }    .editorTools .editorElements div.click:hover {        border: none;        background-color: #925f7a    }    div#dialogArea {        width: 100%;        top: 40px;        position: relative;        left: 0;        height: auto;        padding-bottom: 41px;        overflow: visible;        float: none;        min-height: 100%    }    div#editArea {        bottom: 0;        width: 100%;        position: fixed;        left: 0;        z-index: 9999;        top: initial !important;        height: 40px;        margin: 0;        -webkit-transition: all .3s ease-in-out;        -moz-transition: all .3s ease-in-out;        -o-transition: all .3s ease-in-out;        transition: all .3s ease-in-out    }    #openEditor,    .header.editMode {        -webkit-transition: all .3s ease-in-out;        -moz-transition: all .3s ease-in-out;        -o-transition: all .3s ease-in-out    }    .header.editMode {        -webkit-transition: all .3s ease-in-out;        -moz-transition: all .3s ease-in-out;        -o-transition: all .3s ease-in-out;        transition: all .3s ease-in-out;        opacity: 0;        display: none !important    }    .categories hr,    .menuButtons {        display: none    }    .cropAreaWrapper {        width: 100%    }    .modalWindow {        width: 100% !important;        left: 0 !important;        margin: 0 !important;        position: fixed;        right: 0 !important;        max-width: initial;    }    div#editArea.editMode {        height: 100%    }    div#editArea.editMode #openEditor {        background: url(/images/icons/close_noborder.png) -3px 7px no-repeat #eaeaea;        -moz-background-size: 81% auto;        -o-background-size: 81% auto;        background-size: 81% auto    }    .loginbox {        padding: 7px    }    div#dialogArea ul {        padding-left: 0;        padding-right: 0;        padding-top: 4px;        float: none;        display: block;        clear: both;        height: auto;    }    .snack-settings {        -webkit-transform: translate3d(0, 0, 0);        -moz-transform: translate3d(0, 0, 0);        transform: translate3d(0, 0, 0);        position: fixed;        right: 6px    }    .snack-settings-line {        width: 210px    }    .header:after {        opacity: 0    }    #openEditor {        width: 50px;        height: 50px;        background: url(/images/icons/edit.png) -3px 7px no-repeat #eaeaea;        -moz-background-size: 81% auto;        -o-background-size: 81% auto;        background-size: 81% auto;        position: absolute;        top: -9px;        left: 0;        -webkit-border-radius: 0 0 100%;        -moz-border-radius: 0 0 100%;        border-radius: 0 0 100%;        cursor: pointer;        -webkit-transition: all .3s ease-in-out;        -moz-transition: all .3s ease-in-out;        -o-transition: all .3s ease-in-out;        transition: all .3s ease-in-out    }    .snackIcon.edit {        top: 0    }    .categories {        height: auto;        position: fixed;        left: -100%;        bottom: 0;        z-index: 6000;        -webkit-box-shadow: 41px 0 128px -57px #000;        -moz-box-shadow: 41px 0 128px -57px #000;        box-shadow: 41px 0 128px -57px #000;        top: 80px;        background: #fff !important;        width: 80% !important;        max-width: 0;        padding: 0 0 0 5px;        -webkit-transition: all .3s ease-in-out;        -moz-transition: all .3s ease-in-out;        -o-transition: all .3s ease-in-out;        transition: all .3s ease-in-out    }    .categories .list li,    .links,    .menuItems,    .menuItems .item,    .previewPic img {        position: relative    }    .mc-image-edit .mc-image {        width: 125px;        height: 125px    }    .mc-image-edit .mc-image img {        width: 125px;        height: 125px    }    .categories.open {        left: 0;        max-width: 100%    }    .categories .list li {        width: 100%;        border-bottom: 1px solid #c2c4c4;        padding: 5px    }    .categories .list li a {        position: relative;        float: left;        left: 0;        top: 0;        width: 100%;        height: 100%    }    .categories .list {        padding: 0;        margin-left: -5px    }    ul.pages li {        min-width: 25px;        height: 25px;        font-size: 16px;        line-height: 24px    }    .menuArrowDown {        width: 12px;        height: 8px;        top: 100%;        right: 50%    }    .addAnswer:hover,    .addRemoveMcImg:hover:after,    .removeAnswer:hover {        -moz-transform: none;        -webkit-transform: none;        -o-transform: none;        -ms-transform: none;        transform: none    }    .menu {        -moz-box-shadow: none;        position: absolute;        float: left;        width: 100%;        top: 0;        height: auto;        background: #fff;        padding: 3px 0;        -webkit-transition: all 250ms ease-in-out;        -moz-transition: all 250ms ease-in-out;        -o-transition: all 250ms ease-in-out;        transition: all 250ms ease-in-out;        z-index: 4    }    .headerContainer,    .mainContent {        width: 100%    }    .headerContainer {        min-height: auto;    }    .menu-secondary {        -webkit-transition: all 250ms ease-in-out;        -moz-transition: all 250ms ease-in-out;        -o-transition: all 250ms ease-in-out;        transition: all 250ms ease-in-out    }    .menu-secondary.open {        position: relative;        float: left;        height: auto;        margin: 0;        top: 6px    }    .collapse-menu .menu {        -webkit-transform: translate3d(0, -100px, 0);        -moz-transform: translate3d(0, -100px, 0);        transform: translate3d(0, -100px, 0)    }    .collapse-menu .menu-secondary.open {        -webkit-transform: translate3d(0, -150px, 0);        -moz-transform: translate3d(0, -150px, 0);        transform: translate3d(0, -150px, 0)    }    .menu-secondary .menu-buttons .button {        margin: 0;        font-size: 15px;        height: 100%;        position: relative;        float: left;        width: 50%;        display: block;        line-height: 38px    }    .menu-secondary .button.active {        -webkit-box-shadow: inset 0 -2px var(--main-color);        -moz-box-shadow: inset 0 -2px var(--main-color);        box-shadow: inset 0 -2px var(--main-color)    }    .menuItems {        padding: 0;        display: block;        margin: 0;        width: 100%;        max-height: 100px;        float: left;        height: 38px    }    .menuItems .item {        width: 90px;        height: auto;        cursor: pointer;        display: block;        float: left;        padding-bottom: 5px    }    .container,    body {        width: 100%;        position: relative;        float: none;        height: 100%;        overflow: visible    }    .menuOpen .contentContainer {        left: 74px    }    .collapse-menu .headerContainer {        height: 43px    }    .collapse-menu body {        margin-top: 85px !important    }    .filter {        margin-left: 0;        display: none    }    .contentContainer,    .menuOpen .contentContainer {        top: 90px !important    }    .filter .sortBar,    .filter .title {        width: 100% !important;        margin-bottom: 15px    }    .contentContainer.editor {        top: 55px !important;        margin: 0;        padding: 0;        float: none;        height: 100%;        left: -1px;        right: -10px    }    .loginData,    .loginOr,    .socialLogin {        float: none;        width: 90%;        padding: 7px;        margin: 0 auto    }    .menuOpen .menu {        display: none !important    }    .loginOr {        line-height: 20px;        font-size: 21px;        font-weight: semibold;        height: 35px    }    div#copyright {        font-size: 13px;        margin: -3px auto 0    }    .contentContainer.editor.editMode {        top: 0 !important    }    .previewPic img {        display: block    }    .customSelect {        width: 100%    }    .mc-image {        width: 125px !important    }    div.editArea {        width: 100%;        margin-left: 0    }    .editor-buttons {        width: 100% !important;        margin-left: 0 !important    }    .editor-buttons button {        width: 50%;        float: left    }    #copyright,    .snackPlayerActive .logo {        display: none    }    div#footer-content {        width: 100% !important    }    .links {        font-size: .5em;        margin: 0 auto;        display: block;        float: none;        width: 100%    }    select.language-select {        width: auto;        position: relative;        background: #fff;        color: #5d5d5d;        background: 0 0;        color: #5d5d5d;        -moz-background-size: 15px;        -o-background-size: 15px;        background-size: 15px;        padding-right: 0;        font-size: 16px;        font-weight: 600;        color: var(--main-color);        padding-left: 0;        margin: 5px 0;    }    .dashboard-menu {        top: 53px;        z-index: 9998;        -webkit-box-shadow: 0 -1px 0 0 #f4f4f4;        -moz-box-shadow: 0 -1px 0 0 #f4f4f4;        box-shadow: 0 -1px 0 0 #f4f4f4    }    .ps-scrollbar-x-rail {        opacity: 1 !important    }    .ps-scrollbar-x {        opacity: 1 !important    }    .edit-playlist-window {        position: fixed;        left: 0;        top: 55px;        padding: 0;        right: 0;        bottom: 0;        margin: 0;        -webkit-border-radius: 0;        -moz-border-radius: 0;        border-radius: 0;        width: 100%;        padding-top: 40px    }    .edit-playlist-container:before {        display: none    }    .edit-playlist-close {        -webkit-border-radius: 0;        -moz-border-radius: 0;        border-radius: 0;        -webkit-box-shadow: none;        -moz-box-shadow: none;        box-shadow: none;        top: 0;        right: 0;        -webkit-box-shadow: 0 0 2px 0 #c3c3c3;        -moz-box-shadow: 0 0 2px 0 #c3c3c3;        box-shadow: 0 0 2px 0 #c3c3c3;        width: 40px;        height: 40px;        line-height: 32px;        font-size: 36px    }    input.edit-playlist-search {        position: absolute;        left: 0;        top: 0;        padding: 6px 46px 6px;        height: 40px    }    .edit-playlist-table-scroll {        max-height: 100%    }    .snack-options, .classroom-options {        width: 151px;        right: 0    }    .snack-options:before, .classroom-options:before {        right: 18px;    }    .snack-options:after, .classroom-option:before {        right: 16px    }    .snack-option.icon-trash, .classroom-option.icon-trash {        background-position: 12px    }    .snack-option, .classroom-option {        background-position: 9px;        padding-left: 39px;        text-align: left;    }    .playlist-arrow.right {        background: url(/images/arrow-r.png);        background-position: center;        background-repeat: no-repeat;        background-size: auto    }    .playlist-arrow.left {        background: url(/images/arrow-l.png);        background-position: center;        background-repeat: no-repeat;        background-size: auto    }    .dashboard-container {        padding: 95px 0 0 0    }    .button.secondary.single {        width: 100% !important;    }    .snack-comments-scroller {        /* height: calc(100% - 36px); */        bottom: 45px;    }}@media only screen and (max-width: 980px) and (orientation: landscape) {    .categories {        width: 18% !important    }    .mainContent {        width: 100% !important    }}@media only screen and (max-width: 500px) {    .classroom-propmpt__snack-table__item-wrapper {        display: none;    }    .classroom-propmpt__snack-table__item-wrapper.active {        display: flex;    }    span.classroom-prompt_snack-table__title {        display: block;        width: 100%;    }    .classroom-prompt__item {        display: block;    }    .classroom-prompt_snack-table--headline span:not(.classroom-prompt_snack-table--headline_title) {        display: none;    }    span.classroom-prompt_snack-table__code--title,    span.classroom-prompt_snack-table__state--title {        display: flex;    }    .swap-classroom-snacks {        left: 50%;        display: none;    }    .data-edit-toggle {        width: 30px;        height: 39px;        position: absolute;        background: url('/images/arrow_down.png') no-repeat center;        top: 0;        background-size: 16px;        right: 10px;        transform-origin: center;        transition: .45s transform;    }    .classroom-prompt_snack-table > li:last-of-type .data-edit-toggle {        display: none;    }    .linked {        right: 30px;    }    .data-edit-toggle.active {        transform: rotate(180deg);    }    .swap-classroom-snacks--indicator {        position: relative;        display: inline-block;        width: 33px;        height: 33px;        border-radius: 100%;        background: url(/images/icons/svg/swap.svg) no-repeat center #ffffff;        box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.32);        cursor: pointer;        top: 11px;        margin: 0 8px;    }    .swap-classroom-snacks--indicator.active {        background: url(/images/icons/svg/swap_light.svg) no-repeat center var(--main-color)    }    .swap-classroom-snacks.active {        display: block;    }    .classroom-prompt.classroom-prompt_remove-snack {        left: -25px;    }    .classroom-prompt_checkbox-wrapper {        width: 100%;        text-align: left;    }    .classroom-prompt_checkbox {        width: 250px;        justify-content: center;        display: flex;        margin: 2px auto;    }}@media only screen and (max-width: 760px) {    .mc-switches div {        font-size: 1em !important    }    .mc-switches span.icon {        font-size: 1em !important    }    .editArea .mc-image-container {        float: none !important    }    .playlist {        padding: 0    }    .playlist-toggle {        font-size: 16px;        bottom: 0;        right: 30px    }    .playlist-title h2 {        font-size: 18px    }    .icon-edit.edit-playlist {        font-size: 15px;        line-height: 31px;        height: 27px    }    .playlist-title-arrow:after,    .playlist-title-arrow:before {        width: 2px;        height: 7px    }    .playlist-title-arrow {        top: 3px;        right: -13px    }    .poll-container {        margin: 0;        width: 100%;        height: auto    }    .poll-holder h2 {        border-bottom: 2px solid #8a0745;        height: auto;        padding-bottom: 3px    }    .user-data .user-name span {        width: 100%;        font-size: 14px;    }    .user-block {        margin-top: 0;        padding: 30px 15px    }    .playlist-snacks {        padding-left: 25px    }    span.playlist-title-text {        margin: 0 4px 0 29px    }    .snack__overview__container span.playlist-title-text {        margin: 0 4px 0px 0px;    }    .dashboard-profile {        margin: 0    }    .poll-holder {        width: 100%    }    .dashboard .user-points {        display: none    }    .user-points-mobile {        position: relative;        max-width: 120px;        display: inline-block;        margin: 0 0 0 15px;        border-left: 1px solid #c9c9c9;        padding: 0 0 0 5px;        height: 100%;        vertical-align: middle;        line-height: 30px    }    .user-pic {        margin: 0;        display: inline-block    }    .user-points-mobile > span {        font-size: 18px;        color: var(--main-color);        font-weight: 600    }    .user-date span:first-of-type {        word-spacing: 45px    }    .dashboard-edit-profilepic {        display: none    }    .user-points-mobile:after {        content: "";        position: absolute;        right: -32px;        top: 20px;        width: 32px;        height: 32px;        background: url(/images/golden_coin_small.png) no-repeat center;        background-size: contain    }    .poll-holder .poll-container canvas {        float: left;        width: 110px;        height: 110px    }    .poll-holder .poll-container .pollQuestionsWrapper {        vertical-align: middle    }    .poll-holder .poll-container .poll:before {        content: "";        vertical-align: middle;        height: 100%;        display: inline-block;        margin-left: -.25em    }    .save {        position: relative;        bottom: auto;        left: 0;    }    .socialLogin .bubble {        width: 100%    }    .change__password--row h2 {        font-size: 16px;        margin: 5px 0;    }    .user-data .input input {        font-size: 14px;    }}@media screen and (max-width: 320px) {    .mc-image-edit .mc-image {        width: 77px !important;        height: 77px;        min-height: 50px    }    .save {        bottom: 10px    }    .user-name {        text-align: center    }    .user-date {        width: 100%;        text-align: center    }    .user-stats {        width: 100%;        text-align: center    }    .user-stats .stat span {        text-align: center;        float: none;        margin: 0 3px;        width: 100%;        float: left;        font-size: 13px    }    .mc-image-edit .mc-image img {        width: 80px;        height: 80px    }    .editorTools .editorElements div {        -moz-background-size: auto 45px;        -o-background-size: auto 45px;        background-size: auto 45px    }    .editArea .mc-image-container {        height: 80px !important    }    .addRemoveMcImg {        right: 14px    }    .mc-answer-line .smiley-box {        width: 70%    }    .mc-elements {        position: relative;        float: left;        width: 18% !important    }    ul.smiley-container {        width: 200px !important    }    .smiley-box-wrapper {        width: 200px !important;    }    .user-data .user-name span {        width: 100%    }    .playlist-snacks {        padding-left: 0    }    span.playlist-title-text {        margin: 0 4px    }} @font-face {	font-family: 'Titillium Web';	font-style: normal;	font-weight: 400;	src: local('Titillium Web'), local('TitilliumWeb-Regular'), url(fonts/7XUFZ5tgS-tD6QamInJTcSo_WB_cotcEMUw1LsIE8mM.woff2) format('woff2');	unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF}@font-face {	font-family: 'Titillium Web';	font-style: normal;	font-weight: 400;	src: local('Titillium Web'), local('TitilliumWeb-Regular'), url(fonts/7XUFZ5tgS-tD6QamInJTcZSnX671uNZIV63UdXh3Mg0.woff2) format('woff2');	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000}@font-face {	font-family: 'Titillium Web';	font-style: normal;	font-weight: 600;	src: local('Titillium WebSemiBold'), local('TitilliumWeb-SemiBold'), url(fonts/anMUvcNT0H1YN4FII8wpr_SNRT0fZ5CX-AqRkMYgJJo.woff2) format('woff2');	unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF}@font-face {	font-family: 'Titillium Web';	font-style: normal;	font-weight: 600;	src: local('Titillium WebSemiBold'), local('TitilliumWeb-SemiBold'), url(fonts/anMUvcNT0H1YN4FII8wpr46gJz9aNFrmnwBdd69aqzY.woff2) format('woff2');	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000}@font-face {	font-family: 'Titillium Web';	font-style: normal;	font-weight: 700;	src: local('Titillium WebBold'), local('TitilliumWeb-Bold'), url(fonts/anMUvcNT0H1YN4FII8wpr-y7CP8YvcHYdGV61pt7QTE.woff2) format('woff2');	unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF}@font-face {	font-family: 'Titillium Web';	font-style: normal;	font-weight: 700;	src: local('Titillium WebBold'), local('TitilliumWeb-Bold'), url(fonts/anMUvcNT0H1YN4FII8wprxP6Eu1_xfSBSoi9uie1FdE.woff2) format('woff2');	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000}@font-face {	font-family: 'Titillium Web';	font-style: normal;	font-weight: 400;	src: local('Titillium Web'), local('TitilliumWeb-Regular'), url(fonts/7XUFZ5tgS-tD6QamInJTcdGU7DQ8I6RFMlK0vgclk7w.woff) format('woff')}@font-face {	font-family: 'Titillium Web';	font-style: normal;	font-weight: 600;	src: local('Titillium WebSemiBold'), local('TitilliumWeb-SemiBold'), url(fonts/anMUvcNT0H1YN4FII8wprx7IBmrqA5IG9z8WNe77b9o.woff) format('woff')}@font-face {	font-family: 'Titillium Web';	font-style: normal;	font-weight: 700;	src: local('Titillium WebBold'), local('TitilliumWeb-Bold'), url(fonts/anMUvcNT0H1YN4FII8wpr0bathaSTBR2c4i13_wzlb0.woff) format('woff')}@font-face {	font-family: 'Titillium Web';	font-style: normal;	font-weight: 400;	src: url(fonts/7XUFZ5tgS-tD6QamInJTcQU404wzEgdBsmVXv_TVccA.eot)}@font-face {	font-family: 'Titillium Web';	font-style: normal;	font-weight: 400;	src: local('Titillium Web'), local('TitilliumWeb-Regular'), url(fonts/7XUFZ5tgS-tD6QamInJTcU3KvHLhcNjEHFQzwNtdMQY.ttf) format('truetype')}@font-face {	font-family: 'Titillium Web';	font-style: normal;	font-weight: 600;	src: local('Titillium WebSemiBold'), local('TitilliumWeb-SemiBold'), url(fonts/anMUvcNT0H1YN4FII8wpr4e2tK5W43RXgBRKkM4A5Qg.ttf) format('truetype')}@font-face {	font-family: 'Titillium Web';	font-style: normal;	font-weight: 700;	src: local('Titillium WebBold'), local('TitilliumWeb-Bold'), url(fonts/anMUvcNT0H1YN4FII8wprzsSLeNQG2cy_mKit6iEdYs.ttf) format('truetype')}@font-face {	font-family: 'PT-mono';	src: url(fonts/PTMono-Regular.ttf) format('truetype')}