@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Barlow:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

*{
    margin: 0;
    padding: 0;
    font-family: Arial, Helvetica, sans-serif;
}
body, html{
    height: 100%;
    width: 100%;
    position: relative;
}

.hb{
    width: 70%;
    height: 100%;
    background-color: rgb(255, 255, 255);
    position: fixed;
    z-index: 20;
    right: -800px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    transition: all ease 1.5s;
}
    .hb.hbOn{
        right: 0;
        transition: all ease 1.5s;
    }
    .hb-top{
        display: flex;
        flex-direction: row;
        width: 100%;
        justify-content: space-around;
        margin-top: 20px;
    }
    .hb ul{
        list-style: none;
        color: #131212;
        margin-top: 20%;
        text-align: center;
        padding: 10px;
    }
        .hb ul li{
            padding: 10px;
            
        }


header{
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/7/7d/Lago_Igap%C3%B3_Londrina.jpg/960px-Lago_Igap%C3%B3_Londrina.jpg?20161029144533);
    height: 100vh;    
    background-position: top;
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
    display: flex;
    flex-direction: column;
}
#backgroundPcHeader{
    display: none;
}

.headerBarOn{
    display: flex;
    flex-direction: row-reverse;
    width: 100%;
    height: 14vh;
    align-items: center;
    justify-content: space-between;
    color: rgb(39, 39, 39);
    position: fixed;
    transition: all ease 0.5s;
    top: 0;
}
    .headerBarOn.headerBarOff{
        top: -20vh;
        transition: all ease 0.5s;
    }
#logo{
    display: flex;
    width: 31%;
    margin: 6%;
    color: rgb(39, 39, 39);
    font-family: "Barlow", sans-serif;
}
#logo2{
    display: flex;
    width: 31%;
    margin: 6%;
    color: rgb(39, 39, 39);
    font-family: "Barlow", sans-serif;
}
#logopc{
    display: flex;
    width: 31%;
    margin: 6%;
    color: rgb(39, 39, 39);
    font-family: "Barlow", sans-serif;
    display: none;
}
#menuButton{
    margin: 10px;
    font-size: 27px;
}
.bgTr{
    background-color: #00000048;
    width: 100vw;
    height: 100vh;
    display: none;
    position: fixed;
    z-index: 7;
}
    .bgTr.bgTrOn{
        display: flex;
        z-index: 12;
    }
#translate{
    position: absolute;
    right: 20%;
    top: 29%;
    color: rgb(0, 0, 0);
    text-shadow: rgb(255, 255, 255) 4px 4px 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    z-index: 16;
}
    .translates{
        opacity: 0;
        background-color: #ffffff70;
        padding: 15px;
        font-size: 16px;
        border-radius: 7px;
        text-shadow: none;
        text-align: center;
        transition: all ease 0.5s;
        display: none;
        z-index: 16;
        position: absolute;
        right: 15%;
        top: 8%;
        width: 20%;
    }
        .translates.trOn{
            opacity: 10;
            transition: all ease 0.5s;
            display: block;
            z-index: 16;
        }
    .hr2{
        width: 80%; height: 1px; 
        background-color: #5c5c5c;
        margin: 5px 0px 5px 0px;
        justify-self: center;
    }
#descobrir{
    position: absolute;
    bottom: 78px;
    align-self: center;
    width: 30vw;
    height: 5vh;
    background-color: wheat;
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgb(39, 39, 39);
}

#descobrirDesktop{
    display: none;
}

.swiper {
  width: 100%;
  height: 100vh;
}

.swiper-button-next::after{
        color: white;
        text-shadow: black 4px 3px 3px;
    }
    .swiper-button-prev::after{
        color: white;
        text-shadow: black 4px 3px 3px;
    }
.swiper-slide{
    width: 100%;
    display: flex;
    align-items: center ;
    justify-content: center;
}
.slideText{
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
}
   
