/*------------------------------------------------------------------
[Master Stylesheet]

Project     :	Fickle Responsive Admin Template
Version     :	1.0
Author      : 	AimMateTeam
URL         :   http://aimmate.com
Support     :   aimmateteam@gmail.com
Primary use :	Dashboard

-------------------------------------------------------------------*/

@import "../font-awesome/css/font-awesome-rtl.css";

@import url(http://fonts.googleapis.com/css?family=Armata|PT+Sans|Montserrat:700,400);

@import url('plugins/nanoscroller-rtl.css');

@import url('plugins/switchery-rtl.css');

@import url('plugins/bootstrap-switch-rtl.css');

/*------------------------------------------------------------------
[Table of contents]

+ BODY
+ HEADER
+ NAVIGATION
+ BREADCRUMB
+ MAIN WRAPPER
+ RIGHT WRAPPER
+ DASHBOARD
+ EMAIL
+ CHARTS
+ FORM STAFFS
+ TIME-LINE
+ TABLE
+ NOTIFICATION
+ TASK & NOTE
+ CALENDER
+ MAPS
+ GALLERY
+ MEDIA
+ PRICING TABLE
+ PROFILE
+ LOGIN
+ COMING SOON
+ WIDGETS
+ PANEL
+ ICONS
+ FOOTER
+ UI ELEMENTS
+ MEDIA PLAYER @NEW v1.1
+ TREE VIEW    @NEW v1.1
+ FLUID BOX    @NEW v1.1

-------------------------------------------------------------------*/

/*------------------------------------------------------------------
# [Color codes]

# Black ( navigation background ) : #3F414D;
# Blue ( navigation background ) : #5EBFD8;
# Deep Blue ( navigation background ) : #3A515A;
# Red ( navigation background ) : #FF7878;
# Light Green ( navigation background ) : #1FB5AD;
# Light Purple ( hover navigation background ) : #7a8b83;

-------------------------------------------------------------------*/

/*------------------------------------------------------------------
[Typography]

Headers Logo:		28px 'Montserrat', sans-serif;
Body copy:		    14px 'PT Sans', sans-serif;
Headers:		    20px 'Armata', sans-serif;
Panel heading:	    15px 'Armata', sans-serif;
Input, textarea:	14px 'PT Sans', sans-serif;

-------------------------------------------------------------------*/

/*------------------------------------------------------------------
   -------------------------BODY---------------------------------
-------------------------------------------------------------------*/

body {
  direction: rtl;
  font-family: 'PT Sans', sans-serif;
  font-size: 16px;
  height: 100%;
  background: #f9f9f9;
}

body.single-page {
  background: #565656;
  direction: rtl;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: 'Armata', sans-serif;
}

ul.mainNav li a {
  font-family: 'Armata', sans-serif;
}

h1 {
  font-size: 24px;
}

h2 {
  font-size: 22px;
}

h3 {
  font-size: 20px;
}

h4 {
  font-size: 18px;
}

h5 {
  font-size: 16px;
}

h6 {
  font-size: 14px;
}

p {
  line-height: 23px;
}

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px dashed #e0e0e0;
  margin: 1em 0;
  padding: 0;
}

pre {
  border-radius: 1px;
  -moz-border-radius: 1px;
  -webkit-border-radius: 1px;
}

label {
  font-weight: 400;
}

text {
  font-weight: normal;
}

/*-----------------------------------------------------------------*/

/*------------------------------------------------------------------
   -------------------------HEADER---------------------------------
-------------------------------------------------------------------*/

.ls-header {
  font-size: 15px;
}

.ls-top-header {
  margin-bottom: 15px;
  margin-top: 5px;
}

nav {
  background: #555557;
}

.header-logo {
  text-align: center;
  width: 220px;
  float: right;
}

.header-logo a {
  line-height: 50px;
}

.header-logo a span {
  font-size: 28px;
  font-family: 'Montserrat', sans-serif;
  color: #f2f2f2;
  margin: 0;
  padding: 0;
  line-height: 50px;
  text-transform: uppercase;
}

.header-logo a:hover {
  text-decoration: none;
}

#main-container {
  width: 100%;
  height: 100%;
  background: #ffffff;
  color: #565656;
}

/*-----------------------------------------------------------------*/

/*------------------------------------------------------------------
  -------------------------- NAVIGATION -------------------------
-------------------------------------------------------------------*/

/*** Top Navigation ***/

.menu-control {
  float: right;
  line-height: 38px;
  margin-right: 5px;
  text-align: center;
}

.menu-control a {
  color: #ffffff;
  outline: none;
}

.menu-control a:hover {
  color: #FF7878;
}

.menu-control a i {
  line-height: 25px;
  font-size: 18px;
}

.top-navigation ul {
  list-style: none;
  padding: 0;
  margin: 0;
  float: left;
}

.top-navigation ul li {
  display: inline-block;
}

.top-navigation ul li a {
  color: #ffffff;
  text-decoration: none;
  line-height: 17px;
  outline: none;
  padding: 10px 15px;
  display: inline-block;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  font-size: 18px;
}

.top-navigation ul li a:hover {
  background: #7a8b83;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

.top-navigation ul li a.right-sidebar,
.top-navigation ul li a.right-sidebar-setting {
  -webkit-transition: none 0.3s ease-in-out;
  -moz-transition: none 0.3s ease-in-out;
  -o-transition: none 0.3s ease-in-out;
  transition: none 0.3s ease-in-out;
}

.top-navigation ul li.only-phone {
  display: none;
}

.top-navigation ul li.only-phone a {
  -webkit-transition: none 0.3s ease-in-out;
  -moz-transition: none 0.3s ease-in-out;
  -o-transition: none 0.3s ease-in-out;
  transition: none 0.3s ease-in-out;
}

.top-navigation ul li.only-phone a:hover {
  background: none;
  color: #FF7878;
  -webkit-transition: none 0.3s ease-in-out;
  -moz-transition: none 0.3s ease-in-out;
  -o-transition: none 0.3s ease-in-out;
  transition: none 0.3s ease-in-out;
}

.search-box {
  float: right;
  margin-right: 5px;
  text-align: center;
}

.search-box ul li a span {
  font-size: 18px;
  line-height: 12px;
}

.search-box input[type=search] {
  background: url("../../images/b.png") no-repeat scroll 9px center / 19px 19px #f2f2f2;
  border: none;
  color: #000;
  cursor: auto;
  height: 40px;
  outline: 0;
  padding-right: 32px;
  width: 320px;
  -webkit-appearance: textfield;
  -webkit-box-sizing: content-box;
  font-family: inherit;
  font-size: 100%;
}

.search-box input::-webkit-input-placeholder {
  color: #999;
}

.search-box input::-webkit-search-decoration,
.search-box input::-webkit-search-cancel-button {
  display: none;
}

/*Top dropDown navigation Start*/

.top-navigation li.open:after {
  border-bottom: 6px solid #FF7878;
  border-right: 6px solid rgba(0, 0, 0, 0);
  border-left: 6px solid rgba(0, 0, 0, 0);
  content: "";
  display: inline-block;
  position: absolute;
  left: 18px;
  top: 33px;
  z-index: 1;
}

.red-color .top-navigation li.open:after {
  border-bottom: 6px solid #C45C5C;
}

.top-navigation li a span.badge {
  /**** Issue Fixed @new ***/
  font-size: 10px;
  font-weight: normal;
  padding: 0;
  position: absolute;
  left: 5px;
  text-align: center;
  top: 4px;
  font-family: 'Pontano Sans', sans-serif;
  height: 15px;
  width: 15px;
  line-height: 15px;
  display: block;
  border-radius: 50%;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
}

.top-navigation .dropdown-menu.right {
  right: auto;
  left: 0;
}

.top-navigation .dropdown-menu {
  margin: 0;
  border-radius: 1px;
  -moz-border-radius: 1px;
  -webkit-border-radius: 1px;
  padding: 0;
  border: none;
  min-width: 275px;
}

.top-navigation .dropdown-menu h4 {
  padding: 10px;
  margin: 0;
  font-size: 14px;
  color: white;
  background: #ff7878;
}

.red-color .top-navigation h4 {
  background: #C45C5C;
}

.top-navigation .dropdown-menu ul {
  list-style: none;
  padding: 0;
  margin: 0;
  float: none;
}

.top-navigation .dropdown-menu ul li.only-link {
  text-align: center;
  padding: 5px 0;
  border-bottom: none;
  margin-top: 0;
}

.top-navigation .dropdown-menu ul li.only-link a {
  font-size: 14px;
}

.ls-feed {
  list-style: none;
  padding: 0;
  margin: 0;
}

.ls-feed li {
  background-color: #e0e0e0;
  font-size: 14px;
  line-height: 14px;
  margin-bottom: 10px;
  padding: 10px 33px 10px 0;
  position: relative;
}

.top-navigation ul.ls-feed li {
  display: block;
}

.top-navigation ul.ls-feed li a {
  padding: 0;
  color: #6e6e6e;
  display: block;
  line-height: 22px;
  font-size: 14px;
}

.top-navigation ul.ls-feed li a:hover {
  background: none;
}

.ls-feed li .label {
  border-radius: 50%;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  right: 7px;
  line-height: 11px;
  padding: 5px;
  position: absolute;
  top: 11px;
  height: 20px;
  width: 20px;
}

.feed-box .ls-feed li .label {
  top: 7px;
  padding: 5px 0;
}

.ls-feed li .date {
  padding-left: 10px;
  text-align: left;
  font-style: italic;
  font-size: 12px;
  float: left;
  direction: ltr;
}

.dropdown-menu.top-notification h4 {
  color: white;
  background: #ff7878;
}

.red-color .dropdown-menu.top-notification h4 {
  background: #C45C5C;
}

.dropdown-menu.top-notification .ls-feed li {
  margin-bottom: 0;
  border-bottom: 1px dotted #cbc5ba;
  background: white;
  color: dimgrey;
}

/*Top dropDown navigation end*/

/*** Left Navigation ***/

#left-navigation {
  width: 200px;
  background: #58595B;
  float: right;
  position: absolute;
  right: 0;
  height: 100%;
  overflow: visible !important;
}

#left-navigation.active {
  width: 50px;
}

#left-navigation .user-image {
  margin: 10px auto;
  width: 80px;
  position: relative;
}

#left-navigation.active .user-image {
  width: 40px;
}

#left-navigation .user-image img {
  border-radius: 50%;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  overflow: hidden;
}

#left-navigation.active .user-image {
  width: 40px;
}

#left-navigation.active .user-image img {
  width: 40px;
}

#left-navigation .user-online-status {
  display: block;
  right: 0;
  position: absolute;
  top: 10px;
}

#left-navigation.active .user-online-status {
  top: -5px;
}

#left-navigation.active .social-icon {
  display: none;
}

#left-navigation .social-icon {
  list-style: none;
  margin: 0 0 5px;
  padding: 0;
  text-align: center;
}

#left-navigation .social-icon li {
  display: inline-block;
  margin: 0 5px;
}

#left-navigation .social-icon li a {
  color: #FF7878;
  font-size: 15px;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

#left-navigation .social-icon li a:hover {
  color: #FFFFFF;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

.black-color #left-navigation {
  background: #444755;
}

.blue-color #left-navigation {
  background: #53A2B8;
}

.deep-blue-color #left-navigation {
  background: #324E59;
}

.red-color #left-navigation {
  background: #DD7878;
}

.light-green-color #left-navigation .social-icon li a {
  color: #FFFFFF;
}

.light-green-color #left-navigation .social-icon li a:hover {
  color: #565656;
}

.blue-color #left-navigation .social-icon li a {
  color: #FFFFFF;
}

.blue-color #left-navigation .social-icon li a:hover {
  color: #FF7878;
}

.red-color #left-navigation .social-icon li a {
  color: #FFFFFF;
}

.red-color #left-navigation .social-icon li a:hover {
  color: #3F414D;
}

.light-green-color #left-navigation {
  background: #4FADA8;
}

ul.mainNav {
  padding: 0;
  margin: 0;
  list-style: none;
  background: #555557;
}

ul.mainNav.mobile {
  display: none;
}

.red-color ul.mainNav {
  background: #ff7878;
}

.blue-color ul.mainNav {
  background: #5EBFD8;
}

.light-green-color ul.mainNav {
  background: #1FB5AD;
}

.black-color ul.mainNav {
  background: #3F414D;
}

.deep-blue-color ul.mainNav {
  background: #3A515A;
}

ul.mainNav li {
  border-top: 1px solid #58595B;
  position: relative;
}

ul.mainNav.active li ul li {
  border: none;
}

ul.mainNav li:last-child {
  border-bottom: 1px solid #58595B;
}

.black-color ul.mainNav li {
  border-top: 1px solid #444755;
}

.black-color ul.mainNav li:last-child {
  border-bottom: 1px solid #444755;
}

.blue-color ul.mainNav li {
  border-top: 1px solid #47aac5;
}

.blue-color ul.mainNav li:last-child {
  border-bottom: 1px solid #47aac5;
}

.deep-blue-color ul.mainNav li {
  border-top: 1px solid #3D5863;
}

.deep-blue-color ul.mainNav li:last-child {
  border-bottom: 1px solid #3D5863;
}

.red-color ul.mainNav li {
  border-top: 1px solid #E48080;
}

.red-color ul.mainNav li:last-child {
  border-bottom: 1px solid #E48080;
}

.light-green-color ul.mainNav li {
  border-top: 1px solid #4FADA8;
}

.light-green-color ul.mainNav li:last-child {
  border-bottom: 1px solid #4FADA8;
}

ul.mainNav li a {
  line-height: 13px;
  font-size: 13px;
  padding: 10px 10px 10px 5px;
  display: block;
  text-decoration: none;
  color: #c6c6c6;
  outline: 0;
  position: relative;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

ul.mainNav li a.active {
  color: #fff;
  background-color: #7A8B83;
}

.red-color ul.mainNav li a,
.blue-color ul.mainNav li a,
.light-green-color ul.mainNav li a {
  color: #fff;
}

ul.mainNav li a i {
  margin-left: 5px;
  width: 15px;
  font-size: 14px;
}

ul.mainNav li a b {
  width: 12px;
}

#left-navigation.active ul.mainNav li a i {
  width: 50px;
}

#left-navigation.active ul.mainNav li a b {
  width: 22px;
}

ul.mainNav li a span {
  line-height: 13px;
  font-size: 13px;
}

ul.mainNav li a span.badge {
  border-radius: 2px;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  font-size: 10px;
  font-weight: 400;
  line-height: 10px;
  padding: 2px 5px;
  position: absolute;
  left: 30px;
}

#left-navigation.active ul.mainNav li a span.badge {
  left: 25px;
}

ul.mainNav li a span.navTag {
  font-size: 18px;
}

ul.mainNav li a:hover {
  background-color: #7a8b83;
  color: #ffffff;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

ul.mainNav ul {
  margin: 0;
  padding: 0;
  display: none;
  list-style: none;
  background: #58595B;
}

ul.mainNav.active ul {
  position: absolute;
  right: 50px;
  width: 200px;
  background: #4C4C4E;
}

ul.mainNav.active li ul.open {
  display: block;
}

ul.mainNav li.active ul {
  display: block;
}

ul.mainNav li.active ul ul {
  display: none;
}

ul.mainNav li.active ul li.active ul{
    display: block;
}
ul.mainNav li.active ul li.active ul li.active{
    display: block;
}
ul.mainNav li.active ul li.active ul li.active ul li.active{
    display: block;
}
ul.mainNav li.active ul li.active ul li.active ul li.active ul li.active{
    display: block;
}

ul.mainNav.active li.active ul {
  display: none;
}

ul.mainNav.active li.active ul.open {
  display: block;
}

ul.mainNav.active li ul.active {
  display: none;
}

ul.mainNav.active li ul.active.open {
  display: block;
}

.blue-color ul.mainNav.active ul,
.blue-color ul.mainNav ul {
  background: #53A2B8;
}

.deep-blue-color ul.mainNav.active ul,
.deep-blue-color ul.mainNav ul {
  background: #3D5863;
}

.red-color ul.mainNav.active ul,
.red-color ul.mainNav ul {
  background: #DD7878;
}

.light-green-color ul.mainNav.active ul,
.light-green-color ul.mainNav ul {
  background: #4FADA8;
}

.black-color ul.mainNav.active ul,
.black-color ul.mainNav ul {
  background: #444755;
}

ul.mainNav ul li {
  margin: 0;
  padding: 0;
  clear: both;
}

ul.mainNav ul li a {
  padding-right: 30px;
  font-size: 12px;
  font-weight: normal;
  outline: 0;
}

#left-navigation.active ul.mainNav ul li a {
  padding-right: 20px;
}

ul.mainNav ul li a:hover {
  background-color: #7a8b83;
  color: #fff;
}

ul.mainNav.active li.active a i {
  color: #fff;
}

ul.mainNav ul li a.active {
  color: #fff;
  background-color: #7a8b83;
}

ul.mainNav ul ul li a {
  color: #c6c6c6;
  padding-right: 30px;
}

ul.mainNav ul ul li a:hover {
  background-color: #7a8b83;
  color: #fff;
}

ul.mainNav b {
  float: left;
  font-size: 14px;
  font-weight: 400;
}

ul.mainNav.active ul {
  display: none;
}

ul.mainNav.active li a i {
  padding-right: 10px;
}

ul.mainNav.active li a b {
  display: none;
}

ul.mainNav.active li:hover,
ul.mainNav.check li.check {
  width: 200px;
  background: #49494B;
  z-index: 999;
}

ul.mainNav.active li:hover,
ul.mainNav.active li.check {
  background: #555557;
}

.blue-color ul.mainNav.active li:hover,
.blue-color  ul.mainNav.active li.check {
  background: #53A2B8;
}

.deep-blue-color ul.mainNav.active li:hover,
.deep-blue-color ul.mainNav.active li.check {
  background: #3D5863;
}

.red-color ul.mainNav.active li:hover,
.red-color ul.mainNav.active li.check {
  background: #DD7878;
}

.light-green-color ul.mainNav.active li:hover,
.light-green-color ul.mainNav.active li.check {
  background: #4FADA8;
}

.black-color ul.mainNav.active li:hover,
.black-color ul.mainNav.active li.check {
  background: #444755;
}

ul.mainNav.active > li:hover,
ul.mainNav.active > li.check {
  width: 250px;
  z-index: 11;
}

ul.mainNav.active li a span,
ul.mainNav.active li a b {
  display: none;
}

ul.mainNav.active li:hover a span,
ul.mainNav.active li.check a span,
ul.mainNav.active li:hover a b,
ul.mainNav.active li.check a b {
  display: inline-block;
}

ul.mainNav.active ul ul,
ul.mainNav.active ul ul ul {
  right: 0;
}

/*** For Mobile Mobile ***/

.navigation {
  color: #ffffff;
}

.black-color .navigation {
  background: #3F414D;
}

.blue-color .navigation {
  background: #5EBFD8;
}

.deep-blue-color .navigation {
  background: #3A515A;
}

.red-color .navigation {
  background: #FF7878;
}

.light-green-color .navigation {
  background: #1FB5AD;
}

.navigation a h1 {
  font-size: 22px;
  font-family: 'Montserrat', sans-serif;
  color: #f2f2f2;
  margin: 0;
  padding: 0;
  line-height: 37px;
  text-transform: uppercase;
}

.light-green-color .navigation a h1 {
  color: #f2f2f2;
}

.red-color .navigation a h1 {
  color: #f2f2f2;
}

.blue-color .navigation a h1 {
  color: #FFFFFF;
}

.navigation input.top-search {
  float: right;
}

.phone-nav-box {
  background: #58595B;
  text-align: left;
}

.phone-nav-box .phone-logo {
  text-align: right;
  float: right;
}

.phone-nav-box .phone-logo h1 {
  color: #fff;
  font-family: 'Montserrat', sans-serif;
  font-size: 20px;
  line-height: 38px;
  margin: 0;
  padding: 0;
  text-transform: uppercase;
}

.red-color .phone-nav-box .phone-logo h1,
.blue-color .phone-nav-box .phone-logo h1,
.light-green-color .phone-nav-box .phone-logo h1,
.black-color .phone-nav-box .phone-logo h1,
.deep-blue-color .phone-nav-box .phone-logo h1 {
  color: #FFFFFF;
}

.red-color .phone-nav-box {
  background: #DD7878;
}

.blue-color .phone-nav-box {
  background: #53A2B8;
}

.light-green-color .phone-nav-box {
  background: #4FADA8;
}

.black-color .phone-nav-box {
  background: #444755;
}

.deep-blue-color .phone-nav-box {
  background: #324E59;
}

.phone-nav-box a {
  font-size: 20px;
  display: inline-block;
  padding: 10px 20px;
  outline: 0;
  color: #fff;
  text-decoration: none;
  font-weight: normal;
  text-align: left;
  line-height: 38px;
}

.red-color .phone-nav-box a,
.blue-color .phone-nav-box a,
.light-green-color .phone-nav-box a,
.black-color .phone-nav-box a,
.deep-blue-color .phone-nav-box a {
  color: #ffffff;
}

.phone-nav-box a:hover {
  text-decoration: none;
}

.phone-nav-box a span {
  line-height: 28px;
}

/*-----------------------------------------------------------------*/

/*------------------------------------------------------------------
  -------------------------- BREADCRUMB -------------------------
-------------------------------------------------------------------*/

.ls-breadcrumbs {
  display: inline-block;
  overflow: hidden;
  border-radius: 1px;
}

.ls-breadcrumbs a {
  text-decoration: none;
  outline: none;
  display: block;
  float: right;
  font-size: 12px;
  line-height: 36px;
  color: #565656;
  padding: 0 30px 0 20px;
  background: #E3DFD8;
  position: relative;
}

.ls-breadcrumbs a:first-child {
  padding-right: 20px;
  border-radius: 1px;
}

.ls-breadcrumbs a:first-child:before {
  right: 14px;
}

.ls-breadcrumbs a:last-child {
  border-radius: 1px;
  padding-left: 20px;
}

.ls-breadcrumbs a.active,
.ls-breadcrumbs a:hover {
  background: #e0e0e0;
}

.ls-breadcrumbs a.active:after,
.ls-breadcrumbs a:hover:after {
  background: #e0e0e0;
}

.ls-breadcrumbs a:after {
  content: '';
  position: absolute;
  top: 0;
  left: -18px;
  width: 36px;
  height: 36px;
  transform: scale(0.707) rotate(45deg);
  z-index: 1;
  background: #E3DFD8;
  box-shadow: 2px -2px 0 2px rgba(0, 0, 0, 0.1),
    3px -3px 0 2px #e0e0e0;
  border-radius: 5px 0 50px 0;
}

.ls-breadcrumbs a:last-child:after {
  content: none;
}

.ls-breadcrumbs a .fa {
  font-size: 14px;
  margin-left: 3px;
  color: #565656;
}

.breadcrumb-box {
  margin-bottom: 20px;
}

.breadcrumb li {
  font-size: 12px;
}

.breadcrumb li a {
  color: #565656;
  font-size: 12px;
  outline: 0;
}

.breadcrumb > li + li:before {
  color: #565656;
}

/**** breadcrumb simple ***/

/****** Breadcrumb ****/

.ls-breadcrumbs-simple {
  display: inline-block;
  overflow: hidden;
  border-radius: 1px;
}

.ls-breadcrumbs-simple a {
  text-decoration: none;
  outline: none;
  display: block;
  float: right;
  font-size: 12px;
  color: #565656;
  padding: 0 10px 0 10px;
  position: relative;
}

.ls-breadcrumbs-simple a:first-child {
  padding-right: 0;
  margin-right: 0;
  border-radius: 1px;
}

.ls-breadcrumbs-simple a:first-child:before {
  right: 14px;
}

.ls-breadcrumbs-simple a:last-child {
  border-radius: 1px;
  padding-left: 20px;
}

.ls-breadcrumbs-simple a.active,
.ls-breadcrumbs-simple a.active .fa,
.ls-breadcrumbs-simple a:hover {
  color: #1fb5ad;
}

.ls-breadcrumbs-simple a.active:after,
.ls-breadcrumbs-simple a:hover:after,
.ls-breadcrumbs-simple a:hover .fa {
  color: #1fb5ad;
}

.ls-breadcrumbs-simple a:after {
  content: '';
  position: absolute;
  top: 4px;
  left: 0;
  width: 10px;
  height: 10px;
  transform: scale(0.707) rotate(45deg);
  z-index: 1;
  box-shadow: 1px -1px 0 1px rgba(0, 0, 0, 0.1),
    1px -1px 0 1px #E3DFD8;
  border-radius: 5px 0 50px 0;
}

.ls-breadcrumbs-simple a:last-child:after {
  content: none;
}

.ls-breadcrumbs-simple a .fa {
  font-size: 14px;
  margin-left: 3px;
  color: #565656;
}

/****/

.breadcrumb {
  border-radius: 1px;
  -moz-border-radius: 1px;
  -webkit-border-radius: 1px;
  background: #e0e0e0;
  margin-bottom: 15px;
}

.breadcrumb.no-background {
  background: none;
}

/*-----------------------------------------------------------------*/

/*------------------------------------------------------------------
   -------------------------MAIN WRAPPER-------------------------
-------------------------------------------------------------------*/

#min-wrapper {
  width: 100%;
  float: right;
  padding-right: 200px;
  background: #58595B;
}

#min-wrapper.active {
  /*padding-right: 50px;*/
  padding-right: 0px;
}

.black-color #min-wrapper {
  background: #3F414D;
}

.deep-blue-color #min-wrapper {
  background: #324E59;
}

.red-color #min-wrapper {
  background: #DD7878;
}

.blue-color #min-wrapper {
  background: #53A2B8;
}

.light-green-color #min-wrapper {
  background: #4FADA8;
}

/*-----------------------------------------------------------------*/

/*------------------------------------------------------------------
   -------------------------RIGHT WRAPPER---------------------------------
-------------------------------------------------------------------*/

