::selection {
    color: #fff;
    background-color: #333;
}
a {
	color: #999;
}
a:hover, a:focus {
	color: #fff;
	text-decoration: none;
}
/*--------------------------------------------------
Hamburger
----------------------------------------------------*/
.u-header-toggler--top-right, .u-header-toggler--top-right.btn {
	position: fixed;
    top: 0;
	right: 0;
    border-radius: 0;
	border: none;
	height: 74px;
	width: 80px;
	background-color:rgba(0, 0, 0, 0.1);
}
.btn:not(.btn-secondary):not([class*=btn-outline-]):not(.btn-link) {
    box-shadow: 0 0 0 0 rgba(0,0,0,.0);
    border: 0;
}
.g-bg-black-opacity-0_8 {
    background-color: rgba(45, 45, 45, 0.8) !important;
}
.hamburger {
    padding: 0;
}
.hamburger:hover {
    opacity: 1;
}
.hamburger-box {
    position: relative;
    display: inline-block;
    width: 40px;
    height: 24px;
}
.hamburger-inner, .hamburger-inner:after, .hamburger-inner:before {
	width: 40px;
    background-color: #FFF;
	height: 3px;
	border-radius: 0px;
}
.hamburger-inner::before, .hamburger-inner::after {
    content: "";
    display: block;
}
.hamburger-inner::before {
    top: -10px;
}
.hamburger-inner::after {
    bottom: -10px;
}
/*--------------------------------------------------
Menu
----------------------------------------------------*/
.cca-menu {
	font-family: 'Montserrat', sans-serif;
	padding: 75px 20px 20px 20px;
}
.cca-menu i {
    font-size: 20px;
}
.cca-menu ul {
	padding: 0;
	margin: 0;
	list-style: none;
}
.cca-menu li {
	display: block;
}
.cca-menu a {
	background-color: #333;
	font-size: 15px;
	line-height: 15px;
	font-weight: 600;
	color: #fff;
	display: block;
	padding: 6px 0 6px 6px;
	margin-bottom: 2px;
}
.cca-menu a:hover, .cca-menu a:focus {
	background-color: #222;
	color: #2db4a5;
	text-decoration: none;
	transition: all .2s ease-in-out;
}
.cca-menu-head {
	font-size: 12px;
	font-weight: 500;
	color: #666;
	text-transform: uppercase;
	border-bottom: 1px solid #333;
	padding: 4px 0 4px 0;
	margin: 9px 0 4px 0;
}
/*--------------------------------------------------
Header
----------------------------------------------------*/
.quicklink-bar {
	display: none;
}
.header-bar {
	position: absolute;
    display: block;
	top: 0;
	width: 100%;
	height: 74px;
	z-index: 399;
	background: rgba(0,0,0,0.20);
}
.cca-logo {
	position: absolute;
	top: 17px;
	left: 15px;
	width: 210px;
	z-index: 400;
}
.quick-links {
	position: absolute;
	top: 27px;
	right: 220px;
	z-index: 400;
	font-family: 'Montserrat', sans-serif;
	font-weight: 500;
	font-size: 13px;
}
.quick-links a {
	color: #c6c6c6;
}
.quick-links a:hover, .quick-links a:focus {
	color: #fff;
}
.social-tw {
	position: absolute;
	top: 22px;
	right: 125px;
	z-index: 400;
}
.social-fb {
	position: absolute;
	top: 22px;
	right: 91px;
	z-index: 400;
}
.cca-churchsuite {
	position: absolute;
	top: 21px;
	right: 164px;
	z-index: 400;
}
/*--------------------------------------------------
Hero Promo Block
----------------------------------------------------*/
.hero-content {
	padding: 495px 0 150px 0;
}
.hero-welcome-script {
	position: absolute;
	display: inline-block;
	top: 170px;
	width: 915px;
	z-index: 500;
}
.hero-welcome-heading {
	display: inline-block;
	font-family: 'Montserrat', sans-serif;
	font-weight: 500;
	font-size: 46px;
	letter-spacing: 8px;
	color: #fff;
	text-transform: uppercase;
	background-color: rgba(65, 65, 65, 1.0);
	padding: 22px 23px 22px 30px;
}
.hero-tagline {
	font-family: 'Montserrat', sans-serif;
	font-weight: 500;
	font-size: 28px;
	letter-spacing: 1px;
	color: #fff;
	margin: 10px 0 60px 0;
}
.hero-scroll {
	font-size: 55px;
	color: #fff;
	line-height: 1.4;
}
.hero-scroll-text {
	font-family: 'Montserrat', sans-serif;
	font-weight: 600;
	font-size: 11px;
	letter-spacing: 3px;
	color: #fff;
	text-transform: uppercase;
}
/*--------------------------------------------------
Mission
----------------------------------------------------*/
.mission {
	padding: 100px 0 50px 0;
}
.mission h3 {
	font-family: 'Montserrat', sans-serif;
	font-weight: 800;
	font-size: 28px;
	color: #555;
	text-transform: uppercase;
	letter-spacing: 2px;
	margin-bottom: 5px;
}
.mission h4 {
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
	font-size: 20px;
	color: #555;
	text-transform: uppercase;
	margin-bottom: 5px;
}
.mission p {
	font-family: 'Montserrat', sans-serif;
	font-weight: 500;
	font-size: 20px;
	margin-bottom: 0;
}
.m-lead {
	font-family: 'Montserrat', sans-serif;
	font-size: 24px;
	font-weight: 600;
	margin-top: 15px;
	margin-bottom: 0;
	border-top: 2px solid #e6e6e6;
	border-bottom: 2px solid #e6e6e6;
	padding: 15px 0 15px 0;
}
.mission a {
	font-weight: 600;
	color: #555;
}
.mission a:hover, .mission a:focus {
	color: #2db4a5;
}
.mission-circle {
	width: 100px;
}
/*--------------------------------------------------
Video
----------------------------------------------------*/
.video-background {
	padding: 230px 0 230px 0;
}
.g-bg-black-opacity-0_3--after::after, .g-bg-black-opacity-0_3--before::before {
    background-color: rgba(65, 65, 65, 0.7) !important;
}
.video-background p {
	font-family: 'Montserrat', sans-serif;
	font-weight: 500;
	font-size: 24px;
}
/*--------------------------------------------------
Tile Selection
----------------------------------------------------*/
.tile-header h3 {
	font-family: 'Montserrat', sans-serif;
	font-weight: 800;
	font-size: 28px;
	color: #555;
	text-transform: uppercase;
	letter-spacing: 2px;
	margin: 50px 0 10px 0;
}
.divide {
	width: 600px;
}
.tile {
	height: 250px;
	margin-bottom: 30px;
}
.tile-text {
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
	font-size: 20px;
	line-height: 22px;
	color: #fff;
	text-transform: uppercase;
	margin-bottom: 0;
}
.g-bg-primary-opacity-0_8--after {background-color: rgba(65, 65, 65, 1.0) !important;}

