.toplogo { font-size : 24px ; display : grid ; align-items : end ; grid-template-columns : 0px 300px auto ; }

.toplogo .toplogo_title { text-align : center ; }
.toplogo .toplogo_title .siteprojects { font-size : 16px ; font-weight : 500 ; padding : 10px 10px 10px 10px ; text-align : right ; }
.toplogo .toplogo_title .siteprojects .link { margin : 10px ; }
.toplogo .toplogo_title .siteprojects .link a { color : #FFF ; text-decoration : none ; }
.toplogo .toplogo_title .siteprojects .link a.selected { color : #369 ; text-decoration : none ; }
.toplogo .toplogo_title .siteprojects .link a:hover { color : #369 ; }
.toplogo .toplogo_title .sitename { font-size : 42px ; font-weight : 600 ; padding : 5px 10px ; background : #FFF ; color : #369 ; }
.toplogo .toplogo_title .sitename a { color : #369 ; text-decoration : none ; }
.toplogo .toplogo_title .sitename a:hover { font-weight : 900 ; border-bottom : dashed #369 2px ; }
.toplogo .toplogo_title .siteabout { padding : 5px 10px 10px 10px ; font-weight : 500 ; color : #999 ; text-align : left ; }
.toplogo .toplogo_logo { }
.toplogo .toplogo_links { font-weight : 300 ; display : grid ; align-content : space-between ; justify-content : stretch ; align-items : end ; padding : 10px ; text-align : right ; height : -webkit-fill-available ; }
.toplogo .toplogo_links a { padding : 0 0px ; color : #999 ; border-bottom : solid #CCC 1px ; text-decoration : none ; }
.toplogo .toplogo_links a:first-child { border : none ; }
.toplogo .toplogo_links a:hover { color : #369 ; border-bottom : solid #999 1px ! important ; text-decoration : none ; }
.toplogo .toplogo_links .selected a { color : #369 ; border-bottom : dashed #369 1px ; }
.toplogo .toplogo_links .between { margin : 0 5px ; font-weight : 100 ; color : #CCC ; }
.toplogo .toplogo_links .toplogo_links_top { display : flex ;  }
.toplogo .toplogo_links .toplogo_links_top_login { width : 100% ; text-align : left ; }
.toplogo .toplogo_links .toplogo_links_top_login a { margin-left : 10px ; font-weight : 300 ; }
.toplogo .toplogo_links .toplogo_links_top_skins { }
.toplogo .toplogo_links .toplogo_links_top_login .box { white-space : nowrap ; }
.toplogo .toplogo_links .toplogo_links_top_skins .box { white-space : nowrap ; margin : -20px 0 -10px 0 ; }
.toplogo .toplogo_links .toplogo_links_top_skins .box .title { display : none ; margin-top : 10px ; padding-top : 10px ; text-align : center ; border-top : dashed #DDD 1px ; }
.toplogo .toplogo_links .toplogo_links_top_skins .box .data { padding : 20px 10px 10px 10px ; background : #EEE ;}
.toplogo .toplogo_links .toplogo_links_top_skins .box:hover .data { border-top : solid #CCC 5px ; }
.toplogo .toplogo_links .toplogo_links_top_skins .box:hover .title { display : block ; }
.toplogo .toplogo_links .toplogo_links_top_languages .box { padding-left : 10px ; }
.toplogo .toplogo_links .toplogo_links_top_login ,
.toplogo .toplogo_links .toplogo_links_top_skins ,
.toplogo .toplogo_links .toplogo_links_top_languages { font-size : 16px ; }
.toplogo .toplogo_links .toplogo_links_top_languages .selected a { color : #369 ; border-bottom : solid #CCC 1px ; }
.toplogo .toplogo_links .toplogo_links_top_languages a:hover { color : #369 ; }
.toplogo .toplogo_links .toplogo_links_links { font-weight : 400 ; }

.topsubmenu { display : flex ; justify-content : space-between ; font-size : 16px ; font-weight : 300 ; text-align : right ; border-top : dashed #CCC 1px ; }
.topsubmenu { }
.topsubmenu .link { }
.topsubmenu .link a { color : #999 ; }
.topsubmenu .link a:hover { color : #369 ; border-bottom : solid #369 1px ; }
.topsubmenu .link.selected a { color : #369 ; border-bottom : dashed #369 1px ; }
.topsubmenu .between { font-weight : 100 ; padding : 0 5px ; color : #CCC ; }

.topsubmenu .topsubmenu_title { padding : 25px 10px 10px 10px ; color : #CCC ; }
.topsubmenu .topsubmenu_title a { padding : 0 0px ; color : #999 ; background : #DDD ; }
.topsubmenu .topsubmenu_title a:first-child { font-weight : 800 ; }

.topsubmenu .level1 { padding : 10px ; }


.topmenu { margin : 0px 0px 0px 0px ; padding : 0px 0px 0px 0px ; border-top : dashed #999 1px ; }

.topmenu div.title { display : none ; font-size : 30px ; font-weight : 900 ; padding : 10px ; color : #000 ; }


.topmenu div.menu { display : flex ; justify-content : flex-end ; font-size : 24px ; margin : 0px ; padding : 10px ; border-bottom : solid #333 0px ; }
.topmenu div.menu .menua span.span_title {  font-weight : 400 ; display : grid ; align-items : end ; margin : 0px ; padding : 0px ; color : #666 ; background : #DDD ; border-bottom : solid #DDD 1px ; }
.topmenu div.menu .menua:hover span.span_title { cursor : pointer ; color : #9c2ca4 ; border-bottom : solid #CCC 1px ; }
.topmenu div.menu .menua_between { display : flex ; margin : 0px 5px ; padding : 0px 0px ; color : #CCC ; }
.topmenu div.menu .menua { position : relative ; display : flex ; }
.topmenu div.menu .menua span.span_popup { display : none ; position : absolute ; z-index : 1000 ; font-size : 15px ; top : 100% ; right : 0px ; padding : 0px 0px ; } 
.topmenu div.menu .menua:hover span.span_popup { display : block ; } 
.topmenu div.menu .menua span.span_popup .border { margin : 0px 0px 0px 0px ; padding : 10px ; width : max-content ;  min-width : 100% ; max-width : 300px ; } 
.topmenu div.menu .menua span.span_popup .border .div { padding : 0px ; background : #222 ; color : #FFF ; } 
.topmenu div.menu .menua span.span_popup .border .head_comment { padding : 10px ; } 
.topmenu div.menu .menua span.span_popup .border .head_links_title { padding : 15px 10px 5px 10px ; color : #000 ; background : #666 ; } 
.topmenu div.menu .menua span.span_popup .border .head_links a { display : block ; padding : 5px 10px 10px 10px ; color : #CCC ; text-decoration : none ; } 
.topmenu div.menu .menua span.span_popup .border .head_links a:hover { text-decoration : underline ; }



/* LEFT */

.dt_left .left_menu { padding : 10px ; }

.dt_left .left_menu .left_menu_box { display : grid ; align-items : end ; grid-template-columns : 30px auto ; }
.dt_left .left_menu .left_menu_box .back { height : 100% ; background : #333 ; }
.dt_left .left_menu .left_menu_box .back a { padding : 5px ; writing-mode : tb-rl ; transform : rotate(180deg) ; text-align : left 	; color : #FFF ; text-decoration : none ;}
.dt_left .left_menu .left_menu_box .links { padding-left : 10px ; }

.dt_left .left_menu .link { }
.dt_left .left_menu .link_between { margin : 3px 0px ; border-top : dashed #999 1px ; }
.dt_left .left_menu .link a { display : block ; padding : 0px ; color : #666 ; text-decoration : none ; }
.dt_left .left_menu .link a:hover { color : #000 ; }
.dt_left .left_menu .link.selected a { font-weight : bold ; color : #000 ; }
.dt_left .left_menu .link .a_unactive { color : #CCC ; }


/* RIGHT */

.dt_right .right_menu { padding : 10px ; }
.dt_right .right_menu a { display : block ; padding : 0px ; color : #333 ; text-decoration : none ; }
.dt_right .right_menu a:hover { color : #000 ; }

/*
.topmenu div.menu { display : flex ; margin : 5px 0px 0px 0px ; padding : 0px ; border-bottom : solid #333 1px ; }
.topmenu div.menu .menua span.span_title { display : grid ; align-items : end ; font-size : 24px ; margin : 0px ; padding : 10px ; max-width : 200px ; color : #333 ; background : #DDD ; }
.topmenu div.menu .menua:hover span.span_title { cursor : pointer ; background : #333 ; color : #FFF ; }
.topmenu div.menu .menua { position : relative ; display : flex ; }
.topmenu div.menu .menua span.span_popup { display : none ; position : absolute ; z-index : 1000 ; font-size : 15px ; top : 100% ; left : 0px ; right : 0px ; padding : 0px 0px ; } 
.topmenu div.menu .menua:hover span.span_popup { display : block ; } 
.topmenu div.menu .menua span.span_popup .border { margin : 0px 0px 0px 0px ; padding : 0px ; width : max-content ;  min-width : 100% ; max-width : 300px ; } 
.topmenu div.menu .menua span.span_popup .border .div { padding : 0px ; background : #222 ; color : #FFF ; } 
.topmenu div.menu .menua span.span_popup .border .head_comment { padding : 10px ; } 
.topmenu div.menu .menua span.span_popup .border .head_links_title { padding : 15px 10px 5px 10px ; color : #000 ; background : #666 ; } 
.topmenu div.menu .menua span.span_popup .border .head_links a { display : block ; padding : 5px 10px 10px 10px ; color : #CCC ; text-decoration : none ; } 
.topmenu div.menu .menua span.span_popup .border .head_links a:hover { text-decoration : underline ; }
*/


/*
.topmenu div.menu { display : flex ; padding : 5px 0px 0px 0px ; border-bottom : solid #333 1px ; }
.topmenu span.menua { position : relative ; }
.topmenu div.menu .menua span.span_title { display : grid ; align-items : end ; font-size : 24px ; margin : 0px ; padding : 10px ; max-width : 150px ; color : #333 ; }
.topmenu div.menu .menua:hover span.span_title { cursor : pointer ; background : #333 ; color : #FFF ; }
.topmenu div.menu .menua { display : flex ; }
.topmenu div.menu span.span_popup { display : none ; position : absolute ; z-index : 1000 ; font-size : 15px ; top : 100% ; left : 0px ; right : 0px ; padding : 0px 0px ; } 
.topmenu div.menu span.span_popup .border { margin : 0px 0px 0px 0px ; padding : 0px ; width : max-content ;  min-width : 100% ; max-width : 150px ; } 
.topmenu div.menu span.span_popup .border .div { padding : 0px ; background : #222 ; color : #FFF ; } 
.topmenu div.menu span.span_popup .border .head_comment { padding : 10px ; } 
.topmenu div.menu span.span_popup .border .head_links_title { padding : 10px ; color : #000 ; background : #666 ; } 
.topmenu div.menu span.span_popup .border .head_links a { display : block ; padding : 10px ; color : #CCC ; text-decoration : none ; } 
.topmenu div.menu span.span_popup .border .head_links a:hover { text-decoration : underline ; }
*/