@font-face {
  font-family: 'Roboto Condensed';
  src: url('css/fonts/roboto-condensed-latin.woff2') format('woff2');
  font-weight: 200 600;
  font-style: normal;
  font-display: swap;
}

/* Relooad: griglia responsive autonoma a 12 colonne.
   Esempio: .container > .row > .col-12.col-md-6
   Mobile: .col-12; da 768px: .col-md-6 (due colonne).
   .col distribuisce lo spazio in parti uguali; oltre 12 unita si va a capo.
   sm: 576px | md: 768px | lg: 992px | xl: 1200px.
   Spazio colonne: --gutter (24px predefiniti); .g-0 lo azzera.
   Nessuna dipendenza da JavaScript o altri CSS. Font locale WOFF2. */

.container,.container-fluid{box-sizing:border-box;width:100%;margin-right:auto;margin-left:auto;padding-right:12px;padding-left:12px}
.container{max-width:1200px}
.row{--gutter:24px;display:flex;flex-wrap:wrap;row-gap:var(--gutter);margin-right:calc(var(--gutter)/-2);margin-left:calc(var(--gutter)/-2)}
.row>*{box-sizing:border-box;flex-shrink:0;width:100%;max-width:100%;min-width:0;padding-right:calc(var(--gutter)/2);padding-left:calc(var(--gutter)/2)}
.row img,.row video{max-width:100%;height:auto}
.col{flex:1 0 0%;width:auto;min-width:8.33333333%}
.g-0{--gutter:0px}
.align-items-start{align-items:flex-start}
.align-items-center{align-items:center}
.align-items-end{align-items:flex-end}
.justify-content-start{justify-content:flex-start}
.justify-content-center{justify-content:center}
.justify-content-end{justify-content:flex-end}

.col-1{flex:0 0 auto;width:8.33333333%}
.col-2{flex:0 0 auto;width:16.66666667%}
.col-3{flex:0 0 auto;width:25%}
.col-4{flex:0 0 auto;width:33.33333333%}
.col-5{flex:0 0 auto;width:41.66666667%}
.col-6{flex:0 0 auto;width:50%}
.col-7{flex:0 0 auto;width:58.33333333%}
.col-8{flex:0 0 auto;width:66.66666667%}
.col-9{flex:0 0 auto;width:75%}
.col-10{flex:0 0 auto;width:83.33333333%}
.col-11{flex:0 0 auto;width:91.66666667%}
.col-12{flex:0 0 auto;width:100%}

@media(min-width:576px){
.col-sm{flex:1 0 0%;width:auto;min-width:8.33333333%}
.col-sm-1{flex:0 0 auto;width:8.33333333%}
.col-sm-2{flex:0 0 auto;width:16.66666667%}
.col-sm-3{flex:0 0 auto;width:25%}
.col-sm-4{flex:0 0 auto;width:33.33333333%}
.col-sm-5{flex:0 0 auto;width:41.66666667%}
.col-sm-6{flex:0 0 auto;width:50%}
.col-sm-7{flex:0 0 auto;width:58.33333333%}
.col-sm-8{flex:0 0 auto;width:66.66666667%}
.col-sm-9{flex:0 0 auto;width:75%}
.col-sm-10{flex:0 0 auto;width:83.33333333%}
.col-sm-11{flex:0 0 auto;width:91.66666667%}
.col-sm-12{flex:0 0 auto;width:100%}
}

@media(min-width:768px){
.col-md{flex:1 0 0%;width:auto;min-width:8.33333333%}
.col-md-1{flex:0 0 auto;width:8.33333333%}
.col-md-2{flex:0 0 auto;width:16.66666667%}
.col-md-3{flex:0 0 auto;width:25%}
.col-md-4{flex:0 0 auto;width:33.33333333%}
.col-md-5{flex:0 0 auto;width:41.66666667%}
.col-md-6{flex:0 0 auto;width:50%}
.col-md-7{flex:0 0 auto;width:58.33333333%}
.col-md-8{flex:0 0 auto;width:66.66666667%}
.col-md-9{flex:0 0 auto;width:75%}
.col-md-10{flex:0 0 auto;width:83.33333333%}
.col-md-11{flex:0 0 auto;width:91.66666667%}
.col-md-12{flex:0 0 auto;width:100%}
}

@media(min-width:992px){
.col-lg{flex:1 0 0%;width:auto;min-width:8.33333333%}
.col-lg-1{flex:0 0 auto;width:8.33333333%}
.col-lg-2{flex:0 0 auto;width:16.66666667%}
.col-lg-3{flex:0 0 auto;width:25%}
.col-lg-4{flex:0 0 auto;width:33.33333333%}
.col-lg-5{flex:0 0 auto;width:41.66666667%}
.col-lg-6{flex:0 0 auto;width:50%}
.col-lg-7{flex:0 0 auto;width:58.33333333%}
.col-lg-8{flex:0 0 auto;width:66.66666667%}
.col-lg-9{flex:0 0 auto;width:75%}
.col-lg-10{flex:0 0 auto;width:83.33333333%}
.col-lg-11{flex:0 0 auto;width:91.66666667%}
.col-lg-12{flex:0 0 auto;width:100%}
}

@media(min-width:1200px){
.col-xl{flex:1 0 0%;width:auto;min-width:8.33333333%}
.col-xl-1{flex:0 0 auto;width:8.33333333%}
.col-xl-2{flex:0 0 auto;width:16.66666667%}
.col-xl-3{flex:0 0 auto;width:25%}
.col-xl-4{flex:0 0 auto;width:33.33333333%}
.col-xl-5{flex:0 0 auto;width:41.66666667%}
.col-xl-6{flex:0 0 auto;width:50%}
.col-xl-7{flex:0 0 auto;width:58.33333333%}
.col-xl-8{flex:0 0 auto;width:66.66666667%}
.col-xl-9{flex:0 0 auto;width:75%}
.col-xl-10{flex:0 0 auto;width:83.33333333%}
.col-xl-11{flex:0 0 auto;width:91.66666667%}
.col-xl-12{flex:0 0 auto;width:100%}
}
