.templatebuilder_PLUG_element_maincontainer_MainContainer {
    font-family: sans-serif;
    box-sizing: border-box;
    font-size: 1em;
    color: #909090;
    cursor: auto;
}

html {
    height: 100%;
}

/*
all elements without width setted and parent with content orientation row, need to grow to all available size
.ContainerContentDirectionRow class name is added for all container with content orientation row in templatebuilder_PLUG_element_container_Base class
.ElementHasWidthAuto class name is added for all element whitout width setted in templatebuilder_element_Base class
*/

@media (min-width: 992px) {
    .ContentDirectionRow-desktop.HorizontalAlignStretch-desktop > * {
        flex-grow: 1;
    }

    .ContentDirectionRow-desktop.VerticalAlignStretch-desktop > * {
        align-self: stretch;
    }

    .ContentDirectionColumn-desktop.VerticalAlignStretch-desktop > * {
        flex-grow: 1;
    }

    .ContentDirectionColumn-desktop.HorizontalAlignStretch-desktop > * {
        align-self: stretch;
    }

    .ContentDirectionRow-desktop.HorizontalAlignStretch-desktop > .ElementHasntWidthAuto-desktop {
        flex-grow: 0;
    }

    .ContentDirectionRow-desktop.VerticalAlignStretch-desktop > .ElementHasntHeightAuto-desktop {
        align-self: auto;
    }

    .ContentDirectionColumn-desktop.VerticalAlignStretch-desktop > .ElementHasntHeightAuto-desktop {
        flex-grow: 0;
    }

    .ContentDirectionColumn-desktop.HorizontalAlignStretch-desktop > .ElementHasntWidthAuto-desktop {
        align-self: auto;
    }

    .ContentDirectionRow-desktop > .ElementHasHeightFull-desktop {
        /* we need use !important because the rule created by the builder with the value setted by the user, use the element Id to match, and has more relevance */
        height: auto !important;
        align-self: stretch;
    }
}

@media (max-width: 991.98px) and (min-width: 575.99px) {
    .ContentDirectionRow-tablet.HorizontalAlignStretch-tablet > * {
        flex-grow: 1;
    }

    .ContentDirectionRow-tablet.VerticalAlignStretch-tablet > * {
        align-self: stretch;
    }

    .ContentDirectionColumn-tablet.VerticalAlignStretch-tablet > * {
        flex-grow: 1;
    }

    .ContentDirectionColumn-tablet.HorizontalAlignStretch-tablet > * {
        align-self: stretch;
    }

    .ContentDirectionRow-tablet.HorizontalAlignStretch-tablet > .ElementHasntWidthAuto-tablet {
        flex-grow: 0;
    }

    .ContentDirectionRow-tablet.VerticalAlignStretch-tablet > .ElementHasntHeightAuto-tablet {
        align-self: auto;
    }

    .ContentDirectionColumn-tablet.VerticalAlignStretch-tablet > .ElementHasntHeightAuto-tablet {
        flex-grow: 0;
    }

    .ContentDirectionColumn-tablet.HorizontalAlignStretch-tablet > .ElementHasntWidthAuto-tablet {
        align-self: auto;
    }

    .ContentDirectionRow-tablet > .ElementHasHeightFull-tablet {
        /* we need use !important because the rule created by the builder with the value setted by the user, use the element Id to match, and has more relevance */
        height: auto !important;
        align-self: stretch;
    }
}

@media (max-width: 575.98px) {
    .ContentDirectionRow-mobile.HorizontalAlignStretch-mobile > * {
        flex-grow: 1;
    }

    .ContentDirectionRow-mobile.VerticalAlignStretch-mobile > * {
        align-self: stretch;
    }

    .ContentDirectionColumn-mobile.VerticalAlignStretch-mobile > * {
        flex-grow: 1;
    }

    .ContentDirectionColumn-mobile.HorizontalAlignStretch-mobile > * {
        align-self: stretch;
    }

    .ContentDirectionRow-mobile.HorizontalAlignStretch-mobile > .ElementHasntWidthAuto-mobile {
        flex-grow: 0;
    }

    .ContentDirectionRow-mobile.VerticalAlignStretch-mobile > .ElementHasntHeightAuto-mobile {
        align-self: auto;
    }

    .ContentDirectionColumn-mobile.VerticalAlignStretch-mobile > .ElementHasntHeightAuto-mobile {
        flex-grow: 0;
    }

    .ContentDirectionColumn-mobile.HorizontalAlignStretch-mobile > .ElementHasntWidthAuto-mobile {
        align-self: auto;
    }

    .ContentDirectionRow-mobile > .ElementHasHeightFull-mobile {
        /* we need use !important because the rule created by the builder with the value setted by the user, use the element Id to match, and has more relevance */
        height: auto !important;
        align-self: stretch;
    }
}

