@font-face {
    font-family: "SpaceGrotesk-Bold";
    src: url("../fonts/SpaceGrotesk-Bold.woff") format("truetype");
}

@font-face {
    font-family: "SpaceGrotesk";
    src: url("../fonts/SpaceGrotesk-Regular.woff") format("truetype");
    font-weight: normal;
}

::-webkit-scrollbar {
    width: 7px
}

::-webkit-scrollbar-track {
    box-shadow: inset 0 0 5px grey;
    border-radius: 10px
}

::-webkit-scrollbar-thumb {
    background: #8442ab;
    border-radius: 10px
}

::-webkit-scrollbar-thumb:hover {
    background: #b30000
}

.brddefault {
    border: 2px solid #f44a40;
    width: 100px;
    margin: 30px auto;
    border-radius: 10px
}

.fonth4 {
    text-transform: uppercase;
    font-size: 24px;
    letter-spacing: 1px;
    padding-top: 20px
}

.padt5 {
    padding-top: 5px
}

.viewfeature {
    position: absolute;
    bottom: 30px;
    right: 0
}

.viewfeature:hover {
    color: #000!important
}

.intl-tel-input .selected-flag .iti-arrow {
    border-top: 4px solid #fff!important
}

.call-24h h4 {
    align-self: center;
    color: #fff;
    padding-left: 15px
}

.call-24h {
    width: 30%
}

.call-24h img {
    width: 45px
}

.logoimg {
    display: flex;
    flex-grow: 1
}

.topnav {
    width: 30%
}

.topnav .navbar-nav li {
    border-right: 1px solid #fff
}

.topnav .navbar-nav li:last-child {
    border-right: 0
}

.navbar-brand img {
    width: 250px;
    margin: 7px 0
}

.navbar-brand {
    margin: 0
}

.secondry-header .navbar-brand {
    align-self: center
}

.secondry-header .leftside li:hover:first-child::after {
    content: unset
}

.secondry-header .leftside>li>a {
    padding: 1.5em 1em!important
}

.secondry-header .navbar-brand {
    padding: 0
}

.deagenric-btn {
    padding: .3em 1em!important;
    background: transparent!important
}

.deagenric-btn:hover {
    background: #38a4ff!important;
    border: 2px solid #38a4ff
}

.main-menu {
    display: block;
    position: absolute;
    width: 100%;
    padding: 0;
    z-index: 999
}

.secondry-header .container-menu {
    width: 100%;
    margin: 0 auto
}

.main-menu:before,
.main-menu:after {
    display: table;
    line-height: 0;
    content: ""
}

.secondry-header .dropdown>li>.dropdown2>li>.dropdown2 {
    width: 190%;
    background: #fff;
    overflow-y: scroll;
}


/* .secondry-header .dropdown>li>.dropdown2 {
    overflow-y: scroll;
} */

.secondry-header .dropdown>li>.dropdown2>li>.dropdown2>li {
    width: 49%;
    display: inline-block
}

.secondry-header .core-menu {
    font: 'Poppins', sans-serif;
    overflow: hidden;
    width: auto;
    align-self: center;
    display: inline
}

.secondry-header .core-menu li {
    list-style: none;
    display: inline-block;
    cursor: pointer;
    align-self: center
}

.secondry-header .core-menu li a {
    display: inline-block;
    padding: .2em .5em;
    color: #fff;
    font-size: 16px
}

.bannerform .form-group {
    margin-bottom: 1.5rem
}

.brdright {
    border-right: 1px solid #fff
}

.ordernow {
    padding: 10px 30px;
    font-size: 1.3em;
    margin-top: 16px;
    margin-bottom: 5px
}

.ordernowhead {
    padding: .7em 1em!important;
    margin-left: 10px
}

.secondry-header li span.toggle {
    padding-left: 1em
}

.secondry-header .toggle:before {
    content: "\f107";
    font: normal normal normal 16px/1 FontAwesome
}

.secondry-header .dropdown2 {
    position: absolute;
    width: 70%;
    background: #f8f8f8;
    text-align: left;
    display: none;
    right: -100%;
    top: 0;
    left: 100%;
    min-height: 544px;
    max-height: 544px;
    -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
    box-shadow: 0 6px 12px rgba(0, 0, 0, .175)
}

.secondry-header .dropdown2 li {
    display: block
}

.secondry-header .dropdown2 li a {
    display: block;
    color: #000
}

.secondry-header li span.toggle2 {
    position: absolute;
    right: 0;
    margin-right: 20px;
    top: 29%
}

.secondry-header .toggle2:before {
    content: "\f105";
    font: normal normal normal 16px/1 FontAwesome
}

.secondry-header .hamburger-menu {
    padding: 1em;
    display: none;
    font: 'Poppins', sans-serif;
    text-transform: uppercase
}

.secondrightheader {
    float: right;
    text-align: end
}

.earnbtn {
    border: 2px dotted #38a4ff;
    background: #fff;
    margin-left: 10px;
    font-weight: 500;
    border-radius: 4px;
    padding: .3em 1em!important
}

.secondbtn {
    color: #000!important
}

.secondbtn:hover {
    color: #fff!important
}

.secondrightheader li a:hover {
    background: transparent
}

.dealbtn {
    background: transparent!important;
    padding: .4em 1em!important;
    border-radius: 5px;
    color: #fff!important;
    position: relative
}

.dealbtn:hover {
    color: #fff!important;
    border: 2px dashed #fff
}

.resources-menu:before,
.service-menu:before {
    content: '';
    border-style: solid;
    border-width: 10px;
    border-color: transparent transparent #fff;
    position: absolute;
    top: -18px;
    z-index: 2
}

.offer-assignment {
    width: 100%;
    height: 75px;
    float: left;
    border-radius: 5px;
    background-color: #446f94;
    color: #fff;
    text-align: center;
    line-height: 75px;
    font-size: 26px
}

.resouces-offers-sec .tools-offer {
    text-decoration: none;
    color: #788290!important;
    display: block;
    font-weight: 700;
    margin-bottom: 10px;
    margin-top: 5px
}

.resources-div-col a {
    color: #788290!important;
    font-size: 15px!important;
    padding: .7em .5em!important
}

.service-menu:before {
    left: 63%
}

.sample-detail-sec ul li,
.sample-detail-sec ol li {
    list-style: disc
}

.sample-detail-sec ul,
.sample-detail-sec ol {
    padding-left: 15px
}

.resources-menu:before {
    left: 22%
}

.single-popular-course h4 {
    height: 53px;
    overflow: hidden
}

.secondry-header .dropdown h6 {
    font-family: inherit;
    font-weight: 400;
    font-style: italic;
    font-size: 13px;
    margin-right: 5px;
    opacity: .5;
    display: inline
}

.secondry-header .dropdown h5 {
    font-family: inherit;
    font-weight: 600;
    margin: 10px 0 20px 0;
    letter-spacing: 0;
    font-size: 13px;
    text-transform: none;
    display: inline;
    text-transform: uppercase
}

.secondry-header .dropdown p {
    font-style: italic;
    font-size: 13px;
    margin-bottom: 0
}

.resources-menu {
    width: 1000px;
    min-width: 1000px;
    margin-left: auto;
    margin-right: auto;
    position: absolute;
    padding: 0;
    transform: translate(-17%, 0);
    border: 0;
    left: unset!important
}

.resources-div-col.brd0 {
    border-right: 0
}

.resources-div-col {
    padding: 20px;
    border-right: 1px solid #d9dde1;
    border-bottom: 1px solid #d9dde1;
    min-height: 300px;
    max-height: 300px
}

.offer-content-box h5 {
    text-decoration: none;
    display: block;
    font-weight: 700;
    margin-bottom: 10px;
    margin-top: 5px;
    padding-left: 15px
}

.resources-div-col h4 {
    text-align: center;
    text-transform: uppercase;
    font-weight: 600;
    letter-spacing: 1.5px;
    font-size: 15px;
    margin-bottom: 25px;
    font-family: "SpaceGrotesk-Bold"
}

.resources-menu ul li a {
    padding: 0;
    text-decoration: none;
    color: #788290!important;
    display: block;
    font-weight: 400;
    padding: 5px 15px!important;
    line-height: 19px;
    font-size: 13px!important
}

.tools-icon img {
    width: 48px
}

.resources-div-col ul {
    display: block!important
}

.secondry-header .dropdown {
    position: absolute;
    min-width: 33%;
    left: 0;
    background: #fff;
    text-align: left;
    display: none;
    z-index: 99;
    -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
    box-shadow: 0 6px 12px rgba(0, 0, 0, .175)
}

.secondry-header .dropdown li {
    display: block
}

.secondry-header .dropdown li a {
    display: block;
    color: #000;
    position: relative;
    padding: .7em 1em
}

.mobile-header>li i {
    padding-right: 10px
}

.mobile-header li a {
    font-size: 22px;
    color: #fff
}

.mobile-submenu li {
    padding: 10px 5px
}

.intl-tel-input {
    display: table-cell
}

.intl-tel-input .selected-flag {
    z-index: 4
}

.intl-tel-input .country-list {
    z-index: 5
}

.telephoneno {
    width: 100%;
    height: 38px;
    border-radius: 5px
}

.intl-tel-input {
    width: 100%
}

label,
.bannerform h3,
.bannerform h4,
.bannerform h5 {
    color: #fff;
    font-family: "SpaceGrotesk-Bold";
    font-weight: 300
}

.bannerform {
    border-radius: 5px;
    padding: 10px;
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, .2);
}

.bg-form {
    background-color: #b072f9;
}

.home-banner-row {
    padding-top: 11%
}

.discountbox {
    background: #fff3;
    border-radius: 5px;
    padding: 15px
}

.bannerform .form-control {
    background: transparent;
    color: #fff;
    border: 1px dashed #fff;
    border-radius: 5px;
    font-family: "SpaceGrotesk"
}

.bannerform ::placeholder {
    color: #fff;
    font-weight: 400
}

.home-banner-area h1 {
    font-family: "SpaceGrotesk-Bold";
}

.sample-detail-sec ol,
.sample-detail-sec li {
    list-style: unset!important;
    padding-left: 15px;
}

.bannerform .input-group-text {
    border: 1px dashed #fff;
    color: #fff;
    background-color: transparent
}

.hero-new__illustration {
    max-width: 510px;
    margin: 0 auto 0;
    position: relative
}

@media(min-width:1200px) {
    .hero-new__illustration-leg {
        -webkit-animation: illustration-leg .8s ease-out alternate infinite;
        -moz-animation: illustration-leg .8s ease-out alternate infinite;
        -o-animation: illustration-leg .8s ease-out alternate infinite;
        animation: illustration-leg .8s ease-out alternate infinite
    }
}

.hero-new__illustration-leg {
    position: absolute;
    left: 4px;
    top: -19px;
    -webkit-transform: rotate(2deg) translateY(13px);
    -moz-transform: rotate(2deg) translateY(13px);
    -ms-transform: rotate(2deg) translateY(13px);
    -o-transform: rotate(2deg) translateY(13px);
    transform: rotate(2deg) translateY(13px)
}

@keyframes illustration-leg {
    0% {
        -webkit-transform: rotate(2deg) translateY(13px);
        -moz-transform: rotate(2deg) translateY(13px);
        -o-transform: rotate(2deg) translateY(13px);
        transform: rotate(2deg) translateY(13px)
    }
    100% {
        -webkit-transform: rotate(6deg) translateY(6px);
        -moz-transform: rotate(6deg) translateY(6px);
        -o-transform: rotate(6deg) translateY(6px);
        transform: rotate(6deg) translateY(6px)
    }
}

img {
    height: auto
}

.chip {
    background: #fff;
    -webkit-box-shadow: 0 10px 20px rgba(0, 0, 0, .1), 0 2px 8px rgba(0, 0, 0, .1);
    box-shadow: 0 10px 20px rgba(0, 0, 0, .1), 0 2px 8px rgba(0, 0, 0, .1);
    -webkit-border-radius: 4px;
    border-radius: 4px;
    padding: 0 20px;
    text-align: center;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    min-height: 70px;
    position: absolute;
    left: -75px;
    bottom: 75px;
    opacity: 0;
    -webkit-animation: chip__animation 3s ease-out infinite;
    -moz-animation: chip__animation 3s ease-out infinite;
    -o-animation: chip__animation 3s ease-out infinite;
    animation: chip__animation 3s ease-out infinite
}

@keyframes chip__animation {
    40% {
        -webkit-transform: rotate(0) translateY(0) translateX(0);
        -moz-transform: rotate(0) translateY(0) translateX(0);
        -o-transform: rotate(0) translateY(0) translateX(0);
        transform: rotate(0) translateY(0) translateX(0);
        opacity: 0
    }
    50% {
        opacity: .7
    }
    90% {
        opacity: .7
    }
    100% {
        -webkit-transform: rotate(-5deg) translateY(-200px) translateX(10px);
        -moz-transform: rotate(-5deg) translateY(-200px) translateX(10px);
        -o-transform: rotate(-5deg) translateY(-200px) translateX(10px);
        transform: rotate(-5deg) translateY(-200px) translateX(10px);
        opacity: 0
    }
}

.chip__text {
    font-family: "SpaceGrotesk";
    line-height: 20px;
    font-size: 20px;
    letter-spacing: .285714px;
    color: #000;
    display: inline-block;
    padding-left: 15px
}

.chip__animation-second {
    -webkit-animation-name: chip__animation-second;
    -moz-animation-name: chip__animation-second;
    -o-animation-name: chip__animation-second;
    animation-name: chip__animation-second;
    -webkit-animation-duration: 2s;
    -moz-animation-duration: 2s;
    -o-animation-duration: 2s;
    animation-duration: 2s
}

@keyframes chip__animation-second {
    20% {
        -webkit-transform: rotate(0) translateY(0) translateX(0);
        -moz-transform: rotate(0) translateY(0) translateX(0);
        -o-transform: rotate(0) translateY(0) translateX(0);
        transform: rotate(0) translateY(0) translateX(0);
        opacity: 0
    }
    60% {
        opacity: .7
    }
    90% {
        opacity: .7
    }
    100% {
        -webkit-transform: rotate(10deg) translateY(-180px) translateX(10px);
        -moz-transform: rotate(10deg) translateY(-180px) translateX(10px);
        -o-transform: rotate(10deg) translateY(-180px) translateX(10px);
        transform: rotate(10deg) translateY(-180px) translateX(10px);
        opacity: 0
    }
}

.chip__animation-third {
    -webkit-animation-name: chip__animation-third;
    -moz-animation-name: chip__animation-third;
    -o-animation-name: chip__animation-third;
    animation-name: chip__animation-third;
    -webkit-animation-duration: 2.3s;
    -moz-animation-duration: 2.3s;
    -o-animation-duration: 2.3s;
    animation-duration: 2.3s
}

@keyframes chip__animation-third {
    25% {
        -webkit-transform: rotate(0) translateY(0) translateX(0);
        -moz-transform: rotate(0) translateY(0) translateX(0);
        -o-transform: rotate(0) translateY(0) translateX(0);
        transform: rotate(0) translateY(0) translateX(0);
        opacity: 0
    }
    45% {
        opacity: .7
    }
    90% {
        opacity: .7
    }
    100% {
        -webkit-transform: rotate(-15deg) translateY(-150px) translateX(-8px);
        -moz-transform: rotate(-15deg) translateY(-150px) translateX(-8px);
        -o-transform: rotate(-15deg) translateY(-150px) translateX(-8px);
        transform: rotate(-15deg) translateY(-150px) translateX(-8px);
        opacity: 0
    }
}

.banner-hero {
    min-height: 250px
}

.rw-sentence span {
    color: #000;
    white-space: nowrap;
    font-size: 18px;
    font-weight: normal;
    line-height: 36px
}

.rw-words {
    display: inline;
    text-indent: 10px
}

.rw-words span {
    position: absolute;
    opacity: 0;
    overflow: hidden;
    color: #8fd028
}

.deartext {
    font-size: 20px;
    margin-top: 10px;
    margin-bottom: 15px
}

.btn-feedback {
    background: #8c32f6;
    color: #fff;
    padding: 5px 30px;
    font-size: 20px
}

.rw-wrapper p {
    margin-bottom: 5px
}

.rw-wrapper textarea {
    width: 100%;
    padding: 0 10px 10px 5px;
    border: 1px dashed;
    font-size: 18px;
    color: #8c32f6;
    margin-top: 5px
}

.emailpad {
    padding: 0 5px 5px!important
}

.rw-wrapper input {
    border: 0;
    border-bottom: 1px dashed;
    outline: 0;
    font-size: 18px;
    padding: 0 5px;
    color: #8c32f6
}

.rw-wrapper ::placeholder {
    color: #8c32f6
}

.rw-words-1 span {
    -webkit-animation: rotateWordsFirst 18s linear infinite 0s;
    -ms-animation: rotateWordsFirst 18s linear infinite 0s;
    animation: rotateWordsFirst 18s linear infinite 0s
}

.rw-words-2 span {
    -webkit-animation: rotateWordsSecond 18s linear infinite 0s;
    -ms-animation: rotateWordsSecond 18s linear infinite 0s;
    animation: rotateWordsSecond 18s linear infinite 0s
}

.rw-words span:nth-child(2) {
    -webkit-animation-delay: 3s;
    -ms-animation-delay: 3s;
    animation-delay: 3s;
    color: #8fd028
}

.rw-words span:nth-child(3) {
    -webkit-animation-delay: 6s;
    -ms-animation-delay: 6s;
    animation-delay: 6s;
    color: #8fd028
}

.rw-words span:nth-child(4) {
    -webkit-animation-delay: 9s;
    -ms-animation-delay: 9s;
    animation-delay: 9s;
    color: #8fd028
}

.rw-words span:nth-child(5) {
    -webkit-animation-delay: 12s;
    -ms-animation-delay: 12s;
    animation-delay: 12s;
    color: #8fd028
}

.rw-words span:nth-child(6) {
    -webkit-animation-delay: 15s;
    -ms-animation-delay: 15s;
    animation-delay: 15s;
    color: #8fd028
}

.rw-wrapper {
    text-align: left
}

@-webkit-keyframes rotateWordsFirst {
    0% {
        opacity: 1;
        -webkit-animation-timing-function: ease-in;
        height: 0
    }
    8% {
        opacity: 1;
        height: 60px
    }
    19% {
        opacity: 0;
        height: 60px
    }
    25% {
        opacity: 0;
        height: 60px
    }
    100% {
        opacity: 0
    }
}

@-ms-keyframes rotateWordsFirst {
    0% {
        opacity: 1;
        -ms-animation-timing-function: ease-in;
        height: 0
    }
    8% {
        opacity: 1;
        height: 60px
    }
    19% {
        opacity: 0;
        height: 60px
    }
    25% {
        opacity: 0;
        height: 60px
    }
    100% {
        opacity: 0
    }
}

@keyframes rotateWordsFirst {
    0% {
        opacity: 1;
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        height: 0
    }
    8% {
        opacity: 1;
        height: 60px
    }
    19% {
        opacity: 0;
        height: 60px
    }
    25% {
        opacity: 0;
        height: 60px
    }
    100% {
        opacity: 0
    }
}

