/**
 * Use this file to conditionally override styles for devices.
 * If you adjust the media queries in the theme settings you should
 * adjust them here so they match.
 */

/* Smartphone portrait */
@media only screen and (max-width:320px) {
    body {font-size : 85%}
    h1#site-name {font-size : 150%; font-style : normal; top : 4em;}
    h2#site-slogan {font-size : 100%; top : 4em; margin-left : -.5em;}
    #page > header > hgroup {height: 3em;}
    #block-block-3, #block-block-4, #block-custom-search-blocks-1, .right-column-content {clear: left; float: left; width: 100%;}
    #block-block-7 img {max-width : 50%; height : auto;}
    .nav .block {font-size : 75%;}
    #block-user-login {font-size : 80%;}
}

/* Smartphone landscape */
@media only screen and (min-width:321px) and (max-width:480px) {
    body {font-size : 85%}
    h1#site-name {font-size : 180%; top : 3em;}
    h2#site-slogan {font-size : 100%; top : 4em; margin-left : -1em;}
    #page > header > hgroup {height: 3em;}
    #block-block-3, #block-block-4, #block-custom-search-blocks-1, .right-column-content {clear: left; float: left; width: 100%;}
    #block-block-7 img {max-width : 50%; height : auto;}
    .nav .block {font-size : 75%;}
    #block-user-login {font-size : 80%;}
}

/* Tablet portrait */
@media only screen and (min-width:481px) and (max-width:768px) {
    h1#site-name {font-size : 200%;}
    h2#site-slogan {font-size : 120%; margin-left : -1em;}
    #page > header > hgroup {height: 4em;}
    #block-block-3, #block-block-4, #block-custom-search-blocks-1, .right-column-content {clear: left; float: left; width: 70%;}
    #block-block-7 img {max-width : 50%; height : auto;}
}

/* Tablet landscape */
@media only screen and (min-width:769px) and (max-width:1024px) {  
    h1#site-name {font-size : 235%; top : 3em;}
    h2#site-slogan {font-size : 130%}
    #page > header > hgroup {height: 5em;}
    .right-column-content {clear: left; float: left; width: 70%;}

/* Standard layout */
@media only screen and (min-width:1025px) {
}