/*
 *  Document   : styles
 *  Created on : 2-mag-2014, 11.57.04
 *  Author     : albertob
 *  Description: CSS sito AllertaLiguria
 */


/*
@font-face {
    font-family: 'Open Sans';
    src: url('/fonts/OpenSans-Regular.ttf') format('truetype');
 
}

@font-face {
    font-family: 'Abel';
    src: url('/fonts/Abel-Regular.ttf') format('truetype');
 
}

*/


/*****************************
 * Override stili Foundation *
 *****************************/

body {
    font-family: 'Open Sans', sans-serif;
    min-width: 240px;
    color: #353535;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'Open Sans', sans-serif;
    font-weight: 700;
    color: #404040;
    line-height: normal;
    margin-top: 0.2rem;
    margin-bottom: 0.2rem;
}

h1 {
    font-size: 1rem;
}

h2 {
    font-size: 0.813rem;
}

h3 {
    font-size: 0.938rem;
}

h4 {
    font-size: 2rem;
}

h5 {
    font-size: 0.625rem;
}

h6 {
    font-size: 1.5rem;
}

p,
span {
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    font-size: 0.75rem;
    line-height: normal;
    margin-top: 0.2rem;
    margin-bottom: 0.2rem;
    /*hyphens: auto;*/
}

ul,
li {
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    font-size: 0.75rem;
    line-height: normal;
    margin-top: 0px;
    margin-bottom: 0px;
}

a {
    color: #008CBA;
    line-height: inherit;
    text-decoration: underline;
    font-weight: bold;
}

a:hover,
a:focus {
    color: #00779f;
}

ul li a {
    text-decoration: underline;
}

ul li p {
    margin-top: 0px;
    margin-bottom: 0px;
}

button,
.button {
    background-color: #4a4a4a;
    border-color: #424242;
    color: white;
    text-transform: uppercase;
    font-weight: 700;
    margin: 0;
}

button:hover,
button:focus,
.button:hover,
.button:focus {
    background-color: #424242;
    color: white;
}

button.large,
.button.large {
    padding-top: 0.3rem;
    padding-right: 0.5rem;
    padding-bottom: 0.3rem;
    padding-left: 0.5rem;
    font-size: 1.5rem;
    font-family: 'Open Sans', sans-serif;
}

button.large p.al-button-caption,
.button.large p.al-button-caption,
button.large span.al-button-caption,
.button.large span.al-button-caption {
    font-size: 1.5rem;
    font-family: 'Abel', sans-serif;
    text-transform: none;
    font-weight: 700;
}

button.large p.al-button-filesize,
.button.large p.al-button-filesize,
button.large span.al-button-filesize,
.button.large span.al-button-filesize {
    font-size: 1rem;
    font-family: 'Abel', sans-serif;
    text-transform: none;
    font-weight: 400;
}

button.small,
.button.small {
    padding-top: 0.3rem;
    padding-right: 0.5rem;
    padding-bottom: 0.3rem;
    padding-left: 0.5rem;
    font-size: 0.8125rem;
    font-family: 'Open Sans', sans-serif;
}

button.small p.al-button-caption,
.button.small p.al-button-caption,
button.small span.al-button-caption,
.button.small span.al-button-caption {
    font-size: 1rem;
    font-family: 'Abel', sans-serif;
    text-transform: none;
    font-weight: 700;
}

button.small p.al-button-filesize,
.button.small p.al-button-filesize,
button.small span.al-button-filesize,
.button.small span.al-button-filesize {
    font-size: 0.750rem;
    font-family: 'Abel', sans-serif;
    text-transform: none;
    font-weight: 400;
}

.panel {
    padding: 0.30rem;
    background-color: #f0f0f0;
    border-color: #e3e3e3;
}

.panel h1,
.panel h2,
.panel h3,
.panel h4,
.panel h5,
.panel h6 {
    margin-top: 0.1rem;
    margin-bottom: 0.1rem;
}

.top-bar {
    background: #f0f0f0;
}

.top-bar-section ul li>a {
    font-family: 'Open Sans', sans-serif;
    font-size: 0.8125rem;
    font-weight: 600;
}

.top-bar ul li>a {
    text-decoration: none;
}

.top-bar ul li>a>span {
    line-height: inherit;
}

.accordion .accordion-navigation>a,
.accordion dd>a {
    background: #f0f0f0;
}

.accordion .accordion-navigation>a:hover,
.accordion dd>a:hover {
    background: #f0f0f0;
}

.accordion .accordion-navigation.active>a,
.accordion dd.active>a {
    background: #f0f0f0;
}

.accordion .accordion-navigation,
.accordion dd {
    margin-bottom: 3px !important;
}

.accordion dd>a {
    padding: 0px;
}

.accordion .accordion-navigation>.content.active,
.accordion dd>.content.active {
    border-left: 2px solid #efefef;
    border-right: 2px solid #efefef;
    border-bottom: 2px solid #efefef;
}

.accordion .dd.active {
    background: #f0f0f0;
    border: 2px solid #efefef;
    margin: 0 0 10px 0;
}

.accordion .accordion-navigation>a,
.accordion dd>a {
    padding: 0;
    background: #f0f0f0;
}

