
/*homwpage hero full resolution*/
.hero_1 {
	background-image: url("/homepage/_imgs/hero_kids.jpg");
}
.hero_2 {
	background-image: url("/homepage/_imgs/hero_kids.jpg");
}
.hero_3 {
	background-image: url("/homepage/_imgs/hero_kids.jpg");
}

/*homepage hero mobile format*/
@media screen and (max-width: 1010px) {
.hero_1 {
	background-image: url("/homepage/_imgs/hero_kids_m.jpg");
}
.hero_2 {
	background-image: url("/homepage/_imgs/hero_kids_m.jpg");
}
.hero_3 {
	background-image: url("/homepage/_imgs/hero_kids_m.jpg");
}
}
/*end of homepage hero images*/








/*left drawer--------------------------------------*/

.left_drawer{
    position: absolute;
    display: block;
    z-index: 1;
    top: 85px;
    padding: 0 50px 0 0;
    left: -851px;
    width: 850px;
    box-sizing: border-box;
    transition: all .35s ease-in-out;
    /*height: 100vh;
    height: calc(var(--vh, 1vh) * 100);*/
}
.pop_body{
    background: #efefef;
    padding: 45px 15px 15px 285px;
    box-sizing: border-box;
    overflow-y: auto;
    width: 850px;
    overflow-x: hidden;
	/*background: url(/sitehome/banners/p-rotated-650.png) no-repeat 0 -84px, linear-gradient(135deg, rgb(5,77,132) 72%, rgba(0,57,115,1));*/
	/*background: linear-gradient(135deg, rgb(5,77,132) 72%, rgba(0,57,115,1));*/
	background: #0054a6;
}
.pop_body ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
.show_drawer{
	left:-250px; /*council or special left:0*/
	position:fixed;
	z-index:2003;
}
.show_drawer .pop_body{
	/*-webkit-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.75);
	-moz-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.75);
	box-shadow: -0px 1px 2px 0px rgba(0, 0, 0, 0.75);*/
}
a.close_button{
    background: url(/_imgs/icon-mmenu-close-over-white.png) no-repeat right 5px center;
	background-color: rgba(0,0,0,0.17);
    color: #FFF !important;
    right: 14px;
    top: 10px;
    padding: 3px 30px 5px 8px;
    background-size: 20px 20px;
    position: absolute;
    display: inline-block;
    border: 1px solid rgba(255, 255, 255, 0.4);
	text-decoration: none;
}
a.close_button:hover,  a.close_button:focus{
    background-color: rgba(0,0,0,1);
	text-decoration: none;
	border-color: #FFF;
}
.pop_title {
    /*transform: rotate(-90deg);
    transform-origin: bottom right;
    width: 272px;*/
    position: absolute;
    right: -150px;
    top: calc(100vh - 287px);
    background: #0054a6;
    color: #fff !important;
    padding: 7px 10px;
    text-decoration: none;
    font-weight: 600;
    z-index: -1;
    box-sizing: border-box;
    text-align: right;
	transition: all .135s ease-in-out;
	/*-webkit-box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.75);
    -moz-box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.75);
    box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.52);*/
}
.pop_title:after {
    font-family: FontAwesome;
    content: "\f054";
    margin:0 0 0 8px;
    display: inline-block;
    position: relative;
    top: 0;
    font-size: 14px;
}
.pop_title .fa{
	font-size: 30px;
}
.pop_title h2{
	margin: 0;
	color: #FFF;
	font-size: 1.35em;
}
a.pop_title:link, a.pop_title:visited {
	color: #FFF;
	text-decoration: none;
}
a.pop_title:hover, a.pop_title:focus{
	color: #0054a6 !important;
	text-decoration: none!important;
	/*background: #b63806;*/
	background: #F1F1F1;
}
.show_drawer .pop_title{
	/*display:none !important;*/
	right: 10px;
}
.pop_title i{
    font-size: 20px;
}
.top.over.mini + .left_drawer .pop_title{
	display:block;
}
.show_drawer .pop_title{
	display: none !important;
}
.pop_body h2{
	margin: 0px 0 17px;
    color: #FFF;
}
.pop_body li a:link, .pop_body  li a:visited {
    visibility: hidden;
	display: block;
    border: none;
    border-top: 1px solid rgba(255, 255, 255, 0.13);
    margin: 0;
    padding: 6px 6px 6px 0;
    color: #FFF;
    text-decoration: none;
}
.pop_body a:link{
	visibility: hidden;
}
.show_drawer .pop_body li a:link, .show_drawer .pop_body  li a:visited, .show_drawer .pop_body a:link {
	visibility: visible;
}
.pop_body li:first-of-type a{
    border-top: 0;
}
.pop_body li:last-of-type a{
    border-bottom: 1px solid rgba(255, 255, 255, 0.13);
	margin-bottom: 20px;
}
#newsearch.drawer{
	width:60%;
}
#newsearch.drawer input[type="text"]{
	border: 1px solid rgb(255, 255, 255);
}
#newsearch.drawer button {
    border-radius: 0;
    border: 1px solid rgba(255, 255, 255, 0.83);
	border-left: none;
}
p.morelink{
	margin: 0;
}
.pop_body .morelink a:link, .pop_body .morelink a:visited{
	text-decoration: none;
    display: inline-block;
	padding: 6px 18px 6px 0;
    border: none;
	color: #FFF;
}
.pop_body li a:focus, 
.pop_body li a:hover,
.pop_body li a:visited:hover,
.pop_body .morelink a:focus, 
.pop_body .morelink a:hover,
.pop_body .morelink a:visited:hover {
	text-decoration: underline!important;
}
.pop_body li a, .morelink a{
	position: relative;
}
/*.pop_body li a:after,*/ .morelink a:after{
	font-family: FontAwesome;
	padding: 0;
	display: inline-block;
	position:absolute;
	font-size:12px;
	right:0px;
	margin-left: 5px;
	content: "\f054";
	top: 12px;
	color: #3c80be;
}
.pop_body li a:hover:after, .morelink a:hover:after{
	color:#FFF;
}
/*start animation*/
/* Safari 4.0 - 8.0 */
@-webkit-keyframes left_drawer {
 0%   {right:100%; top:85px;}
 15%  {right:50%; top:85px;}
 30% {right:0; top:85px}
 95% {right:0; top:85px}
 100% {right:0; top:85px}
}

