@import url("https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Rubik:wght@600&display=swap");
@import url("https://fonts.googleapis.com/css2family=Bebas+Neue&family=Rubik:wght@600&family=Yanone+Kaffeesatz:wght@300&display=swap");
@import url('https://fonts.googleapis.com/css2?family=K2D:wght@100&family=Sarala&display=swap');
@import url('https://fonts.googleapis.com/css2?family=K2D:wght@100&display=swap');
@import url('https://fonts.googleapis.com/css2?family=K2D:wght@100&family=Righteous&family=Sarala&display=swap');
@import url('https://fonts.googleapis.com/css2?family=K2D:wght@100&family=M+PLUS+1p:wght@100&family=Righteous&family=Sarala&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Righteous&display=swap');


*{ margin: 0;
    padding: 0;
    text-decoration: none;
}

.menu {
    position: fixed;
    background-color: rgb(182, 39, 39);
    top: 0px;
    left: 0%;
    width: 1007px;
    height: 65px;
    z-index: 1;
    -webkit-box-shadow: -5px 8px 5px rgba(50, 50, 50, 0.40);
	-moz-box-shadow: -5px 8px 5px rgba(50, 50, 50, 0.40);
	box-shadow: -5px 8px 5px rgba(50, 50, 50, 0.397);
    
}

.text-menu {
    position: fixed;
    top: 12px;
    left: 12%;
    color: rgb(255, 255, 255);
    font-size: 25px;
    font-family: 'M PLUS 1p', sans-serif;
    cursor: default;
    z-index: 6;
}

.r {
    position: fixed;
    top: 12px;
    left: 23.1%;
    color: rgb(255, 255, 255);
    font-size: 14px;
    font-family: 'M PLUS 1p', sans-serif;
    cursor: default;
    z-index: 6;
}


.bandeira-franca {
    width: 30px;
    height: 2080px;
    top: 0px;
    left: 20px;
    position: absolute;
    z-index: 1;
}


.btn-voltar {
    width: 33px;
    height: 33px;
    top: 15px;
    left: 930px;
    position: fixed;
    z-index: 2;
    transition: all 0.5s;
    cursor: pointer;

}

.btn-voltar:hover {
    -webkit-transform: scale(1.4);
    transform: scale(1.4);

}


.titulo-principal {
    position: absolute;
    top: 145px;
    left: 13%;
    color: #080167;
    font-size: 35px;
    font-family: 'M PLUS 1p', sans-serif;
    cursor: default;
}

.foto-principal {
    position: absolute;
    width: 800px;
    height: 400px;
    top: 230px;
    left: 12.2%;
    border-radius: 4px;
}

.text-1 {
    position: absolute;
    top: 705px;
    left: 16.5%;
    color: rgb(141, 134, 134);
    font-size: 16px;
    font-family: 'K2D', sans-serif;
    width: 740px;
    line-height: 34px;
    cursor: default;
}


.titulo-2 {
    position: absolute;
    top: 1010px;
    left: 10%;
    color: #080167;
    font-size: 33px;
    font-family: 'M PLUS 1p', sans-serif;
    cursor: default;

}


.ponto-1 {
    position: absolute;
    width: 270px;
    height: 165px;
    top: 1100px;
    left: 10%;
    transition: all 0.5s;
    cursor: pointer;
    border-radius: 7px;
}

.ponto-1:hover {
    -webkit-transform: scale(1.06);
    transform: scale(1.06);
    -webkit-filter: drop-shadow(20px 10px 5px rgba(0,0,0,.5));
    filter: drop-shadow(20px 15px 5px rgba(0,0,0,.5));
}





.ponto-2 {
    position: absolute;
    width: 270px;
    height: 165px;
    top: 1100px;
    left: 39%;
    transition: all 0.5s;
    cursor: pointer;
    border-radius: 7px;
}

.ponto-2:hover {
    -webkit-transform: scale(1.06);
    transform: scale(1.06);
    -webkit-filter: drop-shadow(20px 10px 5px rgba(0,0,0,.5));
    filter: drop-shadow(20px 15px 5px rgba(0,0,0,.5));
}





.ponto-3 {
    position: absolute;
    width: 270px;
    height: 165px;
    top: 1100px;
    left: 68%;
    transition: all 0.5s;
    cursor: pointer;
    border-radius: 7px;
}

.ponto-3:hover {
    -webkit-transform: scale(1.06);
    transform: scale(1.06);
    -webkit-filter: drop-shadow(20px 10px 5px rgba(0,0,0,.5));
    filter: drop-shadow(20px 15px 5px rgba(0,0,0,.5));
}




.ponto-4 {
    position: absolute;
    width: 270px;
    height: 165px;
    top: 1370px;
    left: 10%;
    transition: all 0.5s;
    cursor: pointer;
    border-radius: 7px;
}

.ponto-4:hover {
    -webkit-transform: scale(1.06);
    transform: scale(1.06);
    -webkit-filter: drop-shadow(20px 10px 5px rgba(0,0,0,.5));
    filter: drop-shadow(20px 15px 5px rgba(0,0,0,.5));
}



.ponto-5 {
    position: absolute;
    width: 270px;
    height: 165px;
    top: 1370px;
    left: 39%;
    transition: all 0.5s;
    cursor: pointer;
    border-radius: 7px;
}

