/** 1em = 16px **/
/*2056px*/
@media(max-width: 128.5em){
  .choose-section ul{grid-template-columns: repeat(3, 1fr);}
  .category-section{margin-top:60rem;}
  /**SHOP**/
  .productResults{grid-template-columns:repeat(3, 1fr);}
}
/**1920px**/
@media(max-width: 120em){
    /****SHIRTS PRINT***/
  .front .canvas-container,
  .front .lower-canvas,
  .front .upper-canvas,
  .front .canvas-container,
  .back .lower-canvas,
  .back .upper-canvas,
  .back .canvas-container,
  .both .lower-canvas,
  .both .upper-canvas,
  .both .classfront,
  .both .classback
  {
    max-width: 900px!important;
    max-height: 900px!important;
  }
  
  .canvas_side{
    left: 25.5rem!important;
    top: -25rem!important;       
  }
  
  .tpPanel{align-items: center;}
  .tpPanel button i{font-size: 1.3rem;}
  .tpPanel div{ font-size: 1rem;}

  .leftPanel{width: 400px;}
  .panelLinks{width: 80px;}
  .aside-link img{
    width: 30px;
    height: 30px;
  }
  .aside-lk_tx{font-size: 12px;}
  .panelContent{
    width: 300px;
    height: 540px;
    right: 0rem;
    padding: 10px;
  }
  .panelContent h4{
    font-size: 1.8rem;
    padding: 10px;
  }
  .radioBtn label{
    margin: 0;
    padding: 0;
    align-items: center;
    font-size: 1.3rem;
  }
  .radioBtn label small{font-size: 100%;}
  #resetBtn{font-size: 1.3rem;}

  #colorType li{
    width: 40px;
    height: 40px;
  }

  .uploads{
    font-size: 1.3rem;
    align-items: center;
  }

  .filter{
    grid-template-columns: 70px 1fr;
    gap: 5px;
  }
  .graphics .hero label,
  .uploads_imgs .hero label{
    width: 60px!important;
    height: 60px!important;
  }
  .form-input-group{
    margin-left: 0;
  }
  .form-input-group label{
    font-size: 8px;
    width: 100%;
  }
  .form-input-group label:before{
    margin-right: 3px;
  }

  .panelContent .page-link{font-size: 1rem;}
}
/**1840px**/
@media(max-width: 115em){
  .shop-section,{
    grid-template-columns: 300px 1fr;
    margin-left: 15rem;
    margin-right: 15rem;
  }
  /**ACCOUNT**/
  .account_section{
    grid-template-columns: 300px 1fr!important;
    margin-left: 5rem!important;
    margin-right: 5rem!important;      
  }
}
/*1750px*/
@media (max-width: 109.375em){
  .gallery-item-1,
  .gallery-item-7 {
    display: none;
  }
  /**CART**/
  .cart-container{
    padding-right: 15px;
    padding-left: 15px;
  }
}
/*1618px*/
@media(max-width: 101.125em){
  .category-section{padding: 0px 4.8rem;}
}
/*1548px*/
@media(max-width: 96.75em){
  .category-section{height:100%; gap:0}
  .slides {display: none;}
  .slides.actives {display: block;}
  .slider-service-controller {
    display: block;
    margin-top: 2rem;
  }
  .slider-service-controller button {
    border: 1px solid var(--black);
    background: var(--black);
  }
  #services{height: 100%;}
  /**SHOP**/
  .shop-section{
    margin-left: 10rem;
    margin-right: 10rem;
  }
}
/*1382px*/
@media (max-width: 86.375em){
  .gallery-item-2,
  .gallery-item-6 {
    display: none;
  }
  
  /**SHOP**/
  .productResults{grid-template-columns:repeat(2, 1fr);}
  .shop-section{
    margin-left: 5rem;
    margin-right: 5rem;
  }
  /**ACCOUNT**/
  .account_section{grid-template-columns: 200px 1fr!important;}
  /**CART**/
  .commerce{grid-template-columns: 1fr!important;}
}
/*1300px*/
@media(max-width: 81.25em){
  .choose-section{position:relative; top:0;}
  .category-section{margin-top:5rem;}
}
/*1200px */
@media (max-width: 75em){
  /***HEADER***/
  .header,
  .bg-container {
    display: none;
  }
  .mobile-bg-container {
    display: block;
  }
  .mobile-header {
    background-color: var(--black);
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: absolute;
    padding: 0 2.8rem;
    top: 0;
    z-index: 9999;
  }
  /**SECTIONS**/
  .category-section{padding:0 15px;}
  .home-section{
    padding-right: 15px;
    padding-left: 15px;
  }
  /**CART**/
  .cart-container{
    min-height: 60vh;
  }
  .cartHead{padding-top:11rem;}
  /**SHOP**/
  .shop-section,
  .account_section{
    margin-top: 0!important;
    padding-top: 12rem;
  }
  /**ACCOUNT**/
    .account_section{
      margin-left: 15px!important;
      margin-right: 15px!important;    
    }  
 
}
/*1136px*/
@media (max-width: 71em){
  .gallery-item-3,
  .gallery-item-5 {
    display: none;
  }
  /**ACCOUNT**/
  .navPanel .form-group-input-2{grid-template-columns: repeat(1, 1fr);}
}
/*1000px -- mobile*/
@media(max-width: 62.5em){
  .svg-icons{
    height: 180px;
    width: 180px;    
   }
   /**HEADER**/
  .main-menu__link{font-size:5rem;}
  .open-button{
    width:45px;
    height:45px;
  }
  .open-button.open span:nth-child(1) {
    transform: rotate(45deg);
    top: -7px;
    left: 5px;
   }
  .open-button.open span:nth-child(3) {
    transform: rotate(-45deg);
    top: 24px;
    left: 4px;
   }
   /**HOME**/
  .slides.actives {
    width: 100% !important;
    height: 100% !important;
  }
  .choose-section ul {grid-template-columns: repeat(2, 1fr);}
  .choose-section li strong{font-size:2.8rem;}
  .home-section h3,
  .category-section h3{font-size:4.5rem;}
  #services{margin-top:2rem;}
  .slider-service-controller button{
    width:80px;
    height:80px;
    font-size:1.6rem;
  }
  .gallery-controls{margin-top: 30rem;}
  .gallery-controls button{font-size:3.6rem;}
  .gallery-products{
    margin-top: 30rem;
    margin-bottom: 5rem;
  }
  .gallery-product-container{width:100%;}
  .gallery-item {
    width: 100%;
    height:1000px;
    background-position: center!important;
    background-size: cover!important;
  }
  /**LOGIN**/
  .auth_container{
    height: 87vh;
    min-height: 87vh;
  }
  /**ACCOUNT**/
  .aside_links h1{font-size:3.3rem;}
  .aside_links h3{font-size:2.3rem;line-height:1.8;}
  .sub_aside_links li{line-height:5.5!important;}
  .sub_aside_links span{font-size:2rem!important;}
  .navPanel h1{font-size:2.6rem}
  .navPanel p{font-size:2rem}
  .uploads_imgs {grid-template-columns:repeat(2, 1fr)!important;}
  #uploads_imgs .hero label{
    height:200px!important;
    width:200px!important;
  }
  .page-item{font-size:3rem;}
  .searchOrder{
    max-width:100%!important;
    padding: 0.8em 0.45em!important;
    font-size:2rem!important;
  }
  .searchOrder input{width:90%!important;}
  .button-login, .button-bel-op{
    font-size:2.5rem;
    color:#000!important;
  }
  /**SHOP**/
  .shop-section{
    margin-left: 25px;
    margin-right: 25px;
  }
  .productResults{grid-template-columns:repeat(1, 1fr);gap:3rem;}
  .searchBox{font-size:2.5rem;}
  .filter_lab{font-size:3rem;}
  .form-group-check label{font-size:2rem;}
  .heart{font-size:3.5rem;}
  .text-muted{font-size:3rem;}
  /**CART**/
  .commerce table.shop_table th{font-size:2rem;}
  .cart-item td{font-size:1.8rem}
  .slidetext{font-size:1.8rem;}
  .amount{font-size:1.8rem}
  .update_cart, .Checkout-button{font-size:2.5rem;color:#000!important;}
  #update-modal .modal-transition{
    width:50%!important;
    left:66%!important;
  }
  #update-modal .modal-header h3{font-size:2.3rem;}
  .uploads{font-size:2.5rem!important;}
  /**CHECKOUT**/
  .checkout-container {
    padding-left: 25px;
    padding-right: 25px;
    padding-top: 13rem;
    padding-bottom: 4rem;
    margin-bottom: 0;
  }
  .product-details h3{font-size:2rem!important}
  .product-details{
    display:flex;
    flex-direction:column;
    justify-content:center;
  }
  /**T-SHIRT**/
  #starting-modal .modal-transition{
    left:19%!important;
    width:95%!important;
    height:33%!important;
  }
  .shirt{height:100vh;}
  /*--top panel--*/
  .topPanel{top:9rem;}
  .tpPanel{gap:2rem}
  .tpPanel button i{
    font-size: 2.4rem;
    color:#000!important;
  }
  .tpPanel div{
    display:flex;
    flex-direction:column;
    justify-content: center;
    align-items: center;    
  }
  /*--left panel--*/
  .leftPanel{
    width:-webkit-fill-available;
    margin-right: 25px;
    top: 17rem;
  }
  .panelLinks{width:100px;}
  .leftPanel a{width: -webkit-fill-available;}
  .aside-link img {
    width: 50px;
    height: 50px;
  }
  .aside-lk_tx{font-size:1.6rem;}
  .panelContent{
    width:800px;
    height:670px;
  }
  .panelContent h4{font-size:2.8rem;}
  .panelContent .radioBtn label{font-size:2.3rem;}
  /*--right panel--*/
  .rightPanel{
    top: 87rem;
    flex-direction: row;
  }
  /*--color--*/
  #colorType li{
    width: 80px;
    height: 80px;    
  }
  /*--graphics--*/
  .panelContent .filter{grid-template-columns: 150px 1fr;}
  .filter p{
    font-size:3rem;
    margin-bottom: 2rem!important;  
  }
  #filtering .form-input-group{margin-bottom:2rem!important;}
  #filtering label{font-size:2rem!important;}
  .graphics{margin-bottom:1.3rem!important;}
  .graphics .hero label{
    width:100px!important;
    height:100px!important;
  }
  .panelContent .page-link{font-size:3rem!important;}
  /*--crop--*/
  #aside-6{
    display:flex;
    justify-content:center;
    align-items:center;
  }
  #aside-6 h4{display:none;}
  #aside-6 #done{
    font-size:2.6rem;
    color:#000!important;
  }
  /*--order--*/
  #order-modal .modal-transition{
    width:98%!important;
    left:17%!important;
  }
  #app{align-items: center;}
  /*--shirt--*/
  #shirt_outline,
  #shirt_outline_back{
    left:0;
    bottom: 0;
  }
  #resetBtn{
    font-size:2.3rem;
    color:#000!important;
  }
  /*--front--*/
  .front .canvas-container{
    top: 52rem!important;
    left: -0.5%!important;
  }
 
  .front .lower-canvas, 
  .front .upper-canvas, 
  .front .canvas-container{
    max-width: 500px !important;
    max-height: 550px !important;
  }
 
  .front .canvas_side{
    top: 32rem!important;
    left: 12rem!important;     
 }
  .front .canvas_side .lower-canvas, 
  .front .canvas_side .upper-canvas, 
  .front .canvas_side{
    max-width: 166px!important;
    max-height: 166px!important;
  }
  /*--back--*/
  .back .canvas-container{
    top: 52rem!important;
    left: -0.5%!important;      
  }
  
  .back .lower-canvas, 
  .back .upper-canvas, 
  .back .canvas-container{
    max-width: 500px !important;
    max-height: 550px !important;    
  }
  
  .back .canvas_side{
    top: 32rem!important;
    left: 12rem!important;      
 }
  .back .canvas_side .lower-canvas, 
  .back .canvas_side .upper-canvas, 
  .back .canvas_side{
    max-width: 166px!important;
    max-height: 166px!important;
  }
  /*--both--*/
  .both .classfront,
  .both .classback{
    top: 52rem!important;
    left: -0.5%!important;      
  }
  
  .both .lower-canvas, 
  .both .upper-canvas, 
  .both .classfront, 
  .both .classback{
    max-width: 500px !important;
    max-height: 550px !important; 
  }
  
  .both .canvas_side{
    top: 32rem!important;
    left: 12rem!important;        
  }
  
  .both .canvas_side .lower-canvas, 
  .both .canvas_side .upper-canvas, 
  .both .canvas_side {
    max-width: 166px !important;
    max-height: 166px !important; 
  } 
  /**FOOTER**/
  .grid--footer {grid-template-columns: 1.5fr;gap:6rem}
  .flex-foot {align-items: start !important;}
  .copyright {text-align: start;}
  .footer-heading span {text-align: start !important;}    
  .footer-heading,
  .footer-heading span{font-size:3.6rem;}
  .footer-link,
  .time,
  .copyright{font-size:3rem!important;}
  .social-links{gap:4.4rem}
  .social-icon i{font-size:4rem;}
}


