.nav-side-menu {
	overflow: auto;
	font-family: verdana;
	font-size: 12px;
	font-weight: 200;
	background-color: #293744;
	position: absolute;
	top: -48px;
	width: 100%;
	height: 115%;
	color: #e1ffff;
	margin-top: 0px;
	left: 0px;
	top: 0px;
}

.nav-side-menu .brand {
	background-color: #23282e;
	line-height: 20px;
	display: block;
	text-align: center;
	font-size: 12px;
}

.nav-side-menu .toggle-btn {
	display: none;
}

.nav-side-menu ul, .nav-side-menu li {
	list-style: none;
	padding: 0px;
	margin: 0px;
	line-height: 35px;
	cursor: pointer;
	/*    
    .collapsed{
       .arrow:before{
                 font-family: FontAwesome;
                 content: "\f053";
                 display: inline-block;
                 padding-left:10px;
                 padding-right: 10px;
                 vertical-align: middle;
                 float:right;
            }
     }
*/
}

.nav-side-menu ul :not(collapsed) .arrow:before, .nav-side-menu li :not(collapsed) .arrow:before
	{
	font-family: FontAwesome;
	display: inline-block;
	padding-left: 10px;
	padding-right: 10px;
	vertical-align: middle;
	float: right;
}

.nav-side-menu ul .active, .nav-side-menu li .active {
	border-left: 3px solid #d19b3d;
	background-color: #4f5b69;
}

.nav-side-menu ul .sub-menu li.active, .nav-side-menu li .sub-menu li.active
	{
	color: #d19b3d;
}

.nav-side-menu ul .sub-menu li.active a, .nav-side-menu li .sub-menu li.active a
	{
	color: #d19b3d;
}

.nav-side-menu ul .sub-menu li, .nav-side-menu li .sub-menu li {
	background-color: #181c20;
	border: none;
	line-height: 28px;
	border-bottom: 1px solid #23282e;
	margin-left: 0px;
	padding-left: 35px;
}

.nav-side-menu ul .sub-menu li:hover, .nav-side-menu li .sub-menu li:hover
	{
	background-color: #020203;
}

.nav-side-menu ul .sub-menu li:before, .nav-side-menu li .sub-menu li:before
	{
	font-family: FontAwesome;
	display: inline-block;
	padding-left: 10px;
	padding-right: 10px;
	vertical-align: middle;
}

.nav-side-menu li {
	padding-left: 20px;
	border-left: 3px solid #2e353d;
	border-bottom: 1px solid #23282e;
}

.nav-side-menu li a {
	text-decoration: none;
	color: #e1ffff;
}

.nav-side-menu li a i {
	padding-left: 10px;
	width: 20px;
	padding-right: 20px;
}

.nav-side-menu li:hover {
	border-left: 3px solid #d19b3d;
	background-color: #4f5b69;
	-webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	-o-transition: all 1s ease;
	-ms-transition: all 1s ease;
	transition: all 1s ease;
}

@media ( max-width : 767px) {
	.nav-side-menu {
		position: relative;
		width: 100%;
		margin-bottom: 10px;
	}
	.nav-side-menu .toggle-btn {
		display: block;
		cursor: pointer;
		position: absolute;
		right: 10px;
		top: 10px;
		z-index: 10 !important;
		padding: 3px;
		background-color: #ffffff;
		color: #000;
		width: 40px;
		text-align: center;
		font-size: 22px;
	}
	.brand {
		text-align: left !important;
		font-size: 22px;
		padding-left: 20px;
		line-height: 50px !important;
	}
}

@media ( min-width : 767px) {
	.nav-side-menu .menu-list .menu-content {
		display: block;
	}
	#main {
		width: calc(100% - 300px);
		float: right;
	}
}

body {
	margin: 0px;
	padding: 0px;
}

.margin-top10 {
	margin-top: 10px;
}

.margin-top8 {
	margin-top: 8px;
}

.margin-top5 {
	margin-top: 5px;
}

.margin-top6 {
	margin-top: 6px;
}

.margin-top14 {
	margin-top: 14px;
}

.margin-top16 {
	margin-top: 16px;
}

.margin-top20 {
	margin-top: 20px;
}

.margin-top40 {
	margin-top: 40px;
}

.margin-top60 {
	margin-top: 60px;
}

.margin-top25 {
	margin-top: 25px;
}

