How to edit Mobile View only (Twitter Bootstrap)
<p>Hey guys I was wondering could someone help me here? I was trying to add some media queries so that my picture would be centers on mobile devices , my webpage is perfect on desktop view just on mobile it is lined to the right and will not move what so ever . How do I go about this??</p>

<p>I'm using sublime text and i got everything in diff files but here's what I have in my aboutme.html and stylesheet.css and you can also check out the site at oneal-kayla.com and resize the window to see what I mean thank you all so much! (I'm really new at this )</p>

<pre><code>/*about me html */ 
&lt;!DOCTYPE html&gt;
&lt;html lang="en"&gt;
&lt;head&gt;
  &lt;title&gt;Kayla O'Neal&lt;/title&gt;

  &lt;meta charset="utf-8"&gt;
  &lt;meta name="viewport" content="width=device-width, initial-scale=1"&gt;
  &lt;link rel="stylesheet" type="text/css" href="stylesheet.css"&gt;


  &lt;!--CDN Twitter Bootstrap stuff--&gt; 
  &lt;link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"&gt;



&lt;/head&gt;
&lt;body&gt;


&lt;nav class="navbar navbar-default"&gt;
  &lt;div class="container-fluid"&gt;
    &lt;div class="navbar-header"&gt;
      &lt;button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar"&gt;
        &lt;span class="icon-bar"&gt;&lt;/span&gt;
        &lt;span class="icon-bar"&gt;&lt;/span&gt;
        &lt;span class="icon-bar"&gt;&lt;/span&gt; 
      &lt;/button&gt;
    &lt;/div&gt;
    &lt;div class="collapse navbar-collapse" id="myNavbar"&gt;
      &lt;ul class="nav navbar-nav"&gt;
        &lt;li&gt;&lt;a href="index.html"&gt;Home&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="aboutme.html"&gt;About Me&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="portfolio.html"&gt;Portfolio&lt;/a&gt;&lt;/li&gt; 
        &lt;li&gt;&lt;a href="pdfresume.pdf"&gt;Resume&lt;/a&gt;&lt;/li&gt; 
      &lt;/ul&gt;
    &lt;/div&gt;
  &lt;/div&gt;
&lt;/nav&gt;


&lt;img src="fancyaboutme.png" class="center-block img-responsive"/&gt;


 &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"&gt;&lt;/script&gt;
 &lt;script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"&gt;&lt;/script&gt;
&lt;/body&gt;
&lt;/html&gt;



/*style sheet*/ 

body { 
    background:#3498db !important; 

}


.navbar .navbar-nav {  /*make the nav bar center on regular window*/ 
    display: inline-block;
    float: none;
}

.navbar .navbar-collapse {  /*make the nav bar center on mobile window*/ 
    text-align: center;

}

.navbar-default  /*navifgation bar*/ 
{
  background:#3498db !important; 
  border: none !important;



}
.navbar-nav &gt; li a   /*link text*/ 
{
  color:white !important;
  text-align: center; 


}

.navbar-nav &gt; li &gt; a:hover  /*color changes for links when hovered over*/ 
 {
 background:#2d8cca !important;  /*Sets the text hover color on navbar*/
}

.navbar-default div.navbar-collapse
{
    border-top:none;
    box-shadow:none;
    text-align: center; 
}

.center-block
{
   margin-right:420px !important;


}
</code></pre>