/* ----------------------------------

Template Name: OSP Blue
Description: SMM Panel Themes
Version: v1
Author: OSPDev - OwnSMMPanel.in

------------------------------------- */

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600;700;800;900&display=swap');

body {
    font-family: Poppins, sans-serif;
    background: #f5f5f5;
    color: #071828!important;
    padding: 0;
    margin: 0;
    overflow-x: hidden!important
}

.p0 {
    padding-left: 0;
    padding-right: 0
}

.align-items-center{
    -ms-flex-align:center!important;
    align-items:center!important
}

.justify-content-center {
    -webkit-box-pack: center!important;
    -ms-flex-pack: center!important;
    justify-content: center!important;
}

.btn-rounded {
    border: 2px solid #fff!important;
    border-radius: 30px!important
}

.btn-rounded:hover {
    border: 2px solid #fff!important;
    outline: 0!important
}

.btn.btn-outline {
    background: transparent;
    border: 3px solid #fff;
    color: #fff;
    padding: 11px 18px;
}

.btn.btn-outline:hover {
    background: #fff;
    color: #10162b;
    border: 3px solid #fff;
}


.full-page {
    background-color: #2a4ef7;
    background-image: url(https://ownsmmpanel.in/ownsmmpanel/images/logofooter.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    min-height: 100vh;
}

.OSPBlue-arkaplan {
    background-color: #2a4ef7;
    background-image: url(https://ownsmmpanel.in/ownsmmpanel/images/logofooter.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
}

.page-head1 {
    padding-top: 150px;
    background-image: url(https://cdn.mypanel.link/bfc127/93ej5ajnzeuwbe87.png);
    background-size: cover;
    background-position: center;
    background-color: #2a4ef7;
}

.util-menu .util-box {
    width: 100%;
    height: 260px;
    border-radius: 20px;
    text-align: center;
    color: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center; }
.util-menu .util-box-title {
    margin-top: 10px;
    font-size: 32px;
    line-height: 44px;
    font-weight: 700; }
.util-menu .util-box-desc {
    font-size: 18px;
    line-height: 24px; }
.util-menu .util-box a {
    background: #fff;
    width: 120px;
    height: 40px;
    border-radius: 4px;
    line-height: 40px;
    text-align: center;
    color: #000;
    display: block;
    margin: 10px auto; }
.util-menu .util-box.green-box {
    background: #74e99d;
    background: radial-gradient(circle, #74e99d 35%, #3cd571 100%);
    margin-bottom: 15px; }
.util-menu .util-box.yellow-box {
    background: #fedd94;
    background: radial-gradient(circle, #fedd94 35%, #f7ce72 100%); }

.page-head1 .page-head--content {
    padding: 60px 0 40px 0;
    text-align: center;
}

.page-head1 .page-head--content.for-service-detail {
    padding-bottom: 120px;
}

.page-head1 .page-head--title {
    font-size: 50px;
    font-weight: 800;
    color: #fff;
}

.full-page-content {
    padding: 15px 0;
    color: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
}

.full-page-content .fpg-site-name {
    font-size: 50px;
    font-weight: 500;
    text-align: center;
}

.full-page-content .fpg-site-name strong {
    font-weight: 700;
}

.full-page-content .fpg-menu {
    list-style: none;
    padding: 20px 0;
    margin: 10px;
    margin-bottom: 20px;
    text-align: center;
}

.full-page-content .fpg-menu li {
    display: inline-block;
    padding: 0 30px;
}

.full-page-content .fpg-menu li a {
    font-weight: 600;
    color: #fff;
}

header #menubar {
    height: 100px;
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    z-index: 1000;
    padding: 20px 0;
}

.OSPBlue-headerlogin {

}

header #menubar2 {
    height: 100px;
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    z-index: 1000;
    padding: 20px 0;
}

header .navbar-default .navbar-nav>li>a {
    color: #ffffff;
    font-size: 17px;
    font-weight: 600;
}

header .navbar-default .navbar-nav>li.OSPBlue>a {
    color: #000000;
    font-size: 17px;
    font-weight: 600;
}

header .navbar-default .navbar-nav>li.OSPBluec>a {
    color: #000000;
    font-size: 17px;
    font-weight: 600;
}

header .navbar-default .navbar-nav>li>a:hover {
    color: #ebebeb!important;
    transition: 300ms all
}

header .navbar-default .navbar-nav>li.OSPBluec>a:hover {
    color: #1773db!important;
    transition: 300ms all
}

header .navbar-default .navbar-nav>li {
    padding: 5px;
}

header .navbar-default .navbar-nav>li:last-child {
    background: #ffffff;
    border-radius: 10px;
    border: 3px solid transparent;
    padding: 3px 20px;
}

header .navbar-default .navbar-nav>li:last-child a {
    color: #0941f0!important;
}

header .navbar-default .navbar-nav>li.OSPBlueaktif {
    background: #1773db;
    border-radius: 10px;
    border: 3px solid transparent;
    padding: 3px 20px;
}

header .navbar-default .navbar-nav>li.OSPBlueaktif a {
    color: #ffffff!important;
}

header .navbar-default .navbar-nav>li:last-child:hover {
    background: #ebebeb;
    -moz-box-shadow: 0 0 25px rgba(255, 104, 19, 0.80);
    -webkit-box-shadow: 0 0 10px rgb(235,235,235);
    box-shadow: 0 0 10px rgb(235,235,235);
    transition: 500ms all
}

header .navbar-default .navbar-nav>li.OSPBlueaktif:hover a {
    color: #1773db!important;
}

header .navbar-default .navbar-nav>li.OSPBlueaktif:hover {
    background: #1773db;
    -moz-box-shadow: 0 0 25px rgba(255, 104, 19, 0.80);
    -webkit-box-shadow: 0 0 10px rgb(23,115,219);
    box-shadow: 0 0 10px rgb(23,115,219);
    transition: 500ms all
}

header .navbar-default .navbar-nav>li.OSPBlueaktif:hover a {
    color: #ffffff!important;
}

header .navbar-default .navbar-nav>li.active {
    background: transparent;
    color: #ffffff!important;
    border-radius: 10px;
    border: 3px solid #ffffff;
    padding: 3px 20px;
    margin: 0 10px;
    cursor: pointer;
}


header .navbar-default .navbar-nav>li.OSPBlue {
    background: transparent;
    color: #000000!important;
    border-radius: 10px;
    border: 3px solid #000000;
    padding: 3px 20px;
    margin: 0 10px;
    cursor: pointer;
}

header .navbar-default .navbar-nav>li.OSPBlue:hover,
header .navbar-default .navbar-nav>li.OSPBlue:hover a {
    color: #ffffff!important;
    border-color: #000000;
    background: #000000;
}

header .navbar-default .navbar-nav>li.active:hover,
header .navbar-default .navbar-nav>li.active:hover a {
    color: #0941f0!important;
    border-color: #ffffff;
    background: #ffffff;
}


header .navbar-toggle {
    margin-right: 0!important
}

header .navbar-default .navbar-toggle {
    border-color: transparent
}

header .navbar-toggle .icon-bar {
    width: 25px;
    height: 3px
}




.bannerSide {
    position: relative;
    z-index: 1;
    width: 100%;
    padding-top: 140px;
    min-height: 825px;
    overflow: hidden;
}

.bannerSide .bannerBg {
    position: absolute;
    bottom: 0%;
    left: -20%;
    right: 50%;
    top: -30%;
    border-radius: 0 0 500px 0;
    background-color: #1773db;
    overflow: hidden;
    -webkit-transform-origin: bottom left;
    transform-origin: bottom left;
}

.bannerSide .bannerBg .bannerImg {
    position: absolute;
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: -9%;
    background-size: cover;
    background-position: center;
}

.stats {
    max-width: 780px;
    margin: 0 auto;
    height: 140px;
    border-radius: 18px;
    -webkit-box-shadow: 0 0 50px 0 rgba(0, 0, 0, 0.08);
    box-shadow: 0 0 50px 0 rgba(0, 0, 0, 0.08);
    background: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: space-evenly;
    -ms-flex-pack: space-evenly;
    justify-content: space-evenly;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: -80px;
    position: relative; }
.stats a#go-down {
    background: var(--orange);
    -webkit-box-shadow: 0 0 10px rgba(252, 168, 70, 0.5);
    box-shadow: 0 0 10px rgba(252, 168, 70, 0.5);
    border-radius: 50%;
    width: 41px;
    height: 41px;
    display: block;
    position: absolute;
    text-align: center;
    line-height: 41px;
    bottom: -20px;
    -webkit-transition: 300ms;
    transition: 300ms; }
.stats a#go-down:hover {
    -webkit-transform: translateY(10px);
    transform: translateY(10px); }
.stats .stat-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    color: #464e77; }
.stats .stat-box-icon {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    margin-right: 10px; }
.stats .stat-box-title {
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 5px; }
.stats .stat-box-desc {
    font-size: 12px; }

.contentSide {
    position: relative;
    padding: 40px 0 100px 0;
}

.contentSide .loginArea {
    position: relative;
    z-index: 100px;
    padding: 5rem 3rem;
    border-radius: 10px;
    background-color: #fff;
}

.contentSide .loginArea .welcome {
    display: flex;
    align-items: center
}

.contentSide .loginArea .welcome h1 {
    font-size: 26px;
    font-weight: 700;
    color: #16213e;
    margin: 0 0 5px -15px
}

.contentSide .loginArea .welcome span {
    font-size: 15px;
    font-weight: 300;
    color: #081521;
    margin: 0 0 5px -15px
}

.contentSide .loginSide {
    margin-top: 25px
}

.contentSide .loginSide label {
    color: #16213e;
    font-weight: 400;
    font-size: 16px
}

.contentSide .loginText {
    padding-top: 50px;
    max-width: 500px
}

.contentSide .loginText h1 {
    font-size: 42px;
    color: #fff;
    font-weight: 700;
    line-height: 70px;
    max-width: 650px;
    letter-spacing: -1px
}

.contentSide .loginText h1 span {
    color: #081521;
}


.contentSide .loginText p {
    font-size: 17px;
    font-weight: 400;
    color: #fff;
    line-height: 180%;
    margin-top: 25px;
    max-width: 600px
}

.contentSide .icon-pass {
    padding: 20px;
    background: #f5f5f5;
    color: #ccc;
    text-align: center;
    font-size: 16px;
    border-radius: 0 5px 5px 0
}

.contentSide .icon-pass:hover {
    color: #202020;
    transition: 1s;
    cursor: pointer
}

.contentSide .input-field.pwd {
    border-radius: 0!important
}

.contentSide .form-area {
    display: flex;
    width: 100%;
    margin-bottom: 15px;
}

.contentSide .input-field {
    width: 100%;
    padding: 10px;
    outline: none;
    background: #f5f5f5;
    border: none;
    color: #202020;
    height: 56px;
    border-radius: 0 5px 5px 0;
    font-size: 18px
}

.contentSide .icon {
    padding: 17px;
    background: #c4c4c4;
    color: #fff;
    border-right: 1px solid #c4c4c4;
    text-align: center;
    font-size: 20px;
    border-radius: 5px 0 0 5px;
}

.contentSide .loginAlt {
    margin-top: 20px;
    color: #0f3460
}

.contentSide .loginAlt i,
.contentSide .loginAlt a {
    color: #1a1a2e;
}

.contentSide .loginAlt a {
    font-weight: 600
}

.contentSide .loginAlt a:hover {
    color: #1773db
}

@media screen and (max-width: 991px) {
    #menubar .logo {
        max-width: 175px
    }
    #menubar .navbar-nav {
        background: #eaeaea;
        padding: 0 15px
    }
    header .navbar-default .navbar-nav>li.active {
        border: none;
        padding: 0
    }
    .navbar-default .navbar-collapse, .navbar-default .navbar-form {
        border-color: transparent
    }
    .bannerSide {
        padding-top: 75px;
        max-height: 725px;
        min-height: auto;
        overflow: hidden!important
    }
    .bannerSide .bannerBg {
        bottom: 0%;
        left: 0%;
        right: 0%;
        top: 0%;
        border-radius: 0
    }
    .contentSide .loginText {
        display: none
    }
    .about-section .image-column:before {
        display: none
    }
    .about-section .image-column .inner-column {
        padding-right: 0!important
    }
}