.tile-teal {background-color: rgba(45, 180, 165, 1.0) !important;}
.tile-purple {background-color: rgba(105, 70, 150, 1.0) !important;}
.tile-red {background-color: rgba(200, 80, 95, 1.0) !important;}
.tile-blue {background-color: rgba(70, 145, 190, 1.0) !important;}

.g-bg-primary-opacity-0_8--before::after, .g-bg-primary-opacity-0_8--after::after {background-color: rgba(65, 65, 65, 1.0) !important;}

.after-teal::after {background-color: rgba(45, 180, 165, 1.0) !important;}
.after-purple::after {background-color: rgba(105, 70, 150, 1.0) !important;}
.after-red::after {background-color: rgba(200, 80, 95, 1.0) !important;}
.after-blue::after {background-color: rgba(70, 145, 190, 1.0) !important;}

/*--------------------------------------------------
Major Events Selection
----------------------------------------------------*/
.home-events h4 {
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
	font-size: 20px;
	color: #555;
	text-transform: uppercase;
	margin: 0;
}
.home-events p {
	font-family: 'Montserrat', sans-serif;
	font-weight: 500;
	font-size: 20px;
	margin: 0;
}
/*--------------------------------------------------
Footer Contact
----------------------------------------------------*/
.footer-contact {
	border-top: 7px solid #414141;
	margin-top: 60px;
}
.contact-block {
	padding: 40px 0 55px 0;
}
.footer-safeguarding {
	background-color: #252525;
}
.footer-safeguarding h4 {
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
	font-size: 20px;
	letter-spacing: 1px;
	color: #fff;
	text-transform: uppercase;
	margin-bottom: 5px;
}
.footer-legals {
	background-color: #353535;
	border-bottom: 7px solid #fff;
}
.footer-legals p {
    font-size: 1rem !important;
}
.footer-logo {
	width: 200px;
	opacity: 0.2;
}
.footer-social {
	width: 200px;
}
.footer-contact a {
	color: #999;
}
.footer-contact a:hover, .footer-contact a:focus {
	color: #fff;
	text-decoration: none;
}
.footer-legals a {
	color: #999;
}
.footer-legals a:hover, .footer-legals a:focus {
	color: #fff;
	text-decoration: none;
}
/*--------------------------------------------------
Colours
----------------------------------------------------*/
.bg-dark-grey {
	background-color: #2C2C2C;
}
.white {
	color: #FFFFFF;
}
.dark-grey {
	color: #2C2C2C;
}
.bg-mid-grey {
	background-color: #555;
}
.mid-grey {
	color: #555;
}
.bg-light-grey {
	background-color: #777;
}
.bg-very-light-grey {
	background-color: #e6e6e6;
}
.light-grey {
	color: #777;
}
.off-white {
	color: #999;
}
.bg-teal {
	background-color: #2db4a5;
}
.bg-blue {
	background-color: #4691be;
}
.bg-red {
	background-color: #c8505f;
}
.bg-orange {
	background-color: #e37c44;
}

















