.fng-meter {
  background: #f5f5f5;
  padding: 1rem;
  width: auto;
  display: flex;
  align-items: center;
  border-radius: 10px; 
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); 
  justify-content: center;
}
.main-div-fng
{   
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-bottom: 5%;
}
  .fng-content-div {
    padding: 10px;
    text-align: center;
}

.fng-meter h3 {
  font-size: 1rem;
  color: #333;
  margin-top: -20px;
  font-weight: bold;
}

.fng-value-container {
  margin-top: -22%;
  text-align: center;
}

.fear-greed-widget{
  margin-bottom: 5%;
}

/* Styling the moving circle */
circle {
  transition: cx 0.5s, cy 0.5s; /* Smooth transition for the needle */
}
circle {
  transition: cx 0.5s, cy 0.5s; 
}

/* vertical style */
.fng-content-div-vertical{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.fng-value-container-vertical{
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 5px;
}
.fng-market-sentiment-vertical{
  display: inline-block;
  text-align: center;
}
.fng-market-sentiment-vertical ul {
  list-style: none;
  padding-left: 0px;
}
.fng-box-vertical {
  position: relative;
}
.fng-svg-container-vertical h2 {
  margin-bottom: 0px;
  text-align: center;
}
/*  */

/* Horizontal style container */

.fng-box-horizontal{
  position: relative;
  display: inline-block;
}

.fng-market-sentiment-horizontal h2{
  font-size: 23px;
  margin-bottom: -7px;
}
.fng-content-div-horizontal h2{
  font-size: 20px;
}
.fng-content-div-horizontal{
      display: flex;
      align-items: center;
      gap: 10px;
      justify-content: center;
      flex-wrap: wrap;
}
svg.horizontal{
  height: 130px;
}
.fng-value-container-horizontal{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
}
.fng-svg-container-horizontal h2{
  text-align: center;
}

@media only screen and (max-width: 992px){
  .fng-meter {
    width: 70%;
}
 }

 @media only screen and (max-width: 556px){ 
  .fng-meter {
    width: 100%;
}
.fng-svg-container-horizontal h2 {
  font-size: 14px;
}
.fng-entry-content ul {
  font-size: 13px;
}
.fng-content-div-horizontal{
  gap: 1px;
}
 }
