﻿@import url("/LisbonTheme/Theme.LisbonTheme.css?1249");

/*
    How to generate a theme for your company: 
    
        1 - Go to https://silkui.outsystems.com/ThemeCustomizer/GenerateLisbon.aspx
        2 - Copy the generated CSS
        3 - Replace the CSS for Primary Color Customization below with the Generated CSS

*/

/*------------------------------------*\
             Import Font
\*------------------------------------*/

/*
    How to generate a theme for your company: 
    
        1 - Go to http://labs.outsystems.net/ThemeCustomizer/GenerateLiverpool.aspx
        2 - Copy the generated CSS
        3 - Paste it here

*/

/*------------------------------------*\
             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: #18c2f5; /*primary-color*/
}

.desktop a:hover,
.desktop a:link:hover,
.desktop a:visited:hover {
    color: #18c2f5; /*primary-color*/
}

.Header_background {
    background-color: #18c2f5; /*primary-color*/
    border-bottom-color: #18c2f5; /*primary-color*/
}

.Header_title {    
    border-right-color: #18c2f5; /*primary-color*/
}

.Menu_DropDownPanel {
    background-color: #18c2f5; /*primary-color*/
}

.Menu_TopMenu a span.fa {
    border-color: #18c2f5; /*primary-color*/
}

.Menu_TopMenu:hover span.fa {
    color: #18c2f5;
    border-color: #18c2f5;
}

.Menu_TopMenu:hover .Menu_DropDownArrow {
    border-top-color: #18c2f5;
}

.Menu_TopMenuActive {
    border-top-color: #18c2f5;
}

.Header_Menu a:hover, 
.Header_Menu a:link:hover, 
.Header_Menu a:visited:hover,
.desktop a:hover, 
.desktop a:link:hover {
    color: #18c2f5;
}


.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: #18c2f5;
}

.Menu_TopMenuActive .Menu_DropDownArrow,
.Menu_TopMenuActive:hover .Menu_DropDownArrow {
    border-top-color: #18c2f5;
}

.Menu_DropDownArrow {
    border-top-color: #18c2f5;
}

.Menu_TopMenuActive a span.fa {
    color: #18c2f5;
    border-color: #18c2f5;
}

.Menu_DropDownPanel a span.fa {
    color: #18c2f5;
}

a.ListNavigation_PageNumber:link,
span.ListNavigation_CurrentPageNumber,
span.ListNavigation_Ellipsis {
    color: #18c2f5; /*primary-color*/
}

a.ListNavigation_PageNumber:link:hover,
span.ListNavigation_CurrentPageNumber:hover,
span.ListNavigation_Ellipsis:hover {
    color: #18c2f5; /*primary-color*/
}

a.ListNavigation_Previous:link,
a.ListNavigation_Next:link,
span.ListNavigation_DisabledNext, 
span.ListNavigation_DisabledPrevious {
    color: #18c2f5; /*primary-color*/
}

a.ListNavigation_Previous:link:hover,
a.ListNavigation_Next:link:hover,
span.ListNavigation_DisabledNext:hover, 
span.ListNavigation_DisabledPrevious:hover {
    color: #18c2f5; /*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: #18c2f5; /*primary-color*/
    border-color: #18c2f5; /*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: #18c2f5; /*primary-color*/
    border-color: #18c2f5; /*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: #18c2f5; /*primary-color*/
    border-color: #18c2f5; /*primary-color*/
    color: #FFF;
    -webkit-filter: brightness(0.8);
    filter: brightness(0.8);
    
}

.Login_Footer {
    background: #18c2f5; /*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: #18c2f5; /*primary-color*/
}
.AccordionVertical_item.open > .AccordionVertical__header > .AccordionVertical___icon > .fa {
    color: #18c2f5; /*primary-color*/
}

.expanded .SectionExpandable__icon.Heading2 > .fa {
    color: #18c2f5; /*primary-color*/
}

.Panel .SectionExpandable__icon.Heading2 > .fa {
    color: #18c2f5; /*primary-color*/
}

.ButtonGroup_button.Button:hover {
    background: #18c2f5; /*primary-color*/
}

.select2-container .select2-choice span {
    color: #18c2f5; /*primary-color*/
}

.select2-dropdown-open .select2-choice {
    background-color: #fff;
}

.select2-results .select2-highlighted {
    background-color: #18c2f5; /*primary-color*/
}

.IconBadge_number {
    background-color: #18c2f5; /*primary-color*/
}

