.sidebars > .sidebar {
  /* box-shadow: 0 0 1px rgba(0, 0, 0, 0.64); */
  /* box-shadow: 0 0 15px rgba(0, 0, 0, 0.64); */
  /* box-shadow: inset 0 0 1em gold, 0 0 1em red; */
  position: fixed;
}




/*#####################################################################*/
/* ФОРМА КНОПКИ */

.sidebar.right1 {
  top: 20%;
  right: 0;
  bottom: 0;
  width: 55px;
  height: 128px;
  background: transparent no-repeat; /* #448AFF */
  background-size: 90px 220px;
  background-repeat: no-repeat;
  text-align: center;
  cursor: pointer;
  display: none;
  z-index: 999999 !important;
  text-align: left;
}

#imgFoneSidebar1 {
  position: absolute;
  z-index: 1;
}

#imgRotate {
  position: absolute;
  z-index: 2;
  margin-top: 10%;
  margin-left: 25%;
  margin-top: 25%;
}

.lbcall {
  cursor: pointer;
  z-index: 3;
}

.lbcall.rotate {
  -moz-transform: rotate(-90deg);
  -webkit-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg); /* для IE9 */
  transform: rotate(-90deg); /* на будущее */
  cursor: pointer; 
  margin-top: 40%;
  font-family: Roboto,sans-serif;
  font-weight: bold;
  font-size: 8pt;
  text-align: left;
  color: #2C3D7C;
}

p.lbcall {
  font-family: Roboto,sans-serif;
  font-weight: bold !important;
  font-size: 8pt;
  margin: 0 0 0px;
  color: #2C3D7C;
  line-height: 1em;
}

#lb_line {
  margin-top: 80%;
  z-index: 6;
  margin-left: 11px;
  position: relative;
}

#lb_call {
  position: absolute !important;
  margin-top: 26px;
}

/*#####################################################################*/
/* ФОРМА ОБРАТНОЙ СВЯЗИ */

/* div-форма - она прозрачна */
.sidebar.right2 {
	top: 20%;
	right: 0;
	bottom: 0;
	width: 207px;
	height: 318px;
	background: transparent no-repeat; /* #448AFF */
	background-repeat: no-repeat;
	cursor: pointer;
	display: none;
	/*box-shadow: 0 0 1em red; */
	/*box-shadow: inset 0 0 1em gold, */
	z-index: 999999 !important;
  text-align: left;
}

/* картинка - фон для формы */
#imgFoneSidebar2 {
  position: absolute;
  width: 207px;
  height: 318px;
}


/* картинка пиктограммы закрыть окно */
.imgExit {
  position: absolute;
  top: 10.5px;
  right: 10.5px;
  width: 10.5px;
  height: 10.5px;
}

/* div-форма обратного звонка, все, что идет после пиктограммы закрыть окно */
#divForm {
  position: absolute;
  width: 80%;
  height: 100%;
  z-index: 1000;
  padding-left: 21px;
  margin: 0 0 0px;
  top: 0px;
}


/* div-контейнер с полями ввода, надписями имени пользователя и телефона */
#divFormInput {
    position: relative;
    top: 21px;
    width: 100%;
    height: 34%;
    overflow: hidden;
    /* background-color: red; */
}

/* описание лэйблов над полями ввода */
p.callform {
  font-family: Roboto,sans-serif;
  font-size: 10.5pt;;
  font-weight: bold !important;
  color: #2C3D7C;
  margin: 0 0 7.5px;
  padding: 0px;
  line-height: 1em;
}

/* текст внутри input'ов */
.inCallText {
    width: 100%;
    height: 11pt;
    background-color: white;
    box-sizing: border-box;
    font-family: Roboto,sans-serif, regular;
    font-size: 11pt !important;
    margin-bottom: 20px;
    margin-top: 0px;
}

/* input для id имя пользователя */
#frname {
    margin: 0 0 0px;
    padding: 2px;
    color: #7D7F82;
    font-size: 13.5pt !important;
    vertical-align: top;
    background: white;
}

/* input для id номер телефона */
#frphone {
    margin: 0 0 0px;
    padding: 2px;
    color: #7D7F82;
    font-size: 13.5pt !important;
    vertical-align: top;
    background: white;
}

#frphone::-webkit-input-placeholder {
  font-style:bold;
  font-size: 13.5pt !important;
}

/* div-контейнер, где  расположена кнопка "жду звонка" */
#divContainerBt {
    position: relative;
    height: 10%;
    width: 100%;
    top: 21px;
    padding-top: 16.5px;
    /* background-color: yellow; */
    overflow: hidden;
}