@-webkit-keyframes rotateWordsSecond {
    0% {
        opacity: 1;
        -webkit-animation-timing-function: ease-in;
        width: 0
    }
    10% {
        opacity: .3;
        width: 0
    }
    20% {
        opacity: 1;
        width: 100%
    }
    27% {
        opacity: 0;
        width: 100%
    }
    100% {
        opacity: 0
    }
}

@-ms-keyframes rotateWordsSecond {
    0% {
        opacity: 1;
        -ms-animation-timing-function: ease-in;
        width: 0
    }
    10% {
        opacity: .3;
        width: 0
    }
    20% {
        opacity: 1;
        width: 100%
    }
    27% {
        opacity: 0;
        width: 100%
    }
    100% {
        opacity: 0
    }
}

@keyframes rotateWordsSecond {
    0% {
        opacity: 1;
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        width: 0
    }
    10% {
        opacity: .3;
        width: 0
    }
    20% {
        opacity: 1;
        width: 100%
    }
    27% {
        opacity: 0;
        width: 100%
    }
    100% {
        opacity: 0
    }
}

@media screen and (max-width:768px) {
    .rw-sentence {
        font-size: 18px
    }
}

@media screen and (max-width:320px) {
    .rw-sentence {
        font-size: 9px
    }
}

.entry {
    font-size: 250%;
    font-weight: 100;
    width: auto;
    color: #fff;
    line-height: 50px;
    font-family: "SpaceGrotesk"
}

.feedbacktext {
    font-size: 32px;
    font-weight: 100;
    width: auto;
    color: #8c32f6;
    line-height: 50px;
    font-family: "SpaceGrotesk"
}

.feeddback .typed-cursor {
    opacity: 1;
    color: #8c32f6;
    font-size: 36px;
    -webkit-animation: blink 2s infinite;
    animation: blink 2s infinite
}

.feedbackhead-text p {
    font-size: 20px;
    margin-bottom: 4px;
    color: #8c32f6cc
}

.typed-cursor {
    opacity: 1;
    color: #fff;
    font-size: 250%;
    -webkit-animation: blink 2s infinite;
    animation: blink 2s infinite
}

@-webkit-keyframes blink {
    0% {
        opacity: 1
    }
    50% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}

@keyframes blink {
    0% {
        opacity: 1
    }
    50% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}

.customer-review {
    background: #8442ab;
    box-shadow: 0 10px 20px rgba(0, 0, 0, .1), 0 2px 8px rgba(0, 0, 0, .1);
    width: 100%;
    page-break-after: auto;
    border-radius: 100px 0;
    padding: 0 30px
}

.review-box {
    padding: 20px;
    display: flex
}

.review-box::after {
    content: '';
    border-right: 1px solid rgba(255, 247, 255, 0.54);
    height: 70px;
    position: relative;
    left: 20px
}

.review-box:last-child::after {
    content: unset
}

.rating-name {
    flex-grow: 1
}

.customer-rating {
    font-family: "SpaceGrotesk";
    font-size: 48px;
    justify-content: flex-end;
    letter-spacing: .9375px;
    color: #fff;
    align-self: center
}

.rating-name h4 {
    font-family: cursive;
    font-size: 28px;
    font-weight: 100;
    color: #fff
}

.rating-stars {
    padding-top: 5px
}

.rating-stars .fa {
    font-size: 19px;
    color: #ff0
}

.fonth3 {
    font-size: 42px;
    font-weight: 600;
    padding-bottom: 15px
}

.process-steps {
    padding: 0 0 80px;
    position: relative
}

.process-steps ul {
    display: inline-block;
    padding: 0
}

.process-steps:after {
    content: "";
    position: absolute;
    border: 5px solid #655969;
    bottom: 21px;
    left: 0;
    right: 0
}

