.body {
  margin: 0;
  padding: 0;
}

#wwd {
  transition: transform 0.8s;
}

#wwd:hover {
  transform: scale(1.2);
}

.navbar-collapse {
  flex-grow: 0;
}

.btn {
  display: inline-flex;
}

.btn.btn-primary {
  background-color: rgb(71, 163, 71);
  border: none;
  border-radius: 0rem;
  margin: 0.5rem;
}

.map {
  padding: 5%;
}

.address {
  justify-content: center;
  font-size: 1.5rem;
}

.smi {
  display: flex;
  justify-content: center;
}

.A {
  display: flex;
}

.logo {
  width: 50px;
  height: 50px;
}

.icon-a,
.icon-b,
.icon-c,
.icon-d,
.icon-e,
.icon-f,
.icon-g {
  margin: 4px;
}

@media only screen and (min-width: 280px) and (max-width: 319px) {
  .map {
    height: 300px;
  }
  .address {
    padding: 0;
    font-size: 1.2em;
  }
  .location {
    height: 400px;
    margin-right: 10px;
  }
  .smi {
    width: 250px;
    margin-left: 10px;
  }
  .icon-a {
    margin-bottom: 10px;
  }

  .icon-e {
    margin-left: 30px;
  }
  .A {
    margin-left: 20px;
  }
}

@media only screen and (min-width: 320px) and (max-width: 359px) {
  .map {
    height: 300px;
  }
  .address {
    padding: 0;
    font-size: 1.2em;
  }
  .location {
    height: 320px;
  }

  .smi {
    width: 300px;
    margin-left: 30px;
  }

  .icon-a {
    margin: 5px;
  }
  .icon-e {
    margin-left: 35px;
  }

  .A {
    margin-left: 20px;
  }
}

@media only screen and (min-width: 360px) and (max-width: 374px) {
  .map {
    height: 350px;
  }
  .address {
    padding: 0;
  }

  .location {
    height: 360px;
  }

  .smi {
    width: 300px;
    margin-left: 40px;
  }

  .icon-a {
    margin: 5px;
  }
  .icon-e {
    margin-left: 35px;
  }

  .A {
    margin-left: 20px;
  }
}

@media only screen and (min-width: 375px) and (max-width: 410px) {
  .map {
    height: 300px;
  }
  .address {
    padding: 0;
    font-size: 1.2em;
  }
  .location {
    height: 320px;
  }
  .smi {
    width: 300px;
    margin-left: 50px;
  }

  .icon-a {
    margin: 5px;
  }
  .icon-e {
    margin-left: 35px;
  }

  .A {
    margin-left: 50px;
  }
}

@media only screen and (min-width: 411px) and (max-width: 413px) {
  .map {
    height: 350px;
  }
  .address {
    padding: 0;
  }
  .smi {
    width: 300px;
    margin-left: 70px;
  }
  .location {
    height: 360px;
  }

  .icon-a {
    margin: 5px;
  }
  .icon-e {
    margin-left: 35px;
  }

  .A {
    margin-left: 20px;
  }
}

@media only screen and (min-width: 414px) and (max-width: 539px) {
  .map {
    height: 300px;
  }
  .address {
    padding: 0;
    font-size: 1.2em;
  }
  .location {
    height: 320px;
  }
  .smi {
    width: 300px;
    margin-left: 70px;
  }

  .icon-a {
    margin: 5px;
  }
  .icon-e {
    margin-left: 35px;
  }

  .A {
    margin-left: 60px;
  }
}

@media only screen and (min-width: 540px) and (max-width: 767px) {
  .map {
    height: 500px;
  }
  .address {
    padding: 0;
    margin-left: 10px;
    font-size: 1.5em;
  }
  .location {
    height: 300px;
  }
  .smi {
    width: 500px;
    margin-left: 0;
  }
  .A {
    margin-left: 90px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .map {
    height: 400px;
  }
  .address {
    padding: 0;
    margin-left: 10px;
    font-size: 1.5em;
    margin-top: 50px;
  }
  .location {
    height: 300px;
  }
  .icon-a {
    margin: 5px;
  }
  .icon-e {
    margin-left: 30px;
  }
  .smi {
    width: 300px;
    margin-left: 40px;
  }
}

@media only screen and (min-width: 1024px) and (max-width: 1260px) {
  .map {
    width: 500px;
    height: 475px;
    margin: 0;
  }
  .smi {
    width: 450px;
    margin-left: 20px;
  }
  .A {
    margin-left: 50px;
  }
  .address {
    margin-top: 100px;
  }

  .navbar-nav {
    margin-left: 50px;
  }
}

@media only screen and (min-width: 1261px) {
  .map {
    width: 650px;
    height: 500px;
  }
  .smi {
    width: 500px;
    padding: 0;
    margin-left: 50px;
  }

  .address {
    margin-top: 100px;
    padding-left: 50px;
  }

  .A {
    margin-left: 60px;
  }

  .navbar-nav {
    margin-left: 400px;
  }

  .goc {
    margin-left: 130px;
  }
}