body,div,span,a,h1,h2,h3,h4,h5,h6
{ 
    font-weight:  400;
    font-family: Arial;
    line-height: 1.15;
    font-style: normal;
    margin: 0px;
    padding: 0px;
    font-weight: normal;
}
p{
    margin: 16px;
    margin-left: 0px;
    margin-right: 0px;
}

a {
    text-decoration: none;
    color:#000000;
}
.display_none
{
    display: none;
}


.main_body
{
    margin:0px;
    padding:0px;
    background: #f0f0f0;
}

.main {
    display: flex;
    flex-wrap: wrap;
    position: relative;
    width: 100%;
    max-width: 1100px;

    background:  #ffffff;

    margin: auto;
}  

.head {
    display: flex;
    flex-wrap: wrap;
    position: relative;
    width: 100%;
    max-width: 1100px;
    background:  #ffffff;
    margin: auto;

}

.footer {
    display: flex;
    flex-wrap: wrap;
    position: relative;
    width: 100%;
    max-width: 1100px;
    margin: auto;
    height: 40px;
}


@media (min-width: 1116px) {        
    .center_col {

        position: relative;
        min-height: 1px;
        -webkit-box-flex: 0;


        -webkit-flex: 0 0 68%;
        -ms-flex: 0 0 68%;
        flex: 0 0 68%;
        max-width: 68%;
        /*
        background:   #231E28;
        */
    }

    .right_col {
        flex: 0 0 350px;

        max-width: 350px;
        /*
        background-color:  #00c8f7; 
        */
    }


}
@media (max-width: 1115px) {        
    .center_col {

        position: relative;
        min-height: 1px;
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 100%;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;

        /*
        background:   #231E28;
        */
    }
    .right_col {
        flex: 0 0 100%;

        max-width: 100%;
        /*
        background-color:  #00c8f7; 
        */
    }



}



@media (max-width: 800px) {
    .right_col_disp_none {
        display: none;
    }              
}

.div_menu
{
    width: 100%;

    padding: 0px 20px 20px 0px;
    text-align: right;
    max-height: 9001em;
}
.a_menu {
    color: #000000;
    text-decoration: underline;
    font-size: 18px;
}

.div_main_title {
    width:100%;
    margin: 10px 20px 10px 20px;
    text-align: center;
    max-height: 9001em;
}
.h_main_title {
    font-size: 22px;
}

.input_search {
    width: -moz-available;
    width: -webkit-fill-available; 
    height: 40px;
    padding-left: 10px;
    padding-right: 10px;
    font-size: 16px;
    -webkit-border-radius: 20px;
    border-radius: 20px;
    border-style:  solid;
    border-width: 1px;
    border-color:  #000000;
}

.button_search
{
    margin-left: 18px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    cursor: pointer;
    color: #ffffff;

    background: #000000;
    border-style:  solid;
    border-width: 1px;
    border-color: #000000;
    width: 140px;
    height: 40px;

    font-size: 19px;
}

.div_search
{
    margin: 0px 4px 20px 4px;
}

.form_search {

    position: relative;
    width: 100%;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px; 

}
.div_search_btns
{
    padding-left: 20px;
}
.search_type {
    color: #000000;
    text-decoration: none;
    font-size: 13px;
    padding: 10px;
    cursor: pointer;
    font-size: 17px;
    display: inline-block;
}
.search_type_active {
    text-decoration: underline;
}

.div_main_genry_block
{
    width:100%;

}
.div_genre_list
{
    width:100%;
    text-align: justify;
    padding-top: 15px;
}

.h3_genre {
    text-decoration: underline;
    cursor: pointer;
    text-align: center;
    width:  max-content;
    margin: auto;
}
.h3_genre2 {
    padding: 0px;
    margin: auto;
}

.a_genre {
    color: #000000;
    text-decoration: none;
    font-size: 14px;
    font-weight: bold;
    padding: 7px;

    -webkit-border-radius: 10px;
    border-radius: 10px;

    border-style:  solid;
    border-width: 1px;
    border-color: #000000;
}

.h_genre {
    font-size: 14px;
    font-weight: bold;
    display: inline-block;
}

.a_genre_active {
    color: #ffffff;
    background: #000000;
    text-decoration: none;
    font-size: 14px;
    font-weight: bold;
    padding: 7px;

    -webkit-border-radius: 10px;
    border-radius: 10px;

    border-style:  solid;
    border-width: 1px;
    border-color: #000000;
}

