@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=My+Soul&display=swap');


td,th {
	cursor:pointer;
	text-shadow: var(--text-shadow);
}
td[lt],th[lt],tr[lt],.lt {
	text-align: left;
	vertical-align:top;
}
td[rt],th[rt],tr[rt],.rt {
	text-align: right;
	vertical-align:top;
}
td[l],th[l],tr[l],.l {
	text-align: left;	
}
td[lc],th[lc],tr[lc],.lc {
	text-align: left;	
	vertical-align:center;
}
td[cc],th[cc],tr[cc],.cc {
	text-align: center;	
	vertical-align:center;
}
td[ct],th[ct],tr[ct],.ct {
	text-align: center;	
	vertical-align:top;
}
td[rc],th[rc],tr[rc],.rc {
	text-align: right;	
	vertical-align:center;
}

body {
	margin: 1px;
	height: 100vh;
	font-family: "Poppins", sans-serif;
	color: #3f4750;
	font-size: 0.9rem;
	background: var(--bg-strongest);
	color:var(--font-color);
	text-decoration: none;	
	color:var(--font-color);
	text-decoration: none;	
	text-shadow:var(--text-shadow);
	
	
}
.Frame2 {
	border:2px solid var(--bg-weak);
	border-radius:15px;
	
	padding:5px;
	font-size:16px;
	box-shadow: 3px 3px 2px rgba(var(--bg-strongest-rgb), 0.55),
				6px 6px 4px rgba(var(--bg-strongest-rgb), 0.75);
}
.Frame {  
  background-color: var(--bg-stronger);
  border:1px solid var(--bg-stronger);
  box-shadow: inset 6px 6px 10px 0 rgba(0, 0, 0, 0.7),inset -5px -5px 10px -3px rgba(74, 66, 66, 0.25); 
  border-radius: 15px;   
  padding : 10px 9px 8px 10px; /*T R B L*/
}

.layout {
  z-index: 1;  
}
.layout .header {
  display: flex;
  align-items: center;
  padding: 20px;
  
}
.layout .content {
  padding: 5px 5px;
  display: flex;
  flex-direction: column;
  border:0px solid red;/*var(--bg-strongest);						/*---------------------------------------------------------------- A1*/
  border-radius:20px;
  margin-left:0px;
  background: var(--bg);
  background: var(--bg-strongesst);
}
.layout .footer {
  text-align: center;
  margin-top: auto;
  margin-bottom: 20px;
  padding: 20px;
}

.sidebar {
  color: #7d84ab;
  overflow-x: hidden !important;
  position: relative;
  border:3px solid var(--menu-bg);/*var(--bg-strongest);						/*---------------------------------------------------------------- A2*/
  border-radius:10px;
}

.sidebar:hover::-webkit-scrollbar-thumb {
  background-color: blue;
}
.sidebar::-webkit-scrollbar {
  width: 0px;
}

.sidebar .image-wrapper {
  overflow: hidden;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1;
  display: none;
}
.sidebar .image-wrapper > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.sidebar.has-bg-image .image-wrapper {
  display: block;
}