@keyframes float {
  0% {
    transform: translateY(0px);
  }
  50% {
    transform: translateY(-30px); /* Sobe */
  }
  100% {
    transform: translateY(0px); /* Volta à posição original */
  }
}
    .descobrirSlide{
        align-self: flex-end;
        align-self: flex-start;
        margin-top: 30%;
        color: white;
        font-size: 20px;
        height: 80%;
        width: 80%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
    }
        .descobrirSlide h1{
            margin-top: 10px;
            text-shadow: black 3px 3px 3px;
        }
        .slideButton{
            margin-bottom: 50px;
            width: 60%;
            height: 7%;
            background-color: #daedfe;
            color: rgb(19, 19, 19);
            text-align: center;
            display: flex;
            justify-content: center;
            align-items: center;
            border-radius: 10px;
            animation: float 7.5s infinite;

        }


#slide1{
    background-image: url(../src/media/part.jpg);
    background-position: center;
    background-size: cover;
}
#slide2{
    background-image: url(../src/media/camping.jpg);
    background-position: center;
    background-size: cover;
}
/*#slide3{
    background-image: url(../src/media/culinaria.jpg);
    background-position: center;
    background-size: cover;
}*/
#slide4{
    background-image: url(../src/media/familia.jpg);
    background-position: right;
    background-size: cover;
}
#slide5{
    background-image: url(../src/media/museu.jpg);
    background-position: right;
    background-size: cover;
}
#slide6{
    background-image: url(../src/media/feira.jpg);
    background-position: right;
    background-size: cover;
}

main{
    width: 100%;
    display: flex;
    flex-direction: column;
}

.divContent{
    width: 100%;
}

#eventos{
    background-position: left;
    background-size: cover;
    background-repeat: no-repeat;
    height: 100%;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    background-color: #f1f7ff;
}
    #eventos h2{
        margin: 20px 0px 0px 9px;
        align-self: center;
    }
#lista-eventos{
    width: 90%;
    height: 70%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-top: 19px;
    border:solid black 0.5px; ;
}
    #ulEvent li{
        list-style-type: none;
    }
        #ulEvent li a{
            text-decoration: none;
            color: rgb(12, 12, 12);
            
        }
#expoLondrina{
    background-color: #007d4b;
}

#expoTexts{
    /*background-color: rgba(17, 105, 17, 0.788);*/
    background-color: #007d4b;
    display: flex;
    width: 100%;
    flex-direction: column;
    justify-self: flex-end;
    color: white;
}
    #expoTexts h2,h3, p{
        margin: 7px 0px 0px 8px;
        text-align: left;
    }
    #expoTexts img{
        width: 100%;
    }
#iconsExpo{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
    width: 100%;
    gap: 10px;
    margin: 20px 0px 20px 0px;
}
    .iconEx{
        background-color: #015c37;
        padding: 5px;
        width: 34%;
        text-align: center;
        border-radius: 25px;
        border: solid white 0.5px;
    }
#expoText2{
    color: white;
    width: 100%;
    padding: 8px 0px 5px 0px;
    text-align: left;
    display: flex;
    flex-direction: column;
}
    #saberMaisExpo{
        background-color: #daedfe;
        display: flex;
        width: 40%;
        height: 50px;
        justify-self: flex-start;
        align-items: center;
        justify-content: center;
        border-radius: 5px;
        border: solid white 0.5px;
        font-size: 17px;
        color: #007d4b;
        margin: 30px 0px 20px 9px;
    }

.location{
    margin-top: 30px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 5px;
    font-family: "Work Sans", sans-serif;
}
    .location span{
        margin-bottom: 3px;
    }

#visiteLondrina{
    display: flex;
    flex-direction: row;
    width: 100%;
    align-items: center;
    justify-content: center;
    margin: 30px 1px 30px 1px;
}
    #visiteLodrinaLinkImg{
        width: 35%;
        margin-right: 8px;
        border-radius: 5px;
    }
    #vlt{
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }
        #vlt a{
            margin-top: 40px;
        }

    @keyframes arrowRight{
        0%{
            transform: translateY(0px);
        }
        50%{
            transform: translateY(30px);
        }
        100%{
            transform: translateY(0px);
        }
    }
        #arrowLeft{
            animation: arrowRight 1.5s infinite;
            font-size: 36px;
        }

