/*================

=======================*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
    display: block;
}

body {
    line-height: 1;
}

ol, ul {
    list-style: none;
}

blockquote, q {
    quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
    content: '';
    content: none;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}
html{
    overflow-y: scroll;
}

/* -----------------------------------------
           02. BASE TYPOGRAPHY
-------------------------------------------- */

body, h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6, p, .navbar, .brand, .btn, .btn-simple, a, .td-name, td {
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
}

body {
    background-color: #ffffff;
    font-size: 15px;
    font-family: Poppins;
    color: #707070;
    font-weight: 400;
    line-height: 1.75;
}

p:not(:last-child) {
    margin-bottom: 1.25em;
}

h1, h2, h3, h4, h5 {
    margin: 0 0 1rem;
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
    line-height: 1.21;
    color: initial;
}

h1 {
    margin-top: 0;
    font-size: 3.052em;
}

h2 {
    font-size: 2.441em;
}

h3 {
    font-size: 1.953em;
}

h4 {
    font-size: 1.563em;
}

h5 {
    font-size: 1.25em;
}

small, .text_small {
    font-size: 0.8em;
}

strong, b{
    font-weight: 500;
    font-family: 'Montserrat', sans-serif;
}
.badge {
    display: inline;
    padding: .25rem .5rem;
    font-size: 80%;
    font-weight: 700;
    font-family: 'Montserrat', sans-serif;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: .375rem;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}
.badge-pill {
    padding-right: .875em;
    padding-left: .875em;
    border-radius: 50rem;
}
/*========================================
        03. PRE DEFINE CLASS CSS
==========================================*/


.headermenu {
    width: 100%;
    height: 80px;
    background: #0e0e12;
    position: relative;
    text-align: center;
    z-index: 4;
   
}

.wrapp80flex {
    display: flex;
    align-items: center;
    align-content: stretch;
    width: 80%;
    margin: auto;
    justify-content: space-between;
    height: 80px;
}


.leftmenuelemnts {
    width: 25%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}



.rightmenuelemnts {
    width: 25%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.bg-logo2 {
    height: 350px;
    width: 325px;
    margin: 0 auto;
    left: 0;
    right: 0;
    position: relative;
    text-align: center;
    display: inline-block;
}

.shadow {
    -webkit-filter: drop-shadow( 0 10px 10px rgba(0,0,0,.7));
    filter: drop-shadow( 0 10px 10px rgba(0,0,0,.7));
}


.centerlogohead {
    height: 368px;
}


#elSiteTitle, #elLogo {
    flex: 0 1 auto;
    /* min-width: 0; */
    /* display: inline-flex; */
    /* align-items: center; */
    /* align-self: stretch; */
    /* height: var(--header--height); */
    /* z-index: 11; */
    position: absolute;
    left: 49%;
    right: 49%;
    margin: 0 auto;
    text-align: center;
    top: 0px;
}

svg:not(:root) {
    overflow: hidden;
}

.logoimagessa1 {
    filter: blur(0.5px);
    width: 100px;
    margin-top: 20px;
    margin-left: -20px;
}


.logoimagessa1:hover {
    filter: blur(1.5px);
   
}


.linkitemmenuleft {
    padding: 5px 25px;
    background: black;
    border-radius: 3px;
    box-shadow: -2px 2px 0px #007eff52;
       font-size: 13px;
    font-weight: 600;
    color: #eee;
    background: -webkit-linear-gradient(#eee, #484848);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    text-transform: uppercase;
}


.linkitemmenuright {
    padding: 5px 25px;
    background: black;
    border-radius: 3px;
    box-shadow: 2px 2px 0px #007eff52;
        font-size: 13px;
    font-weight: 600;
    color: #eee;
    background: -webkit-linear-gradient(#eee, #484848);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    text-transform: uppercase;
}

.linkitemmenuleft:hover {
    box-shadow: -2px 2px 3px #3434345e;
    color: #1255a8;
    background: -webkit-linear-gradient(#0060d1, #1254a2);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    text-shadow: -1px -1px 6px #0a21c363;
    cursor: pointer;
}



.linkitemmenuright:hover {
   box-shadow: 2px 2px 3px #3434345e;
    color: #1255a8;
    background: -webkit-linear-gradient(#0060d1, #1254a2);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    text-shadow: -1px -1px 6px #0a21c363;
    cursor: pointer;
}


.header-background-inside {
    height: 900px;
    width: 100%;
    background-size: cover;
    background-position: center bottom;
    background-image: url(../img/hero.jpg);
    position: relative;
    margin-bottom: -450px;
    z-index: 0;
}

.effect-layer-inner {
    background-color: #1c81ff;
    mix-blend-mode: overlay;
    z-index: -1;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
}


.effect-layer-inner:before {
    background-color: red;
    mix-blend-mode: color;
    z-index: 0;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
}

.effect-layer-inner:after {
    background-color: #1b1c23;
    mix-blend-mode: lighten;
    z-index: 0;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
}

.elementor-shape[data-negative=false].elementor-shape-bottom, .elementor-shape[data-negative=true].elementor-shape-top {
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
}
.elementor-shape-bottom {
    top: -6px;
}
.elementor-shape {
    overflow: hidden;
    position: relative;
    left: 0;
    width: 100%;
    line-height: 0;
    direction: ltr;
    z-index: 9;
}
.elementor-shape {
    overflow: hidden;
    position: relative;
    left: 0;
    width: 100%;
    line-height: 0;
    direction: ltr;
    z-index: 1;
}
.elementor-shape-bottom {
    bottom: -1px;
}



.elementor-shape .elementor-shape-fill2 {
    fill: #0e0e12;
    -webkit-transform-origin: center;
    -ms-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotateX(-200deg);
    transform: rotateX(-200deg);
}



#particles-js {
    position: absolute;
    height: 700px;
    width: 100%;
    margin: 0 auto;
    margin-right: auto;
    margin-left: auto;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    pointer-events: none;
}

canvas {
    display: inline-block;
}



.joinforumsbutton {
    text-align: center;
    background-image: linear-gradient(180deg, #0e0e12, #0e0e12);
    width: 300px;
    padding: 15px;
    margin: auto;
    margin-top: 100px;
    font-size: 20px;
    color: white;
    border-radius: 4px;
    border: 1px solid #181818;
    box-shadow: 0 0 8px 0px #181818;
    cursor: pointer;
}

.joinforumsbutton:hover {
    filter: blur(0.5px);
    background-image: linear-gradient(180deg, #000, #000);
    box-shadow: 0 0 8px 0px #3166b7;
}  



.textdescription {
    width: 50%;
    margin: auto;
    margin-top: 50px;
    color: #ffffffa6;
    text-align: center;
    text-align: -webkit-center;
}
.texttitle {
    width: 50%;
    margin: auto;
    margin-top: 50px;
    font-size: 30px;
    color: #ffffff;
    text-align: center;
    text-align: -webkit-center;
}



.footer {
    bottom: 0;
    position: absolute;
    background: black;
    padding: 20px;
    font-size: 10px;
    color: #ffffff8c;
    border-top: 1px solid #0a0a0a;
    width: -webkit-fill-available;
    text-align: center;
}



::-webkit-scrollbar {
    width: 10px;
    background: #3e0101;
}

::-webkit-scrollbar-thumb {
    background: #060606;
    border-radius: 3px;
}
::-webkit-scrollbar-track {
    box-shadow: inset 0 0 5px #20202085;
    border-radius: 3px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #b30000; 
}