@import url("https://fonts.googleapis.com/css?family=Montserrat:400,700");
@import url("https://fonts.googleapis.com/css?family=Montserrat:400,700|Open+Sans:100,300,300i,400,400i,600,600i,700,700i,800,800i");
@import url("https://fonts.googleapis.com/css?family=Raleway:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i");

/*--GENERAL---*/
body {
  font-family: "Open Sans", sans-serif;
}

.no-padding {
  padding: 0px;
}

.float-right {
  float: right;
}

.float-left {
  float: left;
}

p {
  font-family: "Open Sans", sans-serif;
}

h1,
h2,
h3,
h4,
h5 {
  font-family: "Montserrat", sans-serif;
}

h1 {
  font-weight: 700;
  margin: 1.2em 0 !important;
}

section h1 {
  text-align: center;
  color: #313342;
}

section#historia {
  background-color: rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: inset 0px -10px 10px 0px rgba(0, 0, 0, 0.04);
  -moz-box-shadow: inset 0px -10px 10px 0px rgba(0, 0, 0, 0.04);
  box-shadow: inset 0px -10px 10px 0px rgba(0, 0, 0, 0.04);
  padding: 100px 0px 0px 0px;
}

section#productos {
  background-color: white;
  padding: 100px 0px 30px 0px;
  min-height: 900px;
}

@media screen and (max-width: 997px) {
  /*--SLIDER---*/
  section#productos {
    min-height: 800px;
  }
}

section#contacto {
  background-color: #3b3e4f;
  padding: 80px 0px 30px 0px;
}

section .bg {
  height: 20px;
  left: 0;
  position: relative;
  width: 100%;
}

section#contacto .bg {
  background: transparent url(../img/wave_contact_bg.png) repeat-x scroll 0 0;
  top: -100px;
}

section#historia .bg {
  background: transparent url(../img/wave_slider_bg.png) repeat-x scroll 0 0;
  top: -120px;
}

.affix {
  position: fixed;
  top: 0px;
  float: left;
  width: 100%;
  z-index: 99999;
}

/*--HEADER---*/
.navbar-miks {
  background-color: #2196f3;
  border: none;
  padding: 20px 0px;
  margin: 0px;
  border-radius: 0px;
  -webkit-box-shadow: 0 1px 10px 0 rgba(0, 0, 0, 0.15);
  box-shadow: 0 1px 10px 0 rgba(0, 0, 0, 0.15);
}

.navbar-miks ul li a {
  color: white !important;
  font-size: 14px;
  font-weight: 600;
  padding: 0px 20px;
}

.navbar-miks ul .divisor {
  height: 20px;
  border-right: 1px solid rgba(255, 255, 255, 0.6);
  position: relative;
  float: left;
}

.sello-header {
  width: 310px;
  position: relative;
  float: right;
  right: 0px;
}

.sello-header img {
  top: -60px;
  position: absolute;
  float: right;
}

/*--Header Top---*/
.header-top {
  background-color: white;
}

.header-top .container {
  padding: 20px 0px;
}

.header-top .header-box-icon,
.header-top .header-box-info {
  margin-top: 15px;
}

.header-top .header-box-icon {
  width: 20px;
  float: left;
  position: absolute;
}

.header-top .header-box-icon i {
  font-size: 55px;
  line-height: 40px;
  color: #2196f3;
  margin-left: -35px;
}

.header-top .header-box-icon i.fa-map-marker {
  font-size: 47px;
}

.header-top .header-box-info {
  float: left;
  height: 40px;
}

.header-top .header-box-info p {
  line-height: 11px;
  color: #d0d0d0;
  font-size: 14px;
  font-weight: 400;
  margin: 0px;
  float: right;
  line-height: 18px;
}

.header-top .header-box-info p strong {
  line-height: 18px;
  color: #3b3e4f;
  font-size: 18px;
  font-weight: 700;
  font-family: "Montserrat", sans-serif;
}

.header-top .header-box-info p a,
.header-top .header-box-info p a:hover {
  color: inherit;
  text-decoration: none;
}

.box-yellow {
  position: relative;
  background: transparent url(../img/box-yellow.png) no-repeat left top;
  width: 215px;
  padding-bottom: 17px;
  margin-top: -51px;
  float: right;
  height: 55px;
}

