/* ------------------------------------------ */

/* --- container styles --- */

 /* ------------------------------------------ */



html {

    color: #3f3f42;

    font-family: Arial, Helvetica, sans-serif;

    font-size: 62.5%;

 }



 body {

    margin: 0;

    padding: 0;

 }



header {

    background-color: #3f3f42;

    background-image: url(../images/header_bg.png);

    background-position: bottom;

    background-repeat: repeat-x;

    margin: 0;

    overflow: hidden;

    padding: 0 1rem 6rem .5rem;

}



#headerInnerDiv {

    margin: 0 auto;

    overflow: hidden;

    max-width: 107rem;

}



#headerInnerLeftDiv {

    float: left;

}



#headerInnerRightDiv {

    float: right;

}



#phoneDiv {

    background-image: url(../images/phone_symbol.png);

    background-position: left;

    background-repeat: no-repeat;

    float: right;

    margin: 3.4rem 1rem 2.7rem 0;

    padding: 1rem 0 1rem 5rem;

    width: 17rem;

}



nav {

   clear: right;

   padding-right: 1rem;

}



#pageHeadingDiv {

    background-color: #d5f2f3;

    clear: both;

    padding: 0 1.5rem;

}



#pageHeadingInnerDiv {

    background-position: left;

    background-repeat: no-repeat;

    height: 10.5rem;

    padding: 5.25rem 0 2rem 10.2rem;

    margin: 0 auto;

    max-width: 96.8rem;

}



.headingWhoWeAre {

    background-image: url(../images/wwa_symbol_large.png);

}



.headingWhatWeDo {

    background-image: url(../images/wwd_symbol_large.png);

}



.headingContactUs {

    background-image: url(../images/phone_symbol_large.png);

}



.headingFAQ {

    background-image: url(../images/faq_symbol_large.png);

}



.headingLND {

    background-image: url(../images/lnd_symbol_large.png);

}



.headingAdmin {

    background-image: url(../images/lnd_symbol_large.png);

}



main {

    margin: 0 auto;

    overflow: hidden;

    max-width: 107rem;

}



#mainInnerLeftDiv {

    float: left;

    margin: 6.6rem .5rem 4rem .5rem;

    max-width: 67rem;

}



.mainLeftIndentDiv {

    background-repeat: no-repeat;

    border-top: solid 1px #2cbec2;

    padding: 3.5rem 0 2rem 5rem;

    background-position: 0 3rem;

}



.accessBgLogo {

    background-image:  url(../images/access2_symbol.png);

}



.preventBgLogo {

    background-image:  url(../images/prevent2_symbol.png);

}



.rehabBgLogo {

    background-image:  url(../images/rehab2_symbol.png);

}



.contactBgLogo {

    background-image:  url(../images/phone_symbol_large.png);

}



#mainInnerRightDiv {

    float: right;

    margin: 0 2rem 4rem 0;

    max-width: 33.9rem;

}



#contactDiv {

    background-color: #3f3f42;

    clear: both;

    padding: 5.8rem 1.5rem 5rem 1.5rem;

}



#contactInnerDiv {

    margin: 0 auto;

    overflow: hidden;

    max-width: 107rem;

}



#contactInnerLeftDiv {

    float: left;

    margin: 2rem 11rem 1rem 0;

}



#contactInnerRightDiv {

    float: left;

    margin: 2rem 0 1rem 0;

}



footer {

    background-color: #8dc449;

    padding: 1.5rem;

}



#footerInnerDiv {

    margin: 0 auto;

    overflow: hidden;

    max-width: 107rem;

}



#footerLeftDiv {

    float: left;

}



#footerRightDiv {

    float: right;

}



 /* ------------------------------------------ */

/* --- one off container styles --- */

 /* ------------------------------------------ */



#indexHeaderDiv {

    background-color: #3f3f42;

    background-position: bottom;

    background-repeat: repeat-x;

    margin: 0;

    overflow: hidden;

    padding: 0 1rem 6rem .5rem;

}



#indexWelcomeDiv {

    background-color: #8cc640;

    overflow: hidden;

}



#indexWelcomeInnerDiv {

    color: #fff;

    overflow: hidden;

    margin: 0 auto;

    padding: 0 2rem;

    max-width: 107rem;

}