/*--------------------------------------------------
Large devices (less than 1400px)
----------------------------------------------------*/
@media (max-width: 1399px) {

.cca-menu a {
	font-size: 15px;
	line-height: 15px;
	padding: 6px 0 6px 6px;
}
.cca-menu-head {
	font-size: 12px;
	padding: 4px 0 4px 0;
	margin: 9px 0 4px 0;
}

/*--------------------------------------------------
Hero Promo Block
----------------------------------------------------*/
.hero-content {
	padding: 390px 0 110px 0;
}
.hero-welcome-script {
	top: 140px;
	width: 695px;
}
.hero-welcome-heading {
	font-size: 34px;
	letter-spacing: 7px;
	padding: 16px 18px 16px 21px;
}
.hero-tagline {
	font-size: 24px;
	margin: 10px 0 50px 0;
}
.hero-scroll {
	font-size: 46px;
}
.hero-scroll-text {
	font-size: 10px;
	letter-spacing: 2px;
}
/*--------------------------------------------------
Tile Selection
----------------------------------------------------*/
.tile {
	height: 240px;
}
.tile-text {
	font-size: 19px;
	line-height: 21px;
}
	
}



/*--------------------------------------------------
Medium devices (less than 1200px)
----------------------------------------------------*/
@media (max-width: 1199px) {

.cca-menu a {
	font-size: 14px;
	line-height: 14px;
}
.cca-menu-head {
	font-size: 11px;
	padding: 4px 0 4px 0;
	margin: 9px 0 4px 0;
}
/*--------------------------------------------------
Hero Promo Block
----------------------------------------------------*/
.hero-content {
	padding: 335px 0 90px 0;
}
.hero-welcome-script {
	top: 120px;
	width: 597px;
}
.hero-welcome-heading {
	font-size: 29px;
	letter-spacing: 6px;
	padding: 16px 17px 16px 21px;
}
.hero-tagline {
	font-size: 20px;
	margin: 8px 0 40px 0;
}
.hero-scroll {
	font-size: 44px;
}
.hero-scroll-text {
	font-size: 9px;
	letter-spacing: 1px;
}
/*--------------------------------------------------
Video
----------------------------------------------------*/
.video-background {
	padding: 180px 0 180px 0;
}
/*--------------------------------------------------
Video
----------------------------------------------------*/
.video-background {
	padding: 150px 0 150px 0;
}
/*--------------------------------------------------
Tile Selection
----------------------------------------------------*/
.tile {
	height: 230px;
}
.tile-text {
	font-size: 18px;
	line-height: 20px;
}
	
}