.ponto-5:hover {
    -webkit-transform: scale(1.06);
    transform: scale(1.06);
    -webkit-filter: drop-shadow(20px 10px 5px rgba(0,0,0,.5));
    filter: drop-shadow(20px 15px 5px rgba(0,0,0,.5));
}



.ponto-6 {
    position: absolute;
    width: 270px;
    height: 165px;
    top: 1370px;
    left: 68%;
    transition: all 0.5s;
    cursor: pointer;
    border-radius: 7px;
}

.ponto-6:hover {
    -webkit-transform: scale(1.06);
    transform: scale(1.06);
    -webkit-filter: drop-shadow(20px 10px 5px rgba(0,0,0,.5));
    filter: drop-shadow(20px 15px 5px rgba(0,0,0,.5));
}





.ponto-7 {
    position: absolute;
    width: 270px;
    height: 165px;
    top: 1640px;
    left: 10%;
    transition: all 0.5s;
    cursor: pointer;
    border-radius: 7px;
}

.ponto-7:hover {
    -webkit-transform: scale(1.06);
    transform: scale(1.06);
    -webkit-filter: drop-shadow(20px 10px 5px rgba(0,0,0,.5));
    filter: drop-shadow(20px 15px 5px rgba(0,0,0,.5));
}



.ponto-8 {
    position: absolute;
    width: 270px;
    height: 165px;
    top: 1640px;
    left: 39%;
    transition: all 0.5s;
    cursor: pointer;
    border-radius: 7px;
}

.ponto-8:hover {
    -webkit-transform: scale(1.06);
    transform: scale(1.06);
    -webkit-filter: drop-shadow(20px 10px 5px rgba(0,0,0,.5));
    filter: drop-shadow(20px 15px 5px rgba(0,0,0,.5));
}



.ponto-9 {
    position: absolute;
    width: 270px;
    height: 165px;
    top: 1640px;
    left: 68%;
    transition: all 0.5s;
    cursor: pointer;
    border-radius: 7px;
}

.ponto-9:hover {
    -webkit-transform: scale(1.06);
    transform: scale(1.06);
    -webkit-filter: drop-shadow(20px 10px 5px rgba(0,0,0,.5));
    filter: drop-shadow(20px 15px 5px rgba(0,0,0,.5));
}



.legenda-1 {
    position: absolute;
    top: 1270px;
    left: 10.5%;
    color: rgb(100, 96, 96);
    font-size: 18px;
    font-family: 'K2D', sans-serif;
    width: 740px;
    cursor: default;
}

.legenda-2 {
    position: absolute;
    top: 1270px;
    left: 39.5%;
    color: rgb(100, 96, 96);
    font-size: 18px;
    font-family: 'K2D', sans-serif;
    width: 740px;
    cursor: default;
    
}

.legenda-3 {
    position: absolute;
    top: 1270px;
    left: 68.5%;
    color: rgb(100, 96, 96);
    font-size: 18px;
    font-family: 'K2D', sans-serif;
    width: 740px;
    cursor: default;
}


.legenda-4 {
    position: absolute;
    top: 1540px;
    left: 10.5%;
    color: rgb(100, 96, 96);
    font-size: 18px;
    font-family: 'K2D', sans-serif;
    width: 740px;
    cursor: default;
}

.legenda-5 {
    position: absolute;
    top: 1540px;
    left: 39.5%;
    color: rgb(100, 96, 96);
    font-size: 18px;
    font-family: 'K2D', sans-serif;
    width: 740px;
    cursor: default;
}

.legenda-6 {
    position: absolute;
    top: 1540px;
    left: 68.5%;
    color: rgb(100, 96, 96);
    font-size: 18px;
    font-family: 'K2D', sans-serif;
    width: 740px;
    cursor: default;
}


.legenda-7 {
    position: absolute;
    top: 1810px;
    left: 10.5%;
    color: rgb(100, 96, 96);
    font-size: 18px;
    font-family: 'K2D', sans-serif;
    width: 740px;
    cursor: default;
}

.legenda-8 {
    position: absolute;
    top: 1810px;
    left: 39.5%;
    color: rgb(100, 96, 96);
    font-size: 18px;
    font-family: 'K2D', sans-serif;
    width: 740px;
    cursor: default;
}

.legenda-9 {
    position: absolute;
    top: 1810px;
    left: 68.5%;
    color: rgb(100, 96, 96);
    font-size: 18px;
    font-family: 'K2D', sans-serif;
    width: 740px;
    cursor: default;
}

.rodape-base {
    position: absolute;
    background-color: rgb(30, 31, 117);
    top: 1950px;
    left: 0%;
    width: 1007px;
    height: 130px;
    
}

.text-rodape-1 {
    position: absolute;
    top: 1980px;
    left: 8.7%;
    color: aliceblue;
    font-size: 14px;
    font-family: 'K2D', sans-serif;
    cursor: default;
    width: 720px;
    z-index: 6;
}

.bandeira-franca-rodape {
    width: 30px;
    height: 20px;
    top: 1980px;
    left: 860px;
    position: absolute;
    z-index: 8;
    border-radius: 4px;
}

.la-france {
    font-family: 'K2D', sans-serif;
    font-size: 13px;
    color: aliceblue;
    top: 1981px;
    left: 895px;
    position: absolute;
    cursor: default;
}