/* Panel */

.navbar {
    float: left;
    width: 100%;
    background: #fff;
    margin: 0;
    padding: 0;
    border-radius: 0;
    position: relative
}

.navbar .navbar-logo {
    float: left;
    width: 255px;
    height: 70px;
    transition: 300ms
}

.navbar .navbar-logo .logo-small {
    display: none
}

.navbar .navbar-logo .logo-large {
    display: block
}

.navbar .navbar-logo img {
    max-width: 70%;
    margin: 13px auto;
    vertical-align: middle;
    display: block
}

.navbar .navbar-wrap {
    float: left;
    width: calc(100% - 255px);
    padding-left: 15px;
    padding-right: 15px;
    height: 70px
}

.navbar .navbar-wrap .navbar-toggler {
    float: left;
    background: transparent;
    border: none;
    outline: none;
    padding: 5px 0;
    color: #b1b1b5;
    cursor: pointer
}

.mobile-navbar-toggler {
    float: right;
    background: transparent;
    border: none;
    outline: none;
    font-size: 23px;
    padding: 5px 10px;
    color: #b1b1b5;
    margin-top: 26px;
    cursor: pointer;
    display: none!important;
}

.navbar .navbar-wrap .darkmode button {
    background: transparent;
    border: none;
    outline: none;
    color: #b1b1b5;
    padding: 10px
}

.navbar .navbar-wrap .navbar-prof {
    margin-top: 15px;
    position: absolute;
    right: 15px
}

.navbar .navbar-wrap .navbar-prof .wallets {
    background: #f5f5f5;
    border-radius: 25px;
    font-size: 14px;
    font-weight: 600;
    padding: 5px 10px;
    color: #808080
}

.navbar .navbar-wrap .navbar-prof ul li {
    display: block;
    float: left
}

.p-menu {
    float: left;
    width: 257px;
    background: #fff;
    z-index: 11;
    min-height: calc(100vh);
    position: fixed;
    transition: 300ms;
    padding-top: 100px;
}

@media screen and (min-height: 400px) and (max-height: 800px) {
    .p-menu {
        max-height: 750px!important;
        overflow-x: scroll
    }
}

.p-menu::-webkit-scrollbar {
    width: 7px;
    height: 7px;
}

.p-menu::-webkit-scrollbar-thumb {
    background: #ccc;
    border-radius: 5px;
}

.p-menu::-webkit-scrollbar-track {
    background: transparent;
}

.p-menu:before {
    content: ""
}

.p-menu ul.sideMenu {
    margin: 8px 0 60px;
    padding: 0;
    float: left;
    width: 100%;
    height: 100vh
}

.p-menu ul.sideMenu li {
    list-style: none;
    float: right;
    width: 95%;
    position: relative;
    margin-bottom: 5px
}

.p-menu ul.sideMenu li a:hover {
    background: #6c9ed8!important;
    color: #fff;
    border-radius: 25px 0 0 25px;
}

.p-menu ul.sideMenu li:hover img {
    -webkit-filter: brightness(0) invert(1);
    filter: brightness(0) invert(1);
}

.p-menu ul.sideMenu li a {
    display: flex;
    align-items: center;
    padding: 15px 20px;
    color: #4d575d;
    text-decoration: none;
    position: relative;
}

.p-menu ul.sideMenu li.active {
    background: #2277d8;
    border-radius: 25px 0 0 25px;
}

.p-menu ul.sideMenu li.active img {
    -webkit-filter: brightness(0) invert(1);
    filter: brightness(0) invert(1);
}

.p-menu ul.sideMenu li.active a {
    color: #fff
}

.p-menu ul.sideMenu li a img {
    margin-right: 15px;
    text-align: center;
    width: 24px;
}

.open-left {
    width: 257px;
}

.close-left {
    width: 70px;
    border: none
}

.close-left .p-menu-profile {
    display: none
}

.close-left ul li a {
    position: relative;
    text-align: center
}

.close-left ul li a i {
    margin-right: 0;
    font-size: 18px
}

.close-left ul li a .menu-title {
    position: absolute;
    box-shadow: 1px 0 16px -4px rgba(0, 0, 0, 0.25);
    background: #fff;
    width: 170px;
    z-index: 22;
    left: 0px;
    top: 13px;
    border-radius: 10px;
    padding: 5px 15px;
    text-align: center;
    visibility: hidden;
    color: #4d575d!important
}

.close-left ul li a:hover .menu-title {
    visibility: visible;
    left: 88px;
    transition: 100ms
}

.panel-main {
    float: left;
    width: calc(100% - 257px);
    transition: 300ms;
    margin-bottom: 50px;
    margin-top: 90px!important
}

.panel-main .container {
    width: 100%;
}

@media(max-width: 767px) {
    .menu-mobile-open {
        display: block
    }
    select,
    option {
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none
    }
    select::-ms-expand {
        display: none
    }
    .navbar .navbar-wrap .navbar-prof {
        top: -5px;
        right: 70px
    }
    .navbar-toggler {
        display: none!important
    }
    .mobile-navbar-toggler {
        display: block!important
    }
    .navbar .navbar-wrap {
        border: none;
    }
    .p-menu {
        position: fixed;
        left: -300px;
        transition: 300ms;
        z-index: 9999;
        max-height: 750px!important;
        overflow-x: scroll
    }
    .panel-main {
        width: 100%
    }
    .mobile-left-open {
        left: 0
    }
    .navbar-prof ul li {
        display: block!important
    }
    .navbar-prof ul li.mHide {
        display: none!important
    }
}

@media(max-width: 994px) and (min-width: 767px) {
    .navbar .navbar-wrap .navbar-toggler {
        display: none
    }
    .mobile-navbar-toggler {
        display: block!important
    }
    .p-menu {
        position: absolute;
        left: -300px;
        top: 70px
    }
    .menu-mobile-open {
        display: block
    }
    .panel-main {
        width: 100%
    }
    .mobile-left-open {
        left: 0
    }
}

@media(max-width: 1224px) and (min-width: 994px) {
    .navbar .navbar-wrap .navbar-toggler {
        display: none
    }
    .mobile-navbar-toggler {
        display: block!important
    }
    .p-menu {
        position: absolute;
        left: -300px;
        top: 70px
    }
    .menu-mobile-open {
        display: block
    }
    .panel-main {
        width: 100%
    }
    .mobile-left-open {
        left: 0
    }
}

@media(max-width: 1224px) and (min-width: 768px) {
    .navbar-prof ul li {
        display: block!important
    }
    .navbar .navbar-logo img {
        max-width: 50%;
        margin: 21px;
        vertical-align: middle;
        display: block;
    }
    .navbar .navbar-wrap .navbar-prof {
        right: 55px;
        top: 7px
    }
}

@media only screen and (min-width: 1200px) {
    .togg {
        margin-left: 257px;
    }
    .togg2{
        margin-left: 66px
    }
    #main {
        min-height: 750px
    }
}

@media screen and (max-width:992px) {
    .navbar .navbar-logo img {
        max-width: 50% !important;
        margin: 10px!important;
        vertical-align: middle;
        display: block;
    }
}