.box-yellow p {
  position: absolute;
  width: 215px;
  margin: 0px;
  font-family: "Montserrat", sans-serif;
  font-weight: 700;
  padding-top: 15px;
  text-align: center;
  line-height: 14px;
}

/*--Menu Effect--*/
#hamburger-icon {
  width: 40px;
  height: 25px;
  position: relative;
  display: block;
  margin: 15px 15px 20px 0px;
  background-color: transparent;
  border: none;
}

#hamburger-icon .line {
  display: block;
  background: #ecf0f1;
  width: 40px;
  height: 4px;
  position: absolute;
  left: 0;
  border-radius: 2px;
  transition: all 0.4s;
  -webkit-transition: all 0.4s;
  -moz-transition: all 0.4s;
}

#hamburger-icon .line.line-1 {
  top: 0;
}

#hamburger-icon .line.line-2 {
  top: 50%;
}

#hamburger-icon .line.line-3 {
  top: 100%;
}

#hamburger-icon:hover .line-1,
#hamburger-icon:focus .line-1 {
  transform: translateY(-2px);
  -webkit-transform: translateY(-2px);
  -moz-transform: translateY(-2px);
}

#hamburger-icon:hover .line-3,
#hamburger-icon:focus .line-3 {
  transform: translateY(2px);
  -webkit-transform: translateY(2px);
  -moz-transform: translateY(2px);
}

#hamburger-icon.active .line-1 {
  transform: translateY(12.5px) translateX(0) rotate(45deg);
  -webkit-transform: translateY(12.5px) translateX(0) rotate(45deg);
  -moz-transform: translateY(12.5px) translateX(0) rotate(45deg);
}

#hamburger-icon.active .line-2 {
  opacity: 0;
}

#hamburger-icon.active .line-3 {
  transform: translateY(-12.5px) translateX(0) rotate(-45deg);
  -webkit-transform: translateY(-12.5px) translateX(0) rotate(-45deg);
  -moz-transform: translateY(-12.5px) translateX(0) rotate(-45deg);
}
/*--FIN / HEADER---*/

/*--BACK TO TOP--*/
.back-to-top {
  cursor: pointer;
  position: fixed;
  bottom: 60px;
  right: 50px;
  display: none;
  transition: background-color 0.4s ease;
  background-color: rgb(247, 227, 74);
  border: none;
  border-radius: 34px;
  z-index: 3;
  padding: 14px 15px;
  line-height: 18px;
}

.back-to-top:hover {
  background-color: rgb(226, 208, 66);
}

.back-to-top:focus {
  background-color: rgb(226, 208, 66);
}

.back-to-top i {
  font-size: 18px;
  line-height: 16px;
}

/*--SCROLLING Nav--*/
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:focus,
.navbar-default .navbar-nav > .active > a:hover {
  color: rgb(236, 211, 32) !important;
  background-color: transparent !important;
}

/*--HISTORIA---*/
section#historia img {
  float: right;
  width: 80%;
}

section#historia h1 {
  text-align: left;
  margin-bottom: 20px !important;
}

section#historia h2 {
  text-align: left;
  font-size: 33px;
  font-weight: 300;
  font-family: "Raleway", sans-serif;
  color: #2196f3;
}

section#historia p {
  text-align: left;
  font-size: 18px;
  font-weight: 400;
  color: rgba(0, 0, 0, 0.7);
}
/*--FIN / HISTORIA---*/

/*--PRODUCTOS---*/
section#productos .description-product {
  background-color: white;
  padding: 15px;
  float: left;
  border-bottom-left-radius: 3px;
  border-bottom-right-radius: 3px;
}

section#productos .description-product h3 {
  font-weight: 900;
  font-size: 17px;
  margin: 0px 0px 15px 0px;
  line-height: 17px;
  float: left;
  width: 100%;
  text-align: center;
}

section#productos .description-product p {
  font-weight: 400;
  color: rgba(0, 0, 0, 0.7);
  font-size: 18px;
}

section#productos .description-product p i {
  color: rgba(0, 0, 0, 0.5);
}

section#productos .grid {
  position: relative;
  margin: 0 auto;
  float: left;
  padding: 15px 0px;
  max-width: 1000px;
  list-style: none;
  text-align: center;
}

