
@font-face {
    font-family: 'Gilroy';
    src: url('../fonts/Gilroy-Bold.ttf') format('truetype');
    font-weight: 700; /* Greutate Bold */
    font-style: normal;
}

@font-face {
    font-family: 'Gilroy';
    src: url('../fonts/Gilroy-Regular.ttf') format('opentype');
    font-weight: 600; /* Greutate Light */
    font-style: normal;
}
 @font-face {
    font-family: 'Cocon Regular';
    font-style: normal;
    font-weight: normal;
    src: url(../fonts/CoconRegularFont.woff) format('woff');
    }
img{
    width: 100%;
    /*max-width: fit-content;*/
}
body {
    background: url(../img/gradient.png);
    background-repeat: repeat;
        background-position: 70% 12%;
    background-size: 100%;
    color:#45566a;
    overflow-x:hidden;
}
html, body{
    overflow-x: hidden;
}
.background{
    
      }
p{


font-family: 'Gilroy', sans-serif;
font-style: normal;
font-weight: 400;
font-size: 22px;
color: #45566a;


}
h2{
     font-family: 'Gilroy', sans-serif;

font-style: normal;
font-weight: 600;
font-size: 44px;
text-align: center;

color: #011983;


}
h3{


font-family: 'Gilroy', sans-serif;
font-style: normal;
font-weight: 400;
font-size: 32px;

color: #45566a;


}
.title-blue h2{
font-family: 'Gilroy', sans-serif;
font-style: normal;
font-weight: 700;
font-size: 32px;
text-align: center;
color: #011983;
text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);

}
.card{
    background: transparent;
    border: 0;
}
.card-body h2{
    font-size: 21px;
    font-weight: 800;
}
.card-text{
     font-family: 'Gilroy', sans-serif;
     color: #45566a;
     font-weight: 500;
    font-size: 16px;
}
.card-body{
    padding: 0!important;
}
.card img{
    width: 100%;
    margin: auto;
    max-width: 130px;
}
.card-center{
    bottom: 25%;
    position: relative;
}

.list{
  
    margin-bottom: 0;
    font-size: 25px;
   /* display: flex;
    flex-direction: row;
    align-content: center;
    flex-wrap: wrap;
    align-items: center;*/


}
.list .orange-bg{
    background:#f57e20;
}
.list .red-bg{
    background: #ee2a7b;
}
.list .green-bg{
    background: #00b485;
}
.list span {
        display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    padding: 5px;
    margin-right: 6px;
    /* line-height: 6; */
    margin-bottom: 3px;
}



.footer p, .footer-low p{
font-family: 'Gilroy', sans-serif;
font-style: normal;
font-weight: 400;
font-size: 14px;
line-height: 1.2;
    text-align: left
}
.logo {
    width: 100%;
    max-width: 120px;
    margin-left: auto;
}
.footer-low{
    background-image: url(../img/backfoot.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.ingrediente:before{
    content:url('../img/produs.png'); /* with class ModalCarrot ??*/
  position:absolute; /*or absolute*/
  z-index:100000; /*a number that's more than the modal box*/
  left: -23rem;
    top: -6rem;
}
.ingrediente:after{
    content:url('../img/produs.png'); /* with class ModalCarrot ??*/
  position:absolute; /*or absolute*/
  z-index:100000; /*a number that's more than the modal box*/
      right: -29rem;
    top: -16rem;
}
.img-fit{
    max-width: fit-content;
}
@media only screen and (max-width: 983px) {
 .card-center{
    bottom: 0%;
    position: relative;
    }
    .card-body p.card-text{
        font-size: 16px
    }
    p{
        font-size: 18px;
    }
    body{
        background-position: 70% 19%;
        overflow: hidden;
         background-size: 144%;
    }
    .ingrediente:before {
    content: url(../img/produs.png);
    position: relative;
    z-index: 100000;
     left: 0rem;
    top:0rem;
        display: none;
}
}