/* color-schema: https://coolors.co/13293d-006494-247ba0-1b98e0-e8f1f2 
font weight: 100, 300, 400, 700
condensed: 300,400,700


<a style="background-color:black;color:white;text-decoration:none;padding:4px 6px;font-family:-apple-system, BlinkMacSystemFont, &quot;San Francisco&quot;, &quot;Helvetica Neue&quot;, Helvetica, Ubuntu, Roboto, Noto, &quot;Segoe UI&quot;, Arial, sans-serif;font-size:12px;font-weight:bold;line-height:1.2;display:inline-block;border-radius:3px" href="https://unsplash.com/@samferrara?utm_medium=referral&amp;utm_campaign=photographer-credit&amp;utm_content=creditBadge" target="_blank" rel="noopener noreferrer" title="Download free do whatever you want high-resolution photos from Samuel Ferrara"><span style="display:inline-block;padding:2px 3px"><svg xmlns="http://www.w3.org/2000/svg" style="height:12px;width:auto;position:relative;vertical-align:middle;top:-2px;fill:white" viewBox="0 0 32 32"><title>unsplash-logo</title><path d="M10 9V0h12v9H10zm12 5h10v18H0V14h10v9h12v-9z"></path></svg></span><span style="display:inline-block;padding:2px 3px">Samuel Ferrara</span></a><a style="background-color:black;color:white;text-decoration:none;padding:4px 6px;font-family:-apple-system, BlinkMacSystemFont, &quot;San Francisco&quot;, &quot;Helvetica Neue&quot;, Helvetica, Ubuntu, Roboto, Noto, &quot;Segoe UI&quot;, Arial, sans-serif;font-size:12px;font-weight:bold;line-height:1.2;display:inline-block;border-radius:3px" href="https://unsplash.com/@samferrara?utm_medium=referral&amp;utm_campaign=photographer-credit&amp;utm_content=creditBadge" target="_blank" rel="noopener noreferrer" title="Download free do whatever you want high-resolution photos from Samuel Ferrara"><span style="display:inline-block;padding:2px 3px"><svg xmlns="http://www.w3.org/2000/svg" style="height:12px;width:auto;position:relative;vertical-align:middle;top:-2px;fill:white" viewBox="0 0 32 32"><title>unsplash-logo</title><path d="M10 9V0h12v9H10zm12 5h10v18H0V14h10v9h12v-9z"></path></svg></span><span style="display:inline-block;padding:2px 3px">Samuel Ferrara</span></a>
*/

* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    outline: none;
    margin: 0;
    padding: 0;
    font-family: 'Roboto', sans-serif;
    /* color: #0D1B27; */
}

a, a:hover, a:active, a:visited {
    text-decoration: none;
    color: inherit;
}

.l-box {
    padding: 1em;
}

.fullscreen {
    min-height: 100vh;
}

.wrapper {
    margin: 0 auto;
    padding: 0 2em;
    width: 100%;
    max-width: 1200px;
    margin-top: 7rem;
    margin-bottom: 7rem;
    line-height: 1.6em;
    /* color: #0D1B27; */
}

.inverse {
    background-color: #D4D8DB;
}

.inverse_dark {
    background-color: #13293D;
    color: #E8F1F2;
}

.inverse_dark .heading:after {
    background: #E8F1F2;
}

.inverse_dark h2 {
    color: #E8F1F2;
}

.text-section {
    font-size: 1.3rem;
    font-weight: 300;
    line-height: 2rem;
}

.text-section:first-child {
    margin-top: 1rem;
}

.text-section:not(:last-child) {
    padding-bottom: 1rem;
}

