
*{margin:0px; padding:0px; border:0px;} table {border-collapse:collapse;} img {vertical-align:middle;}
input {-webkit-appearance:none; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; outline:none;} 
select {-webkit-appearance:none; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; outline:none;}
textarea {-webkit-appearance:none; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; outline:none;}
header:after {content:"."; display:block; height:0; clear:both; overflow:hidden;}  header {display:inline-block;}  * html header {height: 0px; overflow:hidden;}  header {display: block; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;} 
nav:after {content:"."; display:block; height:0; clear:both; overflow:hidden;}  nav {display:inline-block;}  * html nav {height: 0px; overflow:hidden;}  nav {display: block; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;} 
section:after {content:"."; display:block; height:0; clear:both; overflow:hidden;}  section {display:inline-block;}  * html section {height: 0px; overflow:hidden;}  section {display: block; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;} 
article:after {content:"."; display:block; height:0; clear:both; overflow:hidden;}  article {display:inline-block;}  * html article {height: 0px; overflow:hidden;}  article {display: block; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;} 
aside:after {content:"."; display:block; height:0; clear:both; overflow:hidden;}  aside {display:inline-block;}  * html aside {height: 0px; overflow:hidden;}  aside {display: block; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;} 
footer:after {content:"."; display:block; height:0; clear:both; overflow:hidden;}  footer {display:inline-block;}  * html footer {height: 0px; overflow:hidden;}  footer {display: block; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;} 
div:after {content:"."; display:block; height:0; clear:both; overflow:hidden;}  div {display:inline-block;}  * html div {height: 0px; overflow:hidden;}  div {display: block; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;} 