#right-wrapper {
  width: 280px;
  height: 100%;
  min-height: 800px;
  background: #303741;
  float: right;
  position: fixed;
  left: -280px;
  z-index: 999;
  top: 0px;
}

#right-wrapper .close-right-wrapper {
  position: absolute;
  left: 10px;
  top: 5px;
}

#right-wrapper .close-right-wrapper a {
  font-size: 16px;
  color: #fff;
  outline: none;
  text-decoration: none;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

#right-wrapper .close-right-wrapper a:hover {
  color: #ff7878;
  text-decoration: none;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

#right-wrapper .tab-content {
  background: #303741;
}

#right-wrapper.active {
  left: 0;
}

#right-wrapper .nav-tabs {
  border-bottom: none;
  text-align: center;
}

#right-wrapper .nav-tabs li {
  border: none;
  border-radius: 0;
  -webkit-border-radius: 0;
  margin-bottom: 0;
}

#right-wrapper .nav-tabs li a {
  font-size: 14px;
  padding: 9px 10px;
  margin-left: 0;
  border-radius: 0;
  -webkit-border-radius: 0;
  border: none;
  color: #ffffff;
  outline: none;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

#right-wrapper .nav-tabs li.active a,
#right-wrapper .nav-tabs li:hover a {
  border-radius: 0;
  -webkit-border-radius: 0;
  background: #FF7878;
  color: #ffffff;
  border: none;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

.chat-group {
  color: #7F8186;
  padding: 10px 20px 10px 0;
}

.chat-group h3 {
  margin: 0;
  text-transform: capitalize;
  padding-bottom: 10px;
}

.chat-group a {
  color: #BEC0C2;
  font-style: normal;
  display: block;
  padding-bottom: 10px;
  font-size: 13px;
  outline: none;
}

.chat-group a:hover,
.chat-group a.active {
  text-decoration: none;
  color: #ffffff;
  outline: none;
}

#chatTab .badge {
  /**** Issue Fixed @new ***/
  font-size: 10px;
  line-height: 1;
  margin-right: 20px;
  min-width: 14px;
  padding: 0;
  line-height: 15px;
  height: 15px;
  width: 15px;
  border-radius: 50%;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
}

.chat-box {
  width: 100%;
  background: #343A45;
}

.chat-box .chat-box-header {
  padding: 3px 20px 3px 0;
  border-bottom: 1px solid #303741;
  color: #BEC0C2;
}

.chat-box .chat-box-header h5 {
  font-size: 13px;
}

.chat-box .chat-box-content {
  color: #BEC0C2;
}

.chat-box .chat-box-content ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.chat-box .chat-box-content ul li {
  padding: 10px 20px 20px 0;
  margin-bottom: 0px;
  position: relative;
}

.chat-box .chat-box-content ul li:nth-child(even) {
  background: #303844;
}



.chat-box .chat-box-content span.user {
  font-size: 13px;
  color: #ffffff;
}

.chat-box .chat-box-content p {
  font-size: 14px;
  margin-bottom: 0;
}

.chat-box .chat-box-content span.time {
  font-size: 10px;
  position: absolute;
  bottom: 10px;
  left: 5px;
  margin-left: 20px;
}



.chat-write textarea {
  border: 1px solid #303741;
  box-shadow: none;
  -webkit-box-shadow: none;
  border-radius: 0;
  -webkit-border-radius: 0;
  color: #ffffff;
  background: #303741;
  overflow: hidden;
  word-wrap: break-word;
  resize: horizontal;
  height: 32px;
}

.chat-write textarea:focus,
.chat-write textarea:hover {
  border: 1px solid #303741;
  box-shadow: none;
  -webkit-box-shadow: none;
  border-radius: 0;
  -webkit-border-radius: 0;
}

.nano {
  height: 300px;
}

.nano .nano-pane {
  background: #e0e0e0;
}

.nano .nano-slider {
  background: #3F414D;
}

.nano-chat {
  height: 200px;
}

.nano-progress {
  height: 150px;
}

.progress-content {
  padding-left: 20px;
}

.setting-box {
  color: #7F8186;
  padding: 10px 0px 10px 0;
}

.setting-box h3 {
  margin: 0;
  padding-bottom: 10px;
  text-transform: capitalize;
}

.setting-box h5 {
  font-size: 12px;
  padding: 0;
  margin: 0 0 5px 0;
  color: #bec0c2;
}

.setting-box-content ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.setting-box-content ul li {
  text-align: left;
  margin-bottom: 10px;
}

.setting-box-content ul li b {
  float: right;
}

.setting-box-content ul li span {
  color: #bec0c2;
}

.setting-box-content ul li span.switchery {
  height: 15px;
  width: 30px;
}

.setting-box-content ul li span.switchery small {
  height: 15px;
  width: 15px;
}

.rotationToClick,
.right-sidebar,
.right-sidebar-setting {
  display: inline-block;
}

/*-----------------------------------------------------------------*/

/*------------------------------------------------------------------
  -------------------------- DASHBOARD --------------------------
-------------------------------------------------------------------*/

/********** Dashboard css Start **********/

#realTimeChart {
  overflow: hidden;
}

.home-row-top {
  margin-top: 27px;
  margin-bottom: 15px;
}

.current-status-widget ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.current-status-widget ul li {
  margin-bottom: 8px;
  cursor: pointer;
}

.current-status-widget ul li div.status-box {
  height: 100%;
  width: 100%;
}

.current-status-widget ul li div.status-box div.status-box-icon {
  height: 50px;
  width: 50px;
  text-align: center;
  float: right;
}

.current-status-widget ul li div.status-box div.status-box-icon i {
  font-size: 25px;
  line-height: 50px;
  -webkit-transition: all 300ms linear;
  -moz-transition: all 300ms linear;
  -o-transition: all 300ms linear;
  -ms-transition: all 300ms linear;
  transition: all 300ms linear;
}

@keyframes changeiconsize {
  0% {
    font-size: 25px;
  }

  25% {
    font-size: 10px;
  }

  50% {
    font-size: 40px;
  }

  75% {
    font-size: 10px;
  }

  100% {
    font-size: 25px;
  }
}

@-webkit-keyframes changeiconsize {
  0% {
    font-size: 25px;
  }

  25% {
    font-size: 10px;
  }

  50% {
    font-size: 40px;
  }

  75% {
    font-size: 10px;
  }

  100% {
    font-size: 25px;
  }
}



.current-status-widget ul li:hover div.status-box div.status-box-icon i {
  -webkit-animation: changeiconsize 1s infinite;
  animation: changeiconsize 1s infinite;
}

div.status-box-content {
  float: right;
  height: 50px;
  margin-right: 10px;
}

div.status-box-content h5 {
  margin-bottom: 3px;
  margin-top: 3px;
  font-size: 15px;
}

div.status-box-content p {
  font-size: 15px;
}

div.status-box-content h5 i {
  font-size: 12px;
}

.pie-widget {
  text-align: center;
  margin: auto;
  border: 1px solid #e0e0e0;
  padding: 20px 0;
}

.pie-widget p {
  display: block;
  margin-bottom: 5px;
  font-size: 15px;
}

.pie-widget h5 {
  margin: 5px;
  font-size: 15px;
}

.pie-widget canvas {
  right: 0;
  position: absolute;
  top: 0;
}

.chart-pie-widget {
  display: inline-block;
  height: 110px;
  line-height: 110px;
  margin-bottom: 15px;
  position: relative;
  text-align: center;
  width: 110px;
  z-index: 2;
}

.pie-widget-count {
  line-height: 110px;
  text-align: center;
  font-size: 14px;
}

.pie-widget-count:after {
  content: "%";
  font-size: 12px;
  margin-right: 0.1em;
}

.v-map-widget {
  border: 1px solid #e0e0e0;
  height: 340px;
}

.v-map-widget h3 {
  padding: 10px 20px;
  margin: 0;
}

.world_map_home_widget {
  height: 302px;
}

.v-map-overlay {
  position: absolute;
  left: 15px;
  top: 38px;
  width: 100px;
  background: rgba(0, 0, 0, 0.50);
  z-index: 1;
}

.v-map-overlay ul {
  list-style: none;
  margin: 0;
  padding: 5px 10px;
}

.v-map-overlay ul li {
  color: #f2f2f2;
}

.world_map_home_widget .jvectormap-zoomin,
.world_map_home_widget .jvectormap-zoomout {
  color: #f2f2f2;
  background: rgba(0, 0, 0, 0.50);
}

.table-bordered > thead > tr > th,
.table-bordered > thead > tr > td {
  border-bottom-width: 1px;
}

.flotPieChartWidget {
  height: 250px;
  width: 100%;
  margin-top: 15px;
}

/*-----------------------------------------------------------------*/

/*------------------------------------------------------------------
  -------------------------- EMAIL -------------------------------
-------------------------------------------------------------------*/

/*Email top ui start*/

.top-navigation .email-top li a {
  padding: 0;
  display: block;
  color: #6e6e6e;
}

.top-navigation .email-top li a:hover {
  background: none;
}

.email-top {
  list-style: none;
  padding: 0;
  margin: 0;
}

.email-top li {
  border-bottom: 1px dashed #cbc5ba;
  display: inline-block;
  margin-bottom: 0;
  padding: 5px 10px;
  width: 100%;
}

.email-top li a {
  color: dimgrey;
}

.email-top li .email-top-image {
  float: left;
  height: 50px;
  width: 50px;
}

.email-top li .email-top-image img {
  width: 100%;
  border-radius: 50%;
}

.email-top li .email-top-content {
  font-size: 14px;
  padding-top: 6px;
  line-height: 18px;
}

.email-top li .email-top-content > div {
  font-size: 13px;
  font-style: italic;
}

.email-top li .email-top-content .badge {
  float: left;
}

.email-top li .email-top-content a {
  color: #1fb5ad;
  font-size: 15px;
}

.email-top li .email-top-content a:after {
  content: "  -  ";
}

/****/

/**** Mail box css start****/

.fieldcontainer {
  display: block;
  margin: 0;
  position: relative;
  width: 100%;
}

.searchfieldjs {
  background-color: #FFFFFF;
  border: 1px solid #CBC5BA;
  border-radius: 1px;
  color: #CCCCCC;
  display: block;
  font-size: 12px;
  padding: 7px 11px;
  width: 100%;
}

#search2btn {
  background: url("../../images/search-icon.png") top left no-repeat;
  border: 0 none;
  cursor: pointer;
  height: 32px;
  opacity: 0.65;
  position: absolute;
  left: 0;
  top: 7px;
  width: 25px;
}

.no-default-padding {
  padding: 0;
}

.mail-search-box {
  margin-bottom: 15px;
}

.mail-box {
  width: 100%;
}

.mail-box-navigation {
  height: 100%;
  width: 100%;
  text-align: center;
}

.mail-box-list.home {
  padding-right: 10px;
  width: 100%;
}

.mail-navigation {
  margin: 0;
  padding: 0;
  list-style: none;
}

.mail-navigation li {
  text-align: center;
  background: #e0e0e0;
  width: 100px;
  height: 60px;
  overflow: hidden;
  display: inline-block;
}

.mail-navigation li a {
  display: inline;
  color: #000;
  text-decoration: none;
  outline: 0;
}

.mail-navigation li a:hover {
  text-decoration: none;
}

.mail-navigation li a i.fa {
  font-size: 28px;
  line-height: 60px;
  display: block;
  color: #FF7878;
  -webkit-transition: all 200ms linear;
  -moz-transition: all 200ms linear;
  -o-transition: all 200ms linear;
  -ms-transition: all 200ms linear;
  transition: all 200ms linear;
}

.mail-navigation li a span {
  color: #565656;
  display: block;
  padding-bottom: 11px;
}

.mail-navigation li a:hover i.fa {
  font-size: 20px;
  line-height: 30px;
  -webkit-transition: all 200ms linear;
  -moz-transition: all 200ms linear;
  -o-transition: all 200ms linear;
  -ms-transition: all 200ms linear;
  transition: all 200ms linear;
  color: #1fb5ad;
}

.mail-navigation li a.active i.fa {
  color: #1fb5ad;
}

.mail-box-list {
  width: 30%;
  float: right;
  overflow: hidden;
}

.mail-list {
  padding: 0;
  margin: 0;
  list-style: none;
  cursor: pointer;
}

.mail-list li {
  padding: 10px;
  border-bottom: 1px solid #cbc5ba;
  border-right: 1px solid #cbc5ba;
  border-left: 1px solid #cbc5ba;
  height: 72px;
  overflow: hidden;
}

.mail-list li.new-mail div.mail-user-image {
  color: #1fb5ad;
  border: 1px solid #1fb5ad;
  -moz-border: 1px solid #1fb5ad;
  -webkit-border: 1px solid #1fb5ad;
}

.mail-list li.new-mail div.mail-user-image i {
  color: #1fb5ad;
}

.mail-list li:first-child {
  border-top: 1px solid #cbc5ba;
}

.mail-list a > i {
  color: #565656;
  width: 20px;
  font-size: 14px;
}

.mail-list div.mail-user-image,
.mail-list div.mail-user-mail {
  float: right;
}

.mail-list div.mail-user-image {
  text-align: center;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  padding: 10px;
  border: 1px solid #fe6c6c;
}

.mail-list div.mail-user-image i {
  color: #fe6c6c;
  font-size: 25px;
  line-height: 30px;
}

.mail-list div.user-picture {
  padding: 0;
  overflow: hidden;
  height: 50px;
}

.mail-list div.user-picture img {
  height: 100%;
}

.mail-list div.mail-user-mail {
  padding-right: 10px;
}

.mail-list div.mail-user-mail span {
  line-height: 45px;
  transition-delay: 400ms;
  -moz-transition-delay: 400ms;
  -webkit-transition-delay: 400ms;
  -webkit-transition: all 200ms linear;
  -moz-transition: all 200ms linear;
  -o-transition: all 200ms linear;
  -ms-transition: all 200ms linear;
  transition: all 200ms linear;
}

.mail-list div.mail-user-mail .mail-action {
  opacity: 0;
  -webkit-transition: all 200ms linear;
  -moz-transition: all 200ms linear;
  -o-transition: all 200ms linear;
  -ms-transition: all 200ms linear;
  transition: all 200ms linear;
}

.mail-list li:hover .mail-user-mail span {
  line-height: 15px;
  -webkit-transition: all 200ms linear;
  -moz-transition: all 200ms linear;
  -o-transition: all 200ms linear;
  -ms-transition: all 200ms linear;
  transition: all 200ms linear;
}

.mail-list li:hover .mail-action {
  transition-delay: 400ms;
  -moz-transition-delay: 400ms;
  -webkit-transition-delay: 400ms;
  -webkit-transition: all 400ms linear;
  -moz-transition: all 400ms linear;
  -o-transition: all 400ms linear;
  -ms-transition: all 400ms linear;
  transition: all 400ms linear;
  opacity: 1;
}

.mail-header {
  border-top: 1px solid #cbc5ba;
  border-bottom: 1px dashed #cbc5ba;
}

.mail-contact-user-image-box {
  float: left;
  width: 115px;
}

.mail-contact-user-image-box .mail-date {
  float: left;
  width: 115px;
  color: white;
  background: #fe6c6c;
  padding: 5px;
  text-align: center;
}

.mail-contact-user-image-box .mail-date span.date {
  font-weight: bold;
  font-size: 20px;
}

.mail-contact-user-image-box .mail-date span.month {
  text-transform: uppercase;
}

div.mail-contact-user-image {
  border: 1px solid #fe6c6c;
  border-radius: 58px;
  padding: 10px;
  text-align: center;
  width: 115px;
  height: 115px;
  line-height: 115px;
  margin-bottom: 10px;
  float: left;
}

div.user-picture-big {
  padding: 0;
  overflow: hidden;
  height: 120px;
  width: 120px;
  border-radius: 50%;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
}

div.user-picture-big img {
  height: 100%;
}

div.mail-contact-user-image i {
  color: #fe6c6c;
  font-size: 50px;
}

.border {
  border: 1px solid #fe6c6c;
}

.mail-body {
  float: right;
  width: 70%;
}

.mail-body.mail-body-inbox {
  padding-right: 20px;
}

.mail-contact {
  width: 100%;
  padding-bottom: 18px;
  border-bottom: 1px dashed #cbc5ba;
}

.mail-contact-address {
  float: right;
  width: 80%;
  font-size: 16px;
  margin-top: 40px;
}

.mail-contact-address .contact-address,
.mail-contact-address .mail-subject {
  font-size: 14px;
  padding: 5px 10px;
  width: 100%;
  border-radius: 1px;
  border: 1px solid #cbc5ba;
  background: #e0e0e0;
  margin-bottom: 15px;
}

.compose-mail-box.home .mail-contact-address {
  float: right;
  width: 100%;
}

.compose-mail-box.home .mail-contact-user-image-box {
  display: none;
}

.mail-main-content {
  padding: 10px 0;
}

.mail-action-bar {
  background: white;
  border: 1px solid #cbc5ba;
  margin: 0 auto 15px auto;
  text-align: right;
}

.mail-action-bar ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.mail-action-bar ul li {
  display: inline-block;
  height: 30px;
  margin-right: 15px;
}

.mail-action-bar ul li a {
  line-height: 30px;
  margin-left: 20px;
  color: dimgrey;
}

.mail-action-bar ul li a i.fa {
  font-size: 14px;
}

.mail-action-bar ul li a.active {
  color: #269abc;
}

div.compose-mail-box {
  width: 100%;
}

div.compose-mail-box.home {
  padding-right: 0;
}

input.bg-white {
  background: white;
}

.addBccView,
.addCcView {
  display: none;
  margin-bottom: 10px;
}

.toView {
  margin-bottom: 10px;
}

.compose-mail-box .mail-contact {
  border-bottom: 0;
  -moz-border-bottom: 0;
  -webkit-border-bottom: 0;
}

#compose-popup-view {
  position: fixed;
  left: 0;
  bottom: -500px;
  min-height: 500px;
  width: 50%;
  border: 1px solid #fe6c6c;
  z-index: 100;
  background: white;
}

.mail-box-header {
  background: #ff7878;
  height: 50px;
}

.mail-box-header h4 {
  padding: 0;
  margin: 0;
  color: white;
  width: 100px;
  float: right;
  line-height: 50px;
  padding-right: 15px;
}

.mail-box-header ul.popup-mail-action {
  list-style: none;
  padding: 0;
  margin: 0;
  width: 100px;
  float: left;
  text-align: left;
  padding-left: 15px;
}

.mail-box-header ul.popup-mail-action li {
  display: inline-block;
  padding-right: 10px;
}

.mail-box-header ul.popup-mail-action li a i {
  color: white;
  line-height: 50px;
}

.mail-box-content {
  padding: 10px;
}

.mail-box-content #mail_body_content {
  width: 100%;
  height: 300px;
  margin: 5px 0;
}

.mail-send-btn {
  margin-top: 15px;
}

ul.attachments-preview-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

ul.attachments-preview-list li {
  display: inline-block;
  margin-left: 20px;
  margin-bottom: 20px;
}

.ls-mail-img {
  position: relative;
  display: inline-block;
}

.ls-mail-img img {
  display: block;
  margin: 0;
  padding: 0;
  max-width: 100%;
  height: auto;
}

.ls-mail-overlay {
  background: none repeat scroll 0 0 rgba(0, 0, 0, 0.8);
  display: block;
  overflow: hidden;
  position: absolute;
  transition: all 0.5s ease 0s;
  z-index: 20;
  overflow: hidden;
}

.ls-mail-overlay {
  bottom: 0;
  height: 0;
  right: 0;
  left: 0;
  width: 100%;
}

.ls-mail-overlay-link {
  display: block;
  line-height: 50px;
  text-align: center;
  position: absolute;
  z-index: 100;
}

.ls-mail-overlay-link a {
  color: #F2F2F2;
  font-size: 24px;
  margin: 0 5px;
  outline: 0 none;
  text-decoration: none;
  -webkit-transition: all 200ms linear;
  -moz-transition: all 200ms linear;
  -o-transition: all 200ms linear;
  -ms-transition: all 200ms linear;
  transition: all 200ms linear;
}

.ls-mail-overlay-link a:hover {
  color: #ff7878;
  -webkit-transition: all 200ms linear;
  -moz-transition: all 200ms linear;
  -o-transition: all 200ms linear;
  -ms-transition: all 200ms linear;
  transition: all 200ms linear;
}

.ls-mail-overlay-link {
  bottom: 50%;
  right: 0;
  margin: 0 auto -30px;
  left: 0;
}

.overlay-hover .ls-mail-overlay {
  height: 100%;
}

/*****/

/*** Chat Page Start ***/

.ls-chat {
  overflow: hidden;
  margin-bottom: 20px;
}

.ls-chat img,
.ls-chat .rounded {
  float: right;
  margin-left: 10px;
  width: 40px;
  height: auto;
}

.ls-chat img {
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
}

.ls-chat img.rounded {
  -webkit-border-radius: 100px;
  -moz-border-radius: 100px;
  border-radius: 100px;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
}

.ls-chat .text {
  margin-right: 45px;
}

.ls-chat .text-right {
  margin: 0 0 0 45px;
}

.ls-chat .status,
.ls-chat .status-alter {
  height: 25px;
  padding: 10px 10px 0 0;
  border-bottom: 1px solid #e8e8e8;
  -webkit-border-top-left-radius: 2px;
  -webkit-border-bottom-left-radius: 0;
  -webkit-border-bottom-right-radius: 0;
  -webkit-border-top-right-radius: 2px;
  -moz-border-radius-topleft: 2px;
  -moz-border-radius-bottomleft: 0;
  -moz-border-radius-bottomright: 0;
  -moz-border-radius-topright: 2px;
  border-top-left-radius: 2px;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  border-top-right-radius: 2px;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  font-size: 12px;
  border-left: 1px solid #ebebeb;
  border-right: 1px solid #ebebeb;
  border-top: 1px solid #ebebeb;
}