#home .background {
    background-image: url('/res/img/background/cervino_320.jpg');
    background-size: cover;
    background-position: center;
    overflow: hidden;
    background-attachment: fixed;
}
@media (min-width: 1601px) {
    #home .background {
        background-image: url('/res/img/background/cervino_hres.jpg');
    }
} 
@media (min-width: 1281px) and (max-width: 1600px) {
    #home .background {
        background-image: url('/res/img/background/cervino_1600.jpg');
    }
}
@media (min-width: 1025px) and (max-width: 1280px) {
    #home .background {
        background-image: url('/res/img/background/cervino_1280.jpg');
    }
}
@media (min-width: 768px) and (max-width: 1024px) {
    #home .background {
        background-image: url('/res/img/background/cervino_1024.jpg');
    }
}
@media (min-width: 481px) and (max-width: 767px) {
    #home .background {
        background-image: url('/res/img/background/cervino_768.jpg');
    }
}
@media (min-width: 320px) and (max-width: 480px) {
    #home .background {
        background-image: url('/res/img/background/cervino_480.jpg');
    }
}

.intro {
    padding: 5rem 8rem 8rem 5rem;
}

.intro .citazione {
    font-weight: 300;
    line-height: 3rem;
}

.intro .box-citazione {
    text-align: right;
}

.intro h1, .intro h2, .intro h3, .intro h4 {
    font-family: 'Roboto Condensed', sans-serif;
    color: #E8F1F2;
    text-shadow: 0 0 10px #3D4F60;
}

.intro h4 {
    padding-top: 1.5rem;
    font-weight: 300;
    text-transform: uppercase;
}

.intro .go {
    width: 64px;
    position: absolute;
    bottom: 20px;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    color: rgba(136, 140, 143, 0.5);
    cursor: pointer;
}

@media (max-width: 991px) {
    .intro {
        padding: .8rem 2rem .8rem .8rem;
    }
    .intro .citazione {
    font-weight: 300;
    line-height: 2rem;
    }
    .intro h1 {
        font-size: 2rem;
    }
    .intro h2 {
        font-size: 1.5rem;
    }
    .intro h3 {
        font-size: 1rem;
    }
    .intro h4 {
        font-size: 1rem;
    }
}

h1 {
    font-size: 3rem;
}

h2 {
    font-size: 2.5rem;
}

h3 {
    font-size: 2rem;
}

h4 {
    font-size: 1.5rem;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    line-height: 2.5rem;
    color: #13293D;
}

.heading {
  margin-bottom: 1rem;
  letter-spacing: .3rem;
}

.heading:after {
  content: " ";
  display: block;
  width: 100px;
  height: 2px;
  margin: 20px 0 20px;
  background: #0D1B27;
}

.text-section p {
    font-size: 1rem;
    margin-bottom: 1.5rem;
    line-height: 1.4rem;
}

#lamontagna a {
    font-weight: 300;
    font-size: 1rem;
}

#lamontagna .linkcit {
    padding-top: 2rem;
}

#citazioni blockquote:first-of-type {
    margin-top: 3rem;
}

#citazioni blockquote {
    font-weight: 300;
    font-size: 1.2rem;
    line-height: 1.6rem;
    padding-bottom: 2rem;
}

@media (max-width: 480px) {
    #citazioni blockquote {
        font-size: 1rem;
        line-height: 1.3rem;
    }
}

#citazioni blockquote p {
    padding-bottom: 0.5rem;
    
    
}

#citazioni blockquote p::before {
    content: '\201C';
}

#citazioni blockquote p::after {
    content: '\201D';
}

#citazioni blockquote footer {
    text-transform: uppercase;
}

.text-section ul.list_abc {
    margin-left: 2rem;
    padding: 0;
    font-size: 1rem;
    list-style-type: lower-alpha;
    list-style-position: outside;
}

.text-section a {
    font-weight: 400;
}

.text-section a:hover {
    text-decoration: underline;
}

#consigli .text-section {
    font-size: 1.2rem;
}

.footer {
    display: flex;
    flex-flow: column wrap;
    justify-content: space-around;
    align-items: center;
    padding: 0.5rem;
    background-color: #000000;
    color: #E8F1F2;
    font-size: 80%;
}

.footer a:hover {
    text-decoration: underline;
}

