Viewing File: /home/ubuntu/bytecollar-landing-ui/assets/css/responsive.css

/*================================
Template Name: Bytecollar
Author: Beno Darry
Author website: 
Version: 1.0
================================== */

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

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

@media (min-width: 992px) and (max-width: 1199.98px) {
}

@media (min-width: 992px) {
}

@media (min-width: 1200px) {
}

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


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

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

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

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

@media (max-width: 991.98px) {
  .moblie-nav{
    display: block!important;
  }
  .header-nav-center{
    display: none!important;
  }
  .who-we-are-you-info{
    margin-top: 6em;
  }
  .about-why-choose-feature-card{
    height: auto;
    margin-bottom: 1em;
    padding: 1em!important;
  }
  .about-why-do-we-do-card{
    padding: 1em;
    margin-bottom: 1em;
  }
  .about-counter-card{
    height: auto;
    margin-bottom: 1em;
  }
  .tns-nav {
    left: 0!important;
    display: flex;
    justify-content: center;
    width: 100%;
  }
  .who-we-are-count-wrap{
    display: flex!important;
    flex-wrap: wrap;
    justify-content: center;
  }
  .who-we-are-card::after{
    display: none;
  }
  .cta-banner-info-sec {
    margin-top: 0em!important;
  }
  .our-work-image{
    width: 100%!important;
  }
  #offer-bar {
    top: -30px!important;
    left: 100px!important;
  }
  /* .different-industry-wrap {
    display: flex!important;
    grid-template-columns: 70px auto;
    align-items: flex-start!important;
    padding: 2em 1em;
    flex-direction: column;
    gap: 1em;
  } */
  .tech-ful-img{
    margin: 0 auto!important;
  }
  .offer-image,.cta-img-size{
    width: 100%;
  }
  .offer-best-info-sec,.cta-banner-info-sec{
    text-align: center;
  } 
  .spacing-left-4{
    padding: 0;

  }
  .my-teams-vertical-center{
    height: 100vh!important;
  }
}

@media (max-width: 767.98px) {
  .spacing-4 {
    padding: 2em 0!important;
}
.mb-space-4{
  margin-bottom: 2em!important;
}
  .spacing-left-4 {
    padding-left: 0em!important;
}
  .col-order{
    order: 1;
  }
  .who-we-are-count-wrap {
    display: grid!important;
    grid-template-columns: repeat(1, 1fr)!important;
}
.banner-info-area h1 {
  flex-wrap: wrap!important;
  font-size: 2em!important;
  text-align: center;
}
.banner-info-area .banner-description{
text-align: center;
font-size: 1em!important;
}
.banner-img-sec{
  padding-top: 1em;
}
.find-us-card-img {
  margin-bottom: 0em!important;
}
.tech-img-wrapped,.offer-image-sec{
  margin-bottom: 1em;
}
.media-linked {
  gap: 0.5em!important;
}
.btn-default-sec{
  text-align: center;
}
.hero-wrapped{
  height: 100%!important;
}
.our-work-image,.tech-ful-img,.tech-image{
  width: 100%!important;
}
.our-offer-info-card {
  grid-template-columns: repeat(1 , 1fr)!important;
}
.footer-quick-link {
  gap: 1em!important;
  padding-top: 2em!important;
  flex-direction: column!important;
}
.footer-quick-link li::after{
  display: none!important;
}
.pre-footer-wrap {
  flex-direction: column;
  text-align: center;
  gap:1em;
}
.tech-title{
  text-align: center;
}
.tech-img-sec{
  padding-bottom: 3em;
}
.our-offer-img-sec{
  padding-bottom: 2em;
}
#offer-bar {
  top: -34px!important;
  left: 0!important;
}
.tech-we-work-wrapped .title-card,.faq-sec-wrapped .title-card{
  text-align: center!important;
}
.faq-contact-sec-wrapped {
  padding-left: 0em!important;
  text-align: center;
  padding-bottom: 2em;
}
.who-we-are-card::after{
  display: none!important;
}
.who-we-are-card {
  grid-template-columns: auto!important;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 1em;
}
.count-img{
  margin:  0 auto;
}
.cta-banner-info-sec{
  margin-top: 0em!important;
}
.cta-banner-info-wrap{
  padding: 1em!important;
  text-align: center;
}
.cta-banner-info-sec h3{
  font-size: 1.8em!important;
}
.cta-img-size{
  margin-bottom: 1em;
}
.offer-best-main-wrapped{
  text-align: center;
}
.faq-area-sec .accordion-button {
  font-size: 1rem!important;
  gap: 1em;
}
.title-card h2{
  font-size: 1.8em!important;
}
.who-we-are-sec-card{
  padding: 1em!important;
}
.thank-you-img {
  max-width: 15em;
}
.tns-nav {
  left: 0!important;
  display: flex;
  justify-content: center;
  width: 100%;
}
.served-card-info-wrapped{
  padding: 1em!important;
}
.our-offer-card{
  padding: 1em;
}
.my-teams-vertical-center{
  height: 80vh!important;
}
.page-title-sec h2,.who-we-are-you-info h2{
  font-size: 2em!important;
}

.who-we-are-you-img-sec .who-we-are-you-img-bg{
  left: 0!important;
}

.about-why-do-we-do-card{
  padding: 1em;
  margin-bottom: 1em;
}
.about-counter-card{
  height: auto;
  margin-bottom: 1em;
}
.byte-contact-form{
  padding: 1em;
}
.tns-nav {
  left: 0!important;
  display: flex;
  justify-content: center;
  width: 100%;
}
.banner-img{
  max-width:10em;
}
.banner-content{
  padding-top:2em;
  text-align:center;
}
.banner-content h1{
  font-size:2.5em;
}
.media-linked li a{
  width: 3em;
  height: 3em;
  padding:0;
}
}

/* Large Device CSS */

@media screen and (min-width: 1400px) {
  .container {
    width: 1320px;
    max-width: 100%;
  }
}
@media screen and (min-width: 1600px) {
  .container {
    width: 1320px;
    max-width: 100%;
  }
}
@media screen and (min-width: 1900px) {
  .container {
    width: 1520px;
    max-width: 100%;
  }
}