.drop_boxs {padding: 5px; border-bottom: 2px #ddd solid; background-color: #f5f5f5; width:100% }

.right_chat {width: 85%; float: right; text-align: center; font-size: 14px;}
.left_chat {width: 85%; float: left;text-align: center; font-size: 14px;}
.top_chat {text-align: center; font-size: 13px; padding-top: 15px;}

.otvet_chat {width: 92%; float: left; border: 0px solid #ccc; padding: 5px; padding: 2px; border-left: 2px #2A9E89 solid; padding-left: 4px; 
             font-size: 12px; background-color: #fff; overflow: auto; overflow:  hidden;}

.otvet_chat_name {width: auto; float: left; color: #777; font-size: 10px; margin-top:-10px ; margin-left: 0px; }


.text_messages_right {width: 70%; float: right; border: 0px solid #E0E0E0; padding: 10px;  border-radius: 15px; background-color: #ffffff;}
.text_messages_left {width: 70%; float: left;border: 0px solid #E0E0E0; padding: 10px;border-radius: 15px; background-color:  #ffffff;}
.text_messages_center {width: 50%; border: 0px solid #000; margin-left:25%; padding: 10px;border-radius: 15px; 
    background-color:  #ffffff; text-align:center;}


.okclick_bottom1{ margin-top:-20px; } 

.send_char_icon {float:left; width: 40px; text-align:center; padding:10px; padding-top: 0px;cursor:pointer; opacity: 0.8}
.send_char_icon:hover {opacity: 1.0;}

.text_messages { border: 2px solid #E0E0E0; padding:20px; text-align: left; }

.main_one_order {padding:4px; text-align: left; background-color: #fff; border: 1px solid #D0D0D0; border-bottom: 0px; 
                 min-height: 520px; padding-top: 0px; margin-top: -40px; padding: 60px;} 

.left_one { border:0px solid; float: left; min-width: 320px; width: 70%; max-width: 900px;}
.right_one { border:0px solid; float: right; min-width: 280px; width: 280px;}
.right_one1 { border:0px solid; float: right; min-width: 290px; width: 290px;}
.right_one2 { border:0px solid; float: right; min-width: 290px; width: 210px;}

.otklik { text-align: left; min-height: 100px; background-color:#f9f9f9; 
          min-height:400px; margin-top:30px; padding:20px 3px 3px; text-align: left; 
         padding:40px; font-size:18px; font-family: Roboto; padding: 60px; }

.knGreen_bt_not,
.knGreen_bt_yes,
.knGreen_bt,
.knGreen {padding: 20px ; background-color:#2A9E89; border-radius:4px; font-weight: 700; cursor: pointer;
                     height:40px; text-align: center; font-size:14px; color:#fff;  line-height:14px; 
                     text-transform: uppercase; max-width:260px; width: 260px; height:10px; border-radius: 4px;
         opacity: 1.0;
   }
.knGreen_bt:hover,
.knGreen:hover {opacity: 0.8; }         

.kn_filts {padding: 20px ; background-color:#fff; border-radius:4px; font-weight: 700; cursor: pointer;
                     height:40px; text-align: center; font-size:14px; color:#fff;  line-height:14px; 
                      max-width:260px; width: 260px; height:10px; border-radius: 4px;
                      border:1px #2A9E89 solid; color:#2A9E89;
         opacity: 1.0;}

.kn_filts1 {border:1px #2A9E89 solid; border-radius:4px; font-weight: 700; cursor: pointer;
                     height:40px; text-align: center; font-size:14px; color:#2A9E89;  line-height:40px;}

.kn_filts:hover {border: 1px  #D4424B solid;}

.show_otherz {text-indent:0em; padding:0px; font-size: 18px;line-height:21.09px; color: #383838; margin-top: 40px;
                  font-family:Roboto; border:0px;}
.string {width: auto; float:left; font-size:14px; padding-top: 5px; font-weight:400; font-family: Roboto;}
.string_gray {width: auto; float:left; font-size:14px; padding-top: 5px; font-weight:400; font-family: Roboto; color:#aaa;}

.bottom_kn {float: right;}

.chat_rmk {padding:20px 70px 70px;}
#srok_date_vip {width: 330px;}
#bes_sd {float:left;}
#add_otklik_ta {width:99%; max-width:99%; height: 240px; border:1px #D0D0D0 solid;}

.you_otklik {margin-top:10px; font-size:16px; border: 1px  #D0D0D0 solid; background-color: #fff; 
             font-family: Roboto; min-height: 100px;}


.foto_lk1 { margin-left: 5px; border-radius:70px;border: 1px solid #E8E8E8;
             background-color:#FFFBFB ;
          width: 100px; height:100px;}
#foto_lk1 {float:left; min-width:120px; min-height:100px;}
.left_att {float:left; width: 30px; text-align:center; padding:10px;  cursor: pointer; }

.kn_area {width: 605px;  padding:0px; }
.knGreen_bt {height:20px; padding:10px;line-height: 20px;  float:right;}
#obraml {text-align:left; margin-top:0px; background-color:#f1f1f1 ; padding: 60px; }
#window_otclick {width:80%; margin-top: 0px;}
#bottom_chat {margin-left: 7%;}


.select_company { width:500px; padding-top:0px; float:left; }
.zag_order {font-size:18px;}

@media  (min-width: 0px) and (max-width: 384px)
{ 
    /* мобильники */

    .chat_rmk {padding:15px 15px 15px;}
    .select_company {clear:both; width:300px;}
    .zag_order {font-size:14px;}
    .top_chat {font-size: 12px;} 
    .main_one_order {padding: 5px;}
    .string {font-size: 13px;}
    #bes_sd {display: none;}
    .right_one {float: inherit; text-align: center;}
    .right_one1{float: left; margin-left:4%; }
    .right_one2 {float: left; margin-left:3%; }
    .show_otherz {margin-top: 10px; padding-bottom: 30px;}
    .otklik {padding:5px; padding-top: 0px; padding-left: 0px; min-height: 10px;}
    #add_otklik_ta {height: 140px; width:93%;}
    .left_one {width: 93%; padding:10px;}
    .lebel_24 {font-size: 16px;}
    .bottom_kn {float: left; margin-left: 4%}
    .br_div {display: block}
    .okclick_bottom1{ margin-top:0px; } 
    #foto_lk1  {float: inherit;}
    .send_char_icon {width: 10px;}
    .knGreen_bt {clear: both;float: left; margin-top: 10px;}
    #obraml {padding: 0px; padding-top: 20px;}
    .kn_area  {width: 280px; margin-top: 20px;}
    .left_att {padding: 0px 0px 0px;}
    #window_otclick {width: 73%;}
    #bottom_chat {margin-left: 0px;}
    .text_messages_center {width:74%; margin-left:12%;}
    
}


@media  (min-width: 385px) and (max-width: 767px)
{ 
    .chat_rmk {padding:15px 15px 15px;}
    .right_chat {width: 100%; float: right;  font-size: 12px;}
    .left_chat {width: 100%; float: left;font-size: 12px;}
 .select_company {clear:both; width:99%;}
    .top_chat {font-size: 12px;} 
    .zag_order {font-size:15px;}
    /* мини планшет*/
    .main_one_order {padding: 20px;}
    .string {font-size: 13px;}
     #bes_sd {display: none;}
     .right_one {float: inherit;}
     .right_one1{float: left;  }
     .right_one2{float: left;  }
     .show_otherz {margin-top: 10px; padding-bottom: 30px;}
    .otklik {padding:5px; padding-top: 0px; }
    #add_otklik_ta {height: 140px;}
    .left_one {width: 99%; padding:5px;}
    .lebel_24 {font-size: 18px;}
    .bottom_kn {float: left; margin-left: 14%}
    .br_div {display: block}
    .okclick_bottom1{ margin-top:0px; } 
    .foto_lk1 {width: 140px; height: 140px;}
    #foto_lk1  {float: inherit;}
    .send_char_icon {width: 10px;}
    .kn_area  {width: 300px; margin-top: 20px;}
    .knGreen_bt {clear: both;float: left; margin-top: 10px;}
    #obraml {padding: 10px; padding-top: 30px;}
    .left_att {padding: 0px 10px 0px;}
    #window_otclick {width: 73%;}
    #bottom_chat {margin-left: 2%;}
    .text_messages_center {width:70%; margin-left:15%;}


}

@media  (min-width: 768px) and (max-width: 1279px) 
{ 
    /* планшеты */
    .main_one_order {padding: 30px;}
    .select_company {clear:both; width:100%;}
    .br_div {display: block}
    #obraml {padding: 30px; padding-top: 50px;}
    .left_att {padding: 0px 10px 0px;}
    #window_otclick {width: 63%;}
    #bottom_chat {margin-left: 5%;}
    .text_messages_center {width:60%; margin-left:19%;}

}

 


@media  (min-width: 1280px) 
{
    /* компьютеры */
    .send_char_icon {width: 10px;}
    .left_att {padding: 0px 10px 0px;}

 
}