@font-face {
    font-family: 'Veto';
    src: url('../fonts/Veto-Com-Regular.ttf'); /* IE9 Compat Modes */
    src: url('../fonts/Veto-Com-Bold.ttf'); /* IE9 Compat Modes */
    src: url('../fonts/Veto-Com-Bold.ttf')  format('truetype'); /* Safari, Android, iOS */
    src: url('../fonts/Veto-Com-Regular.ttf')  format('truetype'); /* Safari, Android, iOS */
  }
  
  @font-face {
    font-family: "AK1";
    src: url(../fonts/Aeonik-Regular.woff) format("woff");
  }
  @font-face {
    font-family: "AK2";
    src: url(../fonts/Aeonik-Medium.woff) format("woff");
  }
  html.has-scroll-smooth {
    overflow: hidden;
  }
  
  html {
    top: 0;
    margin: 0;
    left: 0;
  }
  
  body {
    font-family: 'AK1', sans-serif;
    background: #E0E5EC;
    overflow-x: hidden;
    top: 0;
    margin: 0;
    left: 0;
    /* background-image: url(../../images/page-background-image-1.jpg);
    background-repeat: repeat-y;
    background-size: contain; */
    width: 100vw;
  }
  
  img {
      width: 100%;
  }
  
  a {
    color: #E0E5EC;
  }
  
  h1 {
    font-size: 3em;
    font-weight: 600;
    font-family: "AK1", sans-serif;
    letter-spacing: -1px;
    line-height: 0.8em;
  }
  
  h2 {
    font-size: 36px;
    font-weight: 600;
  }
  
  h3 {
    font-size: 28px;
    line-height: 50px;
    text-align: left;
  }
  
  p {
      font-size: 16px;
      line-height: 18px;
      margin: 0;
  }
  
  a {
      text-decoration: none;
  }
  
  
  .filter-icon {
      max-width: 120px;
    transition: 0.3s ease;
  }
  
  .filter-icon:hover {
    transition: 0.3s ease;
    transform: scale(1.1);
  }
  
  li {
    font-size: 18px;
  }
  
  
  .menu-nav {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 2fr 1fr 1fr 1fr;
    list-style-type: none;
  }
  
  .menu-nav li {
    text-align: center;
    margin: auto;
    padding: 8px 15px;
    border-radius: 10px;
  }
  
  .menu-nav li:hover {
    cursor: pointer;
    transition: 0.3s ease-in;
    border: 1px solid rgb(99, 99, 99);
    color: white;
  } 
  
  .menu-nav li a {
    color: black;
    font-size: 20px;
  }
  
  
  /* NAVIGATION MENU */
  
  #menu{
    width: 35px;
    height: 35px;
    margin: 30px 0 20px 20px;
    cursor: pointer;
    padding: 15px;
    border-radius: 15px;
    box-shadow: 9px 9px 16px rgb(163 177 198 / 51%), -9px -9px 16px rgb(255 255 255 / 64%);
  }
  
  .bar{
      height: 5px;
      width: 100%;
      background-color: #1d1d1d;
      display: block;
      border-radius: 5px;
      transition: 0.3s ease;
  }
  
  #bar1{
    margin-top: 8px;
      transform: translateY(-4px);
  }
  
  #bar3{
      transform: translateY(4px);
  }
  
  .nav li a{
      color: #e0e5eb;
    text-decoration: none;
    text-transform: uppercase;
    font-weight: 900;
    font-size: 38px;
  }
  
  .nav li:hover{
      font-weight: bold;
    transition: 0.3s ease-in;
    transform: scale(1.1);
  }
  
  .nav li{
    transition: 0.3s ease-in;
      list-style: none;
      padding: 16px 0;
  }
  .nav{
      padding: 0;
      margin: 0 20px;
      transition: 0.3s ease 0.8s;
      opacity: 0;
    display: none;
  }
  
  #menu-bar {
    display: none;
  }
  
  #menu {
    margin-left: 25px;
  }
  
  .menu-bg, #menu-bar{
      top: 0;
      left: 0;
      position: absolute;
  }
  
  #menu-bar > ul {
    margin: auto;
    text-align: cente r;
    margin-left: 45vw;
    margin-top: 15vh;
  }
  
  .menu-bg{
      z-index: 11;
      width: 0;
      height: 0;
      /* margin: 30px 0 20px 20px; */
    background: black;
    background-image: url(../../images/menu-background.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
      /* border-radius: 50%; */
      transition: 0.7s ease-in;
  }
  #menu-bar{
      z-index: 20;	
  }
  .change-bg{
      width: 125vw;
      height: 125vh;
      /* transform: translate(-45%,-15%); */
  }
  .change .bar{
      background-color: rgb(0, 0, 0);
  }
  .change #bar1{
      transform: translateY(4px) rotateZ(-45deg);
  }
  .change #bar3{
      transform: translateY(-6px) rotate(45deg);
  }
  .change #bar2{
      opacity: 0;
  }
  .change{
      display: block;
    opacity: 1;
  }
  
  li > a {
      font-size: 26px;
  }
  
  
  
  /* LAVA LAMP */
  
  
  .wrap {
    overflow: hidden;
    /* position: absolute; */
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    margin: 0 0;
    /* background-image: linear-gradient(-206deg, #0CAEE8 0%, #3B4A82 100%); */
  }
    
  .wrap canvas {
      width: 100vw;
      height: 100vh;
  }
    
  .wrap .motto {
      z-index: 10;
      position: absolute;
      top: 150px;
      left: 50%;
      margin-left: -250px;
      text-align: center;
      color: #fafafa;
      font-family: 'Rajdhani', sans-serif;
      font-weight: 700;
      font-size: 100pt;
      color: black;
      -webkit-text-stroke-width: 1px;
      -webkit-text-stroke-color: #9e9e9e;
  }
  
  .bottom-container {
    height: 550px;
    background-color: #3B4A82;
    width: 100vw;
  }
  
  #home-mozaic-pink-container {
    background-color: #e65492;
  }
  
  
  /* HOME-PAGE */
  
  
  .promotion-container {
    display: flex;
    justify-content: center;
  }
  
  .promotion {
    background: #e0e5ec !important;
  }
  
  .home-body-section {
    /* background-image: url(../../images/page-background-image-1.jpg);
    background-repeat: repeat-y;
    background-size: contain; */
  }
  
  .windows-11-button-container {
    width: 280px;
    margin: auto;
    margin-right: 0;
  }
  
  .windows-11-button {
    /* height: 32px; */
    width: 280px;
  }
  
  
  .home-top-allproducts-info-container {
    text-align: center;
    margin-top: 100px;
    font-size: 50px;
    font-weight: 700;
    text-transform: uppercase;
  }
  
  .home-top-allproducts-image-container {
    position: relative
  }
  
  .home-laptops-container {
    max-width: 80vw;
    margin: auto;
    display: grid;
    grid-template-columns: 2fr 3fr;
  }
  
  .home-tablets-container {
    display: grid;
    grid-template-columns: 3fr 2fr;
  }
  
  .home-gateway-logo {
    max-width: 30vw;
    margin: auto;
    margin-bottom: 10vh;
  }
  
  .home-laptops-info-container,
  .home-tablets-info-container {
    display: flex;
    flex-direction: column;
    margin: auto;
    box-shadow: 9px 9px 16px rgb(163 177 198 / 51%), -9px -9px 16px rgb(255 255 255 / 64%);
    padding: 55px;
    border-radius: 15px;
    margin: 5vh;
    max-width: 500px;
    max-height: 750px;
    transition: ease-out 0.3s;
  }
  
  .home-laptops-info-container:hover,
  .home-tablets-info-container:hover { 
    transition: ease-in 0.3s;
    transform: translateY(-10px);
    box-shadow: 9px 9px 16px rgb(79 93 114 / 51%), -9px -9px 16px rgb(255 255 255 / 64%);
    background-color: #d0d7e0;
  }
  
  .home-laptops-info-h2-container > h2 {
    font-size: 5rem;
    margin: 0;
    color: #000000;
    text-transform: uppercase;
    font-weight: 600;
    font-family: "AK1", sans-serif;
    letter-spacing: -1px;
    margin-top: 0.5em;
  }
  
  .home-laptops-info-body-container > h3,
  .home-laptops-info-body-container > h3 {
    font-size: 24px
  }
  
  
  .home-laptops-info-body-container > p {
    max-width: 330px;
  }
  
  .home-tablets-container {
    margin: 5vh auto;
  }
  
  .home-laptops-image-container,
  .home-tablets-image-container {
    display: flex;
  }
  
  .home-laptops-image-container > img,
  .home-tablets-image-container > img {
    margin: auto;
  }
  
  .home-laptops-info-body-container,
  .home-tablets-info-body-container{
    font-size: 16px;
    margin-top: 2.5em;
    text-align: right;
    margin-left: auto;
  }
  
  .home-product-specs-container {
    background-color: black;
    padding-bottom: 55px;
    color: #E0E5EC;
  }
  
  .home-laptops-info-body-container button {
    margin-top: 55px;
  }
  
  
  .home-lifestyle-image-container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    max-width: 90vw;
    margin: auto;
  }
  
  .home-lifestyle-image {
    margin: 3vh auto;
  }
  
  .home-lifestyle-image-contaier > img {
    padding: 10px;
    box-shadow: 9px 9px 16px rgb(163 177 198 / 51%), -9px -9px 16px rgb(255 255 255 / 64%);
  }
  
  .home-lifestyle-h3 {
    font-size: 60px;
    margin: 0;
    padding: 5vh;
    color: #E0E5EC;
    text-align: center;
    text-transform: uppercase;
    background: black;
    font-weight: 400;
    font-family: "AK1", sans-serif;
    letter-spacing: -1px;
    padding-left: 5vw;
    padding-right: 5vw;
  }
  
  .home-mozaic-lifestyle-1-2-container {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
  
  .home-mozaic-lifestyle-full-container > img {
    height: 100%;
    object-fit: cover;
  }
  
  
  /* PRODUCT PAGE */
  
  
  
  .product-new-banner-container {
    margin: auto;
    /* max-width: 78vw; */
    margin-top: 70px;
  }
  
  
  .product-top-image-section {
    background-image: url(../../images/page-background-image-3.jpg);
    background-repeat: repeat;
    background-size: 100vw;
  }
  
  
  
  .laptops-filter-icon-p {
    font-size: 18px;
    font-weight: 500;
    text-transform: uppercase;
  }
  
  .product-body-container {
    background-image: url(../../images/page-background-image-2.jpg);
    background-repeat: repeat;
    background-size: contain;
  }
  
  .product-main-top-container {
      height: 100vh;
      display: flex;
  }
  
  .product-top-image-container {
    display: grid;
    grid-template-columns: 3fr 2fr;
    padding-top: 5vh;
    padding-bottom: 5vh;
    max-width: 1650px;
    margin: auto;
  }
  
  .product-top-image-info-inner-container {
    display: flex;
    flex-direction: column;
    padding: 25px;
    /* box-shadow: 9px 9px 16px rgb(163 177 198 / 51%), -9px -9px 16px rgb(255 255 255 / 64%);
    border-radius: 15px; */
  }
  
  .product-main-inner-top-container {
    margin: auto;
  }
  
  .product-main-top-info-container,
  .product-main-top-info-container-1 {
    /* max-width: 80%;
    margin: auto; */
  }
  
  .product-main-top-info-container h3 {
      font-size: 55px;
      line-height: 55px;
    text-align: left;
    margin: 0.5em auto;
  }
  
  .product-main-top-info-container-1 h3 {
    font-style: italic;
    color: #036a9c;
    margin: 0;
    line-height: 20px;
  }
  
  .product-main-top-info-container {
  
  }
  
  .product-main-top-info-container > p {
    padding: 10px 0;
    font-size: 16px;
  }
  
  .product-main-top-info-container li {
    line-height: 20px;
  }
  
  .product-main-container {
    display: grid;
    grid-template-columns: 1fr 2fr;
    max-width: 80vw;
    margin: auto;
  }
  
  #product-disclaimer {
    font-size: 14px;
  }
  
  .product-disclaimer-anchor {
    color: #036a9c;
  }
  
  .product-main-feature {
    font-size: 4em;
    text-align: center;
    font-weight: 600;
    font-family: "AK1", sans-serif;
    letter-spacing: -1px;
    line-height: 0.8em;
  }
  
  .product-main-inner-container {
    display: flex;
    flex-direction: column;
    margin: auto;
  }
  
  .product-main-inner-container > img {
    width: 80%;
    margin: auto;
  }
  
  .product-main-inner-info-container {
    max-width: 400px;
    display: flex;
    flex-direction: column;
    margin: auto;
    padding: 55px;
    box-shadow: 9px 9px 16px rgb(163 177 198 / 51%), -9px -9px 16px rgb(255 255 255 / 64%);
    border-radius: 15px;
    margin: auto 25px;
  }
  
  .product-main-inner-info-container >h3 {
    line-height: 25px;
  }
  
  .product-ports-section {
    display: grid;
    grid-template-columns: 1fr 1fr;
    max-width: 90vw;
    margin: auto;
  }
  
  .product-colors-top-container {
    margin: 15px auto;
  }
  
  .product-colors-top-inner-container {
    display: flex;
    justify-content: flex-start;
  }
  
  .product-top-colors-inner-container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
  
  
  .product-main-inner-info-container > h3 {
    font-size: 20px;
  }
  
  .product-box-section {
    /* background-image: url(../../images/page-background-image-1.jpg);
    background-repeat: repeat-y;
    background-size: cover;
    background-attachment: fixed; */
  }
  
  .product-colors-image-inner-container-gwtc116-1-black {
    display: flex;
  }
  
  .products-list__items {
    max-width: 300px;
    line-height: 20px;
    margin: 15px auto;
    height: 120px;
  }
  
  .products-list__item {
    list-style-type: disc;
    font-size: 16px;
    /* text-align: center; */
  }
  
  
  /* PRODUCTS PAGE */
  
  .products-reviews-outer-container {
    max-width: 300px;
    line-height: 20px;
    margin: 15px auto;
  }
  
  .product-microsoft-banner-container {
    margin: auto;
  }
  
  .microsoft-banner-img {
    max-width: 260px;
  }
  
  .product-banner-img {
    width: 100%;
  }
  
  #microsoft-banner-img1,
  #microsoft-banner-img2,
  #microsoft-banner-img3,
  #microsoft-banner-img4,
  #microsoft-banner-img5 {
    max-width: 100%;
  }
  
  /* HIDDING THE COLORS IMAGES */
  
  .product-colors-image-inner-container-gwtc116-1-blue,
  .product-colors-image-inner-container-gwtc116-1-white,
  .product-colors-image-inner-container-gwtc116-1-purple,
  .product-colors-image-inner-container-gwtc116-1-green,
  .product-colors-image-inner-container-gwtc116-1-pink {
    display: none;
  }
  
  /* SPECS SECTION */
  
  .product-inner-specs-left-container,
  .product-inner-specs-right-container {
    box-shadow: 9px 9px 16px rgb(163 177 198 / 51%), -9px -9px 16px rgb(255 255 255 / 64%);
    border-radius: 15px;
    padding: 25px;
    margin-bottom: 55px;
  }
  
  .product-specs-container {
      background-color: black;
  }
  
  .product-specs-top-inner-container {
    display: grid;
    grid-template-columns: 1fr 2fr;
  }
  
  .product-specs-top-inner-container p {
      color: white;
    font-size: 18px;
    margin: 10px 0;
    text-align: center;
  }
  
  .product-dimension-info-container {
    flex-direction: column;
    text-align: left;
    display: flex;
    justify-content: center;
  }
  
  .product-specs-header-container {
    display: grid;
      color: white;
      padding-top: 50px;
      max-width: 80vw;
      margin: auto;
  }
  
  .product-specs-header-container  > h4{
    margin: 1em;
    text-align: left;
    max-width: 600px;
    margin-left: auto;
    font-weight: 100;
    font-size: 18px;
  }
  
  #creator-h3,
  #thx-h3 {
    text-align: left;
  }
  
  .product-specs-top-container {
      max-width: 70vw;
      margin: auto;
      display: grid;
    grid-template-columns: 1fr 1fr;
    padding-bottom: 50px;
  }
  
  .product-inner-boxt-left-container h3 {
      font-size: 32px;
  }
  
  .product-inner-box-container {
    max-width: 80vw;
    column-gap: 55px;
    margin: auto;
    display: grid;
      grid-template-columns: 1fr 1fr;
    padding-bottom: 5vh;
    padding-top: 5vh;
  }
  
  .product-colors-image-container {
      display: grid;
    grid-template-columns: 3fr 1fr;
    max-width: 80vw;
    margin: auto;
  }
  
  .product-colors-image-container-black {
    max-width: 90vw;
    margin: auto;
  }
  
  .product-colors-image-inner-container {
    display: flex;
    flex-direction: column;
    margin: auto;
    max-width: 500px;
  }
  
  .product-colors-image-inner-container > h2 {
    text-align: center;
  }
  
  .product-colors-inner-container {
    padding: 5px;
    box-shadow: 9px 9px 16px rgb(163 177 198 / 51%), -9px -9px 16px rgb(255 255 255 / 64%);
    border-radius: 15px;
    display: flex;
    margin: 25px auto;
    cursor: pointer;
    min-width: 225px;
  }
  
  .product-colors-inner-container > P {
    margin: auto;
  }
  
  .product-techspecs-h3-container {
    padding-top: 10vh;
    padding-bottom: 10vh;
      max-width: 60vw;
      margin: auto;
  }
  
  .product-techspecs-h3-container h3 {
    font-size: 50px;
  }
  
  .product-techspecs-h3-container h4 {
    font-size: 20px;
  }
  
  .product-techspecs-h3-container p {
    font-size: 18px;
    /* text-transform: uppercase; */
  }
  
  .product-specs-image-inner-container {
      display: flex;
      align-items: center;
      justify-content: center;
  }
  
  .product-inner-boxt-right-container,
  .product-inner-boxt-left-container {
    padding: 55px;
    box-shadow: 9px 9px 16px rgb(163 177 198 / 51%), -9px -9px 16px rgb(255 255 255 / 64%);
    border-radius: 15px;
    margin: auto 55px;
  }
  
  .specs-header-p {
      font-size: 18px;
    font-weight: 600;
    padding: 15px 0;
  }
  
  .specs-p {
      font-size: 18px;
  }
  
  .product-ports-image {
    width: 100%;
    margin: auto;
  }
  
  .product-ports-info-container {
    max-width: 30vw;
    margin: auto;
    display: flex;
    justify-content: space-between;
  }
  
  
  .product-available-container {
    display: flex;
    justify-content: flex-start;
    vertical-align:middle ;
  }
  
  .product-available-container > p,
  .product-available-container > img {
    /* margin: auto; */
  }
  
  .product-available-container > p {
    margin-top: 15px;
    color: #0971ce;
    margin-right: 10px;
    font-size: 22px;
  }
  
  .walmart-icon {
    max-width: 150px;
  }
  
  
  /* PRODUCT REVIEWS */
  
  .product-reviews-section {
  
  }
  
  .product-reviews-container {
    max-width: 90vw;
    margin: auto;  
  }
  
  /* SLIDER STYLING */
  
  .top-slider-container,
  .top-slider-section {
    margin: 0;
    padding: 0;
    width: 100vw;
    height: 100vh;
    display: flex;
    display: -webkit-flex;
    justify-content: center;
    -webkit-justify-content: center;
    align-items: center;
    -webkit-align-items: center;
    display: none;
  }
  
  .carousel {
    width: 100%;
    height: 100%;
    display: flex;
    max-width: 80vw;
    max-height: 80vh;   
    overflow: hidden;
    position: relative;
  }
  
  .carousel-item {
    visibility:visible;
    display: flex;
    width: 100%;
    height: 100%;
    align-items: center;
    justify-content: flex-end;
    -webkit-align-items: center;
    -webkit-justify-content: flex-end;
    position: relative;
      background: #e0e5eb;
    flex-shrink: 0;
    -webkit-flex-shrink: 0;
    position: absolute;
    z-index: 0;
    transition: 0.6s all linear;
  }
  
  .carousel-item__info {
    height: 100%;
    display: flex;
    justify-content: center;
    flex-direction: column;
    
      display: -webkit-flex;
    -webkit-justify-content: center;
    -webkit-flex-direction: column;
    
    order: 1;
    left: 0;
    margin: auto;
    padding: 0 40px;
    width: 20%;
    background: #e0e5eb;
  }
  
  .carousel-item__image {
    width: 80%;
    height: 100%;
    order: 2;
    align-self: flex-end;
    flex-basis: 80%;
  
    -webkit-order: 2;
    -webkit-align-self: flex-end;
    -webkit-flex-basis: 80%;
  
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    position:relative;
    transform: translateX(100%);
    transition: 0.6s all ease-in-out;
  }
  
  .carousel-item__subtitle {
      font-family: 'Open Sans', sans-serif;
      letter-spacing: 3px;
      font-size: 10px;
      text-transform: uppercase;
      margin: 0;
      color: #7E7E7E;    
      font-weight: 700;
      transform: translateY(25%);
      opacity: 0;
      visibility: hidden;
      transition: 0.4s all ease-in-out;
  }
  
  .carousel-item__title {
      margin: 15px 0 0 0;
      font-family: 'Playfair Display', serif;
      font-size: 44px;
      line-height: 45px;
      letter-spacing: 3px;
      font-weight: 700;
      color: #2C2C2C;
      transform: translateY(25%);
      opacity: 0;
      visibility: hidden;
      transition: 0.6s all ease-in-out;
  }
  
  .carousel-item__description {
      transform: translateY(25%);
      opacity: 0;
      visibility: hidden;
      transition: 0.6s all ease-in-out;
      margin-top: 35px;
      font-family: 'Open Sans', sans-serif;
      font-size: 13px;
      color: #7e7e7e;
      line-height: 22px;
      margin-bottom: 35px;
  }
  
  .carousel-item--1 .carousel-item__image{
    background-image: url('../../images/products/product/GWTN141-1BK_Angled_Left.jpg');
  }
  
  
  .carousel-item--2 .carousel-item__image{
    background-image: url('../../images/products/product/GWTN141-1BK_Front.jpg');
  }
  
  .carousel-item--3 .carousel-item__image{
    background-image: url('../../images/products/product/GWTN141-1BK_Parallel_Left.jpg');
  }
  
  
  .carousel-item__btn {
      width: 35%;
      color: #2C2C2C;
      font-family: 'Open Sans', sans-serif;
      letter-spacing: 3px;
      font-size: 11px;
      text-transform: uppercase;
      margin: 0;
      width: 35%;
      font-weight: 700;
    text-decoration: none;
        transform: translateY(25%);
      opacity: 0;
      visibility: hidden;
      transition: 0.6s all ease-in-out;
  }
  
  .carousel__nav {
      position: absolute;
      right: 0;
      z-index: 2;
      background-color: #fff;
    bottom: 0;
  }
  
  .carousel__icon {
      display: inline-block;
      vertical-align: middle;
      width: 16px;
    fill: #5d5d5d;
  }
  
  .carousel__arrow {
      cursor: pointer;
      display: inline-block;
      padding: 11px 15px;
      position: relative;
  }
  
  .carousel__arrow:nth-child(1):after {
      content:'';
      right: -3px;
      position: absolute;
      width: 1px;
      background-color: #b0b0b0;
      height: 14px;
      top: 50%;
      margin-top: -7px;
  }
  
  .active{
     z-index: 1;
    display: flex;
    visibility:visible;
  }
  
  .active .carousel-item__subtitle, .active .carousel-item__title, .active .carousel-item__description,.active .carousel-item__btn{
      transform: translateY(0);
      opacity: 1;
        transition: 0.6s all ease-in-out;
      visibility: visible;
  }
  
  
  
  .active .carousel-item__image{ 
      transition: 0.6s all ease-in-out;
      transform: translateX(0);
  }
  
  
    
  
  
    /* PRODUCTS PAGE */
  
  
  
    .products-body-section {
      background-image: url(../../images/page-background-image-1.jpg);
      background-repeat: repeat-y;
      background-size: cover;
  
    }
  
    .products-body-container {
        max-width: 80vw;
        margin: auto;
    }
  
    .products-body-left-filter-inner-container,
    .products-body-left-filter-inner-container,
    .products-body-left-filter-inner-container,
    .products-body-left-filter-inner-container,
    .products-body-left-filter-inner-container,
    .products-body-left-filter-inner-container {
      display: flex;
      flex-direction: column;
      text-align: center;
      cursor: pointer;
      margin: 50px auto;
    }
  
    .products-body-left-filter-container {
      display: grid;
      grid-template-columns: 1fr 1fr 1fr 1fr;
    }
  
    .products-body-main-products-container {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
      margin-top: 5vh;
    }
  
    .products-body-main-inner-container {
      margin: 15px;
      border: none;
      border-radius: 10px;
      box-shadow: 9px 9px 16px rgb(163 177 198 / 51%), -9px -9px 16px rgb(255 255 255 / 64%);
      padding: 10px;
      transition: 0.4s ease-in-out;
      max-width: 500px;
    }
  
    .products-buttons-container {
      display: flex;
      justify-content: space-evenly;
      margin-bottom: 20px;
    }
  
    .products-buttons-container > a{
      display: flex;
    }
  
    .products-body-main-inner-container > a {
        display: flex;
    }
  
    .products-body-main-inner-container:hover {
      transition: 0.4s ease-in-out;
      transform: translateY(-5px);
      box-shadow: 9px 9px 16px rgb(30 38 50 / 51%), -9px -9px 16px rgb(255 255 255 / 64%);
    }
  
   .products-h3 {
      margin: 0;
      line-height: 40px;
    text-align: center;
    font-size: 36px;
    color: #000000;
    font-family: "Arial", sans-serif;
    letter-spacing: -1px;
    margin-bottom: 15px;
   }
  
    .products-p {
      font-size: 14px;
      line-height: 20px;
      margin: 0;
      text-align: center;
      padding: 0 15px;
    }
  
    #product-model__paragraph {
      font-size: 16px;
    }
  
  
  /* PARALLAX */
  
  
  /* FOOTER */
  
  .footer-top-image {
      width: 100vw;
      padding: 0;
      margin: 0;
      display: flex;
  }
  
  .footer-main-container {
      height: 100px;
    background-color: black;
    display: grid;
    grid-template-columns: 2fr 1fr 1fr;
    padding-left: 10vw;
    padding-right: 10vw;
  }
  
  .footer-rights-container {
    color: #E0E5EC;
    background-color: black;
    padding: 25px 0;
  }
  
  .footer-rights-container p {
    max-width: 80vw;
    text-align: center;
    margin: auto;
    font-size: 16px;
    line-height: 16px;
  }
  
  .logo-footer {
    max-width: 200px;
  }
  
  .footer-main-container {
    color: #E0E5EC;
    padding-bottom: 5px;
    padding-top: 25px;
  }
  
  .footer-main-inner-container > h3 {
    font-size: 20px;
    line-height: 20px;
    margin: 0;
  }
  
  
  /* SUPPORT PAGE */
  
  .support-body-main-products-container{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
  }
  
  .support-body-right-container {
    max-width: 80vw;
    margin: auto;
  }
  
  .support-contact-container {
    max-width: 60vw;
    margin: auto;
  }
  
  .support-products-container {
    display: flex;
    justify-content: center;
    margin: auto;
    padding: 15px
  }
  
  .support-body-main-inner-container {
    margin: 15px 25px;
    border: none;
    border-radius: 10px;
    box-shadow: 9px 9px 16px rgb(163 177 198 / 51%), -9px -9px 16px rgb(255 255 255 / 64%);
    padding: 15px;
  }
  
  .hello {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    padding: 150px 0;
  }
  .hello h6 {
    display: block;
    line-height: 1;
    margin-bottom: 20px;
    font-family: "Fjalla One", sans-serif;
    opacity: 0.5;
    font-size: 14px;
  }
  .hello h2 {
    margin-bottom: 60px;
    font-weight: 800;
    font-size: 60px;
    line-height: 1.2;
    padding-right: 35%;
  }
  .hello h2:before {
    content: attr(data-text);
    font-size: 20vw;
    opacity: 0.05;
    z-index: -1;
    position: absolute;
    left: 0;
    top: -20%;
  }
  .hello address {
    display: block;
    margin-bottom: 50px;
    font-size: 22px;
  }
  .hello address b {
    display: block;
    margin-bottom: 10px;
  }
  .hello #success, .hello #error {
    display: none;
    float: left;
  }
  .hello #contact {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr 1fr;
    margin-left: -100px;
    padding: 40px 20px;
    margin: 15px 25px;
    border: none;
    border-radius: 10px;
    box-shadow: 9px 9px 16px rgb(163 177 198 / 51%), -9px -9px 16px rgb(255 255 255 / 64%);
  }
  
  .hello address > a {
    display: block;
    margin-bottom: 50px;
    font-size: 22px;
    color: black;
  }
  
  .hello address > p {
    display: block;
    margin-bottom: 50px;
    font-size: 22px;
    color: black;
  }
  
  .container {
    width: 100%;
  }
  
  .col-lg-12 {
    width: 100%;
  }
  
  .form-group {
    display: grid;
    padding: 15px;
  }
  
  .row {
    display: flex;
    justify-content: space-between;
  }
  
  input {
    background: transparent;
    border-radius: 15px;
    padding: 15px 0;
    border: 1px solid #b1b1b1;
  }
  
  textarea {
    background: transparent;
    border-radius: 15px;
    padding: 55px 0;
    border: 1px solid #b1b1b1;
  }
  
  .submit-container {
    display: flex;
  }
  
  
  .support-main-container {
    max-width: 80vw;
    margin: auto;
    margin-top: 100px;
  }
  
  .support-driver-inner-container {
    display: flex;
    justify-content: space-evenly;
  }
  
  .support-drivers-inner-inner-container {
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
  }
  
  .support-documents-inner-container {
    display: flex;
    justify-content: space-evenly;
  }
  
  
  /* SUPPORT PAGE STYLE */
  .faq-container {
    max-width: 80vw;
    margin: auto;
    margin-top: 10vh;
  }
  
  
  .container {
    margin: 0 auto;
    padding: 1em;
  }
  
  .accordion .accordion-item {
    border-bottom: 1px solid #e5e5e5;
  }
  .accordion .accordion-item button[aria-expanded='true'] {
    border-bottom: 1px solid #03b5d2;
  }
  .accordion button {
    position: relative;
    display: block;
    text-align: left;
    width: 100%;
    padding: 1em 0;
    color: #7288a2;
    font-size: 1.15rem;
    font-weight: 400;
    border: none;
    background: none;
    outline: none;
  }
  .accordion button:hover, .accordion button:focus {
    cursor: pointer;
    color: #03b5d2;
  }
  .accordion button:hover::after, .accordion button:focus::after {
    cursor: pointer;
    color: #03b5d2;
    border: 1px solid #03b5d2;
  }
  .accordion button .accordion-title {
    padding: 1em 1.5em 1em 0;
  }
  .accordion button .icon {
    display: inline-block;
    position: absolute;
    top: 18px;
    right: 0;
    width: 22px;
    height: 22px;
    border: 1px solid;
    border-radius: 22px;
  }
  .accordion button .icon::before {
    display: block;
    position: absolute;
    content: '';
    top: 9px;
    left: 5px;
    width: 10px;
    height: 2px;
    background: currentColor;
  }
  .accordion button .icon::after {
    display: block;
    position: absolute;
    content: '';
    top: 5px;
    left: 9px;
    width: 2px;
    height: 10px;
    background: currentColor;
  }
  .accordion button[aria-expanded='true'] {
    color: #03b5d2;
  }
  .accordion button[aria-expanded='true'] .icon::after {
    width: 0;
  }
  .accordion button[aria-expanded='true'] + .accordion-content {
    opacity: 1;
    max-height: 500px;
    -webkit-transition: all 200ms linear;
    transition: all 200ms linear;
    will-change: opacity, max-height;
  }
  .accordion .accordion-content {
    opacity: 0;
    max-height: 0;
    overflow: hidden;
    -webkit-transition: opacity 200ms linear, max-height 200ms linear;
    transition: opacity 200ms linear, max-height 200ms linear;
    will-change: opacity, max-height;
  }
  .accordion .accordion-content p {
    font-size: 1rem;
    font-weight: 300;
    margin: 2em 0;
  }
  
  .accordion button .accordion-title {
    
  }
  
  .support-drivers-outer-container {
    display: none;
  }
  
  .support-documents-container {
    height: 45vh;
  }
  
  .support-body-container {
    display: none;
  }
  
  /* NEUMORPHIC BUTTONS DESIGN */
  
  body {
      background-color: #E0E5EC;
      margin: 0;
  }
    
  .neumorphic-button {
    background-color: #E0E5EC;
    border: none;
    border-radius: 6px;
    box-shadow: 9px 9px 16px rgb(163 177 198 / 51%), -9px -9px 16px rgb(255 255 255 / 64%);
    color: #4D3252;
    font-weight: 700;
    height: 45px;
    overflow: hidden;
    position: relative;
    text-transform: uppercase;
    width: 145px;
    margin: auto;
    margin-bottom: 15px;
    transition: 0.3s ease-in-out;
  }
  
  .neumorphic-button:hover {
    transition: 0.3s ease-in-out;
    transform: translateY(-5px);
    box-shadow: 9px 9px 16px rgb(74 83 97 / 51%), -9px -9px 16px rgb(255 255 255 / 64%);
    cursor: pointer;
  }
  
  .buy-button {
    background-color: rgb(99, 120, 241);
    color: white;
  }
    
    button:after {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      width: 200%;
      height: 100%;
      opacity: 0;
      transform: translateX(-100%);
      
      background: rgba(255, 255, 255, 0.13);
      background: linear-gradient(
        to right, 
        rgba(255, 255, 255, 0.13) 0%,
        rgba(255, 255, 255, 0.13) 77%,
        rgba(255, 255, 255, 0.5) 92%,
        rgba(255, 255, 255, 0.3) 100%
      );
    }
    
    button:hover:after {
      opacity: 1;
      top: 0;
      left: 0;
      transform: translateX(0);
      transition-property: transform, opacity;
      transition-duration: 0.7s, 0.15s;
      transition-timing-function: ease;
    }
    
    button:active:after {
        opacity: 0;
    }
  
    #contact-row {
      display: block;
    }




  .edge-banner-container {
    max-width: 1650px;
    margin: auto;
  }
  
  
    /* Mobile And Tablet Resizing */
  @media only screen and (max-width: 1400px){
    .products-body-container {
      max-width: 90vw;
    }
  
    .product-colors-image-container {
      max-width: 100vw;
    }
  }
  
  @media only screen and (max-width: 1270px){
  
    .product-inner-box-container {
      max-width: 100vw;
    }
  
    .products-body-container {
      max-width: 80vw;
    }
  
    .products-body-main-products-container {
      grid-template-columns: 1fr 1fr;
    }
  
    #windows-3rd-item  {
      display: none;
    }
  
    .product-colors-image-container {
      grid-template-columns: 1fr;
      max-width: 80vw;
    }
  
    .product-colors-image-inner-container {
      max-width: 800px;
    }
  
    .home-laptops-info-container {
      margin: 3vh;
    }
  
    .product-inner-boxt-right-container {
      display: grid;
      grid-template-columns: 1fr 1fr 1fr 1fr;
      column-gap: 25px;
    }
  
    .product-colors-inner-container {
      min-width: auto;
    }
  
    .product-colors-inner-container {
      flex-direction: column;
      padding: 5px 15px;
    }
  
  }
  
  @media only screen and (max-width: 1100px){
  
    .home-laptops-info-body-container button {
      margin-top: 15px;
      margin-bottom: 15px;
    }
  
    .product-top-image-inner-container {
      max-width: 80vw;
      margin: auto;
    }
  
    .home-laptops-info-h2-container > h2 {
      font-size: 40px;
      margin-top: 0;
    }
  
    .home-laptops-info-container {
      margin: 1vh;
    }
  
  }
  
  @media only screen and (max-width: 1000px){
  
    p {
      line-height: 14px;
    }
  
    .product-main-container {
      max-width: 80vw;
      margin: auto;
      grid-template-columns: 1fr;
      height: auto;
    }
  
    .product-main-inner-info-container {
      max-width: 600px;
      margin: auto;
      padding: 55px;
      margin-bottom: 55px;
      display: grid;
      grid-template-columns: 1fr 1fr;
      grid-column-gap: 25px;
    }
  
    .product-main-inner-info-container > h3 {
      line-height: 20px;
    }
  
    .product-specs-top-container {
      max-width: 80vw;
    }
  
    .product-inner-boxt-right-container, .product-inner-boxt-left-container {
      margin: 25px;
    }
  
    .home-lifestyle-h3 {
      font-size: 40px;
    }
  
    .product-specs-header-container {
      max-width: 90vw;
    }
  
    .product-top-image-inner-container {
      max-width: 100vw;
    }
  
    .product-techspecs-h3-container p {
      line-height: 20px;
    }
  
    .support-body-main-products-container {
      grid-template-columns: 1fr 1fr;
    }
  
  }
  
  
  @media only screen and (max-width: 900px){
  
    h1 {
      font-size: 2em;
    }
  
    .product-specs-header-container > h4 {
      font-size: 16px;
    }
  
    .product-top-image-container {
      grid-template-columns: 1fr;
    }
  
    .products-body-container {
      max-width: 94vw;
    }
  
    .product-main-top-info-container {
      max-width: 60vw;
    }
  
    .hello #contact {
      grid-template-columns: 1fr;
    }
  
    .product-specs-top-container {
      grid-template-columns: 1fr;
    }
  
    .product-inner-box-container {
      max-width: 80vw;
      margin: auto;
    }
  
    .product-ports-section {
      grid-template-columns: 1fr;
      max-width: 80vw;
    }
  
    .row {
      display: block;
    }
  
    .hello address,
    .hello address > p,
    .hello address > a {
      margin-bottom: 15px;
    }
  
    .product-techspecs-h3-container {
      padding-top: 3vh;
      padding-bottom: 3vh;
    }
  
  }
  
  @media only screen and (max-width: 830px){
  
    .products-body-left-filter-container {
      margin-top: 80px;
    }
  
    .products-body-main-products-container {
      grid-template-columns: 1fr;
    }
  
    .products-body-container {
      max-width: 70vw;
    }
  
    .product-inner-box-container {
      grid-template-columns: 1fr;
    }
  
    .home-gateway-logo {
      max-width: 60vw;
    }
  
  }
  
  @media only screen and (max-width: 800px){
  
    .menu-container {
      display: none;
    }
  
    #menu-bar {
      display: block;
    }
  
  
  
    .home-mozaic-lifestyle-1-2-container {
      grid-template-columns: 1fr;
    }
  
    .home-mozaic-lifestyle-1-2-container > .home-mozaic-lifestyle-full-container {
      display: none;
    }
  
    .home-laptops-container {
      display: flex;
      flex-direction: column-reverse;
      max-width: 90vw;
      margin: auto
    }
  
    .home-tablets-container {
      display: flex;
      flex-direction: column;
      max-width: 90vw;
      margin: auto
    }
  
    .product-colors-inner-container  {
      min-width: auto;
    }
  
    .product-colors-image-container {
      grid-template-columns: 1fr;
      max-width: 92vw;
      margin: auto;
    }
  
    .product-main-top-info-container {
      max-width: 80vw;
    }
  
    .product-techspecs-h3-container > h3 {
      font-size: 30px;
    }

    .edge-banner-container {
      margin-top: 100px;
    }
    
  
  }
  
  
  @media only screen and (max-width: 700px){
  
  .product-inner-boxt-right-container {
    padding: 15px;
    margin: auto;
  }
  
  /* .product-main-feature {
    font-size: 3em;
  } */
  
  }
  
  @media only screen and (max-width: 550px){
  
    h1 {
      font-size: 1.4em;
    }
  
    .products-body-container {
      max-width: 94vw;
    }
  
    .products-body-left-filter-container {
      grid-template-columns: 1fr 1fr;
    }
  
    .product-main-feature {
      font-size: 3em;
    }
  
    .product-inner-boxt-right-container {
      column-gap: 15px;
    }
  
    .support-body-main-products-container {
      grid-template-columns: 1fr;
    }
  
  }
  
  @media only screen and (max-width: 450px){
  
    .products-buttons-container {
      grid-template-columns: 1fr;
    }
  
    .neumorphic-button {
      margin-top: 5px;
      margin-bottom: 10px
    }
  
    .products-body-main-inner-container {
      padding: 0;
    }
  }
  
  
  
  /* ANIMATIONS CODE */
  .home-gateway-logo {
    /* opacity: 0; */
  }
  
  
  #home-main-logo {
    z-index: 10;
    animation: fade-in 3s ease-in;
  }
  
  @keyframes fade-in {
    from { opacity: 0;}
  }
  
  
  @keyframes scrollLeft {
    from {
      left: -100%
    }
    to {
      left: 0
    }
  }
  
  @keyframes scrollTop {
    from {
      top: -100%
    }
    to {
      top: 0
    }
  }
  
  #top-image-1 {
    /* animation: scrollLeft 2s ease-in 2s; */
  }
  
  #top-image-2 {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 100;
    /* animation: scrollTop 2s ease-in; */
  }
  
  /* new content */
  
  