@media all and (max-width: 1190px){
    #default_top { 
        width: 920px;  
    }
    .default_wrapper{
        width: 900px;   
    }

    #default_right #map_container {  
        width: 635px;
    }
    #default_right #default_content{

        width: 650px; 
    }
    #default_right #map_container #map {
        width: 635px;
        height: 300px; 
    }
    #default_right #default_content #extra_content {
        width: 100%;
        float: none;
        margin-right: 0;
        padding-top: 20px;
    }
}

/* role page */ 
@media all and (max-width: 950px){
    .default_menu li a img {
        vertical-align: middle;
    }
    .default_wrapper {
        width: 97%;
        margin-left: auto; 
        margin-right: auto; 
    }
    .default_wrap { 
        width: 100%;
        height: initial;
        margin: 0 auto;
        background-position: top center;
    }
    #default_top {
        width: 100%;
        margin-top: 70px;
    }
    #default_left {
        float: none;
        width: 100%; 
    }
    #default_left {
        float: none;
        width: 100%;
        position: relative;
        display: flex;
        flex-wrap: wrap;
    }
    .default_menu {
        width: 100%; 
        padding-bottom: 0;
    }
    #default_left .user_info {
        width: 100%; 
    }
    .visitor_tracker a{
        display: block; 
        margin: auto; 
        text-align: center; 
    }
    #default_right {
        float: none;
        width: 95%;
        margin-left: auto;
        margin-right: auto; 
    }
    * {
        box-sizing: border-box;
    }
    #default_right #map_container {
        width: 100%;
    }
    #default_right #map_container #map {
        width: 100%;
        height: initial;
        aspect-ratio: 2/1;
        background-size: cover;
    }
    #map #map_c_right { 
        width: 330px;
        height: 70px; 
    } 
    #default_right #default_content #main_content .main_head, 
    #default_right #default_content, 
    #default_right #default_content #main_content .main_head,
    #default_right #default_content #main_content,
    .startside_main {
        width: 100%;
    } 
    .startside_main .start_left, .startside_main .start_right {
        float: none;
        width: 100%; 
        max-height: initial;
    }
    #default_right #default_content #main_content .main_head { 
        height: initial;
        margin: 0;
        background: url(../images/default_main_heading.png) center top no-repeat;
        font-family: Comfortaa;
        width: 100%;
    }
    .visitor_tracker {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 100%;
    }

    .visitor_tracker img {
        max-width: 100%; 
    }
    html, body {
        overflow-x: hidden; 
    }
    .main_menu_area {
        width: 210px;
        background-color: #000;
        position: fixed;
        left: -220px;
        top: 0;
        transition: 0.5s;
        height: 100vh;
        padding-top: 30px;
        overflow: auto;
        z-index: 999999999; 
    }
    
    .main_menu_area.active_menu {
        left: 0; 
    }
    .mainHeaderLogoArea {
        display: flex; 
        justify-content: flex-start;
        
    }
    .mobile_menuToggler {
        height: 40px; 
        width: 40px; 
        margin-left: auto; 
        border: 1px solid #fff; 
        display: inline-flex;
        justify-content: space-between;
        flex-direction: column;
        padding: 5px; 
        position: relative;
        z-index: 999;

    }
    .mainHeaderLogoArea a:empty {
        display: none; 
    }
    .mobile_menuToggler:before, 
    .mobile_menuToggler:after {
        content: ''; 
        display: block; 
        height: 1px ; 
        background:  #fff; 
        width: 90%; 
        margin: auto;
        transition: 0.5s;  
        transform: rotate(0); 
    }
    .mobile_menuToggler.active:before{ 
        transform: rotate(45deg) translate(7px, 7px);
    }

    .mobile_menuToggler.active:after{

        transform: rotate(-45deg) translate(7px, -7px);
    }

    .mobile_menuToggler span {
        opacity: 1; 
        transition: 0.5; 
        display: block;  
        height: 1px ; 
        background:  #fff; 
        width: 90%; 
        margin: auto; 
    }

    .mobile_menuToggler.active span  {
        opacity: 0; 
    }
    #default_main > div .left .bg_c {
        width: 100% !important; 
    }
}

@media all and (max-width: 700px){
    .default_header { 
        width: 330px;
        height: 50px; 
        background-size: contain;
    }
    .terms_wrap { 
        width: 320px; 
    }
    #map #map_c_right { 
        max-width: 100%;
    }
    .bg_c{
        width: 100% !important; 
        max-width: 100% !important; 
    }
}

@media all and (max-width: 600px) {
    #default_top { 
        margin-top: 30px;
    }
    #default_right #default_content #main_content .main_head h1 a { 
        font-size: 14px;
    }
    #map #map_c_right {
        max-width: 100%;
        top: unset;
        bottom: 0;
    }
}