body {background-color:#ffffff; font-family:Lato-Regular,helvetica; font-size:100%;  overflow-x: hidden;}

table {border-collapse: collapse; margin-bottom:20px; width:100%; font-size:1em; max-width:600px;}
tr {border-bottom:1px solid #c0c0c0; padding:15px 20px; }
td {padding:15px 20px;}
td h2 {font-size:1.40em; padding-bottom:5px;}

/* BASIC FONT STYLES */

@font-face {font-family: 'Lato-Bold'; src: url('fonts/Lato-Bold.eot'); src: url('fonts/Lato-Bold.eot?#iefix') format('embedded-opentype'), url('fonts/Lato-Bold.woff') format('woff'), url('fonts/Lato-Bold.ttf') format('truetype'), url('fonts/Lato-Bold.svg#nexa_boldregular') format('svg'); font-weight: normal; font-style: normal;}
@font-face {font-family: 'Lato-Light';src: url('fonts/Lato-Light.eot');src: url('fonts/Lato-Light.eot?#iefix') format('embedded-opentype'),url('fonts/Lato-Light.woff') format('woff'),url('fonts/Lato-Light.ttf') format('truetype'),url('fonts/Lato-Light.svg#nexa_boldregular') format('svg');font-weight: normal;font-style: normal;}
@font-face {font-family: 'Lato-Black'; src: url('fonts/Lato-Black.eot'); src: url('fonts/Lato-Black.eot?#iefix') format('embedded-opentype'),url('fonts/Lato-Black.woff') format('woff'),url('fonts/Lato-Black.ttf') format('truetype'),url('fonts/Lato-Black.svg#nexa_boldregular') format('svg');font-weight: normal; font-style: normal;}
@font-face { font-family: 'Lato-Hairline';src: url('fonts/Lato-Hairline.eot');src: url('fonts/Lato-Hairline.eot?#iefix') format('embedded-opentype'),url('fonts/Lato-Hairline.woff') format('woff'),url('fonts/Lato-Hairline.ttf') format('truetype'),url('fonts/Lato-Hairline.svg#nexa_boldregular') format('svg');font-weight: normal;font-style: normal;}
@font-face {font-family: 'Lato-Regular';src: url('fonts/Lato-Regular.eot');src: url('fonts/Lato-Regular.eot?#iefix') format('embedded-opentype'),url('fonts/Lato-Regular.woff') format('woff'),url('fonts/Lato-Regular.ttf') format('truetype'),url('fonts/Lato-Regular.svg#nexa_boldregular') format('svg');font-weight: normal;font-style: normal;}

h1 { padding:0px 0px 20px 0px; font-size:2.60em; color:#222222; font-weight:normal; font-family:Lato-Black; }
h2 { padding:0px 0px 20px 0px; font-size:2.20em; color:#222222; font-weight:normal; font-family:Lato-Black;}
h3 { padding:0px 0px 10px 0px; font-size:1.80em; color:#222222; font-weight:normal; font-family:Lato-Bold;}
h4 { padding:0px 0px 10px 0px; font-size:1.10em; color:#222222; font-weight:normal; font-family:Lato-Bold;}
input { font-size:1.10em; font-family:Lato-Regular;}
select { font-size:1.10em; font-family:Lato-Regular;}
textarea { font-size:1.10em; font-family:Lato-Regular;}

p { padding:0px 0px 10px 0px; font-size:1.10em;  color:#222222; line-height:1.70em;}
a { color:#222222; text-decoration:none; }
a:hover { color:#666666; text-decoration:none; }

ol { margin:0 0 15px 25px; }
ul { margin:0 0 15px 25px; }
li { font-size:1.10em; margin-bottom:8px; color:#222222;  line-height:1.70em;}

.textcolour1 {color:#222222;}
.textcolour2 {color:#666666;}
.textcolour3 {color:#666666;}

::selection {color:#ffffff; background-color:#222222;}
::-moz-selection {color:#ffffff; background-color:#222222;}
::-webkit-input-placeholder {color: #666666;}
:-ms-input-placeholder {  color: #666666;}
::-moz-placeholder {  color: #666666;  opacity: 1;}
:-moz-placeholder {color: #666666; opacity: 1;}




/* BASIC FORM STYLES */

section#ContactFormLeft {float:right; width:65%;}
section#ContactFormRight {float:left; width:30%;}
.ContactForm input {padding:20px; width:100%; background-color:#e9e9e9; border-radius:6px; float:left; margin-bottom:10px;}
.ContactForm select {padding:20px; width:100%; background-color:#e9e9e9; border-radius:6px; float:left; margin-bottom:10px;}
.ContactForm textarea {padding:20px; width:100%; height:100px; border-radius:6px;  background-color:#e9e9e9 !important; margin-bottom:10px;}
              .ContactForm input.tick {width:30px; height:30px; background-color:#efefef; border-radius:6px; float:left; padding:0px; margin-right:6px;  color:#000000;  content: '\2714';}
              .ContactForm input.tick[type=checkbox]:checked {background: #222222;}
              .ContactForm input.circle {width:30px; height:30px; background-color:#efefef; border-radius:50px; float:left; padding:0px; margin-right:6px; color:#000000;  content: '\2714';}
              .ContactForm input.circle[type=radio]:checked {background: #222222;}
.ContactForm .SubmitButton {font-size:0.95em; color:#ffffff; background-color:#222222; width:150px; -o-transition: 1s; -moz-transition: 1s; -khtml-transition: 1s; -webkit-transition: 1s; -ms-transition: 1s; transition: 1s; cursor: pointer;}
.ContactForm .SubmitButton:hover {background-color:#222222; }
.Hide {display:none;}

.SearchForm input {padding:20px; width:200px; background-color:#e9e9e9; border-radius:6px; float:left; margin-bottom:10px; margin-right:5px;}
.SearchForm .SubmitButton {font-size:0.95em; color:#ffffff; float:left; background-color:#222222; width:100px; -o-transition: 1s; -moz-transition: 1s; -khtml-transition: 1s; -webkit-transition: 1s; -ms-transition: 1s; transition: 1s; cursor: pointer;}
.SearchForm .SubmitButton:hover {background-color:#222222; }

#Pray input {padding:20px; width:48%; background-color:#e9e9e9; border-radius:6px; float:left; margin:0 1% 10px 1%;}
#Pray textarea {padding:20px; width:98%; height:100px; border-radius:6px;  background-color:#e9e9e9 !important; margin:0 1% 10px 1%;}
#Pray .SubmitButton {font-size:0.95em; color:#ffffff; background-color:#222222; width:150px; -o-transition: 1s; -moz-transition: 1s; -khtml-transition: 1s; -webkit-transition: 1s; -ms-transition: 1s; transition: 1s; cursor: pointer;}
#Pray .SubmitButton:hover {background-color:#222222; }


.SideForm input {padding:20px; width:31.3%; background-color:#e9e9e9; border-radius:6px; float:left; margin:0 1% 10px 1%;}
.SideForm select {padding:20px; width:31.3%; background-color:#e9e9e9; border-radius:6px; float:left; margin:0 1% 10px 1%;}
.SideForm textarea {padding:20px; width:31.3%; float:left; height:100px; border-radius:6px;  background-color:#e9e9e9 !important; margin:0 1% 10px 1%;}
              .SideForm input.tick {width:30px; height:30px; background-color:#efefef; border-radius:6px; float:left; padding:0px; margin-right:6px;  color:#000000;  content: '\2714';}
              .SideForm input.tick[type=checkbox]:checked {background: #222222;}
              .SideForm input.circle {width:30px; height:30px; background-color:#efefef; border-radius:50px; float:left; padding:0px; margin-right:6px; color:#000000;  content: '\2714';}
              .SideForm input.circle[type=radio]:checked {background: #222222;}
.SideForm .SubmitButton {font-size:0.95em; color:#ffffff; background-color:#222222; width:150px; -o-transition: 1s; -moz-transition: 1s; -khtml-transition: 1s; -webkit-transition: 1s; -ms-transition: 1s; transition: 1s; cursor: pointer;}
.SideForm .SubmitButton:hover {background-color:#222222; }







/* HEADER STYLES */

		nav#MainNavigationOuter {width:95%; height:70px; max-width:1400px; position:relative; margin:auto; background-color:#ffffff; }
		nav#MainNavigation {width:70%; max-width:1400px; height:50px; position:relative; float:left; padding:10px 0 10px 0;}

.HeadOuter {width:100%; height:80vh; position: relative;  float:left; background-color:#ffffff; background-position:center center; background-size:cover; background-image:url('../images/headBG.jpg'); }
header.HeadInner {width:95%; max-width:1400px;  margin:0 auto; position:relative; }
.SiteTopPadding {height:50vh !important; min-height:0px;}
.SiteTopPadding2 {min-height:650px;}

#Trans {float:left; width:100%; height:100%; background: rgba(255, 255, 255, 0.3);}


        #MegaMenuIcon {display:none;  }

              #HeadSocial {width:25%; float:right; height:70px;}
              #HeadSocial .SocialIcon {float:right; width:50px; margin:10px 5px 10px 5px; }
              #HeadSocial .SocialIcon svg {width:100%; height:auto; padding:0; float:left; display:block; position:relative;}
              #HeadSocial .SocialIcon svg path {fill:#222222 !important;}
              #HeadSocial .SocialIcon svg:hover path {fill:#888888 !important;}

    #Logo {width:50%; max-width:250px; height:auto; top:70px; left:0; right:0; margin-left:auto; margin-right:auto; position:absolute;}
      #Logo img {max-width:100%; width:100%; height:auto; border:none;}
		
    #SmallLogo {width:50%; max-width:180px; height:auto; top:40px; left:0; right:0; margin-left:auto; margin-right:auto; position:absolute;}
      #SmallLogo img {max-width:100%; width:100%; height:auto; border:none;}

    #HomeIntro {width:65%; top:330px; left:0; right:0; margin-left:auto; margin-right:auto; position:absolute; }
            #HomeIntro p {text-align:center; font-size:2.20em; font-family:Lato-Black; line-height:44px;}

    #PageTitle {width:65%; top:210px; left:0; right:0; margin-left:auto; margin-right:auto; position:absolute; }
            #PageTitle h1 {text-align:center; font-size:2.20em; font-family:Lato-Black; line-height:44px;}

#Callouts {width:100%; position:absolute; top:-150px; left:0; }
#Callout1 {border-radius:50%; width:23.3%; float:left; margin:0 5% 0 5%; background-color:#ffffff; height:330px; background-position:center center; background-size:cover; background-image:url('../images/callout1.jpg');}
#Callout2 {border-radius:50%; width:23.3%; float:left; margin:0 5% 0 5%; background-color:#ffffff; height:330px; background-position:center center; background-size:cover; background-image:url('../images/callout2.jpg');}
#Callout3 {border-radius:50%; width:23.3%; float:left; margin:0 5% 0 5%; background-color:#ffffff; height:330px; background-position:center center; background-size:cover; background-image:url('../images/callout3.jpg');}
#Callout1 p {text-align:center; line-height:330px; font-family:Lato-Black; font-size:2em; color:#222222;}
#Callout2 p {text-align:center; line-height:330px; font-family:Lato-Black; font-size:2em; color:#222222;}
#Callout3 p {text-align:center; line-height:330px; font-family:Lato-Black; font-size:2em; color:#222222;}


/* MEGA DROP DOWN MENU */

            .sidenav {height:100%; width: 0; position: fixed; z-index:100; top: 0; right: 0; background-color: #222222; overflow-x: hidden; padding-top: 60px; transition: 0.5s; }
            .sidenav .closebtn {position: absolute; top: 0; right: 25px; font-size: 36px; margin-left: 50px; color:#555555;}

            .MegaDropBlock {width:100%; float:left;  margin-bottom:15px; margin-left:20px; }
                 .MegaDropBlock a {color:#ffffff; letter-spacing:-1px; display:block; font-size:1.90em;  }
                 .MegaDropBlock a:hover {color:#555555;}

            .MegaDropBlockList {float:left; margin-top:10px; margin-left:20px; clear:both;}
                  .MegaDropBlockList a {color:#555555; display:block;  height:auto; letter-spacing:0px; font-size:1.30em; }
                  .MegaDropBlockList a:hover {color:#ffffff;}


/* STANDARD DROP DOWN MENU */

p.TopNav {text-align:center;}

            a.btn {font-size:0.95em; display:block; color:#222222; float:left;  line-height:50px; padding:0 15px 0 15px; text-align:center;}
            a.btn:hover {color:#ffffff; background-color:#222222;}

                    a.btnActive {font-size:0.95em; display:block; color:#888888;  float:left; line-height:50px; padding:0 15px 0 15px; text-align:center;}
                    a.btnActive:hover {color:#ffffff; background-color:#222222;}






/* FOOTER STYLES */

            .FootTopOuter {width:100%; height:auto; position: relative;  float:left; background-color:#e5e1e1;}
            footer.FootTopInner {width:95%; max-width: 1400px; padding:60px 0 60px 0;  margin:0 auto; position:relative; }
                        .FootFloat {float:left; width:29.3%; margin:0 2% 0 2%;}
                        .FootFloat p {text-align:center; font-family:Lato-Bold; font-size:1.10em;}
                        .FootFloat h3 {text-align:center; font-family:Lato-Bold; font-size:1.40em;}
  
            .FootOuter {width:100%; height:auto; position: relative;  float:left; background-color:#807e7e;}
            footer.FootInner {width:95%; max-width: 1400px; padding:10px 0 10px 0; margin:0 auto; position:relative; }

            nav#NavigationBottom {width:70%; margin-top:15px;position:relative; float:left;}

            p.FooterNav { font-size:1.10em;  color:#ffffff; padding:0px; text-align:left; }
            p.FooterNav a { color:#ffffff;  }
            p.FooterNav a:hover { color:#222222; }
            .FootLinks {margin:0 10px 0 10px;}


              #MenuSocial {width:180px; margin:100px 0 0 20px; float:left;}
              
              #FootSocial {width:25%; float:right;}
              .SocialIcon {float:right; width:30px; margin:0 5px 0 5px; }
              .SocialIcon svg {width:100%; height:auto; padding:0; float:left; display:block; position:relative;}
              .SocialIcon svg path {fill:#ffffff !important;}
              .SocialIcon svg:hover path {fill:#222222 !important;}

            .Salt {float:left; text-align:left; color:#111111; font-size:0.75em; width:100%;}
            .Salt a { color:#111111;  margin-left:10px;}
            .Salt a:hover { color:#ffffff; text-decoration:none; }




/* MAIN BODY STYLES */

section.Outer {width:100%; height:auto; position: relative;  float:left; background-color:#ffffff;}
section.Inner {width:95%; max-width: 1400px; padding:80px 0 80px 0;  margin:0 auto; position:relative; }

#MainLeft {float:left; width:72%;} 
#MainRight {float:right; width:25%;} #MainRight img {width:100%;}

.CommLeft {float:left; width:20%; clear:both; margin-bottom:50px; } .CommLeft img {width:100%;}
.CommRight {float:right; width:75%; margin-bottom:50px; }

section.GreyOuter {width:100%; height:auto; position: relative;  float:left; background-color:#3f3f3f;}
section.GreyInner {width:95%; max-width: 1400px; padding:80px 0 80px 0;  margin:0 auto; position:relative; }
    section.GreyInner p {text-align:center; color:#ffffff; font-family:Lato-Bold; font-size:1.20em; }
    section.GreyInner h2 {text-align:center; color:#ffffff;  }

      .CalloutPadding {padding-top:230px !important;}

section.WhatsOnOuter {width:100%; height:auto; position: relative;  float:left; background-image:url('../images/whatsonBG.jpg'); background-position:center center; background-size:cover;}
section.WhatsOnInner {width:95%; max-width: 1400px; padding:80px 0 80px 0;  margin:0 auto; position:relative; }
    section.WhatsOnInner h2 {text-align:center; color:#222222;  }


.MoreBTN {margin-top:30px; background-color:#222222; color:#ffffff; text-align:center; padding:20px; margin:auto; width:300px; -o-transition: 1s; -moz-transition: 1s; -khtml-transition: 1s; -webkit-transition: 1s; -ms-transition: 1s; transition: 1s;}
.MoreBTN:hover {background-color:#888888;}

.Breadcrumbs {float:left; margin:0px 1% 0px 1%; clear:both; width:98%;}
.Breadcrumbs p {font-size:0.80em; color:#555555;}
.Breadcrumbs a { font-weight:600;}
.Breadcrumbs a:hover {text-decoration:underline; }

.TextBlockFull {margin:0px 1% 0px 1%; clear:both;}
.TextBlock2Col {margin:0px 1% 0px 1%; clear:both; -webkit-column-count:2; -moz-column-count:2; column-count:2; -webkit-column-gap: 40px; -moz-column-gap: 40px; column-gap: 40px;}
.TextBlock2Col p {-webkit-column-break-inside: avoid; page-break-inside: avoid; break-inside: avoid-column; display:table;}

.addthis_inline_share_toolbox {margin:0px 1% 0px 1%; clear:both;}



/* CONTACT FORM */

section#ContactFormLeft {float:left; width:65%;}
section#ContactFormRight {float:right; width:30%;}
#map {height:450px; width:100%; display:block; float:left;}



/* CHILD PAGES */

#ChildPages article {width:31.3%; height:auto; margin:0px 1% 30px 1%; position:relative; float:left; overflow:hidden;}
#ChildPages article:hover {background-color:#cccccc;}
#ChildPages article img {padding:0px; margin:0px; overflow:hidden; width:100%; height:auto;}
#ChildPages article .LinkBar {width:100%; position:absolute; bottom:0px; left:0px; background: rgba(0, 0, 0, 0.6);}
#ChildPages article .LinkBar p { color:#ffffff;  font-weight:normal; padding:10px; margin:0px;}






/* FAQ LISTINGS */

section#FAQListing {width:100%; clear:both;}

div.accordion {outline:none; margin:0 1% 10px 1%; width:98%; cursor:pointer; background-color:#e9e9e9; border-radius:4px; padding:16px; position:relative;}
div.accordion.active {background-color:#cccccc; }
div.accordion:hover {background-color:#cccccc; }
div.accordion h2 {color:#222222; font-size:1.20em; padding:0; margin:0;}
div.panel {display:none;}
div.panel.show {display: block; padding:16px; width:100%;}
.Arrow {width:30px; position:absolute; top:10px; right:30px;}
.Arrow img {width:100%;}






/* GENERAL LISTINGS */

section#GeneralListing {width:100%; clear:both;}
section#GeneralListing article {float:left; position:relative; width:33%; margin:0px 0 30px 0.3%; min-height:500px; overflow:hidden; background-color:#3f3f3f; -o-transition: 1s; -moz-transition: 1s; -khtml-transition: 1s; -webkit-transition: 1s; -ms-transition: 1s; transition: 1s;}
section#GeneralListing article:hover {background-color:#222222; }
section#GeneralListing .NewsLeft {float:left; width:100%; margin:0px; position:relative;}
section#GeneralListing .NewsLeft img {width:100%; height:auto;}
section#GeneralListing .NewsRight {float:right; position:relative; width:100%; padding:5%; margin:0px;}
section#GeneralListing article h2 { font-size:1.20em !important;  color:#ffffff; }
section#GeneralListing article p { color:#ffffff; font-size:1em; line-height:24px; font-family:Lato-Regular;}

        .Date {width:100px; height:100px; position:absolute; bottom:0px; left:20px; background-color:#aeadad;}
        p.Day {color:#222222 !important; font-size:3em !important; text-align:center; padding:30px 0 5px 0; line-height:34px;}
        p.Month {color:#222222 !important; font-size:1em !important; text-align:center; padding:0px; line-height:26px;}

section#GeneralPagination {float:left; clear:both; width:98%; margin:0px 1% 0px 1%; }
section#GeneralPagination .Pagination2 {float:left; border:1px solid #e9e9e9; background-color:#e9e9e9;  font-size:0.85em;  color:#111111; padding:5px 9px 5px 9px; margin-right:6px; margin-bottom:5px;}
section#GeneralPagination .Pagination {float:left; border:1px solid #e9e9e9; font-size:0.85em;  color:#222222; padding:5px 9px 5px 9px; margin-right:6px; margin-bottom:5px;}
section#GeneralPagination .Pagination a {color:#222222; text-decoration:none;  }
section#GeneralPagination .Pagination a:hover {color:#222222; text-decoration:none; }
p.ItemsFrom {margin-left:1%; font-style: italic;}


#MainTags {margin:0 1% 0 1%;}
#MainTags p.tag { font-size:0.80em;  color:#ffffff; padding:2px 4px 2px 4px; display:block; float:left; background-color:#222222; margin-right:8px; margin-bottom:8px;}
#MainTags p.tag a {color:#ffffff; text-decoration:none;}
#MainTags p.tag a:hover {color:#555555; text-decoration:none;}






/* MULTIMEDIA LISTINGS */

section#MultimediaListing {width:100%; clear:both;}
section#MultimediaListing ul.gallery {margin:0px; padding:0px;}
section#MultimediaListing .Block {display:block; float:left; width:23%; height:auto; position:relative; overflow:hidden; margin:0px 1% 30px 1%;}
section#MultimediaListing .Block img {width:100%; height:auto;  }
section#MultimediaListing .Description {width:auto; padding:5px; position:absolute; bottom:0px; left:0px; background: rgba(0, 0, 0, 0.6);}
section#MultimediaListing p {color:#ffffff; font-size:0.90em; padding:0px;}




/* EVENT LISTINGS */

section#EventListing article {width:33%; margin:0px 0 30px 0.3%; height:auto;  float:left; position:relative; }
section#EventListing article img {width:100%; }
section#EventListing article h2 { font-size:1.50em;  color:#ffffff; }
section#EventListing article p { font-size:0.80em;  color:#222222;}






/* CALENDAR LISTING */

section#CalendarListing td.cal-head { border-bottom:1px solid #e9e9e9; border-right:1px solid #e9e9e9; background:#e9e9e9; padding:10px; }
section#CalendarListing td.cal-weekday { border-bottom:1px solid #e9e9e9; border-right:1px solid #e9e9e9; background:#ffffff; padding:10px;}
section#CalendarListing td.cal-weekend { border-bottom:1px solid #e9e9e9; border-right:1px solid #e9e9e9; background:#e9e9e9; padding:10px;}
section#CalendarListing td.cal-weekend img, td.cal-weekday img { border:0px; }
section#CalendarListing p.Head { font-size:0.80em; color:#222222; }
section#CalendarListing p.Head a {color:#222222; text-decoration:none; font-weight:bold; }
section#CalendarListing p.Head a:hover {color:#222222; text-decoration:underline; font-weight:bold; }
section#CalendarListing p {font-size:0.80em;  color:#222222; padding: 0px 0px 0px 0px; }
section#CalendarListing p a {color:#222222; font-weight:bold; }
section#CalendarListing p a:hover {color:#222222; text-decoration:underline;  font-weight:bold; }





/* SITE MAP */

section#SiteMap .SiteMap1 {background-color:#cccccc; width:50%; margin:0 0 1px 0%; color:#222222; float:left; padding:15px 15px 15px 15px; clear:both;  }
section#SiteMap .SiteMap2 {background-color:#d9d9d9; width:48%; margin:0 0 1px 2%; color:#222222; float:left; padding:15px 15px 15px 15px; clear:both; }
section#SiteMap .SiteMap3 {background-color:#e5e5e5; width:46%; margin:0 0 1px 4%; color:#222222; float:left; padding:15px 15px 15px 15px; clear:both; }
section#SiteMap .SiteMap4 {background-color:#f2f2f2; width:44%; margin:0 0 1px 6%; color:#222222; float:left; padding:15px 15px 15px 15px; clear:both; }




/* PROJECT LISTINGS */

section#ProjectListing article {width:21%; height:auto; margin:0px 2% 30px 2%;  float:left; position:relative;}
section#ProjectListing article img {width:100%; }
section#ProjectListing article .Head {width:100%; background-color:#d9dcdb; float:left; position:relative; padding:15px;}
section#ProjectListing article h2 { font-size:1.20em; color:#222222; text-align:center; padding:0px !important;  margin:0px !important; line-height:22px !important;}
section#ProjectListing article p { font-size:1em; color:#222222; text-align:center; padding:0px !important;   margin:0px !important; line-height:22px !important;}
section#ProjectListing article.Top {width:30% !important; margin:0px 10% 30px 10%; }





@media only screen and (max-width: 1024px) { /* BLUE - FOR IPAD LANDSCAPE AND SMALLER */

#MainLeft {float:left; width:100%;}
#MainRight {float:right; width:100%; margin-top:30px;} 

        nav#MainNavigationOuter {display:none;}
        nav#MainNavigation {display:none;}

        #MegaMenuIcon {width:40px; position:absolute; right:0px; top:40px; padding:0px; display:inline-block; z-index:99; cursor:pointer;  }
        #MegaMenuIcon img {width:40px;}
        #MegaMenuIcon svg {width:100%; height:auto; padding:0; float:left; display:block; position:relative;}
        #MegaMenuIcon svg path {fill:#222222 !important;}
        #MegaMenuIcon svg:hover path {fill:#888888 !important;}

    
    #Logo { top:40px; }
		

    #HomeIntro {width:80%; top:280px; left:0; right:0; margin-left:auto; margin-right:auto; position:absolute; }

#Callouts {width:100%; position:absolute; top:-50px; left:0; }
#Callout1 {border-radius:50%; width:23.3%; float:left; margin:0 5% 0 5%; background-color:#ffffff; height:230px; }
#Callout2 {border-radius:50%; width:23.3%; float:left; margin:0 5% 0 5%; background-color:#ffffff; height:230px; }
#Callout3 {border-radius:50%; width:23.3%; float:left; margin:0 5% 0 5%; background-color:#ffffff; height:230px; }
#Callout1 p {text-align:center; line-height:230px; font-family:Lato-Black; font-size:2em; color:#222222;}
#Callout2 p {text-align:center; line-height:230px; font-family:Lato-Black; font-size:2em; color:#222222;}
#Callout3 p {text-align:center; line-height:230px; font-family:Lato-Black; font-size:2em; color:#222222;}
    

}




@media only screen and (max-width: 768px) { /* LIME - FOR IPAD PORTRAIT AND SMALLER */

          #ChildPages article {width:48%; margin:0px 1% 30px 1%;}
          section#GeneralListing article {width:48%;  min-height:640px; }
          section#MultimediaListing .Block { width:48%; }
          .TextBlock2Col {margin:0px 1% 0px 1%; clear:both; -webkit-column-count:1; -moz-column-count:1; column-count:1; -webkit-column-gap: 40px; -moz-column-gap: 40px; column-gap: 40px;}
          section#ContactForm {width:98%; margin:0px 1% 0px 1%; clear:both;}

.SideForm input {padding:20px; width:48%; }
.SideForm select {padding:20px; width:48%;}
.SideForm textarea {padding:20px; width:48%;}


#Callouts {width:100%; position:absolute; top:-50px; left:0; }
#Callout1 {border-radius:50%; width:23.3%; float:left; margin:0 5% 0 5%; background-color:#ffffff; height:170px; }
#Callout2 {border-radius:50%; width:23.3%; float:left; margin:0 5% 0 5%; background-color:#ffffff; height:170px; }
#Callout3 {border-radius:50%; width:23.3%; float:left; margin:0 5% 0 5%; background-color:#ffffff; height:170px; }
#Callout1 p {text-align:center; line-height:170px; font-family:Lato-Black; font-size:2em; color:#222222;}
#Callout2 p {text-align:center; line-height:170px; font-family:Lato-Black; font-size:2em; color:#222222;}
#Callout3 p {text-align:center; line-height:170px; font-family:Lato-Black; font-size:2em; color:#222222;}

section#EventListing article {width:100%; margin:0px 0 20px 0%; height:auto;  float:left; position:relative; }

section#GeneralListing article {width:100%; margin:0px 0 20px 0%; min-height:auto;}

section#ProjectListing article {width:46%; height:auto; margin:0px 2% 30px 2%;  float:left; position:relative;}
section#ProjectListing article.Top {width:46% !important; margin:0px 2% 30px 2%; }

section#ContactFormLeft {float:right; width:100%;}
section#ContactFormRight {float:left; width:100%; margin-top:40px;}

}





@media only screen and (max-width: 667px) and (orientation: portrait)  { /* PURPLE - FOR IPHONE 6 PORTRAIT AND SMALLER */

      body {font-size:90%;}
      .sidenav {padding-top:15px;}

section#ProjectListing article {width:96%; height:auto; margin:0px 2% 30px 2%;  float:left; position:relative;}
section#ProjectListing article.Top {width:96% !important; margin:0px 2% 30px 2%; }


      .FootLinks {display:block;}
      
      #ChildPages article {width:98%; }
      section#GeneralListing article {width:98%;  min-height:auto; }


            nav#NavigationBottom {width:100%; margin-top:15px;position:relative; float:left;}
                         #FootSocial {width:100%; float:right;}
             .FootFloat {float:left; width:96%; margin:0 2% 0 2%;}

    #Callouts {display:none;}

.HeadOuter {width:100%; height:100vh;  }
      .CalloutPadding {padding-top:80px !important;}

            #HomeIntro p {text-align:center; font-size:1.70em; font-family:Lato-Black; line-height:32px;}

.SideForm input {padding:20px; width:98%; }
.SideForm select {padding:20px; width:98%;}
.SideForm textarea {padding:20px; width:98%;}

}



/* ADMIN SIDE MENU */

#AdminMenuButton {position:fixed; top:20px; left:10px; background-color:#111111; width:40px; height:40px; border-radius:50px;} 
                          #AdminMenuButton img {height:20px; clear:both; padding:10px;}
                          #AdminMenuButton svg {width:20px; height:20px; float:left; margin:10px; display:block; position:relative; cursor:pointer;}
                          #AdminMenuButton svg path {fill:#ffffff !important;}
                          #AdminMenuButton svg:hover path {fill:#6ebebb !important;}

            .sidenavadmin {height:100%; width: 0; position: fixed; z-index:100; top: 0; left:-250px; background-color: #111111; overflow-x: hidden; padding-top: 60px; transition: 0.5s; }
            .sidenavadmin .closebtnadmin {position: absolute; top: 0; right: 25px; font-size: 36px; margin-left: 50px; color:#555555;}

                          #Nav {float:left; width:100%;} #Nav img {height:20px;}
                          #Nav a {float:left; border-bottom:1px solid #222222; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;  display:block; clear:both; width:100%; text-decoration:none; font-weight:400; color:#ffffff;  font-size:0.90em; padding:10px 5% 10px 5%;
                          -o-transition: 1s;
                          -moz-transition: 1s;
                          -khtml-transition: 1s;
                          -webkit-transition: 1s;
                          -ms-transition: 1s;
                          transition: 1s;}
                          #Nav a:hover {background: #222222; /* For browsers that do not support gradients */
                          background: -webkit-linear-gradient(left, #222222 , #111111); /* For Safari 5.1 to 6.0 */
                          background: -o-linear-gradient(right, #222222, #111111); /* For Opera 11.1 to 12.0 */
                          background: -moz-linear-gradient(right, #222222, #111111); /* For Firefox 3.6 to 15 */
                          background: linear-gradient(to right, #222222 , #111111); /* Standard syntax */ border-left:6px solid #6ebebb;}

                          #Nav svg {width:20px; height:20px; margin-right:20px; margin-left:10px; float:left; display:block; position:relative;}
                          #Nav svg path {fill:#ffffff !important;}


/* RIGHT SIDE ICONS */

.bubble1 {background-color:#111111; z-index:99; border-radius:50px; position:fixed; width:40px; height:40px; bottom:80px;  right:10px; }
.bubble1 img {height:20px; clear:both; padding:10px;}
.bubble1 svg {width:20px; height:20px; float:left; margin:10px; display:block; position:relative; cursor:pointer;}
.bubble1 svg path {fill:#ffffff !important;}
.bubble1 svg:hover path {fill:#6ebebb !important;}

.bubble2 {background-color:#111111; z-index:99; border-radius:50px; position:fixed; width:40px; height:40px; bottom:125px;  right:10px; }
.bubble2 img {height:20px; clear:both; padding:10px;}
.bubble2 svg {width:20px; height:20px; float:left; margin:10px; display:block; position:relative; cursor:pointer;}
.bubble2 svg path {fill:#ffffff !important;}
.bubble2 svg:hover path {fill:#6ebebb !important;}

.bubble3 {background-color:#111111; z-index:99; border-radius:50px; position:fixed; width:40px; height:40px; bottom:170px;  right:10px; }
.bubble3 img {height:20px; clear:both;padding:10px; }
.bubble3 svg {width:20px; height:20px; float:left; margin:10px; display:block; position:relative; cursor:pointer;}
.bubble3 svg path {fill:#ffffff !important;}
.bubble3 svg:hover path {fill:#6ebebb !important;}

.bubble4 {background-color:#111111; z-index:99; border-radius:50px; position:fixed; width:40px; height:40px; bottom:215px;  right:10px; }
.bubble4 img {height:20px; clear:both; padding:10px;}
.bubble4 svg {width:20px; height:20px; float:left; margin:10px; display:block; position:relative; cursor:pointer;}
.bubble4 svg path {fill:#ffffff !important;}
.bubble4 svg:hover path {fill:#6ebebb !important;}


/* ON ELEMENT ICONS */

.MultimediaIcons {position:absolute; top:0px; left:0px;}
.MultimediaIcons svg {width:32px; height:32px; padding:8px 0 0 8px; float:left; display:block; position:relative;}
.MultimediaIcons svg path {fill:#222222 !important;}
.MultimediaIcons svg:hover path {fill:#969696 !important;}


#AlertPanel {width:98%; margin:0 1% 40px 1%; border-radius:8px; background-color:#222222; padding-top:15px; padding-bottom:15px;  text-align:center; line-height:16px;  font-size:1.10em; clear:both; }
p.AlertPanelText {padding:0px; margin:0px; color:#ffffff;}

.cke_editable.cke_editable_inline{cursor: pointer;}
.cke_editable.cke_editable_inline.cke_focus {	box-shadow: inset 0px 0px 20px 3px #ddd, inset 0 0 1px #000;	outline: none;	background: #eee;	cursor: text;}
.cke_editable_inline pre { white-space: pre-wrap; word-wrap: break-word;}