/*FONTS*/

@font-face {
    font-family: 'GalanoGrotesque';
    src: url('../fonts/GalanoGrotesque-ExtraLight.woff2') format('woff2'),
        url('../fonts/GalanoGrotesque-ExtraLight.woff') format('woff');
    font-weight: 200;
    font-style: normal;
}

@font-face {
    font-family: 'GalanoGrotesque';
    src: url('../fonts/GalanoGrotesque-Heavy.woff2') format('woff2'),
        url('../fonts/GalanoGrotesque-Heavy.woff') format('woff');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'GalanoGrotesque';
    src: url('../fonts/GalanoGrotesque-Light.woff2') format('woff2'),
        url('../fonts/GalanoGrotesque-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'GalanoGrotesque';
    src: url('../fonts/GalanoGrotesque-Black.woff2') format('woff2'),
        url('../fonts/GalanoGrotesque-Black.woff') format('woff');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'GalanoGrotesque';
    src: url('../fonts/GalanoGrotesque-SemiBold.woff2') format('woff2'),
        url('../fonts/GalanoGrotesque-SemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'GalanoGrotesque';
    src: url('../fonts/GalanoGrotesque-Medium.woff2') format('woff2'),
        url('../fonts/GalanoGrotesque-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'GalanoGrotesque';
    src: url('../fonts/GalanoGrotesque-Thin.woff2') format('woff2'),
        url('../fonts/GalanoGrotesque-Thin.woff') format('woff');
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: 'GalanoGrotesque';
    src: url('../fonts/GalanoGrotesque-ExtraBold.woff2') format('woff2'),
        url('../fonts/GalanoGrotesque-ExtraBold.woff') format('woff');
    font-weight: 800;
    font-style: normal;
}

@font-face {
    font-family: 'GalanoGrotesque';
    src: url('../fonts/GalanoGrotesque-Bold.woff2') format('woff2'),
        url('../fonts/GalanoGrotesque-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'GalanoGrotesque';
    src: url('../fonts/GalanoGrotesque-Italic.woff2') format('woff2'),
        url('../fonts/GalanoGrotesque-Italic.woff') format('woff');
    font-weight: normal;
    font-style: italic;
}

/*GENERAL*/
html, body, section, h1, h2, h3, h4, p, img,ul, ol, li {
    margin: 0;
    padding: 0;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: 'GalanoGrotesque';
    font-weight: 500;
    position: relative;
    background: #edeff2;
}

section {
    padding: 60px 20px;
}

h1 {
    font-weight: 800;
    color: white;
    font-size: 3em;
    line-height: 1;
}

h2 {
    font-weight: 800;
    color: #ffce00; 
    border-bottom: 1px solid white;
    margin-bottom: 20px;
    font-size: 4em;
}

h2 span {
    display: block;
    font-size: .2em;
    font-weight: 400;
    letter-spacing: 5px;
    color: #5c5c5d;
}

h3 {
    font-weight: 600;
    color: white;
    margin-bottom: 20px;
    font-size: 2.2em;
}

a,
a:hover {
    text-decoration: none;
    color: inherit;
    cursor: pointer;
}

img {
    max-width: 100%;
}

/*NAV*/

.bg-dark {
    background: transparent !important;
}

#servicios2 .bg-dark,
#contacto2 .bg-dark {
    background: #042686 !important;
}

.dropdown-toggle::after {
    display: none;
}

.tel-correo {
    background: #ffce00;
    color: #042686;
    padding: 2px 10px;
    right: 20px;
    position: absolute;
    top: 10px;
}

.tel-correo li {
    list-style: none;
    display: inline-block;
}

.navbar-nav {
    margin-top: 28px !important
}

.contact-mobile {
    background: #ffce00;
    color: #042686;
    text-align: center;
    position: fixed;
    width: 100%;
    padding: 6px 5px 6px;
    font-size: 13px;
    z-index: 11111;
    top: 0;
}


/*MAIN*/

#main {
    background: url("../img/main.jpg");
    background-size: cover;
    padding: 300px 0 300px;
}

#main p {
    color: #ffce00;
    max-width: 440px;
    margin: 10px auto 0;
}

/*SERVICIOS*/

#servicios {
    background: #05369b;
    padding: 0;
    padding: 60px 0 0 0;
}

