/* 	----------------------------------------------------------------------------------------------
*	File Name: template-3d-graphics.scss
* 	Description: 3D Graphics Template Specific CSS
* 	----------------------------------------------------------------------------------------------
* 	Item Name: Crypto ICO - Cryptocurrency Website Landing Page HTML Template
* 	Version: 1.0
* 	Author: PIXINVENT
* 	Author URL: http://www.themeforest.net/user/pixinvent
* 	----------------------------------------------------------------------------------------------*/
/*  Basic reboot css
    -------------------------------------------------------------------------------------------*/
body
{
    overflow-x: hidden;
}

p
{
    font-size: .938rem;
}

a:hover
{
    text-decoration: none;
}

/*  Theme type css
    -------------------------------------------------------------------------------------------*/
body
{
    line-height: 1.6;

    letter-spacing: .25px;
}

ul
{
    font-size: .938rem;

    list-style: none;
}

/*  Pre-loader Component css
    -------------------------------------------------------------------------------------------*/
/* Loader wrapper */
#loader-wrapper
{
    position: fixed;
    z-index: 100000; 
    top: 0;
    left: 0;

    width: 100%;
    height: 100%;
}
#loader-wrapper .loader-section
{
    position: fixed;
    z-index: 99;
    top: 0;

    width: 51%;
    height: 100%;

    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0); 

    background: #fff;
}
#loader-wrapper .loader-section.section-left
{
    left: 0;
}
#loader-wrapper .loader-section.section-right
{
    right: 0;
}

/* Revel screen after page load */
.loaded #loader-wrapper
{
    visibility: hidden;

    -webkit-transition: all .3s 1s ease-out;
            transition: all .3s 1s ease-out; 
    -webkit-transform: translateY(-100%);
        -ms-transform: translateY(-100%);
            transform: translateY(-100%);
}
.loaded #loader-wrapper .loader-section.section-left
{
    -webkit-transition: all .7s .3s cubic-bezier(.645, .045, .355, 1);
            transition: all .7s .3s cubic-bezier(.645, .045, .355, 1); 
    -webkit-transform: translateX(-100%);
        -ms-transform: translateX(-100%);
            transform: translateX(-100%);
}
.loaded #loader-wrapper .loader-section.section-right
{
    -webkit-transition: all .7s .3s cubic-bezier(.645, .045, .355, 1);
            transition: all .7s .3s cubic-bezier(.645, .045, .355, 1); 
    -webkit-transform: translateX(100%);
        -ms-transform: translateX(100%);
            transform: translateX(100%);
}

.loaded #loader
{
    -webkit-transition: all .5s ease-out;
            transition: all .5s ease-out; 

    opacity: 0;
}

/* SVG loader animation  */
svg#loader
{
    position: absolute;
    z-index: 999;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;

    display: block;

    width: 100%;
    height: 100%;
    margin: 0 auto;

    background: #fff;
}
svg#loader g
{
    -webkit-transform-origin: 50% 50%;
        -ms-transform-origin: 50% 50%;
            transform-origin: 50% 50%; 
    -webkit-animation: spin 15s linear infinite;
            animation: spin 15s linear infinite;
}
svg#loader g circle
{
    -webkit-animation: dostuff 18s ease infinite;
            animation: dostuff 18s ease infinite; 

    color: #eeecf4;

    fill: none;
    stroke-width: 2px;
    stroke-linecap: round;
    stroke-dasharray: 260, 0, 1, 0, 1, 0, 1, 0, 10, 1, 10, 1, 10, 1, 10, 1, 10, 10, 1, 10, 1, 10, 1, 10, 10, 1;
}
svg#loader g:nth-child(even)
{
    animation-direction: reverse;
}
svg#loader g:nth-child(1n)
{
    -webkit-animation-delay: -1s;
            animation-delay: -1s;
}
svg#loader g:nth-child(2n)
{
    -webkit-animation-delay: -2s;
            animation-delay: -2s;
}
svg#loader g:nth-child(3n)
{
    -webkit-animation-delay: -3s;
            animation-delay: -3s;
}
svg#loader g:nth-child(4n)
{
    -webkit-animation-delay: -4s;
            animation-delay: -4s;
}
svg#loader g:nth-child(5n)
{
    -webkit-animation-delay: -5s;
            animation-delay: -5s;
}
svg#loader g:nth-child(6n)
{
    -webkit-animation-delay: -6s;
            animation-delay: -6s;
}
svg#loader g:nth-child(7n)
{
    -webkit-animation-delay: -7s;
            animation-delay: -7s;
}
svg#loader g:nth-child(1n) circle
{
    -webkit-animation-delay: -1.5s;
            animation-delay: -1.5s;
}
svg#loader g:nth-child(2n) circle
{
    -webkit-animation-delay: -2.5s;
            animation-delay: -2.5s;
}
svg#loader g:nth-child(3n) circle
{
    -webkit-animation-delay: -3.5s;
            animation-delay: -3.5s;
}
svg#loader g:nth-child(4n) circle,
svg#loader g:nth-child(5n) circle
{
    -webkit-animation-delay: -4.5s;
            animation-delay: -4.5s;
}
svg#loader g:nth-child(6n) circle
{
    -webkit-animation-delay: -5.5s;
            animation-delay: -5.5s;
}
svg#loader g:nth-child(7n) circle
{
    -webkit-animation-delay: -6.5s;
            animation-delay: -6.5s;
}
svg#loader g:nth-child(8n) circle
{
    -webkit-animation-delay: -7.5s;
            animation-delay: -7.5s;
}
svg#loader g:nth-child(9n) circle
{
    -webkit-animation-delay: -8.5s;
            animation-delay: -8.5s;
}
svg#loader g:nth-child(10n) circle
{
    -webkit-animation-delay: -9.5s;
            animation-delay: -9.5s;
}
svg#loader g:last-child circle
{
    fill: #ccc;
    stroke: none;
}

@-webkit-keyframes dostuff
{
    50%
    {
        stroke-dasharray: 10, 1, 10, 1, 10, 1, 10, 1, 10, 1, 10, 1, 10, 10, 10, 1, 20, 120, 1, 30, 1, 30, 1, 10, 30, 1;
    }
}

@keyframes dostuff
{
    50%
    {
        stroke-dasharray: 10, 1, 10, 1, 10, 1, 10, 1, 10, 1, 10, 1, 10, 10, 10, 1, 20, 120, 1, 30, 1, 30, 1, 10, 30, 1;
    }
}

@-webkit-keyframes spin
{
    100%
    {
        -webkit-transform: rotate(360deg);
                transform: rotate(360deg);
    }
}

@keyframes spin
{
    100%
    {
        -webkit-transform: rotate(360deg);
                transform: rotate(360deg);
    }
}

/* JavaScript Turned Off */
.no-js #loader-wrapper
{
    display: none;
}

/*  Button scss for button options and gradient classes
    -------------------------------------------------------------------------------------------*/
/* Button SCSS */
.btn
{
    color: #fff;
}
.btn.btn-square
{
    border-radius: 0;
}
.btn.btn-round
{
    border-radius: 2rem;
}
.btn:focus,
.btn.focus,
.btn:active,
.btn.active
{
    outline: none;
    box-shadow: none !important;
}

