/* X-Small devices (portrait phones, less than 576px) */
 /* No media query for `xs` since this is the default in Bootstrap */

 /* Small devices (landscape phones, 576px and up) */
 @media (max-width: 576px) { 
  .hero .adj-mt {
    margin-top: 25px;
}
.hero .hero-text{
  margin-top: -90px;
}
.hero .hero-text p{
  font-size: 12px;
  margin-bottom: 0;
}
.hero .diamond1{
  right: 0;
}
#about{
  padding-top: 30px;
  padding-bottom: 60px;
}
.about h1{
  font-size: 40px;
}
.about h6{
  font-size: 12px;
}

.px-10 {
  padding: 0;
}
#about2 .right-bar {
  border-right: 0;
}
#about2 img {
  margin-left: 0;
}
.pl-5 {
  padding-left: 0;
}
.services h1{
  font-size: 40px;
}
.services p{
  font-size: 14px;
}
.technologies .diamond3{
  display: none;
}

.technologies{
  background: #000000;
}
.technologies .containt {
  padding: 2rem 1rem;
}
.technologies h1{
  font-size: 40px;
}
.technologies p{
  font-size: 14px;
}
.technologies{
  height: 280px;
}
.technologies .overlay{
  background-color: transparent;
}
.technologies .diamond2{
  margin-top: 10px;
}
.footer .footer-top {
  padding: 0px 0 30px 0;
}
.about .content {
  padding: 2rem 0;
}
.hero h1{
  text-align: left;
}

.div-play{
  text-align: left !important;
}
.table-mobile{
  display: block;
}
.table-web{
  display: none !important;
}
.hero-product p{
  text-align: left;
}
.product-content {
  padding-top: 50px;
  padding-bottom: 0;
}
.product-content h3{
  font-size: 20px;
}
.product-content p{
  font-size: 14px;
}
  }

 /* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {  }

 /* Large devices (desktops, 992px and up) */
@media (min-width: 992px) { 
  .hero{
    background-size: contain;
  }
  .hero h1{
    font-size: 44px;
  }

  .hero .adj-mt {
    margin-top: 80px;
}
.hero .diamond1 {
  margin-top: -200px;
}
.hero .hero-text{
  padding-bottom: 130px;
}
#main{
  margin-top: -190px;
}
#about .container{
  padding: 0 5rem;
}
.about h1{
  font-size: 44px;
}
#about{
  padding-top: 140px;
}
#services .container{
  padding: 0 5rem;
}
.technologies h1{
  font-size: 40px;
}
.technologies .diamond2{
  margin-top: -10px;
}
.technologies .diamond3
{
  margin-top: -85px;
}
.about p {
  font-size: 14px;
}
.header .logo{
  margin-left: 35px;
}
.services .service-box{
  padding: 30px 30px;
}
 }

 /* X-Large devices (large desktops, 1200px and up) */
@media (min-width: 1279px) { 
  .header .logo {
    margin-left: 0;
}
#main {
  margin-top: 30px;
}
.about p {
  font-size: 20px;
}
.technologies .diamond3 {
  margin-top: -100px;
}
.technologies .diamond2 {
  margin-top: 40px;
}
  .hero h1{
    font-size: 60px;
  }
  .hero{
    background-size: cover;
    padding-bottom: 0;
    margin-bottom: -30px;
  }
  .hero .hero-text{
    padding-bottom: 50px;
  }
  .hero .diamond1{
    margin-top: -130px;
  }

  #about{
    padding-top: 140px;
  }
  #about .container{
    padding: 0 5rem;
  }
  
  #services .container{
    padding: 0 5rem;
  }
  #about2 .pl-5 {
    padding-left: 100px;
}

.technologies .containt {
  padding: 7rem 5rem;
}
 }

 /* XX-Large devices (larger desktops, 1400px and up) */
@media (min-width: 1400px) { 
  #about{
    padding-top: 160px;
  }
  #main {
    margin-top: 10px;
}
.services .service-box {
  padding: 50px 30px;
}
.technologies h1 {
  font-size: 64px;
}
  .hero{
    background-size: cover;
    padding-bottom: 0;
    margin-bottom: -10px;
  }
  .hero .hero-text{
    padding-bottom: 40px;
  }
  .hero .diamond1{
    margin-top: -150px;
  }
  #about2 .pl-5 {
    padding-left: 100px;
}
.technologies .containt {
  padding: 8rem 5rem;
}
.technologies .diamond3{
  margin-top: -113px;
}
.technologies .diamond2{
  margin-top: -7px;
}

#about .container{
  padding: 0 8rem;
}

#services .container{
  padding: 0 8rem;
}
}

@media (min-width: 1600px) { 
  #main {
    margin-top: 0;
}
.about h1 {
  font-size: 64px;
}
  .hero {
    background-size: cover;
    padding-bottom: 0;
    margin-bottom: 0;
}

  .hero .adj-mt {
    margin-top: 170px;
  }

  .hero .diamond1{
    margin-top: -160px;
  }
  #about{
    padding-top: 200px;
  }

  #about2 .pl-5 {
    padding-left: 130px;
}
.technologies .containt {
  padding: 8rem 6rem;
}
.technologies .diamond3{
  margin-top: -114px;
}
.technologies .diamond2{
  margin-top: -4px;
}

.hero-product .adj-mt {
  margin-top: 100px;
  padding-bottom: 50px;
}

.product-content {
  padding-top: 200px;
}
}

 /* XX-Large devices (larger desktops, 1800px and up) */
 @media (min-width: 1800px) { 
  .hero .adj-mt {
    margin-top: 230px;
  }
  .hero .diamond1{
    margin-top: -180px;
  }

  #about{
    padding-top: 200px;
  }

  #about2 .pl-5 {
    padding-left: 130px;
}
.technologies{
  height: 500px;
}
.technologies .overlay{
  height: 500px;
}
.technologies .diamond2{
  margin-top: 60px;
}
.technologies .diamond3{
  right: -80px;
}
.header .logo img{
  max-height: 100px;
}
.technologies .containt {
  padding: 10rem 6rem;
}
.container{
  max-width: 1300px;
}

.hero-product .adj-mt {
  margin-top: 150px;
  padding-bottom: 100px;
}

.product-content {
  padding-top: 200px;
}
}