/** CSS FOR MENUSTYLES
/* Version: 1.0
*/

/* MENU STYLES */
#header_main_alternate {display: none;}

/* SIDE BAR STYLES NEW */
#top .container {padding:0 !important}
#top .sidebar_left .content {margin: 0 !important; padding: 0 !important; max-width: 82%; width: 82%;}
#top .sidebar {background: var(--bg-black); margin: 0 !important; position: fixed; left: 0; width: 260px !important; min-width: 260px; max-width: 20%; min-height: 100vh; padding: 100px 20px 20px 20px; z-index: 999999; top: 30px; border: 0 !important;}
#top .sidebar a {font-size: 15px; font-weight:400; color: var(--grey) !important;}
#top .sidebar a:hover,
#top .sidebar a:active,
#top .sidebar a:focus {color:var(--primary) !important}

/* ATHLETE PROFIL CARD*/
#top .sidebar .athlete-profile-card a .athlete-image {display: inline-block; width: 50px; border-radius: 100%; margin-right: 10px;}
#top .sidebar .athlete-profile-card a .athlete-info {display: inline-block; width: calc(100% - 60px); position: relative; top: 50%; transform: translateY(-24%);}
#top .sidebar .athlete-profile-card a .athlete-info h5 {font-size: 15px; font-weight: 600 !important; line-height: 1;}
/* SUB NAV */
#top .sidebar .sub-nav {padding: 20px 0 0; height: max-content; min-height: 310px;}
#top .sidebar .sub-nav a {line-height: 2;}
#top .sidebar .sub-nav ul {margin-left: 5px;}
#top .sidebar .sub-nav ul li {padding-left: 24px;}
#top .sidebar .sub-nav .medium {color: var(--grey);}
#top .sidebar .general-nav {position: relative;top: 20px;}
#top .sidebar .sub-nav .icon:before {font-size: 18px; position: absolute; top: initial; margin-right: 20px; left: 0;color: var(--grey);}
#top .sidebar .sub-nav .icon {margin-left: 30px; color: var(--grey);}

/*--- MOBILMENU --*/
#floating-menu {position: fixed;bottom: 0; width: 100%; background: rgba(51, 51, 51, 0.95); backdrop-filter: blur(2px); padding: 5px 0 12px; z-index:9999; display: none;}
#floating-menu ul {margin: 0; padding: 0; list-style: none; display: flex; justify-content: space-between; align-items: center;}
#floating-menu li { margin: 0; padding: 0;}
#floating-menu li:first-child {padding-left: 10px;}
#floating-menu li:last-child {padding-right: 10px;}
#floating-menu li a { display: block; padding: 10px; color: #fff; text-align: center;}
#floating-menu li:is(.active) a * {color: var(--primary) !important;}
#floating-menu li:not(.active) a * {color: #d5d5d5;}
#floating-menu li a i { margin:auto;}
#floating-menu li a .desc {display: block; text-align: center; font-size: 12px; color:#fff}
/*Overlay*/
#top #menu-overlay {position: fixed;bottom: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); display: none; z-index: 9998;}
#top #menu-overlay .cont {position: absolute; bottom: 70px; left: 0; width: 100%; background-color: var(--bg-dark);}
#top #menu-overlay ul { padding: 10px; list-style: none;}
#top #menu-overlay li { margin: 0; padding: 0; color: var(--white);font-weight: 600;}
#top #menu-overlay li a { display: block; padding: 10px; color: var(--grey);}
#top #menu-overlay li a i {margin-right: 5px;}
/* ATHLETE PROFIL CARD*/
#top #menu-overlay .cont .athlete-profile-card {margin-left: 10px; margin-top:40px;}
#top #menu-overlay div .athlete-profile-card a .athlete-image {display: inline-block; width: 50px; border-radius: 100%; margin-right: 10px;}
#top #menu-overlay div .athlete-profile-card a .athlete-info {display: inline-block; width: calc(100% - 60px); position: relative; top: 50%; transform: translateY(-24%);}
#top #menu-overlay div .athlete-profile-card a .athlete-info h5 {font-size: 15px; font-weight: 600 !important; line-height: 1;}

/*--- RESPONSIVE DESIGN---*/
@media only screen and ( max-width: 989px) {  
	/* SIDE BAR MENU*/
	#top #main .sidebar {display: none;}

	/*--- Mobilemenu --*/
	/*Headermeta*/
	.responsive #header_meta {display: none !important;}
	/*Mobilemenu*/
	.responsive #floating-menu {display: block !important; border-radius: 0px; margin: 0; width: 100%; box-shadow: 0 -2px 10px rgba(0,0,0,0.2);}
	.responsive #floating-menu #menu-overlay {bottom: 0;}
	.responsive #floating-menu a {font-size: 16px;}
	.responsive #floating-menu #menu-toggle {display: block; width: 25%; font-size: 20px;}
}
@media only screen and ( max-width: 768px )   {   
    /*--- MENU ---*/
    .responsive #top #wrap_all .main_menu {display: none !important;}
}