/*--------- COLORS ----------------------------*/


@media (prefers-color-scheme: light) {
    /* :root {
        color-scheme: light;
    } */
}

@media (prefers-color-scheme: dark) {
    /* :root {
        color-scheme: dark;
    } */

    /* img {
		filter: brightness(80%);
	  } */


}


.dark-theme {
    color-scheme: dark;

    --color8: #f5f9ff;
    --color7: #e4e6f7;
    --color6: #b5bed0;
    --color5: #7482A1;
    --color4: #555b81;
    --color3: #44466c;
    --color2: #1d213f;
    --color1: #101623;
    --color0: #111a2c9a;
    --color0: #0e1729c7;

    /* --color2: #2b3058; */

    --textLight: #c0c6d8;
    --textDark: #071937;

    --brightness: brightness(94%);

    /* --videofilter: url('#bluefill') brightness(0.2); */
    /* --videofilter: hue-rotate(182deg) brightness(97%) invert(100%) opacity(100%); */
    --videofilter: hue-rotate(194deg) brightness(70%) invert(100%) opacity(72%) contrast(223%);


    --LightSchemeOn: none !important;
    --DarkSchemeOn: flex !important;

   
    --gradient1: linear-gradient(-9deg, var(--color2), var(--color1) 142%);
    --gradient2: linear-gradient(-6deg, var(--color2) 0%, var(--color3) 142%);
    --gradient3: linear-gradient(-9deg, var(--color1) 56%, var(--color3) 110%);
   

}


.light-theme {
    color-scheme: light;

    --color0: #ffffffa3;
    --color1: #ffffff;
    --color2: #f1f3ff;
    --color3: #ebecfb;
    --color4: #cad6f0;
    --color5: #9099c3;
    --color6: #44466c;
    --color7: #2b3058;
    --color8: #101623;

    --textLight: #081b3a;
    --textDark: #fff;

    --brightness: brightness(100%);

    /* --videofilter: url('#blur'); */
    --videofilter: none;

    --LightSchemeOn: flex !important;
    --DarkSchemeOn: none !important;

    
    --gradient1: linear-gradient(-9deg, var(--color2), var(--color1) 142%);
    --gradient2: linear-gradient(-6deg, var(--color2) 0%, var(--color3) 142%);
    --gradient3: linear-gradient(-9deg, var(--color1) 56%, var(--color3) 110%);
 

}

:root {

--light: #ffffff;
--accent0: #fad4f2;
--accent1: #ffbe00;
--accent2: #3a73eb;
--accent3: #61d032;
--accent5: #00b7b3;
--accent6: #00b77d;
--accent7: #5473A9;
--accent8: #6A90D3;


/*--------- HEADER ----------------------------*/
--telegramColor: var(--accent8) !important;
--telegramHover: var(--accent7) !important;
--WhatsAppColor: var(--accent5) !important;
--WhatsAppHover: var(--accent6) !important;



/*--------- NAVIGATION ------------------------*/
/* --MenuColor: linear-gradient(180deg, var(--MainColor), var(--MainColor) calc(100% - 4px), var(--MainColor) calc(100% - 4px)) !important; */

--contentWidth: 1152px;

}


.dark-scheme-hide {
    display: var(--DarkSchemeOn) !important;
}

.light-scheme-hide {
    display: var(--LightSchemeOn) !important;
}


.theme-icon-color {
    fill: var(--color6);
}

.theme-icon-color:hover {
    fill: var(--accent1) !important;
}




/*--------------------------------------------------*/
/* overflow-x: clip; */


html,
body {
    padding: 0;
    margin: 0;
    min-width: 100%;
    max-width: 100%;
}

html {
    min-height: 100%;
    font-family: "Onest", sans-serif;
    font-optical-sizing: auto;
    font-weight: 300;
    scroll-behavior: smooth;

}

.pswp__bg {
    background: var(--gradient2);
}


html,
.Copyright-bg {
    background: var(--color1);
}


