JSFiddle - React, Tailwind, and code Playground

HTML

<div class="qwe">
  <div class="chield">
    <h1 class="text">Вас приветствует<br><span >iHome</span></h1>
    <div class="text_box">
      <p>Компания iHome специализируется на оптовой и розничной торговле оригинальной продукции Apple. С нами вы будуте уверены в том, что покупаете по-настоящему качественный товар- предоставляем гарантию,  сертификаты и сервисное обслеживание.</p>
      <p>Мы не просто продаём технику, мы всегда готовы помочь вам с выбором, дать подробности по каждому товару. Не знаете, какой гаджет подойдет ли вам лучше всего? Обращайтесь - подберем для вас устройство, которое будет на все 100% отвечать вашим запросам. </p>
    </div>
  </div>
</div>

CSS

.qwe{
  
  background-size: 100% 100%;
  background-image: url(cap.jpg);
  background-repeat: no-repeat;
  
}
.chield{
  padding-top: 40px;
    opacity: 0.7;
  filter: alpha(opacity=70);
  background: black;
}
.chield p{
  padding: 20px;
  color: white;	
}
.chield h1{
  font-size: 50px;
  color: white;
  text-align:left;
  padding:15px 0 15px 2%;
}
@media(max-width:360px) {
  .chield h1{
    font-size: 30px;
  }
}
.text_box{
  line-height: 25px;
  font-size: 20px;
}