.margin-top24 {
	margin-top: 24px;
}

.margin-top15 {
	margin-top: 15px;
}

.margin-right8 {
	margin-right: 8px;
}

.margin-right20 {
	margin-right: 20px;
}

.margin-left8 {
	margin-left: 8px;
}

.margin-right0 {
	margin-right: 0px;
}

.margin-left0 {
	margin-left: 0px;
}

.margin-left10 {
	margin-left: 10px;
}

.margin-top30 {
	margin-top: 30px;
}

.margin-top25 {
	margin-top: 25px;
}

.margin-bottom0 {
	margin-bottom: 0px !important;
}

.margin25 {
	margin: 25px !important;
}
.margin10per {
	margin: 10% !important;
}
.margin-header {
	margin-top: 25px;
	margin-right: 25px;
	margin-left: 70px;
	margin-bottom: 25px;
	color: #040708;
	font-weight: bold;
}

.margin5 {
	margin: 5px !important;
}

.margin50 {
	margin: 500px 0px !important;
}

.padding-left0 {
	padding-left: 0px !important;
}

.padding-left5 {
	padding-left: 5px !important;
}

.padding-left10 {
	padding-left: 10px !important;
}

.padding-left20 {
	padding-left: 20px !important;
}

.padding-right0 {
	padding-right: 0px !important;
}

.padding-right5 {
	padding-right: 5px !important;
}

.padding-left-right45 {
	padding-right: 45px !important;
	padding-left: 45px !important;
}

.padding0 {
	padding: 0px !important;
}

.padding1 {
	padding: 1px !important;
}

.padding5 {
	padding: 5px !important;
}

.padding10 {
	padding: 10px !important;
}

.height50 {
	height: 94px !important;
}

.height100 {
	height: 100px !important;
}

.margin-left264 {
	margin-left: 264px;
}

.height220 {
	height: 240px !important;
}

.height500 {
	height: 500px !important;
}

.width85per {
	width: 85% !important;
}

.width5per {
	width: 5% !important;
}

.width350 {
	width: 350px !important;
}

.menucolor {
	color: #9d9d9d;
}

a.menucolor:hover {
	color: #fff !important;
}

.label-color {
	color: #337abd;
}

label {
	font-size: 12px;
}

.alert-design {
	border: 1px solid;
	max-height: 350px;
	overflow: auto;
}

.text-overflow {
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
}

.blue {
	background-color: #54cae4 !important;
}

.blue-color {
	color: #54cae4 !important;
}

.white {
	background-color: #fff !important;
}

.grey {
	background-color: #ccc !important;
}

.dark-grey {
	background-color: #51565c !important;;
}

.color-white {
	color: #fff !important;
}

.color-black {
	color: #000 !important;
}
.fuchsia{
	background-color: #e0c7c8 !important;
}

.red {
	background-color: #d87f83 !important;
}

.panel-height-alert {
	overflow: scroll;
	width: auto;
	height: 150px;
	overflow-x: hidden;
}

.panel-color {
	background-color: #fff8d6;
}

.panel-height {
	overflow: scroll;
	width: auto;
	height: 150px;
	overflow-x: hidden;
}

.pagetitle-small {
	color: #000000;
	font-size: 1.5em;
	font-weight: bold;
	padding-top: 0.2em;
	padding-bottom: 0.2em;
	align: center;
}

#draggablePanelList .panel-heading {
	cursor: move;
}

.padding-top9 {
	padding-top: 9px !important;
}

.padding-bottom5 {
	padding-bottom: 5px !important;
}
.padding-bottom10 {
	padding-bottom: 10px !important;
}
.padding-top_per1 {
	padding-top: 1% !important;
}

.padding-top5 {
	padding-top: 5px !important;
}

.padding-top10 {
	padding-top: 10px !important;
}

.padding-top20 {
	padding-top: 20px !important;
}

.padding-top50 {
	padding-top: 50px !important;
}

.panel-style {
	overflow: scroll;
	height: 200px;
}

.width-100-per {
	width: 100%;
}

.section.active, .section.active:focus, .section.active:hover {
	z-index: 2;
	color: #ccc;
	background-color: #337ab7;
	border-color: #337ab7;
}

.section:first-child {
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;
}

.section {
	position: relative;
	display: block;
	padding: 10px 15px;
	margin-bottom: -1px;
	background-color: #fff;
	border: 1px solid #ddd;
	width: 30%;
}