.burger-icon {
    -webkit-appearance: none;
    -moz-appearance: none;
    -webkit-box-shadow: none;
    appearance: none;
    box-shadow: none;
    border-radius: none;
    background-color: transparent;
    outline: none !important;
    margin: 0;
    padding: 0;
    display: inline-block;
    position: relative;
    overflow: hidden;
    font-size: 0;
    text-indent: -9999px;
    border: none;
    cursor: pointer;
    width: 24px;
    height: 24px;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    top: 25px
}

.burger-icon span {
    display: block;
    position: absolute;
    border-radius: 3px;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    top: 10px;
    height: 3px;
    min-height: 3px;
    width: 100%;
}

.burger-icon span::before,
.burger-icon span::after {
    position: absolute;
    display: block;
    left: 0;
    width: 100%;
    height: 3px;
    min-height: 3px;
    content: "";
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    border-radius: 3px;
}

.burger-icon span::before {
    top: -8px;
}

.burger-icon span::after {
    bottom: -8px;
}

.burger-icon-left span:before {
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    left: auto;
    right: 0px;
    width: 50%;
}

.burger-icon-left span:after {
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    left: auto;
    right: 0px;
    width: 75%;
}

.burger-icon-left-active span:before {
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    left: 0px;
    right: auto;
    width: 50%;
}

.burger-icon-left-active span:after {
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    left: 0px;
    right: auto;
    width: 75%;
}

.burger-icon-right span:before {
    left: 0px;
    right: auto;
    width: 50%;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}

.burger-icon-right span:after {
    left: 0px;
    right: auto;
    width: 75%;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}

.burger-icon-right-active span:before {
    left: auto;
    right: 0px;
    width: 50%;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}

.burger-icon-right-active span:after {
    left: auto;
    right: 0px;
    width: 75%;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}

.burger-icon span {
    background-color: #B5B5C3;
}

.burger-icon span::before,
.burger-icon span::after {
    background-color: #B5B5C3;
}

.burger-icon:hover span {
    background-color: #202020;
}

.burger-icon:hover span::before,
.burger-icon:hover span::after {
    background-color: #202020;
}

.burger-icon-active span {
    background-color: #202020;
}

.burger-icon-active span::before,
.burger-icon-active span::after {
    background-color: #202020;
}

a#go-down {
    border-radius: 50%;
    font-size: 18px;
    width: 30px;
    height: 30px;
    display: block;
    position: absolute;
    text-align: center;
    text-decoration: none;
    line-height: 30px;
    bottom: -15px;
    -webkit-transition: 300ms;
    transition: 300ms;
    color: #1773db;
    margin: 0 auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: space-evenly;
    -ms-flex-pack: space-evenly;
    justify-content: space-evenly;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative;
    z-index: 50;
}

a#go-down:hover {
    -webkit-transform: translateX(-10px);
    transform: translateX(-10px);
}

@media screen and (min-width:768px){
    .h-menu {display:none}
}

.user-details {
    background: #f9f9f9;
    border-bottom: 1px solid #f1f1f1;
    padding: 1rem!important;
    margin-bottom: 25px
}

.user-pointer {
    cursor: pointer;
}

.media {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: start;
    align-items: flex-start;
}

.user-details .media .avatar img {
    width: 35px;
    height: 35px;
    border-radius: 50%;
}

.media-body {
    -ms-flex: 1;
    flex: 1;
}

.user-details .media .media-body .side-user-name {
    font-size: 14px;
    color: #4d575d;
    font-weight: 600;
    margin-left: 10px
}

.user-setting-menu {
    list-style: none;
    margin: 0;
    padding: 0;
    margin-top: 1rem;
    background-color: transparent;
    height: auto!important
}

.user-setting-menu>li>a {
    padding: 8px 5px;
    display: block;
    color: #4d575d;
    font-size: 13px;
    text-decoration: none
}

.user-setting-menu>li>a img {
    margin-right: 10px;
    text-align: center;
    width: 30px;
}

.user-setting-menu>li.logout {
    background: #df173c;
    border-radius: 10px;
    text-align: center
}

.user-setting-menu>li.logout a {
    color: #fff;
}

.user-setting-menu>li.account {
    background: #369aea;
    border-radius: 10px;
    text-align: center;
    margin-bottom: 5px
}

.user-setting-menu>li.account a {
    color: #fff;
}

.user-details div.user-pointer:after {
    font-family:"Font Awesome 5 Pro";
    font-size: 16px;
    color: #4e4e4e;
    display: inline-block;
    content: '\f104';
    margin-right: 5px;
    transition: -webkit-transform .2s ease-in-out;
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    transform: rotate(-90deg);
}

.user-details div.collapsed:after{
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg)
}

/* Dark Mode CSS */

.cMode:focus, .cMode:hover {
    outline: 0;
    border: 0
}

.cMode, body.light .cMode {
    background: #2277d8;
    color: #fff;
    -webkit-box-shadow: 0 0 10px rgb(85 139 199 / 52%);
    box-shadow: 0 0 10px rgb(82 138 201 / 60%);
    font-weight: 400;
    justify-content: space-between;
    z-index: 98;
    font-size: 15px;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    border: 0;
    margin-top: -5px
}

.cMode i span {
    font-family: Poppins, sans-serif!important;
    font-weight: normal!important;
    font-size: 15px!important
}

body.dark .cMode {
    background: #0e223a;
    color: #fff;
    font-weight: 400;
    justify-content: space-between;
    z-index: 98;
    font-size: 15px;
    border-radius: 50%;
    box-shadow: 0 1px 15px rgba(32, 33, 36, 0.28);
    width: 30px;
    height: 30px;
    border: 0;
    margin-top: -5px
}

button.cMode:hover {
    opacity:.9;
}

.cMode i.fa-moon {
    color: #fff
}

.cMode i.fa-sun span {
    color: #fff
}


.cMode i.fa-sun {
    color: #ffbf00
}

.cMode i span {
    color: #404040
}

body i.fa-moon , body.light i.fa-moon {
    display: block
}

body i.fa-sun , body.light i.fa-sun {
    display: none
}

body.dark i.fa-moon {
    display: none
}

body.dark i.fa-sun {
    display: block
}

.well {
    background: #fff;
    padding: 30px 25px;
    -webkit-box-shadow: 0px 0px 30px 0px rgba(82, 63, 105, 0.05);
    box-shadow: 0px 0px 30px 0px rgba(82, 63, 105, 0.05);
    border-radius: 10px;
    border: 0;
}

.btn {
    line-height: 30px;
    padding: 15px 30px;
    font-size: 18px;
    font-weight: 600;
    color: #fff;
    -webkit-transition: .14s ease;
    transition: .14s ease;
    outline: none;
    border: none;
    border-radius: 10px;
}

.btn-primary {
    background: #1773db;
}

.btn-secondary {
    background: #071828;
    margin-top: 10px
}

.btn-secondary:hover,
.btn-secondary:focus {
    background: #15314e!important;
    outline: 0!important;
    border: 0!important;
    color: #fff!important;
    transform: 500ms all
}

.btn-primary:hover,
.btn-primary:focus {
    background: #1773db!important;
    outline: 0!important;
    border: 0!important;
    transform: 500ms all
}

.panel-body {
    background: #f5f5f5;
    border-radius: 10px;
    color: #5b5c61;
    word-break: break-all;
}

.page-head {
    background: #fca846;
    height: 175px;
    border-radius: 10px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    color: #fff;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: 75px;
    padding-right: 45px;
    margin-bottom: 25px
}

.panel-main .page-head {
    margin-top: 15px;
    background: #071828 url(https://cdn.mypanel.link/bfc127/mfd6zoipu6kchcxb.jpg);
    background-position: center;
    background-size: cover;
    height: 110px;
    border-radius: 10px;
    margin-bottom: 25px
}

