.light-theme{
  --sword: url("/assets/images/sword_silver.svg");
  --boxShadowSword:0 0 150px 125px hsla(229, 76%, 66%, .4);
}
.dark-theme{
  --sword: url("/assets/images/sword_pink.svg");
  --boxShadowSword:0 0 150px 125px rgba(255, 0, 212, 0.5);
}

@media(width>50px){
  .container-hero{
    flex-flow: column wrap !important;
    border:2px solid red;
    padding: 0 !important;
    margin:0 !important;
   width:fit-content !important;
   display:block
  }
  .right img{
    width:100%;
    margin:0;
    object-fit: cover;
  }
}
@media(width>450px){
  .hero-container{
    display:flex;
    justify-content: center;
    padding:80px 0px 0px 0px;
  }
  .right{
    margin:0px 0px 0px 0px;
    padding:0px 40px;
  }
  .heroTitle{
    margin:0;
  }
}
@media(width>800px){
  .right img{
    width:140px;
  }
  .right{
    padding:0px 140px;
  }
}
@media(width>950px){
  .right img{
width:1250px;
max-height: 200px;
  }
  .hero-container{
    justify-content: flex-end;
    flex-flow:column nowrap;
    position:relative;
    z-index:2;
    background-color: var(--background-secondary);
  }
}

.hero-container{

  /* border:2px solid green; */
  align-items:center;
}


.heroTitle{
/* border: 2px solid green; */
padding:0px 0px 0px 20px;
/* border:2px solid red; */
}
.img-box{
  margin:0;
  align-self: center;
  justify-self: center;
  /* background-color: red; */
}
.right{
  /* width:200px; */
  flex-grow: 2;
  min-height: 50px;
  /* max-width: 200px; */
  /* border:2px solid red; */
  text-align: right;
  z-index: 2 ;
  position:relative;
  /* background-color: var(--background-primary); */

}
.right img{

border-radius: 0 0 280px 230px;
transition: .4s;
position: relative;
/* margin-right: 106px; */
}