/*
  ADOBE CONFIDENTIAL

  Copyright 2016 Adobe Systems Incorporated
  All Rights Reserved.

  NOTICE:  All information contained herein is, and remains
  the property of Adobe Systems Incorporated and its suppliers,
  if any.  The intellectual and technical concepts contained
  herein are proprietary to Adobe Systems Incorporated and its
  suppliers and may be covered by U.S. and Foreign Patents,
  patents in process, and are protected by trade secret or copyright law.
  Dissemination of this information or reproduction of this material
  is strictly forbidden unless prior written permission is obtained
  from Adobe Systems Incorporated.
*/
/**
 * Blocked by @GRANITE-15467: Editor should reuse the granite component and add only editor specific styles.
 */
/*! onboarding.less */
.granite-shell-onboarding {
  width: 100%;
  height: 100%;
}
.granite-shell-onboarding .granite-shell-onboarding-popover {
  box-sizing: border-box;
  padding: 20px;
  background-color: white;
  border-radius: 3px;
  max-width: 380px;
  -webkit-box-shadow: 0px 2px 15px 1px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 0px 2px 15px 1px rgba(0, 0, 0, 0.1);
  box-shadow: 0px 2px 15px 1px rgba(0, 0, 0, 0.1);
}
.granite-shell-onboarding .granite-shell-onboarding-popover coral-steplist {
  display: inline-block;
}
.granite-shell-onboarding .granite-shell-onboarding-popover p {
  font-size: 15px;
  line-height: 1.3;
}
.granite-shell-onboarding .granite-shell-onboarding-popover .editor-Onboarding-subTitle {
  font-size: 1rem;
}
.granite-shell-onboarding .granite-shell-onboarding-popover .u-bold {
  font-weight: bold;
}
.granite-shell-onboarding .granite-shell-onboarding-popover .editor-Onboarding-icon {
  margin-right: 5px;
  margin-left: 5px;
  vertical-align: middle;
}
.granite-shell-onboarding .granite-shell-onboarding-popover .granite-shell-onboarding-skipbutton {
  text-decoration: underline;
  font-size: 14px;
}
.granite-shell-onboarding .granite-shell-onboarding-popover .granite-shell-onboarding-controls {
  float: right;
}
.granite-shell-onboarding .granite-shell-onboarding-popover .granite-shell-onboarding-checkbox {
  display: block;
  color: #6f6f6f;
}
.granite-shell-onboarding-highlight {
  z-index: 0;
  -webkit-transition: all .5s;
  transition: all .5s;
  border: 2px solid #fafafa;
  -webkit-box-shadow: 0 0 0 1000rem rgba(0, 0, 0, 0.3);
  box-shadow: 0 0 0 1000rem rgba(0, 0, 0, 0.3);
  min-height: 38px;
  box-sizing: border-box;
}
.granite-shell-onboarding-highlight.is-hidden {
  border-color: rgba(0, 0, 0, 0.7);
  width: 0;
  height: 0;
  max-height: 0;
  max-width: 0;
  min-height: 0;
  -webkit-transition: none;
  transition: none;
}

/*
 * ADOBE CONFIDENTIAL
 *
 * Copyright 2016 Adobe Systems Incorporated
 * All Rights Reserved.
 *
 * NOTICE:  All information contained herein is, and remains
 * the property of Adobe Systems Incorporated and its suppliers,
 * if any.  The intellectual and technical concepts contained
 * herein are proprietary to Adobe Systems Incorporated and its
 * suppliers and may be covered by U.S. and Foreign Patents,
 * patents in process, and are protected by trade secret or copyright law.
 * Dissemination of this information or reproduction of this material
 * is strictly forbidden unless prior written permission is obtained
 * from Adobe Systems Incorporated.
 */

#InlineEditingUI {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 601;
    pointer-events: none;
    display: none;
}

#InlineEditingUI .cq-RichText-ui,
#InlineEditingUI .cq-imageeditor-ui {
    position: absolute;
    width: 100%;
    height: 100%;
}

#InlineEditingUI .cq-imageeditor-ui {
    pointer-events: auto;
}

.editor-fullscreen-wrapper {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1100;
    background-color: #f5f5f5;
    overflow: hidden;
}

#FullScreenMask {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 1000;
}

/*
 * ************************************************************************
 *  *
 *  * ADOBE CONFIDENTIAL
 *  * __________________
 *  *
 *  *  Copyright 2016 Adobe Systems Incorporated
 *  *  All Rights Reserved.
 *  *
 *  * NOTICE:  All information contained herein is, and remains
 *  * the property of Adobe Systems Incorporated and its suppliers,
 *  * if any.  The intellectual and technical concepts contained
 *  * herein are proprietary to Adobe Systems Incorporated and its
 *  * suppliers and are protected by trade secret or copyright law.
 *  * Dissemination of this information or reproduction of this material
 *  * is strictly forbidden unless prior written permission is obtained
 *  * from Adobe Systems Incorporated.
 *  *************************************************************************
 */

coral-popover[data-rte-dialog="tracklinks"] .rte-dialog-column--rightAligned {
    text-align: right;
}
#InlineEditingUI .rte-ui {
    pointer-events: auto;
}


/*
 * ************************************************************************
 *  *
 *  * ADOBE CONFIDENTIAL
 *  * __________________
 *  *
 *  *  Copyright 2016 Adobe Systems Incorporated
 *  *  All Rights Reserved.
 *  *
 *  * NOTICE:  All information contained herein is, and remains
 *  * the property of Adobe Systems Incorporated and its suppliers,
 *  * if any.  The intellectual and technical concepts contained
 *  * herein are proprietary to Adobe Systems Incorporated and its
 *  * suppliers and are protected by trade secret or copyright law.
 *  * Dissemination of this information or reproduction of this material
 *  * is strictly forbidden unless prior written permission is obtained
 *  * from Adobe Systems Incorporated.
 *  *************************************************************************
 */

coral-popover[data-rte-dialog="tracklinks"] .rte-dialog-column--rightAligned {
    text-align: right;
}
/*
 * ADOBE CONFIDENTIAL
 *
 * Copyright 2017 Adobe Systems Incorporated
 * All Rights Reserved.
 *
 * NOTICE:  All information contained herein is, and remains
 * the property of Adobe Systems Incorporated and its suppliers,
 * if any.  The intellectual and technical concepts contained
 * herein are proprietary to Adobe Systems Incorporated and its
 * suppliers and may be covered by U.S. and Foreign Patents,
 * patents in process, and are protected by trade secret or copyright law.
 * Dissemination of this information or reproduction of this material
 * is strictly forbidden unless prior written permission is obtained
 * from Adobe Systems Incorporated.
 */
/*
 * ADOBE CONFIDENTIAL
 *
 * Copyright 2017 Adobe Systems Incorporated
 * All Rights Reserved.
 *
 * NOTICE:  All information contained herein is, and remains
 * the property of Adobe Systems Incorporated and its suppliers,
 * if any.  The intellectual and technical concepts contained
 * herein are proprietary to Adobe Systems Incorporated and its
 * suppliers and may be covered by U.S. and Foreign Patents,
 * patents in process, and are protected by trade secret or copyright law.
 * Dissemination of this information or reproduction of this material
 * is strictly forbidden unless prior written permission is obtained
 * from Adobe Systems Incorporated.
 */
/*
 * ADOBE CONFIDENTIAL
 *
 * Copyright 2013 Adobe Systems Incorporated
 * All Rights Reserved.
 *
 * NOTICE:  All information contained herein is, and remains
 * the property of Adobe Systems Incorporated and its suppliers,
 * if any.  The intellectual and technical concepts contained
 * herein are proprietary to Adobe Systems Incorporated and its
 * suppliers and may be covered by U.S. and Foreign Patents,
 * patents in process, and are protected by trade secret or copyright law.
 * Dissemination of this information or reproduction of this material
 * is strictly forbidden unless prior written permission is obtained
 * from Adobe Systems Incorporated.
 */
[draggable] {
  -moz-user-select: none;
  -khtml-user-select: none;
  -webkit-user-select: none;
  user-select: none;
}
html {
  height: 100%;
}
body {
  margin: 0;
  padding: 0;
  overflow: hidden;
  height: 100%;
}
#ContentWrapper {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  z-index: 100;
  background: url(core/css/resources/content-bg-texture.png);
}
#ContentFrame {
  position: absolute;
  top: 0;
  bottom: 0;
  height: 100%;
  width: 100%;
  overflow-y: hidden;
  border-right: #d0d0d0;
  box-sizing: border-box;
  background-color: #ffffff;
}
.hide-nosize,
.hide-nosize * {
  /*height: 0 !important;*/
  /*width: 0 !important;*/
  z-index: -1 !important;
}
.editor-notification {
  position: relative;
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 40%;
  top: 0;
  z-index: 9999;
  /* using css transitions for the slide effect */
  -webkit-transition: opacity 0.5s ease, top 0.5s ease;
  -moz-transition: opacity 0.5s ease, top 0.5s ease;
  transition: opacity 0.5s ease, top 0.5s ease;
}
.editor-notification--absolute {
  position: absolute;
  left: 50%;
  margin-left: -20%;
}
/*
 * ADOBE CONFIDENTIAL
 *
 * Copyright 2016 Adobe Systems Incorporated
 * All Rights Reserved.
 *
 * NOTICE:  All information contained herein is, and remains
 * the property of Adobe Systems Incorporated and its suppliers,
 * if any.  The intellectual and technical concepts contained
 * herein are proprietary to Adobe Systems Incorporated and its
 * suppliers and may be covered by U.S. and Foreign Patents,
 * patents in process, and are protected by trade secret or copyright law.
 * Dissemination of this information or reproduction of this material
 * is strictly forbidden unless prior written permission is obtained
 * from Adobe Systems Incorporated.
 */