.process-steps ul li .box.pro2 .dots {
    background-image: -moz-linear-gradient(90deg, #667be6 0, #754ca3 100%);
    background-image: -webkit-linear-gradient(90deg, #667be6 0, #754ca3 100%);
    background-image: -ms-linear-gradient(90deg, #667be6 0, #754ca3 100%)
}

.process-steps ul li .box.pro3 .dots {
    background-image: -moz-linear-gradient(90deg, #fa7497 0, #fedd44 100%);
    background-image: -webkit-linear-gradient(90deg, #fa7497 0, #fedd44 100%);
    background-image: -ms-linear-gradient(90deg, #fa7497 0, #fedd44 100%)
}

.process-steps ul li .box.pro4 .dots {
    background-image: -moz-linear-gradient(90deg, #4baffd 0, #03f0fd 100%);
    background-image: -webkit-linear-gradient(90deg, #4baffd 0, #03f0fd 100%);
    background-image: -ms-linear-gradient(90deg, #4baffd 0, #03f0fd 100%)
}

.process-steps ul li .box.pro5 .dots {
    background-image: -moz-linear-gradient(90deg, #f090f3 0, #f5586d 100%);
    background-image: -webkit-linear-gradient(90deg, #f090f3 0, #f5586d 100%);
    background-image: -ms-linear-gradient(90deg, #f090f3 0, #f5586d 100%)
}

.process-steps ul li .box.pro2 .process-header {
    background: url(../images/how-education/process2-bg.png) no-repeat center center
}

.process-steps ul li .box.pro3 .process-header {
    background: url(../images/how-education/process3-bg.png) no-repeat center center
}

.process-steps ul li .box.pro4 .process-header {
    background: url(../images/how-education/process4-bg.png) no-repeat center center
}

.process-steps ul li {
    width: 25%;
    float: left;
    padding: 10px 8px 15px;
    list-style: none;
    text-align: center
}

.process-steps ul li .box {
    position: relative
}

.process-steps ul li .box .process-header {
    background: url(../images/how-education/process1-bg.png) no-repeat center center;
    height: 220px;
    line-height: 190px;
    background-size: 100% 100%!important;
    position: relative;
    z-index: 1
}

.process-steps ul li .box .details {
    background: #fff;
    max-width: 80%;
    margin: -110px auto 0;
    position: relative;
    z-index: 0;
    min-height: 375px;
    padding: 50px 8px 0;
    box-shadow: 0 0 18px 0 rgba(0, 0, 0, 0.25)
}

.process-steps ul li .box .details h4 {
    margin: 15px 0 10px;
    min-height: 42px;
    font-size: 20px;
    font-weight: normal
}

.process-steps ul li .box .details p {
    font-size: 12px;
    line-height: 1.42;
    text-align: center;
    margin: 0 0 8px;
    min-height: 119px
}

.process-steps ul li .box .details h2 {
    color: #0281c2;
    font-size: 40px;
    font-weight: 100;
    margin: 0 0 15px;
    display: inline-block;
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0
}

.process-steps ul li .box .details:after {
    background: url(https://www.vrinsofts.com/wp-content/themes/vrinsoft/images/hire-developers/hire-iphone-app-developer/processbox-bottom.png) no-repeat center center;
    content: "";
    position: absolute;
    bottom: -33px;
    height: 40px;
    width: 100%;
    left: 0
}

.process-steps ul li .box .dots {
    box-shadow: 0 0 18px 0 rgba(0, 0, 0, 0.08);
    position: absolute;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    left: 0;
    bottom: -98px;
    border: 7px solid #fff;
    z-index: 1;
    right: 0;
    margin: 0 auto;
    background-image: -moz-linear-gradient(90deg, #28f399 0, #01a1f9 100%);
    background-image: -webkit-linear-gradient(90deg, #28f399 0, #01a1f9 100%);
    background-image: -ms-linear-gradient(90deg, #28f399 0, #01a1f9 100%)
}

.process-steps ul li .box .dots:before {
    content: "";
    position: absolute;
    width: 7px;
    height: 7px;
    top: -30px;
    background: #655969;
    border-radius: 50%;
    left: 0;
    right: 0;
    margin: 0 auto
}

.process-steps ul li .box .dots:after {
    content: "";
    position: absolute;
    width: 7px;
    height: 7px;
    top: -20px;
    background: #655969;
    border-radius: 50%;
    left: 0;
    right: 0;
    margin: 0 auto
}

.writingservice h3 {
    line-height: 76px;
    padding-top: 30px
}

.writingservice {
    background-size: 100% 100%;
    min-height: 474px
}

.talkexpert {
    text-decoration: underline;
    font-size: 16px
}

.talkexpert:hover {
    color: #000;
    transform: scale(1.1)
}

.anim1 {
    animation: slide1 1s ease-in-out infinite
}

@keyframes slide1 {
    0%,
    100% {
        transform: translate(0, 0)
    }
    50% {
        transform: translate(10px, 0)
    }
}

.tabexpertise {
    padding: 0
}

.tabrow {
    margin: 0;
    border-radius: 5px;
    overflow: hidden
}

.nav-pills .nav-link {
    margin: 5px 0;
    border-radius: 20px 0 0 20px;
    padding: 10px 20px;
    font-size: 18px;
    color: #fff;
    background: #8442ab;
    position: relative;
    text-shadow: 0 0 5px #333;
    text-transform: uppercase;
    z-index: 1
}

.nav-pills .nav-link.active,
.nav-pills .show>.nav-link {
    background: #8442ab
}

.nav-pills .nav-link:hover,
.nav-pills .nav-link.active a,
.nav-pills .nav-link.active a:hover {
    color: #fff;
    background: #0984e3;
    text-shadow: 0 0 5px #333;
    border: 0
}

.nav-pills .nav-link:before {
    content: '';
    background-image: repeating-linear-gradient(to bottom, #fff, transparent 10%, #fff 20%);
    height: 0;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    transition: all .3s ease 0s
}

.nav-pills .nav-link.active:before,
.nav-pills .nav-link.hover:before {
    height: 100%;
    opacity: .4
}

.nav-pills .nav-link.active {
    color: #fff
}

.tab-content {
    padding: 15px 30px
}

.tab-pane h2 {
    padding-bottom: 10px
}

.tab-pane p {
    font-size: 16px
}

.tabbtn:hover {
    color: #000!important
}

.tabbtnbox {
    position: absolute;
    bottom: 0;
    width: 100%;
    right: 0
}

.tabbtnbox .tabbtn:first-child {
    margin-left: 30px
}

.tabbtnbox .tabbtn:last-child {
    margin-right: 30px
}

.vertical-right-tab {
    width: 100%;
    height: 100%;
    background-color: #f2f3f7;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2) inset;
    border-radius: 10px;
    margin-left: 15px;
    min-height: 500px
}

.vertical-right-tab ul {
    list-style: disc;
    margin-left: 17px
}

.vertical-right-tab td {
    vertical-align: top
}

.testmonialimg img,
.testmonialimg img {
    width: 150px!important;
    height: 150px;
    border-radius: 50%;
    margin: 0 auto
}

.testi-slider .testi-item img,
.affiliate-slider .testi-item img {
    display: unset
}

.testi-item img:first-child {
    transform: rotate(180deg);
    position: relative;
    bottom: 17px
}

.testi-item img:last-child {
    position: relative;
    bottom: -13px
}

.floating-menu .menu {
    -webkit-filter: url("#shadowed-goo");
    filter: url("#shadowed-goo")
}

.floating-menu .menu-item,
.floating-menu .menu-open-button {
    background: #8442ab;
    border-radius: 100%;
    width: 80px;
    height: 80px;
    margin-left: -40px;
    position: absolute;
    top: 20px;
    color: white;
    text-align: center;
    line-height: 80px;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    transition: -webkit-transform ease-out 200ms;
    transition: transform ease-out 200ms;
    transition: transform ease-out 200ms, -webkit-transform ease-out 200ms
}

.floating-menu .menu-open {
    display: none
}

.floating-menu .hamburger {
    width: 25px;
    height: 3px;
    background: white;
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -12.5px;
    margin-top: -1.5px;
    transition: -webkit-transform 200ms;
    transition: transform 200ms;
    transition: transform 200ms, -webkit-transform 200ms
}

.floating-menu .hamburger-1 {
    -webkit-transform: translate3d(0, -8px, 0);
    transform: translate3d(0, -8px, 0)
}

.floating-menu .hamburger-2 {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
}

.floating-menu .hamburger-3 {
    -webkit-transform: translate3d(0, 8px, 0);
    transform: translate3d(0, 8px, 0)
}

.floating-menu .menu-open:checked+.menu-open-button .hamburger-1 {
    -webkit-transform: translate3d(0, 0, 0) rotate(45deg);
    transform: translate3d(0, 0, 0) rotate(45deg)
}

.floating-menu .menu-open:checked+.menu-open-button .hamburger-2 {
    -webkit-transform: translate3d(0, 0, 0) scale(0.1, 1);
    transform: translate3d(0, 0, 0) scale(0.1, 1)
}

.floating-menu .menu-open:checked+.menu-open-button .hamburger-3 {
    -webkit-transform: translate3d(0, 0, 0) rotate(-45deg);
    transform: translate3d(0, 0, 0) rotate(-45deg)
}

.floating-menu .menu {
    position: absolute;
    margin-left: 60px;
    font-size: 20px
}

.floating-menu .menu-item:hover {
    background: white;
    color: #8442ab
}

.floating-menu .menu-item:nth-child(3) {
    transition-duration: 180ms
}

.floating-menu .menu-item:nth-child(4) {
    transition-duration: 180ms
}

.floating-menu .menu-item:nth-child(5) {
    transition-duration: 180ms
}

.floating-menu .menu-item:nth-child(6) {
    transition-duration: 180ms
}

.floating-menu .menu-open-button {
    z-index: 2;
    transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
    transition-duration: 400ms;
    -webkit-transform: scale(1.1, 1.1) translate3d(0, 0, 0);
    transform: scale(1.1, 1.1) translate3d(0, 0, 0);
    cursor: pointer
}

.floating-menu .menu-open-button:hover {
    -webkit-transform: scale(1.2, 1.2) translate3d(0, 0, 0);
    transform: scale(1.2, 1.2) translate3d(0, 0, 0)
}

.floating-menu .menu-open:checked+.menu-open-button {
    transition-timing-function: linear;
    transition-duration: 200ms;
    -webkit-transform: scale(0.8, 0.8) translate3d(0, 0, 0);
    transform: scale(0.8, 0.8) translate3d(0, 0, 0)
}

.floating-menu .menu-open:checked~.menu-item {
    transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1)
}

.floating-menu .menu-open:checked~.menu-item:nth-child(3) {
    transition-duration: 170ms;
    -webkit-transform: translate3d(80px, 0, 0);
    transform: translate3d(80px, 0, 0)
}

.floating-menu .menu-open:checked~.menu-item:nth-child(4) {
    transition-duration: 250ms;
    -webkit-transform: translate3d(160px, 0, 0);
    transform: translate3d(160px, 0, 0)
}

.floating-menu .menu-open:checked~.menu-item:nth-child(5) {
    transition-duration: 330ms;
    -webkit-transform: translate3d(240px, 0, 0);
    transform: translate3d(240px, 0, 0)
}

.floating-menu .menu-open:checked~.menu-item:nth-child(6) {
    transition-duration: 410ms;
    -webkit-transform: translate3d(320px, 0, 0);
    transform: translate3d(320px, 0, 0)
}

.floating-menu {
    position: fixed;
    bottom: 0;
    z-index: 0;
    left: 0
}

.sh-side-options {
    position: fixed;
    top: 0;
    bottom: 0;
    right: 0;
    z-index: 999;
    transition: .3s all ease;
    transition: .2s all;
    padding: 0;
    width: 420px;
    transform: translateX(420px)
}

.sh-side-options.open {
    transform: translateX(0px);
    box-shadow: 0 0 39px 10px rgba(0, 0, 0, 0.2)
}

.sh-side-options-container {
    position: absolute;
    top: 210px;
    left: -75px;
    width: 60px;
    background-color: rgba(255, 255, 2555, 1);
    border-radius: 5px;
    margin-right: 15px;
    box-shadow: -10px 0 20px 2px rgba(0, 0, 0, .06)
}

.sh-side-options.sh-side-options-pages .sh-side-options-container {
    top: 150px
}

.sh-side-options-item {
    display: block;
    text-align: center;
    margin: 0;
    transition: .3s all ease-in-out;
    position: relative;
    padding: 7px;
    cursor: pointer
}

.sh-side-options-item:not(:last-child) {
    border-bottom: 1px solid #f1f3fc
}

.sh-side-options-item-container {
    border-radius: 4px;
    padding: 8px 0
}

.sh-side-options-item:hover .sh-side-options-item-container,
.sh-side-options-item:focus .sh-side-options-item-container,
.sh-side-options.open .sh-side-options-item-trigger-demos .sh-side-options-item-container {
    background-color: #f3f5fd
}

.sh-side-options-item i {
    font-size: 22px
}

.sh-side-options-item:not(:hover):not(:focus) {
    color: #9396a5!important
}

.sh-side-options-item:hover .sh-side-options-hover {
    opacity: 1;
    transform: translateX(-97%)
}

.sh-side-options-hover {
    position: absolute;
    background-color: #fff;
    color: #32343d;
    padding: 17px 26px;
    transform: translateX(-31%);
    left: 0;
    top: 0;
    bottom: 0;
    opacity: 0;
    transition: .2s all ease-in-out;
    z-index: -100;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    font-size: 15px;
    box-shadow: 0 0 20px 2px rgba(0, 0, 0, 0.08)
}

.sh-side-options-hover span {
    padding: 0 3px
}

@media(max-width:700px) {
    .sh-side-options {
        width: 52px
    }
    .sh-side-options-item {
        padding: 10px 0
    }
    .sh-side-options-item i {
        font-size: 16px
    }
}

@media(max-width:600px) {
    .sh-side-options {
        display: none
    }
}

@media(max-height:500px) {
    .sh-side-options {
        top: 120px!important
    }
}

.sh-side-options-item i {
    color: #9396a5!important
}

.sh-side-options.open .sh-side-options-item-trigger-demos i,
.sh-side-options-item:hover i,
.sh-side-options-item:focus i {
    color: #294cff!important
}

.sh-side-demos-container {
    top: 0;
    left: 0;
    right: -17px;
    bottom: 0;
    position: absolute;
    overflow-y: scroll;
    background-color: #fff;
    background-repeat: no-repeat;
    background-position: right top;
    padding: 22px
}

body.admin-bar .sh-side-demos-container {
    top: 32px
}

.sh-side-demos-intro-title {
    font-size: 24px;
    font-weight: 300;
    margin-top: 25px;
    margin-bottom: 15px
}

.sh-side-demos-intro-title img {
    height: 24px;
    top: -6px;
    position: relative
}

.sh-side-demos-intro-descr {
    max-width: 250px;
    margin: 0 auto;
    display: table;
    color: #838794
}

.sh-side-demos-container-close {
    position: absolute;
    top: 22px;
    right: 22px;
    cursor: pointer
}

.sh-side-demos-container-close i {
    color: #c5c5c5;
    font-size: 18px;
    transition: .3s all ease
}

.sh-side-demos-container-close:hover i,
.sh-side-demos-container-close:focus i {
    color: #7f7f7f
}

.sh-side-demos-loop-container {
    position: relative;
    margin: 0 -10px;
    margin-top: 28px
}

.sh-side-demos-item {
    display: inline-block;
    position: relative;
    margin-right: -4px;
    margin-bottom: 25px;
    width: 50%;
    padding: 0 10px;
    text-align: center;
    transition: .3s all ease;
    top: 0
}

.sh-side-demos-item:hover {
    top: -4px
}

.sh-side-demos-item .sh-image-lazy-loading {
    border-radius: 3px;
    box-shadow: 0 2px 20px 1px rgba(0, 0, 0, .1)
}

.navbar-light .navbar-nav .nav-link {
    padding: 10px
}

.headerbg {
    background: #8c33f7;
    width: 100%;
    height: 62px
}

.icon-button {
    background-color: white;
    border-radius: 2.6rem;
    cursor: pointer;
    display: inline-block;
    font-size: 1.3rem;
    height: 2.6rem;
    line-height: 2.6rem;
    margin: 0 5px;
    position: relative;
    text-align: center;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    width: 2.6rem
}

.icon-button span {
    border-radius: 0;
    display: block;
    height: 0;
    left: 50%;
    margin: 0;
    position: absolute;
    top: 50%;
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    -o-transition: all .3s;
    transition: all .3s;
    width: 0
}

.icon-button:hover span {
    width: 2.6rem;
    height: 2.6rem;
    border-radius: 2.6rem;
    margin: -1.3rem
}

.icon-button i {
    background: 0;
    color: white;
    height: 2.6rem;
    left: 0;
    line-height: 2.6rem;
    position: absolute;
    top: 0;
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    -o-transition: all .3s;
    transition: all .3s;
    width: 2.6rem;
    z-index: 10;
    font-size: 20px
}

.twitter span {
    background-color: #4099ff
}

.facebook span {
    background-color: #3b5998
}

.google-plus span {
    background-color: #db5a3c
}

.tumblr span {
    background-color: #34526f
}

.instagram span {
    background-color: #517fa4
}

.youtube span {
    background-color: #b00
}

.pinterest span {
    background-color: #cb2027
}

.icon-button .icon-twitter {
    color: #4099ff
}

.icon-button .icon-facebook {
    color: #3b5998
}

.icon-button .fa-tumblr {
    color: #34526f
}

.icon-button .icon-google-plus {
    color: #db5a3c
}

.icon-button .fa-instagram {
    color: #517fa4
}

.icon-button .fa-youtube {
    color: #b00
}

.icon-button .fa-pinterest {
    color: #cb2027
}

.icon-button:hover .icon-twitter,
.icon-button:hover .icon-facebook,
.icon-button:hover .icon-google-plus,
.icon-button:hover .fa-tumblr,
.icon-button:hover .fa-instagram,
.icon-button:hover .fa-youtube,
.icon-button:hover .fa-pinterest {
    color: white
}

@media all and (max-width:680px) {
    .icon-button {
        border-radius: 1.6rem;
        font-size: .8rem;
        height: 1.6rem;
        line-height: 1.6rem;
        width: 1.6rem
    }
    .icon-button:hover span {
        width: 1.6rem;
        height: 1.6rem;
        border-radius: 1.6rem;
        margin: -0.8rem
    }
    .icon-button i {
        height: 1.6rem;
        line-height: 1.6rem;
        width: 1.6rem
    }
    .pinterest {
        display: none
    }
}

.login-section .box-conatiner {
    contain: content;
    margin: 0 auto 60px;
    padding-right: 30px;
    width: 85%;
    overflow: hidden;
    background-color: #8c32f6;
    border-radius: 0 70px;
    box-shadow: 0 .46875rem 2.1875rem rgba(4, 9, 20, 0.41), 0 .9375rem 1.40625rem rgba(4, 9, 20, 0.03), 0 .25rem .53125rem rgba(4, 9, 20, 0.05), 0 .125rem .1875rem rgba(4, 9, 20, 0.03)
}

.login-section .box-conatiner::before {
    content: "";
    background: url(../images/shape.png);
    position: absolute;
    right: 0;
    background-size: 100%;
    width: 1220px;
    height: 30.8pc
}

.login-section #a {
    -webkit-animation: wait 0s alternate infinite;
    animation: wait 0s alternate infinite
}

.login-section .circle-ripple {
    background-color: transparent;
    width: 1px;
    height: 1px;
    border-radius: 50%;
    -webkit-animation: ripple .7s linear infinite;
    animation: ripple .7s linear infinite;
    left: 60px;
    position: relative;
    top: 44px
}

@-webkit-keyframes wait {
    0% {
        opacity: 0
    }
    20% {
        opacity: 0
    }
    40% {
        opacity: 0
    }
    60% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}

@keyframes wait {
    0% {
        opacity: 0
    }
    20% {
        opacity: 0
    }
    40% {
        opacity: 0
    }
    60% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}

@-webkit-keyframes ripple {
    0% {
        box-shadow: 0 0 0 0 rgba(175, 166, 255, 0.3), 0 0 0 1em rgba(175, 166, 255, 0.3), 0 0 0 3em rgba(175, 166, 255, 0.3), 0 0 0 5em rgba(175, 166, 255, 0.3)
    }
    100% {
        box-shadow: 0 0 0 1em rgba(175, 166, 255, 0.3), 0 0 0 3em rgba(175, 166, 255, 0.3), 0 0 0 5em rgba(175, 166, 255, 0.3), 0 0 0 8em rgba(175, 166, 255, 0)
    }
}

@keyframes ripple {
    0% {
        box-shadow: 0 0 0 0 rgba(175, 166, 255, 0.3), 0 0 0 1em rgba(175, 166, 255, 0.3), 0 0 0 3em rgba(175, 166, 255, 0.3), 0 0 0 5em rgba(175, 166, 255, 0.3)
    }
    100% {
        box-shadow: 0 0 0 1em rgba(175, 166, 255, 0.3), 0 0 0 3em rgba(175, 166, 255, 0.3), 0 0 0 5em rgba(175, 166, 255, 0.3), 0 0 0 8em rgba(175, 166, 255, 0)
    }
}

.login-section a {
    font-size: 14px;
    line-height: 1.7;
    color: #666;
    margin: 0;
    transition: all .4s;
    -webkit-transition: all .4s;
    -o-transition: all .4s;
    -moz-transition: all .4s
}

.login-section a:focus {
    outline: none!important
}

.login-section a:hover {
    text-decoration: none;
    color: #1b3815
}

.login-section input {
    outline: 0;
    border: 0
}

.login-section input[type=number] {
    -moz-appearance: textfield;
    appearance: none;
    -webkit-appearance: none
}

.login-section input[type=number]::-webkit-outer-spin-button,
.login-section input[type=number]::-webkit-inner-spin-button {
    -webkit-appearance: none
}

.login-section textarea {
    outline: 0;
    border: 0
}

.login-section textarea:focus,
.login-section input:focus {
    border-color: transparent!important
}

.login-section input::-webkit-input-placeholder {
    color: #1b3815
}

.login-section input:-moz-placeholder {
    color: #1b3815
}

.login-section input::-moz-placeholder {
    color: #1b3815
}

.login-section input:-ms-input-placeholder {
    color: #1b3815
}

.login-section textarea::-webkit-input-placeholder {
    color: #1b3815
}

.login-section textarea:-moz-placeholder {
    color: #1b3815
}

.login-section textarea::-moz-placeholder {
    color: #1b3815
}

.login-section textarea:-ms-input-placeholder {
    color: #1b3815
}

.login-section button {
    outline: none!important;
    border: 0;
    background: transparent;
    font-size: 19px;
}

.signin-brn:hover {
    background: #38a4ff!important;
}

.abcRioButtonContents {
    font-size: 19px!important;
}

.abcRioButton:hover {
    box-shadow: unset!important;
    background: linear-gradient(45deg, #00dbde, #fc00ff);
    color: #fff!important;
}

.login-section .container-login100 {
    width: 100%;
    min-height: 100vh;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    padding: 15px;
    position: relative;
    background-color: #fff
}

.wrap-login100 {
    width: 100%;
    /* width: 425px; */
    background: #fff;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 3px 20px 0 rgba(0, 0, 0, .1);
    -moz-box-shadow: 0 3px 20px 0 rgba(0, 0, 0, .1);
    -webkit-box-shadow: 0 3px 20px 0 rgba(0, 0, 0, .1);
    -o-box-shadow: 0 3px 20px 0 rgba(0, 0, 0, .1);
    -ms-box-shadow: 0 3px 20px 0 rgba(0, 0, 0, .1);
    border: 1px solid #dedede;
    margin: 20px auto
}

.login100-form {
    width: 100%;
    position: relative
}

.login100-form-title {
    font-size: 30px;
    color: #fff;
    line-height: 1.2;
    text-align: center;
    display: block;
    width: 100%;
    top: 0;
    left: 0;
    /* background-color: #8c32f6; */
    background: url(../img/bg-01.jpg);
    padding: 70px 15px 74px 15px;
    /* padding-top: 20px;
    padding-bottom: 20px */
    position: relative;
}

.login100-form-title-1 {
    font-size: 37px;
    font-weight: 600;
    letter-spacing: 1px;
    text-transform: uppercase;
    line-height: 1.2;
    text-align: center;
    position: relative;
}

.text-black {
    color: #000;
}

.fz-18 {
    font-size: 18px!important;
}

.texta {
    color: #0056b3!important;
}

.label-input100 {
    font-family: "SpaceGrotesk";
    font-size: 17px;
    color: #808080;
    text-align: right;
    top: 14px;
}

.signin-brn {
    padding: 10px 40px!important;
    margin: 0 auto!important;
    font-size: 19px;
}

.abcRioButton.abcRioButtonLightBlue {
    height: 49px!important;
    width: auto!important;
    padding: 8px 30px;
    border-radius: 10px;
}

.login100-form-title::before {
    content: "";
    display: block;
    position: absolute;
    z-index: 0;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: rgba(54, 84, 99, 0.7);
}

.wrap-input100 {
    width: 100%;
    background-color: #fff;
    border-radius: 27px;
    position: relative;
    z-index: 1
}

.login-section .input100 {
    font-size: 15px;
    color: #808080;
    line-height: 1.2;
    position: relative;
    display: block;
    width: 100%;
    height: 50px;
    /* background: #ebebeb; */
    /* border-radius: 27px; */
    padding: 0 35px 0 0;
    border-bottom: 1px solid #ccc;
}

.login-section .input100:focus {
    border-bottom: 1px solid #ccc!important;
}

.login-section .input100::placeholder {
    color: #808080;
}

.focus-input100 {
    display: block;
    position: absolute;
    z-index: -1;
    width: 100%;
    height: 100%;
    top: 0;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
    border-radius: 31px;
    background-color: #ebebeb;
    pointer-events: none;
    -webkit-transition: all .4s;
    -o-transition: all .4s;
    -moz-transition: all .4s;
    transition: all .4s
}

.p-r-55 {
    padding-right: 55px
}

.p-l-55 {
    padding-left: 55px
}

.p-t-178 {
    padding-top: 178px
}

.m-b-16 {
    margin-bottom: 16px
}

.p-t-20 {
    padding-top: 20px
}

.p-b-9 {
    padding-bottom: 9px
}

.login-section .flex-col-c {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    -ms-align-items: center;
    align-items: center
}

.login-section .login100-form-btn {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 20px;
    width: 100%;
    height: 50px;
    background-color: #5d4ef3;
    border-radius: 25px;
    font-size: 15px;
    color: #fff;
    line-height: 1.2;
    text-transform: uppercase;
    -webkit-transition: all .4s;
    -o-transition: all .4s;
    -moz-transition: all .4s;
    transition: all .4s
}

.text-right {
    text-align: right!important
}

.p-t-13 {
    padding-top: 13px
}

.p-b-23 {
    padding-bottom: 23px
}

.login-section .heading-left {
    color: white;
    width: 65%;
    text-align: center;
    text-transform: uppercase;
    line-height: 50px;
    letter-spacing: 4px
}

@media only screen and (max-width:600px) {
    .wrap-login100 {
        width: 100%
    }
    .wrap-login100 {
        width: 100%;
        right: -272px
    }
    .heading-left {
        font-size: 19px;
        line-height: 34px
    }
    .p-l-55 {
        padding-left: 20px
    }
    .p-r-55 {
        padding-right: 20px
    }
    .login-section .input100 {
        height: 40px
    }
    .login100-form-btn {
        height: 40px
    }
    .wrap-login100 {
        width: 95%
    }
}

@media only screen and (min-width:401px) and (max-width:1070px) {
    .login-section .box-conatiner::before {
        background-size: 48%;
        top: -80px;
        background-repeat: no-repeat;
        background: 0
    }
    .login-section .heading-left {
        font-size: 24px;
        line-height: 40px;
        margin: 235px auto;
        letter-spacing: 4px
    }
    .wrap-login100 {
        width: 90%
    }
}

.socialbtn {
    width: 74%;
    font-size: 19px
}

.socialbtn i {
    padding-right: 10px;
    border-right: 1px solid #00abf1
}

.socialbtn span {
    padding-left: 10px;
    color: #fff
}

.order-head h1,
.order-head h3,
.order-left-box h4 {
    text-transform: uppercase;
    letter-spacing: .6px
}

.order-head h3,
.order-left-box h4 {
    font-size: 20px
}

.order-left-box h3 .fa {
    color: #8442ab
}

.order-left-box {
    box-shadow: 0 3px 6px rgba(0, 0, 0, .2);
    padding: 20px;
    border-top: 5px solid #8c32f6;
    border-radius: 10px 10px 0 0
}

.order-left-box label {
    color: #000
}

.order-left-box .input-group-text {
    background: #f9f9ff;
    border: 0
}

.radiobtn {
    position: relative;
    display: block;
    width: auto;
    margin: 10px 5px 0;
    text-align: center
}

.fontorderh4 {
    font-family: "SpaceGrotesk-Bold";
    margin-left: 10px;
    font-size: 18px
}

.radiobtn label {
    display: block;
    background: #fee8c3;
    color: #444;
    border-radius: 5px;
    padding: 10px 12px;
    border: 2px solid #fdd591;
    margin-bottom: 5px;
    cursor: pointer;
    font-size: 13px
}

.radiobtn input[type="radio"] {
    display: none;
    position: absolute;
    width: 100%;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none
}

.radiobtn input[type="radio"]:checked+label {
    background: #fdcb77;
    -webkit-animation-name: blink;
    animation-name: blink;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    border-color: #fcae2c
}

.file-area {
    width: 100%;
    position: relative
}

.file-area input[type=file] {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    opacity: 0;
    cursor: pointer
}

.file-area .file-dummy {
    width: 97.5%;
    padding: 30px;
    background: rgba(255, 255, 255, 0.2);
    border: 2px dashed rgba(189, 178, 178, 0.38);
    text-align: center;
    transition: background .3s ease-in-out
}

.file-area .file-dummy .success {
    display: none
}

.file-area:hover .file-dummy {
    background: rgba(255, 255, 255, 0.1)
}

.file-area input[type=file]:focus+.file-dummy {
    outline: 2px solid rgba(255, 255, 255, 0.5);
    outline: -webkit-focus-ring-color auto 5px
}

.file-area input[type=file]:valid+.file-dummy {
    border-color: rgba(0, 255, 0, 0.4);
    background-color: rgba(0, 255, 0, 0.3)
}

.file-area input[type=file]:valid+.file-dummy .success {
    display: inline-block
}

.file-area input[type=file]:valid+.file-dummy .default {
    display: none
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0
}

input[type=number] {
    -moz-appearance: textfield
}

.orderbtn:hover {
    color: #38a4ff!important;
    border-color: #38a4ff!important
}

.phonebtnbox .button {
    display: inline-block;
    font-family: "Montserrat", "Trebuchet MS", Helvetica, sans-serif;
    -webkit-font-smoothing: antialiased;
    position: relative;
    padding: .8em 1.4em;
    padding-right: 4.7em;
    background: #009ed8;
    border: 0;
    color: white;
    transition: .2s
}

.phonebtnbox .button:before,
.phonebtnbox .button:after {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    padding-top: inherit;
    padding-bottom: inherit;
    width: 2.8em;
    content: "\00a0";
    font-family: 'FontAwesome', sans-serif;
    font-size: 1.2em;
    text-align: center;
    transition: .2s;
    transform-origin: 50% 60%
}

.chatbox .button:before,
.chatbox .button:after {
    content: "\f075"!important
}

.phonebtnbox .button:before {
    background: rgba(0, 0, 0, 0.1)
}

.phonebtnbox .button:hover {
    background: #0079a5
}

.phonebtnbox .button:active,
.phonebtnbox .button:focus {
    background: #002e3f;
    outline: 0
}

.phonebtnbox .button {
    width: 100%;
    font-size: 18px
}

.phonebtnbox .phone,
.phonebtnbox .chat {
    background: #8442ab
}

.phonebtnbox .phone:hover {
    background: #7b4cb3bf
}

.phonebtnbox .phone:active,
.phonebtnbox .phone:focus {
    background: #8737e670
}

.phonebtnbox .phone:after {
    content: "\F095"
}

.phonebtnbox .chat:after {
    content: "\F095"
}

.phonebtnbox .phone:hover:after {
    -webkit-animation: wiggle .05s alternate ease infinite;
    animation: wiggle .05s alternate ease infinite
}

@-webkit-keyframes wiggle {
    from {
        -webkit-transform: rotate(0deg)
    }
    to {
        -webkit-transform: rotate(30deg)
    }
}

@keyframes wiggle {
    from {
        transform: rotate(0deg)
    }
    to {
        transform: rotate(30deg)
    }
}

.order-summary {
    box-shadow: 0 3px 6px rgba(0, 0, 0, .2);
    border-top: 5px solid #8442ab;
    padding: 10px;
    border-radius: 10px 10px 0 0
}

.order-summary table tr td:nth-child(3) {
    text-align: right
}

.order-summary table tr td {
    font-size: 15px;
    padding: 2px 0
}

table {
    width: 100%
}

.free-structure {
    box-shadow: 0 3px 6px rgba(0, 0, 0, .2);
    border-top: 5px solid #8442ab;
    border-radius: 10px 10px 0 0
}

.free-structure h3 {
    text-transform: uppercase;
    font-size: 24px;
    letter-spacing: 1px;
    padding-top: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #ccc
}

.free-structure table {
    margin-top: 10px
}

.free-structure .price {
    font-size: 20px;
    font-weight: 600;
    text-decoration: line-through;
    padding-right: 5px
}

.free-structure table tr td {
    font-size: 15px;
    padding: 8px 10px
}

.free-structure table tr:nth-child(even) {
    border-bottom: 1px solid #ccc
}

.free-structure .free {
    font-size: 18px;
    color: #e49c18;
    font-weight: 500
}

.faqbox {
    box-shadow: 0 3px 6px rgba(0, 0, 0, .2);
    padding: 30px 20px 0;
    margin-bottom: 60px;
    border-top: 5px solid #8c32f6;
    border-radius: 10px 10px 0 0
}

.faqbox .myaccordion .card,
.faqbox .myaccordion .card:last-child .card-header {
    border: 0;
    background: #f9f9f9
}

.faqbox .myaccordion .card {
    margin: 0 0 30px
}

.faqbox .myaccordion .card-header {
    border-bottom-color: #edeff0;
    background: transparent
}

.faqbox .myaccordion .fa-stack {
    font-size: 18px
}

.faqbox .myaccordion .btn {
    width: 100%;
    font-weight: bold;
    color: #000;
    padding: 0
}

.faqbox .myaccordion .btn-link:hover,
.faqbox .myaccordion .btn-link:focus {
    text-decoration: none
}

.faqbox .myaccordion li+li {
    margin-top: 10px
}

.order-section .nice-select ul {
    max-height: 300px;
    overflow-y: auto;
    width: 100%
}

.commom-form {
    padding: 10px;
    border-width: 5px 1px 1px 1px;
    border-style: solid;
    border-color: #8c32f6 #eee #eee;
    margin-bottom: 30px;
    border-radius: 10px 10px 0 0;
    box-shadow: 0 3px 6px rgba(0, 0, 0, .2)
}

.commom-form label {
    color: #000
}

.commom-form h3 {
    text-transform: uppercase
}

.earnbox {
    padding: 10px 50px;
    box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.37);
    margin-bottom: 30px
}

.brdrds1 {
    border-radius: 70px 0
}

.brdrds2 {
    border-radius: 0 70px
}

.pr-33 {
    padding-right: 33px
}

.earnboximg {
    text-align: center;
    padding: 10px;
    border-radius: 50%;
    box-shadow: 0 3px 6px #000
}

.earnboximg img {
    width: 32px
}

.earnbox h4 {
    align-self: center;
    margin-left: 15px;
    font-size: 28px
}

.earnbox>div {
    padding-bottom: 10px
}

.earnbox p {
    font-size: 17px
}

#cd-timeline {
    position: relative;
    padding: 2em 0;
    margin-top: 2em;
    margin-bottom: 2em
}

#cd-timeline::before {
    content: '';
    position: absolute;
    top: 0;
    left: 18px;
    height: 100%;
    width: 4px;
    background: #bbccd8
}

.cd-timeline-img h3 {
    text-align: center;
    font-size: 32px;
    margin: auto;
    line-height: 53px;
    color: #fff
}

@media only screen and (min-width:1170px) {
    #cd-timeline {
        margin-top: 0;
        margin-bottom: 3em
    }
    #cd-timeline::before {
        left: 50%;
        margin-left: -2px
    }
}

.cd-timeline-block {
    position: relative;
    margin: 2em 0
}

.cd-timeline-block::after {
    clear: both;
    content: "";
    display: table
}

.cd-timeline-block:first-child {
    margin-top: 0
}

.cd-timeline-block:last-child {
    margin-bottom: 0
}

@media only screen and (min-width:1170px) {
    .cd-timeline-block {
        margin: 2em 0
    }
    .cd-timeline-block:first-child {
        margin-top: 0
    }
    .cd-timeline-block:last-child {
        margin-bottom: 0
    }
}

.cd-timeline-img {
    position: absolute;
    top: 0;
    left: 0;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    box-shadow: 0 0 3px 4px #fff, inset 0 2px 0 rgba(0, 0, 0, 0.08), 0px 0 6px 6px rgba(0, 0, 0, 0.22)
}

.cd-timeline-img img {
    display: block;
    width: 24px;
    height: 24px;
    position: relative;
    left: 50%;
    top: 50%;
    margin-left: -12px;
    margin-top: -12px
}

.cd-timeline-img.cd-picture {
    background: #75ce66
}

.cd-timeline-img.cd-movie {
    background: #c03b44
}

.cd-timeline-img.cd-location {
    background: #f0ca45
}

@media only screen and (min-width:1170px) {
    .cd-timeline-img {
        width: 60px;
        height: 60px;
        left: 50%;
        margin-left: -30px;
        -webkit-transform: translateZ(0);
        -webkit-backface-visibility: hidden
    }
    .cssanimations .cd-timeline-img.is-hidden {
        visibility: hidden
    }
    .cssanimations .cd-timeline-img.bounce-in {
        visibility: visible;
        -webkit-animation: cd-bounce-1 .6s;
        -moz-animation: cd-bounce-1 .6s;
        animation: cd-bounce-1 .6s
    }
}

@-webkit-keyframes cd-bounce-1 {
    0% {
        opacity: 0;
        -webkit-transform: scale(0.5)
    }
    60% {
        opacity: 1;
        -webkit-transform: scale(1.2)
    }
    100% {
        -webkit-transform: scale(1)
    }
}

@-moz-keyframes cd-bounce-1 {
    0% {
        opacity: 0;
        -moz-transform: scale(0.5)
    }
    60% {
        opacity: 1;
        -moz-transform: scale(1.2)
    }
    100% {
        -moz-transform: scale(1)
    }
}

@keyframes cd-bounce-1 {
    0% {
        opacity: 0;
        -webkit-transform: scale(0.5);
        -moz-transform: scale(0.5);
        -ms-transform: scale(0.5);
        -o-transform: scale(0.5);
        transform: scale(0.5)
    }
    60% {
        opacity: 1;
        -webkit-transform: scale(1.2);
        -moz-transform: scale(1.2);
        -ms-transform: scale(1.2);
        -o-transform: scale(1.2);
        transform: scale(1.2)
    }
    100% {
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        -ms-transform: scale(1);
        -o-transform: scale(1);
        transform: scale(1)
    }
}

.cd-timeline-content {
    position: relative;
    margin-left: 60px;
    background: #fff;
    border-radius: .25em;
    padding: 1em;
    box-shadow: inset 0 0 4px 5px #d7e4ed
}

.cd-timeline-content::after {
    clear: both;
    content: "";
    display: table
}

.cd-timeline-content p {
    line-height: 1.6
}

.cd-timeline-content::before {
    content: '';
    position: absolute;
    top: 16px;
    right: 100%;
    height: 0;
    width: 0;
    border: 7px solid transparent;
    border-right: 7px solid #fff
}

@media only screen and (min-width:768px) {
    .cd-timeline-content p {
        font-size: 16px;
        font-size: 1rem
    }
}

@media only screen and (min-width:1170px) {
    .cd-timeline-content {
        margin-left: 0;
        padding: 1em;
        width: 45%;
        display: flex
    }
    .cd-timeline-content::before {
        top: 24px;
        left: 100%;
        border-color: transparent;
        border-left-color: #8442ab
    }
    .cd-timeline-block:nth-child(even) .cd-timeline-content {
        float: right
    }
    .cd-timeline-block:nth-child(even) .cd-timeline-content::before {
        top: 24px;
        left: auto;
        right: 100%;
        border-color: transparent;
        border-right-color: #8442ab
    }
    .cssanimations .cd-timeline-content.is-hidden {
        visibility: hidden
    }
    .cssanimations .cd-timeline-content.bounce-in {
        visibility: visible;
        -webkit-animation: cd-bounce-2 .6s;
        -moz-animation: cd-bounce-2 .6s;
        animation: cd-bounce-2 .6s
    }
}

@media only screen and (min-width:1170px) {
    .cssanimations .cd-timeline-block:nth-child(even) .cd-timeline-content.bounce-in {
        -webkit-animation: cd-bounce-2-inverse .6s;
        -moz-animation: cd-bounce-2-inverse .6s;
        animation: cd-bounce-2-inverse .6s
    }
}

@-webkit-keyframes cd-bounce-2 {
    0% {
        opacity: 0;
        -webkit-transform: translateX(-100px)
    }
    60% {
        opacity: 1;
        -webkit-transform: translateX(20px)
    }
    100% {
        -webkit-transform: translateX(0)
    }
}

@-moz-keyframes cd-bounce-2 {
    0% {
        opacity: 0;
        -moz-transform: translateX(-100px)
    }
    60% {
        opacity: 1;
        -moz-transform: translateX(20px)
    }
    100% {
        -moz-transform: translateX(0)
    }
}

@keyframes cd-bounce-2 {
    0% {
        opacity: 0;
        -webkit-transform: translateX(-100px);
        -moz-transform: translateX(-100px);
        -ms-transform: translateX(-100px);
        -o-transform: translateX(-100px);
        transform: translateX(-100px)
    }
    60% {
        opacity: 1;
        -webkit-transform: translateX(20px);
        -moz-transform: translateX(20px);
        -ms-transform: translateX(20px);
        -o-transform: translateX(20px);
        transform: translateX(20px)
    }
    100% {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
        transform: translateX(0)
    }
}

@-webkit-keyframes cd-bounce-2-inverse {
    0% {
        opacity: 0;
        -webkit-transform: translateX(100px)
    }
    60% {
        opacity: 1;
        -webkit-transform: translateX(-20px)
    }
    100% {
        -webkit-transform: translateX(0)
    }
}

@-moz-keyframes cd-bounce-2-inverse {
    0% {
        opacity: 0;
        -moz-transform: translateX(100px)
    }
    60% {
        opacity: 1;
        -moz-transform: translateX(-20px)
    }
    100% {
        -moz-transform: translateX(0)
    }
}

@keyframes cd-bounce-2-inverse {
    0% {
        opacity: 0;
        -webkit-transform: translateX(100px);
        -moz-transform: translateX(100px);
        -ms-transform: translateX(100px);
        -o-transform: translateX(100px);
        transform: translateX(100px)
    }
    60% {
        opacity: 1;
        -webkit-transform: translateX(-20px);
        -moz-transform: translateX(-20px);
        -ms-transform: translateX(-20px);
        -o-transform: translateX(-20px);
        transform: translateX(-20px)
    }
    100% {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
        transform: translateX(0)
    }
}

.earnprocessimg {
    align-self: start;
    width: 80px;
    padding: 15px;
    border-radius: 50%;
    border: 1px dashed;
    margin-right: 15px
}

.earnprocessimg img {
    width: 50px
}

.how-much-earn {
    background: url('../images/earn/bg2.jpg');
    min-height: 500px;
    width: 100%;
    background-size: cover;
    background-repeat: no-repeat
}

.value-button {
    display: inline-block;
    border: 1px solid #ddd;
    margin: 0;
    width: 15%;
    height: 20px;
    text-align: center;
    vertical-align: middle;
    padding: 11px 0;
    background: #eee;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.value-button:hover {
    cursor: pointer
}

.how-much-earn #decrease {
    margin-right: -4px;
    border-radius: 8px 0 0 8px;
    height: 40px;
    margin-top: -5px;
    font-size: 24px;
    line-height: 15px
}

#increase {
    margin-left: -4px;
    border-radius: 0 8px 8px 0;
    height: 40px;
    font-size: 24px;
    line-height: 18px;
    margin-top: -5px
}

.how-much-earn #input-wrap {
    margin: 0;
    padding: 0
}

.how-much-earn input#number,
.commision {
    text-align: center;
    border: 0;
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    margin: 0;
    width: 68%;
    height: 40px;
    background: #eee
}

.commision {
    width: 100%;
    border-radius: 5px
}

.how-much-earn input[type=number]::-webkit-inner-spin-button,
.how-much-earn input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0
}

.home-banner-right .form-group {
    margin-bottom: 1rem
}

.home-banner-right .form-group label {
    font-size: 16px
}

.home-banner-right .form-group .form-control {
    font-size: 15px
}

.popover-block-container-blue .popover-icon {
    background: 0;
    color: none;
    border: 0;
    padding: 0;
    outline: 0;
    cursor: pointer;
    height: 0;
    padding-left: 10px
}

.popover-block-container-blue .popover-icon i {
    color: #fff;
    text-align: center;
    margin-top: 4px
}

.popover-header {
    display: none
}

.popover {
    max-width: 306.6px;
    border-radius: 6px;
    border: 0;
    box-shadow: 0 0 6px 1px #eee
}

.popover-body {
    border: 0;
    padding: 20px;
    color: #1a1f71;
    font-size: 15px;
    font-style: italic;
    z-index: 2;
    line-height: 1.53;
    letter-spacing: .1px
}

.sample-main-div {
    box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .2);
    position: relative;
    height: 250px;
    border-radius: 5px;
    margin-bottom: 30px
}

.sample-main-div h3 {
    margin-bottom: 15px
}

.sample-main-div p {
    margin-bottom: 10px;
    margin: 0
}

.sample-main-div .content-box {
    padding: 15px
}

.sample-info-box {
    background: #ccc;
    padding: 10px 15px;
    position: absolute;
    bottom: 0;
    width: 100%;
    border-radius: 0 0 5px 5px
}

.sample-info-box ul li {
    display: inline-block;
    width: calc(100% /3);
    font-weight: 600
}

.sample-info-box ul li i {
    padding-right: 5px
}

.sample-info-box ul li:nth-child(2) {
    text-align: center
}

.content-box a {
    position: absolute;
    bottom: 50px;
    cursor: pointer
}

.sample-category ul li {
    border-bottom: 1px dotted #ccc;
    padding: 10px
}

.filterbox {
    position: absolute;
    top: 90px;
    background: #fff;
    width: 100%;
    padding: 20px;
    box-shadow: inset 0 0 5px 8px #ccc
}

.filterbox ul {
    width: 100%;
    max-height: 160px;
    overflow-y: auto!important
}

.sample-banner input[type="text"] {
    height: 50px;
    width: 100%;
    font-size: 14px;
    display: inline-block;
    font-weight: 100;
    border: solid 1px #e8e8e8;
    outline: 0;
    color: #000;
    padding: 3px 15px;
    border-radius: 3px;
    top: 0;
    background: #fff;
    z-index: 3;
    transition: width .4s cubic-bezier(0.000, 0.795, 0.000, 1.000);
    cursor: pointer
}

.sample-banner input[type="submit"] {
    height: 35px;
    width: 35px;
    display: inline-block;
    color: #000;
    float: right;
    background: url(../../assets/images/sample/search1.png) center center no-repeat;
    text-indent: -10000px;
    border: 0;
    background-size: cover;
    position: absolute;
    top: 7px;
    right: 85px;
    z-index: 4;
    cursor: pointer;
    cursor: pointer;
    transition: opacity .4s ease
}

.sample-banner input[type="submit"]:hover {
    opacity: .8
}

.sample-banner #wrap {
    position: relative
}

.sample-banner ::placeholder {
    color: #000
}

.btn-filter {
    position: absolute;
    right: 20px;
    height: 48px;
    width: 50px;
    background: #fff;
    background: #7f7fd5;
    background: -webkit-linear-gradient(90deg, #7c32ff 0, #c738d8 100%);
    background: linear-gradient(90deg, #7c32ff 0, #c738d8 100%);
    border: 0
}

.btn-filter img {
    width: 100%
}

.popular-tag ul li:hover {
    background: #222
}

.popular-tag ul li:hover a {
    color: #fff
}

.popular-tag ul li {
    display: inline-block;
    border: 1px solid #eee;
    background: #fff;
    padding: 4px 14px;
    margin-bottom: 10px;
    -webkit-transition: all .3s ease 0s;
    -moz-transition: all .3s ease 0s;
    -o-transition: all .3s ease 0s;
    transition: all .3s ease 0s
}

.popular-tag ul {
    padding: 10px
}

.feature-area .full-width {
    float: left;
    width: 100%;
    background-color: #fff;
    margin-bottom: 20px
}

.feature-area .user-data {
    text-align: center
}

.feature-area .user-profile {
    width: 100%
}

.feature-area .username-dt {
    float: left;
    width: 100%;
    padding-top: 25px
}

.feature-area .usr-pic {
    width: 90px;
    height: 90px;
    margin: 0 auto;
    margin-bottom: -42px;
    border: 5px solid #8c32f6;
    border-radius: 100px;
    overflow: hidden
}

.feature-area .usr-pic>img {
    float: none;
    width: 80px;
    height: 80px;
    padding: 12px;
    background: #fff
}

.feature-area .user-specs {
    float: left;
    width: 100%;
    padding: 58px 0 15px 0
}

.feature-area .user-specs h4 {
    margin-bottom: 0
}

.sample-detail-sec {
    box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .2);
    padding: 15px;
    padding-bottom: 60px;
    position: relative
}

.content-overlay {
    width: 100%;
    bottom: 0;
    left: 0;
    right: 0;
    min-height: 50%;
    background-image: url(../images/sample/overlay.png);
    background-size: 100%;
    min-height: 800px;
    position: relative
}

.h-520 {
    height: 520px
}

.search-container button {
    float: right;
    padding: 9px 10px;
    background: #ddd;
    font-size: 17px;
    border: 0;
    cursor: pointer;
    width: 10%;
}

.search-container button:hover {
    background: #ccc
}

.search-container input[type=text] {
    width: 90%;
    height: 40px;
    background: #ddd;
    border: 0;
    padding: 0 10px
}

@media screen and (max-width:600px) {
    .search-container {
        float: none
    }
    .search-container a,
    .search-container input[type=text],
    .search-container button {
        float: none;
        display: block;
        text-align: left;
        width: 100%;
        margin: 0;
        padding: 14px
    }
    .search-container input[type=text] {
        border: 1px solid #ccc
    }
}

.table-contents .cat-list li {
    padding-top: 15px;
    padding-bottom: 8px;
    border-bottom: 2px dotted #eee;
    -webkit-transition: all .3s ease 0s;
    -moz-transition: all .3s ease 0s;
    -o-transition: all .3s ease 0s;
    transition: all .3s ease 0s
}

.table-contents .cat-list {
    padding: 0 10px 20px
}

.table-contents .cat-list li p {
    margin-bottom: 0
}

.sample-details-btn {
    justify-content: space-between;
    position: absolute;
    bottom: 10px;
    width: 100%;
    right: 0;
    padding: 0 20px
}

.sample-details-btn a {
    text-decoration: underline;
    padding-bottom: 5px;
    font-size: 18px
}

.smaplebrdrgt {
    border-right: 1px solid rgba(130, 139, 178, .2)
}

.membershipbox {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 80%;
    background: #fff;
    min-height: 300px;
    box-shadow: 0 0 6px 5px #ccc;
    border-radius: 2px;
    padding: 30px
}

.membershipbox label {
    color: #000
}

.membershipbox h4 {
    text-align: center;
    padding: 0 70px 10px;
    color: #8c32f6
}

.membershipbox p {
    text-align: center
}

.table-contents .cat-list li:hover,
.table-contents .cat-list li:hover a p {
    border-color: #222;
    color: #222;
    font-weight: 600
}

.other-sample-carusel .owl-nav {
    display: flex;
    justify-content: flex-end;
    margin-top: 15px
}

.other-sample-carusel .owl-nav .owl-prev {
    margin-right: 15px
}

.popular-post-list {
    margin-top: 30px;
    padding-bottom: 15px
}

.popular-post-list .thumb img {
    width: 100px;
    max-width: 100px;
    height: 60px
}

.single-post-list {
    margin-bottom: 20px;
    padding: 0 10px
}

.single-post-list .details {
    margin-left: 12px
}

.single-post-list .details h6 {
    font-weight: 600;
    margin-bottom: 10px;
    -webkit-transition: all .3s ease 0s;
    -moz-transition: all .3s ease 0s;
    -o-transition: all .3s ease 0s;
    transition: all .3s ease 0s
}

.single-post-list .details h6:hover {
    color: #7c32ff
}

.single-post-list .details p {
    margin-bottom: 0
}

.single-sidebar-widget {
    margin: 30px;
    padding-bottom: 30px;
    border-bottom: 1px solid #eee
}

.single-sidebar-widget:last-child {
    border-bottom: 0;
    margin-bottom: 0
}

.search-widget form.search-form input[type=text] {
    color: #fff;
    padding: 10px 22px;
    font-size: 14px;
    border: 0;
    float: left;
    width: 80%;
    border-bottom-left-radius: 25px;
    border-top-left-radius: 25px;
    background: #7c32ff
}

.search-widget ::-webkit-input-placeholder {
    color: #fff
}

.search-widget ::-moz-placeholder {
    color: #fff
}

.search-widget :-ms-input-placeholder {
    color: #fff
}

.search-widget :-moz-placeholder {
    color: #fff
}

.search-widget form.search-form button {
    float: left;
    width: 20%;
    padding: 10px;
    background: #7c32ff;
    color: #fff;
    font-size: 17px;
    border: 0;
    cursor: pointer;
    border-bottom-right-radius: 25px;
    border-top-right-radius: 25px
}

.search-widget form.search-form::after {
    content: "";
    clear: both;
    display: table
}

.sh-side-demos-intro h5 {
    margin-bottom: 3px;
    margin-top: 15px
}

.sh-side-demos-intro a {
    font-size: 16px
}

#particle-slider {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-position: center top
}

.contact-social .icon-button {
    background-color: white;
    border-radius: 2.6rem;
    cursor: pointer;
    display: inline-block;
    font-size: 1.3rem;
    height: 2.6rem;
    line-height: 2.6rem;
    margin: 0 15px;
    position: relative;
    text-align: center;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    width: 2.6rem
}

.contact-social .icon-button span {
    border-radius: 0;
    display: block;
    height: 0;
    left: 50%;
    margin: 0;
    position: absolute;
    top: 50%;
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    -o-transition: all .3s;
    transition: all .3s;
    width: 0
}

.contact-social .icon-button:hover span {
    width: 2.6rem;
    height: 2.6rem;
    border-radius: 2.6rem;
    margin: -1.3rem
}

.contact-social .icon-button i {
    background: 0;
    color: white;
    height: 2.6rem;
    left: 0;
    line-height: 2.6rem;
    position: absolute;
    top: 0;
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    -o-transition: all .3s;
    transition: all .3s;
    width: 2.6rem;
    z-index: 10;
    font-size: 28px
}

.contact-social .twitter span {
    background-color: #4099ff
}

.contact-social .facebook span {
    background-color: #3b5998
}

.contact-social .google-plus span {
    background-color: #db5a3c
}

.contact-social .tumblr span {
    background-color: #34526f
}

.contact-social .instagram span {
    background-color: #517fa4
}

.contact-social .youtube span {
    background-color: #b00
}

.contact-social .pinterest span {
    background-color: #cb2027
}

.contact-social .icon-button .icon-twitter {
    color: #4099ff
}

.contact-social .icon-button .icon-facebook {
    color: #3b5998
}

.contact-social .icon-button .fa-tumblr {
    color: #34526f
}

.contact-social .icon-button .icon-google-plus {
    color: #db5a3c
}

.contact-social .icon-button .fa-instagram {
    color: #517fa4
}

.contact-social .icon-button .fa-youtube {
    color: #b00
}

.contact-social .icon-button .fa-pinterest {
    color: #cb2027
}

.contact-social .icon-button:hover .icon-twitter,
.contact-social .icon-button:hover .icon-facebook,
.contact-social .icon-button:hover .icon-google-plus,
.contact-social .icon-button:hover .fa-tumblr,
.contact-social .icon-button:hover .fa-instagram,
.contact-social .icon-button:hover .fa-youtube,
.contact-social .icon-button:hover .fa-pinterest {
    color: white
}

@media all and (max-width:680px) {
    .contact-social .icon-button {
        border-radius: 1.6rem;
        font-size: .8rem;
        height: 1.6rem;
        line-height: 1.6rem;
        width: 1.6rem
    }
    .contact-social .icon-button:hover span {
        width: 1.6rem;
        height: 1.6rem;
        border-radius: 1.6rem;
        margin: -0.8rem
    }
    .contact-social .icon-button i {
        height: 1.6rem;
        line-height: 1.6rem;
        width: 1.6rem
    }
    .contact-social .pinterest {
        display: none
    }
}

.rating {
    display: flex;
    width: 100%;
    justify-content: center;
    overflow: hidden;
    flex-direction: row-reverse;
    height: 150px;
    position: relative
}

.rating-0 {
    filter: grayscale(100%)
}

.rating>input {
    display: none
}

.rating>label {
    cursor: pointer;
    width: 40px;
    height: 40px;
    margin-top: auto;
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvgxmlns='http://www.w3.org/2000/svg'width='126.729'height='126.73'%3e%3cpathfill='%23e3e3e3'd='M121.21544.212l-34.899-3.3c-2.2-.2-4.101-1.6-5-3.7l-12.5-30.3c-2-5-9.101-5-11.1010l-12.430.3c-.82.1-2.83.5-53.7l-34.93.3c-5.2.5-7.37-3.410.5l26.323.1c1.71.52.43.71.95.9l-7.932.399c-1.25.1014.39.38.96.601l29.1-17.101c1.9-1.14.2-1.16.10l29.10117.101c4.62.69910.1-1.48.899-6.601l-7.8-32.399c-.5-2.2.2-4.41.9-5.9l26.3-23.1c3.8-3.51.6-10-3.6-10.5z'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 76%;
    transition: .3s
}

.rating>input:checked~label,
.rating>input:checked~label~label {
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvgxmlns='http://www.w3.org/2000/svg'width='126.729'height='126.73'%3e%3cpathfill='%23fcd93a'd='M121.21544.212l-34.899-3.3c-2.2-.2-4.101-1.6-5-3.7l-12.5-30.3c-2-5-9.101-5-11.1010l-12.430.3c-.82.1-2.83.5-53.7l-34.93.3c-5.2.5-7.37-3.410.5l26.323.1c1.71.52.43.71.95.9l-7.932.399c-1.25.1014.39.38.96.601l29.1-17.101c1.9-1.14.2-1.16.10l29.10117.101c4.62.69910.1-1.48.899-6.601l-7.8-32.399c-.5-2.2.2-4.41.9-5.9l26.3-23.1c3.8-3.51.6-10-3.6-10.5z'/%3e%3c/svg%3e")
}

.rating>input:not(:checked)~label:hover,
.rating>input:not(:checked)~label:hover~label {
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvgxmlns='http://www.w3.org/2000/svg'width='126.729'height='126.73'%3e%3cpathfill='%23d8b11e'd='M121.21544.212l-34.899-3.3c-2.2-.2-4.101-1.6-5-3.7l-12.5-30.3c-2-5-9.101-5-11.1010l-12.430.3c-.82.1-2.83.5-53.7l-34.93.3c-5.2.5-7.37-3.410.5l26.323.1c1.71.52.43.71.95.9l-7.932.399c-1.25.1014.39.38.96.601l29.1-17.101c1.9-1.14.2-1.16.10l29.10117.101c4.62.69910.1-1.48.899-6.601l-7.8-32.399c-.5-2.2.2-4.41.9-5.9l26.3-23.1c3.8-3.51.6-10-3.6-10.5z'/%3e%3c/svg%3e")
}

.emoji-wrapper {
    width: 100%;
    text-align: center;
    height: 100px;
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0
}

.emoji-wrapper:before,
.emoji-wrapper:after {
    content: "";
    height: 15px;
    width: 100%;
    position: absolute;
    left: 0;
    z-index: 1
}

.emoji-wrapper:before {
    top: 0;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 0, rgba(255, 255, 255, 1) 35%, rgba(255, 255, 255, 0) 100%)
}

.emoji-wrapper:after {
    bottom: 0;
    background: linear-gradient(to top, rgba(255, 255, 255, 1) 0, rgba(255, 255, 255, 1) 35%, rgba(255, 255, 255, 0) 100%)
}

.emoji {
    display: flex;
    flex-direction: column;
    align-items: center;
    transition: .3s
}

.emoji>svg {
    margin: 15px 0;
    width: 70px;
    height: 70px;
    flex-shrink: 0
}

#rating-1:checked~.emoji-wrapper>.emoji {
    transform: translateY(-100px)
}

#rating-2:checked~.emoji-wrapper>.emoji {
    transform: translateY(-200px)
}

#rating-3:checked~.emoji-wrapper>.emoji {
    transform: translateY(-300px)
}

#rating-4:checked~.emoji-wrapper>.emoji {
    transform: translateY(-400px)
}

