html {
  box-sizing: border-box;
  font-size: 16px;
  font-family: quicksand;
}

* {
  margin: 2px;
  padding: 0;
  box-sizing: border-box;
}

::before,
::after {
  box-sizing: inherit;
}

* {
  box-sizing: border-box;
} /* effect slideshow container*/

/* Header */

.header-school {
  background-color: #bbe1d4;
  text-align: center;
  font-size: 160%;
  padding: 5px 0;
  color: #1d3f43;
  display: block;
}

/* Navagation Footer */
.back-home {
  width: 70px;
  margin-left: 0px;
  padding: 5px;
  border-radius: 5px;
  background-color: #1d3f43;
  text-align: center;
  display: flex;
  position: fixed;
  bottom: 5px;
  z-index: 2;
}
.back-home img {
  height: 60px;
  margin-left: auto;
}

.back-home a {
  color: #bbe1d4;
  font-size: 90%;
  text-decoration: none;
}

.signin {
  background-color: #ad9e92;
  margin-left: -10px;
  display: block;
  position: fixed;
  width: 100%;
  text-align: center;
  bottom: 0;
  z-index: 1;
}

.btn-login {
  width: 300px;
  font-size: 120%;
  background-color: #3a5551;
  color: #bbe1d4;
  padding: 10px;
  border-radius: 5px;
  margin: 20x 20px;
}

.signin-header {
  width: 200px;
  margin: auto;
  font-size: 200%;
  font-weight: 600;
  color: #1d3f43;
  padding: 10px;
}

.future-schools {
  display: block;
  font-size: 90%;
}
.future-schools a {
  color: #1d3f43;
}

.future-schools a:hover {
  color: #71c59a;
}
button:hover {
  background-color: #bbe1d4;
  color: #1d3f43;
  font-weight: 700;
}
.future-schools img {
  width: 30%;
  display: block;
  margin: auto;
}

.empty-space {
  display: block;
  width: 100%;
  height: 300px;
  color: white;
}
/* Forms */
#signin {
  display: none;
}

.school-portfolio-container {
  position: fixed;
  max-width: 60%;
  background-color: rgba(173, 158, 146, 0.95);
  padding: 20px;
  border-radius: 30px;
  display: block;
  left: 35%;
  top: 50%;
  overflow: auto;
  z-index: 1;
}

.school-portfolio-container input[type="text"] {
  width: 100%;
  padding: 10px;
}

.closing-btn {
  text-align: center;
  border-radius: 5px;
  border: #1d3f43 solid 2px;
  background-color: #ad9e92;
  width: 6%;
  color: #1d3f43;
  float: right;
}

.school-portfolio-container label {
  color: #1d3f43;
  font-weight: 600;
  font-size: 120%;
  padding-bottom: 20px;
}

.form-heading {
  text-align: center;
  color: #1d3f43;
  font-size: 140%;
  font-weight: 600;
  margin-bottom: 15px;
}

.submit-btn {
  margin-top: 20px;
  font-size: 120%;
  background-color: #71c59a;
  border-radius: 5px;
  padding: 5px 20px;
  text-align: center;
  margin-left: 35%;
  color: #3a5551;
  border: #3a5551 solid 2px;
}

.copyright {
  text-align: center;
  font-size: 60%;
}

/* Gallery */
.gallery {
  display: grid;
  grid-template-columns: repeat(10, 3fr);
  grid-template-rows: repeat(10, 5vw);
}

.gallery__img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  padding: -10px;
  display: block;
}

.gallery__item--1 {
  grid-column-start: 1;
  grid-column-end: 5;
  grid-row-start: 1;
  grid-row-end: 6;
}

.gallery__item--2 {
  grid-column-start: 5;
  grid-column-end: 8;
  grid-row-start: 5;
  grid-row-end: 11;
}

.gallery__item--3 {
  grid-column-start: 1;
  grid-column-end: 5;
  grid-row-start: 6;
  grid-row-end: 13;
}

.gallery__item--4 {
  grid-column-start: 5;
  grid-column-end: 8;
  grid-row-start: 1;
  grid-row-end: 5;
}

.gallery__item--5 {
  grid-column-start: 5;
  grid-column-end: 12;
  grid-row-start: 11;
  grid-row-end: 14;
}

.gallery__item--6 {
  grid-column-start: 8;
  grid-column-end: 12;
  grid-row-start: 1;
  grid-row-end: 6;
}

.gallery__item--7 {
  grid-column-start: 8;
  grid-column-end: 12;
  grid-row-start: 6;
  grid-row-end: 11;
}

.gallery__item--8 {
  grid-column-start: 1;
  grid-column-end: 3;
  grid-row-start: 13;
  grid-row-end: 14;
}

.gallery__item--9 {
  grid-column-start: 3;
  grid-column-end: 5;
  grid-row-start: 13;
  grid-row-end: 14;
}

