div.card-collapsed div div a svg.fa-chevron-up {
    transform: rotate(90deg) !important;
}

div.card div div a svg.fa-chevron-up {
    transform: rotate(180deg);
}
       


 ::-webkit-scrollbar {
            width: 3px;
            height: 3px;
        }

        ::-webkit-scrollbar:hover {
            width: 6px;
            height: 3px;
        }

        ::-webkit-scrollbar-button {
            width: 0px;
            height: 0px;
        }

        ::-webkit-scrollbar-thumb {
            background: #e1e1e1;
            border: 0px none #ffffff;
        }

        ::-webkit-scrollbar-thumb:hover {
            background: #ffffff;
        }

        ::-webkit-scrollbar-thumb:active {
            background: #a6a6a6;
        }

        ::-webkit-scrollbar-track {
            background: #4b5a68;
            border: 1px none #ffffff;
        }

        ::-webkit-scrollbar-track:hover {
            background: #4b5a68;
        }

        ::-webkit-scrollbar-track:active {
            background: #4b5a68;
        }

        .tag svg {
            margin-top: 6px;
            margin-right: 4px;
        }



html {
    margin:0;
    padding: 0;
    width: 100%;
    
    max-height: 100%;

    position: relative;


}
main {
    height: 100px;
}


.page-main {
    max-height: 8000px;
}

div#dps_info {
    visibility: hidden;
}