.ls-chat .status {
  background-color: #f9f9f9;
  background: -webkit-gradient(linear, left top, left bottom, from(#f9f9f9), to(#fef9f9));
  background: -webkit-linear-gradient(top, #f9f9f9, #fef9f9);
  background: -moz-linear-gradient(top, #f9f9f9, #fef9f9);
  background: -ms-linear-gradient(top, #f9f9f9, #fef9f9);
  background: -o-linear-gradient(top, #f9f9f9, #fef9f9);
  filter: progid:dximagetransform.microsoft.gradient(startColorstr='#feffff', endColorstr='#f9f9f9', GradientType=0);
  /* IE6-9 */
}

.ls-chat .status-alter {
  background-color: #f9f9f9;
  background: -webkit-gradient(linear, left top, left bottom, from(#f9f9f9), to(#ffeeee));
  background: -webkit-linear-gradient(top, #f9f9f9, #ffeeee);
  background: -moz-linear-gradient(top, #f9f9f9, #ffeeee);
  background: -ms-linear-gradient(top, #f9f9f9, #ffeeee);
  background: -o-linear-gradient(top, #f9f9f9, #ffeeee);
  filter: progid:dximagetransform.microsoft.gradient(startColorstr='#feffff', endColorstr='#f9f9f9', GradientType=0);
  /* IE6-9 */
}

.status .date {
  margin-left: 10px;
  float: left;
  font-style: italic;
  text-shadow: 1px 1px 0px rgba(255, 255, 255, 0.92);
}

.ls-chat .user {
  font-weight: bold;
  text-shadow: 1px 1px 0px rgba(255, 255, 255, 0.92);
  font-size: 14px;
}

.ls-chat p {
  margin: 0;
  background: #ffffff;
  padding: 2px 10px;
  border-bottom: 1px solid #ebebeb;
  border-right: 1px solid #ebebeb;
  border-left: 1px solid #ebebeb;
}

.text .msg,
.text .msg-alter {
  -webkit-border-radius: 1px;
  -moz-border-radius: 1px;
  border-radius: 1px;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  overflow: hidden;
}

.text .date,
.text-right .date {
  display: inline-block;
  font-size: 11px;
  font-style: italic;
  padding: 3px 3px 0;
}

.text .date {
  float: left;
}

.text-right .date {
  float: right;
}

.text .msg {
  background-color: #e0e0e0;
}

.text .msg-alter {
  background-color: #1fb5ad;
  text-align: left;
  color: white;
}

.ls-chat .right {
  float: left;
  margin-left: 0;
}

.ls-chat .triangle,
.ls-chat .triangle-right {
  width: 9px;
  height: 12px;
}

.ls-chat .triangle {
  float: right;
  position: relative;
  position: relative;
  right: 2px;
  top: 5px;
  width: 0;
  height: 0;
  border-top: 8px solid transparent;
  border-bottom: 8px solid transparent;
  border-left: 8px solid #e0e0e0;
}

.ls-chat .triangle-right {
  float: left;
  position: relative;
  position: relative;
  left: 1px;
  top: 5px;
  width: 0;
  height: 0;
  border-top: 8px solid transparent;
  border-bottom: 8px solid transparent;
  border-right: 8px solid #1fb5ad;
}

.input-group-message input {
  height: 34px;
}

.nano.nano-chat-widget {
  height: 340px;
}

.nano .nano-content.nano-chat-box {
  padding: 10px 5px 10px 20px;
}

.nano.nano-recent-activities {
  height: 430px;
}

.nano .nano-content.nano-activities {
  padding: 10px 5px 10px 10px;
}

.nano > .nano-pane {
  width: 10px;
  cursor: pointer;
}

/*-----------------------------------------------------------------*/

/*------------------------------------------------------------------
  -------------------------- CHARTS -------------------------------
-------------------------------------------------------------------*/

.bar_chart_canvas_box,
.line-chart-area-box {
  width: 100%;
}

.pie-chart-area-box,
.doughnut-chart-area-box,
.polar-chart-area-box,
.radar-chart-area-box {
  width: 100%;
}

#chartTwoLine svg {
  height: 400px;
  width: 100%;
}

.groupMultiBarView {
  height: 400px;
  width: 100%;
}

canvas#barChartCanvas {
  width: 100% !important;
  height: auto !important;
}

canvas#polarAreaChartCanvas,
canvas#radarChartCanvas,
canvas#doughnutChartCanvas,
canvas#pieChartCanvas,
canvas#lineChartCanvas {
  width: 100% !important;
  height: auto !important;
}

.pieChartCanvasDataView,
.doughnutChartCanvasDataView,
.polarAreaChartCanvasDataView,
.radarChartCanvasDataView {
  border-top: 1px solid #e3dfd8;
  margin: 15px -16px 0;
}

.pieChartCanvasDataView ul,
.doughnutChartCanvasDataView ul,
.polarAreaChartCanvasDataView ul,
.radarChartCanvasDataView ul {
  height: 95px;
  list-style: none outside none;
  margin: 20px auto 10px;
  padding: 5px auto;
  width: 175px;
}

.pieChartCanvasDataView ul li span,
.doughnutChartCanvasDataView ul li span,
.polarAreaChartCanvasDataView ul li span,
.radarChartCanvasDataView ul li span {
  border-radius: 8px;
  display: inline-block;
  height: 8px;
  margin-left: 5px;
  transition: all 300ms ease-in-out 0s;
  width: 8px;
}

.sparkBarView,
.sparkPieView {
  height: 400px;
}

.sparkPieViewData {
  margin-top: 20px;
}

.sparkPieViewData ul {
  list-style: none;
  margin: 0;
  padding: 5px 10px;
}

.sparkPieViewData ul li {
  margin-bottom: 5px;
  margin-left: 15px;
  display: inline-block;
}

.sparkPieViewData ul li span {
  border-radius: 8px;
  display: inline-block;
  height: 8px;
  margin-left: 5px;
  transition: all 300ms ease-in-out 0s;
  width: 8px;
}

.sparkLine-border {
  border: 1px solid #e3dfd8;
}

span.textColor {
  background: #565656;
}

span.greenActive {
  background: #71AD70;
}

span.redActive {
  background: #FF7878;
}

span.fillColor1 {
  background: rgba(220,220,220,0.5);
}

span.fillColor4 {
  background: #C2E2C2;
}

span.fillColor5 {
  background: rgba(255, 120, 120, 0.76);
}

span.fillColor6 {
  background: rgba(91, 194, 222, 0.9);
}

span.fillColor7 {
  background: rgba(239, 174, 77, 0.71);
}

span.lightBlueActive {
  background: #269abc;
}

span.brownActive {
  background: #B16666;
}

span.defultColor {
  background: #1fb5ad;
}

span.defultBorder {
  background: #E3DFD8;
}

span.blueActive {
  background: #706AF4;
}

.flotChartRealTime {
  width: 100%;
  height: 350px;
  font-size: 14px;
  line-height: 0.5em;
  padding: 10px;
}

.flotChartRealTime.homeChart {
  height: 280px;
}

.flotPieChart {
  height: 350px;
  width: 100%;
}

.seriesToggle {
  height: 400px;
  width: 100%;
}

#choices {
  margin: 25px auto 0;
  list-style: none;
}

#choices li {
  width: 20%;
  display: inline-block;
}

#choices label.switch-label {
  margin-right: 8px;
  margin-left: 35px;
}

.paiChartAction {
  text-align: center;
}

.paiChartAction button {
  margin-bottom: 10px;
}

.morris-hover {
  position: absolute;
  z-index: 1000;
}

.morris-hover.morris-default-style {
  border-radius: 10px;
  padding: 6px;
  color: #666;
  background: rgba(255, 255, 255, 0.8);
  border: solid 2px rgba(230, 230, 230, 0.8);
  font-family: sans-serif;
  font-size: 12px;
  text-align: center;
}

.morris-hover.morris-default-style .morris-hover-row-label {
  font-weight: bold;
  margin: 0.25em 0;
}

.morris-hover.morris-default-style .morris-hover-point {
  white-space: nowrap;
  margin: 0.1em 0;
}

.sparkline-box {
  text-align: center;
}

.sparkline-box p {
  margin-top: 15px;
}

.sparkline-box div.panel-heading {
  text-align: right;
}

.sparkline {
  width: 250px;
  height: auto;
  margin: auto;
}

.sparklineBadge-box {
  padding: 10px;
  float: left;
  display: inline-block;
}

/*Spark Line tooltip start*/

.jqstooltip {
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
}

/*Spark Line tooltip start*/
.c3{
    direction: ltr;
}

/*-----------------------------------------------------------------*/

/*------------------------------------------------------------------
  -------------------------- FORM STAFFS -------------------------
-------------------------------------------------------------------*/

form.ls_form_dashed {
  border-top: none;
  border-right: none;
  border-left: none;
  border-bottom: 1px dashed #cbc5ba;
  box-shadow: none;
}

form.ls_form_dashed input {
  border-top: none;
  border-right: none;
  border-left: none;
  border-bottom: 1px dashed #cbc5ba;
  box-shadow: none;
  border-radius: 0;
}

form.ls_form_dashed input:focus,
input.bootbox-input:focus {
  border-top: none;
  border-right: none;
  border-left: none;
  border-bottom: 1px solid #cbc5ba;
  box-shadow: none;
  border-radius: 0;
}

form.ls_form input,
form.ls_form select,
form.ls_form textarea,
input.bootbox-input {
  border-radius: 1px;
  outline: none;
}

form.ls_form input:focus,
form.ls_form input.active,
form.ls_form select:focus,
form.ls_form select.active,
form.ls_form textarea:focus,
form.ls_form textarea.active,
input.bootbox-input:focus {
  box-shadow: 0 2px 2px #F2F2F2 inset, 0 0 2px #98B6CF;
  border-color: #AEAEAE;
  outline: none;
}

form.ls_form input.rounded {
  border-radius: 30px;
}

form.ls_form label.checkbox,
form.ls_form label.radio {
  font-weight: 400;
}

div.form_view {
  padding: 0 30px;
}

.form-box {
  margin-bottom: 15px;
  padding-bottom: 15px;
  border-bottom: 1px dashed #cbc5ba;
}

.form-box.last {
  border: 0;
}

/*****/

.form-control {
  border-radius: 1px;
  -moz-border-radius: 1px;
  -webkit-border-radius: 1px;
}

.message-form .control-label {
  text-align: left;
}

.has-success .form-control {
  border-color: #6DB46F;
}

.has-success .help-block,
.has-success .control-label,
.has-success .radio,
.has-success .checkbox,
.has-success .radio-inline,
.has-success .checkbox-inline {
  color: #6DB46F;
}

.has-success .form-control:focus {
  border-color: #6DB46F;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 6px #A1EAA3;
  -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 6px #A1EAA3;
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 6px #A1EAA3;
}

.has-warning .help-block,
.has-warning .control-label,
.has-warning .radio,
.has-warning .checkbox,
.has-warning .radio-inline,
.has-warning .checkbox-inline {
  color: #AA8E5E;
}

.has-warning .form-control {
  border-color: #AA8E5E;
}

.has-warning .form-control:focus {
  border-color: #AA8E5E;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 6px #DCC59D;
  -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 6px #DCC59D;
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 6px #DCC59D;
}

.has-error .help-block,
.has-error .control-label,
.has-error .radio,
.has-error .checkbox,
.has-error .radio-inline,
.has-error .checkbox-inline {
  color: #ff3434;
}

.has-error .form-control {
  border-color: #ff3434;
}

.has-error .form-control:focus {
  border-color: #ff3434;
  box-shadow: 0 1px 1px rgba(254, 158, 158, 0.08) inset, 0 0 6px #B4AEAE;
  -moz-box-shadow: 0 1px 1px rgba(254, 158, 158, 0.08) inset, 0 0 6px #B4AEAE;
  -webkit-box-shadow: 0 1px 1px rgba(254, 158, 158, 0.08) inset, 0 0 6px #B4AEAE;
}

.form-horizontal .has-feedback .form-control-feedback {
  top: 10px;
}

.form-horizontal .has-feedback .radio .form-control-feedback {
  visibility: hidden;
}

.form-horizontal .has-feedback .checkbox .form-control-feedback {
  visibility: hidden;
}

.formError .formErrorContent {
  width: 100%;
  background: #ee0101;
  position: relative;
  color: #fff;
  min-width: 120px;
  font-size: 11px;
  box-shadow: 0 0 6px #000;
  border: none;
  -moz-box-shadow: 0 0 6px #000;
  -webkit-box-shadow: 0 0 6px #000;
  -o-box-shadow: 0 0 6px #000;
  padding: 4px 10px 4px 10px;
  border-radius: 1px;
  -moz-border-radius: 1px;
  -webkit-border-radius: 1px;
  -o-border-radius: 1px;
}

.formError .formErrorArrow div {
  border-right: none;
  border-left: none;
  box-shadow: none;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  -o-box-shadow: none;
  font-size: 0px;
  height: 1px;
  background: #ee0101;
  margin: 0 auto;
  line-height: 0;
  font-size: 0;
  display: block;
}

/*****/

#editor {
  width: 100%;
  min-height: 200px;
  background-color: white;
  border: 1px dashed #cbc5ba;
  padding: 15px;
}

.editor-toolbar {
  border: 1px dashed #cbc5ba;
  margin: 0 0 15px 0;
}

.editor-toolbar .btn-group > a.btn {
  border-radius: 0;
  -moz-border-radius: 0;
  -webkit-border-radius: 0;
  padding: 5px 12px;
  color: #235b67;
}

.editor-toolbar .btn-group > a.btn-info {
  color: white;
  background-color: #269abc;
}

.editor-toolbar a {
  border-radius: 0;
  -moz-border-radius: 0;
  -webkit-border-radius: 0;
}

.radio-button-place {
  line-height: 84px;
}

#voiceBtn {
  display: none;
}

#editor:focus,
#editor:active {
  outline: 0;
}

.myEditor.demo-image {
  text-align: center;
}

/***/

.box-switchery input {
  margin-right: 15px;
}

.help_text {
  font-size: 12px;
}

div.ls_divider {
  border-bottom: 1px dashed #cbc5ba;
  margin-top: 15px;
  padding-left: 15px;
}

div.ls_divider.last {
  border: 0;
}

input.ls-group-input,
.ls-group-input {
  margin-bottom: 15px;
}

.multiselect-container > li > a {
  padding: 3px 0;
}

.multiselect-container > li > a > label > input {
  right: -9999em;
  position: absolute;
}

.full-width {
  width: 100%;
}

.slider.slider-vertical {
  margin-right: 5px;
}

.datePickerCall,
.datePickerCall1 {
  cursor: pointer;
}

form.ls_form input.dial,
form.ls_form input.dial:active,
form.ls_form input.dial:focus {
  border: none;
  box-shadow: none;
  outline: 0;
}

/*-----------------------------------------------------------------*/

/*------------------------------------------------------------------
  -------------------------- TIME-LINE --------------------------
-------------------------------------------------------------------*/

.ls_tmtimeline {
  margin: 30px 0 0 0;
  padding: 0;
  list-style: none;
  position: relative;
}

/* The line */

.ls_tmtimeline:before {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  width: 10px;
  background: #dbcdad;
  right: 25%;
  margin-right: -10px;
}

.ls_tmtimeline > li {
  position: relative;
}

.ls_tmtimeline > li .ls-timeline-user {
  position: absolute;
  text-align: center;
  width: 25%;
  padding-left: 60px;
}

.ls-timeline-user .media-heading {
  margin-top: 15px;
  margin-bottom: 10px;
  color: #5c5b56;
  font-size: 15px;
}

.ls_tmtimeline > li .ls-timeline-user img {
  width: 75px;
}

/* The date/time */

.ls_tmtimeline > li .ls_tmtime {
  display: block;
}

.ls_tmtimeline > li .ls_tmtime span {
  display: block;
}

.ls_tmtimeline > li .ls_tmtime span:first-child {
  font-size: 15px;
  color: #706a5c;
}

.ls_tmtimeline > li .ls_tmtime span:last-child {
  font-size: 15px;
  color: #71624e;
  font-weight: bold;
}

.ls_tmtimeline > li:nth-child(odd) .ls_tmtime span:last-child {
  color: #71624e;
}

/* Right content */

.ls_tmtimeline > li .ls_tmlabel {
  margin: 0 30% 15px 0;
  padding: 10px 15px;
  font-size: 14px;
  font-weight: 300;
  line-height: 20px;
  position: relative;
  border-radius: 1px;
}

.ls_tmtimeline > li:nth-child(odd) .ls_tmlabel {
  background: #5c5b56;
  color: #fff;
}

.ls_tmtimeline > li:nth-child(even) .ls_tmlabel {
  background: #CAB38B;
}

.ls_tmtimeline > li:nth-child(odd) .ls_tmlabel p {
  color: #D1D0CE;
}

.ls_tmtimeline > li .ls_tmlabel h2 {
  margin-top: 0px;
  padding: 0 0 10px 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.4);
  font-size: 15px;
}

/* The triangle */

.ls_tmtimeline > li .ls_tmlabel:after {
  left: 100%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-left-color: #CAB38B;
  border-width: 10px;
  top: 20px;
}

.ls_tmtimeline > li:nth-child(odd) .ls_tmlabel:after {
  border-left-color: #5c5b56;
}

.ls_tmlabel ul.task {
  padding: 0;
  margin: 0;
}

.ls_tmlabel ul.task li {
  display: block;
  list-style: none;
  text-align: right;
  color: #D1D0CE;
}

.ls_tmlabel ul.task li a {
  color: #D1D0CE;
}

.ls_tmlabel ul {
  padding: 0;
  margin: 0;
  text-align: center;
}

.ls_tmlabel ul li {
  position: relative;
  display: inline-block;
  list-style: none;
  margin: 3px;
}

.ls_tmlabel ul li img {
  width: 90px;
}

/* The icons */

.ls_tmtimeline > li .ls_tmicon {
  width: 40px;
  height: 40px;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  font-size: 1.4em;
  line-height: 40px;
  -webkit-font-smoothing: antialiased;
  position: absolute;
  color: #806854;
  background: #fff5cf;
  border-radius: 50%;
  box-shadow: 0 0 0 8px #b39c7d;
  text-align: center;
  right: 25%;
  top: 0;
  margin: 7px -25px 0 0;
}

.ls_tmtimeline > li.month {
  position: relative;
  text-align: center;
  height: 100px;
  margin: 40px 0;
}

.ls_tmtimeline > li.month h4 {
  font-size: 14px;
  line-height: 60px;
  color: timeline-user-time;
}

.ls_tmtimeline > li .ls_tmicon_ls {
  width: 80px;
  height: 80px;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  font-size: 1.4em;
  line-height: 80px;
  -webkit-font-smoothing: antialiased;
  position: absolute;
  color: #806854;
  background: #fff5cf;
  border-radius: 50%;
  box-shadow: 0 0 0 8px #5c5b56;
  text-align: center;
  right: 23%;
  top: 0;
  margin: 0 -25px 0 0;
}

.ls_tmtimeline > li .ls_tmlabel iframe {
  height: 250px;
}

.ls-project {
  position: relative;
}

.ls-project ul {
  padding: 0;
  margin: -7px 0 0;
  text-align: center;
}

.ls-project ul li {
  display: inline-block;
  list-style: none;
  margin: 5px;
}

.ls-project ul li img {
  width: 95px;
  max-width: 100%;
}

/*-----------------------------------------------------------------*/

/*------------------------------------------------------------------
  -------------------------- TABLE -------------------------------
-------------------------------------------------------------------*/

td.ls-table-progress .progress {
  margin-bottom: 0;
  margin-top: 6px;
}

.ls-table .table > thead > tr > th {
  font-family: 'Armata',sans-serif;
  font-weight: normal;
  font-size: 14px;
  border-bottom: medium none;
}

.ls-table-pagination .pagination {
  margin: 0;
}

.table tbody form input {
  width: 100% !important;
  height: 100% !important;
}

/** Animated Table **/

.ls-animated-table th div.sortArrow {
  display: inline-block;
  float: left;
  height: 6px;
  margin-right: 5px;
  margin-top: 5px;
  position: relative;
  vertical-align: 2px;
  width: 11px;
}

.ls-animated-table th div.sortArrow div.sortArrowAscending,
.ls-animated-table th div.sortArrow div.sortArrowDescending {
  display: none;
  height: 6px;
  position: absolute;
  width: 11px;
}

.ls-animated-table th div.sortArrow div.sortArrowAscending {
  background: url("../../images/arrow_asc.png") repeat scroll 0 0 rgba(0, 0, 0, 0);
}

.ls-animated-table th div.sortArrow div.sortArrowDescending {
  background: url("../../images/arrow_desc.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
}

#ls-row tbody tr:hover {
  background: url("../../images/icons/glyphicons_move.png") no-repeat scroll left 10px center / 14px 14px rgba(0, 0, 0, 0);
  cursor: move;
}

#ls-column th:hover {
  background: url("../../images/icons/glyphicons_move.png") no-repeat scroll left 10px center / 14px 14px rgba(0, 0, 0, 0);
  cursor: move;
}

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
 * DataTables features
 */

.dataTables_wrapper {
  position: relative;
  min-height: 302px;
  clear: both;
  _height: 302px;
  zoom: 1;
  /* Feeling sorry for IE */
}

.dataTables_processing {
  position: absolute;
  top: 50%;
  right: 50%;
  width: 250px;
  height: 30px;
  margin-right: -125px;
  margin-top: -15px;
  padding: 14px 0 2px 0;
  border: 1px solid #ddd;
  text-align: center;
  color: #999;
  font-size: 14px;
  background-color: white;
}

.dataTables_length {
  float: right;
  margin-bottom: 10px;
}

.dataTables_length label select {
  width: 100px;
  color: #555555;
  border: 1px solid #cbc5ba;
  border-radius: 1px;
  font-size: 14px;
  height: 30px;
  line-height: 1.42857;
  padding-right: 12px;
  padding-left: 12px;
  padding-top: 3px;
  transition-delay: 0s, 0s;
  transition-duration: 0.15s, 0.15s;
  transition-property: border-color, box-shadow;
  transition-timing-function: ease-in-out, ease-in-out;
  background: url("../../images/datatable/sort_both.png") no-repeat;
  background-position: center left;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  text-indent: 0.01px;
  text-overflow: "";
}

.dataTables_length label select:focus {
  border: 1px solid #cbc5ba;
  background: url("../../images/datatable/sort_desc.png") no-repeat;
  background-position: center left;
}

.dataTables_filter {
  width: 50%;
  float: left;
  text-align: left;
  margin-bottom: 10px;
}

.dataTables_filter label input {
  margin-right: 10px;
  border: 1px solid #cbc5ba;
  border-radius: 1px;
  color: #555555;
  font-size: 14px;
  height: 30px;
  line-height: 1.42857;
  padding-bottom: 6px;
  padding-right: 12px;
  padding-left: 12px;
  padding-top: 6px;
  transition-delay: 0s, 0s;
  transition-duration: 0.15s, 0.15s;
  transition-property: border-color, box-shadow;
  transition-timing-function: ease-in-out, ease-in-out;
}

.dataTables_filter label input:focus {
  border: 1px solid #cbc5ba;
}

.dataTables_info {
  float: right;
  margin-top: 10px;
}

.dataTables_paginate {
  *width: 50px;
  float: left;
  text-align: left;
  margin-top: 10px;
}

/* Pagination nested */

.paginate_disabled_previous,
.paginate_enabled_previous,
.paginate_disabled_next,
.paginate_enabled_next {
  height: 19px;
  width: 19px;
  margin-right: 3px;
  float: right;
}

.paginate_disabled_previous {
  background-image: url("../../images/datatable/back_disabled.png");
}

.paginate_enabled_previous {
  background-image: url("../../images/datatable/back_enabled.png");
}

.paginate_disabled_next {
  background-image: url("../../images/datatable/forward_disabled.png");
}

.paginate_enabled_next {
  background-image: url("../../images/datatable/forward_enabled.png");
}

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
 * DataTables sorting
 */

.sorting_asc {
  background: url("../../images/datatable/sort_asc.png") no-repeat center right;
}

.sorting_desc {
  background: url("../../images/datatable/sort_desc.png") no-repeat center right;
}

.sorting {
  background: url("../../images/datatable/sort_both.png") no-repeat center right;
}

.sorting_asc_disabled {
  background: url("../../images/datatable/sort_asc_disabled.png") no-repeat center right;
}

.sorting_desc_disabled {
  background: url("../../images/datatable/sort_desc_disabled.png") no-repeat center right;
}

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
 * Misc
 */

.dataTables_scroll {
  clear: both;
}

.dataTables_scrollBody {
  *margin-top: -1px;
}

.clear {
  clear: both;
}

.dataTables_empty {
  text-align: center;
}

.paging_full_numbers {
  height: 22px;
  line-height: 22px;
}

.paging_full_numbers span.paginate_button,
.paging_full_numbers span.paginate_active {
  padding: 2px 5px;
  margin: 0 3px;
  cursor: pointer;
  *cursor: hand;
}

.paging_full_numbers {
  height: 22px;
  line-height: 22px;
}

.paging_full_numbers a:active {
  outline: none;
}

.paging_full_numbers a:hover {
  text-decoration: none;
}

.paging_full_numbers a.paginate_button,
.paging_full_numbers a.paginate_active {
  padding: 2px 5px;
  margin: 0 3px;
  cursor: pointer;
  *cursor: hand;
  color: #333 !important;
  -webkit-transition: all 600ms linear;
  -moz-transition: all 600ms linear;
  -o-transition: all 600ms linear;
  -ms-transition: all 600ms linear;
  transition: all 600ms linear;
}

.paging_full_numbers a.paginate_button:hover {
  border-bottom: 2px solid #cbc5ba;
  padding: 2px 5px;
  margin: 0 3px;
  cursor: pointer;
  text-decoration: none !important;
  -webkit-transition: all 600ms linear;
  -moz-transition: all 600ms linear;
  -o-transition: all 600ms linear;
  -ms-transition: all 600ms linear;
  transition: all 600ms linear;
}

.paging_full_numbers a.current {
  font-size: 16px;
  color: dimgray;
  border-bottom: 2px solid dimgray;
}

/*
 * KeyTable
 */

table.KeyTable td {
  border: 3px solid transparent;
}

table.KeyTable td.focus {
  border: 3px solid #cbc5ba;
}

div.box {
  height: 100px;
  padding: 10px;
  overflow: auto;
  border: 1px solid #cbc5ba;
  background-color: #cbc5ba;
}

/*
 * Sort arrow icon positioning
 */

table#ls-editable-table thead th div.DataTables_sort_wrapper {
  position: relative;
  padding-left: 20px;
}

table#ls-editable-table thead th div.DataTables_sort_wrapper span {
  position: absolute;
  top: 50%;
  margin-top: -8px;
  left: 0;
}

table#ls-editable-table tbody tr td:hover {
  background: url("../../images/icons/glyphicons_pencil.png");
  background-repeat: no-repeat;
  background-position: center left 10px;
  background-size: 12px 12px;
}

table#ls-editable-table tbody tr td input {
  border: 1px solid #cbc5ba;
  border-radius: 1px;
  color: #555555;
  font-size: 14px;
  height: 30px;
  line-height: 1.42857;
  padding-bottom: 6px;
  padding-right: 12px;
  padding-left: 12px;
  padding-top: 6px;
  transition-delay: 0s, 0s;
  transition-duration: 0.15s, 0.15s;
  transition-property: border-color, box-shadow;
  transition-timing-function: ease-in-out, ease-in-out;
}

/*-----------------------------------------------------------------*/

/*------------------------------------------------------------------
  -------------------------- NOTIFICATION -----------------------
-------------------------------------------------------------------*/

.amaran {
  border-radius: 1px;
  -moz-border-radius: 1px;
  -webkit-border-radius: 1px;
}

.amaran-wrapper {
  z-index: 9999;
}

.amaran-wrapper.top {
  top: 22px;
}

.amaran-close i.fa {
  color: #ffffff;
}

.amaran.default,
.amaran.user {
  font-family: 'PT Sans', sans-serif;
  background-color: #323232;
  font-size: 14px;
}

.amaran.default p span.light,
.amaran.default p span {
  font-size: 13px;
}

.amaran.user {
  color: #F2F2F2;
  font-family: 'PT Sans', sans-serif;
  font-size: 14px;
}

.amaran.user .info {
  padding-left: 12px;
}

.amaran.user .info b {
  font-size: 16px;
}

.amaran.default.ok .icon {
  background: #5cb85c;
}

.amaran.default.ok p.bold {
  color: #5cb85c;
}

.amaran.default p {
  color: #F2F2F2;
}

.amaran.default p span.light {
  color: #BBBBBB;
}

.amaran.default.error .icon {
  background-color: #ff7878;
}

.amaran.default.error p.bold {
  color: #ff7878;
}

.amaran.default.warning .icon {
  background-color: #f0ad4e;
}

.amaran.default.warning p.bold {
  color: #f0ad4e;
}

.amaran.default.green .icon,
.amaran.user.green {
  background-color: #1fb5ad;
}

.amaran.default.green p.bold {
  color: #1fb5ad;
}

.amaran.user .icon {
  border-radius: 40px;
  -moz-border-radius: 40px;
  -webkit-border-radius: 40px;
  height: 80px;
  width: 80px;
  margin: 10px;
  overflow: hidden;
}

.amaran.user.blue {
  background-color: #5bc0de;
}

.amaran.readmore .content {
  font-family: 'PT Sans', sans-serif;
  font-size: 14px;
  padding: 20px;
  background: #ffffff;
  color: #222;
  margin: 0;
}

.amaran.readmore .title {
  font-family: 'PT Sans', sans-serif;
  font-size: 16px;
}

.amaran.readmore,
.amaran.readmore .readmore-user {
  border-color: #323232;
}

.amaran.readmore .title {
  background-color: #323232;
}

.amaran.readmore.success,
.amaran.readmore.success .readmore-user {
  border-color: #5cb85c;
}

.amaran.readmore.success .title {
  background-color: #5cb85c;
}

.amaran.readmore.red,
.amaran.readmore.red .readmore-user {
  border-color: #ff7878;
}

