@charset "UTF-8";
/* Web Solutions 4.0 Compatible */

body.slideNav {overflow: hidden;}

/* HEADINGS ------------------------------ */
h1 {font-size:1.5em;}
h2, .content * h1{font-size:1.45em}
h3, .content * h2{font-size:1.3em}
h4, th{font-size:1.2em}
h5 {font-size:1.1em}
h6 {font-size:1.0em}
p.intro {font-size: 1.125em;}


/* HEADER ------------------------------ */
header{ background:#fff; position: relative; z-index: 10;}
header:before{content: "";opacity: 0; z-index: 3;background-color: #000;display: block;position: fixed;left:100vw;top:0;width:100vw;height:100vh;transition:left 0ms ease 200ms, opacity 200ms ease}
        body.slideNav>header:before{left:0;opacity: .25;transition:left 0ms ease 0ms, opacity 200ms ease}
header #brand {max-width: 10.1875rem; float: left; padding: 0.5em; display: block;}
header #brand img {display: block; max-width: 100%; height: auto}
#navContainer{position: fixed; z-index:20; left: 100%;top:0;bottom:0;width: 85%;max-height: 100vh;background-color:#000;z-index:4;-webkit-transition: left 200ms ease;transition: left 200ms ease;overflow:auto;-webkit-overflow-scrolling: touch;}
        body.slideNav #navContainer{left: 15%;}
#navContainer nav{display: inline}
#navContainer ul{display: block;width: 100%;margin: 0;padding-left: 0}
#navContainer li {display:block;width: 100%; position: relative; border-top: 1px solid rgba(255,255,255,0.125)}
#navContainer li li {border: 0}
#navContainer a, #navContainer button.menu{color:#fff;line-height:2.75em;padding:0 1rem;display:block;width: 100%}
#navContainer button.menu {
        background: transparent;
        text-align: left;
        font-weight: 400;
}
#navContainer button.menu::before {
  background: url('/images/icons/close.svg') no-repeat left center / contain;
  content: '';
  line-height: 1;
  margin: 0 .25em 0 0;
  padding-right: .75em;
}
#navContainer a:hover,#navContainer .menu:hover,
#navContainer li.on a{background-color:#056D87;color: #fff}
#navContainer li.open{background-color: #000}
#navContainer li>button{display: block; background: rgba(255,255,255,0.5); position: absolute;right: 0;top: 0;width:2.75em;height: 2.75em;}
#navContainer li>button:before{content: ""; display: block; width: 50%; height: 0.0625rem; background-color: #000; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%) rotate(90deg); transform-origin: center center;}
#navContainer li>button:after{content: ""; display: block; width: 50%; height: 0.0625rem; background-color: #000; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); transform-origin: center center;}
#navContainer li.open > button:before {transform: translate(-50%, -50%)rotate(0deg);}
#navContainer li > button::before { -webkit-transition: -webkit-transform .2s ease; transition: -webkit-transform .2s ease; transition: transform .2s ease; transition: transform .2s ease, -webkit-transform .2s ease;}
#navContainer .menu-item-has-children > div {
	display: grid;
	grid-template-rows: 0fr;
	transition: var(--ws-transition);
}

