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

    @font-face {
        font-family: WPFont;
        src: url("SegoeWP-Semilight.eot") /* EOT file for IE */
        ;
    }

    @font-face {
        font-family: WPFont;
        src: url("SegoeWP-Semilight.ttf") /* TTF file for CSS3 browsers */
        ;
    }

    body {
        background-color: #333333;
        font-family: WPFont, 'Segoe UI', Verdana, sans-serif;
        -webkit-text-size-adjust: none;
        font-size-adjust: none;
        alignment-adjust: 0;
    }

    a img {
        border: 0 none;
        text-decoration: none;
    }

    a:link, a:visited {
        color: #ccc;
        text-decoration: underline;
    }

    #container {
        height: 100%;
        margin: 50px;
    }

    #start {
        position: relative;
        margin-top: 50px auto 0 auto;
    }

    #header {
        font-size: 3em;
        color: #fff;
        opacity: 0;
    }

    #userInfo {
        float: right;
    }

    #me {
        float: left;
        margin-right: 40px;
        width: 315px;
        zoom: 90%;
        opacity: 0;
    }

    #meWP {
        display: none;
    }

    #social {
        float: left;
        width: 320px;
        zoom: 95%;
        opacity: 0;
    }

    #social2 {
        float: left;
        width: 315px;
        zoom: 95%;
        opacity: 0;
    }


    .fullName {
        float: right;
    }

    .firstName {
        font-size: 0.55em;
        color: #fff;
        text-align: right;
    }

    .lastName {
        font-size: 0.35em;
        color: #fff;
        text-align: right;
    }

    .loginPic {
        margin: 5px;
        float: right;
    }

    .secHeader {
        font-size: 1.5em;
        color: #ccc;
        padding: 3px;
        opacity: 0;
    }

    .meContent {
        font-size: 1em;
        color: #fff;
        margin: 3px;
    }

    .largeTile {
        margin: 3px;
    }

    .medTile {
        float: left;
        padding: 6px;
    }

    .wideTile {
        display: block;
        margin: 3px;
        padding: 0;
    }

    .smallTile {
        display: none;
    }
}




@media screen and (max-width: 768px) {
    
    @font-face {
        font-family: WPFont;
        src: url("SegoeWP-Semilight.eot") /* EOT file for IE */
        ;
    }

    @font-face {
        font-family: WPFont;
        src: url("SegoeWP-Semilight.ttf") /* TTF file for CSS3 browsers */
        ;
    }

    body {
        background-color: #333333;
        font-family: WPFont, 'Segoe UI', Verdana, sans-serif;
    }

    a img {
        border: 0 none;
        text-decoration: none;
    }

    #container {
        height: 100%;
        margin: 0;
    }

    #start {
        position: relative;
        margin-top: 50px;
    }

    #header {
        font-size: 3em;
        color: #fff;
        display: none;
        opacity: 0;
    }

    #me {
        float: left;
        width: 150px;
    }

    .secHeader {
        display: none;
    }

    .smallTile {
        float: left;
        padding-right: 3px;
    }
    
}