@import url('https://fonts.googleapis.com/css2?family=Onest:wght@100..900&display=swap');



 body {
     font-family: sans-serif;

 }


 /*dashboard--css------------------*/
 /* New Code edit dashboard.................................. */
 .profile-side:hover .drop-file {
     display: flex;
 }

 .right-sideBaar {
     position: fixed;
     background: #212121;
     min-width: 250px;
     min-height: 88vh;

 }

 .right-sideBaar a {
     text-decoration: none;
 }


 @media (max-width:500px) {
     .right-sideBaar {
         /* display: block; */
         position: absolute;
         right: 0;
         width: 100%;
     }
 }

 @media (max-width:900px) {
     .left-sideBaar {
         display: none;
         /* position: absolute; */

     }

     .right-sideBaar {
         display: none;
         position: absolute;
         right: 2%;
     }

     /* New Code edit dashboard end.................................. */


     /*end-----------------*/


     .filters p {
         font-size: 16px;
         line-height: 20px;
         font-family: sans-serif;
         padding: 15px 16px;
         color: rgb(255, 255, 255);
         font-weight: bold;


     }

     .line {
         border-radius: 8px 8px 0px 0px;
         border-bottom: 1px solid rgba(255, 255, 255, 0.1);

     }

     .filter2 {
         font-size: 16px !important;
         line-height: 20px;
         font-family: sans-serif;
         padding: 10px 10px;
         color: rgb(255, 255, 255);
         font-weight: bold;
     }

     .filter3 {
         font-size: 16px;
         line-height: 20px;
         font-family: sans-serif;
         padding: 0px 10px;
         color: rgb(255, 255, 255);
     }

     .fxEkVX {
         display: flex;
         font-size: 15px;
         flex-direction: row;
         -webkit-box-align: center;
         align-items: center;
         border-radius: 8px;
         -webkit-box-pack: start;
         justify-content: flex-start;
         padding: 0px 12px;
         background: rgb(33, 33, 33);
         color: white;
     }

     .iAtoxP {
         height: 20px;
         width: 20px;
         vertical-align: middle;
         margin: 0px;
         position: relative;
         display: inline-block;
         mask-image: url(./search\ \(1\).png);
         mask-repeat: no-repeat;
         mask-position: center center;
         mask-size: contain;
         background: rgb(255, 255, 255);
     }



     .check {
         position: relative;
         width: 18px;
         height: 20px;
         cursor: pointer;
         box-sizing: border-box;
         display: inline-block;
         vertical-align: middle;
         border-radius: 3px;
         background-color: rgb(72, 133, 255) !important;


     }

     .check2 {
         font-family: sans-serif;
         font-style: normal;
         cursor: pointer;
         margin-left: 8px;
         line-height: 19px;
         font-family: Onest-Bold;
         color: rgb(255, 255, 255);
         padding-top: 2px;
     }

     .hegkeN {
         display: flex;
         width: 100%;
         -webkit-box-pack: justify;
         justify-content: space-between;
         -webkit-box-align: center;
         align-items: center;
         color: rgb(255, 255, 255);
     }

     .cHdhhe {
         background: 0% 0% no-repeat padding-box padding-box rgb(33, 33, 33);
         color: rgb(255, 255, 255);
         width: 30px;
         border-radius: 4px;
         padding: 8px 10px;
         flex: 1 1 0%;
         height: 32px;
         max-width: 111px;
         font-size: 14px;
         border: none !important;
     }

     .drop {
         background-color: transparent !important;
         border: none;
         ;

     }

     .drop option {
         background-color: transparent !important;
     }

     .jklWSR {
         list-style: none;
         margin-bottom: 16px;
         padding: 0px;
         max-height: 500px;
         overflow: hidden scroll;
     }

     .cvgAno {
         font-size: 14px;
         line-height: 18px;
         font-family: Onest-Bold;
         color: rgb(255, 255, 255);
         width: fit-content;
     }

     .jUuZgX {
         visibility: hidden;
         position: absolute;
         top: 0px;
         left: 0px;
     }

     button,
     input,
     optgroup,
     select,
     textarea {
         font-family: inherit;
         font-feature-settings: inherit;
         font-variation-settings: inherit;
         font-size: 100%;
         font-weight: inherit;
         line-height: inherit;
         color: inherit;
         margin: 0;
         padding: 0;
     }

     .fLmhGp {
         position: relative;
         width: 20px;
         height: 20px;
         cursor: pointer;
         background-color: rgb(33, 33, 33);
         box-sizing: border-box;
         display: inline-block;
         vertical-align: middle;
         border-radius: 3px;
     }



     /* gyani */
     .gyani {
         display: flex;
         width: 100%;
     }

     /* Sidebar */
     .sidebar {
         width: 250px;
         background-color: rgb(22, 22, 22);
         ;
         /* padding: 20px */
         /* border-right: 1px solid #333; */
     }

     .side-bar {
         margin-bottom: 20px;
         color: white;
     }

     h3 {
         font-size: 14px;
         color: gray;
         margin-bottom: 8px;
     }

     /* Price Range */
     .price-range {
         display: flex;
         align-items: center;
         gap: 8px;
     }

     .price-range input {
         width: 60px;
         padding: 5px;
         background: rgb(22, 22, 22);
         ;
         color: white;
         border: 1px solid rgb(22, 22, 22);
         text-align: center;
     }

     /* Dropdown Button */
     .dropdown-btn {
         display: flex;
         justify-content: space-between;
         align-items: center;
         width: 100%;
         text-align: left;
         padding: 10px;
         background: none;
         color: white;
         border: none;
         cursor: pointer;
         font-size: 16px;
     }

     /* Dropdown Arrow */
     .arrow {
         transition: transform 0.3s ease;
     }

     /* Rotate Arrow When Active */
     .dropdown-btn.active .arrow {
         transform: rotate(180deg);
     }

     /* Dropdown Content */
     .dropdown-content {
         display: none;
         padding: 10px;
         background-color: rgb(22, 22, 22);
         ;
         border: 1px solid rgb(22, 22, 22);
         ;
         margin-top: 5px;
     }

     .dropdown-content input[type="text"] {
         width: 100%;
         padding: 5px;
         background: rgb(22, 22, 22);
         ;
         color: white;
         border: 1px solid rgb(22, 22, 22);
         ;
         margin-bottom: 8px;
     }


     input {
         margin-right: 5px;
     }

     /* Main No Products side-bar */


     .icon {
         font-size: 50px;
         margin-bottom: 10px;
     }

     .dropdown-content input p {
         font-style: normal;
         cursor: pointer;
         margin-left: 8px;
         line-height: 19px;
         font-family: Onest-Bold;
         color: rgb(255, 255, 255);
     }



     /* side--------------------right- */







     .iLaPlk {
         width: 100%;
         padding: 12px;
         border-radius: 8px;
         display: grid;
         grid-template-columns: repeat(5, 1fr);
         gap: 12px;
         margin: 0px 0px 16px;
     }

     .jNykfj {
         border-radius: 8px;
         cursor: pointer;
         background: rgb(29, 43, 92);
         padding: 13px;
         display: grid;
         place-content: center;
         font-size: 18px;
         line-height: 22px;
         font-family: sans-serif;
         transition: 0.3s;
         color: rgb(53, 157, 255);
         text-decoration: none;
         list-style: none;
         text-align: right !important;
         font-family: sans-serif;
         font-weight: bold !important;
     }

     .cmbtpk {
         border-radius: 8px;
         cursor: pointer;
         background: rgb(33, 33, 33);
         padding: 13px;
         display: grid;
         place-content: center;
         font-size: 18px;
         line-height: 22px;
         font-family: sans-serif;
         transition: 0.3s;
         color: rgb(255, 255, 255);
         text-decoration: none;
         list-style: none;
         font-family: sans-serif;
         font-weight: bold !important;
     }

     .side2 {
         display: flex;
         justify-content: space-between;
         background-color: rgb(22, 22, 22);
         ;
         border-radius: 10px;
         padding: 16px 24px;
     }


     /* cards==================== */
     .fzibSQ {
         font-size: 15px;
         color: white;
         font-weight: bold;
         /*font-family:Onest-semibold;*/
     }

     .gHbVLB {
         font-size: 15px;
         color: rgb(72, 189, 255);
         text-transform: uppercase;
         height: 1%;

         margin-bottom: 8px;
         font-weight: bold;
         padding: 0px 0px !important;

     }


     .kiskSm {
         display: flex;
         -webkit-box-align: center;
         align-items: center;
         border: 1px solid rgb(156, 96, 234);
         background: rgba(156, 96, 234, 0.133);
         height: 32px;
         width: 100%;
         border-radius: 4px;
         padding: 8px;
         gap: 6px;
         margin-bottom: 8px;
     }

     .cRrinc {
         height: 32px;
         width: 16px;
         display: flex;
         -webkit-box-align: center;
         align-items: center;
     }

     .lbQBKK {
         font-size: 15px;
         color: rgb(255, 255, 255);
         font-weight: bold;
     }

     .exfluz {
         font-size: 15px;
         color: rgb(143, 143, 143);
         margin-bottom: 2px;
     }

     .kFdgOQ {
         font-size: 24px;
         color: rgb(255, 255, 255);
         font-weight: bold;
         font-family: Onest-semibold;
     }


     .ftIAsn {
         height: 30px;
         width: 50px;
         background: rgb(218, 14, 62);
         display: flex;
         -webkit-box-pack: center;
         justify-content: center;
         -webkit-box-align: center;
         align-items: center;
         border-radius: 4px;
         font-size: 18px;
         color: rgb(255, 255, 255);
         font-weight: bold !important;
         font-family: Onest-semibold;

     }





     @media (max-width: 767px) {
         .iLaPlk {
             border-radius: 0px;
             padding: 12px 16px;
             max-width: 100vh;
             overflow: auto;
             margin-bottom: 16px;
             display: grid;
         }

         .iLaPlk {
             width: 100%;
             padding: 12px;
             border-radius: 8px;
             display: grid;
             grid-template-columns: repeat(5, 1fr);
             gap: 12px;
             margin: 0px 0px 16px;
         }
     }

     .results-founds {
         background-color: rgb(22, 22, 22);
         ;
         padding: 15px 40px !important;
         color: white;
         border-radius: 10px;
         display: flex !important;
         justify-content: space-between !important;
     }

     /* section==================end---------------------------- */

     /* headeer--------------------- */

     .navbar-brand {
         font-size: 20px;
     }

     .form-control {
         background: #222;
         border: 1px solid #444;
         color: white;
         height: 5vh !important;
         border-radius: 10px !important;
     }

     .form-control::placeholder {
         color: #aaa;
     }

     .input-group-text {
         border: none;
     }

     .btn-outline-secondary {
         color: white;
         border-color: #666;
     }

     .btn-outline-secondary:hover {
         background: #444;
         color: white;
     }

     .form-check-input {
         background: rgb(22, 22, 22);
         ;
         border: none;
     }

     .cart {
         background: transparent;
         border: none;
         width: 50px;
     }

     .cart img {
         width: 100%;
     }

     .me-3 {

         .butt {
             font-size: 30px;
         }

         display: flex;
         justify-content: center;
         align-items: center;
     }

     .tran button {
         border: none;
     }

     .searchh {
         width: 40px;
         border-radius: 10px 0px px 0px !important;

     }

     .searchh img {
         width: 100%;
     }


     .right {
         display: flex;
         justify-content: space-between;
         gap: 10px;
     }

     .hFIFMP {
         display: flex !important;

         align-items: center !important;
         background: none !important;
         color: white !important;
         padding: 5px !important;
         cursor: pointer;


         -webkit-box-align: center;
         align-items: center;
         -webkit-box-pack: center;
         justify-content: center;
         border-radius: 8px;
         padding: 5px 10px;
         height: 48px;
         font-size: 14px;
         line-height: 0.875rem;
         font-family: Onest-Bold !important;
         font-weight: bold;
         color: rgb(255, 255, 255);
         transition: 0.3s;
         background-color: rgb(22, 22, 22) !important;
         border: none;
     }

     .hFIFMP:hover {
         background-color: #555 !important;
     }

     .kSxJPJ {
         display: flex;
         height: 16px;
         width: 24px;
         position: relative;
         -webkit-box-align: center;
         align-items: center;
         -webkit-box-pack: center;
         justify-content: center;
     }

     .but {
         padding: 10px 40px;
         background-color: #444;
         border-radius: 10px;
         border: none;

     }

     .but:hover {
         background-color: #555;
     }

     .but a {
         text-decoration: none;
         color: white;
         font-weight: bold;
         font-size: 17px !important;
         font-family: Onest-Bold;


     }

     .but a:hover {
         color: white;
     }

     .butt {
         padding: 10px 40px;
         background-color: rgb(72, 133, 255);
         border-radius: 10px;

     }

     .butt a {
         text-decoration: none;
         color: white;
         font-weight: bold;
         font-size: 17px !important;
         font-family: Onest-Bold;


     }

     .butt a:hover {
         color: white;
     }

     @media(max-width:1200px) {
         .but {
             padding: 0px 16px;
             background-color: rgb(22, 22, 22);
             ;
             border-radius: 10px;

         }

         .but a {
             text-decoration: none;
             color: white;
             font-weight: bold;
             font-size: 10px !important;
             font-family: Onest-Bold;


         }

         .but a:hover {
             color: white;
         }

         .butt {
             padding: 0px 16px;
             background-color: rgb(72, 133, 255);
             border-radius: 10px;

         }

         .butt a {
             text-decoration: none;
             color: white;
             font-weight: bold;
             font-size: 15px !important;
             font-family: Onest-Bold;


         }

         .butt a:hover {
             color: white;
         }
     }

     .head {
         display: flex;
         justify-content: space-between;
         align-items: center;

     }


     .nav-2 {
         display: flex;
         gap: 30px !important;
         padding: 10px 20px !important;
         border-bottom: 1px solid rgb(22, 22, 22);
         ;
         flex-wrap: wrap;


     }

     .nav-2 a {
         text-decoration: none;
         color: white;
         font-size: 15px !important;
         font-weight: bold;
         list-style: none;
         font-family: Onest-Medium, Inter, sans-serif;


     }

     .nav-2 li {
         list-style: none;
     }

     .nav-2 a:hover {
         text-decoration: none;
         color: white;
         font-size: 17px !important;
         font-weight: bold;
         list-style: none;

     }

     /* end-----header------------- */

     .containerss {
         display: flex;
         flex-wrap: wrap;
         gap: 15px !important;
         /* justify-content: center; */

     }

     .card {
         background-color: black !important;
         width: 200px;
         /* padding: 20px; */
         border-radius: 10px;
         box-shadow: 0px !important;
         /* text-align: center; */
         transition: transform 0.3s ease-in-out;
         border-radius: 10px !important;
         border: 2px solid rgb(22, 22, 22) !important
     }



     .card h3 {
         font-size: 1.2rem;
         margin-bottom: 10px;
     }

     .card p {
         font-size: 1rem;
         color: #555;
     }

     /* STORE CARD------MEDIA QUERY-------------------- */
     @media(max-width:600px) {
         .fzibSQ {
             font-size: 12px !important;
             color: white;
             font-weight: bold;
             font-family: sans-serif !important;
         }

         .lbQBKK {
             font-size: 10px !important;
             color: rgb(255, 255, 255);
             font-weight: bold;
         }

         .kFdgOQ {
             font-size: 16px !important;
             color: rgb(255, 255, 255);
             font-weight: bold;
         }

         .cmbtpk {
             border-radius: 8px;
             cursor: pointer;
             background: rgb(33, 33, 33);
             padding: 10px !important;
             display: grid;
             place-content: center;
             font-size: 14px !important;
             line-height: 22px;
             font-family: sans-serif;
             transition: 0.3s;
             color: rgb(255, 255, 255);
             text-decoration: none;
             list-style: none;
             font-weight: bold !important
         }

         .jNykfj {
             border-radius: 8px;
             cursor: pointer;
             background: rgb(29, 43, 92);
             padding: 10px !important;
             display: grid;
             place-content: center;
             font-size: 16px !important;
             line-height: 15px !important;
             font-family: Onest-Bold;
             transition: 0.3s;
             color: rgb(53, 157, 255);
             text-decoration: none;
             list-style: none;
             text-align: right !important;
             font-family: sans-serif;
             font-weight: bold !important
         }

     }
 }

 /* ----------------------END------------------ */



 @media (max-width: 1200px) {
     .card {
         width: 100%;
     }
 }

 @media (max-width: 768px) {
     .card {
         width: 100%;
     }

     .left {
         display: none;
     }

     .lefts {
         padding: 0px !important;
     }

     .leftt {
         padding: 0px !important;
     }
 }

 @media (max-width: 480px) {
     .card {
         width: 100%;
     }
 }



 /* ---------------------------topup -----------------page */

 .eduSQZ {
     min-height: 504px;
     position: relative;
     display: flex;
     -webkit-box-pack: center;
     justify-content: center;
     -webkit-box-align: center;
     align-items: center;
     gap: 24px;
     max-width: 1960px;
     margin: 0px auto;
     padding: 0px 16px;
     max-height: 504px;
     background-color: rgb(12, 12, 12);
     overflow: hidden;
 }

 .eHJpCq {
     display: flex;
     flex-direction: column;
     gap: 8px;
     position: absolute;
     height: 679px;
     width: 1208px;
     top: 0px;
     left: -400px;
 }

 .eQfNqC {
     display: flex;
     flex-direction: column;
     gap: 8px;
     z-index: 1;
 }

 .erjyyN {
     font-size: 50px;
     text-align: center;
     color: rgb(173, 60, 249);
     margin: 0px;
     padding: 0px;
     font-size: Onest-Bold;
 }

 .iALlda {
     font-size: 55px !important;
     color: rgb(255, 255, 255);
     margin: 0px;
     padding: 0px;
     text-align: center;
 }

 .gvdNAe {
     margin: 0px auto;
     padding: 0px;
     font-size: 18px !important;
     color: rgb(143, 143, 143);
     max-width: 330px;
     text-align: center;
     font-style: Onest-Medium;
 }

 .hrGNps {
     display: flex;
     flex-direction: column;
     gap: 8px;
     position: absolute;
     width: 750px;
     height: 996px;
     transform: rotate(-5deg);
     top: -100px;
     right: -150px;
 }


 .top-up h1 {
     font-size: 30px;
     padding-top: 30px;
     font-family: Onest-Bold;
     font-weight: bold;
     color: white;
 }

 .searches input {
     border-radius: 8px;
     background-color: rgb(33, 33, 33);
     border: 1px solid rgb(53, 53, 53) !important;
     padding: 12px 16px !important;
     display: flex;
     gap: 8px;
     flex-direction: row;
     height: 48px;
 }

 .YkDAI input {
     border: none;
     outline: none;
     background-color: transparent;
     color: rgb(255, 255, 255);
     /* font-size:20px !important; */
     width: 100%;
 }

 .kYfuTm {
     padding: 0px 16px;
     display: flex;
     flex-direction: column;
     gap: 24px;
     max-width: 1332px;
     margin: 0px auto;
 }

 .cWKNCA {
     padding: 0px;
     margin: 0px;
     font: 1.75rem / 2rem Onest-Bold;
     color: rgb(255, 255, 255);
 }

 .YkDAI {
     border-radius: 8px;
     background-color: rgb(33, 33, 33);
     border: 1px solid rgb(53, 53, 53);
     padding: 12px 16px;
     display: flex;
     gap: 8px;
     flex-direction: row;
     height: 48px;
 }

 .fTlHjr {
     height: 24px;
     width: 24px;
     vertical-align: middle;
     margin: 0px;
     position: relative;
     display: inline-block;
     mask-image: url(/icons/search-24.svg);
     mask-repeat: no-repeat;
     mask-position: center center;
     mask-size: contain;
     background: rgb(255, 255, 255);
 }

 .YkDAI input {
     border: none;
     outline: none;
     background-color: transparent;
     color: rgb(255, 255, 255);
     font: 1rem / 1.5rem Onest-Medium;
     width: 100%;
 }

 .grRFEG {
     display: grid;
     grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
     gap: 24px;
     -webkit-box-align: center;
     align-items: center;
     text-decoration: none !important;
 }

 .jrdaGq {
     display: flex;
     flex-direction: column;
     gap: 8px;
     height: 100%;
 }

 .gAGXyu {
     display: flex;
     flex-direction: column;
     gap: 16px;
     border-radius: 8px;
     width: 100%;
     height: 100%;
     overflow: hidden;
     background: rgb(22, 22, 22);
     border: 1px solid rgb(53, 53, 53);
 }

 .tUklh {
     flex: 0 1 336px;
     position: relative;
     display: flex;
     -webkit-box-align: center;
     align-items: center;
     -webkit-box-pack: center;
     justify-content: center;
 }

 .fxwNDQ {
     position: relative;
     display: flex;
     flex-direction: column;
     gap: 8px;
     flex: 1 1 0%;
     padding: 0px 12px 12px;
     align-items: flex-start;
     -webkit-box-pack: start;
     justify-content: flex-start;
 }

 .dwAMfH {
     /* -webkit-line-clamp: 2; */
     text-overflow: ellipsis;
     overflow: hidden;
     font-size: 16px;
     display: -webkit-box;
     -webkit-box-orient: vertical;
     min-height: 40px;
     color: rgb(255, 255, 255);
     font-weight: bold;

 }

 .ipnREx {
     display: flex;
     gap: 4px;
     font-size: 15px;
     font-weight: bold;
     color: rgb(53, 157, 255);
     text-transform: uppercase;
     text-decoration: none !important;
 }

 .gAGXyu:hover {
     background-color: #222;

 }

 @media (max-width: 1024px) {
     .eduSQZ {
         max-height: 212px;
         min-height: 212px;
     }
 }

 @media (max-width: 1440px) {
     .eduSQZ {
         flex-direction: column;
         gap: 16px;
         max-height: 504px;
         -webkit-box-align: center;
         align-items: center;
         -webkit-box-pack: center;
         justify-content: center;
     }
 }

 @media (max-width: 1023px) {
     .eHJpCq {
         position: absolute;
         left: -150px;
         top: 0px;
         height: 220px;
         width: 400px;
     }
 }

 @media (max-width: 1023px) {
     .gvdNAe {
         font-size: 10px;
         max-width: 330px;
         font-family: Onest-Medium;
         ;
     }
 }

 .gvdNAe {
     margin: 0px auto;
     padding: 0px;
     font: 10px Onest-Medium;
     color: rgb(143, 143, 143);
     max-width: 330px;
     text-align: center;
 }

 @media (max-width: 1023px) {
     .hrGNps {
         position: absolute;
         right: -60px;
         top: 0px;
         height: 340px;
         width: 280px;
     }
 }

 @media (max-width: 1440px) {
     .hrGNps {
         right: -250px;
     }
 }

 @media(max-width:1200px) {
     .iALlda {
         font-size: 29px !important;
         color: rgb(255, 255, 255);
         margin: 0px;
         padding: 0px;
         text-align: center;
     }

     .erjyyN {
         font-size: 10px;
         text-align: center;
         color: rgb(173, 60, 249);
         margin: 0px;
         padding: 0px;
         font-size: Onest-Bold;
     }
 }

 /* -------------------------new ----slider--------------------------- */


 .owl-item {
     width: 128.906px;
     margin-right: 10px;
 }


 /** to hide dots

.owl-theme .owl-dots .owl-dot{ display:none!important;}

**/
 .div-slide h2 {
     font-size: 22px !important;
     font-weight: bold !important;
     color: white;
     text-align: center;
     font-family: Onest-Medium;
     ;
 }

 .div-slide p {
     font-size: 15px !important;
     /* font-weight: bold !important; */
     color: grey;
     text-align: center;
     font-family: Onest-Medium;
     ;

 }

 .item img {
     border-radius: 8px;
 }

 /* end----------- top=======up */


 /* start------------plus----------pgae=============== */

 .cfzjiB {
     display: flex;
     -webkit-box-align: center;
     align-items: center;
     -webkit-box-pack: center;
     justify-content: center;
     flex-flow: wrap;
     gap: 40px;
     margin: 20px auto 88px;
     z-index: 1;
 }

 .eCJrja {
     position: relative;
 }

 .bZmUQT {
     display: flex;
     flex-direction: column;
     position: relative;
     border-radius: 16px;
     padding: 16px;
     border: 1.5px solid rgb(159, 98, 235);
     background-color: rgba(46, 28, 97, 0.2);
     max-width: 324px;
     transition: transform 250ms;
     overflow: hidden;
 }

 .jesIDg h1 {
     margin: 12px 0px 0px;
     padding: 0px;
     font-size: 25px !important;
     color: rgb(255, 255, 255);
     text-align: center;
     font-family: omen bold;
     ;
 }

 .echPNB {
     height: 1.5px;
     width: 70%;
     margin: 16px auto;
     background: linear-gradient(90deg, rgba(158, 96, 236, 0) 0%, rgb(158, 96, 236) 50%, rgba(158, 96, 236, 0) 100%);
 }

 .kEjibA {
     display: flex;
     flex-direction: column;
     gap: 8px;
 }

 .kJkWQK {
     max-width: 324px;
     display: flex;
     gap: 12px;
     -webkit-box-align: center;
     align-items: center;
     margin-bottom: 20px;
 }

 .ehicew {
     height: 20px;
     width: 20px;
     vertical-align: middle;
     margin: 0px;
     position: relative;
     display: inline-block;
     background-image: url(./tick.svg);
     background-repeat: no-repeat;
     background-position: center center;
     background-size: contain;
 }

 .kJkWQK p {
     font: 1.7rem Onest-Medium !important;
     color: rgb(255, 255, 255);
     font-family: Onest-Medium !important;
 }

 .kJkWQK {
     max-width: 324px;
     display: flex;
     gap: 12px;
     -webkit-box-align: center;
     align-items: center;
     margin-bottom: 20px;
 }

 .ejwKyb {
     height: 1px;
     width: 100%;
     background: rgba(159, 98, 235, 0.29);
 }

 .eqpckB {
     display: flex;
     flex-direction: column;
     -webkit-box-align: center;
     align-items: center;
     gap: 4px;
     margin: 16px 0px;
 }

 .gzUWht {
     font: 3rem Onest-Bold !important;
     color: rgb(255, 255, 255);
 }

 .gzUWht s {
     color: rgb(129, 129, 129);
     font: 2rem Onest-Medium !important;
     margin-right: 8px;
 }

 .gzUWht span {
     padding-left: 6px;
     font: 2rem Onest-Bold;
     color: rgb(255, 255, 255);
     font-family: bold;
 }

 .YrEEg {
     display: flex;
     font: 1.5rem Onest-Medium !important;
     color: rgb(154, 154, 154);
     text-align: center;
 }

 .jrdHRG {
     display: flex;
     -webkit-box-align: center;
     align-items: center;
     place-content: center;
     cursor: pointer;
     border-radius: 8px;
     font-size: 2.2rem !important;
     line-height: 1rem;
     font-family: Onest-Bold;
     border: none;
     background: rgb(255, 255, 255);
     color: rgb(0, 0, 0);
     padding: 16px;
     gap: 8px;
     opacity: 1;
 }

 .eCJrja {
     position: relative;
 }

 .AxUrt {
     display: flex;
     position: absolute;
     height: 32px;
     -webkit-box-align: center;
     align-items: center;
     top: -16px;
     right: 32px;
     font: 1.4rem Onest-Bold !important;
     text-transform: uppercase;
     color: rgb(255, 255, 255);
     border: 1.5px solid rgb(158, 96, 236);
     background: linear-gradient(104.04deg, rgb(174, 47, 234) 0%, rgb(104, 0, 207) 100%);
     border-radius: 16px;
     padding: 8px 16px;
     width: fit-content;
     z-index: 1;
 }

 .bZmUQT {
     display: flex;
     flex-direction: column;
     position: relative;
     border-radius: 16px;
     padding: 16px;
     border: 1.5px solid rgb(159, 98, 235);
     background-color: rgba(46, 28, 97, 0.2);
     max-width: 324px;
     transition: transform 250ms !important;
     overflow: hidden;
 }

 .jesIDg h1 {
     margin: 12px 0px 0px;
     padding: 0px;
     font: 1.5rem / 1.75rem Onest-Bold;
     color: rgb(255, 255, 255);
     text-align: center;
 }

 .echPNB {
     height: 1.5px;
     width: 70%;
     margin: 16px auto;
     background: linear-gradient(90deg, rgba(158, 96, 236, 0) 0%, rgb(158, 96, 236) 50%, rgba(158, 96, 236, 0) 100%);
 }

 .kEjibA {
     display: flex;
     flex-direction: column;
     gap: 8px;
 }

 .kJkWQK {
     max-width: 324px;
     display: flex;
     gap: 12px;
     -webkit-box-align: center;
     align-items: center;
     margin-bottom: 20px;
 }

 .kJkWQK p {
     font: 0.875rem / 1.125rem Onest-Medium;
     color: rgb(255, 255, 255);
 }

 .ejwKyb {
     height: 1px;
     width: 100%;
     background: rgba(159, 98, 235, 0.29);
 }

 .eqpckB {
     display: flex;
     flex-direction: column;
     -webkit-box-align: center;
     align-items: center;
     gap: 4px;
     margin: 16px 0px;
 }

 .jrdHRG {
     display: flex;
     -webkit-box-align: center;
     align-items: center;
     place-content: center;
     cursor: pointer;
     border-radius: 8px;
     font-size: 1rem;
     line-height: 1rem;
     font-family: Onest-Bold;
     border: none;
     background: rgb(255, 255, 255);
     color: rgb(0, 0, 0);
     padding: 16px;
     gap: 8px;
     opacity: 1;
 }

 .eCJrja {
     position: relative;
 }

 .hTRmoF {
     display: flex;
     position: absolute;
     height: 32px;
     -webkit-box-align: center;
     align-items: center;
     top: -16px;
     right: 32px;
     font: 1.4rem Onest-Bold;
     text-transform: uppercase;
     color: rgb(255, 255, 255);
     border: 1.5px solid rgb(255, 227, 79);
     background: linear-gradient(104.04deg, rgb(230, 193, 2) 0%, rgb(182, 153, 0) 100%);
     border-radius: 16px;
     padding: 8px 16px;
     width: fit-content;
     z-index: 1;
 }

 .fyillp {
     display: flex;
     flex-direction: column;
     position: relative;
     border-radius: 16px;
     padding: 16px;
     border: 1.5px solid rgb(255, 227, 79);
     background-color: rgba(255, 227, 79, 0.1);
     max-width: 324px;
     transition: transform 250ms;
     overflow: hidden;
 }

 .gcPKch {
     height: 1.5px;
     width: 70%;
     margin: 16px auto;
     background: linear-gradient(90deg, rgba(255, 227, 79, 0) 0%, rgb(255, 227, 79) 50%, rgba(255, 227, 79, 0) 100%);
 }

 .ktNzxh {
     height: 20px;
     width: 20px;
     vertical-align: middle;
     margin: 0px;
     position: relative;
     display: inline-block;
     background-image: url(./tick.svg);
     background-repeat: no-repeat;
     background-position: center center;
     background-size: contain;
 }

 .fyillp {
     display: flex;
     flex-direction: column;
     position: relative;
     border-radius: 16px;
     padding: 16px;
     border: 1.5px solid rgb(255, 227, 79);
     background-color: rgba(255, 227, 79, 0.1);
     max-width: 324px;
     transition: transform 250ms;
     overflow: hidden;
 }

 .bbbAhq {
     display: flex;
     flex-direction: column;
     padding: 0px 0px 100px;
     overflow: hidden;
     background: rgb(12, 12, 12);
 }

 .fplNOV {
     display: block;
 }

 .czhDez {
     height: 1px;
     width: 100%;
     background: rgba(255, 227, 79, 0.29);
 }

 .eHHmy {
     margin: 48px auto 40px;
     z-index: 1;
     padding: 0px 32px;
 }

 .eHHmy p {
     font: 2rem Onest-Semibold;
     color: rgb(225, 225, 225);
     text-align: center;
 }

 .haBbGL {
     display: flex;
     margin-top: 64px;
     z-index: 1;
 }







 .cd {
     font-size: 14px;
     color: white;
     /* padding:10px 500px 4px 40px; */
     /* padding:0px 100px; */
 }

 .giCONi {
     display: flex;
     flex-direction: column;
     -webkit-box-align: center;
     align-items: center;
     /* margin: 180px auto 0px; */
     gap: 80px;
     width: 100%;
     padding: 0px 16px;
 }


 .fzYTOt {
     font-size: 45px;
     color: rgb(255, 255, 255);

     text-align: center !important;
     /*font-family: Onest-Bold;*/
     font-weight: bold;
 }

 .iXEdKY {
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 40px;
     -webkit-box-align: center;
     align-items: center;
     -webkit-box-pack: center;
     justify-content: center;
     margin: 0px auto 88px;
     max-width: 936px;
     width: 100%;
 }

 .iXEdKY {
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 40px;
     -webkit-box-align: center;
     align-items: center;
     -webkit-box-pack: center;
     justify-content: center;
     margin: 0px auto 88px;
     max-width: 936px;
     width: 100%;
 }

 .fENnpA {
     display: flex;
     flex-direction: row;
     place-content: center;
     -webkit-box-align: center;
     align-items: center;
     -webkit-box-pack: center;
     gap: 12px;
     max-width: 478px;
     padding: 16px;
     border-radius: 16px;
     border: 1px solid rgb(53, 53, 53);
     background-color: rgb(23, 23, 23);
     width: 100%;
 }

 .bLrLzr {
     display: flex;
     flex-direction: column;
     gap: 8px;
     width: 100%;
     flex: 1 1 0%;
 }

 .bLrLzr h3 {
     color: white;
     font-family: Onest-Bold;
     font-weight: bold;
 }

 .bLrLzr p {
     color: grey;
     font-weight: bold;
 }















 /* faq------------------------------ */

 .haiKdN {
     display: flex;
     flex-direction: column;
     gap: 24px;
     margin: 0px auto;
     min-height: 382px;
     width: 100%;
     overflow: hidden;
     padding: 160px 16px;
 }

 .frNwMy {
     max-width: 1132px;
     margin: 0px auto;
 }

 .frNwMy h2 {
     font-size: 45px;
     margin: 0px;
     color: rgb(255, 255, 255);
     text-align: center;
     /*font-family:Onest-Bold ;*/
     font-weight: bold;
 }

 .fzqpUX {
     margin-top: 52px;
 }

 .fzqpUX>div:first-of-type {
     padding-top: 0px;
 }

 @media (max-width: 767px) {
     .frNwMy h2 {
         font-size: 30px Onest-Bold;
         margin: 0px;
         text-align: center;
     }
 }




 .faq {
     max-width: 100%;
     margin: auto;
 }

 .faq-item {
     border-bottom: 1px solid grey;
     padding: 25px 0;
     color: white;
     font-family: Onest-Medium;
     font-weight: bold;

 }

 .faq-question {
     display: flex;
     justify-content: space-between;
     align-items: center;
     cursor: pointer;
     font-size: 17px;
 }

 .faq-answer {
     display: none;
     padding-top: 10px;
     font-size: 16px;
     color: grey;
 }

 .icon {
     font-size: 20px;
     font-weight: bold;
     transition: transform 0.3s ease;
 }

 .active .icon {
     transform: rotate(45deg);
 }

 /* end--------faq========================= */


 /* --------------------assassin =--------------------------------------- */
 .creed h1 {
     font-size: 23px !important;
     color: white;
     font-weight: bold;
     padding: 0px 40px !important;
     /*font-family: Roboto;*/
 }

 .iMGmmf {
     overflow: hidden;
     margin: 16px 0px;
     padding: 16px;
     border-radius: 8px;
     color: rgb(191, 191, 191);
     background: rgb(22, 22, 22);
     min-height: 70vh;
 }

 .iMGmmf p {
     font-size: 18px;
     font-weight: 500;
     padding: 24px;
     font-family: sans-serif !important;
 }

 .containersss {
     display: flex;
     flex-wrap: wrap;
     gap: 20px !important;
     /* justify-content: center; */

 }

 .cardss {
     background-color: black !important;
     width: 240px;
     /* padding: 20px; */
     border-radius: 10px;
     box-shadow: 0px !important;
     /* text-align: center; */
     transition: transform 0.3s ease-in-out;
     border-radius: 10px !important;
     border: 2px solid rgb(22, 22, 22) !important
 }

 .ePoquK p {
     font-size: 18px !important;
     font-weight: 700;
     font-family: Onest-Bold;
     ;
 }


 .ePoquK li {
     font-size: 16px !important;
     font-weight: 600;
     font-family: Onest-Bold;
     ;
 }


 /* ------------------------------------- */


 @media(max-width:900px) {
     .Privacy-Policy {
         padding: 0px !important;
     }

     .nav-2 {
         display: flex;
         gap: 15px !important;
         padding: 10px 20px !important;
         border-bottom: 1px solid rgb(22, 22, 22);
         flex-wrap: wrap;
     }

     .head {
         padding: 0px !important;
     }

     .search {
         display: none;
     }

     .india {
         display: none !important;
     }

     .top-up h1 {
         text-align: center;
     }



 }

 @media(max-width:535px) {
     .containersss {
         display: flex;
         flex-wrap: wrap;
         gap: 20px !important;
         /* justify-content: center; */
         padding-left: 52px;
     }
 }

 /* ------------------------------------- */


 /* product-------page-------------- */





 .main-product {
     display: flex;
     gap: 20px;


 }

 .main-product img {
     width: 20%;
     ;
 }

 .product-2 {
     display: flex;
     gap: 20px;
 }

 .product-1 h2 {
     font-weight: bold;
     color: white;

 }

 .game {
     color: white;
     font-size: 13px;
     font-weight: bold;
     background-color: rgb(85, 57, 204);
     padding: 2px 5px;
     border-radius: 8px;

 }

 .digital {
     color: white;
     font-size: 13px;
     font-weight: bold;
     background-color: #444;
     padding: 3px 8px;
     border-radius: 8px;
 }

 .iZveud {
     height: 20px;
     width: 20px;
     vertical-align: middle;
     margin: 0px;
     position: relative;
     display: inline-block;
     mask-image: url(./images/star.svg);
     mask-repeat: no-repeat;
     mask-position: center center;
     mask-size: contain;
     background: linear-gradient(95.83deg, rgb(255, 204, 0) 3.89%, rgb(221, 134, 0) 97.43%);
 }

 .rate {
     color: white;
     font-size: 15px;
     font-weight: bold;

     padding: 3px 8px;
     border-radius: 8px;

 }


 @media(max-width:900px) {
     .product-1 h2 {
         font-weight: bold;
         color: white;
         font-size: 15px;
     }

     .digital {
         color: white;
         font-size: 9px;
         font-weight: bold;
         background-color: #444;
         padding: 3px 8px;
         border-radius: 8px;
     }

     .game {
         display: none;
     }

     .kjgnrJ {
         display: none !important;
     }

     .main-product img {
         width: 20%;
         height: 120px;
     }

 }

 .kjgnrJ {
     display: grid;
     grid-template-columns: 1fr 1fr;
     width: 100%;
     gap: 24px 8px;
 }

 .cmGWcp {
     -webkit-box-flex: 1;
     flex-grow: 1;
     width: 100%;
     display: flex;
     gap: 12px;
     -webkit-box-align: start;
     align-items: start;
     height: 56px;
 }

 .bpOFqJ {
     height: 56px;
     width: 56px;
     display: flex;
     -webkit-box-align: center;
     align-items: center;
     -webkit-box-pack: center;
     justify-content: center;
     background: rgb(22, 22, 22);
     border-radius: 8px;
     box-shadow: none;
     border: 1px solid rgb(33, 33, 33);
 }

 .jbsGEe {
     color: rgb(28, 197, 76);
     fill: rgb(28, 197, 76);
 }

 .eqTALW {
     flex: 1 1 0%;
     display: flex;
     flex-direction: column;
     -webkit-box-pack: center;
     justify-content: center;
     height: 100%;
     gap: 2px;
     width: 100%;
 }

 .eqTALW p {
     color: rgb(143, 143, 143);
     font-size: 16px !important;
     font-family: Onest-Medium;

 }

 .drGEFU {
     font: 0.875rem / 1.125rem Onest-Medium;
     color: rgb(143, 143, 143);
 }

 .eqTALW {
     flex: 1 1 0%;
     display: flex;
     flex-direction: column;
     -webkit-box-pack: center;
     justify-content: center;
     height: 100%;
     gap: 2px;
     width: 100%;
 }

 .eqTALW p {
     color: rgb(143, 143, 143);
     font: 0.875rem / 1.125rem Onest-Medium;
 }

 .eeaYle {
     color: rgb(53, 157, 255);
     font-size: 14px !important;
     font-family: Onest-SemiBold !important;
     cursor: pointer;
 }

 .dmntpm {
     display: flex;
     flex-direction: row;
     gap: 12px;
     -webkit-box-align: center;
     align-items: center;
 }

 .eheJTJ {
     width: fit-content;
     font-size: 15px !important;
     font-family: Onest-Medium;
     color: rgb(191, 191, 191);
     text-transform: capitalize;
     /* font-weight: bold; */
 }

 .kdXWzF {
     display: flex;
     width: 100%;
 }

 .hjUmlt {
     position: relative;
 }

 .eqcdSs {
     width: 100%;
     height: 40px;
     background: rgb(53, 53, 53);
     border: 1px solid rgb(53, 53, 53);
     box-shadow: none;
     border-radius: 8px;
     padding: 16px;
     font-size: 16px;
     line-height: 20px;
     font-family: Onest-Medium;
     color: rgb(255, 255, 255);
     display: flex;
     -webkit-box-align: center;
     align-items: center;
     -webkit-box-pack: justify;
     justify-content: space-between;
     cursor: pointer;
 }

 .eqcdSs p {
     white-space: nowrap;
     overflow: hidden;
 }

 .cshNyB {
     height: 24px;
     width: 24px;
     vertical-align: middle;
     margin: 0px;
     position: relative;
     display: inline-block;
     mask-image: url(/icons/arrow-down-chevron-24.svg);
     mask-repeat: no-repeat;
     mask-position: center center;
     mask-size: contain;
     background: rgb(255, 255, 255);
 }

 .cshNyB {
     height: 24px;
     width: 24px;
     vertical-align: middle;
     margin: 0px;
     position: relative;
     display: inline-block;
     mask-image: url(./images/arrow.svg);
     mask-repeat: no-repeat;
     mask-position: center center;
     mask-size: contain;
     background: rgb(255, 255, 255);
 }

 .UfCnf {
     font-size: 15px !important;
     font-family: Onest-Medium !important;
     color: rgb(53, 157, 255);
     text-wrap: nowrap;
     cursor: pointer;
 }

 .kSshTU {
     display: grid;
     width: 100%;
     grid-template-columns: repeat(auto-fill, minmax(172px, 1fr));
     gap: 16px;
     -webkit-box-pack: start;
     justify-content: start;
 }

 .bUqzlG {
     border: 2px solid rgb(72, 133, 255);
     overflow: hidden;
     border-radius: 8px;
     box-sizing: border-box;
     min-width: 172px;
     width: 100%;
     cursor: pointer;
     background-color: rgb(22, 22, 22);
     position: relative;
     opacity: 1;
 }

 .eMkEtN {
     display: flex;
     flex-direction: row;
     -webkit-box-align: center;
     align-items: center;
     -webkit-box-pack: justify;
     justify-content: space-between;
     background-color: rgb(33, 33, 33);
     gap: 16px;
     padding: 20px 10px 10px 10px;
     height: 40px;
     width: 100%;
 }

 .kvGeba {
     display: flex;
     flex-direction: row;
     height: 20px;
     width: 20px;
     -webkit-box-pack: center;
     justify-content: center;
     -webkit-box-align: center;
     align-items: center;
 }

 .WDMRP:checked {
     border-color: rgb(72, 133, 255);
 }

 .WDMRP {
     height: 20px;
     width: 20px;
     appearance: none;
     border: 2px solid rgb(68, 68, 68);
     border-radius: 50%;
     outline: none;
     cursor: pointer;
     position: relative;
 }

 .foygqJ {
     min-height: 40px;
     background-color: rgb(22, 22, 22);
     display: flex;
     flex-direction: row;
     -webkit-box-align: center;
     align-items: center;
     padding: 10px;
 }

 .hbQlKl {
     font-size: 20px !important;
     font-family: Onest-Medium;
     color: rgb(255, 255, 255);
 }

 .hbQlKl span {
     font-size: 12px !important;
     font-family: Onest-Medium;
     color: rgb(143, 143, 143);
 }

 .iyNtXj {
     border: 1px solid rgb(33, 33, 33);
     overflow: hidden;
     border-radius: 8px;
     box-sizing: border-box;
     min-width: 172px;
     width: 100%;
     cursor: pointer;
     background-color: rgb(22, 22, 22);
     position: relative;
     opacity: 1;
 }

 .AXrfo {
     color: white !important;
     font-size: 16px !important;
     font-weight: bold;

 }

 .hbQlKl {
     color: white !important;
     font-size: 20px !important;
     font-weight: bold;
 }

 .iyNtXj:hover {
     border: 2px solid rgb(156, 156, 215);

 }

 .bMoEUk {
     padding: 18px;
     background: rgb(22, 22, 22);
     font-size: 14px !important;
     margin: auto auto 10px;
     width: 100%;
     border-radius: 8px;
     box-shadow: none;
     border: 1px solid rgb(33, 33, 33);
     display: flex;
     /* font-family: Onest-Medium; */
     font-weight: 500;
     align-items: flex-start;
     color: rgb(255, 141, 7) !important;
 }

 .kqmpzy {
     color: rgb(255, 141, 7);
     fill: rgb(255, 141, 7);
 }

 .cEYuWo {
     color: rgb(255, 141, 7) !important;
 }

 /* -------------------other-------offer-------------- */
 .other-offer {
     display: flex;
     justify-content: space-between;


 }

 .offer2 {
     display: flex;
     gap: 20px;
 }

 .offer1 {
     display: flex;
     gap: 20px;
 }

 .offer1 img {
     background-color: white;
     border-radius: 50%;
 }

 .Gameralll {
     color: white;
     font-size: 15px;
     font-weight: 600;
     font-family: Onest-Semibold;
 }

 .seller {
     color: grey;
     font-size: 13px;
     font-weight: 600;
     font-family: Onest-Semibold;
 }

 .offer2 h2 {
     font-size: 2.25rem;
     color: white;
     font-weight: 600;
     font-family: Onest-SemiBold;
 }

 .break {
     font-size: 30px;

     color: grey;
 }

 .save {
     font-size: 12px;
     color: blueviolet;
     font-weight: 600;
 }

 .cut {
     font-size: 12px;
     color: grey;
     font-weight: 600;
 }

 .offer2 button {
     background-color: rgb(72, 133, 255);
     padding: 10px 30px;
     border-radius: 10px;
     border: none;

 }

 .offer2 button a {
     color: white;
     text-decoration: none;
     /* font-weight: bold; */
     font-weight: 500;
     font-size: 14px;


 }

 .buy-now {
     padding-top: 18px !important;
 }

 .break {
     padding: 15px;
 }

 .offer1 {
     padding: 12px;
 }

 @media(max-width:900px) {
     .offer1 img {
         display: none;
     }

     .offer2 h2 {
         font-size: 13px;
         color: white;
         font-weight: 600;
     }

     .offer2 button {
         background-color: rgb(72, 133, 255);
         padding: 0px 16px;
         border-radius: 10px;
     }

     .offer2 button a {
         color: white;
         text-decoration: none;
         /* font-weight: bold; */
         font-weight: 500;
         font-size: 12px;
     }

     .save {
         font-size: 8px;
         color: blueviolet;
         font-weight: 600;
     }

     .seller {
         color: grey;
         font-size: 11px;
         font-weight: 600;
     }

     .cut {
         font-size: 11px;
         color: grey;
         font-weight: 600;
     }

     .Gameralll {
         color: white;
         font-size: 12px;
         font-weight: 600;
         font-family: Onest-SemiBold;
     }


     .JQyIm span {
         font-size: 11px !important;
         font-family: Onest-SemiBold;
         color: rgb(28, 197, 76);
     }

     .JQyIm {
         display: flex;
         font-size: 16px !important;
         gap: 8px;
         -webkit-box-align: center;
         align-items: center;
         width: fit-content;
         color: rgb(255, 255, 255);
     }

     .offer2 {
         display: flex;
         gap: 2px;
         justify-content: space-between;
     }

     .UfCnf {
         font-size: 15px !important;
         font-family: Onest-Medium !important;
         color: rgb(53, 157, 255);
         text-wrap: nowrap;
         cursor: pointer;
         display: none;
     }

     .cart button {
         padding: 6px 67px !important;
         background: radial-gradient(100% 100% at 0% 0%, rgba(182, 126, 253, 0.867) 0%, rgba(118, 38, 220, 0.867) 68.08%);
         border: none;
         border-radius: 10px;
     }

     .footer h4 img {
         width: 201px !important;
         height: 4vh;
     }

 }


 @media(max-width: 900px) {
     .search {
         display: contents;
     }

     .search input {
         width: 63% !important;
         padding: 17px 61px !important;
     }
 }


 .logo img {
     width: 55% !important;
 }

 .search input {
     width: 100% !important;
     padding: 25px 20px !important;
 }



 @media(max-width:700px) {
     .logo img {
         width: 20% !important;
     }
 }

 @media(max-width:700px) {
     .logo img {
         width: 90% !important;
     }
 }

 @media(max-width:900px) {


     .main {
         justify-content: space-evenly;
         display: flex;
         gap: 24px;
         flex-wrap: wrap;
     }

     .nav-2 {
         display: flex;
         gap: 11px !important;
         padding: 10px 20px !important;
         border-bottom: 1px solid rgb(22, 22, 22);
         flex-wrap: wrap;
     }
 }

 @media (max-width: 900px) {
     .offer2 button {
         background-color: rgb(72, 133, 255);
         padding: 0px 16px;
         border-radius: 10px;
         display: none;
     }
 }


 /* -------------------------------- */
 .bmuerX {
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 16px;

     .eQgsjs>a>div {
         background: rgb(22, 22, 22);
     }

     .iyJkgP {
         display: flex;
         gap: 16px;
         position: relative;
         cursor: pointer;
         background: rgb(53, 53, 53);
         border: 1px solid rgb(33, 33, 33);
         border-radius: 8px;
         padding: 12px;
         width: 100%;
     }
 }

 .cEIUEG {
     flex: 0 1 auto;
     position: relative;
     display: flex;
     min-width: 100px;
     min-height: 140px;
     gap: 16px;
 }

 .dULvBs {
     display: flex;
     flex-direction: column;

     -webkit-box-pack: justify;
     justify-content: space-between;
     gap: 8px;
 }

 .dLNCAw {
     display: flex;
     flex-direction: column;
     flex: 1 1 0%;
 }

 .fFTqiU {
     font: 0.875rem / 1rem Onest-Medium;
     color: rgb(255, 255, 255);
     display: -webkit-box;

     -webkit-box-orient: vertical;
     overflow: hidden;
     min-height: 28px;
     margin-bottom: 8px;
 }

 .gmnzOy {
     font: 12px / 12px Onest-Regular;
     color: rgb(255, 255, 255);
     padding: 0px 0px 4px;
     max-height: 24px;
     width: fit-content;
     border-radius: 6px;
     gap: 8px;
     -webkit-box-align: center;
     align-items: center;
 }

 .gmnzOy>div {
     -webkit-box-align: center;
     align-items: center;
 }

 .ivDpIR {

     text-overflow: ellipsis;
     overflow: hidden;
     display: -webkit-box;
     font-size: 0.875rem;
     line-height: 1.125rem;
     font-family: Onest-Bold;
     color: rgb(72, 189, 255);
     text-transform: uppercase;
     -webkit-box-orient: vertical;
 }

 .khjUly {
     text-decoration: line-through;
     font: 0.875rem / 1.125rem Onest-Medium;
     color: rgb(143, 143, 143);
     margin-bottom: -8px;
 }

 .fOswVF {
     display: flex;
     flex-direction: row;
     -webkit-box-pack: justify;
     justify-content: space-between;
     -webkit-box-align: center;
     align-items: center;
     gap: 4px;
     font: 1.25rem / 1.5rem Onest-SemiBold;
     color: rgb(255, 255, 255);
 }

 .iwWpsN {
     height: 24px;
     width: 48px;
     background: rgb(218, 14, 62);
     display: flex;
     -webkit-box-pack: center;
     justify-content: center;
     -webkit-box-align: center;
     align-items: center;
     border-radius: 4px;
     font: 0.75rem / 1rem Onest-SemiBold;
     color: rgb(255, 255, 255);
 }

 .red-dead {
     display: flex;
     justify-content: space-between;
 }


 .eYxRVp {
     position: relative;
     padding: 16px 12px;
     width: 100%;
     border: 2px solid rgb(158, 96, 236);
     background: rgb(22, 22, 22);
     border-radius: 8px;
     display: flex;
     flex-direction: column;
     gap: 8px;
 }

 .kmrSNh {
     display: flex;
     flex-direction: row;
     -webkit-box-pack: justify;
     justify-content: space-between;
     width: 100%;
 }

 .eZJaJx {
     display: flex;
     -webkit-box-pack: center;
     justify-content: center;
     -webkit-box-align: center;
     align-items: center;
     gap: 16px;
 }

 .hixXwM {
     display: flex;
     flex-direction: column;
     gap: 4px;
     height: 100%;
     -webkit-box-pack: justify;
     justify-content: space-between;
 }

 .hzEwlm {
     font-size: 16px;
     font-family: Onest-Medium;
     color: rgb(143, 143, 143);
     height: 12px;
     padding-bottom: 10px;
 }

 .JQyIm {
     display: flex;
     font-size: 22px;
     gap: 8px;
     -webkit-box-align: center;
     align-items: center;
     width: fit-content;

     color: rgb(255, 255, 255);

 }

 .eHAmuB {
     display: block;
 }

 .lmPRPP {
     display: flex;
     flex-direction: row;
     gap: 4px;
     width: 100%;
 }

 .JQyIm span {
     font-size: 18px;
     font-family: Onest-SemiBold;
     color: rgb(28, 197, 76);
 }

 .eNxtTt {
     display: flex;
     gap: 16px;
     -webkit-box-pack: start;
     justify-content: flex-start;

 }

 @media(max-width:900px) {
     .eNxtTt {
         display: flex;
         gap: 16px;
         -webkit-box-pack: start;
         justify-content: flex-start;
         display: none !important;
     }
 }

 .kgBLwP {
     display: flex;
     -webkit-box-align: center;
     align-items: center;
     place-content: center;
     cursor: pointer;
     border-radius: 8px;
     font-size: 1.5rem !important;
     line-height: 1rem;
     font-family: Onest-Bold;
     border: none;
     background: rgb(72, 133, 255);
     color: rgb(255, 255, 255);
     padding: 16px;
     gap: 8px;
     opacity: 1;
     width: fit-content;
     height: 40px;
 }

 /* ---------------------------------- */

 .ewMrUv {
     color: rgb(191, 191, 191);
     border: 1px solid rgb(33, 33, 33);
     padding: 20px;
     border-radius: 8px;
     background: rgb(22, 22, 22) !important;
 }

 .ewMrUv span {
     background: rgb(22, 22, 22) !important;
 }

 .ddncFC {

     max-width: 638px;
     text-overflow: ellipsis;
     overflow: hidden;
     font-size: 20px !important;
     font-family: Onest-SemiBold;
     display: -webkit-box;
     -webkit-box-orient: vertical;
     color: rgb(255, 255, 255);
     margin-bottom: 12px;
 }

 .hRzkhi {
     display: flex;
     flex-wrap: wrap;
     row-gap: 8px;
 }

 .kwPSyo {
     background: rgb(33, 33, 33);
     border: none;
     border-radius: 16px;
     padding: 8px 12px;
     color: rgb(250, 249, 246);
     font-size: 20px;
     line-height: 14px;
     font-family: Onest-SemiBold;
     width: fit-content;
     margin-right: 10px;
     max-height: 30px;
     cursor: pointer;
     transition: 0.3s;
 }

 .kwPSyo {
     background: rgb(33, 33, 33);
     border: none;
     border-radius: 16px;
     padding: 8px 12px;
     color: rgb(250, 249, 246);
     font-size: 16px !important;
     line-height: 14px;
     font-family: Onest-SemiBold;
     width: fit-content;
     margin-right: 10px;
     max-height: 30px;
     cursor: pointer;
     transition: 0.3s;
 }

 .jUynzK {
     max-height: 80px;
     overflow: hidden;
     transition: 1s ease-in-out;
     margin-top: 16px;
     position: relative;
     font-size: 14px !important;
     line-height: 20px;
     letter-spacing: 0.1px;
     text-align: justify;
     color: rgb(191, 191, 191) !important;
     font-weight: 700;
 }

 .jUynzK a {
     color: rgb(53, 157, 255) !important;
     cursor: pointer;
 }

 .jUynzK h1,
 .jUynzK h2,
 .jUynzK h3,
 .jUynzK h4,
 .jUynzK strong {
     display: inline;
     color: rgb(255, 255, 255) !important;
 }

 .jUynzK .overlay {
     position: absolute;
     bottom: 0px;
     width: 100%;
     height: 50px;
     background-image: linear-gradient(transparent, rgb(22, 22, 22));
 }

 .iChNmz {
     color: rgb(255, 255, 255);
     font-family: Onest-SemiBold;
     width: fit-content;
     margin-top: 16px;
     text-align: left;
     z-index: 2;
     display: flex;
     -webkit-box-align: end;
     align-items: end;
     font-size: 16px;
     background-color: transparent !important;
     border: none;
 }


 /* --------------------------------------------- */

 .system {
     background: rgb(22, 22, 22);
     padding: 20px;
     border: 1px solid rgb(33, 33, 33);
     border-radius: 8px;
 }

 .sys {
     display: flex;
     -webkit-box-align: center;
     align-items: center;
     gap: 8px;
     margin-bottom: 24px;
 }

 .sys>span {
     font-size: 14px;
     color: rgb(191, 191, 191);
 }

 .sys1 {
     background: rgb(29, 43, 92);
     color: rgb(53, 157, 255);
     font-size: 14px;
     line-height: 14px;
     font-family: Onest-Bold;
     padding: 8px 12px;
     border-radius: 20px;
     text-transform: capitalize;
     cursor: pointer;
 }

 .sys2 {
     font-size: 16px;
     font-family: Onest-Bold;
     color: rgb(255, 255, 255);
 }

 .sys3 {
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 32px 74px;
     padding: 24px 0px 0px;
 }

 .sys4 {
     display: flex;
     gap: 16px;
 }

 .sys5 {
     color: currentcolor;
     fill: currentcolor;
 }

 .hva-DmY {
     font: 1rem / 1.25rem Onest-SemiBold;
     color: rgb(143, 143, 143);
     margin-bottom: 2px;
     text-transform: capitalize;
 }

 .sys6 {
     font: 0.875rem / 1.125rem Onest-Medium;
     color: rgb(255, 255, 255);
 }

 .sys4 {
     display: flex;
     gap: 16px;
 }

 .sys5 {
     color: currentcolor;
     fill: currentcolor;
 }

 .hva-DmY {
     font: 1rem / 1.25rem Onest-SemiBold;

     color: rgb(143, 143, 143);
     margin-bottom: 2px;
     text-transform: capitalize;
 }

 .sys6 p {
     font-size: 18px !important;
     font-family: Onest-Medium;
     color: white !important;
 }

 .sys4 {
     display: flex;
     gap: 16px;
 }

 .sys5 {
     color: white;
     fill: currentcolor;
 }

 .hva-DmY {
     font-size: 18px !important;
     font-family: Onest-SemiBold;
     color: rgb(143, 143, 143);
     margin-bottom: 2px;

     text-transform: capitalize;
 }

 .sys6 {
     font-size: 18px !important;
     font-family: Onest-Medium;
 }


 /* --------------------------- */

 .details {
     background: rgb(22, 22, 22);
     border: 1px solid rgb(33, 33, 33);
     border-radius: 8px;
     padding: 20px;
     display: flex;
     flex-direction: column;
 }

 .details1 {
     list-style: none;
     padding: 0px 0px 24px;
     margin: 0px;
     width: 100%;
     display: flex;
     gap: 32px;
     flex-wrap: wrap;
     border-bottom: 1px solid rgba(255, 255, 255, 0.1);


 }

 .details2 {
     padding: 0px;
     margin: 0px;
     max-width: 144px;
     width: 144px;
 }

 .cqfSfG {
     flex: 1 1 0%;
     color: rgb(143, 143, 143);
     font-family: Onest-Bold;
     font-size: 18px !important;
     margin-bottom: 12px;
     line-height: 20px;
 }

 .hvHYaB {
     flex: 1 1 0%;
     color: rgb(255, 255, 255);
     font-size: 18px !important;
     font-family: Onest-Medium;
 }

 .details2 {
     padding: 0px;
     margin: 0px;
     max-width: 144px;
     width: 144px;
 }

 .cqfSfG {
     flex: 1 1 0%;
     color: rgb(143, 143, 143);
     font-family: Onest-Bold;
     font-size: 16px;
     margin-bottom: 12px;
     line-height: 20px;
 }

 .bjkMXj {
     list-style: none;
     padding-top: 24px;
     padding-bottom: 8px;
     color: rgb(255, 255, 255);
 }

 .cqfSfG {
     flex: 1 1 0%;
     color: rgb(143, 143, 143);
     font-family: Onest-Bold;
     font-size: 16px;
     margin-bottom: 12px;
     line-height: 20px;
 }

 .hvHYaB {
     flex: 1 1 0%;
     color: rgb(255, 255, 255);
     font: 0.875rem / 1.125rem Onest-Medium;
 }


 .containerssss {
     display: flex;
     gap: 5px;
     flex-wrap: wrap;
 }

 .cardsss {
     background-color: black !important;
     width: 180px;
     /* padding: 20px; */
     border-radius: 10px;
     box-shadow: 0px !important;
     /* text-align: center; */
     transition: transform 0.3s ease-in-out;
     border-radius: 10px !important;
     border: 2px solid rgb(22, 22, 22) !important
 }




 /* right------------------side-----------card */

 .forms {
     display: flex;
     gap: 20px;
     justify-content: space-between;


 }

 .form-check-input {
     color: white;
     background-color: white;
 }

 .form-check-label h4 {
     color: white;
     font-weight: 600;
     font-size: 24px;
     font-family: Onest-SemiBold;
     ;
 }

 .formss {
     display: flex;
     gap: 20px;
 }

 .form-check:hover {
     border: 2px solid rgb(157, 96, 234);
     border-radius: 10px;
 }

 .promot {
     text-align: center;
     color: grey;
     font-size: 15px;
     padding: 0px 2px !important;

     ;
 }

 .solid {
     display: flex;
     justify-content: space-between;
 }


 .cart {
     display: flex;
     gap: 20px;
 }

 .cart button {
     padding: 10px 80px;
     background: radial-gradient(100% 100% at 0% 0%, rgba(182, 126, 253, 0.867) 0%, rgba(118, 38, 220, 0.867) 68.08%);
     border: none;
     border-radius: 10px;
     ;
 }

 .cart button a {
     text-decoration: none;
     color: white;
 }

 .cart i {
     font-size: 30px;
     color: white;
     padding-top: 2px;

 }

 .last {
     display: flex;
     justify-content: center;
     gap: 10px;
     padding-top: 10px;
     background: radial-gradient(100% 100% at 0% 0%, rgba(182, 126, 253, 0.867) 0%, rgba(118, 38, 220, 0.867) 68.08%);
     color: white;
     font-size: 10px;
     border-radius: 10px;
 }

 .cut {
     text-decoration: line-through;
     color: gray;
     font-size: 15px;
 }

 @media(max-width:900px) {
     .trand {
         display: none;
     }

     .sys4 {
         display: none;

     }
 }

 .ePoquK p {
     font-size: 16px !important;
     font-weight: 700;
     font-family: sans-serif !important;
     word-spacing: 1px;
 }

 .ePoquK li {
     font-size: 16px !important;
     font-weight: 600;
     font-family: sans-serif !important;
     word-spacing: 1px;
 }

 /* -------------------------------------- */






 .OIBUL {
     display: block;
 }


 .OIBUL {
     /* display: none;
    
    */
     margin: 12px auto auto;
     overflow: hidden;
     background: rgb(12, 12, 12);
 }






 .jayWcN {
     gap: 8px;
 }


 .jayWcN {
     display: flex;
     flex-direction: row;
     gap: 12px;
     overflow: auto;
     padding: 16px;
     scrollbar-width: none;
     flex-wrap: wrap;
 }


 .fZCETe {
     height: 42px;
     min-width: fit-content;
     display: flex;
     -webkit-box-align: center;
     align-items: center;
     -webkit-box-pack: center;
     justify-content: center;
     flex-direction: column;
     padding: 8px 16px;
     background: rgb(22, 22, 22);
     border: 1px solid rgb(53, 53, 53);
     border-radius: 12px;
 }

 .hGGVHw {
     font-size: 13px;
     font-family: Onest-Medium;
     color: rgb(255, 255, 255);
 }


 @media(min-width:900px) {
     .OIBUL {
         display: none !important;
     }



 }

 @media(min-width:900px) {
     .gTEesC {
         display: none !important;
     }
 }




 .gTEesC {
     display: block;
 }

 .gTEesC {
     /* display: none;
 */
     height: 55px;
     width: 100%;
     border-top: 1px solid rgba(255, 255, 255, 0.1);
     background: rgb(22, 22, 22);
     position: fixed;
     bottom: -1px;
     box-shadow: none;
     z-index: 50;
 }

 @media(max-width:575px) {
     .gTEesC {
         /* display: none;
         */
         height: 55px;
         width: 99% !important;
         border-top: 1px solid rgba(255, 255, 255, 0.1);
         background: rgb(22, 22, 22);
         position: fixed;
         bottom: -1px;
         box-shadow: none;
         z-index: 50;
     }

     .search input {
         width: 0% !important;
         padding: 0px 0px !important;
     }
 }

 .jVNgJm {
     justify-content: space-around;
     display: flex;
     max-width: 100%;
     margin: 0px auto;
 }

 .bkrEag {
     width: 72px;
     height: 56px;
     display: grid;
     grid-template-columns: 1fr;
     place-content: center;
     justify-items: center;
     gap: 4px;
     color: rgb(255, 255, 255);
 }

 .iXZOem {
     color: rgb(255, 255, 255);
     fill: rgb(255, 255, 255);
 }

 .iXZOem {
     color: rgb(255, 255, 255);
     fill: rgb(255, 255, 255);
 }

 .jZaOrg {
     width: 72px;
     height: 56px;
     display: grid;
     grid-template-columns: 1fr;
     place-content: center;
     justify-items: center;
     gap: 4px;
     color: rgb(191, 191, 191);
 }

 .gTEesC button {
     background-color: transparent;
     border: none;
 }

 @media(min-width:900px) {
     .trail {
         display: none
     }
 }

 @media(max-width:900px) {
     .trail2 {
         display: none !important;
     }
 }


 /*mobile---slider---------------media--------------*/

 @media(min-width:1200px) {
     .slider-mobile {
         display: none !important;
     }
 }

 @media(max-width:1200px) {
     .slider-desktop {
         display: none !important;
     }
 }

 /* mobile--csss */

 .nav-3 {
     display: flex;
     gap: 0px !important;
     padding: 10px 20px !important;
     border-bottom: 1px solid rgb(22, 22, 22);
     ;
     flex-wrap: wrap;
     flex-direction: column;


 }

 @media(max-width:900px) {
     .nav-2 {
         display: flex;
         gap: 20px !important;
         padding: 10px 20px !important;
         border-bottom: 1px solid rgb(22, 22, 22);
         ;
         flex-wrap: wrap;


     }
 }

 .nav-2 a {
     text-decoration: none;
     color: white;
     font-size: 15px !important;
     font-weight: bold;
     list-style: none;
     font-family: Onest-Medium, Inter, sans-serif;


 }

 .nav-3 a {
     text-decoration: none;
     color: white;
     font-size: 15px !important;
     font-weight: bold;
     list-style: none;
     font-family: Onest-Medium, Inter, sans-serif;


 }

 .nav-2 li {
     list-style: none;
 }

 .nav-2 a:hover {
     text-decoration: none;
     color: white;
     font-size: 17px !important;
     font-weight: bold;
     list-style: none;

 }

 .nav-3 li {
     list-style: none;
 }

 .nav-3 a:hover {
     text-decoration: none;
     color: white;
     font-size: 17px !important;
     font-weight: bold;
     list-style: none;

 }

 #phone-navv {
     /* display: none; */
     /* max-width: 350px; */
     min-width: 300px;
     position: absolute;
     left: -347px;
     top: 70px;
     height: auto;
     z-index: 1;
     overflow: hidden;
     transition: .5s ease;
 }


 /* pop-up form----------------- */

 /* Modal styles */
 .modal {
     display: none;
     position: fixed;
     z-index: 999;
     left: 0;
     top: 0;
     width: 100%;
     height: 100%;
     background-color: rgba(0, 0, 0, 0.5);
 }

 .modal-content {
     background: white;
     width: 100%;
     max-width: 800px;
     margin: 5% auto;
     border-radius: 8px;
     overflow: hidden;
     display: flex;
     flex-direction: column;
 }

 .close {
     align-self: flex-end;
     padding: 5px;
     font-size: 24px;
     cursor: pointer;
 }

 .login-container {
     display: flex;
     flex-direction: row;
 }

 .login-form {
     width: 100%;
     /* padding: 30px; */
     background: rgb(22, 22, 22);
 }

 .login-form h2 {
     margin-bottom: 20px;
 }

 .login-form label {
     display: block;
     margin-top: 10px;
 }

 .login-form input {
     width: 100%;
     padding: 8px;
     margin-top: 5px;
     margin-bottom: 15px;
 }

 .login-form button {
     padbody {
         font-family: Arial, sans-serif;
         /* background: #f0f0f0; */
         padding: 2rem;
     }



     /* Modal styles */
     .modal {
         display: none;
         position: fixed;
         z-index: 999;
         left: 0;
         top: 0;
         width: 100%;
         height: 100%;
         background-color: rgba(0, 0, 0, 0.5);
     }

     .modal-content {
         background: white;
         width: 60%;
         max-width: 800px;
         margin: 5% auto;
         border-radius: 8px;
         overflow: hidden;
         display: flex;
         flex-direction: column;
     }

     .close {
         align-self: flex-end;
         padding: 10px;
         font-size: 24px;
         cursor: pointer;
     }

     .login-container {
         display: flex;
         flex-direction: row;
     }

     .login-form {
         width: 50%;
         padding: 30px;
         background: rgb(22, 22, 22);
     }

     .login-form h2 {
         margin-bottom: 20px;
     }

     .login-form label {
         display: block;
         margin-top: 10px;
     }

     .login-form input {
         width: 100%;
         padding: 8px;
         margin-top: 5px;
         margin-bottom: 15px;
     }

     .login-form button {
         padding: 10px;
         width: 100%;
         background: #007bff;
         color: white;
         border: none;
         cursor: pointer;
     }

     .login-image {
         width: 50%;
         background: #eee;
     }

     .login-image img {
         width: 100%;
         height: 100%;
         object-fit: cover;

         width: 100%;
         background: #007bff;
         color: white;
         border: none;
         cursor: pointer;
     }

     .login-image {
         width: 50%;
         background: #eee;
     }

     .login-image img {
         width: 100%;
         height: 100%;
         object-fit: cover;
     }
 }



 /* left---form--- */
 .login-form1 {
     flex: 1 1 0%;
     background: rgb(22, 22, 22);
     border-radius: 8px 0px 0px 8px;
     padding: 25px;
     max-height: 80vh;
     overflow: scroll;
     width: 100%;
     scrollbar-width: none;
 }

 .login-form2 {
     height: 100%;
 }

 .welcome {
     font: 28px / 29px Onest-Bold !important;
     color: rgb(255, 255, 255);
 }

 .dSZTBo {
     display: flex;
     flex-direction: column;
     gap: 16px;
     margin: 24px 0px;
 }

 .Ohzit {
     cursor: pointer;
     background-color: rgb(22, 22, 22);
     display: flex;
     -webkit-box-align: center;
     align-items: center;
     color: rgb(255, 255, 255);
     border-radius: 8px;
     font-family: Onest-Bold;
     padding: 10px 20px;
     width: 100%;
     height: 48px;
     text-align: center;
     border: 1px solid rgb(33, 33, 33);
 }


 .ecaITa {
     height: 21px;
     width: 21px;
     vertical-align: middle;
     margin: 0px;
     position: relative;
     display: inline-block;
     background-image: url(./images/gogle-icon.svg);
     background-repeat: no-repeat;
     background-position: center center;
     background-size: contain;
 }

 .lcsczw {
     height: 21px;
     width: 21px;
     vertical-align: middle;
     margin: 0px;
     position: relative;
     display: inline-block;
     background-image: url(./images/facebook-icon.svg);
     background-repeat: no-repeat;
     background-position: center center;
     background-size: contain;
 }

 .cDgPNC {
     height: 21px;
     width: 21px;
     vertical-align: middle;
     margin: 0px;
     position: relative;
     display: inline-block;
     background-image: url(./images/game-icon.svg);
     background-repeat: no-repeat;
     background-position: center center;
     background-size: contain;
 }


 .cucwWt {
     height: 21px;
     width: 21px;
     vertical-align: middle;
     margin: 0px;
     position: relative;
     display: inline-block;
     mask-image: url(./images/email-black.svg);
     mask-repeat: no-repeat;
     mask-position: center center;
     mask-size: contain;
     background: rgb(207, 207, 207);
 }

 .welcome1 {
     font-size: 16px;
     margin-left: 24px;
     font-family: Onest-Bold;
     color: inherit;
 }

 .welcome1 span {
     font-family: Onest-Medium;
 }

 .border {
     font: 16px / 19px Onest-Medium !important;
     border-top: 1px solid rgba(255, 255, 255, 0.1);
 }

 .dKJlQN {
     margin: 24px 0px;
 }

 .e-label {
     position: relative;
     font-size: 16px;
     margin-bottom: 24px;
 }

 .emails {
     font: 18px / 22px Onest-Bold !important;
     color: rgb(255, 255, 255);
 }

 .place {
     position: relative;
     margin-top: 8px;
 }

 .ldkItW {
     padding: 8px 10px 10px;
     width: 100%;
     font-size: inherit;
     background: rgb(33, 33, 33);
     color: rgb(255, 255, 255);
     border: 1px solid rgb(33, 33, 33);
     box-sizing: border-box;
     border-radius: 8px;
     outline: none;
 }

 .log {
     display: flex;
     -webkit-box-pack: justify;
     justify-content: space-between;
 }

 .log2 {
     display: flex;
     -webkit-box-align: center;
     align-items: center;
     place-content: center;
     cursor: pointer;
     border-radius: 8px;
     font-size: 1rem;
     line-height: 1rem;
     font-family: Onest-Bold;
     border: none;
     background: rgb(72, 133, 255);
     color: rgb(255, 255, 255);
     padding: 16px;
     gap: 8px;
     opacity: 1;
     width: 120px;
     height: 48px;
 }

 .forget {
     display: flex;
     -webkit-box-align: center;
     align-items: center;
     cursor: pointer;
     color: rgb(255, 255, 255);
 }

 .reg {
     margin-top: 24px;
     padding: 16px 0px;
     border-top: 1px solid rgba(255, 255, 255, 0.1);
     color: rgb(143, 143, 143);
 }

 .reg span {

     cursor: pointer;
     color: rgb(255, 255, 255);
 }


 .login-image {
     flex: 1 1 0%;
     background: rgb(33, 33, 33);
     /* padding: 40px; */
     display: grid;
     place-items: center;
 }

 .login-image img {
     /* padding-top: 150px; */
 }

 @media(max-width:900px) {
     .login-image {
         display: none;
     }
 }


 .modal-content {
     position: relative;
     display: flex;
     flex-direction: column;
     width: 100%;
     pointer-events: auto;
     background-color: rgb(33, 33, 33) !important;
     background-clip: padding-box;
     border: 1px solid rgba(0, 0, 0, .2);
     border-radius: .3rem;
     outline: 0;
     padding: 0px 0px !important;
 }


 .Ohzit:hover {
     background-color: red;
 }

 /* end----pop----form-------------------- */



 /* <!------------------My Css for Mobile Size part----------------------------> */
 /*@media(min-width:900px){*/
 /*    .mobile-mode{*/
 /*    min-height: 100vh;*/
 /*    width: 20% !important;*/
 /*    position: fixed;*/
 /*    top: 5;*/
 /*    left: -200%;*/
 /*    z-index: 9999999;*/
 /*    transition: .5s ease;*/
 /*}*/

 /*}*/

 .mobile-mode {
     min-height: 120vh;
     width: 400px;
     position: fixed;
     top: 0;
     left: -200%;
     z-index: 9999999;
     transition: .5s ease;
 }

 .lolEmogi {
     display: flex;
     justify-content: center;
     flex-direction: column;
 }

 .logo {
     display: flex;
     justify-content: space-between;
     align-items: center;
     gap: 0px;
     padding: 0px 0;
 }

 .left-head {
     display: flex;
     align-items: center;
     gap: 20px;
 }

 .left-head li {

     margin-top: 0;
 }

 .baarBtntoggler {
     text-decoration: none;
     color: white;
     display: none;
 }

 .baarBtntoggler i {
     /* text-decoration: none; */
     font-size: 17px;
     color: white;
     margin-top: -20px;
 }

 .baarBtntoggler i:hover {
     color: white;
 }



 .logo2 {
     display: flex;
     justify-content: space-between;
     align-items: center;
     text-decoration: none;
     border-bottom: 1px solid rgba(255, 255, 255, 0.279);
     width: 100%;
     padding: 10px 20px;
 }


 @media (max-width:500px) {
     .mobile-mode {
         min-height: 120vh;
         width: 100vw;

         position: fixed;
         top: 0;
         left: -200%;
         z-index: 9999999;
         transition: .5s ease;
     }
 }

 .cross-btn a {
     text-decoration: none;
     color: white;
 }

 .cross-btn a i {
     font-size: 20px;
     color: white;
 }

 .but {
     padding: 1px 32px;
     background-color: rgb(33, 33, 33);
     border-radius: 10px;
     border: none;
 }


 /* <!----------------------------- My Profile Page Admin Pannel-----------------------------------> */



 /* <!-----------------------------Profile Page-----------------------------------> */





 .profile-header {
     background: #212121;
     padding: 20px;
     position: sticky;
     top: 0;
     left: 0;
     width: 100%;
     border-bottom: 3px solid #313131;
 }

 .left-nav {
     display: flex;
     align-items: center;
     gap: 20px;
 }

 .right-nav {
     display: flex;
     justify-content: center;
     align-items: center;
     gap: 20px;
 }

 .menu-nav {
     display: none;
 }

 .menu-nav i {
     font-size: 20px;
     color: white;
 }

 .icons-right {
     display: flex;
     align-items: center;
     gap: 20px;
     justify-content: end;
     color: white !important;

 }

 .icons-right i {
     color: white !important;
     font-size: 20px;
     /* padding-left: 20px; */
 }

 .nav-baar {
     display: flex;
     justify-content: space-between;
 }

 .icons-right i:nth-child(3) {
     display: none;
 }

 /* <!-----------------------------Side Baar-----------------------------> */

 /* .main-profile{
    position: relative;
} */

 .sideBaar-area {
     width: 100%;
     display: flex;
     /* position: ; */

 }

 .right-sidebaar {
     padding-left: 270px;
     background: #0C0C0C;
     width: 100%;
     min-height: 88vh;
 }

 .right-sidebaar h1 {
     padding: 20px 10px;
     color: white;
     font-size: 26px;
 }

 .left-sideBaar {
     position: fixed;
     background: #212121;
     min-width: 250px;
     min-height: 88vh;

 }

 .left-sideBaar a {
     text-decoration: none;
 }

 .phone-sideBaar {
     /* display: none; */
     display: none;
     position: absolute;
     background: #212121;
     width: 300px;
     right: 5px;
     min-height: 33vh;
     top: 91px;
     border-radius: 20px;
     border: 1px solid rgba(255, 255, 255, 0.537);
     overflow: hidden;
     z-index: 9999;
     transition: .3s ease;
 }

 .phone-sideBaar a {
     text-decoration: none;
 }

 .profile-side {
     display: flex;
     justify-content: space-between;
     align-items: center;
     padding: 25px 15px;


 }

 .dropdown-profile {
     display: flex;
     justify-content: space-between;
     align-items: center;
     width: 100%;
 }

 .profile-side {
     display: flex;
     justify-content: space-between;
     align-items: center;
     padding: 20px 0;


 }

 .profile-side:hover {
     background: #2C2C2C;
 }

 .profile-side i {
     color: white !important;
     font-size: 20px;
 }


 .profile-icon {
     display: flex;
     gap: 10px;
     align-items: center;
     color: white;
     padding: 0px 20px;
 }

 .profile-icon p {
     /* font: 0.875rem / 1.125rem Onest-SemiBold !important; */
     font-size: 15px;
     font-weight: 400;
     line-height: 18px;
     color: rgb(255, 255, 255);

     /* font-family: Onest-SemiBold;
font-size: 14px;
font-weight: 400;
line-height: 18px;
color: rgb(255, 255, 255); */
 }


 .drop-file {
     display: none;
     flex-direction: column;
     background: #2C2C2C;
     width: 100%;
     /* align-items: center; */
     justify-content: center;
 }

 .drop-file a {
     text-decoration: none;
     color: white;
     font-size: 16px;
     padding: 20px;
     padding-left: 30%;

 }

 .drop-file a:hover {
     background: #645f5f;

 }









 /* .Right-dabba {
    width: 90%;
    max-width: 500px;
  } */

 .profile-card {
     max-width: 700px;
     background: #1e1e1e;
     border-radius: 12px;
     /* padding: 1.5rem; */
     box-shadow: 0 0 10px rgba(0, 0, 0, 0.6);
     border: 1px solid rgba(255, 255, 255, 0.233);
 }

 .profile-picture {
     width: 60px;
     height: 60px;
     background-color: #4caf50;
     color: white;
     font-size: 2rem;
     font-weight: bold;
     display: flex;
     align-items: center;
     justify-content: center;
     border-radius: 8px;
     margin-bottom: 2rem;
     padding: 1.5rem;
     border-bottom: 1px solid rgba(255, 255, 255, 0.233);
 }

 .field {
     margin-bottom: 1.5rem;
     padding: 1.5rem;
     border-bottom: 1px solid rgba(255, 255, 255, 0.233);
 }

 .field:last-child {
     margin-bottom: 1.5rem;
     padding: 1.5rem;
     border-bottom: none;
 }

 .field label {
     display: block;
     margin-bottom: 0.5rem;
     color: #808080;
 }

 .input-group {
     display: flex;
     justify-content: space-between;
     flex-wrap: wrap;
     gap: 0.5rem;
     align-items: center;
 }

 .input-group input {
     flex: 1;
     padding: 1.2rem;
     border: 1px solid #333;
     border-radius: 8px;
     background: #1a1a1a;
     color: white;
     max-width: 400px;
     min-width: 250px;
 }

 .input-group input[readonly] {
     opacity: 0.6;
 }

 .update-btn {
     background: #2d2d2d;
     color: white;
     border: none;
     padding: 12px 30px;
     border-radius: 20px;
     cursor: pointer;
     transition: background 0.2s;
 }

 .update-btn:hover {
     background: #444;
 }

 .badge {
     padding: 0.3rem 0.6rem;
     font-size: 0.8rem;
     border-radius: 5px;
     font-weight: bold;
 }

 .verified {
     background: #2e7d32;
     color: #b9f6ca;
 }

 .not-verified {
     background: #ff8f00;
     color: #fff3e0;
 }

 /* Responsive */
 @media (max-width: 500px) {
     .input-group {
         flex-direction: column;
         align-items: stretch;
     }

     .gyan2 {
         justify-content: center;
         align-items: center;
     }

     .update-btn {
         width: 100%;
     }

     .badge {
         align-self: flex-start;
     }
 }





















 @media (max-width:900px) {
     .left-sideBaar {
         display: none;
         /* position: absolute; */

     }


     .right-sidebaar {
         padding-left: 0;
         background: #0C0C0C;
         width: 100%;
         min-height: 88vh;
         display: flex;
         flex-direction: column;
         align-items: center;
         /* padding: 20px ; */
     }

 }




 @media (max-width:700px) {

     .menu-nav {
         display: block;
     }

     .hFIFMP {
         display: none;
     }

     .icons-right i:nth-child(1) {
         display: none;
     }

     .icons-right i:nth-child(2) {
         display: none;
     }

     .icons-right i:nth-child(3) {
         display: block;
     }
 }




 /* <!------------------------------------2FA Page -------------------------------> */

 .FA-cont {
     /* color: white; */
     padding: 20px;
 }

 .FA-cont h2 {
     color: white;
     font-size: 23px;
     font-weight: 700;
 }

 .FA-cont p {
     color: #8f8f8f;
     max-width: 400px;
     margin-top: 20px;
     margin-bottom: 15px;
     font-size: 16px;
     font-weight: bold;
 }

 /* ---------------------library=================================== */
 .library {
     display: flex;
     gap: 450px;
     flex-wrap: wrap;
 }

 @media(max-width:1100px) {
     .library {
         display: flex;
         gap: 50px;
         flex-wrap: wrap;
         text-align: center;
     }

     .order {
         display: none;
     }

     .jzoPug {
         display: none !important;
     }

 }

 .searchs input {
     padding: 12px 40px;
     background-color: #212121;
     border: none;
     width: 100%;
     min-width: 420px;
     border-radius: 10px;
 }

 .searchs {
     padding: 21px;
 }

 .order a {
     padding: 12px 20px;
     background-color: #212121;
     border-radius: 20px;
     color: white;
     text-decoration: none;
 }

 .order {
     padding: 10px;
 }

 .Pug {
     display: flex;
     gap: 12px;
     overflow: auto hidden;
     width: 100%;
     scroll-behavior: smooth;
 }

 .lib2 {
     height: 42px;
     display: flex;
     -webkit-box-align: center;
     align-items: center;
     color: rgb(22, 22, 22);
     background-color: rgb(255, 255, 255);
     border: 1px solid rgb(255, 255, 255);
     border-radius: 8px;
     padding: 12px 32px;
     font: 0.875rem / 1.125rem Onest-Medium;
     cursor: pointer;
     text-wrap: nowrap;
 }

 .lib3 {
     height: 42px;
     display: flex;
     -webkit-box-align: center;
     align-items: center;
     color: rgb(255, 255, 255);
     background-color: rgb(33, 33, 33);
     border: 1px solid rgb(53, 53, 53);
     border-radius: 8px;
     padding: 12px 32px;
     font: 1rem / 1.125rem Onest-Medium !important;
     cursor: pointer;
     text-wrap: nowrap;
 }

 .lib3:hover {
     background-color: black !important;
 }

 .lib-img {
     display: grid;
     grid-template-columns: 1fr;
     place-content: center;
     place-items: center;
     width: 100%;
     color: rgb(255, 255, 255);
     margin-top: 24px;
 }

 .lib-img2 {
     margin-bottom: 50px;
 }

 .lib-img3 {
     font-size: 28px;
     line-height: 20px;
     font-family: Onest-Bold;
     color: rgb(255, 255, 255);
     margin-bottom: 8px;
 }

 .lib-img4 {
     font-size: 20px;
     line-height: 20px;
     font-family: Onest-Medium !important;
     margin-bottom: 24px;
     color: rgb(143, 143, 143);
 }

 .lib-img5 {
     display: flex;
     -webkit-box-align: center;
     align-items: center;
     place-content: center;
     cursor: pointer;
     border-radius: 8px;
     font-size: 1rem;
     line-height: 1rem;
     font-family: Onest-Bold;
     border: none;
     background: rgb(72, 133, 255);
     color: rgb(255, 255, 255);
     padding: 12px 30px;
     gap: 8px;
     opacity: 1;
     height: 48px;
 }


 /* ----------------------------sell on--------------------- */

 .sell-content h1 {
     font-size: 48px;
     /* font-family: Onest-Bold; */
     font-size: 48px;
     font-weight: bold;
     line-height: 62.4px;
     color: rgb(255, 255, 255);
 }

 .buttton-blue {
     background-color: #007bff;
     padding: 10px 20px;
     border-radius: 10px;
     border: none;


 }

 .buttton-blue a {
     color: white;
     font-size: 16px;
     text-decoration: none;
     font-weight: bold;

 }

 .buttton-blue a:hover {
     color: white;

 }

 .buttton-black {
     background-color: #272727;
     padding: 10px 20px;
     border-radius: 10px;
     border: 1px solid grey;


 }

 .buttton-black a {
     color: white;
     font-size: 16px;
     text-decoration: none;
     font-weight: bold;

 }

 .buttton-black a:hover {
     color: white;

 }

 .sell-content button {
     gap: 20px;
 }

 .sell-button {
     display: flex;
     gap: 20px;
 }

 .sell-content {
     padding: 100px 60px;
 }

 .sell-img {
     padding: 100px 60px;
 }

 @media(max-width:900px) {
     .sell-img {
         padding: 20px 30px;
     }

     .sell-content {
         padding: 21px 21px;
     }

 }


 .sell-card {
     width: 100%;
     padding: 56px 0px 120px;
     background: rgb(23, 23, 23);
     position: relative;
 }

 .sell-card1 {
     display: flex;
     flex-direction: column;
     gap: 48px;
     max-width: 1232px;
     margin: auto;
     -webkit-box-align: center;
     align-items: center;
     -webkit-box-pack: center;
     justify-content: center;
 }

 .sell-heading {
     font-size: 40px;
     font-family: Onest-Bold !important;
     color: rgb(255, 255, 255);
     font-weight: bold;
 }

 .sell-card2 {
     display: flex;
     gap: 16px;
     justify-content: center;
     flex-wrap: wrap;

 }

 .sells {
     display: flex;
     flex-direction: column;
     gap: 8px;
     border-radius: 16px;
     width: 380px;
     border: 1px solid rgb(53, 53, 53);
     padding: 24px;
 }

 .sells2 {
     display: flex;
     gap: 16px;
     -webkit-box-align: center;
     align-items: center;
 }

 .sells3 {
     width: 32px;
     height: 32px;
     border-radius: 50%;
     display: flex;
     -webkit-box-pack: center;
     justify-content: center;
     -webkit-box-align: center;
     align-items: center;
 }

 .sells4 {
     height: 24px;
     width: 24px;
     vertical-align: middle;
     margin: 0px;
     position: relative;
     display: inline-block;
     background-image: url(./images/sell-icon1.svg);
     background-repeat: no-repeat;
     background-position: center center;
     background-size: contain;
 }

 .sells5 {
     font-size: 18px;
     font-family: Onest-Medium;
     line-height: 24.3px;
     color: rgb(255, 255, 255) !important;
 }

 .hDAkgI {
     display: flex;
     padding-left: 48px;
     -webkit-box-align: center;
     align-items: center;
 }

 .sells-content {
     color: rgb(128, 128, 128);
     font-size: 16px;
     line-height: 21.6px;
 }

 .eptRhd {
     height: 24px;
     width: 24px;
     vertical-align: middle;
     margin: 0px;
     position: relative;
     display: inline-block;
     background-image: url(./images/sell-icon2.svg);
     background-repeat: no-repeat;
     background-position: center center;
     background-size: contain;
 }

 .lodYag {
     height: 24px;
     width: 24px;
     vertical-align: middle;
     margin: 0px;
     position: relative;
     display: inline-block;
     background-image: url(./images/sell-icon3.svg);
     background-repeat: no-repeat;
     background-position: center center;
     background-size: contain;
 }

 .fphsoA {
     height: 24px;
     width: 24px;
     vertical-align: middle;
     margin: 0px;
     position: relative;
     display: inline-block;
     background-image: url(./images/sell-icon4.svg);
     background-repeat: no-repeat;
     background-position: center center;
     background-size: contain;
 }

 .hXJdtA {
     height: 24px;
     width: 24px;
     vertical-align: middle;
     margin: 0px;
     position: relative;
     display: inline-block;
     background-image: url(./images/sell-icon5.svg);
     background-repeat: no-repeat;
     background-position: center center;
     background-size: contain;
 }

 .dejDrJ {
     height: 24px;
     width: 24px;
     vertical-align: middle;
     margin: 0px;
     position: relative;
     display: inline-block;
     background-image: url(./images/sell-icon6.svg);
     background-repeat: no-repeat;
     background-position: center center;
     background-size: contain;
 }


 .selll3 {
     width: 100%;
     height: auto;
     padding: 56px 0px;
     background: rgb(0, 0, 0);
 }

 .selll4 {
     display: flex;
     flex-direction: column;
     max-width: 1232px;
     margin: auto;
     -webkit-box-align: center;
     align-items: center;
 }

 .selll5 {
     font-size: 40px;
     font-family: Onest-Bold !important;
     color: rgb(255, 255, 255);
     font-weight: bold;
 }

 .selll6 {
     display: flex;
     gap: 16px;
     justify-content: center;
     flex-wrap: wrap;
 }

 .selll7 {
     border-radius: 16px;
     border: 1px solid rgb(53, 53, 53);
     width: 300px;
     padding: 36px 16px 16px;
     text-align: center;
     background-color: rgb(33, 33, 33);
     display: flex;
     flex-direction: column;
     gap: 8px;
     -webkit-box-align: center;
     align-items: center;
 }

 .ikAPga {
     width: 100px;
     height: 100px;
     border-radius: 50%;
     background-color: rgb(72, 72, 72);
     display: flex;
     -webkit-box-pack: center;
     justify-content: center;
     -webkit-box-align: center;
     align-items: center;
 }

 .iMsVvy {
     height: 64px;
     width: 64px;
     vertical-align: middle;
     margin: 0px;
     position: relative;
     display: inline-block;
     background-image: url(./images/sell-icon7.svg);
     background-repeat: no-repeat;
     background-position: center center;
     background-size: contain;
 }

 .selll9 {
     color: rgb(255, 255, 255);
     font-size: 24px;
     line-height: 32.4px;
     font-family: Onest-SemiBold;
 }

 .selll10 {
     color: rgb(128, 128, 128);
     font-size: 14px;
     line-height: 18.9px;
 }

 .liNfTe {
     height: 64px;
     width: 64px;
     vertical-align: middle;
     margin: 0px;
     position: relative;
     display: inline-block;
     background-image: url(./images/sell-icon8.svg);
     background-repeat: no-repeat;
     background-position: center center;
     background-size: contain;
 }

 .ddpLfk {
     height: 64px;
     width: 64px;
     vertical-align: middle;
     margin: 0px;
     position: relative;
     display: inline-block;
     background-image: url(./images/sell-icon9.svg);
     background-repeat: no-repeat;
     background-position: center center;
     background-size: contain;
 }


 @media(max-width:900px) {
     #refund-policy {
         padding: 0px !important;
     }

 }