.sidebar .sidebar-layout .sidebar-header {
  height: 80px;
  -webkit-user-select: none; /* Safari */
  -ms-user-select: none; /* IE 10 and IE 11 */
  user-select: none; /* Standard syntax */
  min-height: 50px;
  display: flex;
  align-items: center;
  padding: 0 20px;
  cursor:pointer;
}
.sidebar .sidebar-layout .sidebar-header > span {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.sidebar .sidebar-layout .sidebar-content {
  flex-grow: 1;
  padding: 10px 0;
  height: 85vh;
}

.sidebar .sidebar-layout .sidebar-footer {
  height: 130px;
  min-height: 130px;
  display: flex;
  align-items: center;
  padding: 0 20px;
}
.sidebar .sidebar-layout .sidebar-footer > span {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

@keyframes swing {
  0%, 30%, 50%, 70%, 100% {
    transform: rotate(0deg);
  }
  10% {
    transform: rotate(10deg);
  }
  40% {
    transform: rotate(-10deg);
  }
  60% {
    transform: rotate(5deg);
  }
  80% {
    transform: rotate(-5deg);
  }
}

@keyframes bounceIn {
  85% {
    transform: scale(0.85);
  }
  100% {
    transform: scale(1);
  }
}
.layout .sidebar .menu ul {
  list-style-type: none;
  padding: 0;
  margin: 0;
  -webkit-user-select: none; /* Safari */
  -ms-user-select: none; /* IE 10 and IE 11 */
  user-select: none; /* Standard syntax */
}
#btn-collapse > i{
	text-shadow:none;
}
.layout .sidebar .menu .menu-header {
  font-weight: 800;
  padding: 20px 15px 10px 30px;
  color:var(--menu-font-color);
  font-size: 0.8em;
  letter-spacing: 2px;
  transition: opacity 3s;
  opacity: 15;
  text-shadow:var(--menu-text-shadow);
  text-overflow: ellipsis;
  white-space: nowrap;
}
/* status menu hto/news/ not hot*/
.layout .sidebar .menu .menu-item a {
  display: flex;
  align-items: center;
  height: 40px;
  padding: 0 20px;
  color: white;/*var(--font-color);											/*================================= Menu Item Header*/
  text-shadow:var(--menu-text-shadow);
  font-size: 15px;
}
/*menu closed sub Menu*/

.sidebar.collapsed .sidebar-layout > .sidebar-header {
	
	margin-left:-15px;
}
	
.layout .sidebar.collapsed .menu > ul > .menu-item.sub-menu > .sub-menu-list {
  /*transition: none !important;*/
  width: 220px;
  margin-left: 3px !important;  
  border-radius: 0px 15px 15px 0px;
  display: block !important;
  transition: all 0.1s ease;/*------------------------------------------------------------------------------------------------*/  
  background:var(--menu-bg);/*var(--bg-strongest);**********************************************************************************************/
}

/**MENU SMALL ->SUB Menu Header/INFO MENU*/
.layout .sidebar.collapsed > div.sidebar-layout > div.sidebar-content > nav > ul > li > div > ul > li:nth-child(1) {
	height:60px;
	display:block;
	margin-left:5px !important;
	background:var(--sub-menu-title-bg);/*#288e9c;/*var(--bg-strongest);*********************************************************************************************************/
	cursor:not-allowed;
}
.layout .sidebar.collapsed > div.sidebar-layout > div.sidebar-content > nav > ul > li > div > ul > li:nth-child(1):hover {
	border:none;
	background:var(--sub-menu-title-bg);
	cursor:not-allowed;
}
.sidebar > div.sidebar-layout > div.sidebar-content > nav > ul > li > div > ul > li{
	background:var(--menu-bg);/*var(--bg-stronger);******************************************************************************************/
}
.layout .sidebar.collapsed > div.sidebar-layout > div.sidebar-content > nav > ul > li:hover {
	Border:1px solid white;
	border-radius:15px !important;
	background:var(--bg-strongest);	/**************************************************************************************************/
}
/*Large Menu > Submenu > Submenu*/
.sidebar > div.sidebar-layout > div.sidebar-content > nav > ul > li > div > ul > li.menu-item.sub-menu.open:hover {
	border:1px solid white;
	border-radius:8px;
	background: transparent;/*var(--bg-stronger);**********************************************************************************/
}
.sidebar > div.sidebar-layout > div.sidebar-content > nav > ul > li.menu-item.sub-menu.open {
	/*background:red;/*var(--menu-bg-stronger);/*var(--bg-stronger);************************************************************************************/
	border:1px solid var(--bg-strongest);
	border-radius:10px;
}
.sidebar > div.sidebar-layout > div.sidebar-content > nav > ul > li.menu-item:hover {
	background :var(--menu-bg-2nd-submenu);/*var(--bg-strongest);*******************************************************************************************/
	border:1px solid var(--menu-font-color);
	border-radius:25px;
}
.layout .sidebar.collapsed > div.sidebar-layout > div.sidebar-content > nav > ul > li > div > ul > li:hover{
	color:blue;
	border:1px solid white;
	border-left-color:transparent;
	border-right-color:transparent;
	background:var(--bg-strongest);	/******************************************************************************/
}
.sidebar > div.sidebar-layout > div.sidebar-content > nav > ul > li > div > ul > li.menu-item.sub-menu.open > div > ul > li:hover {
	border:1px solid white;
	border-radius:0px !important;
	border-left-color:transparent;
	border-right-color:transparent;
	background:var(--bg-strongest);
}
/**MENU SMALL ->2nd SUB Menu/*/
.layout .sidebar.collapsed > div.sidebar-layout > div.sidebar-content > nav > ul > li > div > ul > li.menu-item.sub-menu.open:hover {
	border:1px solid white;
	border-bottom-left-radius:0px;
	background: var(--menu-bg-2nd-submenu);/*brown;/*var(--bg-strongest);******************************************************************************************************/
}

.layout .sidebar .menu .menu-item a .menu-icon {
  font-size: 1.2rem;
  width: 35px;
  min-width: 35px;
  height: 45px;
  line-height: 35px;
  text-align: center;
  display: inline-block;
  margin-right: 10px;
  border-radius: 2px;
  transition: color 0.3s;
}
.layout .sidebar .menu .menu-item a .menu-icon i {
  display: inline-block;
}
.layout .sidebar .menu .menu-item a .menu-title.H {
	font-weight:500	
}
.layout .sidebar .menu .menu-item a .menu-title tr td {
	color:var(--menu-font-color);
	text-shadow:var(--menu-text-shadow);
}
.layout .sidebar .menu .menu-item a .menu-title table {
	margin-left:-7px;
}
.layout .sidebar.collapsed .menu .menu-item a .menu-title.H {
	padding-top:auto;
	padding-bottom:auto;
}
.layout .sidebar.collapsed .menu .menu-item a .menu-title.H.single {
	cursor:pointer;	
	padding-top:33px;
	
}


/*.layout .sidebar.collapsed >*/
.layout .sidebar .menu .menu-item a .menu-title.H.single:hover {
	-webkit-mask-image: linear-gradient(-75deg, rgba(0,0,0,.6) 30%, #000 50%, rgba(0,0,0,.6) 70%);
  -webkit-mask-size: 200%;
  animation: shine 2s infinite;
}
/* menu full - sub menu*/
.layout .sidebar .menu .menu-item a .menu-title {
  font-size: 18px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  flex-grow: 1;
  transition: color 0.3s;
}
.layout .sidebar .menu .menu-item a .menu-prefix,.layout .sidebar .menu .menu-item a .menu-suffix {
  display: inline-block;
  padding: 5px;
  opacity: 1;
  transition: opacity 0.3s;
}

.layout .sidebar .menu .menu-item a:hover {
	
}


.layout .sidebar .menu .menu-item.sub-menu {
  position: relative;
}
.layout .sidebar .menu .menu-item.sub-menu > a::after {
  content: "";
  transition: transform 0.5s;
  border-right: 2px solid currentcolor;
  border-bottom: 2px solid currentcolor; 
  width: 8px;
  height: 8px;
  transform: rotate(-45deg);
}
.layout .sidebar .menu .menu-item.sub-menu.single > a::after {
	content: "";
	border:none;
}
.layout .sidebar.toggled.collapsed .menu .menu-item.sub-menu {
  border-radius:25px;
}
.layout .sidebar .menu .menu-item.sub-menu.open > a::after {
  transform: rotate(45deg);
}
.layout .sidebar .menu.icon-shape-circle .menu-item a .menu-icon, .layout .sidebar .menu.icon-shape-rounded .menu-item a .menu-icon, .layout .sidebar .menu.icon-shape-square .menu-item a .menu-icon {
  background-color: #0b1a2c;
}
.layout .sidebar .menu.icon-shape-circle .menu-item a .menu-icon {
  border-radius: 50%;
}
.layout .sidebar .menu.icon-shape-rounded .menu-item a .menu-icon {
  border-radius: 4px;
}
.layout .sidebar .menu.icon-shape-square .menu-item a .menu-icon {
  border-radius: 0;
}
.layout .sidebar:not(.collapsed) .menu > ul > .menu-item.sub-menu > .sub-menu-list {
  visibility: visible !important;
  position: static !important;
  transform: translate(0, 0) !important;
}
.layout .sidebar.collapsed .menu > ul > .menu-header {
  opacity: 0;
}
.layout .sidebar.collapsed .menu > ul > .menu-item > a .menu-prefix,
.layout .sidebar.collapsed .menu > ul > .menu-item > a .menu-suffix {
  opacity: 0;
}
.layout .sidebar.collapsed .menu > ul > .menu-item.sub-menu > a::after {
  content: "";
  width: 0px;
  height: 0px;
  background-color: yellow;/*currentcolor;*/
  border-radius: 50%;
  display: inline-block;
  position: absolute;
  right: 10px;
  top: 50%;
  border: none;
  transform: translateY(-50%);
}
.layout .sidebar.collapsed .menu > ul > .menu-item.active > a::after {
  background-color: #dee2ec;
  background-color: yellow;
}
.layout .sidebar.has-bg-image .menu.icon-shape-circle .menu-item a .menu-icon, .layout .sidebar.has-bg-image .menu.icon-shape-rounded .menu-item a .menu-icon, .layout .sidebar.has-bg-image .menu.icon-shape-square .menu-item a .menu-icon {
  background-color: rgba(11, 26, 44, 0.6);
}
.layout .sidebar.has-bg-image:not(.collapsed) .menu > ul > .sub-menu > .sub-menu-list {
  background-color: rgba(11, 26, 44, 0.6);
}
.layout.rtl .sidebar .menu .menu-item a .menu-icon {
  margin-left: 10px;
  margin-right: 0;
}
.layout.rtl .sidebar .menu .menu-item.sub-menu > a::after {
  transform: rotate(135deg);
}
.layout.rtl .sidebar .menu .menu-item.sub-menu > .sub-menu-list {
  padding-left: 0;
  padding-right: 20px;
}
.layout.rtl .sidebar .menu .menu-item.sub-menu.open > a::after {
  transform: rotate(45deg);
}
.layout.rtl .sidebar.collapsed .menu > ul > .menu-item.sub-menu a::after {
  right: auto;
  left: 10px;
}
.layout.rtl .sidebar.collapsed .menu > ul > .menu-item.sub-menu > .sub-menu-list {
  margin-left: -3px !important;
}

* {
  box-sizing: border-box;
  font-family: "Poppins", sans-serif;
}

a {
  text-decoration: none;
}

@media (max-width: 992px) {
  #btn-collapse {
    /*display: none;*/
  }
}

.sidebar > div.sidebar-layout > div.sidebar-header > div > div.sub-header{
  color: red;
  font-size: 10px;
  height: 10px;
  min-height: 10px;
  display: block;
  align-items: left;
  justify-content: left;
  border-radius: none;
  color: var(--font-color);
  font-weight: 700;  
  margin-right: 10px;
}
.layout .sidebar .pro-sidebar-logo {
  display: flex;
  align-items: center;
}
.layout .sidebar .pro-sidebar-logo .logo{
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  color: var(--font-color);
  font-size: 26px;
  font-weight: 700;
  background-color: #26786c;
  border:2px solid white;
  margin-right: 10px;
  padding-right:9px;
  padding-bottom:4px;
  padding-left:5px;
  font-family: "My Soul", cursive;
  box-shadow: 2px 2px 4px #0c1e35;
}
.layout .sidebar .pro-sidebar-logo .organization {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: 20px;
  line-height: 35px;
  transition: opacity 0.3s;
  opacity: 1;
  color:var(--font-color);
  text-shadow: var(--text-shadow);
}
.layout .sidebar .pro-sidebar-logo .organization .title {  
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: 22px;  
  transition: opacity 0.3s;
  opacity: 1;  
  position:relative;
  top:-9px;  
  text-align:left;
  color		: var(--menu-font-color);
  text-shadow	: var(--menu-text-shadow)
}  

.layout .sidebar .pro-sidebar-logo .organization .description {
	white-space: nowrap;
	text-overflow: ellipsis;
	font-size: 13px;
	line-height: 13px;
	transition: opacity 0.3s;
	opacity: 1;  
	position:relative;
	top:-14px;
	color		: var(--menu-font-color);
	text-shadow	: var(--menu-text-shadow)
} 
.sidebar > div.sidebar-layout > div.sidebar-content > nav > ul > li > a > span.menu-icon > i{
	padding-top: 5px;
}
.sidebar.collapsed > div.sidebar-layout > div.sidebar-content > nav > ul > li > a > span.menu-icon > i{
	padding-top: 5px;
	padding-right: 8px;
}

.layout .sidebar.collapsed .pro-sidebar-logo .organization {
  opacity: 0;
}


.layout .sidebar .footer-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-size: 0.8em;
  padding: 20px 0;
  border-radius: 8px;
  width: 180px;
  min-width: 190px;
  margin: 0 auto;
  background-color: #162d4a;
}
.layout .sidebar .footer-box img.react-logo {
  width: 40px;
  height: 40px;
  margin-bottom: 10px;
}
.layout .sidebar .footer-box a {
  color: #fff;
  font-weight: 600;
  margin-bottom: 10px;
}
.layout .sidebar .sidebar-collapser {
  transition: left, right, 0.3s;
  position: fixed;
  left: 260px;
  top: 35px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background-color: #00829f;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  justify-content: center;
  font-size: 1.2em;
  transform: translateX(50%);
  z-index: 111;
  cursor: pointer;
  color: white;
  box-shadow: 1px 1px 4px #0c1e35;
}