/******************************************/
/*           *** WARNING! ***             */
/*                                        */
/*  This file is autogenerated.           */
/*  Do not modify values by hand.         */
/*  To update the palette, modify colors  */
/*  in uicolors_ColorGroups and run       */
/*  exportCssPalette command.             */
/*  See: '#Export CSS Palette' section in */
/*  /module/uicolors/Readme.md file.      */
/******************************************/
:root {
    /* RED */

    /* ORANGE */

    /* YELLOW */

    /* GREEN */

    /* BLUE */

    /* PURPLE */

    /* PINK */

    /* NEUTRAL */
}
.templatebuilder_PLUG_element_static_Video_Image {
    width: inherit;
    height: inherit;
    background-color: #e3e3e3;
}
.templatebuilder_PLUG_element_static_Video_Iframe {
    height: 100%;
}
.templatebuilder_PLUG_element_static_Video_IframeWithAutoWidth .templatebuilder_PLUG_element_static_Video_Image {
    width: auto;
}
.templatebuilder_PLUG_element_static_Video_IframeWithFullWidth .templatebuilder_PLUG_element_static_Video_Iframe,
.templatebuilder_PLUG_element_static_Video_IframeWithFullWidth .templatebuilder_PLUG_element_static_Video_Image {
    width: 100%;
}
.templatebuilder_PLUG_element_static_Video_IframeWithFixedWidth .templatebuilder_PLUG_element_static_Video_Iframe,
.templatebuilder_PLUG_element_static_Video_IframeWithFixedWidth .templatebuilder_PLUG_element_static_Video_Image {
    width: 100%;
}

.templatebuilder_PLUG_element_static_Image img {
    border: 0;
    -ms-interpolation-mode: bicubic;
}

.templatebuilder_PLUG_element_static_Image svg:not(:root) {
    overflow: hidden;
}

.templatebuilder_PLUG_element_static_Image_PictureElement {
    display: flex;
}

.templatebuilder_PLUG_element_static_Image_PictureElement,
.templatebuilder_PLUG_element_static_Image_Img {
    width: 100%;
    height: 100%;
}

.templatebuilder_PLUG_element_static_Image_Img {
    align-self: flex-start;
    object-fit: contain;
}

.templatebuilder_PLUG_element_static_Image.autoWidth,
.templatebuilder_PLUG_element_static_Image.autoWidth .templatebuilder_PLUG_element_static_Image_PictureElement,
.templatebuilder_PLUG_element_static_Image.autoWidth .templatebuilder_PLUG_element_static_Image_Img {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
}

.templatebuilder_PLUG_element_static_Image.autoHeight,
.templatebuilder_PLUG_element_static_Image.autoHeight .templatebuilder_PLUG_element_static_Image_PictureElement,
.templatebuilder_PLUG_element_static_Image.autoHeight .templatebuilder_PLUG_element_static_Image_Img {
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
}

.templatebuilder_PLUG_element_static_Image_BoldLabel .templatebuilder_element_editor_GridFieldLabel {
    font-weight: bold;
}

@supports (-webkit-hyphens:none){
    .templatebuilder_PLUG_element_static_Image_PictureElement {
        display: flex;
    }

    .templatebuilder_PLUG_element_static_Image.autoWidth,
    .templatebuilder_PLUG_element_static_Image.autoWidth .templatebuilder_PLUG_element_static_Image_PictureElement,
    .templatebuilder_PLUG_element_static_Image.autoWidth .templatebuilder_PLUG_element_static_Image_Img {
        width: auto;
    }

    .templatebuilder_PLUG_element_static_Image.autoHeight,
    .templatebuilder_PLUG_element_static_Image.autoHeight .templatebuilder_PLUG_element_static_Image_PictureElement,
    .templatebuilder_PLUG_element_static_Image.autoHeight .templatebuilder_PLUG_element_static_Image_Img {
        height: auto;
    }
}

