@font-face {

  font-family: NeoSansArabic;

  src: local("../fonts/NeoSansArabic"), local("../fonts/NeoSansArabic"), url(../fonts/NeoSansArabic.ttf);

}

@font-face {

  font-family: "JF_Flat";

  src: url("../fonts//JF-Flat-regular.eot");

  src: url("../fonts//JF-Flat-regular.eot?#iefix") format("embedded-opentype"), url("../fonts//JF-Flat-regular.svg#JF Flat Regular") format("svg"), url("../fonts//JF-Flat-regular.woff") format("woff"), url("../fonts//JF-Flat-regular.ttf") format("truetype");

  font-weight: normal;

  font-style: normal;

}

@font-face {

  font-family: DroidKufiRegular;

  src: local("../fonts/DroidKufi-Regular.ttf"), url(../fonts/DroidKufi-Regular.ttf);

}

@font-face {

  font-family: DroidKufiBold;

  src: local("../fonts/DroidKufi-Bold.ttf"), url(../fonts/DroidKufi-Bold.ttf);

}

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

     [  Start Basics ]

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

* {

  margin: 0;

  padding: 0;

  -webkit-box-sizing: border-box;

          box-sizing: border-box;

  outline: none;

  list-style: none;

}



body {

  color: #414d5f;

  background: #F8F9FA;

  line-height: 1.3;

  font-weight: 400;

  font-size: 14px;

  font-family: 'Cairo', sans-serif;

  text-align: right;

  overflow-x: hidden !important;

}



h1, h2, h3, h4, h5, h6 {

  font-weight: 500;

  line-height: 1.5;

  margin: 0;

}



h1 {

  font-size: 50px;

}



h2 {

  font-size: 35px;

}



h3 {

  font-size: 28px;

}



h4 {

  font-size: 22px;

}



h5 {

  font-size: 18px;

}



h6 {

  font-size: 15px;

}



p, .text {

  font-family: 'DroidKufiRegular', 'Cairo', sans-serif;

  font-size: 13px;

  color: #838c97;

  line-height: 30px;

  margin: 0;

}



.main-color {

  color: #FF6B6B !important;

}



.sub-color {

  color: #6E6EFF !important;

}



.third-color {

  color: #63D6FF !important;

}



.hot-color {

  color: #F76FFF !important;

}



.pcolor {

  color: #61D861 !important;

}



.main-bg-color {

  background-color: #FF6B6B !important;

  color: #fff;

}



.sub-bg-color {

  background-color: #6E6EFF !important;

  color: #fff;

}



.third-bg-color {

  background-color: #63D6FF !important;

  color: #fff;

}



.hot-bg-color {

  background-color: #F76FFF !important;

  color: #fff;

}



.pbg-color {

  background-color: #61D861 !important;

  color: #fff;

}



.wel-text .path a {

  color: #8d9aa8;

  font-size: 13px;

  font-family: 'JF_Flat', 'Cairo', sans-serif;

}

.wel-text .path a:last-of-type {

  color: #FF6B6B !important;

}

.wel-text .path span {

  margin: 0 20px;

}

.wel-text h6 {

  margin-bottom: 15px;

  font-weight: 700;

}



img {

  width: 100%;

  height: auto;

}



ul {

  margin-bottom: 0;

}



span, a, a:hover {

  display: inline-block;

  text-decoration: none;

  color: inherit;

}



a:focus, a:hover {

  color: inherit;

  outline: none;

}



.section-padding {

  padding: 100px 0;

}



.clear-fix {

  clear: both;

}



.sm-padding {

  padding: 0 10px;

}



.sam-height {

  height: 100%;

}



.half-padding {

  padding: 120px 5%;

}



.bg-gray {

  background: #F8F9FA;

}



.o-hidden {

  overflow: hidden;

}



.ontop {

  position: relative;

  z-index: 4;

}



.position-re {

  position: relative;

}



.full-width {

  width: 100% !important;

}



.lg-line-height {

  line-height: 1.5;

}



.bg-img {

  background-size: cover;

  background-repeat: no-repeat;

}



.bg-fixed {

  background-attachment: fixed;

}



.valign {

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-align: center;

  -ms-flex-align: center;

  align-items: center;

}



.export {

  background: #6E6EFF;

  color: #fff;

  font-weight: 600;

  font-size: 13px;

  position: fixed;

  left: -60px;

  top: 25vh;

  min-width: 100px;

  padding-left: 10px;

  -webkit-transition: all .4s;

  transition: all .4s;

}

.export:hover {

  color: #fff;

  left: 0;

}

.export:focus {

  color: #fff;

}

.export img {

  width: 40px;

  padding: 10px;

}



.owl-theme .owl-nav.disabled + .owl-dots {

  margin-top: 15px;

  display: inline-block;

}



.owl-theme .owl-dots {

  text-align: center;

}



.owl-theme .owl-dots .owl-dot span {

  width: 10px;

  height: 10px;

  margin: 0 5px;

  border-radius: 50%;

  background: rgba(200, 200, 200, 0.4);

}



.owl-theme .owl-dots .owl-dot.active span,

.owl-theme .owl-dots .owl-dot:hover span {

  background: #FF6B6B;

}



.stylebar {

  /* Track */

  /* Handle */

  /* Handle on hover */

}

.stylebar::-webkit-scrollbar {

  width: 5px;

}

.stylebar::-webkit-scrollbar-track {

  background: #f1f1f1;

}

.stylebar::-webkit-scrollbar-thumb {

  background: #ccc;

}

.stylebar::-webkit-scrollbar-thumb:hover {

  background: #888;

}



.styled-checkbox {

  position: absolute;

  opacity: 0;

  left: 0;

}

.styled-checkbox + label {

  position: relative;

  cursor: pointer;

  padding: 0;

  display: block;

  width: 100%;

  font-weight: 400;

}

.styled-checkbox + label:after, .styled-checkbox + label:before {

  position: absolute;

  left: 0;

}

.styled-checkbox + label:before {

  content: '';

  margin-right: 10px;

  display: inline-block;

  width: 20px;

  height: 20px;

  border-radius: 50%;

  background: #f8f8f8;

  border: 1px solid #eee;

}

.styled-checkbox:hover + label:before {

  background: #6E6EFF;

}

.styled-checkbox:focus + label:before {

  -webkit-box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.12);

          box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.12);

}

.styled-checkbox:checked + label:before {

  background: #6E6EFF;

}

.styled-checkbox:checked + label:after {

  content: '\f00c';

  position: absolute;

  left: 6px;

  top: 4px;

  font-size: 10px;

  font-family: "Font Awesome 5 Free";

  font-weight: 700;

  color: #fff;

}



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

     [ End Basics ]

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

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

     [  Start Buttons ]

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

.butn {

  padding: 11px 30px;

  background: transparent;

  border: 1px solid transparent;

  border-radius: 30px;

  -webkit-transition: all .4s;

  transition: all .4s;

}

.butn span {

  -webkit-transition: all .4s;

  transition: all .4s;

}

.butn.icon {

  padding: 12px 25px;

}

.butn.icon i {

  margin-left: 10px;

  padding-left: 10px;

  border-left: 1px solid transparent;

}

.butn.online {

  color: #FF6B6B;

}



.butn-bg {

  background: #FF6B6B;

  border-color: #FF6B6B;

}

.butn-bg:hover {

  background: #6E6EFF;

  border-color: #6E6EFF;

}

.butn-bg.icon i {

  color: #fff;

  border-left-color: rgba(200, 200, 200, 0.4);

}

.butn-bg span {

  color: #fff;

}



.butn-bord {

  border-color: #6E6EFF;

}

.butn-bord:hover {

  background: #6E6EFF;

  border-color: #6E6EFF;

}

.butn-bord:hover span {

  color: #fff;

}

.butn-bord.icon i {

  color: #6E6EFF;

  border-left-color: rgba(200, 200, 200, 0.4);

}

.butn-bord span {

  color: #6E6EFF;

}



.butn-bg.light {

  background: #fff;

  border-color: #fff;

}

.butn-bg.light:hover {

  background: #6E6EFF;

  border-color: #6E6EFF;

}

