body, html {
    height: 100%;
}

body {
   /* font-family: 'Montserrat', sans-serif;*/
    font-family: 'Poppins', sans-serif;
}

.finline{display: inline-flex;}

.icon4{
    width: 170px;
     margin-right: -30px;
    filter: invert(44%) sepia(65%) saturate(586%) hue-rotate(140deg) brightness(104%) contrast(87%);
}   
 

.mp0 {margin: 0px;}
.p0{padding: 0px !important;}
.m0{margin: 0px !important;}
.full {height: 100%;}

.pb0{padding-bottom: 0px !important;}
.pt0{padding-top: 0px !important;}

.wi90{width: 90%; margin-left: 5%;}
.wi80{width: 80%; margin-left: 10%;}

.mt20 {margin-top: 40px;}

h1 {
    font-size: 3em;
    font-weight: 300;
    color: #fff;
}

h2 {
    font-size: 2.5em;
    color: #17a2b8;
    font-weight: 500;
  /*  letter-spacing: 4px;*/
}

h3 {
    font-size: 2.5em;
    color: #000;
    font-weight: 600;
}

h4 {
    font-size: 1em;
    color: #333;
    margin-bottom: 10px;
    margin-top: 20px;

}

h5 {
    font-size: 1em;
    color: #17a2b8;
    font-weight: 700
}

p {
    font-size: .9em;
    color: #333;
   /* font-weight: 500;*/
    padding-right: 10px;
}
p b{
    font-size: 1.3em;
    margin-bottom: 10px;
    font-weight: 900;
}

ul li {
    font-size: .9em;
    color: #5d5d5d;
    font-weight: 500;
}

.ptitle {
    color: rgba(255, 255, 255, .8);
    font-size: 1.45em;
    margin-top: 5px;
}

.titban {
    font-size: 1.9em;
    color: #fff;
    font-weight: 400;
    margin: 0px;
}

.titban2 {
    font-size: 3em;
    font-weight: 300;
    color: #fff;
    font-weight: 700;
    margin: 0px;
}

.titban2 small {
    font-size: .7em;
    font-weight: 300;
    color: #fff;
    font-weight: 700;
}

.mbmen {
    margin-bottom: -10px;
}

.t3 {font-weight: 300;}
.t4 {font-weight: 400;}
.t5 {font-weight: 500;}
.t6 {font-weight: 600;}
.t7 {font-weight: 700;}

