﻿
@media screen and (max-width: 1079px) and (min-width:760px) {

    body {
        background-position-y: 70px;
    }

    .page-container {
        margin: 5px auto 0 auto;
        width: 760px;
        min-height: 450px;
    }

    .header {
        height: 70px;
        background-position-y: 64px;
    }

    .content {
        min-height: 413px;
    }

    p {
        font-size: 12px;
    }

    .footer {
        width: 760px;
        position: relative;
    }

    .logo {
        width: 205px;
        height: 60px;
        background: url("../images/logo60h.png") no-repeat;
    }

    .main-menu li a {
        font-size: 14px;
    }

    .tribunale {
        width: 760px;
        height: 413px;
        background: url("../images/tribunale760.jpg");
    }

    .footer .ref {
        width: 100%;
        text-align: center;
        position: absolute;
        top: 2em;
    }

    .footer-menu {
        position: absolute;
        top: 0;
        right: 10px;
    }

        .footer-menu li {
            font-size: 12px;
        }
}

@media screen and (max-width: 759px) and (min-width:480px) {

    * {
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }

    img.left {
        width: 100%;
    }

    .page {
        position: relative;
        padding-top: 40px;
    }

        .page h2 {
            position: absolute;
            top: 5px;
        }

    body {
        background-position-y: 70px;
    }

    .page-container {
        margin: 5px auto 0 auto;
        width: 480px;
        min-height: 300px;
    }

    .header {
        height: 70px;
        background-position-y: 64px;
        position: relative;
    }

    .content {
        min-height: 260px;
    }

    p {
        font-size: 12px;
    }

    .footer {
        width: 480px;
        position: relative;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }

    .logo {
        width: 137px;
        height: 40px;
        background: url("../images/logo40h.png") no-repeat;
        left: 10px;
    }

    .main-menu {
        position: absolute;
        top: 34px;
        width: 100%;
    }

        .main-menu li {
        }

            .main-menu li a {
                font-size: 12px;
            }

    .tribunale {
        width: 480px;
        height: 261px;
        background: url("../images/tribunale480.jpg");
    }

    .footer .ref {
        width: 100%;
        text-align: center;
        position: absolute;
        top: 2em;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        padding: 0 10px;
    }

    .footer-menu {
        position: absolute;
        top: 0;
        right: 10px;
    }

        .footer-menu li {
            font-size: 12px;
        }
}

@media screen and (max-width: 479px) {

    * {
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }

    img.left {
        width: 100%;
    }

    .page {
        position: relative;
        padding-top: 40px;
    }

        .page h2 {
            position: absolute;
            top: 5px;
        }

    .image {
        width: 100%;
        float: left;
    }

        .image img {
            position: static;
        }

    .description {
        width: 100%;
        float: left;
    }

    body {
        background-position-y: 70px;
    }

    .page-container {
        margin: 5px auto 0 auto;
        width: 320px;
        min-height: 330px;
    }

    .header {
        height: 90px;
        background-position-y: 84px;
        position: relative;
    }

    .content {
        min-height: 260px;
    }

    p {
        font-size: 12px;
    }

    .footer {
        width: 320px;
        position: relative;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }

    .logo {
        width: 138px;
        height: 40px;
        background: url("../images/logo40h.png") no-repeat;
        left: 10px;
    }

    .main-menu {
        position: absolute;
        top: 46px;
        width: 100%;
    }

        .main-menu li {
            margin: 3px 5px;
            font-size: 12px;
        }

            .main-menu li a {
                font-size: 12px;
            }

    .tribunale {
        width: 320px;
        height: 261px;
        background: url("../images/tribunale480.jpg") no-repeat 50% 50%;
    }

    .footer .ref {
        width: 100%;
        text-align: center;
        position: absolute;
        top: 2em;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        padding: 0 10px;
    }

    .footer-menu {
        position: absolute;
        top: 0;
        width: 100%;
        text-align: center;
    }

        .footer-menu li {
            font-size: 12px;
        }

    .google-map {
        margin-top: 10px;
    }

        .google-map #mapStudio {
            height: 300px;
        }
}