.row .row {
    margin-left: -0.5rem;
    margin-right: -0.5rem;
}

.column,
.columns {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}

.top-bar .toggle-topbar.menu-icon {
    padding-left: 0px;
}

.top-bar-section ul li {
    background: #f0f0f0;
}

.top-bar-section>ul>li>a {
    text-transform: uppercase;
}

.contain-to-grid {
    background: #f0f0f0;
}

.top-bar-section .dropdown li:not(.has-form):not(.active)>a:not(.button) {
    background: #f0f0f0;
    color: #333333;
}

.top-bar-section .dropdown li:not(.has-form):not(.active):hover>a:not(.button) {
    background: #dbdbdb;
    color: #333333;
}

.top-bar-section .dropdown {
    -moz-box-shadow: 2px 2px 1px #cfcfcf;
    -webkit-box-shadow: 2px 2px 1px #cfcfcf;
    box-shadow: 2px 2px 1px #cfcfcf;
}

.top-bar-section ul li:hover:not(.has-form)>a {
    background: #dbdbdb;
    color: #333333;
}

.top-bar-section ul li.active>a {
    background: #dbdbdb;
    color: #333333;
}

.top-bar-section li.active:not(.has-form) a:not(.button) {
    background: #dbdbdb;
    color: #333333;
}

.top-bar-section li:not(.has-form) a:not(.button) {
    background: #f0f0f0;
}

.top-bar-section>ul>.divider,
.top-bar-section>ul>[role="separator"] {
    border-right: solid 1px #dbdbdb;
}

.top-bar-section .divider,
.top-bar-section [role="separator"] {
    border-top: solid 1px #dbdbdb;
}

.top-bar-section ul li>a {
    color: #333333;
    text-decoration: none;
}

.top-bar-section li:not(.has-form) a:not(.button):hover {
    background: #dbdbdb;
}

@media only screen and (min-width: 40.063em) {
    .top-bar-section .has-dropdown>a:after {
        border-color: rgba(51, 51, 51, 0.4) transparent transparent transparent;
    }
}

@media only screen and (max-width: 40.000em) {
    .top-bar-section .has-dropdown>a:after {
        border-color: transparent transparent transparent rgba(51, 51, 51, 0.4);
    }
}

.top-bar-section .dropdown li:not(.has-form) a:not(.button) {
    color: #333333;
    text-decoration: none;
}

.top-bar-section ul li.active>a:hover {
    background: #dbdbdb;
    color: #333333;
}

.top-bar-section li.active:not(.has-form) a:not(.button):hover {
    background: #dbdbdb;
    color: #333333;
}

.top-bar .toggle-topbar.menu-icon a {
    color: #333333;
}

.top-bar .toggle-topbar.menu-icon a>span {
    font-weight: 600;
}

.top-bar .toggle-topbar.menu-icon a span::after {
    box-shadow: 0 0 0 1px #333, 0 7px 0 1px #333, 0 14px 0 1px #333;
}

.top-bar.expanded .title-area {
    background: #f0f0f0;
}

.top-bar-section .dropdown li.title h5 a,
.top-bar-section .dropdown li.parent-link a {
    text-transform: uppercase;
    font-weight: 600;
}

table {
    background: none;
    margin-bottom: 0;
    border: none;
}

table thead,
table tfoot {
    background: none;
}

table thead tr th,
table tfoot tr th {
    text-align: center;
}

dl dt {
    margin-bottom: 0;
}

.headerAllerta {
    padding-left: 15px;
    padding-right: 15px;
    border-bottom: 2px solid #f0f0f0;
    background-color: white;
}

.headerAllerta>h1 {
    font-family: 'Abel', sans-serif;
    letter-spacing: 2px;
    text-align: center;
    margin-bottom: 15px;
    font-size: 110%;
}

.tab-title {
    display: inline-block;
    float: none!important;
    width: 32.45%;
}

.tabs-content {
    background: #fefefe;
    transition: all .5s ease;
    border-top: 0;
    margin-bottom: 0;
}

.tabs-content>.content {
    padding: 0px;
}

.tabs,
.tabs-content {
    text-align: center;
    border-left: 2px solid #efefef;
    border-right: 2px solid #efefef;
    border-bottom: 2px solid #efefef;
}

.tabs-panel {
    display: none;
}

.tabs-panel.is-active {
    display: block;
}

.tabs dd>a,
.tabs .tab-title>a {
    padding: 1.25rem 1.5rem;
    text-decoration: none;
    cursor: pointer;
}

.tabs .tab-title>a {
    background-color: white;
    font-weight: bold;
    font-size: 100%;
    font-family: 'Open Sans', sans-serif;
}

.tabs .tab-title.active a {
    background-color: #f0f0f0;
}

.tab-title>a:focus,
.tab-title>a:hover,
.tab-title>a[aria-selected=true] {
    background: #e6e6e6;
}

.tableCrit {
    table-layout: fixed;
    width: 100%;
}

.tableCrit th {
    padding: 0px;
    background-color: #f0f0f0;
    color: #353535;
}

