Css 如何在Zerif Lite Wordpress主题中添加响应滑块

我使用Nivo滑块插件在大标题部分添加了滑块。 滑块工作正常，但分辨率降低时没有响应滑块大小保持不变。 以下是我添加的代码：

这是添加的Css

@media screen and (max-width:1023px) {
.home-header-slider {
 padding-top: 111px;
}
}
@media screen and (max-width:767px) {
.home-header-slider {
 padding-top: 0px;
}
}
 @media screen and (min-width:1024px) {
.home-header-slider {
 padding-top: 76px;
}
}

在big_title.php模板文件中添加的代码

<div class="home-header-slider">
<?php nivo_slider( 1 ); ?>
</div>

我想不出错误，所以请告诉我正确的代码。或者是否有任何替代Nivo滑块的方法请告诉我

转到Nivo滑块-->设置-->滑块大小 然后选择“响应”