body {
  font-family: 'Rajdhani', sans-serif;
  background-image: radial-gradient(grey, black);
}

.main {
  height: 40%;
  color: white;
  font-size: 40px;
}

footer {
  padding: 80px;
  color: white;
  text-align: center;
  height: 15%;
}

nav {
  display: flex;
  justify-content: space-between;
}

ul {
  display: flex;
  list-style-type: none;
  width: 600px;
  justify-content: space-around;
  font-size: 30px;
}

li {
  text-decoration: none;
}

.logo {
  height: 70px;
  width: 70px;
  margin: 20px;
  border-radius: 5px;
}

h1 {
  font-family: 'Lobster', sans-serif;
  /* color: rgb(164, 199, 199); */
  color:burlywood;
  font-size: 100px;
  font-weight: 300;
  margin: 0px;
}

h2 {
  font-size: 60px;
  /* color: rgb(164, 199, 199); */
  color:burlywood;
  margin: 0px;
}

.skills-outer {
  margin-top: 100px;
}

.skills-h2 {
  margin-left: 25px;
}

.skills {
  display: flex;
  margin-top: ;
}

.skills2 {
  display: flex;
  margin-top: 10px;
  justify-content: center;
}

.skills-text {
  font-size: 25px;
  text-align: center;
}

.skills-logo {
  height: 60px;
  width: 65px;
  margin: 20px;
  justify-content: space-around;
  display: none;
}

.skill-name {
  margin: 15px;
}

.skill-name:hover {
  /* background-image: url(images/html5.png);
  background-repeat: no-repeat; */
  display: block;
}

.azure {
  color: white;
}

.gmail {
  font-size: 24px;
  font-weight: 450;
}

p {
  color: white;
}

.subtext {
  font-size: 20px;
  font-weight: ;
}

.main-area {
  display: flex;
  /* flex-direction: column; */
  height: 100%;
  justify-content: space-between;
  align-items: center;
  margin-top: 140px;
}

.main-text {
  margin-left: 50px;
  margin-bottom: 200px;
}

.button {
  width: 200px;
  height: 45px;
  background-image: linear-gradient(rgb(120, 49, 23), rgb(197, 81, 38), rgb(120, 49, 23));
  border-radius: 30px;
  text-align: center;
  font-size: 30px;
  padding-top: 5px;
  margin-top: 20px;
  margin-bottom: 20px;
}

.button:hover {
  background-color: rgb(255, 153, 116);
}

.button:active {
  background-color: darkgrey;
  color: rgb(194, 194, 194);
}

.socials {
  padding-bottom: 200px;
  margin: 20px;
  margin-bottom: 100px;
}

.social-div {
  text-align: center;
  font-size: 30px;
  margin:20px;
}

.social-logo {
  height: 60px;
}

.social-link {
  text-decoration: none;
}

.sub-section1 {
  display: flex;
  justify-content: space-around;
  height: 30%;
  padding: 75px;
}

.sub-section2 {
  display: flex;
  flex-direction: column;
  text-align: center;
  padding: 80px;
  margin-top: 100px;
  margin-bottom: 100px;
}

.headshot {
  width: 300px;
  height: 300px;
  border-radius: 150px;
}

.headshot-container {
  display: flex;
  align-items: center;
}

.project-card {
  background-color: rgb(158, 166, 166);
  width: 300px;
  height: 500px;
  border-radius: 10px;
  box-shadow: 5px 5px 20px rgb(44, 44, 44);
  margin: 10px;
}

.project-container {
  display: flex;
  justify-content: space-around;
}

@media only screen and (max-width: 1000px) {
  .project-container {
    display: flex;
    flex-wrap: wrap;
  }
}

.project-image {
  margin-top: 25px;
  width: 250px;
  border-radius: 125px;
}

.main-hr1 {
  border-width: 3px;
  margin-right: 45em;
  margin-bottom: 3em;
  border-style:double;
  color: burlywood;
}

.main-hr2 {
  border-width: 3px;
  margin-left: 45em;
  margin-top: 3em ;
  border-style:double;
  color: burlywood;
}

.footer {
  border-width: 3px;
  margin-left: 15em;
  margin-right: 15em;
  margin-top: 3em;
  margin-bottom: 3em;
  border-style:double;
  color: burlywood;
}

.card-hr {
  margin-left: 20px;
  margin-right: 20px;
}

.project-link {
  text-align: none;
  color: rgb(225, 222, 26);
}

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

.hamburger {
  display: none;
}

.hamburger:focus{
  outline: 0;
}

@media only screen and (max-width: 1000px) {
  .hamburger {
    display: block;
    border: 0;
    background-color: transparent;
    color: rgb(185, 201, 201);
    font-size: 30px;
    margin: 20px;
    align-self: flex-end;
  }

  ul {
    display: none;
    margin: 0px;
  }

  ul.show {
    display: block;
  }

  li {
    padding-bottom: 15px;
  }

  nav {
    display: flex;
    flex-direction: column-reverse;
    background-image: linear-gradient(rgb(15, 15, 15), rgb(62, 56, 45), rgb(15, 15, 15));
  }
  .logo {
    height: 80px;
    width: 80px;
    display: none;
  }
}