@media only screen and (min-width: 1000px) {

/*Here we style the Index for the desktop version*/

.indexpage {
  display: flex;
  flex-direction: row;
}

.leftcolumn {
  display: flex;
  flex-direction: column;
  width: 20%;
  border-radius: 6px;
  background: linear-gradient( #ffff00, #ffd700, #daa520);
}

.search-div {
  margin: 10px 0;
}

.middle {
  height: 100%;
}

.middle p {
  margin-top: 20px;
}

.middle ul li {
  margin: 12px auto;
}

.middle a {
  text-decoration: none;
}

.right-index p {
  margin-top: 60px;
  text-align: center;
}

.right-index-list {
  display: flex;
  flex-direction: row;
  text-align: center;
  margin: 60px 0px;
  font-size: 20px;
}

.right-index-list p {
  text-align: center;
  margin: 60px 100px;
  font-size: 16px;
}

/* login.php Style the input container */

.login-form {
  width: 20%;
  height: auto;
  margin: 140px auto;
}

.login-form p {
  text-align: center;
  font-size: 28px;
  font-weight: 400;
  margin: 40px;
}

/* signup.php */

.signup-form {
  display: flex;
  flex-direction: column;
  width: 30%;
  margin: 80px auto;
  padding: 10px;
}

.signup-form p {
  text-align: center;
  font-size: 28px;
  font-weight: 500;
  margin: 20px auto;
}

.signup-form input {
  width: 300px;
  height: 30px;
  margin: 10px auto;
  border: 1px solid #ccc;
  border-radius: 4px;
  background-color: #F6F6F6;
  font-family: arial;
}

.signuperror {
  padding-top: 14px !important;
  font-family: arial !important;
  font-size: 16px !important;
  color: red !important;
  text-align: center !important;
}

.signupsuccess {
  padding-top: 14px !important;
  font-family: arial !important;
  font-size: 16px !important;
  color: green !important;
  text-align: center !important;
}

/*Here we style Reset Password for Desktop*/

.resetpwd {
  margin: 40px auto;
}

.resetpwd p {
  margin: 40px auto;
  font-size: 24px;
}

.resetpwd h2 {
  margin: 40px auto;
}

.form-resetpwd {
  width: 30%;
}

/*Here we style Aboutus for Desktop*/

.aboutus {
  display: flex;
  flex-direction: row;
  margin: 5px;
}

.justme {
  margin: 5px;
}

.justme h2 {
  margin: 10px;
}

.justme img {
  margin: 10px;
}

.justme a {
  margin: 10px;
  text-decoration: none;
}

.aboutmeinfo {
  margin: 20px;
  font-style: italic;
}

.aboutmeinfo p {
  font-size: 18px;
  line-height: 20px;
}

.aboutmeinfo ul li {
  line-height: 22px;
  font-size: 16px;
}

/*Here we style Resume for Desktop*/

.resume-main {
  display: flex;
  flex-direction: row;
  width: 100%;
}

.leftresume {
  width: 15%;
  height: 100%;
  margin: 20px 10px;
}

.certificates {
  width: 150px;
  height: 100px;
  margin: 10px 3px;
  color: white;
  text-align: center;
}

.rightresume {
  margin-left: 200px;
  text-align: center;
}

.resume-header p {
  margin: 20px;
  font-size: 20px;
  font-weight: 400;
  text-align: center;
}

.contents {
  width: 180px;
  margin: 20px 0px;
  border-bottom: 4px double #333;
}

.education {
  margin: 10px 40px;
  display: block;
  line-height: 20px;
}

.schools {
  display: block;
  margin: 20px 60px;
  line-height: 20px;
  border-bottom: 4px double #333;
}

/*here we style Contact us for Desktop*/

.contactus {
  width: 80%;
  height: 450px;
  margin: auto;
  border-radius: 6px;
}

.contact-us p {
  text-align: center;
  flex-wrap: wrap;
  font-size: 22px;
  font-weight: 500;
  margin: 40px 0;
}

.contact-form {
  width: 30%;
  height: 500px;
  margin: 10px auto;
  padding: 10px;
}

.contact-form input {
  width: 90%;
  height: 30px;
  margin: 10px auto;
}

.contact-form textarea {
  margin: 5px auto;
}

/* Gallery */

.right {
  width: 100%;
}

.gallery-links p {
  font-size: 28px;
  font-weight: 500;
  margin: 10px;
  text-align: center;
}

.gallery-container {
  min-height: 600px;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  grid-template-rows: auto;
  grid-gap: 10px;
}

.gallery-container a {
  text-decoration: none;
  margin: 20px;
}

.gallery-container div {
  background-size: contain;
  height: 100px;
}

.gallery-container a h3 {
  font-size: 14px;
  font-weight: 600;
  color: #000;
  padding: 6px 0;
}

.gallery-container a p {
  text-align: center;
  font-size: 14px;
  font-weight: 400;
}

.gallery-container div:hover {
  width: 260px;
  height: 160px;
  padding: 1em;
  border-radius: 0.75em;
}

/* Gallery form */

.upload-form {
  display: flex;
  width: 340px;
  height: auto;
  margin: 10px auto;
  border-radius: 6px;
}

.gallery-upload form input {
  display: flex;
  flex-direction: column;
  width: 300px;
  height: 30px;
  margin: 5px auto;
  line-height: 10px;
  border: 1px solid #ccc;
  border-radius: 6px;
  background-color: #F6F6F6;
}


}