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

body.slideNav {overflow: hidden;}

.mobile-hide {display: none}

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


/* HEADER ------------------------------ */
body>header{position: relative;}
body>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: .5;transition:left 0ms ease 0ms, opacity 200ms ease}
body > header .cookie-alert p {font-size: 0.875rem; padding:0}
body > header .cookie-alert button {margin-left: 1em;}
#brand {display: block; padding:1em}
#brand img {display: block; max-width: 100%; height:auto;}
#navContainer{position: fixed;left: 100%;top:0;bottom:0;width: 75%;max-height: 100vh;background-color:#0a5287;z-index:3;-webkit-transition: left 200ms ease;transition: left 200ms ease;overflow:auto;-webkit-overflow-scrolling: touch;}
        body.slideNav #navContainer{left: 25%;}
#navContainer nav{display: inline}
#navContainer ul{display: block;float: left;width: 100%;margin: 0;padding-left: 0}
#navContainer li {display:block;float: left;width: 100%; position: relative; border-top: 1px solid rgba(255,255,255,0.125)}
#navContainer li li {border: 0}
#navContainer a, #navContainer .menu{color:#fff;line-height:2.75em;padding:0 1rem;display:block;float: left;width: 100%}
#navContainer a:hover,#navContainer .menu:hover,
#navContainer li.on a{background-color:#2c7fbc;color: #fff}
#navContainer li.open{background-color: rgba(0,0,0,0.25)}
#navContainer li>span{display: block; background: rgba(0,0,0,0.25); position: absolute;right: 0;top: 0;width:2.75em;height: 2.75em;}
#navContainer li>span:before{content: ""; display: block; width: 50%; height: 0.0625rem; background-color: #fff; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%) rotate(90deg); transform-origin: center center;}
#navContainer li>span:after{content: ""; display: block; width: 50%; height: 0.0625rem; background-color: #fff; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); transform-origin: center center;}
#navContainer li.open > span:before {transform: translate(-50%, -50%)rotate(0deg);}
#navContainer li > span::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 ul ul {font-size: .8em;display: none}
#navContainer ul ul a {padding-left: 2rem}
#navContainer ul ul li.on a {background-color: #3a9de6}
#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;}
/* mobilenav */
#mobilenav{background-color: #3378aa;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 span{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 span svg{display:  inline-block; pointer-events: none; width:0.75em; height:auto; vertical-align: baseline; margin-left:0.25em}
#mobilenav span svg path {fill:#fff}
#mobilenav *+* {border-left: 1px solid #0a5287;}
#mobilenav a:hover, #mobilenav span:hover{color: #fff;background-color:#f03c5e}
/* hamburger */
.hamburger{height: 2em;width: 2em;display: block;position: fixed; pointer-events: none; right: 3px;top:3px;z-index:2;opacity: 0;background-color: #3378aa}
.hamburger path {fill:#fff;font-size: 1.75em;}
.hamburger svg {pointer-events: none; width: 1em; height:auto; position: absolute; top:50%; left:50%; transform: translate(-50%, -50%);}
.hamburger.on{opacity: 1; pointer-events: all;}


/* MAIN ------------------------------ */
#hero .rellax {transform: none !important;}
.interior main {padding: 0 1rem 2rem}

#sidenav {margin-top: 2em;}

#content > h1 {padding: 1em 1rem; width:calc(100% + 2rem); margin:0 -1rem 1.875rem; background:#ecf1f5; position:relative}

.twoCol, .threeCol, .resCol{
-webkit-column-rule:0;
        column-rule:0);
-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;}

#popover .container {width:100%;}
#popover .container .popover-wrap {width:100%}
#popover .container .popover-wrap h2 {font-size: 1.5rem;}
#popover .container .popover-wrap .content table td {font-size: 0.875rem; line-height: 1.25em;}

.home .homepage-alert {padding: 2em 1em}
.home .homepage-alert p {font-size: 1rem; line-height: 1.25em;}
.home main > .ribbon .title {font-size:1.5em}
.home main > .ribbon .wrap {padding: 3em 1em}
.home main > .welcome .wrap {background-size: 80% auto; background-position: center;}

.anchor-links .button {display: block; margin-bottom: 3px; text-align: center;}

.mobile-table thead {display: none}
.mobile-table tr,
.mobile-table tbody tr:nth-child(2n) {background:rgba(236,241,245,.5); margin-bottom: 1em;}
.mobile-table tr,
.mobile-table td {display: block; line-height: 1.25em;; overflow:auto; width: 100%; float:left; clear:both}
.mobile-table td {display: -ms-flexbox;display: -webkit-flex;display: flex;-webkit-flex-direction: column;-ms-flex-direction: column;flex-direction: column;-webkit-flex-wrap: nowrap;-ms-flex-wrap: nowrap;flex-wrap: nowrap;-webkit-justify-content: flex-start;-ms-flex-pack: start;justify-content: flex-start;-webkit-align-content: stretch;-ms-flex-line-pack: stretch;align-content: stretch;-webkit-align-items: stretch;-ms-flex-align: stretch;align-items: stretch;}
.mobile-table td {padding: 0 1em; color:#013255}
.mobile-table td .mobile-only {order:1; content:attr(data-attribute); line-height:1.125em; color:#666; font-weight: 400; font-style: italic; font-size: 0.75rem; display: block}
.mobile-table td .cell-content {order:2}
.mobile-table td+td .mobile-only {margin-top:0.5rem}
.mobile-table td:first-child {padding-top: 1em;}
.mobile-table td:last-child {padding-bottom: 1em;}
.mobile-table td:empty,
.mobile-table td .cell-content:empty,
.mobile-table td .cell-content:empty + .mobile-only {display: none;}
.mobile-table td  .cell-content div + div {margin-top: 0.25em; padding-top:0.25em; border-top: 1px dashed #ccc}

/* FOOTER ------------------------------ */
.fatFooter .navios-links {padding-left: 3.125rem; background: url(/images/shield.svg) no-repeat top right / 3rem auto}
.fatFooter .navios-links ul {margin:0}
.fatFooter .contact-callout,
.fatFooter .logos {text-align: center;}
.fatFooter .logos {margin-top:2em}

body>footer .wrap{font-size: 0.75rem; text-align: center; 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;}
#trexot-digital{-ms-flex-order: 1;-webkit-box-ordinal-group: 2;order: 1;}
body>footer .wrap nav a+span:before {content: "|"; margin: 0 0.5em}