﻿.homeHead {
	overflow:hidden
}

.alertBanner {
	font-size:90%;
	height:0px;
	margin:0px auto;
	background:url('/Style%20Library/BramptonImages/emergencyAlerts/EmergencyAlert_bg01.png') no-repeat -14px bottom #8e0000; 
	cursor:pointer;
	height: 190px;
}

 .alertBanner *{
	color:#fff;
}  

.alertBanner h1{
font-size: 160%;
font-weight:700;
text-align:left;
margin:0px;
margin-bottom:8px;
}
.alertBanner p{
	text-align:left;
	margin:0px;
	margin-bottom:8px;
}

.alertBanner a{
    color:#fff;
	font-weight:600;
	background-image:url('/Style%20Library/BramptonImages/emergencyAlerts/emergency_more_info.png');
	background-repeat:no-repeat;
	background-position:right center;
	padding:6px 50px 9px 0px;
	text-decoration:none;	
	font-size:110%;
}

.alertBanner a:hover{	
	text-decoration:underline;
	}

/***adjust the supermenu positioning*******/
@media (min-width: 768px) {	
	.alertBanner {
		font-size:100%;
		height: 150px;
		background:url('/Style%20Library/BramptonImages/emergencyAlerts/EmergencyAlert_bg01.png') no-repeat -14px bottom, 
				   url('/Style%20Library/BramptonImages/emergencyAlerts/EmergencyAlert_bg02.png') no-repeat right bottom #8e0000;
	}
	.alertBanner h1{
		font-size: 200%;
	}
	.alertBanner a{
		font-size:100%;
	}
	
}
/******banner animation*********************/
.alertBanner {
     -webkit-animation: showTheAlert 2s; /* Chrome, Safari, Opera */
     animation: showTheAlert 2s;
 }
/* Chrome, Safari, Opera */
@-webkit-keyframes showTheAlert {
	 from {height: 0px;}
     to {height: 190px;} 
}

/* Standard syntax */
@keyframes showTheAlert {
	 from {height: 0px;}
     to {height: 190px;} 
 }

@media (min-width:420px){

	.alertBanner{
		text-align:right;
	}

	/* Chrome, Safari, Opera */
	@-webkit-keyframes showTheAlert {
		 from {height: 0px;}
	     to {height: 150px;} 
	}
	
	/* Standard syntax */
	@keyframes showTheAlert {
		 from {height: 0px;}
	     to {height: 150px;} 
	 }

}
 .alertBanner .alertBanner-Content {
     -webkit-animation: showTheAlertContent 2s; /* Chrome, Safari, Opera */
     animation: showTheAlertContent 2s;
}
/* Chrome, Safari, Opera */
@-webkit-keyframes showTheAlertContent {
	 from {margin-top: -60px;}
     to {margin-top: 0px;} 
}

/* Standard syntax */
@keyframes showTheAlertContent {
	 from {margin-top: -60px;}
     to {margin-top: 0px;} 
 }


/*************alerts localized on a specific site or pages(transit labour disruption alert)******/
@media (min-width:768px){
	#sidebar.noPadding{padding-right:0px;}
	#bramptonNotification + article .pageBanner{
	margin-left:-15px;}
}
.srch-maintop2{width:100%!important}
#CSR #bramptonNotification{
	margin-bottom:20px;
}
#bramptonNotification{	
	background-color:#8e0000;
	padding:15px;
	font-family:"Segoe UI",'Open Sans',"Helvetica Neue",Helvetica,Arial,sans-serif;
}
#mainContent #bramptonNotification{	
	margin-left:-15px;
	margin-right:-15px;
}

#bramptonNotification *{
	color:#fff
}
#bramptonNotification h1{
	font-size:160%;
	margin:0px;
	margin-bottom:10px;
	font-weight:600!important;
}
#bramptonNotification h1 .fa{color:#500000; margin-right:6px; }
#bramptonNotification a{
	color:#fff!important;
	font-weight:600;
	text-decoration:none;	
	font-size:110%;
}
#bramptonNotification a .fa{
	margin-left:6px;
	color:#500000; 
}