/* Standard syntax */
@keyframes left_drawer {
 0%   {right:100%; top:85px;}
 15%  {right:50%; top:85px;}
 30% {right:0; top:85px}
 95% {right:0; top:85px}
 100% {right:0; top:85px}
}
/*end animation*/
@media screen and (max-width:1480px) {
	.left_drawer {
		position:absolute;
	}
}
	
@media screen and (max-width:875px) {
.pop_title {
    	top: 391px;
}
#newsearch.drawer{
	display: none;
}
}
	
@media screen and (max-width:800px) {
	.left_drawer {
		width: 360px;
		left: -360px;
	}
	.pop_body {
		width: 360px;
		padding:60px 10px 10px;
	}
	.show_drawer.left_drawer {
		left: 0;
	}
	a.close_button {
		right: 10px;
		top: 17px;
	}
}

	
@media screen and (max-width:680px) {
	.left_drawer {
		width: 96%;
		left: -96%;
		padding: 0;
		top: 0px;
	}
	.pop_body {
		width: 100%;
	}
	.pop_title {
    	top: 291px;
}
}
/*end of left drawer*/



.intro_panel div.img-caption{
	width: calc(49% - 20.5px);
	max-width: 100%;
	padding: 0 20px 0 0;
}
.intro_panel div.img-caption:nth-of-type(2){
	padding: 0 105px 0 20px;
	border-left: 1px solid #e4e4e4;
	position: relative;
}
.c2p_button{
	position: absolute;
	top: 0;
	right: 0;
}
div.image-group.news div.img-caption {
	margin: 0;
	padding: 10px 20px 0;
	width: calc((100% - 120px) / 4);
	box-sizing: content-box;
}

.img-caption.pinned{
	padding-top: 0;
}
.img-caption.pinned a:first-of-type h3{
	margin-top: 0;
}
.img-caption.pinned a{
	text-decoration: none !important;
}
.img-caption.pinned a{
	display: block;
}
div.image-group.news div.img-caption img {
	border: none;
}
div.image-group.box_content div.img-caption {
	font-size: 115%;
	margin-top: 0;
	padding-top: 5px;
	max-width: 100%;
}