.div_genre {
    margin: 10px;
    display: inline-block;
    text-align: center;
    padding-top: 2px;
    padding-bottom: 2px;
}
.div_genre2 {
    margin: 10px;
    display: flex;
    text-align: center;
    padding-top: 2px;
    padding-bottom: 2px;
}

.div_genre_header {
    padding-top: 10px;
    width: 100%;
}


.a_book_block
{
    display: contents;
}

.book_ramka
{

    -webkit-border-radius: 10px;
    border-radius: 10px;

    border-style:  solid;
    border-width: 1px;
    border-color: #000000;


    margin: 20px;
    padding: 10px 10px 10px 10px;



}
.book_name {
    display:flex;

    height: 100%;

    text-align: left;

    color: #000000;
    font-size: 24px;

    margin-left: 14px;
    margin-right: 10px; 
}
.book_author {
    display:flex;
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 20px;
    margin-bottom: 20px;

    width: 100%;
    text-align: left;

    color: #000000;

    font-size: 19px;

}

.book_ramka_inf
{
    width:100%;
    display:flex;


}
.book_ramka_left{

    width: 60%;
    display:  inline-block;
    margin: auto;

}
.book_ramka_right{
    margin: 0px;
    padding: 0px;
    width: 40%;
    display:  inline-block;
    text-align: right;
}
.book_seriya
{
    padding: 12px;

}
.book_genre
{
    padding: 12px;

}
.book_r
{
    padding: 12px;
}
.book_span_seriya
{         
    font-size: 18px;

}
.span_book_r
{
    font-size: 16px;
    text-decoration: none;
    display: inline-block;
}
.span_book_r_digit
{
    font-size: 24px;
    text-decoration: none;
}
.book_span_genre
{
    font-size: 18px;

    text-decoration: none;
    display: inline-block;
}

.book_img
{


    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: grayscale(100%);
    width: 120px;
    margin-right:10px;
    margin-bottom: 3px;
}

/* Paging */
.div_paging_block
{
    display: block;
    margin: 0px 0px 18px 0px;
    text-align: center;
    padding-bottom: 20px;
}
.a_paging {
    color: #ffffff;
    background: #000000;
    text-decoration: none;
    font-size: 18px;
    padding: 10px;

    -webkit-border-radius: 10px;
    border-radius: 10px;

    border-style:  solid;
    border-width: 1px;
    border-color: #000000;
    width: 50px;
    display: inline-block;

    margin: 5px;
    font-family: Arial;

}
.a_paging_active {
    color: #000000;
    text-decoration: none;
    font-size: 18px;
    font-weight: bold;
    padding: 8px;

    -webkit-border-radius: 10px;
    border-radius: 10px;

    border-style:  solid;
    border-width: 2px;
    border-color: #000000;
    width: 50px;
    display: inline-block;

    margin: 5px;
    font-family: Arial;
}
.a_paging_active_dark {
    color: #ffffff;
    text-decoration: none;
    font-size: 18px;
    font-weight: bold;
    padding: 6px;

    -webkit-border-radius: 10px;
    border-radius: 10px;

    border-style:  solid;
    border-width: 2px;
    border-color: #ffffff;
    width: 50px;
    display: inline-block;

    margin: 5px;
    font-family: Arial;
}

/* Правая колонка*/
.ramka_right_col
{
    -webkit-border-radius: 10px;
    border-radius: 10px;

    border-style:  solid;
    border-width: 1px;
    border-color: #000000;

    padding: 10px;
    margin: 20px;
    display: block;
}

/* Footer */
.footer_main
{
    padding: 20px;
    display: flex;
    width: 100%;
}
.footer_link
{
    margin: 0px auto 0px 0px;
}
.footer_counter
{
    margin: 0px 0px 0px auto;
}

/* Share_social */
/* MaterialDesignIcons.com */
@font-face {
    font-family: "Material Design Icons";
    src: url("https://r.in-book.co/body/f_b/materialdesignicons/materialdesignicons-webfont.eot?v=2.3.54");
    src: url("https://r.in-book.co/body/f_b/materialdesignicons/materialdesignicons-webfont.eot?#iefix&v=2.3.54")
        format("embedded-opentype"), url("https://r.in-book.co/body/f_b/materialdesignicons/materialdesignicons-webfont.woff2?v=2.3.54") format("woff2"),
        url("https://r.in-book.co/body/f_b/materialdesignicons/materialdesignicons-webfont.woff?v=2.3.54") format("woff"),
        url("https://r.in-book.co/body/f_b/materialdesignicons/materialdesignicons-webfont.ttf?v=2.3.54") format("truetype"),
        url("https://r.in-book.co/body/f_b/materialdesignicons/materialdesignicons-webfont.svg?v=2.3.54#materialdesigniconsregular") format("svg");
    font-weight: normal;
    font-style: normal; }

