@import url(https://lolstatic-a.akamaihd.net/webfonts/live/css/valorant/fonts.css);
@import url(https://fonts.googleapis.com/css?family=Anton|Black+Han+Sans|Kanit:700|Noto+Sans+HK:900|Noto+Sans+JP:700|Noto+Sans+SC:700|Noto+Sans+TC:700|Oswald:700&display=swap&subset=chinese-hongkong,chinese-simplified,chinese-traditional,cyrillic,japanese,korean,thai,vietnamese);
::selection {
    background: rgb(255, 70, 85) 50%;
}

::-webkit-scrollbar {
    width: 10px;
    background: #111; 

  }
  
  /* Track */
  ::-webkit-scrollbar-track {
    background: transparent;


  }
   
  /* Handle */
  ::-webkit-scrollbar-thumb {
    background: white; 

  }
  
  /* Handle on hover */
  ::-webkit-scrollbar-thumb:hover {
    background: rgb(255, 70, 85); 
  }
* { 
    box-sizing: border-box;
cursor: url(../cur/white.cur), auto  !important;   
} 

body {
    font-family: "DINNextW1G", sans-serif;
    background-color: #ece7e1;
    background-image: url(../img/body.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
}


a {
    text-decoration: none;
    color: #fff;
}
a:hover {
    color: #f3f3f3;
}

button {
    border: 0;
    cursor: url(../cur/pinckle.cur), auto !important;   
}

a:hover,
button:hover {
    cursor: url(../cur/pinckle.cur), auto  !important;   
}
h1 span {
    font-family: "valorant-font";
}

h1, h2, h3, h4, h5, h6 {
    font-family: "Tungsten-Bold";
    text-transform: uppercase;
    margin: 0;
}

/* ########################################################## */
/* ########################################################## */

.f-valo {
    font-family: "valorant-font";
}

.f-anton {
    font-family: "Anton";
}

/* ########################################################## */
/* ########################################################## */

.bg-111 {
    background-color: #111;
}

.point {
    background: url(../img/point.png)repeat 0px 0px;
    background-size: 4px 4px;
    opacity: 1;
    height: 100%;
}
.bg-opacity {
    background: rgba(2, 2, 2, 0.473);
    height: 100%;
    min-height: 100vh;
    width: 100%;
}

/* ########################################################## */
/* ########################################################## */

.container {
    border-left: 2px solid #969493;
}

/* ########################################################## */
/* ########################################################## */

.btn-style {
        font-weight: 800;
        border-radius: 2px;
        padding: 12px;
        color: #0f1923;
        text-transform: uppercase;
        background-color: #ece7e1;
        width: auto;
        background-image: linear-gradient(to left,transparent,transparent 50%,rgb(255, 70, 85) 50%,rgb(255, 70, 85));
        background-position: 100% 0;
        background-size: 200% 100%;
        transition: all .25s ease-in;
    
    }
    
    .btn-style:hover {
        color: white;
        background-position: 0;
    }

    .btn-first {
        font-weight: 800;
        border-radius: 2px;
        padding: 10px;
        color: white;
        text-transform: uppercase;
        background-color: rgb(255, 70, 85);
        width: auto;
    }

/* ########################################################## */
/* ########################################################## */