/*
    * 
    * CSS V1.0 DeltaDevs
    *

    cobre: #ce8c31
*/


@import url(../css/fuentes.css);
* {
    font-family: Roboto-Regular;
}

:root {
    --laton: rgba(255, 204, 51, 1);
    --cobre: rgba(204, 153, 51, 1);
    --gris:  rgba(145, 146, 148, 1);
}
html{
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: hidden;
}

body {
    font-family: Roboto-Regular;
    font-size:16px;
}

h1 {
    font-size: 3em;
    font-weight: 300;
    margin: 0px;
    /*margin-bottom: 50px;*/
}

h2 {
    font-size: 2em;
    font-weight: 800;
    color: rgb(145, 146, 148);
    padding-bottom: 5px;
    font-family: Roboto-BlackItalic;
}
header {
    position: fixed;
    width: 100%;
    z-index: 10;
    background-color: white;
}

p {
    font-size: 1.1em;
    line-height: 1.5em;
}

/*#menu ul .triangulo_sup {
    position: relative;
    border-bottom: 15px solid #c1104c;
    bottom: 0px;
    right: 20px;
    display: none;
}*/


/* CLASES */
.arrow-down {
    content: ">";
    transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    margin-left: 5px;
}

.arrow-down::after {
    content: ">";
    transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
}

.bg-gris {
    background: rgb(145,146,148,.9);
}

.border-redondos {
    border-radius: 50%;
}

.btn-cobre {
    background-color: #ce8c31;
    color: white;
    cursor: pointer;
}

.text-plata {
    color: var(--cobre);
    font-family: Roboto-Black;
    font-size: 40px;
}

.text-cobre{
    color: var(--gris);
}

#contenidoHome .card:hover{
    opacity: 0.7;
    transition: opacity 200ms;
}

#contenidoHome a:hover{
    text-decoration: none;
    color: black;
}

#contenidoHome .card-body hr {
    border-top: 2px solid var(--laton);
    margin-top: .5rem;
    margin-bottom: .5rem;
}

.carousel-caption {
    left: 0 !important;
    right: 0 !important;
    width: 100%;
}

.container-fluid{
    padding:0 !important;
}

.contenido-contacto, .contenido-empresa {
    padding-left: 15px;
    padding-right: 15px;
}

.custom-file-label::after{
    content: "Buscar";
}

.dropdown-toggle::after { /* Quita la flecha del dropdown */
    content: none !important;
}

.imagen {
    height: 90px;
    width: 100%;
    background-image: url('../imgs/banner1.jpg');
}

.img-border-radius-normal{
    border-radius: 15px;
}

.logo {
    height: 50px;
    width: 150px;
    background-repeat: no-repeat;
    background-position: 0px 0px;
    cursor: pointer;
    float: left;
    padding-top: 1px;
    padding-left: 50px;
}

.logo-iso {
    display: inline-block;
    background-image: url(../imgs/iso-logo.svg);
    background-repeat: no-repeat;
    height: 73px;
    width: 66px;
    position: absolute;
    top: 0;
    right: 50px;
}

.navbar {
    padding: 0 1rem !important;
}

.navbar-expand-lg .navbar-nav .nav-link {
    padding: 0 .5rem !important;
}


.tablasInformacionTecnica {
    padding: 20px;
}

.text-cobre-titulo { /* Se modifica los titulos de Politica integral y ¿Quiénes Somos?*/
    /*color: #ce8c31;*/
    color: rgba(145, 146, 148, 1); 
    font-weight: bold;
}

.text-aluminio, p, a, li, label { /*Se modifician los colores de los p, a li, label*/
    color: #000;
    font-weight: lighter;
}



.text-laton {
    color: rgba(255, 204, 51, 1);
    font-weight:normal;
}

.thead-cobre {
    background-color: #9e7444;
    color: white;
}


/* IDENTIFICADORES */
#contenido{
    padding: 0 100px;
}
#divPoliticas, #divMision, #divVision, #divValores, #divQuienesSomos {
    padding: 20px 100px 15px 100px;
}

#divPoliticas h2, #divMision h2, #divVision h2, #divValores h2, #divQuienesSomos h2 {
    margin-left:30px;
}

    #iconosRedesSociales a img {
        width: 50px;
    }
#iconosRedesSociales a #logoFundacion{
    width: 170px;
}

#Mapa{
    width:95%;
    height: 400px;
}

#menuProducto {
    width: 100%;
    /*max-width: 15%;*/
}

#menuProducto a:hover{
    text-decoration: none;
}

#menuProducto ul li:hover {
    background-color: rgba(255, 204, 51, 1);
}

