
* {
  user-select: none;
  font-family: 'Montserrat';
  text-decoration: none !important;
}
a {
  text-decoration: none;
}

#app {
  /* z-index: -2; */
  display: flex;
  flex-direction: row;
  justify-content: center;    
  align-items: center;      
  height: 100vh;        
}


* img {
  pointer-events: none !important;
}
.maincontainer {
  z-index: 1;
  zoom: 110%;
  background-color: rgba(26, 26, 26, 1);
  width: 49.219vw;
  height: 31.302vw;
  background-image: url(/ecl.png);
  background-repeat: no-repeat;
  background-size: contain;
  border: 0.1vw solid rgba(255, 255, 255, 0.14);
  border-radius: 1.146vw;
}

body {
  margin: 0;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  height: 100vh;
  /* width: 100%; */
  background-color: rgb(255, 255, 0);
}


.titles {
  padding-left: 1vw;
  padding-top: 1vw;
  font-weight: 500;
  color: #fff;
  font-size: 1.094vw;
}

.description {
  font-size: 0.677vw;
  color: rgba(150, 150, 150, 1);
}

.categories {
  width: 47.969vw;
  height: 2.135vw;
  border: 0.1vw solid rgba(255, 255, 255, 0.1);
  border-radius: 2.24vw;
  margin: 0 auto;
  display: flex;
  align-items: center;
}

.category {
  color: #ffffff;
  transition: 0.2s linear;
  padding-top: 0.156vw;
  padding-right: 0.5vw;
  padding-bottom: 0.156vw;
  padding-left: 0.5vw;
  border-radius: 1.458vw;
  /* width: 4.896vw; */
  height: 1.146vw;
  margin-left: 1vw;
  font-size: 0.677vw;
  display: flex;
  justify-content: center;
  align-items: center;
}


.category.isuse {
  color: #000;
  background-color: rgba(162, 228, 10, 1);
}

.category.equip {
  padding: 0vw 1vw;
  border: 0.1vw solid rgba(162, 228, 10, 1);
  box-shadow: 0 0 0.4vw rgba(162, 228, 10, 1);
}
.guns {
  max-width: 50vw;
  max-height: 23vw;
  position: absolute;
  margin-left: 0.6vw;
  margin-top: 1vw;
  /* margin: 0 auto; */
  display: flex;
  gap: 0.5vw;
  overflow-y: scroll;
  overflow-x: hidden;
  flex-wrap: wrap;
}

::-webkit-scrollbar {
  width: 0vw;
  
}
.gun {
  flex-shrink: 0;
  flex-direction: column;
  display: flex;
  justify-content: center;
  position: relative;
  align-items: center;
  width: 11.615vw;
  height: 8.073vw;
  transition: 0.2s ease-in-out;
  /* transform: 0.2s ; */
  border-radius: 0.677vw;
  border: 0.1vw solid rgba(255, 255, 255, 0.09)
}

.imgun {
  width: 7.843vw;
  height: 3.958vw;
}

.namegun {
  position: absolute;
  display: flex;
  justify-content: center;
  font-size: 0.62vw;
  font-weight: 500;
  align-items: center;
  white-space: nowrap;
  background: rgba(162, 228, 10, 1);
  color: #000;
  /* width: 4.063vw; */
  padding-left: 0.7vw;
  padding-right: 0.7vw;
  height: 1.042vw;
  border-radius: 0.938vw;
  top: 0;
  left: 0;
  margin-top: 0.5vw;
  margin-left: 0.5vw;
  /* margin-top: -5vw; */
}

.box {
  border-radius: 50%;
  color: #fff;
  width: 1vw;
  height: 1vw;
  background-color: #000;
  display: flex;
  justify-content: center;
  align-items: center;
}