#rating-5:checked~.emoji-wrapper>.emoji {
    transform: translateY(-500px)
}

.feedback {
    max-width: 360px;
    background-color: #fff;
    width: 100%;
    padding: 0 30px;
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    align-items: center
}

.header1 {
    background: #8442ab
}

.header1 .firstnav {
    padding: 10px 15px;
    border-bottom: 1px solid #fff
}

.userprofile p {
    margin: 0
}

.userprofile p:first-child {
    padding-bottom: 5px
}

.profileimg-circle {
    width: 45px;
    height: 45px;
    border-radius: 50%;
    position: relative;
    margin: 0 auto;
    margin-bottom: 5px;
    background-color: #4f4f4f
}

.profileimg-circle img {
    width: 28px;
    height: 28px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

.header1-ul {
    display: flex!important;
    justify-content: flex-end
}

.imagewithtext {
    display: flex;
    align-self: center
}

.dashboard-panel {
    position: relative;
    top: 65px;
    width: 100%
}

.dashboard-panel .nav-item {
    padding: 13px 15px;
    border-left: 2px solid #352b2b;
    position: relative
}

.header1 .core-menu li {
    position: relative;
    margin: 5px
}

.header2 .badge {
    background: #000;
    border-radius: 15px;
    position: absolute;
    right: 0;
    top: -5px
}

.dashboard-panel .badge {
    border-radius: 10px;
    background-color: red;
    box-shadow: 1px 1px 1px 1px #373737;
    position: absolute;
    right: 12%;
    font-size: 65%;
    z-index: 99
}

.dashboard-panel .navleft>li>a:hover:after,
.dashboard-panel .navleft>li.active>a:after {
    opacity: 1;
    visibility: visible
}

.dashboard-panel .navleft>li>a:after {
    left: 0;
    right: 0;
    width: 7px;
    margin: 0 auto;
    content: "";
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    border-bottom: 7px solid #dedddd;
    position: absolute;
    bottom: -1px;
    opacity: 0;
    visibility: hidden
}

.dashboard-panel .navbar-dark .navbar-nav .nav-link {
    color: #fff
}

.navright .profileimg-circle {
    background: #8442ab
}

.martop {
    margin-top: 125px
}

.assignmentsection th {
    text-align: center
}

.assignmentsection table {
    border-radius: 5px
}

.assignmentsection p {
    margin: 0
}

.assignmentsection label {
    color: #deaa09;
    margin: 0
}

.assignmentsection td {
    vertical-align: middle
}

.btn-pay {
    background: #0f920b
}

.btn-chat {
    background: #8442ab
}

.btn-notpaid {
    background: #c7c7c7;
    cursor: context-menu!important
}

.btn-get {
    background: #c7c7c7
}

.btn-get:hover {
    background: #e48c43
}

.btn-common {
    color: #fff;
    font-size: 14px;
    width: 100%;
    padding: 7px 12px
}

.btn-common:hover {
    color: #fff
}

.payment-td {
    text-align: center
}

table .money {
    font-weight: 600
}

.earning-banner {
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.4)), url(../images/earning/earning_bg.jpg);
    min-height: 300px;
    background-repeat: no-repeat;
    position: relative;
    top: 132px;
    background-position: center
}