/*! editable overlay */
div.cq-draggable.cq-dragorigin {
  /* origin which was dragged */
  background: rgba(255, 255, 255, 0.6);
  outline: none !important;
  -webkit-touch-callout: none;
}
div.cq-droptarget.cq-dragover {
  overflow: visible;
}
/* wrapper */
#OverlayWrapper {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  min-width: 100%;
  z-index: 900;
  background-color: rgba(255, 0, 0, 0);
  /* fixes overlays issues on IE9 */
}
#OverlayWrapper.is-hidden {
  display: none;
}
#OverlayWrapper.is-hidden-children > .cq-Overlay {
  display: none;
}
/* basic overlay */
.cq-Overlay {
  position: absolute;
  line-height: 2.875rem;
  color: #DDDDDD;
  font-size: 0.875rem;
  text-align: center;
}
.cq-Overlay:focus {
  outline: 0;
}
.cq-Overlay.is-bordered,
.cq-Overlay.is-active,
.cq-Overlay:focus,
.cq-Overlay.is-hover,
.cq-Overlay.is-selected {
  border: solid 0.125rem;
  margin: -0.125rem;
}
.cq-Overlay.is-active,
.cq-Overlay:focus,
.cq-Overlay.is-hover,
.cq-Overlay.is-selected {
  color: #1a78cd;
  border-color: #1a78cd;
}
.cq-Overlay.is-disabled {
  border-width: 0;
}
.cq-Overlay.is-hidden {
  display: none;
}
/* component name */
.cq-Overlay--component-name {
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: 30;
  display: none;
  padding: 0 2px 1px 6px;
  font-size: .6rem;
  line-height: 1.1rem;
  font-weight: 300;
  letter-spacing: .08rem;
  background-color: rgba(0, 0, 0, 0.3);
  color: #fff;
}
.cq-Overlay--component-name coral-icon {
  margin-right: 5px;
  vertical-align: bottom;
}
.cq-Overlay.is-active > .cq-Overlay--component-name,
.cq-Overlay:focus > .cq-Overlay--component-name,
.cq-Overlay.is-hover > .cq-Overlay--component-name,
.cq-Overlay.is-selected > .cq-Overlay--component-name {
  display: block;
  background-color: #1a78cd;
}
/* placeholder */
.cq-Overlay--placeholder {
  color: #6e6e6e;
  border-color: rgba(128, 128, 128, 0.5);
  background-color: rgba(255, 255, 255, 0.75);
  border-style: solid;
  border-width: 0.125rem;
  margin: -0.125rem;
}
.cq-Overlay--placeholder.is-active,
.cq-Overlay--placeholder:focus,
.cq-Overlay--placeholder.is-hover,
.cq-Overlay--placeholder.is-selected {
  background-color: rgba(255, 255, 255, 0.55);
  color: #1473e6;
  border-color: #1473e6;
}
.cq-Overlay--placeholder.is-active > .cq-Overlay--component-name,
.cq-Overlay--placeholder:focus > .cq-Overlay--component-name,
.cq-Overlay--placeholder.is-hover > .cq-Overlay--component-name,
.cq-Overlay--placeholder.is-selected > .cq-Overlay--component-name {
  display: none;
}
.cq-Overlay--placeholder:before {
  content: attr(data-text);
  color: inherit;
  display: inline-block;
  height: 100%;
  overflow: hidden;
  padding: 0 2px;
}
.cq-Overlay.cq-Overlay--placeholder.is-disabled {
  border-width: 0.125rem;
}
.cq-Overlay.cq-Overlay--placeholder.is-disabled.is-hover {
  color: #DDDDDD;
  border-color: #DDDDDD;
}
/* sub droptarget */
.cq-Overlay-subdroptarget {
  position: absolute;
}
.cq-Overlay-subdroptarget.cq-dragover {
  background-color: rgba(49, 109, 200, 0.3);
  border: solid 2px #1d5fbe;
  margin: -0.125rem;
}
/* Drag and Drop handling */
.cq-Overlay--component.cq-Overlay--insertBefore,
.cq-Overlay--component.cq-Overlay--insertAfter {
  border-left-width: 0;
  border-right-width: 0;
  border-style: solid;
  z-index: 101 !important;
  /* to make sure the insert arrows on top */
}
.cq-Overlay--component.cq-Overlay--insertBefore {
  box-shadow: inset 0 0.0625rem 0 0 #fff;
  border-bottom-width: 0;
  border-top-color: #1a78cd;
  border-top-width: 0.125rem;
  margin-top: -0.125rem;
}
.cq-Overlay--component.cq-Overlay--insertAfter {
  box-shadow: inset 0 -0.0625rem 0 0 #ffffff;
  border-bottom-color: #1a78cd;
  border-bottom-width: 0.125rem;
  border-top-width: 0;
  margin-bottom: -0.125rem;
}
.cq-Overlay--component.cq-Overlay--insertBefore:after,
.cq-Overlay--component.cq-Overlay--insertAfter:after {
  position: absolute;
  left: 50%;
  margin-left: -1.375rem;
  line-height: 22px;
  /*rem issue with pseudo-elements on IE (CQ-18732)*/
  text-align: center;
  background: #1a78cd;
  color: #FFFFFF;
  height: 1.375rem;
  width: 2.75rem;
}
.cq-Overlay--component.cq-Overlay--container.cq-Overlay--insertBefore,
.cq-Overlay--component.cq-Overlay--container.cq-Overlay--insertAfter {
  border: 0.125rem solid #1a78cd;
}
.cq-Overlay--component.cq-Overlay--insertBefore:after {
  top: -1.5rem;
  content: "\25B2";
  border-radius: 1.375rem 1.375rem 0 0;
}
.cq-Overlay--component.cq-Overlay--insertAfter:after {
  bottom: -1.5rem;
  content: "\25BC";
  border-radius: 0 0 1.375rem 1.375rem;
}
.cq-Overlay--component.cq-Overlay--placeholder.cq-Overlay--insertBefore,
.cq-Overlay--component.cq-Overlay--placeholder.cq-Overlay--insertAfter {
  border-left-width: 0.125rem;
  border-right-width: 0.125rem;
}
.cq-Overlay--component.cq-Overlay--placeholder.cq-Overlay--insertBefore {
  border-bottom-width: 0.125rem;
}
.cq-Overlay--component.cq-Overlay--placeholder.cq-Overlay--insertAfter {
  border-top-width: 0.125rem;
}
/* nesting max. 7 levels */
.cq-Overlay:before {
  z-index: 5;
}
.cq-Overlay > .cq-Overlay-subdroptarget {
  z-index: 9;
}
.cq-Overlay > .cq-Overlay {
  z-index: 10;
}
.cq-Overlay > .cq-Overlay > .cq-Overlay-subdroptarget {
  z-index: 19;
}
.cq-Overlay > .cq-Overlay > .cq-Overlay {
  z-index: 20;
}
.cq-Overlay > .cq-Overlay > .cq-Overlay > .cq-Overlay-subdroptarget {
  z-index: 29;
}
.cq-Overlay > .cq-Overlay > .cq-Overlay > .cq-Overlay {
  z-index: 30;
}
.cq-Overlay > .cq-Overlay > .cq-Overlay > .cq-Overlay > .cq-Overlay-subdroptarget {
  z-index: 39;
}
.cq-Overlay > .cq-Overlay > .cq-Overlay > .cq-Overlay > .cq-Overlay {
  z-index: 40;
}
.cq-Overlay > .cq-Overlay > .cq-Overlay > .cq-Overlay > .cq-Overlay > .cq-Overlay-subdroptarget {
  z-index: 49;
}
.cq-Overlay > .cq-Overlay > .cq-Overlay > .cq-Overlay > .cq-Overlay > .cq-Overlay {
  z-index: 50;
}
.cq-Overlay > .cq-Overlay > .cq-Overlay > .cq-Overlay > .cq-Overlay > .cq-Overlay > .cq-Overlay-subdroptarget {
  z-index: 59;
}
.cq-Overlay > .cq-Overlay > .cq-Overlay > .cq-Overlay > .cq-Overlay > .cq-Overlay > .cq-Overlay {
  z-index: 60;
}
.cq-Overlay > .cq-Overlay > .cq-Overlay > .cq-Overlay > .cq-Overlay > .cq-Overlay > .cq-Overlay > .cq-Overlay-subdroptarget {
  z-index: 69;
}
.cq-Overlay > .cq-Overlay > .cq-Overlay > .cq-Overlay > .cq-Overlay > .cq-Overlay > .cq-Overlay > .cq-Overlay {
  z-index: 70;
}
/* Editable Toolbar */
#EditableToolbar {
  display: none;
  position: absolute;
  top: 3.125rem;
  left: 0;
  z-index: 600;
  box-shadow: 0 0.1875rem 0.3125rem 0 rgba(0, 0, 0, 0.3);
  background: #323232;
}
#EditableToolbar > button {
  height: 40px;
  min-width: 40px;
  color: #ebebeb;
  text-align: center!important;
  border-radius: 4px;
  padding: 0 6px !important;
}
#EditableToolbar > button > coral-icon,
#EditableToolbar > button.cq-EditableToolbar-text,
#EditableToolbar > button > .cq-EditableToolbar-text {
  padding: 0 6px;
}
#EditableToolbar > button:hover,
#EditableToolbar > button:active,
#EditableToolbar > button.is-active {
  color: #FFFFFF;
  background-color: #545454;
}
#EditableToolbar > button:hover {
  background: #3F3F3F;
  border-radius: 4px;
}
#EditableToolbar > button:focus {
  outline: none;
  border-radius: 8px;
  border: 2px solid  #54A3F6 !important;
  box-sizing: border-box;
  margin: 2px;
  background: #3f3f3f;
  color: #FFFFFF;
  height: 40px;
  min-height: 40px;
}
#EditableToolbar > button > .cq-EditableToolbar-text {
  font-size: 13px;
}
.cq-EditableToolbar-text--left {
  margin-right: 5px;
}
.cq-EditableToolbar-text--right {
  margin-left: 5px;
}
#EditableToolbar > button.cq-EditableToolbar-button.cq-EditableToolbar-button--readOnly {
  pointer-events: none;
}
#EditableToolbar > button.cq-EditableToolbar-button.cq-EditableToolbar-button--readOnly > coral-icon,
#EditableToolbar > button.cq-EditableToolbar-button.cq-EditableToolbar-button--readOnly.cq-EditableToolbar-text,
#EditableToolbar > button.cq-EditableToolbar-button.cq-EditableToolbar-button--readOnly > .cq-EditableToolbar-text {
  opacity: 1;
}
#EditableToolbar > button.cq-EditableToolbar-button--modeSwitcher {
  border-left: 1px solid #323232;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}
coral-buttonlist.cq-select-parent-list coral-icon.cq-select-parent-colorhint {
  border: 0.0625rem solid rgba(255, 255, 255, 0.8);
  margin-top: -0.125rem;
}
coral-buttonlist.cq-select-parent-list,
coral-buttonlist.inlineeditor-selector-list {
  width: 10rem;
}
.inlineeditor-is-hover-subtarget {
  background: #54A3F6;
  opacity: 0.5;
}
/*
 * ADOBE CONFIDENTIAL
 *
 * Copyright 2013 Adobe Systems Incorporated
 * All Rights Reserved.
 *
 * NOTICE:  All information contained herein is, and remains
 * the property of Adobe Systems Incorporated and its suppliers,
 * if any.  The intellectual and technical concepts contained
 * herein are proprietary to Adobe Systems Incorporated and its
 * suppliers and may be covered by U.S. and Foreign Patents,
 * patents in process, and are protected by trade secret or copyright law.
 * Dissemination of this information or reproduction of this material
 * is strictly forbidden unless prior written permission is obtained
 * from Adobe Systems Incorporated.
 */
