.headerbar {
    margin-top:10px;
    height:35px;
    background:#2E9AFE;
}
.logobar {
    margin-top:-2px; 
}
.menubtndiv {
    text-align: right !important;
}
.menubtn {
    margin-top:-3px;
    font-size: 12px !important;
}
.menubtn.btn-info {
    margin-right:10px;
}
.mobilemenubtn {
    display: none !important;
    background: #0488cd !important;
    font-size:24px !important;
    padding:1px 0 !important;
    width:37px;
    height:37px;
    position:absolute;
    right:7px;
    margin-top:-6px;
}
.menuiconbar {
    display:none;
    text-align: right;
    margin-top: 0;
}
.menuiconbtn {
    padding: 4px 7px;
    border-radius: 3px !important;
    background-color: #0488cd;
    color: #fff;
    width: 36px;
    height: 33px;
    line-height: 0 !important;
    display: inline-block;
    margin-top: -3px;
}
.menubar {
    display:inline-block;
    text-align:right;
}

.menuitem {
    font-size: 14px;
    display:inline;
    padding:14px 18px;
    -webkit-transition:all .4s ease-in-out;
    -moz-transition:all .4s ease-in-out;
    -o-transition:all .4s ease-in-out;
    -ms-transition:all .4s ease-in-out;
    transition:all .4s ease-in-out;
}
.menuitem a {
    color: #fff;
    font-weight: 600;
    font-size: 14px;
}
.menuitem a:hover {
    color: #fff;
}
.menuitem:hover {
    color: #fff;
    background:#252c34;
    border-bottom: 3px solid #0488cd;
    padding-bottom:11px;
}
.menuitem.current {
    background:#252c34;
    border-bottom: 3px solid #0488cd;
    padding-bottom:11px;
}
.msgsmenu img {
    border-radius: 12px;
    height: 28px !important;
    width: 28px !important;
    border: 1px solid #ddd;
    padding: 2px;
}
.menuitem ul li a {
    display:block;
    color:#fff;
    font-size:13px;
    line-height:13px;
    padding:10px 16px !important;
    border:0;
    text-align:left;
    border-top:1px solid #414f5a;
    -webkit-transition:all .4s ease-in-out;
    -moz-transition:all .4s ease-in-out;
    -o-transition:all .4s ease-in-out;
    -ms-transition:all .4s ease-in-out;
    transition:all .4s ease-in-out;
}
.menuitem ul li a:hover{
    color:#fff;
    background-color:#2f3843;
    padding-left:21px !important;
    padding-right:11px !important;
}
.menuitem ul {
    position:absolute;
    top:38px;
    left:-15px;
    min-width:150px;
    display:none;
    background-color:#252c34;
    z-index:999;
    border-radius:0 0 3px 3px;
    margin:-3px 0 0;
    box-shadow:0 1px 3px rgba(0,0,0,.04);
    -webkit-transition:all .4s ease-in-out;
    -moz-transition:all .4s ease-in-out;
    -o-transition:all .4s ease-in-out;
    -ms-transition:all .4s ease-in-out;
    transition:all .4s ease-in-out;
}
.menuitem div {
    display:inline-block;
    position:relative;
    margin-left: -3px;
}
.custom-select-blgls { 
    position: absolute;
    top:35px;
    background-color: #eee;
    display: none;
    min-width:200px;
    max-height:300px;
    overflow: auto;
    z-index: 999;
}

.custom-select-values {
    position: absolute;
    top:35px;
    background-color: #eee;
    display: none;
    min-width:200px;
    max-height:300px;
    overflow: auto;
    z-index: 999;
}

.custom-select-value {
    padding:5px 10px 5px 30px;
}

.custom-select-label {
    font-weight: 600;
    padding:5px 10px;
    font-size:13pt;
    background-color: #ccc;
}

.custom-select-value:hover {
    background-color: #ddd;
}

.form-control {
    margin-bottom: 20px;
}

