@font-face {
    font-family: 'Overpass';
    src: url('../../../frameworks/fonts/Overpass-VariableFont_wght.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Overpass';
    src: url('../../../frameworks/fonts/Overpass-Italic-VariableFont_wght.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
}

/* Renk Değişkenleri */
:root {
    --black: #000;
    --white: #FFF;
    --blue: #27356f;
    --blue_dark: #263170;
    --blue_light: #007bff;
    --radial_gradient: radial-gradient(circle at 120.71% 50%, #7544f3 0, #3c3cf2 50%, #0037f1 100%);
    --linear_gradient: linear-gradient(130deg, #213782 0%, #1f3782 24.26%, #2c4496 59.41%, #359cd3 100%);
    --linear_gradient_mini: linear-gradient(135deg, #7544f3, #0037f1);
    --linear_gradient_right: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.9) 25%, rgba(255, 255, 255, 0.9) 75%, rgba(255, 255, 255, 0) 100%);
    --selection_bg: #6c63ff1f;
    --purple_accent: #6A5ACD;
    --blue_lavender: #6C63FF;
    --blue_lavender_alpha: #6c63ff12;
    --gray: #ececed;
    --gray_light: #f7f7f7;
    --gray_color: #f4f4f8;
    --turksat: linear-gradient(to right,rgba(53,156,211,1) 0,rgba(44,69,150,1) 100%);
}

* {
    margin: 0;
    padding: 0;
    outline: none;
    font-family: 'Overpass', Arial, sans-serif;
    /* border: 1px solid red; */
}

body {
    background: var(--white) !important;
}

*::selection {
    background: var(--selection_bg);
    color: var(--blue_lavender);
    text-decoration: underline;
}

*::-webkit-scrollbar {
    width: 7px;
    height: 5px;
    background-color: var(--purple_accent);
    cursor: pointer;
}

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

*::-webkit-scrollbar-thumb {
    /* border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px; */
    background: var(--blue_lavender);
}

*::-webkit-scrollbar-thumb:hover {
    background: var(--purple_accent);
}

html {
    scroll-behavior: smooth;
}

a {
    text-decoration: none !important;
}

.opacity-10 {
    opacity: .10 !important;
}

hr {
    opacity: .3 !important;
}

hr.dotted {
    border-top-style: dotted;
}

select {
    border: var(--bs-border-width) solid var(--bs-border-color);
    border-radius: var(--bs-border-radius);
    padding: .375rem .75rem;
    opacity: .8;
    color: var(--bs-body-color);
}

input:-webkit-autofill,
input:autofill,
input:-internal-autofill-selected {
    background: var(--white) !important;
    color: var(--black) !important;
}

.formBtn {
    background: var(--linear_gradient_mini);
    opacity: .8;
    color: var(--light_a);
    padding: 10px 20px;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    transition: all .5s;
    -webkit-transition: all .5s;
    -moz-transition: all .5s;
    -ms-transition: all .5s;
    -o-transition: all .5s;
}

.formBtn i {
    margin-right: 5px;
}

.formBtn:hover {
    opacity: 1;
}

main {
    padding: 20px;
}

#content {
    box-shadow: 0 1px 3px 0 rgb(0 0 0 / .05), 0 1px 1px -1px rgb(0 0 0 / .05);
    background: #fefefe;
    margin: 15px;
    border-radius: 5px;
}

.navigator {
    border-bottom: 1px dashed #ffffff2e;
    padding-bottom: 15px;
}

.navigator a {
    color: inherit;
    opacity: .8;
    transition: all .5s;
}

.navigator a:hover {opacity: 1; color: var(--white);}

.navigator span {
    color: inherit;
    background: var(--custom_gray_light);
    padding: 5px 10px;
    border-radius: 5px;
}

#error404 {
    text-align: center;
    background: var(--turksat);
    color: var(--white);
    padding: 50px;
    border-radius: 10px;
    margin: 30px;
}

#error404 h3 {
    font-size: 150px !important;
}

@media screen and (max-width: 800px) {
    #error404 h3 {
        font-size: 50px !important;
    }
}