.section-table {
	height: 216px;
	overflow: auto;
}

@media only screen and (max-width: 766px) {
	.menu-height {
		min-height: 0px;
	}
	.header-height {
		height: 0%;
	}
}

@media only screen and (min-width: 767px) {
	.menu-height {
		min-height: 500px;
	}
	.header-height {
		height: 60px;
	}
}

.header-resize {
	display: -webkit-inline-box !important;
}

.search-bar {
	padding-top: 5px;
}

.item-label {
	padding-right: 5px;
	padding-left: 5px
}

.menu-icon {
	float: right;
	padding-top: 10px;
	padding-right: 10px;
}

.modal-wide .modal-dialog {
	width: 80%;
}

.modal-wide .modal-body {
	overflow-y: auto;
}

.disabled {
	background-color: #eeeeee;
	cursor: not-allowed !important;
}

.colorRed {
	color: red;
}

.colorYellow {
	color: yellow;
}

.colorGreen {
	color: #00acac;
}

.center-align {
	text-align: center;
}

.left-align {
	text-align: left;
}

.margin0 {
	margin: 0px !important;
}

/* ************************************** */
.wrapper96 {
	width: 96%
}

.wrapper76 {
	width: 76%
}

#sidebar-wrapper {
	margin-right: -250px;
	right: 0;
	width: 250px;
	background: rgb(0, 0, 0);
	position: fixed;
	min-height: 50%;
	overflow-y: auto;
	z-index: 1000;
	transition: all 0.5s ease-in 0s;
	-webkit-transition: all 0.5s ease-in 0s;
	-moz-transition: all 0.5s ease-in 0s;
	-ms-transition: all 0.5s ease-in 0s;
	-o-transition: all 0.5s ease-in 0s;
}

.sidebar-nav {
	position: absolute;
	top: 0;
	width: 250px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.sidebar-nav li a {
	color: #999999;
	display: block;
	text-decoration: none;
}

.sidebar-nav li a:hover {
	color: #fff;
	background: rgba(255, 255, 255, 0.2);
	text-decoration: none;
}

.sidebar-nav li a:active, .sidebar-nav li a:focus {
	text-decoration: none;
}

.sidebar-nav>.sidebar-brand {
	height: 55px;
	line-height: 55px;
	font-size: 18px;
}

.sidebar-nav>.sidebar-brand a {
	color: #999999;
}

.sidebar-nav>.sidebar-brand a:hover {
	color: #fff;
	background: none;
}

#menu-toggle {
	top: 0;
	right: 0;
	position: fixed;
	z-index: 1;
}

#sidebar-wrapper.active {
	right: 250px;
	width: 250px;
	transition: all 0.5s ease-out 0s;
	-webkit-transition: all 0.5s ease-out 0s;
	-moz-transition: all 0.5s ease-out 0s;
	-ms-transition: all 0.5s ease-out 0s;
	-o-transition: all 0.5s ease-out 0s;
}

.toggle {
	margin: 5px 5px 0 0;
}

/* Horizontal Sortable */
.hthumbnail[jqyoui-droppable] {
	border: 1px solid red;
}

.hthumbnail {
	height: 50px;
	width: 50px;
	text-align: center;
	padding-top: 0px;
	cursor: pointer;
	background: rgb(182, 173, 123);
	position: relative;
	-webkit-transition: none;
	transition: none;
}

.hthumbnail.ng-leave {
	-webkit-transition-duration: 0s;
	transition-duration: 0s;
	opacity: 1;
}

.hthumbnail.ng-leave.ng-leave-active {
	opacity: 0;
}

.hthumbnail.ng-enter {
	-webkit-transition: left 0.3s;
	transition: left 0.3s;
}

.hthumbnail.ng-enter[data-direction="left"] {
	left: -80px; /* 60px width + 20px marginLeft */
}

.hthumbnail.ng-enter[data-direction="right"] {
	left: 80px; /* 60px width + 20px marginLeft */
}

.hthumbnail.ng-enter.ng-enter-active {
	left: 0px;
}

/* Vertical Sortable */
.vthumbnail[jqyoui-droppable] {
	border: 1px solid red;
}