.mdi-mail-ru:before {
    content: "\F34C"; }

.mdi-twitter:before {
    content: "\F544"; }


.mdi-odnoklassniki:before {
    content: "\F3C5"; }

.mdi-faceknigabook:before {
    content: "\F20C"; }


.mdi-vk:before {
    content: "\F579"; }

.mdi-arrow-up-drop-circle:before {
    content: "\F062"; }


.mdi-arrow-down-drop-circle:before {
    content: "\F04A"; }


.mdi-magnify:before {
    content: "\F349"; }

.mdi-magnify-minus:before {
    content: "\F34A"; }



.mdi-magnify-plus:before {
    content: "\F34B"; }


.mdi-knigadownload:before {
    content: "\F1DA"; }


.mdi-file:before {
    content: "\F214"; }

.mdi:before,
.mdi-set {
    display: inline-block;
    font: normal normal normal 50px/1 "Material Design Icons";
    font-size: 24px;
    text-rendering: auto;
    line-height: inherit;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale; 
    color: #ffffff; 
    background: #000000;
}

.div_soc_icons_block
{ 
    width: 100%;
    margin: 0px 0px 0px 0px; 
    padding: 0px 0px 0px 0px;
    display: block;

}
.div_soc_text
{
    display: inline-block;
    margin: 0px 0px 10px 0px;
    padding: 0px 0px 0px 0px;
    font-size: 15px;
    width: 100%;

    text-align: center;
}
.div_soc_icons
{  
    text-align: center;
    display: block;
    width: 100%;
    margin: 0px 0px 0px 0px;
    padding: 0px;

}

.a_social_icon
{
    background: #000000;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    padding: 4px 12px 4px 12px;
    display: inline-block;
    margin: 0px 0px 0px 0px;
}

/* Book_view */
.div_book_name {
    display: flex;
    text-align: left;
    margin-left: 14px;
    margin-right: 10px; 
}
.div_book_author
{  
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 20px;

    width: 100%;
}
.a_book_author {
    text-decoration: underline;

    margin-left: 0px;
    margin-right: 0px;
    color: #000000;
    font-size: 19px;
}
.a_book_translator {
    text-decoration: underline;
    margin-left: 0px;
    margin-right: 0px;
    color: #000000;
    font-size: 18px;
}
.h_book_name {
    display: inline-block;
    color: #000000;
    font-size: 24px;
    text-align: left;
}


@media (min-width: 801px) {

    .book_ramka_inf2
    {
        width:100%;
        display:flex;
        margin-top: 20px;
    }


    .book_ramka_left2{

        width: 60%;
        display:  inline-block;
        margin: auto;

    }
    .book_ramka_right2{
        margin: 0px;
        padding: 0px;
        width: 40%;
        display:  inline-block;
        text-align: right;
    }
    .book_img2
    {
        -webkit-filter: grayscale(100%);
        -moz-filter: grayscale(100%);
        -ms-filter: grayscale(100%);
        -o-filter: grayscale(100%);
        filter: grayscale(100%);
        width: 160px;
        margin-right:15px;
        margin-bottom: 0px;
    }

    .div_book_r
    {
        padding: 0px 45px 0px 0px;

    }
    .span_book_r2
    {
        font-size: 16px;
        color: #000000;
        text-decoration: none;

    }
    .span_book_r_digit2
    {
        font-size: 24px;
        color: #000000;
        text-decoration: none;
    }
    .span_vote_block
    {
        margin-right: 3px; 

    }

}
@media (max-width: 800px) {
    .book_ramka_inf2
    {
        display: flex;
        width: 100%;
        margin-top: 20px;
        flex-direction: column-reverse;
    }

    .book_ramka_left2{


        width: 100%;
        margin: auto;
        display: block;
        text-align: left;
    }
    .book_ramka_right2{



        padding: 0px;
        display: block;
        margin: auto; 


    }
    .book_img2
    {  
        -webkit-filter: grayscale(100%);
        -moz-filter: grayscale(100%);
        -ms-filter: grayscale(100%);
        -o-filter: grayscale(100%);
        filter: grayscale(100%);
        width: 160px;
        margin-bottom: 0px;
    }


    .div_book_r
    {
        padding: 0px;
        margin: 0px 0px 10px 0px;
        text-align: center;
    }
    .span_book_r2
    {

        font-size: 16px;
        color: #000000;
        text-decoration: none;

    }
    .span_book_r_digit2
    {
        font-size: 24px;
        color: #000000;
        text-decoration: none; 
    }
    .span_vote_block
    {
        margin: 0px; 

    }

}