.academic_details li {
    display: initial;
    margin: 0 30px 0 0
}

.academic_details li i {
    padding-right: 5px
}

.academic_details {
    background: #f9f9f9!important;
    padding: 20px 40px 40px!important
}

.text-mark-green {
    color: #048041
}

.btn-blue {
    border: 1px solid #8c32f6;
    color: #8c32f6;
    font-size: 13px;
    cursor: context-menu!important;
    background: transparent;
    padding: 3px 12px
}

.text-mark-orange {
    color: #ff9740
}

.academic_details label {
    color: #000
}

.academic_details label i {
    padding-right: 10px
}

.counter-academic li {
    display: inline-block;
    font-size: 14px;
    list-style-type: none;
    margin: 0 5px 0 0;
    padding: 0
}

.counter-academic li span {
    padding-right: 3px;
    font-size: 14px
}

.huury-text {
    font-weight: 600;
    color: #b11d29
}

.priceusd {
    align-self: center;
    text-align: center
}

.priceusd p {
    margin: 0;
    font-size: 20px
}

.priceusd p span {
    font-weight: 600
}

.academic_details table th,
.academic_details table td {
    padding: 5px 0
}

.earning-table .tab-content {
    padding: 0;
    width: 100%
}

.earning-table .nav-tabs,
.leader-board table {
    margin: 0 15px 20px
}

.circle-progress p {
    margin: 0;
    font-size: 16px
}

.circle-progress p:nth-child(2) {
    font-weight: 600;
    color: #8442ab
}

.circle-progress {
    min-width: 100px;
    min-height: 80px;
    border: 3px dashed #8c32f6;
    border-radius: 10px;
    position: relative;
    /* width: 80px;
    height: 80px;
    border: 5px solid #8c32f6;
    border-radius: 50%;
    position: relative */
}

.circle-progress>div {
    text-align: center;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    transform: translate(-50%, -50%)
}

.earning-table .nav-tabs .nav-link {
    margin-right: 20px;
    color: #000;
    font-size: 18px;
    padding: 10px 20px;
    border: 0;
    border-bottom: 2px solid transparent!important
}

.earning-table .nav-tabs .nav-link.active {
    border-bottom: 2px solid #8c32f6!important;
    color: #000;
    border: 0
}

.earning-table .nav-tabs .nav-link:focus,
.earning-table .nav-tabs .nav-link:hover {
    border: 0
}

.earning-banner-head h1 {
    color: #fff;
    font-size: 32px;
    font-weight: 500;
    text-align: center;
    margin-bottom: 10px
}

.earning-banner-head h5 {
    color: wheat;
    text-transform: capitalize;
    font-size: 32px;
    font-weight: 600;
    text-align: center;
    margin-bottom: 10px
}

.earning-banner-head h6 {
    color: #fff;
    text-transform: capitalize;
    font-size: 20px;
    text-align: center;
    font-weight: normal;
    margin-bottom: 20px
}

.earning-input-brd {
    margin-top: 20px;
    border: 1px solid #fbfcc5;
    border-radius: 2px;
    width: fit-content;
    margin: 0 auto
}

.text-custom {
    border: 0;
    font-size: 16px small;
    color: white;
    font-weight: 600;
    background: #4c4c4abd;
    font-size: 21px;
    padding-right: 0;
    color: #fff;
    align-self: center;
    padding: 11px 5px
}

.input-link {
    background-color: #4c4c4abd!important;
    color: #fff;
    font-size: 20px;
    border: 0
}

.earning-input-brd .addon-correction {
    background: #fbfcc5;
    color: #000;
    border: 1px solid #fbfcc5;
    transition: all .4s ease-in-out;
    font-size: 22px;
    padding: 7px 15px
}

#social-modal .modal-header p {
    font-size: 18px;
    font-weight: 500
}

.modal-body {
    padding: 20px 45px;
    text-align: center
}

#social-modal .modal-body p {
    font-size: 15px
}

#social-modal .form-control {
    width: 82.68%;
    border: 0
}

#social-modal .copydiv button {
    background: #8c32f6;
    border: 0;
    color: #fff
}

.copydiv {
    border: 1px solid #8c32f6
}

.sharesocial li {
    display: initial;
    margin-right: 15px
}

.sharesocial li i {
    font-size: 35px
}

.banner-down-sec {
    padding: 15px 0;
    margin-top: 133px
}

.banner-down-sec h3 {
    font-size: 24px;
    text-align: center;
    border-right: 1px solid #ccc
}

.text-theme {
    color: #8c32f6
}

.btn-cashback {
    background: #ddd;
    padding: 8px 15px;
    border-radius: 5px;
    font-size: 16px;
    color: #000!important;
    font-weight: 500;
    position: relative;
    top: 3px
}

#rqscashback .modal-header p {
    font-size: 26px;
    font-weight: 500
}

#rqscashback .modal-header {
    border-bottom: 0
}

.cashblnce {
    font-size: 24px;
    font-weight: 600
}

.cashblnce span {
    color: #8c32f6
}

.messagerqs {
    color: #659be0b5;
    font-size: 18px
}

.benfit-refer img {
    width: 75px;
    height: 75px
}

.benfit-refer h4 {
    font-size: 18px;
    font-family: "SpaceGrotesk-Bold";
    color: #00000091
}

.benfit-refer {
    text-align: center
}

.leader-board td {
    text-align: center
}

.leader-board table {
    border: 1px solid #8c32f6
}

.leader-board table td .tooltippara {
    position: absolute;
    width: 800px;
    text-align: justify;
    padding: 10px;
    margin: 10px 0 0 20px;
    background: #f9fdcb;
    border: 1px solid #ebeaa8;
    border-radius: 10px
}

.leader-board table td .tooltippara:before {
    left: 25px;
    right: 0;
    width: 7px;
    position: absolute;
    content: "";
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    border-bottom: 7px solid #cfd681;
    top: -8px
}

.tooltipdiv {
    position: relative
}

.earningp {
    font-size: 20px;
    font-weight: 600
}

.addmoney {
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.4)), url(../images/offers/wallet-banner.png);
    min-height: 300px;
    padding: 40px
}

.addmoney input[type="radio"] {
    visibility: hidden;
    height: 0;
    width: 0
}

.addmoney label {
    vertical-align: middle;
    text-align: center;
    cursor: pointer;
    background-color: #fff;
    color: #000;
    padding: 8px 30px;
    border-radius: 3px;
    transition: all .3s ease-out;
    font-size: 20px
}

.addmoney input[type="radio"]:checked+label {
    background-color: #8c32f6;
    color: #fff
}

.addmoney .left li {
    display: initial;
    margin-right: 10px
}

.showmoney label {
    width: 145px
}

.addmoney .addbtn .btn-pay {
    width: 145px
}

.addbtn .btn-pay:hover {
    color: #fff!important
}

.addmoney .col-md-8 {
    border-right: 2px solid #fff
}

.addmoney .right li {
    display: flex;
    margin-bottom: 15px
}

.addmoney .right li img {
    margin-right: 10px;
    width: 34px
}

.addmoney .right li p {
    margin: 0;
    align-self: center;
    font-size: 16px
}

.mainofferassign {
    border: 1px solid #ccc;
    margin-top: 15px
}

.offerassign {
    min-height: 200px;
    text-align: center;
    color: #fff;
    align-self: center;
    padding: 45px 0
}

.offerassign h3 {
    color: #feffa1;
    margin-bottom: 10px
}

.offerassign h4 {
    color: #fff;
    margin-bottom: 10px
}

.greatoffer1 {
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.4)), url(../images/offers/great-offer1.jpg)
}

.greatoffer2 {
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.4)), url(../images/offers/great-offer2.jpg)
}

.greatoffer3 {
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.4)), url(../images/offers/great-offer3.jpg)
}

.greatoffer4 {
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.4)), url(../images/offers/great-offer4.jpg)
}

.ordassign {
    font-size: 18px;
    padding: 30px 0;
    text-align: center;
    margin: 0
}

.ordassign span {
    display: block
}

.buypackage {
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.4)), url(../images/offers/new-offer1.jpg);
    padding: 20px 50px
}

.buypackage label {
    font-size: 18px
}

.buypackage p {
    color: #feffa1;
    font-style: italic
}

.buypackage h3,
.buypackage label,
.loyaltyprgm h3,
.loyaltyprgm h4,
.loyaltyprgm span,
.loyaltyprgm equal,
.wallet-banner h2,
.wallet-banner p {
    color: #fff
}

