/*
    CSS con le personalizzazioni dell'interfaccia grafica. Il file principale è
    main.css mentre skin.css sovrascrive le proprietà personalizzate.
*/

@import url(font-montserrat.css);

/*
 *  Buttons
 */

input[type="submit"],
input[type="reset"],
input[type="button"],
button,
.button {
    height: 2.86em;
    border-radius: 1.43em;
    background-color: #83D888;
    color: #FFFFFF !important;
}

input[type="submit"]:hover,
input[type="reset"]:hover,
input[type="button"]:hover,
button:hover,
.button:hover {
    background-color: #D9F3DB;
}

input[type="submit"]:active,
input[type="reset"]:active,
input[type="button"]:active,
button:active,
.button:active {
    background-color: #83D888;
}

.wrapper.style1 input[type="submit"],
.wrapper.style1 input[type="reset"],
.wrapper.style1 input[type="button"],
.wrapper.style1 button,
.wrapper.style1 .button {
        background-color: #DA1F3D;
}

.wrapper.style1 input[type="submit"]:hover,
.wrapper.style1 input[type="reset"]:hover,
.wrapper.style1 input[type="button"]:hover,
.wrapper.style1 button:hover,
.wrapper.style1 .button:hover {
    background-color: #F08100;
}

.wrapper.style1 input[type="submit"]:active,
.wrapper.style1 input[type="reset"]:active,
.wrapper.style1 input[type="button"]:active,
.wrapper.style1 button:active,
.wrapper.style1 .button:active {
    background-color: #DA1F3D;
}

.wrapper.style2 input[type="checkbox"]:checked + label:before,
.wrapper.style2 input[type="radio"]:checked + label:before {
    color: #83D888;
}

/*
 *  Fonts
 */

body, input, select, textarea {
    font-family: "Montserrat";
	color: #152a35;
}

strong, b {
    color: #2C2B2B;
}

h1, h2, h3, h4, h5, h6 {
    color: #2C2B2B;
}

label {
    color: #C51100;
}

table th {
    color: #C51100;
}

.wrapper.style1 {
    background-color: #FFFFFF;
}

.wrapper.style1 table th {
    color: #C51100;
}

.wrapper.style1 input,
.wrapper.style1 select,
.wrapper.style1 textarea,
.wrapper.style1 label {
    color: #152a35;
}

.wrapper.style1 a {
    color: #2C2B2B;
}

.wrapper.style1 strong {
    color: #2C2B2B;
}

.wrapper.style1 b {
    color: #2C2B2B;
}

.wrapper.style1 h1, .wrapper.style1 h2, .wrapper.style1 h4, .wrapper.style1 h5, .wrapper.style1 h6 {
    color: #2C2B2B;
}

.wrapper.style1 h3 {
    color: #2C2B2B;
    font-weight: 600;
}

header p {
    color: #2C2B2B;
}

.menu-item-horizontal.pagina-attiva {
    color: #FFFFFF;
}

/*
 *  Other
 */

.row.logo {
    background-color: transparent;
    margin-top: 5px;
    margin-bottom: 5px;
}

.row.logo:after, .row.logo:before {
	content: none;
}

.row.logo img {
	padding-top: 0;
	padding-left: 0;
    height: auto;
}

.row .ui-tabs.ui-widget {
    padding-left: 0;
}

#footer {
    padding: 3em 2em 2em 2em;
    flex-shrink: 0;
}

#footer .inner .logo {
    text-align: right;
}

footer {
    background-color: #f7f7f7;
}

footer .inner p {
    font-size: 11px;
    line-height: 13px;
    color: #4a4956;
    margin: 0 0 1em 0;
}

footer .inner p a {
    color: #C51100;
}

.ui-widget-content .ui-state-highlight {
    background-color: #C51100;
}

#frmLogin .row .12u$ img {
    height: 50px;
    width: 110px;
}

.wrapper.style1 header p {
    color:  #2C2B2B;
    font-weight: 600;
}

img.logo-footer {
    width: 130px;
    height: auto;
    margin-bottom: 2em;
}

#alerts {
    padding: 0em 1em 0em 2em;
    margin-right: 0;
    margin-top: 0;
    background: transparent;
}

#alerts a {
    margin-left: auto;
}

.alerts .notification {
	width: 20px!important;
	height: 20px!important;
	font-size: 14px;
	text-align: center;
	padding-top: 2px;
	position: absolute;
	top: 0px;
	right: 0px;
}

.form-login {
    margin-top: 40px;
}

.ui-datatable-tablewrapper {
    overflow: hidden;
}

#mainMenuButton {
    margin-left: auto;
}
.menu-top a:hover {
  font-weight: bold;
  border-color: #C51100;
}
#header {
    background-color: #DA1F3D;
    padding: 0 2em;
    border-bottom: 0px solid #cacaca;
    height: auto;
    box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.1);
}

#header > a {
    color: #FFFFFF;
}

#header > .inner,
#alerts > .inner {
    margin: 0 auto;
    width: 95%;
    display: flex;
    align-items: center;
    max-width: 100%;
    max-height: 100px;
}

@media screen and (max-width: 1280px) {
	#header > .inner,
	#alerts > .inner {
        width: 65em;
    }
}

/*
#mainMenuButton:hover {
    font-weight: bold;
}
*/
.menu-top a, #mainMenuButton {
	color: #2C2B2B;
	border-bottom: 3px solid transparent;
	font-weight: bold;
}

.ui-tabs .ui-tabs-nav.ui-widget-header li a {
    color: #C51100;
}

html, body {
  height: 100%;
}
body {
  display: flex;
  flex-direction: column;
}
#main {
  flex: 1 0 auto;
  background-color: #FFFFFF;
}

.ui-menu {
    width: auto;
    padding: 1em;
    position: relative;
    outline: 0 none;
}

.ui-menu.ui-widget {
    padding: 1em;
}

.menu-altro {
    flex: 1;
    display: flex;
}

.ui-menu.ui-widget .ui-menuitem-link .ui-menuitem-icon {
    margin-right: 0px;
}

.ui-menuitem-icon {
    width: 1em;
}

a {
    color: #FFFFFF;
}

#lnkOtherMenuItems {
    white-space: nowrap;
}

.wrapper header {
    margin-top: 2em;
}

.row.canale-comunicazione .box.mezzo-predefinito {
    background-color: #DA1F3D;
}

/* Gestione menu a seconda della larghezza dello schermo */

@media screen and (max-width: 799px) {
    .menu-item-horizontal {
        display: none !important;
    }
}

@media screen and (min-width: 800px) {
    .menu-item-vertical {
        display: none !important;
    }
}

.wrapper .inner {
    width: 85%;
}

.ui-tabs .ui-tabs-panel {
    padding: 0;
}

.ui-tabs.ui-tabs-top > .ui-tabs-nav {
    padding: 0;
}

.h4-strong {
    color: #2C2B2B !important;
}

.a-color {
    color: #DA1F3D !important;
}

.login-wrapper {
    background-position: top center;
    background-size: auto;
}

.wrapper.style1 {
  color: #2C2B2B;
}