Ездит кнопка - Joomla 3.x: Шаблоны, разметка и макеты вывода

Помогите, кто сможет. У меня в хэдаре прописана кнопка обратной связи с  подписью сверх

https://yadi.sk/i/n28V7asW3WgpKk

На сайте все нормально, но на мобильно версии начинает ездить по экрану.

https://yadi.sk/i/xZk7iDeD3WgpdC

Исходный код:

<div class="col-md-4">
            <div class="svaz3" >
               <p>+7 (3452) 388 - 443</p>
            </div>
      <div class="svaz2">
         <a href="<?php echo JUri::base(TRUE);?>"><img class="logo" src="<?php echo JUri::base(TRUE)."/templates/".$doc->template;?>/images/h9S1wXBiu80.jpg" alt="" /></a>
      </div>

         <div class="svaz1">
            <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#exampleModal">
               Обратный звонок
            </button>
         </div>
   </div>

CSS

.col-md-4  .svaz2{
      float:right;Font-family:Arial;font-size:24px;padding:0 0 0 0;font-family:Arial;
   }
   
.col-md-4  .svaz1{
      float:right;Font-family:Arial;font-size:24px;padding:0 0 0 0;font-family:Arial;
   }
.col-md-4 .svaz3{
      float:right;Font-family:Arial;font-size:24px;padding:0 0 0 0;font-family:Arial;
   }

xs sm задайте по 12 или по 6 смотря как вам надо

А где его задать ? В col-md-4 ? В классах, через которые я вывожу кнопку надпись и картинку ? В CSS ?

самое простое в настройках шаблона(ну смотря какой шаблон)
а так в CSS @media

Я пробовал прописать картинку и текст в одну строку (поставил их в класс row), но тогда они едут в левый край. А если прописать строке свойство выравнивания по правому, то она, почему то, начинает занимать только пространство, которое необходимое для их размещения и кнопка на мобиле опять едет вверх.

Шаблон переделал из protostar с bootstrap 4. Все протостарское css из него удалил. Щяс там только bootstrap и то, что я в новом templat.css прописал.