.panel-main .page-head-OSPBlue {
    margin-top: 15px;
    background: -webkit-gradient(linear, left top, right top, from(#1ede5e), to(#50d67d));
    background: linear-gradient(to right, #7038ff, #8053f3);
    background-position: center;
    background-size: cover;
    height: 110px;
    border-radius: 10px;
    margin-bottom: 25px
}

.page-head-content {
    margin-left: 10px;
    padding-right: 40px;
    line-height: 20px;
    max-width: 550px;
    line-height: 20px;
    font-size: 14px;
}

.page-head-content h1 {
    font-size: 18px;
    font-weight: bold
}

.page-head-content h1 span {
    color: #0078ff
}

.page-head-title {
    margin-left: auto;
    font-size: 26px;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    font-weight: bold;
    color: #8faccb
}

.buton-konum {
    margin-left: 300px;
    margin-top:-60px;
    font-size: 26px;
    -ms-flex-negative: 0;
    flex-shrink: 0;
}

.detay-buton-konum {
    margin-left: 100px;
    margin-top:-30px;
}

.gorunmez-buton {
    background-color: Transparent;
    background-repeat:no-repeat;
    border: none;
    cursor:pointer;
    overflow: hidden;
}

@media screen and (max-width: 600px) {
    .nomobilegizle {
        visibility: hidden;
        clear: both;
        float: right;
        margin: 5px auto;
        width: 22%;
        height: auto;
        display: none; // Önemli olan nokta burası burayı kaldırırsanız sadece mobile için görüntülenir.
    }
}


.page-head-buton-OSPBlue {
    margin-left: auto;
    -ms-flex-negative: 0;
    flex-shrink: 0;
}

@media screen and (max-width: 667px) {
    .panel-main .page-head {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        padding-right: 0;
        height: auto;
        padding-bottom: 15px;
    }
    .page-head-icon {
        display: none;
    }
    .page-head-content {
        margin-left: 0;
        padding: 10px 20px;
        width: 100%;
        max-width: 100%;
        text-align: center;
        font-size: 14px;
    }
    .page-head-title {
        display: none;
    }
}

.well-head {
    border-bottom: 1px solid #f5f5f5;
    padding-bottom: 15px;
    margin-bottom: 15px;
    font-size: 18px;
    font-weight: bold
}

.well-head i {
    background: rgb(41 122 213);
    background: linear-gradient(90deg, rgb(45 122 210) 0%, rgb(77 123 255) 100%);
    color: #fff;
    border-radius: 25px 0 0 25px;
    width: 30px;
    height: 30px;
    text-align: center;
    padding: 5px
}

.main-timeline {
    max-height: 500px;
    overflow-y: scroll;
    margin-top: 15px
}

.main-timeline::-webkit-scrollbar {
    width: 7px;
    height: 7px;
}

.main-timeline::-webkit-scrollbar-thumb {
    background: #ccc;
    border-radius: 5px;
}

.main-timeline::-webkit-scrollbar-track {
    background: transparent;
}

.timeline:nth-child(1) {
    margin-top: 10px;
}

.timeline {
    margin-bottom: 0px;
    line-height: 25px;
    width: 100%;
    margin-top: 15px;
    border: 1px solid #f5f5f5;
    border-bottom: 1px solid #122f4c;
    padding: 15px;
}

.tl-header {
    font-weight: 600;
    font-size: 14px
}

.tl-time {
    background: #a7a7a7;
    border-radius: 5px;
    padding: 3px 10px;
    color: #fff;
    width: 115px
}

.fab.fa-instagram {
    background: #f09433;
    background: -moz-linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%);
    background: -webkit-linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%);
    background: linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f09433', endColorstr='#bc1888',GradientType=1 );
    padding: 2px 3px 2px 2px;
    border-radius: 4px;
    display: inline-block;
    color: #ffffff;
    font-size: 14px;
    margin-right: 10px;
}

.fab.fa-facebook-square {
    background: #207eff;
    background-clip: text;
    -webkit-background-clip: text;
    font-size: 17px;
    -webkit-text-fill-color: transparent;
    font-weight: bold;
    margin-right: 10px;
}

.fab.fa-youtube {
    background: #ff0042;
    background-clip: text;
    -webkit-background-clip: text;
    font-size: 17px;
    -webkit-text-fill-color: transparent;
    font-weight: bold;
    margin-right: 10px;
}

.fab.fa-twitter {
    background: #1da1f2;
    background-clip: text;
    -webkit-background-clip: text;
    font-size: 17px;
    -webkit-text-fill-color: transparent;
    font-weight: bold;
    margin-right: 10px;
}

.fab.fa-telegram-plane {
    background: #2b9fd2;
    background-clip: text;
    -webkit-background-clip: text;
    font-size: 17px;
    -webkit-text-fill-color: transparent;
    font-weight: bold;
    margin-right: 10px;
}

.fab.fa-soundcloud {
    background: #ff5836;
    background-clip: text;
    -webkit-background-clip: text;
    font-size: 17px;
    -webkit-text-fill-color: transparent;
    font-weight: bold;
    margin-right: 10px;
}

.fab.fa-spotify {
    background: #62ffa2;
    background-clip: text;
    -webkit-background-clip: text;
    font-size: 17px;
    -webkit-text-fill-color: transparent;
    font-weight: bold;
    margin-right: 10px;
}

.fab.fa-twitch {
    background: #4b367c;
    background-clip: text;
    -webkit-background-clip: text;
    font-size: 14px;
    -webkit-text-fill-color: transparent;
    margin-right: 10px;
}

.fab.fa-pinterest-p {
    background: #ff5858;
    background-clip: text;
    -webkit-background-clip: text;
    font-size: 17px;
    -webkit-text-fill-color: transparent;
    font-weight: bold;
    margin-right: 10px;
}

.fa.fa-music {
    background: #69C9D0;
    background-clip: text;
    -webkit-background-clip: text;
    font-size: 17px;
    -webkit-text-fill-color: transparent;
    margin-right: 10px;
}

.fab.fa-tiktok {
    background: #505050;
    background-clip: text;
    -webkit-background-clip: text;
    font-size: 17px;
    -webkit-text-fill-color: transparent;
    font-weight: bold;
    margin-right: 10px;
}

.fab.fa-snapchat-ghost {
    background: #ffd400;
    background-clip: text;
    -webkit-background-clip: text;
    font-size: 17px;
    -webkit-text-fill-color: transparent;
    margin-right: 10px;
}

.fas.fa-stream {
    background: #ccc;
    background-clip: text;
    -webkit-background-clip: text;
    font-size: 17px;
    -webkit-text-fill-color: transparent;
    margin-right: 10px;
}

.fab.fa-hotjar {
    background: #ff0000;
    background-clip: text;
    -webkit-background-clip: text;
    font-size: 17px;
    -webkit-text-fill-color: transparent;
    margin-right: 10px;
}

.fab.fa-periscope {
    background: #e24d3a;
    background-clip: text;
    -webkit-background-clip: text;
    font-size: 17px;
    -webkit-text-fill-color: transparent;
    margin-right: 10px;
}

.fab.fa-linkedin-in {
    background: #0077b0;
    background-clip: text;
    -webkit-background-clip: text;
    font-size: 17px;
    -webkit-text-fill-color: transparent;
    margin-right: 10px;
}

.fab.fa-tumblr {
    background: #1c3764;
    background-clip: text;
    -webkit-background-clip: text;
    font-size: 17px;
    -webkit-text-fill-color: transparent;
    margin-right: 10px;
}

.fab.fa-dailymotion {
    background: #00c9eb;
    background-clip: text;
    -webkit-background-clip: text;
    font-size: 17px;
    -webkit-text-fill-color: transparent;
    margin-right: 10px;
}

.fab.fa-vimeo-v {
    background: #00a8e8;
    background-clip: text;
    -webkit-background-clip: text;
    font-size: 17px;
    -webkit-text-fill-color: transparent;
    margin-right: 10px;
}

.fab.fa-apple {
    background: #313131;
    background-clip: text;
    -webkit-background-clip: text;
    font-size: 17px;
    -webkit-text-fill-color: transparent;
    margin-right: 10px;
}

.card.wallet {
    background: -webkit-gradient(linear, left top, right top, from(#c61fdf), to(#be62cc));
    background: linear-gradient(to right, #c61fdf, #be62cc);
    border-radius: 10px;
    min-height: 110px;
    overflow: hidden!important;
    position: relative;
    margin-bottom: 30px;
    padding: 10px 0;
}

.card.spent {
    background: -webkit-gradient(linear, left top, right top, from(#df1f1f), to(#d84343));
    background: linear-gradient(to right, #ff1972, #ff384f);
    border-radius: 10px;
    min-height: 110px;
    overflow: hidden!important;
    position: relative;
    margin-bottom: 30px;
    padding: 10px 0;
}

.card.current {
    background: -webkit-gradient(linear, left top, right top, from(#1ede5e), to(#50d67d));
    background: linear-gradient(to right, #1ede5e, #50d67d);
    border-radius: 10px;
    min-height: 110px;
    overflow: hidden!important;
    position: relative;
    margin-bottom: 30px;
    padding: 10px 0;
}

.card.account {
    background: -webkit-gradient(linear, left top, right top, from(#eca226), to(#dcba58));
    background: linear-gradient(to right, #eca226, #dcba58);
    border-radius: 10px;
    min-height: 110px;
    overflow: hidden!important;
    position: relative;
    margin-bottom: 30px;
    padding: 10px 0;
}

.card.current img,
.card.wallet img,
.card.account img,
.card.spent img {
    width: 60%!important;
    height: auto;
    margin-top: 12px
}

.card.current .icon, .card.wallet .icon, .card.account .icon, .card.spent .icon {
    height: 80px;
    width: 80px;
    line-height: 60px;
    text-align: center;
    background: rgba(255, 255, 255, 0.12);
    border-radius: 50%;
    display: block;
    -webkit-transition: .15s ease;
    transition: .15s ease;
    margin-top: 5px
}

.card.current h1,
.card.wallet h1,
.card.account h1,
.card.spent h1 {
    color: #fff;
    font-size: 14px
}

.card.wallet span,
.card.spent span,
.card.account span,
.card.current span {
    color: #fff;
    font-size: 24px;
    font-weight: 800
}

.serv-search {
    display: flex!important;
    width: 100%;
    margin-bottom: 15px
}

.serv-head {
    background: #071828;
    color: #fff;
    border-radius: 10px;
    border: none;
    text-align: left;
    padding: 10px 20px!important;
}

.serv-input {
    width: 100%!important;
    padding: 10px!important;
    outline: none!important;
    background: #f5f5f5;
    border: none!important;
    color: #0d1e2e;
    height: 45px!important;
    border-radius: 0 10px 10px 0!important;
}

.serv-input:focus,
.serv-input:hover {
    outline: none!important;
}

.form-control {
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
}

#serv-icon {
    padding: 14px;
    background: #f5f5f5;
    color: #1773db;
    text-align: center;
    font-size: 15px;
    border-radius: 10px 0 0 10px;
    border: 1px solid #f5f5f5;
    border-right: none
}

#serv-table.table>tbody>tr>td,
#serv-table.table>tbody>tr>th,
#serv-table.table>thead>tr>td,
#serv-table.table>thead>tr>th {
    border-top: 1px solid #f5f5f5;
    vertical-align: middle;
}

#serv-table.table>tbody>tr>td.serv-head {
    border: none
}

#serv-table.table tr {
    color: #0d1e2e
}

#serv-table.table tr a {
    color: #464e77
}

#serv-table.table>thead>tr>th {
    border: none
}

.modal {
    z-index: 99999
}

.modal-header {
    border-bottom-color: transparent!important;
    background: #071828;
    color: #fff!important;
    padding: 15px;
}

.modal-header .close {
    font-size: 28px;
    color: #fff;
    opacity: 1;
    line-height: 23px;
    margin-top: 5px;
    border: 2px solid transparent;
    padding-bottom: 4px;
    padding-left: 6px;
    padding-right: 6px;
    border-radius: 0px;
}

.modal-title1 {
    float: left;
    font-size: 13px;
    color: #fff;
    padding-left: 10px;
}

.modal-body1 {
    padding: 15px;
    font-size: 13px
}

.text-success {
    color: #18bc9c!important;
}

.text-danger {
    color: #e74c3c!important;
}

@media screen and (max-width: 600px) {
    #serv-table.table {
        border: 0;
    }
    #serv-table.table caption {
        font-size: 1.3em;
    }
    #serv-table.table thead {
        border: none;
        clip: rect(0 0 0 0);
        height: 1px;
        margin: -1px;
        overflow: hidden;
        padding: 0;
        position: absolute;
        width: 1px;
    }
    #serv-table.table tr {
        border-bottom: 3px solid #081521;
        display: block;
        margin-bottom: .625em;
    }
    #serv-table.table td {
        border-bottom: 1px solid #f5f5f5;
        display: block;
        font-size: .8em;
        text-align: right;
    }
    #serv-table.table td::before {
        content: attr(data-label);
        float: left;
        font-weight: bold;
        text-transform: uppercase;
    }
    #serv-table.table td:last-child {
        border-bottom: 0;
    }
    #serv-table.table tr {
        border: 1px solid #f5f5f5
    }
    #serv-table.table tr:nth-child(even) {
        background: #fff
    }
    #serv-table.table tr:nth-child(odd) {
        background: #f9f9f9
    }
    #serv-table.table tr td {
        text-align: right
    }
    #serv-table.table tr.s-head {
        border: none!important;
        text-align: left
    }
    .page-head-title {display: none}
}

