<meta charset="UTF-8">

html,
html * {
	padding: 0;
	margin: 0;
	box-sizing: border-box;
}
html {
  overflow-y: scroll;
}

.odstavek-prvi {
  margin-top: 0em;     /* prostor nad odstavkom */
  margin-bottom: 0.5em; /* prostor pod odstavkom */
}
.odstavek {
  margin-top: 0.7em;     /* prostor nad odstavkom */
  margin-bottom: 0.7em; /* prostor pod odstavkom */
}

    body {
      margin: 0;
      font-family: Georgia, Helvetica, Calibri, Arial, sans-serif;
      background: #000000;
      display: flex;
      flex-direction: column;
      align-items: center;
    }

    h1 {
      margin: 40px 0 20px;
      font-size: 2.5rem;
      color: #e60003;
    }
h2.prva {
      margin: 0px 0 0px;
      font-size: 1.2rem;
      font-type: bold;
    }
    
    h2 {
      margin: 25px 0px 0px;
      font-size: 1.2rem;
      font-type: bold;
    }

.email-link {
  text-decoration: none;    /* odstrani podčrtaj */
  color: #f0f0f0f0;         /* nastavitev barve (s 8 znaki = RGBA) */
}

    .menu {
      display: flex;
      flex-direction: column;
      gap: 15px;
      width: 300px;
    }

    .item {
      background: grey;
      color: #f0f0f0;
      cursor: pointer;
      border-radius: 10px;
      overflow: hidden;
      position: relative;
      transition: background 0.3s ease;
    }

    .header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 15px;
      font-size: 1.2rem;
	}

	.arrow {
		transition: transform 0.4s ease;
		font-size: 1.2rem;	
	}

	.item.expanded .arrow {
		transform: rotate(180deg);
	}

    .content {
      padding: 0 20px;
      max-height: 0;
      overflow: hidden;
      transition: max-height 0.5s ease, padding 0.5s ease;
      font-size: 0.95rem;
      color: #f0f0f0;
    }

    .item.expanded .content {
      padding: 15px 20px 20px;
    }

    /* Pastel barve */
    .blue { background: #0066cc; }
    .red { background: #e60003; }
    .green { background: #00cc66; }
/* Slika pod menijem za male zaslone */
    .bottom-img {
      margin: 30px 81px 81px;
	justify-content: center;
    }

      .left-img {
        display: none;
      }

      .right-img {
        display: none;
      }


.rating-wrapper {
  display: flex;
  align-items: center;
  font-size: 24px; /* velikost zvezdic in številke */
//font-family: Georgia, Helvetica, Calibri, Arial, sans-serif;
  gap: 0.5em; /* razmik med zvezdicami in številko */
}

.stars {
  position: relative;
  display: inline-block;
 // font-size: 2rem;
  //color: #ccc; /* prazne zvezdice */
  line-height: 1;
}

.stars-bg {
  color: #000000;
}

.stars-fill {
  position: absolute;
  top: 0;
  left: 0;
  color: #f0f0f0;
  overflow: hidden;
  white-space: nowrap;
  pointer-events: none;
}

.rating-number {
  color: #f0f0f0; /* barva ocene */
  font-weight: bold;
}

.zamik {
  list-style-type: none;
}

.zamik li {
  position: relative;
  padding-left: 5px;
}

.custom-svg-bullet {
  list-style: none; /* odstrani klasične kroge */
  padding-left: 0;
}

.custom-svg-bullet li {
  position: relative;
  padding-left: 22px; /* prostor za ikono */
  margin-bottom: 0.5em;
}

.custom-svg-bullet li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.1em;
  width: 15px;
  height: 15px;
  background-image: url("img/nevemBel90.svg");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}


    @media (min-width: 768px) {
      .container {
        flex-direction: row;
        justify-content: center;
        align-items: flex-start;
        position: relative;
      }

      .side-img {
        display: block;
        position: absolute;
        top: 150;
        height: 200px;
      }

      .left-img {
        left: calc(50% - 300px / 2 - 200px); /* 50% - half menu width - distance */
      }

      .right-img {
        right: calc(50% - 300px / 2 - 200px);
      }

      .bottom-img {
        display: none;
      }
    }