section#productos .grid figure {
  position: relative;
  float: left;
  overflow: hidden;
  margin: 0px;
  min-width: auto;
  width: 100%;
  background: rgba(74, 55, 83, 0.5);
  text-align: center;
}

.grid figure img {
  position: relative;
  display: block;
  min-height: 100%;
  max-width: 100%;
  width: 100%;
  opacity: 0.8;
}

/*Carrusel Productos*/
.multi-item-carousel .carousel-inner > .item {
  -webkit-transition: 500ms ease-in-out left;
  transition: 500ms ease-in-out left;
}

.multi-item-carousel .carousel-inner .active.left {
  left: -33%;
}

.multi-item-carousel .carousel-inner .active.right {
  left: 33%;
}

.multi-item-carousel .carousel-inner .next {
  left: 33%;
}

.multi-item-carousel .carousel-inner .prev {
  left: -33%;
}

@media all and (transform-3d), (-webkit-transform-3d) {
  .multi-item-carousel .carousel-inner > .item {
    -webkit-transition: 500ms ease-in-out all;
    transition: 500ms ease-in-out all;
    -webkit-backface-visibility: visible;
    backface-visibility: visible;
    -webkit-transform: none !important;
    transform: none !important;
  }
}

.multi-item-carousel .carouse-control.left,
.multi-item-carousel .carouse-control.right {
  background-image: none;
}
/*--FIN / PRODUCTOS---*/

/*--CONTACTO---*/
section#contacto h1 {
  color: white;
}

section#contacto form {
  margin-top: 30px;
}

#contacto i {
  font-size: 50px;
  line-height: 50px;
  color: #f7e34a;
  margin-bottom: 15px;
}

#contacto h3 {
  font-size: 40px;
  line-height: 40px;
  font-weight: 200;
  margin-bottom: 15px;
  color: white;
  display: none;
  font-family: "Raleway", sans-serif;
}

#contacto p {
  font-size: 27px;
  line-height: 27px;
  font-weight: 100;
  color: white;
  font-family: "Montserrat", sans-serif;
}

#contacto .alert-success,
#contacto .alert-danger {
  background-color: rgba(0, 0, 0, 0.1);
  border-radius: 4px;
  padding: 12.5px;
  font-weight: 400;
  font-size: 15px;
}

#contacto .alert-success {
  color: #b0ff6a;
  border: 2px solid #b0ff6a;
}

#contacto .alert-danger {
  color: #ff2929;
  border: 2px solid #ff0000;
}

#contacto .form-group input[type="text"],
#contacto .form-group input[type="email"],
#contacto .form-group input[type="tel"],
#contacto .form-group textarea {
  background-color: rgba(0, 0, 0, 0);
  box-shadow: none;
  border-radius: 3px;
  color: white;
  border: 2px solid white;
  font-weight: 600;
  font-family: "Raleway", sans-serif;
}

#contacto input[type="submit"] {
  background-color: transparent;
  border: 2px solid white;
}

#contacto input[type="submit"]:hover {
  transition: background-color 0.4s ease;
  background-color: #2196f3;
  border: 2px solid white;
}

#contacto .form-group input {
  height: 50px;
}

#contacto .form-group textarea {
  max-width: 100%;
  min-height: 150px;
}

input[placeholder],
[placeholder],
*[placeholder] {
  font-size: 16px;
  font-weight: 300;
}

/* Placeholders */
input::-webkit-input-placeholder {
  /* WebKit browsers */
  font-size: 17px;
  font-weight: 300;
  color: rgba(255, 255, 255, 0.7) !important;
  font-family: "Raleway", sans-serif;
}

input:-moz-placeholder {
  /* Mozilla Firefox 4 to 18 */
  font-size: 17px;
  font-weight: 300;
  color: rgba(255, 255, 255, 0.7) !important;
  font-family: "Raleway", sans-serif;
}

input::-moz-placeholder {
  /* Mozilla Firefox 19+ */
  font-size: 17px;
  font-weight: 300;
  color: rgba(255, 255, 255, 0.7) !important;
  font-family: "Raleway", sans-serif;
}

input:-ms-input-placeholder {
  /* Internet Explorer 10+ */
  font-size: 17px;
  font-weight: 300;
  color: rgba(255, 255, 255, 0.7) !important;
  font-family: "Raleway", sans-serif;
}
/*--FIN / CONTACTO---*/