div#others_info {
    visibility: hidden;
}
/* Navvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvv */
.nav{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
    padding-left:0;
    margin-bottom:0;
    list-style:none
}
.nav-link{
    display:block;
    padding:.5rem 1rem
}
.nav-link:focus,.nav-link:hover{
    text-decoration:none
}
.nav-link.disabled{
    color:#6c757d;
    pointer-events:none;
    cursor:default
}
.nav-tabs{
    border-bottom:1px solid #dee2e6
}
.nav-tabs .nav-item{
    margin-bottom:-1px
}
.nav-tabs .nav-link{
    border:1px solid transparent;
    border-top-left-radius:.25rem;
    border-top-right-radius:.25rem
}
.nav-tabs .nav-link:focus,.nav-tabs .nav-link:hover{
    border-color:#e9ecef #e9ecef #dee2e6
}
.nav-tabs .nav-link.disabled{
    color:#6c757d;
    background-color:transparent;
    border-color:transparent
}
.nav-tabs .nav-item.show .nav-link,.nav-tabs .nav-link.active{
    color:#495057;
    background-color:#fff;
    border-color:#dee2e6 #dee2e6 #fff
}
.nav-tabs .dropdown-menu{
    margin-top:-1px;
    border-top-left-radius:0;
    border-top-right-radius:0
}
.nav-pills .nav-link{
    border-radius:.25rem
}
.nav-pills .nav-link.active,.nav-pills .show>.nav-link{
    color:#fff;
    background-color:#3688fc
}
.nav-fill .nav-item{
    -webkit-box-flex:1;
    -ms-flex:1 1 auto;
    flex:1 1 auto;
    text-align:center
}
.nav-justified .nav-item{
    -ms-flex-preferred-size:0;
    flex-basis:0;
    -webkit-box-flex:1;
    -ms-flex-positive:1;
    flex-grow:1;
    text-align:center
}
.tab-content>.tab-pane{
    display:none
}
.tab-content>.active{
    display:block
}
.navbar{
    position:relative;
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center;
    -webkit-box-pack:justify;
    -ms-flex-pack:justify;
    justify-content:space-between;
    padding:.5rem 1rem
}
.navbar>.container,.navbar>.container-fluid{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center;
    -webkit-box-pack:justify;
    -ms-flex-pack:justify;
    justify-content:space-between
}
.navbar-brand{
    display:inline-block;
    padding-top:.3125rem;
    padding-bottom:.3125rem;
    margin-right:1rem;
    font-size:1.25rem;
    line-height:inherit;
    white-space:nowrap;
}
.navbar-brand:focus,.navbar-brand:hover{
    text-decoration:none
}
.navbar-nav{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-orient:vertical;
    -webkit-box-direction:normal;
    -ms-flex-direction:column;
    flex-direction:column;
    padding-left:0;
    margin-bottom:0;
    list-style:none
}
.navbar-nav .nav-link{
    padding-right:0;
    padding-left:0
}
.navbar-nav .dropdown-menu{
    position:static;
    float:none
}
.navbar-text{
    display:inline-block;
    padding-top:.5rem;
    padding-bottom:.5rem
}
.navbar-collapse{
    -ms-flex-preferred-size:100%;
    flex-basis:100%;
    -webkit-box-flex:1;
    -ms-flex-positive:1;
    flex-grow:1;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center
}
.navbar-toggler{
    padding:.25rem .75rem;
    font-size:1.25rem;
    line-height:1;
    background-color:transparent;
    border:1px solid transparent;
    border-radius:.25rem
}
.navbar-toggler:focus,.navbar-toggler:hover{
    text-decoration:none
}
.navbar-toggler-icon{
    display:inline-block;
    width:1.5em;
    height:1.5em;
    vertical-align:middle;
    content:"";
    background:no-repeat center center;
    background-size:100% 100%
}
@media (max-width:575.98px){
    .navbar-expand-sm>.container,.navbar-expand-sm>.container-fluid{
        padding-right:0;
        padding-left:0
    }
}
@media (min-width:576px){
    .navbar-expand-sm{
        -webkit-box-orient:horizontal;
        -webkit-box-direction:normal;
        -ms-flex-flow:row nowrap;
        flex-flow:row nowrap;
        -webkit-box-pack:start;
        -ms-flex-pack:start;
        justify-content:flex-start
    }
    .navbar-expand-sm .navbar-nav{
        -webkit-box-orient:horizontal;
        -webkit-box-direction:normal;
        -ms-flex-direction:row;
        flex-direction:row
    }
    .navbar-expand-sm .navbar-nav .dropdown-menu{
        position:absolute
    }
    .navbar-expand-sm .navbar-nav .nav-link{
        padding-right:.5rem;
        padding-left:.5rem
    }
    .navbar-expand-sm>.container,.navbar-expand-sm>.container-fluid{
        -ms-flex-wrap:nowrap;
        flex-wrap:nowrap
    }
    .navbar-expand-sm .navbar-collapse{
        display:-webkit-box!important;
        display:-ms-flexbox!important;
        display:flex!important;
        -ms-flex-preferred-size:auto;
        flex-basis:auto
    }
    .navbar-expand-sm .navbar-toggler{
        display:none
    }
}
@media (max-width:767.98px){
    .navbar-expand-md>.container,.navbar-expand-md>.container-fluid{
        padding-right:0;
        padding-left:0
    }
}
@media (min-width:768px){
    .navbar-expand-md{
        -webkit-box-orient:horizontal;
        -webkit-box-direction:normal;
        -ms-flex-flow:row nowrap;
        flex-flow:row nowrap;
        -webkit-box-pack:start;
        -ms-flex-pack:start;
        justify-content:flex-start
    }
    .navbar-expand-md .navbar-nav{
        -webkit-box-orient:horizontal;
        -webkit-box-direction:normal;
        -ms-flex-direction:row;
        flex-direction:row
    }
    .navbar-expand-md .navbar-nav .dropdown-menu{
        position:absolute
    }
    .navbar-expand-md .navbar-nav .nav-link{
        padding-right:.5rem;
        padding-left:.5rem
    }
    .navbar-expand-md>.container,.navbar-expand-md>.container-fluid{
        -ms-flex-wrap:nowrap;
        flex-wrap:nowrap
    }
    .navbar-expand-md .navbar-collapse{
        display:-webkit-box!important;
        display:-ms-flexbox!important;
        display:flex!important;
        -ms-flex-preferred-size:auto;
        flex-basis:auto
    }
    .navbar-expand-md .navbar-toggler{
        display:none
    }
}
@media (max-width:991.98px){
    .navbar-expand-lg>.container,.navbar-expand-lg>.container-fluid{
        padding-right:0;
        padding-left:0
    }
}
@media (min-width:992px){
    .navbar-expand-lg{
        -webkit-box-orient:horizontal;
        -webkit-box-direction:normal;
        -ms-flex-flow:row nowrap;
        flex-flow:row nowrap;
        -webkit-box-pack:start;
        -ms-flex-pack:start;
        justify-content:flex-start;
    }
    .navbar-expand-lg .navbar-nav{
        -webkit-box-orient:horizontal;
        -webkit-box-direction:normal;
        -ms-flex-direction:row;
        flex-direction:row
    }
    .navbar-expand-lg .navbar-nav .dropdown-menu{
        position:absolute
    }
    .navbar-expand-lg .navbar-nav .nav-link{
        padding-right:.5rem;
        padding-left:.5rem
    }
    .navbar-expand-lg>.container,.navbar-expand-lg>.container-fluid{
        -ms-flex-wrap:nowrap;
        flex-wrap:nowrap
    }
    .navbar-expand-lg .navbar-collapse{
        display:-webkit-box!important;
        display:-ms-flexbox!important;
        display:flex!important;
        -ms-flex-preferred-size:auto;
        flex-basis:auto
    }
    .navbar-expand-lg .navbar-toggler{
        display:none
    }
}
@media (max-width:1366.98px){
    .navbar-expand-xl>.container,.navbar-expand-xl>.container-fluid{
        padding-right:0;
        padding-left:0
    }
}
@media (min-width:1367px){
    .navbar-expand-xl{
        -webkit-box-orient:horizontal;
        -webkit-box-direction:normal;
        -ms-flex-flow:row nowrap;
        flex-flow:row nowrap;
        -webkit-box-pack:start;
        -ms-flex-pack:start;
        justify-content:flex-start
    }
    .navbar-expand-xl .navbar-nav{
        -webkit-box-orient:horizontal;
        -webkit-box-direction:normal;
        -ms-flex-direction:row;
        flex-direction:row
    }
    .navbar-expand-xl .navbar-nav .dropdown-menu{
        position:absolute
    }
    .navbar-expand-xl .navbar-nav .nav-link{
        padding-right:.5rem;
        padding-left:.5rem
    }
    .navbar-expand-xl>.container,.navbar-expand-xl>.container-fluid{
        -ms-flex-wrap:nowrap;
        flex-wrap:nowrap
    }
    .navbar-expand-xl .navbar-collapse{
        display:-webkit-box!important;
        display:-ms-flexbox!important;
        display:flex!important;
        -ms-flex-preferred-size:auto;
        flex-basis:auto
    }
    .navbar-expand-xl .navbar-toggler{
        display:none
    }
}
.navbar-expand{
    -webkit-box-orient:horizontal;
    -webkit-box-direction:normal;
    -ms-flex-flow:row nowrap;
    flex-flow:row nowrap;
    -webkit-box-pack:start;
    -ms-flex-pack:start;
    justify-content:flex-start
}
.navbar-expand>.container,.navbar-expand>.container-fluid{
    padding-right:0;
    padding-left:0
}
.navbar-expand .navbar-nav{
    -webkit-box-orient:horizontal;
    -webkit-box-direction:normal;
    -ms-flex-direction:row;
    flex-direction:row
}
.navbar-expand .navbar-nav .dropdown-menu{
    position:absolute
}
.navbar-expand .navbar-nav .nav-link{
    padding-right:.5rem;
    padding-left:.5rem
}
.navbar-expand>.container,.navbar-expand>.container-fluid{
    -ms-flex-wrap:nowrap;
    flex-wrap:nowrap
}
.navbar-expand .navbar-collapse{
    display:-webkit-box!important;
    display:-ms-flexbox!important;
    display:flex!important;
    -ms-flex-preferred-size:auto;
    flex-basis:auto
}
.navbar-expand .navbar-toggler{
    display:none
}
.navbar-light .navbar-brand{
    color:rgba(0,0,0,.9)
}
.navbar-light .navbar-brand:focus,.navbar-light .navbar-brand:hover{
    color:rgba(0,0,0,.9)
}
.navbar-light .navbar-nav .nav-link{
    color:#919ca7
}
.navbar-light .navbar-nav .nav-link:focus,.navbar-light .navbar-nav .nav-link:hover{
    color:#343a40
}
.navbar-light .navbar-nav .nav-link.disabled{
    color:#adb5bd
}
.navbar-light .navbar-nav .active>.nav-link,.navbar-light .navbar-nav .nav-link.active,.navbar-light .navbar-nav .nav-link.show,.navbar-light .navbar-nav .show>.nav-link{
    color:#3688fc
}
.navbar-light .navbar-toggler{
    color:#919ca7;
    border-color:rgba(0,0,0,.1)
}
.navbar-light .navbar-toggler-icon{
    background-image:url("data:image/svg+xml,%3csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3e%3cpath stroke='rgba(0, 0, 0, 0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e")
}
.navbar-light .navbar-text{
    color:#919ca7
}
.navbar-light .navbar-text a{
    color:#3688fc
}
.navbar-light .navbar-text a:focus,.navbar-light .navbar-text a:hover{
    color:#3688fc
}
.navbar-dark .navbar-brand{
    color:#fff;
    margin-top: -77px;
}
.navbar-dark .navbar-brand:focus,.navbar-dark .navbar-brand:hover{
    color:#fff
}
.navbar-dark .navbar-nav .nav-link{
    color:rgba(255,255,255,.5)
}
.navbar-dark .navbar-nav .nav-link:focus,.navbar-dark .navbar-nav .nav-link:hover{
    color:rgba(255,255,255,.75)
}
.navbar-dark .navbar-nav .nav-link.disabled{
    color:rgba(255,255,255,.25)
}
.navbar-dark .navbar-nav .active>.nav-link,.navbar-dark .navbar-nav .nav-link.active,.navbar-dark .navbar-nav .nav-link.show,.navbar-dark .navbar-nav .show>.nav-link{
    color:#fff
}
.navbar-dark .navbar-toggler{
    color: rgb(255 255 255);
    border: none !important;
    outline: none !important;
}
.navbar-dark .navbar-toggler-icon{
    background-image:url("data:image/svg+xml,%3csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3e%3cpath stroke='rgba(255, 255, 255, 0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e")
}
.navbar-dark .navbar-text{
    color:rgba(255,255,255,.5)
}
.navbar-dark .navbar-text a{
    color:#fff
}
.navbar-dark .navbar-text a:focus,.navbar-dark .navbar-text a:hover{
    color:#fff
}

