#dozivotno .ico:before, #dozivotno .ico span {
    border-radius: 50%;
    /* transform-origin: 50% 0;
    transform: rotate(-8deg);
    animation: osc 0.3s ease-in-out infinite alternate; */
    display: none;
  }
  
  @keyframes osc {
    to {
      transform: rotate(8deg);
    }
  }
  
  #dozivotno {
    --n: 4;
    --narr: 1;
    --notnarr: calc(1 - var(--narr));
    --wide: 0;
    --notwide: calc(1 - var(--wide));
    --nor: calc(var(--notnarr) * var(--notwide));
    --or: calc(1 - var(--nor));
    --sum: calc(1 + var(--narr));
    display: flex;
    flex-wrap: wrap;
    /* align-items: center;
    justify-content: space-around;
    flex-wrap: wrap;
    overflow-x: hidden;
    min-height: 100vh; */
  }



  
  #dozivotno:before {
    --uw: calc(
        var(--nor) * (100% - var(--n) *2rem) / var(--n) + var(--or) *12.5rem
    );
    position: absolute;
    top: 27%;
    right: 0;
    left: 0;
    height: calc(var(--sum) * 2 * var(--uw));
    transform: translate(calc(var(--sum) * 50% / var(--n)), -50%);
    background: radial-gradient(circle at calc(41% - 1rem) calc(43% - 1rem), #e31b23 calc(0.6rem - 1px), rgba(255, 255, 255, 0) 0.6rem),                 
                radial-gradient(circle at calc(59% + 1rem) calc(43% - 1rem), #e31b23 calc(0.6rem - 1px), rgba(255, 255, 255, 0) 0.6rem),                 
                radial-gradient(circle at 50% 39%, #e31b23 calc(0.725rem - 1px), rgba(255, 255, 255, 0) 0.725rem);

    /* background: radial-gradient(circle at calc(41% - 1rem) calc(43% - 1rem), #fff calc(0.6rem - 1px), rgba(255, 255, 255, 0) 0.25rem), 
                radial-gradient(circle at calc(59% + 1rem) calc(43% - 1rem), #fff calc(0.6rem - 1px), rgba(255, 255, 255, 0) 0.25rem), 
                radial-gradient(circle at 50% 39%, #fff calc(0.725rem - 1px), rgba(255, 255, 255, 0) 0.625rem); */
  
  
  
    background-size: calc(50% / (2 - var(--narr))) calc(100% / (1 + var(--narr)));
    clip-path: inset(0 calc(var(--sum) * 25%) 0 0);
    filter: drop-shadow(5px 5px 4px rgba(0, 0, 0, 0.2));
    content: "";
    display: none;
  }

  @media (min-width: 38rem) {
    #dozivotno {
      --narr: 0;
    }
  }
  @media (min-width: 58rem) {
    #dozivotno {
      --wide: 1;
    }
  }
  
  #dozivotno .hid {
    position: absolute;
    clip-path: inset(50%);
  }
  
  #dozivotno path, #dozivotno svg  {
    --s: 2;
    fill: #e31b23;
    /* stroke: currentcolor;
    stroke-width: var(--s);
    stroke-linecap: round; */
  }
  
  #dozivotno #ico4 path {
    --s: 2;
    fill: none;
    stroke: #e31b23;
    stroke-width: var(--s);
    stroke-linecap: round;
  }
  
  
  #dozivotno path.d {
    stroke-dasharray: 0 calc(2 * var(--s));
  }
  #dozivotno path.t {
    --s: 4;
  }
  
  #dozivotno section {
    display: inline-block;
    min-width: 21rem; /* 20rem; */
    width: calc( 		var(--nor) * (100% - var(--n) *2rem) / var(--n) + var(--or) *12.5rem 	);
    text-align: center;
    margin: 0 auto;
    /* vertical-align: top; */
    padding: 0 15px;
  }
  
  #dozivotno h3,
  #dozivotno span {
    color: var(--c0);
  }
  
  #dozivotno h3 {
    padding: 1rem 0 0.5rem;
    font-size: calc(var(--nor) * 2vw + var(--or) * 1.16rem);
  }
  
  #dozivotno p {
    /* height: 3rem; */
    /* font-size: 0.85rem;
    margin-top: 12px; */
    font-size: 16px;
    line-height: 22px;
  }
  
  #dozivotno .ico {
    order: -1;
    position: relative;
    /* margin-bottom: calc(10% + 2.875rem + 2px); */
    border-radius: 50%;
    box-shadow: inset 0 0 0 0.625rem #fff, 11px 11px 12px -9px rgba(27, 14, 0, 0.28);
    background: linear-gradient(135deg, var(--c0), var(--c1)) padding-box;
    /* margin: 0 auto calc(10% + 2.875rem + 2px); */
    /* width: 80%; */
    width: 60%;
    margin: -75px auto 30px;
  }
  #dozivotno .ico span {
    --sgn: 1;
    box-sizing: border-box;
    display: grid;
    place-content: center;
    padding: 50%;
    width: 0;
    height: 0;
    border-radius: 50%;
    clip-path: circle(calc(50% - 0.625rem));
  }
  #dozivotno .ico span:hover {
    --sgn: -1;
  }
  #dozivotno .ico svg {
    --w: calc(100% - 4rem);
    box-sizing: border-box;
    position: absolute;
    margin: calc(-0.5 * var(--w));
    /* border: solid 1rem transparent; */
    width: var(--w);
    height: var(--w);
    border-radius: 50%;
    box-shadow: calc(var(--sgn) * 36px) 27px 11px -5px rgba(27, 14, 0, 0.16);
    background: linear-gradient(135deg, #fff, #d2d2d2) border-box;
    transition: 0.3s ease-out;
  }
  #dozivotno .ico:before, #dozivotno .ico:after {
    position: absolute;
    content: "";
    display: none;
  }
  #dozivotno .ico:before {
    box-sizing: border-box;
    top: calc(110% + 1px);
    left: calc(50% - 1.4375rem);
    border: solid 0.625rem transparent;
    width: 2.875rem;
    height: 2.875rem;
    box-shadow: 0 0 0 2px #fff;
    background: inherit;
    filter: drop-shadow(1px 3px 2px rgba(0, 0, 0, 0.32));
  }
  #dozivotno .ico:after {
      width: 1rem;
      top: calc(100% - 0.5rem);
      left: calc(50% - 0.5rem);
      border: solid 0 transparent;
      border-width: 0.5rem 0.3125rem;
      padding-top: 10%;
    background: linear-gradient(#fff, #fff) padding-box, radial-gradient(circle at 50% 0.5rem, #fff calc(0.5rem - 1px), rgba(255, 255, 255, 0) 0.5rem) border-box, radial-gradient(circle at 50% calc(100% - 0.5rem), #fff calc(0.375rem - 1px), rgba(255, 255, 255, 0) 0.375rem) border-box;
  }



  @media (max-width: 1200px) {
    #dozivotno section {
      min-width: 20rem;
    }
  }
  @media (max-width: 991px) {
    #dozivotno:before {
      display: none;
    }
    #dozivotno section {
      /* min-width: 18rem; */
      min-width: 100%;
      margin-bottom: 50px;
      padding: 0 15px;
    }
  }

  #dozivotno section {
    margin-bottom: 50px;
  }