﻿/**** google api fonts *****/
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,400,300,600,700,800);
@import url(https://fonts.googleapis.com/css?family=Sorts+Mill+Goudy:400,400italic);

body{ /*font-family:"Segoe UI",'Open Sans',Arial,Helvetica,sans-serif;****this is on the bootsrap file***/
	  font-size:1.6em; /*10px X 1.6 = 16px(default font size in browsers)*//*the html font size is set to 62.5%(10px) on bootstrap.css*/
      line-height: 1.428571429;
      -webkit-text-size-adjust:100%; 
      /*background-color:#FBFBFB*//*less vibrant AAA accessibility*/}
body.v4master{
	overflow:auto/***important*** keep this rule to allow scrolling of pages when the ribbon is not present*/
}
@media (max-device-width:1024px) {
body, body*{-webkit-text-size-adjust:100%;}
}
@media (min-width: 1200px){
	body {font-size:1.8em /*10px X 1.8 = 18px *//*the html font size is set to 62.5%(10px) on bootstrap.css*/
	}
}
body,html{height:100%}
/*allow browser scrolling on anonymous views*/
body #s4-workspace {
    overflow-x: hidden!important;
    overflow-y: visible!important;
    position: relative!important;
    height: auto;
}
       
body #s4-bodyContainer {
    min-width: 310px;
    /*overflow: hidden;/*hides content when the left nav is expanded on mobile views*/
    /* position: relative; *//* fix scrolling on list pages */
}
	
/**********update bootsrap custom with the following two lines*************/
@media (min-width: 768px) and (max-width:1399px) {
   .container {width: 100%; }
}
@media (min-width:1400px) {
   .container {width: 1300px;}
}

/**** ribbon styles ****/  
/**override of bootstrap box-sizing ***/
#s4-ribbonrow *{
	box-sizing:content-box;
	-moz-box-sizing:content-box;
}
#s4-ribbonrow .ms-welcomeMenu{
	font-size:10pt /*user name w/ menu on ribbon*/
}
/* popout breadcrumb menu needs background color for firefox */
.s4-breadcrumb-menu {
	background:#F2F2F2;
}
body #pageStatusBar{
	font-size:85%;
}

/*********** head section **********/
.container.headWrapper .top{padding:0px!important}
#cobHead {background-color: #00070f;/* background-image: linear-gradient(to right, #000710, #002D5F); */height: 50px;}
#cobHead .bramptonLogo img{
	position:absolute;
	left:5px;
	top:5px;
}
#cobHead .bramptonLogo {
	display:block;
	width: 150px;
	height: 30px;
	position:absolute;
	top: 10px;
	left:15px;
	z-index:3;
	overflow:hidden;
	background-image:url('/Style%20Library/BramptonImages/Generic/branding-2018/Brampton-WebLogo.png');
	background-repeat:no-repeat;
	background-position:left top;
	background-size: contain;
}

@media (min-width: 768px) {
		#cobHead,#cobHead .headWrapper{height:60px;}
		#cobHead .headWrapper .col-xs-12.top{height:0px;}
		#cobHead .bramptonLogo {
		display:block;
		width: 190px;
		height: 45px;
		position:absolute;
		top: 10px;
		left:15px;
		z-index:3;
		overflow:hidden;
		background-image:url('/Style%20Library/BramptonImages/Generic/branding-2018/Brampton-WebLogo.png');
		background-repeat:no-repeat;
		background-position:left top;
		background-size: contain;
		z-index: 2;
	}
}

@media (min-width: 1200px){
	  	#cobHead .bramptonLogo {
		width:210px;
		height:40px;
		top:9px;
		left:15px;
		z-index: 999;
		}
}

