﻿.about, .skills, .experience, .contact, .hobbies, .education, .portfolio {
  position: relative;
  opacity: 1;
  -webkit-background-attachment: fixed;
  -moz-background-attachment: fixed;
  -o-background-attachment: fixed;
  background-attachment: fixed;

  background-position: center;
  background-repeat: no-repeat;

  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  min-height: 100%;

}

.about, .portfolio {
  background-image: url('../images/backgrounds/default.jpg');
}

.skills {
  background-image: url('../images/backgrounds/1.jpg');
}

.education {
  background-image: url('../images/backgrounds/default.jpg');
}

.experience {
  background-image: url('../images/backgrounds/2.jpg');
  background-position: right;
}

.hobbies {
  background-image: url('../images/backgrounds/3.jpg');

}

.contact {
  background-image: url('../images/backgrounds/4.jpg');
}

.experience .container .experience-content .timeline {
  background: rgba(0, 0, 0, 0.80);
}

.skills .container .skills-content {
  background: rgba(0, 0, 0, 0.80);
}

.hobbies .container .hobbies-content {
  background: rgba(0, 0, 0, 0.80);
}

@media only screen and (max-width: 500px) {

  .about {
    background: url('../images/backgrounds/mobile/default.jpg');
    background-position: center top;
  }

  .education {
    background: url('../images/backgrounds/mobile/default.jpg');
    background-position: center top;
  }

  .skills {
    background: url('../images/backgrounds/mobile/skills.jpg');
    background-position: center top;
  }

  .experience {
    background: url('../images/backgrounds/mobile/experiences.jpg');
    background-position: center top;
  }

  .hobbies {
    background: url('../images/backgrounds/mobile/hobbies.jpg');
    background-position: center top;
  }

  .contact {
    background: url('../images/backgrounds/mobile/map.jpg');
    background-position: center center;
  }

  .experience .container .experience-content .timeline {
    background: rgba(0, 0, 0, 0.80);
  }

  .skills .container .skills-content {
    background: rgba(0, 0, 0, 0.80);
  }

  .hobbies .container .hobbies-content {
    background: rgba(0, 0, 0, 0.80);
  }
}