@media(max-width:600px) {
 .card2 {
  width: 16rem
 }

 .card2 img {
  height: 8em
 }
}
@media(max-width:640px) {
 .paddingTop {
  padding-top: 25px
 }

 .paddingTopContent {
  padding-top: 52px
 }

 .banner {
  width: 100%;
  height: 300px
 }

 .img-card-album {
  width: 100%
 }

 .img-card-merch {
  width: 100%;
  height: 200px
 }

 .logo-demajors {
  width: 80px;
  height: 50px
 }

 .navbar-brand {
  float: right;
  margin-top: -45px;
  margin-right: -10px
 }

 .wrap-nav {
  left: 0;
  position: fixed;
  z-index: 999;
  width: 100%;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19)
 }
}

@media only screen and (max-device-width:640px) {
 .picture {
  width: 100%;
  height: 250px;
  object-fit: cover
 }
}


@media(min-width:768px) {
 .card2 {
  width: 25rem;
  height: 20rem
 }

 .card2 img {
  height: 11em
 }
}

@media(min-width:1025px) {
 .container-navbar{
   margin: 0;
   padding: 0;
   width: 100%;
   max-width: none;
   margin-bottom:20px;
 }
 .paddingTop {
  padding-top: 40px
 }

 .banner {
  width: 100%;
  height: 600px
 }

 .img-card-album {
  width: 100%
 }

 .img-card-merch {
  width: 100%;
  height: 300px
 }

 .logo-demajors {
  width: 110px;
  height: 65px;
  object-fit: contain
 }

 .wrap-nav {
  z-index: 999;
  width: 100%;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19)
 }
 .picture {
  width: 100%;
  height: 420px;
  object-fit: cover
 }
}
@media only screen and (min-width:2000px) {
 .paddingTop {
  padding-top: 120px
 }

 .banner {
  width: 100%;
  height: 800px
 }

 .img-card-album {
  width: 100%
 }

 .img-card-merch {
  width: 100%;
  height: 300px
 }

 .logo-demajors {
  width: 110px;
  height: 65px
 }

 .wrap-nav {
  z-index: 999;
  width: 1110px;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19)
 }
}