/*nav*/

#nav-mercury{font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif; 

  font-size: 0.75em;

  text-decoration: none;

  color: #fff;

  background-color: #393b3e;
  z-index: 1;

}

#mercury .navbar{ padding: 0; }

#nav-mercury a{ color: white; text-transform: uppercase; }

#nav-mercury { 

  background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/nav-bg.png');

  background-repeat: repeat-x;

  background-size: 42px 70px;

}

.brand{ position: relative; left: 0px; height: 64px; }

#nav-mercury a.nav-link{ color: white; font-weight: lighter; }

#nav-mercury a:hover.nav-link{ color: #949494; }

@media (min-width: 992px) {

  #nav-mercury ul li{ border-left: 1px solid rgb(87, 87, 89); padding: 0.5em; }

}

#nav-mercury .dropdown-menu{ background-color: black; }

#nav-mercury .dropdown-item{ font-size: 0.75em;  }

#nav-mercury .dropdown-item:active, #nav-mercury .dropdown-item:focus, #nav-mercury .dropdown-item:hover {background-color: #c00; color: white;}

#nav-mercury .navbar-toggler{ margin-right: 0.5em; }

/*headings*/

h1{margin-bottom: 0;}

@media (max-width: 575.98px) { 

  #nav-mercury .navbar-collapse { text-align: left; padding: 1em; }

  h1{ font-family: 'Roboto Slab', serif; font-size: 2em; }

  h1.red-tit{ font-family: 'Roboto Slab', serif; font-size: 2em; color: #c00; font-weight: bolder;} 

}

@media (min-width: 576px) and (max-width: 991px) {

  #nav-mercury .navbar-collapse { text-align: left; padding: 1em; border: 0; }

}

@media (min-width: 576px) and (max-width: 767.98px) {  

  h1{ font-family: 'Roboto Slab', serif; font-size: 2em; }

  h1.red-tit{font-family: 'Roboto Slab', serif; font-size: 2em; color: #c00; font-weight: bolder;}

}

@media (min-width: 768px) {

  h1{ font-family: 'Roboto Slab', serif; font-size: 3em;}

  h1.red-tit{font-family: 'Roboto Slab', serif; font-size: 3em; color: #c00; font-weight: bolder;}

  .nav-p-t{ padding-top: 1.5em; }

  .txt-c{ text-align: center; }

}



h2{font-family: 'Roboto Slab', serif; font-size: 0.8em; font-weight: bolder;}

h3{font-family: 'Roboto Slab', serif; font-size: 1.5em; font-weight: bolder;}

h4{font-family: 'Roboto Slab', serif; font-size: 1em; font-weight: bolder;}

h5{font-family: 'Roboto Slab', serif; font-size: 2em; color: #c00; font-weight: bolder;}

h5:hover{color:#039782;}



.card-body h2{font-family: 'Roboto Slab', serif; font-size: 1.5em; color: #c00; font-weight: bolder;}

h4.tit-green  {font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif; text-transform: uppercase; color: rgb(3, 151, 130); font-weight: lighter; font-size: 1.5em;}



a { color: #c00; text-decoration: none;}

a:hover{ text-decoration: underline; color: #c00; }


/*backgorunds*/
.bg{background-color: #f0efef;}

.box-blue{    
  background-color: #033249;
    color: #fff;
    margin: .5rem 0;
    padding: 4rem 3rem;
    text-align: center;}

.box-blue-2{    
  background-color: rgba(3,50,73,.9);
    color: #fff;
    margin: .5rem 0;
    padding: 4rem 3rem;
    text-align: center;}
.box-blue p, .box-blue-2 p {
    font-size: 14px;
}
.box-blue .tit, .box-blue-2 .tit {
  font-size: 22px;
  font-family: 'Roboto Slab', serif;
}
.bg-light-grey{ background-color: #e6e7e9;  }
.bg-light-grey p{color:#033249; font-size: 0.9em; }
.breadcrumb, .breadcrumb-item{ background-color: white!important; font-size: 0.9em;}

h4.tit-blue{
  color: #033249;
  font-family: 'Roboto Slab', serif;
  font-size: 2em;
}


.nav-link {color: black;}
.nav-link:hover {color: #c00;}

/*headers**/

.header-blue{

    clear: both;

    margin: 0;

    border: 0;

    padding: 38px 10px 8px;

    text-align: center;

    background-image: radial-gradient(ellipse at center,#fff 60%,#039782 100%);

    background-position: 50% 30%;

    background-size: 100% 275%;

}

@media (max-width: 575.98px) { 

  .motor {

    width:100%;

    height:100%;

    min-height: 320px;

    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/motores-19/header-sm.jpg');

    background-size:cover;

    background-position: center; 

  }

  .helices {

    width:100%;

    height:100%;

    min-height: 320px;

    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/helices/header-sm.jpg');

    background-size:cover;

    background-position: center; 

  }

  .aceites {

    width:100%;

    height:100%;

    min-height: 320px;

    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/aceites-19/header-sm.jpg');

    background-size:cover;

    background-position: center; 

  }

  .indicadores {

    width:100%;

    height:100%;

    min-height: 320px;

    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/relojes/header-sm.jpg');

    background-size:cover;

    background-position: center; 

  }

  .controles {

    width:100%;

    height: 196px;

    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/controles/header-sm.jpg');

    background-size:cover;

    background-position: center; 

  }

  .head-all {

    width:100%;

    height: 400px;

    background-size:cover;

    background-position: center; 

  }

  .direcciones {

    width:100%;

    min-height: 196px;

    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/direccion/h-direccion-sm.jpg');

    background-size:cover;

    background-position: center; 

  }

  .head-4t {

    width:100%;

    height: 400px;

    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/motores-19/1/header-top-sm.jpg');

    background-size:cover;

    background-position: center; 

  }

  .bottom-4t {

    width:100%;

    height: 196px;

    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/motores-19/1/header-bottom-sm.jpg');

    background-size:cover;

    background-position: center; 

  }

}

@media (min-width: 576px) and (max-width: 767.98px) {

  .motor {

    width:100%;

    height:100%;

    min-height: 300px;

    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/motores-19/header-sm.jpg');

    background-size:cover;

    background-position: center; 

  }

  .helices {

    width:100%;

    height:100%;

    min-height: 320px;

    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/helices/header-sm.jpg');

    background-size:cover;

    background-position: center; 

  }

  .aceites {

    width:100%;

    height:100%;

    min-height: 320px;

    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/aceites-19/header-sm.jpg');

    background-size:cover;

    background-position: center; 

  }

    .indicadores {

    width:100%;

    height:100%;

    min-height: 320px;

    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/relojes/header-sm.jpg');

    background-size:cover;

    background-position: center; 

  }

  .controles {

    width:100%;

    min-height: 196px;

    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/controles/header-sm.jpg');

    background-size:cover;

    background-position: center; 

  }

  .head-all {

    width:100%;

    height: 400px;

    background-size:cover;

    background-position: center; 

  }

  .direcciones {

    width:100%;

    min-height: 196px;

    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/direccion/h-direccion-sm.jpg');

    background-size:cover;

    background-position: center; 

  }

  .head-4t {

    width:100%;

    height: 400px;

    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/motores-19/1/header-top-sm.jpg');

    background-size:cover;

    background-position: center; 

  }

  .bottom-4t {

    width:100%;

    height: 196px;

    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/motores-19/1/header-bottom-sm.jpg');

    background-size:cover;

    background-position: center; 

  }

}

@media (min-width: 768px) {

  .motor {

    width:100%;

    height:100%;

    min-height: 300px;

    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/motores-19/header.jpg');

    background-size:cover;

    background-position: right center; 

  }

  .helices {

    width:100%;

    height:100%;

    min-height: 320px;

    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/helices/header.jpg');

    background-size:cover;

    background-position: center; 

  }

  .aceites {

    width:100%;

    height:100%;

    min-height: 320px;

    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/aceites-19/header.jpg');

    background-size:cover;

    background-position: center; 

  }

  .indicadores {

    width:100%;

    height:100%;

    min-height: 320px;

    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/relojes/header.jpg');

    background-size:cover;

    background-position: center; 

  }

  .controles {

    width:100%;

    height:100%;

    min-height: 320px;

    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/controles/header.jpg');

    background-size:cover;

    background-position: center; 

  }

  .head-all {

  width:100%;

  height:100%;

  min-height: 450px;

  background-size:cover;

  background-position: center; 

  }

  .direcciones {

    width:100%;

    min-height: 196px;

    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/direccion/h-direccion-lg.jpg');

    background-size:cover;

    background-position: center; 

  }

  .head-4t {

    width:100%;

    height: 400px;

    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/motores-19/1/header-top.jpg');

    background-size:cover;

    background-position: center; 

  }

  .bottom-4t {

    width:100%;

    height: 400px;

    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/motores-19/1/header-bottom.jpg');

    background-size:cover;

    background-position: center; 

  }

}



 .up{ position: relative; top: -60px;}

/*skews bg*/

@media (max-width: 575.98px) {

    .bg-skew{background:rgba(255,255,255,0.6); position: relative; top: -100px; padding: 0;}

}

@media (min-width: 576px) and (max-width: 767.98px) {

    .bg-skew{background:rgba(255,255,255,0.6); position: relative; top: -100px; padding: 0;}

}

@media (min-width: 768px) {

    .bg-skew{

    font-size: 20px;  

    position:relative;

    overflow:hidden; 

    padding: 2%; 

    width: 85%; 

    left: -15px;

    top: -100px;

    z-index: 1;

    }

    .bg-skew:before{      

    content:'';

    position:absolute;

    top:0; right:0;

    width:110%; height:100%;

    background:rgba(255,255,255,0.6);

    transform-origin:100% 0;

    transform:skewX(-10deg);

    z-index:-1;

    }

}

.bg-skew-red {

    position: relative;

    width: 10em;

    padding: 10px 20px 10px 20px;

    position: relative;

    color: white;

    background-color: #c00;

    left: -15px;

    z-index: 10;

}

.bg-skew-red:after {

    content: " ";

    position: absolute;

    display: block;

    width: 100%;

    height: 100%;

    top: 0;

    left: 0;

    z-index: -1;

    background-color: #c00;

    transform-origin: bottom left;

    -ms-transform: skew(-30deg, 0deg);

    -webkit-transform: skew(-30deg, 0deg);

    transform: skew(-30deg, 0deg);

}

.box-bg-grey{

  background-image: url(https://www.navalmotor.com/mediaserver/web/mercury/bg-grey.png);

  background-size: 104px 182px;

  margin-bottom: 1em;

}



.dealers-header {
    width: 100%;
    height: 100%;
    min-height: 500px;
    background-image: url(https://www.navalmotor.com/mediaserver/web/mercury/header-dealers.jpg);
    background-size: cover;
    background-position: center top;
}

.t-1{ margin-top:-70px; }



/*text*/

.txt-sm{ font-size: 0.8em; }

.tit-bold{font-family: 'Roboto Slab', serif; font-size: 1.15em; text-transform: uppercase; font-weight: bolder; color: black;}

.folleto{color: black;}

.folleto .tit{font-family: 'Roboto Slab', serif; font-size: 1.15em; text-transform: uppercase; font-weight: bolder; border-bottom: 1px solid rgb(160, 160, 160); color: black;}

.folleto .link{font-family: 'Roboto Slab', serif; font-size: 0.85em; color: #c00; font-weight: 700;}

.folleto p{font-size: 0.75em;}

.header-blue h1{ font-size: 4em; font-weight: bolder; color: black; }

@media (max-width: 575.98px) { .header-blue h1{ font-size: 2em; font-weight: bolder; color: black; } }

@media (min-width: 576px) and (max-width: 767.98px) { .header-blue h1{ font-size: 2em; font-weight: bolder; color: black; } }

.red{color:#c00; }



.page-tagline {text-transform: uppercase;color: rgb(19, 96, 112); font-weight: bolder;}



.card-img{ width:60%; border-bottom: 1px solid grey; margin-top: 1em; }

.card-img-2{ height: 200px; width:auto; margin-top: 1em;  }

.card-img-3{ width:55%; margin-top: 1em; vertical-align: middle; min-height: 159px;  }

.card-img-4{ height: 100px; width:auto; margin-top: 1em;  }

.hand{ cursor: pointer; }



.select-border, .select-border:focus, .select-border:visited{ border: 1px solid #c00; border-radius: 0;}

.form-control, .form-control select{ font-family: 'Roboto Slab', serif; font-weight: 700; color:#c00; font-size: 1em; }

.form-control, .form-control select option{ font-family: 'Roboto Slab', serif!important; color: red; font-size: 1em; }

/*partes*/

.partes-acc{border-bottom: 1px solid #039782; padding-bottom: 40px;}

.partes-acc h2{ font-family: 'Roboto Slab', serif; font-size: 2em; font-weight: bolder;  color: black; }

.partes-acc p{ font-size: 0.95em; font-weight: bolder; }

.partes-acc .btn { background-color: #c00; border:0; color: #fff; transition: all .1s linear; padding: 0.75em; font-weight: bold; border-radius: 0; }

.partes-acc .btn:hover{background-color: #039782;}



.btn-red{ background-color:#c00; color: white; border-radius: 0; margin-top: 1em;}

.btn-red:hover { background-color:#03594d; color: white;}

@media (max-width: 575.98px) { 

    .partes-acc img { width: 50%;}

    .partes-acc h2{ text-align: center; }

    .partes-acc p{ text-align: justify; } 

    .sm-img{ width: 30%; margin-left:35%;}

}

@media (min-width: 576px) and (max-width: 767.98px) {

    img.partes-acc { width: 70%; }

    h2{ text-align: center; }

    .partes-acc p{ text-align: justify; } 

    .sm-img{ width: 30%; margin-left:35%; }

}

.anchor-link{ 

    position: relative; 

    display: inline-block; 

    margin: 0 15px 10px; 

    border-bottom: 2px solid #039782; 

    padding: 4px 0 2px; 

    color: #039782; 

    font-weight: bolder;

    font-size: 0.9em;

}

.anchor-link:after {

    content: '';

    position: absolute;

    left: 50%;

    bottom: -12px;

    margin-left: -5px;

    border: 5px solid transparent;

    border-top: 5px solid #039782;

}

.anchor-link:hover{ 

    background-color: #039782;

    color: white;

}

/*scroll*/

#toggleActive {

    padding: 10px;

    width: 100%;

    text-align: center;

    display: inline-block;

    background-color: #444;

    color: #eee;

    font-size: 14px;

    cursor: pointer;

    -webkit-transition: all 200ms ease-out;

    -moz-transition: all 200ms ease-out;

    -o-transition: all 200ms ease-out;

    transition: all 200ms ease-out;

    -webkit-border-radius: 6px;

    -moz-border-radius: 6px;

    border-radius: 6px;

}

#toggleActive.active {

    background-color: #F66169;

    color: #FAEFDE;

}

#scrollUp-active {

    display: none;

}

#scrollUp {

    background-image: url("https://www.navalmotor.com/mediaserver/web/mercury/brand.svg')");

    bottom: 20px;

    right: 20px;

    width: 38px;    /* Width of image */

    height: 38px;   /* Height of image */

}



/*smooth*/

html {

  scroll-behavior: smooth;

}



/*bordes*/

.border-green{ border-top: solid 1px #039782;}

.card{border: 0;}



/*size font*/

.f-1{font-size: 1.2em;}

.f-2{font-size: 1.5em;}



/*modal*/

.modal-content{ background-color: transparent; border: none; }

.close{ color: white; }



/*concesionarios*/

@media (max-width: 575.98px) { 

  h1.tit1{ font-family: 'Roboto Slab', serif; font-size: 1.5em; padding-top: 1em; }

  }

@media (min-width: 576px) and (max-width: 767.98px) { 

  h1.tit1{ font-family: 'Roboto Slab', serif; font-size: 1.5em; padding-top: 1em; }

  }

  @media (min-width: 768px) { 

h1.tit1{ font-family: 'Roboto Slab', serif; font-size: 2.5em; padding:1em; }

}

.stores h2{ font-size: 1em; color: #c00; font-weight: bolder; margin-bottom: 0.25em; }

.stores h3{ font-size: 0.75em; color:#4d4e53; }



@media (min-width: 768px) and (max-width: 991.98px) {

  .mx-h{max-height: 60vh;}

}

@media (min-width: 992px) {

  .pt-percent{ padding-top: 10%; }

  .mt-negative{ margin-top: -215px; }

  .mx-h{max-height: 50vh;}

}



/*manuales*/

.image {

  display: block;

  width: 100%;

  height: auto;

}

  .overlay {

  position: absolute;

  bottom: 0;

  left: 0;

  right: 0;

  height: 90%;

  width: 99%;

  opacity: 0;

  transition: .5s ease;

  background-color: #c00;

}

@media (max-width: 575.98px) { 

  .overlay {

  position: absolute;

  bottom: 0;

  left: 0;

  right: 0;

  height: 95%;

  width: 100%;

  opacity: 0;

  transition: .5s ease;

  background-color: #c00;

}

}

.card:hover .overlay {opacity: 1;}

.text {

  color: white;

  position: absolute;

  top: 50%;

  left: 50%;

  -webkit-transform: translate(-50%, -50%);

  -ms-transform: translate(-50%, -50%);

  transform: translate(-50%, -50%);

  text-align: center;

}
=======
body{ }
/*nav*/
#nav-mercury{font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif; 
  font-size: 0.75em;
  text-decoration: none;
  color: #fff;
  background-color: #393b3e;
}
#mercury .navbar{ padding: 0; }
#nav-mercury a{ color: white; text-transform: uppercase; }
#nav-mercury { 
  background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/nav-bg.png');
  background-repeat: repeat-x;
  background-size: 42px 70px;
}
.brand{ position: relative; left: 0px; height: 64px; }
#nav-mercury a.nav-link{ color: white; font-weight: lighter; }
#nav-mercury a:hover.nav-link{ color: #949494; }
@media (min-width: 992px) {
  #nav-mercury ul li{ border-left: 1px solid rgb(87, 87, 89); padding: 0.5em; }
}
#nav-mercury .dropdown-menu{ background-color: black; }
#nav-mercury .dropdown-item{ font-size: 0.75em;  }
#nav-mercury .dropdown-item:active, #nav-mercury .dropdown-item:focus, #nav-mercury .dropdown-item:hover {background-color: #c00; color: white;}
#nav-mercury .navbar-toggler{ margin-right: 0.5em; }
/*headings*/
h1{margin-bottom: 0;}
@media (max-width: 575.98px) { 
  #nav-mercury .navbar-collapse { text-align: left; padding: 1em; }
  h1.tit-home{ font-family: 'Roboto Slab', serif; font-size: 1.75em; }
  h1.red-tit{ font-family: 'Roboto Slab', serif; font-size: 2em; color: #c00; font-weight: bolder;} 
  h1.segment{font-family: 'Roboto Slab', serif; font-size: 2em; font-weight: 300;}
  h2.potencia{font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif; font-size: 1.5em; font-weight: bolder;}
  h3.sub{font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif; font-size: 1em; font-weight: lighter;}
  h2.accesories{font-family: 'Roboto Slab', serif; font-size: 2em; font-weight: 300;}
  h3.concesionario{font-family: 'Roboto Slab', serif; font-size: 2em; font-weight: 300; color: white;}
  .txt-home{ font-size: 0.9em; }
}
@media (min-width: 576px) and (max-width: 991px) {
  #nav-mercury .navbar-collapse { text-align: left; padding: 1em; border: 0; }
}
@media (min-width: 576px) and (max-width: 767.98px) {  
  h1.tit-home{ font-family: 'Roboto Slab', serif; font-size: 2em; }
  h1.red-tit{font-family: 'Roboto Slab', serif; font-size: 2em; color: #c00; font-weight: bolder;}
  h1.segment{font-family: 'Roboto Slab', serif; font-size: 2em; font-weight: 300;}
  h2.potencia{font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif; font-size: 1.5em; font-weight: bolder;}
  h3.sub{font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif; font-size: 1em; font-weight: lighter;}
  h2.accesories{font-family: 'Roboto Slab', serif; font-size: 2em; font-weight: 300;}
  h3.concesionario{font-family: 'Roboto Slab', serif; font-size: 2em; font-weight: 300; color: white;}
}
@media (min-width: 768px) {
  h1.tit-home{ font-family: 'Roboto Slab', serif; font-size: 3em;}
  h1.red-tit{font-family: 'Roboto Slab', serif; font-size: 3em; color: #c00; font-weight: bolder;}
  h1.segment{font-family: 'Roboto Slab', serif; font-size: 3em; font-weight: 300;}
  h2.potencia{font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif; font-size: 2em; font-weight: bolder;}
  h3.sub{font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif; font-size: 1.25em; font-weight: lighter;}
  h2.accesories{font-family: 'Roboto Slab', serif; font-size: 2.5em; font-weight: 300;}
  h3.concesionario{font-family: 'Roboto Slab', serif; font-size: 3em; font-weight: 300; color: white; padding-top:1em;}
  .c{ font-family: 'Roboto Slab', serif; font-weight: lighter;font-size: 1.25em }
  .nav-p-t{ padding-top: 1.5em; }
  .txt-c{ text-align: center; }
  
}

h2{font-family: 'Roboto Slab', serif; font-size: 0.8em; font-weight: bolder;}
h3{font-family: 'Roboto Slab', serif; font-size: 1.5em; font-weight: bolder;}
h4{font-family: 'Roboto Slab', serif; font-size: 1em; font-weight: bolder;}
h5{font-family: 'Roboto Slab', serif; font-size: 2em; color: #c00; font-weight: bolder;}
h5:hover{color:#039782;}

.card-body h2{font-family: 'Roboto Slab', serif; font-size: 1.5em; color: #c00; font-weight: bolder;}
h4.tit-green  {font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif; text-transform: uppercase; color: rgb(3, 151, 130); font-weight: lighter; font-size: 1.5em;}

a { color: #c00; text-decoration: none;}
a:hover{ text-decoration: underline; color: #c00; }

.bg{background-color: #f0efef;}
.play-grey{ color: rgba(0, 0, 0, 0.75); }
.text-white{ color: white; }
 
 .p-icon{font-size: 0.9em;}
 @media (max-width: 575.98px) { 
 .specs{
    font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;
    font-size: 1.5em;
    font-weight: bold;
    color: #033249;
    letter-spacing: .6px;
    margin-bottom: 1em;
 }
}
 @media (min-width: 576px) { 
 .specs{
    font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;
    font-size: 1.5em;
    font-weight: bold;
    color: #033249;
    letter-spacing: .6px;
    margin-bottom: 1em;
    padding-left: 2em;
 }
}

 .motor-acc{
    font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;
    font-weight: bold;
    color: #033249;
 }
.section-concesionario{
  background-color: #c00;
  color: white;
  flex-direction: row;
  flex-wrap: wrap;
  padding: 0 5% 0;
}

/*headers**/
.header-blue{
    clear: both;
    margin: 0;
    border: 0;
    padding: 38px 10px 8px;
    text-align: center;
    background-image: radial-gradient(ellipse at center,#fff 60%,#039782 100%);
    background-position: 50% 30%;
    background-size: 100% 275%;
}
@media (max-width: 575.98px) { 
  .motor {
    width:100%;
    height:100%;
    min-height: 320px;
    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/motores-19/header-sm2.jpg');
    background-size:cover;
    background-position: center; 
  }
  .helices {
    width:100%;
    height:100%;
    min-height: 320px;
    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/helices/header-sm.jpg');
    background-size:cover;
    background-position: center; 
  }
  .aceites {
    width:100%;
    height:100%;
    min-height: 320px;
    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/aceites-19/header-sm.jpg');
    background-size:cover;
    background-position: center; 
  }
  .indicadores {
    width:100%;
    height:100%;
    min-height: 320px;
    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/relojes/header-sm.jpg');
    background-size:cover;
    background-position: center; 
  }
  .controles {
    width:100%;
    height: 196px;
    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/controles/header-2-sm.jpg');
    background-size:cover;
    background-position: center; 
  }
  .head-all {
    width:100%;
    height: 400px;
    background-size:cover;
    background-position: center; 
  }
  .direcciones {
    width:100%;
    min-height: 196px;
    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/direccion/h-direccion-sm.jpg');
    background-size:cover;
    background-position: center; 
  }
  .head-4t {
    width:100%;
    height: 400px;
    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/motores-19/1/header-top-sm.jpg');
    background-size:cover;
    background-position: center; 
  }
  .bottom-4t {
    width:100%;
    height: 196px;
    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/motores-19/1/header-bottom-sm.jpg');
    background-size:cover;
    background-position: center; 
  }
  .bg-black{
    color: white; background-color: black; border-top: 2px solid white; z-index: -999;   
    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/accesorios/bg-black.jpg');
    background-position: left;
    background-repeat: no-repeat;
    width:100%;
    height:auto;
  }
}
@media (min-width: 576px) and (max-width: 767.98px) {
  .motor {
    width:100%;
    height:100%;
    min-height: 300px;
    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/motores-19/header-sm2.jpg');
    background-size:cover;
    background-position: center; 
  }
  .helices {
    width:100%;
    height:100%;
    min-height: 320px;
    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/helices/header-sm.jpg');
    background-size:cover;
    background-position: center; 
  }
  .aceites {
    width:100%;
    height:100%;
    min-height: 320px;
    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/aceites-19/header-sm.jpg');
    background-size:cover;
    background-position: center; 
  }
    .indicadores {
    width:100%;
    height:100%;
    min-height: 320px;
    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/relojes/header-sm.jpg');
    background-size:cover;
    background-position: center; 
  }
  .controles {
    width:100%;
    min-height: 196px;
    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/controles/header-2-sm.jpg');
    background-size:cover;
    background-position: center; 
  }
  .head-all {
    width:100%;
    height: 400px;
    background-size:cover;
    background-position: center; 
  }
  .direcciones {
    width:100%;
    min-height: 196px;
    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/direccion/h-direccion-sm.jpg');
    background-size:cover;
    background-position: center; 
  }
  .head-4t {
    width:100%;
    height: 400px;
    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/motores-19/1/header-top-sm.jpg');
    background-size:cover;
    background-position: center; 
  }
  .bottom-4t {
    width:100%;
    height: 196px;
    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/motores-19/1/header-bottom-sm.jpg');
    background-size:cover;
    background-position: center; 
  }
    .bg-black{
    color: white; background-color: black; border-top: 2px solid white; z-index: -999;   
    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/accesorios/bg-black.jpg');
    background-position: left;
    background-repeat: no-repeat;
    width:100%;
    height:auto;
  }
}
@media (min-width: 768px) {
  .motor {
    width:100%;
    height:100%;
    min-height: 400px;
    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/motores-19/header2.jpg');
    background-size:cover;
    background-position: right center; 
  }
  .helices {
    width:100%;
    height:100%;
    min-height: 320px;
    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/helices/header.jpg');
    background-size:cover;
    background-position: center; 
  }
  .aceites {
    width:100%;
    height:100%;
    min-height: 320px;
    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/aceites-19/header.jpg');
    background-size:cover;
    background-position: center; 
  }
  .indicadores {
    width:100%;
    height:100%;
    min-height: 320px;
    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/relojes/header.jpg');
    background-size:cover;
    background-position: center; 
  }
  .controles {
    width:100%;
    height:100%;
    min-height: 320px;
    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/controles/header-2.jpg');
    background-size:cover;
    background-position: center; 
  }
  .head-all {
  width:100%;
  height:100%;
  min-height: 450px;
  background-size:cover;
  background-position: center; 
  }
  .direcciones {
    width:100%;
    min-height: 196px;
    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/direccion/h-direccion-lg.jpg');
    background-size:cover;
    background-position: center; 
  }
  .head-4t {
    width:100%;
    height: 400px;
    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/motores-19/1/header-top.jpg');
    background-size:cover;
    background-position: center; 
  }
  .bottom-4t {
    width:100%;
    height: 400px;
    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/motores-19/1/header-bottom.jpg');
    background-size:cover;
    background-position: center; 
  }
   .bg-black{
    color: white; background-color: black; border-top: 2px solid white; z-index: -999;   
    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/accesorios/bg-black.jpg');
    background-position: left;
    background-repeat: no-repeat;
    width:100%;
    height:auto;
    background-size: cover;
  }

}
@media (min-width: 1024px) {
  .bg-black{
    color: white; background-color: black; border-top: 2px solid white; z-index: -999;   
    background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/accesorios/bg-black-1024.jpg');
    background-position: left;
    background-repeat: no-repeat;
    width:100%;
    height:auto;
    background-size: cover;
  }
}
@media (min-width: 1920px) {
     .bg-black{
  color: white; background-color: black; border-top: 2px solid white; z-index: -999;   
  background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/accesorios/bg-black.jpg');
  background-position: left;
  background-repeat: no-repeat;
  width:100%;
  height:auto;
  background-size: cover;
}

}

@media (min-width: 768px){

.engine__animated {
    max-width: 422px;
    top: 80px;
    width: 80%;
}
.engine__animated {
    position: absolute;
    left: 50%;
    max-width: 375px;
    top: -45px;
    /*transform: translate(-50%,0);
    transform: translate(-50%,var(--y));*/
    width: 60%;
    z-index: 5;
    --y: 0;
}
img {
    opacity: 1;
    transition: all .5s;
}

}

 .up{ position: relative; top: -60px;}
/*skews bg*/
@media (max-width: 575.98px) {
    .bg-skew{background:rgba(255,255,255,0.6); position: relative; top: -100px; padding: 0;}
    .bg-skew-dealers{background:rgba(255,255,255,0.6); position: relative; top: 0px; padding: 1.5em;}
}
@media (min-width: 576px) and (max-width: 767.98px) {
    .bg-skew{background:rgba(255,255,255,0.6); position: relative; top: -100px; padding: 0;}
    .bg-skew-dealers{background:rgba(255,255,255,0.6); position: relative; top: -100px; padding: 0;}
}
@media (min-width: 768px) {
    .bg-skew{
    margin-top: 60px;
    font-size: 20px;  
    position:relative;
    overflow:hidden; 
    padding: 2%; 
    width: 85%; 
    left: -15px;
    top: -100px;
    z-index: 1;
    }
    .bg-skew:before{      
    content:'';
    position:absolute;
    top:25px; right:0;
    width:110%; height:100%;
    background:rgba(255,255,255,0.6);
    transform-origin:100% 0;
    transform:skewX(-10deg);
    z-index:-1;
    }

    .bg-skew-dealers{ 
    position:relative;
    overflow:hidden; 
    padding: 2%; 
    width: 55%; 
    /*left: -15px;
    top: -100px;*/
    z-index: 0;
    }
    .bg-skew-dealers:before{      
    content:'';
    position:absolute;
    top:0; right:0;
    width:110%; height:100%;
    background:rgba(255,255,255,0.6);
    transform-origin:100% 0;
    transform:skewX(-10deg);
    z-index:-1;
    }
}


.bg-skew-red {
    position: relative;
    width: 10em;
    padding: 10px 20px 10px 20px;
    position: relative;
    color: white;
    background-color: #c00;
    left: -15px;
    z-index: 10;
}
.bg-skew-red:after {
    content: " ";
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: -1;
    background-color: #c00;
    transform-origin: bottom left;
    -ms-transform: skew(-30deg, 0deg);
    -webkit-transform: skew(-30deg, 0deg);
    transform: skew(-30deg, 0deg);
}
.box-bg-grey{
  background-image: url(https://www.navalmotor.com/mediaserver/web/mercury/bg-grey.png);
  background-size: 104px 182px;
  margin-bottom: 1em;
}
.t-1{ margin-top:-70px; }

/*text*/
.txt-sm{ font-size: 0.8em; }
.tit-bold{font-family: 'Roboto Slab', serif; font-size: 1.15em; text-transform: uppercase; font-weight: bolder; color: black;}
.folleto{color: black;}
.folleto .tit{font-family: 'Roboto Slab', serif; font-size: 1.15em; text-transform: uppercase; font-weight: bolder; border-bottom: 1px solid rgb(160, 160, 160); color: black;}
.folleto .link{font-family: 'Roboto Slab', serif; font-size: 0.85em; color: #c00; font-weight: 700;}
.folleto p{font-size: 0.75em;}
a.link-pdf {color: black;}
.header-blue h1{ font-size: 2.5em; font-weight: bolder; color: black; }
@media (max-width: 575.98px) { .header-blue h1{ font-size: 2em; font-weight: bolder; color: black; } }
@media (min-width: 576px) and (max-width: 767.98px) { .header-blue h1{ font-size: 2em; font-weight: bolder; color: black; } }
.red{color:#c00; }

.page-tagline {text-transform: uppercase;color: rgb(19, 96, 112); font-weight: bolder;}

.card-img{ width:60%; border-bottom: 1px solid grey; margin-top: 1em; }
.card-img-2{ height: 200px; width:auto; margin-top: 1em;  }
.card-img-3{ width:55%; margin-top: 1em; vertical-align: middle; min-height: 109px;  }
.card-img-4{ height: 100px; width:auto; margin-top: 1em;  }
.hand{ cursor: pointer; }

.select-border, .select-border:focus, .select-border:visited{ border: 1px solid #c00; border-radius: 0;}
.form-control, .form-control select{ font-family: 'Roboto Slab', serif; font-weight: 700; color:#c00; font-size: 1em; }
.form-control, .form-control select option{ font-family: 'Roboto Slab', serif!important; color: red; font-size: 1em; }
/*partes*/
.partes-acc{border-bottom: 1px solid #039782; padding-bottom: 40px;}
.partes-acc h2{ font-family: 'Roboto Slab', serif; font-size: 2em; font-weight: bolder;  color: black; }
.partes-acc p{ font-size: 0.95em; font-weight: bolder; }
.partes-acc .btn { background-color: #c00; border:0; color: #fff; transition: all .1s linear; padding: 0.75em; font-weight: bold; border-radius: 0; }
.partes-acc .btn:hover{background-color: #039782;}

.btn-red{ background-color:#c00; color: white; border-radius: 0; margin-top: 1em;}
.btn-red:hover { background-color:#03594d; color: white;}
.btn-red.active { background-color:#830303; color: white; border: 2px solid #500000;}

.btn-white{ background-color:white; color:#c00; border-radius: 0; margin-top: 1em;}
.btn-white:hover { background-color:#cbcbcb; color:#c00;}
.btn-white.active { background-color:#cbcbcb; color:#c00; border: 2px solid #500000;}
@media (max-width: 575.98px) { 
    .partes-acc img { width: 50%;}
    .partes-acc h2{ text-align: center; }
    .partes-acc p{ text-align: justify; } 
    .sm-img{ width: 70%; margin-left:15%;}
}
@media (min-width: 576px) and (max-width: 767.98px) {
    img.partes-acc { width: 70%; }
    h2{ text-align: center; }
    .partes-acc p{ text-align: justify; } 
    .sm-img{ width: 30%; margin-left:35%; }
}
.anchor-link{ 
    position: relative; 
    display: inline-block; 
    margin: 0 15px 10px; 
    border-bottom: 2px solid #039782; 
    padding: 4px 0 2px; 
    color: #039782; 
    font-weight: bolder;
    font-size: 0.9em;
}
.anchor-link:after {
    content: '';
    position: absolute;
    left: 50%;
    bottom: -12px;
    margin-left: -5px;
    border: 5px solid transparent;
    border-top: 5px solid #039782;
}
.anchor-link:hover{ 
    background-color: #039782;
    color: white;
}
/*scroll*/
#toggleActive {
    padding: 10px;
    width: 100%;
    text-align: center;
    display: inline-block;
    background-color: #444;
    color: #eee;
    font-size: 14px;
    cursor: pointer;
    -webkit-transition: all 200ms ease-out;
    -moz-transition: all 200ms ease-out;
    -o-transition: all 200ms ease-out;
    transition: all 200ms ease-out;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
}
#toggleActive.active {
    background-color: #F66169;
    color: #FAEFDE;
}
#scrollUp-active {
    display: none;
}
#scrollUp {
    background-image: url("https://www.navalmotor.com/mediaserver/web/mercury/brand.svg')");
    bottom: 20px;
    right: 20px;
    width: 38px;    /* Width of image */
    height: 38px;   /* Height of image */
}

/*smooth*/
html {
  scroll-behavior: smooth;
}

/*bordes*/
.border-green{ border-top: solid 1px #039782;}
.card{border: 0;}

/*size font*/
.f-1{font-size: 1em;}
.f-2{font-size: 1.5em;}
.f-3{font-size: 1.2em;}

/*modal*/
.modal-content{ background-color: transparent; border: none; }
.close{ color: white; }

/*concesionarios*/
@media (max-width: 575.98px) { 
  h1.tit1{ font-family: 'Roboto Slab', serif; font-size: 1.5em; padding-top: 1em; }
  }
@media (min-width: 576px) and (max-width: 767.98px) { 
  h1.tit1{ font-family: 'Roboto Slab', serif; font-size: 1.5em; padding-top: 1em; }
  }
  @media (min-width: 768px) { 
h1.tit1{ font-family: 'Roboto Slab', serif; font-size: 2.5em; padding:1em; }
}
.stores h2{ font-size: 1em; color: #c00; font-weight: bolder; margin-bottom: 0.25em; }
.stores h3{ font-size: 0.75em; color:#4d4e53; }

@media (min-width: 768px) and (max-width: 991.98px) {
  .mx-h{max-height: 60vh;}
   .mt-negative3{ margin-top: -200px; }
 
}
@media (min-width: 992px) and (max-width: 1199.98px) {
  .mt-negative3{ margin-top: -300px; }
  /*.position-video{position: absolute; top:23vh;}*/
}
@media (min-width: 1200px) {
  .pt-percent{ padding-top: 10%; }
  .mt-negative{ margin-top: -215px; }
  .mt-negative2{ margin-top: -50px; }
  .mt-negative3{ margin-top: -350px; }
  .mx-h{max-height: 50vh;}
  /*.position-video{position: absolute; top:50vh;}*/
}


/*manuales*/
.image {
  display: block;
  width: 100%;
  height: auto;
}
  .overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 90%;
  width: 99%;
  opacity: 0;
  transition: .5s ease;
  background-color: #c00;
}
@media (max-width: 575.98px) { 
  .overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 95%;
  width: 100%;
  opacity: 0;
  transition: .5s ease;
  background-color: #c00;
}
}
.card:hover .overlay {opacity: 1;}
.text {
  color: white;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
}
.nav-pills{font-family: 'Roboto Slab', serif!important; font-weight: bold; background-color: white;}
.nav-pills .nav-link.active { border: 1px solid #c00; background-color: white;color: #000; border-radius: 0; }
.nav-link.btn{ background-color: #c7c7c7; border-radius: none!important; }
.nav-link.active.btn{ background-color: #c00; color: white;}
.card-blurb{line-height: 1.57em; font-size: 14px; font-weight: bold;}
.card-line:hover{ -webkit-box-shadow: 10px 10px 51px -9px rgba(0,0,0,0.75);
-moz-box-shadow: 10px 10px 51px -9px rgba(0,0,0,0.75);
box-shadow: 10px 10px 51px -9px rgba(0,0,0,0.75);}
.nav-pills .nav-link.motores.active {
  background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/motores-19/caret-right-solid.svg');
  background-size: 20px 20px;
  background-position: right; background-repeat:no-repeat;
  border: 1px solid #c00; background-color: white;color: #000; border-radius: 0; }

/* nav dropdown multiple */
.dropdown-submenu {
    position: relative;
}

.dropdown-submenu>.dropdown-menu {
    top: 0;
    left: 100%;
    margin-top: -6px;
    margin-left: -1px;
    -webkit-border-radius: 0 6px 6px 6px;
    -moz-border-radius: 0 6px 6px;
    border-radius: 0 6px 6px 6px;
}

.dropdown-submenu:hover>.dropdown-menu {
    display: block;
}

.dropdown-submenu>a:after {
    display: block;
    content: " ";
    float: right;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid;
    border-width: 5px 0 5px 5px;
    border-left-color: #ccc;
    margin-top: 5px;
    margin-right: -10px;
}

.dropdown-submenu:hover>a:after {
    border-left-color: #fff;
}

.dropdown-submenu.pull-left {
    float: none;
}

.dropdown-submenu.pull-left>.dropdown-menu {
    left: -100%;
    margin-left: 10px;
    -webkit-border-radius: 6px 0 6px 6px;
    -moz-border-radius: 6px 0 6px 6px;
    border-radius: 6px 0 6px 6px;
}

/*motores*/
@media (max-width: 767.98px){
  .img-noticia{ max-height:27vh; width: auto;  }
  .img-motor {
    width: 30%;
    margin-top: 150px;
    height: auto;
  }
  .img-icon{width: 15vw; height: auto; padding-right: 0.5em;}
}
@media (min-width: 768px){
.background-slant::after {
    border-top: 400px solid #27282a;
    border-left: 110px solid transparent;
    width: 185px;
  }
.background-slant::after {
    border-top: 600px solid #27282a;
    border-left: 190px solid transparent;
    border-right: 50px solid #27282a;
    content: '';
    height: 0;
    left: auto;
    left: unset;
    position: absolute;
    right: 0;
    width: 280px;
  }
  .img-noticia{ max-height:30vh; width: auto;  }
  .img-motor {
    position: absolute;
    width:30%;
    /*margin-top: 10px;*/
    margin-top: -140px;
  }
  .img-icon{width: 4.75vw; height: auto; padding-right: 1em;}
}
@media (min-width: 1920px) {
  .img-noticia{ max-height:35vh; width: auto;  }
  .img-icon{width: 3.75vw; height: auto; padding-right: 1em;}
}


.bg-white{background-color: white; z-index:2!important;}
.caracteristicas{
width:100%;
background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/motores-19/caracteristicas/fourstroke_background.jpg');
background-size:cover;
background-position: center;  
}
.caracteristicas-racing{
width:100%;
background-image:url('https://www.navalmotor.com/mediaserver/web/mercury/motores-19/caracteristicas/racing_bg.jpg');
background-size:cover;
background-position: center;  
}
.thumb{z-index: 2}

  
.bg-grey{color: white; background-color: #b5b5b5;}
.spec{ font-size: 0.85em; }  
     
 
.transition {
    -webkit-transform: scale(1.2); 
    -moz-transform: scale(1.2);
    -o-transform: scale(1.2);
    transform: scale(1.2);
}
    .modal-header {
   
     border-bottom: none;
}
    .modal-title {
        color:#000;
    }
    .modal-footer{
      display:none;  
    }

/*fancy*/
.fancybox-skin{ background-color: transparent!important; }
.fancybox-opened .fancybox-skin {
  -webkit-box-shadow: 0 10px 25px rgba(0,0,0,0)!important;
    -moz-box-shadow: 0 10px 25px rgba(0,0,0,0)!important;
   box-shadow: 0 10px 25px rgba(0,0,0,0)!important;
  }

/*icono lupa */
.has-search .form-control-feedback {
    position: absolute;
    z-index: 2;
    display: block;
    width: 2.375rem;
    height: 2.375rem;
    line-height: 2.5rem;
    text-align: center;
    pointer-events: none;
    color: #aaa;
}
.has-search .form-control {
    padding-left: 2.375rem;
}

/*home video*/
@media (max-width: 767.98px){
  #myVideo {
    position: fixed;
    top:115px;
    right: 0;
    bottom: 0;
    min-width: 100vw;
    min-height:80vh;
    z-index: 11;
    border: 0;
  }

}
@media (min-width: 768px){
  #myVideo {
    position: fixed;
    top:125px;
    right: 0;
    bottom: 0;
    min-width: 100vw;
    min-height:80vh;
    z-index: 11;
    border: 0;
  }
}