:root{
  --guinda1: #682145;
  --guinda2: #45112a;
  --dorado1: #bc955c;
  --dorado2: #ddc9a3;
  --verde1: #30453b;
  --verde2: #265b4d;
  --blancosuave: #f6f3ee;
  --blanco: #ffffff;
  --slategray: #767B91;
  --ghostwhite: #f3f5fa;
}
@font-face {
  font-family: 'Zodiak';
  src: url(../fonts/Zodiak-Variable.ttf);
}
@font-face {
  font-family: 'ZodiakItalic';
  src: url(../fonts/Zodiak-VariableItalic.ttf);
}
@font-face {
  font-family: 'OpenSans';
  src: url(../fonts/OpenSans-VariableFont_wdth\,wght.ttf);
}
@font-face {
  font-family: 'OpenItalic';
  src: url(../fonts/OpenSans-Italic-VariableFont_wdth\,wght.ttf);
}
/*Estilos de navegación*/
.navbar{
    background-image: url(../img/logos/greca.png);
    background-repeat: repeat-x;
    background-position-x: center;
    background-position-y: bottom;
    background-size: 20%;
}
@media (min-width: 768px) {
    .navbar{
        background-size: 10%;
    }
}
@media (min-width: 1024px) {
    .navbar{
        background-size: 7%;
    }
}
@media (min-width: 1200px) {
    .navbar{
        background-size: 5%;
    }
}
.navegacion img{
    width: 65%;
}
.navegacion .gobab{
    width: 60%;
}
.navegacion .vecinos{
    width: 55%;
}
@media (min-width: 768px) {
    .navegacion img{
        width: 70%;
    }
    .navegacion .vecinos, .navegacion .gobab{
        width: 60%;
    }
}
@media (min-width: 1024px) {
    .navegacion img{
        width: 75%;
    }
    .navegacion .vecinos{
        width: 55%;
    }
    .navegacion .gobab{
        width: 55%;
    }
}
@media (min-width: 1200px) {
    .navegacion img{
        width: 50%;
    }
    .navegacion .vecinos{
        width: 35%;
    }
    .navegacion .gobab{
        width: 45%;
    }
}
@media (min-width: 1728px) {
    .navegacion img{
        width: 45%;
    }
    .navegacion .vecinos{
        width: 30%;
    }
    .navegacion .gobab{
        width: 35%;
    }
}
.menu{
    background-color: var(--dorado1);
}
.menu a{
    font-family: 'OpenSans';
    color: var(--blanco);
    transition: all ease 0.3s;
}
.menu a:hover{
    color: var(--guinda1);
    text-shadow: 5px 5px 10px var(--guinda1);
}
.footer-top{
    background-color: var(--dorado1);
}
.footer-top img{
    width: 50%;
}
.footer-top h6{
    font-family: 'OpenSans';
    color: var(--blanco);
}
.footer-top h5{
    font-family: 'Zodiak';
    color: var(--verde1);
}
.footer-top p{
    font-family: 'OpenSans';
    color: var(--blanco);
    flex-grow: 1;
}
.footer-bottom img{
    width: 50%;
}
.footer-bottom .vecinos{
    width: 100%;
}
@media (min-width: 768px) {
    .footer-bottom img{
        width: 80%;
    }
    .footer-bottom .vecinos{
        width: 80%;
    }
}
@media (min-width: 1024px) {
    .footer-bottom .vecinos{
        width: 65%;
    }
}
@media (min-width: 1200px) {
    .footer-bottom img{
        width: 50%;
    }
    .footer-bottom .vecinos{
        width: 40%;
    }
}
.contador h6{
    font-family: 'OpenSans';
    color: var(--dorado1);
}
.contador div{
    font-family: 'Zodiak';
    color: var(--guinda1);
}