/* Media queries per varie risoluzioni (mobile-first approach) */

/* default */
@media screen and (min-width: 0px) {
    h1, .sh1 { font-size:23px; }
    h2, .sh2 { font-size:20px; }
    h3, .sh3 { font-size:17px; }
    h4, .sh4 { font-size:15px; }
    h5, .sh5 { font-size:11px; }
    .formStandard { width:90%; margin-left:5%; margin-right: 5%; }
    nav, nav ul ul { width:30%; }
    nav ul ul { left:30%; }
    #larghezzaMenu { width:30%; float:left; }
    #divPosizione{ width: 100%; }
    main { width: 63%; padding-right:3%; padding-left:3%;}
    #sidebarDX { display:none; }
    #tableRiga { width: 50%; }
    #tableRiga.risparmiometro { width: 95%; }
    header { font-size:22px; text-align: center;}
}	

/* Schermi solitamente di 480px */
@media screen and (min-width: 440px) {
    h1, .sh1 { font-size:23px; }
    h2, .sh2 { font-size:20px; }
    h3, .sh3 { font-size:17px; }
    h4, .sh4 { font-size:15px; }
    h5, .sh5 { font-size:11px; }
    .formStandard { width:90%; margin-left:5%; margin-right: 5%; }
    nav, nav ul ul { width:30%; }
    nav ul ul { left:30%; }
    #larghezzaMenu { width:30%; float:left; }
    #divPosizione{ width: 100%; }
    main { width: 63%; padding-right:3%; padding-left:3%;}
    #sidebarDX { display:none; }
    #tableRiga { width: 50%; }
    #tableRiga.risparmiometro { width: 95%; }
    header { font-size:22px; text-align: center; }
}

/* Schermi solitamente di 600px */
@media screen and (min-width: 560px) {
    h1, .sh1 { font-size:23px; }
    h2, .sh2 { font-size:20px; }
    h3, .sh3 { font-size:17px; }
    h4, .sh4 { font-size:15px; }
    h5, .sh5 { font-size:11px; }
    .formStandard { width:60%; margin-left:20%; margin-right: 20%; }
    nav, nav ul ul { width:30%; }
    nav ul ul { left:30%; }
    #larghezzaMenu { width:30%; float:left; }
    #divPosizione{ width: 100%; }
    main { width: 63%; padding-right:3%; padding-left:3%;}
    #sidebarDX { display:none; }
    #tableRiga { width: 50%; }
    #tableRiga.risparmiometro { width: 80%; }
    header { font-size:25px; text-align: center; }
}

/* Schermi solitamente di 768px */
@media screen and (min-width: 720px) {
    h1, .sh1 { font-size:23px; }
    h2, .sh2 { font-size:20px; }
    h3, .sh3 { font-size:17px; }
    h4, .sh4 { font-size:15px; }
    h5, .sh5 { font-size:12px; }
    .formStandard { width:60%; margin-left:20%; margin-right: 20%; }
    nav, nav ul ul { width:25%; }
    nav ul ul { left:25%; }
    #larghezzaMenu { width:25%; float:left; }
    #divPosizione{ width: 100%; }
    main { width: 70%; padding-right:2%; padding-left:2%;}
    #sidebarDX { display:none; }
    #tableRiga { width: 50%; }
    #tableRiga.risparmiometro { width: 70%; }
    header { font-size:28px; text-align: right; }
}

/* Schermi solitamente di 1024px o superiori */
@media screen and (min-width: 960px) {
    h1, .sh1 { font-size:25px; }
    h2, .sh2 { font-size:23px; }
    h3, .sh3 { font-size:20px; }
    h4, .sh4 { font-size:17px; }
    h5, .sh5 { font-size:12px; }
    .formStandard { width:40%; margin-left:30%; margin-right: 30%; }
    nav, nav ul ul { width:16%; }
    nav ul ul { left:16%; }
    #larghezzaMenu { width:16%; float:left; }
    #divPosizione{ width: 100%; }
    main { width: 81%; padding-right:1%; padding-left:1%; }
    #sidebarDX { display:none; width:16%; padding-right:1%; padding-left:1%; }
    #tableRiga { width: 50%; }
    #tableRiga.risparmiometro { width: 50%; }
    header { font-size:30px;  text-align: right;}
}

@media screen and (min-width: 1400px) {
    h1, .sh1 { font-size:25px; }
    h2, .sh2 { font-size:23px; }
    h3, .sh3 { font-size:20px; }
    h4, .sh4 { font-size:17px; }
    h5, .sh5 { font-size:12px; }
    .formStandard { width:40%; margin-left:30%; margin-right: 30%; }
    nav, nav ul ul { width:16%; }
    nav ul ul { left:16%; }
    #larghezzaMenu { width:16%; float:left; }
    #divPosizione{ width: 100%; }
    main { width: 81%; padding-right:1%; padding-left:1%; }
    #sidebarDX { display:none; width:16%; padding-right:1%; padding-left:1%; }
    #tableRiga { width: 50%; }
    #tableRiga.risparmiometro { width: 50%; }
    header { font-size:30px; text-align: right; }
}
