sojtve on "Set feature image as unique header image for pages"

Hello,

I would like to display different (but not random) header images on my pages.

I have created my child theme and created a new template for the pages with the unique header images. I have added extra container <div> with class 'city' to this page template.

I wanted to display the featured image as header image by modifying custom-header.php but it does not work.

<style type="text/css" id="twentythirteen-header-css">
<?php
if ( ! empty( $header_image ) ) :
?>
.site-header {
background: url(<?php header_image(); ?>) no-repeat scroll top;
background-size: 1600px auto;
background-size:100%;
}
.city .site-header {
background:none;
background-image:url(<?php the_post_thumbnail(); ?>);
}
<?php
endif;
...
</style>

My solution works when I upload an image and use its full path in the code:
background-image:url(/wp-content/themes/child-theme/site-images/background-city.jpg);
instead of
background-image:url(<?php the_post_thumbnail(); ?>);
so I think there is some issue in the php.

Any help is much appreciated! Thanks.