* {
    box-sizing: border-box;
}

@font-face {
    font-family: Lato;
    src: url(../fonts/lato-regular.woff);
}

/* Responsive layout - makes the two columns/boxes stack on top of each other instead of next to each other, on small screens */
@media (max-width: 600px) {
    nav, article {
        width: 100%;
        height: auto;
    }
}

.nav_bar {
    /* background-color: #393E46; */
    color: white;
  	height: 100px;
  	padding: 0px 75px;
}

.nav_title {
  float: left;
  font-size: 35px;
  font-weight: bold;
  height: 50px;
  line-height: 50px;
  margin: 25px 25px;
}

.nav_title a{
  text-decoration: none;
  color: white;
}

.nav_float {
  float: right; 
}

.nav_item {
  float: left;
  font-size: 15px;
  height: 50px;
  line-height: 50px;
  margin: 25px 25px;
}

.nav_item a{
  text-decoration: none;
  color: white;
}

body {
    font-family: Lato, Arial, Helvetica, sans-serif;
    margin: 0px;
    background-color: #222831;
}

.content {
  color: white;
  margin: 25px 75px;
  padding: 25px 25px;
  min-height: 500px;
}

.home_title {
    font-size: 40px;
    color: white;
  	text-align: center;
}

.home_text {
    font-size: 17px;
    color: white;
  	text-align: center;
}

.home_project {
  color: white;
  margin: 25px 75px;
  padding: 25px 25px;
  height: 400px;
}

.home_blog {
  color: white;
  margin: 25px 75px;
  padding: 25px 25px;
}

.project_list {
  margin: 10px 10px;
  padding: 15px 20px;
  width: 350px;
  height: 210px;
  border: 1px solid white;
  float: left;
}

.project_list a{
  color: white; 
}

.whitelink {
    color: white;
}

/* Clear floats after the columns */
section::after {
    content: "";
    display: table;
    clear: both;
}

/* Create two columns/boxes that floats next to each other */
.sidebar {
    float: left;
    width: 30%;
    background: #393E46;
    color: white;
    margin: 20px 0px 20px 20px;
    min-height: 500px;
    border: 2px solid #61646D;
}

.button_blue {
	box-shadow:inset 0px -3px 7px 0px #29bbff;
	background:linear-gradient(to bottom, #2dabf9 5%, #0688fa 100%);
	background-color:#2dabf9;
	border-radius:3px;
	border:1px solid #0b0e07;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
	font-size:15px;
	padding:9px 23px;
	text-decoration:none;
	text-shadow:0px 1px 0px #263666;
}
.button_blue:hover {
	background:linear-gradient(to bottom, #0688fa 5%, #2dabf9 100%);
	background-color:#0688fa;
}
.button_blue:active {
	position:relative;
	top:1px;
}

/* Style the footer */
.footer {
    background-color: #393E46;
    padding: 10px;
    text-align: center;
    color: white;
}