@import url("/DublinThemeCMS/Theme.DublinThemeCMS.css?678");

/*
    How to generate a theme for your company: 
    
        1 - Go to https://silkui.outsystems.com/ThemeCustomizer/GenerateDublin.aspx
        2 - Copy the generated CSS
        3 - Replace the CSS for Primary Color Customization below with the Generated CSS

*/

/*------------------------------------*\
             Import Font
\*------------------------------------*/
/* fonts are imported in the CMS theme */

/*------------------------------------*\
             Font Definition
\*------------------------------------*/

/*------------------------------------*\
              Font Classes
\*------------------------------------*/

/* Font classes are defined in the CMS theme */

/***************************************/r
/***** PRIMARY COLOR CUSTOMIZATION *****/
/***************************************/


a.ListNavigation_PageNumber:link,
span.ListNavigation_CurrentPageNumber,
span.ListNavigation_Ellipsis {
    color: #959EA4; /*primary-color*/
}



a.ListNavigation_Previous:link,
a.ListNavigation_Next:link,
span.ListNavigation_DisabledNext, 
span.ListNavigation_DisabledPrevious {
    color: #959EA4; /*primary-color*/
}

.Feedback_AjaxWait {
    color: #959EA4; /*primary-color*/
}

.Login_Footer {
    background: #959EA4; /*primary-color*/
    background-image: -webkit-linear-gradient(90deg, rgba(255, 255, 255, 0.2) 0%, rgba(0, 0, 0, 0.2) 100%);
    background-image:    -moz-linear-gradient(90deg, rgba(255, 255, 255, 0.2) 0%, rgba(0, 0, 0, 0.2) 100%);
    background-image:     -ms-linear-gradient(90deg, rgba(255, 255, 255, 0.2) 0%, rgba(0, 0, 0, 0.2) 100%);
    background-image:      -o-linear-gradient(90deg, rgba(255, 255, 255, 0.2) 0%, rgba(0, 0, 0, 0.2) 100%);
    background-image:          linear-gradient(0deg, rgba(255, 255, 255, 0.2) 0%, rgba(0, 0, 0, 0.2) 100%);
}

.AccordionVertical_item.open .AccordionVertical__header {
    border-top-color: #959EA4; /*primary-color*/
}

.AccordionVertical_item.open .AccordionVertical___icon > .fa {
    background-color:  #959EA4; /*primary-color*/
    border-color:  #959EA4; /*primary-color*/
}

.AccordionVertical_item.open > .AccordionVertical__header > .AccordionVertical___icon > .fa {
    background-color: #959EA4; /*primary-color*/
    border-color: #959EA4; /*primary-color*/
}

.Post_icon img {
    border-color: #959EA4; /*primary-color*/
}

.expanded .SectionExpandable__icon.Heading2 > .fa {
    background-color: #959EA4; /*primary-color*/
    border: #959EA4; /*primary-color*/
}

.Panel .SectionExpandable__icon.Heading2 > .fa {
    color: #959EA4; /*primary-color*/
    border: 1px solid #959EA4; /*primary-color*/
}

.Panel .expanded .SectionExpandable__icon.Heading2 > .fa {
    background-color: #959EA4; /*primary-color*/
    border: #959EA4; /*primary-color*/
}
.Calendar-day-selected, 
.Calendar-day-selected:hover {
    background: #959EA4; /*primary-color*/
}

.Calendar-navDisabled > div, 
.topBar-navDisabled .Calendar-navBtn > div,
.Calendar-time-down, 
.Calendar-time-up, 
.Calendar-time-am {
    color: #959EA4; /*primary-color*/
}

.Calendar-dayNames {
    border-top-color: #959EA4; /*primary-color*/
}

.Calendar-navBtn > div {
    color: #959EA4; /*primary-color*/
}

.select2-container .select2-choice {
    color: #959EA4; /*primary-color*/
}

.desktop .NavigationBar a:hover, 
.desktop .NavigationBar a:link:hover {
    color: #959EA4; /*primary-color*/
}

.NavigationBar a.Active {
    color: #959EA4; /*primary-color*/
}

.desktop .NavigationBar a:hover:after, 
.desktop .NavigationBar a:link:hover:after,
.NavigationBar a.Active:after {
    background-color: #959EA4; /*primary-color*/ 
}

