:root
{
    --bgColor: #FCFAF1;
    --txtColor: hsl(0, 0%, 20%);
    --borderColorLight: rgba(0, 0, 0, 0.1);
    --borderColor: rgba(0, 0, 0, 0.3);
    --errColor: hsl(340, 100%, 50%);
    --sucColor: hsl(183, 100%, 50%);
    --farsiColor: hsla(0, 0%, 20%, 0.7);
    --muteColor: hsla(0, 0%, 20%, 0.6);
    --shadowColor: hsla(183, 100%, 40%, 0.4);
    --blue: #00aeff;
    --dalalBg: hsla(0, 0%, 100%, 0.7);
}

html
{
    scroll-behavior: smooth !important;
}
body
{
    background-color: var(--bgColor);
    background: radial-gradient(circle,rgb(252, 252, 255) 0%, rgb(255, 255, 255) 100%);

    overflow: hidden;

    color: var(--txtColor);

    font-family: "Cascadia_Mono", "Orbitron", "IBM Plex Sans Arabic";
}
a
{
    text-decoration: underline;
    color: hsla(184, 100%, 100%, 0.8);

    transition: 0.2s linear(0, 0.067, 0.1294, 0.1877, 0.2421, 0.2929, 0.3402, 0.3844, 0.4257, 0.4641, 0.5, 0.5335, 0.5647, 0.5939, 0.6211, 0.6464, 0.6701, 0.6922, 0.7128, 0.7321, 0.75, 0.7667, 0.7824, 0.7969, 0.8105, 0.8232, 0.8351, 0.8461, 0.8564, 0.866, 0.875, 0.8834, 0.8912, 0.8985, 0.9053, 0.9116, 0.9175, 0.9231, 0.9282, 0.933, 0.9375, 0.9417, 0.9456, 0.9492, 0.9526, 0.9558, 0.9588, 0.9615, 0.9641, 0.9665, 0.9688, 0.9708, 0.9728, 0.9746, 0.9763, 0.9779, 0.9794, 0.9808, 0.9821, 0.9833, 0.9844, 0.9854, 0.9864, 0.9873, 0.9882, 0.989, 0.9897, 0.9904, 0.991, 0.9916, 0.9922, 0.9927, 0.9932, 0.9937, 0.9941, 0.9945, 0.9948, 0.9952, 0.9955, 0.9958, 0.9961, 0.9964, 0.9966, 0.9968, 0.997, 0.9972, 0.9974, 0.9976, 0.9978, 0.9979, 0.998, 0.9982, 0.9983, 0.9984, 0.9985, 0.9986, 0.9987, 0.9988, 0.9989, 0.999, 1);
}
a:hover, a:focus
{
    filter: blur(1px);
    opacity: 80%;
}
input{
    padding: 0.5rem 0.5rem;
    width: 60%;
    max-width: 350px;
    font-size: 1rem;
    text-align: start;
    border: none;
    border-radius: 30px;
    font-family: "Cascadia_Mono", "Orbitron", "IBM Plex Sans Arabic" !important;
    background-color: rgba(252, 250, 241, 0.16);
    border: 1px solid var(--borderColor);
    color: var(--txtColor);

    text-align: start;

    transition: 0.2s linear(0, 0.067, 0.1294, 0.1877, 0.2421, 0.2929, 0.3402, 0.3844, 0.4257, 0.4641, 0.5, 0.5335, 0.5647, 0.5939, 0.6211, 0.6464, 0.6701, 0.6922, 0.7128, 0.7321, 0.75, 0.7667, 0.7824, 0.7969, 0.8105, 0.8232, 0.8351, 0.8461, 0.8564, 0.866, 0.875, 0.8834, 0.8912, 0.8985, 0.9053, 0.9116, 0.9175, 0.9231, 0.9282, 0.933, 0.9375, 0.9417, 0.9456, 0.9492, 0.9526, 0.9558, 0.9588, 0.9615, 0.9641, 0.9665, 0.9688, 0.9708, 0.9728, 0.9746, 0.9763, 0.9779, 0.9794, 0.9808, 0.9821, 0.9833, 0.9844, 0.9854, 0.9864, 0.9873, 0.9882, 0.989, 0.9897, 0.9904, 0.991, 0.9916, 0.9922, 0.9927, 0.9932, 0.9937, 0.9941, 0.9945, 0.9948, 0.9952, 0.9955, 0.9958, 0.9961, 0.9964, 0.9966, 0.9968, 0.997, 0.9972, 0.9974, 0.9976, 0.9978, 0.9979, 0.998, 0.9982, 0.9983, 0.9984, 0.9985, 0.9986, 0.9987, 0.9988, 0.9989, 0.999, 1);
}
input:hover, input:focus{
    border: 1px solid var(--borderColorLight);
    outline: none;
}
p
{
    transition: 0.5s linear(0, 0.067, 0.1294, 0.1877, 0.2421, 0.2929, 0.3402, 0.3844, 0.4257, 0.4641, 0.5, 0.5335, 0.5647, 0.5939, 0.6211, 0.6464, 0.6701, 0.6922, 0.7128, 0.7321, 0.75, 0.7667, 0.7824, 0.7969, 0.8105, 0.8232, 0.8351, 0.8461, 0.8564, 0.866, 0.875, 0.8834, 0.8912, 0.8985, 0.9053, 0.9116, 0.9175, 0.9231, 0.9282, 0.933, 0.9375, 0.9417, 0.9456, 0.9492, 0.9526, 0.9558, 0.9588, 0.9615, 0.9641, 0.9665, 0.9688, 0.9708, 0.9728, 0.9746, 0.9763, 0.9779, 0.9794, 0.9808, 0.9821, 0.9833, 0.9844, 0.9854, 0.9864, 0.9873, 0.9882, 0.989, 0.9897, 0.9904, 0.991, 0.9916, 0.9922, 0.9927, 0.9932, 0.9937, 0.9941, 0.9945, 0.9948, 0.9952, 0.9955, 0.9958, 0.9961, 0.9964, 0.9966, 0.9968, 0.997, 0.9972, 0.9974, 0.9976, 0.9978, 0.9979, 0.998, 0.9982, 0.9983, 0.9984, 0.9985, 0.9986, 0.9987, 0.9988, 0.9989, 0.999, 1);
}
.jensBox
{
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    box-shadow: 0 0 4px 0 var(--blue);
}
.catBox
{
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
}
.sellerBox
{
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    box-shadow: 0 0 4px 0 var(--shadowColor);
}
.searchRes:first-of-type
{
    margin-top: 200px !important;
}
#overlay
{
    position: fixed;
    inset: 0;
    z-index: 10;

    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center;
    
    background:rgba(56,189,248,0.08);
    /* backdrop-filter: blur(100px);
    -webkit-backdrop-filter: blur(100px); */
    opacity: 0%;
    pointer-events: none;

    overflow-y: scroll;

    transition: 0.5s linear(0, 0.067, 0.1294, 0.1877, 0.2421, 0.2929, 0.3402, 0.3844, 0.4257, 0.4641, 0.5, 0.5335, 0.5647, 0.5939, 0.6211, 0.6464, 0.6701, 0.6922, 0.7128, 0.7321, 0.75, 0.7667, 0.7824, 0.7969, 0.8105, 0.8232, 0.8351, 0.8461, 0.8564, 0.866, 0.875, 0.8834, 0.8912, 0.8985, 0.9053, 0.9116, 0.9175, 0.9231, 0.9282, 0.933, 0.9375, 0.9417, 0.9456, 0.9492, 0.9526, 0.9558, 0.9588, 0.9615, 0.9641, 0.9665, 0.9688, 0.9708, 0.9728, 0.9746, 0.9763, 0.9779, 0.9794, 0.9808, 0.9821, 0.9833, 0.9844, 0.9854, 0.9864, 0.9873, 0.9882, 0.989, 0.9897, 0.9904, 0.991, 0.9916, 0.9922, 0.9927, 0.9932, 0.9937, 0.9941, 0.9945, 0.9948, 0.9952, 0.9955, 0.9958, 0.9961, 0.9964, 0.9966, 0.9968, 0.997, 0.9972, 0.9974, 0.9976, 0.9978, 0.9979, 0.998, 0.9982, 0.9983, 0.9984, 0.9985, 0.9986, 0.9987, 0.9988, 0.9989, 0.999, 1);
}
.hoverCursor:hover, .hoverCursor:focus
{
    cursor: pointer;
}
.textGo
{
    opacity: 0% !important;
    filter: blur(10px) !important;
}
.textGop
{
    opacity: 0% !important;
    filter: blur(10px) !important;
    width: 0 !important;
    height: 0 !important;
}
.noRad
{
    border-radius: 0 !important;
    opacity: 0% !important;
    filter: blur(10px) !important;
    pointer-events: none !important;
}
.shO
{
    background-color: rgba(255, 255, 255, 0.5);
    opacity: 100% !important;
    pointer-events: all !important;
}
#overlayText
{
    font-size: 2rem;
    font-weight: 200;
    border-bottom: 1px solid;

    transform: translateY(10px);
    filter: blur(10px);

    transition: 0.2s linear(0, 0.067, 0.1294, 0.1877, 0.2421, 0.2929, 0.3402, 0.3844, 0.4257, 0.4641, 0.5, 0.5335, 0.5647, 0.5939, 0.6211, 0.6464, 0.6701, 0.6922, 0.7128, 0.7321, 0.75, 0.7667, 0.7824, 0.7969, 0.8105, 0.8232, 0.8351, 0.8461, 0.8564, 0.866, 0.875, 0.8834, 0.8912, 0.8985, 0.9053, 0.9116, 0.9175, 0.9231, 0.9282, 0.933, 0.9375, 0.9417, 0.9456, 0.9492, 0.9526, 0.9558, 0.9588, 0.9615, 0.9641, 0.9665, 0.9688, 0.9708, 0.9728, 0.9746, 0.9763, 0.9779, 0.9794, 0.9808, 0.9821, 0.9833, 0.9844, 0.9854, 0.9864, 0.9873, 0.9882, 0.989, 0.9897, 0.9904, 0.991, 0.9916, 0.9922, 0.9927, 0.9932, 0.9937, 0.9941, 0.9945, 0.9948, 0.9952, 0.9955, 0.9958, 0.9961, 0.9964, 0.9966, 0.9968, 0.997, 0.9972, 0.9974, 0.9976, 0.9978, 0.9979, 0.998, 0.9982, 0.9983, 0.9984, 0.9985, 0.9986, 0.9987, 0.9988, 0.9989, 0.999, 1);
}
.trans
{
    transition: 1s linear(0, 0.0104, 0.0392, 0.083, 0.1387, 0.2033, 0.2741, 0.3487, 0.4251, 0.5015, 0.5763, 0.6482, 0.7162, 0.7796, 0.8378, 0.8903, 0.937, 0.9779, 1.013, 1.0424, 1.0665, 1.0856, 1.1, 1.1102, 1.1166, 1.1197, 1.1199, 1.1176, 1.1133, 1.1074, 1.1002, 1.0921, 1.0833, 1.0742, 1.065, 1.0559, 1.0471, 1.0386, 1.0307, 1.0233, 1.0166, 1.0106, 1.0053, 1.0007, 0.9968, 0.9936, 0.9909, 0.9889, 0.9874, 0.9864, 0.9858, 0.9856, 0.9857, 0.9861, 0.9867, 0.9875, 0.9884, 0.9894, 0.9905, 0.9916, 0.9927, 0.9938, 0.9948, 0.9958, 0.9967, 0.9976, 0.9983, 0.999, 0.9996, 1.0001, 1.0006, 1.0009, 1.0012, 1.0014, 1.0016, 1.0017, 1.0017, 1.0017, 1.0017, 1.0016, 1.0016, 1.0015, 1.0013, 1.0012, 1.0011, 1.001, 1.0008, 1.0007, 1.0006, 1.0005, 1.0003, 1.0003, 1.0002, 1.0001, 1, 1, 0.9999, 0.9999, 0.9998, 0.9998, 1);
}
.header
{
    padding: 0;
    margin: 0;
    width: 100%;
    height: 60px;

    font-size: 1.5rem;
    font-weight: 200;

    z-index: 100;
    background-color: rgba(255, 255, 255, 0.5);
    backdrop-filter: blur(100px);
    -webkit-backdrop-filter: blur(100px);
    border: 1px solid var(--borderColorLight);

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

    position: sticky;
    top: 0;
}
.headerDiv1
{
    height: 100%;
    width: 10%;
}
.txtHead
{
    opacity: 0% !important;
    scale: 80% !important;
    filter: blur(10px) !important;
}
#txtHeading
{
    transition: 1s linear(0, 0.067, 0.1294, 0.1877, 0.2421, 0.2929, 0.3402, 0.3844, 0.4257, 0.4641, 0.5, 0.5335, 0.5647, 0.5939, 0.6211, 0.6464, 0.6701, 0.6922, 0.7128, 0.7321, 0.75, 0.7667, 0.7824, 0.7969, 0.8105, 0.8232, 0.8351, 0.8461, 0.8564, 0.866, 0.875, 0.8834, 0.8912, 0.8985, 0.9053, 0.9116, 0.9175, 0.9231, 0.9282, 0.933, 0.9375, 0.9417, 0.9456, 0.9492, 0.9526, 0.9558, 0.9588, 0.9615, 0.9641, 0.9665, 0.9688, 0.9708, 0.9728, 0.9746, 0.9763, 0.9779, 0.9794, 0.9808, 0.9821, 0.9833, 0.9844, 0.9854, 0.9864, 0.9873, 0.9882, 0.989, 0.9897, 0.9904, 0.991, 0.9916, 0.9922, 0.9927, 0.9932, 0.9937, 0.9941, 0.9945, 0.9948, 0.9952, 0.9955, 0.9958, 0.9961, 0.9964, 0.9966, 0.9968, 0.997, 0.9972, 0.9974, 0.9976, 0.9978, 0.9979, 0.998, 0.9982, 0.9983, 0.9984, 0.9985, 0.9986, 0.9987, 0.9988, 0.9989, 0.999, 1) !important;
}
.headerDiv1Text
{
    font-size: 3rem;

    font-weight: 500;
    padding-left: 0.5rem;
    margin-bottom: 1rem;
}
.headerDiv2
{
    height: 100%;
    width: 100%;
    
    padding-right: 1rem;
    
    display: flex;
    justify-content: flex-end;
    align-items: center;
}
.headerDiv2Div0
{
    display: flex;
    justify-content: space-evenly;
    align-items: center;

    border-radius: 8px;
    border: 1px solid var(--borderColor);

    transition: 0.5s linear(0, 0.067, 0.1294, 0.1877, 0.2421, 0.2929, 0.3402, 0.3844, 0.4257, 0.4641, 0.5, 0.5335, 0.5647, 0.5939, 0.6211, 0.6464, 0.6701, 0.6922, 0.7128, 0.7321, 0.75, 0.7667, 0.7824, 0.7969, 0.8105, 0.8232, 0.8351, 0.8461, 0.8564, 0.866, 0.875, 0.8834, 0.8912, 0.8985, 0.9053, 0.9116, 0.9175, 0.9231, 0.9282, 0.933, 0.9375, 0.9417, 0.9456, 0.9492, 0.9526, 0.9558, 0.9588, 0.9615, 0.9641, 0.9665, 0.9688, 0.9708, 0.9728, 0.9746, 0.9763, 0.9779, 0.9794, 0.9808, 0.9821, 0.9833, 0.9844, 0.9854, 0.9864, 0.9873, 0.9882, 0.989, 0.9897, 0.9904, 0.991, 0.9916, 0.9922, 0.9927, 0.9932, 0.9937, 0.9941, 0.9945, 0.9948, 0.9952, 0.9955, 0.9958, 0.9961, 0.9964, 0.9966, 0.9968, 0.997, 0.9972, 0.9974, 0.9976, 0.9978, 0.9979, 0.998, 0.9982, 0.9983, 0.9984, 0.9985, 0.9986, 0.9987, 0.9988, 0.9989, 0.999, 1);
}
.headerDiv2Div0Div1
{
    height: 50px;
    width: 50px;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}