#indexWelcomeLeftDiv {

    float: left;

    padding: 6rem 0 4rem 0;

    overflow: hidden;

    width: 39rem;

}



#indexWelcomeRightDiv {

    float: right;

    max-width: 57.5rem;

    padding: 4rem 0;

}



.boxLinkDiv {

    background-color: #2cbec2;

    background-position: .5rem .5rem;

    background-repeat: no-repeat;

    box-shadow: 3px 3px 3px grey;

    color: #fff;

    padding: .5rem 0 1.2rem 7rem;

    width: 31.5rem;

}



.boxLink1Div {

    background-image: url(../images/access_symbol.png);

}



.boxLink2Div {

    background-image: url(../images/prevent_symbol.png);

    margin: 3.35rem 0;

}



.boxLink3Div {

    background-image: url(../images/rehab_symbol.png);

}



.boxLinkDiv h2 {

    color: #fff;

    font-size: 2.31rem;

    margin: 1rem 0 1rem 0;

}



.boxLinkDiv p {

    font-size: 1.5rem;

    margin: 0;

}



#regionalOuterDiv {

    background-color: #d5f2f3;

    padding: 0 1.5rem;

}



#regionalInnerDiv {

    background-image: url(../images/rs_symbol_large.png);

    background-position: 0 5.5rem;

    background-repeat: no-repeat;

    color: ##3f3f42;

    margin: 0 auto;

    padding: 5.6rem 0 6rem 10rem;

    max-width: 97rem;

}



#regionalContentDiv {

    margin-bottom: 2rem;

    padding: 0 1.5rem;

}



#regionalContentInnerDiv {

    position: 3rem;

    margin: 0 auto;

    overflow: hidden;

    max-width: 107rem;

}



#regionalContentleftDiv {

    float: left;

    margin: 4.3rem .5rem 2rem .5rem;

    max-width: 65rem;

}



#regionalContentRightDiv {

    float: right;

    width: 33.9rem;

}



#mapDiv {

    margin-top: 5rem;

    width: 33.9rem;

}



#mainInnerRightDiv ul#rightNavigation li.greenLiBg {

    background-color: #8dc449;

    color: #fff;

}



#mainInnerRightDiv ul#rightNavigation li.greenDarkLiBg {

    background-color: #587a2e;

    color: #fff;

}



/* ---- #usefulContactsDiv {

    background-color: #8dc449;

    background-image: url(../images/people_3.png);

    background-position: bottom;

    background-repeat: no-repeat;

    color: #fff;

    line-height: 2rem;

    margin-top: -2rem;

    padding: 1rem 2rem 4rem 2rem;

}--- */



#mainInnerRightDiv ul#rightNavigation li.greenMildLiBg {

    background-color: #1b767a;

    color: #fff;

}



#serviceAreasDiv, #usefulContactsDiv {

    background-color: #2cbec2;

    background-image: url(../images/people_2.png);

    background-position: bottom;

    background-repeat: no-repeat;

    color: #fff;

    line-height: 2rem;

    margin-top: -2rem;

    padding: 1rem 2rem 4rem 2rem;

}



#siteMap {

    margin: -3rem 0 0 0;

}



/* ------------------------------------------ */

/* ---- list styles --- */

/* ------------------------------------------ */



.colourDisLi {

        margin: 0 0 0 1.2rem;

        padding: 0;

}



.colourDisLi2 {

        margin: 2rem 0 0 1.2rem;

        padding: 0;

}



.colourDisLi li, .colourDisLi2 li {

    list-style-image: url(../images/disc.png);

    padding: .5rem 0 .5rem 1rem;

}



#mainInnerLeftDiv .mainLeftIndentDiv li {

    font-size: 1.6rem;

    line-height:2.4rem;

}



.orderedList {

    margin: 0 0 0 1.3rem;

    padding: 0;

}



.orderedList li {

    font-size: 1.6rem;

    padding: .95rem 0;

}



#rightNavigation {

    display: block;

    font-size: 1.55rem;

    font-weight: 700;

    margin: 4.7rem 0 0 0;

    padding: 0;

    width: 33.9rem;

}



#rightNavigation li {

    background-color: #b2b2b3;

    display: block;

    list-style: none;

    padding: 3rem 1rem 3rem 2.7rem;

    margin: 0 0 2rem 0;

}