.loyaltyprgm {
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.4)), url(../images/offers/loyalty-points.jpg);
    background-position: -180px 0;
    padding: 20px 0 20px 225px;
    min-height: 260px
}

.loyaltyprgm span {
    font-size: 25px;
    border: 3px solid #fff;
    width: 70px;
    height: 70px;
    display: inline-block;
    border-radius: 50%;
    background-color: #3c3e3c;
    margin-top: 15px;
    line-height: 18px;
    padding-top: 18px;
    margin-bottom: 28px;
    text-align: center
}

.loyaltyprgm span small {
    font-size: 45%;
    display: block
}

.loyaltyprgm equal {
    font-size: 55px;
    margin: 0 5px
}

.wallet-banner h2 {
    font-size: 26px
}

.banrtxt {
    font-size: 24px;
    line-height: 30px
}

.wallet-banner ul li {
    display: inline-block;
    margin-right: 40px
}

.wallet-banner ul li p {
    font-size: 18px;
    padding-top: 10px
}

.haeder2 {
    background: #8c32f6;
    z-index: 9999;
}

.mtn-80 {
    margin-top: -80px
}

.firstnav {
    padding: 3px 15px;
    border-bottom: 1px solid #fff
}

.secondnav li a {
    display: flex;
    padding: 5px;
    border: 1px dashed transparent;
    border-radius: 3px;
    color: rgba(255, 255, 255, 1)!important
}

.secondnav li a:hover,
.secondnav li a:focus {
    border: 1px dashed #fff;
    color: rgba(255, 255, 255, 1)!important;
    opacity: 1
}

.secondnav {
    padding: 5px 15px
}

.secondnav li {
    border-right: 1px solid #fff;
    padding: 2px 10px
}

.secondnav .navright li {
    border: 0
}

.secondnav li img {
    width: 25px;
    height: 25px;
    margin-right: 5px
}

.imagewithtext p {
    margin: 0;
    text-transform: uppercase;
    font-size: 16px
}

.table-card {
    padding: 20px;
    background: #fff;
    box-shadow: 0 0 5px 7px #cccccc6e;
    border-top: 5px solid #8c32f6;
    width: 100%;
    border-radius: 10px 10px 0 0
}

.postopsec {
    position: relative;
    top: 230px
}

.bg-theme {
    background-color: #8c32f6
}

.assignmenttbl p {
    margin: 0
}

.assignmenttbl table th {
    text-align: center
}

.assignmenttbl label {
    color: #000
}

.content6 {
    border-right: 2px solid #8c32f6;
    padding: 10px;
    height: 100%
}

.content6 p,
.content5 p {
    margin: 0;
    font-size: 16px
}

.assgnmentbtn .btn-common {
    width: 30%;
    margin-right: 15px
}

.martop193 {
    margin-top: 193px
}

.table-card .btn-link {
    width: 100%
}

.table-card .card {
    margin: 0 20px 30px
}

.table-card .card-header {
    padding: 5px 30px
}

.top60 {
    top: 60px!important
}

.earning-input-brd .form-control:focus {
    color: #fff;
    box-shadow: none
}

.header1-ul li {
    position: relative
}

.header1-ul .badge {
    position: absolute;
    right: 0;
    background: #fff;
    color: #000
}

.profile-img img {
    width: 128px;
    height: 128px;
    border-radius: 50%
}

.profile-sec label {
    color: #000
}

.profile-sec p {
    margin: 0
}

.profile_ul ul {
    list-style: none;
    padding: 20px
}

.profile_ul ul li {
    display: block;
    position: relative;
    padding: 7px 0;
    line-height: 1.3em;
    color: #333;
    font-size: 16px
}

.profile_ul ul li::before {
    content: " ";
    position: absolute;
    top: 5px;
    left: -5px;
    width: 8px;
    height: 100%;
    background-color: #ccc
}

.profile_ul ul li .QAicon {
    position: absolute;
    display: block;
    top: -1px;
    left: -20px;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    background-color: #27ae60;
    text-align: center;
    padding: 11px 0;
    font-size: 18px;
    color: #fff
}

.profile_ul ul li .QATitle {
    margin: 0;
    padding: 0 0 2px 35px;
    font-size: 16px;
    font-weight: 700;
    color: #333
}

.profile_ul ul li .QAText {
    margin: 0;
    padding: 10px 0 15px 35px;
    font-size: 15px;
    color: #666
}

.wallet-balance h1 {
    margin-top: -40px;
    padding-bottom: 10px;
    border-bottom: 1px dashed #fff;
    margin-left: 15px;
    z-index: 2;
    color: #fff;
}

.bg-wallet-info {
    background: url('../images/wallet/wallet-how-it-works.jpg');
    background-size: cover;
    height: 100%;
    min-height: 660px
}

.assignmenttbl ul .nav-item {
    position: relative
}

.assignmenttbl ul .nav-item .nav-link .badge {
    position: absolute;
    top: 0;
    color: #fff;
    background: red;
    font-size: 12px
}

.search-box {
    background: #fff;
    padding: 20px;
    display: flex;
    border-radius: 5px
}

.serachdiv {
    width: 41%;
    margin-right: 10px
}

.search-box .nice-select {
    width: 100%;
    height: 50px;
    padding: 3px 15px
}

.search-box ul {
    width: 100%
}

