@import url('https://fonts.googleapis.com/css2?family=Carter+One&family=Livvic:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,900&display=swap');
@import url('https://fonts.cdnfonts.com/css/rague-demo');

:root
{
    --base-color: #ffffed;
    --text-color: #7c5e3c;
    --primary-color: #ffc06e;
    --secondary-color: #8d8dff;
}

*
{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html
{
    font-family: 'Livvic','Rague demo';
    color: var(--text-color);
    scroll-behavior: smooth;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

h1, h2
{
    font-size: 20px;
    font-weight:bold;
}

body
{
    padding: 0;
    background-color: var(--base-color);
    font-size: 1.125em;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

html::-webkit-scrollbar,
body::-webkit-scrollbar
{
    display: none;
}

#navbar
{
    width: 90%;
    height: 2.5em;
    border-radius: .7em;
    position: sticky;
    top: 2px;
    background-color: #fffdd7;
    border-style:solid;
    border-width:.0625em;
    margin:auto auto -2.5em auto;
    z-index:1000;
}
 
#navbar ul
{
    margin-top:0.375em;
    margin-bottom:0.375em;
    display: flex;
    align-items: left;
    list-style-type: none;
    gap: 2em;
    font-size:19px;
}

#navbar .menu-toggle-item
{
    display:none;
}

#menu-toggle
{
    border:none;
    background:transparent;
    padding:0;
    cursor:pointer;
    display:flex;
    align-items:center;
    justify-content:center;
}

#menu-toggle img
{
    width:28px;
    height:28px;
    display:block;
}

#navbar .brand-link
{
    margin-left:25px;
    margin-right:auto;
    font-weight: bold;
    font-size:25px;
}

#navbar li:last-child
{
    margin-right:25.8px;
}

#navbar a
{
    float: left;
    display: block;
    text-decoration: none;
    color: #7c5e3c;
}

#navbar a.active
{
    text-shadow: 0.5px 0 0 currentColor, -0.5px 0 0 currentColor;
}

#navbar li:not(:first-child) a:hover
{
    text-shadow: 0.5px 0 0 currentColor, -0.5px 0 0 currentColor;
}

header, #albini
{
    padding: 0 0;
    margin: 3em 0;
    background-color: #ffffed;
    border-color: #000000;
    border-width: 3px;
}

header
{
    margin:0;
}

#albini
{
    margin-top:0;
}

.fundal-h
{
    width: 100%;
    height: 100vh;
    object-fit: cover;
    display: block;
    object-position:top right;
}

.umbra-h
{
    width:auto;
    height:100%;
    position:absolute;
    left:0;
    top:0;
    display:block;
}

.fagure-h
{
    position:absolute;
    left:68px;
    top:75px;
}

.titlu
{
    font-family:'Rague demo';
    font-size:9em;
    color:#fff5ba;
    text-shadow: -8px -8px 0 #7c5e3c, 8px -8px 0 #7c5e3c, -8px 8px 0 #7c5e3c, 8px 8px 0 #7c5e3c;
    left:48.7px;
    top:119.3px;
    position:absolute;
    display: flex;
    align-items: left;
    flex-wrap: wrap;
    gap:1em;
    padding:0;
    line-height: 1em;
}

titlu2
{
    margin-left:121.9px;
    margin-top:0;
}

slg
{
    background-color: rgba(124, 94, 60, .4);
    position:absolute;
    top:520px;
    left:250px;
    color:white;
    font-weight: bold;
    font-size:26.8px;
    border-radius: .4em;
    padding-bottom: 5px;
    padding-top: 5px;
}

.continut-1-2
{
    display: flex;         
    align-items: left;   
    justify-content: center;
    gap:4em;       
}

p1 {
    font-weight: bold;
    color: #7c5e3c;
    width: 550px;           
    text-align: center;
    margin:5.5em auto auto 8em;  
    font-size:28px;          
}

.photo-albine {
    width: 450px;
    height: auto;           
    display: block;
    margin: 1.5em 11em 1.5em auto;
}

.albina-h-tel
{
    display:none;
}

.continut-1-3
{
    justify-content:center;
    display:block;
    align-items:center;
    display:grid;
    width:80%;
    height:auto;
    margin:.5em auto 1em auto;
}

.continut-2-1
{
    margin: 2.8em auto 3.8em auto;
    width:85%;
    height:auto;
    background-color:#fff5ba;
    border-radius:3em;
    position: relative;
    z-index:0;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 2rem;
    padding: 2rem;
}

.prt1-2-1
{
    display: flex;
    align-items: flex-start;
    gap: 2rem;
    flex-wrap: wrap;
    width: 100%;
}

.text-column
{
    display: flex;
    flex-direction: column;
    gap: 1rem;
    flex: 1 1 400px;
}

.titlu-2-1
{
    width: 80%;
    height: auto;
    display: block;
    margin: 0 auto;
    margin: 0 auto 1.5em auto;
}

.poza-2-1-st
{
    width: 320px;
    height: auto;
    display: block;
    align-items:left;
    margin:0;
}

.subt1-2-1
{
    width: 240px;
    height: auto;
    display: block;
    margin:0;
    margin-bottom:-1em;
}

.continut-2-1 .p2
{
    font-size: 20px;
    max-width: 700px;
    width: fit-content;
    height: auto;
    display: block;
    text-align:left;
    margin: 0;
    font-weight: bold;
    background-color: rgba(255, 232, 139, .4);
    border-radius: 1em;
    padding:4px;
}

.prt2-2-1, .prt3-2-1
{
    display: flex;
    align-items: flex-start;
    gap: 2rem;
    flex-wrap: wrap;
    width: 100%;
}

.poza-2-1-dr
{
    width: 320px;
    height: auto;
    display: block;
    order: 2;
    margin: 0 1em 0 0;
}

.prt2-2-1 .text-column
{
    order: 1;
}

.subt2-2-1
{
    width: 371.7px;
    height: auto;
    display: block;
    margin:0 0 0 auto;
    margin-bottom:-1em;
}

.continut-2-1 .p3
{
    font-size: 20px;
    max-width: 700px;
    width: fit-content;
    height: auto;
    display: block;
    text-align:right;
    margin: 0 0 0 auto;
    font-weight: bold;
    background-color: rgba(255, 232, 139, .4);
    border-radius: 1em;
    padding: 4px;
    padding-left:2px;
}

.poza-2-1-stjos
{
    width: 320px;
    height: auto;
    display: block;
    align-items:left;
    margin:0;
}

.subt3-2-1
{
    width: 760px;
    height: auto;
    display: block;
    margin:0;
    margin-bottom:-1em;
}

.continut-2-1 .p4
{
    font-size: 20px;
    max-width: 700px;
    width: fit-content;
    height: auto;
    display: block;
    text-align:left;
    margin: 0;
    font-weight: bold;
    background-color: rgba(255, 232, 139, .4);
    border-radius: 1em;
    padding:4px;
}

.qr1
{
    width: 120px;
    height: auto;
    display: block;
    position:absolute;
    bottom: 1em;
    right: 2em;
}

.pixelispate-sus
{
    height:55%;
    width:auto;
    position:absolute;
    top:0;
    left:0;
    z-index:-1;
}

.pixelispate-jos
{
    height:55%;
    width:auto;
    position:absolute;
    margin:0;
    z-index:-1;
    bottom: 0;
    right: 0;
}

.lumina
{
    position:absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    margin:0;
    width: 80%;
    height:auto;
    z-index: -1
}

.continut-2-2
{
    display: flex;
    flex-direction: column;
    margin: 0 auto;
    width: 100%;
    position: relative;
    background-color: #fff5ba;
}

.titlu-2-2
{
    width: 60%;
    height: auto;
    display: block;
    margin: 1.5em auto 0 auto;
}

.main-photo-2-2
{
    width: 50%;
    height: auto;
    display: block;
    margin: -5em auto 3.8em auto;
    z-index: 0;
}

.qr2
{
    width: 120px;
    height: auto;
    display: block;
    position:absolute;
    bottom:2em;
    right:2em;
}

.spikes-2-2
{
    width: 100%;
    height: auto;
    display: block;
    margin: 0;
}

.continut-2-3
{
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
    "title title"
    "text ecosist";
    align-items: start;
    gap: 1rem;
    margin: 3em auto;
    width: 96%;
    position: relative;
}

.titlu-2-3
{
    grid-area: title;
    width: 45%;
    height: auto;
    display: block;
    margin: 0 auto .6em auto;
}

.text-box-2-3
{
    grid-area: text;
    width: 75%;
    height: auto;
    display: block;
    margin: 0 auto auto 1.5em;
    background-color: #fff5ba;
    border-radius: 1em;
    padding: .3em;
    position: relative;
    font-size: 18px;
}

.lumina-2-3
{
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    inset: 0;
    z-index: 0;
    object-fit: cover;
}

.continut-2-3 .p5
{
    font-size: 1em;
    max-width: none;
    width: 100%;
    height: auto;
    display: block;
    text-align:left;
    position: relative;
    z-index: 1;
}

.ecosist-2-3
{
    grid-area: ecosist;
    width: 70%;
    height: auto;
    display: block;
    margin: 0 30% auto auto;
}

.qr3
{
    width: 120px;
    height: auto;
    display: block;
    position:absolute;
    bottom:12em;
    right:1em;
}

.info-2-3
{
    background-color: #fff5ba;
    border-radius: 1em;
    padding: .8em;
    width: 92vw;
    height: auto;
    grid-column: 1 / -1;
    justify-self: center;
    margin:1em auto 3em auto;
}

.stiati-2-3, .h3
{
    display: block;
    font-size: 16.8px;
    text-align: left;
    color:#ffa100;
    font-weight:bold;
    font-style:italic;
}

.h3
{
    font-size:20px;
    font-style:italic;
}

.continut-2-4
{
    align-items: start;
    margin: 3em auto;
    padding-bottom: 5%;
    width: 100%;
    position: relative;
}

.continut-2-4 > :not(.colt1-2-4):not(.colt2-2-4):not(.colt3-2-4):not(.colt4-2-4)
{
    position: relative;
    z-index: 1;
}

.colt1-2-4
{
    display: block;
    position:absolute;
    z-index: 0;
    top: 0;
    left: 0;
}

.colt2-2-4
{
    display: block;
    position:absolute;
    z-index: 0;
    top: 0;
    right: 0;
}

.colt3-2-4
{
    display: block;
    position:absolute;
    z-index: 0;
    bottom: 0;
    left: 0;
}

.colt4-2-4
{
    display: block;
    position:absolute;
    z-index: 0;
    bottom: 0;
    right: 0;
}

.titlu-2-4
{
    width: 75%;
    height: auto;
    display: block;
    margin: 1.6em auto .3em auto;
}

.textbox1-2-4
{
    width: 86%;
    height: auto;
    display: block;
    margin: 0 auto .5em auto;
    background-color: rgba(255, 245, 186, .8);
    border-radius: 1em;
    padding: .5em;
}

.h4
{
    font-size: 20px;
    color: #ffa100;
    font-weight:bold;
}

.text1-2-4
{
    font-size:16px;
    width:100%;
    height:auto;
}

.textbox2-2-4
{
    width: 86%;
    height: auto;
    display: block;
    margin: 0 auto 1.5em auto;
    background-color: rgba(255, 245, 186, .8);
    border-radius: 1em;
    padding: .5em;
}

.textbox3-2-4, .textbox4-2-4, .textbox5-2-4
{
    width: 35%;
    height: auto;
    display: block;
    margin: .8em auto 0 7%;
    background-color: #ffe88b;
    border-radius: 1em;
    padding: .5em;
}

.alltext-2-4
{
    position: relative;
}

.text2-2-4
{
    font-size:18px;
    width:100%;
    height:auto;
    font-style: italic;
    text-align:justify;
}

.grafic-2-4
{
    height: 100%;
    width: auto;
    position: absolute;
    top: .3em;
    right: 7%;
}

.titlu-3-1-tel
{
    display:none;
}

.text1-3-1
{
    font-size: 18px;
    width: 80%;
    height: auto;
    display: block;
    text-align:justify;
    margin: 1.5em auto;
}

.h5
{
    font-size: 20px;
    color: #ffa100;
    font-weight:bold;
}

.miere-history-list
{
    margin: 0;
    padding-left: 1.3em;
}

.miere-history-list li
{
    margin-bottom: .45em;
}

.textbox-3-1
{
    width: 85%;
    height: auto;
    display: block;
    position: relative;
    margin: 0 auto 3em auto;
    background-color: #fff5ba;
    border-radius: 2em;
    padding: .8em;
}

.lumina-textbox-3-1
{
    position: absolute;
    left: 50%;
    bottom: .8em;
    transform: translateX(-50%);
    z-index: 0;
    object-fit: cover;
    pointer-events: none;
}

.textbox-3-1 > :not(.lumina-textbox-3-1)
{
    position: relative;
    z-index: 1;
}

.titlu-textbox-3-1
{
    display: block;
    margin: 0 auto 0 auto;
}

.text2-3-1
{
    font-size: 18px;
    width: 100%;
    height: auto;
    display: block;
    text-align:justify;
}

.h5
{
    font-size: 20px;
    color: #ffa100;
    font-weight:bold;
}

.continut-3-2
{
    background-color: #ffd25b;
    margin:0 auto;
    position: relative;
    z-index: 1;
    padding-bottom: 1.5em;
}

.prt1-3-2
{
    width: 86%;
    margin: 0 auto;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(240px, 25%);
    gap: 1em 2em;
    align-items: start;
}

.prt1-3-2 .textbox1-3-2
{
    width: 100%;
    margin: 0;
}

.titlu-3-2
{
    display: block;
    margin: .5em auto .5em auto;
}

.text-3-2
{
    font-size: 18px;
    width: 100%;
    height: auto;
    display: block;
    text-align:justify;
}

.textbox1-3-2
{
    width: 28%;
    height: auto;
    display: block;
    margin: 0 auto 1em 6em;
    background-color: #fff6de;
    border-radius: 2em;
    padding: .8em;
}

.h6
{
    font-size: 20px;
    color: #ffa100;
    font-weight:bold;
}

.graph-qr-3-2
{
    display: block;
    width: 100%;
    height:auto;
    margin: 0;
    background-color: #fff6de;
    border-radius: 1.5em;
    position: relative;
    grid-column: 2;
    grid-row: 1 / span 2;
}

.qr4
{
    width: 75px;
    height: auto;
    display: block;
    position:absolute;
    bottom: 1em; 
    right: 1em;
}

.prt2-3-2
{
    margin-top:3em;
}

.prt2-list
{
    padding-left: 2em;
    margin: 0.5em 0;
}

.textbox2-3-2
{
    width: 86%;
    height: auto;
    display: block;
    margin: 1em auto 0 auto;
    background-color: #fff6de;
    border-radius: 2em;
    padding: .8em;
}

.spikes-3-2-sus
{
    display: block;
    width: 100%;
    margin: 0;
    margin-bottom:-14px;
}

.spikes-3-2-jos
{
    display: block;
    width: 100%;
    margin: 0;
}

.titlu-3-3
{
    margin:1em auto;
    display:block;
    width:30%;
    text-align: center;
}

.continut-3-3
{
    text-align: center;
    position: relative;
    z-index: 1;
}

.reteta-box
{
    display: inline-block;
    width: 23%;
    height: auto;
    margin: 0.5em 1%;
    text-align: center;
    vertical-align: top;
}

.nume-reteta
{
    width:88%;
    height:auto;
    font-weight: bold;
    text-align: center;
    text-decoration: underline;
    color:#7c5e3c;
    font-size: 23px;
    display:block;
    margin:0 auto;
}

.reteta-img
{
    width: 100%;
    height: auto;
    display: block;
}

.pixelispate-jos-3-3
{
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: -1;
}

.pixelispate-sus-3-3
{
    position: absolute;
    top: 0;
    right: 0;
    z-index: -1;
}

.cta-button
{
    display: inline-block;
    text-decoration: none;
    color: white;
    background-color: var(--primary-color);
    padding: .75em 1.25em;
    border-radius: .5em;
    font-weight: 600;
}

.grid-container
{
    margin-top:3em;
    margin-bottom: 3em;
    display: grid;
    width: 100%;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: 1fr, 1fr;
    grid-template-areas:
    "img-1 img-1 img-2 img-3"
    "img-1 img-1 img-4 img-5";
    gap: 1em;
}

.grid-container img
{
    height: 100%;
    width: 100%;
    border-radius: .5em;
    transition: 100ms ease;
}

.grid-container img:hover
{
    scale: 1.05;
}

details
{
    margin-top:1em;
    background-color: var(--base-color);
    border-radius:1em;
}

details summary
{
    padding:1em;
    font-size: 12px;
    font-family: Merriweather;
}

details p
{
    padding: 0 2em 2em 2em;
}


@media(max-width: 1100px)
{
    html
    {
       scroll-behavior:auto;
    }

    #navbar
    {
        position:fixed;
        top:8px;
        left:10px;
        width:fit-content;
        min-height:0;
        height:auto;
        margin:0;
        padding:1px;
        border-radius:.8em;
        overflow:hidden;
        z-index:5000;
        transition:padding 220ms ease, box-shadow 220ms ease, background-color 180ms ease, border-color 180ms ease;
    }

    #navbar:not(.menu-open)
    {
        background-color:transparent;
        border-color:transparent;
        box-shadow:none;
    }

    #navbar.menu-open
    {
        width:max-content;
        max-width:calc(100vw - 20px);
        padding:3px 5px 4px 4px;
        background-color:#fffdd7;
        border-color:#7c5e3c;
        box-shadow:0 8px 20px rgba(0, 0, 0, .2);
    }

    #navbar ul
    {
        margin:0;
        list-style-type:none;
        display:grid;
        grid-template-columns:auto 0fr;
        grid-auto-rows:min-content;
        align-items:start;
        justify-items:start;
        gap:0;
        width:fit-content;
        transition:grid-template-columns 260ms ease;
    }

    #navbar.menu-open ul
    {
        grid-template-columns:auto 1fr;
    }

    #navbar .menu-toggle-item
    {
        display:block;
        margin:0;
        grid-column:1;
        grid-row:1;
        border-radius:1em;
    }

    #menu-toggle
    {
        line-height:0;
    }

    #menu-toggle img
    {
        width:22px;
        height:22px;
    }

    #navbar .brand-link
    {
        display:none;
    }

    #navbar .nav-link
    {
        grid-column:2;
        width:max-content;
        display:block;
        max-height:0;
        opacity:0;
        transform:translateX(-8px);
        overflow:hidden;
        pointer-events:none;
        margin:0;
        padding-left:0;
        padding-right:0;
        font-size:17px;
        white-space:nowrap;
        transition:max-height 260ms ease, opacity 220ms ease, transform 220ms ease, padding 220ms ease;
    }

    #navbar.menu-open .nav-link
    {
        max-height:2.1em;
        opacity:1;
        transform:translateX(0);
        pointer-events:auto;
        padding-left:8px;
        padding-right:6px;
    }

    #navbar .nav-link a
    {
        float:none;
        display:inline-block;
        padding:.2em 0;
    }

    #navbar li:last-child
    {
        margin-right:0;
        padding-bottom:.1em;
    }

    .fundal-h
    {
        height:60vh;
        width:100%;
        object-fit:cover;
        object-position:top right;
    }

    .umbra-h
    {
        display:none;
    }

    .titlu
    {
        font-size:5em;
        gap:.4em;
        left:20px;
        top:76px;
        text-shadow: -3px -3px 0 #7c5e3c, 3px -3px 0 #7c5e3c, -3px 3px 0 #7c5e3c, 3px 3px 0 #7c5e3c;
    }

    titlu2
    {
        margin-left:63.2px;
    }

    .fagure-h
    {
        left:28.3px;
        top:56.7px;
        width:209.4px;
        height:165.25px;
    }
    
    slg
    {
        font-size:14px;
        padding-top:3px;
        padding-bottom:3px;
        left:150.3px;
        top:260px;
        background-color: rgba(124, 94, 60, .6);
    }

    .photo-albine
    {
        width:300px;
        margin-bottom:1em;
    }

    p1
    {
        font-size:20px;
        margin-bottom:1em;
    }

    .continut-2-1
    {
        margin:.2em auto 2em auto;
        width:95%;
        height:auto;
        gap: 1em;
        padding: 1.2rem;
    }

    .titlu-2-1
    {
        width: 70%;
        height: auto;
    }

    .continut-2-3
    {
        grid-template-columns: 1fr;
        grid-template-areas:
        "title"
        "text"
        "ecosist";
        width: 100%;
    }

    .text-box-2-3
    {
        width: 90%;
        margin: 0 auto;
    }

    .ecosist-2-3
    {
        width: 45%;
        margin: 0 auto;
    }

    .poza-2-1-st, .poza-2-1-dr, .poza-2-1-stjos
    {
        width: 150px;
        height: auto;
    }

    .text-column
    {
        flex: 1 1 140px;
    }

    .subt1-2-1
    {
        width: 150px;
        height: auto;
        margin-bottom:-.7em;
    }

    .continut-2-1 .p2, .continut-2-1 .p3, .continut-2-1 .p4
    {
        font-size: 12px;
        max-width: 180px;
        width: fit-content;
        height: auto;
        padding:2px;
    }

    .subt2-2-1
    {
        width: 200px;
        height: auto;
        margin-bottom:-.7em;
    }

        .subt3-2-1
    {
        width: 250px;
        height: auto;
        margin-bottom:-.7em;
    }

    .titlu-3-1-pc
    {
        display:none;
    }

    .titlu-3-1-tel
    {
        display:block;
    }

    .continut-3-2
    {
        padding-bottom: 1.2em;
    }

    .prt1-3-2
    {
        width: 92%;
        grid-template-columns: 1fr;
        gap: .8em;
    }

    .graph-qr-3-2
    {
        grid-column: auto;
        grid-row: auto;
        max-width: 420px;
        justify-self: center;
    }

    .textbox1-3-2,
    .textbox2-3-2
    {
        width: 92%;
        margin: 0 auto;
    }
}

@media(max-width: 690px)
{
    html
    {
       scroll-behavior:auto;
    }

    #navbar
    {
        top:6px;
        left:8px;
        padding:1px;
        border-radius:.7em;
    }

    #navbar.menu-open
    {
        max-width:calc(100vw - 16px);
        padding:2px 4px 3px 3px;
    }

    #navbar ul
    {
        font-size:14px;
    }

    #navbar .menu-toggle-item
    {
        margin:0;
    }

    #menu-toggle img
    {
        width:25px;
        height:25px;
    }

    #navbar .brand-link
    {
        display:none;
    }
    
    #navbar .nav-link
    {
        font-size:14px;
        transform:translateX(-7px);
        transition:max-height 240ms ease, opacity 200ms ease, transform 200ms ease, padding 200ms ease;
    }

    #navbar.menu-open .nav-link
    {
        max-height:1.9em;
        padding-right:4px;
    }

    .titlu
    {
        font-size:2.5em;
        gap:.3em;
        left:40px;
        top:calc(101px + 2em);
        text-shadow: -3px -3px 0 #7c5e3c, 3px -3px 0 #7c5e3c, -3px 3px 0 #7c5e3c, 3px 3px 0 #7c5e3c;
    }

    titlu2
    {
        margin-left:40px;
    }

    slg
    {
        font-size:13px;
        padding-top:2.3px;
        padding-bottom:2.3px;
        left:120px;
        top:300px;
        background-color: rgba(124, 94, 60, .6);
    }

    .fagure-h
    {
        left:58.3px;
        top:calc(101.7px + 4.6em);
        width:104.7px;
        height:82.725px;
    }

    .fundal-h
    {
        height:45vh;
        width:100%;
        object-fit:cover;
        object-position:top right;
    }

    .umbra-h
    {
        display:none;
    }

    .continut-1-2
    {
        gap:1em;
        margin-top:2em;
        margin-bottom:.2em;
    }

    .photo-albine
    {
        width:120px;
        height:120px;
        margin-right:1.5em;
        margin-top:.38em;
    }

    p1
    {
        font-size:11px;
        width:500px;
        height:100px;
        margin-left:3em;
        margin-top:2em;
    }

    .continut-1-3
    {
        margin:0 auto 0 auto;
        width:97%;
        height:auto;
    }

    .albina-h-tel
    {
        display:block;
        margin:0 auto;
    }

    .continut-2-1
    {
        margin:.2em auto 1.5em auto;
        width:100%;
        height:auto;
        gap: .8rem;
        padding: 1rem;
    }

    .text-box-2-3
    {
        width: 95%;
    }

    .ecosist-2-3
    {
        width: 70%;
    }

    .text-column
    {
        flex: 1 1 100px;
    }

    .poza-2-1-st, .poza-2-1-dr, .poza-2-1-stjos
    {
        width: 120px;
        height: auto;
    }

    .subt1-2-1
    {
        width: 100px;
        height: auto;
        margin-bottom:-.7em;
    }

    .continut-2-1 .p2, .continut-2-1 .p3, .continut-2-1 .p4
    {
        font-size: 11px;
        max-width: 150px;
        width: fit-content;
        height: auto;
        padding:2px;
    }

    .subt2-2-1
    {
        width: 155px;
        height: auto;
        margin-bottom:-.7em;
    }

    .subt3-2-1
    {
        width: 190px;
        height: auto;
        margin-bottom:-.7em;
    }

    .qr1
    {
        width: 50px;
        height: auto;
        bottom: .5em;
        right: 1.3em;
    }

    .pixelispate-sus
    {
        width:95%;
        height:auto;
    }

    .pixelispate-jos
    {
        width:95%;
        height:auto;
    }

    .titlu-2-2
    {
        width: 60%;
        height: auto;
        display: block;
        margin: .8em auto 0 auto;
    }

    .main-photo-2-2
    {
        width: 78%;
        height: auto;
        display: block;
        margin: -1em auto 2em auto;
        z-index: 0;
    }

    .qr2
    {
        width: 50px;
        height: auto;
        bottom:.6em;
        right:.8em;
    }

    .titlu-2-3
    {
        width: 56%;
        height: auto;
    }

    .continut-2-3 .p5
    {
        font-size: 14px;
    }

    .text-box-2-3
    {
        font-size: 14px;
    }

    .text-box-2-3 h1,
    .text-box-2-3 h2
    {
        font-size: 14px;
    }

    .ecosist-2-3
    {
        width: 65%;
        height: auto;
        margin: .6em auto;
    }

    .qr3
    {
        width: 50px;
        height: auto;
        bottom:12em;
        right:.3em;
    }

    .stiati-2-3
    {
        font-size: 12.5px;
    }

    .h3
    {
        font-size:16px;
    }

    .titlu-2-4
    {
        width: 85%;
    }

    .h4
    {
        font-size: 16px;
    }

    .text-container p
    {
        font-size: 1rem;
    }

    h2
    {
        font-size:1.5rem;
    }

    .text1-2-4
    {
        font-size: 14px;
    }

    .text2-2-4
    {
        font-size:13px;
    }

    .info-2-3
    {
        margin-bottom:.5em;
    }

    .cta-button {
        margin-top: .5em;
        width: 100%;
    }

    .grid-container
    {
        display: flex;
        flex-direction: column;
    }

    .textbox1-2-4,
    .textbox2-2-4
    {
        width: 92%;
    }

    .textbox3-2-4, .textbox4-2-4, .textbox5-2-4
    {
        width: 92%;
        margin: .8em auto 0 auto;
    }

    .alltext-2-4
    {
        position: static;
    }

    .grafic-2-4
    {
        position: static;
        width: 92%;
        height: auto;
        display: block;
        margin: 1em auto 1em auto;
    }

    .titlu-3-1-pc
    {
        display:none;
    }

    .titlu-3-1-tel
    {
        display:block;
    }

    .text1-3-1
    {
        font-size: 14px;
        width: 80%;
        height: auto;
        display: block;
        text-align:justify;
        margin: 1.5em auto;
    }

    .h5
    {
        font-size: 16px;
        color: #ffa100;
        font-weight:bold;
    }

    .textbox-3-1
    {
        width: 95%;
        height: auto;
        margin: 0 auto 1.5em auto;
        padding: .4em;
    }

    .titlu-textbox-3-1
    {
        width:82%;
    }

    .text2-3-1
    {
        font-size: 14px;
    }

    .h5
    {
        font-size: 16px;
    }

    .lumina-textbox-3-1
    {
        display: none;
    }

    .textbox1-3-2
    {
        width: 85%;
        height: auto;
        padding: .8em;
        margin:0 auto .4em auto;
    }

    .continut-3-2
    {
        padding-bottom: 1em;
    }

    .prt1-3-2
    {
        width: 95%;
        gap: .6em;
    }

    .graph-qr-3-2
    {
        width: 92%;
        max-width: 340px;
        border-radius: 1.2em;
    }

    .textbox2-3-2
    {
        width: 92%;
    }

    .prt2-list
    {
        padding-left: 1.5em;
        font-size: 14px;
    }

    .text-3-2
    {
        font-size: 14px;
    }

    .h6
    {
        font-size:16px;
    }

    .nume-reteta
    {
        font-size:11px;
    }

    .titlu-3-3
    {
        width: 45%;
    }
}

section, header {
    display: none;
}

#home {
    display: block;
}