.hr {
  width: 80%; height: 1px; 
  background-color: #5c5c5c;
  margin-top: 20px;
  justify-self: center;
}

#ecoTurismo{
    display: flex;
    align-items: center;
    flex-direction: column;
    height: 100%;
    margin-top: 30px;
}

    @keyframes photoGo{
        0%{
            transform: translateX(0px)
        }
        50%{
            transform: translateX(30px);
        }
        0%{
            transform: translateX(0px);
        }
    }
    #ecoturismoIntro{
        margin-top: 20px;
        display: flex;
        flex-direction: column;
    }
    #ecoturismoIntro h1{
        margin-left: 10px;
    }
    #ecoturismoIntro p{
        font-size: 20px;
        margin-left: 10px;
        margin-top: 2px;
        margin-bottom: 20px;
    }

    #ecoturismoIntro img{
        width: 70%;
        animation: photoGo 10s infinite;
    }
.swiper2{
width: 100%;
height: 445px;
margin-top: 46px;
}
   #ecoTurismo .swiper-slide{
        height: 80%;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .ecoC{
        background-color: white;
        height: 90%;
        width: 91%;
        padding: 10px;
        background-color: #007d4b;
        box-shadow: black 3px 3px 6px;
        color: white;
        
    }
        .ecoC p{
            text-align: left;
            margin-left: 0;
        }
        .ecoC img{
            width: 87%;
            border-radius: 10px;
            margin: 0px 0px 5px 0px;
        }
            #ecoS5img{
                width: 75%;
            }    
        .linksEcoC{
            display: flex;
            align-items: center;
            justify-content: center;
            background-color: #daedfe;
            color: #015c37;
            width: 40%;
            height: 12%;
            border-radius: 3px;
            margin-top: 20px;
        }
    #ecoTurismo .swiper-button-prev{
        top: 5%;
        left: 80%;
        background-color: #015c37;
    }
        #ecoTurismo .swiper-button-prev::after{
            font-size: 20px;
            text-shadow: none;
        }
    #ecoTurismo .swiper-button-next{
        top: 5%;
        left: 90%;
        background-color: #015c37;
    }
        #ecoTurismo .swiper-button-next::after{
            font-size: 20px;
            text-shadow: none;
        }
    #ecoTurismo .swiper-scrollbar{
        display: none;
    }
    #ecoTurismo .swiper-pagination{
        display: none;
    }

#feiras{
    height: 100%;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    
}
    #img1{
        width: 80%;
        align-self: flex-end;
        margin: 70px 10px 3px 0px;
        border-radius: 5px;
    }
    #img2{
        width: 66%;
        align-self: flex-start;
        margin: 20px 0px 10px 9px;
        padding-top: 40px;
        border-radius: 5px;
    }
    #feiras h1{
        margin:50px 0px 3px 9px ;
        align-self: flex-start;
    }
    #pFeira1{
        margin:1px 0px 3px 9px ;
        align-self: flex-start;
    }
    #pFeira2{
        margin:20px 1px 1px 60px ;
        align-self: flex-end;
    }
    #mapFeiras{
        background-image: linear-gradient(to right, rgb(43, 110, 43), rgba(43, 110, 43, 0));
        align-self: self-start;
        margin-left: 9px;
        padding: 4px;
        width: 66%;
        height: 27px;
        display: flex;
        align-items: center;
        justify-content: flex-start;
        border-radius: 4px;
        text-align: left;
        color: white;
    }
@keyframes clickEffect {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(0.91);
  }
  100% {
    transform: scale(1);
  }
}
    #touch{
        animation: clickEffect 1.8s infinite;
    }
    


