/* ---------------------------------------------------
    SIDEBAR STYLE
----------------------------------------------------- */

.wrapper { display: flex; align-items: stretch;}

#sidebar-icons { min-width: 80px; max-width: 80px; background: #cfcfcf; color: #fff; padding-bottom: 30px !important; margin-right: 1px; text-align: center; z-index: 999; /*padding-left: 15px;*/ }

#sidebar-icons ul li a {padding: 10px; font-size: 15px; display: block; color: #333333; line-height: 40px;height:61px;}

#sidebar-icons ul li a:hover {color: #333333; background: #eee;}

#sidebar-icons ul li a i {margin-right: 10px;}

#sidebar-icons ul li.active>a, a[aria-expanded="true"] {color: #333; background: #eee;}

/* 2 */

#sidebar {min-width: 240px; max-width: 240px; background: #dbe4e8; color: #fff; transition: all 0.3s; padding-bottom: 30px !important;}

/*#sidebar.active {min-width: 80px; max-width: 80px; text-align: center;}*/

#sidebar.active { margin-left: -240px;}

/*#sidebar.active .sidebar-header h3, #sidebar.active .sidebar-header h4, #sidebar.active .sidebar-header p,*/

#sidebar.active .CTAs {display: none;}

/* top profile div padding */

/*#sidebar.active .sidebar-header {padding: 20px 20px;}*/

#sidebar.active .sidebar-header strong {display: block;}

#sidebar ul li a {text-align: left;}

/*#sidebar.active ul li a {padding: 10px 10px; text-align: center; font-size: 0.85em; float: left; display: block; width: 100%;}*/

/*#sidebar.active ul li .main-circle1, #sidebar.active ul li .main-circle2, #sidebar.active ul li .main-circle3, #sidebar.active ul li .main-circle4, #sidebar.active ul li .main-circle5, #sidebar.active ul li .main-circle6, #sidebar.active ul li .main-circle7, #sidebar.active ul li .main-circle8, #sidebar.active ul li .main-circle9, #sidebar.active ul li .main-circle10, #sidebar.active ul li .main-circle11, #sidebar.active ul li .main-circle12, #sidebar.active ul li .main-circle13, #sidebar.active ul li .main-circle14 {float: none !important; margin: auto !important;}

#sidebar.active ul li span {display: none;}*/

#sidebar.active ul li a i {margin-right: 0; display: block; font-size: 1.8em; margin-bottom: 5px;}

#sidebar.active ul ul a {padding: 10px !important;}

#sidebar.active .dropdown-toggle::after {top: auto; bottom: 10px; right: 50%; -webkit-transform: translateX(50%); -ms-transform: translateX(50%); transform: translateX(50%);}

#sidebar .sidebar-header {padding:16px 20px; background: #dbe4e8; border-bottom: 1px solid #fff;}

#sidebar .sidebar-header strong {display: none; font-size: 1.8em;}

#sidebar ul.components {/*padding: 20px 0;*/ /*border-bottom: 1px solid #47748b;*/}

#sidebar ul li a {padding: 10px; font-size: 15px; display: block; color: #333333; line-height: 40px;}

#sidebar ul li a:hover {color: #333333; background: #eee;}

#sidebar ul li a i {margin-right: 10px;}

#sidebar ul li.active>a, a[aria-expanded="true"] {color: #333; background: #eee;}

/* ---------------------------------------------------
    CONTENT STYLE
----------------------------------------------------- */

#content {width: 100%; padding: 20px; min-height: 100vh; transition: all 0.3s; margin-bottom: 30px; /* new */}

/* ---------------------------------------------------
    MEDIAQUERIES
----------------------------------------------------- */

@media (max-width: 768px) {

#sidebar {min-width: 80px; max-width: 80px; text-align: center; margin-left: -80px !important;}

.dropdown-toggle::after {top: auto; bottom: 10px; right: 50%; -webkit-transform: translateX(50%); -ms-transform: translateX(50%); transform: translateX(50%);}

#sidebar.active {margin-left: 0 !important;}

#sidebar .sidebar-header h3,  #sidebar .CTAs {display: none;}

#sidebar .sidebar-header strong {display: block;}

#sidebar ul li a {padding: 10px 10px !important;}

#sidebar ul li a span {display: none !important;/*font-size: 0.85em;*/ }

#sidebar ul li a i {margin-right: 0; display: block;}

#sidebar ul ul a {padding: 10px !important;}

#sidebar ul li a i {font-size: 1.3em;}

#sidebar {margin-left: 0;}

#sidebarCollapse span {display: none;}

/* customization */
	
.main-circle1, .main-circle2, .main-circle3, .main-circle4, .main-circle5, .main-circle6, .main-circle7, .main-circle8, .main-circle9, .main-circle10, .main-circle11, .main-circle12, .main-circle13, .main-circle14 {float: none !important; margin: auto !important;}

#sidebar .user-profile h3, #sidebar .user-profile h4, #sidebar .user-profile p {display: none !important;}

#sidebar.active .sidebar-header {padding: 19px 20px;}

#sidebar .sidebar-header {padding: 19px !important;}

}

@media (max-width: 992px) {

.hidden-sm {display: block !important;}

}