.filterarea .form-control {
    margin-bottom: 0px;
}

.tr { 
  border-top: 1px solid #ddd;
  padding: 10px 8px;
}

.th {
  font-size: 13px;
  font-weight:600;
  padding: 8px;
}

.td {
  border: 0px;
  padding: 8px;
  text-align: left;
  z-index:2;
}

.action {
  z-index:1;
}

.icon-stars {
    line-height:10px;
}
.icon-star {
    width: 12px !important;
    display: inline-block !important;
    content:url('/img/star-no.svg');
}
.icon-star.on {
    content:url('/img/star.svg');
}
.icon-star.half {
    content:url('/img/star-half.svg');
}
.username {
    font-size: 13px;
    font-weight:700;
    line-height: 10px;
}
.orders-completion {
    line-height:15px;
    font-size:13px;
    color: #a8a8a8;
    margin-bottom: 10px; 
}
.order-platform {
    font-size:13px;
    font-weight:bold;
    margin-bottom: 27px; 
}
.order-platform img {
    width:30px;
}
.order-offer {
    font-size:14px;
    font-weight:600;
    margin-bottom: 17px; 
    line-height:20px;
}
.order-offer span {
    background-color:#6fae9b;
    border-radius:11px;
    padding:3px 6px;
    color:#fff;
    max-width:300px;
    display:inline-block;
}
.order-offer span span {
    font-size:12px;
    font-weight:normal;
}
.order-payment {
    font-size:14px;
    font-weight:600;
    margin-bottom: 17px; 
    line-height:20px;
}
.order-payment span {
    background-color:#4cbbe1;
    border-radius:11px;
    padding:3px 6px;
    color:#fff;
    max-width:300px;
    display:inline-block;
}
.order-payment span span {
    font-size:13px;
    font-weight:normal;
}
.platform-text {
    position:absolute;
    left:50px;
    line-height:15px;
}
.audienceno {
    font-weight:normal;
}
.niche {
    font-size:13px;
    font-weight:bold;
}
.nicheitem{
    margin-bottom:3px;
    padding:3px 3px;
    background-color:#1dcaff;
    border-radius:3px;
    font-size:9pt;
    font-weight:bold;
    color:#fff;
    line-height: 2.2;
}
.order-sample {
    font-size:13px;
    font-weight:bold;
}
.order-sample img {
    width:auto;
    height:20px;
}
.order-moreinfo {
    font-size:13px;
    font-weight:bold;
}
.order-moreinfo span, .niche span {
    color:#0488cd;
    font-size:13px;
    font-weight:normal;
    cursor:pointer;
}
.showhidemore:hover, .showhidemore:hover span {
    color:#727272;
}
.order-moreinfo-text {
    font-size:13px;
    height: 0;
    overflow: hidden;
    transition: height 1s;
}
.niches-content {
    height: 0;
    overflow: hidden;
    transition: height 1s;
}
.request {
    font-size: 14px;
    font-weight:bold;
    line-height: 10px;
    margin-top: 5px;
    background-color:#4cbbe1;
    border-radius:9px;
    padding:3px 6px;
    color:#fff;
}
.request span {
    font-size:12px;
    font-weight:normal;
}
.hidemoreinfo, .hidemoreniches, .brand {
    display:none;
}
.chevronicon {
    font-size:9px !important;
}
.collabobutton {
    font-weight:600;
    background:#329932;
    border-radius:18px;
    padding:4px 9px;
    color:#fff;
    text-align:center;
    display:inline-block;
    width:100%;
}
.collabobutton:hover {
    background:#008000;
}
.uploadimage {
    display: none !important;
}
.chatdiv {
    padding-top:7px;
    padding-bottom:4px;
    margin-bottom:50px;
    height:500px;
    background:#fff;
    border-radius:5px;
    -webkit-box-shadow: inset 0 2px 2px rgba(0, 0, 0, 0.075);
    -moz-box-shadow: inset 0 2px 2px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 2px 2px rgba(0, 0, 0, 0.075);
    -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
    -moz-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
    transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
}
.chatmsgsentdiv {
    text-align:right;
    padding:0px !important;
}
.chatmsgrcvddiv {
    padding:0px !important;
}
.chatmsg {
    font-size:10.5pt;
    font-weight:600;
    display:inline-block;
    line-height:18px;
    min-width:150px;
    max-width:75%;
    padding:5px 7px;
    margin-bottom:5px;
    border-radius:5px;
    text-align:left;
    -webkit-box-shadow: inset 0 2px 2px rgba(0, 0, 0, 0.075);
    -moz-box-shadow: inset 0 2px 2px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 2px 2px rgba(0, 0, 0, 0.075);
    white-space: pre-wrap;
    overflow-wrap: break-word;
}
.chatmsgtime {
    font-size:8pt;
    font-weight:normal;
    text-align:right;
    width:100%;
    padding:0;
    margin-bottom:-5px;
}
.chatmsg.sent {
    text-align: left;
    background:#647ab9;
    color:#fff;
    margin-right:0;
    border-radius: 15px 15px 0 15px;
}
.chatmsg.sent.moderator {
    background: #ff6000;
}
.chatmsg.received {
    background:#f0f2f5;
    border-radius: 0 15px 15px 15px;
}
.chatmsg.received.moderator {
    background: #ff6000;
    color: #fff;
}
.conversation {
    height:375px;
    overflow-y:auto;
}
.collabobutton.order {
    background: #329932;
    margin-bottom: 15px;
    max-width: 120px;
    cursor: not-allowed;
}
.collabobutton.follow {
    background: #0488cd;
    margin-bottom: 15px;
    max-width: 120px;
    cursor: not-allowed;
}
.collabobutton.follow:hover {
    background: #1678ab;
}
.collabobutton.cancel {
    background: #da0b0b;
    margin-bottom: 15px;
    max-width: 120px;
}
.collabobutton.cancel:hover {
    background: #c21414;
}
.collabobutton.moderator {
    background: #ffa500;
    margin-bottom: 15px;
    max-width: 120px;
    cursor: not-allowed;
}
.collabobutton.moderator:hover {
    background: #ff9000;
}
.collabobutton.disabled {
    background: #c5c6c5;
    margin-bottom: 15px;
    max-width: 120px;
    cursor: not-allowed;
}
.collaboitemsheader {
    display:block;
}
.servicepaymentlabel {
    display:none;
    font-size: 12px;
    font-weight:600;
    line-height: 10px;
    margin-bottom: 10px;
    color: #005900;
}
.online {
    background-color:#00b300;
    color:#fff;
    border-radius:4px;
    font-size:7pt;
    padding:1px 3px 0px 2px;
    margin-left:3px;
    position:absolute;
    top:-3px;
    font-weight:normal;
}
.actionbutton {
    font-weight:bold;
    padding: 2px 8px;
    background: #c5c6c5;
    border-radius: 6px;
    color: #fff;
    line-height: 24px;
}
.actionbutton.active {
    background: #7f7d9c;
}
.actionbutton:hover {
    background:#adadc9;
}
.resetbutton {
    padding: 0;
    background: transparent;
    color: #0488cd;
    font-size: 9pt;
    cursor: pointer;
    border: 0;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none !important;
}
.resetbutton-alt {
    padding: 0;
    background: transparent;
    color: #0488cd;
    font-size: 9pt;
    cursor: pointer;
    border: 0;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none !important;
    display: none;
}
.processingstatus {
    display:inline;
    font-size: 13px;
    font-weight: 600;
    line-height: 10px;
    margin-bottom: 10px;
    color: #ffa500;
}
.cancelledstatus {
    display:inline;
    font-size: 13px;
    font-weight: 600;
    line-height: 10px;
    margin-bottom: 10px;
    color: #da0b0b;
}
.completedstatus {
    display:inline;
    font-size: 13px;
    font-weight: 600;
    line-height: 10px;
    margin-bottom: 10px;
    color: #329932;
}
.modal, .moderatormodal, .ordercompletedmodal, .orderrejectedmodal, .deleteoffermodal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 999; /* Sit on top */
  padding-top: 100px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}