#servicios h2 span {
    color: #bebfc0;
}

#servicios p {
    color: white;
    font-size: .8em;
}

#servicios .light {
    padding: 60px 20px;
}

.dark {
    background: #042686;
    padding: 60px 20px;
}

#servicios .cuadro {
    background: #c6c6b9;
    width: 100%;
    height: 0;
    padding-top: 50%;
    padding-bottom: 50%;
    margin-bottom: 15px;
}

#servicios .title {
    color: #ffce00;
    font-size:.9em;
}

#servicios .text-description h3 {
    margin-bottom: 0;
}

#servicios .text-description p {
    margin-bottom: 20px;
    color: #ffce00;
    font-size: .9em;
    max-width: 370px;
}

#servicios2 #tabla {
    color: white;
}

#servicios2 #tabla td {
    text-align: center;
    border: 1px solid white;
    padding: 9px 10px 14px;
    font-size: 13px;
}

#servicios2 #tabla h3 {
    margin-top: 60px;
}

#servicios2 #tabla h4 {
    margin-top: 30px;
}

#servicios2 #tabla table {
    margin-top: 20px;
    table-layout: fixed;
    width: 100%;
}

#servicios2 #tabla table.marca {
    background: url(../img/inmansu2.png);
    background-size: 270px;
    background-repeat: repeat;
}

/*CATALOGO*/

#catalogo h2 {
    color: #042686;
    border-bottom: 1px solid #042686;
}

#catalogo p {
    font-size: .8em;
}

#catalogo button {
    background: #042686;
    border: none;
    color: white;
    padding: 2px 20px;
    margin-top:10px;
}

/*CONTACTO*/

#contacto {
    background: url("../img/contacto-bg.png");
    background-size: cover;
    background-position: center center;
    padding: 60px 20px;
}

#contacto2 {
    padding: 60px 0 0 0;
}

#contacto h2 {
    color: white;
    font-size: 3em;
    border-bottom: none;
    margin-bottom: 10px;
}

#contacto h2 span {
    color: #bebfc0;
}

#contacto hr {
    border-top: 1px solid #edb22f;
    max-width: 60px;
    margin: 0 0 50px;
}

#contacto ul li {
    list-style: none;
    color: white;
}

#contacto ul li {
    margin-bottom: 25px;
}

#contacto ul li img {
    display: inline-block;
    margin-right: 10px;
    float: left;
}

#contacto .redes-sociales {
    margin-bottom: 20px;
}

#contacto .redes-sociales i {
    color: #f0bd0e;
    font-size: 1.5em;
    margin-right: 12px;
}

#contacto form {
    margin-top:20px;
}

#contacto input,
#contacto textarea {
    padding: 2px 15px 8px;
    font-size: 15px;
    line-height: 15px;
    height: auto;
    border-radius: 0;
    border: none;
}

#contacto input[type="submit"] {
    background: #edb200;
    color: #1b2078;
    text-transform: uppercase;
    padding: 5px 20px 10px;
    float: right;
}

#contacto .form-group {
    margin: 8px 0;
}

/*FOOTER*/
footer {
   background: #edeff2; 
   padding: 60px 20px;
   text-align: center;
}

footer p {
    color: #c4c6c9;
    margin-top: 10px;
}

/*MODAL*/

.modal-header {
    border-radius: 0 !important;
    border-bottom: none;
    padding-bottom: 0;
}

.modal-header .close {
    background: #041a76;
    opacity: 1;
    color: white;
    text-shadow: none;
    padding: 8px 10px;
}

.close:not(:disabled):not(.disabled):hover {
    opacity: 1;
}

.modal-header .close img {
    max-width: 17px;
}

.modal-body {
    padding-bottom: 40px;
}

.modal-content {
    border-radius: 0;
}

.modal-content h5 {
    color: #042686;
    font-size: 1.7em;
}

.modal-content h5 span {
    color: #767676;
    display: block;
    font-size: .6em;
}

.modal-content p {
    color: #666e84 !important;
    margin-top: 20px !important;
}

.modal-content .modal-text {
    height: 93%;
    border-bottom: 1px solid #ffce00;
}

.carousel-indicators {
    bottom: -30px;
}