.NavigationBar a.Active:not(.IE8):before {
    border-bottom-color: #959EA4; /*primary-color*/
}

.desktop .NavigationBar.Vertical a:hover,
.desktop .NavigationBar.Vertical a:link:hover,
.NavigationBar.Vertical a.Active,
.NavigationBar.Vertical a:link.Active {
  border-color: #959EA4; /*primary-color*/
}

.NavigationBar.Vertical a.Active:not(.IE8):before {
    border-left-color: #959EA4; /*primary-color*/
}

.phone .NavigationBar .InlineDropdown:active,
.phone .NavigationBar .InlineDropdown:link:active,
.tablet .NavigationBar .InlineDropdown:active,
.tablet .NavigationBar .InlineDropdown:link:active,
.phone .NavigationBar a:active, 
.phone .NavigationBar a:link:active,
.tablet .NavigationBar a:active, 
.tablet .NavigationBar a:link:active {
    color: #959EA4; /*primary-color*/
}

.phone .NavigationBar .InlineDropdown:active:after,
.phone .NavigationBar .InlineDropdown:link:active:after,
.tablet .NavigationBar .InlineDropdown:active:after,
.tablet .NavigationBar .InlineDropdown:link:active:after,
.phone .NavigationBar a:active:after, 
.phone .NavigationBar a:link:active:after,
.tablet .NavigationBar a:active:after, 
.tablet .NavigationBar a:link:active:after {
    background-color: #959EA4; /*primary-color*/
}

.Tabs__tab.active {
    border-top-color: #959EA4; /*primary-color*/
}

.Panel .Tabs__tab.active:not(.ie8):before {
    border-top-color: #959EA4; /*primary-color*/
}

.WizardStep.ActiveStep {
    background: #959EA4; /*primary-color*/
    -webkit-filter: brightness(90%);
    filter: brightness(0.9);
}

.WizardStep.ActiveStep:before {
    border-top-color: #959EA4; /*primary-color*/
    border-bottom-color: #959EA4; /*primary-color*/
}

.WizardStep.Past {
    background: #959EA4; /*primary-color*/
}

.WizardStep.Past:before {
    border-top-color: #959EA4; /*primary-color*/
    border-bottom-color: #959EA4; /*primary-color*/
}

.Button,
a.Button {
    color: #959EA4; /*primary-color*/
}

.Button.ButtonDefault,
.Button.Is_Default {
    background-color: #959EA4; /*primary-color*/
    border-color: #959EA4; /*primary-color*/
    border-bottom-color: rgba(0,0,0,0.2);
}

.desktop .Button.ButtonDefault:hover, 
.desktop .Button.Is_Default:hover {
    background-color: #959EA4; /*primary-color*/
    border-color: #959EA4; /*primary-color*/
    border-bottom-color: rgba(0,0,0,0.2);
    -webkit-filter: brightness(80%);
    filter: brightness(0.8);
}
.Button.Cancel,
.desktop .Button.Cancel:hover {
    border-color: #999;
    color: #999;
}
.desktop .Button.Cancel:hover {
    -webkit-filter: brightness(80%);
    filter: brightness(0.8);
}

a,
a:link,
a:visited,
.EditableTable tr.RowControlGroup a,
.Button.Link {
    color: #959EA4; /*primary-color*/
}

a.ActionAdd:hover{
    background-color: #959EA4; /*primary-color*/
    border-bottom-color: #959EA4; /*primary-color*/
    -webkit-filter: brightness(90%);
    filter: brightness(0.9);
}
a.ActionDelete:hover{
    background-color: #bb5858;
    -webkit-filter: brightness(90%);
    filter: brightness(0.9);
}

a.ActionAdd,
a.ActionDelete {
    color: #FFF;
}

a.ActionAdd {
    background-color: #959EA4; /*primary-color*/
    border-bottom-color: #959EA4; /*primary-color*/
}


.desktop .Button.Link:hover {
    background-color: transparent;
    border-color: #959EA4; /*primary-color*/
    color: #959EA4; /*primary-color*/
}

div.os-internal-Popup .os-internal-ui-dialog .os-internal-ui-dialog-titlebar,
div.os-internal-Popup.os-internal-ui-dialog .os-internal-ui-dialog-titlebar {
    background: #959EA4; /*primary-color*/
}