.panels.bordered .responsive {
	border-top: 1px solid;
	border-bottom: 1px solid;
	border-color: #e4e4e4;
}
.panels.bordered {
	padding: 20px 0;
}
.peoplepanel {
	padding: 0;
}
.peoplepanel > div {
	width: 50%;
	box-sizing: border-box;
	float: left;
	position: relative;
}
.peoplepanel div.limage {
	height: 370px;
}
div.limage.hero_overlay{
	height: 72px;
}
.peoplepanel div.img_panel:first-of-type {
	background-position: center;
	background-size: cover;
	background-image: url(/_imgs/homepage/panel-carmala.jpg);
	transition: all .15s;
	/*width: calc((100%/8) * 5);*/
	width: 60%;
}
.peoplepanel.c2p div.img_panel:first-of-type {
	background: none;
	width: 540px;
    max-width: 40%;
}
.peoplepanel.c2p div.img_panel:nth-of-type(2){
	background-position: center;
	background-size: cover;
	background-image: url(/_imgs/homepage/panel-carmala.jpg);
	transition: all .15s;
	max-width: 60%;
	width: 100%;
}
.peoplepanel div.img_panel:nth-of-type(2){
    width: 540px;
    max-width: 40%;
    padding: 20px;
    box-sizing: border-box;
}
.top-tasks ul {
	margin: 0;
	padding: 0;
	list-style: none;
}
.top-tasks ul li {
	display: inline-block;
	float: left;
}
.top-tasks {
	min-height: 100px;
	overflow: hidden;
	border-radius: 1px;
}
.task_boxes {
	min-height: 130px !important;
	padding: 0 !important;
	box-sizing: border-box;
	background: none !important;
	top: -20px;
}
.top-tasks ul li {
	width: calc((100% - 30.1px) / 6);
	margin: 0 2.5px 5px;
}
.top-tasks.responsive {
	background: #FFF;
	padding: 5px 2.5px 0;
}
.top-tasks ul li a {
	width: 100%;
	padding: 5px;
	box-sizing: border-box;
	height: 115px;
	float: left;
	transition: all ease .1s;
	text-align: center;
	color: #00468a;
	text-decoration: none;
	font-weight: 600;
	font-size: .9em;
	background: #e5e5e5;
}
.top-tasks ul li a:hover, .top-tasks ul li a:focus {
	background: #F1F1F1;
	border-bottom: 2px solid #00468a;
}
.top-tasks ul li .fa {
	font-size: 28px;
}
.top-tasks ul li img {
	width: 37.5px;
	margin: 8px 0 0;
}
.top-tasks ul li .fa, .top-tasks ul li img {
	display: block;
	text-align: center;
	margin: 4px auto 7px;
}
.arrow_blue {
    position: absolute;
    width: 30px;
    height: 30px;
    background: #054d84;
    transform: rotate(45deg);
    left: initial;
	margin-left: initial;
	right:-15px;
	top: 50%;
    margin-top: -15px;
}
a.button_big_blue {
    transition: all ease .1s;
    text-align: center;
    text-decoration: none !important;
	display: inline-block;
    font-size: 1em;
	font-weight: 600;
    padding: 12px 15px 15px;
    border: 1px solid rgba(255, 255, 255, 0.95);
    margin: 17px 0 0;
	box-sizing: border-box;
}
a.button_big_blue:hover, a.button_big_blue:focus {
	background: rgba(0, 0, 0, 0.41);
	border-color:transparent;
}
a.button_big_blue.light {
    border: 1px solid #036;
	background: #036;
	color:#FFF !important;
}
a.button_big_blue.light:hover, a.button_big_blue.light:focus {
	background: #FFF;
	color:#036 !important;
}
.blocklink h3{
	color: #000 !important;
}
/*only show first 7*/
.limit_3 .blocklink:nth-child(n+8){
	display:none;
}

/*different style from the 4th onward */
.limit_3 .blocklink:nth-child(n+4) .img-caption{ 
	padding: 0 !important;
	float: right;
	clear: right;
	box-sizing: border-box;
}
.limit_3 .blocklink:nth-child(n+4) .img-caption p:last-of-type{ 
	border-bottom: 1px solid;
	border-bottom-color: #CCC;
}
.limit_3 .blocklink:nth-child(n+4):hover p:last-of-type, .limit_3 .blocklink:nth-child(n+4):focus p:last-of-type{
	border-bottom-color: #036 !important;
	border-bottom: 2px solid;
}
.limit_3 .blocklink:nth-child(n+4) img{
	display:none;
}