.tableCrit td {
    padding: 0;
    text-align: center;
    height: 33px;
    font-weight: bold;
}

.oneRowTable {
    table-layout: fixed;
    width: 100%;
}

.oneRowTable td {
    padding: 0;
    text-align: center;
    height: 47px;
    font-weight: bold;
}

.critLeftColumn {
    width: 20%;
    background-color: #f0f0f0;
    color: #353535;
    font-size: 79%;
}

.allertaROSSA {
    background-color: #e00000;
    color: white;
}

.allertaARANCIONE {
    background-color: #ff8c00;
    color: white;
}

.allertaGIALLA {
    background-color: #ffd800;
    color: #353535;
}

.allertaVERDE {
    background-color: #6eba00;
    color: white;
}

.dettaglioMeteoText {
    width: 20%;
    color: #353535;
    font-size: 79%;
    font-weight: bold;
}

.dettaglioMeteoImg {
    margin: 0 auto;
    display: block;
    width: 48px;
    /* width: 33%; */
    height: 47px;
}

.legendaTable {
    /* margin-top: 10px; */
    font-family: 'Abel', sans-serif;
    font-size: 78%;
    font-weight: bold;
    color: #353535;
    font-style: italic;
    cursor: default;
    border-top: 2px solid #efefef;
    text-align: left;
    padding-left: 1%;
}

.formBacini {
    border-bottom: 2px solid #cbcbcb;
    margin-bottom: 15px;
}

@media screen and (max-width: 64em) {
    /* Risoluzione screen Minore di 1024px */
    .tableCrit {
        width: inherit;
    }
    /*.tabs-content>.content {
        height: 350px;
    }*/
}

@media screen and (max-width: 40.063em) {
    .accordion .accordion-navigation>.content,
    .accordion dd>.content {
        padding: 0;
    }
    .tabs,
    .tabs-content {
        border-left: 0;
        border-right: 0;
    }
}

.tableCrit thead td {
    background-color: #f0f0f0;
    color: #353535;
}

.infoScroll {
    position: relative;
    background-color: #f0f0f0;
    color: #353535;
    margin: 2px;
    margin-top: 0px;
    padding: 10px;
    text-align: center;
    font-weight: bold;
    font-size: 90%;
}

.infoScrollImg {
    position: absolute;
    height: 50px;
    width: 38px;
    left: 82%;
    z-index: 1;
    bottom: 18%;
}

table tr.even,
table tr.alt,
table tr:nth-of-type(even) {
    background: #ffffff;
}

@media only screen and (max-width: 40em) {
    /* small */
    .headerAllerta>h1 {
        margin-top: 15px;
    }
    .legendaTable {
        /*margin-bottom: 10px ;*/
        /*padding-left: 1%;*/
    }
}

.tendenceImg {
    width: 30%;
}

.tendenceText {
    text-align: left;
}

.spacer {
    height: 40px;
    border-top: 2px solid #f0f0f0;
}

.otherPhenomenaText {
    color: #353535;
    font-size: 90%;
    white-space: normal;
}


/***********************************
 * Override Stili Responsive Table *
 ***********************************/

.pinned {
    border: none;
}

div .table-wrapper {
    border: none;
    margin-bottom: 0px;
}

.pinned table th,
.pinned table td {
    white-space: normal;
}


/****************************
 * Override stili JQuery UI *
 ****************************/

.ui-widget {
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    font-size: 0.75rem;
    line-height: normal;
}

.ui-widget input,
.ui-widget select,
.ui-widget textarea,
.ui-widget button,
.ui-widget label {
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    font-size: 0.75rem;
    line-height: normal;
    margin-top: 0.1rem;
    margin-bottom: 0.1rem;
}

.ui-widget-content {
    border: 1px solid #cfcfcf;
    background: #f0f0f0;
    color: #333333;
}

.ui-state-focus {
    border: none !important;
    background: #dbdbdb !important;
    color: #333333 !important;
    font-weight: normal !important;
}


/*****************************
 * Override stili Smarticker *
 *****************************/


/* Modifica percorsi delle risorse */

.theme1 .smarticker-cats .left {
    background: url(images/left-flc-w.png) no-repeat right center;
}

.theme1 .smarticker-cats .right {
    background: url(images/right-flc-w.png) no-repeat right center;
}

.theme2 .smarticker-cats .left {
    background: url(images/left-flc-b.png) no-repeat right center;
}

.theme2 .smarticker-cats .right {
    background: url(images/right-flc-b.png) no-repeat right center;
}

.c2 .next-news,
.c2 .next-news:active,
.c2 .next-news:hover {
    background-image: url(images/controller.png);
}

.c2 .prev-news,
.c2 .prev-news:active,
.c2 .prev-news:hover {
    background-image: url(images/controller.png);
}

.c2 .pause-news,
.c2 .pause-news:active,
.c2 .pause-news:hover {
    background-image: url(images/controller1.png);
}

.c2 .play-news,
.c2 .play-news:active,
.c2 .play-news:hover {
    background-image: url(images/controller1.png);
}

.s-rtl.theme2 .smarticker-cats .left {
    background: url(images/right-flc-b-rtl.png) no-repeat left center;
}