.butn-bg.light:hover span {

  color: #fff;

}

.butn-bg.light span {

  color: #FF6B6B;

}



.butn-gray {

  background: #f5f5f5;

}

.butn-gray:hover {

  background: #FF6B6B;

  border-color: #FF6B6B;

}

.butn-gray:hover span {

  color: #fff;

}

.butn-gray.icon i {

  border-left-color: rgba(0, 0, 0, 0.2);

}



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

     [ End Buttons ]

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

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

     [  Start Side-bar ]

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

.side-bar {

  position: fixed;

  top: 0;

  right: 0;

  height: 100vh;

  background: #fff;

  -webkit-box-shadow: 0 8px 10px 0 rgba(183, 192, 206, 0.2);

          box-shadow: 0 8px 10px 0 rgba(183, 192, 206, 0.2);

  width: 240px;

  padding-bottom: 40px;

  z-index: 99;

  -webkit-transition: all .5s;

  transition: all .5s;

  overflow-y: auto;

  overflow-x: hidden;

}

.side-bar.big {

  width: 380px;

}

.side-bar.big:hover {

  width: 380px !important;

}

.side-bar:hover {

  width: 240px !important;

  -webkit-transition: all .3s;

  transition: all .3s;

}

.side-bar:hover .user-profile .cont {

  visibility: visible !important;

  opacity: 1 !important;

  -webkit-transition-delay: .15s;

          transition-delay: .15s;

}

.side-bar:hover .nav-list li .text {

  visibility: visible !important;

  opacity: 1 !important;

  -webkit-transition: all .4s;

  transition: all .4s;

  -webkit-transition-delay: .15s !important;

          transition-delay: .15s !important;

}

.side-bar:hover .collapse.show {

  display: block;

}

.side-bar .bg-img {

  position: absolute;

  width: 100%;

  height: 40%;

  top: 0;

  left: 0;

  z-index: -1;

}

.side-bar .bg-img:before {

  background: #fff none repeat scroll 0 0;

  content: "";

  height: 100%;

  left: 0;

  opacity: 0.8;

  position: absolute;

  top: 0;

  width: 100%;

  z-index: 1;

}

.side-bar .bg-img:after {

  background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), to(white));

  background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, white 100%);

  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=0 );

  content: "";

  height: 100%;

  left: 0;

  position: absolute;

  top: 0;

  width: 100%;

  z-index: 1;

}

.side-bar .user-profile {

  position: relative;

  border-bottom: 1px solid #f8f8f8;

  padding: 20px 10px;

}

.side-bar .user-profile .profile-img {

  width: 45px;

  height: 45px;

  border-radius: 50%;

  overflow: hidden;

  cursor: pointer;

}

.side-bar .user-profile .cont {

  margin-right: 60px;

  line-height: 45px;

  position: absolute;

  top: 22px;

  -webkit-transition: all .4s;

  transition: all .4s;

}

.side-bar .user-profile .cont h6 {

  font-size: 13px;

}

.side-bar .user-profile .cont h6 strong {

  display: block;

}

.side-bar .nav-list {

  margin-top: 30px;

}

.side-bar .nav-list li {

  padding: 8px 0;

  font-size: 12px;

  position: relative;

  z-index: 3;

}

.side-bar .nav-list li a {

  padding: 0 15px 0 5px;

  width: 100%;

}

.side-bar .nav-list li:hover {

  background: #f8f8f8;

  color: #6E6EFF;

}

.side-bar .nav-list li:hover .text, .side-bar .nav-list li:hover i {

  color: #6E6EFF;

}

.side-bar .nav-list li .text {

  line-height: 30px;

  color: #4d575d;

  position: absolute;

  -webkit-transition: all .4s;

  transition: all .4s;

}

.side-bar .nav-list li .icon {

  width: 30px;

  display: inline-block;

  line-height: 30px;

}

.side-bar .nav-list li .drop-icon {

  position: absolute;

  left: 15px;

  top: 15px;

  z-index: -1;

}

.side-bar .nav-list li .card {

  padding: 0;

  border: 0;

  background: transparent;

}

.side-bar .nav-list li .card button {

  padding: 0;

  border: 0;

  background: transparent;

  text-align: right;

  width: 100%;

  outline: none !important;

}

.side-bar .nav-list li .card .card-body {

  padding: 20px 10px;

  background: #fbfbff;

}

.side-bar .nav-list li .card .card-body .card-body {

  background: #fff;

  margin-top: 20px;

}

.side-bar .nav-list li .card .card-body li {

  padding: 10px 0;

  color: #838c97;

}

.side-bar .nav-list li .card .card-body li a {

  width: auto;

}

.side-bar .nav-list li .card .card-body li:hover {

  color: #6E6EFF;

}

.side-bar .nav-list li .card .card-body li:hover i {

  color: #6E6EFF;

}

.side-bar .nav-list li .card .card-body li i {

  margin-left: 7px;

  color: #838c97;

}

.side-bar.small {

  width: 80px;

}

.side-bar.small .user-profile .cont {

  visibility: hidden;

  opacity: 0;

  overflow: hidden;

}

.side-bar.small .nav-list li .text {

  visibility: hidden;

  opacity: 0;

}

.side-bar.small .collapse {

  display: none;

}



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

     [ End Side-bar ]

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

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

    [  Start Main ]

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

main {

  padding: 20px 260px 20px 20px;

  overflow: hidden;

  -webkit-transition: all .5s;

  transition: all .5s;

}

main.full-width {

  padding-right: 100px !important;

}

main.small {

  padding: 20px 400px 20px 20px;

}

main.full {

  padding: 20px !important;

}



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

     [ End Main ]

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

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

     [  Start nav-top ]

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

.nav-top {

  background: #fff;

  padding: 15px;

  border-radius: 5px;

  -webkit-box-shadow: 0px 5px 20px rgba(200, 200, 200, 0.4);

          box-shadow: 0px 5px 20px rgba(200, 200, 200, 0.4);

  position: relative;

}

.nav-top.no-shadow {

  -webkit-box-shadow: none;

          box-shadow: none;

}

.nav-top .flex {

  display: inline-block;

  float: right;

}

.nav-top .toggle-icon, .nav-top .nav-full-icon {

  font-size: 25px;

  margin-left: 15px;

  cursor: pointer;

}

.nav-top .search-form form {

  position: relative;

}

.nav-top .search-form form input {

  width: 280px;

  padding: 8px 15px 8px 30px;

  border-radius: 30px;

  background: transparent;

  border: 1px solid #eee;

}

.nav-top .search-form form button {

  position: absolute;

  left: 5px;

  top: 0;

  border: 0;

  padding: 9px;

  background: transparent;

  outline: none;

  color: #838c97;

}

.nav-top .quick-links {

  float: left;

}

.nav-top .quick-links > ul > li {

  display: inline-block;

  margin-right: 40px;

  float: right;

}

.nav-top .quick-links > ul > li .item > div {

  position: relative;

}

.nav-top .quick-links > ul > li .item i {

  font-size: 20px;

  display: inline-block;

  height: 40px;

  line-height: 40px;

  cursor: pointer;

}

.nav-top .quick-links > ul > li .item .num {

  width: 16px;

  height: 16px;

  border-radius: 4px;

  position: absolute;

  right: -12px;

  top: 0px;

  text-align: center;

  line-height: 16px;

  color: #fff;

  font-size: 12px;

}

.nav-top .quick-links .user-area .profile-img {

  width: 40px;

  height: 40px;

  border-radius: 50%;

  overflow: hidden;

  cursor: pointer;

  -webkit-box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.05);

          box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.05);

}

.nav-top .quick-links .user-area .dropdown-menu {

  width: 180px;

}

.nav-top .quick-links .messages .num {

  background: #FF6B6B;

}

.nav-top .quick-links .noti .num {

  background: #3ACE9C;

}

.nav-top .quick-links .messages .dropdown-menu, .nav-top .quick-links .noti .dropdown-menu {

  padding: 20px 0;

}

.nav-top .quick-links .messages .dropdown-menu .head, .nav-top .quick-links .noti .dropdown-menu .head {

  margin-bottom: 30px;

  overflow: hidden;

  padding: 0 20px;

}