.vthumbnail {
	/* height: 50px;
	width: 50px; */
	text-align: center;
	padding-top: 0px;
	cursor: pointer;
	background: rgba(90, 85, 14, 0.19);
	position: relative;
	-webkit-transition: none;
	transition: none;
	float: none !important;
}

.vthumbnail.ng-leave {
	-webkit-transition-duration: 0s;
	transition-duration: 0s;
	opacity: 1;
}

.vthumbnail.ng-leave.ng-leave-active {
	opacity: 0;
}

.vthumbnail.ng-enter {
	-webkit-transition: top 0.3s;
	transition: top 0.3s;
}

.vthumbnail.ng-enter[data-direction="left"] {
	top: -76px; /* 56px width + 20px marginBottom */
}

.vthumbnail.ng-enter[data-direction="right"] {
	top: 76px; /* 56px width + 20px marginBottom */
}

.vthumbnail.ng-enter.ng-enter-active {
	top: 0px;
}

.state-icon {
	left: -5px;
}

.list-group-item-primary {
	color: rgb(255, 255, 255);
	background-color: rgb(66, 139, 202);
}

/* DEMO ONLY - REMOVES UNWANTED MARGIN */
.well .list-group {
	margin-bottom: 0px;
}

.border1px {
	border: solid 1px;
}

.thinRow td {
	padding-top: 5px !important;
	padding-bottom: 0px !important;
	padding-left: 0px !important;
	padding-right: 0px !important;
	border: 0px !important;
	font-weight: bold;
}

.thinRow-bold td {
	padding: 0px !important;
	border: solid 1px !important;
	font-weight: bold;
}

.thinRow-bold td {
	padding-top: 5px !important;
	padding-bottom: 0px !important;
	padding-left: 0px !important;
	padding-right: 0px !important;
	border: solid 1px !important;
	font-weight: bold;
}

.thinRow2 td {
	padding: 2px !important;
	border: solid 1px !important;
}

.text-align-left {
	text-align: left
}

.text-align-right {
	text-align: right
}

.text-align-center {
	text-align: center
}

.thumbnails {
	padding: 0px;
}

.block {
	margin-left: 20px;
	border: solid 2px;
	background-color: #d8d8d8;
}

.block2 {
	margin-left: 30px;
	border: solid 2px;
	background-color: #d8d8d8;
	min-height: 124px;
}

.font-size14 {
	font-size: 14px;
}

.font-size12 {
	font-size: 12px;
}

.popover {
	max-width: 100%;
}

.tableBodyScroll {
	display: block;
	max-height: 100px;
	overflow-y: scroll;
}

.tableHeadScroll {
	display: table;
	width: 100%;
	table-layout: fixed;
}

.scrollit {
	overflow-y: auto;
	height: 100px;
}

.padding-left-right5 {
	padding-left: 10px;
	padding-right: 10px;
}

.font-size12 {
	font-size: 12px;
}
.font-size11 {
	font-size: 11px;
}
.uib-datepicker-popup.dropdown-menu {
	display: block;
	float: none;
	margin: 0;
	width: 120%;
}

.display-none {
	display: none !important;
}

.display-block {
	display: block !important;
}

.buyOrder {
	color: #14c314;
	font-size: 14px;
	font-family: serif;
	cursor: pointer;
}

.sellOrder {
	color: #e40909;
	font-size: 14px;
	font-family: serif;
	cursor: pointer;
}
.mBuySession
{
    color: #20d302;
    cursor: pointer;
}
.mSellSession
{
    color: #0479fc;
    cursor: pointer;
}

.buySession
{
    color: #20d302;
    cursor: pointer;
}
.sellSession
{
    color: #0479fc;
    cursor: pointer;
}

.divider
{
    color: #696a69;
    padding: 0px 2px 0px 2px;
}
.btnHeight25{
	height:25px
}

.height48{
	height : 48px;
}
.beautify{
	width:800px !important;
}
.gridHeight{
	height:400px !important;
}
.min-width500{
	min-width:500px !important;
}
.font-size10 {
	font-size: 10px;
}
.scrollbar {
	overflow-y: scroll;
    max-height: 400px;
}
.overflow{
	overflow-wrap : break-word;
	white-space: normal;
	
}
.text:hover{
	background-color: #e2dfdf;
	cursor: pointer;
}

@media only screen and (max-width: 600px) {
    body {
        background-color: lightblue;
    }
}

@media (min-height: 900px) {
  .grid {
    height: 615px;
  }