/*--SLIDER---*/
#slide-home .carousel-inner .carousel-caption {
  bottom: 40%;
}

#slide-home .carousel-inner .carousel-caption h3 {
  font-weight: 400;
  font-size: 54px;
  line-height: 56px;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.8);
}

#slide-home .carousel-inner .carousel-caption p {
  font-weight: 400;
  font-size: 30px;
  line-height: 35px;
  font-family: "Raleway", sans-serif;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 1);
}

@media screen and (max-width: 1200px) {
  /*--SLIDER---*/
  #slide-home .carousel-inner .carousel-caption h3 {
    font-size: 45px;
    line-height: 50px;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.8);
  }

  #slide-home .carousel-inner .carousel-caption p {
    font-size: 27px;
    line-height: 30px;
}
}

#slide-home .item .img {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  height: 700px;
}

#slide-home .item .slide-01 {
  background: linear-gradient(to left, rgba(33, 150, 243, 0.4), rgba(142, 84, 233, 0.5)),
    url(../img/img_slider-01.jpg) no-repeat center;
  background-size: cover;
}

#slide-home .item .slide-02 {
  background: linear-gradient(to left, rgba(33, 150, 243, 0.4), rgba(142, 84, 233, 0.5)),
    url(../img/img_slider-02.jpg) no-repeat center;
  background-size: cover;
}

#slide-home .item .slide-03 {
  background: linear-gradient(to left, rgba(33, 150, 243, 0.4), rgba(142, 84, 233, 0.5)),
    url(../img/img_slider-03.jpg) no-repeat center;
  background-size: cover;
}

#slide-home .item .slide-04 {
  background: url(../img/img_slider-04.png) no-repeat center;
  background-size: auto;
}

@media (max-width: 1200px) {
  #slide-home .item .slide-04 {
    background: url(../img/img_slider-04-mobile.png) no-repeat center;
    background-size: cover;
  }
}

#slide-home .carousel-indicators li {
  background-color: rgba(0, 0, 0, 0.1);
  border: none;
}

#slide-home .carousel-indicators .active {
  background-color: rgb(236, 211, 32);
  transition: all 0.5s ease;
}

@media (max-width: 767px) {
   #slide-home .carousel-control .fa-angle-right {
    right: 5px;
  } 

  #slide-home .carousel-control .fa-angle-left {
    left: 5px;
  } 

  #slide-home .carousel-control .fa-angle-left,
  #slide-home .carousel-control .fa-angle-right{
    font-size: 60px;
    top: 70%;
  }

  #slide-home .carousel-control.right,
  #slide-home .carousel-control.left {
    opacity: 0.3;
  } 
}

.carousel-control .fa-angle-right,
.carousel-control .icon-next {
  position: absolute;
  top: 40%;
  z-index: 5;
  display: inline-block;
  margin-top: -10px;
  font-size: 120px;
}

.carousel-control .fa-angle-left,
.carousel-control .fa-angle-right,
.carousel-control .icon-next,
.carousel-control .icon-prev {
  position: absolute;
  top: 40%;
  z-index: 5;
  display: inline-block;
  margin-top: -10px;
  font-size: 120px;
}

.carousel-control .fa-angle-left,
.carousel-control .icon-prev {
  margin-left: 0px;
}
/*--FIN / SLIDER---*/

/*--CAROUSEL PRODUCTOS MOBILE---*/
#productos .carousel-control .fa-angle-left,
#productos .carousel-control .fa-angle-right,
#productos .carousel-control .icon-next,
#productos .carousel-control .icon-prev {
  width: 75px;
  height: 120px;
  margin-top: 0px;
  font-size: 120px;
  line-height: 120px;
  top: 0px;
  color: #2196f3;
  background-color: none;
}

#productos .carousel-control,
#productos .carousel-control:focus,
#productos .carousel-control:hover {
  height: 120px;
  width: 80px;
  opacity: 1;
  text-shadow: none;
  top: 120px;
  background-image: none !important;
}

  #productos .carousel-control .fa-angle-left,
  #productos .carousel-control .icon-prev {
    left: -70px;
  }
  
  #productos .carousel-control .fa-angle-right,
  #productos .carousel-control .icon-next {
    right: -70px;
  }
