@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;700&family=Tajawal:wght@400;700&display=swap');

:root {
    /* --primaryColor: #1db8f8;
    --middleColor: #393E46;
    --helperColor: #39395b;
    --lightHelper: #1C1C35;
    --hrColor: #A9B5DF;
    --transparentColor: rgba(0, 0, 0, 0.699);
    --shadow: rgba(189, 188, 188, 0.514); */
    --e-global-color-primary: #2B1661;
    --e-global-color-secondary: #9F9F9F;
    --e-global-color-text: #3F2385;
    --e-global-color-accent: #006BF7;
    --e-global-color-913edee: #8E77C9;
    --e-global-color-01ceb56: var(--white);
    --black-2: #121212;
    --black-4: #1d1d1d
    ;
    /* --------------------------------- */
    --whatsappColor: #25D366;
    --white: #ffff;
    --blue: #1877F2;
    --green: #25D366;
    --gray: #f8f8f8;
    --info-color: #17c0db;
    --dark-color: #343a40;
    --success-color: #22b544;
    --danger-color: #de3131;
    --warning-color: #f4bb0e;
    --container-width: 1340px;
    --header-height: 90px;
    /* ------------------------------------- */
    /* --component-shadow: none;
    --component-background: var(--white);
    --component-color: #343a40;
    --component-padding: 15px;
    --medium-weight: 500;
    --forms-height-small: 35px;
    --forms-radius: 5px;
    --strong-weight: 700; */


}
.d-none1{
    display: none;
}
body::-webkit-scrollbar {
    width: 8px
}

body::-webkit-scrollbar-track {
    background-color: transparent
}

body::-webkit-scrollbar-thumb {
    background-color: var(--e-global-color-primary);
    background-image: linear-gradient(0deg, var(--e-global-color-primary) 0%, var(--e-global-color-913edee) 100%);
    border-radius: 5px
}
body{
    color: var(--white);
}
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Cairo', 'Tajawal', sans-serif;
}

.dark {
    background-color: var(--black-2);
}

a {
    text-decoration: none;
    transition: all 0.5s;
    color: inherit;

}

ul {
    list-style: none;
}

img {
    border-style: none;
    max-width: 100%;
    height: auto;
    display: inline-block;
    vertical-align: middle;
}


.container {
        margin: 0 auto;
        position: relative;
        max-width: 1200px;
}
@media (max-width: 1200px) {
    .container {
        padding: 0 50px;
    }
    
}
@media (max-width: 768px) {
    .container {
        padding: 0 25px;
    }
    
}