html 
{
  font-size: 14px;
}

@media (min-width: 768px) 
{
  html {
    font-size: 16px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus 
{
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html 
{
  position: relative;
  min-height: 100%;
}

body 
{
    margin-bottom: 60px;
    background-blend-mode: soft-light;
    background-color:palevioletred;
}
.container-fluid 
{
    background-color: lightcyan;    
}
.pb-3 
{
    background-color: lightpink;
    
}
.container
{
    
    
}
.navbar 
{
    background-color: lightcyan;
}
.candy-box   
    {
    border-radius: 20px;
    height: 150px;
    background-color: peachpuff;

}
.grid-loop {
    display: grid;
    grid-template-rows: auto;
    
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 40px;
    padding: 40px;
}

.text {
    
    margin-left: 6px;
    display:inline-block;
    align-items:end;



}
.pris {
    font-weight: bold;
    display: inline-block;
    align-items: end;
}
.vem-gillar {
    display: flex;
    display: inline-block;
    margin-left: 65%;
    justify-content: end;
    margin-right: 3px;
    text-decoration: none;
    font-size: 16px;
    border: solid;
    padding: 3px;
    border-radius: 12px;
    margin-bottom: 5px;
    border-color: lightpink;
    color: peachpuff;
    background-color: palevioletred;
    transition: transform 400ms ease, 
    color 400ms ease, background-color 400ms ease, opacity 400ms ease, box-shadow 400ms ease;
}
    .vem-gillar:hover {
        color: white;
        opacity: 0.8;
        transform: scale(1.06); 
        box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    }

.candy {
    object-fit:fill;
    border-radius: 10px;
    width:100px;
    
    
    margin-left:6px;
    margin-top:6px;
    border: dotted #fbbd86 4px;
}
.right {
   
   border: solid #c77e96;
    width:600px;
  justify-self:center;
    display: grid;
    grid-template-rows: 25% 25% 25% 25%;
    grid-template-columns: 25% 35% 25% 15%;
   
   
}
/*.img-div{
    padding-top:10px;
}*/
.profilbild{
    border-radius:50px;
}
.gillar-div{
   
    border-color:lightpink;
    color:lightpink;

}