body {
  font: 1em Roboto, 'Myriad Pro', sans-serif;
  font-size: 100%;
  background: black;
  color: white;
  text-align: center; }

#logo {
  font-size: 250%;
  display: block;
  position: fixed;
  top: 0px;
  left: 8%;
  background-color: dodgerblue;
  color: white;
  padding: 20px 20px 20px 35px;
  z-index: 99;
  text-align: left;
  text-shadow: 1px 1px 20px rgba(0, 0, 0, 0.5);
  text-indent: -21px;
  -webkit-box-shadow: 1px 1px 30px rgba(50, 50, 50, 0.75);
  -moz-box-shadow: 1px 1px 30px rgba(50, 50, 50, 0.75);
  box-shadow: 1px 1px 30px rgba(50, 50, 50, 0.75);
  border-radius: 0px 0px 5px 5px; }
  #logo:hover {
    animation-name: focus;
    animation-duration: 1s;
    animation-iteration-count: 1;
    animation-delay: .01s;
    animation-fill-mode: forwards;
    -webkit-animation-name: focus;
    -webkit-animation-duration: 1s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-delay: .01s;
    -webkit-animation-fill-mode: forwards; }
  #logo span {
    color: lightskyblue;
    text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5); }

@-webkit-keyframes focus {
  from {
    -webkit-box-shadow: 1px 1px 30px rgba(50, 50, 50, 0.75);
    -moz-box-shadow: 1px 1px 30px rgba(50, 50, 50, 0.75);
    box-shadow: 1px 1px 30px rgba(50, 50, 50, 0.75);
    opacity: 1; }

  to {
    -webkit-box-shadow: 1px 1px 1px rgba(50, 50, 50, 0.75);
    -moz-box-shadow: 1px 1px 1px rgba(50, 50, 50, 0.75);
    box-shadow: 1px 1px 1px rgba(50, 50, 50, 0.75);
    opacity: .7; } }

@keyframes focus {
  from {
    -webkit-box-shadow: 1px 1px 30px rgba(50, 50, 50, 0.75);
    -moz-box-shadow: 1px 1px 30px rgba(50, 50, 50, 0.75);
    box-shadow: 1px 1px 30px rgba(50, 50, 50, 0.75);
    opacity: 1; }

  to {
    -webkit-box-shadow: 1px 1px 1px rgba(50, 50, 50, 0.75);
    -moz-box-shadow: 1px 1px 1px rgba(50, 50, 50, 0.75);
    box-shadow: 1px 1px 1px rgba(50, 50, 50, 0.75);
    opacity: .7; } }

section {
  box-shadow: 0 0 50px rgba(0, 0, 0, 0.8);
  height: 1000px;
  margin-bottom: 0;
  margin-left: auto;
  margin-right: auto;
  margin-top: 0;
  max-width: 1920px;
  position: relative;
  width: 100%;
  z-index: 9; }
  section article {
    padding-top: 30px;
    width: 890px;
    margin: 0 auto;
    color: white;
    padding-top: 100px;
    text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5); }
    section article h1 {
      text-align: center;
      width: 100%;
      font-size: 250%; }
    section article hr.dark {
      border: 0;
      height: 1px;
      background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
      background-image: -moz-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
      background-image: -ms-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
      background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0)); }
    section article hr.light {
      border: 0;
      height: 1px;
      background-image: -webkit-linear-gradient(left, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.75), rgba(255, 255, 255, 0));
      background-image: -moz-linear-gradient(left, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.75), rgba(255, 255, 255, 0));
      background-image: -ms-linear-gradient(left, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.75), rgba(255, 255, 255, 0));
      background-image: -o-linear-gradient(left, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.75), rgba(255, 255, 255, 0)); }

footer {
  line-height: 3em;
  margin: 0 auto; }

#home {
  background: white url(../img/road.jpg) no-repeat fixed 50% 0px;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  z-index: 10; }

.affixed {
  position: fixed;
  left: 0px;
  top: 0px;
  height: 165px !important;
  min-height: 165px !important; }

#home-divide {
  display: none;
  height: 165px; }

#about {
  background: url(../img/cloth.png) repeat center; }

#contact {
  background: url(../img/darkdenim.png) repeat center; }
  #contact form {
    width: 270px;
    margin: auto auto;
    line-height: 1.1em; }
    #contact form input, #contact form textarea, #contact form button {
      width: 250px;
      border: 1px solid #dedede;
      background: #595959;
      padding: 5px;
      font-size: 0.9em;
      color: white; }
    #contact form input:focus, #contact form textarea:focus {
      border: 1px solid dodgerblue; }
    #contact form label {
      display: block;
      letter-spacing: 1px; }
    #contact form input[type=submit] {
      background: #595959;
      color: white;
      width: 65%;
      margin: 40px;
      line-height: 1.3em; }
      #contact form input[type=submit]:hover {
        background: #7f7f7f; }

.borderradius #contact form input, .borderradius #contact form textarea, .borderradius #contact form button {
  border-radius: 5px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px; }

.bootstrap {
  display: inline-block;
  background: url("../img/multi-logo.png") no-repeat -311px -135px;
  width: 295px;
  height: 60px; }

.jquery {
  display: inline-block;
  background: url("../img/multi-logo.png") no-repeat -312px -51px;
  width: 300px;
  height: 70px; }

.csshtml {
  display: inline-block;
  background: url("../img/multi-logo.png") no-repeat -17px -13px;
  width: 288px;
  height: 204px; }
