html { scroll-behavior: smooth;}



html, body {

    margin: 0%;

    padding: 0%;

    background-color: white;

}



#sfondo1{

    position: absolute;

    object-fit: cover;

    object-position: 100% 1%;

    width: 100%;

    height: auto;

    z-index: 1;

}



#logos {

    position: absolute;

    left: 42%;

    top: 23%;

    height: 270px;

    width: 203px;

    

    z-index: 2;



}



#tit {

    position: relative;

    color: white;

    text-align: center;

    font-size: 600%;

    font-family: "Cooper Black", serif;

    z-index: 2;

    padding-top: 20%;

    margin-bottom: 1%;

}



#tit2 {

    position: relative;

    color: white;

    font-size: 350%;

    font-family: "Brush Script MT", cursive;

    text-align: center;

    z-index: 2;

    margin: 1%;



}



header {

    display: block;

    position: relative;

    top: 0;

    background-color: rgb(83, 76, 69);

    padding-bottom: 1%;

    padding-top: 1%;

    z-index: 10;

}



.ptxt {

    color: white;

    font-size: 230%;

    transition: transform 0.2s ease, color 0.2s ease;

    font-family: "Cooper Black", serif;

    text-decoration: none;

}

.tit3 {

    display: flex;

    text-align: center;

    align-items: center;

    justify-content: center;

    position: relative;

    font-family: "Cooper Black", serif;

    font-size: 500%;

    color: rgb(197, 69, 31);

    z-index: 2;

    text-align: center;

    margin-top: 0%;

    margin-bottom: 2%;

    margin: 2rem;

    

}

.logo2 {

    height: 200px;

    width: 150px;

    padding-left: 4%;

    padding-right: 4%;

    z-index: 2;

}

.story {

    color: black;

    z-index: 2;

    margin-left: 7%;

    margin-right: 7%;

    font-size: 155%;

    font-family: Arial, Helvetica, sans-serif;

    columns: 2; 

    column-gap: 60px; 

    text-align: justify;

}

p {



    margin-bottom: 1em;

}



@media (max-width: 768px) {

      .story {

        grid-template-columns: 1fr;

    }

}

#Molino_pietra {

    display: flex;

    width: 50%;

    height: auto;

    margin-left: 27%;

    margin-right: 27%;

    border-radius: 30px;

    z-index: 2;

}



#Capostipite {

    display: flex;

    width: 70%;

    height: auto;

    margin-left: 15%;

    margin-right: 15%;

    margin-bottom: 10%;

    border-radius: 30px;

    z-index: 2;

}

#pr {

    z-index: 2;

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 0em;

    margin: 2em auto;

    width: fit-content;

    font-size: 2rem;

}

.spig {

    height: auto; 

    width: 100%;

    object-fit: contain;

    flex-grow: 1;

    display: flex;

    align-items: center;

    max-width: 10em; 

}

.testo-centrale {

    color: white;

    font-family: "Cooper Black", serif;

    font-size: 1.5em;

    padding: 0.3em 1em;

    border-radius: 2em;

    white-space: nowrap;

    

}

.FarineI {

    height: auto;

    width: 18%;

    display: flex;

    object-fit: contain;

    align-items: center;

    margin: 2em auto;

}





#BD {

    padding: 1% 3%;

    color: white;

    margin-right: 1%;

    margin-left: 21%;

    border-radius: 30px;

    font-family: "Cooper Black", serif;

    font-size: large;

    display:inline-block;

    border: 0;

}



#BS {

    padding: 1% 3%;

    color: white;

    margin-right: 21%;

    margin-left: 14.4%;

    border-radius: 30px;

    font-size: large;

    font-family: "Cooper Black", serif;

    display:inline-block;

    border: 0;

}

.ltit {

    

    margin-left: 7%;

    margin-top: 2%;

    font-size: 180%;

    color: rgb(197, 69, 31);

    font-family: Arial, Helvetica, sans-serif;

}

.leg {

    border-radius: 25px;

    height: auto;

    width: 50%;

    display: flex;

    align-items: center;

    object-fit: contain;

    margin: 2em auto;

}

.text1 {

    font-family: Arial, Helvetica, sans-serif;

    text-align: center;

    font-size: 160%;

    margin-left: 15%;

    margin-right: 15%;

    display: flex;

}



.ptxt:hover {

  transform: scale(1.05);

  color: gainsboro;

}