a.templatebuilder_PLUG_element_static_Link {
    text-decoration: none;
}

a.templatebuilder_PLUG_element_static_Link:focus {
    outline: thin dotted;
}

/*
 * To maintain the previous behavior we need to exclude this classes
 */

a.templatebuilder_PLUG_element_static_Link:hover:not(.templatebuilder_preview_item_Item_Hover):not(.templatebuilder_preview_item_DragAndDrop_Dragged),
a.templatebuilder_PLUG_element_static_Link:active:not(.templatebuilder_preview_item_Item_Hover):not(.templatebuilder_preview_item_DragAndDrop_Dragged) {
    outline: 0;
}

.templatebuilder_PLUG_element_static_Link_HideLabel {
    display: none;
}

.templatebuilder_PLUG_element_static_accordion_Item {
    word-wrap: break-word;
}

.templatebuilder_PLUG_element_static_accordion_Item > .templatebuilder_PLUG_element_static_accordion_Item_Header {
    list-style-type: none;
    outline: none;
    cursor: pointer;
    padding: 5px;
    border-radius: 5px;
    display: flex;
    width: auto;
}

/* Safari marker fix */

.templatebuilder_PLUG_element_static_accordion_Item > .templatebuilder_PLUG_element_static_accordion_Item_Header::marker,
.templatebuilder_PLUG_element_static_accordion_Item > .templatebuilder_PLUG_element_static_accordion_Item_Header::-webkit-details-marker {
    display: none;
}

.templatebuilder_PLUG_element_static_accordion_Item > .templatebuilder_PLUG_element_static_accordion_Item_Header::after {
    content: '  ';
    float: right;
    width: 20px;
    height: 20px;
    align-self: center;
    margin-left: auto;
    flex-shrink: 0;
    background-position: center;
    background-repeat: no-repeat;
}

.templatebuilder_PLUG_element_static_accordion_Item_HeaderText {
    margin-right: 25px;
    flex-grow: 1;
}

@media only screen and (min-width: 992px) {
    .templatebuilder_PLUG_element_static_accordion_Item > .templatebuilder_PLUG_element_static_accordion_Item_Header.templatebuilder_PLUG_element_static_accordion_Item_Header-chevrons::after {
        mask-image: url('/jscore/images/controls/CollapsibleDownArrow.svg');
        mask-repeat: no-repeat;
        -webkit-mask-image: url('/jscore/images/controls/CollapsibleDownArrow.svg');
        -webkit-mask-repeat: no-repeat;
    }

    .templatebuilder_PLUG_element_static_accordion_Item[open] > .templatebuilder_PLUG_element_static_accordion_Item_Header.templatebuilder_PLUG_element_static_accordion_Item_Header-chevrons::after {
        transform: rotate(180deg);
    }

    .templatebuilder_PLUG_element_static_accordion_Item > .templatebuilder_PLUG_element_static_accordion_Item_Header.templatebuilder_PLUG_element_static_accordion_Item_Header-plusAndMinus::after {
        mask-image: url('../cssImages/uicore/builder/Plus.svg');
        mask-repeat: no-repeat;
        -webkit-mask-image: url('../cssImages/uicore/builder/Plus.svg');
        -webkit-mask-repeat: no-repeat;
    }

    .templatebuilder_PLUG_element_static_accordion_Item[open] > .templatebuilder_PLUG_element_static_accordion_Item_Header.templatebuilder_PLUG_element_static_accordion_Item_Header-plusAndMinus::after {
        mask-image: url('../cssImages/templatebuilder/inputs/accordion/AccordionElementMinus.svg');
        mask-repeat: no-repeat;
        -webkit-mask-image: url('../cssImages/templatebuilder/inputs/accordion/AccordionElementMinus.svg');
        -webkit-mask-repeat: no-repeat;
    }
}