#menuProducto ul li a:hover {
    text-decoration: none;
    color: rgba(102, 102, 102, 1);
}

#videoPromcional{
    width:100%;
    max-height: 200px;
    height:200px;
}


/* MEDIA QUERIES */
@media (min-width: 768px) {
    header {
        position:fixed;
        width: 100%;
        z-index: 10;
        background-color: white;
        font-size: 0.6em;
    }

    .link-header {
        display: inline-block;
        position: absolute;
        /*top: 22px;*/
        text-transform: uppercase;
        float: right;
        right: 0px;
    }

    /*MENU & SUBMENU*/
    ul {
        margin: 0px;
        padding: 0px;
        list-style: none;
    }

    #menu ul {
        text-align: center;
        position: relative;
        display: inline-block;
    }

    #menu ul li {
        float: left;
        display: inline !important;
        position: relative !important;
        width: 160px;
        font-size: 13px;
        font-weight: 600;
    }

    #menu ul li:hover {
        color: #f7c629;
    }

    #menu ul li a:hover {
        color: #f7c629;
    }

    #menu ul li a {
        display: inline-block;
        color: #8c8c8c;
    }

    #menu ul li > .dropdown-menu {
        width: 150px;
        background: white;
        top: 80% !important;
    }

    #menu ul li > .dropdown-menu a {
        font-size: 12px;
        display: block;
        padding: 15px 10px;
        color: #8c8c8c;
        text-align: left;
    }

    #menu ul li > .dropdown-menu a:hover {
        background: #f7c629;
        color: white;
        font-weight: 800;
    }

    #menu ul li > .dropdown-menu {
        display: none;
    }

    #menu ul li:hover > .dropdown-menu {
        display: block;
    }
}



.card {
    background-color: rgba(0, 0, 0, .2);
    background-clip: border-box;
    border: 1px solid rgba(253, 252, 252, 0.13);
}


.btn-link {
    font-weight: 400;
    color: white;
    background-color: transparent;
    font-size: 18px;
}

    .btn-link:hover {
        color: #fff;
        text-decoration: underline;
        background-color: transparent;
    }

.card-header {
    padding: .2rem 1.25rem;
    margin-bottom: 0;
    background-color: background: rgba(145,146,148,.9);
    border-bottom: 1px solid rgba(255, 255, 255, 0.13);
}

.card-body p {
    color: white;
    color: #000;
    font-size: 21px;
    font-weight: 500;
}
.no-color {
    background-color: #fdfcfc !important;
    background-clip: border-box;
    border: 1px solid rgba(253, 252, 252, 0.13);
}
.mb-0 {
    font-size: 16px;
}
@media only screen and (max-width: 667px) {
    #divPoliticas, #divMision, #divVision, #divValores, #divQuienesSomos {
        padding: 10px 10px 10px 10px !important;
    }
}

.parrafos_ngritas {
    font-weight: 900;
}

parrafo_valores {
    align-content: unset; 
}

.titulos {
    font-size: 40px;
    font-weight: 900;
    color: rgb(255, 255, 255);
    font-family: Roboto-Black;
}

.alineacion {
    text-align: right;
}

.parrafos {
    font-family: Roboto-Regular;
}

/*Politicas*/
.contaminacion {
    font-family: Roboto-Black;
    cursor: pointer;
    margin-top: 10px;
    font-size: 18px;
}

.recursos {
    font-family: Roboto-Black;
    cursor: pointer;
    margin-top: 10px;
    font-size: 18px;
    padding-left: 20px;
}

.requisistos {
    font-family: Roboto-Black;
    cursor: pointer;
    margin-top: 10px;
    font-size: 18px;
    padding-left: 20px;
}

.salud {
    font-family: Roboto-Black;
    cursor: pointer;
    margin-top: 10px;
    font-size: 18px;
    padding-left: 30px;
}

.entorno {
    font-family: Roboto-Black;
    cursor: pointer;
    margin-top: 10px;
    font-size: 18px;
    padding-left: 25px;
}

.acoso {
    font-family: Roboto-Black;
    cursor: pointer;
    margin-top: 10px;
    font-size: 18px;
    padding-left: 31px;
}

.desarrollo {
    font-family: Roboto-Black;
    cursor: pointer;
    margin-top: 10px;
    font-size: 18px;
    padding-left: 15px;
}

.prevencion {
    font-family: Roboto-Black;
    cursor: pointer;
    margin-top: 10px;
    font-size: 18px;
    padding-left: 12px;
}

.plan-mejora {
    font-family: Roboto-Black;
    cursor: pointer;
    margin-top: 10px;
    font-size: 18px;
    padding-left: 0px;
}

