@charset "UTF-8";

@font-face {
    font-family: "Akira";
    src: url('fonts/Akira.ttf');
}
@font-face {
    font-family: "Knock";
    src: url('fonts/KnockKnock.ttf');
}
@font-face {
    font-family: "Qualy";
    src: url('fonts/Qualy Bold.ttf');
}
@font-face {
    font-family: "Stretch";
    src: url('fonts/StretchPro.otf');
}
@font-face {
    font-family: "BehnSchrift";
    src: url('fonts/bahnschrift.ttf');
}
@font-face {
    font-family: "poppins";
    src: url("fonts/Poppins.ttf");
}

html{
    overflow: auto;
    -ms-overflow-style: none;
    scrollbar-width: none;
}

::-webkit-scrollbar{
    display: none;
}


::selection{
    background: #0d9d3b;
    color: white;
}
::-moz-selection{
    background: #0d9d3b;
    color: white;
}

.box{
    box-shadow: 0 0 50px black;
}

.cst-hover{
    text-transform: uppercase;
    letter-spacing: 0.15em;
    display: inline-block;
    padding: 15px 20px;
    position: relative;
}

.cst-hover:after{
    background: none repeat scroll 0 0 transparent;
    bottom: 0;
    content: "";
    display: block;
    height: 2px;
    left: 50%;
    position: absolute;
    background: #50C878;
    transition: width 0.3s ease, left 0.3s ease;
    width: 0;
}

.cst-hover:hover:after {
    width: 100%;
    left: 0;
}

.cst-active{
    text-transform: uppercase;
    letter-spacing: 0.15em;
    display: inline-block;
    padding: 15px 20px;
    position: relative;
}

.cst-active:after{
    background: none repeat scroll 0 0 transparent;
    bottom: 0;
    content: "";
    display: block;
    height: 2px;
    left: 0;
    position: absolute;
    background: #50C878;
    transition: width 0.3s ease, left 0.3s ease;
    width: 100%;
}

.text-instagram{
    color: #ff34bf;
}

/******************************Custom Colors**************************************/

.cst-bg-razer{
    background-color: #50C878 !important;
}
.cst-bg-dark{
    background-color: #1a1b23 !important;
}
.cst-bg-darker{
    background-color: #050505 !important;
}
.cst-bg-light{
    background-color: #DEDDD1 !important;
}
.cst-bg-lighter{
    background-color: #E8E8DE !important;
}
.cst-bg-chat{
    background-color: #013a2f !important;
}
/******************************Custom Colors**************************************/

.cst-text-razer{
    color: #50C878 !important;
}
.cst-text-dark{
    color: #1a1b23 !important;
}
.cst-text-darker{
    color: #050505 !important;
}
.cst-text-light{
    color: #DEDDD1 !important;
}
.cst-text-lighter{
    color: #E8E8DE !important;
}

/******************************Custom Colors**************************************/

.shop-item{
    transition: 0.5s ease;

}
.shop-item:hover{
    box-shadow: 0 10px 20px #575656;
    transform: translateY(-10px);
}

.gal-item{
    transition: 0.4s ease;
}

.gal-item:hover{
    transform: scale(1.1);

}


.comp-tabs{
    color: #50C878;
    background: #050505;
    font-weight: bolder;
    margin: 20px 0;
    padding: 10px 50px;
}

.comp-tabs:hover,.comp-tabs:focus{
    border-color: #050505;
    color: #50C878;
}

.cst-font{
    font-family: 'BehnSchrift';
}

.w-60{
    width: 60%;
}

.w-40{
    width: 40%;
}

.text-akira{
    font-family: "Akira";
}
.text-knock{
    font-family: "Knock";
}
.text-qualy{
    font-family: "Qualy";
}
.text-stretch{
    font-family: "Stretch";
}
.text-poppins{
    font-family: "poppins";
}

.size-20{
    top: 8%;
    left: 5%;
    font-size: 20px;
}

.social-icons{
    font-size: 20px;
}

.non-resize{
    resize: none;
    max-height: 400px;
}

.chat-box{
    box-shadow: 5px 5px 10px black;
    transition: .5s ease;
}

.cst-h{
    height: 9rem !important;
}

.start-25{
    left: 25% !important;
}