/***** skip navigation (accesibility) *******/
/*:root #skipnav {display: block; } /*Switch on for Moz, FF and Safari*/
a.ms-skip {
	display: block;
    width: 160px;
    text-decoration: none;
    padding: 0px 5px;
    font-size: 16px;
    font-style: italic;
    color: #fff;
    background-color: #002D5F!important;
}
a.ms-skip:visited {color:#ffac35}
a.ms-skip:active, a.ms-skip:focus {top: 0px!important;
    line-height: 60px;
    height: 60px;
    outline-width: 0px;
    outline-style: none;
    outline-color: invert;
    border: none;
    color: #fff;
    width: 35%;
    text-align: center;
    padding: 0px;} 
a.ms-skip:hover {cursor:pointer; outline-width:0px; outline-style:none; outline-color:invert; } 

@media (min-width: 1200px){
a.ms-skip {font-size:18px;}
}
/********main search styles**********/
#cobHead .searchWrapper {
    position: absolute;
    top:0px;
    right: 0px;
    width: 100%;
    z-index: 999;
}
#cobHead #SRSB{
	background-repeat:no-repeat;
	background-position:left top;
	height:60px!important;
	background-color:#002D5F;
	margin:0px;
	color:#fff;
	width:100%;
	position:absolute;
	right:0px;
	z-index: 3;
	width: 0;
	visibility: hidden;
	-webkit-transition: width 0.25s ease;
	transition: width 0.25s ease;
}
#cobHead #SRSB.collapsed{
	height:60px!important;
	display:none;
}
#cobHead #SRSB.in{
	width: calc(100% - 51px);
	right: 51px;
	height: 50px!important;
	visibility:visible;
	-webkit-transition: width 0.25s ease;
	transition: width 0.25s ease;
	display:block;
	background-image: linear-gradient(to left, #000710, #002D5F);/* border:6px solid #000710
 */
}

@media (min-width:768px){
#cobHead #SRSB.in {
    width: calc(100% - 61px);
    right:61px;
    height: 60px!important;
}
#cobHead #SRSB input.ms-sbplain {
    line-height: 60px;
    height: 60px;
}
}
@media (min-width:992px){
	#cobHead #SRSB.in{
		width: calc(100% - 280px);
		right:61px;
		height:60px!important;
	}
}
@media (min-width:1200px){
	#cobHead #SRSB.in{
		width: calc(100% - 300px);
		right:122px;
		height:60px!important;
		visibility:visible;
		-webkit-transition: width 0.25s ease;
		transition: width 0.25s ease;
		display:block;
	}
}
#cobHead #SRSB .cobSearchGo {
    display: block;
    width: 50px;
    height: 50px;
    text-align: center;
    color: #fff;
    font: normal normal normal 32px/1 FontAwesome;
    position: absolute;
    right: 0px;
    top: 0px;
}
#cobHead #SRSB .cobSearchGo:hover,
#cobHead #SRSB .cobSearchGo:focus{
	outline:none;
	color:#0093FF;
}
.search-toggle{
    width: 50px;
    height: 50px;
    position:absolute;
    right: 0px;
    z-index:1;
    font: normal normal normal 32px/1 FontAwesome;
    border:none;
    color: #fff;
    text-align: center;
    padding:0px;
    background-color:#002D5F;
    -webkit-transition: all 0.25s ease;
    transition: all 0.25s ease;
}
.search-toggle:hover,
.search-toggle:focus{
	color:#0093FF;
}

.search-toggle .icon-bar{
	display:block;
	width: 28px;
    height: 4px;
    border-radius: 1px;
    background-color: #fff;
    margin: auto;
    -webkit-transition: .3s ease-in-out;
  	-moz-transition: .3s ease-in-out;
  	-o-transition: .3s ease-in-out;
  	transition: .3s ease-in-out;
  	-webkit-transform-origin: center;
    transform-origin: center;
}
.search-toggle:hover .icon-bar,
.search-toggle:focus .icon-bar{
	background-color:#0093FF;
}

.search-toggle.collapsed{
	    background:transparent;
	    right: 51px;
}
.search-toggle.collapsed .icon-bar{
	display:none
}
.search-toggle .icon-bar+.icon-bar {
    margin-top: 4px;
}
.search-toggle .icon-bar:nth-child(1) {
   -webkit-transform: translateY(6px) rotate(45deg);
   transform: translateX(11px) rotate(45deg);
   margin: 0px;
   width: 32px;
}
.search-toggle .icon-bar:nth-child(2){display:none}
.search-toggle .icon-bar:nth-child(3) {
    -webkit-transform: translateY(6px) rotate(-45deg);
    transform: translateX(11px) translateY(-4px) rotate(-45deg);
    margin: 0px;
    width: 32px;
}
.search-toggle:before{
    content: "\f002";
    font-size: 28px;
    line-height: 46px;
    display: none;
    height: 50px;
}
.search-toggle:focus{
	outline:none;
}
.search-toggle.collapsed:before{
	display:inline-block
}
#cobHead #SRSB .cobSearchGo:hover{
	text-decoration:none;
	color:#0093FF;
}
#cobHead #SRSB .cobSearchGo:before {
    content: "\f002";
    font-size: 30px;
    line-height: 46px;
    display: inline-block;
    height: 50px;
    }
