/* DEFAULT CSS ------------------------------------------------------------------------------------------------------------------------------------------------------------*/
* { margin: 0; padding: 0; line-height: 190%;}
.screen-reader-text { position: absolute; left: -9999px; top: -9999px; }
.group:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
* html .group, *:first-child+html .group { zoom: 1; } /* First selector = IE6, Second Selector = IE 7 */
img a, a img, img {border-style: none; border: 0;} /* IE BORDERS */
b, strong { font-weight: bold;}
p {margin: 0; clear: left;  }
b, strong { font-weight: bold;}
a:link { text-decoration: none; }
a:visited { text-decoration: none;}
a:hover, a:active { text-decoration: none; }
a:hover { }
a:focus {outline: none;}
img {border-style: none;max-width: 100%;height: auto;}
.image-right img, .image-left img {width: auto;}
ul {margin: 15px 0 15px 0;}
ul li {margin: 5px 5px 5px 25px; /*list-style-type: circle;*/}
a img {border: none;}
h1,h2,h3,h4,h5 {margin: 0 0 8px 0;}
h1 {font-size: 24px;margin: 0 0 13px;}
h2 {font-size: 22px;}
h3 {font-size: 20px;}
h4 {font-size: 18px;}
h5 {font-size: 16px;}
* { margin: 0; padding: 0;}
.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; }
label {display: block;}
.mobile {display: none;}
.float-left {
	float: left !important;
}
.float-right {
	float: right !important;
}
hr {
    border: 0;
    height: 0;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}
body, html {
	font-family: Helvetica, Verdana, "Bitstream Vera Sans", "Vera Sans", Tahoma, Geneva, sans-serif;
	margin: 0;
	padding: 0;
	text-align: left;
	/*font-family:  'HelveticaNeue-Light', 'Helvetica Neue Light', 'Helvetica Neue', sans-serif; */
}
.charis-background{
	/*min-height: 100%;*/
	position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-repeat:no-repeat;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    /*filter: blur(10px); 
  	-webkit-filter: blur(10px); 
  	-moz-filter: blur(10px);
  	-o-filter: blur(10px);
  	-ms-filter: blur(10px);
  	filter: url(#blur);
  	filter:progid:DXImageTransform.Microsoft.Blur(PixelRadius='10');*/
  	z-index: -1;
}
/*------------------------ Globals ---------------------*/
#charis-overflow {
	position: relative;
	/*overflow: hidden;*/  
	display: block;
	width: 90%;
	max-width: 1024px;
	margin: 100px auto 50px auto;
}
.charis-shadow {
	/*-webkit-border-top-left-radius: 3px;
  	-webkit-border-top-right-radius: 3px;
  	-moz-border-radius-topleft: 3px;
  	-moz-border-radius-topright: 3px;
  	border-top-left-radius: 3px;
  	border-top-right-radius: 3px;*/
  	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px; /* future proofing */
	-khtml-border-radius: 3px; /* for old Konqueror browsers */
}
.charis-padding {
	padding: 0 0;
}
.charis-padding:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}
 
.charis-padding {
    display: inline-block;
}
 
html[xmlns] .charis-padding {
    display: block;
}
 
* html .charis-padding {
    height: 1%;
}