.SectionIndex a.active, 
.SectionIndex a:hover{    
    border-bottom-color: #959EA4; /*primary-color*/
    color: #959EA4; /*primary-color*/
}

.SectionIndex.vertical a.active, 
.SectionIndex.vertical  a:hover{
    border-left-color: #959EA4; /*primary-color*/
}

.TableRecords > tbody > tr > td a {
    color: #959EA4; /*primary-color*/
}

/*.TableRecords img
{
    max-width: 70px;
    height: auto;
}*/

.IconBadge_number {
    background-color: #959EA4; /*primary-color*/
}

.pika-prev:after,
.pika-next:after {
    color: #959EA4; /*primary-color*/ 
}

.pika-title {
    border-bottom: 2px solid #959EA4; /*primary-color*/
}

.is-selected .pika-button {
   background-color: #959EA4; /*primary-color*/
}

.has-event .pika-button:after {
   background-color: #959EA4; /*primary-color*/ 
}



.Feedback_AjaxWait {
    color: #222;
}

@-webkit-keyframes loader {
    0%,
    100% {
        box-shadow: 0 -3em 0 .2em #222, 2em -2em 0 0 #222, 3em 0 0 -.5em #222, 2em 2em 0 -.5em #222, 0 3em 0 -.5em #222, -2em 2em 0 -.5em #222, -3em 0 0 -.5em #222, -2em -2em 0 0 #222;
    }
    12.5% {
        box-shadow: 0 -3em 0 0 #222, 2em -2em 0 .2em #222, 3em 0 0 0 #222, 2em 2em 0 -.5em #222, 0 3em 0 -.5em #222, -2em 2em 0 -.5em #222, -3em 0 0 -.5em #222, -2em -2em 0 -.5em #222;
    }
    25% {
        box-shadow: 0 -3em 0 -.5em #222, 2em -2em 0 0 #222, 3em 0 0 .2em #222, 2em 2em 0 0 #222, 0 3em 0 -.5em #222, -2em 2em 0 -.5em #222, -3em 0 0 -.5em #222, -2em -2em 0 -.5em #222;
    }
    37.5% {
        box-shadow: 0 -3em 0 -.5em #222, 2em -2em 0 -.5em #222, 3em 0 0 0 #222, 2em 2em 0 .2em #222, 0 3em 0 0 #222, -2em 2em 0 -.5em #222, -3em 0 0 -.5em #222, -2em -2em 0 -.5em #222;
    }
    50% {
        box-shadow: 0 -3em 0 -.5em #222, 2em -2em 0 -.5em #222, 3em 0 0 -.5em #222, 2em 2em 0 0 #222, 0 3em 0 .2em #222, -2em 2em 0 0 #222, -3em 0 0 -.5em #222, -2em -2em 0 -.5em #222;
    }
    62.5% {
        box-shadow: 0 -3em 0 -.5em #222, 2em -2em 0 -.5em #222, 3em 0 0 -.5em #222, 2em 2em 0 -.5em #222, 0 3em 0 0 #222, -2em 2em 0 .2em #222, -3em 0 0 0 #222, -2em -2em 0 -.5em #222;
    }
    75% {
        box-shadow: 0 -3em 0 -.5em #222, 2em -2em 0 -.5em #222, 3em 0 0 -.5em #222, 2em 2em 0 -.5em #222, 0 3em 0 -.5em #222, -2em 2em 0 0 #222, -3em 0 0 .2em #222, -2em -2em 0 0 #222;
    }
    87.5% {
        box-shadow: 0 -3em 0 0 #222, 2em -2em 0 -.5em #222, 3em 0 0 -.5em #222, 2em 2em 0 -.5em #222, 0 3em 0 -.5em #222, -2em 2em 0 0 #222, -3em 0 0 0 #222, -2em -2em 0 .2em #222;
    }
}
@keyframes loader {
    0%,
    100% {
        box-shadow: 0 -3em 0 .2em #222, 2em -2em 0 0 #222, 3em 0 0 -.5em #222, 2em 2em 0 -.5em #222, 0 3em 0 -.5em #222, -2em 2em 0 -.5em #222, -3em 0 0 -.5em #222, -2em -2em 0 0 #222;
    }
    12.5% {
        box-shadow: 0 -3em 0 0 #222, 2em -2em 0 .2em #222, 3em 0 0 0 #222, 2em 2em 0 -.5em #222, 0 3em 0 -.5em #222, -2em 2em 0 -.5em #222, -3em 0 0 -.5em #222, -2em -2em 0 -.5em #222;
    }
    25% {
        box-shadow: 0 -3em 0 -.5em #222, 2em -2em 0 0 #222, 3em 0 0 .2em #222, 2em 2em 0 0 #222, 0 3em 0 -.5em #222, -2em 2em 0 -.5em #222, -3em 0 0 -.5em #222, -2em -2em 0 -.5em #222;
    }
    37.5% {
        box-shadow: 0 -3em 0 -.5em #222, 2em -2em 0 -.5em #222, 3em 0 0 0 #222, 2em 2em 0 .2em #222, 0 3em 0 0 #222, -2em 2em 0 -.5em #222, -3em 0 0 -.5em #222, -2em -2em 0 -.5em #222;
    }
    50% {
        box-shadow: 0 -3em 0 -.5em #222, 2em -2em 0 -.5em #222, 3em 0 0 -.5em #222, 2em 2em 0 0 #222, 0 3em 0 .2em #222, -2em 2em 0 0 #222, -3em 0 0 -.5em #222, -2em -2em 0 -.5em #222;
    }
    62.5% {
        box-shadow: 0 -3em 0 -.5em #222, 2em -2em 0 -.5em #222, 3em 0 0 -.5em #222, 2em 2em 0 -.5em #222, 0 3em 0 0 #222, -2em 2em 0 .2em #222, -3em 0 0 0 #222, -2em -2em 0 -.5em #222;
    }
    75% {
        box-shadow: 0 -3em 0 -.5em #222, 2em -2em 0 -.5em #222, 3em 0 0 -.5em #222, 2em 2em 0 -.5em #222, 0 3em 0 -.5em #222, -2em 2em 0 0 #222, -3em 0 0 .2em #222, -2em -2em 0 0 #222;
    }
    87.5% {
        box-shadow: 0 -3em 0 0 #222, 2em -2em 0 -.5em #222, 3em 0 0 -.5em #222, 2em 2em 0 -.5em #222, 0 3em 0 -.5em #222, -2em 2em 0 0 #222, -3em 0 0 0 #222, -2em -2em 0 .2em #222;
    }
}