.desktop .NavigationBar a:hover, 
.desktop .NavigationBar a:link:hover {
    color: #18c2f5; /*primary-color*/
}

.NavigationBar a.Active {
    color: #18c2f5; /*primary-color*/
}

.desktop .NavigationBar a:hover:after, 
.desktop .NavigationBar a:link:hover:after,
.NavigationBar a.Active:after {
    background-color: #18c2f5; /*primary-color*/
}

.NavigationBar a.Active:not(.IE8):before {
    border-bottom-color: #18c2f5; /*primary-color*/
}

.desktop .NavigationBar.Vertical a:hover,
.desktop .NavigationBar.Vertical a:link:hover,
.NavigationBar.Vertical a.Active,
.NavigationBar.Vertical a:link.Active {
  border-color: #18c2f5; /*primary-color*/
}

.NavigationBar.Vertical a.Active:not(.IE8):before {
    border-left-color: #18c2f5; /*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: #18c2f5; /*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: #18c2f5; /*primary-color*/
}

.Tabs__tab.active {
    border-top-color: #18c2f5; /*primary-color*/
    color: #18c2f5; /*primary-color*/
}

.WizardStep a,
.WizardStep a:link,
.desktop .WizardStep a:hover,
.desktop .WizardStep a:link:hover
{
    color: #18c2f5; /*primary-color*/
}


.WizardStep.ActiveStep {
    background: #18c2f5; /*primary-color*/
    -webkit-filter: brightness(0.9);
    filter: brightness(0.9);
    
}

.WizardStep.ActiveStep:before {
    border-top-color: #18c2f5; /*primary-color*/
    border-bottom-color: #18c2f5; /*primary-color*/
}

.WizardStep.Past {
    background: #18c2f5; /*primary-color*/
}

.WizardStep.Past:before {
    border-top-color: #18c2f5; /*primary-color*/
    border-bottom-color: #18c2f5; /*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: #18c2f5; /*primary-color*/
    border-top-color: #18c2f5; /*primary-color*/
    -webkit-filter: brightness(0.7);
    filter: brightness(0.7);
    
}

.Button,
a.Button {
    color: #18c2f5; /*primary-color*/
    box-shadow: none;
}

.Button.ButtonDefault,
.Button.Is_Default {
    background-color: #18c2f5; /*primary-color*/
    border-color: #18c2f5; /*primary-color*/
}

.desktop .Button:hover,
.desktop a.Button:hover {
    background-color: #fff;
    box-shadow: none;
    border-bottom-width: 2px;
}

.Button:hover:active,
a.Button:hover:active {
    color: #18c2f5; /*primary-color*/
    background-color: #fff;
    box-shadow: none;
}

.Button.ButtonDefault:hover,
.Button.Is_Default:hover {
    background-color: #fff;
    box-shadow: none;
}

.Button.ButtonDefault:hover:active,
.Button.Is_Default:hover:active {
    background-color: #fff; /*primary-color*/
    border-color: #18c2f5; /*primary-color*/
    box-shadow: none;
}

.desktop a.ActionAdd:hover:active,
.desktop a.ActionEdit:hover:active,
.desktop a.ActionDelete:hover:active,
.desktop a.ActionChange:hover:active {
    background-color: #18c2f5; /*primary-color*/
    border-color: #18c2f5; /*primary-color*/
    color: #fff;
}

a,
a:link,
a:visited,
.EditableTable tr.RowControlGroup a  {
    color: #18c2f5; /*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: #18c2f5; /*primary-color*/
}

.Menu_DropDownPanel a.Menu_SubMenuItem:hover {
    background-color: #18c2f5; /*primary-color*/
}

.Menu_DropDownButton.open .Menu_TopMenu .Menu_DropDownArrow {
    border-top-color: #fff;
    opacity: .5;
}

.tablet a.Header_ButtonMenu, 
.phone a.Header_ButtonMenu {
    color: #000;
}

.Page.active .Header_ButtonMenu {
    color: #000;
}

.SectionIndex.vertical a.active, 
.SectionIndex.vertical a:hover {
    color: #18c2f5; /*primary-color*/
    border-left-color: #18c2f5; /*primary-color*/
}

.SectionIndex a, 
.SectionIndex a:link, 
.SectionIndex a:visited,
.SectionIndex a.active, 
.SectionIndex a:hover,
.desktop .SectionIndex a:hover{
    color: #18c2f5; /*primary-color*/
    border-bottom-color: #18c2f5; /*primary-color*/
    text-decoration: none;
}