@media screen and (max-width: 1440px) {
.top-tasks a {
	font-size: .9em;
}
div.image-group.news div.img-caption {
    padding: 10px 10px 0;
    width: calc((100% - 60px) / 4);
}
.limit_3 .blocklink:nth-child(n+4) .img-caption{ 
	padding: 0 0 0 10px !important;
}
}

@media screen and (max-width:1200px) {
.top_home_item {
	width: 32%;
	margin-right: 2%;
}
.top_home_item:nth-of-type(3n + 3) {
	margin-right: 0;
}
.top_home_item:nth-of-type(3n + 4) {
	clear: both;
}
.top_home_item:nth-of-type(4n + 4) {
	margin-right: 2%;
}
.top_home_item:nth-of-type(4n + 5) {
	clear: none;
}
}

@media screen and (max-width: 1010px) {
.top-tasks ul li {
	width: calc((100% - 15.1px) / 3);
}

.peoplepanel div.img_panel{
	width: 100% !important;
	max-width: 100% !important;
	padding: 20px 2%;
	text-align: center;
}
.arrow_blue {
    position: absolute;
    width: 30px;
    height: 30px;
    background: #054d84;
    transform: rotate(45deg);
    left: 50%;
    margin-left: -15px;
    bottom: -17px;
    z-index: 2;
	top: inherit;
	right: inherit;
	margin-top: inherit;
}
.intro_panel div.img-caption{
	width: 100% !important;
	max-width: 100% !important;
	padding: 0;	
}
.intro_panel div.img-caption p{
    max-width: 700px;
    text-align: center;
    margin: auto;
}
.intro_panel div.img-caption:nth-of-type(2){
	padding: 0;
	border-left: none;
}
a.button_big_blue.c2p_button{
	position: relative;
    clear: both;
    display: block;
    width: 100px;
    left: 50%;
    margin: 15px 0 0 -50px;
}
}

@media screen and (max-width:900px) {
.peoplepanel div.limage {
	height: 400px;
}
.peoplepanel > div {
	width: 100%;
	float: none;
	clear: both;
}
div.image-group.news div.img-caption {
	width: calc((100% - 21.1px) / 2) !important;
	float: left !important;
	margin: 0 !important;
	padding: 10px 10px 0;
}
div.image-group.news .blocklink:nth-of-type(2n + 2) div.img-caption {
	padding-right: 0;
}
div.image-group.news .blocklink:nth-of-type(2n + 3) div.img-caption {
	border-left: none;
	padding-left: 0;
}
/*different style from the 3th onward */
.limit_3 .blocklink:nth-child(n+3) .img-caption{ 
	padding: 10px 10px 0 !important;
	width: 100% !important;
	max-width: 100% !important;
	float: none;
	clear: right;
	background: #f1f1f1;
	box-sizing: border-box;
}
.limit_3 .blocklink:nth-child(n+3) img{
	display:none;
}
.limit_3 .blocklink:nth-child(n+3) h3{
	margin: 0;
}
.limit_3 .blocklink:last-child p:last-of-type{
	border-bottom: none !important;
}
.limit_3 .blocklink:nth-child(3){ 
	margin-top: 30px;
}
.limit_3 .blocklink:nth-child(n+3) .img-caption p:last-of-type{ 
	border-bottom: 1px solid;
	border-bottom-color: #CCC;
	margin-bottom: 5px !important;
}
.limit_3 .blocklink:nth-child(n+3):hover p:last-of-type, .limit_3 .blocklink:nth-child(n+3):focus p:last-of-type{
	border-bottom-color: #036 !important;
	border-bottom: 2px solid;
}
}

@media screen and (max-width: 640px) {
.top-tasks ul li {
	width: calc((100% - 10.1px) / 2);
}
.top_home_item {
	width: 100%;
	clear: both;
	margin: 0 0 30px;
}
.herotext {
	font-size: 95%;
	bottom: 20px;
}
.panels div.img-caption h3 {
	font-size: 1em;
}
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
     /*IE 10 and 11 code here*/
	
	.arrow_blue {
    	left: 100%;
	}
}