.s-rtl.theme2 .smarticker-cats .right {
    background: url(images/left-flc-b-rtl.png) no-repeat left center;
}

.s-rtl.theme1 .smarticker-cats .left {
    background: url(images/right-flc-w-rtl.png) no-repeat left center;
}

.s-rtl.theme1 .smarticker-cats .right {
    background: url(images/left-flc-w-rtl.png) no-repeat left center;
}


/* Aggiunta personalizzazioni della barra */

.smart-controller span,
.smarticker span {
    margin-top: 0px;
    margin-bottom: 0px;
}

.al-news-ticker {
    background: inherit !important;
}

.al-news-ticker a {
    color: #f0f0f0 !important;
    font-weight: bold !important;
}

.al-news-ticker-bar {
    background: #353535 !important;
}

.smarticker-cats .left,
.smarticker-cats .right {
    width: 20px !important;
}

.smarticker-cats .left {
    background: transparent url("images/left-flc-b-plain.png") no-repeat scroll right center !important;
}

.smarticker-cats .right {
    background: transparent url("images/right-flc-b-plain.png") no-repeat scroll right center !important;
}

@media only screen and (max-width: 40.000em) {
    .al-news-ticker .catlist a {
        margin-left: 5px;
        margin-right: 15px;
    }
    .no-category .smarticker-cats .left {
        display: none;
    }
}

@media only screen and (min-width: 40.063em) {
    .al-news-ticker .catlist a {
        margin-left: 15px;
        margin-right: 15px;
    }
    .no-category .smarticker-cats .left {
        display: inline;
    }
}


/****************************
 * Stili per AllertaLiguria *
 ****************************/

#al-header-left {
    padding-left: 0rem;
}

#al-header-right {
    padding-right: 0rem;
}

#al-loghi-header {
    /*    width: 217px;*/
    height: 71px;
}

#al-logo-header-allerta-liguria {
    margin: 5px 0 0 0;
}

#al-logo-header-allerta-liguria-small {
    padding: 0 0 0 0;
}

#al-logo-header-allerta-liguria span {
    font-size: 50px;
    /*text-transform: uppercase;*/
    font-family: 'Abel', sans-serif;
}

#al-logo-header-allerta-liguria-small span {
    font-size: 26px;
    /*text-transform: uppercase;*/
    font-family: 'Abel', sans-serif;
}

#al-logo-header-arpal {
    margin: 0 0 0 15px;
}

#al-logo-header-protezione-civile {
    margin: 0 0 0 15px;
}

#al-logo-header-regione-liguria {
    margin: 0 0 0 0;
}

#al-logo-messaggio-arpal,
.al-logo-messaggio-arpal {
    margin: 0 10px 0 0;
}

#al-logo-messaggio-protezione-civile,
.al-logo-messaggio-protezione-civile {
    margin: 0 10px 0 0;
}

#al-map-liguria-panel {
    border: none;
    /*width: 460px;*/
    /*height: 223px;*/
    margin: 20px 0 40px 0;
    padding: 0.30rem;
}

#al-label-preallerta {
    font-family: 'Open Sans', sans-serif;
    font-weight: 700;
    background-color: #353535;
    border: 2px solid #cbcbcb;
}

#al-label-monitoraggio {
    font-family: 'Open Sans', sans-serif;
    font-weight: 700;
    background-color: #353535;
}

#al-label-container-mappa {
    right: 0px;
    bottom: -30px;
    width: 65%;
}

@media only screen and (max-width: 40.000em) {
    #al-label-preallerta {
        padding: 5px;
    }
    #al-label-monitoraggio {
        padding: 5px;
    }
}

@media only screen and (min-width: 40.063em) {
    #al-label-preallerta {
        padding: 8px;
    }
    #al-label-monitoraggio {
        padding: 8px;
    }
}

#al-label-preallerta h1 {
    color: #ffffff;
}

#al-label-monitoraggio h1 {
    color: #ffffff;
}

@media only screen and (max-width: 40.000em) {
    #al-label-preallerta h1 {
        font-size: 0.688rem;
    }
    #al-label-monitoraggio h1 {
        font-size: 0.688rem;
    }
}

@media only screen and (min-width: 40.063em) and (max-width: 64.000em) {
    #al-label-preallerta h1 {
        font-size: 0.875rem;
    }
    #al-label-monitoraggio h1 {
        font-size: 0.875rem;
    }
}

@media only screen and (min-width: 64.063em) {
    #al-label-preallerta h1 {
        font-size: 1.000rem;
    }
    #al-label-monitoraggio h1 {
        font-size: 1.000rem;
    }
}

.al-button-lightgray {
    background-color: #cbcbcb;
    border-color: #cbcbcb;
    color: #353535;
}

.al-button-lightgray:hover,
.al-button-lightgray:focus {
    background-color: #cbcbcb;
    color: #353535;
}

.al-display-inline {
    display: inline;
}

.al-display-block {
    display: block;
}

.al-display-inline-block {
    display: inline-block;
}

.al-position-top {
    top: 20px;
}

.al-position-bottom {
    bottom: 20px;
}

.al-position-right {
    right: 20px;
}

.al-position-left {
    left: 20px;
}