/*--------------------------------------------------
IPAD Medium devices (less than 992px)
----------------------------------------------------*/
@media (max-width: 991px) {

/*--------------------------------------------------
Hero Promo Block
----------------------------------------------------*/
.hero-content {
	padding: 260px 0 70px 0;
}
.hero-welcome-script {
	top: 88px;
	width: 476px;
}
.hero-welcome-heading {
	font-size: 21px;
	letter-spacing: 6px;
	padding: 14px 15px 14px 19px;
}
.hero-tagline {
	font-size: 17px;
	margin: 2px 0 30px 0;
}
.hero-scroll {
	font-size: 36px;
}
.hero-scroll-text {
	font-size: 9px;
	letter-spacing: 0px;
}
/*--------------------------------------------------
Mission
----------------------------------------------------*/
.mission h3 {
	font-size: 24px;
	letter-spacing: 1px;
	margin-bottom: 4px;
}
.mission h4 {
	font-size: 18px;
}
.mission p {
	font-size: 18px;
}
.m-lead {
	font-size: 22px;
}
.mission-circle {
	width: 90px;
}
.home-events h4 {
	font-size: 18px;
}
.home-events p {
	font-size: 18px;
}
/*--------------------------------------------------
Video
----------------------------------------------------*/
.video-background {
	padding: 130px 0 130px 0;
}
.video-background p {
	font-size: 20px;
}
/*--------------------------------------------------
Tile Selection
----------------------------------------------------*/
.tile-header h3 {
	font-size: 24px;
	letter-spacing: 1px;
	margin: 50px 0 8px 0;
}
.divide {
	width: 500px;
}
.tile {
	height: 210px;
}
.tile-text {
	font-size: 17px;
	line-height: 19px;
}
	
}



/*--------------------------------------------------
Nexus 7 Small devices (less than 768px)
----------------------------------------------------*/
@media (max-width: 767px) {

.u-header-toggler--top-right, .u-header-toggler--top-right.btn {
	top: 30px;
}
.quicklink-bar {
	display: inherit;
	position: absolute;
	top: 0;
	width: 100%;
	height: 30px;
	background-color: #333;
	z-index: 399;
}
.quick-links {
	top: 5px;
	right: 11px;
	font-size: 12px;
}
.header-bar {
	top: 30px;
}
.social-tw {
	top: 53px;
}
.social-fb {
	top: 53px;
}
.cca-churchsuite {
	top: 52px;
}
.cca-logo {
	top: 47px;
}
.cca-menu {
	padding: 105px 20px 20px 20px;
}
.cca-menu a {
	font-size: 14px;
	line-height: 14px;
}
.cca-menu-head {
	font-size: 10px;
	padding: 2px 0 2px 0;
	margin: 7px 0 2px 0;
}
/*--------------------------------------------------
Hero Promo Block
----------------------------------------------------*/
.hero-content {
	padding: 245px 0 60px 0;
}
.hero-welcome-script {
	top: 115px;
	width: 363px;
}
.hero-welcome-heading {
	font-size: 15px;
	letter-spacing: 5px;
	padding: 13px 14px 13px 15px;
}
.hero-tagline {
	font-size: 13px;
	letter-spacing: 0px;
	margin: 0px 0 20px 0;
}
.hero-scroll {
	font-size: 30px;
}
/*--------------------------------------------------
Mission
----------------------------------------------------*/
.mission {
	padding: 50px 10px 0px 10px;
}
.mission h3 {
	font-size: 22px;
	letter-spacing: 1px;
	margin-bottom: 3px;
}
.mission h4 {
	font-size: 16px;
}
.mission p {
	font-size: 16px;
}
.m-lead {
	font-size: 20px;
}
.mission-circle {
	width: 80px;
}
.home-events h4 {
	font-size: 16px;
}
.home-events p {
	font-size: 16px;
}

/*--------------------------------------------------
Video
----------------------------------------------------*/
.video-section {
	display: none;
}
/*--------------------------------------------------
Tile Selection
----------------------------------------------------*/
.tile-header h3 {
	font-size: 22px;
	letter-spacing: 1px;
	margin: 50px 0 6px 0;
}
.divide {
	width: 450px;
}
.tile {
	height: 180px;
}
.tile-text {
	font-size: 17px;
	line-height: 19px;
}

}