.amaran.readmore.red .title {
  background-color: #ff7878;
}

.amaran.readmore.warning,
.amaran.readmore.warning .readmore-user {
  border-color: #f0ad4e;
}

.amaran.readmore.warning .title {
  background-color: #f0ad4e;
}

.amaran.readmore.info,
.amaran.readmore.info .readmore-user {
  border-color: #5bc0de;
}

.amaran.readmore.info .title {
  background-color: #5bc0de;
}

.amaran.readmore.green,
.amaran.readmore.green .readmore-user {
  border-color: #1fb5ad;
}

.amaran.readmore.green .title {
  background-color: #1fb5ad;
}

/*****/

.customNotification.alert {
  border-radius: 1px;
  margin-bottom: 10px;
  padding: 10px;
}

.alert {
  border-radius: 1px;
  -moz-border-radius: 1px;
  -webkit-border-radius: 1px;
}

.list-group-item:first-child {
  border-top-right-radius: 1px;
  -moz-border-top-left-radius: 1px;
  -webkit-border-top-right-radius: 1px;
  border-top-left-radius: 1px;
  -moz-border-top-right-radius: 1px;
  -webkit-border-top-left-radius: 1px;
}

.list-group-item:last-child {
  border-bottom-right-radius: 1px;
  -moz-border-bottom-left-radius: 1px;
  -webkit-border-bottom-right-radius: 1px;
  border-bottom-left-radius: 1px;
  -moz-border-bottom-right-radius: 1px;
  -webkit-border-bottom-left-radius: 1px;
}

/*-----------------------------------------------------------------*/

/*------------------------------------------------------------------
  -------------------------- TASK & NOTE ------------------------
-------------------------------------------------------------------*/

/**** Note & Task  Start ****/

#slippylist {
  list-style: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
}

#slippylist li {
  border: 1px solid #cbc5ba;
  padding: 10px 0;
  margin-bottom: 10px;
  background: white;
  user-select: none;
  -moz-user-select: none;
  -webkit-user-select: none;
  -webkit-transition: all 0.3 fade-in-out;
  -moz-transition: all 0.3s fade-in-out;
  -o-transition: all 0.3s fade-in-out;
  transition: all 0.3s fade-in-out;
}

#slippylist li:hover {
  cursor: move;
}

#slippylist li i {
  margin: 0 8px 0 0;
  width: 15px;
  cursor: pointer;
}

#slippylist li button i {
  margin: 0 3px;
}

#slippylist li i.fa-circle-o {
  color: #507d50;
  line-height: 20px;
}

#slippylist li i.fa-check {
  color: #fe6c6c;
  line-height: 20px;
}

#slippylist li span.doneTask {
  text-decoration: line-through;
}

#slippylist li.strikeout span {
  position: relative;
}

#slippylist li.strikeout span::after {
  border-bottom: 1px solid #fe6c6c;
  content: "";
  right: 0;
  position: absolute;
  left: 0;
  top: 50%;
  -webkit-transition: all 900ms linear;
  -moz-transition: all 900ms linear;
  -o-transition: all 900ms linear;
  -ms-transition: all 900ms linear;
  transition: all 900ms linear;
}

.slip-reordering {
  box-shadow: 0 2px 10px rgba(0,0,0,0.45);
}

.slip-swiping-container {
  overflow-x: hidden;
}

.removeTask {
  float: left;
  padding: 0;
  margin-left: 10px;
}

#newTaskAdd {
  margin-top: 15px;
}

ul.sortable ul {
  list-style: none !important;
}

ul.sortable {
  list-style: none;
  margin: 0;
  padding: 0;
}

ul.sortable li {
  border: 1px solid #cbc5ba;
  padding: 10px;
  margin-bottom: 15px;
}

ul.sortable li i {
  cursor: pointer;
}

ul.sortable li.dragged {
  position: absolute;
  opacity: 1;
  z-index: 2000;
  padding: 10px;
  height: 40px !important;
  background: #e0e0e0;
}

ul.sortable li.placeholder {
  position: relative;
  padding: 20px;
  background: #e0e0e0;
  /** More li styles **/
}

ul.sortable li.placeholder:before {
  position: absolute;
  /** Define arrowhead **/
}

.nano-task-progress {
  height: 370px;
}

.nano-task-progress .goal-box {
  padding-left: 10px;
}

ul.sortable-box {
  list-style: none;
  margin: 0;
  padding: 0;
}

ul.sortable-box li {
  border: 1px solid #cbc5ba;
  padding: 10px;
  float: right;
  width: 22%;
  margin: 0 5px 15px 5px;
  cursor: move;
}

ul.sortable-box li.dragged {
  position: absolute;
  opacity: 1;
  z-index: 2000;
  padding: 10px;
  height: 40px !important;
  background: #e0e0e0;
}

ul.sortable-box li.placeholder {
  position: relative;
  padding: 18px;
  background: #e0e0e0;
  /** More li styles **/
}

ul.sortable-box li.placeholder:before {
  position: absolute;
  /** Define arrowhead **/
}

/***/

/*Goal ui start*/

.goal-item {
  list-style: none;
  padding: 0;
  margin: 0;
}

.goal-item li {
  border-bottom: 1px dashed #cbc5ba;
  display: inline-block;
  margin-bottom: 0;
  margin-top: 10px;
  padding: 0 10px;
  width: 100%;
}

.goal-item li .goal-user-image {
  float: right;
  height: 45px;
  margin-left: 10px;
  width: 45px;
  margin-top: -5px;
}

.goal-item li .goal-user-image img {
  width: 100%;
  border-radius: 50%;
}

.goal-item li .goal-content {
  font-size: 14px;
}

.goal-item li .goal-content .progress {
  margin-top: 7px;
}

.goal-item li .goal-content a {
  color: #1fb5ad;
  font-size: 15px;
}

.goal-item li .goal-content a:after {
  content: "  -  ";
}

.top-navigation .goal-item li a {
  padding: 0;
  display: block;
  color: #6e6e6e;
  margin-top: 3px;
}

.top-navigation .goal-item li a:hover {
  background: none;
}

/*-----------------------------------------------------------------*/

/*------------------------------------------------------------------
  -------------------------- CALENDER ---------------------------
-------------------------------------------------------------------*/



button.addEvent {
  width: 100%;
  font-size: 14px;
}

#full-calendar {
  margin-top: 20px;
}

#full-calendar .fc-event {
  font-size: 14px;
}

#full-calendar .fc-grid th {
  font-weight: normal;
  line-height: 40px;
}

#full-calendar .fc-grid .fc-day-number {
  padding: 0 5px;
}

#full-calendar .fc-event-inner {
  text-align: center;
}

#calender-wrap {
  margin: 0 auto;
}

#external-events {
  /*float: left;*/
  position: relative;
  width: 100%;
  padding: 0 10px 10px 10px;
  /**** Issue Fixed @new ***/
  background: #e0e0e0;
  border-radius: 1px;
  -moz-border-radius: 1px;
  -wibkit-border-radius: 1px;
}

#external-events h4 {
  font-size: 15px;
  margin-top: 0;
  padding-top: 10px;
  /**** Issue Fixed @new ***/
}

.eventList {
  margin-bottom: 20px;
}

.external-event {
  background: #1fb5ad;
  color: white;
  font-size: 14px;
  text-align: center;
  height: 30px;
  line-height: 30px;
  margin: 5px 0;
  cursor: pointer;
  border-radius: 1px;
  -moz-border-radius: 1px;
  -webkit-border-radius: 1px;
}

.cal-event-remove {
  margin: 20px 0;
}

#external-events p {
  margin: 1.5em 0;
  font-size: 14px;
  color: #666;
  text-align: center;
}

#external-events p input {
  margin: 0;
  vertical-align: middle;
}

#trash {
  /**** Issue Fixed @new ***/
  background-color: #E6E6E6;
  border: 1px solid #e3dfd8;
  height: 100px;
  width: 100%;
  line-height: 100px;
  text-align: center;
  font-size: 20px;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  transition: all 1s ease;
}

#trash:hover {
  font-size: 40px;
  color: #fe6c6c;
}

#trash.active {
  font-size: 40px;
  color: #fe6c6c;
}

#loading {
  position: absolute;
  top: 5px;
  left: 5px;
}

.fc-calendar-container {
  height: 365px;
}

.fc-state-default {
  background-color: #1fb5ad;
  color: white;
  background-image: none;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
}

.fc-state-default.fc-corner-left {
  border-bottom-right-radius: 1px;
  -moz-border-bottom-left-radius: 1px;
  -webkit-border-bottom-right-radius: 1px;
  border-top-right-radius: 1px;
  -moz-border-top-left-radius: 1px;
  -webkit-border-top-right-radius: 1px;
}

.fc-state-default.fc-corner-right {
  border-bottom-left-radius: 1px;
  -moz-border-bottom-right-radius: 1px;
  -webkit-border-bottom-left-radius: 1px;
  border-top-left-radius: 1px;
  -moz-border-top-right-radius: 1px;
  -webkit-border-top-left-radius: 1px;
}

.fc-text-arrow {
  font-family: 'Armata', sans-serif;
  font-size: 20px;
  line-height: 20px;
  margin: 0;
}

.fc-state-default {
  text-shadow: none;
  -moz-text-shadow: none;
  -webkit-text-shadow: none;
  box-shadow: none;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  border: none;
}

.fc-button-prev .fc-text-arrow,
.fc-button-next .fc-text-arrow {
  font-weight: normal;
}

.fc-state-hover,
.fc-state-down,
.fc-state-active,
.fc-state-disabled {
  color: white;
  background-color: #1fb5ad;
}

.fc-state-hover {
  color: white;
  background: #ff7878;
  text-decoration: none;
  background-position: 0 -15px;
  -webkit-transition: background-position 0.1s linear;
  -moz-transition: background-position 0.1s linear;
  -o-transition: background-position 0.1s linear;
  transition: background-position 0.1s linear;
}

.fc-state-down,
.fc-state-active {
  background-color: #ff7878;
  background-image: none;
  outline: 0;
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
}

.fc-state-disabled {
  cursor: default;
  background-image: none;
  opacity: 0.65;
  filter: alpha(opacity=65);
  box-shadow: none;
}

.fc-header .fc-button {
  text-transform: capitalize;
}

.fc-event {
  background-color: #1FB5AD !important;
  border: none;
  color: #FFFFFF !important;
  padding: 4px;
}

.fc-ltr .fc-event-hori.fc-event-end,
.fc-rtl .fc-event-hori.fc-event-start {
  border-bottom-left-radius: 1px;
  border-left-width: 1px;
  border-top-left-radius: 1px;
}

.fc-ltr .fc-event-hori.fc-event-start,
.fc-rtl .fc-event-hori.fc-event-end {
  border-bottom-right-radius: 1px;
  border-right-width: 1px;
  border-top-right-radius: 1px;
}

.fc-content {
  clear: none;
}

.custom-calendar-wrap {
  margin: 0 auto;
}

.custom-calendar-wrap .custom-header {
  height: 80px;
}

.custom-calendar-wrap .custom-header nav span {
  top: 24px;
}

.fc-calendar .fc-row > div > span.fc-date {
  font-size: 14px;
}

/*-----------------------------------------------------------------*/

/*------------------------------------------------------------------
  -------------------------- MAPS -------------------------------
-------------------------------------------------------------------*/

#direction,
#branch,
#mapDirections,
#findLocation,
#addMarkerMap,
#groupMarker {
  height: 400px;
  width: 100%;
}

.ls-map-locator {
  background: none repeat scroll 0 0 #555557;
  padding: 10px 0;
}

.ls-map-locator ul {
  list-style: none outside none;
  margin: 0;
  padding: 0;
}

.ls-map-locator ul li {
  display: inline-block;
  text-align: center;
  width: 19%;
}

.ls-map-locator ul li a {
  color: #FFFFFF;
  outline: none;
  -webkit-transition: all 100ms linear;
  -moz-transition: all 100ms linear;
  -o-transition: all 100ms linear;
  -ms-transition: all 100ms linear;
  transition: all 100ms linear;
}

.ls-map-locator ul li a:hover,
.ls-map-locator ul li a.active {
  outline: none;
  text-decoration: none;
  color: #ff7878;
  -webkit-transition: all 100ms linear;
  -moz-transition: all 100ms linear;
  -o-transition: all 100ms linear;
  -ms-transition: all 100ms linear;
  transition: all 100ms linear;
}

.ls-map-locator ul li a i {
  font-size: 30px;
  line-height: 35px;
}

.ls-map-locator ul li a span {
  display: list-item;
  font-size: 14px;
}

.ls-map-locator ul li a img {
  width: 40px;
}

.mapDirectionsData {
  margin: auto;
  padding: 20px 0;
  text-align: center;
}

/** Vector Map **/

.world_map {
  height: 600px;
  width: 100%;
}

.world_map_home {
  height: 300px;
  width: 100%;
}

#za_mill_en,
#au_mill_en,
#map_decoration,
#uk_mill_en {
  height: 400px;
  width: 100%;
}

.decoration-map p {
  background: #1FB5AD;
  color: #ffffff;
  padding: 10px;
  margin: 0;
}

.jvectormap-zoomin,
.jvectormap-zoomout {
  background: #E3DFD8;
  border-radius: 1px;
  color: #565656;
  cursor: pointer;
  height: 17px;
  right: 20px;
  line-height: 15px;
  padding: 2px;
  position: absolute;
  text-align: center;
  width: 23px;
}

/** Vector Map End**/

/*-----------------------------------------------------------------*/

/*------------------------------------------------------------------
  -------------------------- GALLERY ----------------------------
-------------------------------------------------------------------*/

.ls-gallery-paddingless-wrap {
  padding: 0;
}

.ls-gallery-filter-wrap {
  margin: 10px 0;
}

.ls-gallery-search {
  text-align: left;
}

.ls-gallery-search input {
  border-radius: 0;
  height: 35px;
  padding-right: 5px;
  border: 1px solid #DEDEDE;
}

.ls-gallery-search input:focus,
.ls-gallery-search select {
  border: 1px solid #FF7878;
}

.ls-gallery-search select {
  border-radius: 0;
  border: 1px solid #DEDEDE;
  height: 35px;
  background: #ffffff;
  display: inline-block;
  padding: 3px 5px 3px 3px;
}

.ls-gallery-search select > option {
  border-bottom: 1px solid #DEDEDE;
  height: 35px;
  padding: 6px 5px 3px 3px;
  background: #FFFFFF;
}

.ls-gallery-search select option:hover {
  color: #FFFFFF;
  background-color: #FF7878;
  cursor: pointer;
}

.ls-gallery-filter {
  position: relative;
  margin: 5px 0;
}

.ls-gallery-filter ul {
  padding: 0;
  margin: 0;
  text-align: center;
}

.ls-gallery-filter ul li {
  list-style: none;
  display: inline-block;
  width: 100px;
  padding: 2px 10px;
  background-color: #235b67;
}

.ls-gallery-filter ul li a {
  color: #E3DFD8;
}

.ls-gallery-filter ul :hover {
  color: #ffffff;
}

.ls-gallery-filter ul .active {
  background: #222222;
}

.ls-gallery {
  position: relative;
  margin-top: 20px;
}

