/* =============================================================================
   Typography
   ========================================================================== */

h2, h3, h4, h5 { color: #333; }
h1 { font-family: 'Avenir LT W01 95 Black', Helvetica, Arial, sans-serif; text-transform: uppercase; color: #111; }
.date { color: #8f9092; }


/* ===========================================================================
   Links
   ========================================================================== */

a, a:visited, .ac a .title { color: #1A3989; }
a { font-size: 1.4rem; }
a:focus { outline: thin dotted; }
a:hover, a:active { outline: 0; }
p a, p a:visited { line-height: inherit; font-size: 1.3rem; }

/* =============================================================================
   Header
   ========================================================================== */

.twelve header .title { /*background: url('../images/logo.png') top left no-repeat; text-indent: -9999px;*/ margin: 35px 0 5px 0; }
.twelve header .title a { display: block; width: 368px; height: 66px; }
.twelve header .title.microsite {background:none; text-indent:0;}
#top_nav ul li a { color: #17337a; }

div.search-form input[type="text"] {
    height: 24px;
    font-size: 1.2rem;
    border: 2px solid #e6e6e6;
    box-shadow: none;
}
.IE7 div.search-form input[type="text"] { padding-top: 2px; height: 20px; }
header .tab {
    position: relative !important;
    float: right !important;
    background: #12275d;
    margin-top: 5px;
}
header .tab.volunteer { margin-right: 10px; }
header .tab:hover,
header .tab:focus {
    background: #A3A3A3;
    transition: all 0s ease-in;
}
header .tab a { color: #fff; }
header .notifications { background: url('../images/notification-bubble.png') no-repeat; top: -20px; left: 0; width: 29px; height: 27px; }

/* =============================================================================
   Main Navigation
   ========================================================================== */

.nav {
    height: 56px;
    margin-bottom: 25px;
    background: #12275d;
}
#main_nav li { position: relative; }
#main_nav > li:hover,
#main_nav li.touchHover > a,
#main_nav > li.HighLighted { background-color: #1a3989; }
#main_nav .dropdown ul li.cta a.rm { color: #1A3989; }
.twelve > ul#main_nav .dropdown ul li a:hover { color: #1A3989; }
.twelve #main_nav li:hover .dropdown ul, .twelve #main_nav li.touchHover .dropdown ul { border: 1px solid #eaeaea; }
.twelve #main_nav li:hover:nth-child(5) .dropdown ul { left: -68px; }
.twelve #main_nav li:hover:nth-child(6) .dropdown ul { left: -163px; }
.twelve #main_nav li:hover:last-child .dropdown ul { left: -320px; }

/* Arrow */
.twelve > #main_nav li:hover .dropdown:before, .twelve > #main_nav li.touchHover .dropdown:before {
    content: "";
    position: absolute;
    left: 15px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 7px 7px 0 7px;
    border-color: #1a3989 transparent transparent transparent;
    z-index: 999999;
}


/* =============================================================================
   Search Box
=============================================================================
*/
.searchBox label {
    display: block !important;
    margin-top: 0px;
    margin-right: 5px;
    font-size: 11px;
    font-weight: normal;
}

.searchBox input {
    margin-bottom: 0;
}
.searchBox {
    display: flex;
    align-items: center;
    justify-content: center;
}

@media only screen and (max-width: 63.938em) {
    .searchBox {
        width: 100%;
    }
}
/* TEMP FIX SO NOT TO HAVE DUPLICATE TEXT - NEEDS BE CHANGED FOR ACCESSIBILITY */
.forumSearch .searchBox label {
    display: none !important;
}

/* =============================================================================
   Banner Box
=============================================================================
*/

.cookie-container,
.article-login-banner {
    box-sizing: border-box;
    background: #f4f4f4;
    border-bottom: 1px solid black;
    display: none;
}
/* 
.cookie-container.active {
    max-height: 10000px;
    border-bottom: 1px solid black;
} */

.cookie-container .row {
    padding: 20px 0;
}

.cookie-container h2,
.article-login-banner h2 {
    margin-top: 0;
    padding-bottom: 10px;
}

.article-login-banner {
    border-top: 1px solid black;
    display: block;
    padding: 20px;
}



/* ===========================================================================
   Left Navigation
   ========================================================================== */

ul#left_nav li a:hover,
ul#left_nav ul li.HighLighted > a { color: #1A3989; }



/* =============================================================================
   Ontario Social Media Widget
   ========================================================================== */

#socialTabs { list-style-type: none;  margin: 15px 0 0 0; }
#socialTabs > li { float: left; position: relative; width: 50%; margin-bottom: 0; }
#socialTabs > li a {
    display: block;
    padding: 10px 30px;
    text-align: center;
    color: #ccc !important;
}
#socialTabs > li a:hover { text-decoration: none; }
.social .tab-pane { display: none; height: 375px; overflow: scroll; }
.social .tab-pane.active { display: inline-block; width: 100%; }
.social #linkedin, .social #twitter {
    color: #fff;
    border-radius: 0 0 5px 5px;
    padding: 20px;
    margin-top: 0;
    background: none;
}
.social #twitter { background: #9e9e9e; }
.social  #linkedin { background: #363636; }
.social #linkedin a, .social #twitter a, .linked-in-group-info a, .linked-in-posts a, .linked-in-group a  { color: #ddd !important; }
.social #linkedin a:hover, .social #twitter a:hover, .linked-in-group-info a:hover, .linked-in-posts a:hover, .linked-in-group a:hover  { color: #ccc !important; }
#socialTabs > li a { border-radius: 5px 5px 0 0; text-indent: 200%; white-space: nowrap; overflow: hidden; }
#socialTabs > li + li a { background: url('../images/linkedin_button.png') no-repeat center top #363636; }
#socialTabs > li:first-child a  { background: url('../images/twitter_button.png') no-repeat center top #9e9e9e; }
.twitter-widget > img { display: none; }
.twitter-widget ul { list-style-type: none; border-bottom: 1px solid #bbb; margin-bottom: 10px; padding-bottom: 20px; }
.twitter-widget ul li { font-size: 1rem; float: left; margin:-8px 0 0 0; background-image: none; }
.twitter-widget ul li a { font-size: 1.1rem; padding-right: 5px; }
.twitter-widget ul > li:first-child a:after, .twitter-widget ul > li:first-child + li a:after, .twitter-widget ul > li:first-child + li + li a:after { padding-left: 5px; content: "\2022"; }
.twitter-widget ul li a:hover { text-decoration: none; }
.twitter-widget .meta:last-of-type { border-bottom: none; padding-bottom: 5px }
.linked-in-group {background:#373b3c; color:#fff; padding:10px; border-radius:5px;}
.linked-in-group h4 {color:#fff; background:url("../images/icon-LinkedIn.png") no-repeat scroll left top; padding-left:38px; word-break:break-word;}
.linked-in-posts { width: 100%; margin-top: 10px;font-size: 1.3rem; }
.linked-in-group .linked-in-posts {width:100%;}


/* APPLY ONLY TO IE */
.linked-in-post-item { -ms-word-wrap: break-word; max-width:235px;}

.linked-in-post-item a { text-decoration: none; font-size: 1.3rem;}
.linked-in-post-item ul.meta li { color: #aaa; line-height: 11px; margin-top: 4px; }
.linked-in-group-info li { border: none !important; width:46%;}
.linked-in-group-info li.link {width:auto; margin:0; padding:0;}
.linked-in-group-info li a { margin: 0 6px 0 0; }
.tab-content.social-feed { width:100%; }


/* =============================================================================
   Classy Scroll
   ========================================================================== */

.scrollbar-path-vertical, .scrollbar-path-horizontal { position: absolute; background-color: #eee; background-color: rgba(220,220,220,0.5); z-index: 100; }
.scrollbar-path-horizontal { bottom: 5px; left: 0; width: 100%; height: 10px; }
.scrollbar-path-vertical { right: 10px; top: 0; height: 100%; width: 10px; }
.scrollbar-path-vertical { box-shadow: inset 1px 0 1px rgba(0,0,0,0.1); -moz-box-shadow: inset 1px 0 1px rgba(0,0,0,0.1); -webkit-box-shadow: inset 1px 0 0 rgba(0,0,0,0.1); }
.scrollbar-path-horizontal { box-shadow: inset 0 1px 1px rgba(0,0,0,0.1); -moz-box-shadow: inset 0 1px 1px rgba(0,0,0,0.1); -webkit-box-shadow: inset 0 1px 0 rgba(0,0,0,0.1); }
.scrollbar-handle { position: relative; top: 0; left: 0; background-color: #333; }
.scrollbar-path-vertical .scrollbar-handle { height: 20%; width: 100%; }
.scrollbar-path-horizontal .scrollbar-handle { width: 20%; height: 120%; }
.scrollbar-path-vertical, .scrollbar-path-horizontal, .scrollbar-handle { -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
.scrollbar-content { padding: 0 20px 0 0 }

/* =============================================================================
   Flexslider
   ========================================================================== */

.home { margin-bottom: 20px; }
#contentZone > .home { margin-top: -25px; }
#contentZone > .home .row { padding: 25px 0 10px 0; }
.flexslider { max-width:99%; margin: 0 0 30px; position: relative; zoom: 1; overflow:hidden;}
.flexslider li {position:relative;}
.flexslider:hover .flex-next {opacity: 0.8; right: 5px;}
.flexslider:hover .flex-prev {opacity: 0.8; left: 5px;}
.flex-direction-nav {*height: 0; position:absolute; top:48%; width:100%;}
.flex-direction-nav a {width: 30px; height: 30px; display: block; background: url(../images/bg_direction_nav.png) no-repeat 0 0; position: absolute; top: 50%; z-index: 10; cursor: pointer; text-indent: -9999px; opacity: 0; -webkit-transition: all .3s ease;}
.flex-direction-nav .flex-next {background-position: 100% 0; right: -36px; }
.flex-direction-nav .flex-prev {left: -36px;}
.flex-caption {
    background: #666;
    background: -moz-linear-gradient(top, rgba(96,96,96,0.7) 0%, rgba(32,32,32,0.7) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(96,96,96,0.7)), color-stop(100%,rgba(32,32,32,0.7))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, rgba(96,96,96,0.7) 0%,rgba(32,32,32,0.7) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, rgba(96,96,96,0.7) 0%,rgba(32,32,32,0.7) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, rgba(96,96,96,0.7) 0%,rgba(32,32,32,0.7) 100%); /* IE10+ */
    background: linear-gradient(to bottom, rgba(96,96,96,0.7) 0%,rgba(32,32,32,0.7) 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cc606060', endColorstr='#cc202020',GradientType=0,opacity=50 ); /* IE6-9 */
}
.flex-caption { overflow: visible; position:absolute; bottom:0; left: 0; width: 100%; padding: 5px 15px; height:auto; color:#fff;}
.flex-caption a { margin: 0 0 15px 0; color: #7795ea; display: block; font-weight: bold; }
.flex-caption a:hover { text-decoration: underline; }
.flex-caption h5 { text-transform: uppercase; margin-top: 10px; }
.flex-caption h5, .flex-caption p { color: #fff; margin-bottom: 5px; }
.flex-caption a { font-size: 1.2rem; }
.flex-control-nav { position: absolute; right:10px; bottom:0; }
.flex-control-nav li {margin: 0 6px; display: inline-block; zoom: 1; *display: inline;}
.flex-viewport { max-height: 320px; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; transition: all 1s ease; }
.home .flexslider {margin-bottom:20px}
.home .flex-control-nav {position:relative; text-align:center; margin-top:15px;}

/* =============================================================================
   CTA's
   ========================================================================== */

.home .cta h1 { margin-top: -2px; text-transform: uppercase; }
/*.home .cta p { color: #fdfdfd; }*/
.home .cta a { color: #7795ea; font-size: 1.2rem; font-weight: bold; }
.home .cta h1 { font-family: 'Avenir LT W01 65 Medium', Helvetica, Arial, sans-serif; }
.cta.home .content {
  padding: 0 10px 15px 15px;
  border-left: 1px solid #000;
}

.home.three #companies,
.home.three .twitter-wrapper,
.home.three .CMSBanner {
	clear:both;
	display:block;
	margin-bottom:20px;
}
.twitter-wrapper {padding: 20px 0 40px 0;}
.home.three a.CMSBanner[href$=".pdf"],
.tab.volunteer a{
  background-image: none !important;
  padding-left: inherit;
}

.cta.home {padding:0;}
.cta.home .content { padding:0 10px 15px 15px; border-left: 1px solid #000; }

/* =============================================================================
   Home Page Twitter Widget
   ========================================================================== */

.home { margin-bottom: 30px; }
.twitter-wrapper { padding-top: 0 !important; }
.twitter-widget {
    position: relative;
    width: 220px;
    height: 130px;
    padding: 15px 10px;
    margin: 0 0 25px 0;
    background: #fafafa; /* Old browsers */
    border: #eee solid 1px;
}
.twitter-widget:after {
    content: "";
    position: absolute;
    bottom: -15px;
    left: 37px;
    border-style: solid;
    border-width: 15px 10px 0;
    border-color: #fafafa transparent;
    display: block;
    width: 0;
    z-index: 1;
}
.twitter-widget:before {
    content: "";
    position: absolute;
    top: 129px;
    left: 37px;
    border-style: solid;
    border-width: 15px 10px 0;
    border-color: #ddd transparent;
    display: block;
    width: 0;
    z-index: 0;
}
.twitter-widget ul { list-style-type: none; overflow: visible; margin-top: 8px; }
.twitter-widget ul.meta li { float: left; }
.twitter-widget ul.meta li a { font-size: 10px; color: #1A3989; padding: 0 2px;}
/*.twitter-widget ul.meta li:after { content: "\2022"; font-size: 1rem; }*/
.twitter-widget ul.meta li:last-child:after { content: ""; }
.twitter-widget > a { position: absolute; right: 0; bottom: -40px; text-transform: uppercase; font-weight: bold; font-size: 12px; font-size: 1.25rem; }
.twitter-widget > img { position: absolute; bottom: -50px; left: 30px; display: block !important; }
p.tweet { margin: -2px 0 0 0; font-size: 1.1rem; }
p.tweet a { font-size: 1em; }

/* =============================================================================
   Adverts
   ========================================================================== */

.advert img { margin: 15px 0; }


/* =============================================================================
   jQuery UI Event Calendar
   ========================================================================== */
.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight { border-color:#3550a1 !important;}
#datepicker .highlight { background:#6b7eb6;}


/* =============================================================================
   Footer
   ========================================================================== */

footer .links dl { float: left; width: 18%; }
footer .links .social dl dt { font-size: 1.5rem; font-weight: bold; margin-bottom: 10px; }
footer .links dt { text-transform: uppercase; color: #777; margin-bottom: 5px;}
footer .links dl dd { float: left; }
footer .links .social dl { width: 100%; margin-top: -3px; padding-left: 20px; }

footer .copyright, footer .terms { margin: 30px 0 10px 0; display: inline-block; font-size: 1.2rem; color: #fff; }

.social-container { background-color: #12275d; }

/* =============================================================================
   Reuze Customization
   ========================================================================== */

/* Latest News (Home Page) */
.ac.latest-news article { border-bottom: 1px solid #f2f2f2; padding-top: 12px; padding-bottom: 0; }
.ac.latest-news article:first-child { padding-top: 8px; margin-top: 0; }
.ac.latest-news article:last-child { border-bottom: none; }
.ac.latest-news header { padding-left: 10px; }
.ac.latest-news ul.meta { float: left; width: 70px; }
.ac.latest-news ul.meta li { border: 2px solid #000; padding: .25em; border-radius: 50%; width: 50px; height: 50px; }
.ac.latest-news span { text-transform: uppercase; text-align: center !important; display: block; color: #8f9092; font-weight: bold; }
.ac.latest-news span.month { font-size: 1.7rem; }
.ac.latest-news span.day { font-size: 3.6rem; margin: -10px 0 0 0; }
.ac.latest-news header a h5, .ac.latest.news header a h6 { padding-top: 10px; font-family: "Open Sans"; text-transform: none;}

/* =============================================================================
   Page Slide
   ========================================================================== */

#pageslide > ul > li.HighLighted > a, #pageslide > ul > li.HighLighted li.HighLighted > a { background-color: #000 !important; }
#pageslide > ul > li.HighLighted > a { border-bottom: 1px solid #666; }
#pageslide ul li ul li { border-bottom: 1px solid #666; }
.landing #pageslide > ul > li > a { border-bottom: 1px solid #666; }


/* #pageslide > ul > li.hover > a { background: #000; }
#pageslide ul li a:hover {
    background: #84cb44;
    background: -moz-linear-gradient(top, #84cb44 0%, #649437 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#84cb44), color-stop(100%,#649437));
    background: -webkit-linear-gradient(top, #84cb44 0%,#649437 100%);
    background: -o-linear-gradient(top, #84cb44 0%,#649437 100%);
    background: -ms-linear-gradient(top, #84cb44 0%,#649437 100%);
    background: linear-gradient(to bottom, #84cb44 0%,#649437 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#84cb44', endColorstr='#649437',GradientType=0 );
	background:inherit !important;
}
*/


/* =============================================================================
   LinkedIn
   ========================================================================== */

.ac .meta.linked-in-group-info { line-height: 1.2; }


/* =============================================================================
   Misc
   ========================================================================== */

.accordion {margin-top:30px;}



/* =============================================================================
   Microsites
   ========================================================================== */

.microsite .twelve header .title {text-indent:0; background:none;}
.microsite .twelve header .title a {display:block; width:auto; height:auto; max-width:400px; max-height:100px;}
.microsite .twelve header .title a span {display:block; text-indent:-9999em; height:1px;}
.microsite .utility > li.search {display:none;}


/* Update button colours */
a.button, input.button, input[type="submit"], .ForumFlat .Actions a {
  background-color: #12275d;
  color: #FFFFFF;
}
a.button:hover, input.button:hover, input[type="submit"]:hover {
  background-color: #A3A3A3;
}


/* =============================================================================
   Media Queries
   ========================================================================== */

@media only screen and (max-width: 47.938em) {
    .twelve header .title a { width: 300px; height: 54px; }
    .twelve header .title {
        background-size: 100% 100%;
        margin-top: 10px;
        width: 300px;
        height: 54px;
    }
    .IE7 .twelve header .title, .IE8 .twelve header .title {
        background: url('../images/logo@ie.png') top left no-repeat;
        width: 300px;
        height: 54px;
        background-size: auto;
    }
    .home .cta { background: #0c1c30; margin: -15px; padding: 25px 15px; }
    .nav { margin-bottom: 0; }
    footer { margin-left: -25px; }
	.linked-in-post-item { max-width:100%;}

	.social {margin:0 20px;}


	/* Cancel out navigation hover styles */

	.twelve #main_nav li:hover .dropdown ul, .twelve #main_nav li.touchHover .dropdown ul { box-shadow: none; }
	/* .twelve > #main_nav li:hover .dropdown:before, .twelve > #main_nav li.touchHover .dropdown:before {
		content: "";
		position: absolute;
		left: 46%;
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 7px 7px 0 7px;
		border-color: #649437 transparent transparent transparent;
		z-index: 999999;
	}
	#main_nav li a.long:hover { width: 130px; }
	#main_nav li a:hover { text-decoration: none; cursor: pointer; }
		.twelve > ul#main_nav .dropdown ul li a:hover {
		color: #649337;
		text-decoration: none;
		background: none;
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff',GradientType=0 );

	}
	*/
	#main_nav > li a:hover, #main_nav > li.hover > a, #main_nav li.touchHover > a, #main_nav > li.HighLighted > a {
		background: transparent !important;
	}
	.twelve > ul#main_nav li:hover .dropdown ul {
		opacity: 1;
		top: 48px;
		left: -20px;
		-webkit-transition: none;
		-moz-transition: none;
		-o-transition: none;
	}
	.advert {margin-top:1rem;}
	.social {margin:0;}
}

/* Mobile and Tablet */
@media only screen and (max-width: 63.938em) {
	.flexslider {
		margin:0 0 25px;
		position:relative;
	}
	.flex-viewport {
		max-height:inherit !important;
	}
	.flex-caption {
		position:relative !important;
		bottom:inherit !important;
		top:inherit !important;
	}
	.flex-control-nav {display:none;}
}

/* =============================================================================
   Company Slider
   ========================================================================== */

#companies { position: relative; max-width: 200px; max-height: 60px; clear: both; margin: 0 auto; }
#companies .slides li {margin-bottom:0;}
#companies img { margin: 5px 0 !important; padding:0 5px;}
#companies .flex-viewport { border:1px solid #E5E5E5;}
#companies .flex-direction-nav a {opacity:1;}
#companies .flex-direction-nav .flex-next, #companies .flex-direction-nav .flex-prev { position: absolute; width: 13px; height: 13px; text-indent: 100%; white-space: nowrap; overflow: hidden; }
#companies .flex-direction-nav .flex-next { background: url(../images/slider_right_arrow.png) no-repeat; right: -15px; top: 0px; }
#companies .flex-direction-nav .flex-prev { background: url(../images/slider_left_arrow.png) no-repeat; left: -15px; top: 0px; }
.company-logo { margin-top: 80px; list-style-type: none; }

#top-btn {
  background: #12275d;
}