#familia{
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;

}
    #familia .hr{
        align-self: center;
    }
    #familia h1{
        margin: 8px ;
        color: #012c1b;
    }
    #familia img{
        width: 70%;
        align-self: flex-end;
        margin: 10px 8px 20px 0px;
    }
    .swiperCtn{
        width: 90%;
        padding-top: 5px;
        padding-bottom: 20px;
        border: solid rgba(0, 0, 0, 0.377) ;
        border-radius: 10px;
        align-self: center;
        margin: 10px 0px 10px 0px;
    }

    #swiperCtnContainer{
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    }

.swiper3{
    width: 100%;
    height: 260px;
    overflow: hidden;
    
}
.swiperCtn .swiper-slide{
    width: 100%;
    height: 100%;
    border-radius: 8px;
}
.swiperCtn h3{
    align-items: center;
    display: flex;
    color: #012c1b;
}
#igp1{
    background-image: url("https://live.staticflickr.com/865/40656400755_b40d0833ab_b.jpg");
    background-position: center;
    background-size: cover;
}
#igp2{
    background-image: url("https://as1.ftcdn.net/jpg/05/22/77/60/1000_F_522776067_C7l8uTlLuz4CbATfsBXMoize4MS6dtu4.jpg");
    background-position: center;
    background-size: cover;
}
#igp3{
    background-image: url("https://live.staticflickr.com/800/41549290041_1a5f3dc05a_b.jpg");
    background-position: center;
    background-size: cover;
}
#jb1{
    background-image: url("https://live.staticflickr.com/698/31993248221_736b16fc1b_b.jpg");
    background-position: center;
    background-size: cover;
}
#jb2{
    background-image: url("https://thumbs.dreamstime.com/b/jardim-bot%C3%A2nico-112058427.jpg");
    background-position: center;
    background-size: cover;
}
#jb3{
    background-image: url("https://vault.pulsarimagens.com.br/file/thumb/33ER544.jpg");
    background-position: center;
    background-size: cover;
}
#jb4{
    background-image: url("https://vault.pulsarimagens.com.br/file/thumb/33ER601.jpg");
    background-position: center;
    background-size: cover;
}
#jb5{
    background-image: url("https://vault.pulsarimagens.com.br/file/thumb/33ER601.jpg");
    background-position: center;
    background-size: cover;
}

#historiaEmuseus{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: left;
    width: 95%;
}
    .museusLista{
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: left;
        width: 100%;
    }
        .museusLista img{
            width: 90%;
        }
        .museusLista article{
            width: 100%;
            display: flex;
            flex-direction: column;
            align-items: flex-start;
        }
            .museusLista article p{
                text-align: left;
            }   
        .museusLista article small{
            margin-left: 9px;
        }    

footer{
    margin-top: 30px;
    display: flex;
    flex-direction: column;
    align-items: center;
    background-color: #007d4b;
    color: white;
}
    .listFooter ul{
        list-style: none;
        text-align: center;
    }
    .listFooter ul a{
        color: white;
    }
    .oqfazeremLondrina a{
        color: #f1f7ff;
    }

#swiperDesktop{
    display: none;
    width: 100%;
    
    
}

@media(min-width: 1024px) {
    .hb{
        right: -1000px;
        width: 20%;
    }
    .headerBarOn{
        font-size: 20px;
        z-index: 10;
        transition: all ease 0.4s;
    }
    header{
        position: relative;
        height: 112vh;
    }

    #backgroundPcHeader{
    width: 100%;
    height: 100%;
    background-image:url(../src/media/Lago_Igapó_Londrina-Photoroom.png) ;
    background-position: center;
    background-size: cover;
    display: flex;
    z-index: 6;
    }