/* Gradient Button */
.btn-gradient-blue
{
    -webkit-transition: .5s;
            transition: .5s;

    color: #fff; 
    border: 0;
    background-image: -webkit-linear-gradient(50deg, #28bcfd 20%, #1d78ff 51%, #28bcfd 90%);
    background-image:         linear-gradient(40deg, #28bcfd 20%, #1d78ff 51%, #28bcfd 90%);
    background-position: left center;
    background-size: 200% auto;
}
.btn-gradient-blue:hover,
.btn-gradient-blue:active
{
    text-decoration: none;

    color: #fff; 
    background-position: right center;
}
.btn-gradient-blue:not(:disabled):not(.disabled):active
{
    background-image: -webkit-linear-gradient(50deg, #28bcfd 0%, #1d78ff 51%, #28bcfd 90%);
    background-image:         linear-gradient(40deg, #28bcfd 0%, #1d78ff 51%, #28bcfd 90%);
}
.btn-gradient-blue.btn-glow
{
    box-shadow: 0 0 12px 0 #1f87ff;
}

.btn-gradient-orange
{
    -webkit-transition: .5s;
            transition: .5s;

    color: #fff; 
    border: 0;
    background-image: -webkit-linear-gradient(50deg, #ff4137 20%, #fdc800 51%, #ff4137 90%);
    background-image:         linear-gradient(40deg, #ff4137 20%, #fdc800 51%, #ff4137 90%);
    background-position: left center;
    background-size: 200% auto;
}
.btn-gradient-orange:hover,
.btn-gradient-orange:active
{
    text-decoration: none;

    color: #fff; 
    background-position: right center;
}
.btn-gradient-orange:not(:disabled):not(.disabled):active
{
    background-image: -webkit-linear-gradient(50deg, #ff4137 0%, #fdc800 51%, #ff4137 90%);
    background-image:         linear-gradient(40deg, #ff4137 0%, #fdc800 51%, #ff4137 90%);
}
.btn-gradient-orange.btn-glow
{
    box-shadow: 0 0 12px 0 #ff5f2b;
}

.btn-gradient-purple
{
    -webkit-transition: .5s;
            transition: .5s;

    color: #fff; 
    border: 0;
    background-image: -webkit-linear-gradient(50deg, #bf68e6 20%, #9e48cd 51%, #bf68e6 90%);
    background-image:         linear-gradient(40deg, #bf68e6 20%, #9e48cd 51%, #bf68e6 90%);
    background-position: left center;
    background-size: 200% auto;
}
.btn-gradient-purple:hover,
.btn-gradient-purple:active
{
    text-decoration: none;

    color: #fff; 
    background-position: right center;
}
.btn-gradient-purple:not(:disabled):not(.disabled):active
{
    background-image: -webkit-linear-gradient(50deg, #bf68e6 0%, #9e48cd 51%, #bf68e6 90%);
    background-image:         linear-gradient(40deg, #bf68e6 0%, #9e48cd 51%, #bf68e6 90%);
}
.btn-gradient-purple.btn-glow
{
    box-shadow: 0 0 12px 0 #9e48cd;
}

.btn-light
{
    color: #7d7d7d;
}
.btn-light.btn-glow
{
    box-shadow: 0 0 12px 0 #fff;
}

/*  Form Component css
    -------------------------------------------------------------------------------------------*/
.form-control
{
    font-size: .875rem;

    margin-bottom: 3.5rem;
    padding: 1rem .5rem;

    color: #3f3f3f;
    border: none;
    border-bottom: 1px solid #eeecf4;
    border-radius: 0;
    background: none;
}
.form-control:focus
{
    background: transparent; 
    box-shadow: none !important;
}

/*  Gradient progress bar colors
    -------------------------------------------------------------------------------------------*/
.progress .progress-blue
{
    background: -webkit-linear-gradient(left, #28bcfd, #1d78ff);
    background:         linear-gradient(to right, #28bcfd, #1d78ff);
}

.progress .progress-orange
{
    background: -webkit-linear-gradient(left, #fdc800, #ff4137);
    background:         linear-gradient(to right, #fdc800, #ff4137);
}

.progress .progress-purple
{
    background: -webkit-linear-gradient(left, #bf68e6, #9e48cd);
    background:         linear-gradient(to right, #bf68e6, #9e48cd);
}

/* Dropdown down arrow css
    -------------------------------------------------------------------------------------------*/
.dropdown-toggle::after
{
    font-family: 'themify';
    font-size: .6rem;
    font-weight: 700; 

    position: relative;
    top: 1px;
    right: 0;

    margin: 0 .3em 0 0;
    padding: 0 2px 0 6px;

    content: '\e64b';
    vertical-align: 0;

    border: none;
}

.main-menu .dropdown-item
{
    padding-left: 0;
}
.main-menu .dropdown-item.active
{
    padding-left: 20px !important;

    -webkit-transition: all .5s ease;
            transition: all .5s ease; 

    background: none;
}

/*  Multilevel Menu
    -------------------------------------------------------------------------------------------*/
.dropdown-submenu
{
    position: relative;
}
.dropdown-submenu > .dropdown-menu
{
    top: 0;
    left: 100%;

    margin-top: .25rem !important; 
    margin-left: .15rem;

    border-radius: 6px;
}
.dropdown-submenu:hover > .dropdown-menu
{
    display: block;
}
.dropdown-submenu:hover > a:after
{
    border-left-color: #fff;
}
.dropdown-submenu > a:after
{
    display: block;
    float: right;

    width: 0;
    height: 0;
    margin-top: 5px;
    margin-right: 0; 

    content: ' ';

    border-width: 5px 0 5px 5px;
    border-style: solid;
    border-color: transparent;
    border-left-color: #ccc;
}
.dropdown-submenu.dropleft > .dropdown-menu
{
    left: auto;

    margin-top: .25rem !important;
    margin-left: 0;
}

/*  Theme Utilities css
    -------------------------------------------------------------------------------------------*/
:focus
{
    outline: none !important;
}

/* Font-size */
.font-xlarge
{
    font-size: 2.75rem;
}

.font-large
{
    font-size: 2rem;
    line-height: 2rem;
}

.font-medium
{
    font-size: 1.125rem;
}

.font-small
{
    font-size: .875rem;
}

.font-xsmall
{
    font-size: .75rem;
}

/*  Grey Color */
.grey-accent1
{
    color: #161616;
}

.grey-accent2
{
    color: #7d7d7d;
}

.grey-accent3
{
    color: #3f3f3f;
}

.white
{
    color: #fff;
}

.black
{
    color: #000;
}

/* Box Shadow */
.box-shadow-0
{
    box-shadow: none !important;
}

.box-shadow-1
{
    box-shadow: 0 7px 12px 0 rgba(29, 120, 255, .16);
}

.box-shadow-2
{
    box-shadow: 0 10px 18px 0 rgba(29, 120, 255, .2);
}

.box-shadow-3
{
    box-shadow: 0 14px 24px 0 rgba(29, 120, 255, .26);
}

.box-shadow-4
{
    box-shadow: 0 16px 28px 0 rgba(29, 120, 255, .3);
}

.box-shadow-5
{
    box-shadow: 0 27px 24px 0 rgba(29, 120, 255, .36);
}

/* Line height */
.line-height-1
{
    line-height: .5rem;
}

.line-height-2
{
    line-height: 1rem;
}

.line-height-3
{
    line-height: 1.5rem;
}

/* Extra small devices (portrait phones, less than 576px) */
/* (max-width: 575.98px) */
@media (max-width: 575.98px)
{
    /* Margin/padding for Extra small screen (<576) */
    .ml-xs-0
    {
        margin-left: 0 !important;
    }
    .mr-xs-0
    {
        margin-right: 0 !important;
    }
    .mt-xs-3
    {
        margin-top: 1rem !important;
    }
    .mr-xs-3
    {
        margin-right: 1rem !important;
    }
    .ml-xs-3
    {
        margin-left: 1rem !important;
    }
    .mt-xs-5
    {
        margin-top: 3rem !important;
    }
    .mb-xs-5
    {
        margin-bottom: 3rem !important;
    }
    .pt-xs-3
    {
        padding-top: 1rem !important;
    }
    .pt-xs-5
    {
        padding-top: 3rem !important;
    }
    .pb-xs-5
    {
        padding-bottom: 3rem !important;
    }
}

/* Mask Animation */
.maskUp
{
    -webkit-animation-name: maskUp;
            animation-name: maskUp;
}

.maskRight
{
    -webkit-animation-name: maskRight;
            animation-name: maskRight;
}

.maskDown
{
    -webkit-animation-name: maskDown;
            animation-name: maskDown;
}

.maskLeft
{
    -webkit-animation-name: maskLeft;
            animation-name: maskLeft;
}

/* Mask Up */
@-webkit-keyframes maskUp
{
    from
    {
        -webkit-transform: translate(0, 100%);
                transform: translate(0, 100%);
    }
    to
    {
        -webkit-transform: translate(0, 0);
                transform: translate(0, 0);
    }
}
@keyframes maskUp
{
    from
    {
        -webkit-transform: translate(0, 100%);
                transform: translate(0, 100%);
    }
    to
    {
        -webkit-transform: translate(0, 0);
                transform: translate(0, 0);
    }
}

/* Mask Right */
@-webkit-keyframes maskRight
{
    from
    {
        -webkit-transform: translate(-100%, 0);
                transform: translate(-100%, 0);
    }
    to
    {
        -webkit-transform: translate(0, 0);
                transform: translate(0, 0);
    }
}
@keyframes maskRight
{
    from
    {
        -webkit-transform: translate(-100%, 0);
                transform: translate(-100%, 0);
    }
    to
    {
        -webkit-transform: translate(0, 0);
                transform: translate(0, 0);
    }
}

/* Mask Down */
@-webkit-keyframes maskDown
{
    from
    {
        -webkit-transform: translate(0, -100%);
                transform: translate(0, -100%);
    }
    to
    {
        -webkit-transform: translate(0, 0);
                transform: translate(0, 0);
    }
}
@keyframes maskDown
{
    from
    {
        -webkit-transform: translate(0, -100%);
                transform: translate(0, -100%);
    }
    to
    {
        -webkit-transform: translate(0, 0);
                transform: translate(0, 0);
    }
}

/* Mask Left */
@-webkit-keyframes maskLeft
{
    from
    {
        -webkit-transform: translate(100%, 0);
                transform: translate(100%, 0);
    }
    to
    {
        -webkit-transform: translate(0, 0);
                transform: translate(0, 0);
    }
}
@keyframes maskLeft
{
    from
    {
        -webkit-transform: translate(100%, 0);
                transform: translate(100%, 0);
    }
    to
    {
        -webkit-transform: translate(0, 0);
                transform: translate(0, 0);
    }
}

/* FedIn Shorter*/
.fadeInUpShorter
{
    -webkit-animation-name: fadeInUpShorter;
            animation-name: fadeInUpShorter;
}

.fadeInUpShortest
{
    -webkit-animation-name: fadeInUpShortest;
            animation-name: fadeInUpShortest;
}

.fadeInLeftShorter
{
    -webkit-animation-name: fadeInLeftShorter;
            animation-name: fadeInLeftShorter;
}

.fadeInRightShorter
{
    -webkit-animation-name: fadeInRightShorter;
            animation-name: fadeInRightShorter;
}

.fadeInDownShorter
{
    -webkit-animation-name: fadeInDownShorter;
            animation-name: fadeInDownShorter;
}

.fadeInDownShorterAbsCenter
{
    -webkit-animation-name: fadeInDownShorterAbsCenter;
            animation-name: fadeInDownShorterAbsCenter;
}

/* Fade In Up Shorter */
@-webkit-keyframes fadeInUpShorter
{
    from
    {
        -webkit-transform: translate(0, 50px);
                transform: translate(0, 50px); 

        opacity: 0;
    }
    to
    {
        -webkit-transform: none;
                transform: none; 

        opacity: 1;
    }
}
@keyframes fadeInUpShorter
{
    from
    {
        -webkit-transform: translate(0, 50px);
                transform: translate(0, 50px); 

        opacity: 0;
    }
    to
    {
        -webkit-transform: none;
                transform: none; 

        opacity: 1;
    }
}

@-webkit-keyframes fadeInUpShortest
{
    from
    {
        -webkit-transform: translate(0, 25px);
                transform: translate(0, 25px); 

        opacity: 0;
    }
    to
    {
        -webkit-transform: none;
                transform: none; 

        opacity: 1;
    }
}

@keyframes fadeInUpShortest
{
    from
    {
        -webkit-transform: translate(0, 25px);
                transform: translate(0, 25px); 

        opacity: 0;
    }
    to
    {
        -webkit-transform: none;
                transform: none; 

        opacity: 1;
    }
}

/* Fade In Left Shorter */
@-webkit-keyframes fadeInLeftShorter
{
    from
    {
        -webkit-transform: translate(50px, 0);
                transform: translate(50px, 0); 

        opacity: 0;
    }
    to
    {
        -webkit-transform: translate(0, 0);
                transform: translate(0, 0); 

        opacity: 1;
    }
}
@keyframes fadeInLeftShorter
{
    from
    {
        -webkit-transform: translate(50px, 0);
                transform: translate(50px, 0); 

        opacity: 0;
    }
    to
    {
        -webkit-transform: translate(0, 0);
                transform: translate(0, 0); 

        opacity: 1;
    }
}

/* Fade In Right Shorter */
@-webkit-keyframes fadeInRightShorter
{
    from
    {
        -webkit-transform: translate(-50px, 0);
                transform: translate(-50px, 0); 

        opacity: 0;
    }
    to
    {
        -webkit-transform: translate(0, 0);
                transform: translate(0, 0); 

        opacity: 1;
    }
}
@keyframes fadeInRightShorter
{
    from
    {
        -webkit-transform: translate(-50px, 0);
                transform: translate(-50px, 0); 

        opacity: 0;
    }
    to
    {
        -webkit-transform: translate(0, 0);
                transform: translate(0, 0); 

        opacity: 1;
    }
}

/* Fade In Down Shorter */
@-webkit-keyframes fadeInDownShorter
{
    from
    {
        -webkit-transform: translate(0, -50px);
                transform: translate(0, -50px); 

        opacity: 0;
    }
    to
    {
        -webkit-transform: translate(0, 0);
                transform: translate(0, 0); 

        opacity: 1;
    }
}
@keyframes fadeInDownShorter
{
    from
    {
        -webkit-transform: translate(0, -50px);
                transform: translate(0, -50px); 

        opacity: 0;
    }
    to
    {
        -webkit-transform: translate(0, 0);
                transform: translate(0, 0); 

        opacity: 1;
    }
}

/* Fade In Down Shorter - Absolute Center */
@-webkit-keyframes fadeInDownShorterAbsCenter
{
    from
    {
        -webkit-transform: translate(-50%, -50px);
                transform: translate(-50%, -50px); 

        opacity: 0;
    }
    to
    {
        -webkit-transform: translate(-50%, 0);
                transform: translate(-50%, 0); 

        opacity: 1;
    }
}
@keyframes fadeInDownShorterAbsCenter
{
    from
    {
        -webkit-transform: translate(-50%, -50px);
                transform: translate(-50%, -50px); 

        opacity: 0;
    }
    to
    {
        -webkit-transform: translate(-50%, 0);
                transform: translate(-50%, 0); 

        opacity: 1;
    }
}

.expandIn
{
    -webkit-animation-name: expandIn;
            animation-name: expandIn;
}

.blurIn
{
    -webkit-animation-name: blurIn;
            animation-name: blurIn;
}

/* Expand In */
@-webkit-keyframes expandIn
{
    from
    {
        -webkit-transform: scale(.8);
                transform: scale(.8); 

        opacity: 0;
    }
    to
    {
        -webkit-transform: scale(1);
                transform: scale(1); 

        opacity: 1;
    }
}
@keyframes expandIn
{
    from
    {
        -webkit-transform: scale(.8);
                transform: scale(.8); 

        opacity: 0;
    }
    to
    {
        -webkit-transform: scale(1);
                transform: scale(1); 

        opacity: 1;
    }
}

/* Blur In */
@-webkit-keyframes blurIn
{
    from
    {
        -webkit-transform: scale(1.3);
                transform: scale(1.3); 

        opacity: 0;

        -webkit-filter: blur(20px);
                filter: blur(20px);
    }
    to
    {
        -webkit-transform: none;
                transform: none; 

        opacity: 1;

        -webkit-filter: blur(0);
                filter: blur(0);
    }
}
@keyframes blurIn
{
    from
    {
        -webkit-transform: scale(1.3);
                transform: scale(1.3); 

        opacity: 0;

        -webkit-filter: blur(20px);
                filter: blur(20px);
    }
    to
    {
        -webkit-transform: none;
                transform: none; 

        opacity: 1;

        -webkit-filter: blur(0);
                filter: blur(0);
    }
}

.stepsFadeInUp
{
    -webkit-animation-name: stepsFadeInUp;
            animation-name: stepsFadeInUp;
}

.stepsFadeInLeft
{
    -webkit-animation-name: stepsFadeInLeft;
            animation-name: stepsFadeInLeft;
}

.stepsFadeInRight
{
    -webkit-animation-name: stepsFadeInRight;
            animation-name: stepsFadeInRight;
}

/* Steps Fade In Up */
@-webkit-keyframes stepsFadeInUp
{
    from
    {
        -webkit-transform: translate(-50%, 25%);
                transform: translate(-50%, 25%); 

        opacity: 0;
    }
    to
    {
        -webkit-transform: translate(-50%, -50%);
                transform: translate(-50%, -50%); 

        opacity: 1;
    }
}
@keyframes stepsFadeInUp
{
    from
    {
        -webkit-transform: translate(-50%, 25%);
                transform: translate(-50%, 25%); 

        opacity: 0;
    }
    to
    {
        -webkit-transform: translate(-50%, -50%);
                transform: translate(-50%, -50%); 

        opacity: 1;
    }
}

/* Steps Fade In Left */
@-webkit-keyframes stepsFadeInLeft
{
    from
    {
        -webkit-transform: translate(-75%, -50%);
                transform: translate(-75%, -50%); 

        opacity: 0;
    }
    to
    {
        -webkit-transform: translate(-50%, -50%);
                transform: translate(-50%, -50%); 

        opacity: 1;
    }
}
@keyframes stepsFadeInLeft
{
    from
    {
        -webkit-transform: translate(-75%, -50%);
                transform: translate(-75%, -50%); 

        opacity: 0;
    }
    to
    {
        -webkit-transform: translate(-50%, -50%);
                transform: translate(-50%, -50%); 

        opacity: 1;
    }
}

/* Steps Fade In Right */
@-webkit-keyframes stepsFadeInRight
{
    from
    {
        -webkit-transform: translate(-25%, -50%);
                transform: translate(-25%, -50%); 

        opacity: 0;
    }
    to
    {
        -webkit-transform: translate(-50%, -50%);
                transform: translate(-50%, -50%); 

        opacity: 1;
    }
}
@keyframes stepsFadeInRight
{
    from
    {
        -webkit-transform: translate(-25%, -50%);
                transform: translate(-25%, -50%); 

        opacity: 0;
    }
    to
    {
        -webkit-transform: translate(-50%, -50%);
                transform: translate(-50%, -50%); 

        opacity: 1;
    }
}

.textBgFadeInUp
{
    -webkit-animation-name: textBgFadeInUp;
            animation-name: textBgFadeInUp;
}

.textBgFadeInUpDark
{
    -webkit-animation-name: textBgFadeInUpDark;
            animation-name: textBgFadeInUpDark;
}

.textBgFadeInUp2
{
    -webkit-animation-name: textBgFadeInUp2;
            animation-name: textBgFadeInUp2;
}

/* Text bg Fade In Up */
@-webkit-keyframes textBgFadeInUp
{
    from
    {
        -webkit-transform: translate(-50%, 200%);
                transform: translate(-50%, 200%); 

        opacity: 0;
    }
    to
    {
        -webkit-transform: translate(-50%, 0);
                transform: translate(-50%, 0); 

        opacity: .06;
    }
}
@keyframes textBgFadeInUp
{
    from
    {
        -webkit-transform: translate(-50%, 200%);
                transform: translate(-50%, 200%); 

        opacity: 0;
    }
    to
    {
        -webkit-transform: translate(-50%, 0);
                transform: translate(-50%, 0); 

        opacity: .06;
    }
}

/* Text bg Fade In Up Dark */
@-webkit-keyframes textBgFadeInUpDark
{
    from
    {
        -webkit-transform: translate(-50%, 200%);
                transform: translate(-50%, 200%); 

        opacity: 0;
    }
    to
    {
        -webkit-transform: translate(-50%, 0);
                transform: translate(-50%, 0); 

        opacity: .02;
    }
}
@keyframes textBgFadeInUpDark
{
    from
    {
        -webkit-transform: translate(-50%, 200%);
                transform: translate(-50%, 200%); 

        opacity: 0;
    }
    to
    {
        -webkit-transform: translate(-50%, 0);
                transform: translate(-50%, 0); 

        opacity: .02;
    }
}

/* Text bg Fade In Up 2 */
@-webkit-keyframes textBgFadeInUp2
{
    from
    {
        -webkit-transform: translate(-50%, 200%);
                transform: translate(-50%, 200%); 

        opacity: 0;
    }
    to
    {
        -webkit-transform: translate(-50%, 0);
                transform: translate(-50%, 0); 

        opacity: .5;
    }
}
@keyframes textBgFadeInUp2
{
    from
    {
        -webkit-transform: translate(-50%, 200%);
                transform: translate(-50%, 200%); 

        opacity: 0;
    }
    to
    {
        -webkit-transform: translate(-50%, 0);
                transform: translate(-50%, 0); 

        opacity: .5;
    }
}

.fadeInScale
{
    -webkit-animation-name: fadeInScale;
            animation-name: fadeInScale;
}

/* Fade In Scale */
@-webkit-keyframes fadeInScale
{
    from
    {
        -webkit-transform: scale(.7);
                transform: scale(.7); 

        opacity: 0;
    }
    to
    {
        -webkit-transform: scale(1);
                transform: scale(1); 

        opacity: 1;
    }
}
@keyframes fadeInScale
{
    from
    {
        -webkit-transform: scale(.7);
                transform: scale(.7); 

        opacity: 0;
    }
    to
    {
        -webkit-transform: scale(1);
                transform: scale(1); 

        opacity: 1;
    }
}

.scaleOut
{
    -webkit-animation-name: scaleOut;
            animation-name: scaleOut;
}

@-webkit-keyframes scaleOut
{
    from
    {
        -webkit-transform: scale(1.1);
                transform: scale(1.1);
    }
    to
    {
        -webkit-transform: scale(1);
                transform: scale(1);
    }
}

@keyframes scaleOut
{
    from
    {
        -webkit-transform: scale(1.1);
                transform: scale(1.1);
    }
    to
    {
        -webkit-transform: scale(1);
                transform: scale(1);
    }
}

/*	particles position scss
*   -------------------------------------------------------------------------------------------*/
.particles-js-canvas-el
{
    position: absolute;
    z-index: 1;
    top: 0;

    height: 100vh !important;
}

/*  Background ripple effect scss
*   -------------------------------------------------------------------------------------------*/
@-webkit-keyframes k1
{
    0%
    {
        -webkit-transform: scale(.01);
                transform: scale(.01);

        opacity: 0;
    }
    33%
    {
        -webkit-transform: scale(.4);
                transform: scale(.4);

        opacity: .8;
    }
    100%
    {
        -webkit-transform: scale(1);
                transform: scale(1);

        opacity: 0;
    }
}
@keyframes k1
{
    0%
    {
        -webkit-transform: scale(.01);
                transform: scale(.01);

        opacity: 0;
    }
    33%
    {
        -webkit-transform: scale(.4);
                transform: scale(.4);

        opacity: .8;
    }
    100%
    {
        -webkit-transform: scale(1);
                transform: scale(1);

        opacity: 0;
    }
}

.bg-ripple-animation
{
    position: absolute;
    z-index: 1;
    top: 0;
    right: 0;
    bottom: 0; 
    left: 0;

    overflow: hidden;
}

.left-bottom-ripples
{
    position: absolute;
    bottom: 0; 
    left: 0;

    width: 160vh;
    height: 160vh;
    margin-bottom: -80vh;
    margin-left: -80vh;
}

.intro-video-bg-ripples
{
    position: absolute;
    left: 0; 

    width: 140vh;
    height: 140vh;
    margin-top: 21vh;
    margin-left: -6vh;
}

.top-right-ripples
{
    position: absolute;
    top: 0;
    right: 0; 

    width: 160vh;
    height: 160vh;
    margin-top: -80vh;
    margin-right: -80vh;
}

.ripples
{
    width: 100%;
    height: 100%;

    text-align: center;
}
.ripples:before
{
    position: absolute;
    top: 0;
    left: 0;

    width: 100%;
    height: 100%;

    content: '';
    -webkit-transform: scale(1);
        -ms-transform: scale(1);
            transform: scale(1);
    -webkit-animation-name: k1;
            animation-name: k1;
    -webkit-animation-duration: 6s;
            animation-duration: 6s;
    -webkit-animation-timing-function: linear;
            animation-timing-function: linear; 
    -webkit-animation-delay: 0s;
            animation-delay: 0s;
    -webkit-animation-iteration-count: infinite;
            animation-iteration-count: infinite;

    opacity: 0;
    border: .5px solid white;
    border-radius: 50%;
    background: -webkit-radial-gradient(center, ellipse, rgba(182, 225, 235, 0) 0%, rgba(182, 225, 235, .05) 40%, rgba(182, 225, 235, .4) 100%);
    background:         radial-gradient(ellipse at center, rgba(182, 225, 235, 0) 0%, rgba(182, 225, 235, .05) 40%, rgba(182, 225, 235, .4) 100%);
}
.ripples:after
{
    position: absolute;
    top: 0;
    left: 0;

    width: 100%;
    height: 100%;

    content: '';
    -webkit-animation-name: k1;
            animation-name: k1;
    -webkit-animation-duration: 6s;
            animation-duration: 6s;
    -webkit-animation-timing-function: linear;
            animation-timing-function: linear; 
    -webkit-animation-delay: 3s;
            animation-delay: 3s;
    -webkit-animation-iteration-count: infinite;
            animation-iteration-count: infinite;

    opacity: 0;
    border: .5px solid white;
    border-radius: 50%;
    background: -webkit-radial-gradient(center, ellipse, rgba(182, 225, 235, 0) 0%, rgba(182, 225, 235, .05) 40%, rgba(182, 225, 235, .4) 100%);
    background:         radial-gradient(ellipse at center, rgba(182, 225, 235, 0) 0%, rgba(182, 225, 235, .05) 40%, rgba(182, 225, 235, .4) 100%);
}

/*	Token Sale box with counter progress and button
* 	----------------------------------------------------------------------------------------------*/
.token-details
{
    height: 336px;
    padding: 1.2rem;

    border-radius: .35rem;
    background: -webkit-linear-gradient(58deg, #ff4137, #fdc800);
    background:         linear-gradient(32deg, #ff4137, #fdc800);
    /* Flip Clock */
    /* Progress bar */
}
.token-details .clock-counter .flip-clock-wrapper ul.flip
{
    margin: 3px;

    box-shadow: none !important;
}
.token-details .clock-counter .flip-clock-divider
{
    width: 12px;
}
.token-details .clock-counter .flip-clock-divider .flip-clock-dot
{
    left: 3px; 

    width: 6px;
    height: 6px;
}
.token-details .progress
{
    overflow: initial; 

    height: 1.5rem;

    border: 4px solid #fff;
    border-radius: 1rem;
    background: #fff;
}
.token-details .progress-bar-custom
{
    height: 1rem;

    border-radius: 1rem;
    background: #fff;
    background: -webkit-linear-gradient(left, #29beff, #1c76fe);
    background:         linear-gradient(to right, #29beff, #1c76fe);
    box-shadow: 2px 0 7px 0 rgba(0, 0, 0, .35);
}
.token-details .progress-top
{
    position: absolute;
    top: -1.8rem;

    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display:         flex;

    width: 100%;
    padding: 0 1rem; 

    color: #fff;

    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
            align-items: stretch;
    /* Default */
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
            justify-content: space-between;
}
.token-details .progress-top li
{
    /* Default */
    font-size: .75rem; 

    display: block;

    -webkit-box-flex: 0;
    -webkit-flex: 0 1 auto;
        -ms-flex: 0 1 auto;
            flex: 0 1 auto;
}
.token-details .progress-top li.pre-sale
{
    position: relative;
    left: .75rem;
}
.token-details .progress-top li.bonus
{
    position: relative;
    right: 1rem;
}
.token-details .progress-bars
{
    position: absolute;
    top: -1.1rem;

    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display:         flex;

    width: 100%;
    padding: 0 1rem; 

    color: #fff;

    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
            align-items: stretch;
    /* Default */
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
            justify-content: space-between;
}
.token-details .progress-bars li
{
    display: block;

    -webkit-box-flex: 0;
    -webkit-flex: 0 1 auto;
        -ms-flex: 0 1 auto;
            flex: 0 1 auto;
    /* Default */
}
.token-details .progress-bottom
{
    position: absolute;
    bottom: 1.5rem;

    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display:         flex;

    width: 100%;
    padding: 0 1rem; 

    color: #fff;

    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
            align-items: stretch;
    /* Default */
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
            justify-content: space-between;
}
.token-details .progress-bottom .progress-info
{
    font-size: .75rem; 

    display: block;

    -webkit-box-flex: 0;
    -webkit-flex: 0 1 auto;
        -ms-flex: 0 1 auto;
            flex: 0 1 auto;
}

/*	Modification of flipclock CSS
* 	----------------------------------------------------------------------------------------------*/
.clock-counter .flip-clock-divider
{
    width: 16px;
}
.clock-counter .flip-clock-divider:first-child
{
    width: 0;
}
.clock-counter .flip-clock-divider .flip-clock-label
{
    font-family: 'Comfortaa', 'Roboto', 'Helvetica Neue', Arial, sans-serif;
    font-size: .875rem;

    right: -70px;
}
.clock-counter .flip-clock-divider.minutes .flip-clock-label,
.clock-counter .flip-clock-divider.seconds .flip-clock-label
{
    right: -80px;
}

.clock-counter .flip .inn
{
    font-family: 'Comfortaa', 'Roboto', 'Helvetica Neue', Arial, sans-serif;
    font-size: 2rem;
    font-weight: 600;
}

.clock-counter .flip-clock-wrapper ul
{
    width: 43px;
    height: 65px;

    background: #fff !important;
}
.clock-counter .flip-clock-wrapper ul li
{
    line-height: 4.5rem;
}
.clock-counter .flip-clock-wrapper ul li a
{
    color: #3f3f3f !important;
}
.clock-counter .flip-clock-wrapper ul li a div.up
{
    top: -2px; 

    height: 52%;
}
.clock-counter .flip-clock-wrapper ul li a div.up:after
{
    top: 32px;

    height: 1px;

    background-color: #000 !important;
    background-color: rgba(0, 0, 0, .4) !important;
}
.clock-counter .flip-clock-wrapper ul li a div.up div.inn
{
    color: #3f3f3f !important; 
    background-color: #fff !important;
    text-shadow: 0 1px 2px #fff !important;
}
.clock-counter .flip-clock-wrapper ul li a div.down
{
    height: 51%;
}
.clock-counter .flip-clock-wrapper ul li a div.down div.inn
{
    color: #3f3f3f !important; 
    background-color: #fff !important;
    text-shadow: 0 1px 2px #fff !important;
}
.clock-counter .flip-clock-wrapper ul.play li.flip-clock-before .up .shadow,
.clock-counter .flip-clock-wrapper ul.play li.flip-clock-active .up .shadow
{
    -webkit-animation: none !important;
            animation: none !important; 

    background: transparent !important;
}
.clock-counter .flip-clock-wrapper ul.play li.flip-clock-before .down .shadow,
.clock-counter .flip-clock-wrapper ul.play li.flip-clock-active .down .shadow
{
    -webkit-animation: none !important;
            animation: none !important; 

    background: transparent !important;
}

.clock-counter .flip-clock-wrapper .flip-clock-dot
{
    width: 7px;
    height: 7px;
}

.clock-counter .flip-clock-wrapper .flip,
.clock-counter .flip-clock-wrapper .flip-clock-dot
{
    background: #fff;
    box-shadow: 2px 1px 11px rgba(0, 0, 0, .37) !important;
}
.clock-counter .flip-clock-wrapper .flip.top,
.clock-counter .flip-clock-wrapper .flip-clock-dot.top
{
    top: 24px;
}
.clock-counter .flip-clock-wrapper .flip.bottom,
.clock-counter .flip-clock-wrapper .flip-clock-dot.bottom
{
    bottom: 48px;
}

.clock-counter .flip-clock-wrapper .flip-clock-meridium a
{
    color: #fff !important;
}

.clock-counter .flip-clock-wrapper .flip-clock-divider .flip-clock-label
{
    color: #fff !important;
}

/*  Sales Notification
    -------------------------------------------------------------------------------------------*/
.alert-minimalist
{
    z-index: 2147483648 !important; 

    width: 350px;
    padding: 10px;

    border-radius: 5px;
    background-color: white;
    box-shadow: 0 5px 40px rgba(14, 42, 76, .2);
}
.alert-minimalist [data-notify='dismiss']
{
    color: rgba(149, 149, 149, .7);
}
.alert-minimalist #image
{
    float: left;
}
.alert-minimalist #image [data-notify='icon']
{
    height: 60px;
    margin-right: 12px;
}
.alert-minimalist #text
{
    float: left;

    margin-top: 2px;
}
.alert-minimalist #text [data-notify='title']
{
    font-size: 85%;
    font-weight: 700; 
    line-height: 1rem;

    display: block;

    color: #333;
}
.alert-minimalist #text [data-notify='message']
{
    font-size: 80%;
}
.alert-minimalist #text [data-notify='message'] span.blue
{
    font-weight: 700; 

    color: #28bcfd;
}
.alert-minimalist #text [data-notify='time']
{
    font-size: 70%;

    display: block;

    margin-top: 4px; 

    color: rgba(149, 149, 149, .7);
}

/*  Vertical Social bar SCSS
    -------------------------------------------------------------------------------------------*/
.vertical-social
{
    z-index: 999;
    top: 35% !important;
    left: 2% !important;

    width: 44px;

    border-radius: 40px;
    box-shadow: 0 4px 13px 0 rgba(0, 0, 0, .4);
}
.vertical-social .midnightHeader .midnightInner ul
{
    margin-bottom: 0;
    padding: 14px 0 8px;
}
.vertical-social .midnightHeader .midnightInner ul li
{
    padding: 7px 0;

    text-align: center;
}
.vertical-social .midnightHeader .midnightInner ul li a
{
    font-size: 22px; 

    opacity: .6;
}
.vertical-social .midnightHeader .midnightInner ul li a:hover
{
    text-decoration: none;

    opacity: 1;
}

@media (max-width: 991.98px)
{
    .vertical-social
    {
        display: none !important;
    }
}

/*	Page sections css
* 	----------------------------------------------------------------------------------------------*/
/* Navbar section : Navbar area css */
.navbar
{
    padding: 0;
}
.navbar .navbar-brand
{
    font-size: 1.5rem;
}
.navbar .navbar-brand img
{
    margin-right: 14px;
}
.navbar .navbar-brand .brand-text
{
    font-weight: 500;

    position: relative;
    top: 2px;

    text-transform: uppercase;
}
.navbar.navbar-dark
{
    min-height: 65px;
}
.navbar.navbar-absolute
{
    position: absolute;
    z-index: 999;
    top: 0;
    left: 0;

    width: 100%;
    padding: 1.2rem 0;

    -webkit-transition: all .5s ease;
            transition: all .5s ease; 

    background: transparent;
}
.navbar ul.navbar-nav li .nav-link
{
    font-size: .8rem;
    font-weight: 700;

    padding: .21rem .95rem;

    text-decoration: none; 
    letter-spacing: .5px;

    color: #fff;
}
.navbar ul.navbar-nav li::last-child
{
    margin-right: .5rem;
}
.navbar .dropdown a
{
    font-size: .8rem;
    font-weight: 700;

    padding: 1.9rem .65rem; 

    text-decoration: none;

    color: #fff;
}
.navbar .dropdown .dropdown-menu
{
    min-width: 200px;
    margin-top: 1rem;

    border: none; 
    background-color: white;
}
.navbar .dropdown .dropdown-menu a
{
    padding: .5rem .75rem; 

    color: #7d7d7d;
}
.navbar .dropdown .dropdown-menu a:before
{
    font-family: 'themify';
    font-size: .55rem;
    font-weight: 700;

    padding-right: .5rem;

    content: '\e649';
    -webkit-transition: all .5s ease;
            transition: all .5s ease;
}
.navbar .dropdown .dropdown-menu a.dropdown-item
{
    -webkit-transition: all .5s ease;
            transition: all .5s ease; 

    border: none;
}
.navbar .dropdown .dropdown-menu a.dropdown-item:hover,
.navbar .dropdown .dropdown-menu a.dropdown-item:focus,
.navbar .dropdown .dropdown-menu a.dropdown-item:active
{
    padding-left: 20px;

    -webkit-transition: all .5s ease;
            transition: all .5s ease;

    background-color: transparent;
}
.navbar .dropdown .dropdown-menu a.dropdown-item:hover:before,
.navbar .dropdown .dropdown-menu a.dropdown-item:focus:before,
.navbar .dropdown .dropdown-menu a.dropdown-item:active:before
{
    left: 10px;
}
.navbar .dropdown .dropdown-menu.show
{
    border: none;
    box-shadow: -1px 2px 25px 0 rgba(0, 0, 0, .09);
}
.navbar .dropdown .dropdown-menu.show:before
{
    position: absolute;
    top: -8px; 
    left: 13px;

    float: right;

    content: '';

    border-right: 8px solid transparent;
    border-bottom: 10px solid #fff;
    border-left: 8px solid transparent;
}
.navbar.navbar-light
{
    min-height: 65px;
}
.navbar.navbar-light a
{
    color: #7d7d7d;
}
.navbar.navbar-light a.btn
{
    color: #fff;
}
.navbar.navbar-light ul.navbar-nav li .nav-link
{
    color: #7d7d7d;
}

#navigation #slide-line
{
    position: absolute;
    bottom: 0;

    height: 4px;

    -webkit-transition: all .3s ease;
            transition: all .3s ease;
}

header .navbar.navbar-fixed
{
    padding: .75rem 0; 

    background: -webkit-linear-gradient(left, #140e38, #194089);
    background:         linear-gradient(to right, #140e38, #194089);
}

header .navbar.navbar-shadow
{
    box-shadow: 0 5px 40px rgba(14, 42, 76, .2);
}

/* Medium devices (tablets, 768px and up) */
@media (max-width: 1199.98px)
{
    .navbar ul.navbar-nav li .nav-link
    {
        padding-right: .55rem; 
        padding-left: .55rem;
    }
}

/* Responsive navbar for medium and small screen */
@media (max-width: 991.98px)
{
    .main-menu.navbar .dropdown-menu.show:before
    {
        display: none;
    }
    .main-menu.navbar a.navbar-brand
    {
        padding: .21rem 1rem;
    }
    .main-menu.navbar .navbar-toggler
    {
        margin-right: 1rem;

        border-color: rgba(255, 255, 255, .7);
    }
    .main-menu.navbar div.navbar-nav
    {
        padding: 1rem 1.5rem;
    }
    .main-menu.navbar div.navbar-nav .dropdown
    {
        padding: 0 !important;
    }
    .main-menu.navbar div.navbar-nav .nav-link
    {
        padding: .40rem .65rem;
    }
}

/* 3d graphics header section : Head area css */
.head-area
{
    position: relative;
}
.head-area .head-content
{
    z-index: 6; 

    height: 100vh;
}
.head-area .head-content h1
{
    font-size: 1.9rem;
    font-weight: 700; 
    line-height: 2.75rem;

    color: #fff;
}
.head-area .head-content h3
{
    font-size: 1.125rem;
    font-weight: 700; 
    line-height: 1.9rem;

    margin-top: 4.375rem;

    color: #fff;
}
.head-area .head-content .container
{
    z-index: 9;
}

/* 	About section : about content, image and play button css */
.about .content-area h4
{
    color: #7d7d7d;
}

.about .content-area h6
{
    font-size: 1.125rem;
    line-height: 1.5rem; 

    color: #7d7d7d;
}

.about .content-area .play-video
{
    position: absolute;
    top: 78%;
    left: 53%;

    -webkit-transform: translate(-70%, -50%);
        -ms-transform: translate(-70%, -50%);
            transform: translate(-70%, -50%);
}
.about .content-area .play-video .play
{
    display: inline-block;

    width: 72px; 
    height: 72px;
    padding: 1.125rem 1.1rem;
}
.about .content-area .play-video .play:hover
{
    text-decoration: none;
}
.about .content-area .play-video .play i
{
    font-size: 2rem;
}
.about .content-area .play-video span
{
    font-size: .875rem; 

    display: block;

    color: #3f3f3f;
}

/* 	Exchange Listing section : Listing title & content css */
.exchange-listing .listing
{
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display:         flex;

    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
            align-items: stretch;
}
.exchange-listing .listing .col
{
    font-weight: 600;

    margin: 1.75rem 0 .95rem;
    padding-top: .25rem;

    text-align: center;
}
.exchange-listing .listing .col:before
{
    position: relative;
    top: 5px;
    left: -15px; 

    float: left;

    height: 4rem;

    content: '';

    border-left: 1px solid #c2c2c2;
}
.exchange-listing .listing .col:first-child:before
{
    border-left: none;
}
.exchange-listing .listing .col h2
{
    font-size: 2rem;
    font-weight: 600;

    color: #7d7d7d;
}

@media (max-width: 991.98px)
{
    .exchange-listing .listing .col:nth-child(2):before
    {
        border-left: none;
    }
}

@media (max-width: 575.98px)
{
    .exchange-listing .listing .col:nth-child(4):before
    {
        border-left: none;
    }
}

/* header section type 2 : Light/Dark page section heading with title, sub-title and desc */
.section-padding
{
    padding-top: 6.5rem;
    padding-bottom: 6.5rem;
}

/* Dark section heading */
.dark-bg-heading
{
    position: relative;
}
@media (min-width: 768px)
{
    .dark-bg-heading
    {
        margin-bottom: 6rem;
    }
}
@media (max-width: 991.98px)
{
    .dark-bg-heading
    {
        margin-bottom: 3rem;
    }
}
.dark-bg-heading .title
{
    padding-top: 2.25rem;

    text-transform: uppercase; 

    color: #fff;
}
.dark-bg-heading .sub-title
{
    font-size: 5.625rem;
    font-weight: 700;

    position: absolute;
    top: -2px;
    left: 50%;

    display: block;

    width: 100%;
    margin: 0 auto;

    -webkit-transform: translate(-50%);
        -ms-transform: translate(-50%);
            transform: translate(-50%);
    text-align: center;
    letter-spacing: 0;
    text-transform: uppercase; 

    opacity: .075;
    color: #dcd6f5;
}
.dark-bg-heading .content-desc
{
    font-size: .875rem;

    margin-top: 2.5rem; 

    color: #fff;
}

/* Default/Light section heading */
.heading
{
    position: relative;
}
@media (min-width: 768px)
{
    .heading
    {
        margin-bottom: 6rem;
    }
}
@media (max-width: 991.98px)
{
    .heading
    {
        margin-bottom: 3rem;
    }
}
.heading .title
{
    padding-top: 2.25rem;

    text-transform: uppercase; 

    color: #161616;
}
.heading .sub-title
{
    font-size: 5.625rem;
    font-weight: 700;

    position: absolute;
    top: -2px;
    left: 50%;

    display: block;

    width: 100%;
    margin: 0 auto;

    -webkit-transform: translate(-50%);
        -ms-transform: translate(-50%);
            transform: translate(-50%);
    text-align: center;
    letter-spacing: 0;
    text-transform: uppercase; 

    opacity: .2;
    color: #dcd6f5;
}
.heading .content-desc
{
    margin-top: 2.5rem; 

    color: #3f3f3f;
}

/* Whitepaper section : Whitepaper language image and text */
.whitepaper .content-title
{
    color: #7d7d7d;
}

.whitepaper .whitepaper-languages a:hover
{
    text-decoration: none;
}

.whitepaper .whitepaper-languages img
{
    border: 8px solid white;
    border-radius: 50%;
    box-shadow: 0 0 20px 0 rgba(103, 103, 103, .5);
}

.whitepaper .whitepaper-languages .lang-text
{
    margin-top: 1rem;
}
.whitepaper .whitepaper-languages .lang-text .icon
{
    color: #194089;
}
.whitepaper .whitepaper-languages .lang-text .language
{
    font-size: .875rem;

    color: #7d7d7d;
}

/* Tokens Sale section : Tokens sale information list */
.token-sale
{
    /* Tokens sale list */
}
.token-sale h5
{
    font-weight: 700;

    text-align: center; 

    color: #7d7d7d;
}
.token-sale ul.token-sale-info
{
    font-size: .875rem; 

    padding-left: 8px;
}
.token-sale ul.token-sale-info li
{
    padding: 1rem 0;

    color: #3f3f3f;
}
.token-sale ul.token-sale-info li:before
{
    font-family: 'themify';
    font-size: 1.125rem;

    position: absolute;
    left: -3px;

    margin-top: -4px; 
    margin-right: 10px;

    content: '\e65d';

    color: #fff;
}

/* Mobile App section : Mobile App button, information and image */
.mobile-app
{
    padding-top: 185px;
}
.mobile-app .btn
{
    padding: .8rem 1.5rem;
}
.mobile-app .mobile-button span
{
    padding-right: 2.5rem;
}
.mobile-app .app-features
{
    margin-bottom: 50px; 
    padding: 0;
}
.mobile-app .app-features li
{
    padding: 14px 0;
}
.mobile-app .mobile-app-imgs
{
    position: relative;

    margin-top: 60px;
}
.mobile-app .mobile-app-imgs .mobile-app-img-2,
.mobile-app .mobile-app-imgs .mobile-app-img-3,
.mobile-app .mobile-app-imgs .mobile-app-img-4
{
    position: absolute;
}
.mobile-app .mobile-app-imgs .mobile-app-img-2
{
    top: 60px;
    left: 250px;
}
.mobile-app .mobile-app-imgs .mobile-app-img-3
{
    top: -13px;
    left: 237px;
}
.mobile-app .mobile-app-imgs .mobile-app-img-4
{
    top: -130px;
    left: 270px;
}

/* Roadmap section : Roadmap active area, buttons, and content */
.roadmap .roadmap-container
{
    position: relative;
}

.roadmap .swiper-container
{
    width: 90%;
    height: 100%;
}

.roadmap .swiper-slide
{
    font-size: 18px;

    width: 200px;

    text-align: center;

    border-top: 4px solid #24a8f2;
}
.roadmap .swiper-slide .roadmap-info
{
    margin-top: 47px;
}
.roadmap .swiper-slide.active .roadmap-info
{
    margin-top: 32px;
    padding: 15px 0 0;

    color: white;
    border-radius: 6px;
    background: -webkit-linear-gradient(45deg, #29beff, #1c76fe);
    background:         linear-gradient(45deg, #29beff, #1c76fe);
    box-shadow: 0 10px 30px 0 rgba(62, 57, 107, .3);
}
.roadmap .swiper-slide.active .roadmap-info:after
{
    position: absolute;
    top: 12px;
    bottom: 100%;
    left: 44%;

    display: block;

    width: 0;
    height: 0;

    content: '';

    border-top: 10px solid transparent;
    border-right: 10px solid transparent; 
    border-bottom: 10px solid #1c76fe;
    border-left: 10px solid transparent;
}
.roadmap .swiper-slide.active .live
{
    display: block;

    margin-top: 10px; 
    padding: 8px 0;

    border-radius: 0 0 6px 6px;
    background: -webkit-linear-gradient(45deg, #bf68e6, #9e48cd);
    background:         linear-gradient(45deg, #bf68e6, #9e48cd);
}

.roadmap .swiper.control
{
    position: absolute;
}

.roadmap .next-slide,
.roadmap .prev-slide
{
    position: absolute;
    z-index: 9; 
    top: 0;

    display: inline-block;

    padding: 17px;

    cursor: pointer;

    color: #fff;
    border-radius: 50%;
    background: -webkit-linear-gradient(45deg, #bf68e6, #9e48cd);
    background:         linear-gradient(45deg, #bf68e6, #9e48cd);
    box-shadow: 0 0 6px 0 rgba(255, 95, 43, .6);
}
.roadmap .next-slide:focus,
.roadmap .prev-slide:focus
{
    outline: none;
}

.roadmap .next-slide
{
    right: 22px;
}
.roadmap .next-slide:before
{
    font-family: themify;

    position: absolute;
    top: 5px;
    left: 10px; 

    content: '\e649';
}

.roadmap .prev-slide
{
    left: 22px;
}
.roadmap .prev-slide:before
{
    font-family: themify;

    position: absolute;
    top: 5px;
    left: 8px; 

    content: '\e64a';
}

.roadmap .timeline
{
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display:         flex;

    margin: 1rem 0 2rem 0;
    padding: 0;

    list-style-type: none;

    text-align: center;
}

.roadmap .timestamp
{
    font-weight: 100; 

    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display:         flex;
            flex-direction: column;

    margin-bottom: 10px;

    color: #7d7d7d;

    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
        -ms-flex-direction: column;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
            align-items: center;
}
.roadmap .timestamp span
{
    font-size: .875rem;
    font-weight: 700;
    line-height: 1.5rem;
}
.roadmap .timestamp span:before
{
    position: absolute;
    top: -14px;
    left: 42%;

    width: 25px;
    height: 25px;

    content: '';
    -webkit-transition: all 200ms ease-in;
            transition: all 200ms ease-in; 

    border: none;
    border-radius: 25px;
    background: -webkit-linear-gradient(45deg, #29beff, #1c76fe);
    background:         linear-gradient(45deg, #29beff, #1c76fe);
    background-color: white;
}
.roadmap .timestamp span:after
{
    position: absolute;
    top: -7px;
    left: 45.4%;

    width: 11px;
    height: 11px;

    content: '';
    -webkit-transition: all 200ms ease-in;
            transition: all 200ms ease-in; 

    border-radius: 25px;
    background-color: white;
}
.roadmap .timestamp.completed span:before
{
    font-family: themify;
    font-size: .75rem;
    line-height: 25px;

    content: '\e64c';

    color: white;
    color: #fff; 
    border: none;
    background: -webkit-linear-gradient(45deg, #29beff, #1c76fe);
    background:         linear-gradient(45deg, #29beff, #1c76fe);
}
.roadmap .timestamp.completed span:after
{
    content: '';

    background-color: transparent;
}
.roadmap .timestamp.active span
{
    color: #fff;
}
.roadmap .timestamp.active span:before
{
    content: ' ';

    border: none;
    background: -webkit-linear-gradient(45deg, #bf68e6, #9e48cd);
    background:         linear-gradient(45deg, #bf68e6, #9e48cd);
    box-shadow: 0 0 10px 0 #bf68e6;
}
.roadmap .timestamp.active span:after
{
    position: absolute;
    top: -8px;
    left: 45.1%;

    content: '';

    border: 6px solid #fff;
    border-radius: 50%; 
    background: #fff;
}

.roadmap .status
{
    line-height: 0; 

    position: relative;

    -webkit-transition: all 200ms ease-in;
            transition: all 200ms ease-in;
}
.roadmap .status span
{
    font-size: .875rem;
    line-height: 1.5rem;

    color: #3f3f3f;
}
.roadmap .status.active span
{
    color: #fff;
}

/* Team section : Team & Advisor section with team image and description */
.team .team-width span
{
    font-size: 2rem;
    font-weight: 700;

    display: block;

    color: #7d7d7d;
}

.team .team-img
{
    position: relative;
    z-index: 1; 

    padding: 7px;

    cursor: pointer;

    border-radius: 50%;
    background: -webkit-linear-gradient(45deg, #29beff, #1c76fe);
    background:         linear-gradient(45deg, #29beff, #1c76fe);
    box-shadow: 0 0 12px 0 #29beff;
}
.team .team-img:hover
{
    background: -webkit-linear-gradient(45deg, #ff4137, #fdc800);
    background:         linear-gradient(45deg, #ff4137, #fdc800); 
    box-shadow: 0 0 12px 0 #ff4137;
}
.team .team-img:hover:before
{
    -webkit-transform: rotate(55deg);
        -ms-transform: rotate(55deg);
            transform: rotate(55deg); 

    border-image-source: linear-gradient(to top, #ff4137, #fdc800);
}
.team .team-img:hover ~ .team-icon
{
    background: -webkit-linear-gradient(45deg, #ff4137, #fdc800);
    background:         linear-gradient(45deg, #ff4137, #fdc800);
}
.team .team-img img
{
    border: 5px solid #fff;
}
.team .team-img:before
{
    position: absolute;
    z-index: -1;
    top: -28px;
    left: 50%;

    height: 200px;

    content: '';
    -webkit-transition-duration: .5s;
            transition-duration: .5s; 
    -webkit-transition-property: -webkit-transform;
            transition-property: -webkit-transform;
            transition-property:         transform;
            transition-property:         transform, -webkit-transform;
    -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
            transform: rotate(45deg);

    border-right: 3px solid #29beff;
    border-image-source: linear-gradient(to top, #29beff, #1c76fe);
    border-image-slice: .5;
}

.team .team-icon
{
    position: absolute;
    z-index: 1;
    bottom: 25%;
    left: 135px;

    padding: .2rem .1rem .017rem .17rem; 

    border-radius: 50%;
    background: -webkit-linear-gradient(45deg, #29beff, #1c76fe);
    background:         linear-gradient(45deg, #29beff, #1c76fe);
}
.team .team-icon i
{
    font-size: .875rem; 

    padding: .25rem .3rem;

    border-radius: 50%;
    background: #fff;
}

.team .profile .name
{
    font-size: 1.125rem;
    font-weight: 700;

    color: #7d7d7d;
}

.team .profile .role
{
    font-size: .875rem;

    color: #3f3f3f;
}

.team .profile img
{
    position: relative; 
    left: -10px;

    height: 40px;
}

.team .profile .social-profile a
{
    font-size: 1.125rem;

    text-decoration: none;

    color: #7d7d7d;
}

/* Team modal popup scss */
.team-modal
{
    background: -webkit-linear-gradient(45deg, rgba(41, 190, 255, .85), rgba(28, 118, 254, .85));
    background:         linear-gradient(45deg, rgba(41, 190, 255, .85), rgba(28, 118, 254, .85));
}
.team-modal .close
{
    position: absolute;
    z-index: 9; 
    top: 1rem;
    right: 1rem;
}
.team-modal .progress
{
    height: 6px;
}

/* FAQ section : FAQ navs with questions/answers accordion */
.faq .nav.nav-underline
{
    border-bottom: 1px solid #eeecf4;
}
.faq .nav.nav-underline a
{
    font-size: 1.125rem;
    font-weight: 700;

    text-align: center;

    color: #c7b8ff;
    background: transparent;

    -webkit-box-flex: 1;
    -webkit-flex: 1;
        -ms-flex: 1;
            flex: 1;
}
.faq .nav.nav-underline a.nav-item.nav-link.active
{
    margin-bottom: -2px; 

    color: #fff;
    border: none;
    border-bottom: 4px solid #7240a5;
    border-radius: 0;
    background-color: transparent;
}

.faq .tab-content .card
{
    margin-bottom: .75rem;

    border: 1px solid #eeecf4;
    border-radius: .5rem;
}
.faq .tab-content .card .card-header
{
    padding: .6rem;

    text-decoration: none; 

    border-bottom: none;
    background-color: transparent;
}
.faq .tab-content .card .card-header .btn-link
{
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.5;

    display: inline-block;

    margin: 6px 2.25rem 0 2.9rem;
    padding: .375rem .75rem;

    cursor: pointer; 
    text-align: left;
    white-space: unset;
}
.faq .tab-content .card .card-header .btn-link:hover,
.faq .tab-content .card .card-header .btn-link:focus,
.faq .tab-content .card .card-header .btn-link:active
{
    text-decoration: none;
}
.faq .tab-content .card .card-body
{
    font-size: .875rem;
    font-weight: 700;

    padding-top: .75rem; 

    color: #3f3f3f;
}

.faq .collapse-icon .card-header
{
    position: relative;
}

.faq .collapse-icon a[data-toggle='collapse']:after,
.faq .collapse-icon a[data-toggle='collapse']:before
{
    font-family: 'themify';
    font-size: clac(.65rem);

    position: absolute;
    top: 40%;
    right: 20px;

    margin-top: -8px;

    -webkit-transition: all 300ms linear 0s;
            transition: all 300ms linear 0s;

    background-image: -webkit-linear-gradient(left, #bf68e6, #9e48cd);
    background-image:         linear-gradient(90deg, #bf68e6, #9e48cd);
    -webkit-background-clip: text;
            background-clip: text;

    text-fill-color: transparent;
}

.faq .collapse-icon a[data-toggle='collapse']:after
{
    content: '\e648';
}

.faq .collapse-icon a[data-toggle='collapse']:before
{
    content: '\e64b';
}

.faq .collapse-icon a[data-toggle='collapse'] .icon
{
    float: left;

    margin-top: 1px;
}
.faq .collapse-icon a[data-toggle='collapse'] .icon:after,
.faq .collapse-icon a[data-toggle='collapse'] .icon:before
{
    font-family: 'themify';
    font-size: .65rem;

    position: absolute;
    top: 40%;
    left: 20px;

    margin-top: -8px;
    padding: .5rem .65rem;

    -webkit-transition: all 300ms linear 0s;
            transition: all 300ms linear 0s;

    color: #fff;
    border: 0;
    border-radius: 1rem;
    background-image: -webkit-linear-gradient(45deg, #bf68e6, #9e48cd);
    background-image:         linear-gradient(45deg, #bf68e6, #9e48cd);
    background-repeat: repeat-x;
    box-shadow: 0 0 12px 0 #bf68e6;
}
.faq .collapse-icon a[data-toggle='collapse'] .icon:after
{
    content: '\e622';
}
.faq .collapse-icon a[data-toggle='collapse'] .icon:before
{
    content: '\e61a';
}

.faq .collapse-icon.left a
{
    padding-left: 28px;
}
.faq .collapse-icon.left a:before,
.faq .collapse-icon.left a:after
{
    right: auto; 
    left: 20px;
}

.faq .collapse-icon a[aria-expanded='true']:before,
.faq .collapse-icon a[aria-expanded='true'] .icon:before
{
    opacity: 0;
}

.faq .collapse-icon a[aria-expanded='false']:after,
.faq .collapse-icon a[aria-expanded='false'] .icon:after
{
    opacity: 0;
}

.faq .collapse-icon.accordion-icon-rotate a[aria-expanded='true']:before,
.faq .collapse-icon.accordion-icon-rotate a[aria-expanded='true'] .icon:before
{
    -webkit-transform: rotate(-180deg);
        -ms-transform: rotate(-180deg);
            transform: rotate(-180deg);
}

.faq .collapse-icon.accordion-icon-rotate a[aria-expanded='false']:after,
.faq .collapse-icon.accordion-icon-rotate a[aria-expanded='false'] .icon:after
{
    -webkit-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
            transform: rotate(180deg);
}

/* contact page : Contact area info and icons */
.contact
{
    position: relative;
}
.contact .contact-info
{
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display:         flex;

    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
            justify-content: space-between;
}
.contact .contact-info li
{
    padding: 2rem 0;

    -webkit-box-flex: 0;
    -webkit-flex: 0 1 auto;
        -ms-flex: 0 1 auto;
            flex: 0 1 auto;
}
.contact .contact-info li i
{
    font-size: 2rem; 

    color: #7240a5;
}
.contact .contact-info li span
{
    font-size: 1.125rem;

    padding-left: .8rem; 

    vertical-align: top;

    color: #3f3f3f;
}

@media (max-width: 991.98px)
{
    .contact .contact-info li
    {
        padding: .5rem 0;
    }
}

/* 3d graphics footer section : Footer area css */
.footer
{
    position: relative;

    margin-top: 6.5rem;
    padding-top: 18.5rem;
    padding-bottom: 2.5rem;

    color: #fff; 
    background: url('../../theme-assets/images/footer-image.png') no-repeat center center;
    background-size: cover;
}
.footer .footer-wrapper .title
{
    margin-bottom: 55px;
}
.footer .footer-wrapper .logo-text
{
    font-size: 1.5rem;
}
.footer .footer-wrapper .about-text p
{
    color: #fff;
}
.footer .footer-wrapper ul.useful-links
{
    padding: 0;
}
.footer .footer-wrapper ul.useful-links li
{
    line-height: 30px;
}
.footer .footer-wrapper ul.useful-links li a
{
    color: #fff;
}
.footer .footer-wrapper ul.useful-links li a:hover
{
    text-decoration: none;
}
.footer .footer-wrapper ul.social-buttons li
{
    display: inline-block;
}
.footer .footer-wrapper ul.social-buttons li a
{
    font-size: 1.125rem; 

    margin-right: 1rem;
    padding: 0;

    color: #fff;
}
.footer .footer-wrapper ul.social-buttons li a i
{
    vertical-align: middle;
}
.footer .footer-wrapper ul.social-buttons li a:hover
{
    color: #bf68e6;
}
.footer .footer-wrapper .feed span
{
    font-size: .875rem; 

    display: block;

    margin-bottom: 25px;
}
.footer .footer-wrapper .copyright
{
    font-size: .75rem;
}

.blog-area
{
    position: relative;

    background: #f5f4fb;
}
.blog-area a:hover
{
    text-decoration: none;
}
.blog-area p,
.blog-area blockquote
{
    color: #7d7d7d;
}
.blog-area .blog-head
{
    background: -webkit-linear-gradient(left, #140e38, #194089);
    background:         linear-gradient(to right, #140e38, #194089);
}
.blog-area .blog-head-content img
{
    z-index: 6;

    width: 100%; 
    height: 500px;

    opacity: .25;
    color: #fff;
}
.blog-area .blog-container
{
    margin-top: -170px;
}
.blog-area .blog-container .breadcrumb
{
    font-size: 1rem;

    padding-left: 0; 

    color: #fff;
    background: none;
}
.blog-area .blog-container .breadcrumb a
{
    font-size: 1rem;
    font-weight: 300;

    padding-right: 5px; 
    padding-left: 5px;

    color: #fff;
}
.blog-area .blog-container .breadcrumb a:first-child
{
    padding-left: 0;
}
.blog-area .blog-container .breadcrumb a.current
{
    font-weight: 700;
}
.blog-area .blog-container .breadcrumb a:hover
{
    text-decoration: none;
}
.blog-area .blog-container .card
{
    border: none;
}
.blog-area .blog-container .card.square
{
    margin-bottom: 5rem; 

    border-radius: 0;
}
.blog-area .blog-container .card .content-area
{
    padding: 1.25rem .9rem;
}
.blog-area .blog-container .card .content-area .card-title
{
    font-weight: 700;

    margin-bottom: 1.5rem; 

    color: #3f3f3f;
}
.blog-area .blog-container .card .content-area .subtitle
{
    font-size: 1.125rem;

    margin-bottom: 1rem; 

    text-transform: uppercase;

    color: #3f3f3f;
}
.blog-area .blog-container .card .content-area .subtitle .blue
{
    font-weight: 700; 

    color: #28bcfd;
}
.blog-area .blog-container .card .content-area .comment-section .commets-title
{
    font-weight: 700;
}
.blog-area .blog-container .card .content-area .comment-section .comment-area
{
    margin-bottom: 3rem; 
    padding: 1rem 2rem;

    background: #f5f4fb;
}
.blog-area .blog-container .card .content-area .comment-section .comment-area .media
{
    position: relative;

    margin-top: 2rem;
    margin-bottom: 1rem;
}
.blog-area .blog-container .card .content-area .comment-section .comment-area .media .user-name
{
    font-weight: 700;

    margin-top: .5rem; 
    margin-bottom: 0;

    color: #3f3f3f;
}
.blog-area .blog-container .card .content-area .comment-section .comment-area .media .date-time
{
    font-size: .75rem; 

    text-transform: uppercase;

    color: #3f3f3f;
}
.blog-area .blog-container .card .content-area .comment-section .comment-area .media .reply
{
    position: absolute;
    top: 0; 
    right: 0;
}
.blog-area .blog-container .card .content-area .comment-section .comment-area .media .reply a
{
    font-size: .938rem; 
    font-weight: 700;

    color: #3f3f3f;
}
.blog-area .blog-container .card .content-area .comment-section .comment-area .media .reply a i
{
    margin-right: .25rem;
}
.blog-area .blog-container .card .content-area .comment-section .comment-area .media .media
{
    margin-left: -75px; 
    padding-left: 3rem;
}
.blog-area .blog-container .card .content-area .comment-section .comment-area .media .comment-desc
{
    margin-top: 1.5rem;
    margin-bottom: 0; 
    margin-left: -80px;
}
.blog-area .blog-container .card .content-area .comment-section .comment-area .media .comment-reply
{
    margin-top: 2rem;
}
.blog-area .blog-container .card .content-area .comment-section .comment-area .media .comment-reply .media
{
    border-left: 1px solid #7d7d7d;
}
.blog-area .blog-container .card .content-area .comment-section .leave-comment
{
    margin-bottom: 2rem;
}
.blog-area .blog-container .card .content-area .comment-section .leave-comment .form-control
{
    margin-bottom: 1.5rem;
}
.blog-area .blog-container .card .content-area hr
{
    margin-bottom: 3rem;
}
.blog-area .blog-container .post-listing .card
{
    box-shadow: 0 0 12px 0 rgba(0, 0, 0, .1);
}
.blog-area .blog-container .post-listing .card.square
{
    margin-bottom: 2rem;
}
.blog-area .blog-container .post-listing .card .card-img-top
{
    border-radius: 0;
}
.blog-area .blog-container .post-listing .card .post-info
{
    font-size: .938rem;
    font-weight: 700;

    display: inline-block; 

    width: 100%;
    margin-bottom: 1.25rem;

    color: #3f3f3f;
}
.blog-area .blog-container .post-listing .card .post-info i
{
    font-weight: 700;
}
.blog-area .blog-container .post-listing .card .post-info .author
{
    float: left;
}
.blog-area .blog-container .post-listing .card .post-info .date-comments
{
    float: right;
}
.blog-area .blog-container .post-listing .card .post-info .date-comments .date
{
    margin-right: .25rem;
}
.blog-area .blog-container .post-listing .card .post-info a
{
    color: #3f3f3f;
}
.blog-area .blog-container .post-listing .card .post-title
{
    font-weight: 700;

    display: inline-block;

    margin-bottom: 1rem;
}
.blog-area .blog-container .post-listing .card .read-more
{
    font-size: 1.125rem;
    font-weight: 700;

    padding: .4rem 2.2rem;
}

blockquote
{
    font-size: .875rem; 
    font-style: italic;

    padding: 15px 20px;

    color: #3f3f3f;
    border-left: 5px solid #bf68e6;
    background: #f5f4fb;
}

.tags
{
    margin-bottom: 3rem;
}
.tags .tag-element
{
    font-size: .875rem;
    font-weight: 700;

    display: inline-block;

    margin-right: .35rem;
    margin-bottom: .5rem; 
    padding: .45rem 1rem;

    color: #3f3f3f;
    border: 2px solid #1d78ff;
    border-radius: 5px;
}

.pagination
{
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display:         inline-flex;

    margin-bottom: 4.5rem;
}
.pagination .page-link
{
    font-size: 1rem;
    font-weight: 700;

    margin-right: 4px;

    text-decoration: none;

    color: #3f3f3f; 
    border: none;
    border-radius: 3px;
    background: none;
}
.pagination .page-link:hover
{
    color: #fff; 
    background: -webkit-linear-gradient(50deg, #28bcfd, #1d78ff);
    background:         linear-gradient(40deg, #28bcfd, #1d78ff);
}
.pagination .page-link.active
{
    color: #fff;
    border: none;
    background: -webkit-linear-gradient(50deg, #28bcfd, #1d78ff);
    background:         linear-gradient(40deg, #28bcfd, #1d78ff);
}
.pagination .page-link:focus
{
    text-shadow: none;
}

@media (min-width: 992px) and (max-width: 1199.98px)
{
    .blog-area .blog-container .sidebar .social-card .card-body ul.social-buttons li.social-text
    {
        margin-right: 0;
    }
    .blog-area .blog-container .sidebar .social-card .card-body ul.social-buttons li a
    {
        margin-right: 0rem;
    }
    .blog-area .blog-container .sidebar .latest-posts ul li .post-name
    {
        margin-top: 0;
    }
}

@media (max-width: 1199.98px)
{
    .blog-area .blog-container .card .content-area .comment-section .comment-area .media .reply
    {
        right: -70px;
    }
    .blog-area .blog-container .card .content-area .comment-section .comment-area .media .reply a
    {
        color: transparent;
    }
    .blog-area .blog-container .card .content-area .comment-section .comment-area .media .reply a i
    {
        color: #3f3f3f;
    }
}

@media (max-width: 991.98px)
{
    .blog-area .blog-container .card.square
    {
        margin-bottom: 0;
    }
    .blog-area .blog-container .sidebar .card.square
    {
        margin-bottom: 5rem;
    }
}

@media (max-width: 767.98px)
{
    .blog-area .blog-container .sidebar .social-card .card-body ul.social-buttons li.social-text
    {
        margin-right: 0;
    }
    .blog-area .blog-container .sidebar .social-card .card-body ul.social-buttons li a
    {
        margin-right: 0rem;
    }
}

.sidebar
{
    margin-top: 4.75rem;
}
.sidebar ul
{
    padding-left: 0;
}
.sidebar .social-card
{
    margin-bottom: 3rem;
}
.sidebar .social-card .card-body
{
    padding: 1rem;
}
.sidebar .social-card .card-body .sidebar-title
{
    font-weight: 700;

    margin: 1.75rem 0; 

    color: #3f3f3f;
}
.sidebar .social-card .card-body ul
{
    margin-bottom: 0;
}
.sidebar .social-card .card-body ul.social-buttons li
{
    display: inline-block;
}
.sidebar .social-card .card-body ul.social-buttons li.social-text
{
    font-size: .875rem;

    margin-right: 1rem; 

    color: #3f3f3f;
}
.sidebar .social-card .card-body ul.social-buttons li a
{
    font-size: 1rem;

    margin-right: .5rem;
    padding: .34rem .6rem;

    color: #343a40; 
    border: 1px solid #6c757d;
}
.sidebar .social-card .card-body ul.social-buttons li a i
{
    vertical-align: middle;
}
.sidebar .social-card .card-body ul.social-buttons li a:hover
{
    padding: .4rem .66rem; 

    color: #fff;
    border: none;
    background-image: -webkit-linear-gradient(left, #1d78ff 0%, #28bcfd 100%);
    background-image:         linear-gradient(to right, #1d78ff 0%, #28bcfd 100%);
    box-shadow: 0 0 10px 3px rgba(40, 188, 253, .26);
}
.sidebar .search
{
    position: relative;

    margin-top: 1rem;
    margin-bottom: 1.75rem;
}
.sidebar .search input
{
    font-family: 'Comfortaa';

    color: #3f3f3f;
}
.sidebar .search input:placeholder
{
    opacity: 1; 
    color: #3f3f3f;
}
.sidebar .search .search-control
{
    width: 100%; 
    padding: 1rem;

    border: 1px solid #e7e6f1;
    background: #f5f4fb;
}
.sidebar .search .search-submit
{
    font-size: 1.125rem; 

    position: absolute;
    top: 1rem;
    right: .5rem;

    color: #3f3f3f;
    border: none;
    background: none;
}
.sidebar hr
{
    margin: 2rem 0;
}
.sidebar .categories ul li
{
    display: inline-block;

    width: 100%;
}
.sidebar .categories ul li .cat-name,
.sidebar .categories ul li .cat-count
{
    font-size: .938rem; 

    float: left;

    color: #3f3f3f;
}
.sidebar .categories ul li .cat-count
{
    float: right;
}
.sidebar .latest-posts ul li
{
    margin-bottom: 1rem;
}
.sidebar .latest-posts ul li a
{
    color: #3f3f3f;
}
.sidebar .latest-posts ul li a .post-name
{
    margin-top: .65rem; 
    margin-bottom: .25rem;
}
.sidebar .contact-us
{
    margin-bottom: 1rem; 
    padding: 1.5rem 0 1.2rem;

    text-align: center;

    border-radius: 7px;
    background: -webkit-linear-gradient(left, #140e38, #194089);
    background:         linear-gradient(to right, #140e38, #194089);
}
.sidebar .contact-us a
{
    color: white;
}
.sidebar .contact-us .contact-title
{
    font-weight: 700;

    margin-bottom: 1rem;
}
.sidebar .contact-us .contact-text
{
    font-size: .938rem;
}
.sidebar .contact-us .btn
{
    margin-top: 1rem;
    padding: .65rem 2.25rem;
}

body.inner-page
{
    background-color: #f5f4fb; 
    background-image: none;
}

.section-bg-inner
{
    background-color: #f5f4fb;
}

.page-title
{
    font-weight: 700;
    line-height: 2.5rem;

    margin-bottom: 0; 

    text-transform: uppercase;

    color: white;
}

.sub-page .page-header
{
    position: relative; 

    width: 100%;
    height: 500px;

    background: -webkit-linear-gradient(left, #140e38, #194089);
    background:         linear-gradient(to right, #140e38, #194089);
}
.sub-page .page-header .img
{
    width: 100%;
    height: 500px; 

    content: '';

    opacity: .2;
    background: url('../../theme-assets/images/blockchain.png');
}
.sub-page .page-header .head-content
{
    position: absolute;
    top: 220px;

    text-align: center;
}

.sub-page .breadcrumb
{
    font-size: 1rem;

    display: inline-block; 

    color: #fff;
    background: none;
}
.sub-page .breadcrumb a
{
    font-size: 1rem;
    font-weight: 300;

    padding-right: 5px; 
    padding-left: 5px;

    color: #fff;
}
.sub-page .breadcrumb a:first-child
{
    padding-left: 0;
}
.sub-page .breadcrumb a.current
{
    font-weight: 700;
}
.sub-page .breadcrumb a:hover
{
    text-decoration: none;
}

.sub-page .section-padding
{
    padding-top: 4rem;
    padding-bottom: 4rem;
}

.sub-page .page-desc-title
{
    font-weight: 700;

    margin-bottom: 2rem;

    color: #3f3f3f;
}
.sub-page .page-desc-title.title-border
{
    padding-top: 4px; 
    padding-left: 1.1rem;

    border-left: 5px solid #3f3f3f;
}

.sub-page .features .page-desc-title
{
    margin-top: 1.25rem; 
    margin-bottom: .25rem;
}

.sub-page .features .feature-number
{
    font-size: 6rem;
    font-weight: 700;
    line-height: 6rem;

    color: #1f86ff;
}

.sub-page .features .feature-name
{
    font-size: 1.3rem;
    font-weight: 700;

    margin-bottom: .75rem; 

    color: #3f3f3f;
}

.sub-page p
{
    color: #7d7d7d;
}

.inner-page-sidebar .sidebar
{
    margin-top: -7.3rem;
}
.inner-page-sidebar .sidebar .card
{
    border: none;
}

@media (max-width: 991.98px)
{
    .inner-page-sidebar .sidebar
    {
        margin-top: 0;
        margin-bottom: 4rem;
    }
}

.search-page .blog-container
{
    margin-top: -210px;
}

.search-page .sidebar
{
    margin-top: 7.5rem;
}

.error404
{
    position: relative; 

    background: -webkit-linear-gradient(left, #140e38, #194089);
    background:         linear-gradient(to right, #140e38, #194089);
}
.error404 .particles-js-canvas-el
{
    z-index: 0;
}
.error404 .error-img
{
    overflow: hidden; 

    height: 100vh;
}
.error404 .error-img img
{
    height: 100%;
}
.error404 .error-content
{
    position: absolute;
    bottom: 18%;
    left: 50%;

    margin-left: -191px;
}
.error404 .error-content .error-info
{
    font-weight: 700;

    margin-bottom: 1.5rem; 

    color: #fff;
}
.error404 .error-content .error-info .btn
{
    padding: .6rem 2rem;
}

@media (max-width: 991.98px)
{
    .error404 .error-img img
    {
        height: auto;
    }
}

@media (max-width: 399px)
{
    .error404 .error-content .error-info
    {
        padding-left: 2rem;
    }
}

/*	Template level css needed for all 3D graphic pages
* 	----------------------------------------------------------------------------------------------*/
section
{
    position: relative;
}

p
{
    color: #7d7d7d;
}

.vertical-social .midnightHeader.default
{
    background: #194089;
}
.vertical-social .midnightHeader.default ul li a
{
    opacity: 1; 
    color: #fff;
}
.vertical-social .midnightHeader.default ul li a:hover
{
    opacity: .75;
}

.vertical-social .midnightHeader.white
{
    background: #fff;
}
.vertical-social .midnightHeader.white ul li a
{
    color: #000;
}

header .navbar.navbar-fixed
{
    background: #194089;
}

#navigation #slide-line
{
    background-color: #fdc800;
}

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

.bg-gradient
{
    background: -webkit-linear-gradient(left, #140e38, #194089);
    background:         linear-gradient(to right, #140e38, #194089);
}
.bg-gradient p
{
    color: #c7b8ff;
}

.dark-bg-text-color
{
    color: #c7b8ff;
}

.crypto-3d-graphic
{
    position: relative;
}
.crypto-3d-graphic .graphic-3d-img
{
    width: 740px;
}

.problem-solution
{
    position: relative;
}
.problem-solution.section-pro:before
{
    position: absolute;
    top: 0;
    left: 0; 

    width: 100%;
    height: 100%;

    content: '';

    background: url('../../theme-assets/images/solution-shape.png') 50% 50% no-repeat fixed;
    background-size: cover;
}

#token-sale-mobile-app .token-sale h5
{
    color: #fff;
}

#token-sale-mobile-app .token-sale ul.token-sale-info li
{
    color: #c7b8ff;
}

.our-coin
{
    position: relative;
}
.our-coin.section-pro:before
{
    position: absolute;
    top: 0;
    left: 0; 

    width: 100%;
    height: 100%;

    content: '';

    background: url('../../theme-assets/images/our-coin-shape.png') 50% 50% no-repeat fixed;
    background-size: cover;
}

.team .team-width p,
.team .team-width span
{
    color: #fff !important;
}

.team .profile .name
{
    color: #fff !important;
}

.team .profile .role
{
    color: #c7b8ff !important;
}

.team .profile .social-profile a
{
    color: #c7b8ff !important;
}

.advisor .profile .name
{
    color: #7d7d7d !important;
}

.advisor .profile .role
{
    color: #3f3f3f !important;
}

.ico-modal .close
{
    font-size: 2rem;
    font-weight: normal;

    position: absolute;
    z-index: 999;
    top: -30px;
    right: 0;

    opacity: 1; 
    color: #fff;
}

@media (min-width: 1200px) and (max-width: 1499.98px)
{
    .crypto-3d-graphic .graphic-3d-img
    {
        width: 590px;
    }
}

@media (min-width: 992px) and (max-width: 1199.98px)
{
    .crypto-3d-graphic .graphic-3d-img
    {
        width: 480px;
    }
    .head-area .head-content .banner-content
    {
        padding-top: .5rem !important;
    }
    .head-area .head-content h1
    {
        font-size: 1.5rem;
        line-height: 2rem;
    }
    .head-area .head-content h3
    {
        font-size: 1rem;
        line-height: 1.5rem; 

        margin-top: 2rem;
    }
    .head-area .head-content .btn
    {
        font-size: .8rem; 

        padding: .6rem 1rem;
    }
    .dark-bg-heading .sub-title,
    .heading .sub-title
    {
        font-size: 4.625rem !important;
    }
    .about .content-area .what-is-crypto-img img
    {
        width: 450px;
    }
    .about .content-area .play-video
    {
        left: 54%;
    }
    .token-img img
    {
        width: 450px;
    }
    .mobile-app .mobile-app-imgs .mobile-app-img-1
    {
        width: 375px;
    }
    .mobile-app .mobile-app-imgs .mobile-app-img-2
    {
        top: 55px;
        left: 220px; 

        width: 102px;
    }
    .mobile-app .mobile-app-imgs .mobile-app-img-3
    {
        top: -13px;
        left: 210px; 

        width: 174px;
    }
    .mobile-app .mobile-app-imgs .mobile-app-img-4
    {
        top: -114px;
        left: 235px; 

        width: 220px;
    }
    .next-slide
    {
        right: 14px !important;
    }
    .prev-slide
    {
        left: 14px !important;
    }
}

@media (min-width: 768px) and (max-width: 991.98px)
{
    .crypto-3d-graphic .graphic-3d-img
    {
        width: 550px;
    }
    .head-area .head-content .banner-content
    {
        padding-top: .5rem !important;

        text-align: center;
    }
    .head-area .head-content h1
    {
        font-size: 1.5rem;
        line-height: 2rem;
    }
    .head-area .head-content h3
    {
        font-size: 1rem;
        line-height: 1.5rem; 

        margin-top: 2rem !important;
    }
    .dark-bg-heading .sub-title,
    .heading .sub-title
    {
        font-size: 4rem !important;

        top: 6% !important;
    }
    .about .content-area .what-is-crypto-img
    {
        text-align: center;
    }
    .about .content-area .play-video
    {
        left: 52%;
    }
    .move-first
    {
        -webkit-box-ordinal-group: 0;
        -webkit-order: -1;
        -ms-flex-order: -1;
                order: -1;
    }
    .whitepaper-img
    {
        margin-bottom: 3rem; 

        text-align: center;
    }
    .token-distribution .token-img
    {
        margin-bottom: 3rem; 

        text-align: center;
    }
    .token-distribution .token-img img
    {
        width: 450px;
    }
    .coin-img
    {
        text-align: center;
    }
    .roadmap .next-slide
    {
        right: 2px;
    }
    .roadmap .prev-slide
    {
        left: 2px;
    }
}

@media (max-width: 991.98px)
{
    .main-menu.navbar.navbar-absolute.open
    {
        background: #183e85;
    }
    .main-menu.navbar .dropdown-menu
    {
        background: #1d4a9f;
        box-shadow: none !important;
    }
    .main-menu.navbar .dropdown-menu a
    {
        color: #fff;
    }
    .faq .nav.nav-underline a
    {
        font-size: 1rem;
    }
}

@media (min-width: 576px) and (max-width: 767.98px)
{
    .graphic-3d-img
    {
        width: 525px !important;
    }
    .head-area .head-content .banner-content
    {
        padding-top: .5rem !important;

        text-align: center;
    }
    .head-area .head-content h1
    {
        font-size: 1.5rem;
        line-height: 2rem;
    }
    .head-area .head-content h3
    {
        font-size: 1rem;
        line-height: 1.5rem; 

        margin-top: 2rem !important;
    }
    .head-area .head-content .btn
    {
        font-size: .8rem; 

        padding: .8rem;
    }
    .section-padding
    {
        padding: 3rem 0;
    }
    .dark-bg-heading
    {
        margin-bottom: 3rem !important;
    }
    .dark-bg-heading .sub-title,
    .heading .sub-title
    {
        font-size: 2.75rem;

        top: 14%;
    }
    .title
    {
        font-size: 1.5rem;
    }
    .about .content-area .what-is-crypto-img
    {
        text-align: center;
    }
    .about .content-area .play-video
    {
        left: 52%;
    }
    .move-first
    {
        -webkit-box-ordinal-group: 0;
        -webkit-order: -1;
        -ms-flex-order: -1;
                order: -1;
    }
    .whitepaper-img
    {
        margin-bottom: 3rem; 

        text-align: center;
    }
    .token-distribution .token-img
    {
        margin-bottom: 3rem;
    }
    .roadmap .timestamp.active span:after
    {
        left: 44.6%;
    }
    .roadmap .timestamp span:after
    {
        left: 44.6%;
    }
    .roadmap .next-slide
    {
        right: -8px;
    }
    .roadmap .prev-slide
    {
        left: -8px;
    }
    .contact .contact-info
    {
        display: block;
    }
    .contact .contact-info li
    {
        margin: 1rem 0;
    }
    .coin-img
    {
        text-align: center;
    }
}

@media (max-width: 575.98px)
{
    .graphic-3d-img
    {
        width: 300px !important;
    }
    .head-area .head-content .banner-content
    {
        padding-top: .5rem !important;

        text-align: center;
    }
    .head-area .head-content h1
    {
        font-size: 1.2rem;
        line-height: 2rem;
    }
    .head-area .head-content h3
    {
        font-size: 1rem;
        line-height: 1.5rem; 

        margin-top: 2rem !important;
    }
    .head-area .head-content .btn
    {
        font-size: .8rem; 

        padding: .8rem;
    }
    .section-padding
    {
        padding: 3rem 0 !important;
    }
    .dark-bg-heading
    {
        margin-bottom: 3rem !important;
    }
    .dark-bg-heading .sub-title,
    .heading .sub-title
    {
        display: none;
    }
    .dark-bg-heading .title,
    .heading .title
    {
        font-size: 1.4rem;
    }
    .move-first
    {
        -webkit-box-ordinal-group: 0;
        -webkit-order: -1;
        -ms-flex-order: -1;
                order: -1;
    }
    .about .content-area .what-is-crypto-img
    {
        text-align: center;
    }
    .about .content-area h2.font-large
    {
        font-size: 1.4rem;
        line-height: 1.5rem;
    }
    .about .content-area h3.font-medium
    {
        font-size: .9rem;
    }
    .about .content-area .play-video
    {
        top: 75%;
        left: 53%;
    }
    .about .content-area .play-video .play
    {
        width: 50px; 
        height: 50px;
        padding: .75rem;
    }
    .about .content-area .play-video .play i
    {
        font-size: 1.5rem;
    }
    .problems-img,
    .solutions-img
    {
        width: 250px;
    }
    .whitepaper-img
    {
        margin-bottom: 3rem; 

        text-align: center;
    }
    .token-distribution .token-img
    {
        margin-bottom: 3rem; 

        text-align: center;
    }
    .token-details .clock-counter .flip-clock-wrapper .flip
    {
        height: 24px;
        margin: 2px;
        padding: 23px 1px;
    }
    .token-details .clock-counter .flip-clock-wrapper .flip li
    {
        top: 6px;
    }
    .token-details .clock-counter .flip-clock-wrapper .flip li a .up .inn
    {
        font-size: 1.5rem;

        top: -16px;
    }
    .token-details .clock-counter .flip-clock-wrapper .flip li a .down .inn
    {
        font-size: 1.5rem;

        bottom: 16px;
    }
    .token-details .clock-counter .flip-clock-wrapper .flip-clock-dot
    {
        left: 2px; 

        width: 4px;
        height: 4px;
    }
    .token-details .clock-counter .flip-clock-wrapper .flip-clock-dot.top
    {
        top: 16px;
    }
    .token-details .clock-counter .flip-clock-wrapper .flip-clock-dot.bottom
    {
        bottom: 64px;
    }
    .token-details .clock-counter .flip-clock-divider.days .flip-clock-label
    {
        left: -20px;
    }
    .token-details .clock-counter .flip-clock-divider.hours .flip-clock-label
    {
        left: -8px;
    }
    .token-details .clock-counter .flip-clock-divider.minutes .flip-clock-label
    {
        left: -7px;
    }
    .token-details .clock-counter .flip-clock-divider.seconds .flip-clock-label
    {
        left: 0;
    }
    .token-details .progress-bottom
    {
        top: 2rem;
    }
    .roadmap .timestamp.active span:after
    {
        left: 44.1%;
    }
    .roadmap .timestamp span:after
    {
        left: 44.1%;
    }
    .roadmap .next-slide
    {
        right: -14px;
    }
    .roadmap .prev-slide
    {
        left: -14px;
    }
    .contact .contact-info
    {
        display: block;
    }
    .contact .contact-info li
    {
        margin: 1rem 0;
    }
    .contact .contact-info li i
    {
        font-size: 1.12rem;
        line-height: 1.5rem;
    }
    .coin-img
    {
        text-align: center;
    }
    .coin-img img
    {
        width: 200px;
    }
    .mobile-app
    {
        margin-top: 3rem !important;
    }
    .mobile-app .mobile-app-imgs .mobile-app-img-1
    {
        width: 250px;
    }
    .mobile-app .mobile-app-imgs .mobile-app-img-2
    {
        top: 36px;
        left: 145px; 

        width: 70px;
    }
    .mobile-app .mobile-app-imgs .mobile-app-img-3
    {
        top: -9px;
        left: 141px; 

        width: 115px;
    }
    .mobile-app .mobile-app-imgs .mobile-app-img-4
    {
        top: -92px;
        left: 146px; 

        width: 175px;
    }
    .mobile-app .btn
    {
        padding: 1rem !important;
    }
    .mobile-app .btn span
    {
        padding-right: 1rem !important;
    }
}