.nav-top .quick-links .messages .dropdown-menu .head span, .nav-top .quick-links .noti .dropdown-menu .head span {

  font-size: 13px;

}

.nav-top .quick-links .messages .dropdown-menu .head .clear, .nav-top .quick-links .noti .dropdown-menu .head .clear {

  float: left;

  color: #6E6EFF;

}

.nav-top .quick-links .messages .dropdown-menu ul, .nav-top .quick-links .noti .dropdown-menu ul {

  height: 280px;

  overflow: auto;

}

.nav-top .quick-links .messages .dropdown-menu li, .nav-top .quick-links .noti .dropdown-menu li {

  padding: 20px;

  border-top: 1px solid #f7f7f7;

}

.nav-top .quick-links .messages .dropdown-menu li .text, .nav-top .quick-links .noti .dropdown-menu li .text {

  width: 55px;

  height: 55px;

  line-height: 55px;

  text-align: center;

  background: #f7f7f7;

  float: right;

  border-radius: 50%;

  overflow: hidden;

  font-size: 20px;

}

.nav-top .quick-links .messages .dropdown-menu li .img, .nav-top .quick-links .noti .dropdown-menu li .img {

  width: 50px;

  height: 50px;

  float: right;

  border-radius: 50%;

  overflow: hidden;

  position: relative;

  bottom: -10px;

}

.nav-top .quick-links .messages .dropdown-menu li .cont, .nav-top .quick-links .noti .dropdown-menu li .cont {

  margin-right: 70px;

}

.nav-top .quick-links .messages .dropdown-menu li .cont h6, .nav-top .quick-links .noti .dropdown-menu li .cont h6 {

  margin-bottom: 5px;

  font-weight: 600;

  font-size: 14px;

}

.nav-top .quick-links .messages .dropdown-menu li .cont p, .nav-top .quick-links .noti .dropdown-menu li .cont p {

  font-size: 12px;

  line-height: 1.7;

  color: #4d575d;

}

.nav-top .quick-links .messages .dropdown-menu li .cont span, .nav-top .quick-links .noti .dropdown-menu li .cont span {

  font-size: 11px;

  color: #838c97;

  margin-top: 5px;

}

.nav-top .quick-links .messages .dropdown-menu .bottom, .nav-top .quick-links .noti .dropdown-menu .bottom {

  border-top: 1px solid #f5f5f5;

  text-align: center;

  padding: 20px 20px 0;

  color: #6E6EFF;

}

.nav-top .dropdown-menu {

  background: #fff;

  -webkit-box-shadow: 0 0 30px rgba(0, 0, 0, 0.1);

          box-shadow: 0 0 30px rgba(0, 0, 0, 0.1);

  width: 300px;

  border: none;

  border-radius: 0px;

  margin-top: 15px;

}

.nav-top .dropdown-menu:after {

  content: '';

  width: 0;

  height: 0;

  border-right: 8px solid transparent;

  border-left: 8px solid transparent;

  border-bottom: 10px solid #fff;

  position: absolute;

  top: -10px;

  left: 20px;

}

.nav-top .dropdown-menu .dropdown-item {

  padding: 10px 25px;

  line-height: 20px;

  font-size: 11px;

  color: #212529;

}

.nav-top .dropdown-menu .dropdown-item i {

  margin-left: 10px;

}

.nav-top .dropdown-menu .dropdown-item.logout {

  border-top: 1px solid #F8F9FA;

}

.nav-top .dropdown-menu .dropdown-item.logout .icon {

  margin-right: 15px;

  font-size: 18px;

  color: #FF6B6B;

  line-height: 20px;

  -webkit-transform: rotate(180deg);

          transform: rotate(180deg);

  position: relative;

  bottom: -3px;

  margin-left: 0;

}

.nav-top .dropdown-item.active, .nav-top .dropdown-item:active {

  background: #FF6B6B;

}



.nav-scroll {

  position: fixed;

  top: -100px;

  left: 0;

  width: 100%;

  -webkit-transition: -webkit-transform .5s;

  transition: -webkit-transform .5s;

  transition: transform .5s;

  transition: transform .5s, -webkit-transform .5s;

  -webkit-transform: translateY(100px);

          transform: translateY(100px);

  z-index: 9;

}



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

     [ End nav-top ]

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

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

     [  Start home-content ]

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

.home-content .welcome {

  margin: 50px 0;

}

.home-content .welcome .top-bar-chart {

  float: left;

  padding-top: 12px;

  width: 100%;

}

.home-content .welcome .top-bar-chart .quick-report {

  display: table;

  float: left;

  padding-right: 50px;

}

.home-content .welcome .top-bar-chart .quick-report h3 {

  font-size: 18px;

}

.home-content .welcome .top-bar-chart .quick-report-infos {

  float: left;

  padding-right: 18px;

}

.home-content .welcome .top-bar-chart .quick-report > svg {

  float: right;

  margin-top: 10px;

}

.home-content .panel-content .mini-stats-sec .widget {

  padding: 20px;

  background: #fff;

  border-radius: 7px;

  margin-bottom: 20px;

  overflow: hidden;

}

.home-content .panel-content .mini-stats-sec .widget .icon-circle {

  float: right;

}

.home-content .panel-content .mini-stats-sec .widget .icon-circle .icon {

  width: 65px;

  height: 65px;

  line-height: 65px;

  text-align: center;

  border-radius: 50%;

  font-size: 28px;

}

.home-content .panel-content .mini-stats-sec .widget .cont {

  margin-right: 80px;

}

.home-content .panel-content .mini-stats-sec .widget .cont p {

  margin-bottom: 5px;

}

.home-content .panel-content .mini-stats-sec .widget .cont p i {

  margin-left: 4px;

  font-size: 12px;

}

.home-content .panel-content .mini-stats-sec .total-sales-sec {

  padding: 40px 20px;

}

.home-content .panel-content .mini-stats-sec .total-sales-sec .circle-chart {

  float: right;

  margin-left: 35px;

  position: relative;

}

.home-content .panel-content .mini-stats-sec .total-sales-sec .circle-chart .cirlce-chart-detail {

  left: 0;

  margin-top: -6px;

  position: absolute;

  text-align: center;

  top: 50%;

  -webkit-transform: translateY(-50%);

          transform: translateY(-50%);

  width: 100%;

}

.home-content .panel-content .mini-stats-sec .total-sales-sec .circle-chart .cirlce-chart-detail span {

  margin-bottom: 4px;

}

.home-content .panel-content .mini-stats-sec .total-sales-sec .circle-chart svg.radial-progress {

  height: auto;

  max-width: 140px;

  -webkit-transform: rotate(-90deg);

          transform: rotate(-90deg);

  width: 100%;

}

.home-content .panel-content .mini-stats-sec .total-sales-sec .circle-chart svg.radial-progress circle {

  fill: rgba(0, 0, 0, 0);

  stroke: #fff;

  stroke-dashoffset: 219.91148575129;

  /* Circumference */

  stroke-width: 8;

}

.home-content .panel-content .mini-stats-sec .total-sales-sec .circle-chart svg.radial-progress circle.incomplete {

  opacity: 0.25;

}

.home-content .panel-content .mini-stats-sec .total-sales-sec .circle-chart svg.radial-progress circle.complete {

  stroke-dasharray: 219.91148575129;

  /* Circumference */

}

.home-content .panel-content .mini-stats-sec .total-sales-sec .circle-chart svg.radial-progress circle {

  stroke: #faa5ff;

}

.home-content .panel-content .mini-stats-sec .total-sales-sec .total-sales-info {

  display: table-cell;

  vertical-align: middle;

  width: 100%;

}

.home-content .panel-content .mini-stats-sec .total-sales-sec .total-sales-info > span {

  color: #777777;

  float: right;

  font-size: 12px;

  margin-bottom: 10px;

  width: 100%;

}

.home-content .panel-content .mini-stats-sec .total-sales-sec .total-sales-info > h3 {

  color: #4d575d;

  float: right;

  font-size: 21px;

  padding-bottom: 15px;

  margin-bottom: 6px;

  position: relative;

  width: 100%;

}