.headerDiv2Div0Div1:hover, .headerDiv2Div0Div1:focus
{
    cursor: pointer;
}
.headerDiv2Div0Div2
{
    border-left: 1px solid var(--borderColorLight);
    display: flex;
    flex-direction: row-reverse;
    justify-content: flex-start;
    align-items: center;
}
.headerDiv2Div0Div2:hover, .headerDiv2Div0Div2:focus
{
    cursor: pointer;
}
.headerDiv2Div0Div2Div0
{
    height: 50px;
    width: 50px;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    filter: invert(100%) brightness(100%);
}
.headerDiv2Div0Div2Div1
{
    font-size: 1rem;
    text-align: center;

    font-family: "Cascadia_Mono", "Orbitron", "IBM Plex Sans Arabic";

    padding: 0 0.6rem;

    margin-bottom: 0.5rem;
}
.headerDiv2Div1
{
    display: flex;
    justify-content: center;
    align-items: center;

    border-radius: 10px;
    border: 1px solid var(--borderColor);

    transition: 0.5s linear(0, 0.067, 0.1294, 0.1877, 0.2421, 0.2929, 0.3402, 0.3844, 0.4257, 0.4641, 0.5, 0.5335, 0.5647, 0.5939, 0.6211, 0.6464, 0.6701, 0.6922, 0.7128, 0.7321, 0.75, 0.7667, 0.7824, 0.7969, 0.8105, 0.8232, 0.8351, 0.8461, 0.8564, 0.866, 0.875, 0.8834, 0.8912, 0.8985, 0.9053, 0.9116, 0.9175, 0.9231, 0.9282, 0.933, 0.9375, 0.9417, 0.9456, 0.9492, 0.9526, 0.9558, 0.9588, 0.9615, 0.9641, 0.9665, 0.9688, 0.9708, 0.9728, 0.9746, 0.9763, 0.9779, 0.9794, 0.9808, 0.9821, 0.9833, 0.9844, 0.9854, 0.9864, 0.9873, 0.9882, 0.989, 0.9897, 0.9904, 0.991, 0.9916, 0.9922, 0.9927, 0.9932, 0.9937, 0.9941, 0.9945, 0.9948, 0.9952, 0.9955, 0.9958, 0.9961, 0.9964, 0.9966, 0.9968, 0.997, 0.9972, 0.9974, 0.9976, 0.9978, 0.9979, 0.998, 0.9982, 0.9983, 0.9984, 0.9985, 0.9986, 0.9987, 0.9988, 0.9989, 0.999, 1);
}
.headerDiv2Div1Text
{
    justify-self: center;
    text-align: center;

    padding: 0.5rem 1rem;

    color: var(--txtColor);
    text-decoration: none;
    font-size: 1rem;
}
.headerDiv2Div1:hover
{
    border-color: var(--borderColorLight);
}
.searchHolder
{
    margin-left: auto;
    margin-right: auto;
    margin-top: 1rem;
    width: 80%;
    max-width: 450px;
    display: flex;
    justify-content: center;
    align-items: center;

    position: fixed;
    top: 70px;
    left: 0;
    right: 0;
}
.searchHolder2
{
    margin-left: auto;
    margin-right: auto;
    margin-top: 1rem;
    width: 80%;
    max-width: 450px;
    display: flex;
    justify-content: center;
    align-items: center;

    position: fixed;
    top: 50px;
    left: 0;
    right: 0;
}
.shg
{
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}
.searchGone
{
    opacity: 0% !important;
    filter: blur(10px) !important;
    transform: translateY(-20px) !important;
    pointer-events: none !important;
}
.searchIcon
{
    flex-shrink: 0;
    width: 36px;
    height: 36px;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    filter: invert(0%) brightness(100%);

    border: 1px solid var(--borderColor);

    border-top-left-radius: 24px;
    border-bottom-left-radius: 24px;
}
.searchIcon3
{
    flex-shrink: 0;
    width: 52px;
    height: 52px;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    filter: invert(0%) brightness(100%);

    border: 1px solid var(--borderColor);

    border-radius: 50%;

    background-color: rgba(255, 255, 255, 0.5);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}