.al-position-absolute {
    position: absolute;
}

.al-position-relative {
    position: relative;
}

.al-parent-centered {
    display: table;
}

.al-child-centered {
    display: table-cell;
    vertical-align: middle;
}

.al-container {
    overflow: hidden;
}

.al-container-padded {
    overflow: hidden;
    padding: 3px;
}

.al-container-padded-top {
    overflow: hidden;
    padding-top: 3px;
}

.al-container-padded-right {
    overflow: hidden;
    padding-right: 3px;
}

.al-container-padded-bottom {
    overflow: hidden;
    padding-bottom: 3px;
}

.al-container-padded-left {
    overflow: hidden;
    padding-left: 3px;
}

.al-map-panel {
    border: none;
    /*margin: 10px 0 10px 0;*/
    /*padding: 0.30rem;*/
}

.al-table-allerta-rischi-panel {
    border: none;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.al-table-allerta-panel {
    border: none;
    /*margin-top: 10px !important;*/
    margin-bottom: 10px !important;
}

.al-table-rischi-panel {
    border: none;
    /*margin-top: 10px !important;*/
    margin-bottom: 10px !important;
}

.al-table-livelli-allerta-column-titolo {
    width: 30%;
}

.al-table-livelli-allerta-column-descrizione {
    width: 70%;
    float: none !important;
}

.al-legenda-panel {
    border: none;
    margin-bottom: 1.25rem;
    height: 480px;
}

@media only screen and (min-width: 40.063em) {
    min-height: 260px;
}

@media only screen and (max-width: 40.000em) {
    .al-legenda-panel {
        padding-left: 20px;
        padding-right: 20px;
    }
}

.al-legenda-detail-panel {
    border: none;
    /*height: 480px;*/
}

.al-messaggi-panel {
    border: none;
    padding: 20px;
}

@media only screen and (min-width: 40.063em) {
    .al-messaggi-panel {
        min-height: 430px;
    }
}

.al-messaggi-monitoraggio-panel {
    border: none;
    padding: 20px;
}

.al-messaggi-protciv-monitoraggio-panel {
    border: none;
    padding: 20px;
}

.al-messaggi-protciv-monitoraggio-panel h1,
.al-messaggi-protciv-monitoraggio-panel h2,
.al-messaggi-protciv-monitoraggio-panel h3,
.al-messaggi-protciv-monitoraggio-panel h4,
.al-messaggi-protciv-monitoraggio-panel h5,
.al-messaggi-protciv-monitoraggio-panel h6,
.al-messaggi-protciv-monitoraggio-panel p {
    color: #cbcbcb;
    background-color: #353535;
    font-weight: bold;
}

@media only screen and (min-width: 40.063em) {
    .al-messaggi-monitoraggio-panel {
        min-height: 330px;
    }
}

.al-messaggi-panel p,
.al-messaggi-monitoraggio-panel p {
    text-align: justify;
}

.al-standard-panel {
    border: none;
    /*height: 220px;*/
    padding: 10px;
    margin: 10px;
    background-color: #f0f0f0;
}

.al-panel-white {
    border: none;
    background-color: #ffffff;
}

.al-text-header {
    padding: 8px 0 8px 0;
    text-align: center;
    border: none;
    overflow: hidden;
}

.al-table-column-header {
    padding: 4px 3px 8px 3px;
    text-align: center;
    border: none;
    /*background-color: #cbcbcb;*/
    height: 26px;
}

.al-table-row-header {
    padding: 8px 3px 8px 3px;
    text-align: center;
    border: none;
    /*background-color: #cbcbcb;*/
    height: 51px;
}

.al-table-cell {
    padding: 15px 3px 15px 3px;
    text-align: center;
    border: none;
    height: 51px;
}

.al-table-cell-icon {
    padding: 1px 3px 1px 3px;
    text-align: center;
    border: none;
    height: 51px;
}

.al-header {
    /*background: url(../img/temi/background-header.png) #464646;*/
    /*background-size: auto 100%;*/
    height: auto;
    text-align: left;
    position: relative;
    padding: 20px 0 20px 0;
}

.al-navbar {
    background: #f0f0f0;
    padding: 0px 0px;
    height: auto;
}

.al-msgbar-red {
    background: #e00000;
    padding: 5px 15px 5px 15px;
    height: auto;
}

.al-msgbar-red h1,
.al-msgbar-red h2,
.al-msgbar-red h3,
.al-msgbar-red h4,
.al-msgbar-red h5,
.al-msgbar-red h6 {
    color: #ffffff;
}

.al-msgbar-orange {
    background: #ff8c00;
    padding: 5px 15px 5px 15px;
    height: auto;
}

.al-msgbar-orange h1,
.al-msgbar-orange h2,
.al-msgbar-orange h3,
.al-msgbar-orange h4,
.al-msgbar-orange h5,
.al-msgbar-orange h6 {
    color: #ffffff;
}

.al-msgbar-yellow {
    background: #ffd800;
    padding: 5px 15px 5px 15px;
    height: auto;
}

.al-msgbar-yellow h1,
.al-msgbar-yellow h2,
.al-msgbar-yellow h3,
.al-msgbar-yellow h4,
.al-msgbar-yellow h5,
.al-msgbar-yellow h6 {
    color: #3f3f3f;
}

.al-msgbar-green {
    /*background: #1ec713;*/
    background: #6eba00;
    padding: 5px 15px 5px 15px;
    height: auto;
}

.al-msgbar-green h1,
.al-msgbar-green h2,
.al-msgbar-green h3,
.al-msgbar-green h4,
.al-msgbar-green h5,
.al-msgbar-green h6 {
    color: #ffffff;
}

.al-footer-loghi {
    background: #f0f0f0;
    height: auto;
    padding: 24px 0 24px;
}

.al-footer {
    background: #353535;
    /*height: 100px;*/
    padding: 24px 0 24px;
    display: none;
}

.al-footer a {
    color: #cccccc;
    line-height: inherit;
    text-decoration: underline;
}

.al-title {
    font-family: 'Abel', sans-serif;
    font-weight: 700;
    font-size: 2rem;
    /*2.4rem;*/
    text-align: justify;
    color: #353535;
}

.al-subtitle {
    font-family: 'Abel', sans-serif;
    font-weight: 500;
    font-size: 1.4rem;
    text-align: justify;
    color: #353535;
}

.al-subtitle-line {
    width: 100%;
    min-height: 2px;
    background-color: #7b7b7b;
    margin-bottom: 30px;
}

.al-subtitle-small {
    font-family: 'Open Sans', sans-serif;
    font-weight: bold;
    font-size: 0.75rem;
    line-height: normal;
    text-align: justify;
    color: #353535;
    margin-bottom: 20px;
}

.al-paragraph {
    /*//font-family: 'Open Sans', sans-serif;
    //font-weight: 400;
    //font-size: 0.75rem;
    //line-height: normal;*/
    text-align: justify;
    /*color: #353535;
    //margin-top: 20px;*/
    margin-bottom: 20px;
    /*hyphens: auto;*/
}

.al-message-big {
    font-family: 'Abel', sans-serif;
    font-weight: 500;
    font-size: 1.4rem;
    color: #353535;
    font-weight: bold;
}

.al-box-immagine {
    text-align: center;
    margin-bottom: 30px;
}

.al-box-immagine>p {
    font-size: 0.625em;
    margin-top: 7px;
    /*margin-bottom: 30px;*/
}

.al-chapter-section {
    padding-top: 30px;
    padding-bottom: 30px;
}

.al-chapter-section:nth-child(even) {
    background: #e5e5e5;
}

.al-title-section {
    margin-top: 40px;
    margin-bottom: 30px;
}

.al-color-white {
    color: #ffffff;
}

.al-color-lightgray {
    color: #f0f0f0;
}

.al-color-gray {
    color: #cbcbcb;
}

.al-color-darkgray {
    color: #7b7b7b;
}

.al-color-verydarkgray {
    color: #353535;
}

.al-color-black {
    color: #000000;
}

.al-background-white {
    background: #ffffff;
}

.al-background-lightgray {
    background-color: #f0f0f0;
}

.al-background-gray {
    background-color: #cbcbcb;
}

.al-background-darkgray {
    background-color: #7b7b7b;
}

.al-background-verydarkgray {
    background: #353535;
}

.al-background-black {
    background: #000000;
}

.al-background-table {
    background: #ffffff;
}

.al-background-allerta-green {
    /*background: #1ec713;*/
    background: #6eba00;
}

.al-background-allerta-yellow {
    background: #ffd800;
}

.al-background-allerta-orange {
    background: #ff8c00;
}

.al-background-allerta-red {
    background: #e00000;
}

.al-background-allerta-lightgray {
    background: #f0f0f0;
}

.al-background-allerta-green p,
.al-background-allerta-red p,
.al-background-allerta-orange p {
    font-weight: 700;
    font-size: 0.688rem;
    color: #ffffff;
}

.al-background-allerta-yellow p {
    font-weight: 700;
    font-size: 0.688rem;
    color: #3f3f3f;
}

.al-background-allerta-lightgray p {
    font-weight: 700;
    font-size: 0.688rem;
    color: #52a953;
}

.al-background-allerta-green h6,
.al-background-allerta-red h6,
.al-background-allerta-orange h6 {
    font-weight: 700;
    color: #ffffff;
}

.al-background-allerta-yellow h6 {
    font-weight: 700;
    color: #3f3f3f;
}

.al-background-allerta-lightgray h6 {
    font-weight: 700;
    color: #6eba00;
}

@media only screen and (min-width: 40.063em) {
    #al-omirl-online {
        max-height: 300px;
    }
}

