html,
body {
  -webkit-font-smoothing: antialiased;
  min-height: 100%;
  background: #f2f7fa;
  font-weight:400;
  width: 100%;
  height: 100%;
  font-family: "Poppins", sans-serif;
  font-style: normal;
  font-optical-sizing: auto; 
}
.note-frame h1, .note-frame h2, .note-frame h3, .note-frame h4, .note-frame h5, .note-frame .h1, .note-frame .h2{
	color:#161e55 !important;
}
body.loginscreen {background: #007bff;background: linear-gradient(to right, #0062E6, #33AEFF);}
a { color: #3c8dbc;}
a:hover,
a:active,
a:focus {
  outline: none;
  text-decoration: none;
  color: #72afd2;
}
.wrapper { min-height: 100%;}
.wrapper:before,
.wrapper:after {
  display: table;
  content: " ";
}
.wrapper:after { clear: both;}

.bg-white { background-color:#fff !important;}
.bg-gray { background-color:#eee !important;}
.border-gray-right { border-right:solid 1px #dbdbdb;}
.btn-lg { line-height: normal;}

/* Header */
body > .header {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1030;
}
/* Define 2 column template */
.right-side,
.left-side {
  min-height: 100%;
  display: block;
  -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}
/*right side - contins main content*/
.right-side {
  margin-left: 220px;
}
/*left side - contains sidebar*/
.left-side {
  position: absolute;
  width: 220px;
  top: 0;
}
.popover { z-index:999999 !important;}
@media screen and (min-width: 992px) {
  .left-side {
    /*top: 50px;*/
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
  }
  /*Right side strech mode*/
  .right-side.strech {
    margin-left: 0;
  }
  .right-side.strech > .content-header {
    margin-top: 0px;
  }
  /* Left side collapse */
  .left-side.collapse-left {
    left: -220px;
  }
}
/*Give content full width on xs screens*/
@media screen and (max-width: 992px) {
  .right-side {
    margin-left: 0;
  }
}
/*
    By default the layout is not fixed but if you add the class .fixed to the body element
    the sidebar and the navbar will automatically become poisitioned fixed
*/
body.fixed > .header,
body.fixed .left-side,
body.fixed .navbar {
  position: fixed;
}
body.fixed > .header {
  top: 0;
  right: 0;
  left: 0;
  background-color:#f9f9f9;
}
body.fixed .navbar {
  left: 0;
  right: 0;
}
body.fixed .wrapper { margin-top: 50px;}
/* Content */
.content {
  padding: 18px 18px;
  overflow: auto;
}
/* Utility */
/* H1 - H6 font */
h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
  font-family: 'Source Sans Pro', sans-serif;
}
/* Page Header */
.page-header {
  margin: 10px 0 20px 0;
  font-size: 22px;
}
.page-header > small {
  color: #666;
  display: block;
  margin-top: 5px;
}
/* All images should be responsive */
img { max-width: 100% important;}
.sort-highlight {
  background: #f4f4f4;
  border: 1px dashed #ddd;
  margin-bottom: 10px;
}
/* 10px padding and margins */
.pad { padding: 10px;}
.margin { margin: 10px;}
/* Display inline */

.inline {
  display: inline;
  width: auto;
}
/* Background colors */
.bg-red, .bg-yellow, .bg-aqua, .bg-blue, .bg-light-blue, .bg-green, .bg-navy, .bg-teal, .bg-olive, .bg-lime, .bg-orange, .bg-fuchsia, .bg-purple, .bg-maroon, .bg-black { color: #f9f9f9 !important;}
.bg-gray { background-color: #eaeaec !important;}.bg-black { background-color: #222222 !important;}.bg-red { background-color: #f56954 !important;}.bg-yellow { background-color: #f39c12 !important;}.bg-aqua { background-color: #00c0ef !important;}.bg-blue { background-color: #0073b7 !important;}.bg-light-blue { background-color: #3c8dbc !important;}.bg-green { background-color: #00a65a !important;}.bg-navy { background-color: #001f3f !important;}.bg-teal { background-color: #39cccc !important;}.bg-olive { background-color: #3d9970 !important;}.bg-lime { background-color: #01ff70 !important;}.bg-orange { background-color: #ff851b !important;}.bg-fuchsia { background-color: #f012be !important;}.bg-purple { background-color: #932ab6 !important;}.bg-maroon { background-color: #85144b !important;}


/* Text colors */
.text-red { color: #f56954 !important;}.text-yellow { color: #f39c12 !important;}.text-aqua { color: #00c0ef !important;}.text-blue { color: #0073b7 !important;}.text-light-blue { color: #3c8dbc !important;}.text-green { color: #00a65a !important;}.text-navy { color: #001f3f !important;}.text-teal { color: #39cccc !important;}.text-olive { color: #3d9970 !important;}.text-lime { color: #01ff70 !important;}.text-orange { color: #ff851b !important;}.text-fuchsia { color: #f012be !important;}.text-purple { color: #932ab6 !important;}.text-maroon { color: #85144b !important;}.text-white { color:#fff !important;}

.margin-bottom5 { margin-bottom:5px !important;}.margin-bottom10 { margin-bottom:10px !important;}

/*Hide elements by display none only*/
.hide { display: none !important;}
/* Remove borders */
.no-border { border: 0px !important;}
/* Remove padding */
.no-padding { padding: 0px !important;}
/* Remove margins */
.no-margin { margin: 0px !important;}
/* Remove box shadow */
.no-shadow { box-shadow: none!important;}

/* Don't display when printing */
@media print {
  .no-print {
    display: none;
  }
  .left-side,
  .header,
  .content-header {
    display: none;
  }
  .right-side {
    margin: 0;
  }
}
/* Remove border radius */
.flat {
  -webkit-border-radius: 0 !important;
  -moz-border-radius: 0 !important;
  border-radius: 0 !important;
}
/* Change the color of the striped tables */
.table-striped > tbody > tr:nth-child(odd) > td,
.table-striped > tbody > tr:nth-child(odd) > th {
  background-color: #f3f4f5;
}
/* .text-center in tables */
table.text-center td,
table.text-center th {
  text-align: center;
}
/* _fix for sparkline tooltip */
.jqstooltip {
  padding: 5px!important;
  width: auto!important;
  height: auto!important;
}
/*
    Components: navbar, logo and content header
-------------------------------------------------
*/
body > .header { position: relative; max-height: 100px; z-index: 1030;}
body > .header .navbar { height: 50px; margin-bottom: 0; margin-left: 220px; background-color:#fff;-webkit-box-shadow: 0 4px 6px 0 rgba(167, 175, 183, 0.10);
box-shadow: 0 4px 6px 0 rgba(167, 175, 183, 0.10);}
body.left-expand > .header .navbar { margin-left: 0;}

body > .header .navbar .sidebar-toggle {
  float: left;
  padding: 5px 5px 9px 5px;
  margin-top: 0px;
  margin-right: 0;
  background-color: transparent;
  background-image: none;
  border: 1px solid transparent;
  -webkit-border-radius: 0 !important;
  -moz-border-radius: 0 !important;
  border-radius: 0 !important;
}
body > .header .navbar .sidebar-toggle:hover .icon-bar { background: #f6f6f6;}
body > .header .navbar .sidebar-toggle .icon-bar {
  display: block;
  width: 22px;
  height: 2px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}
body > .header .navbar .sidebar-toggle .icon-bar + .icon-bar { margin-top: 4px;}
body > .header .navbar .nav > li.user > a { font-weight:normal;}
body > .header .navbar .nav > li.user > a > .fa,
body > .header .navbar .nav > li.user > a > .glyphicon,
body > .header .navbar .nav > li.user > a > .ion { margin-right: 5px;}
body > .header .navbar .nav > li > a > .label {
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  position: absolute;
  top: 7px;
  right: 2px;
  font-size: 10px;
  font-weight: normal;
  width: 15px;
  height: 15px;
  line-height: 1.0em;
  text-align: center;
  padding: 2px;
}
body > .header .navbar .nav > li > a:hover > .label { top: 3px;}
body > .header .logo {
  float: left;
  text-align: center;
  padding: 0 10px;
  width: 220px;
  font-weight: 500;
  display: block;
  padding:2px;
}

body > .header .logo .icon { margin-right: 10px;}
.right-side > .content-header { position: relative; padding: 10px 15px 10px 20px;}
.right-side > .content-header > h1, .right-side > .content-header > h1 .glyphicon, .right-side > .content-header > h1 .fa { margin: 0; font-weight:400; font-size:26px; line-height:26px;}
.right-side div.h4 { font-size:20px; margin-top:0.2em; margin-bottom: 0.3em; line-height:normal}

.right-side > .content-header > h1 > small {
  font-size: 15px;
  display: inline-block;
  padding-left: 4px;
  font-weight: 300;
}
.right-side > .content-header > .breadcrumb {
  float: right;
  background: #f2f7fa;
  margin-top: 0px;
  margin-bottom: 0;
  font-size: 12px;
  padding: 7px 5px;
  position: absolute;
  top: 0;
  left: 0px;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
	width: 100%;
}
.right-side > .content-header > .breadcrumb > li > a { color: #444; text-decoration: none;}
.right-side > .content-header > .breadcrumb > li > a > .fa,
.right-side > .content-header > .breadcrumb > li > a > .glyphicon,
.right-side > .content-header > .breadcrumb > li > a > .ion { margin-right: 5px;}
.right-side > .content-header > .breadcrumb > li + li:before { content: '>\00a0'; padding: 0 0.2rem 0 0.4rem;}

@media screen and (max-width: 767px) {
  .right-side > .content-header > .breadcrumb {
    position: relative;
    margin-top: 5px;
    top: 0;
    right: 0;
    float: none;
    background: #f2f7fa;
  }
}

@media screen and (max-width: 560px) {
  body > .header { position: relative; }
  body > .header .logo,
  body > .header .navbar {
    width: 100%;
    float: none;
    position: relative!important;
  }
  body > .header .navbar { margin: 0; }
  body.fixed > .header { position: fixed; }
  body.fixed > .wrapper,
  body.fixed .sidebar-offcanvas { margin-top: 50px!important; }
  .header .dropdown .dropdown-toggle{
	  color:#fff;
  }
}

/*
    Component: Sidebar
--------------------------
*/
.sidebar { margin-bottom: 5px;}
.sidebar .sidebar-form input:focus {
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  border-color: transparent!important;
}
.sidebar .sidebar-menu {
  list-style: none;
  margin: 0;
  padding: 0;
  margin-top:0.8em;
}
.sidebar .sidebar-menu > li {
  margin: 0;
  padding: 0;
}
.sidebar .sidebar-menu > li > a {
  padding: 6px 5px 10px 15px;
  display: block;
}
.sidebar .sidebar-menu > li > a > .fa,
.sidebar .sidebar-menu > li > a > .glyphicon,
.sidebar .sidebar-menu > li > a > .ion {
  width: 20px;
}
.sidebar .sidebar-menu .treeview-menu {
  display: none;
  list-style: none;
  padding: 0;
  margin: 0;
}
.sidebar .sidebar-menu .treeview-menu > li {
  margin: 0;
}
.sidebar .sidebar-menu .treeview-menu > li > a {
  padding: 5px 5px 5px 15px;
  display: block;
  font-size: 14px;
  margin: 0px 0px;
}
.sidebar .sidebar-menu .treeview-menu > li > a > .fa,
.sidebar .sidebar-menu .treeview-menu > li > a > .glyphicon,
.sidebar .sidebar-menu .treeview-menu > li > a > .ion {
  width: 20px;
}

/*
 * Off Canvas
 * --------------------------------------------------
 * Gives us the push menu effect
 */
@media screen and (max-width: 992px) {
  .relative { position: relative; }
  .row-offcanvas-right .sidebar-offcanvas { right: -220px; }
  .row-offcanvas-left .sidebar-offcanvas { left: -220px; }
  .row-offcanvas-right.active { right: 220px; }
  .row-offcanvas-left.active { left: 220px; }
  .sidebar-offcanvas { left: 0; }
  body.fixed .sidebar-offcanvas { margin-top: 50px; left: -220px;}
  body.fixed .row-offcanvas-left.active .navbar { left: 220px !important; right: 0;}
  body.fixed .row-offcanvas-left.active .sidebar-offcanvas { left: 0px;}
}
/* 
    Dropdown menus
----------------------------
*/
/*Dropdowns in general*/
.dropdown-menu {
  -webkit-box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.1);
  box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.1);
  z-index: 2300;
}
.dropdown-menu > li > a > .glyphicon,
.dropdown-menu > li > a > .fa,
.dropdown-menu > li > a > .ion {
  margin-right: 10px;
}
.dropdown-menu > li > a:hover {
  background-color: #3c8dbc;
  color: #f9f9f9;
}
/*Drodown in navbars*/
.skin-gray .navbar .dropdown-menu > li > a {
  color: #444444;
}
/*
    Navbar custom dropdown menu
------------------------------------
*/
.navbar-nav > .user-menu > .dropdown-menu {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
  padding: 1px 0 0 0;
  width: 250px;
  z-index:99999 !important;
  background-color:#fff;
  -webkit-box-shadow: 0 4px 6px 0 rgba(167, 175, 183, 0.10);
  box-shadow: 0 4px 6px 0 rgba(167, 175, 183, 0.10);
  position: absolute;
}
.navbar-nav > .user-menu > .dropdown-menu:after {
  bottom: 100%;
  right: 0;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-color: rgba(255, 255, 255, 0);
  border-bottom-color: #556080;
  border-width: 8px;
  margin-left: -8px;
  border-radius: 4px !impoprtant;
}
.navbar-nav > .user-menu > .dropdown-menu > li.user-header {
  /*height: 175px;*/
  padding: 15px 10px;
  background: #ffffff;
  text-align: center;
}
.navbar-nav > .user-menu > .dropdown-menu > li.user-header > img {
  z-index: 5;
  height: 70px;
  width: 70px;
  border: 8px solid;
  border-color: transparent;
  border-color: rgba(255, 255, 255, 0.2);
}
.navbar-nav > .user-menu > .dropdown-menu > li.user-header > p {
  z-index: 5;
  color: #333 !important;
  color: rgba(255, 255, 255, 0.8);
  font-size: 17px;
}
.navbar-nav > .user-menu > .dropdown-menu > li.user-header > p > small {
  display: block;
  font-size: 12px;
}
.navbar-nav > .user-menu > .dropdown-menu > li.user-body {
  padding: 15px;
  border-bottom: 1px solid #f4f4f4;
  border-top: 1px solid #dddddd;
}
.navbar-nav > .user-menu > .dropdown-menu > li.user-body:before,
.navbar-nav > .user-menu > .dropdown-menu > li.user-body:after {
  display: table;
  content: " ";
}
.navbar-nav > .user-menu > .dropdown-menu > li.user-body:after {
  clear: both;
}
.navbar-nav > .user-menu > .dropdown-menu > li.user-body > div > a {
  color: #0073b7;
}
.navbar-nav > .user-menu > .dropdown-menu > li.user-footer {
  background-color: #f9f9f9;
  padding: 10px;
}
.navbar-nav > .user-menu > .dropdown-menu > li.user-footer:before,
.navbar-nav > .user-menu > .dropdown-menu > li.user-footer:after {
  display: table;
  content: " ";
}
.navbar-nav > .user-menu > .dropdown-menu > li.user-footer:after {
  clear: both;
}
.navbar-nav > .user-menu > .dropdown-menu > li.user-footer .btn-default {
  color: #666666;
}
/* Add fade animation to dropdown menus */
.show > .dropdown-menu {
  animation-name: fadeAnimation;
  animation-duration: .7s;
  animation-iteration-count: 1;
  animation-timing-function: ease;
  animation-fill-mode: forwards;
  -webkit-animation-name: fadeAnimation;
  -webkit-animation-duration: .7s;
  -webkit-animation-iteration-count: 1;
  -webkit-animation-timing-function: ease;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-name: fadeAnimation;
  -moz-animation-duration: .7s;
  -moz-animation-iteration-count: 1;
  -moz-animation-timing-function: ease;
  -moz-animation-fill-mode: forwards;
}
@keyframes fadeAnimation {
  from {
    opacity: 0;
    top: 120%;
  }
  to {
    opacity: 1;
    top: 100%;
  }
}
@-webkit-keyframes fadeAnimation {
  from {
    opacity: 0;
    top: 120%;
  }
  to {
    opacity: 1;
    top: 100%;
  }
}
/* Fix dropdown menu for small screens to display correctly on small screens */
@media screen and (max-width: 767px) {
  .navbar-nav > .user-menu > .dropdown-menu
	{
    position: absolute;
    top: 100%;
    right: 0;
    left: auto;
    border-right: 1px solid #dddddd;
    border-bottom: 1px solid #dddddd;
    border-left: 1px solid #dddddd;
    background: #ffffff;
  }
}
/* 
   All form elements including input, select, textarea etc.
-----------------------------------------------------------------
*/
.form-control {
  -webkit-border-radius: 0px !important;
  -moz-border-radius: 0px !important;
  border-radius: 0px !important;
  box-shadow: none;
}
.form-control:focus {}
.form-group.has-success label {
  color: #00a65a;
}
.form-group.has-success .form-control {
  border-color: #00a65a !important;
  box-shadow: none;
}
.form-group.has-warning label {
  color: #f39c12;
}
.form-group.has-warning .form-control {
  border-color: #f39c12 !important;
  box-shadow: none;
}
.form-group.has-error label {
  color: #f56954;
}
.form-group.has-error .form-control {
  border-color: #f56954 !important;
  box-shadow: none;
}
/* Input group */
.input-group .input-group-addon {
  border-radius: 0;
  background-color: #f4f4f4;
}
/* button groups */
.btn-group-vertical .btn.btn-flat:first-of-type,
.btn-group-vertical .btn.btn-flat:last-of-type {
  border-radius: 0;
}
/* Checkbox and radio inputs */
/*
.checkbox,
.radio {
  padding-left: 0;
}
*/

/*
    Component: Small boxes
*/
.small-box {
position: relative;
display: block;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
margin-bottom: 15px;
}
.small-box > .inner {
  padding: 10px;
}
.small-box > .small-box-footer {
  position: relative;
  text-align: center;
  padding: 3px 0;
  color: #fff;
  display: block;
  z-index: 10;
  background: rgba(0, 0, 0, 0.1);
  text-decoration: none;
}
.small-box > .small-box-footer:hover {
  color: #fff;
  background: rgba(0, 0, 0, 0.15);
}
.small-box h3 {
  font-size: 35px;
  font-weight: bold;
  margin: 0 0 0 0;
  white-space: nowrap;
  padding: 0;
  color: #fff;
}
.small-box h3 > span {
  font-size: 25px;
  font-weight: bold;
  margin: 0 0 10px 0;
  white-space: nowrap;
  padding: 0;
}
.small-box p { font-size: 15px;}
.small-box p > small {
  display: block;
  color: #f9f9f9;
  font-size: 13px;
  margin-top: 5px;
}
.small-box h3,
.small-box p { z-index: 5;}
.small-box h3 {min-height: 45px;}
.bg-aqua h3 { font-size: 25px;}
.small-box .icon {
  position: absolute;
  top: auto;
  bottom: 25px;
  right: 5px;
  z-index: 0;
  font-size: 50px;
  line-height:50px;
  color: rgba(0, 0, 0, 0.15);
}
.small-box:hover {
  text-decoration: none;
  color: #f9f9f9;
}
.small-box:hover .icon {
  animation-name: tansformAnimation;
  animation-duration: 0.5s;
  animation-iteration-count: 1;
  animation-timing-function: ease;
  animation-fill-mode: forwards;
  -webkit-animation-name: tansformAnimation;
  -webkit-animation-duration: .5s;
  -webkit-animation-iteration-count: 1;
  -webkit-animation-timing-function: ease;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-name: tansformAnimation;
  -moz-animation-duration: 0.5s;
  -moz-animation-iteration-count: 1;
  -moz-animation-timing-function: ease;
  -moz-animation-fill-mode: forwards;
}
@keyframes tansformAnimation {
  from {
    font-size: 65px;
  }
  to {
    font-size: 70px;
  }
}
@-webkit-keyframes tansformAnimation {
  from {
    font-size: 65px;
  }
  to {
    font-size: 70px;
  }
}
@media screen and (max-width: 480px) {
  .small-box {
    text-align: center;
  }
  .small-box .icon {
    display: none;
  }
  .small-box p {
    font-size: 12px;
  }
}


.alert {
  padding-left: 20px;
  position: relative;
}
.alert > .fa,
.alert > .glyphicon {
  position: absolute;
  left: -15px;
  top: -15px;
  width: 35px;
  height: 35px;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  line-height: 35px;
  text-align: center;
  background: inherit;
  border: inherit;
}
/*
    Component: Navs
*/
/* NAV PILLS */
.nav.nav-pills > li > a {
  border-top: 3px solid transparent;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
  color: #444;
}
.nav.nav-pills > li > a > .fa,
.nav.nav-pills > li > a > .glyphicon,
.nav.nav-pills > li > a > .ion {
  margin-right: 5px;
}
.nav.nav-pills > li.active > a,
.nav.nav-pills > li.active > a:hover {
  background-color: #f6f6f6;
  border-top-color: #3c8dbc;
  color: #444;
}
.nav.nav-pills > li.active > a {
  font-weight: 600;
}
.nav.nav-pills > li > a:hover {
  background-color: #f6f6f6;
}
.nav.nav-pills.nav-stacked > li > a {
  border-top: 0;
  border-left: 3px solid transparent;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
  color: #444;
}
.nav.nav-pills.nav-stacked > li.active > a,
.nav.nav-pills.nav-stacked > li.active > a:hover {
  background-color: #f6f6f6;
  border-left-color: #3c8dbc;
  color: #444;
}
.nav.nav-pills.nav-stacked > li.header {
  border-bottom: 1px solid #ddd;
  color: #777;
  margin-bottom: 10px;
  padding: 5px 10px;
  text-transform: uppercase;
}

/* 
    Page: register and login
*/
.form-box {
  width: 360px;
  margin: 90px auto 0 auto;
}
.form-box .header {
  -webkit-border-top-left-radius: 4px;
  -webkit-border-top-right-radius: 4px;
  -webkit-border-bottom-right-radius: 0;
  -webkit-border-bottom-left-radius: 0;
  -moz-border-radius-topleft: 4px;
  -moz-border-radius-topright: 4px;
  -moz-border-radius-bottomright: 0;
  -moz-border-radius-bottomleft: 0;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
  background: #3d9970;
  box-shadow: inset 0px -3px 0px rgba(0, 0, 0, 0.2);
  padding: 20px 10px;
  text-align: center;
  font-size: 26px;
  font-weight: 300;
  color: #fff;
}
.form-box .body,
.form-box .footer {
  padding: 10px 20px;
  background: #fff;
  color: #444;
}
.form-box .body > .form-group,
.form-box .footer > .form-group {
  margin-top: 20px;
}
.form-box .body > .form-group > input,
.form-box .footer > .form-group > input {
  border: #fff;
}
.form-box .body > .btn,
.form-box .footer > .btn {
  margin-bottom: 10px;
}
.form-box .footer {
  -webkit-border-top-left-radius: 0;
  -webkit-border-top-right-radius: 0;
  -webkit-border-bottom-right-radius: 4px;
  -webkit-border-bottom-left-radius: 4px;
  -moz-border-radius-topleft: 0;
  -moz-border-radius-topright: 0;
  -moz-border-radius-bottomright: 4px;
  -moz-border-radius-bottomleft: 4px;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  border-bottom-right-radius: 4px;
  border-bottom-left-radius: 4px;
}
@media (max-width: 767px) {
  .form-box {
    width: 90%;
  }
}


/* 
    Skin Blue 
    ---------
*/
 /* skin-blue navbar */
 .skin-blue .navbar {
	background-color:#f9f9f9;
 }
 .skin-blue .navbar .nav .messages-menu a:hover, .skin-blue .navbar .nav .messages-menu a:focus {
     background: #0AA699!important;
     color: #ffffff;
 }
 .label-success { background-color: #0AA699!important; }
 .label-danger { background-color: #F56954!important; }
 .skin-blue .navbar .nav .notifications-menu a {
     border: 2px solid #0190D9;
     border-radius: 50%;
     color: #0190D9;
     margin: 5px 3px 0 0;
       padding: 6px 7px !important;
 }
 .skin-blue .navbar .nav .notifications-menu a:hover, .skin-blue .navbar .nav .notifications-menu a:focus {
     background: #0190D9!important; color: #ffffff;
 }
 .skin-blue .navbar .nav .tasks-menu a {
     border: 2px solid #F56954;
     border-radius: 50%;
     color: #F56954;
     margin: 5px 3px 0 0;
     padding: 6px 7px !important;
 }
 .skin-blue .navbar .nav .tasks-menu a:hover, .skin-blue .navbar .nav .tasks-menu a:focus {
     background: #F56954!important;
     color: #ffffff;
 }
 .skin-blue .navbar .nav > li > a:hover, .skin-blue .navbar .nav > li > a:active, .skin-blue .navbar .nav > li > a:focus, .skin-blue .navbar .nav .open > a, .skin-blue .navbar .nav .open > a:hover, .skin-blue .navbar .nav .open > a:focus {
     background: transparent;
     /* color: #f6f6f6; */
 }
 .skin-blue .navbar .nav .style-menu a {
     border: 2px solid #346185;
     border-radius: 50%;
     color: #346185;
     margin: 5px 3px 0 0;
     padding: 6px 7px !important;
 }
 .skin-blue .navbar .nav .style-menu a:hover, .skin-blue .navbar .nav .style-menu a:focus {
     background: #346185;
     color: #ffffff;
     cursor: pointer;
 }
 .skin-blue .navbar .navbar-right > .nav { margin-right: 15px; display: block;}
 .skin-blue .navbar .navbar-right > li { margin-left: 10px!important; }
 .skin-blue .navbar .sidebar-toggle .icon-bar { background: #ccc; }
 .skin-blue .navbar .sidebar-toggle:hover .icon-bar { background: #3e261a !important; }

 .skin-blue .right-side > .content-header { box-shadow: 1px 2px 2px rgba(0, 0, 0, 0.02); position: relative; }
 /* skin-blue sidebar */
 .skin-blue .sidebar { border-bottom: 0px solid #fff; }
 .skin-blue .left-side {
  background: #161e55;
  -webkit-box-shadow: inset -3px 0px 8px -4px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: inset -3px 0px 8px -4px rgba(0, 0, 0, 0.1);
  box-shadow: inset -3px 0px 8px -4px rgba(0, 0, 0, 0.07);
}
.skin-blue .sidebar > .sidebar-menu { border-top: 1px solid #11295d; border-bottom: 1px solid #11295d; padding-bottom: 3em;}
 .skin-blue .sidebar > .sidebar-menu > li {}
 .skin-blue .sidebar > .sidebar-menu > li:first-of-type { border-top: 0px solid #dbdbdb;}
 .skin-blue .sidebar > .sidebar-menu > li:first-of-type > a { border-top: 0px solid #fff;}
 .skin-blue .sidebar > .sidebar-menu > li > a { margin-right: 0px;}
 .skin-blue .sidebar > .sidebar-menu > li > a > span {
	font-weight: 500;
	/* margin-right: 20px!important; */
	right: -3px;
	position: relative;
}
.skin-blue .sidebar  .sidebar-menu  li  a{
	text-decoration:none;
	font-size:14px;
}
.skin-blue .sidebar > .sidebar-menu > li > a i.fa { color:#aaa !important;}
.skin-blue .sidebar > .sidebar-menu > li > a:hover, .skin-blue .sidebar > .sidebar-menu > li.active > a {
     color: #fff;
     background: #344870;
 }
.skin-blue .sidebar > .sidebar-menu > li > a:hover i.fa, .skin-blue .sidebar > .sidebar-menu > li.active > a i.fa { color:#fff !important;}
.skin-blue .sidebar > .sidebar-menu > li.active > a:after { border: solid transparent; content: ""; position: absolute; border-right-color: #ffffff5e; border-width: 8px; right:0; margin-top:2px;}

.skin-blue .sidebar > .sidebar-menu > li > .treeview-menu { margin: 0; background: #293272; padding-bottom:0.8em;}
.skin-blue .leftmenu {
     background: #222a38;
     -webkit-box-shadow: inset -3px 0px 8px -4px rgba(0, 0, 0, 0.1);
     -moz-box-shadow: inset -3px 0px 8px -4px rgba(0, 0, 0, 0.1);
     box-shadow: inset -3px 0px 8px -4px rgba(0, 0, 0, 0.07);
     z-index: 1501;
 }
 .skin-blue .sidebar > .sidebar-menu > li > .treeview-menu 	li > a{
	 margin-left:10px;
 }
 .skin-blue .sidebar a {color: #ccc;}
 .skin-blue .sidebar a:hover { text-decoration: none;}
 .skin-blue .treeview-menu > li > a {font-weight: normal;}
 .skin-blue .treeview-menu > li.active > a, .skin-blue .treeview-menu > li > a:hover { color: #fff; }
 .skin-blue .sidebar-form {
 	-webkit-border-radius: 2px;
     -moz-border-radius: 2px;
     border-radius: 2px;
 }
 .skin-blue .sidebar-form input[type="text"], .skin-blue .sidebar-form .btn {
     box-shadow: none;
     background-color: #fff;
     border: 1px solid #fff;
     height: 45px;
 }
.image-avatar {
     margin: 0 auto;
     text-align: center;
     position: relative;
	 margin-bottom:0.2em;
 }
.info p span {} .user-panel {
     padding: 1em 10px 0 0;
     position: relative;
}
.user-panel:before, .user-panel:after {
     display: table;
     content: " ";
}
.user-panel:after {lear: both; }
ul.profile-list {
        margin:0;
        padding:2px 0;
        text-align: center;
        position: relative;
        left: 0;
        margin-top:1em;
        margin-bottom:0em;
}
.profile-list li {
     font-size: 12px;
     list-style: none;
     display: inline;
     margin: 0 3px;
}
/* .profile-list li.store-view {
 }
 .profile-list li.store-view div {
 position:absolute; color:#00FF00;
 width:10px; height:10px; margin-left:20px;

 }
*/
.profile-list li a span {
     height: 32px;
     width: 32px;
     border-radius: 50%;
     display: inline-block;
     text-align: center;
     line-height: 32px;
     font-size: 15px;
     background: #602e0d;
	 color:#fff;
}
.profile-list li a span:hover {
     cursor: pointer;
     background: #344870;
     color: #fff;
}

/* Skin Gray
    -----
*/
.skin-gray .navbar {
  background-color: #fff;
  border-bottom:solid 1px #eee;
}
.skin-gray .navbar .nav a { color:#aaa;}
.skin-gray .navbar .nav > li > a:hover,
.skin-gray .navbar .nav > li > a:active,
.skin-gray .navbar .nav > li > a:focus,
.skin-gray .navbar .nav .open > a,
.skin-gray .navbar .nav .open > a:hover,
.skin-gray .navbar .nav .open > a:focus {
  background: #ececec;
  color: #333;
}
.skin-gray .navbar .navbar-right > .nav {
  margin-right: 10px;
}
.skin-gray .navbar .sidebar-toggle .icon-bar {
  background: #ccc;
}
.skin-gray .navbar .sidebar-toggle:hover .icon-bar {
  background: #333 !important;
}
/* skin-blue logo */
.skin-gray .logo { background-color: #fff; color: #f9f9f9;}
.skin-gray .logo > a { color: #f9f9f9;}
.skin-gray .logo:hover { background: #fff;}

/* skin-blue content header */
.skin-gray .right-side > .content-header {
  background: #fbfbfb;
  box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1);
}
/* Skin-blue user panel */
.skin-gray .user-panel > .image > img { border: 1px solid #dfdfdf;}
.skin-gray .user-panel > .info,
.skin-gray .user-panel > .info > a { color: #555555;}
/* skin-blue sidebar */
.skin-gray .sidebar { border-bottom: 1px solid #fff;}
.skin-gray .sidebar > .sidebar-menu > li {
  border-top: 1px solid #fff;
  border-bottom: 1px solid #dbdbdb;
}
.skin-gray .sidebar > .sidebar-menu > li:first-of-type { border-top: 1px solid #dbdbdb;}
.skin-gray .sidebar > .sidebar-menu > li:first-of-type > a { border-top: 1px solid #fff;}
.skin-gray .sidebar > .sidebar-menu > li > a { margin-right: 1px;}
.skin-gray .sidebar > .sidebar-menu > li > a:hover,
.skin-gray .sidebar > .sidebar-menu > li.active > a {
  color: #222;
  background: #f9f9f9;
}

.skin-gray .sidebar > .sidebar-menu > li > .treeview-menu {
  margin: 0 1px;
  background: #f9f9f9;
}
.skin-gray .left-side {
  background: #f4f4f4;
  -webkit-box-shadow: inset -3px 0px 8px -4px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: inset -3px 0px 8px -4px rgba(0, 0, 0, 0.1);
  box-shadow: inset -3px 0px 8px -4px rgba(0, 0, 0, 0.07);
}
.skin-gray .sidebar a { color: #555555;}
.skin-gray .sidebar a:hover { text-decoration: none;}
.skin-gray .treeview-menu > li > a { color: #777;}
.skin-gray .treeview-menu > li.active > a,
.skin-gray .treeview-menu > li > a:hover { color: #111;}
.skin-gray .sidebar-form {
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
  border: 1px solid #dbdbdb;
  margin: 10px 10px;
}
.skin-gray .sidebar-form input[type="text"],
.skin-gray .sidebar-form .btn {
  box-shadow: none;
  background-color: #fafafa;
  border: 1px solid #fafafa;
  height: 35px;
}
.skin-gray .sidebar-form input[type="text"] {
  color: #666;
  -webkit-border-top-left-radius: 2px !important;
  -webkit-border-top-right-radius: 0 !important;
  -webkit-border-bottom-right-radius: 0 !important;
  -webkit-border-bottom-left-radius: 2px !important;
  -moz-border-radius-topleft: 2px !important;
  -moz-border-radius-topright: 0 !important;
  -moz-border-radius-bottomright: 0 !important;
  -moz-border-radius-bottomleft: 2px !important;
  border-top-left-radius: 2px !important;
  border-top-right-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
  border-bottom-left-radius: 2px !important;
}
.skin-gray .sidebar-form input[type="text"]:focus,
.skin-gray .sidebar-form input[type="text"]:focus + .input-group-btn .btn {
  background-color: #fff;
  color: #666;
}
.skin-gray .sidebar-form input[type="text"]:focus + .input-group-btn .btn {
  border-left-color: #fff;
}
.skin-gray .sidebar-form .btn {
  color: #999;
  -webkit-border-top-left-radius: 0 !important;
  -webkit-border-top-right-radius: 2px !important;
  -webkit-border-bottom-right-radius: 2px !important;
  -webkit-border-bottom-left-radius: 0 !important;
  -moz-border-radius-topleft: 0 !important;
  -moz-border-radius-topright: 2px !important;
  -moz-border-radius-bottomright: 2px !important;
  -moz-border-radius-bottomleft: 0 !important;
  border-top-left-radius: 0 !important;
  border-top-right-radius: 2px !important;
  border-bottom-right-radius: 2px !important;
  border-bottom-left-radius: 0 !important;
}

/*-----26june----*/
.store-url { position:absolute; margin-top:1em; margin-left:2%;}
.links-heading {margin-left:1em; font-size:16px; text-transform:uppercase; font-weight:bold;}

/* @media screen and (max-width: 980px) {
     body > .header .navbar {
         margin-left: 0px!important;
     }
 }*/
 
/*------create store process------*/
.steps-box-hold {
	background:url(../images/steps-bg.gif);
/*	box-shadow: inset 0px 2px 7px -1px #ABABAB;
	-webkit-box-shadow: inset 0px 2px 7px -1px #ABABAB;
	-moz-box-shadow: inset 0px 2px 7px -1px #ABABAB;
	-o-box-shadow: inset 0px 2px 7px -1px #ABABAB;
*/	padding-bottom:1.5em;
	margin:0 auto;
	border-radius:2px;
	border-bottom:solid 2px #ddd;
	margin-left:0.2em;
	margin-top:-2.5em;
}
 
ol.store-create-process { margin:0 !important; padding:0!important; list-style:none;}
ol.store-create-process li { float:left; display:inline-block; margin-right:2px; padding-left:0px !important; padding-right:0px !important; text-align:center; line-height: 4em; font-size:11px; font-weight:400;}
ol.store-create-process[data-store-create-process-steps="2"] li { width: 49%; }
ol.store-create-process[data-store-create-process-steps="3"] li { width: 32%; }
ol.store-create-process[data-store-create-process-steps="4"] li { width: 24%; }
ol.store-create-process[data-store-create-process-steps="5"] li { width: 19%; }
ol.store-create-process[data-store-create-process-steps="6"] li { width: 16%; }
ol.store-create-process[data-store-create-process-steps="7"] li { width: 14%; }
ol.store-create-process[data-store-create-process-steps="8"] li { width: 12%; }
ol.store-create-process[data-store-create-process-steps="9"] li { width: 11%; }

ol.store-create-process8 li { width:12.2%; font-size:0.95em; text-align:center;}
ol.store-create-process8 li a { color:#333; padding-left:0.3em !important; font-size:12px;}
ol.store-create-process8 li a:hover { color:#3c8dbf; text-decoration:underline;}
ol.store-create-process8 li:before
{
	height: 2em !important;
    width: 2em !important;
	line-height: 2em!important;
	bottom: -5.1em!important;
	left: 42.5% !important;
	float:none !important;
	display:block!important;
	text-align:center !important;
}

@media screen and (max-width: 1024px) {
.steps-box-hold { margin-top:-2em;}
ol.store-create-process8 li { width:12%; font-size:0.75em; text-align:center;}
ol.store-create-process8 li a {font-size: 11px; color: #666;}
}

@media screen and (max-width: 768px) {
	body > .header .navbar .sidebar-toggle { float:left; margin-right:0.6em}
	.navbar-nav > .user-menu > .dropdown-menu { width: 100%;}

	body > .header .logo { background-color: #222a38;}
	body > .header .navbar, .navbar { background-color:#161e55; min-height: 35px;}
	body > .header .logo img { max-width:190px; padding:0.6em 0;max-height: 65px;}
	.content {}
	body > .header .navbar .sidebar-toggle {
	  padding: 5px 5px !important;
	  margin-top: 5px !important;
	}
	.user-footer a.btn-flat { display:block; width:100%; text-align:left; margin-bottom:0.2em}
	.skin-blue .navbar .sidebar-toggle:hover .icon-bar { background: #fff !important; }
	body > .header .navbar .nav > li.user > a, .nav > li > a {color: #fff;}
	.navbar .navbar-nav > li { float:right;}
	.navbar-nav > .user-menu > .dropdown-menu {
	  max-width: 280px;
	  z-index:99999 !important;
	  position:absolute !important;
	  left:-12%;
	  margin-top:5px;
	}
	.skin-blue .navbar .navbar-right > .nav { margin-right:0px !important; float:left; padding-left:1em}
	.navbar-nav > .user-menu > .dropdown-menu:after { left: 7.5%;}
	.navbar-nav > .user-menu > .dropdown-menu > li.user-header { padding: 5px 10px !important;}
	.navbar-nav { margin: 0px;}
	.navbar-nav > li > a { padding-top:8px; padding-bottom: 15px; font-size:12px;}
	.navbar .navbar-right { float: left; width:80%;}
	.content { margin-top:1em;}
}

ol.store-create-process li.store-create-process-done { color: #8bbc26; border-bottom: 4px solid yellowgreen;}
ol.store-create-process li.store-create-process-todo, ol.store-create-process li.store-create-process-active { color: silver; border-bottom: 4px solid silver;}
 ol.store-create-process li.store-create-process-active {border-bottom: 4px solid #518ecf;color: #518ecf;}
ol.store-create-process li:after { content: "\00a0\00a0";}
ol.store-create-process li:before {
    position: relative;
    bottom: -2.8em;
	float:left;
    line-height: 1em;
	left: 40.5% !important;
}
ol.store-create-process li.store-create-process-done:before {
    content: "\2713";
    color: white;
    background-color: yellowgreen;
    height: 2.4em;
    width: 2.4em;
    line-height: 2.4em;
    border: none;
    border-radius: 1.2em;
	font-weight:600;
	font-family:Georgia, "Times New Roman", Times, serif;
}
ol.store-create-process li.store-create-process-todo:before {
    content: "\039F";
    color: silver;
    background-color: #f5f4f4;
	border-radius: 1.2em;
	font-weight:600;
}
ol.store-create-process li.store-create-process-active:before {
   content: "\039F";
    color: #518ecf;
    background-color: #f5f4f4;
    font-size: 1.5em;
    bottom: -2.2em;
}
.btn-store-key {margin:0; padding:0; margin:0 auto; width:90%;}
.btn-store-key li {list-style:none;}
.btn-store-key li a {
	list-style:none;
    display:block;
    padding:7px 15px 7px 10px;
	border-radius:15px;
	text-align:center;
	border:dotted 1px #344870;
}
.btn-store-key li a i.fa {font-size:14px !important; padding-right:0.5em;}
.btn-store-key li a:hover {color:#fff;border:dotted 1px #344870;}
.arrow-indication:before {
	border-top: 13px solid transparent;
	border-bottom: 13px solid transparent; 
	border-right:13px solid #e8e8e8; 
	content: "";
	left: -10px;
	top:5px;
	position: absolute;
	z-index: 99;
}
.box-upload { background-color:#f7f7f7; border:dashed 1px #d2d2d2; padding:6px; text-align:center; min-height:45px;}
.box-upload-img { position:relative; text-align:center; border-radius:2px; margin-bottom:0.2em;}
.box-upload-img a {text-transform:uppercase; font-size:12px; line-height:20px; color:#c2c3c5;}
.box-upload-img a:hover {color:#3c8dbc;}
.box-upload-img span.image {background-color:#f0f0f0; display:block; font-size:5em; line-height:130px;}
.box-upload-img span.image > i {padding:0.3em 0; }
/*.box-upload-img span > img {max-width:150px; max-height:150px; }*/
.box-upload-img label.option {padding-right:0px !important; }
.btn-delete-image-hold {position:absolute; top:0px; right:0;z-index:9;}
.btn-delete-image-hold .fa {background-color:#666; padding:5px;}

.slimScrollRail {background-color:#bbb !important;}
.slimScrollBar {background-color:#ffffff !important; border-radius:3px !important; cursor:pointer; z-index:9999;width: 5px !important;}

/*----image crop popup box-----*/
.modal-header { border-radius:4px 4px 0 0}
.modal-content { background-color:#eee; padding-bottom:1em}
#divMainImage {float:left; padding-right:1em; margin-right:1em; border-right:solid 1px #ccc;}
#preview-pane {
  z-index: 2000;
  float:left;
  overflow:hidden;
}
#preview-pane .preview-container {
  width: 300px;
  height: 300px;
  overflow: hidden;
}
.modal.modal-wide .modal-dialog { width: 80%; max-width:1100px;}

/*-----order print*/
.order-heading { border-bottom:solid 3px #4a4a4a; text-align:center;}
.order-heading h3 { margin:0; font-size:20px; color:#4a4a4a; width:100%; position:absolute; margin-top:-12px; padding-right:40px;}
.order-heading h3 span { background-color:#fff; padding:0.1em 0.8em;}

/*------renew plan------*/
.price-box { padding:1.6em 2em; border:dotted 2px #3c8dbc;  float:right; margin-top:0.8em}
.price-box .plan-bigprice { font-size:4em; line-height:1em; font-weight:300; color:#3c8dbc;}
.price-box .plan-bigprice sup {font-size:14px; font-weight:400; vertical-align:middle; padding-bottom:20px;}
.price-box .plan-cut-price { color:#c41818;}
.price-box .plan-cut-price sup { padding-bottom:0px;}
.progress { border:solid 1px #ddd;}

.setting-tab ul { background-color:#fff; font-weight:400; border:solid 1px #e5e5e5; border-radius:3px; margin-bottom:2em;}
.setting-tab li { border-bottom:solid 1px #e5e5e5; padding:1.2em;}
.setting-tab p { font-weight:600;}
.setting-tab a { font-weight:600; color:#3c8dbc; line-height:25px;}
.setting-tab .btn-success, .setting-tab .btn-primary { color:#fff;}
.setting-tab a:hover { border-bottom:solid 1px #3c8dbc;}
.setting-tab li:last-child { border-bottom:none; border-radius:0 0 3px 3px;}
.setting-tab li:nth-child(odd) {
	background-color:#f8f8f8;
	text-transform:uppercase;
	padding:0.6em 1.2em;
	letter-spacing:2px;
	color:#000;
	font-weight:600;
	font-size:110%;
}
.setting-tab .form-group { margin-bottom: 5px; line-height:25px;}
.setting-tab ul ul { border:none;}
.setting-tab li li {padding:0;}
.setting-tab li li a { letter-spacing:0;}
.setting-tab li li:nth-child(odd) { text-transform:none; letter-spacing:0; padding:2px; background-color:#fff;}
.setting-tab li { position:relative;}
.setting-tab li div.disable-section:after { position:absolute; left:0; top:0; content:''; width:100%; height:100%;background-color:rgba(255, 255, 255, 0.276); z-index:999;}
.setting-tab li div.disable-section:before { position:absolute; left:50%; top:50%; content:'This Section is disabled'; z-index:999; margin-left:-50px;}

@media screen and (max-width: 1024px) {
	.modal.modal-wide .modal-dialog { width: 99%;}
	#divMainImage { padding-right:0.5em; margin-right:0.5em; }
}
@media screen and (max-width: 768px) {
	.right-side > .content-header { padding-top:2em; text-align:center;}
	.breadcrumb { display:none;}
	.jcrop-holder, #preview-pane { float:none; display:block;}
	.modal.modal-wide .modal-dialog { height:100%; display:block;}
	.price-box { float:none; display:block;   padding:1em; }
}
.panel-heading {padding:5px 10px;}
.panel-body { padding:10px;}

/*Shailesh Code */
.margintop5px { margin-top:5px;}
.margintop1em { margin-top:1em;}

.welcome { background-color:#EFEFEF;}
.welcome .panel-default { border:none;}
.welcome .home-icon { font-size:4em; color:#A3A3A3; }
.welcome .home-icon-green { font-size:2em; color:#96BF48; position:absolute; right:0px; top:-30px;}
.welcome .heading { font-size:1.4em;}
.welcome .info { line-height:1.5em; transition: transform 1.1s cubic-bezier(0.19, 1, 0.22, 1) 0s;}

.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

@-webkit-keyframes fade_in {
  from {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@keyframes fade_in {
  from {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

.fade_in {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}

@-webkit-keyframes slide_in_up {
  from {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    visibility: visible;
  }

  100% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slide_in_up {
  from {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    visibility: visible;
  }

  100% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.slide_in_up1 {
  -webkit-animation-name: slide_in_up;
  animation-name: slide_in_up;
  -webkit-animation-delay: 0.5s; /* Chrome, Safari, Opera */
  animation-delay: 0.5s;
}

.slide_in_up2 {
  -webkit-animation-name: slide_in_up;
  animation-name: slide_in_up;
  -webkit-animation-delay: 1s; /* Chrome, Safari, Opera */
  animation-delay: 1s;   
}

.slide_in_up3 {
  -webkit-animation-name: slide_in_up;
  animation-name: slide_in_up;
  -webkit-animation-delay: 1.5s; /* Chrome, Safari, Opera */
  animation-delay: 1.5s;
}

.slide_in_up4 {
  -webkit-animation-name: slide_in_up;
  animation-name: slide_in_up;
  -webkit-animation-delay: 2s; /* Chrome, Safari, Opera */
  animation-delay: 2s;
}

.slide_in_up5 {
  -webkit-animation-name: slide_in_up;
  animation-name: slide_in_up;
  -webkit-animation-delay: 2.5s; /* Chrome, Safari, Opera */
  animation-delay: 2.5s;
}

.slide_in_up6 {
  -webkit-animation-name: slide_in_up;
  animation-name: slide_in_up;
  -webkit-animation-delay: 3s; /* Chrome, Safari, Opera */
  animation-delay: 3s;
}

.dot-new:before {
   font-family: FontAwesome;
   content: "\f111";
   display: inline-block;
   padding-right: 5px;
   vertical-align: middle;
   color:#ccc;
   font-size:8px;
}
.green-dot:before { color:#16A765 ; /*#79bd21;*/}
.red-dot:before { color:#f56954;}
.blue-dot:before { color: #97BBCC;}
/*.blue-dot:before { color: #2aaad5;}*/
.yellow-dot:before { color:#ffc833;}

/*--- 23feb2016 --*/
	.callback-btn {
		font-size:14px;
		background-color:#602e0d;
		color:#fff;
		cursor:pointer;
		-webkit-transition: all 0.2s ease;
		-moz-transition: all 0.2s ease;
		-o-transition: all 0.2s ease;
		transition: all 0.2s ease;
		float: right;
		padding: 15px;
	}
	.callback-btn:hover { background-color:#344870;color:#fff;}
	.verification-modal .modal-content {border-radius:3px; padding:25px 20px 15px 20px; padding-top:8px; background-color:#fff;}
	.verification-modal .modal-header {text-align:center; padding-top:10px}
	.verification-modal .modal-footer {border:none; text-align:center; margin:0; padding-top:5px;}
	.verification-modal .control-label {text-align:left}
	.verification-modal .form-control {border-radius:0}
	.verification-modal .modal-body {padding-bottom:0}
	.verification-modal .modal-header .close { padding:8px; margin-top:-12px; margin-right:-12px;font-size: 35px;font-weight: 300;}

	.white-box-panel {
		padding:1.5em 1.7em;
		background-color:#fff;
		display:block;
		-webkit-box-shadow: 0px 0px 7px -4px rgba(0,0,0,0.55);
		-moz-box-shadow: 0px 0px 7px -4px rgba(0,0,0,0.55);
		box-shadow: 0px 0px 7px -4px rgba(0,0,0,0.55);
		border-radius:3px;
		-moz-border-radius:3px;
		-webkit-border-radius:3px;
		margin-top:0.3em;
		margin-bottom:1.8em;
	}
	.white-box-panel hr { margin:13px 0;}
	.white-box-panel label {}
	.white-box-panel table { margin-bottom:0;}
	.white-box-panel .button-del {position:absolute; top:13px; left:32px;}
	.white-box-panel .inputosaurus-container { width:100% !important;}

	@-webkit-keyframes bugfix {
		from {
			padding: 0
		}
		to {
			padding: 0
		}
	}
	.checkbox-btn,
	.radio-btn { position: relative; margin-bottom:0.4em;}
	.checkbox-btn input[type="checkbox"],
	.checkbox-btn input[type="radio"],
	.radio-btn input[type="checkbox"],
	.radio-btn input[type="radio"] {
		position: absolute;
		opacity: 0;
		z-index: 1
	}
	
	.checkbox-btn label,
	.radio-btn label {
		display: inline-block;
		line-height: 21px;
		vertical-align: middle;
		position: relative;
		padding-left: 28px;
		cursor: pointer;
		user-select: none;
		color: #424242
	}
	.checkbox-btn label::after,
	.radio-btn label::after {
		position: absolute;
		content: "";
		width: 20px;
		height: 20px;
		left: 0;
		top: 0;
		margin-left: 0px;
		background-color: white;
		border: 2px solid #007bff;
		-webkit-border-radius: 3px;
		border-radius: 3px;
		background-clip: padding-box;
		cursor: pointer
	}
	.checkbox-btn label::before,
	.radio-btn label::before {
		position: absolute;
		content: "";
		width: 10px;
		height: 5px;
		top: 7px;
		left: 5px;
		margin-left: 0px;
		border: 2px solid #007bff;
		border-top: none;
		border-right: none;
		background: transparent;
		-moz-transform: rotate(-45deg);
		-o-transform: rotate(-45deg);
		-ms-transform: rotate(-45deg);
		-webkit-transform: rotate(-45deg);
		transform: rotate(-45deg);
		opacity: 0;
		-webkit-transition: all 0.15s ease-in-out;
		-o-transition: all 0.15s ease-in-out;
		transition: all 0.15s ease-in-out;
		z-index: 1
	}
	.checkbox-btn label:active::before,
	.radio-btn label:active::before { opacity: 0.3}

	.checkbox-btn input[type="checkbox"]:checked+label,
	.checkbox-btn input[type="radio"]:checked+label,
	.radio-btn input[type="checkbox"]:checked+label,
	.radio-btn input[type="radio"]:checked+label {
		
	}
	.checkbox-btn input[type="checkbox"]:checked+label::after,
	.checkbox-btn input[type="radio"]:checked+label::after,
	.radio-btn input[type="checkbox"]:checked+label::after,
	.radio-btn input[type="radio"]:checked+label::after {
		border: 2px solid #007bff
	}
	.checkbox-btn input[type="checkbox"]:checked+label::before,
	.checkbox-btn input[type="radio"]:checked+label::before,
	.radio-btn input[type="checkbox"]:checked+label::before,
	.radio-btn input[type="radio"]:checked+label::before {
		opacity: 1
	}
	.checkbox-btn input[type="checkbox"]:disabled+label,
	.checkbox-btn input[type="radio"]:disabled+label,
	.radio-btn input[type="checkbox"]:disabled+label,
	.radio-btn input[type="radio"]:disabled+label {
		color: #787878;
		cursor: default;
	}
	.checkbox-btn input[type="checkbox"]:disabled+label::after,
	.checkbox-btn input[type="radio"]:disabled+label::after,
	.radio-btn input[type="checkbox"]:disabled+label::after,
	.radio-btn input[type="radio"]:disabled+label::after {
		border: 2px solid #ccc;
		background-color: #ffffff;
	}
	.checkbox-btn input[type="checkbox"]:disabled+label::before,
	.checkbox-btn input[type="radio"]:disabled+label::before,
	.radio-btn input[type="checkbox"]:disabled+label::before,
	.radio-btn input[type="radio"]:disabled+label::before {
		display: none;
	}
	
	.radio-btn label::after {
		-webkit-border-radius: 50%;
		border-radius: 50%;
		background-clip: padding-box;
	}
	
	.radio-btn label::before {
		width: 10px;
		height: 10px;
		border: none;
		top: 5px;
		left: 5px;
		-webkit-border-radius: 50%;
		border-radius: 50%;
		background-clip: padding-box;
		background-color: #007bff;
		-moz-transform: rotate(0deg);
		-o-transform: rotate(0deg);
		-ms-transform: rotate(0deg);
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	}
	.panel-default > .panel-heading {background-color: #fff;}

@media screen and (min-width: 769px) {
	.verification-modal .modal-dialog { max-width:500px;}
}
@media screen and (max-width: 768px) {
        body > .header .navbar { margin-left:0;}
        .navbar .navbar-right {width: 70%; float:none !important}
        .skin-blue .navbar .navbar-right > .nav {padding-left: 0.5em;}
        .navbar-nav > .user-menu > .dropdown-menu {
                    left: 5%;
                    margin-top: -4px;
                    width: 400px;
                    max-width:none;
        }
        .callback-btn { padding: 7px 15px;}
}
@media screen and (max-width: 767px) {
        body > .header .navbar .sidebar-toggle { float:left;}
        .navbar-nav > .user-menu > .dropdown-menu {
                width: 100%; min-width: 250px;margin-top: -6px;
        }
}
@media screen and (max-width: 640px) {
        .m-center { text-align:center}
        .language-tab > p > .h6 { text-align:center;}
}

@media screen and (max-width: 480px) {
    .white-box-panel {
            margin-left: -5px;
            margin-right: -5px;
            padding:15px;
    }
    .setting-tab h1 { margin-top:0;}
    .navbar-nav > .user-menu > .dropdown-menu {margin-top: 0;}
    .navbar-nav > .user-menu > .dropdown-menu::after {border-width: 7px;}
    .navbar-nav > li > a {font-size: 13px;}
    .skin-blue .navbar .sidebar-toggle .icon-bar {background: #ffffff;}
    .small-box {
        text-align: center;
        margin-left: -10px;
        margin-right: -10px;
    }
    .small-box h3 {font-size: 2em;}
    #canvas-holder { display:none;}
    .content {padding: 15px;}
    #divMainImage, #preview-pane { float:none; display:block; width:100%;}
}
@media screen and (max-width: 360px) {
    .navbar .navbar-right {width: 100%;}
    .navbar .navbar-nav > li.user-menu { background-color:#00a65a; border-radius:4px; margin-top: 2px;}
    .navbar-nav > li > a { padding:5px 10px;}
    #expand {margin-left: 5px;}
    .box-upload-img {
    margin-left: -10px;
    margin-right: -10px;}
}

.desc-table { border-left:solid 1px #ccc; border-top:solid 1px #ccc; display: table;}
        .tab-heading, .tab-row { display: table-row;}
        .tab-heading { display: table-row-group;}
        .tab-row .tab-cell, .tab-heading .tab-cell { display: table-cell;border-bottom:solid 1px #ccc; border-right: solid 1px #ccc; padding:0.4em;}
        .tab-heading div.tab-cell:first-child, .tab-row div.tab-cell:first-child.tab-cell { width: 200px;}
        .tab-heading .tab-cell, .tab-row div.tab-cell:first-child { font-weight: bold;background-color: #f8f8f8;}

        @media only screen and (max-width:480px){
            .desc-table,.tab-heading, .tab-row, .tab-row .tab-cell, .tab-heading .tab-cell { display: block; width: 100%;}
            .desc-table {border-bottom:solid 1px #ccc;}
            .tab-row div.tab-cell:first-child.tab-cell, .tab-row .tab-cell {width:auto; border-bottom: none;}
            .tab-heading .tab-cell, .tab-heading div.tab-cell:first-child, .tab-row div.tab-cell { padding:0.5em; width:auto;}
            .tab-heading, .tab-heading .tab-cell, .tab-heading div.tab-cell:first-child {display:flex; width:100%;}
}


.form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control {color:#444;}

/*  ==============================
    Custom Modal Box CSS Krishan
    ==============================*/
    .custom-modal .modal-content {border-radius:6px; padding-top:8px; background-color: #fff;color: #4c5d69;}
    .custom-modal .modal-title { color: #4c5d69; font-weight:600;}
    .custom-modal .modal-header { text-align:center; border:none; padding-bottom: 10px;}
    .custom-modal .modal-footer { border:none; text-align:center; margin:0; padding-top:5px;}
    .custom-modal .control-label { text-align:left}
    .custom-modal .form-control { border-radius:0}
    .custom-modal .modal-body { padding-top: 5px;}
    .custom-modal .modal-header .close { position: absolute; top:0; right:5px; width: 25px; padding:0; font-size: 2.8em; font-weight:300;}
    @media screen and (min-width: 769px) {
            .custom-modal .modal-dialog { max-width:330px;}
			body > .header .navbar{
				padding-left:13px;
			}
    }

    .select2-container-multi .select2-choices {z-index: 9;}
.rightpanel .form-control{
border-radius: 5px !important;}