.searchIcon:hover, .searchIcon:focus
{
    cursor: pointer;
}
.searchIcon2
{
    flex-shrink: 0;
    width: 36px;
    height: 36px;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    filter: invert(0%) brightness(100%);

    border: 1px solid var(--borderColor);

    border-top-right-radius: 24px;
    border-bottom-right-radius: 24px;

    transition: 0.5s linear(0, 0.067, 0.1294, 0.1877, 0.2421, 0.2929, 0.3402, 0.3844, 0.4257, 0.4641, 0.5, 0.5335, 0.5647, 0.5939, 0.6211, 0.6464, 0.6701, 0.6922, 0.7128, 0.7321, 0.75, 0.7667, 0.7824, 0.7969, 0.8105, 0.8232, 0.8351, 0.8461, 0.8564, 0.866, 0.875, 0.8834, 0.8912, 0.8985, 0.9053, 0.9116, 0.9175, 0.9231, 0.9282, 0.933, 0.9375, 0.9417, 0.9456, 0.9492, 0.9526, 0.9558, 0.9588, 0.9615, 0.9641, 0.9665, 0.9688, 0.9708, 0.9728, 0.9746, 0.9763, 0.9779, 0.9794, 0.9808, 0.9821, 0.9833, 0.9844, 0.9854, 0.9864, 0.9873, 0.9882, 0.989, 0.9897, 0.9904, 0.991, 0.9916, 0.9922, 0.9927, 0.9932, 0.9937, 0.9941, 0.9945, 0.9948, 0.9952, 0.9955, 0.9958, 0.9961, 0.9964, 0.9966, 0.9968, 0.997, 0.9972, 0.9974, 0.9976, 0.9978, 0.9979, 0.998, 0.9982, 0.9983, 0.9984, 0.9985, 0.9986, 0.9987, 0.9988, 0.9989, 0.999, 1);

}
.searchIcon2:hover, .searchIcon2:focus
{
    cursor: pointer;
}
.mother
{
    margin-top: 4rem;
    margin-bottom: 4rem;
    margin-left: auto;
    margin-right: auto;
    padding: 1rem 0;
    width: 99%;
    
    border-radius: 16px;
    box-shadow: 0 0 4px 0 var(--shadowColor);

    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center;
}
.search
{
    text-align: center;
    border-radius: 24px;

    background-color: rgb(252, 252, 255);
    backdrop-filter: blur(100px);
    -webkit-backdrop-filter: blur(100px);

    transition: 0.5s linear(0, 0.067, 0.1294, 0.1877, 0.2421, 0.2929, 0.3402, 0.3844, 0.4257, 0.4641, 0.5, 0.5335, 0.5647, 0.5939, 0.6211, 0.6464, 0.6701, 0.6922, 0.7128, 0.7321, 0.75, 0.7667, 0.7824, 0.7969, 0.8105, 0.8232, 0.8351, 0.8461, 0.8564, 0.866, 0.875, 0.8834, 0.8912, 0.8985, 0.9053, 0.9116, 0.9175, 0.9231, 0.9282, 0.933, 0.9375, 0.9417, 0.9456, 0.9492, 0.9526, 0.9558, 0.9588, 0.9615, 0.9641, 0.9665, 0.9688, 0.9708, 0.9728, 0.9746, 0.9763, 0.9779, 0.9794, 0.9808, 0.9821, 0.9833, 0.9844, 0.9854, 0.9864, 0.9873, 0.9882, 0.989, 0.9897, 0.9904, 0.991, 0.9916, 0.9922, 0.9927, 0.9932, 0.9937, 0.9941, 0.9945, 0.9948, 0.9952, 0.9955, 0.9958, 0.9961, 0.9964, 0.9966, 0.9968, 0.997, 0.9972, 0.9974, 0.9976, 0.9978, 0.9979, 0.998, 0.9982, 0.9983, 0.9984, 0.9985, 0.9986, 0.9987, 0.9988, 0.9989, 0.999, 1);
}
.searchSec
{
    background-color: transparent !important;
    border-radius: 0;
    width: 300px;
}
.footerHolder
{
    width: 60%;
    height: 100px;
    max-width: 400px;

    position: fixed;
    bottom: 1rem;
    left: auto;
    right: auto;

    background-color: rgba(0, 0, 0, 0.01);
    backdrop-filter: blur(100px);
    -webkit-backdrop-filter: blur(100px);
    border: 1px solid var(--borderColorLight);

    border-radius: 30px;

    display: flex;
    justify-content: space-evenly;
    align-items: center;
    
    transition: 0.5s linear(0, 0.067, 0.1294, 0.1877, 0.2421, 0.2929, 0.3402, 0.3844, 0.4257, 0.4641, 0.5, 0.5335, 0.5647, 0.5939, 0.6211, 0.6464, 0.6701, 0.6922, 0.7128, 0.7321, 0.75, 0.7667, 0.7824, 0.7969, 0.8105, 0.8232, 0.8351, 0.8461, 0.8564, 0.866, 0.875, 0.8834, 0.8912, 0.8985, 0.9053, 0.9116, 0.9175, 0.9231, 0.9282, 0.933, 0.9375, 0.9417, 0.9456, 0.9492, 0.9526, 0.9558, 0.9588, 0.9615, 0.9641, 0.9665, 0.9688, 0.9708, 0.9728, 0.9746, 0.9763, 0.9779, 0.9794, 0.9808, 0.9821, 0.9833, 0.9844, 0.9854, 0.9864, 0.9873, 0.9882, 0.989, 0.9897, 0.9904, 0.991, 0.9916, 0.9922, 0.9927, 0.9932, 0.9937, 0.9941, 0.9945, 0.9948, 0.9952, 0.9955, 0.9958, 0.9961, 0.9964, 0.9966, 0.9968, 0.997, 0.9972, 0.9974, 0.9976, 0.9978, 0.9979, 0.998, 0.9982, 0.9983, 0.9984, 0.9985, 0.9986, 0.9987, 0.9988, 0.9989, 0.999, 1);
}
.footerHolder{
    background:rgba(255,255,255,0.7);
    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);
    border-top:1px solid rgba(191,230,255,0.95);
    box-shadow:0 -8px 24px rgba(56,189,248,0.08);
}
.footerLeft
{
    width: 60px;
    height: 60px;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    filter: invert(100%) brightness(100%);
}
.footerMid
{
    width: 60px;
    height: 60px;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    filter: invert(100%) brightness(100%);
}
.footerRight
{
    width: 60px;
    height: 60px;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    filter: invert(100%) brightness(100%);
}
h1, h2
{
    font-weight: 800;
}
.fi:hover, .fi:focus
{
    cursor: pointer;
}