.home-content .panel-content .mini-stats-sec .total-sales-sec .total-sales-info > h3:before {

  background: #e6e6e6;

  bottom: 0;

  content: "";

  height: 1px;

  right: 0;

  position: absolute;

  width: 100px;

}

.home-content .panel-content .mini-stats-sec .total-sales-sec .total-sales-info > ul {

  float: right;

  margin: 20px 0 0;

  padding: 0;

  width: 100%;

}

.home-content .panel-content .mini-stats-sec .total-sales-sec .total-sales-info li {

  float: right;

  width: 33.3333%;

}

.home-content .panel-content .mini-stats-sec .total-sales-sec .total-sales-info li span {

  color: #777777;

  font-size: 13px;

}

.home-content .panel-content .mini-stats-sec .total-sales-sec .total-sales-info li h5 {

  color: #4d575d;

  font-size: 18px;

  margin: 4px 0 0;

}

.home-content .panel-content .activity {

  padding: 20px;

  background: #fff;

  border-radius: 7px;

  margin-bottom: 20px;

}

.home-content .panel-content .activity .title {

  margin-bottom: 40px;

}

.home-content .panel-content .activity .title .title-text {

  display: inline-block;

}

.home-content .panel-content .activity .title h6 {

  margin-bottom: 2px;

}

.home-content .panel-content .activity .title .tabs {

  float: left;

}

.home-content .panel-content .activity .title .tabs .nav-tabs {

  border: 1px solid #6E6EFF;

  border-radius: 5px;

  overflow: hidden;

}

.home-content .panel-content .activity .title .tabs .nav-item {

  padding: 8px 12px;

  border: 0;

  border-radius: 0;

  border-left: 1px solid #6E6EFF;

  font-size: 10px;

  cursor: pointer;

}

.home-content .panel-content .activity .title .tabs .nav-item:last-of-type {

  border: 0;

}

.home-content .panel-content .activity .title .tabs .nav-item:hover, .home-content .panel-content .activity .title .tabs .nav-item.active {

  background: #6E6EFF;

  color: #fff;

  -webkit-transition: all .2s;

  transition: all .2s;

}

.home-content .panel-content .activity .graph-details {

  margin-top: 40px;

  overflow: hidden;

}

.home-content .panel-content .activity .graph-details ul li {

  float: right;

  width: 50%;

}

.home-content .panel-content .activity .graph-details ul li span {

  padding: 2px 5px;

  border-radius: 2px;

  font-size: 11px;

  margin-bottom: 5px;

}

.home-content .panel-content .activity .graph-details ul li strong {

  font-weight: 400;

  margin-right: 20px;

}

.home-content .blocks .col-lg-4 {

  margin-bottom: 20px;

}

.home-content .blocks .item {

  height: 100%;

  padding: 30px 40px;

  background: #fff;

  border-radius: 7px;

  overflow: hidden;

  background-size: cover;

  background-repeat: no-repeat;

}

.home-content .blocks .product {

  position: relative;

}

.home-content .blocks .product .cont {

  position: absolute;

  bottom: 50px;

  left: 0;

  width: 100%;

  padding: 0 30px;

  color: #fff;

}

.home-content .blocks .product .cont h5 {

  font-weight: 600;

  margin-bottom: 10px;

}

.home-content .blocks .product .cont p {

  font-size: 12px;

  color: #eee;

}

.home-content .blocks .product .cont .price {

  margin-top: 15px;

  color: #FF6B6B;

  font-size: 18px;

  float: left;

}

.home-content .blocks .product .cont .price span {

  margin: 0 4px;

}

.home-content .blocks .product .cont .price .icon {

  font-size: 25px;

}

.home-content .blocks .product .cont .price .del {

  text-decoration: line-through;

  color: #eee;

  opacity: .7;

}

.home-content .blocks .clients .title p {

  font-size: 13px;

}

.home-content .blocks .clients .title form {

  margin-top: 15px;

}

.home-content .blocks .clients .title form input {

  width: 100%;

  padding: 10px;

  border: 1px solid #eee;

  border-radius: 30px;

}

.home-content .blocks .clients .chat-box {

  height: 230px;

  overflow: auto;

  margin-top: 40px;

}

.home-content .blocks .clients .chat-box li {

  margin-bottom: 30px;

  width: 100%;

}

.home-content .blocks .clients .chat-box li .user-status {

  position: relative;

  width: 50px;

  height: 50px;

  line-height: 50px;

  text-align: center;

  font-size: 20px;

  font-weight: 600;

  border-radius: 50%;

  float: right;

}

.home-content .blocks .clients .chat-box li .user-status:before {

  border-radius: 50%;

  content: "";

  height: 6px;

  right: 0;

  position: absolute;

  top: 0;

  width: 6px;

}

.home-content .blocks .clients .chat-box li .user-status.online:before {

  background: #5bdd5e;

}

.home-content .blocks .clients .chat-box li .user-status.offline:before {

  background: #ff6a7f;

}

.home-content .blocks .clients .chat-box li .user-status.away:before {

  background: #ffda2b;

}

.home-content .blocks .clients .chat-box li .client-info {

  padding-right: 65px;

  position: relative;

  vertical-align: middle;

  width: 100%;

}

.home-content .blocks .clients .chat-box li .client-info h3 {

  font-size: 16px;

  font-weight: 600;

}

.home-content .blocks .clients .chat-box li .client-info .icon {

  position: absolute;

  left: 10px;

  bottom: 10px;

  color: #838c97;

  font-size: 12px;

  opacity: .5;

}

.home-content .blocks .follow {

  text-align: center;

  position: relative;

}

.home-content .blocks .follow:before {

  background: #fff none repeat scroll 0 0;

  content: "";

  height: 100%;

  left: 0;

  opacity: 0.8;

  position: absolute;

  top: 0;

  width: 100%;

  z-index: 1;

}

.home-content .blocks .follow:after {

  background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), to(white));

  background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, white 100%);

  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=0 );

  content: "";

  height: 100%;

  left: 0;

  position: absolute;

  top: 0;

  width: 100%;

  z-index: 1;

}

.home-content .blocks .follow .top {

  position: relative;

  z-index: 2;

}

.home-content .blocks .follow .img {

  width: 85px;

  height: 85px;

  border-radius: 50%;

  border: 3px solid #eee;

  overflow: hidden;

  margin: 30px auto 20px;

}

.home-content .blocks .follow .butn {

  padding: 11px 35px;

  color: #FF6B6B;

  background: #fff;

  border-radius: 5px;

  margin: 30px 0 50px;

  font-size: 16px;

}

.home-content .blocks .follow .icons ul {

  overflow: hidden;

}

.home-content .blocks .follow .icons li {

  text-align: center;

  width: 33.33333%;

  float: right;

  margin-bottom: 20px;

}

.home-content .blocks .follow .icons li .icon {

  width: 40px;

  height: 40px;

  line-height: 40px;

  border-radius: 50%;

  margin: auto;

  margin-bottom: 10px;

  display: block;

}

.home-content .blocks .follow .icons li strong {

  font-weight: 600;

}

.home-content .blocks .tasks .title h6 {

  font-weight: 600;

}

.home-content .blocks .tasks .title p {

  font-size: 13px;

  margin-top: 5px;

}

.home-content .blocks .tasks form {

  position: relative;

  margin: 20px 0 40px;

}

.home-content .blocks .tasks form input {

  width: 100%;

  border: 1px solid #eee;

  border-radius: 30px;

  padding: 10px;

}

.home-content .blocks .tasks form button {

  background: transparent;

  border: 0;

  padding: 10px;

  position: absolute;

  left: 10px;

  top: 2px;

}

.home-content .blocks .tasks li {

  color: #838c97;

  font-size: 13px;

  padding: 10px 0;

  position: relative;

}

.home-content .blocks .tasks li i {

  position: absolute;

  height: 100%;

  width: 2px;

  right: -40px;

  top: 0;

}

.home-content .blocks .tasks li:last-of-type {

  margin-bottom: 0;

}

.home-content .blocks .chating .title h6 {

  font-weight: 600;

}