.div_book_seriya
{
    padding: 12px;

}
.div_book_genre
{
    padding: 12px;
}
.div_book_year
{
    padding: 12px;
    font-size: 18px;
    color: #000000;
}
.div_book_translator
{
    padding: 12px;
    font-size: 16px;
    color: #000000;
}

.a_book_seriya
{         
    font-size: 18px;
    color: #000000;
    text-decoration: underline;
    display: inline-block;
}

.a_book_genre
{
    font-size: 18px;
    color: #000000;
    text-decoration: underline;
    display: inline-block;
}

.a_book_vote
{
    font-family: Courier;
    font-size: 30px; 
    color: #000000;
}
.div_book_anons
{
    display: flex;
    margin: 0px 0px 20px 0px;
}
.div_inagent
{
    display: flex;
    margin: 20px 0px 20px 0px;
    font-size: 27px;
    font-weight:  bold;
}
.div_book_inagent
{
    -webkit-border-radius: 10px;
    border-radius: 10px;
    border-style:  solid;
    border-width: 1px;
    border-color: #000000;

    display: flex;
    margin: 20px; 
    padding: 10px 10px 10px 10px;
    font-size: 27px;
    font-weight:  bold;
}
.span_book_anons
{
    font-size: 15px;
    text-align: justify;
}
.div_buttons
{
    margin: 10px 5px 10px 0px;  
    text-align: right;   
}
.a_buttons
{
    margin: 8px 10px 0px 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    color: #ffffff;

    background: #000000;
    width: 110px;
    padding: 9px; 

    font-size: 19px;
    display: inline-block;
    text-align: center;

}
.div_msg_closed
{
    -webkit-border-radius: 10px;
    border-radius: 10px;
    border-style:  solid;
    border-width: 1px;
    border-color: #000000;
    margin: 20px;
    padding: 10px 10px 10px 10px;
    font-size: 16px;
}
.div_msg_notfull
{
    -webkit-border-radius: 10px;
    border-radius: 10px;
    border-style:  solid;
    border-width: 1px;
    border-color: #000000;
    margin: 20px;
    padding: 10px 10px 10px 10px;
    font-size: 16px;
}

/* author_view */

.div_block_author_inf
{                   

    display: block;  
    padding: 12px;

}
.div_author_view_str
{                   
    margin: 5px 0px 5px 0px;
    width: 100%;
    display: flex;
}
.div_author_header
{
    font-size: 16px;
    color: #000000;

    display: inline-flex;
    width: 150px;
}
.div_author_inf
{
    font-size: 16px;
    color: #000000;
    display: flex;
    word-break: break-all;
    width: 150px;
}
.div_block_bio
{
    margin-top: 0px; 
    margin-bottom: 10px;
}
.h_bio_header
{
    font-size: 16px; 
    font-weight: normal;
}

/* Список книг в строчку */
@media (max-width: 800px) {

    .div_str_book_similar_name
    {
        margin: 5px 0px 5px 0px;
        width: 100%;
        display: block;

    }
    .div_str_book_similar_left
    {
        display: block;
    }
}
@media (min-width: 801px) {
    .div_str_book_similar_name
    {
        margin: 5px 0px 5px 0px;
        width: 100%;
        display: flex;

    }
    .div_str_book_similar_left
    {
        display: inline-flex;
        width: 570px;
    }

}
.div_block_book_similar_header
{
    display: block;
    margin: 5px 15px 15px 15px; 
}
.div_block_book_similar
{
    display: block;
    margin: 0px 0px 0px 0px;
}
.div_series_name
{
    margin: 10px 0px 10px 15px;
}

.div_str_book_r_right
{
    display: inline-flex;
    margin-left: auto;

}
.h_book_similar_series
{
    display: inline-block;
    font-size: 18px;
    color: #000000;
}
.h_book_similar_book_name
{
    display: flex;
}
.span_book_similar_n
{
    font-size: 15px;
    color: #000000;
    font-weight: normal;
}
.a_book_similar_series
{
    display: inline-block;
    font-size: 18px;
    color: #000000;
    text-decoration: underline;
}
.a_book_similar_book_name
{
    display: inline-block;
    font-size: 15px;
    color: #000000;
    text-decoration: underline;
}
.span_book_similar_book_r_digit
{
    font-size: 15px;
    color: #000000;
    display: inline-block;
}
.span_book_similar_book_r
{             
    font-size: 13px;
    color: #000000;
    display: inline-block;
}

