* {
  box-sizing: border-box;
  list-style: none;
  font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
}

body {
  margin: 0px;
}

header {
  background-color: black;
}

.banner {
  background-image: url(images/banner2.gif);
  height: 20vw;
  min-height: 100px;
  background-repeat: no-repeat;
  background-position: top center;
  background-size: 30%;
  background-attachment: fixed;
  /* for fixing banner */
}

footer,
nav {
  display: flex;
  background-color: #333;
}

footer a,
nav a {
  display: block;
  color: white;
  text-decoration: none;
  text-align: center;
  padding: 14px 20px;
  float: left;
}

.flex-align-right {
  margin-left: auto;
  /* login & copyright right */
}

.menu-btn:hover {
  background-color: #ddd;
  color: black;
}

section {
  text-align: center;
  height: 100%;
  padding: 75px 0px;
  min-height: 40vh;
}

section:nth-child(even) {
  background-color: #ececec;
}

a img {
  padding: 0px 20px;
  height: 70%;
}

h2 {
  padding-bottom: 40px;
}

section h5 {
  margin: 0px 130px;
}

section h2 span {
  background: linear-gradient(to right, #f5d837, #bbb812);
  /* for gradient */
  padding: 10px 55px;
  border-radius: 20px;
  color: white;
}

.carousel-cell {
  width: 66%;
  margin-right: 10px;
  border-radius: 5px;
}

.carousel-cell {
  max-width: 100%;
}

.img-responsive {
  max-width: 100vh;
  height: 100vh;
}

.profile_img {
  border-radius: 50%;
  width: 200px;
  height: 200px;
}

.profile_name {
  font-size: 2em;
  font-weight: 900;
  letter-spacing: 4px;
  word-spacing: 10px;
  text-transform: uppercase;
  margin: 20px 0px 30px 0px;
}

.sm-handle a {
  background-color: rgb(125 125 125 / 25%);
  padding: 10px 15px;
  border-radius: 30px;
  margin: 5px 10px;
  text-decoration: none;
  font-size: 1.25em;
}

.sm-handle a:hover {
  background-color: rgb(30 30 30 / 25%);
}

.sm-handle a i {
  margin: 5px;
}

.linkedin-handle {
  color: #0e76a8;
}

.insta-handle {
  color: #dd2a7b;
}

.about_us {
  margin: 50px;
}

.about_title {
  font-size: 1.45em;
  padding: 0px 10px;
  color: #120f5e;
}

.about_content {
  color: #1c1a3a;
  font-weight: 900;
  padding-bottom: 10px 0px 20px 0px;
}

.card {
  margin-bottom: 30px;
}

.card img {
  height: 320px;
  width: 700px;
  border-radius: 7px;
  margin: auto;
  margin-top: 15px;
}

.teachers {
  height: 400px;
  width: 400px;
  border-radius: 10px;
}

#teacher_name {
  margin-top: 15px;
}

#welcome {
  text-align: left;
  color: #252257;
  margin: 0px 30px 50px 30px;
}

.about {
  height: 340px;
  width: 340px;
  margin-right: 10px;
  border-radius: 30% 1%;
}

.text {
  margin: 115px;
}

@media screen and (max-width: 700px) {
  footer,
  nav {
    flex-direction: column;
    padding: 10px 0px;
  }
  .flex-align-right {
    margin-left: 0;
    /* for default position of login & copyright */
  }
}