@media (min-width: 991px) {
    .footer {
        flex-flow: row;
        justify-content: space-between;
        padding-left: 2rem;
        padding-right: 2rem;
    }
}

@media (max-width: 991px) {
    .footer div:first-child {
        margin-bottom: 8px;
    }
}

@media (max-width: 991px) {
    .footer div {
        text-align: center;
    }
    .footer .shiny {
    padding-right: 0;
    text-align: center;
    }
}

/* NAV BAR MENU */

#menu_mobile .brand {
    text-align: center;
    color: #E8F1F2;
    font-weight: 700;
    letter-spacing: 0.5rem;
    margin-right: -0.5rem;
    padding-top: 0.1rem;
}

#menu_mobile .pure-menu {
    text-align: center;
}

#menu_mobile .pure-menu-item {
    padding: 0;
}

#menu_mobile .pure-menu-item .pure-menu-link {
    padding: 0.3rem;
}

.custom-wrapper {
    background-color: #006494;
    margin-bottom: 1em;
    -webkit-font-smoothing: antialiased;
    height: 3.1em;
    overflow: hidden;
    -webkit-transition: height 0.5s;
    -moz-transition: height 0.5s;
    -ms-transition: height 0.5s;
    transition: height 0.5s;
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 100;
}

#menu_mobile.custom-wrapper {
    height: 4.1em !important;
}

.custom-menu-3 {
    text-align: right;
}

.pure-menu-item {
padding: 0.5rem 0;
}

.pure-menu-item .pure-menu-link {
    color: #E8F1F2;
}

.pure-menu-active > .pure-menu-link,
.pure-menu-link:hover,
.pure-menu-link:focus {
    background-color: #1B98E0;
}

/* end NAV BAR MENU */

/* IMAGES */

.rounded {
    border-radius: 50%;
    max-width: 100%;
    height: auto;
    display: block;
}

@media (max-width: 480px) {
    .rounded {
        display: none;
    }
}

.centered {
    display: block;
    margin: 0 auto;
}

.inbox {
    width: 100%;
}

/* OVERLAY */

.box-overlay {
    position: relative;
    background-repeat: no-repeat;
    background-size: contain;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    width: 100%;
    height: 25rem;
    border-radius: 15px;
}

.content-overlay {
    width: 100%;
    height: 100%;
    position: relative;
    pointer-events : none;
}

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

.icon-mid {
    position: absolute;
    right: 15px;
    bottom: 3px;
}

.icon-mid > img {
    width: 40%;
    filter: invert(14%) sepia(10%) saturate(2927%) hue-rotate(167deg) brightness(94%) contrast(97%);
}

.icon-min {
    position: absolute;
    right: 7px;
    top: 2px;
}

.icon-min > img {
    width: 20%;
    filter: invert(96%) sepia(1%) saturate(1%) hue-rotate(260deg) brightness(118%) contrast(74%);
}

.title-overlay {
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    position: relative;
    height: 6rem;
    line-height: 6rem;
    text-align: center;
}

.title-overlay h3 {
    color: #fff; 
    display: inline-block;
    vertical-align: middle;
    line-height: normal;
}


.footer-overlay {
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    position: absolute;
    bottom: 0;
    width: 100%;
    padding: 0.5rem;
    text-align: center;
    background-color: rgba(232,241,242, 0.5);
}

.footer-overlay h4 {
    line-height: 1.4rem;
    color: #13293D;
}

.content-overlay h3, .content-overlay h4 {
    font-family: 'Roboto Condensed', sans-serif;
}

@media (max-width: 991px) {
    .title-overlay h3 {
        font-size: 1.8rem;
    }
}
/* BOX SHADOW */

.shadow {
    padding: 0;
    box-shadow: 0px 5px 20px 0px rgba(0,0,0,0.5);
    margin: 0px 6px 0px 6px;
}

.anchor-overlay:hover .shadow {
    box-shadow: 0px 5px 20px 0px #006494;
}

/* BADGE */