:root{

    --bgColor:#eef6ff;
    --cardBg:rgba(255,255,255,0.78);

    --blue:#38bdf8;

    --textColor:#0b1b2b;
    --muteColor:#5f7d95;

    --borderColorLight:#bfe6ff;

    --shadowColor:#9ddcff;


    --errColor: hsl(340, 100%, 50%);

    --dalalBg:#7dd3fc;
}

body{
    background:
        radial-gradient(circle at 15% 10%, rgba(56,189,248,0.18), transparent 32%),
        radial-gradient(circle at 85% 85%, rgba(125,211,252,0.16), transparent 30%),
        linear-gradient(180deg, #f8fcff 0%, #eef6ff 100%);
    color:var(--textColor);
    font-family: "Cascadia_Mono", "Orbitron", "IBM Plex Sans Arabic";
}

.header{
    background:rgba(255,255,255,0.6);
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
    border-bottom:1px solid rgba(191,230,255,0.9);
    box-shadow:0 0 8px rgba(56,189,248,0.08);
}

.headerDiv1Text{
    color:#0ea5e9;
    text-shadow:0 0 8px rgba(56,189,248,0.25);
}

.headerDiv2Div1{
    background:rgba(255,255,255,0.72);
    border:1px solid var(--borderColorLight);
    box-shadow:0 0 16px rgba(56,189,248,0.08);
}

.headerDiv2Div1Text{
    color:var(--textColor);
}

.search{
    background:transparent;
    color:var(--textColor);
}

.search::placeholder{
    color:var(--muteColor);
}

div[style*="border: 1px solid var(--borderColorLight)"]{
    background:rgba(255,255,255,0.5);
    box-shadow:inset 0 0 0 1px rgba(255,255,255,0.25);
}

.resBox{
    background:linear-gradient(145deg, rgba(255,255,255,0.88), rgba(239,248,255,0.72));
    border:1px solid #bfe6ff !important;
    box-shadow:
        0 0 12px rgba(56,189,248,0.08),
        0 0 0 1px rgba(255,255,255,0.6) inset;
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
}

.resBox:hover{
    box-shadow:
        0 0 8px rgba(56,189,248,0.18),
        0 0 16px rgba(56,189,248,0.12);
}

.resBox p,
.resBox h2,
.resBox h3{
    color:var(--textColor);
}

.resBox p[style*="color: var(--muteColor)"],
p[style*="color: var(--muteColor)"],
h3[style*="color: var(--muteColor)"]{
    color:var(--muteColor) !important;
}


.resBox1{
    background:linear-gradient(145deg, rgba(255,255,255,0.88), rgba(239,248,255,0.72));
    border:1px solid #bfe6ff !important;
    box-shadow:
        0 0 12px rgba(56,189,248,0.08),
        0 0 0 1px rgba(255,255,255,0.6) inset;
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
}
.resBox1:hover{
    box-shadow:
        0 0 8px rgba(56,189,248,0.18),
        0 0 16px rgba(56,189,248,0.12);
}
.resBox1 p,
.resBox1 h2,
.resBox1 h3{
    color:var(--textColor);
}
.resBox1 p[style*="color: var(--muteColor)"],
p[style*="color: var(--muteColor)"],
h3[style*="color: var(--muteColor)"]{
    color:var(--muteColor) !important;
}


h2[style*="background-color: var(--dalalBg)"]{
    background:linear-gradient(135deg, #7dd3fc 0%, #38bdf8 100%) !important;
    color:#ffffff;
    box-shadow:0 0 8px rgba(56,189,248,0.20) !important;
}

a{
    color:#0ea5e9;
    text-decoration:none;
}

.footerHolder p{
    color:var(--textColor);
}
/* floating action buttons */
div[style*="border-radius: 50%; background: linear-gradient(45deg, var(--sucColor) 0%, var(--blue) 100%)"],
div[style*="border-radius: 50%; background: linear-gradient(0deg, var(--sucColor) 0%, var(--blue) 100%)"],
div[style*="border-radius: 50%; background: linear-gradient(0deg, var(--sucColor) 0%, var(--errColor) 100%)"]{
    box-shadow:0 0 12px 0 rgba(56,189,248,0.18);
}

@media (max-width: 1000px)
{
    .resBox
    {
        width: 250px !important;
    }
    .searchSec
    {
        width: 220px;
    }
    .headerDiv1
    {
        width: 40%;
    }
    .headerDiv1Text
    {
        font-size: 2.5rem;
        margin-top: 0.2rem;
        margin-left: 0.2rem;
    }
    .headerDiv2Div0Div2Div1
    {
        font-size: 0.8rem;
        margin-bottom: 0;
    }
}