﻿#alertbanner-container .alertbox
{
	background-image: none;
	background-repeat: no-repeat;
	padding-left: 0 !important;
	padding-right: 0 !important;
	padding-top:0px;
	margin: 0 !important;
	padding:1px 0;
	border: 0px;
	min-height:80px;
	min-width: 1030px;
	position: relative;
}
#alertbanner-container .alertbox .alertbanner-box-close {
	cursor: pointer;
	position:absolute;
	right:0;
	top:0;
	font-size: 20px;
	font-size: 2rem;
	padding: 20px;
	right: -20px;
	color: #fff;
}
#alertbanner-container .alertbox .alertbanner-box-close:hover {
	color: #dfe3e5;
}
#alertbanner-container .alertbox .alertbanner-icon-font {
	font-size: 3.4rem;
	padding: 15px;
	position: absolute;
	margin-left: -65px;
	top: 0;
	left: 0;
}
/* target mobile and full-width pages: */
.mode-mobile #alertbanner-container .alertbox .alertbanner-box-close,
.cocis-searchresultpage #alertbanner-container .alertbox .alertbanner-box-close,
.mode-fullwidth #alertbanner-container .alertbox .alertbanner-box-close {
	right: 0;
	padding: 20px;
}
/* hide close button for critical alert types */
#alertbanner-container .alertbox.critical .alertbanner-box-close {
	display: none;
}
.mode-mobile #alertbanner-container .alertbox .alertbanner-icon-font,
.cocis-searchresultpage #alertbanner-container .alertbox .alertbanner-icon-font,
.mode-fullwidth #alertbanner-container .alertbox .alertbanner-icon-font {
	margin-left: -55px;
}

#alertbanner-container .alertbox a
{
	text-decoration:underline !important;
}
#alertbanner-container .alertbox h2, #alertbanner-container .alertbox p
{
	margin-top:6px; 
	margin-bottom:6px;
}
#alertbanner-container .alertbox h2 
{
	font-size:24px !important;	
	letter-spacing: 0px;
	margin-top: 0px;
	margin-bottom: 0px;
	padding-top: 10px !important;
	padding-bottom: 0px !important;  /* should be 10px but there is a non-breaking space (&#8203;) being added after the h2 tag, probably via main css file if there is pseudo-content being added in or if Sharepoint is adding this in */
	font-weight: bold;
}
#alertbanner-container .alertbox p 
{
	font-size: 13px;
	margin-top: 0px;
	margin-bottom: 10px;
	padding-top: 0px !important;
	padding-bottom: 0px !important;
	line-height: 1.4em;
}

/* Alerts - Global (site-wide) */
#alertbanner-container .alertbox.critical
{
	background-color:#c3232c;
	color: white;
}
#alertbanner-container .alertbox.critical a
{
	color: white !important;  /* !important overrides cocis-styles.css */
}
#alertbanner-container .alertbox.critical .alertbanner-box
{
	/*background-image: url('/Scripts/AlertBanner/alert_warning_icon.png');*/
}
#alertbanner-container .alertbox.warning
{
	/*background-image: url('/Scripts/AlertBanner/black_alert_warning_icon.png');*/
	background-color: #fee600;
	color: black;
	-webkit-opacity: 0.90; -moz-opacity: 0.9; filter: alpha(opacity=90);
}
#alertbanner-container .alertbox.warning p 
{
	font-weight: normal;
}
#alertbanner-container .alertbox.warning a
{
	color: black !important;  /* !important overrides cocis-styles.css */
}
#alertbanner-container .alertbox.warning .alertbanner-box-close {
	color: black;
}
#alertbanner-container .alertbox.warning .alertbanner-box-close:hover {
	color: darkgray;
}

/* Alerts - General */
#alertbanner-container .alertbox.general
{
	background-color: #c4c4c4;  /* grey to match website */
	color: black;
}
#alertbanner-container .alertbox.general a
{
	color: black !important;  /* !important overrides cocis-styles.css */
}
#alertbanner-container .alertbox.general a:hover, .alertbox.general a:active {color:#900 !important;}

/* Alerts - CPS */
#alertbanner-container .alertbox.amber
{
	background-color: #ff7e00;  /* amber colour */
	color: black;
}
#alertbanner-container .alertbox.amber a
{
	color: black !important;  /* !important overrides cocis-styles.css */
}

/* Alerts - TRANSPORATION */
#alertbanner-container .alertbox.emergency-road-closure,
#alertbanner-container .alertbox.traffic-disruption,
#alertbanner-container .alertbox.transit-disruption,
#alertbanner-container .alertbox.snow-route-or-event
{
	background-color: #c4c4c4;  /* grey to match website */
	color: black;
}
#alertbanner-container .alertbox.emergency-road-closure a,
#alertbanner-container .alertbox.traffic-disruption a,
#alertbanner-container .alertbox.transit-disruption a,
#alertbanner-container .alertbox.snow-route-or-event a
{
	color: black !important;  /* !important overrides cocis-styles.css */
}

/* Alerts - CSPS */
#alertbanner-container .alertbox.facility-closure,
#alertbanner-container .alertbox.parks-closure
{
	background-color: #c4c4c4;  /* grey to match website */
	color: black;
}
#alertbanner-container .alertbox.facility-closure a,
#alertbanner-container .alertbox.parks-closure a
{
	color: black !important;  /* !important overrides cocis-styles.css */
}

/* Alerts - UEP */
#alertbanner-container .alertbox.health-advisory,
#alertbanner-container .alertbox.river-advisory
{
	background-color: #c4c4c4;  /* grey to match website */
	color: black;
}
#alertbanner-container .alertbox.health-advisory a,
#alertbanner-container .alertbox.river-advisory a
{
	color: black !important;  /* !important overrides cocis-styles.css */
}