body {
    height: 100%;
    width: 100%;
    background-color: var(--color1);
    color: var(--textLight);
    /* color: var(--textDark); */
}









/*--------- MAIN ------------------------------*/
/*--------- HEADER ----------------------------*/
/*--------- NAVIGATION ------------------------*/
/*--------- CONTENT ---------------------------*/
.Page-Content {
    /* background: #fff; */
}

.Breadcrumbs-Breadcrumb {
    color: var(--color5);
}



/*--------- INTRO -----------------------------*/
/*--------- TILE ------------------------------*/
/*--------- TABLE -----------------------------*/
/*--------- FOOTER ----------------------------*/

footer {
    color: var(--textLight);
    /* background: var(--color1); */
}



/*----------- BACKGROUND --------------------------------------------------*/
.News-wrapper, .Page-bg {
    background-image: url('https://tester-online.com/img/Blog/newsbg.svg');
}

.Page-Content ul li,
.Footer-List li {
    background-image: url('https://tester-online.com/img/iconsDark.svg#Arrow');
    background-repeat: no-repeat;
}

.LightTheme .Page-Content ul li,
.LightTheme .Footer-List li {
    background-image: url('https://tester-online.com/img/iconsLight.svg#Arrow');
    background-repeat: no-repeat;
}








/*--------- DESCRIPTION -----------------------*/





/*----------- DESCTOP ---------------------------------------------------*/
@media screen and (min-width:769px) {

    html,
    body,
    header {
        min-width: calc(80px + var(--contentWidth));
    }


    /*--------- MAIN ------------------------------*/


    /*--------- SCROLLBAR -----------------------------*/
    ::-webkit-scrollbar-button {
        background-repeat: no-repeat;
        width: 15px;
        height: 0px
    }

    ::-webkit-scrollbar-track {
        background-color: var(--color2);
    }

    ::-webkit-scrollbar-thumb {
        -webkit-border-radius: 0px;
        border-radius: 0px;
        background: linear-gradient(45deg, var(--color1) 0%, var(--color2) 100%);
        width: 10%
    }

    ::-webkit-scrollbar-thumb:hover {
        background: linear-gradient(45deg, var(--color2) 0%, var(--color5) 100%);
    }

    ::-webkit-resizer {
        background-repeat: no-repeat;
        width: 15px;
        height: 0px
    }

    ::-webkit-scrollbar {
        width: 15px;
    }



    /*--------- HEADER ----------------------------*/

    /*--------- NAVIGATION ------------------------*/

    /* .MenuDesktop-Link {
		color: #272a6e;
	}

	a.MenuDesktop-Link:nth-child(1):hover {
		color: #f2c700;
	}

	a.MenuDesktop-Link:nth-child(2):hover {
		color: #307aff;
	}

	a.MenuDesktop-Link:nth-child(3):hover {
		color: #54df0f;
	}

	a.MenuDesktop-Link:nth-child(4):hover {
		color: #f2c700;
	}

	a.MenuDesktop-Link:nth-child(5):hover {
		color: #307aff;
	}

	a.MenuDesktop-Link:nth-child(6):hover {
		color: #54df0f;
	} */



    /*--------- CONTENT ---------------------------*/
    /*--------- INTRO -----------------------------*/
    /*--------- TILE ------------------------------*/
    /*--------- TABLE -----------------------------*/
    /*--------- FOOTER ----------------------------*/
    /*--------- DESCRIPTION -----------------------*/


}



/*----------- MOBILE ----------------------------------------------------*/
@media screen and (max-width:768px) {



    /*--------- MAIN ------------------------------*/
    /*--------- HEADER ----------------------------*/
    /*--------- NAVIGATION ------------------------*/
    /*--------- CONTENT ---------------------------*/
    /*--------- INTRO -----------------------------*/
    /*--------- TILE ------------------------------*/
    /*--------- TABLE -----------------------------*/
    /*--------- FOOTER ----------------------------*/
    /*--------- DESCRIPTION -----------------------*/


}