.AccordionVertical___title {
    color: #18c2f5; /*primary-color*/
}

.SectionExpandable.expanded .SectionExpandable_header .Heading2 {
    color: #18c2f5; /*primary-color*/
}


.Button.Link {
    color: #18c2f5; /*primary-color*/
}

.desktop .Button.Link:hover {
    border-color: #18c2f5; /*primary-color*/
    color: #18c2f5; /*primary-color*/
}

.desktop .Button:hover, 
.desktop a.Button:hover {
    color: #18c2f5; /*primary-color*/
}

.ButtonGroup_button.active, 
.desktop .ButtonGroup_button.active:hover {
    background-color: #18c2f5; /*primary-color*/
}

.ButtonGroup_button.Button:hover,
.ButtonGroup_button.Button:hover .fa{
    color: #FFF;
}


.Calendar-day-selected, 
.Calendar-day-selected:hover {
    background: #18c2f5; /*primary-color*/
}

.Calendar-navDisabled > div, 
.topBar-navDisabled .Calendar-navBtn > div,
.Calendar-time-down, 
.Calendar-time-up, 
.Calendar-time-am {
    color: #18c2f5; /*primary-color*/
}

.DropdownMenu .PH > a,
.DropdownMenu .PH > a:hover {
    color: #18c2f5; /*primary-color*/
}

.SliderRange .ui-slider-range {
    background-color: #18c2f5; /*primary-color*/
}

.EditableTable tr.RowControlGroup a:hover {
    color:  #18c2f5; /*primary-color*/
}

.desktop .Button.ButtonDefault:hover,
.Button.Button.Is_Default:hover {
    background-color: #18c2f5; /*primary-color*/
    border-color: #18c2f5; /*primary-color*/
}
.owl-theme .owl-controls .owl-page.active span, 
.owl-theme .owl-controls.clickable .owl-page:hover span {
    background-color: #18c2f5; /*primary-color*/
}

td.RowWithAddAction a:hover {
    color: #18c2f5; /*primary-color*/
    -webkit-filter: brightness(0.8);
    filter: brightness(0.8);
    
}

.InfoTooltip .tooltipstered,
.ListItem  .tooltipstered{
    color: #18c2f5; /*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: white; /*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?1248);
}

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?1248);
}

.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;
    }
}


.Application_Title a,
.Application_Title a:link,
.Application_Title a:visited,
.Application_Title a:hover {
    color: #000;
}


/*Questionnaire*/
.questionnaire-optionsWithImg {
    min-height: 150px;
    width: 200px;
    padding: 20px;
    margin-left: 10px; 
}

.EditableContainer{
    color: #18c2f5;
}

/*Form Screen*/
.FormGroupBox{
    border: solid;
    border-width: 1px;
    padding-bottom: 10px;
}

.FormTitleContainer{
    border-bottom: solid;
    border-width: 1px;
    padding-top: 5px;
}


.FormContent{
    position: relative;
    left: -60px;
}
.FormNumbers{
    font-size: 50px;
    color: GrayText;
    font-weight: bold;
    padding-left: 10px;
}

.ContainerWithBox{
    border: solid;
    border-width: 1px;
    padding-bottom: 8px;
    padding-top: 8px;
}

.DoubleSectionTitleRight{
    position: relative;
    left: 30px;
    border-bottom: solid;
    border-width: 1px;
    padding-top: 5px;
}

.DoubleSectionRight{
    position: relative;
    left: 30px;
}

.DoubleSectionTitleLeft{
    position: relative;
    left: 30px;
    border-bottom: solid;
    border-width: 1px;
    padding-top: 5px;
}

.DoubleSectionLeft{
    position: relative;
    left: 30px;
}

.Form label {
    color: black;
    vertical-align: top;
}

.FormGroupBox.Box3{
    padding-bottom: 47px;
}
/*end of Form Screen*/


.Text_primary_color {
    color: #18c2f5; /*primary-color*/
}

.Footer {
    display: none;
}

.dash {
    font-size: 22px;
    font-weight: bold;
    line-height: 30px;
}

Header_Menu a, .Header_Menu a:link, .Header_Menu a:visited {
    color: black;
}

.Header {
    height: 80px;

}

.Header .Application_Title img {
    max-height: 52px;
    vertical-align: middle;
}

.CardNoBorder .Card {
    border: 0px;
}

.PaddingSection {
    padding: 75px 0;
}