.ls-gallery .item {
  position: absolute;
  top: 0;
  z-index: 1;
  width: 192px;
  background-color: #fff;
  box-shadow: 0 1px 3px rgba(34, 25, 25, 0.4);
  -moz-box-shadow: 0 1px 3px rgba(34, 25, 25, 0.4);
  -webkit-box-shadow: 0 1px 3px rgba(34, 25, 25, 0.4);
  filter: progid:DXImageTransform.Microsoft.Shadow(color = #adacac, direction = 135, strength = 2);
}

.ls-gallery .item img {
  display: block;
}

.ls-gallery .item a {
  text-decoration: none;
  position: absolute;
  padding: 5px 20px;
  bottom: -15px;
  right: 60px;
  background-color: #222222;
  z-index: 20;
  color: #ffffff;
}

.ls-gallery :hover {
  box-shadow: 0 1px 5px rgba(34, 25, 25, 0.8);
  -moz-box-shadow: 0 1px 5px rgba(34, 25, 25, 0.8);
  -webkit-box-shadow: 0 1px 5px rgba(34, 25, 25, 0.8);
  filter: progid:DXImageTransform.Microsoft.Shadow(color = #979797, direction = 135, strength = 3);
}

/******************** Gallery Hover Effect **********/

.ls-hover-block {
  position: relative;
  overflow: hidden;
}

.ls-hover-info {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  right: 0;
  margin: auto;
  text-align: center;
}

.ls-hover-info  div.ls-icons-link,
.ls-hover-info  div.ls-icons-remove,
.ls-hover-info  div.ls-icons-preview {
  position: absolute;
  width: 60px;
}

.ls-two-column-icon div.ls-icons-link,
.ls-two-column-icon div.ls-icons-remove,
.ls-two-column-icon div.ls-icons-preview {
  top: 45%;
}

.ls-three-column-icon div.ls-icons-link,
.ls-three-column-icon div.ls-icons-remove,
.ls-three-column-icon div.ls-icons-preview {
  top: 40%;
}

.ls-four-column-icon div.ls-icons-link,
.ls-four-column-icon div.ls-icons-remove,
.ls-four-column-icon div.ls-icons-preview {
  top: 35%;
}

.ls-hover-info div.ls-icons-link {
  right: -100%;
  transition: right 200ms linear;
  -webkit-transition: right 200ms linear;
  -moz-transition: right 200ms linear;
}

.ls-hover-info div.ls-icons-preview {
  opacity: 0;
  transition: opacity 200ms linear;
  -webkit-transition: opacity 200ms linear;
  -moz-transition: opacity 200ms linear;
}

.ls-hover-info div.ls-icons-remove {
  left: -100%;
  transition: left 200ms linear;
  -webkit-transition: left 200ms linear;
  -moz-transition: left 200ms linear;
}

.ls-hover-info:hover div.ls-icons-link {
  transition-delay: 250ms;
  -webkit-transition-delay: 250ms;
  -moz-transition-delay: 250ms;
}

.ls-hover-info:hover div.ls-icons-preview {
  opacity: 1;
  transition-delay: 450ms;
  -webkit-transition-delay: 450ms;
  -moz-transition-delay: 450ms;
}

.ls-hover-info:hover div.ls-icons-remove {
  transition-delay: 650ms;
  -webkit-transition-delay: 650ms;
  -moz-transition-delay: 650ms;
}

/* Ls Two Column Icon Gap*/

.ls-two-column-icon:hover div.ls-icons-link {
  top: 45%;
  right: 30%;
}

.ls-two-column-icon:hover div.ls-icons-preview {
  top: 45%;
  right: 0;
  left: 0;
  margin: auto;
}

.ls-two-column-icon:hover div.ls-icons-remove {
  top: 45%;
  left: 30%;
}

/* Ls Three Column Icon Gap */

.ls-three-column-icon:hover div.ls-icons-link {
  top: 40%;
  right: 20%;
}

.ls-three-column-icon:hover div.ls-icons-preview {
  top: 40%;
  right: 0;
  left: 0;
  margin: auto;
}

.ls-three-column-icon:hover div.ls-icons-remove {
  top: 40%;
  left: 20%;
}

/* Ls Four Column Icon Gap*/

.ls-four-column-icon:hover div.ls-icons-link {
  top: 35%;
  right: 10%;
}

.ls-four-column-icon:hover div.ls-icons-preview {
  top: 35%;
  right: 0;
  left: 0;
  margin: auto;
}

.ls-four-column-icon:hover div.ls-icons-remove {
  top: 35%;
  left: 10%;
}

/********************************************/

.ls-hover-info h1 {
  font-size: 16px;
  padding: 10px 20px;
  margin: 0;
  background: rgba(255, 120, 120, 0.62);
  color: #E7E7E7;
  position: absolute;
  top: 0;
  right: -100%;
  transition: left 200ms linear;
  -webkit-transition: left 200ms linear;
  -moz-transition: left 200ms linear;
}

.ls-hover-info p {
  font-size: 14px;
  line-height: 1.4;
  color: #fff;
  position: absolute;
  top: 40%;
  right: 0;
  left: 0;
  width: 80%;
  margin: auto;
  text-align: center;
  opacity: 0;
  transition: opacity 200ms linear;
  -webkit-transition: opacity 200ms linear;
  -moz-transition: opacity 200ms linear;
}

.ls-hover-info div.ls-icons-link a,
.ls-hover-info div.ls-icons-preview a,
.ls-hover-info div.ls-icons-remove a {
  display: block;
  width: 50px;
  height: 50px;
  line-height: 50px;
  text-align: center;
  background: #555557;
  border-radius: 50%;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  font-size: 24px;
  margin: 0 5px;
  color: #ffffff;
  opacity: 0.6;
}

.ls-hover-info:hover h1 {
  right: 0;
  transition-delay: 250ms;
  -webkit-transition-delay: 250ms;
  -moz-transition-delay: 250ms;
}

.ls-hover-info:hover p {
  opacity: 1;
  transition-delay: 600ms;
  -webkit-transition-delay: 600ms;
  -moz-transition-delay: 600ms;
}

.ls-hover-info:hover a {
  left: 0;
  transition: right 200ms linear 700ms, color, background 200ms linear;
  -webkit-transition: right 200ms linear 700ms, color, background 200ms linear;
  -moz-transition: right 200ms linear 700ms, color, background 200ms linear;
}

.ls-hover-info a:hover .fa {
  color: #ff7878;
}

.ls-block-effect .ls-blind {
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.8);
  position: absolute;
  transition: all 200ms linear;
  -webkit-transition: all 200ms linear;
  -moz-transition: all 200ms linear;
  transform: scale(0, 1);
  -webkit-transform: scale(0, 1);
}

.ls-block-effect .ls-blind {
  top: 0;
  right: 0;
}

.ls-block-effect:hover .ls-blind {
  transform: scale(1, 1);
  -webkit-transform: scale(1, 1);
}

/*-----------------------------------------------------------------*/

/*------------------------------------------------------------------
  -------------------------- MEDIA ------------------------------
-------------------------------------------------------------------*/

.ls-cropper-wrapper {
  background-color: #f7f7f7;
  border: 1px solid #eee;
  box-shadow: inset 0 0 3px #f7f7f7;
  height: auto;
  width: 100%;
  overflow: hidden;
}

.ls-cropper-wrapper img {
  width: 100%;
}

.ls-cropper-preview {
  margin-bottom: 15px;
}

.preview {
  float: right;
  margin-left: 15px;
  margin-bottom: 15px;
  overflow: hidden;
  background: #f7f7f7;
}

.preview-lg {
  width: 290px;
  height: 160px;
  max-width: 100%;
}

.preview-md {
  width: 145px;
  height: 90px;
  max-width: 100%;
}

.preview-sm {
  width: 72.5px;
  height: 45px;
  max-width: 100%;
}

.preview-xs {
  width: 36.25px;
  height: 22.5px;
  max-width: 100%;
}

.ls-cropper-data {
  padding-left: 15px;
}

.ls-cropper-data .input-group {
  width: 100%;
  margin-bottom: 15px;
}

.ls-cropper-data .input-group-addon {
  min-width: 65px;
}

.ls-cropper-button {
  margin-bottom: 15px;
}

.ls-cropper-button > .btn {
  margin-left: 15px;
}

.ls-cropper-input .input-group {
  margin-bottom: 15px;
}

.ls-cropper-input .input-group .btn {
  width: 140px;
}

.cropper-button {
  margin-top: 15px;
}

.media-gap {
  margin-top: 30px;
}

/*-----------------------------------------------------------------*/

/*------------------------------------------------------------------
  -------------------------- PRICING TABLE ----------------------
-------------------------------------------------------------------*/

.ls-pricing-table-wrap {
  margin-top: 40px;
  margin-bottom: 20px;
}

.ls-android-pricing-table-wrap {
  margin-top: 30px;
  margin-bottom: 50px;
}

.basic {
  position: relative;
  box-shadow: 1px 2px 2px #dedede;
  -moz-box-shadow: 1px 2px 2px #dedede;
  -webkit-box-shadow: 1px 2px 2px #dedede;
  -webkit-transform: scale(1, 1);
  -webkit-transition-timing-function: ease-out;
  -webkit-transition-duration: 250ms;
  -moz-transform: scale(1, 1);
  -moz-transition-timing-function: ease-out;
  -moz-transition-duration: 250ms;
}

.basic ul {
  padding: 0;
  margin: 0;
}

.basic ul li {
  position: relative;
  list-style: none;
  text-align: center;
  height: 70px;
  padding: 10px;
}

.basic ul li h4 {
  font-size: 14px;
  padding: 5px;
  margin: 0;
}

.basic ul li:first-child {
  height: 150px;
  line-height: 150px;
  background-color: #ffffff !important;
  padding: 0;
}

.basic ul li:first-child div.ls-hex-bage {
  width: 100%;
  height: 55px;
  line-height: 55px;
  position: absolute;
  margin: auto;
  top: -150px;
  right: 0;
  bottom: 0;
  left: 0;
  -moz-box-shadow: 0px -2px 2px #ffffff;
  -webkit-box-shadow: 0px -2px 2px #ffffff;
  box-shadow: 0px -2px 2px #ffffff;
}

.basic ul li:first-child div.ls-hex-bage span.ls-pricing {
  font-size: 24px;
  font-weight: bold;
  text-transform: uppercase;
}

.basic ul li:first-child div.basic-price-simple {
  position: absolute;
  height: 85px;
  width: 100%;
  bottom: 0;
  color: #746566;
}

.basic ul li:first-child div.basic-price-simple h3 {
  font-size: 46px;
  font-weight: bold;
}

.basic ul li:first-child div.basic-price-simple h3 span {
  font-size: 18px;
}

.basic ul li:first-child div.basic-price-simple h3 span.doller {
  font-size: 30px;
  position: relative;
  top: -12px;
}

.basic ul li:first-child div.bage-hide {
  display: none;
}

.basic ul li:first-child div.free-bage {
  background: #beb7a7;
}

.basic ul li:first-child div.basic-bage {
  background: #f2aec1;
}

.basic ul li:first-child div.standard-bage {
  background: #f2809f;
}

.basic ul li:first-child div.premium-bage {
  background: #f2527d;
}

.basic ul li:first-child div.ls-hex-bage:after {
  content: "";
  position: absolute;
  bottom: -40px;
  right: 0;
  left: 0;
  width: 0;
  height: 0;
  margin: auto;
  border-right: 75px solid transparent;
  border-left: 75px solid transparent;
}

.basic ul li:first-child div.free-bage:after {
  border-top: 50px solid #beb7a7;
}

.basic ul li:first-child div.basic-bage:after {
  border-top: 50px solid #f2aec1;
}

.basic ul li:first-child div.standard-bage:after {
  border-top: 50px solid #f2809f;
}

.basic ul li:first-child div.premium-bage:after {
  border-top: 50px solid #f2527d;
}

.basic ul li:last-child {
  height: 80px;
  line-height: 80px;
  background-color: #ffffff !important;
  padding: 0;
}

.basic ul li:last-child a.btn {
  width: 50%;
  border: 0;
  color: white;
}

.basic ul li:last-child a.free-btn {
  background: #beb7a7;
}

.basic ul li:last-child a.basic-btn {
  background: #f2aec1;
}

.basic ul li:last-child a.standard-btn {
  background: #f2809f;
}

.basic ul li:last-child a.premium-btn {
  background: #f2527d;
}

.basic ul li:nth-child(odd) {
  background-color: #e0e0e0;
}

.basic ul li:nth-child(even) {
  background-color: #fafafa;
}

.basic:hover {
  -webkit-transform: scale(1.05, 1.07);
  -webkit-transition-timing-function: ease-out;
  -webkit-transition-duration: 250ms;
  -moz-transform: scale(1.05, 1.07);
  -moz-transition-timing-function: ease-out;
  -moz-transition-duration: 250ms;
  position: relative;
  z-index: 99;
}

.basic:hover ul li:first-child div.bage-hide {
  display: block;
}

.basic:hover ul li:last-child a.btn:hover {
  color: white;
  background: #58595B;
}

.free-wrap ul li:first-child {
  border-top: 3px solid #beb7a7;
  border-bottom: 2px solid #beb7a7;
}

.free-wrap ul li:last-child {
  border-top: 2px solid #beb7a7;
}

.basic-wrap ul li:first-child {
  border-top: 3px solid #f2aec1;
  border-bottom: 2px solid #f2aec1;
}

.basic-wrap ul li:last-child {
  border-top: 2px solid #f2aec1;
}

.standard-wrap ul li:first-child {
  border-top: 3px solid #f2809f;
  border-bottom: 2px solid #f2809f;
}

.standard-wrap ul li:last-child {
  border-top: 2px solid #f2809f;
}

.premium-wrap ul li:first-child {
  border-top: 3px solid #f2527d;
  border-bottom: 2px solid #f2527d;
}

.premium-wrap ul li:last-child {
  border-top: 2px solid #f2527d;
}

.basic-active {
  -webkit-transform: scale(1.05, 1.07);
  -webkit-transition-timing-function: ease-out;
  -webkit-transition-duration: 250ms;
  -moz-transform: scale(1.05, 1.07);
  -moz-transition-timing-function: ease-out;
  -moz-transition-duration: 250ms;
  position: relative;
  z-index: 99;
}

.basic-active ul li:first-child div.bage-hide {
  display: block;
  -webkit-transform: scale(1.05, 1.07);
  -webkit-transition-timing-function: ease-out;
  -webkit-transition-duration: 250ms;
  -moz-transition-timing-function: ease-out;
  -moz-transition-duration: 250ms;
  z-index: 99;
}

/***************************************/

.android {
  position: relative;
  -webkit-transform: scale(1, 1);
  -webkit-transition-timing-function: ease-out;
  -webkit-transition-duration: 250ms;
  -moz-transform: scale(1, 1);
  -moz-transition-timing-function: ease-out;
  -moz-transition-duration: 250ms;
}

.android ul {
  padding: 0;
  margin: 0;
}

.android ul li {
  display: block;
  list-style: none;
  text-align: center;
  border: 1px solid #e0e0e0;
}

.android ul li h4 {
  font-size: 14px;
}

.android ul li p .fa {
  font-size: 16px;
}

.android ul li p span {
  font-size: 15px;
  margin-right: 10px;
}

.android ul li:first-child {
  height: 270px;
  border: 0;
}

.android ul li:first-child h3 {
  padding-top: 10px;
  color: rgba(0, 0, 0, 0.6);
  font-size: 38px;
  text-shadow: rgba(255, 255, 255, 0.2) 3px 2px 3px;
}

.android ul li:first-child p {
  color: #000;
}

.android ul li:first-child .ls-bubble {
  width: 150px;
  height: 150px;
  line-height: 150px;
  border-radius: 50%;
  position: absolute;
  margin: auto;
  right: 0;
  left: 0;
  bottom: 0;
  top: -220px;
  -moz-box-shadow: inset -1px -1px 10px #141412;
  -webkit-box-shadow: inset -1px -1px 10px #141412;
  box-shadow: inset -1px -1px 10px #141412;
}

.android ul li:first-child .ls-bubble span.ls-pricing {
  font-size: 30px;
  color: white;
  font-weight: bold;
  text-shadow: #2e2e2e 0px 4px 5px;
}

.android ul li:first-child .ls-bubble span.ls-pricing-m {
  /**** Issue Fixed @new ***/
  font-size: 16px;
  font-weight: bold;
  margin-right: 3px;
  color: #fff;
}

.android ul li:last-child {
  height: 80px;
  line-height: 80px;
  padding: 0;
  border: 0;
}

.android ul li:last-child a.btn {
  width: 50%;
  border: 0;
  color: #000000;
}

.android ul li:last-child a.btn:hover {
  color: white;
  background: #58595B;
}

.android-active {
  transform: scale(1.1, 1.14);
  -webkit-transform: scale(1.1, 1.14);
  -webkit-transition-timing-function: ease-out;
  -webkit-transition-duration: 250ms;
  -moz-transform: scale(1.1, 1.14);
  -moz-transition-timing-function: ease-out;
  -moz-transition-duration: 250ms;
  position: relative;
  z-index: 99;
}

.android-basic ul li:first-child {
  background: #aaaa9e;
}

.android-basic ul li:first-child .ls-bubble {
  background: #aaaa9e;
}

.android-basic ul li:last-child {
  background: #aaaa9e;
}

.android-basic ul li:last-child a.btn {
  background-color: white;
}

.android-basic:hover,
.android-pro:hover,
.android-premium:hover {
  transform: scale(1.1, 1.14);
  -webkit-transform: scale(1.1, 1.14);
  -webkit-transition-timing-function: ease-out;
  -webkit-transition-duration: 250ms;
  -moz-transform: scale(1.1, 1.14);
  -moz-transition-timing-function: ease-out;
  -moz-transition-duration: 250ms;
  position: relative;
  z-index: 200;
}

.android-pro ul li:first-child {
  background: #71624e;
}

.android-pro ul li:first-child .ls-bubble {
  background: #71624e;
}

.android-pro ul li:last-child {
  background: #71624e;
}

.android-pro ul li:last-child a.btn {
  background-color: white;
}

.android-premium ul li:first-child {
  background: #5f4f3f;
}

.android-premium ul li:first-child .ls-bubble {
  background: #5f4f3f;
}

.android-premium ul li:last-child {
  background: #5f4f3f;
}

.android-premium ul li:last-child a.btn {
  background-color: white;
}

/**************************************/

.basic-simple {
  position: relative;
  box-shadow: 1px 2px 2px #dedede;
  -moz-box-shadow: 1px 2px 2px #dedede;
  -webkit-box-shadow: 1px 2px 2px #dedede;
  -webkit-transform: scale(1, 1);
  -webkit-transition-timing-function: ease-out;
  -webkit-transition-duration: 250ms;
  -moz-transform: scale(1, 1);
  -moz-transition-timing-function: ease-out;
  -moz-transition-duration: 250ms;
}

.basic-simple ul {
  padding: 0;
  margin: 0;
}

.basic-simple ul li {
  position: relative;
  list-style: none;
  text-align: center;
  height: 45px;
  padding: 10px;
}

.basic-simple ul li h4 {
  font-size: 14px;
  padding: 5px;
  margin: 0;
}

.basic-simple ul li:first-child {
  height: 150px;
  line-height: 150px;
  padding: 0;
}

.basic-simple ul li:first-child div.ls-hex-bage-simple {
  width: 150px;
  height: 55px;
  line-height: 55px;
  position: absolute;
  margin: auto;
  top: -150px;
  right: 0;
  bottom: 0;
  left: 0;
  -moz-box-shadow: 0px -2px 3px #000000;
  -webkit-box-shadow: 0px -2px 3px #000000;
  box-shadow: 0px -2px 3px #000000;
}

.basic-simple ul li:first-child div.ls-hex-bage-simple span.ls-pricing {
  font-size: 20px;
  font-weight: bold;
  text-transform: uppercase;
}

.basic-simple ul li:first-child div.basic-price-simple {
  position: absolute;
  height: 85px;
  width: 100%;
  bottom: 0;
  color: #746566;
}

.basic-simple ul li:first-child div.basic-price-simple h3 {
  font-size: 46px;
  font-weight: bold;
  color: white;
}

.basic-simple ul li:first-child div.basic-price-simple h3 span {
  font-size: 18px;
}

.basic-simple ul li:first-child div.basic-price-simple h3 span.doller {
  font-size: 30px;
  position: relative;
  top: -12px;
}

.basic-simple ul li:first-child .basic-simple-package,
.basic-simple ul li:first-child .basic-standard-package,
.basic-simple ul li:first-child .basic-premium-package {
  position: relative;
  padding-top: 2px;
}

.basic-simple ul li:first-child .basic-simple-package h3,
.basic-simple ul li:first-child .basic-standard-package h3,
.basic-simple ul li:first-child .basic-premium-package h3 {
  color: white;
  font-size: 44px;
  text-shadow: #030303 4px 4px 4px;
}

.basic-simple ul li:first-child div.bage-hide {
  visibility: hidden;
  -webkit-transition: opacity 1s ease-out;
  -moz-transition: opacity 1s ease-out;
  -o-transition: opacity 1s ease-out;
  transition: opacity 1s ease-out;
  opacity: 0;
}

.basic-simple ul li:first-child div.simple-basic-bage {
  background: white;
}

.basic-simple ul li:first-child div.simple-standard-bage {
  background: white;
}

.basic-simple ul li:first-child div.simple-premium-bage {
  background: white;
}

.basic-simple ul li:first-child div.ls-hex-bage-simple:after {
  content: "";
  position: absolute;
  bottom: -40px;
  right: 0;
  width: 0;
  height: 0;
  border-right: 75px solid transparent;
  border-left: 75px solid transparent;
}

.basic-simple ul li:first-child div.simple-basic-bage:after {
  border-top: 50px solid white;
}

.basic-simple ul li:first-child div.simple-standard-bage:after {
  border-top: 50px solid white;
}

.basic-simple ul li:first-child div.simple-premium-bage:after {
  border-top: 50px solid white;
}

.basic-simple ul li:last-child {
  height: 80px;
  line-height: 80px;
  padding: 0;
}

.basic-simple ul li:last-child a.btn {
  width: 50%;
  border: 0;
  color: black;
}

.basic-simple ul li:last-child a.free-btn {
  background: white;
}

.basic-simple ul li:last-child a.basic-btn {
  background: white;
}

.basic-simple ul li:last-child a.standard-btn {
  background: white;
}

.basic-simple ul li:last-child a.premium-btn {
  background: white;
}

.basic-simple ul li:nth-child(odd) {
  background-color: #e0e0e0;
}

.basic-simple ul li:nth-child(even) {
  background-color: #fafafa;
}

.basic-simple:hover {
  -webkit-transform: scale(1.05, 1.07);
  -webkit-transition-timing-function: ease-out;
  -webkit-transition-duration: 250ms;
  -moz-transform: scale(1.05, 1.07);
  -moz-transition-timing-function: ease-out;
  -moz-transition-duration: 250ms;
  position: relative;
  z-index: 99;
}

.basic-simple:hover ul li:first-child div.bage-hide {
  opacity: 1;
  visibility: visible;
  -webkit-transition: opacity 1s ease-in;
  -moz-transition: opacity 1s ease-in;
  -o-transition: opacity 1s ease-in;
  transition: opacity 1s ease-in;
}

.basic-simple:hover ul li:first-child div.basic-simple-package,
.basic-simple:hover ul li:first-child div.basic-standard-package,
.basic-simple:hover ul li:first-child div.basic-premium-package {
  opacity: 0;
  visibility: hidden;
  -webkit-transition: opacity 1s ease-out;
  -moz-transition: opacity 1s ease-out;
  -o-transition: opacity 1s ease-out;
  transition: opacity 1s ease-out;
}

.basic-simple:hover ul li:last-child a.btn:hover {
  color: white;
  background: #58595B;
}

.simple-basic-wrap ul li:first-child {
  background: #e8b690;
}

.simple-basic-wrap ul li:last-child {
  background: #e8b690;
}

.simple-standard-wrap ul li:first-child {
  background: #e88f6c;
}

.simple-standard-wrap ul li:last-child {
  background: #e88f6c;
}

.simple-premium-wrap ul li:first-child {
  background: #ffa17f;
}

.simple-premium-wrap ul li:last-child {
  background: #ffa17f;
}

.basic-active {
  -webkit-transform: scale(1.05, 1.07);
  -webkit-transition-timing-function: ease-out;
  -webkit-transition-duration: 250ms;
  -moz-transform: scale(1.05, 1.07);
  -moz-transition-timing-function: ease-out;
  -moz-transition-duration: 250ms;
  position: relative;
  z-index: 99;
}

.basic-active ul li:first-child div.bage-hide {
  opacity: 1;
  visibility: visible;
  -webkit-transition: opacity 1s ease-in;
  -moz-transition: opacity 1s ease-in;
  -o-transition: opacity 1s ease-in;
  transition: opacity 1s ease-in;
}

.basic-active ul li:first-child div.basic-simple-package,
.basic-active ul li:first-child div.basic-standard-package,
.basic-active ul li:first-child div.basic-premium-package {
  opacity: 0;
  visibility: hidden;
  -webkit-transition: opacity 1s ease-out;
  -moz-transition: opacity 1s ease-out;
  -o-transition: opacity 1s ease-out;
  transition: opacity 1s ease-out;
}

/*-----------------------------------------------------------------*/

/*------------------------------------------------------------------
  -------------------------- PROFILE ----------------------------
-------------------------------------------------------------------*/

.ls-user-skills {
  position: relative;
}

.ls-user-skills ul {
  padding: 0;
  margin: 0;
}

.ls-user-skills ul li {
  list-style: none;
  display: block;
  border-bottom: 1px solid #cbc5ba;
  padding: 5px 0px;
  height: 40px;
  line-height: 30px;
}

.ls-user-skills ul li div.ls-skill-list {
  position: relative;
}

.ls-user-skills ul li div.ls-skill-list h4 {
  width: 15%;
  float: right;
  font-size: 12px;
}

.ls-user-skills ul li div.ls-skill-list .ls-progress {
  width: 75%;
  float: right;
  margin-top: 13px;
}

.ls-user-skills ul li div.ls-skill-list span {
  padding: 5px 15px 5px 0;
}

.ls-user-skills ul li:last-child {
  border: none;
}

.ls-user-skills .ls-add-skill-wrap {
  border: 1px solid #cbc5ba;
}

.ls-user-skills .ls-add-skill-wrap a {
  width: 100px;
}

.ls-user-details {
  position: relative;
}

.ls-user-details .ls-user-name {
  position: relative;
  margin-top: 10px;
}

.ls-user-details .ls-user-name h1 {
  font-size: 18px;
  padding: 0;
  margin: 0;
}

.ls-user-details .ls-user-name a.user-edit {
  position: absolute;
  top: 1px;
  left: 0;
  border: 5px solid #cbc5ba;
  height: 45px;
  width: 45px;
  line-height: 35px;
  text-align: center;
  border-radius: 50%;
  color: #cbc5ba;
}

.ls-user-details .ls-user-links {
  position: relative;
}

.ls-user-details .ls-user-links ul {
  padding: 0;
  margin: 0;
  text-align: left;
}

.ls-user-details .ls-user-links ul li {
  list-style: none;
  display: inline-block;
  width: 40px;
  height: 40px;
  line-height: 45px;
  border: 1px solid #cbc5ba;
  border-radius: 50%;
  text-align: center;
}

.ls-user-details .ls-user-links ul li .fa {
  font-size: 20px;
  color: #FF7878;
}

.ls-user-details .ls-user-links ul li:hover .fa {
  color: #1FB5AD;
}

.ls-user-details .user-detail {
  margin: 15px 0 0 0;
  padding: 0 10px;
}

.ls-user-details .user-detail .ls-user-position {
  padding: 5px 10px;
  background: #dfdfdf;
  margin-bottom: 15px;
}

.ls-user-details .user-detail .ls-user-position h4 {
  margin-top: 0;
  font-size: 15px;
  margin-bottom: 5px;
  font-weight: normal;
}

.ls-user-details .user-detail .ls-user-position P {
  margin: 0;
}

.ls-user-details .user-detail address {
  background: #1FB5AD;
  padding: 5px 10px;
  color: #FFFFFF;
}

.ls-user-details .user-detail .ls-user-links {
  position: relative;
  margin-top: 50px;
}

.ls-user-details .user-detail .ls-user-links ul {
  padding: 0;
  margin: 0;
}

.ls-user-details .user-detail .ls-user-links ul li {
  list-style: none;
  display: inline-block;
  width: 40px;
  height: 40px;
  line-height: 45px;
  border: 1px solid #cbc5ba;
  border-radius: 50%;
  text-align: center;
}

.ls-user-details .user-detail .ls-user-links ul li .fa {
  font-size: 20px;
}

.ls-user-details .user-detail .user-pic {
  position: absolute;
  top: -35px;
  right: 315px;
  width: 200px;
  height: 200px;
  border: 10px solid #f8f7f7;
  border-radius: 50%;
  z-index: 1;
  overflow: hidden;
}

.ls-user-details .user-detail .user-pic img {
  max-width: 100%;
  width: 180px;
  height: 180px;
  border: 10px solid #dfdfdf;
  border-radius: 50%;
}

.ls-user-details .ls-user-info .ls-user-text {
  color: #FFFFFF;
  background: #1FB5AD;
  text-align: left;
  margin-top: 15px;
  padding: 5px 45px 5px 10px;
}

.ls-user-details .ls-user-info .ls-user-text2 {
  background: #dfdfdf;
  text-align: left;
  margin-top: 15px;
  padding: 5px 45px 5px 10px;
}

.ls-user-details .ls-user-info .ls-user-text2 h4 {
  margin: 0 0 5px 0;
  font-size: 15px;
  font-weight: normal;
}

.ls-user-subscriber {
  position: relative;
  margin-top: 15px;
}

.ls-user-subscriber .ls-user-element {
  float: right;
  margin-top: -12px;
}

.ls-user-subscriber .ls-user-element .easyPieChartBlack {
  margin: 0;
  line-height: 100px;
}

.ls-user-subscriber .ls-user-box-content {
  text-align: center;
  float: right;
  margin-right: -45px;
  margin-top: 15px;
}

.ls-user-subscriber .ls-user-box-content .fa {
  font-size: 20px;
  color: #FF7878;
}

.ls-user-subscriber .ls-user-box-content h1 {
  font-size: 18px;
  margin-top: 5px;
}

.ls-user-feature {
  width: 100%;
}

.ls-user-feature ul {
  padding: 0;
  margin: 0;
  text-align: left;
}

.ls-user-feature ul li {
  list-style: none;
  display: inline-block;
}

.ls-user-feature ul li .circliful {
  position: relative;
}

.ls-user-feature ul li .circle-text,
.ls-user-feature ul li .circle-info,
.ls-user-feature ul li .circle-text-half,
.ls-user-feature ul li .circle-info-half {
  width: 100%;
  position: absolute;
  text-align: center;
  display: inline-block;
}

.ls-user-feature ul li .circle-info,
.ls-user-feature ul li .circle-info-half {
  color: #999;
}

.ls-user-feature ul li .circliful .fa {
  position: absolute;
  top: 25px;
  font-size: 18px;
  color: #FF7878;
}

.user-profile-tab .user-friend-list {
  position: relative;
}

.user-friend-list ul {
  padding: 0px;
  margin: 0px;
  text-align: center;
}

.user-friend-list ul li {
  position: relative;
  list-style: none;
  display: inline-block;
  margin: 5px;
  outline: none !important;
}

.user-friend-list ul li a {
  outline: none;
}

.user-friend-list ul li a:focus {
  outline: none;
}

.user-friend-list ul li img {
  height: auto;
  width: 70px;
  max-width: 100%;
  border: 2px solid #fff;
  transition: all 300ms ease-in-out 0s;
}

.user-friend-list ul li:hover img {
  border: 2px solid #ff7878;
  transition: all 300ms ease-in-out 0s;
}

span.ls-friend-status {
  border-radius: 8px;
  bottom: -3px;
  display: block;
  height: 10px;
  right: 30px;
  position: absolute;
  width: 10px;
}

.ls-friends-info ul {
  padding: 0;
  margin: 0;
  text-align: right;
}

.ls-friends-info ul li .fa {
  color: #1FB5AD;
}

.ls-friends-info ul li:hover .fa {
  color: #ff7878;
}

.ls-friends-info ul li:first-child {
  margin-right: -1px;
}

.ls-friends-info address .fa {
  color: #1FB5AD;
}

.ls-friends-info-wrap img {
  margin-left: 5px;
}

span.about-me-text {
  margin-bottom: 10px;
}

h3.user-profession-title {
  font-size: 14px;
  margin: 5px 0;
  padding: 0;
}

span.user-company-name {
  color: #1FB5AD;
}

#ls-downloadLink {
  margin-top: 15px;
}

.user-map-locator {
  width: 100%;
  height: 200px;
  margin-top: 25px;
}

.ls-view {
  overflow: hidden;
  position: relative;
  text-align: center;
  cursor: default;
}

.ls-view .ls-mask,
.ls-view .content {
  width: 100%;
  height: 100%;
  position: absolute;
  overflow: hidden;
  top: 0;
  right: 0;
}

.ls-view img {
  display: block;
  position: relative;
}

.ls-view a.info {
  background: url("../../images/link.png") center no-repeat;
  display: inline-block;
  text-decoration: none;
  padding: 0;
  text-indent: -9999px;
  width: 20px;
  height: 20px;
}

.ls-view a.ls-timeline-project-info {
  background: url("../../images/link.png") center no-repeat;
  display: inline-block;
  text-decoration: none;
  padding: 0;
  text-indent: -9999px;
  width: 20px;
  height: 20px;
}

.ls-hover-effect .ls-mask {
  opacity: 0;
  overflow: visible;
  border: 0px solid rgba(0,0,0,0.7);
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  -ms-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
}

.ls-hover-effect a.info {
  position: relative;
  right: -60px;
  top: -67px;
  opacity: 0;
  -moz-transform: scale(0,0);
  -webkit-transform: scale(0,0);
  -o-transform: scale(0,0);
  -ms-transform: scale(0,0);
  transform: scale(0,0);
  -webkit-transition: -webkit-transform 0.2s 0.1s ease-in, opacity 0.1s ease-in-out;
  -moz-transition: -moz-transform 0.2s 0.1s ease-in, opacity 0.1s ease-in-out;
  -o-transition: -o-transform 0.2s 0.1s ease-in, opacity 0.1s ease-in-out;
  -ms-transition: -ms-transform 0.2s 0.1s ease-in, opacity 0.1s ease-in-out;
  transition: transform 0.2s 0.1s ease-in, opacity 0.1s ease-in-out;
}

.ls-hover-effect a.ls-timeline-project-info {
  position: relative;
  right: -65px;
  top: -70px;
  opacity: 0;
  -moz-transform: scale(0,0);
  -webkit-transform: scale(0,0);
  -o-transform: scale(0,0);
  -ms-transform: scale(0,0);
  transform: scale(0,0);
  -webkit-transition: -webkit-transform 0.2s 0.1s ease-in, opacity 0.1s ease-in-out;
  -moz-transition: -moz-transform 0.2s 0.1s ease-in, opacity 0.1s ease-in-out;
  -o-transition: -o-transform 0.2s 0.1s ease-in, opacity 0.1s ease-in-out;
  -ms-transition: -ms-transform 0.2s 0.1s ease-in, opacity 0.1s ease-in-out;
  transition: transform 0.2s 0.1s ease-in, opacity 0.1s ease-in-out;
}

.ls-hover-effect:hover .ls-mask {
  opacity: 1;
  border: 100px solid rgba(0,0,0,0.7);
}

.ls-hover-effect:hover a.info {
  opacity: 1;
  -moz-transform: scale(1,1);
  -webkit-transform: scale(1,1);
  -o-transform: scale(1,1);
  -ms-transform: scale(1,1);
  transform: scale(1,1);
  -moz-transition-delay: 0.3s;
  -webkit-transition-delay: 0.3s;
  -o-transition-delay: 0.3s;
  -ms-transition-delay: 0.3s;
  transition-delay: 0.3s;
}

.ls-hover-effect:hover a.ls-timeline-project-info {
  opacity: 1;
  -moz-transform: scale(1,1);
  -webkit-transform: scale(1,1);
  -o-transform: scale(1,1);
  -ms-transform: scale(1,1);
  transform: scale(1,1);
  -moz-transition-delay: 0.3s;
  -webkit-transition-delay: 0.3s;
  -o-transition-delay: 0.3s;
  -ms-transition-delay: 0.3s;
  transition-delay: 0.3s;
}

.feed-box-profile {
  /**** Issue Fixed @new ***/
  border: 1px solid #cbc5ba;
}

/*-----------------------------------------------------------------*/

