body {
 margin-top: 50px;
}

h1.title {
 margin: 0px;
 padding: 0px;
 padding-left: 10px;
}

h3.title {
 color: #777;
 margin: 0px;
 padding: 0px;
 padding-left: 10px;
}

h4 {
 margin-top: 20px;
}

a.title {
 color: #777;
}
a.title:hover {
 color: #000;
}

i {
 margin: 20px;
}

img.avatar {
 height: 250px;
 width: 250px;
 border-radius: 20px !important;
}

@media (max-width:991px) {
 div.left-section .title {
  text-align: center;
 }
}

@media (min-width:992px) {
 div.left-section {
  border-right: 1px solid #f1f1f1;
 }
 div.left-section .title {
  text-align: right;
 }
}

div.right-section {
 text-align: left;
}

#bio {
 margin: 10px;
}

code {
 font-family: 'Consolas', 'Menlo', 'Monaco', 'Courier New', monospace;
}

div.iodiv {
 height: 300px;
 padding: 20px;
 background-color: #f1f1f1;
 border-radius: 10px;
 white-space: pre;
 display: block;
 overflow: scroll;
 font: 14px/1.5em 'Consolas', 'Menlo', 'Monaco', 'Courier New', monospace;
 tab-size: 4;
 outline: none;
}

.clr-red {
 color: #CC0000;
}

.faulty-line {
 color: #C00;
 background: #FDD;
 font-weight: bold
}

.json-go-faulty-char  {
 border: 1px solid purple;
}

.clear {
 clear: both;
}

.list-group-flush {
 padding-bottom: 20px;
}