* {
    margin: 0;
    padding: 0;
    font-family: sans-serif;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

.container {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.nav {
    display: flex;
    flex-direction: column;
    background-color: #fff;
    width: 100%;
}

.main_nav {
    max-width: 1200px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin: 5vh auto 0 auto;
    gap: 24px;
    position: relative;
    padding: 8px 16px;
}

#logo {
    width: 150px;
    height: 58px;
    display: block;
}

#logo:hover {
    cursor: pointer;

}

#search {
    height: 36px;
    width: 280px;
    max-width: 45vw;
    border-radius: 50px;
    border: 1px solid rgba(0, 0, 0, 0.12);
    padding: 6px 14px;
    background: #fff;
    outline: none;
    margin-left: auto;
}

.r_nav {
    display: flex;
    gap: 18px;
    align-items: center;
    margin-left: 12px;
}


.main_nav>img#logo {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    z-index: 2;
}

.nav_option {
    max-width: 1200px;
    width: 100%;
    margin: 5px auto 0 auto;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 8px 10px;
}


.nav_option a {
    color: black;
    text-decoration: none;
    font-size: 14px;
    font-family: sans-serif;

}

.option {
    font-family: sans-serif;
    margin: 0.5vw;
}

.baner {
    background-image: url(https://res.cloudinary.com/dhbxrjpgc/image/upload/v1761217485/baner_fqh7lf.webp);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    min-height: 100vh;
    /* responsive height */
}

.section-title {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    margin: 40px 4%;
}

.section-title .line {
    flex: 1;
    height: 1px;
    background-color: #333;
}

.section-title h2 {
    font-size: 24px;
    font-weight: bold;
    text-transform: uppercase;
}

.items {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    padding: 0 4%;
    gap: 20px;
    justify-content: center;
    margin-left: 12vw;
    margin-right: 12vw;
}

.item1 {
    font-family: sans-serif;
    display: flex;
    width: calc(25% - 18px);
    min-width: 240px;
    justify-content: flex-start;
    align-items: center;
    flex-direction: column;
    font-size: 14px;
    transition: transform 0.2s ease;
}

.image1 {
    background-image: url(https://res.cloudinary.com/dhbxrjpgc/image/upload/v1761240756/img1_pmw5dd.webp);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    height: 0;
    padding-top: 133%;
    max-width: 247px;
}

.image2 {
    background-image: url(https://res.cloudinary.com/dhbxrjpgc/image/upload/v1761240756/img2_hkxzwr.webp);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    height: 0;
    padding-top: 133%;
    max-width: 247px;
}

.image3 {
    background-image: url(https://res.cloudinary.com/dhbxrjpgc/image/upload/v1761240756/img3_kje3c6.webp);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    height: 0;
    padding-top: 133%;
    max-width: 247px;
}

.image4 {
    background-image: url(https://res.cloudinary.com/dhbxrjpgc/image/upload/v1761240757/img4_hbjmqr.webp);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    height: 0;
    padding-top: 133%;
    max-width: 247px;
}

.contant1 {
    margin-top: 7px;
    display: flex;
    flex-direction: column;
}

.contant1 #price {
    color: red;
}

.price {
    display: flex;
    margin-bottom: 10px;
}

.price del {
    color: #8c8c8c;
}

.size del {
    color: #8c8c8c;
}

.baner2 {
    margin-top: 5vh;
    background-image: url(https://res.cloudinary.com/dhbxrjpgc/image/upload/v1761244560/baner2_ox5tiu.webp);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    min-height: 100vh;
}

.baner3_4 {
    display: flex;
    flex-wrap: wrap;
}

.baner3 {
    background-image: url(https://res.cloudinary.com/dhbxrjpgc/image/upload/v1761244561/baner3_yj1ihj.webp);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    margin-top: 4px;
    margin-right: 2px;
    margin-left: 2px;
    height: 100vh;
    width: 49.3%;
}

.baner4 {
    background-image: url(https://res.cloudinary.com/dhbxrjpgc/image/upload/v1761244560/baner4_q7jhku.webp);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    margin-left: 2px;
    margin-top: 4px;
    height: 100vh;
    width: 49.2%;
}

.baner5 {
    background-image: url(https://res.cloudinary.com/dhbxrjpgc/image/upload/v1761244560/baner5_vxzmiy.webp);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    min-height: 100vh;
}

.baner6 {
    background-image: url(https://res.cloudinary.com/dhbxrjpgc/image/upload/v1761246117/baner6_yuh0c1.webp);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    min-height: 100vh;
    display: flex;
    margin-top: 4px;
    justify-content: center;
    align-items: end;
    padding-bottom: 50px;
}

#women {
    height: 40px;
    width: 170px;
    background-color: black;
    color: white;
    margin-right: 10px;
}

#men {
    height: 40px;
    width: 170px;
    background-color: black;
    color: white;
    margin-left: 10px;
}

#video {
    width: 99vw;
    margin-bottom: 5vh;
}

.about {
    display: flex;
    margin-bottom: 50px;
    flex-wrap: wrap;
}

.baner7 {
    background-image: url(https://res.cloudinary.com/dhbxrjpgc/image/upload/v1761287174/baner7_uwaj0k.webp);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 100vh;
    width: 50vw;
}

.aboutme {
    font-family: sans-serif;
    margin: 60px;
    width: 40vw;

}

.aboutme h2 {
    margin-bottom: 30px;
}

.aboutme .p1 {
    margin-bottom: 20px;
    font-size: 20px;
    color: #8c8c8c;
}

.aboutme .p2 {
    color: #8c8c8c;
    margin-bottom: 20px;
    font-size: 20px;
}

.aboutme .read {
    height: 45px;
    width: 250px;
    margin-top: 5vw;
}

.footer {
    background-image: url(https://res.cloudinary.com/dhbxrjpgc/image/upload/v1761290787/footer-background_qpgbjh.webp);
    width: 100%;
    min-height: 60vh;
}

.footer .content {
    color: #fff;
    display: flex;
    flex-wrap: wrap;
    padding-top: 7vh;
    font-family: sans-serif;
    box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.299);
}

.footer .content .main_con {
    display: flex;
    flex-wrap: wrap;
    width: 60vw;
    justify-content: space-between;
    margin-bottom: 10vh;
}

.footer .content .main_con .main_con_01 {
    margin-left: 5vw;
}

.footer .content .main_con li {
    margin-top: 20px;
}

.footer .content .side_con {
    width: 29vw;
    display: flex;
    margin-left: 10vw;
    flex-direction: column;

}

.footer .content .side_con .p1 {
    margin-top: 8vh;
}

#email {
    margin-top: 30px;
    width: 300px;
    height: 50px;
}

.footer .content .side_con button {
    margin-top: 20px;
    height: 50px;
    width: 300px;
}

.main {
    display: flex;
    flex-wrap: wrap;
    margin-top: 20px;
}

.main_footer {
    font-family: sans-serif;
    color: #fff;
    margin-top: 1vw;
    margin-left: 5vw;
    margin-right: 5vw;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.main_footer .payment {
    display: flex;
    align-items: center;
}

.social {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 40px;
    height: 40px;
    border-radius: 50px;
    border: 2px solid;
    margin: 5px;
    background-color: #fff;
}

.mdi--shop-location-outline {
    display: inline-block;
    width: 24px;
    height: 24px;
    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M20 6H4V4h16zm-5.7 6c-.8.96-1.3 2.18-1.3 3.5c0 1.14.43 2.36 1 3.5v1H4v-6H3v-2l1-5h16l.7 3.5c-.66-.32-1.38-.5-2.14-.5l-.2-1H5.64l-.6 3zM12 14H6v4h6zm10 1.5c0 2.6-3.5 6.5-3.5 6.5S15 18.1 15 15.5c0-1.9 1.6-3.5 3.5-3.5s3.5 1.6 3.5 3.5m-2.3.1c0-.6-.6-1.2-1.2-1.2s-1.2.5-1.2 1.2c0 .6.5 1.2 1.2 1.2s1.3-.6 1.2-1.2'/%3E%3C/svg%3E");
    background-color: currentColor;
    -webkit-mask-image: var(--svg);
    mask-image: var(--svg);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
}

.line-md--account-small {
    display: inline-block;
    width: 24px;
    height: 24px;
    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-dasharray='20' stroke-dashoffset='20' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='M6 19v-1c0 -2.21 1.79 -4 4 -4h4c2.21 0 4 1.79 4 4v1'%3E%3Canimate fill='freeze' attributeName='stroke-dashoffset' dur='0.2s' values='20;0'/%3E%3C/path%3E%3Cpath d='M12 11c-1.66 0 -3 -1.34 -3 -3c0 -1.66 1.34 -3 3 -3c1.66 0 3 1.34 3 3c0 1.66 -1.34 3 -3 3Z'%3E%3Canimate fill='freeze' attributeName='stroke-dashoffset' begin='0.2s' dur='0.2s' values='20;0'/%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
    background-color: currentColor;
    -webkit-mask-image: var(--svg);
    mask-image: var(--svg);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
}

.line-md--heart {
    display: inline-block;
    width: 24px;
    height: 24px;
    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-dasharray='32' stroke-dashoffset='32' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M12 8c0 0 0 0 -0.76 -1c-0.88 -1.16 -2.18 -2 -3.74 -2c-2.49 0 -4.5 2.01 -4.5 4.5c0 0.93 0.28 1.79 0.76 2.5c0.81 1.21 8.24 9 8.24 9M12 8c0 0 0 0 0.76 -1c0.88 -1.16 2.18 -2 3.74 -2c2.49 0 4.5 2.01 4.5 4.5c0 0.93 -0.28 1.79 -0.76 2.5c-0.81 1.21 -8.24 9 -8.24 9'%3E%3Canimate fill='freeze' attributeName='stroke-dashoffset' dur='0.7s' values='32;0'/%3E%3C/path%3E%3C/svg%3E");
    background-color: currentColor;
    -webkit-mask-image: var(--svg);
    mask-image: var(--svg);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
}

.ic--twotone-shopping-bag {
    display: inline-block;
    width: 24px;
    height: 24px;
    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M18 20H6V8h2v2c0 .55.45 1 1 1s1-.45 1-1V8h4v2c0 .55.45 1 1 1s1-.45 1-1V8h2z' opacity='0.3'/%3E%3Cpath fill='%23000' d='M18 6h-2c0-2.21-1.79-4-4-4S8 3.79 8 6H6c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V8c0-1.1-.9-2-2-2m-6-2c1.1 0 2 .9 2 2h-4c0-1.1.9-2 2-2m6 16H6V8h2v2c0 .55.45 1 1 1s1-.45 1-1V8h4v2c0 .55.45 1 1 1s1-.45 1-1V8h2z'/%3E%3C/svg%3E");
    background-color: currentColor;
    -webkit-mask-image: var(--svg);
    mask-image: var(--svg);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
}

.formkit--down {
    display: inline-block;
    width: 16px;
    height: 7px;
    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 7'%3E%3Cpath fill='%23000' d='M8 6.5a.47.47 0 0 1-.35-.15l-4.5-4.5c-.2-.2-.2-.51 0-.71s.51-.2.71 0l4.15 4.15l4.14-4.14c.2-.2.51-.2.71 0s.2.51 0 .71l-4.5 4.5c-.1.1-.23.15-.35.15Z'/%3E%3C/svg%3E");
    background-color: currentColor;
    -webkit-mask-image: var(--svg);
    mask-image: var(--svg);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
}

.flowbite--facebook-solid {
    display: inline-block;
    width: 24px;
    height: 24px;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' fill-rule='evenodd' d='M13.135 6H15V3h-1.865a4.147 4.147 0 0 0-4.142 4.142V9H7v3h2v9.938h3V12h2.021l.592-3H12V6.591A.6.6 0 0 1 12.592 6z' clip-rule='evenodd'/%3E%3C/svg%3E");
}

.basil--instagram-solid {
    display: inline-block;
    width: 24px;
    height: 24px;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M12 8.75a3.25 3.25 0 1 0 0 6.5a3.25 3.25 0 0 0 0-6.5'/%3E%3Cpath fill='%23000' fill-rule='evenodd' d='M6.77 3.082a47.5 47.5 0 0 1 10.46 0c1.899.212 3.43 1.707 3.653 3.613a45.7 45.7 0 0 1 0 10.61c-.223 1.906-1.754 3.401-3.652 3.614a47.5 47.5 0 0 1-10.461 0c-1.899-.213-3.43-1.708-3.653-3.613a45.7 45.7 0 0 1 0-10.611C3.34 4.789 4.871 3.294 6.77 3.082M17 6a1 1 0 1 0 0 2a1 1 0 0 0 0-2m-9.75 6a4.75 4.75 0 1 1 9.5 0a4.75 4.75 0 0 1-9.5 0' clip-rule='evenodd'/%3E%3C/svg%3E");
}

.mingcute--youtube-fill {
    display: inline-block;
    width: 24px;
    height: 24px;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cpath d='m12.593 23.258l-.011.002l-.071.035l-.02.004l-.014-.004l-.071-.035q-.016-.005-.024.005l-.004.01l-.017.428l.005.02l.01.013l.104.074l.015.004l.012-.004l.104-.074l.012-.016l.004-.017l-.017-.427q-.004-.016-.017-.018m.265-.113l-.013.002l-.185.093l-.01.01l-.003.011l.018.43l.005.012l.008.007l.201.093q.019.005.029-.008l.004-.014l-.034-.614q-.005-.018-.02-.022m-.715.002a.02.02 0 0 0-.027.006l-.006.014l-.034.614q.001.018.017.024l.015-.002l.201-.093l.01-.008l.004-.011l.017-.43l-.003-.012l-.01-.01z'/%3E%3Cpath fill='%23000' d='M12 4c.855 0 1.732.022 2.582.058l1.004.048l.961.057l.9.061l.822.064a3.8 3.8 0 0 1 3.494 3.423l.04.425l.075.91c.07.943.122 1.971.122 2.954s-.052 2.011-.122 2.954l-.075.91l-.04.425a3.8 3.8 0 0 1-3.495 3.423l-.82.063l-.9.062l-.962.057l-1.004.048A62 62 0 0 1 12 20a62 62 0 0 1-2.582-.058l-1.004-.048l-.961-.057l-.9-.062l-.822-.063a3.8 3.8 0 0 1-3.494-3.423l-.04-.425l-.075-.91A41 41 0 0 1 2 12c0-.983.052-2.011.122-2.954l.075-.91l.04-.425A3.8 3.8 0 0 1 5.73 4.288l.821-.064l.9-.061l.962-.057l1.004-.048A62 62 0 0 1 12 4m-2 5.575v4.85c0 .462.5.75.9.52l4.2-2.425a.6.6 0 0 0 0-1.04l-4.2-2.424a.6.6 0 0 0-.9.52Z'/%3E%3C/g%3E%3C/svg%3E");
}

.mingcute--twitter-fill {
    display: inline-block;
    width: 24px;
    height: 24px;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none'%3E%3Cpath d='m12.593 23.258l-.011.002l-.071.035l-.02.004l-.014-.004l-.071-.035q-.016-.005-.024.005l-.004.01l-.017.428l.005.02l.01.013l.104.074l.015.004l.012-.004l.104-.074l.012-.016l.004-.017l-.017-.427q-.004-.016-.017-.018m.265-.113l-.013.002l-.185.093l-.01.01l-.003.011l.018.43l.005.012l.008.007l.201.093q.019.005.029-.008l.004-.014l-.034-.614q-.005-.018-.02-.022m-.715.002a.02.02 0 0 0-.027.006l-.006.014l-.034.614q.001.018.017.024l.015-.002l.201-.093l.01-.008l.004-.011l.017-.43l-.003-.012l-.01-.01z'/%3E%3Cpath fill='%23000' d='M4.594 4.984a1 1 0 0 1 .941.429C7.011 7.572 8.783 8.47 10.75 8.674c.096-.841.323-1.672.75-2.404c.626-1.074 1.644-1.864 3.098-2.156c2.01-.404 3.54.324 4.427 1.215l1.792-.335a1 1 0 0 1 1.053 1.478l-1.72 3.022c.157 4.361-1.055 7.405-3.639 9.502c-1.37 1.112-3.332 1.743-5.485 1.938c-2.17.196-4.623-.041-7.061-.753a1 1 0 0 1 .007-1.922c1.226-.349 2.16-.65 3.003-1.177c-1.199-.636-2.082-1.468-2.707-2.416c-.868-1.318-1.19-2.788-1.254-4.113S3.141 8 3.343 7.115c.115-.505.249-1.011.434-1.495a1 1 0 0 1 .818-.636Z'/%3E%3C/g%3E%3C/svg%3E");
}

.basil--linkedin-solid {
    display: inline-block;
    width: 24px;
    height: 24px;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M4.75 1.875a2.125 2.125 0 1 0 0 4.25a2.125 2.125 0 0 0 0-4.25m-2 6A.125.125 0 0 0 2.625 8v13c0 .069.056.125.125.125h4A.125.125 0 0 0 6.875 21V8a.125.125 0 0 0-.125-.125zm6.5 0A.125.125 0 0 0 9.125 8v13c0 .069.056.125.125.125h4a.125.125 0 0 0 .125-.125v-7a1.875 1.875 0 1 1 3.75 0v7c0 .069.056.125.125.125h4a.125.125 0 0 0 .125-.125v-8.62c0-2.427-2.11-4.325-4.525-4.106a7.2 7.2 0 0 0-2.169.548l-1.306.56V8a.125.125 0 0 0-.125-.125z'/%3E%3C/svg%3E");
}

@media (max-width: 768px) {

    .nav_option {
        display: none;
    }

    #search {
        display: none;
    }


    .main_nav {
        justify-content: space-between;
        padding: 12px 16px;
        width: 100%;
    }

    .main_nav>img#logo,
    #logo {
        position: static !important;
        left: auto !important;
        transform: none !important;
        width: 130px;
        height: auto;
        margin: 0;
    }

    .r_nav {
        margin-left: auto;
    }

    .baner {
        background-image: url(https://res.cloudinary.com/dhbxrjpgc/image/upload/v1761217484/baner_mobile_wdqmnn.webp);
    }

    .item1 {
        font-family: sans-serif;
        display: flex;
        border: 1px solid #ccc;
        width: 260px;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        font-size: 14px;
        margin: 10px;
    }
}
.men_categary_items{
    font-family: sans-serif;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: column;
    font-size: 14px;
}

#men_baner {
    width: 99vw;
}

.men_categary {
    display: flex;
    justify-content: space-around;
    /* flex-wrap: wrap; */
    padding-top: 3vh;
    gap: 8px 10px;
}

.main_head {
    font-family: sans-serif;
    font-size: 20px;
    text-transform: uppercase;
    display: flex;
    align-items: center;
    justify-content: center;
    /* gap: 20px; */
    margin: 40px 4%;
}

.men_item1 {
    font-family: sans-serif;
    display: flex;
    border: 1px solid #ccc;
    width: 270px;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    font-size: 14px;
}

.men_items {
    display: flex;
    flex-wrap: wrap;
    width: 1200px;
    margin: 0 auto;
    padding: 20px;
    gap: 24px;
    justify-content: flex-start;
}

.men_image1 {
    background-image: url(https://res.cloudinary.com/dhbxrjpgc/image/upload/v1761469447/men_01_nsbocg.webp);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    height: 0;
    padding-top: 133%;
    max-width: 247px;
}

.men_image2 {
    background-image: url(https://res.cloudinary.com/dhbxrjpgc/image/upload/v1761469447/men_2_cxwacc.webp);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    height: 0;
    padding-top: 133%;
    max-width: 247px;
}

.men_image3 {
    background-image: url(https://res.cloudinary.com/dhbxrjpgc/image/upload/v1761469447/men_03_sqrtrg.webp);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    height: 0;
    padding-top: 133%;
    max-width: 247px;
}

.men_image4 {
    background-image: url(https://res.cloudinary.com/dhbxrjpgc/image/upload/v1761469447/men_04_gchzzg.webp);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    height: 0;
    padding-top: 133%;
    max-width: 247px;
}

.men_image5 {
    background-image: url(https://res.cloudinary.com/dhbxrjpgc/image/upload/v1761475995/men_05_dbid7d.webp);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    height: 0;
    padding-top: 133%;
    max-width: 247px;
}

.men_image6 {
    background-image: url(https://res.cloudinary.com/dhbxrjpgc/image/upload/v1761475995/men_06_y7epxa.webp);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    height: 0;
    padding-top: 133%;
    max-width: 247px;
}

.men_image7 {
    background-image: url(https://res.cloudinary.com/dhbxrjpgc/image/upload/v1761475995/men_07_uejcci.webp);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    height: 0;
    padding-top: 133%;
    max-width: 247px;
}

.men_image8 {
    background-image: url(https://res.cloudinary.com/dhbxrjpgc/image/upload/v1761475995/men_08_tjt5b5.webp);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    height: 0;
    padding-top: 133%;
    max-width: 247px;
}

.men_image9 {
    background-image: url(https://res.cloudinary.com/dhbxrjpgc/image/upload/v1761475995/men_09_rerr3r.webp);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    height: 0;
    padding-top: 133%;
    max-width: 247px;
}

.men_image10 {
    background-image: url(https://res.cloudinary.com/dhbxrjpgc/image/upload/v1761475996/men_10_qtrjmw.webp);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    height: 0;
    padding-top: 133%;
    max-width: 247px;
}

.men_image11 {
    background-image: url(https://res.cloudinary.com/dhbxrjpgc/image/upload/v1761475996/men_11_mnkuh9.webp);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    height: 0;
    padding-top: 133%;
    max-width: 247px;
}

.men_image12 {
    background-image: url(https://res.cloudinary.com/dhbxrjpgc/image/upload/v1761476004/men_12_crgaik.webp);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    height: 0;
    padding-top: 133%;
    max-width: 247px;
}

.men_image13 {
    background-image: url(https://res.cloudinary.com/dhbxrjpgc/image/upload/v1761476005/men_13_lrsxxk.webp);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    height: 0;
    padding-top: 133%;
    max-width: 247px;
}

.men_image14 {
    background-image: url(https://res.cloudinary.com/dhbxrjpgc/image/upload/v1761476005/men_14_fvy7ev.webp);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    height: 0;
    padding-top: 133%;
    max-width: 247px;
}

.men_image15 {
    background-image: url(https://res.cloudinary.com/dhbxrjpgc/image/upload/v1761476009/men_15_i1v6nd.webp);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    height: 0;
    padding-top: 133%;
    max-width: 247px;
}

.men_image16 {
    background-image: url(https://res.cloudinary.com/dhbxrjpgc/image/upload/v1761476009/men_16_czqweb.webp);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    height: 0;
    padding-top: 133%;
    max-width: 247px;
}

.men_image17 {
    background-image: url(https://res.cloudinary.com/dhbxrjpgc/image/upload/v1761476009/men_17_dlir6j.webp);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    height: 0;
    padding-top: 133%;
    max-width: 247px;
}

.men_image18 {
    background-image: url(https://res.cloudinary.com/dhbxrjpgc/image/upload/v1761476013/men_18_zpbdri.webp);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    height: 0;
    padding-top: 133%;
    max-width: 247px;
}

.men_image19 {
    background-image: url(https://res.cloudinary.com/dhbxrjpgc/image/upload/v1761476013/men_19_vwghox.webp);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    height: 0;
    padding-top: 133%;
    max-width: 247px;
}

.men_image20 {
    background-image: url(https://res.cloudinary.com/dhbxrjpgc/image/upload/v1761476014/men_20_b8bvdy.webp);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    height: 0;
    padding-top: 133%;
    max-width: 247px;
}

.men_image21 {
    background-image: url(https://res.cloudinary.com/dhbxrjpgc/image/upload/v1761476015/men_21_vfogmu.webp);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    height: 0;
    padding-top: 133%;
    max-width: 247px;
}

.men_image22 {
    background-image: url(https://res.cloudinary.com/dhbxrjpgc/image/upload/v1761476020/men_22_sbznyg.webp);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    height: 0;
    padding-top: 133%;
    max-width: 247px;
}

.men_image23 {
    background-image: url(https://res.cloudinary.com/dhbxrjpgc/image/upload/v1761476020/men_23_i3hplr.webp);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    height: 0;
    padding-top: 133%;
    max-width: 247px;
}

.men_image24 {
    background-image: url(https://res.cloudinary.com/dhbxrjpgc/image/upload/v1761476020/men_24_yx1a9w.webp);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    height: 0;
    padding-top: 133%;
    max-width: 247px;
}

.women_image1{
    background-image: url(https://res.cloudinary.com/dhbxrjpgc/image/upload/v1761476020/men_24_yx1a9w.webp);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    height: 0;
    padding-top: 133%;
    max-width: 247px;
}
#a_p{
    text-decoration: none;
    color: black;
}
.row{
    display: flex;
    flex-wrap: nowrap;
    justify-content: start;
    gap: 10px;
    width: 60vw;
    /* border: 1px solid #ccc; */
}
.row img{
    width: 29vw;
    height: auto;
    margin-bottom: 10px;
    margin-left: 10px;
}
.product_item{
    display: flex;
    /* flex-wrap: wrap; */
    /* gap: 20px; */
    /* justify-content: center; */
}
.detail{
    font-family: sans-serif;
    margin-left: 5px;
    width: 40vw;
    margin-top: 7vh;
    margin-left: 20px;
}
.item_details{
    margin-top: 15px;
    font-size: 18px;
    margin-right:5vw ;
    font-weight:normal;
    padding-bottom: 16px;
    box-shadow: 0 1px 0 0 #ccc;
}
.priceing{
    margin-top: 20px;
    display: flex;
}
#off{
    color: red;
    font-weight: bold;
    margin-left: 10px;
}
#mrp{
    text-decoration: line-through;
    color: #777;
    margin-left: 10px;
}
.shiping a{
    text-decoration: none;
    color: #777;
}
.shiping{
    color: #777;
    margin-top: 10px;
    font-size: 10px;
    font-family: sans-serif;
    margin-bottom: 20px;
}
.size_chart{
    font-size: 14px;
    margin-top: 20px;
    display: flex
}

.size_number{
    display: flex;
    gap: 10px;
}
.size_number div{
    margin-top: 30px;
    border: 1px solid #ccc;
    width: 50px;
    height: 50px;
    display: flex;
    border-radius: 50px;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}
.size_number div:hover{
    background-color: black;
    color: white;
    border-color: black;
}
.text_pin
{
    margin-top: 30px;
    font-size: 14px;
    margin-left: 5px;
}

#check_pincode{
    width: 90%;
    height: 50px;
    border: 1px solid #ccc;
    border-radius: 10px;
    margin-top: 20px;
    padding: 5px 10px;
    background-color: rgb(255, 255, 255);
    color: black;
    cursor: pointer;
}
#Check
{
    margin-top: 20px;
    color: white;
    background-color: black;
    height: 50px;
    width: 100px;
}
.qunti
{
    margin-top: 20px;
    display: flex;
    align-items: center;
    gap: 10px;
}
#qt{
    width: 60px;
    height: 30px;
}
#Buy{
    margin-top: 30px;
    width: 250px;
    height: 50px;
    background-color: black;
    color: white;
    border: none;
    cursor: pointer;
}
.buy{
    margin-top: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}


.order-container {
    max-width: 1200px;
    margin: 40px auto;
    padding: 0 20px;
    display: flex;
    gap: 40px;
    align-items: flex-start;
}

.product-summary {
    flex: 1;
    display: flex;
    gap: 20px;
    padding: 20px;
    border: 1px solid #eee;
    border-radius: 8px;
}

.product-summary img {
    width: 120px;
    height: auto;
    object-fit: cover;
}

.product-info {
    flex: 1;
}

.product-info h3 {
    margin-bottom: 15px;
    font-size: 16px;
}

.product-details {
    color: #666;
    font-size: 14px;
    line-height: 1.6;
}

.product-details .price {
    font-weight: bold;
    color: #000;
    font-size: 16px;
}

.shipping-form {
    flex: 1;
    padding: 30px;
    border: 1px solid #eee;
    border-radius: 8px;
}

.shipping-form h2 {
    margin-bottom: 25px;
    font-size: 20px;
}

.form-group {
    margin-bottom: 20px;
}

.form-group input {
    width: 100%;
    padding: 12px;
    border: 1px solid #ddd;
    border-radius: 6px;
    font-size: 14px;
}

.form-row {
    display: flex;
    gap: 15px;
}

.form-row .form-group {
    flex: 1;
}

.place-order-btn {
    width: 100%;
    padding: 15px;
    background-color: black;
    color: white;
    border: none;
    border-radius: 6px;
    font-size: 16px;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

.place-order-btn:hover {
    background-color: #333;
}

@media (max-width: 768px) {
    .order-container {
        flex-direction: column;
    }
    
    .form-row {
        flex-direction: column;
    }
    
    .product-summary {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
    
    .product-summary img {
        width: 200px;
    }

    /* Minimal Responsiveness Fixes */
    body, html {
        overflow-x: hidden;
    }
    
    .items {
        margin-left: 2%;
        margin-right: 2%;
    }
    
    .men_items {
        width: 100%;
        padding: 5px;
    }
    
    .baner3_4 {
        flex-direction: column;
    }
    
    .baner3, .baner4 {
        width: 100%;
        height: 50vh;
        margin: 5px 0 !important;
    }
    
    .about {
        flex-direction: column;
    }
    
    .baner7 {
        width: 100%;
        height: 40vh;
    }
    
    .aboutme {
        width: 90%;
        margin: 20px auto;
    }
    
    .footer .content .main_con {
        width: 100%;
        margin-left: 0;
        padding: 0 20px;
        flex-direction: column;
        gap: 20px;
    }
    
    .footer .content .side_con {
        width: 100%;
        margin-left: 0;
        padding: 0 20px;
    }
    
    .row {
        width: 100%;
        flex-direction: column;
    }
    
    .row img {
        width: 90%;
        margin: 10px auto;
    }
    
    .detail {
        width: 90%;
        margin: 20px auto;
    }
}