/*999px*/
/*910px*/
@media(max-width: 56.875em){
  /**CART**/
  .commerce table.shop_table th{font-size:1.3rem;}
}
/*770px*/
@media(max-width: 48.125em){
  /***FOOTER***/
  .grid--footer {grid-template-columns: 1.5fr;}
  .flex-foot {align-items: start !important;}
  .copyright {text-align: start;}
  .footer-heading span {text-align: start !important;}    
}
/*745px*/
@media(max-width: 46.5625em){
  .choose-section li strong{font-size:1.3rem;}
  .gallery-product-container { width: 100%;}
  .gallery-controls{margin-top: 5rem;}
  .gallery-item {
    width: 100%;
    background-position: center !important;
    background-size: cover !important;
  }
}
/*640px*/
@media(max-width: 40em){
  .choose-section ul{grid-template-columns: repeat(2, 1fr);}
  /**SHOP**/
  .shop-section{grid-template-columns: repeat(1, 1fr);}
  /**LOGIN**/
  .wrapper{width:480px;}
}
/*545px*/
@media(max-width: 34.0625em){
  .details p,
  .details a {
    display: none;
  }
  .details {
    bottom: 0;
    padding: 1.8rem;
  }
  .details h5 {
    text-shadow: 0 0 7px rgb(0 0 0 / 79%);
  }
}