.navbar-brand {
    width: 187px;
}

.showcase {
    overflow-x: hidden;
    top: 65px;
}

.duration {
    font-size: 20px;
    font-weight: 1px;
}

.mast {
    
    width: 100%;
    height: 100%;
}
/* Circles */
.center {
    position: relative;
    transform: translate(0%, 0%);
    width: 100px;
    height: 100px;
    box-sizing: border-box;
    margin-top: -27px;
    z-index: -1;
    margin-right: 101px;
}
.dashboard-loader {
    
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100px;
    height: 100px;
    box-sizing: border-box;
    z-index: -1;
    
}
.circle1 {
    position: relative;
    left: 83px;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    border-style: solid;
    border-width: 10px;
    border-color: #EFEFEF rgba(0, 0,0,0) #EFEFEF rgba(0, 0,0,0);
    box-sizing: border-box;
    animation: animateCircle1 111s linear infinite;
    top: 103px;
    z-index: 0;
}
.bg-btm {
    height: 1500px;
    background-color: rgb(57, 80, 133) ;
    position: absolute;
    bottom: -2250px;
    right: 300px;
    width: 5000px;
    transform: rotate(20deg);
    z-index: -1;
    
}
.circle2 {
    position: relative;
    left: 99px;
    width: 70%;
    height: 70%;
    border-radius: 50%;
    border-style: solid;
    border-width: 10px;
    border-color: #EFEFEF rgba(0, 0,0,0) #EFEFEF rgba(0, 0,0,0);
    box-sizing: border-box;
    animation: animateCircle2 25s linear infinite;
    animation-direction: reverse;
    top: 19px;
    z-index: 0;
}