#cobHead #SRSB input.ms-sbplain{
    width: 100%!important;
    background-color: transparent;
    line-height: 50px;
    height: 48px;
    color: #fff;
    -webkit-appearance: textfield;
    border: none!important;
    font-size: 14px;
    background: none;
    border: none;
    padding: 0px;
    padding-left: 6px;
    padding-right: 50px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    font-style: normal;
}
#cobHead #SRSB input.ms-sbplain:focus{
	outline:none
}    
#cobHead #SRSB .s4-search input.ms-sbplain {
	 	font-size: 16px;
}
@media(min-width: 768px)  {
	#cobHead #SRSB .cobSearchGo {
		width: 60px;
		height: 60px;
	}
	#cobHead #SRSB .cobSearchGo:before {
		font-size: 28px;
		line-height: 56px;
		display: inline-block;
		height: 60px;
	}
	.search-toggle{
		width: 60px;
		height: 60px;
	}
	.search-toggle.collapsed {
		background: transparent;
		right: 61px;
	}
	.search-toggle:before {
		content: "\f002";
		font-size: 28px;
		line-height: 56px;
		display: none;
		height: 60px;
	}
	#cobHead #SRSB input.ms-sbplain {
		line-height: 60px;
		font-size: 18px;
		padding-left: 25px;
		height: 60px;
	}

}
@media (min-width: 1200px) {
	.search-toggle.collapsed {
		right: 0px;
	}
	#cobHead #SRSB.in{right:61px;}
}
/********top navigation styles**********/
/*************hamburger menu**************/

.topNav-toggle{
    width: 50px;
    height: 50px;
    padding: 0px;
    border: none;
    background-color:transparent/*#002D5F*/;
    border-radius: 0px;
    margin: 0px;
    position: absolute;
    right: 0px;
    top: 0px;
}
.Left-toggle {
    width: 50px;
    height: 50px;
    padding: 0px;
    border: none;
    border-radius: 0px;
    margin-left: -10px;
    background-color: transparent;
    transition: 0.3s;
}
.sidenav .Left-toggle {
    width: 50px;
    height: 50px;
    padding: 0px;
    border: none;
    border-radius: 0px;
    margin: 0px;
    background-color: transparent;
    position: absolute;
    top: 50px;
    left: 0px;
    z-index: 9999;
    transition: 0.3s;
    opacity:0;
    display: none;
}
.sidenav.in .Left-toggle{
	left: calc(100% - 50px);
	top: 0px;
	opacity:1;
	display:block;
}
@media (min-width: 768px){
	.sidenav .Left-toggle {
	    left: 0px;
	    top:60px
	}

}
@media (min-width:1400px){
	.sidenav .Left-toggle {
	    left: 0px;
	}
}
.topNav-toggle .icon-bar,
.Left-toggle .icon-bar{
    width: 32px;
    height: 4px;
    display: block;
    background-color: #fff;
    -webkit-transform-origin: center;
    transform-origin: center;
    transition: .3s ease;
    border-radius: 1px;
}
.Left-toggle .icon-bar{background-color:#002d5f}
#sidenav .Left-toggle .icon-bar{background-color:#fff}
.sidenav .Left-toggle:hover {background-color: transparent;}
#sidenav .Left-toggle:hover .icon-bar{background-color:#1fa2ff}
.topNav-toggle.collapsed .icon-bar:nth-child(1),
.topNav-toggle.collapsed .icon-bar:nth-child(2),
.topNav-toggle.collapsed .icon-bar:nth-child(3),
.Left-toggle .icon-bar:nth-child(1),
.Left-toggle .icon-bar:nth-child(2),
.Left-toggle .icon-bar:nth-child(3){
	width: 26px;
	-webkit-transform:rotate(0deg);
	transform:rotate(0deg);
	margin:auto;
	}
.topNav-toggle .icon-bar,
.Left-toggle .icon-bar{
    margin: auto;
}
.topNav-toggle .icon-bar:nth-child(2),
.Left-toggle .icon-bar:nth-child(2){
    margin: 6px auto;
}
.topNav-toggle .icon-bar:nth-child(1),
#sidenav .Left-toggle .icon-bar:nth-child(1){
    margin:auto;
    -webkit-transform: translateY(6px) rotate(45deg);
    transform: rotate(45deg);
    width: 32px;
}
.topNav-toggle .icon-bar:nth-child(2),
#sidenav .Left-toggle .icon-bar:nth-child(2){display:none}
.topNav-toggle .icon-bar:nth-child(3),
#sidenav .Left-toggle .icon-bar:nth-child(3){
	margin:auto;
	-webkit-transform: translateY(6px) rotate(-45deg);
	transform: translateY(-4px) rotate(-45deg);
	width: 32px;
}
.topNav-toggle.collapsed .icon-bar:nth-child(2) {
    margin: 6px auto;
    display:block
}