.servNav {
    margin-bottom: 25px
}

.servNav li {
    background: #fff;
    padding: 10px 15px;
    border-radius: 10px;
    margin-bottom: 10px
}

.servNav li a {
    color:#071828!important;
    text-decoration: none
}

.servNav li:hover {
    background: #1773db
}

.servNav li:hover a {
    color: #fff!important
}

.srv-search {
    background-color: #f5f5f5!important;
    color: #202020;
    font-size: 11px;
    border: none;
    outline: none;
    border-radius: 10px;
    cursor: pointer;
    -webkit-transition: .15s ease;
    transition: .15s ease;
    min-height: 40px;
    position: relative;
    overflow: hidden;
    margin-bottom: 15px
}

.srv-search .srv-input {
    width: calc(100% - 40px);
    background: transparent;
    border: none;
    outline: none;
    height: 40px;
    color: #202020;
    padding: 0 14px;
}

.srv-search .srv-input::-webkit-input-placeholder {
    color: rgba(0, 0, 0, 0.6);
}

.srv-search .srv-input:-ms-input-placeholder {
    color: rgba(0, 0, 0, 0.6);
}

.srv-search .srv-input::-ms-input-placeholder {
    color: rgba(0, 0, 0, 0.6);
}

.dfb-search .dfb-input::placeholder {
    color: rgba(0, 0, 0, 0.6);
}

.srv-search .srv-submit {
    position: absolute;
    right: 0px;
    top: 0px;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    border: none;
    background: #007bff;
    color: #ffffff;
}

#userpanel .form-control {
    height: 45px
}

.ticket-message-right .ticket-message {
    background: rgb(81, 209, 150, 0.1);
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    padding: 15px;
    margin-bottom: 5px
}

.ticket-message-left .ticket-message {
    background: rgb(23, 79, 242, 0.1);
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    padding: 15px;
    margin-bottom: 5px
}

.d-card {
    border-radius: 10px;
    margin-bottom: 15px
}

.d-card.bg-blues {
    background-color: #112c4a;
    color: #fff;
}

.d-card.d-pad {
    padding: 34px 30px;
}

.d-btn {
    border-radius: 6px;
    background-color: #fff;
    color: #1773db;
    -webkit-box-shadow: 0px 10px 40px rgba(0, 0, 0, 0.3);
    box-shadow: 0px 10px 40px rgba(0, 0, 0, 0.3);
    font-size: 16px;
    display: inline-block;
    line-height: 20px;
    padding: 12px 18px;
    outline: none;
    border: none;
    font-weight: 600;
    letter-spacing: .4;
    -webkit-transition: .15s ease;
    transition: .15s ease;
    text-decoration: none;
    cursor: pointer;
    text-align: center;
    margin-top: 20px;
    text-decoration: none
}

.d-btn.db-white {
    background-color: #fff;
    color: #1773db !important;
}

.add-left-border {
    border-left: 1px solid rgba(255, 255, 255, 0.18);
}

.ref-item {
    border-bottom: 1px solid #f5f5f5;
    padding: 15px 0
}

.ref-item i {
    color: #1773db
}

.ref-item .the-title {
    font-weight: bold
}

.paybtn {
    background: #51d196;
    color: #fff;
    border-radius: 5px;
    padding: 10px 20px;
    text-decoration: none
}

.paybtn:hover {
    background: #3bb67d;
    color: #fff;
    text-decoration: none
}

.min-max {
    color: #F64E60;
    font-weight: bold;
}

.priceBadge {
    height: 20px;
    line-height: 20px;
    background: #fff;
    color: #d5d7d9;
    font-size: 12px;
    font-weight: 600;
    padding: 0 7px;
    border-radius: 5px;
    vertical-align: middle;
    display: inline-block;
}

.priceBadge.bGreen {
    background: #bcebdf;
    color: #16b77d;
}

.how-use {
    padding: 75px 0
}

.how-use .hu-head p {
    font-size: 18px;
    color: #081521;
    padding-top: 20px
}

.how-use .hu-head span {
    background: #1773db;
    color: #fff;
    border-radius: 25px;
    padding: 10px 25px;
    font-size: 16px;
    font-weight: 600
}