/* series_view */
.block_series_view
{
    width: 100%;
    display: block;
}
.div_s_view_str
{
    width: 100%;
    display: flex;
    margin-bottom: 15px;
}
.div_s_view_name
{
    margin: 0px auto 0px 14px;
    padding-right: 20px; 
}
.div_s_view_r
{
    margin-left: auto;
    display: ruby;
}
.div_s_view_author
{
    display: flex;
    margin-bottom: 10px;
    margin-top: 15px;
}

.a_s_view_author
{
    color: #000000;
    font-size: 18px;
}

.h_s_view_name
{
    color: #000000;
    font-size: 20px;
}

.span_s_view_r_digit
{
    font-size: 20px;
    color: #000000;
    display: inline-block;
}
.span_s_view_r_text
{             
    font-size: 13px;
    color: #000000;
    display: inline-block;
}

/* book_read */

@media (max-width: 850px) {
    .block_read_text
    {
        text-align: justify;
        -webkit-border-radius: 10px;
        border-radius: 10px;

        border-style:  solid;
        border-width: 0px;
        border-color: #000000;


        margin: 20px 0px 20px 0px;
        padding: 10px 10px 10px 10px;
        word-wrap: break-word;

    }

}
@media (min-width: 851px) {
    .block_read_text
    {
        text-align: justify;
        -webkit-border-radius: 10px;
        border-radius: 10px;

        border-style:  solid;
        border-width: 1px;
        border-color: #000000;


        margin: 20px;
        padding: 10px 10px 10px 10px;
        word-wrap: break-word;

    }

}
.div_read_settings
{
    display: flex;
    margin-bottom: 15px;

}
.div_read_panel {
    padding: 0px;
    display: flex;
    margin: auto;
}
.div_read_panel2 {
    padding: 0px 0px 0px 0px;
    display: flex;

}
.div_read_view_r
{
    margin-left: auto;
    display: ruby;
}

.h_font_header {
    margin-top:10px;
    margin-right: 7px;
    font-size: 15px;
}
.select_font {
    margin-right: 3px;
    border-color: #00ad45;
    width: 130px;
    cursor: pointer;
    height: 37px;
}
.option_font{
    font-size: 12px;
}
.button_plus_minus{
    width: 37px;
    height: 37px;
    background: #000000;
    color: #ffffff;
    cursor: pointer;
    border: none;
    margin: 0px 3px 0px 3px;  
    font-size: 25px;
}

.button_dark{
    width: 37px;
    height: 37px;

    cursor: pointer;
    border: none;  
    margin: 0px 3px 0px 3px;
    border: 1px solid #00ad45;
}
.a_back
{
    color: #000000;
    font-size: 22;
    text-decoration: underline;
}

.white_color {
    color: #ffffff;
}
.dark_bg {
    background: #000000;
}
.gray_bg
{
    background: #f0f0f0;
}
.dark_color {
    color: #000000;
}
.div_img
{
    text-align: center;
}
.img_in_r
{
    width: 298px;
    margin: 4px;
}
.div_read_note
{
    display:none;
    position:absolute;
    z-index:100;font-size:17px;
    opacity:.9;
    color:#000000;
    font-weight:300;
    max-width:300px;
    padding:0px 5px 0px 5px;
    background:#ffffff;
    border:1px solid #eee;
    -webkit-border-radius:2px;
    border-radius:2px;
    -webkit-box-shadow:2px 2px 5px #777;
    box-shadow:2px 2px 5px #777;
}
.a_read_note
{
    color: #000000;
    text-decoration: none;

}

/* book_dl */

.div_block_files
{
    width: 100%;

    display: block;
    text-align: center;
    margin: 20px 0px 20px 0px;
}
.div_header_files
{
    display: block;
    margin: 10px 30px 10px 30px;
}
.div_block_files_line
{
    display: flex;
    width: 300px;
    margin: 10px auto 10px auto;
}
.div_left_files
{
    width: 100px;
    display: flex;

    font-size: 20px;
}
.div_right_files
{
    display: flex;
    margin-left: auto;
}
.h_header_files
{
    font-size: 20px;
}
.a_file
{
    font-size: 20px;
    color: #000000;
    text-decoration: underline;
}

