.xxxx{        
        z-index: 1;

        display: none;

        position: fixed;
        top: 0;
        width: 100%;
        height: 100%;       
        max-width: 1280px;
        overflow: auto;
        background-color: rgba(0,0,0,0.4);
    }

.fx-animate-drawer-right2left {
    /*position: absolute;*/
    top:0px;
    animation: animateright 0.8s;

}

.fx-modal-4_drawer_right {

    margin: auto;

    margin-right: 0px;

    /*background-color: #fff;*/

    position: relative;

    padding: 0;

    outline: 0;            

    top: 0;            

}

.container_1{padding-left:1px;padding-right:1px;}

.container_2{padding-left:2px;padding-right:2px;}

.container_4{padding-left:4px;padding-right:4px;}

.padding_0{padding: 0px;}

.display_flex{

    display :flex;

}

.flex_justc_c{justify-content: center;}

.flex_justc_s{justify-content: flex-start;}

.flex_justc_e{justify-content: flex-end;}

.flex_justc_spa{justify-content: space-around;}

.flex_justc_spb{justify-content: space-between;}

.nav_bar_top{max-height: 50px;}

.nav_bar_top .nvbt_logo img{max-height: 42px!important;}

.nvbt_item{

    margin-left:8px!important ;

    margin-right:8px!important ;

    padding: 8px 2px 4px 2px;

}

.drawer_left{margin-right:8px;  cursor:pointer;}

.drawer_right{margin-left:8px; cursor:pointer;}

.nav_bar_top * {font-size: 1.3rem;}

@media (max-width: 320px){

    .nav_bar_top * {font-size: 1.05rem;}

    .nav_bar_top .nvbt_logo img{max-height:25px!important;}

    .drawer_left{margin-right:8px;}

    .drawer_right{margin-left:8px;  }

    img{max-width: 320px;}

}

.article_card_g{

    display:grid;

    grid-template-columns: 1fr 1fr 1fr 1fr;

    gap:1px;

    margin-top: 10px;

}

@media(max-width:800px){

        .article_card_g{

    display:grid;

    grid-template-columns: 1fr 1fr 1fr;

    gap:1px;

    }

}

@media(max-width:568px){

        .article_card_g{

        display:grid;

        grid-template-columns: 1fr 1fr ;

        gap:1px;

    }

}

@media(max-width:319px){

        .article_card_g{

        display:grid;

        grid-template-columns: 1fr;

        gap:1px;

    }

}

a{text-decoration: none;}

.w3x-container, .w3x-panel {

    padding: 0.01em 16px;

}

.cmd_o{ 

    display:flex;

    background-color:whitesmoke;

} 

.cmd_o_elem{

        background-color: white;

    width:100%;

    min-width:270px; 

    border:solid 1px #ccc; 

    border-radius: 5px; 

    margin:10px 0px;} 

.cmd_o_header{

    display: block;

    border:solid 1px #ccc;

    border-left: 0;

    border-right-style: none;          

    position:relative;        

}

.cmd_o_header_right{            

    float:right;

}

.cmd_o_nav {

    background-color: #f1f1f1;

    display: grid;

    grid-template-columns: 1fr 1fr 1fr 1fr;

    gap: 10px;

    padding: 16px;

}

.cmd_o_nav > *{ 

    border: solid 1px #ccc; 

    min-width:100px;

    min-height: 100px; 

    width:100%;

    padding: 16px;        

}    

.cmd_o_nav > nav{

    background-color: white;

    padding: 16px!important;

    overflow: hidden;

    border-radius: 5px;

    white-space: nowrap;

    text-overflow: ellipsis;    

}

.cmd_o_nav_article{color:auto}

.cmd_o_footer{       

    border-top:solid 1px #ccc;

    border-bottom:solid 1px #ccc;

}

@media (max-width:968px) {

    .cmd_o_nav {

        background-color: #f1f1f1;

        display: grid;

        grid-template-columns: 1fr 1fr 1fr;

        gap: 10px;

        padding: 16px;

    }

} 

@media(max-width:560px){

    .cmd_o{ 

        display:block;

    }

    .cmd_o> *{

            margin-bottom: 30px;

    }

    .cmd_o_nav {

            background-color: #f1f1f1;

            display: grid;

            grid-template-columns: 1fr 1fr;

            gap: 10px;

            padding: 16px;

    }

}

.f1f1f1{

    background-color: #f1f1f1;

}