.hu-content {
    background: url(https://cdn.mypanel.link/n1aj3h/p0c915f5mbxugtmi.png) no-repeat;
    background-position: center;
    margin-right: -35px;
    padding: 80px 0 50px 0;
}
.hu-inner {
    border-radius: 50%;
    padding: 50px;
    border: 1px solid #000;
}

.hu-circle {
    text-align: center;
    width: 200px;
    height: 200px;
    padding: 51px;
    line-height: 52px;
    border-radius: 25px;
    background: #fff;
    -webkit-transition: .3s all;
    -o-transition: .3s all;
    transition: .3s all;
    cursor: pointer
}

.hu-icon h4 {
    font-size: 16px;
    font-weight: 600;
    color: #143556
}
.hu-item1 {
    margin-top: 80px;
    -webkit-transition: .3s all;
    -o-transition: .3s all;
    transition: .3s all;
    -webkit-box-shadow: 0px 15px 50px 0px rgba(0, 27, 103, 0.15);
    box-shadow: 0px 15px 50px 0px rgba(0, 27, 103, 0.15);
}
.hu-item2 {
    margin-top: -41px;
    border: 1px solid #eaeaea;
}
.hu-item3 {
    margin-top: 80px;
    border: 1px solid #eaeaea;
}
.hu-item4 {
    margin-top: -45px;
    border: 1px solid #eaeaea;
}
.hu-item1:hover {
    -webkit-box-shadow: 0px 15px 50px 0px rgba(0, 27, 103, 0.15);
    box-shadow: 0px 15px 50px 0px rgba(0, 27, 103, 0.15);

}
.hu-item2:hover {
    -webkit-box-shadow: 0px 15px 50px 0px rgba(0, 27, 103, 0.15);
    box-shadow: 0px 15px 50px 0px rgba(0, 27, 103, 0.15);
    border: 1px solid #fff;

}
.hu-item3:hover {
    -webkit-box-shadow: 0px 15px 50px 0px rgba(0, 27, 103, 0.15);
    box-shadow: 0px 15px 50px 0px rgba(0, 27, 103, 0.15);
    border: 1px solid #fff;

}
.hu-item4:hover {
    -webkit-box-shadow: 0px 15px 50px 0px rgba(0, 27, 103, 0.15);
    box-shadow: 0px 15px 50px 0px rgba(0, 27, 103, 0.15);
    border: 1px solid #fff;

}

@media (max-width: 480px) {
    .hu-item1, .hu-item2, .hu-item3, .hu-item4 {
        margin: 0 auto;
        margin-bottom: 30px;
    }
    .hu-content {
        background: none;
        margin-bottom: -30px;
        padding: 20px 0 20px 0;
        margin-right: 0;
    }
}

.about-section {
    padding: 75px 0
}

.about-section .about-head {
    margin-top: 125px
}

.about-section .about-head p {
    font-size: 18px;
    line-height: 28px;
    color: #081521;
    padding-top: 20px
}

.about-section .about-head span {
    background: #1773db;
    color: #fff;
    border-radius: 25px;
    padding: 10px 25px;
    font-size: 16px;
    font-weight: 600
}

.about-section .image-column{
    position:relative;
    margin-bottom:40px;
}

.about-section .image-column .inner-column{
    position:relative;
    padding-right:25px;
}

.about-section .image-column:before {
    position:absolute;
    content:'';
    left:-25px;
    bottom:-40px;
    right:90px;
    top:35px;
    border-radius:15px;
    background-image: -ms-linear-gradient(left, #0e223a 0%, #143556 100%);
    background-image: -moz-linear-gradient(left, #0e223a 0%, #143556 100%);
    background-image: -o-linear-gradient(left, #0e223a 0%, #143556 100%);
    background-image: -webkit-gradient(linear, left top, right top, color-stop(0, #0e223a), color-stop(100, #143556));
    background-image: -webkit-linear-gradient(left, #0e223a 0%, #143556 100%);
    background-image: linear-gradient(to right, #0e223a 0%, #143556 100%);
}

.about-section .image-column .image{
    position:relative;
    display:inline-block;
}

.about-section .image-column .image img{
    position:relative;
    border-radius:30px;
}

.about-section .content-column{
    position:relative;
    margin-bottom:40px;
}

.about-section .content-column .inner-column{
    position:relative;
    padding-top:55px;
    padding-left:20px;
    padding-right:60px;
}

.footer {
    background: #081521;
    height: 400px;
    margin-top: 175px;
}

.footer.no-margin {
    margin-top: 0;
}

.footer-top {
    background: #143556;
    background: -webkit-gradient(linear, right top, left top, from(#143556), color-stop(50%, #143556));
    background: linear-gradient(270deg, #143556 0%, #143556 50%);
    height: 150px;
    margin-bottom: -75px;
    top: -75px;
    position: relative;
    color: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding-left: 90px;
    padding-right: 90px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 32px;
    line-height: 48px;
    border-radius: 30px;
}

.footer-top a {
    display: block;
    width: 180px;
    height: 50px;
    border: 2px solid #fff;
    border-radius: 25px;
    font-size: 16px;
    text-align: center;
    line-height: 46px;
    font-weight: 600;
    color: #fff;
}

.footer-top a:hover {
    background: #fff;
    color: #143556
}

.footer-content {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-top: 85px;
}

.footer-logo {
    margin-bottom: 20px;
}

.footer-left {
    font-size: 16px;
    line-height: 24px;
    max-width: 340px;
    color: rgba(255, 255, 255, 0.8);
}

.footer-menu {
    text-align: right;
    margin-left: 55px;
}

.footer-menu ul li {
    list-style-type: none!important
}

.footer-menu ul li {
    line-height: 24px;
    margin-bottom: 10px;
    list-style-type: none!important
}

.footer-menu ul li a {
    font-size: 16px;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.8);
}

.footer-title {
    color: #fff;
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 20px;
}

.footer-copyright {
    color: #fff;
    text-align: center;
    margin-top: 65px;
}

@media screen and (max-width: 1170px) {
    .footer {
        height: auto;
        padding-bottom: 30px;
    }
    .footer-top {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        text-align: center;
        padding: 20px;
    }
    .footer-top p {
        width: 100%;
        font-size: 20px;
        line-height: 1.5;
    }
    .footer-top a {
        margin: 0 auto;
    }
    .footer-content {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        margin-top: 20px;
    }
    .footer-left {
        width: 100%;
        max-width: 100%;
        text-align: center;
    }
    .footer-menu {
        display: none
    }
}

.dropdown-menu {
    width: 100%;
    padding: 0;
    max-height: 43.6vh;
    overflow-y: scroll;
}

#order-sItem,
#order-cItem {
    white-space: inherit;
    padding: 12px;
    font-weight: 500;
    font-size: 14px;
    border-bottom: 1px solid #f5f5f5;
    text-align: left;
    width: 100%
}

#order-sItem:hover,
#order-cItem:hover {
    background: #f1f1f1
}

#order-category,
#newtc,
#order-services {
    white-space: nowrap;
    text-overflow: ellipsis;
}

#order-category,
#order-services {
    width: 85%;
    overflow-x: hidden;
    position: absolute;
    line-height: 15px;
    height: 20px;
    font-size: 14px;
}

.dropdown button {
    background: #fff;
    border: 1px solid #f1f1f1;
    color: #081521
}

.dropdown button:hover,
.dropdown button:focus {
    outline: none;
}

.dropdown-menu::-webkit-scrollbar {
    width: 7px;
    height: 7px;
}

.dropdown-menu::-webkit-scrollbar-thumb {
    background: #ccc;
    border-radius: 5px;
}

.dropdown-menu::-webkit-scrollbar-track {
    background: transparent;
}

.dash-anounce {
    position: relative;
}

.dash-anounce::after {
    content: '';
    left: 25px;
    position: absolute;
    width: 2px;
    top: 0px;
    height: 100%;
    background: #e0e5e9;
}

.dash-anounce .da-item {
    position: relative;
}

.dash-anounce .da-item + .da-item {
    margin-top: 44px;
}

.dash-anounce .da-item.da-instagram .item-icon {
    background: #e4395f !important;
}

.dash-anounce .da-item .item-icon i {
    margin-right: 0 !important;
}

.dash-anounce .da-item.da-instagram .item-content::before {
    background: #e4395f;
}

.dash-anounce .da-item.da-instagram .item-content .sweet-badge.sb-green {
    background: #f5c9d9;
    color: #ef424c;
}

.dash-anounce .da-item.da-facebook .item-icon {
    background: #4b78d4 !important;
    background: -webkit-gradient(linear, left top, right top, from(#4b78d4), to(#4165af));
    background: linear-gradient(to right, #4b78d4, #4165af);
}

.dash-anounce .da-item.da-facebook .item-icon .fa-twitter {
    background: #fff !important;
}

.dash-anounce .da-item.da-facebook .item-content::before {
    background: #4b78d4;
    background: -webkit-gradient(linear, left top, right top, from(#4b78d4), to(#4165af));
    background: linear-gradient(to right, #4b78d4, #4165af);
}

.dash-anounce .da-item.da-facebook .item-content .sweet-badge.sb-green {
    background: #ced9f0;
    color: #456dbd;
}

.dash-anounce .da-item.da-tiktok .item-icon {
    background: #505050 !important;
    background: -webkit-gradient(linear, left top, right top, from(#505050), to(#3a3a3a));
    background: linear-gradient(to right, #505050, #3a3a3a);
}

.dash-anounce .da-item.da-tiktok .item-icon .fa-tiktok {
    background: #ffffff;
    background-clip: text;
    -webkit-background-clip: text;
    font-size: 17px;
    -webkit-text-fill-color: transparent;
    font-weight: bold;
    margin-right: 10px;
}

.dash-anounce .da-item.da-tiktok .item-content::before {
    background: #505050;
    background: -webkit-gradient(linear, left top, right top, from(#505050), to(#3a3a3a));
    background: linear-gradient(to right, #505050, #3a3a3a);
}

.dash-anounce .da-item.da-tiktok .item-content .sweet-badge.sb-green {
    background: #aaaaaa;
    color: #3a3a3a;
}

.dash-anounce .da-item.da-youtube .item-icon {
    background: #d44b4b !important;
    background: -webkit-gradient(linear, left top, right top, from(#d44b4b), to(#af4141));
    background: linear-gradient(to right, #d44b4b, #af4141);
}

.dash-anounce .da-item.da-youtube .item-icon .fa-youtube {
    background: #ffffff;
    background-clip: text;
    -webkit-background-clip: text;
    font-size: 17px;
    -webkit-text-fill-color: transparent;
    font-weight: bold;
    margin-right: 10px;
}

.dash-anounce .da-item.da-twitter .item-icon .fa-twitter {
    background: #ffffff;
    background-clip: text;
    -webkit-background-clip: text;
    font-size: 17px;
    -webkit-text-fill-color: transparent;
    font-weight: bold;
    margin-right: 10px;
}

.dash-anounce .da-item.da-youtube .item-content::before {
    background: #d44b4b;
    background: -webkit-gradient(linear, left top, right top, from(#d44b4b), to(#af4141));
    background: linear-gradient(to right, #d44b4b, #af4141);
}

.dash-anounce .da-item.da-youtube .item-content .sweet-badge.sb-green {
    background: #ea9191;
    color: #bd4545;
}


.dash-anounce .da-item.da-twitter .item-icon {
    background: #3996f9 !important;
    background: -webkit-gradient(linear, left top, right top, from(#3996f9), to(#20b1f0));
    background: linear-gradient(to right, #3996f9, #20b1f0);
}

.dash-anounce .da-item.da-twitter .item-content::before {
    background: #3996f9;
    background: -webkit-gradient(linear, left top, right top, from(#3996f9), to(#20b1f0));
    background: linear-gradient(to right, #3996f9, #20b1f0);
}

.dash-anounce .da-item.da-twitter .item-content .sweet-badge.sb-green {
    background: #c3e5f7;
    color: #369dfc;
}

.dash-anounce .da-item .item-icon {
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    left: 0px;
    width: 52px;
    height: 52px;
    border-radius: 52px;
    line-height: 54px;
    border-radius: 50px;
    text-align: center;
    font-size: 20px;
    background-color: #4cc295;
    color: #fff;
    position: absolute;
    z-index: 5;
}

.dash-anounce .da-item .item-content {
    border-radius: 10px;
    overflow: hidden;
    margin-left: 60px;
    background-color: #fff;
    position: relative;
    padding: 38px 20px 30px 20px;
}

/* SER START */

.services-list {
    background: #f5f5f5;
    max-width: 600px;
    margin: auto;
    padding: 1px 15px;
    border-radius: 5px
}

.services-list ul{
    list-style:none;
    padding:0;
    margin:0;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    justify-content: center;
    margin-top:10px;
    margin-bottom:10px;
}
.services-list ul li{
    cursor: pointer;
    margin-left:10px;
    margin-right:10px;
}

.services-list ul li i{
    color: #fff;
    font-size: 24px!important;
}

.services-list ul li.instagram i{
    background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.services-list ul li.facebook i{
    color: #4267b2;
}

.services-list ul li.twitter i{
    color: #1da1f2
}
.services-list ul li.youtube i{
    color: red;
}

.services-list ul li.spotify i{
    color: #00d856;
}
.services-list ul li.twitch i{
    color: #1a0dab;
}
.services-list ul li.pinterest i{
    color: #bd081c;
}
.services-list ul li.telegram i{
    color: #26a4e3;
}
.services-list ul li.soundcloud i{
    color: #ff5510;
}



/* SER STOP */

.dash-anounce .da-item .item-content::before {
    content: '';
    position: absolute;
    width: 100%;
    left: 0px;
    top: 0px;
    height: 10px;
    background-color: #4cc295;
}

.dash-anounce .da-item .item-content .da-head .the-title {
    font-size: 16px;
    line-height: 24px;
    color: #494e5d;
    font-weight: 600;
    letter-spacing: .4px;
}

.dash-anounce .da-item .item-content .da-body {
    font-size: 12px;
    line-height: 22px;
    color: #aeb1ba;
    font-weight: 500;
    padding-top: 10px;
}

.col {
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 100%;
}

.col-auto {
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: auto;
    max-width: 100%;
}

.align-self-center {
    -ms-flex-item-align: center!important;
    align-self: center!important;
}

.col, .col-auto {
    position: relative;
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
}

.cw-body::-webkit-scrollbar {
    width: 7px;
    height: 7px;
}

.cw-body::-webkit-scrollbar-thumb {
    background: #ccc;
    border-radius: 5px;
}

.cw-body::-webkit-scrollbar-track {
    background: transparent;
}

.tos-page .tos-nav-btn {
    min-width: 60px;
    height: 60px;
    line-height: 60px;
    text-align: center;
    font-size: 28px;
    border-radius: 10px;
    -webkit-transition: .13s ease;
    transition: .13s ease;
    background-color: #071828;
    color: #fff;
    cursor: pointer;
    display: inline-block;
    margin-bottom: 18px;
}

.tos-page .tos-nav-btn span {
    display: none;
    font-size: 15px;
    padding: 0 20px;
    -webkit-transform: translateY(-3px);
    transform: translateY(-3px);
}

.tos-page .tos-nav-btn:hover {
    background-color: #5d8ec5;
}

.tos-page .tos-nav-btn.active {
    background-color: #5d8ec5;
    color: #fff;
    padding: 0 14px;
}

.tos-page .tos-nav-btn.active span {
    display: inline-block;
}

.tos-page .tos-tabs {
    line-height: 170%;
}

.tos-page .tos-tabs .tos-tab {
    display: none;
}

.tos-page .tos-tabs .tos-tab.active {
    display: block;
}

.r10-logo {
    height: 38px;
    width: 28px;
    background-size: 250%;
    background-repeat: no-repeat;
    background-position: 20% 40%;
    background-image: url("data:image/svg+xml,%3Csvg version='1.0' xmlns='http://www.w3.org/2000/svg' width='80px' height='35px' viewBox='0 0 185 105' preserveAspectRatio='xMidYMid meet'%3E%3Cg transform='translate(0.000000,114.000000) scale(0.100000,-0.100000)'%0Afill='%232C3E50' stroke='none'%3E%3Cpath d='M433 1069 c-36 -23 -80 -83 -99 -136 -16 -45 -19 -116 -4 -93 5 8 10%0A26 10 40 1 43 38 111 87 156 52 47 55 64 6 33z'/%3E%3Cpath d='M271 957 c-1 -113 -2 -118 -24 -126 -30 -12 -81 -70 -108 -123 -44%0A-86 -89 -223 -89 -271 0 -86 84 -212 170 -257 51 -26 142 -50 189 -50 66 0%0A193 46 258 93 62 46 98 101 133 203 27 78 25 115 -11 191 -30 62 -80 112 -135%0A133 -12 5 -31 24 -43 43 -12 19 -28 38 -37 41 -13 5 -15 17 -10 59 l5 52 -12%0A-50 -13 -50 44 -52 c25 -28 57 -57 73 -63 40 -17 104 -89 119 -134 19 -57 9%0A-161 -21 -227 -100 -215 -438 -279 -602 -113 -47 47 -64 78 -78 142 -25 120%0A82 366 182 418 l29 15 -1 102 c0 56 -4 111 -9 122 -5 13 -9 -23 -9 -98z'/%3E%3Cpath d='M481 879 c-12 -16 -37 -39 -54 -50 -20 -12 -26 -19 -15 -19 18 0 71%0A49 88 81 16 28 7 23 -19 -12z'/%3E%3Cpath d='M492 810 c91 -17 136 -124 92 -216 -28 -59 -102 -82 -154 -48 l-25%0A16 24 -21 c31 -27 93 -28 131 -1 31 22 60 85 60 131 0 76 -64 150 -128 148%0Al-37 -1 37 -8z'/%3E%3Cpath d='M267 779 c-27 -16 -47 -64 -47 -115 0 -39 5 -51 34 -80 19 -19 42%0A-34 52 -34 14 0 10 6 -14 20 -40 25 -66 81 -57 124 7 36 20 55 55 79 26 18 8%0A24 -23 6z'/%3E%3Cpath d='M322 709 c2 -6 8 -10 13 -10 5 0 11 4 13 10 2 6 -4 11 -13 11 -9 0%0A-15 -5 -13 -11z'/%3E%3Cpath d='M520 700 c0 -5 7 -10 15 -10 8 0 15 5 15 10 0 6 -7 10 -15 10 -8 0%0A-15 -4 -15 -10z'/%3E%3Cpath d='M130 518 c0 -160 143 -289 325 -291 163 -3 265 101 265 269 0 90 -16%0A80 -22 -13 -6 -95 -32 -151 -90 -193 -53 -39 -99 -51 -179 -47 -149 8 -270%0A113 -286 248 -6 55 -1 59 48 33 70 -36 262 -54 364 -35 30 5 5 9 -100 13 -125%0A6 -235 25 -307 53 -16 6 -18 1 -18 -37z'/%3E%3C/g%3E%3C/svg%3E");
}

.vmaraci-logo {
    height: 38px;
    width: 28px;
    margin-right: 15px;
    background-size: 120%;
    background-repeat: no-repeat;
    background-position: 70% 40%;
    background-image: url("data:image/svg+xml,%3Csvg version='1.0' xmlns='http://www.w3.org/2000/svg' width='300.000000pt' height='300.000000pt' viewBox='0 0 300.000000 300.000000' preserveAspectRatio='xMidYMid meet'%3E%3Cg transform='translate(0.000000,300.000000) scale(0.050000,-0.050000)'%0Afill='%232C3E50' stroke='none'%3E%3Cpath d='M2425 5506 c19 -5 35 -17 35 -28 0 -17 44 -12 147 16 26 7 35 1 29%0A-17 -7 -20 -59 -28 -198 -30 -241 -4 -660 -133 -730 -224 -12 -16 -32 -23 -44%0A-16 -12 8 -29 2 -38 -13 -9 -14 -49 -51 -90 -82 -41 -31 -73 -66 -70 -78 2%0A-13 -14 -26 -36 -30 -32 -6 -216 -207 -222 -244 -1 -11 -22 -60 -78 -190 -38%0A-89 -68 -525 -38 -547 10 -7 35 -62 55 -123 20 -60 51 -132 69 -160 18 -27 34%0A-59 35 -70 2 -11 4 -31 6 -44 2 -13 17 -37 34 -54 69 -69 -129 -128 -447 -133%0A-119 -2 -204 -12 -204 -23 0 -11 -13 -15 -30 -9 -22 9 -30 -2 -30 -38 0 -51%0A-49 -69 -66 -24 -5 14 -16 18 -24 10 -9 -8 -5 -27 7 -42 18 -21 17 -33 -5 -51%0A-29 -24 -21 -102 10 -102 10 0 18 -10 18 -22 0 -12 18 -44 40 -72 22 -28 35%0A-59 29 -68 -6 -10 -3 -18 8 -18 21 0 113 -141 107 -165 -2 -8 6 -15 18 -15 13%0A0 19 -20 14 -47 -7 -37 -2 -46 24 -39 32 9 107 -137 107 -208 0 -14 7 -26 16%0A-26 9 0 16 -7 14 -15 -2 -8 12 -48 30 -89 18 -41 33 -104 33 -140 1 -49 6 -58%0A19 -37 22 34 18 44 69 -154 17 -68 32 -147 32 -174 0 -27 8 -54 18 -60 10 -6%0A25 -49 33 -96 17 -107 21 -123 49 -245 13 -55 26 -183 30 -284 4 -101 18 -203%0A31 -227 19 -36 18 -41 -4 -28 -22 14 -23 11 -1 -15 14 -18 18 -37 8 -44 -11%0A-6 -9 -39 3 -80 12 -38 28 -65 37 -60 8 5 50 -22 93 -61 43 -39 93 -71 112%0A-71 18 0 29 -7 24 -15 -12 -19 170 -29 447 -25 136 2 215 11 224 26 9 13 16%0A18 16 10 0 -8 51 4 113 25 133 46 155 47 191 13 51 -50 167 -110 221 -115 93%0A-8 383 -5 425 4 192 43 410 166 410 231 0 14 10 26 21 26 12 0 16 8 10 19 -6%0A10 6 31 29 46 22 16 35 33 29 39 -15 15 33 116 55 116 10 0 13 8 7 18 -6 11 3%0A33 20 50 24 24 25 32 5 33 -16 0 -13 8 9 21 20 11 31 29 24 39 -6 11 -1 19 11%0A19 12 0 17 9 10 20 -7 11 -3 20 9 20 11 0 21 10 21 22 0 37 167 407 194 428%0A13 11 27 45 31 76 4 32 17 63 29 70 43 28 110 186 132 313 19 115 27 131 67%0A131 24 0 56 12 71 26 14 14 67 37 116 52 50 14 103 36 119 49 23 19 26 16 15%0A-17 -14 -39 -13 -39 15 -2 16 21 42 32 59 25 17 -6 44 2 60 18 16 16 57 35 91%0A42 33 6 61 23 61 37 0 16 22 22 59 18 47 -6 68 5 101 52 23 33 48 58 56 57 37%0A-8 94 37 94 73 0 30 11 38 43 34 31 -4 48 7 58 40 7 25 47 87 88 136 134 162%0A181 322 181 620 0 120 -8 200 -20 200 -11 0 -20 26 -20 59 0 32 -9 64 -20 71%0A-11 7 -20 21 -20 32 0 11 11 14 25 5 17 -10 16 -4 -2 19 -15 19 -23 51 -18 72%0A7 26 2 36 -14 30 -14 -6 -36 4 -50 21 -14 17 -20 31 -12 31 8 0 -5 26 -28 58%0A-22 32 -41 73 -41 92 0 23 -10 30 -32 22 -25 -10 -30 -3 -22 27 7 30 -36 86%0A-183 234 -106 106 -191 201 -188 210 3 10 -9 17 -25 17 -17 0 -49 19 -72 42%0A-41 41 -309 132 -288 98 6 -10 -12 -33 -40 -52 -62 -40 -50 -186 19 -233 14%0A-10 13 -14 -4 -15 -15 0 -8 -17 17 -42 23 -23 54 -73 70 -111 18 -42 38 -63%0A52 -55 15 10 18 3 9 -21 -8 -20 -4 -48 8 -63 13 -14 17 -35 11 -45 -7 -11 -1%0A-23 12 -28 37 -12 49 -295 13 -317 -20 -13 -20 -17 -2 -18 14 0 25 -13 25 -30%0A0 -17 -18 -30 -40 -30 -22 0 -40 8 -40 17 0 9 -13 16 -30 16 -36 0 -40 -26 -5%0A-39 17 -6 11 -24 -20 -56 -106 -111 -483 -39 -647 123 -28 28 -62 48 -74 44%0A-13 -5 -33 15 -44 44 -10 28 -41 60 -68 70 -26 10 -51 28 -55 39 -10 29 -226%0A36 -259 9 -25 -20 -66 -32 -218 -63 -196 -41 -580 -10 -580 46 0 31 -55 56%0A-64 28 -3 -10 -30 18 -59 62 -59 91 -70 342 -20 436 14 25 20 63 13 85 -7 22%0A-6 39 3 37 39 -7 69 3 58 20 -6 10 13 24 41 31 29 7 47 19 40 25 -16 16 47 86%0A77 86 12 0 57 17 98 39 42 21 89 34 105 28 15 -6 28 -3 28 8 0 25 135 65 177%0A52 28 -9 29 -8 3 11 -25 18 -22 21 15 22 25 0 45 7 45 16 0 8 38 13 85 9 79%0A-5 81 -3 35 18 -47 23 -44 25 54 36 96 11 163 38 109 44 -52 5 -60 8 -75 22%0A-8 8 -2 16 14 16 15 1 53 5 83 9 31 4 51 -1 44 -11 -6 -11 -7 -19 -1 -19 6 0%0A20 18 32 40 18 33 16 37 -13 26 -26 -10 -31 -5 -21 22 9 21 6 29 -8 21 -11 -7%0A-25 5 -31 27 -6 22 -41 56 -79 76 -37 21 -68 46 -68 58 0 11 -8 8 -18 -7 -12%0A-19 -21 -21 -31 -5 -7 12 -40 22 -73 22 -33 0 -56 7 -51 15 5 9 -19 17 -54 20%0A-35 2 -180 13 -323 24 -268 20 -446 23 -385 7z m791 -228 c329 -27 372 -47%0A138 -64 -720 -53 -1180 -471 -1075 -979 82 -397 577 -553 1145 -362 l174 59%0A153 -146 c314 -299 607 -369 909 -216 369 187 327 708 -92 1136 -119 122 -60%0A110 87 -18 1148 -999 917 -2079 -476 -2219 l-131 -13 8 -115 c12 -165 -25%0A-310 -113 -441 -42 -63 -115 -202 -162 -310 -219 -498 -354 -760 -428 -825%0Al-74 -65 -292 0 c-488 0 -419 -125 -848 1528 -91 352 -110 296 161 465 212%0A132 219 139 220 208 l0 70 -310 126 c-393 160 -433 150 -84 -21 335 -165 337%0A-172 67 -340 -101 -63 -199 -126 -219 -140 -33 -25 -29 -49 78 -436 62 -226%0A149 -545 193 -710 43 -165 100 -372 126 -460 25 -88 40 -167 31 -175 -54 -56%0A-667 -99 -886 -62 -72 12 -74 14 -84 114 -48 485 -97 782 -182 1103 -114 428%0A-317 873 -518 1137 l-128 168 217 -10 c328 -16 546 38 722 177 l80 63 -99 99%0Ac-534 531 -246 1345 566 1603 204 65 658 121 810 100 17 -3 159 -15 316 -29z'/%3E%3Cpath d='M2493 2567 c-7 -8 -13 -73 -13 -145 1 -248 131 -372 411 -395 261%0A-20 262 -2 15 207 -119 100 -252 219 -295 264 -81 84 -95 92 -118 69z'/%3E%3Cpath d='M3860 2338 c-38 -33 -149 -115 -245 -184 -214 -151 -215 -154 -10%0A-154 255 0 355 87 355 309 0 107 -7 109 -100 29z'/%3E%3C/g%3E%3C/svg%3E%0A");
}

.whtsapp { color: #2c3e50 }

.OSPBluelogo{
    background-image: url("https://cdn.mypanel.link/bfc127/5t3brhj5wifjen7e.png");
    background-size:100% 100%;
}

.OSPBluelogokucuk{
    background-image: url("https://cdn.mypanel.link/bfc127/l758ok6ca3aw8a1u.png");
    background-size:100% 100%;
}

.width-30 {
    max-width: 300px;
    word-wrap: break-word
}

.navbar .navbar-wrap .navbar-prof .cuzdan {
    background: #f5f5f5;
    border-radius: 25px;
    font-size: 14px;
    font-weight: 600;
    padding: 5px 10px;
    color: #808080
}

body.dark .navbar .navbar-wrap .navbar-prof .cuzdan {
    background: #103765;
    color: #fff
}

/* Dark Mode CSS */

body.dark { background: #0e223a!important; color: #ccc; transition: 0.5s }
body.dark .well { background: #081828; border: 1px solid #081828; color: #fff }
body.dark .OSPBluelogo { background-image: url("https://cdn.mypanel.link/bfc127/72zzhl9uunhei50o.png"); }
body.dark .OSPBluelogokucuk { background-image: url("https://cdn.mypanel.link/bfc127/az9uzlfaqwqks9y8.png"); }
body.dark .p-menu ul.sideMenu, body.dark .p-menu { background: #081828 }
body.dark .navbar { background: #081828 }
body.dark .services-list { background: #041323 }
body.dark .user-details { background: #0e223a; border-color: #26466d }
body.dark .well-head { color: #6f8cae; border-color: #26466d }
body.dark .panel-body { background: #0e223a; color: #6f8cae; }
body.dark .form-control { background: #0e223a; border-color: #0e223a; color: #fff }
body.dark .user-details .media .media-body .side-user-name { color: #fff }
body.dark .p-menu ul.sideMenu li a { color: #fff }
body.dark .p-menu ul.sideMenu li a img {-webkit-filter: brightness(0) invert(1); filter: brightness(0) invert(1);}
body.dark .serv-input { background: #0e223a; color: #fff }
body.dark #serv-icon { background: #0e223a; border-color: transparent }
body.dark #serv-table.table>tbody>tr>td, body.dark #serv-table.table>tbody>tr>th, body.dark #serv-table.table>thead>tr>td, body.dark #serv-table.table>thead>tr>th { border-color: #26466d }
body.dark #serv-table.table tr { color: #fff; }
body.dark .serv-head { background: #1773db }
body.dark .modal-body1 { background: #0e223a; color: #fff }
body.dark .srv-search .srv-input { background: #0e223a; color: #fff }
body.dark label { color: #26466d }
body.dark .btn-secondary { background: #389f00 }
body.dark .tab-pane { color: #fff }
body.dark .table>tbody>tr>td, body.dark .table>tbody>tr>th, body.dark .table>tfoot>tr>td, body.dark .table>tfoot>tr>th, body.dark .table>thead>tr>td, body.dark .table>thead>tr>th { border-color: #26466d }
body.dark .table>tbody>tr>td { color: #fff }
body.dark .table>thead:first-child>tr:first-child>th  { color: #26466d }
body.dark .ticket-message-right .ticket-message { background: #26466d; color: #fff }
body.dark .ticket-message-left .ticket-message { background: #0e223a; color: #fff }
body.dark .ticket-message-left .info, body.dark .ticket-message-right .info { color: #fff }
body.dark pre { background: #0e223a; border-color: #0e223a; color: #fff }
body.dark #order-sItem, body.dark #order-cItem { background: #0e223a; color: #fff; border-color: #26466d }
body.dark #serv-table.table tr:nth-child(even), body.dark #serv-table.table tr:nth-child(odd) { background: transparent; }
body.dark #serv-table.table tr { border-color: #26466d }
body.dark .dash-anounce .da-item .item-content { background: #0e223a }