.topNav-toggle.collapsed:hover .icon-bar,
.topNav-toggle.collapsed:focus .icon-bar{
	background-color:#0093FF;
}

.topNav-toggle:focus {
    outline: none;
}
@media (min-width: 768px) {
.topNav-toggle {
    width: 60px;
    height: 60px;
    padding: 0px;
    border: none;
    border-radius: 0px;
    margin: 0px;
    position: absolute;
    right: 0px;
    top: 0px;
}
}
@media (min-width: 1200px) {
	.topNav-toggle {display:none}
}


/***¨replace this on bootstrap custom***/
/***top navigation on small devices***/

.cobTopNav  a[title~=HOME]
{
display:none!important
}
.cobTopNav .menu-horizontal{width:100%}
@media (min-width:1200px){
.cobTopNav .menu-horizontal{
	float: right;
	margin-right: 240px;
	width: auto;
}	
}

.cobTopNav {
	border-top: 1px solid #000710;
	margin: 0px;
} 
.cobTopNav ul.static{
	float: none;
	display: block;
	width:100%;
}
.cobTopNav span.static {
    float: none;
}
.cobTopNav a.static {
    float: none;
}
.cobTopNav li.static {
    float: none;
}
.cobTopNav a:focus{
	outline-style:none;
	outline-color:transparent;
	outline:none
}
	
.cobTopNav li.static .menu-item{
	font-size: 26px;
	line-height:40px;
	/* height:40px; */
	text-align:left;
	overflow:hidden;
	color: #fff;
	padding:0px;
	width:100%;
	border:none;
	display:block;
	border-bottom: 1px solid #000710;
}
.cobTopNav li.static .menu-item .menu-item-text{
	padding-left:10px;
	padding-right:40px;
	padding-top: 4px;
	padding-bottom: 8px;
	background-color:#002D5F;
	color: #fff;
}

.cobTopNav li.static .menu-item .menu-item-text:after {
	content: "\f107";
	display: inline-block;
	font: normal normal normal 30px/1 FontAwesome;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	float:right;
	line-height:40px;
	color: #fff;
	margin-right:-25px
}

.cobTopNav li.static > a:hover,
.cobTopNav li.static > a:focus{
	text-decoration:none;
}
.cobTopNav li.static > .menu-item.collapse .menu-item-text:after{
		content: "\f106";
}
.cobTopNav li.static > a:hover .menu-item-text{
    color: #fff;
    text-decoration:none;

}
.cobTopNav li.static > a:focus .menu-item-text{
	color: #fff;
	outline-style:none;
	outline:none;
	text-decoration:none;
}
/******new Mega Menu*****/
.globalNavContainer{
	margin: auto;
	width: 100%;
	height: 50px;
	}

@media (min-width: 768px) {
	.globalNavContainer{
		height: 60px;
	}
.cobTopNav{
	background-color: #002d5f;
	width: 100%;
	height: 60px;
	border-bottom: 1px solid #000710;
	}
 .cobTopNav li.static .menu-item .menu-item-text:after {display:none}
}	

@media (min-width: 1200px) {
	.globalNavContainer {
   z-index: 1;
}
	.cobTopNav{
	background-color: transparent;
	border-top:0px;
	margin-top:0px;
	/* width: 100%; */
	/* position: absolute; */
	/* border-bottom: none; */
	}
}
.cobTopNav .cobTopNavContent{
	display:none
}
.cobTopNav .cobTopNavContent .closeMe{
	display:none;
}
.cobTopNav .cob-megamenu-group{
	display:none;
	border-bottom: 1px solid #000710;
	margin-left:-5px;
	margin-right:-5px;
	padding-top: 5px;
	padding-bottom: 12px;
}
.cobTopNav .cob-megamenu-group li,
cob-megamenu-aside li{
	color:#fff;	
	display:block;
	padding:0px;
}
.cobTopNav .cob-megamenu-group li a{
	display:block;
	border-left:none;
	padding: 8px 10px 10px 10px;
	color: #85a0bf;
	font-size: 20px;
}

