﻿/*            BASIC PAGE SETUP & FONTS                */
/* -------------------------------------------------- */
body {
    color: #333a45;
    margin: 0 auto;
    padding: 0;
    text-align: center;
    background: #ffffff;
    overflow-x: hidden ;
    }

body, html {
    height: 100%;
    }

.row .row { margin-left: 0px; margin-right: right}

/* --------------------- FONTS ----------------------*/
@font-face {
    font-family: 'Hind Madurai';
    src: url('../fonts/HindMadurai-Bold.woff2') format('woff2'), url('../fonts/HindMadurai-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Hind Madurai';
    src: url('../fonts/HindMadurai-Regular.woff2') format('woff2'), url('../fonts/HindMadurai-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'HeadlandOne';
    src: url('../fonts/HeadlandOne-Regular.woff2') format('woff2'), url('../fonts/HeadlandOne-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

/* ------------------ MAIN LAYOUT ------------------- */
#skiptomain {
    display: none;
    }

#headcontainer, #contact {
    width: 100%;
    height: auto;
    }
    #headcontainer { 
        background-image: url(../images/LC-bannerbg.jpg); 
        background-color: #40b1ef; 
        background-repeat: no-repeat; 
        background-position: bottom; 
        }

.head-content { 
    margin: 0px auto;
    padding: 50px 5px;
    max-width: 1200px;
    }

.main-content, .contact-content {
    clear: both;
    margin: 0px auto;
    padding: 100px 15px 0px 15px;
    position: relative;
    max-width: 1200px;
    }

.lftspace { padding-left: 50px;}

#contact, .greysection { background-color: #edeef0; margin: 100px 0px 0px 0px; padding: 0px 0px 100px 0px; }
#contact { padding: 0px;}

.reviewbox { background-image: url(../images/LC-reviewbg.png); background-position: middle; background-repeat: no-repeat; background-size: contain; padding: 20px 0px}



/* ------------------- HEADINGS --------------------- */
h1 {
    color: #b0bd8b;
    margin: 0px;
    padding: 0px;
    font-size: 16px;
    text-align: left;
    line-height: 20px;
    font-weight: bold;
    letter-spacing: 1px;
    text-transform: uppercase;
    font-family: 'Hind Madurai', Arial, Helvetica, sans-serif;
    }
    #contact h1 { text-align: center; margin: 0px 0px 30px 0px}
h2 {
    color: #333a45;
    margin: 0px auto 40px auto;
    padding: 0px;
    font-size: 38px;
    text-align: center;
    line-height: 60px;
    font-family: 'HeadlandOne', 'Times New Roman', Times, serif;
    letter-spacing: 0px;
    }
    #contact h2 { text-align: right; line-height: 40px; margin: 0px 0px 25px 0px}

h3 {
    color: #333a45;
    margin: 20px auto;
    padding: 0px;
    font-size: 28px;
    text-align: left;
    line-height: 36px;
    font-family: 'HeadlandOne', 'Times New Roman', Times, serif;
    }

h4 {
    color: #333a45;
    margin: 20px 0px;
    padding: 0px;
    font-size: 24px;
    text-align: left;
    line-height: 30px;
    font-family: 'HeadlandOne', 'Times New Roman', Times, serif;
    }

h5 {
    color: #ffffff;
    margin: 10px auto 40px auto;
    padding: 0px;
    font-size: 26px;
    text-align: center;
    line-height: 36px;
    }

h6 {
    color: #333a45;
    margin: 10px 0px 30px 0px;
    padding: 0px;
    font-size: 20px;
    text-align: left;
    line-height: 30px;
    font-family: 'HeadlandOne', 'Times New Roman', Times, serif;
    }

    hr { border: 1px solid #b0bd8b; background-color: #b0bd8b; width: 100px; margin: 0px auto 25px 0px;}


/* ----------------- PARAGRAPHS --------------------- */
p {
    color: #333a45;
    font-family: 'Hind Madurai', Arial, Helvetica, sans-serif;
    }

p {
    margin: 0px 20px 20px 0px;
    padding: 0px;
    hyphens: auto;
    font-size: 16px;
    text-align: left;
    line-height: 22px;
    letter-spacing: 0.05em;
    }

.head-content p {
    color: #333a45;    
    margin: 0px;
    padding: 100px 10px;    
    font-size: 50px;
    text-align: center;
    font-family: 'HeadlandOne', 'Times New Roman', Times, serif;
    line-height: 50px;
    letter-spacing: 1px;
    }
    .head-content p.logo {
        margin: 0px;
        padding: 0px;
        hyphens: auto;
        font-size: 15px;
        text-align: center;
        line-height: 26px;
        }

p.caption { 
    font-weight: bold;
    text-align: center;
    letter-spacing: 0px;
}

p.review, p.contact {
    color: #b0bd8b;
    margin: 0px;
    padding: 0px;
    font-size: 16px;
    text-align: left;
    line-height: 20px;
    font-weight: bold;
    text-transform: uppercase;
    font-family: 'Hind Madurai', Arial, Helvetica, sans-serif;
    }
    p.contact, h3.contact { text-align: right;}

p.credits {
    margin: 20px 0px 10px 0px;
    padding: 0px;
    font-family: 'HeadlandOne', 'Times New Roman', Times, serif;
    font-size: 10px;
    text-align: right;
    }

    



/* --------------------- LINKS ---------------------- */
a:link, a:visited, a:hover, a:active {
    text-decoration: none
    }

a { color: #ffffff; }
a.contact {color: #333a45}
a:hover { color: #9cad6c }

.button { 
    color: #ffffff;
    float: left;
    margin: 0px 0px 25px 0px;
    padding: 2px 7px;
    font-size: 14px;
    text-align: left;
    letter-spacing: 1px;;
    background-color: #b0bd8b;
    text-transform: uppercase;
    }
    .button:hover { background-color: #9cad6c;}
    .button:hover a { color: #ffffff; }


/* ------------------- IMAGES ----------------------- */
img {
    width: auto\9; /* ie8 */
    height: auto\9;
    margin: 0px;
    padding: 0px;
    max-width: 100%;
    border-style: none;
    border-color: inherit;
    border-width: 0;
    }

img.btmspce { margin-bottom: 20px; }


/* ------------------ COLOURS ----------------------- */
.clr1 { color: #333a45; } 
.clr2 { color: #b0bd8b; } 
.clr3 { color: #edeef0; }


/* ------------------ RESPONSIVE -------------------- */
@media screen and (max-width: 1200px) {
    }

@media screen and (max-width: 1148px) {
    }

@media screen and (max-width: 800px) {
    .main-content, .contact-content { padding-top: 30px}
    .greysection { margin: 30px 0px 0px 0px; padding-bottom: 30px; }
    #contact { margin: 30px 0px 0px 0px}
    .lftspace { padding-left: 15px;}
    h2 {
        margin: 0px auto 10px auto;
        font-size: 30px;
        line-height: 50px;
        }
    #contact h2 { text-align: center; line-height: 40px; margin: 0px 0px 5px 0px; font-size: 38px;}
    p.contact { text-align: center; margin-bottom: 20px;}
    .reviewbox { background-image: url(../images/LC-reviewbg-mobile.png); background-position: middle; background-repeat: no-repeat; background-size: contain; padding: 20px 0px}
    }

@media screen and (max-width: 480px) {
    .reviewbox { background-image: url(../images/LC-reviewbg.png); }
    }