@media only screen and (min-width: 40.063em) {
    #al-tabelle-riassuntive {
        max-height: 300px;
    }
}

#al-nubi-sat-infrarosso {
    max-height: 363px;
}

#al-nubi-sat-visibile {
    max-height: 363px;
}

#al-radar-pioggia {
    max-height: 367px;
}

#al-mappa-pioggia {
    max-height: 367px;
}

#al-mappa-temperature {
    max-height: 343px;
}

#al-mappa-fulmini {
    max-height: 343px;
}

.al-width-100-pct {
    width: 100%;
}

.al-width-90-pct {
    width: 90%;
}

.al-width-85-pct {
    width: 85%;
}

.al-width-80-pct {
    width: 80%;
}

.al-width-70-pct {
    width: 70%;
}

.al-width-60-pct {
    width: 60%;
}

.al-width-50-pct {
    width: 50%;
}

.al-width-40-pct {
    width: 40%;
}

.al-width-35-pct {
    width: 35%;
}

.al-width-33-pct {
    width: 33.33%;
}

.al-width-30-pct {
    width: 30%;
}

.al-width-25-pct {
    width: 25%;
}

.al-width-20-pct {
    width: 20%;
}

.al-width-15-pct {
    width: 15%;
}

.al-width-10-pct {
    width: 10%;
}