p {margin: 0 0 0 0;}
.column-wrap > div > div.column-content {
	margin: 0 0 0 20px;
}
.column-wrap > div:first-child  > div.column-content{
	margin: 0 0 0 0;
}
@media all 
and (max-width : 767px) {
	.column-wrap > div > div.column-content {
		margin: 20px 0 0 0;
	}
	.column-wrap > div:first-child  > div.column-content{
		margin: 0 0 0 0;
	}
}
/*------------------------ Wrapper ---------------------*/
#charis-outer-wrapper {
  position: relative;
  height: 100%;
  width: 100%; 
  transition: transform 0.25s;
  -webkit-backface-visibility: hidden;
  -webkit-transition: padding ease-out .5s;
    -moz-transition: padding ease-out .5s;
    -o-transition: padding ease-out .5s;
    transition: padding ease-out .5s;
}
#charis-outer-wrapper {
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
	-webkit-transition: all 300ms ease-in-out;
	   -moz-transition: all 300ms ease-in-out;
	    -ms-transition: all 300ms ease-in-out;
	     -o-transition: all 300ms ease-in-out;
	        transition: all 300ms ease-in-out;
	-webkit-backface-visibility: hidden;
}
#charis-outer-wrapper.inactive { /*IE8 FIX NEEDED for translate*/
	cursor: pointer;
	-webkit-transform: translate3d(200px, -8.5%, 0px) scale(0.75);
	   -moz-transform: translate3d(200px, -8.5%, 0px) scale(0.75);
	    -ms-transform: translate3d(200px, -8.5%, 0px) scale(0.75);
	        transform: translate3d(200px, -8.5%, 0px) scale(0.75);
	filter: blur(2px); 
  	-webkit-filter: blur(2px); 
  	-moz-filter: blur(2px);
  	-o-filter: blur(2px);
  	-ms-filter: blur(2px);
  	filter: url(#blur);
  	position: absolute\9;
  	margin-left: 500px\9;
}

/*------------------------ Header ---------------------*/
.charis-header {
	z-index: 10;
	margin: 0;
	text-align: center;
	-webkit-border-top-left-radius: 3px;
  	-webkit-border-top-right-radius: 3px;
  	-moz-border-radius-topleft: 3px;
  	-moz-border-radius-topright: 3px;
  	border-top-left-radius: 3px;
  	border-top-right-radius: 3px;
}
.charis-header .charis-padding {
	padding-top: 40px;
	padding-bottom: 40px;
}
.charis-header h1 {
	font-size: 32px;
	line-height: 42px;
	padding: 10px 0 0 0;
}
.charis-header h2 {
	font-size: 24px;
	line-height: 32px;
	padding: 0 0 10px 0;
	font-weight: normal;
	font-style: italic;
}
/*------------------------ Slider/Image ---------------------*/
.sliderContent {
	display: none;
}
.charis-slider img {
	display: block;
}
.bg-img {
	background-image: url("images/failed-to-load.png");
}
/*------------------------ Main Content ---------------------*/
.header-bc .charis-padding {
	padding: 0;
}
.header-bc h2 { 
	display: none;	
}
.charis-main-content {
	z-index: 10;
}
ul.charis-breadcrumbs {
  display: none;
  margin: 0 0 20px 0;
  list-style: none;
}
ul.charis-breadcrumbs li {
  float: left;
  margin: 0;
  padding: 0;
  list-style: none;
}
ul.charis-breadcrumbs li a {
  display: inline !important;
  overflow: hidden;
  text-decoration: none;
  display: block;
  margin: 0;
  padding: 0;
}
ul.charis-breadcrumbs li a:hover {
  
}
ul.charis-breadcrumbs li:last-child a {
  padding: 0;
}
#charis-content.sidebar-on {
	width: 66%;
	float: left;
}
.charis-sidebar {
	width: 30%;
	padding-left: 3%;
	border-left: 1px solid rgba(0, 0, 0, 0.1);
	float: right;
	line-height: 150%;
}
.charis-sidebar h3 {
	
}
/*------------------------ Extra Content ---------------------*/
#charis-myExtraContent1 {
	z-index: 10;
    border-top: 1px solid rgba(0, 0, 0, 0.0);
    border-bottom: 1px solid rgba(255, 255, 255, 0.0);
}
#charis-myExtraContent2 {
	z-index: 10;
	border-top: 1px solid rgba(0, 0, 0, 0.1);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
#charis-myExtraContent3 {
	z-index: 10;
	border-top: 1px solid rgba(0, 0, 0, 0.1);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
#charis-myExtraContent4 {
	z-index: 10;
	border-top: 1px solid rgba(0, 0, 0, 0.1);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
