/*

monttec 559 Zay Shop

https://monttec.com/tm-559-zay-shop

---------------------------------------------
Table of contents
------------------------------------------------
1. Typography
2. General
3. Nav
4. Hero Carousel
5. Accordion
6. Shop
7. Product
8. Carousel Hero
9. Carousel Brand
10. Services
11. Contact map
12. Footer
13. Small devices (landscape phones, 576px and up)
14. Medium devices (tablets, 768px and up)
15. Large devices (desktops, 992px and up)
16. Extra large devices (large desktops, 1200px and up)
--------------------------------------------- */




/* Typography */
body, ul, li, p, a, label, input, div {
  font-family: 'Roboto', sans-serif;
  font-size: 18px !important;
  font-weight: 300 !important;
}
.h1 {
  font-family: 'Roboto', sans-serif;
  font-size: 40px !important;
  font-weight: 100 !important;
}
.h2 {
  font-family: 'Roboto', sans-serif;
  font-size: 30px !important;
  font-weight: 300;
}
.h3 {
  font-family: 'Roboto', sans-serif;
  font-size: 22px !important;
}
/* General */
.logo { font-weight: 500 !important;}
.text-warning {  color: #ede861 !important;}
.text-muted { color: #bcbcbc !important;}
.text-success { color: #5a66bd !important;}
.text-light { color: #cfd6e1 !important;}
.bg-dark { background-color: #212934 !important;}
.bg-light { background-color: #e9eef5 !important;}
.bg-black { background-color: #1d242d !important;}
.bg-success { background-color: #5a66bd !important;}
.btn-success {
  background-color: #5a66bd !important;
  border-color: #5a66bd !important;
}
.pagination .page-link:hover {color: #000;}
.pagination .page-link:hover, .pagination .page-link.active {
  background-color: #5a66bd;
  color: #fff;
}
/* Nav */
#monttec_nav_top { min-height: 40px;}
#monttec_nav_top * { font-size: .9em !important;}
#monttec_main_nav a { color: #212934;}
#monttec_main_nav a:hover { color: #5a66bd;}
#monttec_main_nav .navbar .nav-icon { margin-right: 20px;}

.collapse:not(.show) {
  display: contents !important;
}

.navbar {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  padding-top: .5rem !important;
  padding-bottom: .5rem !important;
}

.navbar-expand-lg {
  flex-wrap: nowrap !important;
  justify-content: flex-start !important;
}

.navbar>.container, .navbar>.container-fluid, .navbar>.container-lg, .navbar>.container-md, .navbar>.container-sm, .navbar>.container-xl, .navbar>.container-xxl {
    display: flex !important;
    flex-wrap: inherit !important;
    align-items: center !important;
    justify-content: space-between !important;
}

.align-self-center {
  align-self: center !important;
}

.navbar-expand-lg .navbar-collapse {
  display: flex !important;
  flex-basis: auto !important;
}

.justify-content-lg-between {
    justify-content: space-between !important;
}

.navbar-expand-lg .navbar-nav {
    flex-direction: row !important;
}

@media (max-width: 576px) {
  .alinhamento{
    align-items: center !important;
  }
  .na-it0{
    width: 0% !important;
    font-size: 10px !important;
  }
  .na-it1{
    width: 15% !important;
    font-size: 10px !important;
  }
  .na-it2{
    width: 42% !important;
    font-size: 10px !important;
  }
}

/* Hero Carousel */
#template-mo-zay-hero-carousel { background: #efefef !important;}
/* Accordion */
.monttec-accordion a { color: #000;}
.monttec-accordion a:hover { color: #333d4a;}
/* Shop */
.shop-top-menu a:hover { color: #69bb7e !important;}
/* Product */
.product-wap { box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.10);}
.product-wap .product-color-dot.color-dot-red { background:#f71515;}
.product-wap .product-color-dot.color-dot-blue { background:#6db4fe;}
.product-wap .product-color-dot.color-dot-black { background:#000000;}
.product-wap .product-color-dot.color-dot-light { background:#e0e0e0;}
.product-wap .product-color-dot.color-dot-green { background:#5a66bd;}
.card.product-wap .card .product-overlay {
  background: rgba(0,0,0,.2);
  visibility: hidden;
  opacity: 0;
  transition: .3s;
}
.card.product-wap:hover .card .product-overlay {
  visibility: visible;
  opacity: 1;
}
.card.product-wap a { color: #000;}
#carousel-related-product .slick-slide:focus { outline: none !important;}
#carousel-related-product .slick-dots li button:before {
  font-size: 15px;
  margin-top: 20px;
}
/* Brand */
.brand-img {
  filter: grayscale(100%);
  opacity: 0.5;
  transition: .5s;
}
.brand-img:hover {
  filter: grayscale(0%);
  opacity: 1;
}
/* Carousel Hero */
#template-mo-zay-hero-carousel .carousel-indicators li {
  margin-top: -50px;
  background-color: #5a66bd;
}
#template-mo-zay-hero-carousel .carousel-control-next i,
#template-mo-zay-hero-carousel .carousel-control-prev i {
  color: #5a66bd !important;
  font-size: 2.8em !important;
}
/* Carousel Brand */
.monttec-carousel .h1 {
  font-size: .5em !important;
  color: #000 !important;
}

/* Services */
.services-icon-wap {transition: .3s;}
.services-icon-wap:hover, .services-icon-wap:hover i {color: #fff;}
.services-icon-wap:hover {background: #5a66bd;}
/* Contact map */
.leaflet-control a, .leaflet-control { font-size: 10px !important;}
.form-control { border: 1px solid #e8e8e8;}
/* Footer */
#monttec_footer a { color: #dcdde1 !important;}
#monttec_footer a:hover { color: #5a66bd !important;}
#monttec_footer ul.footer-link-list li { padding-top: 10px;}
#monttec_footer ul.footer-icons li {
  width: 2.6em;
  height: 2.6em;
  line-height: 2.6em;
}
#monttec_footer ul.footer-icons li:hover {
  background-color: #cfd6e1;
  transition: .5s;
}
#monttec_footer ul.footer-icons li:hover i {
  color: #212934;
  transition: .5s;
}
#monttec_footer .border-light { border-color: #2d343f !important;}
/*
// Extra small devices (portrait phones, less than 576px)
// No media query since this is the default in Bootstrap
*/
/* Small devices (landscape phones, 576px and up)*/
.product-wap .h3, .product-wap li, .product-wap i, .product-wap p {
  font-size: 12px !important;
}
.product-wap .product-color-dot {
  width: 6px;
  height: 6px;
}

@media (min-width: 576px) {
  .monttec-carousel .h1 { font-size: 1em !important;}
}

/*// Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) {
  #monttec_main_nav .navbar-nav {max-width: 450px;}
 }

/* Large devices (desktops, 992px and up)*/
@media (min-width: 992px) {
  #template-mo-zay-hero-carousel .carousel-item {min-height: 30rem !important;}
  .product-wap .h3, .product-wap li, .product-wap i, .product-wap p {font-size: 18px !important;}
  .product-wap .product-color-dot {
    width: 12px;
    height: 12px;
  }
}

#monttec_main_nav .navbar-nav {width: 100%; float: inline-end;}

/* Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) {}


/*---------------------------------------
  CUSTOM PROPERTIES ( VARIABLES )             
-----------------------------------------*/
:root {
  --white-color:                  #ffffff;
  --primary-color:                #020a46;
  --secondary-color:              #EE5007;
  --section-bg-color:             #f0f8ff;
  --custom-btn-bg-color:          #EE5007;
  --custom-btn-bg-hover-color:    #c01f27;
  --dark-color:                   #000000;
  --p-color:                      #717275;
  --border-color:                 #7fffd4;
  --link-hover-color:             #B22727;

  --body-font-family:             'Outfit', sans-serif;

  --h1-font-size:                 74px;
  --h2-font-size:                 46px;
  --h3-font-size:                 32px;
  --h4-font-size:                 28px;
  --h5-font-size:                 24px;
  --h6-font-size:                 22px;
  --p-font-size:                  18px;
  --btn-font-size:                14px;
  --copyright-font-size:          16px;

  --border-radius-large:          100px;
  --border-radius-medium:         20px;
  --border-radius-small:          10px;

  --font-weight-light:            300;
  --font-weight-normal:           400;
  --font-weight-bold:             700;
}

body {
  background-color: var(--white-color);
  font-family: var(--body-font-family); 
}


/* ---------------------------------------
  ABOUT              
-----------------------------------------*/

@media screen and (max-width: 991px) {
   .section-padding {
    padding-top: 50px;
    padding-bottom: 50px;
  }
  
}

.about-section {
  /* background-image: url('../images/edward-unsplash-blur.jpg'); */
  background-color: #e4ebfc;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
}

.about-image {
  border-radius: var(--border-radius-medium);
  display: block;
}

.about-text-wrap {
  position: relative;
}

.about-text-icon {
  background: var(--primary-color);
  border-radius: 100%;
  font-size: var(--h3-font-size);
  width: 70px;
  height: 70px;
  line-height: 70px;
  text-align: center;
}

.about-text-info {
  backdrop-filter: blur(5px) saturate(180%);
  -webkit-backdrop-filter: blur(5px) saturate(180%);
  background-color: rgba(255, 255, 255, 0.75);
  border-radius: var(--border-radius-medium);
  border: 1px solid rgba(209, 213, 219, 0.3);
  position: absolute;
  bottom: 0;
  right: 0;
  left: 0;
  margin: 20px;
  padding: 35px;
}



/* Contato e Localização */
section {
  margin-top: 00px;
  padding-top: 60px;
}

@media (min-width: 576px) {
  section {
    margin-top: 0px;
    padding-top: 60px;
  }
}

.section-heading {
  margin-bottom: 30px;
}

.section-heading h2 {
  font-size: 22px;
  font-weight: 700;
  text-transform: capitalize;
  color: #020a46;
  line-height: 32px;
  letter-spacing: -0.5px;
}

@media (min-width: 576px) {
  .section-heading h2 {
    font-size: 30px;
    line-height: 34px;
    text-transform: uppercase;
    letter-spacing: auto;
  }
}

.section-heading h2 em {
  color: #5a66bd;
  font-style: normal;
  padding-left: 100px;
  position: relative;
}

.section-heading h2 em::before {
  width: 80px;
  height: 2px;
  background-color: #5a66bd;
  content: '';
  position: absolute;
  left: 0;
  top: 22px;
}

button:focus:not(:focus-visible) {
  -webkit-box-shadow: none;
          box-shadow: none;
}

section.contact-us {
  padding: 60px 0px;
  background-color: #e4ebfc;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
}

@media (min-width: 992px) {
  section.contact-us {
    margin-top: 0px;
    padding: 120px 0px;
  }
}

section.contact-us .left-form {
  padding-right: 15px;
}

@media (min-width: 992px) {
  section.contact-us .left-form {
    padding-right: 0px;
  }
}

@media (max-width: 1399px) {
 .info-contact {
    width: 100% !important;
  }
}

@media (max-width: 1399px) {
 .maps {
    height: 570px !important;
  }
}

section.contact-us .right-map {
  padding-left: 15px;
}

@media (min-width: 992px) {
  section.contact-us .right-map {
    padding-left: 0px;
  }
}

section.contact-us form {
  padding: 30px;
  border-top-right-radius: 7.5px;
  border-bottom-right-radius: 7.5px;
  background-color: #ffffff;
  border-top-left-radius: 7.5px;
  border-bottom-left-radius: 7.5px;
  margin-bottom: 0px;
}

@media (min-width: 992px) {
  section.contact-us form {
    padding: 30px;
    border-top-right-radius: 7.5px;
    border-bottom-right-radius: 7.5px;
    margin-right: 20px;
  }
}

section.contact-us form input {
  width: 100%;
  height: 44px;
  border-radius: 7.5px;
  border: 1px solid #eeeeee;
  font-size: 14px;
  padding: 0px 15px;
  margin-bottom: 15px;
}

section.contact-us form textarea {
  width: 100%;
  max-width: 100%;
  min-width: 100%;
  min-height: 120px;
  height: 120px;
  max-height: 120px;
  border-radius: 7.5px;
  border: 1px solid #eeeeee;
  font-size: 14px;
  padding: 10px 15px;
  margin-bottom: 15px;
}

section.contact-us form button.main-button {
  width: 100%;
}

section.contact-us #map iframe {
  border-top-right-radius: 7.5px;
  border-bottom-right-radius: 7.5px;
  border-top-left-radius: 7.5px;
  border-bottom-left-radius: 7.5px;
  margin-top: 30px;
  width: 100%;
}

@media (min-width: 992px) {
  section.contact-us #map iframe {
    margin-top: 0px;
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
  }
}

button.main-button1 {
  font-size: 14px;
  text-transform: capitalize;
  font-weight: 400;
  color: #ffffff;
  background-color: #5a66bd;
  padding: 11px 25px;
  border-radius: 7.5px;
  display: inline-block;
  outline: none;
  border: none;
  -webkit-transition: all .5s;
  transition: all .5s;
  width: 100%;
}

button.main-button1:hover {
  background-color: #2a2a2a;
}

.oquefazemos-background-color{
  background-color: #e4ebfc;
  padding: 10px;
}

.oquefazemos{
  color: #5a66bd;
  text-align: center;
  margin-top: 20px;
  margin-bottom: 20px;
}

.servicos{
  list-style-type: none;
  margin-left: -2rem !important;
}


/* gallery Style */
.gallery {
  display: grid;
  grid-template-columns: repeat(10, 1fr);
  grid-template-rows: repeat(156, 4vw);
  grid-gap: 15px;
}

.gallery__img {
  width: 100%;
  height: 100%;
  object-fit: fill;
}

.gallery__item--1 {
  grid-column-start: 1;
  grid-column-end: 11;
  grid-row-start: 1;
  grid-row-end: 12;
}

.gallery__item--2 {
  grid-column-start: 1;
  grid-column-end: 11;
  grid-row-start: 12;
  grid-row-end: 24;
}

.gallery__item--3 {
  grid-column-start: 1;
  grid-column-end: 11;
  grid-row-start: 24;
  grid-row-end: 36;
}

.gallery__item--4 {
  grid-column-start: 1;
  grid-column-end: 11;
  grid-row-start: 36;
  grid-row-end: 48;
}

.gallery__item--5 {
  grid-column-start: 1;
  grid-column-end: 11;
  grid-row-start: 48;
  grid-row-end: 60;
}

.gallery__item--6 {
  grid-column-start: 1;
  grid-column-end: 11;
  grid-row-start: 60;
  grid-row-end: 72;
}

.gallery__item--7 {
  grid-column-start: 1;
  grid-column-end: 11;
  grid-row-start: 72;
  grid-row-end: 84;
}

.gallery__item--8 {
  grid-column-start: 1;
  grid-column-end: 11;
  grid-row-start: 84;
  grid-row-end: 96;
}

.gallery__item--9 {
  grid-column-start: 1;
  grid-column-end: 11;
  grid-row-start: 96;
  grid-row-end: 108;
}

.gallery__item--10 {
  grid-column-start: 1;
  grid-column-end: 11;
  grid-row-start: 108;
  grid-row-end: 120;
}

.gallery__item--11 {
  grid-column-start: 1;
  grid-column-end: 11;
  grid-row-start: 120;
  grid-row-end: 132;
}

.gallery__item--12 {
  grid-column-start: 1;
  grid-column-end: 11;
  grid-row-start: 132;
  grid-row-end: 144;
}

.gallery__item--13 {
  grid-column-start: 1;
  grid-column-end: 11;
  grid-row-start: 144;
  grid-row-end: 156;
}


/* ERROR 404 */
.container-error404{
  max-width: 1980px;
}

.gallery2 {
  display: grid;
  grid-template-columns: repeat(3, 0fr);
  grid-template-rows: repeat(6, 6vw);
  grid-gap: 22px;
}

.error-404 {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.gallery__item--error404 {
  grid-column-start: 1;
  grid-column-end: 10;
  grid-row-start: 1;
  grid-row-end: 7;
}

.footer-bg{
  background-color: #020a46;
}

.color-text-orcament{
  color: #020a46;
}

.maps {
  height: 540px;
}

.img-footer{
  max-width: 150px;
  margin-top: -30px;
  margin-left: -30px;
}


@media (min-width: 992px) {
  .logo-celular{
  display: none;
  }
}

@media (max-width: 992px) {
  .logo-pc{
    display: none;
  }
}

.logo-pc{
  width: 250px !important;
}


@media (max-width: 768px) {
  .img-footer{
    justify-self: center;
    display: flex;
    margin-left: 0px;
  }
}

@media (min-width: 992px) {
  .img-carrosel{
    width: 100%;
    object-fit: cover;
  } 
}

@media (max-width: 992px) {
  .img-carrosel{
    width: 100%;
    object-fit: cover;
  } 
}

@media (max-width: 576px) {
  .img-carrosel{
  width: 100%;
  object-fit: cover;
  }   
}