.Application_Menu {
     /*primary-color*/
    

}

/* Modal */

body.ModalOpened .ModalContainer
{
    top: 10%;
}

.ModalContainer .close-popup {
    position: absolute;
    top: 40px;
    right: 40px
}

.ModalBackground {
    z-index: 20;
}

.ModalContainer {
    z-index: 25;
}

/* Results */

@media (min-width: 1500px) {
    .results-count {
        margin-bottom: -55px;
    }
}

.results-count span {
    font-size: 16px !important;
}

/* Mobile scroll */
.overflowMobile
{
    overflow-x: scroll;
    overflow-y: scroll;
}


/* Please Include this CSS in your theme */

/*------------------------------------------------------------*/
/* Example1 > Feedback Ajax Loading ***************************/
/*------------------------------------------------------------*/

.Feedback_AjaxWait {
      
    background: rgba(255, 255, 255, .8);
    height: 10%;
    width: 5%;
    padding:10px 20px;
    height:auto;
    width:auto;
}


    
.ie :not(.ie11):not(.ie10).Feedback_AjaxWait{
    height: 100%;
}

.FeedbackAjax_Content {
    /*margin: 25% auto;*/
}

.FeedbackAjax_Content .item_text {
    font-size: 24px;
}

.FeedbackAjax_Content .sk-circle {
    height: 40px;
    position: relative;
    text-align: center;
    width: 40px;
}

.FeedbackAjax_Content .sk-circle .sk-child {
    height: 40px;
    left: 0;
    position: absolute;
    top: 0;
    width: 40px;
}

.FeedbackAjax_Content .sk-circle .sk-child:before {
    -webkit-animation: sk-circleBounceDelay 1.2s infinite ease-in-out both;
            animation: sk-circleBounceDelay 1.2s infinite ease-in-out both;
    background: #003755; /* Loading background - choose your color */
    border-radius: 100%;
    content: "";
    display: block;
    height: 15%;
    margin: 0 auto;
    width: 15%;
}