.stop-scrolling {
  height: 100%;
  overflow: hidden;
}
.deletecollabobutton {
    margin-top: 20px;
}
input[type=checkbox], input[type=radio] {
    height: 15px;
    -moz-box-shadow: none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none;
}
/* The container */
.radiocontainer {
    display: block;
    position: relative;
    padding-left: 30px;
    margin-bottom: 20px;
    cursor: pointer;
    font-size: 12px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/* Hide the browser's default radio button */
.radiocontainer input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}

/* Create a custom radio button */
.radiomark {
    position: absolute;
    top: 3px;
    left: 0;
    height: 19px;
    width: 19px;
    background-color: #eee;
    border-radius: 50%;
}

/* On mouse-over, add a grey background color */
.radiocontainer:hover input ~ .radiomark {
    background-color: #ccc;
}

/* When the radio button is checked, add a blue background */
.radiocontainer input:checked ~ .radiomark {
background-color: #2196F3;
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.radiomark:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the indicator (dot/circle) when checked */
.radiocontainer input:checked ~ .radiomark:after {
    display: block;
}

/* Style the indicator (dot/circle) */
.radiocontainer .radiomark:after {
    top: 6px;
    left: 6px;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: white;
}
@media (max-width: 991.50px) {
    .actionheader, .resetbutton {
        display:none;
    }
    .resetbutton-alt {
        display:inline;
        margin-left: 10px;
    }
    .collabobutton {
        margin-top:10px;
    }
    .menuiconbar {
        display:block;
    }
    .menubar {
        position:absolute !important;
        top:35px;
        right:7px;
        width:200px !important;
        background: #252c34;
        text-align: left;
        display: none;
    }
    .menuitem {
        position: relative;
        display:block;
        width:100%;
        padding: 10px 5px !important;
        border-bottom: 0 !important;
    }
    .menuitem:hover {
        color: #fff;
        background:#252c34;
        padding-left: 10px !important;
        padding-right: 0 !important;
    }
    .menuitem ul {
        position: relative;
        top: 10px;
        left: 20px;
    }
    .deletecollabobutton {
        margin-top: 10px;
    }
}
@media (max-width: 976px) {
    .servicepaymentlabel {
        display:block;
    }
    .collaboitemsheader {
        display:none;
    }
}
@media (max-width: 768px) {
    .menubtndiv {
        display: none;
        position: absolute !important;
        top: 35px;
        max-width: 180px;
        right: 7px;
        background: #0488cd;
        text-align: left;
        padding-top: 10px;
    }
    .menubtn {
        display: block;
        margin-top: 0;
        margin-bottom: 10px !important;
        margin-right: 0;
        float: none !important;
        width: 100%;
    }
    .mobilemenubtn {
        display: block !important;
    }
}
@media (max-width: 767.50px) {
    .td {
        text-align: center;
    }
    .order-platform {
        margin-left: 250px !important;
        text-align: left !important;
    }
}
@media (max-width: 700px) {
    .order-platform {
        margin-left: 200px !important;
        text-align: left !important;
    }
}
@media (max-width: 600px) {
    .order-platform {
        margin-left: 145px !important;
        text-align: left !important;
    }
}
@media (max-width: 500px) {
    .order-platform {
        margin-left: 95px !important;
        text-align: left !important;
    }
}
@media (max-width: 400px) {
    .order-platform {
        margin-left: 45px !important;
        text-align: left !important;
    }
}
@media (max-width: 300px) {
    .order-platform {
        margin-left: 25px !important;
        text-align: left !important;
    }
}