/* Alerts - Corporate Services (CS) */
#alertbanner-container .alertbox.IT-disruption {
	background-color: #c4c4c4;  /* grey to match website */
	color: black;
}
#alertbanner-container .alertbox.IT-disruption a {
	color: black !important;  /* !important overrides cocis-styles.css */
}
#alertbanner-container .alertbox.interim-marketing {
	background-color: #214e63;  /* grey to match website */
	color: white;
}
#alertbanner-container .alertbox.interim-marketing a {
	color: white !important;  /* !important overrides cocis-styles.css */
}
#alertbanner-container .alertbox.interim-marketing .alertbanner-box {
	background-image: none !important;
}

#alertbanner-container .alertbox a { color:#FFF !important; font-weight:bold !important;}
#alertbanner-container .alertbox a:hover, .alertbox a:active {color:#e9b8b8 !important;}
#alertbanner-container .alertbox.warning a:hover, .alertbox.warning a:active {color:#bc1c38 !important;}

/* Alerts - General (General sub-site) */
#alertbanner-container .alertbox.flood-preparation {
	background-color:#e5fbdd;
    color: #427d42 !important; /* !important overrides cocis-styles.css */
    min-height: 40px;
	}
#alertbanner-container .alertbox.flood-preparation a, 
#alertbanner-container .alertbox.flood-preparation h2 {
     color: #427d42 !important; /* !important overrides cocis-styles.css */
    }
#alertbanner-container .alertbox.flood-preparation h2,
#alertbanner-container .alertbox.flood-preparation p {
	display: inline-block;
	line-height: 40px;
	}
#alertbanner-container .alertbox.flood-preparation h2 {
	padding-top: 0;
	font-size: 14px !important;
	}
#alertbanner-container .alertbox.flood-preparation p {
    margin-left: 1.5em;
    margin-bottom: 0;
	}
#alertbanner-container .alertbox.flood-preparation .alertbanner-box {
	/*background-image: url('/Scripts/AlertBanner/alert_info_icon.png') !important;
	background-position: 0 1.5rem;*/
	}
#alertbanner-container .alertbox.flood-preparation .alertbanner-box {
	/*background-image: url('/Scripts/AlertBanner/alert_info_icon_30x30.png') !important;*/
	}
#alertbanner-container .alertbox.flood-preparation a:hover, 
#alertbanner-container .alertbox.flood-preparation a:active {
	color: #666 !important;
	text-decoration:none;
	}
#alertbanner-container .alertbox.flood-preparation .alertbanner-box-contents {
    margin-left: 45px;
    line-height: 40px;
    padding-top: 0;
    display: block;
	}

/* Alerts - PDA */
#alertbanner-container .alertbox.planning
{
	background-color: #c4c4c4;  /* grey to match website */
	color: black;
}
#alertbanner-container .alertbox.planning a
{
	color: black !important;  /* !important overrides cocis-styles.css */
}
#alertbanner-container .alertbox.assessment {
       background-color:#61B329 !important;
       color:white;
}
#alertbanner-container .alertbox.assessment .alertbanner-box-close {
       background-color:#000;
}
#alertbanner-container .alertbox.assessment .alertbanner-box {
       background-image:none !important;
       padding-bottom:10px;
}
#alertbanner-container .alertbox.assessment .alertbanner-box-contents {
       margin-left:35px !important;
       line-height:26px;
       color:#000;
}
#alertbanner-container .alertbox.assessment .alertbanner-box-contents a {
       color:#000;
}
#alertbanner-container .alertbox.assessment a:hover, .alertbox.assessment a:active {
       color:#fff !important;     
}



@media
only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (   min--moz-device-pixel-ratio: 2),
only screen and (     -o-min-device-pixel-ratio: 2/1),
only screen and (        min-device-pixel-ratio: 2),
only screen and (                min-resolution: 192dpi),
only screen and (                min-resolution: 2dppx) { 
	#alertbanner-container .alertbox.critical {
		/*background-image: url('alert_warning_icon@2x.png');
		background-repeat:no-repeat;
		background-size: 75px 62px;*/
	}
}

/* regular pages - desktop view */
#cocis-maincontent #alertbanner-container .alertbox:first-child
{
	margin-top:25px !important;
}

/* target mobile and full-width pages: */
.mode-mobile #alertbanner-container .alertbox,
.cocis-searchresultpage #alertbanner-container .alertbox,
.mode-fullwidth #alertbanner-container .alertbox
{
	width: auto;
	min-width: 0px;
}
#alertbanner-container .alertbox p, 
#alertbanner-container .alertbox h2
{
	font-size:8pt;
	margin-top:4px; margin-bottom:4px;
}
#alertbanner-container .alertbanner-box 
{
	width: 990px;
	/*background-image: url('/Scripts/AlertBanner/black_alert_warning_icon.png');
	background-position: 0 15px;
	background-repeat: no-repeat;*/
	height: 100%;
	margin-left: auto;
	margin-right: auto;
}
/* target mobile and full-width pages: */
.mode-mobile #alertbanner-container .alertbanner-box,
.cocis-searchresultpage #alertbanner-container .alertbanner-box,
.mode-fullwidth #alertbanner-container .alertbanner-box 
{
	width: auto;
	background-position: 10px 15px;
}
#alertbanner-container .alertbanner-box-contents 
{
	margin-left: 50px;
	padding-top: 3px;
	position: relative;
}
/* target mobile and full-width pages: */
.mode-mobile #alertbanner-container .alertbanner-box-contents,
.cocis-searchresultpage #alertbanner-container .alertbanner-box-contents,
.mode-fullwidth #alertbanner-container .alertbanner-box-contents 
{
	padding-right: 50px;
	padding-left: 5px;
}