#siteMap li {

    margin: 0;

    padding: 3rem 0 0 0;

    list-style: none;

}



#siteMap li ul li {

    margin: 0;

    padding: 3rem 0 0 1.5rem;

    list-style: disc;

}



 /* ------------------------------------------ */

/* ---- navigation link styles --- */

 /* ------------------------------------------ */



#phoneDiv p a:link, #phoneDiv p a:visited {

    color: #fff;

    text-decoration: none;

}



#phoneDiv p a:hover, #phoneDiv p a:active {

    color: #2cbec2;

    text-decoration: none;

}



#mainMenuUl li {

    color: #2cbec2;

    font-size: 1.8rem;

}



#mainMenuUl li a:link, #mainMenuUl li a:visited {

    color: #fff;

    text-decoration: none;

}



#mainMenuUl li a:hover, #mainMenuUl li a:active {

    color: #2cbec2;

    text-decoration: none;

}



a.home_noRollover {

    background-image:url(../images/home_page.png);

    cursor: default;

    display:block;

    height:27px;

    margin-bottom: -.3rem;

    width:29px;

}



a.home_rollover:link, .home_rollover {

    background-image:url(../images/home_page_1.png);

    display:block;

    height:27px;

    margin-bottom: -.3rem;

    width:29px;

}



a.home_rollover:hover {

    background-image:url(../images/home_page.png);

    display:block;

    height:27px;

    margin-bottom: -.3rem;

    width:29px;

}



.boxLinkDiv h2 a:link, .boxLinkDiv h2 a:visited {

    color: #FFF;

    text-decoration: none;

}



.boxLinkDiv h2 a:hover, .boxLinkDiv h2 a:active {

    color: #3f3f42;

    text-decoration: none;

}



#mainInnerLeftDiv a:link, #mainInnerLeftDiv a:visited {

    color: #3f3f42;

    font-weight: 700;

    text-decoration: none;

}



#mainInnerLeftDiv a:hover, #mainInnerLeftDiv a:active {

    color: #8dc449;

    font-weight: 700;

    text-decoration: none;

}



#rightNavigation li a:link, #rightNavigation li a:visited {

    color: #3f3f42;

    text-decoration: none;

}



#rightNavigation li a:hover, #rightNavigation li a:active {

    color: #d5f2f3;

    text-decoration: none;

}



#contactInnerLeftDiv p a:link, #contactInnerLeftDiv p a:visited {

    color: #fff;

    text-decoration: none;

}



#contactInnerLeftDiv p a:hover, #contactInnerLeftDiv p a:active {

    color: #8dc449;

    text-decoration: none;

}



#footerRightDiv p a:link, #footerRightDiv p a:visited {

    color: #3f3f42;

    text-decoration: none;

}



#footerRightDiv p a:hover, #footerRightDiv p a:active {

    color: #fff;

    text-decoration: none;

}



#usefulContactsDiv p a:link, #usefulContactsDiv p a:visited {

    color: #fff;

    text-decoration: none;

}





#usefulContactsDiv p a:hover, #usefulContactsDiv p a:active {

    color: #3f3f42;

    text-decoration: none;

}



#siteMap a:link, #siteMap a:visited {

    color: #3f3f42;

    font-weight: 700;

    text-decoration: none;

}



#siteMap a:hover, #siteMap a:active {

    color: #8dc449;

    font-weight: 700;

    text-decoration: none;

}



 /* ------------------------------------------ */

/* ---- text styles --- */

/* ------------------------------------------ */



.boldFont {

    font-weight: 700;

}



h1 {

    font-size: 6.3rem;

    font-weight: 700;

    margin: 0;

}



h2 {

    color: #2cbec2;

    font-size: 2.6rem;

    font-weight: 700;

    margin: 0;

}



h3 {

   font-size: 1.6rem;

   font-weight: 700;

   margin: 1.5rem 0 0 0;

}



h4 {

   color: #3f3f42;

   font-size: 1.7rem;

   font-weight: 700;

   margin: 1.5rem 0 0 0;

}



#phoneDiv p {

    font-size: 2.3rem;

    font-weight: 700;

    padding: 0;

    margin: 0;

}