.carousel-indicators li {
    height: 10px;
    width: 10px;
    background-color: #c6c6b9;
}

.carousel .img-bg {
    background: #c6c6b9;
    width: 100%;
    height: 0;
    padding-top: 32%;
    padding-bottom: 32%;
}

/*SUBCATEGORIAS*/

.subcategoria h2 {
    color: white;
    text-transform: uppercase;
    font-size: 1.6em;
    font-weight: 500;
    border-bottom: none;
    margin-bottom: 0;
}

.subcategoria h2 span {
    font-size: .5em;
}

.subcategoria h3 {
    font-weight: 800;
    color: #ffce00;
    margin-bottom: 20px;
    font-size: 3.8em;
    display: inline-block;
    margin-top: -10px;
}

.subcategoria .regresar {
    color: #ffce00;
    text-transform: uppercase;
    text-align: right;
}

.subcategoria .titulo-row {
    border-bottom: 1px solid white;
    margin-bottom: 20px;
}

.subcategoria .titulo-row a {
    text-align: right;
    display: inline-block;
    color: #ffce00;
    float: right;
    margin-top: 43px;
    margin-bottom: 20px;
}

.galeria {
    background-size: cover !important;
    background-position: center center !important;
    height: 0;
    padding: 11% 0 11%;
    width: 100%;
    border: 10px solid #05369b;
}

.rollos-y-placas-de-hule .imagen1 {
    background: url("../img/servicios/1/1rollos/002.png");
}
.rollos-y-placas-de-hule .imagen2 {
    background: url("../img/servicios/1/1rollos/003.png");
}
.rollos-y-placas-de-hule .imagen3 {
    background: url("../img/servicios/1/1rollos/004.png");
}
.rollos-y-placas-de-hule .imagen4 {
    background: url("../img/servicios/1/1rollos/005.png");
}
.rollos-y-placas-de-hule .imagen5 {
    background: url("../img/servicios/1/1rollos/006.png");
}
.rollos-y-placas-de-hule .imagen6 {
    background: url("../img/servicios/1/1rollos/007.png");
}
.rollos-y-placas-de-hule .imagen7 {
    background: url("../img/servicios/1/1rollos/008.png");
}
.rollos-y-placas-de-hule .imagen8 {
    background: url("../img/servicios/1/1rollos/009.png");
}

.soleras-solidas-y-esponjosas .imagen1 {
    background: url("../img/servicios/1/2soleras/001.png");
}
.soleras-solidas-y-esponjosas .imagen2 {
    background: url("../img/servicios/1/2soleras/002.png");
}
.soleras-solidas-y-esponjosas .imagen3 {
    background: url("../img/servicios/1/2soleras/003.png");
}
.soleras-solidas-y-esponjosas .imagen4 {
    background: url("../img/servicios/1/2soleras/004.png");
}
.soleras-solidas-y-esponjosas .imagen5 {
    background: url("../img/servicios/1/2soleras/005.png");
}
.soleras-solidas-y-esponjosas .imagen6 {
    background: url("../img/servicios/1/2soleras/007.png");
}
.soleras-solidas-y-esponjosas .imagen7 {
    background: url("../img/servicios/1/2soleras/008.png");
}

.placas-de-esponja .imagen1 {
    background: url("../img/servicios/1/3placas/001.png");
}
.placas-de-esponja .imagen2 {
    background: url("../img/servicios/1/3placas/002.png");
}
.placas-de-esponja .imagen3 {
    background: url("../img/servicios/1/3placas/003.png");
}
.placas-de-esponja .imagen4 {
    background: url("../img/servicios/1/3placas/004.png");
}
.placas-de-esponja .imagen5 {
    background: url("../img/servicios/1/3placas/005.png");
}