.pricegun {
  gap: 0.3vw;
  position: absolute;
  bottom: 0;
  right: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #ffffff;
  white-space: nowrap;
  border-radius: 1.667vw;
  font-size: 0.781vw;
  margin-bottom: 0.5vw;
  margin-right: 0.5vw;
  padding: 0.104vw 0.156vw;
}

.twocontainer {
  zoom: 110%;
  width: 17.813vw;
  margin-left: -0.89vw;
  height: 31.302vw;
  background-image: url(/ecl2.png);
  background-repeat: no-repeat;
  background-size: contain;
  z-index: 3;
  transition: 0.2s linear;      
  border-radius: 0 1.146vw 1.146vw 0;
  background-color: rgba(26, 26, 26, 1);
  border: 0.1vw solid rgba(255, 255, 255, 0.14)
}

.gunintwo {
  margin-left: 11%;
  margin-top: 1vw;
  /* margin: 0 auto; */
  background-color: rgba(255, 255, 255, 0.09);
  border: 0.1vw solid rgba(255, 255, 255, 0.09);
  border-radius: 0.677vw;
  width: 14.688vw;
  height: 9.167vw;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}

.gunimgintwo {
  width: 9.688vw;
  height: 4.896vw;
  zoom: 1.2;
}

.nameintwo {
  position: absolute;
  display: flex;
  justify-content: center;
  font-size: 0.62vw;
  font-weight: 500;
  align-items: center;
  white-space: nowrap;
  background: rgba(162, 228, 10, 1);
  color: #000;
  padding-left: 0.7vw;
  padding-right: 0.7vw;
  height: 1.042vw;
  border-radius: 0.938vw;
  top: 0;
  left: 0;
  margin-top: 0.5vw;
  margin-left: 0.5vw;
}

.settingsgun {
  color: #fff;
  display: flex;
  flex-direction: column;
  margin-left: 11%;
  margin-top: 1vw;
  font-weight: 500;
  row-gap: 1vw;
}

#setting {
  font-size: 0.7vw;
  padding-bottom: 0.3vw;
  width: 14.688vw;
  border-bottom: 0.1vw solid rgba(162, 228, 10, 1);
}

.priceintwo {
  width: 6vw;
  padding-right: 3.62vw;
  white-space: nowrap;
  height: 1.771vw;
  margin-left: 11%;
  margin-top: 5vw;
  color: #fff;
  display: flex;
  align-items: center;
  gap: 1vw;
  font-weight: 500;
  position: relative;
  font-size: 0.7vw;
  border-radius: 0.52vw;
  border: 0.1vw solid rgba(255, 255, 255, 0.1)
}

.boxinprice {
  /* position: absolute; */
  color: #000;
  width: 1.667vw;
  height: 1.667vw;
  background-color: rgba(162, 228, 10, 1);
  border-radius: 0.52vw;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 0.9vw;
  font-weight: 500;
  flex-shrink: 0;
}

.count {
  margin-left: 68%;
  zoom: 1.15;
  margin-top: -1.3vw;
  font-weight: 500;
  gap: 0.5vw;
  display: flex;
  color: #fff;
}

.add, .minus {
  width: 1vw;
  height: 1vw;
  background-color: #fff;
  border-radius: 0.26vw;
  color: #000;
  display: flex;
  font-weight: 500;
  font-size: 0.9vw;
  justify-content: center;
  align-items: center;
}

.textcount {
  font-size: 0.7vw;
}

.issmall {
  zoom: 0.9;
  width: 5.8vw;
}

.successbuy {
  margin-left: 11%;
  display: flex;
  color: #000;
  justify-content: center;
  align-items: center;
  font-size: 0.85vw;
  margin-top: 1.75vw;
  font-weight: 500;
  width: 14.688vw;
  height: 1.979vw;
  background: rgba(162, 228, 10, 1);
  border-radius: 0.52vw;
}

.gun:hover {
  border-color: rgba(162, 228, 10, 1);
  box-shadow: inset 0 0 1vw rgba(162, 228, 10, 1);
}