.gallery__item--10 {
  grid-column-start: 1;
  grid-column-end: 6;
  grid-row-start: 14;
  grid-row-end: 16;
}

.gallery__item--11 {
  grid-column-start: 6;
  grid-column-end: 12;
  grid-row-start: 14;
  grid-row-end: 16;
}

.gallery__item--12 {
  grid-column-start: 1;
  grid-column-end: 4;
  grid-row-start: 16;
  grid-row-end: 18;
}

.gallery__item--13 {
  grid-column-start: 4;
  grid-column-end: 7;
  grid-row-start: 16;
  grid-row-end: 18;
}
.gallery__item--14 {
  grid-column-start: 7;
  grid-column-end: 12;
  grid-row-start: 16;
  grid-row-end: 17;
}

.gallery__item--15 {
  grid-column-start: 7;
  grid-column-end: 9;
  grid-row-start: 17;
  grid-row-end: 17;
}

.gallery__item--16 {
  grid-column-start: 9;
  grid-column-end: 12;
  grid-row-start: 17;
  grid-row-end: 19;
}

.gallery__item--17 {
  grid-column-start: 1;
  grid-column-end: 4;
  grid-row-start: 18;
  grid-row-end: 19;
}

.gallery__item--18 {
  grid-column-start: 4;
  grid-column-end: 7;
  grid-row-start: 18;
  grid-row-end: 20;
}

.gallery__item--19 {
  grid-column-start: 7;
  grid-column-end: 9;
  grid-row-start: 18;
  grid-row-end: 19;
}

.gallery__item--20 {
  grid-column-start: 1;
  grid-column-end: 4;
  grid-row-start: 19;
  grid-row-end: 20;
}

.gallery__item--21 {
  grid-column-start: 7;
  grid-column-end: 12;
  grid-row-start: 19;
  grid-row-end: 20;
}

.gallery__item--22 {
  grid-column-start: 1;
  grid-column-end: 3;
  grid-row-start: 20;
  grid-row-end: 22;
}

.gallery__item--23 {
  grid-column-start: 3;
  grid-column-end: 12;
  grid-row-start: 20;
  grid-row-end: 24;
}

.gallery__item--24 {
  grid-column-start: 1;
  grid-column-end: 3;
  grid-row-start: 22;
  grid-row-end: 24;
}

.gallery__item--25 {
  grid-column-start: 1;
  grid-column-end: 7;
  grid-row-start: 24;
  grid-row-end: 25;
}

.gallery__item--26 {
  grid-column-start: 7;
  grid-column-end: 12;
  grid-row-start: 24;
  grid-row-end: 25;
}

.gallery__item--27 {
  grid-column-start: 1;
  grid-column-end: 3;
  grid-row-start: 25;
  grid-row-end: 26;
}

.gallery__item--28 {
  grid-column-start: 3;
  grid-column-end: 8;
  grid-row-start: 25;
  grid-row-end: 26;
}
.gallery__item--29 {
  grid-column-start: 8;
  grid-column-end: 12;
  grid-row-start: 25;
  grid-row-end: 27;
}
.gallery__item--30 {
  grid-column-start: 1;
  grid-column-end: 4;
  grid-row-start: 26;
  grid-row-end: 26;
}
.gallery__item--31 {
  grid-column-start: 4;
  grid-column-end: 8;
  grid-row-start: 26;
  grid-row-end: 27;
}

.gallery__item--32 {
  grid-column-start: 1;
  grid-column-end: 3;
  grid-row-start: 27;
  grid-row-end: 28;
}

.gallery__item--33 {
  grid-column-start: 3;
  grid-column-end: 6;
  grid-row-start: 27;
  grid-row-end: 27;
}

.gallery__item--34 {
  grid-column-start: 6;
  grid-column-end: 12;
  grid-row-start: 27;
  grid-row-end: 29;
}

.gallery__item--35 {
  grid-column-start: 1;
  grid-column-end: 6;
  grid-row-start: 28;
  grid-row-end: 29;
}

.gallery__item--36 {
  grid-column-start: 1;
  grid-column-end: 3;
  grid-row-start: 29;
  grid-row-end: 30;
}

.gallery__item--37 {
  grid-column-start: 1;
  grid-column-end: 3;
  grid-row-start: 29;
  grid-row-end: 30;
}

.gallery__item--38 {
  grid-column-start: 3;
  grid-column-end: 5;
  grid-row-start: 29;
  grid-row-end: 30;
}

.gallery__item--39 {
  grid-column-start: 5;
  grid-column-end: 7;
  grid-row-start: 29;
  grid-row-end: 30;
}

.gallery__item--40 {
  grid-column-start: 7;
  grid-column-end: 9;
  grid-row-start: 29;
  grid-row-end: 30;
}

.gallery__item--41 {
  grid-column-start: 9;
  grid-column-end: 12;
  grid-row-start: 29;
  grid-row-end: 30;
}