.esquineros-y-protector-de-pared .imagen1 {
    background: url("../img/servicios/2/1esquineros/001.png");
}
.esquineros-y-protector-de-pared .imagen2 {
    background: url("../img/servicios/2/1esquineros/002.png");
}
.esquineros-y-protector-de-pared .imagen3 {
    background: url("../img/servicios/2/1esquineros/003.png");
}
.esquineros-y-protector-de-pared .imagen4 {
    background: url("../img/servicios/2/1esquineros/004.png");
}
.esquineros-y-protector-de-pared .imagen5 {
    background: url("../img/servicios/2/1esquineros/005.png");
}
.esquineros-y-protector-de-pared .imagen6 {
    background: url("../img/servicios/2/1esquineros/006.png");
}
.esquineros-y-protector-de-pared .imagen7 {
    background: url("../img/servicios/2/1esquineros/007.png");
}
.esquineros-y-protector-de-pared .imagen8 {
    background: url("../img/servicios/2/1esquineros/008.png");
}

.reductores-de-velocidad .imagen1 {
    background: url("../img/servicios/2/2reductores/001.png");
}
.reductores-de-velocidad .imagen2 {
    background: url("../img/servicios/2/2reductores/002.png");
}
.reductores-de-velocidad .imagen3 {
    background: url("../img/servicios/2/2reductores/003.png");
}
.reductores-de-velocidad .imagen4 {
    background: url("../img/servicios/2/2reductores/004.png");
}
.reductores-de-velocidad .imagen5 {
    background: url("../img/servicios/2/2reductores/005.png");
}
.reductores-de-velocidad .imagen6 {
    background: url("../img/servicios/2/2reductores/006.png");
}
.reductores-de-velocidad .imagen7 {
    background: url("../img/servicios/2/2reductores/007.png");
}
.reductores-de-velocidad .imagen8 {
    background: url("../img/servicios/2/2reductores/008.png");
}
.reductores-de-velocidad .imagen9 {
    background: url("../img/servicios/2/2reductores/009.png");
}
.reductores-de-velocidad .imagen10 {
    background: url("../img/servicios/2/2reductores/0010.png");
}

.topes-de-estacionamiento .imagen1 {
    background: url("../img/servicios/2/3topes/001.png");
}
.topes-de-estacionamiento .imagen2 {
    background: url("../img/servicios/2/3topes/002.png");
}
.topes-de-estacionamiento .imagen3 {
    background: url("../img/servicios/2/3topes/003.png");
}
.topes-de-estacionamiento .imagen4 {
    background: url("../img/servicios/2/3topes/004.png");
}
.topes-de-estacionamiento .imagen5 {
    background: url("../img/servicios/2/3topes/005.png");
}
.topes-de-estacionamiento .imagen6 {
    background: url("../img/servicios/2/3topes/006.png");
}
.topes-de-estacionamiento .imagen7 {
    background: url("../img/servicios/2/3topes/007.png");
}
.topes-de-estacionamiento .imagen8 {
    background: url("../img/servicios/2/3topes/008.png");
}
.topes-de-estacionamiento .imagen9 {
    background: url("../img/servicios/2/3topes/009.png");
}
.topes-de-estacionamiento .imagen10 {
    background: url("../img/servicios/2/3topes/0010.png");
}

.medias-canas .imagen1 {
    background: url("../img/servicios/1/1rollos/001.png");
}
.medias-canas .imagen2 {
    background: url("../img/servicios/1/1rollos/002.png");
}
.medias-canas .imagen3 {
    background: url("../img/servicios/1/1rollos/003.png");
}
.medias-canas .imagen4 {
    background: url("../img/servicios/1/1rollos/004.png");
}
.medias-canas .imagen5 {
    background: url("../img/servicios/1/1rollos/005.png");
}
.medias-canas .imagen6 {
    background: url("../img/servicios/1/1rollos/006.png");
}
.medias-canas .imagen7 {
    background: url("../img/servicios/1/1rollos/007.png");
}
.medias-canas .imagen8 {
    background: url("../img/servicios/1/1rollos/008.png");
}
.medias-canas .imagen9 {
    background: url("../img/servicios/1/1rollos/009.png");
}

.barras-soleras-y-placas .imagen1 {
    background: url("../img/servicios/3/02BarrasSolerasPlacas/001.png");
}
.barras-soleras-y-placas .imagen2 {
    background: url("../img/servicios/3/02BarrasSolerasPlacas/002.png");
}
.barras-soleras-y-placas .imagen3 {
    background: url("../img/servicios/3/02BarrasSolerasPlacas/003.png");
}
.barras-soleras-y-placas .imagen4 {
    background: url("../img/servicios/3/02BarrasSolerasPlacas/004.png");
}
.barras-soleras-y-placas .imagen5 {
    background: url("../img/servicios/3/02BarrasSolerasPlacas/005.png");
}