/*------------------------------------------------------------------
   ------------------------- LOGIN -----------------------------
-------------------------------------------------------------------*/

body.login-screen {
  background: #252525;
}

.login-content {
  text-align: center;
}

.login-content h3 {
  color: #696969;
}

.login-box {
  width: 300px;
  margin: 5% auto;
  padding: 20px;
  background: #444444;
  position: relative;
  color: #999999;
  z-index: 1;
  /**** Issue Fixed @new ***/
}

.login-box .login-user-icon {
  border: 5px solid #565656;
  border-radius: 75px;
  color: #565656;
  font-size: 70px;
  height: 150px;
  line-height: 160px;
  margin: auto;
  text-align: center;
  width: 150px;
}

.login-box .login-user-icon img {
  width: 75px;
}

.login-box .login-user-icon.user {
  overflow: hidden;
  line-height: 100px;
}

.login-box .login-user-icon.user img {
  width: 100%;
}

.login-box .forgot-pass-box {
  display: none;
}

.login-box .login-form,
.login-box .forgot-pass-box {
  padding: 15px 0;
}

.login-box .login-form .bootstrap-switch,
.login-box .forgot-pass-box .bootstrap-switch {
  border-color: #565656;
  border-radius: 1px;
  -moz-border-radius: 1px;
  -webkit-border-radius: 1px;
}

.login-box .login-form .bootstrap-switch-label,
.login-box .forgot-pass-box .bootstrap-switch-label {
  background: #565656;
}

.login-box .login-form .bootstrap-switch.bootstrap-switch-focused,
.login-box .forgot-pass-box .bootstrap-switch.bootstrap-switch-focused {
  box-shadow: none;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
}

.login-box .login-form .bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-primary,
.login-box .login-form .bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-primary,
.login-box .forgot-pass-box .bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-primary,
.login-box .forgot-pass-box .bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-primary {
  background: #444444;
  color: #269abc;
}

.login-box .login-form .bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-default,
.login-box .login-form .bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-default,
.login-box .forgot-pass-box .bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-default,
.login-box .forgot-pass-box .bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-default {
  background: #444444;
  color: #ff7878;
}

.login-box .login-form .bootstrap-switch.bootstrap-switch-mini .bootstrap-switch-handle-on,
.login-box .login-form .bootstrap-switch.bootstrap-switch-mini .bootstrap-switch-handle-off,
.login-box .login-form .bootstrap-switch.bootstrap-switch-mini .bootstrap-switch-label,
.login-box .forgot-pass-box .bootstrap-switch.bootstrap-switch-mini .bootstrap-switch-handle-on,
.login-box .forgot-pass-box .bootstrap-switch.bootstrap-switch-mini .bootstrap-switch-handle-off,
.login-box .forgot-pass-box .bootstrap-switch.bootstrap-switch-mini .bootstrap-switch-label {
  font-size: 14px;
  line-height: 15px;
}

.login-box .login-form input:focus,
.login-box .login-form input:active,
.login-box .forgot-pass-box input:focus,
.login-box .forgot-pass-box input:active {
  box-shadow: none;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
}

.login-box .login-form input,
.login-box .forgot-pass-box input {
  background: #565656;
  border: 1px solid #565656;
  color: #999999;
}

.login-box .login-form .input-group-addon,
.login-box .forgot-pass-box .input-group-addon {
  background: #565656;
  color: #999999;
  border-color: #565656;
}

.login-box .login-form .remember-me,
.login-box .forgot-pass-box .remember-me {
  margin-bottom: 15px;
}

.login-box .login-form .login-btn-box,
.login-box .forgot-pass-box .login-btn-box {
  text-align: center;
  width: 100%;
  margin: auto;
}

.login-box .login-form .login-btn-box a.login-view:after,
.login-box .forgot-pass-box .login-btn-box a.login-view:after {
  color: #999999;
}

.login-box .login-form .login-btn-box a,
.login-box .forgot-pass-box .login-btn-box a {
  color: #999999;
}

.login-box .login-form .login-btn-box a:hover,
.login-box .forgot-pass-box .login-btn-box a:hover {
  color: #1fb5ad;
}

.login-box .login-form .login-btn-box i,
.login-box .forgot-pass-box .login-btn-box i {
  font-size: 20px;
}

.login-box .login-form .login-btn-box button,
.login-box .forgot-pass-box .login-btn-box button {
  margin-bottom: 15px;
}

.login-box .login-form input:focus,
.login-box .forgot-pass-box input:focus {
  border-color: #565656;
}

.login-box .login-form ::-webkit-input-placeholder,
.login-box .forgot-pass-box ::-webkit-input-placeholder {
  color: #999999;
  font-size: 12px;
}

.login-box .login-form :-moz-placeholder,
.login-box .forgot-pass-box :-moz-placeholder {
  /* Firefox 18- */
  color: #999999;
  font-size: 12px;
}

.login-box .login-form ::-moz-placeholder,
.login-box .forgot-pass-box ::-moz-placeholder {
  /* Firefox 19+ */
  color: #999999;
  font-size: 12px;
}

.login-box .login-form :-ms-input-placeholder,
.login-box .forgot-pass-box :-ms-input-placeholder {
  color: #999999;
  font-size: 12px;
}

.login-box .login-user-icon.user img {
  width: 100%;
}

.social-btn-login {
  text-align: center;
  margin-bottom: 10px;
}

.social-btn-login ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.social-btn-login ul li {
  display: inline;
  padding: 0 7px;
}

.social-btn-login ul li a {
  color: #999999;
  font-size: 14px;
  -webkit-transition: all 600ms linear;
  -moz-transition: all 600ms linear;
  -o-transition: all 600ms linear;
  -ms-transition: all 600ms linear;
  transition: all 600ms linear;
}

.social-btn-login ul li a:hover {
  color: dimgrey;
  -webkit-transition: all 600ms linear;
  -moz-transition: all 600ms linear;
  -o-transition: all 600ms linear;
  -ms-transition: all 600ms linear;
  transition: all 600ms linear;
}

/*-----------------------------------------------------------------*/

/*------------------------------------------------------------------
   ------------------------- NOT FOUND -------------------
-------------------------------------------------------------------*/

.not-found {
  color: #FFFFFF;
  margin: 20% auto;
  text-align: center;
}

.not-found h1 {
  font-size: 100px;
  line-height: 100px;
}

.not-found p {
  font-size: 15px;
}

.not-found a {
  color: #FFFFFF;
}

/*-----------------------------------------------------------------*/

/*------------------------------------------------------------------
   ------------------------- COMING SOON -------------------
-------------------------------------------------------------------*/

#outer-wrapper {
  height: 100%;
  position: relative;
  transition: all 0.3s ease-in-out 0s;
  width: 100%;
}

.coming-soon {
  color: #FFFFFF;
  margin: 10% auto;
  text-align: center;
}

.coming-soon h1 {
  font-family: 'Montserrat', sans-serif;
  font-size: 50px;
  line-height: 50px;
}

.time_circles > div > span {
  font-weight: normal;
}

.coming-soon .timer {
  margin: auto;
  width: 80%;
}

#main-container.comingSoonBody {
  background: #58595B;
}

.copy-right {
  bottom: 40px;
  font-size: 15px;
  margin: 0;
  padding: 0;
  position: fixed;
  width: 100%;
  font-family: 'Montserrat', sans-serif;
}

.copy-right.big-screen {
  font-size: 15px;
  text-align: center;
  color: #696969;
}

/*-----------------------------------------------------------------*/

/*------------------------------------------------------------------
   -------------------------WIDGETS------------------------------
-------------------------------------------------------------------*/

.gaugeBox {
  text-align: center;
}

.gaugeBox canvas {
  margin: auto;
}

.gaugeBox p {
  margin: 0;
  padding: 0;
}

.ls-chart-box {
  cursor: pointer;
  height: 75px;
  box-shadow: 3px 3px 3px #e0e0e0;
  color: white;
  background: #3F414D;
}

.ls-wizard {
  position: relative;
  margin: auto;
  border: 1px solid #cbc5ba;
  height: 75px;
  background: #1fb5ad;
  color: white;
  box-shadow: 3px 3px 3px #e0e0e0;
  cursor: pointer;
}

.ls-wizard h2 {
  font-size: 20px;
  margin: 0;
  padding: 25px 10px 0 0;
  -webkit-transition: all 200ms linear;
  -moz-transition: all 200ms linear;
  -o-transition: all 200ms linear;
  -ms-transition: all 200ms linear;
  transition: all 200ms linear;
}

.ls-wizard span {
  padding: 0 10px 0 0;
  opacity: 0;
  font-size: 13px;
  -webkit-transition: all 200ms linear;
  -moz-transition: all 200ms linear;
  -o-transition: all 200ms linear;
  -ms-transition: all 200ms linear;
  transition: all 200ms linear;
}

.ls-wizard .icon {
  float: left;
  position: absolute;
  left: 10px;
  top: 18px;
  -webkit-transition: all 200ms linear;
  -moz-transition: all 200ms linear;
  -o-transition: all 200ms linear;
  -ms-transition: all 200ms linear;
  transition: all 200ms linear;
}

.ls-wizard .icon i.fa {
  text-align: left;
  font-size: 40px;
  -webkit-transition: all 200ms linear;
  -moz-transition: all 200ms linear;
  -o-transition: all 200ms linear;
  -ms-transition: all 200ms linear;
  transition: all 200ms linear;
}

.ls-wizard.fullWidth {
  width: 100%;
}

.ls-wizard:hover h2,
.ls-wizard.active h2 {
  font-size: 15px;
  padding: 5px 10px 0 0;
  -webkit-transition: all 200ms linear;
  -moz-transition: all 200ms linear;
  -o-transition: all 200ms linear;
  -ms-transition: all 200ms linear;
  transition: all 200ms linear;
}

.ls-wizard:hover span,
.ls-wizard.active span {
  font-size: 25px;
  opacity: 1;
  -webkit-transition: all 200ms linear;
  -moz-transition: all 200ms linear;
  -o-transition: all 200ms linear;
  -ms-transition: all 200ms linear;
  transition: all 200ms linear;
}

.ls-wizard:hover .icon,
.ls-wizard.active .icon {
  top: 8px;
  -webkit-transition: all 200ms linear;
  -moz-transition: all 200ms linear;
  -o-transition: all 200ms linear;
  -ms-transition: all 200ms linear;
  transition: all 200ms linear;
}

.ls-wizard:hover .icon i.fa,
.ls-wizard.active .icon i.fa {
  font-size: 60px;
  -webkit-transition: all 200ms linear;
  -moz-transition: all 200ms linear;
  -o-transition: all 200ms linear;
  -ms-transition: all 200ms linear;
  transition: all 200ms linear;
}

.ls-chart-box .chart-box-content {
  float: right;
  display: inline-block;
}

.ls-chart-box .chart-box-content h1 {
  margin: 0;
  padding: 10px 15px 0 0;
  font-size: 20px;
  color: white;
  -webkit-transition: all 200ms linear;
  -moz-transition: all 200ms linear;
  -o-transition: all 200ms linear;
  -ms-transition: all 200ms linear;
  transition: all 200ms linear;
}

.ls-chart-box .chart-box-content p {
  padding: 0px 18px;
  font-size: 18px;
  -webkit-transition: all 200ms linear;
  -moz-transition: all 200ms linear;
  -o-transition: all 200ms linear;
  -ms-transition: all 200ms linear;
  transition: all 200ms linear;
}

.ls-chart-box .sparklineBadge-box {
  padding: 10px;
  float: left;
  display: inline-block;
}

.ls-chart-box:hover h1,
.ls-chart-box.active h1 {
  font-size: 14px;
  -webkit-transition: all 200ms linear;
  -moz-transition: all 200ms linear;
  -o-transition: all 200ms linear;
  -ms-transition: all 200ms linear;
  transition: all 200ms linear;
}

.ls-chart-box:hover p,
.ls-chart-box.active p {
  font-size: 22px;
  -webkit-transition: all 200ms linear;
  -moz-transition: all 200ms linear;
  -o-transition: all 200ms linear;
  -ms-transition: all 200ms linear;
  transition: all 200ms linear;
}

.ls-widget-box {
  cursor: pointer;
  position: relative;
  height: 120px;
  box-shadow: 3px 3px 3px #e0e0e0;
  background: #3F414D;
}

.ls-widget-box i {
  position: absolute;
  right: 15px;
  top: 0;
  font-size: 20px;
  line-height: 120px;
  opacity: 0.5;
  -webkit-transition: all 200ms linear;
  -moz-transition: all 200ms linear;
  -o-transition: all 200ms linear;
  -ms-transition: all 200ms linear;
  transition: all 200ms linear;
}

.ls-widget-box .chart-box-content {
  float: right;
  display: inline-block;
  padding-right: 60px;
}

.ls-widget-box .chart-box-content h1 {
  margin: 0;
  padding: 30px 0 0 0;
  font-size: 20px;
  -webkit-transition: all 400ms linear;
  -moz-transition: all 400ms linear;
  -o-transition: all 400ms linear;
  -ms-transition: all 400ms linear;
  transition: all 400ms linear;
}

.ls-widget-box .chart-box-content p {
  padding: 0px 0;
  font-size: 12px;
  -webkit-transition: all 400ms linear;
  -moz-transition: all 400ms linear;
  -o-transition: all 400ms linear;
  -ms-transition: all 400ms linear;
  transition: all 400ms linear;
}

.ls-widget-box .box-element {
  margin: 5px 0 0 10px;
  float: left;
  display: inline-block;
}

.ls-widget-box:hover i,
.ls-widget-box.active i {
  opacity: 1;
  font-size: 40px;
  -webkit-transition: all 200ms linear;
  -moz-transition: all 200ms linear;
  -o-transition: all 200ms linear;
  -ms-transition: all 200ms linear;
  transition: all 200ms linear;
}

.ls-widget-box:hover h1,
.ls-widget-box.active h1 {
  font-size: 12px;
  -webkit-transition: all 400ms linear;
  -moz-transition: all 400ms linear;
  -o-transition: all 400ms linear;
  -ms-transition: all 400ms linear;
  transition: all 400ms linear;
}

.ls-widget-box:hover p,
.ls-widget-box.active p {
  font-size: 25px;
  -webkit-transition: all 400ms linear;
  -moz-transition: all 400ms linear;
  -o-transition: all 400ms linear;
  -ms-transition: all 400ms linear;
  transition: all 400ms linear;
}

.ls-circle-widget {
  cursor: pointer;
  height: 180px;
  width: 180px;
  border-radius: 50%;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  overflow: hidden;
  margin: auto;
  text-align: center;
  -webkit-transition: all 400ms linear;
  -moz-transition: all 400ms linear;
  -o-transition: all 400ms linear;
  -ms-transition: all 400ms linear;
  transition: all 400ms linear;
}

.ls-circle-widget i {
  font-size: 65px;
  margin: auto;
  line-height: 180px;
  -webkit-transition: all 400ms linear;
  -moz-transition: all 400ms linear;
  -o-transition: all 400ms linear;
  -ms-transition: all 400ms linear;
  transition: all 400ms linear;
}

.ls-circle-widget h1 {
  font-size: 14px;
  margin: 0;
  padding: 0;
  opacity: 0;
  -webkit-transition: all 400ms linear;
  -moz-transition: all 400ms linear;
  -o-transition: all 400ms linear;
  -ms-transition: all 400ms linear;
  transition: all 400ms linear;
}

.ls-circle-widget:hover,
.ls-circle-widget.active {
  -webkit-transition: all 400ms linear;
  -moz-transition: all 400ms linear;
  -o-transition: all 400ms linear;
  -ms-transition: all 400ms linear;
  transition: all 400ms linear;
}

.ls-circle-widget.square-hover:hover,
.ls-circle-widget.square-hover.active {
  border-radius: 0;
  -moz-border-radius: 0;
  -webkit-border-radius: 0;
  -webkit-transition: all 400ms linear;
  -moz-transition: all 400ms linear;
  -o-transition: all 400ms linear;
  -ms-transition: all 400ms linear;
  transition: all 400ms linear;
}

.ls-circle-widget:hover i,
.ls-circle-widget.active i {
  font-size: 45px;
  line-height: 65px;
  padding-top: 50px;
  -webkit-transition: all 400ms linear;
  -moz-transition: all 400ms linear;
  -o-transition: all 400ms linear;
  -ms-transition: all 400ms linear;
  transition: all 400ms linear;
}

.ls-circle-widget:hover h1,
.ls-circle-widget.active h1 {
  opacity: 1;
  -webkit-transition: all 400ms linear;
  -moz-transition: all 400ms linear;
  -o-transition: all 400ms linear;
  -ms-transition: all 400ms linear;
  transition: all 400ms linear;
}

.setting-widget {
  border: 1px solid #E3DFD8;
}

.setting-widget-header {
  padding: 5px 10px;
}

.setting-widget-header i {
  float: left;
}



.setting-widget-box ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.setting-widget-box ul li {
  padding: 10px;
  border-top: 1px solid #e0e0e0;
  background: #f2f2f2;
}

.setting-widget-box ul li div.setting-switch {
  float: left;
}

.change-color-switch {
  text-align: center;
}

.change-color-switch ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.change-color-switch ul li {
  display: inline-block;
  height: 20px;
  width: 20px;
  margin: 0 5px 0 0;
  cursor: pointer;
  border-radius: 50%;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border: 1px solid #e0e0e0;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

.change-color-switch ul li.active {
  border: 1px solid #FFFFFF;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

.change-color-switch ul li.default {
  background: #49494B;
}

.change-color-switch ul li.red-color {
  background: #FF7878;
}

.change-color-switch ul li.blue-color {
  background: #5EBFD8;
}

.change-color-switch ul li.light-green-color {
  background: #1FB5AD;
}

.change-color-switch ul li.black-color {
  background: #3F414D;
}

.change-color-switch ul li.deep-blue-color {
  background: #3A515A;
}

/****/

.flotChartRealTime.widgetRealTime {
  height: 220px;
}

.memberBox {
  border: 1px solid #E0E0E0;
  padding: 0 10px;
}

.memberBox-header {
  padding: 10px 0;
}

.memberBox-details {
  margin: 0;
  padding: 5px 20px 15px;
  text-align: center;
}

.memberBox-details ul {
  margin: 0;
  padding: 0;
  list-style: none;
  width: 100%;
}

.memberBox-details ul li {
  display: inline-block;
  padding: 0 9%;
  text-align: center;
}

.widget-memberBox-details ul li {
  padding: 0 4%;
}

.memberBox-details ul li div.memberBox-title {
  text-align: center;
  font-size: 17px;
}

.memberBox-details ul li div.memberBox-title h4 {
  margin: 3px 0;
  font-size: 15px;
}

.memberBox-details ul li div.memberBox-value {
  text-align: center;
}

.memberBox-details ul li div.memberBox-value i {
  font-size: 15px;
}

.memberBox-details ul li div.memberBox-value.up {
  color: #1FB5AD;
}

.memberBox-details ul li div.memberBox-value.down {
  color: #269abc;
}

.sale-widget {
  margin-bottom: 20px;
}

.sale-widget ul li a {
  letter-spacing: 1px;
}

.sale-widget .tab-content {
  border-right: 1px #e0e0e0 solid;
  border-bottom: 1px #e0e0e0 solid;
  border-left: 1px #e0e0e0 solid;
  height: 300px;
}

.sale-widget .tab-content p {
  line-height: 14px;
}

.sale-widget label.switch-label {
  margin-top: 5px;
}

/*****/

/*Easy pie ui start */

.easy-pai-box {
  margin: auto;
  text-align: center;
}

.easyPie {
  position: relative;
  display: inline-block;
  width: 110px;
  height: 110px;
  margin-bottom: 15px;
  text-align: center;
  display: inline-block;
  line-height: 110px;
  z-index: 2;
}

.easyPieChart,
.easyPieChartBlue,
.easyPieChartGreen,
.easyPieChartBrown,
.easyPieChartLightGreen,
.easyPieChartBlack {
  position: relative;
  display: inline-block;
  width: 110px;
  height: 110px;
  margin-bottom: 15px;
  text-align: center;
  display: inline-block;
  line-height: 110px;
  z-index: 2;
}

.easyPie canvas {
  position: absolute;
  top: 0;
  right: 0;
}

.easyPieChart canvas,
.easyPieChartBlue canvas,
.easyPieChartGreen canvas,
.easyPieChartBrown canvas,
.easyPieChartLightGreen canvas,
.easyPieChartBlack canvas {
  position: absolute;
  top: 0;
  right: 0;
}

.easyPiePercent:after {
  content: '\0025';
  margin-right: 0.1em;
  font-size: .8em;
}

.easyPieChartBlue:before {
  content: '\0024';
  font-size: .8em;
}

.easyPieChartGreen:before {
  content: '\20AC';
  font-size: .8em;
}

.easyPieChartBrown:before {
  content: "\00a3";
  font-size: .8em;
}

.easyPieChartLightGreenPercent:after {
  content: '\0025';
  margin-right: 0.1em;
  font-size: .8em;
}

.easyPiePercentFacebook:after {
  content: '\0025';
  margin-right: 0.1em;
  font-size: .8em;
}

.easyPieChartBlackPercent:after {
  content: '\0025';
  margin-right: 0.1em;
  font-size: .8em;
}

/*****/

.icon-tab .tab-content {
  border-bottom: 1px solid #e0e0e0;
  border-right: 1px solid #e0e0e0;
  border-left: 1px solid #e0e0e0;
}

.hero-donut-widget {
  height: 200px;
}

.c3-chart-arc text {
  font-size: 12px;
}

.hero-donut-widget svg text,
.hero-donut-widget svg text tspan {
  font-family: 'PT Sans', sans-serif !important;
  font-size: 12px !important;
  font-weight: normal !important;
}

.hero-donut-box svg text,
.hero-donut-box svg text tspan {
  font-family: 'PT Sans', sans-serif !important;
  font-size: 12px !important;
  font-weight: normal !important;
}

.sale-widget #product {
  text-align: center;
  height: 300px;
}

.hero-bar-widget {
  height: 300px;
}

.monthlySale {
  height: 200px;
  text-align: center;
}

.progress.vertical {
  margin: 0 10px;
}

.monthlySale ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.monthlySale ul li {
  height: 200px;
  display: inline-block;
  text-align: center;
}

.monthlySale ul li div.progress {
  margin-bottom: 0;
}

.monthlySale ul li div.monthName {
  display: block;
  text-align: center;
}

.monthlySale ul li div.progress.vertical {
  float: none;
}

.monthlySale .progress.vertical {
  width: 50px;
}

.progress.vertical .progress-bar.six-sec-ease-in-out {
  -webkit-transition: height 6s ease-in-out;
  -moz-transition: height 6s ease-in-out;
  -ms-transition: height 6s ease-in-out;
  -o-transition: height 6s ease-in-out;
  transition: height 6s ease-in-out;
}

.progress-bar-danger {
  background: #FF7878;
}

.seriesToggleWidget {
  height: 260px;
  width: 80%;
  float: right;
}

.seriesToggleWidget div.legend table {
  margin-left: 10px;
}

.seriesToggleWidget div.legend table tbody tr td {
  height: 20px;
}

.seriesToggleWidget div.legend table tbody tr td.legendColorBox div {
  margin-left: 10px;
}

.seriesToggleWidget div.legend table tbody tr td.legendColorBox div >div {
  margin-left: 0px;
}

.seriesToggleWidget div.legend table tbody tr td.legendLabel {
  font-size: 13px;
}

#choicesWidget {
  width: 20%;
  list-style: none;
  float: right;
  margin: 5px 0 0 0;
  padding: 0;
}

#choicesWidget li {
  margin-bottom: 10px;
  margin-right: 10px;
}

.skyWeather {
  height: 250px;
  border-radius: 1px;
  -moz-border-radius: 1px;
  -webkit-border-radius: 1px;
}



.current-weather {
  width: 100%;
  height: 180px;
}

.current-weather-icon {
  width: 50%;
  margin: auto;
  float: right;
  text-align: center;
  padding-top: 40px;
}

.current-weather-icon canvas {
  margin: auto;
  width: 128px;
}

.current-weather-details {
  float: left;
  width: 50%;
  text-align: center;
  padding-top: 10%;
}

.current-weather-details h2 {
  font-size: 45px;
  margin-bottom: 0;
}

.current-weather-details p,
.current-weather-details span {
  font-size: 14px;
}

.feature-weather {
  border-top: 1px solid #82CDCA;
}

.feature-weather ul {
  list-style: none;
  margin: 0;
  padding: 0;
  text-align: center;
}

.feature-weather ul li {
  display: inline-block;
  text-align: center;
  border-left: 1px solid #82CDCA;
  width: 19%;
}

.feature-weather ul li:last-child {
  border: none;
}

.feature-weather ul li a {
  display: block;
  line-height: 14px;
  padding: 10px 0;
  text-align: center;
}

.feature-weather ul li a:hover {
  text-decoration: none;
  color: #f2f2f2;
}



.feature-weather ul li a span {
  color: #FFFFFF;
  display: list-item;
  text-transform: uppercase;
}

.social-share-box {
  height: 250px;
}

.social-share {
  height: 50%;
  display: inline-block;
  background: #e0e0e0;
  text-align: center;
  position: relative;
  cursor: pointer;
}

.social-share i {
  font-size: 50px;
  color: #FFFFFF;
  line-height: 125px;
}

.ls-fb-share {
  background: #3B5998;
}

.ls-tw-share {
  background: #55ACEE;
}

.ls-google-plus {
  background: #D44032;
}

.ls-dribble-plus {
  background: #C32361;
}

.share-overlay {
  display: block;
  position: absolute;
  z-index: 20;
  background: rgba(0, 0, 0, 0.8);
  overflow: hidden;
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;
}

a.close-overlay {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 100;
  width: 45px;
  height: 45px;
  font-size: 20px;
  font-weight: 700;
  color: #fff;
  line-height: 45px;
  text-align: center;
  background-color: #000;
  cursor: pointer;
}

a.close-overlay.hidden {
  display: none;
}