.IconSmallFont .PaddingSection .fa {
    font-size: 20px;
}

.PaddingSection .fa {
    font-size: 70px;
}

.BigTitle {
    font-size: 46px;
    color: #fff;
    font-weight: bold;
    position: relative;
    z-index: 1;
}

.phone .BigTitle {
    font-size: 40px;
}



.SubTitle {
    color: #FFF;
    font-size: 16px;
    padding-bottom: 40px;   
    position: relative;
    z-index: 1;
}

.Title_Section {
    position: relative;
    padding: 100px 20px 120px 20px;
}

.Title_Section:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0,0,0,0.3)
}

.TitleColumn {
    font-size: 24px;
    text-transform: uppercase;
}

.tablet .Column img,
.phone .Column img {
    max-width: 100%;
}

.tablet .Column,
.phone .Column { 
    margin-bottom: 25px;
}

.tablet .PaddingSection,
.phone .PaddingSection {
    padding-bottom: 20px;
}


.Menu_TopMenuActive {
  background-color: transparent;
  border-top: 3px solid #18c2f5;
  box-shadow: inset 0 1px 2px rgba(255, 255, 255, .1);
  line-height: 44px;
  height: 49px;
}

.SectionWebsite.Talk {
  background: 
    linear-gradient( rgba(0, 199, 239, 0.37), rgba(0, 199, 239, 0.37)),
    url(/PassMusicaTheme/img/Background.jpg?1323);
  background-attachment:fixed;
  position:relative;
  background-size: cover;
}

.SectionWebsite.Talk:after {
  background-color: rgba(0,0,0,0.3);
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

.SectionWebsite.Talk .TitleColumn {
  color: #FFF;
  font-weight: bold;
  position: relative;
  z-index: 1;
}

.SectionWebsite.Talk .Button {
  position: relative;
  z-index: 1;
}
.desktop .animated, .desktop .animatedFirst {
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;

  visibility: hidden;
}


.desktop .animated.infinite {
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}



@-webkit-keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 20%, 0);
            transform: translate3d(0, 20%, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}

@keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 20%, 0);
            transform: translate3d(0, 20%, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}

.desktop .fadeInUp {
  -webkit-animation-name: fadeInUp;
          animation-name: fadeInUp;
  visibility: visible !important;    
}

@-webkit-keyframes fadeIn {
  0% {opacity: 0;}
  100% {opacity: 1;}
}

@keyframes fadeIn {
  0% {opacity: 0;}
  100% {opacity: 1;}
}

.fadeIn {
  -webkit-animation-name: fadeIn;
          animation-name: fadeIn;
  visibility: visible !important;    
}

.delay-05 {
  -webkit-animation-delay: 0.5s; 
          animation-delay: 0.5s;
}

.delay-02 {
  -webkit-animation-delay: 0.2s; 
          animation-delay: 0.2s;
}


@-webkit-keyframes fadeInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(-20%, 0, 0);
            transform: translate3d(-20%, 0, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}

@keyframes fadeInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(-20%, 0, 0);
            transform: translate3d(-20%, 0, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}

.fadeInLeft {
  -webkit-animation-name: fadeInLeft;
          animation-name: fadeInLeft;
  visibility: visible !important;    
}

.ContainerSecondImageHomePage {
    height: 320px;
    overflow: hidden;
}

.SecondImageHomePage {
    width: 600px;
    position: relative;
}

.Header_background {
    background-color: white;
    display: block !important;
}


.Image_thumb2{
width: 600px;
height: 200px;
position: relative;
top: -20px;
}

.Image_thumb3{
width: 600px;
height: 250px;
position: relative;
top: -20px;
}

.ContainerSimulator{
height: 50px;
overflow: hidden;
}

.Cointainer1Simulacao{
position: relative;
top: -170px;
color: black;
font-size: 17px;
}


.ContainerDetail{
    background-color: white;
    color: #969696;
    font-size: 16px;
    text-transform: uppercase;
    padding-top: 0px;
}

.ContainerDetailSmallText{
    color: #969696;
    font-size: 14px;
    text-transform: none;
    
}

.InvertedButton{
    background-color: white;
    padding: 5px;
    border: 2px solid #18c2f5;
    color: #18c2f5;
    cursor: pointer;
    text-transform: uppercase;
    height: 32px;
}

.InvertedButton:hover{
    background-color: #18c2f5;
    color: white;
}

.whiteLink{
  color: white !important;    
}

.FooterTitle{
  color: #18c2f5;    
  font-weight: bold;
}

