@charset "utf-8"

.oe_hidden
    display: none !important

.oe_website_editorbar
    position: fixed
    top: 0
    right: 0
    z-index: 10
    display: block
    width: 100%
    padding: 2px
    margin: 0px
    z-index: 10000
    background-color: #414141
    background: -webkit-linear-gradient(#646060, #262626)
    box-sizing: border-box
    li
        display: inline
        color: #eee
        &:hover
            background: rgba(0,0,0,0.2)
            text-shadow: black 0px 0px 3px
            color: white

.oe_website_editorbar .oe_rte_toolbar
    div.dropdown
        display: inline-block
        li
            display: list-item

    button
        font-family: FontAwesome
        font-weight: normal
        font-style: normal
        text-decoration: inherit
        &.oe_button_list
            padding-right: 3px
            &:after
                content: "\F0D7"
                padding-left: 6px

.oe_editable:focus
    outline: none !important

.oe_carousel_options
    cursor: pointer
    position: absolute
    white-space: nowrap
    z-index: 1
    display: none

.oe_snippets
    position: fixed
    left: 0px
    right: 0px
    bottom: 0px
    max-height: 280px
    min-height: 140px
    background: rgb(40,40,40)
    box-shadow: 0px 10px 10px -10px black inset
    overflow-y: auto

.oe_snippet
    display: inline-block
    vertical-align: top
    background: white
    width: 120px
    height: 120px
    border-radius: 3px
    margin: 10px
    margin-right: 0px
    cursor: move
    position: relative
    box-shadow: 0px 3px 10px rgba(0,0,0,0.2)
    overflow: hidden
    -webkit-user-select: none
    user-select: none

    .oe_snippet_thumbnail.oe_label
        text-align: center
        background: rgb(116, 116, 116)
        background-image: radial-gradient(rgba(0,0,0,0.25),rgba(0,0,0,0.4))
        height: 100%
        line-height: 120px
        color: white
        text-shadow: 0px 1px 2px rgba(0, 0, 0, 0.95)

    .oe_snippet_body
        display: none
    & > *
        pointer-events: none

    & > *:first-child:not(.oe_snippet_thumbnail)
        display: block
        -webkit-transform-origin-x: 5px
        -webkit-transform-origin-y: 10px
        -webkit-transform: scale(0.095)


.oe_drop_zone
    display: block
    background: rgba(153, 0, 255, 0.17)
    border-radius: 3px
    height: 32px
    margin: -16px 0px
    -webkit-transition: margin 250ms linear
    &:first-child:not(:last-child)
        margin-top: -8px
        margin-bottom: -24px
    &:last-child:not(:first-child)
        margin-top: -24px
        margin-bottom: -8px
    &.oe_hover
        background: rgba(0, 255, 133, 0.22)
        z-index: 100000
    &:before
        content: ""
        display: block
        border-top: dashed 2px rgba(209, 178, 255, 0.72)
        position: relative
        top: 16px
    &:first-child:not(:last-child):before
        top: 8px
    &:last-child:not(:first-child):before
        top: 24px
    &.oe_hover:before
        border-top: dashed 2px rgba(116, 255, 161, 0.72)

.oe_stop_scrolling
    height: 100%
    overflow: hidden

#mobile-preview.modal
    height: 660px
    background-color: black
    border: 2px solid
    border-radius: 10px
    margin: auto
    position: absolute
    top: 0
    left: 0
    bottom: 0
    right: 0
    max-width: 330px

#mobile-preview
    .modal-header
        border-bottom: 0
        border-top-left-radius: 10px
        border-top-right-radius: 10px
    .modal-body
        max-height: 600px
        padding: 0
        margin: 0

.oe_mobile_viewport
    width: 320px
    height: 568px
    padding: 5px
    border: none

.oe_mobile_preview_header
    .close
        color: lightgrey
        opacity: 1
    .close:hover
        color: darkgrey