/*#region HTML BODY*/
html
{
scroll-behavior: smooth;
}
body
{
margin: 0;
padding: 0;
background-color: #FEF3DD;
}
/*#endregion*/
/*#region HEADER*/
.head_parallax
{
position: relative;
display: flex;
margin: auto;
width: 100%;
height: 100dvh;
background-image: url('../images/logo_pro_loco/locandina.jpeg');
background-position: center;
background-repeat: no-repeat;
background-clip: border-box;
background-size: cover;
background-attachment: fixed;
}
@media screen and (max-width: 720px)
{
}
/*#endregion*/
/*#region NAVBAR*/
.navbar_sagra
{
position: relative;
display: flex;
flex-direction: row;
margin: auto;
margin-top: 0;
width: 100%;
height: 100%;
background-color: #70707070;
}
.navbar_sagra div
{
display: flex;
flex-direction: column;
margin: auto;
width: 100%;
height: 100%;
justify-content: space-evenly;
align-items: center;
}
.navbar_sagra_links a
{
padding: 1rem;
width: 60%;
border-radius: 0.5rem;
color: #F8B201;
font-size: 1rem;
text-align: center;
text-transform: uppercase;
background-color: #0000009c;
transition: 0.5s ease all;
}
.navbar_sagra_links a:hover
{
background-color: #000000;
}
.navbar_sagra_logo img
{
width: 100%;
}
@media screen and (max-width: 720px)
{
.navbar_sagra_links a
{
padding: 0.5rem;
font-size: 0.6rem;
}
.navbar_sagra div
{
width: 50%;
}
.navbar_sagra_logo img
{
width: 100%;
}
}
/*#endregion*/
/*#region HOME*/
.main_home_sagra
{
position: relative;
display: flex;
flex-direction: column;
margin: auto;
padding: 2rem 0;
width: 100%;
background-color: #FEF3DD;
}
.main_home_sagra h1
{
text-transform: uppercase;
text-align: center;
font-size: 3.5rem;
}
.main_home_sagra h2
{
text-align: center;
font-size: 2rem;
}
.main_home_sagra_programma
{
position: relative;
display: flex;
flex-direction: column;
margin: 4rem auto;
width: 80%;
border-radius: 1rem 1rem 0 0;
border-left: 0.1rem solid #FFE2C4;
border-right: 0.1rem solid #FFE2C4;
overflow: hidden;
background-image: linear-gradient(to bottom, #FFE2C4, #FEF3DD 20%);
}
.main_home_sagra_programma h5
{
margin: 0 auto;
width: 100%;
text-align: center;
font-size: 7rem;
color: #80180B;
}
.main_home_sagra_programma ul
{
margin-left: 1rem;
}
.main_home_sagra_programma ul li
{
font-size: 3rem;
text-transform: uppercase;
color: #26201A;
}
.main_home_sagra_programma ul p
{
font-size: 1.5rem;
}
.main_home_sagra_programma ul p strong
{
font-size: 1.8rem;
}
.main_home_sagra_programma ul p span
{
font-weight: bolder;
}
.main_home_sagra_programma ul p i
{
color: #80180B;
font-weight: bolder;
}
.main_home_sagra_programma ul a
{
color: #000000;
transition: 0.5s ease all;
}
.main_home_sagra_programma ul a::after
{
content: " →";
}
.main_home_sagra_patrocinio
{
border-top: 0.1rem solid #26201A;
background-color: #FFE2C4;
}
.sponsor
{
position: relative;
display: flex;
flex-direction: row;
width: 100%;
overflow-x: hidden;
white-space: nowrap;
}
.sponsor div img
{
display: flex;
margin: 1rem;
width: 15rem;
height: 10rem;
object-fit: contain;
border-radius: 2rem;
}
.sponsor div
{
margin: auto;
width: 100%;
}
.sponsor div p
{
text-align: center;
}
@media screen and (max-width: 720px)
{
.main_home_sagra h1
{
font-size: 1.5rem;
}
.main_home_sagra h2
{
font-size: 1.2rem;
}
.main_home_sagra_programma
{
width: 98%;
}
.main_home_sagra_programma h5
{
font-size: 2rem;
}
.main_home_sagra_programma ul
{
margin: 2rem auto;
}
.main_home_sagra_programma ul li
{
font-size: 1.4rem;
}
.main_home_sagra_programma ul p
{
font-size: 0.8rem;
}
.main_home_sagra_programma ul p strong
{
font-size: 1rem;
}
.sponsor div img
{
width: 5rem;
height: 3rem;
}
.sponsor div p
{
font-size: 0.6rem;
}
}
/*#endregion*/
/*#region PASSEGGIATA*/
.main_passeggiata
{
position: relative;
display: flex;
flex-direction: column;
margin: 4rem auto;
width: 80%;
border-radius: 1rem 1rem 0 0;
border-left: 0.1rem solid #FFE2C4;
border-right: 0.1rem solid #FFE2C4;
overflow: hidden;
background-image: linear-gradient(to bottom, #FFE2C4, #FEF3DD 20%);
}
.main_passeggiata h5
{
margin: 0 auto;
width: 100%;
text-align: center;
font-size: 3rem;
color: #80180B;
}
.main_passeggiata h6
{
margin: 0 auto;
text-align: center;
font-size: 2rem;
color: #80180B;
}
.main_passeggiata div
{
position: relative;
display: flex;
flex-direction: row;
margin: 0.8rem auto;
width: 100%;
align-items: center;
}
.main_passeggiata div p
{
text-align: justify;
padding: 0 1rem;
width: 100%;
font-size: 1.8rem;
}
.main_passeggiata div p span
{
font-weight: bolder;
}
.main_passeggiata div section
{
display: flex;
width: 30%;
align-items: center;
}
.main_passeggiata div section img
{
display: flex;
width: 100%;
}
.img_passeggiata_destra
{
margin-right: 0;
padding-right: 1rem;
}
.img_passeggiata_sinistra
{
margin-left: 0;
padding-left: 1rem;
}
@media screen and (max-width: 720px)
{
.main_passeggiata
{
width: 98%;
}
.main_passeggiata h5
{
font-size: 2rem;
}
.main_passeggiata h6
{
font-size: 1.5rem;
}
.main_passeggiata div p
{
font-size: 0.8rem;
}
.main_passeggiata div p strong
{
font-size: 1rem;
}
}
/*#endregion*/
/*#region GALLERIA SAGRA*/
.main_galleria_sagra
{
position: relative;
display: flex;
flex-direction: column;
margin: 4rem auto;
width: 80%;
border-radius: 1rem 1rem 0 0;
border-left: 0.1rem solid #FFE2C4;
border-right: 0.1rem solid #FFE2C4;
overflow: hidden;
background-image: linear-gradient(to bottom, #FFE2C4, #FEF3DD 20%);
}
.main_galleria_sagra h5
{
margin: 0 auto;
width: 100%;
text-align: center;
font-size: 3rem;
color: #80180B;
}
.main_galleria_sagra div
{
position: relative;
display: flex;
padding: 1rem 0;
margin: 2.5rem auto;
width: 100%;
height: 80dvh;
align-items: center;
}
.fade
{
animation-name: fade;
animation-duration: 1.5s;
}
@keyframes fade
{
from {opacity: .05}
to {opacity: 1}
}
.main_galleria_sagra div img
{
display: flex;
margin: auto;
width: 100%;
height: 100%;
border-radius: 5%;
object-fit: contain;
vertical-align: middle;
}
.main_galleria_sagra button
{
position: absolute;
margin: auto;
padding: 1rem 0.8rem;
width: auto;
font-size: 2rem;
font-weight: bold;
border: none;
cursor: pointer;
background-color: #ffe3c4c9;
transition: 0.5s ease all;
}
.main_galleria_sagra button:hover
{
background-color: #fef3ddc9;
}
.slide_indietro
{
left: 0;
border-radius: 0 0.5rem 0.5rem 0;
}
.slide_avanti
{
right: 0;
border-radius: 0.5rem 0 0 0.5rem;
}
@media screen and (max-width: 720px)
{
.main_galleria_sagra
{
width: 98%;
}
.main_galleria_sagra h5
{
font-size: 2rem;
}
.main_galleria_sagra div button
{
padding: 0.5rem 0.4rem;
font-size: 1.5rem;
}
}
/*#endregion*/
/*#region GALLERIA PASSEGGIATA*/
.main_galleria_passeggiata
{
position: relative;
display: flex;
flex-direction: column;
margin: 4rem auto;
width: 80%;
border-radius: 1rem 1rem 0 0;
border-left: 0.1rem solid #FFE2C4;
border-right: 0.1rem solid #FFE2C4;
overflow: hidden;
background-image: linear-gradient(to bottom, #FFE2C4, #FEF3DD 20%);
}
.main_galleria_passeggiata h5
{
margin: 0 auto;
width: 100%;
text-align: center;
font-size: 3rem;
color: #80180B;
}
.main_galleria_passeggiata div
{
position: relative;
display: flex;
padding: 1rem 0;
margin: 2.5rem auto;
width: 100%;
height: 80dvh;
align-items: center;
}
.fade
{
animation-name: fade;
animation-duration: 1.5s;
}
@keyframes fade
{
from {opacity: .05}
to {opacity: 1}
}
.main_galleria_passeggiata div img
{
display: flex;
margin: auto;
width: 100%;
height: 100%;
border-radius: 5%;
object-fit: contain;
vertical-align: middle;
}
.main_galleria_passeggiata button
{
position: absolute;
margin: auto;
padding: 1rem 0.8rem;
width: auto;
font-size: 2rem;
font-weight: bold;
border: none;
cursor: pointer;
background-color: #ffe3c4c9;
transition: 0.5s ease all;
}
.main_galleria_passeggiata button:hover
{
background-color: #FEF3DDc9;
}
.slide_indietro
{
left: 0;
border-radius: 0 0.5rem 0.5rem 0;
}
.slide_avanti
{
right: 0;
border-radius: 0.5rem 0 0 0.5rem;
}
@media screen and (max-width: 720px)
{
.main_galleria_passeggiata
{
width: 98%;
}
.main_galleria_passeggiata h5
{
font-size: 2rem;
}
.main_galleria_passeggiata div button
{
padding: 0.5rem 0.4rem;
font-size: 1.5rem;
}
}
/*#endregion*/
/*#region 404*/
.main_404
{
position: relative;
display: flex;
flex-direction: column;
margin: auto;
width: 80%;
height: 100dvh;
text-align: center;
}
.main_404 img
{
margin: auto;
width: 20%;
}
.main_404 p
{
margin-top: 0;
font-size: 3rem;
}
@media screen and (max-width: 720px)
{
.main_404 img
{
width: 80%;
}
.main_404 p
{
font-size: 1.2rem;
}
}
/*#endregion*/
/*#region FOOTER*/
footer
{
position: relative;
display: flex;
flex-direction: row;
margin: auto;
width: 100%;
background-color: #363f64;
color: #ffffff;
}
footer h6
{
position: absolute;
top: 0;
text-align: center;
font-size: 1.2rem;
}
footer div
{
display: flex;
margin: auto;
width: 100%;
height: 100%;
justify-content: center;
align-items: center;
}
.footer_contatti
{
flex-direction: column;
}
.footer_contatti p a
{
color: #ffffff;
}
.footer_logo
{
flex-direction: column;
align-items: center;
}
.footer_logo img
{
margin-top: 1rem;
width: 30%;
}
.footer_logo p
{
text-align: justify;
}
.footer_social
{
flex-direction: column;
}
.footer_social section
{
display: flex;
width: 100%;
justify-content: space-evenly;
}
@media screen and (max-width: 720px)
{
footer
{
flex-direction: column;
}
footer h6
{
position: relative;
font-size: 0.8rem;
}
.footer_contatti
{
flex-direction: column;
}
.footer_contatti p
{
font-size: 0.5rem;
}
.footer_contatti p a
{
font-size: 0.8rem;
}
.footer_logo p
{
text-align: center;
width: 98%;
}
}
/*#endregion*/