<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="HandheldFriendly" content="true" />
<templates:styles
boxsizingborderbox="true"
maxwidthmedia="true"
rootfontsize="17px"
rootfontsizemobile="14px"
lastusedratio="1.5"
bodyfontlibrary="google"
bodyfontfamily="Roboto"
bodyfontweight="400"
bodycolor=""
bodyfontsize="1rem"
bodylineheight="1.55rem"
bodymargintop="0rem"
bodymarginbottom="0.8rem"
h1fontlibrary="google"
h1fontfamily="Roboto"
h1fontweight="300"
h1color=""
h1fontsize="3.375rem"
h1lineheight="3.9693rem"
h1margintop="3.1rem"
h1marginbottom="1.6rem"
h2fontlibrary="google"
h2fontfamily="Roboto"
h2fontweight="300"
h2color=""
h2fontsize="2.25rem"
h2lineheight="2.7777rem"
h2margintop="3.1rem"
h2marginbottom="1.6rem"
h3fontlibrary="google"
h3fontfamily="Roboto"
h3fontweight="400"
h3color=""
h3fontsize="1.5rem"
h3lineheight="2rem"
h3margintop="2.3rem"
h3marginbottom="0.8rem"
h4fontlibrary="google"
h4fontfamily="Roboto"
h4fontweight="700"
h4color=""
h4fontsize="1rem"
h4lineheight="1.55rem"
h4margintop="2.3rem"
h4marginbottom="0.8rem"
h5fontlibrary="google"
h5fontfamily="Roboto"
h5fontweight="700"
h5color=""
h5fontsize="1rem"
h5lineheight="1.55rem"
h5margintop="1.6rem"
h5marginbottom="0.8rem"
acolor="#cccccc"
atextdecoration="none"
improveformstyles="true"
formaccentcolor="#cccccc"
formstylevariant="minimal"
/>
<style>
/* header CTA */
.block-templatesHeader
{
display: flex;
align-items: center;
}
.block-templatesHeader__icon
{
display: flex;
margin-right: 1em;
border: 2px solid #cccccc;
padding: 0.5rem;
}
.block-templatesHeader__text
{
display: flex;
flex-flow: column nowrap;
font-size: 1.2rem;
font-weight: bold;
}
.block-templatesHeader__text span
{
font-size: small;
text-transform: uppercase;
letter-spacing: 2px;
font-weight: lighter;
line-height: 0.8em;
}
/* Overrride width of button */
.s8-templates-button
{
min-width: 180px;
width: auto;
}
.s8-templates-button-container
{
font-size: smaller;
}
/* Articles Page */
.section-article__meta
{
margin-top: 2rem;
text-align: center;
}
.section-article__meta h6
{
font-size: smaller;
font-weight: 300;
letter-spacing: 2px;
color: #666;
margin: 1rem 0;
position: relative;
}
.section-article__cta .s8-templates-button,
.section-article__recommended .s8-templates-button
{
width: 100% !important;
}
.section-article__cta .s8-templates-button-container,
.section-article__recommended .s8-templates-button-container
{
letter-spacing: 2px;
font-weight: 800;
}
/* Link hover styles */
/* Link hover styles */
.section-mainContent p > a,
.section-mainContent li > a,
footer p > a,
footer li > a
{
display:inline-block;
position:relative;
padding-bottom:2px;
}
.section-mainContent p > a:before,
.section-mainContent li > a:before,
footer p > a:before,
footer li > a:before
{
content:'';
display:block;
position:absolute;
left:0;
bottom:0;
height:2px;
width:0;
transition:width 0s ease, background .5s ease;
}
.section-mainContent p > a:after,
.section-mainContent li > a:after,
footer p > a:after,
footer li > a:after
{
content:'';
display:block;
position:absolute;
right:0;
bottom:0;
height:2px;
width:0;
background:currentColor;
transition:width .5s ease;
}
.section-mainContent p > a:hover:before,
.section-mainContent li:hover > a:before,
footer p > a:hover:before,
footer li:hover > a:before
{
width:100%;
background:currentColor;
transition:width .5s ease;
}
.section-mainContent p > a:hover:after,
.section-mainContent li:hover > a:after,
footer p > a:hover:after,
footer li:hover > a:after
{
width:100%;
background:transparent;
transition:all 0s ease;
}
/* Simple list styles */
ul
{
padding-inline-start: 1.5rem;
list-style: circle;
}
.list-unstyled,
.list-inline
{
list-style: none;
-webkit-padding-start: 0;
}
.list-inline
{
display: flex;
flex-flow: row nowrap;
justify-content: space-between;
}
@media (max-width:700px)
{
.list-inline
{
justify-content: space-evenly;
}
}
/* section footer cta */
.section-footerCTA .formRow
{
padding: 0;
margin: 0 0 1rem;
}
@media (max-width: 700px)
{
.section-footerCTA .formRow
{
margin-bottom: 0;
}
}
.section-footerCTA .formRowLabel
{
display: none;
}
.section-footerCTA input[type=text],
.section-footerCTA input[type=email]
{
border: 0 none;
background: #f6f6f6;
color: #333;
border-radius: 4px;
line-height: 1.5em;
}
.section-footerCTA button[type=submit]
{
padding: 8px 20px;
background: #cccccc;
border: 0 none;
border-radius: 4px;
line-height: 1.5em;
color: currentColor;
}
@media (max-width: 700px)
{
.section-footerCTA .s8-templates-row + .s8-templates-row
{
margin-top: 20px;
}
.section-footerCTA h3,
.section-footerCTA p
{
text-align: center !important;
}
}
/* footer */
footer
{
font-size: smaller;
}
/* section footer widget */
.section-footerWidget a
{
color: currentColor;
}
.section-footerWidget .formRow .formRowLabel
{
display: none;
}
.section-footerWidget .formRow
{
margin: 0;
}
.footerNewsletterBtn
{
padding: 7px !important;
background: transparent !important;
}
.footerNewsletterBtn:hover
{
color: #cccccc !important;
}
/* section footer copyright */
.section-footerCopyright a
{
color: currentColor;
}
@media (max-width:700px)
{
.section-footerCopyright
{
text-align: center;
}
.footerCredits
{
display: block;
}
}
/* Newsletter Subscribe Dialogbox */
#newsletter_subscribe_dialog .formRow
{
background: transparent;
padding: 0;
}
#newsletter_subscribe_dialog input[type=text],
#newsletter_subscribe_dialog input[type=email]
{
width: 97%;
border: 2px solid;
border-radius: 5px;
}
#newsletter_subscribe_dialog button[type=submit]
{
padding: 7px;
text-align: center;
width: 100%;
}
</style>
</head>
<body>
<!-- Header -->
<templates:header variant="YinYang" logo="/media/website_designs/52/logo.jpeg" maxlogowidth="200px" maxlogoheight="100px" bgcolor="#333333" contentsize="md" navfontcolor="#333333" navbgcolor="#cccccc">
<navigation:primary rootpage="/new-site/" includestyles="true" autopopulatelevel="3" preventwrap="true">
<navigation:item at="start" page="/">Home</navigation:item>
</navigation:primary>
<templates:sociallinks headerposition="primary" variant="Round" size="3" icon-width="30px" icon-height="30px" color="#cccccc" facebook="plugins/like.php" />
<templates:headertext headerposition="secondary" variant="Classic" color="#cccccc"><div class="block-templatesHeader"><div class="block-templatesHeader__icon"><standard:icon library="fontawesome" iconstyle="solid" iconname="envelope" size="4" style="width: 1.3em; height: 1.3em; margin-right: 0;" /></div><div class="block-templatesHeader__text"><span>Email Us:</span>info@oncord.com</div></div></templates:headertext> </templates:header>
<div class="section-mainContent">
<!-- Article Page -->
<logic:if test="count(\Components\Website\Posts::getAllLinkingToPage(\Components\Website\Pages::currentPageId())) > 0">
<templates:section class="section-article" paddingtop="6rem" paddingbottom="6rem">
<logic:variable as="postMain" value="[? (\Components\Website\Posts::getAllLinkingToPage(\Components\Website\Pages::currentPageId()))[0] ?]" />
<logic:variable as="postAuthor" value="[? \Components\Customers\Contacts::get($postMain['contact_id']) ?]" />
<templates:section contentsize="sm" class="section-article__header" paddingleft="0" paddingright="0" paddingtop="0" paddingbottom="1rem">
<logic:if test="$postMain['post_icon']">
<standard:image alt="[? $postMain['post_title'] ?]" src="[? $postMain['post_icon'] ?]" width="100%" height="500" maintainaspect="crop" />
</logic:if>
<div class="section-article__meta">
<h2>[? $postMain['post_title'] ?]</h2>
<h6><span>Posted [? formatDate($postMain['post_date']) ?]</span></h6>
</div>
</templates:section>
<templates:section contentsize="sm" class="section-article__entry" paddingleft="0" paddingright="0" paddingtop="1rem" paddingbottom="0">
<regions:content />
</templates:section>
</templates:section>
<templates:section class="section-article__cta" contentsize="lg" paddingbottom="0" paddingtop="0" bgimage="https://images.unsplash.com/photo-1495195129352-aeb325a55b65?ixid=eyJhcHBfaWQiOjY4ODV9" bgwashcolor="#333333" bgwashopacity="72" >
<templates:section paddingleft="3rem" paddingright="3rem" paddingtop="4rem" paddingbottom="4rem" contentsize="sm">
<templates:row>
<templates:column width="7">
<templates:button variant="Classic" opendialogid="newsletter_subscribe_dialog" color="#cccccc" border="2px solid #cccccc" padding="7px">SUBSCRIBE TO OUR NEWSLETTER</templates:button>
</templates:column>
<templates:column width="5">
<templates:button variant="Classic" href="/contact-us/" color="#333333" bgcolor="#cccccc" border="2px solid #cccccc" padding="7px">CONTACT US <standard:icon library="fontawesome" iconstyle="solid" iconname="arrow-right" size="4" style="width: 16px; height: 16px;" /></templates:button>
</templates:column>
</templates:row>
</templates:section>
</templates:section>
<templates:section class="section-article__recommended" paddingtop="6rem" paddingbottom="6rem" bgcolor="#f6f7f9">
<templates:section paddingleft="0" paddingright="0" paddingtop="0" paddingbottom="2rem">
<templates:row verticalAlignColumns="center">
<templates:column width="9">
<h2>Related Articles</h2>
</templates:column>
<templates:column width="3" style="text-align: right;">
<templates:button variant="Classic" href="/news/" color="#cccccc" border="2px solid #cccccc" padding="7px">VIEW ALL</templates:button>
</templates:column>
</templates:row>
</templates:section>
<templates:section paddingleft="0" paddingright="0" paddingtop="2rem" paddingbottom="0">
<data:postrepeater paging="false" datalimit="3" templatetype="list" variant="card" datafilter="[? [['post_id', '!=', $postMain['post_id']]] ?]" />
</templates:section>
</templates:section>
</logic:if>
<!-- General Page -->
<logic:else>
<regions:content requiressection="true" />
</logic:else>
</div>
<!-- CTA section -->
<regions:togglable id="togglable_footerCTA" defaultvisible="true" label="Display Footer CTA">
<templates:section class="section-footerCTA" bgimage="https://images.unsplash.com/photo-1512486130939-2c4f79935e4f?ixid=eyJhcHBfaWQiOjY4ODV9" bgimageblur="4" bgwashcolor="#000000" bgwashopacity="40" color="#f6f7f9">
<templates:row verticalAlignColumns="center">
<templates:column width="4">
<h3 style="text-align: right;"><strong>REQUEST A CALL BACK</strong></h3>
<p style="text-align: right;">If you need to speak to us about a general query fill in the form below and we will call you back within the same working day.</p>
</templates:column>
<templates:column width="8">
<forms:form id="call_back_request" recordsubmissions="true" onsubmitredirect="/contact-us/success/" contactmode="store" onsubmitemailsubject="[? 'Call Back Request : ' + $_POST[''] ?]" onsubmitemail="true">
<templates:row>
<templates:column width="6">
<forms:row label="First Name" type="one_column">
<forms:editbox id="contact_first_name" placeholder="First name" validations="mandatory"></forms:editbox>
</forms:row>
</templates:column>
<templates:column width="6">
<forms:row label="Email Address" type="one_column">
<forms:editbox id="contact_email" validations="mandatory,email" placeholder="Email" transformations="tolower"></forms:editbox>
</forms:row>
</templates:column>
</templates:row>
<templates:row>
<templates:column width="6">
<forms:row label="Phone Number" type="one_column">
<forms:editbox id="contact_phone" validations="mandatory" placeholder="Phone Number"></forms:editbox>
</forms:row>
</templates:column>
<templates:column width="6">
<forms:row type="one_column">
<forms:submitbutton>Submit</forms:submitbutton>
</forms:row>
</templates:column>
</templates:row>
</forms:form>
</templates:column>
</templates:row>
</templates:section>
</regions:togglable>
<!-- Footer Section -->
<footer>
<templates:section class="section-footerWidget" contentsize="md" bgcolor="#333333" color="#ffffff" paddingtop="6rem" paddingbottom="6rem" paddingleft="2rem" paddingright="2rem">
<templates:row>
<templates:column width="4">
<templates:flexlayout style="justify-content: flex-start; align-items: stretch;">
<templates:card style="padding: 0 20px; margin: 0px; border-radius: 0px;" cardsize="sm">
<h2><strong>About Us</strong></h2>
<p>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Maecenas sollicitudin. Donec ipsum massa, ullamcorper in, auctor et, scelerisque sed, est. </p>
<templates:sociallinks variant="FillSquare" size="3" icon-width="30px" icon-height="30px" bgcolor="rgba(255,255,255,0.1)" facebook="plugins/like.php" />
</templates:card>
</templates:flexlayout>
</templates:column>
<templates:column width="2">
<h3>Quick Links</h3>
<navigation:secondary rootpage="/" id="footerSitemap"></navigation:secondary>
</templates:column>
<templates:column width="3">
<h3>Contact</h3>
<ul class="list-unstyled">
<li>
<a href="tel:1300787970">
<standard:icon library="fontawesome" iconstyle="solid" iconname="phone" style="width: 10px; height: 10px;" />
1300787970 </a>
</li>
<li>
<a href="mailto:info@oncord.com"><standard:icon library="fontawesome" iconstyle="regular" iconname="envelope" style="width: 10px; height: 10px;" />
info@oncord.com </a>
</li>
<li>
<standard:icon library="fontawesome" iconstyle="solid" iconname="location-dot" style="width: 10px; height: 10px;" />
PO Box 5766 Brendale QLD 4500 </li>
<li>
<standard:icon library="fontawesome" iconstyle="solid" iconname="clock" style="width: 10px; height: 10px;" />
Monday-Friday 9am-5pm </li>
</ul>
</templates:column>
<templates:column width="3">
<h4>Subscribe</h4>
<forms:form id="footer_newsletter" contactmode="register" method="ajax">
<forms:row label="First Name" type="one_column">
<forms:editbox id="contact_first_name" placeholder="Enter Your First Name" validations="mandatory" />
</forms:row>
<forms:row label="Email Address" type="one_column">
<forms:editbox id="contact_email" placeholder="Enter Your E-mail Address" validations="mandatory,email" transformations="tolower" />
</forms:row>
<forms:row type="one_column">
<forms:submitbutton class="footerNewsletterBtn" type="submit">Subscribe Now</forms:submitbutton>
</forms:row>
<forms:successcontent>
<standard:icon library="fontawesome" iconstyle="regular" iconname="circle-check" size="4" style="width: 30px; height: 30px; color: #cccccc" />
<h4>Thanks! Keep an eye out for our updates!</h4>
</forms:successcontent>
</forms:form>
</templates:column>
</templates:row>
</templates:section>
<!-- Copyright and Social -->
<templates:section contentsize="md" class="section-footerCopyright" bgcolor="#f6f7f9" color="#434656" paddingbottom="0" paddingtop="0">
<templates:row verticalAlignColumns="center">
<templates:column width="9">
Copyright © [? date('Y') ?] Calypso Reef Imagery and Underwater Camera Hire. <span class="footerCredits"><a href="//www.oncord.com/" rel="designer" target="_blank">Powered by Oncord</a></span>
</templates:column>
<templates:column width="3">
<ul class="list-inline">
<li><a href="/privacy/">Privacy</a></li>
<li><a href="/terms/">Terms</a></li>
<li><a href="/sitemap/">Sitemap</a></li>
</ul>
</templates:column>
</templates:row>
</templates:section>
</footer>
<forms:dialogbox id="newsletter_subscribe_dialog" width="400">
<h5 style="margin-bottom: 1rem;">Get notified of new articles:</h5>
<forms:form id="newsletter_subscribe_form" method="ajax" contactmode="store">
<forms:row label="First Name" type="one_column">
<forms:editbox id="newsletter_first_name" datacolumn="contact_first_name" validations="mandatory" placeholder="First Name" />
</forms:row>
<forms:row label="Last Name" type="one_column">
<forms:editbox id="newsletter_last_name" datacolumn="contact_last_name" validations="mandatory" placeholder="Last Name" />
</forms:row>
<forms:row label="Email Address" type="one_column">
<forms:editbox id="newsletter_email" datacolumn="contact_email" validations="mandatory,email" transformations="tolower" placeholder="Email Address" />
</forms:row>
<forms:row label="" type="one_column">
<forms:submitbutton>SUBSCRIBE</forms:submitbutton>
</forms:row>
<forms:successcontent>
<templates:section paddingTop="2rem" paddingBottom="2rem" paddingLeft="2rem" paddingRight="2rem" bgcolor="#ffffff" color="#333333">
<standard:icon library="fontawesome" iconstyle="regular" iconname="circle-check" size="4" style="width: 30px; height: 30px; margin-left: auto; margin-right: auto; display: block; color: #cccccc" />
<h3 style="text-align: center;">
<big>Thanks! <br />Keep an eye out for our updates!</big>
</h3>
</templates:section>
</forms:successcontent>
</forms:form>
</forms:dialogbox>
</body>
</html>
|