Responsive post featured image

I’ve been trying to find an answer to my question, but haven’t found anything that helped.

I set my post featured image before my single post content since I wanted the title and date to be placed under the post image.

This is the code I used in my single.php:

<div id="post-thumbnail">
          <?php the_post_thumbnail( array (800,1100)); /* Custom size */ ?>
               </div>
   <?php get_template_part( 'content-single', get_post_format() ); ?>

This is the css:

.content-area #post-thumbnail {
	float: center;
	margin-top: 40px;
        width: 100%;
}
.content-area #post-thumbnail img{
    max-width: 100%;
    height: auto;
}

While the featured post image shows up correctly on a full-sized computer screen , it’s not perfectly responsive.

I haven’t made my website live yet so
here is an image of my issue.

The post featured image aligns to the left instead of being centered.

It’s not in the same box as the post content so I’m not sure how to make it responsive and fit the content box.

I am new at WordPress so if anybody could help, that would be greatly appreciated.