<?php get_header(); ?>
<section id="content" role="main">

  <div class='container island-bottom'>
    <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
      <div class='row home-columns'>


        <?php
        $left_photo = get_field('left_photo');
        $left_title = get_field('left_title');
        $left_text = get_field('left_text');
        $center_photo = get_field('center_photo');
        $center_title = get_field('center_title');
        $center_text_area = get_field('center_text_area');
        $right_image = get_field('right_image');
        $right_title = get_field('right_title');
        $right_text_area = get_field('right_text_area');
        $right_image_link = get_field('right_image_link');
        $custom_link_1 = get_field('custom_link_1');
        $custom_link_2 = get_field('custom_link_2');
        $custom_link_3 = get_field('custom_link_3');
        ?>
        <!--column 1-->
        <div class='col-12 col-4-m box-1'>
          <?php if($left_title): ?>

              <h2 data-match-height="title-height"><?php echo $left_title;?></h2>

          <?php endif; ?>
          <?php if($left_text):?>
            <div class='text' data-match-height="text-height">
              <?php echo $left_text;?>
            </div>
          <?php endif; ?>
          <?php if($left_photo):?>
            <div class''>
              <img class='full-width clear' src = '<?php echo $left_photo["url"];?>' />
            </div>
            <div class='login-form clear' data-match-height="form-height">

              <?php if (  is_user_logged_in() ):?>
                <?php
                $current_user   = wp_get_current_user();
                $role_name      = $current_user->roles[0];
                ?>
                <?php if ( 'toolkit' === $role_name ):?>
                  <a class='logout-button2' href="<?php echo the_permalink('223'); ?>">Return to Toolkit</a>
                <?php endif;?>
              <?php endif;?>

              <?php include locate_template('templates/flexible-content/login-form.php');?>
            </div>
            <a class='bottom-button clear' href='<?php echo the_permalink($custom_link_1);?>'>
              Tell us what you think<i class="fa fa-chevron-right" aria-hidden="true"></i>
            </a>
          <?php endif;?>
        </div>

        <!--column 2-->
        <div class='col-12 col-4-m box-2'>
          <?php if($center_title): ?>

              <h2 data-match-height="title-height"><?php echo $center_title;?></h2>

          <?php endif; ?>
          <?php if($center_text_area):?>
            <div class='text' data-match-height="text-height">
              <?php echo $center_text_area;?>
            </div>
          <?php endif; ?>
          <?php if($center_photo):?>
            <div class''>
              <img class='full-width' src = '<?php echo $center_photo["url"];?>' />
            </div>
            <div class='login-form clear' data-match-height="form-height">

              <?php if (  is_user_logged_in() ):?>
                <?php
                $current_user   = wp_get_current_user();
                $role_name      = $current_user->roles[0];
                ?>
                <?php if ( 'webinars' === $role_name ):?>
                  <a class='logout-button2' href="<?php echo the_permalink('67'); ?>">Return to Webinars</a>
                <?php endif;?>
              <?php endif;?>
              <?php include locate_template('templates/flexible-content/login-form.php');?>
            </div>
            <a class='bottom-button clear' href='<?php echo the_permalink($custom_link_2);?>'>
              Tell us what you think<i class="fa fa-chevron-right" aria-hidden="true"></i>
            </a>
          <?php endif;?>
        </div>

        <!--column 3-->
        <div class='col-12 col-4-m box-3'>
          <?php if($right_title): ?>

            <h2 data-match-height="title-height"><?php echo $right_title;?></h2>
          
          <?php endif; ?>
          <?php if($right_text_area):?>
            <div class='text' data-match-height="text-height">
              <p><strong>
                We use intelligent information to help local and central government lawyers work more
                efficiently</strong>
              </p>
              <?php echo $right_text_area;?>
            </div>
          <?php endif; ?>
          <?php if($right_image):?>
            <div class''>
              <a href='<?php echo the_permalink($right_image_link); ?>'>
                <img class='full-width' src = '<?php echo $right_image["url"];?>' />
              </a>
            </div>
            <div class='login-form clear' data-match-height="form-height">
              <img src='/wp-content/themes/varn/assets/src/img/index.gif' />
            </div>
            <a class='bottom-button clear' href='<?php echo the_permalink($custom_link_3);?>'>
              Tell us what you think<i class="fa fa-chevron-right" aria-hidden="true"></i>
            </a>
          <?php endif;?>
        </div>


      </div>


    <?php endwhile; endif; ?>
  </div>


</section>

<?php get_footer(); ?>