.entregas {
    font-family: Roboto-Black;
    cursor: pointer;
    margin-top: 10px;
    font-size: 18px;
    padding-left: 20px;
}
/*-----------------------------------------------------------*/




/*V A L O R E S*/

.amor {
    font-family: Roboto-Black;
    cursor: pointer;
    margin-top: 10px;
    font-size: 18px;
    padding-left: 35px;
}

.compromiso {
    font-family: Roboto-Black;
    cursor: pointer;
    margin-top: 10px;
    font-size: 18px;
    padding-left: 8px;
}

.comunion {
    font-family: Roboto-Black;
    cursor: pointer;
    margin-top: 10px;
    font-size: 18px;
    padding-left: 18px;
}

.empatia {
    font-family: Roboto-Black;
    cursor: pointer;
    margin-top: 10px;
    font-size: 18px;
    padding-left: 22px;
}
.fe {
    font-family: Roboto-Black;
    cursor: pointer;
    margin-top: 10px;
    font-size: 18px;
    padding-left: 48px;
}

.honestidad {
    font-family: Roboto-Black;
    cursor: pointer;
    margin-top: 10px;
    font-size: 18px;
    padding-left: 13px;
}

.humildad {
    font-family: Roboto-Black;
    cursor: pointer;
    margin-top: 10px;
    font-size: 18px;
    padding-left: 16px;
}

.igualdad {
    font-family: Roboto-Black;
    cursor: pointer;
    margin-top: 10px;
    font-size: 18px;
    padding-left: 20px;
}

.integridad {
    font-family: Roboto-Black;
    cursor: pointer;
    margin-top: 10px;
    font-size: 18px;
    padding-left: 15px;
}

.liderazgo {
    font-family: Roboto-Black;
    cursor: pointer;
    margin-top: 10px;
    font-size: 18px;
    padding-left: 15px;
}

.respeto {
    font-family: Roboto-Black;
    cursor: pointer;
    margin-top: 10px;
    font-size: 18px;
    padding-left: 25px;
}

.servicio {
    font-family: Roboto-Black;
    cursor: pointer;
    margin-top: 10px;
    font-size: 18px;
    padding-left: 25px;
}
/*-----------------------------------------------------------------------*/



.barra-final {
    background: rgba(84, 84, 84, .8);
    font-family: Roboto-Regular;
    font-size: 14px;
    color: #fff;
    padding-left: 100px;
    padding-right: 100px;
    padding-top: 90px;
    padding-bottom: 90px;
}

.barra-titulos {
    color: rgb(178, 178, 178);
    font-family: Roboto-Bold;
    font-size: 16px;
}

.labels {
    font-family: Roboto-Condensed;
    font-size: 26px;
    color: #fff;
}

.derechos {
    padding-top: 15px;
    background: #fff;
}

.parrafo {
    font-family: Roboto-Italic;
    color: rgb(84, 84, 84);
}

.preciof {
    font-family: Roboto-BoldCondensed;
    font-size: 50px;
    color: #fff;
}

.medida-precio {
    font-family: Roboto-BoldCondensed;
    font-size: 20px;
    color: #fff;
}

.links {
    font-family: Roboto-Regular;
    font-size: 14px;
    color: #fff;
}
    .links:hover {
        color: rgb(204, 153, 51);
        text-decoration: underline;
        background-color: transparent;
    }

.redes {
    font-family: Roboto-Regular;
    font-size: 20px;
    color: #fff;
}

    .redes:hover {
        color: rgb(204, 153, 51);
        background-color: transparent;
    }


.v {
    border-radius: 15%;
    padding-top: 9px;
    padding-left: 43px;
    background-color: transparent;
    transition: .7s;
}

    .v:hover {
        transform: scale(1.2);
        box-shadow: 6px 6px 10px rgba(0, 0, 0, .568);
        border-radius: 15%;
        background-color: rgba(255, 204, 51, .7);
    }


.p {
    border-radius: 15%;
    padding-top: 9px;
    padding-left: 43px;
    background-color: transparent;
    transition: .7s;
}

    .p:hover {
        transform: scale(1.2);
        box-shadow: 6px 6px 10px rgba(0, 0, 0, .568);
        border-radius: 15%;
        background-color: rgba(255, 204, 51, .7);
    }

.listas {
    font-family: Roboto-Regular;
    font-size: 1.1em;
    line-height: 1.5em;
}

pre {
    font-family: Roboto-Regular;
    font-size: 1.1em;
    line-height: 1.5em;
}

.vertical {
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
}

td {
    font-size: 1.1em;
}

.muestra-producto {
    margin-top: 2em;
    width: 100%;
}