/* Override some defaults */
html, body {

}
body {
  padding-top: 60px; /* 40px to make the container go all the way to the bottom of the topbar */
}
.container > footer p {
  text-align: center; /* center align it with the container */
}

.container {
  width: 970px;
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}

#banner-container {
  width: 100%;
  margin-top: -4px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;
  background-image:
     linear-gradient(175deg, #7275F9, #333333);
}

#banner-title  {
  margin: auto;
  padding: 5% 0px;
  width: 70%;
}

#banner-title p {
  font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
  font-size: 43px;
  font-weight: 200;
  color: white;
  line-height: 50px;
  text-align: center;
}

#banner-subtitle p {
  font-size: 24px;
}

#banner-btn {
  border: 2px solid white;
  font-size: 20px;
  margin-top: 50px;
  padding: 0px 34px;
  color: white;
  font-weight: 400;
  background-color: transparent;
}

#banner-btn:hover {
  background-color: white;
  color: #3e658d;
  font-weight: 400;
}
.span14 {
  width: 970px;
}

#banner-social {
  text-align: center;
}


/* The white background content wrapper */
.content {
  font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
  background-color: #fff;
  padding: 20px;
  margin: 0 -20px; /* negative indent the amount of the padding to maintain the grid system */
  -webkit-border-radius: 0 0 6px 6px;
     -moz-border-radius: 0 0 6px 6px;
          border-radius: 0 0 6px 6px;
  /*-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.15);
     -moz-box-shadow: 0 1px 2px rgba(0,0,0,.15);
          box-shadow: 0 1px 2px rgba(0,0,0,.15);*/
}

.link-btn {
    background-color: white;
    border: 2px solid #555555;
    border-radius: 8px;
    color: white;
    padding: 8px 12px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    margin: 3px 1px;
    -webkit-transition-duration: 0.1s; /* Safari */
    transition-duration: 0.1s;
    cursor: pointer;
    color: black;
}

.link-btn:hover {
    background-color: #555555;
    color: white;
    text-decoration: none;
}

/* Page header tweaks */
.page-header {
  background-color: #f5f5f5;
  padding: 20px 20px 10px;
  margin: -20px -20px 20px;
}

.content p {
   font-size: 16px;
   line-height: 24px;
}

.content ul {
   margin-top:8px;
   font-size: 16px;
   line-height: 24px;
}

.content li {
   margin-bottom: 7px;
}

.content h1 {
   font-size:28px;
}

/* navigation, topbar */

#logo-wrap {
   float: left;
   padding-top: 5px;
   margin-top: 8px;
   margin-bottom: 8px;
}

#nav-bar {
  margin-left: 20px;
  font-size: 16px;
  font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
  height: 50px;
}

#nav-bar li {
  margin-top: 10px;
  margin-right:15px;
}

/* blog */
.bloglist ul {
  margin-top: 10px;
}

.bloglist li {
  margin-top: 4px;
  margin-bottom: 25px;
}

.topbar .btn {
  border: 0px;
}

/* active color use default */
.topbar div>ul .active>a, .nav .active>a {
   background-color: rgb(42, 42, 42);
}

/* tag_box ======================================================== */

.tag_box {
	list-style:none;
	margin:0;
	padding:5px 0 ;
	overflow:hidden;
}
.tag_box li {
	line-height:28px;
}
.tag_box.inline li {
	float:left;
}
.tag_box a {
	padding: 3px 6px;
	margin: 2px;
	background: #eee;
	color:#005F6B;
	border-radius: 3px;
	text-decoration:none;
}
.tag_box a span{
	vertical-align:super;
	font-size:0.8em;
}

.tag_box a.active {
	background:#57A957;
	border:1px solid #4C964D;
	color:#FFF;
}


