@import url("/LisbonTheme/Theme.LisbonTheme.css?342");

/*
    How to generate a theme for your company: 
    
        1 - Go to http://labs.outsystems.net/ThemeCustomizer/GenerateLisbon.aspx
        2 - Copy the generated CSS
        3 - Replace the CSS for Primary Color Customization below with the Generated CSS

*/

/*------------------------------------*\
             Import Font
\*------------------------------------*/

@font-face {
    font-family: 'Roboto';
    src: url('/RichWidgets/fonts/Roboto-Regular-webfont.eot');
    src: url('/RichWidgets/fonts/Roboto-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('/RichWidgets/fonts/Roboto-Regular-webfont.woff') format('woff'),
         url('/RichWidgets/fonts/Roboto-Regular-webfont.ttf') format('truetype'),
         url('/RichWidgets/fonts/Roboto-Regular-webfont.svg#robotoregular') format('svg');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Roboto';
    src: url('/RichWidgets/fonts/Roboto-Bold-webfont.eot');
    src: url('/RichWidgets/fonts/Roboto-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('/RichWidgets/fonts/Roboto-Bold-webfont.woff') format('woff'),
         url('/RichWidgets/fonts/Roboto-Bold-webfont.ttf') format('truetype'),
         url('/RichWidgets/fonts/Roboto-Bold-webfont.svg#robotobold') format('svg');
    font-weight: 700;
    font-style: normal;
}



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

 /* html, body, a, select, form, fieldset, table, tr, td, img, input, button, select, textarea, optgroup, option {
    font-family: 'Open-Sans', sans-serif;
} */

html,
body,
a,
select,
fieldset,
input,
button,
select,
textarea,
optgroup,
option {
    font-family: 'Roboto', sans-serif;
}




/* Font OpenSans classes */

.Roboto_Regular {
    font-family:  'Roboto', sans-serif;
    font-weight: 400;
}

.Roboto_Bold {
    font-family:  'Roboto', sans-serif;
    font-weight: 700;
}

/***************************************/
/***** PRIMARY COLOR CUSTOMIZATION *****/
/***************************************/
a,
a:link,
a:visited,
.Footer a,
.Footer a:link,
.Footer a:visited {
    color: #741e91; /*primary-color*/
}

.desktop a:hover,
.desktop a:link:hover,
.desktop a:visited:hover {
    color: #741e91; /*primary-color*/
}

.Header_background {
    background-color: #741e91; /*primary-color*/
    border-bottom-color: #741e91; /*primary-color*/
}

.Header_title {    
    border-right-color: #741e91; /*primary-color*/
}

.Menu_DropDownPanel {
    background-color: #741e91; /*primary-color*/
}

.Menu_TopMenu a span.fa {
    border-color: #741e91; /*primary-color*/
}

.Menu_TopMenu:hover span.fa {
    color: #FFF;
    border-color: #FFF;
}

.Menu_TopMenu:hover .Menu_DropDownArrow {
    border-top-color: #FFF;
}

.Menu_TopMenuActive {
    border-top-color: #FFF;
}

.Header_Menu a:hover, 
.Header_Menu a:link:hover, 
.Header_Menu a:visited:hover,
.desktop a:hover, 
.desktop a:link:hover {
    color: #FFF;}



.Menu_TopMenuActive:hover a:link, .Menu_TopMenuActive a:link,
.Menu_TopMenuActive:hover a:visited, .Menu_TopMenuActive a:visited,
.Menu_TopMenuActive:hover a, .Menu_TopMenuActive a,
.Menu_TopMenu:hover a, .Menu_TopMenu a {
    color: #FFF;}


.Menu_TopMenuActive .Menu_DropDownArrow,
.Menu_TopMenuActive:hover .Menu_DropDownArrow {
    border-top-color: #FFF;
}


.Menu_DropDownArrow {
    border-top-color: #FFF;
}

.Menu_TopMenuActive a span.fa {
    color: #FFF;
    border-color: #FFF;
}

.Menu_DropDownPanel a span.fa {
    color: #FFF;
}

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

a.ListNavigation_PageNumber:link:hover,
span.ListNavigation_CurrentPageNumber:hover,
span.ListNavigation_Ellipsis:hover {
    color: #741e91; /*primary-color*/
}

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

a.ListNavigation_Previous:link:hover,
a.ListNavigation_Next:link:hover,
span.ListNavigation_DisabledNext:hover, 
span.ListNavigation_DisabledPrevious:hover {
    color: #741e91; /*primary-color*/
}

a.ActionAdd,
a.ActionAdd:link,
a.ActionAdd:visited,
a.ActionEdit,
a.ActionEdit:link,
a.ActionEdit:visited,
a.ActionDelete,
a.ActionDelete:link,
a.ActionDelete:visited,
a.ActionChange,
a.ActionChange:link,
a.ActionChange:visited {
    background-color: #741e91; /*primary-color*/
    border-color: #741e91; /*primary-color*/
}

.desktop a.ActionAdd:hover,
.desktop a.ActionAdd:hover:visited,
.desktop a.ActionAdd:link:hover,
.desktop a.ActionEdit:hover,
.desktop a.ActionEdit:link:hover,
.desktop a.ActionEdit:link:visited,
.desktop a.ActionDelete:hover,
.desktop a.ActionDelete:hover:visited,
.desktop a.ActionDelete:link:hover,
.desktop a.ActionChange:hover,
.desktop a.ActionChange:hover:visited,
.desktop a.ActionChange:link:hover {
    background-color: #741e91; /*primary-color*/
    border-color: #741e91; /*primary-color*/
    box-shadow: none;
    color: #fff;
    -webkit-filter: brightness(0.9);
    filter: brightness(0.9);
    
}

.desktop a.ActionAdd:hover:active,
.desktop a.ActionEdit:hover:active,
.desktop a.ActionDelete:hover:active,
.desktop a.ActionChange:hover:active {
    background-color: #741e91; /*primary-color*/
    border-color: #741e91; /*primary-color*/
    color: #FFF;
    -webkit-filter: brightness(0.8);
    filter: brightness(0.8);
    
}

.Login_Footer {
    background: #741e91; /*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___icon > .fa {
    color: #741e91; /*primary-color*/
}
.AccordionVertical_item.open > .AccordionVertical__header > .AccordionVertical___icon > .fa {
    color: #741e91; /*primary-color*/
}

.expanded .SectionExpandable__icon.Heading2 > .fa {
    color: #741e91; /*primary-color*/
}

.Panel .SectionExpandable__icon.Heading2 > .fa {
    color: #741e91; /*primary-color*/
}

.ButtonGroup_button.Button:hover {
    background: #741e91; /*primary-color*/
}

.select2-container .select2-choice span {
    color: #741e91; /*primary-color*/
}

.select2-dropdown-open .select2-choice {
    background-color: #fff;
}

.select2-results .select2-highlighted {
    background-color: #741e91; /*primary-color*/
}

.IconBadge_number {
    background-color: #741e91; /*primary-color*/
}

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

.NavigationBar a.Active {
    color: #741e91; /*primary-color*/
}

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

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

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

.NavigationBar.Vertical a.Active:not(.IE8):before {
    border-left-color: #741e91; /*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: #741e91; /*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: #741e91; /*primary-color*/
}

.Tabs__tab.active {
    border-top-color: #741e91; /*primary-color*/
    color: #741e91; /*primary-color*/
}

.WizardStep a,
.WizardStep a:link,
.desktop .WizardStep a:hover,
.desktop .WizardStep a:link:hover
{
    color: #741e91; /*primary-color*/
}


.WizardStep.ActiveStep {
    background: #741e91; /*primary-color*/
    -webkit-filter: brightness(0.9);
    filter: brightness(0.9);
    
}

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

.WizardStep.Past {
    background: #741e91; /*primary-color*/
}

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

.WizardStep.Past a,
.WizardStep.Past a:hover,
.WizardStep.Past a:link,
.WizardStep.Past a:link:hover,
.WizardStep.Past a[disabled="disabled"],
.WizardStep.Past a[disabled="disabled"]:hover
.WizardStep.ActiveStep a,
.WizardStep.ActiveStep a:hover,
.WizardStep.ActiveStep a:link,
.WizardStep.ActiveStep a:link:hover,
.WizardStep.ActiveStep a[disabled="disabled"],
.WizardStep.ActiveStep a[disabled="disabled"]:hover {
    color: #FFF;
}

.WizardStep.Past:after {
    border-right-color: #741e91; /*primary-color*/
    border-top-color: #741e91; /*primary-color*/
    -webkit-filter: brightness(0.7);
    filter: brightness(0.7);
    
}

.Button,
a.Button {
    color: #741e91; /*primary-color*/
}

.Button.ButtonDefault,
.Button.Is_Default {
    background-color: #741e91; /*primary-color*/
    border-color: #741e91; /*primary-color*/
}

.desktop .Button.ButtonDefault:hover, 
.desktop .Button.Is_Default:hover {
    background-color: #741e91; /*primary-color*/
    border-color: #741e91; /*primary-color*/
    -webkit-filter: brightness(0.9);
    filter: brightness(0.9);
    
}


.Button:hover:active,
a.Button:hover:active {
    color: #741e91; /*primary-color*/
}

.Button.ButtonDefault:hover,
.Button.Is_Default:hover {
    -webkit-filter: brightness(0.9);
    filter: brightness(0.9);
    
}

.Button.ButtonDefault:hover:active,
.Button.Is_Default:hover:active {
    background-color: #741e91; /*primary-color*/
    border-color: #741e91; /*primary-color*/
    color: #fff;
    -webkit-filter: brightness(0.8);
    filter: brightness(0.8);
    
}

.desktop a.ActionAdd:hover:active,
.desktop a.ActionEdit:hover:active,
.desktop a.ActionDelete:hover:active,
.desktop a.ActionChange:hover:active {
    background-color: #741e91; /*primary-color*/
    border-color: #741e91; /*primary-color*/
    color: #fff;
}

a,
a:link,
a:visited,
.EditableTable tr.RowControlGroup a  {
    color: #741e91; /*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: #741e91; /*primary-color*/
}

.Menu_DropDownPanel a.Menu_SubMenuItem:hover {
    background-color: #741e91; /*primary-color*/
}

.Menu_DropDownButton.open .Menu_TopMenu .Menu_DropDownArrow {
    border-top-color: #fff;
    opacity: .5;
}

.tablet a.Header_ButtonMenu, 
.phone a.Header_ButtonMenu {
    color: #FFF;
}

.Page.active .Header_ButtonMenu {
    color: #FFF;
}

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

.SectionIndex a, 
.SectionIndex a:link, 
.SectionIndex a:visited,
.SectionIndex a.active, 
.SectionIndex a:hover,
.desktop .SectionIndex a:hover{
    color: #741e91; /*primary-color*/
    border-bottom-color: #741e91; /*primary-color*/
    text-decoration: none;
}


.AccordionVertical___title {
    color: #741e91; /*primary-color*/
}

.SectionExpandable.expanded .SectionExpandable_header .Heading2 {
    color: #741e91; /*primary-color*/
}


.Button.Link {
    color: #741e91; /*primary-color*/
}

.desktop .Button.Link:hover {
    border-color: #741e91; /*primary-color*/
    color: #741e91; /*primary-color*/
}

.desktop .Button:hover, 
.desktop a.Button:hover {
    color: #741e91; /*primary-color*/
}

.ButtonGroup_button.active, 
.desktop .ButtonGroup_button.active:hover {
    background-color: #741e91; /*primary-color*/
}

.ButtonGroup_button.Button:hover,
.ButtonGroup_button.Button:hover .fa{
    color: #FFF;
}


.Calendar-day-selected, 
.Calendar-day-selected:hover {
    background: #741e91; /*primary-color*/
}

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

.DropdownMenu .PH > a,
.DropdownMenu .PH > a:hover {
    color: #741e91; /*primary-color*/
}

.SliderRange .ui-slider-range {
    background-color: #741e91; /*primary-color*/
}

.EditableTable tr.RowControlGroup a:hover {
    color:  #741e91; /*primary-color*/
}

.desktop .Button.ButtonDefault:hover,
.Button.Button.Is_Default:hover {
    background-color: #741e91; /*primary-color*/
    border-color: #741e91; /*primary-color*/
}
.owl-theme .owl-controls .owl-page.active span, 
.owl-theme .owl-controls.clickable .owl-page:hover span {
    background-color: #741e91; /*primary-color*/
}

td.RowWithAddAction a:hover {
    color: #741e91; /*primary-color*/
    -webkit-filter: brightness(0.8);
    filter: brightness(0.8);
    
}

.InfoTooltip .tooltipstered,
.ListItem  .tooltipstered{
    color: #741e91; /*primary-color*/
}

div.Menu_DropDownPanel a:hover, 
div.Menu_DropDownPanel a:link:hover,
div.Menu_DropDownPanel a:visited:hover,
div.Menu_DropDownPanel a.Menu_SubMenuItem:hover,
div.Menu_DropDownPanel a.Menu_SubMenuItem.Menu_SubMenuItemActive {
    color: #FFF;
    background-color: rgba(0, 0, 0, .1);
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, .5);
    
}

/* Menu tablet and phone */
.tablet .Application_Menu,
.phone .Application_Menu {
    background: #741e91; /*primary-color*/
}


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

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

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

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


div.os-internal-Popup .os-internal-ui-dialog .os-internal-ui-dialog-title,
div.os-internal-Popup.os-internal-ui-dialog .os-internal-ui-dialog-title{
    color: #FFF;
    top:0;
}

div.os-internal-Popup .os-internal-ui-dialog .os-internal-ui-dialog-titlebar-close,
div.os-internal-Popup.os-internal-ui-dialog .os-internal-ui-dialog-titlebar-close {
    opacity: 1;
    top: 15px;
    background-image: url(/WebPatterns/img/PopupCloseWhite.png?337);
}

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{
    padding-top:0;
}


div.os-internal-Popup .os-internal-ui-dialog .os-internal-ui-dialog-title,
div.os-internal-Popup.os-internal-ui-dialog .os-internal-ui-dialog-title{
    color: #FFF;
    top:10px;
}

div.os-internal-Popup .os-internal-ui-dialog .os-internal-ui-dialog-titlebar-close,
div.os-internal-Popup.os-internal-ui-dialog .os-internal-ui-dialog-titlebar-close {
    opacity: 1;
    top: 15px;
    background-image: url(/WebPatterns/img/PopupCloseWhite.png?337);
}

.Feedback_AjaxWait {
    color: #222;
}

.Feedback_AjaxWait .Loader {
    -webkit-animation: loader 1.3s infinite linear;
            animation: loader 1.3s infinite linear;
    border-radius: 50%;
    font-size: 4px;
    height: 1em;
    margin-bottom: 20px;
    position: relative;
    text-indent: -9999em;
    -webkit-transform: translateZ(0);
        -ms-transform: translateZ(0);
            transform: translateZ(0);
    width: 1em;
    background: transparent;
}

@-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;
    }
}



/*---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------ FIM DOS CSS BASE OS --------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/



/*********************************************************************
******************************  Fonts ********************************/

@import url('https://fonts.googleapis.com/css?family=Yanone+Kaffeesatz:200');

body {font-family:'Yanone Kaffeesatz', sans-serif; font-size:18px; font-style:normal; font-variant:normal; font-weight:400; line-height:30px; color:#666; text-align:left;}

h1 {font-family:'Yanone Kaffeesatz', sans-serif; font-size:30px; font-style:normal; font-variant:normal; font-weight:600; line-height:45px; color:#7030a0;}
h2 {font-family:'Yanone Kaffeesatz', sans-serif; font-size:30px; font-style:normal; font-variant:normal; font-weight:400; line-height:45px; color:#7030a0;}
h3 {font-family:'Yanone Kaffeesatz', sans-serif; font-size:26px; font-style:normal; font-variant:normal; font-weight:600; line-height:40px; color:#7030a0;}
h4 {font-family:'Yanone Kaffeesatz', sans-serif; font-size:20px; font-style:normal; font-variant:normal; font-weight:100; line-height:35px; color:#464646;
    margin:0;}
h5 {font-family:'Yanone Kaffeesatz', sans-serif; font-size:18px; font-style:normal; font-variant:normal; font-weight:100;line-height:33px; color:#464646; 
    margin:0;}

.Title {font-family:'Yanone Kaffeesatz', sans-serif; color:#7030a0; font-size:20px; line-height:25px; font-weight:400;}

.MainContent {background:#fff;}

/* Secções */
.SectionWebsite.UsePadding {padding:65px 0;}


/* Links gerais */
.desktop a:hover, 
.desktop a:link:hover {color:#741e91; text-decoration:underline;}

/* Links no menu */
.Header_Menu a:hover, 
.Header_Menu a:link:hover, 
.Header_Menu a:visited:hover {color:#fff; text-decoration:none; /*font-weight:600;*/}

/* Classe Image_thumb */
img.Image_thumb {background-color:transparent !important; border:none; border-radius:0px; padding:0px !important;}




/*********************************************************************
****************************  MENU ***********************************/

.Menu_TopMenuActive {border-bottom:3px solid #fff !important; height:50px; line-height:65px; border-top:0; font-weight:600; box-shadow:none !important;
                     background-color:rgba(0, 0, 0, 0) !important;}

.Menu_DropDownButton {display:inline-block; font-size:14.5px;}

.Menu_DropDownPanel {border:none; border-radius:0; box-shadow:0 2px 10px 0 rgba(0,0,0,.2);}
.Menu_DropDownPanel a {color:#fff !important;}

.Menu_TopMenu a:link, 
.Menu_TopMenu a:visited, 
.Menu_TopMenu a {padding:0 15px;}

.Menu_TopMenu .Menu_DropDownArrow {position: relative; right:8px; top:-1px;}

/* Botão Menu - Pedir DEMO - não está a ser usado agora */
.btHeaderDemo {color:#fff; background:#ddab00; border:none; font-weight:600; box-shadow:1px 1px #997500; border-radius:4px; padding-left:15px; padding-right:15px;
                cursor:pointer; position:relative; right:-215%;} /* ou em vez de position relative --> position:absolute; height:48px; right:-164px;} */
.btHeaderDemo:hover {background:#f4bd00;}





/*********************************************************************
************************* DIVERSOS GERAIS ***************************/

/* Margens */
.tablet .TabletMargTop50 {margin-top:50px;} /* não usado */

.desktop .DesktopMargTop100 {margin-top:100px;}
.tablet .TabletMargTop20 {margin-top:20px;}
.phone .PhoneMargTop0 {margin-top:0px;}

/* Alinhar títulos à esquerda - Tablet & Phone */
.tablet .TextAlighL,
.phone .TextAlighL {text-align:left;}

/* diminuir tamanho da letra - Tablet & Phone */
.tablet h1,
.phone h1 {font-size:26px; line-height:37px;}

.tablet h2,
.phone h2 {font-size:26px; line-height:35px;}


/* FORGE - ScrollUp */
.scroll {position:absolute; right:20px; bottom:20px; background:#7030a02b; padding:5px; color:#fff; text-align:center; margin:0 0 0 0; cursor:pointer; 
         transition:0.5s; -moz-transition:0.5s; -webkit-transition:0.5s; -o-transition:0.5s; border-radius:3px;}
.scroll:hover {background:#7030a0; transition:0.5s; -moz-transition:0.5s; -webkit-transition:0.5s; -o-transition:0.5s;}





/*********************************************************************
************************* CAMPOS - INPUTS ***************************/


select, input[type="text"], 
input[type="password"], 
input[type="datetime"], 
input[type="datetime-local"], 
input[type="date"], 
input[type="month"], 
input[type="time"], 
input[type="week"], 
input[type="number"], 
input[type="email"], 
input[type="url"], 
input[type="search"], 
input[type="tel"], 
input[type="color"] {background-color:#fff; border-radius:0 !important; box-shadow:none; font-size:20px; line-height:32px; vertical-align:initial; height:40px; 
                     margin-top:-3px; border-top:0; border-right:0; border-left:0;}

/* input quando selecionado (focus) */
textarea:focus, 
select:focus, 
input:focus {box-shadow:none !important; border-bottom:solid 1px #7030a0;}

/* Escrita do user a roxo */
textarea, 
select, 
input {color: #7030A0;}

/* Bolinha radio button verde, em vez de preto */
input[type="radio"]:after {background:#169026; border:2px solid #169026;}

/* Check da checkbox verde, em vez de preto */
input[type="checkbox"]:after {border:3px solid #169026; border-right:0; border-top:0;}




/*********************************************************************
****************************  FOOTER ********************************/

/* Footer Section */
.FooterSection .SectionWebsite.UsePadding {padding-top:50px; padding-bottom:0;}

/* layout */
.FooterLayout {background:#ededed;}
.FooterLayout .Columns3 > .Column {width:33.333%; padding:0px 15px;}

/* Font */
.FooterFont {color:#333; font-size:15px; line-height:30px;}

.FooterFont a, 
.FooterFont a:link, 
.FooterFont a:visited {color:#333; font-size:15px; line-height:30px;}

.FooterFont a:hover,
.FooterFont a:link:hover {text-decoration:underline !important; color:#464646 !important;}

/* Separador */
.FooterSeparator {border-bottom:1px solid #cdcdcd;}

/* Footer: Dimensão entre 2 colunas - este bloco já foi apagado, mas a classe pode ser usada noutra coisa */
.Dim2Col30 .Columns2 > .Column.ColFirst {padding-left:0; padding-right:30px;}
.Dim2Col30 .Columns2 > .Column.ColLast {padding-left:30px; padding-right:0;}





/*********************************************************************
****************************  HEADER ********************************/
 
.Header {height:65px; line-height:65px; position:fixed; top:0; width:100%; z-index:20; color:#fff; border-bottom:none !important; background:#7030a0;}

/* Logo GETbizz - ajustar posição */
.Header .Application_Title img {max-height:45px; vertical-align:middle; margin-left:-10px !important; margin-top:-5px;}

/* Header - 2ª área */
.Title_Section {background-color:#7030a0 !important; min-height:400px;}
.Title_Section_Color {background-color:#019cb8 !important; min-height:400px;}

/* Botão Branco */
.btWhite {color:#7030a0; background:#fff; border:solid 1px #7030a0; font-weight:600; border-radius:4px; padding-left:15px; padding-right:15px; 
          cursor:pointer; height:40px; font-size:18px;}
.btWhite:hover {background:#eee4f1;}
.phone .btWhite {width:100%;}

/* Botão Roxo */
.btPurple {color:#fff; background:#7030a0; border:solid 1px #7030a0; font-weight:600; border-radius:4px; padding-left:15px; padding-right:15px; 
          cursor:pointer; height:40px; font-size:18px;}
.btPurple:hover {background:#7030a0db;}
.phone .btPurple {width:100%;}

/* Animação para o título */
.TitleAppear {animation-duration:2s; animation-name:TitleAppear;}
@keyframes TitleAppear { 
    from {margin-left:100%; width:300%}
    to {margin-left:0%; width:100%;}}

/* alinhar conteudo do menu à direita */
.Header_Menu, 
.Header_Menu .ListRecords {display:inline-block; float:right !important;}

/* header com scroll */
.Page.UseHeaderFade .Header .Header_background {background-color:#7030a0;}







/**********************************************************************************************
******************************************** HOMEPAGE *****************************************/

/* HEADER */
/* Fundo p/ header da homepage */
.HPheader {background-image:linear-gradient(#7030a0, #805da7, #9f8dbb, #a4a1c1) !important;/*linear-gradient(#4e0b63, #845c90, #9a81a2) !important;*/}

/* fundo para secções - cinza */
.GreyBackground .Card {background-color:transparent; border:none; box-shadow:none;}

/*SECÇÃO 1*/
/* Button Database/Campaigns/Reports */
.btDatabase {color:#fff; background:#fa9e72; border:none; font-weight:600; border-radius:4px; padding-left:15px; padding-right:15px; 
            cursor:pointer; height:40px; font-size:18px;}
.btDatabase:hover {background:#f98753;}

.btCampaigns {color:#fff; background:#c4d625; border:none; font-weight:600; border-radius:4px; padding-left:15px; padding-right:15px; 
            cursor:pointer; height:40px; font-size:18px;}
.btCampaigns:hover {background:#b4c421;}

.btReports {color:#fff; background:#01aac8; border:none; font-weight:600; border-radius:4px; padding-left:15px; padding-right:15px; 
            cursor:pointer; height:40px; font-size:18px;}
.btReports:hover {background:#0197b2;}

/* estrutura de 2 colunas para botões+triângulos */
.SRC_Dim2col90 .SmallRightColumns > .Column.ColFirst {width:90%; padding-right:5px; padding-left:0px;}
.SRC_Dim2col90 .SmallRightColumns > .Column.ColLast {width:10%; padding-left:5px; padding-right:0px;}


/*SECÇÃO 2*/
/* estrutura de 2 colunas: espaço entre colunas (dimention between columns) */
.DimBetCol20 .Columns2 > .Column {width:50%; padding:0 20px;} /* não usado */
.desktop .Marg5Col .Columns5 .Column.ColFirst {padding-left:0; padding-right:0; margin-right:20px; margin-left:0;}
.desktop .Marg5Col .Columns5 .Column.LeftMiddle {padding-left:0; padding-right:0; margin-left:10px; margin-right:15px;}
.desktop .Marg5Col .Columns5 >.Column {width:18.06%; padding-left:0; padding-right:0; margin-left:15px; margin-right:15px;}
.desktop .Marg5Col .Columns5 .Column.RightMiddle {padding-left:0; padding-right:0; margin-left:15px; margin-right:10px;}
.desktop .Marg5Col .Columns5 .Column.ColLast {padding-left:0; padding-right:0; margin-left:20px; margin-right:0;}




/*SECÇÃO 3*/
/* testemunho Outsystems */
.CardLeftImage .Right {display:table-cell; padding:10px; vertical-align:top; width:100%; padding-left:20px;}

/*SECÇÃO 5 */

/* Whitepaper - margin bottom */
.MargBot0 .Columns.MarginBottom {margin-bottom: 0 !important;}

/* Box: Cartão Blog */
.SectionWebsite.White .Box.Transparent {color:#454545; border:solid 1px #7820922b; background:#78209217; padding: 0;}




/************************************************************************************************
******************************************** CAMPAIGNS *****************************************/
               
/* bullets */
.bulletsCheck {list-style: none;}
.bulletsCheck:before {content: '✔'; color:#7030a0; font-size:30px; margin-top:10px; margin-left:7px; margin-right:10px;}
.phone .bulletsCheck:before {margin-left:-15px;}

/* estrutura de 2 colunas para checklist */
.SLC_Dim2col5 .SmallLeftColumns > .Column.ColFirst {width:5%; padding-right:5px; padding-left:0px;}
.SLC_Dim2col5 .SmallLeftColumns > .Column.ColLast {width:95%; padding-left:5px; padding-right:0px;}





/**********************************************************************************************
******************************************  CONTACT US ***************************************/

/* caixa dos Contactos */
.BoxContact {padding:10px 10px 10px 10px; border-radius:0px;}

/* Asterisco para utilizador perceber que o campo é obrigatório */
.FaMandatory .fa {color:#cc3300; font-size:7px; position:relative; top:-7px;}

/* dimensão da estrutura de 2 colunas */
/*.StructureContacts .Columns2 > .Column {width:50%; padding:0 20px;}*/
.desktop .StructureContacts .Columns2 > .Column.ColFirst,
.tablet .StructureContacts .Columns2 > .Column.ColFirst {padding-right:20px; padding-left:0px;}
.desktop .StructureContacts .Columns2 > .Column.ColLast,
.tablet .StructureContacts .Columns2 > .Column.ColLast {padding-right:0px; padding-left:20px;}

/* CSS dos campos de input */
select, 
input[type="text"], 
input[type="password"], 
input[type="datetime"], 
input[type="datetime-local"], 
input[type="date"], 
input[type="month"], 
input[type="time"], 
input[type="week"], 
input[type="number"], 
input[type="email"], 
input[type="url"], 
input[type="search"], 
input[type="tel"], 
input[type="color"] {background-color:#fff; border-radius:0px; box-shadow:inset 0 1px 2px rgba(0, 0, 0, .1); font-size:16px; line-height:32px; vertical-align:initial; height:40px;}
textarea {background-color:#fff; border-radius:0px; box-shadow:inset 0 1px 2px rgba(0, 0, 0, .1); font-size:16px; line-height:32px; vertical-align:initial;}

/* margem superior do mapa */
.desktop .ColMargin6 {margin-top:40px;}
.tablet.portrait .ColMargin6,
.tablet.landscape .ColMargin6 {margin-top:50px;}
.phone.portrait .ColMargin6,
.phone.landscape .ColMargin6 {margin-top:70px;}




/**********************************************************************************************
******************************************** COMPANY *****************************************/

/*---------------- VERTICAL TIMELINE (FORGE) ----------------*/

.VerticalTimeline-container {margin:0 auto; max-width:1240px; width:90%;}
.VerticalTimeline-container::after {clear:both; content:""; display:table;}

/* estrutura */
.VerticalTimeline{margin-bottom:2em; margin-top:2em; position:relative}
.VerticalTimeline::before {background:#bbb; content:""; height:100%; left:18px; position:absolute; top:0; width:6px;}

/* bloco */
.VerticalTimeline-block {margin:2em 0; position:relative;}
.VerticalTimeline-block:after {clear:both; content:""; display:table;}
.VerticalTimeline-block:first-child {margin-top:0;}
.VerticalTimeline-block:last-child {margin-bottom:0;}

/* icone 
.VerticalTimeline-icon {margin-top:25%;}*/

/* circulo que marca o ano */
.TimelineCircle {background:#ccc; border-radius:50%; height:40px; width:40px; left:50%; margin-left:-21px; position:absolute; top:0;  
                 box-shadow:0 0 0 0px #ccc, inset 0 3px 0 rgba(0, 0, 0, .08); -webkit-transform:translateZ(0); -webkit-backface-visibility:hidden;}
 
 /* fechar o timeline (1998) */
 .TimelineEnd {background:#ccc; border-radius:0; height:6px; width:35px; left:48.55%; position:absolute; top:0; 
               box-shadow:0 0 0 0px #ccc, inset 0 3px 0 rgba(0, 0, 0, .08); -webkit-transform:translateZ(0); -webkit-backface-visibility:hidden;}
  
/* Caixa com o conteúdo */
.VerticalTimeline-content {background:transparent; border-radius:.25em; border: solid 1px #ccc; margin-left:60px; padding:1em; position:relative; top:-33px;}
.VerticalTimeline-content:after {clear:both; content:""; display:table;}
.VerticalTimeline-content h2 {color:#303e49;}

.VerticalTimeline-content p,
.VerticalTimeline-content .VerticalTimeline-read-more,
.VerticalTimeline-content .VerticalTimeline-date {font-size:13px; font-size:.8125rem;}

.VerticalTimeline-content .VerticalTimeline-read-more,
.VerticalTimeline-content .VerticalTimeline-date {display:inline-block;}

.VerticalTimeline-content p {line-height:1.6; margin:1em 0;}
.VerticalTimeline-content .VerticalTimeline-read-more {background:#acb7c0; border-radius:.25em; color:white; float:right; padding:.8em 1em;}

.no-touch .VerticalTimeline-content .VerticalTimeline-read-more:hover {background-color:#bac4cb;}
.VerticalTimeline-content .VerticalTimeline-date {float:left; opacity:.7; padding:.8em 0;}

/* seta da caixa */
.VerticalTimeline-content::before {border:30px solid transparent; border-right:30px solid white; content:""; height:0; position:absolute; right:100%; top:16px; width:0;}

/* CSS para webkit e moz */
@-webkit-keyframes VerticalTimeline-bounce-1 {
    0% {opacity:0; -webkit-transform:scale(.5);}
    60% {opacity:1; -webkit-transform:scale(1.2);}
    100% {-webkit-transform:scale(1);}}
@-moz-keyframes VerticalTimeline-bounce-1 {
    0% {opacity:0; -moz-transform:scale(.5);}
    60% {opacity:1; -moz-transform:scale(1.2);}
    100% {-moz-transform:scale(1);}}
@keyframes VerticalTimeline-bounce-1 {
    0% {opacity:0; -webkit-transform:scale(.5); -moz-transform:scale(.5); -ms-transform:scale(.5); -o-transform:scale(.5); transform:scale(.5);}
    60% {opacity:1; -webkit-transform:scale(1.2); -moz-transform:scale(1.2); -ms-transform:scale(1.2); -o-transform:scale(1.2); transform:scale(1.2);}
    100% {-webkit-transform:scale(1); -moz-transform:scale(1); -ms-transform:scale(1); -o-transform:scale(1); transform:scale(1);}}
@-webkit-keyframes VerticalTimeline-bounce-2 {
    0% {opacity:0; -webkit-transform:translateX(-100px);}
    60% {opacity:1; -webkit-transform:translateX(20px);}
    100% {-webkit-transform:translateX(0);}}
@-moz-keyframes VerticalTimeline-bounce-2 {
    0% {opacity:0; -moz-transform:translateX(-100px);}
    60% {opacity:1; -moz-transform:translateX(20px);}
    100% {-moz-transform:translateX(0);}}
@keyframes VerticalTimeline-bounce-2 {
    0% {opacity:0; -webkit-transform:translateX(-100px); -moz-transform:translateX(-100px); -ms-transform:translateX(-100px); -o-transform:translateX(-100px); transform:translateX(-100px);}
    60% {opacity:1; -webkit-transform:translateX(20px); -moz-transform:translateX(20px); -ms-transform:translateX(20px); -o-transform:translateX(20px); transform:translateX(20px);}
    100% {-webkit-transform:translateX(0); -moz-transform:translateX(0); -ms-transform:translateX(0); -o-transform:translateX(0); transform:translateX(0);}}
@-webkit-keyframes VerticalTimeline-bounce-2-inverse {
    0% {opacity:0; -webkit-transform:translateX(100px);}
    60% {opacity:1; -webkit-transform:translateX(-20px);}
    100% {-webkit-transform:translateX(0);}}   
@-moz-keyframes VerticalTimeline-bounce-2-inverse {
    0% {opacity:0; -moz-transform:translateX(100px);}
    60% {opacity:1; -moz-transform:translateX(-20px);}
    100% {-moz-transform:translateX(0);}}
@keyframes VerticalTimeline-bounce-2-inverse {
    0% {opacity:0; -webkit-transform:translateX(100px); -moz-transform:translateX(100px); -ms-transform:translateX(100px); -o-transform:translateX(100px); transform:translateX(100px);}
    60% {opacity:1; -webkit-transform:translateX(-20px); -moz-transform:translateX(-20px); -ms-transform:translateX(-20px); -o-transform:translateX(-20px); transform:translateX(-20px);}
    100% {-webkit-transform:translateX(0); -moz-transform:translateX(0); -ms-transform:translateX(0); -o-transform:translateX(0); transform:translateX(0);}}

@media only screen and (min-width: 1170px)
    .VerticalTimeline-block {margin:0em 0;}

@media only screen and (min-width:1170px) {
    .VerticalTimeline {margin-bottom:0em; margin-top:3em;}
    .VerticalTimeline::before {left:50%; margin-left:-4px; /*-2px;*/}
    .VerticalTimeline-content {margin-left:0; padding:17px; width:45%;}
        /* seta da caixa do conteudo - lado esuerdo */
    .VerticalTimeline-content::before {border-color:white; border-left-color:white; left:96.3%; top:33px; position:absolute; right:0; width:5px; height:5px; 
                                        transform:rotate(-45deg) !important; -webkit-transform:rotate(-45deg); -moz-transform:rotate(-45deg); -o-transform:rotate(-45deg);
                                        -ms-transform:rotate(-45deg); border-right:2px solid #ccc; border-bottom: 2px solid #ccc;}
    .VerticalTimeline-content .VerticalTimeline-read-more {float:left;}
    .VerticalTimeline-content .VerticalTimeline-date {font-size:16px; font-size:1rem; left:122%; position:absolute; top:6px; width:100%;}
    .VerticalTimeline-block:nth-child(even) .VerticalTimeline-content {float:right;}
       /* seta da caixa do conteudo - lado direito */
    .VerticalTimeline-block:nth-child(even) .VerticalTimeline-content::before {border-color:white; left:-2.7%; top:33px; position:absolute; right:0; width:5px; height:5px;
                                                                                transform:rotate(134deg) !important; -webkit-transform:rotate(45deg); -moz-transform:rotate(134deg);
                                                                                -o-transform:rotate(134deg); -ms-transform:rotate(134deg); border-right:2px solid #ccc; border-bottom:2px solid #ccc;}
    .VerticalTimeline-block:nth-child(even) .VerticalTimeline-content .VerticalTimeline-read-more {float:right;}
    .VerticalTimeline-block:nth-child(even) .VerticalTimeline-content .VerticalTimeline-date {left:auto; right:122%; text-align:right;}
    .VerticalTimeline-block {margin:1em 0;}
    .VerticalTimeline-block:first-child {margin-top:0;}
    .VerticalTimeline-block:last-child {margin-bottom:0;}
    .VerticalTimeline-icon {margin-top:35%;}
        /* animaçãoes - pq não funcionam??? */
    .cssanimations .VerticalTimeline-content.is-hidden {visibility:hidden;}
    .cssanimations .VerticalTimeline-content.bounce-in {-webkit-animation:VerticalTimeline-bounce-2 .6s; -moz-animation:VerticalTimeline-bounce-2 .6s; animation:VerticalTimeline-bounce-2 .6s; visibility:visible;} 
    /* inverse bounce effect on even content blocks */
    .cssanimations .VerticalTimeline-block:nth-child(even) .VerticalTimeline-content.bounce-in {-webkit-animation:VerticalTimeline-bounce-2-inverse .6s; -moz-animation:VerticalTimeline-bounce-2-inverse .6s; animation:VerticalTimeline-bounce-2-inverse .6s;}
    .cssanimations .TimelineCircle.is-hidden {visibility:hidden;}
    .cssanimations .TimelineCircle.bounce-in {-webkit-animation:VerticalTimeline-bounce-1 .6s; -moz-animation:VerticalTimeline-bounce-1 .6s; 
                                              animation:VerticalTimeline-bounce-1 .6s; visibility:visible;}}

@media only screen and (min-width:768px) {
     .VerticalTimeline-content h2 {font-size:20px; font-size:1.25rem; margin-top:0;}
     .VerticalTimeline-content p {font-size:16px; font-size:1rem;}
     .VerticalTimeline-content .VerticalTimeline-read-more,
     .VerticalTimeline-content .VerticalTimeline-date {font-size:14px; font-size:.875rem;}}


/* css para título e destaque da 1to1 */
.TimelineTitle {color:#00718f; font-weight:600; font-size:30px;}
.Timeline1Header {color:#00718f; font-size:20px;}


/* Timeline Responsive: Tablet & Phone */
/* bolinha */
.phone.portrait .TimelineCircle {left:1.8%; margin-left:0; height:30px; width:30px}
.tablet.portrait  .TimelineCircle {left:1%; margin-left:0; height:30px; width:30px}
.phone.landscape .TimelineCircle {left:1.2%; margin-left:0; height:30px; width:30px}
.tablet.landscape .TimelineCircle {left:0.6%; margin-left:0; height:30px; width:30px}
/* */
.phone .VerticalTimeline-content::before,
.tablet .VerticalTimeline-content::before {border:18px solid transparent; border-right:18px solid #f1ebeb; content:""; height:0; position:absolute; right:100%; 
                                           top:35px; width:0;}
/* ponta (triângulo) do retângulo de texto */
.phone .VerticalTimeline-content::before,
.tablet .VerticalTimeline-content::before {border-color:white; border-left-color:white; left:-10px; top:35px; position:absolute; right:0; width:5px; height:5px;
                                           transform:rotate(-224deg) !important; -webkit-transform:rotate(-45deg); -moz-transform:rotate(-45deg); 
                                           -o-transform:rotate(-45deg); -ms-transform:rotate(-45deg); border-right:2px solid #ccc; border-bottom:2px solid #ccc;}
/* Barra de fim do timeline */
.phone .TimelineEnd,
.tablet .TimelineEnd {left:4px;}


/*------------------ FIM DO TIMELINE -----------------*/







/**********************************************************************************************
*************************************** SUBMENU CAMPAIGNS *************************************/

/* dar espaçamento aos icones das tabs */
.fa {margin-right:4px;}

/* Tabela/border das tabs */
.Tabs {border:none; /*border-bottom:solid 2px #741e91 !important;*/}

/* Header das Tabs */
.Tabs__tab {background-color:#fff; border:0; border-left:none; border-top:none; color:#bbb;}

/* Tab ativa */
.Tabs__tab.active {border-bottom:solid 2px #741e91; color:#741e91; font-weight:600; border-top:none;}

/* Conteúdos das Tabs */
.Tabs_body {padding-left:0; padding-top:20px; padding-right:0;}

/* Frase de estatística para tópicos */
.Statistic {color:#741e91; font-style:italic;}

/* Features - esquema de 6 colunas - colocar mais margin-bottom */
.MargBot6Col .Columns.MarginBottom {margin-bottom:25px;}





/**********************************************************************************************
*************************************** SUBMENU REPORTS ***************************************/

/* PERFEITO PARA SI | Altura do cartão */
.ReportDetailCard .Card {height:75px !important; padding:10px;}
.ReportDetailCard .CardBackground {background-color:#01aac8 !important; color:#fff !important;}
/*** Generated classes from Style Editor in OutSystems 10 ***/
[data-style-key="3iC93p2H3EeNAB6S0iKvxQ"] { font-style:italic; }
[data-style-key="Bpun9_AEO0SJ5aRbDXNbxw"] { font-style:italic; }
[data-style-key="oPguAYmcG0u5NUay9aAfSA"] { font-style:italic; }
[data-style-key="6BZScbddZkWmp0is8nqTfg"] { font-style:italic; }
[data-style-key="EnQO6M2J4kSF6+0xJfV_MQ"] { font-style:italic; }
[data-style-key="uxkmT+XPA06mMl0HAlekFg"] { font-style:italic; }
[data-style-key="6ph9pz6CLkuMFXemPAy27Q"] { font-style:italic; }
[data-style-key="UGdSJD__z0KYiBZE1A_bPw"] { font-style:italic; }
[data-style-key="5zJ8aIQosEipFtSG_myyOw"] { font-style:italic; }
[data-style-key="JkgnA4fPEUyvf5QdUnmPOQ"] { font-style:italic; }
/*** Generated classes from Style Editor in OutSystems 10 ***/





/*********************************************************************
*****************************  MY PROFILE ****************************/

/* Estrutura 2 colunas para 1ª secção da pagina: Texto + Imagem */
.desktop .SRC2_Dim2col84 .SmallRightColumns > .Column.ColFirst {width:84%; padding-right:5px; padding-left:0px;}
.desktop .SRC2_Dim2col84 .SmallRightColumns > .Column.ColLast {width:16%; padding-left:5px; padding-right:0px;}

.tablet .SRC2_Dim2col84 .SmallRightColumns > .Column.ColFirst {width:83%; padding-right:5px; padding-left:0px;}
.tablet .SRC2_Dim2col84 .SmallRightColumns > .Column.ColLast {width:17%; padding-left:5px; padding-right:0px;}

/* Estrutura de 2 colunas para checklist (bullets) com with:100% */
.desktop .SLC2_Dim2col3 .SmallLeftColumns > .Column.ColFirst {width:3.5%; padding-right:5px; padding-left:0px;}
.desktop .SLC2_Dim2col3 .SmallLeftColumns > .Column.ColLast {width:96.5%; padding-left:5px; padding-right:0px;}

.tablet .SLC2_Dim2col3 .SmallLeftColumns > .Column.ColFirst {width:5%; padding-right:5px; padding-left:0px;}
.tablet .SLC2_Dim2col3 .SmallLeftColumns > .Column.ColLast {width:95%; padding-left:5px; padding-right:0px;}

.phone .SLC2_Dim2col3 .SmallLeftColumns > .Column.ColFirst {width:8%; padding-right:5px; padding-left:0px;}
.phone .SLC2_Dim2col3 .SmallLeftColumns > .Column.ColLast {width:92%; padding-left:5px; padding-right:0px;}

/* Incentivo conta PC 1to1 */
.Box1to1 {background:#7030a0; color:#fff; padding:50px;}


/************ Pring Models ************/

/* Dimensão entre 3 colunas */
.desktop .Dim3Col40MP .Columns3 .Column.ColFirst {padding-left:0; padding-right:40px;}
.desktop .Dim3Col40MP .Columns3 > .Column {width:33.333%; padding:0 20px;}
.desktop .Dim3Col40MP .Columns3 .Column.ColLast {padding-right:0; padding-left:40px;}

/* Box */
.desktop .BoxPriceMP {min-height:670px;}
.tablet.portrait .BoxPriceMP {min-height:902px;}
.BoxPriceMP {background:#fff; border-radius:8px; border:solid 1px #ddd;}
.desktop .BoxPriceMP:hover,
.tablet .BoxPriceMP:hover {box-shadow:0 5px 20px rgb(141, 122, 150); transform:translateY(0px) scale(1.035); border:solid 1px #bbb0b0;}

/* Cores das caixas (header) */
.BoxPriceHeaderMP_1 {background:#bbd4a6; font-size:25px; padding:10px; color:#fff; font-weight:600; border-top-left-radius:8px; border-top-right-radius:8px; border-bottom-left-radius:0; border-bottom-right-radius:0;}
.BoxPriceHeaderMP_2 {background:#efc88e; font-size:25px; padding:10px; color:#fff; font-weight:600; border-top-left-radius:8px; border-top-right-radius:8px; border-bottom-left-radius:0; border-bottom-right-radius:0;}
.BoxPriceHeaderMP_3 {background:#b0c8d1; font-size:25px; padding:10px; color:#fff; font-weight:600; border-top-left-radius:8px; border-top-right-radius:8px; border-bottom-left-radius:0; border-bottom-right-radius:0;}

/* bullets */
.BoxPriceBulletsMP:before {content:'✔'; color:#36a606; font-size:20px; margin-top:0px; margin-left:13px; margin-right:0px;}

/* estrutura de 2 colunas para bullets */
.desktop .BoxPriceCol2MP .SmallLeftColumns > .Column.ColFirst {width:10%; padding-right:5px !important; padding-left:0px;}
.desktop .BoxPriceCol2MP .SmallLeftColumns > .Column.ColLast {width:90%; padding-left:5px !important; padding-right:0px;}
.desktop .Columns .Columns .Column {margin-bottom:5px !important;}

.tablet .BoxPriceCol2MP .SmallLeftColumns > .Column.ColFirst {width:15%; padding-right:5px !important; padding-left:0px;}
.tablet .BoxPriceCol2MP .SmallLeftColumns > .Column.ColLast {width:84%; padding-left:5px !important; padding-right:0px;}

.phone .BoxPriceCol2MP .SmallLeftColumns > .Column.ColFirst {width:13%; padding-right:5px !important; padding-left:0px;}
.phone .BoxPriceCol2MP .SmallLeftColumns > .Column.ColLast {width:87%; padding-left:5px !important; padding-right:0px;}

/* botão */
.BoxPriceBtMP {border-top-left-radius:0; border-top-right-radius:0; border-bottom-left-radius:8px; border-bottom-right-radius:8px;}

.desktop .DeskMargTop17 {margin-top:17px;}
.desktop .DeskMargTop10 {margin-top:10px;}
.desktop .DeskMargTop148 {margin-top:148px;}
.desktop .DeskMargTop30Neg {margin-top:-30px !important;}

.tablet .TablMargTop10 {margin-top:10px;}
.tablet .TablMargTop231 {margin-top:231px;}
.tablet .TablMargTop30Neg {margin-top:-30px !important;}
.tablet.landscape .TablLandMargTop29 {margin-top:29px;}


.phone .PhoneMargBot30 {margin-bottom:30px;}
.phone .PhoneMargBot50Neg {margin-bottom:-50px;}

/* BestDeal - Pulse */
.BestDealPulse {background:#36a606; color:#fff; font-weight:600; border-radius:50%; margin:10px; height:80px; width:80px; position:relative; 
                box-shadow:0 0 0 0 rgba(0, 0, 0, 1); transform:scale(1); animation:pulse 2s infinite;}
/*.BestDealPulse:hover {opacity:.9; text-decoration:none; -webkit-animation:none; animation:none;}*/              
.desktop .BestDealPulse {top:-713px; left:-170px;} 
.tablet.portrait .BestDealPulse {top:-950px; left:-107px;}
.tablet.landscape .BestDealPulse {top:-887px; left:-135px;} 
.phone.portrait .BestDealPulse {top:-700px; left:-149px;} 
.phone.landscape .BestDealPulse {top:-643px; left:-252px;} 

@keyframes pulse {
        0% {transform:scale(0.95); box-shadow:0 0 0 0 rgba(0, 0, 0, 0.7);}
        70% {transform:scale(1); box-shadow:0 0 0 10px rgba(0, 0, 0, 0);}
        100% {transform:scale(0.95); box-shadow:0 0 0 0 rgba(0, 0, 0, 0);}}



/************ Fim - Pring Models ************/






/*********************************************************************
******************************  CLUSTERS *****************************/

/* Frase em destaque */
.Highlight {color:#8225a0; border:solid 1px #8225a01f; background:#8225a00a; border-radius:10px; padding:20px;}
.tablet .Highlight {font-size:22px; line-height:35px;}

/* bullets with numbers */
.bulletsNumbers {color:#7030a0; font-size:30px; margin-top:5px; margin-bottom:5px; font-weight:600;}

/* Metodologia - 5 tópicos */
.TopicsBox {background:#8225a00a; border:dotted 2px #8225a057; padding:5px; min-height:240px;}





/*********************************************************************
******************************  FAQs *********************************/

/* Section Index */
.SectionIndex a, 
.SectionIndex a:link, 
.SectionIndex a:visited, 
.SectionIndex a.active, 
.SectionIndex a:hover, 
.desktop .SectionIndex a:hover {color:#741e91; border-bottom-color:#741e91; text-decoration:none; text-align-last:left !important;}

/* Posição fixa e não bater na barra roxa de menu */
.SectionIndex.fixed {position:fixed; top:20px; width:100%; -webkit-transform:translateZ(0); margin-top:100px !important;}





/*********************************************************************
************************** Simulation Fee ****************************/

/* bullets green - checklit simulation result */
.bulletsCheckGreen {list-style: none;}
.bulletsCheckGreen:before {content: '✔'; color:#169026; font-size:28px; margin-left:0;}
.phone .bulletsCheckGreen:before {margin-left:-15px;}

/* bullets red - cross checklit - simulation result does not include */
.bulletsCrossRed {list-style: none;}
.bulletsCrossRed:before {content:'✘'; color:#f20246; font-size:28px; margin-left:0;}
.phone .bulletsCrossRed:before {margin-left:-15px;}

/* para o texto não não ficar centrado ao ícone */
.SimulationResultAlign .TableVerticalAlign .Cell1, 
.SimulationResultAlign .TableVerticalAlign .Cell2 {display:table-cell; vertical-align:unset;}

/* Tabelas packages */
.TableBordBot {border-bottom: solid 1px #ccc;}

/*  Estrutura 2 coluunas - packages */
.Col2Padd5 .Columns2 > .Column {width:50%; padding:0 5%;}

/* Dimensão entre 3 colunas */
.Dim3Col40 .Columns3 .Column.ColFirst {padding-left:0; padding-right:40px;}
.Dim3Col40 .Columns3 > .Column {width:33.333%; padding:0 20px;}
.Dim3Col40 .Columns3 .Column.ColLast {padding-right:0; padding-left:40px;}

/* Hover Pricing Options */
.BoxPricingHover:hover {box-shadow:0 2px 10px 0px #7030a0d2;}

/* Dimensão de 2 colunas Medium -> de 35%-65% para 40%-60% */
.DimMed2Col4060 .MediumLeftColumns > .Column.ColFirst {width:40%;}
.DimMed2Col4060 .MediumLeftColumns > .Column.ColLast {width:60%;}





/*********************************************************************
******************************  DEMO *********************************/

/* Inputs */
select, 
input[type="text"], 
input[type="password"], 
input[type="datetime"], 
input[type="datetime-local"], 
input[type="date"], 
input[type="month"], 
input[type="time"], 
input[type="week"], 
input[type="number"], 
input[type="email"], 
input[type="url"], 
input[type="search"], 
input[type="tel"], 
input[type="color"] 
{background-color:#fff; border-radius: 4px; box-shadow:none; font-size:20px; line-height:32px; vertical-align:initial; height:40px; margin-top:-3px;}

.DemoBox {background:#ededed; color:#464646; padding:30px; border-radius:15px; border:solid 1px #ddd;}