/*--------------------------------------------------
IP 6 6+, 7+ - (less than 576px)
----------------------------------------------------*/
@media (max-width: 575px) {

/*--------------------------------------------------
Hamburger & Menu
----------------------------------------------------*/
.u-header-toggler--top-right, .u-header-toggler--top-right.btn {
	top: 30px;
	height: 51px;
	width: 60px;
}
.hamburger-box {
    width: 32px;
}
.hamburger-inner, .hamburger-inner:after, .hamburger-inner:before {
	width: 32px;
	height: 2px;
}
  .hamburger-inner::before {
    top: -8px;
}
  .hamburger-inner::after {
    bottom: -8px;
}
.cca-menu {
	padding: 81px 20px 20px 20px;
}
/*--------------------------------------------------
Header
----------------------------------------------------*/
.header-bar {
	top: 30px;
	height: 51px;
}
.social-tw {
	top: 41px;
	right: 90px;
}
.social-fb {
	top: 41px;
	right: 65px;
}
.cca-churchsuite {
	top: 40px;
	right: 120px;
}
.cca-logo {
	top: 39px;
	left: 8px;
	width: 170px;
}
/*--------------------------------------------------
Hero Promo Block
----------------------------------------------------*/
.hero-content {
	padding: 208px 0 70px 0;
}
.hero-welcome-script {
	top: 95px;
	width: 320px;
}
.hero-welcome-heading {
	width: 320px;
	font-size: 15px;
	letter-spacing: 3px;
	padding: 13px;
}
.hero-tagline {
	font-size: 14px;
	letter-spacing: 0px;
	margin: 3px 0 0 0;
}
.hero-scroll {
	display: none;
}
.hero-scroll-text {
	display: none;
}
/*--------------------------------------------------
Mission
----------------------------------------------------*/
.mission {
	padding: 50px 10px 0px 10px;
}
.mission h3 {
	font-size: 20px;
	letter-spacing: 0px;
	margin-bottom: 2px;
}
.mission h4 {
	font-size: 14px;
}
.mission p {
	font-size: 14px;
}
.m-lead {
	font-size: 18px;
}
.mission-circle {
	width: 70px;
}
.home-events h4 {
	font-size: 14px;
}
.home-events p {
	font-size: 14px;
}

/*--------------------------------------------------
Tile Selection
----------------------------------------------------*/
.tile-header h3 {
	font-size: 20px;
	letter-spacing: 0px;
	margin: 50px 0 4px 0;
}
.divide {
	width: 300px;
}
.tile {
	height: 130px;
	margin-bottom: 15px;
}
.tile-text {
	font-size: 16px;
	line-height: 17px;
}
/*--------------------------------------------------
Footer Contact
----------------------------------------------------*/
.footer-contact {
	margin-top: 40px;
}
.contact-block {
	padding: 30px 0 43px 0;
}
.footer-legals p {
	font-size: 12px !important;
}

}



/*--------------------------------------------------
IP 3, 4, 5 - Extra small devices (less than 320px)
----------------------------------------------------*/
@media (max-width: 320px) {

/*--------------------------------------------------
Hero Promo Block
----------------------------------------------------*/
.hero-content {
	padding: 185px 0 60px 0;
}
.hero-welcome-script {
	top: 90px;
	width: 270px;
}
.hero-welcome-heading {
	width: 270px;
	font-size: 13px;
	letter-spacing: 2px;
	padding: 13px;
}
.hero-tagline {
	font-size: 12px;
	letter-spacing: 0px;
	margin: 3px 0 0 0;
}
.hero-scroll {
	display: none;
}
.hero-scroll-text {
	display: none;
}
.social-tw {
	display: none;
}
.social-fb {
	display: none;
}
.cca-churchsuite {
	top: 40px;
	right: 65px;
}

/*--------------------------------------------------
Tile Selection
----------------------------------------------------*/
.tile-header h3 {
	font-size: 18px;
	margin: 50px 0 2px 0;
}
.divide {
	width: 200px;
}
.tile {
	height: 120px;
}
.tile-text {
	font-size: 16px;
	line-height: 17px;
}
/*--------------------------------------------------
Footer Contact
----------------------------------------------------*/
.footer-contact {
	margin-top: 40px;
}
.footer-legals p {
	font-size: 11px !important;
}
	
}