.al-text-horz-center {
    text-align: center;
}

.al-text-justify {
    text-align: justify;
}

.al-text-left {
    text-align: left;
}

.al-text-right {
    text-align: right;
}

.al-text-bold {
    font-weight: bold;
}

.al-text-normal {
    font-weight: normal;
}

.al-text-underline {
    text-decoration: underline;
}

.al-text-italic {
    font-style: italic;
}

.al-combo-selezione {
    font-weight: bold;
    padding: 0px 0px;
    height: 25px;
    margin-top: 5px;
    font-size: 11px;
}

.al-footer-filler {
    width: 100%;
    height: 72px;
}

.al-footer-sticky {
    position: fixed;
    bottom: 0;
    width: 100%;
    background: url(../img/temi/background-footer-wip.png);
    height: 72px;
}


/* Accordion livelli allerta legenda */

.al-accordion-legenda-elem-header {
    font-size: 1em;
    padding: 1px;
    margin: 0 5px 0 5px;
    display: inline-block;
}

.accordion .content.active.al-accordion-legenda-elem-body {
    background-color: #ffffff;
    border: 0;
    padding: 0;
}

.al-accordion-legenda p.al-descrizione-allerta {
    text-align: justify;
    margin: 0 5px 0 5px;
    line-height: 12px;
}

.al-accordion-legenda div.al-livello-allerta {
    border-bottom: 1px solid #f0f0f0;
    padding-top: 2px;
    padding-bottom: 2px;
}

.al-accordion-legenda .accordion dd>a::after {
    content: "espandi +";
    font-size: 0.750rem;
    font-style: italic;
    float: right;
    padding: 3px 5px 3px 5px;
}

.al-accordion-legenda .accordion dd.active>a::after {
    content: "nascondi -";
    font-size: 0.750rem;
    font-style: italic;
    float: right;
    padding: 3px 5px 3px 5px;
}


/* Accordion dettaglio zone */

.al-accordion-zone-header {
    /*display: inline-block;*/
    height: 69px;
}

.al-accordion-zone-panel>dl.accordion>dd>a>div.al-background-allerta-lightgray::after {
    content: "espandi +";
    font-style: italic;
    float: right;
    color: #7b7b7b;
}

.al-accordion-zone-panel>dl.accordion>dd.active>a>div.al-background-allerta-lightgray::after {
    content: "nascondi -";
    font-style: italic;
    float: right;
    color: #7b7b7b;
}

.al-accordion-zone-panel>dl.accordion>dd>a>div::after {
    content: "espandi +";
    font-style: italic;
    float: right;
    color: #ffffff;
}

.al-accordion-zone-panel>dl.accordion>dd.active>a>div::after {
    content: "nascondi -";
    font-style: italic;
    float: right;
    color: #ffffff;
}

@media only screen and (min-width: 40.063em) {
    .al-accordion-zone-panel>dl.accordion>dd>a>div::after {
        font-size: 1.300rem;
        padding: 18px 10px 18px 10px;
    }
    .al-accordion-zone-panel>dl.accordion>dd.active>a>div::after {
        font-size: 1.300rem;
        padding: 18px 10px 18px 10px;
    }
}

@media only screen and (max-width: 40.000em) {
    .al-accordion-zone-panel>dl.accordion>dd>a>div::after {
        font-size: 0.800rem;
        padding: 26px 10px 26px 10px;
    }
    .al-accordion-zone-panel>dl.accordion>dd.active>a>div::after {
        font-size: 0.800rem;
        padding: 26px 10px 26px 10px;
    }
}

.al-accordion-zone-header-image {
    height: 69px;
    width: 120px;
    padding-left: 4px;
    padding-right: 2px;
    background-color: #7b7b7b;
    /*#cbcbcb;*/
}

@media only screen and (min-width: 40.063em) {
    .al-dettaglio-idro-zona-panel {
        min-height: 158px;
    }
}

@media only screen and (min-width: 40.063em) {
    .al-dettaglio-nivo-zona-panel {
        min-height: 158px;
    }
}

.al-accordion-zone-header-title-zona {
    height: 69px;
    width: 35px;
    padding-left: 2px;
    padding-right: 4px;
    background-color: #7b7b7b;
    /*#cbcbcb;*/
}