a.expand {
  color: #F2F2F2;
  display: block;
  font-size: 16px;
  font-weight: 400;
  line-height: 50px;
  position: absolute;
  text-align: center;
  z-index: 100;
  outline: 0;
  text-decoration: none;
}

a.expand:hover {
  outline: 0;
  text-decoration: none;
}

.share-overlay {
  bottom: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 0;
}

.share-overlay a.expand {
  bottom: 50%;
  font-size: 38px;
  right: 0;
  letter-spacing: 2px;
  margin: 0 auto -30px;
  left: 0;
  font-weight: bold;
}

.overlay-hover .share-overlay {
  height: 100%;
}

/*-----------------------------------------------------------------*/

/*------------------------------------------------------------------
   ------------------------- PANEL ------------------------------
-------------------------------------------------------------------*/

.form-control {
  background-color: rgba(0, 0, 0, 0);
  box-shadow: none;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
}

.panel .form-control {
  background-color: rgba(0, 0, 0, 0);
}

.no-margin {
  margin: 0;
}

.panel-control,
.panel-note-control,
.note-control {
  list-style: none;
  padding: 0;
  margin: 0;
  position: absolute;
  left: 25px;
  top: 10px;
}

.panel-control li,
.panel-note-control li,
.note-control li {
  display: inline-block;
  margin: 0 3px;
}

.panel-control li a,
.panel-note-control li a,
.note-control li a {
  font-size: 13px;
  color: #FFFFFF;
  outline: 0;
  opacity: 1;
  -webkit-transition: all 300ms linear;
  -moz-transition: all 300ms linear;
  -o-transition: all 300ms linear;
  -ms-transition: all 300ms linear;
  transition: all 300ms linear;
}

.panel-default .panel-control li a,
.panel-default .panel-note-control li a,
.panel-default .note-control li a {
  color: #565656;
}

.panel-control li a:hover,
.panel-note-control li a:hover,
.note-control li a:hover {
  color: #565656;
  -webkit-transition: all 300ms linear;
  -moz-transition: all 300ms linear;
  -o-transition: all 300ms linear;
  -ms-transition: all 300ms linear;
  transition: all 300ms linear;
}

.panel-default .panel-control li a:hover,
.panel-default .panel-note-control li a:hover,
.panel-default,
.note-control li a:hover {
  color: #565656;
}

.panel,
.panel-heading {
  border-radius: 0;
  -moz-border-radius: 0;
  -webkit-border-radius: 0;
}

.panel-default {
  border-color: #e3dfd8;
}

.panel-default > .panel-heading {
  background-color: #e0e0e0;
  border-color: #e0e0e0;
  color: #515151;
}

.panel-red {
  border-color: #ff7878;
}

.panel-red > .panel-heading {
  background-color: #ff7878;
  border-color: #ff7878;
  color: white;
}

.panel-light-green {
  border-color: #1fb5ad;
}

.panel-light-green > .panel-heading {
  background-color: #1fb5ad;
  border-color: #1fb5ad;
  color: white;
}

.panel-light-blue {
  border-color: #269abc;
}

.panel-light-blue > .panel-heading {
  border: #269abc;
  background: #269abc;
  color: white;
}

.panel-dark {
  border-color: #555557;
}

.panel-dark > .panel-heading {
  border: #555557;
  background: #555557;
  color: white;
}

.panel > .panel-body {
  background-color: #fafafa;
}

.ls-light-green-progress {
  background-color: #269abc;
}

.ls-light-blue-progress {
  background-color: #1fb5ad;
}

.ls-green-progress {
  background-color: #507d50;
}

.ls-yellow-progress {
  background-color: #aaa900;
}

.ls-red-progress {
  background-color: #ff7878;
}

.top-panel {
  margin-top: 20px;
}

/* Modal Start */

.modal-footer {
  padding: 10px 20px;
  margin-top: 0;
}

.modal-header {
  padding: 10px 15px;
}

.panel-less {
  box-shadow: none;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  border-radius: 0;
}

.panel-less.panel-default {
  border: none;
  background-color: transparent;
}

.panel-less > .panel-heading {
  background-color: transparent;
  border: 0;
  padding: 15px 0;
}

.panel-less > .panel-body {
  background-color: transparent;
}

h3.panel-title {
  font-size: 15px;
}

.modal-content {
  border-radius: 1px;
}

.grid-panel-body {
  text-align: center;
  line-height: 50px;
}

/*-----------------------------------------------------------------*/

/*------------------------------------------------------------------
   -------------------------ICONS---------------------------------
-------------------------------------------------------------------*/



.icon-list-padding {
  padding: 0 15px;
}

.icon-view-tab.tab-content {
  border-bottom: 1px solid #e3dfd8;
  border-right: 1px solid #e3dfd8;
  border-left: 1px solid #e3dfd8;
}

div.fontawesome-icon-list div {
  background-color: #F9F9F9;
  border: 1px solid #FFFFFF;
  float: right;
  font-size: 14px;
  height: 100px;
  line-height: 1.4;
  padding: 10px;
  text-align: center;
  cursor: pointer;
}

div.fontawesome-icon-list div i.fa {
  color: #626161;
  font-size: 30px;
  margin-bottom: 10px;
  margin-top: 5px;
  -webkit-transition: all 600ms linear;
  -moz-transition: all 600ms linear;
  -o-transition: all 600ms linear;
  -ms-transition: all 600ms linear;
  transition: all 600ms linear;
}

div.fontawesome-icon-list div a {
  color: #235b67;
  display: block;
  text-align: center;
  word-wrap: break-word;
}

div.fontawesome-icon-list div:hover i {
  color: #1fb5ad;
  font-size: 35px;
}

.animation-icon-box {
  text-align: center;
  color: #626161;
}

ul.icon-list.middle {
  padding-bottom: 20px;
  padding-top: 20px;
}

ul.icon-list {
  list-style: none;
  margin: 0;
  padding: 0;
  margin-bottom: 2px;
  cursor: pointer;
}

ul.icon-list li {
  display: inline-block;
  padding: 0 5px;
}

.animation-icon {
  text-align: center;
  -webkit-transition: all 600ms linear;
  -moz-transition: all 600ms linear;
  -o-transition: all 600ms linear;
  -ms-transition: all 600ms linear;
  transition: all 600ms linear;
}

.animation-icon:hover {
  color: #1fb5ad;
  opacity: 1;
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(360deg);
}

.ls-glyphicons-list {
  list-style: none outside none;
  padding: 0;
  margin: 0;
}

.ls-glyphicons li {
  background-color: #F9F9F9;
  border: 1px solid #FFFFFF;
  cursor: pointer;
  float: right;
  font-size: 12px;
  height: 100px;
  line-height: 1.4;
  padding: 10px;
  text-align: center;
  width: 20%;
}

.ls-glyphicons .glyphicon {
  color: #626161;
  font-size: 25px;
  margin-bottom: 10px;
  margin-top: 5px;
  -webkit-transition: all 600ms linear;
  -moz-transition: all 600ms linear;
  -o-transition: all 600ms linear;
  -ms-transition: all 600ms linear;
  transition: all 600ms linear;
}

.ls-glyphicons .glyphicon-class {
  display: block;
  text-align: center;
  word-wrap: break-word;
}

.ls-glyphicons li:hover span.glyphicon {
  color: #1fb5ad;
  font-size: 35px;
}

.popupIcon {
  text-align: center;
}

.popupIcon i {
  font-size: 50px;
  color: #1fb5ad;
}

.popupIcon pre {
  margin-top: 20px;
}

.customizationIcon h5 {
  margin-bottom: 20px;
}

.customizationIcon ul {
  margin-bottom: 50px;
}

/****/

p.bg-label {
  background-color: #1FB5AD;
  padding: 15px;
}

.red,
i.red {
  color: #ff7878;
}

.blue,
i.blue {
  color: #6b97f4;
}

.green,
i.green {
  color: #507d50;
}

.brown,
i.brown {
  color: #763d3d;
}

.white,
i.white {
  color: white;
}

.lightGreen,
i.lightGreen {
  color: #1fb5ad;
}

.light-blue,
i.light-blue {
  color: #269abc;
}

.yellow,
i.yellow {
  color: #aaa900;
}

.phast,
i.phast {
  color: #70cac8;
}

/*****  Color css end ****/

.spinIn {
  -webkit-animation: spinIn 0.6s 1 linear;
  animation: spinIn 0.6s 1 linear;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
}

@-webkit-keyframes spinIn {
  0% {
    -webkit-transform: rotate(0deg);
  }

  100% {
    -webkit-transform: rotate(180deg);
  }
}

@keyframes spinIn {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(180deg);
  }
}

.spinOut {
  -webkit-animation: spinOut 0.6s 1 linear;
  animation: spinOut 0.6s 1 linear;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
}

@-webkit-keyframes spinOut {
  0% {
    -webkit-transform: rotate(180deg);
  }

  100% {
    -webkit-transform: rotate(360deg);
  }
}

@keyframes spinOut {
  0% {
    transform: rotate(180deg);
  }

  100% {
    transform: rotate(360deg);
  }
}

/*-----------------------------------------------------------------*/

/*------------------------------------------------------------------
   -------------------------FOOTER------------------------------
-------------------------------------------------------------------*/

/*Footer css start */

#footer {
  background: #ffffff;
  padding: 10px;
  border-top: 1px #CBC5BA dotted;
}

#footer.right {
  text-align: left;
  padding-left: 50px;
}

#footer a {
  color: #565656;
}

#footer a:hover {
  text-decoration: none;
}

/*-----------------------------------------------------------------*/

/*------------------------------------------------------------------
   ------------------------ BLOCKQUOTE --------------------------
-------------------------------------------------------------------*/

blockquote.styles {
  font-family: Georgia, serif;
  font-size: 18px;
  font-style: italic;
  width: 80%;
  margin: auto;
  padding: 50px;
  line-height: 1.45;
  position: relative;
  color: #383838;
  background: #ececec;
}

blockquote.styles:before {
  color: #7a7a7a;
  content: "“";
  display: block;
  font-size: 80px;
  right: 10px;
  position: absolute;
  top: 10px;
}

blockquote.styles cite {
  color: #999999;
  font-size: 14px;
  display: block;
  margin-top: 5px;
}

blockquote.styles cite:before {
  content: "\2014 \2009";
}

blockquote.styles footer {
  text-align: left;
}

div.demo-blockquote {
  margin-top: 10%;
}

/*-----------------------------------------------------------------*/

/*------------------------------------------------------------------
   -------------------------SLIDER---------------------------------
-------------------------------------------------------------------*/

/**** Slider ***/

.owl-theme .owl-controls .owl-buttons div.owl-prev {
  position: absolute;
  top: 40%;
  right: 30px;
  background: url('../../images/arrows.png') no-repeat;
  background-position: 0 0;
  overflow: hidden;
  font-size: 0;
  padding-top: 16px;
}

.owl-theme .owl-controls .owl-buttons div.owl-next {
  position: absolute;
  top: 40%;
  left: 30px;
  background: url('../../images/arrows.png') no-repeat;
  background-position: -20px 0;
  overflow: hidden;
  font-size: 0;
  padding-top: 16px;
}

.owl-theme .owl-controls .owl-page span {
  background: #ff7878;
}

.owl-caption {
  position: absolute;
  bottom: 0;
  background-color: #fff;
  width: 100%;
  opacity: 0.5;
  padding: 10px 10px;
}

.owl-caption h3 {
  font-size: 16px;
  padding: 0;
  margin: 0;
}

#owl-demo .item img {
  display: block;
  width: 100%;
  height: auto;
}

#bar {
  width: 0%;
  max-width: 100%;
  height: 4px;
  background: #ff7878;
}

#progressBar {
  width: 100%;
  background: #EDEDED;
}

/**********************************/

/*SLIDER*/

#slideShow {
  width: 100%;
}

#slideShow img {
  width: 100%;
  height: auto;
}

.ls-slider-content {
  padding: 10px;
  margin: 15px;
  background-color: #5ebfd8;
  color: #fff;
  text-align: center;
}

.s2 .ls-slider-content {
  background: #58595b;
  text-align: center;
  font-weight: 300;
  font-size: 16px;
}

.s3 .ls-slider-content {
  background-color: #7a8b83;
  color: #ccc;
}

.ls-slider-title {
  background-color: #ff7878;
  margin: 15px 15px 0;
  height: 60px;
  text-align: center;
}

.ls-slider-title h2,
.ls-slider-title h3 {
  color: #fff;
  font-size: 20px;
  line-height: 3;
}

.ls-slider-right-view {
  margin-right: 67.3333% !important;
}

@media only screen and (min-width: 600px) {
  #slideShow {
    height: 350px;
  }

  #slideShow img {
    height: 350px;
  }
}

@media only screen and (min-width: 1px) and (max-width: 600px) {
  #slideShow {
    height: 150px;
  }

  #slideShow img {
    height: 150px;
  }

  .ls-slider-content {
    padding: 5px;
    margin: 10px;
    font-size: 10px;
  }

  .s2 .ls-slider-content {
    font-size: 10px;
  }

  .s3 .ls-slider-content,
  .s1 .ls-slider-content {
    width: 150%;
    height: 20px;
    font-size: 10px;
  }

  #slideShow .title {
    display: none;
  }
}

ul.slideControl {
  list-style: none;
  text-align: center;
  margin: 5px auto;
  overflow: hidden;
  border-top: none;
  opacity: .5;
}

ul.slideControl li {
  display: inline-block;
  padding: 5px;
  background: #ccc;
  margin: 5px;
  cursor: pointer;
}

ul.slideControl li:hover,
ul.slideControl li.current {
  background: #555;
}

div.opt {
  margin: 10px;
  background: #eee;
  padding: 5px;
}

span.option {
  font-weight: 700;
}

span.description {
  margin-right: 10px;
}

.ls-slider-2 {
  margin-top: 30px;
}

/*-----------------------------------------------------------------*/

/*------------------------------------------------------------------
  -------------------------- UI ELEMENTS ------------------------
-------------------------------------------------------------------*/

/******* Button & Switch *******/

.button-alignment button.btn {
  margin-bottom: 10px;
}

.ls-blue-btn {
  background-color: #6b97f4;
  color: white;
  text-align: center;
  -webkit-transition: all 200ms linear;
  -moz-transition: all 200ms linear;
  -o-transition: all 200ms linear;
  -ms-transition: all 200ms linear;
  transition: all 200ms linear;
}

.ls-blue-btn:hover,
.ls-blue-btn:active,
.ls-blue-btn:focus {
  background-color: #269abc;
  color: white;
  -webkit-transition: all 400ms linear;
  -moz-transition: all 400ms linear;
  -o-transition: all 400ms linear;
  -ms-transition: all 400ms linear;
  transition: all 400ms linear;
}

.ls-light-blue-btn {
  background-color: #269abc;
  color: white;
  text-align: center;
  -webkit-transition: all 400ms linear;
  -moz-transition: all 400ms linear;
  -o-transition: all 400ms linear;
  -ms-transition: all 400ms linear;
  transition: all 400ms linear;
}

.ls-light-blue-btn:hover,
.ls-light-blue-btn:active,
.ls-light-blue-btn:focus {
  background-color: #6b97f4;
  color: white;
  -webkit-transition: all 400ms linear;
  -moz-transition: all 400ms linear;
  -o-transition: all 400ms linear;
  -ms-transition: all 400ms linear;
  transition: all 400ms linear;
}

.ls-green-btn {
  background-color: #507d50;
  color: white;
  text-align: center;
  -webkit-transition: all 400ms linear;
  -moz-transition: all 400ms linear;
  -o-transition: all 400ms linear;
  -ms-transition: all 400ms linear;
  transition: all 400ms linear;
}

.ls-green-btn:hover,
.ls-green-btn:active,
.ls-green-btn:focus {
  background-color: #47A447;
  color: white;
  -webkit-transition: all 400ms linear;
  -moz-transition: all 400ms linear;
  -o-transition: all 400ms linear;
  -ms-transition: all 400ms linear;
  transition: all 400ms linear;
}

.ls-light-green-btn {
  background-color: #1fb5ad;
  color: white;
  text-align: center;
  -webkit-transition: all 400ms linear;
  -moz-transition: all 400ms linear;
  -o-transition: all 400ms linear;
  -ms-transition: all 400ms linear;
  transition: all 400ms linear;
}

.ls-light-green-btn:hover,
.ls-light-green-btn:active,
.ls-light-green-btn:focus {
  background-color: #1FD9D0;
  color: white;
  -webkit-transition: all 400ms linear;
  -moz-transition: all 400ms linear;
  -o-transition: all 400ms linear;
  -ms-transition: all 400ms linear;
  transition: all 400ms linear;
}

.ls-red-btn {
  background-color: #ff7878;
  color: white;
  text-align: center;
  -webkit-transition: all 400ms linear;
  -moz-transition: all 400ms linear;
  -o-transition: all 400ms linear;
  -ms-transition: all 400ms linear;
  transition: all 400ms linear;
}

.ls-red-btn:hover,
.ls-red-btn:active,
.ls-red-btn:focus {
  background-color: #D2322D;
  color: white;
  -webkit-transition: all 400ms linear;
  -moz-transition: all 400ms linear;
  -o-transition: all 400ms linear;
  -ms-transition: all 400ms linear;
  transition: all 400ms linear;
}

.ls-dark-btn {
  background-color: #565656;
  color: #999999;
  text-align: center;
  -webkit-transition: all 400ms linear;
  -moz-transition: all 400ms linear;
  -o-transition: all 400ms linear;
  -ms-transition: all 400ms linear;
  transition: all 400ms linear;
}

.ls-dark-btn:hover,
.ls-dark-btn:active,
.ls-dark-btn:focus {
  background-color: #626262;
  color: white;
  -webkit-transition: all 400ms linear;
  -moz-transition: all 400ms linear;
  -o-transition: all 400ms linear;
  -ms-transition: all 400ms linear;
  transition: all 400ms linear;
}

.ls-yellow-btn {
  background-color: #aaa900;
  color: white;
  text-align: center;
  -webkit-transition: all 200ms linear;
  -moz-transition: all 200ms linear;
  -o-transition: all 200ms linear;
  -ms-transition: all 200ms linear;
  transition: all 200ms linear;
}

.ls-yellow-btn:hover,
.ls-yellow-btn:active,
.ls-yellow-btn:focus {
  background-color: #C6C524;
  color: white;
  -webkit-transition: all 200ms linear;
  -moz-transition: all 200ms linear;
  -o-transition: all 200ms linear;
  -ms-transition: all 200ms linear;
  transition: all 200ms linear;
}

.ls-brown-btn {
  background-color: #763d3d;
  color: white;
  text-align: center;
  -webkit-transition: all 200ms linear;
  -moz-transition: all 200ms linear;
  -o-transition: all 200ms linear;
  -ms-transition: all 200ms linear;
  transition: all 200ms linear;
}

.ls-brown-btn:hover,
.ls-brown-btn:active,
.ls-brown-btn:focus {
  background-color: #AE6A6A;
  color: white;
  -webkit-transition: all 200ms linear;
  -moz-transition: all 200ms linear;
  -o-transition: all 200ms linear;
  -ms-transition: all 200ms linear;
  transition: all 200ms linear;
}

.ls-button-group button {
  margin-left: 10px;
}

.ls-button-group .btn-group {
  margin-left: 10px;
}

.ls-button-group .btn-group button {
  margin: 0;
}

.btn.fa {
  line-height: 1.42857;
}

.btn-ls {
  background-color: #269abc;
  border-color: #269abc;
  color: white;
  border-radius: 1px;
  -webkit-transition: all 100ms linear;
  -moz-transition: all 100ms linear;
  -o-transition: all 100ms linear;
  -ms-transition: all 100ms linear;
  transition: all 100ms linear;
}

.btn-ls:focus,
.btn-ls:hover {
  color: #269abc;
  background-color: white;
}

button.fileinput-remove-button {
  background-color: #ff7878;
  border-color: #ff7878;
  color: white;
  border-radius: 1px;
  -webkit-transition: all 100ms linear;
  -moz-transition: all 100ms linear;
  -o-transition: all 100ms linear;
  -ms-transition: all 100ms linear;
  transition: all 100ms linear;
}

.fileinput-remove-button:hover,
.fileinput-remove-button:focus {
  background-color: white;
  color: #ff7878;
}

.ls-hexagon-lightBlue {
  width: 44px;
  height: 25px;
  background: #269abc;
  position: relative;
  text-align: center;
}

.ls-hexagon-lightBlue:after {
  content: "";
  position: absolute;
  bottom: -12.5px;
  right: 0;
  width: 0;
  height: 0;
  border-right: solid transparent 22px;
  border-left: solid transparent 22px;
  border-top: solid #269abc 12.5px;
}

.ls-hexagon-lightBlue:before {
  content: "";
  position: absolute;
  top: -12.5px;
  right: 0;
  width: 0;
  height: 0;
  border-right: solid transparent 22px;
  border-left: solid transparent 22px;
  border-bottom: solid #269abc 12.5px;
}

.ls-hexagon-lightBlue:hover {
  background-color: #ff7878;
}

.ls-hexagon-lightBlue .fa {
  line-height: 25px;
  font-size: 25px;
  color: white;
}

.ls-hexagon-red {
  width: 34px;
  height: 20px;
  background: #ff7878;
  position: relative;
  text-align: center;
}

.ls-hexagon-red:after {
  content: "";
  position: absolute;
  bottom: -10px;
  right: 0;
  width: 0;
  height: 0;
  border-right: solid transparent 17px;
  border-left: solid transparent 17px;
  border-top: solid #ff7878 10px;
}

.ls-hexagon-red:before {
  content: "";
  position: absolute;
  top: -10px;
  right: 0;
  width: 0;
  height: 0;
  border-right: solid transparent 17px;
  border-left: solid transparent 17px;
  border-bottom: solid #ff7878 10px;
}

.ls-hexagon-red:hover {
  background-color: #ff7878;
}

.ls-hexagon-red .fa {
  line-height: 20px;
  font-size: 20px;
  color: white;
}

.hex {
  width: 50px;
  height: 50px;
  position: relative;
  overflow: hidden;
  float: right;
  margin-left: -1px;
  -webkit-backface-visibility: hidden;
  /* Smooth out them edges ;) */
  -webkit-transform: rotate(-30deg) skewX(30deg) scaleY(0.866);
  -moz-transform: rotate(-30deg) skewX(30deg) scaleY(0.866);
  -ms-transform: rotate(-30deg) skewX(30deg) scaleY(0.866);
  -o-transform: rotate(-30deg) skewX(30deg) scaleY(0.866);
  transform: rotate(-30deg) skewX(30deg) scaleY(0.866);
}

.hex a {
  font-size: 18px;
  line-height: 50px;
  text-align: center;
  color: #FFF;
  background-color: #e1e1e1;
  position: absolute;
  left: 6.7%;
  right: 6.7%;
  -webkit-transform: scaleY(1.155) skewX(-30deg) rotate(30deg);
  -moz-transform: scaleY(1.155) skewX(-30deg) rotate(30deg);
  -ms-transform: scaleY(1.155) skewX(-30deg) rotate(30deg);
  -o-transform: scaleY(1.155) skewX(-30deg) rotate(30deg);
  transform: scaleY(1.155) skewX(-30deg) rotate(30deg);
  outline: 0;
}

.hex a:hover .overlay {
  top: 0;
  outline: 0;
}

.hex a:focus {
  outline: 0;
}

.hex a i {
  width: 100%;
  z-index: 10;
  text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.004);
}

.overlay {
  width: 100%;
  height: 100%;
  position: absolute;
  top: -100%;
  right: 0;
  z-index: -1;
  -webkit-transition: top 0.3s ease-in-out;
  -moz-transition: top 0.3s ease-in-out;
  -o-transition: top 0.3s ease-in-out;
  transition: top 0.3s ease-in-out;
}

.facebook .overlay {
  background-color: #269abc;
}

.twitter .overlay {
  background-color: #269abc;
}

.gplus .overlay {
  background-color: #ff7878;
}

.rss .overlay {
  background-color: #aaa900;
}

.email .overlay {
  background-color: #507d50;
}

.linkedin .overlay {
  background-color: #763d3d;
}

.youtube .overlay {
  background-color: #ff7878;
}

.skype .overlay {
  background-color: #269abc;
}

.instagram .overlay {
  background-color: #457299;
}

.pinterest .overlay {
  background-color: #ff7878;
}

.bootstrap-switch.bootstrap-switch-focused {
  border-color: #AEAEAE;
  box-shadow: 0 2px 2px #F2F2F2 inset, 0 0 2px #98B6CF;
  -moz-box-shadow: 0 2px 2px #F2F2F2 inset, 0 0 2px #98B6CF;
  -mwebkit-box-shadow: 0 2px 2px #F2F2F2 inset, 0 0 2px #98B6CF;
}

.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-primary,
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-primary {
  background: #269ABC;
}

.btn.btn-round {
  border-radius: 18px;
  -moz-border-radius: 18px;
  -webkit-border-radius: 18px;
}

.label {
  border-radius: 1px;
  -moz-border-radius: 1px;
  -webkit-border-radius: 1px;
  font-weight: 400;
}

.label-Blue,
.label-blue {
  background-color: #6b97f4;
}

.label-dark {
  background-color: #58595B;
}

.label-lightBlue {
  background-color: #269abc;
}

.label-yellow {
  background-color: #aaa900;
}

.label-green {
  background-color: #507d50;
}

.label-brown {
  background-color: #763d3d;
}

.label-red {
  background-color: #ff7878;
}

.label-black {
  background-color: #3f414d;
}

.label-light-green {
  background-color: #1fb5ad;
}

.badge-Blue {
  background-color: #6b97f4;
}

.badge-lightBlue {
  background-color: #269abc;
}

.badge-yellow {
  background-color: #aaa900;
}

.badge-green {
  background-color: #507d50;
}

.badge-brown {
  background-color: #763d3d;
}

.badge-red {
  background-color: #ff7878;
}

.red-color .badge-red {
  background-color: #C45C5C;
}