.cobTopNav .cob-megamenu-group li a:focus{
	text-decoration:none;
	background-color:#002754;
	color:#A8B6D4;
}
.cobTopNav .cob-megamenu-group li a:visited {
	background-color:transparent;
	color:#53ACFB;
}
@media (min-width: 768px){
	.cobTopNav .cob-megamenu-group li a{
		display:block;
		border-left:none;
		padding: 6px 10px 8px 10px;
		font-size: 16px;
}
}
/***Online Services***/
.cob-megamenu-aside.onlineSrv{
    font-size: 20px;
    line-height: 1.25;
    margin: 0px -5px;
    
}
.cob-megamenu-aside.onlineSrv li a{
	display: block;
	padding: 12px 40px 14px 10px;
	background-color: #001e43;
	border-bottom: 1px solid #000710;
	color: #85a0bf;
}

@media (min-width: 768px){
    
	.cob-megamenu-aside.onlineSrv{
		margin-top:45px;
		font-size: 100%;
	}
	.cob-megamenu-aside.onlineSrv li a{
		display: block;
		padding: 6px 10px 8px 10px;
		background-color: transparent;
		border-bottom: none;
		font-size: 16px;
	}
	.cob-megamenu-aside.onlineSrv li a:hover{
		text-decoration: none;
    	background-color: rgba(0,0,0,0.7);
	}
}



/*group headdings*/

.cobTopNav .cob-megamenu-column .navTitle {
    display: block;
    font-size: 20px;
    line-height: 1.25;
    padding: 12px 40px 14px 10px;
    margin: 0px -5px;
    color:#fff;
    background-repeat: no-repeat;
    background-position: right center;
    background-color:#001E43;
    border-bottom: 1px solid #000710;
    font-weight: 300;
    color: #b5c7dc;
}
.cobTopNav .cob-megamenu-column .navTitle:after {
	content: "\f107";
	display: inline-block;
	font: normal normal normal 30px/1 FontAwesome;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	float:right;
	line-height: 24px;
	color: #b5c7dc;
	margin-right:-25px;
}
.cob-megamenu-column h2{
	font-size:130%;	
	font-weight:500;

}
.cobTopNav .cob-megamenu-column .navTitle.collapse:after {
	content: "\f106";
}

@media (max-width: 767px) {	
	.cobTopNav .cobTopNavContent.container.expandNav{/*used to show and hide the nav groups on mobile devices*/
		display:block;
	}
	.cobTopNav .cob-megamenu-group.expandNav{/*used to show and hide the nav groups on mobile devices*/
		display:block;
		background-color: #000710;
	}
}
#globalNav.in{display:block;}
#globalNav{
	    border-top: 1px solid #000710;
	    width: auto;
	    position: absolute;
	    left: 0px;
	    background-color: #002d5f;
	    right: 0px;
	    top: 50px;
	    z-index: 998;
	    display: none;
	    padding-top: 50px;
	}