/*--FIN / CAROUSEL PRODUCTOS DESKTOP-MOBILE---*/

/*--FOOTER---*/
.footer {
  position: absolute;
  width: 100%;
  height: 50px;
  background-color: #313342;
}

.footer p {
  color: grey;
}

.footer i {
  float: right;
  font-size: 20px;
  line-height: 20px;
  color: white;
  background-color: rgba(0, 0, 0, 0.1);
  padding: 15px 20px;
  margin-top: -15px;
  cursor: pointer;
}

.footer i:hover {
  transition: all 0.5s ease;
  color: #3b5998;
  background-color: white;
}

.container .text-muted {
  margin: 15px 0;
}

@media screen and (max-width: 1400px) {
  #productos .carousel-control .fa-angle-left {
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
  }

  #productos .carousel-control .fa-angle-right {
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
  }

  #productos .carousel-control .fa-angle-left,
  #productos .carousel-control .fa-angle-right,
  #productos .carousel-control .icon-next,
  #productos .carousel-control .icon-prev {
    width: 65px;
    height: 100px;
    font-size: 80px;
    line-height: 100px;
    color: #3b3e4f;
    background-color: rgba(59, 62, 79, 0.1);
  }

  #productos .carousel-control .fa-angle-left,
  #productos .carousel-control .icon-prev {
    left: 15px;
  }

  #productos .carousel-control .fa-angle-right,
  #productos .carousel-control .icon-next {
    right: 15px;
  }
}

@media (min-width: 767px) {
  .carousel-indicators {
    bottom: 40px;
  }
}

@media (max-width: 767px) {
  .back-to-top {
    right: 15px;
  }

  /*--GENERAL---*/
  section h1 {
    margin-top: 0px !important;
  }

  section#historia,
  section#productos,
  section#contacto {
    height: auto;
    padding: 50px 0px 50px 0px;
  }

  /*--HEADER---*/
  .navbar-miks {
    padding: 0px;
  }

  .navbar-miks ul li a {
    line-height: 30px;
    text-align: center;
  }

  /*--Header Top---*/
  .header-top a img {
    width: 50%;
    height: auto;
    margin-bottom: 15px;
  }

  .header-top a h1 {
    font-size: 14px;
    line-height: 14px;
    color: #3b3e4f;
    font-weight: 700;
    margin: 0px !important;
  }
  /*--FIN / HEADER---*/

  .grid {
    padding: 15px 0px !important;
  }

  /*--SLIDER---*/
  #slide-home .item .img {
    height: 465px;
  }

  #slide-home .carousel-inner .carousel-caption {
    bottom: 30%;
    left: 5%;
    right: 5%;
  }

  #slide-home .carousel-inner .carousel-caption h3 {
    font-size: 28px;
    line-height: 34px;
    font-weight: 600;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 1);
  }

  /*--CONTACTO---*/
  section .bg {
    top: -65px !important;
  }

  .row.contact-info {
    background-color: rgba(0, 0, 0, 0.05);
    padding-top: 20px;
  }

  #contacto p {
    font-size: 21px;
    line-height: 23px;
  }

  #contacto i {
    font-size: 35px;
    line-height: 35px;
    margin-bottom: 5px;
  }

  #contacto .form-group {
    margin-bottom: 20px;
    padding: 0px;
  }
}

@media (max-width: 485px) {
}

@media (max-width: 320px) {
  /*--SLIDER---*/
  #slide-home .item .img {
    height: 375px;
  }

  #slide-home .carousel-inner .carousel-caption {
    bottom: 15%;
  }
}

.has-error {
  color: red !important;
}

#myModalPush h1 {
  color: red;
  text-align: center;
  font-size: 28px;
  margin-top: 0px !important;
}

#myModalPush h2 {
  text-align: center;
  font-size: 18px;
  line-height: 28px;
  color: rgba(0, 0, 0, 0.7);
}

#myModalPush h2 strong {
  color: red;
}

#myModalPush .modal-body {
  padding-top: 0px;
}

#myModalPush .modal-header {
  border-bottom: none;
  padding: 0px;
}

#myModalPush .modal-header .close {
  font-size: 50px;
  line-height: 30px;
  padding: 20px;
}

.modal-open .modal {
  z-index: 999999;
}
