Проблема расскывающего текста на вордпресс

@bamsik-bamsik · Регистрация: 07.05.2020

Author24 — интернет-сервис помощи студентам

Есть вот такая конструкция

HTML5

<div class="demo">
    <input type="checkbox" id="hd-1" class="hide"/>
    <label for="hd-1" >ТРЕНЕРЫ </label>
    <div>
        Юлия  Петах-Тиква
    </div>
    <br/>
    <br/>
    <input type="checkbox" id="hd-2" class="hide"/>
    <label for="hd-2">ИНВЕНТАРЬ</label>
    <div>
        Пприобретайте инвентарь в  магазинах сети "Мега Спорт"
    </div>
    <br/>
    <br/>
    <input type="checkbox" id="hd-3" class="hide"/>
    <label for="hd-3" >ТЕХНИКА</label>
    <div>
        Ноги в руки и вперед
    </div>
    <br/>
    <br/>

CSS

.hide {
    display: none; 
}
.hide + label ~ div{
    display: none;
}
 
.hide + label {
    border-bottom: 1px dotted green;
    padding: 0;
    color: green;
    cursor: pointer;
    display: inline-block; 
}
 
.hide:checked + label {
    color: red;
    border-bottom: 0;
}
 
.hide:checked + label + div {
    display: block; 
    background: #efefef;
    -moz-box-shadow: inset 3px 3px 10px #7d8e8f;
    -webkit-box-shadow: inset 3px 3px 10px #7d8e8f;
    box-shadow: inset 3px 3px 10px #7d8e8f;
    padding: 10px; 
}
 
 
.demo {
    margin: 5% 10%;
}

Вне вордпресса все нормально работает А на сайте все выглядит как самый обычный текст. В чем тут дело, как поправить?

	10.10.2023, 14:06