@charset "utf-8";
/* CSS Document */

/** rebuild animation **/

.rebuild-heading{
position:relative;
/*background:#337ab7;*/
color:#006699;
font-weight:bold;
font-size:1.2em;
width:100%;
overflow:hidden;
}

@keyframes slidein-top {
        0% {
            transform: translateY(-100%);

        }
        100% {
            transform: translateY(0);
        }
    }
    
.top-down {  
        animation: 2s slidein-top;
        overflow: hidden;
        margin-top:0;
        margin-bottom:0.5em;
    }



.pulse{
animation:pulse-animation 2s 3;
animation-delay: 1s;
}

@keyframes pulse-animation{
0%{
box-shadow:0 0 0 1px rgba(136, 181, 221, 0.1)
}
20%{
box-shadow:0 0 1px 2px rgba(136, 181, 221, 0.2)
}
40%{
box-shadow:0 0 2px 3px rgba(136, 181, 221, 0.3)
}
60%{
box-shadow:0 0 5px 6px rgba(136, 181, 221, 0.7)
}
80%{
box-shadow:0 0 2px 3px rgba(136, 181, 221, 0.3)
}

100%{
box-shadow:0 0 1px 2px rgba(136, 181, 221, 0.1)
}

}

/** end rebuild animation **/


.alert-box-legacy{
margin-left:4px;
text-align:left;
padding-left:5px;
padding-right:4px;
margin-top:10px;
}

.alert-box{
text-align:left;
width:100%;
/*margin-top:1.5em;*/ /*not necessary when alert placed below the page title */
}



.outer-div{
display:table;
margin-bottom:1em;
color: #fff;
background-color:#cc0000;
border-radius: 4px;
box-shadow: 1px 2px 2px 1px #ccc;
border:1px solid #990000;
}

.special-outer-div{
display:table;
margin-bottom:1em; /*necessary when alert placed below page title so there is space above the carousel; if alert is above page title then this can be commented*/
/*margin-top:-1px;*/
color: #000;
background-color:#eff7fe;
border-radius: 4px;
box-shadow: 1px 2px 3px 0 #ccc;
/*border:1px solid #337ab7;*/
/*outline: 1px solid #006699;*/
width:100%;
overflow:hidden;
position:relative;
z-index:0; /* so that parent div does not overlay the text and close button */
}

/* For rounded border on alerts without a sub-pixel gap in Edge and Chrome; requires relative positioning on parent div, of course */
.special-outer-div::after{
content: "";
border: 1px solid #006699;
position:absolute;
left:0;
right:0;
bottom:0;
top:0;
border-radius:4px;
z-index:0; /* so that parent div does not overlay the text and close button */
}

.alert-icon{
display:table-cell;
width:50px;
background-color:#990000;
text-align:center;
vertical-align:middle;
color:#ffff99;
font-size:36px;
font-weight: normal;
padding-bottom:5px;
border-top-left-radius:4px;
border-bottom-left-radius:4px;
/*border-right:1px solid rgba(59, 84, 24,0.95);*/
}

.special-alert-icon{
display:table-cell;
width:70px;
background-color:#006699;
text-align:center;
vertical-align:middle;
color:#ffffff;
font-size:54px;
font-weight: normal;
padding:10px 0 10px 0;
border-top-left-radius:4px;
border-bottom-left-radius:4px;
/*border-right:1px solid rgba(59, 84, 24,0.95);*/
}


.alert-icon-arrow-container{
display:table-cell;
width:10px;
vertical-align:middle;
text-align:left;
}

.arrow-right {
  width: 0; 
  height: 0; 
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-left: 10px solid #990000;
}

.special-arrow-right {
  width: 0; 
  height: 0; 
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-left: 10px solid #006699;
}


.alert-message{
display:table-cell;
font-family:'TransportNew',Helvetica,Arial,sans-serif;
padding:10px;
position:relative;
z-index:5; /* bring close button to foreground so clickable */
/*border-bottom:1px solid #006699;
border-top:1px solid #006699;*/
}

.alert-message.dark{
background:#092940;
color:#fff;
}

.alert-message.dark a:link, .alert-message.dark a:visited{
color:#fff !important;
}

.alert-message.dark a:hover{
text-decoration:none;
}


.alert-message p{
margin-top:0 !important;
padding-top:0 !important;
margin-bottom:0 !important;
padding-bottom:0 !important;
font-size:1em !important;
margin:0 !important;
line-height: 1.50em !important;
}

.alert-message p.alert-heading{
	margin-bottom:0.75em !important;
    font-size:1.1em !important;
	border-bottom:1px solid #fff;
}

.special-outer-div > .alert-message p.alert-heading{
	margin-bottom:0.75em !important;
    font-size:1.1em !important;
	border-bottom:1px solid #006699;
	color:#006699 !important;
}


.alert-message ol{
	margin:0.7em 1em 0 1.5em !important;
}

.alert-message ol li{
margin-bottom:0 !important;
line-height:1.5 !important;
padding-bottom:0 !important;	
}

.alert-close{
display:table-cell;
width:50px;
vertical-align:middle;
border-top-right-radius:4px;
border-bottom-right-radius:4px;
/*border-left:1px solid rgba(255,255,255,0.75);*/ 
border-left:1px solid #ffb3b3;
text-align: center;
background-color:#990000;
}

.special-alert-close{
display:table-cell;
width:50px;
vertical-align:middle;
border-top-right-radius:4px;
border-bottom-right-radius:4px;
/*border-left:1px solid rgba(255,255,255,0.75);*/ 
/*border-left:1px solid #fff;*/
text-align: center;
background-color:#006699;
position:relative;
z-index:5; /* bring close button to foreground so clickable */
}

a.close-link{
padding:2px 6px !important;
font-weight:bold !important;
text-align:center !important;
color:#006699 !important;
/*padding-top:0 !important;*/
text-decoration:none !important;
background-color:#fff !important;
border-radius:100%;
font-size:16px;
border:1px solid #006699;
box-shadow: 0 0 1px 1px #fff;
}

a.close-link:hover{
color:#092940 !important;
background-color:#eff7fe !important;
border:2px solid #092940;
font-weight: 700 !important;
box-shadow: 0 0 1px 1px #eee;
}

#covid-alert-wrapper a {
    color: #fff !important;
}

#covid-alert-wrapper a:hover {
    color: #fff;
    text-decoration: none !important;
	background-color:transparent !important;
}

@media all and (max-width:767px){
.special-alert-icon{
    width: 40px;
    font-size: 30px;
    vertical-align: top;
    padding-top: 0.5em;
}

.special-alert-close, .alert-close {
    width: 40px;
    vertical-align: top;
    padding-top: 16px;
}
}

@media all and (max-width:450px){

/* reduce alert-message padding and icon background widths on smaller devices */

	.alert-message{
	padding:6px 6px 8px 6px;
	}
	
	.alert-icon{
	width:40px;
	}
/* changed breakpoint to 767 for this rule
	.special-alert-close, .alert-close{
		width:24px;
	}
*/
}