@keyframes textDance {
  0%   { transform: translate(-50%, -50%) translateY(0px); }
  50%  { transform: translate(-50%, -50%) translateY(43px); }
  100% { transform: translate(-50%, -50%) translateY(0px); }
}

    #logopc{
        position: absolute;
        left: 50%;
        top: 29%;
        transform: translate(-50%, -50%);
        margin: 0;
        display: flex;
        width: 100%;
        height: 25%;
        align-items: center;
        justify-content: center;
        font-size: 121px;
        z-index: 5;
        animation: textDance 3.1s infinite;
        font-family: "Bebas Neue", sans-serif;
    }
        #h2HeaderLogopc{
        font-family: "Bebas Neue", sans-serif;
        text-shadow: #00000070 1px 6px 7px; 
        right: 10%;
        cursor: pointer;
        font-size: 121px;
    }
    #h2HeaderLogo{
        display: none;
    }
    #translate{
        right: 8%;
        cursor: pointer;
    }
        #ptBr{
            cursor: pointer;
        }
            #ptBr:hover{
                color: #012c1b;
                text-decoration: underline;
            }
        #en{
            cursor: pointer;
        }  
            #en:hover{
                color: #012c1b;
                text-decoration: underline;
            }
        #es{
            cursor: pointer;
        }  
            #es:hover{
                color: #012c1b;
                text-decoration: underline;
            }
    #menuButton{
        cursor: pointer;
    }
    #closeBar{
        cursor: pointer;
    }
    #contribuir{
        cursor: pointer;
        transition: all ease 1.5s;
    }
        #contribuir:hover{
            text-decoration: underline;
            transition: all ease 1.5s;
        }

    #descobrir{
        display: none;
    }
    #descobrirDesktop{
        position: absolute;
        bottom: 160px;
        align-self: center;
        width: 25vw;
        height: 8vh;
        background-color: #007d4b;
        border-radius: 20px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: white;
        z-index: 7;
        transition: all ease 1.5s;
        cursor: pointer;
    }
        #descobrirButtonDesktop{
            font-family: "Bebas Neue", sans-serif;
            font-size: 160%;
        }
    #descobrirDesktop:hover{
        width: 27vw;
        height: 9vh;
        bottom: 163px;
        transition: all ease 1.5s;
    }
    .bgTr{
        z-index: 17;
        height: 100vh;
    }

    #swiperMain{
        display: none;
    }

    #swiperDesktop{
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
   }
    .linksDesktop{
        width: 100%;
        background-color: white;
        height: 100%;
        position: relative;
        display: flex;
    }
        .linksDesktop img{
            width: 60%;
        }
        .coverPic{
            width: 40%;
            height: 45%;
            background-color: #007d4b;
            position: absolute;
            left: 45%;
            top: 8%;
            display: flex;
            flex-direction: column;
            align-items: flex-start;
            justify-content: center;
            border-radius: 10px;
            color: white;
            padding: 10px;
        }
            .coverPic h1{
                position: absolute;
                top: 10%;
                left: 7%;
            }   
            .coverPic p{
                position: absolute;
                top: 23%;
                left: 6%;
                margin-right: 5%;
            }
            .desktopButton{
                background-color: white;
                color: #012c1b;
                width: 26%;
                height: 16%;
                display: flex;
                align-items: center;
                justify-content: center;
                border-radius: 6px;
                align-self: center;
                margin-bottom: 5px;
                position: absolute;
                bottom: 10%;
                cursor: pointer;
            }
            #coverPic1{
             display: flex;   
            }
            #coverPic2{
                left: 10%;
            }
            #coverPic3{
                display: flex;
            }
            #coverPic4{
                left: 10%;
            }
            #coverPic5{
                display: flex;
            }
        #linkD1{
            flex-direction: row;
        }
        #linkD2{
            flex-direction: row-reverse;
        }
        #linkD3{
            flex-direction: row;
        }
        #linkD4{
            flex-direction: row-reverse;
        }
        #linkD5{
            flex-direction: row;
        }
        
    #eventos{
        flex-direction: column;
        height: 100%;
    }
    #expoLondrina{
        display: flex;
        flex-direction: column;
    }
    #expoTexts{
        /*background-color: rgba(17, 105, 17, 0.788);*/
        background-color: #007d4b;
        display: flex;
        width: 100%;
        flex-direction: row;
        align-items: center;
        height: 100%;
    }
    #infosExpoMain{
        display: flex;
        flex-direction: column;
        width: 100%;
        height: 100%;
        align-self: flex-start;
        margin-top: 4%;
    }
        #infosExpoMain h2{
            font-size: 50px;
            margin-left: 15px;
            align-self: flex-start;
        }
        #infosExpoMain p{
            margin-left: 18px;
        }
        #expoTexts img{
            width: 40%;
            margin-top: 10px;
        }
    #iconsExpo{
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
        width: 70%;
        gap: 15px;
        margin: 20px 0px 20px 0px;
        align-items: center;
        height: 100%;
    }
    .iconEx{
        background-color: #015c37;
        
        width: 90%;
        height: 15%;
        text-align: center;
        border-radius: 0;
        border: solid white 0.5px;
        display: flex;
        align-items: center;
        justify-content: center;

    }
    
        #expoLondrina iframe{
            width: 70%;
            height: 500px;
            align-self: center;
            margin: 10px 0px 0px 10px;
        }
    #expoText2{
        align-items: center;
        padding: 50px 0px 100px 0px;
        width: 70%;
        align-self: center;
    }
    #p02{
        display: none;
    }
    .hr{
        width: 50%;
    }
    #visiteLodrinaLinkImg{
        width: 15%;
    }

    #ecoTurismo{
        margin: 10px 0px 0px 0px;
    }
    #ecoturismoIntro{
        flex-direction: row-reverse;
        display: flex;
        width: 100%;
        justify-content: flex-end;
    }
        #ecoturismoIntro img{
            width: 20%;
            left: 0;
            margin-left: 3%;
        }
    #ecoTIDiv{
        display: flex;
        flex-direction: column;
        margin-left: 10%;
        margin-top: 10%;
    }
    .swiper2{
        width: 95%;
        height: 100%;
    }
   
    .ecoC img{
        width: 70%;
    }
    #ecoS5img{
                width: 60%;
            }
    #ecoS4 img{
        width: 80%;
    }        
    .linksEcoC{
        height: 40%;
    }
    
       #ecoTurismo .swiper-button-prev{
        top: 5%;
        left: 93%;
        background-color: #015c37;
    }
        #ecoTurismo .swiper-button-prev::after{
            font-size: 20px;
            text-shadow: none;
        }
    #ecoTurismo .swiper-button-next{
        top: 5%;
        left: 96%;
        background-color: #015c37;
    }
        #ecoTurismo .swiper-button-next::after{
            font-size: 20px;
            text-shadow: none;
        }

    #introFamilia{
        width: 100%;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: flex-end;
    }
    #introFamilia img{
        width: 28%;

    }
    #introFamilia h1{
        margin: 0% 10% 0% 0%;
    }

    #swiperCtnContainer{
    width: 100%;
    height: 100%;
    display: flex;
    
    flex-direction: row;
    align-items: center;
    justify-content: space-around;
    }
    .swiper3{
        width: 100%;
        height: 400px;
        overflow: hidden;
        
    }
    .swiperCtn{
        width: 40%;
    }
    .swiperCtn .swiper-slide{
        width: 100%;
        height: 100%;
        border-radius: 8px;
    }
    .swiperCtn h3{
        align-items: center;
        display: flex;
        color: #012c1b;
    }    
    #historiaEmuseus{
        width: 90%;
        align-items: flex-start;
    }
        #historiaEmuseus h1{
            font-size: 52px;
        }
        #historiaEmuseus .hr{
            align-self: center;
            margin-bottom: 30px;
        }
    .museusLista{
        margin-top: 20px;
        width: 70%;
        align-self: center;
        border: solid black 1px;
        border-radius: 4%;
        padding: 20px;
    }
    .museusLista img{
        width: 30%;
    }

    #feirasapre{
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: center;
        width: 80%;
    }
        #feirasapre h1{
            font-size: 40px;
        }
    #feirasapre img{
        width: 50%;
    }
    #img2{
        width: 20%;
        cursor: pointer;
    }
    #mapfes{
        width: 100%;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
    }
    #mapFeiras{
        align-self: center;
        width: 30%;
        height: 200px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    footer{
        padding-bottom: 10px;
    }

    #logo2{
        width: 30%;
        align-self: center;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 20px;
    }

}