body {
  background-color: white;
  font-family: Arial, Helvetica, sans-serif;
  line-height: 20px;
  margin: 0 auto;
  padding: 0;
}

section {
  padding: 0px;
  margin: auto;
  margin-left: auto;
  margin-right: auto;
}

section#head {
  /*background-color: red;*/
  height: 500px;
  background-image: url(../imgs/header.jpg);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
section#head h3{
  position: relative;
  padding: 0;
  margin: 0;
  font-size: 5em;
  top: 250px;
}
section#head p{
  position: relative;
  padding: 0;
  margin: 0;
  font-size: 1em;
  top: 320px;
  /*color: rgb(150,50,50);*/
}
section#content{
  /*background-color: rgb(150, 50, 50);*/
  background-color: white;
}
section#content h3 {text-align: left;}

section#footer {
  position: fixed;
  background-color: rgba(50, 50, 50, 0.5);
  width: 100%;
  bottom: 0px;
}
section#footer p {padding: 0px; margin: 10px; font-size: 12px;}

section#content footer {
  position: absolute;
  margin: auto;
  width: 100%;
  padding: 0;
  margin: 0;
  background-color: rgb(150, 50, 50);

  margin-bottom: 40px;
}

section footer article {
  float: left;
  /*background-color: red;*/
  height: 320px;
  padding: 0px;
  margin: 0;
  color: white;

}

section footer article h3 {
  padding-left: 50px;
  padding-top: 20px;
  margin: 0;
  text-align: left;
}

section footer article p {
  padding: 50px;
  padding-top: 0px;
  color: white;
}
article {
  /*position: relative;*/
  /*float: left;*/
  /*max-width: 400px;*/
  width: 50%;
  margin-left: auto;
  margin-right: auto;
  padding: 20px;
  padding-left: 35px;
  padding-right: 35px;
  /*border-bottom: rgb(30, 30, 30) 2px;
  border-bottom-style: dashed;*/
}

p {
  font-size: 14px;
  /*text-align: center;*/

}



.center {text-align: center;}
.right {text-align: right;}
.white {color: white;}
.italic {font-style: italic;}


.row1 {width: 100%;}
.row4 {width: 33%;}
.row6 {width: 50%;}
.row12 {width: 10%;}

.line {
  border-bottom: solid rgb(150, 50, 50) 3px;
  width: 150px;
  margin: auto;
}

.border {
  /*border-top: dashed rgb(150, 50, 50) 1px;
  border-bottom: dashed rgb(150, 50, 50) 2px;*/
  /*border-left: solid rgb(150, 50, 50) 2px;*/
  /*border-right: solid rgb(150, 50, 50) 2px;*/
  border: solid rgb(150, 50, 50) 2px;
  padding: 10px;

}

h1 {
  font-size: 25px;
  text-align: center;
  padding: 0;
  margin: 0;
  /*margin-top: 30px;*/
  line-height: 30px;
  /*color: white;*/
  color: rgb(150, 50, 50);
}

h4 {text-align: center; padding: 0; margin: 0}
img {
  display: block;
  /*text-align: center;*/
  margin-left: auto;
  margin-right: auto;
}
a {color: rgb(150,50,50); text-decoration: none; font-size: 14px;}
a:active {color: rgb(150,50,50)}
a:hover {color: rgb(150,50,50); font-weight: bold;}
a:visited {color: rgb(150,50,50)}

section footer a {color: white; text-decoration: underline;}
section footer a:active {color: white;}
section footer a:hover {color: white; text-decoration: underline; font-weight: normal;}
section footer a:visited {color: white;}

img.smile {height: 100px; width: auto}

article.projects h4 {margin-top: 30px;}



@media screen and (max-width: 768px){
  section#head {
    /*background-color: red;*/
    height: 180px;
  }
  section#head h3{
    font-size: 2.5em;
    top: 70px;
  }
  section#head p{
    font-size: 1.0em;
    line-height: 30px;
    margin-left: 20px;
    margin-right: 20px;
    top: 90px;
  }

  .row1{width:100%;}
  .row4{width:100%;}
  .row6 {width:100%;}

  section#content h3 {
    text-align: center;
    padding: 15px;
  }
  section footer article p, section footer article p.right  {
    text-align: center;
  }

  article {
    /*position: relative;*/
    /*float: left;*/
    /*max-width: 400px;*/
    width: 80%;
  }

}