#navContainer .menu-item-has-children.open > div {
	grid-template-rows: 1fr;
}
#navContainer ul ul {font-size: .8em; overflow: hidden;}
#navContainer ul ul a {padding-left: 2rem}
#navContainer ul ul li.on a {background-color: #064C5E}
#navContainer #ancillary {clear:both;display: block;}
#navContainer #ancillary .search {clear:both; display: block; overflow: auto; padding:1rem; border-top: 1px solid rgba(255,255,255,0.125)}
#navContainer #ancillary .search input {float: left;}
#navContainer #ancillary .search input[type="text"] {width: calc(100% - 5rem)}
#navContainer #ancillary .search input[type="submit"] {width: 5rem;}
/* search */
header .search {position: relative; width: 45%; float: right; background:#ECECEC; height: 3.375rem; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: center; -ms-flex-line-pack: center; align-content: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center;}
header .search input {font-family: 'Merriweather', serif; border-radius:0; font-style: normal; transition:ease all 200ms; padding: 0 3.375rem 0 1em; width:100%; height:3.375rem; border:0; background:none; box-shadow:none; font-size: 0.875rem; opacity:1; color: #056D87;}
header .search input:focus {background: none; box-shadow: inset 0 -4px 0px 0px #056D87}
        header .search ::-webkit-input-placeholder {font-family: 'Merriweather', serif; font-style:italic; font-size: 0.875rem; opacity:1; color: #056D87;}
        header .search ::-moz-placeholder {font-family: 'Merriweather', serif; font-style:italic; font-size: 0.875rem; opacity:1; color: #056D87;}
        header .search :-ms-input-placeholder {font-family: 'Merriweather', serif; font-style:italic; font-size: 0.875rem; opacity:1; color: #056D87;}
        header .search :-moz-placeholder {font-family: 'Merriweather', serif; font-style:italic; font-size: 0.875rem; opacity:1; color: #056D87;}
header .search button {height: 3.375rem; width: 3.375rem; position:absolute; right:0; top:0; background: url(/images/search.svg) no-repeat center}
/* mobilenav */
#mobilenav{background-color: #056D87;border-bottom: 1px solid rgba(255,255,255,0.125); float: left;width: 100%;text-align: center; display: -ms-flexbox; display: -webkit-box; display: flex; -ms-flex-direction: row; -webkit-box-orient: horizontal; -webkit-box-direction: normal; flex-direction: row; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-pack: center; -webkit-box-pack: center; justify-content: center; -ms-flex-line-pack: center; align-content: center; -ms-flex-align: center; -webkit-box-align: center; align-items: center;}
#mobilenav a, #mobilenav button{color: #fff;line-height: 2.5em; -ms-flex-order: 0; -webkit-box-ordinal-group: 1; order: 0; -ms-flex: 1 1 auto; -webkit-box-flex: 1; flex: 1 1 auto; -webkit-align-self: auto; -ms-flex-item-align: auto; align-self: auto;}
#mobilenav button {
	background: transparent;
	border-radius: 0;
	margin: 0;
	padding: 0;
	text-transform: none;
}

#mobilenav button::after {
  aspect-ratio: 1;
  background: #FFF;
  content: '';
  display: inline-block;
  height: 1em;
  margin: 0 0 0 .25em;
  mask:  url('/images/icons/bars.svg') no-repeat center / contain;
	position: relative;
	top: .1875em;
}

#mobilenav *+* {border-left: 1px solid rgba(255,255,255,0.125)}
/* hamburger */
.hamburger{height: 3em;width: 3em; transform: translateX(calc(100% + 3px)); pointer-events:none; display: block;position: fixed;padding:0.75em; right: 3px;top:3px;z-index:3;background-color: rgba(255,255,255,0.25);}
.hamburger path {fill:#000;font-size: 1.75em;}
.hamburger svg {pointer-events: none;}
.hamburger.on{transform: translateX(0); pointer-events: all}


.content .highlight {margin: 1em 0;}

/* MAIN ------------------------------ */
.twoCol, .threeCol, .resCol{
-webkit-column-rule:1px outset rgba(0,0,0,.15);
        column-rule:1px outset rgba(0,0,0,.15);
-webkit-columns: auto;
        columns: auto;
-webkit-column-width: 13em;
        column-width: 13em;}

.content ul li {padding-left: 1.5em;}

.formTable, .formTable table{width:100%;display: block}
.formTable tbody{display: block}
.formTable tr{display: block}
.formTable td{display: block;width:100%;padding: 0}
.formTable input[type="text"], .formTable input[type="password"], .formTable input[type="tel"], .formTable input[type="number"], .formTable input[type="email"], .formTable input[type="url"], .formTable textarea{margin-bottom:1em}
.formTable table td + td {padding-left: 0 !important;}

.photoright{margin:0 0 .75em 1em;}
.photoleft{margin:0 1em .75em 0;}
.content .aligned-images .photoright {margin:0 0 .75em 1%;}
.content .aligned-images .photoleft {margin:0 1% .75em 0;}

#content {position: relative; z-index: 1;}

#hero {padding: 1.875rem 1em 4.375rem; background: url(/images/home/rotator-images/resting.jpg) no-repeat center / cover}
#hero:before {height: 100%; background: #052836; opacity: 0.35}
#hero .wrap {width: 100%; max-width: 100%; text-align: center; position: relative;}
#hero .wrap h1 {line-height: 1.25em; margin-bottom: 1.25em; font-size: 1.75rem;}
#hero .wrap h1 span {font-size: 1.125rem; font-weight:400}
#hero .wrap h1 span:after {height: 0.1875rem; margin:0.25em auto 0.5em}
#hero .wrap .hover-buttons a {background:rgba(0, 21, 31, 0.71); color:#fff; padding: 0.75em 1em; display: block; margin-bottom: 0.25em}

#culture-of-safety {position: relative; overflow:hidden; background: url(/images/home/culture-of-safety-bg.jpg) no-repeat center top / cover; padding: 1.875rem 1em 4.375rem}
#culture-of-safety .wrap {padding: 2rem 1rem}
#culture-of-safety h2:before {content: ""; margin:0 auto 0.5em; display: block; height: 3.25rem; background: url(/images/home/icon-life-vest.svg) no-repeat center}
#culture-of-safety p {max-width: 32.5625rem; margin:0 auto}
#culture-of-safety .image {width: 100%; height:12rem; position: relative;}
#culture-of-safety .image-1 {background: url(/images/home/culture-of-safety-img-1.jpg) no-repeat center / cover}
#culture-of-safety .image-2 {background: url(/images/home/culture-of-safety-img-2.jpg) no-repeat center / cover}
#culture-of-safety .image span {background-color: rgba(266, 266, 266, .85); bottom:0; color: #000; left:0; line-height: 1; padding:.5em 1em; position: absolute;}
#culture-of-safety .image-2 span {left:auto; right:0;}

#welcome-message {padding: 2em 1em 0; background: #F7F7F7 url(/images/home/map.jpg) no-repeat center / bottom}
#welcome-message .wrap {max-width: 62.5rem; margin:0 auto}
#welcome-message h2 {position: relative;}
#welcome-message h2:before {content: ""; display: block; margin: 0 auto 0.5em; width: 5.25rem; height:2.8125rem; background: url(/images/home/icon-tug-boat.svg) no-repeat center left}
#welcome-message .welcome-text {max-width:100%; margin-bottom:2em}
#welcome-message #map {width:100%; margin: 0 auto; background:none; height: auto; margin:0 auto}
#welcome-message #map a {display: block; padding-left: 1.85em; border-radius:4px; position: relative; font-weight: 400;font-size: 0.875rem;color: #4A4A4A;}
#welcome-message #map a:before {position: absolute; left:0.5em; top:0.4375rem; content: ""; display: block; width:1em; height: 1em; background: url(/images/port-list-dot.svg) no-repeat center}
#welcome-message #map a.lng:before {background: url(/images/port-list-triangle.svg) no-repeat center}

#infographic {position: relative;background:#F7F7F7; padding: 2em 0 3.5rem}
#infographic:before {content:""; display: block; position:absolute; z-index: 1; top:0; width: 100%; height:12.875rem; background-image: linear-gradient(180deg, #F7F7F7 33%, #CDCDCD 100%);}
#infographic:after {content:""; display: block; position:absolute; z-index: 1; bottom:0; width: 100%; height: calc(100% - 12.875rem); background-image: linear-gradient(180deg, #1B4C6A 5%, #0D2C3F 91%);}
#infographic .wrap {text-align: center; z-index: 3; overflow:visible}
#infographic .graphic {position: relative;}
#infographic .graphic img {max-width: 18rem; width:100%; height: auto; z-index: 3; position:relative;  margin:0 auto; display: block}
#infographic .graphic .wake {position: absolute;}
#infographic .graphic .front-wave {animation: jitter 0.75s linear infinite; bottom: -0.375rem; z-index: 4; right: calc(50% - 7.625rem); width: 17.75rem; height: 3rem; background: url(/images/home/infographic-wave-front.svg) no-repeat bottom left / contain;}
#infographic .graphic .middle-wave,
#infographic .graphic .back-wave {display: none}
#infographic .stats {position: relative; z-index:2;}
#infographic .stats li {font-size: 1.5em; max-width:16.25rem; line-height: 1.125em; color:#fff; border-radius: 4px; border: 1px solid rgba(255,255,255,0.25); margin: 0 auto 0.5em; padding:0.75em}
#infographic .stats li:before {margin-bottom: 0.75em}
#infographic .stats li span {color: #C9D5DC}
#infographic .stats li.employees:before {background-image: url(/images/home/infographic-icon-employees-white.svg)}
#infographic .stats li.ports:before {background-image: url(/images/home/infographic-icon-pin-white.svg)}
#infographic .stats li.years:before {background-image: url(/images/home/infographic-icon-timeline-white.svg)}
#infographic .stats li.assists:before {background-image: url(/images/home/infographic-icon-cleat-white.svg)}
#infographic .stats li.safety:before {background-image: url(/images/home/infographic-icon-safety-white.svg)}
#infographic .waves {z-index: 2;}
#infographic .waves.blue {bottom: calc(100% - 12.875rem)}

#social-feed {text-align:center; padding:2rem 1em 3rem}
#careers .wrap {padding: 3em 1em 6em}

.home h2 {font-size: 1.5rem; position: relative; z-index: 2; margin-bottom:0.75em; font-weight:900; text-align: center;}
.home h2:after {content: ""; margin:0.5em auto; display: block; width:4.625rem; height: 0.1875rem; background: #952C50}
.home #infographic h2:after {display: none;}

.interior main {min-height: 25rem; overflow: auto; padding-bottom: 5em; background-size: auto 10em}
.interior main > .wrap {overflow: auto; padding-top:1em}
.interior main>div>aside {padding: 0 1em}
main > .wrap #content {padding: 0 1em}
.content ul li::before {left: 0.25em}
#sidenav {padding-top: 1em; margin-top: 2em; border-top:  1px solid #C5CED2}

.pageHeader {padding: 1.875rem 1em 3rem}
.pageHeader p {line-height: 1.5em}
blockquote {text-align: center}
.waves {height:2.5rem; overflow: hidden; transform: none;}
.waves svg {transform: none; bottom:auto; top:0}

.content-nav {overflow: auto; padding-bottom: 1em; width:100%; float:left;}
.fleet-toggle, .display-toggle {text-align:center; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: center; -ms-flex-line-pack: center; align-content: center; -webkit-align-items: stretch; -ms-flex-align: stretch; align-items: stretch;}
.fleet-toggle {float: left; width:100%;}
.fleet-toggle > .button {width: 49%; order: 2}
.fleet-toggle > *+* {margin-left: 0.3125rem}
.fleet-toggle > .download-summary {margin-left: 0; width:100%; background: url(/images/pdf.svg) no-repeat calc(50% - 114px) center}
.display-toggle {float: right; width: 100%; clear: both; margin-top: 1em;}
.display-toggle * {margin-left: 0.3125rem}
.port-page .fleet-location {margin-top: 3em; padding-top: 3em;}
.fleet-location h2 {font-size: 1.4375rem; margin-bottom: 1em; font-weight:700}
.fleet-location .display-toggle {}
.fleet-location.grid li {text-align:center; margin:0 auto 2em}
.fleet-location.grid li span {display: block; text-align:center}
.fleet-location.grid li .vessel {position: relative;width:10em; height:10em; margin:0 auto 0.75em; background-size: cover; background-position:center}
.fleet-location.grid li .vessel-name {display: block; font-weight: 700; margin-bottom: 0.25em;font-size: 1rem;color: #333333;line-height: 1.1875rem;}
.fleet-location.grid li .vessel-type {display: block; font-weight: 400;font-size: 0.875rem;color: #4A4A4A;line-height: 1.1875rem;}
.fleet-location.grid li .vessel-hp {display: block; font-style: italic;font-weight:300;font-size: 0.875rem;color: #4A4A4A;line-height: 1.1875rem;}
.fleet-location.grid ul,
.fleet-location.list ul {overflow: auto; width:100%; float: left; clear: both; margin: 2em auto}
.fleet-location.list li {margin-bottom: 1em; line-height: 1em; min-height: 3em; position:relative; padding: 0.75em 0 0 3.5rem; display: block;text-align: left; }
        .port-page .fleet-location.list li {width:100%}
.fleet-location.list li .vessel {display: block; position:absolute; top:0; left:0; width:2.8125rem; padding-bottom: 2.8125rem; background-size: cover; background-position:center}
.fleet-location.list li .vessel-name {display: inline-block; margin-right: 0.25em; vertical-align:middle; font-weight: 700; font-size: 1rem;color: #333333;line-height: 1.1875rem;}
.fleet-location.list li .vessel-type {display: inline-block; margin-right: 0.25em; vertical-align:middle; font-weight: 400; font-size: 0.875rem;color: #4A4A4A;line-height: 1.1875rem;}
.fleet-location.list li .vessel-hp {display: inline-block; margin-right: 0.25em; vertical-align:middle; font-style: italic; font-weight:300;font-size: 0.875rem;color: #4A4A4A;line-height: 1.1875rem;}

.fleet-location.grid li .vessel .credit {color: #FFF;font-size: .6em;position: absolute;width: 100%;bottom: .375em;left: 50%;line-height: 1.4;text-shadow: 0 1px 1px rgba(0,0,0,.25);-webkit-transform: translateX(-50%);-moz-transform: translateX(-50%);transform: translateX(-50%);}


.ports .all-ports-map {height: 12.5rem; margin-bottom: 2.5em}
.ports h2 {font-size: 1.25rem;}
.ports:not(.port-page) h2 {margin-bottom: 1.5em; font-size: 1.25em; padding-bottom: 0.35em; border-bottom: 1px solid rgba(0,46,67,0.2)}
.ports h2 span {font-weight: 300; font-style: italic;font-size: 0.875rem;}
.ports .port-list {position: relative;}
.ports .port-list .legend {background: #E7E7E7; text-align: center; padding: 1em}

.port-page main > .port-map {height: 20.5rem}
.port-page main > .port-map:before {height: 6.25rem;}
.port-page main > .port-map:after {height: 6rem;}
.port-page main > .port-map .gm-bundled-control-on-bottom {bottom:15px !important}
.port-page main > .port-map .gm-style .gm-style-iw-c {padding:12px !important}
.port-page main > .port-map iframe + div {display: none}

.port-page h1 {font-size: 1.5rem}
.port-page .port-top .contact-links > a {font-size: 1rem;font-family: 'Roboto', sans-serif;color: #fff;font-weight: 700;border: 0;padding: 1em 1.5em;line-height: 1em;cursor: pointer;background: #952C50;border-radius: 3px;display: block;text-align: center;margin: 1em 0 0.5em;}
.port-page .port-top .contact-links > a span {color:rgba(255,255,255,0.75)}
.port-page .port-top .contact-links > span {display:none}
.port-page .port-info {margin-bottom: 1.5em}
.port-page .port-info .contact-links .tel {display: none}
.port-page .contact-port .email-port label {font-size: 0.8125rem;display: block; line-height: 1.5em; color: #808080;}
.port-page .contact-port .email-port input:not([type="submit"]) {height:2.375rem; padding: 0 0.5em; background: #FFFFFF;border: 1px solid #E0E0E0;border-radius: 2px;}
.port-page .contact-port .email-port textarea {background: #FFFFFF;border: 1px solid #E0E0E0;border-radius: 2px;}
.port-page .contact-port .email-port input[type="submit"] {background: #952C50; padding:0; width:7rem; height: 2.6875rem}
.port-page .contact-port .email-port input[type="submit"]:hover {background: #056D87}

.emergency-page #emergency-dashboard .top > * {padding: 1.5em 1em; margin-bottom:1em; background: #FFFFFF; border: 1px solid #C5CED2;border-radius: 7px;}
.emergency-page #emergency-dashboard h2 {font-weight: 700; margin-bottom:0.75em; position:relative; font-size: 1.125rem;color: #952C50;}
        .emergency-page #emergency-dashboard h2.icon:before {content:""; position: relative; top:0.0625rem; display: inline-block;width: 1rem;height: 1rem;margin-right: 0.25em}
        .emergency-page #emergency-dashboard h2.icon.phone:before {background: url(/images/emergency-dashboard/icon-phone.svg) no-repeat center / contain}
        .emergency-page #emergency-dashboard h2.icon.info:before {background: url(/images/emergency-dashboard/icon-info.svg) no-repeat center / contain}
        .emergency-page #emergency-dashboard h2.icon.message:before {background: url(/images/emergency-dashboard/icon-message.svg) no-repeat center / contain}
.emergency-page #emergency-dashboard .top #sidebar > ul {padding-bottom: 1em; margin-bottom:1em}
.emergency-page #emergency-dashboard .top #sidebar > ul > li {font-size: 0.875em;}
.emergency-page #emergency-dashboard .top #sidebar > ul > li.help-desk {font-weight: 500}
.emergency-page #emergency-dashboard .top .text-alerts {font-size: 0.875em}
.emergency-page #emergency-dashboard .top input,
.emergency-page #emergency-dashboard .top button {font-size: 1em}
.emergency-page #emergency-dashboard .top .text-alerts input {width: calc(100% - 100px); max-width: 100%}
.emergency-page #emergency-dashboard h3 {font-weight: 700; margin-bottom: 0.5em; font-size: 1rem;color: #000000;}
.emergency-page #emergency-dashboard .message-board {margin-top: 2.1875rem;}
.emergency-page #emergency-dashboard .message-board .current-messages {margin-top: 1em; width:100%}
.emergency-page #emergency-dashboard .current-messages li .message-title .byline {display: block; margin-left: 0}
.emergency-page #emergency-dashboard .message-board .mobileOnly button {display: block; font-size:0.875em; width:100%; padding: 0 1em; height: 2.625rem; line-height: 2.625rem;}
.emergency-page #emergency-dashboard .current-messages li {margin-left:2.75rem;}
.emergency-page #emergency-dashboard .current-messages li::before {width:1.5rem; height:1.5rem; left:-2.75rem; top:0.6875rem}
.emergency-page #emergency-dashboard .current-messages li .message-title::after,
.emergency-page #emergency-dashboard .current-messages li .message-title::before {top:1.5rem}
.emergency-page #emergency-dashboard .dashboard-nav {transform: translateY(100%); opacity:0; border: 1px solid rgba(255,255,255,0.25);z-index:1; transition: ease all 200ms; pointer-events: none; position:fixed; box-shadow: 0 0 40px 40px #f7f7f7; bottom:0; left:0; background: #000; width: 100%; text-align: center; display: -ms-flexbox; display: -webkit-box; display: flex; -ms-flex-direction: row; -webkit-box-orient: horizontal; -webkit-box-direction: normal; flex-direction: row; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-pack: center; -webkit-box-pack: center; justify-content: center; -ms-flex-line-pack: center; align-content: center; -ms-flex-align: center; -webkit-box-align: center; align-items: center;}
.emergency-page #emergency-dashboard .dashboard-nav.on {transform: translateY(0); opacity:1;  pointer-events: all}
.emergency-page #emergency-dashboard .dashboard-nav a {color: #ccc; font-size:0.875em; font-weight:500; line-height: 3rem; -ms-flex-order: 0; -webkit-box-ordinal-group: 1; order: 0; -ms-flex: 1 1 auto; -webkit-box-flex: 1; flex: 1 1 auto; -webkit-align-self: auto; -ms-flex-item-align: auto; align-self: auto;}
.emergency-page #emergency-dashboard .dashboard-nav a + a {border-left: 1px solid rgba(255,255,255,0.25)}
.emergency-page #emergency-dashboard .post-a-message {padding-left: 3.125rem}

#animated-graphic #graphic {display: block; width:100%; height: auto;}
#animated-graphic #background {display: none;}
#animated-graphic h2 {font-size: 1.5em; color: #000000;text-align: center; margin:0 auto 2em}
#animated-graphic h2:before {content: ""; display: block; margin: 0 auto 0.5rem; padding-bottom: 3.1875rem; background: url(/images/safety/life-vest.svg) no-repeat center / contain}
#animated-graphic h2:after {content: ""; display: block; margin: 0.5rem auto 0; width: 4.625rem; height: 0.375rem; background:#952C50 }
#animated-graphic .title {width: 100%; padding: 1em; position: relative; border-radius: 4px 4px 0 0; position:relative; background: #fff; border: 1px solid #6D858F;}
#animated-graphic .title h3 {font-size: 1.25rem; margin:0; color: #952C50; text-align: center;}
#animated-graphic .title h3 i {color: var(--dark-blue); display: block; margin-bottom: 0.25em}
#animated-graphic .safety-content {color:#fff; padding: 1.5em 1em; background: #002334; position:relative; z-index:2; border-radius: 0 0 4px 4px; margin:0 auto 2em}
#animated-graphic .safety-content > * {font-size:0.875em; line-height: 1.25em; padding:0}
#animated-graphic .safety-content > *:last-child {margin-bottom:0}
#animated-graphic .safety-content ul {margin: 0; padding:0}
#animated-graphic .safety-content ul li:before {content: "";background: #fff;top: 0.3125rem;left: 0.5rem;display: block;width: 5px;height: 5px;border-radius: 50%;}


/* TIMELINE ---------------------------- */
body.timeline .pageHeader {padding: 5em 1em;}
body.timeline .timeline-full {text-align: center;z-index: 2; position: relative;}
.timeline .content .wrap {
        padding-left: 5vw;
        padding-right: 5vw;
}
.timeline-item {margin-bottom: 3rem;}
.timeline-item img {
        max-width: 100%;
        height: auto;
}
.today {padding: 0 0 6em;}
.today h2 {font-size: 2.4375em;}
/* FOOTER ------------------------------ */
body>footer {text-align: center}
body>footer .fatFooter .tagline,
body>footer .fatFooter a {display: block; margin: 0 auto 2em}
        .interior>footer .fatFooter a.towline {margin-bottom: 0}
body>footer .fatFooter a.button {display: inline-block}
body>footer .fatFooter .social a {margin-bottom: 0}
body>footer .wrap {line-height:2em; display: -ms-flexbox;display: -webkit-box;display: flex;-ms-flex-direction: column;-webkit-box-orient: vertical;-webkit-box-direction: normal;flex-direction: column;-ms-flex-wrap: nowrap;flex-wrap: nowrap;-ms-flex-pack: start;-webkit-box-pack: start;justify-content: flex-start;-ms-flex-line-pack: stretch;align-content: stretch;-ms-flex-align: stretch;-webkit-box-align: stretch;align-items: stretch;}
body>footer .wrap div:not(#web-solutions) nav {display: block}
body>footer .wrap #web-solutions{-ms-flex-order: 2;-webkit-box-ordinal-group: 2;order: 2;}
body>footer .wrap nav a+span:before {content: "|"; margin: 0 0.5em}

.wrap.logos img {
        width: auto;
        height: 2em;
        display: block;
        margin: 1em auto;
    }

@media (max-width: 31.25em) {
        #content .photoright.larger-photo {
                max-width: 100%;
                float: none;
                margin: 1rem 0;
        }
}