﻿/* MEDIA Querys */

@media only screen and (min-width: 0px) 
{
	.collapser_dummy_B {
		display:none;
	}
	.collapser_elm_B {
		display:flex;
	}
}

@media only screen and (min-width: 250px) 
{
	#UI_toolbarcollapser_section, .visible_toolbar #UI_toolbarcollapser_section { display:none; }
	#UI_toolbarparent_section, .visible_toolbar #UI_toolbarparent_section { display:flex }

	.collapsed_toolbar #UI_toolbarcollapser_section { display:flex; }
	.collapsed_toolbar #UI_toolbarparent_section { display:none; }


	body:not(.compactmode) #UI_toolbarcollapser_section { display:none !important; }
	body:not(.compactmode) #UI_toolbarparent_section { display:flex !important; }
    body:not(.compactmode) #UI_toolbarparent_section .pannelcloser { display:none !important; }

    .compactmode.compactmode_toolbar.visible_toolbar #UI_map_supersection { border-right: lightgray 1px solid !important; }

}

@media only screen and (min-width: 500px) 
{
	#UI_pannelcollapser_section { display:none; }
	#UI_pannelparent_section>.collapser_elm_pannel { display:flex; }

    .compactmode.compactmode_panel.visible_sidepanel #UI_map_supersection { border-left: lightgray 1px solid !important; }
}

    .compactmode.compactmode_info #UI_map_supersection { border-bottom: lightgray 1px solid !important; } 
    .compactmode.compactmode_info .snapped_top #UI_map_supersection, .compactmode.compactmode_info .snapped_bottom #UI_map_supersection { border-bottom: 0px !important; }

@media only screen and (max-width: 500px) 
{
    #umerilo { width:2cm; height:5px }

    .infront_sidepannel {
        position: absolute;
        z-index: 2;
        left: 0px;
        background: inherit;
        max-width: calc(100% - 50px) !important;
        width: var(--panel-width);
    }
    #UI_pannelparent_section {
        box-shadow: #444444 3px 0px 5px 0px;
    }

	#UI_pannelparent_section>.pannelcloser.toleft { border-right:lightgray 1px solid; }
	#UI_pannelcollapser_section { display:flex; }
	#UI_pannelparent_section.collapser_elm_pannel { display:none; }

	.floating_menu { max-width: 250px !important; }
}

@media only screen and (max-width: 300px) {
    #UI_BackgroundsMenu.floating_menu, #UI_OverlaysMenu.floating_menu { max-width: 99% !important; }
	.floating_menu { max-width: 90% !important; }
}
@media only screen and (max-width: 250px) 
{
	.infront_toolbar {
		position: absolute;
		z-index: 1;
		right: 0px;
		background: inherit;
	}
    #UI_toolbarparent_section {
        box-shadow: #444444 -3px 0px 5px 0px;
    }

	#UI_toolbarcollapser_section, .visible_toolbar #UI_toolbarcollapser_section { display:flex; }
	#UI_toolbarparent_section, .visible_toolbar #UI_toolbarparent_section { display:flex; }
    
	.collapsed_toolbar #UI_toolbarcollapser_section { display:flex; }
	.collapsed_toolbar #UI_toolbarparent_section { display:none; }

	#UI_toolbarparent_section>.pannelcloser.toright { border-left:lightgray 1px solid; display:flex; }
	.floating_menu { max-width: 90% !important; }
}
@media only screen and (max-width: 180px) 
{
	#UI_toolbarcollapser_section, .collapsed_toolbar #UI_toolbarcollapser_section { display:flex; }
	#UI_toolbarparent_section, .collapsed_toolbar #UI_toolbarparent_section { display:none; }
    
	.visible_toolbar #UI_toolbarcollapser_section { display:flex; visibility:hidden; }
	.visible_toolbar #UI_toolbarparent_section { display:flex; }

    .infront_sidepannel {
        max-width: calc(100% - 20px) !important;
        min-width: calc(100% - 20px) !important;
    }

	.floating_menu { max-width: 100% !important; }	
}
@media only screen and (max-width: 0px) 
{
	.collapser_dummy_B {
		display:flex;
	}
	.collapser_elm_B {
		display:none;
	}
}


@media only screen and (min-height: 500px) 
{
	.collapser_dummy_h500 {
		display:none;
	}
}
@media only screen and (max-height: 500px) 
{
	.collapser_dummy_h500 {
		display:flex;
	}
}

/*  title  */

@media only screen and (min-width: 400px) {
	#main_title { font-size: 12px; }
	#main_subtitle { font-size: 8px; }
	#main_titlebox { line-height:9px; }
}
@media only screen and (min-width: 600px) {
	#main_title { font-size: 14px; }
	#main_subtitle { font-size: 10px; }
	#main_titlebox { line-height:11px; }
}
@media only screen and (min-width: 800px) {
	#main_title { font-size: 15px; }
	#main_subtitle { font-size: 12px; }
	#main_titlebox { line-height:13px; }
}
@media only screen and (min-width: 1000px) {
	#main_title { font-size: 16px; }
	#main_subtitle { font-size: 14px; }
	#main_titlebox { line-height:15px; }
}
@media only screen and (min-width: 1200px) {
	#main_title { font-size: 16px; }
	#main_subtitle { font-size: 16px; }
	#main_titlebox { line-height:17px; }
}
@media only screen and (max-width: 600px) {
	#ewmap_icon { display: none; }
}
@media only screen and (max-width: 400px) {
	#main_title { font-size: 10px; white-space: normal; }
	#main_subtitle { display:none; font-size: 6px;}
	#main_titlebox { line-height: 7px; }
}
@media only screen and (max-width: 300px) {
	#main_titlebox { display:none;}
}

/*  logotip  */

#app_icon { height:25px; width:auto; margin-right:5px;} 
#app_icon_square { height:25px; width:25px; margin-right:5px; display:none;}
#app_icon_small { height:25px; width:auto; margin-right:5px; display:none;}

#entity_icon { height:25px; width:auto; }
.header_icon_link { height:25px; }

@media only screen and (max-width: 500px) {
    #app_icon:not(.nonresponsive) {display:none;}
    #app_icon_square:not(.nonresponsive) {display: block;}
    #app_icon_small:not(.nonresponsive) {display: block;}
}