.especialidades-en-poliuretano .imagen1 {
    background: url("../img/servicios/3/03Poliuretano/001.png");
}
.especialidades-en-poliuretano .imagen2 {
    background: url("../img/servicios/3/03Poliuretano/002.png");
}
.especialidades-en-poliuretano .imagen3 {
    background: url("../img/servicios/3/03Poliuretano/003.png");
}
.especialidades-en-poliuretano .imagen4 {
    background: url("../img/servicios/3/03Poliuretano/004.png");
}
.especialidades-en-poliuretano .imagen5 {
    background: url("../img/servicios/3/03Poliuretano/005.png");
}
.especialidades-en-poliuretano .imagen6 {
    background: url("../img/servicios/3/03Poliuretano/006.png");
}
.especialidades-en-poliuretano .imagen7 {
    background: url("../img/servicios/3/03Poliuretano/007.png");
}

.recubrimientos-en-poliuretano .imagen1 {
    background: url("../img/servicios/3/04recubrimientos/001.png");
}
.recubrimientos-en-poliuretano .imagen2 {
    background: url("../img/servicios/3/04recubrimientos/002.png");
}
.recubrimientos-en-poliuretano .imagen3 {
    background: url("../img/servicios/3/04recubrimientos/003.png");
}
.recubrimientos-en-poliuretano .imagen4 {
    background: url("../img/servicios/3/04recubrimientos/004.png");
}
.recubrimientos-en-poliuretano .imagen5 {
    background: url("../img/servicios/3/04recubrimientos/005.png");
}
.recubrimientos-en-poliuretano .imagen6 {
    background: url("../img/servicios/3/04recubrimientos/006.png");
}
.recubrimientos-en-poliuretano .imagen7 {
    background: url("../img/servicios/3/04recubrimientos/007.png");
}
.recubrimientos-en-poliuretano .imagen8 {
    background: url("../img/servicios/3/04recubrimientos/008.png");
}
.recubrimientos-en-poliuretano .imagen9 {
    background: url("../img/servicios/3/04recubrimientos/009.png");
}
.recubrimientos-en-poliuretano .imagen10 {
    background: url("../img/servicios/3/04recubrimientos/010.png");
}
.recubrimientos-en-poliuretano .imagen11 {
    background: url("../img/servicios/3/04recubrimientos/011.png");
}

.apoyos-para-puentes .imagen1 {
    background: url("../img/servicios/4/01apoyos/001.png");
}

.empaques-de-linea .imagen1 {
    background: url("../img/servicios/001.png");
}

.empaques-y-perfiles-de-linea .imagen1 {
    background: url("../img/servicios/4/03perfiles/001.png");
}
.empaques-y-perfiles-de-linea .imagen2 {
    background: url("../img/servicios/4/03perfiles/002.png");
}
.empaques-y-perfiles-de-linea .imagen3 {
    background: url("../img/servicios/4/03perfiles/003.png");
}
.empaques-y-perfiles-de-linea .imagen4 {
    background: url("../img/servicios/4/03perfiles/004.png");
}
.empaques-y-perfiles-de-linea .imagen5 {
    background: url("../img/servicios/4/03perfiles/005.png");
}
.empaques-y-perfiles-de-linea .imagen6 {
    background: url("../img/servicios/4/03perfiles/006.png");
}
.empaques-y-perfiles-de-linea .imagen7 {
    background: url("../img/servicios/4/03perfiles/007.png");
}
.empaques-y-perfiles-de-linea .imagen8 {
    background: url("../img/servicios/4/03perfiles/008.png");
}
.empaques-y-perfiles-de-linea .imagen9 {
    background: url("../img/servicios/4/03perfiles/009.png");
}
.empaques-y-perfiles-de-linea .imagen10 {
    background: url("../img/servicios/4/03perfiles/010.png");
}
.empaques-y-perfiles-de-linea .imagen11 {
    background: url("../img/servicios/4/03perfiles/011.png");
}
.empaques-y-perfiles-de-linea .imagen12 {
    background: url("../img/servicios/4/03perfiles/012.png");
}