#charis-myExtraContent5 {
	z-index: 10;
	border-top: 1px solid rgba(0, 0, 0, 0.1);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}


/*------------------------ Footer ---------------------*/
.charis-footer {
	width: 100%;
	z-index: 10;
	display: inline-block;
	-webkit-border-bottom-left-radius: 3px;
  	-webkit-border-bottom-right-radius: 3px;
  	-moz-border-radius-bottomleft: 3px;
  	-moz-border-radius-bottomright: 3px;
  	border-bottom-left-radius: 3px;
  	border-bottom-right-radius: 3px;
}
.charis-footer .charis-padding {
	padding-top: 20px;
	padding-bottom: 20px;
}
.charis-footer ul.charis-breadcrumbs { 
  display: none;
  float: right;
  margin: 0;
}
/*------------------------ Elements ---------------------*/
.charis-circle {
	border-radius: 50%;
	width: 120px;
	height: 120px;
	margin: 0 auto;
	background: grey;
	background: rgba(0,0,0,0.2);
	color: white;
	font-size: 70px;
	line-height: 120px;
	text-align: center;
}
.charis-circle.blue     {background-color: #7fb1bf;}
.charis-circle.green   {background-color: #9abf7f;}
.charis-circle.red       {background-color: #fa5a5a;}
.charis-circle.purple {background-color: #cb99c5;}
.charis-circle.cyan     {background-color: #7fccde;}
.charis-circle.yellow {background-color: #f0d264;}
/*------------------------------------------------------------------------------------------------ Columns ---------------------------------------------------------------------------------------------)*/
/*csslint regex-selectors:false, known-properties:false, duplicate-properties:false*/

.column-wrap-non-responsive {
    letter-spacing: -0.31em; /* Webkit: collapse white-space between units */
    *letter-spacing: normal; /* reset IE < 8 */
    *word-spacing: -0.43em; /* IE < 8: collapse white-space between units */
    text-rendering: optimizespeed; /* Webkit: fixes text-rendering: optimizeLegibility */

    /*
    Sets the font stack to fonts known to work properly with the above letter
    and word spacings. See: https://github.com/yui/pure/issues/41/

    The following font stack makes Pure Grids work on all known environments.

    * FreeSans: Ships with many Linux distros, including Ubuntu

    * Arimo: Ships with Chrome OS. Arimo has to be defined before Helvetica and
      Arial to get picked up by the browser, even though neither is available
      in Chrome OS.

    * Droid Sans: Ships with all versions of Android.

    * Helvetica, Arial, sans-serif: Common font stack on OS X and Windows.
    */
    font-family: FreeSans, Arimo, "Droid Sans", Helvetica, Arial, sans-serif;

    /*
    Use flexbox when possible to avoid `letter-spacing` side-effects.

    NOTE: Firefox (as of 25) does not currently support flex-wrap, so the
    `-moz-` prefix version is omitted.
    */

    display: -webkit-flex;
    -webkit-flex-flow: row wrap;

    /* IE10 uses display: flexbox */
    display: -ms-flexbox;
    -ms-flex-flow: row wrap;
}

/* Opera as of 12 on Windows needs word-spacing.
   The ".opera-only" selector is used to prevent actual prefocus styling
   and is not required in markup.
*/
.opera-only :-o-prefocus,
.column-wrap-non-responsive {
    word-spacing: -0.43em;
}

.column {
    display: inline-block;
    *display: inline; /* IE < 8: fake inline-block */
    zoom: 1;
    letter-spacing: normal;
    word-spacing: normal;
    vertical-align: top;
    text-rendering: auto;
}

/*
Resets the font family back to the OS/browser's default sans-serif font,
this the same font stack that Normalize.css sets for the `body`.
*/
.column-wrap-non-responsive [class *= "column"] {
    font-family: sans-serif;
}
/*csslint regex-selectors:false, known-properties:false, duplicate-properties:false*/

.column-wrap {
    letter-spacing: -0.31em;
    *letter-spacing: normal;
    *word-spacing: -0.43em;

    /*
    Sets the font stack to fonts known to work properly with the above letter
    and word spacings. See: https://github.com/yui/pure/issues/41/

    The following font stack makes Pure Grids work on all known environments.

    * FreeSans: Ships with many Linux distros, including Ubuntu

    * Arimo: Ships with Chrome OS. Arimo has to be defined before Helvetica and
      Arial to get picked up by the browser, even though neither is available
      in Chrome OS.

    * Droid Sans: Ships with all versions of Android.

    * Helvetica, Arial, sans-serif: Common font stack on OS X and Windows.
    */
    font-family: FreeSans, Arimo, "Droid Sans", Helvetica, Arial, sans-serif;

    /*
    Use flexbox when possible to avoid `letter-spacing` side-effects.

    NOTE: Firefox (as of 25) does not currently support flex-wrap, so the
    `-moz-` prefix version is omitted.
    */

    display: -webkit-flex;
    -webkit-flex-flow: row wrap;

    /* IE10 uses display: flexbox */
    display: -ms-flexbox;
    -ms-flex-flow: row wrap;
}

/* Opera as of 12 on Windows needs word-spacing.
   The ".opera-only" selector is used to prevent actual prefocus styling
   and is not required in markup.
*/
.opera-only :-o-prefocus,
.column-wrap {
    word-spacing: -0.43em;
}

/*
Resets the font family back to the OS/browser's default sans-serif font,
this the same font stack that Normalize.css sets for the `body`.
*/
.column-wrap [class *= "column"] {
    font-family: sans-serif;
}

.column-wrap img {
    max-width: 100%;
    height: auto;
}

@media (min-width: 980px) {
    .charis-visible-phone {
        display: none;
    }
    .charis-visible-tablet {
        display: none;
    }
    .charis-hidden-desktop {
        display: none;
    }
}

@media (max-width: 480px) {
    .column-wrap > .column,
    .column-wrap > [class *= "column-"] {
        width: 100%;
    }
}

@media (max-width: 767px) {
    .column-wrap > .column,
    .column-wrap > [class *= "column-"] {
        width: 100%;
    }
    .charis-hidden-phone {
        display: none;
    }
    .charis-visible-desktop {
        display: none;
    }
}

@media (min-width: 768px) and (max-width: 979px) {
    .charis-hidden-tablet {
        display: none;
    }
    .charis-visible-desktop {
        display: none;
    }
}
.column-1,
.column-1-2,
.column-1-3,
.column-2-3,
.column-1-4,
.column-3-4,
.column-1-5,
.column-2-5,
.column-3-5,
.column-4-5,
.column-1-6,
.column-5-6,
.column-1-8,
.column-3-8,
.column-5-8,
.column-7-8,
.column-1-12,
.column-5-12,
.column-7-12,
.column-11-12,
.column-1-24,
.column-5-24,
.column-7-24,
.column-11-24,
.column-13-24,
.column-17-24,
.column-19-24,
.column-23-24 {
    display: inline-block;
    *display: inline; /* IE < 8: fake inline-block */
    zoom: 1;
    letter-spacing: normal;
    word-spacing: normal;
    vertical-align: top;
    text-rendering: auto;
}

.column-1 {
    width: 100%;
}

.column-1-2 {
    width: 50%;
    *width: 49.969%;
}

.column-1-3 {
    width: 33.3333%;
    *width: 33.3023%;
}

.column-2-3 {
    width: 66.6667%;
    *width: 66.6357%;
}

.column-1-4 {
    width: 25%;
    *width: 24.969%;
}

.column-3-4 {
    width: 75%;
    *width: 74.969%;
}

.column-1-5 {
    width: 20%;
    *width: 19.969%;
}

.column-2-5 {
    width: 40%;
    *width: 39.969%;
}

.column-3-5 {
    width: 60%;
    *width: 59.969%;
}

.column-4-5 {
    width: 80%;
    *width: 79.969%;
}

.column-1-6 {
    width: 16.6667%;
    *width: 16.6357%;
}

.column-5-6 {
    width: 83.3333%;
    *width: 83.3023%;
}

.column-1-8 {
    width: 12.5%;
    *width: 12.469%;
}

.column-3-8 {
    width: 37.5%;
    *width: 37.469%;
}

.column-5-8 {
    width: 62.5%;
    *width: 62.469%;
}

.column-7-8 {
    width: 87.5%;
    *width: 87.469%;
}

.column-1-12 {
    width: 8.3333%;
    *width: 8.3023%;
}

.column-5-12 {
    width: 41.6667%;
    *width: 41.6357%;
}

.column-7-12 {
    width: 58.3333%;
    *width: 58.3023%;
}

.column-11-12 {
    width: 91.6667%;
    *width: 91.6357%;
}

.column-1-24 {
    width: 4.1667%;
    *width: 4.1357%;
}

.column-5-24 {
    width: 20.8333%;
    *width: 20.8023%;
}

.column-7-24 {
    width: 29.1667%;
    *width: 29.1357%;
}

.column-11-24 {
    width: 45.8333%;
    *width: 45.8023%;
}

.column-13-24 {
    width: 54.1667%;
    *width: 54.1357%;
}

.column-17-24 {
    width: 70.8333%;
    *width: 70.8023%;
}

.column-19-24 {
    width: 79.1667%;
    *width: 79.1357%;
}

.column-23-24 {
    width: 95.8333%;
    *width: 95.8023%;
}
/*------------------------------------------------------------------- Navigation ------------------------------------------------------------)*/


ul.slimmenu {
}
ul.slimmenu li {
    position: relative;
}
ul.slimmenu li a {
    display: inline;
}
ul.slimmenu li a:hover {
    text-decoration: none;
}
ul.slimmenu li .sub-collapser {
    position: absolute;
    right: 0;
    top: 10px;
    width: 28px;
    height: 28px;
    text-align: center;
    z-index: 999;
    cursor: pointer;
    border: 1px solid white;
    -moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px; /* future proofing */
	-khtml-border-radius: 3px; /* for old Konqueror browsers */
}
ul.slimmenu li ul li .sub-collapser {
	top: -4px;	
}
ul.slimmenu li .sub-collapser:before {
    content: '';
    display: inline-block;
    height: 100%;
    vertical-align: middle;
    margin-right: -0.25em;
}
ul.slimmenu li .sub-collapser > i {
    font-size: 18px;
    display: inline-block;
    vertical-align: middle;
    position: absolute;
	left: 5px;
	top: 5px;
    -webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-ms-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=0);
	-webkit-transition: all 300ms ease-in-out;
	   -moz-transition: all 300ms ease-in-out;
	    -ms-transition: all 300ms ease-in-out;
	     -o-transition: all 300ms ease-in-out;
	        transition: all 300ms ease-in-out;
	line-height: normal;
}
ul.slimmenu li .sub-collapser.expanded > i {
	filter:  progid:DXImageTransform.Microsoft.BasicImage(rotation=2);  /* IE6,IE7 */
	ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=2)"; /* IE8 */
	-moz-transform: rotate(-180deg);  /* FF3.5+ */
	-o-transform: rotate(-180deg);  /* Opera 10.5 */
	-webkit-transform: rotate(-180deg);  /* Safari 3.1+, Chrome */
	-ms-transform: rrotate(-180deg);
	-webkit-transition: all 300ms ease-in-out;
	   -moz-transition: all 300ms ease-in-out;
	    -ms-transition: all 300ms ease-in-out;
	     -o-transition: all 300ms ease-in-out;
	        transition: all 300ms ease-in-out;
}
ul.slimmenu li ul {
    margin: 0;
    list-style-type: none;
    list-style: none;
}
ul.slimmenu li ul li {
	margin: 28px 0 0 10px;
	padding: 0 0 0 0;
}
ul.slimmenu li > ul {
    display: none;
    position: relative;
    left: 0;
    z-index: 999;
}
ul.slimmenu li > ul > li ul {
    display: none;
    /*position: absolute;*/
    top: 0;
    z-index: 999;
}

ul.slimmenu.collapsed li {
    display: block;

    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box
}
ul.slimmenu.collapsed li a {
    display: inline;

    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box
}
ul.slimmenu.collapsed li .sub-collapser {
    height: 40px;
}
ul.slimmenu.collapsed li > ul {
    display: none;
    position: static;
}
.charis-nav {
  	position: absolute;
  	z-index: -1;
  	top: 0;
  	left: 0;
  	min-width: 220px;
  	-webkit-border-top-left-radius: 3px;
  	-webkit-border-bottom-left-radius: 3px;
  	-moz-border-radius-topleft: 3px;
  	-moz-border-radius-bottomleft: 3px;
  	border-top-left-radius: 3px;
  	border-bottom-left-radius: 3px;
}
.charis-nav ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
.charis-nav a {
  display: block;
  font-size: 1.5em;
  margin: 20px 0;
  text-decoration: none;
  line-height: .8em;
}
.charis-nav li {
	font-family: 'HelveticaNeue-UltraLight', 'HelveticaNeue-Light', 'Helvetica Neue Light', 'Helvetica Neue', sans-serif; 
	font-size: 19px;
	line-height: 19px;
	padding: 14px 50px 14px 0;
	font-weight: 200;
	list-style: none;
}
.charis-nav > ul > li {
	-webkit-transition: all 400ms ease-in-out, opacity 1500ms ease;
	   -moz-transition: all 400ms ease-in-out, opacity 1500ms ease;
	    -ms-transition: all 400ms ease-in-out, opacity 1500ms ease;
	     -o-transition: all 400ms ease-in-out, opacity 1500ms ease;
	        transition: all 400ms ease-in-out, opacity 1500ms ease;
	-webkit-transform: translate3d(150px, 0px, 0px) scale(0.2);
	-moz-transform: translate3d(150px, 0px, 0px) scale(0.2);
	    -ms-transform: translate3d(150px, 0px, 0px) scale(0.2);
	        transform: translate3d(150px, 0px, 0px) scale(0.2);
	opacity: 0;
}
.charis-nav > ul > li.visible {
	-webkit-transform: translate3d(0px, 0px, 0px) scale(1);
	-moz-transform: translate3d(0px, 0px, 0px) scale(1);
	    -ms-transform: translate3d(0px, 0px, 0px) scale(1);
	        transform: translate3d(0px, 0px, 0px) scale(1);
	opacity: 1;
}
.charis-nav.visible {
	z-index: 1;
}
#nav-toggle {
	/*background: rgba(0,0,0,.1);*/
  	position: absolute;
  	top: 0;
  	left: 0;
  	padding: 0 15px;
  	height: 50px;
  	font-size: 24px;
  	line-height: 50px;
  	text-align: center;
  	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px; /* future proofing */
	-khtml-border-radius: 3px; /* for old Konqueror browsers */
}
a#nav-toggle {
	
}
#nav-toggle:after {
  content: '☰';
}
/*------------------------ Mobile -----------------------*/
@media all 
and (max-width : 768px) {
	#charis-overflow {
		width: 100%;
		margin: 0;
	}
	.charis-nav li {
		padding-left: 25px;	
	}
}
@media screen and (max-width: 500px) {
	#charis-content.sidebar-on {
		width: 100% !important;
	}
	.charis-sidebar {
		width: 100% !important;
		border-left: 0px solid rgba(0, 0, 0, 0.1);
		margin: 0 !important;
		padding: 0 !important;
	}
	.stacks_top {
		width: 100%;	
	}
	.header-bc ul.charis-breadcrumbs li a {
		padding: 0;
	}
}