.home-content .blocks .chating .title p {

  font-size: 13px;

  margin-top: 5px;

}

.home-content .blocks .chating .chating-box {

  margin-top: 40px;

}

.home-content .blocks .chating .chating-box ul {

  max-height: 200px;

}

.home-content .blocks .chating .chating-box ul li {

  margin-bottom: 15px;

  overflow: hidden;

}

.home-content .blocks .chating .chating-box ul li span {

  border: 1px solid #f7f7f7;

  padding: 12px 15px;

  border-radius: 30px;

  font-size: 13px;

}

.home-content .blocks .chating .chating-box ul li.self span {

  float: left;

  background: #63D6FF;

  border-color: #63D6FF;

  color: #fff;

}

.home-content .blocks .chating .chating-box form {

  position: relative;

  margin-top: 40px;

}

.home-content .blocks .chating .chating-box form input {

  width: 100%;

  padding: 20px;

  background: #63D6FF;

  color: #fff;

  border: 0;

  border-radius: 5px;

}

.home-content .blocks .chating .chating-box form button {

  position: absolute;

  left: 0;

  top: 0;

  padding: 20px;

  background: transparent;

  border: 0;

  color: #fff;

  font-size: 20px;

}

.home-content .blocks .chating .chating-box form ::-webkit-input-placeholder {

  /* Chrome, Firefox, Opera, Safari 10.1+ */

  color: #eee;

  opacity: 1;

  /* Firefox */

}

.home-content .blocks .chating .chating-box form :-ms-input-placeholder {

  /* Chrome, Firefox, Opera, Safari 10.1+ */

  color: #eee;

  opacity: 1;

  /* Firefox */

}

.home-content .blocks .chating .chating-box form ::-ms-input-placeholder {

  /* Chrome, Firefox, Opera, Safari 10.1+ */

  color: #eee;

  opacity: 1;

  /* Firefox */

}

.home-content .blocks .chating .chating-box form ::placeholder {

  /* Chrome, Firefox, Opera, Safari 10.1+ */

  color: #eee;

  opacity: 1;

  /* Firefox */

}

.home-content .blocks .chating .chating-box form :-ms-input-placeholder {

  /* Internet Explorer 10-11 */

  color: #eee;

}

.home-content .blocks .chating .chating-box form ::-ms-input-placeholder {

  /* Microsoft Edge */

  color: #eee;

}

.home-content .blocks .twitter-feed .twitter-account {

  float: right;

  margin-bottom: 19px;

  width: 100%;

}

.home-content .blocks .twitter-feed .twitter-account i {

  color: #ace9ff;

  float: left;

  font-size: 58px;

  margin-right: 15px;

}

.home-content .blocks .twitter-feed .twitter-account h3 {

  color: #2e2e2e;

  display: block;

  font-size: 18px;

  margin: 10px 0 2px;

}

.home-content .blocks .twitter-feed .twitter-account span {

  color: #777777;

  font-size: 13px;

  font-weight: 300;

}

.home-content .blocks .twitter-feed .twitter-widget {

  margin-top: 20px;

}



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

     [ End home-content ]

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

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

     [  Start categories ]

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

.categories {

  padding: 50px 0 20px;

}

.categories .item {

  padding: 0 30px;

  min-height: 150px;

  -webkit-box-shadow: 0px 10px 30px -10px rgba(0, 0, 0, 0.1);

          box-shadow: 0px 10px 30px -10px rgba(0, 0, 0, 0.1);

  border-radius: 10px;

  margin-bottom: 30px;

  color: #fff;

  position: relative;

}

.categories .item:before, .categories .item:after {

  content: '';

  width: 85px;

  height: 85px;

  border-radius: 50%;

  background: rgba(255, 255, 255, 0.05);

  position: absolute;

}

.categories .item:before {

  left: -5px;

  top: 20px;

}

.categories .item:after {

  top: 80px;

  left: -25px;

}

.categories .item .icon {

  font-size: 30px;

  margin-bottom: 10px;

}

.categories .item h6 {

  font-weight: 600;

  line-height: 1.8;

}