.badge {
    display: inline-block;
    margin-left: 0.4rem;
    border-radius: 50%;
    width: 1.5rem;
    height: 1.5rem;
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 0.7rem;
    background: #E8F1F2;
    color: #0D1B27;
    text-align: center;
}

/* FILTERIZR */

.filtr-menu {
    display: inline;
    justify-content: left;
    padding: 0.15rem;
}

.filtr-menu .pure-menu-link {
    display: flex;
    justify-content: space-between;
    border: #00A8E8 1px solid;
    color: #0D1B27;
    border-radius: 5px;
}

.filtr-menu.pure-menu-horizontal .pure-menu-link {
    padding: 0.5rem;
}

.filtr-menu ul {
    width: 100%;
}

.filtr-menu ul li {
    padding: 0.28rem;
    cursor: pointer;
    font-size: 0.9rem;
    font-weight: 400;
}

.filtr-menu.pure-menu-horizontal ul li {
    width: 16.3%;
}

.filtr-item {
    display: inline-flex;
    vertical-align: top;
    padding: 7px;
    cursor: pointer;
}

.filtr-item:hover .filtr-desc {
    color: #13293D;
}

.filtr-item:hover .filtr-desc {
    background-color: rgba(232,241,242, 0.8);
}

.filtr-item:hover .icon-min > img {
    filter: invert(15%) sepia(11%) saturate(2421%) hue-rotate(168deg) brightness(91%) contrast(99%);
}
.filtr-desc {
    position: relative;
    width: 100%;
    color: #E8F1F2;
    text-transform: uppercase;
    padding: 5px 5px;
    background-color: rgba(0,100,148,0.5);
    border-radius: 5px;
    z-index: 1;
    text-align: center;
    text-align: -webkit-center;
    font-family: 'Roboto Condensed', sans-serif;
    font-size: 0.9rem;
    font-weight: 700;
    line-height: 1.2rem;
}

.filtr-desc.top {
    padding: 2px 2px;
    font-size: 0.7rem;
    position: absolute;
    top: 0;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

.filtr-desc.bottom {
    position: absolute;
    bottom: 0;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.filtr-img {
    position: relative;
    /* padding: 0rem; */
    width: 170px;
    height: 170px;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: cover;
    border-style: none;
    border-radius: 5px;
}
@media (max-width: 991px) {
    .filtr-img {
        width: 133px;
        height: 133px;
    }
    .filtr-desc {
        padding: 0.1rem;
        font-size: 0.7rem;
    }
  }

  /* TABLE */

.pure-table {
    border: none;
}

.pure-table tr:not(:last-child) {
    border-bottom: 1px solid #D3DCDC ;
}

.pure-table td, .pure-table th {
    border-bottom: none;
}

.pure-table th {
    text-align: left;
}

/* waterfall */

.waterfall {
    background-color: #f2f2f2;
    padding: 0;
    width: 100%;
    height: auto;
    margin: 0 auto;
    visibility: visible;
}

.waterfall .item {
    text-align: center;
    display: inline-block;
    font-size: 40px;
    color: #FFF;
    width: 25%;
    -webkit-animation: anim .8s ease-in-out;
    animation: anim .8s ease-in-out;
}

.waterfall .item img {
    width:  100%;
    height: auto;
}

/* METEO */

.weather_container {
    width: 100%;
    border: 1px solid #9a9a9a;
}

.weather_container .section {
    padding: 0.3rem;
}


.weather_container .section span, .weather_container .section i {
    margin-right: 0.5rem;
}

.weather_container .date {
    background-color: #247BA0;
    font-weight: 700;
    color: #E8F1F2;

}

.weather_container .location, .weather_container .description, .weather_container .condition {
    text-align: center;
}

.weather_container .condition {
    font-size: 3rem;
}

.weather_container .data_cnt {
    display: flex;
    justify-content: space-between;
    background-color: #9a9a9a;
}

.weather_container .data {
    font-size: 0.7rem;
}

.weather_container .data .wi {
    font-size: 1rem;
}
/* End Meteo */