<style>
.sidebar 				{background: linear-gradient(90deg, #051563, #0c0dc5)}
.sideplus .row     		{background-color: var(--sideplus); padding: 5px; display: flex; align-items: center; border-bottom: 1px dotted var(--sidebot); cursor: pointer}
.sideplus .row:hover  	{background-color: var(--sidehov)}
.sideplus .icon    		{font-size: 20px; color: var(--sidefont); margin: 0 10px}
.sideplus .text    		{padding:7px;}
.sideplus .title 		{font: 400 16px/18px "Roboto"; color: var(--sidefont); text-transform: uppercase}
.sideplus .sub 			{font: 400 13px/15px "Roboto"; color: var(--sidefont)}
.sideplus .ttaplus		{background: var(--sidetta); font: 400 18px/18px "Roboto"; color: var(--sidefont); padding:15px 15px; text-transform: uppercase;}
.sideplus .ttaplus:before {content: "\f013"; font-family: FontAwesome; margin-right:10px}
.sidecol a				{background: var(--sidecol); font: 400 14px/18px "Roboto", sans-serif; color:var(--sidefont); padding:10px 10px; border-bottom:dotted 1px var(--sidecolbot); display:block; width:100%; margin:0; overflow:hidden;}
.sidecol a:hover 		{background: var(--sidehov)}
.accordion-title        {background-color: var(--sideplus); color: #fff; cursor: pointer; padding: 10px; border-bottom: 1px dotted var(--sidebot); display: flex; justify-content: space-between; align-items: center}
.accordion-title:hover  {background-color:  var(--sidehov)}
.accordion-content      {max-height: 0; overflow: hidden; transition: max-height 0.5s ease}
.accordion-content a    {background-color: var(--sidecol); color: var(--sidefont); padding: 10px; display: block; transition: background-color 0.3s}
.accordion-content a:hover {background-color: var(--sidehov)}
.accordion-content.open {max-height: 400px}

:root {--sideplus:#091ae9;--sidehov: #3d4aee; --sidecol: transparent; --sidetta:#242ea4; --sidefont:#ffffff}
:root { --sidefont: #ffffff; --sidecolbot: #2930a7; --sidebot: #424ae7}