.FeedbackAjax_Content .sk-circle .sk-circle2 {
    -webkit-transform: rotate(30deg);
        -ms-transform: rotate(30deg);
            transform: rotate(30deg);
}

.FeedbackAjax_Content .sk-circle .sk-circle3 {
    -webkit-transform: rotate(60deg);
        -ms-transform: rotate(60deg);
            transform: rotate(60deg);
}

.FeedbackAjax_Content .sk-circle .sk-circle4 {
    -webkit-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
            transform: rotate(90deg);
}

.FeedbackAjax_Content .sk-circle .sk-circle5 {
    -webkit-transform: rotate(120deg);
        -ms-transform: rotate(120deg);
            transform: rotate(120deg);
}

.FeedbackAjax_Content .sk-circle .sk-circle6 {
    -webkit-transform: rotate(150deg);
        -ms-transform: rotate(150deg);
            transform: rotate(150deg);
}

.FeedbackAjax_Content .sk-circle .sk-circle7 {
    -webkit-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
            transform: rotate(180deg);
}

.FeedbackAjax_Content .sk-circle .sk-circle8 {
    -webkit-transform: rotate(210deg);
        -ms-transform: rotate(210deg);
            transform: rotate(210deg);
}

.FeedbackAjax_Content .sk-circle .sk-circle9 {
    -webkit-transform: rotate(240deg);
        -ms-transform: rotate(240deg);
            transform: rotate(240deg);
}

.FeedbackAjax_Content .sk-circle .sk-circle10 {
    -webkit-transform: rotate(270deg);
        -ms-transform: rotate(270deg);
            transform: rotate(270deg);
}

.FeedbackAjax_Content .sk-circle .sk-circle11 {
    -webkit-transform: rotate(300deg);
        -ms-transform: rotate(300deg);
            transform: rotate(300deg);
}

.FeedbackAjax_Content .sk-circle .sk-circle12 {
    -webkit-transform: rotate(330deg);
        -ms-transform: rotate(330deg);
            transform: rotate(330deg);
}

.FeedbackAjax_Content .sk-circle .sk-circle2:before {
    -webkit-animation-delay: -1.1s;
            animation-delay: -1.1s;
}

.FeedbackAjax_Content .sk-circle .sk-circle3:before {
    -webkit-animation-delay: -1s;
            animation-delay: -1s;
}

.FeedbackAjax_Content .sk-circle .sk-circle4:before {
    -webkit-animation-delay: -.9s;
            animation-delay: -.9s;
}

.FeedbackAjax_Content .sk-circle .sk-circle5:before {
    -webkit-animation-delay: -.8s;
            animation-delay: -.8s;
}

.FeedbackAjax_Content .sk-circle .sk-circle6:before {
    -webkit-animation-delay: -.7s;
            animation-delay: -.7s;
}

.FeedbackAjax_Content .sk-circle .sk-circle7:before {
    -webkit-animation-delay: -.6s;
            animation-delay: -.6s;
}

.FeedbackAjax_Content .sk-circle .sk-circle8:before {
    -webkit-animation-delay: -.5s;
            animation-delay: -.5s;
}

.FeedbackAjax_Content .sk-circle .sk-circle9:before {
    -webkit-animation-delay: -.4s;
            animation-delay: -.4s;
}

.FeedbackAjax_Content .sk-circle .sk-circle10:before {
    -webkit-animation-delay: -.3s;
            animation-delay: -.3s;
}

.FeedbackAjax_Content .sk-circle .sk-circle11:before {
    -webkit-animation-delay: -.2s;
            animation-delay: -.2s;
}

.FeedbackAjax_Content .sk-circle .sk-circle12:before {
    -webkit-animation-delay: -.1s;
            animation-delay: -.1s;
}

@-webkit-keyframes sk-circleBounceDelay {
    0%,
    80%,
    100% {
        -webkit-transform: scale(0);
                transform: scale(0);
    } 40% {

        -webkit-transform: scale(1);
                transform: scale(1);
    }
}

@keyframes sk-circleBounceDelay {
    0%,
    80%,
    100% {
        -webkit-transform: scale(0);
                transform: scale(0);
    } 40% {

        -webkit-transform: scale(1);
                transform: scale(1);
    }
}