/* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-width : 320px) and (max-width : 480px) {

    .noPhone {
        display: none;
    }
}

/* =============================================================================
   Media Queries
   config: david casey sydney australia
   ========================================================================== */

@media only screen and (min-width: 0px) {

    /* iphone */
    .noPhone {
        display: none;
    }

    .noWidescreen {
        display: inline;
    }

    .standardPortrait {
        width: 100px;
        align: center;
    }

    .standardImage {
        width: 280px;
    }

    .SlideShow {
        width: 100px;
    }

    .floatleft {
        width: 110px;
    }

    .logo {
        width: 117px;
    }

    #map_canvas {
        width: 280px;
        height: 280px;
    }

    #logo-container {
        text-align: center;
        align: center;
    }

    #leftnav {
        display: none;
        width: 0px;
    }

    #rightnav {
        display: none;
        width: 0px;
    }

    #content {
        margin-left: 0px;
        margin-right: 0px;
    }

    #footer_leftnav {
        display: none;
        width: 0px;
    }

    #footer_rightnav {
        display: none;
        width: 0px;
    }

    #footer_content {
        margin-left: 0px;
        margin-right: 0px;
    }

    #header_leftnav {
        display: none;
        width: 0px;
    }

    #header_rightnav {
        display: none;
        width: 0px;
    }

    #header_content {
        margin-left: 0px;
        margin-right: 0px;
    }

    #myFilm {
        width: 320px;
        height: 240px;
    }

    .ArticleContentImage {
        width: 100px;
    }

    .AsideContentImage {
        width: 150px;
    }

    .audioImage {
        width: 100px;
        height: 100px;
    }
    /* ====================
    MOBILE: Menu
   ==================== */

    nav {
        width: 420px;
    }

        nav a {
            float: left;
            width: 15%;
            padding: 5px;
            margin-bottom: 10;
        }

        nav li:first-child a {
            margin-left: 0;
        }

        nav li:last-child a {
            margin-right: 0;
        }




        /* ========================
    MOBILE: IE Fixes
   ======================== */

        nav ul li {
            display: inline;
            text-align: center;
        }

    .oldie nav a {
        margin: 0 0.7%;
    }
}

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

    /* transitional */
    .noPhone {
        display: inline;
    }

    .noWidescreen {
        display: none;
    }

    .standardPortrait {
        width: 220px;
    }

    .standardImage {
        width: 240px;
    }

    #logo-container {
        text-align: center;
        align: center;
    }

    .logo {
        width: 117px;
    }

    #map_canvas {
        width: 300px;
        height: 300px;
    }

    .SlideShow {
        width: 100px;
    }

    .floatleft {
        width: 110px;
    }

    #leftnav {
        display: block;
        width: 160px;
    }

    #rightnav {
        display: block;
        width: 160px;
    }

    #content {
        margin-left: 200px;
        margin-right: 200px;
    }

    #footer_leftnav {
        display: block;
        width: 160px;
    }

    #footer_rightnav {
        display: block;
        width: 160px;
    }

    #footer_content {
        margin-left: 200px;
        margin-right: 200px;
    }

    #header_leftnav {
        display: block;
        width: 160px;
    }

    #header_rightnav {
        display: block;
        width: 160px;
    }

    #header_content {
        margin-left: 200px;
        margin-right: 200px;
    }

    #myFilm {
        width: 420px;
        height: 315px;
    }

    .ArticleContentImage {
        width: 100px;
    }
    /* ====================
    INTERMEDIATE: Menu
   ==================== */

    nav a {
        float: left;
        width: 10%;
        margin: 0 1.7%;
        padding: 5px 2%;
        margin-bottom: 0;
    }

    nav li:first-child a {
        margin-left: 0;
    }

    nav li:last-child a {
        margin-right: 0;
    }




    /* ========================
    INTERMEDIATE: IE Fixes
   ======================== */

    nav ul li {
        display: inline;
        text-align: center;
    }

    .oldie nav a {
        margin: 0 0.7%;
    }
}

@media only screen and (min-width: 768px) {
    /* ipad */
    /* ====================
    WIDE: CSS3 Effects
    config: david casey sydney australia
   ==================== */

    .noPhone {
        display: inline;
    }

    .noWidescreen {
        display: none;
    }

    .standardPortrait {
        width: 210px;
    }

    .standardImage {
        width: 240px;
    }

    #logo-container {
        text-align: center;
        text-align: center;
    }

    .logo {
        width: 117px;
    }

    #map_canvas {
        width: 400px;
        height: 400px;
    }

    .SlideShow {
        width: 200px;
    }

    .floatleft {
        width: 160px;
    }

    .ArticleContentImage {
        width: 152px;
    }

    .audioImage {
        width: 200px;
        height: 200px;
    }

    /*	========
    WIDE: Menu
   ============ */

    #title {
        float: left;
    }

    nav {
        width: 700px;
        padding: 5px 5px 5px 5px;
        align: center;
    }


    /* ============
    WIDE: Main
   ============ */

    #main article {
        float: left;
        width: 57%;
    }

    #main aside {
        float: right;
        width: 33%;
    }


    .logo {
        width: 117px;
    }

    .standardImage {
        width: 440px;
    }

    #map_canvas {
        width: 440px;
        height: 440px;
    }
}

@media only screen and (min-width: 961px) {
    #main article {
        padding: 0px 0px 0px 7%;
    }
}

@media only screen and (min-width: 1140px) {

    /* ===============
    Maximal Width
   =============== */

    .wrapper {
        width: 1024px; /* 1140px - 10% for margins */
        margin: 0 auto;
    }

    .noPhone {
        display: inline;
    }

    .noWidescreen {
        display: none;
    }

    .standardPortrait {
        width: 220px;
    }

    .standardImage {
        width: 240px;
    }

    #logo-container {
        text-align: center;
        align: center;
    }

    .logo {
        width: 117px;
    }

    #map_canvas {
        width: 440px;
        height: 440px;
    }

    .SlideShow {
        width: 213px;
    }

    .floatleft {
        width: 160px;
    }

    #main article {
        padding: 0px 0px 0px 7%;
    }
}