.al-accordion-zone-header-title-cod-zona {
    height: 69px;
    width: 35px;
    padding-left: 2px;
    padding-right: 4px;
    background-color: #7b7b7b;
    /*#cbcbcb;*/
}

.al-accordion-zone-header-title-small {
    height: 69px;
    width: 45px;
    padding-left: 2px;
    padding-right: 4px;
    background-color: #7b7b7b;
    /*#cbcbcb;*/
    text-align: center;
}

.al-accordion-zone-header-message {
    height: 69px;
    padding-left: 15px;
    padding-right: 5px;
}

@media only screen and (max-width: 40.000em) {
    .al-accordion-zone-header-message-font-size {
        font-size: 1em;
    }
}

@media only screen and (min-width: 40.063em) {
    .al-accordion-zone-header-message-font-size {
        font-size: 1.25em;
    }
}

.al-accordion-zone-subheader-image {
    height: 60px;
    width: 55px;
    padding-left: 2px;
    padding-right: 1px;
    /*background-color: #cbcbcb;*/
}

.al-accordion-zone-subheader-title {
    height: 60px;
    width: 58px;
    padding-left: 1px;
    padding-right: 1px;
    /*background-color: #cbcbcb;*/
}

.al-accordion-zone-subheader-icon {
    height: 60px;
    width: 60px;
    padding-left: 20px;
    /*padding-right: 4px;*/
    /*background-color: #cbcbcb;*/
}

.al-accordion-zone-subheader-message {
    height: 60px;
    /*width: 58px;*/
    /*padding-left: 5px;*/
    /*padding-right: 2px;*/
}

.al-accordion-zone-panel {
    border: none;
    background-color: #ffffff;
    margin-top: 20px;
    margin-bottom: 15px;
}


/* Tabelle */

.al-border-allerta-green {
    border: 1px solid #6eba00;
}

.al-border-allerta-yellow {
    border: 1px solid #ffd800;
}

.al-border-allerta-orange {
    border: 1px solid #ff8c00;
}

.al-border-allerta-red {
    border: 1px solid #e00000;
}

.al-datagrid {
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    font-size: 0.75rem;
    background: #fff;
    overflow: hidden;
    /*border: 1px solid;*/
    /*border-color: #e00000;*/
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    margin-bottom: 2em;
}

.al-datagrid table {
    border-collapse: collapse;
    text-align: left;
    width: 100%;
}

.al-datagrid table tr {
    vertical-align: top;
}

.al-datagrid table thead th:first-child {
    border: none;
}

.al-datagrid table thead th {
    /*background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #E00000), color-stop(1, #E00000) );*/
    /*background: -moz-linear-gradient( center top, #E00000 5%, #E00000 100% );*/
    /*filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#E00000', endColorstr='#E00000');*/
    /*background-color: #E00000;*/
    /*color: #ffffff;*/
    font-size: 15px;
    font-weight: bold;
}

.al-datagrid table td,
.al-datagrid table th {
    padding: 10px;
}

.al-datagrid table tbody {
    text-align: justify;
}

.al-datagrid table tbody td:first-child {
    border-left: none;
}

.al-datagrid table tbody .alt td {
    background: #ededed;
}

.al-datagrid table tbody td {
    font-size: 12px;
    font-weight: normal;
}

.al-border-allerta-green table thead th {
    background-color: #6eba00;
    color: #ffffff;
}

.al-border-allerta-yellow table thead th {
    background-color: #ffd800;
    color: #3f3f3f;
}

.al-border-allerta-orange table thead th {
    background-color: #ff8c00;
    color: #ffffff;
}

.al-border-allerta-red table thead th {
    background-color: #e00000;
    color: #ffffff;
}

.al-no-border {
    border: none;
}

.al-no-padding {
    padding: 0;
}


/*
 * Stile utilizzato per spostare verso il basso un elemento HTML con un div ad
 * altezza fissa. Nello specifico, abbinato alla proprietà position: absolute
 * nell'elemento figlio e alla proprietà position: relative nell'elemento
 * parent, consente di creare un div di riferimento sopra un eventuale altro
 * elemento HTML, in modo che l'elemento stesso non venga coperto dallo sticky
 * menu in alto (classe valida solo per risoluzioni dalla medium in su).
 */

@media only screen and (min-width: 40.063em) {
    .al-offset-down {
        /*background-color:  red;*/
        height: 45px;
        width: 0px;
        /* la larghezza non serve, è importante l'altezza */
        top: -45px;
    }
}


/* Varie */

.al-component-hidden {
    display: none;
}


/* SG MOD */

.modal {
    position: fixed;
    bottom: 10px;
    width: 90vw;
    background: #271451;
    margin: 10px 5vw;
    color: white;
    border: 1px solid lightgray;
}

.modal a {
    background: #5b7aaa;
    color: white;
    padding: 10px;
    text-decoration: none;
    border: 1px solid lightgray;
    display: block;
    float: right;
    margin: 0px 4px;
}

.divbuttoncookie {
    float: right;
}

.privacylink {
    float: right;
    padding: 0px 20px;
    color: black;
    font-weight: normal;
    text-decoration: none;
    font-size: 12px;
    clear: both;
}

.divtextcookie {
    float: left;
    margin: 10px;
}