#wrapper,
#access,
#access .menu-header,
div.menu,
#colophon,
#branding,
#main,
#footer {
    /*width: 940px;*/
}

#access {
    max-width: 940px;
}

#main {
    float:left;
}

.entry-content img.size-full {
    border: 1px solid #333;
    padding: 5px;
    -moz-box-shadow: 2px 2px 10px #333;
    -webkit-box-shadow: 2px 2px 10px #333;
}

iframe, object, embed{
    max-width: 100%;
}

.wp-caption {
    max-width: 100% !important; /* When images are too wide for containing element, force them to fit. */
    height: auto; /* Override height to match resized width for correct aspect ratio. */
}

.wp-caption img {
    height: auto;
}

@media screen and (max-width: 1024px) {
    #wrapper {
        margin: 20px auto;
        width: 94%;
    }

    #access,
    #access .menu-header,
    div.menu,
    #colophon,
    #branding,
    #main,
    #footer {
        margin: 0 auto;
        width: 100%;
    }

    #branding  {
        overflow:hidden;
    }

    /* added extra lines from the next release of twentyten */
    #content img {
        max-width: 95%;
    }

    /*
    LAYOUT: Two columns
    DESCRIPTION: Responsive.
    940 = 720 + 220
    100% = 76.5957447% + 23.40425535%
    */


    #primary,
    #secondary {
        overflow: hidden;
        width: 23.40425535% /* 200px / 940px */
    }

    #site-title, #site-info {
        width:74.4680851% /* 700px / 940px */
    }

    #footer-widget-area .widget-area,
    #site-generator,
    #site-description  {
        width: 23.40425535% /* 200px / 940px */
    }

}


@media screen and (max-width: 960px) {
    #outer {
        background:url(images/outer-back2.jpg) no-repeat top center;
    }
    .el #outer {
        background:url(images/el/outer-back2.jpg) no-repeat top center;
    }

    #content .col01 {
        max-width: 90%;
        width: 90%;

    }

}
@media screen and (max-width: 660px) {
    body {
        font-size: 90%;
        line-height: 1.7em;
    }
    #wrapper {
        margin: 5px auto;
        width: 90%;
        padding: 0 3%;
    }

    #access,
    #access .menu-header,
    div.menu,
    #colophon,
    #branding,
    #main,
    #footer {
        margin: 0 auto;
        width: 100%;
    }

    #branding  {
        overflow:hidden;
    }

    #site-title {
        width: 100%;
    }


    /*    #content {
            width: 95%;
            padding-left: 3%;
            margin: 0 0px 0 0px;
        }*/

    .alignleft, img.alignleft, #content img.alignleft, .alignright, img.alignright, #content img.alignright {
        clear: both;
        display: block;
        margin-left: auto;
        margin-right: auto;
        float: none;
    }

    #primary,
    #secondary, #subcontent {
        float: left;
        overflow: hidden;
        max-width: 95%;
    }

    #secondary {
        clear: left;
    }

    #site-generator, #site-description, #site-info, #site-title {
        clear: left;
        float: left;
        width: 95%;
        padding: 0;
        margin: 0;
    }

    .entry {
        width: 97%;
    }

    #content .col01 {
        padding-left: 16px;
    }
    #content .col01 .post-inner .date-tab
    {
       background-image: none;
    }
    .month, .day {
        display: inline; padding: 0
    }
    .day {float:left; padding-right: 5px}
}

/* landscape */
@media screen and (max-width:480px) and (min-width: 321px) {
    #wrapper {
        margin: 0 auto;
        width: 90%;
        width: 400px;
        overflow: auto;
    }

    #access,
    #access .menu-header,
    div.menu,
    #colophon,
    #branding,
    #main,
    #footer {
        margin: 0 auto;
        width: 100%;
    }

    #branding  {
        overflow:hidden;
    }

    #site-title,
    #site-info,
    #site-description,
    #site-generator   {
        width: 100%;
        clear: left;
        float: left;
        margin-top: 0;
        padding-top:0;
        margin-bottom: 0;
        padding-bottom:0;
    }

    .alignleft, img.alignleft, .alignright, img.alignright {
        clear: both;
        display: block;
        margin-left: auto;
        margin-right: auto;
        float: none;
    }

    #primary,
    #secondary {
        clear: both;
        float: left;
        overflow: hidden;
        width: 99%;
    }
    #title {padding-left: 20px; left:0}
}


/* portrait */
@media screen and (max-width: 320px) {
    #wrapper {
        margin: 0 auto;
        width: 300px;
        overflow: auto;
    }

    #access,
    #access .menu-header,
    div.menu,
    #colophon,
    #branding,
    #main,
    #footer {
        margin: 0 auto;
        width: 100%;
    }

    #branding  {
        overflow:hidden;
    }

    #site-title,
    #site-description,
    #site-info,
    #site-generator   {
        width: 100%;
        clear: left;
        float: left;
        margin-top: 0;
        padding-top:0;
        margin-bottom: 0;
        padding-bottom:0;
    }


    #container {
        float: left;
        width: 100%;
        overflow: auto;
    }
    #content {
        width: 98%;
        margin: 0 0px 0 0px;
    }

    .alignleft, img.alignleft, .alignright, img.alignright {
        clear: both;
        display: block;
        margin-left: auto;
        margin-right: auto;
        float: none;
    }

    #primary,
    #secondary {
        clear: both;
        float: left;
        overflow: hidden;
        width: 99%;
    }
    #title {padding-left: 20px; left:0}
}