:root {
  --primary-1: #5A1E19;
  --primary-2: #A16429;
  --primary-3: #F7A823;
  --primary-4: #fddb05;
  --primary-5: #b83907;
  --primary-6: #C46F2B;
  --primary-7: #BD480E;
  --white: white;
  --background-primary-1: linear-gradient(to right,#C85409 0%,#EE8619 100%);
  --loader-background-color: #8e8e8b;
  --loader-highlight-color: #bbbbb9;
}

html,
body {
  overflow-x: hidden; 
}



.gallery-fancybox img{
  width: 100%;
  object-fit: cover;
  border-radius: 0px;
  /*height: 230px;*/
  box-shadow: 0 .5rem 1rem rgba(0,0,0,.5)!important;
}

.bggallery{
  background-color: var(--primary-3)!important;
  position: relative;
    background: url(../web/img/bg/bg.png) center center no-repeat;
    background-size: cover;
}




.border-card{
  position: relative;
  z-index: 1;
}



/* new */


.upload-label {
   cursor: pointer;
   display: block;
   /*max-width: 800px;*/
}
.upload-label-preview{
  background: grey;
  width: 100%;
  /*max-width: 400px;*/
  height: 400px;
  border-radius: 5px;
  object-fit: cover;
}

.upload-input-img {
   opacity: 0;
   position: absolute;
   z-index: -1;
   width: 50px;
}

.img-preview{
  width: 100%;
  height: 400px;
  object-fit: cover;
}

.img-preview-pic{
  width: 100%;
  height: 400px;
  object-fit: cover;
}

.image-container {
  position: relative;
}

.icon-class {
  cursor: pointer;
  position: absolute;
  top: 5%;
  left: 50%; 
  transform: translate(-10%, -50%);
  font-size: 24px; 
  color: white;
}

.icon-class-large{
  top: 20%;
  left: 5%;
  transform: translate(-1%, -50%);
  color: red;
  font-size: 28px; 
}


.skeleton-loader {
    width: 100%;
    height: 30px;
    background: linear-gradient(90deg, var(--loader-background-color) 25%, var(--loader-highlight-color) 50%, var(--loader-background-color) 75%);
    background-size: 200% 100%;
    animation: loading 2s infinite ease-in-out;
    border-radius: 8px;
    margin-bottom: 0px;
}

.avatar-skeleton {
    width: 100px;
    height: 100px;
    background: linear-gradient(90deg, var(--loader-background-color) 25%, var(--loader-highlight-color) 50%, var(--loader-background-color) 75%);
    background-size: 200% 100%;
    animation: loading 2s infinite ease-in-out;
    border-radius: 50%;
    margin-bottom: 0px;
}

.cover-image-skeleton {
    width: 100%;
    height: 200px;
    background: linear-gradient(90deg, var(--loader-background-color) 25%, var(--loader-highlight-color) 50%, var(--loader-background-color) 75%);
    background-size: 200% 100%;
    animation: loading 2s infinite ease-in-out;
    border-radius: 8px;
    margin-bottom: 0px;
}

@keyframes loading {
    0% {
        background-position: 200% 0;
    }
    100% {
        background-position: -200% 0;
    }
}


.gallery-img img{
  object-fit: cover;
  object-position: center center;
  height: 180px;
}
.gallery-img-template{
  width: 100%;
  height: 180px;
}
.product-item-size-img-skeleton{
  height: 175px;
}
@media screen and (min-width:992px) {

    .product-item-size-img-skeleton{
      height: 300px;
    }
}


.fade-in {
  opacity: 0;
  transform: translateY(10px);
  animation: fadeInUp 0.6s ease forwards;
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.hide-before-load{
  display: none;
}

.text-painting-styles{
  font-size: 1rem;
}