@media (min-width: 768px) {	
	#globalNav {
		border-top:none;
		left: 0px;
		top: 60px;
		padding-top:0px
	}	
	.cobTopNav ul.static{
	    display: block;
	}
	.cobTopNav li.static {
	    float: left;
	}
	.cobTopNav a.static {
	    float: left;
	}

	.cobTopNav li.static .menu-item{
		margin-bottom:0px;
		padding:0px;
		height:auto;
		font-size: 16px;
		line-height:55px;
		padding-left: 15px;
		padding-right: 15px;
		border:none;
		display:block;
		width:auto;
	}
	
	.cobTopNav li.static .menu-item:hover,
	.cobTopNav li.static .menu-item:focus{
		background-color: rgba(0, 0, 0, 0.31);
		border-bottom:4px solid #0093FF;
	}	
	.cobTopNav li.static .SelectedNav{
		border-bottom:4px solid #0093FF;
		background-color: rgba(0, 0, 0, 0.31);
	}
	.cobTopNav li.static .menu-item .additional-background{
		padding-left:0px;	
		padding-right:0px;
	}
	
	.cobTopNav li.static .menu-item .menu-item-text{
		padding:0px;
		background-color: transparent;
	}
	.cobTopNav li.static .menu-item .menu-item-text:after{
		content:""
	}
	.cobTopNav li.static > .menu-item.collapse .menu-item-text{
		background-image:none;
	}
	.cobTopNav li.static a:hover .menu-item-text,
	.cobTopNav li.static a:focus .menu-item-text{
	    background-color:transparent;
	}

	/*****mega Menu dropdown****/
	.cobTopNav .cobTopNavContent{
		background-color: #001834;
		display: none;
		position: absolute;
		left: 0px;
		top: 60px;
		z-index: 9999;
		width: 100%;
	}


	.cobTopNav .megamenu-wrap {
		margin-left:-15px;
		margin-right:-15px;
		padding-bottom:20px;
	}
	.cobTopNav .cobTopNavContent .closeMe{
		display:block;
		text-align:right;
		padding-bottom:6px;
	    }
	 .cobTopNav .cobTopNavContent .closeMe a{
		display:inline-block; 
		color:#9FA8BB;
		width:150px;
		background-image:url('/Style%20Library/BramptonImages/Generic/branding/leftNav_up_arrow.gif');
		background-repeat:no-repeat;
		background-position:right center;
		padding-right:30px;
		font-size:85%;
		font-weight:600;
	 }
	 
	.cobTopNav .cobTopNavContent.container.displayNav{/*used to show and hide the nav groups on mobile devices*/
		display:block;
	 }

	.cobTopNav .cob-megamenu-column{
		display:block;
		margin-left:auto;
		margin-right:auto;
	 }
	 /*group headdings*/
	.cobTopNav .cob-megamenu-column .navTitle{
		display:block;
		font-size: 20px;
		padding: 3px 10px;
		height:auto;
		line-height:26px;
		margin:0px;
		margin-top:20px;
		background-color:transparent;
		color:#fff;
		border-bottom: 1px solid #3b5879;
		}
		.cobTopNav .cob-megamenu-column .navTitle:after{
			content:""
		}
	 .cobTopNav .cob-megamenu-column .navTitle.collapse {
			background-image:none;
	 }

	 .cobTopNav .cob-megamenu-column h3:hover,
	 .cobTopNav .cob-megamenu-column h3:focus{
		background-color:transparent;
	 }
	 .cobTopNav .cob-megamenu-group{
		display:block;
		border:none;
		margin-left:auto;
		margin-right:auto;
		padding-top: 0px;
		padding-bottom: 0px;
		}
	 .cobTopNav .cob-megamenu-group li{font-size:90%}
	 .cobTopNav .cob-megamenu-group li a:hover{
		text-decoration:none;
		background-color: rgba(0,0,0,0.7);
		color:#A8B6D4;
		}	 
}

@media (min-width: 840px){
	.cobTopNav li.static .menu-item{; 
		font-size:18px
	}
}

@media (min-width: 992px){
	.cobTopNav li.static .menu-item{; 
		padding-left:25px;
		padding-right:25px;
	}
}
@media (min-width: 1200px){
	#globalNav {
		background-color: transparent;
		right: 0px;
		top: 0px;
		display: block;
	}
	.cobTopNav li.static .menu-item{font-size:18px; padding-left:20px; padding-right:20px;}

}
	
/****Left Nav *****/
#openLeftnav{
	font-size: 22px;
	color: #002d5f;
	font-weight: 400;
}
#openLeftnav #siteName{position: absolute;left: 55px;top: 9px;}
#openLeftnav:hover{
	text-decoration:none
}
#sidebar {
	display:block!important
}
.contentArea{ /**to positoin the left navigation ****/
	position: relative;
}
 /* The side navigation menu */
.sidenav{
    position: fixed;
    top: 50px;
    bottom:0px;
    left:0px;
    right:100%;	
    z-index: 999;
    background-color: #00000069;
}
.sidenav.in{
	right:0px	
}
.sidenav .sidebar-nav{
   top:50px;
   left:0px;
   bottom:0;
   right:100%;
   transition: 0.35s; /* 0.3 second transition effect to slide in the sidenav */
   z-index: 999;
   background-color: #001834;
}
body.sidenavIn {
	overflow:hidden
}
.sidenav.in .sidebar-nav{
	position:fixed;
	left:0px;
	right:0px;
	bottom:0px;
}
.sidebar-nav{
	position: absolute;
	overflow: auto;
	padding-bottom: 40px;
	}
@media(min-width:480px){
	.sidenav.in .sidebar-nav{right:40%}
}
@media(min-width:769px){
	.sidenav.in .sidebar-nav{right:60%}
	.sidenav, .sidenav .sidebar-nav{top:60px;}
	}
@media(min-width:1200px){
	.sidenav.in .sidebar-nav{right:65%}
}




/*************************end of new side nav***************************/
    
/******leftNav******/
.cobLeftNav{
	font-weight:400;
}
.cobLeftNav ul.root{
	padding:0px;
	font-size: 20px;
}

.cobLeftNav ul li{
	line-height:1.25;
}