.user-status {
  background: none repeat scroll 0 0 padding-box #575D67;
  border-radius: 8px;
  display: inline-block;
  height: 8px;
  margin-left: 5px;
  transition: all 300ms ease-in-out 0s;
  width: 8px;
}

.is-online {
  background-color: #2ecc71;
}

.is-busy {
  background-color: #ff7878;
}

.is-idle {
  background-color: #F7D227;
}

.is-offline {
  background-color: #A0A0A0;
}

/****/

.ls-pagination {
  border-radius: 0;
  -moz-border-radius: 0;
  -webkit-border-radius: 0;
}

.ls-pagination > li:first-child > a,
.ls-pagination > li:first-child > span,
.ls-pagination > li:last-child > a,
.ls-pagination > li:last-child > span {
  border-radius: 0;
  -moz-border-radius: 0;
  -webkit-border-radius: 0;
}

.ls-pagination > li a {
  background-color: #e1e1e1;
  color: dimgrey;
}

p.preview-advance {
  padding: 10px 0;
}

p.preview-advance a {
  font-size: 12px;
  color: dimgrey;
}

p.preview-advance a:hover {
  color: #269abc;
  text-decoration: underline;
}

.radio input[type="radio"],
.radio-inline input[type="radio"],
.checkbox input[type="checkbox"],
.checkbox-inline input[type="checkbox"] {
  margin-top: 5px;
}

.input-group-addon input[type="radio"],
.input-group-addon input[type="checkbox"] {
  margin-top: 5px;
}

.file-preview {
  border-radius: 1px;
  -moz-border-radius: 1px;
  -webkit-border-radius: 1px;
}

.summerNoteToolBox {
  margin: 10px 0;
}

.v-progressbar {
  height: 175px;
  margin: 0 auto;
}

.v-progressbar .progress.vertical {
  width: 50px;
}

.v-progressbar .progress.vertical .progress-bar.six-sec-ease-in-out {
  -webkit-transition: height 6s ease-in-out;
  -moz-transition: height 6s ease-in-out;
  -ms-transition: height 6s ease-in-out;
  -o-transition: height 6s ease-in-out;
  transition: height 6s ease-in-out;
}

.progress {
  border-radius: 1px;
  -moz-border-radius: 1px;
  -webkit-border-radius: 1px;
  height: 5px;
}

.progress .progress-bar.six-sec-ease-in-out {
  -webkit-transition: width 6s ease-in-out;
  -moz-transition: width 6s ease-in-out;
  -ms-transition: width 6s ease-in-out;
  -o-transition: width 6s ease-in-out;
  transition: width 6s ease-in-out;
}

.ls-light-blue-progress {
  background-color: #269abc;
}

.ls-green-progress {
  background-color: #507d50;
}

.ls-yellow-progress {
  background-color: #aaa900;
}

.ls-red-progress {
  background-color: #ff7878;
}

.ls-header-button {
  font-size: 14px;
}

/*******/

.selectize-input {
  border-radius: 1px;
  -moz-border-radius: 1px;
  -webkit-border-radius: 1px;
}

.selectize-input.focus {
  box-shadow: 0 2px 2px #F2F2F2 inset, 0 0 2px #98B6CF;
  border-color: #AEAEAE;
  outline: none;
}

.selectize-input.dropdown-active {
  border-radius: 1px;
  -moz-border-radius: 1px;
  -webkit-border-radius: 1px;
}

.selectize-control.multi .selectize-input > div {
  border-radius: 1px;
  -moz-border-radius: 1px;
  -webkit-border-radius: 1px;
  font-size: 14px;
  padding: 2px 10px;
}

.selectize-control.multi .selectize-input > div.active {
  background: #1fb5ad;
}

.selectize-dropdown-content span.label {
  font-size: 13px;
  font-size: 700;
  color: #565656;
}

.selectize-dropdown-content span.caption {
  font-size: 12px;
  font-size: 700;
  color: #565656;
}

.selectize-dropdown,
.selectize-dropdown.form-control {
  border-radius: 1px;
  -moz-border-radius: 1px;
  -webkit-border-radius: 1px;
}

.minicolors-theme-bootstrap .minicolors-swatch {
  border-radius: 1px;
  -moz-border-radius: 1px;
  -webkit-border-radius: 1px;
}

.xdsoft_datetimepicker {
  border-color: #CCCCCC;
}

.xdsoft_datetimepicker .xdsoft_label {
  font-weight: normal;
  color: #565656;
}

.xdsoft_datetimepicker .xdsoft_calendar th {
  font-weight: 400;
}

.xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_default,
.xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_current,
.xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box > div > div.xdsoft_current {
  background: #1FB5AD;
}

.xdsoft_datetimepicker .xdsoft_calendar td:hover,
.xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box > div > div:hover {
  background: #FF7878 !important;
}

.irs-from,
.irs-to,
.irs-single {
  background: #FF7878;
}

.irs-from:after,
.irs-to:after,
.irs-single:after {
  border-color: #FF7878 rgba(0, 0, 0, 0) rgba(0, 0, 0, 0);
}

.tooltipButton {
  list-style: none;
  margin: 0;
  padding: 0;
}

.tooltipButton li {
  margin-bottom: 15px;
  display: inline-block;
}

.toolButton {
  list-style: none;
  margin: 0;
  padding: 0;
}

.toolButton li {
  margin-left: 10px;
  display: inline-block;
  text-align: center;
}

.ls-settings-button:hover,
.ls-settings-button.pressed {
  background-color: rgba(0, 0, 0, 0);
  cursor: pointer;
  opacity: 1;
  z-index: 2;
  text-decoration: none;
}

.ls-settings-button {
  background-color: #E1E1E1;
  border: 1px solid #CCCCCC;
  border-radius: 1px;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.26) inset, 0 1px 0 0 rgba(255, 255, 255, 0.15);
  display: block;
  height: 28px;
  margin: 0;
  opacity: 0.9;
  width: 30px;
  z-index: 2;
}

.ls-settings-button i {
  display: block;
  margin: 0 auto;
  line-height: 28px;
  color: dimgrey;
}

.tool-container {
  background-color: #E1E1E1;
  box-shadow: 0 0 3px #898989;
  background-image: none;
}

.tool-item.selected,
.tool-item:hover {
  background-color: #CCCCCC;
  box-shadow: 0 0 3px #898989;
  background-image: none;
}

.tool-items a {
  color: #696969;
  line-height: 33px;
}

.tool-top .tool-item,
.tool-bottom .tool-item {
  border: none;
}

.tool-left .tool-item,
.tool-right .tool-item {
  border: none;
}

.remodal,
.remodal * {
  font-family: 'PT Sans', sans-serif;
}

.remodal h1,
.remodal h2,
.remodal h3,
.remodal h4,
.remodal h5 {
  font-family: 'Armata', sans-serif;
}

.tab-pane {
  padding: 10px;
}

.nav-tabs > li > a {
  border-radius: 1px 1px 0 0;
  -moz-border-radius: 1px 1px 0 0;
  -webkit-border-radius: 1px 1px 0 0;
  color: #555;
  font-size: 15px;
}

.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus {
  outline: 0;
  color: #269abc;
}

.nav-tabs.nav-justified > .active > a,
.nav-tabs.nav-justified > .active > a:hover,
.nav-tabs.nav-justified > .active > a:focus {
  border-right: 1px solid #E0E0E0;
  border-left: 1px solid #E0E0E0;
  border-top: 1px solid #E0E0E0;
}

.nav-tabs.nav-justified > li > a {
  border-radius: 1px 1px 0 0;
  -moz-border-radius: 1px 1px 0 0;
  -webkit-border-radius: 1px 1px 0 0;
}

#qrcodeTable table {
  margin: 30px auto;
}

#qrcodeCanvas > canvas {
  margin: 30px auto;
  display: block;
}

/*** Knobs ***/

.knoob-box {
  text-align: center;
  width: 49%;
  display: inline-block;
}

.knoob-box h4 {
  padding: 0;
  margin: 0;
}

.knoob-box-3 {
  width: 100%;
  display: inline-block;
  text-align: center;
  margin: auto;
}
.dial{
    padding: 0;
    margin: 0;
    width: 100% !important;
    left: 0;
    right: 0;
}

.knoob-box-4 {
  text-align: center;
  width: 100%;
  display: inline-block;
  margin: 20px 0;
}

.knoob-box-4 h4 {
  padding: 0;
  margin: 0;
}

/****/

.radio-inline {
  padding-right: 10px;
}

.radio-inline label {
  padding-left: 10px;
}

.icheck-radio-inline {
  padding-right: 20px;
}

.input-group-addon {
  border-radius: 1px;
  -moz-border-radius: 1px;
  -webkit-border-radius: 1px;
}

/***/

.ui-widget-header {
  background-image: none;
  background-color: #e0e0e0;
}

.selectize-control.multi .selectize-input > div {
  background: #E0E0E0;
  color: #777;
}

/****/

#main-content {
  background: #f9f9f9;
  padding-top: 15px;
  height: 100%;
  min-height: 400px;
}

#change-color {
  position: fixed;
  bottom: 0;
  height: 30px;
  width: 200px;
  left: -200px;
  background: #555557;
  z-index: 990;
}

#change-color-control {
  background: #FF7878;
  bottom: 0;
  right: -30px;
  position: absolute;
  text-align: center;
}

#change-color-control a {
  color: #FFFFFF;
  display: inline-block;
  font-size: 18px;
  line-height: 22px;
  padding: 4px 10px;
}

#change-color-control a:hover,
#change-color-control a:focus {
  outline: 0;
}

#change-color .change-color-box {
  text-align: center;
}

#change-color .change-color-box ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

#change-color .change-color-box ul li {
  display: inline-block;
  height: 20px;
  width: 20px;
  margin: 5px 5px 0 0;
  cursor: pointer;
  border-radius: 50%;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border: 1px solid #555557;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

#change-color .change-color-box ul li.active {
  border: 1px solid #FFFFFF;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

#change-color .change-color-box ul li.default {
  background: #49494B;
}

#change-color .change-color-box ul li.red-color {
  background: #FF7878;
}

#change-color .change-color-box ul li.blue-color {
  background: #5EBFD8;
}

#change-color .change-color-box ul li.light-green-color {
  background: #1FB5AD;
}

#change-color .change-color-box ul li.black-color {
  background: #3F414D;
}

#change-color .change-color-box ul li.deep-blue-color {
  background: #3A515A;
}

/****/

.btn {
  border-radius: 1px;
  -moz-border-radius: 1px;
  -webkit-border-radius: 1px;
}

.popover {
  border-radius: 1px;
  -moz-border-radius: 1px;
  -webkit-border-radius: 1px;
  background-color: #fafafa;
}

.btn-default {
  background-color: #e1e1e1;
  color: #565656;
}

.border-bottom {
  border-bottom: #cbc5ba dashed 1px;
  padding-bottom: 15px;
  margin-bottom: 15px;
}

.no-border-bottom {
  padding-bottom: 15px;
}

.page-min-height {
  min-height: 750px;
}

.no-padding {
  padding: 0;
}

hr.hr-20 {
  margin: 20px 0;
}

hr.footer-border {
  margin: 0;
  border: none;
}

.progress {
  border-radius: 1px;
  height: 5px;
}

.tab-content {
  background: #ffffff;
}

.tab-border.tab-content {
  border-bottom: 1px solid #e3dfd8;
  border-right: 1px solid #e3dfd8;
  border-left: 1px solid #e3dfd8;
}

/*-----------------------------------------------------------------*/

/*-----------------------------------------------------------------

             *********** UPDATE VERSION 1.1 ************

-----------------------------------------------------------------*/

/*------------------------------------------------------------------
  -------------------------- MEDIA PLAYER ------------------------
-------------------------------------------------------------------*/

.ls-audio-player-wrap,
.ls-video-player-wrap {
  position: relative;
}

.ls-audio-player-wrap .jp-audio,
.ls-video-player-wrap .jp-video {
  width: 100%;
  background-color: transparent;
  border: none;
}

.ls-video-player-wrap div.jp-video-360p,
.ls-video-player-wrap div.jp-video-full {
  width: 100%;
  height: 100%;
  background-color: transparent;
  border: none;
}

.ls-video-player-wrap .jp-jplayer {
  border: 1px solid #E2E2EA;
  background: transparent;
  margin-bottom: -7px;
}

.ls-audio-player {
  position: relative;
  height: 70px;
  background: #58595b;
}

.ls-audio-play {
  height: 40px;
  width: 40px;
  line-height: 38px;
  text-align: center;
  border-radius: 50%;
  margin: auto;
  background: #58595b;
  color: #000;
  position: absolute;
  top: 15px;
  right: 10px;
  box-shadow: 0 0 10px #000000 inset;
}

.ls-audio-play:hover {
  cursor: pointer;
  color: #1FB5AD;
}

.ls-audio-play a.jp-pause .fa,
.ls-audio-suffle a.jp-shuffle-off .fa,
.ls-audio-repeat a.jp-repeat-off .fa {
  color: #1FB5AD;
}

.ls-audio-left {
  position: absolute;
  right: 140px;
}

.ls-audio-right {
  position: absolute;
  right: 60px;
}

.ls-audio-stop {
  position: absolute;
  right: 100px;
}

.ls-audio-suffle {
  position: absolute;
  left: 10px;
  top: 20px;
}

.ls-audio-repeat {
  position: absolute;
  left: 38px;
  top: 20px;
}

.ls-audio-list {
  position: absolute;
  left: 65px;
  top: 20px;
}

.ls-video-screen {
  position: absolute;
  left: 90px;
  top: 20px;
}

.ls-audio-left,
.ls-audio-right,
.ls-audio-stop {
  top: 20px;
  color: #ff7878;
  height: 30px;
  width: 30px;
  border-radius: 50%;
  background: #58595b;
  text-align: center;
  box-shadow: 0 0 10px #000000 inset;
}

.ls-audio-play a.jp-play {
  margin-left: 3px;
}

.ls-audio-left a.jp-previous {
  margin-left: -3px;
}

.ls-audio-stop a.jp-stop {
  margin-top: 3px;
  margin-right: 0px;
}

.ls-audio-right a.jp-next {
  margin-left: 3px;
}

.ls-audio-play .fa {
  color: #ff7878;
  font-size: 16px;
}

.ls-audio-left .fa,
.ls-audio-right .fa,
.ls-audio-stop .fa,
.ls-audio-suffle .fa,
.ls-audio-repeat .fa,
.ls-vol-down .fa,
.ls-vol-up .fa,
.ls-audio-list .fa,
.ls-video-screen .fa {
  color: #ff7878;
  font-size: 12px;
}

.ls-audio-play:hover .fa,
.ls-audio-left:hover .fa,
.ls-audio-right:hover .fa,
.ls-audio-stop:hover .fa,
.ls-audio-suffle:hover .fa,
.ls-audio-repeat:hover .fa,
.ls-vol-down:hover .fa,
.ls-vol-up:hover .fa,
.ls-audio-list:hover .fa,
.ls-video-screen:hover .fa {
  color: #1FB5AD;
}

.ls-audio-time,
.ls-audio-vol {
  position: absolute;
  left: 10px;
}

.ls-video-player-wrap div.jp-video a.jp-mute,
.ls-video-player-wrap div.jp-video a.jp-unmute,
.ls-video-player-wrap div.jp-video a.jp-volume-max {
  top: 0;
  position: static;
}

.ls-audio-time div.jp-current-time,
.ls-audio-time div.jp-duration {
  float: none;
}

.ls-audio-time div.jp-duration {
  margin-left: 0 !important;
}

.ls-audio-time div.jp-current-time {
  color: #ff7878;
}

.ls-audio-time div.jp-duration {
  color: #969696;
}

.ls-audio-vol {
  top: 15px;
}

.ls-vol-down {
  position: absolute;
  top: 25px;
  left: 75px;
}

.ls-vol-up {
  position: absolute;
  top: 25px;
  left: 0;
}

.ls-audio-player .ls-audio-vol div.jp-volume-bar {
  right: -67px;
  top: 39px;
}

.ls-video-player-wrap div.jp-seek-bar {
  background: rgba(255, 120, 120, 0.50);
}

.ls-video-player-wrap div.jp-play-bar {
  background: #ff7878;
}

.ls-audio-player-wrap .ls-player-playlist,
.ls-video-player-wrap .ls-player-playlist {
  position: relative;
  background-color: transparent;
  border-top: none;
}

.ls-audio-player-wrap .ls-player-playlist ul,
.ls-video-player-wrap .ls-player-playlist ul {
  padding: 0;
  margin: 0;
  background-color: #555557;
}

.ls-audio-player-wrap .ls-player-playlist ul li,
.ls-video-player-wrap .ls-player-playlist ul li {
  list-style: none;
  display: block;
  padding: 5px 10px;
  border-bottom: 1px solid #58595b;
}

.ls-audio-player-wrap .ls-player-playlist ul li a,
.ls-video-player-wrap .ls-player-playlist ul li a {
  color: #969696;
}

.ls-video-player-wrap .ls-player-playlist ul li a span {
  color: #ff7878;
}

.ls-audio-player-wrap .ls-player-playlist ul li:hover a,
.ls-video-player-wrap .ls-player-playlist ul li:hover a {
  color: #ff7878;
}

.ls-video-player-wrap .ls-player-playlist ul li:hover a span {
  color: #969696;
}

.ls-audio-player-wrap .ls-player-playlist ul li.jp-playlist-current a,
.ls-video-player-wrap .ls-player-playlist ul li.jp-playlist-current a {
  color: #ff7878;
}

.ls-video-player-wrap .ls-player-playlist ul li.jp-playlist-current a span {
  color: #969696;
}

.ls-audio-player-wrap .ls-player-playlist ul li span.jp-free-media,
.ls-video-player-wrap .ls-player-playlist ul li span.jp-free-media {
  float: left;
}

.ls-audio-player-wrap .ls-player-playlist ul li a.jp-playlist-item-remove,
.ls-video-player-wrap .ls-player-playlist ul li a.jp-playlist-item-remove {
  display: block !important;
  float: left;
  margin-right: 10px;
}

/*-----------------------------------------------------------------*/

/*------------------------------------------------------------------
  -------------------------- TREE VIEW ------------------------
-------------------------------------------------------------------*/

.ls-tree-view {
  background: none;
}

.ls-tree-view > ul {
  padding: 0;
  margin: 0;
}

.ls-tree-view ul li {
  font-size: 14px;
}

.ls-tree-view li:before {
  border: 2px solid #e3dfd8;
}

.ls-tree-view li:after {
  border-top: 1px solid #e3dfd8;
}

.ls-tree-view li:last-child:before {
  height: 25px;
}

.ls-tree-view li > span {
  border: 1px solid #e3dfd8;
  border-radius: 1px;
}

.ls-tree-view ul li span,
.ls-tree-view ul li a {
  color: #333;
}

.ls-tree-view li > span span.glyphicon {
  color: #b4b0a9;
  margin-left: 5px;
}

.ls-tree-view li.parent_li > span > span.glyphicon {
  margin-left: 10px;
}

.ls-tree-view li.parent_li > span:hover,
.ls-tree-view li.parent_li > span:hover + ul li span {
  background: #E0E0E0;
}

.ls-tree-view  .easy-tree-toolbar {
  background-color: inherit;
  position: relative;
}

.ls-tree-view .easy-tree-toolbar > div > button {
  margin: 5px;
}

.ls-tree-view  .easy-tree-toolbar .create {
  float: right;
}

.ls-tree-view  .easy-tree-toolbar .create .btn {
  background-color: #5bc0de;
  border-color: #46b8da;
  color: #fff;
  float: right;
}

.ls-tree-view  .easy-tree-toolbar .edit .btn {
  background-color: #f0ad4e;
  border-color: #eea236;
  color: #fff;
}

.ls-tree-view  .easy-tree-toolbar .remove .btn {
  background-color: #ff7878;
  border-color: #ff7878;
  color: #fff;
}

.ls-tree-view .easy-tree-toolbar .create .input-group {
  top: 0;
}

.ls-tree-view .easy-tree-toolbar .create .input-group-btn {
  width: inherit;
}

.ls-tree-view .easy-tree-toolbar .create .input-group .form-control {
  top: 5px;
  height: 30px;
}

.ls-tree-view .easy-tree-toolbar .create .input-group span.input-group-btn > .btn {
  height: 30px;
  line-height: 15px;
  top: 5px;
}

/*-----MULTI NESTED LIST-------*/

.ls-animated-multi-lists ul {
  padding: 0em;
}

.ls-animated-multi-lists ul li,
.ls-animated-multi-lists ul li ul li {
  position: relative;
  top: 0;
  bottom: 0;
  padding-bottom: 7px;
}

.ls-animated-multi-lists ul li ul {
  margin-right: 3em;
  position: relative;
}

.ls-animated-multi-lists li {
  list-style-type: none;
}

.ls-animated-multi-lists li a {
  padding: 0 10px 0 0;
  position: relative;
  top: 1em;
  color: #86827b;
}

.ls-animated-multi-lists li a:hover {
  text-decoration: none;
}

.ls-animated-multi-lists a.addBorderBefore:before {
  content: "";
  display: inline-block;
  width: 2px;
  height: 28px;
  position: absolute;
  right: -47px;
  top: -16px;
  border-right: 1px solid #e3dfd8;
}

.ls-animated-multi-lists li:before {
  content: "";
  display: inline-block;
  width: 25px;
  height: 0;
  position: relative;
  right: 0em;
  top: 11px;
  border-top: 1px solid #e3dfd8;
}

.ls-animated-multi-lists ul li ul li:last-child:after,
.ls-animated-multi-lists ul li:last-child:after {
  content: '';
  display: block;
  position: relative;
}

/*-------------------------------------------------------------*/

/*------------------------------------------------------------------
  -------------------------- IMAGE FLUID BOX ------------------------
-------------------------------------------------------------------*/

/* Just positioning of images to introduce variety */

.ls-image-fluid-box a[data-fluidbox] {
  background-color: #eee;
  border: none;
  cursor: -webkit-zoom-in;
  cursor: -moz-zoom-in;
  margin-bottom: 1.5rem;
}

.ls-image-fluid-box a.fluidbox-opened {
  cursor: -webkit-zoom-out;
  cursor: -moz-zoom-out;
}

.ls-image-fluid-box a img {
  display: block;
  margin: 0 auto;
  max-width: 100%;
  transition: all .25s ease-in-out;
}

.ls-image-fluid-box a[class^='float'] {
  margin: 1rem;
  margin-top: 0;
  width: 33.33333%;
}

.ls-image-fluid-box a.float-left {
  float: right;
  margin-right: 0;
}

.ls-image-fluid-box a.float-right {
  float: left;
  margin-left: 0;
}

.ls-image-fluid-box a.has-border img {
  border: .25em solid #111;
}

.ls-image-fluid-box a.has-padding img {
  padding: .25em;
}

.ls-image-fluid-box .ls-fluid-box-gallery {
  display: flex;
  -webkit-flex-flow: row wrap;
  flex-flow: row wrap;
  justify-content: space-between;
}

.ls-image-fluid-box .ls-fluid-box-gallery a {
  margin-bottom: 1rem;
}

.ls-image-fluid-box .ls-fluid-box-gallery a.col-1 {
  width: 100%;
}

.ls-image-fluid-box .ls-fluid-box-gallery a.col-2 {
  width: 49%;
  width: calc(50% - .5rem);
}

.ls-image-fluid-box .ls-fluid-box-gallery a.col-3 {
  width: 32%;
  width: calc(33.33333% - .66667rem);
}

.ls-image-fluid-box .box {
  background-color: #eee;
  border: 1px solid rgba(0,0,0,.25);
  box-sizing: border-box;
  padding-bottom: 66.66667%;
  position: relative;
  width: 100%;
}

.ls-image-fluid-box .box img {
  position: absolute;
  top: 2rem;
  right: 2rem;
  width: 50%;
}

/* Custom overlays */

.overlay-1 .fluidbox-overlay {
  background-color: rgba(153,145,139,.85);
}

.overlay-2 .fluidbox-overlay {
  background-color: transparent;
  background-image: linear-gradient(to top left, rgba(130,168,158,0.85), rgba(134,150,173,.85));
}

.overlay-3 .fluidbox-overlay {
  background-color: #000;
}

.overlay-3 .fluidbox-overlay::before {
  background-image: url('../../images/demo/dummy-1280x800.jpg');
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  opacity: .33333;
  -webkit-filter: blur(4px);
}

/*-------------------------------------------------------------*/



/*-------------------------------------------------------*/
/************* RTL ARROW ************/
/*-------------------------------------------------------*/
/*---Selectize---*/
.selectize-control.rtl.single .selectize-input:after {
    left: 10px;
    right: auto;
}

/*---Tooltip---*/
.tooltip.right .tooltip-arrow {
    top: 50%;
    left: 0;
    right: auto;
    margin-top: -5px;
    border-width: 5px 5px 5px 0;
    border-right-color: #000;
}
.tooltip.left .tooltip-arrow {
    top: 50%;
    right: 0;
    left: auto;
    margin-top: -5px;
    border-width: 5px 0 5px 5px;
    border-left-color: #000;
}


/*---PopOver---*/
.popover.left > .arrow{
    right: -11px;
    border-right-color: rgba(0, 0, 0, 0.0);
}

.popover.right > .arrow{
    left: -11px;
    border-left-color: rgba(0, 0, 0, 0.0);
    right: auto;
}

.popover.left > .arrow:after {
    border-left-color: #fafafa;
    border-right-width: 0;
    border-left-width: 10px;
    left: -1px;
}

.popover.right > .arrow:after {
    border-right-color: #fafafa;
    border-left-width: 0;
    border-right-width: 10px;
    right: -1px;
}


/*--- PopUp Image ---*/
#lightGallery-action {
    direction: ltr;
}

/*--- Image Cropper ---*/
.rtl-copper{
    direction: ltr;
}

.cropper-dragger {
    left: 10%;
    right: auto;
    direction: ltr;
}

/*--- Weather ---*/
.weatherItem {
    text-align: right;
}