/*.container {
	margin: auto;
}*/
.blocco {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  align-items: center;
  -webkit-align-items: center;
  -ms-align-items: center;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  flex-direction: column;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  justify-content: center;
  -webkit-justify-content: center;
  -ms-justify-content: center; }
  .blocco.row {
    flex-direction: row;
    -webkit-flex-direction: row;
    -ms-flex-direction: row; }
  .blocco .darker {
    background-color: rgba(0, 0, 0, 0.4);
    color: #fff;
    width: 100%;
    height: auto;
    min-height: inherit;
    padding: 24px;
    transition: background-color 0.2s; }
  .blocco .darker:hover {
    background-color: transparent; }
  .blocco.stretch {
    align-items: stretch; }

.h10 {
  height: auto;
  min-height: 10vh; }

.h20 {
  height: auto;
  min-height: 20vh; }

.h30 {
  height: auto;
  min-height: 30vh; }

.h40 {
  height: auto;
  min-height: 40vh; }

.h50 {
  height: auto;
  min-height: 50vh; }

.h60 {
  height: auto;
  min-height: 60vh; }

.h70 {
  height: auto;
  min-height: 70vh; }

.h80 {
  height: auto;
  min-height: 80vh; }

.h90 {
  height: auto;
  min-height: 90vh; }

.h100 {
  height: auto;
  min-height: 100vh; }

.w10 {
  width: 10%;
  float: left;
  margin: 0; }

.w20 {
  width: 20%;
  float: left;
  margin: 0; }

.w30 {
  width: 30%;
  float: left;
  margin: 0; }

.w40 {
  width: 40%;
  float: left;
  margin: 0; }

.w50 {
  width: 50%;
  float: left;
  margin: 0; }

.w60 {
  width: 60%;
  float: left;
  margin: 0; }

.w70 {
  width: 70%;
  float: left;
  margin: 0; }

.w80 {
  width: 80%;
  float: left;
  margin: 0; }

.w90 {
  width: 90%;
  float: left;
  margin: 0; }

.w100 {
  width: 100%;
  float: left;
  margin: 0; }

.w1 {
  width: 8.33%;
  float: left;
  margin: 0; }

.w2 {
  width: 16.66%;
  float: left;
  margin: 0; }

.w3 {
  width: 25%;
  float: left;
  margin: 0; }

.w4 {
  width: 33.33%;
  float: left;
  margin: 0; }

.w5 {
  width: 41.66%;
  float: left;
  margin: 0; }

.w6 {
  width: 50%;
  float: left;
  margin: 0; }

.w7 {
  width: 58.33%;
  float: left;
  margin: 0; }

.w8 {
  width: 66.66%;
  float: left;
  margin: 0; }

.w9 {
  width: 75%;
  float: left;
  margin: 0; }

.w10 {
  width: 83.33%;
  float: left;
  margin: 0; }

.w11 {
  width: 91.66%;
  float: left;
  margin: 0; }

.w12 {
  width: 100%;
  float: left;
  margin: 0; }

.spacer {
  display: block;
  width: 100%; }
  .spacer.xs {
    height: 20px; }
  .spacer.sm {
    height: 40px; }
  .spacer.xl {
    height: 120px; }
  .spacer.xxl {
    height: 240px; }

@media only screen and (min-device-width: 320px) and (max-device-width: 568px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: portrait) {
  .h30, .h50, .h70 {
    min-height: 50vh; }

  .h100 {
    min-height: 100vh; }

  .w10, .w20, .w30, .w40, .w50, .w60, .w70, .w80, .w90, .w100,
  .w1, .w2, .w3, .w4, .w5, .w6, .w7, .w8, .w9, .w10, .w11, .w12 {
    width: 100%;
    float: left;
    margin: 0; }

  .blocco.darker,
  .blocco .darker,
  .blocco .lighter {
    min-height: inherit; }

  .blocco.row {
    flex-direction: column;
    -webkit-flex-direction: column; } }
    
