blog.css

@media (max-width: 700px) {
  .buttons-ul {
    display: none;
  }

}

@media (min-width: 701px) {
  
}


body {
  font-family: 'Open Sans', sans-serif;
  background-color: #fafafa;
}

.outer-div {
  max-width: 100%;
}

.inner-left {
  float: left;
  width: 15%;
  text-align: center;
  position: relative;
  margin-top: 10%;
}

.buttons-ul {
  list-style-type: none;
  margin: 0;
  margin-left: 10px;
  padding: 0;
  position: fixed;
}

.buttons-ul li {
  margin-bottom: 25px;
}

.buttons-ul .fa {
  font-size: 50px;
}

.fa-bars {
  color: red;
}

.fa-home {
  color: green;
}

.fa-facebook-official {
  color: blue;
}

.fa-twitter-square {
  color: cyan;
}

.buttons-ul a {
  text-decoration: none;
  color: black;
}

.inner-right {
  float: right;
  width: 85%;
}

h1 {
  font-size: 2.5em;
   margin-right: 10%;
}

.blog-img-div {
  text-align: center;
}

img {
  margin-right: 10%;
  max-width: 85%;
    height: auto;
}

h2,
p,
ol,
ul {
  margin-right: 10%;
}

footer {
    font-size: .8em;
    clear: both;
}

.ruby-code {
  border:solid gray;
  border-width:.1em .1em .1em .8em;
  padding:.2em .6em;
  color: #ed9d13;
  background: #202020;
}