.dashboard-circle1 {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    height: 100%;
    border-radius: 50%;
    border-style: solid;
    border-width: 10px;
    border-color: #EFEFEF rgba(0, 0,0,0) #EFEFEF rgba(0, 0,0,0);
    box-sizing: border-box;
    animation: animateCircle1 11s linear infinite;
    
    z-index: 0;
}

.dashboard-circle2 {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 70%;
    height: 70%;
    border-radius: 50%;
    border-style: solid;
    border-width: 10px;
    border-color: #EFEFEF rgba(0, 0,0,0) #EFEFEF rgba(0, 0,0,0);
    box-sizing: border-box;
    animation: animateCircle2 2.5s linear infinite;
    animation-direction: reverse;
    
    z-index: 0;
}



@keyframes animateCircle1 {
    0%{
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

@keyframes animateCircle2 {
    0%{
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

@keyframes animateCircle3 {
    0%{
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}



footer {
    width: 100%;
    bottom: 0;
    left: 0;
    height: 50px;
}


footer div {
    display: inline-block;
}

footer li {
    margin: 0;
}
footer ul {
    font-size: 50px;
    position: absolute;
    /* bottom: 0; */
    /* right: 50px; */
    padding: 10px 100px;
    width: 100%;
    border-top: 3px solid #EFEFEF;
    margin-top: 50px;
}
/* Selling Points */

.sellingpointdiv {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    margin: auto;
    margin-bottom: 165px;
    margin-top: 150px;
    position: relative;
    justify-content: center;
}


.sellingpoint {
    color: #EFEFEF;
    text-align: center;
    width: 100%;
    align-self: center;
}

.sellingpoint p {
    margin: 0 0;
    color: #A0A0A0;
}


/* Detected Cheats */

.detected {
    position: relative;
    border-top: rgb(23, 162, 184) solid 3px;
    border-bottom: rgb(23, 162, 184) solid 3px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin: 10px auto 10px auto;
}

.detectedlist {
    margin: 10px auto;
    color: #EFEFEF;
    text-align: center;
    max-width: 250px;
    font-size: 30px;
    list-style-type: none;
    transition: 0.5s all;
}

.detectedlist:hover {
    transform: scale(1.5);
}

.detectedh1 {
    color: #EFEFEF;
    margin: 0 0 39px 0;
    position: relative;
    font-size: 24px;
}
/* Pricing Shineeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeee */


.pricing h3 {
    width: 100%;
    overflow: hidden;

}

.pricing h3::before {
    content: '';
    position: absolute;
    top: 0;
    left: 150px;
    width: 100px;
    height: 100%;
    background: rgba(255,255,255,0.3);
    transform: skewX(-30deg);
}


/* Pricing */
.pricingcontainer {
    position: relative;
    color: #EFEFEF;
    display: flex;
    flex-direction: row;
    text-align: center;
    width: 100%;
    min-width: 150px;
    margin: 100px 0;
    overflow: hidden;
    flex-wrap: wrap;
}

.blue1 {
    background-color: blue;
}

.pricing-details {
    font-size: 10px;
}

.pricing {
    margin: 20px 0;
    border-radius: 15px 15px 0 0;
    width: 285px;
    min-width: 250px;
    min-height: 400px;
}

.pricing p {
    margin: 25px 25px -8px 10px;
    padding: 0px 0px 10px 0px;
    font-size: 15px;
    /* border-bottom: 1px solid #4444; */
}
.pricing h2 {
    font-size:25px;
    
}
.pricing h1, h2 {
    margin: 25px;
    display: inline;
    margin: 0;
}
.pricing h3 {
    background: #4C7E7F;
    width:100%;
    padding: 10px 0;
    border-radius: 15px 15px 0 0;
    font-size: 18px;
}
@media screen and (max-width: 1150px) {
}
.position: right 
/* About Us Head */
.aboutushead {
    display: inline-block;
    margin: 50px 100px;
}
/* MP4 Container */
.pagebuttondiv {
    width: 100%;
    margin: auto;
    text-align: left;
}
.pagebutton {
    min-width: 100px;
    margin: 0 2.5px;
}


@media (max-width: 992px){

    .bannercontainer {
        margin-left: 10%;
    
    }

    .detectivesmith {
        margin-top: 0vh;
        height: auto;
        width: 100%; 
        max-width: 644px;
    }    

    .echoh1 {
        color: #EFEFEF;
        font-size: 75px;
        margin-top: 5vw;
        font-size: 50px;
    }

    .mp4text p {
        font-size: 25px;
        color: #A0A0A0;
    }
}


@media {

    .bannercontainer {
    text-align: right;
    margin-left: 30%;
    }

    .detectivesmith {
        height: auto;
        width: 507px;
        max-width: 644px;
        margin-right: 30%;
        z-index: 10;
    }

    .echoh1 {
        color: #EFEFEF;
        font-size: 75px;
        font-size: 37px;
    }

    .mp4text p {
    }

    .mp4text button {
        font-size: 16px;
    }
}

.btn .fa-sign-in-alt {
    margin: 2px 5px 0px -5px;
    font-size: 12px;
}

.down-arrow {
    position: absolute;
    display: flex;
    width: 100%;
    height: 50px;
    margin-top: 90vh;
    align-items: center;
    justify-content: center;
    z-index: 2;
}

.down-arrow i {
    color: #EFEFEF;
    font-size: 40px;
    align-self: center;
}

.mp4text {
     
    position: relative;
    float: left;
    text-align: left;
    font-size: 25px;
    color: #EFEFEF;
    
    width: 100%;
}


figure video {
    position: relative;

    width: 550px;
    height: 500px;
    left: 40vh;

}

.mp4container {
    position: relative;
    margin: 0 0 200px 0;
    align-items: center;
    transform-origin: center center;
    
}
.mp4text {
    position: relative;
    
    z-index: 3;
    margin: 0px 0 0 0px;
    
}
@media screen and (max-width: 1430px) {
    figure video {
        right: 30vh;
        top: -5vh;
        height: 750px;
        width: 650px;
    }
}

@media screen and (max-width: 1025px) {
    figure video {
        right: 0vh;
        top: -0vh;
        height: 550px;
        width: 350px;
    }
}

.background-container {
    position: relative;
    overflow-x: hidden;
    z-index: -1;
    right: 0px;
    left: 0px;
    width: 100%;
    height: 1470px;
    top: -687px;
    margin-bottom: -1470px;
}



.background-top {
    position: absolute;
    z-index: -1;
    margin-top: -300px;
    margin-left: -100px;
    width: 150%;
    height: 1470px;
    transform: rotate(-5deg);
    top: 0;
    background: -webkit-linear-gradient(to bottom, #0A0A0A , #262726 );  /* Chrome 10-25, Safari 5.1-6 */
    background: #243253;
}

.background-mid-container {
    position: absolute;
    overflow-x: hidden;
    z-index: -1;
    right: 0px;
    left: 0px;
    width: 100%;
    height: 1000px;
    top: 1120px;
    overflow-y: hidden;
}


.background-mid {
    position: absolute;
    z-index: -1;
    margin-top: 351px;
    margin-left: -100px;
    width: 150%;
    height: 100%;
    transform: rotate(-5deg);
    top: 0;
    background: -webkit-linear-gradient(to bottom, #0A0A0A , #262726 );  /* Chrome 10-25, Safari 5.1-6 */
    background: #243253;
}


/* page transition */

@keyframes slidenIn {
    0% {
        opacity: 0;
        transform: translateX(-100%);
    }

    100% {
        opacity: 1;
        transform: translateX(0%);
    }
}

/* magnifying glass */

:root {
    --move-x: -730px;
    --move-y: -500px;
}

.giant-glass{
    left: calc(200px + var(--move-x));
    top: calc(500px + var(--move-y));
}
.giant-glass p{
    margin-left: calc(-500px - var(--move-x));
}

.first-glass{
    margin-top: calc(-778px - var(--move-y));
}

.giant-handle{
    margin-top: calc(1270px + var(--move-y));
    margin-left: calc(1400px + var(--move-x));

}

/* login pageeeeeeeeeeeeeeeeeeeeeeeeeeeeee */


.head {
    margin-bottom: -61px;
    margin-top: 33px;
}

.sellingpoint h1 {
    font-size: 18px;
}

.avatar-title {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: rgb(23, 162, 184);
    color: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-weight: 600;
    height: 100%;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 100%;
}

.bannercontainer button.btn.btn-sm.btn-light.btn-rounded {
    margin-right: 10px;
    border-radius: 8px;
    padding: 9px;
    font-size: 100;
}

span.sellingicon-container {
    padding: 16px 33px 44px 27px;
    background-color: rgba(255,255,255,0.5);
    border-radius: 50%!important;
    margin: 0 0 15px 0 !important;
    overflow: hidden;
    text-align: center;
    margin: 0 0 0 0;
}

i.sellingicon {
    width: 25px;
    height: 25px;
    margin-left: -13px;
    font-size: 27px;
    align-self: center;
}

.sellingicon-container {
    width: 25px;
    height: 25px;
    background-color: rgba(255,255,255,0.5);
    align-self: center;
    justify-content: left;
    display: flex;
    align-items: center;
}

::before {}

span.square {
    height: 25px;
    width: 25px;
}

yyy.square {
    width: 50px;
    display: inline-block;
    height: 50px;
}

.btn-primary {}

.btn-primary {
}

.front-page {
	background: #2e3f68 !important;
	margin: 0;
}

a {
	outline: none;
}

@media (min-width: 990px){
    .navbar-nav li {
        display: inline-block;
        font-size: 16px;
    }

    .navbar-nav li a {
        color: #ffffff;
        text-decoration: none;
        display: inline-block;	
        padding: 10px;
        transition: color 0.5s;
    }

    .navbar-nav li .underline {
        height: 3px;
        background-color: transparent;
        width: 0%;
        transition: width 0.2s, background-color 0.5s;
        margin: 0 auto;
    }

    .navbar-nav li.active .underline {
        width: 100%;
        background-color: rgb(23, 162, 184);
    }

    .navbar-nav li:hover .underline {
        background-color: rgb(23, 162, 184);
        width: 100%;
    }

    .navbar-nav li:hover a {
    }

    .navbar-nav li:active a {
        transition: none;
        color:#4c7e7f;
    }

    .navbar-nav li:active .underline {
        transition: none;
        background-color: rgb(23, 162, 184);
    }
}

@media (max-width: 990px){
    .navbar-nav li {
        display: inline-block;
        font-size: 16px;
    }

    .navbar-nav li a {
        color: #ffffff;
        text-decoration: none;
        display: inline-block;	
        padding: 10px;
        transition: color 0.5s;
    }

    .navbar-nav li .underline {
        height: 3px;
        background-color: transparent;
        width: 0%;
        transition: width 0.2s, background-color 0.5s;
        margin: 0 auto;
        max-width: 64px;
    }

    .navbar-nav li.active .underline {
        width: 100%;
        background-color: #4c7e7f;
        max-width: 64px;
        max-width: 64px;
    }

    .navbar-nav li:hover .underline {
        background-color: rgb(23, 162, 184);
        width: 100%;
        max-width: 64px;
    }

    .navbar-nav li:hover a {
    }

    .navbar-nav li:active a {
        transition: none;
        color:#4c7e7f;
    }

    .navbar-nav li:active .underline {
        transition: none;
        background-color: rgb(23, 162, 184);
    }
}

.btn-primary.focus, .btn-primary:focus {
}

.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show>.btn-primary.dropdown-toggle {
}

.btn-primary:hover {
}

.btn-primary:not(:disabled):not(.disabled).active:focus, .btn-primary:not(:disabled):not(.disabled):active:focus, .show>.btn-primary.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem #93d8d959;
}

i.fas.fa-arrow-right {}

i.fas.fa-arrow-right.get-started-arrow {
    font-size: 12px;
    margin-left: 5px;
}


/* Footer ==================================================================== */
footer ul {
    margin: auto;
    width: 95%;
}


/* Glass Thingy =========================================================== */
.glass-container{
    position: absolute;
    width: 100%;
    height: 1848px;
    overflow: hidden;
}

.giant-glass {
    overflow: hidden;
    border-radius: 50%;
    z-index: -2;
    position: absolute;
    width: 1000px;
    height: 1000px;
    border: 100px solid rgba(255, 255, 255, 0.07);
}

.giant-handle{
    position: absolute;
    transform: rotate(-45deg);
    z-index: -21;
}

.giant-handle-end {
    width: 200px;
    height: 200px;
    border-radius: 0 0 50% 50%;
    
    background-color: rgba(255, 255, 255, 0.07);
}

.giant-handle-start {
    width: 200px;
    height: 400px;

    background-color: rgba(255, 255, 255, 0.07);
}

.giant-glass p{
    color: rgba(255, 255, 255, 0.07);
    font-size: 200px;
    margin-bottom: -120px;
    width: 100%;
    font-weight: bold;
}




/* FAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAQ */
.faqcontainer *, .faqcontainer *::before, .faqcontainer *::after {
    color: white;

}

.faq1 {
    width: 50%;
    float: left;
    height: 110vh;
    background-color: none;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 100px 0;
    position: relative;
    top: 100px;
}

.faq2 {
    width: 50%;
    float: left;
    height: 100vh;
    background-color: none;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    top: 75px;
}

.faqcontainer {
    width: 100%;
    max-width: 80rem;
    margin: 100px auto;
    padding: 0 1.5rem;
}

.accordion-item {
    background-color: #4c7e7f;
    border-radius: .4rem;
    margin-bottom: 2.5rem;
    padding: 0.25rem;
    box-shadow: .5rem 2px .5rem rgba(0,0,0,.1);
}

.accordion-link {
    font-size: 1.6rem;
    color: #4c7e7f;
    text-decoration: none;
    background-color: #222;
    width: 100%;
    display: flex;
    justify-content: space-between;
    padding: 1rem 5rem;
    position: relative;
    top: 5px;
}

.accordion-link:hover ,.remove:hover, .add:hover{
    text-decoration: none;
    color: #2d4949;
    transition: color 250ms;
    cursor: pointer;
}

.accordion-link i {
    color: #4c7e7f;
    padding: .25rem;
    position: relative;
    right: -50px;
    top: -2.5px;

}

.accordion-link .remove {
    display: none;
}

.awnser {
    max-height: 0;
    overflow: hidden;
    position: relative;
    background-color: #253d3d;
    font-size: 1.4rem;
    color: white;
    transition: max-height 1250ms;
}

.awnser::before {
    content: "";
    position: absolute;
    width: .6rem;
    height: 90%;
    background-color: #222;
    top: 50%;
    left: 0;
    transform: translate(-50%);

}



.accordion-item:target .awnser{
    max-height: 20rem;
}

.accordion-item:target .accordion-link .add {
    display: none;
}

.accordion-item:target .accordion-link .remove {
    display: block;
}


@media (max-width: 1200px) {
    .faq1 {
        width:100%;
        float: none;
    }

    .faq2 {
        width: 100%;
        float: none;
        top: 260px;
    }
}

.head .col-lg {
    display: flex;
    align-items: center;
    justify-content: center;
}

span.circular {
    border-radius: 50%!important;
}

.avatar-sm {
    margin: auto!important;
}

a.nav-link {
}

@media (min-width: 780px) {
    a#sidebarCollapse {
        visibility: hidden;
    }
}

.hover-click tbody tr:hover {
    transform: scale(1.03);
    cursor: pointer;
}

.card-body.d-flex.flex-column .clickable {}

.card-body.d-flex.flex-column.clickable:hover {
    transform: scale(0.);
}

.clickable {
    transition: 0.5s;
}

.clickable:hover {
    transform: scale(1.03);
    cursor: pointer;
    cursor: p;
}

.hover-click tbody tr {transition: 0.5s;}

.purchase-btns .btn-primary{
    max-width: 150px;
}

 .flag{
                                height: 50px;
                                width: 50px;
                                margin-left: 10px;
                                margin-bottom: 5px;
                                opacity: 0.5;
                                visibility: hidden;
                                cursor: pointer;
                                transform: scale(0.8);
                            }

                            .flag:hover{
                                transform: scale(1);
                                opacity: 1;
                            }

                            .selecting .flag{
                                visibility: visible;
                                transition: 0.5s;
                            }

                            .flag-container{
                                height: 50px;
                                
                            }

                            .flags{
                                position:absolute;
                                width: 50px;
                                z-index: 13;
                            }

                            .flag.active{
                                opacity: 1;
                                visibility: visible;
                                transform: scale(1);
                            }