.previewLabel, #previewWrap {
    display:none;
}
#previewWrap {
    transition:background-color 200ms;
    position:relative;
    min-height:80px;
}
.previewLabel {
    font-style:italic;
    font-size:16px;
    margin-bottom:5px;
}
td.typeSel {
    border-bottom: 10px solid #fff;
    padding: 5px 10px 5px 5px;
}
td.typeSel input, td.typeSel .alertCustom {
    display:block;
    float:left;
    margin-right:10px;
}
.type-info {
    background-color:rgba(0,84,142,0.2);
    background-color:rgba(204,221,232,1);
}
.type-info .alertHeadline, .type-info .previewIcon:before, .type-info .alertIcon {
    color:rgba(0,84,142,1);
}
.type-info .closeBottom {
    background-color:rgba(0,84,142,0.7);
}
.type-okay {
    background-color:rgba(88,89,91,0.2);
    background-color:rgba(222,222,222,1);
}
.type-okay .alertHeadline, .type-okay .previewIcon:before, .type-okay .alertIcon {
    color:rgba(88,89,91,1);
}
.type-okay .closeBottom {
    background-color:rgba(88,89,91,0.7);
}
.type-caution {
    background-color:rgba(235,173,48,0.2);
    background-color:rgba(249,233,212,1);
}
.type-caution .alertHeadline, .type-caution .previewIcon:before, .type-caution .alertIcon {
    color:rgba(225,143,38,1);
}
.type-caution .closeBottom {
    background-color:rgba(225,143,38,0.7);
}
.type-alert {
    background-color:rgba(239,62,66,0.2);
    background-color:rgba(252,216,217,1);
}
.type-alert .alertHeadline, .type-alert .previewIcon:before, .type-alert .alertIcon {
    color:rgba(239,62,66,1);
}
.type-alert .closeBottom {
    background-color:rgba(239,62,66,0.7);
}
.alertItem {
    z-index: 100;
    box-shadow: 2px 2px 4px rgba(0,0,0,0.2);
    width: calc(100% + 800px);
    margin: 0 -400px;
    padding: 0 400px;
    display:none;
    position:relative;
}
.alertItem.pubNow {
}
.alertHeadline {
    font-family: urw-din, Arial, sans-serif;
    font-weight:bold;
    font-size:24px;
    display:block;
    transition:color 200ms;
}

.alertCustom .alertHeadline {
    font-size:18px;
    margin-top:0;
}
.alertDetails {
    font-size:16px;
    display:block;
    color:#58595b;
}
.alertDetails p {
    margin:5px 0;
}
.alertPreview, .alertContent {
    padding:10px 45px 20px 75px;
    position:relative;
}
.alertContent {
    padding-left:200px;
}
.previewIcon, .alertIcon {
    position:absolute;
    height:100%;
    top:10px;
    left:15px;
}
.alertIcon {
    top:15px;
    left:130px;
}
.previewIcon:before {
    font-family:'Material Icons';
    content:'\e002';
    font-size:3.5em;
}
.alertPubTimes {
    display:none;
}
.alertHeadline .alertClose {
}
.alertHeadline i {
    float: right;
    font-size: 1em;
    font-weight: bold;
    padding:10px;
    border-radius:50%;
    color:#58595b;
}
.alertHeadline i:hover {
    cursor:pointer;
    color:inherit;
    transition:color 300ms;
}
.previewIcon, .alertIcon, .alertHeadline {
    margin-top:10px;
}
.alertClose.closeX {
    position: absolute;
    right: -10px;
    top: 5px;
}
.closeBottom {
    text-align:center;
    padding:6px 0 7px;
    margin:0 -15px;
    display:none;
    color:#fff;
    font-weight:bold;
}
.closeBottom i {
    font-size: 1.2em;
    margin-top: -3px;
    font-weight:bold;
}
@media screen and (max-width:991px){
    .alertContent {
        padding-left:75px;
    }
    .alertIcon {
        left:10px;
    }
    .closeBottom {
        display:block;
    }
}
@media screen and (max-width:767px){
    .alertItem {
        box-shadow:none;
        border-bottom: 2px solid #00548e;
    }
    .alertIcon {
        margin-top: 0;
    }
    .alertContent {
        padding: 10px 30px 10px 50px;
    }
    .alertHeadline {
        font-size:22px;
        margin:5px 0 10px;
    }
    .alertHeadline i {
        padding-top:15px;
    }
    .alertIcon {
        left:0;
        font-size:12px;
    }

}