html,body {margin:0; height:100%;}
/***** RESET ******/
img, form, a,
header, nav, article, section, dialog, figure, aside, footer
{border:0; margin:0; outline:0; padding:0;}
:focus {outline:none;}
::-moz-focus-inner {border:0;}
/***** RESET END ******/

/***** SHOW/HIDE ******/
.show { display:none !important; }
.hidden { display:block !important; }
.hide{ display:none !important; }
.fa-5x { font-size: 5em; }
.onepcssgrid-1500 {	position: relative;	z-index: 3; }

/******************** DEFAULT COLOURS ******/

/* THEME COLOR */
.color01 { color:#fff; } /* ICONS */
.color02 { color:#336fde; } /* HOME SERVICES HEADING */
.color03 { color:#fff; } /* FEATURE ICONS */

/* THEME BGCOLOR */
.bgcolor01 { background: #336fde; } /* NAVIGATION BGCOLOR */
.bgcolor02 { background: #fff; } /* HEADER/CONTACT SECTION BGCOLOR */
.bgcolor03 { background-color: #336fde; } /* ICONS/IMAGE CURV/WHO WE ARE SECTION BGCOLOR */
.bgcolor04 { background-color: #fff; } /* SERVICES SECTION BGCOLOR */
.bgcolor05 { background-color: #fff; } /* CONTENT SECTION BGCOLOR */
.bgcolor06 { background: #f2f2f2; } /* FOOTER BGCOLOR */
.bgcolor07 { background-color: #336fde; } /* CONTACT ICONS BGCOLOR */

/* ADD THE CLASS .white TO A SECTION IF IT NEEDS WHITE TEXT */
.white, .white p, .white td, .white li { color:#fff }
.white a { color:#fff; text-decoration:underline; font-weight:400; }

/* Directions Button */
.get-directions { background: #336fde; }
.get-directions:hover { background: #00adef; }

/* SIDE MENU */
.accordion a.dcjq-parent.active { background: #00adef; color: #fff; }
.accordion a:hover, .accordion a.current { color: #fff; background-color: #00adef; font-weight:700; }

/******************** STRUCTURE ******/
#bodyClass { }

/* Header */
header { padding: 50px 0 40px; text-align: center; position: relative; }
    header img { width: 100%; height: auto; display: block; }

#logo { text-align: center; margin: 0 auto; max-width: 400px; }

.topIcons, .quickCont { margin-top: 20px; position: absolute; top: 16%; }
    .topIcons a, .quickCont a { display: inline-block; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; transition: all 0.5s ease; }

.topIcons { left: 3%; }
    .topIcons a { margin-right: 3px; }

.quickCont { right: 3%; }
    .quickCont a { margin-left: 3px; font-weight: 400; }
        .quickCont a:hover { font-weight: 400; }
        .quickCont a span { display: inline-block; margin-right: 10px; }

        .quickCont a.bgcolor05:hover { background: #00adef; }

i.roundIcon { display: inline-block; width: 38px; height: 38px; border-radius: 50%; text-align: center; line-height: 38px; font-size: 20px; }
    i.roundIcon:hover { background: #00adef; }

/* NAVIGATION */
.topStrip { padding: 0 1%; width: 98%; z-index: 999; -moz-transition: top 1s; -webkit-transition: top 1s; transition: top 1s; }
    .topStrip.fixed { position: fixed; top: 0; }

#mainNav { text-align: center; line-height: 0; }
nav { height: auto; }
    /* STOPS NAV HEIGHT FROM JUMPING ON LOAD */
    nav img { width: auto !important; display: inline-block; }
/* KEEPS IMAGES IN NAV FROM SPANNING 100% */

/* Image Header */
.imageCon { position: relative; height: 500px; text-align: center; }
.slide:before { content: ""; display: inline-block; vertical-align: middle; height: 90%; }
.slideContent { width: 70%; color: #fff; font-size: 32px; text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.9); vertical-align: middle; display: inline-block; line-height: 40px; }
.slide { z-index: -1; position: absolute; width: 100%; top: 0; left: 0; height: 100%; transition: opacity 1s ease-in-out; background-position: center center; background-repeat: no-repeat; background-size: cover; opacity: 0; }
    .slide.showImg { opacity: 1; }

/* Image Header Single */
.headerimage:before { content: ""; display: inline-block; vertical-align: middle; height: 90%; }
.headerimage { position: relative; height: 540px; text-align: center; line-height: 40px; }

/* Angles */
.angles:before { background: inherit; top: -74px; bottom: 70px; content: ''; display: block; left: 0; position: absolute; right: 0; transform: skewY(-1.5deg); z-index: 2; }
.angles { }
    .angles:after { background: inherit; content: ''; display: block; top: 73px; right: 0; bottom: -73px; left: 0; position: absolute; transform: skewY(1.5deg); z-index: 1; }

/* Angles Reverse */
.anglesRev:before { background: inherit; top: -24px; bottom: 100px; content: ''; display: block; left: 0; position: absolute; right: 0; transform: skewY(1.5deg); z-index: 2; }
.anglesRev { color: #fff; position: relative; top: 0px; padding: 0 !important; }
    .anglesRev:after { background: inherit; content: ''; display: block; top: 100px; right: 0; bottom: -24px; left: 0; position: absolute; transform: skewY(-1.5deg); z-index: 2; }

/* Home Features */
section#homeFeatures img, section#homeFeatures td img { width: auto; display: inline-block; }
.imgScaleFeat { position: relative; width: 250px; height: 225px; margin: 10px auto 50px; }
.imgScale { width: 250px; height: 225px; transform: skewX(-15deg); z-index: 1; }
    .imgScale img { transform: skewX(15deg); }
    .imgScale img[style] { width:auto !important; height: 225px !important; top:0 !important; left:-20% !important; }
.imgFeatCurv { width: 100px; height: 100px; transform: skewX(-15deg); position: absolute; right: 6px; bottom: -13px; }

/* Who We Are */
#whoWeAre { text-align: center; position: relative; padding: 40px 0 110px 0; }
#leftHalf { background: rgba(0, 0, 0, 0.1); width: 51%; position: absolute; left: 0px; top: -1px; height: 100%; }

#profileSec { position: relative; text-align: center; margin: 50px 0 30px; }
#profileCon { width: 95%; vertical-align: middle; display: inline-block; }
    #profileCon p.Header, #profileCon p.SubHeader { font-weight: normal; }

/* FEATURE ICONS ON HOMEPAGE */
#FeatIconSec { position: relative; }
    #FeatIconSec a { text-transform: uppercase; padding: 30px 0; position: relative; text-decoration: none; display: inline-block; width: 33%; vertical-align: top; }
        #FeatIconSec a:hover { text-decoration: none; }
        #FeatIconSec a i, #InnerFeatIconSec a i { margin-bottom: 25px; -webkit-transition: all 0.35s linear; -moz-transition: all 0.35s linear; -ms-transition: all 0.35s linear; -o-transition: all 0.35s linear; transition: all 0.35s linear; }
        #FeatIconSec a:hover i, #InnerFeatIconSec a:hover i { -webkit-transform: rotateY(180deg); -moz-transform: rotateY(180deg); -ms-transform: rotateY(180deg); -o-transform: rotateY(180deg); transform: rotateY(180deg); }
        #FeatIconSec a p, #InnerFeatIconSec a p { margin-bottom: 0; }

/* FEATURE ICONS ON INNERPAGE */
#InnerFeatIconSec a { text-transform: uppercase; padding: 30px 50px; position: relative; text-decoration: none; display: inline-block; vertical-align: top; }

/* Map */
#map { width: 100%; position: relative; top: -73px; transform: skewY(-1.5deg); z-index: 1; margin-bottom: -165px; }
.overlay { background: transparent; position: absolute; top: 0; bottom: 0; width: 100%; z-index: 1; }

/* Contact Section */
#contactSec:before { background: inherit; top: -50px; bottom: 0; content: ''; display: block; left: 0; position: absolute; right: 0; transform: skewY(1.5deg); z-index: 1; }
#contactSec { }
#contactDetails { color: #fff; position: relative; z-index: 1; }
    #contactDetails #footerLogo { width: 80%; margin-top: 15px; }
    #contactDetails i { float: left; margin: 0 15px 80px 0; }
    #contactDetails .SubHeader { margin-bottom: 10px; }
    #contactDetails.topPadding { padding-top: 80px; }

    #contactDetails .onerow div:hover i { background: #00adef; }

section { padding: 20px 0; position: relative; }
    section#calc, section#details, section#results { padding: 0 0 30px 0; }

    section#homeFeatures { text-align: center; z-index: 2; padding:60px 30px; }
        section#homeFeatures .onerow i { margin-bottom: 25px; }

section#homeFeatures img, section#homeFeatures td img { width: auto; display: inline-block; }

    section#content { padding: 50px 30px 80px; }
        section#content img, section#content td img { width: auto; display: inline-block; }
/* KEEPS IMAGES IN CONTENT FROM SPANNING 100% */

footer { position: relative; padding: 0 0 25px; text-align: center; z-index: 1; color: #6e6e6e; }
    footer .pad { padding: 25px 0 0 0; font-size: 14px; }
        footer .pad p, footer .pad td, footer .pad li { font-size: 14px; }
    footer img, footer td img { width: auto !important; display: inline-block !important; }

.eaKeyDate.CurrentYear .eaKeyYear { background:#336fde !important; }

/******************** STRUCTURE END ******/

/***** SCROLL TOP ******/
.scrollToTop { width: 40px; height: 40px; line-height: 40px; text-align: center; text-decoration: none; position: fixed; bottom: 40px; right: 40px; display: none; z-index: 999999; background: rgba(0, 0, 0, 0.2); -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; }
    .scrollToTop i { font-size: 16px; color: #fff; line-height: 40px; font-weight: bold; }
    .scrollToTop:hover { text-decoration: none; color: #fff; font-weight: bold; background: rgba(0, 0, 0, 0.5); }

/* Pager */
.pager { text-align: center; padding-bottom: 20px; }
    .pager ul { margin: 0; padding: 0; list-style: none; width: 100%; }
        .pager ul li { margin: 0 3px; padding: 0; list-style: none; display: inline-block; }

/* Accordion */
.accordion { background-color: #f3f3f3; }
    .accordion, .accordion, .accordion li { margin: 0; padding: 0; border: none; }
        .accordion li, .accordion ul { border: 0; outline: 0; margin: 0; padding: 0; }
            .accordion ul, .accordion ul li, .accordion li { list-style: none; }
.dcjq-count { float: right; }
.accordion a, .accordion a:hover, .accordion a:active { outline: 0px; }

/*****TOP LEVEL***/
.accordion a { background-repeat: no-repeat; background-position: 10px center; border-top: 1px solid #fff; padding: 10px 20px 10px 20px; text-decoration: none; display: block; color: #444; font-weight: 400; }
    .accordion a.dcjq-parent { font-weight: 400; }

/*****TOP LEVEL END***/

/*****LEVEL ONE DOWN***/
.accordion ul li { background: #2c5ebc; color: #fff; }
.accordion ul a { font-weight: 400; color: #fff; border: 0; padding: 10px 20px 10px 25px; }
.accordion ul li a.dcjq-parent { background: #204da1; font-weight: 400; }
    .accordion ul li a.dcjq-parent.active { background: #00adef; color: #fff; }
.accordion ul li a:hover, .accordion ul li a.current { color: #fff; background-color: #00adef; font-weight: 700; }
/*****LEVEL ONE DOWN END***/

/*****LEVEL TWO DOWN***/
.accordion ul li ul li { background: #3970d6; color: #fff; }
.accordion ul ul li a { font-weight: normal; color: #fff; border: 0px; padding: 10px 20px 10px 30px; }
.accordion ul li ul li a.dcjq-parent { background: #2658b5; font-weight: 700; }
    .accordion ul li ul li a.dcjq-parent.active { background: #00adef; color: #fff; }
.accordion ul li ul li a:hover, .accordion ul li ul li a.current { color: #fff; background-color: #00adef; }
/*****LEVEL TWO DOWN END***/

/*****LEVEL THREE DOWN***/
.accordion ul li ul li ul li { background: #4882ef; color: #fff; }
.accordion ul ul li ul li a { font-weight: normal; color: #fff; border: 0px; padding: 10px 20px 10px 35px; }
.accordion ul li ul li ul li a.dcjq-parent { background: #2c63c9; font-weight: 700; }
    .accordion ul li ul li ul li a.dcjq-parent.active { background: #00adef; color: #fff; }
.accordion ul li ul li ul li a:hover, .accordion ul li ul li ul li a.current { color: #fff; background-color: #00adef; }
/*****LEVEL THREE DOWN END***/

/******************** FORM STYLES ******/

input[type="text"], input[type="password"], textarea, select { border: solid 1px #ccc; padding: 5px 8px; outline: 0; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }

    input[type="text"]:hover, input[type="password"]:hover, textarea:hover, select:hover { background: #f3f3f3; }

input[type="submit"], button[type="button"] { border: 0; background: #00adef; padding: 8px 12px; color: #fff; text-transform: uppercase; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; cursor: pointer; -webkit-appearance: none; }

    input[type="submit"]:hover, button[type="button"]:hover { background: #336fde; }
/***** FORM STYLES END ******/

.LinkButtons + *, .linkbuttons + * { clear: right; }

.LinkButtons:hover, .linkbuttons:hover, .eaPager.active { background: #336fde; cursor: pointer; text-decoration: none; color: #fff; }

.LinkButtons a, .linkbuttons a { color: #fff; text-decoration: none; }
    .LinkButtons a:hover, .linkbuttons a:hover { color: #fff; text-decoration: none; }

/******************** EXTRAS ******/

/***** IE HEIGHT HACK
minheight {min-height:500px; height:auto !important; height:500px;}*/
.Blog { }
fieldset#LoginFields { width: 280px; }
    fieldset#LoginFields dl dt { width: 100px; }
.BlogPost { border-bottom: solid 1px #ccc; }
.PostPublished, .PostAuthor { color: #999; }
.PostHeader h2 a { text-decoration: underline; font-size: 24px; font-weight: normal; }
.PostLinks { padding-left: 0; margin-left: 0; border-bottom: 1px solid #ccc; }
    .PostLinks li { list-style: none; margin: 0; padding: 0.25em; border-top: 1px solid #ccc; }
#ui-datepicker-div { display: none; }
.clearBoth { clear: both; height: 0px; }
/* Start Form Validation Styles*/
.validation_failed { border: 1px solid red; }
.error_msg { color: red; }
/* End  Form Validation Styles */
hr { height: 0px; color: #e3e2e2; border-top: 1px; background: #e3e2e2; border-style: solid; }
#DMMain, #DMMain td, body #DMMain, #DMMain p, #DMMain li { font-weight: 400 !important; font-size: 12px !important; line-height: 16px !important; }

/* CLEAR FIX */
.clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
.clearfix { display: inline-block; }
* html .clearfix { height: 1%; }
.clearfix { display: block; }

/******************** SAASU CSS 
#saasuintro{width: 680px;}
.saasuimg{width: 680px;}
.saasuhomeimgs{}
.saasutour{}
******/

/***** COUNT 
section#content iframe.countvideos { width:640px; }
 *****/

/******************** SEARCH CSS ******/
#search { display: block; height: 28px; padding: 2px; vertical-align: middle; border: 0; background-color: #eee; margin: 0; }
    #search form input { border: 0px; padding: 0 5px; float: left; vertical-align: middle; line-height: 28px; height: 28px; background: transparent; font-size: 14px; }
    #search form { padding: 0px; margin: 0px; }
    #search #searchgo { float: right; font-size: 18px; color: #00539c; vertical-align: middle; line-height: 28px; }

/******************** CLIENT LOGIN CSS ******/
#login { width: 160px; margin: 0px auto; }
    #login textarea, #login input { outline: none; }
#loginheader { font-size: 14px; padding: 5px; color: #000; }
#client_login { padding: 0px; margin: 0px; font-size: 11px; color: #333; }
    #client_login .username { margin: 5px 0px 5px 0px; font-size: 11px; width: 155px; }
    #client_login .password { margin: 5px 0px 0px 0px; font-size: 11px; width: 155px; }
#loginGo { float: right; margin: 5px 0px 5px 0px; }

/******************** NEWSLETTER SUBSCRIBE THIN ******/
form#fmNewsSubscribeThin table td input { }
form#fmNewsSubscribeThin { width: 260px; margin: 0px auto; }
    /*form#fmNewsSubscribeThin table.newssubscribe .formlabel { font-size:14px; }
form#fmNewsSubscribeThin table.newssubscribe input#firstname { font-size:14px; }
form#fmNewsSubscribeThin table.newssubscribe input#email { font-size:14px; }*/
    form#fmNewsSubscribeThin table.newssubscribe .essential { display: none; }
    form#fmNewsSubscribeThin table td input#subscribe { padding: 8px 18px 8px 18px; }
/*.newssubscribe .formlabel { text-align:left !important; }
.newssubscribe input[type=text] { width:300px !important; } */

/******************** GOOGLE RSS FEED ******/
.gfc-resultsHeader { border: 0px !important; }
.gfc-title { font-size: 12px !important; color: #333 !important; text-decoration: none !important; }
.gf-author { color: #333 !important; font-size: 11px !important; }
.gf-relativePublishedDate { color: #333 !important; font-size: 11px !important; }
.gf-snippet { color: #333 !important; font-size: 11px !important; }
.gf-title a { font-size: 11px !important; }

/****** ONLINE ACCOUNTING CSS *****/
section#content iframe.myobvideos,
section#content iframe.xerovideomain,
section#content iframe.xerovideos,
section#content iframe.countvideos { width: 600px; height: 320px; }

/***** DIRECTIONS BUTTON ******/
p.warning { color: red; }
input.manual-location { width: 95%; font-size: 1.2em; padding: 5px; }
.no-geolocation { display: none; }
.get-directions { padding: 8px 13px; color: #ffffff; font-size: 16px; font-weight: bold; border-radius: 6px; margin: 0 auto 0 auto; text-decoration: none; clear: both; display: block; text-align: center; cursor: pointer; width: 80%; }
    .get-directions:hover { text-decoration: none; color: #ffffff; font-weight: bold; }
.dirBtn { visibility: hidden; }
.rDirect { padding: 50px 20px; text-align: center; line-height: normal !important; }
    .rDirect p { font-size: 20px !important; line-height: normal !important; }

/******************** RESPONSIVE STYLES ******/

.menu-link { display: none; }
/* HIDE MOBILE MENU BUTTON */
.securewarning { display: none; width: 98%; padding: 1%; background: #ff0000; color: #fff; text-align: center; font-size: 12px; line-height: 18px; }

@media all and (max-width: 1800px) {
    #logo { text-align: center; width: 25%; margin: 0 auto; }
}

@media all and (max-width: 1600px) {
    #logo { text-align: center; width: 30%; margin: 0 auto; }
}

@media all and (max-width: 1024px) {

    header { padding: 40px 0; }
    #mainNav { width: 100%; }
    .quickCont a span { display: none; }

    /****** ONLINE ACCOUNTING CSS *****/
    section#content img.ibizzimgs,
    section#content img.collaborateimg,
    section#content img.BankLinkdiagram,
    section#content img.banklinklogo,
    section#content iframe.myobvideos,
    section#content img.liveaccountslogo,
    section#content img.accountrightlogo,
    section#content iframe.xerovideomain,
    section#content iframe.xerovideos,
    section#content iframe.countvideos,
    section#content img.xeroimage { width: auto; height: auto; }
}

@media all and (max-width: 768px) {

    /**** IMPORTANT CSS ****/
    .responsiveimage { width: 100% !important; display: block !important; height: auto !important; }
    img.responsiveimage[style] { margin-left: 0 !important; margin-right: 0 !important; }
    #SlideShowImg { width: 100% !important; display: block !important; height: auto !important; }
    /*section#content img, section#content td img { width:100% !important; display:block; }  IMAGES SPAN 100% FOR MOBILE */
    .hidden { display: none !important; }
    .show { display: block !important; }
    iframe[style] { width: 100% !important; margin: 0 !important; }
    iframe[width] { width: 100% !important; }

    /***** SITE CUSTOM CSS *****/
    #logo { width: 80% !important; margin: 0 auto; }
    .bx-wrapper .bx-controls-direction a { top: 20%; }
    .sideMenu { display: none; }

    .topStrip { position: relative; z-index: 1; text-align: center; padding: 10px 1%; }
    header { padding: 40px 0 40px; }
    section { padding: 50px 0; position: relative; }

    .topIcons, .quickCont { position: static; }
    .topIcons { float: none; display: inline-block; width: 100%; text-align: center; }
        .topIcons a { font-size: 22px; }

    section#homeFeatures .pad { padding: 0 0 30px 0; }
    section#homeFeatures .last .pad { padding: 0; }

    .quickCont a { font-size: 24px; display: block; float: left; width: 49%; color: #fff; margin-left: 0 !important; }
        .quickCont a:hover { background: #00adef; color: #fff; }
    .quickCont a { border-right: 0; text-align: center; margin-right: 1%; }
    .quickCont i { margin-right: 0; padding: 8px 0; }

    .imageCon, .headerimage { height: 300px; }

    #whoWeAre { padding: 90px 0; }

    #contactSec::before { top: -20px; }

    /* Angles */
    .angles:before { top: -22px !important; }
    .angles:after { bottom: -22px !important; }

    /* Angles Reverse */
    .anglesRev:before { top: -31px !important; }

    section#content { padding-top: 20px !important; }

    #profileSec { height: auto !important; margin: 0px !important; }

    #contactDetails { text-align: center; }
        #contactDetails i { margin: 10px 0; float: none !important; }

    .scrollToTop { display: none; }

    /***** BLOG STYLES ******/
    div.Blog div.BlogPosts { margin: 0px !important; }
    div.Blog div.BlogRightMenu { position: relative !important; width: 100%; }

    /***** CHANGE TABLE STATE *****/
    table, thead, tbody, th, td, tr { display: block; }
        table[style] { width: 100% !important; height: auto !important; }
        table[align] { float: none !important; }
        table td { padding: 5px 0 !important; margin: 0 !important; }
            table td[style] { width: 100% !important; height: auto !important; }
        table tr[style] { width: 100% !important; height: auto !important; }
        table[cellpadding] { padding: 15px 0px !important; }
        /* Hide table headers (but not display: none;, for accessibility) */
        thead tr { position: absolute; top: -9999px; left: -9999px; }
    tr { border: 0; }
    td { /* Behave  like a "row" */ border: none; position: relative; }

    /****** ONLINE ACCOUNTING CSS *****/
    section#content iframe.countvideos,
    section#content img.ibizzimgs,
    section#content img.collaborateimg,
    section#content img.BankLinkdiagram,
    section#content img.banklinklogo,
    section#content iframe.myobvideos,
    section#content img.liveaccountslogo,
    section#content img.accountrightlogo,
    section#content iframe.xerovideomain,
    section#content iframe.xerovideos,
    section#content img.xeroimage { width: 100% !important; height: auto; }

    /**** END *****/
    table.newssubscribe td.formlabel { text-align: left !important; }
    table.newssubscribe td input[type="text"] { width: 50%; }

    .wow { visibility: visible !important; -webkit-animation: none !important; -moz-animation: none !important; -o-animation: none !important; -ms-animation: none !important; animation: none !important; }
}

@media all and (max-width: 767px) {
    #FeatIconSec a { width: 50% !important; }
}

@media all and (max-width: 480px) {
    .securewarning { display: block !important; }

    /* Angles */
    .angles:before, .angles:after { width: 100% !important; }
    .angles:before { top: -10px !important; }
    .angles:after { bottom: -10px !important; }

    .imageCon, .headerimage { height: 150px; }
    .slideContent { font-size: 26px; }

    #contactDetails { padding-bottom: 1px; }
}