.backgray{background: #333;}
.twhite{color:#fff}

.backcover{
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.backauto{
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: auto;
}

.backinhe{
   background-attachment: inherit;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.backsec {
    background-position: bottom;
  /*  background-attachment: fixed;
    background-size: cover;*/
}

.backsec2{
    background-size: auto;
    background-position: center;
    background-repeat: no-repeat;
}

.backblack {
    background: rgba(0,0,0,0.5);
}

.backuno{
  background-image: url(../img/002.jpg);
    background-size: 110% auto;
    background-repeat: no-repeat;
    background-position: left;
    background-color: #f2f2f2;
}

.back7{
    background-attachment: inherit;
    background-position: bottom;
    background-repeat: no-repeat;
    background-size: auto;
}


.back1{
    background-attachment: inherit;
    background-position: center;
    background-repeat: no-repeat;
    background-size: auto;
}

.back6{
    background-attachment: inherit;
    background-position: top;
    background-repeat: no-repeat;
    background-size: auto;
}

.h20 {margin-top: 20%;}


.backblack h1{ width: 70%; margin: auto; padding-top: 40px; padding-bottom: 40px;}
/**/

.btnborder {
    border-radius: 1rem !important;
    padding: 4px 20px;
    font-size: .9em;
    font-weight: 600;
    color: #fff;
}

.inline {
    display: inline-flex;
}

.formnav {
    width: 100% !important;
}

.imgpro {
    height: 200px;
    margin-bottom: 20px;
}

.twhite {
    color: #fff;
}

.img2 {
    margin-right: 10px;
    height: 60px;
    margin-top: -10px;
}

.parallax {
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.nav {
    background: #fff;
    padding: 10px;
    color: #888888;
    font-size: .8em;
    padding: 10px 10px;
}
/*
.nav a:hover {
    color: dodgerblue !important;
}*/
.p1{
    background: #f1f1f1;
    padding-top: 40px;
    padding-bottom: 40px;
}

.sec01{
    background-image: url('../img/sec_01.png');
    height: 450px;
    margin-top: 80px;
}

.p4{
    background-image: none;
    height: auto;
    margin-top: 0px;
    padding-top: 40px;
    padding-bottom: 40px;
}


.p6{
    background-image: url('../img/sec_02.jpg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100% auto;
    background-color: #f2f2f2;
    height: 450px;
    margin-top: 60px;
    
}

.p7{
    display: none;
}


.p8{
    background-image: url('../img/sec_04.jpg');
    height: 400px;
    margin-top: 80px;
}

.blackhover {
    background-color: rgba(0,0,0,0.5);
    position: absolute;
    height: 200px;
    width: 100%;
    margin-top: -39px;
}

.f1 {
    background-image: url('../img/001.jpg');
    height: 75%;
    padding-bottom: 100px;
}

.f2 {
    background: #fff;
    padding: 60px 0px;
    height: auto;
}

.f3 {
    background: #fff;
    padding: 100px 0px;
    height: auto;
}

.f4 {
    background: #fff;
    padding: 100px 0px;
    height: auto;
}

.f5 {
    background-image: none;
    height: auto;
    padding: 50px 0px;
}

.footercopy {
    background: #333;
    padding: 30px 10px 50px 10px;
    color: #a2a2a2;
    font-size: .8em;
}

.footercopy a {
    color: #a2a2a2;
    margin-right: 10px;
}
.footercopy p, .footercopy a {
    font-size: .95em;
    color: #a2a2a2;
}

.footercopy2 {
    background: #222;
    padding: 20px;
    color: #a2a2a2;
    font-size: .8em;
    text-align: center;
}

a:hover {
    text-decoration: none;
    color: steelblue;
}
/*
.ahref a {
    color: #888888;
}

.ahref a:hover {
    color: #b8b8b8;
}*/

.ic1, .ic2, .ic3 {
    cursor: pointer;
}

.ic1 {
    width: 50px;
    height: 50px;
    background-image: none;
    background-size: cover;
}

.ic1:hover {
    background-image: none;
}

.ic2 {
    width: 50px;
    height: 50px;
    background-image: none;
    background-size: cover;
}

.ic2:hover {
    background-image: none;
}

.ic3 {
    width: 50px;
    height: 50px;
    background-image: none;
    background-size: cover;
}

.ic3:hover {
    background-image: none;
}

.line {
    height: 5px;
    width: 55px;
    border: 0px;
    margin-top: 0px;
    margin-bottom: 0px;
}

.cardpro {
    background: #fff;
}

.btn-orange {
    margin-top: 10px;
    color: #fff;
    background-color: #db7825;
    border-color: #db7825;
}

.btn-orange:hover {
    color: #fff;
    background-color: #04287e;
    border-color: #04287e;
}

.btn-orange.focus, .btn-orange:focus {
    box-shadow: 0 0 0 .2rem rgba(255, 193, 7, .5)
}

.btn-orange.disabled, .btn-orange:disabled {
    color: #fff;
    background-color: #db7825;
    border-color: #db7825;
}

.btn-orange:not(:disabled):not(.disabled).active, .btn-orange:not(:disabled):not(.disabled):active, .show>.btn-orange.dropdown-toggle {
    color: #fff;
    background-color: #db7825;
    border-color: #c69500
}

.btn-orange:not(:disabled):not(.disabled).active:focus, .btn-orange:not(:disabled):not(.disabled):active:focus, .show>.btn-orange.dropdown-toggle:focus {
    box-shadow: 0 0 0 .2rem rgba(255, 193, 7, .5)
}

.btn-black-md{
    font-size: 1em !important;
}

.btn-black {
    margin-top: 0px;
    color: #fff;
    background-color: #000;
    border-color: #000;
    border-radius: 20px;
    padding-left: 20px;
    padding-right: 20px;
    font-size: .9em;
}

.btn-black:hover {
    color: #fff;
    background-color: #17a2b8;
    border-color: #17a2b8;
}

.btn-black.focus, .btn-black:focus {
    box-shadow: 0 0 0 .2rem rgba(0, 0, 255, .2)
}

.btn-black.disabled, .btn-black:disabled {
    color: #fff;
    background-color: #000;
    border-color: #db7825;
}

.btn-black:not(:disabled):not(.disabled).active, .btn-black:not(:disabled):not(.disabled):active, .show>.btn-black.dropdown-toggle {
    color: #fff;
    background-color: #17a2b8;
    border-color: #17a2b8
}

.btn-black:not(:disabled):not(.disabled).active:focus, .btn-black:not(:disabled):not(.disabled):active:focus, .show>.btn-black.dropdown-toggle:focus {
    box-shadow: 0 0 0 .2rem rgba(0, 0, 255, .2)
}

.inputtxt, .inputtxt2 {
    background: #fff;
    border: 1px solid #000;
    font-size: 0.9em;
    padding: 10px;
    width: 100%;
    color: #000;
    font-weight: 500;
    margin-bottom: 10px;
    transition: ease .2s;
}
.inputtxt::placeholder, .inputtxt2::placeholder {
    color:#000;
}

.inputtxt:hover, .inputtxt2:hover {
    border: 2px solid#17a2b8;
    padding-left: 20px;
}

.inputtxt:hover::placeholder, .inputtxt2:hover::placeholder{
    color:#17a2b8;
}

.lion {
    border-left: 4px solid #d37d2e;
    padding-left: 10px;
}

.linenos {
    border-bottom: 2px solid steelblue;
    margin-left: 0px;
    width: 52%;
    margin-top: 50px;
    position: absolute;
    right: 0px;
}

.linpq {
    border-bottom: 4px solid #17a2b8;
    margin-left: -14%;
    width: 35%;
    margin-top: -30px;
    margin-bottom: 50px;
}

.linprod {
    border-bottom: 4px solid #04287e;
    width: 30%;
    margin-top: -30px;
    margin-bottom: 50px;
    margin-left: 80%;
}

.lincont {
    border-bottom: 4px solid #04287e;
    margin-left: -26%;
    width: 55%;
    margin-top: -30px;
    margin-bottom: 50px;
}

.txtcontact {
    vertical-align: bottom;
}

.txttop {
    vertical-align: top;
}

.btntop {
    width: 45px;
    height: 45px;
    background: none;
    background-size: cover;
    position: absolute;
    bottom: 70px;
    right: 70px;
    cursor: pointer;
}

.btntop:hover {
    width: 45px;
    height: 45px;
    background: none;
    background-size: cover;
    position: absolute;
    bottom: 70px;
    right: 70px;
}

/*navbar*/

.navbar {
    background: #fff;
    position: absolute;
    width: 100%;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    z-index: 9999;
    -webkit-transition: padding 2s ease;
    -moz-transition: padding 2s ease;
    -o-transition: padding 2s ease;
    transition: .3s all cubic-bezier(0.785, 0.135, 0.15, 0.86);
}

.nav-item a {
    color: #333 !important;
    font-size: 1.15em;
    font-weight: 600;
}

.affix a {
    font-size: 1em !important;
}

.nav-item.active {
    border-bottom: 2px solid #000;
}

.nav-item.active:hover {
    color: #d37d2e !important;
}

.nav-item a:hover {
    color: #17a2b8 !important;
}

.nav-item {
    margin-right: 20px;
    margin-left: 10px;
}

.affix {
    padding-top: 0.2em !important;
    padding-bottom: 0.2em !important;
    -webkit-transition: padding 0.2s linear;
    -moz-transition: padding 0.2s linear;
    -o-transition: padding 0.2s linear;
    background: #fff !important;
    position: fixed;
    z-index: 9999;
    width: 100%;
    top: 0px;
    border: 0px;
    transition: 0.3s all cubic-bezier(0.785, 0.135, 0.15, 0.86);
    box-shadow: 2px 2px 10px 2px rgb(0, 0, 0, 0.1);
}

.imgheader {
    height: 60px;
    width: auto;
}

.menop{color:#333}

.menop:hover{      
    filter: invert(44%) sepia(65%) saturate(586%) hue-rotate(140deg) brightness(104%) contrast(87%);
}



.icoheader {
    width: 70px;
    margin-right: -20px;
}

.icocontacto{
    width: 70px; 
    filter: invert(44%) sepia(65%) saturate(586%) hue-rotate(140deg) brightness(104%) contrast(87%);
}
/*
.icoheader:hover {
    filter: invert(31%) sepia(78%) saturate(3849%) hue-rotate(202deg) brightness(106%) contrast(102%)
}*/

.icoidiom{
    width: 130PX;
    MARGIN-LEFT: -50px;
    margin-right: -50px;
    margin-top: -10px;
    cursor: pointer;
}

/*.icoidiom:hover{
    opacity: .5;
}*/

#contproducto {
    background: #fff;
    height: auto;
}

.fichaclose {
    position: absolute;
    right: -20px;
    top: -30px;
    color: #5d5d5d;
    cursor: pointer;
}

.fichaclose:hover {
    color: #04287e;
}

/*.imgprod{
    width: 250px;
}*/

.imgprodat {
    padding-top: 50px;
}

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

.carousel-indicators li {
    position: relative;
    -webkit-box-flex: 0;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    width: 15px;
    height: 15px;
    margin-right: 3px;
    margin-left: 3px;
    text-indent: -999px;
    background-color: rgba(0, 0, 0, .2);
    border-radius: 15px;
    cursor: pointer;
}

.carousel-indicators .active {
    background-color: rgba(0, 0, 0, .5);
}

.tablecontacto td{
 height: 60px;
}

.margen{height: 100px;}

@supports (background-image: image-set(url("../img/optimized/001.webp") type("image/webp"))) {
    .backuno {
        background-image: image-set(url("../img/optimized/002.webp") type("image/webp"), url("../img/002.jpg") type("image/jpeg"));
    }

    .sec01 {
        background-image: image-set(url("../img/optimized/sec_01.webp") type("image/webp"), url("../img/sec_01.png") type("image/png"));
    }

    .p6 {
        background-image: image-set(url("../img/optimized/sec_02.webp") type("image/webp"), url("../img/sec_02.jpg") type("image/jpeg"));
    }

    .p8 {
        background-image: image-set(url("../img/optimized/sec_04.webp") type("image/webp"), url("../img/sec_04.jpg") type("image/jpeg"));
    }

    .f1 {
        background-image: image-set(url("../img/optimized/001.webp") type("image/webp"), url("../img/001.jpg") type("image/jpeg"));
    }
}



    
@media (max-width: 830px) {
    .sec01{
        background-image: url('../img/sec_01_800.jpg');
    }

    @supports (background-image: image-set(url("../img/optimized/sec_01_800.webp") type("image/webp"))) {
        .sec01{
            background-image: image-set(url("../img/optimized/sec_01_800.webp") type("image/webp"), url("../img/sec_01_800.jpg") type("image/jpeg"));
        }
    }
}

@media (max-width: 500px) {
    .linpq, .linprod, .lincont, .linenos {display: none;}
    h1{font-size: 3em;}
    .h20 {margin-top: 200px;}
    .ahref {text-align: left !important;}    
    .margen{height: 0px;}
}
@media (min-width: 1200px){
.container {
    max-width: 1200px;
}