.cobLeftNav .menu-item-text{
	padding: 6px 30px 8px 15px;
	height: auto;
	line-height: 26px;
}
.cobLeftNav a.menu-item{
	color: #B5C7E2;

}.cobLeftNav a.static.selected.menu-item .menu-item-text{padding-left:10px}
.cobLeftNav a.static.selected.menu-item .additional-background{
    background-color: rgba(0,0,0,0.7);
    border-left:5px solid #1FA2FF;
    color: #b5c7dc;
}
.cobLeftNav ul.root.static > li:first-child .menu-item:hover .menu-item-text,
.cobLeftNav a.static.selected.menu-item:hover .additional-background,
.cobLeftNav a.menu-item:hover,.cobLeftNav a.menu-item:focus{
	background-color: #00070f;
	color: #1FA2FF;
	text-decoration:none;
}



/*leftNav special headings*//****make sure to update this********/
.cobLeftNav span.static.menu-item span.menu-item-text{
		border-bottom:1px solid #3b5879;
		font-size: 24px;
		color:#fff;
		padding-top: 20px;
}
.cobLeftNav span.static.menu-item span.menu-item-text:hover{
	text-decoration:none;
}
.cobLeftNav ul.root.static > li:first-child .menu-item-text{font-size:26px;color: #fff;margin-top: 47px;}
.cobLeftNav ul.root.static > li:first-child .menu-item-text:before {
	content: "\e021";
	font-family: "FontAwesome";
	font-size: 20px;
	font-weight: 900;
	width: 32px;
	display:inline-block;
	position: relative;
	top: 1px;
	display: inline-block;
	font-family: 'Glyphicons Halflings';
	font-style: normal;
	font-weight: 400;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
}
.cobLeftNav ul.root.static > li:first-child span.static.menu-item span.menu-item-text{
 	color: #fff;}

.cobLeftNav ul.root.static > li:first-child a:hover .menu-item-text:before,
.cobLeftNav ul.root.static > li:first-child a:focus .menu-item-text:before{
	color: #398ADB;

}
.cobLeftNav ul.root.static > li:first-child a.static.selected.menu-item{
	background-color:transparent;
	background-image:none;
}

/*leftNav child items or second level nav starts hidden*/
.cobLeftNav li.static > ul.static{
	height:1px;
	overflow:hidden;
	display:none
}
/*leftNav child items only show if selected*/
.cobLeftNav li.static.selected > ul.static{
	border-top: 1px solid #3b5879;
	border-bottom: 1px solid #3b5879;
	display:block;
	height:auto;
	overflow:inherit;
	background-color: #000204;
	color:#A8B6D4;
}

.cobLeftNav li.static.selected > ul.static .menu-item-text{
	font-size: 75%;
	color:#A8B6D4;
	padding-left:15px
}


/**************footer*************/
/*** section footer ********/

/* Wrapper for page content to push down footer */

#footer .footerWrapper{
	background-color:#d7d7d7;
	text-transform:uppercase;
	font-size:13px;
	position: relative;
	/* width: 100%; */
}
#footerLinks .copyright{display:block; width:100%;line-height:28px;
	height:28px;}
#footerLinks a{
	line-height:28px;
	height:28px;
	padding:0 20px 0 0;
	display: inline-block;
}
#footerLinks a.contact{
	padding-right:0px;
}
#footerLinks a:hover,
#footerLinks a:visited,
#footerLinks a:link{
	color:#000;
}

#footerLinks img{position: absolute;right: 10px;bottom: 2px;border: 3px solid #002d5f;}
#socialLinks{margin-left: -5px;margin-bottom: 6px;margin-top: 10px;}
#socialLinks .fa {
	width: 32px;
	height: 32px;
	text-align: center;
	border-radius: 32px;
	line-height: 32px;
	color: #fff;
	background-color: #002D5F;
	font-size: 18px;
	margin-left:5px;
	}
@media (min-width: 600px){ 	
    #footerLinks img{
	bottom: 5px;
	left: calc(100% - 286px);
	border: 3px solid #002d5f;
	}
#socialLinks{position:absolute;bottom: 5px;right: 15px;margin: 0px;}
 } 
@media (min-width: 768px){
	#footerLinks{width: calc(100% - 200px);}

	#socialLinks{position:absolute;bottom: 5px;right: 15px;margin-left:0px;}
	#footerLinks .copyright{display:inline-block;width:auto;margin-right: 20px;}
	#footerLinks a{
	background-color: transparent;
	margin-bottom:0px;
	line-height: 42px;
	height: 42px;
	}
	#socialLinks a {line-height:26px;display: inline-block;}

}