.categories .blue {

  background: #289cf5;

  background: linear-gradient(135deg, #289cf5, #4f8bb7);

}

.categories .green {

  background: #65a986;

  background: linear-gradient(135deg, #23bdb8 0, #65a986 100%);

}

.categories .purple {

  background: #8e4cf1;

  background: linear-gradient(135deg, #8e4cf1 0, #c554bc 100%);

}

.categories .orange {

  background: #f48665;

  background: linear-gradient(135deg, #f48665 0, #d68e41 100%);

}

.categories .pink {

  background: #f953c6;

  background: linear-gradient(135deg, #f953c6, #b91d73);

}

.categories .life {

  background: #43e97b;

  background: linear-gradient(135deg, #43e97b 0, #38f9d7 100%);

}

.categories .plum {

  background: #764ba2;

  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);

}

.categories .heaven {

  background: #d9afd9;

  background: linear-gradient(135deg, #d9afd9 0, #97d9e1 100%);

}

.categories .care {

  background: #fdd6bd;

  background: linear-gradient(135deg, #f794a4 0, #fdd6bd 100%);

}

.categories.style2 {

  margin-top: 140px;

}

.categories.style2 .tab-content {

  display: none;

}

.categories.style2 .tab-content.current {

  display: block;

}

.categories.style2 .flip-box {

  text-align: center;

}

.categories.style2 .flip-box .front, .categories.style2 .flip-box .back {

  -webkit-box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.05);

          box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.05);

  border-radius: 5px;

  overflow: hidden;

  color: #fff;

}

.categories.style2 .flip-box .front p, .categories.style2 .flip-box .back p {

  color: #eee;

}

.categories.style2 .flip-box .front {

  padding: 50px 25px;

  position: relative !important;

}

.categories.style2 .flip-box .front:before, .categories.style2 .flip-box .front:after {

  content: '';

  width: 95px;

  height: 95px;

  border-radius: 50%;

  background: rgba(255, 255, 255, 0.05);

  position: absolute;

}

.categories.style2 .flip-box .front:before {

  left: -5px;

  top: 30px;

}

.categories.style2 .flip-box .front:after {

  top: 90px;

  left: -25px;

}

.categories.style2 .flip-box .back {

  padding: 0 25px;

  position: absolute !important;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

}

.categories.style2 .flip-box .back .icon {

  position: absolute;

  top: -20px;

  left: -20px;

  font-size: 120px;

  opacity: .1;

  -webkit-transform: rotate(30deg);

          transform: rotate(30deg);

  z-index: -1;

}

.categories.style2 .flip-box .icon {

  font-size: 50px;

  margin-bottom: 20px;

}

.categories.style2 .flip-box h6 {

  font-size: 18px;

}

.categories.style2 .flip-box p {

  font-size: 16px;

}

.categories.style3 {

  margin-top: 140px;

}

.categories.style3 .tab-content {

  display: none;

}

.categories.style3 .tab-content.current {

  display: block;

}

.categories.style3 .accordion .card {

  background: transparent;

  border: 0;

  border: 0 !important;

  border-radius: 5px;

  border-radius: 0;

  margin-bottom: 15px;

  text-align: right;

  -webkit-transition: all .4s;

  transition: all .4s;

}

.categories.style3 .accordion .card .card-header {

  background: transparent;

  border: 0;

  border-radius: 0;

  padding: 0;

}

.categories.style3 .accordion .card .card-header button {

  padding: 35px 30px;

  width: 100%;

  border: 0;

  color: inherit;

  text-align: right;

  text-decoration: none;

  outline: none;

  overflow: hidden;

  position: relative;

}

.categories.style3 .accordion .card .card-header button.collapsed:after {

  content: "\e64b";

  position: absolute;

  left: 15px;

  top: 50%;

  -webkit-transform: translateY(-50%);

          transform: translateY(-50%);

  font-family: 'themify';

  font-size: 11px;

  color: #fff;

}

.categories.style3 .accordion .card .card-header button:after {

  content: "\e648";

  position: absolute;

  left: 15px;

  top: 50%;

  -webkit-transform: translateY(-50%);

          transform: translateY(-50%);

  font-family: 'themify';

  font-size: 11px;

  color: #fff;

}

.categories.style3 .accordion .card .card-header button .icon {

  float: right;

  font-size: 20px;

  color: #eee;

  width: 50px !important;

  height: 50px;

  display: inline-block;

  line-height: 50px;

  text-align: center;

  border-radius: 50%;

  background: rgba(255, 255, 255, 0.05);

}

.categories.style3 .accordion .card .card-header button h6 {

  margin-right: 15px;

  font-size: 13px;

  font-weight: 600;

  line-height: 1.8;

  color: #fff;

}

.categories.style3 .accordion .card-body {

  background: #fff;

}

.categories.style3 .accordion .card-body li {

  margin-bottom: 20px;

  padding-right: 25px;

  position: relative;

}

.categories.style3 .accordion .card-body li:after {

  content: "\e64c";

  position: absolute;

  right: 0;

  top: 50%;

  -webkit-transform: translateY(-50%);

          transform: translateY(-50%);

  font-family: 'themify';

  font-size: 10px;

  color: #6E6EFF;

}



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

     [ End categories ]

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

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

     [  Start settings ]

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

.settings {

  margin-bottom: 50px;

}

.settings .col-lg-4 {

  margin-top: 50px;

}

.settings .item {

  padding: 40px 30px;

  background: #fff;

  border-radius: 5px;

  height: 100%;

}

.settings .item .head h5 {

  font-size: 16px;

  font-weight: 700;

  margin-bottom: 40px;

  padding-bottom: 20px;

  border-bottom: 1px solid #f7f7f7;

}

.settings .item form label {

  font-size: 12px;

  font-weight: 700;

  margin-bottom: 10px;

}

.settings .item form input {

  width: 100%;

  padding: 12px;

  background: #F8F9FA;

  border: 1px solid #F6F7FB;

  border-radius: 5px;

  margin-bottom: 30px;

}

.settings .item form.left-form {

  text-align: left;

}

.settings .item form.left-form input {

  text-align: left;

}

.settings .item button {

  width: 100%;

  padding: 12px;

  border: 1px solid #6E6EFF;

  background: #6E6EFF;

  color: #fff;

  -webkit-transition: all .4s;

  transition: all .4s;

  margin-top: 30px;

  cursor: pointer;

}

.settings .item button:hover {

  background: #61D861;

  border-color: #61D861;

}



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

     [ End settings ]

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

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

     [  Start users-list ]

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

.users-list {

  margin-top: 50px;

}

.users-list .search form {

  float: left;

  width: 100%;

  position: relative;

}

.users-list .search form input {

  width: 100%;

  padding: 15px;

  border: 1px solid #eee;

  border-radius: 5px;

}

.users-list .search form button {

  position: absolute;

  top: 0;

  left: 0;

  padding: 15px;

  border: 1px solid transparent;

  background: transparent;

  cursor: pointer;

}

.users-list .block-table {

  width: 100%;

  margin-top: 40px;

  padding: 40px 20px;

  background: #fff;

  border-radius: 5px;

  margin-bottom: 30px;

}

.users-list table {

  display: table;

}

.users-list tbody {

  width: 100%;

  font-family: 'JF_Flat', 'Cairo', sans-serif;

}

.users-list tbody tr {

  display: table-row;

}

.users-list tbody tr:nth-of-type(even) {

  background: #fbfbff;

  border-top: 1px solid #F6F7FB;

  border-bottom: 1px solid #F6F7FB;

}

.users-list tbody tr:nth-of-type(odd) {

  background: #fff;

  border: 0;

}

.users-list tbody tr th, .users-list tbody tr td {

  padding: 0 15px;

  height: 60px;

  vertical-align: middle;

  font-size: 13px;

  position: relative;

  color: #6c757d;

}

.users-list tbody tr th .img, .users-list tbody tr td .img {

  width: 40px;

  height: 40px;

  border-radius: 50%;

  border: 2px solid #fff;

  -webkit-box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.05);

          box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.05);

  overflow: hidden;

  margin-top: 10px;

  float: right;

}

.users-list tbody tr th .check-box, .users-list tbody tr td .check-box {

  position: absolute;

  right: 15px;

  top: 30px;

}

.users-list tbody tr th .check-box .custom-control-label:before, .users-list tbody tr th .check-box .custom-control-label:after, .users-list tbody tr td .check-box .custom-control-label:before, .users-list tbody tr td .check-box .custom-control-label:after {

  width: 15px;

  height: 15px;

  top: -7px;

  right: 0;

  cursor: pointer;

  border-radius: 50%;

}

.users-list tbody tr th span, .users-list tbody tr td span {

  margin-right: 10px;

  color: #6E6EFF;

  line-height: 60px;

  font-weight: 600;

  color: #414d5f;

}

.users-list tbody tr th i, .users-list tbody tr td i {

  display: inline-block;

  margin: auto;

  text-align: center;

  padding: 8px 11px;

  border-radius: 4px;

  background: #98a6ad;

  color: #fff;

  font-size: 10px;

  cursor: pointer;

  -webkit-transition: all .3s;

  transition: all .3s;

}

.users-list tbody tr th i:hover, .users-list tbody tr td i:hover {

  background: #83949C;

}



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

     [ End users-list ]

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

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

     [  Start reports ]

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

.reports {

  margin-top: 50px;

}

.reports .blocks {

  width: 100%;

  margin-top: 40px;

  padding: 40px 20px;

  background: #fff;

  border-radius: 5px;

  margin-bottom: 30px;

}

.reports .blocks .item {

  margin-bottom: 30px;

  position: relative;

}

.reports .blocks .item h6 {

  margin-bottom: 10px;

  padding-right: 5px;

  font-weight: 700;

  font-size: 14px;

}

.reports .blocks .aselect {

  position: relative;

}

.reports .blocks .aselect select {

  display: none;

}

.reports .blocks .select-selected, .reports .blocks input[type="text"] {

  width: 100%;

  padding: 12px;

  background: #F8F9FA;

  border: 1px solid #F6F7FB;

  border-radius: 5px;

}

.reports .blocks .select-selected:after {

  position: absolute;

  content: "";

  top: 20px;

  left: 10px;

  width: 0;

  height: 0;

  border: 6px solid transparent;

  border-color: #444 transparent transparent transparent;

}

.reports .blocks .select-selected.select-arrow-active:after {

  border-color: transparent transparent #444 transparent;

  top: 7px;

}

.reports .blocks .select-items div, .reports .blocks .select-selected {

  padding: 12px 20px;

  cursor: pointer;

  -webkit-user-select: none;

     -moz-user-select: none;

      -ms-user-select: none;

          user-select: none;

}

.reports .blocks .select-items {

  position: absolute;

  background-color: #6E6EFF;

  top: 100%;

  left: 0;

  right: 0;

  z-index: 99;

  -webkit-box-shadow: 0px 5px 10px rgba(200, 200, 200, 0.3);

          box-shadow: 0px 5px 10px rgba(200, 200, 200, 0.3);

  max-height: 200px;

  overflow: auto;

  /* Track */

  /* Handle */

  /* Handle on hover */

}

.reports .blocks .select-items::-webkit-scrollbar {

  width: 5px;

}

.reports .blocks .select-items::-webkit-scrollbar-track {

  background: #f1f1f1;

}

.reports .blocks .select-items::-webkit-scrollbar-thumb {

  background: #ccc;

}

.reports .blocks .select-items::-webkit-scrollbar-thumb:hover {

  background: #888;

}

.reports .blocks .select-items > div {

  background: #fff;

}

.reports .blocks .select-items > div:hover {

  color: #fff !important;

}

.reports .blocks .select-hide {

  display: none;

}

.reports .blocks .select-items div:hover, .reports .blocks .same-as-selected {

  background-color: rgba(0, 0, 0, 0.1);

}

.reports.style2 .blocks {

  background: #F8F9FA;

}

.reports.style2 .blocks h6 {

  color: #212529;

  position: relative;

  margin-bottom: 0;

  padding-right: 5px;

  font-weight: 700;

  font-size: 14px;

}

.reports.style2 .blocks h6 .icon {

  opacity: .5;

  margin-left: 15px;

}

.reports.style2 .blocks .dropdown button {

  text-align: right;

  width: 100%;

  padding: 18px;

  background: #fff;

  border: 1px solid #fff;

  border-radius: 5px;

  position: relative;

  outline: none !important;

}

.reports.style2 .blocks .dropdown button:after {

  position: absolute;

  left: 20px;

  top: 50%;

}

.reports.style2 .blocks .dropdown .dropdown-menu {

  width: 100%;

  top: 5px !important;

  border: 0;

  -webkit-box-shadow: 0px 5px 10px rgba(200, 200, 200, 0.3);

          box-shadow: 0px 5px 10px rgba(200, 200, 200, 0.3);

  max-height: 200px;

  position: relative;

  overflow: auto;

}

.reports.style2 .blocks .dropdown .dropdown-menu li {

  padding: 14px 20px;

  font-size: 13px;

  cursor: pointer;

  -webkit-user-select: none;

     -moz-user-select: none;

      -ms-user-select: none;

          user-select: none;

}

.reports.style2 .blocks .dropdown .dropdown-menu li:hover {

  background-color: #6E6EFF;

  color: #fff;

}

.reports.style2 .blocks.accordion .card {

  border: 0;

  background: transparent;

  border-radius: 0;

  margin-bottom: 15px;

}

.reports.style2 .blocks.accordion button {

  text-align: right;

  width: 100%;

  padding: 18px;

  background: #fff;

  border: 1px solid #fff;

  border-radius: 5px;

  position: relative;

  outline: none !important;

}

.reports.style2 .blocks.accordion button h6 {

  width: 100%;

  display: block;

}

.reports.style2 .blocks.accordion button h6 .icon {

  float: left;

}

.reports.style2 .blocks.accordion .card-body {

  background: #fff;

  margin-top: 15px;

  -webkit-box-shadow: 0px 5px 10px rgba(200, 200, 200, 0.3);

          box-shadow: 0px 5px 10px rgba(200, 200, 200, 0.3);

  max-height: 200px;

  position: relative;

  overflow: auto;

}

.reports.style2 .blocks.accordion .card-body li {

  padding: 14px 20px;

  font-size: 13px;

  cursor: pointer;

  -webkit-user-select: none;

     -moz-user-select: none;

      -ms-user-select: none;

          user-select: none;

}

.reports.style2 .blocks.accordion .card-body li:hover {

  background-color: #6E6EFF;

  color: #fff;

}

.reports.style2 .blocks.accordion .item h6 {

  padding-right: 5px;

}

.reports.style2 .blocks .form-group {

  position: relative;

  margin-top: 10px;

}

.reports.style2 .blocks .form-group .icon {

  position: absolute;

  left: 15px;

  top: 30%;

  font-size: 22px;

  opacity: .5;

}

.reports.style2 .blocks input[type="text"] {

  width: 100%;

  padding: 18px;

  background: #fff;

  border: 1px solid #fff;

  border-radius: 5px;

}



.reportup {

  margin-top: 40px;

  -webkit-transition: all .5s;

  transition: all .5s;

}

.reportup.down {

  margin-top: 100px !important;

}

.reportup .box {

  padding: 40px 20px;

  background: #fff;

  border-radius: 5px;

  margin-top: 40px;

  border-radius: 5px;

}

.reportup .box .search a {

  text-align: center;

  background: #6E6EFF;

  color: #fff;

  width: 100%;

  display: block;

  margin: auto;

  height: 100%;

  border-radius: 5px;

}

.reportup .box .search a:hover {

  opacity: .9;

}

.reportup .box .search a .icon {

  margin-top: 50%;

  -webkit-transform: translateY(-40%);

          transform: translateY(-40%);

  font-size: 20px;

}

.reportup .box .search a .icon i {

  display: block;

  font-size: 45px;

  margin-bottom: 15px;

}

.reportup .blocks .item {

  margin-bottom: 15px;

  position: relative;

}

.reportup .blocks .item:last-of-type {

  margin-bottom: 0;

}

.reportup .blocks .item button {

  text-align: right;

  width: 100%;

  padding: 14px 18px;

  background: #F8F9FA;

  border: 1px solid #F8F9FA;

  border-radius: 5px;

  position: relative;

  outline: none !important;

  color: #212529;

  font-weight: 600;

  font-size: 14px;

}

.reportup .blocks .item button .icon {

  float: left;

  opacity: .5;

}

.reportup .blocks .item h6 {

  margin-bottom: 10px;

  padding-right: 5px;

  font-weight: 700;

  font-size: 14px;

}

.reportup .blocks .modal-dialog {

  margin: auto;

  position: relative;

  width: 100%;

  height: 100%;

}

.reportup .date-box {

  text-align: center;

  border: 1px solid #eee;

  padding: 5px;

  border-radius: 5px;

  height: 100%;

  cursor: pointer;

}

.reportup .date-box .modal-content {

  background: #fff;

  padding: 10px 0 0;

  border-radius: 5px;

  max-width: 440px;

  max-height: 100%;

  margin-right: 20px;

  position: absolute;

  top: 50%;

  -webkit-transform: translateY(-50%);

          transform: translateY(-50%);

  border: 4px solid #eee;

  overflow: hidden;

}

.reportup .date-box .modal-content ul {

  max-height: 380px;

  overflow: auto;

}

.reportup .date-box .icon {

  color: #999;

  font-size: 40px;

  margin-bottom: 15px;

}

.reportup .date-box h6 {

  font-size: 13px;

  font-weight: 700;

}

.reportup .date-box .day {

  font-size: 34px;

  font-weight: 400;

  color: #6E6EFF;

  margin: 15px auto;

}

.reportup .date-box .month {

  font-weight: 400;

  font-size: 13px;

  color: #212529;

}

.reportup .date-box .modal-dialog {

  margin: auto;

  position: relative;

  width: 100%;

  height: 100%;

}

.reportup .modal-content {

  background: #fff;

  padding: 10px 0 0;

  border-radius: 5px;

  max-width: 320px;

  max-height: 500px;

  margin-right: 90px;

  position: absolute;

  top: 50%;

  -webkit-transform: translateY(-50%);

          transform: translateY(-50%);

  border: 4px solid #eee;

  overflow: hidden;

  /* Track */

  /* Handle */

  /* Handle on hover */

}

.reportup .modal-content ul {

  max-height: 380px;

  overflow: auto;

}

.reportup .modal-content::-webkit-scrollbar {

  width: 5px;

}

.reportup .modal-content::-webkit-scrollbar-track {

  background: #ccc;

}

.reportup .modal-content::-webkit-scrollbar-thumb {

  background: #777;

}

.reportup .modal-content::-webkit-scrollbar-thumb:hover {

  background: #888;

}

.reportup .modal-content li {

  padding: 12px 15px;

  position: relative;

}

.reportup .modal-content li label {

  margin-bottom: 0;

}

.reportup .modal-content li:hover {

  background: #F6F7FB;

}

.reportup .modal-content .confirm {

  margin-top: 10px;

  height: 40px;

}

.reportup .modal-content .confirm .butn {

  width: 100%;

  border-radius: 0;

  text-align: center;

  background: #6E6EFF;

  border-color: #6E6EFF;

}

.reportup .modal-content .confirm .butn:hover {

  background: #FF6B6B;

  border-color: #FF6B6B;

}

.reportup .modal-content .datepicker-inline {

  width: 100%;

  max-width: 100%;

  max-height: 100%;

  text-align: right;

}

.reportup .modal-content .datepicker-inline ul {

  width: 100%;

  max-width: 100%;

  height: auto;

  overflow: hidden;

}

.reportup .modal-content .datepicker-inline ul li {

  padding: 0;

}

.reportup .modal-content .datepicker-inline ul li[data-view="month current"] {

  width: calc(100% - 60px);

  color: #6E6EFF;

  font-weight: 700;

}

.reportup .modal-content .datepicker-inline ul li[data-view="month current"]:hover {

  background: transparent;

}

.reportup .modal-content .datepicker-inline ul[data-view="week"], .reportup .modal-content .datepicker-inline ul[data-view="days"] {

  text-align: center;

  margin: 10px auto;

}

.reportup .modal-content .datepicker-inline ul[data-view="week"] li, .reportup .modal-content .datepicker-inline ul[data-view="days"] li {

  float: none;

  text-align: center;

  display: inline-block;

  height: 50px;

  width: 50px;

  line-height: 50px;

  border-radius: 50%;

}

.reportup .modal-content .datepicker-inline ul[data-view="week"] {

  background: #f7f7f7;

}

.reportup .modal-content .datepicker-inline ul[data-view="week"] li {

  background: transparent;

}

.reportup .modal-content .datepicker-inline ul[data-view="days"] .picked {

  background: #6E6EFF;

  color: #fff;

}

.reportup .modal-content .datepicker-inline ul[data-view="days"] .muted {

  color: #ccc;

}



.reports-table {

  min-width: 900px;

  overflow: auto;

  width: 100%;

  margin-top: 40px;

  padding: 40px 20px;

  background: #fff;

  border-radius: 5px;

  margin-bottom: 30px;

  text-align: left;

  direction: ltr;

  /* Track */

  /* Handle */

  /* Handle on hover */

}

.reports-table::-webkit-scrollbar {

  width: 5px;

}

.reports-table::-webkit-scrollbar-track {

  background: #f1f1f1;

}

.reports-table::-webkit-scrollbar-thumb {

  background: #ccc;

}

.reports-table::-webkit-scrollbar-thumb:hover {

  background: #888;

}

.reports-table table {

  display: table;

}

.reports-table tbody {

  width: 100%;

  font-family: 'JF_Flat', 'Cairo', sans-serif;

}

.reports-table tbody .header {

  background: #6E6EFF !important;

}

.reports-table tbody .header th {

  color: #fff !important;

  border-right: 1px solid rgba(255, 255, 255, 0.1);

}

.reports-table tbody tr {

  display: table-row;

}

.reports-table tbody tr:nth-of-type(odd) {

  background: #fbfbff;

  border-top: 1px solid #F6F7FB;

  border-bottom: 1px solid #F6F7FB;

}

.reports-table tbody tr th, .reports-table tbody tr td {

  padding: 0 15px;

  height: 60px;

  vertical-align: middle;

  font-size: 13px;

  position: relative;

  color: #6c757d;

}

.reports-table tbody tr td {

  padding: 0 5px 0 15px;

}

.reports-table tbody .popimg {

  text-align: center;

}

.reports-table tbody .popimg i {

  display: inline-block;

  margin: auto;

  text-align: center;

  padding: 7px 8px;

  border-radius: 4px;

  background: #98a6ad;

  color: #fff;

  font-size: 10px;

  cursor: pointer;

  -webkit-transition: all .3s;

  transition: all .3s;

}

.reports-table tbody .popimg i:hover {

  background: #83949C;

}

.reports-table tbody .popimg span {

  display: block;

  font-weight: 600;

  font-size: 10px;

  margin-top: 5px;

}



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

     [ End reports ]

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

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

     [ Start datepicker ]

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

.ui-widget.ui-widget-content {

  min-width: 350px;

}



.ui-state-default, .ui-widget-content .ui-state-default {

  background: transparent;

  border: 0;

  padding: 15px;

}



.ui-widget.ui-widget-content {

  border-color: #eee;

}



.ui-widget-header {

  background: #fafafa;

  border: 0;

  padding: 5px !important;

}



.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next {

  top: 5px;

}



thead {

  border-bottom: 1px solid #f5f5f5;

}



.ui-datepicker th {

  padding: 12px;

}



tbody {

  padding: 10px;

}

tbody tr {

  display: table-row;

}

tbody tr:nth-of-type(odd) {

  background: #fbfbff;

  border-top: 1px solid #F6F7FB;

  border-bottom: 1px solid #F6F7FB;

}

tbody tr th, tbody tr td {

  padding: 0 15px;

  vertical-align: middle;

  font-size: 13px;

  position: relative;

  color: #6c757d;

}



.ui-state-default {

  text-align: center !important;

  color: #888 !important;

}



.ui-state-hover {

  background: #6E6EFF !important;

  color: #fff !important;

}



.ui-state-highlight.ui-state-active {

  color: #fff !important;

  background: #FF6B6B !important;

}



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

     [ End datepicker ]

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

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

     [ Start Footer ]

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

footer {

  padding-bottom: 30px;

}



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

     [ End Footer ]

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

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

 	 [ 16 Responsive ]

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

@media screen and (min-width: 1200px) {

  .container {

    max-width: 1200px;

  }

}

@media screen and (max-width: 991px) {

  .nav-top {

    display: none;

  }



  .nav-mobile {

    display: block;

  }



  .about .feat {

    margin-top: 30px;

  }



  .about .feat li {

    display: inline-block;

  }



  .numbers .item {

    margin: 10px 0;

  }



  .contact .contact-info .item {

    text-align: center;

  }

  .contact .contact-info .item .icon {

    float: none;

    border: 0;

    padding: 0;

    margin-bottom: 20px;

  }

  .contact .contact-info .item .cont {

    margin: 0;

  }



  .register .register-info {

    margin-top: 50px;

  }



  .order-1 {

    -webkit-box-ordinal-group: 3 !important;

        -ms-flex-order: 2 !important;

            order: 2 !important;

  }



  .order-2 {

    -webkit-box-ordinal-group: 2 !important;

        -ms-flex-order: 1 !important;

            order: 1 !important;

  }

}

@media screen and (max-width: 767px) {

  .details .block .img .title h5 .price {

    display: block;

    margin-top: 5px;

    float: none;

  }

}



/*# sourceMappingURL=style.css.map */



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

     [ End datepicker ]

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

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

     [ Start Footer ]

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

footer {

  padding-bottom: 30px;

}



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

     [ End Footer ]

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



.accordion .card-body{

    display:none;

}

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

     [ Start User Pages ]

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

.login {

  background: #F3F9FF;

  padding: 120px 0;

}

.login .box {

  padding: 40px 40px 60px;

  border-radius: 10px;

  background: #fff;

  -webkit-box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.1);

          box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.1);

}

.login .box .title {

  padding: 20px;

  text-align: center;

  color: #fff;

  background: #6E6EFF;

  border-radius: 10px;

  margin-bottom: 50px;

}

.login .box .title h4 {

  margin-bottom: 10px;

  font-weight: 700;

}

.login .box .title p {

  color: #eee;

  font-size: 12px;

}

.login .box form {

  padding: 0 50px;

}

.login .box form .form-group {

  padding: 0;

  margin: 0;

  position: relative;

  margin-bottom: 30px;

}

.login .box form .form-group i {

  position: absolute;

  left: 20px;

  top: 17px;

  font-size: 17px;

  color: #999;

}

.login .box form input {

  width: 100%;

  background: #f7fbff;

  padding: 15px 15px 15px 50px;

  font-size: 14px;

  border: 1px solid #f9f9f9;

  outline: none;

  color: #333;

  border-radius: 50px;

}

.login .box form button {

  cursor: pointer;

  padding: 14px;

  border-radius: 50px;

  width: 100%;

  border: 0;

  background: #FF6B6B;

  color: #fff;

  -webkit-transition: all .5s;

  transition: all .5s;

}

.login .box form button:hover {

  background: #61D861;

}

.login .box .bottom {

  text-align: center;

  margin-top: 20px;

}

.login .box .bottom p a {

  color: #6E6EFF;

}

.login.register form {

  padding: 0;

}

.login ::-webkit-input-placeholder {

  color: #999;

  opacity: 1;

}

.login :-ms-input-placeholder {

  color: #999;

  opacity: 1;

}

.login ::-ms-input-placeholder {

  color: #999;

  opacity: 1;

}

.login ::placeholder {

  color: #999;

  opacity: 1;

}

.login :-ms-input-placeholder {

  color: #999;

}

.login ::-ms-input-placeholder {

  color: #999;

}



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

     [ End User Pages ]

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

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

   [ 16 Responsive ]

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

@media screen and (min-width: 1200px) {

  .container {

    max-width: 1200px;

  }

}



/*# sourceMappingURL=style.css.map */