«гибкий» CSS переписан в Woocomerce

Я пытаюсь создать нижний колонтитул в StoreFront. Я написал фрагмент кода для добавления HTML

add_action( 'init', 'custom_remove_footer_credit', 10 );
function custom_remove_footer_credit () {
remove_action( 'storefront_footer', 'storefront_credit', 20 );
add_action( 'storefront_footer', 'custom_storefront', 20 );
}
function custom_storefront() {
?>
<div id = "wizfooter" class ="wiz-footer-container">
<div class ="wiz-footer-left">
<p>My HTML 1</p>
</div>
<div class ="wiz-footer-right">
<p>My HTML 2</p>
</div>
</div> <!--wiz-footer-container-->
<?php
}

И я использовал следующий CSS

.wiz-footer-container {
display: flex;
display: -webkit-flex;
flex-flow: row nowrap;
-webkit-flex-flow: row nowrap;
justify-content: space-around;
-webkit-justify-content: space-around;
}
.wiz-footer-container div {
flex: 1;
-webkit-flex: 1;
width: 400px;
}
.wiz-footer-container div:nth-of-type(1n+2) {
margin-left: 20px;
}

Тем не менее Дисплей: сгибать; И все остальные свойства Flex перезаписываются, но свойства Flex -webkit-display нет?

Есть идеи? Я использую Chrome и локальный сервер (WAMP)