.blueGreenColor {

   color: #2cbec2;

}



.brightGreenColor {

    color: #8dc449;

}



#mainInnerLeftDiv, #regionalContentleftDiv p {

    font-size: 1.6rem;

    line-height:2.5rem;

}



#mainInnerLeftDiv .mainLeftIndentDiv p {

    font-size: 1.6rem;

    line-height:2.4rem;

}



#contactDiv p {

    color: #fff;

    font-size: 1.6rem;

    line-height:1.6rem;

}



.contactInfoSpan {

    display: inline-block;

    width: 6.8rem;

}



footer p {

   font-size: 1.5rem;

}





/* ---- one off styles --- */



.indexMainText p {

    font-size: 2.2rem;

    line-height: 3.5rem;

}



.regionalHeading {

    color: #3f3f42;

    font-size: 6.3rem;

    font-weight: 700;

    margin: 0;

}



#usefulContactsDiv p, #serviceAreasDiv p {

    font-size: 1.6rem;

}



.headingLND h1 {

   font-size: 4.5rem;

   margin-top: .7rem;

}



.blackFont {

    color: #3f3f42;

}



.text_container {

    cursor: pointer;

}



.hidden>div {

    display:none;

}



.visible>div {

    display:block;

}



.faqsQ {

    font-weight: 700;

    margin-top: 3rem;

}



.faqsA {

    color: #2cbec2;

}





/* ------------------------------------------ */

/* ---- form styles --- */

 /* ------------------------------------------ */



#contactFormDiv {

    margin-bottom: 3rem;

    max-width: 60.5rem;

}



#comContactForm {

    overflow: hidden;

}



#comContactForm label {

    display: block;

    font-size: 1.5rem;

    margin: 1rem 0 .5rem 0;

}



#comContactForm label:first-child {

    margin-top: 0;

}



#comContactForm input, #comContactForm textarea {

    background-color: #ebebeb;

    border-color: #8e8c8c;

    border-radius: 25px;

    border-style: dotted;

    border-width: 1px;

    display: block;

    font-size: 1.6rem;

    height: 2.5rem;

    margin: 0;

    width: 96%;

}



#comContactForm textarea {

    height: 18rem;

}



#comContactForm #submitButton {

    background-color: #fff;

    background-image: url(../images/email-post.gif);

    background-repeat: no-repeat;

    background-position: .3rem .3rem;

    border: solid 1px #8e8c8c;

    border-radius: 25px;

    cursor:pointer;

    float: right;

    font-size: 1.3rem;

    margin: 3rem 3rem 0 0;;

    padding: .3rem 1rem;

    width: 11rem;

}



/* ------------------------------------------ */

/* ---- image styles --- */

/* ------------------------------------------ */



#logoImage {

    margin-top: 5.7rem;

    width: 42.9rem;

}



#indexPeoplePic {

    float: right;

    margin: 0 2rem 0 0;

    width: 100%;

}



#homePagePic {

    margin-bottom: -.3rem;

    width: 2.9rem;

}



#logoText {

    width: 24.9rem;

}



.rightColPic {

    margin: -2rem 0 1rem 0;

    width: 100%;

}



.rightColLogos {

    margin: 1.5rem 0 1rem 0;

    width: 100%;

}



/* ------------------------------------------ */

/* ---- map styles --- */

/* ------------------------------------------ */



#areaMapPic {

    border-radius: 5px;

    cursor: pointer;

    transition: 0.3s;

}



.mapText {

    font-size: 1.5rem;

    font-weight: 700;

}



##areaMapPic:hover {opacity: 0.7;}



/* The Modal (background) */

.modal {

    display: none;

    position: fixed;

    z-index: 1;

    padding-top: 100px;

    left: 0;

    top: 0;

    width: 100%;

    height: 100%;

    overflow: auto;

    background-color: rgb(0,0,0);

    background-color: rgba(0,0,0,0.9);

}



/* Modal Content (image) */

.modal-content {

    margin: auto;

    display: block;

    width: 80%;

    max-width: 1000px;

}





/* Add Animation */

.modal-content {

    -webkit-animation-name: zoom;

    -webkit-animation-duration: 0.6s;

    animation-name: zoom;

    animation-duration: 0.6s;

}