.editor-panel {
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  background: #EEEEEE;
  -moz-transition: -moz-transform 1.2s;
  -webkit-transition: -webkit-transform 1.2s;
  -ms-transition: -ms-transform 1.2s;
  transition: transform 1.2s;
}
.editor-panel-content {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  min-height: 0.0625rem;
  overflow: scroll;
  z-index: 800;
  /* improves scrolling perf */
  -webkit-overflow-scrolling: touch;
}
.editor-panel-content-with-header {
  top: 2.75rem;
}
/*! editor-panel-header toolbar */
.editor-panel-header {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 900;
}
.editor-panel-header .header-main .coral3-ActionBar-secondary .coral3-ActionBar-item {
  margin: 0 !important;
}
@media (max-width: 440px) {
  .editor-panel-header .header-main .coral3-ActionBar-secondary {
    right: 0 !important;
  }
  .editor-panel-header .header-main .coral3-ActionBar-secondary .coral3-ActionBar-item .coral3-Button--minimal {
    margin: 0 !important;
  }
}
@media (max-width: 400px) {
  .editor-panel-header .header-main .coral3-ActionBar-secondary .coral3-ActionBar-item .coral3-Button--minimal {
    padding: 0;
  }
}
/**************************************
* SidePanel
**************************************/
.sidepanel {
  box-sizing: border-box;
  border-right: 1px solid #e1e1e1;
}
.sidepanel-opened {
  position: relative;
  top: 0;
  left: 0;
  bottom: 0;
  background-color: #eeeeee;
}
.sidepanel-opened .sidepanel-content {
  height: 100%;
  overflow-y: hidden;
}
.sidepanel-closed.sidepanel-resizing {
  display: none;
}
.sidepanel-closed {
  visibility: hidden;
  -webkit-transition: -webkit-transform 1.2s, visibility 0s linear 1.2s;
  transition: transform 1.2s, visibility 0.00s linear 1.2s;
}
.sidepanel-closed .coral3-Masonry-item.is-managed {
  visibility: hidden;
}
/**************************************
* SidePanel for Mobile
**************************************/
@media screen and (max-width: 1024px) {
  /* Fullscreen */
  .sidepanel {
    width: 100%;
    border-right: 0;
    -webkit-transition: -webkit-transform 1.2s, visibility 0s linear 0s;
    transition: transform 1.2s, visibility 0.00s linear 0.00s;
  }
  .sidepanel-sliding {
    display: none;
  }
  /* Shift on the left */
  .sidepanel-closed {
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
  }
  /* Unshift it */
  .sidepanel-opened {
    z-index: 1000;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  /* No split screen => no resizer */
  /*todo by default, dont display it*/
  .sidepanel-opened .sidepanel-resizer {
    display: none;
  }
  /* Hide the desktop toggle */
  .sidepanel-content .toggle-sidepanel {
    display: none;
  }
  /* ActionBar */
  .sidepanel-header .granite-actionbar {
    background-color: #fafafa;
  }
  .sidepanel-header .header-action {
    margin: auto;
  }
  .sidepanel-header .sidepanel-header-title {
    white-space: nowrap;
  }
  /* Hide the desktop toggle */
  .sidepanel-content .toggle-sidepanel {
    display: none;
  }
  .sidepanel-content .sidepanel-tab {
    display: table-cell;
    -webkit-border-radius: 0;
    border-radius: 0;
    border: none;
  }
  .sidepanel-content .filter-panel {
    max-width: 100%;
    left: 0;
    float: left;
    padding-right: 1rem;
  }
  .sidepanel-content .sidepanel-tab-title {
    padding-top: 1rem;
    padding-bottom: 1rem;
  }
  .sidepanel-content .filter-panel .componentfilter label {
    line-height: 2.25rem;
  }
  .sidepanel-content .selected-filter-panel {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    height: 2.625rem;
    padding-left: 1rem;
    border-left: 0.0625rem solid rgba(0, 0, 0, 0.15);
  }
  .sidepanel-content .js-SidePanel-content .selected-filter-panel .taglist {
    margin-top: 0;
  }
  .sidepanel-content .content-panel {
    overflow: hidden;
    -webkit-overflow-scrolling: touch;
    height: 100%;
    padding-left: 1rem;
    border-left: 1px solid #e1e1e1;
    min-width: 10rem;
  }
}
/**************************************
* SidePanel for Desktop
**************************************/
@media screen and (min-width: 1025px) {
  /* Split screen */
  .sidepanel {
    -moz-transition: opacity 0.5s, visibility 0.00s linear 0.00s;
    -webkit-transition: opacity 0.5s, visibility 0.00s linear 0.00s;
    transition: opacity 0.5s, visibility 0.00s linear 0.00s;
  }
  /* No header on desktop */
  .sidepanel .sidepanel-header {
    display: none;
  }
  .sidepanel .content-panel {
    padding-top: 1rem;
  }
  .sidepanel .content-panel.editor-SidePanel-results {
    padding-top: 0;
    max-height: 80vh;
  }
  .sidepanel-content .js-SidePanel-empty {
    position: relative;
    top: 2.6875rem;
    height: 100%;
    border-width: 0.0625rem;
    border-color: rgba(0, 0, 0, 0.15);
    border-style: solid solid none none;
  }
  /* Opened */
  .sidepanel-opened {
    min-width: 28%;
    max-width: 97.5%;
    width: 28%;
    /* default width */
  }
  /* Closed, underneath the Content panel */
  .sidepanel-closed {
    width: 0;
    z-index: 0;
    opacity: 0;
  }
  .sidepanel-closed .sidepanel-content {
    opacity: 0;
  }
  .sidepanel-opened .sidepanel-content {
    opacity: 1;
  }
  .sidepanel-content .sidepanel-tab-title {
    padding-top: 1rem;
    padding-bottom: 1rem;
    margin-bottom: 1rem;
    border-bottom: .0625rem solid #e1e1e1;
  }
  /* Resizer */
  .sidepanel-resizer {
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    width: 1rem;
    background: rgba(238, 238, 238, 0);
    cursor: col-resize;
    z-index: 890;
  }
  .sidepanel-resizer.is-dragging {
    background: rgba(238, 238, 238, 0.7);
  }
  /* Content panel */
  #Content {
    -webkit-transition: left 0.5s, width 0.5s;
    -moz-transition: left 0.5s, width 0.5s;
    transition: left 0.5s, width 0.5s;
  }
  /* SidePanel opened => Content panel in split screen */
  .sidepanel-opened ~ #Content {
    left: 28%;
    width: 72%;
  }
  /**************************************
    * SidePanel content
    **************************************/
  .sidepanel .content-panel {
    left: 0.875rem;
    right: 0.875rem;
    margin: 0;
  }
}
/**************************************
* SidePanel Tabs
**************************************/
.sidepanel-content coral-tabview {
  height: 100vh;
  margin-top: 0;
  margin-bottom: 0;
}
/*TO DO GRANITE-14319 - [Editor] SidePanel / SideBar tabs should look the same */
.sidepanel-content coral-tablist {
  border-right: 1px solid #e1e1e1;
  width: 3.5rem;
  background-color: #fafafa;
}
/*TO DO GRANITE-14319 - [Editor] SidePanel / SideBar tabs should look the same */
.sidepanel-content coral-tabview[orientation=vertical] coral-tablist[size=L] coral-tab {
  text-align: center;
  position: relative;
}
.sidepanel-content coral-tabview[orientation=vertical] coral-tablist[size=L] coral-tab[selected]:after {
  content: '';
  display: block;
  background-color: #ebebeb;
  height: 2.25rem;
  width: 2.25rem;
  border-radius: .25rem;
  position: absolute;
  top: .3125rem;
  left: .5625rem;
  z-index: -1;
  pointer-events: none;
}
.sidepanel-content coral-panelstack {
  background-color: #f5f5f5;
}
.sidepanel-content coral-tab {
  padding-top: 15px !important;
  padding-bottom: 15px !important;
  min-width: 1rem;
}
/**************************************
* SidePanel content
**************************************/
.sidepanel-content .sidepanel-tab {
  padding-left: 1rem;
  padding-right: 1rem;
  height: 100vh;
}
.sidepanel-content .sidepanel-tab-title {
  display: block;
  font-size: 15px;
  color: #707070;
  margin-bottom: 1rem;
  border-bottom: .0625rem solid #e1e1e1;
  margin-top: 0;
  font-weight: inherit;
}
/**************************************
* Compatibility with old panels  (temp)
**************************************/
.editor-panel-ignore {
  display: none;
}
/**************************************
* SidePanel filter
**************************************/
.sidepanel .filter-panel foundation-autocomplete {
  width: 100%;
}
/* Coral 2 legacy */
.sidepanel .filter-panel .coral-Autocomplete,
.sidepanel .filter-panel .coral-PathBrowser {
  width: 100%;
}
.sidepanel .filter-panel .coral-Form-field,
.sidepanel .filter-panel .form-field-margin {
  margin-bottom: 0;
  margin-top: 0.4375rem;
}
.sidepanel .filter-panel .coral-Form-fieldwrapper:first-child .coral-Form-field {
  margin-top: 0;
}
.sidepanel .filter-panel .coral-Form-fieldwrapper .coral-Form-fieldlabel {
  margin-top: 0.4375rem;
}
.sidepanel .filter-panel .coral-Form-fieldwrapper:first-child .coral-Form-fieldlabel {
  margin-top: 0;
}
.sidepanel-opened .js-SidePanel-content .selected-filter-panel {
  display: inline-block;
  border: 0;
}
/* distribute the content */
.sidepanel .filter-panel .search input[type=text] {
  padding-right: 3.5rem !important;
}
/**************************************
* SidePanel content
**************************************/
.sidepanel .content-panel {
  bottom: 0;
  overflow-y: auto;
  overflow-x: hidden;
}
.sidepanel .content-panel .grid {
  padding: 0rem;
}
.sidepanel .content-panel .grid a.label {
  text-decoration: inherit !important;
  color: inherit !important;
}
/* No results */
.sidepanel .content-panel > .emptyresult {
  display: none;
  width: 100%;
  padding-bottom: 3rem;
  padding-top: 3rem;
  color: #525252;
  text-align: center;
  font-weight: lighter;
}
.sidepanel .content-panel > .emptyresult > span {
  display: block;
}
.sidepanel .content-panel > .emptyresult .noresults {
  font-size: 1.5625rem;
}
.sidepanel .content-panel > .emptyresult .retry {
  font-size: 1.125rem;
  padding-top: 0.5rem;
}
.sidepanel .sidepanel-content-with-header {
  background-color: #f5f5f5;
}
.editor-EmulatorBar {
  display: none;
  border-bottom: 1px solid #d7d7d7;
  width: 100%;
  background-color: #f5f5f5;
}
.editor-EmulatorBar.is-visible {
  display: block;
}
.editor-EmulatorBar-toolbar {
  height: 48px;
  position: relative;
}
.editor-EmulatorBar-toolbar-actions {
  height: 48px;
  line-height: 48px;
  display: inline-block;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
  /* place over the device switcher */
  border-right: 1px solid #d7d7d7;
  background-color: #ebebeb;
  /* to overlay the devices */
}
.editor-EmulatorBar-toolbar-actions > button {
  width: 44px;
}
.editor-EmulatorBar-toolbar-actions > button coral-icon {
  line-height: 48px;
}
/* switcher */
.editor-EmulatorBar-switcher {
  height: 48px;
  width: 100%;
  white-space: nowrap;
  position: absolute;
  top: 0;
  display: none;
}
.editor-EmulatorBar-switcher.is-visible {
  display: block;
}
.editor-EmulatorBar-switcher-device {
  background: inherit;
  border: initial;
  border-right: 1px solid #d0d0d0;
  height: 48px;
  padding: 0 12px;
  display: inline-block;
  vertical-align: middle;
  line-height: 48px;
  text-align: right;
  box-sizing: border-box;
  cursor: pointer;
  color: var(--spectrum-global-color-gray-700, #6e6e6e);
}
.js-EmulatorDeviceTrigger.editor-EmulatorBar-switcher-device.focus-ring {
  box-shadow: 0 0 0 1px var(--spectrum-global-color-blue-500);
}
.editor-EmulatorBar-switcher-device:focus {
  outline: 0;
  box-shadow: 0 0 0 1px #326ec8;
}
.editor-EmulatorBar-switcher-device--desktop {
  position: absolute;
  right: 0;
}
.editor-EmulatorBar-switcher-device:hover {
  color: var(--spectrum-global-color-gray-900, #2c2c2c);
}
.editor-EmulatorBar-switcher-device-text {
  display: block;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  min-width: 12px;
}
.editor-EmulatorBar-switcher-currentDevice {
  position: absolute;
  z-index: 0;
  pointer-events: none;
}
/* ruler */
.editor-EmulatorBar-ruler {
  border-top: 1px solid #d0d0d0;
  height: 18px;
  white-space: nowrap;
  font-size: 0;
}
.editor-EmulatorBar-ruler-block {
  border-right: 1px solid #d0d0d0;
  height: 18px;
  width: 49px;
  position: relative;
  display: inline-block;
}
.editor-EmulatorBar-ruler-block::before {
  position: absolute;
  left: 3px;
  content: attr(data-display);
  font-size: 10px;
  line-height: 18px;
  color: var(--spectrum-global-color-gray-700, #6e6e6e);
}
.editor-EmulatorBar-ruler-line {
  margin-top: 15px;
  margin-left: 4px;
  height: 3px;
  width: 1px;
  display: inline-block;
  background-color: #d0d0d0;
}
.editor-EmulatorBar-ruler-line:nth-child(2n) {
  margin-top: 14px;
  height: 4px;
}
/* badge */
.editor-EmulatorBadge {
  font-size: 13px;
}
.editor-EmulatorBadge-icon {
  padding-left: 10px;
}
/* breakpoint */
.editor-EmulatorBar-breakpoint {
  position: absolute;
  z-index: 2;
  /* @override coral */
  padding: 2px 8px;
  /* @override coral */
  min-height: 0;
  /* @override coral */
}
/* vertical line for current break */
.editor-EmulatorBar-toolbar-currentWidth {
  margin-left: -1px;
  width: 1px;
  position: absolute;
  top: 0;
  left: 100%;
  bottom: -19px;
  pointer-events: none;
  background-color: #d0d0d0;
}
.editor-EmulatorBar-toolbar-currentHeight {
  border-bottom: 2px dashed #326ec8;
  position: absolute;
  left: 0;
  pointer-events: none;
}
.editor-GlobalBar {
  min-height: 2.75rem;
  background-color: #f5f5f5;
  box-shadow: 0 0.0625rem 0.0625rem 0 rgba(0, 0, 0, 0.4);
}
.editor-GlobalBar coral-actionbar {
  padding: 0;
}
.editor-GlobalBar coral-actionbar-primary {
  left: 0;
}
.editor-GlobalBar coral-actionbar-secondary {
  right: 0;
}
.editor-GlobalBar-pageTitle {
  position: absolute;
  top: 0;
  left: 15vw;
  right: 15vw;
  margin-left: auto;
  margin-right: auto;
  max-width: 70vw;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: max-width 0.3s;
  text-align: center;
  text-transform: uppercase;
  line-height: 44px;
  color: #4b4b4b;
}
@media (max-width: 780px) {
  .editor-GlobalBar-pageTitle {
    left: 15vw;
    right: 25vw;
  }
}
@media (max-width: 661px) {
  .editor-GlobalBar-pageTitle {
    left: 22vw;
    right: 34vw;
  }
}
@media (max-width: 550px) {
  .editor-GlobalBar-pageTitle {
    left: 25vw;
    right: 40vw;
  }
}
@media (max-width: 480px) {
  .editor-GlobalBar-pageTitle {
    left: 31vw;
    right: 45vw;
  }
}
@media (max-width: 400px) {
  .editor-GlobalBar-pageTitle {
    left: 35vw;
    right: 46vw;
  }
}
@media (max-width: 360px) {
  .editor-GlobalBar-pageTitle {
    left: 38vw;
    right: 45vw;
  }
}
@media (max-width: 340px) {
  .editor-GlobalBar-pageTitle {
    left: 40vw;
    right: 45vw;
  }
}
@media (min-width: 2000px) {
  .sidepanel-opened + .editor-panel .editor-GlobalBar-pageTitle {
    max-width: 48vw;
  }
}
@media (max-width: 2000px) {
  .editor-GlobalBar-pageTitle {
    max-width: 60vw;
  }
  .sidepanel-opened + .editor-panel .editor-GlobalBar-pageTitle {
    max-width: 40vw;
  }
}
@media (max-width: 1500px) {
  .editor-GlobalBar-pageTitle {
    max-width: 55vw;
  }
  .sidepanel-opened + .editor-panel .editor-GlobalBar-pageTitle {
    max-width: 30vw;
  }
}
@media (max-width: 1000px) {
  .editor-GlobalBar-pageTitle {
    max-width: 50vw;
  }
}
.editor-GlobalBar-item {
  box-sizing: border-box;
  display: inline-block;
  height: 44px;
  min-width: 44px;
  text-align: center;
  vertical-align: top;
  outline: none;
  line-height: 44px;
  background: transparent;
  border: none;
  color: #6e6e6e;
  font-size: 14px;
  font-weight: 400;
}
.editor-GlobalBar-item:not(:disabled):not(.is-disabled).is-selected {
  color: #fff;
  opacity: 1;
}
.editor-GlobalBar-item:not(:disabled):not(.is-disabled):focus {
  color: #2c2c2c;
}
.editor-GlobalBar-item:not(:disabled):not(.is-disabled):hover {
  color: #000;
  opacity: 1;
}
.editor-GlobalBar-item:not(:disabled):not(.is-disabled).is-focused,
.editor-GlobalBar-item:not(:disabled):not(.is-disabled):focus {
  box-shadow: inset 0 0 0 0.0625rem #87beff, 0 0 0.1875rem #87beff !important;
  background-color: transparent!important;
  color: #000;
  opacity: 1;
}
.editor-GlobalBar-item.coral3-Button--minimal:not(:disabled):not(.is-disabled).is-selected {
  color: #000;
  background-color: #e1e1e1;
}
.editor-GlobalBar-item[disabled],
.editor-GlobalBar-item.is-disabled {
  display: none;
}
/* resets a Chrome specific handling in CoralUI to ensure that the icon is presented top */
.editor-GlobalBar-item coral-icon {
  position: relative !important;
  top: -1px !important;
}
.editor-GlobalBar-item--badge {
  min-width: 0;
  width: 24px;
  min-height: 24px;
  height: 24px;
  margin: .625rem;
  padding: 0;
  text-align: center;
  line-height: 1;
}
/* @override */
.editor-GlobalBar-item > coral-icon,
.editor-GlobalBar-item:hover > coral-icon {
  color: inherit !important;
  opacity: 1;
  line-height: 42px;
}
/* special buttons */
.editor-GlobalBar-layerSwitcher {
  width: 22px;
  min-width: 0;
  margin-right: 25px;
  padding: 0;
}
/* Layer selection related styles */
.editor-GlobalBar-layerCurrent {
  min-width: 0;
  padding: 0 6px;
}
.editor-GlobalBar-layerPreview {
  width: 22px;
  min-width: 0;
  margin-right: 25px;
  padding: 0;
}
.editor-GlobalBar-item--badge:not(.is-selected) {
  background-color: #919191;
}
.editor-GlobalBar-item--badge:not(:disabled):not(.is-disabled):hover,
.editor-GlobalBar-item--badge:not(:disabled):not(.is-disabled):focus,
.editor-GlobalBar-item--badge:not(:disabled):not(.is-disabled).is-focused {
  background-color: #919191;
  color: #fff;
}
.editor-GlobalBar-popoverContent {
  width: 11.75rem;
  /* CUI-6658 - Popover without width gets a wrong position */
}
/*
 * ADOBE CONFIDENTIAL
 *
 * Copyright 2016 Adobe Systems Incorporated
 * All Rights Reserved.
 *
 * NOTICE:  All information contained herein is, and remains
 * the property of Adobe Systems Incorporated and its suppliers,
 * if any.  The intellectual and technical concepts contained
 * herein are proprietary to Adobe Systems Incorporated and its
 * suppliers and may be covered by U.S. and Foreign Patents,
 * patents in process, and are protected by trade secret or copyright law.
 * Dissemination of this information or reproduction of this material
 * is strictly forbidden unless prior written permission is obtained
 * from Adobe Systems Incorporated.
 */
.editor-StatusBar {
  display: none;
  height: 2.375rem;
}
/* navigation elements */
.editor-StatusBar-navigation {
  position: absolute;
  z-index: 20;
  right: .313rem;
  line-height: 2.375rem;
}
.editor-StatusBar-previous,
.editor-StatusBar-next {
  color: #323232;
  min-width: inherit;
}
.editor-StatusBar-badge {
  padding: 0.25rem 0.375rem;
  border-radius: 0.25rem;
  background: rgba(0, 0, 0, 0.1);
  text-decoration: none;
  color: #323232;
  cursor: pointer;
}
/* status list in popover */
.editor-StatusBar-popover {
  /* allow the popover to be as wide as its content */
  max-width: none;
}
/* @coral usage of internals */
.editor-StatusBar-statusList .coral-BasicList-item-contentContainer,
.editor-StatusBar-statusList .coral3-BasicList-item-contentContainer {
  /* override 'width: 100%' in order for the popover not to take the full width (need
     * to reference 'coral-...' since there is no other way to select the element or to
     * add a custom class) */
  width: auto;
}
.editor-StatusBar-listItemTitle {
  font-weight: bold;
  margin-right: 0.375rem;
}
/* status and actions */
.editor-StatusBar-status {
  width: 100%;
  margin: 0;
  webkit-border-radius: inherit;
  border-radius: inherit;
}
.editor-StatusBar-action:first-child {
  margin-left: 0.938rem;
}
.editor-StatusBar-action {
  margin-left: 0.625rem;
}
.editor-StatusBar-action:first-child:focus {
  margin-left: 0.8755rem;
}
.editor-StatusBar-action:focus {
  margin-left: 0.5625rem;
}
.editor-ResponsiveGrid-overlay-resizeHandle {
  display: none;
  margin-top: -9px;
  border: 2px solid #fff;
  width: 16px;
  height: 16px;
  border-radius: 9px;
  background: #208ee5;
  position: absolute;
  top: 50%;
  z-index: 70;
}
.cq-Overlay.is-selected.is-resizable > .editor-ResponsiveGrid-overlay-resizeHandle {
  display: block;
}
.editor-ResponsiveGrid-overlay-resizeHandle--left {
  margin-left: -9px;
  left: 0;
}
.editor-ResponsiveGrid-overlay-resizeHandle--right {
  margin-left: -9px;
  left: 100%;
}
/* expand clickable area */
.editor-ResponsiveGrid-overlay-resizeHandle--left::before,
.editor-ResponsiveGrid-overlay-resizeHandle--right::before {
  content: '';
  position: absolute;
  top: -10px;
  left: -10px;
  right: -10px;
  bottom: -10px;
  cursor: col-resize;
}
/* resize handle should not be covered by another overlay */
.cq-Overlay > .cq-Overlay.is-selected.is-resizable {
  z-index: 79;
}
.editor-ResponsiveGrid-unHideButton {
  position: absolute;
  top: 0;
  left: 0;
  border-radius: 0;
}
.editor-ResponsiveGrid-unHideButton {
  background-color: #454545 !important;
  color: #ffffff !important;
  min-width: 0;
  width: 60px;
  height: 44px;
  box-sizing: border-box;
  z-index: 300;
}
.editor-ResponsiveGrid-unHideButton > coral-icon {
  opacity: 0.6;
}
.editor-ResponsiveGrid-unHideButton:hover > coral-icon {
  opacity: 1;
}
.editor-ResponsiveGrid-overlayHiddenComponent {
  background-color: rgba(135, 190, 255, 0.5);
}
/* background grid for resizing */
.editor-ResponsiveGrid-resizeGrid {
  pointer-events: none;
}
.editor-ResponsiveGrid-resizeGrid-column {
  position: absolute;
  top: 0;
  bottom: 0;
}
.editor-ResponsiveGrid-resizeGrid-column:nth-of-type(2n) {
  background: rgba(50, 135, 210, 0.2);
}
.editor-DescriptionDialog coral-dialog-content {
  max-height: 360px;
  overflow: auto;
}
.InsertComponentDialog-components {
  padding: .625rem 0 0 0;
  border-radius: 0 0 .25rem .25rem;
}
.InsertComponentDialog-list {
  position: static;
  max-height: none;
  margin: 0;
  border-width: 1px 0 0 0;
  border-radius: 0;
  max-height: 400px;
  overflow-y: scroll;
}
.InsertComponentDialog-search {
  width: 100%;
}
.InsertComponentDialog-search,
.InsertComponentDialog-search > coral-icon {
  padding: 0 .625rem .625rem .625rem;
}
/*
 * ADOBE CONFIDENTIAL
 *
 * Copyright 2017 Adobe Systems Incorporated
 * All Rights Reserved.
 *
 * NOTICE:  All information contained herein is, and remains
 * the property of Adobe Systems Incorporated and its suppliers,
 * if any.  The intellectual and technical concepts contained
 * herein are proprietary to Adobe Systems Incorporated and its
 * suppliers and may be covered by U.S. and Foreign Patents,
 * patents in process, and are protected by trade secret or copyright law.
 * Dissemination of this information or reproduction of this material
 * is strictly forbidden unless prior written permission is obtained
 * from Adobe Systems Incorporated.
 */
.editor-StyleSelector {
  min-width: 170px;
}
.editor-StyleSelector-title {
  padding-right: 90px;
}
.editor-StyleSelector-actions {
  position: absolute;
  top: 0;
  right: 5px;
}
.editor-StyleSelector-action {
  padding: 0;
  line-height: 50px;
}
.editor-StyleSelector-selectList {
  border: 0;
  max-height: 210px;
  overflow-y: auto;
}
/*
 * ADOBE CONFIDENTIAL
 *
 * Copyright 2013 Adobe Systems Incorporated
 * All Rights Reserved.
 *
 * NOTICE:  All information contained herein is, and remains
 * the property of Adobe Systems Incorporated and its suppliers,
 * if any.  The intellectual and technical concepts contained
 * herein are proprietary to Adobe Systems Incorporated and its
 * suppliers and may be covered by U.S. and Foreign Patents,
 * patents in process, and are protected by trade secret or copyright law.
 * Dissemination of this information or reproduction of this material
 * is strictly forbidden unless prior written permission is obtained
 * from Adobe Systems Incorporated.
 */
/**************************************
* SidePanel for Mobile
**************************************/
@media screen and (max-width: 1024px) {
  .sidepanel-content .editor-ComponentBrowser {
    display: block;
  }
  .sidepanel #components-filter {
    max-width: 100%;
  }
}
/**************************************
* SidePanel for Desktop
**************************************/
@media screen and (min-width: 1025px) {
  .sidepanel .componentfilter {
    width: 100%;
  }
  .sidepanel #components-filter {
    border-bottom: .0625rem solid #e9e9e9;
  }
  .sidepanel .sidepanel-tab-components .editor-SidePanel-resultsPanel {
    padding-top: 0;
  }
}
/* list */
.sidepanel .editor-ComponentBrowser-components coral-list-item {
  padding: 0;
  border-bottom: .0625rem solid #e9e9e9;
}
.sidepanel .editor-ComponentBrowser-component {
  display: block;
  position: relative;
  line-height: 3rem;
  height: 3rem;
  color: #323232;
  text-decoration: none;
  white-space: nowrap;
  overflow: hidden;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  background-color: #f5f5f5;
}
.sidepanel .editor-ComponentBrowser-component:hover {
  background-color: #eeeeee;
}
.sidepanel .editor-ComponentBrowser-component-icon {
  display: block;
  position: relative;
  float: left;
  width: 3rem;
  height: 3rem;
  text-align: center;
  margin-right: .9375rem;
}
.sidepanel .editor-ComponentBrowser-component-icon > coral-icon {
  color: #707070;
}
.sidepanel .editor-ComponentBrowser-component-icon > img {
  width: auto;
  height: auto;
  max-width: 20px;
  max-height: 20px;
}
.sidepanel .editor-ComponentBrowser-component:hover .editor-ComponentBrowser-component-icon > img {
  opacity: 1;
}
.sidepanel .editor-ComponentBrowser-component-title {
  display: block;
  padding-top: .5rem;
  padding-right: .9375rem;
  height: 3rem;
  line-height: 2rem;
  white-space: nowrap;
  overflow: hidden;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
}
.sidepanel .editor-ComponentBrowser-component coral-tag {
  margin-top: 10px;
  padding: .35rem 0;
  width: 1.75rem;
  text-align: center;
}
.sidepanel .editor-ComponentBrowser-component-title .foundation-collection-item-title,
.sidepanel .editor-ComponentBrowser-component-title .foundation-layout-util-subtletext {
  line-height: 1rem;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
/* description button */
.sidepanel .editor-ComponentBrowser-component button {
  margin-top: 4px;
}
/* cards */
.sidepanel coral-card.editor-Card {
  min-height: auto;
  max-width: 100%;
  min-width: 140px;
}
.sidepanel coral-card.editor-Card[data-group^="."] {
  display: none;
}
.sidepanel coral-card.editor-Card coral-card-asset {
  color: #606060;
  font-size: 1.5rem;
  min-height: 4rem;
}
.sidepanel coral-card.editor-Card coral-card-asset coral-icon {
  width: auto;
}
.sidepanel coral-card.editor-Card coral-card-asset img {
  max-height: 4rem;
  object-fit: scale-down;
}
/* deprecated grid and cards */
.sidepanel .components.grid .card-component {
  margin: 0 0 0;
  max-width: 100%;
  min-width: 30%;
  padding-right: 0.875rem;
  background: transparent;
}
.sidepanel .components.grid .card-component[data-group^="."] {
  display: none;
}
.sidepanel .components.grid .card-component > a {
  height: 100%;
  padding-top: 3rem;
  /*
        due to a bug in iOS 8.0+ where the callout appear on <a>
        https://bugs.webkit.org/show_bug.cgi?id=136685
        https://jira.corp.adobe.com/browse/CQ-37120
    */
  pointer-events: none;
}
.sidepanel .components.grid .card-component > a > div.label {
  background: #fff;
  margin-bottom: 0;
  position: relative;
  padding: 0.5rem 0;
  font-weight: lighter;
}
.sidepanel .components.grid .card-component > a > div.label em {
  font-style: normal;
  font-size: 0.625rem;
  padding: 0 0.375rem;
  text-transform: uppercase;
}
.sidepanel .components.grid .card-component > a > div.label h4 {
  display: table-cell;
  vertical-align: bottom;
  white-space: normal;
  padding: 0 0.375rem;
  font-size: 1.2rem;
  line-height: 1.5rem;
  /* 0.3rem extra because the AdobeClean baseline is not aligned */
  font-weight: normal;
  color: #777777;
}
/* green */
.sidepanel .components.grid > div .card-component > a.card-green {
  background: #649137;
  /* 2 shades darker */
}
.sidepanel .components.grid > div:nth-child(3n) .card-component:nth-child(3n-1) > a.card-green {
  background: #7daf4b;
  /* 1 shades darker */
}
.sidepanel .components.grid > div:nth-child(3n-3) .card-component:nth-child(2n-3) > a.card-green {
  background: #8cc350;
  /* core color */
}
.sidepanel .components.grid > div:nth-child(2n-3) .card-component:nth-child(2n-6) > a.card-green {
  background: #a5d273;
  /* 1 shades lighter */
}
.sidepanel .components.grid > div:nth-child(3n-1) .card-component:nth-of-type(odd) > a.card-green {
  background: #c8e1aa;
  /* 2 shades lighter */
}
.sidepanel .components.grid > div:nth-child(3n-2) .card-component:nth-child(7n-4) > a.card-green {
  background: #dcebcd;
  /* 3 shades lighter */
}
/* lavender */
.sidepanel .components.grid > div .card-component > a.card-lavender {
  background: #3c466e;
  /* 2 shades darker */
}
.sidepanel .components.grid > div:nth-child(3n) .card-component:nth-child(3n-1) > a.card-lavender {
  background: #465a87;
  /* 1 shades darker */
}
.sidepanel .components.grid > div:nth-child(3n-3) .card-component:nth-child(2n-3) > a.card-lavender {
  background: #5a6eaa;
  /* core color */
}
.sidepanel .components.grid > div:nth-child(2n-3) .card-component:nth-child(2n-6) > a.card-lavender {
  background: #7d8cbe;
  /* 1 shades lighter */
}
.sidepanel .components.grid > div:nth-child(3n-1) .card-component:nth-of-type(odd) > a.card-lavender {
  background: #afb9d7;
  /* 2 shades lighter */
}
.sidepanel .components.grid > div:nth-child(3n-2) .card-component:nth-child(7n-4) > a.card-lavender {
  background: #c8d2e6;
  /* 3 shades lighter */
}
/* purple */
.sidepanel .components.grid > div .card-component > a.card-purple {
  background: #961e73;
  /* 2 shades darker */
}
.sidepanel .components.grid > div:nth-child(3n) .card-component:nth-child(3n-1) > a.card-purple {
  background: #b93282;
  /* 1 shades darker */
}
.sidepanel .components.grid > div:nth-child(3n-3) .card-component:nth-child(2n-3) > a.card-purple {
  background: #d755a5;
  /* core color */
}
.sidepanel .components.grid > div:nth-child(2n-3) .card-component:nth-child(2n-6) > a.card-purple {
  background: #e173b9;
  /* 1 shades lighter */
}
.sidepanel .components.grid > div:nth-child(3n-1) .card-component:nth-of-type(odd) > a.card-purple {
  background: #ebaad2;
  /* 2 shades lighter */
}
.sidepanel .components.grid > div:nth-child(3n-2) .card-component:nth-child(7n-4) > a.card-purple {
  background: #f5cde6;
  /* 3 shades lighter */
}
/* cyan */
.sidepanel .components.grid > div .card-component > a.card-cyan {
  background: #00829b;
  /* 2 shades darker */
}
.sidepanel .components.grid > div:nth-child(3n) .card-component:nth-child(3n-1) > a.card-cyan {
  background: #00a0be;
  /* 1 shades darker */
}
.sidepanel .components.grid > div:nth-child(3n-3) .card-component:nth-child(2n-3) > a.card-cyan {
  background: #1ebed7;
  /* core color */
}
.sidepanel .components.grid > div:nth-child(2n-3) .card-component:nth-child(2n-6) > a.card-cyan {
  background: #78d7e6;
  /* 1 shades lighter */
}
.sidepanel .components.grid > div:nth-child(3n-1) .card-component:nth-of-type(odd) > a.card-cyan {
  background: #aae6f0;
  /* 2 shades lighter */
}
.sidepanel .components.grid > div:nth-child(3n-2) .card-component:nth-child(7n-4) > a.card-cyan {
  background: #beebf5;
  /* 3 shades lighter */
}
/* ocher */
.sidepanel .components.grid > div .card-component > a.card-ocher {
  background: #c37300;
  /* 2 shades darker */
}
.sidepanel .components.grid > div:nth-child(3n) .card-component:nth-child(3n-1) > a.card-ocher {
  background: #e18c00;
  /* 1 shades darker */
}
.sidepanel .components.grid > div:nth-child(3n-3) .card-component:nth-child(2n-3) > a.card-ocher {
  background: #f0a01e;
  /* core color */
}
.sidepanel .components.grid > div:nth-child(2n-3) .card-component:nth-child(2n-6) > a.card-ocher {
  background: #f5b95a;
  /* 1 shades lighter */
}
.sidepanel .components.grid > div:nth-child(3n-1) .card-component:nth-of-type(odd) > a.card-ocher {
  background: #fad296;
  /* 2 shades lighter */
}
.sidepanel .components.grid > div:nth-child(3n-2) .card-component:nth-child(7n-4) > a.card-ocher {
  background: #fae6be;
  /* 3 shades lighter */
}
/* violet */
.sidepanel .components.grid > div .card-component > a.card-violet {
  background: #644ba0;
  /* 2 shades darker */
}
.sidepanel .components.grid > div:nth-child(3n) .card-component:nth-child(3n-1) > a.card-violet {
  background: #826ee1;
  /* 1 shades darker */
}
.sidepanel .components.grid > div:nth-child(3n-3) .card-component:nth-child(2n-3) > a.card-violet {
  background: #9b8ce6;
  /* core color */
}
.sidepanel .components.grid > div:nth-child(2n-3) .card-component:nth-child(2n-6) > a.card-violet {
  background: #b4aaeb;
  /* 1 shades lighter */
}
.sidepanel .components.grid > div:nth-child(3n-1) .card-component:nth-of-type(odd) > a.card-violet {
  background: #d2c8f5;
  /* 2 shades lighter */
}
.sidepanel .components.grid > div:nth-child(3n-2) .card-component:nth-child(7n-4) > a.card-violet {
  background: #e1dcfa;
  /* 3 shades lighter */
}
/* mint */
.sidepanel .components.grid > div .card-component > a.card-mint {
  background: #28826e;
  /* 2 shades darker */
}
.sidepanel .components.grid > div:nth-child(3n) .card-component:nth-child(3n-1) > a.card-mint {
  background: #32a08c;
  /* 1 shades darker */
}
.sidepanel .components.grid > div:nth-child(3n-3) .card-component:nth-child(2n-3) > a.card-mint {
  background: #3cb5a0;
  /* core color */
}
.sidepanel .components.grid > div:nth-child(2n-3) .card-component:nth-child(2n-6) > a.card-mint {
  background: #78c8be;
  /* 1 shades lighter */
}
.sidepanel .components.grid > div:nth-child(3n-1) .card-component:nth-of-type(odd) > a.card-mint {
  background: #aadcd7;
  /* 2 shades lighter */
}
.sidepanel .components.grid > div:nth-child(3n-2) .card-component:nth-child(7n-4) > a.card-mint {
  background: #cdebe6;
  /* 3 shades lighter */
}
/* aqua */
.sidepanel .components.grid > div .card-component > a.card-aqua {
  background: #1e5a8c;
  /* 2 shades darker */
}
.sidepanel .components.grid > div:nth-child(3n) .card-component:nth-child(3n-1) > a.card-aqua {
  background: #286eaf;
  /* 1 shades darker */
}
.sidepanel .components.grid > div:nth-child(3n-3) .card-component:nth-child(2n-3) > a.card-aqua {
  background: #3287d2;
  /* core color */
}
.sidepanel .components.grid > div:nth-child(2n-3) .card-component:nth-child(2n-6) > a.card-aqua {
  background: #7dafe6;
  /* 1 shades lighter */
}
.sidepanel .components.grid > div:nth-child(3n-1) .card-component:nth-of-type(odd) > a.card-aqua {
  background: #aacdf0;
  /* 2 shades lighter */
}
.sidepanel .components.grid > div:nth-child(3n-2) .card-component:nth-child(7n-4) > a.card-aqua {
  background: #d2e6f5;
  /* 3 shades lighter */
}
/* magenta */
.sidepanel .components.grid > div .card-component > a.card-magenta {
  background: #c81950;
  /* 2 shades darker */
}
.sidepanel .components.grid > div:nth-child(3n) .card-component:nth-child(3n-1) > a.card-magenta {
  background: #dc3c69;
  /* 1 shades darker */
}
.sidepanel .components.grid > div:nth-child(3n-3) .card-component:nth-child(2n-3) > a.card-magenta {
  background: #f0557d;
  /* core color */
}
.sidepanel .components.grid > div:nth-child(2n-3) .card-component:nth-child(2n-6) > a.card-magenta {
  background: #f5789b;
  /* 1 shades lighter */
}
.sidepanel .components.grid > div:nth-child(3n-1) .card-component:nth-of-type(odd) > a.card-magenta {
  background: #faafc3;
  /* 2 shades lighter */
}
.sidepanel .components.grid > div:nth-child(3n-2) .card-component:nth-child(7n-4) > a.card-magenta {
  background: #facddc;
  /* 3 shades lighter */
}
/* frog */
.sidepanel .components.grid > div .card-component > a.card-frog {
  background: #28826e;
  /* 2 shades darker */
}
.sidepanel .components.grid > div:nth-child(3n) .card-component:nth-child(3n-1) > a.card-frog {
  background: #32a08c;
  /* 1 shades darker */
}
.sidepanel .components.grid > div:nth-child(3n-3) .card-component:nth-child(2n-3) > a.card-frog {
  background: #3cb5a0;
  /* core color */
}
.sidepanel .components.grid > div:nth-child(2n-3) .card-component:nth-child(2n-6) > a.card-frog {
  background: #78c8be;
  /* 1 shades lighter */
}
.sidepanel .components.grid > div:nth-child(3n-1) .card-component:nth-of-type(odd) > a.card-frog {
  background: #aadcd7;
  /* 2 shades lighter */
}
.sidepanel .components.grid > div:nth-child(3n-2) .card-component:nth-child(7n-4) > a.card-frog {
  background: #cdebe6;
  /* 3 shades lighter */
}
/* orange */
.sidepanel .components.grid > div .card-component > a.card-orange {
  background: #be4b00;
  /* 2 shades darker */
}
.sidepanel .components.grid > div:nth-child(3n) .card-component:nth-child(3n-1) > a.card-orange {
  background: #dc5f00;
  /* 1 shades darker */
}
.sidepanel .components.grid > div:nth-child(3n-3) .card-component:nth-child(2n-3) > a.card-orange {
  background: #eb782d;
  /* core color */
}
.sidepanel .components.grid > div:nth-child(2n-3) .card-component:nth-child(2n-6) > a.card-orange {
  background: #f0965a;
  /* 1 shades lighter */
}
.sidepanel .components.grid > div:nth-child(3n-1) .card-component:nth-of-type(odd) > a.card-orange {
  background: #fabe9b;
  /* 2 shades lighter */
}
.sidepanel .components.grid > div:nth-child(3n-2) .card-component:nth-child(7n-4) > a.card-orange {
  background: #fad7be;
  /* 3 shades lighter */
}
/* blue */
.sidepanel .components.grid > div .card-component > a.card-blue {
  background: #0a78c8;
  /* 2 shades darker */
}
.sidepanel .components.grid > div:nth-child(3n) .card-component:nth-child(3n-1) > a.card-blue {
  background: #4196e6;
  /* 1 shades darker */
}
.sidepanel .components.grid > div:nth-child(3n-3) .card-component:nth-child(2n-3) > a.card-blue {
  background: #78b4f5;
  /* core color */
}
.sidepanel .components.grid > div:nth-child(2n-3) .card-component:nth-child(2n-6) > a.card-blue {
  background: #afd2fa;
  /* 1 shades lighter */
}
.sidepanel .components.grid > div:nth-child(3n-1) .card-component:nth-of-type(odd) > a.card-blue {
  background: #bedcfa;
  /* 2 shades lighter */
}
.sidepanel .components.grid > div:nth-child(3n-2) .card-component:nth-child(7n-4) > a.card-blue {
  background: #d7ebfa;
  /* 3 shades lighter */
}
/* darkgreen */
.sidepanel .components.grid > div .card-component > a.card-darkgreen {
  background: #467d55;
  /* 2 shades darker */
}
.sidepanel .components.grid > div:nth-child(3n) .card-component:nth-child(3n-1) > a.card-darkgreen {
  background: #50965a;
  /* 1 shades darker */
}
.sidepanel .components.grid > div:nth-child(3n-3) .card-component:nth-child(2n-3) > a.card-darkgreen {
  background: #5faf69;
  /* core color */
}
.sidepanel .components.grid > div:nth-child(2n-3) .card-component:nth-child(2n-6) > a.card-darkgreen {
  background: #82c387;
  /* 1 shades lighter */
}
.sidepanel .components.grid > div:nth-child(3n-1) .card-component:nth-of-type(odd) > a.card-darkgreen {
  background: #b4dcb9;
  /* 2 shades lighter */
}
.sidepanel .components.grid > div:nth-child(3n-2) .card-component:nth-child(7n-4) > a.card-darkgreen {
  background: #d2ebd2;
  /* 3 shades lighter */
}
/* fuchsia */
.sidepanel .components.grid > div .card-component > a.card-fuchsia {
  background: #822d87;
  /* 2 shades darker */
}
.sidepanel .components.grid > div:nth-child(3n) .card-component:nth-child(3n-1) > a.card-fuchsia {
  background: #964196;
  /* 1 shades darker */
}
.sidepanel .components.grid > div:nth-child(3n-3) .card-component:nth-child(2n-3) > a.card-fuchsia {
  background: #aa5faf;
  /* core color */
}
.sidepanel .components.grid > div:nth-child(2n-3) .card-component:nth-child(2n-6) > a.card-fuchsia {
  background: #c387be;
  /* 1 shades lighter */
}
.sidepanel .components.grid > div:nth-child(3n-1) .card-component:nth-of-type(odd) > a.card-fuchsia {
  background: #d7b4d2;
  /* 2 shades lighter */
}
.sidepanel .components.grid > div:nth-child(3n-2) .card-component:nth-child(7n-4) > a.card-fuchsia {
  background: #e6d2e6;
  /* 3 shades lighter */
}
/* coral */
.sidepanel .components.grid > div .card-component > a.card-coral {
  background: #d22d1e;
  /* 2 shades darker */
}
.sidepanel .components.grid > div:nth-child(3n) .card-component:nth-child(3n-1) > a.card-coral {
  background: #f04641;
  /* 1 shades darker */
}
.sidepanel .components.grid > div:nth-child(3n-3) .card-component:nth-child(2n-3) > a.card-coral {
  background: #fa5a50;
  /* core color */
}
.sidepanel .components.grid > div:nth-child(2n-3) .card-component:nth-child(2n-6) > a.card-coral {
  background: #fa7873;
  /* 1 shades lighter */
}
.sidepanel .components.grid > div:nth-child(3n-1) .card-component:nth-of-type(odd) > a.card-coral {
  background: #faaaaa;
  /* 2 shades lighter */
}
.sidepanel .components.grid > div:nth-child(3n-2) .card-component:nth-child(7n-4) > a.card-coral {
  background: #facdcd;
  /* 3 shades lighter */
}
/* yellow */
.sidepanel .components.grid > div .card-component > a.card-yellow {
  background: #d29600;
  /* 2 shades darker */
}
.sidepanel .components.grid > div:nth-child(3n) .card-component:nth-child(3n-1) > a.card-yellow {
  background: #e6b43c;
  /* 1 shades darker */
}
.sidepanel .components.grid > div:nth-child(3n-3) .card-component:nth-child(2n-3) > a.card-yellow {
  background: #f5c841;
  /* core color */
}
.sidepanel .components.grid > div:nth-child(2n-3) .card-component:nth-child(2n-6) > a.card-yellow {
  background: #fad269;
  /* 1 shades lighter */
}
.sidepanel .components.grid > div:nth-child(3n-1) .card-component:nth-of-type(odd) > a.card-yellow {
  background: #fae6a5;
  /* 2 shades lighter */
}
.sidepanel .components.grid > div:nth-child(3n-2) .card-component:nth-child(7n-4) > a.card-yellow {
  background: #faf0c8;
  /* 3 shades lighter */
}
/*
 * ADOBE CONFIDENTIAL
 *
 * Copyright 2013 Adobe Systems Incorporated
 * All Rights Reserved.
 *
 * NOTICE:  All information contained herein is, and remains
 * the property of Adobe Systems Incorporated and its suppliers,
 * if any.  The intellectual and technical concepts contained
 * herein are proprietary to Adobe Systems Incorporated and its
 * suppliers and may be covered by U.S. and Foreign Patents,
 * patents in process, and are protected by trade secret or copyright law.
 * Dissemination of this information or reproduction of this material
 * is strictly forbidden unless prior written permission is obtained
 * from Adobe Systems Incorporated.
 */
.sidepanel-opened .js-SidePanel-content .selected-filter-panel .taglist-clearall:not([style^="display: none"]) {
  display: inline-block !important;
  vertical-align: bottom;
}
.sidepanel-opened .js-SidePanel-content .grid .card-asset {
  max-width: 100%;
  min-width: 30%;
  min-height: 5.875rem;
  background-color: #ffffff;
}
.sidepanel-opened .js-SidePanel-content .resultspinner {
  display: block;
  background-repeat: no-repeat;
  background-position: center;
  width: 100%;
  text-align: center;
  padding: 0.975rem 0;
  border-bottom-left-radius: 0.1875rem;
}
.sidepanel-opened .js-SidePanel-content .resultspinner .status {
  color: #888888;
  font-size: 1rem;
  font-weight: lighter;
  padding-top: 0.625rem;
  text-align: center;
}
.sidepanel-opened .js-SidePanel-content .loadmore {
  text-align: center;
}
/**************************************
* SidePanel for Desktop
**************************************/
@media screen and (min-width: 1025px) {
  /********************************************************
    * Asset cards in asset finder show their info on hover
      unless supplied with a .card-asset--showLabel modifier
    ********************************************************/
  .sidepanel-opened .assetfinder-content-container .card-asset:not(.card-asset--showLabel) .card .label {
    -webkit-transition: opacity 0.2s;
    -moz-transition: opacity 0.2s;
    transition: opacity 0.2s;
    opacity: 0;
    display: block;
    position: absolute;
    top: 0;
    height: 100%;
    background-color: #000000;
    min-height: 5.875rem;
  }
  .sidepanel-opened .assetfinder-content-container .card-asset:not(.card-asset--showLabel) .card:hover .label {
    display: block;
    cursor: pointer;
    opacity: 0.7;
  }
  .sidepanel-opened .assetfinder-content-container .card-asset:not(.card-asset--showLabel) .card .label > h4 {
    font-size: 0.8125rem;
    color: white;
  }
  .sidepanel-opened .assetfinder-content-container .card-asset:not(.card-asset--showLabel) .card .label p {
    font-size: 0.8125rem;
    color: #bbbbbb;
    font-weight: normal;
    line-height: 1.625rem;
  }
  .sidepanel-opened .assetfinder-content-container .card-asset:not(.card-asset--showLabel) .card .label .info {
    border-top: 0.0625rem solid #bbbbbb;
    margin: 0.5625rem;
    padding-top: 1rem;
  }
  .sidepanel-opened .assetfinder-content-container .card-asset:not(.card-asset--showLabel) .card .label .info p {
    margin-left: 0;
    margin-right: 0;
    width: 100%;
  }
}
/**************************************
* SidePanel for Mobile
**************************************/
@media screen and (max-width: 1024px) {
  .sidepanel-content .editor-AssetFinder {
    display: block;
  }
  .sidepanel-content .filter-panel .assetfilter label {
    line-height: 2.25rem;
  }
}
/**************************************
* SidePanel Inner Rail
**************************************/
.sidepanel-opened .js-SidePanel-content .rail-view {
  display: none;
}
.sidepanel-opened .js-SidePanel-content .rail-view.active {
  display: block;
}
.sidepanel #assetfinder-filter-detail {
  margin-top: 0.5rem;
}
.sidepanel-content .filter-panel .assetfilter .label-InputGroup {
  color: #6e6e6e;
  padding: 0 0 0 2px;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.5;
  font-style: normal;
}
.sidepanel-content .filter-panel .coral-Form-fieldwrapper .coral-Form-fieldlabel {
  color: #6e6e6e;
  padding: 0 0 0 2px;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.5;
  font-style: normal;
}
/**************************************
* SidePanel filter
**************************************/
.sidepanel-tab-assets .filter-panel .range-predicate:not(coral-accordion-item-content) {
  margin-bottom: 0.7rem;
  width: 14.0625rem;
}
.sidepanel-tab-assets .filter-panel .range-predicate input {
  width: 4.5rem;
  min-width: 3rem;
}
.sidepanel-tab-assets .filter-panel .range-predicate .max-range-val {
  margin: 0.3rem;
  display: inline-block;
  vertical-align: middle;
  min-width: 3rem;
}
.sidepanel-tab-assets .filter-panel .range-predicate .min-range-val {
  margin: 0.3rem;
  display: inline-block;
  vertical-align: middle;
  min-width: 3rem;
  margin-left: 0;
}
.sidepanel-tab-assets .slider-predicate ul.coral-Slider-tickLabels {
  display: none;
}
.sidepanel-tab-assets .daterange-predicate .coral-Form-fieldwrapper {
  display: block;
  float: none;
}
/**************************************
* Paragraph cards
**************************************/
.editor-AssetFinder coral-card.editor-Card-asset {
  min-width: 140px;
  min-height: 100px;
}
.editor-AssetFinder coral-card.editor-Card-asset coral-card-asset {
  min-height: 100px;
}
/* Temporary Coral override (CQ-87581) */
.editor-Card-asset coral-card-title {
  display: inline-block;
  max-width: 80%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.editor-Card-asset .editor-Card-viewInAdmin {
  float: right;
  background: inherit;
  border: 0.0625rem solid transparent;
  height: auto;
  min-width: auto;
  padding: 0;
}
.editor-Card-asset .editor-Card-viewInAdmin:hover {
  cursor: pointer;
}
.editor-AssetFinder.editor-AssetFinder--noViewInAdmin .editor-Card-viewInAdmin {
  display: none;
}
.card-asset[data-type="Paragraphs"] .image {
  position: relative;
  overflow: hidden;
  min-height: 80px;
  max-height: 225px;
}
.card-asset[data-type="Paragraphs"] .image:after {
  content: " ";
  position: absolute;
  width: 100%;
  height: 100%;
  bottom: 0;
  left: 0;
  cursor: pointer;
}
/**
Paragraphs excerpts
**/
.card-asset[data-type="Paragraphs"] .image p,
.card-asset[data-type="Paragraphs"] .image h1,
.card-asset[data-type="Paragraphs"] .image h2,
.card-asset[data-type="Paragraphs"] .image h3 {
  margin: 0.375rem 0.625rem;
  font-size: inherit;
}
.card-asset[data-type="Paragraphs"] .image .title,
.card-asset[data-type="Paragraphs"] .image .more {
  display: block;
}
.editor-ContentTree {
  display: flex;
  flex-direction: column;
  height: 100vh;
}
.editor-ContentTree .content-panel {
  padding-top: 0;
}
.editor-ContentTree-openDialog {
  position: absolute;
  right: 0;
  bottom: 0;
}
.editor-ContentTree-item {
  color: var(--spectrum-global-color-gray-700, #6e6e6e);
  display: block;
}
.editor-ContentTree-itemTitle {
  color: #323232;
}
.cq-Timer {
  -moz-box-sizing: border-box;
  border-radius: 0.1875rem;
  display: inline-block;
  font-family: adobe-clean, Helvetica, Arial, sans-serif;
  height: 1.5rem;
  line-height: 1rem;
  margin: 0;
  padding: 0.25rem 0.5rem 0;
  text-align: center;
  font-size: 0.75rem;
  color: #4b4b4b;
  background: rgba(150, 150, 150, 0.3);
}
.cq-Timer--bad {
  background-color: #fffa85;
}
.cq-Timer--horrible {
  background-color: #ffa75f;
}
.cq-DeveloperRail .cq-DeveloperRail-actionTrigger {
  margin: 0.125rem 0 0 1.375rem;
  color: #303030;
  font-style: normal;
  opacity: 0.75;
  cursor: pointer;
  text-decoration: none;
}
.cq-DeveloperRail .cq-DeveloperRail-actionTrigger.is-error {
  color: #fa483e;
}
.cq-DeveloperRail .cq-DeveloperRail-actionTrigger:hover {
  opacity: 1;
}
.cq-DeveloperRail .cq-DeveloperRail-actionTrigger.cq-DeveloperRail-actionTrigger--defaultAction:before {
  color: #2583d8;
}
/*
 * ADOBE CONFIDENTIAL
 *
 * Copyright 2016 Adobe Systems Incorporated
 * All Rights Reserved.
 *
 * NOTICE:  All information contained herein is, and remains
 * the property of Adobe Systems Incorporated and its suppliers,
 * if any.  The intellectual and technical concepts contained
 * herein are proprietary to Adobe Systems Incorporated and its
 * suppliers and may be covered by U.S. and Foreign Patents,
 * patents in process, and are protected by trade secret or copyright law.
 * Dissemination of this information or reproduction of this material
 * is strictly forbidden unless prior written permission is obtained
 * from Adobe Systems Incorporated.
 */
.cq-Tree-item {
  border-bottom: 0.0625rem solid #f3f3f3;
}
.cq-Tree-item coral-tag {
  position: absolute;
  right: .625rem;
  font-weight: normal;
}
.cq-Tree-item:last-of-type {
  border-bottom: 0;
}
.cq-Tree-itemChildCount {
  padding-left: .5rem;
  font-weight: normal;
  color: #969696;
}
/*
 * ADOBE CONFIDENTIAL
 *
 * Copyright 2016 Adobe Systems Incorporated
 * All Rights Reserved.
 *
 * NOTICE:  All information contained herein is, and remains
 * the property of Adobe Systems Incorporated and its suppliers,
 * if any.  The intellectual and technical concepts contained
 * herein are proprietary to Adobe Systems Incorporated and its
 * suppliers and may be covered by U.S. and Foreign Patents,
 * patents in process, and are protected by trade secret or copyright law.
 * Dissemination of this information or reproduction of this material
 * is strictly forbidden unless prior written permission is obtained
 * from Adobe Systems Incorporated.
 */
.u-scrollable {
  overflow: auto;
}
.u-emptyMessage {
  padding: .9375rem !important;
  font-style: italic;
  color: #969696;
  background-color: #F0F0F0;
}
.u-preFormatted {
  font-size: 0.75rem;
  line-height: 0.875rem;
  display: block;
  white-space: pre;
}
.cq-DeveloperRail-componentActions {
  position: relative;
  padding: .125rem 0;
  padding-right: 58px;
}
.cq-DeveloperRail-componentActions coral-tag {
  position: absolute;
  top: .1875rem;
  right: .625rem;
}
.cq-DeveloperRail-componentActions [is=coral-button].is-error {
  color: #dc554b;
}
.cq-DeveloperRail-componentActions [is=coral-button].is-error:not(:disabled):not(.is-disabled):focus,
.cq-DeveloperRail-componentActions [is=coral-button].is-error:not(:disabled):not(.is-disabled).is-focused,
.cq-DeveloperRail-componentActions [is=coral-button].is-error:not(:disabled):not(.is-disabled):hover {
  color: #d24637;
}
.cq-DeveloperRail-detailsTitle {
  position: relative;
  box-sizing: border-box;
  height: 2.875rem;
  margin: 0;
  padding: .4375rem .9375rem;
  line-height: 2rem;
  font-weight: 700;
  font-style: normal;
  font-size: .8125rem;
  color: #323232;
  background-color: #f0f0f0;
  cursor: pointer;
}
.cq-DeveloperRail-detailsTitle.is-error {
  background-color: #dc554b;
}
.cq-DeveloperRail-detailsTitle coral-icon {
  margin-right: .25rem;
  min-width: .75rem;
  color: rgba(0, 0, 0, 0.6);
}
.cq-DeveloperRail-detailsTitle coral-tag {
  position: absolute;
  right: .625rem;
  font-weight: normal;
}
.cq-DeveloperRail-detailsSection {
  padding: .4375rem .9375rem;
  background-color: #f0f0f0;
}
.cq-DeveloperRail-detailsSectionHeader {
  margin: 0;
  padding-bottom: .4375rem;
  font-size: .75rem;
  text-transform: uppercase;
  color: #969696;
}
.cq-DeveloperRail-detailsSectionContent {
  margin: 0;
  padding: 0 0 .4375rem 0;
  list-style-type: none;
  word-break: break-all;
}
.cq-DeveloperRail-detailsSectionContentListItem {
  padding: .25rem 0;
}
.cq-DeveloperRail-listItem {
  border-bottom: 0.0625rem solid #f3f3f3;
  padding: .625rem .9375rem;
  font-size: .8125rem;
  font-weight: 700;
  font-style: normal;
  line-height: 1.375rem;
  color: #323232;
  background-color: #ebebeb;
}
.cq-DeveloperRail-listItem:hover {
  background-color: #f0f0f0;
  cursor: pointer;
}
.editor-PageInfo {
  width: 15.625rem;
}
.editor-PageInfo [is=coral-button] {
  display: block;
  box-sizing: border-box;
  width: 100%;
  border: 0;
  border-radius: 0;
  padding: .625rem;
  min-height: 2.5rem;
  font-size: .8125rem;
  font-weight: normal;
  line-height: 1.0625rem;
  text-decoration: none;
  text-align: left;
  text-shadow: none;
  background-color: #fff;
  color: #323232;
  transition: background-color 0.15s ease-out;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-font-smoothing: auto;
  -moz-osx-font-smoothing: auto;
  font-smoothing: auto;
}
.editor-PageInfo [is=coral-button]:not(:disabled):not(.is-disabled):hover,
.editor-PageInfo [is=coral-button]:not(:disabled):not(.is-disabled):active,
.editor-PageInfo [is=coral-button]:not(:disabled):not(.is-disabled):focus,
.editor-PageInfo [is=coral-button]:not(:disabled):not(.is-disabled).is-selected,
.editor-PageInfo [is=coral-button]:not(:disabled):not(.is-disabled).is-focused {
  outline: none;
  border: 0;
  background-color: #378EF0;
  box-shadow: none;
}
.editor-PageInfo > span {
  display: block;
  padding: .625rem;
  line-height: 1.5em;
  color: #6d6d6d;
}
/* for the coralui2 transition */
#TourForm {
  display: none;
}
.js-sidePanel-edit .rail-switch {
  display: none;
}