.Button{
    color: white;
    background-color: #18c2f5;
    border-radius: 0px;
    border-color: #18c2f5;
    border-style: solid;
    border-width: 2px;
    border-bottom-width: 2px;
}

.Button:hover{
    color: #18c2f5;
    background-color: white;
    border-color: #18c2f5;
    border-bottom-width: 2px;
}

.TextSections{
    font-size: 16px;
    line-height: 22px;
}

.PriceStyle{
    font-size: 18px;
    font-weight: normal !important;
}


.GraySectionBackground{
    background-color: #F4F4F4;  
}

.TitlePosition {
    position: relative;
    top: 90px;
}

textarea:focus,
select:focus,
input:focus {
    border-color: #18c2f5;
}

/* tablet mobile menu css */

.tablet .Application_Menu,
.phone .Application_Menu {
    background: white;
    bottom: 0;
    display: block;
    height: auto;
    overflow: auto;
    position: fixed;
    top: 80px;
    width: 100%;
    opacity: 0.9;
    text-align: center;
    align: center;
}

.tablet .Menu_TopMenu a,
.phone .Menu_TopMenu a {
    text-align: center;
}

/* mobile text width */

.phone .ThemeGrid_Width6 {
    width: 100%;
}

.phone .ThemeGrid_Width4 {
    width: 100%;
}
/* animation */

.flash {
   animation-name: flash;
    animation-duration: 0.8s;
    animation-timing-function: linear;
    animation-direction: alternate;
    animation-play-state: running;
}

@keyframes flash {
    from {color: white;}
    to {color: black;}
}

/* Site top shadow */

body:before {
          content: "";
          position: fixed;
          top: -10px;
          left: 0;
          width: 100%;
          height: 10px;

          -webkit-box-shadow: 0px 0px 10px rgba(0,0,0,.8);
          -moz-box-shadow: 0px 0px 10px rgba(0,0,0,.8);
           box-shadow: 0px 0px 10px rgba(0,0,0,.8);

          z-index: 100;
}


.phone .BigDiv, .tablet .BigDiv{
    width:100% !important;
}

/* Yes/No Buttons */

.Yes_Button {
    background-color: white; 
    color: black; 
    border: 1px solid lightgray;
    border-radius: 10px;
    cursor: pointer;
}

.Yes_Button:hover {
    background-color: #18c2f5;
    color: white;
}

.Yes_Button_Selected {
    background-color: #18c2f5; 
    color: white; 
    border: 1px solid #18c2f5;
    border-radius: 10px;
    cursor: pointer;
}

.No_Button {
    background-color: white; 
    color: black; 
    border: 1px solid lightgray;
    border-radius: 10px;
    cursor: pointer;
}

.No_Button:hover {
    background-color: #18c2f5;
    color: white;
}

.No_Button_Selected {
    background-color: #18c2f5; 
    color: white; 
    border: 1px solid #18c2f5;
    border-radius: 10px;
    cursor: pointer;
}

/* Tooltip */

.tooltip {
    position: relative;
    display: inline-block;
    color: #18c2f5;
    cursor: help;
    font-size: 14px !important;
}

.tooltip .tooltiptext {
    visibility: hidden;
    width: 120px;
    background-color: #18c2f5;
    color: white;
    text-align: center;
    border-radius: 6px;
    padding: 5px 0;
    font-size: 14px !important;
    /* Position the tooltip */
    position: absolute;
    z-index: 1;
    width:200px;
}

.tooltip:hover .tooltiptext {
    visibility: visible;
    cursor: help;
}


.MonthItemComercio {
    padding: 15px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.09);
    border-radius: 4px;
    text-transform: uppercase;
    margin-top: 20px;
    background-color: #fff;
}



/* Custom Width For Inputs */


.CustomTVInputWidth{
    width: 60px;
    text-align: center;
}

.CustomHourInputWidth{
    width: 80px;  
    text-align: center;
}

.CustomCapacityInputWidth{
    width: 80px;
    text-align: center;
}

.CustomDateInputWidth{
    width: 100px !important;
    text-align: center;
}

.tablet .CustomDateInputWidth {
    width: 200px  !important;
    text-align: center;
}

.CustomTVInputWidth{
    width: 60px  !important;
    text-align: center;
}

.tablet .CustomHourInputWidth{
    width: 80px  !important;  
    text-align: center;
}

.tablet .CustomCapacityInputWidth{
    width: 80px !important;
    text-align: center;
}