.btn-search {
    background: #7f7fd5;
    background: -webkit-linear-gradient(90deg, #7c32ff 0, #c738d8 100%);
    background: linear-gradient(90deg, #7c32ff 0, #c738d8 100%);
    height: 48px;
    color: #fff;
    border: 0
}

.feedback-info-div h5 {
    font-family: "SpaceGrotesk-Bold"
}

.resouces-offers-sec .resources-div-col {
    border-bottom: 0!important
}

.servicesul li {
    display: flex;
    margin-bottom: 30px
}

.serviceicon {
    padding-right: 10px;
    padding-top: 10px
}

.fortext {
    font-style: italic;
    padding-left: 5px
}

.headh5 {
    text-transform: unset!important;
    padding: 0 15px
}

.service-menu h5,
.service-menu h6,
.service-menu h4,
.service-menu h3,
.service-menu h2,
.service-menu h1 {
    font-family: "SpaceGrotesk-Bold"!important
}

.service-menu li:hover {
    background: #cccccc2b
}

.dg {
    display: none
}

.floating-menu svg {
    width: 0
}

.blog_details_small_img img {
    width: 60px;
    height: 60px
}

.single-popular-course {
    box-shadow: 0 0 8px 2px #ccc;
    margin-top: 10px;
    margin-bottom: 10px
}

.quteform .radiobtn {
    display: inline-block
}

.load_more_blogs {
    padding: 10px 30px;
    font-size: 1rem
}

.load_more_blogs:hover {
    color: #38a4ff!important
}

.single-popular-course .thumb img {
    height: 150px
}

.how-much-earn p {
    font-size: 13px
}

.videoClass {
    object-fit: cover;
    width: 100%
}

.set_form_words {
    margin: 0;
    float: left;
    background-color: #38a4ff;
    color: #fff;
    height: 42px
}

.navigation-area .nav-left img,
.navigation-area .nav-right img {
    width: 60px;
    height: 60px;
    max-width: 60px
}

.details_p {
    height: 80px
}

.blog_para {
    height: 100px
}

.blog_h4 {
    height: 55px
}

.blog_p {
    height: 80px
}

.footer_reach_out i {
    padding-right: 5px
}

.footer-area .footer-bottom a {
    font-size: 13px
}

.single-footer-widget p {
    color: #ffffffa1
}

.single-footer-widget .footerbtn {
    position: relative;
    top: 20px;
    width: 100%;
    padding: 10px 15px;
    background-color: #f44a40;
    border: 2px solid transparent
}

.single-footer-widget .footerbtn:hover {
    border: 2px solid #f44a40;
    color: #f44a40!important
}

.single-footer-widget .footerbtn i {
    padding-right: 5px
}

.disclamair_text p {
    color: #465a71;
    padding: 15px 0
}

.logo_text p {
    padding-top: 15px;
    color: #fff
}

.logo_text {
    background: #040a25f2;
    padding: 30px 0
}

.logo_text ul li {
    display: inline-block;
    padding-top: 5px;
    margin: 0 15px;
    color: #fff
}

.copyright_text a {
    font-size: 16px!important
}

.copyright_text a:hover {
    text-decoration: underline;
    color: #f44a40
}

.btn-grey {
    background-color: #d8d8d8;
    color: #FFF
}

.rating-block {
    background-color: #fafafa;
    border: 1px solid #efefef;
    padding: 15px 15px 20px 15px;
    border-radius: 3px;
    clear: both;
    margin-left: 15px;
    display: inline-block
}

.padding-bottom-7 {
    padding-bottom: 7px
}

.review-block {
    background-color: #fafafa;
    border: 1px solid #efefef;
    padding: 15px;
    border-radius: 3px;
    margin-bottom: 30px
}

.review-block-name {
    font-size: 16px;
    margin: 10px 0
}

.review-block-date {
    font-size: 15px;
    font-weight: 500
}

.review-block-rate {
    font-size: 13px;
    margin-bottom: 15px;
    display: flex;
    justify-content: space-between
}

.review-block-title {
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 10px
}

.review-block-description {
    font-size: 13px
}

.rating_text {
    width: 70px;
    line-height: 1
}

.rating_text>div {
    height: 9px;
    margin: 5px 0;
    color: #fff
}

.rating_percentage {
    color: #fff;
    margin-left: 10px
}

.rating_progress {
    width: 180px
}

.rating_progress .progress {
    height: 9px;
    margin: 8px 0
}

.review-block-rate button {
    padding: .20rem .5rem;
    cursor: text!important
}

.review-block-rate button:focus,
.review-block-rate button:active,
.review-block-rate button:visited,
.review-block-rate button:hover {
    outline: 0!important;
    box-shadow: none
}

.review-block .review_logo {
    width: 80px;
    height: 80px;
    border-radius: 50%
}

.page_404 {
    padding: 40px 0;
    background: #fff;
    font-family: 'Arvo', serif
}

.page_404 img {
    width: 100%
}

.four_zero_four_bg {
    background-image: url(https://cdn.dribbble.com/users/285475/screenshots/2083086/dribbble_1.gif);
    height: 400px;
    background-position: center
}

.four_zero_four_bg h1 {
    font-size: 80px
}

.four_zero_four_bg h3 {
    font-size: 80px
}

.link_404 {
    color: #fff!important;
    padding: 10px 20px;
    background: #39ac31;
    margin: 20px 0;
    display: inline-block
}

.contant_box_404 {
    margin-top: -50px
}

.certified_img {
    display: flex;
    margin-bottom: 15px
}

.certified_img img {
    width: 50%
}

.certified_img img:nth-child(1) {
    order: 1
}

.contact-form .genric-btn.info:hover {
    color: #38a4ff
}

.order-section .free-structure {
    margin-top: 30px
}

.profile_dropdown {
    width: 12%;
    min-width: 12%!important;
    right: -8px;
    top: 125px;
    position: fixed!important
}

.profile_dropdown:before {
    right: 47px;
    left: unset!important
}

.profileimg {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    box-shadow: 0 0 6px 3px #fff
}


/* order page css start */

.order_heading {
    color: #3e454c;
    font-size: 26px;
    font-weight: 600;
}

.order-paragraph {
    font-size: 18px;
}

.rc-orderform__step-flag {
    border: 2px solid #38a4ff;
    border-right-width: 0;
    box-sizing: border-box;
    color: #38a4ff;
    cursor: default;
    height: 38px;
    line-height: 34px;
    padding: 0 30.4px 0 5px;
    position: relative;
    -webkit-transition: border-color .7s linear, background .7s linear;
    transition: border-color .7s linear, background .7s linear;
    font-weight: 500;
    display: inline-block;
}

.rc-orderform__step-flag:before {
    right: -2px;
    top: -2px;
    -webkit-transform: skew(-45deg) scaleX(1.2);
    transform: skew(-45deg) scaleX(1.2);
    -webkit-transform-origin: top right;
    transform-origin: top right;
}

.rc-orderform__step-flag:after,
.rc-orderform__step-flag:before {
    background-color: #38a4ff;
    content: "";
    display: block;
    height: 19px;
    position: absolute;
    -webkit-transition: background-color .7s linear;
    transition: background-color .7s linear;
    width: 2px;
}

.rc-orderform__step-flag__count {
    display: inline-block;
    text-align: center;
    width: 25px;
}

.rc-orderform__step-flag:after {
    bottom: -2px;
    right: -2px;
    -webkit-transform: skew(45deg) scaleX(1.2);
    transform: skew(45deg) scaleX(1.2);
    -webkit-transform-origin: bottom right;
    transform-origin: bottom right;
}

.order_form_card {
    margin-left: 15px;
    border-left: 3px dotted #ccc;
    padding-top: 15px;
    padding-left: 20px;
}

.search-select {
    width: 100%;
    height: 38px;
    padding: 0 10px 0 20px;
    line-height: 32px;
    /* background: #56e2c9; */
    color: #495057;
    border: 1px solid #ccc;
    border-radius: 5px;
    font: bold 14px/20px "Arial", sans-serif;
    text-indent: 12px;
    outline: none;
    -webkit-appearance: textfield;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
}

.search-select:after {
    content="/";
    position: absolute;
    right: 0;
}

.ui-autocomplete {
    width: 190px;
    max-height: 180px;
    padding: 0;
    margin: 0;
    overflow-y: auto;
    overflow-x: hidden;
    background: #fff;
    color: #000;
    border-width: 1px;
    border-style: solid;
    border-color: #ccc;
}

.ui-autocomplete ul {
    list-style: none;
}

.ui-autocomplete li {
    height: 36px;
    margin: 0;
    font: bold 14px/36px Arial, Helvetica, sans-serif;
    white-space: nowrap;
    border-bottom: 1px solid #ccc;
}

.ui-autocomplete li a:focus {
    outline: 0;
}

.ui-autocomplete li:hover {
    -moz-transition: background 0.3s ease-in;
    -o-transition: background 0.3s ease-in;
    -webkit-transition: background 0.3s ease-in;
    transition: background 0.3s ease-in;
    background: transparent;
    color: #495057;
}

.ui-autocomplete li a {
    display: block;
    padding: 0 30px;
    cursor: pointer;
    color: #495057;
}

.order_form_card .col-form-label {
    text-align: right;
    color: #000000;
    font-family: "SpaceGrotesk";
}

.order_form_card .select2-container--default .select2-selection--single .select2-selection__rendered {
    background: transparent!important;
    border: 1px solid #ced4da;
    color: #495057;
}

.seach_icon {
    position: absolute;
    left: 24px;
    top: 50%;
    transform: translateY(-50%);
    color: #b7a1a1;
}

.order-acdemic-lvl {
    flex-wrap: nowrap!important;
    align-items: center;
    text-align: center;
    border: 1px solid #ccc;
    border-radius: .25rem;
}

.order-acdemic-lvl .nav-item {
    height: 62px;
    border-right: 1px solid #ccc;
    border-radius: 0;
    width: 100%;
}

.order-acdemic-lvl .nav-item:last-child {
    border-right: 0;
}

.paper_format .nav-link {
    white-space: nowrap;
}

.order-acdemic-lvl .nav-link {
    display: flex;
    align-items: center;
    height: 100%;
    border: 0!important;
    border-radius: 0;
    cursor: pointer;
    padding: 0 11px;
    flex: 1 1 auto;
    justify-content: center;
    word-break: break-word;
}

.order-acdemic-lvl.nav-tabs .nav-item.show .nav-link,
.order-acdemic-lvl.nav-tabs .nav-link.active {
    border-bottom: 1px solid #ccc!important;
    background: #38a4ff;
    color: #fff;
}

.order-acdemic-lvl.paper_format .nav-item {
    height: 40px;
    display: flex;
    flex-basis: 130px;
    flex: 1 1 auto;
}

.term_checkbox {
    display: flex;
    /* align-items: baseline; */
    text-align: left!important;
}

.choose_drop_file .table td:nth-child(1),
.choose_drop_file .table td:nth-child(2) {
    width: 40%;
}

.choose_drop_file .table td:nth-child(3) {
    width: 10%;
}

.checkbox_card {
    padding: 15px 15px 5px;
    background-color: #f5fbff;
    box-shadow: 0 1px 0 #dff1fd;
    margin-bottom: 1rem;
}

.checkbox_card .term_checkbox {
    flex-wrap: wrap;
}

.checkbox_card .term_checkbox p {
    padding-left: 36px;
    width: 100%;
}

.paragrap_hidden {
    margin-top: 0;
    margin-bottom: 0;
    padding-top: 0;
    font-size: 14px;
    line-height: 18px;
    max-height: 0;
    opacity: 0;
    -webkit-transition-property: max-height, opacity, padding-top;
    transition-property: max-height, opacity, padding-top;
    -webkit-transition-duration: .4s, .4s, .4s;
    transition-duration: .4s, .4s, .4s;
    -webkit-transition-timing-function: ease, ease, cubic-bezier(.25, .46, .45, .94);
    transition-timing-function: ease, ease, cubic-bezier(.25, .46, .45, .94);
    -webkit-transition-delay: 0s, 0s, 0s;
    transition-delay: 0s, 0s, 0s;
}

.checkbox_card:hover .paragrap_hidden {
    opacity: .6;
    max-height: 100px;
    padding-top: 4px;
}

.order_form_card .checkbox_card:last-child {
    margin-bottom: 0;
}

.coupan_text {
    border-bottom: 1px dashed;
    white-space: pre;
}

.intl-tel-input {
    width: 100%;
}

.divider {
    display: none;
}

.summary_card {
    background-color: #f0fcff;
    border: 1px solid rgba(0, 0, 100, .09);
    border-radius: 4px;
    box-shadow: 0 5px 15px rgba(0, 0, 100, .1), 0 0 5px rgba(0, 0, 200, .08);
    box-sizing: border-box;
    padding: 20px;
}

.order-topic {
    font-size: 20px;
    font-weight: 700;
    margin: 0 0 5px;
    overflow: hidden;
    text-align: left;
    text-overflow: ellipsis;
}

.order_info {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.choose_drop_file .hide {
    display: none;
}

.choose_drop_file .is-droppable {
    border: 1px dashed #ccc;
    padding: .3rem 1.5rem 1.2rem;
    margin: 0 0 20px;
    background: #fffdf0;
    border-radius: 5px;
}

.choose_drop_file .is-droppable.is-dragover {
    border-color: #999;
    background-color: #e2e2e2;
}

.choose_drop_file .btn--link {
    color: #0079c1;
    padding: 6px 10px;
    cursor: pointer;
    border: 1px solid #ccc;
    margin-bottom: 0;
    background: #fff;
    font-weight: 200;
    font-size: 15px;
    font-family: "SpaceGrotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
}

.choose_drop_file .js .box__file {
    display: none;
}

.choose_drop_file .table td,
.choose_drop_file .table th {
    vertical-align: middle;
    border: 0;
}

.js--remove-file {
    background: transparent;
    font-size: 18px;
}

.order_form_card [type="checkbox"] {
    height: 26px;
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 5;
}

.order_form_card [type="checkbox"]+label {
    cursor: pointer;
    padding: 0;
    position: relative;
}

.order_form_card [type="checkbox"]+label:before {
    background-color: #f7f7f4;
    border: 1px solid #d5d5d5;
    border-radius: 6px;
    content: '';
    display: inline-block;
    height: 24px;
    margin-right: 12px;
    pointer-events: none;
    vertical-align: middle;
    width: 24px;
    flex: none;
}

.order_form_card [type="checkbox"]:hover+label:before {
    border-color: #5c5d70;
}

.order_form_card [type="checkbox"]:focus+label:before {
    border-color: #1baaa0;
    box-shadow: 0 0 0 2px #1baaa0;
}

.order_form_card [type="checkbox"]:checked+label:after {
    color: #0f1031;
    content: '✓';
    display: block;
    font-size: 24px;
    height: 18px;
    left: 3px;
    pointer-events: none;
    position: absolute;
    top: 1px;
    width: 18px;
    z-index: 10;
}

.order_form_card .nice-select {
    width: 100%;
    line-height: 30px;
    padding-left: .75rem;
}

.order_form_card label {
    color: #000;
    font-family: 'SpaceGrotesk';
}


/* order page css end */


/* offer section css start */

.coupan-card {
    border-radius: 10px;
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 30px;
}

.coupan-card .coupon-left {
    width: 30%;
    background-color: #1baaa0;
    padding: 30px 10px;
    min-height: 150px;
    position: relative;
    border-right: 2px dashed #002b44;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
}

.coupan-card .coupon-left:before {
    content: '';
    position: absolute;
    top: -30px;
    display: block;
    right: -26px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: 25px solid #fff;
    clip: rect(auto, auto, 209px, auto);
    z-index: 1;
}

.coupan-card .coupon-left:after {
    content: '';
    position: absolute;
    bottom: -30px;
    display: block;
    right: -26px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: 25px solid #fff;
    clip: rect(auto, auto, 209px, auto);
    z-index: 1;
}

.coupan-card .coupon-left svg {
    width: 22px;
    position: absolute;
    right: -12px;
    bottom: 41px;
}

.coupan-card .coupon-left h4 {
    font-size: 44px;
    color: #fff;
}

.coupan-card .coupon-left h6 {
    font-size: 30px;
    color: #fff;
}

.coupan-card .coupon-con {
    width: 70%;
    background-color: #cccccc1f;
    padding: 20px 30px;
    min-height: 150px;
    position: relative;
    z-index: 0;
}

.coupan-card .coupon-con .btn-offer {
    padding: 8px 20px;
    cursor: pointer;
    float: right;
}

.coupan-card .coupon-con .coupan_code {
    border: 1px dashed #ccc;
    padding: 5px;
    margin: 10px 0;
    text-align: center;
    background: #cccccc3b;
}

.coupan_code p {
    margin-bottom: 0;
}


/*offer section css end  */


/* payment page css start */

.payment {
    color: #fff;
    font-family: 'Ubuntu', sans-serif;
    text-align: center;
    width: 210px;
    padding: 0 0 77px;
    margin: 0 auto;
    border-radius: 20px 20px 0 0;
    overflow: hidden;
    position: relative;
    z-index: 1;
}

.payment:before {
    content: "";
    background: #1baaa0;
    width: 200px;
    height: 200px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5) inset;
    border-radius: 0 0 72px;
    transform: translateX(-50%) rotate(45deg);
    position: absolute;
    bottom: 12px;
    left: 50%;
    z-index: -1;
}

.payment .payment-content {
    background-color: #1baaa0;
    padding: 15px 10px 15px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}

.payment h3 {
    font-size: 20px;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0 0 5px 0;
    color: #fff;
}

.payment .payment-value {
    font-size: 30px;
    font-weight: 600;
}

.payment:hover .payment-value {
    text-shadow: 0 0 4px rgba(0, 0, 0, 0.5)
}

.payment .payment-icon {
    color: #16C2CE;
    background: #fff;
    font-size: 33px;
    line-height: 56px;
    width: 55px;
    height: 55px;
    border-radius: 50%;
    transform: translateX(-50%);
    position: absolute;
    bottom: 12px;
    left: 50%;
    transition: all 0.3s;
}

.payment:hover .payment-icon {
    transform: translateX(-50%) rotateY(360deg);
}

.payment.red:before {
    background: #002b44;
}

.payment.red .payment-content {
    background: #002b44;
}

.payment.red .payment-icon {
    color: #F54454;
}

.payment.blue:before {
    background: #105670;
}

.payment.blue .payment-content {
    background: #115E8C;
}

.payment.blue .payment-icon {
    color: #115E8C;
}

.payment.orange:before {
    background: #E87D2D;
}

.payment.orange .payment-content {
    background: #FA902A;
}

.payment.orange .payment-icon {
    color: #FA902A;
}

@media screen and (max-width:990px) {
    .payment {
        margin-bottom: 30px;
    }
}

.amount_info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 0 15px;
}

.amount_info h5 {
    font-size: 20px;
}

.table_order_summary td,
.table_order_summary th {
    padding: 5px 0;
    border-top: 0;
    border-bottom: 1px solid #dee2e6;
    font-family: "SpaceGrotesk";
}

.table_order_summary td:nth-child(2) {
    padding: 5px 10px 5px 5px !important;
}


/* payment page css end */


/* assignment css start */

.assignment_div .badge {
    background-color: red;
    position: absolute;
    top: 4px;
    border-radius: 50%;
    color: #fff;
}

.assignment_div small {
    line-height: 1 !important;
    letter-spacing: initial;
}

.assignment_div .subject-name {
    font-size: 18px;
}

.assignment_div .deadline-text {
    font-size: 14px;
}

.assignment_div .btn_div_assignment {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.assignment_div .price-assignment {
    font-size: 22px;
    position: relative;
    top: 3px;
}

.assignment_div .assignment_info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: 0 -8px;
}

.assignment_div .assignment_info li {
    font-size: 14px;
    padding: 0 8px;
    position: relative;
    list-style: none;
}

.assignment_div .assignment_info li::after {
    content: "/";
    opacity: .7;
    position: absolute;
    right: -3px;
    line-height: 27px;
}

.assignment_div .tab-content .card_style:after {
    content: "";
    background: url(../img/sprite.svg) no-repeat -567px -591px;
    width: 86px;
    height: 64px;
    position: absolute;
    z-index: 3;
    right: 12px;
    bottom: 0px;
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
    opacity: .2;
}

.assignment_div .tab-content .card_style p {
    line-height: 1;
    margin-bottom: 1rem;
}

.card_style {
    color: #444;
    /* background: -webkit-gradient(linear, left bottom, right top, color-stop(49%, #f9f9f9), color-stop(50%, #f1f1f1));
    background: linear-gradient(to top right, #f9f9f9 49%, #f1f1f1 50%); */
    background: #f9f9f9;
    font-size: 17px;
    letter-spacing: 1px;
    line-height: 30px;
    padding: 25px 20px;
    -webkit-box-shadow: 0 0 10px -5px rgba(0, 0, 0, 0.5);
    box-shadow: 0 0 10px -5px rgba(0, 0, 0, 0.5);
    position: relative;
    border-radius: 10px;
}

.breadcrumb {
    background-color: transparent;
    border-radius: 3px;
    // box-shadow: 0 0 0 2px #fff;
    display: flex;
    font-size: 12px;
    padding: 0;
    margin-bottom: 0;
}

.breadcrumb li {
    color: #fff;
    flex: 1 0;
    line-height: 36px;
    margin-right: 2px;
    padding: 0 14px;
    position: relative;
    text-align: center;
    text-shadow: 0 1px 0 hsla(0, 0%, 100%, .8);
    white-space: nowrap;
    z-index: 1;
    font-size: 14px;
    font-weight: 400;
}

.breadcrumb li:before {
    top: 0;
    -webkit-transform: skewX(30deg);
    transform: skewX(30deg);
}

.breadcrumb li:after {
    bottom: 0;
    -webkit-transform: skewX(-30deg);
    transform: skewX(-30deg);
}

.breadcrumb li:after,
.breadcrumb li:before {
    background-color: #8c32f699;
    box-sizing: border-box;
    content: " ";
    display: block;
    height: 50%;
    left: 0;
    position: absolute;
    right: 4px;
    z-index: -1;
}

.breadcrumb li.active {
    color: #fff;
}

.breadcrumb li.active:after,
.breadcrumb li.active:before {
    background-color: #fcb316;
}

.btn-assignment {
    background-color: #1baaa024;
    border: 1px solid rgba(74, 90, 182, 0.1);
    border-radius: 3px;
    color: #007eff;
    cursor: pointer;
    font-size: 14px;
    margin: 3px 5px 3px 0;
    padding: 6px 12px;
    font-family: inherit;
    line-height: 120%;
    -webkit-transition: border-color .2s;
    transition: border-color .2s;
}

.btn-assignment:hover {
    -webkit-transform: none;
    transform: none;
}

.btn-assignment img {
    width: 15px;
}

.btn-cancle {
    color: rgba(210, 84, 69, 0.8);
    background-color: #1baaa024;
    border: 1px solid rgba(210, 84, 69, 0.4);
    border-radius: 3px;
    cursor: pointer;
    font-size: 14px;
    margin: 3px 5px 3px 0;
    padding: 6px 12px;
    font-family: inherit;
    line-height: 120%;
    -webkit-transition: border-color .2s;
    transition: border-color .2s;
}

.btn-cancle:hover {
    -webkit-transform: none;
    transform: none;
}

.btn-cancle img {
    width: 15px;
}

.alert-custom {
    color: #fff;
    background-color: #8c32f6;
    border-color: #8c32f6;
}

.nav_tab_style_assignment {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.nav_tab_assignment,
.nav_tab_assignment:hover,
.nav_tab_assignment li,
.nav_tab_assignment li:hover,
.nav_tab_assignment li a {
    border: 0!important;
}

.nav_tab_assignment li a.active {
    border-bottom: 4px solid #8442ab !important;
}

.nav_tab_assignment li a {
    font-size: 16px;
    font-weight: 600;
    text-transform: uppercase;
    padding: 10px 30px;
}

.nav_tab_assignment li a.active {
    color: #8442ab;
}

.msger {
    display: flex;
    flex-flow: column wrap;
    justify-content: center;
    width: 100%;
    max-width: 100%;
    margin: 25px 10px;
    height: calc(100% - 50px);
    border: 2px solid #ddd;
    border-radius: 5px;
    background: #fff;
    box-shadow: 0 15px 15px -5px rgba(0, 0, 0, 0.2);
}

.msger-header {
    display: flex;
    justify-content: space-between;
    padding: 10px;
    border-bottom: 2px solid #ddd;
    background: #eee;
    color: #666;
}

.msger-chat {
    flex: 1;
    overflow-y: auto;
    padding: 10px;
}

.msger-chat::-webkit-scrollbar {
    width: 6px;
}

.msger-chat::-webkit-scrollbar-track {
    background: #ddd;
}

.msger-chat::-webkit-scrollbar-thumb {
    background: #bdbdbd;
}

.msg {
    display: flex;
    align-items: flex-end;
    margin-bottom: 10px;
}

.msg:last-of-type {
    margin: 0;
}

.msg-img {
    width: 50px;
    height: 50px;
    margin-right: 10px;
    background: #ddd;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    border-radius: 50%;
}

.msg-bubble {
    max-width: 450px;
    padding: 15px;
    border-radius: 15px;
    background: #ececec;
}

.msg-info {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
}

.msg-info-name {
    margin-right: 10px;
    font-weight: bold;
}

.msg-info-time {
    font-size: 0.85em;
}

.left-msg .msg-bubble {
    border-bottom-left-radius: 0;
}

.right-msg {
    flex-direction: row-reverse;
}

.right-msg .msg-bubble {
    background: #579ffb;
    color: #fff;
    border-bottom-right-radius: 0;
}

.right-msg .msg-img {
    margin: 0 0 0 10px;
}

.msger-inputarea {
    display: flex;
    padding: 10px;
    border-top: 2px solid #ddd;
    background: #eee;
}

.msger-inputarea * {
    padding: 10px;
    border: none;
    border-radius: 3px;
    font-size: 1em;
}

.msger-input {
    flex: 1;
    background: #ddd;
}

.msger-send-btn {
    margin-left: 10px;
    background: rgb(0, 196, 65);
    color: #fff;
    font-weight: bold;
    cursor: pointer;
    transition: background 0.23s;
}

.msger-send-btn:hover {
    background: rgb(0, 180, 50);
}

.msger-chat {
    background-color: #fcfcfe;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260' viewBox='0 0 260 260'%3E%3Cg fill-rule='evenodd'%3E%3Cg fill='%23dddddd' fill-opacity='0.4'%3E%3Cpath d='M24.37 16c.2.65.39 1.32.54 2H21.17l1.17 2.34.45.9-.24.11V28a5 5 0 0 1-2.23 8.94l-.02.06a8 8 0 0 1-7.75 6h-20a8 8 0 0 1-7.74-6l-.02-.06A5 5 0 0 1-17.45 28v-6.76l-.79-1.58-.44-.9.9-.44.63-.32H-20a23.01 23.01 0 0 1 44.37-2zm-36.82 2a1 1 0 0 0-.44.1l-3.1 1.56.89 1.79 1.31-.66a3 3 0 0 1 2.69 0l2.2 1.1a1 1 0 0 0 .9 0l2.21-1.1a3 3 0 0 1 2.69 0l2.2 1.1a1 1 0 0 0 .9 0l2.21-1.1a3 3 0 0 1 2.69 0l2.2 1.1a1 1 0 0 0 .86.02l2.88-1.27a3 3 0 0 1 2.43 0l2.88 1.27a1 1 0 0 0 .85-.02l3.1-1.55-.89-1.79-1.42.71a3 3 0 0 1-2.56.06l-2.77-1.23a1 1 0 0 0-.4-.09h-.01a1 1 0 0 0-.4.09l-2.78 1.23a3 3 0 0 1-2.56-.06l-2.3-1.15a1 1 0 0 0-.45-.11h-.01a1 1 0 0 0-.44.1L.9 19.22a3 3 0 0 1-2.69 0l-2.2-1.1a1 1 0 0 0-.45-.11h-.01a1 1 0 0 0-.44.1l-2.21 1.11a3 3 0 0 1-2.69 0l-2.2-1.1a1 1 0 0 0-.45-.11h-.01zm0-2h-4.9a21.01 21.01 0 0 1 39.61 0h-2.09l-.06-.13-.26.13h-32.31zm30.35 7.68l1.36-.68h1.3v2h-36v-1.15l.34-.17 1.36-.68h2.59l1.36.68a3 3 0 0 0 2.69 0l1.36-.68h2.59l1.36.68a3 3 0 0 0 2.69 0L2.26 23h2.59l1.36.68a3 3 0 0 0 2.56.06l1.67-.74h3.23l1.67.74a3 3 0 0 0 2.56-.06zM-13.82 27l16.37 4.91L18.93 27h-32.75zm-.63 2h.34l16.66 5 16.67-5h.33a3 3 0 1 1 0 6h-34a3 3 0 1 1 0-6zm1.35 8a6 6 0 0 0 5.65 4h20a6 6 0 0 0 5.66-4H-13.1z'/%3E%3Cpath id='path6_fill-copy' d='M284.37 16c.2.65.39 1.32.54 2H281.17l1.17 2.34.45.9-.24.11V28a5 5 0 0 1-2.23 8.94l-.02.06a8 8 0 0 1-7.75 6h-20a8 8 0 0 1-7.74-6l-.02-.06a5 5 0 0 1-2.24-8.94v-6.76l-.79-1.58-.44-.9.9-.44.63-.32H240a23.01 23.01 0 0 1 44.37-2zm-36.82 2a1 1 0 0 0-.44.1l-3.1 1.56.89 1.79 1.31-.66a3 3 0 0 1 2.69 0l2.2 1.1a1 1 0 0 0 .9 0l2.21-1.1a3 3 0 0 1 2.69 0l2.2 1.1a1 1 0 0 0 .9 0l2.21-1.1a3 3 0 0 1 2.69 0l2.2 1.1a1 1 0 0 0 .86.02l2.88-1.27a3 3 0 0 1 2.43 0l2.88 1.27a1 1 0 0 0 .85-.02l3.1-1.55-.89-1.79-1.42.71a3 3 0 0 1-2.56.06l-2.77-1.23a1 1 0 0 0-.4-.09h-.01a1 1 0 0 0-.4.09l-2.78 1.23a3 3 0 0 1-2.56-.06l-2.3-1.15a1 1 0 0 0-.45-.11h-.01a1 1 0 0 0-.44.1l-2.21 1.11a3 3 0 0 1-2.69 0l-2.2-1.1a1 1 0 0 0-.45-.11h-.01a1 1 0 0 0-.44.1l-2.21 1.11a3 3 0 0 1-2.69 0l-2.2-1.1a1 1 0 0 0-.45-.11h-.01zm0-2h-4.9a21.01 21.01 0 0 1 39.61 0h-2.09l-.06-.13-.26.13h-32.31zm30.35 7.68l1.36-.68h1.3v2h-36v-1.15l.34-.17 1.36-.68h2.59l1.36.68a3 3 0 0 0 2.69 0l1.36-.68h2.59l1.36.68a3 3 0 0 0 2.69 0l1.36-.68h2.59l1.36.68a3 3 0 0 0 2.56.06l1.67-.74h3.23l1.67.74a3 3 0 0 0 2.56-.06zM246.18 27l16.37 4.91L278.93 27h-32.75zm-.63 2h.34l16.66 5 16.67-5h.33a3 3 0 1 1 0 6h-34a3 3 0 1 1 0-6zm1.35 8a6 6 0 0 0 5.65 4h20a6 6 0 0 0 5.66-4H246.9z'/%3E%3Cpath d='M159.5 21.02A9 9 0 0 0 151 15h-42a9 9 0 0 0-8.5 6.02 6 6 0 0 0 .02 11.96A8.99 8.99 0 0 0 109 45h42a9 9 0 0 0 8.48-12.02 6 6 0 0 0 .02-11.96zM151 17h-42a7 7 0 0 0-6.33 4h54.66a7 7 0 0 0-6.33-4zm-9.34 26a8.98 8.98 0 0 0 3.34-7h-2a7 7 0 0 1-7 7h-4.34a8.98 8.98 0 0 0 3.34-7h-2a7 7 0 0 1-7 7h-4.34a8.98 8.98 0 0 0 3.34-7h-2a7 7 0 0 1-7 7h-7a7 7 0 1 1 0-14h42a7 7 0 1 1 0 14h-9.34zM109 27a9 9 0 0 0-7.48 4H101a4 4 0 1 1 0-8h58a4 4 0 0 1 0 8h-.52a9 9 0 0 0-7.48-4h-42z'/%3E%3Cpath d='M39 115a8 8 0 1 0 0-16 8 8 0 0 0 0 16zm6-8a6 6 0 1 1-12 0 6 6 0 0 1 12 0zm-3-29v-2h8v-6H40a4 4 0 0 0-4 4v10H22l-1.33 4-.67 2h2.19L26 130h26l3.81-40H58l-.67-2L56 84H42v-6zm-4-4v10h2V74h8v-2h-8a2 2 0 0 0-2 2zm2 12h14.56l.67 2H22.77l.67-2H40zm13.8 4H24.2l3.62 38h22.36l3.62-38z'/%3E%3Cpath d='M129 92h-6v4h-6v4h-6v14h-3l.24 2 3.76 32h36l3.76-32 .24-2h-3v-14h-6v-4h-6v-4h-8zm18 22v-12h-4v4h3v8h1zm-3 0v-6h-4v6h4zm-6 6v-16h-4v19.17c1.6-.7 2.97-1.8 4-3.17zm-6 3.8V100h-4v23.8a10.04 10.04 0 0 0 4 0zm-6-.63V104h-4v16a10.04 10.04 0 0 0 4 3.17zm-6-9.17v-6h-4v6h4zm-6 0v-8h3v-4h-4v12h1zm27-12v-4h-4v4h3v4h1v-4zm-6 0v-8h-4v4h3v4h1zm-6-4v-4h-4v8h1v-4h3zm-6 4v-4h-4v8h1v-4h3zm7 24a12 12 0 0 0 11.83-10h7.92l-3.53 30h-32.44l-3.53-30h7.92A12 12 0 0 0 130 126z'/%3E%3Cpath d='M212 86v2h-4v-2h4zm4 0h-2v2h2v-2zm-20 0v.1a5 5 0 0 0-.56 9.65l.06.25 1.12 4.48a2 2 0 0 0 1.94 1.52h.01l7.02 24.55a2 2 0 0 0 1.92 1.45h4.98a2 2 0 0 0 1.92-1.45l7.02-24.55a2 2 0 0 0 1.95-1.52L224.5 96l.06-.25a5 5 0 0 0-.56-9.65V86a14 14 0 0 0-28 0zm4 0h6v2h-9a3 3 0 1 0 0 6H223a3 3 0 1 0 0-6H220v-2h2a12 12 0 1 0-24 0h2zm-1.44 14l-1-4h24.88l-1 4h-22.88zm8.95 26l-6.86-24h18.7l-6.86 24h-4.98zM150 242a22 22 0 1 0 0-44 22 22 0 0 0 0 44zm24-22a24 24 0 1 1-48 0 24 24 0 0 1 48 0zm-28.38 17.73l2.04-.87a6 6 0 0 1 4.68 0l2.04.87a2 2 0 0 0 2.5-.82l1.14-1.9a6 6 0 0 1 3.79-2.75l2.15-.5a2 2 0 0 0 1.54-2.12l-.19-2.2a6 6 0 0 1 1.45-4.46l1.45-1.67a2 2 0 0 0 0-2.62l-1.45-1.67a6 6 0 0 1-1.45-4.46l.2-2.2a2 2 0 0 0-1.55-2.13l-2.15-.5a6 6 0 0 1-3.8-2.75l-1.13-1.9a2 2 0 0 0-2.5-.8l-2.04.86a6 6 0 0 1-4.68 0l-2.04-.87a2 2 0 0 0-2.5.82l-1.14 1.9a6 6 0 0 1-3.79 2.75l-2.15.5a2 2 0 0 0-1.54 2.12l.19 2.2a6 6 0 0 1-1.45 4.46l-1.45 1.67a2 2 0 0 0 0 2.62l1.45 1.67a6 6 0 0 1 1.45 4.46l-.2 2.2a2 2 0 0 0 1.55 2.13l2.15.5a6 6 0 0 1 3.8 2.75l1.13 1.9a2 2 0 0 0 2.5.8zm2.82.97a4 4 0 0 1 3.12 0l2.04.87a4 4 0 0 0 4.99-1.62l1.14-1.9a4 4 0 0 1 2.53-1.84l2.15-.5a4 4 0 0 0 3.09-4.24l-.2-2.2a4 4 0 0 1 .97-2.98l1.45-1.67a4 4 0 0 0 0-5.24l-1.45-1.67a4 4 0 0 1-.97-2.97l.2-2.2a4 4 0 0 0-3.09-4.25l-2.15-.5a4 4 0 0 1-2.53-1.84l-1.14-1.9a4 4 0 0 0-5-1.62l-2.03.87a4 4 0 0 1-3.12 0l-2.04-.87a4 4 0 0 0-4.99 1.62l-1.14 1.9a4 4 0 0 1-2.53 1.84l-2.15.5a4 4 0 0 0-3.09 4.24l.2 2.2a4 4 0 0 1-.97 2.98l-1.45 1.67a4 4 0 0 0 0 5.24l1.45 1.67a4 4 0 0 1 .97 2.97l-.2 2.2a4 4 0 0 0 3.09 4.25l2.15.5a4 4 0 0 1 2.53 1.84l1.14 1.9a4 4 0 0 0 5 1.62l2.03-.87zM152 207a1 1 0 1 1 2 0 1 1 0 0 1-2 0zm6 2a1 1 0 1 1 2 0 1 1 0 0 1-2 0zm-11 1a1 1 0 1 1 2 0 1 1 0 0 1-2 0zm-6 0a1 1 0 1 1 2 0 1 1 0 0 1-2 0zm3-5a1 1 0 1 1 2 0 1 1 0 0 1-2 0zm-8 8a1 1 0 1 1 2 0 1 1 0 0 1-2 0zm3 6a1 1 0 1 1 2 0 1 1 0 0 1-2 0zm0 6a1 1 0 1 1 2 0 1 1 0 0 1-2 0zm4 7a1 1 0 1 1 2 0 1 1 0 0 1-2 0zm5-2a1 1 0 1 1 2 0 1 1 0 0 1-2 0zm5 4a1 1 0 1 1 2 0 1 1 0 0 1-2 0zm4-6a1 1 0 1 1 2 0 1 1 0 0 1-2 0zm6-4a1 1 0 1 1 2 0 1 1 0 0 1-2 0zm-4-3a1 1 0 1 1 2 0 1 1 0 0 1-2 0zm4-3a1 1 0 1 1 2 0 1 1 0 0 1-2 0zm-5-4a1 1 0 1 1 2 0 1 1 0 0 1-2 0zm-24 6a1 1 0 1 1 2 0 1 1 0 0 1-2 0zm16 5a5 5 0 1 0 0-10 5 5 0 0 0 0 10zm7-5a7 7 0 1 1-14 0 7 7 0 0 1 14 0zm86-29a1 1 0 0 0 0 2h2a1 1 0 0 0 0-2h-2zm19 9a1 1 0 0 1 1-1h2a1 1 0 0 1 0 2h-2a1 1 0 0 1-1-1zm-14 5a1 1 0 0 0 0 2h2a1 1 0 0 0 0-2h-2zm-25 1a1 1 0 0 0 0 2h2a1 1 0 0 0 0-2h-2zm5 4a1 1 0 0 0 0 2h2a1 1 0 0 0 0-2h-2zm9 0a1 1 0 0 1 1-1h2a1 1 0 0 1 0 2h-2a1 1 0 0 1-1-1zm15 1a1 1 0 0 1 1-1h2a1 1 0 0 1 0 2h-2a1 1 0 0 1-1-1zm12-2a1 1 0 0 0 0 2h2a1 1 0 0 0 0-2h-2zm-11-14a1 1 0 0 1 1-1h2a1 1 0 0 1 0 2h-2a1 1 0 0 1-1-1zm-19 0a1 1 0 0 0 0 2h2a1 1 0 0 0 0-2h-2zm6 5a1 1 0 0 1 1-1h2a1 1 0 0 1 0 2h-2a1 1 0 0 1-1-1zm-25 15c0-.47.01-.94.03-1.4a5 5 0 0 1-1.7-8 3.99 3.99 0 0 1 1.88-5.18 5 5 0 0 1 3.4-6.22 3 3 0 0 1 1.46-1.05 5 5 0 0 1 7.76-3.27A30.86 30.86 0 0 1 246 184c6.79 0 13.06 2.18 18.17 5.88a5 5 0 0 1 7.76 3.27 3 3 0 0 1 1.47 1.05 5 5 0 0 1 3.4 6.22 4 4 0 0 1 1.87 5.18 4.98 4.98 0 0 1-1.7 8c.02.46.03.93.03 1.4v1h-62v-1zm.83-7.17a30.9 30.9 0 0 0-.62 3.57 3 3 0 0 1-.61-4.2c.37.28.78.49 1.23.63zm1.49-4.61c-.36.87-.68 1.76-.96 2.68a2 2 0 0 1-.21-3.71c.33.4.73.75 1.17 1.03zm2.32-4.54c-.54.86-1.03 1.76-1.49 2.68a3 3 0 0 1-.07-4.67 3 3 0 0 0 1.56 1.99zm1.14-1.7c.35-.5.72-.98 1.1-1.46a1 1 0 1 0-1.1 1.45zm5.34-5.77c-1.03.86-2 1.79-2.9 2.77a3 3 0 0 0-1.11-.77 3 3 0 0 1 4-2zm42.66 2.77c-.9-.98-1.87-1.9-2.9-2.77a3 3 0 0 1 4.01 2 3 3 0 0 0-1.1.77zm1.34 1.54c.38.48.75.96 1.1 1.45a1 1 0 1 0-1.1-1.45zm3.73 5.84c-.46-.92-.95-1.82-1.5-2.68a3 3 0 0 0 1.57-1.99 3 3 0 0 1-.07 4.67zm1.8 4.53c-.29-.9-.6-1.8-.97-2.67.44-.28.84-.63 1.17-1.03a2 2 0 0 1-.2 3.7zm1.14 5.51c-.14-1.21-.35-2.4-.62-3.57.45-.14.86-.35 1.23-.63a2.99 2.99 0 0 1-.6 4.2zM275 214a29 29 0 0 0-57.97 0h57.96zM72.33 198.12c-.21-.32-.34-.7-.34-1.12v-12h-2v12a4.01 4.01 0 0 0 7.09 2.54c.57-.69.91-1.57.91-2.54v-12h-2v12a1.99 1.99 0 0 1-2 2 2 2 0 0 1-1.66-.88zM75 176c.38 0 .74-.04 1.1-.12a4 4 0 0 0 6.19 2.4A13.94 13.94 0 0 1 84 185v24a6 6 0 0 1-6 6h-3v9a5 5 0 1 1-10 0v-9h-3a6 6 0 0 1-6-6v-24a14 14 0 0 1 14-14 5 5 0 0 0 5 5zm-17 15v12a1.99 1.99 0 0 0 1.22 1.84 2 2 0 0 0 2.44-.72c.21-.32.34-.7.34-1.12v-12h2v12a3.98 3.98 0 0 1-5.35 3.77 3.98 3.98 0 0 1-.65-.3V209a4 4 0 0 0 4 4h16a4 4 0 0 0 4-4v-24c.01-1.53-.23-2.88-.72-4.17-.43.1-.87.16-1.28.17a6 6 0 0 1-5.2-3 7 7 0 0 1-6.47-4.88A12 12 0 0 0 58 185v6zm9 24v9a3 3 0 1 0 6 0v-9h-6z'/%3E%3Cpath d='M-17 191a1 1 0 0 0 0 2h2a1 1 0 0 0 0-2h-2zm19 9a1 1 0 0 1 1-1h2a1 1 0 0 1 0 2H3a1 1 0 0 1-1-1zm-14 5a1 1 0 0 0 0 2h2a1 1 0 0 0 0-2h-2zm-25 1a1 1 0 0 0 0 2h2a1 1 0 0 0 0-2h-2zm5 4a1 1 0 0 0 0 2h2a1 1 0 0 0 0-2h-2zm9 0a1 1 0 0 1 1-1h2a1 1 0 0 1 0 2h-2a1 1 0 0 1-1-1zm15 1a1 1 0 0 1 1-1h2a1 1 0 0 1 0 2h-2a1 1 0 0 1-1-1zm12-2a1 1 0 0 0 0 2h2a1 1 0 0 0 0-2H4zm-11-14a1 1 0 0 1 1-1h2a1 1 0 0 1 0 2h-2a1 1 0 0 1-1-1zm-19 0a1 1 0 0 0 0 2h2a1 1 0 0 0 0-2h-2zm6 5a1 1 0 0 1 1-1h2a1 1 0 0 1 0 2h-2a1 1 0 0 1-1-1zm-25 15c0-.47.01-.94.03-1.4a5 5 0 0 1-1.7-8 3.99 3.99 0 0 1 1.88-5.18 5 5 0 0 1 3.4-6.22 3 3 0 0 1 1.46-1.05 5 5 0 0 1 7.76-3.27A30.86 30.86 0 0 1-14 184c6.79 0 13.06 2.18 18.17 5.88a5 5 0 0 1 7.76 3.27 3 3 0 0 1 1.47 1.05 5 5 0 0 1 3.4 6.22 4 4 0 0 1 1.87 5.18 4.98 4.98 0 0 1-1.7 8c.02.46.03.93.03 1.4v1h-62v-1zm.83-7.17a30.9 30.9 0 0 0-.62 3.57 3 3 0 0 1-.61-4.2c.37.28.78.49 1.23.63zm1.49-4.61c-.36.87-.68 1.76-.96 2.68a2 2 0 0 1-.21-3.71c.33.4.73.75 1.17 1.03zm2.32-4.54c-.54.86-1.03 1.76-1.49 2.68a3 3 0 0 1-.07-4.67 3 3 0 0 0 1.56 1.99zm1.14-1.7c.35-.5.72-.98 1.1-1.46a1 1 0 1 0-1.1 1.45zm5.34-5.77c-1.03.86-2 1.79-2.9 2.77a3 3 0 0 0-1.11-.77 3 3 0 0 1 4-2zm42.66 2.77c-.9-.98-1.87-1.9-2.9-2.77a3 3 0 0 1 4.01 2 3 3 0 0 0-1.1.77zm1.34 1.54c.38.48.75.96 1.1 1.45a1 1 0 1 0-1.1-1.45zm3.73 5.84c-.46-.92-.95-1.82-1.5-2.68a3 3 0 0 0 1.57-1.99 3 3 0 0 1-.07 4.67zm1.8 4.53c-.29-.9-.6-1.8-.97-2.67.44-.28.84-.63 1.17-1.03a2 2 0 0 1-.2 3.7zm1.14 5.51c-.14-1.21-.35-2.4-.62-3.57.45-.14.86-.35 1.23-.63a2.99 2.99 0 0 1-.6 4.2zM15 214a29 29 0 0 0-57.97 0h57.96z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}

.transform-none:hover {
    transform: scale(1)!important;
}

.btn-chat {
    background: #8442ab;
    color: #fff;
}

.btn-chat:hover {
    transform: none;
    background: #1BAAA0!important;
    color: #fff!important;
}

.admin_file_div {
    padding: 30px;
    background: #cccccc2e;
    border-radius: 10px;
}

.assignment_files {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
}

.assignment_files li {
    text-align: center;
    width: 150px;
    list-style: none;
}

.assignment_files li i {
    font-size: 60px;
}

.form-group-custom {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.form-group-custom .form-control {
    border-radius: 0;
    height: 50px;
    /* border: 0; */
}

.form-group-custom .nice-select.open .list {
    width: 100%;
}

.form-group-custom .nice-select {
    width: 28%;
    background: #002b44;
    color: #fff;
    height: 50px;
    line-height: 39px;
    text-align: center!important;
    font-size: 18px;
    border: 1px solid #002b44;
}

.form-group-custom .nice-select .option {
    color: #333;
}

.form-group-custom select.form-control,
.form-group-custom .bonus_price {
    width: 30%;
    background: #002b44;
    color: #fff;
    height: 50px;
    line-height: 50px;
    text-align: center;
    border: 1px solid #002b44;
}

.form-group-custom select.form-control label,
.form-group-custom .bonus_price label {
    font-size: 1rem;
}

.mywallet_offer {
    padding: 30px;
}

.mywallet_offer h4 {
    font-size: 20px;
    color: #000;
    border-left: 2px solid #000;
    padding-left: 20px;
}

.form-group-custom .nice-select:after {
    border-bottom: 2px solid #fff;
    border-right: 2px solid #fff;
    width: 9px;
    height: 9px;
}


/*assignment css end  */

.info-card-assg {
    color: #EB4700;
    font-family: 'Source Sans Pro', sans-serif;
    text-align: center;
    width: 210px;
    margin: 0 auto;
    position: relative;
    z-index: 1;
}

.info-card-assg .info-card-assg-icon {
    color: #fff;
    background-color: #fff;
    font-size: 40px;
    line-height: 70px;
    height: 70px;
    width: 70px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
    border-radius: 50%;
    transform: translateY(-50%);
    position: absolute;
    left: 0;
    top: 50%;
    z-index: 1;
}

.info-card-assg-icon img {
    width: 38px;
}

.info-card-assg .info-card-assg-content {
    background: radial-gradient(#e9e9e9, #fff, #e9e9e9, #fff);
    min-height: 140px;
    padding: 20px 10px 5px 80px;
    border-radius: 30px;
    -webkit-clip-path: polygon(50% 0, 100% 0, 100% 100%, 50% 100%, 0 50%);
    clip-path: polygon(50% 0, 100% 0, 100% 100%, 50% 100%, 0 50%);
}

.info-card-assg .info-card-assg-value {
    font-size: 40px;
    font-weight: 700;
    line-height: 50px;
    display: block;
    transition: all 0.3s;
}

.info-card-assg:hover .info-card-assg-value {
    text-shadow: 0 0 5px #fff;
}

.info-card-assg h3 {
    font-size: 17px;
    font-weight: 600;
    letter-spacing: 1px;
    text-transform: uppercase;
    margin: 0;
    transition: all 0.3s;
}

.info-card-assg:hover h3 {
    transform: rotateX(360deg);
}

.info-card-assg.blue {
    color: #01D1D4;
}

.info-card-assg.blue .info-card-assg-icon {
    background-color: #01D1D4;
}

.info-card-assg.yellow {
    color: #FEB900;
}

.info-card-assg.yellow .info-card-assg-icon {
    background-color: #FEB900;
}

.info-card-assg.purple {
    color: #d327f9;
}

.info-card-assg.purple .info-card-assg-icon {
    background-color: #d327f9;
}

@media screen and (max-width:990px) {
    .info-card-assg {
        margin-bottom: 40px;
    }
}

.sticky_style {
    position: -webkit-sticky;
    position: sticky;
    top: 130px;
}

.top_nav {
    padding: 9px 0;
    box-shadow: 0 0 6px 1px #fff;
    background: #fff;
}

.top_nav ul li:first-child {
    margin-left: 0;
}

.top_nav ul li {
    margin: 0 15px;
    display: flex;
    align-items: center;
}

.top_nav ul li a {
    font-size: 15px;
    color: #7e41ae!important;
}

.top_nav ul li a i {
    color: #7e41ae;
    font-size: 18px;
}

.top_nav ul li a i.fa-whatsapp {
    color: #fff;
}

.top_nav ul li .whatsapp_btn {
    background: green;
    padding: 5px 20px!important;
    border-radius: 17px;
    color: #fff!important;
}

.top_nav ul li a.referearnbtn {
    background: #f44a40;
    padding: 5px 20px!important;
    border-radius: 17px;
    color: #fff!important;
}

.top_nav .rating-stars .fa {
    color: #7e41ae;
}

.home-banner-area .row.justify-content-center {
    height: 600px!important;
}

.modal_label {
    color: #333;
    text-align: left!important;
    width: 100%;
    font-family: "SpaceGrotesk";
}

.new_icon {
    margin-top: -20px;
    margin-left: -8px;
}