Cacher is the code snippet organizer for pro developers

<section class="large-image-area">
	<div class="object-fit-fix">
		<?php $image = get_field( 'large_image_asset' ); ?>
		<img src="<?php echo $image['url']; ?>" alt="<?php echo $image['alt']; ?>">
	</div>
	<div class="large-image-area-text">
		<h3><?php the_field( 'large_image_title' ) ?></h3>
		<?php the_field( 'large_image_content' ) ?>
	</div>

</section>

{
    "key": "group_5893a24bcb244",
    "title": "Large Image Area",
    "fields": [
        {
            "default_value": "",
            "maxlength": "",
            "placeholder": "",
            "prepend": "",
            "append": "",
            "key": "field_5893a25605e15",
            "label": "Title",
            "name": "large_image_title",
            "type": "text",
            "instructions": "",
            "required": 0,
            "conditional_logic": 0,
            "wrapper": {
                "width": "",
                "class": "",
                "id": ""
            }
        },
        {
            "default_value": "",
            "new_lines": "wpautop",
            "maxlength": "",
            "placeholder": "",
            "rows": "",
            "key": "field_5893a26405e16",
            "label": "Content",
            "name": "large_image_content",
            "type": "textarea",
            "instructions": "",
            "required": 0,
            "conditional_logic": 0,
            "wrapper": {
                "width": "",
                "class": "",
                "id": ""
            }
        },
        {
            "return_format": "array",
            "preview_size": "large",
            "library": "all",
            "min_width": "",
            "min_height": "",
            "min_size": "",
            "max_width": "",
            "max_height": "",
            "max_size": "",
            "mime_types": "",
            "key": "field_5893a26c05e17",
            "label": "Image",
            "name": "large_image_asset",
            "type": "image",
            "instructions": "",
            "required": 0,
            "conditional_logic": 0,
            "wrapper": {
                "width": "",
                "class": "",
                "id": ""
            }
        }
    ],
    "location": [
        [
            {
                "param": "page_type",
                "operator": "==",
                "value": "front_page"
            }
        ]
    ],
    "menu_order": 7,
    "position": "normal",
    "style": "default",
    "label_placement": "top",
    "instruction_placement": "label",
    "hide_on_screen": "",
    "active": 1,
    "description": "",
    "modified": 1486409566
}

.large-image-area {
  height: 800px;
  position: relative;
  overflow: hidden;
  img {
    width: 100%;
    height: 100%;
  }
  .large-image-area-text {
    font-size: 25px;
    background: $blue;
    @extend .dark;
    padding: 5em 3em;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 9;
    h3, p {
      margin: 0;
    }
  }
}