/***back to top link****/
a#back-top  {
	position: fixed;
	background-color: rgba(118, 118, 118, 0.38);
	text-align:center;
	color: #fff;
	display: none;
	height: 45px;
	right: -45px;
	width: 45px;
	bottom: 60px;
	z-index: 9999;
	-webkit-transition: all 0.55s ease;
	-moz-transition: all 0.55s ease;
	transition: all 0.55s ease;
}
a#back-top:hover  {
	position: fixed;
	background-color: rgba(118, 118, 118, 0.88);
	}
a#back-top .fa  {font-size: 44px;line-height: 40px;display:inline-block;height: 55px;}
a#back-top.active{
	display:block;
	right: 0px;
}
a#back-top:hover{
	text-decoration:underline;
	
}
a#back-top:focus{outline:none}


@media (min-width: 768px) {
	a#back-top{
	bottom:40px;
	}
}

/*************/
/*** OOB overlay dialog on pages ***/ 
.ms-dlgContent {
	font-size:8pt 
}
@media only screen and (-webkit-min-device-pixel-ratio: 2) {}/*styles for mobile retina*/
@media (min-resolution: 2dppx) {}/*styles for mobile retina http://www.w3.org/TR/css3-values/ */

/**********page layouts *********/
#pageLayout{
	min-height:510px;
}

/*****buttons on pages*******/
#cobRightNav .btn-contact,
#cobRightNav .btn-connect,
#cobRightNav .btn-faq{
	padding-top:8px;
	padding-bottom:10px;
}
.btn-contact .fa,
.btn-connect .fa,
.btn-faq .fa{
	margin-right:6px;
	font-size:120%
}



/**********removes left nav on top sites pages***************/
.noLeftNav #openLeftnav,
.noLeftNav #sidenav{
	display:none!important;
}
.noLeftNav #MSO_ContentTable{
	width:100%!important;
	border-left:none!important
} 
/********311 link***********/
#ServiceRequestLink{
	position: absolute;
    top: 12px;
    right:calc(100% - 73px);
    width: 60px;
    display:block;
}

#ServiceRequestLink img{
	width:100%;
}
@media (min-width: 768px) {
	#ServiceRequestLink {
	    top: 0px;
	    width:160px;
        right: 60px;
	    z-index: 1; 
	    height:60px;
	    line-height:50px;
	    padding:0 50px;
	    border-bottom:6px solid transparent
	}
	#ServiceRequestLink:hover {
	    background-color:#002D5F;	   
	}
}
    

/************google translate**************/
/******************************************/

#google_translate_element {
	    height: 32px;
	    line-height: 32px;
	    overflow: hidden;
	    display: block;
	    margin-top:0px;
	    position: absolute;
	    right: 10px;
	    top: 8px;
}

#google_translate_element .goog-te-gadget .goog-te-combo option{
	padding:3px;
}


#google_translate_element .goog-te-gadget .goog-te-combo::-ms-expand {
    display: none;
}

#google_translate_element .goog-te-gadget .goog-te-combo:focus {outline: 0;}

#google_translate_element .goog-te-gadget .goog-te-combo:-moz-focusring {
  color: transparent;
  text-shadow: 0 0 0 #000;
}
.google-Icon{
	display:inline-block;
	width:28px;
	height:34px;
	line-height:34px;
	background-image: url('https://translate.googleapis.com/translate_static/img/te_ctrl3.gif');
    background-position: -65px center;
    background-repeat:no-repeat;
}


#google_translate_element .goog-te-gadget-simple span{
	color: #FFF;
}
.goog-text-highlight{
	color:#002D5F;
}

#google_translate_element .goog-te-gadget-simple {
    background-color: transparent;
    border: none;
    display: inline-block;
    line-height: 28px;
    font-family: "Segoe UI",'Open Sans',"Helvetica Neue",Helvetica,Arial,sans-serif;
}

@media (min-width: 768px) {
	#google_translate_element {
	    height: 34px;
	    overflow: hidden;
	    position: absolute;
	    top: 11px;
	    right: 10px;
	    z-index: 1;
	}

	#google_translate_element .goog-te-gadget-simple{
		line-height: 28px;
	}
}

@media (min-width: 1200px) {
	#google_translate_element {
	    right: 70px;
	}
}
/*********************Print Styles*************************/
@media print { 
	* {  /*note: most print styles are under bootstrap.css*/
	filter:none !important; 
	-ms-filter: none !important; } 
	#MSO_ContentTable{/*remove left orange border from left nav*/
	border:none;
	padding:0px;}
	a#back-top{display:none!important;
	margin-left:-999px}
}