.layout .sidebar.collapsed .pro-sidebar-logo > h5 {
  opacity: 0;
}
.layout .sidebar.collapsed .footer-box {
  display: none;
}
.layout .sidebar.collapsed .sidebar-collapser {
  left: 60px;
}
.layout .sidebar.collapsed .sidebar-collapser i {
  transform: rotate(180deg);
}

.badge {
  display: inline-block;
  padding: 0.35em 0.4em;
  font-size: 75%;
  font-weight: 700;
  line-height: 1;
  text-align: center;
  white-space: nowrap;
  vertical-align: baseline;
  border-radius: 0.25rem;
  color: #fff;
  background-color: #6c757d;
  text-shadow:none;
}
.badge.primary {
  background-color: #ab2dff;
}
.badge.secondary {
  background-color: #079b0b;
}

.sidebar-toggler {
  position: fixed;
  right: 20px;
  top: 20px;
}

.social-links a {
  margin: 0 10px;
  color: #3f4750;
}

.sidebar > div.sidebar-layout > div.sidebar-content > nav > ul > li > div > ul > li.menu-item.sub-menu > div > ul > li > a > span {
	font-size:14px;
}
.sidebar> div.sidebar-layout > div.sidebar-content > nav > ul > li > div > ul > li:nth-child(1) {
	display:none;
}
.sidebar > div.sidebar-layout > div.sidebar-content > nav > ul{
	height:85vh;
	overflow-y:scroll;
}

.sidebar .sidebar-layout {
  height: auto;
  height:95vh;
  min-height: 100%;
  display: flex;
  flex-direction: column;
  position: relative;
  background: var(--menu-bg);/*var(--bg-strongest);*/
  z-index: 2;  
}

.sidebar > div.sidebar-layout > div.sidebar-content > nav > ul {
	scrollbar-width: none;
}
.sidebar > div.sidebar-layout > div.sidebar-content > nav > ul::-webkit-scrollbar {
    width: 0px;
}
.sidebar > div.sidebar-layout > div.sidebar-content > nav > ul > li.menu-item.sub-menu > div > ul > li{
	padding-bottom:-10px;
}
.sidebar > div.sidebar-layout > div.sidebar-content > nav > ul > li{
	margin-bottom:3px;
}
.sidebar > div.sidebar-layout > div.sidebar-content > nav > ul > li > a > span.menu-title {
	font-size:20px;	
}
.sidebar > div.sidebar-layout > div.sidebar-content > nav > ul > li.menu-item.sub-menu > div > ul > li > a > span{
	font-size:16px;
}