/* картинка кнопки */
#btCallImg {
    position: absolute;
    height: 30px;
    width: 119px;
}

/* div-контейнер, внутри предыдущего, для того, чтобы надпись была на кнопке, в центре */
#divRightBtCall {
    position: absolute;
    width: 72%;
    right: 0px;
    height: 100%;
    overflow: hidden;
}

/* div- контейнер внутри предыдущего, который содержит надпись, которую центрируем посередине кнопки */
#divBtCallText {
    position: absolute;
    z-index: 1001;
    margin-left: 15%;
    margin-top: 3%;
}

/* текст кнопки "Жду звонка" */
#txtOnBtCall {
    color: #2C3D7C;
    font-family: Roboto,sans-serif;
    font-size: 10.5pt;
    font-weight: bold;
    height: 8px;
    margin-top: 0px;
    padding-top: 4%;
}

/* div-контейнер, самый нижний. Содерижт пиктограмму чекбокса, текст и ссылку на документ "пользовательское соглашение" */
#divFootText {
    position: relative;
    height: 40%;
    width: 100%;
    top: 21px;
    padding-top: 27px;
    /* background-color: green; */
    overflow: hidden;
}

/* div-контейнер, содержащий контейнеры, расположенные в одну линию(контейнер с чекбоксом и контейнер с текстом правее чекбокса)*/
#divCheckBoxInLine{
    display: inline-block;
    height: 20%;
    width: 100%;
}

/* div-контейнер с чекбоксом */
#divImgCheckBox{
    display: inline-block !important;
    float: left;
    width: 7%;
    height: 100%;
    margin-right: 8%;
}

/* картинка с чекбоксом */
#imgCheckbox {
    vertical-align: top;
    width: 26px;
    height: 26px;
}

/* div-контейнер с текстом правее чекбокса */
#divTextCheckBox {
    display: inline-block;
    float: right;
    width: 80%;
    height: 100%;
    color: #7D7F82;
    font-family: Roboto,sans-serif;
    font-size: 6pt !important;
}

/* текст правее чекбокса */
p#textCheckbox {
    display: inline-block;
    float: left;
    width: 100%;
    height: 100%;
    color: #7D7F82;
    font-family: Roboto,sans-serif;
    font-size: 8pt !important;
    font-weight: 500;
    padding: 0px;
    line-height: 1.2em;
}

/* текст с описанием "Ставя отмету..." */
p.txtDescription {
    color: #7D7F82;
    font-family: Roboto,sans-serif;
    font-size: 7.2pt !important;
    text-align: justify;
    text-align-last: justify;
    width: 100%;
    margin: 0 0 0px;
    line-height: 1em;
    margin-top: 3px;
}

/*текст ссылки на документ "Пользовательское соглашение" */
.textDeskLink{
    color: #7D7F82;
    font-family: Roboto,sans-serif;
    font-size: 7.2pt !important;
    font-weight: 400 !important;
    width: 100%;
    margin: 0 0 0px;
}

/* ------------------------ */



/* Атаптация под размер окна */
@media screen and (max-height: 360px) {
  /* div-форма - она прозрачна */
  .sidebar.right2 {
    top: 3%;
    width: 350px;
    height: 95%;
  }

  /* картинка - фон для формы */
  #imgFoneSidebar2 {
    position: absolute;
    width: 350px;
    height: 95%;
  }
  
  #divForm {
      width: 88%;
  }
  
  p.callform {
    font-size: 9pt;
    margin: 0 0 2px;
  }
  
  /* текст внутри input'ов */
  .inCallText {
      margin-bottom: 8px;
  }
  /* input для id имя пользователя */
  #frname {
      padding: 0px;
      font-size: 12pt !important;
      width: 100%;
  }
  

  /* input для id номер телефона */
  #frphone {
      padding: 0px;
      font-size: 12pt !important;
      width: 100%;
  }
  /* div-контейнер с кнопкой */
  #divContainerBt {
    height: 20%;
    width: 100%;
    padding-top: 0%;
  }

  /* картинка кнопки */
  #btCallImg {
    position: absolute;
    height: 70%;
    width: 70%;
    right: 0px;
  }
  
  #divBtCallText {
      margin-left: 0%;
      right: 15%;
      margin-top: 3%;
  }
  
  #divFootText {
      position: relative;
      height: 50%;
      width: 100%;
      top: 15px;
      overflow: hidden;
      padding: 1px;
  }
  
  #divImgCheckBox {
      width: 5%;
      margin-right: 0px;
  }
  
  #divTextCheckBox {
      width: 88%;
      margin-top: 2%;
  }
  
  p#textCheckbox {
      width: 119%;
      font-size: 9pt !important;
  }

}



