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

    .user-thumb {

        position: absolute;

        top: 40px;

        width: 70px;

    }

    .user-container {

        height: 100px;

        background-image: url('/expo/img/dummy-bg-user.jpg');

        margin-bottom: 60px;

        background-repeat: no-repeat;

        background-size: cover;

    }

    .user-container h1 {

        color: #FFF;

        top: 45px;

        left: 100px;

        position: absolute;

        font-size: 26px;

        text-shadow: 2px 2px #000;

    }

    .user-stats {

        display: block;

        margin-top: 150px;

        margin-left: calc(50% - 160px);

    }

    .user-stats li {

        list-style: none;

        float: left;

        width: 80px;

        text-align: center;

    }

    .user-stats li span {

        font-size: 20px;

        display: block;

        font-weight: bold;

    }

}

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

    .user-thumb {

        top: 120px;

        width: 120px;

    }

    .user-container {

        height: 200px;

        margin-bottom: 50px;

    }

    .user-container h1 {

        top: 110px;

        left: 150px;

        font-size: 50px;

    }

    .user-stats {

        color: #FFF;

        margin-top: 130px;

        float: right;

    }

}

@media only screen and (min-width: 992px) {}@media only screen and (min-width: 1200px) {}