.sidebar > div.sidebar-layout > div.sidebar-content > nav > ul > li.menu-item.sub-menu.open > div > ul > li > a {
	padding-left:65px;
}

.sidebar > div.sidebar-layout > div.sidebar-content > nav > ul > li.menu-item.sub-menu.open > div > ul > li.menu-item.sub-menu.open > div > ul > li > a > div {
	padding-left:65px;
	font-size:16px;
	vertical-align: middle;
    display:inline-block;
}
.sidebar > div.sidebar-layout > div.sidebar-content > nav > ul > li.menu-item.sub-menu.open > div > ul > li.menu-item.sub-menu.open > div > ul > li > a > div table tr td:first-child {
	padding-left:5px;
	padding-right:5px;
}
.sidebar > div.sidebar-layout > div.sidebar-content > nav > ul > li.menu-item.sub-menu.open > div > ul > li.menu-item.sub-menu.open > div > ul > li > a > div table tr td:last-child {
	width:140px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	display:block;
	vertical-align:center;
	padding-top:4px
}
.sidebar > div.sidebar-layout > div.sidebar-content > nav > ul > li.menu-item.sub-menu.open > div > ul > li.menu-item.sub-menu.open > div > ul > li > a > div table tr td {
	color:var(--menu-font-color);
	text-shadow:var(--menu-text-shadow);
}


.layout .sidebar.collapsed > div.sidebar-layout > div.sidebar-content > nav > ul > li > div > ul > li > div > ul > li > a > div table {
	padding-left:15px;
}
.layout .sidebar.collapsed > div.sidebar-layout > div.sidebar-content > nav > ul > li > div > ul > li > div > ul > li > a:hover {
	border:none;
	background:transparent;
}
.layout .sidebar.collapsed > div.sidebar-layout > div.sidebar-content > nav > ul > li > div > ul > li > div > ul > li > * {
	border:none;
	background:transparent;
}

li.menu-item.sub-menu.open > div > ul > li > a > div table tr td{
	
	color:var(--menu-font-color);
	text-shadow:var(--menu-text-shadow);
}

.sidebar > div.sidebar-layout > div.sidebar-content > nav > ul > li.menu-item.sub-menu.open
.sidebar > div.sidebar-layout > div.sidebar-content > nav > ul > li > div > ul > li > a:hover {
	color:red;
}
/*.sidebar > div.sidebar-layout > div.sidebar-content > nav > ul > li.menu-item.sub-menu.open > a > span.menu-icon{
	color:var(--bg-strongest);
	color:green;
}*/
.sidebar > div.sidebar-layout > div.sidebar-content > nav > ul > li.menu-item.sub-menu > a:hover {
	color:#00ffee;
}
.sidebar > div.sidebar-layout > div.sidebar-content > nav > ul > li.menu-item.sub-menu.open > a {
	color:#00ffee;
}
.layout .sidebar .menu .menu-item a:hover .menu-icon i,.layout .sidebar .menu .menu-item.sub-menu a:hover .menu-title.H {
	animation:  bounceIn ease-in-out 0.25s 1 forwards;
}

.sidebar > div.sidebar-layout > div.sidebar-content > nav > ul > li > div > ul > li:hover {
	border:1px solid white;
	border-left-color:transparent;
	border-right-color:transparent;
	background:var(--bg-strongest);
}

.sidebar > div.sidebar-layout > div.sidebar-content > nav > ul > li.menu-item.sub-menu.open > div > ul > li.menu-item.sub-menu.open > div > ul > li:hover {
	background:var(--bg-strongest);
}


.layout .sidebar .menu .menu-item.sub-menu > .sub-menu-list {
  border-radius:0px 0px 10px 10px ;
  display: none;
  overflow: hidden;
  z-index: 999;  
}


a {
	cursor:pointer;
}


/*sidemenu close -> header _. submen*/
.layout .sidebar.collapsed > div.sidebar-layout > div.sidebar-content > nav > ul > li:hover > .sub-menu-list{
	border-top: 3px solid transparent;
	border-right: 3px solid transparent;
	border-bottom: 3px solid transparent;	
}


.layout .sidebar.collapsed > div.sidebar-layout > div.sidebar-content > nav > ul > li  {
	padding-left:-15px;
}
.layout .sidebar.collapsed > div.sidebar-layout > div.sidebar-content > nav > ul > li > div > ul {
	padding-bottom:0px;
}

.layout .sidebar			> div.sidebar-layout > div.sidebar-content > nav > ul > li > div > ul > li.menu-item.sub-menu.open > div > ul > li > a > i {
	display:none;
}
.layout .sidebar.collapsed 	> div.sidebar-layout > div.sidebar-content > nav > ul > li > div > ul > li.menu-item.sub-menu.open > div > ul > li > a > i {
	display:block;
}


.layout .sidebar.collapsed > div.sidebar-layout > div.sidebar-content > nav > ul > li > div > ul > li.menu-item.sub-menu.open > div > ul > li:hover {
	border-left-color:transparent;
	border-radius:30px;
}

.sidebar > div.sidebar-layout > div.sidebar-content > nav > ul > li > div > ul > li.menu-item.sub-menu.open > div > ul > li > a > span {
	padding-left:10px;
}

.layout .sidebar.collapsed > div.sidebar-layout > div.sidebar-content > nav > ul > li > div > ul > li:nth-child(1) > a > span {
	padding-top:40px;
	margin-bottom:15px;	
	font-size:18px;	
	cursor:not-allowed;
}


.BContainer{
	height:100%;  	
	overflow:auto;
	scrollbar-color: rgba(0,0,0,0.5) rgba(0,0,0,0)  !important;
	scrollbar-width: thin !important;

}
.BContainer::-webkit-scrollbar {
    width	: 15px;
    height	: 15px; 
}
.BContainer::-webkit-scrollbar:hover {
    height: 50px; 
}
.BContainer::-webkit-scrollbar-button:start:decrement,.BContainer::-webkit-scrollbar-button:end:increment {
    height: 15px;
    width: 13px;
    display: block;
    background: #101211;
    background-repeat: no-repeat; 
}
.BContainer::-webkit-scrollbar-button:horizontal:decrement {
    background: url(images/Arrows-L.png);
    background-position: 0px 0px; 
	background-size: 15px 15px;
}
.BContainer::-webkit-scrollbar-button:horizontal:increment {
    background: url(images/Arrows-R.png);
    background-position: 0px 0px; 
	background-size: 15px 15px;
}