@media only screen and (min-width: 576px) and (max-width: 991px) {
    .templatebuilder_PLUG_element_static_accordion_Item > .templatebuilder_PLUG_element_static_accordion_Item_Header.templatebuilder_PLUG_element_static_accordion_Item_Header-tablet-chevrons::after {
        mask-image: url('/jscore/images/controls/CollapsibleDownArrow.svg');
        mask-repeat: no-repeat;
        -webkit-mask-image: url('/jscore/images/controls/CollapsibleDownArrow.svg');
        -webkit-mask-repeat: no-repeat;
    }

    .templatebuilder_PLUG_element_static_accordion_Item[open] > .templatebuilder_PLUG_element_static_accordion_Item_Header.templatebuilder_PLUG_element_static_accordion_Item_Header-tablet-chevrons::after {
        transform: rotate(180deg);
    }

    .templatebuilder_PLUG_element_static_accordion_Item > .templatebuilder_PLUG_element_static_accordion_Item_Header.templatebuilder_PLUG_element_static_accordion_Item_Header-tablet-plusAndMinus::after {
        mask-image: url('../cssImages/uicore/builder/Plus.svg');
        mask-repeat: no-repeat;
        -webkit-mask-image: url('../cssImages/uicore/builder/Plus.svg');
        -webkit-mask-repeat: no-repeat;
    }

    .templatebuilder_PLUG_element_static_accordion_Item[open] > .templatebuilder_PLUG_element_static_accordion_Item_Header.templatebuilder_PLUG_element_static_accordion_Item_Header-tablet-plusAndMinus::after {
        mask-image: url('../cssImages/templatebuilder/inputs/accordion/AccordionElementMinus.svg');
        mask-repeat: no-repeat;
        -webkit-mask-image: url('../cssImages/templatebuilder/inputs/accordion/AccordionElementMinus.svg');
        -webkit-mask-repeat: no-repeat;
    }
}

@media only screen and (max-width: 575px) {
    .templatebuilder_PLUG_element_static_accordion_Item > .templatebuilder_PLUG_element_static_accordion_Item_Header.templatebuilder_PLUG_element_static_accordion_Item_Header-mobile-chevrons::after {
        -webkit-mask-image: url('/jscore/images/controls/CollapsibleDownArrow.svg');
                mask-image: url('/jscore/images/controls/CollapsibleDownArrow.svg');
        mask-repeat: no-repeat;
        -webkit-mask: url('/jscore/images/controls/CollapsibleDownArrow.svg') no-repeat;
        -webkit-mask-repeat: no-repeat;
    }

    .templatebuilder_PLUG_element_static_accordion_Item[open] > .templatebuilder_PLUG_element_static_accordion_Item_Header.templatebuilder_PLUG_element_static_accordion_Item_Header-mobile-chevrons::after {
        transform: rotate(180deg);
    }

    .templatebuilder_PLUG_element_static_accordion_Item > .templatebuilder_PLUG_element_static_accordion_Item_Header.templatebuilder_PLUG_element_static_accordion_Item_Header-mobile-plusAndMinus::after {
        -webkit-mask-image: url('../cssImages/uicore/builder/Plus.svg');
                mask-image: url('../cssImages/uicore/builder/Plus.svg');
        mask-repeat: no-repeat;
        -webkit-mask: url('/ASSET/uicore/images/builder/Plus.svg');
        -webkit-mask-repeat: no-repeat;
    }

    .templatebuilder_PLUG_element_static_accordion_Item[open] > .templatebuilder_PLUG_element_static_accordion_Item_Header.templatebuilder_PLUG_element_static_accordion_Item_Header-mobile-plusAndMinus::after {
        -webkit-mask-image: url('../cssImages/templatebuilder/inputs/accordion/AccordionElementMinus.svg');
                mask-image: url('../cssImages/templatebuilder/inputs/accordion/AccordionElementMinus.svg');
        mask-repeat: no-repeat;
        -webkit-mask: url('/ASSET/templatebuilder/images/inputs/accordion/AccordionElementMinus.svg');
        -webkit-mask-repeat: no-repeat;
    }
}

