60 lines
2.0 KiB
JavaScript

import React from 'react';
import pencil from '../assets/images/pencil.gif';
export default function PartTwo() {
return (
<div
className="w-full sm:h-screen flex flex-col items-center justify-center sm:py-16 sm:px-20 p-4 my-8"
id="part-two"
>
<img src={pencil} alt="pencil" className="object-cover sm:h-32 h-20" />
<div className="text-red-600 uppercase text-sm font-bold font-avenirblack sm:mb-8 mb-4 tracking-wide sm:w-auto w-1/2 sm:text-left text-center">
Business Problems we've solved
</div>
<div className="w-full sm:h-1/3 flex sm:flex-row flex-col items-center sm:justify-between">
<div className="bg-gray-144 flex flex-col justify-end items-start sm:w-two-row w-full p-8 sm:h-full h-60 sm:mb-0 mb-4">
<div className="font-avenirbook text-lg sm:w-1/3 w-3/4 text-gray-200 sm:mb-4 mb-2">
Can a love story double as a hearing test?
</div>
<a
href="/"
className="font-avenirbook text-sm w-1/2 underline text-gray-100 hover:no-underline focus:no-underline"
>
Find out here
</a>
</div>
<div className="bg-gray-144 flex flex-col justify-end items-start sm:w-two-row w-full p-8 sm:h-full h-60 sm:mb-0 mb-4">
<div className="font-avenirbook text-lg sm:w-1/3 w-3/4 text-gray-200 sm:mb-4 mb-2">
How close to an AFL player can you get?
</div>
<a
href="/"
className="font-avenirbook text-sm w-1/2 underline text-gray-100 hover:no-underline focus:no-underline"
>
Find out here
</a>
</div>
</div>
<a
href="/"
className="font-avenirbook text-sm underline sm:mt-20 mt-4 text-gray-900 hover:no-underline focus:no-underline"
>
View our work
</a>
{/* <img
src={part1banner}
alt="part-1-banner"
className="w-full object-cover sm:h-5/6"
/> */}
</div>
);
}