.fabricacion-de-piezas-especiales .imagen1 {
    background: url("../img/servicios/4/04piezas/001.png");
}
.fabricacion-de-piezas-especiales .imagen2 {
    background: url("../img/servicios/4/04piezas/002.png");
}
.fabricacion-de-piezas-especiales .imagen3 {
    background: url("../img/servicios/4/04piezas/003.png");
}
.fabricacion-de-piezas-especiales .imagen4 {
    background: url("../img/servicios/4/04piezas/004.png");
}
.fabricacion-de-piezas-especiales .imagen5 {
    background: url("../img/servicios/4/04piezas/005.png");
}
.fabricacion-de-piezas-especiales .imagen6 {
    background: url("../img/servicios/4/04piezas/006.png");
}
.fabricacion-de-piezas-especiales .imagen7 {
    background: url("../img/servicios/4/04piezas/007.png");
}
.fabricacion-de-piezas-especiales .imagen8 {
    background: url("../img/servicios/4/04piezas/008.png");
}

.juntas-de-expansion .imagen1 {
    background: url("../img/servicios/4/05juntas/001.png");
}
.juntas-de-expansion .imagen2 {
    background: url("../img/servicios/4/05juntas/002.png");
}
.juntas-de-expansion .imagen3 {
    background: url("../img/servicios/4/05juntas/003.png");
}
.juntas-de-expansion .imagen4 {
    background: url("../img/servicios/4/05juntas/004.png");
}
.juntas-de-expansion .imagen5 {
    background: url("../img/servicios/4/05juntas/005.png");
}
.juntas-de-expansion .imagen6 {
    background: url("../img/servicios/4/05juntas/006.png");
}

.recubrimientos-en-hule .imagen1 {
    background: url("../img/servicios/4/06recubrimientos/001.png");
}
.recubrimientos-en-hule .imagen2 {
    background: url("../img/servicios/4/06recubrimientos/002.png");
}
.recubrimientos-en-hule .imagen3 {
    background: url("../img/servicios/4/06recubrimientos/003.png");
}
.recubrimientos-en-hule .imagen4 {
    background: url("../img/servicios/4/06recubrimientos/004.png");
}
.recubrimientos-en-hule .imagen5 {
    background: url("../img/servicios/4/06recubrimientos/005.png");
}
.recubrimientos-en-hule .imagen6 {
    background: url("../img/servicios/4/06recubrimientos/006.png");
}

.tapones-y-capuchones .imagen1 {
    background: url("../img/servicios/4/07tapones/001.png");
}
.tapones-y-capuchones .imagen2 {
    background: url("../img/servicios/4/07tapones/002.png");
}
.tapones-y-capuchones .imagen3 {
    background: url("../img/servicios/4/07tapones/003.png");
}
.tapones-y-capuchones .imagen4 {
    background: url("../img/servicios/4/07tapones/004.png");
}
.tapones-y-capuchones .imagen5 {
    background: url("../img/servicios/4/07tapones/005.png");
}


@media screen and (min-width: 576px) {
    .navbar-expand-sm .navbar-nav .dropdown-menu {
        left: -90px;
        border-radius: 0;
    }

    .navbar-expand-sm .navbar-nav .dropdown-menu::before {
        content: '';
        background: white;
        height: 30px;
        width: 30px;
        position: absolute;
        transform: rotate(45deg);
        margin-top: -13px;
        left: 119px;
        border: none;
        z-index: -1;
    }

    .contact-mobile {
        display: none;
    }
}

@media screen and (max-width: 575px) {
    .navbar-dark .navbar-brand img {
        max-width: 220px;
    }
    h1 {
        font-size: 2.5em;
    }
    #servicios2 #tabla td {
        font-size: 6px;
        padding: 6px 2px 14px;
    }

    .tel-correo {
        display: none;
    }
    
    .tel-correo li {
        list-style: none;
        display: inline-block;
    }
    
    .navbar-nav {
        margin-top: 0px !important
    }
    .galeria {
        padding: 21% 0 21%;
    }

    .bg-dark {
        margin-top: 28px !important;
    }
}

.navbar-fixed-top.scrolled {
    background-color: #042686 !important;
    transition: background-color 200ms linear;
  }