/* Small devices (landscape phones, 576px and up) */
@media (max-width: 575.98px) {
    
    .bg-grafica{
        
    }
    
    ul.single-block-grafica li:nth-child(1), ul.single-block-grafica li:nth-child(3) {
        background-color: #e0d9d0;
    }
    
    .parallax-window {
        min-height: 200px;
    }
    
    body.home.it #content{
        margin-top: 80px;
    }
  
}

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {
    
    .parallax-window {
        min-height: 280px;
    }
    
    .set-link p {
        font-size: .9rem;
    }
    
    .coffee-beans-hp {
        position: absolute;
        left: -40%;
        bottom: 0;
        width: 40%;
        max-width: 250px;
    }
    
    .saquella-logo-footer {
        width: 50%;
    }
    
    p.footer-text {
        font-size: .8rem;
    }
    
    ul.single-block-grafica li:nth-child(1), ul.single-block-grafica li:nth-child(3) {
        background-color: #e0d9d0;
    }
    
    .news-home {
        min-height: 100px;
    }
    
    .scopri-news-home {
        position: absolute;
        display: block;
        bottom: 0;
        left: 0;
        right: 0;
    }
    
    body.home.it #content{
        margin-top: 80px;
    }
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
    
    ul.single-block-grafica li:nth-child(1), ul.single-block-grafica li:nth-child(2), ul.single-block-grafica li:nth-child(3) {
        background-color: transparent;
    }
    
    .bg-grafica{
        background-color: #e0d9d0;
        padding-top: 2em;
        padding-bottom: 2em;
        /*background-image: linear-gradient(white 0%, white 25%, #e0d9d0 25%);*/ 
/*        background-repeat: no-repeat;
        background-position: center center; 
        background-size: cover;*/
    }
    
    .parallax-window {
        min-height: 500px;
    }
    
    body.home.it #content{
        margin-top: 80px;
    }
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
    
    body.home.it #content{
        margin-top: 0;
    }
    
}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
   
   
}

/* Extra extra large devices (large desktops, 1600px and up) */
@media (min-width: 1600px) {
   
    .col-xxl-1 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 8.333333%;
        flex: 0 0 8.333333%;
        max-width: 8.333333%;
    }
    
    .col-xxl-2 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 16.666667%;
        flex: 0 0 16.666667%;
        max-width: 16.666667%;
    }
    
    .col-xxl-3 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 25%;
        flex: 0 0 25%;
        max-width: 25%;
    }
    
    .col-xxl-4 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 33.333333%;
        flex: 0 0 33.333333%;
        max-width: 33.333333%;
    }
    
    .col-xxl-5 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 41.666667%;
        flex: 0 0 41.666667%;
        max-width: 41.666667%;
    }
    
    .col-xxl-6 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
    }
    
    .col-xxl-7 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 58.333333%;
        flex: 0 0 58.333333%;
        max-width: 58.333333%;
    }
    
    .col-xxl-8 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 66.666667%;
        flex: 0 0 66.666667%;
        max-width: 66.666667%;
    }
    
    .col-xxl-9 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 75%;
        flex: 0 0 75%;
        max-width: 75%;
    }
    
    .col-xxl-10 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 83.333333%;
        flex: 0 0 83.333333%;
        max-width: 83.333333%;
    }
    
    .col-xxl-11 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 91.666667%;
        flex: 0 0 91.666667%;
        max-width: 91.666667%;
    }
    
    .col-xxl-12 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }
    
    .offset-xxl-1 {
        margin-left: 8.333333%;
    }
    
    .offset-xxl-2 {
        margin-left: 16.666667%;
    }
    
    .offset-xxl-3 {
        margin-left: 25%;
    }
    
    .offset-xxl-4 {
        margin-left: 33.333333%;
    }
    
    .offset-xxl-5 {
        margin-left: 41.666667%;
    }
    
    .offset-xxl-6 {
        margin-left: 50%;
    }
    
    .offset-xxl-7 {
        margin-left: 58.333337%;
    }
    
    .offset-xxl-8 {
        margin-left: 66.666667%;
    }
    
    .offset-xxl-9 {
        margin-left: 75%;
    }
    
    .offset-xxl-10 {
        margin-left: 83.333333%;
    }
    
    .offset-xxl-11 {
        margin-left: 91.666667%;
    }
    
}


/* iPhone 5+5S P+L */
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 568px) 
{
    
}

/* iPhone 6plus P+L */
@media only screen 
and (min-device-width : 414px) 
and (max-device-width : 736px)
{

}

/* iPhone 6 P+L */
@media only screen 
and (min-device-width : 375px) 
and (max-device-width : 667px)
{

}



/*==========  Non-Mobile First Method  ==========*/

/* Large Devices, Wide Screens */
@media only screen and (max-width : 1200px) {

}

/* iPad Landscape */
@media only screen and (max-width : 1024px) {

}

/* Medium Devices, Desktops */
@media only screen and (max-width : 992px) {

}

/* Small Devices, Tablets */
@media only screen and (max-width : 768px) {

}


/* iPad Landscape */
@media only screen and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : landscape){
    
}

/* Extra Small Devices, Phones */
@media only screen and (max-width : 480px) {

}

/* Custom, iPhone Retina */
@media only screen and (max-width : 320px) {

}

/*
@media (-webkit-min-device-pixel-ratio: 1), (min-device-pixel-ratio: 1) {
  p {
    color: red !important;
  }
  body {
    font-family: 'HelveticaNeue-Light';
  }
  
}

 Minimum resolution 
@media (-webkit-min-device-pixel-ratio: 2), (min-device-pixel-ratio: 2) {
  p {
    color: yellow !important;
  }
  
body {
    font-family: 'HelveticaNeue-UltraLight';
  }
  
}
@media (-webkit-min-device-pixel-ratio: 4), (min-device-pixel-ratio: 4) {
  p {
    color: blue !important;
  }
  
body {
    font-family: 'HelveticaNeue-UltraLight';
  }
  
}*/