.div_help_share
{
    max-height: 9001em;
    font-size: 18px;
    display: block;
    margin: 20px 15px 20px 15px;
}
.a_disable
{
    cursor: not-allowed;
    opacity: 0.5;
}
.a_help_share
{
    font-size: 18px;
    color: #000000;
    text-decoration: underline;
}

/* status 404 */
.div_status_page
{
    margin: 20px;
}
.h_status_page
{
    font-size: 20px;
}

/* Contacts */
.div_block_message
{

}
.div_mes_err
{
    margin: 20px 0px 20px 20px;
}
.h_mes_err
{
    font-size: 18px;
    margin-bottom: 5px; 
}
.span_mes_err
{
    font-size: 16px;
    display: block;
}

.form_mes
{
    width: 100%;
}
.div_form_header
{
    display: block;
    margin: 10px 10px 10px 20px;
}
.div_form_input
{
    display: block;
    margin: 0px 0px 20px 0px;
}
.div_form_textarea
{
    text-align: right;
    margin: 0px 20px 20px 0px;
}
.span_name
{
    font-size: 18px;
}
.input_name
{
    width: 99%;
    font-size: 18px;
    height: 30px;
    font-weight: normal;
}
.textarea_txt
{
    font-size: 18px;
    width: 99%;
    height: 100px; 
    color: #000000;
    font-family: MS Shell Dlg 2;
}
.button_send
{
    margin-left: 18px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    cursor: pointer;
    color: #ffffff;

    background: #000000;
    border-style:  solid;
    border-width: 1px;
    border-color: #000000;
    width: 120px;
    height: 35px;

    font-size: 16px;
}

/* Author_list */

.a_author_l_str
{
    display: flex;
    color: #000000;
    margin: 20px;
}

@media (min-width: 701px) {
    .div_author_str
    {
        -webkit-border-radius: 10px;
        border-radius: 10px;

        border-style:  solid;
        border-width: 1px;
        border-color: #000000;


        padding: 10px 10px 10px 10px;
        width: 100%;
        display: flex;
    }
    .div_author_l_name
    {
        width: 320px;
        display: inline-block;
    }
    .div_author_l_count
    {
        width: 130px;
        display: flex;
        margin-left: auto;
    }
    .div_author_l_r
    {

        display: flex;
        margin-left: auto;
    }
    .span_author_l_r_txt
    {
        font-size: 14px;
        padding-top: 3px;
    }
}
@media (max-width: 700px) {
    .div_author_str
    {
        -webkit-border-radius: 10px;
        border-radius: 10px;

        border-style:  solid;
        border-width: 1px;
        border-color: #000000;

        padding: 10px 10px 10px 10px;
        display: block;
        width: 100%;
    }
    .div_author_l_name
    {
        width: 100%;
        display: block;
    }
    .div_author_l_count
    {
        width: 100%;
        display: block;

    }
    .div_author_l_r
    {
        width: 100%;
        display: block;

    }
    .span_author_l_r_txt
    {
        font-size: 14px;
        display: inline-block;
    }
}



.h_author_l_name
{
    font-size: 18px;
    display: contents;
}
.span_author_l_r_digit
{
    font-size: 18px;
}

/* comments */
.input_comment
{
    width: -moz-available;
    width: -webkit-fill-available;
    font-size: 15px;
}
.text_comment
{
    width: -moz-available;
    width: -webkit-fill-available;
    font-size: 15px;
    height: 80px;
}
.a_btn_comment {
    margin: 8px 5px 0px 5px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    color: #ffffff;
    background: #000000;
    width: 100px;
    padding: 6px;
    font-size: 16px;
    display: inline-block;
    text-align: center;
}
.comment_header {
    display: flex;

    text-align: center;
    color: #000000;
    font-size: 16px;
    margin-left: 14px;
    margin-right: 10px;
    margin-bottom: 10px;
}
.comment_name {
    margin-bottom: 3px;
    margin-left: 5px;
    font-size: 15px;
}
.comment_text {
    margin-bottom: 6px;
    font-size: 15px;
}
.comment_date {
    margin-bottom: 10px;
    font-size: 12px;
    text-align: right; 
}


@media (max-width: 800px) {
    .audio_p {
        margin:0px;
        text-align: center;
    }
    .audio_file {
        width:100%;
    }

}
@media (min-width: 801px) {
    .audio_p {
        text-align: center;
    }
    .audio_file {
        width:100%;
    }
}