@-webkit-keyframes zoom {

    from {-webkit-transform: scale(0)}

    to {-webkit-transform: scale(1)}

}



@keyframes zoom {

    from {transform: scale(0.1)}

    to {transform: scale(1)}

}



/* The Close Button */

.close {

    position: absolute;

    top: 15px;

    right: 35px;

    color: #f1f1f1;

    font-size: 40px;

    font-weight: bold;

    transition: 0.3s;

}



.close:hover,

.close:focus {

    color: #bbb;

    text-decoration: none;

    cursor: pointer;

}



/* 100% Image Width on Smaller Screens */

@media only screen and (max-width: 700px){

    .modal-content {

        width: 100%;

    }

}



/* ----------------------------------------------------------------------------------------- */

/* ---- @media styles --- */

/* ---------------------------------------------------------------------------------------- */



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



    #indexWelcomeInnerDiv {

        margin: 0;

    }



   #indexWelcomeRightDiv {

        max-width: 57.5rem;

    }

}



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



    #indexHeaderDiv, header {

        padding: 0 1rem 2rem 1rem;

    }



    #headerInnerDiv {

        max-width: 107rem;

    }



    #headerInnerLeftDiv {

        float: left;

    }



    #indexPeoplePic {

        width: 90%;

    }



    #phoneDiv {

        margin: -14.7rem 0 11rem 0;

    }



    #pageHeadingInnerDiv {

        max-width: 96.8rem;

    }



    #mainInnerLeftDiv {

        padding: 0 1.5rem;

        width: 60%;

    }



    #mainInnerRightDiv {

        float: right;

        width: 33.9rem;

    }



    #contactInnerDiv {

        max-width: 107rem;

    }



    #regionalContentleftDiv {

        float: left;

        margin: 4.3rem .5rem 2rem .5rem;

        width: 60%;

    }



    #footerInnerDiv {

        max-width: 107rem;

    }

}





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



    #indexWelcomeLeftDiv {

        float: none;

        padding: 0 0 3rem 0;

        margin: 0 auto;

    }



    .boxLink1Div {

        margin-top: 3.35rem;

    }



    #indexWelcomeRightDiv {

        float: none;

        margin: 0 auto;

        width: 57.5rem;

    }



    #indexPeoplePic {

        float: none;

        width: 57.5rem;

    }

}



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

    #mainInnerLeftDiv {

        width: 55%;

    }



    #regionalContentleftDiv {

        float: left;

        margin: 4.3rem .5rem 2rem .5rem;

        width: 55%;

    }

}





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



    #mainInnerLeftDiv {

        float: none;

        min-width: 95%;

    }



    .mainLeftIndentDiv {

        padding: 3.5rem 1rem 2rem 5rem;

    }



    #mainInnerRightDiv {

        float: none;

        margin: 0 auto 4rem auto;

    }



    #regionalContentleftDiv {

        float: none;

        margin: 4.3rem .5rem 2rem .5rem;

        min-width: 95%;

    }



    #regionalContentRightDiv {

        float: none;

        margin: 0 auto 4rem auto;

    }





}



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



    #mainMenuUl {

        margin: 1.25rem 0;

        padding: 0;

    }

 }



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



    #footerLeftDiv {

        float: none;

    }



    #footerRightDiv {

        float: none;

    }

}



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



    header {

        padding: 0 1rem 3.5rem .5rem;

    }



    #phoneDiv {

        margin: -14rem 0 9rem 0;

    }



    #logoImage {

        margin-top: 4rem;

    }



    nav {

        clear: right;

        max-height: 28rem;

        margin: -6rem 0 0 0;

    }



    #indexPeoplePic {

        max-width: 100%;

    }



    .keepTogether {

        display: inline-block;

        margin-top: 2rem;

    }



 }



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

    #logoImage {

        margin-top: 5.7rem;

        width: 36rem;

    }



    h1 {

        font-size: 5rem;

        margin-top: 1.4rem;

    }





}



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

    h1 {

        font-size: 4rem;

        margin-top: .8rem;

    }

}



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

    h1 {

        font-size: 3.5rem;

        margin-top: 1.20rem;

    }

}



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

    h1 {

        font-size: 3rem;

        margin-top: 1.50rem;

    }

}