.BContainer::-webkit-scrollbar-button:vertical:decrement {
	background: url(images/Arrows-U.png);
    background-position: 0px 0px; 
	background-size: 15px 15px;	
}
.BContainer::-webkit-scrollbar-button:vertical:increment {
    background: url(images/Arrows-D.png);    
	background-position: 0px 0px; 
	background-size: 15px 15px;
}
.BContainer::-webkit-scrollbar-button:horizontal:decrement:active { background-image: url(images/Arrows-R.png); }
.BContainer::-webkit-scrollbar-button:horizontal:increment:active { background-image: url(images/Arrows-L.png); }
.BContainer::-webkit-scrollbar-button:vertical:decrement:active { background-image: url(images/Arrows-D.png); }
.BContainer::-webkit-scrollbar-button:vertical:increment:active { background-image: url(images/Arrows-U.png); }
.BContainer::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);     
}
.BContainer::-webkit-scrollbar-track-piece {
    background-color: grey;
	border-radius: 50px;
}
.BContainer::-webkit-scrollbar-thumb:vertical {
    background: -webkit-gradient(linear, left top, right top, color-stop(0%, #4d4d4d), color-stop(100%, #333333));
    border: 1px solid #0d0d0d;
    border-top: 1px solid #666666;
    border-left: 1px solid #666666; 
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
}
.BContainer::-webkit-scrollbar-thumb:horizontal {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #4d4d4d), color-stop(100%, #333333));
    border: 1px solid #1f1f1f;
    border-top: 1px solid #666666;
    border-left: 1px solid #666666; 
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
}
.BContainer::-webkit-scrollbar-corner {
	background: #ecf0f3;
}
/*========================================================= BUTTON ONLY ================================================================ */
.BtnOnly.L{
	border-radius: 0px;	
	min-width:55px;
	min-height:35px;
	background-position-x: 12px;
	margin-left:-117.5px;
	border:none;
	border-right:1px solid white;
	padding-bottom:3px;
	box-shadow:none;
}
.BtnOnly.R{
	border-radius:8px;
	border-top-left-radius: 0px;
	border-bottom-left-radius: 0px;
	min-width:55px;
	min-height:35px;
	margin-left:-4px;	
	border:none;
	padding-bottom:3px;
	box-shadow:none;
}
.BtnOnly.R1{
	background-image:url('images/search2.png');
	background-size: 22px;
	border-radius:8px;
	border-top-left-radius: 0px;
	border-bottom-left-radius: 0px;
	min-width:55px;
	min-height:35px;	
	border:none;
	padding-bottom:3px;
	background-position-x: 18px;
	margin-left:-59px;
	box-shadow:none;
}
.BtnOnly.R1:active{
	cursor:pointer;
	position:relative;
	top:1.5px;
	
}
.BtnOnly.user2.L{
	background-image:url('images/user4.png');
	background-size: 28px;
	background-position-y: 6px;
	background-position-x: 15px;
}
.BtnOnly.close.R{	
	background-size: 25px;
	background-position-y: 6px;
	background-position-x: 14px;
}

.BtnOnly{
	padding-top:5px;
	background:#3a5da5;
	border:3px outset #ffffff;
	text-shadow:0px -1px 3px #000000;
			box-shadow:2px 2px 5px #000000;
	   -moz-box-shadow:2px 2px 5px #000000;
	-webkit-box-shadow:2px 2px 5px #000000;
			border-radius:10px;
	   -moz-border-radius:10px;
	-webkit-border-radius:10px;

	min-height: 45px;
    min-width:  48px;
	cursor:pointer;
	background-position-x: 9px;
	background-position-y: 6.5px;
	background-size: 25px;
	background-repeat:no-repeat;
	-webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: -moz-none;
    -o-user-select: none;
    user-select: none;	
}
.Btn2{
	padding-top:5px;
	background:#3a5da5;
	border:1.5px outset #ffffff;
	text-shadow:0px -1px 3px #000000;
			box-shadow:2px 2px 5px #000000;
	   -moz-box-shadow:2px 2px 5px #000000;
	-webkit-box-shadow:2px 2px 5px #000000;
			border-radius:10px;
	   -moz-border-radius:10px;
	-webkit-border-radius:10px;

	min-height: 45px;
    min-width:  48px;
	cursor:pointer;
	background-position-x: 9px;
	background-position-y: 6.5px;
	background-size: 25px;
	background-repeat:no-repeat;
	-webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: -moz-none;
    -o-user-select: none;
    user-select: none;	
}
.Btn2.search2 {
	background-image:url('images/search2.png');
	background-size: 35px;
	background-position-y: 3px;
	background-position-x: 5px;
}
.BtnOnly:active{
	cursor:pointer;
	position:relative;
	top:1.5px;
	left:-0.5px;
}
.BtnOnly.add {
	background-image:url('images/add.png');	
	background-size: 28px;
	background-position-y: 5.5px;
	background-position-x: 7px;
}
.BtnOnly.setting {
	background-image:url('images/setting.png');
	background-size: 33px;
	background-position-y: 3px;
	background-position-x: 5px;
}
.BtnOnly.search {
	background-image:url('images/search.png');	
	background-size: 33px;
	background-position-y: 3px;
	background-position-x: 5px;
}

.BtnOnly.search2 {
	background-image:url('images/search2.png');
	background-size: 35px;
	//background-position-y: 3px;
	background-position-y: calc(60%);
	background-position-x: 5px;
}
.BtnOnly.search3 {
	background-image:url('images/search3.png');
	background-size: 35px;
	background-position-y: 3px;
	background-position-x: 5px;
}
.BtnOnly.search4 {
	background-image:url('images/search4.png');
	background-size: 35px;
	background-position-y: 3px;
	background-position-x: 5px;
}
.BtnOnly.back {
	background-image:url('images/ezgif.com-reverse.png');	
}
.BtnOnly.refresh {
	background-image:url('images/refresh.png');	
}
.BtnOnly.refresh2 {
	background-position-y: calc(52%);
	background-image:url('images/refresh2.png');	
}
.BtnOnly.refresh3 {
	background-image:url('images/refresh3.png');	
}

.BtnOnly.next {
	background-image:url('images/btnnext.png');
}

.BtnOnly.xls {
	background-image:url('images/Excel.png');
	background-size: 32px;
	background-position-y: 5px;
	background-position-x: 5px;
}
.BtnOnly.info {
	background-image:url('images/info.png');
	background-size: 32px;
	background-position-y: center;
	background-position-x: 5px;
}
.BtnOnly.info2 {
	background-image:url('images/info2.png');
	background-size: 32px;
	background-position-y: center;
	background-position-x: 5px;
}
.BtnOnly.info3 {
	background-image:url('images/info3.png');
	background-size: 32px;
	background-position-y: center;
	background-position-x: 5px;
}

.BtnOnly.close {
	background-image:url('images/delete.png');
	background-size: 30px;
	background-position-y:center;

	background-position-x: 6.5px;
	
}
.BtnOnly.save {
	background-image:url('images/btnok2.png');
	background-size: 27.5px;
	background-position-x: 7px;
	background-position-y:center;
}
.BtnOnly.save2 {
	background-image:url('images/btnsave.png');
	background-size: 30px;
	background-position-y:center;
}
.BtnOnly.save3 {
	background-image:url('images/save.png');
	background-size: 30px;
	background-position-y:center;
}
.BtnOnly.save4 {
	background-image:url('images/save2.png');
	background-size: 25px;
	background-position-y:center;
}
.BtnOnly.edit {
	background-image:url('images/edit.png');
	background-size: 32px;
	background-position-y: center;
	background-position-x: 5px;
}
.BtnOnly.edit2 {
	background-image:url('images/edit2.png');
}
.BtnOnly.edit3 {
	background-image:url('images/edit3.png');
	background-size: 32px;
	background-position-y: center;
	background-position-x: 5px;
}
.BtnOnly.menu {
	background-image:url('images/menu.png');
	background-size: 32px;
	background-position-y: 3.5px;
	background-position-x: 5px;
}
.BtnOnly.download {
	background-image:url('images/download.png');
	background-size: 30px;
	background-position-y: center;
	background-position-x: 6px;
}
.BtnOnly.next2 {
	background-image:url('images/right.png');
	background-size: 30px;
	background-position-y: center;
	background-position-x: center;
}

.BtnOnly.send {
	background-image:url('images/right.png');
	background-size: 30px;
	background-position-y: center;
	background-position-x: 6px;
}
.BtnOnly.upload {
	background-image:url('images/upload.png');
	background-size: 30px;
	background-position-y: center;
	background-position-x: 6px;
}
.BtnOnly.user2 {
	background-image:url('images/user3.png');
	background-size: 25px;
	background-position-y: 7px;
}
.inputButton{
	 display: flex;
	flex-direction: row;
	position: relative;
	overflow: hidden;
}
.BtnInput{
	padding-top:5px;
	background:#3a5da5;
	border:2px outset #ffffff;
	text-shadow:0px -1px 3px #000000;
			box-shadow:-2px 2px 5px #000000;
	   -moz-box-shadow:-2px 2px 5px #000000;
	-webkit-box-shadow:-2px 2px 5px #000000;
			border-radius:10px;
	   -moz-border-radius:10px;
	-webkit-border-radius:10px;

	cursor:pointer;
	
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: -moz-none;
	-o-user-select: none;
	user-select: none;	
	
	border-top-left-radius: 0px;
	border-bottom-left-radius: 0px;
	min-width:55px;
	min-height:33px;			
	padding-bottom:3px;
	
	margin-left:-59px;	
}
.BtnInput.b {
	background:#148725;
}
.BtnInput.L{
	padding-top:5px;
	background:#3a5da5;
	border:2px outset #ffffff;
	text-shadow:0px -1px 3px #000000;
			box-shadow:-2px 2px 5px #000000;
	   -moz-box-shadow:-2px 2px 5px #000000;
	-webkit-box-shadow:-2px 2px 5px #000000;
			border-radius:10px;
	   -moz-border-radius:10px;
	-webkit-border-radius:10px;

	cursor:pointer;
	
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: -moz-none;
	-o-user-select: none;
	user-select: none;	
	
	border-top-right-radius: 0px;
	border-bottom-right-radius: 0px;
	min-width:55px;
	min-height:33px;			
	padding-bottom:3px;
	
	margin-left:-59px;	
}

.BtnInput.docs {
	background-repeat:no-repeat;
	background-image:url('images/edit3.png');
	background-size: 26px;		
	background-position-x: 12px;
	background-position-y: 1px;
}
.BtnInput.docs:active {
	cursor:pointer;
	min-height:35px;		
	background-position-x: 11px;
	background-position-y: 2px;
			box-shadow:-1px 1px 5px #000000;
	   -moz-box-shadow:-1px 1px 5px #000000;
	-webkit-box-shadow:-1px 1px 5px #000000;	
}
.BtnInput.Search2 {
	background-repeat:no-repeat;
	background-image:url('images/search2.png');
	background-size: 22px;		
	background-position-x: 15px;
	background-position-y: 3.5px;
}
.BtnInput.upload {
	background-repeat:no-repeat;
	background-image:url('images/upload.png');
	background-size: 22px;		
	background-position-x: 15px;
	background-position-y: 3.5px;
}

.BtnInput:active {
	cursor:pointer;
	min-height:35px;		
	background-position-x: 14px;
	background-position-y: 5px;
			box-shadow:-1px 1px 5px #000000;
	   -moz-box-shadow:-1px 1px 5px #000000;
	-webkit-box-shadow:-1px 1px 5px #000000;
}
/*=========================================================== END BUTTON ONLY ===============================================================*/	
.input::-webkit-outer-spin-button,.input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.input[type=number] {
  -moz-appearance: textfield;
}
.input{	
	height:40px;
	padding:1px 15px;
	min-height: 0;
    min-width:  0;
	line-height:1;
	background-image:none;
	border:1px solid var(--bg-weak);
	border-radius:10px;	
	font-size:16px;
	font-color			: var(--font-color);
	color				: var(--font-color);
	text-shadow			: var(--text-shadow)
	-moz-box-shadow		: inset 3px 3px 3px var(--shadow-color);
    -webkit-box-shadow	: inset 3px 3px 3px var(--shadow-color);
    box-shadow			: inset 3px 3px 3px var(--shadow-color);
	background-color:var(--bg-weak);
}
.input:focus{
	outline:0;
	background-color:var(--bg-stronger);
}
.input::-moz-placeholder {
	font-color: var(--font-color);
	color:var(--font-color);
	text-shadow:var(--text-shadow);
	background-color:#36454f;
	background-color:transparent;
	text-align:right;
}
.input:-ms-input-placeholder {
	font-color: var(--font-color);
	color:var(--font-color);
	text-shadow:var(--text-shadow);
	text-align:right;
	background-color:#36454f;
	background-color:transparent;
}
.input::-webkit-input-placeholder {
	font-color: var(--font-color);
	color:var(--font-color);
	text-shadow:var(--text-shadow);
	text-align:right;	
}


.input.phl::-moz-placeholder {
	font-color: var(--font-color);
	color:var(--font-color);
	text-shadow:var(--text-shadow);
	background-color:#36454f;
	background-color:transparent;
	text-align:left;
}
.input.phl:-ms-input-placeholder {
	font-color: var(--font-color);
	color:var(--font-color);
	text-shadow:var(--text-shadow);
	text-align:left;
	background-color:#36454f;
	background-color:transparent;
}
.input.phl::-webkit-input-placeholder {
	font-color: var(--font-color);
	color:var(--font-color);
	text-shadow:var(--text-shadow);
	text-align:left;	
}
input[W="100"] {	width:100px;	}
input[W="200"] {	width:200px;	}
input[W="250"] {	width:250px;	}
input[W="300"] {	width:300px;	}
input[W="350"] {	width:350px;	}
input[W="400"] {	width:400px;	}
input[W="450"] {	width:450px;	}
input[W="500"] {	width:500px;	}
input[W="Max"] {	width:100%;	}

.input:-webkit-autofill {
	font-size:16px;
	transition-delay: 9999s;
    transition-property: background-color, color,font-size;
}

.input:-webkit-autofill, .input:focus:-webkit-autofill {   
  /* -webkit-text-fill-color:var(--font-color);
	font-size:15;
	box-shadow: inset 0 3px 10px rgba(0,0,0,.24);
	transition: background-color 5000s ease-in-out 0s;*/
}



input:-webkit-autofill,
input:-webkit-autofill::first-line,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
   /* -webkit-background-clip: text;	
	font-size: 18px !important;
	-webkit-animation-delay: 1s; /* Safari support - any positive time runs instantly *//*
    -webkit-animation-name: autofill;
    -webkit-animation-fill-mode: both;
	-webkit-text-fill-color:var(--font-color);
	-webkit-text-font-size:36px;*/
}

.Frame[W5] {	width:90vw;	}
.Frame[H5] {	height:100px;	}
form {
	margin: 0;
	padding: 0;
}
.dropdown {
	
	background:url(images/down.png)  no-repeat right #ddd;
	background-position-x: calc(100% - 8px);
	background-position-y: calc(100% - 5px);
	background-z-index:9999;
	
   -webkit-appearance: none;
   
    text-overflow: ellipsis;
	height:40px;
	padding:1px 40px 0px 15px;
	
	min-height: 0;
    min-width:  0;
	border:1px solid var(--bg-weak);
	border-radius:10px;
	align:center;
	font-size:16px;
	color				: var(--font-color);
	
	-moz-box-shadow		: inset 3px 3px 3px var(--shadow-color);
    -webkit-box-shadow	: inset 3px 3px 3px var(--shadow-color);
    box-shadow			: inset 3px 3px 3px var(--shadow-color);
	background-color:var(--bg-weak);
}
.dropdown:focus {
	border-color:#66afe9;
	outline:0;
	-webkit-box-shadow	: inset 3px 3px 3px var(--shadow-color);
	box-shadow			: inset 3px 3px 3px var(--shadow-color);
}

.dropdown::-moz-placeholder {
	color:#d5f7f5;
	background-color:#36454f;
}
.dropdown:-ms-input-placeholder{
	color:#d5f7f5;
	background-color:#36454f;
}

.dropdown::-webkit-input-placeholder{
	color:#d5f7f5;
	background-color:#36454f;
}

.Frame-Header{
	border:2px solid var(--bg-weak);
	border-radius:15px;
	overflow:auto;
	
	
	padding:5px;
	font-size:16px;
	box-shadow: 3px 3px 2px rgba(var(--bg-strongest-rgb), 0.55),
				6px 6px 4px rgba(var(--bg-strongest-rgb), 0.75);
}
.Frame-Header.Flex{
	display: flex;
}
.Frame-Header.lc{
	justify-content: left;
	text-align: left;
	align-items: center;
}
.Frame-Header.lt{
	justify-content: left;
	text-align: left;
	align-items: top;
}
.Frame-Header.cc{
	justify-content: center;
	text-align: center;
	align-items: center;
}
.Frame-Header.rc{ 
	justify-content: right;
	text-align: right;
	align-items: center;
}
.Frame-Header.ct{
	justify-content: center;
	text-align: center;
	align-items: top;
}
.Frame-Footer{		
	border-radius:15px;
	border-color:orange;	
	overflow:auto;
	padding:10px 5px 10px 10px ;
	box-shadow: 3px 3px 2px var(--bg-strongest);
}
.Frame-Footer::-webkit-scrollbar {
  -webkit-appearance: none;
  width: 10px;
}
.Frame-Footer::-webkit-scrollbar-thumb {
  border-radius: 4px;
  background-color: var(--font-color);
  -webkit-box-shadow: 0 0 1px rgba(255, 255, 255, .5);
}
.Framex{
	height:100%;  	
	overflow:auto;
	scrollbar-color: red  !important;
	scrollbar-width: thin !important;
	padding-right:2px;
}
.Framex::-webkit-scrollbar {
    width	: 15px;
    height	: 15px; 
}

.Framex::-webkit-scrollbar-track-piece {
    background-color: var(--bg);
	border-radius: 50px;
	border:2px solid grey;
}
.Framex::-webkit-scrollbar-thumb:vertical {
    background: -webkit-gradient(linear, left top, right top, color-stop(0%, #4d4d4d), color-stop(100%, #333333));
    border: 1px solid #0d0d0d;
    border-top: 1px solid #666666;
    border-left: 1px solid #666666; 
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
}
.Framex::-webkit-scrollbar-thumb:horizontal {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #4d4d4d), color-stop(100%, #333333));
    border: 1px solid #1f1f1f;
    border-top: 1px solid #666666;
    border-left: 1px solid #666666; 
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 	
}
.Framex::-webkit-scrollbar-corner {
	background: transparent;
}

.BtnOnly.T {
	padding :8px 15px 8px 30px;
	width:auto;
	color:white;
	font-family: "Poppins", sans-serif;
	font-size:15px;
}
.BtnOnly.theme1 {
	background-color:var(--bg-strongest);
	color:var(--font-color);
	text-shadow:var(--text-shadow);
	font-size:16px;
	padding :10px 20px 8px 50px !important;
}
.Form .Frame {
	align-self: center;
}
.absoluteCenter {
 /* Must manually set width/height */
 overflow: hidden; /*hide scroll*/
 padding:-50px;
 width:100vw;
 height:100vh;
 background-color:rgba(var(--bg-strongest-rgb), 0.79); 
	z-index:999;

 /* The magic centering code */
 margin:auto;
 position:absolute;
 top:0;bottom:0; /* Aligns Vertically - Remove for Horizontal Only */
 left:0;right:0; /* Aligns Horizontally - Remove for Vertical Only  */

 /* Prevent div from overflowing main window */
 max-width:100vw;
 max-height:100vh;
}
.ring {
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	width	:110px;
	height	:110px;
	background:#224a80;
	border:13px solid var(--bg-stronger); /*Ring 1*/
	border-radius:50%;
	text-align:center;
	//align-self:center;
	line-height:translate(-50%,-50%);
	
	font-family:sans-serif;
	font-size:26px;
	color:black;
	letter-spacing:1px;
	text-transform:uppercase;
	text-shadow:0 0 10px #fff000;
	box-shadow:0 0 20px rgba(0,0,0,.5);
	  


	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#b5bdc8+0,828c95+36,28343b+100;Grey+Black+3D */
	background: rgb(181,189,200); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(181,189,200,1) 0%, rgba(130,140,149,1) 36%, rgba(40,52,59,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  rgba(181,189,200,1) 0%,rgba(130,140,149,1) 36%,rgba(40,52,59,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  rgba(181,189,200,1) 0%,rgba(130,140,149,1) 36%,rgba(40,52,59,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b5bdc8', endColorstr='#28343b',GradientType=0 ); /* IE6-9 */
	font-family: 'Lora', serif;
	color:white;
	/*background:rgba(235, 64, 52, 1); */
	text-shadow:0px 0px 0 #0D0D0D,
				0px 1px 0 #0D0D0D,
				1px 1px 0 #0D0D0D, 
				1px 2px 0 #171717, 
				2px 2px 0 #171717, 
				2px 3px 1px black,
				3px 3px 2px black,
				3px 3px 3px white;
				
}
.ring:before {
  content:'';
  position:absolute;
  top:-10px;
  left:-10px;
  width:100%;
  height:100%;
  border:10px solid #1ac7bb;
  border-top:10px solid #fff000;
  border-right:10px solid #fff000;
  border-top:10px solid var(--bg-strongest);
  border-right:10px solid var(--bg-strongest);
  border-radius:50%;
  animation:animateC 0.5s linear infinite;
}

@keyframes animateC {
	0% {transform:rotate(0deg);}
  100% {transform:rotate(360deg);}
}
@keyframes animate {
  0%  {transform:rotate(45deg);}
  100%  {transform:rotate(405deg);}
}

.roundedOne {
  width	: 35px;
  height: 35px;
  position: relative;
  
  background: #fcfff4;
  background: linear-gradient(to bottom, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
  border-radius: 50px;
  box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0, 0, 0, 0.5);
}
.roundedOne label {
  width:  27px;
  height: 27px;
  cursor: pointer;
  position: absolute;
  left: 4px;
  top: 4px;
  background: linear-gradient(to bottom, #222222 0%, #45484d 100%);
  border-radius: 50px;
  box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.5), 0px 1px 0px white;
}
.roundedOne label:after {
  content: '';
  width : 23px;
  height: 23px;
  position: absolute;
  top: 2px;
  left: 2px;
  background: #27ae60;
  background: linear-gradient(to bottom, #27ae60 0%, #145b32 100%);
  opacity: 0;
  border-radius: 50px;
  box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0, 0, 0, 0.5);
}
.roundedOne label:hover::after {
  opacity: 0.3;
}
.roundedOne input[type=checkbox] {
  visibility: hidden;
}
.roundedOne input[type=checkbox]:checked + label:after {
  opacity: 1;
}

.Btn3 {
	padding-top:5px;
	padding-left: -15px important;
	background:#3a5da5;
	border:2px outset #ffffff;
	text-shadow:0px -1px 3px #000000;
			box-shadow:2px 1px 3px #000000;
	   -moz-box-shadow:2px 1px 3px #000000;
	-webkit-box-shadow:2px 1px 3px #000000;
			border-radius:7px;
	   -moz-border-radius:7px;
	-webkit-border-radius:7px;

	min-height: 40px;
    padding:0px 20px 0px 50px;
	cursor:pointer;
	background-position-x: 9px;
	
	font-weight:500;
	font-size:15px;
	
	background-repeat:no-repeat;
	-webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: -moz-none;
    -o-user-select: none;
    user-select: none;
	
	box-shadow		  :-1px -1px 3px #000000,1px 1px 3px #000000;
	   -moz-box-shadow:-1px -1px 3px #000000,1px 1px 3px #000000;
	-webkit-box-shadow:-1px -1px 3px #000000,1px 1px 3px #000000;
}
.Btn3:active{
	cursor:pointer;
	position:relative;
	left:1px;
	border:2px inset grey;
	box-shadow		  :none;
	   -moz-box-shadow:none;
	-webkit-box-shadow:none;
}
.Btn3:focus {
	outline: none; /* Removes the default outline for buttons, inputs, and links */
}
.Btn3.bpback {
	background-image:url('images/btnback2.png');
	background-size: 30px;
	background-position-y: calc(50%);
	background-position-x: calc(5%);
}
.Btn3.bpnext {
	padding:0px 50px 0px 20px;
	background-image:url('images/btnnext2.png');
	background-size: 30px;
	background-position-x: calc(95%);
	background-position-y: calc(50%);
}
.Btn3.user {
	background-image:url('images/user4.png');
	background-size: 30px;
	background-position-y: calc(50% + 1.5px);
}
.Btn3.del {
	background-image:url('images/delete.png');
	background-size: 30px;
	background-position-y: calc(50% + 1px);
}
.Btn3.ok {
	background-image:url('images/btnok2.png');
	background-size: 28px;
	background-position-y: calc(50% + 1px);
}
.Btn3.refresh {
	background-image:url('images/refresh2.png');
	background-size: 26px;
	background-position-y: calc(50%);
}
.Btn3.refresh2 {
	background-image:url('images/refresh.png');
	background-size: 28px;
	background-position-y: calc(50%);
}
.Btn3.upload {
	background-image:url('images/upload.png');
	background-size: 28px;
	background-position-y: calc(50% + 1px);
}
.Btn3.search2 {
	background-image:url('images/search2.png');
	background-size: 30px;
	background-position-y: calc(50%);
	background-position-x: 7px;
	padding-left:45px
}
.Btn3.add {
	background-image:url('images/add.png');
	background-size: 30px;
	background-position-y: calc(50%);
	background-position-x: 7px;
	padding-left:45px
}

.theme1 {
	background-color:var(--bg-strongest);
	color:var(--font-color);
	text-shadow:var(--text-shadow);
}