.highlight table td { padding: 5px; }
.highlight table pre { margin: 0; }
.highlight .cm {
  color: #999988;
  font-style: italic;
}
.highlight .cp {
  color: #999999;
  font-weight: bold;
}
.highlight .c1 {
  color: #999988;
  font-style: italic;
}
.highlight .cs {
  color: #999999;
  font-weight: bold;
  font-style: italic;
}
.highlight .c, .highlight .cd {
  color: #999988;
  font-style: italic;
}
.highlight .err {
  color: #a61717;
  background-color: #e3d2d2;
}
.highlight .gd {
  color: #000000;
  background-color: #ffdddd;
}
.highlight .ge {
  color: #000000;
  font-style: italic;
}
.highlight .gr {
  color: #aa0000;
}
.highlight .gh {
  color: #999999;
}
.highlight .gi {
  color: #000000;
  background-color: #ddffdd;
}
.highlight .go {
  color: #888888;
}
.highlight .gp {
  color: #555555;
}
.highlight .gs {
  font-weight: bold;
}
.highlight .gu {
  color: #aaaaaa;
}
.highlight .gt {
  color: #aa0000;
}
.highlight .kc {
  color: #000000;
  font-weight: bold;
}
.highlight .kd {
  color: #000000;
  font-weight: bold;
}
.highlight .kn {
  color: #000000;
  font-weight: bold;
}
.highlight .kp {
  color: #000000;
  font-weight: bold;
}
.highlight .kr {
  color: #000000;
  font-weight: bold;
}
.highlight .kt {
  color: #445588;
  font-weight: bold;
}
.highlight .k, .highlight .kv {
  color: #000000;
  font-weight: bold;
}
.highlight .mf {
  color: #009999;
}
.highlight .mh {
  color: #009999;
}
.highlight .il {
  color: #009999;
}
.highlight .mi {
  color: #009999;
}
.highlight .mo {
  color: #009999;
}
.highlight .m, .highlight .mb, .highlight .mx {
  color: #009999;
}
.highlight .sb {
  color: #d14;
}
.highlight .sc {
  color: #d14;
}
.highlight .sd {
  color: #d14;
}
.highlight .s2 {
  color: #d14;
}
.highlight .se {
  color: #d14;
}
.highlight .sh {
  color: #d14;
}
.highlight .si {
  color: #d14;
}
.highlight .sx {
  color: #d14;
}
.highlight .sr {
  color: #009926;
}
.highlight .s1 {
  color: #d14;
}
.highlight .ss {
  color: #990073;
}
.highlight .s {
  color: #d14;
}
.highlight .na {
  color: #008080;
}
.highlight .bp {
  color: #999999;
}
.highlight .nb {
  color: #0086B3;
}
.highlight .nc {
  color: #445588;
  font-weight: bold;
}
.highlight .no {
  color: #008080;
}
.highlight .nd {
  color: #3c5d5d;
  font-weight: bold;
}
.highlight .ni {
  color: #800080;
}
.highlight .ne {
  color: #990000;
  font-weight: bold;
}
.highlight .nf {
  color: #990000;
  font-weight: bold;
}
.highlight .nl {
  color: #990000;
  font-weight: bold;
}
.highlight .nn {
  color: #555555;
}
.highlight .nt {
  color: #000080;
}
.highlight .vc {
  color: #008080;
}
.highlight .vg {
  color: #008080;
}
.highlight .vi {
  color: #008080;
}
.highlight .nv {
  color: #008080;
}
.highlight .ow {
  color: #000000;
  font-weight: bold;
}
.highlight .o {
  color: #000000;
  font-weight: bold;
}
.highlight .w {
  color: #bbbbbb;
}
.highlight {
  background-color: #f8f8f8;
}

.section-tout{
  padding:3em 0 3em;
  border-bottom:1px solid rgba(0,0,0,.05);
  background-color:#eaf1f1
}
.section-tout .fa{
  margin-right:.5em
}

.section-tout h3{
  font-size:20px;
}

.section-tout p {
  margin-bottom:2em
}

.github-btn { border: 0; overflow: hidden }

@media (min-width: 768px) {
  .container {
    width: 750px;
  }
}

@media (min-width: 992px) {
  .container {
    width: 970px;
  }
}

@media (min-width: 1200px) {
  .container {
    width: 1170px;
  }
}

.row {
  margin-right: -15px;
  margin-left: -15px;
}

.col-lg-4, .col-sm-6 {
  position: relative;
  min-height: 1px;
  padding-right: 15px;
  padding-left: 15px;
}

@media (min-width: 768px) {
  .col-sm-6 {
    float: left;
    width: 50%;
  }
}

@media (min-width: 1200px) {
  .col-lg-4 {
    float: left;
    width: 33.33333333%;
  }
}

* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}